@charset "utf-8";


/*Google Fontsの読み込み
---------------------------------------------------------------------------*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&display=swap');


/*Font Awesomeの読み込み
---------------------------------------------------------------------------*/
@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css");


/*CSSカスタムプロパティ（サイト全体を一括管理する為の設定）
---------------------------------------------------------------------------*/
:root {

	--bg-color: #fff;					/*主にテンプレートの背景色*/
	--bg-border-color: rgba(0,0,0,0.2);	/*枠線の色。0,0,0は黒の事で0.2は色が20%出た状態。*/
	--bg-inverse-color: #333;			/*上のカラーの「対」として使う色*/
	--bg-inverse-border-color: rgba(255,255,255,0.5);	/*枠線の色。255,255,255,0.5は白の事で0.5は色が50%出た状態。*/
	
	--primary-color: #697f8d;			/*メインカラー（ダスティローズ）*/
	--primary-inverse-color: #fff;		/*上のカラーの「対」として使う色*/
	--primary-border-color: rgba(255,255,255,0.5);	/*枠線の色。255,255,255は白の事で0.5は色が50%出た状態。*/
	
	--light-color: #f0f0f0;				/*薄いカラー（さくらピンク）*/
	--light-inverse-color: #333;		/*上のカラーの「対」として使う色*/
	--light-border-color: rgba(0,0,0,0.2);	/*枠線の色。0,0,0は黒の事で0.2は色が20%出た状態。*/

	--accent-color: #05273f;			/*アクセントカラー（セージグリーン）*/
	--accent-inverse-color: #fff;		/*上のカラーの「対」として使う色*/
	--accent-border-color: rgba(255,255,255,0.5);	/*枠線の色。255,255,255は白の事で0.5は色が50%出た状態。*/

	--content-space-l: 5vw;  /*余白の一括管理用。画面幅100% = 100vwです。*/
	--content-space-s: 2rem;  /*余白の一括管理用。2文字分。*/

	--base-font:     font-family: "Noto Serif JP", "Hiragino Mincho ProN", "Hiragino Mincho Pro", serif;
  /*フォント指定*/
	--accent-font: "Jost";  /*アクセント用英語フォント指定*/

}

/*animation11のキーフレーム設定（汎用的）
---------------------------------------------------------------------------*/
@keyframes animation1 {
	0% {right: -200px;}
	100% {right: 0px;}
}


/*opa1のキーフレーム設定（汎用的）
---------------------------------------------------------------------------*/
@keyframes opa1 {
	0% {opacity: 0;}
	100% {opacity: 1;}
}


/*全体の設定
---------------------------------------------------------------------------*/
body * {box-sizing: border-box;}
html {
	font-size: clamp(12px, 0.585vw + 9.80px, 18px);	/*画面幅375px〜1400pxの間で、12px〜18pxに可変。下でrem管理しているものも連動します。*/
	overflow-x: visible;
}
body {
	margin: 0;padding:0;
	font-family: var(--base-font);	/*フォント指定。theme.cssのbase-fontを読み込みます。*/
	-webkit-text-size-adjust: none;
	background: var(--bg-color);	/*背景色。theme.cssのbg-colorを読み込みます。*/
	color: var(--bg-inverse-color);	/*文字色。theme.cssのbg-inverse-colorを読み込みます。*/
	line-height: 2;		/*行間*/
	overflow-x: hidden;
}

/*リセット*/
figure {margin: 0;}
dd {margin: 0;}
nav,ul,li,ol {margin: 0;padding: 0;}
nav ul {list-style: none;}

/*table全般の設定*/
table {border-collapse:collapse;}

/*画像全般の設定*/
img {border: none;max-width: 100%;height: auto;vertical-align: middle;}

/*videoタグ*/
video {max-width: 100%;}

/*iframeタグ*/
iframe {width: 100%;}

/*他*/
input {font-size: 1rem;}


/*section
---------------------------------------------------------------------------*/
section {
	padding: 0 var(--content-space-l);	/*上下、左右へのsection内の余白。左右については、theme.cssの--content-space-lを読み込みます。*/
	margin: var(--content-space-l) 0;	/*上下、左右へのsectionの外側にとるマージン。上下については、theme.cssの--content-space-lを読み込みます。*/
}

h1 {
	font-size: 12px;
	text-align: center;
	margin-top: 50px;
	margin-bottom: 50px;
}
/*リンクテキスト全般の設定
---------------------------------------------------------------------------*/
a {
	color: inherit;
	transition: 0.3s;	/*hoverまでにかける時間。0.3秒。*/
}

/*マウスオン時*/
a:hover {
	filter: brightness(1.1);	/*少しだけ明るくする*/
	text-decoration: none;
}


/*コンテナー（サイト全体を囲むブロック）
---------------------------------------------------------------------------*/
#container {
	animation: opa1 0.2s 0.2s both;  /*0.2(2つ目の数字)秒待機後、0.2(1つ目の数字)秒かけてフェードイン*/
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}


/*contents
---------------------------------------------------------------------------*/
#contents {
	flex: 1;
	min-height: 0;
}


/*main
---------------------------------------------------------------------------*/
main {
	container-type: inline-size;
}

main > section:first-child {
	margin-top: 0;
}

/*main内で使用するul,ol要素（リストタグ）*/
main ul,main ol {
	margin-left: 2rem;
	margin-right: 2rem;
}


/*header（ロゴが入った最上段のブロック）
---------------------------------------------------------------------------*/

/*ヘッダーブロック*/
header {
	position: sticky;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 1000;
	padding: 1rem var(--content-space-l);
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: var(--content-space-s);
	background: #05273f;
	color: var(--bg-inverse-color);
	text-shadow: none;
}
/* ヘッダー下のグラデーションライン */
header::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 2px;
	background:
		linear-gradient(
			to right,
			var(--primary-color),
			var(--accent-color),
			var(--primary-color)
		);
	pointer-events: none;
}
/*ロゴ（※画像の場合）
---------------------------------------------------------------------------*/

.logo {
	margin: 0;
	flex-shrink: 0;
	position: relative;
	z-index: 2;
}

.logo img {
	display: block;
	width: 100px;
	margin-bottom: 0;
}


/*ヘッダーの右側ブロック（電話番号・営業時間など）
---------------------------------------------------------------------------*/

#header-box {
	position: absolute;
	z-index: 2;
	right: 80px;
	top: 45px;

	font-size: 0.6rem;
	line-height: 1.5;
	text-align: right;
	white-space: nowrap;

	color: var(--bg-color);
	text-shadow: none;
}

/*電話番号の下線対策*/
#header-box a,
#header-box span,
#header-box .large {
	text-decoration: none;
	border-bottom: none;
}


/*メニュー本体
---------------------------------------------------------------------------*/

/*
	PC・スマホ関係なく、最初は必ず非表示。
	三本バーを押した時だけ display-block で表示。
*/

#menubar {
	display: none;
	text-shadow: none;
	animation: animation1 0.2s both;

	position: fixed;
	overflow: auto;
	z-index: 100;
	right: 0;
	top: 0;
	width: 100%;
	height: 100%;
	padding: 110px var(--content-space-l) 50px;
	background: #fff;
	color: #333;
}

/* ハンバーガーを押した時だけ表示 */
#menubar.display-block {
	display: block;
}

/* 念のため、display-none が付いたら必ず非表示 */
#menubar.display-none {
	display: none;
}


/*メニュー１個あたり*/
#menubar a {
	display: block;
	text-decoration: none;
	color: #fff;
	border: 1px solid #ccc;
	margin-bottom: 1rem;
	padding: 1rem 2rem;
	background: var(--primary-color);
}

/*子メニュー*/
#menubar ul ul a {
	margin-left: 2rem;
	padding: 0.5rem 1.5rem;
}

/*ドロップダウンのアイコン*/
a.ddmenu::before {
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	content: "\f078";
	margin-right: 1em;
	font-size: 0.7em;
	vertical-align: middle;
	display: inline-block;
	line-height: 1;
}

/*ドロップダウン共通：デフォルト非表示*/
#menubar ul ul {
	display: none;
}


/*３本バー（ハンバーガー）アイコン設定
---------------------------------------------------------------------------*/

/*
	header内に配置。
	headerがstickyなので、ロゴ・TELと一緒に追従する。
*/

#menubar_hdr {
	display: flex;
	animation: opa1 0s 0.2s both;
	cursor: pointer;

	position: absolute;
	z-index: 1001;
	right: 0;
	top: 0;

	width: 70px;
	height: 70px;
	margin-top: 30px;
	background: transparent;
}

/*ハンバーガーアイコンの線*/
#menubar_hdr span {
	display: block;
	transition: 0.3s;
	position: absolute;
	left: 18px;
	width: 35px;
	height: 1.5px;
	background: var(--bg-color);
	box-shadow: none;
}

/* バツ印が出ている時：小さめの丸線 */
#menubar_hdr.ham {
	background: transparent;
	border: none;
}

/* 丸だけを小さく作る */
#menubar_hdr.ham::before {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	width: 42px;
	height: 42px;
	transform: translate(-50%, -50%);
	border: 1px solid var(--bg-inverse-color);
	border-radius: 50%;
	pointer-events: none;
}

/* バツ印の線色 */
#menubar_hdr.ham span {
	background: var(--bg-inverse-color);
	box-shadow: none;
}

/*三本線の位置*/
#menubar_hdr span:nth-of-type(1) {
	top: 24px;
}

#menubar_hdr span:nth-of-type(2) {
	top: 34px;
}

#menubar_hdr span:nth-of-type(3) {
	top: 44px;
}

/*クリック後のバツ印*/
#menubar_hdr.ham span:nth-of-type(1) {
	transform: translateY(10px) rotate(-45deg);
}

#menubar_hdr.ham span:nth-of-type(2) {
	opacity: 0;
}

#menubar_hdr.ham span:nth-of-type(3) {
	transform: translateY(-10px) rotate(45deg);
}


/*スマホ微調整
---------------------------------------------------------------------------*/

@media (max-width: 700px) {

	header {
		padding: 1rem 10px;
	}

	.logo img {
		width: 90px;
	}

	#header-box {
		right: 72px;
		top: 40px;
		font-size: 0.55rem;
		line-height: 1.4;
	}

	#menubar_hdr {
		right: 0;
		top: 0;
		width: 70px;
		height: 70px;
		margin-top: 20px;
	}

	#menubar {
		padding-top: 110px;
	}

}


/* =========================================================
   下部テキストリンクの下線を消す
========================================================= */

.info-section .p-center-small a {
	text-decoration: none !important;
	border-bottom: none !important;
}

.info-section .p-center-small a:hover {
	text-decoration: none !important;
	border-bottom: none !important;
}
/* =========================================================
   PAGE TOP（↑）
   最初は透明、スクロール後だけ表示
========================================================= */

.pagetop {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity 0.3s ease, visibility 0.3s ease;
}

.pagetop.pagetop-show {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

.pagetop a {
	display: block;
	text-decoration: none;
	text-align: center;
	z-index: 99;
	position: fixed;
	right: 20px;
	bottom: 86px;
	color: #fff;
	font-size: 1.5rem;
	background: rgba(0,0,0,0.2);
	width: 60px;
	line-height: 60px;
	border-radius: 50%;
}

/* スマホ調整 */
@media (max-width: 800px) {
	.pagetop a {
		right: 16px;
		bottom: 86px;
		width: 54px;
		line-height: 54px;
		font-size: 1.35rem;
	}
}
/*section内で画面両サイドいっぱいまで広げる場合（marginのみでもいいが安定版に）
---------------------------------------------------------------------------*/
.bleed-x-parts {
	--bleed-x: var(--content-space-l);	/*エイリアスに*/
	width: calc(100% + (var(--bleed-x) * 2));	/*section内容の幅＋両サイドpadding（対象要素の幅）*/
	margin-left: calc(var(--bleed-x) * -1);
	margin-right: calc(var(--bleed-x) * -1);
	max-width: none;
}


/*スライドショー全体を囲むブロック*/
.effects-slideimg1-parts {
	overflow-x: hidden;
	width: 100vw;
	margin-left: calc(50% - 50vw);

}

/*画像たちを囲むブロック*/
.effects-slideimg1-parts .img-parts {
	display: flex;
	overflow: hidden;
}

/*右から左へ、左から右へ、のアニメーション*/
.effects-slideimg1-parts .rtl-parts, .effects-slideimg1-parts .ltr-parts {
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}

/* マウスオンしてもスライドを止めない */
.effects-slideimg1-parts .rtl-parts,
.effects-slideimg1-parts .ltr-parts,
.effects-slideimg1-parts:hover .rtl-parts,
.effects-slideimg1-parts:hover .ltr-parts,
.effects-slideimg1-parts .rtl-parts:hover,
.effects-slideimg1-parts .ltr-parts:hover {
	animation-play-state: running !important;
}
.effects-slideimg1-parts .rtl-parts {animation-name: slide-rtl-parts;}
.effects-slideimg1-parts .ltr-parts {animation-name: slide-ltr-parts;}

@keyframes slide-rtl-parts {
0% {transform: translateX(0);}
100% {transform: translateX(-50%);}
}

@keyframes slide-ltr-parts {
0% {transform: translateX(-50%);}
100% {transform: translateX(0);}
}

/* ---- オーバーレイスライド（effects-overlay1） (effects-overlay1) ---- */
/*effects-overlay1-parts
---------------------------------------------------------------------------*/
/*２つのボックスを囲むブロック*/
.effects-overlay1-parts {
	display: flex;
}
.effects-overlay1-parts a {
	text-decoration: none;
	display: block;
}

/*ボックス１個あたり*/
.effects-overlay1-parts .list-parts {
	flex: 1;
	text-align: center;
	position: relative;
	overflow-y: hidden;
}

/*テキストブロック*/
.effects-overlay1-parts .text-parts {
	position: relative;
	z-index: 1;
	color: #fff;
	padding: 5rem;
}

/*h2見出し*/
.effects-overlay1-parts .text-parts h2 {
	font-family: 'Shippori Mincho', serif;
	font-size: min(36px, 4vw);
	font-weight: normal;
	letter-spacing: 0.05em;
}

/*h2見出し内のspan（小さな文字）*/
.effects-overlay1-parts .text-parts h2 span {
	display: block;
	font-size: 0.8rem;	/*文字サイズ80%*/
}

/*段落（p）*/
.effects-overlay1-parts .text-parts p {
	font-size: 0.85rem;	/*文字サイズ85%*/
}

/*1つ目（左）の背景画像*/
.effects-overlay1-parts .image1-parts {
	background: url("../images/basashimori.webp") no-repeat center center / cover;
}

/*2つ目（右）の背景画像*/
.effects-overlay1-parts .image2-parts {
	background: url("../images/hitomoji.webp") no-repeat center center / cover;
}

/*3つ目（左）の背景画像*/
.effects-overlay1-parts .image3-parts {
	background: url("../images/kanpachi.webp") no-repeat center center / cover;
}

/*4つ目（右）の背景画像*/
.effects-overlay1-parts .image4-parts {
	background: url("../images/ichiyaboshi.webp") no-repeat center center / cover;
}

/*マウスオン用のアニメーション*/
.effects-overlay1-parts .list-parts::before {
	content: "";position: absolute;inset: 0;
	background: rgba(0,0,0,0.6);		/*写真に重ねておく半透明の黒い色。0,0,0は黒のことで0.6は色が60%出た状態。*/
	transition: transform 0.3s 0.1s;	/*アニメーションの速度（0.3秒）と待機時間（0.1秒）。*/
}
.effects-overlay1-parts .list-parts:hover::before {
	transform: translateY(100%);	/*マウスオンで半透明の黒を枠外へ出す。-100%にすると逆に移動します。*/
}

/* テキスト色をなめらかに変える */
.effects-overlay1-parts .text-parts {
	transition: color 0.3s;
}

/* 少し強めの黒シャドウ */
.effects-overlay1-parts .list-parts:hover .text-parts {
	text-shadow:
		1px 1px 2px rgba(0,0,0,0.9),
		2px 2px 6px rgba(0,0,0,0.6);
}

/* =========================
   effects-overlay1
   スマホは全幅、PCだけ少し幅を抑えて中央寄せ
========================= */

@media (min-width: 901px) {

	.effects-overlay1-parts.bleed-x-parts {
		width: min(90vw, 1120px);
		margin-left: auto;
		margin-right: auto;
	}

	.effects-overlay1-parts.bleed-x-parts + .effects-overlay1-parts.bleed-x-parts {
		margin-top: 0;
	}

}

/* ---- 横スクロールセクション（list-yoko-scroll3） (list-yoko-scroll3) ---- */
/*list-yoko-scroll3-parts
---------------------------------------------------------------------------*/
/*全体を囲むボックス*/
.list-yoko-scroll3-parts {
	position: relative;
	height: 200vh;
	background:
		linear-gradient(
			to bottom,
			transparent 0%,
			transparent 58%,
		);
}
/* 横いっぱいのシャドウ */

.list-yoko-scroll3-parts::before {

	content: "";
	position: absolute;
	left: 50%;
	bottom: 0;
	transform: translateX(-50%);
	width: 100vw;
	height: 50vh;
	background:
		linear-gradient(
			to bottom,
			transparent 0%,
			rgba(0,0,0,0.04) 100%
		);
	pointer-events: none;
	z-index: 0;

}

/*横スクロールブロック*/
.list-yoko-scroll3-parts .hscroll1-sticky {
	position: sticky;
	top: 180px;
	height: 50vh;
	overflow: hidden;
}
.list-yoko-scroll3-parts .hscroll1-track {
	display: flex;
	align-items: center;
	height: 100%;
	will-change: transform;
}

/*各画像*/
.list-yoko-scroll3-parts .hscroll1-track > div {
	flex-shrink: 0;
	width: 45vw;	/*1枚あたりの幅（画面幅の45%）*/
	aspect-ratio: 1;	/*ここで比率固定。4 / 3などにすればやや横長になります。*/
	padding-inline: 0.5rem;	/*左右に0.5文字分の余白*/
	margin-bottom: 30px;
}
.list-yoko-scroll3-parts .hscroll1-track > div img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;

}

/*スキップボタン*/
.list-yoko-scroll3-parts button[aria-label="skip gallery"] {
	position: absolute;
	bottom: 1.7rem;	/*下からの2文字分の場所に配置*/
	left: 50%;
	transform: translateX(-50%);
	z-index: 1;
	background: var(--bg-inverse-color);	/*背景色。theme.cssのbg-inverse-colorを読み込みます。*/
	color: var(--bg-color);	/*文字色。theme.cssのbg-colorを読み込みます。*/
	border: none;
	padding: 0.5rem 1.5rem;	/*上下に0.5文字分、左右に1.5文字分の余白*/
	font-size: 0.7rem;	/*文字サイズ80%*/
	cursor: pointer;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s, visibility 0.3s;	/*表示切替のアニメーション*/
}
.list-yoko-scroll3-parts button[aria-label="skip gallery"].is-visible {
	opacity: 1;
	visibility: visible;
}
/*下矢印のアイコン（Font Awesome）*/
.list-yoko-scroll3-parts button[aria-label="skip gallery"] i {
	margin-left: 0.3em;	/*テキストとアイコンとの間に空けるスペース。0.3文字分。*/
	font-size: 0.7rem;	/*アイコンサイズ70%*/
}

/*進捗バー*/
.list-yoko-scroll3-parts .hscroll1-progress {
	position: absolute;
	bottom: max(16px, env(safe-area-inset-bottom));	/*下からの配置場所*/
	left: 0;
	width: 100%;
	height: 3px;	/*バーの太さ*/
	z-index: 2;

	background: var(--bg-border-color);	/*バーのベース色。theme.cssのborder-colorを読み込みます。*/
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s, visibility 0.3s;	/*表示切替のアニメーション*/
}
.list-yoko-scroll3-parts .hscroll1-progress.is-visible {
	opacity: 1;
	visibility: visible;
}
.list-yoko-scroll3-parts .hscroll1-progress-bar {
	height: 100%;
	width: 0%;
	background: var(--primary-color);	/*バーの色をtheme.cssのprimary-colorにする*/
	transition: width 0.05s linear;		/*幅の変化を滑らかに*/
}
/*PCだけ中央寄せ

---------------------------------------------------------------------------*/

@media (min-width: 901px) {

	.list-yoko-scroll3-parts {
		width: min(90vw, 1120px);
		margin-left: auto;
		margin-right: auto;
	}
	/* PCでは画像サイズも少し抑える */
	.list-yoko-scroll3-parts .hscroll1-track > div {
		width: min(45vw, 520px);
	}

}

/*スマホ調整

---------------------------------------------------------------------------*/

@media (max-width: 700px) {

	.list-yoko-scroll3-parts {
		width: 100%;
		margin-left: 0;
		margin-right: 0;
	}
	.list-yoko-scroll3-parts .hscroll1-sticky {
		top: 120px;
	}
	.list-yoko-scroll3-parts .hscroll1-track > div {
		width: 80vw;
	}

	/*各画像*/
	.list-yoko-scroll3-parts .hscroll1-track > div {
		width: 80vw;	/*1枚あたりの幅の変更*/
	}
	
	}/*追加指定ここまで*/

/* ---- コース一覧用（list-cource1） (list-cource1) ---- */
/*コース紹介
---------------------------------------------------------------------------*/
.list-cource1-parts * {margin: 0;padding: 0;}

/*ボックス全体*/
.list-cource1-parts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));	/*ボックス１個あたりの最低幅が280pxで自動改行*/
	gap: 2rem;		/*ボックス同士の余白。2文字分。*/
	font-size: 0.9rem;	/*文字サイズ90%*/
}

/*メニューボックス１個あたり*/
.list-cource1-parts .list-parts {
	display: flex;
	flex-direction: column;
	background: var(--bg-color);	/*背景色。theme.cssのbg-colorを読み込みます。*/
	border: 1px solid var(--bg-border-color);	/*枠線。色はtheme.cssのbg-border-colorを読み込みます。*/
	overflow: hidden;	/*角丸からはみ出た画像を隠す*/
}

/*メニュー画像*/
.list-cource1-parts .list-parts figure {
	overflow: hidden;
}
.list-cource1-parts .list-parts figure img {
	width: 100%;
	aspect-ratio: 3 / 2;	/*横3:縦2の比率*/
	object-fit: cover;		/*コンテナいっぱいにカバー、余分な部分はカット*/
	display: block;
}

/*テキストエリア（画像の下の部分）*/
.list-cource1-parts .list-parts .text-parts {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;	/*テキスト要素同士の余白。0.5文字分。*/
	padding: 1.2rem 1.5rem;	/*テキストエリア内の余白。上下に1.2文字分、左右に1.5文字分。*/
	flex: 1;
}

/*メニュー名（h2）*/
.list-cource1-parts .list-parts h2 {
	font-size: 1.1rem;	/*文字サイズ1.1倍*/
	line-height: 1.5;	/*行間*/
}

.list-cource1-parts .list-parts .info-parts i {
	display: none;
}

.list-cource1-parts .list-parts .info-parts::before {
	content: "◇";
	margin-right: 1em;
	font-size: 0.9em;
	color: var(--accent-color);
}

/*説明テキスト*/
.list-cource1-parts .list-parts p {
	font-size: 0.95rem;	/*文字サイズ85%*/
	line-height: 1.8;	/*行間*/
}

/*価格*/
.list-cource1-parts .list-parts .price-parts {
	margin-top: auto;	/*ボックス下部に押し下げる*/
	padding-top: 0.8rem;	/*上に空けるスペース。0.8文字分。区切り線との距離。*/
	border-top: 1px solid var(--bg-border-color);	/*区切り線。色はtheme.cssのbg-border-colorを読み込みます。*/
	text-align: right;	/*テキストを右揃え*/
}
.list-cource1-parts .list-parts .price-parts span {
	font-family: var(--accent-font), var(--base-font);	/*theme.cssのaccent-fontに指定したフォントを読み込む。読み込めなければbase-fontで指定したフォントを読み込む。*/
	font-size: 1.6rem;	/*文字サイズ1.6倍*/
	font-weight: bold;	/*太字*/
	color: var(--primary-color);	/*文字色。theme.cssのprimary-colorを読み込みます。*/
	letter-spacing: -0.02em;	/*文字間隔を少し詰める*/
}

/*価格エリア*/
.list-cource1-parts .list-parts .price-parts {
	margin-top: auto;
	padding-top: 0.8rem;
	border-top: 1px solid var(--bg-border-color);
	text-align: right;
}

/*商品名*/
.list-cource1-parts .list-parts .price-parts .price-name {
	margin-bottom: 0.35rem;
	font-family: 'Shippori Mincho', serif;
	font-size: 0.95rem;
	line-height: 1.6;
	letter-spacing: 0.08em;
	color: var(--bg-inverse-color);
	text-align: left;
}

/*商品名の補足*/
.list-cource1-parts .list-parts .price-parts .price-name span {
	font-size: 0.85rem;
	opacity: 0.7;
	letter-spacing: 0.05em;
}

/*価格*/
.list-cource1-parts .list-parts .price-parts .price-yen {
	text-align: right;
}

.list-cource1-parts .list-parts .price-parts .price-yen span {
	font-family: var(--accent-font), var(--base-font);
	font-size: 1.6rem;
	font-weight: bold;
	color: var(--primary-color);
	letter-spacing: -0.02em;
}

/* =========================
   価格エリア：商品名＋価格
========================= */

.list-cource1-parts .list-parts .price-parts {
	margin-top: auto;
	padding-top: 0.8rem;
	border-top: 1px solid var(--bg-border-color);
	text-align: right;
}

/* 商品名 */
.list-cource1-parts .list-parts .price-parts .price-name {
	margin-bottom: 0.35rem;
	font-family: 'Shippori Mincho', serif;
	font-size: 0.85rem;
	line-height: 1.6;
	letter-spacing: 0.08em;
	color: var(--bg-inverse-color);
	text-align: left;
}

/* 商品名の補足 */
.list-cource1-parts .list-parts .price-parts .price-name span {
	font-family: inherit;
	font-size: 0.75rem;
	font-weight: normal;
	color: inherit;
	opacity: 0.7;
	letter-spacing: 0.05em;
}

/* 価格 */
.list-cource1-parts .list-parts .price-parts .price-yen {
	text-align: right;
}

.list-cource1-parts .list-parts .price-parts .price-yen span {
	font-family: var(--accent-font), var(--base-font);
	font-size: 1.6rem;
	font-weight: bold;
	color: var(--primary-color);
	letter-spacing: -0.02em;
}
/* =========================
   コースカード全体リンク化
========================= */

.list-cource1-parts .list-parts .course-card-link {
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
	color: inherit;
	text-decoration: none;
}

/* リンクhoverで勝手に明るくなるのを防ぐ */
.list-cource1-parts .list-parts .course-card-link:hover {
	filter: none;
	text-decoration: none;
}

/* テキスト部分を下まで伸ばす */
.list-cource1-parts .list-parts .course-card-link .text-parts {
	flex: 1;
}

/* スマホ時：通常カードは画像左・文字右 */
@media (max-width:700px) {

	.list-cource1-parts .list-parts .course-card-link {
		flex-direction: row;
	}

	/* reverse-parts は文字左・画像右 */
	.list-cource1-parts .list-parts.reverse-parts .course-card-link {
		flex-direction: row-reverse;
	}

	.list-cource1-parts .list-parts .course-card-link figure {
		width: 40%;
		flex-shrink: 0;
	}

	.list-cource1-parts .list-parts .course-card-link figure img {
		height: 100%;
		aspect-ratio: auto;
		object-fit: cover;
	}

		/* 1列表示に固定して、カード間隔を統一 */
	.list-cource1-parts {
		grid-template-columns: 1fr;
		gap: 1.55rem;
		row-gap: 1.55rem;
	}

	/* カード自体に余計な下余白が出ないようにする */
	.list-cource1-parts .list-parts {
		margin: 0;
	}

	/* figureやtext内の余白でカード間が広く見えないように */
	.list-cource1-parts .list-parts figure,
	.list-cource1-parts .list-parts .text-parts {
		margin: 0;
	}

}

/* =========================
   コース一覧：PC・スマホ共通で左右反転
   文字左・画像右
========================= */

.list-cource1-parts .list-parts.reverse-parts {
	flex-direction: column;
}

	/*画面幅700px以下の追加指定*/
	@media (max-width:700px) {

	/*ボックス全体を1列に*/
	.list-cource1-parts {
		grid-template-columns: 1fr;
	}

	/*メニューボックスを横並びに変更*/
	.list-cource1-parts .list-parts {
		flex-direction: row;	/*横並びに*/
	}

	/*メニュー画像（左側に配置）*/
	.list-cource1-parts .list-parts figure {
		width: 40%;		/*画像エリアの幅。ボックス全体の40%。*/
		flex-shrink: 0;	/*画像が縮まないようにする*/
	}
	.list-cource1-parts .list-parts figure img {
		aspect-ratio: auto;
		height: 100%;	/*縦いっぱいに表示*/
	}
	.list-cource1-parts .list-parts.reverse-parts {
		flex-direction: row-reverse;
	}

	}/*追加指定ここまで*/

/* ---- テーブル（ta-card1） (ta-card1) ---- */
/*テーブル（ta-card1-parts）
---------------------------------------------------------------------------*/
/*テーブル１行目に入った見出し部分（※caption）*/
.ta-card1-parts caption {
	font-weight: bold;		/*キャプション太字*/
	padding: 0.5rem 1rem;		/*ボックス内の余白。上下に0.5文字分、左右に1文字分。*/
	background: var(--bg-inverse-color);
	color: var(--bg-color);
	margin-bottom: 1rem;
}

/*テーブルブロック設定*/
.ta-card1-parts {
	width: 100%;
	background: #fff;	/*背景色*/
	color: #333;		/*文字色*/
}

/*th（左側）、td（右側）の共通設定*/
.ta-card1-parts th,
.ta-card1-parts td {
	border: 1px solid var(--bg-border-color);	/*枠線の幅、線種、var以降は色の指定でtheme.cssのborder-colorを読み込みます。*/
	text-align: left;	/*左寄せ*/
	padding: 1rem;		/*ボックス内の余白。１文字分。*/
}

/*th（左側）のみの設定*/
.ta-card1-parts th {
	background: var(--light-color);		/*背景色。theme.cssのlight-colorを読み込みます。*/
	width: 13rem;			/*幅。13文字分。*/
}

	/*画面幅700px以下の追加指定（カード型に変更）*/
	@media (max-width:700px) {

	.ta-card1-parts,
	.ta-card1-parts caption,
	.ta-card1-parts tbody,
	.ta-card1-parts tr,
	.ta-card1-parts th,
	.ta-card1-parts td {
		display: block;
		width: 100%;
	}
	.ta-card1-parts tr {
		margin-bottom: 1rem;	/*ブロック同士の間に空けるスペース。1文字分。*/
	}
	.ta-card1-parts th {
		border-bottom: none;	/*下の線を消す。入れた方がいいならこの設定を削除。*/
	}
	.ta-card1-parts td {
		border-top: none;	/*上の線を消す。*/
	}

	}/*追加指定ここまで*/
/* =========================
   コース一覧
   スマホはそのまま、PCだけ中央寄せ
========================= */

@media (min-width: 901px) {

	.list-cource1-parts {
		width: min(90vw, 1120px);
		margin-left: auto;
		margin-right: auto;
	}

}

/* ---- 縦書き見出し・本文セット（title11） (title11) ---- */
/*h2
---------------------------------------------------------------------------*/
/*h2*/
main h2.title11-parts {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	margin-top: 60px;
}

/*縦書き*/
main h2.title11-parts .tate {
	order: 2;	/*縦書きを横書きの下に。数字が小さい順に並びます。*/
	display: block;
	writing-mode: vertical-rl;
	text-orientation: upright;
	line-height: 1.1;	/*文字間隔を少しだけ広く*/
	letter-spacing: 0.3em;	/*文字間隔を少し広く*/
}

/*横書き*/
main h2.title11-parts span.small-parts {
	order: 1;	/*横書きを縦書きの上に。数字が小さい順に並びます。*/
	display: block;
	opacity: 0.5;		/*透明度。色を50%出した状態。*/
	font-size: 0.8rem;	/*文字サイズ70%*/
	margin-bottom: 1rem;	/*縦書きの下に１文字分のスペース*/
	letter-spacing: 0.2em;	/*文字間隔を少し広く*/
}
/* =========================
   紹介文セクション
   PCだけ幅を抑えて中央寄せ
========================= */

.intro-text {
	max-width: 760px;
	margin-left: auto;
	margin-right: auto;
	text-align: justify;
	line-height: 1.6;
}
/* PC */
@media (min-width: 901px) {

	.intro-section {
		width: min(90vw, 1120px);
		margin-left: auto;
		margin-right: auto;
	}

	.intro-section p {
		max-width: 760px;
	}

}

/* スマホ */
@media (max-width: 700px) {

	.intro-section {
		text-align: left;
	}

	.intro-section p {
		max-width: none;
	}

}
/*見出しのテキストのフェードイン設定
---------------------------------------------------------------------------*/
@keyframes fadeIn {
	0% {opacity: 0;transform: scale(0.1) rotate(-30deg);}
	100% {opacity: 1;transform: scale(1) rotate(0deg);}
}

/* 初期状態でテキストを非表示にする */
.fade-in-text-parts {
    visibility: hidden;
}

/* アニメーションを適用するクラス。
animationの行の「0.2s」が文字の出現のなめらかさで、大きいほどなめらかに出てきます。
１文字ずつの出現する際の時差は、jsの「テキストのフェードイン効果」の中にある「0.2」で調整できます。*/
.char {
    display: inline-block;
    opacity: 0;
    animation: fadeIn 0.2s linear both;
}

/* =========================================================
   もなか用：カレンダー・下部案内・フッター・固定アイコン
========================================================= */

/* calendar
---------------------------------------------------------------------------*/

.calendar-wrap {
	width: min(100% - 20px, 1100px);
	margin: 0 auto 60px;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 32px;
}

.calendar-block {
	background: rgba(255,255,255,0.35);
	border: 1px solid rgba(71,68,63,0.18);
	padding: 22px;
	box-shadow: 0 12px 30px rgba(0,0,0,0.04);
}

.calendar-title {
	margin: 0 0 16px;
	font-size: 1.05rem;
	font-weight: 500;
	letter-spacing: 0.08em;
	color: var(--bg-inverse-color);
	text-align: center;
}

.calendar {
	width: 100%;
	table-layout: fixed;
	border-collapse: collapse;
	color: var(--bg-inverse-color);
	background: rgba(255,255,255,0.35);
}

.calendar th,
.calendar td {
	border: 1px solid rgba(71,68,63,0.16);
	text-align: center;
	vertical-align: middle;
	padding: 8px 4px;
	height: 44px;
	font-size: 0.85rem;
	font-weight: 500;
}

.calendar th {
	background: rgba(71,68,63,0.08);
	letter-spacing: 0.08em;
}

.calendar td {
	transition: background-color 0.2s ease, color 0.2s ease;
}

.calendar td:hover {
	background: var(--bg-inverse-color);
	color: var(--bg-color);
}

.calendar .mute {
	color: rgba(71,68,63,0.28);
}

.calendar .sun {
	color: #b96b61;
}

.calendar .sat {
	color: #5f7f9f;
}

.calendar .today {
	background: #c66d29;
	color: #fff;
	font-weight: 700;
}

.calendar .off {
	background: #47443f;
	color: #fff;
}

.calendar .note {
	display: block;
	margin-top: 3px;
	font-size: 0.65rem;
	font-weight: normal;
	line-height: 1.3;
	color: inherit;
	opacity: 0.9;
}

/* 定休日のお知らせ 見出し上の余白 */
.calendar-heading {
	margin-top: 120px;
}

/* 下部SEO案内
---------------------------------------------------------------------------*/

.bg1 {

	padding-top: 50px;
	padding-bottom: 50px;
}

/* =========================
   下部案内セクション
   フッター幅に合わせる
========================= */

.info-section {
	width: min(100% - 20px, 1000px);
	margin-left: auto;
	margin-right: auto;
}

.info-section + .info-section {
	margin-top: 40px;
}

.info-section .small-title {
	font-family: "Noto Serif JP", "Hiragino Mincho ProN", "Hiragino Mincho Pro", serif;
	font-size: clamp(1.15rem, 2vw, 1.45rem);
	font-weight: 400;
	line-height: 1.7;
	letter-spacing: 0.05em;
	text-align: center;
	margin-bottom: 1.5rem;
}

/* 本文も少し広げる */
.p-center-small {
	max-width: 900px;
	margin-left: auto;
	margin-right: auto;
	font-size: 0.88rem;
	line-height: 2.1;
	text-align: justify;
	color: var(--bg-inverse-color);
}

.p-center-small a {
	color: var(--accent-color);
	text-decoration: none;
	font-weight: 500;
	border-bottom: 1px solid currentColor;
	padding-bottom: 0.1em;
}

.p-center-small a:hover {
	filter: none;
	opacity: 0.7;
}

/* footer
---------------------------------------------------------------------------*/

footer {
	font-size: 0.9rem;
	line-height: 2;
	padding: 0 0 30px;
}

footer .info-section {
	width: min(100% - 20px, 1000px);
	margin-left: auto;
	margin-right: auto;
}

footer .logo {
	width: fit-content;
	max-width: 100px;
	margin: -50px auto 50px;
}

footer .logo img {
	display: block;
	width: 100%;
	height: auto;
}

.footer-links {
	max-width: 500px;
	margin-left: 0;
	margin-right: auto;
	grid-template-columns: repeat(2, 210px);
	column-gap: 55px;
}
/* =========================
   フッターリンクの「・」を消す
========================= */

.footer-links,
.footer-links li {
	list-style: none !important;
}
fade-in-text
.footer-links {
	padding-left: 0 !important;
	margin-left: 0;
}

.footer-links li::marker {
	content: "" !important;
}
.footer-links li {
	margin: 0;
}

.footer-links a {
	text-decoration: none;
	font-size: 0.8rem;
	line-height: 1.6;
	opacity: 0.9;
}

.footer-links a:hover {
	filter: none;
	opacity: 0.65;
}

footer small {
	display: block;
	margin-top: 24px;
	font-size: 0.72rem;
	letter-spacing: 0.05em;
	opacity: 0.75;
	text-align: center;
}


/* Google Map
---------------------------------------------------------------------------*/

.others-iframe1 {
	width: 100%;
	margin: 30px auto 0;
}

.others-iframe1 iframe {
	display: block;
	width: 100%;
	height: 340px;
	border: 0;
	filter: grayscale(20%);
}


/* =========================
   下部固定アイコンメニュー
   予約 / TEL / LINE / Instagram
========================= */

.icons {
	list-style: none;
	margin: 0;
	padding: 0;
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 999;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	width: 100%;
	background: rgba(255,255,255,0.94);
	border-top: 1px solid rgba(0,0,0,0.12);
	box-shadow: 0 -6px 20px rgba(0,0,0,0.06);
	backdrop-filter: blur(8px);
}

.icons li {
	margin: 0;
	padding: 0;
	list-style: none;
}

.icons a {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 2px;
	width: 100%;
	height: 58px;
	color: var(--bg-inverse-color);
	text-decoration: none;
	font-size: 0.6rem;
	line-height: 1;
	letter-spacing: 0.03em;
}

.icons a:hover {
	filter: none;
	background: rgba(0,0,0,0.04);
}

.icons i {
	font-size: 1.15rem;
	line-height: 1;
}

.icons span {
	display: block;
	font-size: 0.55rem;
	line-height: 1;
	transform: scale(0.9);
	transform-origin: center;
	white-space: nowrap;
	opacity: 0.75;
}

/* 下部固定分、本文が隠れないようにする */
body {
	padding-bottom: 64px;
}

/* pagetopボタンが下部メニューにかぶらないように */
.pagetop a {
	bottom: 78px;
}

/* link-icon
---------------------------------------------------------------------------*/

a.link-icon::after {
	content: "";
	display: inline-block;
	width: 0.72em;
	height: 0.72em;
	margin-left: 0.45em;
	vertical-align: -0.02em;
	background:
		linear-gradient(currentColor, currentColor) right top / 70% 1.5px no-repeat,
		linear-gradient(currentColor, currentColor) right top / 1.5px 70% no-repeat,
		linear-gradient(currentColor, currentColor) left bottom / 70% 1.5px no-repeat,
		linear-gradient(currentColor, currentColor) left bottom / 1.5px 70% no-repeat;
	opacity: 0.8;
}


/* スマホ
---------------------------------------------------------------------------*/

@media (max-width: 800px) {

	.calendar-wrap {
		grid-template-columns: 1fr;
		gap: 22px;
		margin-bottom: 40px;
	}

	.calendar-block {
		padding: 12px;
	}

	.calendar-title {
		font-size: 0.95rem;
		margin-bottom: 12px;
	}

	.calendar th,
	.calendar td {
		height: 40px;
		padding: 6px 3px;
		font-size: 0.78rem;
	}

	.calendar .note {
		font-size: 0.58rem;
	}

	.bg1 {
		padding-top: 36px;
		padding-bottom: 36px;
	}

	.p-center-small {
		font-size: 0.82rem;
		line-height: 2;
		text-align: justify;
	}

	.footer-links {
		grid-template-columns: repeat(2, 1fr);
		gap: 10px 12px;
	}

	.others-iframe1 iframe {
		height: 280px;
	}

}

.small-title {
	font-size: 1.1rem;
	line-height: 1.5;
	text-align: justify;
	}

.info-section {
	width: min(100% - 20px, 1000px);
	margin-left: auto;
	margin-right: auto;
}

.info-section .small-title {
	padding-inline: clamp(20px, 10vw, 200px);
	box-sizing: border-box;
	margin-top: 30px;
	margin-bottom: 10px;
	}

/*Link*/
.group-links {
	padding: 4vw var(--content-space-l);
	margin: 50px 10px 50px 10px !important;
	line-height: 1.5;
}

.group-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1rem;
}

.group-card {
	display: block;
	text-decoration: none;
	border: 1px solid rgba(0,0,0,0.2);
	padding: 1.5rem 0.8rem;
	text-align: center;
	transition: 0.3s;
}

.group-card h3 {
	margin: 0;
	font-size: 1rem;
	letter-spacing: 0.05em;
	line-height: 1.5;
	
}

.group-card p {
	margin: 0.5rem 0 0;
	font-size: 0.8rem;
	color: #474747;
	text-align: center;
	line-height: 1.5;

}

/* hoverでちょいかっこよく */
.group-card:hover {
	transform: translateY(-3px);
	border-color: var(--primary-color);
	color: var(--primary-color);
}
.group-links {
	margin-bottom: 0;
	padding-bottom: var(--content-space-l);
}
/* スマホ対応 */
@media (max-width: 800px) {
	.group-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}
.ta1.formTable th {
	font-size: 0.8rem;
	line-height: 1.5;
	text-align: left;
}
.group-links {
	padding: 4vw var(--content-space-l);
	margin: 50px 0px 50px 0px !important;
	line-height: 1.5;
}

/* =========================================================
   お問い合わせフォーム調整
   form/index.html 用
========================================================= */

/* フォームページ全体 */
.form-page .bg1,
.bg1 {
	background: #fff;
	padding-top: 50px;
	padding-bottom: 70px;
}

/* パンくず */
.breadcrumb {
	width: min(100% - 40px, 1000px);
	margin: 0 auto 40px !important;
	padding-left: 0 !important;
	font-size: 0.9rem !important;
}

.breadcrumb ul {
	gap: 0.5em;
}

.breadcrumb li + li::before {
	content: ">";
	margin-right: 0.5em;
	color: rgba(0,0,0,0.45);
}

.breadcrumb a {
	color: var(--bg-inverse-color) !important;
	text-decoration: none !important;
}

.breadcrumb span {
	color: var(--bg-inverse-color) !important;
}

/* フォームセクション */
.info-section {
	width: min(100% - 40px, 900px);
	margin-left: auto;
	margin-right: auto;
}

/* フォーム見出し */
.info-section h2 {
	margin-bottom: 1.5rem;
	font-size: clamp(1.6rem, 3vw, 2.2rem);
	line-height: 1.5;
	font-weight: 600;
	letter-spacing: 0.04em;
}

/* フォーム前の説明文 */
.info-section .p-center-small {
	max-width: 760px;
	margin: 0 auto 2rem;
	font-size: 0.95rem;
	line-height: 2.1;
	text-align: justify;
}

/* フォームテーブル */
.ta1.formTable {
	width: 100%;
	border-collapse: collapse;
	margin: 0 auto 2rem;
	table-layout: fixed;
	border-top: 1px solid rgba(0,0,0,0.18);
}

/* caption */
.ta1.formTable caption {
	caption-side: top;
	margin-bottom: 1.2rem;
	padding: 0;
	background: transparent;
	color: var(--bg-inverse-color);
	font-size: 1.05rem;
	font-weight: 500;
	letter-spacing: 0.05em;
	text-align: center;
}

/* 行 */
.ta1.formTable tr {
	border-bottom: 1px solid rgba(0,0,0,0.18);
}

/* th / td */
.ta1.formTable th,
.ta1.formTable td {
	padding: 1rem 0.8rem;
	vertical-align: middle;
	line-height: 1.6;
}

/* 左側ラベル */
.ta1.formTable th {
	width: 28%;
	text-align: left;
	font-size: 0.95rem;
	font-weight: 600;
	white-space: nowrap;
}

/* 右側入力欄 */
.ta1.formTable td {
	width: 72%;
	text-align: left;
}

/* 入力欄 */
.ta1.formTable input[type="text"],
.ta1.formTable input[type="email"],
.ta1.formTable textarea {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	border: 1px solid rgba(0,0,0,0.35);
	background: #fff;
	color: var(--bg-inverse-color);
	padding: 0.75rem 0.9rem;
	font-size: 1rem;
	line-height: 1.6;
	font-family: inherit;
	border-radius: 0;
}

/* テキストエリア */
.ta1.formTable textarea {
	min-height: 170px;
	resize: vertical;
}

/* フォーカス時 */
.ta1.formTable input:focus,
.ta1.formTable textarea:focus {
	outline: none;
	border-color: var(--accent-color);
	box-shadow: 0 0 0 2px rgba(198,109,41,0.14);
}

/* 確認ボタン */
.btn-gradient-animated {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 220px;
	min-height: 54px;
	padding: 0.9rem 2rem;
	border: none;
	background: var(--bg-inverse-color);
	color: #fff;
	font-family: inherit;
	font-size: 0.95rem;
	font-weight: 500;
	letter-spacing: 0.08em;
	cursor: pointer;
	transition: 0.3s ease;
}

.btn-gradient-animated:hover {
	transform: translateY(-2px);
	background: var(--accent-color);
	filter: none;
}

/* 送信ボタンの行 */
.ta1.formTable tr:last-child th {
	white-space: normal;
}

.ta1.formTable tr:last-child td {
	text-align: left;
}

/* 入力欄の共通クラス対策 */
.ws,
.wl {
	width: 100% !important;
	display: block;
}

/* =========================================================
   お問い合わせフォーム スマホ調整
========================================================= */

@media (max-width: 700px) {

	.form-page .bg1,
	.bg1 {
		padding-top: 35px;
		padding-bottom: 55px;
	}

	.breadcrumb {
		width: min(100% - 24px, 1000px);
		margin-bottom: 30px !important;
		font-size: 0.8rem !important;
	}

	.info-section {
		width: min(100% - 24px, 900px);
	}

	.info-section h2 {
		font-size: 1.45rem;
		line-height: 1.5;
		margin-bottom: 1.2rem;
	}

	.info-section .p-center-small {
		font-size: 0.86rem;
		line-height: 2;
		margin-bottom: 1.8rem;
	}

	.ta1.formTable,
	.ta1.formTable caption,
	.ta1.formTable tbody,
	.ta1.formTable tr,
	.ta1.formTable th,
	.ta1.formTable td {
		display: block;
		width: 100%;
		box-sizing: border-box;
	}

	.ta1.formTable {
		border-top: none;
	}

	.ta1.formTable caption {
		text-align: left;
		font-size: 0.95rem;
		margin-bottom: 1rem;
	}

	.ta1.formTable tr {
		border-bottom: none;
		margin-bottom: 1rem;
	}

	.ta1.formTable th {
		padding: 0 0 0.35rem;
		font-size: 0.88rem;
		white-space: normal;
	}

	.ta1.formTable td {
		padding: 0;
	}

	.ta1.formTable input[type="text"],
	.ta1.formTable input[type="email"],
	.ta1.formTable textarea {
		padding: 0.75rem;
		font-size: 16px; /* iPhoneのズーム防止 */
	}

	.ta1.formTable textarea {
		min-height: 150px;
	}

	.ta1.formTable tr:last-child {
		margin-top: 1.6rem;
	}

	.ta1.formTable tr:last-child th {
		margin-bottom: 0.8rem;
	}

	.btn-gradient-animated {
		width: 100%;
		min-height: 56px;
	}

}

/* =========================================================
   TOPページ：コース料理セクション
   既存パーツの本文・写真マージンに合わせた完全版
========================================================= */

/* セクション全体 */
.monaka-course-section {
	width: 100%;
	margin: 90px auto 100px;
	padding: 0 var(--content-space-l);
	box-sizing: border-box;
}

/* 見出し下の紹介文
   上のintro-textと同じ空気感に合わせる */
.monaka-course-section > .intro-text {
	max-width: 760px;
	margin-left: auto;
	margin-right: auto;
	text-align: justify;
	line-height: 2.1;
	font-size: 1.05rem;
}
/* コース写真
   上のカード写真と同じ左右ラインに合わせる */
.monaka-course-visual {
	width: min(100%, 1120px);
	margin: 46px auto 80px;
	padding: 0;
	box-sizing: border-box;
	position: relative;
}

.monaka-course-visual figure {
	margin: 0;
	padding: 0;
	border: none;
	background: transparent;
}

.monaka-course-visual figure::before {
	display: none;
}

/* 写真は横ラインを揃えつつ、縦長寄りに見せる */
.monaka-course-visual img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	object-position: center;
}

/* コース一覧 */
.monaka-course-grid {
	width: min(100%, 1120px);
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 2rem;
}

/* コースカード */
.monaka-course-card {
	position: relative;
	display: flex;
	flex-direction: column;
	min-height: 470px;
	padding: 34px 28px 30px;
	border: 1px solid var(--bg-border-color);
	background: #fff;
	box-shadow: none;
	overflow: hidden;
}

/* アクセントライン */
.monaka-course-card::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 4px;
	background: var(--accent-color);
	opacity: 0.85;
}

/* ラベル */
.monaka-course-card .course-label {
	width: fit-content;
	margin-bottom: 18px;
	padding: 0.2em 0.75em;
	border: 1px solid currentColor;
	font-size: 0.72rem;
	line-height: 1.5;
	letter-spacing: 0.14em;
	color: var(--accent-color);
}

/* コース名 */
.monaka-course-card h3 {
	margin: 0 0 14px;
	font-family: "Shippori Mincho", "Noto Serif JP", serif;
	font-size: clamp(1.18rem, 2vw, 1.5rem);
	font-weight: 500;
	line-height: 1.5;
	letter-spacing: 0.05em;
}

/* 短い説明 */
.monaka-course-card .course-copy {
	margin: 0 0 18px;
	font-size: 0.9rem;
	line-height: 1.8;
	font-weight: 500;
	color: var(--accent-color);
}

/* 本文 */
.monaka-course-card .course-text {
	margin: 0 0 20px;
	font-size: 0.84rem;
	line-height: 2;
	text-align: justify;
	opacity: 0.82;
}

/* 料理品数・飲み放題 */
.course-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.45rem;
	margin-top: auto;
	margin-bottom: 14px;
}

.course-meta span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.25em 0.7em;
	border: 1px solid rgba(0,0,0,0.18);
	font-size: 0.72rem;
	line-height: 1.5;
	letter-spacing: 0.04em;
	background: rgba(0,0,0,0.02);
}

/* 価格 */
.monaka-course-card .course-price {
	padding-top: 16px;
	border-top: 1px solid rgba(0,0,0,0.14);
	text-align: right;
}

.monaka-course-card .course-price span {
	font-family: var(--accent-font), var(--base-font);
	font-size: 2rem;
	font-weight: 600;
	letter-spacing: -0.02em;
	color: var(--primary-color);
}

/* 補足 */
.course-subnote {
	margin: 10px 0 0;
	font-size: 0.72rem;
	line-height: 1.7;
	text-align: right;
	opacity: 0.72;
}

/* ボタン */
.course-btn-wrap {
	display: flex;
	justify-content: center;
	gap: 16px;
	margin-top: 34px;
}

.course-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 220px;
	min-height: 52px;
	padding: 0.8rem 1.4rem;
	border: 1px solid var(--bg-inverse-color);
	color: var(--bg-inverse-color);
	text-decoration: none;
	font-size: 0.86rem;
	letter-spacing: 0.08em;
	transition: 0.3s ease;
}

.course-btn:hover {
	filter: none;
	background: var(--bg-inverse-color);
	color: #fff;
}

.course-btn.course-btn-dark {
	background: var(--primary-color);
	color: #fff;
}

.course-btn.course-btn-dark:hover {
	background: var(--accent-color);
	border-color: var(--accent-color);
}


/* =========================================================
   スマホ調整
========================================================= */

@media (max-width: 800px) {

	.monaka-course-section {
		width: 100%;
		margin: 80px auto 70px;
		padding: 0 var(--content-space-l);
	}

	.monaka-course-section > .intro-text {
		width: 100%;
		max-width: none;
		margin: 0 auto 38px;
		font-size: 1rem;
		line-height: 1.6;
		text-align: justify;
	}

	/* スマホは本文より少しだけ内側に入れて、写真が強すぎないように */
	.monaka-course-visual {
		width: calc(100% - 0px);
		margin: 34px auto 52px;
	}

	.monaka-course-visual img {
		aspect-ratio: 4 / 3;
		object-fit: cover;
		object-position: center;
	}

	.monaka-course-grid {
		width: 100%;
		grid-template-columns: 1fr;
		gap: 18px;
	}

	.monaka-course-card {
		min-height: auto;
		padding: 26px 22px 24px;
	}

	.monaka-course-card h3 {
		font-size: 1.2rem;
	}

	.monaka-course-card .course-text {
		font-size: 0.82rem;
		line-height: 1.95;
	}

	.monaka-course-card .course-price span {
		font-size: 1.7rem;
	}

	.course-subnote {
		text-align: left;
		font-size: 0.72rem;
	}

	.course-btn-wrap {
		flex-direction: column;
		gap: 12px;
	}

	.course-btn {
		width: 100%;
		min-height: 54px;
	}

}

/* =========================================================
   Cookie同意バナー
   郷土料理 酒と肴 もなか用
   小さな暖簾カード風
========================================================= */

.cookie-consent {
	position: fixed;
	left: 50%;
	bottom: 26px;
	transform: translateX(-50%) translateY(16px);
	width: min(calc(100% - 36px), 880px);
	z-index: 9998;
	display: block;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	color: var(--bg-inverse-color);
	transition:
		opacity 0.35s ease,
		visibility 0.35s ease,
		transform 0.35s ease;
}

.cookie-consent.is-show {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translateX(-50%) translateY(0);
}

.cookie-consent-inner {
	position: relative;
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: 18px;
	padding: 18px 22px;
	background:
		linear-gradient(
			135deg,
			rgba(255,255,255,0.96),
			rgba(248,247,244,0.94)
		);
	border: 1px solid rgba(105,127,141,0.35);
	box-shadow:
		0 18px 45px rgba(0,0,0,0.14),
		inset 0 0 0 1px rgba(255,255,255,0.6);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	overflow: hidden;
}

/* 上に細い暖簾ライン */
.cookie-consent-inner::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 2px;
	background:
		linear-gradient(
			to right,
			var(--primary-color),
			var(--accent-color),
			var(--primary-color)
		);
}

/* 薄い装飾文字 */
.cookie-consent-inner::after {
	content: "MONAKA";
	position: absolute;
	right: 18px;
	bottom: -8px;
	font-family: var(--accent-font), var(--base-font);
	font-size: 4rem;
	letter-spacing: 0.14em;
	color: rgba(105,127,141,0.08);
	pointer-events: none;
	white-space: nowrap;
}

/* 左の丸印 */
.cookie-mark {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border: 1px solid color-mix(in srgb, var(--accent-color) 55%, transparent);
	border-radius: 50%;
	color: var(--accent-color);
	font-family: "Shippori Mincho", "Noto Serif JP", serif;
	font-size: 1rem;
	line-height: 1;
	background: rgba(255,255,255,0.72);
	flex-shrink: 0;
}

.cookie-consent-text {
	position: relative;
	z-index: 1;
}

.cookie-consent-text p {
	margin: 0;
	font-size: 0.82rem;
	line-height: 1.8;
	color: rgba(51,51,51,0.82);
}

.cookie-consent-text .cookie-title {
	margin-bottom: 4px;
	color: var(--primary-color);
	font-family: "Shippori Mincho", "Noto Serif JP", serif;
	font-weight: 500;
	font-size: 0.95rem;
	letter-spacing: 0.12em;
}

.cookie-consent-actions {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	gap: 10px;
	flex-shrink: 0;
}

.cookie-policy-link,
.cookie-accept-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 108px;
	height: 42px;
	padding: 0 16px;
	font-family: inherit;
	font-size: 0.76rem;
	letter-spacing: 0.08em;
	text-decoration: none;
	transition: 0.3s ease;
	cursor: pointer;
}

.cookie-policy-link {
	border: 1px solid rgba(51,51,51,0.28);
	background: transparent;
	color: var(--bg-inverse-color);
}

.cookie-policy-link:hover {
	filter: none;
	border-color: var(--primary-color);
	color: var(--primary-color);
	background: rgba(105,127,141,0.07);
}

.cookie-accept-btn {
	border: 1px solid var(--primary-color);
	background: var(--primary-color);
	color: #fff;
}

.cookie-accept-btn:hover {
	transform: translateY(-2px);
	background: var(--accent-color);
	border-color: var(--accent-color);
}

/* スマホ */
@media (max-width: 800px) {

	.cookie-consent {
		width: calc(100% - 20px);
		bottom: 78px; /* 下部固定アイコンと重ならないように */
	}

	.cookie-consent-inner {
		grid-template-columns: auto 1fr;
		gap: 12px;
		padding: 16px 14px 14px;
	}

	.cookie-consent-inner::after {
		font-size: 2.2rem;
		right: 8px;
		bottom: -6px;
	}

	.cookie-mark {
		width: 40px;
		height: 40px;
		font-size: 1rem;
	}

	.cookie-consent-text p {
		font-size: 0.72rem;
		line-height: 1.7;
	}

	.cookie-consent-text .cookie-title {
		font-size: 0.84rem;
		margin-bottom: 5px;
	}

	.cookie-consent-actions {
		grid-column: 1 / -1;
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 8px;
		margin-top: 6px;
	}

	.cookie-policy-link,
	.cookie-accept-btn {
		width: 100%;
		min-width: 0;
		height: 40px;
		font-size: 0.72rem;
	}

}

.breadcrumb {
  max-width: 1100px;
  margin: 20px auto 40px;
  padding: 10px 20px;
  font-size: 13px;
}

.breadcrumb ol {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6em;
  list-style: none;
  margin: 0;
  padding: 0;
}

.breadcrumb li::after {
  content: ">";
  margin-left: 0.6em;
  opacity: 0.5;
}

.breadcrumb li:last-child::after {
  content: "";
}

.breadcrumb a {
  color: inherit;
  text-decoration: none;
}

.breadcrumb a:hover {
  text-decoration: underline;
}

/* アコーディオン */
.accordion-008 {
	max-width: auto;
	margin: 0 clamp(50px, 16vw, 500px) 10px;
	border-radius: 1px;
	background-color: #fff;
	border: 1px solid var(--primary-color);
}

.accordion-008 summary {
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: relative;
	padding: 1em 2em;
	color: var(--bg-inverse-color);
	cursor: pointer;

	}

.accordion-008 summary::-webkit-details-marker {
	display: none;

	}

.accordion-008 summary::after {
	transform: translateY(-25%) rotate(45deg);
	width: 	7px;
	height: 7px;
	margin-left: 10px;
	border-bottom: 2px solid var(--primary-color);
	border-right: 2px solid var(--primary-color);
	content: '';
	transition: transform .3s;

	}

.accordion-008[open] summary::after {
	transform: rotate(225deg);

	}

.accordion-008 p {
	transform: translateY(0px);
	opacity: 0;
	margin: 0;
	padding: .3em 2em 1.5em;
	color: var(--bg-inverse-color);

	}

.ta2 caption {
	font-size: 1rem;
	padding: 0.2rem 1rem;
	background: rgba(255,255,255,0.2);
	color: var(--bg-inverse-color);
	margin-bottom: 1rem;
	border-radius: 5px;
	}

.ta2 {
	table-layout: fixed;
	border-top: 1px solid rgba(255,255,255,0.3);
	width: 100%;
	margin-bottom: 2rem;

	}

.ta2 tr {
	border-bottom: 1px solid rgba(255,255,255,0.3);
	color: var(--bg-inverse-color);

	}

.ta2 th, 
.ta2 td {
	font-size: 0.9rem;
	padding: 15px 8px;
	}

.ta2 th {
	padding: 1rem;
	word-break: break-all;
	text-align: left;
	font-weight: normal;
	padding-left: 12px;
	width: 50%;
	
	}

.ta2 td {
	text-align: right;
	padding-right: 10px;
	letter-spacing: 0.05em;
	width: 50%;
	}


/*その他
---------------------------------------------------------------------------*/
.c {text-align: center !important;}
.ws {width: 100%;display: block;}
.wl {width: 100%;display: block;}
.large {font-size: 2em; letter-spacing: 0.1em;}
