@charset "UTF-8";
/*css　*/
.mStatement-holder {
  position: relative;
  overflow: hidden;
  padding-left: 70px;
  width: 100%;
  max-width: 860px;
  padding-bottom: 17vh;
}

.mStatement-bg {
  display: block;
  width: 100%;
  height: calc(100vh - 112px - 40px);
  position: fixed;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  top: 112px;
  z-index: 0;
  overflow: hidden;
  opacity: 1;
  -webkit-transition: opacity 1s;
  transition: opacity 1s;
  background: url("../img/statement/bg.jpg") no-repeat top left;
  background-size: cover;
}

.-pcHumberger .mStatement-bg {
  background-position: 0% 48%;
}

.mStatement-bg::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
  -webkit-transition: opacity 1.4s 1.8s;
  transition: opacity 1.4s 1.8s;
  background-color: rgba(0, 0, 0, 0.5);
}

.-action .mStatement-bg {
  opacity: 1;
}

.-action .mStatement-bg::after {
  opacity: 1;
}

.mStatement-title_inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column nowrap;
          flex-flow: column nowrap;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  font-size: 36px;
}

.mStatement-title_inner > * {
  min-height: 1px;
  max-width: 100%;
}

.mStatement-title_1, .mStatement-title_2 {
  overflow: hidden;
  display: block;
  position: relative;
}

.mStatement-title_1 > img, .mStatement-title_2 > img {
  display: block;
  width: 100%;
  opacity: 0;
  -webkit-transition: opacity 0.85s 1.05s;
  transition: opacity 0.85s 1.05s;
}

.mStatement-title_1::after, .mStatement-title_2::after {
  content: "";
  width: 102%;
  height: 100%;
  background-color: #FFF;
  position: absolute;
  left: 0;
  top: 0;
  -webkit-transition: -webkit-transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.8s;
  transition: -webkit-transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.8s;
  transition: transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.8s;
  transition: transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.8s, -webkit-transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.8s;
  -webkit-transform: translateX(-102%);
          transform: translateX(-102%);
}

.-action .mStatement-title_1 img, .-action .mStatement-title_2 img {
  opacity: 1;
}

.-action .mStatement-title_1::after, .-action .mStatement-title_2::after {
  -webkit-transform: translateX(102%);
          transform: translateX(102%);
}

.mStatement-title_1 {
  width: 146px;
}

.mStatement-title_2 {
  width: 223px;
  margin-top: 15px;
}

.mStatement-title_2 img {
  -webkit-transition-delay: 1.3s;
          transition-delay: 1.3s;
}

.mStatement-title_2::after {
  -webkit-transition-delay: 1.1s;
          transition-delay: 1.1s;
}

.mStatement-context_wraper {
  font-size: 16px;
  line-height: 2.75;
  letter-spacing: 0.08em;
  color: #FFF;
  position: relative;
  margin-top: 3em;
}

.mStatement-each {
  opacity: 0;
  -webkit-transform: translateY(1.2em);
          transform: translateY(1.2em);
  -webkit-transition: opacity 1.95s,-webkit-transform 1.45s;
  transition: opacity 1.95s,-webkit-transform 1.45s;
  transition: opacity 1.95s,transform 1.45s;
  transition: opacity 1.95s,transform 1.45s,-webkit-transform 1.45s;
}

.-action .mStatement-each {
  opacity: 1;
  -webkit-transform: translateY(0);
          transform: translateY(0);
}

.mStatement-each:nth-of-type(1) {
  -webkit-transition-delay: 2.5s, 2.5s;
          transition-delay: 2.5s, 2.5s;
}

.mStatement-each:nth-of-type(2) {
  -webkit-transition-delay: 2.75s, 2.75s;
          transition-delay: 2.75s, 2.75s;
}

.mStatement-each:nth-of-type(3) {
  -webkit-transition-delay: 3s, 3s;
          transition-delay: 3s, 3s;
}

.mStatement-each:nth-of-type(4) {
  -webkit-transition-delay: 3.25s, 3.25s;
          transition-delay: 3.25s, 3.25s;
}

.mStatement-each:nth-of-type(5) {
  -webkit-transition-delay: 3.5s, 3.5s;
          transition-delay: 3.5s, 3.5s;
}

.mStatement-each:nth-of-type(6) {
  -webkit-transition-delay: 3.75s, 3.75s;
          transition-delay: 3.75s, 3.75s;
}

.mStatement-each:nth-of-type(7) {
  -webkit-transition-delay: 4s, 4s;
          transition-delay: 4s, 4s;
}

.mStatement-each:nth-of-type(8) {
  -webkit-transition-delay: 4.25s, 4.25s;
          transition-delay: 4.25s, 4.25s;
}

.mStatement-each:nth-of-type(9) {
  -webkit-transition-delay: 4.5s, 4.5s;
          transition-delay: 4.5s, 4.5s;
}

.mStatement-each:nth-of-type(10) {
  -webkit-transition-delay: 4.75s, 4.75s;
          transition-delay: 4.75s, 4.75s;
}

.mStatement-each:nth-of-type(11) {
  -webkit-transition-delay: 5s, 5s;
          transition-delay: 5s, 5s;
}

.mStatement-each:nth-of-type(12) {
  -webkit-transition-delay: 5.25s, 5.25s;
          transition-delay: 5.25s, 5.25s;
}

.mStatement-each:nth-of-type(13) {
  -webkit-transition-delay: 5.5s, 5.5s;
          transition-delay: 5.5s, 5.5s;
}

.mStatement-each:nth-of-type(14) {
  -webkit-transition-delay: 5.75s, 5.75s;
          transition-delay: 5.75s, 5.75s;
}

.mStatement-each:nth-of-type(15) {
  -webkit-transition-delay: 6s, 6.4s;
          transition-delay: 6s, 6.4s;
}

.mStatement-each:nth-of-type(16) {
  -webkit-transition-delay: 6.25s, 6.65s;
          transition-delay: 6.25s, 6.65s;
}

.mStatement-copy {
  width: 284px;
  margin-top: 42px;
  opacity: 0;
  -webkit-transform: translateY(1.2em);
          transform: translateY(1.2em);
  -webkit-transition: opacity 2.45s,-webkit-transform 1.95s;
  transition: opacity 2.45s,-webkit-transform 1.95s;
  transition: opacity 2.45s,transform 1.95s;
  transition: opacity 2.45s,transform 1.95s,-webkit-transform 1.95s;
  -webkit-transition-delay: 6.5s, 6.9s;
          transition-delay: 6.5s, 6.9s;
}

.mStatement-copy img {
  width: 100%;
}

.-action .mStatement-copy {
  opacity: 1;
  -webkit-transform: translateY(0);
          transform: translateY(0);
}

.mStatement-logo {
  width: 201px;
  margin-top: 57px;
  opacity: 0;
  -webkit-transform: translateY(1.2em);
          transform: translateY(1.2em);
  -webkit-transition: opacity 2.45s,-webkit-transform 1.95s;
  transition: opacity 2.45s,-webkit-transform 1.95s;
  transition: opacity 2.45s,transform 1.95s;
  transition: opacity 2.45s,transform 1.95s,-webkit-transform 1.95s;
  -webkit-transition-delay: 6.75s, 7.15s;
          transition-delay: 6.75s, 7.15s;
}

.mStatement-logo img {
  width: 100%;
}

.-action .mStatement-logo {
  opacity: 1;
  -webkit-transform: translateY(0);
          transform: translateY(0);
}

@media only screen and (max-width: 896px) and (orientation: landscape) {
  .mStatement-holder {
    padding-bottom: 26.78571vw;
  }
  .mStatement-bg {
    height: calc(100vh - 9.58084vw);
    background: url("../img/statement/bg-sp.jpg") no-repeat top left;
    background-size: cover;
    top: 9.58084vw;
  }
  .-pcHumberger .mStatement-bg {
    background-position: 0% 70%;
  }
}

@media only screen and (max-width: 768px) {
  .mStatement-holder {
    padding-left: 6.4vw;
    max-width: 100%;
  }
  .mStatement-bg {
    height: calc(100vh - 21.6vw);
    background: url("../img/statement/bg-sp.jpg") no-repeat top left;
    background-size: cover;
  }
  .mStatement-title_inner {
    font-size: 8vw;
  }
  .mStatement-title_1 {
    width: 31.73333vw;
  }
  .mStatement-title_2 {
    width: 49.06667vw;
    margin-top: 3.33333vw;
  }
  .mStatement-context_wraper {
    font-size: 3.73333vw;
    line-height: 2.857;
    margin-top: 9.33333vw;
  }
  .mStatement-each {
    opacity: 0;
    -webkit-transform: translateY(1.2em);
            transform: translateY(1.2em);
    -webkit-transition: opacity 1.95s,-webkit-transform 1.45s;
    transition: opacity 1.95s,-webkit-transform 1.45s;
    transition: opacity 1.95s,transform 1.45s;
    transition: opacity 1.95s,transform 1.45s,-webkit-transform 1.45s;
  }
  .-action .mStatement-each {
    opacity: 1;
    -webkit-transform: translateY(0);
            transform: translateY(0);
  }
  .mStatement-copy {
    width: 48.26667vw;
    margin-top: 12.26667vw;
  }
  .mStatement-logo {
    width: 49.86667vw;
    margin-top: 12.4vw;
  }
}

@media only screen and (max-width: 768px) and (min-height: 800px) and (max-height: 1030px) {
  .mStatement-bg {
    background-position: 0 60%;
  }
}

@media only screen and (max-width: 768px) and (orientation: landscape) {
  .mStatement-holder {
    padding-bottom: 20.95808vw;
  }
  .mStatement-bg {
    height: calc(100vh - 9.58084vw);
    background: url("../img/statement/bg-sp.jpg") no-repeat top left;
    background-size: cover;
    background-position: 0% 74%;
    top: 9.58084vw;
  }
  .mStatement-title_inner {
    font-size: 4.49102vw;
  }
  .mStatement-title_1 {
    width: 17.81437vw;
  }
  .mStatement-title_2 {
    width: 27.54491vw;
    margin-top: 1.87126vw;
  }
  .mStatement-context_wraper {
    font-size: 2.09581vw;
    margin-top: 5.23952vw;
  }
  .mStatement-copy {
    width: 27.09581vw;
    margin-top: 3.44311vw;
  }
  .mStatement-logo {
    width: 27.99401vw;
    margin-top: 6.96108vw;
  }
}

body, html {
  background-color: #fff;
}
