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

/* ==============================================
   タブレット以下 (768px以下)
   SP viewport=750px で発火するメインブレイクポイント
   750px viewport → ~375px画面に縮小表示されるため
   フォント・パディング等を約2倍にスケーリング
   ============================================== */
@media (max-width: 768px) {

  /* --- 表示切り替え --- */
  .pc-only {
    display: none !important;
  }

  .sp-only {
    display: flex !important;
  }

  :root {
    --content-width: 100%;
  }

  /* ==============================================
     ベーステキスト・本文
     ============================================== */
  body {
    font-size: 32px;
    line-height: 1.8;
  }

  /* --- SP専用改行 --- */
  br.sp-only {
    display: block !important;
  }

  /* ==============================================
     カスタムスクロールバー（SP非表示）
     ============================================== */
  ::-webkit-scrollbar {
    width: 4px;
  }
}

/* ==============================================
   PC (769px以上)
   ============================================== */
@media (min-width: 769px) {
  .btn-group--inline {
    flex-direction: row;
    max-width: none;
  }

  .btn-group--inline .btn {
    flex: 1;
  }
}