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

@media screen and (max-width:940px) {
  img{
    vertical-align: bottom;
  }
  
  body {
    font-size: 3.90625vw;/*body内基本フォントサイズ*/
    overflow-x: hidden;
  }
  
   .inner{
	  width: 100vw;
    margin: 0 auto;
  }
	.loading-logo{
		width: 100%;
	}
/*------------------------------------------------------------------------------------------------
ハンバーガーメニュー
------------------------------------------------------------------------------------------------*/
/* bodyにactiveクラスが着いた時 */
body.active{
  overflow-y: hidden;
}

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

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

	#sp-nav .nav-menu{
	  padding: 23.085106382978722vw 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.48936170212766vw
	}

	#sp-nav .nav-menu li{
	  margin: 0;
	  padding-bottom: 7.1020408163265305vw;
	}
	
	#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: 160.63829787234042vw;
    
  }
  
	header .inner h1{
	  top: 17.23404255319149vw;
	  right: 0;
		left: 0;
	}
	
	header .inner h1 img{
		width: 100vw;
	}
	
	header .inner h2{
	  top: 11.063829787234042vw;
	  left: 0
	}
	
	header .inner h2 img{
		width: 100vw;
	}
	
	header .inner .catch{
	  top: 138.08510638297872vw;
	  left: 7.340425531914893vw;
	}
	
	header .inner .catch img{
		width: 84.8936170212766vw;
	}
	

/* SLIDE
================= */
.slide .thumb_L {
  margin-bottom: 0.7446808510638299vw;
  width: 53.51063829787234vw;
  height: 34.78723404255319vw;
}
	
	.slide .thumb_L img{
		width: 53.51063829787234vw;
	}
.slide .thumb_L li {
  position: absolute;
  top: 1px;
  left: 1px;
}

.slide .thumb_S li {
  margin-right: 0.6382978723404255vw;
}
	
.slide .thumb_S li img{
  width: 12.872340425531913vw;
}
/*------------------------------------------------------------------------------------------------
genshin
------------------------------------------------------------------------------------------------*/
#genshin{
  background: url("../images/sp/genshin-bg.jpg") no-repeat top center;
  background-size: 100vw auto;
}

#genshin .inner{
  height: 119.36170212765957vw;
}

#genshin .inner .title{
  top: 12.76595744680851vw;
  left: 0;
}

#genshin .inner .title img{
		width: 100vw;
	}
	
#genshin .inner .txt {
  top: 31.595744680851062vw;
  left: 0.9574468085106382vw;
}
	
	#genshin .inner .txt img{
		width: 13.191489361702127vw;
	}
	
	
#genshin .inner .chara {
  top: 24.148936170212764vw;
	left: 0;
}
	
	#genshin .inner .chara img{
		width: 100vw;
	}

#genshin .inner .name {
  top: 32.4468085106383vw;
  right: 0.9574468085106382vw;
}
	
	#genshin .inner .name img{
		width: 52.12765957446809vw;
	}
	
	#genshin .inner .btn {
  top: 96.70212765957447vw;
  right: 7.127659574468086vw;
}
	#genshin .inner .btn img{
		width: 41.170212765957444vw;
	}
#avater_1{
	top: 48.191489361702125vw;
	right: 1.1702127659574468vw;
}
/*------------------------------------------------------------------------------------------------
avatar
------------------------------------------------------------------------------------------------*/
#avatar{
  background: url("../images/sp/avatar-bg.jpg") no-repeat top center;
  background-size: 100vw auto;
}

#avatar .inner{
  height: 117.02127659574468vw;
}
	
	#avatar .title{
  top: 12.76595744680851vw;
		left: 0;
}
	
	#avatar .title img{
  width: 100vw;
}
	
#avatar .chara{
  top: 17.659574468085108vw;
	right: 0;
}
	#avatar .chara img{
		width: 72.02127659574468vw;
	}
	
	#avatar .txt{
  top: 31.48936170212766vw;
	left: 0;
}
	
#avatar .txt img{
  width: 56.80851063829787vw;
}
	
#avatar .inner .btn {
  top: 94.46808510638299vw;
  left: 7.340425531914893vw;
}
	#avatar .inner .btn img{
		width: 41.170212765957444vw;
	}
#avater_2{
	top: 45.95744680851064vw;
	left: 0.9574468085106382vw;
}

/*------------------------------------------------------------------------------------------------
about
------------------------------------------------------------------------------------------------*/
#about{
  background: url("../images/sp/about-bg.jpg") no-repeat top center;
  background-size: 100vw auto;
}
	#about .inner{
		height: 123.93617021276594vw;
	}
	
#about .inner .anime{
  top: 14.893617021276595vw;
  left: 0.9574468085106382vw;
}

#about .inner .anime li{
	margin-bottom: 0.3191489361702127vw;
}
	#about .inner .anime li:nth-of-type(1) img{
		width: 41.808510638297875vw;
	}
	
#about .inner .anime li:nth-of-type(2) img{
		width: 40vw;
	}
	
#about .inner .title{
  top: 16.48936170212766vw;
  right: 0;
}

	#about .inner .title img{
		width: 56.91489361702128vw;
	}
#about .inner .txt{
  top: 27.23404255319149vw;
  left: 43.08510638297872vw;
}
#about .inner .txt li{
	margin-bottom: 1.3829787234042552vw;
}
	#about .inner .txt li img{
		width: 56.91489361702128vw;
	}
/*------------------------------------------------------------------------------------------------
footer
------------------------------------------------------------------------------------------------*/
footer{
  height: 38.82978723404255vw;
  padding-bottom: 7.446808510638298vw;
}

footer ul{
  padding: 7.446808510638298vw 0;
}

footer li{
  padding: 0 4.148936170212766vw 0 0;
}
	footer li img{
		width: 44.04255319148936vw;
	}

footer #copyright{
    font-size: 1.4893617021276597vw;
	line-height: 2;
}

}