@charset "UTF-8";
/* ==========================================================================
   フローティングバナー
   PC : 右サイド固定（WEB予約）
   SP : 下部固定 3ボタン（電話する / アクセス / WEB予約）
   ※ common.css / sp.css は変更していません。本ファイルの追加のみで完結します。
   ※ 既存ブレイクポイント（767px）・既存ユーティリティ（.pc / .sp）に準拠
   ========================================================================== */

/* --------------------------------------------------------------------------
   PC：右サイド固定バナー
   -------------------------------------------------------------------------- */
.floating-side {
	position: fixed;
	top: 50%;
	right: 0;
	z-index: 9990;
	transform: translateY(-50%);
	transition: 0.2s ease-in-out;
}
.floating-side a {
	display: block;
	line-height: 0;
	text-decoration: none;
}
.floating-side img {
	width: 60px;
}

/* --------------------------------------------------------------------------
   SP：下部固定ボタン
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {

	.floating-foot {
		position: fixed;
		left: 0;
		bottom: 0;
		z-index: 9990;
		width: 100%;
		background: #fff;
		border-top: 1px solid #E3ECEE;	/* ボタンエリア全体の外枠 */
		padding-bottom: env(safe-area-inset-bottom);	/* iPhone ホームバー対応 */
	}
	.floating-foot ul {
		display: flex;
		justify-content: space-between;
		align-items: stretch;
	}
	.floating-foot li {
		width: calc(100% / 3);
	}
	.floating-foot li a {
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		width: 100%;
		height: 100%;
		padding: 0.6em 0.2em;
		font-size: 1.2rem;
		font-weight: bold;
		line-height: 1.3;
		letter-spacing: 0;
		text-align: center;
		text-decoration: none;
	}
	.floating-foot li a i {
		margin-bottom: 3px;
		font-size: 1.8rem;
		line-height: 1;
	}

	/* 各ボタンの配色 */
	.floating-foot .item-tel a {
		color: #236471;
		background: #EAF7FA;
	}
	.floating-foot .item-access a {
		color: #58747B;
		background: #FFFFFF;
		border-left: 1px solid #D8E7EA;	/* アクセスのみ個別枠線 */
		border-right: 1px solid #D8E7EA;
	}
	.floating-foot .item-yoyaku a {
		color: #FFFFFF;
		background: #45B5CD;
	}

	/* 既存の電話固定バナーを非表示（新フローティングと重複するため） */
	#tel-fixed {
		display: none !important;
	}

	/* ページトップボタンをフローティング分だけ持ち上げ */
	footer .pagetop.fixed {
		bottom: 70px;
	}
}
