/* 字の大きさの段（TODO-0249・提案-0174。2026-11-12）
   サイト全体で、本文・小さい字・h1〜h4 の大きさをそろえる。look=on のときだけ効く。各ページの本文は書き換えない。
   もとになるのは「本文の大きさ」1つだけ（px。テーマ ANTHEM が本文を px で決めているのに合わせる）。ほかの段はその何倍かで決める
   （knowledge/operations.md の【決定】h2＝1.6・h3＝1.3・h4＝1.2 倍。em を入れ子にすると 0.9em の中の 0.9em で小さくなっていくので、倍率は変数で掛ける）。
   スマホは幅 375px で h2 が3〜4行に折れないように、倍率を少し下げる（h2 1.47・h3 1.2・h4 1.07）。
   このファイルは最後に読む（perf.php の ASCOLO_PERF_CSS の一番後ろ）。前の CSS（common・build・lineup・post・product）の大きさを上書きする */

body.look-on{
  --lk-fs-body:16px;
  --lk-fs-small:calc(var(--lk-fs-body) * .8125);   /* 13px：注・札・日付・肩書き。これより小さくしない */
  --lk-fs-h1:calc(var(--lk-fs-body) * 2);          /* 32px：ページの題 */
  --lk-fs-h2:calc(var(--lk-fs-body) * 1.6);        /* 25.6px */
  --lk-fs-h3:calc(var(--lk-fs-body) * 1.3);        /* 20.8px */
  --lk-fs-h4:calc(var(--lk-fs-body) * 1.2);        /* 19.2px */
}
@media (max-width:767px){
  body.look-on{
    --lk-fs-body:15px;
    --lk-fs-small:calc(var(--lk-fs-body) * .8333); /* 12.5px */
    --lk-fs-h1:calc(var(--lk-fs-body) * 1.6);      /* 24px */
    --lk-fs-h2:calc(var(--lk-fs-body) * 1.4667);   /* 22px */
    --lk-fs-h3:calc(var(--lk-fs-body) * 1.2);      /* 18px */
    --lk-fs-h4:calc(var(--lk-fs-body) * 1.0667);   /* 16px */
  }
}

/* ---------- TCD の編集プラグイン（tcd-classic-editor）の大きさの変数を、この段につなぐ ---------- */
body.look-on, body.look-on :is(.styled_h2,.styled_h3,.styled_h3_product,.styled_h4,.custom_h5,.custom_h6,.custom_ul,.custom_ol,.custom_box,.custom_box_w_border,.tcdce-sb){
  --tcdce-h2-font-size-pc:var(--lk-fs-h2); --tcdce-h2-font-size-sp:var(--lk-fs-h2);
  --tcdce-h3-font-size-pc:var(--lk-fs-h3); --tcdce-h3-font-size-sp:var(--lk-fs-h3);
  --tcdce-h4-font-size-pc:var(--lk-fs-h4); --tcdce-h4-font-size-sp:var(--lk-fs-h4);
  --tcdce-h5-font-size-pc:var(--lk-fs-body); --tcdce-h5-font-size-sp:var(--lk-fs-body);
  --tcdce-h6-font-size-pc:var(--lk-fs-body); --tcdce-h6-font-size-sp:var(--lk-fs-body);
  --tcdce-ul-font-size-pc:var(--lk-fs-body); --tcdce-ul-font-size-sp:var(--lk-fs-body);
  --tcdce-ol-font-size-pc:var(--lk-fs-body); --tcdce-ol-font-size-sp:var(--lk-fs-body);
  --tcdce-box-font-size-pc:var(--lk-fs-body); --tcdce-box-font-size-sp:var(--lk-fs-body);
  --tcdce-sb-font-size-pc:var(--lk-fs-body); --tcdce-sb-font-size-sp:var(--lk-fs-body);
}

/* ---------- 本文 ---------- */
/* テーマの本文（記事・固定ページ。テーマの設定は PC 16px・スマホ 14px） */
body.look-on :is(#article .post_content, .post_content, .tcdce-body){font-size:var(--lk-fs-body)!important}

/* 本文に直接書いた 0.88〜0.95em（段落・箇条書き・箱・表）は、本文の大きさに戻す。
   :where で優先度を body.look-on だけにして、下の部品ごとの段（本文・小さい字）の方が勝つようにする（例：あすコロ通信の特典の説明 mm-gift-text は 0.85em と書いてあるが本文）。
   文の途中の span（値段の「（税込）」など）は、まわりとのつり合いで決めているので触らない。見出し・ボタンの中も触らない */
body.look-on :where(.post_content) :where(p,ul,ol,li,div,td,th,table,dd,dt,blockquote):where(
  [style*="font-size:0.9em"],[style*="font-size: 0.9em"],[style*="font-size:0.88em"],[style*="font-size: 0.88em"],
  [style*="font-size:0.92em"],[style*="font-size: 0.92em"],[style*="font-size:0.95em"],[style*="font-size: 0.95em"]
):not(:where(h1,h2,h3,h4,h5,h6,a,button) *){font-size:var(--lk-fs-body)!important}

/* 商品のページ・共通の部品で、本文なのに 0.9em ほどに小さくしていた所（2026-11-12 に全ページを測って拾った） */
body.look-on :is(
  .nls-lineup-card-desc,.nls-lineup-entry-eyebrow,.nls-lineup-entry-body p,.nls-shindan-hero-body p,
  .ap-step-desc,.ap-counseling-text,.kk-promise-text,.nb-promise-text,.kk-step-text,.nb-step-text,.kk-support,.nb-support,
  .tb-pdf-card p,.tb-step-card p,.wt-step-card-body,.wt-apdel-box p,.wt-message,
  .history-desc,.mission-value-desc,.feature-desc,.mm-faq-a,.mm-gift-text,
  .nls-kaitai-duo-desc,.nls-kaitai__diag-text,.nls-dandism-card-desc,.nls-dandism-scene-item,.nls-profile-desc,
  .p-toc ul,.p-toc li,
  .wt-step-card-body p,.wt-dl-all-body ul,.tb-step-card-body ul,.tb-compare-yes ul,.tb-compare-no ul,.tb-ch0-nudge,
  .ty-mail-trouble ul,.ks-important p,.ks-support,.nls-kaitai-toc-col ol,.company-table :is(th,td),
  :is(.ap-section-head,.tb-section-head,.kk-section-head,.nb-section-head,.wt-section-head,.mm-section-head) > p
){font-size:var(--lk-fs-body)!important}
/* このプラグインの部品（トップ・ラインナップ・よくある質問） */
body.look-on :is(
  .ascolo-about-body p,.ascolo-tt-bridge p:not(.ascolo-tt-q),.ascolo-top-kimochi .pain-item,
  .ascolo-lineup-item .text,.ascolo-lineup-item ul.for li,
  .is-acc .acc-a
){font-size:var(--lk-fs-body)!important}
body.look-on.ascolo-acc-page .is-acc .acc-q{font-size:var(--lk-fs-body)!important}

/* ---------- 小さい字（注・札・日付・肩書き）：これより小さくしない ---------- */
body.look-on :is(
  .nls-video-reveal-note,.nls-vmsg-note,.nls-vmsg-subtitle,.nls-form-note,.nls-form-required,.haveto,
  .nls-trust-card-label,.nls-profile-tag,.nls-lineup-card-tags,.nls-lineup-entry-note,.nls-lineup-card-badge,.nls-shindan-hero-badge,
  .nls-flow-step-num,.nls-flow-step-desc,.nls-kaitai-badge,
  .ap-purchase-note,.ap-step-note,.ap-eyebrow,.ap-badge,
  .tb-purchase-note,.tb-eyebrow,.tb-step-badge,.tb-price-special-tag,.tb-sm-btn-preview,
  .kk-eyebrow,.nb-eyebrow,.kk-hero-badge,.nb-hero-badge,.kk-purchase-price-unit,.nb-purchase-price-unit,
  .wt-eyebrow,.wt-step-badge,.mm-gift-badge,.serious-link-desc,.well2,
  .tb-purchase-contents,.kk-purchase-contents,.nb-purchase-contents,.ap-purchase-discount,.ap-guarantee,.tb-purchase-ch0,.wt-refund,
  .tb-product-contents li,.tb-price-box-label,.tb-contents-item-label,.tb-price-note,.nls-kaitai-secure,
  .ks-signature-role,.ty-signature-role,
  li.date,li.category,li.post_tag,
  .any,.tb-sm-btn-preview :is(p,a),.nb-diff-col-title,.kk-diff-col-title
){font-size:var(--lk-fs-small)!important}
/* 本文に直接書いた 0.78〜0.85em の段落・箱（注・署名など）も、小さい字の段に（span は触らない） */
body.look-on :where(.post_content) :where(p,div,li,ul):where(
  [style*="font-size:0.78em"],[style*="font-size: 0.78em"],[style*="font-size:0.8em"],[style*="font-size: 0.8em"],
  [style*="font-size:0.82em"],[style*="font-size: 0.82em"],[style*="font-size:0.85em"],[style*="font-size: 0.85em"]
):not(:where(h1,h2,h3,h4,h5,h6,a,button) *){font-size:var(--lk-fs-small)!important}

/* ---------- 見出し ---------- */
/* h2：記事の中・商品のページの段・共通の部品（はじめての方はこちら・ラインナップ）・トップの段・記事の下の「こんな記事も」で1つの大きさ。
   入れないもの：トップの一番上の大きな言葉・診断の箱の題（nls-tph-title。箱ごとに決めている）・記事の一覧の題（h2.title）・
   会員ページの部品（pmpro）・お客様の声の名前（見出しではなく名前なので、h4 の大きさ） */
body.look-on .post_content h2:not(.nls-tph-title,.title,.pmpro_card_title,.pmpro_form_heading,.wpmtst-testimonial-field),
body.look-on :is(.cb_catch,h2.headline,.nls-lineup-section-title,.cat-title){font-size:var(--lk-fs-h2)!important;line-height:1.55!important}
body.look-on .post_content h3:not(.title,.nls-tph-title,.pmpro_card_title,.faq-q),
body.look-on :is(.nls-lineup-card-title,.nls-lineup-entry-headline,.nls-dandism-card-title){font-size:var(--lk-fs-h3)!important;line-height:1.6!important}
body.look-on .post_content h4:not(.title){font-size:var(--lk-fs-h4)!important;line-height:1.6!important}
body.look-on .wpmtst-testimonial-field.testimonial-name{font-size:var(--lk-fs-h4)!important}
/* 見出しの中の小さい札・飾り（「（無料）」など）は、見出しとのつり合い（em）のまま */

/* h1：ページの題。スマホで h2 より小さくなっていた（20px）ので、h2 より大きく */
@media (max-width:767px){
  body.look-on #page_header .catch{font-size:var(--lk-fs-h1)!important;line-height:1.5!important}
}

/* ---------- このプラグインが出す見出しの h タグ（2026-11-12。TODO-0249 の続き。top.php・lineup.php） ----------
   トップとラインナップの段の名前（知る・受け取る・試す・進める・続ける）を h3、ラインナップの商品の名前を h4、
   よくある質問の問いを h3 にした。テーマ・編集プラグインが本文の見出しに付ける余白・行の高さ・字の間隔は打ち消し、大きさは段にそろえる */
body.look-on :is(.ascolo-kaidan-head,.ascolo-lineup-head) h3.name{
  margin:0!important;padding:0!important;border:0!important;background:none!important;
  font-size:var(--lk-fs-h3)!important;line-height:1.3!important;letter-spacing:inherit!important;color:var(--lk-main-deep)!important;
}
body.look-on .ascolo-lineup-item h4.title{
  margin:0!important;padding:0!important;border:0!important;background:none!important;
  font-size:var(--lk-fs-h4)!important;line-height:1.5!important;letter-spacing:inherit!important;
}
/* よくある質問の問い：大きさは見出しの段ではなく、PC は本文の 1.1倍（17.6px）・スマホは本文と同じ（15px）。前はスマホでトップとラインナップが違っていた（15.4px と 13.3px） */
body.look-on .faq-list h3.faq-q{
  margin:0!important;padding:16px 44px 16px 20px!important;border:0;background:none;
  font-size:calc(var(--lk-fs-body) * 1.1)!important;line-height:1.5!important;letter-spacing:inherit!important;
}
body.look-on .faq-list h3.faq-q .faq-q-text{font-size:inherit!important}
/* スマホは本文と同じ大きさ（15px）。1.1倍だと、ラインナップの細い欄で「無料動画セミナーっ／て、」と言葉の途中で折れた */
@media (max-width:767px){ body.look-on .faq-list h3.faq-q{padding:14px 44px 14px 16px!important;font-size:var(--lk-fs-body)!important} }
