/* ==============================================
   アテニア 口コミ機能 ページレイアウトCSS
   口コミ専用ページ（01〜11）のグローバルスタイル
   コンポーネントは review-components.css に集約
   ============================================== */

* {
  box-sizing: border-box;
}

/* グローバルヘッダー・フッターは pc_common.css が content-box 前提のため元に戻す */
#header *,
#header *::before,
#header *::after,
#footer *,
#footer *::before,
#footer *::after {
  box-sizing: content-box;
}

html,
body {
  margin: 0;
  padding: 0;
}

.main,
.main * {
  margin: 0;
  padding: 0;
}

/* サイト共通ヘッダーの背景を白に固定（body背景グラデーションの透過防止） */
#header {
  background-color: #fff;
}

/* カスタムスクロールバー */
::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: var(--color-bg-secondary);
}

::-webkit-scrollbar-thumb {
  background: var(--color-text-muted);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--color-text-secondary);
}

/* サイト共通ヘッダー/フッターのrem基準に合わせる */
html {
  font-size: 62.5%;
  width: 100%;
  overflow-x: hidden;
}

body {
  font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", sans-serif;
  font-weight: 500;
  font-size: 14px;
  line-height: 1.7;
  color: var(--color-text-primary);
  background: var(--color-bg-gradient);
  background-attachment: fixed;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  width: 100%;
  overflow-x: hidden;
}

@supports (overflow: clip) {
  html,
  body,
  #header-sp {
    overflow-x: clip;
  }
}

/* 画像や埋め込み要素のはみ出し防止 */
img,
svg,
video,
canvas,
iframe {
  max-width: 100%;
}

/* レイアウトコンテナの横はみ出し防止 */
.main,
.layout-grid,
.review-page-columns,
.review-filters-section,
.review-hero {
  max-width: 100%;
}

/* SPヘッダーの微小な横はみ出し対策 */
#header-sp {
  width: 100%;
  overflow-x: hidden;
}

/* サイト共通フッター(footer_03)のコピーライト文字色を白に戻す
   pc_common.css / sp_common.css の `p { color: #333 }` で上書きされてしまうため */
footer.footer_s p.copyright {
  color: #ffffff;
}