#wrapper-index {
    width: 100%;
    overflow: hidden;
    position: relative;
}

.main-content {
    position: relative;
    width: 1920px;
    transform-origin: top left;
    background-image: image-set( url('../img/bg/main.webp') type('image/webp'), url('../img/bg/png/main.png') type('image/png'));
    background-repeat: no-repeat;
    background-size: 100% auto;
    /* will-change: transform; */
}

.section-kv {
    padding-top: 400px;
    padding-bottom: 300px;
    position: relative。
}

.section-main {
    padding-top: 350px;
    position: relative。
}

.section-main .section-block {
    padding: 0 18rem 10rem 18rem;
}

@media screen and (max-width:1280px) {
    .main-content {
        width: 1500px;
    }
    .section-kv {
        padding-top: 280px;
        padding-bottom: 330px;
    }
    .section-main {
        padding-top: 150px;
    }
    .section-main .section-block {
        padding: 2rem 10rem 8rem 10rem;
    }
}

@media screen and (max-width:1024px) {
    .main-content {
        width: 1300px;
    }
    .section-kv {
        padding-top: 300px;
        padding-bottom: 220px;
    }
    .section-main {
        padding-top: 170px;
    }
    .section-main .section-block {
        padding: 0 7rem 10rem 7rem;
    }
}

@media screen and (max-width:767px) {
    .main-content {
        background-image: image-set( url('../img/bg/main-m.webp') type('image/webp'), url('../img/bg/png/main-m.png') type('image/png'));
        width: 1100px;
    }
    .section-kv {
        padding-top: 130px;
    }
    .section-main {
        padding-top: 80px;
    }
    .section-main .section-block {
        padding: 1rem 2rem;
    }
}

@media screen and (max-width:600px) {
    .main-content {
        width: 450px;
    }
    .section-kv {
        padding-bottom: 400px;
    }
}

.arrows-block {
    position: relative;
}

.arrows {
    /* width: 20px; */
    height: 20px;
    text-align: center;
}

.arrows::before {
    content: '';
    position: absolute;
    width: 20px;
    height: 100%;
    border-left: 3px solid rgba(255, 255, 255, 0.8);
    border-bottom: 3px solid rgba(255, 255, 255, 0.8);
    transform: rotate(-45deg);
    animation: bounce 2s infinite;
}

@keyframes bounce {
    0%,
    20%,
    50%,
    80%,
    100% {
        transform: translateY(0)rotate(-45deg);
    }
    40% {
        transform: translateY(-15px)rotate(-45deg);
    }
    60% {
        transform: translateY(-5px)rotate(-45deg);
    }
}