@charset "utf-8";

.banner_box{padding: 1.4rem 0 0;position: relative;z-index: 3;overflow: hidden;}
.banner{ overflow: hidden; }
.banner:after{content: "";position: absolute;right: 0;bottom: 0;left: 0;background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);z-index: 1;height: 1rem;}
.banner .a{ display: block; position: relative; z-index: 1; overflow: hidden; }
.banner .imgBox{ overflow: hidden; width: 100%; transform: scale(1);}
.banner .imgBox .img{padding-bottom: 20.83%;transition: 0s;transform: scale(1) !important;}
.banner .imgBox .img video{ opacity: .9;}
.banner.on ul li.swiper-slide-active .a .imgBox, .banner.on ul li.swiper-slide-duplicate-active .a .imgBox, .banner.on ul li.swiper-slide-prev .a .imgBox{ animation: sca 6s linear 0s normal both;}
@keyframes sca {
    0% {
        transform: scale(1.06);
    }
    100% {
        transform: scale(1);
    }
}

.banner .dots{position: absolute;right: 0;bottom: .2rem;justify-content: center;align-items: center;z-index: 10;}
.banner .dots span{width: .48rem;height: .48rem;background: none;font-size: .16rem;color: #fff;opacity: 1;margin: 0 .05rem !important;position: relative;z-index: 1}
.banner .dots span:before{content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: url(../images/dots1.png) center no-repeat;background-size: cover; transition: .5s; transform: scale(.5); opacity: .5}

.banner .dots span.active:before{ transform: scale(1); opacity: 1}

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

.tit1{ align-items: center; margin-bottom: .45rem;}
.tit1 .ll h6{position: relative;z-index: 1;font-size: .16rem;color: rgba(102,102,102,.6);padding: 0 0 0 .35rem;text-transform: uppercase;}
.tit1 .ll h6:before{content: "";position: absolute;left: 0;top: 50%;width: .28rem;height: 1px;background: #979797;opacity: .6;transform: translateY(-50%)}
.tit1 .ll h3{font-size: .36rem;color: #333333;margin: .04rem 0 0;}

.more1{ box-shadow: 3px 3px 4px 0px rgba(138, 215, 242, 0.3033); width: 1.72rem; height: .5rem; background: #fff; font-size: .18rem; color: #666666; border-radius: 50vw; align-items: center; justify-content: center; transition: .5s;}

.home1{background: url(../images/home1_b.jpg) center no-repeat;background-size: cover;}
.home1 .content{position: relative;z-index: 1;padding: .3rem 0 0;/* align-items: flex-end; */}
.home1 .content::before{content: "";position: absolute;top: 0;right: 0;bottom: 0;left: 1.06rem;opacity: .19;background: linear-gradient(90deg, #8AD7F2 -2%, rgba(138, 215, 242, 0) 81%);z-index: -1;pointer-events: none;}
.home1 .content .left{width: 8.16rem;}
.home1 .content .right{width: calc(100% - 8.16rem - .3rem);/* transform: translateY(.1rem); */}

.lt1 .a{ display: block; position: relative; z-index: 1;}
.lt1 .imgBox:after{ content: ""; position: absolute; right: 0; bottom: 0; left: 0; background: linear-gradient(0deg, rgba(0,0,0,.75) 0%, transparent 100%); height: .84rem}
.lt1 .txt{ position: absolute; right: 0; bottom: 0; left: 0; padding: 0 .55rem .18rem;}
.lt1 h4{ color: #fff !important}
.lt1Box .bottom{ justify-content: flex-end;}
.lt1Box .dots{align-items: center;flex: 1;overflow: hidden;justify-content: center;}
.lt1Box .dots span{width: auto;height: auto;background: none;font-size: .16rem;color: #333333;opacity: 1;margin: 0 .12rem;height: 100%;line-height: .7rem;position: relative;}
.lt1Box .dots span:before{ content: ""; position: absolute; bottom: 0; left: 0; width: 0; height: .04rem; background: #019192}
.lt1Box .dots span.active{ font-size: .24rem}
.lt1Box .dots span.active:before{ width: 100%}
.lt1Box .arrow1{ width: 2.8rem}
.lt1Box .arrow{ width: 50%; height: .7rem; background: #F7C878; font-size: .7rem; color: #fff; font-family: 'lib'; display: flex; align-items: center; justify-content: center; cursor: pointer;}
.lt1Box .arrow.next{background: #019192;}

.lt2{display: flex;flex-direction: column;height: 104%;}
.lt2 li{/* margin-bottom: .24rem; */flex: 1;display: flex;align-items: center;transition: .5s;}
.lt2 .a{display: block;position: relative;z-index: 1;padding:0 .2rem;width: 100%;}
.lt2 .a:before{ content: ""; position: absolute; background: #019192; width: 100%; height: 1rem; top: 50%; left: 0; transform: translateY(-50%); opacity: 0; transition: .5s; z-index: -1}
.lt2 h6{margin: .1rem 0 0;display: flex;align-items: center;}
.lt2 h6 .line{flex: 1;overflow: hidden;border-bottom: rgba(102,102,102,.3) 1px dashed;margin: 0 .12rem 0 0;}

.lt2 li:last-child{ margin-bottom: 0}

.home2{ background: url(../images/home2_b.jpg) center no-repeat; background-size: cover;}
.home2 .tit1{ margin-bottom: .05rem;}

.lt3 .a{height: .98rem;align-items: center;padding: 0;position: relative;z-index: 1;transition: .5s;}
.lt3 .a:before{content: "";position: absolute;bottom: 0;left: 0;right: 0;height: 1px;background: #979797;opacity: .3;}
.lt3 .time{text-align: center;margin: 0 .5rem 0 0;position: relative}
.lt3 .time:before{content: "";position: absolute;top: 0;right: -.25rem;width: 1px;height: .4rem;background: #999;opacity: .2;}
.lt3 .time h3{font-size: .22rem;color: #005d72;font-weight: normal;line-height: 1;}
.lt3 .time h6{font-size: .12rem;color: #019192;margin: .06rem 0 0;}
.lt3 .txt{ flex: 1; overflow: hidden}
.lt3 li:last-child .a:before{ display: none}

.home2 .box{ width: calc(50% - .12rem); border-radius: 0; background: #FFFFFF; box-shadow: 0px 4px .1rem 0px rgba(204, 204, 204, 0.5); padding: .3rem .5rem .2rem;}

.home2 .box1{ border-radius: .4rem 0 0 0;}
.home2 .box2{ border-radius: 0 .4rem 0 0;}

.lt4 .a{height: .98rem;align-items: center;padding: 0;position: relative;z-index: 1;transition: .5s;}
.lt4 .a:before{content: "";position: absolute;bottom: 0;left: 0;right: 0;height: 1px;background: #979797;opacity: .3;}
.lt4 .a:after{content: "";position: absolute;bottom: -1px;left: 0; width: 1.02rem;height: 3px;background: #019192; border-radius: 50vw; transition: .5s;}
.lt4 .time{ font-size: .2rem; color: #019192; margin: 0 .28rem 0 0;}
.lt4 .txt{ flex: 1; overflow: hidden}
.lt4 li:last-child .a:before{ display: none}
.lt4 li:last-child .a:after{ display: none;}

.home3 .left{ width: 27.5%;}
.home3 .right{ width: 68.25%;}

.lt5Box{ position: relative;}
.lt5 .a{ display: block; position: relative;}
.lt5 .imgBox:after{ content: ""; position: absolute; right: 0; bottom: 0; left: 0; background: linear-gradient(180deg, rgba(139, 214, 242, 0) 0%, #4F7B8B 100%); height: 1.55rem}
.lt5 .imgBox .img{ padding-bottom: 133.25%;}
.lt5 .txt{ position: absolute; padding: 0 .36rem .2rem; right: 0; bottom: 0; left: 0;}
.lt5 h3{ font-size: .24rem; color: #fff; font-weight: normal;}
.lt5 h4{ font-size: .2rem; color: #fff !important; margin: .06rem 0 0;}
.lt5Box .dots{ position: absolute; right: .36rem; bottom: .2rem; font-size: .16rem; color: #fff; z-index: 2; left: auto; width: auto;}
.lt5Box .dots span.swiper-pagination-current{ font-size: .24rem;}

.lt6 li{ width: 25.73%;}
.lt6 .a{ display: block; position: relative; }
.lt7 .a::before{content: "";position: absolute;background: url(../images/lt7_s.svg) center no-repeat;background-size: 100% 100%;width: .09rem;height: .09rem;left: 0;top: .5rem;}
.lt7 .a::after{content: "";position: absolute;background: url(../images/lt7_s.svg) center no-repeat;background-size: 100% 100%;width: .09rem;height: .09rem;right: 0;top: .5rem;}
.lt6 .imgBox .img{ padding-bottom: 103.91%;}
.lt6 .txt{ flex-direction: column; position: absolute; top: 0; right: 0; bottom: 0; left: 0; justify-content: center; align-items: center; text-align: center; padding: 0 .15rem;}
.lt6 i{ width: 1.04rem;}
.lt6 i img{ width: 100%;}
.lt6 h4{ font-size: .24rem; color: #fff !important; margin: .15rem 0 0;}

.lt6 li:nth-child(3), .lt6 li:nth-child(4){ width: calc(100% - 25.73%*2);}
.lt6 li:nth-child(3) .imgBox .img, .lt6 li:nth-child(4) .imgBox .img{ padding-bottom: 55%;}

.lt7 li{flex: 1;text-align: center;display: flex;flex-direction: column;align-items: center;justify-content: center;}
.lt7 .line{flex: 1;height: 1px;border-bottom: 1px dashed #019192;margin: .54rem.1rem 0;opacity: .4;}
.lt7 .a{display: block;position: relative;padding: 0 .22rem;margin: 0 auto;}
.lt7 .ico{ width: 1.05rem; height: 1.05rem; display: flex; justify-content: center; align-items: center;  position: relative; z-index: 1;}
.lt7 .ico::before{ content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: url(../images/lt7_b.png) center no-repeat; background-size: 100% 100%; animation: roted 12s infinite linear;}
.lt7 h4{ margin: .26rem 0 0} 

.home4{ padding-bottom: 1.4rem;}

@media(min-width: 1024px){
    .more1:hover{ background: #019192; color: #fff;}

    .lt2 .a:hover:before{ opacity: 1}
    .lt2 .a:hover *{ color: #fff}
    .lt2 .a:hover h6 .line{ border-bottom: rgba(255,255,255,.3) 1px dashed;}

    .lt4 .a:hover:after{ background: #F7C878;}
    .lt2 li:hover{ margin: .2rem 0;}
}
@media(max-width: 1024px){
}
@media(max-width: 800px){
}
@media(max-width: 769px){
    .banner_box{padding: .7rem 0 0;}
    .banner .imgBox .img{ padding-bottom: 35%}
    .banner .dots span{ width: .26rem; height: .26rem}
    .banner:after{ height: .6rem}

    .tit1 .ll h6{ font-size: .14rem;}
    .tit1 .ll h3{ font-size: .26rem;}
    .more1{ font-size: .15rem; width: 1.3rem; height: .45rem;}

    .tit1{ margin-bottom: .25rem;}

    .home1 .content .left{ width: 100%;}
    .home1 .content .right{width: 100%;margin: .3rem 0 0;}
    .lt1Box .dots{ display: none;}
    .home1 .content{padding: 0;}
    .home1 .content::before{left: -15px;display: none;}
    .pad1{ padding: .4rem 0}

    .lt1Box .arrow1{ width: 100%; justify-content: center}
    .lt2{ height: auto}
    .lt2 li{ margin-bottom: .2rem}

    .lt1Box .arrow{ font-size: .4rem; height: .5rem;}
    .lt2 h6{ font-size: .14rem; margin: .05rem 0 0}
    .lt2 .a{ padding: 0}

    .home2 .box{width: 100%;border-radius: 0 !important;padding: .25rem .2rem .1rem;}
    .home2 .box1{ margin-bottom: .3rem;}
    .lt3 .a{ height: .7rem}
    .lt3 .time{ margin: 0 .4rem 0 0}
    .lt3 .time:before{ right: -.2rem}
    .lt4 .a{ height: .6rem}
    .lt4 .time{ font-size: .16rem}
    .lt4 .a:after{ width: .78rem}
    .lt3 .time h6{ margin: .01rem 0 0}

    .home3{ padding-top: 0;}
    .home3 .left{ width: 100%;}
    .home3 .right{ width: 100%; padding-top: .4rem;}

    .lt5 .txt{ padding: .2rem .2rem;}
    
    .lt6 li{ width: 50%;}
    .lt6 i{ width: .5rem;}
    .lt6 li:nth-child(3), .lt6 li:nth-child(4){ width: 100%;}

    .lt7 li{ width: 33.33%; flex: auto;}
    .lt7 .line{ display: none;}
    .lt7 .ico{width: .7rem;height: .7rem;margin: 0 auto;}
    .lt7 .a{ padding: 0 8px}

    .lt7 .a::before, .lt7 .a::after{ display: none}
    .lt7 h4{margin: .1rem 0 .15rem;font-size: .18rem !important;}
    .home4{ padding: 0 0 .2rem}
} 
@media(max-width: 560px){
}