@charset "UTF-8";
/** --------------------------------
* cssの値を単位を除いて数字だけにしてくれる関数
*
* @param 数字と単位を含む値 10ox, 3remなど
*/
/** --------------------------------
* 値の「単位」を取得する関数
*
* @param $value 数字と単位を含む値 10ox, 3remなど
*/
/** --------------------------------
* pxやremをvwに変換してくれる関数
*
* @param $viewport pcデザインの横幅
* @param $fontSize フォントサイズ(pxでもremでも)
*/
/** --------------------------------
* フォントサイズをレスポンシブで調整する関数
*
* @param $pc pcのフォントサイズ
* @param $sp spのフォントサイズ
*/
html {
  font-size: 62.5%;
}

.body {
  font-family: 'Helvetica Neue',sans-serif;
  overflow-x: hidden;
  overflow-y: scroll;
}

@media only screen and (max-width: 768px) {
  .-pc-only {
    display: none;
  }
}

.-sp-only {
  display: none;
}

@media only screen and (max-width: 768px) {
  .-sp-only {
    display: inline-block;
  }
}

.inner {
  max-width: calc(128rem + 4rem);
  padding-right: 2rem;
  padding-left: 2rem;
  margin: 0 auto;
}

img {
  width: 100%;
}

.mvBottom {
  padding: 5rem 0;
}

@media only screen and (max-width: 768px), only screen and (max-width: 480px) {
  .mvBottom {
    padding: 2.2rem 0 3.5rem;
  }
}

.mvBottom__subTitle {
  display: inline-block;
  padding-bottom: 0.3rem;
  margin-bottom: 4rem;
  color: #031722;
  font-family: Arial;
  font-size: 24px;
  font-weight: bold;
  text-align: center;
  border-bottom: solid 1px;
}

@media only screen and (max-width: 768px), only screen and (max-width: 480px) {
  .mvBottom__subTitle {
    margin-bottom: 2rem;
    font-size: 9px;
  }
}

.mvBottom__wrap {
  text-align: center;
}

.mvBottom__title {
  color: #031722;
  font-family: 'Helvetica Neue';
  font-size: 47px;
  font-weight: bold;
  line-height: 71px;
  text-align: center;
}

@media screen and (min-width: 770px) and (max-width: 1024px) {
  .mvBottom__title {
    font-size: 40px;
  }
}

@media only screen and (max-width: 768px), only screen and (max-width: 480px) {
  .mvBottom__title {
    margin-bottom: 0.3rem;
    font-size: 15px;
    line-height: 18px;
  }
}

.mvBottom__concept {
  margin-bottom: 7.5rem;
  color: #031722;
  font-family: 'Helvetica Neue';
  font-size: 48px;
  font-weight: bold;
  line-height: 71px;
  text-align: center;
}

@media screen and (min-width: 770px) and (max-width: 1024px) {
  .mvBottom__concept {
    font-size: 25px;
  }
}

@media only screen and (max-width: 768px), only screen and (max-width: 480px) {
  .mvBottom__concept {
    margin-bottom: 1.7rem;
    font-size: 15px;
    line-height: 15px;
  }
}

.mvBottom__conceptSmall {
  padding: 0rem 0.5rem;
  color: #031722;
  font-size: 28px;
  font-weight: bold;
  line-height: 41px;
  text-align: center;
}

@media only screen and (max-width: 768px), only screen and (max-width: 480px) {
  .mvBottom__conceptSmall {
    padding: 0rem 0.2rem;
    font-size: 9px;
    line-height: 9px;
  }
}

.mvBottom__text {
  margin-bottom: 8.5rem;
  color: #031722;
  font-family: 'Helvetica Neue';
  font-size: 24px;
  font-weight: 500;
  line-height: 44px;
  text-align: center;
}

@media screen and (min-width: 770px) and (max-width: 1024px) {
  .mvBottom__text {
    font-size: 18px;
  }
}

@media only screen and (max-width: 768px), only screen and (max-width: 480px) {
  .mvBottom__text {
    margin-bottom: 1.5rem;
    font-size: 10px;
    line-height: 18.5px;
  }
}

.mvBottom__btn {
  display: block;
  width: 100%;
  max-width: 128rem;
  padding: 7rem;
  margin: auto;
  color: #ffffff;
  font-size: 50px;
  font-weight: bold;
  letter-spacing: 0.02em;
  text-align: center;
  background: #505d5d;
}

@media screen and (min-width: 770px) and (max-width: 1024px) {
  .mvBottom__btn {
    font-size: 40px;
  }
}

@media only screen and (max-width: 768px), only screen and (max-width: 480px) {
  .mvBottom__btn {
    padding: 2rem 0;
    font-size: 20px;
  }
}