.fv {
  position: relative;
}
@media (max-width: 767px) {
  .fv {
    margin-top: 70px;
  }
}
.fv__head {
  position: absolute;
  color: #2FC986;
  left: 0;
  right: 0;
  margin: auto;
  letter-spacing: 0.02rem;
  z-index: 10;
}
@media (min-width: 768px) {
  .fv__head {
    font-size: 12vw;
    line-height: 10.98vw;
    bottom: -6.98vw;
  }
}
@media (max-width: 767px) {
  .fv__head {
    font-size: 21.07vw;
    line-height: 1;
    bottom: -18vw;
  }
}

@media (min-width: 768px) {
  .intro {
    padding: 10.98vw 0 5.12vw;
  }
}
@media (max-width: 767px) {
  .intro {
    padding: 22.67vw 0 25.33vw;
  }
}
@media (max-width: 767px) {
  .intro__wrapper {
    width: 86.67vw;
  }
}
@media (min-width: 768px) {
  .intro__body {
    padding: 0 30px;
    line-height: 62px;
  }
}
@media (min-width: 768px) and (max-width: 1365px) {
  .intro__body {
    line-height: 4.69vw;
  }
}
@media (max-width: 767px) {
  .intro__body {
    line-height: 44px;
  }
}
.purpose {
  position: relative;
  background-color: #c6d5d4;
}
@media (min-width: 768px) {
  .purpose {
    margin: 11vw 0;
  }
}
.purpose::before, .purpose::after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  background-repeat: no-repeat;
  background-size: cover;
}
.purpose::before {
  background-position: top center;
  background-image: url(../img/common/co_gr1_fr_top_2x.png);
  height: 10.98vw;
  top: -10.8vw;
}
.purpose::after {
  background-position: bottom center;
  background-image: url(../img/common/co_gr1_fr_btm_2x.png);
  height: 10.98vw;
  bottom: -10.8vw;
}
.purpose__wrapper {
  padding: 20px 0;
}
@media (max-width: 767px) {
  .purpose__wrapper {
    width: 85.33vw;
  }
}
@media (min-width: 768px) {
  .purpose__tx {
    width: 703px;
  }
}
@media (min-width: 768px) and (max-width: 1166px) {
  .purpose__tx {
    width: 60.29vw;
  }
}
@media (max-width: 767px) {
  .purpose__tx {
    width: 81.2vw;
  }
}
@media (min-width: 768px) {
  .purpose__body {
    max-width: 1000px;
    padding: 0 20px;
  }
}
.purpose__ul {
  counter-reset: num;
  list-style: none;
}
.purpose__li {
  counter-increment: num;
}
.purpose__box {
  gap: 0 40px;
}
.purpose__img {
  position: relative;
  display: table;
  margin-left: auto;
  margin-right: auto;
}
@media (min-width: 768px) {
  .purpose__img img {
    width: 456px;
  }
}
@media (min-width: 768px) and (max-width: 1166px) {
  .purpose__img img {
    width: 39.11vw;
  }
}
.purpose__img::before {
  content: counter(num, decimal-leading-zero);
  display: block;
  position: absolute;
  left: 10px;
  color: #2fc986;
  font-family: vinyl, sans-serif;
  font-style: normal;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.04rem;
}
@media (min-width: 768px) {
  .purpose__img::before {
    font-size: 140px;
    top: -35px;
  }
}
@media (max-width: 767px) {
  .purpose__img::before {
    font-size: 98px;
    top: -25px;
  }
}
@media (min-width: 768px) {
  .purpose__text {
    flex: 1;
  }
}
@media (min-width: 768px) and (max-width: 1166px) {
  .purpose__text {
    margin-top: 2.57vw;
  }
}
.purpose__subtitle {
  letter-spacing: 0.06rem;
}
@media (min-width: 768px) {
  .purpose__subtitle {
    line-height: 56px;
  }
}
@media (min-width: 768px) and (max-width: 1365px) {
  .purpose__subtitle {
    font-size: 22px;
  }
}
@media (max-width: 767px) {
  .purpose__subtitle {
    line-height: 45px;
  }
}
.purpose__p {
  line-height: 38px;
}

.merit {
  position: relative;
  z-index: -1;
}
@media (min-width: 768px) {
  .merit {
    margin-top: -11vw;
  }
}
.merit__mv {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 100%;
}
@media (min-width: 768px) {
  .merit__mv {
    max-height: 750px;
    height: 54.9vw;
  }
}
@media (max-width: 767px) {
  .merit__mv {
    height: 97.33vw;
  }
}
.merit__mv video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  transform: translateX(-50%) translateY(-50%);
  z-index: -1;
}
.merit__mv::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-image: url(../img/top/to_02_mov_ptn.png);
  background-repeat: repeat;
  background-size: 3px 3px;
  z-index: 0;
}
.merit__wrapper {
  position: relative;
}
@media (min-width: 768px) {
  .merit__wrapper {
    padding-bottom: 60px;
  }
}
.merit__head {
  position: absolute;
  color: #2FC986;
  left: 0;
  right: 0;
  margin: auto;
  letter-spacing: 0.04rem;
  z-index: 10;
}
@media (min-width: 768px) {
  .merit__head {
    font-size: 12.45vw;
    line-height: 10.98vw;
    top: -4.39vw;
  }
}
@media (max-width: 767px) {
  .merit__head {
    font-size: 26.67vw;
    top: -8vw;
  }
}
@media (max-width: 767px) {
  .merit__head .textanimation {
    line-height: 21.33vw;
  }
}
@media (min-width: 768px) {
  .merit__body {
    padding-top: 8.78vw;
  }
}
@media (max-width: 767px) {
  .merit__body {
    padding-top: 17.33vw;
  }
}
.merit__subtitle {
  font-weight: normal;
}
@media (max-width: 767px) {
  .merit__subtitle {
    letter-spacing: 0.18rem;
  }
}
.merit__p {
  line-height: 38px;
  letter-spacing: -0.04rem;
}
@media (min-width: 768px) {
  .merit__p {
    max-width: 980px;
    padding: 0 30px;
  }
}
@media (max-width: 767px) {
  .merit__p {
    max-width: 81.33vw;
  }
}
.merit__slider .swiper-wrapper {
  transition-timing-function: linear;
}
@media (min-width: 768px) {
  .merit__slider img {
    width: 27.89vw;
  }
}
@media (max-width: 767px) {
  .merit__slider img {
    width: 64vw;
  }
}