@charset "UTF-8";

/*lp-main*/
.lp-main {
  margin-bottom: -250px;
}

@media only screen and (max-width: 768px) {
  footer#footer {
    padding-top: 0!important;
    margin-top: 0!important;
  }

  .lp-main {
    margin-bottom: auto;
  }
}

/*link*/
a,
a:hover {
  cursor:pointer;
  color: inherit;
  transition-property: opacity;
  transition-duration: 0.5s;
  transition: 0.2s all;
}

a:hover {
  opacity: 0.7; 
}

@media only screen and (max-width: 768px) {
  a:hover {
    opacity: 1.0; 
  }
}

/*font*/
.isemin {
  font-family: "isemin", sans-serif;
  font-weight: 900;
  font-style: normal;
}

/*container*/
.lp__container {
  max-width: 1400px;
  box-sizing: border-box;
  margin: auto;
}

.lp__container__middle {
  max-width: 1180px;
  box-sizing: border-box;
  margin: auto;
}

.lp__container__narrow {
  max-width: 1024px;
  box-sizing: border-box;
  margin: auto;
}

.lp__container__xnarrow {
  max-width: 920px;
  box-sizing: border-box;
  margin: auto;
}

@media only screen and (max-width: 768px) {
  .lp__container__middle ,
  .lp__container__narrow ,
  .lp__container__xnarrow {
    max-width: 100%;
  }
}

/*lp__main*/
.lp__main {
  margin: auto;
  margin-top: 150px;
  font-family: "genkaimincho", sans-serif;
  font-weight: 800;
  font-style: normal;
}

@media only screen and (max-width: 768px) {
  .lp__main {
    margin-top: calc(150px / 2);
  }
}

/*lp__title*/
.lp__title {
  text-align: center;
  margin-bottom: 36px;
}

.lp__title span.ja {
  display: block;
  padding:18px 9px;
  color: #fff;
  line-height: 1.123456789;
  text-align: center;
  background: #060606;
}


@media only screen and (max-width: 768px) {
  .lp__title {
    margin-bottom: calc(36px / 2);
  }

  .lp__title span.ja {
    padding:calc(18px / 1) 9px;
    font-size: 18px;
    line-height: 1.56789;
  }

}

/*lp__mv*/
.lp__mv {
  margin-top: 27px;
}

@media only screen and (max-width: 768px) {
  .lp__mv {
    margin-top: calc(27px / 2);
  }

}

/*lp__section*/
.lp__section__container {
  background-image: url(../images/lp/bg__section1__pc.jpg);
  background-position: 50% 0;
  background-repeat: no-repeat;
  background-color: #080606;
}

.lp__section {
  padding: 90px 0;
}

.lp__section.lp__play {
  padding-top: 45px;
  background-image: url(../images/lp/bg__section2__pc.png);
  background-position: center bottom;
  background-repeat: no-repeat;
}

.lp__section__title span {
  display: block;
  text-align: center;
  color: #fff;
  margin: 18px auto;
}

.lp__section__title span.ja {
  font-size: 18px;
  line-height: 1.2345678;
}

.lp__section__text {
  margin: 45px auto;
}

.lp__section__text p {
  color: #fff;
  font-size: 24px;
  line-height: 2;
}

@media only screen and (max-width: 768px) {
  .lp__section__container {
    background-image: url(../images/lp/bg__section1__sp.jpg);
    background-size: 100%;
  }

  .lp__section.lp__play {
    background-image: url(../images/lp/bg__section2__sp.png);
    background-color: transparent;
  }

  .lp__section {
    padding: calc(90px / 4) 0;
    padding-left: 1em;
    padding-right:1em;
  }

    .lp__section.lp__concept {
      padding-top: calc(90px / 3);
    }

  .lp__section.lp__play {
    padding-top: calc(45px / 3) ;
  }

  .lp__section__title span {
    margin: calc(18px / 2) auto;
  }

  .lp__section__title span.en img {
    width: auto;
    height: calc(58px / 2);
  }

  .lp__section__title span.ja {
    font-size: 13px
  }

  .lp__section__text {
    margin: calc(45px / 2) auto;
  }

  .lp__section__text p {
    font-size:15px
  }
}

/*lp__about*/
.lp__about__list  {
  margin: 72px auto auto; 
}

.lp__about__list dl {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  background-image: url(../images/lp/bg__about.png);
  background-position: bottom left;
  background-repeat: no-repeat;
  padding:36px 0;
  width: 100%;
}

.lp__about__list dl dt ,
.lp__about__list dl dd  {
  font-size: 24px;
  font-family: "isemin", sans-serif;
  font-weight: 900;
  font-style: normal;
}

.lp__about__list dl dt  {
  color: #d3212f;
  flex-basis: 22.5%;
}

.lp__about__list dl dd  {
  color: #fff;
  flex-basis: 77.5%;
}

@media only screen and (max-width: 768px) {
  .lp__about__list  {
    margin: calc(90px / 5) auto auto; 
  }

  .lp__about__list dl {
    padding:calc(72px / 4) 0;
  }

  .lp__about__list dl dt ,
  .lp__about__list dl dd  {
    margin:0;
    font-size: 16px;
    line-height: 1.789;
  }

  .lp__about__list dl dt ,
  .lp__about__list dl dd  {
    flex-basis: 100%;
  }

  .lp__about__caution {
    margin: calc(36px / 3) 0 0;
  }

  .lp__about__caution p {
    font-size: 13px;
    line-height: 1.789;
  }

}

/*lp__play*/
.lp__play__container {
  margin: 90px auto auto; 
}

.lp__play__container p {
  font-size: 20px;
}

.lp__play__container ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: top;
  list-style: none;
}

.lp__step__list {
  list-style: none;
  flex-basis: 31%;
  margin: 0 1%;
}

.lp__step__list span {
  display: block;
  text-align: center;
  margin: auto;
}

.lp__step__list span img {
  position: relative;
  margin-bottom: -54px;
}

.lp__step__list span.ja {
  font-size: 24px;
  line-height: 1.5;
  color: #fff;
}

  .lp__step__list:nth-child(1) span.ja {
    line-height: 3;
  }

@media only screen and (max-width: 768px) {
  .lp__play__container {
    margin: calc(90px / 5) auto auto; 
  }

  .lp__play__container p {
    font-size: 16px;
  }

  .lp__step__list {
    flex-basis: 100%;
    margin: 18px auto;
  }

  .lp__step__list span img {
    margin-bottom: -36px;
    max-width: 200px;
  }

  .lp__step__list span.ja {
    font-size:18px;
  }

  .lp__step__list:nth-child(1) span.ja {
    line-height: 1;
  }

}

/*lp__common*/
.lp__common {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-weight: normal;
  padding:27px 0;
}

.lp__common__title {
  text-align: center;
  margin: auto;
  font-weight: 600;
  border-top: 1.5px solid #0a0003;
  border-bottom: 1.5px solid #0a0003;
  margin: 54px auto 18px;
}

.lp__common__title span.ja {
  display: block;
  padding: 18px 0;
  font-size: 24px;
}

.lp__common p {
  font-weight: normal;
  font-size: 20px;
  text-align: justify;
  line-height: 2;
}

.lp__common__img {
  display: block;
  text-align:center;
  margin: 27px auto 13.5px;
  max-width: 468px;
} 

.lp__common__caption {
  display: block;
} 

.plan__images__list,
.plan__btn__list {
  margin: 36px auto 18px;
  text-align: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: top;
  list-style: none;
}

.plan__images__list li {
  padding: 0;
  margin: 0 auto;
  list-style: none;
  flex-basis: 32%;
}

.plan__btn__list li {
  padding: 0;
  margin: 0 auto;
  list-style: none;
  flex-basis: 45%;
}

.plan__btn__list li a {
  display: block;
  background-image: url(../images/lp/icon__arrow.png);
  background-position: 92.5% 52.5%;
  background-repeat: no-repeat;
  text-decoration: none;
  text-align: center;
  color: #fff;
  font-size: 22px;
  padding:36px 9px ;
  line-height: 1;
  border-radius: 100px;
}

.plan__btn__list li a.btn__offer {
  background-color: #d3a86a;
}

.plan__btn__list li a.btn__reserve {
  background-color: #0a0003;
}


@media only screen and (max-width: 768px) {
  .lp__common {
    padding:calc(27px / 2) 2em;
    box-sizing: border-box;
  }

  .lp__common__title {
    margin:calc(54px / 2) auto calc(18px /2);
  }

  .lp__common__title span.ja {
    padding: calc(18px / 2) 0;
    font-size: 15px
  }

  .lp__common p {
    font-size:13px;
    line-height: 1.789;
  }

  .lp__common__img {
    margin: calc(27px /2) auto calc(13.5px /2);
    max-width: 100%;
  } 

  .plan__images__list,
  .plan__btn__list {
    margin: calc(36px / 2) auto calc(18px / 2);
  }

  .plan__images__list,
  .plan__btn__list {
    margin: calc(36px / 2) auto calc(18px / 2);
  }

  .plan__images__list li {
    flex-basis: 100%;
    margin:4.5px auto;
  }

  .plan__btn__list li {
    flex-basis: 100%;
    margin: 9px auto;
  }

  .plan__btn__list li a {
    background-image: url(../images/lp/icon__arrow.png);
    font-size: 15px;
    padding:calc(36px / 1.5) 9px;
  }

}