/* キャリアカ就活（青）版：/media-hr/media.css の色を置き換えたもの */
/* =============================================================
キャリアカ 採用メディア（media-hr）
★ 2026-10-19 企業向けLP（/corporate/）と同じトンマナへ：ターコイズ×オレンジ、
見出しは M PLUS Rounded 1c、本文は Noto Sans JP、角の丸いカード。
- ヘッダー・フッター・ボタンの見た目は lp-shell.css（LP から自動で抜き出し）
- 本文リストの「縦の工程フロー図」、番号付き見出しなど、読みやすさの工夫は案2から引き継ぐ
============================================================= */
:root{
--hr-tl:#0D72BA; --hr-tl-d:#095D98; --hr-nv:#262B2B; --hr-amb:#FF8A00;
--hr-bg:#F3F8FE; --hr-card:#fff; --hr-ink:#262B2B; --hr-mute:#566463; --hr-line:#E1EAF4;
--hr-font:"Noto Sans JP","Hiragino Sans","Yu Gothic",system-ui,sans-serif;
--hr-disp:"M PLUS Rounded 1c","Hiragino Maru Gothic ProN","Hiragino Sans",sans-serif;
}
body{background:var(--hr-bg);color:var(--hr-ink);font-family:var(--hr-font);line-height:1.9}
.ca-article,.ca-index{max-width:820px;margin:0 auto;padding:0 20px 44px}
.ca-index{max-width:1080px}
/* ---------- breadcrumb ---------- */
.ca-breadcrumb{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:12px;font-weight:600;color:var(--hr-mute);padding:20px 0 8px}
.ca-breadcrumb a{color:var(--hr-mute);text-decoration:none}
.ca-breadcrumb a:hover{color:var(--hr-tl)}
.ca-breadcrumb span{opacity:.55}
/* ---------- article head ---------- */
.ca-eyebrow{display:inline-flex;align-items:center;gap:7px;background:#EAF3FC;color:var(--hr-tl-d);font-weight:800;font-size:12px;letter-spacing:.04em;border-radius:999px;padding:5px 15px;margin:0 0 4px}
.ca-eyebrow::before{content:"◇"}
.ca-title{font-weight:900;font-size:clamp(26px,4.6vw,38px);line-height:1.34;color:var(--hr-nv);margin:14px 0 14px;letter-spacing:.01em}
.ca-meta{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:12.5px;color:var(--hr-mute);font-weight:600}
.ca-cat-badge{background:var(--hr-nv);color:#fff;font-weight:700;font-size:12px;border-radius:6px;padding:3px 11px}
.ca-meta-sup{display:block;font-size:12.5px;color:var(--hr-mute);margin:13px 0 0;padding:10px 16px 10px 16px;background:#fff;border:1px solid var(--hr-line);border-left:4px solid var(--hr-tl);border-radius:0 10px 10px 0}
/* ---------- hero（svg.phpの図解イラスト） ---------- */
.ca-hero{margin:22px 0 6px;background:#fff;border:1px solid var(--hr-line);border-radius:16px;overflow:hidden;position:relative;line-height:0}
.ca-hero::before{content:"";position:absolute;top:0;left:0;width:100%;height:4px;background:linear-gradient(90deg,var(--hr-tl),var(--hr-nv));z-index:1}
.ca-hero img{width:100%;height:auto;display:block}
/* ---------- lead ---------- */
.ca-lead{position:relative;background:#fff;border:1px solid var(--hr-line);border-left:5px solid var(--hr-tl);border-radius:0 12px 12px 0;padding:18px 22px;margin:22px 0 6px;font-size:15.5px}
.ca-lead strong{color:var(--hr-tl-d);font-weight:700}
/* ---------- TOC ---------- */
.ca-toc{background:#fff;border:1px solid var(--hr-line);border-radius:14px;padding:20px 22px;margin:26px 0}
.ca-toc-ttl{font-size:13px;font-weight:800;color:var(--hr-nv);letter-spacing:.06em;margin:0 0 12px;display:flex;align-items:center;gap:9px}
.ca-toc-ttl::before{content:"";width:16px;height:16px;border-radius:4px;background:var(--hr-tl);display:inline-block}
.ca-toc-list{margin:0;padding:0;list-style:none;counter-reset:hrtoc}
.ca-toc-list li{counter-increment:hrtoc;display:flex;gap:12px;align-items:baseline;padding:6px 0;font-size:14px;font-weight:500}
.ca-toc-list li::before{content:counter(hrtoc,decimal-leading-zero);font-family:var(--hr-disp);font-weight:800;font-size:12px;color:var(--hr-tl);flex:none}
.ca-toc-list a{color:var(--hr-ink);text-decoration:none}
.ca-toc-list a:hover{color:var(--hr-tl)}
/* ---------- body ---------- */
.ca-body{font-size:16px;counter-reset:hrh2}
.ca-body p{margin:0 0 16px}
.ca-body strong{color:var(--hr-nv);font-weight:700;box-shadow:inset 0 -8px 0 rgba(227,154,52,.28)}
.ca-body .ca-h2{counter-increment:hrh2;font-weight:900;font-size:clamp(20px,3.3vw,26px);color:var(--hr-nv);line-height:1.4;margin:46px 0 16px;padding-bottom:12px;border-bottom:2px solid #E3EAF3;display:flex;align-items:center;gap:12px}
.ca-body .ca-h2::before{content:counter(hrh2);font-family:var(--hr-disp);font-weight:800;font-size:15px;color:#fff;background:var(--hr-tl);min-width:34px;height:34px;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;flex:none}
/* まとめ・FAQの見出しには番号を付けない */
.ca-takeaways .ca-h2,.ca-faq .ca-h2{counter-increment:none}
.ca-takeaways .ca-h2::before,.ca-faq .ca-h2::before{content:none}
/* ---------- body list → 縦の工程フロー図（案2の主役） ---------- */
.ca-body .ca-list{list-style:none;margin:16px 0 22px;padding:0;counter-reset:hrflow}
.ca-body .ca-list li{position:relative;counter-increment:hrflow;padding:4px 0 22px 64px;font-size:14.5px;min-height:44px}
.ca-body .ca-list li::before{content:counter(hrflow);position:absolute;left:0;top:0;width:44px;height:44px;border-radius:12px;background:#EAF3FC;border:2px solid var(--hr-tl);color:var(--hr-nv);font-family:var(--hr-disp);font-weight:800;font-size:16px;display:grid;place-items:center;z-index:1}
.ca-body .ca-list li::after{content:"";position:absolute;left:22px;top:46px;bottom:-2px;width:2px;background:#D8E6F5}
.ca-body .ca-list li:last-child::after{display:none}
/* ---------- takeaways（濃紺サマリー） ---------- */
.ca-takeaways{background:var(--hr-nv);color:#fff;border-radius:16px;padding:24px 24px 20px;margin:30px 0}
.ca-takeaways .ca-h2{color:#fff;border:none;padding:0;margin:0 0 14px;font-size:16px;letter-spacing:.02em}
.ca-takeaways ul{list-style:none;margin:0;padding:0}
.ca-takeaways li{position:relative;padding:9px 0 9px 34px;font-size:14.5px;border-bottom:1px solid rgba(255,255,255,.12)}
.ca-takeaways li:last-child{border-bottom:none}
.ca-takeaways li::before{content:"";position:absolute;left:0;top:12px;width:20px;height:20px;background-image:url("data:image/svg+xml;utf8,");background-size:20px;background-repeat:no-repeat}
/* ---------- FAQ ---------- */
.ca-faq{margin:18px 0}
.ca-faq-item{background:#fff;border:1px solid var(--hr-line);border-radius:12px;padding:16px 20px;margin:0 0 10px}
.ca-faq-q{position:relative;font-weight:800;font-size:15px;color:var(--hr-nv);margin:0;padding-left:36px;line-height:1.6}
.ca-faq-q::before{content:"Q";position:absolute;left:0;top:0;width:24px;height:24px;border-radius:6px;background:var(--hr-tl);color:#fff;font-family:var(--hr-disp);font-weight:800;font-size:12px;display:grid;place-items:center}
.ca-faq-a{position:relative;font-size:13.5px;color:#4A5857;margin:11px 0 0;padding:11px 0 0 36px;border-top:1px solid #EEF4FB;line-height:1.85}
.ca-faq-a::before{content:"A";position:absolute;left:0;top:11px;width:24px;height:24px;border-radius:6px;background:#EAF3FC;color:var(--hr-tl-d);font-family:var(--hr-disp);font-weight:800;font-size:12px;display:grid;place-items:center}
/* ---------- supervisor（E-E-A-T） ---------- */
.ca-supervisor-box{background:#fff;border:1px solid var(--hr-line);border-top:3px solid var(--hr-tl);border-radius:12px;padding:20px 22px;margin:30px 0}
.ca-sup-head{display:flex;gap:13px;align-items:center;margin:0 0 10px}
.ca-sup-icon{flex:none;width:46px;height:46px;border-radius:12px;background:var(--hr-nv);display:grid;place-items:center}
.ca-sup-label{font-size:11.5px;color:var(--hr-mute);font-weight:700;margin:0}
.ca-sup-name{font-weight:800;font-size:15px;color:var(--hr-nv);margin:2px 0 0}
.ca-sup-desc{font-size:12.5px;color:#4A5857;line-height:1.85;margin:0 0 10px}
.ca-sup-links{display:flex;gap:16px;flex-wrap:wrap}
.ca-sup-links a{color:var(--hr-tl);font-weight:700;font-size:12.5px;text-decoration:none}
.ca-sup-links a:hover{text-decoration:underline}
/* ---------- CTA（企業向け・濃紺） ---------- */
.ca-cta{background:linear-gradient(120deg,var(--hr-nv),#1B2B3C);border-radius:18px;padding:30px 26px;margin:32px 0;color:#fff;position:relative;overflow:hidden}
.ca-cta::after{content:"";position:absolute;right:-40px;top:-40px;width:180px;height:180px;border-radius:50%;background:rgba(46,139,230,.22)}
.ca-cta-inner{position:relative;z-index:1}
.ca-cta-lead{font-weight:900;font-size:clamp(18px,3vw,23px);margin:0 0 8px;line-height:1.5;color:#fff}
.ca-cta-sub{font-size:13.5px;color:#C6D9EE;margin:0 0 18px;max-width:60ch}
.ca-cta-btn{display:inline-flex;align-items:center;gap:8px;background:var(--hr-tl);color:#fff;font-weight:800;font-size:14.5px;border-radius:10px;padding:12px 26px;text-decoration:none}
.ca-cta-btn::after{content:"→";font-weight:900}
.ca-cta-btn:hover{background:var(--hr-tl-d)}
/* ---------- related ---------- */
.ca-related{margin:34px 0 0}
.ca-related .ca-h2{font-weight:900;font-size:20px;color:var(--hr-nv);margin:0 0 14px}
/* ---------- cards（一覧・関連 共通） ---------- */
.ca-card-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.ca-index .ca-card-grid{grid-template-columns:repeat(3,1fr);gap:20px}
.ca-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--hr-line);border-radius:14px;overflow:hidden;text-decoration:none;color:inherit;transition:.15s;box-shadow:0 2px 0 rgba(11,34,56,.03)}
.ca-card:hover{transform:translateY(-3px);box-shadow:0 16px 34px -20px rgba(11,34,56,.5);border-color:#CBDCEF}
.ca-card-thumb{position:relative;line-height:0;border-bottom:1px solid #EEF4FB;background:#F6FAFE}
.ca-card-thumb img{width:100%;height:auto;display:block}
.ca-card-body{padding:16px 17px 17px;display:flex;flex-direction:column;flex:1}
.ca-card-cat{display:inline-block;align-self:flex-start;font-size:11px;font-weight:700;color:#fff;background:var(--hr-nv);border-radius:6px;padding:3px 10px;margin:0 0 9px}
.ca-card-title{font-weight:800;font-size:15.5px;line-height:1.55;color:var(--hr-nv);margin:0 0 9px}
.ca-card-desc{font-size:12.5px;color:var(--hr-mute);line-height:1.75;margin:0 0 13px;flex:1}
.ca-card-date{font-size:11.5px;color:var(--hr-mute);font-weight:600}
/* ---------- backlink ---------- */
.ca-backlink{margin:26px 0 10px}
.ca-backlink a{display:inline-flex;align-items:center;gap:8px;color:var(--hr-tl);font-weight:700;text-decoration:none;font-size:14px}
.ca-backlink a::before{content:"←";font-weight:900}
/* ---------- index（一覧トップ） ---------- */
.ca-index-hero{text-align:center;padding:42px 0 6px}
.ca-index-hero .ca-eyebrow{background:none;color:var(--hr-tl);font-family:var(--hr-disp);letter-spacing:.2em;padding:0}
.ca-index-hero .ca-eyebrow::before{content:"";display:inline-block;width:22px;height:2px;background:var(--hr-amb);vertical-align:4px;margin-right:10px}
.ca-index-hero .ca-eyebrow::after{content:"";display:inline-block;width:22px;height:2px;background:var(--hr-amb);vertical-align:4px;margin-left:10px}
.ca-index-title{font-weight:900;font-size:clamp(27px,5vw,42px);line-height:1.26;color:var(--hr-nv);margin:12px 0 12px}
.ca-index-sub{font-size:15px;color:var(--hr-mute);max-width:62ch;margin:0 auto}
.ca-chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;max-width:800px;margin:26px auto 32px}
.ca-chip{font-family:var(--hr-font);font-size:13px;font-weight:700;background:#fff;color:var(--hr-nv);border:1px solid var(--hr-line);border-radius:8px;padding:8px 16px;cursor:pointer}
.ca-chip.is-active{background:var(--hr-nv);color:#fff;border-color:var(--hr-nv)}
.ca-empty{text-align:center;color:var(--hr-mute);padding:40px 0}
@media(max-width:600px){
.ca-card-grid,.ca-index .ca-card-grid{grid-template-columns:1fr}
}
/* =====================================================================
2026-09-16 マガジン型IA（トップ／大テーマ／カテゴリ／新着一覧／検索）
案2「ダイアグラム主導」のトンマナを踏襲。
ネイビー #262B2B × ティール #0D72BA ＋ アンバー #FF8A00
===================================================================== */
/* ── テーマナビ ── */
.ca-mnav{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.ca-mnav a{display:inline-flex;align-items:center;font-family:var(--hr-disp);
font-size:13.5px;font-weight:700;color:#262B2B;text-decoration:none;background:#fff;
border:1px solid #DCE8F6;border-radius:6px;padding:9px 15px;transition:border-color .15s,color .15s}
.ca-mnav a:hover{border-color:#0D72BA;color:#0D72BA}
.ca-mnav a.is-on{background:#262B2B;border-color:#262B2B;color:#fff}
/* ── 検索 ── */
.ca-search{position:relative;margin:0 0 26px}
.ca-search input{width:100%;box-sizing:border-box;font-family:inherit;font-size:14.5px;color:#262B2B;
background:#fff;border:1px solid #DCE8F6;border-radius:6px;padding:12px 14px 12px 38px;
background-image:url("data:image/svg+xml;utf8,");
background-repeat:no-repeat;background-position:12px center;background-size:17px}
.ca-search input:focus{outline:none;border-color:#0D72BA;box-shadow:0 0 0 3px rgba(46,139,230,.12)}
.ca-search-res{position:absolute;z-index:30;left:0;right:0;top:calc(100% + 6px);background:#fff;
border:1px solid #DCE8F6;border-radius:8px;box-shadow:0 18px 40px -26px rgba(11,34,56,.5);
max-height:60vh;overflow:auto;padding:6px}
.ca-search-msg{margin:0;padding:9px 11px;font-size:12.5px;color:#6B7978}
.ca-search-i{display:block;padding:10px 11px;border-radius:6px;text-decoration:none;color:#262B2B}
.ca-search-i:hover{background:#F3F8FE}
.ca-search-i .c{display:block;font-size:11px;font-weight:700;color:#0D72BA;letter-spacing:.02em}
.ca-search-i .t{display:block;font-size:13.5px;font-weight:700;line-height:1.5;margin-top:2px}
/* ── 一覧ページの見出し ── */
.ca-cat-hero{border-top:3px solid #0D72BA;padding-top:22px}
.ca-count{display:inline-block;margin-left:10px;font-size:12px;font-weight:700;color:#0D72BA;
background:#EAF3FC;border-radius:4px;padding:3px 9px;white-space:nowrap}
/* ── トップ：ピックアップ＋まず押さえたい3本 ── */
.ca-toprow{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:20px;margin:0 0 34px}
.ca-feat{display:block;text-decoration:none;color:inherit;background:#fff;border:1px solid #DCE8F6;
border-radius:10px;overflow:hidden;position:relative;transition:border-color .15s,box-shadow .15s}
.ca-feat:hover{border-color:#0D72BA;box-shadow:0 20px 44px -30px rgba(11,34,56,.55)}
.ca-feat-tape{position:absolute;top:0;left:0;z-index:2;font-family:var(--hr-disp);
font-size:11px;font-weight:800;letter-spacing:.06em;color:#fff;background:#262B2B;padding:6px 14px;border-radius:0 0 8px 0}
.ca-feat-thumb{display:block;background:#F3F8FE}
.ca-feat-thumb img{display:block;width:100%;height:auto}
.ca-feat-body{display:block;padding:16px 18px 18px}
.ca-feat-cat{display:inline-block;font-size:11.5px;font-weight:700;color:#0D72BA;letter-spacing:.02em}
.ca-feat-title{display:block;font-family:var(--hr-disp);font-size:19px;
font-weight:900;line-height:1.5;color:#262B2B;margin:5px 0 0;text-wrap:balance}
.ca-feat-desc{display:block;font-size:13px;line-height:1.85;color:#566463;margin:8px 0 0}
.ca-feat-date{display:block;font-size:11.5px;color:#8E9A99;margin:10px 0 0}
.ca-starters{display:flex;flex-direction:column;gap:9px;min-width:0}
.ca-block-h{margin:0 0 3px;font-family:var(--hr-disp);font-size:13px;
font-weight:900;color:#262B2B;padding-left:11px;border-left:3px solid #FF8A00}
.ca-mini{display:flex;gap:11px;align-items:center;text-decoration:none;color:inherit;background:#fff;
border:1px solid #DCE8F6;border-radius:8px;padding:9px;transition:border-color .15s}
.ca-mini:hover{border-color:#0D72BA}
.ca-mini-thumb{flex:0 0 76px;border-radius:5px;overflow:hidden;background:#F3F8FE}
.ca-mini-thumb img{display:block;width:100%;height:auto}
.ca-mini-body{min-width:0}
.ca-mini-cat{display:block;font-size:10.5px;font-weight:700;color:#0D72BA}
.ca-mini-title{display:block;font-size:13px;font-weight:700;line-height:1.55;color:#262B2B;margin-top:2px}
/* ── 大テーマのセクション ── */
.ca-gsec{margin:0 0 38px;padding-top:18px;border-top:2px solid var(--gc,#262B2B)}
.ca-gsec-h{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:0 0 14px}
.ca-gsec-n{display:block;font-family:var(--hr-disp);font-size:19px;
font-weight:900;color:var(--gc,#262B2B);line-height:1.4}
.ca-gsec-s{display:block;font-size:12.5px;color:#6B7978;margin-top:3px}
.ca-gsec-more{font-size:13px;font-weight:700;color:var(--gc,#262B2B);text-decoration:none;white-space:nowrap}
.ca-gsec-more:hover{text-decoration:underline}
.ca-subchips{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin:0 0 14px}
.ca-subchips-l{font-size:12px;font-weight:700;color:#8E9A99}
.ca-subchip{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;font-weight:700;color:#262B2B;
text-decoration:none;background:#F3F8FE;border:1px solid #DCE8F6;border-radius:999px;padding:5px 12px}
.ca-subchip:hover{border-color:#0D72BA;color:#0D72BA}
.ca-subchip b{font-family:var(--hr-disp);font-size:11.5px;color:#0D72BA}
/* ── ページ送り ── */
.ca-pager{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px;margin:30px 0 8px}
.ca-pg,.ca-pg-nav{display:inline-flex;align-items:center;justify-content:center;min-width:38px;height:38px;
padding:0 11px;font-family:var(--hr-disp);font-size:13.5px;font-weight:700;
color:#262B2B;text-decoration:none;background:#fff;border:1px solid #DCE8F6;border-radius:6px}
.ca-pg:hover,.ca-pg-nav:hover{border-color:#0D72BA;color:#0D72BA}
.ca-pg.is-on{background:#262B2B;border-color:#262B2B;color:#fff}
.ca-pg-gap{color:#A8B6C6;padding:0 2px}
.ca-pager-note{text-align:center;font-size:12px;color:#8E9A99;margin:0 0 6px}
/* ── 記事末尾の導線 ── */
.ca-morelinks{display:flex;flex-wrap:wrap;gap:9px;margin:26px 0 0}
.ca-morelink{display:inline-flex;align-items:center;font-size:13.5px;font-weight:700;color:#262B2B;
text-decoration:none;background:#fff;border:1px solid #DCE8F6;border-radius:6px;padding:10px 15px}
.ca-morelink:hover{border-color:#0D72BA;color:#0D72BA}
/* ── よく読まれている記事（popular.csv を置いたときだけ表示） ── */
.ca-ranklist{display:grid;gap:9px}
.ca-rank-i{display:flex;gap:12px;align-items:center;counter-increment:carank;text-decoration:none;color:inherit;
background:#fff;border:1px solid #DCE8F6;border-radius:8px;padding:10px;position:relative}
.ca-rank-i:hover{border-color:#0D72BA}
.ca-rank-i::before{content:counter(carank);flex:0 0 26px;text-align:center;font-family:var(--hr-disp);
font-size:15px;font-weight:800;color:#FF8A00}
.ca-ranklist{counter-reset:carank}
.ca-rank-th{flex:0 0 84px;border-radius:5px;overflow:hidden;background:#F3F8FE}
.ca-rank-th img{display:block;width:100%;height:auto}
.ca-rank-b{min-width:0}
.ca-rank-cat{display:block;font-size:10.5px;font-weight:700;color:#0D72BA}
.ca-rank-t{display:block;font-size:13.5px;font-weight:700;line-height:1.55;color:#262B2B;margin-top:2px}
/* ── 特集（$CARYAKA_SERIES を設定したときだけ表示） ── */
.ca-scards{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.ca-scard{display:block;text-decoration:none;color:inherit;background:#fff;border:1px solid #DCE8F6;
border-left:4px solid var(--sc,#0D72BA);border-radius:8px;padding:14px 16px}
.ca-scard:hover{border-color:#0D72BA;border-left-color:var(--sc,#0D72BA)}
.ca-scard-kicker{display:block;font-family:var(--hr-disp);font-size:10.5px;font-weight:800;
letter-spacing:.08em;color:var(--sc,#0D72BA)}
.ca-scard-title{display:block;font-family:var(--hr-disp);font-size:15px;
font-weight:900;line-height:1.5;color:#262B2B;margin:5px 0 0}
.ca-scard-lead{display:block;font-size:12.5px;line-height:1.8;color:#566463;margin:6px 0 0}
.ca-scard-n{display:inline-block;font-family:var(--hr-disp);font-size:11.5px;font-weight:700;
color:#0D72BA;margin-top:8px}
.ca-series-hero{border-top:3px solid #FF8A00;padding-top:22px}
/* ── スマホ ── */
@media (max-width:760px){
.ca-toprow{grid-template-columns:1fr;gap:16px;margin-bottom:26px}
.ca-feat-title{font-size:17px}
.ca-gsec{margin-bottom:30px}
.ca-gsec-n{font-size:17px}
.ca-gsec-h{align-items:flex-start}
.ca-mnav{gap:6px}
.ca-mnav a{font-size:12.5px;padding:8px 12px}
.ca-count{display:block;margin:8px 0 0}
.ca-scards{grid-template-columns:1fr}
.ca-rank-th{flex-basis:66px}
.ca-morelinks{flex-direction:column}
.ca-morelink{justify-content:center}
}
/* =============================================================
★ 2026-10-19 LP（/corporate/）のトンマナに合わせる上書き
============================================================= */
:root{--tq:#2E8BE6;--tq2:#4FA6F2;--tqd:#0D72BA;--tqdd:#095D98;--tql:#EAF3FC;--ink:#262B2B;--sub:#566463;--mute:#7C8786;
--or1:#FFA10A;--or2:#FF6400;--mark:rgba(255,170,90,.45)}
html{scroll-padding-top:90px}
body{background:#F3F8FE;color:var(--ink);font-family:var(--hr-font);line-height:1.9;margin:0;-webkit-font-smoothing:antialiased}
body *{box-sizing:border-box}
.ca-article,.ca-index{padding-top:6px}
/* 見出しは LP と同じ丸ゴシック */
.ca-title,.ca-index-title,.ca-body .ca-h2,.ca-takeaways .ca-h2,.ca-faq .ca-h2,.ca-related .ca-h2,.ca-card-title,.ca-feat-title,.ca-mini-title,
.ca-gsec-n,.ca-block-h,.ca-cta-lead,.ca-toc-ttl,.ca-scard-title,.ca-rank-t,.ca-mnav a,.ca-faq-q,.ca-sup-name{font-family:var(--hr-disp);letter-spacing:.04em}
.ca-title{font-weight:900;color:var(--ink);line-height:1.45}
.ca-index-title{font-weight:900}
/* パンくず・ラベル */
.ca-breadcrumb a:hover{color:var(--tqd)}
.ca-eyebrow{background:var(--tql);color:var(--tqdd);font-family:var(--hr-disp);font-weight:800;border-radius:999px}
.ca-eyebrow::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--tq)}
.ca-cat-badge,.ca-card-cat,.ca-feat-cat,.ca-mini-cat,.ca-rank-cat{background:var(--tq)!important;color:#fff!important;border-radius:999px!important;font-family:var(--hr-disp);font-weight:800}
.ca-mini-cat,.ca-rank-cat{background:none!important;color:var(--tqd)!important;padding:0!important}
/* 一覧の最初の帯（LP の最初の画面と同じターコイズ） */
.ca-index-hero{position:relative;overflow:hidden;background:var(--tq);color:#fff;border-radius:28px;padding:clamp(34px,5vw,56px) clamp(20px,4vw,48px);margin:10px 0 26px;border:0;box-shadow:none}
.ca-index-hero::before{content:"";position:absolute;left:-12%;top:-40%;width:62%;height:150%;background:var(--tq2);transform:rotate(-14deg);opacity:.75;pointer-events:none}
.ca-index-hero::after{content:"";position:absolute;right:-8%;bottom:-55%;width:48%;height:120%;background:#1F78D1;transform:rotate(18deg);opacity:.55;pointer-events:none}
.ca-index-hero>*{position:relative;z-index:1}
.ca-index-hero .ca-eyebrow{background:rgba(255,255,255,.95);color:var(--tqdd)}
.ca-index-hero .ca-eyebrow::before{background:var(--or2);width:7px;height:7px;border-radius:50%;vertical-align:1px;margin-right:2px}
.ca-index-hero .ca-eyebrow::after{display:none}
.ca-index-title{color:#fff;text-shadow:0 3px 0 rgba(5,62,128,.18)}
.ca-index-sub{color:rgba(255,255,255,.95)}
.ca-index-hero .ca-count{background:#fff;color:var(--tqdd);border-radius:999px;padding:2px 12px;font-weight:800}
.ca-cat-hero,.ca-series-hero{background:var(--tq)}
/* テーマのナビ・検索 */
.ca-mnav a{border-radius:999px;border:2px solid #CDDFF4;background:#fff;color:var(--ink);font-weight:800}
.ca-mnav a:hover{border-color:var(--tq);color:var(--tqd)}
.ca-mnav a.is-on{background:var(--tq);border-color:var(--tq);color:#fff}
.ca-search input{border-radius:999px;border:2px solid #CDDFF4;background-color:#fff;padding-left:46px;background-position:18px center}
.ca-search input:focus{border-color:var(--tq);outline:0;box-shadow:0 0 0 4px rgba(46,139,230,.18)}
.ca-subchip,.ca-chip{border-radius:999px}
.ca-subchip b{color:var(--tqd)}
/* カード（LP と同じ白・角丸・やわらかい影） */
.ca-card,.ca-feat,.ca-mini,.ca-rank-i,.ca-scard{background:#fff;border:0!important;border-radius:22px!important;box-shadow:0 16px 32px -22px rgba(5,48,100,.45);transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s}
.ca-card:hover,.ca-feat:hover,.ca-mini:hover,.ca-rank-i:hover,.ca-scard:hover{transform:translateY(-3px);box-shadow:0 22px 36px -20px rgba(5,48,100,.5)}
.ca-card-thumb,.ca-feat-thumb,.ca-mini-thumb,.ca-rank-th{background:var(--tql)}
.ca-card-title,.ca-feat-title{color:var(--ink);font-weight:800}
.ca-feat-tape{background:linear-gradient(90deg,var(--or1),var(--or2))!important;color:#fff!important;border-radius:999px!important;font-family:var(--hr-disp)}
/* テーマごとの区切り（色は LP のターコイズ系とオレンジ） */
.ca-gsec{--gc:var(--tq)!important;border-top:0!important;background:#fff;border-radius:28px;padding:26px clamp(16px,3vw,30px) 30px;margin-top:28px;box-shadow:0 16px 32px -26px rgba(5,48,100,.4)}
.ca-gsec:nth-of-type(2){--gc:var(--tqd)!important}
.ca-gsec:nth-of-type(3){--gc:#FF8A00!important}
.ca-gsec:nth-of-type(4){--gc:var(--tqdd)!important}
.ca-gsec-n{color:var(--ink)!important;font-weight:900;display:inline-flex;align-items:center;gap:10px}
.ca-gsec-n::before{content:"";width:12px;height:12px;border-radius:50%;background:var(--gc);flex:none}
.ca-gsec-more,.ca-morelink{color:var(--tqd)!important;font-family:var(--hr-disp);font-weight:800}
.ca-morelink{border-radius:999px!important;border:2px solid var(--tq)!important;background:#fff!important}
.ca-morelink:hover{background:var(--tql)!important}
.ca-block-h{border-left-color:var(--or2)!important;color:var(--ink)!important}
.ca-pg.is-on{background:var(--tq)!important;border-color:var(--tq)!important;color:#fff!important}
.ca-pg,.ca-pg-nav{border-radius:999px!important}
/* 記事 */
.ca-hero{border:0;border-radius:24px;box-shadow:0 16px 32px -24px rgba(5,48,100,.45)}
.ca-hero::before{background:linear-gradient(90deg,var(--tq),var(--tq2))}
.ca-meta-sup{border-left-color:var(--tq)}
.ca-lead{border:0;border-left:5px solid var(--tq);border-radius:0 18px 18px 0;box-shadow:0 12px 26px -22px rgba(5,48,100,.4)}
.ca-lead strong,.ca-body strong{background:linear-gradient(transparent 62%,var(--mark) 62%);color:inherit;font-weight:700;padding:0 .1em}
.ca-toc{border:0;border-radius:22px;box-shadow:0 12px 26px -22px rgba(5,48,100,.4)}
.ca-toc-ttl::before{background:var(--tq);border-radius:50%}
.ca-toc-list a:hover{color:var(--tqd)}
.ca-body .ca-h2{color:var(--ink);font-weight:900}
.ca-body .ca-h2::before{background:var(--tq)!important;color:#fff!important;border-radius:50%!important}
.ca-takeaways{background:var(--tql)!important;color:var(--ink)!important;border:2px solid #C4DDF7!important;border-radius:24px!important}
.ca-takeaways .ca-h2{color:var(--ink)!important}
.ca-takeaways li{color:var(--ink)!important;border-color:#CDDFF4!important}
.ca-takeaways li::before{background:var(--tq)!important;color:#fff!important}
.ca-faq-item{border-radius:18px}
.ca-faq-q::before{background:var(--tq)!important;border-radius:50%!important}
.ca-faq-a::before{background:linear-gradient(90deg,var(--or1),var(--or2))!important;border-radius:50%!important}
.ca-supervisor-box{border:0;border-radius:22px;box-shadow:0 12px 26px -22px rgba(5,48,100,.4)}
.ca-sup-icon{background:var(--tq)!important;border-radius:50%!important}
/* 最後の案内（LP の最後の帯と同じターコイズ＋オレンジのボタン） */
.ca-cta{position:relative;overflow:hidden;background:var(--tq)!important;border-radius:28px!important;color:#fff;padding:clamp(34px,5vw,52px) clamp(20px,4vw,44px)!important;margin:40px 0!important;text-align:center;border:0!important}
.ca-cta::before{content:"";position:absolute;left:-14%;top:-30%;width:70%;height:90%;background:var(--tq2);transform:rotate(-12deg);pointer-events:none}
.ca-cta::after{display:none!important}
.ca-cta-inner{position:relative;z-index:1}
.ca-cta-lead{color:#fff!important;font-weight:900;font-size:clamp(20px,2.6vw,27px)!important;line-height:1.55;text-shadow:0 3px 0 rgba(5,62,128,.18)}
.ca-cta-sub{color:rgba(255,255,255,.96)!important;max-width:640px;margin-left:auto!important;margin-right:auto!important}
.ca-cta-btns{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:22px}
.ca-cta-btns .btn{min-width:230px}
.ca-cta-btns .btn-trial{background:#fff}
.ca-cta-btn{background:linear-gradient(90deg,var(--or1),var(--or2))!important;border-radius:999px!important;color:#fff!important}
/* 本文の中の企業向け導線（テンプレートの style をそのまま活かす） */
.ca-svclink a{color:var(--tqd)!important}
@media (max-width:760px){ .ca-index-hero .ca-count{display:inline-block;margin:10px 0 0} }
/* LP のヘッダー（固定）の下で、見出しへのジャンプが隠れないように */
[id]{scroll-margin-top:90px}
@media (max-width:1023px){ body{padding-bottom:76px} }
@media (max-width:600px){
.ca-index-hero{border-radius:22px}
.ca-gsec{border-radius:22px;padding:20px 14px 22px}
.ca-cta{border-radius:22px!important}
.ca-cta-btns .btn{min-width:0;width:100%}
}
/* =============================================================
★ 2026-10-19 トップのイラスト（LP と同じ人物イラスト）
============================================================= */
.ca-index-hero.has-ill{display:grid;grid-template-columns:minmax(0,230px) minmax(0,1fr) minmax(0,230px);align-items:center;gap:10px;text-align:center}
.ca-hero-ill{position:relative;z-index:1;display:block;width:100%;height:auto;background:#fff;border-radius:50%;padding:14px;box-shadow:0 18px 30px -18px rgba(5,50,105,.55)}
.ca-hero-ill-l{border-radius:28px;padding:16px 10px;transform:rotate(-4deg)}
.ca-hero-ill-r{transform:rotate(3deg)}
.ca-hero-txt{position:relative;z-index:1;min-width:0}
/* テーマから探す */
.ca-themes{margin:34px 0 6px}
.ca-themes-h{display:flex;flex-direction:column;align-items:center;gap:2px;font-family:var(--hr-disp);font-weight:900;font-size:clamp(22px,2.6vw,28px);letter-spacing:.06em;color:var(--ink);margin:0 0 18px;text-align:center}
.ca-themes-en{font-size:13px;font-weight:800;letter-spacing:.24em;color:#8E9A99}
.ca-tcards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.ca-tcard{display:flex;flex-direction:column;align-items:center;text-align:center;background:#fff;border-radius:24px;padding:18px 16px 20px;text-decoration:none;color:var(--ink);
box-shadow:0 16px 32px -24px rgba(5,48,100,.45);transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s}
.ca-tcard:hover{transform:translateY(-4px);box-shadow:0 22px 36px -20px rgba(5,48,100,.5)}
.ca-tcard-ill{width:78%;max-width:170px;height:auto;aspect-ratio:1;object-fit:contain;background:var(--tql);border-radius:50%;padding:8px;margin-bottom:12px}
.ca-tcard-b{display:flex;flex-direction:column;gap:4px}
.ca-tcard-n{font-family:var(--hr-disp);font-weight:900;font-size:17px;letter-spacing:.04em;line-height:1.45}
.ca-tcard-s{font-size:12.5px;color:var(--sub);line-height:1.6}
.ca-tcard-c{margin-top:6px;font-family:var(--hr-disp);font-weight:800;font-size:13px;color:var(--tqd)}
/* テーマの区切りの見出しイラスト */
.ca-gsec-h{align-items:center!important}
.ca-gsec-ill{flex:none;width:84px;height:84px;object-fit:contain;background:var(--tql);border-radius:50%;padding:4px;margin-right:14px}
.ca-gsec-h>div{flex:1;min-width:0}
/* まず押さえたい3本 */
.ca-block-h{display:flex!important;align-items:center;gap:8px}
.ca-block-ill{width:44px;height:44px;object-fit:contain;background:var(--tql);border-radius:50%;padding:2px;flex:none}
/* 最後の案内 */
.ca-cta-ill{position:absolute;z-index:1;right:clamp(10px,3vw,34px);bottom:0;width:clamp(120px,15vw,170px);height:auto;filter:drop-shadow(0 10px 16px rgba(5,50,105,.25));pointer-events:none}
.ca-index .ca-cta-inner{padding-right:clamp(0px,12vw,150px)}
@media (max-width:900px){
.ca-index-hero.has-ill{grid-template-columns:minmax(0,1fr)}
.ca-hero-ill-l{display:none}
.ca-hero-ill-r{order:-1;width:132px;margin:0 auto 4px;padding:8px}
.ca-tcards{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
}
@media (max-width:600px){
.ca-tcard{padding:14px 10px 16px;border-radius:20px}
.ca-tcard-n{font-size:15px}
.ca-tcard-s{display:none}
.ca-gsec-ill{width:60px;height:60px;margin-right:10px}
.ca-cta-ill{position:static;display:block;margin:-6px auto 6px;width:120px}
.ca-index .ca-cta-inner{padding-right:0}
}
.ca-index-title,.ca-tcard-n,.ca-gsec-n,.ca-cta-lead,.ca-themes-h{word-break:keep-all;overflow-wrap:anywhere}
@media (max-width:600px){
.ca-gsec-h{flex-wrap:wrap!important}
.ca-gsec-h>div{flex:1 1 0}
.ca-gsec-more{flex-basis:100%;text-align:right;margin-top:8px}
.ca-tcard-n{font-size:14px;letter-spacing:.02em}
}