/* base */
.js_in ,
.js_List_in ,
.js_List_in_reverse {
}
.js_in,
.js_List_in .Target {
}
.js_List_in .Target.active {
}

/* Type */
.js_Fadein {
	transition: opacity .6s;
	opacity:0;
}
.js_Fadein.active {
	opacity:1;
}
.js_Fadein_Delay {
	transition: opacity .6s;
    transition-delay : .4s;
    transition-timing-function : ease-out;
	opacity:0;
}
.js_Fadein_Delay.active {
	opacity:1;
}
.js_upin {
	transition: opacity 1s, transform .8s;
	transition-delay: .3s;
	opacity: 0;
	transform: translateY(30px);
}
.js_upin.active {
	opacity: 1;
	transform: translateY(0);
}
.js_Slidein {
	transition: opacity .6s, transform 1s;
	opacity: 0;
	transform: translateX(-50%);
}
.js_SlideinR {
	transition: opacity .6s, transform 1s;
	opacity: 0;
	transform: translateX(50%);
}
.js_Slidein.active ,
.js_SlideinR.active {
	opacity: 1;
	transform: translateX(0);
}
/* switch */
.js_Switch{}

/* ------------------------------------------------------------------------
    animation
------------------------------------------------------------------------  */
.ani_scale_in {
	animation-name: is-scale;
	animation-duration: 1s;
	animation-timing-function:ease;
	animation-delay: .8s;
}
@keyframes is_scale {
	0% {
		transform: scale(1,1);
	}
	50% {
		transform: scale(1,0);
	}
	100%{
		transform: scale(0,0);
	}
}
@keyframes is_swipe {
	0% {
        transform: rotate(0);
	}
	25% {
        transform: rotate(10deg);
	}
    50% {
        transform: rotate(-10deg);
	}
    75% {
        transform: rotate(10deg);
	}
	100%{
        transform: rotate(0);
	}
}

/* ------------------------------------------------------------------------
    Body
------------------------------------------------------------------------  */ 
body {
	position: relative;
}
body:after {
	width: 100%;
	height: 100%;
	visibility: hidden;
	position: absolute;
	background-color: rgba(0,0,0,0.3);
	content: '';
	left: 0;
	top: 0;
	z-index: 11;
	opacity: 0;
	transition: all .6s 0s ease;
}
body.overlay:after {
	visibility: inherit;
	opacity: 1;
}