@charset "UTF-8";

*{ margin: 0; padding: 0; border:0; font-family: Meiryo UI, "メイリオ", Century Gothic, arial, helvetica, sans-serif;}

html{ text-align:center; color:#555;}

body{ text-align:left;}

a{ outline:none; text-decoration:none;}
a img {
	-webkit-transition: 0.3s ease-in-out;
	   -moz-transition: 0.3s ease-in-out;
	     -o-transition: 0.3s ease-in-out;
	        transition: 0.3s ease-in-out;
}
a:hover img{ opacity:0.7; filter: alpha(opacity=70);}

#contents{ width:900px; height:100%; margin:20px auto; margin-bottom:30px;}

#foot{ position: fixed !important; position: absolute; bottom:0px; width:100%; font-size:70%; padding:5px 0px; text-align:center; background-color:#000; border-top:1px solid #999; color:#FFF;}


#nav{ padding:20px 0px;}
#nav ul.parent{ width:100%;}
#nav ul.parent li{ float:left; list-style:none; margin:0px 5px; width:140px; position:relative; border-bottom:1px solid #999;}
#nav ul.parent li a{ color:#333; text-align:left; text-decoration:none; padding:5px 0px; font-size:80%; display:block; font-weight:bold;}
#nav ul.parent li a:hover{ color:#333; text-decoration:none; background-image:url(../images/more.png); background-position:right; background-repeat:no-repeat;}

#nav ul.navsub{ display:none; position:absolute; top:26px; left:-5px; padding-top:0px;}
#nav ul.navsub li{ background-image:url(../images/b50.png); border-bottom:none;}
#nav ul.navsub li a{ color:#FFF; font-weight:normal; padding:5px; font-size:0.7em; display:block;}
#nav ul.navsub li a:hover{ background-image:none; color:#BBB; padding:5px 5px;}

#nav2{ clear:both; margin-top:30px; border-top:1px solid #666;}
#nav2 ul{ margin:5px 0px; list-style:none}
#nav2 ul li.left{ float:left; padding:0px 0px 0px 4px;}
#nav2 ul li.right{ float:right; border-right:1px dotted #999;}
#nav2 ul li.right a{ color:#333; text-align:left;	text-decoration:none; padding:2px 5px; font-size:70%; display:block;}
#nav2 ul li.right a:hover{ color:#099; text-decoration:none;}


#side{ width:140px; padding-bottom:20px;}
#side ul{ width:100%;}
#side ul li.cap{ float:right; list-style:none; width:100%;}
#side ul li.cap:hover{}
#side ul li.cap a{ color:#000; text-align:left; text-decoration:none; font-size:65%; display:block; padding-top:15px;}
#side ul li.con{ float:left; list-style:none; width:100%; border-bottom:1px solid #aaa;}
#side ul li.con:hover{ border-bottom:1px solid #7298bf;}
#side ul li.con a{ color:#888; text-align:left; text-decoration:none; font-size:55%; display:block; padding:5px 0px;}
#side ul li a:hover{ color:#ddd; text-decoration:none; }


h1{ font-size:200%;}
h2{ font-size:120%; color:#888;}


/* labelにポイントしたとき、マウスカーソルを変える */
label { overflow: hidden; cursor: pointer;}
form #name { background-color:#F9F9F9; padding:2px; width:300px; border:1px solid #CCC;}
form #mail { background-color: #F9F9F9; padding:2px; width:300px; border:1px solid #CCC;}
form #tel { background-color: #F9F9F9; padding:2px; width:300px; border:1px solid #CCC;}
form #body { background-color: #F9F9F9; padding:2px; width:498px; min-width:300px; border:1px solid #CCC; overflow:hidden;}
form #button { border:1px solid #888; padding:3px 10px; background-image: url(../images/bbg.png); color:#FFF; font-size:95%;}