/* ============================================================
   C16 — ABOUT / BUSINESS / STRENGTH / GROUP / COMPANY / NEWS / CONTACT
   ============================================================ */

/* ---------- ABOUT：16→3→1 リダクション + 2段組 ------------ */
.about__top{
  display:grid;
  grid-template-columns:5fr 6fr;
  gap:64px;
  align-items:start;
}
.about__top .h-ja{ white-space:nowrap; }
.about__lead{ margin-top:24px; max-width:34em; }

.reduction{ width:100%; }
.red__row{
  display:grid;
  grid-template-columns:132px 1fr;
  gap:24px;
  align-items:center;
}
.red__num{
  font-family:var(--num);
  font-weight:600;
  font-size:var(--fs-96);
  line-height:1;
  letter-spacing:.02em;
  color:rgba(16,38,63,.16);
  font-variant-numeric:tabular-nums;
}
.red__row--1 .red__num{ color:var(--accent); }   /* 辰砂 ③ */

/* 16タイル */
.red__tiles{
  display:grid;
  grid-template-columns:repeat(8,1fr);
  gap:6px;
}
.red__tile{
  aspect-ratio:1;
  border:1px solid var(--line);
  background:var(--surface);
}
.red__tile--core{ background:var(--tint); border-color:var(--line-strong); }

/* 主力3バー */
.red__bars{ display:grid; gap:8px; }
.red__bar{
  height:56px;
  display:flex; align-items:center;
  padding-inline:18px;
  background:var(--tint);
  border:1px solid var(--line);
  font-size:var(--fs-14);
  font-weight:600;
  letter-spacing:.06em;
  color:var(--navy);
}
/* 理念1行 */
.red__one{
  height:56px;
  display:flex; align-items:center;
  padding-inline:18px;
  border:1px solid var(--line-strong);
  background:var(--surface);
  font-family:var(--mincho);
  font-weight:600;
  font-size:var(--fs-21);
  letter-spacing:.06em;
  color:var(--navy);
}
/* 段間コネクタ */
.red__connector{
  width:1px;
  height:36px;
  margin-left:calc(132px + 24px + 14px);
  background:var(--line-strong);
  transform:scaleY(0);
  transform-origin:top center;
}
.red__note{ margin-top:20px; }

/* 2段組本文（活字密度） */
.about__body{
  margin-top:80px;
  column-count:2;
  column-gap:40px;
  column-rule:1px solid var(--line);
  font-size:var(--fs-17);
  line-height:1.9;
}
.about__body p + p{ margin-top:1.5em; }

/* ---------- BUSINESS：ジグザグ3行（2層写真）--------------- */
.zig{ position:relative; height:500px; }
.zig__panel{
  position:absolute; inset:0 0 0 auto;
  width:62%;
  background:var(--navy);
  color:var(--on-navy);
}
.zig--alt .zig__panel{
  width:100%;
  background:var(--surface);
  color:var(--ink);
}
.zig__inner{
  position:relative;
  height:100%;
  max-width:var(--container);
  margin-inline:auto;
  padding-inline:var(--edge);
  display:grid;
  grid-template-columns:645px 1fr;
  gap:64px;
  align-items:center;
}
.zig--alt .zig__inner{ grid-template-columns:1fr 645px; }

/* 写真（パネルへオーバーハング） */
.zig__figure{
  position:relative;
  width:645px;
  z-index:2;
}
.zig--alt .zig__figure{ order:2; }
.zig__photo{
  width:645px;
  aspect-ratio:16/9;
  overflow:hidden;
  outline:1px solid var(--line-strong);
  outline-offset:-1px;
  background:var(--tint);
}
.zig__photo img{ width:100%; height:100%; object-fit:cover; }
.zig__macro{
  position:absolute;
  right:-24px; bottom:-24px;
  width:180px; height:180px;
  overflow:hidden;
  outline:1px solid rgba(255,255,255,.35);
  outline-offset:-1px;
  z-index:3;
}
.zig--alt .zig__macro{
  right:auto; left:-24px;
  outline-color:var(--line-strong);
}
/* Hero副写真と同素材のカットは、寄りを変えて別カットとして扱う */
.zig__macro img{ width:100%; height:100%; object-fit:cover; object-position:76% 58%; }

.zig__text{ position:relative; z-index:2; }
.zig__num{
  font-family:var(--num);
  font-weight:600;
  font-size:var(--fs-96);
  line-height:1;
  color:rgba(255,255,255,.22);
  font-variant-numeric:tabular-nums;
  margin-bottom:12px;
}
.zig--alt .zig__num{ color:rgba(16,38,63,.18); }
.zig__ttl{
  font-size:var(--fs-26);
  font-weight:700;
  letter-spacing:.08em;
  line-height:1.5;
  color:var(--surface);
}
.zig--alt .zig__ttl{ color:var(--navy); }
.zig__en{
  font-family:var(--en);
  font-size:var(--fs-12);
  font-weight:500;
  letter-spacing:.2em;
  color:var(--on-navy-mute);
  margin-top:10px;
}
.zig--alt .zig__en{ color:var(--ink2); }
.zig__txt{
  margin-top:20px;
  font-size:var(--fs-17);
  line-height:1.85;
  color:var(--on-navy);
  max-width:30em;
}
.zig--alt .zig__txt{ color:var(--ink); }
.zig__list{
  margin-top:24px;
  display:grid;
  gap:0;
  max-width:30em;
}
.zig__list li{
  padding:10px 0;
  border-top:1px solid var(--on-navy-line);
  font-size:var(--fs-14);
  color:var(--on-navy);
}
.zig--alt .zig__list li{
  border-top-color:var(--line);
  color:var(--ink);
}

/* ---------- STRENGTH -------------------------------------- */
.str__grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:36px;
}
.str__photo{
  width:100%;
  aspect-ratio:3/2;
  overflow:hidden;
  background:var(--tint);
}
.str__photo img{ width:100%; height:100%; object-fit:cover; }
.str__rule{
  height:1px;
  background:var(--line);
  margin-top:8px;
  transform:scaleX(0);
  transform-origin:left center;
}
.str__i{
  font-family:var(--en);
  font-size:var(--fs-12);
  font-weight:500;
  letter-spacing:.14em;
  color:var(--ink2);
  margin-top:20px;
}
.str__ttl{
  margin-top:10px;
  font-size:var(--fs-21);
  font-weight:700;
  line-height:1.6;
  letter-spacing:.04em;
  color:var(--navy);
}
.str__txt{
  margin-top:14px;
  font-size:var(--fs-17);
  line-height:1.9;
}

/* ---------- GROUP：事業体制図 ----------------------------- */
.group__chart{
  display:grid;
  grid-template-columns:180px 1fr;
  gap:0;
  align-items:stretch;
}
.grp__root{
  display:flex; align-items:center;
  justify-content:center;
  height:64px;
  align-self:center;
  background:var(--navy);
  color:var(--surface);
  font-family:var(--en);
  font-size:var(--fs-21);
  font-weight:600;
  letter-spacing:.08em;
}
.grp__branches{
  display:grid;
  gap:20px;
  position:relative;
  padding-left:48px;
}
/* エルボー（左の縦幹 + 各系統への横枝）＝ is-drawn で伸びる */
.grp__branches::before{
  content:"";
  position:absolute;
  left:0; top:24px; bottom:24px;
  width:1px;
  background:var(--line-strong);
  transform:scaleY(1);
  transform-origin:top center;
}
.js-ready .grp__branches::before{
  transform:scaleY(0);
  transition:transform 1.2s var(--ease-out);
}
.js-ready .is-drawn .grp__branches::before{ transform:scaleY(1); }

.grp__row{
  display:grid;
  grid-template-columns:180px 1fr;
  gap:20px;
  align-items:center;
  position:relative;
}
.grp__row::before{
  content:"";
  position:absolute;
  left:-48px; top:50%;
  width:48px; height:1px;
  background:var(--line-strong);
  transform:scaleX(1);
  transform-origin:left center;
}
.js-ready .grp__row::before{
  transform:scaleX(0);
  transition:transform .6s var(--ease-out);
}
.js-ready .is-drawn .grp__row::before{ transform:scaleX(1); }
.js-ready .is-drawn .grp__row:nth-child(1)::before{ transition-delay:.45s; }
.js-ready .is-drawn .grp__row:nth-child(2)::before{ transition-delay:.60s; }
.js-ready .is-drawn .grp__row:nth-child(3)::before{ transition-delay:.75s; }
.js-ready .is-drawn .grp__row:nth-child(4)::before{ transition-delay:.90s; }
.grp__node{
  height:48px;
  display:flex; align-items:center;
  padding-inline:16px;
  background:var(--surface);
  border:1px solid var(--line);
  font-size:var(--fs-14);
  font-weight:500;
  color:var(--navy);
}
/* 系統ごとの要約（16領域の列挙はHeroの銘板が担うため、ここでは数と代表のみ） */
.grp__meta{
  display:flex;
  align-items:baseline;
  gap:20px;
  flex-wrap:wrap;
}
.grp__count{
  font-family:var(--en);
  font-size:var(--fs-14);
  font-weight:600;
  letter-spacing:.1em;
  color:var(--navy);
  padding:4px 12px;
  border:1px solid var(--line-strong);
  white-space:nowrap;
}
.grp__ex{
  font-size:var(--fs-14);
  color:var(--ink2);
  letter-spacing:.04em;
}
.group__note{ margin-top:28px; text-align:right; }

/* ---------- COMPANY --------------------------------------- */
.cmp__body{
  display:grid;
  grid-template-columns:4fr 7fr;
  gap:64px;
  align-items:start;
}
.cmp__table{ max-width:var(--measure); }
.cmp__row{
  display:grid;
  grid-template-columns:168px 1fr;
  gap:20px;
  align-items:baseline;
  min-height:64px;
  padding-block:18px;
  border-bottom:1px solid var(--line);
}
.cmp__row:first-child{ border-top:1px solid var(--line); }
.cmp__key{
  font-size:var(--fs-14);
  font-weight:500;
  color:var(--ink2);
  letter-spacing:.08em;
}
.cmp__val{ font-size:var(--fs-17); line-height:1.8; }
.cmp__more{
  display:block;
  margin-top:24px;
  text-align:right;
  font-size:var(--fs-14);
  color:var(--ink2);
  transition:color var(--dur-hover) var(--ease-out);
}
.cmp__more:hover{ color:var(--navy); }

/* ---------- NEWS：罫線ゼロ -------------------------------- */
.news__list{ display:grid; }
.news__row{
  display:grid;
  grid-template-columns:112px 96px 1fr;
  gap:24px;
  align-items:center;
  min-height:64px;
}
.news__date{
  font-family:var(--en);
  font-size:var(--fs-14);
  color:var(--ink2);
  font-variant-numeric:tabular-nums;
  letter-spacing:.04em;
}
.news__tag{
  height:24px;
  display:inline-flex; align-items:center; justify-content:center;
  border:1px solid var(--line-strong);
  font-size:var(--fs-12);
  color:var(--ink2);
  letter-spacing:.06em;
}
.news__ttl{
  font-size:var(--fs-17);
  color:var(--ink);
  transition:color var(--dur-hover) var(--ease-out);
}
.news__row:hover .news__ttl{ color:var(--navy); }

/* ---------- CONTACT --------------------------------------- */
.contact{
  position:relative;
  background:var(--navy);
  color:var(--on-navy);
  overflow:hidden;
}
.contact__bg{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
  opacity:.12;
  filter:grayscale(1);
}
.contact__in{
  position:relative;
  min-height:420px;
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:center;
  gap:64px;
}
.contact__l{ position:relative; padding-right:64px; }
.contact__l::after{
  content:"";
  position:absolute;
  right:0; top:0; bottom:0;
  width:1px;
  background:var(--on-navy-line);
}
.contact__ttl{
  font-family:var(--mincho);
  font-weight:600;
  font-size:var(--fs-33);
  line-height:1.6;
  letter-spacing:.06em;
  color:var(--surface);
}
.contact__bar{
  width:40px; height:3px;
  background:var(--accent);       /* 辰砂 ④ */
  margin-block:20px;
}
.contact__txt{ font-size:var(--fs-17); line-height:1.9; color:var(--on-navy); }
.contact__r{ display:flex; flex-direction:column; align-items:flex-start; gap:20px; }
.contact__mail{
  font-family:var(--en);
  font-size:var(--fs-14);
  letter-spacing:.06em;
  color:var(--on-navy-mute);
}

/* 開帳する上端の罫（Contact進入時） */
.contact__open{
  position:absolute; inset:0 0 auto 0;
  height:1px;
}
.contact__open span{
  position:absolute; top:0;
  width:50%; height:1px;
  background:rgba(255,255,255,.5);   /* 辰砂は4箇所固定のためここでは使わない */
  transform:scaleX(0);
}
.contact__open .l{ left:0;  transform-origin:right center; }
.contact__open .r{ right:0; transform-origin:left center; }