@charset "utf-8";

#app{background: url(../images/app.png) left 21vw no-repeat;background-size: 100% auto;}

.pad1{ padding: .74rem 0; overflow: hidden;}

.home1{padding: .8rem 0 .25rem;position: relative;z-index: 1;}
.home1 .wp{ position: relative}
.home1 .wp .more1{position: absolute;top: -.65rem;right: 0;filter: brightness(8);}
.home1::before{content: "";position: absolute;top: 0;right: 0;bottom: .45rem;left: calc((100vw - 16rem)/2 + .36rem);z-index: -1;border-radius: .2rem 0px 0px 0px;background: linear-gradient(38deg, #005bac 26%, #51d5fb 114%);}
.home1 .content{border-radius: .1rem;overflow: hidden;background: #FFFFFF;box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.1);}
.home1 .left{ width: 10.78rem;}
.home1 .right{ width: calc(100% - 10.78rem);}

.lt1 .a{ position: relative; z-index: 1; display: block;}
.lt1 .imgBox:after{content:"";position: absolute;right: 0;bottom: 0;left: 0;background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .6) 100%);z-index: 1;height: 4rem;}
.lt1 .imgBox .img{ padding-bottom: 66.6%;}
.lt1 .txt{ position: absolute; right: 0; bottom: 0; left: 0; z-index: 1; padding: 0 .3rem .3rem; align-items: flex-end;}
.lt1 .txt .ll{ flex: 1; overflow: hidden;}
.lt1 .ll span{display: inline-block;min-width: .92rem;line-height: .28rem;background: linear-gradient(90deg, #005bac 0%, #005bac 100%);border-radius: 2px;padding: 0 .15rem;font-size: .16rem;color: #fff;font-weight: 300;}
.lt1 h4{font-weight: 600;color: #fff !important;margin: .12rem 0;}
.lt1 .ll p{ font-size: .14rem; color: rgba(255, 255, 255, 0.7);}
.lt1 .dots{width: auto;margin: 0 0 0 .2rem;position: relative;mask: linear-gradient(90deg, transparent 0%, black 15.5%, black, black 85.5%, transparent 100%);padding: 0 .2rem;}
.lt1 .dots::before{content: "";position: absolute;top: 50%;left: calc(100% - .2rem);width: .4rem;height: 1px;background: rgba(255, 255, 255, 0.5);}
.lt1 .dots::after{content: "";position: absolute;top: 50%;right: calc(100% - .2rem);width: .2rem;height: 1px;background: rgba(255, 255, 255, 0.5);}
.lt1 .dots span{width: .18rem;height: .18rem;background: none;margin: 0 .05rem;position: relative;}
.lt1 .dots span::before{content: "";position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: .08rem;height: .08rem;background: rgba(255, 255, 255, 0.5);border-radius: 50vw;transition: .5s; margin: 1px 0 0;}
.lt1 .dots span::after{content: "";position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 100%;height: 100%;background: url(../images/lt1_s.svg) center no-repeat;background-size: cover;opacity: 0;transition: .5s;}

.lt1 .dots span i{ position: absolute;top: 0; right: 0; bottom: 0; left: 0; }
.lt1 .dots span i::before{ content: "";position: absolute;top: 50%; background: rgba(255, 255, 255, 0.5); width: .05rem; height: 1px; right
:100%}
.lt1 .dots span i::after{ content: "";position: absolute;top: 50%; background: rgba(255, 255, 255, 0.5); width: .05rem; height: 1px; left
:100%}

.lt1 .dots span.active i::before{ right: calc(100% + .05rem); width: .1rem;}
.lt1 .dots span.active i::after{ left: calc(100% + .05rem); width: .1rem;}

.lt1 .dots span.active{ margin: 0 .15rem}
.lt1 .dots span.active::before{ opacity: 0}
.lt1 .dots span.active::after{ opacity: 1}

.lt2{ height: 100%; display: flex; flex-direction: column; padding: 0 .3rem 0 .28rem}
.lt2 li{ flex: 1; border-bottom: 1px dashed #D2E1EB;}
.lt2 li:last-child{border-bottom: none;}
.lt2 .a{align-items: center;height: 100%;}
.lt2 .txt{ flex: 1; overflow: hidden}
.lt2 .imgBox{width: 1.7rem;margin: 0 0 0 .3rem; border-radius: .06rem}
.lt2 .imgBox .img{ padding-bottom: 70.58%}
.lt2 h4{ margin: .15rem 0 0;}

.lt2 .on h4{ color: #005bac; font-weight: 600;}

.home2{background: url(../images/ho2_b.png) right bottom no-repeat;background-size: 100% auto;padding-bottom: .1rem;}
.home2 .left{ width: 63%;}
.home2 .right{ width: 32.625%;}

.tit1{ margin-bottom: .38rem;}
.tit1 .hd{ align-items: center;}
.tit1 .hd ul{height: .56rem;gap: .3rem;align-items: flex-end;border-bottom: #D2E1EB 1px solid;}
.tit1 .hd ul li{position: relative;}
.tit1 .hd ul li::before{content: "/";position: absolute;bottom: .11rem;font-size: .3rem;color: #666666;right: -.2rem;}
.tit1 .hd ul li:last-child::before{ display: none}
.tit1 .hd ul .a{font-size: .3rem;color: #666666;display: block;position: relative;line-height: 1;padding-bottom: .15rem;transition: 0s !important;}
.tit1 .hd ul .a::before{content: "";position: absolute;background: url(../images/tit1.svg) center no-repeat;width: .17rem;height: .05rem;background-size: cover;bottom: -.03rem;left: 50%;transform: translateX(-50%);opacity: 0;transition: .5s;}
.tit1 .hd ul li.on .a{font-size: .4rem;color: #00549F;margin-right: .15rem;font-weight: 600;}
.tit1 .hd ul li.on .a::before{ opacity: 1}

.more1{font-size: .16rem;color: #555555;display: block;background: url(../images/more1.svg) center bottom no-repeat;padding: .12rem 0;transition: .5s;background-size: .79rem;font-weight: 300;}
.more1 span{ font-weight: 100; margin: 0 .03rem; opacity: .5;}

.lt3 .a{border-top: 1px dashed #D2E1EB;}
.lt3 li:first-child .a{border-top: none;/* padding-bottom: 0; */}
.lt3 .a{align-items: center;padding: .24rem .2rem;position: relative;z-index: 1;margin: 0 -.2rem;transition: .5s;}
.lt3 .a::before{content: "";position: absolute;right: 0;top: 0;bottom: 0;background: #d82128;z-index: -1;opacity: 0;transition: .5s;border-radius: .1rem;width: 0;}
.lt3 .time{width: .56rem;height: .56rem;text-align: center;position: relative;background: linear-gradient(0deg, #005bac 0%, #1b8fe5 100%);border-radius: .04rem;align-items: center;justify-content: center;flex-direction: column;z-index: 2;}
.lt3 .time h3{font-size: .2rem;color: #fff;line-height: 1;transition: .5s;font-weight: normal;}
.lt3 .time h6{font-size: .12rem;color: #fff;transition: .5s;font-weight: 300;}
.lt3 .imgBox{width: 2.72rem;margin: 0 .3rem 0 -.28rem; border-radius: .1rem;}
.lt3 .imgBox .img{ padding-bottom: 66.91%;}
.lt3 .txt{flex: 1;overflow: hidden;}
.lt3 h4{ font-size: .22rem; }
.lt3 p{margin: .18rem 0 0;}

.tit2{ margin-bottom: .38rem; align-items: center;}
.tit2 h4{ font-size: .4rem; color: #005bac; font-weight: 600;}

.lt4{ margin-top: -.2rem;}
.lt4 li{ border-top: #D2E1EB 1px solid; transition: .5s;}
.lt4 li:first-child{ border-top: none;}
.lt4 .a{ margin: 0 -.1rem; padding: 0 .2rem; height: 1.42rem; flex-direction: column; justify-content: center; position: relative; transition: .5s;}
.lt4 .a::before{ content: ""; position: absolute;left: 0;bottom: 0; width: 1.06rem; height: 2px; background: #B7282E;opacity: 0;transition: .5s;}
.lt4 .a::after{ content: ""; position: absolute;left: 1.1rem;bottom: 0; right: 0; height: 2px; background: #005bac;opacity: 0;transition: .5s;}
.lt4 h4{ margin-top: .12rem;}
.lt4 h6{ display: flex; align-items: center; justify-content: space-between;}
.lt4 h6 span{ margin-left: -.1rem;}

.home3-4-5-6{background: url(../images/ho3_b.png) center top no-repeat,url(../images/ho3-4-5-6_b.jpg) center bottom no-repeat;background-size: 100% auto;}
.home3{background-size: 100% auto;padding-top: 8vw;}

.home3 .left{ width: 46.75%}

.lt5 .a{ background: #FFFFFF; box-shadow: 0px 4px 10px 0px rgba(209, 233, 253, 0.3); border-radius: .1rem; transition: .5s; overflow: hidden;}
.lt5 .imgBox{ width: 3.2rem;}
.lt5 .imgBox .img{ padding-bottom: 64.48%}
.lt5 .txt{ flex: 1; overflow: hidden; padding: .24rem .4rem 0; background: url(../images/lt5_b.png) center no-repeat; background-size: cover;}
.lt5 p{ margin: .08rem 0 .2rem;}
.lt5 .time{align-items: flex-end;position: relative;}
.lt5 .time *{ line-height: 1;}
.lt5 .time big{font-size: .24rem;color: #005BAC;font-family: Bebas;font-weight: 400;}
.lt5 .time big span{font-size: .16rem;}
.lt5 .time small{font-size: .16rem;color: #005BAC;font-family: Bebas;font-weight: 400;margin: 0 .12rem;}
.lt5 .time:before{content: "";flex: 1;height: 1px;order: 1;background: #005BAC;margin: 0 0 .06rem;}
.lt5 .time:after{content: "";width: .06rem;height: 1px;order: 1;background: #005BAC;transform: rotate(45deg);right: 0;position: absolute;bottom: .08rem;}

.lt6{ margin: .55rem 0 0;}
.lt6 .a{ align-items: center;position: relative;z-index: 1; padding: 0 0 0 .22rem; background: url(../images/lt6.svg) left center no-repeat; background-size: .12rem auto;}
.lt6 h4{ flex: 1}
.lt6 h6{ width: auto; margin: 0 0 0 .2rem}

.home4{ padding-top: .3rem;}

.lt6{display: flex;flex-direction: column;gap: .45rem;}
.lt6 li{ width: 100%;}

.tit2c{ justify-content: center; position: relative;}
.tit2c .more1{ position: absolute; right: 0; top: 50%; transform: translateY(-50%);}

.lt7W{ position: relative;}
.lt7 .imgBox{ border-radius: .2rem 0 .2rem 0;}
.lt7 .imgBox .img{ padding-bottom: 53.76%;}

.arr1{position: absolute;top: 50%;transform: translateY(-50%);width: .38rem;height: .38rem;box-shadow: 0px 4px 10px 0px rgba(0, 135, 255, 0.2);background: #fff;border-radius: 50vw;z-index: 2; font-size: .18rem; color: #7CAAD4; font-family: 'lib'; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: .5s;}
.arr1.prev1{ left: -.19rem}
.arr1.next1{ right: -.19rem}

.home5{ padding-top: .3rem;}
.home5 .left{ width: 62.75%}
.home5 .right{ width: 32.625%}

.lt8{ border-radius: .1rem; overflow: hidden; }
.lt8 .imgBox{ width: 4.26rem}
.lt8 .imgBox .img{ padding-bottom: 66.27%}
.lt8 .txt{flex: 1;overflow: hidden;background: url(../images/lt8_b.jpg) center no-repeat;padding: .3rem .3rem;background-size: cover;}
.lt8 span{ font-size: .16rem; color: #fff; margin: 0 0 0 -.1rem;}
.lt8 h4{ font-size: .24rem; color: #fff !important; line-height: .36rem; margin: .14rem 0 .3rem;}
.lt8 p{ color: rgba(255, 255, 255, 0.8); font-weight: 300;}

.lt9{ margin: .6rem -.3rem 0;}
.lt9 li{ width: 33.33%; padding: 0 .3rem; border-right: #D2E1EB 1px solid;}
.lt9 li:last-child{ border-right: none;}
.lt9 .imgBox{ border-radius: .1rem;}
.lt9 .imgBox .img{ padding-bottom: 67.68%}
.lt9 .txt{ padding: .25rem 0 0;}
.lt9 span{ color: #005BAC; margin: 0 0 0 -.1rem;}
.lt9 h4{ margin: .15rem 0 0;}

.lt10 li{ border-bottom: 1px dashed #D2E1EB; padding: .3rem 0;}
.lt10 li:first-child{ padding-top: 0;}
.lt10 li:last-child{/* border-bottom: none; */}
.lt10 .a{align-items: center;}
.lt10 .imgBox{ width: 1.6rem; margin: 0 .26rem 0 0; border-radius: .1rem;}
.lt10 .imgBox .img{ padding-bottom: 70%}
.lt10 .txt{ flex: 1; overflow: hidden; }
.lt10 span{ color: #005BAC; margin: 0 0 0 -.1rem;}
.lt10 h4{ margin: .1rem 0 0;}

.home6{padding-top: .3rem;padding-bottom: 1.27rem;}
.home6 .wp{ align-items: center;}
.home6 .left{align-items: center;width: 49.5%;}

.lt11{display: grid;grid-template-columns: repeat(4, 1fr);grid-gap: .2rem;margin-bottom: .26rem;}
.lt11 li{min-width: 0;order: -1;}
.lt11 .a{display: block;position: relative;overflow: hidden;border-radius: .1rem;}
.lt11 .imgBox:after{content:"";position: absolute;right: 0;bottom: 0;left: 0;background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .3) 100%);z-index: 1;height: 2rem;}
.lt11 .imgBox .img{ padding-bottom: 65.72%;}

.lt11 i{ background: url(../images/video_i.svg) center no-repeat; background-size: cover; width: .76rem; height: .76rem; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 2;}
.lt11 .txt{ position: absolute; right: 0; left: 0; bottom: 0; padding: 0 .2rem .16rem; z-index: 2;}
.lt11 h4{ color: #fff !important;}

.lt12{gap: .1rem 1.5vw;/* flex: 1; */width: 4rem;}
.lt12 li {position: relative;}
.lt12 li:hover{ z-index: 2}
.lt12 li .a {display: flex;transition: .5s;position: relative;z-index: 1;align-items: center;justify-content: center;color: #333;font-size: .28rem;font-family: 'lib';width: .56rem;height: .56rem;background: #fff;border-radius: 50vw;box-shadow: 0px 3px 15px 0px rgba(0, 0, 0, 0.1);}
.lt12 li .a i,.swi-shipinhao,.swi-weixin0 {font-family: 'lib';}
.lt12 li .a img {width: 100%;height: 100%;position: relative;z-index: 1;transition: all 0.5s }
.lt12 li .ewm {width: 1rem;background: #fff;border-radius: 0;position: absolute;padding: .03rem;top: 128%;left: 50%;margin-left: -.5rem;z-index: 1;opacity: 0;visibility: hidden;transition: all 0.5s;transform: translateY(.1rem);box-shadow: 0 0 0.1rem rgba(0, 0, 0, .2)}
.lt12 li .ewm img{ width: 100%}
.lt12 li .ewm:before {content:"";position: absolute;width: .12rem;height: .12rem;background: #fff;transform: rotate(45deg);top: -.06rem;left: 50%;margin-left: -.06rem }
.lt12 li .ewm img {width: 100% }
.lt12 li:hover .a {color: #333 }
.lt12 li:hover .a:after {transform: translate(-50%, -50%) scale(1) }
.lt12 li:hover .a img {opacity: 1 }
.lt12 li:hover .ewm {opacity: 1;visibility: visible;transform: translateY(0)}

.tit3{ font-size: .4rem; color: #00549F; position: relative; padding: 0 0 0 .26rem; line-height: 1; font-weight: 600; margin: 0 .36rem 0 0;}
.tit3::before{content: "";width: .12rem;height: 100%;background: #B7282E;position: absolute;top: 50%;left: 0;transform: translateY(-50%);}

.lt13{ width: 49.5%;}
.lt13 .a{ display: block; position: relative; border-radius: .1rem; overflow: hidden;}
.lt13 .imgBox .img{ padding-bottom: 16.91%;}
.lt13 .txt{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; align-items: center; justify-content: center;}
.lt13 .txt img{ width: .6rem; margin: 0 .1rem 0 0 }
.lt13 h4{width: auto;font-size: .44rem;color: #fff !important;line-height: 1;}

@media(min-width: 769px){
    .lt3 .a:hover{ background: #FFFFFF; box-shadow: 0px 4px 10px 0px rgba(0, 87, 153, 0.1); border-radius: .1rem; border-top: transparent 1px solid;}
    .lt3 li:hover + li .a{ border-top: transparent 1px solid;}
    .lt4 .a:hover{ background: #FFFFFF; box-shadow: 0px 4px 10px 0px rgba(0, 87, 153, 0.1); border-radius: .1rem; }
    .lt4 .a:hover::before, .lt4 .a:hover::after{ opacity: 1;}

    .lt4 li:hover, .lt4 li:hover + li{ border-top: transparent 1px solid;}

    .arr1:hover{ background: #005BAC; color: #fff;}

    .lt11 li:nth-child(1){grid-area: 1 / 1 / span 2 / span 2;}
    .lt11 li:nth-child(8){grid-area: 2 / 3 / span 2 / span 2;}
    .lt11 li:nth-child(1) .imgBox .img, .lt11 li:nth-child(8) .imgBox .img{padding-bottom: 56%;}
}
@media(max-width: 1025px){
    .banner .imgBox .img{ padding-bottom: 50%;}

    .banner .dots{ bottom: .2rem;}
}
@media(max-width: 769px){
    .pad1{ padding: .4rem 0;}

    .home1::before{left: .45rem;border-radius: .15rem 0px 0px 0px;}
    .home1{padding: .5rem 0 .25rem;}
    .home1 .wp .more1{right: 15px;top: -.5rem;}

    .home1 .left{ width: 100%;}
    .home1 .right{ width: 100%; padding: .3rem 0 0; display: none;}
    .lt1 .dots{ display: none;}

    .lt1 .txt{position: relative;padding: .25rem 15px;}
    .lt1 h4{color: #333 !important;}

    .lt1 .ll p{ color: #8D8D8D;}

    .home2 .left{ width: 100%}
    .home2 .right{width: 100%;padding: .2rem 0 0;}

    .tit1 .hd ul .a{ font-size: .14rem}
    .tit1 .hd ul li.on .a{font-size: .22rem;margin-right: .05rem;}
    .tit1 .hd ul li::before{font-size: .14rem;bottom: .14rem; display: none}
    .tit1 .hd ul{ gap: .1rem}

    .more1{ font-size: .13rem}

    .home2{ padding-top: .1rem;}
    .more1 span{ margin: 0 .015rem;}
    .tit1, .tit2{ margin-bottom: .25rem;}

    .lt3 .imgBox{width: 1.8rem;margin-right: .2rem;}
    .lt3 p{ display: none}
    .lt3 h4{text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp: 3;line-clamp: 3;-webkit-box-orient:vertical;white-space: normal;}

    .tit2 h4{ font-size: .24rem;}

    .lt4 .a{height: .9rem;}
    .lt4 h4{margin-top: .06rem;-webkit-line-clamp: 1;line-clamp: 1;}

    .home3 .left{ width: 100%;}
    .home3 .left:last-child{ width: 100%; padding: .3rem 0 0;}

    .lt5 .imgBox{ width: 100%;}
    .lt5 .txt{width: 100%;flex: auto;padding: .25rem 15px;}

    .lt6{ gap: .15rem;}
    .lt6{ margin: .3rem 0 0;}

    .home4{ padding-top: .1rem;}

    .arr1{ width: .3rem; height: .3rem;}
    .arr1.prev1{ left: -.15rem}
    .arr1.next1{ right: -.15rem}

    .home5{ padding-top: .1rem;}
    .home5 .left{ width: 100%;}
    .home5 .right{ width: 100%; padding: .3rem 0 0;}

    .lt8 .imgBox{ width: 100%;}
    .lt8 .txt{ flex: auto; width: 100%; padding: .25rem 15px;}

    .lt9{ margin: .3rem -.15rem 0;}
    .lt9 li{ width: 50%; padding: 0 .15rem;}
    .lt9 li:last-child{ display: none;}
    .lt9 li:nth-child(2){ border: none;}

    .lt10 li{padding: .2rem 0;}
    .lt10 .imgBox{margin: 0 .2rem 0 0;width: 1.8rem;}

    .lt11{grid-template-columns: repeat(2, 1fr);grid-gap: .2rem 14px;}

    .lt11 i{ width: .36rem; height: .36rem;}
    .lt11 .txt{ padding: 0 15px .1rem;}

    .home6{ padding-top: 0}

    .home6 .left{width: 100%;padding: .2rem 0 0;}
    .home6 .left .tit3{ width: 100%}
    .lt13{ width: 100%;}

    .lt12 li .a{ width: .36rem; height: .36rem;}
    .tit3{font-size: .24rem;padding: 0 0 0 .2rem;margin: 0 .24rem 0 0;}
    .tit3::before{ width: .06rem}

    .lt12{width: 2.8rem;justify-content: center;margin: .2rem auto.3rem;gap: .15rem;}
    .lt13 .txt img{ width: .36rem}
    .lt1 .imgBox:after{ display: none;} 
    .lt11 .imgBox:after{ height: .7rem;}
}