/* 写し元: デモ company_alumnus.html の style タグをそのまま（scripts/sync_theme_css.py が書く。手で直さない） */
/* 2026-09-23 取材記事型に作り替え（正本: ../../設計_個社ページ_取材記事型_20260923.md）。
   09-22の横スクロールのパネルは廃止し、縦1ページ＋上部固定のページ内移動メニューにした。戻し: _戻し_取材記事型前_20260923/
   ヘッダー・フッター・配色（PIVOT紫）・「この記事を書いた人」は09-22版から変えていない。相談の導線（CTA）は別途作るので本文には置かない */
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:"Schibsted Grotesk","Noto Sans JP","Hiragino Sans",sans-serif;color:#333333;background:#fff;font-size:16px;line-height:1.5;min-width:1440px}
a{color:inherit;text-decoration:none}
img{display:block}
.wrap{width:1280px;margin:0 auto}
/* ヘッダー（09-22版のまま） */
.head{height:64px;display:flex;align-items:center}
.logo{display:flex;flex-direction:column;justify-content:center;min-width:142px;height:40px;white-space:nowrap;flex:none}
.logo img{display:block;height:28px;width:auto}
.f1 .logo{height:auto}
.f1 .logo img{height:64px}
.nav{margin-left:32px;margin-right:16px;display:flex;gap:20px}
.nav a{font-size:14px;font-weight:700;color:#333333;line-height:18px;white-space:nowrap}
.btn{margin-left:8px;display:inline-flex;align-items:center;justify-content:center;height:40px;padding:0 14px;background:#8447E1;color:#fff;font-size:14px;font-weight:700;border-radius:8px;white-space:nowrap}
.btn.btn2{margin-left:auto;background:#fff;color:#8447E1;border:1.5px solid #8447E1}
.crumb{padding:12px 0 20px;font-size:12px;line-height:15.6px}
.crumb a{color:#8447E1}
.crumb span{margin:0 6px;color:#666666}

/* 読み物の1カラム（写し元: 構成イメージ company-page-concept.png） */
.col{width:880px;margin:0 auto}
.ph{background:#E9EAEE;display:flex;align-items:center;justify-content:center;text-align:center;color:#999999;font-size:12px;line-height:20px;padding:0 24px}

/* 上部: 小見出し → h1 → リード → 記事の情報 → メイン写真 → 基本情報 */
.eyebrow{font-size:14px;line-height:20px;font-weight:700;color:#8447E1;padding-left:10px;border-left:3px solid #8447E1}
.eyebrow a{color:#8447E1}
.eyebrow i{font-style:normal;color:#999999;margin:0 8px}
h1.hl{margin-top:16px;font-size:28px;font-weight:700;line-height:1.4;color:#333333;letter-spacing:.01em}
.lede{margin-top:20px;font-size:16px;line-height:1.9;color:#333333}
.meta{margin-top:16px;display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;font-size:12px;line-height:20px;color:#666666}
.meta .st{height:22px;border-radius:9999px;padding:0 8px;background:#8447E1;color:#fff;font-size:12px;font-weight:700;line-height:22px}
.meta .disc{height:22px;border:1px dashed #999999;border-radius:4px;padding:0 8px;font-size:12px;line-height:20px;color:#999999}
.hero{margin-top:28px}
.hero .ph{width:100%;height:440px;border-radius:8px}
.cap{margin-top:10px;font-size:12px;line-height:18px;color:#666666}
.ph.has{padding:0;overflow:hidden}
.ph.has img{width:100%;height:100%;object-fit:cover;display:block}
.hero .ph.has{height:auto;aspect-ratio:1672/941}   /* アイキャッチは切らずに全体を見せる */
.pop .lg.has{display:flex;align-items:center;justify-content:center;padding:8px;box-sizing:border-box}
.pop .lg.has img{width:100%;height:auto;display:block}
.basic{width:100%;margin-top:24px;border-collapse:collapse;border:1px solid #E5E5E5}
.basic th{width:180px;background:#F6F5FC;text-align:left;font-size:14px;font-weight:700;line-height:22px;padding:12px 16px;border-bottom:1px solid #E5E5E5;vertical-align:top}
.basic td{font-size:14px;line-height:22px;padding:12px 16px;border-bottom:1px solid #E5E5E5}

/* ページ内移動メニュー（上部固定。押すとその節へ移動。中身を隠す切り替えではない） */
.jump{position:sticky;top:64px;z-index:10;margin-top:40px;background:#fff;border-bottom:1px solid #E5E5E5;border-top:1px solid #E5E5E5}
.jump .col{display:flex}
.jump a{flex:1 1 auto;padding:0 12px;white-space:nowrap;height:56px;display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;color:#666666;border-bottom:3px solid transparent;margin-bottom:-1px}
.jump a.on{color:#8447E1;border-bottom-color:#8447E1}
.sec{scroll-margin-top:124px}   /* 固定ヘッダー64px＋ページ内ナビ56px。タップで飛んだとき見出しが帯の下に隠れない */
.sec{scroll-margin-top:72px;padding-top:48px}
#ch1,#strengths{scroll-margin-top:136px}   /* ナビから飛ぶ章（div）は section の padding が無いぶん広めに取る */

/* この記事で聞いたこと（問い＋一行の答え） */
.asked{background:#F6F5FC;border:0;border-radius:8px;padding:20px 24px 22px}
.asked .t{font-size:14px;font-weight:700;line-height:21px;color:#333333}
.asked ol{list-style:none;margin-top:12px;display:grid;grid-template-columns:repeat(3,1fr);gap:0}
.asked li{padding:4px 20px;border-left:1px solid #E5E5E5}
.asked li:first-child{padding-left:0;border-left:0}
.asked li a{display:block}
.asked .n{font-size:20px;font-weight:700;line-height:28px;color:#8447E1}
.asked .q{margin-top:4px;font-size:16px;font-weight:700;line-height:1.55;color:#333333}
.asked .a{margin-top:8px;font-size:14px;line-height:1.7;color:#333333}

/* 前置き・話を聞いた人 */
.intro{margin-top:28px;font-size:16px;line-height:2}
.who{margin-top:24px;display:flex;gap:20px;align-items:center;border:1px solid #E5E5E5;border-radius:8px;padding:18px 22px}
.who .ph{width:84px;height:84px;border-radius:50%;flex:none;padding:0;font-size:12px}
.who .lb{font-size:12px;line-height:18px;color:#666666}
.who .nm{margin-top:2px;font-size:16px;font-weight:700;line-height:26px;color:#333333}
.who .nm small{font-size:12px;font-weight:400;color:#666666;margin-left:6px}
.who .pf{margin-top:4px;font-size:14px;line-height:1.75;color:#333333}

/* 取材の章（ブロックパターン「取材の章」: 番号付きh2 → 社名入りの地の文 → 一問一答） */
.ch{margin-top:56px}
.ch h2{display:flex;gap:16px;align-items:baseline;font-size:24px;font-weight:700;line-height:1.5;color:#333333}
.ch h2 .no{font-size:28px;line-height:1;color:#8447E1;flex:none}
.ch .ground{margin-top:18px;font-size:16px;line-height:2;font-weight:700;color:#333333;padding:14px 18px;background:#F6F5FC;border-left:3px solid #8447E1}
.ch h3.q{margin-top:32px;font-size:16px;font-weight:700;line-height:1.7;color:#333333}
.ch h3.q:before{content:"—— ";color:#8447E1}
.ch p{margin-top:12px;font-size:16px;line-height:2}
.ch p .sp{font-weight:700;color:#333333}
.ch .pull{margin-top:32px;padding-left:16px;border-left:3px solid #8447E1;font-size:18px;font-weight:700;line-height:1.7;color:#333333}   /* 本人の言葉の引用。見出しと区別するため、デザインルール §6 の「引用の左線3px」で引用と分かる形に（10-11） */
.ch figure{margin-top:28px;display:flex;gap:20px;align-items:flex-end}
.ch figure .ph{width:520px;height:292px;border-radius:8px;flex:none}
.ch figcaption{font-size:12px;line-height:1.7;color:#666666}
.ch .more{margin-top:16px;font-size:14px;line-height:22px}
.ch .more a{color:#8447E1;font-weight:700}
.ch p a,.faq dd a{color:#8447E1;text-decoration:underline}

/* 見出し（支援事例・料金・会社情報の節） */
.sh{font-size:24px;font-weight:700;line-height:36px;color:#333333;background:#F6F5FC;padding:4px 8px}
.sh:after{content:none}
.sub{margin-top:14px;font-size:16px;line-height:1.9}

/* 支援事例1本の型（見出し＝依頼主の最初の言葉 → 依頼主 → 状況／やったこと／変化 → 一言） */
.case{margin-top:24px;border:1px solid #E5E5E5;border-radius:8px;padding:24px 28px}
.case .lb{font-size:12px;line-height:18px;color:#666666}
.case h3{margin-top:6px;font-size:20px;font-weight:700;line-height:1.5;color:#333333}
.case .cl{margin-top:8px;display:flex;flex-wrap:wrap;gap:6px}
.case .cl span{height:24px;border-radius:9999px;background:#F6F5FC;padding:0 10px;font-size:12px;line-height:24px}
.case table{width:100%;margin-top:16px;border-collapse:collapse}
.case th{width:112px;text-align:left;vertical-align:top;font-size:14px;font-weight:700;line-height:1.8;color:#8447E1;padding:10px 0;border-top:1px solid #E5E5E5}
.case td{font-size:16px;line-height:1.8;padding:10px 0;border-top:1px solid #E5E5E5}
.case .voice{margin-top:14px;font-size:14px;line-height:1.8;color:#333333;background:#F6F5FC;border-radius:8px;padding:12px 16px}

/* 料金・対応範囲 */
.pt{width:100%;margin-top:20px;border-collapse:collapse;border:1px solid #E5E5E5}
.pt th,.pt td{font-size:14px;line-height:1.7;padding:12px 14px;border-bottom:1px solid #E5E5E5;text-align:left;vertical-align:top}
.pt thead th{background:#F6F5FC;font-weight:700}
.pt tbody th{font-weight:700;white-space:nowrap}
.pt .pr{font-weight:700;color:#333333;white-space:nowrap}
.kv{width:100%;margin-top:16px;border-collapse:collapse}
.kv th{width:180px;text-align:left;font-size:14px;font-weight:700;line-height:1.7;padding:12px 0;border-bottom:1px solid #E5E5E5;vertical-align:top}
.kv td{font-size:14px;line-height:1.7;padding:12px 8px;border-bottom:1px solid #E5E5E5}
.h3s{margin-top:40px;font-size:20px;font-weight:700;line-height:1.5;color:#333333}
.tg{margin-top:14px;display:flex;flex-direction:column;gap:12px}
.tg div{display:flex;gap:16px;align-items:flex-start}
.tg b{width:128px;flex:none;font-size:14px;line-height:28px}
.tg ul{list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.tg li{height:28px;border-radius:9999px;background:#F6F5FC;padding:0 12px;font-size:14px;line-height:28px}
.tg p{font-size:14px;line-height:28px;color:#666666}
.faq{margin-top:12px}
.faq dt{margin-top:20px;font-size:16px;font-weight:700;line-height:1.7;color:#333333}
.faq dt:before{content:"Q. ";color:#8447E1}
.faq dd{margin-top:6px;font-size:16px;line-height:1.9}

/* 会社情報・取材について */
.corow{display:flex;gap:24px;align-items:flex-start;margin-top:16px}
.corow .kv{margin-top:0;flex:1}
.offi{flex:none;width:220px;height:52px;display:flex;align-items:center;justify-content:center;gap:6px;border:1.5px solid #8447E1;border-radius:8px;color:#8447E1;font-size:16px;font-weight:700}
.about{margin-top:40px;font-size:12px;line-height:1.9;color:#666666;border-top:1px solid #E5E5E5;padding-top:16px}
.about .disc{display:inline-block;margin-top:6px;border:1px dashed #999999;border-radius:4px;padding:0 8px;font-size:12px;line-height:20px;color:#999999}

/* この記事を書いた人（article_keiri-daiko.html の .aubox の写し。09-22版のまま） */
.aubox{margin-top:32px;border:1px solid #E5E5E5;border-radius:8px;padding:24px 28px 26px;background:#F6F5FC}
.aubox .ah{font-size:16px;font-weight:700;line-height:24px;color:#333333;padding-bottom:16px;margin-bottom:20px;border-bottom:1px solid #E5E5E5}
.aubox .row{display:flex;gap:12px}
.aubox figure{width:80px;flex:none;margin:0}
.aubox .aph{width:80px;height:80px;border-radius:9999px;display:block}
.aubox .acap{position:relative;bottom:10px;display:flex;flex-direction:column}
.aubox .acap span{display:flex;align-items:center;justify-content:center;height:18px;background:#333333;color:#fff;font-size:12px;font-weight:700;line-height:18px}
.aubox .acap i{display:block;height:2px;background:#8447E1}
.aubox .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px;position:relative;max-height:100px;overflow:hidden}
.aubox.open .tx{max-height:none}
.aubox dl{margin:0}
.aubox dt{font-size:12px;font-weight:700;line-height:18px}
.aubox dd{margin:0;display:flex;align-items:center;gap:8px;font-size:16px;font-weight:700;line-height:24px}
.aubox dd a{color:#999999;font-size:20px;line-height:20px}
.aubox .bd p{margin:0;font-size:12px;line-height:18px}
.aubox .mo{position:absolute;right:0;top:82px;background:#fff;padding-left:2px;font-size:12px;line-height:18px;color:#999999;border:0;cursor:pointer;font-family:inherit}
.aubox.open .mo{display:none}
.aubox .pl{display:inline-flex;align-items:center;gap:4px;margin-top:16px;font-size:12px;line-height:18px;color:#999999}
.kimura-ph{background:#E9EAEE url(../img/editor/kimura.webp) 75.5% 37.5%/190% auto no-repeat}

/* よく見られている・フッター（09-22版のまま） */
.pop{margin-top:80px;background:#F6F5FC;padding:48px 0 80px}
.pop h2{font-size:20px;font-weight:700;line-height:30px}
.pop .grid{display:grid;grid-template-columns:repeat(3,411px);gap:24px;margin-top:24px}
.pop .pi{display:flex;gap:16px;align-items:center;height:80px}
.pop .lg{width:80px;height:80px;border:1px solid #E5E5E5;background:#fff;color:#999999;font-size:12px;line-height:78px;text-align:center;flex:none}
.pop p{font-size:18px;font-weight:700;line-height:27px}
.pop small{font-size:14px;line-height:22px}
footer.site{border-top:1px solid #333333}
.f1{display:flex;justify-content:space-between;padding:24px 0}
.f1 .cols{display:flex;gap:80px}
.f1 h4{font-size:16px;font-weight:700;line-height:24px;margin-bottom:12px}
.f1 .two{display:grid;grid-template-columns:181px 181px;column-gap:8px;row-gap:8px}
.f1 a{font-size:14px;line-height:22px;display:block}
.f1 .one a{margin-bottom:8px}
.f2{height:102px}
.f3{height:102px;text-align:center;padding-top:24px}
.f3 a{font-size:14px;margin:0 12px}
.f3 .cp{font-size:12px;margin-top:12px}

/* === 色だけPIVOT（09-15）=== */
.btn{background:linear-gradient(90deg,#CD1CFA 0%,#1E82BE 100%);color:#fff}
.btn.btn2{background:#fff;color:#8447E1}
/* サイドのCTA枠（2026-09-23 木村さん。プロベルのサイドバナー2枚の写し。中身は後で入れる。スクロールしても付いてくる） */
.sbnr{position:sticky;top:136px;display:flex;flex-direction:column;gap:16px}
.sbnr a{display:flex;align-items:center;justify-content:center;background:#E9EAEE;border-radius:8px;font-size:12px;color:#666666;text-align:center}
.sbnr a{background:none;border-radius:0}
.sbnr img{display:block;width:100%;height:auto}
@media (min-width:768px){
  .cw{position:relative}
  .col{margin:0 0 0 calc(50% - 640px)}
  .cw > .side{position:absolute;top:0;bottom:0;right:calc(50% - 640px);width:352px;padding:0 0 0 16px}
  /* 09-29 木村さん: ページ内移動メニューの帯が画面の横いっぱいで、サイドのバナーの上にかかっていた。PCは帯を読み物の列（880px）の幅にする */
  .jump{width:880px;margin-left:calc(50% - 640px)}
  .jump .col{margin:0}
}
