@charset "utf-8";

/* base */
body,a{color: #333;}
.container .position p{border-bottom-color: #0AAEDE;}
.page .pcurrent a,
.page a:hover{border-color: #0AAEDE;color:#0AAEDE;}
a:hover,
.container .position p span,
.foot-button em,
.foot-button i,
.foot-button a:hover span,
.foot-button a.active span,
.online_box p:hover::after,
.online_box p:hover svg,
.online_box p span:hover,
.online_box p.r_open:hover{color: #0AAEDE;}
.navico.nav_open span{background: #fff;}
.navico span,
.navico span::before,
.navico span::after,
.swiper-pagination-bullets .swiper-pagination-bullet-active{background-color: #0AAEDE;}


/* top */
.topbox{height: 40px;border-bottom: 1px solid #e6e6e6;background: #f5f5f5;font-size: 13px;line-height: 40px;color: #666;}
.topbox .w1440{overflow-x: auto;white-space: nowrap;}

@media only screen and (max-width:1024px){
.topbox{display: none;}
}

/* headbox */
.headbox .logo{float: left;position: relative;}
.headbox .logo a{display: block;padding: 25px 0 25px 180px;position: relative;}
.headbox .logo img{height: 100%;}
.headbox .logo strong{font-size: 28px;color: #333;line-height: 40px;padding-top: 4px;display: block;}
.headbox .logo span{font-size: 16px;color: #666;line-height: 24px;display: block;letter-spacing: 1px;padding-bottom: 2px;}

.headbox .llogo{position: absolute;left: 0;top: 50%;margin-top: -35px;}
.headbox .llogo img{height: 70px;}
.headbox .mlogo{display: none;}

.headbox .tel{float: right;position: relative;padding: 35px 125px 35px 60px;line-height: 1;}
.headbox .tel em{display: block;width: 50px;height: 50px;position: absolute;left: 0;top: 50%;margin-top: -25px;text-align: center;line-height: 50px;}
.headbox .tel em svg{font-size: 50px;height: 46px;color: #0AAEDE;}
.headbox .tel span{display: block;color: #808080;height: 20px;padding: 2px;}
.headbox .tel p{font-size: 30px;color: #0AAEDE;padding: 2px 0;height: 30px;}
.headbox .tel img{height: 100%;position: absolute;right: -5px;top: 0;}

@media only screen and (max-width:1200px){
.headbox .logo a{padding: 20px 0 20px 180px;}
.headbox .logo strong{letter-spacing: -.5px;}
.headbox .tel{padding: 30px 110px 30px 55px;}
}
@media only screen and (max-width:1024px){
.headbox{height: 60px;box-shadow: 0 3px 6px rgba(0,0,0,.1);position: fixed;left: 0;top: 0;z-index: 999999;background: #fff;}
.headbox .w1440,
.headbox .logo{height: 100%;}
.headbox .logo a{padding: 5px 0;height: 100%;}
.headbox .mlogo{display: block;height: 100%;}
.headbox .tel,
.headbox .llogo,
.headbox .logo strong,
.headbox .logo span{display: none;}
}

/* navbox */
@media only screen and (min-width:1025px){
.navbox{background: #0AAEDE;box-shadow: 0 3px 6px rgba(0,0,0,.2);position: relative;z-index: 999;}
.navbox ul{display: flex;flex-wrap: nowrap;height: 100%;}
.navbox ul li{width: 14.5%;text-align: center;float: left;flex-shrink: 0;position: relative;}
.navbox ul li a{display: block;width: 100%;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;position: relative;line-height: 30px;color: #fff;}
.navbox ul li > a{padding: 13px 5px 12px;font-size: 15px;font-weight: 600;position: relative;}
.navbox ul li > a::after,
.navbox ul li > a::before{content: "";position: absolute;-webkit-transition: .5s;-moz-transition: .5s;transition: .5s;}
.navbox ul li > a::after{width: 1px;height: 15px;left: 0;top: 20px;background: #0AAEDE;}
.navbox ul li:first-child > a::after{content: none;}
.navbox ul li > a::before{bottom: -10px;left: 50%;margin-left: -8px;width: 16px;height: 8px;border: 8px solid #0AAEDE;border-top: 0;border-bottom-color: #fff;}

.navbox ul li dl{width: 100%;position: absolute;left: 0;top: 100%;background: #0AAEDE;opacity: 0;}
.navbox ul li dl span{display: none;}
.navbox ul li dl a{height: 0;padding: 0 5px;border-bottom: 0 solid rgba(255,255,255,.3);}
.navbox ul li dl a:hover{background: #ffbf00;}

.navbox ul li:hover dl{opacity: 1;box-shadow: 0 2px 6px rgba(0,0,0,.2);}
.navbox ul li:hover dl a{height: 45px;border-bottom-width: 1px;padding: 7px 5px;}

.navbox ul li.active > a::before{bottom: 0;}
}

@media only screen and (max-width:1024px){
.navbox{width: 100%;height: 0;overflow: hidden;position:fixed;left: 0;top:0;background:#333;z-index: 99999;}
.navbox.nav_on{height:100%;}
.navbox ul{width:100%;height:calc(100vh - 130px);overflow-y:auto;position:absolute;left:0;top:70px;padding:0 3%;}
.navbox ul li{width:100%;border-bottom:1px solid #555;padding: 0;position: relative;z-index: 5;}
.navbox ul li a{display: block;width: 100%;color: #fff;overflow: hidden;position: relative;z-index: 1;}
.navbox ul li > a{line-height: 50px;padding: 0 10px;}

.navbox ul li dl{width: 100%;position: absolute;left: 0;top: 100%;background: #0AAEDE;z-index: 2;}
.navbox ul li dl span{display: block;width: 50px;height: 50px;position: absolute;top: -50px;right: 0;text-align: center;line-height: 50px;color: #ccc;font-size: 16px;z-index: 0;-webkit-transition: .5s;-moz-transition: .5s;transition: .5s;}
.navbox ul li dl span svg{height: 50px;line-height: 50px;}
.navbox ul li dl a{display: block;width: 100%;line-height: 40px;height: 0;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;color: #fff;background: #0AAEDE;padding: 0 15px;}

.navbox ul li dl a:hover{background: #ffbf00;}
.navbox ul li dl a.on{height: 40px;margin-bottom: 1px;}
.navbox ul li dl span.on{-webkit-transform: rotateZ(90deg);-moz-transform: rotateZ(90deg);transform: rotateZ(90deg);}

.navbox ul li.active,
.navbox ul li:hover{z-index: 6;}
.navbox ul li.active > a{color: #0AAEDE;font-weight: 600;}
}

@media only screen and (max-width:768px){
.headbox{height: 50px;}
.navbox ul{height:calc(100vh - 120px);top:60px;}
}

/*banner*/
.bannerpic{height: 0;padding-bottom: 600px;}

#shutter .btn p{background: rgba(0,0,0,.3);}
#shutter .btn p:hover{background: rgba(0,180,75,.75);}

@media only screen and (max-width:1310px){
.bannerpic{padding-bottom:38%;}
}
@media only screen and (max-width:1024px){
.banner {padding-top: 60px;}
}
@media only screen and (max-width:1024px){
.banner {padding-top: 50px;}
}

/* search */
.searchbox{padding: 17px 0;background: #f5f5f5;}
.searchbox .txt{width: 62%;float: left;padding-left: 90px;position: relative;line-height: 30px;overflow: hidden;}
.searchbox .txt .tit{position: absolute;left: 0;top: 0;background: #f5f5f5;font-weight: 600;padding: 3px 0;}
.searchbox .txt p{overflow: hidden;white-space: nowrap;text-overflow: ellipsis;padding: 3px 0;}
.searchbox .txt p a{display: inline-block;padding: 0 5px;}

.searchbox .search{width: 35%;float: right;overflow: hidden;position: relative;max-width: 360px;}
.searchbox .search p{width: 100%;background: #fff;border: 1px solid #0AAEDE;}
.searchbox .search p input{line-height: 24px;padding: 5px 10px;overflow: hidden;display: block;width: 100%;}
.searchbox .search span{display: block;width: 60px;position: absolute;right: 0;top: 0;background: #0AAEDE;z-index: 2;text-align: center;}
.searchbox .search span svg{height: 36px;color: #fff;font-size: 18px;}
.searchbox .search em{display: block;width: 60px;position: absolute;right: 0;top: 0;z-index: 3;}
.searchbox .search em input{width: 100%;height: 36px;cursor: pointer;background: none;}

@media only screen and (max-width:768px){
.searchbox{padding-bottom: 15px;}
.searchbox .txt{width: 100%;height: 34px;padding-top: 5px;}
.searchbox .txt .tit{top: 5px;}
.searchbox .txt p{overflow-x: auto;text-overflow: unset;}
.searchbox .search{width: 100%;max-width: 100%;}
}

/* foot */
.footbox{background:#333;color: #999;line-height: 30px;}
.footbox .w1440{padding: 50px 0;}
.footbox a{color: #aaa;}
.footbox a:hover{color: #fff;}

.footbox .txt{float: left;padding: 0 4%;border-left: 1px solid #454545;}
.footbox .txt .titl{width: 100%;font-size: 16px;line-height: 20px;color: #fff;font-weight: 600;padding-bottom: 20px;}
.footbox .txt .list{width: 100%;}

.footbox .txt.txt1{padding-left: 0;border: 0;width: 20%;}
.footbox .txt1 .list p{width: 50%;float: left;padding-right: 10px;}
.footbox .txt2{width: 19%;}
.footbox .txt3{width: 17%;}
.footbox .txt4{width: 26%;}

.footbox .ewm{width: 18%;float: right;}
.footbox .ewm img{width: 100%;float: right;max-width: 150px;}

.bottombox{background: #191919;padding: 15px 1%;color: #999;line-height: 30px;text-align: center;}

@media only screen and (max-width:1200px){
.footbox .txt{padding: 0 3%;}
.footbox .txt2{width: 18%;}
.footbox .txt3{width: 16%;}
.footbox .txt4{width: 28%;}
}
@media only screen and (max-width:1024px){
.footbox .w1440{padding: 35px 0;line-height: 25px;}
.footbox .txt.txt1{width: 26%;}
.footbox .txt2{width: 22%;}
.footbox .txt3{width: 20%;}
.footbox .txt4{width: 32%;padding-right: 0;}
.footbox .ewm{display: none;}
.bottombox{line-height: 25px;}
}
@media only screen and (max-width:768px){
.footbox .w1440{display: none;}
}