/* =========================================================
   Reservation Floating Banner
========================================================= */

.reservation-float {

	position: fixed;

	right: 24px;
	bottom: 24px;

	z-index: 9999;

	width: 290px;

	padding: 22px 26px 20px;

	background: rgba(255, 255, 255, 0.97);

	border: 1px solid #b8a58d;

	box-shadow:
		0 8px 30px rgba(0, 0, 0, 0.08);

	text-align: center;

	opacity: 0;
	visibility: hidden;

	transform: translateY(15px);

	transition:
		opacity 0.5s ease,
		visibility 0.5s ease,
		transform 0.5s ease;

}


/* 表示 */

.reservation-float.is-visible {

	opacity: 1;
	visibility: visible;

	transform: translateY(0);

}


/* =========================================================
   Close
========================================================= */

.reservation-float__close {

	position: absolute;

	top: 8px;
	right: 9px;

	width: 22px;
	height: 22px;

	padding: 0;

	border: 0;

	background: transparent;

	cursor: pointer;

}


/* × */

.reservation-float__close span {

	position: absolute;

	top: 10px;
	left: 3px;

	width: 16px;
	height: 1px;

	background: #777;

}


.reservation-float__close span:first-child {

	transform: rotate(45deg);

}


.reservation-float__close span:last-child {

	transform: rotate(-45deg);

}


/* =========================================================
   English
========================================================= */

.reservation-float__en {

	margin-bottom: 9px;

	font-family:
		"Playfair Display",
		"Cormorant Garamond",
		Georgia,
		serif;

	font-size: 12px;

	letter-spacing: 0.15em;

	color: #8b7355;

}


/* =========================================================
   Copy
========================================================= */

.reservation-float__copy {

	margin: 0 0 14px;

	font-size: 13px;

	line-height: 1.7;

	letter-spacing: 0.08em;

	color: #444;

}


/* =========================================================
   Link
========================================================= */

.reservation-float__link {

	display: inline-flex;

	align-items: center;
	justify-content: center;

	gap: 14px;

	min-width: 125px;

	padding: 7px 0;

	border-bottom: 1px solid #8b7355;

	color: #555;

	font-family:
		"Playfair Display",
		"Cormorant Garamond",
		Georgia,
		serif;

	font-size: 11px;

	letter-spacing: 0.14em;

	text-decoration: none;

	transition:
		color 0.3s ease,
		gap 0.3s ease;

}


.reservation-float__link:hover {

	color: #8b7355;

	gap: 20px;

}


.reservation-float__arrow {

	transition: transform 0.3s ease;

}


.reservation-float__link:hover
.reservation-float__arrow {

	transform: translateX(3px);

}


/* =========================================================
   Mobile
========================================================= */

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

	.reservation-float {

		right: 16px;
		bottom: 16px;

		width: 230px;

		padding: 15px 18px 13px;

	}


	.reservation-float__en {

		margin-bottom: 5px;

		font-size: 9px;

		letter-spacing: 0.13em;

	}


	.reservation-float__copy {

		margin-bottom: 8px;

		font-size: 11px;

		line-height: 1.55;

	}


	.reservation-float__link {

		min-width: 105px;

		padding: 5px 0;

		font-size: 9px;

		gap: 10px;

	}


	.reservation-float__close {

		top: 5px;
		right: 7px;

		width: 20px;
		height: 20px;

	}


	.reservation-float__close span {

		top: 9px;

		width: 14px;

	}

}