@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.7) 100%);z-index: 1;height: 23vh;display: none;}
.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);
    }
}


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

.tit1{ align-items: center; margin-bottom: .35rem;}
.tit1 .ll{ align-items: flex-end;}
.tit1 .ll h3{font-size: .4rem;color: #333333;line-height: 1;}
.tit1 .ll font{ color: #c41c14;}
.tit1 .ll h6{font-size: .16rem;color: #666666;margin: 0 0 0 .36rem;background: url(../images/tit1.png) left bottom no-repeat;background-size: 100% 1px;line-height: 1.5;width: 2.34rem; display: flex; align-items: center;}
.tit1 .ll h6 span{ display: inline-block; width: .03rem; height: .03rem; background: #666; border-radius: 50vw; margin: 0 .07rem;}

.more1{font-size: .16rem;color: #c41c14;transition: .5s;white-space: nowrap;margin: 0 0 0 .1rem;}

.index1{ background: url(../images/in1_b.png) center bottom no-repeat; background-size: 100% auto; padding-bottom: 0 !important;}
.index1 .left{ width: 6.7rem; padding: .34rem 0 0;}
.index1 .right{ width: calc(100% - 6.7rem - .55rem); }

.slides1b, .slides3b{ overflow: visible;}

.slides .hd{margin: 0 0 .5rem;display: flex;align-items: center;justify-content: space-between;}
.slides .hd ul{ flex: 1; overflow: hidden}
.slides .hd li .a{display: inline-block;padding: 0 .25rem;line-height: .36rem;font-size: .2rem;color: #333333;}
.slides .hd li.on .a{ color: #fff; background: #c41c14; }

.ls1 .imgBox .img{ padding-bottom: 56.19%;}
.ls1 .txt{ text-align: center; padding: .2rem 0 0;}
.ls1 h6{ margin: .1rem 0 0;}

.ar2{ position: absolute; top: 50%; transform: translateY(-50%); width: .2rem; height: .36rem; background: #cfa972; justify-content: center; align-items: center; font-size: .15rem; color: #fff; font-family: 'lib'; transition: .5s; margin-top: -.4rem; cursor: pointer; z-index: 2;}
.ar2.prev1{ left: -.28rem;}
.ar2.next1{ right: -.28rem;}

.ls2 .a{ display: block; position: relative; overflow: hidden; }
.ls2 .imgBox .img{ padding-bottom: 53.99%;}
.ls2 .imgBox::after{ content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.4); z-index: 1; opacity: 1; transition: .5s;}
.ls2 .txt{ position: absolute; top: 0; left: 0; right: 0; bottom: 0; align-items: center; justify-content: center;}
.ls2 .txt i{ width: .9rem; height: .9rem; transition: .5s;}

.in2-3-4-5{ background: url(../images/in2-3-4-5.jpg) center bottom no-repeat; background-size: cover;}

.index2 .left{ width: 9rem;}
.index2 .right{ width: calc(100% - 9rem); }

.ls3Box .dots{position: absolute;z-index: 1;padding: 0 .24rem;bottom: .24rem;justify-content: flex-end;}
.ls3Box .dots span{ width: .06rem; height: .06rem; background: rgba(255,255,255,.4); opacity: 1; transition: .5s; border-radius: 50vw;}
.ls3Box .dots span.active{ opacity: 1; background: rgba(255,255,255,1); width: .26rem;}
.ls3 .a{ display: block; position: relative; overflow: hidden; }
.ls3 .imgBox .img{ padding-bottom: 53.55%;}
.ls3 .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, 1) 100%);z-index: 1;height: 1.5rem;}
.ls3 .txt{ position: absolute; top: 0; left: 0; right: 0; bottom: 0; align-items: center; justify-content: center;}
.ls3 .txt i{ width: .9rem; height: .9rem; transition: .5s;}

.ls4{height: 100%;flex-direction: column;/* justify-content: space-between; */}
.ls4 li{width: 100%;height: calc(20% - .04rem);margin: 0 0 .05rem;}
.ls4 li:last-child{ margin-bottom: 0}
.ls4 .a{height: 100%;align-items: center;padding: 0 .36rem;position: relative;z-index: 1;background: #fff;}
.ls4 .a::before{ content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: url(../images/ls4_b.jpg) center center no-repeat; background-size: cover; z-index: -1; opacity: 0; transition: .5s;}

.ls4 li.on .a::before{ opacity: 1;}
.ls4 li.on .a h4{ color: #fff;}

.index3{ padding-top: 0 !important;}
.index3 .left{ width: 7.8rem;}
.index3 .right{ width: calc(100% - 7.8rem - .6rem); }

.ls5 .imgBox .img{ padding-bottom: 61.66%;}
.ls5 .txt{ text-align: center; padding: .35rem 0 .25rem; border-bottom: #d8d8d8 1px solid;}

.ls6{ margin: -.15rem 0;}
.ls6 li{ border-bottom: #d8d8d8 1px solid;}
.ls6 .a{ padding: .15rem 0; align-items: center;}
.ls6 .imgBox{ width: 1.65rem; margin: 0 .28rem 0 0;}
.ls6 .imgBox .img{ padding-bottom: 56.36%;}
.ls6 .txt{ flex: 1; overflow: hidden;}
.ls6 p{ margin: .15rem 0 0;}

.ls6 li:last-child{ border-bottom: none}

.tit1c{ justify-content: center; position: relative;}
.tit1c .ll{flex-direction: column;align-items: center;}
.tit1c .ll h6{width: auto;margin: .15rem 0 0 .2rem;}
.tit1c .more1{ position: absolute; top: 50%; transform: translateY(-50%); right: 0; transition: .5s;}

.index4{ padding: 0 !important;}

.ls7W{ position: relative;}
.ls7Box{ padding: .5rem 0;}
.ls7 .imgBox .img{padding-bottom: 144.69%;}
.ls7 .imgBox::after{ content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.5); z-index: 1; opacity: 1; transition: .5s;}
.ls7 .txt{ text-align: center; padding: .2rem 0 0; opacity: 0; transition: .5s;}
.ls7 h4{ color: #bd0d0d; font-weight: bold;}
.ls7 p{ margin: .1rem 0 0;}

.ls7 li.swiper-slide-active .a .imgBox::after{ opacity: 0;}
.ls7 li.swiper-slide-active .txt{ opacity: 1;}

.ar3{ position: absolute; top: 50%; transform: translateY(-50%); width: .28rem; height: .5rem; background: #cfa972; justify-content: center; align-items: center; font-size: .15rem; color: #fff; font-family: 'lib'; transition: .5s; margin-top: -.4rem; cursor: pointer; z-index: 2;}
.ar3.prev1{ left: 2.5%;}
.ar3.next1{ right: 2.5%;}

.index5{ padding: 0; position: relative; z-index: 1;}
.index5::before{ content: ""; position: absolute; height: 1.25rem; left: 0; right: 0; bottom: 0; background: #fff; z-index: -1; transition: .5s;}

.ls8W{ position: relative; padding: 0 .75rem;}
.ls8W .ar3{ margin-top: 0;}
.ls8W .ar3.prev1{ left: 0;}
.ls8W .ar3.next1{ right: 0;}
.ls8Box{ padding: .5rem .2rem; margin: 0 -.2rem;}

.ls8 .a{ position: relative; overflow: hidden; box-shadow: .12rem .2rem .15rem rgba(142, 6, 0, 0.1); background: #fff; align-items: center;}
.ls8 .imgBox{ width: 3.53rem;}
.ls8 .imgBox .img{ padding-bottom: 68.83%;}
.ls8 .txt{ flex: 1; overflow: hidden; padding: 0 .24rem;}
.ls8 p{ margin: .08rem 0 0;}

.ls9{ justify-content: space-around;}
.ls9 li{ text-align: center;}
.ls9 .ico{width: 1.55rem;height: 1.55rem;background: #eeeeee;border-radius: .2rem;display: flex;justify-content: center;align-items: center;font-size: .8rem;color: #bf0700;font-family: 'lib';transition: .5s;position: relative;margin: 0 auto;}
.ls9 .ico img{ position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; object-fit: cover; transition: .5s; opacity: 0; border-radius: .2rem; transform: scale(.9);}
.ls9 h4{ margin: .3rem 0 0; font-weight: bold;}

.ls9 li:nth-child(3) .ico{ font-size: .7rem;}

.ls9 .a:hover .ico{ background: #c41c14; color: #fff;}
.ls9 .a:hover .ico img{ opacity: 1;}

@media(min-width: 769px){
    .ar2:hover, .ar3:hover{ background: #c41c14;}

    .ls2 .a:hover .txt i{ transform: rotate(120deg);}
}
@media(max-width: 769px){
    .banner .imgBox .img{ padding-bottom: 50%;}

    .pad1{ padding: .4rem 0;}

    .tit1{ margin-bottom: .25rem;}
    .tit1 .ll h3{font-size: .24rem;}
    .tit1 .ll h6{font-size: .13rem;margin: 0 0 0 .15rem;width: auto;}

    .index1 .left{ padding: 0; width: 100%;}
    .slides .hd li .a{font-size: .15rem;padding: 0 .06rem;}
    .slides .hd{ margin: 0 0 .25rem;}

    .ar2.prev1{ left: 0}
    .ar2.next1{ right: 0}

    .index1 .right{width: 100%;padding: .3rem 0 0;}
    .ls1 h6{ margin: .06rem 0 0;}
    .ls2 .txt i{ width: .5rem; height: .5rem; transition: .5s;}
    .index1{ padding-bottom: .2rem !important;}

    .index2 .left{ width: 100%;}
    .index2 .right{ width: 100%;}
    .ls3 .txt i{ width: .5rem; height: .5rem; transition: .5s;}

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

    .ls4 .a{ height: .5rem;}
    .ls6 .imgBox{ width: 1.65rem; margin: 0 .2rem 0 0;}

    .ls7Box{ padding: .15rem 0;}

    .ls8W{ padding: 0;}

    .ls8 .imgBox{ width: 100%;}
    .ls8 .txt{ padding: .25rem .2rem; width: 100%;}
    .ls8Box{padding: 0 .1rem;margin: 0 -.1rem;overflow: visible;}
    .index5{ padding: .2rem 0 .3rem;}

    .ls9 li{ width: 33.33%; margin-bottom: .2rem}
    .ls9 .ico{width: 20vw;height: 20vw;font-size: .4rem;}
    .ls9 li:nth-child(3) .ico{ font-size: .35rem;}
    .ls9 h4{ margin: .1rem 0 0; font-weight: bold;}
} 
@media(max-width: 560px){
}