/* ==========================================================
   株式会社愛和アセット コーポレートサイト 共通スタイル
   実装指示書 v1.0（2026年7月30日）準拠
   ルール: box-shadow不使用 / 角丸は最大3px / 本文line-height 2.0
   ========================================================== */

:root{
  /* Color — Primary */
  --navy:       #1B3A5C;   /* 主色。見出し・ボタン・強調 */
  --navy-deep:  #0F2338;   /* フッター・FVオーバーレイ・hover */
  --navy-mid:   #2C5480;   /* グラデーション・リンクhover */
  --navy-tint:  #E8EDF3;   /* セクション背景・表ヘッダー */

  /* Color — Accent */
  --gold:       #A98247;   /* ラベル・罫線・数字の装飾。本文色には使わない */
  --gold-text:  #7A5C2C;   /* 金系を文字に使う場合はこちら（4.9:1） */
  --gold-tint:  #F3EDE2;   /* 注記ボックス背景 */

  /* Color — Neutral */
  --ink:        #1A1A1A;   /* 本文 */
  --ink-2:      #5A6672;   /* 補足・表の項目名 */
  --rule:       #DDE3E9;   /* 罫線 */
  --bg:         #F5F7F9;   /* ページ地色 */
  --white:      #FFFFFF;

  /* Typography */
  --serif: "Noto Serif JP", "Yu Mincho", "YuMincho", serif;
  --sans:  "Noto Sans JP", "Hiragino Sans", "Meiryo", sans-serif;

  /* Spacing */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-5: 24px; --sp-6: 32px; --sp-7: 48px; --sp-8: 64px;
  --sp-9: 96px;

  /* Layout */
  --wrap: 1080px;      /* コンテンツ最大幅 */
  --wrap-narrow: 760px;/* 文章主体ページの最大幅 */
  --radius: 3px;
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body,h1,h2,h3,h4,h5,p,figure,blockquote,dl,dd{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
input,select,textarea{font:inherit;color:inherit}
table{border-collapse:collapse;width:100%}
iframe{display:block}

/* ---------- Base ---------- */
body{
  font-family:var(--sans);
  font-weight:400;
  font-size:15px;
  line-height:2;
  letter-spacing:.02em;
  color:var(--ink);
  background:var(--bg);
}
@media (min-width:768px){
  body{font-size:16px}
}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:2px solid var(--navy);
  outline-offset:2px;
}

/* ---------- Layout ---------- */
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:20px}
.wrap-narrow{max-width:var(--wrap-narrow);margin-inline:auto;padding-inline:20px}
@media (min-width:768px){
  .wrap,.wrap-narrow{padding-inline:24px}
}
.sec{padding-block:var(--sp-8)}
@media (min-width:1024px){
  .sec{padding-block:var(--sp-9)}
}
.bg-white{background:var(--white)}
.bg-tint{background:var(--navy-tint)}

/* ---------- Section head ---------- */
.sec-label{
  display:block;
  font-family:var(--sans);
  font-weight:700;
  font-size:11px;
  line-height:1.6;
  letter-spacing:.2em;
  color:var(--gold);
  margin-bottom:var(--sp-2);
}
.sec-head{margin-bottom:var(--sp-7)}
.sec-head h2{
  font-family:var(--serif);
  font-weight:600;
  font-size:21px;
  line-height:1.5;
  letter-spacing:.02em;
  color:var(--navy);
}
@media (min-width:768px){
  .sec-head h2{font-size:26px}
}
.sec-head h2::after{
  content:"";
  display:block;
  width:40px;
  height:2px;
  background:var(--gold);
  margin-top:var(--sp-4);
}
.sec-head.center{text-align:center}
.sec-head.center h2::after{margin-inline:auto}
.sec-head.on-dark h2{color:var(--white)}
.sec-head.on-dark .sec-label{color:#C6A76B}

h3{
  font-family:var(--sans);
  font-weight:700;
  font-size:16px;
  line-height:1.6;
  letter-spacing:0;
  color:var(--navy);
}
@media (min-width:768px){
  h3{font-size:17px}
}

.caption,.note{
  font-size:13px;
  line-height:1.85;
  letter-spacing:0;
  color:var(--ink-2);
}

/* ---------- Buttons ---------- */
.btn-primary,.btn-ghost,.btn-on-dark{
  display:inline-block;
  font-family:var(--sans);
  font-weight:700;
  font-size:14px;
  line-height:1.6;
  letter-spacing:.06em;
  text-align:center;
  padding:14px 36px;
  border-radius:var(--radius);
  transition:background-color .2s,color .2s,border-color .2s;
}
.btn-primary{
  background:var(--navy);
  color:var(--white);
  border:1px solid var(--navy);
}
.btn-primary:hover{
  background:var(--navy-deep);
  border-color:var(--navy-deep);
}
.btn-ghost{
  background:transparent;
  color:var(--navy);
  border:1px solid var(--navy);
}
.btn-ghost:hover{
  background:var(--navy);
  color:var(--white);
}
.btn-on-dark{
  background:var(--white);
  color:var(--navy);
  border:1px solid var(--white);
}
.btn-on-dark:hover{
  background:var(--navy-tint);
  border-color:var(--navy-tint);
}
.sec-more{margin-top:var(--sp-7);text-align:center}

/* ---------- Header ---------- */
.site-header{
  position:sticky;
  top:0;
  z-index:200;
  height:64px;
  background:var(--white);
  border-bottom:1px solid var(--rule);
  transition:height .25s;
}
.header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--sp-5);
  height:100%;
}
.brand{display:inline-flex;align-items:center}
.brand-name{
  font-family:var(--serif);
  font-weight:600;
  font-size:16px;
  letter-spacing:.08em;
  color:var(--navy);
  white-space:nowrap;
}
.gnav{display:none}
.header-contact{display:none}
@media (min-width:1024px){
  .site-header{height:88px}
  .site-header.is-compact{height:64px}
  .brand-name{font-size:18px}
  .gnav{display:block;margin-left:auto}
  .gnav ul{display:flex;gap:28px}
  .gnav a{
    font-weight:500;
    font-size:14px;
    letter-spacing:.04em;
    color:var(--ink);
    padding-bottom:4px;
    border-bottom:1px solid transparent;
    transition:color .2s,border-bottom-color .2s;
  }
  .gnav a:hover{
    color:var(--navy);
    border-bottom-color:var(--navy);
  }
  .header-contact{display:flex;align-items:center;gap:20px}
  .header-tel{
    display:inline-flex;
    align-items:center;
    gap:8px;
    font-weight:700;
    font-size:18px;
    color:var(--navy);
    white-space:nowrap;
  }
  .header-tel svg{width:18px;height:18px}
  .header-cta{padding:12px 24px;font-size:13px}
}

/* PCでは電話番号をリンクとして動作させない（SPのみtel:有効） */
@media (min-width:1024px){
  .tel-link{pointer-events:none}
}

/* ハンバーガー */
.menu-toggle{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  width:44px;
  height:44px;
  margin-right:-10px;
}
.menu-toggle span{
  display:block;
  width:24px;
  height:2px;
  background:var(--navy);
  transition:transform .25s,opacity .25s;
}
.menu-toggle.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu-toggle.is-open span:nth-child(2){opacity:0}
.menu-toggle.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media (min-width:1024px){
  .menu-toggle{display:none}
}

/* 全画面オーバーレイメニュー（ヘッダーは上に残し、ハンバーガーで閉じる） */
.nav-overlay{
  position:fixed;
  inset:0;
  z-index:150;
  background:var(--navy-deep);
  padding:96px 24px 40px;
  display:flex;
  flex-direction:column;
  overflow-y:auto;
  visibility:hidden;
  opacity:0;
  transition:opacity .25s,visibility .25s;
}
.nav-overlay.is-open{visibility:visible;opacity:1}
.overlay-nav a{
  display:block;
  font-family:var(--serif);
  font-weight:600;
  font-size:20px;
  color:var(--white);
  padding:14px 4px;
  border-bottom:1px solid rgba(255,255,255,.12);
}
.overlay-contact{margin-top:auto;padding-top:var(--sp-7);text-align:center}
.overlay-tel{
  display:block;
  background:var(--white);
  color:var(--navy);
  font-family:var(--serif);
  font-weight:600;
  font-size:20px;
  padding:14px;
  border-radius:var(--radius);
}
.overlay-hours{
  margin-top:var(--sp-3);
  font-size:13px;
  line-height:1.85;
  color:#C3D0DE;
}
@media (min-width:1024px){
  .nav-overlay{display:none}
}
/* JS無効時はオーバーレイを通常フローで表示し、ナビを利用可能にする */
.no-js .nav-overlay{
  position:static;
  visibility:visible;
  opacity:1;
  padding:24px;
}
.no-js .menu-toggle{display:none}

/* ---------- Footer ---------- */
.site-footer{
  background:var(--navy-deep);
  color:#C3D0DE;
  font-size:14px;
  line-height:1.85;
}
.footer-inner{
  display:grid;
  gap:var(--sp-7);
  padding-block:var(--sp-8) var(--sp-7);
}
@media (min-width:768px){
  .footer-inner{grid-template-columns:1fr auto}
}
.footer-name{
  font-family:var(--serif);
  font-weight:600;
  font-size:16px;
  color:var(--white);
  margin-bottom:var(--sp-4);
}
.footer-info p + p{margin-top:var(--sp-2)}
.footer-nav-title{
  font-weight:700;
  font-size:13px;
  letter-spacing:.1em;
  color:var(--white);
  margin-bottom:var(--sp-3);
}
.footer-nav li + li{margin-top:var(--sp-1)}
.footer-nav a{
  display:inline-block;
  padding:2px 0;
  border-bottom:1px solid transparent;
  transition:color .2s,border-bottom-color .2s;
}
.footer-nav a:hover{
  color:var(--white);
  border-bottom-color:rgba(255,255,255,.5);
}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.12);
  padding-block:20px;
}
.copyright{
  font-size:12px;
  color:#8FA5BC;
  text-align:center;
}

/* ---------- 下層ページ共通 ---------- */
.page-header{
  background:var(--navy);
  color:var(--white);
  display:flex;
  align-items:center;
  min-height:140px;
  padding-block:var(--sp-6);
}
@media (min-width:1024px){
  .page-header{min-height:200px}
}
.page-label{
  display:block;
  font-weight:700;
  font-size:11px;
  line-height:1.6;
  letter-spacing:.2em;
  color:#C6A76B;
  margin-bottom:var(--sp-2);
}
.page-header h1{
  font-family:var(--serif);
  font-weight:600;
  font-size:24px;
  line-height:1.5;
  letter-spacing:.02em;
}
@media (min-width:768px){
  .page-header h1{font-size:32px}
}
.breadcrumb-bar{
  background:var(--white);
  border-bottom:1px solid var(--rule);
}
.breadcrumb{padding-block:var(--sp-3)}
.breadcrumb ol{
  display:flex;
  flex-wrap:wrap;
  font-size:13px;
  line-height:1.85;
  color:var(--ink-2);
}
.breadcrumb li + li::before{
  content:"›";
  margin-inline:10px;
  color:var(--ink-2);
}
.breadcrumb a{
  color:var(--ink-2);
  border-bottom:1px solid var(--rule);
  transition:color .2s;
}
.breadcrumb a:hover{color:var(--navy)}

/* ---------- トップ：ファーストビュー ---------- */
.hero{
  display:flex;
  align-items:center;
  min-height:420px;
  padding-block:80px;
  /* hero.jpg 入手後は下の2層目を url() に差し替える（1層目のオーバーレイは残す） */
  background:
    linear-gradient(180deg, rgba(15,35,56,.72) 0%, rgba(15,35,56,.42) 45%, rgba(15,35,56,.80) 100%),
    linear-gradient(140deg, #2C5480 0%, #1B3A5C 42%, #0F2338 100%);
  background-size:cover;
  background-position:center;
}
@media (min-width:1024px){
  .hero{min-height:520px}
}
.hero-label{
  display:block;
  font-weight:700;
  font-size:11px;
  line-height:1.6;
  letter-spacing:.28em;
  color:#C6A76B;
}
.hero-title{
  font-family:var(--serif);
  font-weight:600;
  font-size:clamp(26px, 4vw, 40px);
  line-height:1.6;
  letter-spacing:.02em;
  color:var(--white);
  margin-top:var(--sp-4);
}
.hero-lead{
  font-size:14px;
  line-height:2;
  color:#CBD8E5;
  max-width:44ch;
  margin-top:var(--sp-5);
}

/* ---------- トップ：会社の姿勢 ---------- */
.stance{text-align:center}
.stance p + p{margin-top:1.5em}

/* ---------- トップ：数字で見る ---------- */
.num-grid{display:grid;grid-template-columns:1fr}
.num-item{
  padding:28px 0;
  text-align:center;
  border-bottom:1px solid var(--rule);
}
.num-item:last-child{border-bottom:none}
@media (min-width:768px){
  .num-grid{grid-template-columns:repeat(3,1fr)}
  .num-item{
    border-bottom:none;
    border-left:1px solid var(--rule);
    padding:var(--sp-3) var(--sp-5);
  }
  .num-item:first-child{border-left:none}
}
.num-label{
  display:block;
  font-weight:700;
  font-size:11px;
  line-height:1.6;
  letter-spacing:.14em;
  color:var(--ink-2);
}
.num-value{
  display:block;
  font-family:var(--serif);
  font-weight:600;
  font-size:34px;
  line-height:1.2;
  color:var(--navy);
  margin-top:var(--sp-3);
}
@media (min-width:768px){
  .num-value{font-size:44px}
}
.num-unit{
  font-family:var(--sans);
  font-weight:700;
  font-size:15px;
  color:var(--ink-2);
  margin-left:3px;
}
.num-note{
  margin-top:var(--sp-5);
  text-align:center;
}

/* ---------- カード ---------- */
.card-grid{display:grid;gap:var(--sp-5)}
@media (min-width:768px){
  .card-grid{grid-template-columns:repeat(3,1fr)}
}
.card{
  background:var(--white);
  border:1px solid var(--rule);
  border-radius:var(--radius);
  padding:var(--sp-6);
}
.card p{
  margin-top:var(--sp-4);
  font-size:14px;
  line-height:2;
  color:var(--ink-2);
}

/* ---------- 代表挨拶 ---------- */
.message-body p + p{margin-top:1.5em}
.message-sign{
  margin-top:var(--sp-7);
  text-align:right;
  font-family:var(--serif);
  font-weight:600;
  font-size:16px;
  color:var(--ink);
}

/* ---------- 会社概要（抜粋）＋地図 ---------- */
.company-grid{display:grid;gap:var(--sp-7)}
@media (min-width:1024px){
  .company-grid{grid-template-columns:1fr 1fr;align-items:start}
}
.map-frame iframe{width:100%;border:0}

/* ---------- 定義テーブル ---------- */
.def-table th{
  width:32%;
  font-weight:500;
  font-size:14px;
  line-height:1.85;
  color:var(--ink-2);
  text-align:left;
  vertical-align:top;
  padding:14px 8px;
  border-bottom:1px solid var(--rule);
}
.def-table td{
  font-size:14px;
  line-height:1.85;
  padding:14px 8px;
  border-bottom:1px solid var(--rule);
}

/* ---------- お問い合わせ導線（CTA） ---------- */
.contact-cta{
  background:var(--navy-deep);
  color:var(--white);
  text-align:center;
}
.contact-cta .cta-lead{
  font-size:14px;
  line-height:2;
  color:#CBD8E5;
}
.cta-tel{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-family:var(--serif);
  font-weight:600;
  font-size:26px;
  line-height:1.4;
  color:var(--white);
  margin-top:var(--sp-6);
}
@media (min-width:768px){
  .cta-tel{font-size:34px}
}
.cta-tel svg{width:26px;height:26px}
.cta-hours{
  font-size:13px;
  line-height:1.85;
  color:#C3D0DE;
  margin-top:var(--sp-2);
}
.cta-btn{margin-top:var(--sp-6)}

/* ---------- 会社案内：経営理念 ---------- */
.philosophy{text-align:center}
.philosophy-text{
  font-family:var(--serif);
  font-weight:400;
  font-size:18px;
  line-height:2.2;
  color:var(--navy);
}
@media (min-width:768px){
  .philosophy-text{font-size:20px}
}
.philosophy-text p + p{margin-top:1em}

/* ---------- 会社案内：沿革 ---------- */
.timeline{
  position:relative;
  margin-left:3px;
}
.timeline::before{
  content:"";
  position:absolute;
  left:0;
  top:10px;
  bottom:10px;
  width:1px;
  background:var(--rule);
}
.timeline-item{
  position:relative;
  display:flex;
  flex-wrap:wrap;
  gap:var(--sp-2) var(--sp-5);
  padding-left:28px;
}
.timeline-item + .timeline-item{margin-top:var(--sp-5)}
.timeline-item::before{
  content:"";
  position:absolute;
  left:-2.5px;
  top:12px;
  width:6px;
  height:6px;
  border-radius:3px;  /* 6px円と同等。角丸最大3pxルールの形式適合 */
  background:var(--gold);
}
.timeline-date{
  flex:0 0 120px;
  font-weight:700;
  font-size:14px;
  line-height:2;
  color:var(--navy);
}
.timeline-event{
  flex:1 1 240px;
  font-size:15px;
  line-height:2;
}

/* ---------- 下部ナビカード ---------- */
.nav-cards{display:grid;gap:var(--sp-4)}
@media (min-width:768px){
  .nav-cards{grid-template-columns:repeat(3,1fr)}
}
.nav-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--sp-3);
  background:var(--white);
  border:1px solid var(--rule);
  border-radius:var(--radius);
  padding:var(--sp-5) 28px;
  font-weight:700;
  font-size:15px;
  color:var(--navy);
  transition:background-color .2s;
}
.nav-card::after{
  content:"→";
  color:var(--gold);
}
.nav-card:hover{background:var(--navy-tint)}

/* ---------- 事業内容 ---------- */
.biz-lead{text-align:center}
.biz-section + .biz-section{
  margin-top:var(--sp-8);
  padding-top:var(--sp-8);
  border-top:1px solid var(--rule);
}
.biz-num{
  display:block;
  font-family:var(--serif);
  font-weight:600;
  font-size:28px;
  line-height:1.2;
  letter-spacing:.08em;
  color:var(--gold);
}
.biz-section h2{
  font-family:var(--serif);
  font-weight:600;
  font-size:21px;
  line-height:1.5;
  letter-spacing:.02em;
  color:var(--navy);
  margin-top:var(--sp-2);
  margin-bottom:var(--sp-5);
}
@media (min-width:768px){
  .biz-section h2{font-size:26px}
}
.biz-section p + p{margin-top:1em}
.winter-box{
  background:var(--navy-tint);
  border-radius:var(--radius);
  padding:28px;
  margin-top:var(--sp-6);
}
@media (min-width:768px){
  .winter-box{padding:var(--sp-6)}
}
.winter-box p{margin-top:var(--sp-3)}
.dot-list{margin-top:var(--sp-3)}
.dot-list li{
  position:relative;
  padding-left:1.2em;
  line-height:2;
}
.dot-list li::before{
  content:"・";
  position:absolute;
  left:0;
}
.property-head{margin-top:var(--sp-6)}
.property-list{margin-top:var(--sp-3)}
.property-list li{
  position:relative;
  padding-left:1.2em;
  line-height:2;
}
.property-list li::before{
  content:"・";
  position:absolute;
  left:0;
}

/* ---------- アクセス ---------- */
.map-full iframe{width:100%;height:300px;border:0}
@media (min-width:1024px){
  .map-full iframe{height:420px}
}
.access-name{
  font-family:var(--serif);
  font-weight:600;
  font-size:20px;
  color:var(--navy);
  margin-bottom:var(--sp-4);
}
.access-info p + p{margin-top:var(--sp-1)}
.access-info .btn-ghost{margin-top:var(--sp-6)}
.aburakawa p + p{margin-top:1.5em}

/* ---------- お問い合わせ ---------- */
.tel-box{
  background:var(--navy-tint);
  border-radius:var(--radius);
  padding:var(--sp-6);
  text-align:center;
}
.tel-box h2{
  font-family:var(--sans);
  font-weight:700;
  font-size:16px;
  color:var(--navy);
}
.tel-box .tel-number{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-family:var(--serif);
  font-weight:600;
  font-size:26px;
  line-height:1.4;
  color:var(--navy);
  margin-top:var(--sp-3);
}
@media (min-width:768px){
  .tel-box .tel-number{font-size:34px}
}
.tel-box .tel-number svg{width:26px;height:26px}
.tel-box .caption{margin-top:var(--sp-2)}

.contact-form{margin-top:var(--sp-8)}
.gotcha{display:none}  /* スパム対策ハニーポット（人間には見せない） */
.form-row{margin-bottom:var(--sp-5)}
.form-row > label{
  display:block;
  font-weight:700;
  font-size:14px;
  line-height:1.85;
  margin-bottom:var(--sp-2);
}
.req{
  display:inline-block;
  background:var(--navy);
  color:var(--white);
  font-weight:700;
  font-size:10px;
  line-height:1;
  letter-spacing:.05em;
  padding:3px 6px;
  border-radius:2px;
  margin-left:8px;
  vertical-align:2px;
}
.form-row input[type="text"],
.form-row input[type="tel"],
.form-row input[type="email"],
.form-row select{
  width:100%;
  height:48px;
  padding:0 14px;
  background:var(--white);
  border:1px solid var(--rule);
  border-radius:var(--radius);
}
.form-row textarea{
  width:100%;
  padding:12px 14px;
  background:var(--white);
  border:1px solid var(--rule);
  border-radius:var(--radius);
  line-height:1.85;
  resize:vertical;
}
.form-row input:focus,
.form-row select:focus,
.form-row textarea:focus{
  border-color:var(--navy);
  outline:2px solid rgba(27,58,92,.2);
  outline-offset:0;
}
.agree-row{
  display:flex;
  align-items:flex-start;
  gap:10px;
}
.agree-row input[type="checkbox"]{
  width:18px;
  height:18px;
  margin-top:8px;
  accent-color:var(--navy);
}
.agree-row label{
  font-weight:700;
  font-size:14px;
  line-height:2;
}
.agree-note{
  margin-top:var(--sp-2);
  font-size:13px;
  line-height:1.85;
  color:var(--ink-2);
}
.agree-note a,
.privacy-usage a{
  color:var(--navy);
  border-bottom:1px solid var(--navy);
}
.privacy-usage{
  margin-top:var(--sp-6);
  font-size:13px;
  line-height:1.85;
  color:var(--ink-2);
}
.form-submit{
  margin-top:var(--sp-6);
  text-align:center;
}
.form-submit .btn-primary{width:100%}
@media (min-width:768px){
  .form-submit .btn-primary{max-width:320px}
}

/* ---------- プライバシーポリシー等の文章ページ ---------- */
.doc h2{
  font-family:var(--sans);
  font-weight:700;
  font-size:17px;
  line-height:1.6;
  color:var(--navy);
  margin-top:var(--sp-7);
  margin-bottom:var(--sp-3);
}
.doc p + p{margin-top:1em}
.doc ol.paren li,
.doc ul.plain li{line-height:2}
.doc-date{
  margin-top:var(--sp-7);
  text-align:right;
  font-size:14px;
  color:var(--ink-2);
}

/* ---------- 送信完了・404 ---------- */
.simple-page{
  text-align:center;
  padding-block:var(--sp-9);
}
.simple-page h1{
  font-family:var(--serif);
  font-weight:600;
  font-size:24px;
  line-height:1.5;
  color:var(--navy);
}
@media (min-width:768px){
  .simple-page h1{font-size:32px}
}
.simple-page p{margin-top:var(--sp-5)}
.simple-page .btn-primary,
.simple-page .btn-ghost{margin-top:var(--sp-7)}
.err-code{
  display:block;
  font-family:var(--serif);
  font-weight:600;
  font-size:64px;
  line-height:1.2;
  color:var(--navy);
  margin-bottom:var(--sp-4);
}

/* ---------- スクロール時フェードイン ---------- */
[data-reveal]{
  opacity:0;
  transform:translateY(16px);
  transition:opacity .4s ease-out,transform .4s ease-out;
}
[data-reveal].is-visible{
  opacity:1;
  transform:none;
}
.no-js [data-reveal]{
  opacity:1;
  transform:none;
}
@media (prefers-reduced-motion: reduce){
  [data-reveal]{
    opacity:1;
    transform:none;
    transition:none;
  }
  .site-header,
  .menu-toggle span,
  .nav-overlay,
  .btn-primary,.btn-ghost,.btn-on-dark,
  .gnav a,.footer-nav a,.nav-card{
    transition:none;
  }
}