/**
 * 整骨院サイトマネージャー フロントエンドCSS v4.1
 * Design: Japanese Medical Warm Trust — Primary: Living Coral (#FF6F61)
 * PC: Header + TopNav sticky + 2-column (sidebar 200px + main)
 * Mobile: Header sticky + TopNav sticky + main only (sidebar hidden)
 */

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700;900&display=swap');

:root {
  --sc-primary: #FF6F61;
  --sc-primary-dark: #FF6F61;
  --sc-green: #FF6F61;
  --sc-green-dark: #FF6F61;
}

.seikotsu-wrap *, .seikotsu-wrap *::before, .seikotsu-wrap *::after { box-sizing: border-box; }

.seikotsu-wrap {
  font-family: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif;
  background: #ffffff; min-height: 100vh; color: #1a1a1a;
  -webkit-font-smoothing: antialiased;
}
.seikotsu-wrap img { max-width: 100%; height: auto; }
.seikotsu-wrap a { text-decoration: none; }

/* Screen reader only */
.sc-sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0;
  margin: -1px; overflow: hidden; clip: rect(0,0,0,0);
  white-space: nowrap; border: 0;
}

/* Main Layout */
.seikotsu-main-wrap { max-width: 960px; margin: 0 auto; padding: 0 8px; }
.seikotsu-layout { display: flex; gap: 12px; margin-top: 12px; align-items: flex-start; }
.seikotsu-sidebar-col { width: 200px; flex-shrink: 0; }
.seikotsu-main-col { flex: 1; min-width: 0; }

/* PC/Mobile sidebar — matches Home.tsx exactly */
@media (max-width: 767px) { .seikotsu-sidebar-col { display: none !important; } }
@media (min-width: 768px) { .seikotsu-sidebar-col { display: block !important; } }

/* Fixed CTA spacer */
.sc-cta-spacer { height: 64px; }

/* Symptom banner grid — 3 columns always */
.sc-symptom-grid {
  display: grid !important; grid-template-columns: repeat(3, 1fr) !important;
  gap: 4px; width: 100%;
}

/* Section Heading */
.sc-section-heading {
  text-align: center; padding: 10px 8px; font-size: 0.88rem;
  font-weight: 900; color: white; margin: 0;
  background: #FF6F61;
  letter-spacing: 0.06em; border-radius: 4px 4px 0 0;
}

/* Inline CTA Banner */
.sc-inline-cta {
  background: linear-gradient(135deg, #fff8f4 0%, #fff3ec 100%);
  border: 2px solid #FF6F61; border-radius: 12px; padding: 20px 16px; text-align: center;
}
.sc-inline-cta-btns { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.sc-btn-phone {
  display: inline-flex; align-items: center; gap: 6px;
  background: linear-gradient(135deg, #FF6F61, #FF6F61);
  color: white; font-weight: 900; font-size: 1rem;
  padding: 12px 22px; border-radius: 50px;
  box-shadow: 0 4px 14px rgba(255,111,97,0.35);
}
.sc-btn-net {
  display: inline-flex; align-items: center; gap: 6px;
  background: white; color: #FF6F61; border: 2px solid #FF6F61;
  font-weight: 900; font-size: 0.9rem; padding: 12px 22px; border-radius: 50px;
}

/* FAQ */
.sc-faq-item {
  border: 1px solid #ffe0cc; border-radius: 8px; margin-bottom: 8px;
  overflow: hidden; box-shadow: 0 1px 4px rgba(255,111,97,0.06);
}
.sc-faq-question {
  width: 100%; text-align: left; padding: 12px 14px;
  font-weight: 700; font-size: 0.82rem; background: white;
  display: flex; align-items: flex-start; gap: 8px;
  border: none; cursor: pointer; transition: background 0.15s;
  color: #1a1a1a; font-family: inherit;
}
.sc-faq-question.open { background: #fff8f4; }
.sc-faq-q-label { color: #FF6F61; flex-shrink: 0; font-size: 1rem; font-weight: 900; }
.sc-faq-q-text { flex: 1; }
.sc-faq-chevron { margin-left: auto; flex-shrink: 0; color: #FF6F61; font-size: 0.8rem; padding-top: 2px; }
.sc-faq-answer {
  display: none; padding: 12px 14px; font-size: 0.8rem; color: #555;
  background: #fff8f4; border-top: 1px solid #ffe0cc; line-height: 1.75;
}
.sc-faq-answer.open { display: flex; gap: 8px; }
.sc-faq-a-label { color: #FF6F61; font-weight: 900; flex-shrink: 0; }

/* Treatment Flow */
.sc-flow-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 12px; }
.sc-flow-item { text-align: center; border-radius: 8px; overflow: hidden; box-shadow: 0 1px 6px rgba(0,0,0,0.08); }
.sc-flow-label {
  background: #FF6F61;
  color: white; font-size: 0.72rem; font-weight: 700; padding: 5px 4px; letter-spacing: 0.03em;
}
.sc-flow-img { width: 100%; aspect-ratio: 1; object-fit: cover; display: block; }

/* About Section */
.sc-about-wrap { border-radius: 12px; overflow: hidden; box-shadow: 0 2px 12px rgba(255,111,97,0.1); border: 1px solid #ffe0cc; }
.sc-about-photo-wrap { position: relative; }
.sc-about-photo-overlay {
  position: absolute; bottom: 0; left: 0; right: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.55) 0%, transparent 100%);
  padding: 16px 14px 10px;
}
.sc-about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; }

/* Doctor Section */
.sc-doctor-photo-wrap { position: relative; }
.sc-doctor-photo-overlay {
  position: absolute; bottom: 0; left: 0; right: 0;
  background: linear-gradient(to top, rgba(255,111,97,0.85) 0%, transparent 100%);
  padding: 20px 14px 10px;
}

/* TopNav */
.seikotsu-topnav {
  background: #FF6F61;
  box-shadow: 0 2px 8px rgba(255,111,97,0.3);
  position: sticky; top: 0; z-index: 99;
}
@media (max-width: 767px) { .seikotsu-topnav { top: 58px; } }
.seikotsu-topnav-inner {
  max-width: 960px; margin: 0 auto;
  display: flex; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none;
}
.seikotsu-topnav-inner::-webkit-scrollbar { display: none; }
.sc-topnav-item {
  display: flex; align-items: center; gap: 4px;
  color: white; font-weight: 700; font-size: 0.82rem;
  padding: 11px 16px; border-right: 1px solid rgba(255,255,255,0.2);
  letter-spacing: 0.03em; white-space: nowrap; transition: background 0.15s; flex-shrink: 0;
}
.sc-topnav-item:hover { background: rgba(0,0,0,0.15); }
.sc-topnav-item.highlight { background: rgba(0,0,0,0.15); }
@media (max-width: 767px) { .sc-topnav-item { font-size: 0.78rem; padding: 10px 14px; } }

/* Header PC/Mobile */
.seikotsu-header-pc { display: none; }
.seikotsu-header-mob { display: flex; }
@media (min-width: 768px) {
  .seikotsu-header-pc { display: flex; }
  .seikotsu-header-mob { display: none; }
}

/* Sidebar hover */
.sc-sidebar-link:hover { background: #fff8f4 !important; color: #FF6F61 !important; }

/* Fixed CTA */
.seikotsu-fixed-cta {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 50;
  display: flex; height: 64px; box-shadow: 0 -4px 20px rgba(0,0,0,0.22);
}
.sc-cta-phone-btn { display: flex; }
@media (min-width: 768px) { .sc-cta-phone-btn { display: none !important; } }
.sc-cta-btn { transition: filter 0.15s, transform 0.15s; }
.sc-cta-btn:hover { filter: brightness(1.08); transform: translateY(-1px); }

@keyframes scCtaPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(6,199,85,0.45); }
  50% { box-shadow: 0 0 0 8px rgba(6,199,85,0); }
}
.sc-line-pulse { animation: scCtaPulse 2.2s ease-in-out infinite; }

@keyframes scCtaPulseOrange {
  0%, 100% { box-shadow: 0 0 0 0 rgba(255,111,97,0.45); }
  50% { box-shadow: 0 0 0 8px rgba(255,111,97,0); }
}
.sc-net-pulse { animation: scCtaPulseOrange 2.2s ease-in-out infinite 1.1s; }

/* Footer */
.seikotsu-footer { margin-top: 32px; border-top: 3px solid #FF6F61; }
.sc-footer-access { background: linear-gradient(135deg, #fff8f4 0%, #ffffff 100%); padding: 32px 16px; }
.sc-footer-inner { max-width: 960px; margin: 0 auto; }
.sc-footer-sitemap { background: #2d2d2d; padding: 28px 16px; }
.sc-footer-keywords { background: #222; padding: 16px; }
.sc-footer-copyright { background: #1a1a1a; padding: 14px 16px; text-align: center; }
.sc-footer-link:hover { color: #FF6F61 !important; }

/* Print */
@media print {
  .seikotsu-fixed-cta, .seikotsu-topnav { display: none !important; }
}

/* ============================================================
   症状ページ (sc-symptom-wrap)
   PC: 最大幅860px中央寄せ / スマホ: 全幅
   ============================================================ */

.sc-symptom-wrap {
  font-family: 'Noto Sans JP', sans-serif;
  color: #1a1a1a;
  background: #fff;
  max-width: 860px;
  margin: 0 auto;
  padding-bottom: 60px;
}

/* ---- ヒーロー ---- */
.sc-sym-hero { position: relative; overflow: hidden; border-radius: 0 0 16px 16px; }
.sc-sym-hero-img {
  position: relative; min-height: 320px;
  background-size: cover; background-position: center;
  display: flex; align-items: center; justify-content: center;
}
.sc-sym-hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(135deg, rgba(255,111,97,0.82) 0%, rgba(255,80,60,0.6) 100%);
}
.sc-sym-hero-content { position: relative; z-index: 1; text-align: center; padding: 48px 24px; }
.sc-sym-hero-noimg {
  background: linear-gradient(135deg, #FF6F61 0%, #ff4f3b 100%);
  text-align: center; padding: 48px 24px;
}
.sc-sym-hero-catch { color: rgba(255,255,255,0.9); font-size: 14px; letter-spacing: 0.08em; margin: 0 0 8px; }
.sc-sym-hero-main { color: #fff; font-size: clamp(22px, 4vw, 34px); font-weight: 900; line-height: 1.4; margin: 0 0 20px; }
.sc-sym-hero-badges { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.sc-sym-badge {
  background: rgba(255,255,255,0.22); border: 1px solid rgba(255,255,255,0.5);
  color: #fff; font-size: 12px; font-weight: 700; padding: 4px 12px; border-radius: 20px;
}

/* ---- イントロ ---- */
.sc-sym-intro { padding: 36px 20px 24px; }
.sc-sym-intro-inner { display: flex; gap: 28px; align-items: flex-start; }
.sc-sym-intro-text { flex: 1; min-width: 0; }
.sc-sym-intro-img { flex: 0 0 220px; }
.sc-sym-intro-img img { width: 100%; border-radius: 12px; object-fit: cover; }
.sc-sym-intro-lead { font-size: 15px; line-height: 1.85; color: #333; margin: 0 0 12px; }
.sc-sym-intro-lead2 { font-size: 14px; line-height: 1.8; color: #555; margin: 0 0 20px; }
.sc-sym-checklist {
  list-style: none; margin: 0; padding: 16px 20px;
  background: #fff8f7; border: 1.5px solid #ffe0dc; border-radius: 12px;
}
.sc-sym-check-item {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 7px 0; border-bottom: 1px solid #ffe0dc;
  font-size: 14px; line-height: 1.6; color: #333;
}
.sc-sym-check-item:last-child { border-bottom: none; }
.sc-sym-check-item svg { flex-shrink: 0; margin-top: 2px; }

/* ---- インラインCTAバー ---- */
.sc-sym-cta-bar {
  display: flex; gap: 10px; padding: 16px 20px;
  background: #fff8f7; border-top: 2px solid #ffe0dc; border-bottom: 2px solid #ffe0dc;
  margin: 8px 0; flex-wrap: wrap;
}
.sc-sym-cta-btn {
  flex: 1; min-width: 130px; display: flex; align-items: center; justify-content: center;
  gap: 8px; padding: 12px 16px; border-radius: 8px;
  font-size: 14px; font-weight: 700; text-decoration: none; color: #fff; transition: opacity 0.2s;
}
.sc-sym-cta-btn:hover { opacity: 0.85; color: #fff; }
.sc-sym-cta-line { background: linear-gradient(135deg, #FF6F61, #FF6F61); }
.sc-sym-cta-net  { background: linear-gradient(135deg, #FF6F61, #ff4f3b); }
.sc-sym-cta-tel  { background: linear-gradient(135deg, #2563eb, #1d4ed8); }

/* ---- 共通セクション ---- */
.sc-sym-section { padding: 44px 20px; }
.sc-sym-section-inner { max-width: 820px; margin: 0 auto; }
.sc-sym-section-title { margin: 0 0 20px; }
.sc-sym-title-center { text-align: center; }
.sc-sym-title-label {
  display: inline-block; font-size: clamp(17px, 2.5vw, 22px); font-weight: 900; color: #1a1a1a;
  border-bottom: 3px solid #FF6F61; padding-bottom: 6px;
}
.sc-sym-title-danger .sc-sym-title-label { border-bottom-color: #e53e3e; }
.sc-sym-section-lead { font-size: 14px; line-height: 1.85; color: #555; margin: 0 0 28px; text-align: center; }

/* ---- 原因カード ---- */
.sc-sym-causes { background: #fafafa; }
.sc-sym-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.sc-sym-card {
  background: #fff; border: 1.5px solid #ffe0dc; border-radius: 12px;
  padding: 20px; display: flex; gap: 14px; align-items: flex-start;
}
.sc-sym-card-icon {
  flex-shrink: 0; width: 48px; height: 48px; background: #fff3f2;
  border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #FF6F61;
}
.sc-sym-card-body { flex: 1; min-width: 0; }
.sc-sym-card-title { font-size: 14px; font-weight: 700; color: #1a1a1a; margin: 0 0 8px; line-height: 1.5; }
.sc-sym-card-text { font-size: 13px; line-height: 1.75; color: #555; margin: 0; }

/* ---- 放置するとどうなる ---- */
.sc-sym-neglect { background: #fff5f5; }
.sc-sym-neglect-list { display: flex; flex-direction: column; gap: 16px; }
.sc-sym-neglect-item {
  background: #fff; border: 1.5px solid #fecaca; border-radius: 12px;
  padding: 20px; display: flex; gap: 16px; align-items: flex-start;
}
.sc-sym-neglect-num {
  flex-shrink: 0; width: 32px; height: 32px; background: #e53e3e; color: #fff;
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
  font-size: 14px; font-weight: 900;
}
.sc-sym-neglect-icon { flex-shrink: 0; color: #e53e3e; display: flex; align-items: center; }
.sc-sym-neglect-body { flex: 1; min-width: 0; }
.sc-sym-neglect-title { font-size: 15px; font-weight: 700; color: #c53030; margin: 0 0 8px; }
.sc-sym-neglect-text { font-size: 13px; line-height: 1.75; color: #555; margin: 0; }

/* ---- 施術プラン ---- */
.sc-sym-plan { background: #fff; }
.sc-sym-plan-list { display: flex; flex-direction: column; gap: 20px; }
.sc-sym-plan-item {
  display: flex; gap: 20px; align-items: flex-start;
  background: #fff8f7; border: 1.5px solid #ffe0dc; border-radius: 12px; padding: 24px;
}
.sc-sym-plan-num {
  flex-shrink: 0; width: 52px; height: 52px;
  background: linear-gradient(135deg, #FF6F61, #ff4f3b);
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
}
.sc-sym-plan-num span { color: #fff; font-size: 18px; font-weight: 900; }
.sc-sym-plan-body { flex: 1; min-width: 0; }
.sc-sym-plan-title { font-size: 16px; font-weight: 700; color: #1a1a1a; margin: 0 0 10px; line-height: 1.5; }
.sc-sym-plan-text { font-size: 14px; line-height: 1.8; color: #555; margin: 0; }

/* ---- インナーマッスル ---- */
.sc-sym-inner-muscle { background: #f0fdf4; }
.sc-sym-inner-box {
  display: flex; gap: 24px; align-items: flex-start;
  background: #fff; border: 1.5px solid #bbf7d0; border-radius: 16px; padding: 28px;
}
.sc-sym-inner-icon {
  flex-shrink: 0; width: 72px; height: 72px; background: #dcfce7;
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
}
.sc-sym-inner-text { flex: 1; min-width: 0; }
.sc-sym-inner-title { font-size: 17px; font-weight: 700; color: #166534; margin: 0 0 10px; }
.sc-sym-inner-text p { font-size: 14px; line-height: 1.8; color: #555; margin: 0; }

/* ---- FAQ（症状ページ専用） ---- */
.sc-sym-faq { background: #fafafa; }
.sc-sym-faq-list { display: flex; flex-direction: column; gap: 10px; }
.sc-sym-faq-item { background: #fff; border: 1.5px solid #e5e7eb; border-radius: 10px; overflow: hidden; }
.sc-sym-faq-item.open { border-color: #FF6F61; }
.sc-sym-faq-q {
  width: 100%; display: flex; align-items: center; gap: 12px; padding: 16px 18px;
  background: none; border: none; cursor: pointer; text-align: left;
  font-size: 14px; font-weight: 700; color: #1a1a1a; line-height: 1.5; font-family: inherit;
}
.sc-sym-faq-q:hover { background: #fff8f7; }
.sc-sym-faq-q-label {
  flex-shrink: 0; width: 28px; height: 28px; background: #FF6F61; color: #fff;
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
  font-size: 13px; font-weight: 900;
}
.sc-sym-faq-arrow { margin-left: auto; flex-shrink: 0; color: #FF6F61; transition: transform 0.25s; }
.sc-sym-faq-item.open .sc-sym-faq-arrow { transform: rotate(180deg); }
.sc-sym-faq-a {
  max-height: 0; overflow: hidden; transition: max-height 0.3s ease;
  display: flex; gap: 12px; padding: 0 18px;
}
.sc-sym-faq-item.open .sc-sym-faq-a { padding: 0 18px 16px; }
.sc-sym-faq-a-label {
  flex-shrink: 0; width: 28px; height: 28px; background: #e5e7eb; color: #555;
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
  font-size: 13px; font-weight: 900; margin-top: 2px;
}
.sc-sym-faq-a p { font-size: 14px; line-height: 1.8; color: #555; margin: 0; }

/* ---- 患者様の声 ---- */
.sc-sym-reviews { background: #fff; }
.sc-sym-review-list { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.sc-sym-review-item { background: #fff8f7; border: 1.5px solid #ffe0dc; border-radius: 12px; padding: 20px; }
.sc-sym-review-header { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.sc-sym-review-avatar {
  width: 44px; height: 44px; background: linear-gradient(135deg, #FF6F61, #ff4f3b);
  border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.sc-sym-review-name { font-size: 13px; font-weight: 700; color: #1a1a1a; }
.sc-sym-review-stars { display: flex; gap: 2px; margin-top: 2px; }
.sc-sym-review-text { font-size: 13px; line-height: 1.75; color: #444; margin: 0 0 8px; }
.sc-sym-review-note { font-size: 11px; color: #999; margin: 0; }

/* ---- アクセス ---- */
.sc-sym-access { background: #fafafa; }
.sc-sym-access-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: start; }
.sc-sym-access-table { width: 100%; border-collapse: collapse; font-size: 14px; margin-bottom: 16px; }
.sc-sym-access-table th {
  background: #fff3f2; color: #FF6F61; font-weight: 700;
  padding: 10px 14px; border: 1px solid #ffe0dc; white-space: nowrap; width: 80px;
}
.sc-sym-access-table td { padding: 10px 14px; border: 1px solid #ffe0dc; background: #fff; color: #333; line-height: 1.6; }
.sc-sym-access-btns { display: flex; gap: 10px; }
.sc-sym-access-btn {
  flex: 1; display: flex; align-items: center; justify-content: center; gap: 8px;
  padding: 12px; border-radius: 8px; font-size: 14px; font-weight: 700;
  text-decoration: none; color: #fff; transition: opacity 0.2s;
}
.sc-sym-access-btn:hover { opacity: 0.85; color: #fff; }
.sc-sym-access-btn-tel { background: linear-gradient(135deg, #2563eb, #1d4ed8); }
.sc-sym-access-btn-net { background: linear-gradient(135deg, #FF6F61, #ff4f3b); }
.sc-sym-access-map iframe { width: 100%; height: 280px; border-radius: 10px; border: 0; }

/* ---- バナー画像 ---- */
.sc-sym-banner-wrap { margin: 0; line-height: 0; }
.sc-sym-banner-link { display: block; }
.sc-sym-banner-img { width: 100%; height: auto; display: block; }

/* ---- 施術写真 ---- */
.sc-sym-treat-img-wrap { margin: 0; line-height: 0; }
.sc-sym-treat-img { width: 100%; height: auto; display: block; max-height: 400px; object-fit: cover; }

/* ---- お悩みセクション ---- */
.sc-sym-omoni { background: #fff8f7; padding: 0 0 24px; }
.sc-sym-omoni-header { line-height: 0; margin-bottom: 0; }
.sc-sym-omoni-img { width: 100%; height: auto; display: block; }
.sc-sym-omoni-title {
  font-size: clamp(16px, 3vw, 22px); font-weight: 900; color: #FF6F61;
  text-align: center; padding: 24px 16px 16px; margin: 0;
  background: linear-gradient(90deg, #FF6F61, #ff4f3b);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}
.sc-sym-checklist {
  list-style: none; margin: 0 16px 16px; padding: 16px 20px;
  background: #fff; border: 1.5px solid #ffe0dc; border-radius: 12px;
}
.sc-sym-check-item {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 7px 0; border-bottom: 1px solid #ffe0dc;
  font-size: 14px; line-height: 1.6; color: #333;
}
.sc-sym-check-item:last-child { border-bottom: none; }
.sc-sym-check-item svg { flex-shrink: 0; margin-top: 3px; background: #FF6F61; border-radius: 50%; padding: 2px; }
.sc-sym-omoni-note {
  text-align: center; padding: 12px 16px;
  font-size: 15px; font-weight: 700; color: #FF6F61;
  background: linear-gradient(90deg, #fff3f2, #fff8f7);
  border-top: 1.5px solid #ffe0dc; margin: 0 16px;
  border-radius: 0 0 8px 8px;
}
.sc-sym-omoni-note p { margin: 0; }

/* ---- イントロテキスト ---- */
.sc-sym-intro-text-section { padding: 28px 20px 8px; }
.sc-sym-intro-lead { font-size: 15px; line-height: 1.85; color: #333; margin: 0 0 12px; }
.sc-sym-intro-lead2 { font-size: 14px; line-height: 1.8; color: #555; margin: 0; }

/* ---- 症状タワー画像 ---- */
.sc-sym-syouzyou-wrap { margin: 8px 0; }
.sc-sym-syouzyou-img { width: 100%; height: auto; display: block; }

/* ---- FAQ open状態（クラス名修正） ---- */
.sc-sym-faq-item.sc-sym-faq-open { border-color: #FF6F61; }
.sc-sym-faq-item.sc-sym-faq-open .sc-sym-faq-arrow { transform: rotate(180deg); }
.sc-sym-faq-item.sc-sym-faq-open .sc-sym-faq-a { padding: 0 18px 16px; }

/* ---- 症状ページ スマホ対応 (767px以下) ---- */
@media (max-width: 767px) {
  .sc-symptom-wrap { padding-bottom: 80px; }
  .sc-sym-hero-img { min-height: 220px; }
  .sc-sym-hero-content, .sc-sym-hero-noimg { padding: 32px 16px; }
  .sc-sym-intro { padding: 24px 16px 16px; }
  .sc-sym-intro-inner { flex-direction: column; }
  .sc-sym-intro-img { flex: none; width: 100%; }
  .sc-sym-cta-bar { padding: 12px 16px; gap: 8px; }
  .sc-sym-cta-btn { font-size: 13px; padding: 11px 10px; min-width: 0; }
  .sc-sym-section { padding: 32px 16px; }
  .sc-sym-cards { grid-template-columns: 1fr; }
  .sc-sym-card { flex-direction: column; gap: 10px; }
  .sc-sym-neglect-item { flex-direction: column; gap: 10px; }
  .sc-sym-plan-item { flex-direction: column; gap: 12px; }
  .sc-sym-inner-box { flex-direction: column; gap: 16px; }
  .sc-sym-inner-icon { width: 56px; height: 56px; }
  .sc-sym-review-list { grid-template-columns: 1fr; }
  .sc-sym-access-grid { grid-template-columns: 1fr; }
  .sc-sym-access-btns { flex-direction: column; }
  .sc-sym-faq-q { font-size: 13px; padding: 14px; }
  .sc-sym-faq-a { padding: 0 14px; }
  .sc-sym-faq-item.open .sc-sym-faq-a { padding: 0 14px 14px; }
}

/* ============================================================
   固定ページ共通スタイル (.sc-fp-*)
   Design: Living Coral (#FF6F61) — Noto Sans JP
   ============================================================ */

/* ── ラッパー ── */
.sc-fp-wrap { padding-bottom: 80px; }

/* ── ヒーロー ── */
.sc-fp-hero {
  position: relative; width: 100%; min-height: 200px;
  background: #1a1a1a; overflow: hidden;
}
.sc-fp-hero-img {
  width: 100%; height: 240px; object-fit: cover; display: block;
  filter: brightness(0.72);
}
.sc-fp-hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0.15) 60%);
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 20px 16px;
}
.sc-fp-hero-badge {
  display: inline-block; background: var(--sc-primary); color: white;
  font-size: 0.62rem; font-weight: 700; letter-spacing: 0.1em;
  padding: 2px 10px; border-radius: 3px; margin-bottom: 6px;
}
.sc-fp-hero-title {
  font-size: 1.35rem; font-weight: 900; color: white;
  line-height: 1.3; margin: 0 0 4px; text-shadow: 0 2px 8px rgba(0,0,0,0.5);
}
.sc-fp-hero-sub {
  font-size: 0.78rem; color: rgba(255,255,255,0.88);
  margin: 0; line-height: 1.6;
}

/* ── パンくず ── */
.sc-fp-breadcrumb {
  font-size: 0.72rem; color: #888; padding: 8px 12px;
  background: #fafafa; border-bottom: 1px solid #f0f0f0;
}
.sc-fp-breadcrumb a { color: var(--sc-primary); }
.sc-fp-breadcrumb span { margin: 0 4px; }

/* ── カード共通 ── */
.sc-fp-card {
  background: white; border-radius: 10px; padding: 16px;
  margin-bottom: 10px; box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

/* ── セクション見出し ── */
.sc-fp-section-title {
  font-size: 0.72rem; font-weight: 700; color: var(--sc-primary);
  letter-spacing: 0.12em; text-align: center; margin: 0 0 2px;
}
.sc-fp-section-main {
  font-size: 1.05rem; font-weight: 900; color: #1a1a1a;
  text-align: center; margin: 0 0 14px; line-height: 1.4;
}

/* ── 実績バッジ ── */
.sc-fp-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; }
.sc-fp-stat {
  background: linear-gradient(135deg,#fff8f4,#fff3ec);
  border: 1px solid #ffe0d6; border-radius: 10px;
  padding: 12px 6px; text-align: center;
}
.sc-fp-stat-num {
  font-size: 1.3rem; font-weight: 900; color: var(--sc-primary);
  line-height: 1.1; display: block;
}
.sc-fp-stat-unit { font-size: 0.62rem; font-weight: 700; color: var(--sc-primary); }
.sc-fp-stat-label { font-size: 0.6rem; color: #888; margin-top: 2px; display: block; }

/* ── 強みリスト ── */
.sc-fp-strength-list { display: flex; flex-direction: column; gap: 10px; }
.sc-fp-strength-item {
  display: flex; gap: 14px; align-items: flex-start;
  padding: 14px; background: #fafafa; border-radius: 10px;
  border: 1px solid #f0f0f0;
}
.sc-fp-strength-icon {
  width: 44px; height: 44px; border-radius: 50%; flex-shrink: 0;
  background: linear-gradient(135deg, var(--sc-primary), var(--sc-primary-dark));
  display: flex; align-items: center; justify-content: center;
}
.sc-fp-strength-num {
  background: var(--sc-primary); color: white;
  font-size: 0.6rem; padding: 1px 7px; border-radius: 3px; font-weight: 700;
}
.sc-fp-strength-title {
  font-weight: 700; font-size: 0.88rem; color: #1a1a1a;
  margin-bottom: 4px; display: flex; align-items: center; gap: 6px;
}
.sc-fp-strength-text { font-size: 0.78rem; color: #666; line-height: 1.7; margin: 0; }

/* ── 施術の流れ / 来院ステップ ── */
.sc-fp-flow { display: flex; flex-direction: column; }
.sc-fp-flow-row { display: flex; gap: 0; position: relative; }
.sc-fp-flow-timeline {
  display: flex; flex-direction: column; align-items: center;
  width: 48px; flex-shrink: 0;
}
.sc-fp-flow-num {
  width: 40px; height: 40px; border-radius: 50%; flex-shrink: 0;
  background: linear-gradient(135deg, var(--sc-primary), var(--sc-primary-dark));
  display: flex; align-items: center; justify-content: center;
  color: white; font-weight: 900; font-size: 0.72rem;
  box-shadow: 0 3px 10px rgba(255,111,97,0.35);
}
.sc-fp-flow-line {
  width: 2px; flex: 1; background: #f0e8e6; min-height: 20px;
}
.sc-fp-flow-content {
  flex: 1; padding-left: 12px;
}
.sc-fp-flow-step {
  font-size: 0.62rem; font-weight: 700; color: var(--sc-primary);
  letter-spacing: 0.06em; margin-bottom: 2px; padding-top: 8px;
}
.sc-fp-flow-title {
  font-weight: 700; font-size: 0.88rem; color: #1a1a1a; margin-bottom: 4px;
}
.sc-fp-flow-text {
  font-size: 0.78rem; color: #666; line-height: 1.7; margin: 0 0 8px;
}
.sc-fp-flow-img {
  width: 100%; max-width: 280px; height: 120px;
  object-fit: cover; border-radius: 8px;
}

/* ── 院内写真グリッド ── */
.sc-fp-clinic-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 8px;
}
.sc-fp-clinic-img {
  width: 100%; height: 140px; object-fit: cover; border-radius: 8px;
}

/* ── 症状バナーグリッド ── */
.sc-fp-symptom-grid {
  display: grid; grid-template-columns: repeat(2,1fr); gap: 8px;
}
.sc-fp-symptom-item {
  display: block; position: relative; border-radius: 8px;
  overflow: hidden; text-decoration: none;
}
.sc-fp-symptom-item img {
  width: 100%; height: 80px; object-fit: cover; display: block;
}
.sc-fp-symptom-overlay {
  position: absolute; inset: 0; background: rgba(0,0,0,0.38);
  display: flex; align-items: center; justify-content: center;
}
.sc-fp-symptom-label {
  color: white; font-weight: 900; font-size: 0.88rem;
  text-shadow: 0 1px 4px rgba(0,0,0,0.5);
}

/* ── チェックリスト ── */
.sc-fp-checklist { display: flex; flex-direction: column; gap: 8px; }
.sc-fp-check-item {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 10px 12px; background: #fff8f4; border-radius: 8px;
}
.sc-fp-check-text { font-size: 0.84rem; color: #333; line-height: 1.6; }

/* ── 診療時間テーブル ── */
.sc-fp-hours-table { width: 100%; border-collapse: collapse; font-size: 0.82rem; }
.sc-fp-hours-table th {
  background: #fff8f4; color: #555; font-weight: 700;
  padding: 8px 10px; border: 1px solid #f0e8e6; text-align: left;
}
.sc-fp-hours-table td {
  padding: 8px 10px; border: 1px solid #f0e8e6; color: #333;
}
.sc-fp-hours-table tr:nth-child(even) td { background: #fafafa; }

/* ── アクセス方法カード ── */
.sc-fp-access-cards { display: flex; flex-direction: column; gap: 8px; }
.sc-fp-access-card {
  display: flex; gap: 12px; align-items: flex-start;
  padding: 12px; background: #fafafa; border-radius: 8px;
  border: 1px solid #f0f0f0;
}
.sc-fp-access-icon {
  width: 40px; height: 40px; border-radius: 50%; flex-shrink: 0;
  background: linear-gradient(135deg, var(--sc-primary), var(--sc-primary-dark));
  display: flex; align-items: center; justify-content: center;
}
.sc-fp-access-label { font-weight: 700; font-size: 0.84rem; color: #1a1a1a; margin-bottom: 2px; }
.sc-fp-access-text { font-size: 0.78rem; color: #666; line-height: 1.6; margin: 0; }

/* ── 料金カード ── */
.sc-fp-price-grid { display: flex; flex-direction: column; gap: 10px; }
.sc-fp-price-card {
  border: 1px solid #f0f0f0; border-radius: 10px;
  overflow: hidden; background: white;
}
.sc-fp-price-card.sc-fp-price-highlight {
  border-color: var(--sc-primary);
  box-shadow: 0 4px 16px rgba(255,111,97,0.18);
}
.sc-fp-price-head {
  padding: 10px 14px; background: #fafafa;
  display: flex; justify-content: space-between; align-items: center;
}
.sc-fp-price-card.sc-fp-price-highlight .sc-fp-price-head {
  background: linear-gradient(135deg, var(--sc-primary), var(--sc-primary-dark));
}
.sc-fp-price-name {
  font-weight: 700; font-size: 0.9rem; color: #1a1a1a;
}
.sc-fp-price-card.sc-fp-price-highlight .sc-fp-price-name { color: white; }
.sc-fp-price-badge {
  background: var(--sc-primary); color: white;
  font-size: 0.6rem; font-weight: 700; padding: 2px 8px; border-radius: 3px;
}
.sc-fp-price-card.sc-fp-price-highlight .sc-fp-price-badge {
  background: white; color: var(--sc-primary);
}
.sc-fp-price-body { padding: 10px 14px; }
.sc-fp-price-amount {
  font-size: 1.5rem; font-weight: 900; color: var(--sc-primary);
}
.sc-fp-price-tax { font-size: 0.7rem; color: #888; }
.sc-fp-price-time { font-size: 0.78rem; color: #666; margin-top: 2px; }
.sc-fp-price-note { font-size: 0.72rem; color: #888; margin-top: 4px; line-height: 1.6; }

/* ── 保険診療カード ── */
.sc-fp-insurance-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.sc-fp-insurance-card {
  background: #fff8f4; border: 1px solid #ffe0d6;
  border-radius: 10px; padding: 12px; text-align: center;
}
.sc-fp-insurance-type { font-size: 0.7rem; color: #888; margin-bottom: 4px; }
.sc-fp-insurance-price {
  font-size: 1.2rem; font-weight: 900; color: var(--sc-primary);
}
.sc-fp-insurance-note { font-size: 0.68rem; color: #888; margin-top: 4px; line-height: 1.5; }

/* ── FAQ ── */
.sc-fp-faq-list { display: flex; flex-direction: column; gap: 8px; }
.sc-fp-faq-item {
  border: 1px solid #f0f0f0; border-radius: 8px; overflow: hidden;
}
.sc-fp-faq-q {
  display: flex; justify-content: space-between; align-items: center;
  padding: 12px 14px; cursor: pointer; background: white;
  font-weight: 700; font-size: 0.84rem; color: #1a1a1a;
  gap: 8px;
}
.sc-fp-faq-q-badge {
  background: var(--sc-primary); color: white;
  font-size: 0.7rem; font-weight: 900; padding: 1px 8px;
  border-radius: 3px; flex-shrink: 0;
}
.sc-fp-faq-arrow {
  flex-shrink: 0; transition: transform 0.2s;
  color: var(--sc-primary);
}
.sc-fp-faq-a {
  display: none; padding: 0 14px; background: #fff8f4;
}
.sc-fp-faq-a-inner {
  padding: 10px 0; font-size: 0.82rem; color: #444; line-height: 1.75;
  border-top: 1px solid #ffe0d6;
}
.sc-fp-faq-item.open .sc-fp-faq-a { display: block; }
.sc-fp-faq-item.open .sc-fp-faq-arrow { transform: rotate(180deg); }

/* ── CTAボックス ── */
.sc-fp-cta {
  background: linear-gradient(135deg,#fff8f4,#fff3ec);
  border: 2px solid var(--sc-primary); border-radius: 12px;
  padding: 20px 16px; text-align: center; margin-bottom: 10px;
}
.sc-fp-cta-title { font-weight: 900; font-size: 1rem; color: #1a1a1a; margin: 0 0 4px; }
.sc-fp-cta-sub { font-size: 0.78rem; color: #666; margin: 0 0 14px; }
.sc-fp-cta-btns { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.sc-fp-cta-tel {
  display: inline-flex; align-items: center; gap: 6px;
  background: linear-gradient(135deg, var(--sc-primary), var(--sc-primary-dark));
  color: white; font-weight: 900; font-size: 1rem;
  padding: 12px 22px; border-radius: 50px;
  box-shadow: 0 4px 14px rgba(255,111,97,0.35);
}
.sc-fp-cta-net {
  display: inline-flex; align-items: center; gap: 6px;
  background: white; color: var(--sc-primary);
  border: 2px solid var(--sc-primary);
  font-weight: 900; font-size: 0.9rem;
  padding: 12px 22px; border-radius: 50px;
}

/* ── レスポンシブ ── */
@media (max-width: 767px) {
  .sc-fp-hero-img { height: 200px; }
  .sc-fp-hero-title { font-size: 1.1rem; }
  .sc-fp-stats { grid-template-columns: repeat(3,1fr); }
  .sc-fp-stat-num { font-size: 1.1rem; }
  .sc-fp-insurance-grid { grid-template-columns: 1fr 1fr; }
  .sc-fp-cta-btns { flex-direction: column; align-items: center; }
}
