.summary p {
  line-height: 2.8;
  letter-spacing: 0.19em;
  opacity: 0;
  transition: opacity 800ms cubic-bezier(0, 0, 1, 1), transform 1200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transform: translate(0, 10px);
  will-change: opacity, transform;
}
.summary.is-inview p {
  opacity: 1;
  transform: translate(0, 0);
}

.sec {
  display: flex;
}

.sec__img {
  opacity: 0;
  transition: opacity 800ms cubic-bezier(0, 0, 1, 1), transform 1200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transform: translate(0, 3%);
  will-change: opacity, transform;
}
.sec__img.is-inview {
  opacity: 1;
  transform: translate(0, 0);
}

.sec__title {
  opacity: 0;
  transition: opacity 800ms cubic-bezier(0, 0, 1, 1), transform 1200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transform: translate(0, 10px);
  will-change: opacity, transform;
}
.is-inview .sec__title {
  opacity: 1;
  transform: translate(0, 0);
}

.sec__lead {
  line-height: 2;
  letter-spacing: 0.2em;
  opacity: 0;
  transition: opacity 800ms cubic-bezier(0, 0, 1, 1) 200ms, transform 1200ms cubic-bezier(0.25, 0.46, 0.45, 0.94) 200ms;
  transform: translate(0, 10px);
  will-change: opacity, transform;
}
.is-inview .sec__lead {
  opacity: 1;
  transform: translate(0, 0);
}

.sec__info {
  display: flex;
  border-bottom: 1px solid #d3d3d3;
  opacity: 0;
  transition: opacity 800ms cubic-bezier(0, 0, 1, 1) 400ms, transform 1200ms cubic-bezier(0.25, 0.46, 0.45, 0.94) 400ms;
  transform: translate(0, 10px);
  will-change: opacity, transform;
}
.is-inview .sec__info {
  opacity: 1;
  transform: translate(0, 0);
}
.sec__info:first-of-type {
  border-top: 1px solid #d3d3d3;
}

.sec__info-title {
  font-weight: 500;
  letter-spacing: 0.1em;
}

.sec__info-text {
  letter-spacing: 0.2em;
}

@media only screen and (max-width: 767px) {
  .kv__title {
    width: 27.4666666667vw;
  }
  .content-body {
    padding-top: 13.3333333333vw;
    padding-left: 5.3333333333vw;
    padding-right: 5.3333333333vw;
  }
  .summary p {
    font-size: 3.4666666667vw;
  }
  .sec {
    flex-direction: column;
    margin-top: 16vw;
  }
  .sec.--1 {
    margin-top: 10.6666666667vw;
  }
  .sec__text {
    margin-top: 10.6666666667vw;
  }
  .sec__title.--1 {
    width: 25.6vw;
  }
  .sec__title.--2 {
    width: 53.6vw;
  }
  .sec__title.--3 {
    width: 67.4666666667vw;
  }
  .sec__title.--4 {
    width: 58.6666666667vw;
  }
  .sec__lead {
    margin-top: 6.6666666667vw;
    font-size: 3.4666666667vw;
  }
  .sec__info {
    flex-direction: column;
    padding-top: 6.6666666667vw;
    padding-bottom: 6.6666666667vw;
  }
  .sec__info:first-of-type {
    margin-top: 6.6666666667vw;
  }
  .sec__info-title {
    font-size: 3.4666666667vw;
  }
  .sec__info-text {
    margin-top: 5.0666666667vw;
    font-size: 3.4666666667vw;
  }
  .sec__img {
    margin-left: -5.3333333333vw;
    margin-right: -5.3333333333vw;
  }
}
@media screen and (min-width: 768px) {
  .kv__title {
    width: 124px;
  }
  .content-body {
    padding-top: min(13.4020618557vw, 130px);
  }
  .summary {
    max-width: min(79.381443299vw, 770px);
    margin-left: auto;
    margin-right: auto;
  }
  .summary p {
    font-size: min(1.4432989691vw, 14px);
  }
  .sec {
    justify-content: space-between;
    margin-top: min(7.3206442167vw, 100px);
    padding-left: min(2.5622254758vw, 35px);
    padding-right: min(2.5622254758vw, 35px);
  }
  .sec.--1 {
    margin-top: min(9.1508052709vw, 125px);
  }
  .sec.--2, .sec.--4 {
    flex-direction: row-reverse;
  }
  .sec__text {
    width: min(38.7994143485vw, 530px);
  }
  .sec__title.--1 {
    width: min(7.027818448vw, 96px);
  }
  .sec__title.--2 {
    width: min(14.7144948755vw, 201px);
  }
  .sec__title.--3 {
    width: min(18.5212298682vw, 253px);
  }
  .sec__title.--4 {
    width: min(16.1054172767vw, 220px);
  }
  .sec__lead {
    margin-top: min(1.4641288433vw, 20px);
    font-size: min(1.0248901903vw, 14px);
  }
  .sec__info {
    padding-top: min(1.756954612vw, 24px);
    padding-bottom: min(1.756954612vw, 24px);
  }
  .sec__info:first-of-type {
    margin-top: min(2.5622254758vw, 35px);
  }
  .sec__info-title {
    flex-shrink: 0;
    width: min(7.906295754vw, 108px);
    font-size: min(1.0980966325vw, 15px);
  }
  .sec__info-text {
    font-size: min(1.0980966325vw, 15px);
  }
  .sec__img {
    width: min(36.6032210835vw, 500px);
  }
}