/*----------------------------------------
	animation keyframes
------------------------------------------*/

@keyframes rotation{
	0%{ transform: rotate(0);}
	100%{ transform: rotate(360deg); }
}
/* animation: rotation 60s linear infinite; */

@keyframes rotation_r{
	0%{ transform: rotate(0);}
	100%{ transform: rotate(-360deg); }
}
/* animation: rotation 60s linear infinite; */

@keyframes hor_move_l{
	0% {transform: translateX(0%);}
	100% {transform: translateX(-100%);}
}
/* animation: hor_move_l 60s linear infinite; */

@keyframes hor_move_r{
	0% {transform: translateX(-100%);}
	100% {transform: translateX(0%);}
}
/* animation: hor_move_r 60s linear infinite; */

@keyframes ver_move_t{
	0% {transform: translateY(0%);}
	100% {transform: translateY(-100%);}
}
/* animation: ver_move_t 60s linear infinite; */

@keyframes ver_move_b{
	0% {transform: translateY(-100%);}
	100% {transform: translateY(0%);}
}
/* animation: ver_move_b 60s linear infinite; */

@keyframes fade_out { 
	0% { filter: blur(0); opacity: 1; }
	100% { filter: blur(1); opacity: 0; visibility: hidden; } 
}
/* animation: fade_out 0.4s ease forwards; */

@keyframes rotation_loading_logo{
	0%{ transform: translateZ(0)  rotateY(0deg);}
	50%{ transform: translateZ(0) rotateY(180deg);}
	100%{ transform: translateZ(0) rotateY(360deg); }
}
/* animation: rotation_loading_logo 60s linear infinite; */

/*----------------------------------------
	common animation
------------------------------------------*/

.cmn_h_title {
	&.animate {
		&.type_img {
			img {transform: scale(0.8 , 1); opacity: 0;}
		}
		&.type_text {
			span {transform: scale(0.8 , 1); opacity: 0;}
		}
		&::before , &::after {opacity: 0;}
		&::before {transform: translate(-100% , 0%);}
		&::after {transform: translate(100% , 0%);}
		&.type_text {
			&::before {transform: translate(-100% , -20%);}
			&::after {transform: translate(100% , -20%);}
		}
		&.load_open , &.scroll_in {
			&.type_img {
				img { transform: scale(1 , 1); opacity: 1; transition: 1.6s var(--easeOutQuint);}
			}
			&.type_text {
				span { transform: scale(1 , 1); opacity: 1; transition: 1.6s var(--easeOutQuint);}
			}
			&::before , &::after {opacity: 1; transition: 1.6s var(--easeOutQuint);}
			&::before {transform: translate(-120% , 0%);}
			&::after {transform: translate(120% , 0%);}
			&.type_text {
				&::before {transform: translate(-120% , -20%);}
				&::after {transform: translate(120% , -20%);}
			}
		}
	}
}


/*----------------------------------------
	pages animation
------------------------------------------*/

/* fv teaser
------------------------------------------*/
#fv_teaser {
    &.animate {
		.cmn_bg_layer {
    	    .wave {
    	        &::before {transform: translateX(5%); opacity: 0;}
    	        &.tl {}
    	        &.br {}
    	    }
    	}
    	.cmn_main_layer.center_box { 
    	    .parts {
    	        .stars {
    	            &::before {transform: translate(0% , 0%) scale(0.7); opacity: 0;}
    	            &.tr {}
    	            &.bl {}
    	        }
    	    }
    	    .texts {
    	        .title {
    	            img {transform: scale(1.2); opacity: 0;}
    	        }
    	        .sub_text {
    	            img {transform: translateY(20%); opacity: 0;}
    	        }
    	    }
    	}
		&.load_open {
			.cmn_bg_layer {
    		    .wave {
    		        &::before {transform: translateX(0%); opacity: 1; transition: 3.0s var(--easeOutQuint);}
    		        &.tl {}
    		        &.br {}
    		    }
    		}
    		.cmn_main_layer.center_box { 
    		    .parts {
    		        .stars {
    		            &::before {transform: translate(0% , 0%) scale(1); opacity: 1; transition: 1.5s var(--easeOutQuint); transition-delay: 0s;}
    		            &.tr {}
    		            &.bl {}
    		        }
    		    }
    		    .texts {
    		        .title {
    		            img {transform: scale(1); opacity: 1; transition: 3.0s var(--easeOutQuint);}
    		        }
    		        .sub_text {
    		            img {transform: translateY(0%); opacity: 1; transition: 3.0s var(--easeOutQuint); transition-delay: 0.4s;}
    		        }
    		    }
    		}
		}
	}
}

/* comingsoon
-------------------------------*/
#comingsoon {
    .img_outer {
        &.animate {
			img {transform: translateY(50%); opacity: 0;}
			&.scroll_in {
				img {transform: translateY(0%); opacity: 1; transition: 1.6s var(--easeOutQuint);}
			}
		}
    }
}