*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    :root { --font: 'Yu Gothic','YuGothic','Hiragino Sans','Meiryo',sans-serif; }
    html, body { width:100%; height:100%; overflow:hidden; font-family:var(--font); background:#000; color:#fff; }

    /* ━━━ SCROLLER ━━━ */
    #scroller { width:100%; height:100vh; height:100dvh; overflow-y:scroll; }

    /* ━━━ NAV ━━━ */
    #nav { position:fixed; top:0; left:0; width:100%; z-index:999; display:flex; align-items:center; justify-content:space-between; padding:18px 24px; padding-left:max(24px, env(safe-area-inset-left)); padding-right:max(24px, env(safe-area-inset-right)); }
    #nav-logo { height:28px; width:auto; display:block; cursor:pointer; }

    /* デスクトップ用リンク → モバイルでは非表示 */
    #nav-links { display:none; gap:40px; list-style:none; align-items:center; }
    #nav-links a { text-decoration:none; font-family:var(--font); font-size:11px; letter-spacing:0.16em; text-transform:uppercase; }

    /* モバイル用ハンバーガー → デスクトップでは非表示 */
    #nav-menu-btn {
      background:none; border:none; cursor:pointer; padding:15px 11px; margin:-7px -3px;
      display:flex; flex-direction:column; gap:5px; z-index:997;
    }
    #nav-menu-btn span { display:block; width:22px; height:1.5px; background:#000; transition:background 0.3s; }
    #nav-menu-btn.light span { background:#fff; }
    #nav-menu-btn.hidden { visibility:hidden; pointer-events:none; }

    /* ━━━ MENU OVERLAY（モバイル） ━━━ */
    #menu-overlay {
      position:fixed; inset:0; background:#000; z-index:998;
      display:flex; flex-direction:column; align-items:center; justify-content:center; gap:40px;
      opacity:0; visibility:hidden; pointer-events:none; transition:opacity 0.3s, visibility 0.3s;
    }
    #menu-overlay.open { opacity:1; visibility:visible; pointer-events:auto; }
    #menu-close {
      position:fixed; top:15px; right:21px; z-index:1001;
      background:none; border:none; cursor:pointer; padding:8px;
      width:44px; height:44px; display:none;
    }
    #menu-close.visible { display:block; }
    #menu-close::before, #menu-close::after {
      content:''; position:absolute; top:50%; left:50%;
      width:22px; height:1.5px; background:#fff;
    }
    #menu-close::before { transform:translate(-50%,-50%) rotate(45deg); }
    #menu-close::after  { transform:translate(-50%,-50%) rotate(-45deg); }
    .menu-link { text-decoration:none; font-family:var(--font); font-size:28px; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; color:#fff; }

    /* ━━━ SECTIONS（モバイルベース） ━━━ */
    .sec { position:relative; width:100%; height:100vh; height:100dvh; display:flex; align-items:center; overflow:hidden; flex-shrink:0; }
    .sec video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
    .overlay { position:absolute; inset:0; z-index:1; }
    #sec1 .overlay { background:linear-gradient(to bottom,rgba(0,0,0,0.1) 0%,rgba(0,0,0,0) 40%,rgba(0,0,0,0.55) 80%,rgba(0,0,0,0.85) 100%); }
    #sec2 .overlay, #sec3 .overlay, #sec4 .overlay { background:rgba(0,0,0,0.6); }
    .content { position:relative; z-index:2; padding:0 24px; padding-left:max(24px, env(safe-area-inset-left)); padding-right:max(24px, env(safe-area-inset-right)); width:100%; }

    /* ━━━ HERO（モバイルベース） ━━━ */
    .hero-title { font-size:32px; font-weight:700; letter-spacing:0.06em; color:#fff; opacity:0; animation:fadeUp 0.8s 0.5s forwards; }
    .hero-sub { font-size:14px; font-weight:300; letter-spacing:0.04em; color:rgba(255,255,255,0.7); margin-top:12px; opacity:0; animation:fadeUp 0.8s 0.75s forwards; }

    /* ━━━ SECTION CONTENT（モバイルベース） ━━━ */
    .sec-heading { font-size:28px; font-weight:700; letter-spacing:0.06em; color:#fff; margin-bottom:16px; }
    .sec-body { font-size:13px; font-weight:300; line-height:1.8; color:rgba(255,255,255,0.55); margin-bottom:24px; }
    .arrow-link { display:inline-flex; align-items:center; gap:8px; font-size:11px; letter-spacing:0.14em; text-transform:uppercase; color:#fff; text-decoration:none; border-bottom:1px solid rgba(255,255,255,0.3); padding-bottom:3px; transition:gap 0.2s; }

    /* ━━━ TEAM（モバイルベース） ━━━ */
    .team-single { display:flex; align-items:center; gap:20px; margin-top:20px; }
    .team-photo { width:90px; height:90px; border-radius:50%; overflow:hidden; flex-shrink:0; }
    .team-photo img { width:100%; height:100%; object-fit:cover; }
    .team-info .card-name { font-size:18px; font-weight:500; color:#fff; margin-bottom:4px; }
    .team-info .card-role { font-size:10px; letter-spacing:0.1em; text-transform:uppercase; color:rgba(255,255,255,0.5); }
    .team-social { display:flex; gap:14px; margin-top:10px; }
    .social-link { color:rgba(255,255,255,0.6); text-decoration:none; transition:color 0.2s; display:flex; align-items:center; padding:10px; margin:-10px; }
    .social-link:hover { color:#fff; }

    /* ━━━ SEC5 CONTACT（モバイルベース） ━━━ */
    #sec5 { background:#000; flex-direction:column; align-items:stretch; overflow:visible; height:auto; min-height:100vh; min-height:100dvh; }
    #sec5 .overlay { display:none; }
    .contact-wrap { display:flex; flex:1 1 auto; min-height:0; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:0 24px; padding-left:max(24px, env(safe-area-inset-left)); padding-right:max(24px, env(safe-area-inset-right)); position:relative; z-index:2; }
    .contact-label { font-size:10px; letter-spacing:0.24em; text-transform:uppercase; color:rgba(255,255,255,0.45); margin-bottom:20px; }
    .contact-title { font-size:28px; font-weight:700; letter-spacing:0.06em; color:#fff; margin-bottom:32px; }
    .contact-link { display:inline-block; font-size:12px; letter-spacing:0.12em; text-transform:uppercase; color:#fff; text-decoration:none; border-bottom:1px solid rgba(255,255,255,0.4); padding-bottom:3px; }

    /* ━━━ FOOTER（モバイルベース） ━━━ */
    #site-footer { background:#000; border-top:1px solid rgba(255,255,255,0.1); padding:24px; display:flex; flex-direction:column; align-items:center; gap:12px; text-align:center; position:relative; z-index:2; }
    .footer-copy { font-size:10px; color:rgba(255,255,255,0.5); letter-spacing:0.05em; }
    .footer-links { display:flex; flex-wrap:wrap; justify-content:center; gap:12px 20px; list-style:none; }
    /* フッターリンクの値は subpage.css と同期すること */
    .footer-link { display:inline-block; min-width:24px; min-height:24px; padding:10px; margin:-10px; padding-inline:0; padding-bottom:2px; margin-inline:0; margin-bottom:0; border-bottom:1px solid rgba(255,255,255,0.2); color:rgba(255,255,255,0.5); text-decoration:none; font-size:10px; letter-spacing:0.05em; transition:color 0.2s, border-color 0.2s; }
    .footer-link:hover { color:rgba(255,255,255,0.8); border-bottom-color:rgba(255,255,255,0.4); }
    .footer-link:focus-visible { outline:2px solid #fff; outline-offset:4px; }

    @keyframes fadeUp { from{opacity:0;transform:translateY(20px)} to{opacity:1;transform:translateY(0)} }

    /* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
       DESKTOP OVERRIDES（≥768px）
    ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
    @media (min-width: 768px) and (min-height: 480px) {
      /* Nav */
      #nav { padding:26px 44px; padding-left:max(44px, env(safe-area-inset-left)); padding-right:max(44px, env(safe-area-inset-right)); }
      #nav-links { display:flex; }
      #nav-menu-btn { display:none; }
      #menu-overlay { display:none !important; }

      /* Scroll snap */
      #scroller { scroll-snap-type:y mandatory; overscroll-behavior-y:none; }
      .sec { scroll-snap-align:start; }

      /* sec1 オーバーレイ：デスクトップ原版のグラデーションに上書き */
      #sec1 .overlay { background:linear-gradient(to bottom,rgba(0,0,0,0.1) 0%,rgba(0,0,0,0) 40%,rgba(0,0,0,0.6) 85%,rgba(0,0,0,0.88) 100%); }

      /* Content */
      .content { padding:0 48px; padding-left:max(48px, env(safe-area-inset-left)); padding-right:max(48px, env(safe-area-inset-right)); width:auto; }

      /* Hero */
      .hero-title { font-size:50px; letter-spacing:0.08em; }
      .hero-sub { font-size:18px; margin-top:16px; }

      /* Section content */
      .sec-heading { font-size:40px; letter-spacing:0.08em; margin-bottom:24px; }
      .sec-body { font-size:15px; line-height:1.85; margin-bottom:32px; }
      .arrow-link { gap:10px; padding-bottom:4px; }
      .arrow-link:hover { gap:16px; }

      /* Team */
      .team-single { gap:28px; margin-top:28px; }
      .team-photo { width:180px; height:180px; }
      .team-info .card-name { font-size:25px; margin-bottom:6px; }
      .team-info .card-role { font-size:11px; letter-spacing:0.12em; }

      /* SEC5 */
      #sec5 { height:100vh; height:100dvh; min-height:unset; overflow:hidden; }
      .contact-wrap { flex:1; min-height:unset; padding:0 48px; padding-left:max(48px, env(safe-area-inset-left)); padding-right:max(48px, env(safe-area-inset-right)); }
      .contact-label { font-size:11px; letter-spacing:0.28em; margin-bottom:24px; }
      .contact-title { font-size:40px; letter-spacing:0.08em; margin-bottom:40px; }
      .contact-link { font-size:13px; letter-spacing:0.14em; padding-bottom:4px; }

      /* Footer */
      #site-footer { padding:28px 48px; }
      .footer-copy { font-size:11px; color:rgba(255,255,255,0.5); letter-spacing:0.06em; }
      .footer-link { font-size:11px; letter-spacing:0.06em; }

      @keyframes fadeUp { from{opacity:0;transform:translateY(24px)} to{opacity:1;transform:translateY(0)} }
    }

    /* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
       SECTION DOTS & SCROLL CUE
    ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
    /* ドットナビ：ベースでは非表示（モバイル） */
    #section-dots { display:none; }

    /* Scroll キュー：sec1 内・下部中央に絶対配置 */
    #scroll-cue { position:absolute; left:50%; bottom:28px; transform:translateX(-50%); z-index:2; display:flex; flex-direction:column; align-items:center; gap:10px; opacity:1; transition:opacity 0.4s; }
    #scroll-cue.hidden { opacity:0; pointer-events:none; }
    .scroll-cue-label { font-size:9px; letter-spacing:0.22em; text-transform:uppercase; color:rgba(255,255,255,0.6); }
    .scroll-cue-line { position:relative; width:1px; height:36px; overflow:hidden; }
    /* 白ラインが下方向へ流れるループ（transform/opacity のみ） */
    .scroll-cue-line::after { content:''; position:absolute; left:0; top:0; width:1px; height:100%; background:rgba(255,255,255,0.5); animation:scrollCueFlow 2s ease-in-out infinite; }
    @keyframes scrollCueFlow { 0%{transform:translateY(-100%);opacity:0} 25%{opacity:1} 75%{opacity:1} 100%{transform:translateY(100%);opacity:0} }

    /* モーション低減設定ではキューのアニメーションを停止 */
    @media (prefers-reduced-motion: reduce) {
      .scroll-cue-line::after { animation:none; }
    }

    /* デスクトップ（高さ十分）：右端セクションドットナビを表示 */
    @media (min-width: 768px) and (min-height: 480px) {
      #section-dots { display:flex; flex-direction:column; gap:6px; position:fixed; right:20px; top:50%; transform:translateY(-50%); z-index:900; mix-blend-mode:difference; }
      #section-dots button { background:none; border:none; cursor:pointer; position:relative; width:24px; height:24px; padding:0; }
      /* ドット本体：6px の白丸 */
      #section-dots button::before { content:''; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:6px; height:6px; border-radius:50%; background:rgba(255,255,255,0.45); transition:transform 0.25s, background 0.25s; }
      #section-dots button:hover::before { background:rgba(255,255,255,0.85); }
      #section-dots button.active::before { background:rgba(255,255,255,1); transform:translate(-50%,-50%) scale(1.5); }
      /* ホバー／フォーカスで表示されるラベル（ドット左側） */
      #section-dots button::after { content:attr(aria-label); position:absolute; right:100%; top:50%; transform:translateY(-50%); margin-right:10px; font-size:9px; letter-spacing:0.18em; text-transform:uppercase; white-space:nowrap; color:#fff; opacity:0; pointer-events:none; transition:opacity 0.2s; }
      #section-dots button:hover::after, #section-dots button:focus-visible::after { opacity:1; }
    }