@charset "UTF-8";
/* =====================================================================
   膝の再生医療 改修版ページ 専用スタイル
   ---------------------------------------------------------------------
   現行サイト(site_themes_new)のデザイントークンに準拠して新規セクションを装飾。
   すべて .krt 配下にスコープ（本番ページ ID132 は .krt を持たないため無影響）。
   色・書体は既存変数を踏襲：青#3375CE / 緑#5dc1cf / 水色#F0F5FC / 黄#fefce1 /
   見出し fot-tsukuardgothic-std。
   ===================================================================== */

.krt{
  --krt-blue:#3375CE; --krt-blue-d:#255a9e; --krt-teal:#5dc1cf;
  --krt-water:#F0F5FC; --krt-yellow:#fefce1; --krt-red:#ff535d;
  --krt-border:#dbe6f4; --krt-ink:#333; --krt-muted:#7a8798;
  --krt-title:fot-tsukuardgothic-std, sans-serif;
}

/* =====================================================================
   AUN 再修正分（2026-07-30）
   ===================================================================== */

/* ---- #1 ページタイトル帯(.pageHeadContents)を廃止したことへの対応 ----
   SPは #header が position:fixed / height:17.333vw で、従来はその分の
   margin-top を .pageHeadContents が担っていた。帯を削除したため
   後続の .topicpath 側で同じ値を補填する（PCの #header は relative なので不要）。 */
@media (max-width:768px){
  .krt .topicpath{ margin-top:17.333vw; }
}

/* ---- #3 ページ見出し（H1・地域KW「札幌」入り） ---- */
.krt .krt-pagetitle{ text-align:center; font-family:var(--krt-title); font-weight:700;
  font-size:30px; line-height:1.5; color:var(--krt-ink); letter-spacing:.04em; margin:0 0 22px; }
/* span はリセットで font-family:"Yu Gothic" が直接指定されており継承しないため、
   見出し用の柔らかいフォント(fot-tsukuardgothic-std)を明示する */
.krt .krt-pagetitle .krt-pt-main{ font-family:var(--krt-title); font-weight:700; line-height:1.3;
  color:var(--krt-blue); font-size:38px; margin:0 .25em; }

/* ---- #4 お悩みチェック（modaal で開くため行全体をクリック可能に見せる） ---- */
.krt .pagecheckboxitembox .checklist li{ cursor:pointer; }
.krt .pagecheckboxitembox .checklist li .icon{ flex:0 0 auto; width:26px; line-height:0; }
.krt .pagecheckboxitembox .checklist li:hover .txt{ color:var(--krt-blue); }

/* ---- #5 院長写真下の氏名・肩書き ---- */
.krt .krt-cap-name{ margin-top:14px; text-align:center; font-family:var(--krt-title); font-weight:700;
  font-size:17px; line-height:1.6; color:var(--krt-ink); }
.krt .krt-cap-name small{ display:block; margin-top:4px; font-family:inherit; font-weight:400;
  font-size:12.5px; color:var(--krt-muted); }

/* ---- #6 監修者カード内のプロフィールリンク ---- */
.krt .krt-supervisor .krt-sv-link{ display:inline-block; margin-top:16px; font-size:13.5px;
  color:var(--krt-blue); text-decoration:underline; }
.krt .krt-supervisor .krt-sv-link::before{ content:"▶ "; font-size:11px; text-decoration:none; }

/* ---- #8 リハビリセクション：根本的な原因リスト ---- */
.krt .krt-cause{ max-width:640px; margin:0 auto 28px; padding:6px 0; list-style:none;
  background:#fff; border:1px solid var(--krt-border); border-radius:14px; }
.krt .krt-cause li{ position:relative; padding:15px 24px 15px 52px; font-size:15.5px; line-height:1.7;
  font-weight:700; color:var(--krt-ink); }
.krt .krt-cause li:not(:last-child){ border-bottom:1px solid var(--krt-water); }
.krt .krt-cause li::before{ content:""; position:absolute; left:22px; top:50%; margin-top:-7px;
  width:8px; height:14px; border-right:3px solid var(--krt-teal); border-bottom:3px solid var(--krt-teal);
  transform:rotate(45deg); }

/* ---- #8 集中プログラムへのソフト導線CTA ---- */
.krt .krt-softcta{ display:flex; gap:24px; align-items:center; flex-wrap:wrap; margin-top:28px;
  background:var(--krt-water); border-radius:16px; padding:24px 28px; }
.krt .krt-softcta .t{ flex:1 1 340px; font-size:14.5px; line-height:1.95; margin:0; }
.krt .krt-softcta .t b{ color:var(--krt-blue-d); }
.krt .krt-softcta .b{ flex:0 0 auto; display:flex; flex-direction:column; align-items:center; gap:2px; }
.krt .krt-softcta .krt-sublink{ margin-top:8px; }

/* ---- #11 / #12 動画コンテンツ（メディア出演・院長解説動画） ----
   YouTube を iframe でサムネイル位置に埋め込む。幅は 16:9 を維持したまま可変。 */
.krt .krt-media{ display:flex; gap:24px; align-items:flex-start; flex-wrap:wrap;
  background:#fff; border:1px solid var(--krt-border); border-radius:14px;
  padding:22px 26px; box-shadow:0 8px 24px rgba(51,117,206,.07); }
.krt .krt-media.-inline{ margin-top:18px; box-shadow:none; }
.krt .krt-media .krt-media-embed{ flex:0 0 auto; width:360px; max-width:100%; aspect-ratio:16/9;
  border-radius:10px; overflow:hidden; background:#000; }
.krt .krt-media .krt-media-embed iframe{ display:block; width:100%; height:100%; border:0; }
.krt .krt-media .krt-media-body{ flex:1 1 300px; min-width:0; }
.krt .krt-media .krt-media-src{ font-size:12px; color:var(--krt-muted); letter-spacing:.06em; margin-bottom:6px; }
.krt .krt-media .krt-media-title{ font-family:var(--krt-title); font-weight:700; font-size:16px;
  line-height:1.7; color:var(--krt-blue-d); margin:0 0 8px; }
.krt .krt-media .krt-media-desc{ font-size:14px; line-height:1.9; color:#444; margin:0; }
.krt .krt-media .krt-sublink{ margin-top:10px; }

/* ---- #10 このページのみ福亀会グループを非表示 ----
   .groupbox は共通パーツ parts/index/access.php 内（<main class="krt"> の外）なので
   .krt ではなく body のテンプレートクラスでスコープする。 */
body.page-template-template-knee-regenerative .groupbox{ display:none; }

/* ---- footer の共通CTA（.bottomContactBox の Contact カード）を当ページのみ非表示 ----
   #13 のページ専用CTAと役割が重複するため。写真帯(.cap)は残し、
   元デザインで白カードが持っていたブルーのアクセント線(10px #3375CE)を
   .bottomContactBox の下端に引き継いで「写真帯→ブルー線→フッター」の
   リズムを保つ。 */
body.page-template-template-knee-regenerative .bottomContactBox .contents{ display:none; }
body.page-template-template-knee-regenerative .bottomContactBox{ border-bottom:10px solid #3375CE; }
@media (max-width:768px){
  body.page-template-template-knee-regenerative .bottomContactBox{ border-bottom-width:3.75vw; }
}

/* ---- #13 フッターCTA（アクセス情報と福亀会グループの間に挿入） ---- */
.krt.krt-footcta{ background:var(--krt-blue); padding:48px 0; margin-top:60px; text-align:center; }
.krt.krt-footcta .krt-footcta-title{ font-family:var(--krt-title); font-weight:700; font-size:27px;
  line-height:1.5; color:#fff; margin:0 0 12px; }
.krt.krt-footcta .krt-footcta-lead{ font-size:14.5px; line-height:1.9; color:#fff; margin:0 auto 22px; max-width:760px; }
.krt.krt-footcta .krt-footcta-btns{ display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }
.krt.krt-footcta .krt-btn{ background:#fff; color:var(--krt-blue); box-shadow:0 6px 16px rgba(0,0,0,.12); }
.krt.krt-footcta .krt-btn.-line{ background:#fff; color:#06c755; border:2px solid #06c755; }
.krt.krt-footcta .krt-footcta-tel{ display:flex; flex-wrap:wrap; justify-content:center;
  gap:4px 14px; font-size:14px; color:#fff; margin:18px 0 0; }
.krt.krt-footcta .krt-footcta-tel .n{ white-space:nowrap; }
.krt.krt-footcta .krt-footcta-tel a{ color:#fff; text-decoration:none; font-weight:700; }
.krt.krt-footcta .krt-footcta-note{ font-size:12px; color:#fff; opacity:.85; margin:4px 0 0; }

/* ---- 共通リズム ---- */
.krt .krt-block{ margin:64px 0; }
/* icon-title の下端装飾(●●)と後続テキストが近接/被るのを防ぐため余白を確保 */
.krt .title.icon-title{ padding-bottom:42px; margin-bottom:28px; }
.krt .krt-lead{ text-align:center; font-size:16px; line-height:2; margin:0 auto 32px; max-width:860px; }
.krt .krt-lead.-left{ text-align:left; }
.krt .krt-note{ font-size:12.5px; color:var(--krt-muted); line-height:1.9; margin-top:14px; }
.krt .krt-em{ color:var(--krt-blue); font-weight:700; }
/* 折り返してほしくないかたまりに付ける汎用クラス（span はリセットで
   font-family が直接指定されているため、フォントは親から明示的に引き継ぐ） */
.krt .krt-nb{ white-space:nowrap; font-family:inherit; font-weight:inherit; font-size:inherit; }
.krt .krt-marker{ background:linear-gradient(transparent 60%, #fff2a8 60%); font-weight:700; padding:0 2px; }

/* ---- セクション帯（色地） ---- */
.krt .krt-band{ padding:70px 0; margin:0; }
.krt .krt-band.colorBoxbgBlue{ background:var(--krt-water); }
.krt .krt-band.colorBoxbgyellow{ background:var(--krt-yellow); }

/* ---- 導入ヒーロー ---- */
.krt .krt-hero{ text-align:center; background:var(--krt-water); border-radius:18px; padding:28px 24px; margin:0 0 12px; }
.krt .krt-hero .krt-price{ display:flex; flex-wrap:wrap; justify-content:center; align-items:baseline;
  gap:2px 10px; font-family:var(--krt-title); font-size:15px; color:var(--krt-ink); line-height:1.9; }
/* 折り返すなら「治療名 / 価格」の間で折る。治療名自体は nowrap にして
   PRP-FD がハイフンで割れるのを防ぐ（幅の狭い端末でも安全にこの位置で折れる） */
.krt .krt-hero .krt-price .krt-price-item{ white-space:normal; }
.krt .krt-hero .krt-price .krt-price-item .n{ white-space:nowrap; }
.krt .krt-hero .krt-price .krt-price-item b{ white-space:nowrap; }
.krt .krt-hero .krt-price .krt-price-item + .krt-price-item::before{ content:"／"; margin-right:10px; color:var(--krt-muted); }
.krt .krt-hero .krt-price .krt-price-tax{ white-space:nowrap; }
.krt .krt-hero .krt-price b{ color:var(--krt-red); font-size:22px; margin:0 2px; }
.krt .krt-hero .krt-access{ display:inline-block; margin-top:8px; font-size:13px; color:var(--krt-blue); font-weight:700; }

/* ---- カードグリッド（立場・理由・組み合わせ） ---- */
.krt .krt-cards{ display:flex; flex-wrap:wrap; gap:24px; justify-content:center; margin:28px 0 8px; }
.krt .krt-card{ flex:1 1 270px; max-width:360px; background:#fff; border:1px solid var(--krt-border);
  border-radius:16px; padding:30px 28px 26px; box-shadow:0 8px 24px rgba(51,117,206,.08); position:relative; }
.krt .krt-card .krt-no{ position:absolute; top:-18px; left:50%; transform:translateX(-50%);
  width:44px; height:44px; border-radius:50%; background:var(--krt-blue); color:#fff;
  font-family:var(--krt-title); font-size:20px; font-weight:700; display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 10px rgba(51,117,206,.35); }
.krt .krt-card .krt-chip{ display:inline-block; background:var(--krt-blue); color:#fff; font-family:var(--krt-title);
  font-size:12px; font-weight:700; letter-spacing:.04em; padding:5px 16px; border-radius:9999px; margin-bottom:14px; }
/* #9 doc の hya-card 相当：「こんな経験は？」は主張を弱めた枠付きタグにする */
.krt .krt-card .krt-chip.-tag{ background:#fff; color:var(--krt-blue); border:1px solid var(--krt-blue);
  font-size:11.5px; padding:4px 13px; }
.krt .krt-card h4{ font-family:var(--krt-title); color:var(--krt-blue-d); font-size:17px; line-height:1.55;
  margin:0 0 10px; text-align:center; }
.krt .krt-card.-num h4{ text-align:center; margin-top:8px; }
.krt .krt-card p{ font-size:14px; line-height:1.9; color:#444; margin:0; }
/* 4枚を 3-1 ではなく 2-2 で組む（#9 ヒアルロン酸セクション）。
   .krt-card は box-sizing:content-box（サイト既定）で padding56px+border2px が
   外寸に加算されるため、px指定では2枚並ばない。border-box にして
   「50% - gap半分」で確実に2列にする。 */
.krt .krt-cards.-two{ max-width:820px; margin-left:auto; margin-right:auto; }
.krt .krt-cards.-two .krt-card{ box-sizing:border-box; flex:1 1 calc(50% - 12px);
  max-width:calc(50% - 12px); }

/* ---- 実績バッジ ---- */
.krt .krt-kpi{ text-align:center; margin:8px 0; }
.krt .krt-kpi .krt-org{ font-family:var(--krt-title); color:#a99a3f; font-weight:700; font-size:16px; letter-spacing:.05em; }
.krt .krt-kpi .krt-badge{ display:inline-block; border:3px solid var(--krt-blue); border-radius:50%/18%;
  padding:16px 52px; margin:12px 0; background:#fff; }
.krt .krt-kpi .krt-badge .l{ font-family:var(--krt-title); color:var(--krt-blue); font-weight:700; font-size:15px; letter-spacing:.1em; }
.krt .krt-kpi .krt-badge .n{ font-family:var(--krt-title); color:var(--krt-blue-d); font-weight:700; font-size:52px; line-height:1.05; }
.krt .krt-kpi .krt-badge .n small{ font-size:20px; }
.krt .krt-kpi .krt-badge .s{ color:var(--krt-blue); font-size:12px; }
.krt .krt-kpi .krt-catch{ font-family:var(--krt-title); font-size:21px; font-weight:700; color:var(--krt-ink);
  letter-spacing:.03em; line-height:1.6; margin:6px 0 2px; }

/* ---- 治療メニュー カード（期待できること／限界） ---- */
.krt .krt-tx{ background:#fff; border:1px solid var(--krt-border); border-radius:16px; padding:28px 30px;
  margin-bottom:24px; box-shadow:0 8px 24px rgba(51,117,206,.07); }
.krt .krt-tx h3{ font-family:var(--krt-title); color:#fff; background:var(--krt-blue); display:inline-block;
  font-size:19px; padding:8px 24px; border-radius:9999px; margin:0 0 16px; }
.krt .krt-tx .krt-desc{ font-size:14.5px; line-height:2; margin:0 0 16px; }
.krt .krt-tx .krt-sub{ border-radius:12px; padding:16px 20px; font-size:14px; line-height:1.9; margin-top:12px; }
.krt .krt-tx .krt-sub .h{ display:flex; align-items:center; gap:8px; font-family:var(--krt-title); font-weight:700; margin-bottom:6px; }
.krt .krt-tx .krt-sub .h::before{ content:""; width:20px; height:20px; border-radius:50%; flex:0 0 auto; }
.krt .krt-tx .krt-exp{ background:#eaf7f9; border-left:5px solid var(--krt-teal); }
.krt .krt-tx .krt-exp .h{ color:#2c9aa8; } .krt .krt-tx .krt-exp .h::before{ background:var(--krt-teal); }
.krt .krt-tx .krt-lim{ background:var(--krt-yellow); border-left:5px solid #e6c34d; }
.krt .krt-tx .krt-lim .h{ color:#a8871f; } .krt .krt-tx .krt-lim .h::before{ background:#e6c34d; }

/* ---- 注意ボックス（未承認医薬品／届出） ---- */
.krt .krt-notice{ border:2px solid #d8bd6a; background:#fdf9ec; border-radius:14px; padding:22px 26px;
  font-size:14px; line-height:2; }
.krt .krt-approval{ display:flex; gap:24px; align-items:center; flex-wrap:wrap; background:var(--krt-water);
  border-radius:16px; padding:24px 28px; }
.krt .krt-approval .krt-approval-body{ flex:1; min-width:240px; font-size:15.5px; line-height:1.9; margin:0; }
.krt .krt-approval .krt-approval-body b{ color:var(--krt-blue-d); }
.krt .krt-approval .krt-approval-img{ width:170px; flex:0 0 auto; }
.krt .krt-approval .krt-approval-img img{ border-radius:10px; }

/* ---- リスク・副作用 2カラム ---- */
.krt .krt-risk{ display:flex; flex-wrap:wrap; gap:24px; margin:20px 0; }
.krt .krt-risk-col{ flex:1 1 300px; background:#fff; border:1px solid var(--krt-border); border-radius:16px; padding:24px 28px; }
.krt .krt-risk-col h4{ font-family:var(--krt-title); color:var(--krt-blue-d); font-size:16px; margin:0 0 14px;
  padding-bottom:12px; border-bottom:2px solid var(--krt-water); }
.krt .krt-risk-col ul{ margin:0; padding:0; list-style:none; }
.krt .krt-risk-col li{ position:relative; padding-left:22px; font-size:13.8px; line-height:1.8; margin-bottom:10px; }
.krt .krt-risk-col li::before{ content:""; position:absolute; left:0; top:.65em; width:8px; height:8px;
  border-radius:50%; background:var(--krt-blue); }

/* ---- 受診の流れ フロー ---- */
.krt .krt-flow{ max-width:820px; margin:24px auto 0; }
.krt .krt-step{ display:flex; gap:20px; align-items:stretch; position:relative; padding-bottom:22px; }
.krt .krt-step:not(:last-child)::after{ content:""; position:absolute; left:27px; top:56px; bottom:0; width:2px; background:#cfe0f4; }
.krt .krt-step .krt-num{ flex:0 0 auto; width:56px; height:56px; border-radius:50%; background:var(--krt-blue); color:#fff;
  font-family:var(--krt-title); font-weight:700; font-size:22px; display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 10px rgba(51,117,206,.3); z-index:1; }
.krt .krt-step .krt-body{ flex:1; background:#fff; border:1px solid var(--krt-border); border-radius:14px; padding:16px 22px; }
.krt .krt-step .krt-q{ font-family:var(--krt-title); font-weight:700; color:var(--krt-blue-d); font-size:16px; margin-bottom:6px; }
.krt .krt-step .krt-body p{ font-size:14px; line-height:1.9; margin:0; color:#444; }

/* ---- FAQ アコーディオン ---- */
.krt .krt-faq{ max-width:900px; margin:24px auto 0; border-radius:14px; overflow:hidden; border:1px solid var(--krt-border); }
.krt .krt-faq details{ background:#fff; border-bottom:1px solid var(--krt-border); }
.krt .krt-faq details:last-child{ border-bottom:none; }
.krt .krt-faq summary{ list-style:none; cursor:pointer; display:flex; gap:14px; align-items:flex-start;
  padding:18px 52px 18px 20px; font-family:var(--krt-title); font-weight:700; font-size:15.5px; color:var(--krt-ink);
  position:relative; }
.krt .krt-faq summary::-webkit-details-marker{ display:none; }
.krt .krt-faq summary .qmark{ flex:0 0 auto; width:28px; height:28px; border-radius:50%; background:var(--krt-blue);
  color:#fff; display:inline-flex; align-items:center; justify-content:center; font-size:15px; }
.krt .krt-faq summary::after{ content:""; position:absolute; right:22px; top:24px; width:10px; height:10px;
  border-right:2px solid var(--krt-blue); border-bottom:2px solid var(--krt-blue); transform:rotate(45deg); transition:transform .25s; }
.krt .krt-faq details[open] summary::after{ transform:rotate(-135deg); top:28px; }
.krt .krt-faq .krt-a{ display:flex; gap:14px; padding:0 22px 20px 20px; font-size:14px; line-height:1.95; color:#444; }
/* 回答本文は .krt-a の中の入れ子 div に入る。サイトのリセットが div/p に
   line-height:1 を直接指定しているため継承が効かない。明示的に上書きする。 */
.krt .krt-faq .krt-a > div{ line-height:1.95; }
.krt .krt-faq .krt-a p{ line-height:1.95; }
.krt .krt-faq .krt-a p:not(:last-child){ margin-bottom:.9em; }
/* 質問が2行になったときに詰まらないように */
.krt .krt-faq summary{ line-height:1.6; }
.krt .krt-faq .krt-a .amark{ flex:0 0 auto; width:28px; height:28px; border-radius:50%; background:var(--krt-teal);
  color:#fff; display:inline-flex; align-items:center; justify-content:center; font-family:var(--krt-title); font-weight:700; font-size:15px; }

/* ---- CTA ボタン（テキストが溢れない・折り返す site カラー） ---- */
.krt .krt-cta{ text-align:center; margin:28px 0 8px; }
/* box-sizing はサイト既定が content-box。SPで width:100% を指定すると
   padding(左右52px)＋borderが加算されて画面幅を超えるため border-box にする。 */
.krt .krt-btn{ box-sizing:border-box; display:inline-flex; align-items:center; justify-content:center; gap:12px; max-width:100%;
  background:var(--krt-blue); color:#fff; font-family:var(--krt-title); font-weight:700; font-size:17px; line-height:1.5;
  text-decoration:none; padding:17px 40px; border-radius:9999px; box-shadow:0 6px 16px rgba(51,117,206,.28);
  transition:opacity .3s, transform .3s; text-align:center; }
.krt .krt-btn::after{ content:""; flex:0 0 auto; width:8px; height:8px; border-top:2px solid currentColor;
  border-right:2px solid currentColor; transform:rotate(45deg); }
.krt .krt-btn:hover{ opacity:.88; transform:translateY(-1px); }
.krt .krt-btn small{ display:block; font-size:12px; font-weight:500; opacity:.95; }
.krt .krt-btn.-line{ background:#fff; color:#06c755; border:2px solid #06c755; box-shadow:none; }
.krt .krt-btn.-ghost{ background:#fff; color:var(--krt-blue); border:2px solid var(--krt-blue); box-shadow:none; }
.krt .krt-sublink{ display:inline-block; margin-top:14px; font-size:13.5px; color:var(--krt-blue); text-decoration:underline; }
/* .krt-cta 内の補助リンクはボタンと同じ行に並んでしまうため、必ずボタンの下に置く */
.krt .krt-cta .krt-sublink{ display:block; }

/* ---- 見出し補助（icon-title のリード） ---- */
.krt .krt-subhead{ text-align:center; color:var(--krt-muted); font-size:14px; margin:0 0 24px; }

/* ---- 比較・料金テーブル（既存 .treatmentbox .itemtable の配色を踏襲して .krt にも適用） ---- */
.krt .table-container{ width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; margin:8px 0 4px; }
.krt .itemtable{ width:100%; border-collapse:separate; border-spacing:0; background:#fff;
  border-top:1px solid #e2e2e2; border-left:1px solid #e2e2e2; border-radius:10px; overflow:hidden; min-width:640px; }
.krt .itemtable th,
.krt .itemtable td{ border-right:1px solid #e2e2e2; border-bottom:1px solid #e2e2e2; padding:16px 18px;
  text-align:center; vertical-align:middle; font-size:14.5px; line-height:1.7; }
.krt .itemtable th.itemtitle{ background:#eef7fd; font-family:var(--krt-title); font-weight:700; color:var(--krt-blue-d);
  white-space:nowrap; width:150px; }
.krt .itemtable th.title{ background:#f6f6f6; font-family:var(--krt-title); font-weight:700; color:var(--krt-ink); }
.krt .itemtable th.title b{ color:#299ad5; font-weight:700; }
.krt .itemtable td{ color:#333; }
.krt .itemtable tr:first-child th{ font-size:16px; }
/* 料金セル（最終行）を強調：料金表(-price)のみ。比較表には適用しない */
.krt .itemtable.-price tr:last-child th.itemtitle{ color:var(--krt-red); }
.krt .itemtable.-price tr:last-child td{ color:var(--krt-red); font-family:var(--krt-title); font-weight:700; font-size:19px; }
/* 比較表(-vs)の自院列（2列目）を強調 */
.krt .itemtable.-vs td:nth-child(2){ background:#f4f9ff; text-align:left; }
.krt .itemtable.-vs td:nth-child(3){ text-align:left; color:#666; }
.krt .itemtable.-vs td b{ color:var(--krt-blue-d); }
.krt .itemtable.-vs th.title:nth-child(2){ background:var(--krt-blue); color:#fff; }
.krt .itemtable.-vs th.title:nth-child(2) *{ color:#fff; }

/* ---- 監修者プロフィール カード ---- */
.krt .krt-supervisor{ max-width:860px; margin:28px auto 0; background:#fff; border:1px solid var(--krt-border);
  border-radius:16px; padding:26px 32px; box-shadow:0 8px 24px rgba(51,117,206,.07); }
.krt .krt-supervisor .krt-sv-head{ display:flex; align-items:center; gap:12px; font-family:var(--krt-title);
  color:var(--krt-blue-d); font-size:16px; font-weight:700; padding-bottom:14px; margin-bottom:16px; border-bottom:2px solid var(--krt-water); }
.krt .krt-supervisor .krt-sv-head::before{ content:"監修"; flex:0 0 auto; background:var(--krt-blue); color:#fff;
  font-size:12px; padding:4px 12px; border-radius:9999px; letter-spacing:.08em; }
/* テキストは単一のflexアイテムにまとめて通常の行折り返しをさせる */
.krt .krt-supervisor .krt-sv-head .t{ flex:1 1 auto; min-width:0;
  font-family:inherit; font-weight:inherit; font-size:inherit; }
.krt .krt-supervisor ul{ margin:0; padding:0; list-style:none; }
.krt .krt-supervisor li{ position:relative; padding-left:22px; font-size:14px; line-height:1.9; margin-bottom:8px; }
.krt .krt-supervisor li:last-child{ margin-bottom:0; }
.krt .krt-supervisor li::before{ content:""; position:absolute; left:2px; top:.6em; width:9px; height:9px;
  border-radius:50%; background:var(--krt-teal); }

/* ============================ SP ============================ */
@media (max-width:768px){
  /* sp.css が .inner{padding-left:0;padding-right:0} にしているため、
     SPでは自前で左右余白を確保しないとコンテンツが画面端に張り付く。
     色地セクション(.krt-band)と .krt-footcta は自身に padding があるので対象外。 */
  .krt .krt-block > .inner{ padding-left:4vw; padding-right:4vw; box-sizing:border-box; }
  .krt .krt-block{ margin:14vw 0; }
  .krt .krt-band{ padding:14vw 4vw; }
  .krt .krt-cards{ gap:36px 16px; }
  .krt .krt-card{ flex:1 1 100%; max-width:none; }
  .krt .krt-risk-col{ flex:1 1 100%; }
  .krt .krt-lead{ text-align:left; font-size:14px; }
  .krt .krt-kpi .krt-badge{ padding:14px 32px; }
  .krt .krt-kpi .krt-badge .n{ font-size:42px; }
  .krt .krt-kpi .krt-catch{ font-size:18px; }
  .krt .krt-step .krt-num{ width:46px; height:46px; font-size:18px; }
  .krt .krt-step:not(:last-child)::after{ left:22px; top:50px; }
  .krt .krt-btn{ font-size:15px; padding:15px 26px; width:100%; }
  .krt .krt-approval .krt-approval-img{ width:100%; text-align:center; }

  /* ---- AUN 再修正分の SP 調整 ---- */
  .krt .krt-pagetitle{ font-size:5.6vw; margin-bottom:5.333vw; }
  .krt .krt-pagetitle .krt-pt-main{ font-size:6.933vw; }
  .krt .krt-cause li{ padding:3.733vw 4vw 3.733vw 10.667vw; font-size:4.267vw; }
  .krt .krt-cause li::before{ left:4.8vw; }
  .krt .krt-softcta{ padding:5.333vw 4.267vw; gap:4vw; }
  .krt .krt-softcta .t{ flex:1 1 100%; font-size:3.733vw; }
  .krt .krt-softcta .b{ width:100%; }
  .krt .krt-media{ padding:5.333vw 4.267vw; gap:4vw; }
  .krt .krt-media .krt-media-embed{ width:100%; }
  .krt .krt-media .krt-media-body{ flex:1 1 100%; }
  .krt .krt-media .krt-media-title{ font-size:4.267vw; }
  .krt .krt-media .krt-media-desc{ font-size:3.733vw; }
  /* SPは1カラム。.-two の指定は詳細度が高いのでSPでも明示的に戻す */
  .krt .krt-cards.-two{ max-width:none; }
  .krt .krt-cards.-two .krt-card{ flex:1 1 100%; max-width:none; }

  /* ---- テーブルはSPでカード型に積み替える ----
     min-width:640px の横スクロールだと3列目が画面外で内容を把握できないため、
     1行=1カード、各セルは data-label（＝どの治療/どちらの施設の値か）を見出しに
     して縦積みする。見出し行は data-label に情報が入るので非表示。 */
  .krt .table-container{ overflow-x:visible; }
  .krt .itemtable{ display:block; min-width:0; border:0; border-radius:0; background:transparent; }
  .krt .itemtable tbody{ display:block; }
  .krt .itemtable tr{ display:block; background:#fff; border:1px solid #e2e2e2;
    border-radius:8px; margin-bottom:3.733vw; overflow:hidden; }
  .krt .itemtable tr:first-child{ display:none; }
  .krt .itemtable th,
  .krt .itemtable td{ display:block; width:auto; border:0; text-align:left;
    padding:3.733vw 4.267vw; line-height:1.8; }
  .krt .itemtable th.itemtitle{ width:auto; white-space:normal; text-align:center;
    font-size:4.267vw; background:#eef7fd; }
  .krt .itemtable tr:first-child th{ font-size:4.267vw; }
  .krt .itemtable td{ font-size:4vw; }
  .krt .itemtable td:not(:last-child){ border-bottom:1px dashed #e2e2e2; }
  .krt .itemtable td::before{ content:attr(data-label); display:block;
    font-family:var(--krt-title); font-weight:700; font-size:3.733vw;
    color:var(--krt-blue); line-height:1.5; margin-bottom:1.6vw; }
  /* 料金表：金額を大きく。比較表：自院列だけ薄く色を敷いて区別 */
  .krt .itemtable.-price tr:last-child td{ font-size:5.333vw; }
  .krt .itemtable.-vs td:nth-child(2){ background:#f4f9ff; }
  .krt .itemtable.-vs td:nth-child(3){ background:#fff; }

  /* ---- SPの最小文字サイズ調整 ----
     PC値(px)がSPにそのまま効いて11〜12pxになる箇所や、3〜3.2vw指定の箇所が
     スマホで読みづらいため、補助テキストは最低13px(3.467vw)、
     本文系は14px(3.733vw)以上に引き上げる。 */
  /* PC側が .krt .krt-card .krt-chip{font-size:12px} と詳細度3なので、
     同等以上のセレクタで上書きする */
  .krt .krt-card .krt-chip,
  .krt .krt-card .krt-chip.-tag{ font-size:3.467vw; padding:1.333vw 3.2vw; }
  .krt .krt-supervisor .krt-sv-head::before{ font-size:3.467vw; }
  .krt .krt-supervisor .krt-sv-link::before{ font-size:3.2vw; }
  .krt .krt-kpi .krt-badge .s{ font-size:3.467vw; line-height:1.6; }
  .krt .krt-media .krt-media-src{ font-size:3.467vw; }
  .krt .krt-note{ font-size:3.467vw; }
  .krt .krt-hero .krt-access{ font-size:3.733vw; }
  .krt .krt-btn small{ font-size:3.467vw; }
  .krt .krt-cap-name small{ font-size:3.467vw; }
  .krt .krt-risk-col li{ font-size:3.733vw; }
  .krt .krt-supervisor li{ font-size:3.733vw; }
  .krt .krt-faq .krt-a,
  .krt .krt-faq .krt-a > div,
  .krt .krt-faq .krt-a p{ font-size:3.733vw; }
  .krt.krt-footcta .krt-footcta-note{ font-size:3.467vw; }
  /* パンくずが12px固定で小さいため */
  .krt .topicpath .txt{ font-size:3.467vw; }

  /* ---- SPの折り返し調整（末尾1〜3文字だけが次行に残る「孤立行」対策） ----
     いずれも「意図した1行分がわずかに収まらない」ケースなので、
     px固定だったサイズをvw基準にして数%小さくし1行に収める。
     実測(375px幅)で最終行が3.2文字以下だった要素が対象。 */
  /* nowrapにした「PRP-FD療法（PFC-FD2.0） 161,000円」が枠内に収まるよう左右余白を詰める */
  .krt .krt-hero{ padding:5.333vw 3.2vw; }
  /* 縦積みにすると主軸が縦になり justify-content:center が効かないので
     align-items:center で各行を中央に揃える */
  .krt .krt-hero .krt-price{ flex-direction:column; align-items:center; gap:1.6vw; font-size:3.733vw; }
  .krt .krt-hero .krt-price .krt-price-item + .krt-price-item::before{ content:none; }
  .krt .krt-hero .krt-price b{ font-size:4.8vw; }
  /* 見出し(.title.icon-title)：22px→18px相当。「〜も。」「〜科」の1文字残りを解消 */
  .krt .title.icon-title .text{ font-size:4.8vw; }
  /* お悩みチェックの見出しと各項目 */
  .krt .pagecheckboxitembox h3.title{ font-size:4.267vw; }
  .krt .pagecheckboxitembox .checklist li .txt{ font-size:3.733vw; }
  /* 受診の流れ：番号円と本文パディングで幅を取られているため、
     余白を詰めて小見出しを1行に収める */
  .krt .krt-step .krt-body{ padding:4vw 4.267vw; }
  .krt .krt-step{ gap:3.2vw; }
  .krt .krt-step .krt-q{ font-size:3.733vw; }
  /* 治療名の見出しピル：PRP-FD をハイフンで割らせない */
  .krt .krt-tx h3{ font-size:4.8vw; white-space:nowrap; padding:2.133vw 5.333vw; }
  /* data-label はハイフンを含むものだけ nowrap にする。
     全部に効かせると「再生医療を専門とする一般的なクリニック」のような
     長いラベルがカード幅を超えるため、属性セレクタで限定する。 */
  .krt .itemtable td[data-label*="PRP-FD"]::before{ white-space:nowrap; }
  /* 狭い端末で末尾1〜2文字だけ残るのを防ぐ */
  .krt .krt-card h4{ font-size:4.267vw; }
  .krt .krt-risk-col h4{ font-size:4vw; }
  /* フッターCTA見出しとボタン文言 */
  .krt.krt-footcta .krt-footcta-title{ font-size:4.533vw; }
  .krt .krt-btn{ font-size:3.733vw; padding:4vw 4.267vw; }

  /* footer共通パーツ側（<main class="krt"> の外）は body のテンプレートクラスで
     スコープし、このページのみ引き上げる */
  body.page-template-template-knee-regenerative .accessIndexBox .contents .itembox .txt{ font-size:3.467vw; }
  body.page-template-template-knee-regenerative .accessIndexBox .contents .mintxt{ font-size:3.733vw; }
  body.page-template-template-knee-regenerative .accessIndexBox .itembox dt{ font-size:4vw; }
  .krt.krt-footcta{ padding:10.667vw 4vw; margin-top:12vw; }
  /* ※見出しサイズは上の折り返し調整（4.533vw）が正。ここでは指定しない */
  .krt.krt-footcta .krt-footcta-lead{ font-size:3.733vw; text-align:left; }
  .krt.krt-footcta .krt-footcta-btns{ gap:3.2vw; }
  .krt.krt-footcta .krt-footcta-tel{ font-size:3.467vw; }
}
