@charset "UTF-8";

/* _____________________________________Header_____ */

#header {
	position: relative; z-index: 3;
	background: url("../images/bg_hd.gif") no-repeat;
	width: 744px; margin: 0 32px 0 32px;}
#header h1 { height: 67px;}
#header #utility {
		position: absolute; top: 8px; right:12px;
		vertical-align: middle; margin-left: 200px;}
#header #utility ul { padding: 5px 100px 5px 10px; background-color: #966EB6;}
#header #utility ul li {
		display: inline;
		background: url("../images/hdu_line.gif") repeat-y;
		margin: 0 5px 0 8px; padding: 0 0 0 8px;}
#header #utility ul li a:link, #header #utility ul li a:visited { color: #FFFFFF; text-decoration: none;}
#header #utility ul li a:hover, #header #utility ul li a:active { color: #C3B2D4; text-decoration: none;}

#header #utility #jp { position: absolute; top: 4px; right:47px; bottom: 4px; text-indent: -9999px;}
#header #utility #jp a {
		display: block; width: 44px; height: 15px;
		background: url("../images/b_jhd_en.gif") no-repeat; text-decoration: none; overflow: hidden;}
#header #utility #jp a:hover { background-position: 0 -15px;}

#header #commu { position: absolute; top: 40px; left: 642px; text-indent: -9999px;}
#header #commu a {
		display: block; width: 92px; height: 21px;
		background: url("../images/b_jhd_commu.gif") no-repeat; text-decoration: none; overflow: hidden;}
#header #commu a:hover { background-position: 0 -21px;}

#header #gnavi {
		position: absolute; z-index: 4;
		top: 40px; left: 134px; width: 499px; height:41px;
		background: url("../images/bg_gnavi.gif") no-repeat;}
#header #gnavi ul {
		margin: 0 0 0 11px;}
#header #gnavi ul li {
		position: relative; float: left; height:41px;
		background: url("../images/bg_hd_gradation.gif") no-repeat right top;}
#header #gnavi ul li a:link, #header #gnavi ul li a:visited {
		display: block;
		position: relative; float: left; height:41px;
		color: #FFFFFF; text-decoration: none; font-weight: bold;
		background: url("../images/bg_hd_gradation.gif") no-repeat;
		background-position: 0 0;
		padding: 7px 10px 10px 12px; margin: 0 3px 0 0;}
#header #gnavi ul li a:hover, #header #gnavi ul li a:active {
		display: block;
		position: relative; float: left; height:41px;
		color: #FFFFFF; text-decoration: none; font-weight: bold;
		background: url("../images/bg_hd_gradation.gif") no-repeat;
		background-position: 0 -82px;
		padding: 7px 10px 10px 12px; margin: 0 3px 0 0;}
#pagewhy #header #gnavi ul li#why a,
#pageproducts #header #gnavi ul li#products a,
#pagedownloads #header #gnavi ul li#downloads a,
#pagesupport #header #gnavi ul li#support a,
#pagepress #header #gnavi ul li#press a,
#pageabout #header #gnavi ul li#about a {
		background-position: 0 -164px; color: #663399;}

#subwhy {
	position: absolute; z-index: 5;
	top: 80px; left: 134px; width: 158px;
	background: url("../images/bg_hdn_b.png") no-repeat bottom;
	visibility: hidden;}
#subprod {
	position: absolute; z-index: 5;
	top: 80px; left: 213px; width: 158px;
	background: url("../images/bg_hdn_b.png") no-repeat bottom;
	visibility: hidden;}
#subpress {
	position: absolute; z-index: 5;
	top: 80px; left: 361px; width: 158px;
	background: url("../images/bg_hdn_b.png") no-repeat bottom;
	visibility: hidden;}

.gnavilocal { }
.gnavilocal ul {
		margin: 0; padding: 6px 8px 10px 8px;
		background: url("../images/bg_hdn_t.png") no-repeat;}
.gnavilocal ul li { display: inline; font-weight: bold; line-height: 1.1;}
.gnavilocal ul li a:link, .gnavilocal ul li a:visited {
		display: block; color: #FFFFFF;
		margin:  3px 0 3px 0; padding: 5px 3px 5px 3px;}
.gnavilocal ul li a:hover, .gnavilocal ul li a:active {
		display: block;
		background-color: #333333; color: #FFFFFF;
		margin: 3px 0 3px 0; padding: 5px 3px 5px 3px;
		text-decoration: none;}

/* _____________________________________Footer_____ */

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

#footer {
	clear: both; color: #666666;
	margin: 0 32px 0 32px; padding: 30px 0 0 0;}

.totop { float: right; position: relative; text-align: right; width: 76px;}
#content .totop { padding: 10px 0 20px 0;}
.totop a {
		display: block; width: 76px; height:13px;
		background: url("../images/b_totop.gif") no-repeat; overflow:hidden;}
.totop a:link, #footer .totop a:visited { background-position: 0 0;}
.totop a:hover { background-position: 0 -13px;}
.totop a:link span, .totop a:visited span, .totop a:hover span {
		position: absolute; left: -9999px;}

#footer .logo { float: left; width: 200px; margin: 0 0 5px 0;}

#footer .privacy { border-top: 1px solid #666666;}
#footer .privacy ul { float:left; width: 350px; margin: 8px 0 0 1px; padding: 0 0 20px 0;}
#footer .privacy ul li {
		display: inline;
		background: url("../images/linev_foot.gif") repeat-y left;
		margin: 0 10px 0 0; padding: 0 0 0 8px; line-height: 1.5;}

address { float: right; text-align: right; width: 350px; margin: 8px 0 0 1px; padding: 0 0 20px 0;}