@charset "utf-8";

.delay01 {
	animation-delay: 0s;
}
.delay02 {
	animation-delay: 0.2s;
}
.delay03 {
	animation-delay: 0.8s;
}
.delay04 {
	animation-delay: 1.0s;
}
.delay05 {
	animation-delay: 1.2s;
}
.delay06 {
	animation-delay: 1.4s;
}
.delay07 {
	animation-delay: 1.6s;
}
.delay08 {
	animation-delay: 1.8s;
}

.fadeUp {
	animation-name: fadeUpAnime;
	animation-duration: 0.8s;
	animation-fill-mode: forwards;
	opacity: 0;
}

@keyframes fadeUpAnime {
	from {
		opacity: 0;
		transform: translateY(50px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* 右方向フェードイン */
.fadeLR {
	animation-name: fadeLRAnime;
	animation-duration: 1.2s;
	animation-fill-mode: forwards;
	opacity: 0;
}

@keyframes fadeLRAnime {
	from {
		opacity: 0;
		transform: translateX(-50px);
	}

	to {
		opacity: 1;
		transform: translateX(0);
	}
}

/* 左方向フェードイン */
.fadeRL {
	animation-name: fadeRLAnime;
	animation-duration: 1.2s;
	animation-fill-mode: forwards;
	opacity: 0;
}

@keyframes fadeRLAnime {
	from {
		opacity: 0;
		transform: translateX(50px);
	}

	to {
		opacity: 1;
		transform: translateX(0);
	}
}

.fadeUpTrigger {
	opacity: 0;
	/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
}

/*スクロールイベントここまで*/