/* K'sリネン 修正案（2026-10-11）。本番に入れるときはテーマの CSS に移す */

/* 確認用の帯と、仮の内容の目印 */
.ksr-preview-band { position: fixed; left: 8px; bottom: 100px; z-index: 10000; background: rgba(43,27,2,.88); color: #fff; font-size: 11px; padding: 4px 8px; border-radius: 4px; max-width: 70vw; line-height: 1.5; }
@media (min-width: 769px) { .ksr-preview-band { bottom: 16px; } }
.ksr-preview-band b { background: #fff3a0; color: #2b1b02; padding: 0 4px; }
.ksr-dummy { background: #fff3a0; }

/* 1. ファーストビュー：初期費用0円 */
.ksr-fv-initial { display: inline-block; background: #c93605; color: #fff; padding: 2px 8px; margin-right: 8px; border-radius: 3px; }
@media (max-width: 768px) {
  .top-sec-1 .grp { margin-top: 96px !important; margin-bottom: 24px !important; }
  .top-sec-1 .mw-960 { width: 100%; }
  .top-sec-1 .mb-4b_sp { margin-bottom: 14px !important; }
  .top-sec-1 .ksr-fv-initial { display: block; width: fit-content; margin: 0 auto 4px; font-size: 15px; }
}

/* 2. お客様の事例の要約 */
.ksr-voice { max-width: 560px; margin: 0 auto 20px; text-align: left; }
.ksr-voice__who { font-weight: 700; margin-bottom: 8px; }
.ksr-voice__who span { font-weight: 400; font-size: .85em; }
.ksr-voice__list { list-style: none; padding: 0; margin: 0 0 10px; }
.ksr-voice__list li { position: relative; padding-left: 1.3em; margin-bottom: 6px; line-height: 1.6; }
.ksr-voice__list li::before { content: "✓"; position: absolute; left: 0; color: #8f6f52; font-weight: 700; }
.ksr-voice__list b { color: #c93605; }
.ksr-voice__quote { background: #f5eae0; border-radius: 6px; padding: 10px 14px; font-weight: 700; }
@media (max-width: 768px) { .ksr-voice { font-size: 14px; } }

/* 3. 取り扱い商品：各種サロン向けのラベル（種類を太字で強調、色を添える） */
.product__color.ksr-type { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.25; padding: 5px 9px; right: 6px; bottom: 6px; background: rgba(255,255,255,.9); border-radius: 4px; }
.product__color.ksr-type b { font-size: 16px; font-weight: 700; }
.product__color.ksr-type span { font-size: 12px; }
.ksr-salon.gc-3 { grid-template-columns: repeat(3, 1fr); }

/* サイズ一覧 */
.ksr-size__note { font-size: 14px; margin-bottom: 10px; }
.ksr-size__note b { color: #c93605; }
.ksr-size__wrap { overflow-x: auto; }
.ksr-size__table { width: 100%; border-collapse: collapse; font-size: 15px; background: #fff; }
.ksr-size__table th, .ksr-size__table td { border: 1px solid #d8cbbd; padding: 10px 12px; text-align: left; }
.ksr-size__table thead th { background: #8f6f52; color: #fff; }
.ksr-size__table tbody th { background: #f5eae0; font-weight: 700; }

/* 間延びの解消（スマホ）：商品は2列に、写真とイラストは小さく */
@media (max-width: 768px) {
  #product .d-g.d-b_sp { display: grid !important; grid-template-columns: 1fr 1fr; gap: 18px 12px; }
  #product .product { margin-bottom: 0 !important; }
  #product .product__txt { font-size: 12px !important; line-height: 1.6; }
  #product .product__color { font-size: 11px; }
  .product__color.ksr-type b { font-size: 13px; }
  .product__color.ksr-type span { font-size: 10px; }
  .ksr-size__table { font-size: 13px; }
  .ksr-size__table th, .ksr-size__table td { padding: 8px; }
  /* サービスの内容：写真を小さく */
  .top-sec-5 .m-img-1.w-70p { width: 52% !important; }
  .top-sec-5 .mb-6b_sp { margin-bottom: 28px !important; }
  /* 自店洗濯の費用：一番読まれている節なので並びは変えず、人物イラストだけ小さく */
  .m-sb-2__img.w-160 { width: 110px !important; min-width: 110px !important; }
  .w-160_sp { width: 110px !important; }
}

/* 4. スマホの画面下の固定ボタン */
.ksr-ctabar { display: none; }
@media (max-width: 768px) {
  body { padding-bottom: 92px; }
  .ksr-ctabar { display: block; position: fixed; left: 0; right: 0; bottom: 0; z-index: 9999; background: rgba(255,255,255,.97); box-shadow: 0 -2px 10px rgba(0,0,0,.12); padding: 6px 8px calc(8px + env(safe-area-inset-bottom)); }
  .ksr-ctabar__lead { text-align: center; font-size: 12px; margin: 0 0 4px; color: #2b1b02; }
  .ksr-ctabar__lead b { color: #c93605; }
  .ksr-ctabar__btns { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px; }
  .ksr-ctabar__btn { display: flex; align-items: center; justify-content: center; height: 46px; border-radius: 6px; color: #fff !important; font-weight: 700; font-size: 14px; text-decoration: none; }
  .ksr-ctabar__btn._line { background: #06c755; }
  .ksr-ctabar__btn._tel { background: #8f6f52; }
  .ksr-ctabar__btn._mail { background: #c93605; }
}

.ksr-size__table td:last-child { white-space: nowrap; }
@media (max-width: 768px) { .ksr-size__table th, .ksr-size__table td { padding: 8px 6px; } .ksr-size__table tbody th { width: 38%; } }

/* 各種サロン向けのリード文・FAQ への導線 */
.ksr-salon-lead { font-size: 15px; line-height: 1.8; }
.ksr-faq-link { margin-top: 14px; }
.ksr-faq-link a { color: #8f6f52; font-weight: 700; text-decoration: underline; }
@media (max-width: 768px) { .ksr-salon-lead { font-size: 14px; } }

/* よくある質問ページ */
.ksr-faq__intro { margin-bottom: 28px; line-height: 1.9; font-size: 15px; }
.ksr-faq__cat { font-size: 20px; font-weight: 700; border-left: 5px solid #8f6f52; padding-left: 10px; margin: 36px 0 14px; }
.ksr-faq__item { background: #fff; border: 1px solid #e3d7ca; border-radius: 6px; padding: 14px 16px; margin-bottom: 10px; }
.ksr-faq__item.ksr-dummy { background: #fff3a0; }
.ksr-faq__q { font-size: 16px; font-weight: 700; margin-bottom: 6px; }
.ksr-faq__q::before { content: "Q. "; color: #c93605; }
.ksr-faq__a { line-height: 1.85; font-size: 15px; }
.ksr-faq__a::before { content: "A. "; color: #8f6f52; font-weight: 700; }
.ksr-faq__more { margin-top: 28px; }
@media (max-width: 768px) { .ksr-faq__cat { font-size: 18px; } .ksr-faq__q { font-size: 15px; } .ksr-faq__a { font-size: 14px; } }

/* 0円の枠の右上の白い三角（元のテーマの飾り＝ページの角を折った表現）は外す */
.m-dc-8 { display: none !important; }

/* お客様のお声（スマホ）：アイコンとイラストを小さくして縦を詰める */
@media (max-width: 768px) {
  body[data-page="voice"] .w-120 { width: 76px !important; min-width: 76px; }
  body[data-page="voice"] .mw-320 { max-width: 190px !important; }
  body[data-page="voice"] .m-sb-2__img.w-160 { width: 96px !important; min-width: 96px !important; }
  body[data-page="voice"] .w-160_sp { width: 96px !important; }
}