@charset "utf-8";
/*================重置样式部分===============*/
html,
body,
div,
span,
object,
iframe,
table,
tr,
th,
td,
em,
img,
h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
dl,
dt,
dd,
ul,
li,
ol,
form,
label {
  border: 0 none;
  font-family: inherit;
  font-style: inherit;
  margin: 0;
  padding: 0;
}
body {
  font-family: 微软雅黑;
  font-size: 24px;
  max-width: 1680px;
  margin: 0 auto;

}
input,
select {
  font-size: 12px;
  line-height: 16px;
}
img {
  border: none;
}
a {
  text-decoration: none;
}
ul,
li,ol {
  list-style-type: none;
}

em,i{ font-style:normal}
.p_hide{ overflow:hidden}
.p_block{display: block}
.in-block{ display: inline-block}
.clearfix{ clear: both}
.tc{ text-align: center}
.font_no{ font-weight: normal}
.line30{line-height: 30px}
.line35{line-height: 35px}
.line40{line-height: 40px}
.line50{ line-height: 50px}
.mb50{ margin-bottom: 50px}
.p_pr{ position: relative}
.p_fl{ float: left}
.p_fr{ float: right}
.vem{ vertical-align: middle}

.font36{ font-size: 36px}
.font30{ font-size: 30px !important;}
.font24{ font-size: 24px}
.font20{ font-size: 20px !important;}
.font18{ font-size: 18px}
.font16{ font-size: 16px}

.col_blue{ color: #336699}
.col_white{ color: #fff}
.bg_blue{ background: #336699}
.bg_gray{ background: #f4f4f5}

.patb20{ padding: 20px 0 !important;}
.patb50{ padding: 50px 0 !important;}
.pa20{ padding:20px}
.pat50{ padding: 50px 0 0}
.mr20{ margin-right: 20px}

.wi{ width: 1200px}
.auto{margin: 0 auto}

.btn a {
  display: inline-block;
  padding: 15px 50px;
  color: #fff;
  border-radius: 10px;
  font-size: 36px;
  background: #ff9900;
  -webkit-box-shadow:0 0 10px #ccc;
  -moz-box-shadow:0 0 10px #ccc;
  box-shadow:0 0 10px #ccc;
}
.btn a i{ display: inline-block; width:28px; height: 28px; background: url("../images/r_ico.png") no-repeat; vertical-align: middle }

.ti{ padding: 80px 0 60px}
.ti .ti_db:before,.ti .ti_db:after{ content: ""; display: block; width: 160px; height: 1px; background: #a7a8ac; position: absolute; top:60px}
.ti .ti_db:before{ left: -180px}
.ti .ti_db:after{ right: -180px}


.banner{ width: 100%; margin: 0 auto}
.banner img{ width: 100%; vertical-align: middle}
.banner a{ display: block; width: 380px; height: 77px; position: absolute; right: 29%; bottom: 12%}

.p1 dl{ padding:40px 20px; border: 1px solid #ccc; margin-bottom: 50px}
.p1 dl dt i{ display: inline-block; vertical-align: middle; margin-right: 10px;width: 50px; height: 50px;}
.p1 dl dt i.grzl{  background: url("../images/ico1.png") no-repeat center}
.p1 dl dt i.zzjl{background: url("../images/ico2.png") no-repeat center}
.p1 dl dt p{ padding-left: 60px}
.p1 dl dd{ width: 545px; height: 710px;background: #fff;
  -webkit-box-shadow:0 0 10px #ccc;
  -moz-box-shadow:0 0 10px #ccc;
  box-shadow:0 0 10px #ccc; position: absolute; right: 56px; top:-43px;z-index: 999 }
.p1 dl dd img{ vertical-align: middle}
.p1 dl dd ul li{ width: 50%; float: left; background: #ff9900; padding: 28px 0}
.p1 dl dd ul li:nth-child(2),.p1 dl dd ul li:nth-child(3){ background: #333}

.p2 .name{ text-indent: 2em}
.p2 .Scroll{width:1200px;margin:15px auto;position:relative; height: 290px; overflow: hidden}
.p2 .Scroll .prev,.p2 .Scroll .next{width:26px;height:46px;position:absolute;top:100px;z-index:100; cursor:pointer; background:url(../images/prev.png) no-repeat;}
.p2 .Scroll .prev{left:0;}
.p2 .Scroll .next{background:url(../images/next.png) no-repeat;right: 0}
.p2 .Scroll .scrollWrap{width:1200px;margin-left:40px;padding-top:15px;overflow:hidden;position:absolute;}
.p2 .Scroll li{float:left;width:265px;text-align:center;position:relative; margin-right:20px}
.p2 .Scroll li img{ padding: 5px; background: #fff}
.p2 .Scroll li p{ font-size: 18px; color: #fff; padding: 10px 0; text-align: center}

.p3 ul{ padding-bottom: 40px}
.p3 ul li{ width: 348px;height: 404px; float: left; margin-right: 50px; position: relative}
.p3 ul li.mr0{ margin-right: 0}
.p3 ul li span{ display: block; opacity: 0; background: rgba(0,0,0,0.8); position: absolute; top:0; left: 0; padding: 20px 25px; height: 364px}
.p3 ul li span b{ color: #66ccff; display: block; text-align: center; padding: 40px 0}
.p3 ul li .btn{  position: absolute; bottom: 20px; left: 0; right: 0; margin: 0 auto}
.p3 ul li .btn a{ padding: 5px 20px; box-shadow:none; background: #ff6600}
.p3 ul li.active span{ opacity: 1;
  -webkit-animation: bounceY 0.9s linear;
  -moz-animation: bounceY 0.9s linear;
  -ms-animation: bounceY 0.9s linear;
  animation: bounceY 0.9s linear;
}


.p4 dl dt{ position: absolute; left: -40px; top:0}
.p4 dl dd{ width: 544px;float: right; padding-top: 100px}
.p4 dl dd .btn a{ background: #666699}
.p4 .db{position: relative;z-index: 2;}
.p4 .tii{ background: url("../images/p4-bg.png") no-repeat; width: 318px;height: 69px; line-height: 69px}
.p4 ul{  background:#4d82bf;  overflow: hidden}
.p4 ul li{ width: 344px; display: inline-block; margin-right: 50px; }
.p4 ul li.mr0{ margin-right: 0}
.p4 ul li img{  -webkit-box-shadow:0 0 10px #666;  -moz-box-shadow:0 0 10px #666;  box-shadow:0 0 10px #666;  }
.p4 ul li a{ color: #fff}
.p4 ul li p i{ display: inline-block; width:30px; height: 30px; background: url("../images/r.png") no-repeat; vertical-align: middle; margin-left: 10px }


.p5{ height: 715px; margin: 148px auto 80px;width: 1080px; padding: 20px 60px}
.p5 dl dt{ width: 610px}
.p5 dl dt .ti{ padding:20px; border-bottom: 1px solid #fff}
.p5 dl dt .btn a{ background: #333; box-shadow: none}
.p5 dl dd{ position: absolute;right: 0; bottom: 0}
.p5 dl dd p{ padding:30px;background: rgba(255,102,0,0.8); position: absolute; right: 0; bottom: 100px; line-height:40px; width: 70%}
.p5 .Scroll{width:612px;margin:0 auto;position:relative; height: 430px; overflow: hidden}
.p5 .Scroll .prev,.p5 .Scroll .next{width:26px;height:46px;position:absolute;top:100px;z-index:100; cursor:pointer; background:url(../images/prev.png) no-repeat;}
.p5 .Scroll .prev{left:0;}
.p5 .Scroll .next{background:url(../images/next.png) no-repeat;right: 0}
.p5 .Scroll .scrollWrap{width:532px;margin-left:40px;padding-top:15px;overflow:hidden;position:absolute;}
.p5 .Scroll li{float:left;width:532px;position:relative;}
.p5 .Scroll li img{ padding: 10px; background: #fff}
.p5 .Scroll li p{ font-size: 18px; color: #fff; padding: 10px 0; line-height: 30px}



.p6 dl dt{ width: 371px}
.p6 dl dd{ width: 825px; padding-top: 150px}
.p6 dl ul li{ float: left; font-size: 18px; position: relative;margin-right: 5px; text-align: center; color: #fff; margin-bottom: 1%}
.p6 dl ul li img{ vertical-align: middle}
.p6 dl ul li p{ position: absolute; bottom: 0; left: 0; width: 96%; padding: 0 2%; background: #4d82bf}

.p7{ background: url("../images/p-img_66.jpg") no-repeat center bottom}

.p7 ul{ width: 800px}
.p7 ul li{ clear: both}
.p7 ul li dl dt{ width:119px; float: left; border-radius: 50%}
.p7 ul li dl dd{ float: left; background: #487bb5;border-radius: 50px; padding: 30px 40px; margin: 20px 0; position: relative}
.p7 ul li dl dd:before{ content: ""; display: block; width:0;  height:0;border-top:12px solid transparent; border-bottom:12px solid transparent;position: absolute; top:30px   }
.p7 ul li dl dd.talk_l:before{  border-right:12px solid #487bb5; left: -10px; }
.p7 ul li dl dd.talk_r{ background: #ff6600; color: #000; line-height: 30px; color: #fff}
.p7 ul li dl dd.talk_r:before{  border-left:12px solid #ff6600; right: -10px; top: 40px }
.p7 ul li dl dd.talk_r p{ width: 580px}
.p7 ul li a{ color: #fff}
.p7 .tw{ padding: 30px; background: #487bb5; margin-top: 40px}
.p7 .tw i{ display: inline-block; width: 172px; height: 172px; color: #fff; text-align: center; line-height: 172px; font-size: 150px; background: #385e97; border-radius: 50%}
.p7 .tw ol{ width: 448px; padding: 40px 30px; background: #fff}
.p7 .tw ol li{ clear: both;line-height: 38px; margin-bottom: 17px}
.p7 .tw ol li:nth-child(even){ margin-bottom: 0}
.p7 .tw ol li a{ display: block; float: right; border-radius: 10px; background: #ffcc66; color: #000;
  width: 113px; height: 38px; text-align: center}
.p7 .tw form{ margin: 38px 50px 0 50px}
.p7 .tw form input{ width: 300px; padding: 15px; background: #fff; border-radius: 5px; border: 0; font-size: 18px }
.p7 .tw form a{ padding: 10px 70px; font-size: 18px; background: #ffcc66; box-shadow: none; color: #333}

.p8{ padding: 70px 0}
.p8 h3{ font-size: 36px;}
.p8 h3:before,.p8 h3:after{ content: ""; display: inline-block; height: 1px; width: 75px; background: #a9bad2;vertical-align: middle}
.p8 h3:before{ margin-right: 20px}
.p8 h3:after{ margin-left: 20px}
.p8 ul{ margin-top: 55px; height: 330px}
.p8 ul li{ width: 380px; float: left; margin-right: 30px; background: #fff; height: 302px; text-align: left; position: relative; z-index: 2}
.p8 ul li:nth-last-child(1){ margin-right: 0}
.p8 ul li a{ }
.p8 ul li img{position: absolute; right: 0; bottom: 0}
.p8 ul li span{ display: block;width: 140px; margin: 50px 0 0 20px; position: relative;z-index: 1}
.p8 ul li p{ color: #666; padding: 10px 0; line-height: 35px}
.p8 ul li .inner{ position: absolute; top:0; left: 0;z-index: 2; width: 100%; background: #fff; height:  302px}

.p8 ul li:before {
  -webkit-transform: skew(-15deg) rotate(-6deg);
  -moz-transform: skew(-15deg) rotate(-6deg);
  transform: skew(-15deg) rotate(-6deg);
  left: 15px;
  z-index: -2;
}
.p8 ul li:after {
  -webkit-transform: skew(15deg) rotate(6deg);
  -moz-transform: skew(15deg) rotate(6deg);
  transform: skew(15deg) rotate(6deg);
  right: 15px;
  z-index: -1;
}

.p8 ul li:before, .p8 ul li:after {
  width: 70%;
  height: 55%;
  content: ' ';
  -webkit-box-shadow: 0 8px 16px rgba(0, 0, 0,0.5);
  -moz-box-shadow: 0 8px 16px rgba(0, 0, 0,0.5);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.5);
  position: absolute;
  bottom: 10px;

}

.p8 .btn {
  display: inline-block;
  border-radius: 10px;
  padding: 10px 40px; font-size: 18px; background: #ffcc66;color: #333
}
.p8 a{ color: #333}



@keyframes bounceY {
  0% { transform: translateY(-205px);}
  40% { transform: translateY(-100px);}

  55%, 75%, 87%, 97%, 100% { transform: translateY(0px);}
}
@-moz-keyframes bounceY {
  0% { -moz-transform: translateY(-205px);}
  40% { -moz-transform: translateY(-100px);}

  55%, 75%, 87%, 97%, 100% { -moz-transform: translateY(0px);}
}
@-webkit-keyframes bounceY {
  0% { -webkit-transform: translateY(-205px);}
  40% { -webkit-transform: translateY(-100px);}

  55%, 75%, 87%, 97%, 100% { -webkit-transform: translateY(0px);}
}