@charset "UTF-8";

/* ============================================================
   アジリティー・ホールディングス株式会社
   Codex デザイン案のページ化
   実測値: コンテナ1204px / 金 #D2B36F / 紺 #0B2948
   ============================================================ */

:root{
  /* ---- 写真の差し込み口 --------------------------------------
     ヒーローは4枚を9秒ごとにクロスフェード。差し替えるときは
     img/ に置いたファイル名へ書き換える。切り取り位置は
     .hero__slide[data-slide="..."] 側で写真ごとに指定している。
     ---------------------------------------------------------- */
  --photo-1:url("img/hero1.webp");   /* テラスから望む夜景 */
  --photo-2:url("img/hero2.webp");   /* 見上げる高層ビル群 */
  --photo-3:url("img/hero3.webp");   /* 上空から見た都心 */
  --photo-4:url("img/hero4.webp");   /* 役員会議室 */
  --photo-approach:url("img/hero1.webp");

  /* ground */
  --navy-900:#03122A;
  --navy-850:#071A2D;
  --navy-800:#0B2948;
  --paper:#FFFFFF;
  --mist:#F4F6F8;
  --grey:#EEF2F5;

  /* accent */
  --gold:#D2B36F;
  --gold-deep:#B7955A;

  /* type */
  --ink:#0B2948;
  --body:#526174;
  --meta:#748093;
  --on-navy:#FFFFFF;
  --on-navy-body:#B9C6D6;
  --on-navy-meta:#8FA1B5;

  /* hairlines */
  --line:rgba(11,41,72,.13);
  --line-strong:rgba(11,41,72,.24);
  --line-navy:rgba(255,255,255,.18);

  --f-lat:"Barlow","Helvetica Neue",Arial,sans-serif;
  --f-jp:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;

  --content:1204px;
  --gut:clamp(1.25rem,4.2vw,3.75rem);
  --gut-head:clamp(1.25rem,5.6vw,5rem);
  --sec-y:clamp(4.5rem,9.4vw,8.5rem);
  --ease:cubic-bezier(.22,.68,.16,1);
}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:7rem}
body{
  margin:0;background:var(--paper);color:var(--body);
  font-family:var(--f-jp);font-weight:300;
  font-size:.9375rem;line-height:2.4;letter-spacing:.04em;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
h1,h2,h3,p,dl,dt,dd,figure{margin:0}
ul{margin:0;padding:0;list-style:none}
a{color:inherit;text-decoration:none}
svg{display:block}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
address{font-style:normal}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

.wrap{
  width:100%;max-width:calc(var(--content) + var(--gut) * 2);
  margin-inline:auto;padding-inline:var(--gut);
}

.skip{
  position:fixed;top:.5rem;left:.5rem;z-index:200;
  padding:.6rem 1rem;background:var(--paper);color:var(--ink);
  font-size:.8rem;transform:translateY(-180%);transition:transform .2s var(--ease);
}
.skip:focus{transform:translateY(0)}

/* ---------- header ---------- */
.head{
  position:fixed;inset:0 0 auto 0;z-index:110;
  border-bottom:1px solid rgba(255,255,255,.14);
  transition:background .45s var(--ease),border-color .45s var(--ease);
}
.head.is-scrolled{background:rgba(3,18,42,.94);border-bottom-color:rgba(255,255,255,.10)}
.head__wrap{
  display:flex;align-items:center;justify-content:space-between;gap:2rem;
  padding:1.6rem var(--gut-head);
}

.logo{display:flex;align-items:center;gap:1.15rem;color:#fff}
.logo__mark{flex:none;display:flex}
.logo__mark img{height:2.9rem;width:auto;display:block}
.logo__text{display:flex;flex-direction:column;gap:.3rem}
.logo__ja{font-size:1.1875rem;font-weight:700;letter-spacing:.08em;line-height:1}
.logo__en{
  font-family:var(--f-lat);font-size:.6875rem;font-weight:500;
  letter-spacing:.2em;color:rgba(255,255,255,.6);line-height:1;
}

.nav{display:flex;align-items:center;gap:4.5rem}
.nav__list{display:flex;align-items:center;gap:4.5rem}
.nav__list a{
  position:relative;display:inline-block;padding-block:.4rem;
  font-size:.875rem;letter-spacing:.1em;color:rgba(255,255,255,.86);
  transition:color .3s var(--ease);
}
.nav__list a::after{
  content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:var(--gold);
  transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease);
}
.nav__list a:hover{color:#fff}
.nav__list a:hover::after,.nav__list a[aria-current="true"]::after{transform:scaleX(1)}
.nav__lang{
  display:flex;align-items:center;gap:.45rem;
  font-family:var(--f-lat);font-size:.8125rem;letter-spacing:.1em;
}
.nav__lang-on{color:var(--gold)}
.nav__lang-sep{color:rgba(255,255,255,.4)}
.nav__lang-off{color:rgba(255,255,255,.42);cursor:default}

.burger{display:none;width:2.5rem;height:2.5rem;position:relative;z-index:112;color:#fff}
.burger span{
  position:absolute;left:.5rem;width:1.5rem;height:1px;background:currentColor;
  transition:transform .35s var(--ease);
}
.burger span:nth-child(1){top:1.0625rem}
.burger span:nth-child(2){top:1.4375rem}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(.1875rem) rotate(38deg)}
.burger[aria-expanded="true"] span:nth-child(2){transform:translateY(-.1875rem) rotate(-38deg)}

/* ---------- hero ---------- */
.hero{
  position:relative;isolation:isolate;overflow:hidden;
  min-height:min(88svh,54rem);
  display:flex;flex-direction:column;justify-content:center;
  padding-block:clamp(9rem,16vh,12rem) clamp(7rem,13vh,9.5rem);
  background:var(--navy-900);
}
.hero__stage{position:absolute;inset:0;z-index:-2}
/* 切り替えは新しい面を上に重ねて出すだけ。前の面は不透明のまま下に残すので
   中間で背景が透けて暗くなる「沈み」が出ない。 */
.hero__slide{
  position:absolute;inset:0;opacity:0;z-index:0;
  background-repeat:no-repeat;background-size:cover;
  transition:opacity 2.2s cubic-bezier(.4,0,.2,1);
}
.hero__slide.is-prev{opacity:1;z-index:1;transition:none}
.hero__slide.is-active{opacity:1;z-index:2}
/* 写真ごとに見せ場と明るさが違うので、切り取り位置と暗さ（--veil）を
   個別に指定する。--veil は明るい写真だけ落として4枚の明るさを揃える
   ためのもので、切り替えのたびに明暗が跳ねるのを防ぐ。
   写真を差し替えたときはここも合わせて調整する。 */
.hero__slide::after{
  content:"";position:absolute;inset:0;
  background:rgba(3,18,42,var(--veil,0));
}
.hero__slide[data-slide="1"]{background-image:var(--photo-1);background-position:center bottom}
.hero__slide[data-slide="2"]{background-image:var(--photo-2);background-position:center 45%;--veil:.20}
.hero__slide[data-slide="3"]{background-image:var(--photo-3);background-position:center 22%;--veil:.34}
.hero__slide[data-slide="4"]{background-image:var(--photo-4);background-position:center 50%}

/* 左に文字が乗るので斜めに落とし、街明かりが強い下側も別に落とす */
.hero__scrim{
  position:absolute;inset:0;z-index:-1;
  background:
    linear-gradient(100deg,
      rgba(3,18,42,.92) 0%,rgba(3,18,42,.76) 32%,
      rgba(3,18,42,.36) 62%,rgba(3,18,42,.10) 100%),
    linear-gradient(0deg,rgba(3,18,42,.56) 0%,rgba(3,18,42,0) 46%);
}
.hero__wrap{position:relative}

.hero__eyebrow{
  display:flex;align-items:center;gap:1.25rem;
  font-family:var(--f-lat);font-size:.8125rem;font-weight:500;
  letter-spacing:.14em;color:var(--gold);margin-bottom:2.75rem;
}
.hero__eyebrow-line{display:block;width:4rem;height:1px;background:var(--gold);flex:none}

.hero__title{
  font-size:clamp(2.125rem,4.35vw,3.875rem);
  font-weight:700;line-height:1.36;letter-spacing:.02em;color:#fff;
  margin-bottom:2.5rem;
}
.hero__name{font-size:clamp(1rem,1.35vw,1.1875rem);letter-spacing:.1em;color:rgba(255,255,255,.92)}
.hero__name-en{
  font-family:var(--f-lat);font-size:.9375rem;font-weight:400;
  letter-spacing:.14em;color:rgba(255,255,255,.55);margin-top:.6rem;
}

.cta{
  display:inline-grid;grid-template-columns:1fr auto;align-items:center;
  min-width:16.375rem;min-height:4.5rem;margin-top:3.25rem;
  border:1px solid var(--gold);
  transition:background .4s var(--ease),border-color .4s var(--ease);
}
.cta__label{
  padding:0 1.75rem;font-size:.875rem;letter-spacing:.12em;color:#fff;
  transition:color .4s var(--ease);
}
.cta__arrow{
  display:grid;place-items:center;width:4rem;align-self:stretch;
  border-left:1px solid rgba(210,179,111,.45);
  font-family:var(--f-lat);font-size:1.125rem;color:var(--gold);
  transition:color .4s var(--ease),border-color .4s var(--ease);
}
.cta:hover{background:var(--gold);border-color:var(--gold)}
.cta:hover .cta__label,.cta:hover .cta__arrow{color:var(--navy-900)}
.cta:hover .cta__arrow{border-left-color:rgba(3,18,42,.28)}

.ticker{
  position:absolute;left:0;right:0;bottom:clamp(1.75rem,4vh,3rem);
  display:flex;align-items:center;justify-content:flex-end;gap:1.25rem;
  font-family:var(--f-lat);font-size:.8125rem;letter-spacing:.12em;
}
.ticker__now{color:#fff}
.ticker__all{color:rgba(255,255,255,.5)}
.ticker__track{
  position:relative;display:block;width:8rem;height:1px;
  background:rgba(255,255,255,.28);
}
.ticker__fill{
  position:absolute;left:0;top:0;height:1px;width:25%;
  background:var(--gold);transition:width .5s var(--ease);
}
.ticker__go{
  position:absolute;top:-.75rem;width:25%;height:1.5rem;
}
.ticker__go[data-goto="1"]{left:0}
.ticker__go[data-goto="2"]{left:25%}
.ticker__go[data-goto="3"]{left:50%}
.ticker__go[data-goto="4"]{left:75%}

/* ---------- sections ---------- */
.sec{padding-block:var(--sec-y)}
.sec--mist{background:var(--mist)}
.sec--paper{background:var(--paper)}
.sec--grey{background:var(--grey)}
.sec--navy{background:var(--navy-850);color:var(--on-navy-body)}

.sec__index{
  font-family:var(--f-lat);font-size:.75rem;font-weight:600;
  letter-spacing:.14em;color:var(--meta);margin-bottom:1.75rem;
}
.sec__title{
  font-family:var(--f-lat);font-weight:600;
  font-size:clamp(2rem,3.3vw,3rem);line-height:1;letter-spacing:.005em;
  color:var(--ink);
}
.sec__ja{font-size:.8125rem;letter-spacing:.1em;color:var(--meta);margin-top:1.25rem}
.sec__rule{display:block;width:3.625rem;height:2px;background:var(--gold);margin-top:1.75rem}
.sec--navy .sec__title{color:#fff}
.sec--navy .sec__index,.sec--navy .sec__ja{color:var(--on-navy-meta)}

.sec__top{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,34em);
  gap:2rem clamp(2rem,4vw,4rem);align-items:center;
  margin-bottom:clamp(3.5rem,7vw,6.5rem);
}
.sec__lead{font-size:.875rem;line-height:2.15;color:var(--body)}
.sec--navy .sec__lead{color:var(--on-navy-body)}

/* ---------- 01 MESSAGE ---------- */
.split{
  display:grid;grid-template-columns:minmax(0,32%) minmax(0,1fr);
  gap:3rem 0;align-items:start;
}
.lead-xl{
  font-size:clamp(1.3125rem,1.95vw,1.75rem);font-weight:500;
  line-height:1.65;letter-spacing:.06em;color:var(--ink);
}
.prose{margin-top:clamp(3rem,5.5vw,6rem);text-align:justify;text-justify:inter-character}
.sign{
  margin-top:clamp(4rem,9vw,8.5rem);text-align:right;
  font-size:.9375rem;letter-spacing:.06em;color:var(--ink);
}

/* ---------- 02 COMPANY PROFILE ---------- */
.spec{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:2.5rem;border-top:1px solid var(--line);
}
.spec__cell{
  display:grid;grid-template-columns:9.375rem minmax(0,1fr);
  gap:1rem;align-items:start;
  padding-block:2.5rem;min-height:7.5rem;
  border-bottom:1px solid var(--line);
}
.spec__cell--wide{grid-column:1 / -1}
.spec dt{font-size:.8125rem;letter-spacing:.1em;color:var(--meta);padding-top:.35rem}
.spec dd{font-size:.9375rem;letter-spacing:.06em;color:var(--ink);line-height:2.1}
.tel{
  font-family:var(--f-lat);font-size:1rem;letter-spacing:.06em;
  border-bottom:1px solid transparent;transition:border-color .3s var(--ease),color .3s var(--ease);
}
.tel:hover{color:var(--gold-deep);border-bottom-color:var(--gold)}

.officers{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:2.25rem 1.5rem;
}
.officers li{display:grid;grid-template-columns:5.5rem minmax(0,1fr);gap:.5rem;align-items:baseline}
.officers__role{font-size:.75rem;letter-spacing:.08em;color:var(--meta)}
.officers__name{font-size:.9375rem;letter-spacing:.02em;color:var(--ink)}

/* ---------- OUR APPROACH ---------- */
.approach{
  position:relative;isolation:isolate;overflow:hidden;
  background:var(--navy-800);color:var(--on-navy-body);
  padding-block:clamp(4rem,6.6vw,6rem);
}
.approach__media{
  position:absolute;inset:0;z-index:-1;
  background-image:var(--photo-approach);
  background-repeat:no-repeat;background-size:cover;background-position:18% 72%;
  -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 32%,transparent 62%);
  mask-image:linear-gradient(90deg,#000 0%,#000 32%,transparent 62%);
}
.approach__media::after{
  content:"";position:absolute;inset:0;background:rgba(11,41,72,.5);
}
.approach__wrap{display:grid;grid-template-columns:minmax(0,1fr)}
.approach__body{
  grid-column:1;justify-self:end;width:min(100%,30.75rem);
}
.approach__index{
  font-family:var(--f-lat);font-size:.75rem;font-weight:600;
  letter-spacing:.14em;color:var(--gold);margin-bottom:1.75rem;
}
.approach__title{
  font-size:clamp(1.375rem,2.1vw,1.875rem);font-weight:700;
  line-height:1.6;letter-spacing:.04em;color:#fff;margin-bottom:2.75rem;
}
.approach__text{font-size:.875rem;line-height:2.15;color:var(--on-navy-body)}

/* ---------- 03 NEWS ---------- */
.sec__head + .news{margin-top:clamp(3.5rem,7vw,6.5rem)}
.news{border-top:1px solid var(--line-strong)}
.news__row{
  display:grid;grid-template-columns:14.1875rem minmax(0,1fr) 3rem;
  gap:1.5rem;align-items:center;
  padding-block:3.25rem;border-bottom:1px solid var(--line-strong);
  transition:padding-inline .45s var(--ease),background .45s var(--ease);
}
.news__row:hover{background:rgba(255,255,255,.55);padding-inline:1.5rem}
.news__date{
  font-family:var(--f-lat);font-size:.8125rem;letter-spacing:.12em;color:var(--meta);
}
.news__title{font-size:1rem;letter-spacing:.06em;color:var(--ink)}
.news__go{
  display:grid;place-items:center;width:3rem;height:3rem;border-radius:50%;
  border:1px solid var(--line-strong);
  font-family:var(--f-lat);font-size:1.0625rem;color:var(--gold-deep);
  transition:border-color .4s var(--ease),background .4s var(--ease),color .4s var(--ease);
}
.news__row:hover .news__go{border-color:var(--gold);background:var(--gold);color:var(--navy-900)}

/* ---------- 03 GROUP ---------- */
.sec__head + .group{margin-top:clamp(3rem,6vw,5rem)}
.group{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem}
.gcard{
  display:flex;flex-direction:column;
  padding:clamp(2rem,3.4vw,3rem);
  background:var(--paper);border:1px solid var(--line);
  transition:border-color .4s var(--ease),transform .5s var(--ease);
}
.gcard:hover{border-color:var(--gold);transform:translateY(-4px)}
.gcard__tag{
  font-family:var(--f-lat);font-size:.6875rem;font-weight:600;
  letter-spacing:.16em;color:var(--gold-deep);
}
.gcard__name{
  margin-top:1.25rem;font-size:1.25rem;font-weight:500;letter-spacing:.04em;color:var(--ink);
}
.gcard__desc{margin-top:1.5rem;font-size:.875rem;line-height:2.1;color:var(--body)}
.gcard__more{
  margin-top:auto;padding-top:2.25rem;
  display:inline-flex;align-items:center;gap:.6rem;
  font-family:var(--f-lat);font-size:.8125rem;letter-spacing:.08em;color:var(--gold-deep);
}
.gcard__arrow{transition:transform .4s var(--ease)}
.gcard:hover .gcard__arrow{transform:translateX(.35rem)}

/* ---------- 04 SERVICES ---------- */
.sec__head + .svc{margin-top:clamp(3rem,6vw,5rem)}
.svc{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--line)}
.svc__cell{
  padding-block:clamp(2rem,3.4vw,3rem);
  border-bottom:1px solid var(--line);
}
.svc__cell:nth-child(odd){padding-right:clamp(2rem,4vw,4rem)}
.svc__cell:nth-child(even){padding-left:clamp(2rem,4vw,4rem);border-left:1px solid var(--line)}
.svc__no{
  font-family:var(--f-lat);font-size:.8125rem;font-weight:600;letter-spacing:.14em;color:var(--gold-deep);
}
.svc__title{
  margin-top:1rem;font-size:1.0625rem;font-weight:500;line-height:1.6;letter-spacing:.04em;color:var(--ink);
}
.svc__body{margin-top:1.25rem;font-size:.875rem;line-height:2.1;color:var(--body)}

/* ---------- BACKED BY — PHILLIPCAPITAL ---------- */
.capital{
  position:relative;isolation:isolate;overflow:hidden;
  padding-block:var(--sec-y);background:var(--navy-900);color:var(--on-navy-body);
}
.capital__glow{
  position:absolute;z-index:-1;top:-28%;left:50%;transform:translateX(-50%);
  width:min(120%,60rem);height:38rem;pointer-events:none;
  background:radial-gradient(ellipse at center,rgba(210,179,111,.14),transparent 68%);
}
.capital__head{text-align:center;max-width:46rem;margin-inline:auto}
.capital__eyebrow{
  font-family:var(--f-lat);font-size:.75rem;font-weight:600;letter-spacing:.28em;color:var(--gold);
}
.capital__title{
  margin-top:1.5rem;font-family:var(--f-lat);font-weight:500;
  font-size:clamp(2rem,4vw,3.25rem);line-height:1.05;letter-spacing:.01em;color:#fff;
}
.capital__lead{
  margin-top:2rem;font-size:.9375rem;line-height:2.2;letter-spacing:.04em;color:var(--on-navy-body);
}
.stats{
  margin-top:clamp(3.5rem,6vw,5.5rem);
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2.5rem 1.5rem;
  border-block:1px solid var(--line-navy);padding-block:clamp(2.5rem,4vw,3.5rem);
}
.stat{text-align:center}
.stat__num{
  font-family:var(--f-lat);font-weight:500;
  font-size:clamp(1.5rem,2.4vw,2.25rem);line-height:1;letter-spacing:-.01em;
  color:var(--gold);white-space:nowrap;
}
.stat__label{
  margin-top:1rem;font-family:var(--f-lat);font-size:.75rem;letter-spacing:.1em;color:var(--on-navy-meta);
}
.stat__unit{margin-left:.35rem;font-size:.6875rem}
.coverage{margin-top:clamp(3.5rem,6vw,5.5rem);text-align:center;max-width:52rem;margin-inline:auto}
.coverage__title{font-family:var(--f-lat);font-size:1rem;font-weight:600;letter-spacing:.12em;color:#fff}
.coverage__body{margin-top:1.5rem;font-size:.875rem;line-height:2.15;color:var(--on-navy-body)}
.coverage__list{margin-top:2rem;display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem .75rem}
.coverage__list li{
  font-family:var(--f-lat);font-size:.75rem;letter-spacing:.06em;color:var(--on-navy-meta);
  padding:.4rem .9rem;border:1px solid var(--line-navy);border-radius:999px;
}
.coverage__list .is-home{color:var(--navy-900);background:var(--gold);border-color:var(--gold)}

/* ---------- 04 CONTACT ---------- */
.contact{
  display:grid;grid-template-columns:minmax(0,40%) minmax(0,1fr);
  column-gap:8.3%;row-gap:4rem;
}
.contact__heading{
  font-size:1.0625rem;font-weight:700;letter-spacing:.1em;color:#fff;
  padding-bottom:1.5rem;border-bottom:1px solid var(--line-navy);
}
.contact__form .contact__heading{margin-bottom:1.875rem}
.info{padding-block:1.875rem 2.25rem;border-bottom:1px solid var(--line-navy)}
.info--last{border-bottom:0}
.info__label{
  font-family:var(--f-lat);font-size:.6875rem;font-weight:600;
  letter-spacing:.16em;color:var(--gold);margin-bottom:1.25rem;
}
.info__value{font-size:.9375rem;line-height:2.05;letter-spacing:.06em;color:#E4EAF1}
.info__value .tel{color:#E4EAF1}
.info__value .tel:hover{color:var(--gold)}
.info__jump{
  border-bottom:1px solid rgba(255,255,255,.28);padding-bottom:.3rem;
  transition:color .3s var(--ease),border-color .3s var(--ease);
}
.info__jump:hover{color:var(--gold);border-bottom-color:var(--gold)}

.form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3rem 2.25rem}
.field{display:grid;gap:1rem;align-content:start}
.field--wide{grid-column:1 / -1}
.field__label{
  font-family:var(--f-lat);font-size:.6875rem;font-weight:600;
  letter-spacing:.16em;color:var(--gold);
}
.field__input{
  width:100%;padding:0 0 .9rem;
  /* 入力欄だけは端末のフォントを使う。Webフォントはこのページに出てくる文字だけに
     絞ってあるため、利用者が入力した文字が欠けてしまうのを避ける。 */
  font-family:"Hiragino Kaku Gothic ProN","Yu Gothic","Meiryo",sans-serif;
  font-size:.9375rem;font-weight:300;letter-spacing:.06em;
  color:#fff;background:transparent;border:0;border-radius:0;
  border-bottom:1px solid rgba(255,255,255,.3);
  transition:border-color .35s var(--ease);
}
/* プレースホルダは固定の文言なのでWebフォントのままにする */
.field__input::placeholder{font-family:var(--f-jp);color:rgba(255,255,255,.42)}
.field__input:focus{outline:0;border-bottom-color:var(--gold)}
.field__input--area{resize:vertical;line-height:2.05;min-height:5.5rem;padding-top:.25rem}

.send{
  grid-column:1 / -1;
  display:grid;grid-template-columns:1fr auto;align-items:center;
  min-height:4.625rem;margin-top:1.5rem;
  background:var(--gold);color:var(--navy-850);
  transition:background .4s var(--ease);
}
.send__label{padding-left:1.875rem;text-align:left;font-size:.9375rem;letter-spacing:.12em}
.send__arrow{padding-right:1.875rem;font-family:var(--f-lat);font-size:1.125rem}
.send:hover{background:#E0C384}
.form__note{
  grid-column:1 / -1;margin-top:.5rem;
  font-size:.8125rem;line-height:1.9;letter-spacing:.04em;color:var(--on-navy-meta);
}
.form__notice{
  grid-column:1 / -1;font-size:.875rem;line-height:2;color:#F0E2C2;
  padding:1rem 1.25rem;background:rgba(210,179,111,.12);
  border-left:2px solid var(--gold);
}

/* ---------- footer ---------- */
.foot{
  display:flex;flex-wrap:wrap;gap:1.5rem;align-items:flex-start;justify-content:space-between;
  margin-top:clamp(3.5rem,6vw,5.25rem);padding-top:2.5rem;
  border-top:1px solid var(--line-navy);
}
.foot__brand{
  font-family:var(--f-lat);font-size:.9375rem;font-weight:600;
  letter-spacing:.14em;color:#fff;
}
.foot__copy{
  font-family:var(--f-lat);font-size:.75rem;line-height:1.7;letter-spacing:.04em;
  color:var(--on-navy-meta);text-align:right;
}

/* ---------- thanks（お問合せ送信完了ページ） ---------- */
.thanks{
  min-height:100vh;display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;
  padding:6rem var(--gut);background:var(--navy-900);color:var(--on-navy-body);
}
.thanks__eyebrow{
  font-family:var(--f-lat);font-size:.75rem;font-weight:600;
  letter-spacing:.28em;text-transform:uppercase;color:var(--gold);
}
.thanks__title{
  margin-top:1.75rem;font-family:var(--f-lat);font-weight:600;
  font-size:clamp(2.5rem,6vw,4.5rem);line-height:1.02;letter-spacing:.01em;color:#fff;
}
.thanks__title em{font-style:italic;font-weight:500;color:var(--gold)}
.thanks__text{
  margin-top:2rem;max-width:32rem;
  font-size:.9375rem;line-height:2.2;letter-spacing:.05em;color:var(--on-navy-body);
}
.thanks__home{
  margin-top:3rem;display:inline-block;padding-bottom:.35rem;
  border-bottom:1px solid rgba(255,255,255,.28);
  font-size:.875rem;letter-spacing:.08em;color:#E4EAF1;
  transition:color .3s var(--ease),border-color .3s var(--ease);
}
.thanks__home:hover{color:var(--gold);border-bottom-color:var(--gold)}
.thanks__home small{
  display:block;margin-top:.35rem;font-family:var(--f-lat);font-style:italic;
  font-size:.6875rem;letter-spacing:.1em;color:var(--on-navy-meta);
}
.thanks__brand{
  margin-top:4rem;font-family:var(--f-lat);font-size:.75rem;font-weight:600;
  letter-spacing:.16em;color:var(--on-navy-meta);
}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .nav,.nav__list{gap:2.5rem}
  .officers{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:899px){
  /* ヘッダーに backdrop-filter を掛けると内側の position:fixed の基準が
     ヘッダーになるため、モバイルでは使わない。 */
  .head,.head.is-scrolled{background:rgba(3,18,42,.95)}
  .logo{position:relative;z-index:112}
  .logo__mark img{height:2.4rem}
  .logo__ja{font-size:1rem}
  .burger{display:block}
  .nav{
    position:fixed;inset:0;z-index:111;
    flex-direction:column;align-items:flex-start;justify-content:center;
    gap:3rem;padding:7rem var(--gut-head) 4rem;overflow-y:auto;
    background:var(--navy-900);
    opacity:0;visibility:hidden;transform:translateY(-1rem);
    transition:opacity .4s var(--ease),transform .5s var(--ease),visibility .4s;
  }
  .nav.is-open{opacity:1;visibility:visible;transform:none}
  .nav__list{flex-direction:column;align-items:flex-start;gap:2rem;width:100%}
  .nav__list a{font-size:1.25rem;letter-spacing:.14em}
  .nav__lang{
    width:100%;padding-top:2rem;border-top:1px solid rgba(255,255,255,.14);
    font-size:1rem;
  }
  body.is-locked{overflow:hidden}

  .split{grid-template-columns:minmax(0,1fr)}
  .sec__top{grid-template-columns:minmax(0,1fr);align-items:start}
  .contact{grid-template-columns:minmax(0,1fr);column-gap:0}
  .approach__body{width:100%;justify-self:start}
  .approach__media{
    -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 22%,transparent 68%);
    mask-image:linear-gradient(180deg,#000 0%,#000 22%,transparent 68%);
  }
  .approach{padding-block:clamp(3.5rem,10vw,5rem)}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:719px){
  .spec{grid-template-columns:minmax(0,1fr);column-gap:0}
  .spec__cell{grid-template-columns:minmax(0,1fr);gap:.75rem;min-height:0;padding-block:1.75rem}
  .spec dt{padding-top:0}
  .officers{grid-template-columns:minmax(0,1fr);gap:1.25rem}
  .officers li{grid-template-columns:5.75rem minmax(0,1fr)}
  .news__row{grid-template-columns:minmax(0,1fr) 2.5rem;gap:.75rem 1rem;padding-block:2.25rem}
  .news__date{grid-column:1 / -1}
  .news__go{width:2.5rem;height:2.5rem;font-size:.9375rem}
  .form{grid-template-columns:minmax(0,1fr);gap:2.25rem}
  .foot{flex-direction:column}
  .foot__copy{text-align:left}
  .hero{min-height:0;padding-block:8.5rem 6.5rem}
  .ticker{justify-content:flex-start}
  .cta{width:100%}
  /* 狭い画面で1文字だけ次行に残らないよう字幅を詰める */
  .hero__title{font-size:1.9375rem;letter-spacing:.01em}
  .hero__name{letter-spacing:.04em}

  .group{grid-template-columns:minmax(0,1fr)}
  .svc{grid-template-columns:minmax(0,1fr)}
  .svc__cell,
  .svc__cell:nth-child(odd),
  .svc__cell:nth-child(even){padding:1.75rem 0;border-left:0}
  /* 桁数の多い数字（1,000,000,000）が枠からはみ出さないよう画面幅に追従させる */
  .stat__num{font-size:clamp(1.125rem,5.2vw,1.5rem)}
  .stat__label{font-size:.6875rem}
}

@media (max-width:600px){
  /* 通信量を抑えるため小さい書き出し（900px幅）に差し替える */
  :root{
    --photo-1:url("img/hero1-sm.webp");
    --photo-2:url("img/hero2-sm.webp");
    --photo-3:url("img/hero3-sm.webp");
    --photo-4:url("img/hero4-sm.webp");
    --photo-approach:url("img/hero1-sm.webp");
  }
}

@media (max-width:480px){
  .head__wrap{gap:1rem}
  .logo__mark img{height:2.05rem}
  .logo{gap:.75rem}
  .logo__ja{font-size:.8125rem;letter-spacing:.01em}
  .logo__en{font-size:.5625rem;letter-spacing:.14em}
}

/* ---------- motion ---------- */
[data-reveal]{opacity:0;transform:translateY(1rem);transition:opacity .9s var(--ease),transform .9s var(--ease)}
[data-reveal].is-in{opacity:1;transform:none}
.split__body [data-reveal],.sec__top [data-reveal],.approach__body [data-reveal]{transition-delay:var(--d,0s)}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.001ms !important;animation-delay:0ms !important;
    transition-duration:.001ms !important;
  }
  [data-reveal]{opacity:1;transform:none}
}