@charset "utf-8";

body.index{background: url(../images/index.jpg) center top no-repeat;background-size: 100% auto;padding: 37.66vw 0 0;}

.more0{ width: 100%; height: 37.66vw; display: block; position: absolute; top: 0; left: 0; right: 0;}

.more1{ position: absolute; top: .54rem; right: .32rem;  width: 1.35rem; height: .36rem; align-items: center; justify-content: center; border: #fff 1px solid; border-radius: .16rem; font-size: .18rem; color: #fff !important; transition: .5s;}

.nav{height: 1.9rem;position: sticky;top: -4vw;z-index: 1000;}
.navBox{position: relative;z-index: 1;padding: 6vw 0 0;height: 100%;}
.navBox::before{content: "";position: absolute;top: 0;left: 0;right: 0;height: 12.65625vw;background: url(../images/nav.png) center no-repeat;background-size: 100% 100%;z-index: -1;pointer-events: none;transition: .5s;}
.nav ul{ justify-content: center; }
.nav li{ padding: 0 .48rem; position: relative; text-align: center}
.nav li::before{content: "";position: absolute;background: url(../images/dots.png) center no-repeat;width: .15rem;height: .1rem;background-size: cover;top: .12rem;right: -.075rem;}
.nav h3{font-size: .3rem;color: #000000;font-family:'cangjigaodeguomiaohei';font-weight:  normal;transition: .5s;position: relative;z-index: 1;}
.nav h3:before{content: "";position: absolute;width: .68rem;height: .68rem;background-image: linear-gradient( 53deg, rgba(194,166,101,0) 0%, rgb(194,166,101) 100%);border-radius: 50vw;top: 50%;right: -.2rem;transform: translateY(-.34rem); opacity: 0;transition: .5s;}
.nav h6{font-size: .14rem;color: #c2a665;font-family:'cangjigaodeguomiaohei';opacity: 0;transition: .5s;margin: .02rem 0 0;}

.nav li:last-child:before{ display: none;}

.nav.on .navBox:before{overflow: hidden;height: 100%;background: #fff;box-shadow: 0 0 .2rem rgba(0,0,0,.1);}

.nav li.on h3{ color: #b80000;}
.nav li.on h3:before{ opacity: 1;}
.nav li.on h6{ opacity: 1;}

.pad1{ padding: .6rem 0; overflow: hidden;}

.tit1{ margin-bottom: .66rem;}
.tit1 img{ height: 1.01rem}

.index1{background: url(../images/index1_b.jpg) center bottom no-repeat;background-size: 100% auto;}
.index1 .left{width: calc(100% - 6.98rem - 9vw);position: relative;z-index: 2;}
.index1 .right{ width: 6.98rem; padding: .7rem .5rem 0;}

.ls1{ margin: .54rem -.15rem .8rem;}
.ls1 li{ padding: 0 .15rem; text-align: center; flex: 1;}
.ls1 h3 big{ font-size: .58rem; color: #b80000; font-family: 'Barlow Condensed SemiBold';}
.ls1 h3 small{ font-size: .2rem; color: #b80000; margin: 0 0 0 .04rem;}
.ls1 h6{ font-size: .16rem; color: #333333; line-height: 1.625;}

.ls2Box{ overflow: visible; position: relative; z-index: 1;}
.ls2Box:before{content: "";position: absolute;top: -.48rem;right: -.3rem;left: -.3rem;bottom: 0;border: #dcd9d2 1px dashed;border-radius: 50vw;}
.ls2Box .bg{position: absolute;left: 0;right: 0;bottom: 0;transform: scale(2.02);transform-origin: 64% 94%;z-index: -1;max-height: none;}
.ls2Box .bg img{ width: 100%;}
.ls2Box .dots span{position: absolute;width: .1rem;height: .1rem; border-radius: 50vw;opacity: 1;margin: -.05rem 0 0 -.05rem !important; position: absolute; background: none; z-index: 3;}
.ls2Box .dots span::before{ content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; border-radius: 50vw; transition: .5s; background: #908e8b;}
.ls2Box .dots span::after{content: "";position: absolute;top: 50%;left: 50%;border-radius: 50vw;transition: .5s;border: rgba(184,0,0,0) 1px solid;transform: scale(.5);width: .66rem;height: .66rem;margin: -.33rem 0 0 -.33rem;}
.ls2Box .dots span:nth-child(1){left: -2.8%;top: 31%;}
.ls2Box .dots span:nth-child(2){left: 10.8%;top: 7.9%;}
.ls2Box .dots span:nth-child(3){left: 37%;top: -6.6%;}
.ls2Box .dots span:nth-child(4){left: 64%;top: -6.4%;}
.ls2Box .dots span:nth-child(5){left: 90%;top: 8.9%;}
.ls2Box .dots span:nth-child(6){left: 102.8%;top: 31%;}

.ls2Box .dots span.active::before{ background: #b80000; transform: scale(1.4);}
.ls2Box .dots span.active::after{ transform: scale(1); border: rgba(184,0,0,.3) 1px solid;}

.ls2 .imgBox{ border-radius: 50%; }
.ls2 .imgBox .img{ padding-bottom: 100%; background: none;}

.tit1c{ justify-content: center;}

.index2{background: url(../images/index2_b.jpg) center no-repeat;background-size: 100% auto; padding-top: 0 !important;}
.index2 .left{width: calc(100% - 6.78rem - 4.02rem - .64rem);align-self: center;}
.index2 .center{ width: 6.78rem;}
.index2 .right{ width: 4.02rem;}

.ls3{padding-bottom: .2rem;border-bottom: #e6e6e6 1px solid;margin-bottom: .2rem;}
.ls3 p{ margin: .12rem 0 0}

.ls4 .a{ align-items: center}
.ls4 li{margin: .17rem 0 0;}
.ls4 .time{ width: .58rem; height: .58rem; background: #f0e6dc; border-radius: 50vw; display: flex; align-items: center; justify-content: center; font-size: .16rem; color: #b80000; margin: 0 .2rem 0 0; transition: .5s;}
.ls4 .txt{ flex: 1; overflow: hidden}

.ls5 .imgBox{ border-radius: 1.5625vw 1.5625vw 0 0;}
.ls5 .imgBox .img{ padding-bottom: 75.07%;}
.ls5 .txt{height: 1.28rem;background: #ba985b;border-radius: 0 0 1.5625vw 1.5625vw;padding: 0 .26rem;display: flex;flex-direction: column;justify-content: center;}
.ls5 h4{ color: #fff !important;}
.ls5 h6{ color: #fff; margin: .1rem 0 0;}

.ls6 .imgBox{ border-radius: 1.5625vw}
.ls6 .imgBox .img{ padding-bottom: 75.18%;}
.ls6 .txt{ padding: .2rem 0 0;}
.ls6 h6{ margin: .15rem 0 ;}

.arrow1{ justify-content: flex-end; align-items: center; margin-top: .3rem;}
.arrow1 .arrow{width: .43rem;height: .43rem;position: relative;z-index: 1;margin: 0 0 0 .12rem;font-size: .3rem;color: #c2a665;font-family: 'lib';cursor: pointer;display: flex;align-items: center;justify-content: center;padding-bottom: .05rem;transition: .5s; border-radius: 50vw;}
.arrow1 .arrow::after{ content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; border-radius: 50vw; border: #c2a665 1px dashed; transition: .5s; z-index: -1; animation: roted 10s linear infinite;}

.index3{ position: relative; z-index: 2;}
.index3 .content{ filter: drop-shadow(0 .24rem .2rem rgba(85, 13, 4, 0.17)); position: relative; z-index: 1}
.index3 .content::before{content: "";position: absolute;background: url(../images/index3.png) center bottom no-repeat;background-size: 100% auto;top: 0;right: 0;bottom: 0;left: 0;z-index: -1;transform: translateY(3.18vw);}
.index3 .content .imgBox .img{padding-bottom: 39.53125%;-webkit-mask: url(../images/index3_b.png);mask: url(../images/index3_b.png); mask: none \0; -webkit-mask-size: cover;mask-size: cover;mask: none \0;background: #000;}
.index3 .content .imgBox .img img{opacity: .9;}
.index3 .content .top{ position: absolute; top: .5rem; right: 0; left: 0;}

.more5{width: 1.68rem;height: .5rem;background: #b80000;border-radius: 50vw;align-items: center;justify-content: center;position: absolute;left: 50%;top: 52%;z-index: 10;font-size: .2rem;color: #fff !important;transform: translateX(-50%);transition: .5s;opacity: 0;visibility: hidden;}

.more5.on{ opacity: 1; visibility: visible;}

.ls7Box{position: relative;z-index: 2;margin: -15.583vw -.3rem 0;padding: .4rem .3rem;}

.ls7 .a{ display: block;}
.ls7 li .a{ margin: 7.29vw 0 0; transition: .5s;}
.ls7 li.swiper-slide-prev .a{margin: 3.75vw 0 0;transform: scale(1.2) translateX(-25px);}
.ls7 li.swiper-slide-active .a{margin: 1vw 0 0;transform: scale(1.52);position: relative;}
.ls7 li.swiper-slide-active .a:before{ content: ""; position: absolute; top: -.015rem; right: -.015rem; bottom: -.015rem; left: -.015rem; background-image: linear-gradient( 90deg, #f1c255 45%, #fbeec1 100%); border-radius: 1.3vw;}
.ls7 li .imgBox .img img{opacity: .6; }
.ls7 li.swiper-slide-active .imgBox .img img{ opacity: 1;}
.ls7 li.swiper-slide-next .a{margin: 3.75vw 0 0;transform: scale(1.2) translateX(25px);}
.ls7 li.swiper-slide-next + li .a{ margin: 7.29vw 0 0;}
.ls7 .imgBox{border-radius: 1.3vw;box-shadow: 0 .16rem .3rem 0px rgba(116, 14, 1, 0.2);}
.ls7 .imgBox .img{ padding-bottom: 54.78%; background: #000}

.ls8Box{margin: -.2rem auto 0;width: 11.2rem;max-width: 100%;padding: 0 .94rem;}
.ls8Box p{ color: #333; line-height: 2;}

.arrow2 .arrow{width: .44rem;height: .44rem;position: absolute;top: 50%;transform: translateY(-50%);z-index: 1;font-size: .3rem;color: #c2a665;font-family: 'lib';cursor: pointer;display: flex;align-items: center;justify-content: center;padding-bottom: .05rem;transition: .5s;border-radius: 50vw;}
.arrow2 .arrow::after{ content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; border-radius: 50vw; border: #c2a665 1px dashed; transition: .5s; z-index: -1; animation: roted 10s linear infinite;}
.arrow2 .arrow.prev{ left: 0;}
.arrow2 .arrow.next{ right: 0;}

.index4{ background: url(../images/index4_b.png) center top no-repeat;background-size: 100% auto; margin: -4.5vw 0 0; padding-top: 1.1rem;}
.index4 .tit1{ margin-bottom: .3rem;}
.index4 .content{ align-items: center}
.index4 .left{ width: 15.91vw;}
.index4 .left .box{width: 31.82vw;padding: 3.125vw;position: relative;z-index: 1;transform: translateX(-50%);}
.index4 .left .box::after{ content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; border: #908e8b 1px dashed; z-index: -1; opacity: .58; border-radius: 50vw; animation: roted 80s infinite linear;}
.index4 .left .box::before{content: "";position: absolute;top: 0;right: 0;bottom: 0;left: 0;background: #f2e7df;z-index: -1;border-radius: 50vw;transform: scale(.86);}
.index4 .left .imgBox{ border-radius: 50vw;}
.index4 .left .imgBox .img{ padding-bottom: 100%;}
.index4 .right{ width: calc(100% - 15.91vw);}

.ls9W{margin: 0 0 0 -7.2vw;}
.ls9Box{ height: 5.9rem;}
.ls9 .a{ height: 1.18rem; align-items: center; position: relative; z-index: 1; padding: 0 calc((100vw - 16rem)/2) 0 0; transition: .5s}
.ls9 .a::before{content: "";position: absolute;top: 0;right: 0;bottom: 0;left: 0;background-image: linear-gradient( 90deg, rgba(242,231,223,0) 20%, rgb(242,231,223) 100%);transition: .5s;z-index: -1;opacity: 0;}
.ls9 .dots{ width: .54rem; height: .54rem; position: relative; margin: 0 .26rem 0 0; display: flex; justify-content: center; align-items: center;}
.ls9 .dots::before{ content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; border-radius: 50vw; border: #9d0000 1px solid; transition: .5s; z-index: -1; transform: scale(.5); opacity: 0}
.ls9 .dots::after{content: "";position: absolute;width: .1rem;height: .1rem;background: #908e8b;border-radius: 50%;transition: .5s;left: 50%;top: 50%;margin: -.05rem 0 0 -.05rem;}
.ls9 .time h6{ font-size: .16rem; color: #c2a665; transition: .5s;}
.ls9 .time h3{font-size: .32rem;color: #c2a665;line-height: 1; transition: .5s;}
.ls9 .time h3 span{ font-size: .16rem; margin: 0 .02rem}
.ls9 .line{position: relative;width: .72rem;height: 1px;background: #cecece;margin: 0 .35rem 0 .24rem;transition: .5s;}
.ls9 .line:before{content: "";position: absolute;border-left: #9d0000 .09rem solid;border-top: transparent .055rem solid;border-bottom: transparent .055rem solid;left: 100%;top: 50%;transform: translateY(-.055rem);transition: .5s;opacity: 0;}
.ls9 .txt{ flex: 1; overflow: hidden; align-items: center;}
.ls9 h4{ width: 5.26rem; margin: 0 .44rem 0 0; font-weight: 600;}
.ls9 p{ flex: 1; overflow: hidden;}
.ls9 .imgBox{width: 2.26rem;border-radius: .1rem;position: absolute;top: .1rem;left: 3rem;opacity: 0;visibility: hidden;box-shadow: 0px 1px .2rem 0px rgba(116, 14, 1, 0.2);border: #fff .05rem solid;}

.ls9 li.swiper-slide-prev .a{ transform: translateX(4.5vw)}
.ls9 li.swiper-slide-active .a{ transform: translateX(5.76vw)}
.ls9 li.swiper-slide-active .a::before{ opacity: 1}
.ls9 li.swiper-slide-next .a{ transform: translateX(4.5vw)}

.index5{ position: relative; z-index: 1;}
.index5 .bg1{ position: absolute; top: .56rem; left: 0; width: 100%; z-index: -1;}
.index5 .bg2{ position: absolute; bottom: 0; right: 0; width: 100%; z-index: -1;}
.index5 .wp.flexjs{align-items: flex-end;}
.index5 .box1{ width: 24.25%;}
.index5 .box2{ width: 18.5%;}
.index5 .box3{ width: 23.625%;}
.index5 .box4{ width: 30.0625%;}

.index5 .box1 .ls10{ display: flex; flex-direction: column; align-items: flex-end;}
.ls10 li{width: 100%;margin-bottom: 1vw;}
.ls10 .a{ display: block; position: relative}
.ls10 .a:before{content: "";position: absolute;top: -.02rem;right: -.02rem;bottom: -.02rem;left: -.02rem;background-image: linear-gradient( 90deg, #f1c255 45%, #fbeec1 100%);border-radius: 1.04vw;opacity: 0;transition: .5s}
.ls10 .imgBox .img{/* background: #000; */}
.ls10 .a:after{content: "";background: url(../images/ls7_v.png) center no-repeat;position: absolute;top: 0;right: 0;bottom: 0;left: 0;background-size: .43rem auto;pointer-events: none;opacity: 0;transition: .5s}
.ls10 .imgBox{border-radius: 1.04vw;}

.index5 .box1 .ls10 li:nth-child(1){ width: 67.78%;}
.index5 .box4 .ls10 li:nth-child(2){ width: 66.94%;}

.index5 .box1 .ls10 li:nth-child(1) .imgBox .img{ padding-bottom: 62.5%}
.index5 .box1 .ls10 li:nth-child(2) .imgBox .img{ padding-bottom: 73.19%}
.index5 .box2 .ls10 li:nth-child(1) .imgBox .img{ padding-bottom: 135.13%}
.index5 .box2 .ls10 li:nth-child(2) .imgBox .img{ padding-bottom: 44.25%}
.index5 .box3 .ls10 li:nth-child(1) .imgBox .img{padding-bottom: 145.29%;}
.index5 .box4 .ls10 li:nth-child(1) .imgBox .img{padding-bottom: 73.5%;}
.index5 .box4 .ls10 li:nth-child(2) .imgBox .img{padding-bottom: 54.72%;}

footer{ background: url(../images/footer_b.jpg) center top no-repeat; background-size: cover; }
footer .fl1{padding: .6rem .2rem;background: url(../images/footer_b1.png) center bottom no-repeat;background-size: 100% auto;}
footer .fl1{align-items: center;}
footer .fl1 .left{ width: 3.4rem; max-width: 21.8%;}
footer .fl1 .center{ width: 3.79rem; max-width: 24.3%;}
footer .fl1 .right{ width: 3.4rem;}
.ls11{ justify-content: flex-end;}
.ls11 li{ margin: 0 .25rem 0 0; position: relative;z-index: 1;cursor: pointer;}
.ls11 .a{ width: .36rem; height: .36rem; border: #f8e199 1px solid; border-radius: .05rem; justify-content: center; align-items: center; font-size: .2rem; color: #f8e199; transition: .5s; font-family: 'lib';}
.ls11 .a:after{content: "";position: absolute;top: 0;left: 0;right: 0;bottom: 0;background-image: linear-gradient(90deg, #f1c255 45%, #fbeec1 100%);z-index: -1;transition: .5s;border-radius: .05rem;; opacity: 0}
.ls11 .a img{width: .69rem;height: .69rem;position: relative;z-index: 1;transition: all 0.5s; }
.ls11 li .ewm{width: .9rem;background: #fff;border-radius: .06rem;position: absolute;padding: 0;top: 120%;left: 50%;margin-left: -.45rem;z-index: 1;opacity: 0;visibility: hidden;transition: all 0.5s;transform: translateY(.1rem);box-shadow: 0 0 0.3rem rgba(0,0,0,.2);}
.ls11 li .ewm:before{content: "";position: absolute;width: .07rem;height: .07rem;background: #fff;transform: rotate(45deg);top: -.035rem;left: 50%;margin-left: -.035rem;}
.ls11 li .ewm img{width: 100%;border-radius: 0.06rem;}

.ls11 li:hover .a{ color: #9d0000}
.ls11 li:hover .a:after{ opacity: 1}
.ls11 li:hover .a img{ opacity: 1}
.ls11 li:hover .ewm{ opacity: 1; visibility: visible; transform: translateY(0)}
footer .fl2{ border-top: #b84538 1px solid; padding: .2rem 0; text-align: center;}
footer .fl2 p{ font-size: .16rem; color: #fbeec1; line-height: 1.35;}

@media(min-width: 1024px){
    .more5:hover{ background: #ba985b;}
    .more1:hover{ background: #ba985b; border: #ba985b 1px solid; }
    
    .arrow1 .arrow:hover{ background: #b80000; color: #fff;}
    .arrow1 .arrow:hover::after{ opacity: 0;}

    .ls4 .a:hover .time{ background: #b80000; color: #fff;}

    .ls9 li:hover{ z-index: 10}
    .ls9 li:hover .a .imgBox{ opacity: 1; visibility: visible}
    .ls9 li.swiper-slide-next + li .a .imgBox{ display: none;}
    .ls9 li:hover *{ color: #9d0000}
    .ls9 li:hover .line{ background: rgba(157,0,0,.4); }
    .ls9 li:hover .line:before{ opacity: 1}
    .ls9 li:hover .dots::before{ transform: scale(1); opacity: .5}
    .ls9 li:hover .dots::after{ transform: scale(1.3); background: #9d0000; }

    .ls10 .a:hover .imgBox .img img{ opacity: .5}
    .ls10 .a:hover:before, .ls10 .a:hover:after{ opacity: 1}
    .ls10 .a:hover .imgBox .img{ background: #000}

    .arrow2 .arrow:hover{ background: #b80000; color: #fff;}
    .arrow2 .arrow:hover::after{ opacity: 0;}
}
@media(max-width: 1024px){
    footer .fl1{padding: .6rem 5%;}

    .ls7 li.swiper-slide-prev .a{ transform: scale(1) translateX(-25px);}
    .ls7 li.swiper-slide-next .a{ transform: scale(1) translateX(25px);}
}
@media(max-width: 800px){
}
@media(max-width: 769px){
    .more1{right: .15rem;top: .15rem;width: 1rem;font-size: .16rem;}

    .nav{height: .8rem;top: -3vw;}
    .nav h3{font-size: .16rem;}
    .nav li{padding: 0 2vw;}
    .nav li:before{ display: none}
    .nav h3:before{width: .2rem;height: .2rem;right: -0.1rem;transform: translateY(-0.2rem);}
    .nav h6{ font-size: .12rem}

    .nav.on{ background: #fff}

    .index1 .left{ width: 100%;}
    .index1 .right{width: 3rem;margin: 0 auto;}

    .tit1{ margin-bottom: .3rem}
    .tit1 img{ height: .5rem}

    .pad1{ padding: .3rem 0}

    .ls1{margin: .3rem -.1rem .1rem;}
    .ls1 li{ padding: 0 .1rem; }
    .ls1 h3 big{ font-size: .36rem;}
    .ls1 h6{ font-size: .14rem; line-height: 1.5;}
    .ls1 h3 small{ font-size: .16rem;}

    .index2 .left{ width: 100%;}
    .index2 .center{ width: 100%; margin: .3rem 0}
    .index2 .right{ width: 100%;}

    .ls4 .time{ width: .46rem; height: .46rem}
    .ls4 li{margin: .12rem 0 0;}

    .ls7 li.swiper-slide-prev .a{ transform: scale(.8) translateX(0);}
    .ls7 li.swiper-slide-active .a{ transform: scale(1.25);}
    .ls7 li.swiper-slide-next .a{ transform: scale(.8) translateX(0);}
    .index3 .content .top{top: 0;}
    .ls7Box{padding: .2rem .3rem .3rem;}

    .ls8Box{ padding: 0 .6rem}

    .index4 .left{ display: none;}
    .index4 .right{width: 100%;padding: 0 0 0 15px;}
    .ls9W{ margin: 0}
    
    .ls9 .dots{ display: none;}

    .ls9 li.swiper-slide-prev .a{ transform: translateX(0)}
    .ls9 li.swiper-slide-active .a{ transform: translateX(0)}
    .ls9 li.swiper-slide-next .a{ transform: translateX(0)}
    .ls9 .time h3{font-size: .2rem;}
    .ls9 .line{ display: none;}
    .ls9 p{ display: none;}
    .ls9 .time{ margin: 0 .2rem 0 0;}
    .ls9Box{height: 2.8rem;}
    .ls9 h4{margin: 0 15px 0 0;}
    .ls9 .a{ height: 100%;}
    .index5{padding-top: 0 !important;padding-bottom: .4rem;}

    footer .fl1 .left{width: 100%;max-width: 100%;padding: 0 30%;}
    footer .fl1 .center{width: 100%;max-width: 100%;padding: .2rem 36%;}
    footer .fl1 .right{ width: 100%}

    .ls11{justify-content: center;}
    .ls11 li{ margin: 0 .1rem}

    footer .fl1{padding: .3rem 5% .6rem;}

    .index3{ padding-top: 0;}

    .ls2Box .dots span:nth-child(1){left: -14.8%;top: 31%;}
    .ls2Box .dots span:nth-child(2){left: -7.2%;top: 7.9%;}
    .ls2Box .dots span:nth-child(3){left: 8%;top: -10.6%;}
    .ls2Box .dots span:nth-child(4){left: 36%;top: -22.4%;}
    .ls2Box .dots span:nth-child(5){left: 66%;top: -22.1%;}
    .ls2Box .dots span:nth-child(6){left: 91.8%;top: -10%;}
    .ls2Box .dots span::after{  width: .4rem; height: .4rem; margin: -.2rem 0 0 -.2rem}

    .ls7 li.swiper-slide-active:after{ background-size: .28rem auto !important;}

    .index5 .box1{ width: 48%;}
    .index5 .box2{ width: 48%;}

    .index5 .box3{ width: 48%;}
    .index5 .box4{width: 48%;align-self: flex-start;}
    .ls10 li{ margin-bottom: 3vw;}

    .index5 .bg1{top: 24vw;}
    .index5 .bg2{bottom: 6vw;}

    .more5{ width: .86rem; height: .3rem; font-size: .14rem; top: 42%}
} 
@media(max-width: 560px){
} 