/* =============================================================================
 *  KT CLINIC — 施術詳細ページ（single-treatment.php）
 *  2026-07-27 モック（KT施術詳細_低用量ピル_モックC.html）に合わせて全面刷新
 *  セレクタは .kt-trs 配下にスコープしている
 *
 *  1カラム・本文幅46rem（736px／1行およそ49字）。サイドバーは廃止。
 *  本文そのものの装飾は assets/css/richtext.css（.kt-rt）が持つ。
 * ========================================================================== */

/* 既存CSS（components.css）との衝突を打ち消す */
.kt-trs .hero{height:auto;}
.kt-trs .btn{font-size:1rem;font-weight:400;}

.kt-trs{color:var(--ink);font-family:var(--sans);line-height:1.75;}
.kt-trs *{box-sizing:border-box;}
.kt-trs a{color:inherit;text-decoration:none;}

.kt-trs .trs-inner{max-width:46rem;margin:0 auto;}
.kt-trs .trs-sec{padding:0 2.5rem;}
.kt-trs .trs-sec + .trs-sec{margin-top:4.5rem;}
.kt-trs .trs-cnc + .trs-sec{margin-top:4.5rem;}
.kt-trs .trs-sec:last-child{padding-bottom:6rem;}

.kt-trs .trs-h2{font-family:var(--serif);font-size:1.6rem;font-weight:500;letter-spacing:.06em;
                line-height:1.6;margin:0 0 1.6rem;padding-bottom:.95rem;
                border-bottom:1px solid var(--grey-line);}

/* リード文（kt_about_sections の「リード文」）。
   見出しではなく、そのセクションを1行で言い添えるコピーとして扱う。
   ゴールドと太字を外して、見出しの列から降ろしている。 */
.kt-trs .trs-sublead{font-size:.95rem;font-weight:400;color:var(--sub);line-height:2;
                     margin:-.5rem 0 1.4rem;}

/* ===== 1. ヒーロー ======================================================= */
.kt-trs .trs-hero{padding:1.75rem 2.5rem 0;}
.kt-trs .trs-hero-img{max-width:46rem;margin:0 auto 2rem;aspect-ratio:16/9;overflow:hidden;
                      background:var(--gold-soft);}
.kt-trs .trs-hero-img img{width:100%;height:100%;object-fit:cover;display:block;}
.kt-trs .trs-hero-body{max-width:46rem;margin:0 auto;}
.kt-trs .trs-meta{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1.1rem;margin:0 0 1rem;}
.kt-trs .trs-cat{display:inline-flex;align-items:center;gap:.7rem;font-size:.78rem;
                 letter-spacing:.14em;color:var(--gold-deep);}
.kt-trs .trs-cat::before{content:"";width:26px;height:1px;background:var(--gold);}
.kt-trs .trs-bdg{font-size:.7rem;letter-spacing:.08em;padding:.28rem .8rem;border-radius:3px;
                 border:1px solid var(--grey-line);color:var(--sub);}
.kt-trs .trs-bdg.is-jihi{color:var(--gold-deep);border-color:var(--gold-line);background:var(--cream2);}
.kt-trs .trs-bdg.is-new{background:var(--gold);border-color:var(--gold);color:#fff;font-weight:700;}
.kt-trs .trs-bdg.is-rec{background:var(--gold-soft);border-color:var(--gold-line);color:var(--gold-deep);}
.kt-trs .trs-title{font-family:var(--serif);font-size:2.35rem;font-weight:500;letter-spacing:.05em;
                   line-height:1.5;margin:0 0 1.2rem;}
.kt-trs .trs-lead{font-size:.95rem;line-height:2.1;color:var(--sub);margin:0;}

/* キャンペーンの画像を借りているときの導線。
   画像だけ流用して終わらないよう、キャンペーンページへ送る帯を1本出す。 */
/* .trs-cmp（キャンペーンへのリンク）は 2026-08-08 に削除。単独ページを持たせないため。 */

/* ===== 2. こんなお悩みはありませんか ===================================== */
.kt-trs .trs-cnc{margin-top:4.5rem;background:var(--cream2);padding:3.75rem 2.5rem;}
.kt-trs .trs-cnc-inner{max-width:46rem;margin:0 auto;}
.kt-trs .trs-cnc-h2{font-family:var(--serif);font-size:1.6rem;font-weight:500;letter-spacing:.06em;
                    text-align:center;margin:0 0 2.1rem;}
.kt-trs .trs-cnc-list{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
                      gap:.9rem 2.5rem;margin:0;padding:0;list-style:none;}
.kt-trs .trs-cnc-list li{display:flex;gap:.85rem;align-items:flex-start;font-size:.92rem;line-height:1.9;}
.kt-trs .trs-cnc-list li::before{content:"";flex:none;width:7px;height:7px;margin-top:.65rem;
                                 border-radius:50%;background:var(--gold);}

/* ===== 5. 受診の流れ ===================================================== */
.kt-trs .trs-flw-item{display:flex;gap:1.5rem;padding-bottom:1.9rem;position:relative;}
.kt-trs .trs-flw-item:last-child{padding-bottom:0;}
.kt-trs .trs-flw-item::before{content:"";position:absolute;left:1.1rem;top:2.4rem;bottom:0;
                              width:1px;background:var(--gold-line);}
.kt-trs .trs-flw-item:last-child::before{display:none;}
.kt-trs .trs-flw-num{flex:none;width:2.2rem;height:2.2rem;border:1px solid var(--gold-line);
                     border-radius:50%;display:flex;align-items:center;justify-content:center;
                     background:#fff;font-family:var(--serif);font-size:.9rem;
                     color:var(--gold-deep);position:relative;z-index:1;}
.kt-trs .trs-flw-t{font-size:1rem;font-weight:500;margin:.2rem 0 .4rem;}
.kt-trs .trs-flw-d{font-size:.88rem;line-height:1.95;color:var(--sub);margin:0;}

/* ===== 4. 料金 ========================================================== */
/* 料金表そのものは assets/css/price-table.css（.kt-ptbl）が持つ。
   料金一覧ページと共通。2026-08-01 まで、ここに同じ値が別のクラス名で
   二重に書かれていた。**このファイルに料金の行の指定を戻さないこと。** */
.kt-trs .trs-cau-list li::before{content:"";flex:none;width:5px;height:5px;margin-top:.72rem;
                                 border-radius:50%;background:#C9C2B6;}

/* ===== 7. よくあるご質問 ================================================= */
.kt-trs .trs-faq{border-bottom:1px solid var(--grey-line);}
.kt-trs .trs-faq-sum{display:flex;align-items:flex-start;gap:.9rem;padding:1.15rem .25rem;
                     cursor:pointer;list-style:none;font-size:.94rem;}
.kt-trs .trs-faq-sum::-webkit-details-marker{display:none;}
.kt-trs .trs-faq-q{flex:none;font-family:var(--serif);color:var(--gold-deep);font-size:.95rem;
                   line-height:1.75;}
.kt-trs .trs-faq-t{flex:1;line-height:1.75;}
.kt-trs .trs-faq-tg{flex:none;color:#C9C2B6;font-size:1rem;transition:transform .25s;}
.kt-trs .trs-faq[open] .trs-faq-tg{transform:rotate(45deg);}
.kt-trs .trs-faq-a{padding:0 .25rem 1.3rem 2.1rem;font-size:.89rem;line-height:2;color:var(--sub);}

/* ===== 8. 関連する診療 =================================================== */
.kt-trs .trs-rel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1rem;}
.kt-trs .trs-rel-card{border:1px solid var(--grey-line);padding:1.3rem 1.35rem;transition:all .25s;
                      display:flex;flex-direction:column;}
.kt-trs .trs-rel-card:hover{border-color:var(--gold-line);background:var(--cream2);}
.kt-trs .trs-rel-cat{font-size:.7rem;letter-spacing:.08em;color:var(--sub);margin:0 0 .5rem;}
.kt-trs .trs-rel-name{font-size:.95rem;font-weight:500;line-height:1.7;margin:0 0 1.1rem;}
.kt-trs .trs-rel-more{font-size:.78rem;color:var(--gold-deep);display:flex;align-items:center;
                      gap:.4rem;margin-top:auto;}

/* ===== スマホ =========================================================== */
@media (max-width:1080px){
  .kt-trs .trs-hero{padding:1rem 1.25rem 0;}
  .kt-trs .trs-hero-img{margin-bottom:1.6rem;}
  .kt-trs .trs-title{font-size:1.6rem;}
  .kt-trs .trs-lead{font-size:.9rem;}
  .kt-trs .trs-sec{padding:0 1.25rem;}
  .kt-trs .trs-sec + .trs-sec{margin-top:3.25rem;}
  .kt-trs .trs-cnc + .trs-sec{margin-top:3.25rem;}
  .kt-trs .trs-sec:last-child{padding-bottom:4rem;}
  .kt-trs .trs-h2{font-size:1.3rem;margin-bottom:1.35rem;}
  .kt-trs .trs-cnc{margin-top:3.25rem;padding:2.75rem 1.25rem;}
  .kt-trs .trs-cnc-h2{font-size:1.3rem;text-align:left;margin-bottom:1.5rem;}
  .kt-trs .trs-cnc-list{grid-template-columns:minmax(0,1fr);gap:.75rem;}
  .kt-trs .trs-prc-hoken{padding:1.25rem 1.35rem;}
  .kt-trs .trs-prc-row{flex-wrap:wrap;gap:.3rem 1rem;padding:1rem .25rem;}
  /* 料金一覧ページと同じ値にすること */
  .kt-trs .trs-prc-yen{margin-left:auto;font-size:1.25rem;}
  .kt-trs .trs-rel{gap:.85rem;}
  .kt-trs .trs-rel-card{padding:1.05rem 1.1rem;}
  .kt-trs .trs-rel-name{font-size:.88rem;}
}