@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;}


.search{ background:url(../images/serbg.jpg) no-repeat center 0;height:74px; line-height: 74px; overflow: hidden; }
.search p{ width:500px; float: left; font-size: 14px; color:#333333; font-weight: bold;}
.search p img{vertical-align: middle; margin-right: 10px;}
.search p a{display: inline-block;padding: 0 20px;color:#333;font-weight: normal;}
.search p a:hover{ font-weight:bold; color:#0eb2a4; text-decoration:underline;}
.searchbox{ width:575px; float: right; position: relative;background:url(../images/serico02.png) no-repeat 0 center;padding-left: 60px;-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;}
.searchbox .inp01{width:312px;;height:74px; line-height: 74px; font-size: 14px; color:#fff; border:0;background:none; float: left; outline:none;}
.searchbox::before{position: absolute; content:""; width:1px; height:22px; background:#3ec1b6; top: 26px; left: 48px;}
.searchbox .inp02{width:200px; float: left;background:#17a599 url(../images/serbtn.png) no-repeat center center;border:0; height:74px;outline:none;}

.brand{background:#f7f7f7;height:672px; overflow: hidden;padding-top: 100px;}
.brand .content{  height:515px; overflow: hidden;}
.brandwz{ position: relative;margin-left: -26px; padding-left: 59px; width:507px;background:url(../images/brande.jpg) no-repeat 0 19px; float: left;}
.brandwz dt{background:url(../images/brandt.gif) no-repeat 0 0; padding-top: 28px; font-size: 40px; color:#363636; height:164px;-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;}
.brandwz dt span{display: block; font-size: 48px; color:#0eb2a4;font-weight: bold;}
.brandwz dd p{padding-top: 22px; font-size: 14px; line-height: 30px; color:#7c7c7c;}
.brandwz dd span{display: block; margin-top: 48px; width:188px; height:48px; background:#0eb2a4; border-radius: 30px;text-align: center; font-size: 14px; line-height: 48px;}
.brandwz dd span img{vertical-align: middle;margin-left: 20px;}
.brandwz dd span a{ color:#fff;}

.brandimg{ margin-top: 12px; width:600px; overflow: hidden; float: right; position: relative;}
.brandimg img{ width:600px;height:453px;}
.brandtil {position: absolute; bottom:0;left: 0;height:36px;text-align: center;width:100%;}
.brandtil  span{display: inline-block;width:13px; height:13px; background:#fff;border-radius: 100%; margin:0 6px;}
.brandtil  span.cur{width:43px; border-radius: 10px;background:#0eb2a4;}

.brandsz{ width:1200px; margin: 0 auto;}
.brandsz li { float: left; width:120px; position: relative;font:16px/24px "Microsoft YaHei UI"; color:#666666;text-align: center; margin-right: 30px; }
.brandsz li:before{ content:""; position:absolute; top:25px; right:-80px; width:130px; height:1px; background:#c5c5c5;}
.brandsz li:nth-child(1){ margin-right:70px;}
.brandsz li:nth-child(1):before{ right:-130px;}
.brandsz li:nth-child(2){ width:309px;}
.brandsz li:nth-child(3){ margin-right:0; width:363px;}
.brandsz li:last-child{ margin-right: 0; float:right; width:195px;}
.brandsz li:last-child::before{background:none;}
.brandsz li span{ display:block; font:60px/60px Arial, Helvetica, sans-serif;font-weight: bold; color:#333333;}
.brandsz li em{ display:inline-block; width:26px; height:26px; border-radius:26px; background:#0eb2a4; font:16px "Microsoft YaHei UI"; text-align:center; line-height:26px; color:#fff;}

.tit01{ font:50px "Microsoft YaHei"; text-align:center; color:#333333;line-height: 50px; overflow: hidden;}
.tit01 a{ display:inline-block; color:#333333; font-weight: bold;}
.tit01 span{ display:block;color:#666666; font-size: 20px;font-weight: normal;}
.tit01 em{ position:relative;}
.tit01 em:before{ content:""; position:absolute; top:35px; left:-505px;background:url(../images/proline01.png) no-repeat;height:7px; width:489px;}
.tit01 em:after{content:""; position:absolute; top:35px; right:-505px;background:url(../images/proline02.png) no-repeat;height:7px; width:489px;}

.pro{height:1130px; width:1200px; margin: 80px auto 0; font-family:  "Microsoft YaHei";}
.pro .tit01{height:118px;}
.pronav{height:123px; overflow: hidden;text-align: center;}
.pronav h3 {display: inline-block;padding: 0 40px; position: relative;}
.pronav h3 a{ color:#26262b; font-size: 24px;}
.pronav h3 img{ width:70px; height:70px; display: block; margin: 0 auto;}
.pronav h3::before{position: absolute; content:""; width:1px; height:86px; background:#e0e0e0; top: 9px;right: 0;}
.pronav h3:last-child::before{height:0;}
.pronav .cur a{ color:#17a599;}

.pro_c dl{height:479px; overflow: hidden;}
.pro_c dt{width:639px; height:479px;  float: left;}
.pro_c dt img{display: block;width:639px; height:479px; overflow:hidden;}
.pro_c dt a:hover img{width:631px; height:471px; border:4px solid #17a599;}
.pro_c dd{ width:512px; height: 400px; border:5px solid #f2f2f2; border-left: 0;padding: 69px 19px 0 25px; background:#f8f8f8; float: left;}
.pro_c dd h3{ font-size: 30px; line-height: 32px;}
.pro_c dd h3 a{ color:#26262b;}
.pro_c dd h3 span{display: block; font-size: 14px; color:#c9c9c9;font-weight: normal;font-family: Arial;}
.prowz{ margin-top: 12px;height:165px; border-bottom: 1px dashed #d7d7d7; overflow: hidden; position: relative;}
.prowz::before{position: absolute; content:""; width:1px;height:109px; background:#d0d0d0; top: 19px; left: 4px;}
.prowz p{ padding-left: 18px; font-size: 14px; line-height: 36px; color:#666666; position: relative;}
.prowz p::before{position: absolute; content:"";width:9px; height:9px;background:#d0d0d0;border-radius: 100%; top: 15px;left: 0;}
 
.ptel{background:url(../images/tel.png) no-repeat left 5px; margin-top: 32px; font-size: 14px; color:#666666; padding-left: 64px; }
.ptel span{display: block; font-size: 36px; color:#666666;font-weight: bold; font-family: Arial;}

.pro_ul{ margin-top:14px ; position: relative;}
.proprev{position: absolute; top: 130px; left: -32px; width:17px; height:32px;background:url(../images/proprev.png) no-repeat left 0;}
.pronext{position: absolute; top: 130px; right: -32px; width:17px; height:32px;background:url(../images/pronext1.png) no-repeat left 0;}
.proprev:hover{background:url(../images/proprev1.png) no-repeat left 0;}
.pronext:hover{background:url(../images/pronext.png) no-repeat left 0;}

.proimg1{ width:1200px;}
.proimg1 ul{ width:100%;}
.proimg li{ width:290px; margin-right: 12px; float: left; overflow: hidden;text-align: center; line-height: 30px;}
.proimg li img{ width:290px;height:290px;}
.proimg li h4{display: block; font-size: 16px; color:#666666; padding-top: 5px; font-weight:normal;}
.proimg li a:hover h4{ font-weight:bold; color:#0eb2a4;}

.proys{height:881px;background:url(../images/proysbg.jpg) no-repeat center 120px; max-width:1920px; margin: 0 auto; font-family: "Microsoft YaHei UI";}
.proys1{ width:1200px; margin:0 auto;}
.proys .tit01{height:120px;}
.proysimg { width:960px; height:761px; float:left; margin-left:-360px;}
.proys img{ display:block;width:100%;}
.proysbox{ float:right;width:610px; margin:75px -50px 0 0; position:relative;}
.proysbox li{ float: left; width:278px; height:208px; float:left; margin-right:15px;}
.proysbox li span{display: block;font-size:22px; color:#fff;text-align: center; text-transform:uppercase; height:35px; position: absolute; bottom:0;left: 0; width:100%;}
.wk{position: relative; overflow: hidden;}
.proysbox li .proyswz{position: absolute; top: 0; left: 0; width:278px; height:191px;background:url(../images/yswz.jpg) no-repeat 0 bottom;display: none;}
.proysbox li .proyswz h4{ font-size: 24px; color:#17a599; padding:40px 0 15px; text-align:center; position:relative;}
.proysbox li .proyswz h4:before{ content:""; position:absolute; bottom:0; left:50%; width:30px; height:1px; background:#dfdfdf; margin-left:-15px;}
.proysbox li .proyswz p{ font-size:16px; color:#666666; line-height:24px; padding:10px 30px 0 30px; text-align:center;}
.proysbox li:hover .proyswz{display: block;}

.ys{height:2854px; background:#f6f6f6; overflow: hidden; position: relative; font-family: "Microsoft YaHei UI"; }
.ys .tit01{margin-top: 86px;}
.ys .tit01 em{width:304px;}
.ys .tit01 i{ color:#14a69a;}
.ysimg{position: absolute;width:960px; height:520px;}
.ysimg img{width:960px; height:520px;}
.ysimg1{ top: 233px; left: 50%; margin-left: 0;}
.ysimg2{position: absolute; top: 1020px; left: 50%; margin-left: -600px;}
.ysimg3{ top: 1700px; left: 50%; margin-left: -960px;}
.ysimg4{ top: 2220px; left: 50%; margin-left: 0;}
.ysimg2 p img{ width:1200px; height:471px;}
.ysimg2 li{ float: left; width:288px; height:163px; margin:18px 15px 0 0; overflow: hidden;}
.ysimg2 li img{ width:288px; height:163px;}
.ysimg2 li:last-child{margin-right: 0;}
.yswz{position: absolute;}
.yswz1{ width:960px; top: 261px; left: 50%; margin-left: -960px;}
.yswz2{ width:1200px; top: 800px; left: 50%; margin-left: -600px;}
.yswz3{ width:960px; top: 1731px; left: 50%; margin-left: 0;}
.yswz4{ width:960px; top: 2279px; left: 50%; margin-left: -960px;}
.yswz1 h4{ margin-left: 360px;background:url(../images/ysico01.png) no-repeat 0 top; }
.yswz2 h4{ background:url(../images/ysico02.png) no-repeat 0 top; width:500px; float: left; margin-top: 30px;}
.yswz3 h4{ margin-left: 50px; background:url(../images/ysico03.png) no-repeat 0 top; }
.yswz4 h4{ margin-left: 360px;background:url(../images/ysico04.png) no-repeat 0 top; }
.yswz h4{ font-size: 40px; height:120px; color:#14a69a;padding:10px 0 0  146px;-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box; }
.yswz h4 span{display: block; font-size: 36px; font-family: Arial; color:#999999;}
.yswz1 dl , .yswz4 dl{margin-top: 43px; border-bottom: 1px solid #cccccc; background:#fff;height:330px;padding: 44px 30px 0 360px;-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;}
.yswz3 dl{margin-top: 38px; background:#fff;height:330px;padding: 44px 0 0 48px; -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;}
.yswz2 dl{ width:600px; float: right;}
.yswz dl dt{ font-size: 30px; color:#333;font-weight: bold; line-height: 34px; padding-bottom: 10px;}
.yswz dd{ position: relative; padding-left: 20px; margin-top: 20px; font-size: 16px; line-height: 24px; color:#666666;-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;}
.yswz dd::before{position: absolute; content:""; width:9px;height:9px;background:#0eb2a4; border-radius: 0; top: 9px;left: 0;border-radius: 100%;}
.yswz3 dd{ width:558px;}
.yswz4 dl{height:298px;}

.case{ height:auto; max-width:1920px; margin: 0 auto; font-family: "Microsoft YaHei UI"; }
.case .tit01{margin-top: 94px; height:122px;}
.case dl{ width:24.73%; float:left; margin:0 0 0.25rem 0.26%; position:relative; overflow:hidden;}
.case dt img{ display:block; width:100%;-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;}
.case dd{ width:100%; position:absolute; top:0;left: 0; height:100%; font-size: 1.125rem; color:#fff;text-align: center;background:rgba(23,165,153,0.9);display: none;}
.case dd img{width:3.2rem;height:3.1rem;display: block;margin: 24% auto 4%;}
.case dd a{ color:#fff;}
.case dl:nth-child(2){ width:50%; margin:0;}
.case dl:hover dt img{-webkit-transform:scale(1.1,1.1);
    -moz-transform:scale(1.1,1.1);
    -transform:scale(1.1,1.1);}
.case dl:nth-child(5),.case dl:nth-child(6){margin-bottom: 0;}
.case dl:hover dd{display: block;}

.coo{background:url(../images/coobg.jpg) no-repeat center top; height:458px; overflow: hidden; font-family: "Microsoft YaHei UI";}
.coo h3{background:url(../images/coot.png) no-repeat center top;height:40px;margin-top: 15px;padding: 0 0 0 43px; line-height: 40px;}
.coo h3 a{ font-size: 24px; color:#444444;}
.coo h3 span a{ font-size: 16px; color:#444444; font-family: Arial; text-transform: uppercase;font-weight: normal;}
.cooprev{ width:51px; height:284px; background:#4b4f4f; float: left; margin-top: 16px; margin-right: 10px;}
.coonext{ width:51px; height:284px; background:#4b4f4f; float: right; margin-top: 16px;}
.cooprev:hover{background:#17a599;}
.coonext:hover{ background:#17a599; }
.cooimg{ width:1076px; float: left; overflow: hidden;}
.cooimg li{width:261px; float: left; overflow: hidden;margin:16px 10px 0 0;}
.cooimg li a{display: block; margin-bottom: 10px;}
.cooimg li img{ width:259px;height:135px; border:1px solid #cccccc;}
.cooimg li a:hover img{ border:1px solid #0eb2a4;}
/*新闻资讯*/
.news{ height:820px;overflow:hidden;background:#f6f6f6; font-family: "Microsoft YaHei UI"; }
.news .tit01{ padding-top: 86px; height:114px;}
.newst{text-align: center; height:68px; position: relative;}
.newst h3{display: inline-block; width:196px; height:44px;border-radius: 30px; margin:0 15px; font-size: 20px;}
.newst h3 a{width:181px; height:44px;background:#333; border-radius: 30px; color:#fff;text-align: center; line-height: 44px;display: inline-block;}
.newst h3 img{vertical-align: top;margin:6px 10px 0 0;}
.newst h3 a:hover , .newst h3.cur a{background:#17a599;}

.news_c{height:500px;}
.news1{ width:600px; float: left; overflow: hidden;}
.news1 dt{width:600px;height:336px; overflow:hidden;}
.news1 dt img{ width:600px;height:336px;-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;}
.news1 dd h4{margin-top: 6px;height:56px; border-bottom: 1px solid #d9d9d9; line-height: 56px;}
.news1 dd h4 span{display:block; width:76px;  height:26px; background:#17a599; border-radius: 30px;text-align: center;line-height: 26px; font-size: 16px; color:#fff;font-weight: normal; margin:14px 16px 0 0; float:left;}
.news1 dd h4 a{ font-size: 16px; color:#333333;font-weight: normal; display:block;}
.news1 dd p{ padding-top: 10px; font-size: 14px; line-height: 24px; color:#666666;}
.news1 dt a:hover img{-webkit-transform:scale(1.1,1.1);
    -moz-transform:scale(1.1,1.1);
    -transform:scale(1.1,1.1);}
.news1 dd h4 a:hover{ font-weight:bold; color:#17a599; text-decoration:underline;}

.news2{width:565px; float: right; overflow: hidden;}
.news2 dl{ height:146px; border-bottom: 1px solid #cbcbcb; overflow: hidden; margin-bottom: 15px;}
.news2 dt{ float: left; width:226px; height:127px;overflow: hidden;}
.news2 dt img{width:226px; height:127px;-webkit-transition: 1s;
-moz-transition: 1s;
transition: 1s;}
.news2 dd{width:339px; background:#fff ;height:127px; float: left;overflow: hidden; padding: 18px 20px 0; -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;}
.news2 dd h4{ font-size: 14px;font-weight: normal; color:#666666;line-height: 20px;}
.news2 dd h4 a{color:#333333; font-size: 16px; display:block;}
.news2 dd h4 span{display: block;}
.news2 dd p{padding-top: 6px; font-size: 14px; line-height: 24px; color:#666666;}
.news2 dl:last-child{border-bottom: 0;}
.news2 dl:hover dd{ background:#17a599;}
.news2 dl:hover dt img{-webkit-transform:scale(1.1,1.1);
    -moz-transform:scale(1.1,1.1);
    -transform:scale(1.1,1.1);}
.news2 dl:hover dd h4 a{font-weight:bold; color:#fff;}
.news2 dl:hover dd p,.news2 dl:hover dd h4 span{ color:#fff;}

/*关于*/
.about{ height:820px;overflow:hidden; position: relative; z-index: 3; font-family: "Microsoft YaHei UI";}
.about dt{ height:682px;width:100%; position:relative; z-index:1;}
.about dt img{ position:absolute; top:0; left:50%; margin-left:-960px; height:682px;}
.about dd{height:200px; width:1200px; margin: -84px auto 0; background:#fff; box-shadow: 0 2px 32px rgba(0,0,0,0.1); z-index: 3; position: relative;}

.about dd h3{ font:30px "Microsoft YaHei UI"; color:#333333;text-align: center; padding-top: 26px; height:58px; line-height: 58px;}
.about dd h3 a{ display:block; color:#333333;}
.about dd p{ font:14px "Microsoft YaHei UI"; line-height:24px; color:#666666; padding: 0 50px;text-align: center;}
.about dd p a{ color:#17a599;}

.pic{background:url(../images/xcbg.jpg) no-repeat center top; position: relative;margin-top: -137px;height:463px;padding-top: 137px;-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box; font-family: "Microsoft YaHei UI";}
.pict{text-align: center; height:62px; position: relative;}
.pict::before{position: absolute; content:""; width:400px; height:1px; background:#d9d9d9; top: 22px;left: 0;}
.pict::after{position: absolute; content:""; width:400px; height:1px; background:#d9d9d9; top: 22px;right: 0;}
.pict li{display: inline-block; width:181px; height:44px;border-radius: 30px; margin:0 15px; font-size: 20px;}
.pict li a{width:181px; height:44px;background:#333; border-radius: 30px; color:#fff;text-align: center; line-height: 44px;display: inline-block;}
.pict li a:hover , .pict li.cur a{background:#17a599;}
.pic3 li{ float: left; width:291px;  margin-right: 13px;}
.pic3 li img{width:291px; height:164px;}
.pic3 li h4{display: block; font-size: 16px; font-weight:normal; color:#666666;text-align: center; line-height: 24px; padding-top: 5px;}
.pic3 li a:hover img{width:283px; height:156px; border:4px solid #17a599;}
.pic3 li a:hover{ color:#17a599; font-weight:bold;}
.arr1{position: absolute; top: 65px; left: -32px; width:17px; height:32px;background:url(../images/proprev.png) no-repeat left 0;}
.arr2{position: absolute; top: 65px; right: -32px; width:17px; height:32px;background:url(../images/pronext1.png) no-repeat left 0;}
.arr1:hover{background:url(../images/proprev1.png) no-repeat left 0;}
.arr2:hover{background:url(../images/pronext.png) no-repeat left 0;}

.link{height:70px; background:#121b23; position: relative;}
.link .content{font:18px "Microsoft YaHei"; line-height:70px;}
.link p span{display: inline-block; width:130px;overflow: hidden; color:#919395; float: left; margin-right: 94px;}
.link p a{ color:#919395;display: inline-block;padding: 0 20px; font-size: 14px;}
.link p img{vertical-align: middle;}
.link p a:hover{ font-weight:bold; color:#fff;}

@-webkit-keyframes spin{
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }

  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  50% {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
  }

  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}


/*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);
  }
}