@charset "shift_jis";

/* ------------------------- TOC 
Setup
CSS Hack
multi column

layout
header
main_col
sub_col
footer

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

/* ============================== Setup */
* { color: #444444; font-family: "�q���M�m�p�S Pro W3", "Hiragino Kaku Gothic Pro", "�q���M�m�ۃS Pro W4", "Hiragino Maru Gothic Pro", Osaka, "���C���I", "MS PGothic", sans-serif; background-repeat: no-repeat; font-size: small; font-style: normal; line-height: 1.4em; text-decoration: none; font-weight: normal; }
body, div, h1, h2, h3, h4, h5, h6, p, blockquote, hr, ul, ol, li, dl, dt, dd, dir, menu, table, th, td, thead, tbody, tfoot, caption, form, fieldset, legend, isindex, embed, object, pre { margin: 0; padding: 0; border: 0; text-align: left; }
ul, ol, dl, li, dt, dd { list-style: none; }
table { border-collapse:collapse; border-spacing:0; font-size: 100%; }
th, td { vertical-align: top; }
strong { font-weight:bold; }
img { border: 0; vertical-align: bottom; }
a { border: 0; }

a { color: #0066cc; text-decoration: underline; }
a:link { color: #0066cc; text-decoration: underline; }
a:visited { color: #0066cc; text-decoration: underline; }
a:hover, a:active { color: #0066cc; text-decoration: none; }
a img, a:link img, a:visited img, a:hover img, a:active img { border: none; text-decoration: none; }


/* ============================== CSS Hack */
/* floating box clear */
.clr:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clr { display: inline-table; min-height: 1%; }
/* Hide from mac IE5 \*/
* html .clr { height: 1%; }
.clr { display: block; }
/* End Hide from mac IE5 */

/* hide text */
.hidetxt { text-indent: -9999px; overflow: hidden; }
.hidetxt a { overflow: hidden; }


/* ============================== multi column */
.multicol { } /* necessary - clr class */
.leftcol { float: left; }
.rightcol { float: right; }


/* ============================== layout */
body {
	margin: 0;
	padding: 0;
	background: url(/img/bg_container.jpg) repeat-y 50% 0;
	color: #ffffff;
	text-align: center;
}

#container {
	width: 786px;
	margin: 0 auto;
	padding: 0;
	background: url(/img/bg_container.jpg) repeat-y 50% 0;
	text-align: left;
}

#contents {
	width: 740px;
	margin: 10px 23px 0;
}



/* ============================== header */
#header {
	margin: 0;
	padding: 0 23px;
}

#header h1,
#header p#logo {
	float: left;
	width: 134px;
	margin: 20px 10px 10px;
	padding: 0;
}


/*header-nav
---------------------------------*/
ul#header-nav {
	float: right;
	width: 200px;
	padding: 0;
	margin-top: 40px;
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0;
}

ul#header-nav li {
	float: left;
	padding: 0 6px 2px;
}

ul#header-nav li a{
    text-decoration:none;
	font-size:small;
	color:#999;
}

/*headline
---------------------------------*/
#headline h2{
	float: center;
	width: 696px;
	margin: 0 22px 10px;
	padding: 0;
}



/*global nav
---------------------------------*/
#gn {
	width: 740px;
	margin: 2px 0 0;
	background:#999;
}

#gn li {
  float:left;
  display:block;
  width:140px;
  padding:3px 3px 1px;
  text-align:center;
  line-height:150%;
  list-style-type:none;
  border:#ccc solid 1px;
}

#gn li a{
  display:block;
  width:100%;
  color:#fff;
  background:#999;
  text-decoration:none
}

#gn li a:hover{
  color:#fc6;
}


/*bread crumbs
---------------------------------*/
#contents #bread-crumbs p {
	margin: 0;
	padding: 0px 0 5px 22px;
	text-align: left;
}

#contents #bread-crumbs a,
#contents #bread-crumbs p {
	font-size: x-small;
}



/* ============================== main_col */
#main-col {
	float: left;
    width: 400px;
	margin: 10px 0 0;
	padding: 0;
}

/* ============================== footer */
#footer {
	clear: both;
	padding: 0;
	text-align: left;
	width: 740px;
	margin: 10px 23px 0;
	background-color:#999999;
}

#footer p{
    text-align:center;
	padding:5px 0 2px;
	color:#FFFFFF;
}