@charset "UTF-8";
/*
 * about（プルーセルの強み）Figma リデザイン専用スタイル
 * 適用範囲: page-about.php の <main class="redesign-about"> 配下のみ。
 * header/footer/既存グローバル(style.css)には干渉しない（.redesign-about 名前空間で限定）。
 * 例外: 末尾の「ヘッダー配色」ブロックのみヘッダーに介入する（.page-template-page-about で限定・理由は該当箇所に記載）。
 * 基準: Figma PC 1920幅・絶対座標（design-spec.md）。
 */

.redesign-about {
  font-family: "Noto Sans JP", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #001430;
}
/* =========================================================================
   PC版（≥768px）: Figma 1920幅・絶対座標。
   SP化（案A）でPC無回帰を守るため、既存の全PCルールを min-width:768px で丸ごとガードする。
   <768px ではこのブロックが一切効かず、素のflow（static・縦積み）に戻り、SPルールで再定義する。
   ========================================================================= */
@media (min-width: 768px) {
.redesign-about img { max-width: none; } /* テーマ既定の max-width:100% を絶対配置で打ち消す */

/* ===== S1 ヒーロー（Figma: 写真帯 y76–796 / 上部76pxは実ヘッダー領域） ===== */
.redesign-about .ra-hero {
  position: relative;
  height: 796px;
  background: #ffffff;
  overflow: hidden;
}
/* 背景写真: Figma node 656:483（x=-83, y=76, w=2085, h=720, opacity .75）
   fillは scaleMode:STRETCH＋imageTransform(scaleY=0.61786, txY≈0)＝上端起点で縦62%スライス表示。
   cover/center近似ではなく crop行列を厳密再現（DEF-008）: 縦161.84%(=1/0.61786)・上端アンカー */
/* 写真の開始位置は実ヘッダーの下端に一致させる（--ra-header-h は page-about.php が実測）。
   ヘッダーは .redesign-about の外にあり zoom がかからないため、÷var(--ra-zoom) で
   zoom を打ち消して実効位置を揃える。height を連動させるのはヒーロー下端(796px)を保つため。
   Figma固定値76pxのままだと 1920px幅で+1.8px、1440px幅で-17.2pxずれる。 */
.redesign-about .ra-hero::before {
  content: "";
  position: absolute;
  left: -83px;
  top: calc(var(--ra-header-h, 76px) / var(--ra-zoom, 1));
  width: 2085px;
  height: calc(796px - var(--ra-header-h, 76px) / var(--ra-zoom, 1));
  background: url("../img/about/hero-bg.jpg") no-repeat center top;
  /* height が可変になったため、旧 "100% 161.84%"（height相対）を等価な絶対値へ固定化。
     2085px × (720px × 161.84%) = 写真のスケールは画面幅によらず不変に保つ（DEF-008の再現を維持） */
  background-size: 2085px 1165.25px;
  opacity: .75;
  pointer-events: none;
}
.redesign-about .ra-hero__inner { position: relative; z-index: 1; }

/* STRENGTHS ラベル: 24px / 36 / 500 / ls .0417em / #001430@.5 / 中央 / y232 */
.redesign-about .ra-hero__label {
  position: absolute;
  left: 0; right: 0; top: 232px;
  margin: 0;
  text-align: center;
  font-size: 24px;
  line-height: 36px;
  font-weight: 500;
  letter-spacing: .0417em;
  color: rgba(0, 20, 48, .5);
}
/* 大見出し（画像マスク）: x=452, y=311, w=1015, h=227 → 中央寄せ */
.redesign-about .ra-hero__title {
  position: absolute;
  left: 50%; top: 311px;
  transform: translateX(-50%);
  margin: 0;
  width: 1015px;
}
.redesign-about .ra-hero__title img { display: block; width: 100%; height: auto; }
/* サブコピー（SVG）: x=625, y=570, w=669, h=84 → 中央寄せ */
.redesign-about .ra-hero__lead {
  position: absolute;
  left: 50%; top: 570px;
  transform: translateX(-50%);
  margin: 0;
  width: 669px;
}
.redesign-about .ra-hero__lead img { display: block; width: 100%; height: auto; }
.redesign-about .ra-hero__lead-txt { display: none; }   /* サブコピーのテキスト版はSP専用（PCはSVG画像） */

/* =========================================================================
   紺背景セクション群（S2〜S5）共通
   Figma: 背景 #001430（y796〜）/ コンテンツ中央コンテナ x240–1680・幅1440
   各セクションは flow で積み、内部要素は section 上端基準の絶対座標で配置。
   ========================================================================= */
.redesign-about .ra-strength {
  position: relative;
  width: 100%;
  background: #001430;
  color: #ffffff;
  overflow: hidden;
}
/* OUR EXPERTISE 帯（アイコン＋ラベル＋セクション名）
   Figmaは帯フレーム高さ110px＋上下中央寄せ（タイトルlineHeight110px）。
   実装が上揃えだとテキストが上に張り付きdividerとの余白がズレるため110pxバンド化（DEF-009） */
.redesign-about .ra-exhead {
  position: absolute;
  left: 240px;
  height: 110px;
  display: flex;
  align-items: center;
  gap: 24px;
}
.redesign-about .ra-exhead__icon { width: 54px; height: 59px; flex: none; }   /* SVG内に<g opacity="0.5">が既にあり、CSSで更に.5を掛けると白25%になりラベル(白50%)と色差。二重掛けを解消しラベルと一致（DEF: Figmaは炎とラベル同色[119,130,145]） */
.redesign-about .ra-exhead__label {
  font-size: 28px; font-weight: 700; color: rgba(255, 255, 255, .5); letter-spacing: .02em;
}
.redesign-about .ra-exhead__name {
  font-size: 34px; font-weight: 700; color: #ffffff; letter-spacing: .0588em;
}
/* 区切り線 */
.redesign-about .ra-strength__divider {
  position: absolute; left: 240px; width: 1440px; height: 2px; background: #D9D9D9; border: 0;
}
/* 大見出し */
.redesign-about .ra-strength__head {
  position: absolute; left: 238px; margin: 0;
  font-size: 38px; line-height: 1.3; font-weight: 700; color: #ffffff;
}
/* リード文 */
.redesign-about .ra-strength__lead {
  position: absolute; left: 240px; margin: 0;
  font-size: 20px; line-height: 40px; font-weight: 500; color: #ffffff;
}
/* 下部キャッチ枠 */
.redesign-about .ra-catch {
  position: absolute; left: 240px; width: 1440px; height: 120px; margin: 0;
  display: flex; align-items: center; justify-content: center;
  background: #F1FAFF; border-radius: 12px;
  /* Figma #656:505 は br=12px。立体感は背面 #F1FAFF/LAYER_BLUR(12px) 複製（#656:501）のグロー。
     z-index:-1 の疑似要素は親section背景に飲まれ消えるため box-shadow で移植（DEF-020） */
  box-shadow: 0 0 18px 1px rgba(241, 250, 255, .85);
  font-size: 32px; font-weight: 700; color: #003F96; text-align: center;
}
.redesign-about .ra-catch br { display: none; }   /* catch内の改行はSP専用（PCは1行・DEF-041） */

/* =========================================================================
   S2「成果を生み出す人材」（section 上端 = Figma y796）
   ========================================================================= */
.redesign-about .ra-strength--people { height: 1801px; }            /* y796〜2597 */
.redesign-about .ra-strength--people .ra-exhead       { top: 232px; }   /* y1028 */
.redesign-about .ra-strength--people .ra-strength__divider { top: 332px; } /* Figma y1136（実測で旧340は8px低く描画され区切り線下gapが不足） */
.redesign-about .ra-strength--people .ra-strength__head { top: 420px; width: 1198px; } /* y1216 見出しグリフ上端をFigma y1226へ（旧390は30px高く、区切り線下gap狭・見出し下余白過大の両方の真因） */
.redesign-about .ra-strength--people .ra-strength__lead { top: 500px; }  /* y1296 */
.redesign-about .ra-strength--people .ra-cards--people { position: absolute; top: 717px; left: 0; width: 100%; height: 916px; } /* y1513 */
.redesign-about .ra-strength--people .ra-synergy { top: 1425px; }   /* y2221 */
.redesign-about .ra-strength--people .ra-catch  { top: 1681px; }    /* y2477 */

/* カード本体（白・半透明・角丸） */
.redesign-about .ra-card {
  position: absolute; top: 0; width: 700px; height: 916px;
  background: rgba(255, 255, 255, .85); border-radius: 20px;
}
.redesign-about .ra-card--left  { left: 240px; }
.redesign-about .ra-card--right { left: 980px; }
/* ヘッダーバッジ ●実行力 / ●思考力 */
.redesign-about .ra-card__badge {
  position: absolute; top: 48px; left: 52px; width: 596px; height: 80px;
  display: flex; align-items: center; padding-left: 39px; box-sizing: border-box;
  background: linear-gradient(0deg, #001430 0%, #003F96 78%);
  border-radius: 12px; color: #ffffff; font-size: 36px; font-weight: 700;
}
/* 人物エントリ（人物画像＋本文） */
.redesign-about .ra-entry {
  position: absolute; left: 52px; width: 596px;
  display: flex; gap: 22px;
}
.redesign-about .ra-entry--1 { top: 187px; }   /* 人物 y1700 - card y1513 */
.redesign-about .ra-entry--2 { top: 448px; }   /* 人物 y1961 - card y1513 */
/* Figmaは右カード(思考力)のエントリが左(実行力)より13px上（実測 左entry1 y1715 / 右 y1702）。バッジは左右一致のためエントリのみ上げる */
.redesign-about .ra-card--right .ra-entry--1 { top: 174px; }
.redesign-about .ra-card--right .ra-entry--2 { top: 435px; }
.redesign-about .ra-entry__photo { width: 178px; flex: none; }
.redesign-about .ra-entry__photo img { display: block; width: 178px; height: auto; }
.redesign-about .ra-entry__body { flex: 1; padding-top: 6px; }
/* 吹き出し（Figma: 白@.75ピル＋左下の尾びれ状タレ）。border-image方式はタレが左辺全体に
   stretchされ消えるため、本体=背景色+角丸ピル、タレ=専用SVGを疑似要素で左下に配置（DEF-024） */
/* 吹き出し＝Figma正確形状の bubble.svg（ピル＋左下しっぽが1パス・.75白）を border-image 9スライスで適用。
   左端(しっぽ＋角=32)・右端(角=28)を固定し中央のみ横伸縮＝可変幅でも正確なしっぽ形状を維持（DEF-037）。
   旧CSS三角しっぽ(::before)は不正確だったため廃止。 */
.redesign-about .ra-entry__label {
  position: relative; display: inline-flex; align-items: center;
  height: 40px; box-sizing: border-box; white-space: nowrap;
  border-style: solid; border-color: transparent; border-width: 0 20px 0 26px;
  border-image: url("../img/about/bubble.svg") 0 28 0 32 fill;
  margin-bottom: 8px;
  font-size: 20px; line-height: 30px; font-weight: 700; color: #08183D;
  letter-spacing: -.06em;   /* 継承の1px(0.0625em)＋Noto字幅でピルが横に間延び。ラベルはnowrapで折返し不要なため詰めてFigmaのスナグ幅に合わせる */
}
.redesign-about .ra-entry__label br { display: none; }   /* ラベル内改行はSP専用（PCは1行nowrap・DEF-041） */
.redesign-about .ra-entry__title {
  margin: 0 0 8px; font-size: 26px; line-height: 36px; font-weight: 700; color: #003F96;
  letter-spacing: -.03em;   /* ブラウザNotoの字幅がFigmaより広く「驚異…動く。」の「く。」だけ折返す(実測+7px超過)。Figmaの詰め描画に寄せて1行目を収める */
}
.redesign-about .ra-entry__desc {
  margin: 0; font-size: 14px; line-height: 24px; font-weight: 500; color: #08183D;
}
/* カード下部の総括帯 */
/* ×ボックス（Figma: 両端矢じりの六角形リボン・白地・F1FAFFソフトグロー / DEF-003）
   clip-path 頂点はDLしたSVGパス(viewBox588×140・水平インセット32.14px=5.466%)から確定 */
.redesign-about .ra-card__sum {
  position: absolute; left: 56px; top: 708px; width: 588px; height: 140px;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  background: #ffffff; text-align: center; z-index: 1;
  clip-path: polygon(94.534% 0, 100% 50%, 94.534% 100%, 5.466% 100%, 0 50%, 5.466% 0);
}
/* Figmaは六角形まわりに約18〜20px幅の柔らかい発光（近縁+11/255・#F1FAFF系）で光沢を出している。
   注意: CSSは filter→clip-path の順で適用されるため、同一要素で blur+clip-path すると
   にじみが六角形に切り戻されハローが消える（drop-shadowが出ないのも同根）。
   → 外側の発光板に blur（クリップ無し）、内側::beforeに六角形clip-path を持たせて分離し、
     白六角形の背面でハローを出す */
.redesign-about .ra-card__sum-glow {
  position: absolute; left: 56px; top: 708px; width: 588px; height: 140px; z-index: 0;
  filter: blur(9px); pointer-events: none;
}
.redesign-about .ra-card__sum-glow::before {
  content: ""; position: absolute; inset: 0;
  clip-path: polygon(94.534% 0, 100% 50%, 94.534% 100%, 5.466% 100%, 0 50%, 5.466% 0);
  background: #F1FAFF;
}
.redesign-about .ra-card__sum-head { margin: 0; font-size: 28px; line-height: 28px; font-weight: 700; letter-spacing: .0357em; color: #08183D; }
.redesign-about .ra-card__sum-sub  { margin: 8px 0 0; font-size: 16px; line-height: 28px; font-weight: 500; letter-spacing: .0625em; color: #08183D; }
.redesign-about .ra-card__sum-sub br { display: none; }   /* sub内の改行はSP専用（PCは1行・DEF-039） */
/* × synergy（カード間）。Figmaは円ではなく2枚の白シェブロンが重なる白レンズ＋#F1FAFFぼかしグロー。
   cross-center.svg（blur込）を背面に敷く（DEF-012） */
.redesign-about .ra-synergy {
  position: absolute; left: 884px; width: 152px; height: 140px;
  display: flex; align-items: center; justify-content: center;
}
.redesign-about .ra-synergy::before {
  content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: 200px; height: 188px;
  background: url("../img/about/cross-center.svg") no-repeat center / contain;
}
.redesign-about .ra-synergy__mark {
  position: relative; font-size: 56px; font-weight: 700; color: #08183D; opacity: .5;
  line-height: 1; letter-spacing: .0179em;
}

/* =========================================================================
   S3「成果を証明する評価制度」（section 上端 = Figma y2597）
   構造: 白ラッパー(opacity.85)＋上部グラデ帯＋2×2の白カード4枚
   ========================================================================= */
.redesign-about .ra-strength--system { height: 1717px; }              /* y2597〜4314 */
.redesign-about .ra-strength--system .ra-exhead          { top: 160px; }  /* y2757 */
.redesign-about .ra-strength--system .ra-strength__divider { top: 260px; }/* Figma y2865（旧268は8px低い。S2と同基準に統一） */
.redesign-about .ra-strength--system .ra-strength__head  { top: 356px; width: 820px; } /* 見出しグリフ上端をFigma y2962へ（旧325は31px高くgap不揃い。S2の是正と統一） */
.redesign-about .ra-strength--system .ra-strength__lead  { top: 435px; width: 1000px; }/* y3032 */
.redesign-about .ra-strength--system .ra-catch           { top: 1432px; } /* y4029 */

.redesign-about .ra-evalwrap {
  position: absolute; top: 615px; left: 240px; width: 1440px; height: 769px; /* y3212 */
  background: rgba(255, 255, 255, .85); border-radius: 20px;
}
.redesign-about .ra-evalwrap__band {
  position: absolute; top: 48px; left: 52px; width: 1340px; height: 106px;   /* y3260 */
  display: flex; align-items: center; padding-left: 51px; box-sizing: border-box;
  background: linear-gradient(0deg, #001430 0%, #003F96 78%);
  border-radius: 12px; color: #ffffff; font-size: 36px; font-weight: 700;
}
/* カード背景の炎ロゴ装飾（Figma: #001430 opacity.08 をカード右に大きく配置・角丸でマスク / DEF-010）
   ノード656:964をPNGレンダリング（8%・マスク焼込）。右端で一部クリップ＝position右に振る */
.redesign-about .ra-evalcard {
  position: absolute;
  background: #ffffff url("../img/about/s3-card-deco.png") no-repeat;
  background-position: calc(100% - 40px) bottom;   /* Figmaは炎を右端に張付けず右余白約49px（実測 右端902/card右951）。旧+20pxは右にはみ出し過大 */
  background-size: auto 235px;                      /* Figmaの炎高さ約227に合わせ僅かに縮小（旧250はやや大きい） */
  border-radius: 12px;
  padding: 41px 60px; box-sizing: border-box;
}
.redesign-about .ra-evalcard--1 { top: 174px; left: 52px;  width: 661px; height: 250px; } /* y3386 */
.redesign-about .ra-evalcard--2 { top: 174px; left: 731px; width: 661px; height: 250px; }
.redesign-about .ra-evalcard--3 { top: 442px; left: 52px;  width: 661px; height: 280px; } /* y3654 */
.redesign-about .ra-evalcard--4 { top: 442px; left: 731px; width: 661px; height: 280px; }
.redesign-about .ra-evalcard__head { margin: 0 0 14px; font-size: 30px; line-height: 40px; font-weight: 700; color: #003F96; }
.redesign-about .ra-evalcard__body { margin: 0; font-size: 16px; line-height: 26px; font-weight: 500; letter-spacing: .0625em; color: #08183D; }
/* 「●評価制度 — クライアント成果に直結する報酬設計」の2行目が内側541pxだと3行折返し→下部はみ出し。
   Figmaは560pxで2行だが、ブラウザのNoto Sans JP描画が僅かに広く560では3行化するため、
   カード内に収まる最大幅601px（左pad60+601=661）まで広げて確実に2行に収める（DEF-005） */
.redesign-about .ra-evalcard--3 .ra-evalcard__head { width: 601px; letter-spacing: -.01em; }

/* =========================================================================
   S4「成果を再現する資産と仕組み」（section 上端 = Figma y4314）
   背景は #001430→#0A075A の縦グラデ。左：実績ナレッジ/右上：常駐型/右下：7ステップ
   ========================================================================= */
.redesign-about .ra-strength--asset {
  height: 1999px;                                                       /* y4314〜6313 */
  background: linear-gradient(180deg, #001430 0, #001430 750px, #0A075A 1153px, #0A075A 1999px);
}
.redesign-about .ra-strength--asset .ra-exhead          { top: 0; }
.redesign-about .ra-strength--asset .ra-strength__divider { top: 102px; left: 230px; } /* Figma y4424（旧110は8px低い。S2/S3と統一） */
.redesign-about .ra-strength--asset .ra-strength__head  { top: 191px; left: 220px; width: 980px; } /* 見出しグリフ上端をFigma y4515へ（旧160は31px高くgap不揃い。S2/S3の是正と統一） */
.redesign-about .ra-strength--asset .ra-strength__lead  { top: 270px; width: 1120px; } /* y4584 */
.redesign-about .ra-strength--asset .ra-catch           { top: 1719px; }              /* y6033 */

/* 左カード：累計プロジェクト数 */
.redesign-about .ra-asset-main {
  position: absolute; top: 450px; left: 240px; width: 701px; height: 918px;          /* y4764 */
  background: rgba(255, 255, 255, .85); border-radius: 20px;
}
.redesign-about .ra-asset-main__head { position: absolute; top: 20px; left: 52px; margin: 0; font-size: 34px; font-weight: 700; color: #08183D; }
.redesign-about .ra-asset-num__bg  { position: absolute; top: 181px; left: 57px; width: 389px; height: 80px; background: #ffffff; }
/* 「950」はDIN Condensed。環境依存のフォント代替では幅が一致しないため画像化（全環境で確定再現・DEF-014）。
   グリフ169×117を card相対(60,128)に配置＝白ラベル(181-261)に対し下揃え・上部が突き出す */
.redesign-about .ra-asset-num__big { position: absolute; top: 128px; left: 60px; width: 169px; line-height: 0; }
.redesign-about .ra-asset-num__big img { display: block; width: 169px; height: auto; }
.redesign-about .ra-asset-num__unit{ position: absolute; top: 188px; left: 244px; font-size: 68px; font-weight: 900; line-height: 1; letter-spacing: -.0147em; color: #003F96; }  /* 950ベースラインに合わせ上げ DEF-014 */
.redesign-about .ra-asset-num__note{ position: absolute; top: 232px; left: 459px; font-size: 16px; font-weight: 500; color: #08183D; }
.redesign-about .ra-asset-main__desc { position: absolute; top: 292px; left: 60px; width: 585px; margin: 0; font-size: 16px; line-height: 28px; font-weight: 500; color: #08183D; }
.redesign-about .ra-asset-table { position: absolute; top: 414px; left: 40px; width: 621px; height: 314px; background: #ffffff; border-radius: 12px; }
/* 区切り線: Figma実測は #7F7F7F(127,127,127)・2px（旧#B5BCC6/1pxは薄く細い） */
.redesign-about .ra-asset-table::before { content: ""; position: absolute; left: 309px; top: 24px; width: 2px; height: 266px; background: #7F7F7F; }
.redesign-about .ra-asset-table::after  { content: ""; position: absolute; left: 28px; top: 156px; width: 565px; height: 2px; background: #7F7F7F; }
/* 上下段の行間はFigma実値142px（旧157で16px広すぎ）。上段+8/下段-8で区切り線側へ寄せ中央に揃える */
.redesign-about .ra-asset-cell { position: absolute; width: 270px; }
.redesign-about .ra-asset-cell--tl { top: 36px; left: 28px; }
.redesign-about .ra-asset-cell--tr { top: 36px; left: 330px; }
.redesign-about .ra-asset-cell--bl { top: 177px; left: 28px; }
.redesign-about .ra-asset-cell--br { top: 177px; left: 330px; }
.redesign-about .ra-asset-cell .h { margin: 0 0 8px; font-size: 22px; font-weight: 700; color: #001430; }
.redesign-about .ra-asset-cell .b { margin: 0; font-size: 16px; line-height: 24px; font-weight: 500; color: #001430; }
/* コネクタは下向き三角。node bbox は44×44だが外接ボックスで、基準PNG実測の三角実寸は
   幅38×高31px(中心x589.5)。CSS borderは実寸＝底辺38(19+19)・高さ31で規定（DEF-018再是正） */
.redesign-about .ra-asset-main__diamond { position: absolute; left: 331px; top: 742px; width: 0; height: 0; border-left: 19px solid transparent; border-right: 19px solid transparent; border-top: 31px solid #001430; }
.redesign-about .ra-asset-main__band {
  position: absolute; top: 789px; left: 40px; width: 621px; height: 80px;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(0deg, #001430 0%, #003F96 78%); border-radius: 12px;
  /* 立体感＝Figmaは #F1FAFF 複製矩形に LAYER_BLUR(12px)・4px上オフセットのグロー（#656:556）。
     疑似要素のz-index:-1は階層依存で消えるため box-shadow に統一して移植（DEF-019） */
  box-shadow: 0 -4px 16px 0 rgba(241, 250, 255, .5);
  color: #ffffff; font-size: 24px; font-weight: 700;
}
.redesign-about .ra-asset-main__band br { display: none; }   /* 帯内改行はSP専用（PCは1行・DEF-043） */
/* 右カード共通 */
.redesign-about .ra-asset-side { position: absolute; left: 979px; width: 701px; background: rgba(255, 255, 255, .85); border-radius: 20px; }
.redesign-about .ra-asset-side--top   { top: 450px; height: 306px;                    /* y4764 */
  background-image: url("../img/about/s4-side-deco-v2.png"); background-repeat: no-repeat;
  background-position: 63% center; background-size: auto 306px; }                          /* 炎装飾。node656:849を枠706×306準拠で再書出(炎実体371.5幅・opacity0.08焼込)。
                                                                                             background-position63%で画像63%点(炎重心)をカード63%点に＝Figma実測cx63%に一致（DEF-023） */
.redesign-about .ra-asset-side--steps { top: 794px; height: 877px; }                  /* y5108 */
.redesign-about .ra-asset-side__head  { position: absolute; top: 20px; left: 52px; margin: 0; font-size: 34px; font-weight: 700; color: #08183D; }
.redesign-about .ra-asset-side__body  { position: absolute; top: 110px; left: 60px; width: 585px; margin: 0; font-size: 16px; line-height: 28px; font-weight: 500; letter-spacing: .0625em; color: #08183D; }  /* Figma字間0.0625em欠落で4行詰まり→5行に是正 DEF-022 */
.redesign-about .ra-brsp { display: none; }   /* SP専用の改行（PCは自然折返しのため非表示）DEF-059 */
.redesign-about .ra-asset-side--steps .ra-asset-side__body { top: 118px; }
/* 購買心理7ステップ */
.redesign-about .ra-steps { position: absolute; top: 201px; left: 52px; width: 581px; margin: 0; padding: 0; list-style: none; }
/* Figmaは全7行が均一の淡い半透明白（強い明暗交互・07行の濃紺ハイライトは無し / DEF-016） */
.redesign-about .ra-steps__row { display: flex; align-items: center; height: 80px; margin-bottom: 10px; padding: 0 24px 0 36px; box-sizing: border-box; border-radius: 12px; background: rgba(255, 255, 255, .65); }   /* Figma行の塗りは[242,243,244]の明るい白。旧.55は[238,238,243]でやや暗く青い→.65で明度一致（光沢感） */
/* 見出しカラム幅をFigma準拠256pxに（説明文開始をx1323固定カラムに揃える・左端ラギッド解消 DEF-022） */
.redesign-about .ra-steps__n { width: 256px; flex: none; font-size: 24px; font-weight: 700; color: #003F96; }
.redesign-about .ra-steps__d { font-size: 16px; font-weight: 500; letter-spacing: .0625em; color: #001430; }

/* =========================================================================
   S5「スピード感と柔軟性を持ったフェーズ別支援」（section 上端 = Figma y6313）
   背景 #0A075A→#001430 グラデ。フェーズ別支援2×2＋柔軟な稼働設計3項目＋キャッチ枠
   ※座標はFigma PNG実測ベース（MCP上限中のため）/ PHASEカードのイラストはMCP復帰後に書出
   ========================================================================= */
.redesign-about .ra-strength--phase {
  height: 2080px;                                                       /* y6313〜8393(フッター直前) */
  background: linear-gradient(180deg, #0A075A 0, #0A075A 482px, #001430 885px, #001430 2080px);
}
.redesign-about .ra-strength--phase .ra-exhead          { top: 0; }       /* Figma帯top=section上端6313（110pxバンド化に合わせ補正・DEF-009） */
.redesign-about .ra-strength--phase .ra-strength__divider { top: 104px; }
.redesign-about .ra-strength--phase .ra-strength__head  { top: 200px; left: 220px; width: 900px; }
.redesign-about .ra-strength--phase .ra-strength__lead  { top: 270px; width: 1300px; }
.redesign-about .ra-strength--phase .ra-catch           { top: 1810px; }

/* フェーズ別支援 ラッパー（淡いパネル＋2×2白カード） */
.redesign-about .ra-phasewrap {
  position: absolute; top: 496px; left: 240px; width: 1440px; height: 744px;
  background: rgba(255, 255, 255, .85); border-radius: 20px;
}
.redesign-about .ra-phasewrap__head { position: absolute; top: 40px; left: 52px; margin: 0; font-size: 32px; font-weight: 700; color: #001430; }
.redesign-about .ra-phasewrap__sub  { position: absolute; top: 102px; left: 54px; margin: 0; font-size: 16px; font-weight: 500; color: #08183D; }
.redesign-about .ra-phasecard {
  position: absolute; width: 648px; height: 238px; background: #ffffff; border-radius: 12px;  /* Figma実値 card高238（実装225で窮屈→iconはみ出しの一因）DEF-026 */
  padding: 16px 30px 16px 13px; box-sizing: border-box; display: flex; gap: 14px;             /* icon左端13・text開始275をFigma準拠に */
  box-shadow: 0 0 11px 1px rgba(241, 250, 255, 1);   /* Figmaはカード周囲に#F1FAFF系の柔らかい発光（実測 上辺2px外で+12）。角丸長方形なのでbox-shadowで再現 */
}
.redesign-about .ra-phasecard--a { top: 189px; left: 52px; }
.redesign-about .ra-phasecard--b { top: 189px; left: 740px; }
.redesign-about .ra-phasecard--c { top: 447px; left: 52px; }   /* card高238化に伴い2段目を下げ段間gap≈20維持（DEF-026） */
.redesign-about .ra-phasecard--g { top: 447px; left: 740px; }
/* Figmaイラスト枠248×207・カード内左上寄せ。元画像が白背景ラスターで透過不可のため
   object-fit:containで枠内に収め、はみ出し/白浮きを解消（card白背景と同化）DEF-026 */
.redesign-about .ra-phasecard__icon { width: 248px; height: 207px; flex: none; align-self: flex-start; overflow: hidden; }
.redesign-about .ra-phasecard__icon img { display: block; width: 100%; height: 100%; object-fit: contain; }
.redesign-about .ra-phasecard__icon .ra-ph-sp { display: none; }   /* SP専用トリミング画像はPCでは非表示（PCは従来画像）DEF-061 */
.redesign-about .ra-phasecard__body { flex: 1; }
.redesign-about .ra-phasecard__ph { display: block; font-size: 14px; font-weight: 700; color: #08183D; letter-spacing: .04em; margin-bottom: 6px; }  /* Figma node656:620実値=#08183D（実装は#8089A0で薄すぎた）DEF-030 */
.redesign-about .ra-phasecard__title { margin: 0 0 12px; font-size: 28px; line-height: 36px; font-weight: 700; color: #003F96; }  /* Figma実値28/36（PNG実測で24に縮んでいた）DEF-022 / 文字色は青#003F96 DEF-029 */
.redesign-about .ra-phasecard__desc { margin: 0; max-width: 290px; font-size: 16px; line-height: 24px; font-weight: 500; letter-spacing: .0625em; color: #08183D; }  /* Figma実値16/24/字間0.0625em・文字色#08183D（node656:610実値・実装は#5B6473で薄すぎた）DEF-030 / 幅制限→DEF-025 */
/* 説明文ボックス幅はFigmaでカード毎に異なる（node実値: A=312/B=289/C=278/グロース=296px）。一律290だとPHASE.Aで「リスト作成」が早折れ→カード毎に再設定（DEF-030） */
.redesign-about .ra-phasecard--a .ra-phasecard__desc { max-width: 312px; }
.redesign-about .ra-phasecard--b .ra-phasecard__desc { max-width: 289px; }
.redesign-about .ra-phasecard--c .ra-phasecard__desc { max-width: 278px; }
.redesign-about .ra-phasecard--g .ra-phasecard__desc { max-width: 296px; }

/* 柔軟な稼働設計 ラッパー（淡いパネル＋3項目） */
.redesign-about .ra-flexwrap {
  position: absolute; top: 1296px; left: 240px; width: 1440px; height: 460px;
  background: rgba(255, 255, 255, .85); border-radius: 20px;
}
.redesign-about .ra-flexwrap__head { position: absolute; top: 40px; left: 52px; margin: 0; font-size: 32px; font-weight: 700; color: #001430; }
/* 柔軟な稼働設計 3項目（Figma: Bold 28px / #003F96 / 炎アイコン#003F96@.5 / 箱645×114 / DEF-007） */
.redesign-about .ra-flexitem {
  position: absolute; height: 114px; background: #ffffff; border-radius: 12px;
  display: flex; align-items: center; gap: 16px; padding: 0 28px; box-sizing: border-box;
  font-size: 28px; font-weight: 700; color: #003F96;
}
.redesign-about .ra-flexitem__icon { width: 40px; height: 44px; flex: none; }
.redesign-about .ra-flexitem--1 { top: 135px; left: 60px;  width: 645px; }
.redesign-about .ra-flexitem--2 { top: 135px; left: 732px; width: 645px; }
.redesign-about .ra-flexitem--3 { top: 273px; left: 60px;  width: 1317px; }  /* Figma実値で1段目との縦gapを24pxに（実装6→24）DEF-026 */
} /* ===== end @media (min-width: 768px)：PC版ガードここまで ===== */

/* =========================================================================
   SP版（<768px）: 案A。PCの絶対座標ルールは上の min-width:768px でガード済み。
   ここは素のflow（縦積み）前提で Figma SP(390幅) へ寄せて再定義する。
   基準: visual/figma/about-390.png ／ 詳細: docs/SP実装計画.md
   ========================================================================= */
@media (max-width: 767px) {
  .redesign-about, .redesign-about *, .redesign-about *::before, .redesign-about *::after { box-sizing: border-box; }
  .redesign-about { overflow-x: hidden; }
  .redesign-about img { max-width: 100%; height: auto; }

  /* ---- S1 ヒーロー（Figma SP実値: 写真0-400px・紺背景はy400開始 / node662:28・663:163） ---- */
  /* compareマスク0-400・写真は一致不能だが、高さ400厳守でその下の全セクションのy整合の起点にする（DEF-031） */
  .redesign-about .ra-hero { position: relative; height: 400px; background: #fff; overflow: hidden; }
  .redesign-about .ra-hero::before {
    content: ""; position: absolute; inset: 0;
    /* Figma SPは写真全体がハイキー/白く霞む（実装は暗く濃い）。上部を強めに白霞ませ下も僅かに白を重ねFigmaの washed-out に寄せる（DEF-056） */
    background:
      linear-gradient(180deg, rgba(255,255,255,.5) 0%, rgba(255,255,255,0) 42%, rgba(255,255,255,0) 72%, rgba(255,255,255,.22) 100%),
      url("../img/about/hero-bg.jpg") no-repeat center center / cover;
    opacity: .8; pointer-events: none;
  }
  /* Figma配置: STRENGTHS y119 / タイトル y≈155 / サブコピー y≈290（上に詰めず400px内に分散配置） */
  .redesign-about .ra-hero__inner { position: relative; z-index: 1; padding-top: 119px; text-align: center; }
  .redesign-about .ra-hero__label { margin: 0; font-size: 14px; line-height: 36px; font-weight: 500; letter-spacing: .0714em; color: rgba(0, 20, 48, .5); }
  .redesign-about .ra-hero__title { width: 350px; max-width: 92%; margin: 16px auto 0; }
  .redesign-about .ra-hero__title img { width: 100%; height: auto; }
  /* SPはSVG(PC改行)ではなくテキスト版を表示（Figma SP実値: 15px/行間21・濃紺・SP改行3行・背後に白ぼかし装飾）DEF-056 */
  .redesign-about .ra-hero__lead { position: relative; width: auto; max-width: 366px; margin: 30px auto 0; }
  .redesign-about .ra-hero__lead-img { display: none; }
  /* Figmaの白い装飾はテキスト全体の背後にある「柔らかい白い帯（ぼかしパネル）」。
     文字ごとのtext-shadow(白フチ)では別物になるため、背面に放射グラデの白パネルを敷く（DEF-056） */
  .redesign-about .ra-hero__lead::before {
    content: ""; position: absolute; z-index: 0; pointer-events: none;
    left: 50%; top: 50%; transform: translate(-50%, -50%);
    width: 452px; height: 178px;
    /* 中心集中を避け文字周り全体に広く・やや薄く（ユーザー指摘）: プラトーを外へ広げピークを下げる */
    background: radial-gradient(ellipse 58% 54% at 50% 50%, rgba(255,255,255,.78) 0%, rgba(255,255,255,.64) 44%, rgba(255,255,255,.32) 68%, rgba(255,255,255,0) 88%);
  }
  .redesign-about .ra-hero__lead-txt {
    position: relative; z-index: 1;
    display: block; margin: 0; font-size: 14px; line-height: 21px; font-weight: 500; color: #001430; text-align: center;
    text-shadow: 0 0 2px rgba(255, 255, 255, .9);   /* 可読性のごく軽い白シャドウのみ（白帯は背面::beforeが担当） */
  }

  /* ---- S2〜S5 共通（紺背景セクション） ---- */
  .redesign-about .ra-strength { background: #001430; color: #fff; overflow: hidden; padding: 38px 20px 42px; }
  /* OUR EXPERTISE 帯（Figma node663:266 icon40×43@x32 / 283 label14@x84 / 284 name20@x84,y480）
     アイコンは2行にまたがる左配置・ラベル上→名前すぐ下（DEF-032）。gridで icon を2行span。 */
  .redesign-about .ra-exhead { display: grid; grid-template-columns: 40px 1fr; column-gap: 12px; row-gap: 4px; align-items: center; margin: 0 0 16px; padding-left: 12px; }
  .redesign-about .ra-exhead__icon { grid-row: 1 / 3; align-self: center; width: 40px; height: auto; opacity: .5; }
  .redesign-about .ra-exhead__label { font-size: 14px; font-weight: 700; letter-spacing: 0; color: rgba(255, 255, 255, .5); }
  .redesign-about .ra-exhead__name { font-size: 20px; line-height: 28px; font-weight: 700; letter-spacing: .054em; color: #fff; }
  /* 区切り線・見出し・リードは Figma x28/w334（セクションpad20＋左右8）。改行はFigma実値に合わせ
     1個目の<br>のみ残し（=Figmaの\\n位置）以降はw334の自然折返しで一致させる（DEF-032） */
  .redesign-about .ra-strength__divider { width: auto; height: 1px; margin: 0 8px 16px; background: #D9D9D9; border: 0; }
  .redesign-about .ra-strength__head { margin: 0 8px 14px; font-size: 20px; line-height: 34px; font-weight: 700; letter-spacing: .054em; color: #fff; }
  .redesign-about .ra-strength__lead { margin: 0 8px 24px; font-size: 14px; line-height: 26px; font-weight: 400; letter-spacing: -.03em; color: #fff; }  /* Figma実値 line-height:26px（DEF-033）/ 太さはFigma=regular400・字送り-.03emでNotoの広い字幅を補正し改行をFigmaへ寄せる（旧500は太く改行ずれ）DEF-059 */
  .redesign-about .ra-strength__lead br:not(:first-of-type) { display: none; }
  /* S5 lead はSP専用改行(ra-brsp)でFigmaの折返しに厳密一致。PC用プレーン<br>はSPで全消し、ra-brspのみ表示（DEF-061） */
  .redesign-about .ra-strength--phase .ra-strength__lead br { display: none; }
  .redesign-about .ra-strength--phase .ra-strength__lead br.ra-brsp { display: inline; }
  /* Figma実値: catch箱 h140・本文20px/lineHeight30px・3行(node\n)・#F1FAFF blur12pxの発光グロー（DEF-041） */
  .redesign-about .ra-catch {
    width: auto; min-height: 140px; margin: 28px 0 0; padding: 24px;
    display: flex; align-items: center; justify-content: center;
    background: #F1FAFF; border-radius: 12px;
    box-shadow: 0 0 22px 3px rgba(241, 250, 255, .9), 0 0 44px 8px rgba(200, 230, 255, .35);
    font-size: 20px; line-height: 30px; font-weight: 700; color: #003F96; text-align: center;
  }
  .redesign-about .ra-catch br { display: revert; }

  /* ---- S2 成果を生み出す人材：カード縦積み（実行力→思考力）／人物は写真上→テキスト下 ---- */
  /* 紺背景はhero直下(y400)開始・OUR EXPERTISEはy460＝60px内側。先頭セクションのみ上pad60で合わせる（DEF-031）。
     カード内余白をFigma実値化(DEF-038)で縮んだ分、people内のセクション間ギャップもFigma実値に揃え再整合 */
  .redesign-about .ra-strength--people { padding-top: 60px; padding-bottom: 28px; }  /* catch実値140化に伴い過去の膨張下padを戻す（DEF-041再整合） */
  .redesign-about .ra-strength--system { padding-bottom: 2px; }
  .redesign-about .ra-strength--people .ra-strength__lead { margin-bottom: 32px; }  /* Figma lead→card1=32 */
  /* カード内縦ピッチはFigma SP実値(node663:317カード基準): 上28/バッジ→写真20/写真→ラベル16/
     ラベル→タイトル12/タイトル→説明6/説明→次写真24/最終説明→sum36/下36（DEF-038） */
  .redesign-about .ra-card { width: auto; height: auto; background: rgba(255, 255, 255, .85); border-radius: 16px; padding: 28px 18px 36px; margin-bottom: 36px; }
  /* Figmaは全要素を中央でなく左寄せ（node663:318 badge x44左text / 326 photo x56左 / 320 title x56左
     / 325 label x56左の幅広ピル）。中央化はPC教訓の未適用だった→左寄せ＋Figma実値に是正（DEF-034） */
  .redesign-about .ra-card__badge {
    width: auto; height: auto; min-height: 52px; margin: 0 0 20px; padding: 12px 20px;
    display: flex; align-items: center; justify-content: flex-start;
    background: linear-gradient(0deg, #001430 0%, #003F96 78%); border-radius: 8px;
    color: #fff; font-size: 20px; font-weight: 700;
  }
  .redesign-about .ra-entry { width: auto; display: block; margin: 0 0 24px; padding: 0 10px; }
  .redesign-about .ra-entry__photo { width: 168px; margin: 0 0 16px; }
  .redesign-about .ra-entry__photo img { width: 168px; height: auto; }
  .redesign-about .ra-entry__body { padding: 0; }
  .redesign-about .ra-entry__label {
    position: relative; display: flex; align-items: center; justify-content: flex-start;
    width: 100%; max-width: 100%; min-height: 38px; margin: 0 0 12px; padding: 4px 0;
    border-style: solid; border-color: transparent; border-width: 0 28px 0 32px;
    border-image: url("../img/about/bubble.svg") 0 28 0 32 fill;   /* Figma正確形状bubble.svg・9スライス（DEF-037）。2行ラベルは縦に伸ばす（DEF-041） */
    font-size: 16px; line-height: 22px; font-weight: 700; color: #08183D; text-align: left;
  }
  .redesign-about .ra-entry__title { margin: 0 0 6px; font-size: 18px; line-height: 26px; font-weight: 700; color: #003F96; text-align: left; }
  .redesign-about .ra-entry__desc { margin: 0; font-size: 14px; line-height: 24px; letter-spacing: .0286em; font-weight: 500; color: #08183D; }   /* 本文line-heightをFigma統一値24へ（旧20）DEF-062 */
  .redesign-about .ra-entry__desc br { display: none; }   /* desc内<br>はPCのFigma改行位置合わせ専用。SPは幅が違うため自然折返し（現状維持） */
  /* sum帯はFigma(node663:361)実値で両端矢じりの六角形（302×104・インセット16.5068px=5.466%＝PCと同率）。
     SPで角丸長方形に上書きしていたのを是正し六角形clip-pathを復元（DEF-039）。チェブロン分の左右padを確保 */
  .redesign-about .ra-card__sum {
    width: auto; height: auto; margin: 36px 0 0; padding: 22px 28px;
    background: #fff; text-align: center;
    clip-path: polygon(94.534% 0, 100% 50%, 94.534% 100%, 5.466% 100%, 0 50%, 5.466% 0);
    filter: drop-shadow(0 0 8px rgba(241, 250, 255, .35));
  }
  .redesign-about .ra-card__sum-head { margin: 0; font-size: 18px; line-height: 26px; font-weight: 700; color: #08183D; }   /* 見出しline-height統一26（旧1.3）DEF-062 */
  .redesign-about .ra-card__sum-sub { margin: 6px 0 0; font-size: 14px; line-height: 24px; font-weight: 500; color: #08183D; }   /* 本文line-height統一24（旧20）DEF-062 */
  .redesign-about .ra-synergy { display: none; }

  /* ---- S3 成果を証明する評価制度：4カード縦積み ---- */
  .redesign-about .ra-evalwrap { width: auto; height: auto; background: rgba(255, 255, 255, .85); border-radius: 16px; padding: 20px; }
  .redesign-about .ra-evalwrap__band {
    width: auto; height: auto; min-height: 62px; margin: 0 0 22px; padding: 16px 20px;
    display: flex; align-items: center; background: linear-gradient(0deg, #001430 0%, #003F96 78%);
    border-radius: 10px; color: #fff; font-size: 18px; line-height: 1.4; font-weight: 700;
  }
  .redesign-about .ra-evalcard {
    position: static; width: auto; height: auto; margin: 0 0 22px; padding: 38px 18px;
    background: #fff url("../img/about/s3-card-deco.png") no-repeat; background-position: calc(100% - 16px) bottom; background-size: auto 140px;
    border-radius: 10px;   /* 炎ロゴはFigma SP実値で右下・高さ約140px（旧coverは全面≈230pxで過大）DEF-057 */
  }
  .redesign-about .ra-evalcard:last-child { margin-bottom: 0; }
  .redesign-about .ra-evalcard__head { width: auto; margin: 0 0 10px; font-size: 18px; line-height: 26px; font-weight: 700; color: #003F96; letter-spacing: normal; }   /* Figma実値18px/26（旧17/1.45は小さかった）DEF-062 */
  .redesign-about .ra-evalcard__body { font-size: 14px; line-height: 24px; font-weight: 500; letter-spacing: .04em; color: #08183D; }   /* Figma実値14px/24（旧13/22は小さかった）DEF-062 */

  /* ---- S4 成果を再現する資産と仕組み：主カード→常駐型→7ステップ縦積み ---- */
  .redesign-about .ra-strength--asset { background: linear-gradient(180deg, #001430 0, #001430 40%, #0A075A 100%); padding-top: 93px; padding-bottom: 56px; }   /* S3キャッチ枠→S4 OUR EXPERTISEのgapをFigma実値103pxへ（旧44=gap54で狭い）DEF-058 */
  .redesign-about .ra-asset-main { position: relative; width: auto; height: auto; margin: 0; padding: 28px 18px 48px; background: rgba(255, 255, 255, .85); border-radius: 16px; }
  .redesign-about .ra-asset-main__head { position: relative; z-index: 1; margin: 0 0 12px; font-size: 18px; line-height: 26px; font-weight: 700; color: #08183D; }   /* 見出しline-height統一26 DEF-062 */
  /* 「950/件以上」背後の白ハイライト矩形（Figma node663:673 w233×h48）をSPで復元（DEF-040） */
  .redesign-about .ra-asset-num__bg { display: block; position: absolute; left: 16px; top: 116px; width: 262px; height: 48px; background: #fff; z-index: 0; }
  .redesign-about .ra-asset-num__big { position: relative; z-index: 1; display: inline-block; vertical-align: bottom; width: 132px; line-height: 0; }
  .redesign-about .ra-asset-num__big img { width: 132px; height: auto; }
  .redesign-about .ra-asset-num__unit { position: relative; z-index: 1; display: inline-block; vertical-align: bottom; margin: 0 0 4px 6px; font-size: 40px; font-weight: 900; line-height: 1; letter-spacing: -.0147em; color: #003F96; }
  .redesign-about .ra-asset-num__note { position: relative; z-index: 1; display: block; margin: 4px 0 0; font-size: 12px; font-weight: 500; color: #08183D; }
  .redesign-about .ra-asset-main__desc { position: static; width: auto; margin: 18px 0 0; font-size: 13px; line-height: 24px; font-weight: 500; color: #08183D; }
  .redesign-about .ra-asset-main__desc br { display: none; }
  /* Figma SPは2×2でなく1カラム縦4行＋行間に横区切り線（node663:691内・各項目x68）。DEF-043 */
  .redesign-about .ra-asset-table { position: static; width: auto; height: auto; margin: 40px 0 0; padding: 0 6px; display: block; background: #fff; border-radius: 10px; overflow: hidden; }
  .redesign-about .ra-asset-table::before, .redesign-about .ra-asset-table::after { display: none; }
  .redesign-about .ra-asset-cell { position: static; width: auto; padding: 26px 18px; border-bottom: 1px solid #B5BCC6; }
  .redesign-about .ra-asset-cell--br { border-bottom: 0; }
  .redesign-about .ra-asset-cell .h { margin: 0 0 6px; font-size: 18px; line-height: 26px; font-weight: 700; color: #001430; }   /* 見出しline-height統一26 DEF-062 */
  .redesign-about .ra-asset-cell .b { margin: 0; font-size: 14px; line-height: 24px; letter-spacing: .0286em; font-weight: 500; color: #001430; }   /* 本文line-height統一24（旧21）DEF-062 */
  /* 三角コネクタ（Figma node663:717・下向き32×32）をSPでも可視化（DEF-043） */
  .redesign-about .ra-asset-main__diamond { position: static; display: block; width: 0; height: 0; margin: 34px auto; border-left: 16px solid transparent; border-right: 16px solid transparent; border-top: 22px solid #001430; }
  .redesign-about .ra-asset-main__band {
    position: static; width: auto; height: auto; min-height: 84px; margin: 0; padding: 16px;
    display: flex; align-items: center; justify-content: center;
    background: linear-gradient(0deg, #001430 0%, #003F96 78%); border-radius: 10px;
    box-shadow: 0 -4px 16px 0 rgba(241, 250, 255, .5); color: #fff; font-size: 20px; line-height: 28px; font-weight: 700; text-align: center;
  }
  .redesign-about .ra-asset-side {
    position: static; width: auto; height: auto !important; margin: 44px 0 0; padding: 40px 18px;
    background: rgba(255, 255, 255, .85) !important; background-image: none !important; border-radius: 16px;
  }
  /* 常駐型カードにも背面の炎ロゴ装飾（Figma node663:726 Mask group）を復元（DEF-043） */
  /* .ra-asset-side の background ショートハンド(!important)が size/position/repeat をデフォルトにリセットするため、
     炎装飾側も !important で上書きしないと原寸・左上・タイルで右に見切れる（DEF-059バグ修正） */
  .redesign-about .ra-asset-side--top { background-image: url("../img/about/s4-side-deco-v2.png") !important; background-repeat: no-repeat !important; background-position: right bottom !important; background-size: auto 200px !important; }
  .redesign-about .ra-asset-side__head { position: static; margin: 0 0 14px; font-size: 18px; line-height: 26px; font-weight: 700; color: #08183D; }   /* 見出しline-height統一26 DEF-062 */
  .redesign-about .ra-asset-side__body { position: static; width: auto; margin: 0; font-size: 14px; line-height: 24px; font-weight: 500; letter-spacing: .0625em; color: #08183D; }   /* Figma実値14px/24/字間0.0625em（旧13/22は小さく改行ずれ）DEF-059 */
  .redesign-about .ra-asset-side__body .ra-brsp { display: inline; }   /* 常駐型本文のSP改行（Figma SP実値の折返し位置）。PCは非表示 */
  .redesign-about .ra-asset-side--steps .ra-asset-side__body { top: auto; }
  /* Figma SP実値: 各ステップカード302×99・白#fff・radius8・gap8・見出し18(青)/本文14（DEF-043） */
  .redesign-about .ra-steps { position: static; width: auto; margin: 18px 0 0; padding: 0; list-style: none; }
  .redesign-about .ra-steps__row { display: block; width: auto; height: auto; margin: 0 0 8px; padding: 20px 24px 24px; border-radius: 8px; background: #fff; }
  .redesign-about .ra-steps__row:last-child { margin-bottom: 0; }
  .redesign-about .ra-steps__n { display: block; width: auto; margin: 0 0 8px; font-size: 18px; line-height: 26px; font-weight: 700; color: #003F96; }
  .redesign-about .ra-steps__d { display: block; font-size: 14px; line-height: 24px; font-weight: 500; letter-spacing: .0286em; color: #08183D; }   /* 本文line-height統一24（旧21）DEF-062 */

  /* ---- S5 フェーズ別支援：PHASE縦4連＋柔軟な稼働設計3項目 ---- */
  .redesign-about .ra-strength--phase { background: linear-gradient(180deg, #0A075A 0, #0A075A 30%, #001430 70%, #001430 100%); padding-top: 40px; }
  .redesign-about .ra-phasewrap { position: static; width: auto; height: auto; margin: 0; padding: 20px 24px; background: rgba(255, 255, 255, .85); border-radius: 16px; }   /* Figma実値paddingでカード幅301px化（旧16pxは317pxで広くsub/desc改行がずれていた）DEF-060 */
  .redesign-about .ra-phasewrap__head { position: static; margin: 0 0 8px; font-size: 20px; font-weight: 700; color: #001430; }   /* Figma実値20px（旧18は小さい・グリフ15<17）DEF-061 */
  .redesign-about .ra-phasewrap__sub { position: static; margin: 0 0 16px; font-size: 13px; line-height: 1.85; font-weight: 500; color: #08183D; }   /* Figma実値13px/行間24px（旧12/1.6は小さく詰まって見えた）DEF-061 */
  .redesign-about .ra-phasecard { position: static; width: auto; height: auto; display: block; margin: 0 0 14px; padding: 8px 0 18px 8px; background: #fff; border-radius: 10px; overflow: hidden; }   /* カード内の左・上余白を8px追加（イラスト・テキストを右下へ）DEF-061 */
  .redesign-about .ra-phasecard:last-child { margin-bottom: 0; }
  /* SPは余白トリミング済みの専用画像(-sp)を左寄せ・自然アスペクトで表示（coverの見切れ回避・小さめ・左寄せ）DEF-061 */
  .redesign-about .ra-phasecard__icon { width: auto; height: auto; margin: 12px 0 0 8px; display: block; align-self: auto; overflow: visible; }
  .redesign-about .ra-phasecard__icon .ra-ph-pc { display: none; }
  .redesign-about .ra-phasecard__icon .ra-ph-sp { display: block; width: 160px; max-width: 52%; height: auto; }
  /* 1〜3枚目(PHASE.A/B/C)のみ一回り大きく（グロースは据え置き）DEF-061 */
  .redesign-about .ra-phasecard--a .ra-ph-sp,
  .redesign-about .ra-phasecard--b .ra-ph-sp,
  .redesign-about .ra-phasecard--c .ra-ph-sp { width: 180px; max-width: 60%; }
  .redesign-about .ra-phasecard__body { padding: 8px 16px 0; margin-top: 0; }   /* -sp画像は余白トリミング済みのためgapは通常の余白でFigma相当（旧cover用の負マージン廃止）DEF-061 */
  .redesign-about .ra-phasecard__ph { font-size: 13px; font-weight: 700; color: #08183D; letter-spacing: .04em; margin-bottom: 12px; }   /* Figma実値13px・ラベル→タイトルgapをFigma19pxへ（旧12px/6mbで小さくgap狭）DEF-060 */
  .redesign-about .ra-phasecard__title { margin: 0 0 10px; font-size: 18px; line-height: 26px; font-weight: 700; color: #003F96; }   /* 見出しline-height統一26（旧1.4）DEF-062 */
  .redesign-about .ra-phasecard__title br { display: inline; }   /* Figma SPはタイトルを×の後で改行（旧display:noneで×改行が消えていた）DEF-060 */
  .redesign-about .ra-phasecard__desc { margin: 0; max-width: none; font-size: 14px; line-height: 24px; font-weight: 500; letter-spacing: .0625em; color: #08183D; }   /* 本文line-height統一24（旧21）DEF-062 */   /* Figma実値14px/21（旧13/22は小さく1行に多く入り改行ずれ）DEF-060 */
  .redesign-about .ra-flexwrap { position: static; width: auto; height: auto; margin: 20px 0 0; padding: 20px 16px; background: rgba(255, 255, 255, .85); border-radius: 16px; }
  .redesign-about .ra-flexwrap__head { position: static; margin: 0 0 16px; font-size: 18px; line-height: 26px; font-weight: 700; color: #001430; }   /* 見出しline-height統一26 DEF-062 */
  .redesign-about .ra-flexitem {
    position: static; width: auto; height: auto; min-height: 56px; margin: 0 0 12px; padding: 14px 18px;
    display: flex; align-items: center; gap: 14px; background: #fff; border-radius: 10px;
    font-size: 18px; line-height: 26px; font-weight: 700; color: #003F96;   /* Figma実値18px/26（旧15px/1.4は小さかった）DEF-062 */
  }
  .redesign-about .ra-flexitem:last-child { margin-bottom: 0; }
  .redesign-about .ra-flexitem__icon { width: 28px; height: auto; flex: none; }
}

/* =========================================================================
   中間幅(768〜1919px)フィット: 1920px固定デザインを比例縮小して画面内に収める。
   1920px以上=無加工／SP(<768px)=無加工（SPルールで再定義済み）。
   zoom値 --ra-zoom は functions.php の wp_head 側スクリプトが main のパース前に
   確定させる（等倍で一瞬描画されてから縮む「ちらつき」を防ぐため）。
   リサイズ時の更新は page-about.php 末尾のスクリプトが担当。
   ※ zoom は calc() にビューポート単位(vw)を含められないため CSS 単体では算出できない。
   ========================================================================= */
@media (min-width: 768px) and (max-width: 1919px) {
  .redesign-about { width: 1920px; zoom: var(--ra-zoom, 1); }
}

/* =========================================================================
   ヘッダー配色（このファイル唯一の .redesign-about 外への介入）
   既存テーマは「スクロール位置0ではナビを白文字」にする。これは下層ページの
   最上部が濃色の low_hd ヒーローである前提だが、このページは low_hd を廃して
   明るい空のヒーローにしたため、白文字が背景に溶けて読めなくなる。
   default.js は scrollTop=0 で header_scroll を必ず removeClass するため、
   クラス付与では維持できない。よって body の page-template-page-about で
   ページを限定し、style.css の .header_scroll と同じ配色を常時適用する。
   （値は style.css の .header_main.header_scroll 系と同一。他ページには無影響）
   ========================================================================= */
.page-template-page-about .header_main { background: rgb(255 255 255 / 80%); }
.page-template-page-about .header_main .header_logo img:first-child { display: none; }
.page-template-page-about .header_main .header_logo img:last-child { display: block; }
.page-template-page-about nav#menu ul li a { color: #001437; }
.page-template-page-about nav#menu ul li.menu__contact a { background: #001437; color: #fff; }
.page-template-page-about nav#menu ul li { border-left: solid 1px #001437; }
.page-template-page-about nav#menu ul li:first-child { border-left: unset; }