@charset "Shift_JIS";
@import "content.css";


/* ------------------------
SET DEFAULT reset browser settings
--------------------------- */

/*
reset.css - resets default browser styling
http://tantek.com/log/2004/09.html#d06t2354
http://www.vox.com/.shared/css/base.css
http://developer.yahoo.com/yui/reset/
*/

:link,:visited {
text-decoration:none;
}
html,body,div,
ul,ol,li,dl,dt,dd,
form,fieldset,input,textarea,
h1,h2,h3,h4,h5,h6,pre,code,p,blockquote,hr,
th,td {
margin:0;
padding:0;
}
h1,h2,h3,h4,h5,h6 {
font-size:100%;
font-weight:normal;
}
table {
border-spacing:0;
}
fieldset,img,abbr,acronym {
border:0;
}
address,caption,cite,code,dfn,em,strong,b,u,s,i,th,var {
font-style:normal;
font-weight:normal;
}
ol,ul {
list-style:none;
}
caption,th {
text-align:left;
}
q:before,q:after {
content:'';
}
a {
text-decoration:underline;
outline:none;
}
hr {
border:0;
height:1px;
background-color:#000;
color:#000;
}
a img,:link img,:visited img {
border:none;
}
address {
font-style:normal;
}

/*---------------------*/
* {
padding: 0;
margin: 0;
}
img { border: none; }
form { margin: 0; }

/* ------------------------
FONTS and COLORS
--------------------------- */
body {
font-family: 'Hiragino Kaku Gothic Pro','Lucida Grande',sans-serif;
color: #000;
font-size: 100%;
}

#header { font-size: 0.8em; }
#content-info { font-size: 0.8em; }
#main-content { font-size: 0.9em; }
#main-menu { font-size: 0.9em; }
#content-footer { font-size: 0.85em; }
#footer { font-size: 0.8em; }
#error { font-size: 0.9em; }

h1, h2, h3, h4, h5, h6 {color: #000; font-weight: bold;}

strong {
color: #000;
font-weight: bold;
padding: 0px 2px;
}

a:link { color: #00C; text-decoration: underline; }
a:visited { text-decoration: underline; }
a:hover { color: #00C; text-decoration: none; }
a:active { color: #F30; text-decoration: none; }


.caption { color: #000; font-size: 0.75em; }
/* ------------------------
BACKGROUND
--------------------------- */
body { background: url(../img/bg_body.gif) left top repeat; }

/* ------------------------
LAYOUT
--------------------------- */
#container {
position: relative; /* center on everything else */
background-color: #FFF;
height: auto;
width: 800px;
margin: 0 auto;
}

#header-inner,
#content-info-inner,
#content-inner,
#content-footer-inner,
#footer-inner {
margin-left: auto;
margin-right: auto;
text-align: left;
height: 100%;
width: 780px;
}
#header {
clear:both;
position: relative;
width: auto;
height: 80px;
background: url(../img/bg_header.gif) left bottom repeat-x;
}
*html #header {
height: 70px; /*for IE*/
}
#header-inner {
position: relative;
height: 100%;
padding: 10px;
}

#content-info {
position: relative;
width: auto;
height: 20px; /*22-2*/
background-color: #FEEBDD;
}
#content-info-inner {
position: relative;
padding: 2px 10px 0 10px;
text-indent: 10px;
background: url(../img/ico_home.gif) left 4px no-repeat;
margin-left: 10px;

width: 760px
}

#content {
position: relative;
width: auto;
height: auto;
}
#content-inner {
position: relative;
overflow: hidden;
padding: 10px 10px 5px 10px;

}

#content-footer {
clear: both;
position: relative;
width: auto;
min-height: 35px;
}
#content-footer-inner {
position: relative;
background: none;
padding: 0 10px 0 10px;
}

#footer {
clear: both;
position: relative;
width: auto;
height: 40px;
}
#footer-inner {
position: relative;
background: url(../img/bg_footer.gif) left top repeat-x;
height: 100%;
padding: 0 10px 0 10px;
}

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

#error {
padding: 40px;
}
#error p {
padding-top: 20px;
line-height: 1.5;
}

/*------COLUMNS-----*/

#main-menu, #main-content {
display: inline;
float: left;
}

#main-menu-inner, #main-content-inner {
position: static;
}

#main-menu-inner, #main-content-inner {
overflow: hidden;
}

/* content-page with menu*/
.layout-menu-content #main-menu {
width: 200px;
}

.layout-menu-content #main-content {
width: 570px;
padding-left: 10px;
}


/* content-page without menu*/
.layout-content.error-page #content #content-inner {
padding: 20px;
height: 400px;
}


/* ------------------------
HEADER
--------------------------- */
#title {
position: absolute;
left: 15px;
top: 10px;
width: 265px;
height: 58px;
}

#header-info {
position: relative;
float: right;
width: 400px;
height: auto;
text-align: right;
padding-top: 15px;
}
#header-info #rss {
padding-bottom: 3px;
}
#header-info #rss img {
vertical-align: bottom;
}
#header-info li {
float: right;
}
#header-info li a {
padding-left: 10px;
padding-right: 10px;
background: url(../img/li_dia_orange.gif) left center no-repeat;
}
#header-info li.first a {
padding-right: 0;
}


/* ------------------------
CONTENT FOOTER
--------------------------- */
#footer-logo {
position: relative;
float: left;
width: 150px;
height: 35px;
float: left;
}

#pagetop {
position: relative;
float: right;
text-align: right;
width: 540px;
height: auto;
padding-top: 20px
}

/* ------------------------
FOOTER
--------------------------- */

#footer-info {
position: relative;
float: left;
width: 340px;
height: auto;
padding-top: 10px;
}
#footer-info ul li {
float: left;
display: block;
padding-left: 12px;
padding-right: 10px;
background: url(../img/li_dia_orange.gif) no-repeat left center;
}
#copyright {
position: relative;
float: right;
text-align: right;
width: 440px;
height: auto;
}
#copyright span {
padding-top: 10px;
display: block;
}


/* ------------------------
MAIN MENU
--------------------------- */

#main-menu {
height: auto;
}
#main-menu-inner {
width: 100%;
}

.sub-menu {
width: 198px;
border-left: #FF0000 1px solid;
border-right: #FF0000 1px solid;
background-color: #FCF8EC;
}
ul.sub-menu-list {
padding: 5px;
}
ul.sub-menu-list li {
	display: block;
	height: auto;
	padding-left: 20px;
	padding-bottom: 5px;
	background-image: url(../img/li_main-menu.gif);
	background-repeat: no-repeat;
	background-position: left 5px;
}
.main-menu-box {
	margin-bottom: 6px;
}
.main-menu-bottom {
width: 200px;
}