@charset "UTF-8";
/* CSS Document */

body { behavior:url("/common/csshover2.htc"); }/*--IEで擬似クラス:hoverがaタグ以外にも有効にする方法--*/


/*----共通使用-----*/
body{ 
	background: url(img/siki_bg.gif) top left repeat-x;
	padding-top:0 !important;
	}

	/*----外枠ライン-----*/
div#frame{
	border-bottom: #003399 solid 2px;
	border-right: #003399 solid 2px;
	border-left: #003399 solid 1px;
	width: 740px;
	margin: 0 auto 10px auto;
	background-color: #FFFFFF;
	}


	/*----heder共通-----*/
div#header{
	background: url(img/headbg.jpg) top center no-repeat;
	height: 131px;
	position: relative;
	z-index: 10;
	}
	
		/*----商品ロゴ-----*/
h1{ 
	text-align: left;
	padding: 8px 0 0 23px;
	}

		/*----HOME行きバナー-----*/
p#home{
 	position: absolute;
 	top: 23px;
 	right: 60px;
	}
p#home a{
	background:url(img/home.gif) no-repeat;
	width:55px;
	padding-top: 43px;}

		/*----ナビ-----*/
#navi{
	position: absolute;
	top: 96px;
	left: 52px;
	width: 650px;
	}

#navi li{
	float: left;
	font:bold 0.9em;
	}

	#navi ul{ display: none;}/*---子なびの表示非表示----*/
	#navi ul li{ float: none;}/*--子なびの縦横並び制御---*/
	#navi ul li a{
		background-color:#FFFFFF;
		color:#003399;
		font-size: 0.85em;
		border-bottom: #BBBBBB solid 2px;
		}
	#navi ul li a:hover{
		background-color:#003399;
		color: #FFFFFF;
		}

#navi a{
	color: #FFFFFF;
	background-color: #107BFF;
	border: solid 1px;
	border-color: #FFFFFF #666666 #666666 #FFFFFF;
	display:block;
	width: 125px;
	text-align: center;
	text-decoration: none;
	line-height: 28px;
	}

#navi li a:hover,
#navi li a.stay{
	display: block;
	background-color:#003399;
	border-color: #333333 #FFFFFF #FFFFFF #333333;
	}

#navi li:hover ul{ display: block;}


	/*----本文共通-----*/

h3{ margin-top: 1.2em;}

span.emphasis{
  color: #00A0E9;
  font-size:1.2em;
  font-weight: bold;
  }

span.mark{ font-size: 80%;}

span.ruby{ font-size:0.8em;}

span.block{
	display: inline-block;
	padding-top: 5px;
}

p#footer{ margin-top:0;}

p.address{
	font-weight: bold;
	font-size:1.1em;
	padding-left: 2em;}

div#primary{ position: relative;}/*---トップ専用----*/
div#primary img{ display: block;}
div.primary{
	position: relative;
	width:630px;
	margin: 10px auto;
	text-align: left;
	font-size: 90%;}/*---その他のページ----*/
	
	
	/*----商品特長----*/
div#detail .title{
	margin: 1em auto 0 auto;
	clear: both;
	width: 590px;
	height:240px;
	}
div#detail .title p{
	margin-top:1.4em;
	font-weight: bold;
	font-size:1em;
	}
img#detail_photo{ float: right;}
img#tablet{
	width:90;
	height:66;
	float: right;
	margin:10px 13px auto auto;
	}

div.columns dt{ font-weight: bold; line-height: 1.4;}
div.columns dd{ margin: -1.2em auto auto 6.5em;}
div.columns li{
	margin-left: 1em;
	text-indent: -1em;
	}

	/*----定期＆オーダー----*/

div#order p{ margin-left:1.5em;}

div.teiki dt span.emphasis{
	color: #CC0000;
	font-size: 1.4em;
	}
div.teiki dd span.emphasis{
	color:#000000;
	font-size: 1.4em;
	}



	/*----商品紹介＆定期＆オーダー----*/
div.columns p{
	margin: 7px auto 10px auto;
	}

div#materials{
	clear: both;
	border-top: #00A0E9 dotted 2px;
	margin-top: 1em;
	}
div#materials .columns{
	float: left;
	width:295px;
	padding: 10px;
	}

	/*----開発者の声----*/

div.story{
	width: 520px;
	margin: 2em auto;
	padding-left: 1em;
	border-left: #00A0E9 solid 10px;
	}
div.story p{
	text-indent: 1em;
	padding-top: 0.5em;
	}
div#photo{ border-left: none;}
div#photo p{
	float: right;
	padding-top: 0 !important;
	}
div#photo h4{ margin-top:4em;}

	/*----ご愛用者の声----*/

div#user dl{ margin: 1em 2em;}
div#user dd{
	margin-left: 1em;
	margin-bottom: 1em;
	text-indent: 1em;}

	/*----特定商取引法----*/

table{
	text-align: left;
	border: #00A0E9 solid 1px;
	border-collapse: separate;
	border-spacing: 0.3em;
	}
table th{
	width: 13em;
	color: #00A0E9;
	}
table th,td{
	background-color: #D8FDFD;
	padding: 5px 10px 5px 5px;
	}
table li{
	list-style: inside disc;
	padding-left:1em;
  	text-indent:-1em;}




	/*----アドレス共通-----*/

#address{
  padding-top: 7px;
  padding-bottom: 18px;
  margin: auto 13px auto 7px;
  font-size:0.9em;
  border-top: #00A0E9 dotted 2px;
  clear: both;
  }
#address img{ display:inline !important;}
#address a{ margin-left: 15px;}


/* --- 2009 33%OFF [begin] --- */
a#camp {
	display:block;
	position:absolute;
	width:634px;
	heigth:161px;
	top:175px;
	left:53px;
}
a#camp:hover {
	top:177px;
	left:55px;
}
img#camp {
	margin-top:10px;
}
p#camporder{
	position: absolute;
	top: 550px;
	left: 600px;
	}
p#camporder a{ background: url(img/button_order.gif) no-repeat;
	width:96px; padding-top: 20px;}

/* --- 2009 33%OFF [end] --- */


	/*----ボタン共通使用-----*/
  
a.button{
  display: block;
  overflow: hidden;
  height: 0 !important;
  background-position: left top !important;
  }

a.button:hover{background-position: right top !important;}



/*----各ボタン配置-----*/

p#siki{
	position: absolute;
	/*top: 497px;*/
	/*top: 667px;*/
	top: 485px;
	left: 555px;
	}
p#siki a{
	background: url(img/button_siki.gif) no-repeat;
	width: 96px; padding-top: 20px;
	}

p#order{
	position: absolute;
	/*top: 520px;*/
	/*top: 690px;*/
	top: 508px;
	left: 555px;
	}
p#order a{ background: url(img/button_order.gif) no-repeat;
	width:96px; padding-top: 20px;}

p#teiki{
/*
	position: absolute;
	top:672px;
	left: 52px;
*/
	margin:15px;
	align:center;
	}
p#teiki a{
	background:url(img/teiki_bn.gif) no-repeat;
	width:635px;
	padding-top: 74px;
	margin-left:auto;
	margin-right:auto;
}

p#teiki2{ margin: 1.5em auto !important;}
p#teiki2 a{
	background:url(img/teiki_bn2.gif) no-repeat;
	width:632px;
	padding-top: 74px;}
div.teiki p.order{ margin: -20px auto 20px 500px;}
a.order{
	background: url(img/button_order.gif) no-repeat;
	width: 96px; padding-top: 20px;}

a.detail{ background: url(img/button_siki.gif) no-repeat;}