@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: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', 'Mayryo', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
  color: #303030;
  line-height: 1.5em;
  overflow: hidden;
}

@media screen and (min-width:780px) {
  .lpbox,
  #lpfooter {
    font-size: 28px;
    max-width: 780px;
    margin: 0 auto;
  }
  .lpbox .container .item {
    width: 14%;
    text-align: center;
  }

  .lpbox .fv__box .fv_makimono img {
    height: 18.45em;
  }

  .lpbox .partner .partner__box__img02_01 {
    position: absolute;
    top: 8em;
    left: 2.7em;
    width: 6.5%;
  }
  .lpbox .partner .partner__box__img02_02 {
    position: absolute;
    top: 11.5em;
    left: 2.7em;
    width: 19.9%;
  }

  .lpbox .partner .partner__box__img03_01 {
    position: absolute;
    top: 4em;
    right: 2.7em;
    width: 4.4%;
  }
  .lpbox .partner .partner__box__img03_02 {
    position: absolute;
    top: 11.2em;
    right: 4.3em;
    width: 8.1%;
  }

  .lpbox .partner .partner__box__img04_01 {
    position: absolute;
    top: 16em;
    right: 2.3em;
    width: 6.4%;
  }
  .lpbox .partner .partner__box__img04_02 {
    position: absolute;
    top: 21.8em;
    right: 4.0em;
    width: 24%;
  }

  .lpbox .partner .partner__box__img05_01 {
    position: absolute;
    top: 19em;
    left: 2.7em;
    width: 6.4%;
  }
  .lpbox .partner .partner__box__img05_02 {
    position: absolute;
    top: 21.5em;
    left: 4.5em;
    width: 8%;
  }
}

.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,
.lpbox ul,
.lpbox li {
  border: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  background: none;
  box-sizing: border-box;
  padding: 0;
  margin: 0 auto;
  list-style: none;
}


/* ----------------------------------------------- */


/* Loading背景画面設定　*/
#loading ,#loading02{
  /*fixedで全面に固定*/
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 9999;
  background:#333;
  text-align:center;
  color:#fff;
}

/* Loading画像中央配置　*/
#loading_movie{
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  /*縦横幅指定*/
  width: 177.77777778vh; /* 16:9 の幅→16 ÷ 9＝ 177.77% */
  height: 56.25vw; /* 16:9の幅 → 9 ÷ 16 = 56.25% */
  min-height: 100%;
  min-width: 100%;
}
#loading_movie video{
  width: 100%;
  height: 100%;
}
#loading_movie02{
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  /*縦横幅指定*/
  width: 177.77777778vh; /* 16:9 の幅→16 ÷ 9＝ 177.77% */
  height: 56.25vw; /* 16:9の幅 → 9 ÷ 16 = 56.25% */
  min-height: 100%;
  min-width: 100%;
}
#loading_movie02 video{
  width: 100%;
  height: 100%;;
}





.lpbox .metal {
  display: none;
}
.lpbox .fv__box {
  position: relative;
}
.lpbox .fv__box__img {
  position: absolute;
  top: 6em;
  left: -40%;

  width: 180%;
  z-index: 1;
}
.lpbox .happy {
  position: absolute;
  top: 4em;
  left: 0;
  right: 0;
  width: 52%;
  z-index: 1;
  padding: 3%;
  overflow: hidden;
}
.sakura {
	display: flex;
	justify-content: center;
	align-items: center;  
}
.sakura li {

	width: .8em;
	position: absolute;
	list-style: none;
	top: 0;
	animation: fall 4s linear infinite, rotate1 2s ease-in-out infinite alternate;
}
@keyframes fall {
	to {
		top: 120%;
	}
}
@keyframes rotate1 {
	from {
		transform: translateX(0px) rotate(0deg);
	}
	to {
		transform: translateX(200px) rotate(-80deg) rotateX(180deg);
	}
}
@keyframes rotate2 {
	from {
		transform: translateX(200px) rotate(-45deg);
	}
	to {
		transform: translateX(0px) rotate(0deg);
	}
}
.sakura li:nth-child(1) {
	left: 0;
	animation: fall 10s linear infinite, rotate1 3s ease-in-out infinite alternate;
}
.sakura li:nth-child(2) {
	left: 1vw;
	animation: fall 15s linear infinite, rotate1 2s ease-in-out infinite alternate;
}
.sakura li:nth-child(3) {
	left: 2vw;
	animation: fall 9s linear infinite, rotate1 3.5s ease-in-out infinite alternate;
}
.sakura li:nth-child(4) {
	left: 3vw;
	animation: fall 8s linear infinite, rotate2 4s ease-in-out infinite alternate;
}
.sakura li:nth-child(5) {
	left: 4vw;
	animation: fall 10s linear infinite, rotate1 4s ease-in-out infinite alternate;
}
.sakura li:nth-child(6) {
	left: 5vw;
	animation: fall 11s linear infinite, rotate2 3s ease-in-out infinite alternate;
}
.sakura li:nth-child(7) {
	left: 6vw;
	animation: fall 7s linear infinite, rotate2 3.5s ease-in-out infinite alternate;
}
.sakura li:nth-child(8) {
	left: 7vw;
	animation: fall 7s linear infinite, rotate1 3s ease-in-out infinite alternate;
}
.lpbox .fv__metal .fv__box__img {
  top: 8em;
}
.lpbox .fv__box__mode_n {
  position: absolute;
  top: 6em;
  right: 0;

  width: 28.6%;
  z-index: 2;
}
.lpbox .fv__box__mode_h {
  position: absolute;
  top: 6.5em;
  right: 0;

  width: 26%;
  z-index: 2;
}
.lpbox .fv__box__makimono {
  position: absolute;
  top: 0;
  right: 0;
  padding: 0 1em 0 0;
  z-index: 2;
  display: flex;
  max-width: 750px;
  width: 100%;
  margin: auto;
  overflow-x: scroll;

  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  /*IE(Internet Explorer)・Microsoft Edgeへの対応*/
  -ms-overflow-style: none;
  /*Firefoxへの対応*/
  scrollbar-width: none;
}
/*Google Chrome、Safariへの対応*/
.contents_box::-webkit-scrollbar{
  display: none;
}

.lpbox .fv_makimono {
  opacity: 1;
  width: 190%;
  padding: 8px;
  flex-shrink: 0;
  list-style: none;
  cursor:pointer;
}
.lpbox .fv_makimono img {
  height: 20.75em;
}
.lpbox .fv__scroll {
  position: absolute;
  bottom: -1em;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 46.7%;
  z-index: 2;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  animation-duration: 1.5s;
  animation-name: anim_h;
}
@keyframes anim_h {
  0% {
    transform: translate(-3%, 0);
  }
  100% {
    transform: translate(3%, 0);
  }
}

.lpbox .fv__box .fv__box__btn {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 95.5%;
  z-index: 2;
}

.lpbox .happy_new_year__box {
  position: relative;
}
.lpbox .happy_new_year__box__text01 {
  position: absolute;
  top: 5em;
  left: 3em;
  width: 50%;
}
.lpbox .happy_new_year__box__text02 {
  position: absolute;
  top: 4em;
  right: 2em;
  width: 43%;
}
.lpbox .happy_new_year__box__text03 {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  margin: 0 auto;
  width: 83.2%;
}
.lpbox .happy_new_year__box__text04 {
  position: absolute;
  top: 0;
  right: 0;
  width: 96.6%;
}
.lpbox .happy_new_year__box__btn {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  margin: 0 auto;
  width: 80.1%;
}

.lpbox .play_back__box {
  position: relative;
}
.lpbox .play_back__box__img01 {
  position: absolute;
  bottom: 4em;
  left: 0;
  width: 28.9%;
}

.lpbox .play_back__box__insta {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: 0 auto;

  width: 38.3%;
  height: 40%;
  background:url('../img/insta.png') no-repeat;
  background-size: 100%;
}

.lpbox .play_back__box__insta:hover{
  width: 38.3%;
  height: 40%;
  background:url('../img/insta_hover.png') no-repeat;
  background-size: 100%;
}

.lpbox .play_back__box__img03 {
  position: absolute;
  bottom: -2.5em;
  right: 0;
  width: 43.2%;

  z-index: 1;
}

.lpbox .play_back__box__img04 {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 35.4%;
}
.lpbox .play_back__box__img05 {
  position: absolute;
  top: 0;
  right: 0;
  width: 47.2%;
}
.lpbox .play_back__box__img06 {
  position: absolute;
  top: 0;
  left: 0;
  width: 50.3%;
}
.lpbox .play_back__box__img07 {
  position: absolute;
  bottom: 3em;
  right: 0;
  width: 38.25%;
}

.lpbox .partner__box {
  position: relative;
}
.lpbox .partner__box__img01 {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 81.3%;
}

.lpbox .partner__box__img02 {
  position: absolute;
  top: -1.5em;
  left: 0;
  width: 56.8%;
  z-index: 1;
}
.lpbox .partner__box__img02_01 {
  position: absolute;
  top: 8.5em;
  left: 2.7em;
  width: 6.5%;
}
.lpbox .partner__box__img02_02 {
  position: absolute;
  top: 12.5em;
  left: 2.7em;
  width: 19.9%;
}
.lpbox .partner__box__img03 {
  position: absolute;
  top: .6em;
  right: 2.8em;
  width: 52.5%;
}
.lpbox .partner__box__img03_01 {
  position: absolute;
  top: 4.3em;
  right: 2.7em;
  width: 4.4%;
}
.lpbox .partner__box__img03_02 {
  position: absolute;
  top: 12.3em;
  right: 4.3em;
  width: 8.1%;
}

.lpbox .partner__box__img04 {
  position: absolute;
  bottom: -1em;
  right: 0;
  width: 68%;
  z-index: 1;
}
.lpbox .partner__box__img04_01 {
  position: absolute;
  top: 18em;
  right: 2.6em;
  width: 6.4%;
}
.lpbox .partner__box__img04_02 {
  position: absolute;
  top: 24.3em;
  right: 4.5em;
  width: 24%;
}

.lpbox .partner__box__img05 {
  position: absolute;
  bottom: 1.5em;
  left: 1.5em;
  width: 49.8%;
}
.lpbox .partner__box__img05_01 {
  position: absolute;
  top: 21.5em;
  left: 2.7em;
  width: 6.4%;
}
.lpbox .partner__box__img05_02 {
  position: absolute;
  top: 24.3em;
  left: 4.5em;
  width: 8%;
}


.lpbox .partner__box__img06 {
  position: absolute;
  top: 0em;
  left: 0;
  width: 37.75%;
}
.lpbox .partner__box__img07 {
  position: absolute;
  bottom: 3em;
  right: 0;
  width: 38.1%;
}

.lpbox .thanks__box {
  position: relative;
}
.lpbox .thanks__box__nenga {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 97.9%;
}
.lpbox .thanks__box__btn {
  position: absolute;
  bottom: .5em;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 95.5%;
}
/*-------------------------------------------
footer
-----------------------------------------------*/
#lpfooter .footer__link {
  text-align: center;
  margin-top: 3em;
  margin-bottom: 2em;
}
#lpfooter .footer__link li{
  font-size: 1em;
  margin-bottom: 1em;
}
#lpfooter #copy {
  text-align: center;
  font-size: .75em;
  color: #000007;
  box-sizing: border-box;
  padding: .5em;
}



/* pc */
.pcnav__left ,.pcnav__right ,.wave ,.fv-wave ,.fv-wave-kabuse{
  display: none;
}

@media screen and (min-width:750px){
  .wave {
    display: block;

    width: 100%;
    position: fixed;
    bottom: 0;
    right: 0;
    left: 0;
    margin: 0 auto;
    text-align: center;

    z-index: 999;
  }
  .lpbox {
    border: .3em solid #000;
    z-index: 3;
  }
  .lpbox .fv__cta:hover{
    opacity: 0.8;
  }
  .lpbox .end__cta:hover{
    opacity: 0.8;
  }
  .spitem {
    display: none;
  }
  .pcitem {
    display: block;
  }
  .lpbox , #lpfooter {
    font-size: 18px;
    margin: 2em auto;
  }

  .pcdevice__cover {
    padding: 3em 0;

  }
  .pcdevice {
    display: block;
    height: 51.9em;
    position: relative;
    overflow: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
    margin: 0 auto;
    box-sizing: border-box;
    width: 100%;
    border: .3em solid #000;
  }

  .pccover {
    position: relative;
    background: url("../img/img_pc.jpg");
    background-size: cover;
    background-attachment: fixed;

    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -ms-align-items: stretch;
    align-items: stretch;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    flex-direction: row-reverse;
  }
  .fv-bg {
    position: fixed;
    top: 10em;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 1;
  }
  .fv-bg-list {
    margin: 0 auto;
    transition: all 1s ease;
    height: 1100px;
    display: block;
    background-image: url(../img/cloud.png);
    background-repeat: repeat-x;
    background-position: 0px 0px;
    -webkit-animation-name: bgloop;
    -o-animation-name: bgloop;
    animation-name: bgloop;
    -webkit-animation-duration: 60s;
    -o-animation-duration: 60s;
    animation-duration: 60s;
    -webkit-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -o-animation-timing-function: linear;
    animation-timing-function: linear;

  }

  .fv-solar {
    position: fixed;
    top: 0;
    right: 0;
    width: 45%;
    height: 50em;
    overflow: hidden;
    z-index: 1;

  }
  .fv-solar-img {
    height: 50em;
    margin: 0 auto;
    display: block;
    background-image: url(../img/solar.png);
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: 0px 0px;
  }
   .fv-logo {
    position: fixed;
    top: 2.3vw;
    right: 3vw;
    width: 10vw;
    height: 5vw;
    overflow: hidden;
    z-index: 1;
  }
  .fv-logo-img {
    height: 5vw;
    margin: 0 auto;
    display: block;
    background-image: url(../img/fv_logo.png);
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: 0px 0px;
  }

  .fv-wave {
    display: block;
    position: fixed;
    bottom: -2%;
    width: 100%;
  }
  .fv-wave img {
    width: 100%;
  }
  .fv-wave-kabuse {
    display: block;
    position: fixed;
    bottom: -1.5%;
    margin: 0 auto;
    text-align: center;
    width: 100%;
    z-index: 99;
  }
  .fv-wave-kabuse img {
    width: 100%;
    max-width: 649px;
  }

  @-webkit-keyframes bgloop {
    from , 0% {
      background-position: 0px 0px;
    }
    to , 100% {
      background-position: 2000px 0;
    }
  }
  @keyframes bgloop {
    from , 0% {
      background-position: 0px 0px;
    }
    to , 100% {
      background-position: 2000px 0;
    }
  }

  .pcbox {
    width: 500px;
    background-color: #fff;
    position: relative;
    z-index: 10;
  }
  .pcside {
    display: block;
    width: calc(100% - 500px);
    position: relative;
  }
  .pcnav__left {
    display: flex;
    gap: 40px 0;
    flex-direction: column;
    align-items: end;
    justify-content: flex-end;
    height: 100%;
    flex: 1;
    flex-shrink: 0;
    overflow: hidden;
    position: sticky;
    top: 7%;
    z-index: 9;
  }
  .pcnav__right {
    display: flex;
    gap: 40px 0;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
    height: 100%;
    flex: 1;
    flex-shrink: 0;
    overflow: hidden;
    position: sticky;
    bottom: 7%;

    z-index: 9;
  }
  .pcnav__right .pcnav__right02{
    position: fixed;
    padding-left: 5%;
    bottom: 2em;
    margin: 0;
  }
  .pcnav__left .pcnav__left-box01 {


  }
  .pcnav__left .pcnav__left-box02 {
    position: fixed;
    padding-left: 5%;
    bottom: 2em;
    margin: 0;

    padding: 7% 10% 15% 10%;
  }
  .pcnav__right .pcnav__right-box01 img{
    width: clamp(50px, 17vw, 160px);
  }
  .pcnav__right .pcnav__right-box02 img{
    width: clamp(100px, 20vw, 388px);
  }
  .pcnav__left .pcnav__left-box01 img{
    width: clamp(60px, 20vw, 231px);
    margin-right: -5em;
    margin-top: 10em;
  }
  .pcnav__left .pcnav__left-box02 img{
    width: clamp(50px, 17vw, 287px);
  }
  .main {
    max-width: 430px;
    flex-shrink: 0;
    position: relative;
    z-index: 1;
  }

  .pcnav__left-box02 {

  }
  .pcnav__left-box02 .play_back__box__insta {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 auto;

    width: clamp(50px, 17vw, 287px);
    height: 80%;
    background:url('../img/insta.png') no-repeat;
    background-size: 100%;
  }

  .pcnav__left-box02 .play_back__box__insta:hover{
    width: clamp(50px, 17vw, 287px);
    height: 80%;
    background:url('../img/insta_hover.png') no-repeat;
    background-size: 100%;
  }


}

.opv-wrap {
  display: none;
}

video.opv {
  position: fixed;
  top: 0;
  left: 0;
  object-fit: cover;
  width: 100vw;
  height: 100vh;
  vertical-align: bottom;
}

.spitem video.opv {
  position: fixed;
  top: 0;
  left: 0;
  object-fit: cover;
  width: 100vw;
  height: 92vh;
  vertical-align: bottom;
}


/*-------------------------------------------
animation
-----------------------------------------------*/
.lpbox .fadeinup {
  display: block;
  opacity: 1;
  -webkit-transform:translate3d(0,0,0);
  -ms-transform: translate3d(0,0,0);
  -o-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
  -webkit-filter: blur(0);
  -o-filter: blur(0);
  filter: blur(0);
  -webkit-transition-duration: 1.2s;
  -o-transition-duration: 1.2s;
  transition-duration: 1.2s;
  -webkit-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -webkit-transition-timing-function: ease;
  -o-transition-timing-function: ease;
  transition-timing-function: ease;
}
.lpbox .animhide .fadeinup {
  display: block;
  opacity: 0;
  -webkit-transform:translate3d(0,-50%,0);
  -ms-transform: translate3d(0,-50%,0);
  -o-transform: translate3d(0,-50%,0);
  transform: translate3d(0,-50%,0);
  -webkit-filter: blur(0.5em);
  -o-filter: blur(0.5em);
  filter: blur(0.5em);
}
.lpbox .fadein {
  display: block;
  opacity: 1;
  -webkit-transform:translate3d(0,0,0);
  -ms-transform: translate3d(0,0,0);
  -o-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
  -webkit-filter: blur(0);
  -o-filter: blur(0);
  filter: blur(0);
  -webkit-transition-duration: 1.2s;
  -o-transition-duration: 1.2s;
  transition-duration: 1.2s;
  -webkit-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -webkit-transition-timing-function: ease;
  -o-transition-timing-function: ease;
  transition-timing-function: ease;
}
.lpbox .animhide .fadein {
  display: block;
  opacity: 0;
  -webkit-transform:translate3d(0,50%,0);
  -ms-transform: translate3d(0,50%,0);
  -o-transform: translate3d(0,50%,0);
  transform: translate3d(0,50%,0);
  -webkit-filter: blur(0.5em);
  -o-filter: blur(0.5em);
  filter: blur(0.5em);
}

.lpbox .slideleft {
  display: block;
  -webkit-transform: translate3d(0,0,0);
  -ms-transform: translate3d(0,0,0);
  -o-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
  -webkit-transition-duration: 1.2s;
  -o-transition-duration: 1.2s;
  transition-duration: 1.2s;
  -webkit-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -webkit-transition-timing-function: ease;
  -o-transition-timing-function: ease;
  transition-timing-function: ease;
  opacity: 1;
}
.lpbox .animhide .slideleft {
  display: block;
  -webkit-transform: translate3d(-50%,0,0);
  -ms-transform: translate3d(-50%,0,0);
  -o-transform: translate3d(-50%,0,0);
  transform: translate3d(-50%,0,0);
  opacity: 0;
}

.lpbox .slideright {
  display: block;
  -webkit-transform: translate3d(0,0,0);
  -ms-transform: translate3d(0,0,0);
  -o-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
  -webkit-transition-duration: 1.2s;
  -o-transition-duration: 1.2s;
  transition-duration: 1.2s;
  -webkit-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -webkit-transition-timing-function: ease;
  -o-transition-timing-function: ease;
  transition-timing-function: ease;
  opacity: 1;
}
.lpbox .animhide .slideright {
  display: block;
  -webkit-transform: translate3d(50%,0,0);
  -ms-transform: translate3d(50%,0,0);
  -o-transform: translate3d(50%,0,0);
  transform: translate3d(50%,0,0);
  opacity: 0;
}

.lpbox .big {
  display: block;
  transform: scale(1);
  -webkit-animation-name: big;
  -moz-animation-name: big;
  -o-animation-name: big;


  -webkit-animation-duration: 1.2s;
  -moz-animation-duration: 1.2s;
  -o-animation-duration: 1.2s;
  animation-duration: 1.2s;

  animation-iteration-count: 1;
}
.lpbox .animhide .big {
  display: block;

}

@keyframes big {
  0%   {
    transform: scale(1);
  }
  40%  {
    transform: scale(.5);
  }
  70%  {
    transform: scale(1.5);
  }
  100% {
    transform: scale(1);
  }
}




/* bounce */
.bounce {
  -webkit-animation-name: bounce;
  -moz-animation-name: bounce;
  -o-animation-name: bounce;
  animation-name: bounce;
  -webkit-animation-duration: 1.2s;
  -moz-animation-duration: 1.2s;
  -o-animation-duration: 1.2s;
  animation-duration: 1.2s;
  -webkit-animation-timing-function: ease;
  -moz-animation-timing-function: ease;
  -o-animation-timing-function: ease;
  animation-timing-function: ease;
  -webkit-animation-fill-mode: both;
  -o-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-iteration-count: infinite;
  -o-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

@-webkit-keyframes bounce {
  0%   {
    -webkit-transform: scale(1,1)      translate3d(0 , 0 , 0);
    -ms-transform: scale(1,1)      translate3d(0 , 0 , 0);
    -o-transform: scale(1,1)      translate3d(0 , 0 , 0);
    transform: scale(1,1)      translate3d(0 , 0 , 0);
  }
  10%  {
    -webkit-transform: scale(1.05,.95)   translate3d(0 , 0 , 0);
    -ms-transform: scale(1.05,.95)   translate3d(0 , 0 , 0);
    -o-transform: scale(1.05,.95)   translate3d(0 , 0 , 0);
    transform: scale(1.05,.95)   translate3d(0 , 0 , 0);
  }
  30%  {
    -webkit-transform: scale(.95,1.05)   translate3d(0 , -8% , 0);
    -ms-transform: scale(.95,1.05)   translate3d(0 , -8% , 0);
    -o-transform: scale(.95,1.05)   translate3d(0 , -8% , 0);
    transform: scale(.95,1.05)   translate3d(0 , -8% , 0);
  }
  50%  {
    -webkit-transform: scale(1.02,.97) translate3d(0 , 0 , 0);
    -ms-transform: scale(1.02,.97) translate3d(0 , 0 , 0);
    -o-transform: scale(1.02,.97) translate3d(0 , 0 , 0);
    transform: scale(1.02,.97) translate3d(0 , 0 , 0);
  }
  57%  {
    -webkit-transform: scale(1,1)      translate3d(0 , -2% , 0);
    -ms-transform: scale(1,1)      translate3d(0 , -2% , 0);
    -o-transform: scale(1,1)      translate3d(0 , -2% , 0);
    transform: scale(1,1)      translate3d(0 , -2% , 0);
  }
  64%  {
    -webkit-transform: scale(1,1)      translate3d(0 , 0 , 0);
    -ms-transform: scale(1,1)      translate3d(0 , 0 , 0);
    -o-transform: scale(1,1)      translate3d(0 , 0 , 0);
    transform: scale(1,1)      translate3d(0 , 0 , 0);
  }
  100% {
    -webkit-transform: scale(1,1)      translate3d(0 , 0 , 0);
    -ms-transform: scale(1,1)      translate3d(0 , 0 , 0);
    -o-transform: scale(1,1)      translate3d(0 , 0 , 0);
    transform: scale(1,1)      translate3d(0 , 0 , 0);
  }
}
@keyframes bounce {
  0%   {
    -webkit-transform: scale(1,1)      translate3d(0 , 0 , 0);
    -ms-transform: scale(1,1)      translate3d(0 , 0 , 0);
    -o-transform: scale(1,1)      translate3d(0 , 0 , 0);
    transform: scale(1,1)      translate3d(0 , 0 , 0);
  }
  10%  {
    -webkit-transform: scale(1.05,.95)   translate3d(0 , 0 , 0);
    -ms-transform: scale(1.05,.95)   translate3d(0 , 0 , 0);
    -o-transform: scale(1.05,.95)   translate3d(0 , 0 , 0);
    transform: scale(1.05,.95)   translate3d(0 , 0 , 0);
  }
  30%  {
    -webkit-transform: scale(.95,1.05)   translate3d(0 , -8% , 0);
    -ms-transform: scale(.95,1.05)   translate3d(0 , -8% , 0);
    -o-transform: scale(.95,1.05)   translate3d(0 , -8% , 0);
    transform: scale(.95,1.05)   translate3d(0 , -8% , 0);
  }
  50%  {
    -webkit-transform: scale(1.02,.97) translate3d(0 , 0 , 0);
    -ms-transform: scale(1.02,.97) translate3d(0 , 0 , 0);
    -o-transform: scale(1.02,.97) translate3d(0 , 0 , 0);
    transform: scale(1.02,.97) translate3d(0 , 0 , 0);
  }
  57%  {
    -webkit-transform: scale(1,1)      translate3d(0 , -2% , 0);
    -ms-transform: scale(1,1)      translate3d(0 , -2% , 0);
    -o-transform: scale(1,1)      translate3d(0 , -2% , 0);
    transform: scale(1,1)      translate3d(0 , -2% , 0);
  }
  64%  {
    -webkit-transform: scale(1,1)      translate3d(0 , 0 , 0);
    -ms-transform: scale(1,1)      translate3d(0 , 0 , 0);
    -o-transform: scale(1,1)      translate3d(0 , 0 , 0);
    transform: scale(1,1)      translate3d(0 , 0 , 0);
  }
  100% {
    -webkit-transform: scale(1,1)      translate3d(0 , 0 , 0);
    -ms-transform: scale(1,1)      translate3d(0 , 0 , 0);
    -o-transform: scale(1,1)      translate3d(0 , 0 , 0);
    transform: scale(1,1)      translate3d(0 , 0 , 0);
  }
}


@media (max-width: 600px) {

  /* shake */
  .shake {
    -webkit-animation-name: shake;
    -moz-animation-name: shake;
    -o-animation-name: shake;
    animation-name: shake;
    -webkit-animation-duration: .1s;
    -moz-animation-duration: .1s;
    -o-animation-duration: .1s;
    animation-duration: .1s;
    -webkit-animation-timing-function: linear;
    -moz-animation-timing-function: linear;
    -o-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
  }
  @keyframes shake {
    from, 0% {
      -webkit-transform: translate3d( 0, 0, 0) rotate(0);
      -ms-transform: translate3d( 0, 0, 0) rotate(0);
      -o-transform: translate3d( 0, 0, 0) rotate(0);
      transform: translate3d( 0, 0, 0) rotate(0);
    }
    20% {
      -webkit-transform: translate3d( -.5%, 0, 0) rotate(3deg);
      -ms-transform: translate3d( -.5%, 0, 0) rotate(3deg);
      -o-transform: translate3d( -.5%, 0, 0) rotate(3deg);
      transform: translate3d( -.5%, 0, 0) rotate(3deg);
    }
    40% {
      -webkit-transform: translate3d( .5%, -.5%, 0) rotate(-3deg);
      -ms-transform: translate3d( .5%, -.5%, 0) rotate(-3deg);
      -o-transform: translate3d( .5%, -.5%, 0) rotate(-3deg);
      transform: translate3d( .5%, -.5%, 0) rotate(-3deg);
    }
    60% {
      -webkit-transform: translate3d( -.5%, .5%, 0) rotate(3deg);
      -ms-transform: translate3d( -.5%, .5%, 0) rotate(3deg);
      -o-transform: translate3d( -.5%, .5%, 0) rotate(3deg);
      transform: translate3d( -.5%, .5%, 0) rotate(3deg);
    }
    to, 100% {
      -webkit-transform: translate3d( 0, 0, 0) rotate(0);
      -ms-transform: translate3d( 0, 0, 0) rotate(0);
      -o-transform: translate3d( 0, 0, 0) rotate(0);
      transform: translate3d( 0, 0, 0) rotate(0);
    }
  }
}




/* yurayura */

.yurayura .animitem__move1 {
  display: block;
  -webkit-animation-name: yurayura-move1;
  -moz-animation-name: yurayura-move1;
  -o-animation-name: yurayura-move1;
  animation-name: yurayura-move1;
  -webkit-animation-duration: 3s;
  -moz-animation-duration: 3s;
  -o-animation-duration: 3s;
  animation-duration: 3s;
  -webkit-animation-timing-function: ease-in-out;
  -moz-animation-timing-function: ease-in-out;
  -o-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: infinite;
  -o-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-transform-origin: 50% 90%;
  -moz-transform-origin: 50% 90%;
  -ms-transform-origin: 50% 90%;
  -o-transform-origin: 50% 90%;
  transform-origin: 50% 90%;
  transform: rotate3d(0,1,0,0deg) translate3d(0,0,0);
}
@keyframes yurayura-move1 {
  0%{
    transform: rotate3d(0,0,1,-5deg) translate3d(0,0,0);
  }
  50%{
    transform: rotate3d(0,0,1,5deg) translate3d(0,0,0);
  }
  100%{
    transform: rotate3d(0,0,1,-5deg) translate3d(0,0,0);
  }
}