@charset "utf-8";

/* base */
body,a{color: #333;}
.container .position p{border-bottom-color: #0061a6;}
.page a:hover{border-color: #0061a6;color:#0061a6;}
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 span:hover,
.online_box p.r_open:hover{color: #0061a6;}
.swiper-pagination-bullets .swiper-pagination-bullet-active{background-color: #0061a6;}

/* headbox */
.headbg{height: 100px;}
.headbox{width: 100%;height: 100px;box-shadow: 0 3px 6px rgba(128,128,128,.2);left: 0;top: 0;z-index: 999999;position: fixed;background-color: #fff;}
.headbox .headcon{height: 100%;padding: 0 200px 0 700px;width: 96%;max-width: 1750px;margin: 0 auto;position: relative;}
.headbox .logo{height:100%;overflow: hidden;position: absolute;left: 0;top: 0;z-index: 3;}
.headbox .logo *{height:100%;}
.headbox .logo a{padding: 25px 0;display: block;overflow: hidden;}
.headbox .logo p{float: left;padding: 0 14px;border-right: 1px solid rgba(0,97,166,.5);}
.headbox .logo a strong{float: left;padding-left: 14px;font-size: 24px;color: #0061a6;height: 50px;line-height: 50px;}

.headbox .telbox{height: 100%;position: absolute;right: 0;top: 0;z-index: 5;}
.headbox .telbox .txt{float: left;padding: 30px 10px;}
.headbox .telbox .txt p{width: 40px;height: 40px;line-height: 40px;text-align: center;font-size: 15px;color: #fff;background: #0061a6;border-radius: 50%;cursor: pointer;}
.headbox .telbox .txt p a{color: #fff;}
.headbox .telbox .txt p svg{height: 40px;line-height: 40px;font-size: 18px;}
.headbox .telbox .txt .text{height: 0;position: absolute;right: 0;top: 100%;background: #fff;border: 1px solid #ddd;border-width: 0 1px;overflow: hidden;}

.headbox .telbox .tel .text{text-align: center;width: 260px;line-height: 48px;}
.headbox .telbox .tel strong{font-size: 14px;color: #666;display: inline-block;}
.headbox .telbox .tel span{font-size: 20px;color: #fa0;display: inline-block;}

.headbox .telbox .seach .text{width: 300px;}
.headbox .telbox .seach span{display: block;padding: 14px;}
.headbox .telbox .seach span input{display: block;line-height: 20px;width: 100%;}
.headbox .telbox .seach em,
.headbox .telbox .seach i{display: block;position: absolute;right: 0;top: 0;width: 50px;height: 48px;text-align: center;}
.headbox .telbox .seach i{background: #fff;z-index: 2;}
.headbox .telbox .seach i svg{height: 48px;line-height: 48px;font-size: 18px;color: #666;}
.headbox .telbox .seach em{z-index: 3;}
.headbox .telbox .seach em input{display: block;width: 100%;height: 100%;cursor: pointer;background: none;}

.headbox .telbox .txt:hover p{background: #ffbf00;}
.headbox .telbox .txt:hover .text{border-width: 1px;height: 50px;}

@media only screen and (min-width:1025px){
.headbox .navbox{width: 96%;float: right;max-width: 700px;height: 100%;}
.headbox .navbox ul{display: flex;flex-wrap: nowrap;height: 100%;}
.headbox .navbox ul li{float: left;text-align: center;position: relative;width: 20%;flex-shrink: 1;}
.headbox .navbox ul li[t='en']{display: none;}
.headbox .navbox ul li a{display: block;width: 100%;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;position: relative;}
.headbox .navbox ul li > a{top: 50%;line-height: 40px;margin-top: -25px;padding: 5px;font-weight: 600;font-size: 15px;color: #666;}

.headbox .navbox ul li dl{width: 120px;position: absolute;left: 50%;top: 150%;margin-left: -60px;background: rgba(0,97,166,.9);opacity: 0;border-radius: 3px;}
.headbox .navbox ul li dl#navcla{width: 180px;margin-left: -90px;}
.headbox .navbox ul li dl::before{width: 100%;height: 0;position: absolute;left: 0;top: -15px;content: "\e65f";font-size: 21px;color: rgba(0,97,166,.9);overflow: hidden;line-height: 24px;}
.headbox .navbox ul li dl a{height: 0;padding: 0 5px;color: #fff;font-size: 13px;line-height: 35px;border-top: 0 solid rgba(255,255,255,.2);}
.headbox .navbox ul li dl dd:first-child a{border: none;line-height: 36px;}
.headbox .navbox ul li dl a:hover{background: #ffbf00;font-weight: 600;}

.headbox .navbox ul li:hover dl{top: 100%;opacity: 1;box-shadow: 0 2px 6px rgba(0,0,0,.2);}
.headbox .navbox ul li:hover dl::before{height: 15px;}
.headbox .navbox ul li:hover dl a{height: 45px;border-top-width: 1px;padding: 5px;}
.headbox .navbox ul li.active > a{color: #0061a6;}
}

@media only screen and (max-width:1600px){
.headbox .headcon{width: 98%;padding-right: 180px;}
}
@media only screen and (max-width:1440px){
.headbg,
.headbox{height: 90px;}
.headbox .headcon{padding: 0 150px 0 550px;}
.headbox .logo a{padding: 20px 0;}
.headbox .logo p{padding: 0 10px;}
.headbox .logo a strong{font-size: 18px;padding-left: 10px;}
.headbox .telbox .txt p{width: 30px;height: 30px;line-height: 30px;font-size: 13px;}
.headbox .telbox .txt p svg{height: 30px;line-height: 30px;font-size: 15px;}
}
@media only screen and (max-width:1250px){
.headbox .headcon{padding: 0 130px 0 320px;}
.headbox .logo p{padding: 0 10px;margin-right: -1px;}
.headbox .logo a strong{display: none;}
.headbox .telbox .txt{padding: 30px 5px;}
}
@media only screen and (max-width:1024px){
.headbg{height: 60px;}
.headbox{width: 100%;height: 60px;position: fixed;}
.headbox .headcon{padding: 0;width: 100%;}
.headbox .headcon::after{content: "";width: 100%;height: 100%;position: absolute;left: 0;top: 0;z-index: 2;background: #fff;}
.headbox .logo{left: 1%;}
.headbox .logo a{padding: 10px 0;}

.headbox .telbox{padding-right: 70px;right: 0;}
.headbox .telbox .txt{padding: 15px 5px;display: none;}
.headbox .telbox .seach{display: block;}

.headbox .navbox{width: 100%;height: 0;overflow: hidden;position:fixed;left: 0;top:0;background:#333;z-index: 1;}
.headbox .navbox.nav_on{height:100%;}
.headbox .navbox ul{width:100%;height:calc(100vh - 130px);overflow-y:auto;position:absolute;left:0;top:70px;padding:0 3%;}
.headbox .navbox ul li{width:100%;border-bottom:1px solid #555;padding: 0;position: relative;z-index: 5;-webkit-transition: .5s;transition: .5s;}
.headbox .navbox ul li a{display: block;width: 100%;color: #fff;overflow: hidden;position: relative;z-index: 1;}
.headbox .navbox ul li > a{line-height: 50px;padding: 0 10px;font-size: 15px;}
.headbox .navbox ul li > a em{font-style: normal;padding-right: 10px;}
.headbox .navbox ul li.active,
.headbox .navbox ul li:hover{z-index: 6;}
.headbox .navbox ul li.active > a{color: #ffbf00;font-weight: 600;}

.headbox .navbox ul li dl{width: 100%;position: absolute;left: 0;top: 100%;background: #0a83bf;z-index: 2;}
.headbox .navbox ul li dl::after{content: "\e660";width: 50px;height: 50px;position: absolute;top: -50px;right: 0;text-align: center;line-height: 50px;color: #ccc;font-size: 16px;z-index: 0;}
.headbox .navbox ul li dl a{display: block;width: 100%;line-height: 40px;height: 0;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;color: #fff;font-size: 14px;background: #0077b3;padding: 0 15px;}
.headbox .navbox ul li dl a:hover{background: #ffbf00;font-weight: 600;}
.headbox .navbox ul li:hover dl a{height: 40px;margin-top: 1px;}
.headbox .navbox ul li:hover dl dd:first-child a{margin: 0;}
}
@media only screen and (max-width:768px){
.headbg,
.headbox{height: 50px;}
.navbox ul{height:calc(100vh - 120px);top:60px;}
.headbox .telbox{right: 0;padding-right: 60px;}
.headbox .telbox .txt{padding: 10px 0;}
}

/* navico */
.navico{width:60px;height:60px;position: absolute;top: 0;right: 1%;z-index: 6;}
.navico p{width:100%;height:100%;position:relative;}
.navico span,
.navico span::before,
.navico span::after{width:26px;height:3px;position:absolute;background:#0061a6;display:block;border-radius:1.5px;-webkit-transition: .3s;transition: .3s;}
.navico span{left:50%;top:50%;-webkit-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%);}
.nav_open span{background:transparent;}
.navico span:before,
.navico span:after{content:"";left:0;}
.navico span:before{-webkit-transform:translateY(-300%);transform:translateY(-300%);}
.nav_open span:before{-webkit-transform:rotate(45deg);transform:rotate(45deg);}
.navico span:after{-webkit-transform:translateY(300%);transform:translateY(300%);}
.nav_open span:after{-webkit-transform:rotate(-45deg);transform:rotate(-45deg);}

@media only screen and (min-width:1025px){
.navico{display: none;}
}
@media only screen and (max-width:768px){
.navico{width:50px;height:50px;}
}

/*banner*/
.banner{width: 100%;position: relative;overflow: hidden;}
.bannerpic{width: 100%;height: 0;padding-bottom: 550px;position: relative;z-index: 1;}

/* bannerpic */
#bannerpic ul{width: 100%;height: 100%;position: absolute;display: flex;flex-wrap: nowrap;}
#bannerpic ul li{width:100%;height: 100%;float: left;flex-shrink: 0;position: relative;text-align: center;overflow: hidden;}
#bannerpic ul li a{width: 100%;height: 100%;float: left;position: relative;}
#bannerpic ul li img{height: 100%;position: absolute;top: 0;left: 50%;-webkit-transform: translateX(-50%);transform: translateX(-50%);z-index: -1;}
#bannerpic .btn{width: 100%;text-align: center;position: absolute;bottom: 10px;height: 36px;z-index: 3;}
#bannerpic .btn span{height: 100%;display:inline-block;margin: 0 5px;background: #aaa;border: 3px solid #fff;cursor:pointer;box-shadow: 0 2px 5px rgba(128,128,128,.2);position: relative;overflow: hidden;}
#bannerpic .btn span::after{content: "";width: 100%;height: 100%;position: absolute;left: 0;top: 0;}
#bannerpic .btn span img{height: 100%;position: relative;left: 50%;-webkit-transform: translateX(-50%);transform: translateX(-50%);}
#bannerpic .btn span.on{border-color: #7fd4ff;}

/* shutter */
#shutter{width: 100%;height: 100%;position: absolute;left: 0;top: 0;}
#shutter ul{width: 100%;height: 100%;position: relative;z-index: 1;}
#shutter ul li{width: 100%;height: 100%;position: absolute;left: 0;top: 0;}
#shutter ul li span,
#shutter ul li a{width: 100%;height: 100%;position: absolute;float: left;left: 0;top: 0;overflow: hidden;}
#shutter ul li img{height: 100%;position: absolute;top: 0;left: 50%;-webkit-transform: translateX(-50%);transform: translateX(-50%);z-index: -1;}
#shutter ul li .created{overflow: hidden;position: absolute;z-index: 20;}
#shutter .btn p{position: absolute;z-index: 2;top: 50%;width: 50px;margin-top: -50px;cursor: pointer;background: rgba(0,0,0,.1);font-size: 35px;text-align: center;color: rgba(255,255,255,.75);line-height: 50px;padding: 25px 0;border-radius: 3px;opacity: 0;}
#shutter .btn svg{height: 50px;}
#shutter .btn p.prev{left: 1%;}
#shutter .btn p.next{right: 1%;}
#shutter .desc{position: absolute;z-index: 2;left: 0;bottom: 0;width: 100%;height: 36px;background: url(../images/shutter_shadow.png) repeat;}
#shutter .desc p{padding-left: 20px;line-height: 36px;color: #fff;font-size: 14px;}
#shutter:hover p{opacity: 1;}
#shutter .btn p:hover{background: rgba(0,97,166,.7);}

@media only screen and (max-width:1600px){
.bannerpic{padding-bottom:33%;}
}
@media only screen and (max-width:1250px){
#bannerpic .btn{height: 30px;}
#shutter .btn p{width: 40px;margin-top: -40px;font-size: 24px;padding: 15px 0;font-weight: 600;}
}
@media only screen and (max-width:1024px){
#shutter .btn p{opacity: 1;}
}
@media only screen and (max-width:768px){
#bannerpic .btn{bottom: 10px;height: 16px;}
#bannerpic .btn span{border-width: 3px;border-radius: 50px;width: 16px;margin: 0 10px;}
#bannerpic .btn span img{display: none;}
#bannerpic .btn span.on{border-color: #fff;background: #ffbf00;}
#shutter .btn p{width: 30px;margin-top: -30px;font-size: 18px;padding: 0;}
}
@media only screen and (max-width:425px){
#bannerpic .btn{height: 12px;}
#bannerpic .btn span{border-width: 2px;width: 12px;margin: 0 6px;}
}

/* foot */
.footbox{background:#191919 url(../images/bg2.jpg) center bottom no-repeat;color: #aaa;line-height: 30px;font-size: 14px;background-attachment: fixed;}
.footbox a{color: #aaa;}
.footbox a:hover{color: #fff;}

.footbox .foot_list{border-bottom: 1px solid rgba(255,255,255,.2);padding: 45px 130px 45px 0;}
.footbox .foot_list .titl{padding: 10px 0 20px;font-size: 16px;font-weight: 600;width: 100%;}
.footbox .foot_list .titl a{color: #fff;}
.footbox .foot_list .titl a:hover{color: #ffbf00;}
.footbox .foot_list .cont p{overflow: hidden;width: 100%;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}

.footbox .foot_list .txt{width: 19%;float: left;padding: 0 2%;}
.footbox .foot_list .cla{width: 24%;}
.footbox .foot_list .foot_eng{position: absolute;width: 130px;right: 0;top: 40px;padding-left: 2%;}


.footbox .foot_text{padding: 25px 0;text-align: center;}
.footbox .foot_text .txt{display: inline-block;}
.footbox .foot_text .txt p{display: inline-block;padding: 0 5px;}
.footbox .foot_text .txt .txt-dz,
.footbox .foot_text .txt2{display: none;}

@media only screen and (max-width:1440px){
.footbox .foot_list{padding: 35px 130px 35px 0;}
.footbox .foot_text{padding: 15px 0;}
}
@media only screen and (max-width:1200px){
.footbox .foot_list{padding-right: 120px;}
.footbox .foot_list .txt{width: 18%;}
.footbox .foot_list .cla{width: 28%;}
.footbox .foot_list .foot_eng{width: 120px;}
}
@media only screen and (max-width:1024px){
.footbox .foot_list .hom{width: 15%;}
.footbox .foot_list .cla{width: 29%;}
.footbox .foot_text .txt .txt-dz{display: inline-block;}
.footbox .foot_text .txt{display: block;}
}
@media only screen and (max-width:768px){
.footbox .foot_list{display: none;}
.footbox .foot_text{padding: 20px 0;}
}
@media only screen and (max-width:480px){
.footbox .foot_text .txt2{display: none;}
}