@charset "utf-8";


/* header&foot */
.box{width: 1350px; margin: 0 auto; max-width: 100%;}
.bj{ height: 100vh; position: fixed; z-index:-1;width: 100%; background-size: cover cover;}
header{ width: 100%; position: relative;}
a,img{ transition: 0.3s;}
a:hover{ color: #009171;}
.head{ width: 100%;transition: 0.3s; height: 114px; border-bottom: 1px solid rgba(80,80,80,0.2); color: #505050; font-size: 18px; position: fixed; z-index: 9999; left: 0; top:0}
.head.active{ background-color:rgba(255,255,255,0.8);}
.head .box{display: flex; align-items: center; justify-content: space-between; height: 100%;}


.logo{ height:68px; transition: 0.3s;}
.logo a{display: block; height: 100%;}
.logo a img{display: block; height: 100%;}

nav{ height: 100%;font-weight: 400;display: flex; width: calc(100% - 500px); margin-left: 100px;}
.nav-box{display: flex;align-items: center; flex-wrap: wrap; justify-content: space-between; width: 30%; height: 100%;}
.nav-item{position: relative;height: 100%; transition: 0.3s; }
.mc{display: none;}

.first-nav{ height: 100%; width: 100%;}
.first-nav a{display: flex; align-items: center; justify-content: center; height: 100%; position: relative; transition: 0.3s;}
.first-nav a i{display: block; margin-left: 10px; transition: 0.3s; display: none;}
.first-nav a i::before{content: "\e600";}
.first-nav.focus i{transform: rotate(180deg);}
.first-nav.on a{color: #008265; font-weight: 500;}
.second-nav{position: absolute; left: 0; top: 114px; background: #009171; box-sizing: border-box;  z-index: 9999; max-height: 0; overflow: hidden;transition: 0.3s;}
.second-nav a{color: #fff; display: block;font-size: 16px; line-height: 3; transition: 0.3s; padding:0 20px; white-space: nowrap;}
.second-nav a:hover{ color: #fff; background:#0cd484;  }
.nav-item:hover .first-nav a{color: #008265; font-weight:500;}
.first-nav em img{ width:12px;}
.first-nav em{ margin-left: 15px;}
/* .nav-item:hover i{transform: rotate(180deg);} */
.nav-item:hover .second-nav{ max-height: 1000px;}
.navk{ display: flex; align-items: center;}
.navk a{font-size: 17px; color: #fff; height: 42px; line-height: 42px; background-color: #0cd484; padding: 0 15px;text-transform: uppercase; border-radius: 42px;}
.navk a:hover{ background-color: #009171;}
.topti{ text-align: center; color: #fff;font-size: 80px; line-height: 1.5; display: flex; align-items: center; justify-content: center; height:100vh;}



.mBtn{ width: 40px; height: 40px; border-radius: 4px; display: none;  cursor: pointer;   box-sizing: border-box;  background: #008265; margin-left:10px;  display: none;}
.mBtn span{ display: block;  width: 22px;}
.mBtn span i{width: 100%; height: 2px; background: #fff; display: block; margin: 0 auto;  margin-top: 5px; transition: 0.5s;}
.mBtn span i:first-child{margin-top: 0;}
.mBtn.active span i:nth-child(1){transform: rotate(45deg) translateY(4px) translateX(4px);}
.mBtn.active span i:nth-child(2){transform: rotate(-45deg) translateY(-1px) translateX(1px);}
.mBtn.active span i:nth-child(3){ width: 4px;}
.head_right{display: flex;  align-items: center; height: 100%;  position: relative;}
.hedri{ display: flex; align-items:center;}
.hedri i{ margin: 0 12px;}
.hedri img{ width: 20px; height: 20px;}
.djsous{ cursor: pointer;}
.souk{ display: flex; align-items: center; height: 40px; width:50px; box-sizing: border-box; padding: 0 15px; justify-content: space-between; border-radius: 80px; transition: 0.3s;}
.souk input{ border: none; background: none; font-size: 16px; display: none; width: 0;}
.souk input{ width: 120px;}
.hedri p{ display: flex; align-items: center;}
.souk.active{background-color: #fff; width: 190px;}
.souk.active input{ display: block;}
.hedri p.active{ display: none;}
.hedri h1{ font-size: 30px; font-weight: 100; padding: 10px; display: none; cursor: pointer;}
.hedri h1.active{ display: block;}



.banner,.o-banner{ width:100%; margin-top: 114px;}
.banner_swiper{width: 100%;height: 100%;}
.banner_swiper .swiper-slide{width: 100%; height: 100%; overflow: hidden;}
.ban_bg{ width: 100%; height: auto;}
.ban_bg img{ width: 100%;}
.bn_tx{width:1350px;  position: absolute; left:50%; margin-left: -630px;  top: 50%; transform: translateY(-50%); color: #fff;}
.bn_tx h1{font-size: 80px;font-weight: bold; transform: translateY(100px); transition: 1s ease-in-out;opacity: 0;background: linear-gradient(to bottom, #fff 50%, rgba(255,255,255,0));-webkit-background-clip: text; color: transparent; line-height: 1; text-transform: uppercase;}
.bn_tx h2{ font-size: 42px; font-weight: bold; transform: translateY(100px); transition: 1s ease-in-out 0.1s;opacity: 0; line-height: 1.2; }
.bn_tx h3{font-size: 18px; width: 50%; margin-top: 30px; transform: translateY(100px); transition: 1s ease-in-out 0.2s;opacity: 0; line-height: 2;}
.banner_swiper .swiper-slide-active .bn_tx h1{transform: translateY(0); opacity: 1;}
.banner_swiper .swiper-slide-active .bn_tx h2{transform: translateY(0);opacity: 1;}
.banner_swiper .swiper-slide-active .bn_tx h3{transform: translateY(0);opacity: 1;}

.banner_swiper .swiper-pagination{ width: 1350px; left: 50%; margin-left: -700px;  top: auto; height: 14px!important;  bottom: 30px; text-align: left;  display: flex; justify-content: center;}
.banner_swiper .swiper-pagination-bullet{ width:14px;height:14px; box-sizing: border-box; border-radius:50%;  background: none;  border: 1px #fff solid; opacity: 0.6; }
.banner_swiper .swiper-pagination-bullet-active{opacity: 1; display: flex; align-items: center;}
.banner_swiper .swiper-pagination-bullet-active::before{content: ""; display: block; width:4px;height: 4px; background: #fff; border-radius: 50%; margin: 0 auto;}


.foot{ display: flex; justify-content: space-between; flex-wrap: wrap; padding: 45px 0;}
.ft1{ width: 155px;}
.ft1 img{ width: 100%; display: block; max-width: 155px;}
.ft2{ display: flex; width: calc(100% - 760px); justify-content: space-between;}
.ft2 dl dt{ font-weight: bold; color: #009171; font-size: 16px; margin-bottom: 10px;}
.ft2 dl{ display: flex; flex-direction: column;}
.ft2 dl dd{  line-height: 2.2;}
.ft2 dl dd a{font-size: 14px; color: #858585;}
.ft2 dl dd a:hover{ color: #009171;}
.ft3{ width: 445px;}
.ft3 span{ display: flex; justify-content: space-between;}
.ft3 span a{ height: 65px;}
.ft3 span img{ display: block; height: 65px;}
.ft3 span img:hover{transform: rotate(-10deg);}
.ftdi{ text-align: center; color: #fff; font-size: 14px; padding: 15px 0; line-height: 1.8; background-color: #009171;}
.ft3 p{ font-size: 14px; color: #6f6f6f; line-height: 2.2; margin-top: 14px; text-align: justify;}
.ftdi a{color: #fff;}
.ftdi a:hover{ text-decoration: underline;}
.ftdi i{ padding:0 8px;}
#toTop{ background-color:rgba(0,145,113,0.7); right: 50px; bottom: 80px; width: 64px; height: 64px; border-radius: 50%; display: flex; justify-content: center; align-items: center; transition: 0.3s; z-index: 966;}
#toTop:hover{background-color:rgba(0,145,113,1); }
#toTop img{ width: 60%;}

.yemian{ background: #fff; width: 100%;}
section{padding: 70px 0; position: relative;}
main{width: 1350px; margin: 0 auto; max-width: 92%;}
.con1{ display: flex; justify-content: space-between; flex-wrap: wrap;}
.con1le{ width: 54%; position: relative; height: auto; display: flex; align-items: center; z-index: 3;}
.con1le img{ width: 100%; display: block;}
.con1le span{ display: flex; text-align: center; justify-content: center; align-items: center; left: 0; top: 0; width: 100%; height: 100%; z-index: 4; position: absolute; background: rgba(0,0,0,0.1);}
.con1le span h1{ display: flex; flex-direction: column; text-align: center; color: #fff; cursor: pointer;}
.con1le span h1 img{ width:116px; height: 116px; transition: 0.3s;}
.con1le span h1:hover img{transform: scale(1.1);}
.con1le span h1 p{ font-size: 18px; margin-top: 12px;}
.con1ri{ width: calc(46% - 40px); display: flex; flex-direction: column;}
.con1ri h1{ color: #505050;font-size: 20px; display: flex; align-items: center; margin-top: 16px;}
.con1ri h1 img{ width: 22px; margin-left: 16px;}
.con1ri h2{ font-size: 26px; font-weight: bold; line-height: 1.8; margin-top: 30px;}
.con1ri .contex{font-size: 18px; color: #6e6e6e; line-height: 2; margin-top: 30px;}
.con1k3{ position: relative; height: 168px; width: 100%;position: relative;margin-top: 70px; z-index: 5;}
.con1k3>div{display: flex; width:calc(100% + 120px);  right: 0; z-index: 6; position: absolute; top: 0;height: 100%;}
.con1k3 span{ width: 33.3%; background-color: #fff; text-align: center; display: flex; flex-direction: column; height: 100%; box-shadow: 0 0 20px rgba(0,0,0,0.1);}
.con1k3 span img{ width: 48px; height: 48px; display: block; margin: 0 auto; margin-top: 24px; transition: 0.3s;}
.con1k3 span h3{ font-size: 18px; color: #999999; margin-top: 20px;}
.con1k3 span h4{font-size: 14px; color: #c4c4c4; margin-top: 12px; text-transform: uppercase;}
.con1k3 span:hover img,.con2 span:hover img{transform: rotateY(180deg);}

.con2box{ background: url(../img/inbj.jpg) top center no-repeat; background-size:cover 50%; min-height: 300px; padding-bottom: 0;}
.title{ text-align: center; justify-content: center; display: flex; align-items: center; color: #333; font-size: 26px;}
.title span{ margin: 0 18px;font-size: 30px; font-weight: bold;}
.con2box .title{ color: #fff;}
.con2{ margin-top: 70px; display: flex; justify-content: space-between; flex-wrap: wrap;}
.con2 span{ background-color: #f5f5f5; width: calc(33.3% - 30px); border-radius: 15px; transition: 0.3s; display: flex; padding: 30px 40px; padding-bottom: 44px; box-sizing: border-box; flex-direction: column;text-align: center;}
.con2 span h1{ font-size: 30px; margin-top: 24px; margin-bottom: 28px; font-weight: bold;}
.con2 span p{ font-size: 18px; color: #666; text-align: justify; line-height: 1.8;}
.con2 span:hover{ background-color: #009171; color: #fff;}
.con2 span:hover p{color: #fff;}
.con2 span img{ width: 74px; height: 74px; display: block; margin: 0 auto; transition: 0.3s;}

.con3{ display: flex; justify-content: space-between; flex-wrap: wrap; align-items: center; margin-top: 40px;}
.con3le{ width: 430px;display: flex;justify-content: space-between;}
.con3le h1,.yjbox h1{ width: 16px; height: 16px; border-radius: 16px; background-color: #ffc001; margin-left: 3px; margin-top: 14px;}
.con3zi{ width: calc(100% - 42px); display: flex; flex-direction: column; }
.con3zi h2{ font-size: 30px; color: #009171; font-weight: bold;line-height: 1.5;}
.con3zi h3{ font-size: 24px; color: #009171; font-weight: bold; margin-top: 24px;}
.con3tex{ font-size: 16px; color: #666; line-height: 2.6; margin-top: 20px; width:calc(100% - 50px);}
.con3ri{ width: calc(100% - 510px);}
.con3ri img{ width: 100%; display: block; transition: 0.3s;}
.con3ri img:hover{transform: translateX(-30px) ;}

.con5box{ background-color: #f5f5f5;}
.con5{display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; flex-direction: column;}
.news-con{ width: 100%;}
.news-item{ display: flex; flex-wrap: wrap;}
.news-item a{width: calc(33.3333% - 20px); margin-right: 30px;transition: 0.3s; overflow: hidden;display: flex; flex-direction: column;margin-top: 40px;}
.news-item a:nth-child(3n),.anlist a:nth-child(3n){ margin-right: 0;}
.news-item a:last-child{margin-right: 0;}
.news-item a em{display: block; width: 100%; overflow: hidden; transition: 0.3s;}
.news-item a em img{display: block; width: 100%;}
.news-item a span{display: block; box-sizing: border-box; padding: 30px 25px;  background: #fff;}
.news-item a span h2{font-size: 18px;  text-align: justify; font-weight: bold; color: #333; overflow: hidden; height: 20px; line-height: 20px;white-space: nowrap;text-overflow: ellipsis;}
.news-item a span h3{color: #999; line-height:2; margin-top: 20px; font-size: 16px; height: 96px; overflow: hidden; text-align: justify;}
.news-item a:hover h2,.news-item a:hover h3{color: #fff;}
.news-item a:hover,.gongzuo>div:hover{ transform: translate(0, -4px);box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.20);}
.newtime img.hover{ display: none;}
.news-item a:hover img.hover{ display: block;}
.news-item a:hover img.newbiao{ display: none;}
.news-item a:hover span{ background-color: #008265;}
.newtime img{ width: 26px; height: 26px;}

/*分页样式*/ 
.erbox{ padding:60px 0;}
.erbanner img{ display: block; width: 100%; height: auto;}
.newtime{ display: flex; justify-content: space-between; align-items: center; margin-top: 25px;}
.newtime h1,.news-item a span h3{font-size: 16px; color: #666;}
.erbox .news-item a span{ background-color: #f5f5f5;}
.erbox .news-item a:hover span{ background-color: #008265;}
.erbox .news-item a:hover h1{ color: #fff;}
.news-con{ margin-top: 10px;}

.tulist{display: flex; flex-wrap: wrap; flex-direction: column; width: 100%;}
.tulist a{ width: 100%; margin-top: 60px; display: flex; justify-content: space-between; background-color: #f5f5f5; color: #666; align-items: center; flex-wrap: wrap;}
.tulist a em{display: block; width:420px; overflow: hidden; transition: 0.3s; max-width: 32%;}
.tulist a em img{display: block; width: 100%;}
.tulist a:hover{background-color: #008265; color: #fff;}
.tulist a span{ display: flex; flex-direction: column; width: calc(100% - 430px); box-sizing: border-box; padding:30px; min-width: 66%;}
.tulist a h2{font-size: 18px; text-align: justify; font-weight: bold; color: #333; overflow: hidden; height: 20px; line-height: 20px;white-space: nowrap;text-overflow: ellipsis;}
.tulist a h3{ line-height:2; margin-top: 20px; font-size: 16px; height: 96px; overflow: hidden; text-align: justify;}
.tulist img.hover{ display: none;}
.tulist a:hover h2,.tulist a:hover h1{ color: #fff;}
.tulist a:hover img.hover{ display: block;}
.tulist a:hover img.newbiao{ display: none;}


.pages{margin-top: 60px;  }
ul.yiiPager{ display: flex;  justify-content: center;}  
ul.yiiPager li{display:block; margin: 2px;}  
ul.yiiPager li a{ width: 40px; height: 40px; border-radius: 8px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; line-height: 1; border:#ddd solid 1px;color: #666; transition: 0.3s;}  
ul.yiiPager li a:hover{background:#008265;border:#008265 solid 1px;color:#FFF;}
ul.yiiPager li.first a::before{content: "\e741";}
ul.yiiPager li.last a::before{content: "\e741"; transform: rotate(180deg);}
ul.yiiPager li.previous a::before{content: "\e694";transform: rotate(180deg); font-size: 14px;}
ul.yiiPager li.next a::before{content: "\e694"; font-size: 14px;}
ul.yiiPager li.selected a{background:#008265;border:#008265 solid 1px;color:#FFF;}

.show_title{text-align: center;  border-bottom: 1px #ddd solid; padding-bottom: 30px;}
.show_title h1{font-size: 28px; font-weight: bold;}
.show_title h2{margin-top: 20px; font-size: 14px;color: #999; display: flex;align-items: center; justify-content: center;}

.danye{color: #474646; line-height: 2; margin-top:30px; font-size: 16px;}
.danye img{max-width: 100%!important;height: auto!important;}
.mar60{ margin: 60px 0;}
.danye.mar60{ font-size: 18px;}

.bar{margin-top: 50px; display: flex; justify-content: space-between;}
.bar a{font-size: 16px; color: #666; line-height: 1; transition: 0.3s;background: #F2F2F2;}
.bar a:hover{background: #008265; color: #fff;}
.bar a.show_prev{display: flex; align-items: center; justify-content: space-between;  padding: 20px 30px; box-sizing: border-box; width: calc(50% - 100px);}
.bar a.show_prev::before{content: "\e694"; transform: rotate(-180deg);}
.bar a.show_prev i{width: calc(100% - 30px);word-wrap:break-word; white-space:nowrap;overflow: hidden;text-overflow:ellipsis;}
.bar a.show_next{display: flex; align-items: center; justify-content: space-between;  padding: 20px 30px; box-sizing: border-box; width: calc(50% - 100px);}
.bar a.show_next::after{content: "\e694"; }
.bar a.show_next i{width: calc(100% - 30px);word-wrap:break-word; white-space:nowrap;overflow: hidden;text-overflow:ellipsis; text-align: right;}
.bar a.back_list{display: flex;align-items: center; justify-content: center; width: 140px;}
.bar a.back_list::before{content: "\e675"; display: block; margin-right: 8px;font-size: 14px;}


.yuanjing{ display: flex; flex-wrap: wrap; background-color: #f7f7f7; justify-content: space-between;}
.yjbox{ width: 50%; align-items: center; display: flex; overflow: hidden;}
.yjbox>img{ width: 100%; display: block;}
.yjbox>img:hover{transform:scale(1.1);}
.yjp50{ padding: 50px;display: flex; justify-content: space-between; box-sizing: border-box; width: 100%; }
.yjbox .con3tex{ width: 100%;}
.top60{margin-top: 60px;}
.yuanjingk{ margin-top: 60px;}
.yuanjingk .yuanjing:nth-child(2n){flex-direction: row-reverse;}
.hezuo .con3zi h3{ margin-top: 5px;}
.hezuo .yjp50{ padding: 30px 50px;}

.gongzuo{ margin-top: 60px; display: flex; justify-content: space-between; margin-bottom: 60px;}
.gongzuo>div{ width: calc(33.3% - 20px); display: flex; flex-direction: column; background-color: #fcfbfc; transition: 0.3s;}
.gongzuo>div img{ width: 100%; display: block;}
.gongzuo>div span{ width: 100%; box-sizing: border-box; padding: 30px; color: #595a59; line-height: 1.8;}
.gongzuo>div span h1{ font-size: 20px;font-weight: bold;}
.gongzuo>div span p{  font-size: 16px; text-align: justify; margin-top: 20px;}

.lxbox{ width: calc(100% - 40px); margin: 0 auto;}
.ditu{ width: 100%; height: 480px; margin-top: 60px;}
.lxlj{ display: flex; justify-content: space-between; align-items: center; margin-top: 30px;}
.lxlj h1{ width: 114px;}
.lxlj h1 img{ width: 100%; display: block;}
.lxlj span{ display: flex; justify-content: space-between; flex-wrap: wrap; width: calc(100% - 360px); align-items: flex-start;}
.lxlj span a{ display: flex; flex-direction: column; text-align: center; justify-content: center;margin-bottom: 0; width: calc(25% - 20px); margin-top: 20px;}
.lxlj span em{ width: 100%; border: 1px solid #efefef; display: flex; align-items: center; justify-content: center; box-sizing: border-box; margin: 0 auto;}
.lxlj span a img{ width: 80%;}
.lxlj span a:hover em{ border: 1px solid #009171;}
.lxlj span a p{ color: #666; font-size: 16px; margin-top: 15px;}

.lxcon{ margin-top: 20px;}
.lxconk{ display: flex; justify-content: space-between; flex-wrap: wrap;}
.lxconk span{ display: flex; flex-direction: column; width: 100%; margin-top: 30px;}
.lxconk span h1{ font-size: 20px; color: #333;}
.lxconk span input{ border: 1px solid #d7d7d7; height: 40px; padding: 0 16px; box-sizing: border-box; margin-top: 15px; width: 100%; line-height: 40px; font-size: 16px; border-radius: 5px;}
.lxcon .lxconk:nth-child(1) span,.lxcon .lxconk:nth-child(2) span{ width: calc(50% - 15px);}
.lxconk span textarea{ border: 1px solid #d7d7d7; height: 180px; padding: 0 16px; box-sizing: border-box; margin-top: 15px; width: 100%; line-height: 40px;font-size: 16px;border-radius: 5px;}
.tijiao{ display: flex; justify-content: center; margin-top: 40px;}
.tijiao input[type='submit']{ width: 240px; height: 58px;background:linear-gradient(to right,#02e98e,#2dba9a); transition: 0.3s; border-radius: 60px; border: none; color: #fff; font-weight: bold; font-size: 22px;}
.lxconk input:focus,.lxconk span textarea:focus{ border: 1px solid #888;}
.tijiao input:hover{background:linear-gradient(to right,#2dba9a,#02e98e); cursor: pointer;}