/* 見出しと本文の文字の大きさ（raminc.co.jp のトップ・固定ページに合わせた役割ごとの値。CEO 2026-11-03）：hero＝トップの大きな一文、title＝ページの題、h2＝区切りの見出し、h3・h4＝小見出し、lead＝強めの文、body＝本文、small＝小さい文 */
:root{--fs-hero:35px;--lh-hero:49px;--fs-title:32px;--lh-title:48px;--fs-h2:30px;--lh-h2:45px;--fs-h3:19px;--lh-h3:30.4px;--fs-h4:18px;--lh-h4:27px;--fs-lead:20px;--lh-lead:36px;--fs-body:16px;--lh-body:28.8px;--fs-small:14px;--lh-small:25.2px;}
@media(max-width:767px){:root{--fs-hero:30px;--lh-hero:42px;--fs-title:28px;--lh-title:42px;--fs-h2:23px;--lh-h2:34.5px;--fs-h3:18px;--lh-h3:28.8px;--fs-h4:18px;--lh-h4:27px;--fs-lead:19.5px;--lh-lead:35.1px;--fs-body:14px;--lh-body:25.2px;--fs-small:13.65px;--lh-small:24.57px;}}
/* ブランド変更時はこの:rootを調整 */
@layer site,lism-base,lism-block,lism-trait,lism-primitive,lism-custom,lism-utility;
@layer site{
:root{
  /* 書体 */
  --f-ja:"Noto Sans JP",sans-serif;                 /* 和文フォント。HTMLの読み込みも変更 */
  --f-en:Barlow,"Noto Sans JP",sans-serif;          /* 欧文ラベル用 */
  --f-mono:"SFMono-Regular",Menlo,monospace;        /* コード用 */
  /* 文字色 */
  --c-ink:#000;          /* 基本文字色 */
  --c-text:#2b2e32;      /* ナビ・フォーム文字 */
  --c-text3:#555;        /* 引用・表文字 */
  --c-sub:#505458;       /* 補助文字 */
  --c-grey:#999;         /* 検索アイコン */
  --c-lab:#9c9ea3;       /* 英字ラベル */
  --c-on:#fff;           /* 濃色背景上の文字 */
  /* 主な色 */
  --c-main:#b98e6f;      /* ボタン・帯の色（CEO 2026-11-03） */
  --c-navy:#0d2d5c;      /* 濃色部品の背景 */
  --c-link:#1f395b;      /* リンク色 */
  --c-text-link:#0047ab; /* 文字のリンクの色（本文・表・リスト。メインカラーに連動しない。全サイト共通。CEO 2026-11-06） */
  /* 背景色と線 */
  --c-surface:#fff;      /* 基本背景 */
  --c-bg:#f0f0f0;        /* 一覧・記事の背景 */
  --c-sec:#f1f1f3;       /* 区切り背景 */
  --c-box:#e9ecef;       /* 目次背景 */
  --c-pale:#e8effb;      /* 淡青背景 */
  --c-quote:#e5eeff;     /* 引用背景 */
  --c-code:#e1e4e8;      /* コード文字色 */
  --c-line:#ddd;         /* 基本の線 */
  --c-line2:#e6e6e6;     /* 検索欄・カードの線 */
  /* 影 */
  --sh-card:rgba(43,44,48,.16); /* 記事カード影 */
  --sh-btn:rgba(43,44,48,.08);  /* ボタンのホバー影 */
  /* 幅と余白 */
  --w-inner:1200px;      /* 本文幅 */
  --w-site:1200px;       /* 本文とサイドバーの幅 */
  --w-wide:1200px;       /* 広い区切りの幅 */
  --w-foot:1200px;       /* フッター幅 */
  --gutter:20px;         /* PC左右余白 */
  --gutter-s:16px;       /* スマホ左右余白 */
  --hd-h:80px;           /* ヘッダー高さ */
  --hd-h-s:64px;         /* スマホのヘッダー高さ */
  --sec-pad:80px;        /* 区切り上下余白 */
  --sec-pad-s:48px;      /* スマホの区切り余白 */
  --logo-h:45px;         /* ロゴ高さ */
  --logo-h-s:30px;       /* スマホのロゴ高さ */
  --crumb-bg:#f0efef;          /* パンくず背景 */
  --crumb-tx:var(--c-text);    /* パンくず文字色 */
  --crumb-sep:#c3c3c3;         /* パンくず区切り */
  --crumb-w:1240px;            /* パンくず幅 */
  --crumb-pad:var(--gutter);   /* パンくず余白 */
  --crumb-pad-s:var(--gutter-s); /* スマホのパンくず余白 */
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--f-ja);font-size:var(--fs-body);line-height:1.8;font-weight:400;color:var(--c-ink);background:var(--c-surface);overflow-wrap:anywhere}
img{display:block;max-width:100%;}
a{color:var(--c-text-link);text-decoration:none;transition:opacity .6s}
a:hover{opacity:.8}
h1,h2,h3,h4,p,ul,ol,dl,dd,figure{margin:0;padding:0}
ul,ol{list-style:none}
button,input,select,textarea{font:inherit;color:inherit}
.inner{width:calc(100% - 2*var(--gutter));max-width:var(--w-inner);margin:0 auto}

/* ヘッダー */
.hd{position:fixed;top:0;left:0;right:0;height:var(--hd-h);background:var(--c-surface);box-shadow:0 1px 0 var(--c-line);display:flex;align-items:center;z-index:50}   /* ヘッダーの下は1pxの線（トガリネズミと同じ） */
.logo{display:flex;align-items:center;width:max-content;min-width:180px;max-width:260px;flex:none;font-size:24px;line-height:var(--logo-h);font-weight:700;letter-spacing:.8px;}
.logo__t{white-space:nowrap}
.logo__i{display:block;height:28px;width:auto;max-width:100%;object-fit:contain}   /* 画像のロゴ（CPU BASE）。高さは2サイトとも28px・スマホ24px */
.ico{width:1em;height:1em;vertical-align:middle;flex:none}
.hd__nav{display:flex;align-items:center;height:var(--hd-h);min-width:0;overflow:hidden}
.hd__nav>*{color:var(--c-text);height:var(--hd-h);margin-right:24px;font-size:14px;font-weight:700;letter-spacing:.1em;display:flex;align-items:center;white-space:nowrap}
.hd__nav a:hover,.hd__nav button:hover{text-decoration:underline}
.hd__aux{display:flex;align-items:center;height:var(--hd-h);flex:none}
.hd__aux>a,.hd__aux>button{background:none;border:0;padding:0;width:24px;height:var(--hd-h);display:flex;align-items:center;justify-content:center;margin-right:40px;cursor:pointer;font-size:24px;color:var(--c-text)}
.hd__util{display:flex;gap:16px}
.hd__btn{color:var(--c-on);background:var(--c-main);text-align:center;white-space:nowrap;transition:opacity .2s}
.hd__btn.-navy{background:var(--c-navy)}

.mega{display:none;position:absolute;left:0;right:0;top:var(--hd-h);max-height:calc(100vh - var(--hd-h));overflow:auto;background:var(--c-surface);border-top:1px solid var(--c-line);border-bottom:1px solid var(--c-line);padding:40px 40px 24px}
.mega.is-open{display:block}
.mega .ft__g{max-width:var(--w-foot);margin:0 auto}
.mega__h{font-size:15px;line-height:22px;font-weight:600;letter-spacing:.8px;margin-bottom:12px;}  /* フッター列と同じ */
.mega li{margin-bottom:8px;line-height:20px}
.mega li a{font-size:13px;letter-spacing:.96px;color:var(--c-text)}
.mega li a:hover{text-decoration:underline}
.hd__util.-mega{display:none}
/* .is-foldはJSが付け、ナビを折りたたむ */
.hd.is-fold .hd__nav{display:none}
/* 検索とメニューの表示 */
.hd:not(.is-fold) .hd__aux>a,.hd:not(.is-fold) .hd__aux>button{display:none}
@media(max-width:767px){   /* スマホのヘッダー */
  .hd{height:var(--hd-h-s)}
  .logo{font-size:20px;line-height:var(--logo-h-s);min-width:0}
  .logo__i{height:var(--logo-h-s)}
  .hd__nav{display:none}
  .hd:not(.is-fold) .hd__aux>a,.hd:not(.is-fold) .hd__aux>button{display:flex}
  .hd__aux,.hd__aux>a,.hd__aux>button{height:var(--hd-h-s)}
  .hd__aux>a,.hd__aux>button{margin-right:12px;font-size:22px;width:28px}
  .hd__aux>button{margin-right:0}
  .hd__aux .hd__util{display:none}
  .mega{top:var(--hd-h-s);max-height:calc(100vh - var(--hd-h-s));padding:16px var(--gutter-s) 8px}
  .hd__util.-mega{display:flex;flex-direction:column;margin:24px 0 8px}
  .hd__util.-mega .hd__btn{width:100%}
}

/* パンくず */

/* ボタン */
.btn{color:var(--c-on);background:var(--c-main);border-color:var(--c-main);text-align:center;transition:opacity .2s}

.btn.-navy{background:var(--c-link);border-color:var(--c-link)}
.btn.-line{background:var(--c-surface);color:var(--c-link);border-color:var(--c-link);position:relative}
.btn.-wide{width:380px;max-width:100%}

/* 見出し */
.rt{font-family:var(--f-en);font-size:15px;line-height:24px;letter-spacing:1.5px}   /* 英字のラベル：HTMLに大文字で書く。色は周りの文字と同じ（CEO 2026-11-03）。トガリネズミの .pg__en と同じ形 */
.rtt{font-size:var(--fs-h2);line-height:var(--lh-h2);font-weight:600;margin-bottom:40px}
.linkbox{display:flex;justify-content:space-between;align-items:center}
.linkbox>div .rtt{margin-bottom:0}
.linkbox:has(>div){margin-bottom:40px}
.linkbox .btn{max-width:100%}
.linkbox>*{min-width:0}
.sec{padding:var(--sec-pad) 0}
.sec.-gray{background:var(--c-sec)}

/* ヒーロー */
.mhero{padding:160px 40px 80px}
.mhero__w{display:flex;justify-content:space-between;align-items:center;max-width:var(--w-wide);margin:0 auto}
.mhero__c{width:536px}
@media(max-width:767px){br.-pc{display:none}}   /* PCだけの改行（スマホでは行を詰める） */
.pill{color:var(--c-sub);border-color:var(--c-sub);margin-bottom:24px}
.mhero h1{font-size:var(--fs-hero);line-height:var(--lh-hero);letter-spacing:.4px;margin-bottom:24px}
.mhero p{font-size:var(--fs-body);line-height:var(--lh-body);font-weight:400;letter-spacing:.4px;color:var(--c-text);margin-bottom:32px}
.mhero__b{display:flex;gap:16px;}
.mbtn{letter-spacing:.96px;color:var(--c-on);background:var(--c-main);border-color:var(--c-main);transition:transform .2s,box-shadow .2s}

.mbtn.-line{background:var(--c-surface);color:var(--c-ink);border-color:var(--c-ink)}
.mbtn.-navy{background:var(--c-navy);border-color:var(--c-navy)}
.mbtn.-w{background:transparent;color:var(--c-on);border-color:var(--c-on)}
.mhero__i{width:640px;height:413px;overflow:hidden}
.mhero__i img{width:100%;height:100%;object-fit:cover}

/* 記事カード */
.mcbg{background:var(--c-bg)}
.mcbg.-white{background:var(--c-surface)}   /* 一覧の背景 */
.mcl{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:0 40px;align-items:start;width:calc(100% - 2*var(--gutter));max-width:var(--w-site);margin:0 auto;padding:64px 0 96px}
.mcmain{min-width:0}
/* サイドバー */
.side{display:flex;flex-direction:column;gap:20px;position:sticky;top:104px}
.box{background:var(--c-surface);border-radius:8px;overflow:hidden}
.box h3{padding:17.75px 16px;font-size:15px;line-height:22.5px;}
.box.srch{padding:16px}
.box.sbn img{width:100%;height:160px;object-fit:cover}
.box.sbn a{display:block}
.box.sbn span{margin:12px 16px 16px;background:var(--c-main);color:var(--c-on);text-align:center}
.rk .it{display:grid;grid-template-columns:96px minmax(0,1fr);gap:12px;padding:12px 16px;font-size:14px;line-height:21px;color:var(--c-text)}
.rk .it img{height:auto;aspect-ratio:1200/630;object-fit:cover}
.rk .it:hover span,.cl li a:hover{text-decoration:underline}
.cl li a{display:block;padding:12px 16px;font-size:14px;line-height:21px;color:var(--c-text);border-top:1px solid var(--c-line)}
.box.tgs .tg{padding:0 16px 16px}
.box .tg a{font-size:14px;line-height:24px}

.mhead{display:flex;flex-direction:column;align-items:flex-start;gap:16px}   /* 題の下に説明文（トガリネズミの一覧と同じ） */
.mhead+.sbox{margin-top:32px}
.mhead b,.mhead h1{font-size:var(--fs-title);line-height:var(--lh-title);letter-spacing:.4px}   /* 一覧見出し */
.mhead h1{display:inline}   /* 区切り見出しと同じ配置 */
.mhead p:not(.rt){font-size:var(--fs-body);line-height:var(--lh-body);font-weight:400;letter-spacing:.4px;color:var(--c-text)}
.cats{display:flex;flex-wrap:wrap;gap:16px;padding-top:32px}
.cats a{letter-spacing:.96px;color:var(--c-sub);border-color:var(--c-sub);transition:background-color .2s,color .2s}
.cats a.on,.cats a:hover{background:var(--c-ink);color:var(--c-on);opacity:1}
.count{padding-top:64px;font-size:var(--fs-h2);line-height:var(--lh-h2);font-weight:600;letter-spacing:.4px}
.count em{font-style:normal}
.sr__none{grid-column:1 / -1;padding:32px;text-align:center;color:var(--c-sub);border:1px dashed var(--c-line);border-radius:4px}   /* 検索で1件もない時の文 */
.cards{display:grid;gap:48px 32px;padding:32px 0}
.card{background:var(--c-surface);border-radius:4px;box-shadow:0 8px 40px 0 var(--sh-card);overflow:hidden}
.card a{display:flex;flex-direction:column;height:100%;color:var(--c-ink);transition:none}
.card a:hover{opacity:1}
.card figure{aspect-ratio:1200/630;overflow:hidden;background:var(--c-sec)}   /* 記事カードの写真の枠はアイキャッチの標準の比率（1200×630）。幅に合わせて高さが決まり、写真の縦が詰まって見えない（CEO 2026-11-06） */
.card figure img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.card a:hover figure img{transform:scale(1.05)}
.card__c{padding:32px 24px;display:flex;flex-direction:column;gap:16px;flex:1}
.card__h{display:flex;align-items:center}
.card__h span{padding:1px 16px;font-size:12px;line-height:21px;font-weight:400;color:var(--c-sub);border:1px solid var(--c-sub);border-radius:100px;letter-spacing:.96px}
.card__h i:not(.fi){font-style:normal;font-size:12px;font-weight:400;color:var(--c-text);letter-spacing:.96px}
.card h3{font-size:var(--fs-h3);line-height:var(--lh-h3);letter-spacing:.4px;color:var(--c-text)}
.card__m{margin-top:auto;font-size:12px;line-height:21px;font-weight:400;color:var(--c-sub);letter-spacing:.96px}
.pager{display:flex;justify-content:center;padding:0 40px 80px}
.pager a{display:flex;align-items:center;justify-content:center;width:48px;height:48px;margin:4px;border-radius:48px;font-size:16px;line-height:28px;letter-spacing:.96px;color:var(--c-sub);transition:background-color .2s}
.pager__gap{display:flex;align-items:center;justify-content:center;width:44px;height:44px;margin:4px;color:var(--c-sub)}   /* ページ送りは1〜5と最後のページ。間は「…」で省く（CEO 2026-11-03） */
.pager a.on{background:var(--c-ink);color:var(--c-on)}
.sbox{position:relative}
.sbox input{display:block;width:100%;height:49px;padding:8px 32px 8px 42px;font-size:17.6px;line-height:30.8px;font-weight:400;background:var(--c-surface);border:1px solid var(--c-line);border-radius:4px}
.sbox .fi{position:absolute;left:12px;top:15px;width:18px;height:18px;color:var(--c-grey);font-size:15px}
.tg{display:flex;flex-wrap:wrap;gap:8px 16px}
.tg a{font-weight:400;letter-spacing:.96px;color:var(--c-text);transition:opacity .2s}
.tg a:hover{opacity:.7}
.ah__c{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;padding:0 0 20px}
.ah__c .pill{margin:0;padding:2px 24px}
.ah__d{display:inline-flex;align-items:center;gap:5px;font-size:12px;line-height:18px;color:var(--c-sub)}   /* 公開日と更新日 */
.ah__ic{flex:none;width:14px;height:14px;font-size:12px}
.ah h1{font-size:27px;line-height:40.5px;letter-spacing:.4px;margin-bottom:16px}
.ah__tg{display:flex;flex-wrap:wrap;gap:4px 16px;margin-bottom:24px}
.ah__tg a{font-size:14px;line-height:22px;color:var(--c-main)}
.ah__tg a:hover{text-decoration:underline}
.ah figure{margin:6.8px 0}
.ah figure img{width:100%;height:437px;object-fit:cover}
.pr-notice{display:block;width:100%;box-sizing:border-box;margin:20px 0;padding:24px 28px;background:#f7f7f7;color:#555;font-size:13px;line-height:1.8;border-radius:0}
@media(max-width:767px){.pr-notice{padding-right:16px;padding-left:16px}}
.toc{--toc-lt:color-mix(in srgb,var(--c-main) 50%,#fff);background:var(--c-surface);border-top:4px solid var(--c-text3);box-shadow:0 3px 6px rgba(0,0,0,.16);padding:40px 48px 36px;margin:48px 0 0}   /* 目次（raminc.co.jp の目次が元。番号はメインカラーの薄い色、点はメインカラー。CEO 2026-11-02） */
.toc b{display:block;font-size:26.4px;line-height:47.52px;font-weight:400}
.toc>ol{counter-reset:toc;margin-top:28px}
.toc>ol>li{counter-increment:toc;position:relative;padding-left:48px;margin-bottom:20px;font-size:15.2px;line-height:23.56px}
.toc>ol>li:last-child{margin-bottom:0}
.toc>ol>li::before{content:counter(toc,decimal-leading-zero);position:absolute;left:0;top:0;font:500 16px/24px Barlow,sans-serif;color:var(--toc-lt)}
.toc>ol>li>a{display:block;padding-left:12px;border-left:1px solid #bbb;font-weight:700;color:var(--c-text)}
.toc ol ol{margin-top:8px;padding-left:13px}
.toc ol ol li{position:relative;padding-left:16px;margin-bottom:6px;font-size:13.68px;line-height:21.2px;font-weight:700}
.toc ol ol li:last-child{margin-bottom:0}
.toc ol ol li::before{content:"";position:absolute;left:0;top:8px;width:6px;height:6px;border-radius:50%;background:var(--c-main)}
.toc ol ol a{color:var(--c-text)}
.toc a:hover{text-decoration:underline}
.toc>ol[hidden]{display:none}
.ah+.body{margin-top:32px}   /* 記事の頭の下の本文（目次の上。リード文も本文と同じ部品） */
.ah+.body+.toc{margin-top:16px}
.body h2{font-size:23px;line-height:34.5px;letter-spacing:.4px;margin:64px 0 24px;padding:14px 20px;border-radius:4px;background:var(--c-main);color:#fff}   /* 見出しは主の色の地に白文字 */
.body h2+h3{margin-top:24px}
.body h3{font-size:20px;line-height:32px;font-weight:700;background:color-mix(in srgb,var(--c-main) 12%,#fff);border-radius:4px;padding:16px 20px;margin:56px 0 24px;letter-spacing:.4px;color:var(--c-ink)}   /* 主の色を薄くした地に黒文字 */
.body h4{font-size:18px;line-height:27px;font-weight:700;margin:40px 0 16px;padding-left:12px;border-left:4px solid var(--c-main);color:var(--c-ink)}   /* 左に主の色の縦線 */
.body.-plain h2,.body.-plain h3,.body.-plain h4{padding:0;border:0;border-radius:0;background:none;color:var(--c-ink)}   /* お知らせ記事は目次も見出しの装飾も付けない（文字の大きさと太さだけ。CEO 2026-11-02） */
.body p{font-size:16px;line-height:28.8px;font-weight:400;letter-spacing:.4px;color:var(--c-text);margin-bottom:16px}
.body ul{margin:0 0 24px 24px;list-style:disc;font-size:16px;line-height:28.8px;font-weight:400;letter-spacing:.4px}
.body pre{background:#1e1e1e;color:var(--c-code);font:400 16px/25.6px var(--f-mono);padding:52px 32px 32px;margin:0;border-radius:12px;overflow:auto;white-space:pre}
.body .code{position:relative;margin:32px 0}   /* コードの欄（黒い地）。右上のコピーボタンは js/main.js が付ける */
.code__btn{position:absolute;top:12px;right:12px;display:flex;align-items:center;gap:6px;border:1px solid rgba(255,255,255,.35);background:none;color:#fff;font:inherit;cursor:pointer}
.code__btn:hover{background:rgba(255,255,255,.12)}
.body code{background:var(--c-box);border-radius:5.6px;padding:2.8px 6.3px;margin:0 3px;font-size:14px;line-height:28px}
.body pre code{background:none;padding:0;margin:0;font-size:inherit}
.body img{margin:24px 0;width:100%;aspect-ratio:16/9;object-fit:cover}
.bq{background:var(--c-quote);padding:12px 17px 12px 60px;margin:20px 0;font-size:15px;line-height:33px;color:var(--c-text3);position:relative}
.bq::before{content:"\f10d";font:var(--fa-font-solid);position:absolute;left:18px;top:50%;transform:translateY(-50%);font-size:22px;line-height:1;color:var(--c-navy)}
.tbl{width:100%;border-collapse:collapse;margin:20px 0;font-size:16px;line-height:24px;color:var(--c-text3)}
.tbl th{background:var(--c-bg);font-weight:700;padding:10px;border:1px solid var(--c-line);text-align:left;letter-spacing:.4px}
.tbl td{padding:10px;border:1px solid var(--c-line);font-weight:500;letter-spacing:.4px}
/* 共有ボタン */
.share-lead{display:flex;justify-content:center;align-items:center;gap:14px;margin:64px 0 16px;font-size:15px;line-height:24px;font-weight:700;}   /* 共有案内 */
.share-lead::before,.share-lead::after{content:"";width:2px;height:20px;border-radius:1px;background:currentColor;transform:rotate(-30deg)}
.share-lead::after{transform:rotate(30deg)}
.share-links{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}   /* SNSの5つはフッターと同じ44pxの丸いアイコン、その下に「リンクをコピー」（枠なしの文字だけ）（CEO 2026-11-02） */
.share-links a{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--c-ink);border-radius:50%;background:var(--c-surface);color:var(--c-ink)}
.share-links a:hover{background:var(--c-ink);color:var(--c-surface);text-decoration:none}
.share-links button{flex:0 0 100%;display:flex;align-items:center;justify-content:center;gap:8px;padding:8px 0;border:0;background:none;color:var(--c-ink);font:700 15px/24px var(--f-ja);cursor:pointer;white-space:nowrap}   /* リンクをコピー：枠なしの文字だけ（CEO 2026-11-02） */
.share-links button:hover{text-decoration:underline}

.share-links .fi{flex:none;width:16px;height:16px;}
/* 執筆者欄 */
.afoot{display:grid;grid-template-columns:240px minmax(0,1fr);margin:64px -48px -64px;background:var(--c-ink);color:var(--c-on);border-radius:0 0 8px 8px}
.afoot__l{display:flex;flex-direction:column;align-items:center;gap:6px;padding:40px 24px;border-right:1px dashed rgba(255,255,255,.25);text-align:center}
.afoot__t{position:relative;margin:0 0 14px;padding:6px 16px;border-radius:20px;background:var(--c-surface);color:var(--c-ink);font-size:13px;line-height:18px;font-weight:700}
.afoot__t::after{content:"";position:absolute;left:50%;bottom:-6px;margin-left:-6px;border:6px solid transparent;border-bottom:0;border-top-color:var(--c-surface)}
.afoot__l img{width:96px;height:96px;margin-bottom:8px;border-radius:50%;border:3px solid var(--c-surface);object-fit:cover}
.afoot__l b{font-size:18px;line-height:26px}
.afoot__l span{font-size:12px;line-height:18px;color:#b5b5b5}
.afoot__r{display:flex;flex-direction:column;justify-content:center;gap:24px;padding:40px 40px 40px 36px}
.afoot__r p{font-size:15px;line-height:28px;color:#e6e6e6}
.afoot__sns{display:flex;flex-wrap:wrap;gap:16px;}
.afoot__sns a{display:flex;flex-direction:column;align-items:center;gap:6px;font:500 11px/1 var(--f-en);color:#b5b5b5}
.afoot__ic{display:grid;place-items:center;width:48px;height:48px;border:1px solid rgba(255,255,255,.4);border-radius:50%;color:var(--c-on);transition:background .2s,color .2s}
.afoot__ic .fi{width:22px;height:22px;font-size:19px}
.afoot__sns a:hover .afoot__ic{background:var(--c-surface);color:var(--c-ink)}
.mcmain.-art{background:var(--c-surface);border-radius:8px;padding:48px 48px 64px}
.related{background:var(--c-surface);padding:88px var(--gutter)}
.related__w{max-width:var(--w-wide);margin:0 auto}
.related h2{font-size:var(--fs-h2);line-height:var(--lh-h2);text-align:center;}
.related__lead{margin-top:8px;text-align:center;font-size:var(--fs-body);line-height:var(--lh-body);color:var(--c-sub)}
.related__m{text-align:center;margin-top:48px}   /* 本文と帯の間隔 */
.mcbg:has(+.cc) .mcl{padding-bottom:0}
.credit{padding-bottom:80px}
.cc__g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));--cpu-columns:2}
.cc__c{padding:72px 80px 80px;transition:none}
.cc__c:hover{opacity:1}
.cc__c.-contact{background:var(--c-main);color:var(--c-on)}   /* お問い合わせ・資料請求の帯はメインカラーで描く（CEO 2026-11-06） */
.cc__c.-dl{background:var(--c-surface);color:var(--c-ink);box-shadow:inset 0 0 0 2px var(--c-main)}   /* 資料請求ボタン */
.cc__t{display:flex;flex-direction:column;gap:16px}
.cc__h{display:flex;justify-content:space-between;align-items:center;gap:24px}
.cc__ti{display:flex;align-items:center;gap:14px}
.cc__ic{flex:none;width:36px;height:36px;font-size:31px}
.cc__h b{font-size:28px;line-height:50.4px;letter-spacing:1.12px}
.cc__m{display:flex;align-items:center;gap:16px;font:700 16px/20.8px var(--f-en)}
.cc__m i:not(.fi){flex:0 0 32px;height:32px;border-radius:50%;display:grid;place-items:center;transition:scale .25s cubic-bezier(.22,.7,.2,1)}
.cc__m i:not(.fi)::after{content:"";width:8px;height:8px;border-radius:50%}
.cc__c.-contact .cc__m i:not(.fi){background:var(--c-on)}.cc__c.-contact .cc__m i:not(.fi)::after{background:var(--c-main)}
.cc__c.-dl .cc__m i:not(.fi){background:var(--c-main)}.cc__c.-dl .cc__m i:not(.fi)::after{background:var(--c-on)}
.cc__c:hover .cc__m i:not(.fi){scale:1.4}
.cc__p{max-width:560px;font-size:16px;line-height:33.6px;letter-spacing:.32px;text-wrap:pretty}
@media(max-width:1100px){.cc__c{padding:64px 40px 72px}}
@media(max-width:767px){.cc__g{grid-template-columns:1fr;--cpu-columns:1}.cc__c{padding:44px var(--gutter-s) 52px}.cc__ic{width:28px;height:28px;font-size:24px}.cc__ti{gap:10px}.cc__h b{font-size:22px;line-height:36px}.cc__m{font-size:0;gap:0}.cc__p{font-size:14px;line-height:28px}}

/* 試用の帯 */

/* フッター（2サイト共通。CEO 2026-11-02）：線なし。上下の余白 PC40/20px・スマホ32/16px、項目の間隔 PC24px・スマホ28px、列の見出しの下10px、コピーライトの上32px（スマホ24px）、SNSは44pxの丸 */
.ft{background:#eef0f3;padding:40px var(--gutter) 20px}
.ft__in{max-width:var(--w-foot);margin:0 auto}
.ft__top{display:grid;grid-template-columns:300px minmax(0,1fr);gap:56px}
.ft__brand p{margin:12px 0 16px;font-size:13px;line-height:24px;color:var(--c-sub)}
.ft__sns{display:flex;gap:10px}
.ft__sns a{display:grid;place-items:center;width:44px;height:44px;border:1px solid currentColor;border-radius:50%;color:var(--c-ink)}
.ft__sns .fi{width:16px;height:16px;font-size:14px}
.ft__cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;--cpu-columns:4}
.ft__h{display:block;margin-bottom:10px;font-size:14px;line-height:22px;font-weight:700;color:var(--c-ink)}
.ft__cols ul{display:grid;gap:4px}
.ft__cols li{line-height:20px}
.ft__cols li a{font-size:13px;line-height:20px;color:var(--c-text)}
.ft a:hover{text-decoration:underline}
.ft__sns a:hover{text-decoration:none;background:var(--c-ink);color:var(--c-on)}
.ft__b{display:flex;justify-content:flex-end;margin-top:32px}
.ft__copy{font-size:12px;line-height:18px;color:var(--c-sub)}   /* コピーライト */
.ft__copy a{color:var(--c-ink);text-decoration:underline;text-decoration-color:#b9bdc6}
@media(max-width:1023px){.ft__top{grid-template-columns:1fr;gap:32px;--cpu-columns:1}.ft__cols{gap:24px}}
@media(max-width:767px){.ft{padding:32px var(--gutter-s) 16px}.ft__cols{grid-template-columns:repeat(2,minmax(0,1fr));--cpu-columns:2}.ft__cols ul{gap:0}.ft__cols li a{display:block;padding:4px 0}.ft__b{justify-content:center;margin-top:24px}}

/* トップの資料とFAQ */
.dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));justify-content:space-between;gap:24px;margin-top:40px;--cpu-columns:3}
.dl .im{height:207px;overflow:hidden;margin-bottom:20px}
.dl .im img{width:100%;height:100%;object-fit:cover}
.dl h3{font-size:var(--fs-h3);line-height:var(--lh-h3);font-weight:600;margin:0 0 20px;text-align:center;}








/* サービス */
.smv{background:var(--c-surface);padding:60px 0;margin-top:0}   /* サービスの最初の画面の地は白（CEO 2026-11-03） */
.smv .inner{display:flex;align-items:center;justify-content:space-between;gap:48px}
.smv__c{flex:1;min-width:0}
.smv__i{width:480px;height:300px;flex:none;border-radius:12px;overflow:hidden;background:var(--c-sec)}
.smv__i img{width:100%;height:100%;object-fit:cover}
@media(max-width:1100px){.smv .inner{flex-direction:column;align-items:stretch}.smv__i{width:100%;height:220px}}
.smv h1{font-size:var(--fs-hero);line-height:var(--lh-hero);color:var(--c-link);margin-bottom:24px;letter-spacing:.4px}
.smv p{font-size:var(--fs-body);line-height:var(--lh-body);margin-bottom:24px}
.sabout{background:var(--c-main);color:var(--c-on);padding:60px 0}
.sabout h2{font-size:var(--fs-h2);line-height:var(--lh-h2);font-weight:600;letter-spacing:.4px;margin-bottom:24px}
.sabout p{font-size:var(--fs-body);line-height:var(--lh-body);max-width:720px}
/* 課題と解決 */
.pa{display:grid;gap:20px;margin-top:40px}
.pa__r{display:grid;grid-template-columns:minmax(0,1fr) 64px minmax(0,1fr);align-items:stretch}
.pa__q{display:flex;align-items:center;justify-content:center;padding:32px 40px;background:var(--c-surface);border:1px solid var(--c-line);font-size:var(--fs-lead);line-height:var(--lh-lead);font-weight:700;color:var(--c-ink);text-align:center}   /* お悩みは強めの文の大きさ・中央寄せ・決めた所で改行（CEO 2026-11-03） */
.pa__ar{width:28px;height:28px;align-self:center;justify-self:center;}
.pa__a{display:flex;flex-direction:column;justify-content:center;gap:2px;padding:28px 40px;background:var(--c-navy);color:var(--c-on);font-size:var(--fs-body);line-height:var(--lh-body)}
.pa__a b{font-size:26px;line-height:38px;}
@media(max-width:767px){.pa__r{grid-template-columns:1fr;--cpu-columns:1}.pa__q{padding:24px 12px}.pa__a{padding:24px 20px}.pa__ar{transform:rotate(90deg);margin:8px 0}.pa__a b{font-size:22px;line-height:32px}}

/* サービス詳細 */




.util{padding:80px 40px}
.util__w{max-width:var(--w-wide);margin:0 auto}
.util h2{font-size:var(--fs-h2);line-height:var(--lh-h2);text-align:center;letter-spacing:.4px;}
.util__lead{text-align:center;font-size:var(--fs-body);line-height:var(--lh-body);font-weight:400;margin:32px 0 48px}
.util__g{display:grid;grid-template-columns:repeat(3,1fr);gap:48px 24px;--cpu-columns:3}
.util__g a{display:flex;flex-direction:column;gap:16px;color:var(--c-ink);transition:none}
.util__g a:hover{opacity:1}
.util__g .im{height:206px;overflow:hidden}
.util__g img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.util__g a:hover img{transform:scale(1.05)}
.util__g b{font-size:16px;line-height:22.4px;letter-spacing:.96px;text-wrap:balance}

/* 問い合わせ */


/* 検索 */

/* 人気記事 */

/* 404 */
.nf{display:flex;justify-content:space-between;gap:48px;padding-bottom:80px}
.nf__l{width:770px}
.nf__l p{font-size:var(--fs-body);line-height:var(--lh-body);margin-bottom:24px}
.nf__l ul{margin-bottom:24px}
.nf__l li{font-size:var(--fs-body);line-height:var(--lh-body);padding-left:25px;position:relative;margin-bottom:17px}
.nf__l li::before{content:"";position:absolute;left:2px;top:6px;width:10px;height:10px;border-radius:50%;background:var(--c-main)}
.nf__r{width:326px;display:flex;flex-direction:column;gap:12px}
.nf__r a{display:flex;align-items:center;justify-content:space-between;min-height:92px;padding:0 20px 0 130px;background:var(--c-pale);border-radius:8px;font-size:15px;font-weight:700;color:var(--c-main);position:relative;overflow:hidden}
.nf__r a img{position:absolute;left:0;width:110px;height:92px;object-fit:cover}
.nf__r a::after{content:"";width:16px;height:16px;border-radius:50%;background:var(--c-main);flex:none}   /* 右の丸はメインカラー（1.7.1） */

/* クレジット */
.credit{width:calc(100% - 2*var(--gutter));max-width:var(--w-inner);margin:0 auto}
.credit table{border-collapse:collapse;font-size:13px;line-height:20px}
.credit th,.credit td{border:1px solid var(--c-line);padding:8px;text-align:left;font-weight:500;vertical-align:middle;word-break:break-all}
.credit th{background:var(--c-bg)}
.credit img{width:96px;height:64px;object-fit:cover}

/* スマホ */
@media(max-width:1280px){
  .mcl{grid-template-columns:minmax(0,1fr);gap:32px;padding:48px 0 64px;--cpu-columns:1}
  .side{position:static}
}
@media(max-width:1100px){
  .mhero{padding:90px var(--gutter-s) 0}
  .mhero__w{flex-direction:column;align-items:stretch;gap:32px}
  .mhero__c,.mhero__i{width:100%}
  .mhero__i{height:260px}
  .dl{grid-template-columns:1fr;--cpu-columns:1}
  .util__g{grid-template-columns:repeat(2,minmax(0,1fr));--cpu-columns:2}
  .ft__g{grid-template-columns:repeat(2,1fr);--cpu-columns:2}
  .nf{flex-direction:column}.nf__l,.nf__r{width:100%}
}
@media(max-width:767px){
  .inner,.credit{width:calc(100% - 2*var(--gutter-s))}
  .sec{padding:var(--sec-pad-s) 0}
  .rtt{font-size:var(--fs-h2);line-height:var(--lh-h2);margin-bottom:24px}
  .linkbox{flex-direction:column;align-items:flex-start;gap:16px}
  .mhero h1{font-size:var(--fs-hero);line-height:var(--lh-hero)}
  .mhero__b .mbtn{width:100%}
  .mcl{width:calc(100% - 2*var(--gutter-s))}
  .mcmain.-art{padding:24px 16px 40px}
  .mhead{flex-direction:column;gap:16px}
  .mhead h1{font-size:var(--fs-title);line-height:var(--lh-title)}   /* スマホの一覧の題（トガリネズミと同じ） */
  .cards{gap:32px}
  .cats{gap:12px}
  .count{padding-top:40px;font-size:var(--fs-h2);line-height:var(--lh-h2)}
  .ah h1{font-size:23px;line-height:34.5px}
  .ah figure img{height:auto;aspect-ratio:16/9}
  .toc{padding:28px 20px 24px}.toc b{font-size:21.6px;line-height:38.88px}.toc>ol>li{padding-left:40px}
  .body h2{font-size:19px;line-height:28.5px}
  .body p{font-size:14px;line-height:25.2px}.body ul{font-size:14px;line-height:25.2px}.body h3{font-size:18px;line-height:28.8px}.ah__d{font-size:11.7px;line-height:17.55px}.tbl{font-size:14px;line-height:21px}   /* スマホの文字は raminc.co.jp の記事に合わせる（CEO 2026-11-03） */
  .ft__g{grid-template-columns:1fr;--cpu-columns:1}
  .util{padding:48px 15px}
  .util__g{grid-template-columns:1fr;--cpu-columns:1}

  .smv h1{font-size:var(--fs-hero);line-height:var(--lh-hero)}
  .sabout h2{font-size:var(--fs-h2);line-height:var(--lh-h2);letter-spacing:.4px}

  .nf__l p{font-size:var(--fs-body);line-height:var(--lh-body)}
  .credit table,.credit tbody,.credit tr,.credit td,.credit th{display:block;width:100%}
  .credit thead{display:none}
  .credit tr{border:1px solid var(--c-line);margin-bottom:12px}
  .credit td{border:0;padding:4px 8px}
  .pager{padding:0 15px 48px;}
}

/* 内容量の変化に対応 */
/* 写真枠を維持 */
.ah figure{background:var(--c-sec)}

/* 項目を折り返す */
.card__h{flex-wrap:wrap;gap:8px 24px}
.card__h span,.card__h i:not(.fi){min-width:0;max-width:100%}
.pager,.mhero__b,.hd__util{flex-wrap:wrap}
.ft__g>div,.nf__l,.nf__r{min-width:0}

/* 行末を整える */
h1,h2,h3,h4,.bq,.card__m,.btn,.mbtn,.mhead p{text-wrap:balance}
p,li,td,small,.mhero p,.sabout p,.body p{text-wrap:pretty}
.tbl td,.tbl th{text-wrap:pretty}
@media(max-width:767px){.sabout h2 br,.smv p br{display:none}}


}

/* 文節単位で折り返す */
body{word-break:auto-phrase}

.card figure{position:relative}
.card__r{position:absolute;left:0;top:0;z-index:1;min-width:40px;height:40px;padding:0 10px;display:flex;align-items:center;justify-content:center;background:var(--c-ink);color:var(--c-on);font-family:var(--f-en);font-size:18px;line-height:1;font-weight:700}

@media(max-width:767px){.afoot{grid-template-columns:1fr;margin:48px -16px -40px;--cpu-columns:1}.afoot__l{border-right:0;border-bottom:1px dashed rgba(255,255,255,.25);padding:32px 20px 24px}.afoot__r{padding:24px 20px 32px}.afoot__sns{justify-content:center;gap:12px}}
/* 記事本文は通常の折り返し */
.body p,.body li{word-break:normal}
/* 最小タップ高さ */
.btn.-line{display:inline-flex;align-items:center;min-height:44px}

/* サービス一覧 */
.svm{background:var(--c-sec);padding:var(--sec-pad) var(--gutter)}
.svm__w{max-width:var(--w-inner);margin:0 auto}
.svm h2{font-size:var(--fs-h2);line-height:var(--lh-h2);text-align:center;letter-spacing:.4px;}
.svm__lead{text-align:center;font-size:var(--fs-body);line-height:var(--lh-body);letter-spacing:.4px;margin:24px 0 48px}
.svm__g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;--cpu-columns:2}
.svm__i{display:grid;grid-template-columns:240px minmax(0,1fr);background:var(--c-surface);color:var(--c-ink);transition:none}
.svm__i:hover{opacity:1}
.svm__im{overflow:hidden;min-height:240px}   /* 写真はカードの端に余白なしで、幅240px・高さはカードいっぱい（短いカードでは正方形）。写真の下に余白を作らない（CEO 2026-11-03） */
.svm__im img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.svm__i:hover .svm__im img{transform:scale(1.05)}
.svm__c{display:flex;flex-direction:column;padding:28px 32px}
.svm__t{font-size:22px;line-height:32px;margin-bottom:8px}
.svm__p{font-size:14px;line-height:25px;color:var(--c-text);margin-bottom:14px;text-wrap:pretty}
.svm__tags{display:flex;flex-wrap:wrap;gap:6px}
.svm__tags span{font-size:12px;line-height:20px;padding:2px 10px;border:1px solid var(--c-line);border-radius:20px;color:var(--c-sub)}
.svm__m{margin-top:auto;padding-top:16px;align-self:flex-end;font-size:14px;font-weight:400}
.arw,.svm__m::after,.sv__m::after{content:"";display:inline-block;flex:none;width:20px;height:9px;background:currentColor;-webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 9'><path d='M0 8.25H19.2L12.6 2.2' fill='none' stroke='black' stroke-width='1.5'/></svg>") no-repeat center/contain;mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 9'><path d='M0 8.25H19.2L12.6 2.2' fill='none' stroke='black' stroke-width='1.5'/></svg>") no-repeat center/contain}   /* 項目の矢印＝線の右端に上だけの返し（下の返しなし）。詳細を見る・お知らせの行など。CEO 2026-11-03 */
.svm__m::after{margin-left:.5em;vertical-align:middle}
.svm__i:hover .svm__m{text-decoration:underline}
@media(max-width:1023px){.svm__g{grid-template-columns:1fr;--cpu-columns:1}}
@media(max-width:767px){.svm{padding:var(--sec-pad-s) var(--gutter-s)}.svm h2{font-size:var(--fs-h2);line-height:var(--lh-h2)}.svm__lead{margin:16px 0 32px;font-size:var(--fs-body);line-height:var(--lh-body)}.svm__i{grid-template-columns:120px minmax(0,1fr)}.svm__im{min-height:0}.svm__c{padding:20px}.svm__t{font-size:18px;line-height:28px}}

/* 他社比較表 */
.vs{padding:var(--sec-pad) var(--gutter);background:var(--c-surface)}
.vs__w{max-width:var(--w-inner);margin:0 auto}
.vs h2{font-size:var(--fs-h2);line-height:var(--lh-h2);text-align:center;letter-spacing:.4px;}
.vs__lead{text-align:center;font-size:var(--fs-body);line-height:var(--lh-body);letter-spacing:.4px;margin:24px 0 48px}
.vs__s{overflow-x:auto}
.vs__t{width:100%;min-width:760px;border-collapse:collapse;table-layout:fixed}
.vs__t th,.vs__t td{border:1px solid var(--c-line);padding:18px 16px;text-align:center;vertical-align:middle;font-size:var(--fs-body);line-height:var(--lh-body);color:var(--c-text)}
.vs__t thead th{padding:20px 12px;background:var(--c-sec);font-size:var(--fs-body);line-height:var(--lh-body);font-weight:700;color:var(--c-ink)}
.vs__t tbody th{width:22%;background:var(--c-sec);text-align:left;font-weight:700;color:var(--c-ink)}
.vs__t thead th:first-child{width:22%}
.vs__t thead th.-me{background:var(--c-navy);color:var(--c-on);font-size:var(--fs-body);line-height:var(--lh-body)}
.vs__t td.-me{background:var(--c-pale);color:var(--c-ink);font-weight:700}
.vs__m{display:block;margin-bottom:2px;font-size:22px;line-height:30px;color:var(--c-sub)}
.vs__t td.-me .vs__m{color:var(--c-navy)}
.vs__note{margin-top:16px;font-size:13px;line-height:22px;color:var(--c-sub)}
.u-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media(max-width:767px){.vs{padding:var(--sec-pad-s) var(--gutter-s)}.vs h2{font-size:var(--fs-h2);line-height:var(--lh-h2)}.vs__lead{margin:16px 0 32px;font-size:var(--fs-body);line-height:var(--lh-body)}}

/* 支援内容 */
.flw{padding:var(--sec-pad) var(--gutter);background:var(--c-sec)}
.flw__w{max-width:var(--w-inner);margin:0 auto}
.flw h2{font-size:var(--fs-h2);line-height:var(--lh-h2);text-align:center;letter-spacing:.4px;}
.flw__lead{text-align:center;font-size:var(--fs-body);line-height:var(--lh-body);letter-spacing:.4px;margin:24px 0 48px}
.flw__g{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;;--cpu-columns:3}
.flw__i{position:relative;overflow:hidden;padding:40px 32px 32px;background:var(--c-surface)}
.flw__n{position:absolute;top:-14px;right:12px;font:600 96px/1 var(--f-en);color:var(--c-sec);pointer-events:none}
.flw__i h3,.flw__i p,.flw__i ul{position:relative}
.flw__i h3{font-size:var(--fs-h3);line-height:var(--lh-h3);margin-bottom:8px}
.flw__i p{font-size:var(--fs-small);line-height:var(--lh-small);color:var(--c-text);margin-bottom:18px}
.flw__i ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 12px;list-style:none;padding:16px 0 0;border-top:1px solid var(--c-line);font-size:var(--fs-small);line-height:var(--lh-small);color:var(--c-ink);--cpu-columns:2}
.flw__i li::before{content:"";display:inline-block;width:6px;height:6px;margin-right:8px;border-radius:50%;background:var(--c-navy);vertical-align:middle}
@media(max-width:1023px){.flw__g{grid-template-columns:repeat(2,minmax(0,1fr));--cpu-columns:2}}
@media(max-width:767px){.flw{padding:var(--sec-pad-s) var(--gutter-s)}.flw h2{font-size:var(--fs-h2);line-height:var(--lh-h2)}.flw__lead{margin:16px 0 32px;font-size:var(--fs-body);line-height:var(--lh-body)}.flw__g{grid-template-columns:1fr;--cpu-columns:1}.flw__i{padding:32px 20px 24px}.flw__n{font-size:72px}}

/* サポート */
.spa{display:grid;gap:20px}
.spa__i{display:grid;grid-template-columns:280px minmax(0,1fr);background:var(--c-surface)}
.spa__im{position:relative;min-height:180px}
.spa__im img{position:absolute;width:100%;height:100%;object-fit:cover}
.spa__c{display:flex;flex-direction:column;justify-content:center;padding:32px 40px}
.spa__c h3{font-size:var(--fs-h3);line-height:var(--lh-h3);margin-bottom:10px}
.spa__c p{font-size:var(--fs-body);line-height:var(--lh-body);color:var(--c-text);}
@media(max-width:767px){.spa__i{grid-template-columns:1fr;--cpu-columns:1}.spa__im{min-height:0;height:180px}.spa__c{padding:24px 20px}.spa__c h3{font-size:var(--fs-h3);line-height:var(--lh-h3)}}

/* 関連記事と実績 */
.rl{margin-top:48px}
.rl__h{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px}
.rl__h h3{font-size:var(--fs-h3);line-height:var(--lh-h3);}
.rl__nv{display:flex;gap:10px}
.rail__b{width:48px;height:48px;border:1px solid var(--c-main);border-radius:50%;background:var(--c-main);box-shadow:0 6px 16px color-mix(in srgb,var(--c-main) 25%,transparent);cursor:pointer;display:grid;place-items:center}
.rail__b::before{content:"\f054";font:var(--fa-font-solid);font-size:14px;color:var(--c-on)}
.rail__b.-p::before{content:"\f053"}
.rail__b:disabled{background:var(--c-surface);border-color:#c6d2e8;box-shadow:none;cursor:default}
.rail__b:disabled::before{border-color:#c6d2e8}
.rail__l{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.rail__l::-webkit-scrollbar{display:none}
.rl__i{flex:0 0 calc((100% - 48px) / 3);scroll-snap-align:start;display:flex;flex-direction:column;overflow:hidden;border-radius:14px;background:var(--c-surface);border:1px solid var(--c-line2);color:var(--c-ink);transition:none}
.rl__i:hover{opacity:1}
.rl__f{position:relative;aspect-ratio:1200/630;overflow:hidden}
.rl__f img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.rl__i:hover .rl__f img{transform:scale(1.05)}
.rl__k{position:absolute;top:16px;left:16px;z-index:1;padding:3px 12px;border-radius:20px;background:var(--c-surface);font-size:12px;line-height:20px;font-weight:700;color:var(--c-main)}   /* カテゴリの札・関連記事の矢印（.rail__b）はメインカラー（1.7.1） */
.rl__r{position:absolute;top:12px;right:12px;z-index:1;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--c-navy);color:var(--c-on);font:600 16px/1 var(--f-en)}
.rl__c{display:flex;flex-direction:column;flex:1;padding:22px 24px 22px}
.rl__t{font-size:17px;line-height:28px;font-weight:700;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rl__i:hover .rl__t{text-decoration:underline}
.related__m .mbtn{border-radius:30px;background:var(--c-surface);color:var(--c-navy);border:1px solid #c6d2e8}
@media(max-width:1023px){.rl__i{flex-basis:calc((100% - 24px) / 2)}}
@media(max-width:767px){.related{padding:56px 0}.related__w>.rt,.related h2,.related__lead,.rl__h,.related__m{padding:0 var(--gutter-s)}.rl{margin-top:32px}.rl__nv{display:none}.rail__l{gap:14px;padding:0 var(--gutter-s);scroll-padding-left:var(--gutter-s)}.rl__i{flex-basis:78%}.rl__t{font-size:15px;line-height:24px}}

/* 資料請求 */
.dlp__g{display:grid;gap:16px;}
.dlp__i{display:grid;grid-template-columns:120px minmax(0,1fr);gap:16px;align-items:center;padding:16px;border:1px solid var(--c-line2);border-radius:8px;background:var(--c-surface)}
.dlp__f{height:84px;overflow:hidden;border-radius:4px}
.dlp__f img{height:100%;object-fit:cover}
.dlp__c{display:flex;flex-direction:column;gap:4px;min-width:0}
.dlp__c b{font-size:16px;line-height:24px;}
.dlp__c span{font-size:13px;line-height:22px;color:var(--c-text)}
.dlp__c small{font:500 12px/18px var(--f-en);color:var(--c-lab)}
@media(max-width:767px){.dlp__i{grid-template-columns:88px minmax(0,1fr);gap:12px;padding:12px}.dlp__f{height:64px}}

/* お問い合わせ */
.ctp{padding:72px 0 80px;background:var(--c-surface)}
.ctp__w{display:grid;grid-template-columns:minmax(0,440px) minmax(0,1fr);gap:64px;align-items:start}
.ctp h1{font-size:var(--fs-title);line-height:var(--lh-title);margin:4px 0 20px}
.ctp__lead{font-size:var(--fs-body);line-height:var(--lh-body);color:var(--c-text)}
.ctp:has(+.company){padding-bottom:0}   /* 会社概要 */
.ctp__logo,.ctp__docs{margin-top:40px;padding-top:28px;border-top:1px solid var(--c-line)}
.ctp__logo h2,.ctp__docs h2{font-size:var(--fs-h3);line-height:var(--lh-h3);margin-bottom:14px}
.ctp__logo ul{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;--cpu-columns:4}
.ctp__logo li{display:grid;place-items:center;height:56px;border:1px solid var(--c-line);border-radius:6px;font:700 11px/1 var(--f-en);letter-spacing:.08em;color:var(--c-lab)}
.ctp__embed{position:relative;min-height:640px;padding:40px;border:1px solid var(--c-line);border-radius:10px;background:var(--c-surface)}   /* RAM Form */
.ctp__embed:not(:has(iframe))::before{content:"ここにRAM Formのフォームが入ります（埋め込みを許したサイトでだけ表示されます）";position:absolute;inset:40px;display:grid;place-items:center;padding:24px;border:1px dashed var(--c-line);border-radius:8px;text-align:center;font-size:14px;line-height:24px;color:var(--c-sub)}
.ctp__tel{margin-top:72px;padding:48px;border-radius:10px;background:var(--c-sec);text-align:center}
.ctp__tel h2{font-size:var(--fs-h2);line-height:var(--lh-h2);margin-bottom:10px}
.ctp__tel>p{font-size:var(--fs-body);line-height:var(--lh-body);color:var(--c-text)}
.ctp__tel dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;max-width:800px;margin:28px auto 0;--cpu-columns:2}
.ctp__tel dl>div{padding:24px;border-radius:8px;background:var(--c-surface)}
.ctp__tel dt{font-size:13px;line-height:20px;font-weight:700;color:var(--c-sub)}
.ctp__tel dd.-en{margin:6px 0 4px;font:700 26px/1.3 var(--f-en);color:var(--c-ink);overflow-wrap:anywhere}
.ctp__tel small{font-size:12px;color:var(--c-sub)}
.ctp__note{margin-top:20px;}
@media(max-width:1023px){.ctp__w{grid-template-columns:1fr;gap:40px;--cpu-columns:1}}
@media(max-width:767px){.ctp{padding:40px 0 48px}.ctp h1{font-size:var(--fs-title);line-height:var(--lh-title)}.ctp__logo ul{grid-template-columns:repeat(2,minmax(0,1fr));--cpu-columns:2}.ctp__embed{min-height:560px;padding:20px}.ctp__embed:not(:has(iframe))::before{inset:20px}.ctp__tel{margin-top:48px;padding:32px 20px}.ctp__tel dl{grid-template-columns:1fr;--cpu-columns:1}.ctp__tel dd.-en{font-size:22px}}

/* 資料一覧 */
.dll__lead{max-width:720px}
.dll{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:40px;;--cpu-columns:4}
.dll__i{display:flex;flex-direction:column;gap:8px;padding:16px 16px 20px;border:1px solid var(--c-line2);border-radius:8px;background:var(--c-surface)}
.dll__f{height:150px;margin-bottom:6px;overflow:hidden;border-radius:4px}
.dll__f img{width:100%;height:100%;object-fit:cover}
.dll__i b{font-size:16px;line-height:24px;}
.dll__i span{font-size:13px;line-height:22px;color:var(--c-text)}
.dll__i small{font:500 12px/18px var(--f-en);color:var(--c-lab)}
.dll__b{margin-top:auto;background:var(--c-navy);color:var(--c-on)}
.dll__b:hover{opacity:.85}
.dll__next{margin-top:56px;padding:32px;border-radius:10px;background:var(--c-sec);text-align:center}
.dll__next p{font-size:var(--fs-body);line-height:var(--lh-body);color:var(--c-text);margin-bottom:16px}
@media(max-width:1023px){.dll{grid-template-columns:repeat(2,minmax(0,1fr));--cpu-columns:2}}
@media(max-width:767px){.dll{grid-template-columns:minmax(0,1fr);--cpu-columns:1}.dll__next{padding:24px 20px}}

/* プライバシーポリシー */
.doc{margin-top:48px}   /* 本文幅 */
.doc h2{margin:48px 0 16px;padding-left:14px;border-left:4px solid var(--c-navy);font-size:var(--fs-h3);line-height:var(--lh-h3);font-weight:700;color:var(--c-ink)}
.doc h2:first-child{margin-top:0}
.doc h3{margin:24px 0 10px;font-size:var(--fs-h3);line-height:var(--lh-h3);}
.doc p{margin-bottom:12px;font-size:var(--fs-body);line-height:var(--lh-body);color:var(--c-text)}
.doc ul{margin:0 0 16px;padding-left:1.4em;list-style:disc;font-size:var(--fs-body);line-height:var(--lh-body);color:var(--c-text)}
.doc li{margin-bottom:6px}
.doc a{color:var(--c-text-link);text-decoration:underline}
.doc__date{margin-top:40px;text-align:right}
@media(max-width:767px){.doc{margin-top:32px}.doc h2{margin-top:36px;font-size:var(--fs-h3);line-height:var(--lh-h3)}}

/* よくある質問 */
.qa{padding:var(--sec-pad) var(--gutter);background:var(--c-surface)}
.qa__w{max-width:var(--w-inner);margin:0 auto}
.qa h2{font-size:var(--fs-h2);line-height:var(--lh-h2);text-align:center;margin-bottom:40px}
@media(max-width:767px){.qa{padding:var(--sec-pad-s) var(--gutter-s)}.qa h2{font-size:var(--fs-h2);line-height:var(--lh-h2);margin-bottom:24px}}



/* 会社概要の表 */
.company{font-family:var(--f-ja);font-size:var(--fs-body);line-height:1.8;font-weight:400;color:var(--c-ink);background:var(--c-surface)}
.company__w{padding:64px 24px;background:var(--c-surface);line-height:28px}
.company__c{display:flex;flex-direction:column;gap:64px;max-width:var(--w-inner);margin:0 auto;}
.company__t{display:grid;grid-template-columns:auto 1fr;column-gap:64px;border-color:var(--c-line);border-bottom:1px solid var(--c-line)}
.company__r{display:grid;grid-template-columns:subgrid;grid-column:1/-1;padding:16px;border-color:var(--c-line);border-top:1px solid var(--c-line)}
.company__r dt{font-weight:600}
.company__r a{color:var(--c-text-link);text-decoration:underline;text-underline-offset:.125em}
@media(max-width:767px){.company__w{padding-inline:var(--gutter-s)}}

/* パンくず */
.crumb{background:color-mix(in srgb,var(--c-main) 12%,#fff);padding:12px 0}   /* 帯はメインカラーの薄い色（本文の h3 と同じ。CEO 2026-11-03） */
.crumb ol{display:flex;flex-wrap:nowrap;align-items:center;gap:8px;max-width:var(--crumb-w);margin:0 auto;padding:0 var(--crumb-pad);list-style:none;font-size:14px;line-height:20px;letter-spacing:.4px;font-weight:400;color:var(--crumb-tx);white-space:nowrap;word-break:keep-all;overflow-x:auto;scrollbar-width:thin}
.crumb li{flex:none}
.crumb li+li::before{content:"\f054";font:var(--fa-font-solid);font-size:8px;vertical-align:1px;color:var(--crumb-sep);margin-right:8px}
.crumb a{display:inline-flex;align-items:center;gap:6px;color:inherit;text-decoration:none}   /* 札の飾りはなし（文字と家のアイコンだけ。CEO 2026-11-03） */
.crumb a:hover{text-decoration:underline;text-underline-offset:3px}
.crumb [aria-current]{color:#666}
.crumb+.ctp,.crumb+.pg,.crumb+.abx-hero,.crumb+.mhero,.crumb+.mhero.-pt60,.crumb+.smv,.crumb+.mcbg>.mcl,.crumb+.gnd>.au,.crumb+.gnd>.pg,.crumb+.sd>.sd__m>.fw:first-child{padding-top:20px}   /* パンくずから本文までの余白はどのページも20px（スマホ16px）。CEO 2026-11-03：広すぎる */
.crumb+.mcbg>.mcl>.mcmain>.au:first-child{padding-top:0}   /* 書いた人のページはプロフィールの上の余白を重ねない */
@media(max-width:767px){.crumb+.ctp,.crumb+.pg,.crumb+.abx-hero,.crumb+.mhero,.crumb+.mhero.-pt60,.crumb+.smv,.crumb+.mcbg>.mcl,.crumb+.gnd>.au,.crumb+.gnd>.pg,.crumb+.sd>.sd__m>.fw:first-child{padding-top:16px}}
/* 固定ヘッダー分の余白 */
.crumb{margin-top:var(--hd-h)}
@media(max-width:767px){
  .crumb{padding:12px 0;margin-top:var(--hd-h-s)}
  .crumb ol{padding:0 var(--crumb-pad-s)}
}
/* サイト幅 */
.hd{padding:0 40px}
@media(max-width:767px){.hd{padding:0 var(--gutter-s)}}

/* 一覧カード */
.mcl.-wide{grid-template-columns:minmax(0,1fr);--cpu-columns:1}
.mcl.-wide .cards{grid-template-columns:repeat(3,minmax(0,1fr));--cpu-columns:3}
@media(max-width:1100px){.mcl.-wide .cards{grid-template-columns:repeat(2,minmax(0,1fr));--cpu-columns:2}}
@media(max-width:767px){.mcl.-wide .cards{grid-template-columns:1fr;--cpu-columns:1}}

/* お知らせ欄 */




/* トップのサービス */
.svc{font-family:var(--f-ja);font-size:var(--fs-body);line-height:1.8;font-weight:400;color:var(--c-ink);background:var(--c-surface)}
.svc__w{padding:64px 24px;background:var(--c-surface);line-height:28px}
.svc__w>*{max-width:var(--w-inner);margin-inline:auto}
.svc .linkbox{margin-bottom:0}
.svc p{text-wrap:balance}
.svc p.rt{margin-bottom:6px}
.svc .btn.-line{line-height:28px}
@media(max-width:767px){.svc__w{padding-inline:var(--gutter-s)}}
.svc-sl{display:grid;grid-auto-flow:column;grid-auto-columns:min(20rem,82%);gap:20px;margin-top:40px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:4px}
.svc-sl::-webkit-scrollbar{display:none}
.svc__card{display:grid;grid-template-rows:subgrid;grid-row:span 2;gap:24px;padding:24px;border-radius:6px;background:var(--c-sec);color:inherit;text-decoration:none;scroll-snap-align:start}
.svc__head{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:20px}
.svc__f{max-width:4.5rem;aspect-ratio:1/1;border-radius:99rem;overflow:hidden}
.svc__f img{height:100%;object-fit:cover}
.svc__meta{display:flex;flex-direction:column;gap:12px;}
.svc__name,.svc__note,.svc__desc{margin-block:calc(.5em - .5lh)}
.svc__name{font-size:var(--fs-body);line-height:var(--lh-body);font-weight:600}
.svc__note{font-size:12.8px;line-height:24.8px;opacity:.6}
.svc__desc{font-size:var(--fs-small);line-height:var(--lh-small);color:var(--c-sub)}
.svc__card:hover .svc__name{color:var(--c-main);text-decoration:underline}
.svc-nv{display:flex;justify-content:flex-end;gap:12px;margin-top:24px}
.svc-nv button{width:48px;height:48px;padding:5.5px 11px;border-radius:50%;border:1px solid var(--c-link);background:var(--c-surface);color:var(--c-link);font-size:22px;line-height:1;cursor:pointer}
.svc-nv button:disabled{opacity:.35;cursor:default}
@media(max-width:767px){.svc-sl{margin-top:24px;gap:12px}.svc-nv{justify-content:center}}
/* 新着記事一覧ボタン */
.mcmain>.more{text-align:center;padding-top:8px}
/* 英字ラベル */
.rt.-c{text-align:center}
.mhead p.rt{margin-bottom:4px}
@media(max-width:767px){.mhead{align-items:flex-start}}
.rt+h1,.rt+h2{margin-top:0}

.rt{font-weight:500}


   /* 本文の配置 */
/* 新着と人気の切り替え */
.sorthd{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap}
.sort{display:flex;gap:8px}
.sort button{font-family:inherit;font-style:inherit;font-variant:inherit;font-stretch:inherit;font-kerning:inherit;font-optical-sizing:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-language-override:inherit;font-size-adjust:inherit;letter-spacing:.96px;color:var(--c-sub);background:none;border-color:var(--c-sub);cursor:pointer;transition:background .2s,color .2s}
.sort button[aria-selected="true"],.sort button:hover{background:var(--c-ink);color:var(--c-on);border-color:var(--c-ink)}

/* ヘッダー */
.hd .logo{margin-right:auto}


/* ヘッダー幅 */
@media(min-width:1281px){.hd{padding-left:calc((100% - 1200px) / 2);padding-right:calc((100% - 1200px) / 2)}}
   /* 区切り幅 */
.ah h1{word-break:normal;line-break:strict;text-wrap:wrap}   /* 記事の題は文節で区切らず、横幅いっぱいまで詰めて折り返す（本文と同じ右端まで。raminc.co.jp と同じ。CEO 2026-11-03） */


/* アイコン */
.fi{display:inline-flex;align-items:center;justify-content:center;line-height:1}

/* HTMLの固定値 */
.rtt.-mb0{margin-bottom:0}
.linkbox__p{font-size:var(--fs-body);line-height:var(--lh-body)}
.mhero.-pt60{padding-top:60px}
.nf__actions{padding:24px 0 0}
.nf__btn{width:380px;max-width:100%;background:var(--c-main);border-color:var(--c-main)}   /* 404の「トップページへ」はメインカラー（1.7.1。.btn.-navy の --c-link より後・層の外なので勝つ） */

/* お知らせ一覧 */
.nlist{font-size:var(--fs-body);line-height:1.8;font-weight:400}
.nlist--home{background:var(--c-surface)}
.nlist__w{container-type:inline-size;line-height:28px}
.nlist__w--home{padding:64px 24px}
.nlist__w--home>.nlist__g{max-width:var(--w-inner);margin:0 auto}
.nlist__g{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:40px}
.nlist__h{grid-column:1;grid-row:1}
.nlist__h>.rt{margin-bottom:6px;text-wrap:balance}
.nlist__ht{margin:0 0 -6px;font-size:var(--fs-h2);font-weight:600;line-height:var(--lh-h2);}
.nlist__c{grid-column:1 / -1;grid-row:2}
.nlist__f{display:flex;grid-column:2;grid-row:1;min-width:0;align-items:flex-end;justify-content:flex-end}
.nlist__l{display:grid;grid-template-columns:minmax(0,1fr);border-bottom:1px solid var(--c-line);border-color:var(--c-line);--cpu-columns:1}
.nlist__i{display:grid;grid-column:1 / -1;grid-template-columns:subgrid;gap:16px;padding:24px 0;border:0;border-top:1px solid var(--c-line);border-color:var(--c-line);color:inherit;cursor:pointer;isolation:isolate;position:relative;text-decoration:none}
.nlist__m{display:grid;grid-template-columns:auto auto;align-items:center;justify-content:start;gap:24px}
.nlist__d{font-size:14.2222px;line-height:26.2222px}
.nlist__tag{display:inline-flex;justify-content:center;padding:8px 16px;border-radius:99rem;background:var(--c-ink);color:var(--c-on);font-size:12.8px;line-height:16.8px;text-wrap:balance}
.nlist__b{display:flex;align-items:center;gap:24px;}
.nlist__t{font-size:var(--fs-body);line-height:var(--lh-body);text-wrap:balance}
.nlist__ic{margin-left:auto}
.nlist__more{grid-template-columns:minmax(14.2222px,auto) 1fr minmax(14.2222px,auto);border-color:var(--c-ink);color:var(--c-ink);text-decoration:none}

.mcmain>.nlist{margin-top:32px}
@media(min-width:768px){   /* PCは日付とカテゴリとタイトルを横並び。スマホ（767px以下）は日付とカテゴリのあとで改行（トガリネズミと同じ） */
  .nlist__l{grid-template-columns:max-content minmax(0,1fr)}
  .nlist__i{gap:24px}
  .nlist__m{grid-template-columns:auto minmax(0,1fr)}
}
@container (max-width:400px){
  .nlist__g{grid-template-columns:minmax(0,1fr);--cpu-columns:1}
  .nlist__h{grid-column:1;grid-row:1}
  .nlist__c{grid-column:1;grid-row:2}
  .nlist__f{grid-column:1;grid-row:3}
  .nlist__more{width:100%}
}
@media(max-width:767px){.nlist__w--home{padding:64px var(--gutter-s)}}
@media (any-hover:hover){.nlist__i:hover .nlist__b{color:var(--c-link)}}

/* 料金の目安 */
.price[hidden="until-found"]{z-index:-1}
.price{font-size:var(--fs-body);line-height:1.8;font-weight:400;background:var(--c-surface)}
.price:focus-visible{outline-offset:var(--focus-offset,0)}
.price__w{container-type:inline-size;line-height:28px;padding:64px 24px;background:var(--c-surface)}
.price__in{max-width:var(--w-inner);margin:0 auto;display:flex;flex-direction:column;gap:64px}
.price__label{text-wrap:balance;margin-bottom:6px}
.price__ttl{font-size:var(--fs-h2);line-height:var(--lh-h2);font-weight:600;margin-block:calc(.5em - .5lh);text-align:center}
.price__layout{display:grid;grid:"list" "panel" / 100%;gap:24px}
.price__tabs{grid-area:list;display:flex;overflow-x:auto;min-width:0;background:var(--c-sec);border-radius:10px;box-shadow:0 0 1px color-mix(in srgb,var(--sh-card),transparent 50%),0 1px 3px var(--sh-card);justify-self:center;gap:2px;padding:4px}
.price__tab{cursor:pointer;touch-action:manipulation;background:none;border:0;color:var(--c-sub);text-align:inherit}
.price__tab[aria-selected="true"]{color:var(--c-ink);background:var(--c-surface);box-shadow:0 1px 3px color-mix(in srgb,var(--sh-card),transparent 50%),0 2px 6px var(--sh-card)}
.price__panel{grid-area:panel}
.price__cards{display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));gap:24px;--cols:1;--cols_md:3;--cpu-columns:var(--cols)}
@container (min-width:800px){.price__cards{--cols:var(--cols_md)!important}}
.price__card.-pick{display:grid;border:2px solid var(--c-main);background:var(--c-surface);border-radius:6px;padding:40px;gap:24px;grid-template-rows:subgrid;grid-row:span 4}
.price__card,.price__card.-pick{box-shadow:0 1px 3px color-mix(in srgb,var(--sh-card),transparent 50%),0 2px 6px var(--sh-card)}
.price__top{display:flex;flex-direction:column;min-width:0;width:stretch;gap:16px}
.price__name{margin-block:calc(.5em - .5lh);font-weight:600;color:var(--c-main)}
.price__note{line-height:var(--lh-small);min-width:0;margin-block:calc(.5em - .5lh);text-wrap:balance;opacity:.6;font-size:var(--fs-small)}
.price__feats{display:flex;flex-direction:column;min-width:0;gap:8px}
.price__feat{display:flex;gap:12px;align-items:center;font-size:var(--fs-body);line-height:var(--lh-body)}
.price__ic{flex-shrink:0;height:1em;width:1em}
.price__text{line-height:26.2222px;min-width:0;font-size:14.2222px}
.price__btn,.price__plan-btn{color:var(--c-surface);background:var(--c-ink);border-color:transparent;grid-template-columns:minmax(1em,auto) 1fr minmax(1em,auto);place-content:center;place-items:center;min-width:0}
.price__btn{background:var(--c-main)}
.price__card{display:grid;background:var(--c-sec);border-radius:6px;padding:40px;gap:24px;grid-template-rows:subgrid;grid-row:span 4;grid-template-columns:minmax(0,1fr);--cpu-columns:1}
@media(max-width:1279px){.price__card{padding:32px}}   /* 3列が狭くなる幅では、ボタンが1行に収まるよう余白を詰める */
.price__amount{display:flex;gap:8px;align-items:end}
.price__num{line-height:37.6px;min-width:0;margin-block:calc(.5em - .5lh);font-size:25.6px;font-weight:600}
.price__unit{line-height:26px;min-width:0;margin-block:calc(.5em - .5lh);font-weight:600;font-size:14px}
@media(max-width:767px){.price__w{padding-inline:var(--gutter-s)}}
/* 導入までの流れ */
.flow[hidden="until-found"]{z-index:-1}
.flow{background:var(--c-surface);font-size:var(--fs-body);line-height:1.8;font-weight:400;text-underline-offset:.125em}
.flow__w{background:var(--c-surface);line-height:calc(1em + 12px);padding:64px 24px}
.flow__in{display:flex;flex-flow:column;gap:64px;max-width:var(--w-inner);margin:0 auto}
.flow__label{text-wrap:balance;margin-bottom:6px}
.flow__ttl{font-size:var(--fs-h2);font-weight:600;line-height:var(--lh-h2);margin-bottom:calc(.5em - .5lh);text-align:center}
.flow__steps{display:flex;flex-flow:column;gap:40px}
.flow__step,.flow__last{position:relative;display:flex;flex-flow:column;gap:16px;font-size:var(--fs-body);line-height:var(--lh-body)}
.flow__row{display:flex;align-items:center;gap:12px}
.flow__badge{--hl:0px;display:inline-flex;flex-shrink:0;align-items:center;gap:4px;padding:8px 12px;border-radius:99rem;background:var(--c-ink);color:var(--c-surface);font-style:italic;line-height:calc(1em + var(--hl)*2)}
.flow__step-label{font-size:12.8px}
.flow__step-label,.flow__num{line-height:calc(1em + var(--hl)*2)}
.flow__num,.flow__name{font-size:var(--fs-h3);line-height:var(--lh-h3)}
.flow__name{min-width:0;font-weight:600;line-height:var(--lh-h3)}
.flow__text{padding-left:79px;font-size:var(--fs-body);line-height:var(--lh-body);text-wrap:balance}
.flow__link{color:var(--c-main);text-decoration:underline}
.flow__cta{text-align:center}
.flow__btn{grid-template-columns:minmax(1em,auto) 1fr minmax(1em,auto);place-items:center;place-content:center;border-color:transparent;background:var(--c-main);color:var(--c-surface)}
@media(max-width:767px){.flow__w{padding:64px var(--gutter-s)}}
.flow__step:not(.flow__last)::after{content: ""; position: absolute; left: 31px; top: 44px; bottom: -36px; border-left: 2px solid var(--c-line);}

/* CSS変数の型 */
@property --hl{syntax:"<length>";inherits:true;initial-value:.25rem}
/* ===== ボタンと札の決まり（2サイト共通。CEO 2026-11-02） =====
   ボタン＝1パターン：上下16px・左右40px・文字16px太字・ピル形。幅は文の長さで決まる（カードの中やスマホで横幅いっぱいにするのは並べ方として可）。記号は丸の中に＞（元から記号の無いボタンは無し）
   札（新着・人気の切り替え、カテゴリ・タグ・エリアの絞り込み）＝1パターン：上下8px・左右16px・文字14px・ピル形。丸いボタン（横送り・ページ送り）＝44pxの円 */
.btn,.mbtn,.price__btn,.price__plan-btn,.flow__btn,.btn.-line,.dll__b,.nlist__more{display:inline-flex;align-items:center;justify-content:center;gap:12px;box-sizing:border-box;min-height:0;height:auto;padding:11px 16px!important;width:350px!important;max-width:100%!important;border-width:1px;border-style:solid;border-radius:9999px;font-size:16px;line-height:24px!important;font-weight:700}   /* ボタンは raminc.co.jp に合わせて高さ48px（スマホ42px）・幅は350pxに固定（CTAとそれ以外は色で分ける。狭い所では横幅いっぱいまで。CEO 2026-11-03） */
@media(max-width:767px){.btn,.mbtn,.price__btn,.price__plan-btn,.flow__btn,.btn.-line,.dll__b,.nlist__more,.hd__btn,.box.sbn span{font-size:14px;line-height:20px!important;padding-top:10px!important;padding-bottom:10px!important}}
@media(max-width:767px){.btn,.mbtn,.price__btn,.price__plan-btn,.flow__btn,.btn.-line,.dll__b,.nlist__more{width:100%!important;max-width:350px!important}}   /* スマホは置き場の幅いっぱい（最大350px）。固定の幅で外の箱を押し広げないため */
@media(min-width:1101px){.mhero__b>:is(.btn,.mbtn){width:calc((100% - 16px)/2)!important}}   /* 最初の画面の2つのボタンは、文字の列（約520px）に横に2つ並べる（350pxでは2段に落ちるため。CEO 2026-11-03） */
.dll__b{display:flex}   /* 資料のカードの下は横幅いっぱい */
.dl .btn{display:flex;margin:0 auto}   /* お役立ち資料のボタンは中央寄せ（決まりは層の外にあり場所ごとの指定より強いので、ここに書く） */
.ic-go{width:12px;height:12px;font-size:12px;flex:none}
.ic-go.fa-chevron-right{width:20px;height:20px;border:1.5px solid currentColor;border-radius:50%;font-size:9px;box-sizing:border-box}   /* 「＞」だけは丸で囲む。別窓のアイコンなどは囲まない（CEO 2026-11-03） */   /* ボタンの記号（ヘッダー以外のボタンすべて。外のサイトへは別窓のアイコン。CEO 2026-11-03） */
.sort button,.price__tab,.cats a,.pill{display:inline-flex;align-items:center;justify-content:center;gap:6px;box-sizing:border-box;min-height:0;height:auto;padding:7px 16px!important;border-width:1px;border-style:solid;border-radius:9999px;font-size:14px;line-height:20px!important;font-weight:400}
.rail__b,.svc-nv button,.pager a{width:44px;height:44px}
.dll__b,.price__tab{border-color:transparent}
.price__btn,.price__plan-btn{align-self:center}
/* 決まりのボタン・札は、ほかの部品の行の高さや余白の指定に左右されないよう !important にしている（高さを全部そろえるため） */
/* マウスを載せた時：塗りのボタンは少し暗く、白い地や線のボタンと札は色を反転（選ばれている札とタブは変えない）。ほかの動き（薄く・下線・拡大・影）はしない */
.btn:hover,.mbtn:hover,.price__btn:hover,.price__plan-btn:hover,.flow__btn:hover,.dll__b:hover,.hd__btn:hover{opacity:1;text-decoration:none;transform:none;box-shadow:none;filter:brightness(.85)}
.btn.-line:hover,.mbtn.-line:hover,.nlist__more:hover{filter:none;opacity:1;background:var(--c-ink);color:var(--c-on);border-color:var(--c-ink)}
.mbtn.-w:hover{filter:none;background:var(--c-on);color:var(--c-navy);border-color:var(--c-on)}
.pill:hover,.cats a:not([aria-selected="true"]):not(.on):hover,.sort button:not([aria-selected="true"]):not(.on):hover,.price__tab:not([aria-selected="true"]):not(.on):hover{opacity:1;background:var(--c-ink);color:var(--c-on);border-color:var(--c-ink);box-shadow:none}
/* 白い地のボタンは白と黒だけ（主の色の青や紺は使わない。CEO 2026-11-02） */
.btn.-line,.mbtn.-line,.nlist__more{background:var(--c-surface);color:var(--c-ink);border-color:var(--c-ink)}
/* ヘッダー・シェア・サイドバーのボタンも同じ1パターン。コードのコピーは札、SNSは丸いボタン（44px） */
.hd__btn,.box.sbn span{display:flex;align-items:center;justify-content:center;gap:8px;border-color:transparent;box-sizing:border-box;min-height:0;height:auto;padding:11px 28px!important;border-width:1px;border-style:solid;border-radius:9999px;font-size:16px;line-height:24px!important;font-weight:700;letter-spacing:normal}
@media(max-width:767px){.hd__btn,.box.sbn span{font-size:14px;line-height:20px!important;padding-top:10px!important;padding-bottom:10px!important}}
.hd__btn:hover{opacity:1;text-decoration:none;filter:brightness(.85)}
.box.sbn a:hover span{filter:brightness(.85)}
.code__btn{padding:7px 16px;border-radius:9999px;font-size:14px;line-height:20px;font-weight:400}
.share-hb{flex:none;font:900 15px/1 Arial,Helvetica,sans-serif;letter-spacing:-.5px}   /* はてなブックマークの B! （Font Awesome に無いので文字で） */
/* ===== 書いた人のページ（2サイト共通の形）：上にプロフィール（写真・名前・肩書き・紹介文・SNS）、下に新着と人気の切り替え・記事・ページ送り ===== */
.au{display:grid;grid-template-columns:160px minmax(0,1fr);gap:40px;align-items:start;padding:48px 0 40px;border-bottom:1px solid var(--c-line)}
.au__img{width:160px;height:160px;border-radius:50%;object-fit:cover}
.au h1{margin:4px 0 4px;font-size:var(--fs-title);line-height:var(--lh-title)}
.au__pos{font-size:var(--fs-small);line-height:var(--lh-small);font-weight:700;color:var(--c-sub)}
.au__txt{max-width:720px;margin-top:16px;font-size:var(--fs-body);line-height:var(--lh-body)}
.au__sns{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0 0;padding:0;list-style:none}
.au__sns a{display:grid;place-items:center;width:44px;height:44px;border:1px solid var(--c-ink);border-radius:50%;color:var(--c-ink)}
.au__sns a:hover{background:var(--c-ink);color:var(--c-surface);text-decoration:none}
@media(max-width:767px){.au{grid-template-columns:1fr;gap:20px;padding:32px 0;--cpu-columns:1}.au__img{width:120px;height:120px}.au h1{font-size:var(--fs-title);line-height:var(--lh-title)}}
.afoot__l b a{color:inherit}.afoot__l b a:hover{text-decoration:underline}   /* 名前から書いた人のページへ */
/* よくある質問（2サイト共通の形。CEO 2026-11-03）：一覧は質問を2列の行で並べ、押すと答えのページへ（開け閉めしない）。色は黒と白だけ（Qは黒い丸、Aは白い丸に黒い線） */
.fq-cats{display:flex;flex-wrap:wrap;gap:8px;margin-top:32px}
.fq-h{margin:48px 0 16px;font-size:var(--fs-h2);line-height:var(--lh-h2);font-weight:700;color:var(--c-ink)}
.fq{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:40px;margin:0;padding:0;list-style:none;border-top:1px solid var(--c-line);--cpu-columns:2}
.fq.-one{grid-template-columns:minmax(0,1fr);--cpu-columns:1}
.fq-cats .pill.on{background:var(--c-ink);color:var(--c-surface);border-color:var(--c-ink)}   /* 今いるカテゴリの札 */
.fq-hd{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:48px 0 16px}
.fq-hd .fq-h{margin:0}
.fq-more{display:inline-flex;align-items:center;gap:8px;font-size:14px;color:var(--c-ink);text-decoration:none}
.fq-more:hover{text-decoration:underline}
.fq-gap{height:32px}
.fq a{display:flex;align-items:center;gap:16px;height:100%;padding:20px 4px;border-bottom:1px solid var(--c-line);color:var(--c-ink);text-decoration:none}
.fq a:hover .fq__t{text-decoration:underline}
.fq__q{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--c-ink);color:var(--c-surface);font:500 20px/1 Barlow,sans-serif;flex:none}
.fq__q.-a{background:var(--c-surface);color:var(--c-ink);border:1px solid var(--c-ink)}
.fq__t{flex:1;font-size:var(--fs-body);line-height:var(--lh-body);font-weight:700}
.fqd{max-width:880px;margin:0 auto}
.fqd__meta{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.fqd__meta>*{margin:0}
.fqd__q,.fqd__a{display:flex;gap:16px;align-items:flex-start}
.fqd__q>:not(.fq__q){flex:1;margin:0;padding:1px 0 0;border:0;border-radius:0;background:none;letter-spacing:inherit;font-size:27px;line-height:40.5px;word-break:normal;line-break:strict;text-wrap:wrap;color:var(--c-ink)}   /* 質問の見出し：タグ（h1・h2・h3）によらずクラスで決める。本文の中の h2・h3 の飾りは付けない（1.7.1） */
.fqd__a{margin:24px 0 8px;padding:24px 0;border-top:1px solid var(--c-line);border-bottom:1px solid var(--c-line)}
.fqd__a b{display:block;padding-top:4px;font-size:var(--fs-lead);line-height:var(--lh-lead);color:var(--c-ink)}
.fqd__a p{margin:4px 0 0;font-size:var(--fs-body);line-height:var(--lh-body)}
.fqd__b{display:flex;justify-content:center;margin-top:40px}
@media(max-width:767px){.fq{grid-template-columns:minmax(0,1fr);--cpu-columns:1}.fq__q{width:32px;height:32px;font-size:16px}.fq a{gap:12px;padding:16px 0}.fqd__q>:not(.fq__q){font-size:23px;line-height:34.5px}.fqd__q,.fqd__a{gap:12px}}

@media(max-width:767px){.pager{padding-left:0;padding-right:0}.pager a,.pager__gap{width:40px;height:40px;margin:2px}}   /* スマホは8つ（1〜5・…・最後・次へ）が1段に収まる大きさ */
@media(max-width:374px){.pager a,.pager__gap{width:36px;height:36px}}
@media(max-width:767px){.logo__i{height:24px}}

/* 狭い画面で、表や引用の箱が文節の長さではみ出さないようにする */
.bq,.body .tbl th,.body .tbl td{overflow-wrap:anywhere}

/* 導入事例の注意書き（本文のいちばん上に薄い背景で出す） */
.body .note{background:var(--c-bg);padding:12px 16px;margin:0 0 24px;font-size:14px;line-height:1.8}

/* 料金のパターンが4つ以上の時は、横に送れるようにする */
.price__cards.-scroll{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px}
.price__cards.-scroll>.price__card{flex:0 0 min(340px,85%);scroll-snap-align:start}

/* 表の中と、薄い背景の注釈の文字は、本文と同じ大きさにする（小さくしない） */
.bq,.body .note,.body .tbl,.body .tbl th,.body .tbl td,.cmp table,.cmp th,.cmp td,.cmp__nm small,.ri__t th,.ri__t td{font-size:16px;line-height:28.8px}
@media(max-width:767px){.bq,.body .note,.body .tbl,.body .tbl th,.body .tbl td,.cmp table,.cmp th,.cmp td,.cmp__nm small,.ri__t th,.ri__t td{font-size:14px;line-height:25.2px}}

/* 見出しの横に画像がないページは、英字を出さずにタイトルを中央に寄せ、上の余白を広げる */
.ctp>.inner:not(.ctp__w)>h1,.ctp>.inner:not(.ctp__w)>.ctp__lead{text-align:center}
.ctp>.inner:not(.ctp__w)>h1{margin-top:24px}
.ctp>.inner:not(.ctp__w) .fq-cats{justify-content:center}
.mhead,.mhead>div{align-items:center;text-align:center}
.mhead{padding-top:24px}
/* 目次の上の余白は、本文の見出しの間と同じにする */
.toc{margin-top:64px}
/* 一覧のタグは「#」つきで色を変える。日付はアイコンつき */
.card__h i{font-style:normal;color:var(--c-main)}
.card__m{display:flex;align-items:center;gap:6px}

/* 一覧の絞り込みも、中央に寄せた見出しに合わせる */
.mhead+.cats{justify-content:center}

/* 文の中の外部リンクのアイコンは、文字に合わせて小さく出す */
.ext-ic{font-size:.8em;margin-left:4px}

/* デザインの部品一覧のページだけで使う、部品の名札 */
.parts-lb{background:#222;color:#fff;padding:12px var(--parts-g,24px);margin:0}
.parts-lb p{max-width:1200px;margin:0 auto;font-size:16px;line-height:28.8px;font-weight:700}
.parts-lb small{font-weight:400;margin-left:8px;font-size:inherit;opacity:.8}
.parts-lb.-top{background:var(--c-main)}

/* 「リンクをコピー」は、文字とアイコンのまわりだけを押せるようにする（行は分けたまま） */
.share-links::after{content:"";flex-basis:100%;order:1}
.share-links button{flex:0 0 auto;order:2;padding:8px 4px}
/* 「この記事を書いた人」は、白い背景をメインカラーの線で囲む */
.afoot{margin:64px 0 0;background:#fff;color:var(--c-text);border:3px solid var(--c-main);border-radius:8px}
.afoot__l{border-right:1px dashed #d6d6d6}
.afoot__t{background:var(--c-main);color:#fff}
.afoot__t::after{border-top-color:var(--c-main)}
.afoot__l img{border-color:var(--c-main)}
.afoot__l span{color:#666}
.afoot__r p{color:var(--c-text)}
.afoot__sns a{color:#666}
.afoot__ic{border-color:#bdbdbd;color:var(--c-text)}
.afoot__sns a:hover .afoot__ic{background:var(--c-main);color:#fff;border-color:var(--c-main)}
@media(max-width:767px){.afoot{margin:48px 0 0}.afoot__l{border-right:0;border-bottom:1px dashed #d6d6d6}}

/* パンくずから、タイトルやコンテンツまでの高さを全ページでそろえる（記事のページは除く）。数字は --crumb-gap だけで変える */
:root{--crumb-gap:48px}
nav.crumb+.ctp{padding-top:calc(var(--crumb-gap) - 24px)}
nav.crumb+.ctp.-form{padding-top:calc(var(--crumb-gap) + 0px)}
nav.crumb+.ctp.-qa{padding-top:calc(var(--crumb-gap) - 24px)}
nav.crumb+.mcbg{padding-top:calc(var(--crumb-gap) - 45px)}
nav.crumb+.mcbg.-au{padding-top:calc(var(--crumb-gap) - 20px)}
nav.crumb+.mhero{padding-top:calc(var(--crumb-gap) + 0px)}
nav.crumb+.smv{padding-top:calc(var(--crumb-gap) + 0px)}
@media(max-width:767px){:root{--crumb-gap:40px}
nav.crumb+.ctp{padding-top:calc(var(--crumb-gap) - 24px)}
nav.crumb+.ctp.-form{padding-top:calc(var(--crumb-gap) + 0px)}
nav.crumb+.ctp.-qa{padding-top:calc(var(--crumb-gap) - 24px)}
nav.crumb+.mcbg{padding-top:calc(var(--crumb-gap) - 40px)}
nav.crumb+.mcbg.-au{padding-top:calc(var(--crumb-gap) - 16px)}
nav.crumb+.mhero{padding-top:calc(var(--crumb-gap) + 0px)}
nav.crumb+.smv{padding-top:calc(var(--crumb-gap) + 0px)}
}

/* 高さをそろえる：上の札から始まるFAQの答えと、画像と横並びの見出しの補正 */
nav.crumb+.ctp.-qa{padding-top:var(--crumb-gap)}
nav.crumb+.mhero.-pt60,nav.crumb+.mhero{padding-top:var(--crumb-gap)}
@media(max-width:767px){nav.crumb+.mcbg{padding-top:calc(var(--crumb-gap) - 41px)}}
@media(max-width:767px){nav.crumb+.mcbg{padding-top:0}.mhead{padding-top:23px}}

/* 文字の大きさをそろえる：トップ以外の固定ページの題は、ほかの固定ページと同じ大きさ */
.mhero.-pt60 h1{font-size:var(--fs-title);line-height:var(--lh-title)}

/* 固定ページの上に出す画像は、角の丸みを12pxにそろえる */
.mhero__i,.mhero__i img,.smv__i,.smv__i img,.svm__im img{border-radius:12px}
.mhero__i{overflow:hidden}
.smv h1{font-size:var(--fs-title);line-height:var(--lh-title)}

/* 目次の下の案内（CTA） */
.toc-cta{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:32px 0 0;padding:24px 28px;border:2px solid var(--c-main);border-radius:8px;background:#fff}
.toc-cta__t b{display:block;font-size:var(--fs-h3);line-height:var(--lh-h3);margin-bottom:8px}
.toc-cta__t p{margin:0;font-size:var(--fs-body);line-height:var(--lh-body)}
.toc-cta__b{display:flex;flex-direction:column;align-items:center;gap:12px;flex:none}
.toc-cta__l{font-size:var(--fs-body);text-decoration:underline}
@media(max-width:1100px){.toc-cta{flex-direction:column;align-items:stretch}.toc-cta__b .mbtn,.toc-cta__b .mf__m{width:100%;max-width:350px}}

/* 白黒の線のボタンは、背景を透明にせず白にする */
.mbtn.-w{background:#fff;color:var(--c-navy);border-color:#fff}
.mbtn.-w:hover{background:var(--c-navy);color:#fff;border-color:var(--c-navy)}

/* トップ以外の固定ページの見出しは（「機能と料金」「CPU BASEとは」は横に画像を並べる形のまま）、CPU PORTALと同じく中央に寄せ、ボタンはその下に並べる（横の画像は出さない） */
.mhero.-pt60:not(.-img) .mhero__w{flex-direction:column;align-items:center;text-align:center}
.mhero.-pt60:not(.-img) .mhero__c{width:auto;max-width:860px}
.mhero.-pt60:not(.-img) .mhero__b{justify-content:center;flex-wrap:wrap}
.mhero.-pt60:not(.-img) .mhero__i{display:none}
.mhero.-pt60:not(.-img) h1{margin-bottom:16px}


/* サイドバー（CEO指定 2026-11-03）：資料請求→検索→新着と人気→カテゴリ→タグ→CTA→（追従）広告と資料請求 */
.side{position:static;align-self:stretch}
.side__fix{position:sticky;top:104px;display:flex;flex-direction:column;gap:20px}
.stab{padding:0}
.stab input{position:absolute;opacity:0;pointer-events:none}
.stab__h{display:flex;border-bottom:1px solid var(--c-line)}
.stab__h label{flex:1;text-align:center;padding:12px 8px;font-weight:700;font-size:var(--fs-body);color:var(--c-mute);border-bottom:3px solid transparent;margin-bottom:-1px;cursor:pointer}
#stab-n:checked~.stab__h label[for=stab-n],#stab-p:checked~.stab__h label[for=stab-p]{color:var(--c-text);border-bottom-color:var(--c-main)}
.stab__p{display:none;padding:8px 16px 16px}
#stab-n:checked~.stab__p.-n,#stab-p:checked~.stab__p.-p{display:block}
.stab input:focus-visible~.stab__h{outline:2px solid var(--c-main);outline-offset:2px}
.cidx-box nav a{display:flex;align-items:center;gap:12px;padding:12px 16px;border-top:1px solid var(--c-line);color:var(--c-text);text-decoration:none}
.cidx__ic{width:28px;height:28px;flex:none;font-size:24px;display:grid;place-items:center}
.cidx-box nav span{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.cidx-box nav b{font-size:14px;line-height:17.5px}
.cidx-box nav small{font-size:12px;line-height:18px;color:var(--c-mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cidx-box nav a:hover b{text-decoration:underline}
.cidx-box nav a>.ic-go{color:var(--c-mute)}
.tgs .tg{display:flex;flex-wrap:wrap;gap:8px}
.tgs .tg a{display:inline-block;padding:4px 12px;border:1px solid var(--c-line);border-radius:9999px;background:#fff;font-size:14px;line-height:20px;letter-spacing:0}
.tgs .tg a:hover{opacity:1;background:var(--c-text);color:#fff;border-color:var(--c-text);text-decoration:none}
.scta{text-align:center;display:flex;flex-direction:column;align-items:center;gap:12px}
.scta b{font-size:var(--fs-h4,18px);line-height:1.5}
.scta p{margin:0;font-size:14px;line-height:1.8;text-align:left}
.scta .scta__btn{width:100%;margin:0}
.scta__l{font-size:14px;text-decoration:underline}
.ad-slot{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;height:250px;border:1px dashed #c8c8c8;background:#fafafa;color:#999}
.ad-slot span{font-weight:700;letter-spacing:2px}
.ad-slot small{font-size:12px}
@media(max-width:1100px){.side__fix{position:static}}
.scta{padding:24px 20px}

/* 新着と人気の記事は、元の人気記事と同じ小さな画像の並び */
.stab__p{padding:4px 0 8px}
.stab__p .it{display:grid;grid-template-columns:96px minmax(0,1fr);gap:12px;padding:12px 16px;font-size:14px;line-height:21px;color:var(--c-text)}
.stab__p .it img{width:96px;height:auto;aspect-ratio:1200/630;object-fit:cover}
.stab__p .it span{min-width:0;overflow-wrap:anywhere}
.stab__p .it:hover span{text-decoration:underline}
.stab__h label{color:#8a8a8a}
#stab-n:checked~.stab__h label[for=stab-n],#stab-p:checked~.stab__h label[for=stab-p]{color:var(--c-text)}

/* サイドバーの補足の文字の色（CPU BASEに無かった色の名前を足す） */
:root{--c-mute:#777}

/* 新着と人気のタブは、CPU PORTALの活用ガイドの形にそろえる（灰色の丸い枠の中で、選んだ方が白く浮く） */
.stab__h{display:flex;gap:0;width:max-content;margin:16px auto 4px;padding:4px;border:0;border-radius:9999px;background:#f1f2f4}
.stab__h label{flex:none;padding:7px 20px;margin:0;border:0;border-radius:9999px;font-size:14px;line-height:20px;font-weight:400;color:#8a8a8a}
#stab-n:checked~.stab__h label[for=stab-n],#stab-p:checked~.stab__h label[for=stab-p]{background:#fff;color:var(--c-text);box-shadow:0 1px 4px rgba(0,0,0,.12);border:0}
.stab__h label:hover{color:var(--c-text)}
.sort{display:inline-flex;gap:0;padding:4px;border-radius:9999px;background:#f1f2f4}
.sort button{padding:7px 16px;border:0;border-radius:9999px;background:none;color:#8a8a8a;font:inherit;font-size:14px;line-height:20px;font-weight:400;cursor:pointer;box-shadow:none}
.sort button[aria-selected="true"]{background:#fff;color:var(--c-text);box-shadow:0 1px 4px rgba(0,0,0,.12)}
.sort button:not([aria-selected="true"]):hover{background:var(--c-text);color:#fff}

/* 記事の中のCTA（案B）：メインカラーの地に白い文字、ボタンは白と白の線 */
.toc-cta.-b{display:block;text-align:center;background:var(--c-main);color:#fff;border:0;border-radius:12px;padding:40px 32px}
.toc-cta__en{margin:0;font:600 14px/1.6 var(--f-en);letter-spacing:1.5px}
.toc-cta__h{display:block;margin:6px 0 8px;font-size:var(--fs-h3);line-height:var(--lh-h3)}
.toc-cta__p{margin:0 0 24px;font-size:var(--fs-body);line-height:var(--lh-body)}
.toc-cta__btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.toc-cta__btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;width:280px;max-width:100%;height:48px;border-radius:9999px;font-weight:700;text-decoration:none;box-sizing:border-box}
.toc-cta__btn.-w{background:#fff;color:var(--c-main);border:1px solid #fff}
.toc-cta__btn.-o{background:transparent;color:#fff;border:1px solid #fff}
.toc-cta__btn:hover{text-decoration:none}
.toc-cta__btn.-w:hover{background:var(--c-text);color:#fff;border-color:var(--c-text)}
.toc-cta__btn.-o:hover{background:#fff;color:var(--c-text)}
@media(max-width:767px){.toc-cta.-b{padding:32px 20px}.toc-cta__p br{display:none}.toc-cta__btn{width:100%}}

/* ===== 記事で使える部品（部品一覧のページに全部並べる） ===== */
/* 番号つきの箇条書き：丸い番号をメインカラーで */
.body ol:not(.cmp ol,.toc ol){list-style:none;counter-reset:bl;margin:0 0 24px;padding:0;font-size:var(--fs-body);line-height:var(--lh-body)}
.body ol:not(.cmp ol,.toc ol)>li{counter-increment:bl;position:relative;padding-left:40px;margin-bottom:8px}
.body ol:not(.cmp ol,.toc ol)>li::before{content:counter(bl);position:absolute;left:0;top:calc((var(--lh-body) - 26px)/2);width:26px;height:26px;border-radius:50%;background:var(--c-main);color:#fff;font:700 14px/26px var(--f-en,sans-serif);text-align:center}
/* チェックつきの箇条書き */
.body ul.-check{list-style:none;margin-left:0}
.body ul.-check>li{position:relative;padding-left:30px}
.body ul.-check>li::before{content:"\f00c";font:var(--fa-font-solid);position:absolute;left:0;top:calc((var(--lh-body) - 1em)/2);color:var(--c-main)}
/* 文中のリンク */
.body p a:not(.abtn),.body li a{color:var(--c-text-link);text-decoration:underline;text-underline-offset:.2em}
.body p a:not(.abtn):hover,.body li a:hover{text-decoration:none}
/* 記事の中のボタン（塗り／線） */
.body .abtns{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin:24px 0}
.body .abtn{display:inline-flex;align-items:center;justify-content:center;gap:10px;width:350px;max-width:100%;height:48px;box-sizing:border-box;border-radius:9999px;font-weight:700;text-decoration:none}
.body .abtn.-fill{background:var(--c-main);color:#fff;border:1px solid var(--c-main)}
.body .abtn.-fill:hover{background:var(--c-navy);border-color:var(--c-navy)}
.body .abtn.-line{background:#fff;color:var(--c-text);border:1px solid var(--c-text)}
.body .abtn.-line:hover{background:var(--c-text);color:#fff}
/* 記事へのリンクカード */
.body .lcard{display:grid;grid-template-columns:160px minmax(0,1fr);gap:16px;align-items:center;margin:24px 0;padding:16px;border:1px solid var(--c-line);border-radius:8px;background:#fff;color:var(--c-text);text-decoration:none;position:relative}
.body .lcard img{width:160px;height:100px;object-fit:cover;border-radius:4px}
.body .lcard small{display:inline-block;margin-bottom:4px;padding:0 8px;border-radius:4px;background:var(--c-main);color:#fff;font-size:12px;line-height:20px}
.body .lcard b{display:block;font-size:var(--fs-body);line-height:1.6}
.body .lcard:hover b{text-decoration:underline}
/* 説明つきの画像 */
.body figure.fig{margin:24px 0}
.body figure.fig img{width:100%;height:auto;display:block;margin:0}
.body figure.fig figcaption{margin-top:12px;font-size:14px;line-height:1.7;color:#666;text-align:center}
/* ポイントと注意の箱 */
.body .pbox{position:relative;margin:24px 0;padding:24px 24px 20px;border-radius:8px;border:2px solid var(--c-main);background:#e8eef8}
.body .pbox>b{display:inline-flex;align-items:center;gap:8px;margin-bottom:8px;color:var(--c-main);font-size:var(--fs-body)}
.body .pbox>p:last-child{margin-bottom:0}
.body .pbox.-warn{border-color:#d9822b;background:#fdf3e8}
.body .pbox.-warn>b{color:#b8661a}
/* マーカー */
.body mark{background:linear-gradient(transparent 60%,#ffe58a 60%);color:inherit;padding:0 2px}
@media(max-width:767px){.body .lcard{grid-template-columns:100px minmax(0,1fr)}.body .lcard img{width:100px;height:72px}.body .abtn{width:100%}}

/* 一覧のカード：題と日付の間を、題の行数にかかわらず詰める。カテゴリとタグの間も詰める */
.card__m{margin-top:-4px}
.card__h{gap:8px 12px}
/* トップのよくある質問：PCは6つ、スマホは4つ */
@media(max-width:767px){.qa .fq>li:nth-child(n+5){display:none}}
/* 引用の箱は、CPU PORTALと同じ薄いグレー */
.bq{background:var(--c-bg);color:var(--c-text)}
.bq::before{color:#555}

/* お問い合わせのメールと電話は、押せると分かる色と下線 */
[class*="ctp__tel"] a[href^="tel:"],[class*="ctp__tel"] a[href^="mailto:"]{color:var(--c-ink);text-decoration:none}

/* 見出しのボタンから次の節までを、PC 96px にそろえる */
@media(min-width:768px){nav.crumb+.mhero.-pt60{padding-bottom:16px}}

/* 見出しのまとまりは、上下の余白をそろえる（パンくずからの高さと同じ） */
nav.crumb+.mhero.-pt60{padding-bottom:var(--crumb-gap)}
@media(min-width:768px){nav.crumb+.mhero.-pt60{padding-bottom:var(--crumb-gap)}}
nav.crumb+.smv{padding-bottom:var(--crumb-gap)}
.smv h1{color:var(--c-text)}

/* ロゴのリンクの範囲は、画像の幅に合わせる */
.logo{width:max-content;min-width:0;max-width:none;flex:none}
.ft .logo,.ftx .logo,.ftx__brand .logo{align-self:flex-start}

/* 比較表：CPU PORTALと同じ作り（おすすめの札、自社の列を枠で囲む、記号を薄い大きな形で敷く）。色はCPU BASEの青 */
.cmpx thead th.-me{position:relative;background:var(--c-main);color:#fff;font-size:var(--fs-body);line-height:var(--lh-body)}
.cmpx thead th.-me::before{content:"おすすめ";position:absolute;top:-22px;left:50%;transform:translateX(-50%);padding:2px 14px;border-radius:9999px;background:var(--c-text);color:#fff;font-size:var(--fs-body);line-height:var(--lh-body);font-weight:700;white-space:nowrap}
.cmpx td.-me{box-shadow:inset 3px 0 0 var(--c-main),inset -3px 0 0 var(--c-main);background:#e8eef8;color:var(--c-text);font-weight:700}
.cmpx tbody tr:last-child td.-me{box-shadow:inset 3px 0 0 var(--c-main),inset -3px 0 0 var(--c-main),inset 0 -3px 0 var(--c-main)}
.cmpx td[data-m]{position:relative;z-index:0;height:84px}
.cmpx td[data-m]::before{content:"";position:absolute;z-index:-1;left:50%;top:50%;width:60px;height:60px;transform:translate(-50%,-50%);background:center/contain no-repeat}
.cmpx td[data-m="double"]::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 60' fill='none' stroke='%23b9cdf0' stroke-width='5'%3E%3Ccircle cx='30' cy='30' r='26'/%3E%3Ccircle cx='30' cy='30' r='14'/%3E%3C/svg%3E")}
.cmpx td[data-m="circle"]::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 60' fill='none' stroke='%23fbd9b0' stroke-width='5'%3E%3Ccircle cx='30' cy='30' r='25'/%3E%3C/svg%3E")}
.cmpx td[data-m="triangle"]::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 60' fill='none' stroke='%23dcdcdc' stroke-width='5' stroke-linejoin='round'%3E%3Cpath d='M30 6l26 46H4z'/%3E%3C/svg%3E")}
.cmpx td[data-m="cross"]::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 60' fill='none' stroke='%23e2e2e2' stroke-width='5' stroke-linecap='round'%3E%3Cpath d='M10 10l40 40M50 10L10 50'/%3E%3C/svg%3E")}
.cmpx{width:100%;min-width:760px;border-collapse:collapse;table-layout:fixed;background:#fff;box-shadow:0 12px 32px rgba(0,0,0,.08)}
.cmpx th,.cmpx td{padding:18px 16px;border:1px solid #ddd;text-align:center;font-size:var(--fs-body);line-height:var(--lh-body);color:var(--c-text);vertical-align:middle}
.cmpx thead th{padding:20px 12px;background:#f5f5f5;font-size:var(--fs-body);line-height:var(--lh-body);font-weight:700;color:var(--c-text)}
.cmpx tbody th{width:20%;background:#f5f5f5;text-align:left;font-weight:700;color:var(--c-text)}
.cmpx__n{margin-top:12px;font-size:12px;color:#777}
.vs .cmpx{margin:0 auto}

/* サービスや機能のカードの画像は角を丸めない（丸めるのは固定ページの上に出す画像だけ） */
.svm__im img{border-radius:0}
/* 著者欄のSNSアイコンは枠なし（CEO 2026-11-03） */
.afoot__ic{width:auto;height:auto;border:0;border-radius:0;background:none}
.afoot__sns a:hover .afoot__ic{background:none;color:var(--c-main)}
/* 執筆者の写真とSNSアイコンは枠なし（CEO 2026-11-03） */
.afoot__l img{border:0}
.au__sns a{border:0;width:auto;height:auto;padding:4px}
.au__sns a:hover{background:none;color:var(--c-main)}
/* 目次の上にも記事の下と同じ執筆者欄（CEO 2026-11-03） */
.afoot.-top+.toc{margin-top:24px}
/* 記事の見出し（CEO 2026-11-03）：h2＝背景なしで文字を大きく、h3＝左に縦線、h4＝メインカラーの文字 */
.body h2{font-size:28px;line-height:42px;background:none;color:var(--c-ink);padding:0;border:0;border-radius:0}
.body h3{background:none;border-radius:0;padding:2px 0 2px 14px;border:0;border-left:5px solid var(--c-main);color:var(--c-ink)}
.body h4{padding-left:0;border-left:0;color:var(--c-main)}
@media(max-width:767px){.body h2{font-size:23px;line-height:34.5px}}
/* 中身から下のCTAまでの余白を、パンくずから中身までと同じにする（記事のページは除く。CEO 2026-11-04） */
:is(section,div,main):not(.related):not(.-qa):not(:has(.-art)):has(+ section.cc){padding-bottom:var(--crumb-gap)!important;margin-bottom:0!important}
:is(section,div,main):not(.related):not(.-qa):not(:has(.-art)):has(+ section.cc) :is(.flow__w,.nf,.company__w,.nlist__w,.cards,.mcl,.mcmain,.au-list,.pg__w,.wrap,.sd__m,.mfc,.mf__g,.dbc__m,.credit):last-child{padding-bottom:0;margin-bottom:0}
:is(section,div,main):not(.related):not(.-qa):not(:has(.-art)):has(+ section.cc) > :last-child{margin-bottom:0}
:is(section,div):has(+ section.cc) :is(.credit tr,.doc > p):last-child{margin-bottom:0}
/* 中央寄せの文は、語のまとまりで改行する（途中で切らない。CEO 2026-11-04） */
:is(.mhead p,.ctp__lead,.flw__lead,.svm__lead,.util__lead,.vs__lead,.related__lead,.toc-cta.-b p,.scta p,.flow__cta p,.mhero p,.rs li p,.fw--dark p,.sv__h.-c p,.wr__b,.wr__note){word-break:auto-phrase;text-wrap:wrap}
/* こんなお悩みはありませんか？と、その下の解決の帯（CPU PORTALと同じ作り。CEO 2026-11-04） */
.wry{position:relative;padding-bottom:88px}
.wry::after{content:"";position:absolute;left:50%;bottom:-32px;z-index:1;margin-left:-48px;border:48px solid transparent;border-bottom:0;border-top:32px solid var(--c-sec)}
.wry .rtt{text-align:center}
.wr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin:0;padding:8px 0 0;list-style:none;--cpu-columns:3}
.wr li{display:flex;flex-direction:column;align-items:center}
.wr__b{position:relative;width:100%;min-height:112px;display:grid;place-items:center;margin:0;padding:24px 28px;border-radius:9999px;background:var(--c-surface);font-size:var(--fs-body);line-height:var(--lh-body);font-weight:700;text-align:center;box-shadow:0 8px 24px rgba(0,0,0,.06)}
.wr__b::after{content:"";position:absolute;left:50%;bottom:-14px;margin-left:-12px;border:12px solid transparent;border-bottom:0;border-top:14px solid var(--c-surface)}
.wr__p{display:grid;place-items:center;width:84px;height:84px;margin-top:26px;border-radius:50%;background:var(--c-surface);color:var(--c-text)}
.wr__p .fi{width:52px;height:52px;font-size:44px}
.wr__note{margin:36px 0 0;text-align:center;font-size:var(--fs-body);line-height:var(--lh-body)}
.wr__note b{font-weight:700;background:linear-gradient(transparent 62%,var(--c-pale) 62%)}
.slv{padding:96px 0 72px;background:var(--c-text);color:#fff;text-align:center}
.sl__t{margin:0;font-size:28px;line-height:40px;font-weight:700}
.sl__l{max-width:880px;margin:14px auto 28px;font-size:var(--fs-body);line-height:var(--lh-body);color:#d9d9d9;word-break:auto-phrase}
.slv .mbtn{margin:0 auto}
@media(max-width:767px){.wr{grid-template-columns:1fr;gap:20px;--cpu-columns:1}.wr__b{min-height:0;border-radius:24px;padding:20px}.wr__p{width:64px;height:64px;margin-top:20px}.wr__p .fi{width:40px;height:40px;font-size:34px}.wry{padding-bottom:72px}.slv{padding:80px 0 48px}.sl__t{font-size:22px;line-height:32px}}
/* 比較表の「おすすめ」の札が切れないように（CEO 2026-11-04） */
.vs__s:has(.cmpx){padding-top:22px}
/* 目次は淡い背景だけのシンプルな形（CEO 2026-11-04・案C） */
.toc{background:#f5f5f5;border-top:0;box-shadow:none;border-radius:6px;padding:28px 32px}
.toc b{font-size:18px;line-height:28px;font-weight:700}
.toc>ol{margin-top:14px}
.toc>ol>li{padding-left:0;margin-bottom:8px;font-size:15px;line-height:24px}
.toc>ol>li::before{position:static;content:counter(toc) ". ";font:700 15px/24px inherit;font-family:inherit;color:var(--c-main)}
.toc>ol>li>a{display:inline;padding-left:0;border-left:0;font-weight:400}
.toc ol ol{margin-top:6px;padding-left:1.2em}
.toc ol ol li{padding-left:0;margin-bottom:4px;font-size:14px;line-height:22px;font-weight:400}
.toc ol ol li::before{position:static;display:inline;content:"・";width:auto;height:auto;border-radius:0;background:none;color:#999}
@media(max-width:767px){.toc{padding:22px 20px}}
.toc>ol>li{padding-left:1.4em;text-indent:-1.4em}
.toc ol ol{padding-left:0}
.toc ol ol li{padding-left:1em;text-indent:-1em}
/* チェックの箇条書き：メインカラーの丸の中に白い印（CEO 2026-11-04・案B） */
.body ul.-check>li{padding-left:34px}
.body ul.-check>li::before{display:flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:var(--c-main);color:#fff;font-size:11px;line-height:1;top:calc((var(--lh-body) - 22px)/2)}
/* 記事へのリンクカード：PCだけ本文（リンク先の説明文）を2行まで出す（CEO 2026-11-04・案A） */
.body .lcard__d{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;margin-top:4px;font-size:14px;line-height:22px;color:#666}
@media(max-width:767px){.body .lcard__d{display:none}}
/* 文中のリンクは太字（CEO 2026-11-04） */
.body p a,.body li a,.body td a{font-weight:700}
/* リンクカードは上下と左右の余白をそろえる（本文の画像の余白を消す。CEO 2026-11-04） */
.body .lcard img{margin:0}
.body .lcard{align-items:start}
/* 中央寄せの見出しの欄のボタンは、文の長さに関係なく同じ幅（CEO 2026-11-04） */
.mhero.-pt60:not(.-img) .mhero__b>:is(.btn,.mbtn){width:auto!important;min-width:260px;white-space:nowrap}
@media(max-width:767px){.mhero.-pt60:not(.-img) .mhero__b>:is(.btn,.mbtn){width:100%!important;min-width:0}}
/* ボタンの文字は折らない（CEO 2026-11-04） */
.price__plan-btn{white-space:nowrap}
/* 執筆者の文は改行せず、普通に折り返す（CEO 2026-11-04） */
.au__txt,.afoot__r>p{word-break:normal;text-wrap:wrap}
.au__txt{max-width:none}
/* 広告の枠の既定は自社バナー（案②：写真の上にコピー。CEO 2026-11-04） */
.ad-slot.adb{position:relative;display:block;height:250px;padding:0;border:0;background:#222;overflow:hidden;color:#fff;text-decoration:none}
.adb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.adb__pr{position:absolute;top:8px;right:10px;font-size:10px;letter-spacing:0;font-weight:400;color:#fff;opacity:.8}
.adb__c{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;padding:22px;background:linear-gradient(0deg,rgba(0,0,0,.8),rgba(0,0,0,.1))}
.adb__c b{font-size:24px;line-height:1.35;letter-spacing:0}
.adb__c small{margin:6px 0 12px;font-size:12px;line-height:1.6;color:#fff}
.adb__btn{display:inline-flex;align-items:center;gap:6px;padding:8px 18px;border-radius:99px;background:var(--c-main);font-size:13px;font-weight:700;letter-spacing:0}
.adb:hover .adb__btn{text-decoration:underline}
.adb__c small{letter-spacing:0}
.adb__c b,.adb__c small{max-width:100%;overflow-wrap:anywhere}
/* ヘッダーの空いた所をダブルクリックしても、メニューの文字まで選ばれないように。ロゴとメニュー、ボタンの文字は選べる（CEO 2026-11-04） */
.hd{-webkit-user-select:none;user-select:none}
.hd .logo,.hd__nav a,.hd__util a,.hd .mega{-webkit-user-select:text;user-select:text}
/* ページ送りの前後は丸のない矢印（CEO 2026-11-04・案Aのまま） */
.pager a .fi{width:14px;height:14px;font-size:14px}
.body .pager{padding:16px 0 0}
/* 本文の表：横に送れる箱に入れ、3列以上は詰まらない幅を確保。表の中のリンクは本文と同じ色 */
.vs__s.-tbl{margin:20px 0}
.vs__s.-tbl>.tbl{margin:0}
.vs__s>.tbl:has(tr>:nth-child(3)){min-width:640px}
.body .tbl th{white-space:nowrap}
.body .tbl td{word-break:auto-phrase}
.body .tbl a{color:var(--c-text-link);text-decoration:underline;text-underline-offset:.2em}
.body .tbl a:hover{text-decoration:none}
.body .tbl td a{white-space:nowrap}
.vs__s{position:relative}   /* 読み上げ用の隠し文字（絶対配置）が横スクロールの箱から出ないように */
.cmpx th,.cmpx td,.rs li h3{word-break:auto-phrase}

/* 検索の結果で写真のないページ：写真の欄の中央にサイトのロゴ */
.card__ph.-logo,.mf__ph.-logo{display:grid;place-items:center;width:100%;height:100%;background:var(--c-sec)}.mf__ph.-logo{width:120px;height:80px;border-radius:6px}.card__ph.-logo img,.mf__ph.-logo img{width:56%;max-width:140px;height:auto;object-fit:contain}
@media(max-width:767px){.mf__ph.-logo{width:96px;height:68px}}

/* ==== エディタのブロック（CEO 2026-11-04） ==== */
/* 本文の中に置いた目次・執筆者・CTA は、本文の文字の決まり（番号つきリスト・リンクの下線）に左右されず、決まった位置の物と同じ見た目 */
.body .toc a,.body .toc-cta a,.body .afoot a{text-decoration:none}
.body .toc a:hover,.body .afoot__l b a:hover{text-decoration:underline}
.body :is(.afoot,.toc,.toc-cta) :is(p,ul,ol,li,b,a):not(.toc-cta__en){letter-spacing:normal}
.body .afoot__t{margin:0 0 14px;font-size:13px;line-height:18px;font-weight:700}
.body .afoot__r p{margin:0;font-size:15px;line-height:28px;color:var(--c-text)}
.body .afoot__sns{margin:0;list-style:none;font-size:inherit;line-height:inherit}
.body .afoot__sns li{list-style:none}
.body .afoot__sns a{color:#666;font-weight:500}
.body .afoot__ic{font-weight:500}
.body .toc>ol>li>a{color:var(--c-text)}
.body .toc-cta__en,.body .toc-cta__p{color:#fff}
/* ボタン（エディタの ram/buttons）の揃え。ボタン自体は記事の中のボタン（.abtn の塗り・枠線）のまま */
.body .abtns[data-justify="start"]{justify-content:flex-start}
.body .abtns[data-justify="end"]{justify-content:flex-end}
.body .lcard:not(:has(img)){grid-template-columns:minmax(0,1fr);--cpu-columns:1}
/* エディタで置ける部品（セクション・段組み・メディアカード・スライダー・開閉・区切り線・埋め込み・画像・脚注）の公開側の見た目。2サイト共通。色はメインカラー（--c-main）と既存の線・影の変数だけ。見本の取り込み部品（.fig など）には当てない */
.body .ram-section,.body .ram-columns,.body .ram-media-card,.body .ram-slider,.body .wp-block-details,.body .wp-block-embed,.body .wp-block-image{margin:32px 0}
.body :is(.ram-section__inner,.ram-column,.ram-media-card__body,.wp-block-details)>:first-child{margin-top:0}
.body :is(.ram-section__inner,.ram-column,.ram-media-card__body,.wp-block-details)>:last-child{margin-bottom:0}
.body hr.wp-block-separator{border:0;border-top:1px solid var(--c-line);height:0;margin:40px 0;background:none}
.body .wp-block-spacer{clear:both}
/* 上下の余白・PCとスマホの出し分け・文字の揃え（段落や見出しのクラスに付く） */
.ram-mt-0{margin-top:0!important}
.ram-mt-5{margin-top:.5rem!important}
.ram-mt-10{margin-top:1rem!important}
.ram-mt-30{margin-top:3rem!important}
.ram-mb-20{margin-bottom:2rem!important}
@media(max-width:767px){.ram-only-pc{display:none!important}}
@media(min-width:768px){.ram-only-sp{display:none!important}}
.has-text-align-center{text-align:center}
.has-text-align-left{text-align:left}
.has-text-align-right{text-align:right}
/* ram/section：帯。背景画像・色の層・中身の位置。幅は記事の本文幅いっぱい（画面いっぱいには広げない） */
.ram-section{--ram-sec-pad:var(--sec-pad-s) 0;--ram-sec-pad-sp:var(--ram-sec-pad);position:relative;overflow:hidden;border-radius:4px}
.ram-section[style*="color:"] :is(p,li,h2,h3,h4,th,td,figcaption){color:inherit}
.ram-section[data-height="full"]>.ram-section__body{min-height:calc(100svh - var(--hd-h))}
.ram-section__media,.ram-section__color{position:absolute;inset:0;display:block}
.ram-section__media{z-index:0}
.ram-section__color{z-index:1}
.body .ram-section__img{display:block;width:100%;height:100%;margin:0;aspect-ratio:auto;object-fit:cover;object-position:center}
.ram-section__body{position:relative;z-index:2;display:flex;width:100%}
.ram-section:has(>.ram-section__color,>.ram-section__media) .ram-section__body{padding-inline:24px}
.ram-section__body[data-align="center-left"]{align-items:center;justify-content:flex-start}
.ram-section__body[data-align="center-center"]{align-items:center;justify-content:center;text-align:center}
.ram-section__inner{width:100%;padding:var(--ram-sec-pad)}
@media(max-width:767px){.ram-section__inner{padding:var(--ram-sec-pad-sp)}.ram-section[data-height="full"]>.ram-section__body{min-height:calc(100svh - var(--hd-h-s))}.ram-section:has(>.ram-section__color,>.ram-section__media) .ram-section__body{padding-inline:var(--gutter-s)}}
/* ram/columns・ram/column：段組み（PC＝1000px以上、タブレット＝600〜999px、スマホ＝600px未満で列数が変わる） */
.ram-columns{--ram-cols-pc:50%;--ram-cols-tab:50%;--ram-cols-sp:100%;--ram-gap-x:1.5rem;--ram-gap-y:1.5rem}
.ram-columns__inner{display:flex;flex-wrap:wrap;justify-content:flex-start;margin-left:calc(var(--ram-gap-x)*-1);row-gap:var(--ram-gap-y)}
.ram-columns[data-valign="center"]>.ram-columns__inner{align-items:center}
.ram-column{--ram-col-w:var(--ram-cols-pc)}
.ram-columns .ram-column{width:calc(var(--ram-col-w) - var(--ram-gap-x));margin:0 0 0 var(--ram-gap-x);padding:var(--ram-cols-pad,0);min-width:0}
.ram-columns--shadow{--ram-cols-pad:1rem}
.ram-columns--shadow>.ram-columns__inner>.ram-column{background:var(--c-surface);box-shadow:0 8px 40px 0 var(--sh-card);color:var(--c-ink);border-radius:4px}
.ram-columns--round{--ram-cols-pad:0}
.ram-columns--round .ram-column{border-radius:8px;padding:0!important}
.body .ram-columns--round .ram-column img{border-radius:8px 8px 0 0}
@media(max-width:999px){.ram-column{--ram-col-w:var(--ram-cols-tab)}}
@media(max-width:599px){.ram-column{--ram-col-w:var(--ram-cols-sp)}}
/* ram/media-card：画像と文を左右に並べたカード（スマホでは上下） */
.ram-media-card{--ram-mc-media-w:50%;display:grid;grid-template-columns:var(--ram-mc-media-w) auto;grid-template-rows:auto;position:relative;background:var(--c-surface);color:var(--c-text);border-radius:4px;box-shadow:0 8px 40px 0 var(--sh-card);overflow:hidden}
.ram-media-card :is(p,h2,h3,h4,li){color:inherit}
.ram-media-card__media{grid-column:1;grid-row:1;align-self:center;height:100%;margin:0}
.ram-media-card__media a{display:block;height:100%}
.body .ram-media-card__img{display:block;width:100%;height:100%;margin:0;max-width:unset;aspect-ratio:auto;object-fit:cover;vertical-align:middle}
.ram-media-card__body{grid-column:2;grid-row:1;align-self:center;padding:1.5rem;word-break:break-word}
@media(max-width:600px){.ram-media-card{grid-template-columns:100%!important}.ram-media-card__media{grid-row:1!important}.ram-media-card__body{grid-column:1;grid-row:2!important;padding:1.25rem}}
/* ram/slider・ram/slide：画像の切り替え（動きは base.js の setupSlider）。スライドの高さは画像の比率のまま */
.ram-slider{--ram-slider-per:1;--ram-slider-per-sp:1;--ram-slider-gap:2px;--ram-slider-gap-sp:0px;--ram-slider-nav:32px;--ram-slider-thumb-h:80px;--ram-slider-per-now:var(--ram-slider-per);--ram-slider-gap-now:var(--ram-slider-gap)}
.ram-slider__main{position:relative;z-index:1;overflow:hidden}
.ram-slider__track{display:flex;gap:var(--ram-slider-gap-now);transition-property:transform;transition-timing-function:ease}
.ram-slide{position:relative;flex-shrink:0;width:calc((100% - var(--ram-slider-gap-now)*(var(--ram-slider-per-now) - 1))/var(--ram-slider-per-now))}
.body .ram-slide__img{display:block;width:100%;height:100%;margin:0;aspect-ratio:auto;object-fit:cover;object-position:center}
.ram-slider__nav{position:absolute;top:50%;z-index:10;display:flex;align-items:center;justify-content:center;width:var(--ram-slider-nav);height:var(--ram-slider-nav);margin-top:calc(0px - var(--ram-slider-nav)/2);padding:0;border:0;background:none;color:var(--c-ink);cursor:pointer}
.ram-slider__nav svg{width:100%;height:100%;fill:currentColor}
.ram-slider__nav--prev{left:4px}
.ram-slider__nav--next{right:4px}
.ram-slider__thumbs{display:flex;height:var(--ram-slider-thumb-h);margin:8px 0;overflow:hidden}
.ram-slider__thumb{flex:1;min-width:var(--ram-slider-thumb-h);height:100%;margin:0 4px;padding:0;border:0;background:var(--c-line);cursor:pointer;opacity:.3}
.ram-slider__thumb:first-child{margin-left:0}
.ram-slider__thumb:last-child{margin-right:0}
.ram-slider__thumb img{display:block;width:100%;height:100%;object-fit:cover}
.ram-slider__thumb.is-active{opacity:1}
@media(max-width:999px){.ram-slider{--ram-slider-nav:24px;--ram-slider-thumb-h:56px;--ram-slider-per-now:var(--ram-slider-per-sp);--ram-slider-gap-now:var(--ram-slider-gap-sp)}}
/* 開閉（core/details）：線で囲った箱。押すと中身が開く */
.body .wp-block-details{border:1px solid var(--c-line);border-radius:8px;background:var(--c-surface);padding:0}
.body .wp-block-details>summary{cursor:pointer;padding:14px 20px;font-weight:700;line-height:1.6}
.body .wp-block-details[open]>summary{border-bottom:1px solid var(--c-line)}
.body .wp-block-details>:not(summary){margin:16px 20px 0}
.body .wp-block-details>:last-child{margin-bottom:16px}
/* 画像（core/image）：元の比率のまま。16:9 に切り抜く規則（.body img）は当てない */
.body .wp-block-image{text-align:center}
.body .wp-block-image img{display:inline-block;width:auto;max-width:100%;height:auto;margin:0;aspect-ratio:auto;object-fit:initial;vertical-align:bottom}
.body .wp-block-image>a{display:inline-block}
.body .wp-block-image.alignleft{text-align:left}
.body .wp-block-image.alignright{text-align:right}
.body .wp-block-image figcaption,.body .wp-element-caption{margin-top:12px;font-size:14px;line-height:1.7;color:#666;text-align:center}
/* 埋め込み（core/embed）：動画・地図は幅いっぱいで比率を保つ（YouTube＝16:9、Googleマップ＝4:3）。Spotify は高さを iframe に任せる */
.body .wp-block-embed__wrapper{position:relative}
.body .wp-block-embed iframe{display:block;width:100%;max-width:100%;border:0}
.body .wp-has-aspect-ratio .wp-block-embed__wrapper{aspect-ratio:16/9}
.body .wp-embed-aspect-4-3 .wp-block-embed__wrapper{aspect-ratio:4/3}
.body .wp-has-aspect-ratio iframe{position:absolute;inset:0;height:100%}
/* 引用（エディタの引用ブロック <blockquote class="wp-block-quote">）。左に細い線、文字は本文と同じ大きさで少し薄く。2サイト共通 */
.body blockquote.wp-block-quote{margin:24px 0;padding:2px 0 2px 20px;border-left:3px solid var(--c-main)}
.body blockquote.wp-block-quote>p{color:color-mix(in srgb,var(--c-ink) 62%,transparent)}
.body blockquote.wp-block-quote>:last-child{margin-bottom:0}
.body blockquote.wp-block-quote cite{display:block;margin-top:8px;font-size:.875em;font-style:normal;color:color-mix(in srgb,var(--c-ink) 55%,transparent)}
/* 脚注（本文の小さい番号→末尾の注の一覧。番号と戻るリンクは書き出しの時に作る） */
.body sup.fn{font-size:.75em;line-height:0}
.body sup.fn a{padding:0 2px}
.body ol.cpu-fn.cpu-fn{list-style:decimal;margin:40px 0 0 1.5em;padding:16px 0 0;border-top:1px solid var(--c-line);font-size:14px;line-height:25.2px}
.body ol.cpu-fn.cpu-fn>li{padding-left:0;margin-bottom:4px}
.body ol.cpu-fn.cpu-fn>li::before{content:none}
.body ol.cpu-fn .fn-back{margin-left:.25em;text-decoration:none}
.body ol.cpu-fn>li,.body sup.fn a{scroll-margin-top:calc(var(--hd-h) + 16px)}
@media(max-width:767px){.body ol.cpu-fn>li,.body sup.fn a{scroll-margin-top:calc(var(--hd-h-s) + 16px)}}
.ctp__iframe{display:block;width:100%;min-height:900px;border:0}
.ctp__btn{margin:0 0 24px}

.body .toc-cta{margin-bottom:24px}   /* 本文の中のCTAの下に続く段落・部品が、枠にくっつかないようにする */
.toc-cta + :is(p,ul,ol,figure,h2,h3,h4,blockquote,div):not(.share-lead):not(.afoot):not(.toc-cta){margin-top:24px}   /* CTAのすぐ下に続く段落・部品も、枠にくっつけない */

/* 本文のボタンは見本の塗りのpill一種類。 */
.abtns,.body .abtns,.body .abtns[data-justify]{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin:24px 0}
a.abtn.-fill,.body a.abtn.-fill{display:flex;align-items:center;justify-content:center;gap:10px;margin-left:auto;margin-right:auto;flex:none;background:var(--c-main);color:#fff;border:1px solid var(--c-main);border-radius:9999px;width:350px;max-width:100%;min-height:48px;padding:10px 16px;box-sizing:border-box;font-size:16px;line-height:24px;font-weight:700;text-align:center;text-decoration:none}
a.abtn.-fill:hover,.body a.abtn.-fill:hover{background:var(--c-main);border-color:var(--c-main);filter:brightness(.85);text-decoration:none}
.abtn .ic-go{display:inline-flex;align-items:center;justify-content:center}

/* 少ない項目数だけ列を減らす。見本の個数と、多い時の列数は元のまま。 */
.cc__g:has(>:nth-child(1):last-child){grid-template-columns:repeat(min(1,var(--cpu-columns)),minmax(0,1fr))}.cc__g:has(>:nth-child(2):last-child){grid-template-columns:repeat(min(2,var(--cpu-columns)),minmax(0,1fr))}.cc__g:has(>:nth-child(3):last-child){grid-template-columns:repeat(min(3,var(--cpu-columns)),minmax(0,1fr))}.cc__g:has(>:nth-child(4):last-child){grid-template-columns:repeat(min(4,var(--cpu-columns)),minmax(0,1fr))}.cc__g:has(>:nth-child(5):last-child){grid-template-columns:repeat(min(5,var(--cpu-columns)),minmax(0,1fr))}.cc__g:has(>:only-child){width:100%;max-width:400px;margin-left:auto;margin-right:auto}.ctp__logo ul:has(>:nth-child(1):last-child){grid-template-columns:repeat(min(1,var(--cpu-columns)),minmax(0,1fr))}.ctp__logo ul:has(>:nth-child(2):last-child){grid-template-columns:repeat(min(2,var(--cpu-columns)),minmax(0,1fr))}.ctp__logo ul:has(>:nth-child(3):last-child){grid-template-columns:repeat(min(3,var(--cpu-columns)),minmax(0,1fr))}.ctp__logo ul:has(>:nth-child(4):last-child){grid-template-columns:repeat(min(4,var(--cpu-columns)),minmax(0,1fr))}.ctp__logo ul:has(>:nth-child(5):last-child){grid-template-columns:repeat(min(5,var(--cpu-columns)),minmax(0,1fr))}.ctp__logo ul:has(>:only-child){width:100%;max-width:400px;margin-left:auto;margin-right:auto}.ctp__tel dl:has(>:nth-child(1):last-child){grid-template-columns:repeat(min(1,var(--cpu-columns)),minmax(0,1fr))}.ctp__tel dl:has(>:nth-child(2):last-child){grid-template-columns:repeat(min(2,var(--cpu-columns)),minmax(0,1fr))}.ctp__tel dl:has(>:nth-child(3):last-child){grid-template-columns:repeat(min(3,var(--cpu-columns)),minmax(0,1fr))}.ctp__tel dl:has(>:nth-child(4):last-child){grid-template-columns:repeat(min(4,var(--cpu-columns)),minmax(0,1fr))}.ctp__tel dl:has(>:nth-child(5):last-child){grid-template-columns:repeat(min(5,var(--cpu-columns)),minmax(0,1fr))}.dll:has(>:nth-child(1):last-child){grid-template-columns:repeat(min(1,var(--cpu-columns)),minmax(0,1fr))}.dll:has(>:nth-child(2):last-child){grid-template-columns:repeat(min(2,var(--cpu-columns)),minmax(0,1fr))}.dll:has(>:nth-child(3):last-child){grid-template-columns:repeat(min(3,var(--cpu-columns)),minmax(0,1fr))}.dll:has(>:nth-child(4):last-child){grid-template-columns:repeat(min(4,var(--cpu-columns)),minmax(0,1fr))}.dll:has(>:nth-child(5):last-child){grid-template-columns:repeat(min(5,var(--cpu-columns)),minmax(0,1fr))}.dll:has(>:only-child){width:100%;max-width:400px;margin-left:auto;margin-right:auto}.flw__g:has(>:nth-child(1):last-child){grid-template-columns:repeat(min(1,var(--cpu-columns)),minmax(0,1fr))}.flw__g:has(>:nth-child(2):last-child){grid-template-columns:repeat(min(2,var(--cpu-columns)),minmax(0,1fr))}.flw__g:has(>:nth-child(3):last-child){grid-template-columns:repeat(min(3,var(--cpu-columns)),minmax(0,1fr))}.flw__g:has(>:nth-child(4):last-child){grid-template-columns:repeat(min(4,var(--cpu-columns)),minmax(0,1fr))}.flw__g:has(>:nth-child(5):last-child){grid-template-columns:repeat(min(5,var(--cpu-columns)),minmax(0,1fr))}.flw__g:has(>:only-child){width:100%;max-width:400px;margin-left:auto;margin-right:auto}.flw__i ul:has(>:nth-child(1):last-child){grid-template-columns:repeat(min(1,var(--cpu-columns)),minmax(0,1fr))}.flw__i ul:has(>:nth-child(2):last-child){grid-template-columns:repeat(min(2,var(--cpu-columns)),minmax(0,1fr))}.flw__i ul:has(>:nth-child(3):last-child){grid-template-columns:repeat(min(3,var(--cpu-columns)),minmax(0,1fr))}.flw__i ul:has(>:nth-child(4):last-child){grid-template-columns:repeat(min(4,var(--cpu-columns)),minmax(0,1fr))}.flw__i ul:has(>:nth-child(5):last-child){grid-template-columns:repeat(min(5,var(--cpu-columns)),minmax(0,1fr))}.fq:has(>:nth-child(1):last-child){grid-template-columns:repeat(min(1,var(--cpu-columns)),minmax(0,1fr))}.fq:has(>:nth-child(2):last-child){grid-template-columns:repeat(min(2,var(--cpu-columns)),minmax(0,1fr))}.fq:has(>:nth-child(3):last-child){grid-template-columns:repeat(min(3,var(--cpu-columns)),minmax(0,1fr))}.fq:has(>:nth-child(4):last-child){grid-template-columns:repeat(min(4,var(--cpu-columns)),minmax(0,1fr))}.fq:has(>:nth-child(5):last-child){grid-template-columns:repeat(min(5,var(--cpu-columns)),minmax(0,1fr))}.fq:has(>:only-child){width:100%;max-width:400px;margin-left:auto;margin-right:auto}.ft__cols:has(>:nth-child(1):last-child){grid-template-columns:repeat(min(1,var(--cpu-columns)),minmax(0,1fr))}.ft__cols:has(>:nth-child(2):last-child){grid-template-columns:repeat(min(2,var(--cpu-columns)),minmax(0,1fr))}.ft__cols:has(>:nth-child(3):last-child){grid-template-columns:repeat(min(3,var(--cpu-columns)),minmax(0,1fr))}.ft__cols:has(>:nth-child(4):last-child){grid-template-columns:repeat(min(4,var(--cpu-columns)),minmax(0,1fr))}.ft__cols:has(>:nth-child(5):last-child){grid-template-columns:repeat(min(5,var(--cpu-columns)),minmax(0,1fr))}.ft__g:has(>:nth-child(1):last-child){grid-template-columns:repeat(min(1,var(--cpu-columns)),minmax(0,1fr))}.ft__g:has(>:nth-child(2):last-child){grid-template-columns:repeat(min(2,var(--cpu-columns)),minmax(0,1fr))}.ft__g:has(>:nth-child(3):last-child){grid-template-columns:repeat(min(3,var(--cpu-columns)),minmax(0,1fr))}.ft__g:has(>:nth-child(4):last-child){grid-template-columns:repeat(min(4,var(--cpu-columns)),minmax(0,1fr))}.ft__g:has(>:nth-child(5):last-child){grid-template-columns:repeat(min(5,var(--cpu-columns)),minmax(0,1fr))}.mcl.-wide .cards:has(>:nth-child(1):last-child){grid-template-columns:repeat(min(1,var(--cpu-columns)),minmax(0,1fr))}.mcl.-wide .cards:has(>:nth-child(2):last-child){grid-template-columns:repeat(min(2,var(--cpu-columns)),minmax(0,1fr))}.mcl.-wide .cards:has(>:nth-child(3):last-child){grid-template-columns:repeat(min(3,var(--cpu-columns)),minmax(0,1fr))}.mcl.-wide .cards:has(>:nth-child(4):last-child){grid-template-columns:repeat(min(4,var(--cpu-columns)),minmax(0,1fr))}.mcl.-wide .cards:has(>:nth-child(5):last-child){grid-template-columns:repeat(min(5,var(--cpu-columns)),minmax(0,1fr))}.mcl.-wide .cards:has(>:only-child){width:100%;max-width:400px;margin-left:auto;margin-right:auto}.price__cards:has(>:nth-child(1):last-child){grid-template-columns:repeat(min(1,var(--cpu-columns)),minmax(0,1fr))}.price__cards:has(>:nth-child(2):last-child){grid-template-columns:repeat(min(2,var(--cpu-columns)),minmax(0,1fr))}.price__cards:has(>:nth-child(3):last-child){grid-template-columns:repeat(min(3,var(--cpu-columns)),minmax(0,1fr))}.price__cards:has(>:nth-child(4):last-child){grid-template-columns:repeat(min(4,var(--cpu-columns)),minmax(0,1fr))}.price__cards:has(>:nth-child(5):last-child){grid-template-columns:repeat(min(5,var(--cpu-columns)),minmax(0,1fr))}.price__cards:has(>:only-child){width:100%;max-width:400px;margin-left:auto;margin-right:auto}.svm__g:has(>:nth-child(1):last-child){grid-template-columns:repeat(min(1,var(--cpu-columns)),minmax(0,1fr))}.svm__g:has(>:nth-child(2):last-child){grid-template-columns:repeat(min(2,var(--cpu-columns)),minmax(0,1fr))}.svm__g:has(>:nth-child(3):last-child){grid-template-columns:repeat(min(3,var(--cpu-columns)),minmax(0,1fr))}.svm__g:has(>:nth-child(4):last-child){grid-template-columns:repeat(min(4,var(--cpu-columns)),minmax(0,1fr))}.svm__g:has(>:nth-child(5):last-child){grid-template-columns:repeat(min(5,var(--cpu-columns)),minmax(0,1fr))}.svm__g:has(>:only-child){width:100%;max-width:400px;margin-left:auto;margin-right:auto}.util__g:has(>:nth-child(1):last-child){grid-template-columns:repeat(min(1,var(--cpu-columns)),minmax(0,1fr))}.util__g:has(>:nth-child(2):last-child){grid-template-columns:repeat(min(2,var(--cpu-columns)),minmax(0,1fr))}.util__g:has(>:nth-child(3):last-child){grid-template-columns:repeat(min(3,var(--cpu-columns)),minmax(0,1fr))}.util__g:has(>:nth-child(4):last-child){grid-template-columns:repeat(min(4,var(--cpu-columns)),minmax(0,1fr))}.util__g:has(>:nth-child(5):last-child){grid-template-columns:repeat(min(5,var(--cpu-columns)),minmax(0,1fr))}.util__g:has(>:only-child){width:100%;max-width:400px;margin-left:auto;margin-right:auto}.wr:has(>:nth-child(1):last-child){grid-template-columns:repeat(min(1,var(--cpu-columns)),minmax(0,1fr))}.wr:has(>:nth-child(2):last-child){grid-template-columns:repeat(min(2,var(--cpu-columns)),minmax(0,1fr))}.wr:has(>:nth-child(3):last-child){grid-template-columns:repeat(min(3,var(--cpu-columns)),minmax(0,1fr))}.wr:has(>:nth-child(4):last-child){grid-template-columns:repeat(min(4,var(--cpu-columns)),minmax(0,1fr))}.wr:has(>:nth-child(5):last-child){grid-template-columns:repeat(min(5,var(--cpu-columns)),minmax(0,1fr))}.wr:has(>:only-child){width:100%;max-width:400px;margin-left:auto;margin-right:auto}/* トップの資料とFAQ */
.dl:has(>:nth-child(1):last-child){grid-template-columns:repeat(min(1,var(--cpu-columns)),minmax(0,1fr))}/* トップの資料とFAQ */
.dl:has(>:nth-child(2):last-child){grid-template-columns:repeat(min(2,var(--cpu-columns)),minmax(0,1fr))}/* トップの資料とFAQ */
.dl:has(>:nth-child(3):last-child){grid-template-columns:repeat(min(3,var(--cpu-columns)),minmax(0,1fr))}/* トップの資料とFAQ */
.dl:has(>:nth-child(4):last-child){grid-template-columns:repeat(min(4,var(--cpu-columns)),minmax(0,1fr))}/* トップの資料とFAQ */
.dl:has(>:nth-child(5):last-child){grid-template-columns:repeat(min(5,var(--cpu-columns)),minmax(0,1fr))}/* トップの資料とFAQ */
.dl:has(>:only-child){width:100%;max-width:400px;margin-left:auto;margin-right:auto}
/* AdSenseの広告枠の余白（1.8.3）。記事の上は、PCは2枠を横に並べ、前後の本文とくっつけない */
.ad-row{display:flex;gap:16px;margin:24px 0}
.ad-row>.ad-cell{flex:1 1 0;min-width:0;overflow:hidden}
.ad-unit{margin:24px 0;max-width:100%;overflow:hidden}
.box.ad-slot .ad-unit{margin:0}