/* 記事詳細のトーンだけをトップ（v8）に合わせる。要素・並び・大きさは変えない（色・面・線だけ）
   青の面 → トップの「サービスの特徴」と同じ墨の面、青い文字 → 墨、珊瑚色の札 → 半透明の白 */
body.single-media_article{
  --tone-ink:#111111; --tone-ink2:#3A3F46;
  --tone-dark:radial-gradient(62% 96% at 16% 10%, rgba(255,255,255,.16) 0%, rgba(255,255,255,0) 58%),
              radial-gradient(70% 110% at 88% 100%, rgba(10,12,16,.35) 0%, rgba(10,12,16,0) 60%),
              linear-gradient(155deg,#72777E 0%,#555A61 52%,#3D4249 100%);
}

/* アイキャッチ（記事ごとの登録画像）: 青を抜いて墨・銀のトーンに */
body.single-media_article .article-cover__img{filter:grayscale(1) contrast(1.08) brightness(1.02)}

/* 題の上の札・書き手の丸 */
body.single-media_article .article-hero__cat{color:var(--tone-ink) !important; background:rgba(17,17,17,.06) !important; border-color:rgba(17,17,17,.10) !important}
body.single-media_article .article-hero__cat::before{background:var(--tone-ink) !important}
body.single-media_article .article-hero__author-avatar{background:var(--tone-dark) !important}

/* 章の頭の帯・記事の中の案内・締めの案内・読み進めると出る窓・右の固定バナー（濃い面の側）: 墨の面に */
body.single-media_article .section-cover,
body.single-media_article .article-inline-cta,
body.single-media_article .rich-checklist-cta,
body.single-media_article .article-cta,
body.single-media_article .article-cta__inner,
body.single-media_article .scroll-popup__card,
body.single-media_article .floating-banner__card--accent{
  background:var(--tone-dark) !important; background-color:#50555C !important;
  box-shadow:0 22px 32px -16px rgba(14,26,44,.36), 0 6px 13px -6px rgba(14,26,44,.18), inset 0 1px 0 rgba(255,255,255,.14) !important;
}
body.single-media_article .section-cover *,
body.single-media_article .article-inline-cta *,
body.single-media_article .rich-checklist-cta *,
body.single-media_article .article-cta *,
body.single-media_article .scroll-popup__card *,
body.single-media_article .floating-banner__card--accent *{border-color:rgba(255,255,255,.28)}
body.single-media_article .article-cta__title em,
body.single-media_article .floating-banner__card--accent strong{color:#E4E8ED !important}

/* 濃い面の上の札（珊瑚色だったもの） */
body.single-media_article .article-inline-cta__badge,
body.single-media_article .scroll-popup__badge,
body.single-media_article .floating-banner__tag:not(.floating-banner__tag--light){
  background:rgba(255,255,255,.14) !important; color:#FFFFFF !important; border:1px solid rgba(255,255,255,.34) !important; box-shadow:none !important
}

/* 濃い面の上のボタン: 主は白、従は縁だけ（トップの .btnx と同じ丸み） */
body.single-media_article .scroll-popup__btn--primary,
body.single-media_article .rich-checklist-cta__btn--primary,
body.single-media_article .article-inline-cta a[class*="primary"],
body.single-media_article .article-cta a[class*="primary"]{
  background:#FFFFFF !important; color:#111111 !important; border-color:#FFFFFF !important; border-radius:999px !important
}
body.single-media_article .scroll-popup__btn--secondary,
body.single-media_article .article-inline-cta a[class*="secondary"],
body.single-media_article .article-cta a[class*="secondary"]{
  background:rgba(255,255,255,.08) !important; color:#FFFFFF !important; border:1px solid rgba(255,255,255,.5) !important; border-radius:999px !important
}

/* 右の固定バナー（明るい側の札）と、読み進めると出る窓の中の青い文字 */
body.single-media_article .floating-banner__tag--light,
body.single-media_article .floating-banner__cta,
body.single-media_article .floating-banner__head,
body.single-media_article .floating-banner__icon{color:var(--tone-ink) !important}
body.single-media_article .floating-banner__card:not(.floating-banner__card--accent) .floating-banner__cta,
body.single-media_article .floating-banner__card:not(.floating-banner__card--accent) .floating-banner__head{color:var(--tone-ink2) !important}
body.single-media_article .floating-banner__card--accent .floating-banner__cta,
body.single-media_article .floating-banner__card--accent .floating-banner__head,
body.single-media_article .floating-banner__card--accent .floating-banner__icon{color:#FFFFFF !important}

/* 記事の中の青い文字・印 → 墨（本文の中の札・番号は、下の「字は黒」で #111 にしている） */
body.single-media_article .rich-checklist__label{color:var(--tone-ink2) !important}
/* 関連記事（記事の下と、本文の中の関連記事の塊）の札・説明文・矢印も黒に（字は黒。#3A3F46・#555 をやめる） */
body.single-media_article .related-card__label,
body.single-media_article .related-card__arrow,
body.single-media_article .related-card__desc,
body.single-media_article .related-articles__eyebrow{color:#111111 !important}
body.single-media_article .rich-step__num,
body.single-media_article .rich-checklist__btn{background:#1A1F26 !important; color:#FFFFFF !important; border-color:#1A1F26 !important}
/* 字は黒（2026-09-22 板垣さん指示）: 本文の段落・箇条・表・小見出しの下の文・まとめ・目次・案内の説明文を #111 にそろえる。
   補助の文字色（#222・#444）と、札・番号の #3A3F46 をやめる（案内の説明文と「スタートできる」は、それぞれの指定の中で #111 にした）。先頭の1文字の飾りは変えない */
body.single-media_article .article-body{--c-text:#111111; --c-text-sub:#111111 !important; --c-text-mute:#111111 !important}
body.single-media_article .article-toc__label,
body.single-media_article .article-toc__link-num,
body.single-media_article .article-body__keypoint-label,
body.single-media_article .rich-checklist__result-num,
body.single-media_article .rich-summary__num,
body.single-media_article .rich-cost-price{color:#111111 !important}
body.single-media_article .article-marker{background:linear-gradient(transparent 60%, rgba(17,17,17,.12) 60%) !important; color:inherit !important}
body.single-media_article .article-body a:not([class]){color:var(--tone-ink) !important; text-decoration:underline; text-decoration-color:rgba(17,17,17,.35); text-underline-offset:3px}
body.single-media_article .article-body td,
body.single-media_article .article-body strong,
body.single-media_article .article-body em{color:inherit}
body.single-media_article .article-body svg polyline,
body.single-media_article .article-body svg path,
body.single-media_article .article-body svg line{stroke:currentColor}

/* 見出しの左の線・箇条の印・要点の線（青 → 墨） */
body.single-media_article .article-body h2,
body.single-media_article .rich-h3-section__h3,
body.single-media_article .rich-h3-section__points,
body.single-media_article .rich-summary__item{border-left-color:#1A1F26 !important}
body.single-media_article .article-body li::before,
body.single-media_article .rich-summary__item::before,
body.single-media_article .article-toc__label::before,
body.single-media_article .rich-step-list::before{background-color:#1A1F26 !important; background-image:none !important; border-color:#1A1F26 !important}
body.single-media_article .article-cta__inner::before,
body.single-media_article .floating-banner__card::before,
body.single-media_article .btn--primary::before{background-image:none !important; background-color:transparent !important}
body.single-media_article .article-body strong,
body.single-media_article .article-body td,
body.single-media_article .article-body td span,
body.single-media_article .article-body em{color:inherit !important}
body.single-media_article .btn--primary{background:#1A1F26 !important; color:#FFFFFF !important; border-color:#1A1F26 !important}
/* 窓の見出しの強調（黄色）と、濃い札の中の白いボタンの文字 */
body.single-media_article .scroll-popup__title em,
body.single-media_article .scroll-popup__card em{color:#FFFFFF !important; text-decoration:underline; text-decoration-color:rgba(255,255,255,.45); text-underline-offset:4px}
body.single-media_article .floating-banner__card--accent .floating-banner__cta{background:#FFFFFF !important; color:#111111 !important}

/* ═══ 2026-09-22 板垣さん指摘: 記事のファーストビュー・右上のバナー・記事中ほどの案内 ═══ */
/* 最初の1画面に、題・更新日の行・アイキャッチの上の方までが入るように詰める（パンくずは記事の下へ移した） */
body.single-media_article .article-hero{padding:116px 2.5rem 18px !important}
body.single-media_article .article-hero__title{font-size:clamp(26px, 2.5vw, 36px) !important; line-height:1.5 !important; margin:0 0 14px !important}
/* 題名の折り返し（2026-09-28 板垣さん指摘「タイトルの改行がおかしい」）: 行の長さをそろえる指定（balance）で「形態・工程別／の目安」のように語の途中で2行に割れ、右も空いていた。
   普通の折り返しにして、語の途中では折らず「｜」「、」「・」「？」の後ろで折る（keep-all）。1語が画面より長いときだけ途中で折る */
body.single-media_article .article-hero__title{text-wrap:wrap !important; word-break:keep-all !important; overflow-wrap:anywhere !important; line-break:strict}
body.single-media_article .article-hero__meta{padding-top:12px !important; margin-top:0 !important}
body.single-media_article .article-cover{margin-bottom:48px !important}
body.single-media_article .breadcrumb--end{max-width:52rem; margin:0 auto; padding:8px 2.5rem 32px; border:0}
@media (max-width:767px){
  body.single-media_article .article-hero{padding:88px 20px 12px !important}
  body.single-media_article .article-hero__title{font-size:22px !important; margin-bottom:10px !important}
  body.single-media_article .article-hero__meta{gap:4px 14px !important; font-size:12px !important}
  body.single-media_article .article-cover{padding:0 16px !important; margin-bottom:32px !important}
  body.single-media_article .breadcrumb--end{padding:8px 20px 24px}
}

/* 右上の固定バナー: 無料診断はコンサルタントの写真、資料は表紙。ボタンはトップと同じ形 */
body.single-media_article #floatingBanner.fb2-wrap{width:248px !important; gap:12px; left:auto !important; right:16px !important}
/* 本文の右に余白があるとき（1560px 以上）は、本文の右端のすぐ外に寄せる。それより狭いときは画面の右端から 16px（画面の外へはみ出さない） */
@media (min-width:1560px){ body.single-media_article #floatingBanner.fb2-wrap{left:calc(50% + 29.5rem) !important; right:auto !important} }
body.single-media_article #floatingBanner .fb2{
  display:flex !important; flex-direction:column; align-items:stretch; justify-items:stretch; text-align:left !important;
  gap:0 !important; padding:0 !important; border-radius:18px !important; overflow:hidden; color:#111 !important;
  background:linear-gradient(158deg,#FFFFFF 0%,#FAFBFD 44%,#EFF2F6 76%,#E4E9EF 100%) !important; border:1px solid rgba(17,17,17,.08) !important;
  box-shadow:0 22px 32px -16px rgba(14,26,44,.36), 0 6px 13px -6px rgba(14,26,44,.18), inset 0 1px 0 rgba(255,255,255,.9) !important;
  animation:none !important; text-decoration:none
}
body.single-media_article #floatingBanner .fb2::before{display:none !important}
body.single-media_article #floatingBanner .fb2:hover{transform:translateY(-3px)}
body.single-media_article .fb2-ph{position:relative; display:block; height:132px; overflow:hidden;
  background:radial-gradient(70% 90% at 70% 100%, rgba(255,255,255,.95) 0%, rgba(255,255,255,0) 70%), linear-gradient(160deg,#EEF0F2 0%,#CDD2D8 100%)}
body.single-media_article .fb2-ph img{position:absolute; right:4px; bottom:0; height:150px; width:auto; max-width:none}
body.single-media_article .fb2-doc{display:block; padding:12px 12px 0}
body.single-media_article .fb2-doc img{display:block; width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; border-radius:10px; box-shadow:0 10px 18px -10px rgba(14,26,44,.5), 0 0 0 1px rgba(17,17,17,.06)}
body.single-media_article .fb2-tag{display:block; margin:12px 14px 0; font-size:11px; font-weight:700; letter-spacing:.08em; color:#50555C}
body.single-media_article .fb2-ttl{display:block; margin:4px 14px 0; font-size:14px; font-weight:800; line-height:1.55; letter-spacing:.02em; color:#111}
body.single-media_article .fb2-btn{position:relative; display:flex; align-items:center; justify-content:center; margin:12px; height:44px; padding:0 42px 0 14px;
  border-radius:999px; background:linear-gradient(150deg,#1A1F26 0%,#0D1116 48%,#151A20 100%); color:#F6F6F6; font-size:13px; font-weight:700; letter-spacing:.04em;
  box-shadow:0 10px 20px -12px rgba(14,26,44,.55), inset 0 1px 0 rgba(255,255,255,.12)}
body.single-media_article .fb2-btn--light{background:#FFFFFF; color:#111; box-shadow:0 8px 16px -12px rgba(14,26,44,.4), 0 0 0 1px rgba(17,17,17,.12)}
body.single-media_article .fb2-ar{position:absolute; right:5px; top:50%; transform:translateY(-50%); width:34px; height:34px; border-radius:50%; background:#FFFFFF; display:flex; align-items:center; justify-content:center}
body.single-media_article .fb2-btn--light .fb2-ar{background:#111}
body.single-media_article .fb2-ar svg{width:11px; height:11px; fill:#111}
body.single-media_article .fb2-btn--light .fb2-ar svg{fill:#FFFFFF}
body.single-media_article .fb2 .floating-banner__close{top:8px !important; right:8px !important; z-index:3; width:26px; height:26px; background:rgba(255,255,255,.85) !important; color:#111 !important; border-radius:50%}

/* 記事中ほどの案内（本文の中の .article-inline-cta）: 縦に長い青い箱をやめ、写真入りの横長のバナーに */
body.single-media_article .article-body .article-inline-cta{
  position:relative; margin:2rem 0 3rem !important; padding:26px 230px 24px 30px !important; min-height:0 !important; text-align:left !important;
  background:linear-gradient(158deg,#FFFFFF 0%,#F7F8FA 46%,#E7EAEE 100%) !important; color:#111 !important;
  border:1px solid rgba(17,17,17,.08) !important; border-radius:20px !important; overflow:hidden;
  box-shadow:0 22px 32px -16px rgba(14,26,44,.30), 0 6px 13px -6px rgba(14,26,44,.14), inset 0 1px 0 rgba(255,255,255,.9) !important
}
body.single-media_article .article-body .article-inline-cta::before{
  content:"" !important; position:absolute; left:auto !important; top:auto !important; right:10px; bottom:0; width:200px; height:calc(100% - 10px);
  transform:none !important; filter:none !important; animation:none !important; opacity:1 !important;
  background:url(../img/v8/p-diag-f.webp) right bottom / contain no-repeat !important
}
body.single-media_article .article-body .article-inline-cta::after,
body.single-media_article .article-body .article-inline-cta__pattern,
body.single-media_article .article-body .article-inline-cta__sparkle{display:none !important}
body.single-media_article .article-body .article-inline-cta > p:first-of-type{margin:0 0 8px !important; line-height:1 !important}
body.single-media_article .article-body .article-inline-cta > p:first-of-type br{display:none}
body.single-media_article .article-body .article-inline-cta__badge{display:inline-flex !important; align-items:center; gap:6px; padding:6px 12px 6px 10px !important; border-radius:999px !important;
  background:#111 !important; color:#FFFFFF !important; border:0 !important; font-size:12px !important; font-weight:700 !important; letter-spacing:.06em !important; line-height:1 !important; box-shadow:none !important}
body.single-media_article .article-body .article-inline-cta__badge::before{content:""; width:6px; height:6px; border-radius:50%; background:#FFFFFF}
body.single-media_article .article-body .article-inline-cta__label{margin:0 0 2px !important; font-size:11px !important; letter-spacing:.14em !important; color:#6B7079 !important; text-align:left !important}
body.single-media_article .article-body .article-inline-cta__title{margin:4px 0 8px !important; font-size:20px !important; line-height:1.5 !important; color:#111 !important; text-align:left !important}
body.single-media_article .article-body .article-inline-cta__title em{color:#111 !important; font-style:normal; background:linear-gradient(transparent 62%, rgba(17,17,17,.12) 62%)}
body.single-media_article .article-body .article-inline-cta__sub{margin:0 0 14px !important; max-width:none !important; font-size:13px !important; line-height:1.8 !important; color:#3A3F46 !important; text-align:left !important}
body.single-media_article .article-body .article-inline-cta__sub strong{color:#111 !important}
body.single-media_article .article-body .article-inline-cta__actions{display:flex !important; flex-wrap:wrap; gap:10px !important; justify-content:flex-start !important; margin:0 !important; padding:0 !important; list-style:none}
body.single-media_article .article-body .article-inline-cta__actions li{margin:0 !important; padding:0 !important}
body.single-media_article .article-body .article-inline-cta__actions li::before{display:none !important}
body.single-media_article .article-body .article-inline-cta a.article-inline-cta__btn{display:inline-flex !important; align-items:center; height:46px; padding:0 22px !important; border-radius:999px !important; font-size:14px !important; font-weight:700 !important; text-decoration:none !important}
body.single-media_article .article-body .article-inline-cta a.article-inline-cta__btn--primary{background:linear-gradient(150deg,#1A1F26 0%,#0D1116 48%,#151A20 100%) !important; color:#F6F6F6 !important; border:0 !important}
body.single-media_article .article-body .article-inline-cta a.article-inline-cta__btn--secondary{background:#FFFFFF !important; color:#111 !important; border:1px solid rgba(17,17,17,.14) !important}
@media (max-width:720px){
  body.single-media_article .article-body .article-inline-cta{padding:22px 18px 196px !important}
  body.single-media_article .article-body .article-inline-cta::before{left:0 !important; right:0; margin:0 auto; width:100%; height:180px; background-position:center bottom !important}
  body.single-media_article .article-body .article-inline-cta__title{font-size:18px !important}
  body.single-media_article .article-body .article-inline-cta__actions{flex-direction:column}
  body.single-media_article .article-body .article-inline-cta a.article-inline-cta__btn{justify-content:center; width:100%}
}

/* ═══ 記事の中の案内（.aibz-cta3d）: トップの締めと同じく、人物がカードの上の縁から立ち上がる横長の案内（2026-09-22） ═══ */
body.single-media_article .aibz-cta3d{position:relative; display:block; margin:28px 0 44px !important; padding:96px 0 0 !important; background:none !important; box-shadow:none !important; text-align:left !important}
body.single-media_article .aibz-cta3d__card{position:relative; z-index:1; padding:30px 290px 30px 34px; border-radius:22px;
  background:linear-gradient(158deg,#FFFFFF 0%,#FAFBFD 44%,#EFF2F6 76%,#E4E9EF 100%);
  box-shadow:0 34px 50px -22px rgba(14,26,44,.40), 0 10px 20px -10px rgba(14,26,44,.20), inset 0 2px 2px rgba(255,255,255,.96), 0 0 0 1px rgba(17,17,17,.05)}
body.single-media_article .aibz-cta3d__who{position:absolute; z-index:2; right:26px; bottom:0; width:250px; margin:0 !important; pointer-events:none}
body.single-media_article .aibz-cta3d__who, body.single-media_article .aibz-cta3d__who img{background:none !important; padding:0 !important; border:0 !important; box-shadow:none !important; border-radius:0 !important}
body.single-media_article .aibz-cta3d__who img{display:block; width:100%; height:auto; max-width:none; margin:0 !important; border-radius:0 !important; box-shadow:none !important; filter:drop-shadow(-18px 14px 22px rgba(4,10,20,.32))}
body.single-media_article .aibz-cta3d.is-m .aibz-cta3d__who{width:236px}
body.single-media_article .aibz-cta3d p{margin:0 !important; text-align:left !important}
/* 2026-09-26 板垣さん指示: 案内の字が本文の Zen Kaku Gothic を継いでいて、サイトの見出し・ボタン（Noto Sans JP）と違って見えた。案内の中の字をすべて見出しの字にそろえる */
body.single-media_article .aibz-cta3d, body.single-media_article .aibz-cta3d p, body.single-media_article .aibz-cta3d a, body.single-media_article .aibz-cta3d span, body.single-media_article .aibz-cta3d b, body.single-media_article .aibz-cta3d small{font-family:var(--f-ja-bold) !important}
body.single-media_article .aibz-cta3d__a{font-size:13px !important; font-weight:700 !important; letter-spacing:.06em !important; line-height:1.6 !important; color:#50555C !important}
body.single-media_article .aibz-cta3d__b{margin-top:4px !important; font-size:25px !important; font-weight:900 !important; letter-spacing:.03em !important; line-height:1.45 !important; color:#111 !important}
body.single-media_article .aibz-cta3d__lead{margin-top:10px !important; font-size:14px !important; font-weight:500 !important; line-height:1.9 !important; color:#111111 !important}
/* 題と説明文は、テンプレートの区切り（wbr）と読点でだけ折り返す（768px 前後で「シミュレーシ／ョン」「削減で／きる」、スマホで「工／数」と切れていた）。
   PC（1024px 以上）は今の折り返しのまま */
@media (max-width:1023px){ body.single-media_article .aibz-cta3d__b, body.single-media_article .aibz-cta3d__lead{word-break:keep-all; overflow-wrap:anywhere} }
body.single-media_article .aibz-cta3d__acts{display:flex; flex-wrap:wrap; gap:10px; margin-top:18px}
body.single-media_article .aibz-cta3d__btn{position:relative; display:inline-flex !important; align-items:center; height:50px; padding:0 58px 0 22px !important; border-radius:999px !important;
  font-size:14px !important; font-weight:700 !important; letter-spacing:.04em !important; text-decoration:none !important; white-space:nowrap}
body.single-media_article .aibz-cta3d__btn.is-dark{background:linear-gradient(150deg,#1A1F26 0%,#0D1116 48%,#151A20 100%) !important; color:#F6F6F6 !important; box-shadow:0 12px 22px -12px rgba(14,26,44,.6), inset 0 1px 0 rgba(255,255,255,.12)}
body.single-media_article .aibz-cta3d__btn.is-light{background:#FFFFFF !important; color:#111 !important; box-shadow:0 10px 18px -12px rgba(14,26,44,.45), 0 0 0 1px rgba(17,17,17,.12)}
body.single-media_article .aibz-cta3d__ar{position:absolute; right:6px; top:50%; transform:translateY(-50%); width:38px; height:38px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:#FFFFFF}
body.single-media_article .aibz-cta3d__btn.is-light .aibz-cta3d__ar{background:#111}
body.single-media_article .aibz-cta3d__ar svg{width:11px; height:11px; fill:#111}
body.single-media_article .aibz-cta3d__btn.is-light .aibz-cta3d__ar svg{fill:#FFFFFF}
@media (hover:hover){ body.single-media_article .aibz-cta3d__btn:hover{transform:translateY(-2px)} }
/* 記事の締め（テンプレートの .article-cta）も同じ部品。外枠の墨の面は外す */
body.single-media_article section.article-cta.aibz-cta3d-end{max-width:56rem !important; margin:0 auto !important; padding:0 2.5rem 5rem !important; background:none !important; box-shadow:none !important}
body.single-media_article section.article-cta.aibz-cta3d-end::before, body.single-media_article section.article-cta.aibz-cta3d-end::after{display:none !important}
/* 英語の小見出しは出さない */
body.single-media_article .rich-checklist__label{display:none !important}
@media (max-width:720px){
  /* スマホ（2026-09-22 板垣さん指示で作り直し）: 人物をカードの手前に出し、上半身をカードの上の縁から飛び出させる。
     腰から下は、画像そのものの透明度（mask）で下へ向かって消し、カードの地の色がそのまま透けて見えるようにする。
     白い面を上から重ねて消すと、カードの地（下へ行くほど #E4E9EF 寄りの灰色）より明るい四角が浮くので使わない。
     影（drop-shadow）は画像ではなく外側の figure に付ける。画像に mask と影を両方付けると、影が画像の四角で切られて四角の縁が出る */
  body.single-media_article .aibz-cta3d{padding-top:112px !important}
  body.single-media_article .aibz-cta3d__card{padding:78px 18px 22px}
  body.single-media_article .aibz-cta3d__who, body.single-media_article .aibz-cta3d.is-m .aibz-cta3d__who{z-index:2; left:0; right:0; top:0; bottom:auto; width:auto; transform:none;
    filter:drop-shadow(0 12px 16px rgba(4,10,20,.22))}
  body.single-media_article .aibz-cta3d__who img{height:200px; width:auto; margin:0 auto !important; filter:none;
    -webkit-mask-image:linear-gradient(to bottom, #000 0%, #000 56%, rgba(0,0,0,.55) 72%, rgba(0,0,0,0) 90%); mask-image:linear-gradient(to bottom, #000 0%, #000 56%, rgba(0,0,0,.55) 72%, rgba(0,0,0,0) 90%)}
  body.single-media_article .aibz-cta3d__b{font-size:21px !important}
  /* 人物が真ん中に立つので、字も真ん中にそろえる（前の指定は .aibz-cta3d p の左寄せに負けていた） */
  body.single-media_article .aibz-cta3d .aibz-px{justify-content:center}
  body.single-media_article .aibz-cta3d p.aibz-cta3d__a, body.single-media_article .aibz-cta3d p.aibz-cta3d__b, body.single-media_article .aibz-cta3d p.aibz-cta3d__lead{text-align:center !important}
  body.single-media_article .aibz-cta3d__acts{flex-direction:column}
  body.single-media_article .aibz-cta3d__btn{justify-content:center; width:100%; padding:0 52px 0 18px !important}
  body.single-media_article section.article-cta.aibz-cta3d-end{padding:0 16px 3rem !important}
}

/* 右上のバナー（無料診断）: 人物をカードの上の縁から少しはみ出させて立体感を出す */
body.single-media_article #floatingBanner.fb2-wrap{overflow:visible !important; padding-top:44px !important; max-height:none !important}
body.single-media_article #floatingBanner .fb2--diag{overflow:visible !important}
body.single-media_article #floatingBanner .fb2--diag .fb2-ph{overflow:visible; border-radius:18px 18px 0 0; height:118px}
body.single-media_article #floatingBanner .fb2--diag .fb2-ph img{height:168px; right:8px; filter:drop-shadow(-10px 10px 14px rgba(4,10,20,.28))}

/* ═══ 月額15万円からスタートできる／AI導入支援サービス（丸いロゴの球＋月額15万円だけを大きく。2026-09-22） ═══ */
body.single-media_article .aibz-px{display:flex; align-items:center; gap:14px; margin:0 0 12px}
body.single-media_article .aibz-px__disc{position:relative; flex:none; width:74px; height:74px; border-radius:50%;
  background:radial-gradient(circle at 32% 26%, #FFFFFF 0%, #F4F6F8 34%, #D9DEE4 74%, #BCC3CB 100%);
  box-shadow:0 16px 24px -12px rgba(14,26,44,.50), inset -6px -8px 14px rgba(110,120,135,.28), inset 4px 5px 8px rgba(255,255,255,.95), 0 0 0 1px rgba(17,17,17,.05)}
body.single-media_article .aibz-px__disc img{position:absolute; left:50%; top:50%; width:42px; height:auto; max-width:none; margin:0 !important; transform:translate(-50%,-50%); border:0 !important; box-shadow:none !important; background:none !important}
body.single-media_article .aibz-px__t{display:flex; flex-direction:column; line-height:1.1}
body.single-media_article .aibz-px__l1{display:flex; align-items:baseline; flex-wrap:wrap; column-gap:2px; font-size:17px; font-weight:800; color:#111; letter-spacing:.02em}
body.single-media_article .aibz-px__l1 b{font-size:46px; font-weight:900; letter-spacing:-.01em; line-height:.95; margin:0 1px; color:#111}
body.single-media_article .aibz-px__l1 small{margin-left:8px; font-size:14px; font-weight:700; color:#111111; letter-spacing:.04em}
body.single-media_article .aibz-px__l2{margin-top:6px; font-size:15px; font-weight:800; letter-spacing:.06em; color:#111}
/* 案内の見出しは px の下に */
body.single-media_article .aibz-cta3d__b{margin-top:2px !important}
@media (max-width:720px){
  body.single-media_article .aibz-px{gap:12px}
  body.single-media_article .aibz-px__disc{width:62px; height:62px}
  body.single-media_article .aibz-px__disc img{width:36px}
  body.single-media_article .aibz-px__l1 b{font-size:40px}
  body.single-media_article .aibz-px__l1 small{margin-left:0; flex-basis:100%; margin-top:2px}
}

/* ═══ 右上のバナー（無料診断）: 男性の横に診断レポートの絵 ═══ */
body.single-media_article #floatingBanner .fb2-rep{position:absolute; z-index:1; left:10px; top:18px; width:116px; padding:9px 9px 10px; border-radius:10px; background:#FFFFFF;
  box-shadow:0 12px 18px -10px rgba(14,26,44,.45), 0 0 0 1px rgba(17,17,17,.06); display:grid; grid-template-columns:1fr 26px; gap:5px 6px; align-items:center}
body.single-media_article .fb2-rep__hd{grid-column:1 / 2; white-space:nowrap; font-size:11px; font-weight:800; letter-spacing:.02em; color:#111; line-height:1.2}
body.single-media_article .fb2-rep__ring{grid-column:2; grid-row:1 / 3; width:26px; height:26px; border-radius:50%;
  background:conic-gradient(#111 0 68%, #E1E5EA 68% 100%); -webkit-mask:radial-gradient(circle, transparent 7px, #000 7.5px); mask:radial-gradient(circle, transparent 7px, #000 7.5px)}
body.single-media_article .fb2-rep__bar{grid-column:1 / 2; display:block; height:5px; width:var(--w); border-radius:3px; background:#1A1F26}
body.single-media_article .fb2-rep__bar + .fb2-rep__bar{background:#AEB4BC}
body.single-media_article .fb2-rep__bar.is-s{background:#D3D8DE}
body.single-media_article .fb2-rep__ft{grid-column:1 / 3; margin-top:2px; font-size:11px; font-weight:700; color:#50555C; line-height:1.2}

/* ═══ 読み進めると出る窓: 明るいカード・人物が上の縁から立ち上がる形 ═══ */
body.single-media_article .scroll-popup .scroll-popup__card.sp2{
  position:relative; width:min(660px, calc(100vw - 32px)) !important; max-width:none !important; padding:30px 250px 28px 32px !important; overflow:visible !important; text-align:left !important;
  background:linear-gradient(158deg,#FFFFFF 0%,#FAFBFD 44%,#EFF2F6 76%,#E4E9EF 100%) !important; color:#111 !important; border-radius:24px !important; border:0 !important;
  box-shadow:0 40px 70px -24px rgba(4,10,20,.55), 0 10px 20px -10px rgba(14,26,44,.25), inset 0 2px 2px rgba(255,255,255,.96) !important}
body.single-media_article .sp2::before, body.single-media_article .sp2::after{display:none !important}
body.single-media_article .sp2 .scroll-popup__close{top:12px !important; right:12px !important; z-index:4; width:32px; height:32px; background:rgba(255,255,255,.9) !important; color:#111 !important; border:1px solid rgba(17,17,17,.12) !important; border-radius:50%}
body.single-media_article .sp2-who{position:absolute; z-index:2; right:18px; bottom:0; width:236px; margin:0; pointer-events:none}
body.single-media_article .sp2-who img{display:block; width:100%; height:auto; filter:drop-shadow(-16px 12px 20px rgba(4,10,20,.30))}
body.single-media_article .sp2-body{position:relative; z-index:3}
body.single-media_article .sp2-tag{display:inline-flex; align-items:center; height:28px; padding:0 12px; border-radius:999px; background:#111; color:#fff; font-size:12px; font-weight:800; letter-spacing:.08em}
body.single-media_article .sp2 .sp2-ttl{margin:12px 0 14px !important; font-size:24px !important; font-weight:900 !important; line-height:1.45 !important; letter-spacing:.02em !important; color:#111 !important; text-align:left !important}
body.single-media_article .sp2-desc{margin:4px 0 0 !important; font-size:13px !important; line-height:1.85 !important; color:#111111 !important}
body.single-media_article .sp2-acts{display:flex; flex-wrap:wrap; gap:10px; margin-top:16px}
@media (max-width:720px){
  body.single-media_article .scroll-popup .scroll-popup__card.sp2{padding:24px 20px 22px !important}
  body.single-media_article .sp2-who{display:none}
  body.single-media_article .sp2 .sp2-ttl{font-size:20px !important}
  body.single-media_article .sp2-acts{flex-direction:column}
  body.single-media_article .sp2-acts .aibz-cta3d__btn{justify-content:center; width:100%}
}

/* ═══ 窓の手直し（2026-09-22）: 上に「月額15万円からスタートできる AI導入支援サービス」、その下に申し込みへつながる見出し。
   男性は枠の上の縁からはみ出す。ボタン2つは同じ大きさ ═══ */
body.single-media_article .scroll-popup .scroll-popup__card.sp2{width:min(740px, calc(100vw - 32px)) !important; padding:34px 340px 30px 38px !important; margin-top:70px}
body.single-media_article .sp2-tag{display:none !important}
body.single-media_article .sp2-who{top:auto; bottom:0; right:10px; width:auto; height:auto}
body.single-media_article .sp2-who img{height:500px; width:auto; max-width:none}
body.single-media_article .sp2 .aibz-px{margin:0 0 18px}
body.single-media_article .sp2 .aibz-px__disc{width:84px; height:84px}
body.single-media_article .sp2 .aibz-px__disc img{width:48px}
body.single-media_article .sp2 .aibz-px__l1 b{font-size:54px}
body.single-media_article .sp2 .aibz-px__l2{font-size:17px}
body.single-media_article .sp2 .aibz-px__l1 small{flex-basis:100%; margin:6px 0 0 2px; font-size:13px}
body.single-media_article .sp2 .sp2-ttl{margin:0 0 6px !important; padding-top:16px; border-top:1px solid rgba(17,17,17,.10); font-size:20px !important}
body.single-media_article .sp2-acts{display:grid; grid-template-columns:1fr; gap:10px; width:310px; max-width:100%; margin-top:16px}
body.single-media_article .sp2-acts .aibz-cta3d__btn{width:100%; justify-content:center; padding:0 54px 0 20px !important}
@media (max-width:720px){
  body.single-media_article .scroll-popup .scroll-popup__card.sp2{padding:24px 20px 22px !important; margin-top:0}
  body.single-media_article .sp2 .aibz-px__l1 b{font-size:44px}
  body.single-media_article .sp2-acts{width:100%}
}
/* 記事の案内のボタン2つも同じ大きさにそろえる */
body.single-media_article .aibz-cta3d__acts .aibz-cta3d__btn{justify-content:center; width:258px}
@media (max-width:720px){ body.single-media_article .aibz-cta3d__acts .aibz-cta3d__btn{width:100%} }
body.single-media_article .sp2-desc, body.single-media_article .sp2 .sp2-ttl{max-width:330px}

/* ═══ この記事でわかること（KEY INSIGHT の箱の代わり。中身はテーマの assets/data/article-summaries.json の3行。2026-09-22） ═══
   目次と同じ白い箱。2026-09-26 板垣さん指示「もう少しポイントを割いた形に」: 題の上に青の POINT、行の頭に青の 01〜03 の番号を付ける（塗りの帯は使わない） */
body.single-media_article .aibz-sum{margin:2.5rem 0; padding:28px 32px 10px; background:var(--c-surface, #FFFFFF); border:1px solid var(--c-line, #E6E6E6); border-radius:var(--radius-lg, 1.5rem); box-shadow:var(--shadow-rest)}
body.single-media_article .aibz-sum__ttl{margin:0 0 10px !important; font-family:var(--f-ja-bold); font-size:19px !important; font-weight:900; line-height:1.5 !important; letter-spacing:.06em; color:#111111 !important}
body.single-media_article .aibz-sum__ttl::before{content:"POINT"; display:block; margin-bottom:4px; font-family:'Plus Jakarta Sans', system-ui, sans-serif; font-size:12px; font-weight:800; letter-spacing:.2em; line-height:1.4; color:var(--c-brand, #096FC8)}
body.single-media_article .aibz-sum__list{list-style:none; margin:0 !important; padding:0 !important; counter-reset:aibz-sum}
body.single-media_article .article-body .aibz-sum__list li{display:grid; grid-template-columns:48px 1fr; align-items:baseline; column-gap:8px; margin:0 !important; padding:16px 0 !important; border-top:1px solid rgba(17,17,17,.12); counter-increment:aibz-sum; font-family:var(--f-ja-bold); font-size:17px !important; font-weight:700; line-height:1.7 !important; letter-spacing:.04em; color:#111111 !important;
  line-break:strict; text-wrap:pretty}  /* 行が折り返すときも、行の頭に「ー」が来たり、最後の行が1〜2字だけになったりしないように */
body.single-media_article .article-body .aibz-sum__list li::before{content:counter(aibz-sum, decimal-leading-zero) !important; display:block !important; position:static !important; width:auto !important; height:auto !important; background:none !important; border:0 !important; font-family:'Plus Jakarta Sans', system-ui, sans-serif; font-size:24px; font-weight:800; line-height:1; letter-spacing:.02em; color:var(--c-brand, #096FC8)}
body.single-media_article .article-body .aibz-sum__list li::after{content:none !important; display:none !important}

/* ═══ スマホ（767px 以下）の読みやすさ（2026-09-22 板垣さん指摘「改行が早い」「右に余白が空く」）═══
   原因は実測で、①本文の左右の余白が 24px（題は 20px）②字間 .04em で1行19字 ③箱の内側の余白と飾りの列で、
   KEY INSIGHT は 270px・目次の文字は 183px・ポイントの箱は 250px しか幅がない ④見出しの「行の長さをそろえる」指定（balance）で、
   見出しの行末が右に 3〜6字ぶん空いたまま折り返す（390px 幅の中央値で h2 69px・小見出し 118px） ⑤表の1列目が1字幅につぶれ、縦書きのようになる。PC は変えない */
@media (max-width:767px){
  /* 本文: 左右の余白を題と同じ 20px に、字間を .02em に（390px 幅で1行19字 → 20字） */
  body.single-media_article .article-body{padding-left:20px !important; padding-right:20px !important; letter-spacing:.02em !important}
  body.single-media_article .article-body__keypoint p,
  body.single-media_article .article-body blockquote p,
  body.single-media_article .article-toc__link{letter-spacing:.02em !important}
  /* 見出し: 1行目を早めに折り返して行の長さをそろえる指定（balance）をやめ、右端まで使う。最後の行が1〜2字だけになるのは防ぐ（pretty）。
     語の切れ目で折り返す指定（word-break:auto-phrase）も試したが、右の空きが balance と同じくらい出るので使わない */
  body.single-media_article .article-body h2,
  body.single-media_article .article-body h3,
  body.single-media_article .article-body h4,
  body.single-media_article .rich-h3-section__h3{text-wrap:pretty}
  /* 2026-09-28 板垣さん指摘「h2 の右に余白」: 見出しも、iPhone の Safari では pretty で行の長さがそろえられて1行目が早く折り返す。
     スマホ幅では見出しも普通の折り返しにして、右端まで使う（本文の段落と同じ理由） */
  body.single-media_article .article-body h2,
  body.single-media_article .article-body h3,
  body.single-media_article .article-body h4,
  body.single-media_article .rich-h3-section__h3{text-wrap:wrap !important}
  /* 本文の段落と箇条書きは、普通の折り返しに戻す（2026-09-27 板垣さん指摘「そこで本記事ではの横が空いている」）。
     media-article.css の text-wrap:pretty を、iPhone の Safari は段落の全部の行の長さをそろえる形で効かせ、各行が早く折り返して右が空くため */
  body.single-media_article .article-body p,
  body.single-media_article .article-body li:not(.aibz-sum__list > li){text-wrap:wrap !important}   /* 「この記事でわかること」の行は短いので pretty のまま */
  /* 見出しと目次は、行の頭に「ー」や小さい「ェ」が来ないようにする（目次の幅が広がって「フェ／ーズ」と切れたため。
     本文の段落に同じ指定をすると、早い折り返しが 390px 幅で 44行 → 61行に増えるので段落には付けない） */
  body.single-media_article .article-body h2,
  body.single-media_article .article-body h3,
  body.single-media_article .rich-h3-section__h3,
  body.single-media_article .article-toc__link{line-break:strict}
  body.single-media_article .article-body h2{padding:16px 16px !important}
  /* 箱の内側の余白を詰める */
  body.single-media_article .article-body__keypoint{padding:20px 18px !important}
  body.single-media_article .aibz-sum{padding:22px 20px 6px}
  body.single-media_article .article-body .aibz-sum__list li{padding:13px 0 !important; font-size:16px !important; letter-spacing:.02em}
  body.single-media_article .rich-h3-section__points{padding:16px 14px !important}
  body.single-media_article .rich-h3-section__points li{padding-left:28px !important}
  /* 目次: 左の余白と線（本文の箇条の指定が目次にまで効いていた）と右の矢印をやめ、番号の列を詰める */
  body.single-media_article .article-toc{padding:18px 16px 6px}
  body.single-media_article .article-body .article-toc__list li{padding:0; margin:0}
  body.single-media_article .article-body .article-toc__list li::before{content:none !important; display:none !important}
  body.single-media_article .article-toc__link{grid-template-columns:26px 1fr; gap:6px; font-size:15px}
  body.single-media_article .article-toc__link-arrow{display:none}
  /* 表: 列が1字幅につぶれないよう、どの列も 5.5 字ぶんは確保する（入りきらない表は今までどおり横に動かして見る） */
  body.single-media_article .rich-table thead th,
  body.single-media_article .rich-table tbody td{min-width:calc(5.5em + 24px); padding:12px 12px !important; font-size:14px}
}

/* 2026-09-22 板垣さん指示「字の色は黒に」: 先頭の大きな1文字（青だった）と、題の下の更新日・文字数・読了の字も黒に */
body.single-media_article .article-body > p:first-child::first-letter{color:#111111 !important}
body.single-media_article .article-hero__meta, body.single-media_article .article-hero__meta *{color:#111111 !important}
/* この記事でわかること（スマホ）: 1行が画面の幅に収まりやすいよう、字を少し小さく・字間を詰める */
@media (max-width:767px){
  body.single-media_article .aibz-sum{padding:20px 16px 4px}
  body.single-media_article .aibz-sum__ttl{font-size:17px !important}
  body.single-media_article .article-body .aibz-sum__list li{grid-template-columns:36px 1fr; column-gap:4px; padding:12px 0 !important; font-size:14px !important; letter-spacing:0; line-height:1.7 !important}
  body.single-media_article .article-body .aibz-sum__list li::before{font-size:19px}
}

/* 2026-09-26 板垣さん指示: 章の頭の帯（.section-cover）の上の小さな添え字（「— よくある質問」など）は要らない。外して、題の字を大きくして読みやすくする */
body.single-media_article .section-cover__cat,
body.single-media_article .section-cover__cat + br{display:none !important}
body.single-media_article .section-cover__title{font-size:clamp(1.625rem, 3.4vw, 2.5rem) !important; line-height:1.45 !important}
/* 章の頭の帯の題: 句読点の無い長い題が折り返せず、帯の左右からはみ出して切れていた（2026-09-27「支援会社に頼む場合の料金体系と見積もりの確かめ方」）。字の途中でも折り返せるようにする */
body.single-media_article .section-cover__title{word-break:normal !important; overflow-wrap:anywhere !important; max-width:100%}
@media (max-width:768px){ body.single-media_article .section-cover__title{font-size:1.375rem !important; line-height:1.5 !important} }
@media (max-width:480px){ body.single-media_article .section-cover__title{font-size:1.25rem !important} }

/* ═══ 2026-09-26 板垣さん指示（/ai-consulting-companies/ の書き直しで） ═══ */
/* この記事でわかること: 青をやめて黒に。3行を横に並べたカードにする（スマホは縦に積む） */
body.single-media_article .aibz-sum{padding:28px 28px 26px !important}
body.single-media_article .aibz-sum__ttl{margin:0 0 16px !important}
body.single-media_article .aibz-sum__ttl::before{color:#111111 !important}
body.single-media_article .aibz-sum__list{display:grid !important; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:12px}
body.single-media_article .article-body .aibz-sum__list li{display:block !important; padding:18px 18px 20px !important; border:1px solid var(--c-line, #E6E6E6) !important; border-radius:14px; background:#F6F6F7; font-size:15px !important; line-height:1.7 !important}
body.single-media_article .article-body .aibz-sum__list li::before{margin-bottom:10px; font-size:28px !important; color:#111111 !important}
@media (max-width:767px){
  body.single-media_article .aibz-sum{padding:20px 16px 18px !important}
  body.single-media_article .aibz-sum__list{grid-template-columns:1fr; gap:8px}
  body.single-media_article .article-body .aibz-sum__list li{display:grid !important; grid-template-columns:40px 1fr; align-items:baseline; padding:14px 14px !important; font-size:15px !important}
  body.single-media_article .article-body .aibz-sum__list li::before{margin:0; font-size:20px !important}
}

/* 監修者の枠（この記事でわかることの下） */
body.single-media_article .aibz-kanshu{display:grid; grid-template-columns:72px 1fr; gap:18px; align-items:center; margin:0 0 2.5rem; padding:22px 26px; background:var(--c-surface, #FFFFFF); border:1px solid var(--c-line, #E6E6E6); border-radius:var(--radius-lg, 1.5rem); box-shadow:var(--shadow-rest)}
body.single-media_article .aibz-kanshu__img{display:flex; align-items:center; justify-content:center; width:72px; height:72px; margin:0; padding:14px; box-sizing:border-box; border-radius:50%; overflow:hidden; background:#FFFFFF; border:1px solid var(--c-line, #E6E6E6)}
body.single-media_article .aibz-kanshu__img img{display:block; width:100%; height:auto; object-fit:contain; margin:0 !important; border-radius:0 !important}  /* ロゴは横長なので切り抜かずに丸の中へ収める（2026-09-26） */
body.single-media_article .article-body .aibz-kanshu p{margin:0 !important; color:#111111 !important}
/* 「この記事の監修者」の札（2026-09-27 板垣さん指示「文字だけの『監修：』はチープ。ぼこっとさせる」）。塗らずに白地・細い線・影で浮かせる */
body.single-media_article .article-body .aibz-kanshu p.aibz-kanshu__label{display:inline-flex; align-items:center; gap:6px; margin:0 0 8px !important; padding:5px 14px 5px 11px; font-family:var(--f-ja-bold); font-size:12px !important; font-weight:800; letter-spacing:.08em; line-height:1.4 !important; background:#FFFFFF; border:1px solid rgba(17,17,17,.14); border-radius:999px; box-shadow:0 6px 14px -8px rgba(14,26,44,.35), 0 2px 4px -2px rgba(14,26,44,.18), inset 0 1px 0 rgba(255,255,255,.9)}
body.single-media_article .aibz-kanshu__label::before{content:""; width:14px; height:14px; flex:none; background:currentColor; -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 1.5l1.9 1.4 2.3-.1.7 2.2 1.9 1.3-.7 2.2.7 2.2-1.9 1.3-.7 2.2-2.3-.1L8 14.5l-1.9-1.4-2.3.1-.7-2.2-1.9-1.3.7-2.2-.7-2.2 1.9-1.3.7-2.2 2.3.1z'/%3E%3Cpath d='M5.6 8.1l1.6 1.6 3.2-3.3'/%3E%3C/svg%3E") center/contain no-repeat; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 1.5l1.9 1.4 2.3-.1.7 2.2 1.9 1.3-.7 2.2.7 2.2-1.9 1.3-.7 2.2-2.3-.1L8 14.5l-1.9-1.4-2.3.1-.7-2.2-1.9-1.3.7-2.2-.7-2.2 1.9-1.3.7-2.2 2.3.1z'/%3E%3Cpath d='M5.6 8.1l1.6 1.6 3.2-3.3'/%3E%3C/svg%3E") center/contain no-repeat}
body.single-media_article .aibz-kanshu__label + .aibz-kanshu__name{display:block}
/* 運営会社の行は会社概要へのリンク。字は黒のまま、下線と外へのリンクの印で押せると分かるようにする（2026-09-27） */
body.single-media_article .article-body .aibz-kanshu a.aibz-kanshu__corp{display:inline-flex; align-items:center; gap:4px; color:#111111 !important; text-decoration:underline; text-decoration-color:rgba(17,17,17,.35); text-underline-offset:3px}
body.single-media_article .article-body .aibz-kanshu a.aibz-kanshu__corp:hover{text-decoration-color:#111111}
body.single-media_article .aibz-kanshu__corp::after{content:""; width:12px; height:12px; flex:none; background:currentColor; -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.5 2.5h4v4M13.5 2.5L7 9M11.5 9.5v3a1 1 0 0 1-1 1h-7a1 1 0 0 1-1-1v-7a1 1 0 0 1 1-1h3'/%3E%3C/svg%3E") center/contain no-repeat; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.5 2.5h4v4M13.5 2.5L7 9M11.5 9.5v3a1 1 0 0 1-1 1h-7a1 1 0 0 1-1-1v-7a1 1 0 0 1 1-1h3'/%3E%3C/svg%3E") center/contain no-repeat}
body.single-media_article .aibz-kanshu__name{margin-top:2px !important; font-family:var(--f-ja-bold); font-size:18px !important; font-weight:900; line-height:1.5 !important}
body.single-media_article .aibz-kanshu__role{font-size:13px !important; font-weight:700; line-height:1.6 !important}
body.single-media_article .aibz-kanshu__bio{margin-top:8px !important; font-size:14px !important; line-height:1.8 !important}
@media (max-width:767px){ body.single-media_article .aibz-kanshu{grid-template-columns:56px 1fr; gap:14px; padding:18px 16px} body.single-media_article .aibz-kanshu__img{width:56px; height:56px; padding:11px} }
/* 監修者の枠（プロフィール型。2026-09-27 板垣さんが3案から選んだ案B）: ロゴの丸を枠の上にはみ出させ、中を中央にそろえる。
   aibz-kanshu--profile を付けた枠だけに効く（前の形の枠は変えない） */
body.single-media_article .article-body .aibz-kanshu--profile{display:block; position:relative; margin:72px 0 2.5rem; padding:64px 28px 28px; text-align:center; border-color:rgba(17,17,17,.10); box-shadow:0 22px 40px -24px rgba(14,26,44,.35), 0 4px 10px -6px rgba(14,26,44,.12)}
body.single-media_article .article-body .aibz-kanshu--profile .aibz-kanshu__img{position:absolute; top:-44px; left:50%; transform:translateX(-50%); width:88px; height:88px; padding:18px; border-color:rgba(17,17,17,.10); box-shadow:0 14px 26px -12px rgba(14,26,44,.45)}
body.single-media_article .article-body .aibz-kanshu--profile p.aibz-kanshu__label{margin:0 0 10px !important}
body.single-media_article .article-body .aibz-kanshu--profile .aibz-kanshu__name{margin-top:0 !important; font-size:20px !important; line-height:1.4 !important; letter-spacing:.04em}
body.single-media_article .article-body .aibz-kanshu--profile .aibz-kanshu__role{margin-top:4px !important}
body.single-media_article .article-body .aibz-kanshu--profile .aibz-kanshu__bio{max-width:34em; margin:12px auto 0 !important; line-height:1.85 !important}
body.single-media_article .article-body .aibz-kanshu--profile ul.aibz-kanshu__tags{display:flex; flex-wrap:wrap; justify-content:center; gap:6px; margin:14px 0 0 !important; padding:0 !important; list-style:none}
body.single-media_article .article-body .aibz-kanshu--profile ul.aibz-kanshu__tags li{margin:0 !important; padding:4px 12px !important; font-size:12px !important; font-weight:700; line-height:1.5 !important; letter-spacing:.04em; color:#111111 !important; background:#F6F7F8; border:1px solid rgba(17,17,17,.16); border-radius:999px}
body.single-media_article .article-body .aibz-kanshu--profile ul.aibz-kanshu__tags li::before,
body.single-media_article .article-body .aibz-kanshu--profile ul.aibz-kanshu__tags li::after{content:none !important; display:none !important}
@media (max-width:767px){
  body.single-media_article .article-body .aibz-kanshu--profile{margin-top:64px; padding:60px 18px 22px}
  body.single-media_article .article-body .aibz-kanshu--profile .aibz-kanshu__img{width:80px; height:80px; top:-40px; padding:16px}
}

/* 目次: 開け閉めできる（details）。H3 を H2 の下に小さく並べる */
body.single-media_article .article-toc details > summary{display:flex; align-items:center; justify-content:space-between; list-style:none; cursor:pointer}
body.single-media_article .article-toc details > summary::-webkit-details-marker{display:none}
body.single-media_article .article-toc details > summary .article-toc__label{margin-bottom:0}
body.single-media_article .article-toc details > summary::after{content:"閉じる"; font-family:var(--f-ja-bold); font-size:13px; font-weight:700; color:#111111; padding:6px 14px; border:1px solid var(--c-line, #E6E6E6); border-radius:999px}
body.single-media_article .article-toc details:not([open]) > summary::after{content:"開く"}
body.single-media_article .article-toc details[open] > summary{margin-bottom:12px}
body.single-media_article .article-body .article-toc__sub{list-style:none; margin:0 0 8px !important; padding:0 0 0 2.75rem !important}
body.single-media_article .article-body .article-toc__sub li{margin:0 !important; padding:0 !important}
body.single-media_article .article-body .article-toc__sub li::before{content:none !important; display:none !important}
body.single-media_article .article-toc__sub a{display:block; padding:5px 0; font-family:var(--f-ja-bold); font-size:13.5px; font-weight:500; line-height:1.6; color:#111111 !important; text-decoration:none !important}
body.single-media_article .article-toc__sub a:hover{text-decoration:underline !important}
@media (max-width:1023px){ body.single-media_article .article-body .article-toc__sub{padding-left:32px !important} }

/* H2: 色の付いた帯をやめ、番号（data-num）を上に小さく、題を大きく、下に黒の罫 */
body.single-media_article .article-body h2{margin-top:5.5rem !important; padding:0 0 18px !important; background:none !important; border:0 !important; border-bottom:2px solid #111111 !important; border-radius:0 !important; box-shadow:none !important; font-size:clamp(1.75rem, 3vw, 2.25rem) !important; line-height:1.4 !important; letter-spacing:.03em !important; color:#111111 !important}
body.single-media_article .article-body h2[data-num]::before{content:attr(data-num) !important; display:block !important; margin-bottom:10px; font-family:'Plus Jakarta Sans', system-ui, sans-serif; font-size:14px; font-weight:800; letter-spacing:.2em; line-height:1; color:#111111}
@media (max-width:767px){ body.single-media_article .article-body h2{margin-top:4rem !important; padding:0 0 14px !important; font-size:1.5rem !important} }
/* 目次の details に、本文の FAQ（details）の箱の指定が効いてしまうので外す */
body.single-media_article .article-body .article-toc details{margin:0 !important; padding:0 !important; border:0 !important; border-radius:0 !important; background:none !important; box-shadow:none !important}
body.single-media_article .article-body .article-toc details > summary{padding:0 !important; border:0 !important; background:none !important; font-size:inherit !important}
body.single-media_article .article-body .article-toc details > summary::before{content:none !important; display:none !important}
body.single-media_article .article-body .article-toc details > .article-toc__list{padding:0 !important; margin:0 !important}

/* 案内の見出し: トップページの締め（「まずは」は細く小さく、「削減効果をシミュレーション」だけを太く大きく）と同じ強弱に。説明文はトップと同じ #242D3A（2026-09-26 板垣さん指示） */
body.single-media_article .aibz-cta3d__pre{display:block; font-size:16px; font-weight:700; letter-spacing:.04em; line-height:1.6}
body.single-media_article .aibz-cta3d__lead{color:#242D3A !important}

/* 手順: 左の縦の線が最後の手順の下にはみ出して見にくかったので、線をやめて1手順ずつの白い箱に。番号は黒の字だけ（塗りの丸をやめる） */
body.single-media_article .rich-step-list{gap:12px !important}
body.single-media_article .rich-step-list::before{content:none !important; display:none !important}
body.single-media_article .rich-step{grid-template-columns:56px 1fr !important; gap:12px !important; align-items:baseline !important; padding:20px 24px; background:var(--c-surface, #FFFFFF); border:1px solid var(--c-line, #E6E6E6); border-radius:16px; box-shadow:var(--shadow-rest)}
body.single-media_article .rich-step__num{width:auto !important; height:auto !important; background:none !important; border-radius:0 !important; box-shadow:none !important; justify-content:flex-start !important; font-family:'Plus Jakarta Sans', system-ui, sans-serif !important; font-size:26px !important; font-weight:800 !important; line-height:1 !important; color:#111111 !important}
body.single-media_article .rich-step__title{margin-bottom:6px !important}
@media (max-width:767px){ body.single-media_article .rich-step{grid-template-columns:40px 1fr !important; padding:16px 16px} body.single-media_article .rich-step__num{font-size:20px !important} }

/* まとめ: 1項目ずつの箱と左の太線をやめ、1枚の白い箱の中に番号つきの行を罫で区切って並べる */
body.single-media_article .rich-summary{gap:0 !important; padding:8px 28px; background:var(--c-surface, #FFFFFF); border:1px solid var(--c-line, #E6E6E6); border-radius:var(--radius-lg, 1.5rem); box-shadow:var(--shadow-rest)}
body.single-media_article .rich-summary__item{gap:16px !important; padding:18px 0 !important; background:none !important; border:0 !important; border-left:0 !important; border-radius:0 !important; box-shadow:none !important; border-top:1px solid rgba(17,17,17,.12) !important}
body.single-media_article .rich-summary__item:first-child{border-top:0 !important}
body.single-media_article .rich-summary__item::before{content:none !important; display:none !important}
body.single-media_article .rich-summary__num{min-width:40px; font-family:'Plus Jakarta Sans', system-ui, sans-serif !important; font-size:22px !important; line-height:1.3 !important; color:#111111 !important}
body.single-media_article .rich-summary__text{font-size:16px !important; font-weight:700 !important; line-height:1.75 !important}
@media (max-width:767px){ body.single-media_article .rich-summary{padding:4px 16px} body.single-media_article .rich-summary__num{min-width:32px; font-size:18px !important} body.single-media_article .rich-summary__text{font-size:15px !important} }

/* 比較記事の PR 枠（自社サービス）: 白い箱に PR の札・画像・一言・特徴4つ（2列のカード）・案内と同じボタン（2026-09-26 板垣さん指示） */
body.single-media_article .aibz-pr{position:relative; margin:2rem 0 3rem; padding:30px 32px 32px; background:var(--c-surface, #FFFFFF); border:1px solid rgba(17,17,17,.18); border-radius:var(--radius-lg, 1.5rem); box-shadow:0 22px 32px -18px rgba(14,26,44,.28), 0 6px 13px -6px rgba(14,26,44,.12)}
body.single-media_article .article-body .aibz-pr p{margin:0 !important; color:#111111 !important}
body.single-media_article .aibz-pr__badge{display:inline-block; margin-bottom:12px !important; padding:3px 12px; border:1px solid #111111; border-radius:999px; font-family:'Plus Jakarta Sans', system-ui, sans-serif; font-size:12px !important; font-weight:800; letter-spacing:.16em; line-height:1.5 !important}
body.single-media_article .aibz-pr__name{font-family:var(--f-ja-bold); font-size:14px !important; font-weight:700; letter-spacing:.06em; line-height:1.6 !important}
body.single-media_article .aibz-pr__catch{margin-top:6px !important; font-family:var(--f-ja-bold); font-size:clamp(1.375rem, 2.6vw, 1.75rem) !important; font-weight:900; line-height:1.5 !important; letter-spacing:.02em}
body.single-media_article .aibz-pr figure{margin:20px 0 0}
body.single-media_article .aibz-pr figure img{display:block; width:100%; height:auto; border-radius:16px; margin:0 !important}
body.single-media_article .aibz-pr__lead{margin-top:18px !important; font-size:15px !important; line-height:1.9 !important}
body.single-media_article .article-body .aibz-pr__points{display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:10px; list-style:none; margin:18px 0 0 !important; padding:0 !important}
body.single-media_article .article-body .aibz-pr__points li{margin:0 !important; padding:16px 18px !important; background:#F6F6F7; border:1px solid var(--c-line, #E6E6E6); border-radius:14px; font-size:14px !important; line-height:1.75 !important; color:#111111 !important}
body.single-media_article .article-body .aibz-pr__points li::before{content:none !important; display:none !important}
body.single-media_article .aibz-pr__points strong{display:block; margin-bottom:4px; font-family:var(--f-ja-bold); font-size:16px; font-weight:900}
body.single-media_article .aibz-pr .aibz-cta3d__acts{margin-top:24px}
body.single-media_article .aibz-pr .aibz-cta3d__btn{text-decoration:none !important}
@media (max-width:767px){
  body.single-media_article .aibz-pr{padding:22px 18px 24px}
  body.single-media_article .article-body .aibz-pr__points{grid-template-columns:1fr}
  body.single-media_article .aibz-pr .aibz-cta3d__acts{flex-direction:column}
}

/* ═══ 記事の中の案内に、月桂樹で挟んだ「システム開発費は／成果報酬対応」と、女性の左上のコストカットダッシュボードの画面・丸い札を足す（2026-10-01 板垣さん指示）
   見本は 02_business/aibuilderz/marketing/website/design/article-cta-2026-09/記事CTAの案_画面と月桂樹.html。画面は for Clients の実際の画面（会社名はサンプル株式会社）で、ゆっくり上下に流れる ═══ */
body.single-media_article .aibz-cta3d__hrow{display:flex; flex-wrap:wrap; align-items:flex-end; column-gap:20px; row-gap:8px}
body.single-media_article .aibz-aw{display:flex; align-items:center; gap:3px; flex:none; margin-bottom:2px; color:#111}
body.single-media_article .aibz-aw__lr{display:block; width:30px; height:54px; fill:currentColor}
body.single-media_article .aibz-cta3d p.aibz-aw__t{display:flex; flex-direction:column; align-items:center; margin:0 !important; padding:0 !important; line-height:1.2 !important; white-space:nowrap; text-align:center !important}
body.single-media_article .aibz-aw__t span{font-size:11.5px !important; font-weight:700 !important; letter-spacing:.06em; line-height:1.2 !important; color:#111 !important}
body.single-media_article .aibz-aw__t b{margin-top:2px; font-size:18px !important; font-weight:900 !important; letter-spacing:.05em; line-height:1.2 !important; color:#111 !important}
/* 画面は人物の後ろ（人物 z-index:2）、丸い札は画面の左ちょい上で、画面の白い縁にだけ掛ける */
body.single-media_article .aibz-sc{position:absolute; top:70px; right:242px; width:176px; pointer-events:none}
body.single-media_article .aibz-sc__win{position:relative; z-index:1; padding:5px; border-radius:15px; background:linear-gradient(160deg,#FFFFFF 0%,#F2F4F7 100%);
  box-shadow:0 26px 34px -18px rgba(14,26,44,.48), 0 8px 14px -8px rgba(14,26,44,.18), inset 0 1px 1px #FFFFFF, 0 0 0 1px rgba(17,17,17,.07)}
body.single-media_article .aibz-sc__bar{display:flex; gap:4px; padding:2px 5px 5px}
body.single-media_article .aibz-sc__bar i{display:block; width:5px; height:5px; border-radius:50%; background:#D3D8DF}
body.single-media_article .aibz-sc__view{position:relative; height:98px; border-radius:10px; overflow:hidden; background:#F2F4F7; box-shadow:inset 0 0 0 1px rgba(17,17,17,.05)}
body.single-media_article .aibz-sc__view img{display:block; width:100% !important; height:auto !important; max-width:none !important; margin:0 !important; padding:0 !important; border:0 !important; border-radius:0 !important; box-shadow:none !important; animation:aibz-sc 18s ease-in-out infinite}
@keyframes aibz-sc{0%,22%{transform:translateY(0)} 58%,64%{transform:translateY(calc(-100% + 98px))} 96%,100%{transform:translateY(0)}}
@media (prefers-reduced-motion:reduce){ body.single-media_article .aibz-sc__view img{animation:none} }
body.single-media_article .aibz-cta3d p.aibz-sc__seal{position:absolute; z-index:3; left:-88px; top:-18px; width:96px; height:96px; margin:0 !important; padding:0 !important; border-radius:50%;
  display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center !important; background:#FFFFFF; box-shadow:0 0 0 1px rgba(17,17,17,.12)}
body.single-media_article .aibz-sc__seal span{font-size:8.5px !important; font-weight:700 !important; letter-spacing:.02em; line-height:1.3 !important; color:#50555C !important}
body.single-media_article .aibz-sc__seal b{margin-top:3px; font-size:12px !important; font-weight:900 !important; letter-spacing:.03em; line-height:1.3 !important; color:#111 !important}
/* 案内の幅が狭いとき（タブレット）は、画面が左の文字に重なるので出さない */
@media (min-width:721px) and (max-width:879px){ body.single-media_article .aibz-sc{display:none} }
@media (max-width:720px){
  /* スマホ: 人物を大きくして右に寄せ、カードの上から少しだけ出す。画面はカードの中の左で、人物より手前に置く（人物の下の透けた所が画面に掛からないように） */
  body.single-media_article .aibz-cta3d{padding-top:60px !important}
  body.single-media_article .aibz-cta3d__card{padding-top:164px}
  body.single-media_article .aibz-cta3d__who img{height:244px; margin:0 0 0 auto !important}
  body.single-media_article .aibz-cta3d__hrow{flex-direction:column; align-items:center; gap:12px}
  body.single-media_article .aibz-sc{left:68px; right:auto; top:70px; width:136px}
  body.single-media_article .aibz-sc__win{z-index:3; padding:4px; border-radius:12px}
  body.single-media_article .aibz-sc__bar{padding:1px 4px 4px; gap:3px}
  body.single-media_article .aibz-sc__bar i{width:4px; height:4px}
  body.single-media_article .aibz-sc__view{height:80px; border-radius:8px}
  body.single-media_article .aibz-sc__view img{animation-name:aibz-sc-sp}
  @keyframes aibz-sc-sp{0%,22%{transform:translateY(0)} 58%,64%{transform:translateY(calc(-100% + 80px))} 96%,100%{transform:translateY(0)}}
  body.single-media_article .aibz-cta3d p.aibz-sc__seal{z-index:4; left:-66px; top:-14px; width:74px; height:74px}
  body.single-media_article .aibz-sc__seal span{font-size:7px !important; letter-spacing:0; line-height:1.25 !important}
  body.single-media_article .aibz-sc__seal b{margin-top:2px; font-size:9.5px !important; letter-spacing:0}
}