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

	For SS product file

	Last update : 2010.2.4
	mio urakami

	---------------------------
	1-0 structure
		1-1 common
		1-2 itemdetailpage
		1-3 float clear
	2-0 visual setting
		2-1 商品紹介トップページ　サブカテゴリタイトル
		2-2 商品一覧エリア
		2-3 navi
			2-3-1 カテゴリボタン画像
			2-3-2 現在地のカテゴリ（カテゴリトップページ：リンク無し）ボタン画像
			2-3-3 現在地のカテゴリ（カテゴリトップページ以外：リンクあり）ボタン画像
			2-3-4 カテゴリリストの設定
		2-4 titlearea
		2-5 サブカテゴリトップページタイトル
		2-6 商品詳細ページ
			2-6-1 タイトル・説明文エリア
			2-6-2 メイン画像エリア
			2-6-3 カートエリア
		2-7 お客様の声
			2-7-1 タイトル・商品データエリア
			2-7-2　アンケートエリア
			2-7-3　ユーザーレビューエリア
--------------------------------------------*/


/*----------------------------------------------------------------
  1-0 structure
-----------------------------------------------------------------*/

/* --------------------------------------------
  1-1 common
---------------------------------------------*/


.productindex #main .lead{
	float:left;
	width:210px;
}

.productindex #main .itemarea{
	float:right;
	width:717px;
}

#main .itembox{
	float:left;
	width:166px;
	margin-right:11px;
}

.productindex #main .itembox{
	float:left;
	width:177px;
	margin:0;
}

/* --------------------------------------------
  1-2 itemdetailpage
---------------------------------------------*/

.itemdetailpage #ttlarea{
	float:right;
	width:325px;
	padding-bottom:20px;
}

.itemdetailpage #mainphotoarea{
	float:left;
	width:355px;
	padding-bottom:20px;
}

.itemdetailpage #sambnail li{
	float:left;
	width:110px;
	margin-right:7px;
}

.itemdetailpage .itembox03 .photoarea{
	float:left;
	width:136px;
}

.itemdetailpage .itembox03 .textarea{
	float:right;
	width:515px;
}


/* --------------------------------------------
  1-3 uservoice
---------------------------------------------*/

.uservoice #itemdata .text{
	width:564px;
	float:right;
}

.uservoice #itemdata .photo{
	width:117px;
	float:left;
}


/* --------------------------------------------
  1-4 float clear
---------------------------------------------*/

.cateblock, .itemblock, #main .itemblockfooter, .itemdetailpage #cartarea, .itemdetailpage .itembox03, .uservoice #enquete, .uservoice #userreview{
	clear:both;
}

/*----------------------------------------------------------------
  2-0 visual setting
-----------------------------------------------------------------*/

/* --------------------------------------------
  2-1 商品紹介トップページ　サブカテゴリタイトル
---------------------------------------------*/

.productindex #main h2{
	margin-top:23px;
	padding:14px 14px 25px 14px;
	color:#fff;
	font-size:100%;
	text-align:right;
}

.productindex #main h2 a:link{
	color:#fff;
}

.productindex #main h2 a:visited{
	color:#fff;
}

.productindex #soap h2{
	background:url("/img/product/ttl_soap02.gif") no-repeat left top;
}

.productindex #haircare h2{
	background:url("/img/product/ttl_haircare02.gif") no-repeat left top;
}

.productindex #homemade h2{
	background:url("/img/product/ttl_homemade02.gif") no-repeat left top;
}



.productindex #main .lead p{
	line-height:2.1;
	padding-left:8px;
}

/* --------------------------------------------
  2-2 商品一覧エリア
---------------------------------------------*/

#main .itemblock{
	padding-top:11px;
	background:url("/img/product/back_itemlist.gif") no-repeat 0 11px;
}

.productindex #main .itemblock{
	background:url("/img/product/back_itemlist.gif") no-repeat 12px 11px;
}

.productindex #main .cateblock .lead{
	padding-top:12px;
}

#main .itembox p{
	padding:16px 0 10px 16px;
}

.productindex #main .itembox p{
	padding:16px 0 10px 28px;
}

#main .itembox p.text{
	padding:0 14px 10px 16px;
	line-height:1.34;
}

.productindex #main .itembox p.text{
	padding:0 14px 10px 28px;
}

.productindex .itemblockfooter{
	padding-left:12px;
}

/* --------------------------------------------
  2-3 navi
----------------------------------------------*/

#navi{
	background:url("/img/productmenu/back_category.gif") repeat-y left top;
	border-bottom:1px solid #dad2d0;
}

#navi h2{
	padding:28px 6px 5px 0;
	background:url("/img/productmenu/ttl_category.gif") no-repeat left top;
	text-align:right;
}

#navi h3{
	margin-bottom:1px;
	font-weight:bold;
}

#navi h3.on{
	width:181px;
	height:27px;
	padding:18px 0 0 49px;
}

#navi h3 a{
	display:block;
	width:181px;
	height:27px;
	padding:18px 0 0 49px;
	text-decoration:none;
}

/* ----------------------------
  2-3-1 カテゴリボタン画像
------------------------------*/

#navi .soap h3 a{
	background:url("/img/productmenu/btn_soap.gif") no-repeat left top;
}

#navi .haircare h3 a{
	background:url("/img/productmenu/btn_haircare.gif") no-repeat left top;
}

#navi .homemade h3 a{
	background:url("/img/productmenu/btn_homemade.gif") no-repeat left top;
}

/* ----------------------------
  2-3-2 現在地のカテゴリ（カテゴリトップページ：リンク無し）ボタン画像
------------------------------*/

#navi .soap h3.on{
	background:url("/img/productmenu/btn_soap_on.gif") no-repeat left top;
}

#navi .haircare h3.on{
	background:url("/img/productmenu/btn_haircare_on.gif") no-repeat left top;
}

#navi .homemade h3.on{
	background:url("/img/productmenu/btn_homemade_on.gif") no-repeat left top;
}

/* ----------------------------
  2-3-3 現在地のカテゴリ（カテゴリトップページ以外：リンクあり）ボタン画像
------------------------------*/

#navi .soap h3.on02 a{
	background:url("/img/productmenu/btn_soap_on02.gif") no-repeat left top;
}

#navi .haircare h3.on02 a{
	background:url("/img/productmenu/btn_haircare_on02.gif") no-repeat left top;
}

#navi .homemade h3.on02 a{
	background:url("/img/productmenu/btn_homemade_on02.gif") no-repeat left top;
}

/* ----------------------------
  2-3-4 カテゴリリストの設定
------------------------------*/

#navi ul{
	margin-bottom:1px;
	padding:9px 13px 13px 13px;
	border-bottom:1px solid #dad2d0;
	list-style:none;
}

#navi ul.sub{
	margin:0;
	padding:0 0 13px 0;
	border:none;
	list-style:none;
}

#navi li{
	margin:0.7em 0;
	padding-left:11px;
	background:url("/img/productmenu/icon_list01.gif") no-repeat left 1px;
	line-height:1.2;
}

#navi li.on{
	font-weight:bold;
}


/* --------------------------------------------
  2-4 サブカテゴリトップページタイトル
----------------------------------------------*/

.soappage #titlearea02{
	background:url("/img/product/p_soap.jpg") no-repeat left top;
}


.haircarepage #titlearea02{
	background:url("/img/product/p_haircare.jpg") no-repeat left top;
}

.homemadepage #titlearea02{
	background:url("/img/product/p_homemade.jpg") no-repeat left top;
}

.cosmematerialspage #titlearea02{
	background:url("/img/product/p_extract.jpg") no-repeat left top;
}

.essentialoilpage #titlearea02{
	background:url("/img/product/p_essential.jpg") no-repeat left top;
}

.carrieroilpage #titlearea02{
	background:url("/img/product/p_carrier.jpg") no-repeat left top;
}



#titlearea02 h1{
	color:#be6d67;
	font-size:150%;
}

#titlearea02 p.lead{
	padding:32px 220px 20px 2px;
	line-height:1.5;
	font-size:100%;
}

/* --------------------------------------------
  2-5 商品詳細ページ
---------------------------------------------*/

.itemdetailpage #contents{
	width:696px;
}

/* ----------------------------
  2-5-1 タイトル・説明文エリア
------------------------------*/

.itemdetailpage #ttlarea a:link, .itemdetailpage #ttlarea a:visited{
	text-decoration:underline;
}

.itemdetailpage #ttlarea a:hover{
	text-decoration:none;
}

.itemdetailpage h1{
	padding:8px 0 1.5em 0;
	font-size:150%;
	line-height:1.34;
}

.itemdetailpage #ttlarea .lead{
	margin:10px 2px 2em 2px;
	line-height:2;
}

.itemdetailpage #ttlarea .spec{
	border-bottom:1px solid #dad2d0;
}

.itemdetailpage #ttlarea .spec h2{
	margin:10px 0;
	padding:10px 4px 0 4px;
	border-top:1px solid #dad2d0;
	font-weight:bold;
	line-height:1.34;
}

.itemdetailpage #ttlarea .spec p{
	margin:15px 4px;
	line-height:1.8;
}

/*ユーザーボイスページへ*/
.itemdetailpage #ttlarea .uservoice{
	margin-top:15px;
}

.itemdetailpage #ttlarea .uservoice p{
	text-align:right;
}

/* ----------------------------
  2-5-2 メイン画像エリア
------------------------------*/

.itemdetailpage #mainphotoarea ul{
	list-style:none;
}

.itemdetailpage #mainphotoarea li{
	padding-top:7px;
}

/* ----------------------------
  2-5-3 カートエリア
------------------------------*/

.itemdetailpage .itembox03{
	padding:15px;
	border:1px solid #dad2d0;
}

.itemdetailpage .itembox03 h2{
	padding-top:5px;
	font-size:117%;
	font-weight:bold;
	line-height:1.34;
}

.itemdetailpage .itembox03 .price{
	margin-top:0.5em;
}

.itemdetailpage .itembox03 .price em{
	color:#f33;
	font-size:117%;
}

.itemdetailpage .itembox03 p.text{
	margin-top:1em;
	line-height:1.7;
}

.itemdetailpage .itembox03 .spec{
	margin-top:12px;
	padding-top:12px;
	border-top:2px dotted #dad2d0;
}

.itemdetailpage .itembox03 .spec h3{
	margin-bottom:0;
}

.itemdetailpage .itembox03 .spec p{
	margin-top:0.5em;
	line-height:1.5;
}

.itemdetailpage .itembox03 .form{
	margin-top:16px;
}

.itemdetailpage .itembox03 .form input{
	margin-right:5px;
}

.itemdetailpage .itembox03 .btncart{
	margin-top:15px;
}

/* --------------------------------------------
  2-7 お客様の声
---------------------------------------------*/

/* ----------------------------
  2-7-1 タイトル・商品データエリア
------------------------------*/

.uservoice #contents{
	width:696px;
}

.uservoice #contents h1{
	padding:27px 0 35px 9px;
	font-size:150%;
	line-height:1.3;
}

.uservoice #itemdata .photo p{
	text-align:right;
}

.uservoice #itemdata .text{
	padding-bottom:15px;
}

.uservoice #itemdata .text p{
	margin-right:3px;
	line-height:1.8;
}

.uservoice #itemdata .text p.btn{
	margin:15px 3px 0 0;
	text-align:right;
}

/* ----------------------------
  2-7-2　アンケートエリア
------------------------------*/

.uservoice #enquete{
	background:#fff;
	border:1px solid #e8e6e6;
}

.uservoice #enquete h2{
	padding:22px 22px 0 22px;
	font-size:150%;
	line-height:1.2;
}

.uservoice #enquete h2 span.name{
	font-size:67%;
}

.uservoice #enquete h3{
	margin:35px 9px 0 127px;
	padding:11px 12px 11px 50px;
	background:url("/img/product/ttl_question.gif") no-repeat 5px 0;
	border-bottom:1px dashed #cdaaaa;
	font-size:117%;
	font-weight:bold;
}

.uservoice #enquete h4{
	margin:1.5em 30px 0 130px;
	padding-left:20px;
	background:url("/img/common/icon_dot_yellow.gif") no-repeat 5px 0;
	font-size:117%;
	font-weight:bold;
}

.uservoice #enquete ul{
	margin:1em 30px 0 154px;
	list-style:none;
}

.uservoice #enquete li{
	margin:1em 0;
	padding-left:11px;
	background:url("/img/productmenu/icon_list01.gif") no-repeat 0 1px;
	line-height:1.34;
}

.uservoice #enquete p{
	margin:1em 30px 0 154px;
	line-height:1.8;
}

.uservoice #enquete p.comment{
	margin:30px;
	line-height:1.8;
}

/* ----------------------------
  2-7-3　ユーザーレビューエリア
------------------------------*/

.uservoice #userreview{
	margin-top:26px;
	padding-top:25px;
	background:url("/img/product/line_double.gif") no-repeat 0 0;
}

.uservoice #userreview h2{
	padding:0 22px 40px 3px;
	font-size:150%;
	line-height:1.2;
}

.uservoice #userreview h2 span.name{
	font-size:67%;
}

.uservoice #userreview p{
	margin:1em 0 0 123px;
	padding-bottom:1em;
	border-bottom:1px solid #d7ccaf;
	line-height:1.8;
}