/* === (50) レスポンシブ(834px 1本)と印刷 =================================
   出所: Cocoon版 parts/g-responsive-print.css の書き起こし。
   2026-08-16 の SPラウンド(sp-audit.md SP-01/02/05/06/07/08/09)の是正内容を
   Xwrite DOM の上で保つ。ブレークポイントは 834px の1本のみ(v1の600/768/820/834混在は廃止)。
   ========================================================================== */
@media (max-width:834px){

  /* --- 版面 --------------------------------------------------------------- */
  .articleContainer,
  .notfound{ border-radius:0; padding:18px 14px; }
  .side{ width:100%; margin:30px 0 0; padding:0 14px; }

  /* --- chrome(SPはロゴ+☰の1行。ナビと検索は☰で開閉)---------------------- */
  .site-header .sh-in{ height:auto; flex-wrap:wrap; gap:8px 12px; padding:12px 16px; }
  .site-header .sh-name{ font-size:15px; }          /* モックSP実測 15px/900 */
  .site-header .sh-sub{ display:none; }             /* SPの1行ヘッダーにタグラインは載せない */
  /* タップ領域44px角(SP-07)。グリフの見た目は変えず、増分を負マージンで相殺して
     ヘッダー高さを動かさない。 */
  .site-header .bk-menu-btn{ display:block; padding:14px 15px; margin:-10px -7px -10px auto; }
  .site-header .sh-nav,
  .site-header .sh-search{ display:none; }
  .site-header .bk-menu-state:checked ~ .sh-nav{ display:flex; order:3; width:100%;
    flex-direction:column; align-items:stretch; gap:0; font-size:14px;
    border-top:1px solid var(--line2); padding-top:6px; }
  .site-header .bk-menu-state:checked ~ .sh-nav a{ padding:10px 2px;
    border-bottom:1px solid var(--line2); }
  .site-header .bk-menu-state:checked ~ .sh-nav a:last-child{ border-bottom:0; }
  .site-header .bk-menu-state:checked ~ .sh-nav a.active{ border-bottom:1px solid var(--line2); }
  .site-header .bk-menu-state:checked ~ .sh-search{ display:flex; order:4; width:100%; margin-left:0; }

  .breadcrumbs{ font-size:11px; }
  .articleHeader__title,
  .contentsHeader__caption{ line-height:1.5; }
  .toc_block .toc > ol{ column-count:1; }
  .toc_block .toc__caption{ font-size:14px; }       /* キャンバスSP実測(SP-05) */
  .toc_block .toc > ol,
  .toc_block .toc ol{ font-size:13px; }             /* 同上 */
  .site-footer .sf-in{ gap:24px; }

  /* --- v1モジュールの旧ブレークポイント(768/600)をここへ集約 -------------- */
  .aff{ padding:0 0 24px; }
  .aff-cards,
  .aff-crit{ grid-template-columns:1fr; }
  .aff-band{ padding:20px 16px; }
  .aff-band .aff-cta{ width:100%; padding:12px 20px; }
  .aff-rank .body{ padding:14px; }

  /* --- トップ(キャンバスSP 390アートボード準拠)---------------------------
     SP-05: PC値の取り残し7トークンを移植 / SP-06: ヒーローは左右16px内側の角丸カード */
  .bk-heroband{ background:transparent; }
  .bk-hero{ margin:0 16px; background:var(--tint); border-radius:8px; padding:14px;
    gap:6px; align-items:flex-start; text-align:left; }
  .bk-hero .t,
  .bk-hero h1{ font-size:19px; line-height:1.55; }
  .bk-hero p{ font-size:13px; }
  .bk-sec{ padding:16px; }
  .bk-sec > .h span{ font-size:16px; }
  .bk-pillar{ grid-template-columns:26px 1fr; gap:6px 12px; }
  .bk-pillar .no{ width:22px; height:22px; font-size:11px; }
  .bk-pillar .ttl{ font-size:14.5px; line-height:1.55; }
  .bk-pillar .meta{ grid-column:2; text-align:left; font-size:11.5px; }
  .bk-cathead{ padding:14px 16px; }
  .articleListContainer{ padding:4px 16px 10px; }

  /* 一覧は1カラム(SP-01/02: メタが絶対配置でタイトルに重なる事故と、
     検索結果だけ1カラム化が漏れる事故の再発防止。Xwriteでは .search も同一規則で受ける) */
  .articleList__item .xw-article-media{ grid-template-columns:1fr;
    grid-template-areas:"title" "text" "meta"; gap:4px; }
  .xw-article-media__body--extra,
  .xw-article-media__body--main{ align-items:flex-start; text-align:left;
    flex-direction:row; flex-wrap:wrap; gap:12px; position:static; font-size:11.5px; }
  .xw-article-media__body--title{ font-size:14.5px; }

  /* --- 記事のメタ行 -------------------------------------------------------- */
  .bk-meta{ gap:5px 10px; font-size:11.5px; padding-bottom:10px; margin-bottom:var(--sp-4); }

  /* --- v2記事構造の部品 ---------------------------------------------------- */
  .aff-rank .pc2{ grid-template-columns:1fr; }
  .aff-rank .oneline .pr,
  .aff-rank .ctarow .ad{ margin-left:0; }
  .aff-check .conds{ grid-template-columns:1fr; gap:12px; }
  .aff-check .result{ flex-direction:column; align-items:flex-start; gap:8px; flex-wrap:wrap; }
  .aff-check .result b{ flex:none; }
  .aff-req .grid{ grid-template-columns:1fr; }
  .aff-list .item{ grid-template-columns:1fr; }
  .aff-list .meta{ text-align:left; display:flex; gap:12px; }

  /* 比較表は横スクロールをやめ、項目ごとの縦リストにする。
     ヘッダー行は隠し、各セルの見出しは data-label(JSで付与)から出す。 */
  .aff-table{ overflow:visible; }
  .aff-table .inner,
  .aff-table table{ min-width:0; }
  .aff-table thead,
  .aff-table tbody{ display:block; }
  .aff-table .row.head{ display:none; }
  .aff-table .row{ display:block; border-top:1px solid var(--line); }
  .aff-table .row:first-child{ border-top:0; }
  .aff-table .c-label{ display:block; width:auto; flex:none;
    padding:8px 12px; background:var(--navy-tint); color:var(--navy); }
  .aff-table .c{ display:flex; justify-content:space-between; gap:12px; text-align:left;
    width:auto; flex:none; min-width:0; padding:8px 12px; border-top:1px solid var(--line2); }
  .aff-table .c::before{ content:attr(data-label); color:var(--sub); font-size:12px;
    flex:0 0 40%; text-align:left; }
  .aff-table .row.cta .c{ display:block; padding:10px 12px; }
  .aff-table .row.cta .c::before{ content:""; display:none; }

  /* --- SP追従CTA -----------------------------------------------------------
     Cocoonのモバイル固定フッター(4ボタン)の打ち消しは不要になった
     (Xwriteに同等の常駐バーが無い)。追従CTAだけを出す。 */
  .aff-sticky{ position:fixed; left:0; right:0; bottom:0; z-index:99; background:#fff;
    border-top:1px solid var(--line); box-shadow:var(--sh-2); padding:8px 12px;
    display:flex; align-items:center; gap:10px; }
  .aff-sticky .now{ font-size:10px; color:var(--sub); line-height:1.35; }
  .aff-sticky .now b{ display:block; font-family:var(--font-head); font-size:13px; color:var(--navy); }
  .aff-sticky .aff-cta{ margin-left:auto; width:auto; min-height:44px; padding:0 16px; font-size:13.5px; }
  body.has-aff-sticky{ padding-bottom:64px; }
}

/* === 印刷(社内配布用・広告を外す)========================================= */
@media print{
  .aff-cta,.aff-sticky,.side,.site-header,.site-footer,
  .adsbygoogle,.aff-badge-pr,.affiliate-footer-disclosure{ display:none !important; }
  .aff-author,.aff-req .src{ background:#fff; border:1px solid #999; }
  .articleContainer{ box-shadow:none !important; border-radius:0 !important;
    padding:0 !important; max-width:100% !important; }
  a[href]::after{ content:" (" attr(href) ")"; font-size:10px; color:#555; }  /* 出典URLを脚注化 */
}