.hero-main-unit {
  margin-bottom: 130px;
}

@media (max-width: 568px) {
  .hero-main-unit {
    margin-bottom: 0;
    padding-top: 74px;
  }
}

.movie-unit {
  margin: 0 0 150px;
  padding: 4px 0 0 0;
  background-color: #f7f5f2;
}

@media (max-width: 568px) {
  .movie-unit {
    margin: 30px 0 70px 0;
    padding: 5px 0 25px 0;
  }
}

.movie-unit > .su-inner {
  position: relative;
  top:-30px;
  width: 1280px;
  margin: 0 auto;
}

@media (max-width: 568px) {
  .movie-unit > .su-inner {
    position: relative;
    top:0;
    padding: 0;
    width: 92.3%;
    margin: 0 auto;
  }
}

.youtube {
  width: 1000px;
  height: 563px;
  margin: 0 auto;
}

@media (max-width: 568px) {
  .youtube {
    width: 100%;
    height: auto;
  }
}

.movie-wrap {
  position: relative;
  padding-bottom: 56.25%;
  /*アスペクト比 16:9の場合の縦幅*/
  height: 0;
  overflow: hidden;
  text-align: center;
}

.movie-wrap iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}


@media screen and (min-width: 569px) and (max-width: 1024px) {
  .movie-unit > .su-inner {
    width: 100%;
  }
}