@charset "utf-8";

.banner_box{padding: 0px;position: relative;z-index: 3;overflow: hidden;}
.banner{ overflow: hidden; }
.banner:after{content: "";position: absolute;right: 0;bottom: 0;left: 0;z-index: 1;height: 3rem;background: linear-gradient(0deg, #000000 0%, rgba(31, 100, 168, 0) 100%);opacity: .6;}
.banner .a{ display: block; position: relative; z-index: 1; overflow: hidden; }
.banner .imgBox{ overflow: hidden; width: 100%; }
.banner .imgBox .img{padding-bottom: 41.66%;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: .36rem;height: .36rem;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(.4);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: .8rem 0; overflow: hidden;}

.tit1{align-items: flex-end; margin-bottom: .5rem;}
.tit1 .ll{align-items: flex-end;}
.tit1 .ll .ll1{font-size: .84rem;color: #2477BC;opacity: .2;font-family: 'sys';text-transform: uppercase;line-height: 1;margin: 0 .1rem 0 0;}
.tit1 .ll .ll2 h6{font-size: .2rem;color: #2477BC;opacity: .2;font-family: 'sys';text-transform: uppercase;line-height: 1;}
.tit1 .ll .ll2 h3{font-size: .4rem;color: #333;font-weight: normal;line-height: 1;margin: .06rem 0;}

.more1{ align-items: center; font-size: .18rem; color: #666666; text-transform: uppercase; transition: .5s;}
.more1 img{ margin: 0 0 0 .04rem; width: .44rem}

.tit1w .ll .ll1{color: #fff;}
.tit1w .ll .ll2 h6{color: #fff;}
.tit1w .ll .ll2 h3{ color: #fff;}

.tit1c{ justify-content: center; position: relative;}
.tit1c .more1{ position: absolute; top: 50%; transform: translateY(-50%); right: 0; }

.more1w{ color: #fff;}

.index1{ background: url(../images/in1_b.png) center top no-repeat; background-size: 100% auto;}
.index1 .left{width: 69.125%;}
.index1 .left .ll{ width: 62.56%;}
.index1 .left .rr{ width: 33.72%;}
.index1 .right{width: calc(100% - 69.125% - .48rem);}

.ls1 .imgW{ position: relative;}
.ls1 .imgBox .img{ padding-bottom: 62.57%; padding-bottom: 4.33rem;}
.ls1 .time{position: absolute;left: .3rem;bottom: -.1rem;width: .7rem;height: .7rem;background: #2477BC;display: flex;flex-direction: column;justify-content: center;align-items: center;}
.ls1 .time h3{ font-size: .28rem; color: #fff; font-family: Georgia; line-height: 1; font-weight: normal; }
.ls1 .time h6{ font-size: .14rem; color: #fff; font-family: Georgia; margin: .04rem 0 0;}
.ls1 .txt{ height: 1.04rem; background: #E6EFFA; display: flex; align-items: center; padding: 0 .3rem;}
.ls1 h4{min-height: .6rem;margin: .1rem 0 0;}
.ls1 p{ color: #fff}

.ls2 .imgBox .img{ padding-bottom: 62.46; padding-bottom: 2.33rem;}
.ls2 h4{ color: #fff !important}
.ls2 .txt{ height: 3.04rem; background: url(../images/ls2_b.jpg) center no-repeat; background-size: cover; padding: .28rem .25rem;}
.ls2 h6{ font-size: .2rem; color: #fff;}
.ls2 h4{ margin: .2rem 0 .16rem;}
.ls2 p{ color: #fff}
.ls2 .bottom{ margin: .3rem 0 0; align-items: center;}
.ls2 .bottom i{ font-size: .24rem; color: #fff; font-family: 'lib';}
.ls2 .dots span{ width: .16rem; height: .16rem; position: relative; opacity: 1; margin: 0 .07rem 0 0; background: none;}
.ls2 .dots span::before{ content: ""; position: absolute; top: 50%; left: 0; width: 100%; height: .03rem; background: rgba(255,255,255,.48); border-radius: 50vw; transition: .5s; margin: -.015rem 0 0;}

.ls2 .dots span.active::before{ background: #fff;}

.ls3 li{ padding: .2rem 0;}
.ls3 .a{ align-items: center;}
.ls3 .time{ width: .7rem; height: .7rem; flex-direction: column; justify-content: center; align-items: center; margin: 0 .24rem 0 0; position: relative; z-index: 1;}
.ls3 .time::before{ content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(../images/ls3_b.png) center no-repeat; background-size: cover; z-index: -1; }
.ls3 .time::after{ content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(../images/ls3_b1.png) center no-repeat; background-size: cover; z-index: -1; opacity: 0; transition: .5s;}
.ls3 .time h3{ font-size: .24rem; color: #2477BC; font-family: Georgia; line-height: 1; font-weight: normal; transition: .5s;}
.ls3 .time h6{ font-size: .12rem; color: #666666; font-family: Georgia; margin: 0 0 0; transition: .5s;}
.ls3 .txt{ flex: 1; overflow: hidden;}

.index2{ background: url(../images/in2_b.png) center top no-repeat; background-size: cover; padding-top: 7.5vw;}
.index2 .left{ width: calc(50% - .45rem);}
.index2 .right{ width: calc(50% - .45rem);}

.ls4{ margin: -.2rem 0 0;}
.ls4 li{ border-bottom: 1px dashed rgba(255,255,255,.3); transition: .5s;}
.ls4 .a{ height: 1.06rem; align-items: center;}
.ls4 .time{ flex-direction: column; justify-content: center; align-items: center; margin: 0 .44rem 0 0; position: relative; z-index: 1;}
.ls4 .time::before{ content: ""; position: absolute; top: 0; right: -.22rem; width: 1px; height: .44rem; background: rgba(255,255,255,.3); z-index: -1; top: 50%; transform: translateY(-50%);}
.ls4 .time h3{ font-size: .3rem; color: #fff; font-family: Georgia; line-height: 1; font-weight: normal; transition: .5s;}
.ls4 .time h6{ font-size: .14rem; color: #fff; font-family: Georgia; margin: .04rem 0 0; transition: .5s;}
.ls4 .txt{ flex: 1; overflow: hidden;}
.ls4 h4{ color: #fff !important;}

.ls5{ margin: -.2rem 0 0;}
.ls5 li{ border-bottom: 1px dashed rgba(255,255,255,.3); transition: .5s;}
.ls5 .a{ height: .88rem; align-items: center;}
.ls5 .txt{ flex: 1; overflow: hidden;}
.ls5 .txt img{ width: .13rem; margin: 0 .12rem 0 0; }
.ls5 h4{ flex: 1; color: #fff !important}
.ls5 h6{ width: auto; margin: 0 0 0 .3rem; font-size: .2rem; color: #fff;}

.index3{ background: url(../images/in3_b.jpg) center bottom no-repeat; background-size: cover; }

.ls6{ margin: 0 -.25rem -.44rem;}
.ls6 li{ width: 33.33%; padding: 0 .25rem; margin: 0 0 .44rem;}
.ls6 .a{ height: 2.38rem; padding: 0 .38rem; flex-direction: column; justify-content: center; background: url(../images/ls6_b1.jpg) center no-repeat; background-size: cover; box-shadow: 0px 2px 11px 0px rgba(220, 220, 220, 0.5); transition: .5s;}
.ls6 p{ margin: .14rem 0 .22rem;}
.ls6 h6{ align-items: center;}
.ls6 h6 i{ font-size: .24rem; color: #2477BC; font-family: 'lib';}

.index4{ background: url(../images/in4_b.jpg) center no-repeat; background-size: cover; }

.index4 .content{ position: relative;}

.ls7Box{ position: relative; z-index: 1;overflow: visible;}
.ls7 .a{position: relative;z-index: 1;align-items: flex-start;}
.ls7 .a:before{content: "";position: absolute;top: 0;left: 10%;right: 0;bottom: .8rem;background: linear-gradient(90deg, #0B4E85 7%, rgba(9, 92, 162, 0) 100%);z-index: -1;}
.ls7 .imgW{ position: relative; z-index: 1;}
.ls7 .imgW::before{ content: ""; position: absolute; top: -.1rem; right: -.1rem; bottom: -.1rem; left: -.1rem; z-index: -1; background: url(../images/ls7_l.png) center no-repeat; background-size: 100% 100%;}
.ls7 .imgW::after{ content: ""; position: absolute; top: 0; right: 0; bottom: -.2rem; left: 0; border: 1px solid #D8D8D8; z-index: -1;}
.ls7 .imgW{ width: 3.58rem;}
.ls7 .imgBox .img{ padding-bottom: 133.14%;}
.ls7 .txt{width: calc(100% - 3.58rem - .55rem);padding: .36rem 0 0;}
.ls7 .txt .name{align-items: flex-end;margin-bottom: .3rem}
.ls7 .txt .name .ll{font-size: .3rem;color: #fff;border-bottom: #fff .04rem solid;padding: 0 0 .24rem;margin: 0 .54rem 0 0;}
.ls7 .txt .name .rr{font-size: .18rem;color: #fff;padding: 0 0 .3rem;flex: 1;}
.ls7 .txt .name .rr span{ margin: 0 .24rem 0 0}
.ls7 .txt1{position: absolute;top: 0;right: 0;bottom: -1px;left: 0;background: url() center bottom no-repeat;background-size: 100% auto;z-index: 1;display: flex;align-items: flex-end;transition: .5s;padding: 0 .2rem .28rem;}
.ls7 .txt1 h4{ width: 100%; text-align: center; font-size: .3rem; color: #fff}
.ls7 p{ font-size: .16rem; color: #fff; line-height: .3rem; margin: 0 0 .34rem;}
.more2{ align-items: center; font-size: .18rem; color: #fff !important;}
.more2 i{ font-size: .18rem; color: #fff; font-family: 'lib'; transform: rotate(90deg); margin: 0 0 0 .1rem;}

.ls8W{padding: 0 1.36rem 0 0;width: calc(100% - 3.58rem - .50rem);position: absolute;right: 0;bottom: -.3rem;}
.ls8 .a{position: relative;margin: 0 0 .2rem;border-radius: .7rem;padding: .2rem 0 0;}
.ls8 .imgBox{transform: scale(.9);}
.ls8 .imgBox .img{ padding-bottom: 142.76%;}
.ls8 li.swiper-slide-active .imgBox{transform: scale(1); box-shadow: 0px 2px 23px 0px rgba(216, 216, 216, 0.5);}

.ar1{align-items: center;width: .84rem;position: absolute;top: 70%;transform: translateY(-50%);right: 0;z-index: 1;}
.ar1 .arrow{width: .2rem;height: .51rem;background: url(../images/ar1_p1.png) center no-repeat;background-size: cover !important;transition: .5s;z-index: 1;cursor: pointer;}
.ar1 .arrow.prev1{ left: 0;}
.ar1 .arrow.next1{ right: 0; transform: rotateY(180deg);}

.index5{ background: url(../images/in5_b.png) top no-repeat; background-size: 100% auto; padding-bottom: 0 !important;}

.ls9{ margin: 0 -.34vw;}
.ls9 li{ padding: 0 .34vw;}
.ls9 .a{ display: block; position: relative; z-index: 1;}
.ls9 .a img.i1{position: absolute;bottom: 0;left: 0;z-index: 1;width: 100%;height: auto;max-height: inherit;}

.ls9s1 li:nth-child(1){width: 55.25%;}
.ls9s1 li:nth-child(2){width: 18.4%;}

.ls9s1 li:nth-child(1) .imgBox .img{ padding-bottom: 32.50%;}
.ls9s1 li:nth-child(2) .imgBox .img{ padding-bottom: 100%;}

.ls9s2{ margin-top: .68vw;}
.ls9s2 li:nth-child(1){width: 13.18%;}
.ls9s2 li:nth-child(2){width: 42.1%;}
.ls9s2 li:nth-child(3){width: 18.4%;}
.ls9s2 li:nth-child(4){width: 18.4%;}

.ls9s2 li:nth-child(1) .imgBox .img{ padding-bottom: 141.90%;}
.ls9s2 li:nth-child(2) .imgBox .img{ padding-bottom: 42.85%;}
.ls9s2 li:nth-child(3) .imgBox .img{ padding-bottom: 100%;}
.ls9s2 li:nth-child(4) .imgBox .img{ padding-bottom: 100%;}

.index6{ background: url(../images/in6_b.jpg) center top no-repeat; background-size: cover; padding-bottom: 1.65rem;}

.ls10{ margin: 0 -.1rem -.2rem;}
.ls10 li{ width: 16.66%; padding: 0 .1rem; margin: 0 0 .2rem;}
.ls10 .a{ height: .6rem; border-bottom: 2px solid rgba(102,102,102,.3); align-items: center;}

@media(min-width: 769px){
    .ls3 .a:hover .time::before{ opacity: 0;}
    .ls3 .a:hover .time::after{ opacity: 1;}
    .ls3 .a:hover .time h3, .ls3 .a:hover .time h6{ color: #fff;}

    .more1w:hover{ color: rgba(255,255,255,.7);}

    .ls4 li:hover, .ls5 li:hover{ border-bottom: 1px dashed rgba(255,255,255,1);}

    .ls6 .a:hover { box-shadow: 0px 2px 24px 0px rgba(36, 119, 188, 0.3637);}

    .ls10 .a:hover{ border-bottom: 2px solid rgba(36,119,188,.3);}
}
@media(max-width: 1025px){
    .banner .imgBox .img{padding-bottom: 50%;}
} 
@media(max-width: 769px){
    .banner .bottom{ bottom: .2rem}
    .banner .dots span{ width: .2rem; height: .2rem}

    .index1{ padding: .4rem 0;}

    .index1 .left{ width: 100%;}
    .index1 .right{ width: 100%; margin-top: .4rem;}

    .tit1{ margin-bottom: .25rem;}
    .tit1 .ll .ll1{font-size: .56rem;}
    .tit1 .ll .ll2 h6{ font-size: .14rem;}
    .tit1 .ll .ll2 h3{ font-size: .24rem;}

    .index1 .left .fl1 .ll{ width: 100%;}
    .index1 .left .rr{ width: 100%; margin: .25rem 0 0;}

    .ls1 .imgBox .img{ padding-bottom: 60%;}
    .ls2 .imgBox .img{ padding-bottom: 60%;}

    .ls3 li{ padding: .08rem 0;}

    .index2{background: url(../images/in2_b1.jpg) center no-repeat;background-size: cover;padding-top: .4rem;}
    .index2 .left{ width: 100%;}
    .index2 .right{width: 100%;margin: .4rem 0 0;}
    .ls4 .a{height: .7rem;}
    .ls5 .a{ height: .64rem}
    .ls5 h6{ font-size: .16rem}

    .pad1{ padding: .4rem 0;}

    .ls6{ margin: 0 -7px -.2rem;}
    .ls6 li{width: 100%;padding: 0 7px;margin-bottom: .2rem;}
    .ls6 .a{ height: 2.2rem; padding: 0 .2rem}
    .ls6 p{ margin: .1rem 0 .16rem;}

    .ls7 .imgW{width: 1.5rem;margin: 0 auto}
    .ls7 .txt{ width: 100%; margin: .2rem 0 0}
    .ls7 .txt .name .ll{font-size: .24rem;margin: 0 .24rem 0 0;width: auto;} 
    .ls7 .txt .name .rr{ font-size: .16rem}
    .ls7 .a:before{ display: none;}

    .ar1{ transform: translateY(-50%) scale(.5);}
    .ls8W{width: 100%;position: relative;padding: 0 .8rem 0 0;}
    .ls7 p{ margin: 0;}

    .index4{ padding-bottom: .6rem}
    .ls10{ margin: 0 -.1rem -.1rem;}
    .ls10 li{width: auto;margin: 0 0 .1rem;min-width: 50%;}
    .ls10 .a{height: auto;border-bottom: 1px solid rgba(102, 102, 102, .3);}
    .banner:after{ height: .7rem;}
} 
@media(max-width: 560px){
} 