@import "/css/common.css";

/*==================================================================*/
/* ceramics css（セラミックネジ） */
/*==================================================================*/
/* リセット */
#ceramics *{margin:0;padding:0;}

/* 大枠 */
#ceramics{
	width:610px;
	margin:0 auto 0.6em;
}

/* h2 */
#ceramics h2{
	width:557px;
	margin:0 auto 0.2em;
}

/* h3 */
#ceramics h3{margin:0 auto 0.6em;}

#ceramics h3 span{
	padding:12px 0 8px 50px;
	display:block;
}

/* h3(六角ボルト) */
#ceramics h3.bolt{background:url('../image/subt_bolt.gif') no-repeat 0 0;}

/* h3(六角穴付きボルト) */
#ceramics h3.bolt-hole{background:url('../image/subt_bolt_hole.gif') no-repeat 0 0;}

/* h3(六角ナット) */
#ceramics h3.nut{background:url('../image/subt_nut.gif') no-repeat 0 0;}

/* h4 */
#ceramics h4{margin:0 0 0.8em 5px;}

/* ヘッドテキスト */
#ceramics p.text-head{font-size:1.2em;margin:0 auto 1.4em;}

/* 注意書き */
#ceramics p.note{
	font-size:0.9em;
	color:#a40000;
	margin:0 0 0 5px;
}

/* -------------------------------------------- */
/* top-menu */
/* -------------------------------------------- */
#top-menu{
	width:560px;
	margin:0 auto 0.6em;
}

/* clear hack */
#top-menu{zoom:1;}
#top-menu:after{content:".";clear:both;height:0;display:block;visibility:hidden;}

#top-menu .left{
	width:380px;
	float:left;
}

#top-menu .left table{
	width:380px;
	text-align:center;
}

#top-menu .left table td{font-weight:bold;}

#top-menu .right{
	width:155px;
	float:right;
}

/* -------------------------------------------- */
/* top-area */
/* -------------------------------------------- */
#top-area{margin:0 auto 0.4em;}

/* clear hack */
#top-area{zoom:1;}
#top-area:after{content:".";clear:both;height:0;display:block;visibility:hidden;}

#top-area dl{}

#top-area dl.left{
	width:360px;
	float:left;
}

#top-area dl.right{
	width:230px;
	float:right;
}

#top-area dl dt{
	margin:0 auto 0.3em;
	color:#a40000;
	font-weight:bold;
	font-size:1.2em;
	background:url('../image/top_area_back.gif') repeat-x 0 0;
	border-bottom:2px solid #9f0c0c;
}

#top-area dl dt span{
	padding:0 0 0 24px;
	display:block;
	background:url('../image/ic_red.gif') no-repeat 5px 3px;
}

#top-area dl dd ul{
	margin:0 0 0 10px;
	padding:0 0 0 10px;
}

#top-area dl dd ul li{margin:0 0 0.4em 0;}

/* -------------------------------------------- */
/* middle-area */
/* -------------------------------------------- */
#middle-area{margin:0 auto 1.6em;}

/* clear hack */
#middle-area{zoom:1;}
#middle-area:after{content:".";clear:both;height:0;display:block;visibility:hidden;}

#middle-area .left{
	width:315px;
	float:left;
}

#middle-area .right{
	width:277px;
	float:right;
}

#middle-area p.midashi{
	margin:0 auto 0.4em;
	color:#a40000;
	font-weight:bold;
	font-size:1.2em;
	background:url('../image/top_area_back.gif') repeat-x 0 0;
	border-bottom:2px solid #9f0c0c;
}

#middle-area p.midashi span{
	padding:0 0 0 24px;
	display:block;
	background:url('../image/ic_red.gif') no-repeat 5px 3px;
}

/* テーブル */
#middle-area table{
	width:305px;
	margin:0 auto 0.4em;
	border-collapse:collapse;
}

#middle-area .left th,
#middle-area .left td{border:1px solid #666;}

#middle-area .left th{
	width:150px;
	padding:2px 0 1px 5px;
	background:#eee;
	text-align:left;
}

#middle-area .left td{padding:2px 0 1px 5px;}

/* toruku */
dl#toruku{width:280px;}

/* clear hack */
dl#toruku{zoom:1;}
dl#toruku:after{content:".";clear:both;height:0;display:block;visibility:hidden;}

dl#toruku dt{
	width:115px;
	float:left;
}

dl#toruku dd{
	float:right;
	width:160px;
	padding:30px 0 0 0;
}

dl#toruku span{color:#a40000;}

/* -------------------------------------------- */
/* data */
/* -------------------------------------------- */
#ceramics table.data{
	width:600px;
	margin:0 auto 0.2em;
	border-collapse:collapse;
}

#ceramics table.data,
#ceramics table.data th,
#ceramics table.data td,
#ceramics table.data02,
#ceramics table.data02 th,
#ceramics table.data02 td{border:1px solid #666;color:#333;}

#ceramics table.data th,
#ceramics table.data02 th{
	color:#fff;
	line-height:1;
	padding:2px 0 1px 0;
	vertical-align:top;
	background:url('../image/ceramics_th_back.gif') repeat-x 0 0;
}

#ceramics table.data tr td{
	width:80px;
	padding:0 4px 0 0;
	text-align:right;
	line-height:1.2;
}

/* セル背景 */
#ceramics table.data tr,
#ceramics table.data02 tr{background:url('../image/bk-c.gif') repeat-x 0 0;}

#ceramics table.data tr.bk-c01,
#ceramics table.data02 tr.bk-c01{background:url('../image/bk-c01.gif') repeat-x 0 0;}

#ceramics table.data tr.bk-c02,
#ceramics table.data02 tr.bk-c02{background:url('../image/bk-c02.gif') repeat-x 0 0;}

/* サイズ */
#ceramics table.data td.size,
#ceramics table.data02 td.size{
	font-weight:bold;
	text-align:center;
}

/* 単価 */
#ceramics table.data tr td.price,
#ceramics table.data02 tr td.price{
	color:#c50606;
	background:#fce5e5;
}

/* 重量 */
#ceramics table.data th.weight,
#ceramics table.data td.weight{width:130px;}

/* ねじきり破断トルク */
#ceramics table.data th.toruku,
#ceramics table.data td.toruku{width:190px;}

#ceramics table.data span,
#ceramics table.data02 span{font-size:10px;}

/* -------------------------------------------- */
/* data02 */
/* -------------------------------------------- */
#ceramics table.data02{
	width:290px;
	margin:0 auto 0.2em;
	border-collapse:collapse;
}

#ceramics table.data02 td{
	padding:0 6px 0 0;
	text-align:right;
	line-height:1.2;
}

#nut-waku{
	width:610px;
	margin:0 auto 1em;
}

/* clear hack */
#nut-waku{zoom:1;}
#nut-waku:after{content:".";clear:both;height:0;display:block;visibility:hidden;}

#nut-waku .nut-left{
	float:left;
	width:300px;
	margin:7px 0 0 0;
}

/* 製造のプロセス */
#nut-waku h5{
	width:300px;
	float:right;
	text-align:right;
}

#ceramics p.bn-ceramics{
	margin:0 auto;
	text-align:center;
}

/* -------------------------------------------- */
/* pagetop */
/* -------------------------------------------- */
#ceramics .pagetop{
	margin:0 0 1.2em auto;
	padding:0;
	text-align:right;
}

#ceramics .pagetop p{
	width:7em;
	margin:0 0 0 auto;
	font-size:11px;
	line-height:1;
	background:url('/common_img/pagetop.gif') no-repeat left 0;
}

/* --------------------------------------------------------------- */
