/* インナーCSS */
.inner {
  width: 70%;
  margin: 55px auto 0;
  text-align: center;
  justify-items: center;
}
/* インナーCSS ここまで */

/* fvCSS */
body main .fv {
  height: auto;
}
/* fvCSS ここまで */

/* ナビCSS */
body main .nav {
  margin-top: -13vw;
}

body main .nav .fourth_nav {
  margin-top: -35px;
}

body main .nav .fourth_nav:hover {
  margin-top: -45px;
}
/* ナビCSS ここまで */

/* 下層ページサブナビCSS */
body main #sub_nav {
  width: 780px;
  margin: 0 auto;
  text-align: center;
  padding-top: 80px;
}

body main #sub_nav .sub_nav {
  margin: 0 auto;
  text-align: center;
  position: absolute;
  list-style: none;
  padding: 0;
  display: flex;
  gap: 5px;
  align-items: flex-end;
}

body main #sub_nav .sub_nav a {
  display: block;
  width: 100px;
  height: 150px;
  background-repeat: no-repeat;
  color: #fedea2;
  text-align: center;
  letter-spacing: 4px;
  font-size: 16px;
  padding: 20px 0 55px;
  text-decoration: none;
  border-radius: 5px;
}

body main #sub_nav .sub_nav a:hover {
  width: 150px;
  height: 225px;
  transition: 0.3s;
}

body main #sub_nav .sub_nav:not(:hover) .current {
  width: 150px;
  height: 225px;
}

body main #sub_nav .sub_nav .first_sub_nav {
  background-image: url("../images/sub_nav1.png");
}

body main #sub_nav .sub_nav .second_sub_nav {
  background-image: url("../images/sub_nav2.png");
}

body main #sub_nav .sub_nav .third_sub_nav {
  background-image: url("../images/sub_nav3.png");
}

body main #sub_nav .sub_nav .fourth_sub_nav {
  background-image: url("../images/sub_nav4.png");
}

body main #sub_nav .sub_nav .fifth_sub_nav {
  background-image: url("../images/sub_nav6.png");
}

body main #sub_nav .sub_nav .sixth_sub_nav {
  background-image: url("../images/sub_nav7.png");
}

body main #sub_nav .sub_nav .seventh_sub_nav {
  background-image: url("../images/sub_nav8.png");
}

body main #sub_nav .sub_nav .first_sub_nav,
body main #sub_nav .sub_nav .second_sub_nav,
body main #sub_nav .sub_nav .third_sub_nav,
body main #sub_nav .sub_nav .fourth_sub_nav,
body main #sub_nav .sub_nav .fifth_sub_nav,
body main #sub_nav .sub_nav .sixth_sub_nav,
body main #sub_nav .sub_nav .seventh_sub_nav {
  background-size: cover;
  width: 105px;
  height: 160px;
}
/* 下層ページサブナビCSS ここまで */

/* コンテントCSS */
body main .content_1 {
  position: relative;
  margin-top: -11.5vw;
  background-image: url("../images/sub_background.png");
  pointer-events: none;
  background-repeat: no-repeat;
  background-size: 100% auto;
}

body main .sub_nav,
body main #header_text,
body main .inner {
  pointer-events: auto;
}

body main .content_2 {
  position: relative;
  background-image: url("../images/sub_background2.png");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-position-y: bottom;
}
/* コンテントCSS ここまで */

@media screen and (max-width: 980px) {
  /* ナビCSS */
  body main .nav {
    margin-top: -26vw;
  }
  /* ナビCSS ここまで */
  .inner {
    width: 80%;
  }

  /* 下層ページサブナビCSS */
  body main #sub_nav {
    width: 85%;
    margin: 0 auto;
    padding-top: 24vw;
    text-align: center;
  }

  body main #sub_nav .sub_nav {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(2, auto);
    list-style: none;
    padding: 0;
    margin: 0 auto;
    width: 85vw;
    justify-content: center;
  }

  body main #sub_nav .sub_nav .first_sub_nav,
  body main #sub_nav .sub_nav .second_sub_nav,
  body main #sub_nav .sub_nav .third_sub_nav,
  body main #sub_nav .sub_nav .fourth_sub_nav {
    background-size: cover;
    width: 20vw;
    height: 20vw;
  }

  body main #sub_nav .sub_nav .fifth_sub_nav,
  body main #sub_nav .sub_nav .sixth_sub_nav,
  body main #sub_nav .sub_nav .seventh_sub_nav,
  body main #sub_nav .sub_nav .eighth_sub_nav {
    background-size: cover;
    width: 20vw;
    height: 20vw;
  }

  body main #sub_nav .sub_nav li {
    display: flex;
    justify-content: center;
  }

  body main #sub_nav .sub_nav a:hover {
    width: 20vw;
    height: 25vw;
    transition: 0.3s;
  }

  body main #sub_nav .sub_nav:not(:hover) .current {
    width: 20vw;
    height: 25vw;
  }
  /* 下層ページサブナビCSS ここまで */

  /* コンテンツCSS */
  body main .content_1 {
    position: relative;
    margin-top: -36vw;
    background-image: url("../images/sub_background_sp.png");
    background-repeat: no-repeat;
    background-size: 100% auto;
  }

  body main .content_2 {
    position: relative;
    background-image: url("../images/sub_background2.png");
    background-repeat: no-repeat;
    background-size: 100% 100%;
  }
  /* コンテンツCSS ここまで */
  body main .nav .fourth_nav {
    margin-top: -45px;
  }
}