/* ===== 2026 クリスマス 色の設定 =====
   イラレで使った色に合わせて、ここだけ書き換えればOK */
:root {
	--xmas-bg: #1F3A2E;     /* 外側の深緑 */
	--xmas-red: #8C2A33;    /* 予約ボタン */
	--xmas-red-hover: #6F1F28;
}

body {
	background: var(--xmas-bg);
}

.header {
	background: #fff;
}
footer {
	margin-top: 0;
}

.sub-visual {
	margin-bottom: 0;
}

.mb30 {
	margin-bottom: 30px;
}

/* ----- 外側：去年と同じく1枚画像を上に敷く ----- */
.content-wrapper {
	position: relative; /* ここを基準にする */
	padding: 40px 0;
}
.content-wrapper::after {
	content: "";
	position: absolute;
	top: 0; left: 0;
	width: 100%; height: 100%;
	background: url("images/bg_gold.png") no-repeat center top 31px;
	z-index: 1;
	pointer-events: none;
}

/* ----- 中央の白いボックス ----- */
.xmas_section {
	max-width: 820px;
	width: 100%;
	box-sizing: border-box;
	margin: 0 auto;
	padding: 50px 40px 60px;
	background: #fff;
	position: relative;
	margin-bottom: 60px;
}
.xmas_section h2 {
	text-align: center;
	margin-bottom: 30px;
}
.xmas_section .tokuten {
	position: absolute;
	top: 10px;
	right: 10px;
}
.xmas_section .center {
	margin-top: 60px;
}

.attention {
	font-size: 12px;
	margin-top: 20px;
}

/* ----- 予約ボタン ----- */
.xmas-reserve-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 14px 48px;
	background: var(--xmas-red);
	color: #fff;
	font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", serif;
	font-weight: bold;
	letter-spacing: 0.1em;
	text-decoration: none;
	border-radius: 2px;
	transition: background-color 0.3s, transform 0.3s;
}
/* ボタンの左の小さい三角 */
.xmas-reserve-btn::before {
	content: "";
	width: 7px;
	height: 9px;
	background: #fff;
	clip-path: polygon(0 0, 100% 50%, 0 100%);
}
.xmas-reserve-btn:hover {
	background: var(--xmas-red-hover);
	color: #fff;   /* common.css の a:hover に負けないように */
	opacity: 1;
}

/* このページだけ、固定の予約バナーをクリスマス版に */
.fixed-banner .banner-content a {
	display: block;
	background: url("images/bnr_resev_xmas.png") no-repeat center / contain;
}
.fixed-banner .banner-content img {
	opacity: 0;
}

/* スマホ対応 */
@media (max-width: 768px) {
.sub-visual img {
	height: auto;
}

footer {
	margin-top: 0;
}

.content-wrapper {
	padding: 30px 16px 40px;
	background-size: 30% auto; /* 装飾を小さく */
}

.xmas_section {
	padding: 30px 20px 40px;
}
.xmas_section h2 {
	padding-bottom: 15px;
}
.xmas_section h2 img {
	max-width: 378px;
	width: 100%;
}
.xmas_section .tokuten {
	position: relative;
	top: auto;
	right: auto;
	display: block;
	margin: 0 auto 20px;
	max-width: 100%;
}
.xmasphoto {
	width: 100%;
}
.coursemenu {
	max-width: 541px;
	width: 100%;
}
}