@charset "UTF-8";

@media screen and (max-width:768px){
	

	#wrap p.gototop{
		display: none;
	}
	
	#sp-gototop{
	display: flex;
	justify-content:flex-end;
	position: sticky;
	width:94%;
	height: auto;
	padding:0 3%;
		margin-top:20px;
      bottom: 20px;
	left:0px;
	z-index: 1;
}
	
br.pcoff{
	display: block;
}
	br.spoff{
		display: none;
	}



#contents{
	width:100%;
	height:auto;
	padding-top:0px;
	padding-bottom:0px;
}


/***********************
TOP 100%表示
************************/

#wrap{
	width:100%;
	height: auto;
	margin:0 auto;
	padding-bottom: 0;
}
/* --- 全体のBOX定義 ------- */
.box {
  position   : relative;
  height     : 100vh;
  margin     : auto;
  overflow   : hidden;
}

/* --- 段差で背景画像のアニメーションを実行 -------- */
.box .src1 {
  background-image : url("../new_img/nwz_top.png");   /* 背景の画像を指定 */
}


.box .boxString{
  position: relative;
	top:45%;
	left: 50%;
transform:translate(-50%, 0);
	display: block;
	z-index: 1;
	max-width: 70%;
}
	.box .boxString h1 img{
		max-width: 100%;
		height: auto;
	}
	
.box a {
bottom: 20%;
}


#contents .center{
	text-align: center;
}

/****
	ヘッダー
	********/
header.header{
	width:100%;
	height: 55px;
	margin:0 auto;
}
header.header nav {
    width: 100%;
}
header.header ul {
	width:100%;

}
header.header ul li{
	height: 50px;
	line-height: 50px;
	    font-size: 18px;
	width:95%;
		padding-left: 5%;
}
header.header ul li:first-of-type{
	padding-top:70px;
	}
header.header ul li.komidashi{
	font-size: 17px;
}

.hamburger {
    top: 25px;
    right:5%;
}


/***********************
TOPメッセージ
************************/
article#nwz_message{
	width:94%;
	height:auto;
	padding-top:70px;
	padding-left:3%;
	padding-right: 3%;
	margin:0 auto;
}

#contents h1{
	font-size:40px;
}

#contents article#nwz_message h1{
	font-size: 25px;
}

/*ブランドNWZ*/
/*ブランドEXIT*/
#contents article.nwz_brand{
	width:100%;
	height: 100vh;
}
	#contents article.nwz_brand h2 img{
	max-width:70%;
	height: auto;
}
	#contents article.nwz_brand h3,
	#contents article.exit_brand h3{
	font-size: 22px;
}
#contents article.exit_brand{
	width:100%;
	height: 100vh;
}
	#contents article.exit_brand h2 img{
	max-width:70%;
	height: auto;
}
#contents .contentsbox{
	width:90%;
	height: auto;
	margin:0 auto;
}

#contents .buttonbox{
	display: flex;
	width:60%;
	height: auto;
	flex-wrap: wrap;
	margin-top:30px;
}

#contents p.button{
	display: block;
	margin:20px auto 0;
	background-color: #fff;
	border-radius: 50px;
	width:100%;
	height: 35px;
	line-height: 35px;
	text-align: center;
}

	#contents p.secondbutton{
		margin-top:80px;
	}	
	


#contents p.button2{
	width:60%;
	margin-bottom:80px;
}

	
/*NWZとは*/
#contents article.about{
	width:100%;
	height: auto;
}
#contents .midashibox1,
#contents .midashibox2,
#contents .midashibox3{
	width:94%;
	padding-left: 3%;
	padding-right: 3%;
}


#contents .midashibox1 .titlebox{
	width:100%;
	height: auto;
}
#contents .midashibox2 .titlebox{
	width:100%;
	height: auto;
}
#contents .midashibox2 .titlebox h1{
	font-size: 33px;
}
#contents .midashibox3 .titlebox h1{
	font-size: 36px;
}
	#contents .midashibox3 .titlebox h1.komoji{
	font-size: 20px;
}


#contents article.about h2{
	text-align: center;
	font-size: 26px;
}
#contents article.about h2.komoji{
	font-size: 17px;
}

#contents .graybox{
	width:92%;
	height: auto;
	padding-left: 1%;
	padding-right: 1%;
}
#contents .graybox dl dt{
	font-size: 20px;
}
#contents .graybox dl dt.komoji{
	font-size: 18px;
}
#contents .graybox dl dd{
	font-size: 15px;
	text-align: justify;
}
	@media screen and (max-width:390px){
		#contents .graybox dl dd{
			letter-spacing: -0.1em;
		}
	}

#contents article.about p.bigcenter{
	font-size: 28px;
}

#contents .about_textbox1,
#contents .about_textbox2{
	width:94%;
	height: auto;
}
#contents .about_textbox1 p{
	text-align: center;
	font-size: 17px;
}
#contents .about_textbox2 p{
	text-align: center;
	font-size: 17px;
}
#contents .about_textbox2 p.bigcenter2{
	font-size: 45px;
}
		#contents br.minion{
			display: block;
		}

#contents p.zu1 img,
	#contents p.zu2 img{
		display: block;
	max-width: 90%;
		height: auto;
		margin:0 auto;
}

#contents p.centerimg img{
	display: block;
	margin:40px auto 0;
	max-width: 90%;
	height: auto;
}

#contents .about_textbox3{
	width:94%;
	height: auto;
	padding:0 3%;
}

#contents .about_textbox4{
	width:94%;
	height: auto;
	padding:0 3%;
}
#contents .about_textbox4 p{
	text-align: justify;
	font-size: 22px;
	font-weight: bold;
	line-height: 1.4;
}
#contents .about_textbox4 p.bigcenter3{
	font-size: 40px;
}

#contents .underline{
	width:94%;
	height: auto;
	padding-bottom:5px;
	margin-top:40px;
}
#contents .underline h2{
	font-size: 25px;
}
#contents .per_box{
	width:94%;
}

#contents .per_box p img{
	max-width: 100%;
	height: auto;
}

#contents .snsbox{
	width:94%;
	height: auto;
}
#contents .snsbox .buttonbox{
	display: flex;
	width:94%;
	height: auto;
	margin:40px auto 0;
	align-items:flex-end;
	justify-content:flex-end;
}
#contents .snsbox .buttonbox p.insta{
	padding-left: 10%;
}


footer{
	background:#000;
	margin-bottom: -200px;
}

.footerbox{
	width:100%;
	height:auto;
	margin:0 auto;
}
.footerbox p img{
	display: block;
	height: 100px;
	width:auto;
	margin:60px auto 30px;
}
	
}