@charset "utf-8";
.fadeup{
	opacity: 0;
}
.fadeup.anim_active{
	animation: fadeup .4s ease-in-out forwards;
}
@-webkit-keyframes fadeup{
	0%{
		opacity: 0;
		transform: translateY(30px);
	}
	100%{
		opacity: 1;
		transform: translateY(0);
	}
}
@keyframes fadeup{
	0%{
		opacity: 0;
		transform: translateY(30px);
	}
	100%{
		opacity: 1;
		transform: translateY(0);
	}
}

/*||||||||||||||||||||||||||||||||||||||||||||||||||

HOME KEY VISUAL

||||||||||||||||||||||||||||||||||||||||||||||||||||*/
#topHeroCover{
	opacity: 0;
}
/* 白背景・ぼかし背面・画像をまとめて1枚のレイヤーとして表示／消去する */
#topHeroCover.kv_zoomin{
	animation: kv_fadein .4s ease-out forwards;
}
/* ズームは前面の画像のみに効かせる（背面のぼかしは動かさない） */
#topHeroCover.kv_zoomin img{
	animation: kv_zoomin .4s ease-out forwards;
}
/* kv_zoomin より後に記述すること（両方のクラスが付いた時にこちらを優先させる） */
#topHeroCover.kv_fadeout{
	animation: kv_fadeout .4s ease-in forwards;
}
@-webkit-keyframes kv_fadein{
	0%{
		opacity: 0;
	}
	100%{
		opacity: 1;
	}
}
@keyframes kv_fadein{
	0%{
		opacity: 0;
	}
	100%{
		opacity: 1;
	}
}
@-webkit-keyframes kv_zoomin{
	0%{
		transform: scale(1.08);
	}
	100%{
		transform: scale(1);
	}
}
@keyframes kv_zoomin{
	0%{
		transform: scale(1.08);
	}
	100%{
		transform: scale(1);
	}
}
@-webkit-keyframes kv_fadeout{
	0%{
		opacity: 1;
	}
	100%{
		opacity: 0;
	}
}
@keyframes kv_fadeout{
	0%{
		opacity: 1;
	}
	100%{
		opacity: 0;
	}
}