/*
 * プロジェクト全般のアニメーション設定
 */

/* 画面表示時のアニメーション設定 */
body {
	color: #333;
	font-family: "Yu Gothic", sans-serif, YuGothic;
	font-size: 1rem;
	height: 100%;
	left: 0;
	top: 0;
	width: 100%;
}

.fade-in {
	animation: fade_in 1s ease-in;
}
@keyframes fade_in {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

.fade-up {
	animation-delay: .3s;
	animation-duration: 1s;
	animation-fill-mode: forwards;
	animation-name: fadeUpAnime;
	opacity: 0;
}
@keyframes fadeUpAnime {
	from {
		opacity: 0;
		transform: translateY(100px);
	}

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

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