/********************************************
 * Animation 
 * waypoints.js / gsap.js / ScrollToPlugin.js 필요
 * script.js에 
 ********************************************/
html [data-scroll] { transition: all 0.9s ease; } 
html [data-scroll="fade-up"] { transform: translate3d(0, 30px, 0); -webkit-transform: translate3d(0, 30px, 0); opacity: 0; } 
html [data-scroll="fade-down"] { transform: translate3d(0, -30px, 0); -webkit-transform: translate3d(0, -30px, 0); opacity: 0; }  
html [data-scroll^="fade"].animated { opacity: 1; transform: none; -webkit-transform: none; } 
html [data-delay="0.2s"] { transition-delay:0.2s}
html [data-delay="0.3s"] { transition-delay:0.3s}
html [data-delay="0.4s"] { transition-delay:0.4s}
html [data-delay="0.5s"] { transition-delay:0.5s}
html [data-delay="0.6s"] { transition-delay:0.6s}
/********************************************
  * 메인 비주얼 효과
********************************************/
.main-visual-txt-con .visual-txt-con h4 .char{
	animation: text-fade-out 1s cubic-bezier(0.4, 0, 0.2, 1) both; display:inline-block;
}
.slick-active .main-visual-txt-con .visual-txt-con h4 .char{
	animation: text-down-active-animation 2s cubic-bezier(0.4, 0, 0.2, 1) 0.5s both; display:inline-block;
}
.main-visual-txt-con .visual-txt-con h2 .char{
	animation: text-fade-out 1s cubic-bezier(0.4, 0, 0.2, 1) both; display:inline-block;
}
.slick-active .main-visual-txt-con .visual-txt-con h2 .char{
	animation: text-down-active-animation 2s cubic-bezier(0.4, 0, 0.2, 1) 0.5s both; display:inline-block;
}



@keyframes text-down-active-animation {
	from {
		opacity:0;filter:Alpha(opacity=0);
		-webkit-transform: translateY(-50px); 
		transform: translateY(-50px); 
	}
	to {
		opacity:1.0;filter:Alpha(opacity=100);
		-webkit-transform: translateY(0); 
		transform: translateY(0); 
	}
}

@keyframes text-up-active-animation {
	from {
		opacity:0;filter:Alpha(opacity=0);
		-webkit-transform: translateY(50px); 
		transform: translateY(50px); 
	}
	to {
		opacity:1.0;filter:Alpha(opacity=100);
		-webkit-transform: translateY(0); 
		transform: translateY(0); 
	}
}

@keyframes text-fade-out {
	from {
		opacity:1.0;filter:Alpha(opacity=100);
	}
	to {
		opacity:0;filter:Alpha(opacity=0);
	}
}