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

body{
	width: 100%;
	margin: 0 auto;
    font-size: 14px;
    font-size: 2.8vw;
}

img{
    line-height: 0;
	width: 100%;
	margin: 0 auto;
}

div.wrap{
	line-height: 0;
	width: 100%;
	max-width: 1000px;
	margin: 0 auto;
    padding-top:0;
    overflow:hidden;
}


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

@media screen and (min-width:1000px){
#lpfooter {
    font-size: 28px;
    max-width: 1000px;
    width: 100%;
    margin: 0 auto;
  }
}

#lpfooter a{
    color: inherit;
    text-decoration: none;
    font-size: inherit;
    font-weight: inherit;
}

#lpfooter a:hover{
    text-decoration: underline;
}
#lpfooter span {
    font-size: inherit;
    font-weight: inherit;
}
#lpfooter img {
    width: 100%;
    height: auto;
    display: block;
    margin-left: auto;
    margin-right: auto;
    vertical-align: bottom;
}
#lpfooter img.img-t {
    vertical-align: top;
}

#lpfooter .lpfooter__logo {
    width: 75%;
    margin: 0 auto 3em;
}
#lpfooter .footer__link {
    text-align: left;
    margin-top: 3em;
    margin-bottom: 4em;
    display: block;
    box-sizing: border-box;
    padding: 2.66% 0;
    max-width: 1000px;
    margin: 0 auto;
}
#lpfooter .footer__link li{
    font-size: 1.66em;
    margin-bottom: 1.5em;
    box-sizing: border-box;
    padding-left: 3.5em;
    background: url("https://d2w53g1q050m78.cloudfront.net/yblstorenet/uploads/fuwalyslim/img/webp/footer_ic.webp") no-repeat 0% 50%;
    -webkit-background-size: auto 1em;
    background-size: auto 1em;
}
#lpfooter #copy {
    text-align: center;
    font-size: .82em;
    color: #fff;
    padding: 1em 0;
    background: url("https://d2w53g1q050m78.cloudfront.net/yblstorenet/uploads/fuwalyslim/img/webp/footer_bg.webp") no-repeat top center;
    -webkit-background-size: cover;
    background-size: cover;
}


.submit_bottom_ec,
.submit_button_complete_ec{
    background: url("https://d2w53g1q050m78.cloudfront.net/yblstorenet/uploads/fuwalyslim/img/submit_btn.png") center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 100%;
    max-width:628px;
	height: 174px;
}

.submit_bottom_sp_ec,
.submit_button_complete_sp_ec{
    background: url("https://d2w53g1q050m78.cloudfront.net/yblstorenet/uploads/fuwalyslim/img/submit_btn.png") center;
    background-size: contain;
    background-repeat: no-repeat;
    max-width: 628px;
    width: 100%;
    margin:0 auto;
}

/*----------------------------------------*/
.lpbox .starrysky {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    width: 100%;
}

.lpbox .starrysky__inner {
    position: relative;
    display: block;
    width: 100%;
    height: 0;
    max-width: 1000px;
    margin: 0 auto;
    padding-bottom: 100%;
    overflow: hidden;
}

.lpbox .starrysky__item--01 {
    position: absolute;
    top: 30%;
    left: 17%;
    width: 3%;
    z-index: 3;
    -webkit-animation-name: meimetsu2;
    -moz-animation-name: meimetsu2;
    -o-animation-name: meimetsu2;
    animation-name: meimetsu2;
    -webkit-animation-duration: 2s;
    -moz-animation-duration: 2s;
    -o-animation-duration:2s;
    animation-duration: 2s;
    -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;
    opacity: 0;
}

.lpbox .starrysky__item--02 {
    position: absolute;
    top: 5%;
    right: 2%;
    width: 7.1%;
    z-index: 3;
    -webkit-animation-name: meimetsu2;
    -moz-animation-name: meimetsu2;
    -o-animation-name: meimetsu2;
    animation-name: meimetsu2;
    -webkit-animation-duration: 2s;
    -moz-animation-duration: 2s;
    -o-animation-duration:2s;
    animation-duration: 2s;
    -webkit-animation-delay: .4s;
    -o-animation-delay: .4s;
    animation-delay: .4s;
    -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;
    opacity: 0;
}
.lpbox .starrysky__item--03 {
    position: absolute;
    top: 8%;
    left: 5%;
    width: 7.1%;
    z-index: 3;
    -webkit-animation-name: meimetsu2;
    -moz-animation-name: meimetsu2;
    -o-animation-name: meimetsu2;
    animation-name: meimetsu2;
    -webkit-animation-duration: 2s;
    -moz-animation-duration: 2s;
    -o-animation-duration:2s;
    animation-duration: 2s;
    -webkit-animation-delay: .3s;
    -o-animation-delay: .3s;
    animation-delay: .3s;
    -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;
    opacity: 0;
}

.lpbox .starrysky__shootingstar {
    position: absolute;
    top: 23%;
    right: -13%;
    z-index: 3;
    --animindex: 0;
}

.lpbox .starrysky__shootingstarbox {
    position: relative;
    width: 8em;
    height: 2em;
    display: block;
    -webkit-transform: rotate(-43deg);
    -ms-transform: rotate(-43deg);
    -o-transform: rotate(-43deg);
    transform: rotate(-43deg);
}

.lpbox .starrysky__shootingstaritem {
    position: absolute;
    top: 0;
    left: 0;
    width: 2em;
    height: 2em;
    z-index: 2;
    -webkit-animation-name: shootingstar1;
    -moz-animation-name: shootingstar1;
    -o-animation-name: shootingstar1;
    animation-name: shootingstar1;
    -webkit-animation-duration: 1.4s;
    -moz-animation-duration: 1.4s;
    -o-animation-duration:1.4s;
    animation-duration: 1.4s;
    -webkit-animation-delay: calc(.8s * var(--animindex));
    -o-animation-delay: calc(.8s * var(--animindex));
    animation-delay: calc(.8s * var(--animindex));
    -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;
}

.lpbox .starrysky__shootingstaritem:after {
    content: "";
    width: 6.5em;
    height: 2px;
    background-color: #fff;
    display: block;
    position: absolute;
    top: calc(50% - 1px);
    left: 1em;
    z-index: 2;
    filter: blur(0.2em);
    -webkit-animation-name: shootingstar2;
    -moz-animation-name: shootingstar2;
    -o-animation-name: shootingstar2;
    animation-name: shootingstar2;
    -webkit-animation-duration: 1.4s;
    -moz-animation-duration: 1.4s;
    -o-animation-duration:1.4s;
    animation-duration: 1.4s;
    -webkit-animation-delay: calc(.8s * var(--animindex));
    -o-animation-delay: calc(.8s * var(--animindex));
    animation-delay: calc(.8s * var(--animindex));
    -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;
}


.lpbox .starrysky__shootingstaritem:before {
  content: "";
  width: 6em;
  height: 1px;
  background-color: #fff;
  display: block;
  position: absolute;
  top: calc(50% - 0.5px);
  left: 1em;
  z-index: 1;
  opacity: 0.6s;
  -webkit-animation-name: shootingstar2;
  -moz-animation-name: shootingstar2;
  -o-animation-name: shootingstar2;
  animation-name: shootingstar2;
  -webkit-animation-duration: 1.4s;
  -moz-animation-duration: 1.4s;
  -o-animation-duration:1.4s;
  animation-duration: 1.4s;
  -webkit-animation-delay: calc(.8s * var(--animindex));
  -o-animation-delay: calc(.8s * var(--animindex));
  animation-delay: calc(.8s * var(--animindex));
  -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;
}


.blink01{
  -webkit-animation-name: meimetsu2;
  -moz-animation-name: meimetsu2;
  -o-animation-name: meimetsu2;
  animation-name: meimetsu2;
  -webkit-animation-duration: 2s;
  -moz-animation-duration: 2s;
  -o-animation-duration:2s;
  animation-duration: 2s;
  -webkit-animation-delay: .4s;
  -o-animation-delay: .4s;
  animation-delay: .4s;
  -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;
  opacity: 0;
}

 .blink02 {
  -webkit-animation-name: meimetsu2;
  -moz-animation-name: meimetsu2;
  -o-animation-name: meimetsu2;
  animation-name: meimetsu2;
  -webkit-animation-duration: 2s;
  -moz-animation-duration: 2s;
  -o-animation-duration:2s;
  animation-duration: 2s;
  -webkit-animation-delay: .1s;
  -o-animation-delay: .1s;
  animation-delay: .1s;
  -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;
  opacity: 0;
}

@keyframes rumble {
    0%   { transform:translate(0); }
    25%  { transform:translate(2px); }
    50%  { transform:translate(0); }
    75%  { transform:translate(-2px); }
    100% { transform:translate(0); }
}
 
.bulbul {
    animation:rumble 0.2s linear infinite;
}


