.top_bg{ height:5.5rem; width:100%;background: rgba(255,255,255,1);}
.header{width: 83.33%;margin: 0 auto;}
.logo{width: 3.8%;height: 3.8rem;line-height: 0;display: flex;align-items: center;padding-left: 3.2%; padding-top:0.5rem;}
.logo img{display: block;width: 100%;}
.h_dw{font-size: 1.6rem;color: #333;line-height: 1.6rem;padding: 1.2rem 0 0 1rem;}
.h_dw i{display: block;font-size: 0.8rem;}
.h_nav{width: 50%; height:5.5rem;padding-right: 3%;}
.h_nav ul{ width: 100%; height:5.5rem;display: flex;justify-content: space-between;}
.h_nav li{position: relative;}
.h_nav li a{ font-size:0.9rem; color:#333;display:block; float:left;position: relative;z-index: 4; text-decoration:none;height: 5.5rem;line-height: 5.5rem;}
.h_nav li a:after {
	position: absolute;
	bottom: 1.4rem;
	left: 0;
	width: 100%;
	height: 0.1rem;
	background: #003686;
	content: '';
	opacity: 0;
	-webkit-transition: height 0.3s, opacity 0.3s, -webkit-transform 0.3s;
	-moz-transition: height 0.3s, opacity 0.3s, -moz-transform 0.3s;
	transition: height 0.3s, opacity 0.3s, transform 0.3s;
	-webkit-transform: translateY(-10px);
	-moz-transform: translateY(-10px);
	transform: translateY(-10px);
}
.h_nav li a:hover:after,
.h_nav li.cur a:after{
	height: 0.1rem;
	opacity: 1;
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	transform: translateY(0px);
}
.h_nav li a:hover,.h_nav li.cur a{color: #003686;}

.h_nav li .erji{ display:none;background: rgba(0,0,0,0.8);height:auto; width:150px;text-align:center; position:absolute; top:5.5rem; left:-36px;z-index:5;}
.h_nav li .erji:before{content: "";width: 0;height: 0;position: absolute;top: -8px;left: calc(50% - 8px);border-bottom:8px solid rgba(0,0,0,0.8); border-left:8px solid transparent;border-right:8px solid transparent;}
.h_nav li .erji li{ border-bottom:rgba(255,255,255,0.3) 1px solid; height:44px; line-height:44px;}
.h_nav li .erji a{ height:44px; line-height:44px; width:150px;color:#fff;}
.h_nav li.cur .erji a:after,.h_nav li .erji a:hover:after{ background:none;opacity: 0;}
.h_nav li.cur .erji a{font-weight:normal;}
.h_nav li.cur .erji a:hover,.h_nav li .erji a:hover{font-weight:bold;}

.h_nav li.li05 .erji{ width:210px; left:-60px;}
.h_nav li.li05 .erji a{ width:210px;}

.h_tel,.search{width: 5%;height: 5.5rem;line-height: 0;cursor:pointer;position: relative;display: flex;align-items: center;justify-content: center;}
.search:before{content: "";width: 1px;height: 100%;background: #e6e6e6;position: absolute;top: 0;left: 0;}
.h_tel img,.search .sea_icon img{width: 1.3rem;height: 1.3rem;}
.h_tel{background: #003686;}
.h_tel p{width: 0;height: 4.3rem;padding-top:1.2rem; background: #003686;position: absolute;top: 0;right: 0;z-index: 5;overflow: hidden;-webkit-transition:all .5s;transition:all .5s;}
.h_tel p i{font-size: 1.1rem;color: #fff;display:block;line-height:1.5rem;}
.h_tel:hover p{width: 10rem;text-align: center;}
.search .sea_icon:hover img{-webkit-animation:hvr-buzz-out 0.75s linear;animation:hvr-buzz-out 0.75s linear;}
.sea_box{position: absolute;width: 13.5rem;right: 0;top:5.5rem;z-index: 100;display: none;}
.sea_box input {float: left;font-size: 0.7rem;}
.sea_box input.txt {width: 10rem;padding: 0 0 0 0.5rem;line-height: 2rem;height: 2rem;border: 0.1rem solid #003686;box-sizing: border-box;}
.sea_box input.btn {width: 3.5rem;background-color: #003686;color: #fff;cursor: pointer;height: 2rem;border: none;}
input::-webkit-input-placeholder {color: #666;}

em,i{font-style: normal;}


.content24 { width: 1600px; margin: 0px auto; position: relative; }
  @media screen and (max-width: 1600px) {
    .content24 {
        width: 1400px;
    }
}

@media screen and (max-width: 1500px) {
    .content24 {
        width: 1300px;
    }
}

@media screen and (max-width: 1300px) {
    .content24 {
        width: 1200px;
    }
}


/**/

@media screen and (min-width: 1263px) {
    html {
        font-size: calc(1263px * 20 / 1903);
    }
}

@media screen and (min-width: 1349px) {
    html {
        font-size: calc(1349px * 20 / 1903);
    }
}

@media screen and (min-width: 1463px) {
    html {
        font-size: calc(1463px * 20 / 1903);
    }
}

@media screen and (min-width: 1543px) {
    html {
        font-size: calc(1543px * 20 / 1903);
    }
}

@media screen and (min-width: 1583px) {
    html {
        font-size: calc(1583px * 20 / 1903);
    }
}

@media screen and (min-width: 1643px) {
    html {
        font-size: calc(1643px * 20 / 1903);
    }
}

@media screen and (min-width: 1663px) {
    html {
        font-size: calc(1663px * 20 / 1903);
    }
}

@media screen and (min-width: 1903px) {
    html {
        font-size: calc(1903px * 20 / 1903);
    }
}




  
  

    .jg h3 span {display: block;font-size: 20px; line-height: 28px; font-weight: normal; text-align: center; padding-top: 24px; color: #111;        border-radius: 50px; }
    
    .jg h3 img { display: block; width: 180px; height: 180px; margin: 16px auto 0;    }
    
    .jg p { display: block; font-size: 16px; line-height: 16px; font-weight: normal; text-align: center; padding-top: 14px; color: #666; }
    
    .layui-layer {        border-radius: 10px;    }



 .f_bg{background: url(images/f_bg.jpg) no-repeat center top/100% 30rem; height:26.8rem;padding-top: 3.2rem;overflow: hidden;}
.footer{width: 83.33%; margin:0 auto;}
.foot_top{width: 100%;height: 6.1rem;border-bottom: rgba(255,255,255,0.1) 0.1rem solid;}
.f_logo{width: 25%;}
.f_logo a{width: 100%;height: 3.5rem;display: flex;align-items: center;}
.f_logo em{width: 17.5%;line-height: 0;}
.f_logo em img{display: block;width: 100%;}
.f_logo b{font-size: 1.2rem;color: rgba(255,255,255,0.8);padding-left: 0.6rem;}
.f_nav{width: 50%;}
.f_nav ul{width: 100%;height: 3.5rem;display: flex;align-items: center;justify-content: space-between;}
.f_nav ul li a{font-size: 0.9rem;color: rgba(255,255,255,0.8);display: block;line-height: 3.5rem;}
.f_nav ul li a:hover{font-weight: bold;}
.f_top{display: block;width: 100%;font-size: 1rem;color: rgba(255,255,255,0.8);height: 3.5rem;line-height: 1.6rem;overflow: hidden;margin-bottom: 2.2rem;font-weight: bold;}
.f_top i{display: block;font-size: 1.5rem;text-transform: uppercase;}
.f_ban{width: 38.75%;padding-top: 4rem;height: 16.6rem;color: rgba(255,255,255,0.8);}
.f_ban p{font-size: 0.9rem;line-height: 1.8rem;}
.f_tel{font-size: 1.5rem;color: #fff;line-height: 2rem;padding: 0 0 0.2rem 1.6rem; background: url(images/f_tel.png) no-repeat 0 center/1.2rem 1.2rem;}
.f_about{width: 34%;padding-top: 4rem;height: 16.6rem;font-size: 1rem;color: rgba(255,255,255,0.8);line-height: 1.8rem;}
.f_about p.ab_t{padding-bottom: 0.6rem;}
.f_about p.ab_t i{display: block;font-size: 0.6rem;text-transform: uppercase;line-height: 0.6rem;}
.f_about span{padding: 0 0.5rem;}
.f_about a{color: rgba(255,255,255,0.8);}
.f_er{width: 26.25%;padding-top: 4rem;height: 16.6rem;}
.f_code{width: 100%;display: flex;justify-content: space-between;}
.f_code p{width: 48%;height: 8rem;overflow: hidden;}
.f_code p em{display: block;float: left;width: 80%;line-height: 0;background: #fff;padding: 0.3rem;box-sizing: border-box;height: 8rem;}
.f_code p img{display: block;width: 100%;height: 100%;}
.f_code p span{display: block;float: left;width: 20%;font-size: 0.8rem;color: rgba(255,255,255,1);line-height: 1.8rem;height: 8rem;text-align: center;background: rgba(255,255,255,0.2);writing-mode: vertical-lr; }
.f_er .f_top{margin-bottom: 1.2rem;}
 
   
    

    

     .xin-2112-client-1 {
        width: 76px;
        position: fixed;
        right: 0;
        top: 50%;
        z-index: 999;
        color: #333;
        background: #fff;
        box-shadow: 0 0 5px 5px rgba(0, 0, 0, 0.1);
        border-radius: 3px;
    }
    
    .xin-2112-client-1 li {
        width: 76px;
        border-radius: 2px;
        position: relative;
        cursor: pointer;
        padding: 10px 0 13px;
    }
    
    .xin-2112-client-1 li.my-kefu-top {
        display: none;
    }
    
    .xin-2112-client-1 li a {
        display: block;
        height: 100%;
        text-decoration: none;
        color: #333;
    }
    
    .xin-2112-client-1 li i {
        display: block;
        width: 38px;
        height: 37px;
        overflow: hidden;
        margin: 0 auto;
        background: url("images/xin-2112-client-icon.png") no-repeat;
        transition: all 0.3s;
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
    }
    
    .xin-2112-client-1 li.my-kefu-tel i {
        background-position: 0 0;
    }
    
    .xin-2112-client-1 li.my-kefu-link i {
        background-position: 0 -47px;
    }
    
    .xin-2112-client-1 li.my-kefu-qq i {
        background-position: 0 -94px;
    }
    
    .xin-2112-client-1 li.my-kefu-weixin i {
        background-position: 0 -141px;
    }
    
    .xin-2112-client-1 li.my-kefu-top i {
        background-position: 0 -188px;
    }
    
    .xin-2112-client-1 li .client-2112-cont {
        width: 160px;
        padding: 14px 14px 14px 70px;
        position: absolute;
        right: 85px;
        top: 4px;
        color: #fff;
        font-size: 18px;
        height: 32px;
        line-height: 32px;
        text-align: left;
        background: #0055c0;
        display: none;
    }
    
    .xin-2112-client-1 li .client-2112-cont:after {
        content: "";
        position: absolute;
        width: 0;
        height: 0;
        top: 50%;
        margin-top: -7px;
        right: -7px;
        border-bottom: 7px solid transparent;
        border-top: 7px solid transparent;
        border-left: 7px solid #0055c0;
    }
    
    .xin-2112-client-1 li .client-2112-cont:before {
        content: "";
        position: absolute;
        width: 38px;
        height: 38px;
        background: url("images/xin-2112-client-icon.png") no-repeat;
        left: 25px;
        top: 50%;
        margin-top: -19px;
        z-index: 1;
    }
    
    .xin-2112-client-1 li .client-2112-cont-weixin {
        width: 115px;
        padding: 14px;
        position: absolute;
        right: 85px;
        top: -28px;
        background: #fff;
        display: none;
    }
    
    .xin-2112-client-1 li .client-2112-cont-weixin:after {
        content: "";
        position: absolute;
        width: 0;
        height: 0;
        top: 50%;
        margin-top: -7px;
        right: -7px;
        border-bottom: 7px solid transparent;
        border-top: 7px solid transparent;
        border-left: 7px solid #fff;
    }
    
    .xin-2112-client-1 li .client-2112-cont-weixin img {
        width: 115px;
        height: 115px;
        display: block;
    }
    
    .xin-2112-client-1 li.my-kefu-tel .client-2112-cont:before {
        background-position: -70px 0;
    }
    
    .xin-2112-client-1 li.my-kefu-qq .client-2112-cont:before {
        background-position: -70px -94px;
    }
    
    .xin-2112-client-1 li p {
        display: block;
        height: 18px;
        line-height: 18px;
        font-size: 12px;
        color: #333;
        text-align: center;
    }
    
    .xin-2112-client-1 li.my-kefu-link a {
        animation: heart 1s ease-in-out infinite alternate;
    }
    
    .xin-2112-client-1 li.cur,
    .xin-2112-client-1 li:hover {
        background: #0055c0;
    }
    
    .xin-2112-client-1 li.cur.my-kefu-tel i,
    .xin-2112-client-1 li.my-kefu-tel:hover i {
        background-position: -70px 0;
    }
    
    .xin-2112-client-1 li.cur.my-kefu-link i,
    .xin-2112-client-1 li.my-kefu-link:hover i {
        background-position: -70px -47px;
    }
    
    .xin-2112-client-1 li.cur.my-kefu-qq i,
    .xin-2112-client-1 li.my-kefu-qq:hover i {
        background-position: -70px -94px;
    }
    
    .xin-2112-client-1 li.cur.my-kefu-weixin i,
    .xin-2112-client-1 li.my-kefu-weixin:hover i {
        background-position: -70px -141px;
    }
    
    .xin-2112-client-1 li.cur.my-kefu-top i,
    .xin-2112-client-1 li.my-kefu-top:hover i {
        background-position: -70px -188px;
    }
    
    .xin-2112-client-1 li.cur p,
    .xin-2112-client-1 li:hover p {
        color: #fff;
    }
    
    .xin-2112-client-1 li:hover .client-2112-cont,
    .xin-2112-client-1 li:hover .client-2112-cont-weixin {
        display: block!important;
    }
