@charset "utf-8";

.js-animation {
  opacity: 0;
  visibility: hidden;
  transform: translateY(40px);
  transition: all 1s;
}
.js-animation.is-show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0px);
}

.js-animation_delay {
    opacity: 0;
    visibility: hidden;
    transform: translateY(40px);
    transition: all 1s;
}

.js-animation_delay.is-animated {
    opacity: 1;
    visibility: visible;
    transform: translateY(0px);
}
    .js-animation_delay.is-animated {
        transition-delay: 0.4s;
    }

.js-animation_delay2 {
    opacity: 0;
    visibility: hidden;
    transform: translateY(40px);
    transition: all 1s;
}

    .js-animation_delay2.is-animated {
        opacity: 1;
        visibility: visible;
        transform: translateY(0px);
    }

    .js-animation_delay2.is-animated {
        transition-delay: 0.8s;
    }

.js-animation_slide {
    opacity: 0;
    visibility: hidden;
    transform: translateX(-50px);
    transition: all 1s;
}
    .js-animation_slide.is-animated {
        opacity: 1;
        visibility: visible;
        transform: translateX(0px);
    }
    .js-animation_slide.is-animated {
        transition-delay: 1.0s;
    }

/* スライド */
.slide_l {
    transform: translate(-100%, 0);
    transition: transform cubic-bezier(0.79,0.14,0.15,0.86) 1.0s;
}
    .slide_l.-visible {
        transform: translate(0, 0);
    }

.slide_r {
    transform: translate(100%, 0);
    transition: transform cubic-bezier(0.79,0.14,0.15,0.86) 1.0s;
}

    .slide_r.-visible {
        transform: translate(0, 0);
    }

/* KV ふわふわ揺れる */
.fuwa::after {
    animation: fuwafuwa 3s linear infinite alternate;
    display: inline-block;
    transition: 1.5s linear;
}
@keyframes fuwafuwa {
    0% {
        transform: translate(0, 0) rotate(-7deg);
    }

    50% {
        transform: translate(0, -7px) rotate(0deg);
    }

    100% {
        transform: translate(0, 0) rotate(7deg);
    }
}