@charset "utf-8";
/* ===================首页样式========================== */
.banner{position: relative;}
.banner .hasVideo .banner-img img.pc{animation: hasVideoImg 1s ease both;}
@keyframes hasVideoImg {0%{opacity: 1;}100%{opacity: 0;}}
.banner video{width: 100%;height: 100%;object-fit: cover;position: absolute;top: 0;left: 0;}
@media all and (max-width:1151px) {.hasVideo .banner-img img.pc{animation: none;}.hasVideo video{display: none;}}
.banner-bg{position: relative;}
.banner-bg::after{content: "";position: absolute;left: 0;top: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, .1);}
.banner-bg img{width: 100%;height: 100vh;}
.banner-con{z-index: 98; position: absolute;left: 0;top: 0;width: 100%;height: 100%;align-items: center;}
.banner-pagination{z-index: 99; bottom: 50px;position: absolute;left: 50%;transform: translateX(-50%);z-index: 10;}
.banner-pagination .swiper-pagination-bullet{width: 6px;height: 6px;background: #fff;opacity: 1;position: relative;margin: 0 22px !important;transition: all .4s ease;}
.banner-pagination .swiper-pagination-bullet i{position: absolute;width: 24px;height: 24px;margin: -12px 0 0 -12px;top: 50%;left: 50%;opacity: 0;transition: all .4s ease;border-radius: 50%;border: 2px solid rgba(255, 255, 255, 0.5);}
.banner-pagination .swiper-pagination-bullet svg{position: absolute;z-index: 2;left: 50%;top: 50%;margin: -12px 0 0 -12px;width: 24px;height: 24px;transform: rotate(-90deg);opacity: 0;transition: all .4s ease;}
.banner-pagination .swiper-pagination-bullet svg circle{stroke-dasharray:100,100;stroke-dashoffset:100;}
.banner-pagination .swiper-pagination-bullet-active i{opacity: 1;}
.banner-pagination .swiper-pagination-bullet-active svg{opacity: 1;}
.banner-pagination .swiper-pagination-bullet-active svg circle{animation: bulletRun 6s linear both;}
.banner-pagination .swiper-pagination-bullet-active.oneBullet svg circle{animation: bulletRun 5s linear both;}
@keyframes bulletRun{0%{stroke-dashoffset:100;}100%{stroke-dashoffset:0;}}
/* .banner-svg{position: relative;display: flex;justify-content: center;}
.banner-svg svg{width: 850px;}
.banner-svg path{fill:none;stroke:#FFFFFF;stroke-width:1.5;stroke-miterlimit:10;}
.banner-svg .clip-mask rect{transform: translateX(-100%);}
.banner-svg .clip-mask.active rect{transform: translateX(-120%) scaleX(0.5) skew(-40deg);animation: BannerRun 4s ease both;}
.banner-svg .clip-mask.on rect{transform: translateX(0%);transition: all 2s ease;}
@keyframes BannerRun {0%{transform: translateX(-120%) scaleX(0.5) skew(-40deg);}100%{transform: translateX(70%) scaleX(0.4) skew(-40deg);}} */

.banner-svg{position: relative;display: flex;justify-content: center;}
.banner-svg svg{width: 850px;}
.banner-svg path{fill:none;stroke:#FFFFFF;stroke-width:1.5;stroke-miterlimit:10;}
.banner-svg .clip-mask rect{transform: translateX(-120%);}
.banner-svg .clip-mask.active rect{transform: translateX(-120%) scaleX(0.5) skew(-40deg);animation: BannerRun 4s ease both;}
.banner-svg .clip-mask.on rect{transform: translateX(70%) scaleX(0.4) skew(-40deg);transition: all 2s ease;}
@keyframes BannerRun {0%{transform: translateX(-120%) scaleX(0.5) skew(-40deg);}100%{transform: translateX(70%) scaleX(0.4) skew(-40deg);}}


.indAb{height: 100vh;}
.indAb-con{position: relative;z-index: 99;flex-direction: column;max-width: 1100px;margin: 0 auto;}
.indAb-img{position: absolute;left: 0;top: 0;width: 100%;height: 100%;z-index: 98;}
.indAb-img img{height: 100%;width: 100%;}
.indAb-img li{position: absolute;overflow: hidden;}
.indAb-img li:nth-child(1){left: 10vw;top: 2vw;width: 13.5vw;height: 8vw;}
.indAb-img li:nth-child(2){right: 0;top: 8.5vw;width: 21vw;height: 15.5vw;}
.indAb-img li:nth-child(3){left: 0;top: 22vw;width: 12.5vw;height: 17vw;}
.indAb-img li:nth-child(4){right: 13.5vw;bottom: -2vw;width: 10vw;height: 13.5vw;}
.indAb-img .marsk{background: #ede9e4;position: absolute;}
.indAb-img li:nth-child(1) .marsk{left: 0;top: 0;width: 100%;height: 100%;}
.indAb-img li:nth-child(2) .marsk{left: 0;top: 0;width: 100%;height: 100%;}
.indAb-img li:nth-child(3) .marsk{right: 0;top: 0;width: 100%;height: 100%;}
/* .indAb-img li:nth-child(4) .marsk{left: 0;bottom: 0;width: 100%;height: 100%;} */
.abMarskW{animation: abMarskW 1.5s ease forwards;position: absolute;}
.abMarskH{animation: abMarskH 1.5s ease forwards;position: absolute;}
@keyframes abMarskW {
    0%{width: 100%;}
    100%{width: 0;}
}
@keyframes abMarskH {
    0%{height: 100%;}
    100%{height: 0;}
}
.indLine{position: absolute;left: 9%;bottom: 0;width: 87%;}
.indPro .marsk{position: absolute;left: 0;top: 0;width: 100%;height: 100%;background: #222;z-index: 10;}
.indPro-swp{padding: 0 100px;}
.indPro-swp .swiper-container{overflow: visible;}
.indPro-img{height: 500px;}
.indPro-img .img{width: 100%;overflow: hidden;}
.indPro-img .img::after{content: "";position: absolute;left: 0;top: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, .5);transition: all .4s ease;}
.indPro-img img{width: 100%;height: 440px;transition: all .8s ease;}
.indPro-img:hover img{transform: scale(1.08);}
.indPro-title{opacity: 0;transform: translateX(100px);transition: all .8s ease;}
.swiper-slide-active .indPro-img img{height: 500px;}
.swiper-slide-active .indPro-img .img::after{opacity: 0;}
.swiper-slide-active .indPro-title{opacity: 1;transform: translateX(0); transition-delay: .5s;}
.indPro-btn{z-index: 2;position: absolute;top: 250px;user-select: none;cursor: pointer;}
.indPro-btn.prev{left: 0;}
.indPro-btn.next{right: 0;transform: rotate(180deg);}
.indPro-btn:hover{color: #ffec87;}
.indPro-pagination{position: relative !important;background: #3c3e3d !important;height: 1px;margin-top: 40px;}
.indPro-page{display: flex;align-items: center; color: #4e504f;position: absolute;right: 100px;z-index: 2;bottom: 40px;}
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background: #ffec87 !important;}
.indCase{background: #222;}
.indCase-bg{overflow: hidden;}
.indCase-bg::after{content: "";position: absolute;left: 0;top: 0;width: 100%;height: 100%;background: linear-gradient(to bottom,transparent 0%,rgba(0,0,0,.8));}
.indCase-bg img{width: 100%;height: 900px;transition: all 1.2s linear;}
.indCase-slide:hover .indCase-bg img{transform: scale(1.04);}
.indCase-con{position: absolute;left: 0;top: 0;width: 100%;height: 100%;padding-bottom: 80px;display: flex;align-items: flex-end;}
.indCase-con-item{width: 570px; transform: translateY(100px);transition: all .6s 1s ease;}
.swiper-slide-active .indCase-con-item{transform: translateY(0);transition-delay: 0s;}
.indCase-con-item .title:hover{color: #ffec87;}
.indCase-con-item .more{align-items: center;}
.indCase-con-item .more i{display: block;font-size: 20px; margin:4px 0 0 10px;transition: all .4s ease;transform: rotate(180deg);}
.indCase-con-item .more:hover{color: #ffec87;}
.indCase-con-item .more:hover i{margin-left: 20px;}
.indCase-switch{z-index: 4; align-items: center;position: absolute;right: calc((100% - 1200px)/2);bottom: 90px;}
.indCase-btn{position: relative; width: 48px;height: 48px;user-select: none;cursor: pointer; border-radius: 50%;border: 1px solid #fff;font-size: 20px;}
.indCase-btn::after{content: "";position: absolute;left: 0;top: 0;width: 100%;height: 100%;border-radius: 50%;background: #ffec87;transition: all .4s ease;transform: scale(0);}
.indCase-btn::before{position: relative;z-index: 2;}
.indCase-btn.next{transform: rotate(180deg);}
.indCase-btn:hover{color: #222;border-color: #ffec87;}
.indCase-btn:hover::after{transform: scale(1);}
.indCase-page{margin: 0 25px;}
.indNews-list{justify-content: space-between;}
.indNews-list::after{content: "";width: 31%;}
.indNews-item{width: 31%;}
.indNews-img::after{content: "";position: absolute;left: 0;top: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, .25);}
.indNews-img img{width: 100%;height: 370px;}
.indNews-con{transition:all .6s ease; background: #f2efeb; padding: 35px; position: absolute;left: 0;top: 0;width: 100%;height: 100%;}
.indNews-con .date{color: #bcbcbc;align-items: center;position: absolute;left: 35px;bottom: 40px;}
.indNews-con .date i{display: block;margin-right: 10px;}
.indNews-item:hover .indNews-con{background: transparent;}
.indNews-item:hover .indNews-con .title,.indNews-item:hover .indNews-con .text{color: #fff;}
/* -------------------------PC端--------------------------- */
@media all and (max-width:1700px) {
    /* 1600 × (900) */
}
@media all and (max-width:1590px) {
    /* 1440 × (700)  */
    .indAb-con{max-width: 900px;}
}
@media all and (max-width:1430px) {
    /* 1360 */
}
@media all and (max-width:1350px) {
    /* 1280 */
}
@media all and (max-width:1270px) {
    /* 1152 × (700) */
    .indPro-img{height: 450px;}
    .indPro-swp{padding: 0 50px;}
    .indPro-img img{height: 400px;}
    .swiper-slide-active .indPro-img img{height: 450px;}
    .indCase-bg img{height: 540px;}
    .indCase-con{padding-bottom: 40px;}
    .indCase-switch{right: calc((100% - 1000px) / 2);bottom: 50px;}
    .indNews-con{padding: 25px;}
    .indNews-img img{height: 310px;}
    .indNews-con .date{left: 25px;bottom: 25px;}
}
/* ------------------------平板端-------------------------- */
@media all and (max-width:1100px) {
    /* 1024 横屏 */
}
@media all and (max-width:1000px) {
    /* 720 竖屏 */
    .banner-bg img{height: calc(100vh - 60px);}
    .indAb{height: auto;padding: 50px 4%;}
    .indAb-img{display: none;}
    .indAb-con br{display: none;}
    .indAb-con .logo{width: 50%;}
    .indCase-con-item{width: 100%;}
    .indPro-swp{padding: 0;margin-top: 30px;}
    .indPro-btn{display: none;}
    .indPro-img img{height: 164px;}
    .indPro-img{height: 180px;}
    .swiper-slide-active .indPro-img img{height: 180px;}
    .indPro-page{display: none;}
    .indPro-pagination{margin-top: 20px;}
    .indCase-bg img{height: 250px;}
    .indCase-con-item{transform: unset;}
    .indCase-switch{display: none;}
    .indCase-pagination{position: absolute;left: 0;bottom: 15px;width: 100%;text-align: center;z-index: 3;}
    .indCase-pagination .swiper-pagination-bullet{margin: 0 4px; width: 20px;height: 2px;opacity: 1;border-radius: 0;background: #666;}
    .indCase-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{background: #ffec87;}
    .indNews-item{width: 100%;margin-top: 15px;}
    .indNews-item:first-child{margin-top: 0;}
    .indNews-con{padding: 25px 15px;background: transparent;}
    .indNews-con .date{left: 25px;bottom: 15px;}
    .indNews-img::after{background: rgba(0, 0, 0, .5);}
    .indNews-img img{height: 250px;}
    .indNews-con .title{height: auto;max-height: 40px;}
    .indNews-con .title,.indNews-con .text{color: #fff;}

}
/* ------------------------手机端-------------------------- */
@media all and (max-width:720px) {
    /* 移动终端 360 适配 */
}