@charset "UTF-8";

#hometop { display: flex; justify-content: center; align-items: center; width: 100%; background: url("images/hometop5.jpg") center center / cover no-repeat; z-index: 0;}

.art { width: 100%; padding:20px;}
	.art .inner { width: 100%; max-width: 1200px; margin: 0 auto;}
		.art h2 { font-size: 24px; text-align: center; padding:40px 0 10px 0;}
		.art h3 { padding: 10px 0; font-size: 18px;}
		.art p { padding: 10px 0;}
		.art ul { display: flex; justify-content: space-between; flex-wrap: wrap; width: 100%; max-width: 960px; margin: 0 auto; padding: 20px 0 0 0;}
			.art li { font-size: 15px; text-align:left;}
				.art li img { padding: 0 0 5px 0;}

.red { color:#9A0010;}

a.mapbtn { display: inline-block; margin-left: 5px; padding: 2px 10px; border: 1px solid #9A0010; border-radius: 10px; text-decoration: none; color:#FFF; background: #9A0010; transition: .3s;}
	a.mapbtn:hover { color:#9A0010; background: #FFF;}


.inquirybtn { text-align: center;}
	.inquirybtn a { display: inline-block; font-size: 18px; font-weight: bold; margin:10px auto; padding: 5px 25px; border: 1px solid #9A0010; border-radius: 10px; text-decoration: none; color:#FFF; background: #9A0010; transition: .3s;}
		.inquirybtn a:hover { color:#9A0010; background: #FFF;}


/* 320 + settings */
@media all and (min-width:320px){
	#hometop { height: 100vw;}
		#hometop h1 img { width: 64vw; margin-top:12vw; }
	.art p { font-size: 16px; text-align: left;}
		.art p br { display: none;}
	.art li { width: 100%; padding: 10px 0;}
}

/* 640 + settings */
@media all and (min-width:640px){
	.art p { font-size: 16px; text-align: center;}
		.art p br { display: inline-block;}
	.art li { width: calc(50% - 20px); padding: 20px 0;}
}

/* 960px+ settings */
@media all and (min-width:960px) {
	#hometop { height: 66vw; }
	#hometop h1 img { width: 40vw; margin-top: 6.5vw; }
	.art p { font-size: 18px;}	
}

/* 1200 + settings */
@media all and (min-width:1200px){
}

/* print only settings */
@media print{

}