/* CC 講座 サブスク版 公開ページ 共通スタイル（2026-10-07）
   色・ロゴ・ヘッダー・フッターは cc.vcfactory.jp（static/cc-course/index.html）と同じ顔。
   フォントは 3 サイト統一の指定（見出し Zen Kaku Gothic New / 本文 BIZ UDPGothic / 数字 JetBrains Mono）。 */
:root{
  --bg-base:#F4F7FB; --bg-section:#FFFFFF; --bg-card:#FFFFFF; --bg-tint:#E8EFFA;
  --border:#DBE3EE; --text:#0E1B2E; --text-sub:#647084;
  --primary:#1D4ED8; --primary-d:#1E3A8A; --accent:#D97757; --accent-d:#B85F42;
  --mark:#BFDBFE; --success:#12A150;
  --font-head:'Zen Kaku Gothic New','Hiragino Sans','Yu Gothic',Meiryo,sans-serif;
  --font-body:'BIZ UDPGothic','Hiragino Sans','Yu Gothic',Meiryo,sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,Menlo,Consolas,monospace;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--bg-base);color:var(--text);font-family:var(--font-body);font-size:16px;line-height:1.85;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:var(--primary);text-decoration:none}
h1,h2,h3,h4{font-family:var(--font-head);line-height:1.3;font-weight:700;letter-spacing:.01em}
.container{max-width:1140px;margin:0 auto;padding:0 24px}
.sec{padding:104px 0}
.sec-alt{background:var(--bg-section)}
.mono{font-family:var(--font-mono);font-weight:700;letter-spacing:.02em}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-mono);font-size:12px;font-weight:700;letter-spacing:.14em;color:var(--primary);text-transform:uppercase}
.eyebrow::before{content:'';width:28px;height:2px;background:var(--accent)}
.h2{font-size:clamp(26px,3.4vw,40px);line-height:1.28;margin:14px 0 20px}
.h2 .br{display:block}
.lead{font-size:17px;color:var(--text-sub);max-width:34em}
.mk{background:linear-gradient(transparent 62%,var(--mark) 62%)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:56px;padding:0 30px;font-family:var(--font-head);font-weight:700;font-size:16px;border-radius:2px;transition:filter .2s,transform .2s;white-space:nowrap}
.btn-primary{background:var(--accent);color:#fff}
.btn-primary:hover{filter:brightness(.9);transform:translateY(-1px)}
.btn-ghost{border:1.5px solid var(--text);color:var(--text);background:transparent}
.btn-ghost:hover{background:var(--text);color:#fff}
.photo{position:relative;overflow:hidden;border-radius:2px;background:var(--bg-tint)}
.photo img{width:100%;height:100%;object-fit:cover}
.photo.r45{aspect-ratio:4/5}.photo.r11{aspect-ratio:1/1}.photo.r43{aspect-ratio:4/3}.photo.r32{aspect-ratio:3/2}
.cap{font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;color:var(--text-sub);margin-top:10px}
.note{font-size:12.5px;color:var(--text-sub);line-height:1.8}

/* ---- 共通ヘッダー（cc-course と同一） ---- */
.uah-skip{position:absolute;left:12px;top:-60px;z-index:10001;background:#1a1a1a;color:#fff;padding:8px 14px;font-size:13px;text-decoration:none}
.uah-skip:focus{top:8px}
.uah{position:sticky;top:0;z-index:10000;border-top:3px solid var(--uah-accent);font-family:'Noto Sans JP',var(--font-body),sans-serif;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.uah--light{background:rgba(255,255,255,.97);border-bottom:1px solid #E6E2DC;--uah-fg:#3d3d3d;--uah-fg-strong:#1a1a1a;--uah-panel:#fff;--uah-line:#F0EDE8}
.uah--dark{background:rgba(10,10,10,.94);border-bottom:1px solid rgba(255,255,255,.08);--uah-fg:rgba(255,255,255,.72);--uah-fg-strong:#fff;--uah-panel:#111;--uah-line:rgba(255,255,255,.08)}
.uah{padding:0!important;margin:0!important;height:auto!important;max-width:none!important;display:block!important;box-shadow:none}
.uah *{box-sizing:border-box}
.uah-in{max-width:1200px;margin:0 auto;height:68px;padding:0 32px;display:flex;align-items:center;gap:32px}
.uah-logo{display:block;flex-shrink:0;line-height:0;text-decoration:none!important}
.uah-logo img{height:44px;width:auto;display:block}
.uah-nav{flex:1;display:flex;justify-content:center}
.uah-list{display:flex;gap:4px;list-style:none;margin:0;padding:0}
.uah-list li{margin:0;padding:0;list-style:none}
.uah-list a{position:relative;display:block;padding:10px 14px;font-size:14px;font-weight:500;color:var(--uah-fg);text-decoration:none;letter-spacing:.04em;white-space:nowrap}
.uah-list a::after{content:'';position:absolute;left:14px;right:14px;bottom:2px;height:2px;background:var(--uah-accent);transform:scaleX(0);transform-origin:left;transition:transform .25s ease}
.uah-list a:hover{color:var(--uah-fg-strong)}
.uah-list a:hover::after,.uah-list a[aria-current="page"]::after{transform:scaleX(1)}
.uah-list a[aria-current="page"]{color:var(--uah-fg-strong);font-weight:700}
.uah-login-sp{display:none!important}
.uah-actions{display:flex;align-items:center;gap:18px;flex-shrink:0;margin-left:auto}
.uah-login{font-size:13px;color:var(--uah-fg);text-decoration:none;white-space:nowrap}
.uah-login:hover{color:var(--uah-fg-strong);text-decoration:underline}
.uah-cta{display:inline-flex;align-items:center;height:40px;padding:0 20px;background:var(--uah-accent);color:#fff!important;font-size:14px;font-weight:700;text-decoration:none;border-radius:2px;white-space:nowrap;transition:filter .2s}
.uah-cta:hover{filter:brightness(.88)}
.uah-toggle{display:none;width:40px;height:40px;position:relative;background:none;border:none;padding:0;cursor:pointer}
.uah-toggle span{position:absolute;left:9px;width:22px;height:2px;background:var(--uah-fg-strong);transition:transform .25s,opacity .25s}
.uah-toggle span:nth-child(1){top:13px}.uah-toggle span:nth-child(2){top:19px}.uah-toggle span:nth-child(3){top:25px}
.uah-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.uah-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.uah-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.uah a:focus-visible,.uah button:focus-visible{outline:2px solid var(--uah-accent);outline-offset:2px}
@media (max-width:960px){
  .uah-in{padding:0 16px;gap:12px;height:60px}
  .uah-logo img{height:34px}
  .uah-nav{position:absolute;top:100%;left:0;right:0;display:none;background:var(--uah-panel);box-shadow:0 12px 24px rgba(0,0,0,.12)}
  .uah-nav.is-open{display:block}
  .uah-list{flex-direction:column;gap:0;padding:8px 16px 16px}
  .uah-list a{padding:14px 4px;font-size:16px;border-bottom:1px solid var(--uah-line)}
  .uah-list a::after{display:none}
  .uah-list a[aria-current="page"]{color:var(--uah-accent)}
  .uah-login-sp{display:block!important}
  .uah-login{display:none}
  .uah-actions{gap:8px}
  .uah-cta{height:36px;padding:0 14px;font-size:13px}
  .uah-toggle{display:block}
}

/* ---- 共通フッター（cc-course と同一） ---- */
.uaf{background:#F5F2ED;color:#3d3d3d;border-top:1px solid #E6E2DC;font-family:'Noto Sans JP',var(--font-body),sans-serif;margin:0;text-align:left}
.uaf *{box-sizing:border-box}
.uaf-in{max-width:1200px;margin:0 auto;padding:56px 32px 28px}
.uaf-cols{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:40px;padding-bottom:40px;border-bottom:1px solid #DDD7CE}
.uaf-h{font-size:13px;font-weight:700;color:#1a1a1a;letter-spacing:.08em;margin:0 0 14px;padding-left:10px;border-left:3px solid var(--uaf-accent);line-height:1.3}
.uaf ul{list-style:none;margin:0;padding:0}
.uaf li{margin:0;padding:0;list-style:none}
.uaf-col a{display:block;padding:5px 0;font-size:13px;line-height:1.6;color:#4a4a4a;text-decoration:none}
.uaf-col a:hover{color:var(--uaf-accent);text-decoration:underline}
.uaf-col a span{display:block;font-size:11px;color:#8a8580}
.uaf-note{margin:24px 0 0;font-size:11px;line-height:1.8;color:#6b6560}
.uaf-copy{margin:0;padding-top:24px;font-size:11px;color:#8a8580}
@media (max-width:768px){.uaf-in{padding:40px 16px 24px}.uaf-cols{grid-template-columns:1fr;gap:28px}}

/* ---- 法務ページ（利用規約・特商法・プライバシー） ---- */
.legal-head{padding:72px 0 40px;border-bottom:1px solid var(--border);background:var(--bg-section)}
.legal-head h1{font-size:clamp(28px,3.6vw,42px);margin:12px 0 10px}
.legal-head .meta{font-family:var(--font-mono);font-size:12px;color:var(--text-sub);letter-spacing:.06em}
.legal-grid{display:grid;grid-template-columns:260px 1fr;gap:64px;padding:64px 0 112px;align-items:start}
.toc{position:sticky;top:92px;border-left:2px solid var(--border);padding-left:18px}
.toc p{font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;color:var(--text-sub);margin-bottom:10px}
.toc a{display:block;font-size:13px;color:var(--text-sub);padding:5px 0;line-height:1.5}
.toc a:hover{color:var(--primary)}
.legal-body{max-width:760px}
.legal-body h2{font-size:20px;margin:48px 0 14px;padding-top:10px;border-top:1px solid var(--border)}
.legal-body h2:first-of-type{margin-top:0;border-top:0;padding-top:0}
.legal-body p,.legal-body li{font-size:15.5px;line-height:1.95}
.legal-body ol{padding-left:1.6em;margin:6px 0 10px}
.legal-body ul{padding-left:1.3em;margin:6px 0 10px}
.legal-body li{margin:4px 0}
.legal-body .intro{color:var(--text-sub);margin-bottom:28px}
.legal-body .sign{margin-top:48px;padding-top:20px;border-top:1px solid var(--border);font-size:14px;color:var(--text-sub)}
dl.spec{border-top:1px solid var(--border)}
dl.spec > div{display:grid;grid-template-columns:220px 1fr;gap:20px;padding:18px 0;border-bottom:1px solid var(--border)}
dl.spec dt{font-weight:700;font-size:14.5px;color:var(--text)}
dl.spec dd{font-size:15px;line-height:1.9}
dl.spec dd ul{padding-left:1.2em;margin:4px 0}
.callout{background:var(--bg-tint);border-left:4px solid var(--primary);padding:16px 20px;margin:22px 0;font-size:14.5px;line-height:1.85}
.price-chip{display:inline-block;font-family:var(--font-mono);font-weight:700;background:#fff;border:1px solid var(--border);padding:2px 8px;border-radius:2px}
@media (max-width:900px){
  .legal-grid{grid-template-columns:1fr;gap:28px;padding:40px 0 80px}
  .toc{position:static;border-left:0;padding-left:0;display:flex;flex-wrap:wrap;gap:6px 14px}
  .toc p{width:100%}
  dl.spec > div{grid-template-columns:1fr;gap:4px;padding:14px 0}
  .sec{padding:72px 0}
}
.uah-wordmark{display:block;font-weight:900;font-size:18px;letter-spacing:.04em;color:var(--uah-fg-strong);line-height:44px;white-space:nowrap}
@media (max-width:960px){.uah-wordmark{font-size:16px;line-height:34px}}
