.wrap img {
    width: auto;
    height: auto;
}

.swiper {
    width: 100%;
    height: 100vh;

    /* background: url(https://cbgccdn.thecover.cn/@/images/20240121/1705839763578047469.jpg) center center no-repeat; */
    background-size: 100% 100%;
}

.swiper .swiper-slide {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.page {
    position: relative;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    overflow: hidden;
}

.page.page-0 {
    background: url(https://cbgccdn.thecover.cn/@/images/20240121/1705845493347001242.png) center center no-repeat;
    background-size: 100% 100%;
}

/* .page:not(.page-0){
    background: url(https://cbgccdn.thecover.cn/@/images/20240121/1705839651525091799.png) right 50% no-repeat;
    background-size: 12%;
} */

#video {
    width: 100%;
}

img.page-0-title {
    display: block;
    margin: 10% auto;
    width: 80%;
}

img.page-0-main {
    display: block;
    margin: 10% auto;
    width: 70%;
}

@keyframes arrow {
    50% {
        transform: translateY(10px);
    }
}

img.arrow {
    position: absolute;
    left: 46%;
    width: 8%;
    bottom: 3%;
    display: block;
    margin: 0 auto;
    animation: arrow 1.5s linear infinite;
}

.page .subtitle-1{
    width: 10%;
    position: absolute;
    bottom: 15%;
    right: 0;
}
.page .subtitle-2{
    width: 80%;
    position: absolute;
    bottom: 5%;
    right: 10%;
}
.page .subtitle-3{
    width: 18%;
    position: absolute;
    bottom: 15%;
    right: 2%;
}


.pinkbg{
    background: url(https://cbgccdn.thecover.cn/@/images/20240121/1705849520986043305.jpg) center top no-repeat;
    background-size: 100% 100%;
}

img.l-b-star{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 20%;
}
img.r-t-star{
    position: absolute;
    top: 0;
    right: 0;
    width: 20%;
}

.page .page-title{
    position: relative;
    width: 100%;
    margin-bottom: 6%;
    z-index: 10;
}
.page .page-word{
    position: relative;
    width: 90%;
    z-index: 10;
}

/* 1、2 */
.page.page-1,.page.page-2{
    padding: 20% 10% 0;
}
.page.page-1 .page-title{
    width: 60%;
    margin-bottom: 10%;
}
.page.page-1 .page-word{
    width: 90%;
}
.page.page-2 .page-title{
    width: 80%;
    margin-bottom: 10%;
}
.page.page-2 .page-word{
    width: 90%;
}

/* 2-2 */
.page.page-22 {
    padding: 20% 10% 0;
}
.page.page-22 .page-word{
    width: 100%;
}
/* 3 - 1*/
.page.page-31{
    background: #FCDE5B;
    padding-top: 30%;
}
.box{
    width: 95%;
    margin-top: 10%;
    /* height: ; */
    margin: 0 auto;
    background-size: 100% auto;
    background-repeat: no-repeat;
    position: relative;
}
.box.box-left{
    background-image: url(https://cbgccdn.thecover.cn/@/images/20240121/1705850474188035695.png) ;
}
.box.box-right{
    background-image: url(https://cbgccdn.thecover.cn/@/images/20240121/1705850496251074178.png);
}
.box.box-left::before{
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    padding-bottom: 181.329%;
}
.box.box-right::before{
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    padding-bottom: 187.27%;
}
.box-inner{
    padding: 10% 5% 0;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    position: absolute;
    top: 0;
    left: 0;
}

.box .index{
    position: absolute;
    width: 10%;
    left: 45%;
    top: -3%;

}

.page.page-31 .acc{
    position: absolute;
    width: 50%;
    top: 2%;
    right: 0;
}

/* 3-2 */
.page.page-32{
    background-color: #04C4EC;
    padding-top: 30%;
    background-repeat: no-repeat;
    background-image: url(https://cbgccdn.thecover.cn/@/images/20240121/1705851678172002204.png),url(https://cbgccdn.thecover.cn/@/images/20240121/1705851680505098176.png);
    background-size: 100%, 20%;
    background-position: bottom left,top right;
}

/* 3-3 */
.page.page-33{
    background-color: #2094DC;
    padding-top: 20%;
    background-repeat: no-repeat;
    background-image: url(https://cbgccdn.thecover.cn/@/images/20240121/1705852209997041869.png),url(https://cbgccdn.thecover.cn/@/images/20240121/1705852211491042281.png);
    background-size: 80%, 20%;
    background-position: bottom left,top right;
}
/* 3-4 */
.page.page-34{
    background-color: #95ED97;
    padding-top: 22%;
    background-repeat: no-repeat;
    background-image: url(https://cbgccdn.thecover.cn/@/images/20240121/1705852520869061602.png);
    background-size: 40%;
    background-position: top right;
}
.page.page-34 .page-title{
    width: 90%;
}
/* .page.page-34 .page-word{} */

/* 3-5  */
.page.page-35{
    background-color: #2697DD;
    padding-top: 35%;
    background-repeat: no-repeat;
    /* background-image: url(https://cbgccdn.thecover.cn/@/images/20240121/1705852520869061602.png); */
    /* background-size: 40%; */
    background-position: top right;
}

.page.page-35 .acc{
    width: 46%;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 10;
}


/* 3-6 */
.page.page-36{
    background-color: #04C4EC;
    padding-top: 20%;
    background-repeat: no-repeat;
    background-image: url(https://cbgccdn.thecover.cn/@/images/20240122/1705852979559075808.png),url(https://cbgccdn.thecover.cn/@/images/20240122/1705852983476021106.png);
    background-size: 80%, 20%;
    background-position: bottom right,top right;
}
/* 3-7 */
.page.page-37{
    background-color: #FCDB4D;
    padding-top: 35%;
    background-repeat: no-repeat;
    background-image: url(https://cbgccdn.thecover.cn/@/images/20240122/1705853353527075791.png);
    background-size: 50%;
    background-position: bottom right;
}

.page.page-37 .acc{
    width: 90%;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 10;
    opacity: 0.8;
}

/* 3-8 */
.page.page-38{
    background-color: #95ED97;
    padding-top: 20%;
    background-repeat: no-repeat;
    background-image: url(https://cbgccdn.thecover.cn/@/images/20240122/1705853505517046376.png),url(https://cbgccdn.thecover.cn/@/images/20240122/1705852983476021106.png);
    background-size: 80%, 20%;
    background-position: bottom left,top right;
}
.page.page-39{
    background-color: #95ED97;
    padding-top: 20%;
    background-repeat: no-repeat;
    background-image: url(https://cbgccdn.thecover.cn/@/images/20240122/1705853706797052352.png),url(https://cbgccdn.thecover.cn/@/images/20240122/1705852983476021106.png);
    background-size: 100%, 20%;
    background-position: bottom left,top right;
}

/* 3-10 */
.page.page-310{
    background-color: #FCDB4C;
    padding-top: 35%;
    background-repeat: no-repeat;
    background-image: url(https://cbgccdn.thecover.cn/@/images/20240122/1705853353527075791.png);
    background-size: 50%;
    background-position: bottom right;
}

.page.page-310 .acc{
    width: 90%;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 10;
    opacity: 0.8;
}


/* 4-1 */

.page.page-41,.page.page-42,.page.page-43{
    padding: 20% 5% 0;   
}
.page.page-41 .page-title,.page.page-42 .page-title{
    width: 80%;
    margin-bottom: 10%;
}
.page.page-41 .page-word{
    width: 100%;
    margin-bottom: 10%;
}
.page.page-41 .page-p,.page.page-42 .page-p{
    position: relative;
    z-index: 10;
    width: 90%;
    margin-bottom: 10%;
}
.page.page-41 .acc,.page.page-42 .acc,.page.page-43 .acc {
    width: 50%;
    position: absolute;
    bottom: 0;
    left: 25%;
    margin-bottom: 10%;
    z-index: 0;
}
.page.page-43 .page-word{
    width: 90%;
}

.page .page-title{
    opacity: 0;
    transform: translateY(10px);
}
.page .page-word{
    opacity: 0;
    transform: translateY(10px);
}
.page .page-p{
    opacity: 0;
    transform: translateY(10px);
}

.page .page-title,.page .page-word,.page .page-p{
    transition: all linear .6s;
}

.page .page-title.in, .page .page-word.in, .page .page-p.in{
    opacity: 1;
    transform: translateY(0);
}