@charset "utf-8";

.banner_box{ padding: 0px; position: relative; z-index: 3; }
.banner{ overflow: hidden; }
.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: 100vh; 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 7s linear 0s normal both;}
@keyframes sca {
    0% {
        transform: scale(1.06);
    }
    100% {
        transform: scale(1);
    }
}
.banner .txt{ position: absolute; left: 0; right: 0; bottom: 0; background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, .6)); padding: 1rem 0 .35rem}
.banner .txt h4{font-weight: 400;font-size: .24rem;color: #fff;width: calc(100% - 5rem);}

.banner .dotsW{ position: absolute; right: 0; bottom: .28rem; left: 0; z-index: 10;}
.banner .dots{z-index: 10;display: flex;align-items: center;justify-content: flex-end;}
.banner .dots span{width: .8rem;height: 20px;background: none;font-size: .16rem;color: #fff;opacity: 1;margin: 0 0 0 .18rem !important;position: relative;z-index: 1; border-radius: 0;}
.banner .dots span:before{ content: ""; position: absolute; top: 50%; left: 0; right: 0; transform: translateY(-50%); background: rgba(255,255,255,.5); height: 2px}
.banner .dots span:after{ content: ""; position: absolute; width: 0;background: #fff;height: 2px; transition: .1s;top: 50%;transform: translateY(-1px);}
.banner.on .dots span.active:after{ width: 100%; transition: 5s}

.numBox{align-items: baseline;margin: .18rem 0 0;justify-content: flex-end;}
.numBox .num1{ font-size: .24rem; color: #fff;}
.numBox span{ font-size: .14rem; color: rgba(255,255,255,.5); margin: 0 .02rem;}
.numBox .num2{ font-size: .14rem; color: rgba(255,255,255,.5);}

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

.tit1{align-items: center;margin-bottom: .3rem;position: relative;}
.tit1 .ll{ text-align: center; }
.tit1 .ll>img{margin-bottom: -.12rem;height: .51rem;}
.tit1 .ll h3{ align-items: center;}
.tit1 .ll h3 img{ width: .88rem}
.tit1 .ll h3 font{font-size: .48rem;font-family: "阿里妈妈数黑体 Bold";font-weight: 700;color: #025dd3;margin: 0 .1rem;}
.tit1 .ll h6{font-size: .24rem;color: #96c4ff;text-transform: uppercase;letter-spacing: .03rem;}

.tit1w .ll h3 font{ color: #fff;}
.tit1w .ll h6{ color: rgba(255,255,255,.66)}

.more1{ align-items: center;}

.home1{background: url(../images/home1_b.jpg) center no-repeat;background-size: cover;position: relative;z-index: 1;padding: .74rem 0;}
.home1 .b1{ content: ""; position: absolute; top: 0; left: 0; width: calc((100vw - 15.5rem)/2 + 3.96rem); background: url(../images/home1_b1.jpg) center no-repeat; background-size: cover; height: 7.62rem; z-index: -1;}

.home1 .left{ width: 9.05rem}
.home1 .right{width: calc(100% - 9.05rem  - .4rem);background: #fff url(../images/list1_b.png) right bottom no-repeat;box-shadow: 0px .1rem 1rem 0px rgba(2, 93, 211, 0.11);padding: .15rem .4rem;display: flex;align-items: center;}
.list1s{ width: 100%}
.list1s li{border-bottom: #b9b9b9 1px dotted;padding: .28rem 0;}
.list1s li:last-child{ border: none}
.list1s .a{ align-items: center; transition: .5s;}
.list1s .time h6{ font-size: .12rem; color: #363a3f; transition: .5s;}
.list1s .time h3{font-size: .4rem;color: #363a3f;font-weight: normal;line-height: 1; transition: .5s;}
.list1s .txt{ flex: 1; overflow: hidden;}
.list1s h6{margin: .16rem 0 0;}

.tit1 .ll{margin: 0 0 0 -.98rem;position: relative;}
.home1 .ll::before{ content: ""; position: absolute; width: 100%; height: 2px;}

.more1{width: 1.08rem;height: .38rem;align-items: center;position: relative;z-index: 1;padding: 0;}
.more1:before{ content: ""; position: absolute; right: 0; bottom: 0; left: 0; height: 2px; background: #025dd3; transition: .5s; z-index: -1;}
.more1:after{ content: ""; position: absolute; bottom: 0; left: 0; width: 0; height: 2px; background: #2a98ff; transition: .5s; z-index: -1;}
.more1 span{font-size: .18rem;color: #025dd3;text-transform: uppercase;letter-spacing: .01rem; transition: .5s}
.more1 .ico{ position: relative; overflow: hidden}
.more1 i{font-size: .3rem;color: #025dd3;font-family: 'lib';transform: rotate(90deg) translate(-.01rem, -.04rem);display: inline-block; transition: .5s;}
.more1 i:nth-child(2){ position: absolute; top: 0; left: 0; transform: rotate(90deg) translate(-.01rem, 101%); opacity: 0}

.list1Box{ overflow: visible;}
.list1 .a{align-items: center;display: block;position: relative;}
.list1 .imgBox{ width: 100%;}
.list1 .imgBox:after{content: "";position: absolute;right: 0;bottom: 0;left: 0;background: linear-gradient(0deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0) 100%);height: 17%;}
.list1 .imgBox .img{ padding-bottom: 58.89%;}
.list1 .txt{padding: 0 .3rem .2rem;display: flex;flex-direction: column;position: absolute;bottom: 0;left: 0;right: 0;z-index: 2;}
.list1 .time{ margin: -.1rem 0; align-self: flex-end}
.list1 .time h3{background: #008cd6;width: .84rem;height: .85rem;display: flex;align-items: center;justify-content: center;font-size: .48rem;color: #81cbff;font-weight: normal;}
.list1 .time h6{font-size: .18rem;color: #333333;opacity: .5;text-align: center;padding: .08rem 0 0;letter-spacing: .015rem;}

.list1 h4{color: #fff !important;width: calc(100% - 1.2rem);}
.list1 p{margin: .15rem 0 .5rem;}

.list1Box .dots{position: absolute;right: 0;bottom: .24rem;left: 0;z-index: 100;padding: 0 .36rem;display: flex;align-items: center;justify-content: flex-end;}
.list1Box .dots span{background: rgba(255,255,255,.2);opacity: 1;border-radius: 0;width: .07rem;height: .07rem;margin: 0 0 0 .07rem;transition: .5s;}
.list1Box .dots span.active{ width: .3rem; background: #fff}

.more2{font-size: .18rem;color: #025dd3;text-transform: uppercase;display: flex;align-items: center;}
.more2 img{margin: 0 0 0 .06rem;height: .09rem; transition: .5s;}

.list2Box{margin: .4rem -.4rem 0;padding: 0 .4rem;}
.list2Box::before{content: "";position: absolute;right: .4rem;left: .4rem;top: 1px;background: #d1d1d1;height: 1px;}
.list2 li:after{ content: ""; position: absolute; top: .24rem; right: 0; bottom: .24rem; width: 1px; background: #d1d1d1}
.list2 .a{padding: 0 .46rem;height: 2.3rem;flex-direction: column;justify-content: center;position: relative;z-index: 1; transition: .5s;}
.list2 .a:before{content: "";position: absolute;top: 0;right: 0;width: 100%;background: #fff;z-index: -1;transition: .5s;height: 100%;opacity: 0;}
.list2 .a:after{content: "";position: absolute;top: 0;right: 0;width: 0;z-index: -1;background: #025dd3;transition: .5s;height: 3px;}
.list2 h4{ margin: 0 0 .35rem}

.dotsWC{ justify-content: center; align-items: center; margin: .3rem 0 0;}
.dotsWC .more1::before, .dotsWC .more1::after{ display: none;}

.dots1{z-index: 100;padding: 0 .1rem 0 0;display: flex;align-items: center;justify-content: flex-end;}
.dots1 span{background: rgba(30,32,135,.2);opacity: 1;border-radius: 0;width: .07rem;height: .07rem;margin: 0 .035rem;transition: .5s;}
.dots1 span.active{ width: .3rem; background: #025dd3}

.miso_tab1 .hd{ align-items: center;}
.miso_tab1 .hd ul{ margin: 0 .2rem 0 0;}
.miso_tab1 .hd ul li{ padding: 0 .28rem; position: relative;}
.miso_tab1 .hd ul li::before{content: "";position: absolute;top: .18rem;width: 1px;height: .2rem;background: #00a0e9;right: 0;}
.miso_tab1 .hd ul li .a{display: block;padding: .1rem 0;font-size: .24rem;color: #999;position: relative;}
.miso_tab1 .hd ul li .a:before{content: "";position: absolute;left: 50%;width: 0;height: .03rem;background: #025dd3;bottom: 0;transform: translateX(-50%);transition: .5s;}
.miso_tab1 .hd ul li:last-child::before{ display: none}

.miso_tab1 .hd ul li.on .a{ color: #025dd3}
.miso_tab1 .hd ul li.on .a:before{ width: .48rem;}

.home2{ padding-top: 0 !important;}
.home2 .wp1{ max-width: 18.26rem;}

.list3Box{margin: 0 calc((100vw - 15.5rem)/2*-1 + .48rem);}
.list3Box1::before{content: "";position: absolute;background: url(../images/yz1.png) center no-repeat;width: 11vw;height: 11vw;background-size: 100% 100%;left: 5%;top: 18%;}
.list3Box2::before{content: "";position: absolute;background: url(../images/yz2.png) center no-repeat;width: 11vw;height: 11vw;background-size: 100% 100%;left: 5%;top: 18%;}
.list3 li{ height: auto}
.list3 .a{flex-direction: column;height: 100%;justify-content: flex-end;}
.list3 .imgBox{width: 100%;transform-origin: bottom;transition: .5s;}
.list3 .imgBox:after{content: "";position: absolute;right: 0;bottom: 0;left: 0;background: linear-gradient(0deg, #0467f7 0%, rgba(0, 0, 0, 0) 100%);height: 0; transition: .5s}
.list3 .imgBox .img{padding-bottom: 0;}
.list3 .imgBox .img img{}
.list3 .txt{ padding: .2rem 0; text-align: center}

.list3 li:nth-child(5n-4) .imgBox .img{padding-bottom: 60%;}
.list3 li:nth-child(5n-3) .imgBox .img{padding-bottom: 146%;}
.list3 li:nth-child(5n-2) .imgBox .img{padding-bottom: 174%;}
.list3 li:nth-child(5n-1) .imgBox .img{padding-bottom: 150%;}
.list3 li:nth-child(5n) .imgBox .img{padding-bottom: 95%;}

.swiper-scrollbar1{background: #d3d3e7;height: 1px !important;position: relative !important;left: auto !important;bottom: auto !important;width: 100% !important;display: block !important;margin: .65rem auto 3px;}
.swiper-scrollbar1 .swiper-scrollbar-drag{background: #025dd3;height: 3px;border-radius: 0;bottom: 2px;top: auto;}

.home3-4{background: url(../images/home3-4_b1.jpg) center bottom no-repeat;background-size: cover;position: relative;z-index: 1;overflow: hidden;}
.lineBox{position: absolute;top: 3vw;right: 0;left: 0;z-index: -1}
/* .lineBox .line{ transition: .1s;} */
.lineBox .line2, .lineBox .line3{ position: absolute; top: 0; right: 0; bottom: 0; left: 0;}

.home3{padding-bottom: .5rem; position: relative; z-index: 2;}

.tit1wc{ justify-content: center;}
.tit1wc .more1{ position: absolute; top: 50%; right: 0; transform: translateY(-50%);}
.tit1wc .more1 span, .tit1wc .more1 .ico i{ color: #fff; }
.tit1wc .more1::before, .tit1wc .more1::after{ background: #fff;}
.tit1wc .ll{ margin-left: 0}

.list4 .cls-1{fill: #1a48b0;fill-rule:evenodd; transition: .5s;}

.list4{ margin: 0 -.16rem;}
.list4 li{ width: 33.33%; padding: 0 .16rem;}
.list4 .a{ display: block; padding: .2rem; background: #fff; box-shadow: 0px 9px .6rem 0px rgba(2, 93, 211, 0.11);}
.list4 h4{font-size: .24rem;color: #1e2087;margin: .2rem 0;}
.list4 p{font-size: .18rem;color: #888;padding: 0 0 0 .26rem;line-height: .32rem;position: relative;}
.list4 p:before{content: "";position: absolute;background-size: .18rem .18rem !important;top: 50%;left: 0;width: .18rem;height: .18rem; margin: -.09rem 0 0;}
.list4 p.p1:before{ background: url(../images/list4_i1.png) left center no-repeat;}
.list4 p.p2:before{ background: url(../images/list4_i2.png) left center no-repeat;}

.list4 .con{margin: .5rem 0 0;position: relative;z-index: 1;align-items: center; border-top: #d1daef 1px solid; border-bottom: #d1daef 1px solid;}
.list4 .con::before{ content: ""; position: absolute; top: 0; right: 0; bottom: 0; width: 0; transition: .5s; z-index: -1; background: url(../images/list4_b.jpg) center no-repeat; background-size: cover; }
.list4 .con .ll{width: 1.2rem;height: 1.28rem;align-items: center;justify-content: center;border-right: #d1daef 1px solid;}
.list4 .con .rr{flex: 1;overflow: hidden;padding: 0 .5rem;}
.list4 .con .rr svg{position: absolute;top: .15rem;right: .15rem;width: .3rem;height: .3rem;}
.list4 .time h3{font-size: .36rem;color: #f3c583;line-height: 1;transition: .5s;}
.list4 .time h6{font-size: .18rem;color: #1e48ac;opacity: .7;margin: .06rem 0 0;transition: .5s;}
.list4 h5{font-size: .2rem;color: #434191;transition: .5s;}

.list5Box{width: calc((100vw - 15.5rem)/2 + 100% + .13rem);padding: .3rem .13rem 0;margin: 0 -.13rem;}
.list5 .txt{height: 3.16rem;background: #fff;box-shadow: 0px .09rem .2rem 0px rgba(161, 151, 168, 0.43);padding: .38rem;position: relative;z-index: 1;transition: .5s;}
.list5 .txt:after{content: "";position: absolute;top: 100%;left: .4rem;border-left: #fff .38rem solid;border-bottom: transparent .3rem solid;transition: .5s;}
.list5 .ico{margin: .58rem 0 0;width: .81rem;height: .81rem;position: relative;border: #fdd288 .03rem solid;border-radius: 50%;overflow: hidden;box-sizing: content-box;}
.list5 .ico img{ width: 100%; height: 100%}

.home4{ padding-bottom: .5rem;}
.home4 .wp{ position: relative; z-index: 1}
.home4 .wp:before{content: "";position: absolute;left: .8rem;right: -.4rem;background: url(../images/home4_b.png) center repeat-x;background-size: auto 2px;height: 2px;bottom: .42rem;}

.list5 h6 font{font-size: .2rem;color: #aa44ad;transition: .5s;}
.list5 h4{ margin: .16rem 0}

.home5{ background: url(../images/home5_b.jpg) center top no-repeat; background-size: cover; padding-bottom: 2rem;}
.home5 .wp{ align-items: flex-start;}
.home5 .content{ align-items: flex-start}
.home5 .left{width: 23%;transition: .5s;}
.home5 .center{width: 24%;transition: .5s;transform: translateY(.44rem);}
.home5 .right{width: 50%;position: relative;z-index: 1;transition: .5s;}
.home5 .right::before{content: "";position: absolute;top: 0;right: 0;bottom: 0;left: 0;background: #007fd6;z-index: -1;transform: translate(-.3rem, .3rem);}

.list6 li .imgBox .img{ padding-bottom: 60%;}


.list6 li{margin-bottom: 4.5%;}
.list6 .a{ display: block; position: relative}
.list6 .ico{position: absolute;top: 50%;left: 50%;width: .98rem;height: .98rem; display: flex; justify-content: center; align-items: center; padding: 0 0 0 .06rem; transform: translate(-50%, -50%);}
.list6 .ico:before{ content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; border-radius: 50%; border: rgba(255,255,255,1) 2px solid; transition: .5s}
.list6 .ico svg{width: .2rem;height: .2rem;fill: #fff;transition: .5s;}

.list6 .txt{position: absolute;left: 0;right: 0;bottom: 0;background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, .6));padding: .3rem .2rem .15rem;z-index: 2;}
.list6 .txt h4{color: #fff;width: 100%;}

.list6 li:last-child{ margin-bottom: 0;}



@media(min-width: 1024px){
    .more1:hover i:nth-child(1){ transform: rotate(90deg) translate(-.01rem, -101%); opacity: 0}
    .more1:hover i:nth-child(2){ transform: rotate(90deg) translate(-.01rem, -.04rem); opacity: 1}
    .more1:hover:after{ width: 100%}
    .more1:hover *{ color: #2a98ff}

    .list2 .a:hover{ box-shadow: 0px .1rem .6rem 0px rgba(2, 93, 211, 0.11);}
    .list2 .a:hover:before{width: 100%;left: 0;right: auto;opacity: 1;}
    .list2 .a:hover:after{ width: 100%; left: 0; right: auto}

    .a:hover .more2 img{ transform: translateX(.1rem);}

    .list3 .a:hover .imgBox:after{ height: 50%}
    .list3:hover .a .imgBox{ transform: scaleY(.95)}
    .list3 li.on:hover .a .imgBox{ transform: scaleY(1.05)}

    .list4 .a:hover .con::before{ width: 100%; left: 0; }
    .list4 .a:hover .con *{ color: #fff}
    .list4 .a:hover .cls-1{ fill: #fff;}

    .list5 .a:hover .txt{ transform: translateY(-.2rem); background: #0364d5}
    .list5 .a:hover .txt:after{border-left: #0364d5 .38rem solid;}
    .list5 .a:hover *{ color: #fff}

    .list6 .a:hover .ico:before{ transform: scale(.8)}

    .home5.on .left{ transform: translateY(.44rem);}
    .home5.on .center{ transform: translateY(0);}
}
@media(max-width: 1024px){
    .banner .imgBox .img{ padding-bottom: 55%;}
    .banner .dotsW{ bottom: .15rem;}
    .banner .dots{ display: none;}

    .home1 .b1{width: calc(4rem + .7rem);}

    .list1 .imgBox{ width: 100%;}
    .list1 .txt{width: 100%;}
    .list1Box .dots{/* justify-content: flex-start; */}
    .numBox{ justify-content: flex-end;}

    .list4 li{width: 100%;margin-bottom: .25rem;}

    .list5Box{width: calc(100% + .2rem);margin: 0 -.1rem;padding: .2rem .1rem 0;}
    .list5 .txt{ box-shadow: 0px .09rem .1rem 0px rgba(161, 151, 168, 0.43);}

    .list3Box{ margin: 0;}
    .list3Box::before{ left: 15%; width: 18vw; height: 18vw;}

    .home1 .left{ width: 100%}
    .home1 .right{width: 100%;margin-bottom: .3rem;padding: .1rem .2rem;}

}
@media(max-width: 800px){
    .home1 .b1{width: 50%;height: 3rem;}

    .tit1 .ll{ margin: 0 0 0 -.3rem}
    .tit1 .ll h3 font{ font-size: .26rem}
    .tit1 .ll h3 img{ width: .44rem}
    .tit1 .ll h6{font-size: .14rem;}
    .tit1 .ll>img{ height: .36rem}
    .tit1wc .ll{ margin: 0}

    .pad1{ padding: .4rem 0}
    .more1{ width: .9rem}
    .more1 span{ font-size: .16rem}
    .more1 i{font-size: .2rem;transform: rotate(90deg) translate(-0.01rem, 0rem);}

    .list1 .time h3{width: .7rem;height: .7rem;font-size: .36rem;}
    .list1 .time h6{ font-size: .16rem}
    .list1 .time{margin: -.25rem 0 -.2rem;}

    .list2 li:after{ display: none;}
    .list2 .a{ padding: 0 .25rem }

    .list2Box{margin: .4rem 0 0;padding: 0 0;}
    .list2Box::before{ left: 0; right: 0;}

    .dotsWC{ margin: 0 0 0;}
    .swiper-scrollbar1{margin: .1rem 0 0;}
    .list4 p{ font-size: .16rem}
    .list4 .con .ll{ width: .8rem; height: .8rem}
    .list4 .time h3{font-size: .28rem;}
    .list4 .time h6{font-size: .14rem;}

    .list4 .con .rr svg{ width: .17rem; height: .17rem}
    .list4 .con{ margin: .25rem 0 0;}
    .list4 h4{ margin-bottom: .1rem;}
    .list4 h5{ font-size: .17rem;}
    .home3{ padding-bottom: .1rem;}
    .list4 .a{ box-shadow: 0px 9px .3rem 0px rgba(2, 93, 211, 0.11);}

    .list5 .txt:after{content: "";position: absolute;top: 100%;left: .3rem;border-left: #fff .28rem solid;border-bottom: transparent .2rem solid;}

    .home4{padding-top: .3rem;padding-bottom: .2rem;}
    
    .list6 .ico{ width: .5rem; height: .5rem;}
    .list6 .ico svg{ width: .13rem; height: .13rem;}
    .home5 .right::before{ transform: translate(.1rem, .1rem);}

    .home5{ padding-bottom: .8rem;}
    .home5 .center{ transform: translateY(.22rem);}
    .banner .txt{ padding: .5rem 0 .15rem}
    .banner .txt h4{ width: calc(100% - .6rem)}

    .home5 .left{ width: 48%}
    .home5 .center{ width: 48%; transform: translateY(0)}
    .home5 .right{ width: 100%; margin: .2rem 0 0 }

    .list1s li{ padding: .15rem 0}
    .list1s h6{ margin: .08rem 0 0}
} 
@media(max-width: 560px){
    .tit1{ margin-bottom: .2rem}
    .list1 .txt{padding: 0 .2rem .15rem;}
    .more2{ font-size: .16rem}
    .more2 img{ height: .06rem}

    .list2 .a{ padding: 0 .2rem}

    .miso_tab1 .hd ul li{padding: 0 .2rem;}
    .miso_tab1 .hd ul li .a{font-size: .18rem;}
    .miso_tab1 .hd{width: 100%;margin: .15rem 0 0;justify-content: center;}
    .home2 .tit1{ justify-content: center}
    .miso_tab1 .hd ul li::before{ height: .12rem}
    .list5 .txt{padding: .2rem;height: 2.4rem;}

    .list5 .ico{width: .5rem;height: .5rem;margin: .4rem 0 0;}
    .home4 .wp:before{bottom: .25rem;background-size: 7rem 1px;}
    .list6 .txt{padding: .2rem .2rem .1rem;}

}