.top {
  /* margin-bottom: -91px; */
}

.top__ill {
  display: block;
  margin-inline: auto;
  position: relative;
}
/* .top__ill::before {
  position: absolute;
  display: block;
  content: "";
  background-image: url(../img/pc/ill_top_title.png);
  width: 100%;
  height: 312px;
  top: 0;
  left: 0;
} */
.main__bottom {
  background-image: url(../img/pc/main_bottom.png);
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  top: -86px;
}
@media screen and (max-width: 599px) {
  .top {
    /* margin-bottom: -149px; */
  }
  .main__bottom {
    background-image: url(../img/sp/main__bottom-sp.png);
    top: -149px;
  }
}

.main__box {
  display: flex;
  gap: 0.4rem;
  justify-content: center;
  padding-bottom: 0.84rem;
  padding-top: 38px;
}
@media screen and (max-width: 599px) {
  .main__box {
    display: grid;
    gap: 0.2rem;
    margin: 0 0.16rem;
    padding-bottom: 0.58rem;
    padding-top: 0.78rem;
  }
}
.topBtn {
  padding-bottom: 80px;
}
.btn__icon {
  position: relative;
  top: -7px;
}
.top__btn {
  background-image: url(../img/entry.png);
  background-repeat: no-repeat;
  background-size: contain;
  width: 3rem;
  height: 0.84rem;
  display: grid;
  justify-content: center;
}
.top__btn:hover {
  background-image: url(../img/entry-hover.png);
}
@media screen and (max-width: 599px) {
  .btn__icon {
    top: -4px;
    width: 24px;
  }
}

.entry-section {
  background: #fafafa;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 8px;
  padding-bottom: 40px;

  @media screen and (min-width: 960px) {
    padding-top: 60px;
    padding-bottom: 60px;
  }
}

.entry-section__text {
  max-width: 300px;
  margin: 0 auto;

  @media screen and (min-width: 960px) {
    max-width: 395px;
  }
}

.entry-section__btn {
  max-width: 300px;
  margin: 0 auto;

  @media screen and (min-width: 960px) {
    max-width: 355px;
  }
}

.bottom-section {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.bottom-title-img {
  width: 100%;
  max-width: 1280px;
  margin-inline: auto;
}

.bottom-text-section {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  background: #e7f6ff;
  padding-block: 40px;

  @media screen and (min-width: 960px) {
    padding-block: 60px;
  }
}

.bottom-text-img {
  width: 100%;
  max-width: 287px;
  margin-inline: auto;

  @media screen and (min-width: 960px) {
    max-width: 500px;
  }
}

.bottom-text-btn {
  width: 100%;
  max-width: 300px;
  margin-inline: auto;

  @media screen and (min-width: 960px) {
    max-width: 382px;

    &:hover {
      opacity: 0.8;
    }
  }
}

.entry-section__btn-link {
  @media screen and (min-width: 960px) {
    &:hover {
      opacity: 0.8;
    }
  }
}