@media screen and (min-width: 768px) {
    .index-banner {
        padding-top: 100vh;
    }

    .vh-sm-100 {
        height: 100vh;
    }

    .mySwiper2 .swiper-slide-w {
        width: 35%;
    }

    .index-earth-size {
        width: 180%;
        height: 100%;
    }
}

@media screen and (max-width: 768px) {
    .mySwiper .swiper-index-prev {
        left: var(--swiper-navigation-sides-offset, 5%);
        right: auto;
    }

    .mySwiper .swiper-index-next {
        right: var(--swiper-navigation-sides-offset, 5%);
        left: auto;
    }

    .mySwiper2 .swiper-slide-w {
        width: 100%;
    }

    .mySwiper2 .swiper-index-prev2-wrap {
        left: var(--swiper-navigation-sides-offset, 5%);
        right: auto;
    }

    .mySwiper2 .swiper-index-next2-wrap {
        right: var(--swiper-navigation-sides-offset, 5%);
        left: auto;
    }

    .index-earth-size {
        width: 100%;
    }
}

@media screen and (min-width: 768px) and (max-width: 1000px) {
    .sm.fs-9 {
        font-size: 6rem !important;
    }
}

@media screen and (min-width: 1001px) and (max-width: 1400px) {
    .sm.fs-9 {
        font-size: 6rem !important;
    }
}

@media screen and (min-width: 1401px) and (max-width: 1800px) {
    .sm.fs-9 {
        font-size: 7.5rem !important;
    }
}
