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

/* 写真館(photo.html) 
------------------------------------------------- */

@media only screen and (min-width: 320px){

	#photo{
		margin:0 5%;
	}

	#mainbody #pict h1,
	#mainbody #pict p{
		text-align:left;
	}

	#mainbody #pict h1{
		margin-bottom:24px;
		margin-right:10px;
		position: relative;
		background: #ffada2;
		box-shadow: 0px 0px 0px 5px #F99;
		border: dashed 2px white;
		padding: 0.2em 0.9em;
		color: #fff;
	}
	
	#mainbody #pict h1:after{
		position: absolute;
		content: '';
		left: -7px;
		top: -7px;
		border-width: 0 0 15px 15px;
		border-style: solid;
		border-color: #fff #fff #fd7e7e;
		box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.15);
	}


	#mainbody #pict #title{
		margin-bottom:30px;
		padding:0 0 0;
	}

	#mainbody #pict #title li{
		margin:0 1% 10px 0;
	}

	#mainbody #pict #title li a{
		display:block;
		padding:4px 10px;
		background-color:#ffada2;
		-webkit-border-radius:10px;
		-moz-border-radius:10px;
		border-radius:10x;
		color:#fff;
		font-size:18px;
		text-align:center;
	}
	
	#pBox table{
		width:100%;
	}
	
	#pBox table img{
		width:95%;
		margin-bottom:10px;
	}
	
	.btn a:link,
	.btn a:visited{
		background-color:#FF6699;
		color:#fff;
		padding:10px 0;
		text-align:center;
		border-radius:15px;
		display:block;
		width:100%;
		margin:10px auto;
	}
	
	.next a:link,
	.next a:visited{
		background-color:#FF6699;
		color:#fff;
		padding:10px 0;
		text-align:center;
		border-radius:15px;
		display:block;
		width:100%;
		margin:10px auto;
	}

}



@media only screen and (min-width: 480px){

	#mainbody #pict #mBox{
		float:left;
		width:48%;
		margin:0 15px 23px 0;
	}

	#mainbody #pict #mBox:nth-child(3n){
		margin:0 15px 23px 0;
	}

	#mainbody #pict #mBox:nth-child(even){
		margin:0 0 23px 0;
	}
	
	#mainbody #pict #title li{
		float:left;
		margin:0 1% 10px 0;
	}

	#mainbody #pict #title li a{
		display:block;
		padding:4px 10px;
		background-color:#ffada2;
		-webkit-border-radius:10px;
		-moz-border-radius:10px;
		border-radius:10x;
		color:#fff;
		font-size:18px;
		text-align:center;
	}


}



@media only screen and (min-width: 980px){
	
	#pBox table{
		width:800px;
		margin-left:25px;
	}
	
	#pBox table td{
		vertical-align:top;
	}
	
	#pBox table img{
		width:250px;
		margin-bottom:20px;
	}
	
	.btn a:link,
	.btn a:visited{
		width:95%;
	}
	
	.btn a:hover{
		background-color:#FF6666;
	}
	
	.next a:link,
	.next a:visited{
		width:95%;
	}
	
	.next a:hover{
		background-color:#FF6666;
	}
	
	.noimage{
		width:250px;
	}

	

}