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

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


/*----共通使用-----*/

	/*----外枠ライン-----*/

div#frame{
	width: 753px;
	margin: 0 auto 10px auto;
	background: #FFFFFF url(img/bg_side.gif) center top repeat-y;
	} 


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

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

		/*----ナビ-----*/
	#navi{
	position: absolute;
	top: 75px;
	left: 46px;
	width: 680px;
		}

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

	#navi li a{
		color: #000000;
		background: url(img/button_navi.gif) no-repeat;
		background-position: left top;
		display:block;
		line-height: 30px;
/*		margin-right: 6px; */
		margin-right: 10px;
		overflow: hidden;
		text-decoration: none;
		width: 100px;
		}

	#navi li a:hover,
	#navi li a.stay{
		display: block;
		color: #FFFFFF;
		background-position: right top !important;
		}

	#navi li a.last{ margin-right: 0;}

	#navi li a.longword{ font-size: 0.85em;}

    		/*---子なび設定----*/
		#navi ul{ display: none; position: absolute;}/*---子なびの表示非表示----*/
		#navi ul li{ float: none;}/*--子なびの縦横並び制御---*/
		#navi ul li a{
			background: none #FFFFFF;
			border-right: #BBBBBB solid 1px;
			border-left: #BBBBBB solid 1px;
			border-bottom: #BBBBBB solid 2px;
			color:#660000;
			font-size: 0.75em;
			width: 120px;
			}
		#navi ul li a:hover{
			background-color:#660000;
			color: #FFFFFF;
			}

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



/*----共通----*/
div.primary{
	position: relative;
	width:630px;
	margin: 0 auto;
	text-align: left;
	font-size: 90%;}
h2{ margin-top: 15px; clear: both;}
h2 img{ display: block; margin: 0 auto;}
h3 img{ display: block;}
h3{ padding-top: 0px;}

span.stg{
  font-size:1.2em;
  font-weight: bold;
  }
span.stg2{ color: #993300;}
span.stg3{
	color: #E50044;
}
span.stg4{ font-size: 1.6em;}
span.mark{ font-size: 80%;}
span.ruby{ font-size:0.9em;}
span.block{ 
	display: inline-block;
	padding-top: 5px;
}

img#footer{ display: block;}


		/*----detail&order&teiki----*/
		div#materials{
			clear: both;
			border-top: #996633 dotted 2px;
			margin-top: 1em;
			font-size:0.8em;
			}
		div#materials h3{ padding-top: 0;}
		.columns{
			width:295px;
			padding: 10px;
			float: left;
			}
		.columns h3{ margin-top: 0;}
		.columns li{
			text-indent:-1em;
			margin-left: 1em;
			margin-top: 7px;
			line-height: 1.4em;
			}
		.columns dt{ font-weight: bold; line-height: 1.4; margin: 7px 0 2px;}
		.columns dd{ margin-left: 1em; line-height: 1.4;}

		/*----order&teiki----*/
		p.address{
			font-weight: bold;
			font-size:1.1em;
			padding-left: 2em;
			}




/*----トップ----*/
div#index{
	background:url(img/bg_under.gif) repeat-x left  bottom;
	width: 98%;
	margin: 0 auto; 
	}
div#index h2{ margin-top: 0;}
div#index h3{
	margin: 0 auto;
	width: 610px;
	height: 364px;
	padding-bottom: 10px;
	}

/*----商品特徴----*/
div.point{ width: 199px; float: left; font-size:0.85em; line-height: 1.3; min-height: 180px; height: auto !important; height: 180px;}
div.point h3{ padding-top: 0;}
div.point p{ padding: 0.5em; margin-bottom: 10px;}
div.center{ margin: 0 16px;}
div.clr{ clear: left;}
div.point p.fun { padding-bottom: 57px; background: url(img/detail_08img.gif) right bottom no-repeat; }


/*----input----*//**/
div#input{ width: 648px; float: left; margin-bottom: 20px;}
div#input h4{ margin-top: 1em; font-size: 0.85em;}
img#detail_photo{ float: right;}

div#chase{ margin: 20px auto 30px auto; height: 33px; padding: 10px 0; border-bottom:#996633 dotted 1px;
border-top:#996633 dotted 1px;}

			
		/*-order-*//*--- 発売前の注文についての注意事項 ---*/
		div#cation{ background-color:#FFFFFF; color:#FF0000; width:540px; margin: 10px auto; padding: 15px; border: #CC6600 double 3px; font-size: 0.7em; font-weight: bold; text-align: left;}	
		div#order div#cation{ font-size:0.9em;}
		div#cation h3{ padding-top: 0;}
#order h3 {
		margin: 15px 0 5px;
}
#order p {
		line-height: 1.5;
}


/*----定期購入----*//**/
div#teiki dl { margin-bottom: 15px;}
div#teiki dt{ margin-top:1.2em; margin-bottom: 3px;}
p.caution {
	color:#E50044;
	font-weight:bold;
	font-size:1.2em;
	line-height: 1.3;
}
#teiki h3 {
		margin-top: 15px;
		line-height: 1.4;
}
#teiki p {
		line-height: 1.5;
}

/*----Q&A----*/
div#QA{ background: url(img/qa_bg.jpg) no-repeat 97% top;}
div#QA h2{padding-top: 5px;}
div#QA dl{ margin-top: 20px;}
div#QA dl.first{ margin-top: 45px;}
div#QA dd{ margin-top: 5px; width: 600px; line-height: 1.3;}
div#QA dd img{ display: block; float: left; margin: auto 1.2em 2em 10px;}
div#QA dd#a1{ width: 420px;}
div#QA dd#a2{ width: 465px;}

div#voice{
	background: url(img/QA_05.jpg) no-repeat right top;
	padding-right: 140px;
	margin: -25px auto 20px 60px;}
div#voice p{ text-indent: 1em; margin-bottom: 0.7em; line-height:1.4em;}


/*----お客様の声----*/
#customer h2 {
	margin-top: 25px;
}

#customer h3 {
	margin: 10px 0 30px 2px;
	font-size: 1em;
}

dl#voice {
	width: 600px;
	margin: 0 0 40px 40px;
	line-height: 1.2;
}

dl#voice dt {
	padding-left: 15px;
	background: url(img/square.gif) no-repeat left 2px;
}

dl#voice dd {
	margin: 3px 0 15px 15px;
}



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

table{
	text-align: left;
	border: #996633 solid 1px;
	border-collapse: separate;
	border-spacing: 0.3em;
	margin: 5px auto 20px auto;
	}
table th{
	width: 13em;
	color: #993300;
	}
table th,td{
	background-color: #FFECD2;
	padding: 5px 10px 5px 5px;
	}
table li{
	list-style: inside disc;
	padding-left:1em;
  	text-indent:-1em;}
			
			
/*-- 代引きのTable --*/
div.primary table.price {
	width: auto;
	font-size: 92.4%;
	margin: 5px 0 10px 20px;
	border-collapse: inherit;
	border-spacing: 0;
	border-right: 1px solid #EADAD0;
	border-left: none;
	border-top: none;
	border-bottom: 1px solid #EADAD0;
}

div.primary table.price tr th {
	text-align: center;
	font-weight: normal;
	color: #333;
	border-top: 1px solid #EADAD0;
	border-left: 1px solid #EADAD0;
	padding: 5px 10px;
	background-color: #FFECD2;
}

div.primary table.price tr td {
	text-align: center;
	border-top: 1px solid #DDDFE2;
	border-left: 1px solid #DDDFE2;
	padding: 5px 10px;
	background-color: #FFF;
}


/*-- 無料サンプルCPN --*/
#cpnSample {
	position: relative;
	width: auto;
	margin: 0 10px 0 58px;
}
/*-- 無料サンプルentry --*/
#cpnEntry {
	width: auto;
	margin: 0 0 30px 50px;
}
#cpnEntry p#process {
	margin-top: 30px;
}
#cpnEntry h2 img {
	margin: 50px 0 10px;
}
#cpnEntry ul#txt {
	width: 400px;
	margin-left: 3px;
	line-height: 1.5;
	font-size: 0.9em;
	letter-spacing: -0.03em;
}
#cpnEntry ul#txt li.first {
	color: #CC3333;
}
#cpnEntry p.stxt {
	width: 400px;
	margin: 5px 0 0 3px;
	padding-left: 1.2em;
	text-indent: -1.2em;
	font-size: 0.75em;
	line-height: 1.3;
}
#cpnEntry p.entryImg {
	position: absolute;
	top: 60px;
	left: 430px;
}
#cpnEntry h3 {
	margin: 90px 0 5px;
}
	


/*----sample-----*/
div.sample{ background: url(img/bg_header2.gif) top center no-repeat !important;}



/*--- campaign ---*/
div#campaign{ width: 735px;}


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

#address{
  font-size:0.75em;
  border-top: #996633 dotted 2px;
  width:99%;
  clear: both;
  margin: 0 auto;
  padding-top: 13px;
  }
#address img{ display:inline !important;}
#address a{ margin-left: 15px;}


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

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


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

	/*トップ*/
		/*--サンプルバナー--*/
p#bn_sample{
	position: absolute;
	top: 306px;
	left: 52px;
	}
p#bn_sample a{
	background: url(img/btn_sample.gif) no-repeat;
	width: 632px;
	padding-top: 126px;
	}
	
		/*--キャンペーンバナー--*/
p#bn_campaign{
	position: absolute;
	top: 378px;
	left: 52px;
	}
p#bn_campaign a{
	background: url(img/bn_campaign.gif) no-repeat;
	width: 634px;
	padding-top: 79px;
	}
	
	
		/*----定期購入バナー-----*/
p#bn_teiki{
	position: relative;
	}
p#bn_teiki a{
	background: url(img/bn_teiki.gif) no-repeat;
	width: 634px;
	padding-top: 80px;
	margin: 0 auto;
	}
	
				/*----定期購入バナー　TOP用-----*/
		div#index p#bn_teiki{
		/*	margin-top: -70px;	topのcationを削除する時に復活 --*/
		/*	margin-top: 40px;*/	/*-- topのcationを削除と同時に削除 --*/
			padding-bottom: 10px;
			}
		div#index p#bn_teiki a{ background-color:#f4e2d1;}
		div#index p#bn_teiki a:hover{ background-color:#FFFFFF;}

				/*----定期購入バナー　ORDER用-----*/
		div#order p#bn_teiki a{ background-color: #FFCC66;}
		div#order p#bn_teiki a:hover{ background-color:#FFCC99;}

		/*----詳しくは　ボタン-----*/
p#mame{
	position: absolute;
	top: 801px;
	top: 720px;
	left: 555px;
	}
p#mame a{
	background:url(img/button_mame.gif) no-repeat;
	width: 98px;
	padding-top: 22px;
	}



	/*インプット（cgi注文ページ）*/
		/*--ご利用にあたってボタン--*/
p#use{
	position: absolute;
	top: 175px;
	left: 350px;
	}
p#use a{
	background: url(img/button_use.gif) no-repeat;
	width:99px;
	padding-top: 22px;
	}

		/*--ご注文についてボタン--*/
p#howtoorder{
	position: absolute;
	top: 275px;
	left: 350px;
	}
p#howtoorder a{
	background: url(img/button_howtoorder.gif) no-repeat;
	width:99px;
	padding-top: 22px;
	}	

		/*--定期お届けコースボタン--*/
p#teiki{
	position: absolute;
	top: 302px;
	left: 350px;
	}
p#teiki a{
	background: url(img/button_teiki.gif) no-repeat;
	width:99px;
	padding-top: 22px;
	}	




	/*--ご注文はこちらボタン--*/
p.order a{
	background: url(img/button_order.gif) no-repeat;
	width:99px;
	padding-top: 22px;
}

			/*--top 用--*/
		div#index p.order{
	position: absolute;
	top: 826px;
	top: 745px;
	left: 555px;
			}
			/*--detail 用--*/
		div#detail div#spsTxt {
			margin: -5px 5px 5px 27px;
			font-size:0.85em;
			line-height: 1.5;
		}
		div#detail div#spsTxt dl {
			margin: 5px 15px 50px 0;
		}
		div#detail div#spsTxt dl dt {
			display: inline;
			float: left;
			width: 6.5em;
			}
		div#detail div#spsTxt dl dd {
			display: inline;
			float: left;
			margin: 0;
			}
			




		div#detail p.order{
			clear: both;
			position: relative;
			left: 27px;
			margin: 10px 0 20px;
			}
			/*--how to order用 , teiki用--*/
		div#order p.order,
		div#teiki p.order{
			position: static;
			float: right;
			margin-top:-25px;
			margin-right: 15px;
			}
			/*---- campaign用-----*/
		div#campaign p.order{
			position: relative;
			top: -170px;
			left: 280px;
			}
			
			
/*--無料サンプル--ご応募ボタン--*/
p.entry a,
p.entry2 a {
	background: url(img/btn_entry.gif) no-repeat;
	width:99px;
	padding-top: 22px;
}

div#cpnSample p.entry {
	position: absolute;
	top: 190px;
	left: 520px;
}

div#cpnSample p.entry2 {
	position: absolute;
	top: 530px;
	left: 15px;
}