@charset "utf-8";
/* CSS Document */

/*******************

LP style

********************/
html , body {
  box-sizing: border-box;
  margin: 0 auto;
  padding: 0;
  width: 100%;
}

/* content
--------------------------------------------------*/
.lpbox , #lpfooter {
  font-size: 14px;
  font-size: 3.7333vw;
  font-family: 'Noto Sans JP','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ','Mayryo','ＭＳ Ｐゴシック','MS PGothic',sans-serif;
  color:#303030;
  line-height:1.5em;
}

@media screen and (min-width:750px){
  .lpbox , #lpfooter {
    font-size: 28px;
    max-width: 750px;
    margin: 0 auto;
  }
  .lpbox .container .register__number {
    font-size: 6.38em;
  }
}
.lpbox a , #lpfooter a{
  color: inherit;
  text-decoration: none;
  font-size: inherit;
  font-weight: inherit;
}
.lpbox a:hover, #lpfooter a:hover{
  text-decoration: underline;
}
.lpbox span, #lpfooter span {
  font-size: inherit;
  font-weight: inherit;
}
.lpbox img ,
#lpfooter img {
  width: 100%;
  height: auto;
  display: block;
  margin-left: auto;
  margin-right: auto;
  vertical-align: bottom;
}
.lpbox img.img-t ,
#lpfooter img.img-t {
  vertical-align: top;
}
/* cart css reset */

.lpbox header ,
.lpbox h1 ,
.lpbox h2 ,
.lpbox h3 ,
.lpbox p ,
.lpbox dl ,
.lpbox dt ,
.lpbox dd ,
.lpbox div ,
.lpbox section ,
.lpbox span {
  border: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  background: none;
  box-sizing: border-box;
  padding: 0;
  margin: 0 auto;
}
#lpfooter footer ,
#lpfooter div,
#lpfooter p {
  border: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  background: none;
  box-sizing: border-box;
  padding: 0;
  margin: 0 auto;
}
#lpfooter ul,
#lpfooter li {
  border: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  background: none;
  box-sizing: border-box;
  padding: 0;
  margin: 0 auto;
  list-style: none;
}
/* ▼ココから */
/*-------------------------------------------
fv
---------------------------------------------*/
.lpbox .fv__box {
  position: relative;
  overflow: hidden;
}
.lpbox .fv__box__btn {
  position: absolute;
  bottom:0;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 92%;
}
.lpbox .fv__ic {
  position: absolute;
  margin: 0 auto;
  top: 26%;
  left: 0;
  right: 0;
  width: 92%;
}


/* ----------------------------------------
グラフ
---------------------------------------- */
.lpbox .trouble__graph {
  position: relative;
}
.lpbox .trouble__graph__item svg {
  width: 88%;
  height: auto;
  display: block;
  margin: 0 auto;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
}
.lpbox .trouble__graph__layer {
  position: absolute;
  top: 9.5%;
  left: 0;
  right: 0;
  width: 72%;
}
.lpbox .trouble__graph__insomnia {
  position: absolute;
  bottom: 24%;
  left: 0;
  right: 0;
  width: 72%;
}


/* ----------------------------------------
クロージングのボタン
---------------------------------------- */
.lpbox .opd__box,.lpbox .treatment__box{
  position: relative;
}
.lpbox .opd__btn,.lpbox .treatment__btn{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 94.37%;
}


/*-------------------------------------------
カウントアップ
-----------------------------------------------*/
.lpbox .register {
  position: relative;
}
.lpbox .register__number {
  position: absolute;
  letter-spacing: 0.05em;
  bottom: 39.7%;
  right: 10%;
  font-size: 6em;
  color: #c74343;
  font-weight: bold;
  font-family: "Noto Sans JP";
}

/*-------------------------------------------
フローティング
---------------------------------------------*/
.lpbox #fixbtn {
  position: fixed;
  bottom: -100%;
  left: 0;
  z-index: 999;
  width: 100%;
  overflow: hidden;
  -webkit-transition: all .8s ease;
  -o-transition: all .8s ease;
  transition: all .8s ease;
}
.lpbox #fixbtn.fixbtn--visible {
  bottom: -2%;
}
.lpbox #fixbtn .fixbtn__box {
  position: relative;
  bottom: 0;
  display: block;
  margin: 0 auto;
  position: relative;
  max-width: 750px;
  padding: 0 2% 0 2%;
}
.lpbox .fixbtn__item a {
  box-sizing: border-box;
  display: block;
  width: 100%;
}

/* -------------------------------------------
プランコンテンツ
----------------------------------------------- */
.lpbox .plan{
  background: url(../img/plan_bg.png) repeat top center;
  text-align: center;
}
.lpbox .plan__ttl{
  padding-bottom: 7%;
}
.lpbox .plan__about{
  width: 92%;
  padding-bottom: 10%;
}
.lpbox .plan__check{
  width: 94.67%;
  padding-bottom: 7%;
}
.lpbox .plan__select__ttl{
  width: 77.33%;
  padding: 3% 0;
}
.lpbox .plan__select__txt{
  width: 92%;
  padding-bottom: 3%;
  text-align: justify;
  font-size: 0.929em;
  line-height: 1.9em;
  font-weight: 400;
  letter-spacing: 0.05em;
  color: #383838;
}
.lpbox .plan__select__txt a{
  text-decoration: underline;
}
.lpbox .plan__select__ic{
  width: 92%;
  padding-bottom: 10%;
}



/* -------------------------------------------
アコーディオン
----------------------------------------------- */
.lpbox .plan__item {
  box-sizing: border-box;
  display: block;
  width: 94.67%;
  padding-bottom: 4%;
}
.lpbox .plan__item--btn {
  display: block;
  position: relative;
  cursor: pointer;
}
.lpbox .plan__item--btn:before {
  content: "";
  background: url(../img/webp/ar.webp) no-repeat 50% 50%;
  -webkit-background-size: 100% auto;
  background-size: 100% auto;
  box-sizing: border-box;
  display: block;
  position: absolute;
  top: 48%;
  right: 1.05em;
  width: 1.1em;
  height: 0.6em;
  -webkit-transition: all .5s ease;
  -o-transition: all .5s ease;
  transition: all .5s ease;
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
  opacity: 1;
}
.lpbox .plan__item--btn.plan__item--open:before {
  content: "";
  -webkit-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
}



/*----------------------------------------*/
.lpbox .qa{
  background-color: #eff6ff;
  padding-bottom: 5%;
}
.lpbox .qa__item {
  box-sizing: border-box;
  display: block;
  padding-bottom: 5%;
}
.lpbox .qa__item--q {
  display: block;
  position: relative;
  cursor: pointer;
}
.lpbox .qa__item--q:before {
  content: "";
  background: url(../img/webp/ar.webp) no-repeat 50% 50%;
  -webkit-background-size: 100% auto;
  background-size: 100% auto;
  box-sizing: border-box;
  display: block;
  position: absolute;
  top: 45%;
  right: 2.5em;
  width: 1.4em;
  height: .8em;
  -webkit-transition: all .5s ease;
  -o-transition: all .5s ease;
  transition: all .5s ease;
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
  opacity: 1;
}
.lpbox .qa__item--q.qa__item--open:before {
  content: "";
  -webkit-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
}
.lpbox .qa__item--a {
  width: 92%;
  text-align: justify;
  font-size: 0.929em;
  line-height: 1.9em;
  font-weight: 400;
  padding-top: 2%;
  letter-spacing: 0.1em;
  color: #383838;
}
.lpbox .qa__item--a a{
  text-decoration: underline;
}

/*-------------------------------------------
animation
-----------------------------------------------*/
.lpbox .anim {
  overflow: hidden;
  position: relative;
}
.lpbox .animitem {
  display: block;
  -webkit-transition: all 1.2s ease;
  -o-transition: all 1.2s ease;
  transition: all 1.2s ease;
}
.lpbox .fadein {
  display: block;
  -webkit-transition: all 1s ease;
  -o-transition: all 1s ease;
  transition: all 1s ease;
  -webkit-transform: translate3d(0,0,0);
  -ms-transform: translate3d(0,0,0);
  -o-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
  opacity: 1;
}
.lpbox .animhide .fadein {
  -webkit-transform: translate3d(0,30%,0);
  -ms-transform: translate3d(0,30%,0);
  -o-transform: translate3d(0,30%,0);
  transform: translate3d(0,30%,0);
  opacity: 0;
}


/*-------------------------------------------
footer
-----------------------------------------------*/
#lpfooter .footer__logo{
  text-align: center;
  width: 68.97%;
  margin: 0% auto 8% auto;
}
#lpfooter .footer__link {
  text-align: center;
  margin-bottom: 8%;
  color: #383838;
  letter-spacing: 0.1em;
}
#lpfooter .footer__link li{
  font-size: 0.929em;
  margin-bottom: 1em;
  font-weight: normal;
}
#lpfooter .footer__link li:after {
  content: "＞";
  font-weight: bold;
  display: inline-block;
  vertical-align: middle;
  margin: 0 0 0.5% 2%;
}
#lpfooter #copy {
  text-align: center;
  font-size: 0.714em;
  color: #fff;
  background-color: #40a6ac;
  padding: 2% 0;
}
/*-------------------------------------------
ボタンアニメーション
-----------------------------------------------*/
.swing {
  -webkit-animation-name: swing;
  -moz-animation-name: swing;
  -o-animation-name: swing;
  animation-name: swing;
  -webkit-animation-duration: 1.7s;
  -moz-animation-duration: 1.7s;
  -o-animation-duration: 1.7s;
  animation-duration: 1.7s;
  -webkit-animation-timing-function: ease;
  -moz-animation-timing-function: ease;
  -o-animation-timing-function: ease;
  animation-timing-function: ease;
  -webkit-animation-iteration-count: infinite;
  -o-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}
@-webkit-keyframes swing {
  from, 0% {
    -webkit-transform: translate3d( 0, 0, 0);
    -ms-transform: translate3d( 0, 0, 0);
    -o-transform: translate3d( 0, 0, 0);
    transform: translate3d( 0, 0, 0);
  }
  10% {
    -webkit-transform: translate3d( 0, 0, 0);
    -ms-transform: translate3d( 0, 0, 0);
    -o-transform: translate3d( 0, 0, 0);
    transform: translate3d( 0, 0, 0);
  }
  20% {
    -webkit-transform: translate3d( -2%, 0, 0);
    -ms-transform: translate3d( -2%, 0, 0);
    -o-transform: translate3d( -2%, 0, 0);
    transform: translate3d( -2%, 0, 0);
  }
  30% {
    -webkit-transform: translate3d( 2%, 0, 0);
    -ms-transform: translate3d( 2%, 0, 0);
    -o-transform: translate3d( 2%, 0, 0);
    transform: translate3d( 2%, 0, 0);
  }
  40% {
    -webkit-transform: translate3d( -2%, 0, 0);
    -ms-transform: translate3d( -2%, 0, 0);
    -o-transform: translate3d( -2%, 0, 0);
    transform: translate3d( -2%, 0, 0);
  }
  50% {
    -webkit-transform: translate3d( 2%, 0, 0);
    -ms-transform: translate3d( 2%, 0, 0);
    -o-transform: translate3d( 2%, 0, 0);
    transform: translate3d( 2%, 0, 0);
  }
  60% {
    -webkit-transform: translate3d( -2%, 0, 0);
    -ms-transform: translate3d( -2%, 0, 0);
    -o-transform: translate3d( -2%, 0, 0);
    transform: translate3d( -2%, 0, 0);
  }
  70% {
    -webkit-transform: translate3d( 2%, 0, 0);
    -ms-transform: translate3d( 2%, 0, 0);
    -o-transform: translate3d( 2%, 0, 0);
    transform: translate3d( 2%, 0, 0);
  }
  80% {
    -webkit-transform: translate3d( 0, 0, 0);
    -ms-transform: translate3d( 0, 0, 0);
    -o-transform: translate3d( 0, 0, 0);
    transform: translate3d( 0, 0, 0);
  }
  to, 100% {
    -webkit-transform: translate3d( 0, 0, 0);
    -ms-transform: translate3d( 0, 0, 0);
    -o-transform: translate3d( 0, 0, 0);
    transform: translate3d( 0, 0, 0);
  }
}
@keyframes swing {
  from, 0% {
    -webkit-transform: translate3d( 0, 0, 0);
    -ms-transform: translate3d( 0, 0, 0);
    -o-transform: translate3d( 0, 0, 0);
    transform: translate3d( 0, 0, 0);
  }
  10% {
    -webkit-transform: translate3d( 0, 0, 0);
    -ms-transform: translate3d( 0, 0, 0);
    -o-transform: translate3d( 0, 0, 0);
    transform: translate3d( 0, 0, 0);
  }
  20% {
    -webkit-transform: translate3d( -2%, 0, 0);
    -ms-transform: translate3d( -2%, 0, 0);
    -o-transform: translate3d( -2%, 0, 0);
    transform: translate3d( -2%, 0, 0);
  }
  30% {
    -webkit-transform: translate3d( 2%, 0, 0);
    -ms-transform: translate3d( 2%, 0, 0);
    -o-transform: translate3d( 2%, 0, 0);
    transform: translate3d( 2%, 0, 0);
  }
  40% {
    -webkit-transform: translate3d( -2%, 0, 0);
    -ms-transform: translate3d( -2%, 0, 0);
    -o-transform: translate3d( -2%, 0, 0);
    transform: translate3d( -2%, 0, 0);
  }
  50% {
    -webkit-transform: translate3d( 2%, 0, 0);
    -ms-transform: translate3d( 2%, 0, 0);
    -o-transform: translate3d( 2%, 0, 0);
    transform: translate3d( 2%, 0, 0);
  }
  60% {
    -webkit-transform: translate3d( -2%, 0, 0);
    -ms-transform: translate3d( -2%, 0, 0);
    -o-transform: translate3d( -2%, 0, 0);
    transform: translate3d( -2%, 0, 0);
  }
  70% {
    -webkit-transform: translate3d( 2%, 0, 0);
    -ms-transform: translate3d( 2%, 0, 0);
    -o-transform: translate3d( 2%, 0, 0);
    transform: translate3d( 2%, 0, 0);
  }
  80% {
    -webkit-transform: translate3d( 0, 0, 0);
    -ms-transform: translate3d( 0, 0, 0);
    -o-transform: translate3d( 0, 0, 0);
    transform: translate3d( 0, 0, 0);
  }
  to, 100% {
    -webkit-transform: translate3d( 0, 0, 0);
    -ms-transform: translate3d( 0, 0, 0);
    -o-transform: translate3d( 0, 0, 0);
    transform: translate3d( 0, 0, 0);
  }
}
