@charset "utf-8";
/* animation: fadeIn 0.5s ease-in-out 0s 1 forwards running; */


@keyframes fadeIn {
    0% { opacity: 0; transform: translate3d(0px, 30px, 0px); }
    100% { opacity: 1; transform: translate3d(0px, 0px, 0px); }
}
@keyframes fadeInUp {
    0% { opacity: 0; transform: translate3d(0px, 50px, 0px); }
    100% { opacity: 1; transform: translate3d(0px, 0px, 0px); }
}
@keyframes fadeInDown {
    0% { opacity: 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); }
}

/* 스크롤 애니메이션 초기 상태 */
.scroll-fade {
    opacity: 0;
    transform: translate3d(0, 50px, 0);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

.scroll-fade.animate {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}