/* ============================================================================
   ワークスHP 代表メッセージ（message.html） — このページ固有の座標
   ----------------------------------------------------------------------------
   共通部分（リセット・スケーリング土台・ヘッダー・Entry/Contact帯・フッター・
   ボタン・見出しの型）は css/style.css にある。HTML では style.css → このファイル
   の順で読み込むこと。
   ========================================================================== */

.stage { height: 8110px; }

/* ============================================================================
   背景（massege_bg グループをフラット化した画像）
   ========================================================================== */
.msgbg { left: -226px; top: -20px; width: 2372px; height: 6550px; }

/* ============================================================================
   ページ見出し
   ========================================================================== */
.pg-label {
  left: 180px; top: 205px; width: 275px; height: 71px;
  display: flex; flex-direction: row; align-items: center; gap: 38px;
}
.pg-label .bar { width: 9px; height: 71px; background: var(--navy); border-radius: 19px; }
.pg-label span {
  width: 228px; height: 60px;
  font-size: 30px; line-height: 60px; font-weight: 500;
  letter-spacing: 0.1em; white-space: nowrap; color: var(--navy);
}

/* ============================================================================
   ヒーロー（オートレイアウト left:265 / top:534 / 高さ476 / gap:79）
   ========================================================================== */
/* 代表写真。仕様書は profile_01（526×682）を指すが、参照デザインでは
   それより人物が小さく余白の広い別カットが使われている。
   TODO: 正式書き出しに差し替え（現在は参照デザインからの暫定切り出し） */
.hero-photo { left: 265px; top: 376px; width: 368px; height: 476px; }

/* 引用符（massage_deco）。仕様書の calc() 値より実測で 35px 左、1px 上だった */
.quote { width: 42px; height: 36px; }
.q1 { left: 711px;  top: 400px; }
.q2 { left: 1544px; top: 573px; }

/* 仕様書の calc() は 789px だが、引用符と同じく実測で 35px 左（＝氏名ブロックと同じ左端） */
.hero-h1 {
  left: 754px; top: 412px; width: 821px; height: 180px;
  font-size: 45px; line-height: 90px; font-weight: 500;
  letter-spacing: 0.1em; white-space: nowrap; color: var(--navy); margin: 0;
}

/* 役職＋氏名（オートレイアウト 492×154 at 755, 831） */
.hero-role {
  left: 755px; top: 673px; width: 492px; height: 50px;
  font-size: 25px; line-height: 50px; font-weight: 500;
  letter-spacing: 0.1em; white-space: nowrap; color: var(--blue); margin: 0;
}
.hero-name { left: 755px; top: 702px; width: 236px; height: 125px; }
.hero-name .col { position: absolute; top: 0; }
.hero-name .c1 { left: 0;     width: 56px; }
.hero-name .c2 { left: 91px;  width: 145px; }   /* 56 + gap35 */
.hero-name .ja {
  display: block; height: 90px;
  font-size: 45px; line-height: 90px; font-weight: 700;
  letter-spacing: 0.1em; white-space: nowrap; color: var(--navy); margin: 0;
}
.hero-name .en {
  display: block; height: 50px;
  font-size: 25px; line-height: 50px; font-weight: 700;
  letter-spacing: 0.1em; white-space: nowrap; color: var(--gray);
  margin: -15px 0 0;
}

/* ============================================================================
   本文4ブロック
   オートレイアウト left:266.99 / top:1182 / gap:191、各行 1385.99×817.99（gap:90）
   テキストは行内で上下中央 → 行top + (817.99-234)/2 = +291.995
   ========================================================================== */
.mimg { width: 722.99px; height: 817.99px; }
.mi1 { left: 929.99px; top: 952px; }
.mi2 { left: 266.99px; top: 1960.99px; }
.mi3 { left: 929.99px; top: 2969.98px; }
.mi4 { left: 266.99px; top: 3978.97px; }

.mtext { width: 573px; }
.mt1 { left: 266.99px;  top: 1243.995px; }
.mt2 { left: 1079.98px; top: 2252.985px; }
.mt3 { left: 266.99px;  top: 3261.975px; }
.mt4 { left: 1079.98px; top: 4270.965px; }

.mtext .ttl {
  display: block; height: 50px;
  font-size: 35px; line-height: 50px; font-weight: 700;
  letter-spacing: 0.1em; white-space: nowrap; color: var(--navy); margin: 0;
}
.mtext .body {
  display: block; height: 144px;
  font-size: 18px; line-height: 36px; font-weight: 350;
  letter-spacing: 0.1em; white-space: nowrap; color: var(--navy);
  margin: 40px 0 0;
}

/* ============================================================================
   プロフィール（Group 179）
   ========================================================================== */
.pf-card { left: 586px; top: 4997px; width: 1067px; height: 1333px; background: #FFFFFF; }
.pf-photo { left: 300px; top: 5011px; width: 458.85px; height: 485px; object-fit: cover; }

.pf-lb {
  left: 813px; top: 5111px; width: 166px; height: 25px;
  font-size: 25px; line-height: 25px; font-weight: 500;
  letter-spacing: 0.36em; white-space: nowrap; color: var(--blue); margin: 0;
}
.pf-h {
  left: 813px; top: 5150px; width: 406px; height: 60px;
  font-size: 45px; line-height: 60px; font-weight: 500;
  letter-spacing: 0.1em; white-space: nowrap; color: var(--navy); margin: 0;
}

/* 各項目：ラベル(20px/40px 青) ＋ 値(18px/36px 紺)。Figmaの実測で -5px 詰まる */
.pf-item { left: 813px; }
.pf-item .lb {
  display: block; height: 40px;
  font-size: 20px; line-height: 40px; font-weight: 700;
  letter-spacing: 0.1em; white-space: nowrap; color: var(--blue); margin: 0;
}
.pf-item .vl {
  display: block;
  font-size: 18px; line-height: 36px; font-weight: 350;
  letter-spacing: 0.1em; white-space: nowrap; color: var(--navy);
  margin: -5px 0 0;
}
.pi1 { top: 5255px; width: 78px; }
.pi2 { top: 5390px; width: 513px; }
.pi3 { top: 5633px; width: 157px; }
.pi4 { top: 5768px; width: 593px; }
.pi5 { top: 5975px; width: 301px; }
.pi6 { top: 6110px; width: 711px; }

/* 区切り線（Vector 39〜43 = 192×0 + 0.5px border） */
.pf-rule { left: 813px; width: 192px; height: 1px; background: var(--navy); opacity: 0.5; }
.pr1 { top: 5358px; }
.pr2 { top: 5601px; }
.pr3 { top: 5736px; }
.pr4 { top: 5943px; }
.pr5 { top: 6078px; }

/* ============================================================================
   関連コンテンツ（Group 170）
   ========================================================================== */
.white-329 { top: 6530px; height: 703px; }
.lb-related {
  left: 180px; top: 6630px; width: 139px; height: 25px;
  font-size: 25px; line-height: 25px; font-weight: 500;
  letter-spacing: 0.36em; white-space: nowrap; color: var(--blue); margin: 0;
}
.h-related {
  left: 180px; top: 6669px; width: 406px; height: 60px;
  font-size: 45px; line-height: 60px; font-weight: 500;
  letter-spacing: 0.1em; white-space: nowrap; color: var(--navy); margin: 0;
}
/* contents_btn_*.png は写真と紺の斜めパネルのみ。文字と矢印はHTML/CSSで描く */
.rel-btn { top: 6784px; }
.rel-btn.rel3 { width: 395px; height: 248.97px; }



/* ============================================================================
   Entry / Contact 帯とフッターの縦位置（本体は css/style.css）
   ========================================================================== */
.ec-band  { top: 7233px; }
.ec-panel { top: 7306px; }
.ft       { top: 7608px; }