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

main a {
	color: #666;
	text-decoration: none;
}
h1, h2, h3 {
	font-weight: 500 !important;
}


@media only screen and (max-width:960px) {
	/*スマホ*/
	h1 {
		margin-top: 60px;
		margin-bottom: 40px;
		text-align: center;
		font-size: 2rem;
	}
	.renovation_sp h2 {
		margin-top: 30px;
		margin-bottom: 20px;
		text-align: center;
		font-size: 1.8rem;
	}
	
	.renovation_sp,
	.type_sp {
		width: 100%;
	}
	
	.renovation_sp {
		border-top: 1px solid #EEE;
		padding-bottom: 60px;
	}
	
	.renovation {
		width: 100%;
	}
	.type,
	.other {
		width: 85%;
	}
	
	.renovation,
	.type,
	.other {
		display:flex;
		flex-wrap: wrap;
		margin: 0 auto;
	}
	
	.renovation li,
	.type li,
	.other li {
		display: block;
		text-align: center;
		margin-bottom: 1.5em;
		width: 100%;
	}
	.renovation li img {
		width: 100%;
		height: 400px;
		object-fit: cover;
		margin-bottom: 0.5em;
	}

	.type_sp {
		background: #EFEFEF;
		padding-top: 30px;
		padding-bottom: 20px;
	}
	.type_sp h2 {
		margin-bottom: 20px;
		text-align: center;
		font-size: 1.6rem;
	}
	
	.type li img {
		width: 100%;
		height: 250px;
		object-fit: cover;
		margin-bottom: 0.5em;
	}

	.other li img {
		width: 100%;
		height: 150px;
		object-fit: cover;
		margin-bottom: 0.5em;
	}

}

@media screen and (min-width:961px) {
	/*PC*/
	
	
	h1 {
		margin-top: 150px;
		margin-bottom: 30px;
		text-align: center;
		font-size: 3.2rem;
	}
	.renovation_sp h2 {
		margin-top: 100px;
		margin-bottom: 50px;
		text-align: center;
		font-size: 2.2rem;
	}
	
	.renovation_sp,
	.type_sp {
		width: 100%;
		min-width: 1100px;
		padding: 0 25px;
	}
	
	.renovation_sp {
		border-top: 1px solid #EEE;
		padding-bottom: 60px;
	}
	
	.renovation,
	.type,
	.other {
		display:flex;
		flex-wrap: wrap;
		max-width: 1720px;
		min-width: 1050px;
		margin: 0 auto;
	}
	
	.renovation li {
		display: block;
		width: calc((100% - 60px) / 3);
		margin-right: 30px;
		text-align: center;
	}
	.renovation li:last-child,
	.type li:last-child,
	.other li:last-child {
		margin-right: 0;
	}
	
	.renovation a,
	.type a,
	.other a {
		display: block;
		margin-bottom: 0.5em;
	}
	


	
	.renovation li img {
		width: 100%;
		height: 400px;
		object-fit: cover;
	}

	.type_sp {
		background: #EFEFEF;
		padding-top: 60px;
		padding-bottom: 50px;
	}
	.type_sp h2 {
		margin-bottom: 25px;
		text-align: center;
		font-size: 1.6rem;
	}
	
	.type li {
		display: block;
		width: calc((100% - 120px) / 5);
		margin-right: 30px;
		text-align: center;
	}
	.type li img {
		width: 100%;
		height: 250px;
		object-fit: cover;
		
	}
	.other li {
		display: block;
		width: calc((100% - 60px) / 3);
		margin-right: 30px;
		text-align: center;
	}
	.other li img {
		width: 100%;
		height: 250px;
		object-fit: cover;
	}

}