/* 人が書いた本文（施設の manual・チェーンの文章・コラム）用のスタイル。
   本文は WordPress のブロックエディタで書かれていて、Gutenberg と Cocoon のクラスが
   付いたまま data/ に入っている。HTML は書き換えず、`.prose` の中だけ見た目を整える。

   対象のクラスは data/ と content/ に実際に出てくるもの（2026-10-12 に集計）。
   新しいクラスが本文に増えたら、ここに足す。 */

.prose { font-size: 15px; line-height: 1.85; color: var(--ink); }
.prose > :first-child { margin-top: 0; }
.prose > :last-child { margin-bottom: 0; }
.prose p { margin: 0 0 1em; }
.prose h2 { font-size: 19px; margin: 2em 0 .7em; padding-bottom: 6px; border-bottom: 2px solid var(--ink); }
.prose h3 { font-size: 17px; margin: 1.8em 0 .6em; padding-left: 10px; border-left: 3px solid var(--accent); }
.prose h4, .prose h5 { font-size: 15px; margin: 1.5em 0 .5em; }
.prose ul, .prose ol { margin: 0 0 1em; padding-left: 1.4em; }
.prose li { margin: .2em 0; }
.prose img { border-radius: 8px; }
.prose figure { margin: 0 0 1.2em; }
.prose figcaption, .prose .wp-element-caption, .prose .wp-caption-text { font-size: 12px; color: var(--muted); margin-top: 4px; }
.prose blockquote, .prose .wp-block-quote { margin: 0 0 1em; padding: 12px 16px; background: var(--surface); border-radius: 8px; color: var(--ink-2); }
.prose hr { border: 0; border-top: 1px solid var(--line); margin: 2em 0; }
.prose iframe { max-width: 100%; border: 0; }
.prose .aligncenter, .prose .has-text-align-center { text-align: center; margin-left: auto; margin-right: auto; }
.prose .display-none { display: none; }

/* 表。横にはみ出すものは表ごと横スクロール */
.prose table { width: 100%; border-collapse: collapse; font-size: 14px; margin: 0 0 1em; }
.prose th, .prose td { border: 1px solid var(--line); padding: 8px 10px; text-align: left; vertical-align: top; }
.prose th { background: var(--surface); font-weight: 500; }
.prose .wp-block-table, .prose .scroll, .prose .js-scrollable { overflow-x: auto; display: block; }
/* 列の多い表（比較表など）だけ最小幅を持たせて横スクロールにする。2〜3列の表は画面幅に収める */
.prose .wp-block-table table:has(tr > :nth-child(4)) { min-width: 560px; }
.prose table.js-scrollable { display: table; }

/* 埋め込み（YouTube など） */
.prose .wp-block-embed__wrapper { position: relative; }
.prose .wp-embed-aspect-16-9 .wp-block-embed__wrapper { aspect-ratio: 16 / 9; }
.prose .wp-embed-aspect-16-9 iframe { position: absolute; inset: 0; width: 100%; height: 100%; }
.prose iframe[src*="youtube.com"] { width: 100%; height: auto; aspect-ratio: 16 / 9; }

/* 文字の装飾 */
.prose .marker { background: linear-gradient(transparent 55%, #FFF0A8 55%); }
.prose .marker-under { background: linear-gradient(transparent 70%, #FFE27A 70%); }
.prose .marker-red, .prose .marker-under-red { background: linear-gradient(transparent 70%, #FFD3DE 70%); }
.prose .marker-blue { background: linear-gradient(transparent 70%, #CFE6FF 70%); }
.prose .red, .prose .bold-red { color: #C0262D; }
.prose .bold, .prose .bold-red { font-weight: 700; }
.prose .blue { color: #1C5FB8; }
.prose .red-under { border-bottom: 2px solid #C0262D; }
.prose .has-small-font-size, .prose .fz-12px, .prose .fz-10px { font-size: 13px; }
.prose .fz-14px { font-size: 14px; }
.prose .has-normal-font-size { font-size: 15px; }
.prose .fz-20px, .prose .fz-22px, .prose .has-large-font-size { font-size: 19px; }
.prose .fz-28px { font-size: 22px; }
.prose .has-white-color { color: #fff; }
.prose .has-red-background-color { background: #C0262D; color: #fff; }
.prose .has-orange-background-color, .prose .has-deep-orange-background-color { background: #E8590C; color: #fff; }
.prose .has-watery-yellow-background-color { background: #FFF7D6; }
.prose .has-f-6-a-068-background-color { background: #F6A068; }
.prose .has-ex-a-background-color { background: var(--surface); }
.prose .has-background { padding: 12px 16px; border-radius: 8px; }

/* 星評価: <span class="star5_rating" data-rate="4"></span> */
.prose .star5_rating { color: #E8A317; letter-spacing: 2px; }
.prose .star5_rating[data-rate="5"]::before { content: "★★★★★"; }
.prose .star5_rating[data-rate="4"]::before { content: "★★★★☆"; }
.prose .star5_rating[data-rate="3"]::before { content: "★★★☆☆"; }
.prose .star5_rating[data-rate="2"]::before { content: "★★☆☆☆"; }
.prose .star5_rating[data-rate="1"]::before { content: "★☆☆☆☆"; }

/* 囲み（Cocoon のボックス類）。色の付いた枠は本文の意味なので、枠線の色だけ残す */
.prose .block-box, .prose .blank-box, .prose .info-box, .prose .information-box, .prose .alert-box,
.prose .warning-box, .prose .good-box, .prose .attention, .prose .chocozap-attention, .prose .common-icon-box {
  margin: 0 0 1.2em; padding: 14px 16px; border: 1px solid var(--line-2); border-radius: 10px; background: #fff;
}
.prose .bb-yellow, .prose .attention, .prose .chocozap-attention { background: #FFFBEA; border-color: #F2D675; }
.prose .bb-blue, .prose .information-box, .prose .info-box { background: #F1F7FF; border-color: #BCD6F5; }
.prose .alert-box, .prose .warning-box { background: #FFF4F1; border-color: #F3BFB2; }
.prose .good-box { background: #F2FAF4; border-color: #B9DEC2; }
.prose .has-red-border-color { border-color: #E06A72; }
.prose .has-orange-border-color, .prose .has-deep-orange-border-color, .prose .has-amber-border-color { border-color: #F0A35E; }
.prose .has-light-blue-border-color, .prose .has-indigo-border-color { border-color: #8CC0EA; }
.prose .has-grey-border-color { border-color: var(--line-2); }
.prose .box-label, .prose .tab-caption-box-label { display: inline-block; margin: -14px 0 10px -16px; padding: 2px 12px; font-size: 13px; font-weight: 700; background: var(--ink); color: #fff; border-radius: 10px 0 8px 0; }
.prose .has-red-border-color > .box-label { background: #C0262D; }
.prose .has-orange-border-color > .box-label { background: #D9620C; }
.prose .box-content > :last-child { margin-bottom: 0; }

/* よくある質問 */
.prose .faq-wrap { padding: 0; border: 0; background: none; margin-bottom: 10px; }
.prose .faq { margin: 0; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.prose .faq-item { display: flex; gap: 12px; margin: 0; padding: 12px 14px; }
.prose .faq-question { background: var(--surface); font-weight: 700; }
.prose .faq-item-label { flex: none; font-weight: 700; color: var(--accent); }
.prose .faq-item-content > :last-child { margin-bottom: 0; }

/* 折りたたみ（Cocoon のトグル。チェックボックスで開閉する） */
.prose .toggle-wrap { padding: 0; }
.prose .toggle-checkbox { position: absolute; opacity: 0; pointer-events: none; }
.prose .toggle-wrap > br { display: none; }
.prose .toggle-button { display: block; padding: 12px 16px; font-weight: 700; cursor: pointer; }
.prose .toggle-button::after { content: "＋"; float: right; color: var(--muted); }
.prose .toggle-content { display: none; padding: 0 16px 14px; }
.prose .toggle-checkbox:checked ~ .toggle-content { display: block; }
.prose .toggle-checkbox:checked + br + .toggle-button::after, .prose .toggle-checkbox:checked + .toggle-button::after { content: "－"; }
.prose .toggle-checkbox:focus-visible + br + .toggle-button { outline: 2px solid var(--accent); }

/* 吹き出し */
.prose .speech-wrap { display: flex; gap: 12px; align-items: flex-start; margin: 0 0 1.2em; }
.prose .speech-wrap > figure { flex: none; width: 56px; margin: 0; }
.prose .speech-wrap .speech-icon-image { width: 56px; height: 56px; border-radius: 50%; }
.prose .speech-person { display: none; }
.prose .speech-balloon { flex: 1; background: var(--surface); border-radius: 12px; padding: 12px 14px; }
.prose .speech-balloon > :last-child { margin-bottom: 0; }

/* ブログカード（内部リンクのカード） */
.prose .blogcard-wrap { display: block; margin: 0 0 1.2em; text-decoration: none; color: var(--ink); }
.prose .blogcard { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 4px 14px; border: 1px solid var(--line); border-radius: 10px; padding: 12px; }
.prose .blogcard-wrap:hover .blogcard { border-color: var(--ink); }
.prose .blogcard-label, .prose .blogcard-footer { display: none; }
.prose .blogcard-thumbnail { grid-row: span 2; margin: 0; }
.prose .blogcard-thumbnail img { width: 120px; height: 68px; object-fit: cover; border-radius: 6px; display: block; }
.prose .blogcard-title { font-weight: 700; font-size: 15px; line-height: 1.5; }
.prose .blogcard-snippet { font-size: 12px; color: var(--muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* ボタン（本文中の公式サイト・サイト内リンク） */
.prose .link-button { margin: 1em 0; text-align: center; }
.prose .know-more { margin: 0 0 4px; font-size: 13px; font-weight: 700; color: var(--muted); }
.prose .link-button + br, .prose .know-more + br { display: none; }
.prose .official-link-membership, .prose .official-link, .prose .on-site-link, .prose .show-link,
.prose .wp-block-button__link, .prose .btn {
  display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 22px;
  border-radius: 10px; font-weight: 700; text-decoration: none; max-width: 100%;
}
.prose .official-link-membership, .prose .official-link, .prose .wp-block-button__link, .prose .btn { background: var(--accent); color: #fff; }
.prose .official-link-membership:hover, .prose .official-link:hover, .prose .wp-block-button__link:hover, .prose .btn:hover { background: var(--accent-ink); color: #fff; }
.prose .on-site-link, .prose .show-link { border: 1px solid var(--ink); color: var(--ink); }
.prose .button-block, .prose .wp-block-buttons { text-align: center; margin: 1em 0; }

/* タグの並び（本文中の .tag_area01） */
.prose .tag_area01 ul { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.prose .tag_area01 li a { display: inline-block; font-size: 13px; border: 1px solid var(--line-2); border-radius: 999px; padding: 4px 12px; text-decoration: none; }

/* Font Awesome 4 の名残（本文中に7個）。フォントは読み込まないので記号で代える */
.prose .fa { font-style: normal; }
.prose .fa-thumbs-up::before { content: "○"; color: #2E7D4F; font-weight: 700; }
.prose .fa-thumbs-down::before { content: "×"; color: #C0262D; font-weight: 700; }
.prose .fa-clock-o { display: none; }

/* 本文中の既存の施設表（studio_info）・一覧表 */
.prose .studio_info th, .prose .article-summary-table th { white-space: nowrap; }

/* 人気ランキング（ショートコード [sc name="pilates-ranking-slide"] など）。横に並べて、はみ出したら横スクロール */
.prose .slider { overflow-x: auto; margin: 0 0 10px; scroll-snap-type: x proximity; }
.prose .slide-track { display: flex; gap: 10px; }
.prose .slide-track > a { flex: 0 0 140px; scroll-snap-align: start; text-decoration: none; color: var(--ink); }
.prose .slide { position: relative; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; background: #fff; }
.prose .slide img { display: block; width: 100%; height: 92px; object-fit: contain; border-radius: 0; background: #fff; }
.prose .slide .rank { position: absolute; top: 6px; left: 6px; min-width: 24px; height: 24px; padding: 0 6px; border-radius: 999px; background: var(--ink); color: #fff; font-size: 12px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.prose .slide-track > a:first-child .rank { background: var(--accent); }
.prose .slide .caption { padding: 6px 8px; font-size: 12px; font-weight: 700; line-height: 1.4; border-top: 1px solid var(--line); }
.prose .slide-track > a:hover .slide { border-color: var(--ink); }
