﻿.section-1 {
    position: relative;
    overflow: hidden;
    min-height: 817px;
    background: #2016a0 url('/toy/img/index/sec-1-bg.svg') no-repeat top center;
}
.sec-1-bbg {
    background: #2016a0 url('/toy/img/index/sec-1-bbg.svg') no-repeat top center;
}
.section-2 {
    position: relative;
    overflow: hidden;
    min-height: 1170px;
    background-color: rgba(245, 158, 11, 1);
}
.section-3 {
    position: relative;
    overflow: hidden;
    min-height: 1320px;
    background-color: rgba(21, 14, 116, 1);
}
.section-4 {
    position: relative;
    overflow: hidden;
    min-height: 1900px;
    background-color: rgba(106, 102, 255, 1);
}
.section-5 {
    position: relative;
    overflow: hidden;
    min-height: 1980px;
    background: rgba(21, 14, 116, 1) url('/toy/img/index/sec-5-bg.svg') no-repeat top center;
    background-position-y: -100px;
}

.part-text {
    position: absolute;
    left: 80px;
    top: 246px;
    width: 664px;
}
.part-text > h1 {
    color: #fff;
    text-transform: unset;
    font-family: 'Elemental End', 'system-ui';
    font-size: 80px;
    font-weight: 400;
    line-height: 84px;
    letter-spacing: -2px
}
.part-text > div {
    margin-top: 30px;
    color: #fff;
    font-size: 24px;
    font-weight: 400;
    line-height: 32px;
    letter-spacing: 0%;
    font-family: Nunito;
}
.part-text > div:last-child {
   margin-top: 20px; 
}

.ani-sec1-saturn {
    right: -45px;
    top: -35px;
    /* 核心：设置动画延迟，实现随机错开效果 */
    animation: float-jump 6s ease-in-out 1.6s infinite;
    /* 延迟 1.2秒 开始，产生随机感
    animation: float-scale 3s ease-in-out 1.2s infinite;
    延迟 0.7秒 开始，产生随机感
    animation: float-opacity 3s ease-in-out 0.7s infinite;
    */

}
.ani-sec1-saturn>img {
    width: 470px;
}

.ani-sec1-earth {
    right: 245px;
    top: 243px;
    animation: float-jump 6s ease-in-out 1.4s infinite;
}
.ani-sec1-earth>img {
    width: 173px;
}

.ani-sec1-moon {
    right: 439px;
    top: 368px;
    animation: float-jump 6s ease-in-out 1.2s infinite;
}
.ani-sec1-moon>img {
    width: 116px;
}

.ani-sec1-train {
    right: 546px;
    top: 436px;
    animation: float-jump 6s ease-in-out 1s infinite;
}
.ani-sec1-train>img {
    width: 256px;
}

.ani-sec1-car {
    right: 80px;
    top: 624px;
    animation: float-up-20 3s ease-in-out 1s infinite;
}
.ani-sec1-car>img {
    width: 146px;
}

.ani-sec1-toy {
    right: 287px;
    top: 667px;
    animation: float-up-20 3s ease-in-out 1s infinite;
}
.ani-sec1-toy>img {
    width: 74px;
}

.ani-sec1-coin {
    right: 370px;
    top: 695px;
    animation: float-up-15 3s ease-in-out 1s infinite;
}
.ani-sec1-coin>img {
    width: 67px;
}

.ani-sec1-eggtart {
    right: 396px;
    top: 626px;
    animation: float-up-15 3s ease-in-out 1s infinite;
}
.ani-sec1-eggtart>img {
    width: 133px;
}

.ani-sec1-bear {
    right: 499px;
    top: 664px;
    animation: float-up-10 3s ease-in-out 1s infinite;
}
.ani-sec1-bear>img {
    width: 126px;
}

.ani-sec1-fish {
    right: 621px;
    top: 703px;
    animation: float-up-10 3s ease-in-out 1s infinite;
}
.ani-sec1-fish>img {
    width: 91px;
}

.ani-sec1-meteor-yellow{
    left: 886px;
    top: 104px;
    opacity: 0;
    animation: float-meteor 8s ease-in-out 0s infinite;
}
.ani-sec1-meteor-yellow>img{
    width: 106px;
}
.ani-sec1-meteor-orange{
    right: 50px;
    top: 320px;
    opacity: 0;
    animation: float-meteor 8s ease-in-out 1s infinite;
}
.ani-sec1-meteor-orange>img{
    width: 93px;
}
.ani-sec1-star-1{
    left: 282px;
    top: 141px;
    animation: float-opacity 3s ease-in-out 1s infinite;
}
.ani-sec1-star-1>img{
    width: 27px;
}
.ani-sec1-star-2{
    left: 924px;
    top: 260px;
    animation: float-opacity 3s ease-in-out 1.5s infinite;
}
.ani-sec1-star-2>img{
    width: 23px;
}
.ani-sec1-star-3{
    left: 880px;
    top: 362px;
    animation: float-opacity 3s ease-in-out 2s infinite;
}
.ani-sec1-star-3>img{
    width: 12px;
}
.ani-sec1-star-4{
    left: 512px;
    top: 560px;
    animation: float-opacity 3s ease-in-out 2.5s infinite;
}
.ani-sec1-star-4>img{
    width: 23px;
}
.ani-sec1-star-5{
    left: 451px;
    top: 626px;
    animation: float-opacity 3s ease-in-out 3s infinite;
}
.ani-sec1-star-5>img{
    width: 14px;
}

@keyframes float-up-20 {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(20px); }
}
@keyframes float-up-15 {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(15px); }
}
@keyframes float-up-10 {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(10px); }
}

@keyframes float-meteor {
    0% {
        transform: translate(0, 0);
        opacity: 0;
    }
    3%,15% {
        opacity: 1;
    }
    20% {
        transform: translate(-336px, 140px);
        opacity: 0;
    }
    100% {
        transform: translate(-336px, 140px);
        opacity: 0;
    }
}

/* 第2块 */
.s2-bg{
    left: 0;
    right: 0;
    top: 0;
    height: 1170px;
    text-align: center;
    overflow: hidden;
}
.s2-bg > img{
    width: 1440px;
}
.s2-title{
    left: 0;
    right: 0;
    top: 249px;
    text-align: center;
    font-family: Nunito;
    font-size: 24px;
    font-weight: 700;
    line-height: 32px;
    letter-spacing: 0%;
}
.s2-text{
    left: 465px;
    top: 302px;
    text-align: center;
    width: 510px;
    font-family: Nunito;
    font-size: 16px;
    font-weight: 400;
    line-height: 30px;
    letter-spacing: 0%;
}
.s2-start{
    left: 0;
    right: 0;
    top: 444px;
    text-align: center;
    animation: float-up-20 3s ease-in-out 1s infinite;
}
.s2-start > img{
    width: 98px;
}
.ani-sec2-star-1{
    left: 0;
    right: 0;
    top: 580px;
    text-align: center;
    animation: float-opacity 3s ease-in-out 1s infinite;
}
.ani-sec2-star-1>img{
    width: 40px;
}
.ani-sec2-doll{
    left: 0;
    right: 0;
    top: 635px;
    text-align: center;
}
.ani-sec2-doll>img{
    height: 107px;
}
.ani-sec2-star-2{
    left: 251px;
    top: 478px;
    animation: float-opacity 3s ease-in-out 1.5s infinite;
}
.ani-sec2-star-2>img{
    width: 26px;
    transform: rotate(-8deg);
}
.ani-sec2-star-3{
    left: 440px;
    top: 664px;
    animation: float-opacity 3s ease-in-out 2s infinite;
}
.ani-sec2-star-3>img{
    width: 26px;
    transform: rotate(-8deg);
}
.ani-sec2-star-4{
    left: 1183px;
    top: 241px;
    animation: float-opacity 3s ease-in-out 2.5s infinite;
}
.ani-sec2-star-4>img{
    width: 26px;
}
.ani-sec2-star-5{
    left: 1227px;
    top: 400px;
    animation: float-opacity 3s ease-in-out 3s infinite;
}
.ani-sec2-star-5>img{
    width: 26px;
}
.ani-sec2-star-6{
    left: 1044px;
    top: 477px;
    animation: float-opacity 3s ease-in-out 3.5s infinite;
}
.ani-sec2-star-6>img{
    width: 26px;
}

/* 第3块 */
.s3-banner{
    left: 0;
    right: 0;
    top: 957px;
    text-align: center;
}
.s3-banner > h2{
    color: #fff;
    text-transform: unset;
    font-family: 'Elemental End', 'system-ui';
    font-size: 40px;
    font-weight: 400;
    line-height: 47px;
    letter-spacing: -0.5px
}
.s3-subtitle{
    left: 0;
    right: 0;
    top: 1085px;
    text-align: center;
    font-family: Nunito;
    font-size: 20px;
    font-weight: 400;
    line-height: 38px;
    letter-spacing: 0%;
    color: #fff;
}
.s3-card-1, .s3-card-2, .s3-card-3{
    left: 0;
    right: 0;
    min-height: 406px;
    text-align: center;
}
.s3-card-1{
    top: 0;
}
.s3-card-2{
    top: 450px;
}
.s3-card-3{
    top: 900px;
}
.s3-card-1 > img, .s3-card-2 > img, .s3-card-3 > img{
    width: 926px;
    height: 406px;
}
.s3-card-1-flag{
    left: 508px;
    top: 25px;
}
.s3-card-2-flag{
    left: 508px;
    top: 475px;
}
.s3-card-3-flag{
    left: 508px;
    top: 925px;
}
.s3-card-1-flag > img, .s3-card-2-flag > img, .s3-card-3-flag > img{
    width: 145px;
}
.ani-sec3-card1-earth{
    left: 366px;
    top: 118px;
    animation: float-rotate 6s linear 0s infinite;
}
.ani-sec3-card1-earth > img{
    width: 126px;
}
.ani-sec3-card1-triangle-1{
    left: 460px;
    top: 87px;
    animation: float-sec3-card1-triangle-1 3s ease-in-out 1s infinite;
}
.ani-sec3-card1-triangle-1 > img{
    width: 24px;
}
.ani-sec3-card1-triangle-2{
    left: 305px;
    top: 230px;
    animation: float-sec3-card1-triangle-2 3s ease-in-out 1.5s infinite;
}
.ani-sec3-card1-triangle-2 > img{
    width: 20px;
}
.ani-sec3-card1-phone{
    left: 455px;
    top: 235px;
    animation: float-sec3-card1-phone 3s ease-in-out 2s infinite;
}
.ani-sec3-card1-phone > img{
    width: 73px;
}
.ani-sec3-card2-star-1{
    left: 270px;
    top: 460px;
    animation: float-rotate 10s linear 0s infinite;
}
.ani-sec3-card2-star-1 > img{
    width: 160px;
}
.ani-sec3-card2-star-2{
    left: 433px;
    top: 661px;
    animation: float-rotate 10s linear 0s infinite;
}
.ani-sec3-card2-star-2 > img{
    width: 135px;
}
.s3-card2-joygragh{
    left: 304px;
    top: 537px;
}
.s3-card2-joygragh > img{
    width: 228px;
}
.ani-sec3-card3-cloud-1{
    left: 340px;
    top: 1000px;
    animation: float-sec3-card3-cloud 6s linear 1s infinite;
    opacity: 0;
}
.ani-sec3-card3-cloud-1 > img{
    width: 67px;
}
.ani-sec3-card3-cloud-2{
    left: 280px;
    top: 1047px;
    animation: float-sec3-card3-cloud 6s linear 2s infinite;
    opacity: 0;
}
.ani-sec3-card3-cloud-2 > img{
    width: 73px;
}
.s3-card3-taogragh{
    left: 294px;
    top: 978px;
}
.s3-card3-taogragh > img{
    width: 228px;
}
@keyframes float-sec3-card1-triangle-1 {
    0%, 100% {
        transform: translate(0, 0);
    }
    50% {
        transform: translate(-10px, 10px);
    }
}
@keyframes float-sec3-card1-triangle-2 {
    0%, 100% {
        transform: translate(0, 0);
    }
    50% {
        transform: translate(10px, 5px);
    }
}
@keyframes float-sec3-card1-phone {
    0%, 100% {
        transform: translate(0, 0);
    }
    50% {
        transform: translate(-10px, -10px);
    }
}
@keyframes float-sec3-card3-cloud {
    0% {
        transform: translateX(0);
        opacity: 0;
    }
    5%, 50% {
        opacity: 1;
    }
    60% {
        transform: translateX(170px);
        opacity: 0;
    }
    100% {
        transform: translateX(170px);
        opacity: 0;
    }
}
.s3-card-text{
    left: 607px;
    width: 528px;
    text-align: left;
}
.s3-card-text > h2{
    color: #fff;
    text-transform: unset;
    font-family: 'Elemental End', 'system-ui';
    font-size: 32px;
    font-weight: 400;
    line-height: 47px;
    letter-spacing: 1px
}
.s3-card-text > p{
    margin-top: 10px;
    color: #fff;
    font-family: Nunito;
    font-size: 16px;
    font-weight: 400;
    line-height: 30px;
    letter-spacing: 0;
    /* text-align: justify; */
}
.s3-card-1-text{
    top: 100px;
}
.s3-card-2-text{
    top: 548px;
}
.s3-card-3-text{
    top: 1010px;
}

/*第4块*/
.s4-top{
    left: 0;
    top: 0;
    min-height: 464px;
    text-align: center;
}
.s4-top > img{
    width: 1440px;
}
.ani-sec4-top-saturn{
    left: 200px;
    top: 20px;
    animation: float-shake 3s linear 1s infinite;
}
.ani-sec4-top-saturn > img{
    width: 142px;
}
.ani-sec4-doll{
    left: 340px;
    top: 110px;
    animation: float-jump 6s linear 2s infinite;
}
.ani-sec4-doll > img{
    width: 58px;
}
.ani-sec4-flag{
    left: 233px;
    top: 210px;
    animation: float-scale 4s linear 1s infinite;
}
.ani-sec4-flag > img{
    width: 60px;
}
.ani-sec4-book{
    left: 1124px;
    top: 350px;
    animation: float-scale 4s linear 1s infinite;
}
.ani-sec4-book > img{
    width: 49px;
}
.ani-sec4-star-1{
    left: 389px;
    top: 90px;
    animation: float-opacity 3s ease-in-out 1s infinite;
}
.ani-sec4-star-1>img{
    width: 10px;
}
.ani-sec4-star-2{
    left: 435px;
    top: 110px;
    animation: float-opacity 3s ease-in-out 1.5s infinite;
}
.ani-sec4-star-2>img{
    width: 19px;
}
.ani-sec4-star-3{
    left: 931px;
    top: 90px;
    animation: float-opacity 3s ease-in-out 2s infinite;
}
.ani-sec4-star-3>img{
    width: 12px;
}
.ani-sec4-star-4{
    left: 1031px;
    top: 70px;
    animation: float-opacity 3s ease-in-out 2.5s infinite;
}
.ani-sec4-star-4>img{
    width: 19px;
}

@keyframes float-shake {
    0%, 100% { transform: rotate(0deg); }
    50% { transform: rotate(45deg); }
}
.s4-title{
    left: 0;
    right: 0;
    top: 260px;
    text-align: center;
}
.s4-title > h2{
    color: #fff;
    text-transform: unset;
    font-family: 'Elemental End', 'system-ui';
    font-size: 40px;
    font-weight: 400;
    line-height: 47px;
    letter-spacing: 1px
}
.s4-title > p{
    margin-top: 30px;
    color: #fff;
    font-family: Nunito;
    font-size: 16px;
    font-weight: 400;
    line-height: 30px;
    letter-spacing: 0;
}
.s4-loop{
    left: 0;
    right: 0;
    top: 410px;
    overflow: hidden;
}
.s4-loop .scroll-track {
    display: flex;
    width: max-content;           /* 宽度由内容自动撑开 */
    animation: loop-sec4 20s linear infinite;  /* 20秒一圈，匀速，无限循环 */
    will-change: transform;       /* 开启GPU硬件加速，确保流畅 */
}
.s4-loop .scroll-track > div {
    flex-shrink: 0;               /* 防止flex压缩子元素宽度 */
    width: 318px;
    min-height: 180px;
    padding: 3px 10px;
}
.s4-loop .scroll-track > div > img {
    width: 318px;
    /* height: 171px; */
    display: block;               /* 消除img底部默认空隙 */
    border-radius: 26px;
}
.s4-chat-box{
    left: 0;
    right: 0;
    top: 620px;
    text-align: center;
    overflow: hidden;
}
.s4-chat-box > img{
    width: 982px;
    height: 187px;
}
.s4-chat-text{
    width: 850px;
    min-height: 100px;
    left: 330px;
    top: 650px;
    opacity: 0;
}
.s4-chat-text > p{
    color: #000;
    font-family: Nunito;
    font-size: 16px;
    font-weight: 400;
    line-height: 30px;
    letter-spacing: 0;
}
.s4-chat-text > p > span{
    font-size: 24px;
}
.ani-sec4-chat-1{
    animation: float-sec4-chat-1 45s linear 1s infinite;
}
.ani-sec4-chat-2{
    width: 900px;
    left: 300px;
    animation: float-sec4-chat-2 45s linear 1s infinite;
}
.ani-sec4-chat-3{
    animation: float-sec4-chat-3 45s linear 1s infinite;
}
.ani-sec4-doll-chat{
    left: 380px;
    top: 800px;
    animation: float-jump 6s linear 3s infinite;
}
.ani-sec4-doll-chat > img{
    width: 80px;
}
.s4-step-1{
    left: 0;
    top: 900px;
    width: 870px;
    overflow: hidden;
    padding: 20px 0;
    box-sizing: border-box;
    background-color: rgba(234, 224, 255, 1);
    border-radius: 0 200px 200px 0;
}
.s4-step-1 > div{
    display: table-cell;
    vertical-align: middle;
}
.s4-step-1 > div:first-child{
    width: 70px;
    padding-left: 130px;
}
.s4-step-1 > div:first-child > img{
    width: 68px;
}
.s4-step-1 > div:last-child{
    padding-left: 20px;
    padding-right: 90px;
}
.s4-step-1-part-adorn{
    right: 190px;
    top: 850px;
}
.s4-step-1-part-adorn > img{
    width: 322px;
}
.ani-sec4-step-1-shine{
    right: 250px;
    top: 910px;
    animation: float-sec4-step-1 3s linear 1s infinite;
}
.ani-sec4-step-1-shine > img{
    width: 239px;
}
.s4-step-1-part-coin{
    right: 300px;
    top: 955px;
}
.s4-step-1-part-coin > img{
    width: 147px;
}
.s4-step-2{
    right: 0;
    top: 1250px;
    width: 870px;
    overflow: hidden;
    padding: 20px 0;
    box-sizing: border-box;
    background-color: rgba(234, 224, 255, 1);
    border-radius: 200px 0 0 200px;
}
.s4-step-2 > div{
    display: table-cell;
    vertical-align: middle;
}
.s4-step-2 > div:last-child{
    text-align: right;
    width: 70px;
    padding-right: 130px;
}
.s4-step-2 > div:last-child > img{
    width: 68px;
}
.s4-step-2 > div:first-child{
    text-align: right;
    padding-left: 90px;
    padding-right: 20px;
}
.s4-step-2-part-graph{
    left: 130px;
    top: 1060px;
}
.s4-step-2-part-graph > img{
    width: 440px;
}
.ani-sec4-step-2-kids{
    left: 310px;
    top: 1400px;
    animation: float-jump 6s linear 1s infinite;
}
.ani-sec4-step-2-kids > img{
    width: 48px;
}
.s4-step-3{
    left: 0;
    top: 1600px;
    width: 870px;
    overflow: hidden;
    padding: 20px 0;
    box-sizing: border-box;
    background-color: rgba(234, 224, 255, 1);
    border-radius: 0 200px 200px 0;
}
.s4-step-3 > div{
    display: table-cell;
    vertical-align: middle;
}
.s4-step-3 > div:first-child{
    width: 70px;
    padding-left: 130px;
}
.s4-step-3 > div:first-child > img{
    width: 68px;
}
.s4-step-3 > div:last-child{
    padding-left: 20px;
    padding-right: 90px;
}
.s4-step-text{
    color: #000;
    font-family: Nunito;
    font-size: 16px;
    font-weight: 400;
    line-height: 30px;
    letter-spacing: 0;
}
.s4-step-3-part-ai{
    right: 180px;
    top: 1560px;
}
.s4-step-3-part-ai > img{
    width: 397px;
}
.ani-sec4-step-3-clock{
    right: 320px;
    top: 1590px;
    animation: float-sec4-step-3 3s linear 1s infinite;
}
.ani-sec4-step-3-clock > img{
    width: 51px;
}
.ani-sec4-step-3-earth{
    right: 225px;
    top: 1630px;
    animation: float-sec4-step-3 3s linear 1.3s infinite;
}
.ani-sec4-step-3-earth > img{
    width: 114px;
}
.ani-sec4-step-3-rewards{
    right: 280px;
    top: 1750px;
    animation: float-sec4-step-3 3s linear 1.6s infinite;
}
.ani-sec4-step-3-rewards > img{
    width: 77px;
}
@keyframes loop-sec4 {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-2028px);  /* 向左移动一整组的宽度 */
    }
}
@keyframes float-sec4-chat-1 {
    0% {
        transform: translateX(0);
        opacity: 0;
    }
    1.33%,32% {
        transform: translateX(-20px);
        opacity: 1;
    }
    33.33% {
        transform: translateX(-40px);
        opacity: 0;
    }
    100% {
        transform: translateX(0);
        opacity: 0;
    }
}
@keyframes float-sec4-chat-2 {
    0%, 33.33% {
        transform: translateX(0);
        opacity: 0;
    }
    34.66%, 65.33% {
        transform: translateX(-20px);
        opacity: 1;
    }
    66.66% {
        transform: translateX(-40px);
        opacity: 0;
    }
    100% {
        transform: translateX(0);
        opacity: 0;
    }
}
@keyframes float-sec4-chat-3 {
    0%, 66.66% {
        transform: translateX(0);
        opacity: 0;
    }
    67.99%, 98.77% {
        transform: translateX(-20px);
        opacity: 1;
    }
    100% {
        transform: translateX(-40px);
        opacity: 0;
    }
}
@keyframes float-sec4-step-1 {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.25);
    }
}
@keyframes float-sec4-step-3 {
    0%, 100% {
        transform: scale(1);
    }
    10% {
        transform: scale(1.25);
    }
    20% {
        transform: scale(1);
    }
}

/* 第5块 */
.s5-title-1{
    left: 0;
    right: 0;
    top: 180px;
    text-align: center;
}
.s5-title-1 > h2{
    color: #fff;
    text-transform: unset;
    font-family: 'Elemental End', 'system-ui';
    font-size: 40px;
    font-weight: 400;
    line-height: 47px;
    letter-spacing: 1px
}
.ani-sec5-paint{
    left: 310px;
    top: 230px;
    animation: float-scale 4s linear 1s infinite;
}
.ani-sec5-paint > img{
    width: 39px;
}
.ani-sec5-crown{
    right: 310px;
    top: 160px;
    animation: float-scale 4s linear 2s infinite;
}
.ani-sec5-crown > img{
    width: 49px;
}
.s5-loop{
    left: 0;
    right: 0;
    top: 310px;
    overflow: hidden;
    background-color: #fff;
}
.s5-loop .scroll-track {
    display: flex;
    width: max-content;
    animation: loop-sec5 20s linear infinite;
    will-change: transform;
}
.s5-loop .scroll-track > div {
    flex-shrink: 0;
    width: 175px;
    min-height: 175px;
    padding: 15px 10px;
}
.s5-loop .scroll-track > div > img {
    width: 175px;
    display: block;
}
.s5-title-2{
    left: 0;
    right: 0;
    top: 780px;
    text-align: center;
}
.s5-title-2 > h2{
    color: #fff;
    text-transform: unset;
    font-family: 'Elemental End', 'system-ui';
    font-size: 40px;
    font-weight: 400;
    line-height: 47px;
    letter-spacing: 3px
}
.s5-title-2 > h4{
    margin-top: 50px;
    color: #fff;
    font-family: Nunito;
    font-size: 20px;
    font-weight: 400;
    line-height: 38px;
    letter-spacing: 0;
    text-transform: none;
}
.s5-title-2 > p{
    margin-top: 50px;
    color: #fff;
    font-family: Nunito;
    font-size: 16px;
    font-weight: 400;
    line-height: 30px;
    letter-spacing: 0;
}
.ani-sec5-chatbox{
    left: 410px;
    top: 730px;
    animation: float-jump 6s linear 1s infinite;
}
.ani-sec5-chatbox > img{
    width: 54px;
}
.ani-sec5-chatbox-heart{
    left: 350px;
    top: 780px;
    animation: float-jump 6s linear 1.2s infinite;
}
.ani-sec5-chatbox-heart > img{
    width: 54px;
}
.s5-events{
    left: 0;
    right: 0;
    top: 1130px;
    text-align: center;
}
.s5-events > div {
    display: inline-flex;
    width: max-content;
    will-change: transform;
    text-align: center;
}
.s5-events > div > a {
    flex-shrink: 0;
    display: list-item;
    width: 316px;
    margin: 0 15px;
    background-color: #fff;
    border-radius: 30px;
    overflow: hidden;
    padding-bottom: 30px;
}
.s5-events > div > a > h3{
    text-transform: none;
    text-align: center;
    color: #000;
    font-family: Nunito;
    font-size: 24px;
    font-weight: 500;
    line-height: 32px;
    letter-spacing: 0;
    padding: 30px 0;
}
.s5-events > div > a > p{
    text-align: center;
    color: #f00;
    font-family: Nunito;
    font-size: 16px;
    font-weight: 400;
    line-height: 16px;
    letter-spacing: 0;
}
.s5-events > div > a > p > span {
    display: inline-block;
    margin-left: 10px;
    font-family: Nunito;
}
.s5-more{
    left: 0;
    right: 0;
    top: 1690px;
    text-align: center;
}
.s5-more > button{
    background: linear-gradient(90deg, #3726FF 0%, #6F45FF 100%);
}
.s5-more > button > span {
    display: inline-block;
    margin-left: 10px;
    font-family: Nunito;
}
.ani-sec5-bottom-saturn{
    left: 131px;
    top: 1830px;
    animation: float-shake 3s linear 1s infinite;
}
.ani-sec5-bottom-saturn > img{
    width: 167px;
}
@keyframes loop-sec5 {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-2535px);  /* 向左移动一整组的宽度 */
    }
}

@media screen and (-webkit-min-device-pixel-ratio:2),
screen and (-webkit-min-device-pixel-ratio:3),
screen and (-webkit-min-device-pixel-ratio:4),
screen and (min-resolution:240dpi),
screen and (min-resolution:2dppx),
screen and (min-resolution:3dppx),
screen and (min-resolution:4dppx) {}