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

@media screen and (max-width:950px) {
  img{
    vertical-align: bottom;
  }
  
  body {
    overflow-x: hidden;
  }
  
   .inner{
	  width: 100vw;
    margin: 0 auto;
  }
	
/*------------------------------------------------------------------------------------------------
ハンバーガーメニュー
------------------------------------------------------------------------------------------------*/
/* bodyにactiveクラスが着いた時 */
body.active{
  overflow-y: hidden;
}

	/* ハンバーガーメニュー */
	.burger{
	  position: fixed;
	  cursor: pointer;
	  top: 0;
	  left: 0;
	  z-index: 101;
	}

	.burger img{
		width: 15.263157894736842vw;
		height: 15.052631578947368vw;
	}
	
	/* ナビメニュー */
	#sp-nav{
	  background-color: #191e34;
	  width: 100%;
	  height: 100vh;
	  position: fixed;
	  text-align: center;
	  top: -150%;
	  transition: .5s;
	  overflow-y: scroll;
		z-index: 100;
	}

	#sp-nav .nav-menu{
	  padding: 25.510204081632654vw 0 0 0;
	  margin: 0;
	  list-style: none;
	  width: 100%;
	  height: 100vh;
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  transform: translate(-50%, -50%);
	}
	
	#sp-nav .nav-menu .nav-title{
	  padding-bottom: 16.210526315789473vw;
	}
	#sp-nav .nav-menu .nav-title img{
		width: 48.73684210526316vw;
	}
	#sp-nav .nav-menu li{
	  margin: 0;
	  padding-bottom: 10.526315789473683vw;
	}
	#sp-nav .nav-menu li img{
		width: 100vw;
	}
	
	#sp-nav .nav-menu li a{
	  display: inline-block;
	  text-decoration: underline;
	  text-align: center;
	  transition: .4s;
	}

	#sp-nav .nav-menu li a:hover{
	  opacity: .6;
	}

	/* ナビメニューにactiveクラスが着いた時 */
	#sp-nav.active{
	  top: 0;
	}
/*------------------------------------------------------------------------------------------------
header
------------------------------------------------------------------------------------------------*/
  header{
    background: url("../images/sp/header-bg.jpg") no-repeat top center;
    background-size: 100vw auto;
	  top: 0;
	  height: auto;
  }
  
  header .inner{
    height: 189.89473684210526vw;
    
  }
  
	header .inner h1{
	  top: 4.315789473684211vw;
	  right: 30.210526315789473vw;
	}
	
	header .inner h1 img{
		width: 39.68421052631579vw;
	}
	
	header .inner h2{
	  top: 47.1578947368421vw;
	  left: 0;
	}
	
	header .inner h2 img{
		width: 100vw;
	}
	
	header .inner .catch{
	  top: 33.36842105263158vw;
	  left: 28.421052631578945vw;
	}
	
	header .inner .catch img{
		width: 47.1578947368421vw;
	}
	
	header .inner .header-chara{
	  top: 78vw;
	  left: 0;
	}
	header .inner .header-chara img{
		width: 100vw;
	}
	
	header .inner .header-sns{
		top: 1.789473684210526vw;
		right: 2.1052631578947367vw;
	}
	
	header .inner .header-sns img{
		width: 12.947368421052632vw;
	}
	
	.snow span:nth-child(1) {
  width: 79px;
  height: 89px;
  background: url("../images/snowflake-01.png") no-repeat;
  animation: confetti1 8s 0s linear infinite;
  left: 12.947368421052632vw;
}

.snow span:nth-child(2) {
  width: 143px;
  height: 153px;
  background: url("../images/snowflake-02.png") no-repeat;
  animation: confetti1 4s 0s linear infinite;
  left: -12.947368421052632vw;
}

.snow span:nth-child(3) {
  width: 112px;
  height: 117px;
  background: url("../images/snowflake-03.png") no-repeat;
  animation: confetti1 6s 0s linear infinite;
  left: -16.947368421052632vw;
}
.snow span:nth-child(4) {
  width: 169px;
  height: 165px;
  background: url("../images/snowflake-10.png") no-repeat;
  animation: confetti1 11s 0s linear infinite;
  left: 35.947368421052632vw;
}
.snow span:nth-child(5) {
  width: 76px;
  height: 84px;
  background: url("../images/snowflake-05.png") no-repeat;
  animation: confetti1 9s 0s linear infinite;
  left: 70.68421052631579vw;
}
.snow span:nth-child(6) {
  width: 77px;
  height: 86px;
  background: url("../images/snowflake-06.png") no-repeat;
  animation: confetti1 4s 0s linear infinite;
  left: 79.68421052631579vw;
}
.snow span:nth-child(7) {
  width: 80px;
  height: 91px;
  background: url("../images/snowflake-07.png") no-repeat;
  animation: confetti1 7s 0s linear infinite;
  left: 38.68421052631579vw;
}
.snow span:nth-child(8) {
  width: 119px;
  height: 116px;
  background: url("../images/snowflake-08.png") no-repeat;
  animation: confetti1 5s 0s linear infinite;
  left: 86.68421052631579vw;
}
	
	header .header-bottom{
	background: url("../images/sp/header-bottom.png") no-repeat top center;
	background-size: 100vw auto;
	top: 186.10526315789474vw;
	/*  height: auto;*/
}
/*------------------------------------------------------------------------------------------------
register
------------------------------------------------------------------------------------------------*/

.register{
  background: url(../images/sp/register-bg.jpg) repeat top center;
  background-size: 100vw auto;
  height: 17.789473684210527vw;
  top: 0;
}

.register ul{
  padding-top: 3.578947368421052vw;
}

.register ul li{
  margin-right: 5.052631578947368vw;
}
	.register ul li img{
		width: 38vw;
	}
  
/*------------------------------------------------------------------------------------------------
story
------------------------------------------------------------------------------------------------*/
#story{
  background: url("../images/sp/story-bg.jpg") no-repeat top center;
  background-size: 100vw auto;
}

#story .inner{
  height: 167.68421052631578vw;
}

#story .inner .title {
  top: 9.368421052631579vw;
  left: 16.526315789473685vw;
}

	#story .inner .title img{
		width: 65.89473684210526vw;
	}
	#story .inner .txt li{
		z-index: 1;
	}
#story .inner .txt li:nth-of-type(1){
	top: 29.157894736842106vw;
	left: 2.631578947368421vw;
}
	
#story .inner .txt li:nth-of-type(1) img{
	width: 95.6842105263158vw;
}
#story .inner .txt li:nth-of-type(2){
	top: 43.26315789473684vw;
	right: 0;
}
	
#story .inner .txt li:nth-child(n+2) img{
	width: 66.73684210526316vw;
}
#story .inner .txt li:nth-of-type(3){
	top: 121.15789473684211vw;
	right: 0;
}
	
#story .inner .chara {
	top: 50.10526315789474vw;
	left: 0;
}
	
	#story .inner .chara img{
		width: 100vw;
	}
/*------------------------------------------------------------------------------------------------
update-1223
------------------------------------------------------------------------------------------------*/
.update-12231{
  background: url("../images/sp/update-bg1.jpg") no-repeat top center;
  background-size: 100vw auto;
}

.update-12231 .inner{
  height: 141.68421052631578vw;
}

.update-12231 .title{
	top: 10.31578947368421vw;
	left: 0;
}
	
	.update-12231 .title img{
		width: 100vw;
	}
	
.update-12231 .inner .chara li:nth-of-type(1){
	top: 28.421052631578945vw;
	left: 0;
}

	
.update-12231 .inner .chara li:nth-of-type(1) .txt{
	top: 68.84210526315789vw;
	left: 0;
}
	
.update-12231 .inner .chara li:nth-of-type(1) .txt img{
		width: 48.84210526315789vw;
	}
	
.update-12231 .inner .chara li:nth-of-type(2){
	top: 36.526315789473685vw;
	right: 0;
}

.update-12231 .inner .chara li:nth-of-type(2) .txt{
	top: 65.6842105263158vw;
	left: 0;
}
	
.update-12231 .inner .chara li:nth-of-type(2) .txt img{
		width: 47.1578947368421vw;
	}

.update-12231 .inner .chara li:nth-child(n+1) img{
		width: 50vw;
	}

	
.update-12231 .inner .desc li:nth-of-type(1){
	top: 42.31578947368421vw;
	left: 27.263157894736846vw;
}
	.update-12231 .inner .desc li:nth-of-type(1) img{
		width: 45.78947368421053vw;
	}
.update-12231 .inner .desc li:nth-of-type(2){
	top: 75.05263157894737vw;
	left: 13.368421052631579vw;
}
.update-12231 .inner .desc li:nth-of-type(2) img{
		width: 74.52631578947368vw;
	}

.update-12232{
  background: url("../images/sp/update-bg2.jpg") no-repeat top center;
  background-size: 100vw auto;
}

.update-12232 .inner{
  height: 114.63157894736841vw;
}

.update-12232 .inner .map{
	background: none;
	position: static;
}


.update-12232 .inner .map .title{
	top: 12.421052631578949vw;
	left: 0;
}
.update-12232 .inner .map .title img{
	width: 100vw;
}

.update-12232 .inner .map .map-1 li:nth-of-type(1){
	top: 25.263157894736842vw;
	left: 3.684210526315789vw;
}
.update-12232 .inner .map .map-1 li:nth-of-type(1) img{
	width: 42.63157894736842vw;
}
.update-12232 .inner .map .map-1 li:nth-of-type(2){
	top: 32.73684210526316vw;
	left: 2.3157894736842106vw;
}

.update-12232 .inner .map .map-1 li:nth-of-type(3){
	top: 66.94736842105263vw;
	left: 4.105263157894737vw;
}
	
.update-12232 .inner .map .map-1 li:nth-of-type(3) img{
		width: 42.94736842105264vw;
	}	
	
.update-12232 .inner .map .map-2 li:nth-of-type(1){
	top: 25.263157894736842vw;
	right: 1.6842105263157894vw;
}
	
.update-12232 .inner .map .map-2 li:nth-of-type(1) img{
	width: 48.31578947368421vw;
}
	
.update-12232 .inner .map .map-2 li:nth-of-type(2){
	top: 32.73684210526316vw;
	right: 2.1052631578947367vw;
}

.update-12232 .inner .map .map-2 li:nth-of-type(3){
	top: 66.94736842105263vw;
	right: 0.5263157894736842vw;
}
	.update-12232 .inner .map .map-2 li:nth-of-type(3) img{
		width: 48.421052631578945vw;
	}	
.update-12232 .inner .map .map-1 li:nth-of-type(2) img,
.update-12232 .inner .map .map-2 li:nth-of-type(2) img{
	width: 45.78947368421053vw;
}
/*------------------------------------------------------------------------------------------------
update0127
------------------------------------------------------------------------------------------------*/
#update0127 .update0127-top{
	background: url("../images/sp/class-top.png") no-repeat top center;
	background-size: 100vw auto;
	height: 13.684210526315791vw;
}

#update0127{
  background: url("../images/sp/class-bg.jpg") no-repeat top center;
	background-size: 100vw auto;
	height: 173.6842105263158vw;
}

#update0127 .inner .title{
	top: 20.63157894736842vw;
	left: 4.631578947368421vw;
}
	#update0127 .inner .title img{
		width: 90.21052631578948vw;
	}
	
#update0127 .inner .subtitle{
	top: 33.36842105263158vw;
	left: 12vw;
}
	#update0127 .inner .subtitle img{
		width: 75.68421052631578vw;
	}
	
#update0127 .inner .txt li:nth-of-type(1){
	top: 44.94736842105263vw;
	left: 0;
}
	#update0127 .inner .txt li:nth-of-type(1) img{
		width: 100vw;
	}
#update0127 .inner .txt li:nth-of-type(2){
	top: 41.78947368421053vw;
	left: 13.368421052631579vw;
}
	#update0127 .inner .txt li:nth-of-type(2) img{
		width: 86.63157894736842vw;
	}
	
#update0127 .inner .txt li:nth-of-type(3){
	top: 114.52631578947367vw;
	left: 0;
	
}
#update0127 .inner .txt li:nth-of-type(3) img{
		width: 100vw;
	}
#update0127 .inner .txt li:nth-of-type(4){
	top: 84.94736842105263vw;
	left: 0;
}
	#update0127 .inner .txt li:nth-of-type(4) img{
		width: 81.15789473684211vw;
	}
/*------------------------------------------------------------------------------------------------
about
------------------------------------------------------------------------------------------------*/
#about{
  height: 177.57894736842107vw;
}

#about .inner .title{
  top: 10.947368421052632vw;
  left: 14.105263157894738vw;
}

	#about .inner .title img{
		width: 73.78947368421052vw;
	}
#about .inner .subtitle{
  top: 29.05263157894737vw;
  left: 1.263157894736842vw;
}
	#about .inner .subtitle img{
		width: 98.73684210526315vw;
	}
#about .inner .txt{
	top: 55.1578947368421vw;
	left: 11.052631578947368vw;
}
	#about .inner .txt img{
		width: 79.57894736842105vw;
	}

#about .inner .chara li:nth-of-type(4){
	top: 101.26315789473684vw;
	left: 0;
}
	#about .inner .chara li:nth-of-type(4) img{
		width: 53.368421052631575vw;
	}
	
#about .inner .chara li:nth-of-type(3){
	top: 134.21052631578948vw;
	left: 0;
}
#about .inner .chara li:nth-of-type(3) img{
		width: 52.421052631578945vw;
	}
#about .inner .chara li:nth-of-type(2){
	top: 127.57894736842105vw;
	right: 0;
}
#about .inner .chara li:nth-of-type(2) img{
		width: 52.94736842105263vw;
	}
#about .inner .chara li:nth-of-type(1){
	top: 91.36842105263158vw;
	right: 0;
}
#about .inner .chara li:nth-of-type(1) img{
		width: 52vw;
	}
#about .about-bottom{
	background: url("../images/sp/about-bottom.png") no-repeat top center;
	background-size: 100vw auto;
	top: 175.36842105263156vw;
}

.background video{
	display: block;
	min-width: 100%;
	height: auto;
	margin: 0;
  padding: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  z-index: -1;
}
/*------------------------------------------------------------------------------------------------
btn
------------------------------------------------------------------------------------------------*/
#btn{
  background: url("../images/sp/register2-bg.jpg") repeat top center;
  height: 18.31578947368421vw;
}

#btn ul{
  padding-top: 4.631578947368421vw;
	
}

#btn ul li{
  margin-right: 2.8421052631578947vw;
}
	#btn ul li:nth-of-type(-n+2) img{
		width: 38vw;
		
	}
#btn ul li:last-child img{
  width: 9.68421052631579vw;
}
/*------------------------------------------------------------------------------------------------
footer
------------------------------------------------------------------------------------------------*/
footer{
  height: auto;
  padding-bottom: 4.8vw;
}

footer ul{
  padding: 4.8vw 0;
}

footer li{
  padding: 0 10px 0 0;
}
  footer .moonrabi img{
    width: 20.9vw;
    height: 14.9vw;
  }
  
  footer .funyours img{
    width: 41.2vw;
    height: 4.7vw;
  }
footer p{
    padding-top: 2.1vw;
  
}

footer #copyright{
    font-size: 2.34375vw;
}

}