@charset "utf-8";

body{ background: rgba(15, 110, 186, 0.0812);}

.banner_box{padding: 0px;position: relative;z-index: 3;overflow: hidden;}
.banner{ overflow: hidden; }
.banner .a{ display: block; position: relative; z-index: 1; overflow: hidden; }
.banner .imgBox{ overflow: hidden; width: 100%; }
.banner .imgBox .img{padding-bottom: calc(100vh - 130px - .9rem);transition: 0s;}
.banner.on ul li.swiper-slide-active .a .imgBox img, .banner.on ul li.swiper-slide-duplicate-active .a .imgBox img, .banner.on ul li.swiper-slide-prev .a .imgBox img{ animation: sca 6s linear 0s normal both;}
@keyframes sca {
    0% {
        transform: scale(1.06);
    }
    100% {
        transform: scale(1);
    }
}

.banner .bottom{position: absolute;right: 0;left: 0;bottom: .45rem;z-index: 2;}
.banner .dots{ justify-content: center; align-items: center;}
.banner .dots span{width: .22rem;height: .22rem;background: none; opacity: 1;margin: 0 0.05rem !important;position: relative;z-index: 1}
.banner .dots span:before{content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(255,255,255,.7);transition: .5s;transform: scale(.6);border-radius: 50%;}
.banner .dots span:after{content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: url(../images/dots1s.png) center no-repeat;background-size: cover;opacity: 0;transition: .5s;}

.banner .dots span.active:before{ opacity: 0}
.banner .dots span.active:after{ opacity: 1}

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

.tit1{align-items: center;padding: 0 0 0 .3rem;margin-bottom: .45rem;}
.tit1 .ll h3{ font-size: .4rem; color: #0F6EBA; line-height: 1;}
.tit1 .ll h6{font-size: .16rem;color: #C40F0F;font-family: "思源宋体 Medium";margin: .06rem 0 0;align-items: center;line-height: 1;text-transform: uppercase;}
.tit1 .ll h6::after{content: "";flex: 1;overflow: hidden;height: 1px;background: #C40F0F;margin: 0 0 0 .08rem;min-width: .24rem;}

.tit1w .ll h3{ color: #fff;}
.tit1w .ll h6{ color: #fff;}
.tit1w .ll h6::after{ background: #fff}

.more1{width: 1.24rem;height: .4rem;justify-content: center;align-items: center;font-size: .16rem;color: #0F6EBA;border: 1px solid rgba(15, 110, 186, 0.3);border-radius: 50vw;transition: .5s;}

.index1{ background: url(../images/in1_b.jpg) center top no-repeat; background-size: cover;}
.index1 .left{ width: 9.5rem;}
.index1 .right{ width: calc(100% - 9.5rem - .72rem);}

.ls1Box{ overflow: visible;}
.ls1Box .dots{flex: 1;overflow: hidden;justify-content: flex-end;margin-bottom: .2rem;}
.ls1Box .dots span{width: .1rem;height: .1rem;background: rgba(255,255,255,.6);border-radius: 50vw;opacity: 1;margin: 0 0 0 .08rem;transition: .5s;}
.ls1Box .dots span.active{ background: #fff}

.ls1 .bottom{position: absolute;right: 0;bottom: 0;left: 0;padding: 0 .45rem 0 0;z-index: 2;align-items: flex-end;}
.ls1 .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, .7) 100%);z-index: 1;height: 1.3rem;}
.ls1 .imgBox .img{ padding-bottom: 56.31%;}
.ls1 .time{ width: 1rem; height: 1rem; background: #C40F0F; flex-direction: column; justify-content: center; align-items: center;}
.ls1 .time h3{ font-size: .34rem; color: #fff; font-family: Georgia;}
.ls1 .time h6{ font-size: .18rem; color: #fff; font-family: Georgia;}
.ls1 .txt{ height: 1.55rem; background: #0F6EBA; box-shadow: 0px 2px 22px 0px rgba(15, 110, 186, 0.4031); padding: 0 .4rem; flex-direction: column; justify-content: center;}
.ls1 h4{ font-size: .24rem;}
.ls1 p{ margin: .14rem 0 0;}
.ls1 *{ color: #fff !important;}

.ls2 .a{ display: block; position: relative;}
.ls2 .imgBox .img{ padding-bottom: 56.15%;}
.ls2 .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, .7) 100%);z-index: 1;height: 1.3rem;}
.ls2 .txt{ position: absolute; right: 0; bottom: 0; left: 0; padding: 0 .3rem .22rem;}
.ls2 h4{ color: #fff !important;}

.ls3{ margin: .15rem 0 0;}
.ls3 li{ border-bottom: 2px solid rgba(151,151,151,.3);}
.ls3 .a{ height: .95rem; align-items: center;}
.ls3 .time{ flex-direction: column; justify-content: center; align-items: center; margin: 0 .26rem 0 0;}
.ls3 .time h3{ font-size: .28rem; color: #0F6EBA; font-family: Georgia;}
.ls3 .time h6{ font-size: .14rem; color: #0F6EBA; font-family: Georgia; }
.ls3 .txt{ flex: 1; overflow: hidden;}
.ls3 li:last-child{ border-bottom: none;}

.index2{ background: url(../images/in2_b.jpg) center no-repeat; background-size: cover;}
.index2 .tit1 .hd ul li{ margin: 0 .64rem 0 0; opacity: .28; transition: .5s; cursor: pointer;}
.index2 .tit1 .hd ul li.on{ opacity: 1;}
.index2 .tit1 .hd ul li:last-child{ margin-right: 0}

.ls4{ margin: 0 -.22rem -.38rem;}
.ls4 li{ width: 33.33%; padding: 0 .22rem; margin-bottom: .38rem; }
.ls4 .a{ height: 2.1rem; border-radius: .18rem; border: 1px solid rgba(15, 110, 186, 0.3); background: rgba(255, 255, 255, 0.6); padding: 0 .3rem; flex-direction: column; justify-content: center; transition: .5s; position: relative; z-index: 1;}
.ls4 .a::before{ content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: url(../images/ls4.jpg) center no-repeat; background-size: cover; border-radius: .18rem; transition: .5s; opacity: 0; z-index: -1;}
.ls4 .time{ align-items: flex-end; color: #0F6EBA; transition: .5s;}
.ls4 .time h3{ font-size: .26rem; line-height: 1;}
.ls4 .time h6{ font-size: .16rem; margin: 0 0 0 .1rem;}
.ls4 .line{ width: 100%; height: 1px; background: #979797; opacity: .2; margin: .15rem 0; transition: .5s;}
.ls4 h4{ font-size: .18rem;}
.ls4 i{ font-size: .24rem; color: #0F6EBA; font-family: 'lib'; margin: .1rem 0 0; transition: .5s;}

.ls4Box .dots{ justify-content: center; margin-top: .6rem;}
.ls4Box .dots span{ width: .1rem; height: .1rem; opacity: 1; background: #fff; transition: .5s; margin: 0 .08rem !important;}
.ls4Box .dots span.active{ background: #0F6EBA;}

.index3{ background: url(../images/in3_b.png) center bottom no-repeat; background-size: cover; padding: 1.2rem 0 9vw}

.more1w{ border: 1px solid rgba(255, 255, 255, 0.3); color: #fff;}

.ls5 li{ width: 48.125%;}

.ls5 li:nth-child(1){ width: 48.125%; padding: .9rem 0 0;}
.ls5 li:nth-child(2){ width: 23.125%; margin: -1.1rem 0 0;}
.ls5 li:nth-child(3){ width: 23.125%; padding: .2rem 0 0;}

.ls5 li:nth-child(1) .imgBox .img{ padding-bottom: 63.50%;}
.ls5 li:nth-child(2) .imgBox .img{ padding-bottom: 120.81%;}
.ls5 li:nth-child(2) a:last-child{ display: block; margin: .4rem 0 0;}
.ls5 li:nth-child(2) a:last-child .imgBox .img{ padding-bottom: 65.94%;}
.ls5 li:nth-child(3) .imgBox .img{ padding-bottom: 134.86%;}

.index4{ padding: .9rem 0 1.4rem}
.index4 .content{ padding: .7rem .5rem .95rem; background: linear-gradient(180deg, #FFFFFF 0%, rgba(255, 255, 255, 0.2811) 100%); border-radius: .2rem;} 

.ls6{ margin: 0 -.3rem;}
.ls6 li{ width: 33.33%; padding: 0 .3rem; margin-bottom: .3rem;}
.ls6 .a{ height: .58rem; background: rgba(15,110,186,.06); border-radius: .06rem; display: flex; justify-content: center; align-items: center; padding: 0 15px; font-size: .2rem; color: #333333; transition: .5s;}

@media(min-width: 769px){
    .more1:hover{ background: #0F6EBA; color: #fff;}

    .ls4 .a:hover{ box-shadow: 0px 2px .25rem 0px rgba(15, 110, 186, 0.5865); }
    .ls4 .a:hover:before{ opacity: 1;}
    .ls4 .a:hover *{ color: #fff;}
    .ls4 .a:hover .line{ background: rgba(255, 255, 255, 0.2); opacity: 1;}

    .ls6 .a:hover{ background: #0F6EBA; color: #fff;}
}
@media(max-width: 769px){
    .banner_box{ margin: .7rem 0 0;}
    .banner .imgBox .img{padding-bottom: 41%;}
    .banner .bottom{ bottom: .15rem}
    .banner .bottom .dots span{ transform: scale(.7)}

    .pad1{ padding: .4rem 0}

    .tit1{ padding: 0; margin-bottom: .25rem}
    .tit1 .ll h3{ font-size: .24rem}
    .more1{ width: 1rem; height: .34rem; font-size: .14rem}

    .index1 .left{ width: 100%;}
    .index1 .right{ width: 100%; padding: .4rem 0 0;}

    .ls1 .time{ width: .7rem; height: .7rem;}
    .ls1 .time h3{ font-size: .26rem;}
    .ls1 .time h6{ font-size: .14rem}
    .ls1 .txt{ padding: 0 15px;}
    .ls2 .txt{ padding: 0 15px 10px;}
    .ls3 .a{ height: .7rem;}

    .index2 .tit1 .hd ul li{ margin: 0 .24rem 0 0;}

    .ls4 li{ width: 100%; margin-bottom: .2rem}

    .ls4 .a{ height: auto; padding: .25rem 15px;}

    .ls5 li{ width: 100% !important; margin: .1rem 0 !important; padding: 0 !important;}
    .ls5 li:nth-child(2) a:last-child{ margin: .2rem 0 0;}

    .index4 .content{ padding: .25rem 15px;}

    .ls6{ margin: 0 -7px;}
    .ls6 li{ width: 100%; padding: 0 7px; margin-bottom: .15rem;}
}