@charset "utf-8";

@keyframes fadeIn {
    0% {transform: translate3d(0px, 30px, 0px); }
    100% { opacity: 1; transform: translate3d(0px, 0px, 0px); }
}
@keyframes fadeInRight {
    0% { opacity: 0; transform: translate3d(30px, 0, 0px); }
    100% { opacity: 1; transform: translate3d(0px, 0px, 0px); }
}
@keyframes fadeInLeft {
    0% { opacity: 0; transform: translate3d(-30px, 0, 0px); }
    100% { opacity: 1; transform: translate3d(0px, 0px, 0px); }
}

@keyframes scale {
    0% { opacity: 0; transform: scale(.2); }
    100% { opacity: 1; transform: scale(1); }
}

@keyframes showHide {
    0%, 100% { opacity: 0; } 
    50% { opacity: 1; } 
}

@keyframes float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-5px); }
}


section.mainVisual .inner { opacity: 0; }
section.mainVisual.on .inner { animation: fadeIn 0.6s ease-in-out .1s 1 forwards running; }

section.prize .inner { opacity: 0; }
section.prize.on .inner { animation: fadeIn 0.6s ease-in-out .1s 1 forwards running; }

section.intro .inner { opacity: 0; }
section.intro.on .inner { animation: fadeIn 0.6s ease-in-out .1s 1 forwards running; }

section.prize .inner { opacity: 0; }
section.prize.on .inner { animation: fadeIn 0.6s ease-in-out .1s 1 forwards running; }

section.work .inner { opacity: 0; }
section.work.on .inner { animation: fadeIn 0.6s ease-in-out .1s 1 forwards running; }

section.step .inner { opacity: 0; }
section.step.on .inner { animation: fadeIn 0.6s ease-in-out .1s 1 forwards running; }

section.youtube .inner { opacity: 0; }
section.youtube.on .inner { animation: fadeIn 0.6s ease-in-out .1s 1 forwards running; }

section.directions .inner { opacity: 0; }
section.directions.on .inner { animation: fadeIn 0.6s ease-in-out .1s 1 forwards running; }