@charset "UTF-8";
/* ==========================================================================
   p-btob  法人向けクリーニングサービス（下層①・6枚目）
   出典: Figma PC 937:1740（1440×4307）/ SP 913:8256（390×5046）
   数値・色は 2026-08-17 に複製ファイルから REST /nodes で実取得。目視推測ゼロ。

   🔒 タブレット帯は比率で組む（固定pxはPC1440専用ブロックのみ）
   設計座標（PC）: FV y-40 / point y637 / item y1197 / price y1860 / faq y2628 / contact y3292
   ========================================================================== */
/* --- 共通見出し（泡＋テキスト・中央） --- */
.p-btob__heading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px; /* 実測(PC) 937:1983→1984: 泡右端623 -> 見出し647 */
  margin: 0;
  color: #333333;
  font-size: clamp(24px, 21.0285714286px + 0.7619047619vw, 32px);
  font-weight: 700;
  line-height: 1.448;
  text-align: center;
}

.p-btob__heading-bubble {
  flex-shrink: 0;
  width: 42px;
  height: 42px;
}

.p-btob__note {
  margin: 20px 0 0;
  color: #828282; /* 実測 937:1881: #828282 */
  font-size: 14px;
  font-weight: 500;
  line-height: 1.7;
}

/* ==========================================================================
   point（水色帯＋写真）
   ========================================================================== */
/* 🔴 監査#49: Figma SP は **写真 → 本文**（`913:8275` 画像 y289 → `913:8277` 本文 y531）。
   実装は DOM 順（帯＋本文 → 写真）がそのまま出ていた。
   `_tabD_log` #23（デラックスSP）と同じ手当て＝**マークアップは変えず SP だけ視覚順を反転**する
   （PCは「帯＋本文が左・写真が右」の横並びで DOM 順が正）。 */
.p-btob__point {
  display: flex;
  flex-direction: column-reverse;
  margin-top: 30px;
}

.p-btob__point-band {
  /* 実測(PC) 937:1989: 1047×350 #F3FBFF（左端から全幅） */
  padding: 40px 22px;
  background: #f3fbff;
}

.p-btob__point-text {
  margin: 0;
  color: #333333;
  font-size: 18px; /* 実測 937:1990: 18px */
  font-weight: 500;
  line-height: 1.7;
}

.p-btob__point-text + .p-btob__point-text {
  margin-top: 1.7em; /* 実測: 本文中の空行1つ分 */
}

/* S-48: back_decoration泡はSPでは非表示（SPはSP実測座標 913:8285系で別途実装＝SP周回申し送り） */
.p-btob__deco {
  display: none;
}

/* S-50（8/26指摘④後段）: このページのcontact帯はFigmaに泡が無い
   （PC 937:1808周辺にELLIPSE不在を実測）＝S-40（羽毛）と同型の帯単位の出し分け */
.c-contact-band__bubble {
  display: none;
}

.p-btob__point-img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 560/319; /* 実測(PC) 937:1991: 560×319 */
  /* 🔒 左上・左下のみ角丸（実測 PC 937:1991 / SP 913:8275 とも [36,0,0,36]）
     ＝49件「写真の角丸」。従来は角丸指定そのものが無かった */
  border-radius: 36px 0 0 36px;
  object-fit: cover;
  /* 下地なし: 画像の角がアルファ透過（8/24黒角修復）のため、下地があるとグレーの弧が透ける */
}

/* ==========================================================================
   item 受付アイテム（水色パネル）
   ========================================================================== */
.p-btob__item {
  margin-top: 90px;
  /* 実測(SP) 913:8278: padding 25px（本文枠が 340 になる値）。22px だと本文枠が361へ広がり、
     Figma の折返し（注記2行）が崩れて「ください。」が3行目へ落ちる（監査#50・罠#19） */
  padding: 25px;
  border-radius: 24px; /* 実測 937:1981: r24 */
  background: #f3fbff;
  text-align: center;
}

/* PC専用の文字列はSPでは出さない（罠#19・監査#50） */
.p-btob__item-list--pc,
.p-btob__item-note--pc {
  display: none;
}

/* 🔴 監査#50: Figma SP `913:8283` は **textAlignHorizontal=LEFT**・x25 w340 で、
   項目ごとに `
` で改行される（実装は親の text-align:center を継いだ中央揃えの段落だった）。
   注記 `913:8284` も同じく LEFT。 */
.p-btob__item-list {
  margin: 60px 0 0; /* 実測(PC): 見出し下端1302.5 -> リスト1392.5 */
  color: #333333;
  font-size: clamp(16px, 14.5142857143px + 0.380952381vw, 20px); /* 実測 937:1986: 20px 500 */
  font-weight: 500;
  line-height: 1.7;
  text-align: left;
}

.p-btob__item-note {
  margin: 30px 0 0; /* 実測(PC): リスト下端1494.5 -> 注記1522.5 */
  color: #333333;
  text-align: left; /* 実測 913:8284: LEFT（監査#50と同じ） */
  font-size: clamp(16px, 14.5142857143px + 0.380952381vw, 20px); /* 実測 937:1987: 20px */
  font-weight: 500;
  line-height: 1.45;
}

/* ==========================================================================
   price（2表）
   ========================================================================== */
.p-btob__price {
  margin-top: 90px;
  padding: 0 10px;
}

.p-btob__price-tables {
  margin-top: 60px;
}

.p-btob__price .c-price-table + .c-price-table {
  margin-top: 50px;
}

/* ==========================================================================
   FAQ（アコーディオン・Q1のみ開）
   ========================================================================== */
.p-btob__faq {
  margin-top: 90px;
  padding: 0 10px;
}

.p-btob__faq-list {
  margin-top: 60px; /* 実測(PC): 見出し下端2674 -> Q1 y2764 */
}

.p-btob__faq-item + .p-btob__faq-item {
  margin-top: 32px; /* 実測(PC): Q1枠下端2832 -> Q2 y2924（回答分を除く） */
}

.p-btob__faq-q {
  display: flex;
  align-items: center;
  gap: 24px; /* 実測(PC): アイコン右端340 -> 本文364 */
  width: 100%;
  min-height: 68px; /* 実測 937:1842: 880×68 r10 */
  padding: 12px 24px;
  border: 0;
  border-radius: 10px;
  background: #f3fbff; /* 実測: #F3FBFF */
  color: #333333;
  font-size: clamp(16px, 14.5142857143px + 0.380952381vw, 20px); /* 実測 937:1846: 20px 700 */
  font-weight: 700;
  line-height: 1.45;
  text-align: left;
  cursor: pointer;
}

/* Q/A の丸アイコン（実測 36×36・Q=#5FCAFD / A=#FEB2C7） */
.p-btob__faq-icon {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  color: #ffffff;
  font-family: "Buenard", serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 1;
}

.p-btob__faq-icon--q {
  background: #5fcafd;
}

.p-btob__faq-icon--a {
  background: #feb2c7; /* 実測 937:1850: #FEB2C7 */
}

.p-btob__faq-qtext {
  flex: 1;
  min-width: 0;
}

/* 開閉マーク（実測: 閉=+ / 開=−・16×16 #333333） */
.p-btob__faq-mark {
  position: relative;
  flex-shrink: 0;
  width: 16px;
  height: 16px;
}

.p-btob__faq-mark::before,
.p-btob__faq-mark::after {
  position: absolute;
  top: 50%;
  left: 0;
  width: 16px;
  height: 1px;
  background: #333333;
  content: "";
}

.p-btob__faq-mark::after {
  transform: rotate(90deg);
  transition: transform 0.25s ease;
}

/* 開いている時は縦棒を消して「−」にする */
.p-btob__faq-item--open .p-btob__faq-mark::after {
  transform: rotate(0deg);
}

.p-btob__faq-a {
  display: none;
  align-items: flex-start;
  gap: 24px;
  margin-top: 24px; /* 実測(PC): Q枠下端2832 -> 回答2856 */
  padding: 0 24px;
}

.p-btob__faq-item--open .p-btob__faq-a {
  display: flex;
}

.p-btob__faq-atext {
  flex: 1;
  min-width: 0;
  margin: 0;
  color: #333333;
  font-size: 14px; /* 実測 937:1852: 14px 400 */
  font-weight: 400;
  line-height: 1.7;
}

/* ==========================================================================
   タブレット以上（769px〜）＝比率で組む
   ========================================================================== */
@media (min-width: 769px) {
  .p-btob__point {
    position: relative; /* S-48: back_decoration泡のアンカー */
    display: flex;
    flex-direction: row; /* SPの column-reverse（監査#49）を打ち消す＝PCは横並び */
    /* S-47: 写真は帯上端より12px上（実測 937:1991 y637 / 帯937:1989 y649）＝centerでなく上端基準 */
    align-items: flex-start;
    margin-top: 100px;
  }
  .p-btob__point-band {
    /* 実測(PC) 937:1989: 帯 x-2 w1047・右端x1045で止まり右側のみ角丸24（[0,24,24,0]）。
       右下の角丸は写真(下端956)より下（帯下端999）で見える＝デザインの見せ場（S-47） */
    flex: 1;
    min-width: 0;
    min-height: 350px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 40px 8% 40px 16%;
    border-radius: 0 24px 24px 0;
  }
  .p-btob__point-img {
    /* S-47実測(PC) 937:1991: x881 w560・帯右端1045との重なり=164px（164/1440=11.4%。旧-3.9%は過小） */
    flex-shrink: 0;
    width: 38.9%;
    max-width: 560px;
    margin-left: -11.4%;
    margin-top: -12px; /* 実測: 写真y637 − 帯y649 */
  }
  /* S-48: back_decoration 泡3種（Figma 937:1836-1838・PC実測座標）。
     z-index:-1で帯・後続パネルの背後（青=帯下端999から覗く／黄=受付パネル角の裏／桃=料金右で裁ち落とし）。
     SP版（913:8285系・座標別）はSP周回で実装＝申し送り */
  .p-btob__deco {
    position: absolute;
    z-index: -1;
    display: block;
    height: auto;
  }
  .p-btob__deco--blue {
    top: 283px; /* 実測 937:1838: abs(-72,932) − 帯上端649 */
    left: -72px;
    width: 179px;
  }
  .p-btob__deco--yellow {
    top: 515px; /* 実測 937:1837: abs(71,1164) − 帯上端649 */
    left: 71px;
    width: 67px;
  }
  .p-btob__item {
    width: min(1200px, 100% - 80px); /* 実測(PC): 1200×414 */
    margin: 160px auto 0;
    padding: 59px 40px;
  }
  /* 🔒 49件「受付アイテム: 1行目の改行」
     実測 937:1986 のテキスト枠は **764px**（3行）。実装は枠いっぱい1120pxで折返しており、
     1行目の切れ目がFigmaと変わっていた → 実測幅にして折返し位置を合わせる */
  /* PCは2行版・中央揃え（実測 937:1986 CENTER / 937:1987 CENTER）＝SP専用版を隠す（罠#19） */
  .p-btob__item-list--pc,
  .p-btob__item-note--pc {
    display: block;
  }
  .p-btob__item-list--sp,
  .p-btob__item-note--sp {
    display: none;
  }
  .p-btob__item-list {
    width: min(764px, 100%);
    margin-inline: auto;
    text-align: center; /* 実測 937:1986: CENTER（SPは LEFT） */
  }
  .p-btob__item-note {
    text-align: center; /* 実測 937:1987: CENTER（SPは LEFT） */
  }
  .p-btob__price {
    position: relative; /* S-48: 桃泡のアンカー */
    width: min(1121px, 100% - 80px); /* 実測(PC): price枠 1121幅 */
    margin: 160px auto 0;
    padding: 0;
  }
  .p-btob__deco--pink {
    top: 288px; /* 実測 937:1836: abs(1348,2148) − price枠(160,1860) */
    right: -197px; /* 枠右端1281 − 泡右端1478（右へ38px裁ち落とし・l-mainのclipで刈る） */
    width: 130px;
  }
  .p-btob__price-tables {
    /* 実測(PC): price01 x160 w543 / price02 x738 w543 ＝ gap35 */
    display: flex;
    gap: 3.1%;
    margin-top: 90px;
  }
  .p-btob__price .c-price-table {
    flex: 1;
    min-width: 0;
  }
  .p-btob__price .c-price-table + .c-price-table {
    margin-top: 0;
  }
  .p-btob__faq {
    width: min(880px, 100% - 80px); /* 実測(PC): question 880幅 */
    margin: 160px auto 0;
    padding: 0;
  }
  .p-btob__faq-list {
    margin-top: 90px; /* 実測(PC): 見出し下端2674 -> Q1 y2764 */
  }
}
/* ==========================================================================
   PC 1440px以上＝Figma固定値の厳密再現
   ========================================================================== */
@media (min-width: 1440px) {
  .p-btob__point-band {
    padding: 40px 111px 40px 230px; /* 実測(PC): 本文 x230 w540 */
  }
  .p-btob__point-img {
    width: 560px;
    margin-left: -164px; /* S-47実測: 帯右端1045 − 写真x881 ＝ 164px重なり（旧-56pxは誤り） */
  }
  .p-btob__price-tables {
    gap: 35px; /* 実測: 543+35+543 = 1121 */
  }
}
/* ==========================================================================
   SP周回（2026-08-27）: Figma SP 913:8256 実測に合わせたSP限定修正。
   768px以下限定＝769px以上には影響しない（PC22面承認済み）。
   ========================================================================== */
@media (max-width: 768px) {
  /* 受付アイテムのリスト・注記（実測 913:8281系: fs18 lh30.6。clamp下限16はSP推定だった） */
  .p-btob__item-list,
  .p-btob__item-note {
    font-size: 18px;
    line-height: 1.7;
  }
  /* 料金表: ヘッダfs24・行fs20・行padding8（実測 913:8342/8290。部品既定clampのSP下限20/16は本ページ実測と不一致
     ＝共通部品は不変・ページスコープで上書き） */
  .p-btob .c-price-table__table thead .c-price-table__col {
    font-size: 24px;
  }
  .p-btob .c-price-table__table tbody .c-price-table__col {
    padding-block: 8px; /* 実測: 1行行45（29+16）・2行行74（58+16） */
    font-size: 20px;
    line-height: 1.45; /* 実測: 2行58/40 */
  }
  /* 表下端→FAQ見出し90（実測: 2923→3013）。実装はSPデザインに無い税込注記を保持（📮）＝注記込みで90に合わせる */
  .p-btob__faq {
    margin-top: 22px;
  }
  /* 表1→表2 ＝ 53（実測: 2280→2333） */
  .p-btob__price .c-price-table + .c-price-table {
    margin-top: 53px;
  }
  /* FAQ: 質問fs20（実測 913:8445）・回答lh1.8（実測 lh25.2/14） */
  .p-btob__faq-qtext {
    font-size: 20px;
  }
  .p-btob__faq-atext {
    line-height: 1.8;
  }
  /* back_decoration泡3種のSP実装（S-48申し送り・913:8286-8288 実測座標） */
  .p-btob__point,
  .p-btob__item,
  .p-btob__price {
    position: relative;
  }
  .p-btob__deco {
    position: absolute;
    z-index: -1;
    display: block;
    height: auto;
  }
  .p-btob__deco--blue {
    top: auto;
    bottom: -53px; /* 実測: 泡759..823 ＝ point帯下端770の53下まで */
    left: -18px;
    width: 63px;
  }
  .p-btob__deco--yellow {
    top: auto;
    bottom: -95px; /* 実測: 泡841.2..865 ＝ 帯下端770の95下まで（セクション間） */
    left: 33px;
    width: 24px;
  }
  .p-btob__deco--pink {
    top: -106px; /* 実測 913:8288: 泡y1289 ＝ price枠1395の106上（markupの親はprice） */
    right: -16px;
    left: auto;
    width: 46px;
  }
}
/* 見出し左の円＝Figma SP実測 29×29・円→文字の間隔10px（全ページ一様・2026-08-28夜 実測
   deluxe/futon/house/tokusyu/option/btob/kaiin/shiminuki の各SPフレームで円29.0を確認）。
   従来の42pxはPC実測値がSPへ漏れていたもの（ユーザー指摘 匠②） */
@media (max-width: 768px) {
  .p-btob__heading {
    gap: 10px;
  }
  .p-btob__heading-bubble {
    width: 29px;
    height: 29px;
  }
}