@charset "utf-8";

/*********************************************
Copyright(C)TOKUSO GROUP All Rights Reserved.
*********************************************/

/* base 1 ********************************************/

body{
	margin: 0;
	padding: 0;
	line-height: 160%;
	color: #333;
	background: #000;
	font-family: Meiryo, Verdana, "メイリオ", "ＭＳ Ｐゴシック", Hiragino Kaku Gothic Pro, Osaka;
	font-size: 78%;
	text-align:center;
}

#container{
	padding: 15px 0 0;
	background: #d0d0d8 url(../../files/bg.gif) top center repeat-x;
}

.wrap{
	margin:0 auto;
	padding: 0;
	width: 900px;
	text-align:left;
}

#header{
	background: url(../../files/header.gif);
}

#navi_top{
	margin: 35px 0 0;
	float: right;
	width: 220px;
	height: 25px;
}

#contents{
	margin: 0 0 20px;
	padding: 0;
	float: right;
	width: 660px;
	background: url(../../files/cts_2.gif);
	text-align: left;
}

#navi_left{
	margin: 0 0 20px;
	padding: 0;
	float: left;
	width: 220px;
	background: url(../../files/left_2.gif) top left;
}

#footer{
	margin: 0;
	padding: 0;
	clear: both;
	background: url(../../files/footer.gif) top repeat-x;
}

/* base 2 ********************************************/

h1{ font-size: 12px;}

h2{
	margin: 0 0 15px;
	padding: 0 36px;
	clear: both;
	color: #b2b2b8;
	background: url(../../files/h2.gif) left top;
	line-height: 30px;
	font-size: 14px;
}

h3{
	margin: 0 0 13px;
	padding: 0 0 0 20px;
	background: url(../img/h3.gif) left center;
	line-height: 16px;
	font-size: 14px;
}

h2 span{ margin: 0 0.5em 0 0; color: #8686d1;}
h3 span{ margin: 0 0.5em 0 0; color: #01767c;}

a{ color: #2b2b9b; text-decoration: underline;}
a:hover{ text-decoration: none;}

img{ border: none;}

p{ margin: 0 0 0.5em;}

#header span, #navi_left span, #footer span, .pagetop span{ display: none;}
#contents h1, .info h2, #copy{ text-indent: -9000px;}

/* --- space & font --- */

.cntr{ text-align: center;}
.rght{ text-align: right;}
.left{ text-align: left;}

.sp0{ margin: 0;}
.sp1{ margin: 0 0 1.5em;}
.sp2{ margin: 15px 0;}
.sp3{ margin: 18px 0 13px;}
.sp4{ margin: 10px 0 0;}

.sz1{ font-size: 84%; line-height: 150%;}
.sz2{ font-size: 110%; line-height: 170%;}
.sz3{ line-height: 26px;}
.sz3 img{ margin: 0 0 0 10px; vertical-align: middle;}

.red{ color: #b82e5f;}

.cl{ clear: both;}

/* --- images --- */

.img_1{ margin: 3px 0 10px 20px; float: right;}
.img_2{ margin: 3px 5px 0 0; float: left;}
.img_3{ margin: 0 8px 0 20px; vertical-align: middle;}
.img_4{ margin: 0 8px 0 0; vertical-align: middle;}

/* --- GET HIGHT --- */

.hght{
	display: block;
	min-height: 0;
}
.hght:after{
	content: " ";
	display: block;
	visibility: hidden;
	clear: both;
	height: 0.1px;
	font-size: 0.1em;
	line-height: 0;
}
* html .hght{ display: inline-block;}
/* exclude ie mac \*/
* html .hght{ height: 1%;}
/* all brouser */

/* --- PRINT --- */

@media print {
body { _zoom: 0.8;}
}

/* header ********************************************/

#header .wrap{
	height: 85px;
	position: relative;
}
.header_e{ background: url(../../files/header_e.gif);}

#header h1{ margin: 16px 0 0; float: left;}
#header a, #header li{ display: block;}
#header h1, #header h1 a{ width: 295px; height: 52px;}

/* --- navi_top --- */

#navi_top ul{
	margin: 0;
	padding: 0;
	list-style-type: none;
}
#navi_top li, #navi_top a{
	margin: 0;
	padding: 0;
	width: 110px;
	height: 25px;
}
#navi_top li{ float: left;}
.header_e #navi_top,
.header_e #navi_top a:hover{ background-image: url(../../files/header_e_navi.gif);}
.header_e #t1 a:hover{ background-position: 0 25px;}
.header_e #t2 a:hover{ background-position: 110px 25px;}

/* navi_left ********************************************/

#navi_left a{ color: #b2b2b8;}

#navi_left_in1{
	padding: 10px 0 0;
	background: url(../../files/left_1.gif) no-repeat top left;
}
#navi_left ul{
	margin: 0 0 10px;
	padding: 0 10px;
	_padding: 0 9px 0 10px;
	list-style:none;
}
#navi_left ul#end{ margin: 0;}

#navi_left li, #navi_left li a{
	padding: 0;
	display: block;
	height: 34px;
}
#navi_left li{
	margin: 0 6px 0 8px;
	border-left: 1px solid #404046;
	border-bottom: 1px solid #404046;
	width: 186px;
	background: url(../../files/left_li_s.gif) right center no-repeat;
	line-height: 34px;
	vertical-align: bottom;
}
#navi_left li a{
	margin: 0;
	width: 186px;
	text-decoration: none;
	text-indent: 20px;
}
#navi_left li a:hover{
	background: url(../../files/left_li_s_r.gif) right center no-repeat;
	text-decoration: underline;
}

#navi_left li.category,
#navi_left li#start_e{
	margin: 0;
	border: none;
	width: 200px;
	height: 40px;
	line-height: 40px;
	font-weight: bold;
}
#navi_left li.category{ background: url(../../files/left_li_l.gif) 0 0;}
#navi_left li#start_e{ background: url(../../files/left_li_e.gif) 0 0;}


#navi_left li#start_e a,
#navi_left li.category a{
	margin: 0 0 -2px;
	width: 200px;
	height: 40px;
}
#navi_left li.category a{ text-indent: 12px;}
#navi_left li.category a:hover{ background: url(../../files/left_li_l.gif) 0 40px;}
#navi_left li#start_e a:hover{ background: url(../../files/left_li_e.gif) 0 40px;}

#navi_left_in2{
	padding: 20px 22px 22px;
	color: #676773;
	background: url(../../files/left_3.gif) bottom left no-repeat;
}
#navi_left_in2 p{
	margin: 1em 0;
	line-height: 150%;
	font-size: 90%;
}
#navi_left_in2 a:hover{ color: #d0d0d8; text-decoration: underline;}
#navi_left img{ margin: 5px 0 0; vertical-align: bottom;}

/* contents ********************************************/

#contents_h1{
	padding: 25px;
	background: url(../../files/cts_1.gif) no-repeat top;
}

#contents h1{
	margin: 0 0 5px;
	line-height: 55px;
	height: 55px;
}

#contents h1#e_index{
	margin: 0 0 5px;
	height: 230px;
	text-indent: 0;
}

#contents_in{
	padding: 0 25px 10px;
	_height: 450px;
	min-height: 450px;
	background: url(../../files/cts_3.gif) no-repeat bottom;
}

.article{ padding: 0 5px 25px; clear: both;}

.article_BD{
	padding: 10px;
	border: solid 1px #b4b4c1;
	clear: both;
	text-align: center;
	font-size: 110%;
}
.article_BD h3, .article_BD p{ text-align: left;}
.article_BD h3{ margin: 3px 3px 7px; background: url(../../files/h3_d.gif) left no-repeat;}
.article_BD p{ margin: 0 10px; font-size: 90%;}

a.banner img{ border: 1px solid #8080b8;}

/* --- list --- */

#contents ol{ margin: 0 0 0.5em 1em; padding: 0 0 0 1em;}

.dl1{ margin: 0 0 0.5em 10px;}
.dl1 dt{
	padding: 0 0 0 20px;
	clear: both;
	float: left;
	width: 15em;
	background: url(../../files/h3_a.gif) no-repeat left;
}
.dl1 dt, .dl1 dd{ margin: 0 0 0.2em;}

/* --- pagetop --- */

.pagetop{
	margin: -10px 0 15px 510px;
	clear: both;
	height: 20px;
	background: url(../../files/btn_pagetop.gif)
}
.pagetop a{
	display: block;
	width: 100px;
	height: 20px;
}

/* --- [index] --- */

#banners_A{ margin: 10px 0 8px 1px;}
#banners_B{ margin: 0 0 0 22px;}
#banners_A img, #banners_B img{ margin: 0 8px 0 0;}
#banners_B img#end{ margin: 0;}

#topics{ margin: 0 5px 25px; line-height: 150%;}
#topics div{ margin: 0; clear: both;}
#topics .hght{ margin: 0 0 3px; background: url(../../files/line_1.gif) no-repeat bottom left;}
#topics .hght div{
	padding: 0 0 3px 10px;
	float: left;
	clear: none;
	width: 85px;
}
#topics p{ margin: 0 10px 3px 0; padding: 0; float: right; width: 490px;}
#topics .more{ text-align: right;}
#topics .more img{ margin: 5px 0 0;}

/* --- h1 --- */

.stock h1{ background: url(../stock/img/h1.gif);}
.parts h1{ background: url(../parts/img/h1.gif);}
.our_services h1{ background: url(../our_services/img/h1.gif);}
.how h1{ background: url(../how/img/h1.gif);}
.faq h1{ background: url(../faq/img/h1.gif);}
.about h1{ background: url(../about/img/h1.gif);}
.contact h1{ background: url(../contact/img/h1.gif);}
.topics h1{ background: url(../topics/img/h1.gif);}

/* --- tables --- */

table{ word-break: break-all;}

#list_select{
	margin: 0 5px 10px;
	text-align: right;
}
#list_select select{ font-size: 12px;}
#list{
	margin: 0 5px 20px;
	background: url(../img/table_2.gif);
}
#list table{
	width: 600px;
	border-bottom: #949498 solid 1px;
	background: url(../img/table_1.gif) no-repeat top;
}
#list table, #list table th, #list table td{ margin: 0; border-collapse: collapse;}
#list table th{
	padding: 3px;
	height: 22px;
	border-left: #bcbcc2 solid 1px;
	line-height: 22px;
	font-weight: normal;
	font-size: 11px;
	text-align: center;
}
#list table td{
	padding: 3px;
	border-left: #bcbcc2 solid 1px;
	border-top: #bcbcc2 solid 1px;
	text-align: center;
	font-size: 12px;
	line-height: 135%;
}
#list table th.l,#list table td.l{ border-left: none;}
#list table td.l_idt{
	padding: 0 20px;
	width: 35%;
	border-left: none;
	font-weight: bold;
	text-align: left;
}
#list table img{ vertical-align: middle;}

#list .pcs{
	border-left: none;
}

/* --- [STOCK LIST]  --- */

.stock .fl_l, .stock .fl_r{ margin: 10px 0 20px;}
.stock .fl_l{
	float: left;
	width: 320px;
	background: url(../stock/img/bg_photo.gif);
	text-align: center;
}
.stock .fl_l img{ vertical-align: bottom;}
.stock .fl_r{
	float: right;
	width: 260px;
	line-height: 170%;
	font-size: 11px;
}

.stock .fl_r div{ margin: 0; clear: both;}
.stock .fl_r .hght{
	margin: 0 0 3px;
	background: url(../../files/line_2.gif) no-repeat bottom left;
}
.stock .fl_r .hght div{
	padding: 0 0 3px 3px;
	float: left;
	clear: none;
	width: 110px;
}
.stock .fl_r p{ margin: 0 10px 3px 0; padding: 0; float: right; width: 130px;}
.stock .fl_r strong{ font-size: 12px;}

.stock #thumb{
	margin: 0 0 15px;
	clear: both;
	height: 38px;
	background: url(../stock/img/bg_photo.gif);
}
.stock #thumb img{ margin: 0 10px 0 0; float: left;}
.stock #thumb img#thumb_end{ margin: 0;}
.stock .article{ padding: 0 5px 20px;}
.stock .article_BD{
	margin: 0 0 15px;
	padding: 6px 12px;
	border: solid 1px #949498;
	text-align: left;
}
.stock .article_BD p{ margin: 0 0 0 70px;}
.stock #memo1{ background: url(../stock/img/memo_1.gif) no-repeat 0 3px;}
.stock #memo2{ background: url(../stock/img/memo_2.gif) no-repeat 0 3px;}
.stock #memo3{ background: url(../stock/img/memo_3.gif) no-repeat 0 3px;}

#detail{ clear: both; border-bottom: #949498 solid 1px;}
#detail table{
	width: 600px;
	border-top: #949498 solid 1px;
	border-left: #949498 solid 1px;
	border-right: #949498 solid 1px;
	font-size: 11px;
	line-height: 150%;
}
#detail table, #detail th, #detail td{ margin: 0; border-collapse: collapse;}
#detail th, #detail td{
	padding: 4px 10px;
	width: 16.6%;
	border-top: #bcbcc2 solid 1px;
	text-align: left;
}
#detail th{
	background: #dbdbe4 url(../stock/img/table_3.gif) top left no-repeat;
	font-size: 10px;
}

div.plink{
	margin: 0 auto;
	text-align: center;
}
div.plink span, div.plink a{
	margin: 4px;
}

/* --- [OUR SERVICES]  --- */

.our_services .fl_l{
	margin: 0 0 5px;
	float: left;
	width: 240px;
}
.our_services .fl_r{
	margin: 5px 0;
	float: right;
	width: 340px;
}

.faq p{ padding: 0 0 1em 20px;}

.faq .article{ padding: 0 5px 10px;}


/* --- [ABOUT US]  --- */

.about .article{ line-height: 180%;}
.about .article div{ margin: 0; clear: both;}
.about .article .hght{ margin: 0 0 3px; background: url(../../files/line_3.gif) no-repeat bottom left;}
.about .article .hght div{
	padding: 0 0 3px 10px;
	float: left;
	clear: none;
	width: 175px;
}
.about .article p{ margin: 0 10px 3px 0; padding: 0; float: right; width: 390px;}


/* --- [TOPICS]  --- */

.topics .article .boxL, .topics .article .boxR{ width: 290px;}
.topics .article .boxL{ float: left;}
.topics .article .boxR{ float: right;}
.topics .article .boxL img,
.topics .article .boxR img
{ margin: 5px 0 9px; vertical-align: bottom;}

/* footer ********************************************/

#footer .wrap{
	height: 70px;
	background: url(../../files/footer_in.gif) top no-repeat;
}

#pagetop{
	margin: 22px 0 0;
	float: right;
	width: 100px;
}
#pagetop a{
	display: block;
	width: 100px;
	height: 20px;
}
#copy{
	margin: 18px 0 0;
	float: left;
	width: 300px;
	height: 14px;
}


/* form ********************************************/

form{
	margin: 0;
	padding: 0;
}

.contact img{ margin: 10px 0;}

.contact h3{ margin: 20px 0 10px;}

.your_rq input{ background: #e7e7eb;}

#form{ margin: 0 5px 25px;}
#form span, #form p.error{ color: #b82e5f;}

#form p{
	margin: 0 0 20px;
	text-align: center;
}
#form p.error{ margin: 0.5em 0; font-size: 110%;}
#form p.left{ text-align: left;}
#form div{ background: url(../../files/line_3.gif) no-repeat bottom left;}
#form .hght{
	clear: both;
}
#form .l, #form .le{
	padding: 5px 0 5px 10px;
	float: left;
	clear: none;
	width: 185px;
	background: none;
}
#form .r, #form .re{
	margin: 5px 10px 5px 0;
	padding: 0;
	float: right;
	width: 390px;
	background: none;
}
#form div.error{ background: url(../../files/line_er.gif) no-repeat bottom left;}
#form div.error input{ background: #f7e8ef;}
#form div.error .r div{ color: #b82e5f; background: none;}
#form div.end{ background: none;}

#form textarea, #form select{ background: #fff;}
#form select{ margin: 0;}
#form textarea{ width: 380px; height: 80px; border: solid 1px #a5acb2;}
#form input.input{ width: 250px; border: solid 1px #a5acb2;}
#form input.trans{ width: 80px;}
