/* CSS Document
-------------------------------------------------------------------------------

「ひげおやじのホームページ」スタイルシート

------------------------------------------------------------------------------- */

body{
	background-color:#CCC;
	font:medium/150% "ヒラギノ角ゴ Pro W3", "ＭＳ Ｐゴシック";
	color:#000;
	margin:0;
	padding:0;
}

ul{ list-style-type:none; margin:0; padding:0; }

a,
a:link,
a:active,
a:visited{ color:#000; text-decoration:underline; }
a:hover{ color:#000; text-decoration:none; }

p{ margin:0 0 1.3em 0; }

th{ vertical-align:top; padding-right:1em; }

/* HEADER
=============================================================================== */
#header{
	background:scroll url(img/bg.gif) center top no-repeat;
	background-color:#FFF;
	height:150px;
	width:700px;
	text-align:right;
	border-top:16px solid #003;
	border-bottom:10px solid #F30;
	margin:0 auto;
	padding:0;
}
#header h1{
	font:bold 4.0em/100% Arial, Helvetica, sans-serif;
	color:#F30;
	margin:0;
	padding:0;
}
#header img{ margin:3px 5px; }



/* WRAPPER
=============================================================================== */
#wrapper{
	background-color:#FFF;
	width:700px;
	border-top:10px solid #003;
	border-bottom:23px solid #003;
	margin:0 auto;
	padding:0;
}

.top{ margin-bottom:40px; clear:both; }
a.top,
a:link.top,
a:active.top,
a:visited.top{ width:100%; display:block; color:#666; text-decoration:none; border-bottom:2px solid #666; }
a:hover.top{ width:100%; display:block; color:#000; text-decoration:none; border-bottom:2px solid #000; }


/* SIDE
=============================================================================== */
#side{
	background-color:#003;
	width:27%;
	float:left;
	margin:0 0 50px 0;
	padding:0;
}
#side ul{ margin:20px; }
#side li{
	font-family:Arial, Helvetica, sans-serif;
	display:block;
	margin:0;
	padding:2px 0px;	
}
#side a,
#side a:link,
#side a:active,
#side a:visited	{ width:100%; display:block; color:#FFF; text-decoration:none; display:block; border-bottom:1px solid #FFF; }
#side a:hover	{ width:100%; display:block; color:#F30; text-decoration:none; display:block; border-bottom:1px solid #F30; }

#side .now a,
#side .now a:link,
#side .now a:active,
#side .now a:visited{ display:block; color:#F60; text-decoration:none; display:block; border-bottom:1px solid #F60; }
#side .now a:hover	{ display:block; color:#F30; text-decoration:none; display:block; border-bottom:1px solid #F30; }



/* MAIN
=============================================================================== */
#main{
	width:70%;
	float:right;
	margin:0;
	padding:0;
}
.text{
	font-size:1.0em;
	margin:0px 15px 30px 0px;
	padding:0;
}
.text img{
	max-width: 100%;
	height: auto;
}

#main h2{
	font:bold larger/130% Arial, Helvetica, sans-serif;
	letter-spacing:0.03em;
	border-bottom:1px solid #000;
	margin:12px 0px 3px 0px;
	padding:0;
}
#main h3{
	clear:both;
	font:bold medium/130% Arial, Helvetica, sans-serif;
	margin:10px 0px 0px 0px;
	padding:0;
}

#main li{
	background:scroll url(img/ar.gif) left 0.4em no-repeat;
	font-family:Arial, Helvetica, sans-serif,'ヒラギノ角ゴ Pro W3', 'ＭＳ Ｐゴシック';
	margin:0;
	padding:0 0 0 15px;
}


/* Fex,Musical Instrumentsの設定
------------------------------------------------------------------------------- */
hr{ margin:40px 0; padding:0; }

.photo{ margin-top:10px; }
.photo img{ margin-right:10px; float:left; border-color:#CCC; }

.close{
	font-family:Arial, Helvetica, sans-serif;
	display:block;
	text-align:center;
	margin:10px 0;
	padding:0;
}

.page{ margin:0.5em 0; padding:1px 3px;; clear:both; }
a.page,
a:link.page,
a:active.page,
a:visited.page{ display:block; background-color:#9F3; color:#000; text-decoration:none; }
a:hover.page{ display:block; background-color:#FF0; color:#000; text-decoration:none; 	}

/* その他
------------------------------------------------------------------------------- */
/*.link dt a{ font-weight:bold; }*/
.link dd{ margin:0 0 1em 1em; }


.img{ float:right; margin-bottom:1.3em; margin-left:10px; }
.img-l{ float:left; margin-bottom:1.3em; margin-right:10px; }

.comment{ color:#666; }

.menu{
	border:2px dashed #CCC;
	margin:10px 0 1.5em 0;
	padding:5px 10px;
}
.menu h3{ margin:0; padding:0; }



/* CLEARFIX
------------------------------------------------------------------------------- */
.clearfix:after{
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}

.clearfix{ display:inline-block; }

/* Hides from IE-mac */
* html .clearfix{ height:1%; }
.clearfix{ display:block; }
/* End hide from IE-mac */