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

@media only screen and (min-width: 0px) and (max-width: 640px){
	h1.syoseki {
	background-color:#33CCFF;
	padding:4px;
	font-size:1.4em;
	font-weight:normal;
	line-height:1.5em;
	}
	
	div.info {
	width:100%;
	}
	div.norm table {
	width:90%;
	margin:10px;
	}	
}

@media only screen and (min-width: 641px){
	h1.syoseki {
	background-image:url(../images/ti-syoseki.jpg);
	padding:8px 5px;
	color:#000000;
	font-size:1.3em;
	margin:0px 0px 10px 0px;
	line-height:1.4em;
	}

	div.info {
	float:right;
	width:280px;
	}
}

@media only screen and (min-width: 0px) and (max-width: 640px){
	h2.syoseki {
	text-align:center;
	}
}

@media only screen and (min-width: 641px){
	h2.syoseki {
	background-color:#FF9900;
	font-size:1.3em;
	color:#FFFFFF;
	padding:5px;
	margin:0px;
	text-align:center;
	}
}

@media only screen and (min-width: 0px) and (max-width: 640px){
	.syoseki-hyosi br {
	display:none;
	height:0px;
	padding:0px;
	margin:0px;
	line-height:0px;
	}

	.syoseki-hyosi a:hover {
	color:#e74939;
	background-image:url(../images/ec-button2.png);
	background-repeat:repeat-x;
	}
}
@media only screen and (min-width: 641px){
	p.syoseki {
	background-color:#FFFFCC;
	line-height:1.5em;
	letter-spacing: 0.1em;
	padding:5px;
	margin:0px 0px 10px 0px;
	border:1px solid #FF9900;
	}
}
@media only screen and (min-width: 0px) and (max-width: 640px){
	p.syoseki {
	margin:4px;
	padding:4px;
	line-height:2em;
	font-size:1.0em;
	}
}	

@media only screen and (min-width: 641px){	
	div.syoseki-hyosi {
	float:left;
	margin:0px;
	padding:10px 5px;
	width:210px;
	background-image:url(../images/back5.jpg);
	position:relative;
	}
}
@media only screen and (min-width: 0px) and (max-width: 640px){
	div.syoseki-hyosi {
	margin:0px;
	padding:10px 5px;
	text-align:center;
	position:relative;
	}
}

img.syoseki-hyosi {
	border:1px solid #CCCCCC;
}

p.syoseki-annai {
	padding:5px;
	background-color:#E30000;
	color:#FFFFFF;
}

@media only screen and (min-width: 641px){
	img.zeppan {
	position:absolute;
	top:10px;
	left:10px;
	}
}
@media only screen and (min-width: 0px) and (max-width: 640px){
	img.zeppan {
	position:absolute;
	top:10px;
	left:10px;
	}
}

/*目次*/
@media only screen and (min-width: 641px){
#mokuji {
	background-color:#FFFFCC;
}

#mokuji h2.mokuji {
	background-color:#FF6600;
	color:#FFFFFF;
	font-size:1.2em;
	padding:8px 8px;
	margin:10px 0px 0px 0px;
}

#mokuji h2 {
	margin:0px 0px 10px 0px;
	padding:4px 8px;
	font-size:1em;
	background-color:#E7E8E9;
}

#mokuji h3 {
	margin:3px;
	padding:3px 10px;
	font-size:90%;
}

#mokuji p.komidasi {
	font-size:90%;
	margin-left:35px;
	margin-bottom:5px;
	margin-top:5px;
}

#mokuji p.komidasi2 {
	font-size:90%;
	margin-left:55px;
	margin-bottom:5px;
	margin-top:5px;
}

#mokuji p.komidasi3 {
	font-size:90%;
	margin-left:75px;
	margin-bottom:5px;
	margin-top:5px;
}
}

@media only screen and (min-width: 0px) and (max-width: 640px){
	#mokuji {
	background-color: #E7E8EB;
	margin:10px 4px;
}
#mokuji h2.mokuji {
	font-size: medium;
	line-height:1.2em;
	background-color:#33CCFF;
	color:#FFFFFF;
	margin:4px 0px 0px 0px;
	padding:6px 4px;	
}
#mokuji h2 {
	font-size:medium;
	line-height:1.2em;
	background-color:#CCCCCC;
	padding:4px;
}
#mokuji h3 {
	font-size:medium;
	line-height:1.2em;
	font-weight:normal;
	padding:2px;
}
p.komidasi {
	font-size:0.9em;
	margin:0px 4px 0px 10px;
	padding:2px;
}
p.komidasi2 {
	font-size:0.9em;
	margin:0px 4px 0px 20px;
	padding:2px;
}
p.komidasi3 {
	font-size:0.9em;
	margin:0px 4px 0px 30px;
	padding:2px;
}
}