﻿@charset "utf-8";
/* CSS Document */
/*common*/
.mb10 { margin-bottom:10px;}
.ml10 { margin-left:10px;}
.bg { background:#FFF;}
em,i{ font-style:normal;}

body{min-width: 1200px; width: 100%;overflow-x: hidden;}


.banner{  overflow:hidden; text-align:center; position:relative; z-index:1;}
.banner1{ overflow:hidden;}
.banner1 .li1 a{ display:block;height:900px; overflow:hidden;}
.banner .slick-prev{ width:80px; height:80px; background:url(/images/ban_l.png) no-repeat center rgba(0,0,0,0.7); overflow:hidden; position:absolute; bottom:0; left:50%; margin-left:420px;}
.banner .slick-next{ width:80px; height:80px;background:url(/images/ban_r.png) no-repeat center rgba(0,0,0,0.7); overflow:hidden; position:absolute;bottom:0; left:50%;margin-left:500px;}
.banner .slick-prev:hover{background:url(/images/ban_l.png) no-repeat center rgba(0,0,0,0.5);}
.banner .slick-next:hover{background:url(/images/ban_r.png) no-repeat center rgba(0,0,0,0.5);}
.banner .slick-prev:hover,.banner .slick-next:hover{-webkit-transition:all 0.7s;
	transition:all 0.7s;transition-property:background;
-moz-transition-property: background; /* Firefox 4 */
-webkit-transition-property:background; /* Safari 和 Chrome */
-o-transition-property:background;}

.ban_arr{ width:80px; height:80px; margin:-100px auto 0; position:relative; z-index:5;}
.ban_arr img{ display:block;width:80px; height:80px;}

.service dt{ width:50%; float:left; overflow:hidden;}
.service dt img{ display:block; width:100%;-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;}
.service dt a:hover img{-webkit-transform:scale(1.1,1.1);
    -moz-transform:scale(1.1,1.1);
    -transform:scale(1.1,1.1);}
.service dd{ width:33.85%; float:left; padding:8% 0 0 2.86%;}
.service dd h3{ font:55px "Microsoft YaHei"; color:#333333;}
.service dd h3 a{ display:block; color:#333333;}
.service dd h3 img{ display:block; width:100%; margin-top:8px;}
.service dd p{ font:16px "Microsoft YaHei"; line-height:28px; color:#333333; margin:16px 0; max-height:140px; overflow:hidden;}
.service dd span a{ display:block; width:140px; height:42px; border:1px solid #999; text-align:center; font:16px "Microsoft YaHei"; line-height:42px; color:#333;}
.service dd span a:hover{ color:#fff; background:#0056b6; border:1px solid #0056b6;-webkit-transition:all 0.7s;
	transition:all 0.7s;transition-property:background;
-moz-transition-property: background; /* Firefox 4 */
-webkit-transition-property:background; /* Safari 和 Chrome */
-o-transition-property:background;}

@keyframes ripple {
0% {
 
opacity:0.5;
transform:scale(1);
}
100% {
 
opacity: 0;
transform:scale(1.5);
}
}

.buss{ height:815px; background:url(/images/buss_bg.jpg) no-repeat center top; padding-top:50px; overflow:hidden;}
.buss h2{ text-align:center; height:170px; overflow:hidden;}
.buss .content{ position:relative; height:630px;}
.buss dl{ position:relative;}
.buss dt{ width:127px; height:127px; position:relative; text-align:center; font:16px "Microsoft YaHei"; font-weight:bold; background:url(/images/buss_bg1.png) no-repeat; z-index:1;}
.buss dt:before{ content:""; position:absolute; top:120px; left:62px; width:3px; height:250px; background:url(/images/buss_line1.png) no-repeat; z-index:0;}
.buss dt:after{content:""; position:absolute; top:0px; left:0; width:127px; height:127px; background:url(/images/buss_bg1.png) no-repeat; z-index:-1;}
.buss dt a{ display:block; padding:0 20px; color:#fff; font-size:15px; font-weight:normal;}
.buss dt em{ display:block; width:60px; height:60px; margin:0 auto; padding-top:15px;}
.buss dt em img{display:block; width:60px; height:60px;}
.buss dd{ display:none; width:370px; height:179px; background:url(/images/buss_bg.png) no-repeat; position:absolute; top:-20px; left:0px; z-index:5;}
.buss dd h3 a{ display:block; font:18px "Microsoft YaHei"; font-weight:bold; color:#fff; height:40px; line-height:40px; padding:9px 0 0 36px;}
.buss dd p{ width:310px; padding:10px 0 0 36px; font:14px "Microsoft YaHei"; line-height:22px; overflow:hidden; color:#333333;}
.buss dd span a{ display:block;font:14px "Microsoft YaHei"; line-height:22px; overflow:hidden; color:#333333;padding:0 0 0 36px; height:22px; color:#6e63a9;}

.buss .dl01{ position:absolute; top:118px; left:252px;}
.buss .dl02{position:absolute; top:295px; left:350px;}
.buss .dl02 dt:before,.buss .dl04 dt:before,.buss .dl06 dt:before,.buss .dl08 dt:before,.buss .dl10 dt:before{background:url(/images/buss_line3.png) no-repeat; height:170px;}
.buss .dl03{position:absolute; top:0; left:446px;}
.buss .dl04{ position:absolute; top:195px; left:528px;}
.buss .dl04 dd span a{ margin-top:-22px; position:relative; padding-left:160px;}
.buss .dl05{position:absolute; top:93px; left:656px;}
.buss .dl06{position:absolute; top:280px; left:698px;}
.buss .dl06 dd{}
.buss .dl06 dt{ width:143px; height:143px; background:url(/images/buss_bg3.png) no-repeat;}
.buss .dl06 dt a{ padding:0 10px;}
.buss .dl06 dt:before{ content:""; position:absolute; top:136px; left:70px; width:3px; height:250px; background:url(/images/buss_line3.png) no-repeat;}
.buss .dl07{position:absolute; top:8px; left:805px;}
.buss .dl08{position:absolute; top:204px; left:888px;}
.buss .dl09{position:absolute; top:80px; left:997px;}
/*
.buss .dl09 dd,.buss .dl10 dd{background:url(/images/buss_bg5.png) no-repeat; left:-350px;}
*/
.buss .dl10{position:absolute; top:260px; left:1073px;}

.buss dl.hov dd{ background:url(/images/buss_bg5.png) no-repeat;}
.buss dl.cur dt{ background:url(/images/buss_bg2.png) no-repeat;-webkit-transition:all 3s;
	transition:all 3s ease; transition-property:background;
-moz-transition-property: background; 
-webkit-transition-property:background;
-o-transition-property:background; }
.buss dl.cur dt:before{background:url(/images/buss_line2.png) no-repeat;}

.buss dl.cur dt:after{-webkit-animation:ripple 1s ease-in-out 0.5s infinite;  animation-fill-mode:none; background:url(/images/buss_bg2.png) no-repeat;}

.buss .dl02.cur dt:before,.buss .dl04.cur dt:before,.buss .dl06.cur dt:before,.buss .dl08.cur dt:before,.buss .dl10.cur dt:before{background:url(/images/buss_line4.png) no-repeat;}
.buss dl.dl06.cur dt{ background:url(/images/buss_bg4.png) no-repeat;}

/*
.buss dl:hover dd{ display:block;}
.buss dl:hover dt{ background:url(/images/buss_bg2.png) no-repeat;-webkit-transition:all 3s;
	transition:all 3s ease; transition-property:background;
-moz-transition-property: background; 
-webkit-transition-property:background;
-o-transition-property:background; }
.buss dl:hover dt:before{background:url(/images/buss_line2.png) no-repeat;}


.buss .dl02:hover dt:before,.buss .dl04:hover dt:before,.buss .dl06:hover dt:before,.buss .dl08:hover dt:before,.buss .dl10:hover dt:before{background:url(/images/buss_line4.png) no-repeat;}
.buss dl.dl06:hover dt{ background:url(/images/buss_bg4.png) no-repeat;}
*/

.case{ margin-top:30px;}
.case h2{ text-align:center; height:170px;}
.caset{ height:111px; background:url(/images/case_linee.gif) repeat-x center top;}
.caset li,.caset h5{ width:150px; height:111px; float:left; font:16px "Microsoft YaHei"; text-align:center;}
.caset li a,.caset h5 a{ display:block; width:149px; height:86px; padding-top:25px; border-right:1px solid #e6e6e6; color:#333;}
.caset li span,.caset h5 span{ display:block; width:40px; height:40px; margin:0 auto 8px;position:relative;}
.caset li span em,.caset h5 em{position:absolute;width:100%;height:100%;top:0;left:0;-webkit-transition: all 0.4s linear;transition: all 0.4s linear;}
.caset li span i,.caset h5 i{position:absolute;width:100%;height:100%;top:0;left:0;opacity:0;visibility:hidden;
	-webkit-transform:translate3d(0,0,-65px) rotate3d(1,0,0,90deg);
	transform:translate3d(0,0,-65px) rotate3d(1,0,0,90deg);
	-webkit-transform-origin:50% 0%;
    transform-origin:50% 0%;
    -webkit-transition:all 0.4s linear;
    transition:all 0.4s linear;}
.caset li img,.caset h5 img{display:block; width:40px; height:40px;}
.caset li a:hover,.caset .cur a,.caset h5 a:hover{background:url(/images/case_bg1.png) no-repeat center top; position:relative; z-index:5; height:101px; border:0; margin-top:-3px; color:#fff;}
.caset li a:hover em,.caset .cur em,.caset h5 a:hover em{opacity:0;visibility:hidden;-webkit-transform:translate3d(0,65px,0) rotate3d(1,0,0,-90deg);transform:translate3d(0,65px,0) rotate3d(1,0,0,-90deg);}
.caset li a:hover i,.caset .cur i,.caset h5 a:hover i{opacity:1;visibility:visible;-webkit-transform:rotate3d(1,0,0,0deg);transform:rotate3d(1,0,0,0deg);}

.case2{ display:flex;justify-content: flex-start;flex-wrap: wrap;}
.case2 dl{ width:33.33%; float:left; overflow:hidden; position:relative; }
.case2 dt{ width:100%; position:relative;}
.case2 dt img{ display:block; width:100%;}
.case2 dt em{ display:block; width:100%; height:100%; padding-top:28%; box-sizing:border-box; background:rgba(0,0,0,0.6); text-align:center; font:18px "Microsoft YaHei"; color:#fff; position:absolute; top:0;}
.case2 dd{-webkit-transition:1s;
-moz-transition: 1s;
transition:1s; opacity:0; width:100%; height:100%; padding-top:15%; box-sizing:border-box; background:rgba(0,86,182,0.9); text-align:center; font:18px "Microsoft YaHei"; color:#fff; position:absolute; top:0;}
.case2 dd h3{ font:20px "Microsoft YaHei"; font-weight:bold; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-left:10px; margin-right:10px;}
.case2 dd p{ font:16px "Microsoft YaHei"; line-height:24px; padding:2% 5% 0 5%;}
.case2 dd em{ display:block; width:140px; height:40px; margin:3% auto 0; border:1px solid #fff; font:16px "Microsoft YaHei"; text-align:center; line-height:40px;}
.case2 dl:hover dt em{ opacity:0;-webkit-transition:1s;
-moz-transition: 1s;
transition:1s;}
.case2 dl:hover dd{opacity:1;-webkit-transition:1s;
-moz-transition:1s;
transition:1s;}

.ys{ position:relative;}
.ys h2{ text-align:center; padding:30px 0; background:#f2f2f2;}
.ys dt{ width:50%; float:right; overflow:hidden;}
.ys dt img{ display:block; width:100%;-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;}
.ys dt:hover img{ /* -webkit-transform:scale(1.1,1.1);
    -moz-transform:scale(1.1,1.1);
    -transform:scale(1.1,1.1); */}
.ys dd{ width:31.25%; float:left; padding:5% 0 0 12%;}
.ys dd h3 img{display:block; width:100%;}
.ys dd p{ font:16px "Microsoft YaHei"; line-height:30px; color:#333; margin-top:3%;}
.ys dd span a{display:block; width:140px; height:42px; border:1px solid #999; text-align:center; font:16px "Microsoft YaHei"; line-height:42px; color:#333; margin-top:3%;}
.ys dd span a:hover{ color:#fff; background:#0056b6; border:1px solid #0056b6;-webkit-transition:all 0.7s;
	transition:all 0.7s;transition-property:background;
-moz-transition-property: background; /* Firefox 4 */
-webkit-transition-property:background; /* Safari 和 Chrome */
-o-transition-property:background;}
.arr01 a{ display:block; background:rgba(0,0,0,0.7) url(/images/ys_l.png) no-repeat; width:80px; height:80px; position:absolute; bottom:0; left:50%; margin:0 0 0 -160px; z-index:5;}
.arr02 a{ display:block; background:rgba(0,0,0,0.7) url(/images/ys_r.png) no-repeat; width:80px; height:80px; position:absolute; bottom:0; left:50%; margin:0 0 0 -80px; z-index:5;}
.arr01 a:hover{ background:rgba(0,0,0,0.5) url(/images/ys_l.png) no-repeat; }
.arr02 a:hover{ background:rgba(0,0,0,0.5) url(/images/ys_r.png) no-repeat; }

.yun li{ width:50%; float:left; position:relative; overflow:hidden;}
.yun li img{ display:block; width:100%;webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;}
.yun li p{ font:36px "Microsoft YaHei"; color:#fff; position:absolute; bottom:6%; left:3%;}
.yun li p em{ display:block; width:22.4375rem;}
.yun li p em img{ display:block; width:100%;}
.yun li p i{ display:block; font:16px "Microsoft YaHei";}
.yun li a:hover img{-webkit-transform:scale(1.1,1.1);
    -moz-transform:scale(1.1,1.1);
    -transform:scale(1.1,1.1);}
.yun li a:hover p em img{-webkit-transform:scale(1,1);
    -moz-transform:scale(1,1);
    -transform:scale(1,1);}

.coop{ height:140px; max-width:1400px; width:100%; margin:38px auto 0; overflow:hidden;}
.coop h2{ width:12.64%; height:auto; float:left; overflow:hidden; margin-top:5px;}
.coop h2 img{ display:block;width:100%;}
.coop1{ width:85.7%; float:right; position:relative;}
.coop2{ width:90.83%; margin:0 auto; overflow:hidden;}
.coop1 li{ width:145px; float:left; display:inline;margin:5px 15px; border:1px solid #ccc; }
.coop1 li img{ display:block;width:100%;}
.coop1 li:hover{box-shadow:0.1rem 0.1rem 0.5rem 0.1rem #999;}
.arr03{ position:absolute; top:24px; left:0;}
.arr04{ position:absolute; top:24px; right:0;}

/*
@media (min-width: 1199px) and (max-width: 1920px) {
.coop{ height:140px; min-width:1400px; width:72.92%; margin:38px auto 0; overflow:hidden;}
.coop1 li{ width:145px; height:95px; float:left; display:inline;margin:5px 18px; border:1px solid #ccc;}
.arr03{ position:absolute; top:30px; left:0;}
.arr04{ position:absolute; top:30px; right:0;}
}
*/


.new{ height:695px; background:#f2f2f2; padding-top:33px; overflow:hidden;}
.new h2{ text-align:center; height:170px; overflow:hidden;}
.new1{ width:575px; overflow:hidden;}
.newt{ height:40px; overflow:hidden; position:relative;}
.newt ul{ width:266px; height:40px; float:left; background:#e6e6e6; border-radius:0.2rem;}
.newt li{ width:133px; float:left; height:40px; font:18px "Microsoft Yahei"; font-weight:bold; line-height:40px;border-radius:0.2rem;}
.newt li a{ display:block; color:#333; text-align:center;}
.newt li a:hover,.newt .cur a{ background:#0056b6; color:#fff;border-radius:0.2rem;}
.newt h5 a{ display:block; float:right; height:40px; font:16px "Microsoft Yahei"; line-height:40px; text-decoration:underline; color:#999;}
.new1 dl{ padding-top:25px;}
.new1 dt{ font:16px "Microsoft Yahei"; line-height:30px; height:30px; overflow:hidden;}
.new1 dt a{ display:block; color:#333;}
.new1 dt a:hover{ font-weight:bold; color:#0056b6;}
.new1 dt em{ float:right; color:#999;}
.new1 dd{ font:16px "Microsoft Yahei"; color:#999; line-height:30px; height:30px; overflow:hidden;}

.about{ height:820px; padding-top:39px; background:url(/images/about_bg.jpg) no-repeat center top;}
.about h2{ text-align:center; height:155px;}
.about p{ text-align:center; font:16px "Microsoft Yahei"; color:#fff; height:64px; overflow:hidden;}
.about_pic{ width:847px; overflow:hidden;}
.about_pic li{ width:350px; height:248px; float:left; overflow:hidden; position:relative;}
.about_pic li img{ display:block; width:100%; height:100%;-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;}
.about_pic li span{ display:block; font:18px "Microsoft Yahei"; color:#000; line-height:30px; position:absolute; top:26px; left:23px;}
.about_pic li i{ display:block; font:22px Arial, Helvetica, sans-serif; font-weight:bold; text-transform:uppercase;}
.about_pic li em{ width:9px; height:15px; display:inline-block; margin-left:8px; background:url(/images/about_arr.png) no-repeat left center;}
.about_pic li:nth-child(2),.about_pic li:nth-child(3){ width:497px; height:248px;}
.about_pic li a:hover img{-webkit-transform:scale(1.1,1.1);
    -moz-transform:scale(1.1,1.1);
    -transform:scale(1.1,1.1);}
.about_pic li a:hover span{ color:#0056b6;}

.honor{ width:353px; float:left; background:url(/images/honor_bg.jpg) no-repeat center top; height:496px; overflow:hidden;}
.honor h3{ font:18px "Microsoft Yahei"; color:#fff; padding:26px 0 0 23px; height:127px; overflow:hidden;}
.honor h3 i{display:block; font:22px Arial, Helvetica, sans-serif; font-weight:bold; text-transform:uppercase;}
.honor h3 a{ display:block; color:#000;}
.honor h3 b{ display:block; font-size:36px; font-family: Arial, Helvetica, sans-serif; text-transform:uppercase;}
.honor h3 em{width:9px; height:15px; display:inline-block; margin-left:8px; background:url(/images/about_arrrr.png) no-repeat left center;}
.honor1{ width:305px; margin:0 auto; position:relative;}
.honor2{ width:200px; height:290px; margin:0 auto; overflow:hidden;}
.honor1 li{width:200px; height:290px; float:left; overflow:hidden;}
.honor1 li img{ display:block;width:200px; margin-top:30%; }
.arr05{ width:21px; height:39px; position:absolute; top:124px; left:0;}
.arr06{ width:21px; height:39px; position:absolute; top:124px; right:0;}


/*animation*/
@-webkit-keyframes hvr-buzz-out {
  10% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  20% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  30% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  40% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  60% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  70% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  80% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  90% {
    -webkit-transform: translateX(1px) rotate(0);
    transform: translateX(1px) rotate(0);
  }
  100% {
    -webkit-transform: translateX(-1px) rotate(0);
    transform: translateX(-1px) rotate(0);
  }
}
@keyframes hvr-buzz-out {
  10% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  20% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  30% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }
  40% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }
  50% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  60% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  70% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }
  80% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }
  90% {
    -webkit-transform: translateX(1px) rotate(0);
    transform: translateX(1px) rotate(0);
  }
  100% {
    -webkit-transform: translateX(-1px) rotate(0);
    transform: translateX(-1px) rotate(0);
  }
}