@charset "utf-8";



/* common
----------------------------------------------------------- */
#projects div#contents h1.ttl:after{
	content:"Completed Projects";
}
 
 
/* list_projects
----------------------------------------------------------- */
#projects ul.list_projects li{
	width:calc(20% - 24px);
	margin-right:30px;
	margin-bottom:90px;
}
#projects ul.list_projects li:nth-child(5n){
	margin-right:0;
}
#projects ul.list_projects li a{
	text-decoration:none;
}
#projects ul.list_projects li span.photo{
	width:100%;
	display:block;
	margin-bottom:15px;
	padding-top:66.6%;
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;
}
#projects ul.list_projects li span.photo:hover{
	background-size:cover;
}
#projects ul.list_projects li h2.name{
	margin-bottom:15px;
	color:#81511c;
	font-size:24px;
	font-weight:bold;
	text-decoration:underline;
}
#projects ul.list_projects li h2.name:hover{
	text-decoration:none;
}
@media screen and (max-width:1600px){
	#projects ul.list_projects li{
	width:calc(25% - 22.5px);
	}
	#projects ul.list_projects li:nth-child(5n){margin-right:30px;}
	#projects ul.list_projects li:nth-child(4n){margin-right:0;}
}
@media screen and (max-width:1280px){
	#projects ul.list_projects li{
		width:calc(33.33% - 20px);
	}
	#projects ul.list_projects li:nth-child(4n){margin-right:30px;}
	#projects ul.list_projects li:nth-child(3n){margin-right:0;}
}
@media screen and (max-width:780px){
	#projects ul.list_projects li{
		width:calc(50% - 15px);
	}
	#projects ul.list_projects li:nth-child(3n){margin-right:30px;}
	#projects ul.list_projects li:nth-child(2n){margin-right:0;}
}
@media screen and (max-width:540px){
	#projects ul.list_projects li{
		width:100%;
		margin-right:0;
	}
}