@charset "UTF-8";
/*body {
  font-family: "Hiragino Mincho ProN","メイリオ", serif  !important; 
 }*/
a:hover img {
  opacity: 0.8; }
a:hover {
  opacity: 0.8; }
#palclosetPlan{
	max-width: 1060px;
	width: 100%;
	margin: 25px auto;
	background: #000;
	line-height: 1.5;
	letter-spacing: 2px;
	 font-family:"ヒラギノ明朝 ProN W3", "Hiragino Mincho Pro","游明朝", "Yu Mincho", "游明朝体", "YuMincho", "HGS明朝E", "ＭＳ Ｐ明朝", serif !important;	
}
#mainArea{
	color: #FFF;
	width: 940px;
	margin: auto;
	width: 100%;
}
#mainArea p{
	font-size: 16px;
	text-align: center;
	padding: 30px 0;
}
#mainArea p span{
	font-size: 24px;
	border-bottom: 3px double #fff;
}
h2{
	width: 100%;
}
h3{
	color: #fff !important;
	text-align: center !important;
	font-size: 30px !important;
}
h3 span{
	color: #ff1b2b;
}
#presentArea{
	max-width: 940px;
	width: 100%;
	margin: 50px auto;
	/*background: rgba(255,255,255,0.2);*/
	background: url(../images/town.jpg) no-repeat;
	background-position: center center;
	background-size: cover;
	padding: 30px;
	box-sizing: border-box;
	color: #000;

}
#presentArea div.outline{
	margin-bottom: 50px;
}
#presentArea div.outline p{
	text-align: center;
	font-size: 32px;
	color: #ff1b2b;
	font-weight: bold;
}
#presentArea div.outline dl{
	display: block;
	margin: 10px auto;
	font-size: 24px;
	font-weight: bold;
	color: #fff;
	width: 580px;
	
}
#presentArea div.outline dl dt{
	float: left;
}
#presentArea div.outline ul{
	
	margin: 25px auto 0;
	color: #fff;
	display: table;
	width: 440px;
}

	

#ryuk li:first-child{
	width: 140px;
	display: table-cell;
}
#ryuk li:first-child img{
	width: 140px;
}
#ryuk li:last-child{
	display: table-cell;
	width: 300px;
	vertical-align: middle;
	font-size: 14px;
	box-sizing: border-box;
	padding-left: 15px;
}
#presentArea div.outline dl dd span{
	font-size: 14px;
}
div.oubo{
	margin-top: 25px;
}
div.oubo dl dt{
	color: #fff;
	padding: 2px;
	text-align: center;
	width: 65%;
	margin: auto;
	font-size: 22px;
	box-sizing: border-box;
	padding: 3px 0;
	border: 1px solid #aaa;
	border-left: none;
	border-right: none;
}
div.oubo dl dd.date{
	text-align: center;
	margin: 20px 0 30px;
	color: #fff;
	font-size: 18px;
}
div.oubo dl dd.step{
	width: 90%;
	margin: 30px auto 35px;
}
div.oubo ul{
	width: 100%;
	display: table;
	table-layout: fixed;
	text-align: center;
	}
div.oubo ul li{
	display: table-cell;
	box-sizing: border-box;
	padding: 0 10px;
}
div.circle{
	width: 70px;
	height: 70px;
	border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	-o-border-radius:　50%;
	-ms-border-radius: 50%;
	background: url(../images/ringo.png);
	margin:0 auto 15px;
	background-size: cover;


}
div.circle p{
	font-size: 26px;
	line-height: 1.2;
	color: #fff;
	position: relative;
	top: 50%;
	transform: translateY(-30%);
	
}
div.circle p span{
	font-size: 14px;
}
p.explain{
	font-size: 14px;
	height: 100px;
	color: #fff;
	text-align: left;
}
p.explain span{
	display: inline-block;
	padding-top: 5px;
	font-size: 12px;
}
div.oubo ul li a{
	display: block;
	text-decoration: none;
	box-sizing: border-box;
	border: 1px solid #fff;
	color: #fff;
	width: 100%;
	margin: auto;
	padding: 4px 0;
}
div#attention{
	color: #fff;
	font-size: 12px;
	width: 790px;
	margin: auto;
}
#introMovie{
	box-sizing: border-box;
	padding: 30px 60px;
	color: #fff;
}
div.movieScene{
	width: 90%;
	margin:0 auto 30px;
}
h4, h5{
	text-align: center !important;
}
h4{
	max-width: 320px !important;
	width: 90% !important;
	margin: auto !important;
}
h5{
	font-size: 24px !important;
	margin: 25px auto !important;
}
h5 span{
	color: #ff1b2b;
	font-size: 18px;
	display: inline-block;
	margin-bottom: 5px;

}
div.movieScene02{
	width: 100%;
	margin-top: 30px;
}
div#foot{
	color: #fff;
	font-size: 10px;
	text-align: right;
	padding: 10px 10px;
}
br.pcNone{
	display: none;
}
div#officialLink{
	width: 500px;
	margin: 60px auto 25px;
}
div#officialLink a{
	text-align: center;
	background: #fff;
	display: block;
	padding: 15px;
	font-size: 18px;
	text-decoration: none;
	color: #000;
	border-radius: 10px;
	font-weight: bold;
}
@media screen and (max-width: 768px){
	#mainArea p{
		font-size: 14px;
		width: 90%;
		margin: auto;
	}
	#mainArea p span{
		font-size: 20px;
	}
	h3{
		font-size: 24px !important;
		width: 90% !important;
		margin: auto !important;
	}
	#presentArea{
		background-size: cover;
		margin: 30px auto;
		padding: 15px;
	}
	#presentArea div.outline p{
		font-size: 24px;
		margin-bottom: 15px;
	}
	#presentArea div.outline dl{
		font-size: 16px;
	}
	#presentArea div.outline dl dd span{
		font-size: 10px;
	}
	#presentArea div.outline dl{
		width: 80%;
		margin: auto;
		
	}
	div.oubo dl dt{
		text-align: center;
		width: 100%;
		margin: auto;
		font-size: 20px;	
	}
	div.oubo dl dd.date{
	text-align: center;
	margin: 20px 0 30px;
	color: #fff;
	font-size: 16px;
	}
	div.oubo dl dd.step{
		width: 90%;
		margin: 30px auto 35px;
	}
	div.oubo ul{
		width: 100%;
		display: block;
		
		}
	div.oubo ul li{
		display: block;
		box-sizing: border-box;
		margin-bottom: 25px;
	}
	p.explain{
		height: auto;
		margin: 10px 0;
	}
	#introMovie{
		padding: 0px;
	}
	div#introMovie p{
		font-size: 14px;
		width: 85%;
		margin: auto;
	}
	h4{
		width: 55% !important;
	}
	h5{
		font-size: 20px !important;
		width: 85% !important;
	}
	h5 span{
		font-size: 14px;
	}
	div.movieScene{
		width: 100%;
		margin:0 auto 30px;
	}
	div#officialLink{
		width: 90%;
		margin: 40px auto 25px;
	}
	div#officialLink a{
		padding: 10px 0;
		font-size: 14px;
		
	}
	div#foot{
		text-align: center;
	}
	br.pcNone{
		display: block;
	}
	br.spNone{
		display: none;
	}
	#presentArea div.outline ul{
	
	margin: 25px auto 0;
	color: #fff;
	display: block;
	width: 100%;
	}
	#ryuk li:first-child{
		width: 140px;
		display: block;
		margin: auto;
	}
	
	#ryuk li:last-child{
		display: block;
		vertical-align: middle;
		font-size: 12px;
		box-sizing: border-box;
		padding-left: 0px;
		margin: 10px auto 0;
		text-align: center;
		width: 100%;
	}
	div#attention{
		width: 95%;
	}
}