@charset "UTF-8";

/* --------------------------------------------------------------------
# ヘッダーナビ #
-------------------------------------------------------------------- */ 

ul#header-nav {
margin: 0;
padding: 0;
position: absolute;
z-index: 3;
left: 0;
top: 0px;
height: 53px;
} 

ul#header-nav li {
  display: inline;
  margin: 0;
  padding: 0;
  }
ul#header-nav li a {
display: block;
height: 53px;
float: left;
margin: 0;
padding: 0;
text-indent: -2000em;
font-size: 1px;
color: white;
text-decoration: none ! important;
overflow: hidden; 
}

ul#header-nav li.navi1 a {
background-image: url(../images/navi/navi01.gif);
background-repeat: no-repeat;
background-position: left top;
width: 118px;
}

ul#header-nav li.navi2 a {
background-image: url(../images/navi/navi02.gif);
background-repeat: no-repeat;
background-position: left top;
width: 119px;
}
ul#header-nav li.navi3 a {
background-image: url(../images/navi/navi03.gif);
background-repeat: no-repeat;
background-position: left top;
width: 119px;
}
ul#header-nav li.navi4 a {
background-image: url(../images/navi/navi04.gif);
background-repeat: no-repeat;
background-position: left top;
width: 119px;
}
ul#header-nav li.navi5 a {
background-image: url(../images/navi/navi05.gif);
background-repeat: no-repeat;
background-position: left top;
width: 119px;
}

ul#header-nav li.navi6 a {
background-image: url(../images/navi/navi06.gif);
background-repeat: no-repeat;
background-position: left top;
width: 119px;
}

ul#header-nav li.navi7 a {
background-image: url(../images/navi/navi07.gif);
background-repeat: no-repeat;
background-position: left top;
width: 119px;
}

ul#header-nav li.navi8 a {
background-image: url(../images/navi/navi08.gif);
background-repeat: no-repeat;
background-position: left top;
width: 118px;
}


ul#header-nav li.navi1 a:hover, 
ul#header-nav li.navi2 a:hover, 
ul#header-nav li.navi3 a:hover,
ul#header-nav li.navi4 a:hover,
ul#header-nav li.navi5 a:hover, 
ul#header-nav li.navi6 a:hover,
ul#header-nav li.navi7 a:hover,
ul#header-nav li.navi8 a:hover { background-position: left bottom; text-decoration: none ! important;}

ul#header-nav.here1 li.navi1 a { background-position: left bottom; text-decoration: none ! important;}
ul#header-nav.here2 li.navi2 a { background-position: left bottom; text-decoration: none ! important;}
ul#header-nav.here3 li.navi3 a { background-position: left bottom; text-decoration: none ! important;}
ul#header-nav.here4 li.navi4 a { background-position: left bottom; text-decoration: none ! important;}
ul#header-nav.here5 li.navi5 a { background-position: left bottom; text-decoration: none ! important;}
ul#header-nav.here6 li.navi6 a { background-position: left bottom; text-decoration: none ! important;}
ul#header-nav.here7 li.navi7 a { background-position: left bottom; text-decoration: none ! important;}
ul#header-nav.here8 li.navi8 a { background-position: left bottom; text-decoration: none ! important;}

/* --------------------------------------------------------------------
# ヘッダーサブナビ #
-------------------------------------------------------------------- */ 

ul#sub-nav {
margin: 0;
padding: 0;
position: absolute;
z-index: 3;
left: 10px;
top: 0px;
height: 20px;
  } 

ul#sub-nav li {
  display: inline;
  margin: 0;
  padding: 0;
  }

ul#sub-nav li a {
display: block;
height: 20px;
float: left;
padding: 0;
text-indent: -3000em;
font-size: 1px;
color: white;
text-decoration: none ! important;
margin-top: 0;
margin-right: 2px;
margin-bottom: 0;
margin-left: 0;
  }
  
ul#sub-nav li.navi1 a {
background-image: url(../images/navi/sitemap.gif);
background-repeat: no-repeat;
background-position: left top;
width: 99px;
margin:0 3px 0 70px;
}

ul#sub-nav li.navi2 a {
background-image: url(../images/navi/privacy.gif);
background-repeat: no-repeat;
background-position: left top;
width: 183px;
}

ul#sub-nav li.navi3 a {
background-image: url(../images/navi/contact.gif);
background-repeat: no-repeat;
background-position: left top;
width: 70px;
}  
ul#fontChange {
position: absolute;
z-index: 3;
left: 367px;
top: -2px;
height: 22px;
padding-left: 95px;
background-image: url(../images/_share/font_title.gif);
background-repeat: no-repeat;
background-position: left top;
}
#fontChange li {
float: left;
  margin-right: 2px;
  cursor: pointer;
}
#fontChange li a {
display: block;
background-repeat: no-repeat;
background-position: left top;
text-indent: -9999px;
overflow: hidden;
text-decoration: none;
font-size: 1px;
line-height: 1px;
}
#fontChange #fontS a {
width: 19px;
height: 19px;
margin-top: 3px;
background-image: url(../images/_share/font_s.gif);
}
#fontChange #fontM a {
width: 21px;
height: 21px;
margin-top: 1px;
background-image: url(../images/_share/font_m.gif);
}
#fontChange #fontL a {
width: 22px;
height: 22px;
background-image: url(../images/_share/font_l.gif);
}
#fontChange li a:hover {
background-position: left bottom;
}
.fontS #fontChange #fontS a {background-position: left bottom;}
.fontM #fontChange #fontM a {background-position: left bottom;}
.fontL #fontChange #fontL a {background-position: left bottom;}


/* --------------------------------------------------------------------
# フッターナビ #
-------------------------------------------------------------------- */

#footer ul {
line-height: 16px;
font-size: 16px;
font-weight: normal;
color: #FFFFFF;
height: 16px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
padding: 0px;
width: 980px;
text-align: center;
white-space: nowrap;
}

#footer li {
margin: 0px;
list-style-type: none;
padding-right: 1em;
padding-left: 1em;
background-position: 0em 0.7em;
border-right-width: 1px;
border-right-style: solid;
border-right-color: #FFFFFF;
display: inline;
}

#footer li#first {
background-image: none;
border-left-width: 1px;
border-left-style: solid;
border-left-color: #FFFFFF;
}

#footer li a {
color: #FFFFFF;
text-decoration: none;
}

#footer li a:hover {
color: #00FFFF;
text-decoration: underline;
}