@charset "UTF-8";

.art { padding:20px 0; text-align: left;}
	.art p { padding:10px 0; font-size:16px;}
	.art a { color:#000; text-decoration: underline;}
		.art a:hover { color:#0072BF;}

.prodcuts { padding:20px 0; text-align: left;}
	.prodcuts h3 { display: block; width:100%; max-width: 800px; padding:10px 0; margin: 20px auto; font-size:26px; text-align: center; }
		#p1 h3 {background:#FFEE00;}
		#p2 h3 {background:#00ACE4;}

p.pphoto { display: block; width:100%; max-width: 800px; padding:10px 0; margin: 20px auto; text-align: center; }

ul.pphoto { display: flex; flex-wrap: wrap; justify-content: space-between; width:100%; padding:10px 0; margin: 0; text-align: center; }
	ul.pphoto li { padding: 10px 0;}

ul.pnote {padding: 10px 0 10px 1em; margin: 0 0 0 1em; list-style: disc;}
	ul.pnote li { font-size: 16px; padding: 2px 0;}

p.intro { display: block; width:100%; max-width: 600px; margin: 0 auto;}


p.inquirybtn { text-align: center; font-weight: bold; font-size: 16px; padding: 40px 0 20px 0;}
p.inquirybtn span { display: inline-block; text-align: left; margin: 0 auto;}
p.inquirybtn a { color:#060; text-decoration: none; }
p.inquirybtn strong { font-size: 32px;}

@media all and (min-width:320px) {
	/* 320px+ settings */
	.art th { display: block; padding: 20px 0 0 0; font-size: 16px;}
	.art td { display: block; padding: 0 0 20px 0; font-size: 16px; border-bottom: 1px solid #999;}
	ul.pphoto li { width: 100%; }
}

@media all and (min-width:640px) {
	/* 640px+ settings */
	.art th, .art td { display: table-cell; text-align: left; padding: 20px 15px; font-size: 16px; border-bottom:none; vertical-align: top;}
}

@media all and (min-width:960px) {
	/* 960px+ settings */
	ul.pphoto li { width: 31%; }
}

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