@charset "shift-jis";

/* INITIALIZE ********************************************************* */
*{ margin:0;padding:0;font-weight:normal;}
table{ border-collapse:collapse;border-spacing:0; }
th{ text-align:left; }
ul{ list-style-type:none; }
img,a img{ border:0;vertical-align:top; }

/* FONT COSTORMIZE **************************************************** */
body{font-size:small;font-family:Meiryo,'CI',Osaka,Hiragino;line-break:strict;}
table,h1,h2,h3,h4,h5{font-size:small;}
@-moz-document url-prefix(){body,table,h1,h2,h3,h4,h5{font-size:medium;}}
strong,em,b{ font-weight:bold;font-style:normal;}
input,select,textarea{font-size:medium;}

body{color:#333333; }
a{color: #FF0000;text-decoration:none;}
a:hover{text-decoration:underline;}

/* TEXT SIZE --------------------------
.font-10px{ font-size:80%; }
.font-11px{ font-size:90%; }
.font-12px{ font-size:95%; }
.font-13px{ font-size:100%; }
.font-14px{ font-size:110%;}
.font-16px{ font-size:120%;}
/*------------------------------------ */


/* LAYOUT ************************************************************* */
body{
	background:#FFF url(../img/common/body_bg.png) repeat-x;
}
#header,#gnavi,#contents{
	width:980px;
	margin:0px auto;
}
#header{
	position:relative;
	height:90px;
	background:#FFF url(../img/common/head_bg.png) no-repeat;
}
#gnavi{
	background:#FFF;
	padding-bottom:18px;
}
#contents{
	background:#FFF;
	min-height:800px;
	padding-bottom:50px;
}
#main{
	float:left;
	width:680px;
	margin:0 0 0 20px;
	font-size:105%;
	line-height:170%;
}
#side{
	float:right;
	width:230px;
	margin:0 20px 0 0;
	line-height:140%;
}
/* clear fix */
.clr{/zoom:1;}
.clr:after{content:'';display:block;clear:both;}


/* HEADER ------------------------------------------------------------*/
#header:before,#header:after{
	z-index: -1;
	position:absolute;
	content: "";
	height:500px;
	top:-10px;
	right:10px;
	left:auto;
	width:50%;
	bottom: 80%;
	max-width:300px;
	background:#777;
	-webkit-box-shadow: 15px 0 10px rgba(0,0,0,0.5);
	-moz-box-shadow: 15px 0 10px rgba(0,0,0,0.5);
	box-shadow: 15px 0 10px rgba(0,0,0,0.5);
	-webkit-transform: rotate(3deg);
	-moz-transform: rotate(3deg);
	-o-transform: rotate(3deg);
	-ms-transform: rotate(3deg);
	transform: rotate(3deg);
	display:none\9;/* IE8 and below */
}
#header:before{
	left:10px;
	right:auto;
	-webkit-box-shadow: -15px 0 10px rgba(0,0,0,0.5);
	-moz-box-shadow: -15px 0 10px rgba(0,0,0,0.5);
	box-shadow: -15px 0 10px rgba(0,0,0,0.5);
	-webkit-transform: rotate(-3deg);
	-moz-transform: rotate(-3deg);
	-o-transform: rotate(-3deg);
	-ms-transform: rotate(-3deg);
	transform: rotate(-3deg);
	display:none\9;/* IE8 and below */
}
h1{
	padding:10px 10px 0 0;
	text-align:right;
	font-size:11px;
	line-height:11px;
	color:#666666;
}
#header-logo{
	position:absolute;
	left:10px;top:15px;
	width:300px;
}
#header-info{
	position:absolute;
	left:780px;top:40px;
	width:200px;
}
#header-info .tel{
	font-size:26px;
	font-family:'Open Sans',sans-serif;
	line-height:100%;
	letter-spacing:1px;
}


/* GNAVI ------------------------------------------------------------*/
#gnavi ul{
	height:60px;
	overflow:hidden;
	box-shadow:0 0 10px rgba(0,0,0,0.5);
}
#gnavi li{
	float:left;
	width:140px;
}
#gnavi li a{
	display:block;
	width:140px;
	height:60px;
	overflow:hidden;
}
#gnavi li a:hover img{
	margin-top:-60px;
}
#gnavi01 a img{}
#gnavi02 a img{margin-left:-140px;}
#gnavi03 a img{margin-left:-280px;}
#gnavi04 a img{margin-left:-420px;}
#gnavi05 a img{margin-left:-560px;}
#gnavi06 a img{margin-left:-700px;}
#gnavi07 a img{margin-left:-840px;}

#topicpath{
	padding:15px 15px 0;
	font-size:95%;
}
#topicpath p{
	padding:0 0 0 25px;
	background:url(../img/common/bg_tpath.gif) no-repeat left bottom;
	line-height:160%;
}

/* FOOTER ------------------------------------------------------------*/
#footer{
	background:#515151;
}
#footer-inner{
	width:840px;
	margin:0 auto;
	padding:20px 70px;
	background: url(../img/common/foot_logo.png) no-repeat 20px 20px;
}
#footer dl{
	margin:15px 10px 15px 20px;
	color:#FFFFFF;
}
#footer a{
	color:#FFFFFF;
	text-decoration:none;
}
#footer a:hover{
	color:#FF9999;
}
#footer dl dt{
	font-size:120%;
}
#footer dl dd{
	padding:6px 20px;
	font-size:90%;
}
#footer dl dd.mess{
}
#footer dl dd.fnavi{
	line-height:200%;
	color:#999;
}
#footer .copyright{
	padding:10px 0;
	text-align:right;
}
#pagetop{
	position:fixed;
	bottom:50px;
	right:50px;
	z-index:10;
}

/* SIDE ------------------------------------------------------------*/
#side-prod-navi{
	margin:0 0 15px 0;
	padding:0 0 5px 0;
	width:230px;
	background:url(../img/common/side_prod_bg.png);
	line-height:100%;
}
#side-prod-navi ul{
	margin:10px 15px;
	width:198px;
	background:#FFFFFF;
	border:solid 1px #DD0000;
}
#side-prod-navi ul li{
	margin:2px;
}
#side-prod-navi ul li a{
	display:block;
	padding:10px 3px 8px 28px;
	background:url(../img/common/side_prod_arr.png) no-repeat 2px 50%,-webkit-gradient(linear, left top, left bottom, color-stop(1.00, #F3F3F3), color-stop(0.47, #D3D3D3), color-stop(0.42, #E6E6E6), color-stop(0.00, #FFF));
	background:url(../img/common/side_prod_arr.png) no-repeat 2px 50%,-webkit-linear-gradient(top, #FFF 0%, #E6E6E6 42%, #D3D3D3 47%, #F3F3F3 100%);
	background:url(../img/common/side_prod_arr.png) no-repeat 2px 50%,-moz-linear-gradient(top, #FFF 0%, #E6E6E6 42%, #D3D3D3 47%, #F3F3F3 100%);
	background:url(../img/common/side_prod_arr.png) no-repeat 2px 50%,-o-linear-gradient(top, #FFF 0%, #E6E6E6 42%, #D3D3D3 47%, #F3F3F3 100%);
	background:url(../img/common/side_prod_arr.png) no-repeat 2px 50%,-ms-linear-gradient(top, #FFF 0%, #E6E6E6 42%, #D3D3D3 47%, #F3F3F3 100%);
	background:url(../img/common/side_prod_arr.png) no-repeat 2px 50%,linear-gradient(to bottom, #FFF 0%, #E6E6E6 42%, #D3D3D3 47%, #F3F3F3 100%);
	font-weight:bold;
	font-size:110%;
	line-height:1.2;
	border:solid 1px #CCCCCC;
	text-decoration:none;
	color:#333333;
}
#side-prod-navi ul li a#ca{
	background:url(../img/common/side_prod_arr.png) no-repeat 2px 12px,-webkit-gradient(linear, left top, left bottom, color-stop(1.00,#F3F3F3), color-stop(0.42,#D3D3D3), color-stop(0.47,#E6E6E6), color-stop(0.00,#FFF));
	background:url(../img/common/side_prod_arr.png) no-repeat 2px 12px,-webkit-linear-gradient(top, #FFF 0%, #E6E6E6 42%, #D3D3D3 47%, #F3F3F3 100%);
	background:url(../img/common/side_prod_arr.png) no-repeat 2px 12px,-moz-linear-gradient(top, #FFF 0%, #E6E6E6 42%, #D3D3D3 47%, #F3F3F3 100%);
	background:url(../img/common/side_prod_arr.png) no-repeat 2px 12px,-o-linear-gradient(top, #FFF 0%, #E6E6E6 42%, #D3D3D3 47%, #F3F3F3 100%);
	background:url(../img/common/side_prod_arr.png) no-repeat 2px 12px,-ms-linear-gradient(top, #FFF 0%, #E6E6E6 42%, #D3D3D3 47%, #F3F3F3 100%);
	background:url(../img/common/side_prod_arr.png) no-repeat 2px 12px,linear-gradient(to bottom, #FFF 0%, #E6E6E6 42%, #D3D3D3 47%, #F3F3F3 100%);
}
#side-prod-navi ul li a:hover{
	background-color:#CCCCCC;
	color:#CC0000;
}

#side-pr{
	margin:5px 0;
}
#side-pr li{
	margin:10px 0;
}
#side-deli{
	margin:20px 0;
	border:solid 5px #ff7f7f;
}
#side-deli dd{
	padding:10px;
	font-size:95%;
}
#side-info{
	margin:20px 0;
	padding:5px;
	background:url(../img/common/side_info_bg.gif) no-repeat center -5px;
	border:solid 5px #e6e6e6;
}
#side-info dt{
	margin-bottom:7px;
	padding:7px 0 3px;
	border-bottom:solid 1px #999;
	font-size:110%;
	text-align:center;
}
#side-info dd{
	font-size:12px;
	margin:0 15px 6px;
}
#side-info dd.tel{
	margin-top:-5px;
	font-size:14px;
	font-family:'Open Sans',sans-serif;
	letter-spacing:1px;
}
#side-info dd.tel span{
	display:inline-block;
	width:30px;
}


/* MAIN ------------------------------------------------------------*/
.lv01{
	margin:0 0 20px 0;
}
.lv02{
	clear:both;
	height:32px;
	margin:30px 0 15px 0;
	padding:8px 5px 0 22px;
	background:url(../img/common/bg_lv2.png) no-repeat;
	font-size:120%;
	font-weight:bold;
}
.lv03{
	clear:both;
	margin:10px 0 5px 0;
	padding:3px;
	font-weight:bold;
	line-height:100%;
	background:#CCCCCC;
}
.lv04{
	clear:both;
	margin:20px 0 10px;
	border-bottom:dotted 1px #C00;
	font-size:115%;
	font-weight:bold;
}
.section01{
	margin:0 0 0 15px;
}
.section02{
	margin:10px 0;
}
.section01 p{
	margin-bottom:10px;
}

.float-right{float:right;}
.float-left{float:left;}
.align-center{text-align:center;}
.align-right{text-align:right;}
.align-left{text-align:left;}
.img-right{float:right;margin:0 0 20px 20px;}
.img-left{float:left;margin:0 20px 20px 0;}
.f-clr{clear:both;}

/* unit ---------- */
/* img3layout */
.board-img3{
}
.board-img3 li{
	float:left;
	width:180px;
	margin-right:12px;
}
.board-img3 li.end{
	margin-right:0;
}
.board-img3 li img{
	margin:5px 0;
}

/* separatable */
.board-sep2{
	margin:10px 0 10px 15px;
}
.board-sep2 .left-sp{float:left;}
.board-sep2 .right-sp{float:right;}
.board-sep2 .img-cont{width:220px;}
.board-sep2 .txt-cont{width:410px;}

/* img */
.pframe img{
	padding:1px;
	border:solid 1px #999;
}

/* table */
.tbl01{
	width:640px;
	margin:10px auto;
	border-left:solid 1px #CCCCCC;	
	border-top:solid 1px #CCCCCC;
}
.tbl01 th,.tbl01 td{
	padding:5px;
	vertical-align:top;
	border-right:solid 1px #CCCCCC;	
	border-bottom:solid 1px #CCCCCC;
}
.tbl01 th{
	width:20%;
	background:#E2ECF4;
	font-weight:bold;
}

/* text */
.font-blue{color:#00F;}
.font-line01{border-bottom:solid 1px #C30;}
.text-st01{font-weight:bold;font-size:105%;}

/* link */
a.left-arrow{
	padding:4px 0 2px 18px;
	background:url(../img/common/mark_arr01.png) no-repeat 0 50%;
	color:#333333;
}
a.left-arrow:hover{color:#FF0000;}
.btn-on:hover img,
#side a:hover img{filter:alpha(opacity=70);-moz-opacity: 0.7;opacity:0.7;}

/* option */
.btm-space{
	margin-bottom:400px;
}
hr.line01{
	border:none;
	border-bottom:dotted 2px #FFCC00;
	height:2px;
	margin:10px 0;
}
.vertical-mid{
	vertical-align:middle;
}
.frame01{
	padding:10px 20px;
	border:solid 1px #CCCCCC;
}
.frame01 dd{
	padding:10px 30px;
}
.icon-square{
	padding:4px 0 0 20px;
	background:url(../img/common/icon_sq1.gif) no-repeat left center;
	font-weight:bold;
}


/* PAGE OPTION STYLE ************************************************** */

/* EXAMPLE  -------------------------------------------------------*/
.example-list{
	margin-left:-5px;
}
.example-list ul li{
	float:left;
	width:210px;
	margin:20px 0 0 15px;
	font-size:95%;
	line-height:140%;
}
.example-list ul li img{
	padding:1px;
	border:solid 1px #999;
}
.example-list ul li p{
	margin:5px 0;
	min-height:60px;
}


/*** PRODUCTS ***/
/* PRODUCTS COMMON STYLE  -------------------------------------------------------*/ 
.board-pdf{
	padding:8px 8px 4px;
	background:url(../products/img/bg_gray.gif) no-repeat;
	text-align:right;
	font-size:80%;
	line-height:140%;
}
.board-pdf .btn{
	padding-bottom:8px;
	margin-bottom:8px;
	border-bottom:solid 1px #999;
}
#product-lead{
	float:left;
	width:350px;
}
#product-rbend-pr{
	float:right;
	width:290px;
	border:solid 1px #CCC;
	border-radius:4px;
}
#product-rbend-pr dt{
	text-align:center;
}
#product-rbend-pr dd{
	margin:0 20px 15px;
}

.product-example{
	margin:15px;
	border:solid 1px #B8C7D1;
	background:#EFF2F4;
}
.product-example-title{
	height:30px;
	line-height:34px;
	margin:1px;
	padding:0 0 0 25px;
	background:#C6D7E2 url(../img/common/mark_cc01.png) no-repeat 5px 50%;
	font-size:105%;
	font-weight:bold;
}
.product-example ul{
	width:606px;
	margin:0 auto;
}
.product-example li{
	float:left;
	width:180px;
	margin:15px 10px;
}
.product-example li img{
	padding:1px;
	border:solid 1px #999;
}
.product-example-other{
	text-align:right;
	margin:0 20px 10px;
}

.product-use{
	margin:10px 0;
}
.product-use dt{
	display:inline-block;
	margin-right:5px;
	padding:5px 8px 3px;
	background:#CCC;
	font-weight:bold;
	line-height:100%;
}
.product-use dd{
	display:inline;
}

.products-parts{
	margin:0 10px 0 0;
}
.products-parts-sample{
	margin-bottom:10px;
}
.products-parts li{
	float:left;
	width:110px;
	padding:0 0 5px 0;
}
.products-parts li.wide{
	width:160px;
}
.products-parts p{
	padding:4px 0 0 0;
	font-size:85%;
	line-height:120%;
}

#board-delivery{
	margin-top:30px;
	padding:5px;
	border:solid 1px #CCCCCC;
}
#board-delivery .float-left{
	margin:30px 20px;
}
#board-delivery dl{
	width:480px;
}
#board-delivery dt{
	margin:10px 0 0 0;
	font-weight:bold;
	color:#3366CC;
}
#board-delivery dd{
	margin:0 20px 10px 12px;
}
#products-end{
	margin-top:30px;
}

/* STEELBASE  -------------------------------------------------------*/
.product-jis{
	margin:10px 20px 20px 0;
	padding:5px;
	border:solid 1px #999;
}
.product-jis img{
	float:left;
}
.product-jis p{
	float:left;
	padding:5px 5px 0;
	font-size:11px;
	line-height:130%;
}
.product-jis a{
	display:inline-block;
	margin:7px 0 0 10px;
	padding:0 0 0 20px;
	background:url(../img/common/mark_arr02.png) no-repeat left 7px;
	font-size:12px;
}

/* ECOWALL  -------------------------------------------------------*/
#ecowall-spec{
	width:600px;
	margin:20px auto;
}
#ecowall-spec dt{
	float:left;
	width:140px;
}
#ecowall-spec dd{
	float:right;
	width:450px;
	margin-bottom:20px;
	padding-top:5px;
	color:#339966;
}
#ecowall-compare{
	width:600px;
	margin:0 auto;
	border-top:solid 1px #339966;
	border-left:solid 1px #339966;
}
#ecowall-compare th,#ecowall-compare td{
	padding:3px;
	border-bottom:solid 1px #339966;
	border-right:solid 1px #339966;
}
#ecowall-compare th{
	font-weight:bold;
	text-align:center;
}
#ecowall-compare th.past{
	background:#CCCCCC;
}
#ecowall-compare td.past{
	background:#F6F6F6;
}
#ecowall-compare th.new{
	background:#99FF99;
}
#ecowall-compare td.new{
	background:#CCFFCC;
}
#ecowall-compare .no{
	background:#66CC99;
}

/* RBEND  -------------------------------------------------------*/
#rbend-sample-list{
	margin:10px 15px;
	border-top:dotted 1px #999999;
}
#rbend-sample-list div{
	border-bottom:dotted 1px #999999;
}
#rbend-sample-list dl{
	float:right;
	width:300px;
	margin:10px 0;
}
#rbend-sample-list dt{
	margin-bottom:5px;
	font-weight:bold;
}
#rbend-sample-list ul{
	float:left;
	width:340px;
	padding:10px 0;
}
#rbend-sample-list ul li{
	float:left;
	width:165px;
}

/* MCSTRONG  -------------------------------------------------------*/
.mc-box .txt-cont{
	float:left;
	width:400px;
	margin:0 0 10px 15px;
}
.mc-box .img-cont{
	float:right;
	width:240px;
}
#mc-relate{
	margin:30px 0;
	padding:10px 10px 5px;
	border-top:dotted 1px #999;
	border-bottom:dotted 1px #999;

}

/* COMPANY  -------------------------------------------------------*/
#comp-jismark{
	margin:10px 0;
	min-height:100px;
	padding-left:80px;
	background:url(../company/img/jis.gif) no-repeat;
}
#comp-eco{
	width:600px;
	margin:10px auto;
	padding:5px 0 20px 0;
	background:url(../company/img/bg_eco.gif) repeat-y;
	border:solid 1px #FFFFFF;
}
#comp-eco li{
	min-height:30px;
	margin-left:100px;
	line-height:30px;
	color:#339933;
}

/* POLICY  -------------------------------------------------------*/
#policy-mess{
	margin:0 75px;
}

/*** INFO ***/
.info-tel{
	font-size:140%;
	line-height:160%;
	font-weight:bold;
	font-family:'Open Sans',sans-serif;
}
.info-tel span{
	display:inline-block;
	width:40px;
}
ul.info-item{
	margin:10px 20px;
	padding:10px 40px;
	background:#E2ECF4;
	list-style-type:circle;
}
ul.info-item li{
	margin:5px 0;
}
.info-mail{
	margin:10px 20px;
	font-size:110%;
}

.privacy{
	margin:30px 20px;
	padding:10px;
	border-top:solid 3px #999999;
	border-bottom:solid 3px #999999;
}
.privacy dt{
	margin-bottom:10px;
	font-weight:bold;
}
.privacy ol{
	margin:10px 20px;
}
.privacy ol li{
	margin-bottom:10px;
	line-height:120%;
}


/* SITEMAP  -------------------------------------------------------*/
#sitemap{
}
#sitemap .toppage{
	margin-bottom:30px;
	padding:4px 0 0 18px;
	background:url(../img/common/icon_arrow02.gif) no-repeat left center;
}
#sitemap h4{
	margin:20px 0 5px 0;
	padding:2px 5px;
	background:#CCCCCC;
	font-weight:bold;
}
#sitemap dl{
	margin:20px 40px;
}
#sitemap dt{
	padding:4px 0 0 18px;
	background:url(../img/common/icon_arrow02.gif) no-repeat left center;
}
#sitemap dd{
	margin:0 0 15px 30px;
}


/* for Safari */
/*body:last-child:not(:root:root) *{letter-spacing:-1px;}*/
