@charset "UTF-8";

/* ================================================================ *
	Web Designing 2007/10
	テンプレートC-2：3 カラム型 イメージカットをなくす
	詳細カスタマイズ CSS
	
	この CSS を書き換えることで，テンプレートをカスタマイズ
	できます。本文記事およびコメントを参考に変更し，活用して
	ください。
 * ================================================================ */

/* 画像を回り込ませている箇所の見出しデザイン */
h2 {
/*  margin-left: 175px;	*/
}

/* ナビゲーションの下方向の間隔を設定します */
#navi {
  margin-bottom: 15px;
}

.detail {
	text-align:left;
	font-size: 12px;
	margin-right:5px;
	margin-top;10px;
	margin-bottom;5px;
}

/* ---------------------------------------------------------------- *
	サイドボックス
	色候補:#afeeee
 * ---------------------------------------------------------------- */

#sidebox .indexbox {
	color:#afeeee;
	text-decoration:none;
	width:190px;
	height:20px;
	margin: 10px 0 0 5px;
	text-align: center;
	display: block;
	font-size: 12px;
	background-image: url("img/index.gif");
}

#sidebox .box {
	width:190px;
	margin: 0 0 0 5px;
}

#sidebox .box div{ 
	display: block;
	font-size: 12px;
	line-height: 130%;
	border-width: 0px 1px 1px 1px;
	border-style: solid;
	/*	色候補	blue	#0086b9	*/
	border-color: #0086b9;
	padding: 5px;
	text-align: left;
}

#sidebox .box img{
	border: 0;
}

/* ---------------------------------------------------------------- *
	商品選択ボックス
 * ---------------------------------------------------------------- */

/* 商品を探す */
	.dirbox{
	background: white;
	width: 100%;
	margin: 5px 0px 10px;
	padding: 0px;
	overflow: auto;
	font-size:x-small;
	overflow: hidden;
}

.dirboxtitle{
	background: white url("img/find1.gif") no-repeat;
	height:21px;
	margin:0px;
	padding:0px;
}

.dirboxcontent{
	/*	色候補	#3EBAEE	#0086b9*/
	border: 1px solid #0086b9;
	border-top: 0px;
	margin:0px;
	padding:5px 0px;
}

.dirboxcontent .d1{
	background:  url(img/list_no1.gif) no-repeat left center;
	margin:0px 0.8em 0px 0.4em;
	padding:0 0 0 1.2em;
	line-height:2.4em;
}

.dirboxcontent .l1{
	background:  url(img/list_no2.gif) no-repeat left center;
	padding:0px 0px 0px 1.2em;
	line-height:2.4em;
	text-indent: 0.1em;
	font-weight: bold;
	margin-left: 0.4em;
}

/* ---------------------------------------------------------------- *
	商品選択ボックス
 * ---------------------------------------------------------------- */

/* 商品を探す */
	.infobox{
	background: white;
	width: 100%;
	margin: 5px 0px 10px;
	padding: 0px;
	overflow: auto;
	font-size:x-small;
	overflow: hidden;
}

.infoboxtitle{
	background: white url("img/find1.gif") no-repeat;
	height:21px;
	margin:0px;
	padding:0px;
}

.infoboxcontent{
	/*	色候補	#3EBAEE	#0086b9*/
	border: 1px solid #0086b9;
	border-top: 0px;
	margin:0px;
	padding:5px 0px;
}

.infoboxcontent .d1{
	background:  url(img/list_no1.gif) no-repeat left center;
	margin:0px 0.8em 0px 0.4em;
	padding:0 0 0 1.2em;
	line-height:2.0em;
}

.infoboxcontent .l1{
	background:  url(img/list_no2.gif) no-repeat left center;
	padding:0px 0px 0px 1.2em;
	line-height:2.0em;
	text-indent: 0.1em;
	font-weight: bold;
	margin-left: 0.4em;
}

/* ---------------------------------------------------------------- *
	ナビゲーション部分の設定です
 * ---------------------------------------------------------------- */

#navitop {
  /* --- 背景を設定してください（短縮プロパティでの設定です） --- */
  //background: #FFFFFF url(img/bg.png) repeat-x;
  /* --- マージンを設定してください --- */
  /* Note：上マージンはヘッダの下マージンとの折りたたみが生じます */
  /* Note：下マージンはコンテンツの上マージンとの折りたたみが
           生じます */
  margin-top: 0;
  margin-bottom: 0px;
  /* --- パディングを設定してください --- */
  /* Note：ナビゲーション部分に上下マージンを持つものが含まれる場合，
           上下パディングには正の値を指定してください */
  padding-top: 0;
  padding-right: 0;
  padding-bottom: 0;
  padding-left: 10pt;
  /* --- 必要に応じて、ボックスの下線を設定してください（短縮プロパティでの設定です） --- */
  border-bottom: 1px solid #FFFFFF;
}

#navitop ul {
  /* --- マージンを設定してください --- */
  margin: 0;
  /* --- パディングを設定してください --- */
  padding: 0;
  /* --- 高さを設定してください --- */
  height: 2.5em;
}

#navitop ul li {
  /* --- マージンを設定してください --- */
  margin: 0;
  /* --- パディングを設定してください --- */
  padding: 0;
  /* --- 横並びにさせるためにフロートを指定してください --- */
  float: left;
}

#navitop ul li a {
  margin: 0;
  padding: 6px 20px 5px 20px;
  /* --- ナビゲーション１項目あたりのクリッカブル領域をテキスト部分だけでなくボックス単位とするためには display: block;と指定してください --- */
  display: block;
  /* --- ナビゲーション１項目あたりの右側の境界線の線種と色と太さを指定してください（短縮プロパティでの設定です） --- */
  border-right: 1px solid #CCCCCC;
  /* --- ナビゲーション１項目あたりの下側の境界線の線種と色と太さを指定してください（短縮プロパティでの設定です） 色初期設定#3EBAEE	--- */
  border-bottom: 1px solid #3EBAEE;
  /* --- ナビゲーション１項目あたりの背景画像とリピート方向を指定してください（短縮プロパティでの設定です） --- */
  background: url(img/bg.png) repeat-x;
  /* --- ナビゲーション１項目あたりのフォントの太さを指定してください --- */
/*  font-weight: bold;	*/
}

#navitop a:hover {
  /* --- マウスオーバーしたときの下側の境界線の線種と色と太さを指定してください（短縮プロパティでの設定です） --- */
  border-bottom: 5px solid #0086b9;
  /* --- マウスオーバーしたときの背景色と、横並びリストのリストマーカ画像を設定してください（短縮プロパティでの設定です） --- */
  /* Note：16×16 ピクセル以下のものを使用してください。背景色をあわせて指定している場合は、透過処理されている画像である必要があります */
  //background: #EEEEEE url(img/arrow.gif) no-repeat;
  /* 通常のリンクテキストでテキストに下線がついてしまう設定になっているので、ナビゲーションのテキスト下線は不要なためここで指定して上書きしてください */
  text-decoration: none;
}












/* ---------------------------------------------------------------- *
	商品選択ボックス
 * ---------------------------------------------------------------- */

/* 商品を探す */
	.infobox2{
	background: white;
	width: 91%;
	margin: 5px 0px 0px;
	padding: 0px;
	overflow: auto;
	font-size:x-small;
	overflow: hidden;
}

.infoboxtitle2{
	background: white url("img/find1.gif") no-repeat;
	height:21px;
	margin:0px;
	padding:0px;
}

.infoboxcontent2{
	/*	色候補	#3EBAEE	#0086b9*/
	border: 1px solid #0086b9;
	border-top: 0px;
	margin:0px;
	padding:5px 0px;
}

.infoboxcontent2 .d1{
	background:  url(img/list_no1.gif) no-repeat left center;
	margin:0px 0.8em 0px 0.4em;
	padding:0 0 0 1.2em;
	line-height:2.0em;
}

.infoboxcontent2 .l1{
	background:  url(img/list_no2.gif) no-repeat left center;
	padding:0px 0px 0px 1.2em;
	line-height:2.0em;
	text-indent: 0.1em;
	font-weight: bold;
	margin-left: 0.4em;
}