/* ===============================================
フッターの設定
=============================================== */
.global-footer {
	width: 100%;
	height: 100px;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #905130;
}
.copyrigth {
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
	font-size: 1.6rem;
	line-height: 1.7;
	letter-spacing: 0;
	color: #fff;
}

/* トップに戻る */
#page-top {
	display: none;
	position: fixed;
	right: 0;
	bottom: 20px;
	z-index: 9;
	margin: 0;
}
#move-page-top {
	display: block;
	cursor: pointer;
}
#move-page-top a:hover {
	opacity: 1.0; /* ポインタを重ねたときの透明度 */
}
#page-top img {
	width: 120px;
	height: auto;
}
@media(max-width:768px) {
	#page-top img {
		width: 100px;
	}
}


/* ===============================================
はにわくんアニメーション
=============================================== */
/* お散歩はにわくん */
.footer-animation {
	position: relative;
	margin: 150px auto auto;
	width: 100%;
	height: 100px;
}
.haniwa-sanpo {
	position: absolute;
	bottom: 0;
	left: 80%;
	transform: translateX(-100%);
	z-index: 1;
	background: url("../images/haniwa_sanpo.png") no-repeat left bottom / auto 100px;
	width: 150px;
	height: 100px;
	animation: sanpo 20s steps(22) infinite, sanpoaction 40s ease-in-out infinite;
}
@keyframes sanpo {
	to {
		background-position: calc(-150px * 22) 0;
	}
}
@keyframes sanpoaction {
	0% {left: 80%; transform: translateX(-100%);}
	16% {left: 20%; transform: translateX(0);}
	32% {left: 20%; transform: translateX(0);}
	50% {left: 80%; transform: translateX(-100%);}
	70% {left: 60%; transform: translateX(-100%); opacity: 1;}
	71% {opacity: 0;}
	89% {left: 60%; transform: translateX(-100%); opacity: 0;}
	90% {left: 60%; transform: translateX(-100%); opacity: 1;}
	100% {left: 80%; transform: translateX(-100%);}
}
@media(max-width:768px) {
	.footer-animation {
		margin: 30px auto auto;
		
	}
	.haniwa-sanpo {
		background: url("../images/haniwa_sanpo.png") no-repeat left bottom / auto 80px;
		width: 120px;
		height: 80px;
		animation: sanpo 20s steps(22) infinite, sanpoaction 20s ease-in-out infinite;
	}
	@keyframes sanpo {
		to {
			background-position: calc(-120px * 22) 0;
		}
	}
	@keyframes sanpoaction {
		0% {left: 95%; transform: translateX(-100%);}
		16% {left: 5%; transform: translateX(0);}
		32% {left: 5%; transform: translateX(0);}
		50% {left: 95%; transform: translateX(-100%);}
		70% {left: 60%; transform: translateX(-100%); opacity: 1;}
		71% {opacity: 0;}
		89% {left: 60%; transform: translateX(-100%); opacity: 0;}
		90% {left: 60%; transform: translateX(-100%); opacity: 1;}
		100% {left: 95%; transform: translateX(-100%);}
	}
}

/* 背景の工場 */
.haniwa_kojo {
	position: absolute;
	bottom: 0;
	left: 70%;
	transform: translateX(-100%);
	z-index: 0;
	background: url("../images/haniwa_kojo.png") no-repeat left bottom / auto 120px;
	width: 330px;
	height: 120px;
}

@media(max-width:768px) {
	.haniwa_kojo {
		background: url("../images/haniwa_kojo.png") no-repeat left bottom / auto 80px;
		width: 220px;
		height: 80px;
	}
}
