html {font-size: calc((100vw / 1920) * 100 );}

html, body, input, select, input, textarea, button{font-family:  'Microsoft Yahei', 'PingFangSC Regular','Arial';}

body {font-size: 16px; }

::-ms-clear, ::-ms-reveal{display: none;}

select::-ms-expand{ display: none; } 

input, button {border: 0; outline: none;}

dt {font-weight: normal;}

h1, h2, h3 {margin-top: 0;}

a:hover, a:active, a:link, a:visited {text-decoration: none;}

/* a:active, a:link, a:visited {color: #cf263a;} */

img {max-width: 100%;}

ul {list-style: none; padding: 0;}

.rel {position: relative;}

.abs {position: absolute;}

.fixed {position: fixed;}

.overhide {overflow: hidden;}

.trans-3 {transition: all .3s;}

.trans-8 {transition: all .8s;}

.fl{float: left;}

.fr{float: right;}

.block {display: block;}

.iblock {display: inline-block;}

.mg0 {margin: 0 !important;}

.mt0 {margin-top: 0 !important;}

.ml0 {margin-left: 0 !important;} 

.mr0 {margin-right: 0 !important;}

.mb0 {margin-bottom: 0 !important;}

.pd0 {padding: 0 !important;}

.pt0 {padding-top: 0 !important;}

.pl0 {padding-left: 0 !important;}

.pr0 {padding-right: 0 !important;}

.pb0 {padding-bottom: 0 !important;}

.pt60{padding-top: 30px; }

.pb60{padding-bottom: 30px; }

.pl60{padding-left: 30px;}

.pr60{padding-right: 30px;}

.pt80-pb100{padding-top: 30px; padding-bottom: 40px;}

.mt20{margin-top: 20px;}

.mt28{margin-top: 0.20rem;}

.mb40{margin-bottom: 0.36rem !important;}

.f12{font-size: 12px;}

.f14{font-size: 12px;}

.f16{font-size: 14px;}

.f18{font-size: 16px;}

.f20{font-size: 16px;}

.f22{font-size: .22rem;}

.f28{font-size: 0.28rem;}

.f26{font-size: 0.26rem;}

/* .f28{font-size: calc(16px + 0.63vw);} */

/* .f32{font-size: calc(16px + 1.15vw);} */

.f32{font-size: calc(16px + 0.835vw);}

.f36{font-size: calc(16px + 1.045vw);}

.f42{font-size: calc(16px + 1.355vw);}
.f43{font-size: calc(16px + 1.415vw);}

.f44{font-size: calc(16px + 1.46vw);}

.f48{font-size: 0.48rem;}
.f54{font-size: 0.54rem;}




.gray222{color: #222;}

.gray333{color: #333;}

.gray666{color: #666;}

.gray777{color: #777;}

.gray999{color: #999;}

/* .cgray{color: #0E1421;} */

.cblack{color: #30364C;}

.cblue{color: #4F84FF;}

.cwhite100{color: rgba(255, 255, 255, 1);}

.cwhite50{color: rgba(255, 255, 255, 0.5);}

a.cwhite50:hover{color: rgba(255, 255, 255, 1);}

.tc{text-align: center;}

.tl{text-align: left;}

.tr{text-align: right;}

.bold{font-weight: bold;}

.clearfix {zoom: 1;}

.weui-cell {padding: 10px 15px; position: relative; display: -webkit-box; display: -webkit-flex; display: flex;-webkit-box-align: center; -webkit-align-items: center; align-items: center;}

.weui-cell__bd {min-width: 1px; -webkit-box-flex: 1; -webkit-flex: 1; flex: 1;}

.weui-cell__ft {text-align: right; color: #999999;}

.d-flex {display: -webkit-box; display: -webkit-flex; display: flex;}

.d-flex-item {min-width: 1px;-webkit-box-flex: 1; -webkit-flex: 1; flex: 1;}

.d-flex-wrap{display: flex; flex-wrap: wrap;}

.start {-webkit-box-align: start; -webkit-align-items: flex-start; align-items: flex-start;}

.middle {-webkit-box-align: center; -webkit-align-items: center; align-items: center;}

.end {-webkit-box-align: end; -webkit-align-items: flex-end; align-items: flex-end;}

.jcenter{justify-content: center;}

.jbetween{justify-content: space-between;}

.nobefore::before, .noafter::after {display: none !important;}

.ellipsis {white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}

.line2 {overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; word-wrap: break-word;}

.line3 {overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; word-wrap: break-word;}
.line6 {overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 6; word-wrap: break-word;}

.d-block{display: block;}

.img-cover{width: 100%; height: 100%; object-fit: cover;}

.img-contain{width: 100%; height: 100%; object-fit: contain;}

@media (min-width: 1600px) {

  .container { width: 74.75%;   padding: 0;}

  .container2 { width: 83.1%;   padding: 0; margin: auto;}

}


@media (min-width: 993px){
  .container2 {  width: 83.1%;  padding: 0; margin: auto;}

  .f12{font-size: 0.12rem;}

  .f14{font-size: 0.14rem;}

  .f16{font-size: 0.16rem;}

  .f18{font-size: 0.18rem;}

  .f20{font-size: 0.20rem;}

  .f22{font-size: 0.22rem;}

  .f24{font-size: 0.24rem;}

  .f30{font-size: 0.30rem !important;}

  .pt60{padding-top: 0.60rem; }

  .pb60{padding-bottom: 0.60rem; }

  .pl60{padding-left: 0.60rem;}

  .pr60{padding-right: 0.60rem;}

  .pt80-pb100{padding-top: 0.80rem; padding-bottom: 1.00rem;}

  .container-fluid{padding-left: 0; padding-right: 0;}

}

@media (max-width: 993px) {

  html {font-size: calc((100vw / 768) * 100);}

  body {font-size: 16px; line-height: 1.5;}

  .d-warp-mobile{ flex-wrap: wrap;}

  .d-flex-w100{width: 100% !important;}

  .container2{

    padding-right: 15px;

    padding-left: 15px;

    margin-right: auto;

    margin-left: auto;

  }
  
}



/* header */

.header{height: 0.90rem; line-height: 0.90rem; border-bottom: 1px solid rgba(255,255,255,0.2); position: fixed;z-index: 15; width: 100%; left: 0; top: 0;  background: transparent; display: flex; align-items: center; justify-content: space-between; padding: 0 4.18vw;}

.header_logo{overflow: hidden;height: 0.48rem;}

.header_logo img{display: block; height: 0.48rem;transform: translateY(0); transition: all .36s; }



.header.on .header_logo img,.header.active .header_logo img{transform: translateY(-100%);}

.nav{ flex: 1; display: flex;  align-items: center; justify-content: center;}

.nav .nav-item{ padding:0 1.25vw 0; /*position: relative;*/ }

.nav .nav-item >a{color: #FFFFFF; display: block; height: 100%; position: relative; font-size: 0.16rem; }

.nav .nav-item >a::after{position: absolute; content: ''; bottom: .15rem; left: 50%;transform: translateX(-50%); height: 3px; background: #17386E; width: 0; transition: width 0.36s linear; opacity: 0;}

.nav .nav-item .sub-nav{width:100vw; left: 0; top: 0.90rem;  display: none;  z-index: 15;

  background: #fff;box-shadow: 0px -6px 9px 0px rgba(168,168,168,0.14);}

.nav .nav-item .sub-nav .sub-nav-box{  position: relative;  height: 100%;}

.nav .nav-item.active >a{color: #17386E  !important;}
.nav .nav-item.active >a::after{opacity: 1  !important; width: 100% !important;}



.sub-nav  ul{display: flex; align-items: center; justify-content: center; width: 100%; margin-bottom: 0;}

.sub-nav  ul li{ cursor: pointer; line-height: initial; border-radius: 0.04rem; background: transparent; padding: 0.28rem 0.22rem; flex-direction: column;}

.sub-nav  ul li .nav-icon-box{width: 0.40rem; height: 0.40rem; position: relative;margin-right: 0.09rem;}

.sub-nav  ul li .nav-icon-box img{position: absolute; left: 0; top: 0; width: 100%; }

.sub-nav ul li .menu_iconimg1{z-index: 4; opacity: 1;}

.sub-nav ul li .menu_iconimg2{z-index: 1; opacity: 0;}

.sub-nav  ul li  .nav-text{ color: #333; flex: 1;}

.sub-nav .sub-nav-box .sub-nav-r{width: 60%; padding: 0.20rem 0.34rem 0.38rem 0.30rem; border-left: 1px solid #e2e2e2;}

.sub-nav-r-content{display: none; }

.sub-nav-r-content.act{display: block; }

.sub-nav-r-content .title{ margin-bottom: 0.17rem; line-height: initial;}

.sub-nav-r-content .sub_r_img{ width: 100%; }

.sub-nav-r-content .txt{line-height: 0.28rem;  margin-top: 0.15rem;}

.about_sub_menu ul {width: 100%; margin-bottom: 0;}

.about_sub_menu ul  li{ border-bottom: 1px solid #e2e2e2; position: relative; cursor: pointer; color: #777777; font-size: 0.16rem; line-height: initial; padding: 0.20rem 0.16rem; }

.about_sub_menu ul  li i{opacity: 0; color: #fff;}

.header_right{height: 100%; }

.lineh38-mt30{line-height: 38px; margin-bottom: .003rem;}
.kefu-box{display: flex;align-items: center; color: #fff;font-size: .16rem;}
.header_kefu_icon{width: .2rem; height: .2rem; overflow: hidden; margin-right: 4px;}
.header_kefu_icon img{width: .2rem; height: .2rem;}
.header_kefu_icon img:nth-child(1){display: block;}
.header_kefu_icon img:nth-child(2){display: none;}
.login-btn-box{height: 0.90rem; display: flex; align-items: center;}
.fenge{margin-left: .24rem;margin-right: .17rem;color: rgba(255, 255, 255, 1);}
.lan{color: rgba(255, 255, 255, 0.5); cursor: pointer; font-size: .16rem;}
.lan a{padding: 0 3px;color: rgba(255, 255, 255, 0.5);}
.lan a.active{color: rgba(255, 255, 255, 1);}


.nav-icon {

  display: block;

  position: absolute;

  right: 15px;

  top: 50%;

  margin-top: -7px;

}

 .nav-icon span {

  display: block;

  width: 22px;

  height: 2px;

  background: #333333;

  border-radius: 2px;

  transition: all .3s linear;

}

 .nav-icon span:not(:first-child) {

  margin-top: 4px;

}

 .nav-icon.on span:nth-of-type(1) {

  -webkit-transform: matrix(1,0,0,1,0,6) rotate(

45deg

);

  transform: matrix(1,0,0,1,0,6) rotate(

45deg

);

}

 .nav-icon.on span:nth-of-type(2) {

  width: 0;

}

 .nav-icon.on span:nth-of-type(3) {

  -webkit-transform: matrix(1,0,0,1,0,6) rotate(

45deg

);

  transform: matrix(1,0,0,1,0,-6) rotate(

-45deg

);

}

/* 索搜框 */



.search-box-div{



position: fixed;

background: #fff;



top: 0;



left: 0;



right: 0;



height: 0.90rem;



z-index: 1000;



padding: 0 23%;



display: flex;



opacity: 0;



justify-content: center;



align-items: center;



transform: translateY(-100%);



cursor: pointer;



transition: all .5s ease;



}



.search-close {



display: flex; 



align-items: center;



width: .0022rem;



margin-left: 13.8vw;



cursor: pointer;



transition: all .3s ease;



}



.search-box-div >input{ width: 25vw; border-bottom: 1px solid #d7d7d7;height: 50px;}



.search-box-div > img {width: 22px; height: 22px;}



.search-close:hover{transform: rotate(180deg);}



.search-box-div.on{transform: translateY(0%); opacity: 1;}



@media (min-width: 993px){



.header.on,.header.active{background: #FFFFFF; box-shadow: 0px 8px 16px 0px rgba(192, 192, 192, 0.1);}

.header.on .header_lan_txt ,.header.on .header_lan_txt a,  .header.active .header_lan_txt ,.header.active .header_lan_txt a{color: rgba(51,51,51,0.4);}

.header.on  .nav .nav-item >a,.header.on .header_lan >i,.header.on .header_lan_txt a.on ,.header.on .login-btn-box .fenge {color: #333;}

.header.active  .nav .nav-item >a,.header.active .header_lan >i,.header.active .header_kefu_icon >i,.header.active .header_lan_txt a.on,.header.active .login-btn-box .fenge{color: #333;}
.header.on .login-btn-box .lan span,.header.active .login-btn-box .lan span{color: rgba(51, 51, 51, .5);}
.header.on .login-btn-box .lan span.active,.header.active .login-btn-box .lan span.active{color: #17386E;}
.lan .cn:hover,.lan .en:hover,.lan .cn.active,.lan .en.active{color: #17386E !important;}
.header.active .lan a,.header.on .lan a{color: #333;}
.header.on .nav .nav-item:hover >a, .header.active .nav .nav-item:hover >a{color: #17386E;}

.header.on .nav .nav-item:hover >a::after,.header.on .nav .nav-item .sub-nav a:hover::after{width: 100%;opacity: 1;}

.header.active .nav .nav-item:hover >a::after,.header.active .nav .nav-item .sub-nav a:hover::after{width: 100%; opacity: 1;}

.header.on .header_lan_txt a:hover,.header.active .header_lan_txt a:hover{color: rgba(51,51,51,1);}
.header.on .header_kefu_icon img:nth-child(1),.header.active .header_kefu_icon img:nth-child(1){display: none;}
.header.on .header_kefu_icon img:nth-child(2),.header.active .header_kefu_icon img:nth-child(2){display: block;}
.header.on .kefu-box,.header.active .kefu-box {color: #333;}

.nav .nav-item .sub-nav .sub-nav-box a:hover{ color: #fff; box-shadow: 2px 3px 4px 0px rgba(36,36,36,0.13);background: #17386E;}



.header.on .login-btn span,.header.active .login-btn span,.header.on .login-btn i,.header.active .login-btn i {color: rgba(51, 51, 51, 1);} 

/* .sub-nav  ul li:hover{background: #4F84FF; } */

.sub-nav ul li:hover .menu_iconimg1{opacity: 0; z-index: 1;}

.sub-nav ul li:hover .menu_iconimg2{opacity: 1; z-index: 4;}

.sub-nav  ul li:hover  .nav-text{color: #17386E;}

.about_sub_menu ul  li:hover,.login-dropmenu a:hover{background: #17386E; color: #fff;}

.about_sub_menu ul  li:hover i,.login-dropmenu ul li:hover i{opacity: 1;}


}

@media (max-width: 993px){

.m-lan{display: flex; flex-wrap: wrap;}

.m-lan a{margin-right: 30px;}

.header_logo img,.header_logo{height: 24px;}


 .header .header_logo .logo1 ,.header.on .header_logo .logo1, .header.active .header_logo .logo1{display: none;}
 .header .header_logo .logo2  ,.header.on .header_logo .logo2, .header.active .header_logo .logo2{display: block;} 
 .header.active .header_logo img{transform: translateY(0);}

.header{z-index: 50; height: 60px; background: #fff; line-height: 60px; padding:0  50px 0 4.89vw;}

.header .header_kefu_icon .iconfont{color: #333;}

.header .nav{display: block !important; padding: 0 30px; transform: translateX(100%); position: fixed;background: #fff; left: 0; right: 0; top: 60px; bottom: 0;}



.header .nav .nav-item >a{height: 55px; font-size: 14px;display: block; line-height: 55px;color: #333;}

.header .nav .nav-item .has_subnav{position: relative;}

.header .nav .nav-item:hover >a::after,.header.mactive .nav .nav-item:hover >a::after{width: 0; }

.header .nav .nav-item .has_subnav::before{position: absolute;content: ''; transition: all .6s; width: 8px; height: 8px; right: 0; top: 50%; border-top: 1px solid #333; border-right: 1px solid #333; transform: rotate(45deg) translateY(-50%); }

.header.mactive .nav{transform: translate(0);}

.header .nav .nav-item.on .has_subnav::before{transform: rotate(135deg) translateY(100%);}



.header.mactive .nav .nav-item:nth-child(1){border-top: 1px solid #C7C9C8;}

.header .nav .nav-item .header_lan_txt a,.header .nav .nav-item .header_lan_txt{color: #333;}

.header .nav .nav-item .header_lan_txt a{padding-right: 10px; padding-left: 10px;}

.header .nav .nav-item .header_lan_txt a:first-child { padding-left: 0px;}



.header .nav .nav-item .sub-nav{position: relative;display: none; z-index: 18;text-align: left;box-shadow:none;  left: 0; right: 0; width: 100% !important; bottom: 0;  top: 100%; height: auto;   }



.header .nav .nav-item .sub-nav a{height: 50px;  margin-right: 0; font-size: 14px;display: block;line-height: 50px;color: #333;}

.header .nav .nav-item.on .sub-nav.on{transform: translateY(0);}



.header .nav .nav-item.on .sub-nav.on a:nth-child(1){border-top: 1px solid #C7C9C8;}

.sub-nav ul{flex-direction: column;}

.sub-nav.on p,.login-dropmenu.on p{position: absolute; top: -60px; height: 59px;left: 0;padding-left: 30px; width: 40%; background: #fff;}

.nav .nav-item .sub-nav{width: 100vw;}

.search-box{height: 60px; line-height: 60px; padding: 0 30px;}

.header_lan_txt{border-top: 1px solid #C7C9C8;border-bottom: 1px solid #C7C9C8; margin-top: 10px;}





.nav .nav-item .sub-nav .sub-nav-box a{width: 49.5%;}



.nav .nav-item .sub-nav,.nav .nav-item .sub-nav.pro_sub_menu{width: 100vw !important;}

.about_sub_menu ul li{font-size: 14px; padding: 15px; border-bottom: 0;}

.sub-nav  ul li .nav-text{font-size: 14px !important;}

.sub-nav .sub-nav-box .sub-nav-r{display: none;}

.sub-nav  ul li .nav-icon-box,.login-dropmenu ul li .login-dropmenu-icon{width: 20px; height: 20px;}

.sub-nav  ul li,.login-dropmenu ul li{padding: 15px;}

.login-btn{background: #fff;margin-left:10px; width: unset;}

.login-btn > i{color: #333; font-size: 14px !important;}

.login-dropmenu{

  position: relative;

  display: none;

  z-index: 18;

  text-align: left;

  box-shadow: none;

  left: 0;

  right: 0;

  top: 100%;

  width: 100%;

}

.header_kefu_icon{ padding-right: 0;}

.search-box-div >input{width: 55vw;}

}

/* footer */

.footer{background: url(../images/footer-bg.jpg) no-repeat; background-size: 100% 100%; overflow: hidden; height: 4.3rem; padding-top: .72rem;}
.footer .row1-item{
  color: #fff;
}
.footer .row1-item >img{
  width: 0.4rem;
  height: 0.4rem;
  margin-right: 0.1rem;
}
.row2{padding: .67rem 0 .73rem;}
.footer-logo img{height: .48rem;}
.footer-nav-list{justify-content: flex-end;}

.footer-nav-list .footer-item{margin-left: .48rem;color: #fff; }
.footer-nav-list .footer-item:hover{color: rgba(255, 255, 255, 0.8)}
.copyright{border-top: 1px solid rgba(255,255,255,0.2); padding: .32rem 0 .32rem; color: #fff;}
.copyright a{color: #fff; margin-left: 10px;}
@media (max-width: 993px) {

  .footer{height: unset;}
  .search-box-div{padding: 0 5%;}
  .search-box-div input::placeholder{font-size: 12px;}
  .footer .row1-item{margin-bottom: 15px;}
  .copyright a{display: block;}
}


.ui-select-wrap > span{position: relative; display: block; margin-bottom: 5px; padding-right: 20px; overflow: hidden; height: 44px; line-height: 44px; color: #999; cursor: pointer;}

.ui-select-wrap > span::after{position: absolute; content: ''; display: block; right: 2px; top: 15px; width: 8px; height: 8px; border-right: 2px solid #333; border-bottom: 2px solid #333; transform: rotate(45deg); transition: all .3s;}

.ui-select-wrap > span.on::after{top: 19px; transform: rotate(-135deg);}

.ui-select-option {position: absolute; z-index: 10; left: 0; right: 0; top: 100%; display: none; max-height: 264px; overflow-y: auto; background: #fff; -webkit-overflow-scrolling: touch; border-radius: 0 0 10px 10px; box-shadow: 0 5px 15px rgba(0, 0, 0, .1);}

.ui-select-option span {display: block; padding: 0 15px; height: 44px; font-size: 14px; line-height: 44px; color: #333; overflow: hidden; transition: all .3s; cursor: pointer;}



.search-box{position: fixed; background: #fff; top: 0; left: 0; right: 0; z-index: 999; padding: 0 23%; display: flex; opacity: 0; justify-content: center; align-items: center; transform: translateY(-100%); cursor: pointer; transition: all .5s ease;}

.search-box .weui-cell {height: 1.14rem;}

.search-box input {border-bottom: 1px solid #d7d7d7; padding: 5px 0; width: 4.00rem; line-height: 36px; font-family: 'SourceHanSansCN-Regular';}

.search-box img {display: block; margin: 13px; width: 13px; height: 13px;}

.search-close {position: relative; margin-left: 8vw; width: 40px; height: 40px; transition: all .3s;}

.search-close::before, .search-close::after {position: absolute; top: 50%; left: 50%; display: block; content: ''; margin-top: -1px; margin-left: -8px; width: 16px; height: 2px; background-color: #333;}

.search-close::before {transform: rotate(45deg);}

.search-close::after {transform: rotate(-45deg);}

.search-close:hover {transform: rotate(180deg);}

.search-box.on {transform: translateY(0%); opacity: 1;}

