/*
Theme Name: SWELL CHILD
Template: swell
Description: 京都 竹の郷温泉 万葉の湯 オウンドメディア用の子テーマ。親テーマ（SWELL）の更新で消えないカスタマイズはここに書く。
Author: アドトラスト株式会社
Version: 1.0.0
*/

/* ==========================================================================
   本体スタイル
   出所: LEAD 提供の子テーマ style.css の本文。テーマヘッダーは現行
   （アドトラスト名義）を維持している。開発環境URLは本番URLへ置換済み。
   ========================================================================== */

/* ==========================================================================
   ととのいラボ カラーテーマ(仕様書 A案: 信頼×温かみ)
   深緑(竹・静けさ)× 生成り(湯屋の温かみ)× 橋(CTA)
   使用比率の目安: ベース 70% / メイン 25% / CTA 5%
   ========================================================================== */

:root {
  /* main: bamboo green — ヘッダー、見出し、リンク、フッター */
  --color-main: #2F5D50;
  --color-main-light: #3F7566;
  --color-main-pale: #E7EFEB;

  /* base: kinari — 背景、セクション区切り */
  --color-base: #F6F2E9;
  --color-base-dark: #EBE3D3;

  /* sub: gray green — 補助UI、罫線、タグ */
  --color-sub: #9BB3A9;
  --color-sub-pale: #DCE6E1;

  /* CTA: orange — 予約ボタン専用。他の用途への使用禁止(視認効果の維持) */
  --color-cta: #E0761F;
  --color-cta-hover: #C5651A;
  --color-cta-pale: #FDF0E4;

  /* text */
  --color-text: #2B2B2B;
  --color-text-muted: #6B6B6B;
  --color-link: #2F5D50;
  --color-white: #FFFFFF;
}

/* 予約CTAボタン(文字色は白、hoverで --color-cta-hover) */
.c-reserveBtn,
.p-reserveCta a {
  background-color: var(--color-cta);
  color: var(--color-white);
}
.c-reserveBtn:hover,
.p-reserveCta a:hover {
  background-color: var(--color-cta-hover);
  color: var(--color-white);
}

/* ==========================================================================
   追尾サイドバーの目次: カード型デザイン
   ※ 装飾(色・枠・余白)のみ。display / overflow / position は変更しないこと。
     SWELLの目次はJSで生成されるため、表示制御に手を入れると生成が壊れる
     (実際に display:none で中身が空になる不具合が発生した)。
   ========================================================================== */

.widget_swell_index {
	background: var(--color-white);
	border: 1px solid var(--color-sub-pale);
	border-radius: 12px;
	padding: 1.2em 1em;
	box-shadow: 0 2px 14px rgba(47, 93, 80, 0.07);
	/* 追従(sticky)時にヘッダーとの間に余白を作る。
	   stickyはマージン分だけ下にずれて停止するため、
	   position/top に触れずに上部の余白を広げられる。 */
	margin-top: 2em;
}

/* 見出し「目次」 */
.widget_swell_index .c-widget__title,
.widget_swell_index .widgettitle,
.widget_swell_index .widget-title,
.widget_swell_index > h2,
.widget_swell_index > h3,
.widget_swell_index > h4 {
	margin: 0 0 1.2em;
	padding: 0 0 0 .6em;
	border-bottom: none;
	border-left: 4px solid var(--color-main);
	color: var(--color-main);
	font-size: 1rem;
	letter-spacing: .04em;
}

/* SWELLのサイドバー見出しデザイン(下線タイプ)は疑似要素で描かれるため、
   border-bottom:none では消えない。疑似要素ごと非表示にする。 */
.widget_swell_index :is(.c-widget__title, .widgettitle, .widget-title, h2, h3, h4)::before,
.widget_swell_index :is(.c-widget__title, .widgettitle, .widget-title, h2, h3, h4)::after {
	display: none;
	content: none;
}

/* 追従時の最大高さを短くする(SWELL既定は約50vh)。
   サイドバー側の目次コンテナ(.widget_swell_index .p-toc)のみに適用。
   生成元の記事内目次(.p-toc.post_content)には影響しない。
   max-height と overflow をセットで指定し、超過分はコンテナ内スクロールにする。 */
.widget_swell_index .p-toc {
	max-height: 34vh !important;
	overflow-y: auto !important;
}

/* リンクの配色のみ調整。
   list-style / display / padding / border は触らないこと。
   SWELLは li 側にマーカー(•・∟)を描画しているため、
   リンクをブロック化したり枠線を足すと行頭のマーカーとずれる。 */
.widget_swell_index a {
	color: var(--color-text);
	text-decoration: none;
	transition: color .2s ease;
}

.widget_swell_index a:hover {
	color: var(--color-main);
	text-decoration: underline;
}

/* 現在読んでいる見出し(assets/js/toc-scrollspy.js が .current を付与)。
   padding や border を足すと行頭マーカーとずれるため、
   余白の見た目は box-shadow の広がりで代用している。 */
.widget_swell_index a.current,
.widget_swell_index .current > a {
	color: var(--color-main);
	font-weight: 600;
	background: var(--color-main-pale);
	border-radius: 4px;
	box-shadow: 0 0 0 4px var(--color-main-pale);
	transition: background .2s ease, box-shadow .2s ease;
}

/* 監修者 */
.w-beforeToc {
	margin-top: 2em;
}
.supervision {
	width: 100%;
	border: 1px #eee solid;
	background-color: #fff;
}
.supervision tr td {
	padding: 10px;
}
.supervision tr td:first-child {
	width: 120px !important;
	padding: 10px 0 10px 10px;
	border-right: none !important;
}
.supervision tr td:last-child {
	border-left: none !important;
}
.supervision td p:last-child {
	margin: 0;
}
.supervision p {
	font-size: .8rem !important;
	line-height: 1.4rem;
	text-align: left;
}
.supervision p.name {
	margin: 0 0 3px 0;
	border-bottom: 1px dotted #2d875f;
	font-size: .8rem;
	text-align: left;
}
.supervision p.name a {
	font-size: .8rem;
}
.supervision strong {
	margin: 0 1rem 0 0;
	display: inline-block;
	font-size: .8rem;
}
p.kansyu-title {
	font-size: .8rem;
	margin: 0 !important;
	padding: 0;
	border-bottom: 2px solid var(--cocoon-thin-color);
	text-align: left;
}
.post_content .supervision {
	margin: 0 !important;
}
.w-singleTop .p-blogParts:last-child .supervision {
	margin: 0 0 20px 0 !important;
}
.supervision .swell-block-column {
	padding: 10px;
	align-content: center;
}
.supervision .swell-block-column figure {
	width: 100%;
}
.supervision .swell-block-column:first-child {
	width: 120px;
}
.supervision .swell-block-column:last-child {
	margin-left: 0;
	flex: 1;
}
.supervision img {
  width: 100px; 
  height: 100px;
  object-fit: cover;
  border-radius: 50%;
}
@media screen and (max-width: 900px) {
	.article p.kansyu-title {
		font-size: 1rem;
		margin: 0 0 10px 0;
		padding: 0;
		border-bottom: 2px solid var(--cocoon-thin-color);
	}
	.supervision img {
		max-width: 75px;
		display: block;
		margin: 0 auto;
	}
	.supervision p {
		font-size: .7rem !important;
		line-height: 1.1rem;
	}
	.supervision .swell-block-column:first-child {
		width: 90px;
	}
	.supervision tr td:first-child {
		width: 20px;
		padding: 10px 0 10px 10px;
	}
}

/* ==========================================================================
   施設一覧セクションの背景（湯の波紋）
   見出し・カード・本文の下に敷くため、線は --color-main を opacity 8% まで
   落としてある。濃さを変えるときは下の SVG 内の opacity を触る。
   160x96 でタイルし、横方向にシームレスに繰り返す。
   ========================================================================== */
.swell-block-fullWide.is-bg-ripple {
	background-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22160%22 height=%2296%22 viewBox=%220 0 160 96%22%3E %3Cg fill=%22none%22 stroke=%22%232F5D50%22 stroke-width=%221.6%22 stroke-linecap=%22round%22 opacity=%220.08%22%3E %3Cpath d=%22M-160,14 q40,-11 80,0 t80,0 t80,0 t80,0 t80,0 t80,0%22/%3E %3Cpath d=%22M-120,38 q40,-11 80,0 t80,0 t80,0 t80,0 t80,0 t80,0%22/%3E %3Cpath d=%22M-80,62 q40,-11 80,0 t80,0 t80,0 t80,0 t80,0 t80,0%22/%3E %3Cpath d=%22M-40,86 q40,-11 80,0 t80,0 t80,0 t80,0 t80,0 t80,0%22/%3E %3C/g%3E %3C/svg%3E");
	background-repeat: repeat;
	background-size: 160px auto;
}


/* トップページ：メインビジュアルと直下のフルワイドセクションを隔間なく繋ぐ。
   SWELL は .l-content に padding-top:64px を持っているが、セクション側が
   pc-py-60 / sp-py-40 の内側余白を持つため、0 にしても見出しは窄くならない。
   親のCSSが後から出力されるため、#content を含めて優先度を上げている。 */
.home #content.l-content {
	padding-top: 0;
}

/* 波紋背景のパララックス。
   背景をビューポートに固定し、セクションだけがその上を流れるようにする。
   SWELL 標準の -parallax はアップロード画像前提の実装なので、
   CSS 埋め込みのこの背景には自前でかける。 */
.swell-block-fullWide.is-bg-ripple {
	background-attachment: fixed;
}

/* iOS Safari は background-attachment:fixed を正しく扱えず
   背景が拡大・ズレて見えるため、タッチ端末では通常スクロールに戻す。 */
@media (hover: none), (max-width: 959px) {
	.swell-block-fullWide.is-bg-ripple {
		background-attachment: scroll;
	}
}


/* ==========================================================================
   本文フォント：Zen Maru Gothic
   SWELLのフォント選択肢に無いため、変数を上書きして指定する。
   フォント本体は assets/css/fonts.css で自前配信している
   （Google Fonts へは通信しない。経緯はそのファイルの冒頭を参照）。
   親の :root が後から出力されるため、html:root で優先度を上げている。
   フォントが読み込めない環境では次の丸ゴシック→ゴシックへ順にフォールバックする。
   ========================================================================== */
html:root {
	--swl-font_family: "Zen Maru Gothic", "Hiragino Maru Gothic ProN", "Yu Gothic", "游ゴシック体", sans-serif;
}


/* ==========================================================================
   お問い合わせフォーム（Contact Form 7）
   CF7は素のままだと無装飾なので、サイトの配色と揃える。
   入力欄の幅と余白を揃え、送信ボタンはCTAカラー（橋）に揃えている。
   ========================================================================== */
.wpcf7 label {
	display: block;
	margin-bottom: 1.4em;
	font-weight: 600;
}

/* 「必須」バッジ。ラベル文字に密着しないよう余白を取る。 */
.wpcf7 .cf7-req {
	margin-left: .6em;
	padding: .15em .55em;
	border-radius: 3px;
	background: var(--color-cta);
	color: var(--color-white);
	font-size: .72rem;
	font-weight: 700;
	vertical-align: middle;
}

.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 textarea,
.wpcf7 select {
	width: 100%;
	margin-top: .5em;
	padding: .7em .8em;
	border: 1px solid var(--color-sub-pale);
	border-radius: 6px;
	background: #fff;
	font-family: inherit;
	font-size: 1rem;
}
.wpcf7 textarea { min-height: 12em; }

.wpcf7 .wpcf7-acceptance .wpcf7-list-item { margin: 0; }

.wpcf7 .wpcf7-submit {
	display: block;
	margin: 1.8em auto 0;
	padding: .9em 3em;
	border: none;
	border-radius: 40px;
	background: var(--color-cta);
	color: var(--color-white);
	font-weight: 700;
	font-family: inherit;
	cursor: pointer;
	transition: background .2s ease;
}
.wpcf7 .wpcf7-submit:hover { background: var(--color-cta-hover); }


/* ==========================================================================
   本文まわりの余白調整
   SWELL既定は h2 の上に 89.6px・下に 44.8px、段落や表の下に 32px を取っており
   1ページの縦が間延びするため、全体を詰めている。
   見出しの除外条件（swell-block-・faq_q・p-postList__title）は親の定義に合わせている。
   これを外すとカードのタイトルやFAQの質問行にまで余白が付いて崩れるので消さないこと。
   戻したいときはこのブロックごと削除すれば SWELL 既定に戻る。
   ========================================================================== */

/* ブロック間の下余白：32px → 24px */
.l-mainContent .post_content > *,
.l-mainContent .post_content .swell-block-fullWide__inner > * {
	margin-bottom: 1.5rem;
}

/* 見出しの上下。上はセクションの区切りとして残し、下は大幅に詰める。 */
.l-mainContent .post_content h2:not([class^="swell-block-"]):not(.faq_q):not(.p-postList__title) {
	margin-top: 3.5rem;
	margin-bottom: 1.5rem;
}
.l-mainContent .post_content h3:not([class^="swell-block-"]):not(.faq_q):not(.p-postList__title) {
	margin-top: 2.5rem;
	margin-bottom: 1rem;
}
.l-mainContent .post_content h4:not([class^="swell-block-"]):not(.faq_q):not(.p-postList__title) {
	margin-top: 2rem;
	margin-bottom: .8rem;
}

/* 見出し直後は見出し側の下余白だけで足りる。 */
.l-mainContent .post_content :is(h2, h3, h4) + * {
	margin-top: 0;
}

/* セクション先頭の見出しには上余白を付けない。 */
.l-mainContent .post_content > :first-child,
.l-mainContent .post_content .swell-block-fullWide__inner > :first-child {
	margin-top: 0;
}


/* ==========================================================================
   クーポン一覧（記事内の開閉ブロック）
   閉じている間は上部だけ見せて下をフェードアウトし、ボタンで全件展開する。
   JSを使わず checkbox と :checked だけで制御しているので、
   ブロックエディターに貼ったカスタムHTMLだけで動く。
   カードの並びはPC2列・SP1列。
   ========================================================================== */
.ttl-coupons { margin: 1.5rem 0 2rem; counter-reset: ttl-coupons; }
.ttl-coupons__input { position: absolute; opacity: 0; pointer-events: none; }

.ttl-coupons__body {
	position: relative;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
	max-height: 170px; /* 1列目の途中まで。この高さを超えた分はフェードで消す。 */
	overflow: hidden;
}
.ttl-coupons__input:checked ~ .ttl-coupons__body { max-height: none; }

/* 閉じている間だけ下端を白く消す。展開後は邪魔なので消す。 */
.ttl-coupons__body::after {
	content: "";
	position: absolute;
	inset: auto 0 0 0;
	height: 130px;
	background: linear-gradient(to bottom, rgba(253,252,249,0) 0%, rgba(253,252,249,.72) 42%, var(--color_bg, #FDFCF9) 100%);
	pointer-events: none;
}
.ttl-coupons__input:checked ~ .ttl-coupons__body::after { display: none; }

.ttl-coupon {
	counter-increment: ttl-coupons;
	display: flex;
	position: relative;
	overflow: hidden;
	background: #fff;
	border-radius: 6px;
	box-shadow: 0 1px 6px rgba(47, 93, 80, .12);
}
/* 右上の角を折ったような緑の三角。 */
.ttl-coupon::before {
	content: "";
	position: absolute;
	top: 0; right: 0;
	border-width: 0 34px 34px 0;
	border-style: solid;
	border-color: transparent var(--color-main) transparent transparent;
}
/* 画像は background で敷く。img要素を overflow:hidden の中で絶対配置すると
   Chromeで描画されないケースがあったため、背景方式にしている。 */
.ttl-coupon__img {
	flex: 0 0 118px;
	align-self: stretch;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	background-color: var(--color-main-pale);
}

.ttl-coupon__main { flex: 1 1 auto; padding: 10px 12px 12px; min-width: 0; }

.ttl-coupon__tags { margin: 0 0 6px !important; display: flex; gap: 4px; flex-wrap: wrap; }
.ttl-coupon__tags span {
	padding: 2px 8px;
	border-radius: 3px;
	background: var(--color-main);
	color: #fff;
	font-size: .68rem;
	line-height: 1.6;
}
.ttl-coupon__tags span[data-t="岩盤浴"] { background: #8A6B4F; }
.ttl-coupon__tags span[data-t="お食事"] { background: #B07C4A; }
.ttl-coupon__tags span[data-t="ウェルネス" ] { background: #7B5EA7; }

.ttl-coupon__title {
	margin: 0 0 6px !important;
	font-size: .88rem;
	font-weight: 700;
	line-height: 1.5;
}
.ttl-coupon__off { margin: 0 !important; text-align: center; color: #C0392B; line-height: 1.2; }
.ttl-coupon__off b { font-size: 1.55rem; font-weight: 700; }
.ttl-coupon__off span { font-size: .8rem; font-weight: 700; }

.ttl-coupon__price {
	margin: 2px 0 0 !important;
	text-align: center;
	font-size: .8rem;
	color: var(--color-text-muted, #6B6B6B);
}
.ttl-coupon__price b { margin-left: .4em; color: var(--color-text); font-size: 1rem; font-weight: 700; }

/* 開閉ボタン。ラベルの文言は :checked で入れ替える。 */
.ttl-coupons__btn {
	display: block;
	width: fit-content;
	margin: -28px auto 0;
	position: relative;
	z-index: 1;
	padding: .85em 2.6em;
	border-radius: 40px;
	background: var(--color-cta);
	color: var(--color-white);
	font-weight: 700;
	cursor: pointer;
	transition: background .2s ease;
}
.ttl-coupons__btn:hover { background: var(--color-cta-hover); }
/* 件数はカードの枚数を CSS カウンターで数える（2026-09-24）。
   以前は「（20件）」を直書きしており、掲載数が変わるたびにテーマの修正が要った。
   ブログパーツのカードを増減すれば表記も追従する。
   ボタンはカード一覧（__body）より後ろにあるため、数え終わった値が出る。 */
.ttl-coupons__btn::after { content: "万葉の湯のクーポンを見る（" counter(ttl-coupons) "件）▼"; }
.ttl-coupons__input:checked ~ .ttl-coupons__btn { margin-top: 1.2rem; }
.ttl-coupons__input:checked ~ .ttl-coupons__btn::after { content: "閉じる▲"; }

.ttl-coupons__note {
	margin: 1rem 0 0 !important;
	font-size: .78rem;
	color: var(--color-text-muted, #6B6B6B);
	line-height: 1.7;
}

@media (max-width: 767px) {
	.ttl-coupons__body { grid-template-columns: 1fr; max-height: 150px; }
	.ttl-coupon__img { flex-basis: 96px; }
}


/* ==========================================================================
   クーポンLP
   バーコードは 2 段階踏んでから表示する（現地利用の注意を必ず読ませるため）。
   JSなしで動くよう checkbox 2 枚と :checked で制御している。
   表示回数の計測をする場合は #ttl-cp-step2 の change を拾う。
   ========================================================================== */
.ttl-lp-hero {
	margin: 0 0 1.5rem;
	padding: 28px 20px 24px;
	border-radius: 8px;
	background: linear-gradient(135deg, #B3141C 0%, #8E0F16 100%);
	color: #fff;
	text-align: center;
}
.ttl-lp-hero__label {
	display: inline-block;
	margin: 0 0 14px !important;
	padding: .5em 1.4em;
	border-radius: 4px;
	background: #fff;
	color: #B3141C;
	font-size: 1.15rem;
	font-weight: 700;
}
.ttl-lp-hero__old { margin: 0 !important; font-size: .95rem; text-decoration: line-through; opacity: .85; }
.ttl-lp-hero__new { margin: 2px 0 0 !important; line-height: 1.1; }
.ttl-lp-hero__new b { color: #FFE04B; font-size: 3rem; font-weight: 700; letter-spacing: .01em; }
.ttl-lp-hero__new span { font-size: 1rem; font-weight: 700; }
.ttl-lp-hero__note { margin: 10px 0 0 !important; font-size: .82rem; opacity: .9; }

/* 利用条件の箇条書き */
.ttl-lp-cond {
	margin: 0 0 1.5rem !important;
	padding: 1.1em 1.3em;
	border: 1px solid var(--color-sub-pale);
	border-radius: 8px;
	background: #fff;
	list-style: none;
}
.ttl-lp-cond li { margin: 0 0 .5em; padding-left: 1.4em; position: relative; font-size: .92rem; }
.ttl-lp-cond li:last-child { margin-bottom: 0; }
.ttl-lp-cond li::before { content: "◆"; position: absolute; left: 0; color: var(--color-main); font-size: .8em; }

/* ── クーポン表示の2段階ゲート ── */
.ttl-cpn { margin: 2rem 0; text-align: center; }
.ttl-cpn input { position: absolute; opacity: 0; pointer-events: none; }
.ttl-cpn__btn {
	display: inline-block;
	padding: 1em 2.4em;
	border-radius: 40px;
	background: var(--color-cta);
	color: var(--color-white);
	font-weight: 700;
	cursor: pointer;
	transition: background .2s ease;
}
.ttl-cpn__btn:hover { background: var(--color-cta-hover); }
.ttl-cpn__warn, .ttl-cpn__code { display: none; }
.ttl-cpn__s1:checked ~ .ttl-cpn__btn1 { display: none; }
.ttl-cpn__s1:checked ~ .ttl-cpn__warn { display: block; }
.ttl-cpn__s2:checked ~ .ttl-cpn__warn { display: none; }
.ttl-cpn__s2:checked ~ .ttl-cpn__code { display: block; }

.ttl-cpn__warn {
	padding: 1.4em 1.3em;
	border: 2px solid #C0392B;
	border-radius: 8px;
	background: #FFF6F5;
	text-align: left;
}
.ttl-cpn__warn p { margin: 0 0 1em !important; color: #A5281B; font-weight: 700; line-height: 1.9; }
.ttl-cpn__warn .ttl-cpn__btn { display: block; width: fit-content; margin: 0 auto; }

.ttl-cpn__code img {
	display: block;
	width: 100%;
	max-width: 460px;
	margin: 0 auto;
	padding: 18px;
	border: 1px solid var(--color-sub-pale);
	border-radius: 8px;
	background: #fff;
}
.ttl-cpn__shot {
	max-width: 460px;
	margin: 14px auto 0 !important;
	padding: .9em 1.1em;
	border: 2px solid #C0392B;
	border-radius: 40px;
	color: #C0392B;
	font-size: .88rem;
	font-weight: 700;
	line-height: 1.7;
}

/* LPへリンクするカード。カード自体を a にしているので文字色と下線を戻す。 */
.ttl-coupon--link {
	color: inherit;
	text-decoration: none;
	transition: transform .15s ease, box-shadow .15s ease;
}
.ttl-coupon--link:hover {
	transform: translateY(-2px);
	box-shadow: 0 4px 14px rgba(47, 93, 80, .2);
}


/* ==========================================================================
   クーポンLP（SWELLのLP投稿タイプで使う）
   万葉の湯公式のクーポンLP（/kyoto/web-ann/）の配色に合わせている。
   赤 #B71716 ／ 緑見出し #3B7A5B ／ クリームのマーカー #F6EBD2 ／ 黄 #FDEE00
   ========================================================================== */
.mycp { --red:#B71716; --grn:#3B7A5B; --cream:#F6EBD2; --beige:#F1EAE3; --yel:#FDEE00;
	margin:0 auto; max-width:760px; background:#fff; }
.mycp * { box-sizing:border-box; }
.mycp p { margin:0 0 1em; line-height:1.9; }

/* ── ヒーロー ── */
.mycp-hero {
	padding:34px 22px 30px; text-align:center; color:#fff;
	background:repeating-linear-gradient(-45deg,#B71716 0 22px,#AD1414 22px 44px);
}
.mycp-hero__brand { margin:0 0 16px !important; font-size:.9rem; letter-spacing:.18em; opacity:.95; }
.mycp-hero__ttl {
	display:inline-block; margin:0 0 20px !important; padding:.5em 1.3em;
	border-radius:6px; background:#fff; color:var(--red);
	font-size:1.4rem; font-weight:700; line-height:1.4;
}
.mycp-hero__old { margin:0 !important; font-size:.95rem; }
.mycp-hero__old b { text-decoration:line-through; }
.mycp-hero__arrow { margin:6px 0 !important; font-size:1.2rem; }
.mycp-hero__badge {
	display:inline-block; margin:0 0 6px !important; padding:.35em 1em;
	border:2px solid var(--yel); border-radius:4px; color:var(--yel);
	font-size:.82rem; font-weight:700;
}
.mycp-hero__new { margin:0 !important; line-height:1; }
.mycp-hero__new b { color:var(--yel); font-size:4rem; font-weight:700; }
.mycp-hero__new span { font-size:1.1rem; font-weight:700; }
.mycp-hero__lead { margin:18px 0 0 !important; font-size:1rem; font-weight:700; }

/* ── セクション ── */
.mycp-sec { padding:38px 22px; }
.mycp-sec--beige { background:var(--beige); }
.mycp-h2 {
	margin:0 0 20px !important; text-align:center;
	font-size:1.35rem; font-weight:700; line-height:1.7; color:var(--grn);
}
.mycp-h2 span {
	background:linear-gradient(transparent 58%, var(--cream) 58%);
	padding:0 .2em;
}
.mycp-label {
	display:block; width:fit-content; margin:0 auto 10px !important;
	padding:.35em 1.2em; border:1px solid var(--grn); border-radius:2px;
	color:var(--grn); font-size:.9rem; font-weight:700;
}
.mycp-photo { margin:0 0 16px !important; }
.mycp-photo img { width:100%; border-radius:8px; display:block; }

/* ── 利用条件 ── */
.mycp-cond { margin:0; padding:1.2em 1.4em; list-style:none; background:#fff; border:2px solid var(--cream); border-radius:8px; }
.mycp-cond li { margin:0 0 .6em; padding-left:1.5em; position:relative; font-size:.95rem; line-height:1.7; }
.mycp-cond li:last-child { margin-bottom:0; }
.mycp-cond li::before { content:"◆"; position:absolute; left:0; color:var(--grn); font-size:.75em; top:.35em; }

/* ── CTA ── */
.mycp-cta { padding:34px 22px; text-align:center; background:var(--cream); }
.mycp-btn {
	display:inline-block; padding:1.1em 2.6em; border:none; border-radius:60px;
	background:var(--red); color:#fff; font-size:1.05rem; font-weight:700;
	font-family:inherit; cursor:pointer; box-shadow:0 4px 0 #8E1011;
	transition:transform .12s ease, box-shadow .12s ease;
}
.mycp-btn:active { transform:translateY(3px); box-shadow:0 1px 0 #8E1011; }
.mycp-warn {
	display:none; max-width:560px; margin:0 auto; padding:1.4em 1.3em;
	border:2px solid var(--red); border-radius:8px; background:#fff; text-align:left;
}
.mycp-warn.is-open { display:block; }
.mycp-warn p { color:var(--red); font-weight:700; line-height:1.9; }
.mycp-note { margin:14px 0 0 !important; font-size:.82rem; color:#6B6B6B; }

/* ── 注意書き・フッター ── */
.mycp-fine { font-size:.8rem; color:#666; line-height:1.9; }
.mycp-foot { padding:30px 22px 36px; text-align:center; background:var(--grn); color:#fff; }
.mycp-foot p { margin:0 0 .5em; font-size:.88rem; }
.mycp-foot a.mycp-foot__btn {
	display:inline-block; margin-bottom:16px; padding:.8em 2em;
	border:1px solid #fff; border-radius:4px; color:#fff; text-decoration:none; font-size:.9rem;
}

/* ── モーダル ── */
.mycp-modal { display:none; position:fixed; inset:0; z-index:99999; }
.mycp-modal.is-open { display:block; }
.mycp-modal__ov { position:absolute; inset:0; background:rgba(0,0,0,.6); }
.mycp-modal__box {
	position:relative; z-index:1; width:calc(100% - 32px); max-width:520px;
	margin:6vh auto 0; max-height:88vh; overflow:auto;
	padding:26px 22px; border-radius:12px; background:#fff; text-align:center;
}
.mycp-modal__close {
	position:absolute; top:8px; right:10px; width:36px; height:36px;
	border:none; background:none; color:#888; font-size:1.6rem; cursor:pointer; line-height:1;
}
.mycp-modal__ttl { margin:0 0 4px !important; font-size:1rem; font-weight:700; line-height:1.6; }
.mycp-modal__price { margin:0 0 14px !important; font-size:.9rem; color:#666; }
.mycp-modal__price b { color:var(--grn); font-size:1.4rem; }
.mycp-timer {
	display:inline-block; margin:0 0 14px !important; padding:.45em 1.3em;
	border-radius:40px; background:var(--red); color:#fff; font-weight:700; font-size:1rem;
	font-variant-numeric:tabular-nums;
}
.mycp-modal__code img { width:100%; max-width:420px; display:block; margin:0 auto; }
.mycp-shot {
	margin:14px auto 0 !important; padding:.8em 1em; max-width:420px;
	border:2px solid var(--red); border-radius:40px; color:var(--red);
	font-size:.85rem; font-weight:700; line-height:1.7;
}
.mycp-expired { display:none; padding:2em 1em; }
.mycp-expired p { color:var(--red); font-weight:700; }
.mycp-modal.is-expired .mycp-modal__code, .mycp-modal.is-expired .mycp-timer, .mycp-modal.is-expired .mycp-shot { display:none; }
.mycp-modal.is-expired .mycp-expired { display:block; }

@media (max-width:600px){
	.mycp-hero__new b { font-size:3rem; }
	.mycp-hero__ttl { font-size:1.15rem; }
	.mycp-h2 { font-size:1.15rem; }
}

/* LP内の見出しはSWELLの装飾（左の縦バー等）を外し、LP専用の見た目に戻す。 */
.mycp h2.mycp-h2,
.mycp h2.mycp-h2::before,
.mycp h2.mycp-h2::after {
	padding: 0;
	border: none;
	background: none;
	content: none;
	display: revert;
}
.mycp h2.mycp-h2::before, .mycp h2.mycp-h2::after { display: none; }
.mycp h2.mycp-h2 {
	margin: 0 0 20px;
	text-align: center;
	font-size: 1.35rem;
	color: var(--grn);
}
.mycp h2.mycp-h2 span {
	background: linear-gradient(transparent 58%, var(--cream) 58%);
	padding: 0 .2em;
}
/* LPは本文幅の上下余白もリセット */
.mycp p, .mycp ul, .mycp section { margin-top: 0; }

/* 正方形のクーポン写真は大きすぎるので上限を入れる。 */
.mycp-photo--sq img { max-width: 400px; margin: 0 auto; }

/* ヒーロー内のCTA。読み込み直後の画面にボタンが入るよう、
   ヒーローの余白と文字サイズを詰めて高さを抑えている。 */
.mycp-hero { padding: 26px 22px 24px; }
.mycp-hero__ttl { margin-bottom: 14px !important; }
.mycp-hero__new b { font-size: 3.4rem; }
.mycp-hero__lead { margin: 14px 0 0 !important; font-size: .95rem; }
.mycp-hero__cta { margin-top: 16px; }
.mycp-hero__cta .mycp-btn { background: #fff; color: var(--red); box-shadow: 0 4px 0 rgba(0,0,0,.25); }
.mycp-hero__cta .mycp-warn { margin-top: 14px; }
.mycp-hero__cta .mycp-warn .mycp-btn { background: var(--red); color: #fff; box-shadow: 0 4px 0 #8E1011; }
.mycp-hero__ctanote { margin: 10px 0 0 !important; font-size: .78rem; opacity: .85; }

@media (max-width: 600px) {
	.mycp-hero { padding: 20px 18px 20px; }
	.mycp-hero__brand { margin-bottom: 10px !important; font-size: .8rem; }
	.mycp-hero__ttl { font-size: 1.05rem; margin-bottom: 10px !important; }
	.mycp-hero__old { font-size: .82rem; }
	.mycp-hero__new b { font-size: 2.6rem; }
	.mycp-hero__lead { font-size: .85rem; margin-top: 10px !important; }
	.mycp-hero__cta { margin-top: 12px; }
	.mycp-hero__cta .mycp-btn { padding: .95em 1.8em; font-size: .98rem; }
}

/* LPは左右いっぱいに使う。SWELLのLPテンプレートは
   #lp-content に16px、.lp-content__postContent に40px の左右余白を持っており
   スマホで両端に隔しが出るため打ち消す。
   文字が端に付かないよう、余白は .mycp 側の各セクションで確保している。 */
#lp-content.lp-content { padding-left: 0; padding-right: 0; }
#lp-content .lp-content__postContent { padding-left: 0; padding-right: 0; max-width: none; }

/* ==========================================================================
   ヒーローの微調整
   ========================================================================== */

/* 2つ目のCTAの地色を、直前の「利用条件」セクションと揃える。 */
.mycp .mycp-cta { background: var(--beige); }

/* 施設名を大きく。 */
.mycp .mycp-hero__brand { font-size: 1.15rem; letter-spacing: .1em; }

/* 「学割・2名以上限定」の下の隔きを詰める。
   価格の b が .mycp p の line-height:1.9 を継承して
   54pxの文字に103pxの行ボックスが付いていたのが原因。 */
.mycp p.mycp-hero__new { line-height: 1; }
.mycp .mycp-hero__new b { line-height: 1; }
.mycp .mycp-hero__badge { margin-bottom: 4px !important; }

@media (max-width: 600px) {
	.mycp .mycp-hero__brand { font-size: .95rem; }
}

/* 利用条件とCTAは地色が同じなので、1つの面として繋がるよう上下の余白を詰める。 */
.mycp .mycp-sec--beige:has(+ .mycp-cta) { padding-bottom: 6px; }
.mycp .mycp-sec--beige + .mycp-cta { padding-top: 14px; }

/* ファーストビューに「いくら引かれるのか」を出す。
   赤地に白チップで抜いて、下の黄色の実価格と役割を分けている。 */
.mycp .mycp-hero__off {
	display: inline-block;
	margin: 0 0 8px !important;
	padding: .25em 1.2em;
	border-radius: 40px;
	background: #fff;
	color: var(--red);
	font-weight: 700;
	line-height: 1.25;
}
.mycp .mycp-hero__off b { font-size: 1.9rem; }
.mycp .mycp-hero__off span { font-size: .95rem; }
.mycp .mycp-hero__arrow { margin: 4px 0 8px !important; }

@media (max-width: 600px) {
	.mycp .mycp-hero__off b { font-size: 1.55rem; }
	.mycp .mycp-hero__off { padding: .2em 1em; }
}

/* 割引額はバッジの上に独立した行として見せる。
   inline-block 同士だと「学割・2名以上限定」と横並びになってしまうため、
   block + width:fit-content で行を分けている。 */
.mycp .mycp-hero__off {
	display: block;
	width: fit-content;
	margin: 0 auto 10px !important;
}
.mycp .mycp-hero__badge { margin: 0 0 6px !important; }

/* ヒーローの白ラベルにクーポン名を入れるようになったため、
   2行になっても収まるサイズに落とす。 */
.mycp .mycp-hero__ttl {
	max-width: 100%;
	font-size: 1.12rem;
	line-height: 1.55;
	padding: .6em 1.1em;
}
@media (max-width: 600px) {
	.mycp .mycp-hero__ttl { font-size: .98rem; padding: .55em .9em; }
}

/* ==========================================================================
   「4タイプ」の比較カード
   SWELL既定は1枚484pxで、PCでは2枚しか入らない。
   横スクロールは残したまま、幅だけ少し詰めて次のカードが視界に入るようにする。 */
@media (min-width: 960px) {
	.is-type4 .swell-block-column {
		width: 384px !important;
		flex: 0 0 384px !important;
	}
	.is-type4 .swell-block-column img {
		width: 100%;
		height: auto;
	}
}

/* クーポンカード：細い枠線と「クーポン詳細を見る」ボタン。
   カード全体がリンクなので、ボタンは押せることを伝えるための見た目（span）。 */
.ttl-coupon {
	border: 1px solid var(--color-sub-pale);
}
.ttl-coupon__more {
	display: block;
	width: fit-content;
	margin: 10px auto 0;
	padding: .4em 1.5em;
	border: 1px solid var(--color-main);
	border-radius: 40px;
	color: var(--color-main);
	font-size: .72rem;
	font-weight: 700;
	line-height: 1.6;
	transition: background .2s ease, color .2s ease;
}
.ttl-coupon--link:hover .ttl-coupon__more {
	background: var(--color-main);
	color: #fff;
}

/* ヒーローの施設名をロゴ画像に差し替えた。
   白抜きロゴなので赤地の上でそのまま使える。 */
.mycp .mycp-hero__brand { margin: 0 0 14px !important; }
.mycp .mycp-hero__brand img {
	display: block;
	width: 190px;
	height: auto;
	margin: 0 auto;
}
@media (max-width: 600px) {
	.mycp .mycp-hero__brand img { width: 150px; }
}

/* ポップアップの1段階目（注意文）。
   is-step1 の間は注意文だけを見せ、確認後にバーコードへ切り替える。 */
.mycp-modal__warn {
	display: none;
	margin: 4px 0 0;
	padding: 1.3em 1.2em;
	border: 2px solid var(--red, #B71716);
	border-radius: 8px;
	background: #fff;
	text-align: left;
}
.mycp-modal.is-step1 .mycp-modal__warn { display: block; }
.mycp-modal__warn p { margin: 0 0 1.1em; color: var(--red, #B71716); font-weight: 700; line-height: 1.9; }
.mycp-modal__warn .mycp-btn { display: block; width: fit-content; margin: 0 auto; }

/* 1段階目の間は価格・タイマー・バーコードを隠す。 */
.mycp-modal.is-step1 .mycp-modal__price,
.mycp-modal.is-step1 .mycp-timer,
.mycp-modal.is-step1 .mycp-modal__code,
.mycp-modal.is-step1 .mycp-expired { display: none; }

/* MYCP-WARN-SP スマホでは注意文とボタンを箱幅に収める。 */
@media (max-width: 599px) {
	.mycp-modal__warn { padding: 1.1em 0.9em; }
	.mycp-modal__warn p { font-size: 0.86rem; line-height: 1.8; }
	.mycp-modal__warn .mycp-btn {
		width: 100%;
		padding-right: 0.8em;
		padding-left: 0.8em;
		font-size: 0.92rem;
		white-space: normal;
	}
}

/* HEADER-SLIM PCのヘッダーを薄くする。
   ロゴの上下余白を削ることで、ロゴ自体は大きくしつつ高さを下げる。 */
@media (min-width: 960px) {
	.l-header.-series .l-header__logo {
		padding-top: 8px;
		padding-bottom: 8px;
	}
}

/* FIXHEADER-SLIM 追従ヘッダーも同じ考え方で、余白を削ってロゴを大きくする。 */
@media (min-width: 960px) {
	.l-fixHeader__logo {
		padding-top: 8px;
		padding-bottom: 8px;
	}
}

/* ARTICLE-HEAD-SLIM タイトル上とアイキャッチ下の余白を少し詰める。 */
#content.l-content { padding-top: 1.25em; }
@media (min-width: 600px) {
	#content.l-content { padding-top: 2em; }
}
.l-mainContent .p-articleThumb { margin-bottom: 0.75em; }
/* LEAD-GAP-SLIM アイキャッチとリード文の間は本文ブロック側の4emが実体。ここを半分にする。 */
.l-mainContent .l-mainContent__inner > .post_content { margin-top: 2em; }

/* SPMENU-DESIGN スマホのドロワーメニュー。テーマ標準のリストのままだと素っ気ないので、
   上部をロゴ帯にして、クーポンだけCTAボタン扱いにする。 */
@media (max-width: 959px) {
	.p-spMenu__inner { position: relative; padding-top: 0; }
	.p-spMenu__body { padding-right: 0; padding-left: 0; }

	/* テーマの「MENU」見出しをロゴ帯に差し替える */
	.p-spMenu .c-widget__title.-spmenu {
		position: relative;
		height: var(--logo_size_sp, 48px);
		margin: 0 0 4px;
		padding: 0;
		border: 0;
		border-radius: 0;
		background: var(--color-main);
		font-size: 0;
		line-height: 0;
	}
	.p-spMenu .c-widget__title.-spmenu::after {
		content: "";
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		width: auto;
		height: auto;
		background: url("https://www.manyo.co.jp/kyoto/media/wp-content/uploads/2026/08/totonoilabo-logo02.png") no-repeat 16px center;
		background-size: 100px auto;
	}

	/* 閉じるボタンはロゴ帯の右側に白で重ねる */
	.p-spMenu.-left .p-spMenu__closeBtn,
	.p-spMenu .p-spMenu__closeBtn {
		position: absolute;
		top: 0;
		right: 0;
		left: auto;
		z-index: 2;
		width: var(--logo_size_sp, 48px);
		height: var(--logo_size_sp, 48px);
	}
	.p-spMenu__closeBtn .c-iconBtn { width: 100%; height: 100%; color: #fff; }

	/* メニュー項目 */
	.p-spMenu__nav { margin-top: 0; padding-bottom: 16px; }
	.p-spMenu .c-spnav > li > a {
		position: relative;
		display: flex;
		align-items: center;
		margin: 0 20px;
		padding: 17px 26px 17px 2px;
		border-bottom: 1px solid var(--color-sub-pale);
		color: var(--color-main);
		font-weight: 700;
		letter-spacing: .02em;
	}
	.p-spMenu .c-spnav > li > a::before { display: none; }
	.p-spMenu .c-spnav > li > a::after {
		content: "";
		position: absolute;
		top: 50%;
		right: 8px;
		width: 7px;
		height: 7px;
		margin-top: -4px;
		border-top: 2px solid var(--color-sub);
		border-right: 2px solid var(--color-sub);
		transform: rotate(45deg);
	}
	.p-spMenu .c-spnav > li:last-child > a { border-bottom: 0; }
	.p-spMenu .c-spnav > li > a:active { background: rgba(47, 93, 80, .06); }

	/* クーポンだけは行ではなくCTAボタンにする */
	.p-spMenu .c-spnav > li > a[href$="/coupon/"] {
		justify-content: center;
		margin: 18px 20px 10px;
		padding: 15px 10px;
		border: 0;
		border-radius: 999px;
		background: var(--color-cta);
		color: #fff;
		box-shadow: 0 3px 0 var(--color-cta-hover);
	}
	.p-spMenu .c-spnav > li > a[href$="/coupon/"]::after { display: none; }

	/* 下の余白が寂しいのでキャッチコピーで締める */
	.p-spMenu__nav::after {
		content: "温泉とサウナの総合ガイド";
		display: block;
		margin: 26px 20px 0;
		padding-top: 18px;
		border-top: 1px solid var(--color-sub-pale);
		color: var(--color-sub);
		font-size: 0.72rem;
		letter-spacing: 0.12em;
		text-align: center;
	}
}

/* SPMENU-FADE ドロワーは全画面にし、スライドではなくじわっと出す。 */
@media (max-width: 959px) {
	.p-spMenu__inner { width: 100vw; }

	.p-spMenu.-left .p-spMenu__inner,
	.p-spMenu.-right .p-spMenu__inner,
	[data-spmenu="opened"] .p-spMenu.-left .p-spMenu__inner,
	[data-spmenu="opened"] .p-spMenu.-right .p-spMenu__inner {
		transform: none;
	}

	/* 閉じている間は不可視にしてタップを拾わせない */
	/* 閉じるときは素早く、開くときはじわっと。 */
	.p-spMenu {
		visibility: hidden;
		opacity: 0;
		transition: opacity .16s ease, visibility .16s ease;
	}
	[data-spmenu="opened"] .p-spMenu {
		visibility: visible;
		opacity: 1;
		transition: opacity .4s ease, visibility .4s ease;
	}
}

/* SPMENU-ADMINBAR ログイン中は管理バーの下から出す。
   top:0 のままだと閉じるボタンが管理バーに隠れてタップを吹い取られる。 */
@media (max-width: 959px) {
	.admin-bar .p-spMenu {
		top: 46px;
		height: calc(100% - 46px);
	}
}
@media screen and (min-width: 783px) and (max-width: 959px) {
	.admin-bar .p-spMenu {
		top: 32px;
		height: calc(100% - 32px);
	}
}

/* COUPON-HAS ブログパーツ化に伴い、id依存の開閉をやめて :has() で切り替える。
   input を label の中に入れたので、同じページに何個置いてもidが衝突しない。 */
.ttl-coupons:has(.ttl-coupons__input:checked) .ttl-coupons__body { max-height: none; }
.ttl-coupons:has(.ttl-coupons__input:checked) .ttl-coupons__body::after { display: none; }
.ttl-coupons:has(.ttl-coupons__input:checked) .ttl-coupons__btn { margin-top: 1.2rem; }
.ttl-coupons:has(.ttl-coupons__input:checked) .ttl-coupons__btn::after { content: "閉じる▲"; }

/* 取り込みで <input> が消えるため、クラス切り替えでも同じ表示になるようにする。
   WordPress の kses は投稿本文の <input> を許可しないので、
   本文へ書き戻しても保存のたびに消える。開閉は assets/js/coupons.js が担う。
   上の :checked / :has() 指定は input が残っている場合のために残してある。 */
.ttl-coupons.is-open .ttl-coupons__body { max-height: none; }
.ttl-coupons.is-open .ttl-coupons__body::after { display: none; }
.ttl-coupons.is-open .ttl-coupons__btn { margin-top: 1.2rem; }
.ttl-coupons.is-open .ttl-coupons__btn::after { content: "閉じる▲"; }

/* label に対応する input が無いのでポインタ表示が出ない。JS 側で role=button を付ける */
.ttl-coupons__btn { cursor: pointer; }
.ttl-coupons__btn:focus-visible { outline: 2px solid var(--color-cta, #1a73e8); outline-offset: 2px; }

/* MYCP-NOBARCODE バーコード未登録のクーポンは、画像の代わりに案内を出す。 */
.mycp-nobarcode {
	margin: 0;
	padding: 1.6em 1.2em;
	border: 2px dashed var(--grn, #3B7A5B);
	border-radius: 8px;
	background: #fff;
	color: var(--grn, #3B7A5B);
	font-size: 0.95rem;
	line-height: 1.9;
	text-align: center;
}
.mycp-nobarcode b { color: var(--red, #B71716); }

/* TABLE-SCROLL-SP スマホでは表を縮めずに横スクロールさせる。
   潰れて何行も折り返すより、幅を確保してスクロールさせたほうが読める。 */
@media (max-width: 599px) {
	.post_content .wp-block-table { position: relative; }
	.post_content .wp-block-table > table { min-width: 480px; }
	.post_content .wp-block-table > table:has(tr > *:nth-child(3)) { min-width: 620px; }
	.post_content .wp-block-table > table:has(tr > *:nth-child(4)) { min-width: 700px; }
	.post_content .wp-block-table::before {
		content: "スクロールできます →";
		display: block;
		margin-bottom: 4px;
		color: var(--color-sub, #9BB3A9);
		font-size: 0.72rem;
		letter-spacing: .04em;
		text-align: right;
	}
	.post_content .wp-block-group .wp-block-table::before { content: none; }
}

/* TTL-INQUIRY 各施設の基本情報表の下に出す、掲載内容の問い合わせ導線。
   本文の邪魔をしないよう小さくグレーで右寄せ。 */
.post_content .ttl-inquiry {
	margin: 4px 0 0;
	color: #9a9a9a;
	font-size: 0.72rem;
	line-height: 1.6;
	text-align: right;
}
.post_content .ttl-inquiry a {
	color: #9a9a9a;
	text-decoration: underline;
}
.post_content .ttl-inquiry a:hover { color: var(--color-main); }


/* ==========================================================================
   カスタマイザーの追加CSS から移設
   出所: swell_child-export.dat の wp_css。設定の一括取り込みは行わず
   CSS だけを管理下へ移した。
   ========================================================================== */

.shop-logo {
}
.shop-logo figure {
	max-width: 250px;
	margin: 0 auto 10px auto;
}
.osusume-shop h3 {
	font-weight: normal;
	font-size: .9rem;
}
.osusume-shop h4 {
	font-size: 1rem;
}

.osusume-company img {
	width: 250px;
}

#topic_matome h2 {
	padding: 1rem;
}

#osusume_panel h4 {
	font-size: 1rem;
}

.wp-block-image figcaption {
	margin-top: 0;
	text-decoration: underline;
}
.wp-block-image figcaption:hover {
	text-decoration: none;
}

/*この記事のポイント*/
.above-toc-widget {
	margin: 50px 0 0 0;
	padding: 2rem 2rem 1rem 2rem;
	border: 5px solid rgb(47 93 80 / 15%);
	border-radius: 10px;
	position: relative;
}
.above-toc-widget strong {
	padding: 1rem;
  position: absolute;
	top: -34px;
	color: #fff;
	background: url('https://www.manyo.co.jp/kyoto/media/wp-content/uploads/2026/08/osusume_midashi.png') no-repeat center;
	background-size: contain;
	display: block;
	font-size: 1.1rem;
}
.above-toc-widget ul {
	padding: 0; 
	list-style: none;
}
.above-toc-widget ul li {
	margin: 0 0 .5rem 0;
	padding-left: 28px;
 	list-style: none;
	position: relative;
	font-weight: bold;
}
.above-toc-widget ul li::before {
	width: 20px;
	height: 20px;
	content: "";
	background: url('https://www.manyo.co.jp/kyoto/media/wp-content/uploads/2026/08/osusume_check.png') no-repeat center;
	background-size: 20px 20px;
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
}
@media screen and (max-width: 920px) {
	.above-toc-widget {
		padding: 1.5rem 1rem .5rem 1rem;
	}
	.above-toc-widget strong {
		font-size: 1rem;
	}
	.above-toc-widget ul li {
		font-size: .9rem;
	}
}

/* この記事を書いた人 */
.p-authorBox .avatar {
	width: 80px;
	height: 80px;
}
.p-authorBox__desc {
	font-size: .8rem;
}
.p-authorBox__name {
	font-size: .8rem !important;
}
/* ttl-note: 注記(※)の共通スタイル */
.post_content p.ttl-note { font-size: 0.78rem; color: var(--color-text-muted, #6B6B6B); line-height: 1.7; }
/* sp-table-nosticky: スマホでは比較表の左列固定を解除 */
@media (max-width: 782px){
.post_content table th[style*="position:sticky"],
.post_content table td[style*="position:sticky"]{position:static !important;left:auto !important;z-index:auto !important;}
}


/* ==========================================================================
   記事・LP 本文の <style> から抽出
   出所: 移行前は本文に直書きされていた（22件・ユニーク2種）。
   本文に残すと KSES / DISALLOW_UNFILTERED_HTML で消えるため移設した。

   ⚠️ body セレクタは body.single-lp へ限定してある。
   本文内にあったときは当該ページ限定だったが、共通CSSへ移すと全ページに
   効いてしまう（LP の背景色 #f0efe9 がサイト全体に及ぶ）。
   ========================================================================== */
/* ===== 抽出元: 本文内 <style> / sha f04570e5b1ba ===== */
/*top-btn*/.annlp-modal .go.go--top{margin:0 0 16px !important}body.single-lp{background:#f0efe9}.mx{max-width:640px;margin:0 auto;background:#fff;overflow:hidden;font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;color:#3a3a3a;line-height:1.8;font-size:15px}.mx img{max-width:100%;height:auto;display:block}.mx-hero{background:#c02329;background-image:repeating-linear-gradient(118deg,rgba(255,255,255,.06) 0 22px,rgba(255,255,255,0) 22px 44px);padding:22px 18px 0;text-align:center;position:relative}.mx-hero__logo{width:210px;margin:0 auto 14px}.mx-hero__ttl2{display:block;font-size:.92em}.mx-hero__ttl{display:inline-block;max-width:94%;background:#fff;color:#c02329;font-size:23px;font-weight:900;line-height:1.45;padding:10px 22px;border-radius:22px;margin:0 0 18px;letter-spacing:.01em;box-shadow:0 3px 0 rgba(0,0,0,.10)}.mx-pr{display:flex;align-items:center;justify-content:center;gap:10px;color:#fff;flex-wrap:nowrap}.mx-pr__lbl{font-size:12.5px;font-weight:700;line-height:1.45;text-align:right;white-space:nowrap}.mx-pr__old{font-size:30px;font-weight:900;color:#ffe14d;letter-spacing:-.01em;white-space:nowrap}.mx-pr__old i{font-style:normal;font-size:13px;color:#fff;font-weight:700}.mx-arrow{color:#fff;font-size:18px;margin:2px 0 4px;line-height:1}.mx-pr2{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:nowrap}.mx-web{display:inline-block;border:2px solid #ffe14d;color:#ffe14d;font-size:12.5px;font-weight:800;line-height:1.35;padding:6px 10px;border-radius:6px;white-space:nowrap}.mx-pr__new{font-size:54px;font-weight:900;color:#ffe14d;line-height:1;letter-spacing:-.02em;white-space:nowrap;-webkit-text-stroke:1.2px #ffe14d;text-stroke:1.2px #ffe14d}.mx-pr__new i{font-style:normal;font-size:14px;color:#fff;font-weight:700}.mx-dots{margin:14px 0 8px;letter-spacing:.5em;color:#fff;font-size:9px;opacity:.9}.mx-hero__lead{color:#fff;font-size:16px;font-weight:900;margin:0 0 14px;letter-spacing:.06em}.mx-hero__btn{display:block;width:100%;max-width:400px;margin:0 auto 18px;border:0;border-radius:999px;background:#ffe14d;color:#c02329;font-size:17px;font-weight:900;padding:14px;cursor:pointer;box-shadow:0 4px 0 #c9a800}.mx-hero__btn:active{transform:translateY(2px);box-shadow:0 2px 0 #c9a800}.mx-hero__ph{position:relative;border-radius:16px 16px 0 0;overflow:hidden}.mx-hero__ph img{width:100%}.mx-vtxt{position:absolute;left:16px;top:16px;writing-mode:vertical-rl;color:#fff;font-size:18px;font-weight:900;letter-spacing:.14em;text-shadow:0 2px 10px rgba(0,0,0,.8),0 0 3px rgba(0,0,0,.6);line-height:1.5}.mx-vtxt small{font-size:1em;font-weight:900;color:#fff;letter-spacing:inherit}.mx-badge{position:absolute;right:12px;top:12px;width:104px;height:104px;box-sizing:border-box;padding-top:7px;display:flex;align-items:center;justify-content:center;text-align:center;color:#c02329;font-weight:900;font-size:20px;line-height:1.22;background:#d9c187;clip-path:polygon(50.0% 0.0%,60.6% 10.4%,75.0% 6.7%,79.0% 21.0%,93.3% 25.0%,89.6% 39.4%,100.0% 50.0%,89.6% 60.6%,93.3% 75.0%,79.0% 79.0%,75.0% 93.3%,60.6% 89.6%,50.0% 100.0%,39.4% 89.6%,25.0% 93.3%,21.0% 79.0%,6.7% 75.0%,10.4% 60.6%,0.0% 50.0%,10.4% 39.4%,6.7% 25.0%,21.0% 21.0%,25.0% 6.7%,39.4% 10.4%);text-shadow:0 1px 0 rgba(255,255,255,.4)}.mx-sec{padding:30px 20px}.mx h2,.mx .mx-h2{border:0 !important;padding:0 !important;background:none !important}.mx h2:before,.mx h2:after{display:none !important;content:none !important}.mx .mx-h2:before,.mx .mx-h2:after{display:none !important;content:none !important}.mx-h2{font-size:20px;font-weight:900;line-height:1.75;text-align:center;margin:0 0 18px;color:#2b6b52}.mx-h2 mark{background:linear-gradient(transparent 60%,#fdf1b8 60%);color:#2b6b52}.mx-p{font-size:15px;margin:0 0 16px}.mx-p b{font-weight:800}.mx-red{color:#c02329;font-weight:800}.mx-grn{color:#2b6b52;font-weight:800}.mx-logo-c{width:180px;margin:-4px auto 14px}.mx-washi{background:#f7f4ea}.mx-rank{position:relative;margin:0 0 22px;padding:0 0 0 2px}.mx-rank__aster{position:absolute;right:0;top:0;font-size:12px;color:#8f8f8f}.mx-rank__ttl{display:block;text-align:center;margin:0 0 16px;font-size:19px;font-weight:900;color:#3f4f47;line-height:1.6;letter-spacing:.01em}.mx-rank__ttl .crown{vertical-align:-7px;margin-right:7px}.mx-rank__ttl .t1,.mx-rank__ttl .t2{background:linear-gradient(transparent 56%,#e8e5c9 56%);padding:0 3px}.mx-rank__ttl .t2{display:inline-block;margin:8px 0 0}.mx-rank__txt{font-size:15px;color:#3a3a3a;line-height:1.95;margin:0}.mx-list{margin:18px 0 0;padding:0;list-style:none}.mx-list li{position:relative;padding-left:20px;margin-bottom:16px;font-size:15.5px;line-height:1.85}.mx-list li:before{content:"";position:absolute;left:0;top:11px;width:9px;height:9px;border-radius:50%;background:#3a3a3a}.mx-note{font-size:11.5px;color:#777;line-height:1.8;margin:10px 0 0}.mx-imgr{border-radius:4px;overflow:hidden}.mx-limit{background:#eef4ee;padding:30px 20px;text-align:center}.mx-limit__pill{display:inline-block;background:#2b6b52;color:#fff;font-size:22px;font-weight:900;letter-spacing:.24em;padding:10px 26px 10px 34px;border-radius:999px;margin:0 0 16px}.mx-limit__lead{font-size:16px;font-weight:800;line-height:1.9;margin:0 0 18px}.mx-limit__lead .mx-red{font-size:17px}.mx-bubble{display:flex;align-items:center;gap:12px;background:#f3e9e4;border-radius:14px;padding:16px 16px;font-size:14px;line-height:1.85;text-align:left;position:relative}.mx-bubble__chara{flex:none;width:84px}.mx-bubble__chara img{width:100%;height:auto;display:block}.mx-bubble__txt{flex:1;min-width:0}.mx-bubble b{color:#c02329}.mx-cpn-wrap{background:#e9f2e7;padding:26px 16px 30px}.mx-cpn{background:#fff;border-radius:10px;overflow:hidden;box-shadow:0 2px 10px rgba(0,0,0,.08)}.mx-cpn__ph img{width:100%}.mx-cpn__bd{padding:18px 18px 22px;text-align:center}.mx-cpn__tag{font-size:14px;font-weight:800;color:#3a3a3a;margin:0 0 8px}.mx-cpn__name{font-size:23px;font-weight:900;margin:0 0 14px;background:linear-gradient(transparent 62%,#fdf1b8 62%);display:inline-block;padding:0 4px}.mx-cpn__set{display:flex;align-items:center;justify-content:center;gap:8px;margin:0 0 16px;flex-wrap:nowrap}.mx-cpn__set span{border:1.5px solid #3a3a3a;border-radius:5px;font-size:14px;font-weight:800;padding:6px 12px;white-space:nowrap}.mx-cpn__set span.pl{border:0;padding:0 2px;font-size:18px}.mx-cpn__set span.g{border-color:#2b6b52;color:#2b6b52}.mx-cpn__old{font-size:14px;margin:0 0 8px}.mx-cpn__old s{font-size:20px;font-weight:800;color:#3a3a3a}.mx-cpn__off{display:flex;align-items:center;justify-content:center;gap:8px;margin:0 0 10px}.mx-cpn__off b{font-size:24px;font-weight:900;color:#2b6b52}.mx-cpn__off b small{font-size:14px}.mx-cpn__off .lbl{font-size:12px;font-weight:800}.mx-cpn__shock{flex:none;width:64px;height:64px;display:flex;align-items:center;justify-content:center;text-align:center;background:#c02329;color:#fff;font-size:12.5px;font-weight:900;line-height:1.28;clip-path:polygon(50.0% 0.0%,62.4% 12.0%,79.4% 9.5%,82.4% 26.5%,97.6% 34.5%,90.0% 50.0%,97.6% 65.5%,82.4% 73.5%,79.4% 90.5%,62.4% 88.0%,50.0% 100.0%,37.6% 88.0%,20.6% 90.5%,17.6% 73.5%,2.4% 65.5%,10.0% 50.0%,2.4% 34.5%,17.6% 26.5%,20.6% 9.5%,37.6% 12.0%)}.mx-cpn__new{display:flex;align-items:center;justify-content:center;gap:10px;margin:6px 0 4px;flex-wrap:nowrap}.mx-cpn__new .lbl{background:#e9f2e7;color:#2b6b52;font-size:12.5px;font-weight:800;padding:6px 10px;border-radius:4px;line-height:1.35;white-space:nowrap}.mx-cpn__new .val{font-size:44px;font-weight:900;color:#c02329;line-height:1;white-space:nowrap;-webkit-text-stroke:1.1px #c02329;text-stroke:1.1px #c02329}.mx-cpn__new .val i{font-style:normal;font-size:13px;color:#3a3a3a}.mx-btn{display:block;width:100%;border:0;border-radius:999px;background:#c02329;color:#fff;font-size:18px;font-weight:900;padding:15px;margin:16px 0 0;cursor:pointer;box-shadow:0 4px 0 #8f171c}.mx-cpn__lim{font-size:13px;margin:14px 0 0;line-height:1.8}.mx-cpn__lim em{font-style:normal;color:#c02329;font-weight:700}.mx-cpn__logo{width:150px;margin:18px auto 0}.mx-fine{font-size:11.5px;line-height:1.85;color:#6b6b6b;padding:16px 18px 0;margin:0}.mx-three{padding:26px 20px 6px;text-align:center}.mx-three__ttl{font-size:15px;font-weight:900;margin:0 0 14px;color:#3a3a3a}.mx-three__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.mx-three__grid figure{margin:0}.mx-three__grid img{border-radius:4px}.mx-three__grid figcaption{font-size:11.5px;line-height:1.6;margin-top:6px;text-align:left;color:#555}.mx-three__grid b{display:block;font-size:12.5px;color:#2b6b52}.mx-free__hd{text-align:center;margin:0 0 16px}.mx-free__hd .box{display:inline-block;border:1px solid #2b6b52;color:#2b6b52;font-size:13.5px;font-weight:800;padding:5px 16px;border-radius:4px;margin-bottom:10px}.mx-free__hd h2{font-size:21px;font-weight:900;margin:0;color:#3a3a3a}.mx-free__hd h2 span{color:#2b6b52}.mx-grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}.mx-grid2 figure{margin:0}.mx-grid2 img{border-radius:4px}.mx-grid2 figcaption{font-size:12.5px;text-align:center;margin-top:6px;color:#555}.mx-room{background:#f5f2ea;padding:30px 20px}.mx-room h2{font-size:21px;font-weight:900;text-align:center;margin:0 0 18px}.mx-room__box{background:#fff;border-radius:6px;padding:0 0 16px;margin-bottom:14px;text-align:center;overflow:hidden}.mx-room__box img{width:100%;height:auto;display:block;margin-bottom:12px}.mx-room__box .mx-room__nm,.mx-room__box .mx-room__pr{padding:0 12px}.mx-room__nm{font-size:16px;font-weight:900;margin:0 0 8px;line-height:1.6}.mx-room__pr{font-size:15px;margin:0;font-weight:800}.mx-room__pr em{font-style:normal;color:#c02329;font-size:19px}.mx-room__grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.mx-well__hd{text-align:center;margin:0 0 16px}.mx-well__hd .box{display:inline-block;border:1px solid #2b6b52;color:#2b6b52;font-size:13.5px;font-weight:800;padding:5px 16px;border-radius:4px;margin-bottom:10px}.mx-well__hd h2{font-size:21px;font-weight:900;margin:0}.mx-well__hd h2 span{color:#2b6b52}.mx-cap{font-size:12.5px;text-align:center;margin:6px 0 0;color:#555}.mx-pink{position:relative;display:flex;align-items:center;justify-content:center;gap:12px;background:#fbeef0;border-radius:14px;padding:16px 16px;margin-top:20px;font-size:14px;line-height:1.85;text-align:center}.mx-pink__chara{flex:none;width:96px;order:2}.mx-pink__chara img{width:100%;height:auto;display:block}@media(max-width:560px){.mx-pink{gap:8px;padding:14px 12px;font-size:13px}.mx-pink__chara{width:74px}}.mx-foot{text-align:center;padding:26px 20px 36px;background:#fff}@media(max-width:560px){.mx-badge{width:76px;height:76px;font-size:14.5px}.mx-vtxt{font-size:14px;letter-spacing:.1em;left:12px;top:12px}.mx-vtxt small{font-size:1em;font-weight:900}.mx-hero__ttl{font-size:18px;padding:9px 16px;line-height:1.45}.mx-pr__new{font-size:44px}.mx-pr__old{font-size:25px}.mx-hero__lead{font-size:14.5px}.mx-hero__btn{font-size:15px;padding:13px}}.mx-foot .site{display:inline-block;background:#2b6b52;color:#fff;font-size:12.5px;font-weight:800;text-decoration:none;padding:8px 22px;border-radius:3px}.mx-foot .lg{width:150px;margin:18px auto 8px}.mx-foot .nm{margin:0 0 2px;font-size:13px;font-weight:800}.mx-foot .ad{margin:0;font-size:11px;color:#777}.mx-foot .tel{display:inline-block;margin-top:12px;border:1px solid #ccc;border-radius:999px;padding:7px 26px;font-size:13.5px;color:#333;text-decoration:none}.mx-logo-dark img{filter:none}.annlp-mask{position:fixed;top:0;left:0;right:0;bottom:0;width:100%;height:100vh;height:100dvh;background:rgba(0,0,0,.66);z-index:999999;display:none;align-items:center;justify-content:center;padding:16px 14px;overscroll-behavior:contain}.annlp-mask.is-on{display:flex}.annlp-modal{background:#fff;border-radius:12px;max-width:400px;width:100%;max-height:calc(100dvh - 40px);overflow-y:auto;-webkit-overflow-scrolling:touch;padding:22px 18px 24px;text-align:center;position:relative;box-sizing:border-box;font-family:"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif}.annlp-modal *{box-sizing:border-box;max-width:100%}@media(max-width:480px){.annlp-mask{padding:12px 10px}.annlp-modal{padding:20px 14px 22px}.annlp-modal h3{font-size:16px}.annlp-modal .limit{font-size:12.5px;padding:8px 10px}.annlp-modal .warn{font-size:12.5px;padding:11px 12px}.annlp-modal .fine{font-size:11px}.annlp-modal .go{font-size:14.5px;padding:13px}}.annlp-modal h3{margin:0 0 12px;font-size:17px;color:#c02329;font-weight:800}.annlp-modal .warn--after{margin:14px 0 0}.annlp-modal .warn{background:#fdeff0;border:1px solid #f0c4c8;border-radius:8px;color:#a5121a;font-size:13px;font-weight:700;line-height:1.8;text-align:left;padding:12px 14px;margin:0 0 12px}.annlp-modal .warn b{color:#c02329}.annlp-modal .limit{display:flex;align-items:center;justify-content:center;gap:6px;background:#c02329;color:#fff;font-size:13.5px;font-weight:800;border-radius:999px;padding:8px 14px;margin:0 0 14px}.annlp-modal .fine{font-size:11.5px;line-height:1.85;color:#555;text-align:left;margin:0 0 16px}.annlp-modal .go{display:block;width:100%;border:0;border-radius:8px;background:#c02329;color:#fff;font-size:15px;font-weight:800;padding:14px;cursor:pointer}.annlp-modal .bc{width:100%;height:auto;display:block;margin:6px 0 10px}.annlp-modal .timer{font-size:13px;color:#c02329;font-weight:700;margin:0 0 6px}.annlp-modal .cls{position:absolute;top:8px;right:10px;border:0;background:none;font-size:22px;color:#888;cursor:pointer;line-height:1}.annlp-modal .hint{font-size:11.5px;color:#666;margin:8px 0 0;line-height:1.7}
/* ===== 抽出元: 本文内 <style> / sha 87e3ebfa0c32 ===== */
.ttlmap{border:1px solid #dadce0;border-radius:10px;overflow:hidden;background:#fff;margin:0 0 28px;font-size:15px;box-shadow:0 1px 3px rgba(60,64,67,.16)}.ttlmap-head{display:flex;align-items:center;gap:10px;padding:13px 16px;background:#2E312F;border-bottom:1px solid #2E312F}.ttlmap-head b{font-size:15px;color:#fff;line-height:1.3}.ttlmap-head span{font-size:12px;color:rgba(255,255,255,.78)}.ttlmap-body{display:flex;height:520px}.ttlmap-side{width:290px;flex:none;overflow-y:auto;border-right:1px solid #e8eaed;background:#fff}.ttlmap-map{flex:1;min-width:0;position:relative}.ttlmap-group{padding:8px 0 4px}.ttlmap-gttl{display:flex;align-items:center;gap:7px;margin:0;padding:6px 14px;font-size:12px;font-weight:700;color:#5f6368;letter-spacing:.02em}.ttlmap-gttl i{width:10px;height:10px;border-radius:50%;display:inline-block}.ttlmap-list{list-style:none;margin:0;padding:0}.ttlmap-list li{margin:0}.ttlmap-list a{display:block;padding:9px 14px;text-decoration:none;border-bottom:1px solid #f1f3f4;transition:background .15s}.ttlmap-list a:hover,.ttlmap-list a.is-active{background:#e8f0fe}.ttlmap-name{display:block;font-size:13.5px;font-weight:700;color:#202124;line-height:1.35}.ttlmap-meta{display:block;font-size:11.5px;color:#5f6368;margin-top:2px}.ttlmap-pin{cursor:pointer;line-height:0}.ttlmap-pin svg{display:block}.ttlmap .maplibregl-popup-tip{display:none}.ttlmap .maplibregl-popup-content{border-radius:10px;box-shadow:0 2px 12px rgba(60,64,67,.32);padding:14px 18px 15px}.ttlmap .maplibregl-popup-close-button{width:28px;height:28px;font-size:19px;color:#5f6368;border-radius:50%}.ttlmap .maplibregl-popup-close-button:hover{background:#f1f3f4}.ttlmap-pop{font-size:13px;line-height:1.6;min-width:200px}.ttlmap-pop b{display:block;font-size:14.5px;color:#202124;margin-bottom:6px;padding-right:14px}.ttlmap-pop dl{margin:0 0 10px;display:grid;grid-template-columns:auto 1fr;gap:2px 8px}.ttlmap-pop dt{color:#5f6368;font-size:11.5px;margin:0}.ttlmap-pop dd{margin:0;font-size:12.5px;color:#202124}.ttlmap-btn{display:inline-block;background:#1a73e8;color:#fff !important;text-decoration:none;font-weight:700;font-size:12.5px;padding:7px 14px;border-radius:5px}.ttlmap-gmap{display:inline-block;margin-left:8px;font-size:12px;color:#1a73e8 !important}@media(max-width:782px){.ttlmap-head{display:block}.ttlmap-head b{display:block}.ttlmap-head span{display:block;margin-top:4px;line-height:1.45}.ttlmap-body{display:flex;flex-direction:column;height:auto}.ttlmap-map{flex:0 0 auto;width:100%;height:320px;order:-1}.ttlmap-side{width:auto;flex:0 0 auto;max-height:290px;border-right:0;border-top:1px solid #e8eaed}}

/* ==========================================================================
   フッターの制作元クレジット
   HTML は functions.php の manyo_child_footer_credit() で出力している。
   出所: 提供時はカスタマイザーの「フッター下に追加」にあったもの。
   ========================================================================== */
.custom-below-footer {
	margin: 20px 0;
	font-size: .9rem;
}