@charset "UTF-8";
/* B案 01 FV（ヘッダーは共通 /assets/common/hb/header.css の .hb-header を assemble.py が差し込む。サイドナビは live の .fv-sidenav に下の差分だけ上書き） */
.sec-fv--b {
  line-break: strict;
  --u: min(1px, calc(100vw / 1920));
  --bfv-c-white: #FFFFFF;
  --bfv-c-overlay: rgba(255, 255, 255, 0.3);
  --bfv-c-overlay-sp: rgba(255, 255, 255, 0.64);
  --bfv-c-text: #333333;
  --bfv-c-primary: #F17200;
  --bfv-c-pill-line: #F1900A;
  --bfv-c-gold: #B2995F;
  --bfv-c-navy: #000032;
  --bfv-veil: rgba(255, 255, 255, .8);
  --bfv-veil-0: rgba(255, 255, 255, 0);
  --bfv-shadow: rgba(0, 0, 0, .4);
}
.sec-fv--b .bfv-brsp { display: none; }
.bfv-mv {
  position: relative;
  height: calc(960 * var(--u));
  overflow: hidden;
}

/* 写真レイヤー（装飾・z-index を持たせない＝ドクターだけ前に出す） */
.bfv-photos { position: absolute; inset: 0; }
.bfv-ph { position: absolute; display: block; }
.bfv-ph img { display: block; max-width: none; }
.bfv-ph--implant { left: calc(1149.07 * var(--u)); top: calc(75.33 * var(--u)); width: calc(888.427 * var(--u)); height: calc(499 * var(--u)); }
.bfv-ph--implant img { width: 100%; height: 100%; object-fit: cover; object-position: bottom; }
.bfv-ph--or { left: calc(1109.07 * var(--u)); top: calc(573.97 * var(--u)); width: calc(866 * var(--u)); height: calc(392.535 * var(--u)); overflow: hidden; }
.bfv-ph--or img { position: absolute; left: calc(-489.32 * var(--u)); top: calc(-344.24 * var(--u)); width: calc(1394.22 * var(--u)); height: calc(755.345 * var(--u)); object-fit: cover; }
.bfv-ph--clinic {
  left: calc(-115 * var(--u)); top: calc(75.33 * var(--u)); width: calc(1469.504 * var(--u)); height: calc(1124.828 * var(--u));
  overflow: hidden;
  clip-path: polygon(0 0, 100% 0, 62.744% 100%, 0 100%);
}
.bfv-clinic-img, .bfv-clinic-overlay, .bfv-clinic-img2 {
  position: absolute;
  width: calc(1733.158 * var(--u)); height: calc(1153.464 * var(--u));
}
.bfv-clinic-img, .bfv-clinic-overlay { left: calc(-206.527 * var(--u)); top: calc(-0.219 * var(--u)); }
.bfv-clinic-img img, .bfv-clinic-img2 { display: block; object-fit: cover; }
.bfv-clinic-img img { width: 100%; height: 100%; }
.bfv-clinic-overlay { background: var(--bfv-c-overlay); }
.bfv-clinic-img2 { left: calc(1200.342 * var(--u)); top: calc(252.234 * var(--u)); }
.bfv-ph--veil {
  left: calc(-10.8 * var(--u)); top: calc(75.33 * var(--u)); width: calc(1634 * var(--u)); height: calc(884.672 * var(--u));
  background: linear-gradient(to left, var(--bfv-veil-0) 0%, var(--bfv-veil) 77.322%);
}
.bfv-ph--doctor { left: calc(898.52 * var(--u)); top: calc(75.33 * var(--u)); width: calc(596.482 * var(--u)); height: calc(977.305 * var(--u)); overflow: hidden; z-index: 2; }
.bfv-ph--doctor img { position: absolute; left: -14.52%; top: -7.35%; width: 119.67%; height: 109.56%; max-width: none; }

/* 内容（通常フロー） */
.bfv-body { padding-top: calc(277 * var(--u)); }
/* h1（2026-10-16 追加）：見た目は従来の p.bfv-catch と同じにする */
.bfv-h1 { margin: 0; font-size: inherit; font-weight: inherit; line-height: inherit; }
.bfv-catch {
  position: relative;
  z-index: 3;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  height: calc(114 * var(--u));
  margin: 0;
  padding: calc(10 * var(--u)) calc(24 * var(--u));
  background: var(--bfv-c-white);
  opacity: .88;
  font-family: var(--font-heading);
  font-weight: 400;
  line-height: 1;
  color: var(--bfv-c-text);
  white-space: nowrap;
  font-feature-settings: "palt";
}
.bfv-catch--1 { width: calc(854 * var(--u)); margin-left: calc(241.22 * var(--u)); font-feature-settings: normal; }
.bfv-catch--2 { width: calc(556 * var(--u)); margin-top: calc(37 * var(--u)); margin-left: calc(308.22 * var(--u)); z-index: 1; }
.bfv-catch-l { font-size: min(calc(65 * var(--u)), calc(5.5000px + 3.0990vw)); }
.bfv-catch-s { font-size: min(calc(49 * var(--u)), calc(8.1667px + 2.1267vw)); }
.bfv-lead {
  position: relative;
  z-index: 3;
  margin: calc(29 * var(--u)) 0 0 calc(304.41 * var(--u));
  font-family: var(--font-heading);
  font-weight: 400;
  font-size: min(calc(20 * var(--u)), calc(13.0000px + 0.3646vw));
  line-height: 2;
  letter-spacing: .05em;
  color: var(--bfv-c-text);
  white-space: nowrap;
}
.bfv-row {
  position: relative;
  z-index: 3;
  display: flex;
  align-items: flex-start;
  gap: calc(22.96 * var(--u));
  margin: calc(145 * var(--u)) 0 0 calc(238.93 * var(--u));
}
.bfv-btn {
  position: relative;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 0 0 auto;
  width: calc(362 * var(--u));
  height: calc(83 * var(--u));
  border-radius: calc(53 * var(--u));
  filter: drop-shadow(0 0 calc(4 * var(--u)) var(--bfv-shadow));
  color: var(--bfv-c-white);
  text-decoration: none;
}
.bfv-btn:hover { opacity: .88; }
.bfv-btn--consult { background: var(--bfv-c-primary); }
.bfv-btn--pamphlet { justify-content: center; padding-right: calc(6 * var(--u)); background: var(--bfv-c-gold); }
.bfv-btn-pill {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(177 * var(--u));
  height: calc(33 * var(--u));
  margin: calc(-17 * var(--u)) calc(1 * var(--u)) 0 0;
  border: calc(1 * var(--u)) solid var(--bfv-c-pill-line);
  border-radius: calc(24 * var(--u));
  background: var(--bfv-c-white);
  font-family: var(--font-body);
  font-weight: 700;
  font-size: min(calc(20 * var(--u)), calc(13.0000px + 0.3646vw));
  line-height: calc(24 * var(--u));
  color: var(--bfv-c-primary);
  white-space: nowrap;
}
.bfv-btn-text {
  font-family: var(--font-body);
  font-weight: 500;
  font-size: min(calc(20 * var(--u)), calc(13.0000px + 0.3646vw));
  line-height: 1;
  white-space: nowrap;
}
.bfv-btn--consult .bfv-btn-text { margin-top: calc(15.5 * var(--u)); }
.bfv-btn-icon, .bfv-btn-arrow { position: absolute; display: block; }
.bfv-btn-icon--consult { left: calc(34.57 * var(--u)); top: calc(28.79 * var(--u)); width: calc(18.0635 * var(--u)); height: calc(25.4219 * var(--u)); }
.bfv-btn-icon--pamphlet { left: calc(54.12 * var(--u)); top: calc(31.74 * var(--u)); width: calc(29.6087 * var(--u)); height: calc(23.0249 * var(--u)); }
.bfv-btn-arrow { top: calc(32 * var(--u)); width: calc(11 * var(--u)); height: calc(19 * var(--u)); }
.bfv-btn--consult .bfv-btn-arrow { left: calc(327.97 * var(--u)); }
.bfv-btn--pamphlet .bfv-btn-arrow { left: calc(326.41 * var(--u)); }
.bfv-badge {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: calc(279 * var(--u));
  height: calc(48 * var(--u));
  margin: calc(65.05 * var(--u)) 0 0 calc(267.55 * var(--u));
  padding-left: calc(10 * var(--u));
  border: calc(1 * var(--u)) solid var(--bfv-c-white);
  background: var(--bfv-c-navy);
  opacity: .8;
  font-family: var(--font-body);
  font-weight: 500;
  font-size: min(calc(20 * var(--u)), calc(13.0000px + 0.3646vw));
  line-height: 1;
  color: var(--bfv-c-white);
  white-space: nowrap;
}

/* 右端固定ナビ（Figma 14 3587:5234）: live .fv-sidenav との差分だけ上書き。
   アイコンは base.css の img{max-width:100%} で内容幅 20 に縮んでいた（WEB 26.91→20・パンフ 21.22→20）ので Figma 寸法に戻す。
   文字の送りは Figma shot 実測 17px（code は lh 1.04＝16.64 だが shot の 1 文字目〜最終文字の間隔は 3 項目とも 17.0）、
   1 文字目の位置は Figma の配置（相談＝アイコン直下・WEB／パンフ＝高さ 129.258／127 の枠に中央寄せ）に合わせる。 */
.fv-sidenav .fv-sidenav-icon { max-width: none; }
.fv-sidenav .fv-sidenav-text { letter-spacing: 1px; white-space: nowrap; }
.fv-sidenav-link--consult  .fv-sidenav-text { margin-top: 1px; }
.fv-sidenav-link--web      .fv-sidenav-text { margin-top: 6.13px; }
.fv-sidenav-link--pamphlet .fv-sidenav-text { margin-top: 5px; }

@media (max-width: 767px) {
  .sec-fv--b { --u: calc(100vw / 390); }
  .sec-fv--b .bfv-brsp { display: inline; }
  .bfv-mv { height: calc(525 * var(--u)); }
  .bfv-ph--implant { left: calc(173.48 * var(--u)); top: calc(82.02 * var(--u)); width: calc(251.52 * var(--u)); height: calc(161.086 * var(--u)); }
  .bfv-ph--or, .bfv-ph .bfv-clinic-img2 { display: none; }
  .bfv-ph--clinic { left: calc(-3.04 * var(--u)); top: calc(82.02 * var(--u)); width: calc(399.039 * var(--u)); height: calc(469.62 * var(--u)); clip-path: none; }
  .bfv-clinic-img, .bfv-clinic-overlay { left: 0; top: 0; width: 100%; height: 100%; }
  .bfv-clinic-img img { object-position: bottom; }
  .bfv-clinic-overlay { background: var(--bfv-c-overlay-sp); }
  .bfv-ph--veil { left: calc(-3.04 * var(--u)); top: calc(82.02 * var(--u)); width: calc(270.039 * var(--u)); height: calc(442.977 * var(--u)); }
  .bfv-ph--doctor { left: calc(178.72 * var(--u)); top: calc(135.23 * var(--u)); width: calc(225.283 * var(--u)); height: calc(416.412 * var(--u)); }
  .bfv-ph--doctor img { left: -17.54%; top: -8.43%; width: 144.54%; height: 117.3%; }

  .bfv-body { padding-top: calc(152 * var(--u)); }
  .bfv-catch { height: calc(54 * var(--u)); padding: calc(10 * var(--u)) calc(24 * var(--u)); z-index: 1; }
  .bfv-catch--1 { width: calc(292 * var(--u)); margin-left: calc(-1 * var(--u)); padding-left: calc(37 * var(--u)); font-feature-settings: "palt"; }
  .bfv-catch--2 { width: calc(207 * var(--u)); margin-top: calc(11.9 * var(--u)); margin-left: calc(31 * var(--u)); }
  .bfv-catch-l { font-size: calc(25 * var(--u)); }
  .bfv-catch-s { font-size: calc(19 * var(--u)); }
  .bfv-lead {
    margin: calc(20.54 * var(--u)) 0 0 calc(31.13 * var(--u));
    font-size: calc(15 * var(--u));
    letter-spacing: 0;
    text-align: justify;
  }
  .bfv-row { display: block; margin: 0; }
  .bfv-btn { display: none; }
  .bfv-badge {
    width: calc(189 * var(--u));
    height: calc(32 * var(--u));
    margin: calc(40.56 * var(--u)) 0 0 calc(31 * var(--u));
    padding: 0;
    border: 0;
    border-radius: calc(2 * var(--u));
    font-size: calc(14 * var(--u));
  }
}