@charset "utf-8";


/*cssファイルの読み込み
---------------------------------------------------------------------------*/
@import url("theme.css");
@import url("color.css");
@import url("inview.css");


/*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(13px, 0.29vw + 11.9px, 16px);	/*画面幅375px〜1400pxの間で、13px〜16pxに可変。下で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);	/*背景色。*/
	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を読み込みます。*/
}


/*リンクテキスト全般の設定
---------------------------------------------------------------------------*/
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;
}


/*header（ロゴが入った最上段のブロック）
---------------------------------------------------------------------------*/
/*ヘッダー*/
header {
	position: fixed;	/*画面の一定箇所で固定表示*/
	top: 0;
	left: 0;
	z-index: 100;
	width: 100%;
    display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 2rem;
	min-height: 80px;	/*ヘッダーの高さ。お好みで。*/
	padding: 10px var(--content-space-s) 8px;	/*上に少し余白を持たせる*/
	box-sizing: border-box;
	transition: transform 0.5s ease, opacity 0.5s ease;	/*スクロールでheaderがフェードする際にかける時間。*/
}

/*隠す際のスタイル*/
.site-header.is-hide {
	opacity: 0;
	transform: translateY(-100%); /*真上に隠す*/
	pointer-events: none; /*消えている間はクリックを無効化*/
}

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

	/*ヘッダーをスクロール移動させる*/
	header {
		position: static;
	}

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


/*ロゴ画像*/
header .logo {margin: 0;flex-shrink: 0;}
header .logo img {
	display: block;
	width: 420px;	/*横長ロゴのため大きめに調整*/
	max-width: 42vw;
}


/*header内のメニュー（※開閉メニューとはブロックが異なります）
---------------------------------------------------------------------------*/
/*ヘッダーメニュー全体*/
header nav {
	font-size: 0.85rem;	/*文字サイズ85%*/
	font-weight: bold;	/*太字*/
}

/*ドロップダウン以外のメニュー（見えているメニュー部分）*/
header > nav > ul {
	display: flex;
	align-items: center;
	gap: 1.5rem;	/*メニュー同士に空けるスペース。1.5文字分。*/
}

/*メニュー１個あたりの設定*/
header li a {
	display: block;text-decoration: none;
}

/*ブレイクポイント未満でヘッダーメニューを非表示に（開閉メニューが出てくるので入れ替える）*/
.small-screen header nav {
    display: none;
}


/*header内のドロップダウンメニュー
---------------------------------------------------------------------------*/
/*ドロップダウン全体*/
header ul ul {
	text-shadow: none;
	position: absolute;z-index: 100;
	animation: opa1 0.5s 0.1s both;	/*0.1秒待機後、0.5秒かけてフェードイン表示*/
}

/*メニュー１個あたり*/
header ul ul a {
	background: rgba(0,0,0,0.8);	/*背景色。0,0,0は黒のことで0.8は色が80%出た状態。*/
	color: #fff;			/*文字色*/
	padding: 0.2rem 1rem;	/*上下に0.2文字分、左右に1文字分の余白*/
	border-radius: 3px;		/*角を少しだけ丸く。*/
	margin-top: 3px;		/*メニュー同士の間に空けるスペース*/
}

/*マウスオン時の背景色*/
header ul ul a:hover {
	background: rgba(0,0,0,0.5);	/*背景色*/
}


/*メニューオーバーレイ（メニュー領域外クリックで閉じる用）
---------------------------------------------------------------------------*/
#menubar-overlay {
	display: none;
	position: fixed;
	z-index: 99;	/*#menubar(100)の下、ページの上*/
	top: 0;left: 0;
	width: 100%;height: 100%;
	background: rgba(0,0,0,0.3);	/*半透明の黒。お好みで濃さを調整。*/
}

/*noscroll（メニュー表示中のスクロール禁止用）*/
body.noscroll {
	overflow: hidden;
}


/*小さな端末で見たメニュー（開閉メニュー）
---------------------------------------------------------------------------*/
/*メニューブロック共通*/
.small-screen #menubar {
	animation: animation1 0.2s both;
	position: fixed;overflow: auto;z-index: 100;
	right: 0px;top: 0px;
	width: 50%;	/*画面の半分の幅*/
	height: 100%;
	padding: 100px var(--content-space-l) 50px;	/*上下に100px、左右にtheme.cssのcontent-space-lで指定しているサイズ、下に50pxの余白*/
	background: var(--bg-inverse-color);		/*背景色。theme.cssのbg-inverse-colorを読み込みます。*/
	color: var(--bg-color);	/*文字色。theme.cssのbg-colorを読み込みます。*/
}

.small-screen #menubar {display: none;}

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

	.small-screen #menubar {
		width: 100%;	/*幅を100%に*/
	}

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


/*メニュー１個あたり*/
.small-screen #menubar a {
	display: block;text-decoration: none;
	margin-bottom: 1rem;	/*下に１文字分のスペースを空ける*/
	padding: 0.65rem 1.6rem;		/*メニュー内の余白。少し細めに調整*/
	border-radius: 0;		/*角丸をなくして四角にする*/
	background: #fff;		/*背景色*/
	color: #333;			/*文字色*/
}

/*ボタンのテキストの太さを標準に*/
.small-screen #menubar .btn a {
	font-weight: normal;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 0.5rem;
	min-height: 48px;
	line-height: 1.2;
	text-align: left;
}

.small-screen #menubar .btn a span {
	white-space: nowrap;
}

/*子メニュー（ドロップダウンメニュー）*/
.small-screen #menubar ul ul a {
	margin-left: 2rem;		/*左に２文字分のスペースを空ける*/
	padding: 0.45rem 1.5rem;	/*メニュー内の余白。上下を少し細めに調整*/
}

/*ドロップダウンのアイコン*/
a.ddmenu::before {
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	content: "";		/*このアイコンを使う*/
	margin-right: 1em;		/*アイコンとメニューテキストとの間に空けるスペース。1文字分。*/
	font-size: 0.7em;		/*アイコンサイズ。70%*/
	vertical-align: middle;
	display: inline-block;
	line-height: 1;
}

/*ドロップダウン共通（デフォルトで非表示。チラつかないよう念の為。）
---------------------------------------------------------------------------*/
#menubar ul ul {display: none;}


/*３本バー（ハンバーガー）アイコン設定
---------------------------------------------------------------------------*/
#menubar_hdr {
	display: none; /* デフォルトは非表示 */
	animation: opa1 0s 0.2s both;
	cursor: pointer;
	position: fixed;
	z-index: 101;
	right: 0px;	/*右からの配置場所*/
	top: 0px;	/*上からの配置場所*/
	width: 70px;	/*ボタンの幅*/
	height: 70px;	/*ボタンの高さ*/
	border-bottom-left-radius: 10px;	/*左下の角だけ丸くする*/
	background: var(--primary-color);	/*背景色。theme.cssのprimary-colorを読み込みます。*/
}

/*ハンバーガーアイコンの線*/
#menubar_hdr span {
	display: block;
	transition: 0.3s;
	position: absolute;
	left: 18px;
	width: 35px;
	height: 2px;		/*線の高さ*/
	background: var(--primary-inverse-color);	/*線の色。theme.cssのprimary-inverse-colorを読み込みます。*/
}

/*バツ印が出ている時のボタン色*/
#menubar_hdr.ham {
	background: var(--accent-color);	/*背景色。theme.cssのaccent-colorを読み込みます。*/
}
#menubar_hdr.ham span {
	background: var(--accent-inverse-color);	/*線の色。theme.cssのaccent-inverse-colorを読み込みます。*/
}

/*以下変更不要*/
#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);
}

/*小さな画面での設定*/
.small-screen #menubar_hdr {
	display: flex;
}


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


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

/*h2*/
main h2 {
	line-height: 1.5;
	display: flex;
	flex-direction: column-reverse;
	gap: 0.8rem;
	letter-spacing: 0.1em;
	margin-top: 0;
	font-weight: 500;	/*テキストの太さ。200〜900指で定可能。*/
}

/*上のライン*/
main h2::before {
	content: "";
	display: block;
	width: 3rem;	/*幅。3文字分。お好みで。*/
	height: 1px;	/*高さ。お好みで。*/
	background: var(--primary-color);	/*線の色。theme.cssのprimary-colorを読み込みます。*/
}
main .bg1-accent-parts h2::before {
	background: var(--accent-inverse-color);	/*背景色にbg1-accent-partsを使った場合にラインの色を調整する*/
}

/*ライン無しにしたい場合*/
main h2.no-border::before {
	display: none;
}

/*センタリング時*/
main h2.c {
	width: fit-content;
	margin-inline: auto;
	text-align: center;
}

/*センタリング時のライン*/
main h2.c::before {
	margin-inline: auto;
}

/*h2内のspan*/
main h2 span {
	display: block;
	font-size: 0.7rem;	/*文字サイズ70%*/
	letter-spacing: 0.1em;	/*文字間隔を少しだけ広く*/
	color: var(--primary-color);	/*文字色。theme.cssのprimary-colorを読み込みます。*/
}

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


/*メイン画像
---------------------------------------------------------------------------*/
.mainimg * {margin: 0;padding: 0;}
.mainimg .slide picture {display: block;width: 100%;height: 100%;}

/*メイン画像全体を囲むブロック*/
.mainimg {
	width: 100%;
	position: relative;
}

/*テキストブロック*/
.mainimg .slide .text {
	position: absolute;z-index: 1;
	inset: 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 1rem;
	margin: 40px var(--content-space-l) 0;	/*上に40pxのスペース（headerの半分）、左右はtheme.cssのcontent-space-lを読み込みます。下は0。*/
	width: 50%;	/*ブロックの幅。お好みで。*/
}

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

	/*テキストブロック*/
	.mainimg .slide .text {
		margin-top: 0;
	}

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


/*テキストを白にしたい場合（inverse）*/
.mainimg .slide .text.inverse {
	color: #fff;
	text-shadow: none;
}

/*h2（大きな文字）*/
.mainimg .text h2 {
	margin: 0;padding: 0;
	line-height: 1.5;	/*行間を少し狭く*/
	font-weight: 400;	/*テキストの太さ。200〜900指で定可能。*/
	font-size: max(15px, 3vw);	/*文字サイズ3vw。最小サイズは18pxでそれ以上小さくしない。*/
	letter-spacing: 0.1em;		/*文字間隔を少しだけ広く*/
}

/*p（説明テキスト部分）*/
.mainimg .text p {
	font-size: 0.85rem;	/*文字サイズ85%*/
}

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

	/*画面が小さくなるので、説明文を非表示に*/
	.mainimg .text p:not(.btn) {
		display: none;
	}

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


/*ボタンブロック*/
.mainimg .btn-container {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;		/*2個以上ボタンを並べた場合の、間に空けるスペース。*/
	font-size: 1.1rem;	/*文字サイズ1.1倍*/
}


/*ボタン
---------------------------------------------------------------------------*/
.btn a {
	display: inline-flex;		/*文字とSVG矢印を横並びにする*/
	align-items: center;		/*縦位置を中央に揃える*/
	text-decoration: none;
	background: var(--primary-color);		/*背景色。theme.csのprimary-colorを読み込みます。*/
	color: var(--primary-inverse-color);	/*文字色。theme.csのprimary-inverse-colorを読み込みます。*/
	border: 1px solid var(--primary-color);	/*枠線の幅、線種、var以降は色の指定で、theme.cssのprimary-colorを読み込みます。*/
	padding: 0.4rem 2rem;	/*上下に0.4文字分、左右に2文字分の余白*/
	font-weight: 500;		/*文字の太さ*/
}

/*背景が白いタイプのボタン*/
.btn.inverse a {
	background: var(--primary-inverse-color);	/*背景色。theme.csのprimary-inverse-colorを読み込みます。*/
	color: var(--primary-color);				/*文字色。theme.csのprimary-colorを読み込みます。*/
}


/*矢印アイコン（SVG・共通）*/
.arrow {
	display: inline-block;
	width: 2em;					/*矢印全体の長さ。文字サイズに連動*/
	height: 0.5em;				/*矢印の高さ*/
	margin-left: 0.7em;			/*テキストとの間隔*/
	margin-right: -1em;			/*矢印の右側が少し広いので、右につめる*/
	vertical-align: middle;
	fill: none;
	stroke: currentColor;		/*親の文字色を継ぐ*/
	stroke-width: 1;			/*線の太さ。明朝・細字に合わせて細め*/
	stroke-linecap: square;
	stroke-linejoin: miter;
	overflow: visible;
	transition: transform 0.35s ease;
}

/*マウスオン時に矢印が右に動く*/
.btn a:hover .arrow {
	transform: translateX(6px);
}


/*list1（「こんなお悩みはありませんか」「施術メニュー」「施術の流れ」で使用しているカラムブロック）
---------------------------------------------------------------------------*/
.list1 * {margin: 0;padding: 0;}

/*ボックス全体*/
.list1 {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));	/*4列*/
	gap: 1.5rem;		/*ボックス同士の間に空けるスペース。1.5文字分。*/
}

	/*画面幅700px以下の追加指定*/
	@media (max-width:700px) {
	
	/*700px以下で1列に*/
	.list1 {
		grid-template-columns: repeat(2, minmax(0, 1fr));	/*2列*/
	}

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


/*ボックス１個あたり*/
.list1 .list {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	border: 1px solid var(--bg-border-color);	/*枠線の幅、線種、var以降は色の指定でtheme.cssのbg-border-colorを読み込みます。*/
	padding: 2rem;	/*ボックス内の余白。2文字分。ここを変更する場合、下の「margin: -2rem」の数字部分も合わせて変更する。*/
}

	/*画面幅700px以下の追加指定*/
	@media (max-width:700px) {
	
	/*ボックス１個あたり*/
	.list1 .list {
		padding: 1rem;
	}

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


/*ボーダーなしタイプ（「施術の流れ」ブロックで使用）*/
.list1.no-border .list {
	border: none;
	padding: 0;
}

/*ボックス内いっぱいに画像を配置したい場合用（「施術メニュー」ブロックで使用）*/
.list1.image-full .image {
	margin: -2rem;
	margin-bottom: 0;
}

	/*画面幅700px以下の追加指定*/
	@media (max-width:700px) {
	
	/*ボックス１個あたり*/
	.list1.image-full .image {
		margin: -1rem;
	}

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


/*テキストボックス*/
.list1 .list .text {
	flex: 1;
}

/*画像*/
.list1 .list .image img {
	display: block;
	width: 100%;
}


/* 学芸大ゴルフスタジオ：設備・解析システムの画像比率を統一 */
#menu .list1.image-full .list .image img {
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

/* スタジオトップページ：施設写真は中央を基準にトリミング */
#menu .list1.image-full .list .image img {
	object-position: center center;
}

/*説明文*/
.list1 .list p {
	line-height: 1.5;	/*行間を少し狭く*/
	font-size: 0.8rem;	/*文字サイズ85%*/
}

/*ボタン*/
.list1 .list .btn a {
	display: block;
	text-align: center;
}


/*list2（「当院について」ブロック）
---------------------------------------------------------------------------*/
.list2 * {margin: 0;padding: 0;}

/*ボックス全体*/
.list2 {
	display: grid;
	grid-template-columns: 30% minmax(0, 1fr) auto;	/*左が30%、右は自動、残りを中央。*/
	gap: 4rem;	/*ブロック同士の間に空けるスペース。4文字分。*/
}

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

	/*ボックス全体*/
	.list2 {
		padding-inline: var(--content-space-l);	/*両サイドがくっついてしまうので、スペースを確保*/
		grid-template-columns: repeat(2, minmax(0, 1fr));	/*2列*/
		grid-template-areas:
			"image tate"	/*１行目：「image」と「tate」を左右に並べる*/
			"text text";	/*２行目：「text」を２マス分まとめて配置*/
	}
	
	.list2 .image {grid-area: image;} /*院長画像 → 上の「image」エリアへ*/
	.list2 .text  {grid-area: text;}  /*テキストブロック → 上の「text」エリアへ*/
	.list2 .tate  {grid-area: tate;justify-self: center;}  /*縦書きブロック → 上の「tate」エリアへ*/

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


/*テキストブロック*/
.list2 .text {
	display: flex;
	flex-direction: column;
	gap: 2rem;
}

/*テキストブロック内のinner（アイコン入りの3カラム）*/
.list2 .inner {
	display: flex;	/*横並び*/
	gap: 0.5rem;	/*3つのブロックの間に空けるスペース。0.5文字分。*/
}

/*アイコン入りのブロック１個あたり*/
.list2 .inner > div {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 1rem;
	align-items: center;
	text-align: center;
	font-size: 0.8rem;	/*文字サイズ80%*/
	border: 1px solid var(--bg-border-color);
	padding: 1rem;	/*ブロック内の余白。1文字分。*/
	border-radius: 10px;	/*角を丸くする。*/
}


/* オリジナルSVGアイコン（ドライバー） */
.list2 .inner > div img.custom-icon {
	display: block;
	width: 3rem;
	height: 3rem;
	object-fit: contain;
}

/*アイコン*/
.list2 .inner > div i {
	color: var(--accent-color);	/*アイコンの色。theme.cssのaccent-colorを読み込みます。*/
	font-size: 2.4rem;			/*アイコンサイズ*/
}

/*縦書きブロック*/
.list2 .tate {
	background: var(--accent-color);	/*背景色。theme.cssのaccent-colorを読み込みます。*/
	color: var(--accent-inverse-color);	/*文字色。theme.cssのaccent-inverse-colorを読み込みます。*/
	writing-mode: vertical-rl;	/*縦書き*/
	text-orientation: upright;	/*縦書き*/
	padding: 2rem 4rem;		/*上下に2文字分、左右に4文字分の余白。*/
	letter-spacing: 0.2em;	/*文字間隔を少し広く*/
	text-align: center;		/*天地中央になるように*/
	font-size: 1.05rem;
	font-weight: 700;
	line-height: 1.8;
}


/*list3（「サンプル整骨院が選ばれる理由」ブロック）
---------------------------------------------------------------------------*/
.list3 * {margin: 0;padding: 0;}

/*ボックス全体*/
.list3 {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));	/*4列*/
	gap: 1rem;	/*ボックス同士に空けるスペース。1文字分。*/
}

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

	/*ボックス全体*/
	.list3 {
		grid-template-columns: repeat(2, minmax(0, 1fr));	/*2列*/
	}

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


/*ボックス１個あたり*/
.list3 .list {
	display: flex;
	align-items: center;
	gap: 1rem;
	border: 1px solid var(--bg-border-color);	/*枠線の幅、線種、var以降は色の指定でtheme.cssのbg-border-colorを読み込みます。*/
	padding: 1rem;	/*ボックス内の余白*/
	font-size: 0.9rem;	/*文字サイズ90%*/
	line-height: 1.6;	/*行間を少しせまく*/
}

/*テキストブロック*/
.list3 .text {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

/*テキスト内の番号*/
.list3 .text h4 span {
	display: block;
	color: var(--accent-color);	/*文字色。theme.cssのaccent-colorを読み込みます。*/
	font-family: var(--accent-font), var(--base-font);	/*英語の場合はtheme.cssのaccent-fontに指定したフォントを読み込む。日本語はbase-fontで指定したフォントを読み込む。*/
	font-size: 1.5rem;	/*文字サイズ1.5倍*/
	opacity: 0.5;		/*透明度50%*/
	font-weight: 300;	/*文字の太さ*/
}

/*アイコン*/
.list3 .list i {
	flex-shrink: 0;
	font-size: 3rem;	/*アイコンサイズ*/
	color: var(--accent-color);	/*アイコン色。theme.cssのaccent-colorを読み込みます。*/
}

/*段落（説明文）*/
.list3 .list p {
	font-size: 0.8rem;	/*文字サイズ80%*/
}


/*サムネイルの横スライドショー（「お客様の声」ブロック）
---------------------------------------------------------------------------*/



/*スライドショー全体を囲むブロック*/


/*１個あたりのボックスの設定と、4列配置する為の指示*/


	/*画面幅800px以下の追加指定*/
	@media screen and (max-width:800px) {
	
	/*2列配置に変更する*/
	

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


/*「 " 」の記号 */


/*画像たちを囲むブロック*/


/*画像*/


/*h4見出し*/



/*段落タグ(p)*/



/*現在表示中（インジケーター）のボタン
---------------------------------------------------------------------------*/
/*全体*/


/*１個あたり*/


/*アクティブボタン色*/



/*flex1（「院内空間」のブロック）
---------------------------------------------------------------------------*/
/*ブロック全体*/
.flex1 {
	display: flex;	/*横並びに*/
	align-items: center;	/*上下中央に配置*/
	gap: 6vw;		/*テキストと写真の間に空けるスペース。画面幅の6%。*/
}

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

	.flex1 {
		flex-direction: column;	/*縦積みに*/
		align-items: flex-start;
	}

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


/*画像ブロック*/
.flex1 .image img {display: block;min-width: 0;}
.flex1 .image {
	width: 50%;	/*幅。お好みで。*/
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

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

	.flex1 .image {
		width: 100%;
	}

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


/*imageブロック内のinner（アイコン入りの3カラムブロック）*/
.flex1 .image .inner {
	display: flex;
	font-size: 0.8rem;	/*文字サイズ*/
	border-right: 1px solid var(--bg-border-color);	/*右側の線の幅、線種、var以降は色の指定でtheme.cssのbg-border-colorを読み込みます。*/
}

/*imageブロック内の3カラムブロック１個あたり*/
.flex1 .image .inner > div {
	flex: 1;
	padding: 1rem;	/*ブロック内の余白*/
	display: flex;
	flex-direction: column;
	gap: 0.5rem 0;
	align-items: center;
	text-align: center;
	border-left: 1px solid var(--bg-border-color);	/*左側の線の幅、線種、var以降は色の指定でtheme.cssのbg-border-colorを読み込みます。*/
}

/*imageブロック内の3カラムのアイコン*/
.flex1 .image .inner > div i {
	font-size: 1.5rem;	/*アイコンサイズ。1.5倍。*/
	color: var(--accent-color);	/*アイコンの色。theme.cssのaccent-colorを読み込みます。*/
}

/*テキストブロック*/
.flex1 .text {
	flex: 1;
	min-width: 0;
}

/*テキストブロック内のinner（正方形写真が3枚並んだブロック）*/
.flex1 .text .inner {
	display: flex;
	gap: 1rem;	/*写真同士の間に空けるスペース。1文字分。*/
}

.flex1 .text img {min-width: 0;}


/*flex2（「よくあるご質問」ブロック）
---------------------------------------------------------------------------*/
/*ブロック全体*/
.flex2 {
	display: flex;	/*横並びに*/
	align-items: flex-start;	/*上揃え*/
	justify-content: space-between;
	gap: 4rem;	/*左右のブロックの間に空けるスペース。4文字分。*/
}

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

	/*ブロック全体を縦積みに*/
	.flex2 {
		flex-direction: column;
		gap: 1rem;
	}

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


/*テキストブロック*/
.flex2 .text {
	flex: 1;
	min-width: 0;
}

/*FAQブロック*/
.flex2 dl {
	width: 70%;	/*幅。お好みで。*/
}

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

	/*縦積みになるので、FAQブロックを100%に*/
	.flex2 dl {
		width: 100%;
	}

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


/*openclose（「よくあるご質問」ブロック）
---------------------------------------------------------------------------*/
/*質問*/
.openclose {
	position: relative;
	padding: 1.2rem 3rem 1.2rem 1.2rem;	/*上下に1.2文字分、右に3文字分（＋アイコン用のスペース）、左に1.2文字分の余白。*/
	border-bottom: 1px solid var(--bg-border-color);	/*下に薄い区切り線。色はtheme.cssのbg-border-colorを読み込みます。*/
	cursor: pointer;	/*マウスカーソルを指マークに*/
	transition: background 0.2s;	/*背景色の変化を0.2秒かけて*/
	user-select: none;	/*テキスト選択を無効にする*/
	font-weight: bold;	/*太字*/
}

/*1つ目の質問の上にも線を入れる（一番上のフチを揃える）*/
.openclose:first-of-type {
	border-top: 1px solid var(--bg-border-color);
}

/*質問のマウスオン時*/
.openclose:hover {
	background: var(--light-color);	/*背景色。theme.cssのlight-colorを読み込みます。*/
}

/*右端の＋アイコン：横線（::before）*/
.openclose::before {
	content: "";
	position: absolute;
	right: 1.2rem;	/*右からの位置。1.2文字分。*/
	top: 50%;
	width: 14px;	/*横線の長さ*/
	height: 2px;	/*横線の太さ*/
	background: var(--primary-color);	/*線の色。theme.cssのprimary-colorを読み込みます。*/
	transform: translateY(-50%);
	transition: transform 0.3s, background 0.3s;	/*回転と色変化を0.3秒かけてなめらかに*/
}

/*右端の＋アイコン：縦線（::after）*/
.openclose::after {
	content: "";
	position: absolute;
	right: calc(1.2rem + 6px);	/*横線の真ん中に縦線が重なる位置（横線14px − 縦線2px の半分=6px）*/
	top: 50%;
	width: 2px;	/*縦線の太さ*/
	height: 14px;	/*縦線の長さ*/
	background: var(--primary-color);	/*線の色*/
	transform: translateY(-50%);
	transition: transform 0.3s, background 0.3s;
}

/*開いている時（両方の線を45度回転して＋を×に変化）*/
.openclose.active::before,
.openclose.active::after {
	transform: translateY(-50%) rotate(45deg);
	background: #ff0000;	/*クリック時の色*/
}

/*回答*/
.openclose + dd {
	padding: 1rem 1.2rem 1.5rem;	/*上に1文字分、左右に1.2文字分、下に1.5文字分の余白。*/
	border-bottom: 1px solid var(--bg-border-color);	/*下に薄い区切り線。*/
	background: #000;	/*背景を黒に*/
	font-size: 0.95rem;	/*文字サイズ95%*/
	line-height: 1.8;	/*行間*/
}

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

	/*質問の余白を狭く*/
	.openclose {
		padding: 1rem 2.5rem 1rem 1rem;	/*上下に1文字分、右に2.5文字分、左に1文字分。*/
	}

	/*＋アイコンを少し小さく*/
	.openclose::before {
		right: 1rem;	/*右からの位置。1文字分。*/
		width: 12px;	/*横線の長さ*/
	}
	.openclose::after {
		right: calc(1rem + 5px);	/*横線の真ん中に合わせる（横線12px − 縦線2px の半分=5px）*/
		height: 12px;	/*縦線の長さ*/
	}

	/*回答の余白を狭く*/
	.openclose + dd {
		padding: 0.8rem 1rem 1.2rem;
	}

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


/*access（「アクセス・院情報」ブロック）
---------------------------------------------------------------------------*/
/*ブロック全体*/
.access {
	display: flex;	/*横並びに*/
	align-items: flex-start;	/*上揃え*/
	gap: 2rem;	/*ブロック同士の間に空けるスペース。2文字分。*/
}

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

	.access {
		flex-direction: column;	/*縦積みに*/
	}

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


/*テキスト＆写真ブロック*/
.access .text-box {
	flex: 1;
	display: grid;
	grid-template-columns: 40% minmax(0, 1fr);	/*左が40%、右側は残り*/
	gap: 1rem;
}

/*1週間テーブルを2カラム分跨ぐ*/
.access .text-box .ta-week {
	grid-column: 1 / -1;
}

/*見出しと段落のマージンを消す*/
.access .text h4,
.access .text p {
	margin: 0;
}

/*iframeブロック*/
.access .map {
	width: 50%;	/*幅。お好みで。*/
}

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

	/*iframeブロック*/
	.access .map {
		width: 100%;
	}

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


/*iframe（Google Map）*/
.access .map iframe {
	display: block;
	aspect-ratio: 3 / 2;	/*アスペクト比3対2。お好みで。*/
}


/*1週間テーブル（ta-week）
---------------------------------------------------------------------------*/
/*テーブルブロック設定*/
.ta-week {
	table-layout: fixed;
	border-collapse: separate;
	border-spacing: 0;
	overflow: hidden;
	border-radius: 10px;	/*角を丸くする指定*/
	width: 100%;
	border: 1px solid var(--bg-border-color);	/*テーブル外側の線の幅、線種、varは色の指定でtheme.cssのbg-border-colorを読み込みます。*/
	background: var(--bg-color);	/*背景色。theme.cssのbg-colorを読み込みます。*/
	color: var(--bg-inverse-color);	/*文字色。theme.cssのbg-inverse-colorを読み込みます。*/
	font-size: 0.8rem;
}

/*受付時間の幅*/
.ta-week th:first-child,
.ta-week td:first-child {
	width: 25%;
}

/*各曜日の幅*/
.ta-week th:not(:first-child),
.ta-week td:not(:first-child) {
	width: calc(75% / 7);	/*受付時間で25%とっているので残りの75%を7で割る*/
}

/*th(曜日)とtd(時間)*/
.ta-week th,
.ta-week td {
	padding: 0.5rem 0;	/*ボックス内の余白。上下に１文字分、左右は0。*/
	text-align: center;	/*テキストをセンタリング*/
	border-bottom: 1px solid var(--bg-border-color);	/*下の線の幅、線種、varは色の指定でtheme.cssのbg-border-colorを読み込みます。*/
	border-right: 1px solid var(--bg-border-color);	/*右の線の幅、線種、varは色の指定でtheme.cssのbg-border-colorを読み込みます。*/
}

/*th(曜日)とtd(時間)のそれぞれ最後の右側の線を消す*/
.ta-week th:last-child,
.ta-week td:last-child {
	border-right: none;
}

/*最後の行の下線を消す*/
.ta-week tr:last-child td {
	border-bottom: none;
}

/*１行目。th(曜日)の追加指定*/
.ta-week th {
	background: var(--light-color);		/*背景色。theme.cssのprimary-colorを読み込みます。*/
	color: var(--light-inverse-color);	/*文字色。theme.cssのprimary-inverse-colorを読み込みます。*/
}

/*２行目以降。*/
.ta-week td {
	border-bottom: 1px solid var(--bg-border-color);	/*下の線の幅、線種、、varは色の指定でtheme.cssのbg-border-colorを読み込みます。*/
}


/*form-simple
---------------------------------------------------------------------------*/




























.check-single{
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    line-height: 1.6;
}

.check-single input{
    margin-top: 0.3rem;
    flex-shrink: 0;
}











/*個人情報同意チェックを中央寄せ*/


/*送信ボタン*/






.hp-field {
    position: absolute !important;
    left: -9999px !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
}

@media (max-width: 767px) {
    

    

    

    
}

/*郵便番号・都道府県はPCで少し短くする*/
@media (min-width: 768px) {

	.h-adr input[name="postal_code"],
	.h-adr input[name="address_pref"] {
		width: min(100%, 10rem);
	}

}

/*プルダウンを見た目でわかりやすくする*/
.h-adr select {
	-webkit-appearance: none;
	appearance: none;
	padding-right: 2.6rem;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23666' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 0.9rem center;
	background-size: 0.8rem auto;
	cursor: pointer;
}


/*news（お知らせ）
---------------------------------------------------------------------------*/
dl.news * {margin: 0;padding: 0;}

/*日付*/
dl.news dt {
	display: flex;
}

	/*画面幅900px以上の追加指定*/
	@media (min-width: 900px){

	dl.news {
		display: grid;
		grid-template-columns: max-content minmax(0, 1fr);	/*日付幅は最大の文字数幅に自動調整し、右側テキストは残り一杯使う。*/
		gap: 0 2rem;	/*2remが、日付とテキストとの間に空けるスペース。お好みで。*/
		align-items: start;
	}

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


/*contact（「ご予約・お問い合わせ」ブロック）
---------------------------------------------------------------------------*/
#contact * {margin: 0;padding: 0;}

/*ブロック全体*/
#contact {
	background-image: linear-gradient(90deg, rgba(0,0,0,.72) 0%, rgba(0,0,0,.52) 34%, rgba(0,0,0,.20) 62%, rgba(0,0,0,0) 100%), var(--contact-bg-image);	/*各スタジオで差し替え可能*/
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
}

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

	/*ブロック全体を縦積みに*/
	#contact {
		flex-direction: column;
	}

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


/*テキストブロック（「ご予約・お問い合わせ」があるブロック）*/
#contact .text {
	flex: 1;
	position: relative;
	z-index: 1;
	color: #fff;
	text-shadow: 0 2px 10px rgba(0,0,0,.45);
}

/*テキストブロック２（「WEBなら24時間受付中」があるブロック）*/
#contact .text2 {
	background: var(--bg-color);	/*背景色。theme.cssのbg-colorを読み込みます。*/
	color: var(--bg-inverse-color);	/*文字色。theme.cssのbg-inverse-colorを読み込みます。*/
	padding: 2rem;			/*ブロック内の余白。2文字分。*/
	border-radius: 5px;		/*角を少しだけ丸く*/
	text-align: center;		/*テキストをセンタリング*/
}

/*ボタン*/
#contact .btn a {
	display: flex;
	padding: 0.4rem 2rem;	/*上下に0.4文字分、左右に2文字分の余白*/
}


/*フッター
---------------------------------------------------------------------------*/
footer ul {list-style: none;margin: 0;padding: 0;}
footer p {margin: 0;}
footer a {text-decoration: none;}

/*フッターボックス全体（1カラム）*/
footer {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 3rem;			/*footer直下のボックスの間に空けるスペース。２文字分。*/
	font-size: 0.8rem;	/*文字サイズ80%*/
	padding: var(--content-space-s) var(--content-space-l);	/*ボックス内の余白。上下にはtheme.cssのcontent-space-sを、左右にはcontent-space-lを読み込みます。*/
	background: var(--light-color);		/*背景色。theme.cssのlight-colorを読み込みます。*/
	color: var(--light-inverse-color);	/*文字色。theme.cssのlight-inverse-colorを読み込みます。*/
}

/*ロゴの最大幅*/
footer .logo {
	max-width: 150px;
}

/*footer内アイコンの右マージン（電話アイコン、メールアイコン等）*/
footer i {
	margin-right: 0.5rem;
}

/*footer直下の各ブロック共通レイアウト（縦並び）*/
footer > div {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

/*フッターメニュー*/
footer .menu {
	flex-direction: row;	/*縦並びから横並びに上書き*/
	gap: 3vw;	/*中身（ulメニュー等）同士の間に空けるスペース。3%。*/
}

/*メニューの見出し*/
footer .title {
	font-weight: bold;
	margin-bottom: 0.5em;
}

/*Copyright部分*/
footer small {
	width: 100%;
	display: block;
	text-align: center;
	font-size: 0.8rem;
}


/*SNSアイコン
---------------------------------------------------------------------------*/
.sns {
	list-style: none;
	margin: 0;padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;		/*アイコン同士のマージン的な要素。１文字分。*/
}

.sns i {
	font-size: 20px;	/*アイコンサイズ*/
}


/*著作部分（※意図的に見えなくしたりしないで下さい。規約違反になります。）
---------------------------------------------------------------------------*/
.pr a {
	text-decoration: none;display: block;
	background: rgba(0,0,0,0.5);
	color: #ccc;
	text-align: right;
	padding: 0.5rem 1rem;
	font-size: 0.8rem;
}
.pr a::before {
	font-family: "Font Awesome 6 Free";
	content: "";
	font-weight: 900;
	margin-right: 0.5em;
}


/*PAGE TOP（↑）設定
---------------------------------------------------------------------------*/
.pagetop-show {display: block;}

/*ボタンの設定*/
.pagetop a {
	display: block;text-decoration: none;text-align: center;z-index: 99;
	animation: opa1 1s 0.4s both;
	position: fixed;	/*スクロールに追従しない(固定で表示)為の設定*/
	right: 20px;		/*右からの配置場所指定*/
	bottom: 20px;		/*下からの配置場所指定*/
	color: #fff;		/*文字色*/
	font-size: 1.5rem;	/*文字サイズ*/
	background: rgba(0,0,0,0.2);	/*背景色。0,0,0は黒の事で0.2は色が20%出た状態。*/
	width: 60px;		/*幅*/
	line-height: 60px;	/*高さ*/
	border-radius: 50%;	/*円形にする*/
}


/*bg1-border-parts
---------------------------------------------------------------------------*/
.bg1-border-parts {
	border-top: 1px solid var(--bg-border-color);		/*上の線の幅、線種、var以降は色の事でtheme.cssのbg-border-colorを読み込みます。*/
	border-bottom: 1px solid var(--bg-border-color);	/*下の線の幅、線種、var以降は色の事でtheme.cssのbg-border-colorを読み込みます。*/
}

/*bg1-parts
---------------------------------------------------------------------------*/
.bg1-parts {
	background-color: var(--bg-inverse-color);	/*背景色。theme.cssのbg-inverse-colorを読み込みます。*/
	color: var(--bg-color);		/*背景色。theme.cssのbg-colorを読み込みます。*/
}

/*bg1-primary
---------------------------------------------------------------------------*/
.bg1-primary-parts {
	background-color: var(--primary-color);		/*背景色。theme.cssのprimary-colorを読み込みます。*/
	color: var(--primary-inverse-color);	/*文字色。theme.cssのprimary-inverse-colorを読み込みます。*/
}


/*bg1-light
---------------------------------------------------------------------------*/
.bg1-light-parts {
	background-color: var(--light-color);		/*背景色。theme.cssのlight-colorを読み込みます。*/
	color: var(--light-inverse-color);	/*背景色。theme.cssのlight-inverse-colorを読み込みます。*/
}


/*bg1-accent
---------------------------------------------------------------------------*/
.bg1-accent-parts {
	background-color: var(--accent-color);		/*背景色。theme.cssのaccent-colorを読み込みます。*/
	color: var(--accent-inverse-color);	/*背景色。theme.cssのaccent-inverse-colorを読み込みます。*/
}


/*bg-parts（bg1-primary-parts、bg1-light-parts、bg1-accent-partsとセットで使います）
---------------------------------------------------------------------------*/
.bg-parts {
	padding-top: var(--content-space-l);		/*ボックス内の上に空ける余白。theme.cssのcontent-space-lを読み込みます。*/
	padding-bottom: var(--content-space-l);	/*ボックス内の下に空ける余白。theme.cssのcontent-space-lを読み込みます。*/
}

/*背景色が続く場合に隙間を空けない*/
.bg-parts + .bg-parts {
	margin-top: calc(-1 * var(--content-space-l)) !important;
}


/*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;
}


/*左右によせる専用
---------------------------------------------------------------------------*/
.bleed-left-parts {
	width: calc(100% + var(--content-space-l));
	margin-left: calc(-1 * var(--content-space-l));
}
.bleed-right-parts {
	width: calc(100% + var(--content-space-l));
	margin-right: calc(-1 * var(--content-space-l));
}


/*その他
---------------------------------------------------------------------------*/
.color-check, .color-check a {color: #ff0000 !important;}
.l {text-align: left !important;}
.c {text-align: center !important;}
.r {text-align: right !important;}
.ws {width: 100%;display: block;}
.wl {width: 100%;display: block;}
.padding-x {padding: 0 var(--content-space-l);}
.mt0 {margin-top: 0px !important;}
.mt1rem {margin-top: 1rem !important;}
.mt3rem {margin-top: 3rem !important;}
.mb0 {margin-bottom: 0px !important;}
.mb1rem {margin-bottom: 1rem !important;}
.mb3rem {margin-bottom: 3rem !important;}
.mb30 {margin-bottom: 30px !important;}
.look {display: inline-block;padding: 0px 10px;background: rgba(0,0,0,0.7);color: #fff; border-radius: 3px;margin: 5px 0; word-break: break-all;}
.small {font-size: 0.85em;}
.large {font-size: 1.6em; letter-spacing: 0.1em;}
.pc {display: none;}
.dn {display: none !important;}

/*大きな画面の場合*/
.large-screen .ws {width: 50%;}
.large-screen .sh {display: none;}
.large-screen .pc {display: block;}


/*メインビジュアル スライダー
---------------------------------------------------------------------------*/
.mainimg.js-main-slider {
	min-height: clamp(520px, 56vw, 760px);
	overflow: hidden;
	background: var(--bg-color);
}

.mainimg.js-main-slider .slide {
	position: absolute;
	inset: 0;
	opacity: 0;
	pointer-events: none;
	transition: opacity 1s ease;
}

.mainimg.js-main-slider .slide.active {
	opacity: 1;
	pointer-events: auto;
	z-index: 2;
}

.mainimg.js-main-slider .slide picture,
.mainimg.js-main-slider .slide img {
	width: 100%;
	height: 100%;
}

.mainimg.js-main-slider .slide img {
	object-fit: cover;
}

.mainimg.js-main-slider .slide::before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(90deg,
			rgba(var(--hero-gradient-start), 1) 0%,
			rgba(var(--hero-gradient-start), 0.98) 12%,
			rgba(var(--hero-gradient-start), 0.95) 22%,
			rgba(var(--hero-gradient-middle), 0.90) 32%,
			rgba(var(--hero-gradient-middle), 0.68) 40%,
			rgba(var(--hero-gradient-middle), 0.34) 48%,
			rgba(var(--hero-gradient-middle), 0.10) 54%,
			rgba(var(--hero-gradient-middle), 0.02) 58%,
			rgba(var(--hero-gradient-middle), 0) 62%),
		radial-gradient(circle at 18% 42%, rgba(var(--hero-gradient-middle), 0.38) 0%, rgba(var(--hero-gradient-middle), 0.16) 22%, rgba(var(--hero-gradient-middle), 0.04) 34%, rgba(var(--hero-gradient-middle), 0) 46%);
	z-index: 0;
}

.mainimg.js-main-slider .slide::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(0,0,0,0.24) 0%, rgba(0,0,0,0.12) 32%, rgba(0,0,0,0.04) 48%, rgba(0,0,0,0) 58%);
	z-index: 0;
}

.mainimg.js-main-slider .slide .text {
	z-index: 1;
	color: #fff;
	text-shadow: none;
}

.mainimg.js-main-slider .mainimg-controls {
	position: absolute;
	inset: 0;
	z-index: 5;
	pointer-events: none;
}

.mainimg.js-main-slider .mainimg-arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 46px;
	height: 46px;
	border: 1px solid rgba(255,255,255,0.55);
	border-radius: 50%;
	background: rgba(0,0,0,0.22);
	color: #fff;
	font-size: 2rem;
	line-height: 1;
	cursor: pointer;
	pointer-events: auto;
	transition: 0.3s;
}

.mainimg.js-main-slider .mainimg-arrow:hover {
	background: var(--primary-color);
}

.mainimg.js-main-slider .mainimg-arrow.prev {left: 1.5rem;}
.mainimg.js-main-slider .mainimg-arrow.next {right: 1.5rem;}

.mainimg.js-main-slider .mainimg-dots {
	position: absolute;
	left: 0;
	bottom: 24px;
	z-index: 6;
	width: 100%;
	display: flex;
	justify-content: center;
	gap: 10px;
}

.mainimg.js-main-slider .mainimg-dot {
	width: 10px;
	height: 10px;
	border: 1px solid rgba(255,255,255,0.85);
	border-radius: 50%;
	background: transparent;
	padding: 0;
	cursor: pointer;
}

.mainimg.js-main-slider .mainimg-dot.active {
	background: var(--accent-color);
	border-color: var(--accent-color);
}

@media (max-width: 800px) {
	.mainimg.js-main-slider {
		min-height: 520px;
	}
	.mainimg.js-main-slider .slide::before {
		background:
			linear-gradient(90deg,
				rgba(var(--hero-gradient-start), 0.98) 0%,
				rgba(var(--hero-gradient-start), 0.94) 12%,
				rgba(var(--hero-gradient-start), 0.88) 24%,
				rgba(var(--hero-gradient-middle), 0.76) 34%,
				rgba(var(--hero-gradient-middle), 0.56) 42%,
				rgba(var(--hero-gradient-middle), 0.34) 48%,
				rgba(var(--hero-gradient-middle), 0.18) 52%,
				rgba(var(--hero-gradient-middle), 0.08) 56%,
				rgba(var(--hero-gradient-middle), 0.02) 59%,
				rgba(var(--hero-gradient-middle), 0) 62%),
			radial-gradient(circle at 20% 42%, rgba(var(--hero-gradient-middle), 0.26) 0%, rgba(var(--hero-gradient-middle), 0.12) 24%, rgba(var(--hero-gradient-middle), 0.04) 38%, rgba(var(--hero-gradient-middle), 0) 52%);
	}
	.mainimg.js-main-slider .slide::after {
		background: linear-gradient(90deg, rgba(0,0,0,0.18) 0%, rgba(0,0,0,0.10) 26%, rgba(0,0,0,0.04) 42%, rgba(0,0,0,0.01) 52%, rgba(0,0,0,0) 60%);
	}
	.mainimg.js-main-slider .slide .text {
		width: auto;
		right: var(--content-space-l);
	}
	.mainimg.js-main-slider .mainimg-arrow {
		width: 38px;
		height: 38px;
		font-size: 1.6rem;
	}
	.mainimg.js-main-slider .mainimg-arrow.prev {left: 0.75rem;}
	.mainimg.js-main-slider .mainimg-arrow.next {right: 0.75rem;}
}


/*料金表ページ
---------------------------------------------------------------------------*/
.page-title {
	padding-top: calc(var(--content-space-l) + 70px);
	padding-bottom: var(--content-space-l);
	background: linear-gradient(135deg, var(--bg-color), var(--light-color));
	color: var(--bg-inverse-color);
	margin-top: 0;
}
.page-title-inner {
	max-width: 980px;
	margin-inline: auto;
}
.page-title .eyebrow {
	letter-spacing: 0.18em;
	font-size: 0.85rem;
	color: var(--accent-color);
	margin-bottom: 1rem;
}
.page-title p:last-child {
	max-width: 720px;
}
.price-lead {
	max-width: 820px;
	margin: 0 auto 2rem;
	text-align: center;
}
.price-cards {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 2rem;
	max-width: 980px;
	margin-inline: auto;
}
.price-card {
	background: var(--bg-inverse-color);
	color: var(--bg-color);
	padding: 2rem;
	border-radius: 18px;
	border: 1px solid color-mix(in srgb, var(--primary-color) 18%, transparent);
	box-shadow: 0 18px 40px rgba(0,0,0,0.12);
}
.price-card.recommend {
	border-color: var(--accent-color);
}
.price-card .label {
	display: inline-block;
	background: var(--accent-color);
	color: var(--accent-inverse-color);
	line-height: 1;
	padding: 0.45rem 0.8rem;
	border-radius: 8px;
	font-size: 0.8rem;
	font-weight: 600;
}
.price-card h3,
.guide-box h3 {
	margin-top: 1rem;
	margin-bottom: 0.5rem;
	font-size: 1.35rem;
}
.price-card .price {
	font-size: clamp(2.2rem, 5vw, 4rem);
	line-height: 1.1;
	font-weight: 600;
	letter-spacing: 0.04em;
	color: var(--primary-color);
	margin: 0.5rem 0;
}
.price-card .price span {
	font-size: 0.45em;
	margin-right: 0.15em;
}
.price-card .note,
.price-caption {
	color: color-mix(in srgb, var(--bg-color) 70%, white);
}
.price-card ul {
	margin: 1.5rem 0;
	padding-left: 1.2rem;
}
.price-table-wrap {
	overflow-x: auto;
	background: var(--bg-inverse-color);
	border-radius: 18px;
	padding: 1rem;
	box-shadow: 0 15px 35px rgba(0,0,0,0.12);
}
.price-table {
	width: 100%;
	min-width: 760px;
	background: #fff;
	color: var(--bg-color);
}
.price-table th,
.price-table td {
	border-bottom: 1px solid #e5e8ef;
	padding: 1rem;
	text-align: left;
	vertical-align: middle;
}
.price-table thead th {
	background: var(--primary-color);
	color: var(--primary-inverse-color);
	font-weight: 500;
}
.price-table tbody th {
	color: var(--primary-color);
	font-weight: 600;
}
.price-table td strong {
	display: block;
	font-size: 1.35rem;
	line-height: 1.3;
}
.price-table td span {
	font-size: 0.8rem;
}
.guide-list {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 1.5rem;
}
.guide-box {
	background: color-mix(in srgb, var(--bg-inverse-color) 94%, var(--primary-color));
	color: var(--bg-color);
	padding: 1.8rem;
	border-radius: 16px;
}
.guide-price {
	font-size: 1.25rem;
	font-weight: 600;
	color: var(--primary-color);
	margin-bottom: 0;
}
.price-flow {
	list-style: none;
	margin: 2rem 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 1rem;
}
.price-flow li {
	background: rgba(255,255,255,0.16);
	padding: 1.3rem 1rem;
	border-radius: 14px;
	text-align: center;
	font-weight: 500;
}
.price-flow span {
	display: block;
	font-size: 0.8rem;
	letter-spacing: 0.12em;
	color: var(--accent-inverse-color);
	margin-bottom: 0.4rem;
}
@media (max-width: 900px) {
	.price-cards,
	.guide-list,
	.price-flow {
		grid-template-columns: 1fr;
	}
	.page-title {
		padding-top: 110px;
	}
}

/* 料金ページ見出し・注記の視認性調整
---------------------------------------------------------------------------*/
.page-title h2 span {
	color: #fff;
}
.price-caption {
	color: #555;
}


/* ヘッダーロゴ表示サイズ調整
---------------------------------------------------------------------------*/
header .logo img {
	width: 420px;
	max-width: 42vw;
}

@media screen and (max-width: 900px) {
	header .logo img {
		width: 320px;
		max-width: 60vw;
	}
}

@media screen and (max-width: 600px) {
	header .logo img {
		width: 260px;
		max-width: 70vw;
	}
}

/* ヘッダーメニュー内の予約ボタン
---------------------------------------------------------------------------*/
header nav li.btn a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	min-width: 122px;
	min-height: 44px;
	padding: 0.4rem 1.15rem;
	border-radius: 0;
	line-height: 1.2;
	font-size: 0.82rem;
	letter-spacing: 0.04em;
}

header nav li.btn a i {
	font-size: 1.2rem;
	line-height: 1;
}

header nav li.btn a span {
	display: inline-block;
	white-space: nowrap;
}

#menubar li.btn a {
	border-radius: 0;
	padding: 0.5rem 1.2rem;
	line-height: 1.2;
}

.btn.btn-trial a {
	background: var(--primary-color);
	border-color: var(--primary-color);
	color: var(--primary-inverse-color);
}

.btn.btn-member a {
	background: var(--accent-color);
	border-color: var(--accent-color);
	color: var(--accent-inverse-color);
}

.btn.btn-trial a:hover,
.btn.btn-member a:hover {
	filter: brightness(1.08);
}

/* 見出しの小見出しカラー調整
---------------------------------------------------------------------------
濃紺背景の上で「当院について」「院内空間」などのspan文字が沈まないように、
通常セクションではアクセントカラーを使う。
*/
main h2::before {
	background: var(--accent-color);
}
main h2 span {
	color: var(--accent-color);
	font-weight: 600;
}
main .bg1-accent-parts h2::before {
	background: var(--accent-inverse-color);
}
main .bg1-accent-parts h2 span {
	color: var(--accent-inverse-color);
}

/* 文字サイズ調整
---------------------------------------------------------------------------
全体的に文字が小さく見えないように、読み物系テキストとメニューを少し大きくする。
*/
html {
	font-size: clamp(15px, 0.18vw + 14.3px, 17px);
}

body {
	line-height: 2.05;
}

header nav {
	font-size: 0.95rem;
}

header nav li.btn a,
#menubar li.btn a {
	font-size: 0.9rem;
	padding: 0.4rem 1.25rem;
	border-radius: 0;
}

.small-screen #menubar {
	font-size: 1.05rem;
}

main h2 {
	font-size: clamp(1.65rem, 1.2vw + 1.25rem, 2.35rem);
}

main h2 span {
	font-size: 0.82rem;
}

.mainimg .text h2 {
	font-size: clamp(1.75rem, 3.2vw, 3.2rem);
}

.mainimg .text p {
	font-size: 1rem;
}

.list1 .list p,
.list2 .inner > div,
.list3 .list p,
.flex1 .image .inner,
.ta-week{
	font-size: 0.95rem;
}



@media screen and (max-width: 700px) {
	html {
		font-size: 15px;
	}

	header nav li.btn a,
	#menubar li.btn a {
		font-size: 1rem;
	}

	main h2 {
		font-size: 1.75rem;
	}

	main h2 span {
		font-size: 0.9rem;
	}
}

/* セクション見出しのラベル文字サイズ調整
---------------------------------------------------------------------------
「当院について」「院内空間」など、h2内のspanラベルだけを大きくする。
*/
main h2 span {
	font-size: clamp(1.05rem, 0.35vw + 0.95rem, 1.25rem);
	font-weight: 700;
	line-height: 1.5;
}

@media screen and (max-width: 700px) {
	main h2 span {
		font-size: 1.05rem;
	}
}


/*スタジオ一覧スライダー（カード型）
---------------------------------------------------------------------------*/






















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

	




}


/* ヘッダーメニューのBlur強調
---------------------------------------------------------------------------*/
header nav {
	background: rgba(255, 255, 255, 0.72);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	border: 1px solid rgba(255, 255, 255, 0.65);
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12);
	border-radius: 8px;
	padding: 0.7rem 1rem;
}

header > nav > ul {
	gap: 0.45rem;
}

header > nav > ul > li > a {
	padding: 0.55rem 0.9rem;
	border-radius: 8px;
	color: var(--primary-color);
	line-height: 1.2;
}

header > nav > ul > li:not(.btn) > a:hover {
	background: rgba(31, 63, 115, 0.08);
	color: var(--primary-color);
}

header nav li.btn a {
	box-shadow: none;
}

/* スマホ開閉メニュー背景 */
.small-screen #menubar {
	background: rgba(31, 63, 115, 0.94);
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
}

@media screen and (max-width: 1100px) {
	header {
		gap: 1rem;
	}

	header nav {
		padding: 0.55rem 0.75rem;
	}

	header > nav > ul > li > a {
		padding: 0.5rem 0.75rem;
	}
}


/* スタジオ一覧の共通背景色
---------------------------------------------------------------------------*/
.studio-list-section {
	background: #243a5f;
	color: var(--bg-inverse-color);
	border-radius: 24px;
}

.studio-list-section h2,
.studio-list-section p.c {
	color: var(--bg-inverse-color);
}

.studio-list-section h2::before {
	background: var(--accent-color);
}

.studio-list-section h2 span,
.studio-list-section .small {
	color: var(--bg-inverse-color);
}


/* スタジオ一覧カードのSTUDIOラベル削除
---------------------------------------------------------------------------*/




/* 定額制でレッスン受け放題ブロック
---------------------------------------------------------------------------*/
.lesson-subscription-section {
	background: linear-gradient(90deg, #fbfaf7 0%, #fff 45%, #fbfaf7 100%);
	padding-top: 4.5rem;
	padding-bottom: 4.5rem;
	margin-left: calc(var(--content-space-l) * -1);
	margin-right: calc(var(--content-space-l) * -1);
	padding-left: var(--content-space-l);
	padding-right: var(--content-space-l);
}

.lesson-subscription-section h2 {
	margin-bottom: 3rem;
}

.lesson-subscription-list {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	max-width: 1320px;
	margin: 0 auto;
}

.lesson-subscription-item {
	text-align: center;
	padding: 0 1.2rem;
	position: relative;
}

.lesson-subscription-item + .lesson-subscription-item {
	border-left: 1px solid rgba(5, 31, 75, 0.14);
}

.lesson-subscription-icon {
	font-size: clamp(2.4rem, 3vw, 3.4rem);
	line-height: 1;
	color: var(--primary-color);
	margin-bottom: 1.15rem;
}


.lesson-subscription-icon img.custom-icon {
	display: inline-block;
	width: clamp(3rem, 3.4vw, 3.8rem);
	height: clamp(3rem, 3.4vw, 3.8rem);
	object-fit: contain;
	vertical-align: middle;
}

.lesson-subscription-item h4 {
	font-size: clamp(1rem, 1vw, 1.15rem);
	font-weight: 700;
	color: var(--primary-color);
	margin-bottom: 1rem;
	letter-spacing: 0.04em;
}

.lesson-subscription-item p {
	font-size: 0.9rem;
	line-height: 1.9;
	color: var(--primary-color);
	margin: 0 auto;
	max-width: 18.5em;
}

.lesson-subscription-btn {
	margin-top: 2.3rem;
}

.lesson-subscription-btn a {
	min-width: 300px;
	justify-content: center;
	padding-top: 0.8rem;
	padding-bottom: 0.8rem;
	background: #fff;
}

@media (max-width: 900px) {
	.lesson-subscription-list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		row-gap: 2.5rem;
	}

	.lesson-subscription-item:nth-child(3) {
		border-left: none;
	}
}

@media (max-width: 600px) {
	.lesson-subscription-section {
		padding-top: 3.5rem;
		padding-bottom: 3.5rem;
	}

	.lesson-subscription-list {
		grid-template-columns: 1fr;
		row-gap: 2rem;
	}

	.lesson-subscription-item {
		padding: 0;
	}

	.lesson-subscription-item + .lesson-subscription-item {
		border-left: none;
		border-top: 1px solid rgba(5, 31, 75, 0.14);
		padding-top: 2rem;
	}

	.lesson-subscription-btn a {
		min-width: min(300px, 100%);
		width: auto;
		max-width: 100%;
	}
}

/* 定額制ブロック 見出し表示修正
---------------------------------------------------------------------------*/
.lesson-subscription-section,
.lesson-subscription-section h2,
.lesson-subscription-section .lesson-subscription-item h4,
.lesson-subscription-section .lesson-subscription-item p,
.lesson-subscription-section .lesson-subscription-icon {
	color: #0f1f3a !important;
}

.lesson-subscription-section h2 {
	display: flex !important;
	visibility: visible !important;
	opacity: 1 !important;
	font-size: clamp(1.45rem, 1.8vw, 2rem) !important;
	font-weight: 700 !important;
	line-height: 1.6 !important;
	letter-spacing: 0.08em !important;
	margin: 0 auto 3rem !important;
	text-align: center !important;
	width: fit-content !important;
}

.lesson-subscription-section h2::before {
	background: #0f1f3a !important;
	display: none !important;
}


/* 定額制ブロック 横幅調整
---------------------------------------------------------------------------*/
.lesson-subscription-section .lesson-subscription-list {
	max-width: 1320px !important;
	column-gap: 0 !important;
}
.lesson-subscription-section .lesson-subscription-item {
	padding-left: 1.2rem !important;
	padding-right: 1.2rem !important;
}
.lesson-subscription-section .lesson-subscription-item p {
	max-width: 18.5em !important;
	margin-left: auto !important;
	margin-right: auto !important;
}
@media (min-width: 901px) {
	.lesson-subscription-section .lesson-subscription-item p {
		white-space: nowrap;
	}
}

/* 定額制ブロック 説明文の重なり修正
---------------------------------------------------------------------------*/
.lesson-subscription-section .lesson-subscription-list {
	max-width: 1180px !important;
	gap: 0 !important;
}
.lesson-subscription-section .lesson-subscription-item {
	min-width: 0 !important;
	padding-left: 1.4rem !important;
	padding-right: 1.4rem !important;
}
.lesson-subscription-section .lesson-subscription-item p {
	white-space: normal !important;
	max-width: 16.5em !important;
	line-height: 1.85 !important;
	font-size: clamp(0.78rem, 0.9vw, 0.9rem) !important;
	letter-spacing: 0.02em !important;
	overflow-wrap: normal !important;
	word-break: normal !important;
	line-break: strict !important;
}
@media (max-width: 1100px) and (min-width: 901px) {
	.lesson-subscription-section .lesson-subscription-item {
		padding-left: 1rem !important;
		padding-right: 1rem !important;
	}
	.lesson-subscription-section .lesson-subscription-item p {
		font-size: 0.78rem !important;
		max-width: 15em !important;
	}
}

/* 定額制ブロック 各項目の幅を少し拡張
---------------------------------------------------------------------------*/
.lesson-subscription-section .lesson-subscription-list {
	max-width: 1260px !important;
}
.lesson-subscription-section .lesson-subscription-item {
	padding-left: 0.9rem !important;
	padding-right: 0.9rem !important;
}
.lesson-subscription-section .lesson-subscription-item p {
	max-width: 17.2em !important;
	font-size: clamp(0.77rem, 0.86vw, 0.88rem) !important;
	line-height: 1.8 !important;
}
@media (max-width: 1100px) and (min-width: 901px) {
	.lesson-subscription-section .lesson-subscription-list {
		max-width: 1180px !important;
	}
	.lesson-subscription-section .lesson-subscription-item {
		padding-left: 0.75rem !important;
		padding-right: 0.75rem !important;
	}
	.lesson-subscription-section .lesson-subscription-item p {
		max-width: 15.8em !important;
		font-size: 0.77rem !important;
	}
}


/* 案内リンクセクション
---------------------------------------------------------------------------*/
.top-links-section {
	padding: 4.5rem var(--content-space-l);
	background: #fff;
}

.top-links-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: clamp(1.5rem, 4vw, 4rem);
	max-width: 1080px;
	margin: 0 auto;
}

.top-link-card {
	text-align: center;
}

.top-link-card h3 {
	margin: 0 0 1rem;
	font-size: clamp(1.1rem, 1.5vw, 1.45rem);
	letter-spacing: 0.1em;
	color: #0f1f3a !important;
}

.top-link-image {
	margin: 0 0 1.4rem;
}

.top-link-image img {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 8.4;
	object-fit: cover;
	border-radius: 4px;
}

.top-link-text {
	margin: 0 0 1.5rem;
	font-size: 0.98rem;
	font-weight: 700;
	line-height: 2;
	letter-spacing: 0.08em;
	color: #0f1f3a;
}

.top-link-btn {
	margin: 0;
}

.top-link-btn a {
	min-width: 300px;
	justify-content: center;
	padding-top: 0.8rem;
	padding-bottom: 0.8rem;
	background: #fff;
	color: var(--primary-color);
	border: 1px solid var(--primary-color);
	font-weight: 500;
	letter-spacing: 0.08em;
}

.top-link-btn a:hover {
	background: #fff;
}

@media (max-width: 800px) {
	.top-links-section {
		padding: 3.5rem 1.5rem;
	}

	.top-links-grid {
		grid-template-columns: 1fr;
	}
}


@media (max-width: 600px) {
	.top-link-btn a {
		min-width: 0;
		width: 100%;
	}
}

/* スタジオ一覧 ロゴ追加
---------------------------------------------------------------------------*/
.studio-network-logo {
	margin: 0.9rem auto 1.6rem;
}

.studio-network-logo img {
	display: inline-block;
	max-width: 270px;
	width: min(100%, 270px);
	height: auto;
}









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

	

	.studio-network-logo {
		margin-bottom: 1.3rem;
	}
}


/* スタジオ一覧ロゴ差し替えと学芸大ゴルフスタジオ追加 */




/* 学芸大ゴルフスタジオの小さい横長ロゴは大きく見せる */




/* スタジオ一覧：各スタジオの背景色 */















/* スタジオ一覧：ローマ字を上、スタジオ名を下に表示 */


/* スタジオ一覧：説明文の行数でスタジオ名の位置がズレないよう調整 */




/* スタジオ一覧：ロゴ幅・写真・スタジオ名・説明文の位置を統一 */


















/* スタジオ一覧：ロゴ上の余白を詰める */


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


/* スタジオ一覧：ループ後の複製カードにも背景色を反映 */








/* スタジオ一覧：ロゴ・写真・スタジオ名・説明文の間隔を全体的に詰める */












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

	

	

	
}


/* ヘッダーメニューにロゴも含める調整
---------------------------------------------------------------------------*/
.site-header {
	background: rgba(255, 255, 255, 0.78);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	border-bottom: 1px solid rgba(255, 255, 255, 0.65);
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12);
}

.site-header nav {
	background: transparent;
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
	border: none;
	box-shadow: none;
	border-radius: 0;
	padding: 0;
}

.site-header .logo img {
	filter: drop-shadow(0 2px 6px rgba(255, 255, 255, 0.35));
}

#menubar .menubar-logo {
	margin: 0 0 1.5rem;
	text-align: center;
}

#menubar .menubar-logo img {
	width: 280px;
	max-width: 72vw;
	height: auto;
}

@media screen and (max-width: 700px) {
	.site-header {
		min-height: 70px;
		padding: 8px var(--content-space-s);
	}
}


/* ヘッダー紺系・ぼかし控えめ調整
---------------------------------------------------------------------------*/
.site-header {
	background: rgba(var(--studio-header-bg-rgb), 0.96);
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
	border-bottom: 1px solid rgba(255, 255, 255, 0.12);
	box-shadow: 0 8px 22px rgba(0, 0, 0, 0.18);
}

.site-header > nav > ul > li:not(.btn) > a,
.site-header li.has-child > a {
	color: rgba(255, 255, 255, 0.94);
}

.site-header > nav > ul > li:not(.btn) > a:hover,
.site-header li.has-child > a:hover {
	background: rgba(255, 255, 255, 0.12);
	color: #fff;
}

.site-header .logo img {
	filter: none;
}

.small-screen #menubar {
	background: rgba(var(--studio-header-bg-rgb), 0.98);
}

@media screen and (max-width: 700px) {
	.site-header {
		background: rgba(var(--studio-header-bg-rgb), 0.98);
		backdrop-filter: none;
		-webkit-backdrop-filter: none;
	}
}

/* 指定セクションの背景を薄めに調整
---------------------------------------------------------------------------*/
.section-soft-navy {
	background: #eef3f8;
	color: #14213d;
}

.section-soft-navy h2,
.section-soft-navy h3,
.section-soft-navy h4,
.section-soft-navy p,
.section-soft-navy dt,
.section-soft-navy dd {
	color: #14213d;
}

.section-soft-navy .small {
	color: rgba(20, 33, 61, 0.72);
}

#about.section-soft-navy {
	padding-top: 5rem;
	padding-bottom: 5rem;
}

#about.section-soft-navy .list2 {
	background: transparent;
}

#about.section-soft-navy .tate {
	color: #1f3f73;
}

.facility-section {
	padding-top: 5rem;
	padding-bottom: 5rem;
}

.faq-section.bg1-light-parts {
	background: #eef3f8;
	color: #14213d;
}

.faq-section .openclose {
	background: rgba(255, 255, 255, 0.72);
	border-color: rgba(31, 63, 115, 0.16);
}

.faq-section dd {
	background: rgba(255, 255, 255, 0.52);
	border-color: rgba(31, 63, 115, 0.12);
}


/* セクション間の紺帯をなくす調整
---------------------------------------------------------------------------*/
main > section {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}


/* 余白・高さの微調整
---------------------------------------------------------------------------*/
.mainimg.js-main-slider {
	min-height: clamp(600px, 64vw, 860px);
}

@media (max-width: 800px) {
	.mainimg.js-main-slider {
		min-height: 580px;
	}
}

.studio-list-section {
	padding-bottom: calc(var(--content-space-l) + 1.25rem);
}



.studio-list-section .slide-indicators {
	bottom: 10px;
}

.faq-section {
	padding-bottom: calc(var(--content-space-l) + 1.5rem);
}


/* トップスライダー全画面・セクション余白統一
---------------------------------------------------------------------------*/
.mainimg.js-main-slider {
	height: 100vh;
	height: 100svh;
	min-height: 100vh;
	min-height: 100svh;
}

@media (max-width: 800px) {
	.mainimg.js-main-slider {
		height: 100svh;
		min-height: 100svh;
	}
}

.studio-list-section,
.faq-section {
	padding-top: calc(var(--content-space-l) + 0.75rem) !important;
	padding-bottom: calc(var(--content-space-l) + 0.75rem) !important;
}


/* トップスライダー：PCは全画面、スマホは少し低め
---------------------------------------------------------------------------*/
@media (min-width: 801px) {
	.mainimg.js-main-slider {
		height: 100vh !important;
		height: 100svh !important;
		min-height: 100vh !important;
		min-height: 100svh !important;
	}
}

@media (max-width: 800px) {
	.mainimg.js-main-slider {
		height: 82svh !important;
		min-height: 82svh !important;
	}
}


/* スタジオ一覧とFAQの上下余白を統一
---------------------------------------------------------------------------*/
:root {
	--equal-section-space: calc(var(--content-space-l) + 1rem);
}

.studio-list-section,
.faq-section {
	padding-top: var(--equal-section-space) !important;
	padding-bottom: var(--equal-section-space) !important;
}

/* 重要なお知らせ・新着情報
---------------------------------------------------------------------------*/
.home-news-section {
	background: #fff;
	color: #14213d;
	padding-top: clamp(3rem, 6vw, 6rem);
	padding-bottom: clamp(3rem, 6vw, 6rem);
}

.home-news-inner {
	width: min(1180px, 100%);
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: clamp(2.5rem, 5vw, 5rem);
}

.news-heading-en {
	margin: 0 0 0.15rem;
	color: #1f3f73;
	font-family: var(--font-en, sans-serif);
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.18em;
	line-height: 1.4;
}

.news-heading h2 {
	margin: 0;
	color: #14213d;
	font-size: clamp(1.35rem, 2.2vw, 1.85rem);
	line-height: 1.45;
}

.important-news {
	position: relative;
	overflow: hidden;
	background: #14213d;
	color: #fff;
	padding: clamp(1.6rem, 3vw, 2.5rem);
	border-radius: 4px;
	box-shadow: 0 16px 36px rgba(14, 33, 68, 0.13);
}

.important-news::after {
	content: "";
	position: absolute;
	right: -45px;
	bottom: -70px;
	width: 180px;
	height: 180px;
	border: 1px solid rgba(255, 255, 255, 0.14);
	border-radius: 50%;
}

.important-news .news-heading-en,
.important-news .news-heading h2 {
	color: #fff;
}

.important-news .news-heading-en {
	opacity: 0.72;
}

.important-news-link {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 0.5rem 1rem;
	align-items: center;
	margin-top: 2rem;
	padding-top: 1.4rem;
	border-top: 1px solid rgba(255, 255, 255, 0.25);
	color: #fff;
	text-decoration: none;
}

.important-news-link time {
	grid-column: 1 / -1;
	font-size: 0.78rem;
	letter-spacing: 0.08em;
	opacity: 0.7;
}

.important-news-link span {
	font-weight: 700;
	line-height: 1.7;
}

.news-heading-row {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 1rem;
	padding-bottom: 1rem;
	border-bottom: 2px solid #14213d;
}

.news-list-link {
	color: #1f3f73;
	font-size: 0.84rem;
	font-weight: 700;
	text-decoration: none;
	white-space: nowrap;
}

.news-list-link i {
	margin-left: 0.35rem;
}

.latest-news-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.latest-news-list li {
	border-bottom: 1px solid #d9e0e8;
}

.latest-news-list a {
	display: grid;
	grid-template-columns: 7.2rem 5.5rem minmax(0, 1fr);
	gap: 1rem;
	align-items: center;
	min-height: 74px;
	padding: 0.8rem 0;
	color: #14213d;
	text-decoration: none;
}

.latest-news-list a:hover .news-title {
	color: #1f3f73;
	text-decoration: underline;
}

.latest-news-list time {
	font-size: 0.82rem;
	letter-spacing: 0.04em;
	color: #5e6b7e;
}

.news-category {
	display: inline-block;
	padding: 0.22rem 0.65rem;
	border: 1px solid #1f3f73;
	color: #1f3f73;
	font-size: 0.72rem;
	font-weight: 700;
	line-height: 1.5;
	text-align: center;
}

.news-title {
	font-weight: 600;
	line-height: 1.65;
}

@media screen and (max-width: 800px) {
	.latest-news-list a {
		grid-template-columns: 6.8rem 5rem;
		gap: 0.45rem 0.7rem;
		padding: 1rem 0;
	}

	.news-title {
		grid-column: 1 / -1;
	}
}

@media screen and (max-width: 480px) {
	.news-heading-row {
		align-items: center;
	}

	.latest-news-list a {
		grid-template-columns: 1fr auto;
	}

	.latest-news-list time {
		font-size: 0.78rem;
	}
}


/* =========================================================
   TGS / TOKYO GOLF STUDIO - BLACK THEME
========================================================= */
.tgs-site {
  --tgs-black: #080808;
  --tgs-black-soft: #141414;
  --tgs-charcoal: #242424;
  --tgs-gray: #767676;
  --tgs-line: #d7d7d7;
  --tgs-offwhite: #f5f5f3;
  --tgs-gold: #b79a61;
  color: #161616;
  background: #fff;
}
.tgs-site .site-header {background:var(--studio-header-bg); color:#fff; border-bottom:1px solid rgba(255,255,255,.16);}
.tgs-site .site-header nav a {color:#fff;}
.tgs-site .site-header nav li:not(.btn) a::after {background:#b79a61;}
.tgs-site .tgs-logo a {display:flex; flex-direction:column; color:#fff; text-decoration:none; line-height:1.05;}
.tgs-site .tgs-logo-main {font-family:serif; font-size:clamp(1rem,1.45vw,1.35rem); letter-spacing:.16em; font-weight:600; white-space:nowrap;}
.tgs-site .tgs-logo-sub {margin-top:.35rem; font-size:.63rem; letter-spacing:.24em; opacity:.72; white-space:nowrap;}
.tgs-site .site-header .btn-trial a {background:#fff; color:#080808;}
.tgs-site .site-header .btn-member a {background:#2a2a2a; color:#fff; border-color:#555;}
.tgs-site .mainimg::after {background:linear-gradient(90deg,rgba(0,0,0,.86) 0%,rgba(0,0,0,.46) 48%,rgba(0,0,0,.16) 100%);}
.tgs-site .mainimg .text h2,.tgs-site .mainimg .text p {color:#fff; text-shadow:0 2px 14px rgba(0,0,0,.55);}
.tgs-site .mainimg .btn a {background:#fff; color:#080808; border-color:#fff;}
.tgs-site .mainimg .btn-member a {background:rgba(0,0,0,.65); color:#fff; border-color:rgba(255,255,255,.7);}
.tgs-site .mainimg-dots button.active {background:#b79a61;}
.tgs-site .home-news-section {background:#f5f5f3; color:#161616;}
.tgs-site .news-heading-en,.tgs-site .news-list-link {color:#777;}
.tgs-site .news-heading h2,.tgs-site .latest-news-list a {color:#111;}
.tgs-site .important-news {background:#080808; box-shadow:0 18px 42px rgba(0,0,0,.18);}
.tgs-site .news-heading-row {border-color:#111;}
.tgs-site .news-category {border-color:#111; color:#111;}
.tgs-site .latest-news-list a:hover .news-title {color:#777;}
.tgs-site .section-soft-navy,.tgs-site .bg1-light-parts {background:#f2f2f0 !important;}
.tgs-site h2,.tgs-site h3,.tgs-site h4 {color:#111;}
.tgs-site .btn a,.tgs-site .btn.inverse a {background:#080808; border-color:#080808; color:#fff;}
.tgs-site .btn a:hover,.tgs-site .btn.inverse a:hover {background:#2b2b2b; border-color:#2b2b2b;}
.tgs-site .lesson-subscription-section {background:#0b0b0b; color:#fff;}
.tgs-site .lesson-subscription-section h2,.tgs-site .lesson-subscription-section h4 {color:#fff;}
.tgs-site .lesson-subscription-item {background:#171717; border-color:#303030;}
.tgs-site .lesson-subscription-icon {color:#b79a61;}
.tgs-site .lesson-driver-svg-icon {filter:grayscale(1) brightness(3);}
.tgs-site .facility-section .image .inner>div,.tgs-site .list2 .inner>div {border-color:#222; background:#fff;}
.tgs-site .studio-section {background:#111; color:#fff;}
.tgs-site .studio-section h2,.tgs-site .studio-section h4 {color:#fff;}
.tgs-site .studio-card {background:#1b1b1b; border-color:#333;}
.tgs-site .studio-card p {color:#ddd;}
.tgs-site footer {background:var(--studio-footer-bg);}
.tgs-site footer a,.tgs-site footer p,.tgs-site footer small,.tgs-site footer li {color:#ddd;}
@media screen and (max-width:800px){
 .tgs-site .tgs-logo-main{font-size:.86rem;letter-spacing:.1em}
 .tgs-site .tgs-logo-sub{font-size:.52rem;letter-spacing:.15em}
}


/* Uploaded logo replacements for TGS */
.tgs-site .tgs-logo a {display:block;}
.tgs-site .tgs-logo a img {display:block; width:270px; max-width:40vw; height:auto;}
@media screen and (max-width: 900px) {
  .tgs-site .tgs-logo a img {width:220px; max-width:56vw;}
}
@media screen and (max-width: 600px) {
  .tgs-site .tgs-logo a img {width:180px; max-width:68vw;}
}
footer .logo img {display:block; width:270px; max-width:100%; height:auto;}


/* TGS black theme: white section headings and black studio list */
.tgs-site .important-news .news-heading h2,
.tgs-site .lesson-subscription-section > h2,
.tgs-site .reservation-cta-inner h2,
.tgs-site .studio-list-section > h2,
.tgs-site .studio-list-section > p.c {
  color: #fff !important;
}

.tgs-site .studio-list-section {
  background: linear-gradient(180deg, #111 0%, #080808 100%) !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.12);
  border-bottom-color: rgba(183,154,97,.75);
  box-shadow: 0 18px 42px rgba(0,0,0,.28);
}







.tgs-site .studio-list-section .studio-link a {
  background: #080808;
  border: 1px solid #b79a61;
  color: #fff;
}

.tgs-site .studio-list-section .studio-link a:hover {
  background: #b79a61;
  color: #080808;
  opacity: 1;
}

/* 定額制でレッスン受け放題：白背景に変更 */
.tgs-site .lesson-subscription-section {
  background: #fff !important;
  color: #111 !important;
  border-top: 1px solid #e2e2e2;
  border-bottom: 1px solid #e2e2e2;
}

.tgs-site .lesson-subscription-section > h2,
.tgs-site .lesson-subscription-section h4,
.tgs-site .lesson-subscription-section p {
  color: #111 !important;
}

.tgs-site .lesson-subscription-item {
  background: transparent !important;
  border-color: #dedede !important;
}

.tgs-site .lesson-subscription-icon {
  color: #111 !important;
}

.tgs-site .lesson-driver-svg-icon {
  filter: none !important;
}


/* Update: equipment section black, feature chips plain */
.tgs-site #menu.bg1-light-parts {
  background: linear-gradient(180deg, #111 0%, #080808 100%) !important;
  color: #fff !important;
}

.tgs-site #menu h2,
.tgs-site #menu h4,
.tgs-site #menu p,
.tgs-site #menu .small {
  color: #fff !important;
}

.tgs-site #menu h2::before {
  background: #b79a61 !important;
}

.tgs-site #menu .list1 .list {
  background: #171717;
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 12px 28px rgba(0,0,0,.28);
}

.tgs-site #menu .list1 .list .text {
  background: transparent;
}

.tgs-site #menu .facility-detail-btn a {
  background: #080808;
  border: 1px solid #b79a61;
  color: #fff;
}

.tgs-site #menu .facility-detail-btn a:hover {
  background: #b79a61;
  color: #080808;
  opacity: 1;
}

.tgs-site .facility-section .image .inner > div {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  color: inherit;
  padding-left: 0;
  padding-right: 0;
}

.tgs-site .facility-section .image .inner > div i,
.tgs-site .facility-section .image .inner > div img {
  color: inherit;
}


/* Contact CTA heading visibility fix */
.tgs-site #contact .text h2,
.tgs-site #contact .text p {
  color: #fff !important;
  text-shadow: 0 2px 10px rgba(0,0,0,.45);
}


/* Fix: remove rounded corners from studio list section */
.tgs-site .studio-list-section {
  border-radius: 0 !important;
}


/* Update: reservation CTA first panel and point chips to black theme */
.tgs-site .reservation-cta-block {
  background: #080808 !important;
}

.tgs-site .reservation-cta-trial::before {
  background: linear-gradient(90deg, rgba(8, 8, 8, 0.96) 0%, rgba(8, 8, 8, 0.90) 56%, rgba(8, 8, 8, 0.56) 100%) !important;
}

.tgs-site .reservation-cta-points {
  background: #080808 !important;
  color: #fff !important;
  border-top: 1px solid rgba(255,255,255,.08);
}

.tgs-site .reservation-cta-points li {
  background: #121212;
  padding: 0.7rem 1.15rem;
  border: 1px solid rgba(255,255,255,.10);
}

.tgs-site .reservation-cta-points i {
  color: #b79a61;
}

@media (max-width: 800px) {
  .tgs-site .reservation-cta-points li {
    width: 100%;
    justify-content: center;
  }
}


/* Update: reservation CTA points without boxes */
.tgs-site .reservation-cta-points li {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
}


/* Final tweak: match GGS button roles on hero and contact */
.tgs-site .mainimg .text h2,
.tgs-site .mainimg .text p {
  text-shadow: none !important;
}

.tgs-site .mainimg .btn a {
  background: #080808 !important;
  border-color: #080808 !important;
  color: #fff !important;
}

.tgs-site .mainimg .btn.btn-member a {
  background: #b79a61 !important;
  border-color: #b79a61 !important;
  color: #080808 !important;
}

.tgs-site #contact .text2 .btn a {
  background: #080808 !important;
  border-color: #080808 !important;
  color: #fff !important;
}

.tgs-site #contact .text2 .btn.btn-member a {
  background: #b79a61 !important;
  border-color: #b79a61 !important;
  color: #080808 !important;
}

.tgs-site .mainimg .btn a:hover,
.tgs-site #contact .text2 .btn a:hover {
  filter: brightness(1.08);
}


/* Update: trial button to gray for better visibility */
.tgs-site .mainimg .btn a,
.tgs-site #contact .text2 .btn a {
  background: #4a4a4a !important;
  border-color: #4a4a4a !important;
  color: #fff !important;
}

.tgs-site .mainimg .btn a:hover,
.tgs-site #contact .text2 .btn a:hover {
  background: #5a5a5a !important;
  border-color: #5a5a5a !important;
  color: #fff !important;
}


/* Update: header buttons match gray/gold, contact box background black */
.tgs-site .site-header .btn-trial a {
  background: #4a4a4a !important;
  border-color: #4a4a4a !important;
  color: #fff !important;
}

.tgs-site .site-header .btn-member a {
  background: #b79a61 !important;
  border-color: #b79a61 !important;
  color: #080808 !important;
}

.tgs-site .site-header .btn-trial a:hover {
  background: #5a5a5a !important;
  border-color: #5a5a5a !important;
  color: #fff !important;
}

.tgs-site .site-header .btn-member a:hover {
  background: #c7aa71 !important;
  border-color: #c7aa71 !important;
  color: #080808 !important;
}

.tgs-site #contact .text2 {
  background: #080808 !important;
  color: #fff !important;
}

.tgs-site #contact .text2 .small,
.tgs-site #contact .text2 .large a {
  color: #fff !important;
}


/* Update: vertical principle message to black text */
.tgs-site #about.section-soft-navy .tate {
  color: #111 !important;
}


/* Studio list: fixed card grid */
.tgs-site .studio-cards-grid {
  width: min(1180px, 100%);
  margin: 2.5rem auto 0;
  padding: 0;
}

.tgs-site .studio-cards-grid > .img {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.4rem;
  transform: none !important;
  transition: none !important;
}

.tgs-site .studio-cards-grid > .img > div {
  min-width: 0 !important;
  max-width: none !important;
  width: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 1.35rem !important;
  display: flex;
  flex-direction: column;
  background: #171717 !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 0 !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.28);
}

.tgs-site .studio-cards-grid .studio-logo {
  height: 82px !important;
  min-height: 82px !important;
  margin: 0 0 1rem !important;
  padding: .7rem !important;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #064f18 !important;
  border-radius: 0 !important;
}

.tgs-site .studio-cards-grid .studio-logo img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain;
}

.tgs-site .studio-cards-grid .studio-photo {
  margin: 0 0 1rem !important;
}

.tgs-site .studio-cards-grid .studio-photo img {
  width: 100%;
  height: 165px;
  object-fit: cover;
  border-radius: 0 !important;
}

.tgs-site .studio-cards-grid h4 {
  min-height: 0 !important;
  margin: 0 0 .65rem !important;
  color: #fff !important;
  font-size: 1.12rem;
  line-height: 1.5;
}

.tgs-site .studio-cards-grid h4 span {
  display: block;
  margin: 0 0 .25rem !important;
  color: #c9b27d !important;
  font-size: .72rem;
  letter-spacing: .08em;
}

.tgs-site .studio-cards-grid > .img > div > p:not(.studio-logo):not(.studio-photo):not(.studio-link) {
  min-height: 0 !important;
  margin: 0 !important;
  color: #ddd !important;
  font-size: .9rem;
  line-height: 1.75;
}

.tgs-site .studio-cards-grid .studio-link {
  margin-top: auto !important;
  padding-top: 1.1rem !important;
}

.tgs-site .studio-cards-grid .studio-link a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  background: #080808;
  border: 1px solid #b79a61;
  border-radius: 0;
  color: #fff;
  font-weight: 700;
}

.tgs-site .studio-cards-grid .studio-link a:hover {
  background: #b79a61;
  color: #080808;
}

@media (max-width: 900px) {
  .tgs-site .studio-cards-grid > .img {grid-template-columns: repeat(2, minmax(0, 1fr));}
}

@media (max-width: 600px) {
  .tgs-site .studio-cards-grid > .img {grid-template-columns: 1fr;}
  .tgs-site .studio-cards-grid .studio-photo img {height: 190px;}
}


/* Update: unify navy text to black */
.lesson-subscription-section,
.lesson-subscription-section h2,
.lesson-subscription-section .lesson-subscription-item h4,
.lesson-subscription-section .lesson-subscription-item p,
.lesson-subscription-section .lesson-subscription-icon,
.top-link-card h3,
.top-link-text,
.section-soft-navy,
.section-soft-navy h2,
.section-soft-navy h3,
.section-soft-navy h4,
.section-soft-navy p,
.section-soft-navy dt,
.section-soft-navy dd,
.faq-section.bg1-light-parts,
.home-news-section,
.news-heading-en,
.news-heading h2,
.news-list-link,
.latest-news-list a,
.news-category,
.news-title {
  color: #111 !important;
}

.lesson-subscription-section h2::before,
.news-heading-row {
  border-color: #111 !important;
}

.lesson-subscription-section h2::before {
  background: #111 !important;
}

.section-soft-navy .small,
.latest-news-list time {
  color: rgba(0,0,0,.72) !important;
}

#about.section-soft-navy .tate,
.top-link-btn a,
.latest-news-list a:hover .news-title {
  color: #111 !important;
}

.news-category {
  border-color: #111 !important;
}


/* Update: keep staff/access detail buttons white; notice is not a link */
.tgs-site .top-link-btn a,
.tgs-site .top-link-btn a:hover {
  background: #fff !important;
  border-color: #111 !important;
  color: #111 !important;
}

.tgs-site .important-news-link {
  cursor: default;
  grid-template-columns: 1fr;
}


/* Fix: staff/access detail buttons back to black bg with white text */
.tgs-site .top-link-btn a,
.tgs-site .top-link-btn a:hover {
  background: #080808 !important;
  border-color: #080808 !important;
  color: #fff !important;
}


/* Update: unify CTA hover with studio cards */
.tgs-site .lesson-subscription-btn a,
.tgs-site .top-link-btn a {
  background: #080808 !important;
  border: 1px solid #b79a61 !important;
  color: #fff !important;
}

.tgs-site .lesson-subscription-btn a:hover,
.tgs-site .top-link-btn a:hover {
  background: #b79a61 !important;
  border-color: #b79a61 !important;
  color: #080808 !important;
  opacity: 1;
}


/* Remove underline from studio card CTA */
.tgs-site .studio-list-section .studio-link a,
.tgs-site .studio-list-section .studio-link a:hover,
.tgs-site .studio-cards-grid .studio-link a,
.tgs-site .studio-cards-grid .studio-link a:hover {
  text-decoration: none !important;
}


/* Update: trial button hover to same gold style */
.tgs-site .mainimg .btn a:hover,
.tgs-site #contact .text2 .btn a:hover,
.tgs-site .site-header .btn-trial a:hover {
  background: #b79a61 !important;
  border-color: #b79a61 !important;
  color: #080808 !important;
  filter: none !important;
  opacity: 1 !important;
}


/* Update: member button hover back to gray */
.tgs-site .mainimg .btn.btn-member a:hover,
.tgs-site #contact .text2 .btn.btn-member a:hover,
.tgs-site .site-header .btn-member a:hover {
  background: #5a5a5a !important;
  border-color: #5a5a5a !important;
  color: #fff !important;
  filter: none !important;
  opacity: 1 !important;
}

/* Studio list related banners */
.tgs-site .related-banners-grid {
  margin-top: 2rem;
  display: grid;
  grid-template-columns: repeat(4, 240px);
  gap: 0;
  justify-content: center;
  align-items: start;
}

.tgs-site .related-banner {
  display: block;
  text-decoration: none;
  transition: transform .25s ease, opacity .25s ease;
}

.tgs-site .related-banner img {
  display: block;
  width: 240px;
  max-width: 100%;
  height: auto;
  margin: 0;
}

.tgs-site .related-banner:hover {
  transform: translateY(-2px);
  opacity: .92;
}

@media (max-width: 900px) {
  .tgs-site .related-banners-grid {
    grid-template-columns: repeat(2, 240px);
  }
}

@media (max-width: 600px) {
  .tgs-site .related-banners-grid {
    grid-template-columns: 240px;
  }
}


/* Main visual: uploaded hero images */
/* 左側の黒グラデーションは元のまま使う */


/* First hero heading fit adjustment */
.tgs-site .mainimg .slide.img1 .text h2 {
  font-size: clamp(2rem, 2.55vw, 3.15rem) !important;
  line-height: 1.35 !important;
}

@media (max-width: 800px) {
  .tgs-site .mainimg .slide.img1 .text h2 {
    font-size: clamp(1.6rem, 7vw, 2.35rem) !important;
    line-height: 1.3 !important;
  }
}


/* First hero heading: controlled mobile line breaks */
.tgs-site .hero-heading-one span {
  display: block;
  white-space: nowrap;
}

.tgs-site .sp-only-br {
  display: none;
}

@media (max-width: 800px) {
  .tgs-site .sp-only-br {
    display: block;
  }

  .tgs-site .mainimg .slide.img1 .text h2 {
    font-size: clamp(1.45rem, 6.2vw, 2rem) !important;
    line-height: 1.35 !important;
    letter-spacing: .06em !important;
  }
}


/* Mobile hamburger menu: black theme */
.tgs-site.small-screen #menubar,
.tgs-site .small-screen #menubar,
.small-screen .tgs-site #menubar,
.small-screen #menubar {
  background: rgba(var(--studio-header-bg-rgb), 0.98) !important;
}

.tgs-site #menubar_hdr,
#menubar_hdr {
  background: var(--studio-menu-bg) !important;
}

.tgs-site #menubar_hdr.ham,
#menubar_hdr.ham {
  background: var(--studio-menu-bg) !important;
}

.tgs-site #menubar_hdr span,
.tgs-site #menubar_hdr.ham span,
#menubar_hdr span,
#menubar_hdr.ham span {
  background: #fff !important;
}


/* Mobile: about block image, horizontal message, then text */
@media screen and (max-width: 700px) {
  .tgs-site #about .list2 {
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "image"
      "tate"
      "text" !important;
    gap: 1.5rem !important;
  }

  .tgs-site #about .list2 .image {
    grid-area: image;
    width: 100%;
  }

  .tgs-site #about .list2 .image img {
    display: block;
    width: 100%;
    height: auto;
  }

  .tgs-site #about .list2 .tate {
    grid-area: tate;
    justify-self: stretch !important;
    writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;
    padding: 1.25rem 1rem !important;
    letter-spacing: .08em !important;
    line-height: 1.8 !important;
    text-align: center !important;
  }

  .tgs-site #about .list2 .text {
    grid-area: text;
  }
}


/* Spacing between contact CTA and studio list */
.tgs-site #contact {
  margin-bottom: 3rem !important;
}

@media (max-width: 700px) {
  .tgs-site #contact {
    margin-bottom: 0 !important;
  }
}

/* Studio list section: light outer background, black cards */
.tgs-site .studio-list-section {
  background: #f2f2f0 !important;
  color: #111 !important;
  border: 0 !important;
  box-shadow: none !important;
}

.tgs-site .studio-list-section > h2,
.tgs-site .studio-list-section > p.c {
  color: #111 !important;
}

.tgs-site .studio-list-section .studio-cards-grid > .img > div {
  background: #171717 !important;
  border: 1px solid rgba(0,0,0,.18) !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.14) !important;
}

.tgs-site .studio-list-section .studio-cards-grid h4,
.tgs-site .studio-list-section .studio-cards-grid p {
  color: #fff !important;
}

.tgs-site .studio-list-section .studio-cards-grid h4 span {
  color: #c9b27d !important;
}

.tgs-site .related-banners-grid {
  background: transparent !important;
}


/* Studio section tone adjustment */
.tgs-site .studio-list-section {
  background: #d8d4cc !important;
}

.tgs-site .studio-list-section .studio-cards-grid > .img > div {
  border-color: rgba(0,0,0,.28) !important;
  box-shadow: 0 10px 22px rgba(0,0,0,.16) !important;
}

.tgs-site .related-banners-grid {
  margin-top: 3.5rem !important;
}

@media (max-width: 700px) {
  .tgs-site .related-banners-grid {
    margin-top: 2.75rem !important;
  }
}


/* Final section split: black studio list, gray banner block */
.tgs-site .studio-list-section {
  background: linear-gradient(180deg, #141414 0%, #080808 100%) !important;
  color: #fff !important;
  border: 0 !important;
  box-shadow: none !important;
  margin-bottom: 0 !important;
}

.tgs-site .studio-list-section > h2,
.tgs-site .studio-list-section > p.c {
  color: #fff !important;
}

.tgs-site .studio-list-section .studio-cards-grid > .img > div {
  background: #171717 !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.30) !important;
}

.tgs-site .related-banners-section {
  margin: 0 !important;
  padding: 3.25rem var(--content-space-l) !important;
  background: #ddd5c8 !important;
}

.tgs-site .related-banners-section .related-banners-grid {
  margin: 0 auto !important;
  background: transparent !important;
}

@media (max-width: 700px) {
  .tgs-site .related-banners-section {
    padding-top: 2.5rem !important;
    padding-bottom: 2.5rem !important;
  }
}


/* FAQ section spacing: match other main sections */
.tgs-site .faq-section {
  padding-top: 5rem !important;
  padding-bottom: 5rem !important;
}

@media (max-width: 700px) {
  .tgs-site .faq-section {
    padding-top: 3.5rem !important;
    padding-bottom: 3.5rem !important;
  }
}


/* Fix overlap between FAQ and contact CTA */
.tgs-site #faq + #contact {
  margin-top: 0 !important;
  position: relative;
  z-index: 1;
}


/* Adjust: add small spacing between related banners */
.tgs-site .related-banners-grid {
  gap: 0.75rem !important;
}

@media (max-width: 900px) {
  .tgs-site .related-banners-grid {
    gap: 0.75rem !important;
  }
}


/* Morimori message teaser */
.morimori-message-teaser {
  padding: 5rem var(--content-space-l);
  background: #ece7dc;
}

.morimori-message-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(260px, 350px) 1fr;
  gap: 2.5rem;
  align-items: center;
}

.morimori-message-photo img {
  display: block;
  width: 100%;
  height: auto;
}

.message-label {
  margin: 0 0 .65rem;
  font-size: .86rem;
  font-weight: 700;
  letter-spacing: .22em;
  color: #8f7643;
}

.morimori-message-text h2,
.morimori-page-head h2 {
  margin-bottom: 1rem;
  color: #111;
}

.message-lead,
.message-page-lead {
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1.8;
  color: #111;
}

.morimori-message-text p:not(.message-label):not(.btn),
.morimori-page-body p {
  color: #111;
  line-height: 2;
}

.morimori-message-btn a {
  background: #080808 !important;
  border-color: #b79a61 !important;
  color: #fff !important;
}

.morimori-message-btn a:hover {
  background: #b79a61 !important;
  border-color: #b79a61 !important;
  color: #080808 !important;
  opacity: 1 !important;
}

/* Morimori message page */
.message-page-section {
  padding: 5rem var(--content-space-l);
}

.morimori-page-head {
  max-width: 1200px;
  margin: 0 auto 2.5rem;
}

.morimori-page-grid {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(260px, 350px) 1fr;
  gap: 3rem;
  align-items: start;
}

.morimori-page-photo img {
  display: block;
  width: 100%;
  height: auto;
}

.message-catch {
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: .08em;
  margin: 2rem 0 1.2rem;
}

@media (max-width: 800px) {
  .morimori-message-teaser,
  .message-page-section {
    padding-top: 3.5rem;
    padding-bottom: 3.5rem;
  }

  .morimori-message-inner,
  .morimori-page-grid {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }

  .message-lead,
  .message-page-lead {
    font-size: 1.05rem;
    line-height: 1.7;
  }

  .message-catch {
    font-size: 1.3rem;
  }
}


/* 出版情報 */
.publish-section{padding:clamp(4.5rem,8vw,8rem) var(--content-space-l);background:#f3f1ed;color:#111}
.publish-section-head{max-width:1080px;margin:0 auto clamp(2.5rem,5vw,4.5rem);text-align:center}
.publish-section-head h2{margin:.25rem 0 1rem;font-size:clamp(2rem,4vw,3.5rem);letter-spacing:.08em;color:#111}
.publish-section-head>p:last-child{margin:0;line-height:1.9;letter-spacing:.06em;color:#555}
.publish-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.25rem,2.5vw,2.25rem);max-width:1080px;margin:0 auto}
.publish-card{display:grid;grid-template-rows:300px 1fr;background:#fff;border:1px solid #ddd8cf;box-shadow:0 10px 30px rgba(0,0,0,.06)}
.publish-cover{display:flex;align-items:center;justify-content:center;padding:1.5rem;background:#faf9f7;overflow:hidden}
.publish-cover img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;box-shadow:0 7px 18px rgba(0,0,0,.18)}
.publish-info{display:flex;flex-direction:column;padding:1.5rem}
.publish-info h3{margin:0 0 .85rem;font-size:1.05rem;line-height:1.65;letter-spacing:.05em;color:#111}
.publish-meta,.publish-author,.publish-date{margin:0 0 .45rem;font-size:.87rem;line-height:1.7;color:#666}
.publish-date{font-weight:700;color:#333}.publish-link{margin:auto 0 0;padding-top:1.25rem;text-align:center}
.publish-link a{display:inline-flex;align-items:center;justify-content:center;min-width:150px;padding:.72rem 1.1rem;border:1px solid #111;background:#111;color:#fff;font-size:.85rem;font-weight:700;letter-spacing:.06em;text-decoration:none;transition:.25s}
.publish-link a:hover{border-color:#c6a15b;background:#c6a15b;color:#111}
@media screen and (max-width:900px){.publish-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media screen and (max-width:600px){.publish-section{padding-left:1.25rem;padding-right:1.25rem}.publish-grid{grid-template-columns:1fr;gap:1.25rem}.publish-card{grid-template-columns:120px 1fr;grid-template-rows:auto}.publish-cover{padding:1rem;min-height:210px}.publish-info{padding:1.15rem 1rem}.publish-info h3{font-size:.95rem}.publish-link a{min-width:0;width:100%;padding-left:.6rem;padding-right:.6rem}}


/* 学芸大ゴルフスタジオ専用予約の表記 */
.reservation-studio-name {
	margin: 0 0 0.45rem;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: #c6a15b;
}


/* 施設案内ページ */
.facility-page-head {
	padding: clamp(5rem, 9vw, 8rem) var(--content-space-l) clamp(3.5rem, 6vw, 5.5rem);
	text-align: center;
	background: #fff;
	color: #111;
}
.facility-page-label {
	margin: 0 0 .6rem;
	color: #c6a15b;
	font-size: .8rem;
	font-weight: 700;
	letter-spacing: .2em;
}
.facility-page-head h2 {
	margin: 0 0 1rem;
	font-size: clamp(2.2rem, 5vw, 4rem);
	letter-spacing: .08em;
	color: #111;
}
.facility-page-head > p:last-child {
	max-width: 720px;
	margin: 0 auto;
	line-height: 2;
	letter-spacing: .06em;
	color: #555;
}
.facility-floor-section {
	padding: clamp(4rem, 7vw, 7rem) var(--content-space-l);
	background: #f3f1ed;
	color: #111;
}
.facility-floor-section-dark {
	background: #111;
	color: #fff;
}
.facility-floor-head {
	display: flex;
	align-items: baseline;
	gap: 1rem;
	max-width: 1120px;
	margin: 0 auto clamp(2rem, 4vw, 3.5rem);
	padding-bottom: 1rem;
	border-bottom: 1px solid rgba(0,0,0,.18);
}
.facility-floor-section-dark .facility-floor-head {
	border-bottom-color: rgba(255,255,255,.25);
}
.facility-floor-head span {
	color: #c6a15b;
	font-size: clamp(2rem, 4vw, 3.5rem);
	font-weight: 700;
	letter-spacing: .08em;
}
.facility-floor-head h3 {
	margin: 0;
	font-size: clamp(1.1rem, 2vw, 1.55rem);
	letter-spacing: .08em;
}
.facility-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(1.25rem, 2.5vw, 2rem);
	max-width: 1120px;
	margin: 0 auto;
}
.facility-grid-2 {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	max-width: 900px;
}
.facility-card {
	background: #fff;
	border: 1px solid #ddd8cf;
	box-shadow: 0 12px 30px rgba(0,0,0,.08);
}
.facility-floor-section-dark .facility-card {
	background: #1d1d1d;
	border-color: #333;
}
.facility-image {
	overflow: hidden;
	background: #ddd;
	aspect-ratio: 400 / 271;
}
.facility-image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .45s ease;
}
.facility-card:hover .facility-image img {
	transform: scale(1.025);
}
.facility-text {
	padding: 1.1rem 1rem 1.2rem;
	text-align: center;
}
.facility-text h4 {
	margin: 0;
	font-size: 1rem;
	letter-spacing: .08em;
	color: #111;
}
.facility-floor-section-dark .facility-text h4 {
	color: #fff;
}
.facility-reservation .text2 {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	align-items: center;
}
.facility-reservation .text2 .btn {
	margin: 0;
}
@media screen and (max-width: 900px) {
	.facility-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}
@media screen and (max-width: 600px) {
	.facility-page-head,
	.facility-floor-section {
		padding-left: 1.25rem;
		padding-right: 1.25rem;
	}
	.facility-floor-head {
		display: block;
	}
	.facility-floor-head h3 {
		margin-top: .35rem;
	}
	.facility-grid,
	.facility-grid-2 {
		grid-template-columns: 1fr;
	}
	.facility-reservation .text2 {
		display: block;
	}
	.facility-reservation .text2 .btn {
		margin-bottom: .8rem;
	}
}


/* 施設案内ページ：階数に依存しない構成 */
.facility-category-section {
	padding: clamp(4rem, 7vw, 7rem) var(--content-space-l);
	background: #f3f1ed;
	color: #111;
}
.facility-category-section-alt {
	background: #fff;
}
.facility-category-head {
	max-width: 820px;
	margin: 0 auto clamp(2.25rem, 4vw, 3.5rem);
	text-align: center;
}
.facility-category-label {
	margin: 0 0 .55rem;
	color: #c6a15b;
	font-size: .76rem;
	font-weight: 700;
	letter-spacing: .18em;
}
.facility-category-head h3 {
	margin: 0 0 .85rem;
	font-size: clamp(1.6rem, 3vw, 2.5rem);
	letter-spacing: .08em;
	color: #111 !important;
}
.facility-category-head > p:last-child {
	margin: 0;
	line-height: 1.9;
	letter-spacing: .05em;
	color: #555;
}
.facility-category-section .facility-card,
.facility-category-section-alt .facility-card {
	background: #fff;
	border-color: #ddd8cf;
}
.facility-category-section .facility-text h4,
.facility-category-section-alt .facility-text h4 {
	color: #111 !important;
}
@media screen and (max-width:600px) {
	.facility-category-section {
		padding-left: 1.25rem;
		padding-right: 1.25rem;
	}
}


/* 施設案内ページ：予約ブロックとフッター間の余白を解消 */
.facility-page #contents {
	padding-bottom: 0 !important;
	margin-bottom: 0 !important;
}
.facility-page main {
	margin-bottom: 0 !important;
	padding-bottom: 0 !important;
}
.facility-page #contact {
	margin-bottom: 0 !important;
}
.facility-page footer {
	margin-top: 0 !important;
}

/* 施設案内ページ：CTA直下の白帯を完全に除去 */
body.facility-page section#contact {
  margin-bottom: 0 !important;
}



/* 予約ブロック背景画像のスタジオ別切り替え
   bodyの --contact-bg-image だけ変更すれば差し替え可能 */

/* 施設案内ページ：予約ブロック背景と文字影の最終調整 */
body.facility-page #contact {
  background-image: var(--contact-bg-image) !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: cover !important;
  margin-bottom: 0 !important;
}
body.facility-page #contact .text h2,
body.facility-page #contact .text p {
  text-shadow: none !important;
}
body.facility-page #contact .text2 {
  box-shadow: none !important;
}
body.facility-page #contents,
body.facility-page main {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}
body.facility-page footer {
  margin-top: 0 !important;
}


/* フッター連絡先 */
.footer-contact-info {
	font-size: 0.78rem;
	line-height: 1.8;
}
.footer-contact-info a {
	color: inherit;
	text-decoration: none;
}
.footer-contact-info span {
	display: inline-block;
	margin-top: 0.35rem;
}
.studio-hours {
	margin-top: 1.25rem;
	padding: 1rem 1.2rem;
	background: #f3f1ed;
	color: #111;
}
.studio-hours p {
	margin: 0;
	line-height: 1.8;
}


/* ご利用案内ページ：旧サイト内容を新デザインへ反映 */
.guide-section{padding:clamp(4.5rem,8vw,7rem) var(--content-space-l);background:#fff;color:#111}
.guide-section-alt{background:#f3f1ed}
.guide-section-head{max-width:1080px;margin:0 auto clamp(2rem,4vw,3.5rem);text-align:center}
.guide-section-head h2{margin:.3rem 0 .8rem;font-size:clamp(2rem,4vw,3.2rem);letter-spacing:.08em;color:#111}
.guide-section-head>p:last-child{margin:0;color:#555}
.hours-panel{max-width:760px;margin:0 auto;padding:clamp(1.5rem,4vw,3rem);border:1px solid #ddd8cf;background:#faf9f7}
.hours-panel>div{display:flex;justify-content:space-between;gap:1.5rem;padding:1.15rem 0;border-bottom:1px solid #ddd8cf}
.hours-panel span{font-weight:700;letter-spacing:.08em}
.hours-panel strong{font-size:clamp(1.2rem,2.5vw,1.8rem);font-weight:600}
.hours-panel>p{margin:1rem 0 0;text-align:right;color:#666}
.legacy-price-block{max-width:1080px;margin:0 auto 2.4rem}
.legacy-price-block h3{margin:0 0 .75rem;padding-left:1rem;border-left:4px solid #c6a15b;font-size:1.15rem;letter-spacing:.06em;color:#111}
.guide-price-table{width:100%;border-collapse:collapse;background:#fff}
.guide-price-table th,.guide-price-table td{padding:1rem 1.2rem;border:1px solid #d8d3cb;line-height:1.7;text-align:left;vertical-align:middle}
.guide-price-table th{width:32%;background:#111;color:#fff;font-weight:600}
.guide-price-table .amount{width:20%;font-size:1.1rem;font-weight:700;text-align:right;white-space:nowrap}
.guide-note{max-width:1080px;margin:0 auto;font-size:.85rem;color:#555}
.access-guide-section{background:#fff}
.access-guide-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);gap:clamp(2rem,4vw,4rem);max-width:1120px;margin:0 auto;align-items:start}
.access-map iframe{display:block;width:100%;min-height:420px}
.access-guide-info h3{margin:0 0 1.2rem;font-size:1.4rem;letter-spacing:.06em;color:#111}
.access-guide-info p{line-height:1.9}
.access-guide-info a{color:inherit}
.traffic-box{margin-top:1.5rem;padding:1.2rem 1.3rem;background:#f3f1ed}
.traffic-box h4{margin:0 0 .5rem;color:#111}
.traffic-box p{margin:0;color:#444}
@media screen and (max-width:800px){.access-guide-grid{grid-template-columns:1fr}.guide-price-table,.guide-price-table tbody,.guide-price-table tr,.guide-price-table th,.guide-price-table td{display:block;width:100%}.guide-price-table tr{margin-bottom:1rem;border:1px solid #d8d3cb}.guide-price-table th,.guide-price-table td{border:0;border-bottom:1px solid #e5e1da}.guide-price-table .amount{text-align:left}.hours-panel>div{display:block}.hours-panel strong{display:block;margin-top:.35rem}}


/* charge page redesign */
.charge-page {
  --navy-deep: #000000;
  --navy-mid: #111111;
  --gold: #d0af62;
  --ink: #111111;
  --light-card: #eef0f4;
  --greige: #dcc07a;
}
.charge-page .page-title,
.charge-page .price-page-title,
.charge-page .guide-section,
.charge-page .access-guide-section {display:none !important;}
.charge-page main {display:block;}
.price-hero-section {
  background: linear-gradient(180deg, #0a0a0a 0%, #111111 100%);
  color: #fff;
  padding: clamp(5rem, 8vw, 7rem) 1.5rem clamp(7rem, 12vw, 10rem);
}
.price-hero-inner {
  width: min(100%, 1040px);
  margin: 0 auto;
}
.price-hero-section .eyebrow,
.price-hours-band .eyebrow,
.price-section .eyebrow,
.price-flow-section .eyebrow,
.price-access-section .eyebrow { 
  margin: 0 0 .9rem; 
  font-size: .88rem; 
  letter-spacing: .18em; 
  color: var(--gold);
  font-weight: 600;
}
.price-hero-section .studio-name {
  margin: 0 0 1.2rem;
  font-size: 1rem;
  letter-spacing: .08em;
  font-weight: 700;
}
.price-hero-section h2 {
  margin: 0 0 1.5rem;
  font-size: clamp(2.4rem, 5vw, 4rem);
  line-height: 1.25;
  letter-spacing: .08em;
}
.price-hero-section .lead {
  width: min(100%, 740px);
  margin: 0;
  line-height: 2;
  font-size: 1.05rem;
}
.price-hours-band {
  background: #0d0d0d;
  color: #fff;
  padding: 0 1.5rem 5.5rem;
  margin-top: -3rem;
}
.price-hours-inner {
  width: min(100%, 1040px);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 2rem;
  align-items: center;
}
.price-hours-title h2 {margin: .3rem 0 0; font-size: clamp(2rem, 4vw, 3rem); letter-spacing: .08em; color:#fff;}
.hours-panel {
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 24px;
  padding: 1.5rem 1.75rem;
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
  backdrop-filter: blur(2px);
}
.hours-panel div {background: rgba(255,255,255,.06); border-radius: 16px; padding: 1rem 1.2rem;}
.hours-panel span {display:block; color:#d8c591; font-size:.88rem; letter-spacing:.08em; margin-bottom:.45rem;}
.hours-panel strong {font-size:1.35rem; letter-spacing:.04em;}
.hours-panel > p {grid-column: 1 / -1; margin: .2rem 0 0; color:#e3e7ef; text-align:right;}
.price-section {
  padding: clamp(5rem, 8vw, 6.5rem) 1.5rem;
}
.price-section-dark {background:#000; color:#fff;}
.price-section-head {width:min(100%,1040px); margin:0 auto 2.6rem;}
.price-section-head.center {text-align:center;}
.price-section-head.center > p:last-child {margin-left:auto; margin-right:auto;}
.price-section-head h2 {
  margin: .2rem 0 1rem;
  font-size: clamp(2rem, 4vw, 3.3rem);
  letter-spacing: .08em;
  color:#fff;
}
.price-section-head.dark-text h2 {color:#10264f;}
.price-section-head > p:last-child {
  width:min(100%, 760px);
  margin:0;
  line-height:1.9;
  color: rgba(255,255,255,.88);
}
.price-section-head.dark-text > p:last-child {color:#39465f;}
.price-card-grid {
  width:min(100%, 1040px);
  margin:0 auto;
  display:grid;
  gap:2rem;
}
.price-card-grid-2 {grid-template-columns: repeat(2, minmax(0, 1fr));}
.price-feature-card {
  background: var(--light-card);
  color: var(--ink);
  border-radius: 22px;
  padding: 2rem 2rem 1.8rem;
  box-shadow: 0 12px 32px rgba(0,0,0,.12);
}
.price-feature-card.is-outline {border: 2px solid var(--gold);}
.price-feature-card .label {
  display:inline-block; padding:.45rem .9rem; border-radius:10px; background:var(--gold); color:var(--ink);
  font-size:.85rem; font-weight:700; margin-bottom:1.5rem;
}
.price-feature-card h3 {margin:0 0 .8rem; font-size:2rem; letter-spacing:.06em; color:var(--ink);}
.price-feature-card .amount {margin:0; color:#234882; font-size: clamp(2.7rem, 5vw, 4.3rem); line-height:1.1; font-weight:500;}
.price-feature-card .sub {margin:.45rem 0 1.4rem; color:#6d7688;}
.price-feature-card ul {margin:0 0 1.8rem; padding-left:1.2rem; line-height:2;}
.price-feature-card .cta {margin:0;}
.price-feature-card .cta a {
  display:inline-flex; align-items:center; justify-content:center; gap:.8rem; padding:1rem 1.4rem; background:#284b89; color:#fff; text-decoration:none; font-weight:700; min-width:290px;
}
.price-feature-card .cta-outline a {background:transparent; color:#284b89; border:1px solid #284b89;}
.pt-tight {padding-top: 0;}
.plan-table-wrap {
  width:min(100%, 1120px); margin:0 auto; background:#eef0f4; border-radius:20px; padding:1.15rem;
}
.plan-table {width:100%; border-collapse: collapse; overflow:hidden; background:#fff; border-radius:14px;}
.plan-table thead th {background:#284b89; color:#fff; padding:1.2rem 1rem; text-align:left; font-size:1rem;}
.plan-table tbody th, .plan-table tbody td {padding:1.3rem 1rem; border-bottom:1px solid #dce1ea; vertical-align:top; color:#11284d;}
.plan-table tbody tr:last-child th, .plan-table tbody tr:last-child td {border-bottom:none;}
.plan-table .amount-cell strong {display:block; font-size:2rem; line-height:1.15; color:#17396f;}
.plan-table .amount-cell span {display:block; margin-top:.35rem; color:#4e5e7a;}
.price-note {width:min(100%, 1120px); margin:1.2rem auto 0; color:rgba(255,255,255,.75); font-size:.92rem;}
.other-price-grid {
  width:min(100%, 1120px); margin:0 auto; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1.6rem;
}
.other-price-card {
  background: var(--light-card); color:var(--ink); border-radius:22px; padding:2rem 1.9rem; min-height: 100%;
}
.other-price-card h3 {margin:0 0 1rem; font-size:2rem; color:var(--ink);}
.other-price-card .desc {line-height:1.9; color:#4a5871; min-height:6em;}
.other-price-card dl {margin:1.2rem 0 .2rem;}
.other-price-card dl div {display:flex; justify-content:space-between; gap:1rem; padding:.8rem 0; border-top:1px solid #d7dde7;}
.other-price-card dl div:last-child {border-bottom:1px solid #d7dde7;}
.other-price-card dt {font-weight:600;}
.other-price-card dd {margin:0; font-size:1.3rem; color:#21467f; font-weight:700;}
.other-price-card .tax {margin:.8rem 0 0; color:#778196;}
.member-link a {display:inline-block; margin-top:1rem; color:#234882; font-weight:700; text-decoration:none; border-bottom:1px solid currentColor;}
.price-flow-section {
  background:#111; padding: clamp(5rem, 8vw, 6.5rem) 1.5rem; color:#fff;
}
.flow-grid {width:min(100%, 1120px); margin:0 auto; display:grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap:1rem;}
.flow-card {background: rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14); border-radius:18px; padding:1.5rem 1rem 1.7rem; text-align:center; min-height:140px; display:flex; flex-direction:column; justify-content:center;}
.flow-card span {display:block; margin-bottom:.9rem; font-size:1.15rem; letter-spacing:.12em;}
.flow-card h3 {margin:0; font-size:1.1rem; line-height:1.7; color:#fff;}
.price-access-section {
  background:#111; padding: clamp(5rem, 8vw, 6.5rem) 1.5rem 4rem; color:#fff;
}
.price-access-section .access-guide-grid {width:min(100%, 1120px); margin:0 auto; display:grid; grid-template-columns: 1.05fr .95fr; gap:2rem; align-items:start;}
.price-access-section .access-map iframe {border-radius:18px; overflow:hidden; box-shadow:0 10px 30px rgba(0,0,0,.08);}
.price-access-section .access-guide-info {background:#1a1a1a; border:1px solid rgba(255,255,255,.1); border-radius:20px; padding:2rem; box-shadow:none;}
.price-access-section .access-guide-info h3 {margin:0 0 1rem; font-size:1.8rem; color:#fff;}
.price-access-section .access-guide-info p {line-height:1.9;}
.price-access-section .traffic-box {margin-top:1.15rem; padding-top:1rem; border-top:1px solid rgba(255,255,255,.12);}
.price-access-section .traffic-box h4 {margin:0 0 .4rem; font-size:1.05rem; color:#d0af62;}
@media (max-width: 1024px) {
  .price-card-grid-2, .other-price-grid, .flow-grid {grid-template-columns: repeat(2, minmax(0,1fr));}
  .flow-grid .flow-card:last-child {grid-column: 1 / -1; max-width: 320px; margin: 0 auto;}
  .price-access-section .access-guide-grid, .price-hours-inner {grid-template-columns:1fr;}
}
@media (max-width: 767px) {
  .price-hero-section {padding-top:4rem; padding-bottom:5rem;}
  .price-hero-section h2 {font-size:2.3rem;}
  .price-hours-band {padding-bottom:3rem;}
  .hours-panel {grid-template-columns:1fr;}
  .price-card-grid-2, .other-price-grid, .flow-grid {grid-template-columns:1fr;}
  .price-feature-card .cta a {width:100%; min-width:0;}
  .plan-table-wrap {padding:.7rem; overflow-x:auto;}
  .plan-table {min-width:720px;}
  .price-access-section .access-guide-grid {grid-template-columns:1fr;}
}


/* ご利用案内：黒ベース・体験レッスン表示切替 */
.charge-page {
  --navy-deep: #080808;
  --navy-mid: #111111;
  --gold: #c6a15b;
  --ink: #111111;
  --light-card: #f1f1f1;
  --greige: #c6a15b;
  background: #080808;
}
.charge-page .price-hero-section {
  background: #080808;
}
.charge-page .price-hours-band,
.charge-page .price-section-dark {
  background: #111111;
}
.charge-page .price-flow-section {
  background: #c6a15b;
}
.charge-page .price-access-section {
  background: #f3f3f3;
}
.charge-page.trial-disabled .trial-price-card {
  display: none;
}
.charge-page.trial-disabled .price-card-grid-2 {
  grid-template-columns: minmax(0, 560px);
  justify-content: center;
}


/* charge page black-base overrides */
.charge-page .price-section-head.dark-text h2,
.charge-page .price-flow-section .price-section-head h2,
.charge-page .price-access-section .price-section-head h2 { color: #fff; }
.charge-page .price-section-head.dark-text > p:last-child,
.charge-page .price-access-section .access-guide-info p,
.charge-page .price-access-section .small { color: rgba(255,255,255,.82); }
.charge-page .price-flow-section .eyebrow,
.charge-page .price-access-section .eyebrow { color: #d0af62; }
.charge-page .price-access-section a { color: #fff; }
.charge-page .price-access-section .access-map iframe { box-shadow: none; }


/* charge page color balance: black / white / beige */
.charge-page .price-hero-section {
  background: linear-gradient(180deg, #070707 0%, #111111 100%);
  color: #fff;
}
.charge-page .price-hero-section h2,
.charge-page .price-hero-section .studio-name,
.charge-page .price-hero-section .lead { color: #fff; }

.charge-page .price-hours-band {
  background: #ffffff;
  color: #111111;
}
.charge-page .price-hours-title h2 { color: #111111; }
.charge-page .hours-panel {
  background: #f4f1ea;
  border: 1px solid #e4dccd;
}
.charge-page .hours-panel div {
  background: #ffffff;
}
.charge-page .hours-panel strong { color: #111111; }
.charge-page .hours-panel > p { color: #444444; }

.charge-page #trial.price-section-dark {
  background: #000000;
  color: #ffffff;
}
.charge-page #trial .price-section-head h2,
.charge-page #trial .price-section-head p,
.charge-page #trial .price-section-head > p:last-child {
  color: #ffffff;
}

.charge-page #monthly-plan.price-section-dark {
  background: #ffffff;
  color: #111111;
}
.charge-page #monthly-plan .price-section-head h2,
.charge-page #monthly-plan .price-section-head p,
.charge-page #monthly-plan .price-section-head > p:last-child {
  color: #111111;
}
.charge-page #monthly-plan .price-note { color: #666666; }

.charge-page #other-price.price-section-dark {
  background: #d0af62;
  color: #111111;
}
.charge-page #other-price .price-section-head h2,
.charge-page #other-price .price-section-head p,
.charge-page #other-price .price-section-head > p:last-child {
  color: #111111;
}
.charge-page #other-price .eyebrow { color: #6d5314; }

.charge-page .price-flow-section {
  background: #ffffff;
  color: #111111;
}
.charge-page .price-flow-section .price-section-head h2,
.charge-page .price-flow-section .price-section-head p,
.charge-page .price-flow-section .price-section-head > p:last-child {
  color: #111111;
}
.charge-page .price-flow-section .eyebrow { color: #b38a2c; }
.charge-page .flow-card {
  background: #f4f1ea;
  border: 1px solid #eadfc8;
}
.charge-page .flow-card span,
.charge-page .flow-card h3 { color: #111111; }

.charge-page .price-access-section {
  background: #000000;
  color: #ffffff;
}
.charge-page .price-access-section .price-section-head h2,
.charge-page .price-access-section .price-section-head p,
.charge-page .price-access-section .price-section-head > p:last-child,
.charge-page .price-access-section .small {
  color: #ffffff;
}
.charge-page .price-access-section .access-guide-info {
  background: #151515;
  border: 1px solid rgba(255,255,255,.12);
  color: #ffffff;
}
.charge-page .price-access-section .access-guide-info h3,
.charge-page .price-access-section .access-guide-info p,
.charge-page .price-access-section .access-guide-info a {
  color: #ffffff;
}
.charge-page .price-access-section .traffic-box {
  border-top: 1px solid rgba(255,255,255,.15);
}
.charge-page .price-access-section .traffic-box h4 {
  color: #d0af62;
}

/* global readability tweaks */
.charge-page .price-section-head.center > p:last-child {
  max-width: 760px;
}
.charge-page .other-price-card,
.charge-page .price-feature-card,
.charge-page .plan-table-wrap {
  box-shadow: none;
}


/* chrge final adjust: remove flow / access white */
.charge-page .price-access-section {
  background: #ffffff !important;
  color: #111111 !important;
}
.charge-page .price-access-section .price-section-head h2,
.charge-page .price-access-section .price-section-head p,
.charge-page .price-access-section .price-section-head > p:last-child,
.charge-page .price-access-section .small {
  color: #111111 !important;
}
.charge-page .price-access-section .eyebrow {
  color: #b38a2c !important;
}
.charge-page .price-access-section .access-guide-info {
  background: #ffffff !important;
  border: 1px solid #e3e3e3 !important;
  color: #111111 !important;
}
.charge-page .price-access-section .access-guide-info h3,
.charge-page .price-access-section .access-guide-info p,
.charge-page .price-access-section .access-guide-info a {
  color: #111111 !important;
}
.charge-page .price-access-section .traffic-box {
  border-top: 1px solid #e4e8ef !important;
}
.charge-page .price-access-section .traffic-box h4 {
  color: #17396f !important;
}
.charge-page .price-access-section .access-map iframe {
  box-shadow: 0 10px 30px rgba(0,0,0,.08) !important;
}


/* charge.html：floor.htmlと同じ背景配色 */
.charge-page .price-hero-section {
	background: #fff !important;
	color: #111 !important;
}
.charge-page .price-hero-section .eyebrow {
	color: #c6a15b !important;
}
.charge-page .price-hero-section .studio-name,
.charge-page .price-hero-section h2,
.charge-page .price-hero-section .lead {
	color: #111 !important;
}

.charge-page .price-hours-band {
	margin-top: 0 !important;
	background: #f3f1ed !important;
	color: #111 !important;
	padding-top: clamp(4rem, 7vw, 7rem) !important;
}
.charge-page .price-hours-title h2 {
	color: #111 !important;
}
.charge-page .hours-panel {
	background: #fff !important;
	border: 1px solid #ddd8cf !important;
	box-shadow: none !important;
	backdrop-filter: none !important;
}
.charge-page .hours-panel div {
	background: #f8f6f2 !important;
}
.charge-page .hours-panel span {
	color: #9d782e !important;
}
.charge-page .hours-panel strong,
.charge-page .hours-panel > p {
	color: #111 !important;
}

.charge-page #trial.price-section-dark {
	background: #fff !important;
	color: #111 !important;
}
.charge-page #trial .price-section-head h2,
.charge-page #trial .price-section-head p,
.charge-page #trial .price-section-head > p:last-child {
	color: #111 !important;
}

.charge-page #monthly-plan.price-section-dark {
	background: #f3f1ed !important;
	color: #111 !important;
}
.charge-page #monthly-plan .price-section-head h2,
.charge-page #monthly-plan .price-section-head p,
.charge-page #monthly-plan .price-section-head > p:last-child {
	color: #111 !important;
}
.charge-page #monthly-plan .price-note {
	color: #555 !important;
}

.charge-page #other-price.price-section-dark {
	background: #fff !important;
	color: #111 !important;
}
.charge-page #other-price .price-section-head h2,
.charge-page #other-price .price-section-head p,
.charge-page #other-price .price-section-head > p:last-child {
	color: #111 !important;
}

.charge-page .price-access-section {
	background: #f3f1ed !important;
	color: #111 !important;
}
.charge-page .price-access-section .price-section-head h2,
.charge-page .price-access-section .price-section-head p,
.charge-page .price-access-section .price-section-head > p:last-child,
.charge-page .price-access-section .small {
	color: #111 !important;
}
.charge-page .price-access-section .access-guide-info {
	background: #fff !important;
	border: 1px solid #ddd8cf !important;
	color: #111 !important;
	box-shadow: none !important;
}
.charge-page .price-access-section .access-guide-info h3,
.charge-page .price-access-section .access-guide-info p,
.charge-page .price-access-section .access-guide-info a {
	color: #111 !important;
}
.charge-page .price-access-section .traffic-box {
	border-top: 1px solid #e2ddd4 !important;
}
.charge-page .price-access-section .traffic-box h4 {
	color: #9d782e !important;
}
.charge-page .price-access-section .access-map iframe {
	box-shadow: none !important;
}

.charge-page .price-feature-card,
.charge-page .other-price-card,
.charge-page .plan-table-wrap {
	box-shadow: none !important;
}


/* chrge heading center */
.charge-page .price-hero-inner {
  text-align: center;
}
.charge-page .price-hero-section h2 {
  display: inline-block;
  position: relative;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 1.2rem;
  text-align: center;
}
.charge-page .price-hero-section h2::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 52px;
  height: 1px;
  background: #c6a15b;
  transform: translateX(-50%);
}


/* charge.html：見出し下線をすべて削除 */
.charge-page .price-hero-section h2::after,
.charge-page .price-hours-title h2::after,
.charge-page .price-section-head h2::after,
.charge-page .price-access-section h2::after,
.charge-page .guide-section-head h2::after,
.charge-page h2::after,
.charge-page h3::after {
  display: none !important;
  content: none !important;
}


/* 全ページ：見出しの装飾線を削除 */
main h1::before,
main h1::after,
main h2::before,
main h2::after,
main h3::before,
main h3::after,
main h4::before,
main h4::after {
	display: none !important;
	content: none !important;
	width: 0 !important;
	height: 0 !important;
	border: 0 !important;
	background: none !important;
}


/* charge.html 料金表統合 */
.price-table-section {
	padding: clamp(4.5rem, 8vw, 7rem) var(--content-space-l);
	background: #f3f1ed;
	color: #111;
}
.price-table-section .price-section-head {
	margin-bottom: clamp(2.5rem, 5vw, 4rem);
}
.price-table-section .price-section-head h2 {
	color: #111 !important;
}
.price-table-group {
	max-width: 1040px;
	margin: 0 auto clamp(2.5rem, 5vw, 4rem);
}
.price-table-group h3 {
	margin: 0 0 1rem;
	font-size: clamp(1.35rem, 2.5vw, 1.9rem);
	letter-spacing: 0.08em;
	color: #111;
}
.simple-price-table-wrap {
	overflow-x: auto;
	background: #fff;
	border: 1px solid #ddd8cf;
}
.simple-price-table {
	width: 100%;
	border-collapse: collapse;
	background: #fff;
}
.simple-price-table th,
.simple-price-table td {
	padding: 1.25rem 1.4rem;
	border-bottom: 1px solid #e5e0d7;
	text-align: left;
	vertical-align: middle;
	color: #111;
}
.simple-price-table tr:last-child th,
.simple-price-table tr:last-child td {
	border-bottom: 0;
}
.simple-price-table thead th {
	background: #111;
	color: #fff;
	font-weight: 700;
}
.simple-price-table tbody th {
	width: 48%;
	font-weight: 700;
}
.simple-price-table tbody th span {
	font-size: 0.84rem;
	font-weight: 400;
	color: #666;
}
.simple-price-table .price-value {
	width: 24%;
	text-align: right;
	white-space: nowrap;
	font-size: clamp(1.2rem, 2vw, 1.7rem);
	font-weight: 700;
	color: #9d782e;
}
.price-table-note {
	max-width: 1040px;
	margin: 0 auto;
	font-size: 0.9rem;
	line-height: 1.8;
	color: #666;
}
.charge-page.trial-disabled .trial-price-row {
	display: none;
}
@media screen and (max-width: 700px) {
	.price-table-section {
		padding-left: 1.25rem;
		padding-right: 1.25rem;
	}
	.simple-price-table th,
	.simple-price-table td {
		padding: 1rem;
	}
}


/* charge.html 営業時間テーブル・料金表背景 */
.hours-table-section {
  padding: clamp(4.5rem, 8vw, 7rem) var(--content-space-l);
  background: #f3f1ed;
  color: #111;
}
.hours-table-section .price-section-head h2 {
  color: #111 !important;
}
.hours-price-table tbody th {
  width: 50%;
}
.hours-price-table .hours-value {
  text-align: right;
  white-space: nowrap;
  font-size: clamp(1.2rem, 2vw, 1.7rem);
  font-weight: 700;
  color: #9d782e;
}
.hours-table-note {
  margin: 0.9rem 0 0;
  text-align: right;
  font-size: 0.9rem;
  color: #666;
}
.charge-page .price-table-section {
  background: #fff !important;
}
.charge-page .price-table-section .simple-price-table-wrap {
  background: #f8f6f2;
}
.charge-page .price-table-section .simple-price-table {
  background: #fff;
}
@media screen and (max-width: 700px) {
  .hours-table-section {
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }
}


/* charge.html：英語タイトルをゴールドに統一 */
.charge-page .eyebrow,
.charge-page .price-hero-section .eyebrow,
.charge-page .price-hours-band .eyebrow,
.charge-page .price-table-section .eyebrow,
.charge-page .price-access-section .eyebrow {
	color: #c6a15b !important;
}

/* charge.html：ACCESS英語見出しをゴールドに固定 */
.charge-page .price-access-section .price-section-head .eyebrow {
	color: #c6a15b !important;
}

/* TGS staff page custom */
.staff-page #contents main > section:first-child {
	padding-top: 3rem;
	padding-bottom: 4rem;
}
.staff-grid-lead {
	max-width: 860px;
	margin: 0 auto 2rem;
	text-align: center;
	color: #555;
	line-height: 1.8;
}
.staff-grid-template {
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1.75rem;
}
.staff-grid-template .list {
	padding: 0;
	border: 1px solid #e6e6e6;
	background: #fff;
	box-shadow: 0 10px 24px rgba(0,0,0,0.06);
	transition: transform .25s ease, box-shadow .25s ease;
	overflow: hidden;
}
.staff-grid-template .staff-card-link {
	display: flex;
	flex-direction: column;
	height: 100%;
	text-decoration: none;
	color: inherit;
}
.staff-grid-template.image-full .image {
	margin: 0;
	background: #f5f5f5;
}
.staff-grid-template .image {
	overflow: hidden;
}
.staff-grid-template .image img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	object-position: center top;
	transition: transform .35s ease;
}
.staff-grid-template .text {
	padding: 1.1rem 1.1rem 1.2rem;
	text-align: left;
}
.staff-grid-template .text h4 {
	font-size: 1.35rem;
	margin: 0 0 .2rem;
	line-height: 1.4;
	color: #111;
}
.staff-grid-template .text .staff-roman {
	display: block;
	margin: 0 0 .7rem;
	font-size: .82rem;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #8a6a1f;
}
.staff-grid-template .text {
	display: flex;
	flex-direction: column;
	flex: 1;
}
.staff-grid-template .text .staff-desc {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .45rem;
	width: 100%;
	margin: auto 0 0;
	padding: .9rem 0 0;
	border-top: 1px solid #ddd;
	background: transparent;
	font-size: .86rem;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: .05em;
	color: #222;
	transition: color .25s ease;
}
.staff-grid-template .text .staff-desc::after {
	content: "→";
	color: #b8954f;
	font-size: 1rem;
	transition: transform .25s ease;
}

.staff-detail-wrap {
	max-width: 1000px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: minmax(260px, 360px) 1fr;
	gap: 3rem;
	align-items: start;
}
.staff-detail-photo img {
	width: 100%;
	display: block;
}
.staff-detail-text h3 {
	font-size: 2rem;
	margin-bottom: .75rem;
}
.staff-detail-text p {
	line-height: 2;
}
.staff-detail-text .btn2 a {
	display: inline-block;
	text-decoration: none;
	padding: .8rem 1.2rem;
	background: var(--primary-color);
	color: #fff;
}

@media (max-width: 1100px) {
	.staff-grid-template {grid-template-columns: repeat(2, minmax(0, 1fr));}
}
@media (max-width: 900px) {
	.staff-detail-wrap {grid-template-columns: 1fr; gap: 2rem;}
}
@media (max-width: 700px) {
	.staff-grid-template {grid-template-columns: 1fr; gap: 1.25rem;}
	.staff-grid-template .text {padding: 1rem;}
	.staff-grid-template .text h4 {font-size: 1.2rem;}
}


/* スタッフ紹介：固定ヘッダーとの重なりを解消 */
.staff-page #contents {
	padding-top: 100px;
}
.staff-page #contents main > section:first-child {
	padding-top: 3.5rem;
}
@media screen and (max-width: 700px) {
	.staff-page #contents {
		padding-top: 0;
	}
}


/* mori detail page */
.staff-detail-page #contents {
	padding-top: 100px;
}
.staff-breadcrumb {
	max-width: 1200px;
	margin: 0 auto 1.75rem;
	font-size: .95rem;
	color: #888;
}
.staff-breadcrumb a {
	color: #666;
	text-decoration: none;
}
.staff-breadcrumb span {
	margin: 0 .4rem;
}
.staff-detail-hero {
	padding: 3rem 2rem 4rem;
	background: #fff;
}
.detail-hero-grid {
	max-width: 1200px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: minmax(280px, 360px) 1fr;
	gap: 3.5rem;
	align-items: center;
}
.hero-photo img {
	width: 100%;
	display: block;
	background: #e8eef7;
}
.hero-copy .staff-kicker {
	font-size: .9rem;
	letter-spacing: .2em;
	color: #8a6a1f;
	margin-bottom: .7rem;
}
.hero-copy h2 {
	font-size: clamp(2rem, 4vw, 3rem);
	line-height: 1.2;
	margin: 0 0 1rem;
}
.hero-copy h2 span {
	display: block;
	font-size: 1.1rem;
	font-weight: 500;
	color: #8a6a1f;
	margin-top: .5rem;
}
.staff-basic-list {
	list-style: none;
	padding: 0;
	margin: 0 0 1.25rem;
	display: flex;
	flex-direction: column;
	gap: .5rem;
	font-weight: 700;
}
.staff-intro {
	font-size: 1rem;
	line-height: 2;
	color: #444;
}
.dark-section {
	background: #050505;
	padding: 4rem 2rem 5rem;
}
.detail-section-inner {
	max-width: 1200px;
	margin: 0 auto;
}
.detail-block {
	margin-bottom: 2.25rem;
	color: #fff;
}
.detail-block h3 {
	margin: 0 0 1.15rem;
	padding: .85rem 1rem;
	background: linear-gradient(90deg, rgba(255,255,255,0.08), rgba(255,255,255,0.03));
	border-left: 4px solid #8a6a1f;
	font-size: 1.5rem;
	color: #fff;
}
.detail-block p {
	margin: 0;
	line-height: 2.1;
	font-size: 1rem;
	color: rgba(255,255,255,0.92);
}
.image-block {
	display: grid;
	grid-template-columns: 1.3fr .7fr;
	gap: 2rem;
	align-items: start;
}
.image-block.left-image {
	grid-template-columns: 1fr 260px;
}
.image-block.right-image {
	grid-template-columns: 1fr 220px;
}
.detail-image-area img {
	width: 100%;
	display: block;
	background: #fff;
}
.portrait-small img {
	max-width: 220px;
}
.swing-tall img {
	max-width: 260px;
	margin-left: auto;
}
.staff-back-btn {
	margin: 3rem 0 0;
}
.staff-back-btn a {
	display: inline-block;
	padding: .95rem 1.4rem;
	background: #111;
	border: 1px solid #444;
	color: #fff;
	text-decoration: none;
	transition: background .2s ease, border-color .2s ease;
}
.staff-back-btn a:hover {
	background: #8a6a1f;
	border-color: #8a6a1f;
}
@media (max-width: 900px) {
	.staff-detail-page #contents {padding-top: 80px;}
	.staff-detail-hero {padding: 2rem 1.25rem 3rem;}
	.dark-section {padding: 3rem 1.25rem 4rem;}
	.detail-hero-grid,
	.image-block,
	.image-block.left-image,
	.image-block.right-image {
		grid-template-columns: 1fr;
		gap: 1.5rem;
	}
	.hero-photo {
		max-width: 360px;
		margin: 0 auto;
	}
	.portrait-small img,
	.swing-tall img {
		max-width: 280px;
		margin: 0 auto;
	}
}
@media (max-width: 700px) {
	.staff-detail-page #contents {padding-top: 0;}
	.hero-copy h2 span {font-size: 1rem;}
	.detail-block h3 {font-size: 1.25rem;}
	.detail-block p {font-size: .95rem;}
}




/* mori detail image balance adjustments */
.image-block.right-image {
	grid-template-columns: minmax(0, 1fr) 180px;
}
.image-block.left-image {
	grid-template-columns: minmax(0, 1fr) 210px;
}
.image-block .detail-image-area {
	margin-top: 5.2rem;
	align-self: start;
}
.portrait-small img {
	max-width: 180px;
	margin-left: auto;
}
.swing-tall img {
	max-width: 210px;
	margin-left: auto;
}
@media (max-width: 900px) {
	.image-block .detail-image-area {
		margin-top: 0;
	}
	.image-block.right-image,
	.image-block.left-image {
		grid-template-columns: 1fr;
	}
	.portrait-small img,
	.swing-tall img {
		max-width: 240px;
		margin: 0 auto;
	}
}


/* mori detail heading band fix */
.image-block h3 {
	grid-column: 1 / -1;
	margin-bottom: .5rem;
}
.image-block .detail-text-area {
	grid-column: 1;
}
.image-block .detail-image-area {
	grid-column: 2;
}
@media (max-width: 900px) {
	.image-block h3,
	.image-block .detail-text-area,
	.image-block .detail-image-area {
		grid-column: auto;
	}
}


/* mori detail float wrap layout */
.wrap-block .wrap-text {
	overflow: hidden;
}
.wrap-block .wrap-text p {
	margin: 0 0 1em;
}
.wrap-block .wrap-text p:last-child {
	margin-bottom: 0;
}
.wrap-block .float-photo {
	float: right;
	margin: 0 0 1rem 2rem;
}
.wrap-block .float-photo img {
	display: block;
	width: 100%;
	height: auto;
	background: #fff;
}
.wrap-block .float-photo.portrait-small {
	width: 180px;
}
.wrap-block .float-photo.swing-tall {
	width: 210px;
}
/* 無効化: 以前のグリッド配置 */
.image-block .detail-image-area {
	margin-top: 0 !important;
}
@media (max-width: 900px) {
	.wrap-block .float-photo {
		float: none;
		margin: 0 auto 1rem;
	}
	.wrap-block .float-photo.portrait-small,
	.wrap-block .float-photo.swing-tall {
		width: min(100%, 240px);
	}
}


/* スタッフ詳細ページ：CTAとフッター間の余白を除去 */
body.staff-detail-page #contents,
body.staff-detail-page main {
	margin-bottom: 0 !important;
	padding-bottom: 0 !important;
}
body.staff-detail-page section#contact {
	margin-bottom: 0 !important;
}
body.staff-detail-page footer {
	margin-top: 0 !important;
}


/* Event & News pages */
.news-page #contents,.news-detail-page #contents{padding-top:100px}
.news-page-head{margin:0;padding:clamp(4rem,8vw,7rem) var(--content-space-l);text-align:center;background:#fff;color:#111}
.news-eyebrow,.related-news-head>p{margin:0 0 .65rem;color:#b38c43;font-size:.78rem;font-weight:700;letter-spacing:.2em}
.news-page-head h1{margin:0 0 1rem;font-size:clamp(2.3rem,5vw,4rem);font-weight:500;letter-spacing:.08em}
.news-page-head>p:last-child{max-width:760px;margin:0 auto;color:#666;line-height:2}
.news-list-section{margin:0;padding:clamp(3rem,6vw,6rem) var(--content-space-l);background:#f4f2ee;color:#111}
.news-important{max-width:1180px;margin:0 auto 2rem;display:grid;grid-template-columns:230px 1fr;background:#111;color:#fff}
.news-important>div{padding:1.25rem 1.5rem;border-right:1px solid #333;display:flex;flex-direction:column;justify-content:center}
.news-important>div span{color:#c6a15b;font-size:.75rem;font-weight:700;letter-spacing:.16em}.news-important time{font-size:.85rem;color:#aaa}
.news-important>a{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.25rem 1.75rem;text-decoration:none}.news-important>a b{color:#c6a15b;font-size:1.3rem}
.news-filter{max-width:1180px;margin:0 auto 2.25rem;display:flex;flex-wrap:wrap;gap:.7rem;justify-content:center}
.news-filter a{min-width:130px;padding:.65rem 1.1rem;border:1px solid #cfc9be;background:#fff;text-align:center;text-decoration:none;color:#333}
.news-filter a.is-active,.news-filter a:hover{background:#b89a5b;border-color:#b89a5b;color:#111}
.news-card-grid{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2rem}
.news-card{background:#fff;border:1px solid #e0ddd6;box-shadow:0 12px 28px rgba(0,0,0,.07)}.news-card>a{display:flex;flex-direction:column;height:100%;text-decoration:none;color:#111}
.news-card-image{aspect-ratio:16/10;overflow:hidden;background:#ddd}.news-card-image img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}.news-card:hover img{transform:scale(1.035)}
.news-card-body{display:flex;flex-direction:column;flex:1;padding:1.3rem 1.25rem 1.4rem}.news-card-meta{display:flex;align-items:center;gap:.8rem;margin-bottom:.9rem}.news-category{display:inline-block;padding:.2rem .65rem;background:#111;color:#fff;font-size:.72rem;letter-spacing:.08em}.news-card-meta time{font-size:.82rem;color:#777}
.news-card h3{margin:0 0 .65rem;font-size:1.25rem;line-height:1.5}.news-card p{margin:0 0 1rem;color:#666;line-height:1.8;font-size:.9rem}.news-more{margin-top:auto;color:#8a6a1f;font-size:.86rem;font-weight:700}.news-more b{margin-left:.35rem}
.news-pagination{display:flex;justify-content:center;align-items:center;gap:.6rem;margin-top:3rem}.news-pagination a,.news-pagination span{display:grid;place-items:center;min-width:42px;height:42px;border:1px solid #ccc;background:#fff;text-decoration:none}.news-pagination .is-current{background:#111;color:#fff;border-color:#111}.news-pagination .next{padding:0 1rem}
.news-article{background:#fff;color:#111;padding-top:3rem}.news-breadcrumb,.news-article-header,.news-main-visual,.news-article-body,.related-news,.news-back-link{max-width:920px;margin-left:auto;margin-right:auto}.news-breadcrumb{padding:0 1.5rem;margin-bottom:2rem;color:#777;font-size:.86rem}.news-breadcrumb a{text-decoration:none}.news-breadcrumb span{margin:0 .5rem}
.news-article-header{padding:0 1.5rem 2rem}.news-article-header h1{margin:.8rem 0 1rem;font-size:clamp(2.2rem,5vw,4rem);font-weight:500;line-height:1.35;letter-spacing:.06em}.news-article-header>p{margin:0;color:#666;font-size:1.05rem;line-height:2}
.news-main-visual{padding:0 1.5rem}.news-main-visual img{display:block;width:100%;aspect-ratio:16/8.5;object-fit:cover}
.news-article-body{padding:clamp(2.5rem,5vw,4.5rem) 1.5rem;max-width:820px}.news-article-body>p{margin:0 0 1.4rem;line-height:2.2;font-size:1rem}.event-summary-box{margin:3rem 0;padding:2rem;background:#f3f0e9;border-top:3px solid #b89a5b}.event-summary-box h2{margin:0 0 1.2rem;font-size:1.5rem}.event-summary-box dl{margin:0}.event-summary-box dl>div{display:grid;grid-template-columns:110px 1fr;padding:.85rem 0;border-bottom:1px solid #d8d2c6}.event-summary-box dt{font-weight:700}.event-summary-box dd{margin:0}
.event-apply-box{margin:3rem 0;padding:2.4rem;text-align:center;background:#0b0b0b;color:#fff}.event-apply-label{margin:0 0 .4rem!important;color:#c6a15b;font-size:.75rem!important;letter-spacing:.2em}.event-apply-box h2{margin:0 0 .8rem;color:#fff}.event-apply-box>p{margin:0 0 1.2rem!important;line-height:1.9!important}.event-apply-box>a{display:inline-block;padding:.75rem 2rem;background:#b89a5b;color:#111;text-decoration:none;font-weight:700}.event-phone{margin-top:1rem!important}.event-phone a{color:#fff;font-size:1.4rem}.news-author{text-align:right;color:#777;font-size:.85rem!important}
.related-news{padding:3rem 1.5rem 4rem;border-top:1px solid #ddd}.related-news-head{text-align:center;margin-bottom:2rem}.related-news-head h2{margin:0;font-size:2rem}.related-news-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.4rem}.related-news-card a{text-decoration:none;color:#111}.related-news-card div{aspect-ratio:16/10;overflow:hidden;background:#ddd}.related-news-card img{width:100%;height:100%;object-fit:cover}.related-news-card span{display:block;margin-top:.8rem;color:#9a7532;font-size:.75rem}.related-news-card h3{margin:.25rem 0;font-size:1rem;line-height:1.5}.related-news-card time{font-size:.78rem;color:#777}.news-back-link{padding:0 1.5rem 4rem;text-align:center}.news-back-link a{display:inline-block;padding:.8rem 1.4rem;border:1px solid #222;text-decoration:none}
.news-page section#contact,.news-detail-page section#contact{margin-bottom:0}.news-page main,.news-detail-page main,.news-page #contents,.news-detail-page #contents{margin-bottom:0;padding-bottom:0}.news-page footer,.news-detail-page footer{margin-top:0}
@media(max-width:900px){.news-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.related-news-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.news-important{grid-template-columns:1fr}.news-important>div{border-right:0;border-bottom:1px solid #333}.news-page #contents,.news-detail-page #contents{padding-top:80px}}
@media(max-width:700px){.news-page #contents,.news-detail-page #contents{padding-top:0}.news-card-grid,.related-news-grid{grid-template-columns:1fr}.news-filter a{min-width:calc(50% - .4rem)}.event-summary-box dl>div{grid-template-columns:1fr;gap:.25rem}.news-main-visual img{aspect-ratio:4/3}.news-important>a{align-items:flex-start}.news-page-head{padding-left:1.25rem;padding-right:1.25rem}.news-list-section{padding-left:1.25rem;padding-right:1.25rem}}


/* news archive navigation final */
.news-filter a{display:inline-flex;align-items:center;justify-content:center;min-width:120px;border:1px solid #c6a15b;background:#fff;color:#222;padding:.75rem 1.4rem;text-decoration:none;font-weight:700;letter-spacing:.05em;transition:background .25s,color .25s,transform .25s}
.news-filter a:hover{transform:translateY(-2px)}
.news-filter a.is-active{background:#c6a15b;color:#111}
.news-pagination{display:flex;justify-content:center;align-items:center;gap:.5rem;margin-top:3rem}
.news-pagination a,.news-pagination span{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;padding:0 .8rem;border:1px solid #d9d3c7;text-decoration:none;background:#fff;color:#222;transition:background .2s,color .2s,border-color .2s}
.news-pagination a:hover,.news-pagination .is-current{background:#111;color:#fff;border-color:#111}
.news-pagination .prev,.news-pagination .next{min-width:auto}
.news-card{animation:newsCardIn .45s ease both}
.news-card:nth-child(2){animation-delay:.05s}.news-card:nth-child(3){animation-delay:.1s}.news-card:nth-child(4){animation-delay:.15s}.news-card:nth-child(5){animation-delay:.2s}.news-card:nth-child(6){animation-delay:.25s}
@keyframes newsCardIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@media(max-width:600px){.news-filter{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}.news-filter a{min-width:0;width:100%;padding:.7rem .5rem}.news-pagination{flex-wrap:wrap}}


/* イベント＆ニュース：カードのカテゴリ名を明瞭に表示 */
.news-card .news-category,
.news-article .news-category {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	min-height: 26px;
	padding: .25rem .75rem !important;
	background: #111 !important;
	border: 1px solid #b79a61 !important;
	color: #fff !important;
	font-size: .72rem !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
	letter-spacing: .08em;
	white-space: nowrap;
	opacity: 1 !important;
	text-shadow: none !important;
}
.news-card a .news-category,
.news-card a:visited .news-category {
	color: #fff !important;
}


/* トップページ新着情報：カテゴリ名の視認性を改善 */
.tgs-site .latest-news-list .news-category {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 5.5em;
	padding: .22rem .65rem;
	background: #080808 !important;
	border: 1px solid #b79a61 !important;
	color: #fff !important;
	font-size: .78rem;
	line-height: 1.4;
	font-weight: 700;
	letter-spacing: .05em;
}


/* イベント＆ニュース詳細：記事本文のみ */
.news-detail-page .news-article-simple{min-height:60vh;padding-bottom:4rem}
.news-detail-page .news-article-simple .news-article-header{max-width:920px;border-bottom:1px solid #ddd}
.news-detail-page .news-article-simple .news-article-body{max-width:920px;padding-top:2.5rem;padding-bottom:2.5rem}
.news-detail-page .news-article-simple .news-article-body p{color:#222}
.news-detail-page .news-article-simple .news-author{margin-top:3rem}
.news-detail-page .news-article-simple + #contact{display:none}

/* イベント＆ニュース詳細：共通headerスタイルとの競合防止 */
.news-detail-page .news-article-header {
	position: static !important;
	display: block !important;
	width: auto !important;
	height: auto !important;
	background: transparent !important;
	box-shadow: none !important;
	transform: none !important;
	z-index: auto !important;
}
.news-detail-page .news-article-header .news-card-meta {
	position: static !important;
}

/* Staff profile link decoration */
.staff-grid-template .text .staff-desc {
	gap: .7rem;
	padding-top: 1rem;
	border-top: 0;
	font-family: "Times New Roman", "Yu Mincho", "Hiragino Mincho ProN", serif;
	font-size: .92rem;
	font-weight: 600;
	letter-spacing: .12em;
	color: #1b1b1b;
}
.staff-grid-template .text .staff-desc::after {
	content: "→";
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border: 1px solid #b8954f;
	border-radius: 50%;
	color: #8a6a1f;
	font-family: sans-serif;
	font-size: .9rem;
	line-height: 1;
	transition: transform .25s ease, background-color .25s ease, color .25s ease;
}


/* スタッフ一覧：ページ見出し */
.staff-page-head {
	padding: clamp(5rem, 9vw, 8rem) var(--content-space-l) clamp(3.5rem, 6vw, 5.5rem);
	text-align: center;
	background: #fff;
	color: #111;
}
.staff-page-label {
	margin: 0 0 .6rem;
	color: #c6a15b;
	font-size: .8rem;
	font-weight: 700;
	letter-spacing: .2em;
}
.staff-page-head h2 {
	margin: 0 0 1rem;
	font-size: clamp(2.2rem, 5vw, 4rem);
	letter-spacing: .08em;
	color: #111;
}
.staff-page-head > p:last-child {
	max-width: 720px;
	margin: 0 auto;
	line-height: 2;
	letter-spacing: .06em;
	color: #555;
}
.staff-page .staff-grid-section {
	padding-top: 0;
	padding-bottom: 4rem;
}

/* 各下層ページ：ページ見出しの高さを統一 */
.price-hero-section,
.facility-page-head,
.staff-page-head,
.news-page-head {
  box-sizing: border-box;
  min-height: 390px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.price-hero-section .price-hero-inner {
  width: min(100%, 1040px);
}

/* 森守洋メッセージページも同じ見出し高に揃える */
.message-page-section {
  padding-top: 0;
}
.morimori-page-head {
  box-sizing: border-box;
  min-height: 390px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-bottom: 2.5rem;
}

@media screen and (max-width: 700px) {
  .price-hero-section,
  .facility-page-head,
  .staff-page-head,
  .news-page-head,
  .morimori-page-head {
    min-height: 300px;
  }
}

/* スタッフ・イベント＆ニュース：見出し内の文字位置を他ページと統一 */
.staff-page-head,
.news-page-head {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  justify-content: center;
}
.staff-page-head .staff-page-label,
.news-page-head .news-eyebrow {
  margin-top: 0;
}

/* ご利用案内・施設案内：見出し位置をスタッフ・ニュースと統一 */
.price-hero-section,
.facility-page-head {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  justify-content: center;
}
.price-hero-section .price-hero-inner {
  margin-top: 0;
  margin-bottom: 0;
}
.price-hero-section .eyebrow,
.facility-page-head .facility-page-label {
  margin-top: 0;
}

/* ご利用案内・施設案内：見出しの視覚位置を下へ調整 */
.price-hero-section .price-hero-inner,
.facility-page-head > * {
  transform: translateY(30px);
}

@media screen and (max-width: 700px) {
  .price-hero-section .price-hero-inner,
  .facility-page-head > * {
    transform: translateY(18px);
  }
}


/* ご利用案内：ページ見出し説明文 */
.charge-page .price-hero-section .lead {
  max-width: 760px;
  margin: 1.4rem auto 0;
  padding: 0 20px;
  font-size: 1rem;
  line-height: 1.9;
  letter-spacing: .04em;
  text-align: center;
}
@media screen and (max-width: 700px) {
  .charge-page .price-hero-section .lead {
    margin-top: 1rem;
    font-size: .9rem;
    line-height: 1.8;
  }
}

/* ご利用案内：PCでは説明文を1行表示 */
@media screen and (min-width: 701px) {
  .charge-page .price-hero-section .lead {
    width: max-content;
    max-width: none;
    padding-left: 0;
    padding-right: 0;
    white-space: nowrap;
  }
}

/* 下層4ページ：見出しエリアの高さ・配置を完全統一 */
.price-hero-section,
.facility-page-head,
.staff-page-head,
.news-page-head {
  box-sizing: border-box !important;
  width: 100% !important;
  height: 310px !important;
  min-height: 310px !important;
  margin: 0 !important;
  padding: 0 var(--content-space-l) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  background: #fff !important;
}
.price-hero-section .price-hero-inner {
  width: 100% !important;
  max-width: 1040px !important;
  margin: 0 auto !important;
  transform: none !important;
}
.facility-page-head > *,
.staff-page-head > *,
.news-page-head > * {
  transform: none !important;
}

/* スタッフ：見出しと一覧を明確に分離 */
.staff-page .staff-grid-section {
  margin: 0 !important;
  padding: 64px var(--content-space-l) 72px !important;
  background: #f6f4ef !important;
  border-top: 1px solid #e9e4d8;
}
.staff-page .staff-grid-section .staff-grid-template {
  margin-top: 0 !important;
}

@media screen and (max-width: 700px) {
  .price-hero-section,
  .facility-page-head,
  .staff-page-head,
  .news-page-head {
    height: 270px !important;
    min-height: 270px !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  .staff-page .staff-grid-section {
    padding: 40px 20px 52px !important;
  }
}

/* ご利用案内・施設案内：固定ヘッダーと見出しの重なりを解消 */
.charge-page #contents,
.facility-page #contents {
  padding-top: 100px !important;
}

.charge-page main > section:first-child,
.facility-page main > section:first-child {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

@media screen and (max-width: 700px) {
  .charge-page #contents,
  .facility-page #contents {
    padding-top: 0 !important;
  }
}


/* フッター：電話番号・メールアドレスのリンクを明示 */
.footer-contact-info a {
  text-decoration: underline !important;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
.footer-contact-info a:hover {
  opacity: .75;
}

/* イベント＆ニュース：CTAとフッターの余白を他ページと統一 */
body.news-page section#contact,
body.news-detail-page section#contact {
  margin-bottom: 0 !important;
}
body.news-page #contents,
body.news-page main,
body.news-detail-page #contents,
body.news-detail-page main {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}
body.news-page footer,
body.news-detail-page footer {
  margin-top: 0 !important;
}

/* トップページ新着情報：スマホでも見出しを1行表示 */
@media screen and (max-width: 700px) {
  .home-news-section #home-news-title {
    white-space: nowrap;
    word-break: keep-all;
  }
}

/* トップページ新着情報：スマホでは各記事タイトルを1行表示 */
@media screen and (max-width: 700px) {
  .home-news-section .latest-news-list .news-title {
    display: block;
    min-width: 0;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: keep-all;
  }
}

/* トップページ新着情報：スマホの記事タイトルを一覧幅いっぱいに使用 */
@media screen and (max-width: 700px) {
  .home-news-section .latest-news-list a {
    width: 100%;
    grid-template-columns: auto 1fr;
    grid-template-areas:
      "date category"
      "title title";
    column-gap: 1rem;
    row-gap: .65rem;
  }
  .home-news-section .latest-news-list time {
    grid-area: date;
    justify-self: start;
  }
  .home-news-section .latest-news-list .news-category {
    grid-area: category;
    justify-self: start;
  }
  .home-news-section .latest-news-list .news-title {
    grid-area: title;
    width: 100%;
    max-width: none;
    justify-self: stretch;
  }
}

/* スマホ：レッスン特徴カードの不自然な改行を解消 */
@media screen and (max-width: 700px) {
  .list2 .inner {
    display: grid;
    grid-template-columns: 1fr;
    gap: .75rem;
  }
  .list2 .inner > div {
    min-height: 76px;
    padding: .9rem 1.1rem;
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);
    align-items: center;
    gap: .85rem;
    text-align: left;
    font-size: .95rem;
    line-height: 1.75;
  }
  .list2 .inner > div i,
  .list2 .inner > div img.custom-icon {
    width: 44px;
    height: 44px;
    margin: 0;
    justify-self: center;
  }
  .list2 .inner > div i {
    display: grid;
    place-items: center;
    font-size: 2.2rem;
  }
  .list2 .inner > div span {
    display: block;
    min-width: 0;
    white-space: nowrap;
  }
}

/* スマホ：施設特徴カードの不自然な改行を解消 */
@media screen and (max-width: 700px) {
  .facility-section .image .inner {
    display: grid;
    grid-template-columns: 1fr;
    gap: .75rem;
    border-right: 0;
  }
  .facility-section .image .inner > div {
    min-height: 72px;
    padding: .9rem 1.1rem !important;
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    align-items: center;
    gap: .9rem;
    text-align: left;
    font-size: .95rem;
    line-height: 1.7;
    border: 1px solid rgba(0,0,0,.12) !important;
  }
  .facility-section .image .inner > div i {
    margin: 0;
    justify-self: center;
    font-size: 1.65rem;
  }
  .facility-section .image .inner > div span {
    display: block;
    min-width: 0;
    white-space: nowrap;
  }
}

/* PC・スマホ共通：スタジオ情報ドロップダウン */
.site-header .studio-info-menu {
  position: relative;
}
.site-header .studio-info-menu > a::after {
  content: "▾";
  display: inline-block;
  margin-left: .45em;
  font-size: .7em;
  vertical-align: .08em;
}
.site-header .studio-info-menu > ul {
  display: none;
  left: 50%;
  top: calc(100% + 8px);
  min-width: 190px;
  transform: translateX(-50%);
  padding: 8px 0;
  background: #111;
  border: 1px solid rgba(198,161,91,.45);
  box-shadow: 0 12px 28px rgba(0,0,0,.28);
}
.site-header .studio-info-menu:hover > ul,
.site-header .studio-info-menu:focus-within > ul {
  display: block;
}
.site-header .studio-info-menu > ul a {
  display: block;
  margin: 0;
  padding: .75rem 1rem;
  border-radius: 0;
  background: transparent;
  color: #fff;
  white-space: nowrap;
}
.site-header .studio-info-menu > ul a:hover,
.site-header .studio-info-menu > ul a:focus {
  background: rgba(198,161,91,.18);
  color: #fff;
}

.small-screen #menubar .studio-info-menu > a {
  position: relative;
}
.small-screen #menubar .studio-info-menu > ul a {
  margin-left: 1.25rem;
  background: rgba(255,255,255,.9);
}

/* PC：スタジオ情報ドロップダウンを選択中に閉じないよう修正 */
@media screen and (min-width: 701px) {
  .site-header .studio-info-menu {
    position: relative;
  }
  .site-header .studio-info-menu > ul {
    top: 100% !important;
    margin-top: 0 !important;
    z-index: 10000 !important;
  }
  /* 親メニューと子メニューの境界を1px重ね、カーソル切れを防止 */
  .site-header .studio-info-menu > ul::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -2px;
    height: 2px;
  }
}

/* PC：スタジオ情報は左側の開閉矢印だけを表示 */
@media screen and (min-width: 701px) {
  .site-header .studio-info-menu > a::after {
    content: none !important;
    display: none !important;
  }
}

/* ご利用案内・施設案内：固定ヘッダー直下の余分な帯を解消 */
@media screen and (min-width: 701px) {
  .charge-page #contents,
  .facility-page #contents {
    padding-top: 80px !important;
    background: #fff !important;
  }
}

/* ご利用案内：CTA直下の白い余白を削除してフッターへ接続 */
body.charge-page section#contact {
  margin-bottom: 0 !important;
}
body.charge-page #contents,
body.charge-page main {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}
body.charge-page footer {
  margin-top: 0 !important;
}

/* スタッフ詳細：一覧へ戻るボタン */

.staff-detail-page .staff-back-btn a {
  border-color: #c6a15b !important;
}
.staff-detail-page .staff-back-btn a:hover {
  background: #c6a15b !important;
  border-color: #c6a15b !important;
  color: #111 !important;
}


/* スタッフ詳細：戻るボタンを施設詳細ボタンと同じ仕様に統一 */
.staff-detail-page .staff-back-btn {
  margin: 3rem 0 0 !important;
  text-align: center !important;
}
.staff-detail-page .staff-back-btn a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 300px !important;
  padding: .8rem 2rem !important;
  box-sizing: border-box !important;
  background: #080808 !important;
  border: 1px solid #b79a61 !important;
  color: #fff !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  text-shadow: none !important;
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
  transition: background-color .25s ease, border-color .25s ease, color .25s ease !important;
  -webkit-font-smoothing: antialiased;
}
.staff-detail-page .staff-back-btn a:hover {
  background: #b79a61 !important;
  border-color: #b79a61 !important;
  color: #080808 !important;
  text-shadow: none !important;
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
}
.staff-detail-page .staff-back-btn a:hover .arrow {
  transform: translateX(6px);
}
@media screen and (max-width: 600px) {
  .staff-detail-page .staff-back-btn a {
    min-width: min(300px, 100%) !important;
  }
}

/* =========================================================
   黒背景・ゴールド枠ボタン 共通仕様
   トップ「設備・解析システム／施設を詳しく見る」に統一
   ========================================================= */
.tgs-site .btn.inverse a,
.tgs-site .facility-detail-btn a,
.tgs-site .lesson-subscription-btn a,
.tgs-site .top-link-btn a,
.tgs-site .morimori-message-btn a,
.tgs-site .staff-back-btn a,
.tgs-site .studio-list-section .studio-link a,
.tgs-site .studio-cards-grid .studio-link a,
.tgs-site .publish-link a {
  background: #080808 !important;
  border: 1px solid #b79a61 !important;
  color: #fff !important;
  text-decoration: none !important;
  text-shadow: none !important;
  opacity: 1 !important;
  filter: none !important;
  box-shadow: none !important;
  transform: none !important;
  -webkit-font-smoothing: antialiased;
  transition: background-color .25s ease, border-color .25s ease, color .25s ease !important;
}

.tgs-site .btn.inverse a:hover,
.tgs-site .btn.inverse a:focus-visible,
.tgs-site .facility-detail-btn a:hover,
.tgs-site .facility-detail-btn a:focus-visible,
.tgs-site .lesson-subscription-btn a:hover,
.tgs-site .lesson-subscription-btn a:focus-visible,
.tgs-site .top-link-btn a:hover,
.tgs-site .top-link-btn a:focus-visible,
.tgs-site .morimori-message-btn a:hover,
.tgs-site .morimori-message-btn a:focus-visible,
.tgs-site .staff-back-btn a:hover,
.tgs-site .staff-back-btn a:focus-visible,
.tgs-site .studio-list-section .studio-link a:hover,
.tgs-site .studio-list-section .studio-link a:focus-visible,
.tgs-site .studio-cards-grid .studio-link a:hover,
.tgs-site .studio-cards-grid .studio-link a:focus-visible,
.tgs-site .publish-link a:hover,
.tgs-site .publish-link a:focus-visible {
  background: #b79a61 !important;
  border-color: #b79a61 !important;
  color: #080808 !important;
  text-decoration: none !important;
  text-shadow: none !important;
  opacity: 1 !important;
  filter: none !important;
  box-shadow: none !important;
  transform: none !important;
}

.tgs-site .btn.inverse a:hover .arrow,
.tgs-site .facility-detail-btn a:hover .arrow,
.tgs-site .lesson-subscription-btn a:hover .arrow,
.tgs-site .top-link-btn a:hover .arrow,
.tgs-site .morimori-message-btn a:hover .arrow,
.tgs-site .staff-back-btn a:hover .arrow {
  transform: translateX(6px);
}

/* Fix: unify hero reservation button widths when buttons stack (tablet / smartphone) */
@media (max-width: 1024px) {
  .tgs-site .mainimg .btn-container {
    width: min(100%, 280px);
    flex-direction: column;
    align-items: stretch;
    gap: 0.55rem;
  }

  .tgs-site .mainimg .btn-container .btn {
    width: 100%;
    margin: 0;
  }

  .tgs-site .mainimg .btn-container .btn a {
    box-sizing: border-box;
    width: 100%;
    min-height: 46px;
    justify-content: center;
    padding-left: 1rem;
    padding-right: 1rem;
  }
}


/* ご利用案内：月会費表の横スクロール案内 */
.monthly-price-scroll {
	position: relative;
}
.scroll-swipe-hint {
	display: none;
}
@media screen and (max-width: 700px) {
	.monthly-price-scroll .scroll-swipe-hint {
		position: sticky;
		left: 50%;
		display: flex;
		width: max-content;
		align-items: center;
		gap: 0.55rem;
		margin: 0 auto;
		padding: 0.7rem 1rem;
		border-radius: 999px;
		background: rgba(17, 17, 17, 0.9);
		box-shadow: 0 4px 14px rgba(0, 0, 0, 0.22);
		color: #fff;
		font-size: 0.85rem;
		font-weight: 700;
		letter-spacing: 0.04em;
		pointer-events: none;
		transform: translateY(-1rem);
		transition: opacity 0.25s ease, visibility 0.25s ease;
		z-index: 2;
	}
	.monthly-price-scroll .scroll-swipe-hint__hand {
		display: inline-block;
		font-size: 1.5rem;
		line-height: 1;
		animation: monthly-table-swipe 1.4s ease-in-out infinite;
	}
	.monthly-price-scroll.is-scrolled .scroll-swipe-hint {
		opacity: 0;
		visibility: hidden;
	}
}
@keyframes monthly-table-swipe {
	0%, 100% { transform: translateX(6px); }
	50% { transform: translateX(-6px); }
}
@media (prefers-reduced-motion: reduce) {
	.monthly-price-scroll .scroll-swipe-hint__hand {
		animation: none;
	}
}

/* スマホ：ページ全体の横方向へのはみ出し・バウンドを防止 */
@media screen and (max-width: 700px) {
	html,
	body {
		width: 100%;
		max-width: 100%;
		overflow-x: hidden;
	}
}


/* 学芸大ゴルフスタジオ ロゴ */
.tgs-site .tgs-logo a img {
  width: 320px;
  max-width: 46vw;
  height: auto;
}
footer .logo img {
  width: 320px;
  max-width: 100%;
  height: auto;
}
@media (max-width: 768px) {
  .tgs-site .tgs-logo a img {
    width: 245px;
    max-width: 66vw;
  }
  footer .logo img {
    width: 260px;
  }
}
@media (max-width: 480px) {
  .tgs-site .tgs-logo a img {
    width: 215px;
    max-width: 72vw;
  }
}


/* 学芸大ゴルフスタジオ：施設紹介シンプルグリッド */
.facility-page #contents {
  padding-top: 100px !important;
}
.facility-simple-section {
  padding: 32px var(--content-space-l) 72px;
  background: #fff;
}
.facility-simple-inner {
  width: 100%;
  max-width: 1360px;
  margin: 0 auto;
}
.facility-simple-title {
  position: relative;
  margin: 0 0 28px;
  padding: 0 20px 18px;
  border-bottom: 3px solid #f2f2f2;
  color: #666;
  font-size: clamp(1.65rem, 2.2vw, 2.1rem);
  font-weight: 700;
  letter-spacing: .04em;
  text-align: left;
}
.facility-simple-title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -3px;
  width: 152px;
  height: 3px;
  background: #0b5480;
}
.facility-simple-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 34px 26px;
}
.facility-simple-card {
  min-width: 0;
  padding: 22px 22px 30px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(0,0,0,.09);
}
.facility-simple-image {
  width: 100%;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: #eee;
}
.facility-simple-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.facility-simple-card h3 {
  margin: 16px 0 0;
  color: #666;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.55;
  letter-spacing: .01em;
  text-align: left;
}
@media screen and (max-width: 900px) {
  .facility-simple-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media screen and (max-width: 700px) {
  .facility-page #contents {
    padding-top: 0 !important;
  }
  .facility-simple-section {
    padding: 32px 18px 52px;
  }
  .facility-simple-title {
    margin-bottom: 22px;
    padding-left: 12px;
  }
  .facility-simple-title::after {
    width: 120px;
  }
  .facility-simple-grid {
    grid-template-columns: 1fr;
    gap: 22px;
  }
  .facility-simple-card {
    padding: 16px 16px 22px;
  }
}

/* 東京ゴルフスタジオ：その他のスタジオ内ロゴ背景は黒 */
.tgs-site .studio-cards-grid .studio-card-tokyo .studio-logo {
  background: #000 !important;
}



/* Footer menu unified single list */
footer .menu .footer-menu-list {
    display: block;
    margin: 0;
    padding: 0;
    list-style: none;
}
footer .menu .footer-menu-list > li {
    display: block;
    width: 100%;
}

/* Equipment / analysis system: common layout for all studios */
#menu > .list1.image-full {
	display: grid;
	grid-template-columns: minmax(280px, 420px);
	justify-content: center;
	gap: 1.5rem;
}

/* 2枚 */
#menu > .list1.image-full:has(> .list:nth-child(2)) {
	grid-template-columns: repeat(2, minmax(280px, 420px));
}

/* 3枚 */
#menu > .list1.image-full:has(> .list:nth-child(3)) {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

/* 4枚以上 */
#menu > .list1.image-full:has(> .list:nth-child(4)) {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

/*
 * image-full本来の「カードのpaddingいっぱいまで画像を広げる」見え方を維持。
 * .image自体にwidthやflexを指定しない。
 */
#menu > .list1.image-full > .list .image img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	object-position: center center;
}

/* タブレット */
@media (max-width: 1000px) {
	#menu > .list1.image-full:has(> .list:nth-child(3)),
	#menu > .list1.image-full:has(> .list:nth-child(4)) {
		grid-template-columns: repeat(2, minmax(280px, 420px));
	}
}

/* スマホ */
@media (max-width: 700px) {
	#menu > .list1.image-full,
	#menu > .list1.image-full:has(> .list:nth-child(2)),
	#menu > .list1.image-full:has(> .list:nth-child(3)),
	#menu > .list1.image-full:has(> .list:nth-child(4)) {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* Campaign banner */
.campaign-banner {
	padding: clamp(1.1rem, 2vw, 1.6rem) var(--content-space-l);
	background: #fff;
}
.campaign-banner-inner {
	max-width: 1120px;
	margin: 0 auto;
	padding: clamp(1.25rem, 2.5vw, 2rem);
	border: 1px solid #d8d3ca;
	background: #f7f5f1;
	text-align: center;
	box-shadow: 0 10px 28px rgba(0, 0, 0, .06);
}
.campaign-banner-label {
	display: inline-block;
	margin: 0 0 .55rem;
	padding: .22rem .7rem;
	border: 1px solid currentColor;
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .14em;
}
.campaign-banner h2 {
	margin: 0 0 .65rem;
	font-size: clamp(1.45rem, 3vw, 2.25rem);
	line-height: 1.35;
	letter-spacing: .04em;
}
.campaign-banner-text {
	margin: 0 0 1rem;
	line-height: 1.8;
}
.campaign-banner .btn {
	margin: 0;
}
@media screen and (max-width: 600px) {
	.campaign-banner {
		padding-left: 1rem;
		padding-right: 1rem;
	}
	.campaign-banner-inner {
		padding: 1.25rem 1rem;
	}
}

/* Campaign: hero badge + CTA message */
.mainimg .hero-campaign-badge {
	position: absolute;
	z-index: 8;
	right: clamp(1rem, 3vw, 3rem);
	top: clamp(5.5rem, 11vw, 8.5rem);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-width: clamp(118px, 11vw, 154px);
	aspect-ratio: 1 / 1;
	padding: 1rem;
	border-radius: 50%;
	background: rgba(216,179,90,.96);
	color: #111;
	text-align: center;
	line-height: 1.25;
	box-shadow: 0 8px 24px rgba(0,0,0,.18);
	pointer-events: none;
}
.mainimg .hero-campaign-badge .hero-campaign-small {
	display: block;
	margin-bottom: .15rem;
	font-size: clamp(.7rem, .8vw, .82rem);
	font-weight: 700;
	letter-spacing: .06em;
}
.mainimg .hero-campaign-badge strong {
	display: block;
	font-size: clamp(1.05rem, 1.5vw, 1.4rem);
	font-weight: 800;
	letter-spacing: .03em;
}
.mainimg .hero-campaign-badge strong em {
	font-style: normal;
	font-size: 1.35em;
}
#contact .contact-campaign-text {
	display: inline-block;
	margin: 0 0 .65rem;
	padding: .35rem .8rem;
	border: 1px solid #d8b35a;
	background: #d8b35a;
	color: #111;
	font-size: clamp(.9rem, 1.4vw, 1.08rem);
	font-weight: 700;
	letter-spacing: .05em;
	line-height: 1.5;
}
@media screen and (max-width: 700px) {
	.mainimg .hero-campaign-badge {
		right: .8rem;
		top: 5.25rem;
		min-width: 96px;
		padding: .75rem;
	}
	.mainimg .hero-campaign-badge .hero-campaign-small {
		font-size: .64rem;
	}
	.mainimg .hero-campaign-badge strong {
		font-size: .92rem;
	}
}

/* Campaign text color override inside contact CTA */
.tgs-site #contact .text .contact-campaign-text {
	color: #111 !important;
	background: #d8b35a !important;
	border-color: #d8b35a !important;
	text-shadow: none !important;
}
/* お知らせ NEWアイコン */
.important-news-link .news-message {
	display: flex;
	align-items: center;
	gap: 0.65rem;
}

.important-news-link .news-new-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	padding: 0.15rem 0.45rem;
	border: 1px solid #d40000;
	color: #fff;
	font-size: 0.68rem;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0.08em;

	background-color: #d40000;}


/* Mobile text wrapping adjustment: 2026-09-17 */
@media (max-width: 700px) {
  /* Keep centered Japanese copy from leaving a single character/short fragment on the last line. */
  .studio-list-section > p.c,
  .top-link-text,
  .faq-section .small {
    text-wrap: balance;
    word-break: normal;
    line-break: strict;
  }

  .studio-list-section > p.c {
    max-width: 22em;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.9;
    letter-spacing: 0.04em;
  }

  .top-link-text {
    max-width: 24em;
    margin-left: auto;
    margin-right: auto;
    letter-spacing: 0.04em;
  }

  .faq-section .small {
    max-width: 24em;
    letter-spacing: 0.03em;
  }
}

/* Staff cards: hover effects only on devices with a real mouse pointer.
   Prevents iPhone/Android from requiring a first tap just to enter :hover. */
@media (hover: hover) and (pointer: fine) {
	.staff-grid-template .list:hover {
		transform: translateY(-4px);
		box-shadow: 0 16px 32px rgba(0,0,0,0.10);
	}

	.staff-grid-template .list:hover .image img {
		transform: scale(1.03);
	}

	.staff-grid-template .staff-card-link:hover .staff-desc {
		background: transparent;
		color: #8a6a1f;
	}

	.staff-grid-template .staff-card-link:hover .staff-desc::after {
		transform: translateX(3px);
		background: #b8954f;
		color: #fff;
	}
}