/* Pharma-Ad Report 記事の共通CSS
   2026-09-18 に kanshi-kyouka/index.html の <style> 3ブロックを切り出して作成。
   既存記事（banner-listing / shobun-jirei / kanshi-kyouka / mushounin-iyakuhin）は
   自前の <style> を持ったまま。見た目の検証が済むまで移行しない。
   新しい記事はこのファイルを link して、HTMLの中身だけ書く。 */

:root{
    --accent:var(--signal); --accent-deep:var(--signal-deep);

    /* 骨格はトップ（assets/site.css）と同じ値にそろえた（2026-09-18・B案）。
       同じドメイン・同じ看板・同じ監修者なので、行き来したときに別サイトに見えないようにする。 */
    --paper:#fbfaf7;--card:#ffffff;--ink:#12241f;--ink-2:#4a5c57;--ink-3:#62706c;
    --line:#e4dfd2;--line-2:#f0ebe0;

    /* アクセントはティールのまま。トップのオレンジ（#c33f19）は「相談してください」の色、
       こちらは「記録です」の色。メディアは中立に見えたほうが価値が出る。 */
    --signal:#0d8f9e;--signal-deep:#0a6f7b;--signal-wash:#e4f1f3;
    --risk:#c33f19;--risk-wash:#f7e8e2;--warn:#8a6420;--warn-wash:#f6eed6;

    --radius:14px;--shadow:0 1px 2px rgba(18,36,31,.04),0 8px 24px rgba(18,36,31,.05);
    --font:'Zen Kaku Gothic New',"Hiragino Kaku Gothic ProN","Hiragino Sans","Noto Sans JP",system-ui,sans-serif;
    --disp:'Space Grotesk',sans-serif;
    --mono:'Space Grotesk',"SF Mono",ui-monospace,Menlo,Consolas,monospace;
  }
  @media (prefers-color-scheme:dark) and (min-width:99999px) /* ライト固定 2026-09-18 */{:root{
    --paper:#0b1218;--card:#111d26;--ink:#eaf1f4;--ink-2:#b3c4cd;--ink-3:#7e929d;
    --line:#25353f;--line-2:#1b2a33;--signal:#3ec3d1;--signal-deep:#6fd6e1;--signal-wash:#123034;
    --risk:#f08a6e;--risk-wash:#2a1610;--warn:#e0b455;--warn-wash:#2a2310;
    --shadow:0 1px 2px rgba(0,0,0,.4),0 10px 34px rgba(0,0,0,.45);
  }}
  :root[data-theme="dark"]{
    --paper:#0b1218;--card:#111d26;--ink:#eaf1f4;--ink-2:#b3c4cd;--ink-3:#7e929d;
    --line:#25353f;--line-2:#1b2a33;--signal:#3ec3d1;--signal-deep:#6fd6e1;--signal-wash:#123034;
    --risk:#f08a6e;--risk-wash:#2a1610;--warn:#e0b455;--warn-wash:#2a2310;
  }
  *{box-sizing:border-box}
  body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);
    line-height:1.75;-webkit-font-smoothing:antialiased;letter-spacing:.01em}
  .wrap{max-width:880px;margin:0 auto;padding:0 20px}
  .top{background:#08131c;color:#eaf3f4;padding:48px 0 40px}
  .top .eyebrow{font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:#31c3d1;font-weight:700;margin:0 0 14px}
  .top h1{font-size:clamp(1.6rem,4vw,2.3rem);margin:0;line-height:1.3;letter-spacing:.02em;text-wrap:balance}
  .top .meta{margin:22px 0 0;color:#8fb2b8;font-size:.86rem;line-height:1.9;border-top:1px solid rgba(143,178,184,.2);padding-top:16px}
  .top .meta b{color:#cfe4e7;font-weight:600}
  section{padding:34px 0}
  h2{font-size:clamp(1.2rem,2.6vw,1.5rem);margin:0 0 8px;letter-spacing:.02em;text-wrap:balance}
  .eyebrow{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--signal-deep);font-weight:700;margin:0 0 12px}
  .callout{background:var(--risk-wash);border:1px solid color-mix(in srgb,var(--risk) 30%,transparent);
    border-radius:var(--radius);padding:22px 24px;margin:6px 0 0}
  .callout p{margin:0;color:var(--ink);font-size:.98rem}
  .callout b{color:var(--risk)}
  .ad{background:var(--card);border:1px solid var(--line);border-left:3px solid var(--signal);
    border-radius:10px;padding:20px 22px;box-shadow:var(--shadow);color:var(--ink-2);font-size:.96rem;line-height:1.95}
  .finding{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
    box-shadow:var(--shadow);padding:22px 24px;margin-top:16px}
  .finding .fhead{display:flex;align-items:flex-start;gap:12px;flex-wrap:wrap;margin-bottom:12px}
  .finding .fnum{font-family:var(--mono);font-size:.8rem;font-weight:700;color:var(--signal-deep);flex:none;margin-top:3px}
  .finding h3{margin:0;font-size:1.05rem;letter-spacing:.01em;flex:1;min-width:200px}
  .badge{font-size:.72rem;font-weight:800;letter-spacing:.06em;padding:4px 11px;border-radius:999px;flex:none;white-space:nowrap}
  .badge.crit{background:var(--risk-wash);color:var(--risk);border:1px solid color-mix(in srgb,var(--risk) 35%,transparent)}
  .badge.warn{background:var(--warn-wash);color:var(--warn);border:1px solid color-mix(in srgb,var(--warn) 35%,transparent)}
  .frow{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;font-size:.9rem}
  .frow dt{color:var(--ink-3);font-weight:700;white-space:nowrap}
  .frow dd{margin:0;color:var(--ink-2)}
  .frow dd b{color:var(--ink)}
  .law{font-family:var(--mono);font-size:.82rem;color:var(--signal-deep)}
  .verdict{background:var(--risk-wash);border:1px solid color-mix(in srgb,var(--risk) 35%,transparent);
    border-radius:var(--radius);padding:24px 26px;margin-top:6px}
  .verdict .v{font-size:1.15rem;font-weight:800;color:var(--risk);margin:0 0 14px}
  .verdict ol{margin:0;padding-left:1.2em;color:var(--ink-2)}
  .verdict li{margin-bottom:10px}
  .verdict li b{color:var(--ink)}
  .foot{background:#08131c;color:#8fb2b8;padding:40px 0}
  .foot .name{color:#eaf3f4;font-weight:700;font-size:1.05rem;margin:0 0 4px}
  .foot .quals{font-size:.84rem;margin:8px 0 18px}
  .foot a{color:#31c3d1;font-weight:700;text-decoration:none}
  .foot .note{font-size:.78rem;margin-top:18px;border-top:1px solid rgba(143,178,184,.2);padding-top:16px;line-height:1.7}
  .lead{color:var(--ink-2);font-size:1rem;margin:0 0 18px;max-width:62ch}
.btn{display:inline-block;padding:15px 30px;border-radius:999px;font-weight:700;
    text-decoration:none;letter-spacing:.03em;font-size:1rem}
  .btn-primary{background:var(--signal);color:#04222a}
  .btn-ghost{border:1px solid var(--line);color:var(--ink-2);background:var(--card)}
  .lead{font-size:1.04rem;color:var(--ink-2);margin:10px 0 0;line-height:1.9}
  h3{font-size:1.06rem;margin:26px 0 6px;letter-spacing:.01em}
  p{margin:12px 0 0;color:var(--ink-2);line-height:1.95}
  ul.plain{margin:12px 0 0;padding-left:1.15em;color:var(--ink-2)}
  ul.plain li{margin:9px 0;line-height:1.9}
  table.t{width:100%;border-collapse:collapse;margin:16px 0 0;font-size:.93rem;background:var(--card);
    border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
  table.t th,table.t td{padding:12px 14px;border-bottom:1px solid var(--line-2);text-align:left;vertical-align:top}
  table.t th{background:var(--signal-wash);font-weight:700;color:var(--ink);white-space:nowrap}
  table.t tr:last-child td{border-bottom:0}
  .box{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
    padding:22px 24px;margin:18px 0 0;box-shadow:var(--shadow)}
  .box h3{margin-top:0}
  .cta{background:#08131c;color:#eaf3f4;border-radius:var(--radius);padding:34px 30px;margin:8px 0 0;text-align:center}
  .cta h2{color:#fff;margin:0 0 10px}
  .cta p{color:#a8c6cc;margin:0 0 22px;font-size:.95rem}
  .toc{background:var(--card);border:1px solid var(--line-2);border-radius:var(--radius);padding:20px 24px;margin:20px 0 0}
  .toc ol{margin:8px 0 0;padding-left:1.3em;color:var(--ink-2)}
  .toc li{margin:6px 0}
  .toc a{color:var(--signal-deep);text-decoration:none}
  .toc a:hover{text-decoration:underline}
/* 一次資料リンクカード（shobun-jirei と同一） */
  .news{margin:18px 0 0}
  .news .nlabel{font-size:.71rem;color:var(--ink-3);font-weight:800;letter-spacing:.1em;margin-bottom:10px}
  .lcard{display:block;text-decoration:none;color:inherit;position:relative;
    background:var(--card);border:1px solid var(--line);border-radius:10px;padding:15px 40px 15px 17px;margin:9px 0 0;transition:.14s}
  .lcard:hover{border-color:var(--accent);box-shadow:0 3px 14px rgba(16,34,46,.08)}
  .lcard .site{display:inline-block;font-size:.72rem;font-weight:800;letter-spacing:.04em;
    color:var(--accent-deep);background:var(--accent-wash);border:1px solid rgba(11,125,146,.22);
    padding:3px 9px;border-radius:4px;margin-bottom:9px}
  .lcard .ltitle{font-size:.9rem;font-weight:700;color:var(--ink);line-height:1.6;margin:0}
  .lcard .dom{display:block;margin-top:8px;font-size:.75rem;color:var(--ink-3);font-weight:600;letter-spacing:.02em}
  .lcard .ext{position:absolute;top:15px;right:15px;color:var(--ink-3);font-size:.92rem}
  .lcard.official{border-color:rgba(11,125,146,.4);background:linear-gradient(180deg,var(--accent-wash) 0%,#fff 70%)}
  .lcard.official .site{background:var(--accent-deep);color:#fff;border-color:var(--accent-deep)}

/* ============================================================
   メディアの骨格（2026-09-18 追加）
   「1枚のドキュメント」から「メディアの中の1記事」に変えるための層。
   グローバルヘッダー／パンくず／記事メタ／2カラム／サイドバー／関連記事。
   ============================================================ */

/* --- グローバルヘッダー（全記事共通・固定） --- */
.ghead{position:sticky;top:0;z-index:50;background:var(--card);
  border-bottom:1px solid var(--line);backdrop-filter:saturate(180%) blur(8px)}
.ghead .in{max-width:1180px;margin:0 auto;padding:0 24px;height:58px;
  display:flex;align-items:center;gap:26px}
.ghead .brand{font-weight:800;font-size:1.02rem;letter-spacing:.01em;color:var(--ink);
  text-decoration:none;white-space:nowrap}
.ghead .brand span{color:var(--signal)}
.ghead nav{display:flex;gap:20px;margin-left:auto;align-items:center}
.ghead nav a{font-size:.85rem;color:var(--ink-2);text-decoration:none;white-space:nowrap}
.ghead nav a:hover{color:var(--signal)}
.ghead nav a.cta{background:var(--signal);color:#04222a;font-weight:700;
  padding:8px 15px;border-radius:999px}
@media(max-width:820px){.ghead nav a.hide-sp{display:none}.ghead .in{gap:14px;padding:0 16px}}

/* --- パンくず --- */
.crumb{max-width:1180px;margin:0 auto;padding:14px 24px 0;font-size:.78rem;color:var(--ink-3)}
.crumb a{color:var(--ink-3);text-decoration:none}
.crumb a:hover{color:var(--signal)}
.crumb span{margin:0 7px;opacity:.55}

/* --- 記事ヘッダー（黒帯をやめ、紙の上に置く） --- */
.ahead{max-width:1180px;margin:0 auto;padding:18px 24px 26px}
.ahead .metaline{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.ahead .cat{font-size:.72rem;font-weight:800;letter-spacing:.08em;color:var(--signal-deep);
  background:var(--signal-wash);padding:5px 11px;border-radius:4px}
.ahead .date{font-family:var(--mono);font-size:.78rem;color:var(--ink-3)}
.ahead .by{font-size:.78rem;color:var(--ink-3)}
.ahead h1{font-size:2.05rem;line-height:1.5;letter-spacing:.005em;margin:0;color:var(--ink)}
.ahead .lead{font-size:1.02rem;color:var(--ink-2);line-height:1.95;margin-top:16px;max-width:760px}
@media(max-width:820px){.ahead h1{font-size:1.5rem}.ahead{padding:14px 16px 20px}}

/* --- 2カラム --- */
.shell{max-width:1180px;margin:0 auto;padding:0 24px 60px;
  display:grid;grid-template-columns:minmax(0,1fr) 296px;gap:48px;align-items:start}
.shell .main{min-width:0}
.shell .side{align-self:start}  /* sticky にしない：サイドバーがビューポートより高いと下のブロック（広告枠）が
     画面外に固定されて永久に見えなくなる。2026-09-18 に実際そうなった。 */
@media(max-width:980px){.shell{grid-template-columns:1fr;gap:36px}
  .shell .side{position:static}}
@media(max-width:820px){.shell{padding:0 16px 40px}}

/* 本文は読める幅で止める（画面幅いっぱいに流さない） */
.shell .main > *{max-width:720px}
.shell .main h2{font-size:1.32rem;margin:40px 0 4px;padding-top:22px;
  border-top:1px solid var(--line-2);letter-spacing:.005em}
.shell .main h2:first-child{border-top:0;padding-top:0;margin-top:0}
.shell .main h3{font-size:1.04rem;margin:26px 0 2px}
.shell .main p{font-size:.985rem;line-height:2.05}
.shell .main blockquote.box{margin:20px 0;padding:18px 20px;border-left:3px solid var(--signal);
  border-radius:0 8px 8px 0;background:var(--signal-wash)}
.shell .main blockquote.box p{margin:0;color:var(--ink-2)}

/* --- サイドバーのブロック --- */
.swid{background:var(--card);border:1px solid var(--line);border-radius:10px;
  padding:18px 18px 20px;margin-bottom:18px}
.swid .st{font-size:.72rem;font-weight:800;letter-spacing:.1em;color:var(--ink-3);
  margin-bottom:13px;text-transform:uppercase}
.swid .who{font-weight:700;font-size:.94rem;color:var(--ink);line-height:1.6}
.swid .q{font-size:.8rem;color:var(--ink-3);line-height:1.85;margin-top:8px}
.swid ol{list-style:none;margin:0;padding:0}
.swid ol li{border-top:1px solid var(--line-2);padding:11px 0}
.swid ol li:first-child{border-top:0;padding-top:0}
.swid ol a{text-decoration:none;color:var(--ink-2);font-size:.86rem;line-height:1.7;display:block}
.swid ol a:hover{color:var(--signal)}
.swid ol .d{font-family:var(--mono);font-size:.68rem;color:var(--ink-3);display:block;margin-bottom:3px}
.swid .scta{display:block;text-align:center;background:var(--signal);color:#04222a;
  font-weight:700;font-size:.9rem;padding:13px;border-radius:8px;text-decoration:none}
.swid .sub{font-size:.78rem;color:var(--ink-3);text-align:center;margin-top:9px;line-height:1.7}

/* --- 記事下の関連記事 --- */
.rel{border-top:1px solid var(--line);margin-top:54px;padding-top:30px;max-width:720px}
.rel .rt{font-size:.72rem;font-weight:800;letter-spacing:.1em;color:var(--ink-3);margin-bottom:16px}
.rel .grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:700px){.rel .grid{grid-template-columns:1fr}}
.rel a.rc{display:block;text-decoration:none;color:inherit;background:var(--card);
  border:1px solid var(--line);border-radius:10px;padding:15px 16px;transition:.14s}
.rel a.rc:hover{border-color:var(--signal);box-shadow:0 3px 14px rgba(16,34,46,.08)}
.rel a.rc .c{font-size:.68rem;font-weight:800;letter-spacing:.06em;color:var(--signal-deep)}
.rel a.rc .h{font-size:.92rem;font-weight:700;line-height:1.65;margin-top:7px;color:var(--ink)}

/* --- 著者ボックス（記事末尾） --- */
.abox{max-width:720px;margin-top:40px;background:var(--card);border:1px solid var(--line);
  border-radius:10px;padding:22px 24px}
.abox .al{font-size:.7rem;font-weight:800;letter-spacing:.1em;color:var(--ink-3);margin-bottom:10px}
.abox .an{font-weight:700;font-size:1rem;color:var(--ink)}
.abox .aq{font-size:.82rem;color:var(--ink-3);margin-top:7px;line-height:1.85}
.abox .ad{font-size:.88rem;color:var(--ink-2);margin-top:12px;line-height:1.95}

/* --- 広告枠（自社サービスのみ。2026-09-18 追加） -----------------
   他社広告は受けない。薬機法の記事の横に健康食品の広告が出ると、
   記事の中立性が疑われて「監修者として立つ」という資産のほうが毀損する。
   自社広告でも「PR」は必ず出す（メディアとしての誠実さ＝景表法1級を持つ立場の一貫性）。 */
.adslot{background:var(--card);border:1px solid var(--line);border-radius:10px;
  padding:17px 18px 19px;margin-bottom:18px;position:relative}
.adslot .pr{position:absolute;top:11px;right:12px;font-size:.6rem;font-weight:800;
  letter-spacing:.1em;color:var(--ink-3);border:1px solid var(--line);
  border-radius:3px;padding:2px 5px;line-height:1}
.adslot .ak{font-size:.68rem;font-weight:800;letter-spacing:.09em;
  color:var(--signal-deep);margin-bottom:9px}
.adslot .ah{font-size:.97rem;font-weight:700;line-height:1.6;color:var(--ink);margin:0}
.adslot .ap{font-size:.82rem;color:var(--ink-2);line-height:1.9;margin:9px 0 0}
.adslot .ab{display:block;text-align:center;margin-top:14px;padding:11px;
  border-radius:7px;font-weight:700;font-size:.86rem;text-decoration:none;
  background:var(--signal);color:#04222a}
.adslot.ghost .ab{background:transparent;color:var(--signal-deep);border:1px solid var(--signal)}

/* --- 営業先アーカイブ（/report/<key>/ 2026-09-18） --- */
.ahead .who{font-size:.86rem;color:var(--ink-3);margin-top:12px}
.tagnav{max-width:1180px;margin:0 auto 26px;padding:0 24px;display:flex;gap:9px;flex-wrap:wrap}
.tagnav .tg{font-size:.84rem;color:var(--ink-2);text-decoration:none;
  border:1px solid var(--line);border-radius:999px;padding:8px 16px;background:var(--card);transition:.14s}
.tagnav .tg:hover{border-color:var(--signal);color:var(--signal-deep)}
.tagnav .tg.on{background:var(--signal);border-color:var(--signal);color:#04222a;font-weight:700}
@media(max-width:820px){.tagnav{padding:0 16px}}

.arts{display:grid;gap:16px;max-width:none}
.arts a.art{display:block;text-decoration:none;color:inherit;background:var(--card);
  border:1px solid var(--line);border-radius:12px;padding:22px 24px;transition:.14s}
.arts a.art:hover{border-color:var(--signal);box-shadow:0 4px 18px rgba(16,34,46,.08)}
.arts .tags{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:11px}
.arts .t{font-size:.69rem;font-weight:800;letter-spacing:.07em}
.arts .t.rec{color:var(--signal-deep);background:var(--signal-wash);padding:4px 10px;border-radius:4px}
.arts .t.day{font-family:var(--mono);color:var(--ink-3);letter-spacing:.02em}
.arts .au{font-size:.67rem;color:var(--ink-3);border:1px solid var(--line);
  border-radius:3px;padding:3px 7px;letter-spacing:.04em}
.arts h3{font-size:1.08rem;font-weight:700;line-height:1.6;margin:0;color:var(--ink)}
.arts p{font-size:.88rem;color:var(--ink-2);line-height:1.9;margin:9px 0 0}
.arts .more{font-size:.81rem;font-weight:700;color:var(--signal-deep);margin-top:13px}
.arts .empty{color:var(--ink-3)}

/* 記事ヘッダーにも営業先タグを出す */
.ahead .metaline .au{font-size:.69rem;color:var(--ink-3);border:1px solid var(--line);
  border-radius:3px;padding:4px 8px;text-decoration:none;letter-spacing:.04em}
.ahead .metaline .au:hover{border-color:var(--signal);color:var(--signal-deep)}