@-webkit-keyframes slideUp {
	from { opacity:0;-webkit-transform: translate3d(0,30px,0); }
	to { opacity:1;-webkit-transform: translate3d(0,0,0); }
}
@-moz-keyframes slideUp {
	from { opacity:0;-moz-transform: translate3d(0,30px,0); }
	to { opacity:1;-moz-transform: translate3d(0,0,0); }
}
@-o-keyframes slideUp {
	from { opacity:0;-o-transform: translate3d(0,30px,0); }
	to { opacity:1;-o-transform: translate3d(0,0,0); }
}
@keyframes slideUp {
	from { opacity:0;transform: translate3d(0,30px,0); }
	to { opacity:1;transform: translate3d(0,0,0); }
}


@-webkit-keyframes slideLeft {
	from { opacity:0;-webkit-transform: translate3d(30px,0,0); }
	to { opacity:1;-webkit-transform: translate3d(0,0,0); }
}
@-moz-keyframes slideLeft {
	from { opacity:0;-moz-transform: translate3d(30px,0,0); }
	to { opacity:1;-moz-transform: translate3d(0,0,0); }
}
@-o-keyframes slideLeft {
	from { opacity:0;-o-transform: translate3d(30px,0,0); }
	to { opacity:1;-o-transform: translate3d(0,0,0); }
}
@keyframes slideLeft {
	from { opacity:0;transform: translate3d(30px,0,0); }
	to { opacity:1;transform: translate3d(0,0,0); }
}


@-webkit-keyframes slideRight {
	from { opacity:0;-webkit-transform: translate3d(-30px,0,0); }
	to { opacity:1;-webkit-transform: translate3d(0,0,0); }
}
@-moz-keyframes slideRight {
	from { opacity:0;-moz-transform: translate3d(-30px,0,0); }
	to { opacity:1;-moz-transform: translate3d(0,0,0); }
}
@-o-keyframes slideRight {
	from { opacity:0;-o-transform: translate3d(-30px,0,0); }
	to { opacity:1;-o-transform: translate3d(0,0,0); }
}
@keyframes slideRight {
	from { opacity:0;transform: translate3d(-30px,0,0); }
	to { opacity:1;transform: translate3d(0,0,0); }
}


@-webkit-keyframes fadeScaleIn {
	from { opacity:0;-webkit-transform: scale(1.1); }
	to { opacity:1;-webkit-transform: scale(1);}
}
@-moz-keyframes fadeScaleIn {
	from { opacity:0;-moz-transform: scale(1.1); }
	to { opacity:1;-moz-transform: scale(1);}
}
@-o-keyframes fadeScaleIn {
	from { opacity:0;-o-transform: scale(1.1); }
	to { opacity:1;-o-transform: scale(1);}
}
@keyframes fadeScaleIn{
	from {opacity:0; transform:scale(1.1);}
	to {opacity:1; transform:scale(1);}
}

.animate{opacity: 0}
.animate.slideUp {opacity: 1; animation: slideUp .7s forwards cubic-bezier(0.12, 0.4, 0.41, 0.86);}
.animate.slideLeft {opacity: 1; animation: slideLeft .7s forwards cubic-bezier(0.12, 0.4, 0.41, 0.86); }
.animate.slideRight {opacity: 1; animation: slideRight .7s forwards cubic-bezier(0.12, 0.4, 0.41, 0.86);}
.animate.fadeScaleIn {opacity: 1; animation: fadeScaleIn .6s forwards cubic-bezier(0, 0.35, 0, 1);}

/* 이미지 애니메이션 */
.motion-zoom {overflow: hidden;}
.motion-zoom img{opacity: 0;
	-webkit-transform: scale(1.15);
	-ms-transform: scale(1.15);
	transform: scale(1.15);
	-webkit-transition: opacity 1.1s ease 167ms, -webkit-transform 1.1s ease-out;
	transition: opacity 1.1s ease 167ms, -webkit-transform 1.1s ease-out;
	transition: transform 1.1s ease-out, opacity 1.1s ease 167ms;
	transition: transform 1.1s ease-out, opacity 1.1s ease 167ms, -webkit-transform 1.1s ease-out;
}
.motion-zoom.animated img {opacity: 1;-webkit-transform: scale(1);-ms-transform: scale(1);transform: scale(1);}

.motion-slide {position: relative; overflow: hidden; background:none;}
.motion-slide img {opacity:0;
	-webkit-clip-path: polygon(0 0,0 0,0 100%,0 100%);
	clip-path: polygon(0 0,0 0,0 100%,0 100%);
	-webkit-transition: clip-path 1.1s cubic-bezier(.19,1,.22,1),opacity 1.1s ease 167ms,-webkit-clip-path 1.1s cubic-bezier(.19,1,.22,1);
	transition: clip-path 1.1s cubic-bezier(.19,1,.22,1),opacity 1.1s ease 167ms,-webkit-clip-path 1.1s cubic-bezier(.19,1,.22,1);
}
.motion-slide.animated img {
	opacity:1;
	-webkit-clip-path: polygon(0 0,100% 0,100% 100%,0 100%);
	clip-path: polygon(0 0,100% 0,100% 100%,0 100%);
}

