@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 .txt{position: absolute;top: 0;right: 0;bottom: 0;left: 0;justify-content: center;align-items: center;text-align: center;}
.banner h3{font-size: .64rem;color: #fff !important;font-family: "Microsoft YaHei";font-weight: bold;opacity: 0;font-family: "阿里巴巴普惠体 2.0 105 Heavy";font-weight: 900;line-height: 1.1;}
.banner h4{font-size: .5rem;color: #fff !important;margin: .05rem 0 0;opacity: 0;font-weight: 400;font-family: "阿里巴巴普惠体 2.0 45 Light";font-weight: 300;}
.banner h5{font-size: .2rem;color: #fff !important;margin: .25rem 0 .85rem;opacity: 0;font-family: "阿里巴巴普惠体 2.0 45 Light";font-weight: 300;}

.banner .swiper-slide.swiper-slide-active h3{ animation: enter 1.2s forwards .2s;}
.banner .swiper-slide.swiper-slide-active h4{ animation: enter 1.2s forwards .3s;}
.banner .swiper-slide.swiper-slide-active h5{ animation: enter 1.2s forwards .4s;}

@-webkit-keyframes enter {
    0% { opacity: 0; transform:translateY(100px); -webkit-transform:translateY(100px); -moz-transform:translateY(100px); -ms-transform:translateY(100px); -o-transform:translateY(100px); }
    20% { opacity: 0; transform:translateY(100px); -webkit-transform:translateY(100px); -moz-transform:translateY(100px); -ms-transform:translateY(100px); -o-transform:translateY(100px); }
    100% { opacity: 1; transform: translateY(0px); -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); -o-transform: translateY(0px); }
}
@keyframes enter {
    0% { opacity: 0; transform:translateY(100px); -webkit-transform:translateY(100px); -moz-transform:translateY(100px); -ms-transform:translateY(100px); -o-transform:translateY(100px); }
    20% { opacity: 0; transform:translateY(100px); -webkit-transform:translateY(100px); -moz-transform:translateY(100px); -ms-transform:translateY(100px); -o-transform:translateY(100px); }
    100% { opacity: 1; transform: translateY(0px); -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); -o-transform: translateY(0px); }
}

.banner .dotsw{ position: absolute; z-index: 1; bottom: .7rem;left: 0;right: 0;justify-content: center;align-items: center;}
.banner .dots{ margin: 0 .3rem}
.banner .dots span{ width: .1rem; height: .1rem; background: rgba(255,255,255,.4); opacity: 1 !important; margin: 0 .1rem;transition: all .5s;}
.banner .dots span.active{ background: #fff}
.arrow1{position: absolute;z-index: 10;cursor: pointer;top: 50%;transform: translateY(-50%);width: .7rem;height: .7rem;background: rgba(255,255,255,.7);border-radius: 50vw;font-size: .22rem;color: #424345;display: flex;justify-content: center;align-items: center;font-family: 'lib';transition: .5s;}
.arrow1.prev{left: 3%;transform: translateY(-50%) rotate(-90deg);}
.arrow1.next{right: 3%;transform: translateY(-50%) rotate(90deg);}

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

.more1{background: #009844;width: .65rem;height: .65rem;border-radius: 50vw;align-items: center;justify-content: center;font-size: .22rem;color: #fff;font-family: 'lib';transform: rotate(180deg);cursor: pointer;transition: .5s;}
.more1::before{ -webkit-animation: scrollAnim 1.2s infinite; animation: scrollAnim 1.2s infinite; position: relative;}
.more1:hover{ background: #00458e}

@keyframes scrollAnim {
    0% { 
        transform: translateY(0);
    }
    50% {
        transform: translateY(-3px);
    }
    100% {
        transform: translateY(0);
    }
}

.tit1{margin-bottom: .7rem;text-align: center;}
.tit1 h3{font-size: .44rem;color: #00458e;font-family: "Microsoft YaHei";}

.list1 .a{ display: block; position: relative; }
.list1 .imgBox{ border-radius: .1rem;}
.list1 .imgBox .img{ padding-bottom: 123.15%;}
/* .list1 .imgBox .img{ padding-bottom: 123.15%; background: #e3e3e3 url(../images/list1_b.jpg) center no-repeat; background-size: cover;} */
.list1 .imgBox .img{ padding-bottom: 106%;background: #eee;}
/* .list1 .imgBox .img img{ height: auto; margin: 17% 0 0} */
.list1 .imgBox .img img{ height: auto;}
.list1 .txt{position: absolute;right: .28rem;bottom: 12%;left: .28rem;height: .4rem;background: #fff;border-radius: 50vw;align-items: center;display: flex;justify-content: space-between;padding: 0 .3rem 0 .4rem;font-size: .29rem;color: #333;font-family: 'lib'; transition: .5s;}
.list1 .txt h4{ flex: 1;font-size: .16rem; text-align: center;}
.list1 .txt:before{ order: 1; margin: 0 0 0 .2rem}

.list1Box .swiper-scrollbar{flex: 1;overflow: hidden;height: .05rem;background: none;bottom: 0;margin: .6rem 0 0;position: relative;z-index: 1;left: 0;width: 100%;}
.list1Box .swiper-scrollbar:before{ content: ""; position: absolute; right: 0; left: 0; top: 50%; margin: -.5px 0 0; height: 1px; background: #e3e4e8}
.list1Box .swiper-scrollbar-drag{background: #009844; border-radius: 50vw;}

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

.list2 .a{ display: block; position: relative;}
.list2 .imgBox .img{ padding-bottom: 54.86%;}
.list2 .txt{ position: absolute; right: .58rem; bottom: .58rem; width: 6.65rem; height: 3.85rem; border-radius: .1rem; background: #fff; display: flex; align-items: center; padding: 0 .58rem; opacity: 0; visibility: hidden; transition: .5s;}
.list2 .txt .con{ width: 100%;}
.list2 h4{ font-size: .3rem; line-height: .4rem; max-height: .8rem\0;}
.list2 dl{margin: .3rem -.1rem .5rem;}
.list2 dl dd{ width: 50%; padding: 0 .1rem; font-size: .16rem; color: #999; line-height: .36rem;}
.list2 .bottom{ align-items: center;}

.list2 li.swiper-slide-active .txt{ opacity: 1; visibility: visible;}

.more2{font-size: .14rem;color: #009844;font-family: "阿里巴巴普惠体 2.0 45 Light";font-weight: 300;text-transform: uppercase;align-items: center; transition: .5s;}
.more2 i{font-size: .3rem;color: #009844;font-family: 'lib';margin: 0 0 0 .12rem; transition: .5s;}

.arrow2{width: .75rem;align-items: center;}
.arrow2 .arrow{ font-size: .29rem; color: #00458e; font-family: 'lib'; cursor: pointer; transition: .5s;}

.indexc{ padding-top: .2rem !important;}
.indexc .wp.flexjs{/* align-items: flex-start */}
.indexc .left{width: 10.3rem;}
.indexc .right{width: calc(100% - 10.3rem - .2rem);background: #f0f1f6;display: flex;align-items: center;padding: 0 .4rem;/* height: 100% */}

.list3 li{ width: calc(50% - .1rem);}
.list3 .imgBox .img{ padding-bottom: 62.37%;}
.list3 .txt{background: #f0f1f6;height: 2.95rem;display: flex;flex-direction: column;justify-content: center;padding: 0 .5rem;}
.list3 h4{ font-size: .24rem; line-height: .34rem; max-height: .68rem\0}
.list3 p{margin: .2rem 0 .35rem;}

.list4{ width: 100%;}
.list4 li{padding: .12rem 0;}
.list4 h6{ margin: .1rem 0 0;}

.more3{width: 1.6rem;height: .5rem;border: #d1d3d7 2px solid;border-radius: 50vw;transition: .5s;font-size: .16rem;color: #313131;margin: .5rem auto 0;display: flex;align-items: center;justify-content: center;}

.indexd{padding: 0 !important;background: #f0f1f6;}
.indexd .left{width: calc(100% - 49.25%);display: flex;align-items: center;position: relative;z-index: 1;padding: 0 4% 0 0;}
.indexd .left .txt{ width: 100%}
.indexd .left .txt h6{ font-size: .22rem; color: #009844}
.indexd .left .txt h3{ font-size: .52rem; color: #313131; font-weight: 400; margin: .1rem 0 .45rem}
.indexd .left .txt p{ font-size: .18rem; color: #414141; line-height: 2; margin: 0 0 1rem}
.indexd .right{ width: 49.25%; position: relative;}
.indexd .right::after{content: "";position: absolute;top: 0;bottom: 0;right: 100%;width: 2rem;background: #f0f1f6;transform-origin: left bottom;transform: skewX(-13deg);}
.indexd .right .imgBox{ width: calc((100vw - 16rem)/2 + 100%);}
.indexd .right .imgBox .img{ padding-bottom: 0;}
.indexd .right .imgBox img{ position: relative;}
.indexa .list1{display: grid;grid-template-columns: repeat(6,1fr);gap: .2rem;}
.more4{width: 1.6rem;height: .5rem;background: #00458e;border-radius: 50vw;transition: .5s;font-size: .16rem;color: #fff;display: flex;align-items: center;justify-content: center;}

@media(min-width: 1024px){
    .list1 .a:hover .txt{background: #00458e;color: #fff;}
    .list1 .a:hover .txt h4{ color: #fff;}

    .arrow1:hover{ background: #009844; color: #fff;}

    .arrow2 .arrow:hover{ color: #009844;}
    .more2:hover, .more2:hover i{ color: #00458e;}

    .more3:hover{background: #00458e;color: #fff;border: #00458e 2px solid;}
    .more4:hover{ background: #009844; color: #fff;}
}
@media(max-width: 1024px){
    .banner .imgBox .img{padding-bottom: 67%;}
}
@media(max-width: 800px){
    .banner h3{font-size: .24rem;}
    .banner h4{font-size: .18rem;}
    .banner h5{font-size: .13rem;margin: .15rem 0 .25rem;}

    .arrow1{ width: .36rem; height: .36rem; font-size: .16rem}

    .more1{width: .36rem;height: .36rem;font-size: .14rem;margin-bottom: -.3rem;}
    .banner .txt{ padding: 0 .6rem}

    .pad1{ padding: .4rem 0;}

    .tit1{ margin-bottom: .25rem;}
    .tit1 h3{font-size: .26rem;}

    .list1 .txt{padding: 0 .15rem;right: .15rem;left: .15rem;bottom: .15rem;height: .4rem;}
    .list1 .txt h4{ font-size: .16rem !important}
    .list1 .txt:before{ font-size: .2rem; margin: 0 0 0 .15rem}

    .list1Box .swiper-scrollbar{ margin: .3rem 0 0;}

    .indexb{padding-top: .1rem;padding-left: 15px;padding-right: 15px;}

    .list2 .txt{position:relative;right: 0;left: 0;bottom: 0;background: #f0f1f6;border-radius: 0;opacity: 1;visibility: visible;max-width: 100%;padding: 0 .2rem;height: 2.6rem;width: 100%;}
    .list2 dl{ margin: .15rem 0 .25rem}
    .list2 dl dd{width: 100%;line-height: .24rem;padding: 0;}

    .more2 i{ font-size: .24rem}
    .arrow2 .arrow{ font-size: .24rem}

    .indexc{ padding-top: 0 !important;}

    .indexc .left{ width: 100%}
    .indexc .right{ width: 100%; padding: .25rem .25rem; margin: .25rem 0 0}
    .more3{margin: .3rem auto 0;width: 1.2rem;height: .4rem;font-size: .14rem;}
    .list3 .txt{padding: 0 .2rem;height: 2rem;}
    .list3 p{margin: .1rem 0 .2rem;}
    .list4 li{ padding: .08rem 0;}

    .list3 li{ width: calc(50% - 7px);}

    @-webkit-keyframes enter {
        0% { opacity: 0; transform:translateY(.5rem); -webkit-transform:translateY(.5rem); -moz-transform:translateY(.5rem); -ms-transform:translateY(.5rem); -o-transform:translateY(.5rem); }
        20% { opacity: 0; transform:translateY(.5rem); -webkit-transform:translateY(.5rem); -moz-transform:translateY(.5rem); -ms-transform:translateY(.5rem); -o-transform:translateY(.5rem); }
        100% { opacity: 1; transform: translateY(0px); -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); -o-transform: translateY(0px); }
    }
    @keyframes enter {
        0% { opacity: 0; transform:translateY(.5rem); -webkit-transform:translateY(.5rem); -moz-transform:translateY(.5rem); -ms-transform:translateY(.5rem); -o-transform:translateY(.5rem); }
        20% { opacity: 0; transform:translateY(.5rem); -webkit-transform:translateY(.5rem); -moz-transform:translateY(.5rem); -ms-transform:translateY(.5rem); -o-transform:translateY(.5rem); }
        100% { opacity: 1; transform: translateY(0px); -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); -o-transform: translateY(0px); }
    }

    .indexd .left{padding: .4rem 0;width: 100%;}
    .indexd .right{width: 100%;padding-bottom: .4rem;}
    .indexd .right .imgBox{ width: 100%;}
    .indexd .right::after{ display: none;}

    .indexd .right .imgBox .img{padding-bottom: 60%;}
    .indexd .right .imgBox .img img{ position: absolute}

    .indexd .left .txt h3{font-size: .26rem;margin: .06rem 0 .2rem;}
    .indexd .left .txt p{ margin-bottom: .3rem}

    .more4{ width: 1.2rem;height: .4rem;font-size: .14rem;}

    .list4 .a{display: flex;flex-wrap: wrap;align-items: center;}
    .list4 h4{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;flex: 1;}
    .list4 h6{margin: 0 0 0 .15rem;width: auto;}
} 
@media(max-width: 560px){
} 
.list1 .imgBox .al_img{padding-bottom: 90%;}
.indexanli{padding-top: 0;}
.indexa .list1 .imgBox .al_img{padding-bottom: 101%;}