@charset "UTF-8";
	
body{
		background-color: #000;
}

span.sp_out{
	display: none;
}
span.blue{
	color: #999aff;
}
span.right{
	float: right;
}


#contents{
		width: 85%;
		height: auto;
		padding-top: 50px;
		text-align: left;
		line-height: 1.3;
		font-size: 1rem;
		background-color: #000;
		margin: auto;
		color: #ccc;
		font-family:"Lucida Grande","segoe UI", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN",'メイリオ', Meiryo, Verdana, Arial, sans-serif;
		}
		
h1{
		font-size: 1.2rem;
		margin-bottom: 1rem;
		text-align: center;
		}

.each, .each_photo250, .each_photo350, .each_photo450, .each_special{
	margin-bottom: 80px;
}
.day0, .day20, .day40, .day60, .day80, .day100, .day120, .day140{
	margin-bottom: 10px;
}
.explain_photo200, .explain_photo310, .explain_photo350, .explain_photo450, .explain_photo600 {
	margin-bottom: 10px;
	}
.explain{
	margin-bottom: 15px;
}
.image, .image_wide{
	width: 100%;
	margin: auto;
}
.image img, .image_wide img{
	width: 100%;
	text-align: center;
	margin-bottom: 5px;
}
.image_s img{
	width: 100%;
	text-align: center;
	margin-bottom: 5px;
	margin-top: 15px;
	}
		
a{
		color: #ccc;
		text-decoration: none;
		}
		
a:hover{
		color: #fff;
		}
 a:hover span.blue{
	font-weight: bold;
}
		
hr{
		border: #888 dotted 3px;
		width: 100%;
		margin-bottom: 30px;
}
		
span.bold{
		font-weight: bold;
		}
		
span.special{
	color: #69e3ff;
		}
		
/* 点滅 */
.blinking{
    -webkit-animation:blink 1.0s ease-in-out infinite alternate;
    -moz-animation:blink 1.0s ease-in-out infinite alternate;
    animation:blink 1.0s ease-in-out infinite alternate;
}
@-webkit-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@-moz-keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}
@keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}


/*▼768px以上のデバイスに適用▼*/
@media only screen and (min-width: 768px) { 
	#contents{
		width:60%;
		margin: auto;
	}
		
	
}
/*▲768ｐｘ以上のデバイスに適用▲*/	


/*▼980px以上のデバイスに適用▼*/	
@media only screen and (min-width: 980px) { 
	#contents{
		width:900px;
		margin: auto;
	}
		
	h1{
		text-align: left
	}	

	.each_photo250{
		height: 210px;
	}
	.each_photo350{
		height: 310px;
	}
	.each_photo450{
		height: 410px;
	}
	.each_special{
		width: 1050px;
		margin:auto;
		height: 330px;
	}

	.day0{
	width: 100px;
	padding-bottom: 0px;
	margin-right: 15px;
	float: left;
	}
	.day20{
		width: 100px;
		padding-bottom: 20px;
		margin-right: 15px;
		float: left;
	}
	.day40{
		width: 100px;
		padding-bottom: 40px;
		margin-right: 15px;
		float: left;
	}
	.day60{
		width: 100px;
		padding-bottom: 60px;
		margin-right: 15px;
		float: left;
	}
	.day80{
		width: 100px;
		padding-bottom: 80px;
		margin-right: 15px;
		float: left;
	}
	.day100{
		width: 100px;
		padding-bottom: 100px;
		margin-right: 15px;
		float: left;
	}
	.day120{
		width: 100px;
		padding-bottom: 120px;
		margin-right: 15px;
		float: left;
	}
	.day140{
		width: 100px;
		padding-bottom: 140px;
		margin-right: 15px;
		float: left;
	}
	.day200{
		width: 100px;
		padding-bottom: 400px;
		margin-right: 15px;
		float: left;
	}
	
	.explain_photo450{
		width: 450px;
		float: left;
	}
	.explain_photo350{
		width: 350px;
		float: left;
	}
	.explain_photo600{
		width: 600px;
		float: left;
	}
	.explain_photo200{
		width: 200px;
		float: left;
	}
	.explain_photo00{
	}
	.explain_photo310{
		width: 310px;
		float: left;
	}
	.explain_special{
		width: 300px;
		float: left;
	}
	
	.image{
		float: right;
		width: 130px;
		margin-left: 15px;
	}
	
		.image_big{
		float: right;
		width: 130px;
		margin-left: 15px;
	}
		.image_wide{
		float: right;
		width: 270px;
	}
	.image img, .image_wide img{
		height: 180px;
		width: auto;
	}
	.image_s img{
		height: 130px;
		width: auto;
		float: right;
	}
		.image img.wide{
		height: 180px;
		width: auto;
	}
	


}
/*▲980ｐｘ以上のデバイスに適用▲*/	


