*{  box-sizing: border-box;}
h1,
h2,
h3 {
    margin-top: 0;
    margin-bottom: 0;
    font-weight: bold;
}

.no-fixed .mobile-nav {
    position: relative;
    padding-bottom: 0;
}

/* .swiper-container{cursor: move;} */
.swiper-container,.section-warp,.section-content,.init-anim{
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100vh;
    /* background-color: #fff; */
}
.section-content.fixed{position: fixed;top: 0; left: 0;width: 100%;}
.swiper-wrapper {
    /* transition-delay: 1s; 
    transition-timing-function: cubic-bezier(0.5, 0, 0, 1);*/
}
.swiper-slide {
    text-align: center;
    font-size: 18px;
    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    /* opacity: 1!important; */
    position: relative;
    z-index: 1;
    /* transition: none!important; */
}
.swiper-active.swiper-slide{
    z-index: 2;
}
.swiper-slide-next.swiper-slide{
    z-index: 1;
}
.img-box {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    /* transform: scale(1.1);  */
    transition: transform 1s cubic-bezier(0.5, 0, 0, 1);
    overflow: hidden;
}

.swiper-slide-next .img-box{
    /* transform: translate(100%,0); */
}

.swiper-slide-active .img-box{
    /* transform: scale(1); 
    transform: translate(0,0); */
}

.section-one .swiper-slide:first-child .img-box,
.section-one .swiper-slide:nth-child(2) .img-box,
.section-one .swiper-slide:nth-child(3) .img-box,
.section-two .swiper-slide:first-child .img-box,
.section-two .swiper-slide:nth-child(2) .img-box,
.section-two .swiper-slide:nth-child(3) .img-box,
.section-three .swiper-slide:first-child .img-box,
.section-three .swiper-slide:nth-child(2) .img-box,
.section-three .swiper-slide:nth-child(3) .img-box,
.section-four .swiper-slide:first-child .img-box,
.section-four .swiper-slide:nth-child(2) .img-box,
.section-four .swiper-slide:nth-child(3) .img-box {
    background-image: url(https://sanyglobal-img.sany.com.cn/static/img/about%20us/01-1.jpg?x-oss-process=image/resize,m_lfit,w_1920/quality,q_90);
    height: 100vh;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.section-one .swiper-slide:nth-child(2) .img-box{
    background-image: url(https://sanyglobal-img.sany.com.cn/static/img/about%20us/01-2.jpg?x-oss-process=image/resize,m_lfit,w_1920/quality,q_90);
}

.section-one .swiper-slide:nth-child(3) .img-box{
    background-image: url(https://sanyglobal-img.sany.com.cn/static/img/about%20us/01-3.jpg?x-oss-process=image/resize,m_lfit,w_1920/quality,q_90);
}

.section-two .swiper-slide:first-child .img-box {
    background-image: url(https://sanyglobal-img.sany.com.cn/static/img/about%20us/02-1.jpg?x-oss-process=image/resize,m_lfit,w_1920/quality,q_90);
}

.section-two .swiper-slide:nth-child(2) .img-box{
    background-image: url(https://sanyglobal-img.sany.com.cn/static/img/about%20us/02-2.jpg?x-oss-process=image/resize,m_lfit,w_1920/quality,q_90);
}

.section-two .swiper-slide:nth-child(3) .img-box{
    background-image: url(https://sanyglobal-img.sany.com.cn/static/img/about%20us/02-3.jpg?x-oss-process=image/resize,m_lfit,w_1920/quality,q_90);
}

.section-three .swiper-slide:first-child .img-box {
    background-image: url(https://sanyglobal-img.sany.com.cn/static/img/about%20us/03-1.jpg?x-oss-process=image/resize,m_lfit,w_1920/quality,q_90);
}

.section-three .swiper-slide:nth-child(2) .img-box{
    background-image: url(https://sanyglobal-img.sany.com.cn/static/img/about%20us/03-2.jpg?x-oss-process=image/resize,m_lfit,w_1920/quality,q_90);
}

.section-three .swiper-slide:nth-child(3) .img-box{
    background-image: url(https://sanyglobal-img.sany.com.cn/static/img/about%20us/03-3.jpg?x-oss-process=image/resize,m_lfit,w_1920/quality,q_90);
}

.section-three .swiper-slide:nth-child(4) .img-box{
    background-image: url(https://sanyglobal-img.sany.com.cn/static/img/about%20us/03-4.jpg?x-oss-process=image/resize,m_lfit,w_1920/quality,q_90);
}

.section-four .swiper-slide:first-child .img-box {
    background-image: url(https://sanyglobal-img.sany.com.cn/cms/image/about/about-31.jpg?x-oss-process=image/resize,m_lfit,w_1920/quality,q_90);
}


/* .section-one .swiper-slide:nth-child(2) .img-box ,
.section-three .swiper-slide:nth-child(2) .img-box {
    background-image: url(https://sanyglobal-img.sany.com.cn/static/img/about/a3.jpg?x-oss-process=image/resize,m_lfit,w_1920/quality,q_90);
} */



/* .section-two .swiper-slide:nth-child(2) .img-box,
.section-four .swiper-slide:nth-child(2) .img-box {
    background-image: url(https://sanyglobal-img.sany.com.cn/static/img/about/a4.jpg?x-oss-process=image/resize,m_lfit,w_1920/quality,q_90);
} */

.section-warp h2,.init-anim-text{font-size:5rem; color: #fff; font-weight: bold; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); line-height: 200px; z-index: 2;}
.section-warp h2.scale-text{display: none;animation: textScale2 .5s; font-size: 5rem; opacity: 1;}


.init-anim{position: absolute; top: 0; left: 0; z-index: 2;overflow: hidden; background: none; /*margin-top: -80px;*/}
.init-anim .amask{position: absolute; top:0;left: 0; z-index: 1; width: 100%; height: 100%; background: #fff; animation: scaleOut .4s linear 1.8s forwards; transform-origin: center;}
.init-anim-text{font-size: 5rem; color: #000;z-index: 2; animation: textScale 2s forwards; transform-origin: center;}

.text-warp{width: 100%; height: 100vh; background: #fff; position: relative; z-index: 2; text-align: center; overflow: hidden;}
/* .text-content{ max-width: 80%; width:750px; margin:0 auto; padding: 45px 0; font-size: 1.8rem; transition: none;}
.text-content h3{font-size: 5rem; padding-bottom: 2.4rem; opacity: 0; font-weight: bold; }
.text-content-detail{display: none; animation: fadeIn 1s;}
.text-container{width: 100%;position: absolute; top: 0; left: 0;}
.section-footer{position: relative; z-index: 2;} */

.text-content{ max-width: 80%; width:750px; margin:0 auto; padding: 45px 0; font-size: 1.6rem; }
.text-content h3{font-size: 5rem; padding-bottom: 2.4rem;opacity: 0; font-weight: bold; /*visibility: hidden;*/ transition: none;}
.text-container{width: 100%;position: absolute; top:0; left: 0; transform: translate(0,0); transition:none;}
.text-content-detail{display: none; animation: fadeIn 1s; line-height: 1.6;}
.section-footer{position: relative; z-index: 2;}
@keyframes textScale{
    0%{
        opacity: 0;
        font-size: 12rem;
    }
    10%{
        opacity: 1;
    }
    30%{
        opacity: 1;
        font-size: 5rem;
    }
    95%{
        opacity: 1;
    }
    100%{
        opacity: 0;
    }
}
@keyframes textScale2{
    0%{
        opacity: 0;
        transform:translate(-50%,-50%) scale(2.5);
    }
    100%{
        opacity: 1;
        transform:translate(-50%,-50%) scale(1);
    }
}
@keyframes fadeOut{
    0%{
        opacity: 1;
    }
    100%{
        opacity: 0;
    }
}
@keyframes scaleOut{
    0%{
        transform: scale(1);
    }
    100%{
        transform: scale(0);
    }
}
@keyframes downIn{
    0%{
        top:0;
        opacity: 0;
        transform: translate(0,0);
    }
    100%{
        top:50%;
        opacity: 1;
        transform: translate(0,-50%);
    }
}
@keyframes topIn{
    0%{
        opacity: 0;
        transform: translate(-50%,-60%);
    }
    50%{
        opacity: .5;
        transform: translate(-50%,-60%);
    }
    100%{
        opacity: 1;
        transform: translate(-50%,-50%);
    }
}
@media screen and (max-width:1281px) {}
@media screen and (max-width:1281px) {
    .text-content{font-size: 16px;}
}
@media screen and (max-width:1024px) {
    .init-anim{margin-top: 0;}
    .text-content h3{opacity: 1;}
    .text-container{position: absolute;
        display: none;
        animation: topIn 1s;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);}
    .text-content-detail{display: block;}
}
@media screen and (max-width:768px) {
    .section-warp h2{width: 100%; text-align: center;}
    .text-content{font-size: 14px;}
}

@media screen and (max-width:414px) {}

@media screen and (max-width:375px) {
    .text-content{
        max-width: 90%;
    }
    .text-content-detail{
        line-height: 1.4;
    }
}