.fv {
  background: url("../img/concept/fv.jpg") no-repeat center center;
  background-size: cover;
}

.movieWrap {
  width: 90%;
  max-width: 840px;
  margin: 0 auto 12%;
}
.movieWrap .movie {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 56.25%;
}
.movieWrap iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}

.aboutWrap {
  width: 100%;
  max-width: 1020px;
  margin: 0 auto;
}
.aboutWrap .box {
  margin-bottom: 8%;
}
.aboutWrap .box .txtArea {
  padding: 0 5%;
  margin: 0 auto;
  box-sizing: border-box;
  z-index: 1;
}
.aboutWrap .box .catch {
  font-size: 5.3333333333vw;
  font-weight: bold;
  margin-bottom: 5%;
}
.aboutWrap .box .txt {
  margin-bottom: 10%;
}
.aboutWrap .box .imgArea img {
  width: 100%;
}

@media screen and (min-width: 768px) {
  .mainContents {
    padding: 5% 0 8%;
  }

  .movieWrap {
    margin: 0 auto 8%;
  }

  .aboutWrap .box .txtArea {
    padding: 3%;
    box-sizing: border-box;
  }
  .aboutWrap .box .catch {
    font-size: 2vw;
    margin-bottom: 3%;
  }
  .aboutWrap .box .txt {
    margin-bottom: 5%;
  }
  .aboutWrap .box:nth-of-type(2) {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
  }
  .aboutWrap .box.first {
    position: relative;
  }
  .aboutWrap .box.first .txtArea {
    width: 49%;
    background: rgba(255, 255, 255, 0.8);
    position: absolute;
    top: 0;
    left: 0;
  }
  .aboutWrap .box.first .imgArea {
    width: 70%;
    margin: 0 0 0 auto;
  }
}
@media screen and (min-width: 1400px) {
  .aboutWrap .box .catch {
    font-size: 28px;
  }
}