@charset "UTF-8";

@keyframes move{
    from {
        transform: translateX(0);
        animation-timing-function: cubic-bezier(1, 0, 0.8, 1);
    }
    to {transform: translateX(500px);}
}
@keyframes main_tit{
    from {
        opacity: 0;
        transform: translateY(50px);
        animation-timing-function: cubic-bezier(1.5, 0, 0.8, 2);
    }
    to {opacity: 1;transform: translateY(0);}
}
@keyframes main_tit02{
    from {
        opacity: 0; 
        transform: translateY(50px);
        animation-timing-function: cubic-bezier(1.5, 0, 0.8, 2);
    }
    to {opacity: 1;transition-delay: 1s;transform: translateY(0);}
}
.fadeinup{position:relative;opacity: 0;transform: translateY(50px);
    -webkit-transform: translateY(50px);
    -webkit-transition: opacity 1s, transform 1s, -webkit-transform 1s;
    -moz-transition: opacity 1s, transform 1s, -webkit-transform 1s;
    -o-transition: opacity 1s, transform 1s, -webkit-transform 1s;
    -ms-transition: opacity 1s, transform 1s, -webkit-transform 1s;
    transition: opacity 1s, transform 1s, -webkit-transform 1s;
    animation-timing-function: cubic-bezier(1, 0, 0.8, 1);}
.fadeinup.active{opacity: 1;transform: translateY(0);-webkit-transform: translateY(0);}

.fadeindown{position:relative;display:inline-block;opacity: 0;
    -webkit-transform: translateY(-50px);
    transform: translateY(-50px);
    -webkit-transition: opacity 1s, transform 1s, -webkit-transform 1s;
    -moz-transition: opacity 1s, transform 1s, -webkit-transform 1s;
    -o-transition: opacity 1s, transform 1s, -webkit-transform 1s;
    -ms-transition: opacity 1s, transform 1s, -webkit-transform 1s;
    transition: opacity 1s, transform 1s, -webkit-transform 1s;}
.fadeindown.active{opacity: 1;transform: translateY(0);-webkit-transform: translateY(0);}

.fadeinleft{opacity: 0;transform:translateX(-100%);}
.fadeinleft.active{opacity: 1;transform:translateX(0);transition:0.5s cubic-bezier(0.6, 0.08, 0, 0.5)}
.fadeinright{opacity: 0;transform:translateX(100%);}
.fadeinright.active{opacity: 1;transform:translateX(0);transition:0.5s cubic-bezier(0.6, 0.08, 0, 0.5)}

.head_type3.active{opacity: 1;color: #f8f5ec;animation-timing-function: cubic-bezier(1, 0, 0.8, 1);-webkit-transition: 3s; transition: 3s;}

/* G6: 모바일에서도 fadeinup 애니메이션 활성화 — opacity 0s 비활성 룰 제거됨 */