/* スクロールアップ */
.scroll_up {
   transition: 0.8s ease-in-out;
   transform: translateY(30px);
   opacity: 0;
 }
.scroll_up.on {
   transform: translateY(0);
   opacity: 1.0;
 }

/*----------------------------
scroll_left ｜左から出現
----------------------------*/
.scroll_left {
   -webkit-transition: 0.8s ease-in-out;
   -moz-transition: 0.8s ease-in-out;
   -o-transition: 0.8s ease-in-out;
   transition: 0.8s ease-in-out;
   transform: translateX(-30px);
   opacity: 0;
   filter: alpha(opacity=0);
   -moz-opacity: 0;
}
.scroll_left.on {
   opacity: 1.0;
   filter: alpha(opacity=100);
   -moz-opacity: 1.0;
   transform: translateX(0);
}
.scroll_left {
   -webkit-transition: 0.8s ease-in-out;
   -moz-transition: 0.8s ease-in-out;
   -o-transition: 0.8s ease-in-out;
   transition: 0.8s ease-in-out;
   transform: translateX(-30px);
   opacity: 0;
   filter: alpha(opacity=0);
   -moz-opacity: 0;
}
.scroll_left.on {
   opacity: 1.0;
   filter: alpha(opacity=100);
   -moz-opacity: 1.0;
   transform: translateX(0);
}