.top-contents-box {
  position: relative;
}

.top-contents-box .sp {
  padding-top: 56px;
}

.main-visual-pc {
  width: 100vw;
  min-width: 1300px;
  overflow: hidden;
}

@media screen and (max-width: 960px) {
  .main-visual-pc {
    min-width: 1080px;
    height: auto;
  }
}

.message-on-img-woman {
  position: absolute;
  left: var(--space-6x);
  bottom: calc(26 * var(--space-unit));
  font-weight: bold;
  font-size: calc(11 * var(--space-unit));
  line-height: 140%;
}
@media screen and (min-width: 768px) {
  .message-on-img-woman {
    left: calc(45 * var(--space-unit));
    bottom: calc(54 * var(--space-unit));
    font-size: calc(22 * var(--space-unit));
    white-space: nowrap;
  }
}

.first-view-bottom-content {
  position: absolute;
  bottom: var(--space-2x);
  left: var(--space-4x);
}
@media screen and (min-width: 768px) {
  .first-view-bottom-content {
    left: var(--space-h-pc);
    bottom: var(--space-6x);
  }
}

.fisrt-view-sub-caption {
  margin-top: auto;
  margin-left: var(--space-2x);
  margin-bottom: calc(2.5 * var(--space-unit));
  color: var(--black-2);
  font-weight: bold;
  font-size: var(--font-3xh);
  color: var(--black-2);
  line-height: 160%;
  letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
  .fisrt-view-sub-caption {
    margin-top: auto;
    margin-left: var(--space-6x);
    /* margin-bottom: var(--space-10x); */
    font-size: var(--space-8x);
    white-space: nowrap;
  }
}

.entry-button-above-caption {
  margin-top: var(--space-14x);
  text-align: center;
  font-weight: bold;
  font-size: var(--font-4xh);
  line-height: 160%;
  color: var(--black-2);
}
@media screen and (min-width: 768px) {
  .entry-button-above-caption {
    margin-top: var(--space-20x);
    font-size: var(--font-8x);
  }
}

.entry-button-comment {
  margin-top: var(--space-4x);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .entry-button-comment {
    margin-top: calc(6.5 * var(--font-unit));
  }
}

.comment-body {
  margin: 0 calc(1.5 * var(--space-unit));
  color: var(--primary-color);
  font-weight: bold;
  font-size: calc(3.75 * var(--font-unit));
  line-height: 100%;
  letter-spacing: 0.04em;
}
@media screen and (min-width: 768px) {
  .comment-body {
    font-size: var(--font-4xh);
  }
}

.comment-below-button {
  margin: 0 calc(1.5 * var(--space-unit));
  color: var(--primary-color);
  font-weight: bold;
  font-size: calc(3.75 * var(--font-unit));
  line-height: 100%;
  letter-spacing: 0.04em;
}

@media screen and (min-width: 768px) {
  .comment-below-button {
    font-size: var(--font-4xh);
  }
}

#top .entry-button {
  margin: var(--space-3x) auto 0 auto;
}

#top .dead-line {
  margin-top: var(--space-3x);
  font-weight: bold;
  font-size: var(--font-3x);
  text-align: center;
  line-height: 100%;
  color: var(--black);
}
@media screen and (min-width: 768px) {
  #top .dead-line {
    margin-top: var(--space-4x);
    font-size: var(--font-3xh);
  }
}

.closing-word-box {
  position: relative;
  margin-top: var(--space-6x);
  width: 100%;
  min-height: 570px;
  margin: 0 auto;
  overflow: hidden;
}
@media screen and (min-width: 768px) {
  .closing-word-box {
    margin-top: calc(24 * var(--space-unit));
    text-align: right;
    width: 80%;
    max-width: 1400px;
    height: 900px;
  }
}

.closing-word-box img.woman10-pc {
  position: absolute;
  right: 0;
  top: 0;
  min-width: 1300px;
  width: 100%;
  height: auto;
}

.closing-word-box img.woman10-sp {
  position: absolute;
  right: 0;
  top: -200px;
  width: 100%;
  min-width: 550px;
  height: auto;
}


.closing-words {
  margin: var(--space-20x) var(--space-6x) 0 var(--space-6x);
}
@media screen and (min-width: 768px) {
  .closing-words {
    margin: 0;
    position: absolute;
    top: 5%;
    left: 16%;
    text-align: left;
  }
}

@media screen and (max-width: 767px) {
  .closing-words {
    margin: 0;
    position: absolute;
    top: 5%;
    left: 8%;
    text-align: left;
  }
}
.closing-caption {
  font-weight: bold;
  font-size: var(--font-5x);
  line-height: 160%;
  color: var(--black-2);
}
@media screen and (min-width: 768px) {
  .closing-caption {
    font-size: var(--font-8x);
  }
}

.closing-word {
  margin-top: var(--space-4x);
  font-weight: bold;
  font-size: calc(3.75 * var(--font-unit));
  line-height: 200%;
  color: var(--black-2);
}
@media screen and (min-width: 768px) {
  .closing-word {
    margin-top: var(--space-12x);
    font-size: var(--font-5x);
  }
}

