body { background-image: url("back/back6.gif") }
#wrapper {margin:0 auto; }
#head {margin:0 auto; background-image: url("back/back4.gif"); box-shadow: 1px 0px 2px 0px rgba(0,0,0,0.5); overflow:hidden }
h1 {font-family:HGS創英角ポップ体,fantasy; font-size:150%; font-weight:bold; margin:1em; text-decoration:underline;}
h2 {font-family:HGS創英角ポップ体,fantasy; font-size:120%; padding:0.5em; border-left:1.5em solid #8cc; border-bottom:0.1em solid #8cc; }
h3 {font-family:HG行書体,fantasy; font-weight:bold; font-size:120%; margin-bottom:0}
#areaindex{font-family: HGS創英角ポップ体,fantasy; margin:1em}
.photo-menu {width: 98%; margin-left:auto; margin-right:auto;}
.photo-menu img {width:98%; height: 60px;}
.photo-menu table { margin-left:auto; margin-right:auto; table-layout:fixed}
.photo-menu table td { width: 25%; text-align:center; font-size:80%; font-family: HGS創英角ポップ体,fantasy;}
p { text-indent: 1em; margin-top:1px; margin-bottom:2px; font-size:100%; font-family:HGS創英角ポップ体,fantasy }
ul { font-size: 100%; }
ul li { line-height:2em; border:2px solid; background-color:#fff; border-color: #cccccc #808080 #808080 #cccccc; margin: 0.5em; float:left; border-radius:4px; list-style-type:none}
li a {display:block; height:2em; text-decoration:none; color: blue; padding-left:0.5em; padding-right:0.5em}
li a:hover {background-color:#ccc}
img.new { height: 8px;}
.new {font-family:cursive; font-size:80%; color:red; font-weight:bold}
p {line-height:1.2em; margin:0.5em auto}
hr {clear:both}
.link-to-yamato { font-weight:bold; font-size:120%; margin:1em; text-align:right;}
.index {clear:both;}
@media (min-width:320px) {
	#wrapper {width:320px}
	.photo-menu img {width:75px; height:75px}
}
@media (min-width:480px) {
	#wrapper {width:480px}
	.photo-menu img {width:115px; height:115px}
}
@media (min-width:640px) {
	#wrapper {width:640px}
	.photo-menu img {width:155px; height:155px}
}
@media (min-width:960px) {
	.photo-menu img {width:235px; height:235px}
	#wrapper {width:960px}
}
@media (min-width:1280px) {
	#wrapper {width:100%}
	.index {padding:1em 5% 1em 5%; overflow:hidden; margin-bottom:1em; }
	.text-menu { width: 50%; float:left;}
	.photo-menu { width: 50%; float:right}
	.photo-menu table {width: 640px; }
	.photo-menu img {width:155px; height:155px}
}
@media (min-width:1600px) {
	#wrapper {width:100%}
	.photo-menu table { width: 800px; }
	.photo-menu img {width:195px; height:195px}
}