/* 画面外にいる状態 */
.fadein_scale {
transition-property:all;
transition-duration:2500ms;
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
opacity : 1;
-moz-transform: translate(0px,30px);
-webkit-transform: translate(0px,30px);
-o-transform: translate(0px,30px);
-ms-transform: translate(0px,30px);
transform : translate(0px, 30px);
transform: scale(1.1);
}
/* 画面内に入った状態 */
.fadein_scale.scrollin {
opacity : 1;
transform: scale(1); 
-moz-transform: translate(0px,0px);
-webkit-transform: translate(0px,0px);
-o-transform: translate(0px,0px);
-ms-transform: translate(0px,0px);
transform : translate(0, 0px);
}


/* 画面外にいる状態 */
.fadein {
transition-property:all;
transition-duration:2800ms;
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
opacity : 0;
-moz-transform: translate(0px,30px);
-webkit-transform: translate(0px,30px);
-o-transform: translate(0px,30px);
-ms-transform: translate(0px,30px);
transform : translate(0px, 30px);
}


/* 画面内に入った状態 */
.fadein.scrollin {
opacity : 1;
-moz-transform: translate(0px,0px);
-webkit-transform: translate(0px,0px);
-o-transform: translate(0px,0px);
-ms-transform: translate(0px,0px);
transform : translate(0, 0px);
}




.fadein_kotei {
transition-property:opacity, transform;
transition-duration:700ms;
transition-timing-function:ease-in;
opacity : 0;
-moz-transform: translate(0px,0px);
-webkit-transform: translate(0px,0px);
-o-transform: translate(0px,0px);
-ms-transform: translate(0px,0px);
transform : translate(0, 0px);
}



/* 画面内に入った状態 */
.fadein_kotei.scrollin {
opacity : 1;
-moz-transform: translate(0px,0px);
-webkit-transform: translate(0px,0px);
-o-transform: translate(0px,0px);
-ms-transform: translate(0px,0px);
transform : translate(0, 0px);
}



/* 画面外にいる状態 */
/*逆　上から下*/
.fadein_reverse {
transition-property:opacity, transform;
transition-duration:2000ms;
opacity : 0;
-moz-transform: translate(0px,-40px);
-webkit-transform: translate(0px,-40px);
-o-transform: translate(0px,-40px);
-ms-transform: translate(0px,-40px);
transform : translate(0, -40px);
}
.fadein_reverse.scrollin {
opacity : 1;
-moz-transform: translate(0px,0px);
-webkit-transform: translate(0px,0px);
-o-transform: translate(0px,0px);
-ms-transform: translate(0px,0px);
transform : translate(0, 0px);
}



/* 画面外にいる状態 */
/*逆　右下*/
.fadein_right_down {
transition-property:opacity, transform;
transition-duration:1500ms;
opacity : 0;
-moz-transform: translate(20px,20px);
-webkit-transform: translate(20px,20px);
-o-transform: translate(20px,20px);
-ms-transform: translate(20px,20px);
transform : translate(20px,20px);
}


/* 画面内に入った状態 */
.fadein_right_down.scrollin {
opacity : 1;
-moz-transform: translate(0px,0px);
-webkit-transform: translate(0px,0px);
-o-transform: translate(0px,0px);
-ms-transform: translate(0px,0px);
transform : translate(0, 0px);
}


/* 画面外にいる状態 */
/*逆　左上*/
.fadein_left_up {
transition-property:opacity, transform;
transition-duration:1500ms;
opacity : 0;
-moz-transform: translate(-20px,-20px);
-webkit-transform: translate(-20px,-20px);
-o-transform: translate(-20px,-20px);
-ms-transform: translate(-20px,-20px);
transform : translate(-20px,-20px);
}


/* 画面内に入った状態 */
.fadein_left_up.scrollin {
opacity : 1;
-moz-transform: translate(0px,0px);
-webkit-transform: translate(0px,0px);
-o-transform: translate(0px,0px);
-ms-transform: translate(0px,0px);
transform : translate(0, 0px);
}


/* 画面外にいる状態 */
.fadein_1500 {
transition-property:opacity, transform;
transition-duration:1500ms;
opacity : 0;
-moz-transform: translate(0px,60px);
-webkit-transform: translate(0px,60px);
-o-transform: translate(0px,60px);
-ms-transform: translate(0px,60px);
transform : translate(0, 60px);
}


/* 画面内に入った状態 */
.fadein_1500.scrollin {
opacity : 1;
-moz-transform: translate(0px,0px);
-webkit-transform: translate(0px,0px);
-o-transform: translate(0px,0px);
-ms-transform: translate(0px,0px);
transform : translate(0, 0px);
}


/* 画面外にいる状態 */
/*逆　上から下*/
.fadein_reverse_1500 {
transition-property:opacity, transform;
transition-duration:1500ms;
opacity : 0;
-moz-transform: translate(0px,-60px);
-webkit-transform: translate(0px,-60px);
-o-transform: translate(0px,-60px);
-ms-transform: translate(0px,-60px);
transform : translate(0, -60px);
}


/* 画面内に入った状態 */
.fadein_reverse_1500.scrollin {
opacity : 1;
-moz-transform: translate(0px,0px);
-webkit-transform: translate(0px,0px);
-o-transform: translate(0px,0px);
-ms-transform: translate(0px,0px);
transform : translate(0, 0px);
}



.delay_01{
transition-delay:0.7s;
-webkit-transition-delay:0.7s;
}
.delay_02{
transition-delay:1.0s;
-webkit-transition-delay:1.0s;
}
.delay_03{
transition-delay:1.3s;
-webkit-transition-delay:1.3s;
}




/* 画面外にいる状態 */
/*逆　上から下*/
.sayuu_hanten {
transition-property:opacity, transform;
transition-duration:1500ms;
opacity : 0;
transform: scale(-1, 1);
-webkit-transform: scale(-1, 1);
-ms-transform: scale(-1, 1);
}


/* 画面内に入った状態 */
.sayuu_hanten.scrollin {
opacity : 1;
transform: scale(1, 1);
-webkit-transform: scale(1, 1);
-ms-transform: scale(1, 1);
}


/* 画面内に入った状態 */
.scrollin {
opacity : 1;
-moz-transform: translate(0px,0px);
-webkit-transform: translate(0px,0px);
-o-transform: translate(0px,0px);
-ms-transform: translate(0px,0px);
transform : translate(0, 0px);
}

