html, body{
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: hidden;
}

/* =========================
   LP base
========================= */
.lp_field{
  width: 100%;
  max-width: 700px;
  margin: 0 auto;
  padding: 0;
  overflow-x: hidden; /* スライダーのはみ出し保険 */
}

.lp_article{
  width: 100%;
  margin: 0;
  padding: 0;
}

.lp_section{
  margin: 0;
  padding: 0;
  position: relative; /* 重なり防止の前提 */
  line-height: 0;     /* 画像前後の微妙な隙間対策 */
}

.lp_img{
  display: block;
  width: 100%;
  max-width: 700px;
  height: auto;
  margin: 0 auto;
  vertical-align: top;
}

/* =========================
   Auto slider（09〜14）
========================= */
.auto_slider{
  width: 100%;
  max-width: 700px;
  margin: 0 auto;
  overflow: hidden;
  background: #fff;
}

.auto_slider_track{
  display: flex;
  will-change: transform;
  transform: translate3d(0,0,0);
  transition: transform 500ms ease;
}

.auto_slide{
  flex: 0 0 100%;
}

/* =========================
   Section 21（ズレ防止：中央固定）
   ※「画像ファイル側の透明余白」で中身がズレて見える場合は
     transform: translateX(-10px); などで微調整してください
========================= */
#sec21{
  display: flex;
  justify-content: center;
}

#sec21 img{
  display: block;
  margin: 0; /* flexで中央寄せするため auto を外す */
}

/* =========================
   Bottom CTA（統一版：重複排除）
========================= */
.lp_bottom_cta{
  position: relative;
  z-index: 5;
  margin-top: 24px;          /* 画像と被るのを防ぐ */
  padding: 80px 16px 100px;  /* 上下余白（増量版） */
  background: #fff;
  display: flex;
  justify-content: center;
}

.lp_bottom_cta_link{
  display: inline-block;
}

.lp_bottom_cta_img{
  display: block;
  width: min(520px, 90vw);
  height: auto;
  cursor: pointer;
}