/* ============================================================
   CoCon フリースクール検索 - Pattern A（Warm & Supportive）
   newsup_child 子テーマ組込用・統合スタイル
   ------------------------------------------------------------
   スコープ方針：すべて .freeschool-app 配下に限定。
   デザイントークンも :root ではなく .freeschool-app に定義し、
   テーマの他ページへ一切漏らさない（グローバル要素セレクタ不使用）。
   対象：archive-school_list / single-school_list / page-freeschool-compare
   ------------------------------------------------------------
   フォント：M PLUS Rounded 1c + Noto Sans JP
   ※ @import ではなく wp_enqueue_style で fonts.googleapis.com から
     読み込む前提（ENQUEUE_NOTES.md 参照）。開発時は下記 @import を有効化可。
   ============================================================ */

/* @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;600;700;800&family=M+PLUS+Rounded+1c:wght@400;500;700;800&display=swap'); */

/* ---- Design Tokens（.freeschool-app スコープ）---- */
.freeschool-app {
  --warm-50: #FFF8F0;
  --warm-100: #FEF0E0;
  --warm-200: #FDE0C0;
  --warm-300: #FBCFA0;
  --warm-400: #F9A87A;
  --warm-500: #F97316;
  --warm-600: #EA580C;
  --warm-700: #C2410C;
  --warm-accent: #FCD34D;
  --warm-green: #4ADE80;
  --warm-green-d: #16A34A;
  --text-dark: #431407;
  --text-mid: #7C2D12;
  --text-light: #9A3412;

  --color-primary-50: #FFF8F0;
  --color-primary-100: #FEF0E0;
  --color-primary-200: #FDE0C0;
  --color-primary-300: #FBCFA0;
  --color-primary-400: #F9A87A;
  --color-primary-500: #F97316;
  --color-primary-600: #EA580C;
  --color-primary-700: #C2410C;
  --color-primary-800: #9A3412;
  --color-primary-900: #7C2D12;

  --color-accent-400: #4ADE80;
  --color-accent-500: #16A34A;
  --color-accent-600: #15803D;

  --color-gray-50: #FFF8F0;
  --color-gray-100: #FBEEE0;
  --color-gray-200: #F3DFCB;
  --color-gray-300: #E8CBB0;
  --color-gray-400: #C89B76;
  --color-gray-500: #9A6B4A;
  --color-gray-600: #7C2D12;
  --color-gray-700: #5C2410;
  --color-gray-800: #4A1D0C;
  --color-gray-900: #431407;

  --color-bg: #FFFBF7;
  --color-surface: #FFFFFF;
  --color-surface-2: #FEF0E0;
  --color-border: #FDE8D8;
  --color-border-subtle: #FFF0E4;
  --color-text-primary: #431407;
  --color-text-secondary: #7C2D12;
  --color-text-muted: #9A6B4A;

  --font-sans: 'M PLUS Rounded 1c', 'Noto Sans JP', sans-serif;
  --font-size-xs: 0.75rem;
  --font-size-sm: 0.875rem;
  --font-size-base: 1rem;
  --font-size-lg: 1.125rem;
  --font-size-xl: 1.25rem;
  --font-size-2xl: 1.5rem;
  --font-size-3xl: 1.875rem;
  --font-size-4xl: 2.25rem;

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;

  --radius-sm: 0.5rem;
  --radius-md: 0.75rem;
  --radius-lg: 0.875rem;
  --radius-xl: 1.25rem;
  --radius-2xl: 1.5rem;
  --radius-full: 9999px;

  --shadow-sm: 0 1px 2px 0 rgba(249, 115, 22, 0.06);
  --shadow-md: 0 4px 6px -1px rgba(249, 115, 22, 0.08), 0 2px 4px -1px rgba(249, 115, 22, 0.05);
  --shadow-lg: 0 10px 24px -6px rgba(249, 115, 22, 0.14), 0 4px 8px -4px rgba(249, 115, 22, 0.08);
  --shadow-xl: 0 20px 30px -8px rgba(249, 115, 22, 0.16), 0 10px 12px -6px rgba(249, 115, 22, 0.06);
  --shadow-card: 0 2px 12px rgba(249, 115, 22, 0.06);

  --transition-fast: 150ms ease;
  --transition-base: 200ms ease;
  --transition-slow: 300ms ease;

  --container-max: 1200px;
  --sidebar-width: 280px;
  --header-height: 64px;

  font-family: var(--font-sans);
  color: var(--color-text-primary);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

/* ---- 局所リセット（ラッパー配下のみ）---- */
.freeschool-app *,
.freeschool-app *::before,
.freeschool-app *::after {
  box-sizing: border-box;
}
.freeschool-app img { max-width: 100%; height: auto; display: block; }
.freeschool-app a { color: inherit; text-decoration: none; }
.freeschool-app ul,
.freeschool-app ol { list-style: none; margin: 0; padding: 0; }
.freeschool-app button {
  cursor: pointer;
  font-family: inherit;
  border: none;
  background: none;
}
.freeschool-app input,
.freeschool-app select,
.freeschool-app textarea { font-family: inherit; }
.freeschool-app h1,
.freeschool-app h2,
.freeschool-app h3,
.freeschool-app h4 { margin: 0; }

/* ---- Layout ---- */
.freeschool-app .fs-container {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 var(--space-6);
}

/* ---- Buttons ---- */
.freeschool-app .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  padding: 0.5rem var(--space-5);
  font-size: 0.825rem;
  font-weight: 700;
  border-radius: var(--radius-full);
  transition: all var(--transition-base);
  white-space: nowrap;
  cursor: pointer;
  border: none;
  line-height: 1.4;
}
.freeschool-app .btn-primary {
  background: linear-gradient(135deg, var(--warm-500), var(--warm-600));
  color: #fff;
  box-shadow: 0 2px 10px rgba(249, 115, 22, 0.3);
}
.freeschool-app .btn-primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(249, 115, 22, 0.4);
  color: #fff;
}
.freeschool-app .btn-outline {
  background: #fff;
  color: var(--warm-600);
  border: 2px solid var(--warm-200);
}
.freeschool-app .btn-outline:hover {
  background: var(--warm-50);
  border-color: var(--warm-400);
  color: var(--warm-600);
}
.freeschool-app .btn-ghost { background: transparent; color: var(--text-light); }
.freeschool-app .btn-ghost:hover { background: var(--warm-100); color: var(--warm-600); }
.freeschool-app .btn-sm { padding: 0.375rem var(--space-4); font-size: var(--font-size-xs); }
.freeschool-app .btn-lg { padding: 0.875rem var(--space-8); font-size: var(--font-size-base); }
.freeschool-app .btn-accent {
  background: linear-gradient(135deg, var(--warm-green), var(--warm-green-d));
  color: #fff;
  box-shadow: 0 2px 8px rgba(22, 163, 74, 0.3);
}
.freeschool-app .btn-accent:hover { transform: translateY(-1px); color: #fff; }

/* ---- Badges ---- */
.freeschool-app .badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 0.2rem 0.6rem;
  border-radius: var(--radius-full);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  line-height: 1.5;
}
.freeschool-app .badge-blue   { background: var(--warm-50); color: var(--warm-700); border: 1px solid var(--warm-200); }
.freeschool-app .badge-green  { background: #F0FDF4; color: #166534; border: 1px solid #BBF7D0; }
.freeschool-app .badge-orange { background: #FFF7ED; color: #92400E; border: 1px solid #FED7AA; }
.freeschool-app .badge-purple { background: #F5F3FF; color: #4C1D95; border: 1px solid #DDD6FE; }
.freeschool-app .badge-gray   { background: var(--warm-100); color: var(--text-mid); border: 1px solid var(--warm-200); }
.freeschool-app .badge-pr     { background: linear-gradient(135deg, var(--warm-accent), var(--warm-500)); color: #431407; }

/* ---- Card ---- */
.freeschool-app .card {
  background: var(--color-surface);
  border: 1.5px solid var(--color-border);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-card);
  overflow: hidden;
  transition: all var(--transition-base);
}

/* ---- Stars ---- */
.freeschool-app .stars { display: inline-flex; gap: 2px; color: #FBBF24; font-size: var(--font-size-sm); }

/* ---- Form ---- */
.freeschool-app .form-group { display: flex; flex-direction: column; gap: var(--space-1); }
.freeschool-app .form-label {
  font-size: var(--font-size-xs);
  font-weight: 700;
  color: var(--warm-500);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.freeschool-app .form-input {
  width: 100%;
  padding: 0.625rem var(--space-3);
  font-size: var(--font-size-sm);
  color: var(--color-text-primary);
  background: var(--color-bg);
  border: 2px solid var(--warm-200);
  border-radius: var(--radius-md);
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
  outline: none;
  appearance: none;
}
.freeschool-app .form-input:focus {
  border-color: var(--warm-400);
  box-shadow: 0 0 0 3px rgba(249, 115, 22, 0.12);
}
.freeschool-app select.form-input {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%23F97316'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  background-size: 1rem;
  padding-right: 2.5rem;
}

/* ---- Checkbox tags ---- */
.freeschool-app .tag-group { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.freeschool-app .tag-checkbox { position: absolute; opacity: 0; width: 0; height: 0; }
.freeschool-app .tag-label {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 0.35rem 0.75rem;
  font-size: var(--font-size-xs);
  font-weight: 600;
  color: var(--text-light);
  background: var(--color-surface);
  border: 1.5px solid var(--warm-200);
  border-radius: var(--radius-full);
  cursor: pointer;
  transition: all var(--transition-fast);
  user-select: none;
}
.freeschool-app .tag-label:hover { border-color: var(--warm-400); color: var(--warm-600); background: var(--warm-50); }
.freeschool-app .tag-checkbox:checked + .tag-label {
  background: linear-gradient(135deg, var(--warm-500), var(--warm-600));
  border-color: var(--warm-500);
  color: #fff;
}
.freeschool-app .tag-checkbox:focus-visible + .tag-label {
  box-shadow: 0 0 0 3px rgba(249, 115, 22, 0.25);
}

/* ---- Breadcrumb ---- */
.freeschool-app .breadcrumb {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--font-size-xs);
  color: var(--color-text-muted);
  flex-wrap: wrap;
}
.freeschool-app .breadcrumb a { color: var(--warm-600); }
.freeschool-app .breadcrumb a:hover { color: var(--warm-700); }
.freeschool-app .breadcrumb-sep { color: var(--warm-300); }

/* ============================================================
   検索一覧（archive-school_list）
   ============================================================ */
.freeschool-app .search-page-header {
  background: #fff;
  border-bottom: 1px solid var(--color-border);
  padding: var(--space-5) 0;
  border-radius: var(--radius-xl);
  margin-top: var(--space-4);
}
.freeschool-app .search-top-bar { display: flex; align-items: center; gap: var(--space-3); flex-wrap: wrap; }
.freeschool-app .search-top-input { flex: 1; position: relative; min-width: 220px; }
.freeschool-app .search-top-input input {
  width: 100%;
  padding: 0.625rem 1rem 0.625rem 2.75rem;
  border: 1.5px solid var(--color-primary-300);
  border-radius: var(--radius-full);
  font-size: var(--font-size-sm);
  background: var(--color-primary-50);
  outline: none;
}
.freeschool-app .search-top-input .search-icon {
  position: absolute; left: 1rem; top: 50%; transform: translateY(-50%);
  color: var(--color-primary-400);
}

.freeschool-app .search-layout {
  display: grid;
  grid-template-columns: var(--sidebar-width) 1fr;
  gap: var(--space-8);
  padding: var(--space-8) 0 var(--space-16);
  align-items: start;
}

.freeschool-app .filter-sidebar { position: sticky; top: var(--space-4); }
.freeschool-app .filter-panel {
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  overflow: hidden;
}
.freeschool-app .filter-panel-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: var(--space-4) var(--space-5);
  border-bottom: 1px solid var(--color-border);
  background: var(--color-gray-50);
}
.freeschool-app .filter-panel-header h3 {
  font-size: var(--font-size-sm); font-weight: 700; color: var(--color-text-primary);
  display: flex; align-items: center; gap: var(--space-2);
}
.freeschool-app .filter-clear-btn {
  font-size: var(--font-size-xs); color: var(--color-primary-600);
  background: none; border: none; cursor: pointer; font-weight: 500;
}
.freeschool-app .filter-section {
  padding: var(--space-4) var(--space-5);
  border-bottom: 1px solid var(--color-border-subtle);
}
.freeschool-app .filter-section:last-of-type { border-bottom: none; }
.freeschool-app .filter-section-title {
  font-size: var(--font-size-xs); font-weight: 700; color: var(--color-text-muted);
  text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: var(--space-3);
  display: flex; align-items: center; gap: var(--space-1);
}
.freeschool-app .filter-check-list { display: flex; flex-direction: column; gap: var(--space-2); }
.freeschool-app .filter-check-list label {
  display: flex; align-items: center; gap: var(--space-2);
  font-size: var(--font-size-sm); cursor: pointer; color: var(--color-text-secondary);
}
.freeschool-app .filter-check-list input[type="checkbox"] { accent-color: var(--color-primary-500); }
.freeschool-app .filter-apply-btn {
  width: calc(100% - var(--space-10));
  margin: var(--space-4) var(--space-5);
  padding: 0.75rem;
  background: linear-gradient(135deg, var(--color-primary-500), var(--color-primary-700));
  color: #fff; border: none; border-radius: var(--radius-full);
  font-size: var(--font-size-sm); font-weight: 700; cursor: pointer;
  transition: all var(--transition-base);
}
.freeschool-app .filter-apply-btn:hover {
  box-shadow: 0 4px 12px rgba(249, 115, 22, 0.35);
  transform: translateY(-1px);
}

.freeschool-app .results-header {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--space-3); margin-bottom: var(--space-5); flex-wrap: wrap;
}
.freeschool-app .results-count { font-size: var(--font-size-sm); color: var(--color-text-secondary); }
.freeschool-app .results-count strong {
  font-size: var(--font-size-xl); font-weight: 800; color: var(--color-text-primary);
}
.freeschool-app .results-sort { display: flex; align-items: center; gap: var(--space-2); }
.freeschool-app .results-sort label { font-size: var(--font-size-xs); color: var(--color-text-muted); white-space: nowrap; }

.freeschool-app .active-filters { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-bottom: var(--space-5); }
.freeschool-app .active-filter-tag {
  display: inline-flex; align-items: center; gap: var(--space-1);
  padding: 0.3rem 0.75rem;
  background: var(--color-primary-50);
  border: 1.5px solid var(--color-primary-200);
  border-radius: var(--radius-full);
  font-size: var(--font-size-xs); font-weight: 500; color: var(--color-primary-700);
}
.freeschool-app .active-filter-tag a { font-size: 0.9rem; color: var(--color-primary-400); line-height: 1; }

.freeschool-app .school-list { display: flex; flex-direction: column; gap: var(--space-4); }
.freeschool-app .school-list-card {
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-card);
  display: grid;
  grid-template-columns: 200px 1fr auto;
  overflow: hidden;
  transition: all var(--transition-base);
}
.freeschool-app .school-list-card:hover {
  box-shadow: var(--shadow-lg);
  border-color: var(--color-primary-200);
  transform: translateY(-2px);
}
.freeschool-app .school-list-card-image {
  width: 200px; min-height: 160px;
  display: flex; align-items: center; justify-content: center;
  font-size: 3rem; position: relative; flex-shrink: 0;
  background: linear-gradient(135deg, #FFF0E8, #FDE8D8);
}
.freeschool-app .school-list-card-image img { width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0; }
.freeschool-app .school-list-card-body { padding: var(--space-5); display: flex; flex-direction: column; gap: var(--space-3); }
.freeschool-app .school-list-card-name { font-size: var(--font-size-lg); font-weight: 700; color: var(--color-text-primary); }
.freeschool-app .school-list-card-desc {
  font-size: var(--font-size-sm); color: var(--color-text-secondary); line-height: 1.6;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.freeschool-app .school-list-card-meta { display: flex; flex-wrap: wrap; gap: var(--space-4); }
.freeschool-app .school-list-card-meta-item {
  display: flex; align-items: center; gap: var(--space-1);
  font-size: var(--font-size-xs); color: var(--color-text-secondary);
}
.freeschool-app .school-list-card-sidebar {
  padding: var(--space-5);
  display: flex; flex-direction: column; align-items: flex-end; justify-content: space-between;
  min-width: 170px;
  border-left: 1px solid var(--color-border-subtle);
  background: var(--color-gray-50);
}
.freeschool-app .school-list-card-price-block { text-align: right; }
.freeschool-app .school-list-card-price-label { font-size: 0.65rem; color: var(--color-text-muted); text-transform: uppercase; letter-spacing: 0.05em; }
.freeschool-app .school-list-card-price-amount { font-size: var(--font-size-xl); font-weight: 800; color: var(--color-primary-600); letter-spacing: -0.02em; }
.freeschool-app .school-list-card-price-unit { font-size: var(--font-size-xs); color: var(--color-text-muted); }
.freeschool-app .school-list-card-actions { display: flex; flex-direction: column; gap: var(--space-2); width: 100%; margin-top: var(--space-3); }
.freeschool-app .compare-check-wrapper { display: flex; align-items: center; gap: var(--space-2); }
.freeschool-app .compare-check { width: 16px; height: 16px; accent-color: var(--color-primary-500); }
.freeschool-app .compare-check-label { font-size: var(--font-size-xs); color: var(--color-text-secondary); cursor: pointer; }

/* 空状態 */
.freeschool-app .fs-empty {
  text-align: center;
  padding: var(--space-16) var(--space-6);
  background: #fff;
  border: 1px dashed var(--color-border);
  border-radius: var(--radius-xl);
  color: var(--color-text-muted);
}
.freeschool-app .fs-empty-icon { font-size: 3rem; margin-bottom: var(--space-3); }
.freeschool-app .fs-empty h3 { font-size: var(--font-size-lg); color: var(--color-text-primary); margin-bottom: var(--space-2); }

/* Compare bar */
.freeschool-app .compare-bar {
  position: fixed; bottom: 0; left: 0; right: 0;
  background: #fff;
  border-top: 2px solid var(--color-primary-300);
  box-shadow: 0 -4px 24px rgba(124, 45, 18, 0.12);
  padding: var(--space-3) var(--space-6);
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-4);
  z-index: 200;
}
.freeschool-app .compare-bar-items { display: flex; gap: var(--space-2); flex-wrap: wrap; }
.freeschool-app .compare-bar-item {
  display: flex; align-items: center; gap: var(--space-2);
  padding: var(--space-2) var(--space-3);
  background: var(--color-primary-50);
  border: 1.5px solid var(--color-primary-200);
  border-radius: var(--radius-lg);
  font-size: var(--font-size-xs); font-weight: 600; color: var(--color-primary-700);
}
.freeschool-app .compare-bar-item button { color: var(--color-primary-400); }

/* Pagination */
.freeschool-app .pagination { display: flex; justify-content: center; align-items: center; gap: var(--space-2); margin-top: var(--space-10); flex-wrap: wrap; }
.freeschool-app .pagination .page-numbers {
  min-width: 38px; height: 38px; padding: 0 0.5rem;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1.5px solid var(--color-border);
  border-radius: var(--radius-md);
  font-size: var(--font-size-sm); font-weight: 500;
  color: var(--color-text-secondary); background: #fff;
  transition: all var(--transition-fast);
}
.freeschool-app .pagination .page-numbers:hover { border-color: var(--color-primary-300); color: var(--color-primary-600); }
.freeschool-app .pagination .page-numbers.current {
  background: var(--color-primary-500); border-color: var(--color-primary-500); color: #fff; font-weight: 700;
}

/* ============================================================
   詳細ページ（single-school_list）
   ============================================================ */
.freeschool-app .detail-header {
  background: #fff;
  border-bottom: 1px solid var(--color-border);
  padding: var(--space-5) 0;
  border-radius: var(--radius-xl);
  margin-top: var(--space-4);
}
.freeschool-app .detail-title {
  font-size: var(--font-size-3xl); font-weight: 800; color: var(--color-text-primary);
  letter-spacing: -0.02em; line-height: 1.3; margin-bottom: var(--space-2);
}
.freeschool-app .detail-layout {
  display: grid; grid-template-columns: 1fr 340px; gap: var(--space-8);
  padding: var(--space-8) 0 var(--space-16); align-items: start;
}
/* --- gallery/grid overflow fix (ページ幅を広げず内部スクロール) --- */
.freeschool-app .detail-layout > * { min-width: 0; }
.freeschool-app .fs-gallery-scroll { max-width: 100%; }


.freeschool-app .gallery {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 260px 130px;
  gap: var(--space-2);
  border-radius: var(--radius-xl);
  overflow: hidden;
  margin-bottom: var(--space-8);
}
.freeschool-app .gallery-main {
  grid-row: span 2;
  background: linear-gradient(135deg, #FFF0E8, #FDE8D8);
  display: flex; align-items: center; justify-content: center;
  font-size: 5rem; position: relative;
}
.freeschool-app .gallery-main img,
.freeschool-app .gallery-sub img { width: 100%; height: 100%; object-fit: cover; }
.freeschool-app .gallery-sub {
  background: linear-gradient(135deg, #ECFDF5, #D1FAE5);
  display: flex; align-items: center; justify-content: center; font-size: 2.5rem;
  overflow: hidden;
}
.freeschool-app .gallery-count {
  position: absolute; bottom: var(--space-3); right: var(--space-3);
  background: rgba(0,0,0,0.55); color: #fff;
  padding: 0.25rem 0.75rem; border-radius: var(--radius-full);
  font-size: var(--font-size-xs); font-weight: 600;
}
.freeschool-app .gallery-single {
  display: block;
  border-radius: var(--radius-xl);
  overflow: hidden;
  margin-bottom: var(--space-8);
  background: linear-gradient(135deg, #FFF0E8, #FDE8D8);
}
.freeschool-app .gallery-single img { width: 100%; max-height: 420px; object-fit: cover; }

/* 横スクロールギャラリー（全枚数をスワイプ/スクロールで閲覧） */
.freeschool-app .fs-gallery-scroll {
  display: flex;
  flex-wrap: nowrap;
  gap: var(--space-3);
  overflow-x: auto;
  overflow-y: hidden;            /* iOS Safari: overflow-y を明示しないと横タッチスクロールが効かないことがある */
  -webkit-overflow-scrolling: touch;
  touch-action: pan-x;           /* 横方向のタッチパンを許可 */
  overscroll-behavior-x: contain;
  padding-bottom: var(--space-3);
  margin-bottom: var(--space-2);
  scroll-snap-type: x proximity; /* mandatory は iOS で引っかかることがあるため proximity に緩和 */
  scrollbar-color: var(--warm-300) transparent;
}
.freeschool-app .fs-gallery-scroll::-webkit-scrollbar { height: 8px; }
.freeschool-app .fs-gallery-scroll::-webkit-scrollbar-track { background: var(--warm-50); border-radius: var(--radius-full); }
.freeschool-app .fs-gallery-scroll::-webkit-scrollbar-thumb { background: var(--warm-300); border-radius: var(--radius-full); }
.freeschool-app .fs-gallery-item {
  flex: 0 0 auto;
  width: min(360px, 80vw);
  height: 260px;
  border-radius: var(--radius-xl);
  overflow: hidden;
  scroll-snap-align: start;
  box-shadow: var(--shadow-card);
  background: linear-gradient(135deg, #FFF0E8, #FDE8D8);
}
.freeschool-app .fs-gallery-item img { width: 100%; height: 100%; object-fit: cover; }
.freeschool-app .fs-gallery-count {
  font-size: var(--font-size-xs);
  color: var(--color-text-muted);
  margin-bottom: var(--space-8);
}
/* ギャラリー画像はクリックで拡大できることを示す */
.freeschool-app .fs-gallery-item img,
.freeschool-app .gallery-single img { cursor: zoom-in; }
.freeschool-app img[data-fs-full]:focus-visible {
  outline: 3px solid var(--color-primary-600, #E8622C);
  outline-offset: 2px;
}

/* ==== 写真ギャラリー ライトボックス（.fs-lightbox 接頭辞で衝突回避） ==== */
/* body スクロールロック（表示中） */
body.fs-lightbox-open { overflow: hidden; }

.fs-lightbox {
  position: fixed;
  inset: 0;
  z-index: 10000; /* 既存 .cocon-lightbox(9999)・固定ボトムナビ(9000)より上 */
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.88);
  padding:
    max(env(safe-area-inset-top), 16px)
    max(env(safe-area-inset-right), 16px)
    max(env(safe-area-inset-bottom), 16px)
    max(env(safe-area-inset-left), 16px);
  -webkit-tap-highlight-color: transparent;
}
.fs-lightbox[hidden] { display: none; }

.fs-lightbox__stage {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}
.fs-lightbox__img {
  max-width: 96vw;
  max-height: 88vh;
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: 8px;
  box-shadow: 0 12px 48px rgba(0, 0, 0, 0.6);
  background: #111;
}
.fs-lightbox__caption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: max(env(safe-area-inset-bottom), 12px);
  text-align: center;
  color: rgba(255, 255, 255, 0.9);
  font-size: 0.85rem;
  padding: 0 16px;
  pointer-events: none;
}

/* 閉じる・前後ボタン共通 */
.fs-lightbox__close,
.fs-lightbox__nav {
  position: absolute;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  cursor: pointer;
  color: #fff;
  background: rgba(0, 0, 0, 0.5);
  border-radius: 9999px;
  line-height: 1;
  transition: background 0.15s ease;
}
.fs-lightbox__close:hover,
.fs-lightbox__nav:hover { background: rgba(0, 0, 0, 0.8); }
.fs-lightbox__close:focus-visible,
.fs-lightbox__nav:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 2px;
}

.fs-lightbox__close {
  top: max(env(safe-area-inset-top), 12px);
  right: max(env(safe-area-inset-right), 12px);
  width: 48px;
  height: 48px;
  font-size: 30px;
  z-index: 2;
}
.fs-lightbox__nav {
  top: 50%;
  transform: translateY(-50%);
  width: 52px;
  height: 52px;
  font-size: 36px;
  z-index: 2;
}
.fs-lightbox__prev { left: max(env(safe-area-inset-left), 12px); }
.fs-lightbox__next { right: max(env(safe-area-inset-right), 12px); }

@media (max-width: 480px) {
  .fs-lightbox__img { max-width: 100vw; max-height: 82vh; }
  .fs-lightbox__close { width: 44px; height: 44px; font-size: 28px; }
  .fs-lightbox__nav { width: 46px; height: 46px; font-size: 32px; }
}

.freeschool-app .detail-section { margin-bottom: var(--space-10); }
.freeschool-app .detail-section-title {
  font-size: var(--font-size-lg); font-weight: 700; color: var(--color-text-primary);
  margin-bottom: var(--space-5); display: flex; align-items: center; gap: var(--space-2);
  padding-bottom: var(--space-3); border-bottom: 2px solid var(--color-border);
}
.freeschool-app .detail-lead {
  font-size: var(--font-size-base); color: var(--color-text-secondary); line-height: 1.8;
}

.freeschool-app .info-table { width: 100%; border-collapse: collapse; }
.freeschool-app .info-table tr { border-bottom: 1px solid var(--color-border-subtle); }
.freeschool-app .info-table tr:last-child { border-bottom: none; }
.freeschool-app .info-table th {
  width: 140px; padding: var(--space-4) var(--space-4) var(--space-4) 0;
  text-align: left; font-size: var(--font-size-xs); font-weight: 700;
  color: var(--color-text-muted); text-transform: uppercase; letter-spacing: 0.05em; vertical-align: top;
}
.freeschool-app .info-table td { padding: var(--space-4) 0; font-size: var(--font-size-sm); color: var(--color-text-secondary); line-height: 1.7; }
.freeschool-app .info-price { font-size: var(--font-size-xl); font-weight: 800; color: var(--color-primary-600); }
.freeschool-app .info-sub { font-size: var(--font-size-xs); color: var(--color-text-muted); }

.freeschool-app .fs-map {
  border-radius: var(--radius-xl); overflow: hidden; margin-bottom: var(--space-10);
  border: 1px solid var(--color-border); line-height: 0;
}
.freeschool-app .fs-map iframe { width: 100%; height: 320px; border: 0; display: block; }

.freeschool-app .trait-grid { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.freeschool-app .trait-badge {
  display: inline-flex; align-items: center; gap: var(--space-1);
  padding: 0.375rem 0.875rem; border-radius: var(--radius-full);
  font-size: var(--font-size-xs); font-weight: 600;
  background: var(--warm-50); color: var(--color-primary-700); border: 1.5px solid var(--color-primary-200);
}
.freeschool-app .feature-note {
  margin-top: var(--space-5); padding: var(--space-4);
  background: var(--color-primary-50); border-radius: var(--radius-lg);
  border: 1px solid var(--color-primary-100);
  font-size: var(--font-size-sm); color: var(--color-text-secondary); line-height: 1.7;
}
.freeschool-app .rep-message {
  padding: var(--space-6);
  background: linear-gradient(135deg, #FFF8F0, #FEF0E0);
  border-radius: var(--radius-xl);
  font-size: var(--font-size-sm); color: var(--color-text-secondary); line-height: 1.9;
  white-space: pre-line;
}

.freeschool-app .faq-item {
  border: 1px solid var(--color-border); border-radius: var(--radius-lg);
  margin-bottom: var(--space-3); overflow: hidden;
}
.freeschool-app .faq-item summary {
  padding: var(--space-4) var(--space-5); font-size: var(--font-size-sm); font-weight: 600;
  color: var(--color-text-primary); background: #fff; cursor: pointer;
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-3);
  list-style: none;
}
.freeschool-app .faq-item summary::-webkit-details-marker { display: none; }
.freeschool-app .faq-item summary::before { content: 'Q.'; color: var(--color-primary-500); font-weight: 800; margin-right: var(--space-2); }
.freeschool-app .faq-item summary::after { content: '▼'; color: var(--color-primary-400); font-size: 0.7rem; margin-left: auto; }
.freeschool-app .faq-item[open] summary::after { content: '▲'; }
.freeschool-app .faq-answer {
  padding: var(--space-4) var(--space-5); font-size: var(--font-size-sm);
  color: var(--color-text-secondary); background: var(--color-gray-50);
  border-top: 1px solid var(--color-border-subtle); line-height: 1.7;
}
.freeschool-app .faq-answer::before { content: 'A.'; color: var(--color-accent-500); font-weight: 800; margin-right: var(--space-2); }

.freeschool-app .fs-placeholder {
  padding: var(--space-6); text-align: center;
  background: var(--color-gray-50); border: 1px dashed var(--color-border);
  border-radius: var(--radius-lg); color: var(--color-text-muted); font-size: var(--font-size-sm);
}

/* Sidebar CTA */
.freeschool-app .detail-sidebar { position: sticky; top: var(--space-4); }
.freeschool-app .cta-card {
  background: #fff; border: 1px solid var(--color-border);
  border-radius: var(--radius-xl); overflow: hidden; box-shadow: var(--shadow-lg);
}
.freeschool-app .cta-card-header {
  background: linear-gradient(135deg, var(--color-primary-500), var(--color-primary-700));
  padding: var(--space-5) var(--space-6); color: #fff;
}
.freeschool-app .cta-card-header h3 { font-size: var(--font-size-base); font-weight: 700; margin-bottom: var(--space-1); }
.freeschool-app .cta-card-header p { font-size: var(--font-size-xs); opacity: 0.85; }
.freeschool-app .cta-card-body { padding: var(--space-5) var(--space-6); display: flex; flex-direction: column; gap: var(--space-3); }
.freeschool-app .cta-info-item {
  display: flex; justify-content: space-between; align-items: center;
  font-size: var(--font-size-sm); padding-bottom: var(--space-2);
  border-bottom: 1px solid var(--color-border-subtle);
}
.freeschool-app .cta-info-item:last-of-type { border-bottom: none; }
.freeschool-app .cta-info-label { color: var(--color-text-muted); font-size: var(--font-size-xs); }
.freeschool-app .cta-info-value { font-weight: 600; color: var(--color-text-primary); text-align: right; }
.freeschool-app .cta-price { font-size: var(--font-size-2xl); font-weight: 800; color: var(--color-primary-600); letter-spacing: -0.02em; }
.freeschool-app .cta-yes { color: var(--color-accent-600); }
.freeschool-app .cta-note { text-align: center; font-size: var(--font-size-xs); color: var(--color-text-muted); }

/* ============================================================
   比較ページ（page-freeschool-compare）
   ============================================================ */
.freeschool-app .compare-hero {
  background: linear-gradient(160deg, #FFF8F0, #FEF0E0);
  padding: var(--space-10) var(--space-6) var(--space-8);
  border-radius: var(--radius-xl);
  margin-top: var(--space-4);
}
.freeschool-app .compare-hero h1 { font-size: var(--font-size-3xl); font-weight: 800; letter-spacing: -0.03em; margin-bottom: var(--space-2); }
.freeschool-app .compare-hero p { color: var(--color-text-secondary); }
.freeschool-app .compare-container { padding: var(--space-10) 0 var(--space-20); }
.freeschool-app .compare-table-wrapper { overflow-x: auto; }
.freeschool-app .compare-table {
  width: 100%; border-collapse: separate; border-spacing: 0; min-width: 720px;
}
.freeschool-app .compare-table thead th { padding: 0; vertical-align: top; }
.freeschool-app .compare-table thead th:first-child { width: 180px; }
.freeschool-app .school-header-card {
  background: #fff; border: 1px solid var(--color-border);
  border-radius: var(--radius-xl) var(--radius-xl) 0 0;
  padding: var(--space-5); margin: 0 var(--space-2) 0 0;
  position: relative; text-align: center; box-shadow: var(--shadow-card);
}
.freeschool-app .school-header-thumb {
  width: 60px; height: 60px; border-radius: var(--radius-xl);
  display: flex; align-items: center; justify-content: center;
  font-size: 2rem; margin: 0 auto var(--space-3); overflow: hidden;
  background: linear-gradient(135deg, #FFF0E8, #FDE8D8);
}
.freeschool-app .school-header-thumb img { width: 100%; height: 100%; object-fit: cover; }
.freeschool-app .school-header-name { font-size: var(--font-size-sm); font-weight: 700; color: var(--color-text-primary); line-height: 1.4; margin-bottom: var(--space-2); }
.freeschool-app .school-add-slot {
  background: var(--color-gray-50); border: 2px dashed var(--color-gray-300);
  border-radius: var(--radius-xl) var(--radius-xl) 0 0;
  padding: var(--space-8) var(--space-5); margin: 0 var(--space-2) 0 0; text-align: center;
}
.freeschool-app .school-add-slot-icon { font-size: 2rem; margin-bottom: var(--space-2); }
.freeschool-app .school-add-slot-text { font-size: var(--font-size-xs); color: var(--color-text-muted); }
.freeschool-app .compare-table tbody tr { background: #fff; }
.freeschool-app .compare-table tbody tr:nth-child(even) { background: var(--color-gray-50); }
.freeschool-app .compare-table tbody td,
.freeschool-app .compare-table tbody th {
  padding: var(--space-4) var(--space-5); border-bottom: 1px solid var(--color-border-subtle); vertical-align: middle;
}
.freeschool-app .compare-table tbody th {
  font-size: var(--font-size-xs); font-weight: 700; color: var(--color-text-muted);
  text-transform: uppercase; letter-spacing: 0.05em; background: var(--color-gray-50);
  width: 180px; white-space: nowrap; border-right: 1px solid var(--color-border); text-align: left;
}
.freeschool-app .compare-table tbody td { font-size: var(--font-size-sm); color: var(--color-text-secondary); text-align: center; }
.freeschool-app .compare-table tbody .section-row td,
.freeschool-app .compare-table tbody .section-row th {
  background: linear-gradient(90deg, var(--color-primary-50), #fff);
  font-size: var(--font-size-xs); font-weight: 700; color: var(--color-primary-700);
  text-transform: uppercase; letter-spacing: 0.08em; padding: var(--space-3) var(--space-5);
  border-top: 2px solid var(--color-primary-100); text-align: left;
}
.freeschool-app .check-yes {
  display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; background: #ECFDF5; border-radius: var(--radius-full);
  color: #059669; font-weight: 700;
}
.freeschool-app .check-no {
  display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; background: var(--color-gray-100); border-radius: var(--radius-full);
  color: var(--color-gray-400);
}
.freeschool-app .compare-price { font-size: var(--font-size-lg); font-weight: 800; color: var(--color-primary-600); }
.freeschool-app .compare-empty-cell { color: var(--color-gray-300); }
.freeschool-app .compare-table tfoot td {
  padding: var(--space-4) var(--space-5); text-align: center; background: #fff;
  border-radius: 0 0 var(--radius-xl) var(--radius-xl);
  border: 1px solid var(--color-border); border-top: 2px solid var(--color-border); box-shadow: var(--shadow-card);
}
.freeschool-app .compare-table tfoot td:first-child { background: var(--color-gray-50); }
.freeschool-app .compare-summary {
  margin-top: var(--space-12);
  background: linear-gradient(135deg, #FFF8F0, #FEF0E0);
  border-radius: var(--radius-2xl); padding: var(--space-8);
}
.freeschool-app .compare-summary h2 { font-size: var(--font-size-xl); font-weight: 700; margin-bottom: var(--space-4); }

/* ============================================================
   レスポンシブ
   ============================================================ */
@media (max-width: 1024px) {
  .freeschool-app { --sidebar-width: 240px; }
  .freeschool-app .detail-layout { grid-template-columns: 1fr; }
  .freeschool-app .detail-sidebar { position: static; }
}
@media (max-width: 768px) {
  .freeschool-app .fs-container { padding: 0 var(--space-4); }
  .freeschool-app .search-layout { grid-template-columns: 1fr; }
  .freeschool-app .filter-sidebar { position: static; }
  .freeschool-app .school-list-card { grid-template-columns: 1fr; }
  .freeschool-app .school-list-card-image { width: 100%; min-height: 140px; }
  .freeschool-app .school-list-card-sidebar {
    border-left: none; border-top: 1px solid var(--color-border-subtle);
    flex-direction: row; align-items: center; flex-wrap: wrap; gap: var(--space-3);
  }
  .freeschool-app .school-list-card-actions { width: auto; flex: 1; margin-top: 0; }
  .freeschool-app .gallery { grid-template-rows: 200px 100px; }
  .freeschool-app main { min-width: 0; }
  /* モバイルは横スワイプに依存せず、写真を2列グリッドで縦に並べて全枚数を表示
     （環境依存で横タッチスクロールが効かない問題を根本回避。タップで拡大は従来どおり） */
  .freeschool-app .fs-gallery-scroll {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-2);
    overflow: visible;
    width: auto;
    max-width: 100%;
    margin: 0 0 var(--space-2);
    scroll-snap-type: none;
    touch-action: auto;
  }
  .freeschool-app .fs-gallery-item { width: auto; height: 140px; }
}
@media (max-width: 480px) {
  .freeschool-app .gallery { grid-template-columns: 1fr; grid-template-rows: auto; }
  .freeschool-app .gallery-main { grid-row: auto; min-height: 200px; }
}

/* ===== PR優遇：一覧カードの強調（大きめ・暖色） ===== */
.school-list-card.is-pr{border:1.5px solid #F3C79A;background:linear-gradient(180deg,#FFFDF9,#FFF6EC);box-shadow:0 14px 30px -18px rgba(214,90,10,.5);}
.school-list-card.is-pr:hover{box-shadow:0 20px 36px -18px rgba(214,90,10,.62);}
.school-list-card.is-pr .school-list-card-name{color:#9A3412;}
