@charset "utf-8";

/* =========================================================
   22業種プラットフォーム（network.html）専用スタイル
   共通部分は style.css を先に読み込むこと
   ※ 現時点は PC レイアウトのみ
   ========================================================= */

:root {
  --gold-deep: #8a6f3c;
  --slate: #425067;
}

/* ---------- 下層ページのヘッダー（帯あり） ---------- */
.gnav-bar { padding: 20px 0; background: var(--navy-deep); }

.gnav--solid {
  position: relative;
  top: auto;
  left: auto;
  transform: none;
  margin: 0 auto;
}

/* ---------- パンくず ---------- */
.crumb {
  display: flex;
  align-items: center;
  height: 60px;
  background: var(--paper);
}

.crumb__inner {
  width: min(var(--container-w), 100% - var(--gutter) * 2);
  margin: 0 auto;
  font-size: 16px;
  line-height: 32px;
  color: var(--navy);
}

.crumb__inner span { margin: 0 12px; }
.crumb__inner a { transition: color .25s ease; }
.crumb__inner a:hover { color: var(--gold); }


/* =========================================================
   FV
   ========================================================= */
.nwhero {
  position: relative;
  height: 900px;
  padding: 100px 0 0;
  overflow: hidden;
  background: radial-gradient(137.8% 295.8% at 97.6% 2.6%, #043187 0%, #0a1430 26.9%, #0a1430 80.3%, #052864 100%);
}

.nwhero__inner {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 20px;
  width: min(1422px, 100% - var(--gutter) * 2);
  margin: 0 auto;
}

.nwhero__body {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.nwhero__head { display: flex; flex-direction: column; gap: 30px; }

.nwhero__badge {
  display: flex;
  align-items: center;
  align-self: flex-start;
  gap: 10px;
  min-height: 60px;
  padding: 5px 20px;
  background: linear-gradient(98.4deg, #9e8149 .2%, #745820 100%);
  font-family: var(--f-serif);
  font-weight: 600;
  font-size: 24px;
  line-height: 34px;
  color: #fff;
}

.nwhero__badge svg { flex: none; width: 60px; height: 60px; }

.nwhero__title {
  font-family: var(--f-serif);
  font-weight: 600;
  font-size: 64px;
  line-height: 80px;
  color: var(--paper);
}

.nwhero__rule {
  width: 904px;
  max-width: 100%;
  height: 6px;
  margin-left: 2px;
  background: linear-gradient(90deg, #ffffff 0%, rgba(66, 80, 103, .2) 100%);
}

.nwhero__text {
  max-width: 920px;
  font-size: 20px;
  line-height: 32px;
  letter-spacing: .2em;
  color: #fff;
}

/* 提携の規模（6分野／22業種／約40社） */
.scale {
  display: flex;
  align-items: flex-end;
  gap: 40px;
  align-self: flex-start;
  margin: 0;
  padding-top: 20px;
  border-top: 2px solid var(--gold);
}

.scale > div { display: flex; align-items: flex-end; }

.scale dt {
  font-family: var(--f-en);
  font-weight: 700;
  font-size: 48px;
  line-height: 48px;
  letter-spacing: 1px;
  color: var(--gold);
}

.scale dt small {
  font-family: var(--f-jp);
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: 0;
  color: #fff;
}

.scale dd {
  margin: 0 0 -2px 8px;
  font-weight: 700;
  font-size: 16px;
  line-height: 28px;
  color: #fff;
}

/* 写真＋金の枠 */
.nwhero__photo {
  position: relative;
  flex: none;
  width: 480px;
  height: 623px;
}

.nwhero__photo img {
  position: absolute;
  top: 23px;
  left: 0;
  width: 450px;
  height: 600px;
  object-fit: cover;
}

.nwhero__frame {
  position: absolute;
  top: 0;
  left: 30px;
  width: 450px;
  height: 600px;
  border: 1px solid var(--gold-light);
}

/* 軌道装飾 */
.nwhero__orbits {
  position: absolute;
  top: -170px;
  left: 50%;
  margin-left: calc(var(--canvas-w) / -2);
  width: var(--canvas-w);
  height: 1710px;
  /* 文字より前に出さない */
  z-index: 0;
  pointer-events: none;
}

.nwhero__orbits > span {
  position: absolute;
  top: 0;
  left: 0;
  transform-origin: 0 0;
  border: 1px solid rgba(255, 255, 255, .4);
  border-radius: 50%;
}

.nwhero__orbit1 {
  width: 3415px; height: 2112px;
  transform: matrix(-0.96593, -0.25882, 0.25882, -0.96593, 2500.90186, 1706.29272) translate(227px, 218px);
}

.nwhero__orbit2 {
  width: 3001px; height: 2112px;
  transform: matrix(-0.96593, -0.25882, 0.25882, -0.96593, 2500.90186, 1706.29272) matrix(0.96593, -0.25882, 0.25882, 0.96593, 0.18442, 762.21692);
}

.nwhero__orbit3 {
  width: 3160.86px; height: 2042.64px;
  transform: matrix(-0.96593, -0.25882, 0.25882, -0.96593, 2500.90186, 1706.29272) matrix(0.96593, -0.25882, 0.25882, 0.96593, -99.31792, 935.04083);
}


/* =========================================================
   セクション共通
   ========================================================= */
.sec--network   { padding: 250px 0 120px; background: #fff; }
.sec--role      { padding: 120px 0; background: var(--paper); }
.sec--policy    { padding: 120px 0; background: var(--paper); }

.sec--selection {
  position: relative;
  padding: 120px 0;
  background: #16130f url("../img/neutrality-bg.jpg") no-repeat 50% 0 / 189.69% 100%;
}

.sec--selection::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(18, 16, 14, .86) 0%, rgba(18, 16, 14, .72) 100%);
}

.sec--selection .container { z-index: 1; }

.sec--network .sec__body   { margin-top: 80px; }
.sec--role .sec__body,
.sec--selection .sec__body,
.sec--policy .sec__body    { margin-top: 100px; }

/* ---------- ブロック見出し ---------- */
.blk__head { display: flex; flex-direction: column; gap: 20px; }

.blk__title {
  display: flex;
  align-items: center;
  gap: 20px;
  font-weight: 700;
  font-size: 32px;
  line-height: 1.2;
  color: var(--paper);
}

.blk__title img { flex: none; width: 50px; height: 50px; }

.blk__line {
  width: 700px;
  max-width: 100%;
  height: 1px;
  background: linear-gradient(90deg, #010c21 0%, rgba(191, 209, 244, .5) 100%);
}

.blk__line--role { background: linear-gradient(90deg, #010c21 0%, rgba(23, 43, 82, .44) 100%); }
.blk__line--blue { background: linear-gradient(90deg, #043187 0%, rgba(1, 12, 33, 0) 100%); }

.blk__lead {
  font-weight: 400;
  font-size: 20px;
  line-height: 32px;
  color: #fff;
}

.blk__head--dark .blk__title,
.blk__head--dark .blk__lead { color: var(--navy-deep); }

.blk__head--dark .blk__title img { filter: brightness(0) saturate(100%) invert(5%) sepia(38%) saturate(3000%) hue-rotate(207deg) brightness(95%) contrast(101%); }

.blk__lead p + p { margin-top: 16px; }

.blk__lead mark,
.role-text mark {
  background: linear-gradient(180deg, rgba(158, 129, 73, 0) 64%, rgba(158, 129, 73, .35) 64%);
  font-weight: 700;
  color: var(--ink);
}

/* ---------- 明朝の一文（帯） ---------- */
.say {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 128px;
  padding: 40px;
  background: var(--paper);
  font-family: var(--f-serif);
  font-weight: 600;
  font-size: 32px;
  line-height: 48px;
  text-align: center;
  color: var(--ink);
}

.say--navy {
  min-height: 164px;
  background: linear-gradient(135deg, #0c1b52 0%, #010c21 100%);
  color: #fff;
}

.say--one { min-height: 128px; }

.say--navy small {
  font-family: var(--f-jp);
  font-weight: 500;
  font-size: 16px;
  line-height: 28px;
  color: rgba(255, 255, 255, .8);
}


/* =========================================================
   01 6分野・22業種の一覧
   ========================================================= */
.fields6 {
  margin-top: 60px;
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.fblock {
  display: flex;
  background: #fff;
  box-shadow: 0 8px 24px rgba(10, 20, 48, .06), 0 1px 2px rgba(10, 20, 48, .06);
}

.fblock__card {
  position: relative;
  flex: none;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  width: 467px;
  height: 467px;
  padding: 40px;
  overflow: hidden;
  box-shadow: 0 0 0 1px rgba(232, 184, 92, .35);
}

.fblock__bg {
  position: absolute;
  z-index: 0;
  max-width: none;
  object-fit: cover;
}

.fblock__card--rights   .fblock__bg { left: -168px; top: 0;    width: 797px; height: 467px; }
.fblock__card--engineer .fblock__bg { left: -166px; top: 11px; width: 792px; height: 446px; }
.fblock__card--manage   .fblock__bg { left: -185px; top: 0;    width: 830px; height: 467px; }
.fblock__card--flow     .fblock__bg { left: 0;      top: 0;    width: 476px; height: 466px; }
.fblock__card--field    .fblock__bg { left: -162px; top: 13px; width: 784px; height: 441px; }
.fblock__card--life     .fblock__bg { left: -206px; top: 0;    width: 828px; height: 466px; }

.fblock__card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, rgba(1, 12, 33, .25) 45.1%, rgba(1, 12, 33, .78) 69.8%, #010c21 100%);
}

.fblock__en {
  position: relative;
  z-index: 2;
  font-family: var(--f-en);
  font-weight: 700;
  font-size: 66px;
  line-height: 59.4px;
  background: linear-gradient(180deg, #f7f9fc 0%, #939496 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.fblock__card h4 {
  position: relative;
  z-index: 2;
  margin-top: 23px;
  font-weight: 900;
  font-size: 24px;
  line-height: 1.4;
  color: #fff;
}

.fblock__card--rights h4,
.fblock__card--manage h4,
.fblock__card--field h4 {
  margin-top: 26px;
  font-weight: 700;
  line-height: 1.2;
}

.fblock__body {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0 32px;
}

/* 業種テーブル */
.ftable {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}

.ftable thead th {
  padding: 0 0 11px;
  border-bottom: 2px solid var(--navy-deep);
  font-weight: 700;
  font-size: 24px;
  line-height: 24px;
  letter-spacing: 2px;
  text-align: left;
  color: var(--gold-deep);
}

.ftable thead th:first-child { width: 29.8%; }

.ftable tbody th,
.ftable tbody td {
  padding: 17px 0;
  border-bottom: 1px solid var(--line-soft);
  vertical-align: middle;
}

.ftable tbody th {
  font-weight: 700;
  font-size: 20px;
  line-height: 32px;
  text-align: left;
  color: var(--ink);
}

.ftable tbody th span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 28px;
  margin-right: 13px;
  padding: 2px 11px;
  box-shadow: inset 0 0 0 1px var(--line);
  font-family: var(--f-en);
  font-weight: 600;
  font-size: 16px;
  line-height: 24px;
  color: var(--navy);
  vertical-align: middle;
}

.ftable tbody td {
  font-weight: 400;
  font-size: 20px;
  line-height: 32px;
  color: var(--muted);
}

.asof {
  margin-top: 40px;
  font-size: 16px;
  line-height: 32px;
  text-align: right;
  color: var(--navy-deep);
}

.sec--network .say { margin-top: 80px; }


/* =========================================================
   02 JUDGEの役割
   ========================================================= */
.sec--role .blk__head + .tower { margin-top: 80px; }

/* コントロールタワーの図 */
.tower { position: relative; padding-top: 40px; }

.tower__banner {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 2;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 670px;
  max-width: calc(100% - 40px);
  height: 69px;
  border-radius: 20px;
  background: var(--gold);
  font-family: var(--f-en);
  font-weight: 700;
  font-size: 36px;
  line-height: 36px;
  letter-spacing: 3px;
  color: #fff;
}

.tower__card {
  position: relative;
  min-height: 510px;
  padding: 94px 56px 66px;
  border: 2px solid var(--gold);
  background: #fff;
  overflow: hidden;
}

.tower__deco {
  position: absolute;
  top: 29px;
  left: 910px;
  width: 476px;
  height: 481px;
  max-width: none;
}

.tower__inner {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}

.tower__judge {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  width: 100%;
  min-height: 92px;
  padding: 16px 20px;
  background: linear-gradient(90deg, #e8b85c 0%, #b08f59 45%, #745820 100%);
}

.tower__logo { flex: none; width: 80px; height: 60px; object-fit: contain; }

.tower__judge ol {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 16px;
}

.tower__judge li {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 20px;
  border-radius: 999px;
  background: rgba(1, 12, 33, .25);
  font-weight: 700;
  font-size: 24px;
  line-height: 32px;
  color: #fff;
}

.tower__judge li::before {
  content: "";
  flex: none;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: #fff;
}

.tower__chev { flex: none; width: 22px; height: 22px; }

.tower__experts { display: flex; gap: 16px; width: 100%; }

.tower__experts > div {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 92px;
  padding: 16px 12px;
  background: linear-gradient(90deg, #3d63a8 0%, #1e4580 100%);
}

.tower__experts span {
  font-weight: 400;
  font-size: 20px;
  line-height: 28px;
  color: rgba(255, 255, 255, .85);
}

.tower__experts b {
  font-weight: 700;
  font-size: 26px;
  line-height: 32px;
  color: #fff;
}

.tower__note {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 80px;
  padding: 12px 20px;
  border: 1px solid var(--navy-deep);
  font-weight: 700;
  font-size: 26px;
  line-height: 28px;
  text-align: center;
  color: var(--ink);
}

.role-text {
  margin-top: 60px;
  padding: 16px 0;
  font-size: 20px;
  line-height: 32px;
  color: var(--ink);
}

.sec--role .say { margin-top: 60px; }

.sub { margin-top: 80px; }

/* 紹介したあとのフォロー */
.follow {
  margin-top: 40px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 32px;
}

.follow li {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 32px;
  background: #fff;
}

.follow li img { flex: none; width: 24px; height: 26px; }

.follow span {
  font-weight: 400;
  font-size: 20px;
  line-height: 32px;
  color: var(--ink);
}

.follow b { font-weight: 700; }


/* =========================================================
   03 どうやって選んでいるか
   ========================================================= */
.wavehead {
  position: relative;
  display: flex;
  align-items: center;
  gap: 16px;
  width: 706px;
  max-width: 100%;
  padding: 24px 0 16px;
  font-weight: 700;
  font-size: 32px;
  line-height: 48px;
  color: #fff;
}

.wavehead img { flex: none; width: 37px; height: 37px; }

.wavehead::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, rgba(191, 209, 244, .9) 0%, rgba(191, 209, 244, .1) 100%);
}

.rules {
  margin-top: 60px;
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.rule {
  display: flex;
  gap: 40px;
  padding: 32px 40px;
  background: rgba(66, 80, 103, .28);
  box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .45);
}

.rule--gold {
  background: linear-gradient(120.2deg, rgba(158, 129, 73, .35) -.1%, rgba(66, 80, 103, .22) 100.1%);
  box-shadow: inset 0 0 0 2px var(--gold-light);
}

.rule--mid { align-items: center; }

.rule__side { flex: none; width: 400px; padding-top: 2px; }

.rule__no {
  font-family: var(--f-en);
  font-weight: 700;
  font-size: 36px;
  line-height: 36px;
  letter-spacing: 1px;
  color: #fff;
}

.rule__title {
  margin-top: 12px;
  padding-bottom: 16px;
  font-weight: 700;
  font-size: 32px;
  line-height: 52px;
  letter-spacing: 1px;
  color: #fff;
}

.rule__body {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding-top: 2px;
}

.rule__body > p {
  font-size: 20px;
  line-height: 40px;
  color: #fff;
}

/* 強調は金のライン（ページ内で統一） */
.rule__body > p b,
.checks mark,
.remove-note b {
  background: linear-gradient(180deg, rgba(232, 184, 92, 0) 64%, rgba(232, 184, 92, .38) 64%);
  font-weight: 700;
  color: #fff;
}

/* 基準チェック */
.checks { display: flex; flex-direction: column; }

/* アイコンは絶対配置にして、本文はふつうの行として流す */
.checks li {
  position: relative;
  padding: 12px 0 12px 32px;
  border-bottom: 1px solid rgba(255, 255, 255, .16);
  font-size: 20px;
  line-height: 32px;
  color: #fff;
}

.checks li:first-child { padding-top: 0; }

.checks li img { position: absolute; top: 17px; left: 0; width: 22px; height: 22px; }

.checks li:first-child img { top: 5px; }

.rule__body .remove-note {
  padding: 15.5px 20px 18px;
  border-left: 3px solid var(--gold-light);
  background: rgba(255, 255, 255, .08);
  font-size: 20px;
  line-height: 32px;
  color: #fff;
}

/* 見積もり比較 */
.quotes {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 8px;
}

.quote {
  flex: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 186px;
  height: 82px;
  padding: 12px 8px;
  background: rgba(1, 12, 33, .45);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .55);
  font-size: 16px;
  line-height: 24px;
  color: #fff;
}

.quote b {
  font-family: var(--f-en);
  font-weight: 700;
  font-size: 20px;
  line-height: 32px;
  color: var(--gold-light);
}

.quotes__arrow { flex: none; width: 30px; height: 11px; }

.quotes__result {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 241px;
  height: 80px;
  padding: 12px;
  background: linear-gradient(90deg, #9e8149 0%, #745820 100%);
  font-weight: 700;
  font-size: 16px;
  line-height: 28px;
  text-align: center;
  color: #fff;
}

/* 中央の一文 */
.statement {
  margin-top: 32px;
  padding: 24px 32px;
  border-radius: 16px;
  background: rgba(255, 255, 255, .14);
  font-family: var(--f-serif);
  font-weight: 600;
  font-size: 32px;
  line-height: 48px;
  text-align: center;
  color: #fff;
}

/* 年次中立性レポート */
.rule__body .report { margin-top: 4px; }

.report {
  display: flex;
  align-items: center;
  gap: 40px;
  padding: 24px 32px;
  background: linear-gradient(90deg, #9e8149 0%, #c5ac6f 45%, #5b4726 100%);
}

.report__head {
  flex: none;
  width: 305px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.report__en {
  position: relative;
  white-space: nowrap;
  padding-bottom: 10px;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  letter-spacing: 3px;
  color: #fff;
}

.report__en::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 52px;
  height: 2px;
  background: #fff;
}

.report__ja {
  white-space: nowrap;
  font-family: var(--f-serif);
  font-weight: 700;
  font-size: 32px;
  line-height: 48px;
  color: #fff;
}

.report__list {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.report__list li {
  padding: 8px 16px;
  background: rgba(1, 12, 33, .35);
  font-weight: 700;
  font-size: 16px;
  line-height: 28px;
  color: #fff;
}

.rule__body .report__link { margin-top: 4px; }

.report__link {
  align-self: flex-start;
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 500;
  font-size: 16px;
  line-height: 28px;
  color: var(--gold-light);
  transition: filter .25s ease;
}

.report__link svg { flex: none; width: 18px; height: 18px; transition: transform .25s ease; }
.report__link:hover { filter: brightness(1.12); }
.report__link:hover svg { transform: translateX(5px); }


/* =========================================================
   04 提携の考え方
   ========================================================= */
.pol-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 46px;
}

.pol {
  display: flex;
  flex-direction: column;
  padding: 58px 50px;
  overflow: hidden;
}

.pol--navy {
  border-radius: 0 69px 69px 69px;
  background: linear-gradient(131.4deg, #1e4580 0%, #032658 100%);
}

.pol--gold {
  border-radius: 69px 0 69px 69px;
  background: linear-gradient(131.4deg, #9e8149 0%, #6b5731 100%);
}

.pol__title {
  display: flex;
  align-items: center;
  gap: 14px;
  padding-bottom: 22px;
  border-bottom: 1px solid rgba(255, 255, 255, .6);
  font-weight: 700;
  font-size: 32px;
  line-height: 46.4px;
  color: #fff;
}

.pol__title img { flex: none; width: 37px; height: 37px; }

.pol__body {
  margin-top: 26px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.pol__body p {
  font-weight: 400;
  font-size: 20px;
  line-height: 37px;
  color: #fff;
}

.pol--navy mark {
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 64%, rgba(232, 184, 92, .45) 64%);
  font-weight: 700;
  color: #fff;
}

.pol--gold mark {
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 64%, rgba(1, 12, 33, .35) 64%);
  font-weight: 700;
  color: #fff;
}

.pol__tags {
  margin-top: 28px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.pol__tags li {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px 8px 12px;
  border: 1px solid rgba(255, 255, 255, .7);
  font-weight: 700;
  font-size: 16px;
  line-height: 28px;
  color: #fff;
}

.pol__tags img { flex: none; width: 21px; height: 21px; }

.pol__numwrap {
  margin-top: 28px;
  display: flex;
  justify-content: center;
}

.pol__num {
  display: flex;
  align-items: center;
  gap: 30px;
  padding: 22px 30px;
  border: 1px solid rgba(255, 255, 255, .5);
  background: var(--navy-deep);
}

.pol__num-label,
.pol__num-unit {
  font-weight: 700;
  font-size: 22px;
  line-height: 35.2px;
  color: #fff;
}

.pol__num-label small {
  display: block;
  font-weight: 500;
  font-size: 15.84px;
  line-height: 25.3px;
  opacity: .8;
}

.pol__num b {
  font-family: var(--f-en);
  font-weight: 700;
  font-size: 88px;
  line-height: 79.2px;
  background: linear-gradient(180deg, #deb76b 0%, #9e8149 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* 提携をお考えの専門家の方へ */
.forpro {
  margin-top: 80px;
  padding: 50px 58px;
  border: 2px solid var(--gold);
  background: #fff;
}

.forpro__en {
  font-family: var(--f-en);
  font-weight: 700;
  font-size: 18px;
  line-height: 28.8px;
  letter-spacing: 2.52px;
  color: var(--gold);
}

.forpro__title {
  margin-top: 6px;
  font-family: var(--f-serif);
  font-weight: 700;
  font-size: 39.94px;
  line-height: 55.9px;
  color: var(--gold);
}

.forpro__body {
  max-width: 969px;
  margin-top: 22px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.forpro__body p {
  font-weight: 400;
  font-size: 18px;
  line-height: 32.4px;
  color: var(--navy-deep);
}

.forpro__body mark {
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 64%, rgba(158, 129, 73, .35) 64%);
  font-weight: 700;
  color: var(--navy-deep);
}

.forpro__btn {
  width: 300px;
  height: 68px;
  margin-top: 40px;
}


/* =========================================================
   NEXT Content（他ページと同じ作り）
   ========================================================= */
.next {
  padding: 120px 0;
  overflow: hidden;
  background: #fff;
}

.next__en {
  font-family: var(--f-en);
  font-weight: 700;
  font-size: 46px;
  line-height: 55px;
  letter-spacing: .1em;
  color: var(--gold);
}

.next__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 60px;
  margin-top: 40px;
}

.next__card {
  position: relative;
  display: block;
  height: 253px;
  overflow: hidden;
}

.next__card--policy {
  background:
    linear-gradient(rgba(51, 34, 0, .7), rgba(51, 34, 0, .7)),
    url("../img/policy-hero.jpg") no-repeat 0 70.99% / 100% 148.97%;
}

.next__card--fees {
  background:
    linear-gradient(111.3deg, rgba(10, 20, 48, .5) 0%, rgba(7, 60, 133, .5) 47.3%, rgba(104, 151, 225, .5) 100.8%),
    url("../img/next-fees.jpg") no-repeat center / cover;
}

.next__inner {
  display: flex;
  flex-direction: column;
  height: 100%;
  padding: 40px;
}

.next__label {
  font-weight: 700;
  font-size: 20px;
  line-height: 24px;
  color: var(--gold-light);
}

.next__title {
  margin-top: 20px;
  font-weight: 700;
  font-size: 24px;
  line-height: 29px;
  color: #fff;
}

.next__go {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: auto;
  font-weight: 500;
  font-size: 16px;
  line-height: 20px;
  color: #fff;
}

.next__go svg { width: 20px; height: 20px; flex: none; transition: transform .25s ease; }
.next__card:hover .next__go svg { transform: translateX(5px); }


/* =========================================================
   タブレット〜小さめPC
   ========================================================= */
@media (max-width: 1560px) and (min-width: 751px) {
  .nwhero__title { font-size: 56px; line-height: 72px; }
  .nwhero__photo { width: 420px; height: 560px; }
  .nwhero__photo img { top: 21px; width: 394px; height: 539px; }
  .nwhero__frame { left: 26px; width: 394px; height: 539px; }
  .nwhero { height: 860px; }

  .fblock__card { width: 420px; height: 440px; }
  .fblock__en { font-size: 58px; line-height: 52px; }
  .fblock__body { padding: 0 24px; }
  .ftable thead th { font-size: 22px; }
  .ftable tbody th,
  .ftable tbody td { font-size: 18px; line-height: 30px; }

  .tower__card { padding: 96px 40px 60px; }
  .tower__deco { left: auto; right: -60px; }
  .tower__judge li { font-size: 20px; padding: 10px 16px; }
  .tower__experts b { font-size: 24px; }
  .tower__note { font-size: 23px; }

  .pol { padding: 50px 40px; }
  .pol__title { font-size: 28px; line-height: 42px; }
}

@media (max-width: 1280px) and (min-width: 751px) {
  .nwhero { height: auto; padding: 90px 0 110px; }

  /* このページの内容：重なりをやめて通常フローに（他ページと同じ扱い） */
  .pn { position: relative; top: -110px; left: 0; margin-bottom: -30px; }
  .pn__label { color: var(--navy-deep); }
  .pn__label::after { background: var(--gold); }
  .pn__list { display: grid; grid-template-columns: repeat(2, 1fr); height: auto; }
  .pn__list > li { min-height: 220px; }
  .pn__list > li:nth-child(2n+1)::before { display: none; }
  .pn__list > li:nth-child(n+3) { box-shadow: inset 1px 0 0 var(--line-soft), inset 0 1px 0 var(--line-soft); }
  .pn__list > li:nth-child(2n+1):nth-child(n+3) { box-shadow: inset 0 1px 0 var(--line-soft); }
  .nwhero__inner { gap: 40px; }
  .nwhero__title { font-size: 48px; line-height: 64px; }
  .nwhero__badge { font-size: 21px; min-height: 54px; }
  .nwhero__badge svg { width: 48px; height: 48px; }
  .nwhero__text { font-size: 18px; line-height: 30px; letter-spacing: .12em; }
  .nwhero__photo { width: 360px; height: 480px; }
  .nwhero__photo img { top: 18px; width: 338px; height: 462px; }
  .nwhero__frame { left: 22px; width: 338px; height: 462px; }
  .scale { gap: 28px; }
  .scale dt { font-size: 40px; line-height: 40px; }

  .sec--network { padding: 150px 0 100px; }
  .sec--role,
  .sec--selection,
  .sec--policy { padding: 100px 0; }

  .sec-head__title { font-size: 38px; line-height: 60px; }
  .blk__title { font-size: 28px; }
  .blk__title img { width: 44px; height: 44px; }
  .say { font-size: 28px; line-height: 44px; }

  .fblock__card { width: 340px; height: 400px; padding: 32px; }
  .fblock__en { font-size: 46px; line-height: 42px; }
  .fblock__card h4 { font-size: 21px; margin-top: 18px; }
  .fblock__card--rights h4,
  .fblock__card--manage h4,
  .fblock__card--field h4 { margin-top: 20px; }
  .fblock__body { padding: 20px; }
  .ftable thead th { font-size: 19px; }
  .ftable tbody th,
  .ftable tbody td { font-size: 17px; line-height: 28px; padding: 13px 0; }
  .ftable tbody th span { margin-right: 10px; }

  .tower__banner { width: 560px; height: 62px; font-size: 30px; }
  .tower__card { padding: 84px 32px 52px; }
  .tower__deco { width: 380px; height: 384px; top: 40px; right: -80px; }
  .tower__judge { flex-wrap: wrap; gap: 14px; }
  .tower__judge li { font-size: 18px; line-height: 28px; gap: 6px; }
  .tower__judge li::before { width: 20px; height: 20px; }
  .tower__experts { gap: 12px; }
  .tower__experts span { font-size: 17px; }
  .tower__experts b { font-size: 21px; }
  .tower__note { font-size: 20px; line-height: 30px; min-height: 68px; }

  .follow { gap: 24px; }
  .follow li { padding: 24px; }
  .follow span { font-size: 18px; line-height: 30px; }

  .wavehead { font-size: 27px; line-height: 42px; }
  .rule { gap: 28px; padding: 28px 28px; }
  .rule__side { width: 300px; }
  .rule__title { font-size: 26px; line-height: 42px; }
  .rule__body > p { font-size: 18px; line-height: 34px; }
  .checks li { font-size: 18px; line-height: 30px; }
  .rule__body .remove-note { font-size: 18px; line-height: 30px; }
  .statement { font-size: 27px; line-height: 42px; }
  .report { gap: 24px; padding: 20px 24px; }
  .report__head { width: 240px; }
  .report__ja { font-size: 26px; line-height: 40px; }

  .pol-grid { gap: 32px; }
  .pol { padding: 44px 32px; border-radius: 0 48px 48px 48px; }
  .pol--gold { border-radius: 48px 0 48px 48px; }
  .pol__title { font-size: 24px; line-height: 36px; }
  .pol__body p { font-size: 18px; line-height: 32px; }
  .pol__num { gap: 20px; padding: 18px 22px; }
  .pol__num b { font-size: 70px; line-height: 64px; }
  .pol__num-label,
  .pol__num-unit { font-size: 19px; line-height: 30px; }

  .forpro { padding: 40px; }
  .forpro__title { font-size: 33px; line-height: 48px; }

  .next__grid { gap: 32px; }
  .next__title { font-size: 21px; line-height: 30px; }
}

@media (max-width: 1080px) and (min-width: 751px) {
  .nwhero__inner { flex-direction: column; align-items: flex-start; gap: 50px; }
  .nwhero__body { width: 100%; }
  .nwhero__photo { align-self: center; }

  .sec-head__title { font-size: 32px; line-height: 50px; }

  .fblock { flex-direction: column; }
  .fblock__card { width: 100%; height: 320px; }
  .fblock__bg { inset: 0; width: 100% !important; height: 100% !important; left: 0 !important; top: 0 !important; }
  .fblock__body { padding: 24px; }

  .tower__deco { display: none; }
  .tower__card { padding: 80px 24px 44px; }
  .tower__experts { flex-direction: column; }
  /* 縦並びでは PC の flex:1 1 0 が残ると高さが潰れる */
  .tower__experts > div { flex: none; min-height: 78px; }

  .follow { grid-template-columns: 1fr; }

  .rule { flex-direction: column; gap: 20px; }
  .rule--mid { align-items: stretch; }
  .rule__side { width: 100%; }
  .rule__title { padding-bottom: 0; }
  .report { flex-direction: column; align-items: stretch; gap: 20px; }
  .report__head { width: 100%; }

  .pol-grid { grid-template-columns: 1fr; }
  .pol--navy,
  .pol--gold { border-radius: 0 48px 48px 48px; }

  .next__grid { grid-template-columns: 1fr; }
  .next__card { height: auto; min-height: 220px; }
}

@media (max-width: 900px) and (min-width: 751px) {
  .nwhero__title { font-size: 40px; line-height: 56px; }
  .nwhero__rule { height: 4px; }
  .sec--network { padding: 130px 0 90px; }
  .say { font-size: 24px; line-height: 38px; }
  .statement { font-size: 23px; line-height: 38px; }
  .tower__banner { width: 420px; height: 54px; font-size: 24px; }
  .tower__judge ol { width: 100%; }
  .quotes { gap: 10px; }
  .quote { width: 150px; }
  .quotes__result { width: 200px; }
  .forpro__title { font-size: 28px; line-height: 42px; }
}


/* =========================================================
   スマホ（設計幅 750px / 1rem = 10 設計px）
   ========================================================= */
@media (max-width: 750px) {

  /* ---------- ヘッダーの帯（SP では固定ヘッダーなので不要） ---------- */
  .gnav-bar { padding: 0; background: none; }

  /* ---------- パンくず ---------- */
  .crumb {
    height: 8rem;
    margin-top: 11rem;
  }

  .crumb__inner {
    width: calc(100% - var(--gutter) * 2);
    font-size: 2.4rem;
    line-height: 1.6;
  }

  .crumb__inner span { margin: 0 1rem; }


  /* =========================================================
     FV
     ========================================================= */
  .nwhero {
    display: block;
    height: auto;
    padding: 8rem 0 16rem;
    background: radial-gradient(137.8% 200% at 97.6% 2.6%, #043187 0%, #0a1430 26.9%, #0a1430 80.3%, #052864 100%);
  }

  .nwhero__orbits {
    top: 0;
    left: 0;
    margin-left: 0;
    width: 100%;
    height: 100%;
  }

  .nwhero__orbits > span { border-color: rgba(255, 255, 255, .3); }

  .nwhero__orbit1 { width: 150rem; height: 62rem; transform: rotate(-14deg) translate(-52rem, 14rem); }
  .nwhero__orbit2 { width: 140rem; height: 54rem; transform: rotate(9deg) translate(-30rem, 30rem); }
  .nwhero__orbit3 { width: 128rem; height: 76rem; transform: rotate(-4deg) translate(-16rem, 8rem); }

  .nwhero__inner {
    display: block;
    width: calc(100% - var(--gutter) * 2);
  }

  .nwhero__body { width: 100%; gap: 4rem; }

  .nwhero__head { gap: 3rem; }

  .nwhero__badge {
    gap: 1.2rem;
    min-height: 6.4rem;
    padding: .5rem 2.4rem;
    font-size: 2.8rem;
    line-height: 1.4;
  }

  .nwhero__badge svg { width: 4.4rem; height: 4.4rem; }

  .nwhero__title { font-size: 5rem; line-height: 1.5; }

  .nwhero__rule { width: 100%; height: .6rem; margin-left: 0; }

  .nwhero__text {
    max-width: none;
    font-size: 2.5rem;
    line-height: 1.9;
    letter-spacing: .06em;
  }

  /* 提携の規模 */
  .scale {
    gap: 4.4rem;
    padding-top: 2.4rem;
    border-top-width: .3rem;
  }

  .scale dt { font-size: 6rem; line-height: 1; letter-spacing: .1rem; }
  .scale dt small { font-size: 2.2rem; line-height: 1.4; }
  .scale dd { margin: 0 0 -.4rem 1rem; font-size: 2.2rem; line-height: 1.6; }

  /* 写真＋金の枠 */
  .nwhero__photo {
    width: 60rem;
    height: 77.9rem;
    margin: 6rem auto 0;
  }

  .nwhero__photo img { top: 2.9rem; left: 0; width: 56.25rem; height: 75rem; }

  .nwhero__frame { top: 0; left: 3.75rem; width: 56.25rem; height: 75rem; border-width: .2rem; }


  /* =========================================================
     セクション共通
     ========================================================= */
  .sec--network   { padding: 0 0 10rem; }
  .sec--role      { padding: 10rem 0; }
  .sec--policy    { padding: 10rem 0; }

  .sec--selection {
    padding: 10rem 0;
    background-size: cover;
    background-position: 50% 50%;
  }

  .sec--network .sec__body { margin-top: 6rem; }

  .sec--role .sec__body,
  .sec--selection .sec__body,
  .sec--policy .sec__body { margin-top: 6rem; }

  /* ---------- ブロック見出し ---------- */
  .blk__head { gap: 2rem; }

  .blk__title { gap: 2rem; font-size: 3.4rem; line-height: 1.5; }

  .blk__title img { width: 6rem; height: 6rem; }

  .blk__line { width: 100%; }

  .blk__lead { font-size: 2.6rem; line-height: 1.85; }

  .blk__lead p + p { margin-top: 2rem; }

  /* ---------- 明朝の一文（帯） ---------- */
  .say {
    min-height: 0;
    padding: 4rem 3rem;
    font-size: 3rem;
    line-height: 1.6;
  }

  .say--navy { min-height: 0; padding: 4rem 3rem; gap: 1.6rem; }
  .say--one  { min-height: 0; }

  .say--navy small { font-size: 2.3rem; line-height: 1.7; }


  /* =========================================================
     01 6分野・22業種の一覧
     ========================================================= */
  .fields6 { margin-top: 5rem; gap: 3rem; }

  .fblock { display: block; }

  .fblock__card {
    width: 100%;
    height: 40rem;
    padding: 3rem;
    box-shadow: 0 0 0 .1rem rgba(232, 184, 92, .35);
  }

  .fblock__bg {
    inset: 0;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
  }

  .fblock__en { font-size: 6.8rem; line-height: .9; }

  .fblock__card h4,
  .fblock__card--rights h4,
  .fblock__card--manage h4,
  .fblock__card--field h4 { margin-top: 1.6rem; font-size: 3rem; line-height: 1.45; }

  .fblock__body { padding: 3rem 3rem 3.6rem; }

  /* 業種テーブルは縦積みに */
  .ftable,
  .ftable tbody,
  .ftable tr,
  .ftable th,
  .ftable td { display: block; width: auto; }

  .ftable thead { display: none; }

  .ftable tbody tr {
    padding: 2.6rem 0 2.8rem;
    border-bottom: 1px solid var(--line-soft);
  }

  .ftable tbody tr:last-child { border-bottom: 0; padding-bottom: 0; }

  .ftable tbody th {
    padding: 0;
    border: 0;
    font-size: 2.9rem;
    line-height: 1.5;
  }

  .ftable tbody th span {
    height: 3.8rem;
    margin-right: 1.6rem;
    padding: .2rem 1.2rem;
    box-shadow: inset 0 0 0 .1rem var(--line);
    font-size: 2.2rem;
    line-height: 1.4;
  }

  .ftable tbody td {
    padding: 1rem 0 0;
    border: 0;
    font-size: 2.5rem;
    line-height: 1.75;
  }

  .asof { margin-top: 3rem; font-size: 2.2rem; line-height: 1.6; }

  .sec--network .say { margin-top: 6rem; }


  /* =========================================================
     02 JUDGEの役割
     ========================================================= */
  .sec--role .blk__head + .tower { margin-top: 5rem; }

  .tower { padding-top: 3.4rem; }

  .tower__banner {
    width: 52rem;
    max-width: calc(100% - 4rem);
    height: 6.8rem;
    border-radius: 2rem;
    font-size: 3.2rem;
    line-height: 1;
    letter-spacing: .3rem;
  }

  .tower__card {
    min-height: 0;
    padding: 7rem 2.4rem 4.4rem;
    border-width: .2rem;
  }

  .tower__deco {
    top: 8rem;
    left: auto;
    right: -14rem;
    width: 38rem;
    height: 38.4rem;
  }

  .tower__inner { gap: 2rem; }

  .tower__judge {
    flex-direction: column;
    gap: 2.4rem;
    min-height: 0;
    padding: 3rem 2rem;
  }

  .tower__logo { width: 10.4rem; height: 7.8rem; }

  .tower__judge ol {
    flex-direction: column;
    align-items: stretch;
    gap: 1.4rem;
    width: 100%;
  }

  .tower__judge li {
    justify-content: center;
    gap: 1.2rem;
    padding: 1.2rem 2rem;
    border-radius: 9.9rem;
    font-size: 2.8rem;
    line-height: 1.5;
  }

  .tower__judge li::before { width: 2.6rem; height: 2.6rem; }

  .tower__chev { width: 3.2rem; height: 3.2rem; }

  .tower__experts { flex-direction: column; gap: 1.6rem; }

  .tower__experts > div { flex: none; width: 100%; min-height: 0; padding: 2.2rem 1.6rem; }

  .tower__experts span { font-size: 2.4rem; line-height: 1.5; }
  .tower__experts b { font-size: 3.2rem; line-height: 1.4; }

  .tower__note {
    min-height: 0;
    padding: 2.2rem 2rem;
    border-width: .1rem;
    font-size: 2.7rem;
    line-height: 1.6;
  }

  .role-text {
    margin-top: 5rem;
    padding: 0;
    font-size: 2.6rem;
    line-height: 1.9;
  }

  .sec--role .say { margin-top: 5rem; }

  .sub { margin-top: 7rem; }

  .follow {
    grid-template-columns: minmax(0, 1fr);
    gap: 2rem;
    margin-top: 3.4rem;
  }

  .follow li { gap: 2rem; padding: 3rem 2.6rem; }

  .follow li img { width: 3.2rem; height: 3.4rem; }

  .follow span { font-size: 2.6rem; line-height: 1.8; }


  /* =========================================================
     03 どうやって選んでいるか
     ========================================================= */
  .wavehead {
    width: 100%;
    gap: 1.6rem;
    padding: 2rem 0 1.8rem;
    font-size: 3.2rem;
    line-height: 1.5;
  }

  .wavehead img { width: 4.4rem; height: 4.4rem; }

  .rules { margin-top: 5rem; gap: 3rem; }

  .rule {
    display: block;
    padding: 3.6rem 3rem 4rem;
    box-shadow: inset 0 0 0 .2rem rgba(255, 255, 255, .45);
  }

  .rule--gold { box-shadow: inset 0 0 0 .2rem var(--gold-light); }

  .rule--mid { display: block; }

  .rule__side { width: 100%; padding-top: 0; }

  .rule__no { font-size: 3.6rem; line-height: 1; }

  .rule__title { margin-top: 1.2rem; padding-bottom: 0; font-size: 3.4rem; line-height: 1.5; }

  .rule__body { gap: 2rem; margin-top: 2.6rem; padding-top: 0; }

  .rule__body > p { font-size: 2.6rem; line-height: 1.9; }

  /* 基準チェック */
  .checks li { padding: 1.6rem 0 1.6rem 4.2rem; font-size: 2.5rem; line-height: 1.8; }

  .checks li img { top: 2.3rem; width: 2.8rem; height: 2.8rem; }

  .checks li:first-child img { top: .7rem; }

  .rule__body .remove-note {
    margin-top: 2rem;
    padding: 2rem 2rem 2.2rem;
    border-left-width: .3rem;
    font-size: 2.4rem;
    line-height: 1.8;
  }

  /* 見積もり比較 */
  .quotes { flex-wrap: wrap; gap: 1.6rem; margin-top: 1.2rem; }

  .quote {
    width: calc((100% - 3.2rem) / 3);
    height: 9rem;
    padding: 1.2rem .8rem;
    font-size: 2.1rem;
    line-height: 1.5;
    box-shadow: inset 0 0 0 .1rem rgba(255, 255, 255, .55);
  }

  .quote b { font-size: 2.6rem; line-height: 1.4; }

  .quotes__arrow { width: 3rem; height: 1.1rem; margin: 0 auto; transform: rotate(90deg); }

  .quotes__result { width: 100%; height: auto; padding: 2rem; font-size: 2.3rem; line-height: 1.6; }

  /* 中央の一文 */
  .statement {
    margin-top: 3rem;
    padding: 3rem 2.6rem;
    border-radius: 1.6rem;
    font-size: 3rem;
    line-height: 1.6;
  }

  /* 年次中立性レポート */
  .report {
    flex-direction: column;
    align-items: stretch;
    gap: 2.4rem;
    padding: 3rem 2.6rem;
  }

  .report__head { width: 100%; gap: 1.6rem; }

  .report__en {
    padding-bottom: 1.2rem;
    font-size: 2.2rem;
    line-height: 1.4;
    letter-spacing: .2rem;
  }

  .report__en::after { width: 6rem; height: .2rem; }

  .report__ja { font-size: 3.4rem; line-height: 1.4; }

  .report__list { gap: 1.2rem; }

  .report__list li { padding: 1.2rem 2rem; font-size: 2.3rem; line-height: 1.6; }

  .report__link { font-size: 2.4rem; line-height: 1.5; gap: 1.2rem; }

  .report__link svg { width: 2.8rem; height: 2.8rem; }


  /* =========================================================
     04 提携の考え方
     ========================================================= */
  .pol-grid { grid-template-columns: minmax(0, 1fr); gap: 3rem; }

  .pol { padding: 4.4rem 3rem; border-radius: 0 6rem 6rem 6rem; }

  .pol--gold { border-radius: 6rem 0 6rem 6rem; }

  .pol__title {
    gap: 1.6rem;
    padding-bottom: 2rem;
    font-size: 3.2rem;
    line-height: 1.5;
  }

  .pol__title img { width: 4.4rem; height: 4.4rem; }

  .pol__body { margin-top: 2.6rem; gap: 2rem; }

  .pol__body p { font-size: 2.6rem; line-height: 1.85; }

  .pol__tags { margin-top: 2.8rem; gap: 1.4rem; }

  .pol__tags li {
    gap: 1rem;
    padding: 1rem 2rem 1rem 1.6rem;
    font-size: 2.3rem;
    line-height: 1.5;
  }

  .pol__tags img { width: 2.8rem; height: 2.8rem; }

  .pol__numwrap { margin-top: 2.8rem; }

  .pol__num { gap: 2.4rem; padding: 2.4rem 2.8rem; }

  .pol__num-label,
  .pol__num-unit { font-size: 2.6rem; line-height: 1.5; }

  .pol__num-label small { font-size: 2rem; line-height: 1.5; }

  .pol__num b { font-size: 9.6rem; line-height: .9; }

  /* 提携をお考えの専門家の方へ */
  .forpro { margin-top: 6rem; padding: 4.4rem 3rem; border-width: .2rem; }

  .forpro__en { font-size: 2.2rem; line-height: 1.4; letter-spacing: .25rem; }

  .forpro__title { margin-top: 1rem; font-size: 4rem; line-height: 1.45; }

  .forpro__body { max-width: none; margin-top: 2.6rem; gap: 2rem; }

  .forpro__body p { font-size: 2.5rem; line-height: 1.85; }

  .forpro__btn { width: 100%; height: 9.2rem; margin-top: 4rem; }


  /* =========================================================
     NEXT Content
     ========================================================= */
  .next { padding: 10rem 0; }

  .next__en { font-size: 4.4rem; line-height: 1.3; }

  .next__grid { grid-template-columns: minmax(0, 1fr); gap: 3rem; margin-top: 4rem; }

  .next__card { height: 30rem; }

  .next__inner { padding: 4rem; }

  .next__label { font-size: 2.4rem; line-height: 1.5; }

  .next__title { margin-top: 1.6rem; font-size: 3rem; line-height: 1.5; }

  .next__go { gap: 1.2rem; font-size: 2.4rem; line-height: 1.4; }

  .next__go svg { width: 3.2rem; height: 3.2rem; }

}


/* =========================================================
   アニメーション：FV の入場
   ========================================================= */
.js .nwhero__badge,
.js .nwhero__title,
.js .nwhero__rule,
.js .nwhero__text,
.js .scale,
.js .nwhero__photo { animation: fvIn 1s cubic-bezier(.22, .61, .36, 1) both; }

.js .nwhero__badge { animation-delay: .1s; }
.js .nwhero__title { animation-delay: .24s; }
.js .nwhero__rule  { animation-delay: .38s; }
.js .nwhero__text  { animation-delay: .48s; }
.js .scale         { animation-delay: .58s; }
.js .nwhero__photo { animation-delay: .34s; }

.js .nwhero__orbits { animation: fadeIn 2s ease .3s both; }

/* 写真の金枠は、あとから線が引かれるように出す */
.js .nwhero__frame {
  clip-path: inset(0 100% 0 0);
  animation: frameIn 1.1s cubic-bezier(.22, .61, .36, 1) .72s both;
}

@keyframes frameIn {
  from { clip-path: inset(0 100% 0 0); }
  to   { clip-path: inset(0 0 0 0); }
}

/* 提携の規模：金の罫線も左から伸ばす */
.js .scale { position: relative; border-top-color: transparent; }

.js .scale::before {
  content: "";
  position: absolute;
  top: -2px;
  left: 0;
  width: 100%;
  height: 2px;
  background: var(--gold);
  transform: scaleX(0);
  transform-origin: left;
  animation: lineIn 1s cubic-bezier(.22, .61, .36, 1) .84s both;
}

@keyframes lineIn {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}

@media (max-width: 750px) {
  .js .scale::before { top: -.3rem; height: .3rem; }
}


/* =========================================================
   アニメーション：見出しの罫線を左から引く
   ========================================================= */
.js .blk__head[data-reveal] .blk__line {
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 1s cubic-bezier(.22, .61, .36, 1) .2s;
}

.js .blk__head[data-reveal].is-visible .blk__line { transform: scaleX(1); }

.js .wavehead[data-reveal]::after {
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 1s cubic-bezier(.22, .61, .36, 1) .25s;
}

.js .wavehead[data-reveal].is-visible::after { transform: scaleX(1); }


/* =========================================================
   アニメーション：コントロールタワーの図
   （上から順に「JUDGE →（矢印）→ 各専門家 → 注意書き」と組み上がる）
   ========================================================= */
.js .tower[data-reveal] .tower__banner,
.js .tower[data-reveal] .tower__judge,
.js .tower[data-reveal] .tower__chev,
.js .tower[data-reveal] .tower__experts > div,
.js .tower[data-reveal] .tower__note {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity .7s cubic-bezier(.22, .61, .36, 1),
              transform .7s cubic-bezier(.22, .61, .36, 1);
}

.js .tower[data-reveal] .tower__deco {
  opacity: 0;
  transition: opacity 1.4s ease .6s;
}

.js .tower[data-reveal].is-visible .tower__banner,
.js .tower[data-reveal].is-visible .tower__judge,
.js .tower[data-reveal].is-visible .tower__chev,
.js .tower[data-reveal].is-visible .tower__experts > div,
.js .tower[data-reveal].is-visible .tower__note {
  opacity: 1;
  transform: none;
}

.js .tower[data-reveal].is-visible .tower__deco { opacity: 1; }

.js .tower[data-reveal].is-visible .tower__banner { transition-delay: .06s; }
.js .tower[data-reveal].is-visible .tower__judge  { transition-delay: .2s; }
.js .tower[data-reveal].is-visible .tower__chev   { transition-delay: .36s; }
.js .tower[data-reveal].is-visible .tower__experts > div:nth-child(1) { transition-delay: .46s; }
.js .tower[data-reveal].is-visible .tower__experts > div:nth-child(2) { transition-delay: .56s; }
.js .tower[data-reveal].is-visible .tower__experts > div:nth-child(3) { transition-delay: .66s; }
.js .tower[data-reveal].is-visible .tower__note   { transition-delay: .8s; }


/* =========================================================
   アニメーション：数字と見積もり比較
   ========================================================= */
.js .pol[data-reveal] .pol__num {
  opacity: 0;
  transform: scale(.94);
  transition: opacity .7s cubic-bezier(.22, .61, .36, 1) .3s,
              transform .7s cubic-bezier(.22, .61, .36, 1) .3s;
}

.js .pol[data-reveal].is-visible .pol__num { opacity: 1; transform: none; }

.js .rule[data-reveal] .quote,
.js .rule[data-reveal] .quotes__arrow,
.js .rule[data-reveal] .quotes__result {
  opacity: 0;
  transform: translateY(12px);
  transition: opacity .6s cubic-bezier(.22, .61, .36, 1),
              transform .6s cubic-bezier(.22, .61, .36, 1);
}

.js .rule[data-reveal].is-visible .quote,
.js .rule[data-reveal].is-visible .quotes__arrow,
.js .rule[data-reveal].is-visible .quotes__result { opacity: 1; transform: none; }

.js .rule[data-reveal].is-visible .quote:nth-of-type(1) { transition-delay: .25s; }
.js .rule[data-reveal].is-visible .quote:nth-of-type(2) { transition-delay: .35s; }
.js .rule[data-reveal].is-visible .quote:nth-of-type(3) { transition-delay: .45s; }
.js .rule[data-reveal].is-visible .quotes__arrow        { transition-delay: .58s; }
.js .rule[data-reveal].is-visible .quotes__result       { transition-delay: .68s; }

@media (max-width: 750px) {
  .js .rule[data-reveal] .quotes__arrow { transform: rotate(90deg) translateY(12px); }
  .js .rule[data-reveal].is-visible .quotes__arrow { transform: rotate(90deg); }
}


/* =========================================================
   動きを減らす設定のときは、すべて出したままにする
   ========================================================= */
@media (prefers-reduced-motion: reduce) {

  .js .nwhero__frame { clip-path: none; animation: none; }
  .js .scale { border-top-color: var(--gold); }
  .js .scale::before { animation: none; transform: scaleX(1); }

  .js .blk__head[data-reveal] .blk__line,
  .js .wavehead[data-reveal]::after { transform: scaleX(1); transition: none; }

  .js .tower[data-reveal] .tower__banner,
  .js .tower[data-reveal] .tower__judge,
  .js .tower[data-reveal] .tower__chev,
  .js .tower[data-reveal] .tower__experts > div,
  .js .tower[data-reveal] .tower__note,
  .js .tower[data-reveal] .tower__deco,
  .js .pol[data-reveal] .pol__num,
  .js .rule[data-reveal] .quote,
  .js .rule[data-reveal] .quotes__result {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .js .rule[data-reveal] .quotes__arrow { opacity: 1; transform: none; transition: none; }
}

@media (prefers-reduced-motion: reduce) and (max-width: 750px) {
  .js .rule[data-reveal] .quotes__arrow { transform: rotate(90deg); }
}


/* =========================================================
   ホバー
   ========================================================= */
.fblock,
.rule,
.pol,
.forpro,
.follow li { transition: transform .35s ease, box-shadow .35s ease, background-color .25s ease; }

.fblock__bg { transition: transform .7s cubic-bezier(.22, .61, .36, 1); }

.fblock:hover { box-shadow: 0 16px 40px rgba(10, 20, 48, .12), 0 1px 2px rgba(10, 20, 48, .06); }
.fblock:hover .fblock__bg { transform: scale(1.05); }

.follow li:hover { transform: translateY(-4px); box-shadow: 0 14px 30px rgba(10, 20, 48, .08); }

.forpro:hover { box-shadow: 0 16px 40px rgba(158, 129, 73, .16); }

.pol:hover { transform: translateY(-4px); }

.ftable tbody tr { transition: background-color .25s ease; }
.ftable tbody tr:hover { background: rgba(158, 129, 73, .06); }

.tower__judge li { transition: background-color .25s ease; }
.tower__judge li:hover { background: rgba(1, 12, 33, .4); }

.nwhero__photo img { transition: transform .8s cubic-bezier(.22, .61, .36, 1); }
.nwhero__photo:hover img { transform: scale(1.03); }

@media (max-width: 750px) {
  .fblock:hover,
  .follow li:hover,
  .pol:hover { transform: none; box-shadow: none; }
  .fblock:hover .fblock__bg,
  .nwhero__photo:hover img { transform: none; }
}
