@charset "UTF-8";

.floating-bar {
	display: none;
}

@media screen and (max-width: 767px) {

	body {
		padding-bottom: 80px;
	}

	.page_top {
		display: none !important;
	}
	.floating-bar,
	.floating-bar * {
		box-sizing: border-box;
		margin: 0;
		padding: 0;
	}

	.floating-bar {
		display: block;
		position: fixed;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 80px;
		overflow: hidden;
		z-index: 99;
		background: rgba(255, 255, 255, 0.98);
		box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.08);
		padding: 12px 16px;
	}

	.floating-bar__inner {
		display: flex;
		align-items: center;
		gap: 16px;
		max-width: 500px;
		margin: 0 auto;
	}

	/* ボタンの共通スタイル */
	.floating-bar__btn {
		flex: 1;
		display: flex;
		align-items: center;
		justify-content: center;
		height: 56px;
		color: #fff !important;
		font-size: 14px;
		font-weight: bold;
		text-decoration: none;
		text-align: center;
		letter-spacing: 0.05em;
		transition: background-color 0.3s, opacity 0.3s;
	}

	.floating-bar__btn:active {
		opacity: 0.8;
		text-decoration: none;
	}

	.floating-bar__pagetop {
		display: flex;
		justify-content: center;
		align-items: center;
		background-color: #006115;
		border-radius: 50%;
		width: 40px;
		height: 40px;
	}

	.floating-bar__pagetop img {
		max-width: 100%;
	}

}