@charset "utf-8";
/*
	HMDT - Logic and Intuition
	(c) 2002-2007 HMDT
	http://hmdt.jp/
	
	Designed by Kei Sasaki
	http://nitram-nunca.com/
*/

/* Universal */
/* ---------------------------------------------------------------- */

* { margin: 0; border: none; padding: 0 }

body {
	background: #333333 url(resources/HMbg.gif) repeat-y 50% 0;
	color: #383838;
	font-size: 13px;
	font-family: "Lucida Grande", "Verdana", "Hiragino Kaku Gothic Pro W3", "ヒラギノ角ゴPro W3", "HiraKakuPro-W3", "Meiryo", "MS Pゴシック", Sans-Serif;
	line-height: 20px;
}

li { list-style: none }

/* Link Text Decoration */
/* ---------------------------------------------------------------- */

a { overflow: hidden }

a:link,
a:visited {
	color: #000000;
	border-bottom: 1px solid #AEAEAE;
	text-decoration: none;
}
a:active,
a:hover {
	color: #BF190D;
	border-bottom: 1px solid #BF190D;
}

#navigation a:link,
#navigation a:visited {
	border: none;
}
#navigation a:active,
#navigation a:hover {
	border: none;
}

#credits a:link,
#credits a:visited {
	border: none;
	color: #000000;
	font-weight: normal;
}
#credits a:active,
#credits a:hover { border-bottom: 1px solid #000000 }

#navigation a {
	display: block;
	font-size: 1px;
	line-height: 1px;
	text-indent: -9999px;
}

/* Base */
/* ---------------------------------------------------------------- */

#wrapper {
	background: url(resources/HMtopbar.gif) repeat-x 0 0;
	padding-top: 4px;
}

.canvas {
	width: 960px;
	margin: 0 auto;
}

.clear {
	clear: both;
}

/* Navigation */
/* ---------------------------------------------------------------- */

#navigation {
	height: 100px;
	background: url(resources/HMnavigation.gif) no-repeat 50% 100%;
}

#navigation ul {
	float: right;
	width: 163px;
	padding-top: 64px;
}

#navigation li { float: left }

#navigation li a { height: 36px }

li#refproducts {
	margin-right: 10px;
}

li#refabout a {
	width: 64px;
	background: url(resources/HMmenu.gif) no-repeat 0 0;
}

li#refproducts a {
	width: 89px;
	background: url(resources/HMmenu.gif) no-repeat -64px 0;
}

.about li#refabout a { background: url(resources/HMmenu.gif) no-repeat -64px -36px }
.product li#refproducts a { background: url(resources/HMmenu.gif) no-repeat -64px -36px }

#navigation h1 {
	float: left;
	width: 332px;
	padding-top: 39px;
}

#navigation h1 a {
	height: 61px;
	margin-left: 36px;
	background: url(resources/HMtoptitle.gif) no-repeat 0 0;
}

/* Main Content */
/* ---------------------------------------------------------------- */

#content {
	background: url(resources/HMcontentM.gif) repeat-y 50% 0;
}

.layout {
	background: url(resources/HMcontentT.gif) no-repeat 50% 0;
	padding: 12px 42px;
}

.section {
	padding: 16px 0;
}

/* 2 columns */

.duet {
	float: left;
	width: 426px;
}

.layout .leader {
	clear: both;
	margin-left: 0;
}
.layout .follower {
	margin-left: 22px;
}

/* 3 columns */

.trio {
	float: left;
	width: 274px;
}

.layout .dominant { margin-left: 0 }
.layout .subdominant { margin-left: 25px }
.layout .subordinate { margin-left: 25px }

.layout .showcase {
	clear: both;
}

/* generic elements */

.layout h2 {
	color: #C72418;
	padding: 20px 0 6px 0;
	font-size: 23px;
	height: 28px;
	text-shadow: 0 1px 0 #CCCCCC;
}

.layout h3 {
	color: #99221A;
	padding: 6px 0 6px 0;
	font-size: 15px;
	line-height: 22px;
}

.layout p,
.layout ul,
.layout ol,
.layout dl {
	padding: 6px 0;
}

.layout li,
.layout ol {
	padding-left: 14px;
	background: url(resources/HMlistItem.gif) no-repeat 0 6px;
}

.layout dt {
	padding-top: 6px;
	font-weight: bold;
}

.layout dt a {
	padding-left: 14px;
	background: url(resources/HMlistItem.gif) no-repeat 0 5px;
	border: none;
}
.layout dt a:active,
.layout dt a:hover {
	padding-left: 14px;
	background: url(resources/HMlistItemAdvanced.gif) no-repeat 0 5px;
}

.layout dd {
	padding: 3px 0 6px 0;
	font-size: 12px;
	line-height: 18px;
}

.layout hr {
	clear: both;
	height: 1px;
	margin: 12px 0;
	background: url(resources/HMdivider.gif) no-repeat 50% 100%;
}

/* custom class */

.layout .menu li {
	float: left;
	background: url(resources/HMiconPinDisabled.gif) no-repeat 0 3px;
	color: #999999;
	margin-right: 12px;
	padding-left: 18px;
	font-weight: bold;
	text-indent: 0;
}
.layout .menu li.current {
	background: url(resources/HMiconPinSelected.gif) no-repeat 0 3px;
	color: #BF190D;
}

.layout .cut {
	text-align: center;
}

.layout .cut img {
	border: 2px solid #E0E0E0;
	background: #EAEAEA;
	padding: 4px;
}

.layout .first {
	text-indent: 20px;
}

.layout .chat {
	background: #FBEEDA;
	border: 2px solid #F5DDBA;
	margin: 8px 0;
	padding: 6px 14px;
}

.layout .readnext {
	height: 16px;
	margin: 0;
	padding: 0 0 0 18px;
}
.layout .leader .readnext { background: url(resources/HMiconReadNextR.png) no-repeat 100% 50% }
.layout .follower .readnext { background: url(resources/HMiconReadNextB.png) no-repeat 100% 50% }

.caption {
	border: 2px solid #E0E0E0 !important;
	background: #EAEAEA !important;
	margin: 6px 0 !important;
	padding: 10px 12px !important;
	font-size: 12px !important;
	line-height: 18px !important;
}

.caption li {
	background: none;
	padding: 0;
}

.toc li {
	padding-top: 6px;
	padding-left: 0;
	font-weight: bold;
	text-indent: 0;
	background: none;
}

.toc li ul { padding-top: 2px }

.toc li li {
	padding-top: 0;
	font-size: 12px;
	font-weight: normal;
	line-height: 18px;
	text-indent: 48px;
}

.layout .reftop {
	margin: 0 !important;
	padding: 0 !important;
	text-align: center;
}

.layout .reftop a {
	background: url(resources/HMiconBackTop.gif) no-repeat 0 0;
	padding-left: 20px;
	border: none;
}
.layout .reftop a:active,
.layout .reftop a:hover {
	background: url(resources/HMiconBackTopActive.gif) no-repeat 0 0;	
}

.layout hr.bottom {
	margin: 0;
	background: transparent;
}

#content div.bottom {
	height: 6px;
	background: url(resources/HMcontentB.gif) no-repeat 50% 100%;
}

/* Credits */
/* ---------------------------------------------------------------- */

#credits {
	clear: both;
	background: url(resources/HMbodyM.gif) repeat-y 50% 0;
	font-size: 11px;
	line-height: 16px;
	text-shadow: 0 1px 0 #E0E0E0;
}

#credits ul {
	background: url(resources/HMbodyB.gif) no-repeat 50% 100%;
	padding: 8px 24px 18px 24px;
}

#contact { float: left }

#copyright { text-align: right }
