@charset "UTF-8";

@keyframes linkArrowAnime {
    from {
        background-position: right 0.8rem center;
    }
    10% {
        background-position: right 50% center;
    }
    to {
        background-position: right 0.8rem center;
    }
}

@keyframes linkArrowAnimeShort {
    from {
        background-position: right 0.8rem center;
    }
    10% {
        background-position: right 4rem center;
    }
    to {
        background-position: right 0.8rem center;
    }
}

@keyframes topAnime01 {
    0% {
        transform: scale(1);
    }

    5% {
        transform: scale(1);
    }

    50% {
        transform: scale(0.5);
    }

    100% {
        transform: scale(0.5);
    }
}

@keyframes topAnime02 {
    0% {
        transform: scale(1);
    }

    5% {
        transform: scale(1);
    }


    50% {
        transform: scale(0.4);
    }

    100% {
        transform: scale(0.4);
    }
}

@keyframes topAnime03 {
    0% {
        transform: scale(1);
    }

    5% {
        transform: scale(1);
    }


    50% {
        transform: scale(0.45);
    }

    100% {
        transform: scale(0.45);
    }
}


@keyframes topHeadSlide {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(calc(-228vw - 120px));
    }
}

@keyframes topHeadSlideSP {
    from {
        transform: translateX(0);
    }
    to {

        transform: translateX(calc(-276vw - 15vw));
    }
}


@keyframes topSubSlide {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(calc(-50%));
    }
}

@keyframes topSubSlideView {
    0% {
        opacity: 0;
        transform: scale(1.5);
    }
    10% {
        opacity: 0;
        transform: scale(1.5);
    }
    30% {
        opacity: 1;
        transform: scale(1);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes basicParallax {
    0% {
        object-position: center bottom;
    }
    100% {
        object-position: center top;
    }
}

@keyframes reverseParallax {
    0% {
        object-position: center top;
    }
    100% {
        object-position: center bottom;
    }
}
