@charset "UTF-8";

#footer-banner{
	background-color:#fff;
	color:#000;
}

#breadcrumb{
	display:none;
}

/*//////////----- FIRSTVIEW -----//////////*/

#firstview{
	width:100%;
	
	background-color:#000;
	color:#000;
}

#firstview div.content{
	width:100%;
}

#firstview p.slider-child{
	width:100%;
	margin:0 auto;
	max-width: 1080px;
	
	box-sizing: border-box;
	padding:10px;
}

#firstview p.slider-child a{
	display:block;
	
	transition:0.25s;
}

#firstview p.slider-child a:hover{
	opacity: 0.6;
	text-decoration: none;
}

#firstview p.slider-child img{
	width:100%;
	vertical-align: bottom;
}

#firstview p.slider-child img:nth-child(1){
	display:none;
}

#firstview p.slider-child img:nth-child(2){
	display:block;
}

@media only screen and (min-width: 720px){
	
	#firstview p.slider-child img:nth-child(1){
		display:block;
	}
	
	#firstview p.slider-child img:nth-child(2){
		display:none;
	}
	
}

/*//////////----- NEWFACE -----//////////*/

#newface{
	/*background-color:#fff;*/
	color:#000;
}

#newface div.content{	
	width:100%;
	margin:0 auto;
	max-width: 1080px;
	
	box-sizing: border-box;
	padding:5px;
}

@media only screen and (min-width: 600px){
	
	#newface article{
		box-sizing: border-box;
		padding:0 5px;
	}
}

@media only screen and (min-width: 800px){
	
	#newface article{
		padding:0 10px;
	}
}

/*//////////----- NEWS -----//////////*/

#news{
	background-color:#f0f0f0;
	color:#000;
}

#news div.content{
	display:flex;
	flex-flow: row wrap;
	align-items: stretch;
	justify-content: flex-start;
	
	width:100%;
	margin:0 auto;
	max-width: 840px;
	
	box-sizing: border-box;
	padding:5px;
}

#news article{
	width:100%;
	margin-bottom:10px;
}

#news article:last-child{
	margin-bottom:0;
}

@media only screen and (min-width: 720px){
	
	#news article{
		margin-bottom:15px;
	}
	
}

/*//////////----- PICKUP -----//////////*/

#pickup{
	background-color:#fff;
	color:#000;
}

#pickup div.content{	
	width:100%;
	margin:0 auto;
	max-width: 1080px;
	
	box-sizing: border-box;
	padding:5px;
}

@media only screen and (min-width: 600px){
	
	#pickup article{
		box-sizing: border-box;
		padding:0 5px;
	}
}

@media only screen and (min-width: 800px){
	
	#pickup article{
		padding:0 10px;
	}
}

/*//////////----- CAST -----//////////*/

#cast{
	/*background-color:#FFFFFF;*/
	color:#000;
}

#cast div.content{
	display:flex;
	flex-flow: row wrap;
	align-items: stretch;
	justify-content: flex-start;
	
	width:100%;
	margin:0 auto;
	max-width: 1080px;
	
	box-sizing: border-box;
	padding:5px;
}

#cast article{
	width:50%;
	
	margin-bottom:10px;
}

@media only screen and (min-width: 640px){
	
	#cast article{
		width:calc(100%/3);
		
		box-sizing: border-box;
		padding:0 5px;
	}
}

@media only screen and (min-width: 960px){
	
	#cast article{
		width:25%;
		
		padding:0 10px;
	}
}

/*//////////----- DIARY -----//////////*/

#diary{
	position: relative;
}

#diary span.bg-filter{
	width:100%;
	height:100%;
	
	background-image: url("../images/bg-frontpage-diary.webp");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	
	position: absolute;
	top:0;
	left:0;
	
	z-index: -20;
}

#diary span.bg-filter-color{
	width:100%;
	height:100%;
	
	background-color: rgba(255,255,255,0.60);
	
	position: absolute;
	top:0;
	left:0;
	
	z-index: -10;
}

#diary div.content{	
	width:100%;
	margin:0 auto;
	max-width: 1080px;
	
	box-sizing: border-box;
	padding:5px;
}

#diary article{
	box-sizing: border-box;
	padding:5px;
}

@media only screen and (min-width: 640px){
	
	#diary article{
		box-sizing: border-box;
		padding:0 5px;
	}
}

@media only screen and (min-width: 960px){
	
	#diary article{
		padding:0 10px;
	}
}

/*//////////----- RANKING -----//////////*/

#ranking{
	/*background-color:#fff;*/
	color:#000;
}

#ranking div.content{
	display:flex;
	flex-flow: row wrap;
	align-items: stretch;
	justify-content: flex-start;
	
	width:100%;
	margin:0 auto;
	max-width: 840px;
	
	box-sizing: border-box;
	padding:5px;
}

#ranking article{
	width:100%;
	margin-bottom:10px;
}

#ranking article:last-child{
	margin-bottom:0;
}

@media only screen and (min-width: 720px){
	
	#ranking article{
		box-sizing: border-box;
		padding:7.5px;
		
		margin-bottom:0;
	}
	
	#ranking article:nth-child(-n+3){
		width:calc(100%/3);
	}
	
}

/*//////////----- EVENT -----//////////*/

#event{
	/*background-color:#f0f0f0;*/
	color:#000;
}

#event div.content{	
	width:100%;
	margin:0 auto;
	max-width: 840px;
	
	box-sizing: border-box;
	padding:5px;
}

/*//////////----- WAITING -----//////////*/

#waiting{
	/*background-color:#fff;*/
	color:#000;
}

#waiting div.content{	
	width:100%;
	margin:0 auto;
	max-width: 840px;
	
	box-sizing: border-box;
	padding:5px;
}

/*//////////----- SHAME -----//////////*/

#shame{
	/*background-color:#f0f0f0;*/
	color:#000;
}

#shame div.content{	
	width:100%;
	margin:0 auto;
	max-width: 840px;
	
	box-sizing: border-box;
	padding:5px;
}