@charset "UTF-8";

/* 産総研粘土ライブラリー　クレーストページ style.css

------------------------
ver.2012/3/8/
------------------------

1:レイアウト

----------------------------------------------------------*/


/*1:レイアウト
==========================================================*/
.product_area dl {
	margin: 20px;
}

.product_area dt{
	float:left;
	clear:both;
	width:60px;
}

.product_area dd{
	padding: 0 0 10px 60px;
	margin: 0 0 15px 0;
	border-bottom:#ccc dotted 1px;
}

.section .product_area dd{
	height:60px;
	padding: 10px 0 0 60px;
	margin: 0 0 20px 0;
	border-bottom:#ccc dotted 1px;
}


/*クレーストについて、その他
-----------------------------------------------------------*/


.section .about_area dt,
.section .etc_area dt{
	float:left;
	clear:both;
	padding: 0 1em;
	width:9em;
	color:#69C;
	font-weight:bold;
}

.section .about_area dd,
.section .etc_area dd {
	padding: 0 0 10px 11em;
	margin: 0 0 10px 0;
	border-bottom:#ccc dotted 1px;
}



/*鉱物一覧dl ここから
-----------------------------------------------------------*/
#tab_list {
	position:absolute;
	margin: 20px 0 0 10px;
	z-index:10;	
}

#tab_list li#tab_product_no {
	background:url(../../claist/img/list_tab_e.gif) no-repeat 0 0;
	width: 55px;
	height:0;
	overflow: hidden;
	padding:140px 0 0 0;
}



#product_list .waku {
	border:#ebd6bc solid 1px;
	padding:20px 40px;
	margin: 0 20px 20px 60px;
	
/*	overflow: hidden; /*floatの解除、ここがポイント*/
/*	position: relative; /*DWで正常にプレビューできるようになります。*/
/*	zoom:1; /*IE6でレイアウト崩れを防ぐためのものです。*/
	
	border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */  
}

#product_list .waku dl {
	border-bottom: 1px #ebd6bc solid;
	padding: 5px;
	
	overflow: hidden; /*floatの解除、ここがポイント*/
	position: relative; /*DWで正常にプレビューできるようになります。*/
	zoom:1; /*IE6でレイアウト崩れを防ぐためのものです。*/
}

#product_list .waku dt {
	float:left;
	width:11em;
}


#product_list .waku a {
	text-decoration:none;
}

#product_list .waku a dt,
#product_list .waku a dd {
	color:#9e425e;
}


#product_list .waku a:visited dl,
#product_list .waku a:visited dt,
#product_list .waku a:visited dd {
	background-color:#fff5f7;
	text-decoration:none;
}

#product_list .waku a:hover dl,
#product_list .waku a:hover dt,
#product_list .waku a:hover dd {
	color:#F60;
	background-color:#fff4e6;
	text-decoration:none;
}

/*鉱物一覧dl ここまで
-----------------------------------------------------------*/




/*鉱物詳細dlここから
-----------------------------------------------------------*/
.section dl#dl_detail {
	width: 600px;
	margin: 0 0 20px 24px;
	background-color:#ebd6bc;
	border:#999 solid 1px;
	border-top:none;
	line-height:1.4em;
	
/*	overflow: hidden; /*floatの解除、ここがポイント*/
/*	position: relative; /*DWで正常にプレビューできるようになります。*/
/*	zoom:1; /*IE6でレイアウト崩れを防ぐためのものです。*/
	
}

.section dl#dl_detail dt {
	color:#9e425e;
	width:120px;
	padding: 5px 0;
	font-weight:bold;
	border-top:#999 solid 1px;
	float:left;
	clear:both;
	text-align:center;
}

.section dl#dl_detail dd {
	padding: 5px 10px;
	border-top:#999 solid 1px;
	border-left:#999 solid 1px;
	background-color:#FFF;
	margin: 0 0 0 120px;
}

.section dl#dl_detail dt.dt_60 {
	width:60px;
	background-color:#ebd6bc;
}

.section dl#dl_detail dd.dt_60 {
	width:39px;
	margin: 0;
	float:left;
	border-right:#999 solid 1px;
	text-align:center;
}

.section dl#dl_detail dt.dt_110 {
	clear:none;
	background-color:#ebd6bc;
	border-right:#999 solid 1px;
}

.section dl#dl_detail dd.dt_110 {
	clear:none;
	margin: 0 0 0 240px;
}

.section dl#dl_detail dt.dt_h_2em {
	line-height:1.4em;
}

.section dl#dl_detail dd.dt_h_2em {
	min-height: 3.4em;
}

.section dd a {
	color:#06F;
}

.section dd a:hover {
	color:#F60;
}

.section dd img {
	width: 200px;
	margin: 10px 10px 10px 15px;
}

/*詳細dlここまで
-----------------------------------------------------------*/


/*会社詳細 鉱物一覧dl ここから
-----------------------------------------------------------*/


.section dl#dl_mineral_list {
	background-color:#FFF;
	
	width: 600px;
	margin: 0 0 20px 25px;
	line-height:1.4em;
	
/*	overflow: hidden; /*floatの解除、ここがポイント*/
	position: relative; /*DWで正常にプレビューできるようになります。*/
	zoom:1; /*IE6でレイアウト崩れを防ぐためのものです。*/
	
}

.section dl#dl_mineral_list dt, 
.section dl#dl_mineral_list dd{
	float:left;
	padding: 4px 0 ;
}

.section dl#dl_mineral_list .dl_top {
	font-weight:bold;
	background-color:#ebd6bc;
}


.section dl#dl_mineral_list dt {
	border:#999 solid 1px;
	width: 38px;
	text-align:center;
	clear:both;
}

.section dl#dl_mineral_list dd{
	border:#999 solid 1px;
	border-left:none;
	width:259px;
	padding: 4px 10px;
}

.section dl#dl_mineral_list dt.dl_top {
	border-bottom:none;
}
.section dl#dl_mineral_list dd.dl_top {
	border-bottom:none;
	border-left:none;
}

/*会社詳細 鉱物一覧dl ここまで
-----------------------------------------------------------*/