﻿@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;background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 100%);z-index: 1;height: 23vh;}
.banner .a{ display: block; position: relative; z-index: 1; overflow: hidden; }
.banner .imgBox{ overflow: hidden; width: 100%; }
.banner .imgBox .img{ padding-bottom: 100vh; 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: .4rem;z-index: 2;}
.banner .dots{ justify-content: center; align-items: center;}
.banner .dots span{width: .15rem;height: .15rem;background: none;font-size: .16rem;color: #fff;opacity: 1;margin: 0 .1rem !important;position: relative;z-index: 1; border: #fff solid 1px; border-radius: 50%;}
.banner .dots span:after{content: "";position: absolute;top: 50%;left: 50%;width: .39rem;height: .21rem;background: url(../images/dots1s.png) center no-repeat;background-size: cover;opacity: 0;transition: .5s;margin: -.11rem 0 0 -.2rem;}

.banner .dots span.active{ border: transparent 1px solid; margin: 0 .2rem !important;}
.banner .dots span.active:after{ opacity: 1}

.pad1{ padding: .8rem 0; overflow: hidden;}

.index1-2{ background: url(../images/in1-2.jpg) center bottom no-repeat; background-size: cover; }

.tit1{ align-items: flex-end; margin: 0 0 .4rem;}
.tit1 .ll{ text-align: center; position: relative; z-index: 1;}
.tit1 .ll::before{content: "";position: absolute;top: 50%;left: 50%;width: 2.37rem;height: .6rem;background: url(../images/tit1_b.png) center no-repeat;background-size: cover;z-index: -1;transform: translate(-50%, -50%);}
.tit1 .ll h3{ display: flex; align-items: center; margin: 0 0 .1rem;}
.tit1 .ll h3 span{ font-size: .42rem; color: #323232; font-family: 'sys'; line-height: 1;}
.tit1 .ll h3 i{ display: inline-block; width: .07rem; height: .07rem; background: #005b30; border-radius: 50vw; margin: 0 .1rem;}
.tit1 .ll h6 span{ font-size: .14rem; color: #005b30; text-transform: uppercase; position: relative; line-height: 1;}
.tit1 .ll h6 span::before{ content: ""; position: absolute; top: 50%; left: calc(100% + .1rem); width: .15rem; height: 1px; background: #005b30; margin: -.5px 0 0;}
.tit1 .ll h6 span::after{ content: ""; position: absolute; top: 50%; right: calc(100% + .1rem); width: .15rem; height: 1px; background: #005b30; margin: -.5px 0 0;}

.more1{border-bottom: #005b30 solid 1px;padding: .04rem 0;text-align: center;align-items: center; font-size: .14rem; color: #005b30; transition: .5s}
.more1 img{margin: 0 .06rem 0 0;transition: .5s;}

.index1 .left{ width: 8.5rem;}
.index1 .right{ width: calc(100% - 8.5rem - .4rem);}

.ls1 .imgBox{ border-radius: .1rem;}
.ls1 .imgBox .img{ padding-bottom: 68.23%;}
.ls1 .bottom{ align-items: flex-end; margin: -.4rem 0 0; position: relative; z-index: 2;}
.ls1 .bottom .txt{flex: 1;height: .8rem;background-image: linear-gradient( -180deg, rgb(12,150,85) 0%, rgb(0,91,48) 100%);border-radius: 0 50vw 50vw 0;align-items: center;padding: 0 .15rem 0 0;}
.ls1 .bottom .txt .time{ width: .9rem; height: 100%; background: rgba(255,255,255,.1); border-radius: 0 50vw 50vw 0; display: flex; justify-content: center; align-items: center; flex-direction: column; margin: 0 .2rem 0 0;}
.ls1 .bottom .txt .time h3{ font-size: .3rem; color: #fff; font-family: Impact; font-weight: normal;}
.ls1 .bottom .txt .time h6{ font-size: .14rem; color: #fff; }
.ls1 h4{ flex: 1; color: #fff !important;}

.dots1{ margin: 0 0 0 .2rem;}
.dots1{ display: flex; justify-content: center; align-items: center;}
.dots1 span{width: .15rem;height: .15rem;background: none;font-size: .16rem;color: #fff;opacity: 1;margin: 0 .05rem !important;position: relative;z-index: 1; border: #005b30 solid 1px; border-radius: 50%;}
.dots1 span:after{content: "";position: absolute;top: 50%;left: 50%;width: .39rem;height: .21rem;background: url(../images/dots1_i.png) center no-repeat;background-size: cover;opacity: 0;transition: .5s;margin: -.11rem 0 0 -.2rem;}

.dots1 span.active{ border: transparent 1px solid; margin: 0 .2rem !important;}
.dots1 span.active:after{ opacity: 1}

.ls2{ margin: -.25rem 0;}
.ls2 li{border-bottom: #ececec 1px solid;transition: .5s;}
.ls2 .a{ height: 1.12rem; align-items: center;}
.ls2 .time{ margin: 0 .22rem 0 0; text-align: center; position: relative; z-index: 1;}
.ls2 .time::before{content: "";position: absolute;top: 52%;left: 50%;width: .8rem;height: .66rem;background: url(../images/ls2_b.png) center no-repeat;background-size: cover;z-index: -1;transform: translate(-50%, -50%);}
.ls2 .time h3{ font-size: .3rem; color: #005b30; font-family: Impact; font-weight: normal;}
.ls2 .time h6{ font-size: .14rem; color: #666; }
.ls2 h4{ flex: 1;}

.ls2 li:last-child{border-bottom: none !important;}

.index2{padding: 0 0 14vw;}

.ls3{ margin: 0 -.15rem -.3rem;}
.ls3 li{ width: 33.33%; padding: 0 .15rem; margin-bottom: .3rem;}
.ls3 .a{height: 1.46rem;background: #fff;box-shadow: 0px 4px .48rem 0px rgba(0, 0, 0, 0.06);padding: 0 .3rem;align-items: center;border-bottom: #005b30 .04rem solid; position: relative; z-index: 1;}
.ls3 .a::before{content: "";position: absolute;top: 0;left: 0;right: 0;bottom: 0;background: linear-gradient( -90deg, rgb(12,150,85) 0%, rgb(0,91,48) 100%);z-index: -1; transition: .5s; opacity: 0;}
.ls3 .time{margin: 0 .22rem 0 0;text-align: center;position: relative;z-index: 1;width: .8rem;}
.ls3 .time::before{content: "";position: absolute;top: 52%;left: 50%;width: .8rem;height: .66rem;background: url(../images/ls2_b.png) center no-repeat;background-size: cover;z-index: -1;transform: translate(-50%, -50%); transition: .5s;}
.ls3 .time h3{ font-size: .3rem; color: #005b30; font-family: Impact; font-weight: normal; transition: .5s;}
.ls3 .time h6{ font-size: .14rem; color: #666; transition: .5s;}
.ls3 h4{flex: 1;margin: .05rem 0 0;}

.index3{background: url(../images/in3_b.png) center top no-repeat;background-size: 100% auto;padding: 10vw 0 .8rem;position: relative;z-index: 2;margin: -12vw 0 0;}
.xiaoxun{position: absolute;left: 70%;top: 2vw;transform: translateX(-50%);width: 5.17rem;max-width: 27vw;}

.tit1w .ll *{ color: #fff !important;}
.tit1w .ll h3 i{ background: #fff;}
.tit1w .ll h6 span::before, .tit1w .ll h6 span::after{ background: #fff;}

.more1w{ color: #fff !important; border-bottom: #fff solid 1px;}

.ls4 .a{border-radius: .1rem;overflow: hidden;display: block;position: relative;z-index: 1; transition: .5s;}
.ls4 .a::before{content: "";position: absolute;top: 0; right: 0; left: 0;right: 0;bottom: 0; border: rgba(255,255,255,.2) 1px solid; border-radius: .1rem; z-index: -1; transition: .5s; }
.ls4 .imgBox .img{ padding-bottom: 66.66%;}
.ls4 .txt{display: flex;height: 1.78rem;flex-direction: column;justify-content: center;align-items: flex-end;}
.ls4 .con{ padding: 0 .4rem; width: 100%;}
.ls4 h4{ color: #fff !important;}
.ls4 h6{margin: .15rem 0 0;background: url(../images/ls4_b.png) center no-repeat;background-size: cover;width: 1.6rem;height: .32rem;border-radius: 50vw 0 0 50vw;justify-content: center;align-items: center;font-size: .14rem;color: #fff; padding: 0 .2rem 0 0}
.ls4 h6 i{ font-size: .14rem;color: #fff; font-family: 'lib'; margin: 0 .08rem 0 0}

.ls4 li.swiper-slide-active + li .a{ transform: translateY(.5rem)}

.ls4Box .dots{ justify-content: center; align-items: center; margin: .86rem 0 0;}
.ls4Box .dots span{width: .15rem;height: .15rem;background: none;font-size: .16rem;color: #fff;opacity: 1;margin: 0 .1rem !important;position: relative;z-index: 1; border: #fff solid 1px; border-radius: 50%;}
.ls4Box .dots span:after{content: "";position: absolute;top: 50%;left: 50%;width: .39rem;height: .21rem;background: url(../images/dots1s.png) center no-repeat;background-size: cover;opacity: 0;transition: .5s;margin: -.11rem 0 0 -.2rem;}

.ls4Box .dots span.active{ border: transparent 1px solid; margin: 0 .2rem !important;}
.ls4Box .dots span.active:after{ opacity: 1}

.index4{background: url(../images/in4_b.jpg) center bottom no-repeat;background-size: 100% auto;position: relative;z-index: 2;}
.index4 .left{ width: calc(50% - .3rem);}
.index4 .right{ width: calc(50% - .3rem);}

.ls5{ margin: 0 -.1rem -.2rem;}
.ls5 li{ width: 50%; padding: 0 .1rem; margin-bottom: .2rem;}
.ls5 .a{height: 1.64rem; border: #ededed 1px solid; position: relative; z-index: 1; flex-direction: column;justify-content: center;align-items: flex-start; transition: .5s;}
.ls5 .con{ padding: 0 .3rem; width: 100%;}
.ls5 h6{ background: rgba(0,91,48,.1); min-width: 1.05rem; height: .28rem; align-items: center; padding: 0 .15rem 0 .3rem; border-radius: 0 50vw 50vw 0; font-size: .14rem; color: #005b30; margin: 0 0 .18rem; transition: .5s;}
.ls5 h4{ height: .56rem;}

.ls6 li{ margin: 0 0 .32rem;}
.ls6 h6{ width: 100px; height: .28rem; display: flex; align-items: center; justify-content: center; border: rgba(0,91,48,.2) 1px solid; border-radius: .08rem 0 .08rem 0; color: #005b30; margin: 0 .18rem 0 0; transition: .5s;}
.ls6 h4{ flex: 1;}

.ls6 li:last-child{ margin: 0;}

.index4 .fl2{ margin: .8rem 0 0;}

.ls7W{ position: relative; z-index: 1;}
.ls7 .imgBox{ border-radius: .1rem;}
.ls7 .imgBox .img{ padding-bottom: 65.39%;}

.ar2{ position: absolute; top: 50%; display: flex; align-items: center; justify-content: center; width: .51rem; height: .51rem; border-radius: 50vw; background: #005b30; transform: translateY(-50%); z-index: 2; border: #fff 2px solid; border-radius: 50vw; cursor: pointer; transition: .5s;}
.ar2.prev1{ left: -.25rem;}
.ar2.next1{ right: -.25rem;}
.ar2 img{ height: .15rem; transition: .5s;}

.ar3{ position: absolute; top: 50%; display: flex; align-items: center; justify-content: center; width: .51rem; height: .51rem; border-radius: 50vw; background: rgba(0, 0, 0, 0.3); transform: translateY(-50%); z-index: 2; cursor: pointer; transition: .5s;}
.ar3.prev1{ left: .3rem;}
.ar3.next1{ right: .3rem;}
.ar3 img{ height: .15rem; transition: .5s;}

@media(min-width: 769px){
    .ls3 .a:hover::before{ opacity: 1;}
    .ls3 .a:hover *{ color: #fff;}
    .ls3 .a:hover .time::before{background: url(../images/ls2_bs.png) center no-repeat;background-size: cover;}

    .more1w:hover img{transform: rotateY(180deg);}

    .ls5 .a:hover{ background: #005b30; border: #005b30 1px solid;}
    .ls5 .a:hover *{ color: #fff;}
    .ls5 .a:hover h6{ background: rgba(255,255,255,.1); }

    .ls6 .a:hover h6{ background: #005b30; border: #005b30 1px solid; color: #fff;}
    .ar2:hover img{ transform: rotateX(180deg);}

    .ar3:hover{ background: #005b30;}

    .more1:hover img{ transform: rotateY(180deg);}
    .ls2 li:hover{ border-bottom: #005b30 1px solid;}
}
@media(max-width: 1024px){
    .banner .imgBox .img{ padding-bottom: 50%; }
    
}

@media(max-width: 769px){
    .banner_box{ margin: .7rem 0 0;}
    .banner .bottom{ bottom: .25rem;}
    .ar3{transform: scale(.6) translateY(-100%);}
    .ar3.prev1{ left: 0;}
    .ar3.next1{ right: 0;}

    .banner .dots span{ transform: scale(.6);}
    
    .pad1{ padding: .4rem 0;}

    .tit1{ margin: 0 0 .25rem;}
    .tit1 .ll::before{ transform: translate(-50%, -50%) scale(.6);}
    .tit1 .ll h3 span{ font-size: .24rem;}
    .tit1 .ll h3 i{ width: .04rem; height: .04rem; margin: 0 .08rem;}

    .index1 .left{ width: 100%;}
    .index1 .right{ width: 100%; padding: .3rem 0 0;}
    .ls2 .a{ height: .9rem;}
    .dots1 span{ transform: scale(.6); margin: 0 !important;}
    .ls1 .bottom .txt .time{ width: .8rem;}

    .index2{padding: 0 0 35vw;}
    .ls3 li{width: 100%;margin-bottom: .15rem;}
    .ls3 .a{height: 1.1rem;padding: 0 .15rem;}
    .ls3 .time{ margin: 0 .1rem 0 0}

    .ls2{ margin: -.1rem 0;}

    .ls4Box .dots{ margin: .3rem 0 0;}
    .ls4 li.swiper-slide-active + li .a{ transform: translateY(0)}
    .ls4Box .dots span{transform: scale(.7);margin: 0 .02rem !important;}
    .ls4 .con{ padding: 0 15px;}
    .ls4 .txt{ height: 1.5rem;}

    .index3{background: url(../images/in3_b.png) center 11vw no-repeat;background-size: 100% auto;padding: 22vw 0 .4rem;margin: -24vw 0 0;}


    .index4 .left{ width: 100%;}
    .index4 .right{width: 100%;padding: .4rem 0 0;}

    .ls5{ margin: 0 -7px -.15rem;}
    .ls5 li{width: 100%;padding: 0 7px;margin-bottom: .15rem;}
    .ls5 .a{ height: 1.4rem}
    .ls5 .con{ padding: 0 15px;}
    .ls5 h6{padding: 0 .1rem 0 15px;margin: 0 0 .12rem;}
    .tit1 .ll h6 span{ font-size: .12rem}

    .ls6 li{ margin: 0 0 .15rem;}
    .index4 .fl2{ margin: .4rem 0 0;}

    .ar2{ width: .32rem; height: .32rem}
    .ar2 img{ height: .1rem}
    .ar2.prev1{ left: -.15rem}
    .ar2.next1{ right: -.15rem}
    .ls1 .bottom{flex-direction: column;margin: -.1rem 0 0;}
    .dots1{width: 100%;margin: .15rem 0 0;}

    .ls1 .bottom .txt{border-radius: 0;flex: auto;}
    .index3:before{content: "";position: absolute;right: 0;bottom: 0;left: 0;height: 4rem;background: #fff;z-index: -1;pointer-events: none;}
    .ls4 .a::before{ border: #cce0d6 1px solid;}
    .ls4 h4{ color: #323232 !important;}
    .ls4 h6{ background: url(../images/ls4_bs.png) center no-repeat;background-size: cover;color: #005b30;}
    .ls4 h6 i{ color: #005b30; }
    .ls4Box .dots span{ border: #005b30 solid 1px}
    .ls4Box .dots span:after{ background: url(../images/dots1_i.png) center no-repeat; background-size: cover;}

    .index4{ padding-top: 0;}
    .xiaoxun{max-width: 64%;left: 50%;top: 0;}
} 
@media(max-width: 560px){
} 
