@charset "utf-8";
/* ===================首页样式========================== */
/* banner */
.indBan-bg img{width: 100%;height: 100vh;animation: banImg 1s ease forwards;}
@keyframes banImg {0%{transform: scale(1.5);}100%{transform: scale(1);}}
.indBan-marsk{position: absolute;left: 0;bottom: 0;width: 100%;z-index: 2;}
.indBan-marsk img{width: 100%;}
.indBan-scroll{cursor: pointer; position: absolute;z-index: 3; left: 50%;bottom: 5%;transform: translateX(-50%);flex-direction: column;align-items: center;white-space: nowrap;}
.indBan-scroll .text{font-family: "Montserrat";}
.indBan-scroll .mouse{border: 3px solid #fff;position: relative;margin:15px 0 6px 0; width: 22px;height: 34px;border-top-right-radius: 10px;border-top-left-radius: 10px;border-bottom-right-radius: 10px;border-bottom-left-radius: 10px;}
.indBan-scroll .mouse::after{opacity: 0; animation: banMouse 1.5s -0.2s ease infinite ; content: "";width: 5px;height: 5px;border-radius: 50%;background: #fff;position: absolute;left: 50%;top: 5px;transform: translateX(-50%);}
.indBan-scroll .next{animation: banNext 1.5s ease infinite ; font-family: "宋体", "SimSun", "\5B8B\4F53";font-weight:700;line-height: .5; font-size: 20px;transform: rotate(90deg);margin-top: 2px;color: rgba(255, 255, 255, .8);}
.indBan-scroll .next:last-child{color: rgba(255, 255, 255, .5);}
@keyframes banMouse {0%{transform: translate(-50%,-3px);opacity: 1;}100%{transform: translate(-50%,14px);opacity: 0;}}
@keyframes banNext {0%{transform:translateY(-3px) rotate(90deg) ;}100%{transform:translateY(5px) rotate(90deg) ;}}
.indBan-btn{position: absolute;right: 5%;bottom: 3%;z-index: 4;}
.indBan-btn .btn{cursor: pointer;transition: all .4s ease; position: relative;width: 46px;height: 46px;border-radius: 50%;border: 2px solid #fff;margin-left: 13px;background: #fff;font-weight: 700;}
.indBan-btn .btn:first-child{margin-left: 0;}
.indBan-btn .indBan-stop{background: transparent;}
.indBan-btn .indBan-stop.active::before{content: "\e653";}
.indBan-btn .btn::before{position: relative;z-index: 2;}
.indBan-btn .btn::after{content: "";position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%) scale(0);width: 100%;height: 100%;border-radius: 50%;transition: all .3s ease;background: #68cfc8;}
.indBan-btn .btn:hover{color: #fff;}
.indBan-btn .btn:hover::after{transform: translate(-50%,-50%) scale(1.1);}
/* 品牌 */
.indBrand{background: url('../images/index/indBrand-bg.png') no-repeat center bottom/100% auto;}
.indBrand-logo{margin-left: -30px;}
.indBrand-logo li{cursor: pointer; overflow: hidden; border-top-right-radius: 30px;border-bottom-left-radius: 30px; position: relative;transition: all .4s ease;width: calc(20% - 30px);margin-left: 30px;box-shadow: 0px 20px 35px 0px rgba(50, 106, 102, 0.14);}
.indBrand-just,.indBrand-back{height: 120px;border-top-right-radius: 30px;border-bottom-left-radius: 30px;background: #fff;}
.indBrand-back{transition:all .5s ; position: absolute;left: 0;top: 0;width: 100%;height: 100%;background: #68cfc8;transform: rotateX(90deg) skew(-12deg);transform-origin:top;visibility: hidden;overflow: hidden;}
.indBrand-logo img{max-width: 80%;max-height: 80%;}
.indBrand-logo li.active{transform: translateY(-20px);box-shadow: 10px 40px 30px -20px #61c2bb;}
.indBrand-logo li.active .indBrand-back{transform: rotateX(0) skew(0);visibility: visible;}
.indBrand-img{width: 85%;border-radius: 30px;overflow: hidden;}
.indBrand-img img{width: 100%;}
.indBrand-con{padding: 0 5%; flex-direction: column;justify-content: center;align-items: center; position: absolute;right: 0;top: 50%;transform: translateY(-50%); width: 34%;border-radius: 30px; height: 90%;background: url('../images/index/indBrand-text-bg.jpg') no-repeat right top/cover;}
.wRight{animation: wRight 1s ease forwards;opacity: 0;}
@keyframes wRight {0%{opacity: 0;transform: translate(160px,-50%);}100%{opacity: 1;transform: translate(0,-50%);}}
.indBrand-title{align-items: center;}
.indBrand-title p{position: relative;padding-bottom: 5px;}
.indBrand-title p::before{width: 30px;height: 2px;position: absolute;content: "";position: absolute;left: 50%;bottom: 0;transform: translateX(-50%);background: #999;}
.indBrand-title::after{content: "";display: inline-block;width: 9px;height: 9px;border-radius: 50%;background: #68cfc8;margin-left: 14px;}
.indBrand-more{position: relative; transition: all .4s ease; width: 70px;height: 70px;border-radius: 50%;box-shadow: 0px 18px 54px 0px rgba(50, 106, 102, 0.14);background: #fff;}
.indBrand-more::before{font-weight: 700;font-size: 14px;position: relative;z-index: 2;}
.indBrand-more::after{content: "";position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%) scale(0);width: 100%;height: 100%;border-radius: 50%;background: #68cfc8;transition: all .4s ease;}
.indBrand-more:hover{color: #fff;}
.indBrand-more:hover::after{transform: translate(-50%,-50%) scale(1);}
/* 快速通道 */
.indPages-list li{width: calc(100% / 3);position: relative;display: flex;flex-direction: column;align-items: center;text-align: center;}
.indPages-list li::after{content: "";position: absolute;left: 0;top: 0;width: 1px;height: 80%;background: #e3e3e3;}
.indPages-list li:first-child::after{display: none;}
.indPages-icon{width: 215px;height: 215px;border-radius: 50%;background: #f8f8f8;}
.indPages-icon img{max-width: 70%;max-height: 70%;}
.indPages-more{transition: all .4s ease; box-shadow: 0px 18px 54px 0px rgba(50, 106, 102, 0.14);border-radius: 30px;overflow: hidden;}
.indPages-more .btn{width: 188px;height: 54px;border-radius: 30px;background: #fff;}
.indPages-more .back{transform-origin: bottom; transform: rotateX(90deg) skew(-12deg);overflow: hidden;visibility: hidden; background: #68cfc8;color: #fff;position: absolute;left: 0;top: 0;width: 100%;height: 100%;transition: all .4s ease;}
.indPages-more:hover .back{transform: rotateX(0deg) skew(0deg);visibility: visible;}
/* 底部 */
.indBottom-item{width: 50%;height: 360px;flex-direction: column;transition: all 0.8s cubic-bezier(0, 0, 0, 0.8);background-size: cover;background-position: center center;}
.indBottom-more{transition: all .4s ease;width: 186px;height: 54px;border-radius: 30px;overflow: hidden;}
.indBottom-more p{position: relative;z-index: 3;}
.indBottom-more p::after{content: "";position: absolute;left: 0;bottom: -2px;width: 0;height: 1px;background: #fff;transition: all .3s ease;}
.indBottom-more::after,.indBottom-more::before{content: "";position: absolute;left: 0;top: 0;width: 100%;height: 100%;background: #68cfc8;border-radius: 30px;transition: all .4s linear;}
.indBottom-more::before{left: -180%;transition: all .5s linear;}
.indBottom-more:hover:before{transform: translateX(180%);}
.indBottom-more:hover::after{transform: translateX(100%);}
.indBottom-more:hover p::after{width: 100%;transition-delay: .3s;}
/* 企业文化 */
.indWH{background: #f5f5f5;}
/* .indWH-swp{background: rgba(0, 0, 0, .5);} */
.indWH-img img,.indWH-line img{width: 100%;}    
/* .indWH-bg{overflow: hidden;will-change: clip-path;clip-path: polygon(0 0,100% 0,100% 100%,0 100%); }
.indWH-swp .swiper-slide-active .indWH-bg{clip-path: polygon(0 0,0% 0,0% 100%,0 100%);transition: clip-path .8s cubic-bezier(.29,.73,.45,1);} */
.indWH-swp .swiper-container{height: 860px;}
.indWH-bg,.indWH-img,.indWH-img img,.indWH-swp .swiper-wrapper{height: 100%;}
.indWH-swp .swiper-slide.show2{z-index: 2;}
.indWH-swp .swiper-slide.show{z-index: 3;}
.indWH-swp .swiper-slide.clip1{animation: clip1 .5s linear forwards;}
.indWH-swp .swiper-slide.clip2{animation: clip2 .5s linear forwards;}
@keyframes clip1 {0%{clip-path: polygon(0 0,100% 0,100% 100%,0 100%); }20%{clip-path: polygon(0 0,100% 0,60% 100%,0 100%); }100%{clip-path: polygon(0 0,0% 0,0% 100%,0 100%); }}
@keyframes clip2 {0%{clip-path: polygon(0 0,100% 0,100% 100%,0 100%); }20%{clip-path: polygon(0 0,100% 0,100% 100%,40% 100%);}100%{clip-path: polygon(100% 0,1000% 0,100% 100%,100% 100%); }}
.indWH-swp .swiper-slide{position: absolute;left: 0;top: 0;width: 100%;z-index: 1;overflow: hidden;will-change: clip-path;clip-path: polygon(0 0,100% 0,100% 100%,0 100%); }
.indWH-img{overflow: hidden;}
.indWH-line{position: absolute;left: 8%;bottom: -5%;width: 70%;}
.indWH-line svg{width: 100%;display: block;}
.indWH-line svg path{fill:none;stroke:rgba(255, 255, 255, .4);stroke-miterlimit:10;}
.indWH-con{position: absolute;left: 0;top: 0;width: 100%;height: 100%;}
.indWH-title-en{position: absolute;left: 33%;top: 18%;}
.indWH-text{width: 536px;position: absolute;left: 50%;top: 54%;}
.indWH-text .title{align-items: center;position: relative;}
.indWH-text .title::after{content: "";width: 9px;height: 9px;border-radius: 50%;background: #68cfc8;margin-left: 5px;display: inline-block;}
.indWH-btn{width: 100%;height: 126px;transform: translateY(-50%);z-index: 3;}
.indWH-btn li{position: absolute;transform: translateY(-50%);top: 50%;width: 126px;height: 126px;border-radius: 50%;cursor: pointer;}
.indWH-btn li:nth-child(1){left: 27%;}
.indWH-btn li:nth-child(2){left: 59%;}
.indWH-btn li:nth-child(3){left: 75%;}
.indWH-btn-img{position: absolute;border-radius: 50%;overflow: hidden; z-index: 3; left: 50%;top: 50%;transform: translate(-50%,-50%);width: calc(100% - 4px);height: calc(100% - 4px);transition: all .4s ease;}
.indWH-btn-img img{width: 100%;height: 100%;}
.indWH-btn-page{width: 100%;height: 100%;}
.indWH-btn-page::after{content: "";position: absolute;left: 50%;top: 50%;border-radius: 50%; transform: translate(-50%,-50%);width: 100%;height: 100%;background: #fff;transition: all .6s ease;border: 1px solid #fff;}
.indWH-btn-page p{padding-bottom: 20px;line-height: 1;position: relative;z-index: 2;}
.indWH-btn-page p::after{content: "";position: absolute;left: 50%;bottom: 0;transform: translateX(-50%); width: 60%;height: 1px;background: #68cfc8;}
.indWH-btn li:hover .indWH-btn-img{transform: translate(-50%,-50%) scale(.92);}
.indWH-btn li.active .indWH-btn-img{opacity: 0;}
.indWH-btn li.active .indWH-btn-page::after{transform: translate(-50%,-50%) scale(2);border-color: #f8f8f8;}
/* 发展历程 */
.ind-history{padding-bottom: 260px; background: url('../images/index/indHis-bg.png') no-repeat center top/100% auto;}
.indHis-title{align-items: center;}
.indHis-title::after{content: "";display: inline-block;margin-left: 5px;background: #68cfc8;width: 9px;height: 9px;border-radius: 50%;}
.indHis-img{width: 60%;border-radius: 20px;position: relative;z-index: 5;}
.indHis-img img{width: 100%;}
.indHis-text{color: #a8a8a8;width: 485px;}
.indHis-date{position: absolute;right: 0;top: -50px;width: 55%;}
.indHis-date .graphic-wrapper .handler-wrapper {position: absolute;display: block;width: 71%;height: 71%;top: 0;bottom: 0;left: 0;right: 0;margin: auto auto;-webkit-transform-origin: center center;transform-origin: center center;-webkit-transform: rotate(45deg);transform: rotate(45deg);z-index: 2;pointer-events: none;transition: all .6s linear;}
.indHis-date .graphic-wrapper .handler-wrapper .handler {position: absolute;width: 8px;height: 8px;top: -4px;left: -4px;background: #fff;border: 2px solid #68cfc8;border-radius: 10px;box-sizing: content-box;z-index: 2;}
.indHis-date .graphic-wrapper .history-graph {position: relative;width: 100%;margin: 0 auto;overflow: visible;pointer-events: none;}
.indHis-date .graphic-wrapper .history-graph path {fill: none;stroke: #68cfc8;stroke-width: 2;stroke-miterlimit: 10;}
.indHis-date .graphic-wrapper .history-graph path.full {stroke: #ddd;}
.indHis-date .graphic-wrapper .history-graph path.hitzone {pointer-events: visible;cursor: pointer;stroke-width: 20;stroke: transparent;}
.indHis-swp{position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);z-index: 4;width: 100%;}
.indHis-slide{text-align: center;}
.indHis-slide .text{transform: translateX(-100px);transition: all .8s linear;opacity: 0;}
.indHis-slide .year{font-size: 140px;line-height: 1.1;transform: translateX(100px);transition: all .8s linear;opacity: 0;font-family: 'num';}
.indHis-swp .swiper-slide-active .indHis-slide .text,.indHis-swp .swiper-slide-active .indHis-slide .year{transform: translateX(0);opacity: 1;}
.indHis-btn{justify-content: center;}
.indHis-btn .btn{background: #fff;margin-left: 26px; box-shadow: 0px 18px 54px 0px rgba(50, 106, 102, 0.14);cursor: pointer;width: 70px;height: 70px;border-radius: 50%;transition: all .4s ease;}
.indHis-btn .indHis-prev{margin-left: 0;}
.indHis-btn .btn:hover{background: #68cfc8;color: #fff;box-shadow: 0px 10px 30px 0px rgba(104, 207, 200, 0.14);}

/* 新增 */
.Container{position: relative;z-index: 10;background: #fff;}
.Footer{position: fixed;left: 0;bottom: 0;width: 100%;}



/* -------------------------PC端--------------------------- */
@media all and (max-width:1700px) {
    /* 1600 × (900) */
    .indHis-slide .year{font-size: 125px;}
}
@media all and (max-width:1590px) {
    /* 1440 × (700)  */
    .indBrand-just{height: 110px;}
    .indBrand-con{padding: 0 4%;}
    .indBottom-item{height: 330px;}
    .indPages-icon{width: 190px;height: 190px;}
    .indWH-btn li{width: 110px;height: 110px;}
    .indHis-slide .year{font-size: 110px;}
    .indHis-btn .btn{width: 60px;height: 60px;}
    .indHis-img{width: 58%;}
    .indBan-btn{bottom: 2%;}
    .indWH-swp .swiper-container{height: 650px;}
    .indWH-title-en {left: 12%;top: 16%;}
}
@media all and (max-width:1430px) {
    /* 1360 */
    .indHis-slide .year{font-size: 105px;}
}
@media all and (max-width:1350px) {
    /* 1280 */
    .indHis-slide .year{font-size: 100px;}
}
@media all and (max-width:1270px) {
    /* 1152 × (700) */
    .indBrand-just{height: 100px;}
    .indHis-slide .year{font-size: 90px;}
    .indHis-btn .btn{width: 50px;height: 50px;margin-left: 15px;}
    .indWH-swp .swiper-container{height: 500px;}

}
/* ------------------------平板端-------------------------- */
@media all and (max-width:1100px) {
    /* 1024 横屏 */
}
@media all and (max-width:1000px) {
    /* 720 竖屏 */
}
/* ------------------------手机端-------------------------- */
@media all and (max-width:680px) {
    /* 移动终端 360 适配 */
    /* .indBan-bg img{height: auto;min-height: 350px;}
    .indBan-scroll{display: none;}
    .indBan-btn .btn{width: 35px;height: 35px;margin-left: 10px;}
    .indBan-btn .btn::before{font-size: 13px;}
    .indBrand-logo-box{width: 100%;overflow-x: auto;padding-bottom: 30px;}
    .indBrand-logo{margin-left: 0;flex-wrap: nowrap;width: 580px;}
    .indBrand-logo li{width: 100px;margin-left: 15px;box-shadow: 0px 10px 20px 0px rgba(50, 106, 102, 0.14);}
    .indBrand-just{height: 50px;width: 100%;}
    .indBrand-just,.indBrand-back,.indBrand-logo li{border-top-right-radius: 15px;border-bottom-left-radius: 15px;}
    .indBrand-logo li.active{transform: translateY(0);box-shadow: 2px 10px 20px -20px #61c2bb;}
    .indBrand-logo img{max-height: 50%;max-width: 60%;}
    .indBrand-img{width: 100%;border-radius: 10px;}
    .indBrand-con{width: 100%;padding: 30px 15px;position: relative;top: auto;height: auto;border-radius: 10px;transform: unset;}
    .indBrand-more{width: 56px;height: 56px;}
    .indBrand-title::after{margin-left: 8px;width: 6px;height: 6px;}
    .indBrand-title p::before{width: 20px;height: 1px;}
    .indPages-list li{width: 100%;padding: 30px 0;border-top: 1px solid #f8f8f8;}
    .indPages-list li::after{display: none;}
    .indPages-list li:first-child{padding-top: 0;border-top: unset ;}
    .indPages-more{box-shadow: 0px 5px 30px 0px rgba(50, 106, 102, 0.14);}
    .indPages-more .btn{width: 130px;height: 50px;}
    .indPages-icon{width: 170px;height: 170px;}
    .indPages-icon img{max-width: 50%;max-height: 50%;}
    .indBottom-item{width: 100%;height: 260px;}
    .indBottom-more{width: 140px;height: 46px;} */
}