/* ==========================================
   リセット・基本設定
   ========================================== */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  width: 100%;
  overflow-x: hidden;
  line-height: 0; /* 画像を敷き詰めた時の隙間対策 */
}

img {
  display: block;
  width: 100%;
  height: auto;
}

a {
  text-decoration: none;
}

/* ==========================================
   MV(ファーストビュー)
   ========================================== */
.mv-wrap {
  position: relative;
  width: 100%;
}

.mv-img {
  width: 100%;
}

/* ロゴ:MVの左上に重ねる */
.logo-link {
  position: absolute;
  top: 3%;
  left: 4%;
  width: 18%; /* ロゴのサイズに合わせて調整 */
  max-width: 200px;
  z-index: 10;
}

.logo-img {
  width: 100%;
}

/* ==========================================
   セクションラッパー(bg.pngが全セクションを覆う背景)
   ========================================== */
.sections-wrap {
  position: relative;
  width: 100%;
  background-image: url(../img/bg.png);
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
  padding: 160px 0 153px;
}

.section {
  position: relative;
  img {
    object-fit: contain;
    width: 100%;
  }
}
.section1 {
  width: 90%;
  max-width: 1200px;
  margin: 0 auto 48px;
}
.section2 {
  width: 90%;
  max-width: 1200px;
  margin: 0 auto 80px;
}
.section3 {
  width: 90%;
  max-width: 1000px;
  margin: 0 auto 125px;
}
.section4 {
  width: 90%;
  max-width: 1000px;
  margin: 0 auto 123px;
}

.section-img {
  width: 100%;
}
/* ==========================================
   section5:ボタンリンク2つ
   座標(top/left/width/height)は実データに合わせて微調整すること
   ========================================== */
.section5 {
  width: 90%;
  max-width: 1100px;
  margin: 0 auto 0;
  position: relative;
}

.btn-link {
  position: absolute;
  display: block;
}

.btn1 {
  top: 48%;
  left: 14%;
  width: 35%;
  height: 29%;
}

.btn2 {
  top: 48%;
  left: 51%;
  width: 35%;
  height: 29%;
}

/* ==========================================
   フッター
   ========================================== */
.footer {
  width: 100%;
  position: relative;
}

.footer-img {
  width: 100%;
}

.footer__btn-link {
  position: absolute;
  display: block;
  top: 21%;
  left: 16%;
  width: 6%;
  height: 22%;
}

@media screen and (max-width: 834px) {
  .sections-wrap {
    padding: 60px 0 70px;
  }
  .section1 {
    margin: 0 auto 20px;
  }
  .section2 {
    margin: 0 auto 30px;
  }
  .section3 {
    margin: 0 auto 40px;
  }
  .section4 {
    margin: 0 auto 40px;
  }
}
