@charset "utf-8";

.slide-top {
	opacity: 0;
	transform: translate(0, -20px);
	transition: all 0.3s 0.3s ease-out;
 }

.slide-bottom {
	opacity: 0;
	transform: translate(0, 20px);
	transition: all 0.3s 0.3s ease-out;
 }

.slide-left {
	opacity: 0;
	transform: translate(-30px, 0);
	transition: all 0.3s 1s ease-out;
 }

.slide-right {
	opacity: 0;
	transform: translate(30px, 0);
	transition: all 0.3s 1s ease-out;
 }


 /* 時差クラス */ 

 .trans1 {
  transition: all 0.3s 0.2s ease-out;
 }

 .trans2 {
  transition: all 0.3s 0.4s ease-out;
 }

 .trans3 {
  transition: all 0.3s 0.6s ease-out;
 }

 .trans4 {
  transition: all 0.3s 0.8s ease-out;
 }
 
 .trans5 {
  transition: all 0.3s 1.0s ease-out;
 }

 .trans6 {
  transition: all 0.3s 1.2s ease-out;
 }