@charset "UTF-8";
 @font-face {
    font-family: 'hm-l';
    src: url('../css/fonts/HarmonyOS_Sans_SC_Light.ttf') format('truetype');
    font-display: swap;
}
@font-face {
    font-family: 'hm-r';
    src: url('../css/fonts/HarmonyOS_Sans_SC_Regular.ttf') format('truetype');
    font-display: swap;
}
@font-face {
    font-family: 'hm-m';
    src: url('../css/fonts/HarmonyOS_Sans_SC_Medium.ttf') format('truetype');
    font-display: swap;
}
@font-face {
    font-family: 'hm-b';
    src: url('../css/fonts/HarmonyOS_Sans_SC_Bold.ttf') format('truetype');
    font-display: swap;
}
@font-face {
    font-family: 'barlow-semibold';
    src: url('../css/fonts/BARLOW-SEMIBOLD.TTF') format('truetype');
    font-display: swap;
}

.overflow{
    overflow: hidden;
}



.font-l{
    font-family: 'hm-l';
}
.font-m{
    font-family: 'hm-m';
}
.font-b{
    font-family: 'hm-b';
} 
.font-num{
    font-family: 'barlow-semibold';
}

*{outline:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;margin:0;padding:0;
    font-family: 'hm-r';
}
html{
    font-size: 100px;
    -webkit-text-size-adjust:100%;
}
body{
    font-size: 14px;
    padding:0;margin:0 auto;color:#333;background-color:#fff;-webkit-text-size-adjust:none;-webkit-tap-highlight:rgba(0,0,0,0);
    /* -webkit-user-select:none;-ms-user-select:none;-moz-user-select:none;-khtml-user-select:none;user-select:none; */
}
ul,ol,li{list-style:none;list-style-type:none;}
a,a:link,a:visited{text-decoration:none;}
a{color: #333;}
ul,li,ol{list-style-type:none;}
img{max-width:100%;vertical-align:middle;outline:none;border:none;}
input{border: none;}
select{appearance: none;}
table{border-collapse:collapse;border-spacing:0}
table td{border-collapse:collapse;}
img{border:none;max-width:100%;vertical-align:middle;}
a{
    color: #333;
    text-decoration: none;
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
    -webkit-user-select: none;
    -moz-user-focus: none;
    -moz-user-select: none;
}
.clear{clear:both;height:0px;overflow:hidden;zoom:0;}
.fl{float:left;}
.fr{float:right;}
.clearfix{zoom: 1;}
.overscroll{height:100%;overflow:auto;width:100%;}
.overscroll::-webkit-scrollbar{width:4px;height:2px;}
.overscroll::-webkit-scrollbar-thumb{border-radius:4px;-webkit-box-shadow:inset 0 0 5px rgba(0,0,0,0.1);background:#002c75;-webkit-border-radius:4px;-moz-border-radius:4px;-ms-border-radius:4px;-o-border-radius:4px;}
.overscroll::-webkit-scrollbar-track{border-radius:10px;background:#dfe5f0;}
/*IE/7/6*/
.clearfix:after{content:'';display:block;height:0;clear:both;}
.dot{display:block;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
.dot2,.dot3,.dot4{display:-webkit-box;display:box;overflow:hidden;text-overflow:ellipsis;word-break:break-all;-webkit-box-orient:vertical;}
.dot2{-webkit-line-clamp:2;}
.dot3{-webkit-line-clamp:3;}
.dot4{-webkit-line-clamp:4;}
.dis_pc{
    display: block;
}
.dis_mb{
    display: none;
}

.white_fff{
    color: #fff;
}
.black_000{
    color: #000;
}
.black_333{
    color: #333;
}
.black_666{
    color: #666;
}
.black_999{
    color: #999;
}


.f80{font-size: .8rem;}
.f72{font-size: .72rem;}
.f60{font-size: .60rem;}
.f52{font-size: .52rem;}
.f48{font-size: .48rem;}
.f44{font-size: .44rem;}
.f42{font-size: .42rem;}
.f40{font-size: .4rem;}
.f30{font-size: .30rem;}
.f36{font-size: .36rem;}
.f32{font-size: .32rem;}

.f28{font-size: .28rem;}
.f26{font-size: .26rem;}
.f24{font-size: .24rem;}
.f22{font-size: .22rem;}
.f20{font-size: .20rem;}
.f18{font-size: .18rem;}
.f16{font-size: .16rem;}
.f14{font-size: .14rem;}
.inner{
    width: 100%;
    max-width: 1600px;
    margin: 0 auto;
}
.auto1400{
    width: 100%;
    margin: 0 auto;
    max-width: 1400px;
}
.auto1200{
    width: 100%;
    margin: 0 auto;
    max-width: 1200px;
}

/* 公共小组 */ 
.base_btn{
    display: inline-block;
    padding: 0 .65rem;
    line-height: .58rem;
    color: #fff;
    border-radius: .3rem;
    -webkit-border-radius: .3rem;
    -moz-border-radius: .3rem;
    -ms-border-radius: .3rem;
    -o-border-radius: .3rem;
    cursor: pointer;
    border: 2px solid #53c3f1;
    color: #53c3f1;
}
.base_btn:hover {
    color: #fff;
    background-color: #53c3f1;
}

.form_btn{
    background-color: #53c3f1;
    border-radius: .3rem;
    -webkit-border-radius: .3rem;
    -moz-border-radius: .3rem;
    -ms-border-radius: .3rem;
    -o-border-radius: .3rem;
    color: #fff;
    line-height: .6rem;
    text-align: center;
    cursor: pointer;
}

.index_tit{
    color: #002c75;
    white-space: nowrap;
    line-height: 1;
    padding-bottom: .02rem;
    border-bottom: .02rem solid #002c75;
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform-origin: 0 0 ;
    margin-left: 0.3rem;
    width: fit-content;
}
.index_title{
    color: #002c75;
    line-height: 1;
    display: inline-block;
    position: relative;
}
.index_title::before{
    content: '';
    display: block;
    width: .38rem;
    height: .38rem;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    background-color: rgba(83, 195, 241, .2);
    position: absolute;
    top: -.2rem;
    left: -.2rem;
}
.index_title::after{
    content: '';
    display: block;
    width: .16rem;
    height: .16rem;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    background-color: rgba(83, 195, 241, 1);
    position: absolute;
    top: .3rem;
    left: -.4rem;
}

.list2_btn1{
    width: .7rem;
    height: .7rem;
    background-color: #53c3f1;
    background-image: url(../images/more1.svg);
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}

.appr_swiper .swiper_btn{
    width: .6rem;
    height: .6rem;
    border: .01rem solid #53c3f1;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    cursor: pointer;
}
.appr_swiper .swiper_btn.prev{
    background-image: url(../images/base_prev.svg);
}
.appr_swiper .swiper_btn.next{
    background-image: url(../images/base_next.svg);
}
.appr_swiper .swiper_btn:hover{
    background-color: #53c3f1;
}
.appr_swiper .swiper_btn.prev:hover{
    background-image: url(../images/base_prev_active.svg);
}
.appr_swiper .swiper_btn.next:hover{
    background-image: url(../images/base_next_active.svg);
}
.base_banner{
    position: relative;
}
.base_banner .imgbox{
    padding-bottom: 34.7%;
}
.base_banner .imgbox img{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.base_banner .text_main{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    width: 100%;
    z-index: 2;
}
.base_banner .tit{
    color: #ffffff;
    line-height: 1.6;
}
.base_banner .ctit{
    color: #fff;
    line-height: 1.88;
    margin-top: .2rem;
}

.locat{
    display: flex;
    justify-content: space-between;
    border-bottom: .01rem solid #e8e9eb;
}
.cats .cat{
    color: #7f8896;
    margin-right: .65rem;
    position: relative;
    display: inline-block;
}
.cats .cat.cur{
    color: #53c3f1;
}
.cats .cat.cur::before{
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: .01rem;
    background-color: #53c3f1;
}
.locat .locat_r a{
    color: #7f8896;
    display: inline-block;
}
.locat .locat_r span{
    color: #002c75;
    display: inline-block;
}
.cats .cat,
.locat .locat_r a,
.locat .locat_r span{
    padding: .4rem 0;
}

.msg{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .8);
    z-index: 9999;
}
.msg .main{
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    padding: 2%;
}
.msg .content{
    position: relative;
    max-height: 100%;
    height: auto;
}


.form2 .close{
    width: .7rem;
    height: .7rem;
    position: absolute;
    right: 0;
    bottom: 0;
    background-color: #53c3f1;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    cursor: pointer;
}
.form2 .close::before{
    content: '';
    display: block;
    width: .2rem;
    height: .05rem;
    background-color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    border-radius: .2rem;
    -webkit-border-radius: .2rem;
    -moz-border-radius: .2rem;
    -ms-border-radius: .2rem;
    -o-border-radius: .2rem;
    transform: translate(-50%,-50%) rotate(45deg) ;
    -webkit-transform: translate(-50%,-50%) rotate(45deg) ;
    -moz-transform: translate(-50%,-50%) rotate(45deg) ;
    -ms-transform: translate(-50%,-50%) rotate(45deg) ;
    -o-transform: translate(-50%,-50%) rotate(45deg) ;
}
.form2 .close::after{
    content: '';
    display: block;
    width: .2rem;
    height: .05rem;
    background-color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    border-radius: .2rem;
    -webkit-border-radius: .2rem;
    -moz-border-radius: .2rem;
    -ms-border-radius: .2rem;
    -o-border-radius: .2rem;
    transform: translate(-50%,-50%) rotate(-45deg) ;
    -webkit-transform: translate(-50%,-50%) rotate(-45deg) ;
    -moz-transform: translate(-50%,-50%) rotate(-45deg) ;
    -ms-transform: translate(-50%,-50%) rotate(-45deg) ;
    -o-transform: translate(-50%,-50%) rotate(-45deg) ;
}

.msg .close{
    width: .5rem;
    height: .5rem;
    position: absolute;
    top: .1rem;
    right: .1rem;
    background-color: #53c3f1;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    cursor: pointer;
    z-index: 2;
}
.msg .close::before{
    content: '';
    display: block;
    width: .2rem;
    height: .05rem;
    background-color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    border-radius: .2rem;
    -webkit-border-radius: .2rem;
    -moz-border-radius: .2rem;
    -ms-border-radius: .2rem;
    -o-border-radius: .2rem;
    transform: translate(-50%,-50%) rotate(45deg) ;
    -webkit-transform: translate(-50%,-50%) rotate(45deg) ;
    -moz-transform: translate(-50%,-50%) rotate(45deg) ;
    -ms-transform: translate(-50%,-50%) rotate(45deg) ;
    -o-transform: translate(-50%,-50%) rotate(45deg) ;
}
.msg .close::after{
    content: '';
    display: block;
    width: .2rem;
    height: .05rem;
    background-color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    border-radius: .2rem;
    -webkit-border-radius: .2rem;
    -moz-border-radius: .2rem;
    -ms-border-radius: .2rem;
    -o-border-radius: .2rem;
    transform: translate(-50%,-50%) rotate(-45deg) ;
    -webkit-transform: translate(-50%,-50%) rotate(-45deg) ;
    -moz-transform: translate(-50%,-50%) rotate(-45deg) ;
    -ms-transform: translate(-50%,-50%) rotate(-45deg) ;
    -o-transform: translate(-50%,-50%) rotate(-45deg) ;
}

.go_top{
    width: .6rem;
    height: .6rem;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    background-color: #53c3f1;
    position: absolute;
    right: .5rem;
    top: -.3rem;
    cursor: pointer;
}
.go_top::before{
    content: '';
    display: block;
    background-image: url(../images/base_prev_active.svg);
    width: .15rem;
    height: .14rem;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%) rotate(90deg);
    -webkit-transform: translate(-50%,-50%) rotate(90deg);
    -moz-transform: translate(-50%,-50%) rotate(90deg);
    -ms-transform: translate(-50%,-50%) rotate(90deg);
    -o-transform: translate(-50%,-50%) rotate(90deg);
    background-size: contain;
}



/*pages*/
 

.Pages{
    text-align: center;
}
.Pages .p_page{
    display: flex;
    justify-content: center;
}
.Pages .p_page a{
    width: .5rem;
    text-align: center;
    line-height: .5rem;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    position: relative;
    display: inline-block;
    font-style: initial;
    margin: 0 .1rem;
    font-size: .18rem;
    color: #434c5a;
    font-family:"HarmonyMedium";
    border: .01rem solid transparent;
}
.Pages .p_page .num a{
    background-color: #fff;
}
.Pages .p_page a.a_cur{
    color: #53c3f1; 
    border-color: #53c3f1;
}
.Pages .p_page a:hover{
    color: #fff;
    background-color: #53c3f1;
}
.Pages a.a_prev{
    background-image: url(../images/base_prev1.svg);
    background-repeat: no-repeat;
    background-size: .15rem;
    background-color: #fff;
    background-position: center;
    border-color: transparent;
}
.Pages a.a_next{
    background-image: url(../images/base_next1.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: .15rem;
    background-color: #fff;
    border-color: transparent;
}
.Pages a.a_prev:hover{
    background-image: url(../images/base_prev_active.svg);
    color: #fff;
}
.Pages a.a_next:hover{
    background-image: url(../images/base_next_active.svg);
    color: #fff;
}
@media (max-width: 1024px){
    .Pages .p_page a{
        width: 40px;
        line-height: 40px;
        font-size: 16px;
    }
   
    .Pages .a_prev::before {
        right: 13px;
    }
    
    .Pages .a_next::before {
        right: 15px;
    }
}
@media (max-width: 768px){
    .Pages .p_page a {
        width: 30px;
        line-height: 30px;
        font-size: 14px;
        margin: 0 5px;
    }
    .Pages .a_prev,
    .Pages .a_next{
        height: 30px;
    }
    .Pages .a_prev::before {
        right: 8px;
        top: 11px;
    }
    .Pages .a_next::before {
        top: 11px;
        right: 12px;
    }
   
}
@media (max-width: 640px){
   
    .Pages .num{
        display: none;
    }
   
}
/*pages end*/

@media (min-width:1601px){
    html{font-size: 100px}
    .inner{
        width: 100%;
        padding: 0 20px;
    }
}
@media (max-width:1600px){
    .inner{
        padding: 0 20px;
    }
    html{font-size: calc(100 / 1600 * 100vw);}
}
@media (max-width:1400px){ 
    .auto1400{
        padding: 0 20px;
    }
    .cats .cat, .locat .locat_r a, .locat .locat_r span{
        padding: .3rem 0;
    }
    .cats .cat {
        margin-right: .45rem;
    }
}

@media (max-width:1024px){ 
    .auto1200{
        padding: 0 20px;
    }
}
@media (max-width:1024px){ 
    .base_btn {
        padding: 0 .3rem;
        line-height: .4rem;
    }
    .form2_box .form2_btn{
        line-height: .4rem;
    }
    
    .form_btn{
        line-height: .4rem;
    }
    .list2_btn1 {
        width: .4rem;
        height: .4rem;
    }
    .appr_swiper .swiper_btn {
        width: .4rem;
        height: .4rem;
    }
    .cats .cat, .locat .locat_r a, .locat .locat_r span{
        padding: .2rem 0;
    }
    .cats .cat {
        margin-right: .25rem;
    }
    .form2 .close,
    .msg .close {
        width: .5rem;
        height: .5rem;
    }
    .go_top{
        width: .4rem;
        height: .4rem;
        top: -.2rem;
    }

    .f80{font-size: .6rem;}
    .f72{font-size: .48rem;}
    .f60{font-size: .4rem;}
    .f52 {
        font-size: 0.38rem;
    }
    .f48{font-size: .36rem;}
    .f40{font-size: .3rem;}
    .f36{font-size: .24rem;}
    .f32{font-size: .2rem;}
    .f26{font-size: .18rem;}
    .f24{font-size: .18rem;}
    html{font-size: calc(100 / 1024 * 100vw);}
}
@media (max-width:768px){ 
    .f80{font-size: .4rem;}
    .f72{font-size: .3rem;}
    .f60{font-size: .28rem;}
    .f52{font-size: .24rem;}
    .f48{font-size: .28rem;}
    .f40{font-size: .24rem;}
    .f32{font-size: .22rem;}
    .f26{font-size: .2rem;}
    .f18{font-size: .14rem;}
    .f16 {
        font-size: .12rem;
    }
    html{font-size: calc(100 / 768 * 100vw);}
    .index_title::before {
        width: .2rem;
        height: .2rem;
        top: -.1rem;
        left: -.1rem;
    }
    .index_title::after {
        width: .1rem;
        height: .1rem;
        top: .15rem;
        left: -.3rem;
    } 
    .base_banner .ctit {
        margin-top: .1rem;
    }
    .cats .cat, .locat .locat_r a, .locat .locat_r span{
        padding: .15rem 0;
    }
    
}
@media (max-width:640px){ 
    html{font-size: calc(100 / 640 * 100vw);} 
    .f40{font-size: .4rem;}
    .f26{font-size: .28rem;}
    .f24{font-size: .26rem;}
    .f22{font-size: .24rem;}
    .f20{font-size: .22rem;}
    .f18{font-size: .22rem;}
    .f16{font-size: .20rem;}
    .f14{font-size: .18rem;} 
    .locat .locat_r {
        display: none;
    }
    .base_banner .imgbox {
        padding-bottom: 250px;
    }
}