@charset "UTF-8";
/* =========================================================
   アルファテック 共通スタイル（全ページ共通の chrome）
   個別ページ固有のセクションCSSは各HTMLの <style> 内に残す。
   ここを変更すると全ページに反映される。
   ========================================================= */

/* ===== RESET / TOKENS ===== */
* { margin:0; padding:0; box-sizing:border-box; }
:root {
  --blue:#1d4ed8; --blue-dk:#1e40af; --blue-lt:#eff6ff; --cyan:#38bdf8;
  --gold:#c9a84c; --gold-lt:#f5e9c8; --navy:#0b1e3d; --navy2:#071529;
  --white:#ffffff; --off:#faf9f7;
  --text:#111827; --sub:#4b5563; --muted:#9ca3af; --border:#e5e7eb;
  --font:'Noto Sans JP','Meiryo','メイリオ',sans-serif;
}
html { scroll-behavior:smooth; }
body { font-family:var(--font); color:var(--text); background:var(--white); line-height:1.8; }

/* ===== NAV ===== */
nav { position:fixed; top:0; left:0; right:0; z-index:100; height:64px; background:rgba(255,255,255,0.97); border-bottom:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; padding:0 48px; backdrop-filter:blur(12px); }
.nav-logo { display:flex; align-items:center; gap:10px; text-decoration:none; }
.nav-mark { width:34px; height:34px; border-radius:8px; background:var(--blue); display:flex; align-items:center; justify-content:center; color:#fff; font-size:14px; font-weight:700; transition:transform .2s ease; }
.nav-logo:hover .nav-mark { transform:scale(1.06); }
.nav-name { font-size:15px; font-weight:700; color:var(--text); letter-spacing:.04em; }
.nav-name span { color:var(--blue); }
.nav-logo-img { height:34px; width:auto; display:block; transition:opacity .15s; }
.nav-logo:hover .nav-logo-img { opacity:.8; }
.nav-links { display:flex; gap:32px; list-style:none; margin-left:auto; }
.nav-links a { font-size:15px; color:var(--sub); text-decoration:none; transition:color .15s; }
.nav-links a:hover { color:var(--blue); }
.nav-links a.active { color:var(--navy); font-weight:700; position:relative; }
.nav-links a.active::after { content:''; position:absolute; left:0; right:0; bottom:-6px; height:2px; background:var(--gold); border-radius:2px; }
.nav-toggle { display:none; width:40px; height:40px; background:none; border:none; cursor:pointer; flex-direction:column; justify-content:center; align-items:center; gap:5px; padding:0; }
.nav-toggle span { display:block; width:22px; height:2px; background:var(--text); border-radius:2px; transition:transform .25s, opacity .25s; }
.nav-toggle.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.nav-toggle.open span:nth-child(2) { opacity:0; }
.nav-toggle.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
.nav-cta { font-size:13px; font-weight:700; font-family:var(--font); background:var(--blue); color:#fff; border:none; border-radius:6px; padding:9px 22px; cursor:pointer; text-decoration:none; display:inline-block; transition:background .15s; }
.nav-cta:hover { background:var(--blue-dk); }

/* ===== PAGE HERO（下層ページ共通のヘッダー） ===== */
#page-hero { padding:130px 80px 80px; background:linear-gradient(145deg, var(--navy) 0%, var(--navy2) 100%); position:relative; overflow:hidden; }
.page-hero-inner { position:relative; z-index:1; max-width:1080px; margin:0 auto; }
.page-hero-en { font-size:10px; letter-spacing:.22em; color:rgba(201,168,76,.8); text-transform:uppercase; margin-bottom:14px; }
.page-hero-deco { width:40px; height:2px; background:var(--gold); margin-bottom:20px; }
#page-hero h1 { font-size:40px; font-weight:700; color:#fff; margin-bottom:16px; line-height:1.3; }
#page-hero p { font-size:14px; color:rgba(255,255,255,.7); max-width:520px; line-height:2; }

/* ===== BREADCRUMB ===== */
.breadcrumb { background:var(--off); border-bottom:1px solid var(--border); padding:12px 80px; }
.breadcrumb-inner { max-width:1080px; margin:0 auto; display:flex; gap:8px; align-items:center; }
.breadcrumb a { font-size:12px; color:var(--blue); text-decoration:none; }
.breadcrumb a:hover { text-decoration:underline; }
.breadcrumb span { font-size:12px; color:var(--muted); }
.breadcrumb .sep { color:var(--muted); }

/* ===== SECTION BASE ===== */
.sec { padding:112px 80px; }
.sec-inner { max-width:1080px; margin:0 auto; }
.sec-en { font-size:10px; letter-spacing:.22em; color:var(--gold); text-transform:uppercase; font-weight:700; margin-bottom:10px; }
.sec-deco { width:36px; height:2px; background:var(--gold); margin-bottom:20px; }
.sec-title { font-size:26px; font-weight:700; margin-bottom:14px; line-height:1.4; }
.sec-sub { font-size:13px; color:var(--sub); line-height:2; max-width:560px; }

/* ===== BUTTONS ===== */
.btn-gold { font-size:13px; font-weight:700; font-family:var(--font); background:var(--gold); color:var(--navy2); border:none; border-radius:4px; padding:14px 32px; cursor:pointer; text-decoration:none; display:inline-block; transition:background .2s, transform .15s; }
.btn-gold:hover { background:#d4b060; transform:translateY(-2px); }
.btn-white { font-size:13px; font-weight:700; font-family:var(--font); background:#fff; color:var(--navy2); border:none; border-radius:4px; padding:14px 36px; cursor:pointer; text-decoration:none; display:inline-block; transition:opacity .15s, transform .15s; }
.btn-white:hover { opacity:.9; transform:translateY(-2px); }

/* ===== CTA（共通のお問い合わせ誘導） ===== */
#cta { padding:112px 80px; text-align:center; background:var(--navy2); position:relative; overflow:hidden; }
#cta::after { content:''; position:absolute; bottom:-180px; left:50%; transform:translateX(-50%); width:500px; height:500px; border-radius:50%; background:radial-gradient(circle, rgba(201,168,76,.22) 0%, transparent 68%); pointer-events:none; }
.cta-inner { position:relative; z-index:1; }
.cta-deco { width:40px; height:2px; background:var(--gold); margin:0 auto 24px; }
#cta h2 { font-size:28px; font-weight:700; color:#fff; margin-bottom:14px; }
#cta p { font-size:14px; color:rgba(255,255,255,.65); line-height:2; margin-bottom:36px; }
.cta-btns { display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }

/* ===== FOOTER ===== */
footer { background:#060e1e; padding:32px 80px; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px; }
.foot-links { display:flex; gap:24px; flex-wrap:wrap; }
.foot-links a { font-size:11px; color:rgba(255,255,255,.38); text-decoration:none; transition:color .15s; }
.foot-links a:hover { color:rgba(255,255,255,.75); }
.foot-copy { font-size:11px; color:rgba(255,255,255,.26); }

/* ===== FADE ===== */
.fade-up { opacity:1; transform:none; }
.fade-up.visible { opacity:1; transform:none; }
.fd1{transition-delay:.1s;} .fd2{transition-delay:.2s;} .fd3{transition-delay:.3s;} .fd4{transition-delay:.4s;}

/* ===== RESPONSIVE（共通の chrome 部分のみ） ===== */
@media (max-width:960px) {
  nav { padding:0 20px; }
  .nav-toggle { display:flex; }
  .nav-links {
    position:fixed; top:64px; left:0; right:0;
    flex-direction:column; gap:0; margin:0; padding:0;
    background:rgba(255,255,255,0.98); border-bottom:1px solid var(--border);
    max-height:0; overflow:hidden; transition:max-height .3s ease;
    box-shadow:0 10px 24px rgba(0,0,0,.06);
  }
  .nav-links.open { max-height:70vh; }
  .nav-links li { width:100%; border-top:1px solid var(--border); }
  .nav-links li:first-child { border-top:none; }
  .nav-links a { display:block; padding:15px 24px; }
  .nav-links a:hover { background:var(--off); }
  .nav-links a.active::after { display:none; }
  .breadcrumb { padding:12px 24px; }
  footer { padding:24px 20px; flex-direction:column; align-items:flex-start; }
}