@charset "utf-8";
/* =====================================================================
   header-general.css  ／  共通ヘッダー・スライドメニュー（header-general.php）

   ・間隔はすべて rem（1rem = 16px）。ボタン内側は em
   ・文字サイズ／色／フォントは style.css の変数（--fs**, --main-color 等）に準拠
   ・ヘッダーの色はすべて下の「ページごとの見た目」の変数から派生させています
   ===================================================================== */

/* =====================================================================
   ページごとの見た目
   ここだけ見れば、どのページでヘッダーがどう見えるか分かります。
   ページが増えたらセレクタを1行足すだけです。
   （body に slug クラスを出しています → body.page-contact など）
   ===================================================================== */

/* 既定：背後がFV画像 → 透過・白抜き・下線は白の半透明 */
.l-header2 {
	--hd-fg:      #fff;                  /* ナビ・アイコン */
	--hd-logo:    #fff;                  /* ロゴ */
	--hd-line:    rgba(255, 255, 255, 0.6); /* 斜線・区切りの縦線 */
	--hd-bg:      transparent;           /* ヘッダーの背景 */
	--hd-border:  rgba(255, 255, 255, 0.45); /* 下の境界線 */
	--hd-accent:  #c9ad83;               /* 検索ボタン等のベージュ */
}

/* FV を通り過ぎた後（原本の .is-scrolled と同じ配色） */
.l-header2.is-scrolled {
	--hd-fg:      #333;
	--hd-logo:    var(--main-color);
	--hd-line:    #ccc;
	--hd-bg:      #fff;
	--hd-border:  #eee;
}

/* 最初から背景色で塗られているページ（カンプ準拠） */
.page-contact .l-header2,
.page-flow    .l-header2,
.page-information .l-header2,
.page-faq         .l-header2,
.page-hotellist   .l-header2,
.blog             .l-header2,
.single-post      .l-header2 {
	--hd-fg:      var(--main-color);
	--hd-logo:    var(--main-color);
	--hd-line:    #C9C4BE;
	--hd-bg:      var(--back-color);
	--hd-border:  #C9C4BE;
}

/* =====================================================================
   ヘッダー
   ===================================================================== */
.l-header2 {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 200;
	width: 100%;
	background-color: var(--hd-bg);
	border-bottom: 1px solid var(--hd-border);
	color: var(--hd-fg);
	font-family: var(--font-jp);
	transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}
/* 高さは固定。各ページはこの分だけ上に余白を空けます
   （contact.css の --contact-header-h / flow.css の --flow-header-h と揃える） */
.l-header2__inner {
	display: flex;
	align-items: center;
	gap: 1.875rem;
	width: 92%;
	max-width: 87.5rem;
	padding: 1.125rem 0;
	margin: 0 auto;
}

/* --- ロゴ ---------------------------------------------------------- */
/* 白ロゴ1枚をマスクとして使い、色は --hd-fg から取る。
   これで白／紺の2枚を持たずに済みます。 */
.l-header2__logo {
	position: relative;
	display: block;
	flex: 0 0 auto;
	width: 9.5rem; /* 152 × 45.17px */
	aspect-ratio: 730 / 217;
	background-color: var(--hd-logo);
	-webkit-mask-image: url("../img/kumamoto-namikizaka/about-logo.webp");
	        mask-image: url("../img/kumamoto-namikizaka/about-logo.webp");
	-webkit-mask-repeat: no-repeat;
	        mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	        mask-size: contain;
	-webkit-mask-position: left center;
	        mask-position: left center;
	transition: background-color 0.3s ease, opacity 0.3s ease;
	-webkit-tap-highlight-color: transparent;
}
.l-header2__logo:hover {
	opacity: 0.8;
}
.l-header2__logo-text {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

/* --- ロゴ右の斜線 --------------------------------------------------- */
.l-header2__slash {
	flex: 0 0 auto;
	width: 1px;
	height: 2.125rem;
	margin-left: 0.5rem;
	background-color: var(--hd-line);
	transform: skewX(-15deg);
	transition: background-color 0.3s ease;
}

/* --- ナビ ---------------------------------------------------------- */
.l-header2__nav {
	flex: 1 1 auto;
}
.l-header2__nav ul {
	display: flex;
	justify-content: center;
	gap: 1.875rem;
	list-style: none;
	margin: 0;
	padding: 0;
}
.l-header2__nav a {
	color: var(--hd-fg);
	text-decoration: none;
	font-size: var(--fs15);
	white-space: nowrap;
	transition: color 0.3s ease, opacity 0.3s ease;
	-webkit-tap-highlight-color: transparent;
}
.l-header2__nav a:hover {
	opacity: 0.6;
}

/* --- 右側（お問い合わせ・言語・メニュー） --------------------------- */
.l-header2__right {
	display: flex;
	align-items: center;
	gap: 1.125rem;
	margin-left: auto;
	flex: 0 0 auto;
}
.l-header2__contact {
	padding: 0.5em 1.5em;
	border: 1px solid var(--hd-fg);
	border-radius: 20px;
	color: var(--hd-fg);
	text-decoration: none;
	font-size: var(--fs14);
	line-height: 1;
	white-space: nowrap;
	transition: color 0.3s ease, border-color 0.3s ease, opacity 0.3s ease;
	-webkit-tap-highlight-color: transparent;
}
.l-header2__contact:hover {
	opacity: 0.6;
}
.l-header2__divider {
	width: 1px;
	height: 1.125rem;
	background-color: var(--hd-line);
	transition: background-color 0.3s ease;
}
.l-header2__lang,
.l-header2__menu-btn {
	padding: 0;
	border: none;
	background: none;
	color: var(--hd-fg);
	cursor: pointer;
	transition: color 0.3s ease, opacity 0.3s ease;
	-webkit-tap-highlight-color: transparent;
}
.l-header2__lang:hover,
.l-header2__menu-btn:hover {
	opacity: 0.6;
}
.l-header2__lang {
	font-size: var(--fs18);
}
.l-header2__menu-btn {
	font-family: var(--font-en);
	font-size: var(--fs20);
	line-height: 1;
	letter-spacing: 0.125rem;
	/* letter-spacing は最後の文字の右にも入るので、その分だけ戻して
	   メニュー展開時の ✕ と字面の右端を揃える */
	margin-right: -0.125rem;
}

/* =====================================================================
   スライドメニュー
   ===================================================================== */
/* スクロールは中身側だけ。パネル全体をスクロールさせると
   スクロールバーのぶん上部バーが狭まり、ヘッダーとボタン位置がズレます。 */
.l-slidemenu {
	position: fixed;
	inset: 0;
	z-index: 300;
	display: flex;
	flex-direction: column;
	background-color: #282828;
	color: #fff;
	font-family: var(--font-jp);
	overflow: hidden;
	transform: translateX(100%);
	transition: transform 0.4s ease;
}
.l-slidemenu.is-open {
	transform: translateX(0);
}
.l-slidemenu a {
	color: #fff;
	text-decoration: none;
	transition: opacity 0.3s;
	-webkit-tap-highlight-color: transparent;
}
.l-slidemenu a:hover {
	opacity: 0.6;
}

/* --- 上部バー ------------------------------------------------------ */
/* 高さ・左右位置ともヘッダーと一致させる。
   padding の式は .l-header2__inner の「width:92% / max-width:87.5rem / 中央寄せ」と同値。 */
.l-slidemenu__top {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.25rem;
	padding: 1.125rem max(4%, calc((100% - 87.5rem) / 2));
	border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}
.l-slidemenu__logo {
	flex: 0 0 auto;
}
.l-slidemenu__logo img {
	display: block;
	width: 9.5rem;
	height: auto;
}
.l-slidemenu__slash {
	width: 1px;
	height: 2.5rem;
	background-color: rgba(255, 255, 255, 0.4);
	transform: skewX(-20deg);
}
.l-slidemenu__top-right {
	display: flex;
	align-items: center;
	gap: 1.125rem;
	margin-left: auto;
}
.l-slidemenu__contact {
	padding: 0.5em 1.5em;
	border: 1px solid #fff;
	border-radius: 20px;
	font-size: var(--fs14);
	line-height: 1;
	white-space: nowrap;
}
.l-slidemenu__divider {
	width: 1px;
	height: 1.125rem;
	background-color: rgba(255, 255, 255, 0.4);
}
.l-slidemenu__lang,
.l-slidemenu__close {
	padding: 0;
	border: none;
	background: none;
	color: #fff;
	font-size: var(--fs18);
	cursor: pointer;
	transition: opacity 0.3s;
	-webkit-tap-highlight-color: transparent;
}
.l-slidemenu__lang:hover,
.l-slidemenu__close:hover {
	opacity: 0.6;
}
.l-slidemenu__close {
	font-size: var(--fs24);
}

/* --- 中身 ---------------------------------------------------------- */
/* ここがスクロール領域。中身のかたまりは padding で左右中央に置きます
   （カンプ準拠：パネル幅の約62%＝左右に19%ずつ） */
.l-slidemenu__body {
	flex: 1 1 auto;
	overflow-y: auto;
	padding: 3.125rem max(19%, calc((100% - 56rem) / 2)) 5rem;
}

/* 予約検索 */
.l-slidemenu__search-title {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin: 0 0 1.5rem;
	font-family: var(--font-en);
	font-size: var(--fs24);
	letter-spacing: 0.04em;
}
.l-slidemenu__search-fields {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 1.25rem;
}
.l-slidemenu__field {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	flex: 1 1 0;
	min-width: 10rem;
	max-width: 15rem;
}
.l-slidemenu__field label {
	font-size: var(--fs14);
}
.l-slidemenu__field select {
	height: 2.8125rem;
	padding: 0 0.75rem;
	border: none;
	border-radius: 2px;
	background-color: #fff;
	color: #333;
	font-family: var(--font-jp);
	font-size: var(--fs15);
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%23333333' stroke-width='1.4'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 0.75rem center;
	background-size: 0.75rem auto;
}
.l-slidemenu__search-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.625rem;
	height: 2.8125rem;
	padding: 0 2em;
	border: none;
	background-color: var(--hd-accent, #c9ad83);
	color: #fff;
	font-family: var(--font-jp);
	font-size: var(--fs15);
	cursor: pointer;
	transition: opacity 0.3s;
	-webkit-tap-highlight-color: transparent;
}
.l-slidemenu__search-btn:hover {
	opacity: 0.8;
}

/* 施設一覧 */
.l-slidemenu__hotels {
	margin-top: 3.75rem;
}
.l-slidemenu__hotels-title {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin: 0 0 1.5rem;
	font-family: var(--font-en);
	font-size: var(--fs20);
	font-weight: 400;
	letter-spacing: 0.04em;
}
.l-slidemenu__hotels-title .bar {
	display: inline-block;
	width: 3px;
	height: 1.125rem;
	background-color: #fff;
}
.l-slidemenu__hotel-grid {
	list-style: none;
	margin: 0;
	padding: 0;
	width: 100%;
	max-width: 100%;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-template-rows: repeat(4, auto);
	grid-auto-flow: column;
	column-gap: 1.875rem;
	row-gap: 1rem;
	font-size: var(--fs15);
	line-height: 1.4;
}
.l-slidemenu__hotel-grid li {
	white-space: nowrap;
}

/* ナビ */
.l-slidemenu__nav {
	margin-top: 3.75rem;
}
.l-slidemenu__nav ul {
	display: flex;
	flex-wrap: wrap;
	gap: 1.875rem;
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: var(--fs15);
}

/* 規約ボタン（フッターと同じ見た目） */
.l-slidemenu__policies {
	display: flex;
	flex-wrap: wrap;
	gap: 1.875rem;
	margin-top: 1.875rem;
}
/* 斜線（nanamesen.webp 45×115）はボタンの高さに合わせて縮小。
   上の横線は border ではなく ::before で引き、斜線の右上から始めて繋げる。
   border-top だと横線が斜線の裏まで伸びて、切り離れて見えるため。 */
.l-slidemenu__policy-btn {
	position: relative;
	display: flex;
	align-items: center;
	gap: 0.625rem;
	padding: 0.75rem 0 0 1.75rem;
	background-image: url("../img/kumamoto-namikizaka/nanamesen.webp");
	background-repeat: no-repeat;
	background-position: left top;
	background-size: auto 100%;
	font-size: var(--fs14);
	white-space: nowrap;
}
.l-slidemenu__policy-btn::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0.8125rem;
	right: 0;
	height: 1px;
	background-color: rgba(255, 255, 255, 0.4);
}
.l-slidemenu__policy-btn img {
	width: 0.5rem;
	height: auto;
}

/* スマホのみ：電話・予約ボタン */
.l-slidemenu__cta {
	display: none;
}

/* =====================================================================
   SP（〜768px ／ 最小 375px）
   ===================================================================== */
/* 狭い画面では中身のかたまりを広げる（施設一覧3列が入りきらなくなるため） */
@media (max-width: 1200px) {
	.l-slidemenu__body {
		padding-inline: 9%;
	}
}

@media (max-width: 768px) {
	/* --- ヘッダー --- */
	.l-header2__inner {
		gap: 0.75rem;
		width: 94%;
		padding: 0.875rem 0;
	}
	.l-header2__logo {
		width: 7.5rem;
	}
	.l-header2__slash {
		display: none;
	}
	.l-header2__right {
		gap: 0.875rem;
	}
	.l-header2__contact {
		padding: 0.65em 1.3em;
		font-size: var(--fs16);
	}
	.l-header2__menu-btn {
		font-size: var(--fs24);
	}

	/* --- スライドメニュー --- */
	/* 上部バーは 右側の操作 → その下にロゴ、の2段 */
	.l-slidemenu__top {
		flex-wrap: wrap;
		justify-content: flex-end;
		height: auto;
		padding: 1.125rem 5% 0;
		border-bottom: none;
	}
	.l-slidemenu__logo {
		order: 2;
		width: 100%;
		margin-top: 2.5rem;
	}
	.l-slidemenu__logo img {
		width: 11.25rem;
	}
	.l-slidemenu__slash {
		display: none;
	}
	.l-slidemenu__top-right {
		gap: 0.875rem;
	}
	.l-slidemenu__contact {
		font-size: var(--fs16);
	}
	.l-slidemenu__lang,
	.l-slidemenu__close {
		font-size: var(--fs24);
	}

	/* 本体：ナビ → 電話/予約 → 規約 の順に積む */
	.l-slidemenu__body {
		display: flex;
		flex-direction: column;
		padding: 2rem 5% 3.75rem;
	}
	.l-slidemenu__search,
	.l-slidemenu__hotels {
		display: none;
	}
	.l-slidemenu__nav {
		order: 1;
		margin-top: 0;
	}
	.l-slidemenu__nav ul {
		flex-direction: column;
		gap: 1.375rem;
		font-size: var(--fs20);
	}
	.l-slidemenu__cta {
		order: 2;
		display: flex;
		flex-direction: column;
		gap: 0.875rem;
		margin-top: 2.5rem;
	}
	.l-slidemenu__tel,
	.l-slidemenu__reserve {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 0.625rem;
		padding: 1em;
		font-size: var(--fs20);
	}
	.l-slidemenu__tel {
		background-color: var(--main-color);
		color: #fff;
	}
	.l-slidemenu__reserve {
		background-color: var(--hd-accent, #c9ad83);
		color: #fff;
		font-family: var(--font-en);
		letter-spacing: 0.04em;
	}
	.l-slidemenu__policies {
		order: 3;
		flex-direction: column;
		gap: 1.5rem;
		margin-top: 2.5rem;
	}
	.l-slidemenu__policy-btn {
		width: fit-content;
		font-size: var(--fs18);
	}
}

/* style.css の header{pointer-events:none} を打ち消す（三本線は button のため） */
.l-header2,
.l-header2 button {
	pointer-events: auto;
}

/* =====================================================================
   予約ドロワー（右下固定：電話・Reservation の引き出し）
   ===================================================================== */
.reservation-drawer {
	position: fixed; left: 0; bottom: 0; width: 100%; z-index: 250;
	transform: translateY(100%); transition: transform 0.5s ease-out; pointer-events: none;
}
.reservation-drawer.is-open { transform: translateY(0); pointer-events: auto; }
.reservation-handle-group {
	position: absolute; top: -59px; right: 0; z-index: 251;
	display: flex; pointer-events: auto !important;
}
/* 閉じている間は引き出し本体を消す（画面外に出きってから） */
.reservation-drawer .reservation-container {
	visibility: hidden; transition: visibility 0s linear 0.5s;
}
.reservation-drawer.is-open .reservation-container {
	visibility: visible; transition-delay: 0s;
}
.tel-handle {
	background-color: var(--main-color); color: #fff; height: 60px; padding: 0 47px 0 30px;
	font-size: var(--fs18); font-weight: 400; cursor: pointer; text-decoration: none;
	display: flex; align-items: center; justify-content: center; gap: 10px;
	font-family: var(--font-en); white-space: nowrap;
	clip-path: polygon(10% 0, 100% 0, 100% 100%, 0 100%);
	margin-right: -22px;
}
.tel-handle:hover { opacity: 0.85; }
.reservation-handle {
	background-color: #c9ad83; color: #fff; width: 215px; height: 60px; padding: 0 20px 0 40px;
	font-size: var(--fs24); font-weight: 400; cursor: pointer; border-radius: 0;
	box-shadow: 0 -3px 10px rgba(0,0,0,0.15); display: flex; align-items: center; justify-content: center;
	gap: 10px;
	font-family: var(--font-en); clip-path: polygon(10% 0, 100% 0, 100% 100%, 0 100%);
}
.reservation-handle img { width: 17px; }
.reservation-container {
	background-color: #c9ad83; height: 260px; padding: 55px 0 45px;
	font-family: var(--font-jp); position: relative; border-top: 1px solid rgba(255,255,255,0.3); box-sizing: border-box;
}
.reservation-inner { max-width: var(--max); margin: 0 auto; padding: 0 20px; display: flex; flex-direction: column; }
.reservation-bar { display: flex; align-items: flex-end; gap: 20px; width: 100%; }
.res-group { display: flex; flex-direction: column; gap: 8px; flex: 1; }
.reservation-bar > .res-group:last-child { flex: 0 0 auto; }
.res-group label { color: #fff; font-size: var(--fs16); font-weight: 400; white-space: nowrap; }
.res-group input, .res-group select {
	height: 45px; border: none; padding: 0 15px; font-size: var(--fs16); border-radius: 2px;
	background-color: #fff; width: 100%; box-sizing: border-box; color: #333;
}
.res-group select {
	appearance: none; -webkit-appearance: none; -moz-appearance: none; padding-right: 40px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23333' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat; background-size: 10px 6px; background-position: right 20px center;
}
.res-group select::-ms-expand { display: none; }
.search-btn {
	background-color: var(--main-color); color: #fff; border: none; height: 45px; padding: 0 3em;
	font-size: var(--fs16); font-weight: 400; cursor: pointer; display: flex; align-items: center;
	justify-content: center; gap: 10px; transition: 0.3s; white-space: nowrap; width: 100%;
}
.search-btn:hover { background-color: #0d161e; }
.res-links { display: flex; gap: 30px; margin-top: 25px; justify-content: flex-end; }
.res-links a { color: #fff; text-decoration: none; font-size: var(--fs16); border-bottom: 1px solid #fff; padding-bottom: 2px; display: flex; align-items: center; gap: 8px; }
.migi-icon { width: 10px; height: auto; }

@media (max-width: 992px) {
	.reservation-handle-group { top: -40px; }
	.reservation-handle { width: 140px; height: 40px; font-size: var(--fs16); }
	.tel-handle { height: 40px; padding: 0 32px 0 20px; font-size: var(--fs14); }
	.tel-handle i { font-size: var(--fs14); }
	/* タブの下に白い線が出てしまうので、SP では上の境界線を消す */
	.reservation-container { height: auto; padding: 30px 20px 40px; border-top: none; }
	.reservation-bar { display: grid; grid-template-columns: 1fr 1fr; gap: 20px 15px; }
	.res-group--wide { grid-column: span 2; }
	.reservation-bar > .res-group:last-child { grid-column: span 2; margin-top: 5px; }
	/* 虫めがねは中央のテキストと切り離して右端へ（カンプどおり） */
	.search-btn { position: relative; gap: 0; }
	.search-btn i { position: absolute; right: 24px; top: 50%; transform: translateY(-50%); }
	.res-links { margin-top: 30px; justify-content: flex-start; gap: 15px 25px; flex-wrap: wrap; }
}

/* =====================================================================
   レスポンシブ調整（最後に効きます）
   ===================================================================== */

/* 横スクロールを絶対に出さない */
html, body {
	overflow-x: hidden;
	max-width: 100%;
}

/* メインメニューの間隔は 1440px を下回ったところから少しずつ詰める
   （1440px で 1.875rem、1100px で約 0.875rem まで） */
.l-header2__nav ul {
	gap: clamp(0.875rem, calc(4.7vw - 2.36rem), 1.875rem);
}

/* 間隔が詰まりきる手前で SP 表示に切り替える
   （.pc は style.css で 768px 切替なので、ここで先に隠す） */
@media (max-width: 1100px) {
	.l-header2__nav.pc,
	.l-header2__divider.pc,
	.l-header2__lang.pc {
		display: none !important;
	}
	.l-header2__slash {
		display: none;
	}
}

/* =====================================================================
   【一時非表示 A】施設一覧を先頭 8 件だけにしています（2026-09-04 更新）
   ---------------------------------------------------------------------
   ■ 何をしているか
     PHP は変更していません。header-general.php の $sova_hotel_menu は
     12 件のままで、HTML にも 12 件そのまま出力されています。
     この CSS で 9 件目以降を隠し、グリッドを 3列×4行 から 3列×3行 に
     変えて、残る 8 件がきれいに収まるようにしています。

   ■ 隠している 4 件（配列の 9〜12 番目）
     熊本桜町(仮) ／ 鹿児島天文館 ／ 熊本下通(仮) ／ 熊本下通(仮)2

   ■ 12 件表示に戻す手順
     1) この【一時非表示 A】ブロックを、この行から下の閉じカッコまで
        丸ごと削除する
     2) css/footer-general.css にも同じ【一時非表示 A】ブロックが
        あるので、そちらも丸ごと削除する
     削除するだけで元に戻ります。PHP など他のファイルを触る必要は
     ありません。元の grid-template-rows: repeat(4, auto) は、この
     ブロックより上の .l-slidemenu__hotel-grid にそのまま残っています。

   ■ 施設を 8 件以外の数にするとき
     grid-template-rows の行数を「件数 ÷ 3（端数切り上げ）」にし、
     nth-child(n+9) の 9 を「表示したい件数 + 1」に変えてください。
   ===================================================================== */
.l-slidemenu__hotel-grid {
	grid-template-rows: repeat(3, auto);
}
.l-slidemenu__hotel-grid li:nth-child(n+9) {
	display: none;
}

/* =====================================================================
   【一時非表示 B】Reservation と空室検索フォーム（2026-09-02 設定）
   ---------------------------------------------------------------------
   ■ 何をしているか
     PHP は変更していません。header-general.php の予約ドロワーと
     スライドメニューの検索フォームは HTML にそのまま出力されています。
     この CSS で見えなくしているだけです。JavaScript も無効化して
     いないので、表示に戻せばそのまま動きます。

   ■ 隠しているもの
     ・右下の固定「Reservation」ボタン    .reservation-handle
     ・それを開いたときに出る検索フォーム  .reservation-container
       （エリア／人数／特徴のプルダウンと、ホテル一覧へ・宿泊約款・
         キャンセルポリシーのリンクを含みます）
     ・バーガーメニュー内の検索フォーム    .l-slidemenu__search
     ・SP バーガーメニュー下部の
       「Reservation」ボタン               .l-slidemenu__reserve

   ■ 残しているもの
     電話番号ボタン 050-8896-5555（右下の固定ボタン、および SP の
     バーガーメニュー下部）は表示したままです。

   ■ 表示に戻す手順
     この【一時非表示 B】ブロックを、この行から下の
     .l-slidemenu__reserve の閉じカッコまで丸ごと削除するだけです。
     他のファイルを触る必要はありません。

   ■ 注意（.tel-handle の margin-right について）
     電話ボタンは、隣の Reservation ボタンと平行四辺形を重ねるために
     margin-right: -22px を持っています。Reservation を隠すと電話が
     画面右端から 22px はみ出すため、下でそれを 0 に打ち消しています。
     Reservation を表示に戻すときは、この打ち消しも一緒に消してください
     （ブロックごと削除すれば自動的にそうなります）。
   ===================================================================== */
.reservation-handle {
	display: none;
}
.tel-handle {
	margin-right: 0;
}
.reservation-container {
	display: none;
}
.l-slidemenu__search {
	display: none;
}
.l-slidemenu__reserve {
	display: none;
}