﻿/* フロートヘッダー用 */
.headScroll {
	position: relative;
	z-index: 999;
}
.headFixed {
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 10000;
}
.headFixed_margin {
	height: 200px;
}


/*========= スクロール途中でヘッダーが表示＆非表示するためのCSS ===============*/

/*　上に上がる動き　*/
.float_upMove {
	animation: float_upAnime 1s forwards, float_upAnime2 0s forwards 1s;
}
@keyframes float_upAnime {
	from {
		opacity: 1;
		transform: translateY(0);
	}

	to {
		opacity: 0;
		transform: translateY(-100px);
	}
}
@keyframes float_upAnime2 {
	from {
		transform: scale(1, 1);
	}

	to {
		transform: scale(1, 0);	/* クリック回避 */
	}
}
/*　下に下がる動き　*/
.float_downMove {
	animation: float_downAnime 0.5s forwards;
}
@keyframes float_downAnime {
	from {
		opacity: 0;
		transform: translateY(-100px);
	}

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