@charset "UTF-8";
/* ==========================================================================
   features.css — 私たちの特長（04 features.html） ページ固有スタイル（p-）
   参照カンプ：comps/pc/04_features_pc_01〜04・comps/sp/04_features_sp_01〜05
   共通トークン＝base.css／共通c-・l-＝common.css。ここはページ固有のみ。
   画像パス：page CSS は url(../../images/…)（2つ上）— CLAUDE.md §6.1
   ========================================================================== */

/* ページスコープ変数（他ページ確定で base.css へ昇格）
   識別色（緑/青緑/オリーブ）は TOP と同値＝サービス連番の識別色を踏襲 */
.p-features {
  --ft-green: #8AC54B;   /* SOLUTION02/アプローチ緑カード */
  --ft-teal:  #1DA3A2;   /* SOLUTION03/アプローチ青緑カード */
  --ft-olive: #C5B74B;   /* SOLUTION05 */
  --ft-card-bg: #D7E7F7; /* STRENGTH課題カード背景 */
  --ft-line:    #051E33; /* STRENGTH課題カード罫線・接続線（濃紺） */
}

/* --------------------------------------------------------------------------
   ページヒーロー（大見出し＋パンくず＋写真2枚）
   ※ 大見出しビジュアル .c-heading--page は common.css へ昇格（下層共通）
   -------------------------------------------------------------------------- */
/* 37 §5-2（FN 8/27）：ページ冒頭の余白をサービスページと同値に（works一覧＝33 §6-3 と同手法）。
   従来＝ヒーロー下96px＋lead上64px＝計160px → service（ヒーロー下0＋次セクション上96px）に統一 */
.p-features-hero { padding-block: var(--sp-6) 0; }

.p-features-hero__head {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

/* ヒーロー内パンくずは大見出し直下。共通c-breadcrumbの上下paddingを詰める */
.p-features-hero .c-breadcrumb { padding-block: var(--sp-3) 0; }

/* 写真2枚：パンくず下・右寄せの横並び（カンプ実測：右端≒1339・上端≒320・各≒345×275） */
.p-features-hero__photos {
  display: flex;
  justify-content: flex-end;
  gap: var(--sp-4);
  margin-top: var(--sp-3);
}

.p-features-hero__photo {
  display: block;
  width: min(30%, 345px);
  aspect-ratio: 5 / 4; /* カンプ実測：約345×275 */
  object-fit: cover;
  border-radius: 12px;
}

/* --------------------------------------------------------------------------
   リード（大見出しコピー＋本文＋網目グローブ装飾）
   -------------------------------------------------------------------------- */
.p-features-lead {
  position: relative;
  /* overflow は clip しない：グローブを lead/strength 境界へまたがせる（カンプ準拠）。
     lead は position:relative＝位置指定要素のため、装飾は後続のstrength背景の上に描画される。
     横スクロールは deco の right:0（ビューポート外へはみ出さない）で防止。SPのみ overflow:hidden で clip。 */
  padding-block: var(--sp-12) var(--sp-16); /* 上＝96px（37 §5-2：ヒーロー側の96pxを引き取り service と同ギャップ） */
}

.p-features-lead__deco {
  position: absolute;
  top: calc(46% - 100px); /* カンプ調整：100px上げ */
  right: 0;
  z-index: 0;
  width: min(64%, 900px); /* カンプ実測：球径≒500px（画像内で球は右下約53%）→表示幅約900px */
  pointer-events: none;
}

.p-features-lead__deco img { width: 100%; height: auto; }

.p-features-lead .l-container { position: relative; z-index: 1; }

.p-features-lead__catch {
  font-size: clamp(1.75rem, 1rem + 2.4vw, 2.625rem); /* 28→42px（カンプ実測） */
  font-weight: 700;
  line-height: 1.6;
}

.p-features-lead__accent { font-style: normal; color: var(--c-accent); }

.p-features-lead__text {
  max-width: 580px; /* 本文の折返し幅（指定） */
  margin-top: var(--sp-6);
  line-height: 2;
}

.p-features-lead__strong {
  font-style: normal;
  font-weight: 700;
  color: var(--c-blue);
  text-decoration: underline;
  text-underline-offset: 5px;
}

/* --------------------------------------------------------------------------
   STRENGTH（私たちの強み）：淡背景。3課題ボックス＋接続線＋結論
   -------------------------------------------------------------------------- */
.p-features-strength {
  position: relative;
  padding-block: var(--sp-12) 50px; /* 結論下の白余白（上の余白と揃える） */
}

/* 背景の下向き三角（淡背景）。上部は全幅、下端中央へ収束（カンプ実測：全幅→点）。
   コンテンツはクリップせず、装飾のみ三角にするため擬似要素で描画 */
.p-features-strength::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1; /* グローブ（lead内・z-index0）の背面へ。三角背景がグローブ下部を隠さないように */
  background: var(--c-bg-tint);
  /* 「3つの本質的な課題」ブロックのみ下向き三角。頂点(1318px)は下矢印の先端に一致。
     指示：∨の角度は15度＝深さ 50vw×tan15°≒13.4vw（アプローチ上端の∧と同角度）。
     点より下（結論）は tint なし＝白背景（指定） */
  clip-path: polygon(0 0, 100% 0, 100% calc(1318px - 13.4vw), 50% 1318px, 0 calc(1318px - 13.4vw));
}

.p-features-strength > .l-container { position: relative; z-index: 1; }

/* 本文ブロック：見出し（STRENGTH/私たちの強み）より内側・最大1040px */
.p-features-strength__body {
  max-width: 1040px;
  margin-left: 72px;
}

.p-features-strength__lead {
  max-width: 720px; /* 「なぜ〜」「現代の中小企業〜」ブロック幅（指定） */
  font-size: clamp(1.375rem, 1rem + 1.1vw, 1.75rem); /* 22→28px */
  font-weight: 700;
  line-height: 1.6;
}

.p-features-strength__text {
  max-width: 720px; /* 同上 */
  margin-top: var(--sp-4);
  line-height: 2;
}

.p-features-strength__sub {
  margin-top: var(--sp-8);
  font-size: 1.875rem; /* 30px */
  font-weight: 700;
}

.p-features-strength__sub strong { color: var(--c-text); font-weight: 700; } /* UA既定の bolder(=900) を打ち消し Bold固定 */

/* 課題ボックス群＋接続線。接続線は絶対配置でフロー全体に重ねる。
   下端に折れ線→下矢印の走行スペースを padding-bottom で確保 */
.p-features-strength__flow {
  position: relative;
  margin-top: var(--sp-4);
  padding-bottom: 230px; /* 折れ線→中央→長い下矢印の走行域（viewBox 714 − ボックス群484）。合流線とボックスの間に余白 */
}

.p-features-strength__problems {
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
  width: calc(100% - 130px); /* 右130pxを接続線レーンに空ける */
}

.p-features-strength__problem {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr); /* 数字カラムは中身(52px)に密着 */
  column-gap: var(--sp-2); /* 数字とタイトルを近づける */
  row-gap: var(--sp-3);
  align-items: center;
  padding: var(--sp-3) var(--sp-4);
  border: 3px solid var(--ft-line);
  background: var(--ft-card-bg);
}

.p-features-strength__num {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  padding: 5px;
  border-radius: 50%;
  background: var(--c-blue);
  color: var(--c-white);
  font-family: var(--font-en-bold); /* Bold英字＝差し替えフック */
  font-size: 42px;
  font-weight: 700;
  line-height: 1;
}

.p-features-strength__problem-title {
  font-size: var(--fs-xl); /* 24px */
  font-weight: 900; /* Black */
  /* 行間（行と行のアキ）を2倍：0.3em → 0.6em ＝ line-height 1.3 → 1.6（PC/SP共通・Hiroshi指示） */
  line-height: 1.6;
}

.p-features-strength__problem-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
  gap: var(--sp-3);
  align-items: center;
}

.p-features-strength__problem-text {
  font-size: var(--fs-base); /* 16px */
  font-weight: 500; /* Medium */
  line-height: 2; /* 37 §5-1（FN 8/27）：1.9→2.0＝PC/SPとも少し開ける */
}

.p-features-strength__problem-text em {
  font-style: normal;
  font-weight: 700;
  color: var(--c-accent);
}

/* 3課題→右レール→中央→下矢印の折れ線（装飾）。フロー全体に重ねる */
.p-features-strength__connector {
  position: absolute;
  inset: 0;
  color: var(--ft-line);
}

.p-features-strength__connector svg {
  width: 100%;
  height: 100%;
}

.p-features-strength__conclusion {
  margin-top: 46px; /* 結論上の白余白（下の余白と揃える。三角頂点から50px） */
  text-align: center;
  font-size: clamp(1.375rem, 1rem + 1.1vw, 1.75rem); /* 22→28px */
  font-weight: 700;
  line-height: 1.8;
}

.p-features-strength__conclusion-mark {
  font-style: normal;
  padding-bottom: 4px;
  border-bottom: 4px solid var(--c-accent); /* カンプ：1行目に赤下線（指定で4pxに） */
}

/* --------------------------------------------------------------------------
   3つのアプローチ（青灰パネル・上端中央がV字に尖る）
   -------------------------------------------------------------------------- */
.p-features-approach {
  padding-block: var(--sp-16) var(--sp-16);
  background: var(--c-blue-gray);
  color: var(--c-white);
  /* 上端中央を尖らせる（カンプ：屋根状の∧）。STRENGTHの下向き三角の先端と中央で接する。
     指示：∧の角度は15度＝深さ 50vw×tan15°≒13.4vw（STRENGTHの∨と同角度） */
  clip-path: polygon(0 13.4vw, 50% 0, 100% 13.4vw, 100% 100%, 0 100%);
}

.p-features-approach__title {
  margin-top: -50px; /* 見出しを上げる（指定） */
  text-align: center;
  font-size: clamp(1.5rem, 1rem + 1.6vw, 2rem); /* 24→32px */
  font-weight: 700;
}

/* 見出し→各カードへ分岐する白い矢印（カンプ準拠） */
.p-features-approach__arrows {
  width: 100%;
  max-width: var(--content-max);
  height: 130px;
  margin: var(--sp-4) auto 0;
  padding-inline: var(--content-pad);
  color: var(--c-white);
}

.p-features-approach__arrows svg { display: block; width: 100%; height: 100%; }

.p-features-approach__cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 370px));
  justify-content: center;
  gap: var(--sp-6);
  margin-top: var(--sp-4);
}

.p-features-approach__card {
  --card-accent: var(--c-blue);
  min-height: 460px;
  padding: var(--sp-5) var(--sp-3) var(--sp-4); /* 横パディングを狭く（カンプ） */
  border: 4px solid var(--card-accent);
  border-radius: 40px;
  background: var(--c-white);
  color: var(--c-text);
  text-align: center;
  box-shadow: 0 10px 20px rgba(0, 0, 0, .5); /* X0 Y10 B20 #000 50% */
}

.p-features-approach__card--green { --card-accent: var(--ft-green); }
.p-features-approach__card--blue  { --card-accent: var(--c-blue); }
.p-features-approach__card--teal  { --card-accent: var(--ft-teal); }

/* 支給アイコン（各カード色でpre-colored・viewBox120×94） */
.p-features-approach__icon {
  display: block;
  width: 92px;
  margin: 0 auto var(--sp-3);
}

.p-features-approach__icon img { width: 100%; height: auto; }

.p-features-approach__card-title {
  font-size: 1.625rem; /* 26px */
  font-weight: 900; /* Black */
  line-height: 1.4;
  color: var(--card-accent);
}

.p-features-approach__card-text {
  margin-top: var(--sp-3);
  text-align: left;
  font-size: var(--fs-base); /* 16px */
  line-height: 1.9;
}

/* --------------------------------------------------------------------------
   SOLUTION（私たちができること）：5サービスのリスト
   -------------------------------------------------------------------------- */
.p-features-solution { padding-block: var(--sp-16) var(--sp-16); }

.p-features-solution__lead {
  margin-top: calc(var(--sp-2) * -1);
  margin-bottom: var(--sp-8);
  font-size: var(--fs-xl); /* 24px */
  font-weight: 500; /* Medium */
  line-height: 1.9;
}

.p-features-solution__item {
  --svc-color: var(--c-blue);
  display: grid;
  grid-template-columns: 446px minmax(0, 1fr); /* 説明文開始位置をカンプに合わせる（左494相当） */
  gap: var(--sp-6);
  align-items: center;
  padding-block: var(--sp-5);
  border-bottom: 1px solid var(--c-line); /* #707070 */
}

.p-features-solution__item:first-child { border-top: 1px solid var(--c-line); }

.p-features-solution__item--01 { --svc-color: var(--c-blue); }
.p-features-solution__item--02 { --svc-color: var(--ft-green); }
.p-features-solution__item--03 { --svc-color: var(--ft-teal); }
.p-features-solution__item--04 { --svc-color: var(--c-blue); }
.p-features-solution__item--05 { --svc-color: var(--ft-olive); }

/* 上段＝番号＋タグ、下段＝タイトル（番号の左端から全幅）。カンプ準拠の並び */
.p-features-solution__head {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: var(--sp-2) var(--sp-3);
}

.p-features-solution__num {
  grid-column: 1;
  grid-row: 1;
  font-family: var(--font-en-bold); /* Bold英字＝差し替えフック */
  font-size: 3rem; /* 48px */
  font-weight: 700;
  line-height: 1;
  color: var(--svc-color);
}

.p-features-solution__tag {
  grid-column: 2;
  grid-row: 1;
  justify-self: start;
  width: 240px;
  padding: 3px 20px; /* 天地パディングを狭く */
  border-radius: 999px;
  background: var(--svc-color);
  color: var(--c-white);
  font-size: var(--fs-lg); /* 18px */
  font-weight: 700;
  text-align: center;
}

.p-features-solution__name {
  grid-column: 1 / -1; /* 番号の左端から全幅 */
  grid-row: 2;
  font-size: var(--fs-xl); /* 24px */
  font-weight: 900; /* Black */
}

.p-features-solution__desc {
  max-width: 650px; /* 説明文の最大幅（指定・カンプ実測643px） */
  font-size: .9375rem; /* 15px */
  line-height: 1.9;
}

.p-features-solution__desc strong { font-weight: 700; }

.p-features-solution__more {
  margin-top: var(--sp-8);
  text-align: right;
}

/* --------------------------------------------------------------------------
   STAFF（スタッフ紹介）：淡背景。縦組み英字名＋写真＋役職名
   -------------------------------------------------------------------------- */
.p-features-staff {
  padding-block: var(--sp-16) var(--sp-16);
  background: var(--c-bg-tint);
}

.p-features-staff__lead {
  margin-top: calc(var(--sp-2) * -1);
  margin-bottom: var(--sp-8);
  font-size: var(--fs-xl); /* 24px */
  font-weight: 500; /* Medium */
}

.p-features-staff__cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-8);
}

.p-features-staff__card {
  --staff-accent: var(--c-blue);
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  column-gap: 2px; /* 英字名を写真にさらに近づける */
}

.p-features-staff__card--blue  { --staff-accent: var(--c-blue); }
.p-features-staff__card--green { --staff-accent: var(--ft-green); }
.p-features-staff__card--teal  { --staff-accent: var(--ft-teal); }

/* 縦組み英字名（写真左・上から下＝頭を右へ傾けて読む。写真の天合わせ） */
.p-features-staff__en {
  writing-mode: vertical-rl;
  grid-row: 1 / 2;
  align-self: start; /* 写真の天合わせ */
  font-family: var(--font-en);
  font-size: 1.875rem; /* 30px */
  font-weight: 700;
  letter-spacing: 0;
  color: var(--c-text);
}

.p-features-staff__en em {
  font-style: normal;
  color: var(--staff-accent); /* イニシャルのみ識別色 */
}

.p-features-staff__photo {
  grid-column: 2 / 3;
  display: block;
  width: 100%;
  aspect-ratio: 5 / 7; /* 素材実寸 500×700 */
  object-fit: cover;
}

.p-features-staff__role {
  grid-column: 2 / 3;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--sp-2);
  margin-top: var(--sp-2);
}

.p-features-staff__position { font-size: var(--fs-base); } /* 16px */

.p-features-staff__name {
  font-size: 1.25rem; /* 20px */
  font-weight: 700;
}

.p-features-staff__more {
  margin-top: var(--sp-8);
  text-align: right;
}

/* CONTACT（お問い合わせバナー）は common.css の .c-contact へ昇格（下層共通） */

/* ==========================================================================
   SP（〜767px）：comps/sp/04_features_sp_01〜05 準拠
   ========================================================================== */
@media (max-width: 767px) {

  /* ヒーロー：見出し→パンくず→写真を素直に縦積み（カンプ：写真は縦に2枚） */
  .p-features-hero { padding-block: var(--sp-4) 0; } /* 37 §5-2：SPも service と同値（下0） */

  /* SPカンプは FEATURES 下の罫線なし・見出し間隔もタイト */
  .c-heading--page .c-heading__en { border-bottom: none; padding-bottom: 0; }
  .c-heading--page .c-heading__ja { margin-top: var(--sp-1); }

  /* SP修正02：他ページ（company等）と同じ「小さめ・横並び」の2枚組へ（縦積み全幅をやめる） */
  .p-features-hero__photos {
    width: 100%;
    margin-top: var(--sp-5);
  }

  .p-features-hero__photo { flex: 1 1 0; min-width: 0; width: auto; }

  /* リード：SPカンプは本文が無地白背景（グローブなし）。本文と重なるため SP では非表示 */
  .p-features-lead { padding-block: var(--sp-8) var(--sp-10); overflow: hidden; } /* 上＝64px（37 §5-2：service SP と同ギャップ） */
  .p-features-lead__deco { display: none; }
  .p-features-lead__text { max-width: none; }

  /* SPカンプ実測：リード見出し≒22px（「足元の「構造的な歪み」を整え、」が1行に収まる） */
  .p-features-lead__catch { font-size: 1.375rem; }

  /* STRENGTH：接続線・下向き矢印は非表示（u-pc-onlyで消えるが座標依存のため保険） */
  .p-features-strength { padding-block: var(--sp-8) var(--sp-3); } /* 結論テキスト下の白余白（24px＋次セクションmargin24px） */
  .p-features-strength__body { margin-left: 0; max-width: none; } /* SPは字下げ・幅制限なし */
  .p-features-strength__flow { padding-bottom: 0; } /* SPは接続線非表示のため走行域不要 */
  .p-features-strength__problems { width: 100%; } /* SPは接続線レーンを取らず全幅 */
  /* 追加指示：V字（矢印背景）は100px下げたまま、紫と紺の間の白帯を広げて
     結論テキスト2行を白帯内に収める＝V頂点はテキストの40px上で収束（テキストに被せない）。
     393px実測：下pad24＋テキスト（27px中央揃え・4行＝190px）＋余白40px＝頂点254px。
     角度は15度＝深さ13.4vw（アプローチ上端の∧と同角度・指示） */
  .p-features-strength::before { clip-path: polygon(0 0, 100% 0, 100% calc(100% - 254px - 13.4vw), 50% calc(100% - 254px), 0 calc(100% - 254px - 13.4vw)); }

  /* 課題ボックス：上段＝番号＋見出し、下段＝本文をボックス全幅（body を contents で親グリッドへ展開） */
  .p-features-strength__problem {
    grid-template-columns: 40px minmax(0, 1fr);
    column-gap: var(--sp-2);
    row-gap: var(--sp-2);
    align-items: center;
    padding: var(--sp-3) var(--sp-2); /* SPは左右パディングを詰めて見出し幅を確保 */
  }
  .p-features-strength__num { width: 40px; height: 40px; font-size: 1.25rem; }

  /* SPカンプ実測：小見出し≒20px／ボックス見出し≒18px・本文≒15px */
  .p-features-strength__sub { font-size: 1.25rem; }
  .p-features-strength__problem-title { font-size: 1.125rem; }
  .p-features-strength__problem-text { font-size: .9375rem; }
  .p-features-strength__problem-body { display: contents; }
  .p-features-strength__problem-title { grid-column: 2; grid-row: 1; }
  .p-features-strength__problem-text { grid-column: 1 / -1; grid-row: 2; }

  /* 結論：SPは中央揃え。37 §3-2（FN 8/27）＝27px→22px（周辺見出しスケール1段階下＝lead catch と同段）
     ＋改行位置を u-sp-only の <br> で固定＝4行（行1「〜追求、」／行2「〜伴走する」／
     行3「独自の立ち位置こそが、」／行4「CoreBizの支援の原点です。」）。
     ※旧「27px へ戻す」案は不可＝27pxだと行1（14字＝378px）が本文幅353pxを超えて折り返し5行になる。
       実測（393px・本文幅353px）：22px→最長308px／24px→336px／25px→350px／27px→折り返し。
       375px幅（本文幅335px）でも4行を維持できるのは22〜23px帯のため 22px を採用値とする。 */
  .p-features-strength__conclusion {
    text-align: center;
    font-size: 1.375rem; /* 22px */
  }

  /* sp_02準拠：ボックス3→結論の間に下向き矢印（PCの接続線の代替）。
     margin-top＝V字100px下げ（+100）→ボックス3下の空きを-40px調整（指示）＝84px */
  .p-features-strength__conclusion { margin-top: 84px; }
  .p-features-strength__conclusion::before {
    content: "";
    display: block;
    width: 24px;
    height: 72px;
    margin: 0 auto var(--sp-6);
    background: var(--c-text);
    clip-path: polygon(46% 0, 54% 0, 54% 70%, 100% 70%, 50% 100%, 0 70%, 46% 70%);
  }
  .p-features-strength__conclusion-mark {
    /* SPは折り返すため下線はテキスト装飾で（box-decoration-break） */
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
  }

  /* アプローチ：1カラム。∧は15度（13.4vw＝PCと共通の角度指定）。上margin24px */
  .p-features-approach {
    margin-top: var(--sp-3);
    padding-block: var(--sp-10);
    clip-path: polygon(0 13.4vw, 50% 0, 100% 13.4vw, 100% 100%, 0 100%);
  }
  /* SP修正05：カード下の空欄を詰める（PCの揃え高min-heightを解除し内容にフィット） */
  .p-features-approach__cards { grid-template-columns: 1fr; gap: var(--sp-5); }
  .p-features-approach__card { min-height: 0; }

  /* SPカンプ実測：白見出し≒20px（「他社にはできない、3つのアプローチ」が2行）
     カード見出し≒20px・本文≒15px */
  .p-features-approach__title { margin-top: 0; font-size: 1.25rem; }
  .p-features-approach__card-title { font-size: 1.25rem; }
  .p-features-approach__card-text { font-size: .9375rem; }

  /* SOLUTION：番号＋タグ＋名称→本文の縦積み */
  .p-features-solution { padding-block: var(--sp-10); }
  .p-features-solution__item { grid-template-columns: 1fr; gap: var(--sp-3); }

  /* SP修正06：リード文と最初の区切り線の間隔を詰める（64→24px） */
  .p-features-solution__lead { margin-bottom: var(--sp-3); }

  /* SPカンプ実測：番号≒28px／タグ≒幅200px・文字16px／タイトル≒20px */
  .p-features-solution__num { font-size: 1.75rem; }
  .p-features-solution__tag { width: 200px; font-size: var(--fs-base); }
  .p-features-solution__name { font-size: 1.25rem; }

  /* 右寄せ「詳しく見る」はSPで中央寄せ（矢印の外側はみ出しによる横スクロール回避／TOP踏襲） */
  .p-features-solution__more,
  .p-features-staff__more { text-align: center; }

  /* STAFF：1カラム。縦組み英字名は写真左のまま。SP修正07：全体を90%に縮小（中央寄せ） */
  .p-features-staff { padding-block: var(--sp-10); }
  .p-features-staff__cards {
    grid-template-columns: 1fr;
    gap: var(--sp-6);
    width: 90%;
    margin-inline: auto;
  }
  .p-features-staff__card { max-width: 420px; }
  .p-features-staff__lead,
  .p-features-solution__lead { font-size: var(--fs-lg); }

  /* CONTACT（.c-contact）のSPは common.css 側で対応 */
}

/* --------------------------------------------------------------------------
   下部CONTACTバナーの幅（37 §5-3・FN 8/27）：上部コンテンツ幅（l-container 実幅1240px）に合わせる。
   c-contact__frame の既定 max-width:1040px（common.css）を features のみ解除（他ページは従来どおり）。
   ※バナー画像の差し替えは 39 で別途
   -------------------------------------------------------------------------- */
.p-features .c-contact__frame { max-width: none; }