.main {
  background: #EFE9E5;
  overflow: hidden;
}
.main-bg {
  background: url(../img/concept/bg01.webp) no-repeat center left;
  background-size: 100% auto;
  bottom: 0;
  height: 100vh;
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  width: 100%;
}
.main-bg.is-hidden {
  opacity: 0;
}
.main .inner {
  padding: 0;
}
.main-conts {
  padding: 185px 0;
  position: relative;
  z-index: 1;
}
.main-conts h1 {
  color: #81385F;
  margin-bottom: 76px;
}
.main-conts h2 {
  margin-bottom: 140px;
}
.main-conts p {
  margin-bottom: 30px;
}
.moi-img {
  margin: 0 auto;
  width: calc(798% / 16.8);
}

.quality {
  background: #F0EFED url(../img/concept/bg02.webp) no-repeat center top;
  background-size: cover;
  position: relative;
  z-index: 1;
}
.quality h2 {
  margin: 85px auto 50px;
}
.quality-img01 {
  margin: 98px auto 0;
  width: calc(1045% / 13);
}

@media screen and (max-width: 767px) {
  .main-bg {
    background: url(../img/concept/bg01.webp) no-repeat center left;
    background-size: cover;
    height: 100vh;
  }
  .main-conts {
    padding: 40px 0;
  }
  .main-conts h1 {
    margin-bottom: 38px;
  }
  .main-conts h2 {
    margin-bottom: 60px;
  }
  .moi-text {
    margin: 0 auto;
    width: calc(368% / 7.5);
  }
  .moi-img {
    width: 100%;
  }

  .quality {
    background-size: 100% auto;
  }
  .quality h2 {
    margin: 40px auto 20px;
  }
  .quality-title {
    margin: 0 auto;
    width: calc(225% / 7.5);
  }
  .quality-img01 {
    margin: 50px -25% 0;
    width: 150%;
  }
}