/* CSS Document */
@import url(reset.css);
@import url(fonts.css);

/* Font-size Adjustment */
/*
For pixels (px) Declare this percent (%) 
10  			77 
11  			85  
12  			93  (was 92%)
13  			100  
14  			108  (was 107%)
15  			116  (was 114%)
16  			123.1  (was 122%)
17  			131  (was 129%)
18  			138.5  (was 136%)
19  			146.5  (was 144%)
20  			153.9  (was 152%)
21  			161.6  (was 159%)
22  			167  
23  			174  
24  			182  
25  			189  
26  			197  

*/

/*----------------------------basic layout-----------------------------*/
body{
	background: url("../../images/bg_01.jpg") repeat-x left top #e6e6e6;
	color: #666;
}
#wrapper{
	width: 856px;
	margin: auto;
	position: relative;
	z-index: 0;
	font-size: 92%;
}
p,dd{
	text-align: justify;
	text-justify: inter-ideograph;
	line-height: 1.5;
}
a{
	color: #666;
}
a:hover{
	text-decoration: none;
}

#topic_path{
	margin: 25px 0 20px 20px;
}

/*----------------------------clearfix layout-----------------------------*/
.clearfix:after{
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}/*IE7以外のモダンブラウザ向け*/

.clearfix{display:inline-block;} /*IE7およびMacIE5向け*/

/*Hides from IE-mac\*/
* html .clearfix{height:1%;}
.clearfix{display:block;}
/*End hide from IE-mac*/ /*IE6以前向け*/

/*------------------ link effect ----------------------*/
a:hover img {
	filter: alpha(opacity=80);			/* IE */
	opacity:0.80;						/* Safari Opera */
	-moz-opacity:0.80;					/* Firefox Netscape */
}

/*----------------------------header layout-----------------------------*/
#header h1{
	margin: 17px 0 0 3px;
	font-size: 80%;
}
#header h2{
	width: 181px;
	margin: 21px 0 24px 3px;
	float: left;
	display: inline;
}
#header .header_function{
	margin: 30px 3px 0 0;
	float: right;
	display: inline;
}
#header .header_function ul li{
	margin: 0 0 0 2em;
	background: url("../../images/icon_01.gif") no-repeat left 5px;
	float: left;
	display: inline;
}
#header .header_function ul li a{
	margin-left: 16px;
}

/*----------------------------navi layout-----------------------------*/
ul#navi{
	clear: both;
	overflow: hidden;
}
ul#navi li{
	font-size: 0;
	text-indent: -9999px;
	overflow: hidden;
	float: left;
}
ul#navi li a{
	height: 53px;
	display: block;
}

/* Default */
ul#navi li.navi_home a{
	width: 144px;
	background: url("../../images/navi.jpg") no-repeat left top;
}
ul#navi li.navi_service a{
	width: 142px;
	background: url("../../images/navi.jpg") no-repeat -144px top;
}
ul#navi li.navi_oem a{
	width: 142px;
	background: url("../../images/navi.jpg") no-repeat -286px top;
}
ul#navi li.navi_development a{
	width: 141px;
	background: url("../../images/navi.jpg") no-repeat -428px top;
}
ul#navi li.navi_products a{
	width: 142px;
	background: url("../../images/navi.jpg") no-repeat -569px top;
}
ul#navi li.navi_company a{
	width: 145px;
	background: url("../../images/navi.jpg") no-repeat -711px top;
}

/* When Mouse Over */
ul#navi li.navi_home a:hover{
	background: url("../../images/navi.jpg") no-repeat left -53px;
}
ul#navi li.navi_service a:hover{
	background: url("../../images/navi.jpg") no-repeat -144px -53px;
}
ul#navi li.navi_oem a:hover{
	background: url("../../images/navi.jpg") no-repeat -286px -53px;
}
ul#navi li.navi_development a:hover{
	background: url("../../images/navi.jpg") no-repeat -428px -53px;
}
ul#navi li.navi_products a:hover{
	background: url("../../images/navi.jpg") no-repeat -569px -53px;
}
ul#navi li.navi_company a:hover{
	background: url("../../images/navi.jpg") no-repeat -711px -53px;
}


/*----------------------------contents layout-----------------------------*/
#contents_wrapper{
	background: url("../../images/bg_04.png") repeat-y left top;
}
#contents{
	width: 810px;
	margin: 0 auto;
	padding: 20px 0 50px;
}
#contents .s_margin{
	margin-top: 20px;
}

/*==================== article_01 ====================*/
#contents #article_01{
	width: 590px;
	margin: 20px 0 0 0;
	float: left;
	display: inline;
}
#contents #article_01 .section{
	padding: 20px 14px;
	border: solid 1px #e0e0e0;
	background-color: #f2f2f2;
	position: relative;
}
#contents #article_01 .section h3{
	margin: 0 0 11px 0;
}
#contents #article_01 .section p.btn{
	position: absolute;
	top: 16px;
	left: 423px;
}
#contents #article_01 .section dl.service_01 dt{
	width: 272px;
	float: left;
	display: inline;
}
#contents #article_01 .section dl.service_01 dd{
	width: 278px;
	margin: 19px 0 0 10px;
	float: left;
	display: inline;
}
#contents #article_01 .section dl.service_02{
	width: 274px;
	margin: 19px 0 0 0;
	float: left;
	display: inline;
}
#contents #article_01 .section dl.service_02 dt{
	width: 136px;
	float: left;
	display: inline;
}
#contents #article_01 .section dl.service_02 dd{
	width: 132px;
	margin: 0 0 0 6px;
	float: left;
	display: inline;
}
#contents #article_01 .section dl.service_03{
	width: 274px;
	margin: 19px 0 0 0;
	float: right;
	display: inline;
}
#contents #article_01 .section dl.service_03 dt{
	width: 136px;
	float: left;
	display: inline;
}
#contents #article_01 .section dl.service_03 dd{
	width: 132px;
	margin: 0 0 0 6px;
	float: left;
	display: inline;
}
#contents #article_01 .section dl.products_01{
	width: 272px;
	margin: 0 0 0 0;
	float: left;
	display: inline;
}
#contents #article_01 .section dl.products_02{
	width: 272px;
 	margin: 0 0 0 0;
	float: right;
	display: inline;
}
#contents #article_01 .section dl dt.dt_text{
	margin: 10px 0 8px;
	font-size: 120%;
	font-weight: bold;
}

/*==================== banner_area ====================*/
#contents #banner_area{
	width: 200px;
	margin: 20px 0 0 0;
	float: right;
	display: inline;
}
#contents #banner_area .inquiry_box{
	height: 317px;
	margin: 20px 0 0 0;
	padding: 15px 10px 0 10px;
	background: url("../../images/banner_bg.jpg") no-repeat;
	color: #fff;
	line-height: 1.5;
}
#contents #banner_area .inquiry_box p,
#contents #banner_area .inquiry_box address{
	margin: 8px 0 0 0;
	font-size: 92%;
}
#contents #banner_area .inquiry_box p.btn{
	margin: 15px 0 0 -4px;
	font-size: 0;
	text-indent: -9999px;
	overflow: hidden;
}
#contents #banner_area .inquiry_box p.btn a{
	width: 188px;
	height: 44px;
	display: block;
	background: url("../../images/banner_btn.png") no-repeat left top;
}
#contents #banner_area .inquiry_box p.btn a:hover{
	background: url("../../images/banner_btn.png") no-repeat left -44px;
}

/*----------------------------footer layout-----------------------------*/
#wrapper_foot{
	clear: both;
	background: url("../../images/bg_02.jpg") repeat-x left top;
	overflow: hidden;
}
#footer{
	width: 856px;
	margin: 0 auto;
	color: #fff;
}
#footer .go_top{
	margin: 0 20px 0 0;
	font-size: 0;
	text-indent: -9999px;
	overflow: hidden;
	float: right;
	display: inline;
}
#footer .go_top a{
	width: 91px;
	height: 23px;
	display: block;
	background: url("../../images/go_top.jpg") no-repeat left top;
}
#footer .go_top a:hover{
	background: url("../../images/go_top.jpg") no-repeat left -23px;
}
#footer ul#footer_navi{
	margin: 15px 0 11px;
	font-size: 92%;
	float: left;
	display: inline;
}
#footer ul#footer_navi li{
	display: inline;
}
#footer ul#footer_navi li a{
	color: #fff;
}
#footer #copyright{
	clear: both;
	margin: 0 0 16px;
	font-size: 85%;
}
