@charset "UTF-8";
/* %算出に使用 */
/* ===============================
  スペック
=============================== */
.spec__mv {
  background: url(../img/spec_mv.jpg) no-repeat center center/cover;
}

/*------------------------------
introduction
------------------------------*/
.introduction {
  padding: 3% 0 8%;
}

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

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

.introduction__heading {
  margin-top: 10%;
}
@media (max-width: 767px) {
  .introduction__heading {
    margin-top: 5.3333333333vw;
  }
}

.introduction__message {
  margin-top: 5%;
}
@media (max-width: 767px) {
  .introduction__message {
    margin-top: 4.1899441341%;
  }
}

.introduction__image {
  width: 45.4166666667%;
}
@media (max-width: 767px) {
  .introduction__image {
    width: 100%;
    margin-top: 5.5865921788%;
  }
}

/*------------------------------
feature
------------------------------*/
.feature {
  padding: 5.7% 0% 41.6%;
  margin-bottom: 13.7%;
  position: relative;
}
.feature::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  background: #e9e6de;
  width: 88.3%;
  height: 100%;
}
.feature::after {
  content: "";
  position: absolute;
  background: url(../img/spec2.jpg) no-repeat center center/100%;
  aspect-ratio: 2773/926;
  transform: translate(0%, 0%);
  width: 88.3%;
  left: 0%;
  bottom: 0%;
}
@media (max-width: 767px) {
  .feature::before {
    width: 100%;
  }
  .feature::after {
    width: 100%;
  }
}

.feature__content {
  position: relative;
  padding: 0 0.6%;
}

.feature__lead {
  font-size: 1.5923566879vw;
  font-weight: 200;
  line-height: 3.12;
}
@media (max-width: 767px) {
  .feature__lead {
    font-size: 4.2666666667vw;
  }
}

.feature__list {
  margin-top: 5%;
  width: 92.6666666667%;
}

.feature__item {
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
  display: flex;
}
.feature__item:nth-child(n+2) {
  margin-top: 3.4%;
}
@media (max-width: 767px) {
  .feature__item {
    display: block;
  }
  .feature__item:nth-child(n+2) {
    margin-top: 8.3798882682%;
  }
}

.feature__label {
  width: 22%;
  background: #fff;
  font-size: 1.9108280255vw;
  font-weight: 200;
  line-height: 2.6;
  text-align: left;
  padding: 0.7em 0;
  padding-left: 1.1em;
  letter-spacing: 0.05em;
}
@media (max-width: 767px) {
  .feature__label {
    display: block;
    width: 100%;
    font-size: 4.2666666667vw;
  }
}

.feature__description {
  width: 78%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 1.0191082803vw;
  font-weight: 200;
  line-height: 2.25;
  padding: 0 2.5em;
}
@media (max-width: 767px) {
  .feature__description {
    width: 100%;
    font-size: 4.2666666667vw;
    padding: 0;
  }
}

.feature__none {
  margin-top: 3.3333333333%;
  font-size: 1.0191082803vw;
  font-weight: 200;
  line-height: 2.25;
}
@media (max-width: 767px) {
  .feature__none {
    font-size: 4.2666666667vw;
  }
}
/*# sourceMappingURL=spec.css.map */