/* コーポレートサイト共通のスタイル（2026-10 リニューアル）
   ページ固有の色・レイアウトは各ページの <helmet> 内とインラインスタイルに書く。
   ここには全ページ共通の文字組み・ヘッダーのスマホ表示・メニューだけを置く。 */

:root{
  --font-sans:-apple-system,BlinkMacSystemFont,'SF Pro Display','SF Pro JP','Hiragino Sans','Hiragino Kaku Gothic ProN','Helvetica Neue','Noto Sans JP',sans-serif;
  --font-mono:'SF Mono',ui-monospace,Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
body{margin:0;font-family:var(--font-sans);-webkit-font-smoothing:antialiased;letter-spacing:0.01em}
p,li,dd{text-wrap:pretty;word-break:auto-phrase}
h1,h2,h3{text-wrap:balance;word-break:auto-phrase}
img{max-width:100%}
input,select,textarea,button{font:inherit}
/* キーボード操作のフォーカス表示。ボタンのインライン all:unset に消されないよう !important にする。
   #4C7DFF は暗い面・明るい面のどちらでもコントラスト3:1以上 */
:focus-visible{outline:2px solid #4C7DFF!important;outline-offset:2px!important}

/* ロゴ（画像。正式SVGが来たら差し替え） */
.site-logo{display:flex;align-items:center;flex:1;min-width:0}
.site-logo img{height:22px;width:auto;display:block}

/* ヘッダー：860px以下はナビと Join を隠し、メニューボタンを出す */
.menu-btn{display:none;align-items:center;justify-content:center;width:36px;height:36px;margin-right:-8px;border:0;background:transparent;color:inherit;cursor:pointer;padding:0}
.menu-btn span{position:relative;display:block;width:18px;height:1.5px;background:currentColor;transition:transform .25s,background .25s}
.menu-btn span::before,.menu-btn span::after{content:"";position:absolute;left:0;width:18px;height:1.5px;background:currentColor;transition:transform .25s}
.menu-btn span::before{top:-6px}
.menu-btn span::after{top:6px}
html[data-menu="open"] .menu-btn span{background:transparent}
html[data-menu="open"] .menu-btn span::before{transform:translateY(6px) rotate(45deg)}
html[data-menu="open"] .menu-btn span::after{transform:translateY(-6px) rotate(-45deg)}
@media (max-width:860px){
  .desk-nav{display:none!important}
  .menu-btn{display:flex}
}

/* スマホ用の全画面メニュー */
.menu-panel{display:none;position:fixed;left:0;right:0;top:52px;bottom:0;z-index:19;overflow-y:auto;background:#0A0A0B;color:#F5F5F3;padding:8px clamp(20px,4vw,48px) 40px;flex-direction:column}
.menu-panel a{display:flex;justify-content:space-between;align-items:baseline;padding:18px 0;border-bottom:1px solid rgba(255,255,255,0.1);font-size:22px;font-weight:700;letter-spacing:-0.01em;color:#F5F5F3;text-decoration:none}
.menu-panel a span{font-size:13px;font-weight:500;color:#8A8A86}
.menu-panel .menu-sub{display:flex;gap:20px;padding-top:24px;font-size:14px}
.menu-panel .menu-sub a{border:0;padding:0;font-size:14px;font-weight:500;color:#C7C7C2}
html[data-menu="open"] .menu-panel{display:flex}
/* 採用ページ：グローバルバーがスクロールで隠れるため、メニューは全画面に重ねて閉じるボタンを持たせる */
.menu-panel.is-full{top:0;z-index:30;padding-top:0}
.menu-top{display:flex;align-items:center;justify-content:space-between;height:44px;flex:none;border-bottom:1px solid rgba(255,255,255,0.1)}
.menu-top img{height:20px;width:auto;display:block}
.menu-top .menu-btn{display:flex}
html[data-menu="open"],html[data-menu="open"] body{overflow:hidden}
@media (min-width:861px){.menu-panel{display:none!important}}

/* 減速表示を求める環境では動きを止める */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:0.01ms!important;animation-iteration-count:1!important;transition-duration:0.01ms!important;scroll-behavior:auto!important}
}
