@charset "UTF-8";
/* ===============================
  TOP
=============================== */
main::after, main::before {
  display: none;
}

.info::before, .info::after {
  display: none;
}

/*------------------------------
fv
------------------------------*/
.fv {
  padding: 0 clamp(0px, 60 * var(--rate-vw), 60px * var(--cap));
}
@media (max-width: 767px) {
  .fv {
    padding: 0 5%;
  }
}

.fv__content {
  position: relative;
  height: calc(100svh - clamp(0px, 130 * var(--rate-vw), 130px * var(--cap)) * 2);
}
.fv__content img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media (max-width: 767px) {
  .fv__content {
    height: calc(100svh - clamp(0px, 90 * var(--rate-vw), 90px * var(--cap)) * 2);
  }
}

.fv__text {
  position: absolute;
  top: 50%;
  left: -3%;
  transform: translateY(-50%);
  width: clamp(0px, 10 * var(--rate-vw), 10px * var(--cap));
}
@media (max-width: 767px) {
  .fv__text {
    width: clamp(0px, 10 * var(--rate-vw), 10px * var(--cap));
  }
}

#fadeWrap {
  position: absolute;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
#fadeWrap > picture, #fadeWrap > img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transform: scale(1); /* スケール start */
}
#fadeWrap > picture img, #fadeWrap > img img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
#fadeWrap > picture.act, #fadeWrap > img.act {
  transition: transform 7s linear;
}

[data-switchfadebtn=prev], [data-switchfadebtn=next] {
  content: "";
  position: absolute;
  cursor: pointer;
  background: url(../img/icon_arrow03.svg) no-repeat center center/100%;
  aspect-ratio: 17/34;
  width: 10%;
  top: 50%;
  z-index: 30;
}

[data-switchfadebtn=prev] {
  left: 0;
  transform: translate(0%, -50%) scale(-1, 1);
}

[data-switchfadebtn=next] {
  right: 0;
  transform: translate(0%, -50%);
}

.fade-navi {
  display: flex;
  justify-content: center;
  gap: 0 16px;
}
.fade-navi span {
  cursor: pointer;
  aspect-ratio: 1/1;
  width: 16px;
  border-radius: 50%;
  background: gray;
}
.fade-navi span.act {
  background: red;
}

/*------------------------------
interview
------------------------------*/
.interview {
  padding-top: clamp(0px, 145 * var(--rate-vw), 145px * var(--cap));
  position: relative;
}
.interview::before {
  content: "";
  position: absolute;
  background: url(../img/dec01-top.webp) no-repeat center center/100%;
  aspect-ratio: 499/830;
  width: clamp(0px, 250 * var(--rate-vw), 250px * var(--cap));
  left: 0%;
  top: clamp(0px, 0 * var(--rate-vw), 0px * var(--cap));
  transform: translateY(-14%);
}
.interview > * {
  position: relative;
  z-index: 10;
}
@media (max-width: 767px) {
  .interview {
    padding-top: clamp(0px, 70 * var(--rate-vw), 70px * var(--cap));
  }
}

.interview__list {
  margin-top: 8.5%;
  padding-left: clamp(0px, 135 * var(--rate-vw), 135px * var(--cap));
}
@media (max-width: 767px) {
  .interview__list {
    padding-left: 0;
  }
}

.interview__button {
  margin-top: clamp(0px, 64 * var(--rate-vw), 64px * var(--cap));
  text-align: right;
}
@media (max-width: 767px) {
  .interview__button {
    text-align: center;
  }
}

/*------------------------------
concept
------------------------------*/
.concept {
  padding: clamp(0px, 173 * var(--rate-vw), 173px * var(--cap)) 0 clamp(0px, 500 * var(--rate-vw), 500px * var(--cap));
  position: relative;
}
@media (max-width: 767px) {
  .concept {
    padding: clamp(0px, 80 * var(--rate-vw), 80px * var(--cap)) 0;
  }
}

.concept__heading {
  padding-left: clamp(0px, 150 * var(--rate-vw), 150px * var(--cap));
  font-size: clamp(0px, 39 * var(--rate-fz), 39px * var(--cap));
  font-weight: 900;
  line-height: 1.9;
  font-family: "Zen Old Mincho", serif;
  margin-top: 1.5em;
}
@media (max-width: 767px) {
  .concept__heading {
    padding-left: 0;
    font-size: clamp(0px, 32 * var(--rate-fz), 32px * var(--cap));
  }
}

@media (min-width: 768px) {
  .concept__visual {
    position: absolute;
    top: clamp(0px, 173 * var(--rate-vw), 173px * var(--cap));
    right: calc(min( 0 * var(--rate-vw),0px) + max(0px, (100vw - 1280px) / 2));
    width: clamp(0px, 943 * var(--rate-vw), 943px * var(--cap));
    aspect-ratio: 1886/1460;
  }
}
@media (max-width: 767px) {
  .concept__visual {
    margin-top: clamp(0px, 40 * var(--rate-vw), 40px * var(--cap));
    width: 90%;
    margin-left: auto;
  }
}

/*------------------------------
about
------------------------------*/
.about {
  padding-top: clamp(0px, 125 * var(--rate-vw), 125px * var(--cap));
  position: relative;
}
.about::after {
  content: "";
  position: absolute;
  top: 36%;
  left: 0;
  background: url(../img/img_do.webp) no-repeat center center/contain;
  width: clamp(0px, 328 * var(--rate-vw), 328px * var(--cap));
  aspect-ratio: 656/1205;
}
@media (max-width: 767px) {
  .about {
    padding-top: clamp(0px, 60 * var(--rate-vw), 60px * var(--cap));
  }
  .about::after {
    width: clamp(0px, 140 * var(--rate-vw), 140px * var(--cap));
    top: 60%;
  }
}

.about__wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media (max-width: 767px) {
  .about__wrapper {
    display: block;
  }
}

@media (max-width: 767px) {
  .about__body {
    width: 100%;
  }
}

.about__text {
  font-size: clamp(0px, 16 * var(--rate-fz), 16px * var(--cap));
  font-weight: 300;
  line-height: 1.9;
  font-feature-settings: "palt";
  margin-top: 4.1em;
}

.about__button {
  margin-top: clamp(0px, 56 * var(--rate-vw), 56px * var(--cap));
}
@media (max-width: 767px) {
  .about__button {
    text-align: center;
  }
}

.about__visual {
  max-width: clamp(0px, 700 * var(--rate-vw), 700px * var(--cap));
}
@media (max-width: 767px) {
  .about__visual {
    width: 100%;
    margin-top: clamp(0px, 40 * var(--rate-vw), 40px * var(--cap));
  }
}

.about__footer {
  margin-top: clamp(0px, 170 * var(--rate-vw), 170px * var(--cap));
  padding-bottom: clamp(0px, 190 * var(--rate-vw), 190px * var(--cap));
  position: relative;
}
.about__footer::after {
  content: "";
  position: absolute;
  bottom: calc(clamp(0px, 50 * var(--rate-vw), 50px * var(--cap)) * -1);
  right: 0;
  background: url(../img/img_mo.webp) no-repeat center center/contain;
  width: clamp(0px, 200 * var(--rate-vw), 200px * var(--cap));
  aspect-ratio: 420/994;
}
@media (max-width: 767px) {
  .about__footer {
    margin-top: clamp(0px, 180 * var(--rate-vw), 180px * var(--cap));
    z-index: 10;
  }
  .about__footer::after {
    width: clamp(0px, 100 * var(--rate-vw), 100px * var(--cap));
  }
}

@media (min-width: 768px) {
  .about__footer__inner {
    width: 100%;
    max-width: 1280px;
  }
}
@media (max-width: 767px) {
  .about__footer__inner {
    width: 100%;
  }
}

.about__footer-visual {
  width: 86%;
  margin-left: auto;
}
/*# sourceMappingURL=top.css.map */