@charset "UTF-8";
/* ============================================================
   rg-add.css
   /ad/cp/reserve_girl/ 追加分（Phase 2）
   既存クラスには一切触れず、新規クラスで自己完結させる。
   唯一の例外は .spMain_btn_h3（h3→h4 に変えたため見た目を担保）。
   ============================================================ */

/* ------------------------------------------------------------
   1. 視覚的非表示の見出し
   KVは背景画像（banner_reserve_girl_sp.jpg）で、その画像自体が
   ページタイトルを表している。代替テキストとしてh2を持たせる
   （画像置換パターン）。見た目は一切変わらない。
   ------------------------------------------------------------ */
.rg-sronly {
  position: absolute !important;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ------------------------------------------------------------
   2. ▼〜▼ 見出しの見た目を維持
   元は <h3 class="spMain_btn_h3"> で、main h3 のルールが
   text-align:center / padding-bottom:10px / position:relative を
   与えていた。h4 に変えた分をここで補う。
   （.spMain_btn_h3 の font-size / color は既存CSSがそのまま効く）
   ------------------------------------------------------------ */
main h4.spMain_btn_h3 {
  padding-bottom: 10px;
  position: relative;
  text-align: center;
}

/* ------------------------------------------------------------
   3. エリアナビの見出し
   14本の内部リンクに文脈が無かったため追加。
   ------------------------------------------------------------ */
.rg-areanav-h3 {
  color: #902053;
  font-size: 1.8rem;
  font-weight: bold;
  line-height: 1.4;
  margin: 0;
  padding: 30px 18px 0;
  text-align: center;
}

/* ------------------------------------------------------------
   4. 「はじめてのラブホ女子会」セクション
   配色は既存に合わせる（#b70f5b / #902053 / #c3a487 / #fdfcf8）
   ------------------------------------------------------------ */
.rg-guide {
  color: #000;
  padding: 30px 0 35px;
}

.rg-guide-h3 {
  color: #902053;
  font-size: 2rem;
  font-weight: bold;
  line-height: 1.4;
  margin: 0 0 6px;
  text-align: center;
}

.rg-guide-h3::after {
  background-color: #c3a487;
  content: '';
  display: block;
  height: 2px;
  margin: 12px auto 0;
  width: 40px;
}

.rg-guide-lead {
  font-size: 1.4rem;
  line-height: 1.9;
  margin: 18px 0 28px;
  text-align: center;
}

.rg-guide-list {
  margin: 0;
}

.rg-guide-list > dt {
  background-color: #fff;
  border-left: 4px solid #b70f5b;
  font-size: 1.6rem;
  font-weight: bold;
  line-height: 1.5;
  margin: 0;
  padding: 12px 14px;
}

.rg-guide-list > dd {
  background-color: #fff;
  font-size: 1.4rem;
  line-height: 1.9;
  margin: 0 0 14px;
  padding: 0 14px 16px;
  text-align: left;
}

.rg-guide-list > dd:last-child {
  margin-bottom: 0;
}

.rg-guide-list > dd strong {
  color: #902053;
  font-weight: bold;
}

.rg-guide-note {
  font-size: 1.2rem;
  line-height: 1.7;
  margin: 20px 0 0;
  text-align: left;
}

/* ------------------------------------------------------------
   5. PC（768px以上）
   PC側は本文幅が広くなるため、読み幅を制限する。
   既存のPCレイアウトには干渉しない。
   ------------------------------------------------------------ */
@media screen and (min-width: 768px) {
  .rg-areanav-h3 {
    font-size: 2.4rem;
    padding-top: 40px;
  }

  .rg-guide {
    margin: 0 auto;
    max-width: 800px;
    padding: 50px 20px 60px;
  }

  .rg-guide-h3 {
    font-size: 2.8rem;
  }

  .rg-guide-lead {
    font-size: 1.6rem;
    margin-bottom: 36px;
  }

  .rg-guide-list > dt {
    font-size: 1.8rem;
    padding: 16px 20px;
  }

  .rg-guide-list > dd {
    font-size: 1.5rem;
    margin-bottom: 18px;
    padding: 0 20px 20px;
  }
}