@charset "utf-8";
/* CSS Document */

/* ================================================================
　　　　商品大枠
================================================================ */

div.resultWrap{
	width:680px;
	margin-bottom:50px;
}

/* ----------- 商品詳細左側 ----------- */

div.resultWrap div.resultPic{
	width:220px;
	text-align:center;
	float:left;
	padding-left: 15px;
}
/* 商品詳細左側／メイン画像 */
div.resultWrap div.resultPic p.mainImg {
	padding-bottom: 10px;
}
/* 商品詳細左側／定価 */
div.resultWrap div.resultPic p span.originlP{
	color:#f25858;
	font-weight:bold;
}
/* 商品詳細左側／価格 */
div.resultWrap div.resultPic p span.price{
	color:#cc0033;
	font-weight:bold;
	font-size:146.5%;
}
/* 商品詳細左側／カートボタンエリア */
div.resultWrap div.resultPic div.cartBtn{
	padding:20px;
	margin-top:10px;
	border:3px solid #CCC;
}

/* ----------- 商品詳細右側 ----------- */
div.resultWrap div.resultTxt{
	width:410px;
	float:left;
	padding-left:20px;
}
/* 商品詳細右側／商品説明テキストエリア／商品サブタイトル */
div.resultWrap div.resultTxt p.itemCope{
	font-size:131%;
	font-weight:bold;
	border-top:1px dotted #CCC;
	padding:5px 0 15px;
}
/* 商品詳細右側／商品説明テキストエリア／商品説明アイコン */
div.resultWrap div.resultTxt ul.icons{
	padding-top:20px;
	border-top:1px dotted #CCC;
}
div.resultWrap div.resultTxt ul.icons li{
	display:inline;
}
/* 商品詳細右側／商品説明テキストエリア／説明文 */
div.resultWrap div.resultTxt div.itemTxt{
	margin-top:20px;
}
/* 商品詳細右側／商品説明テキストエリア／効果・効能 */
div.resultWrap div.resultTxt div.itemTxt div.wakuBg{
	color:#545454;
	background-color:#e9e9e9;
	padding:10px;
	margin:5px 0;
}
div.resultWrap div.resultTxt div.itemTxt div.wakuBg ul{
	margin-top:10px;
}
div.resultWrap div.resultTxt div.itemTxt div.wakuBg ul li{
	display:inline;
	background:url(/item/image/common/itemtext_listmark.gif) no-repeat 0px 0px;
	padding-left:15px;
	margin-right:5px;
	font-weight:bold;
	line-height:1.5em;
}
/* 商品詳細右側／商品説明テキストエリア／成分 */
div.resultWrap div.resultTxt p.seibun{
	color:#7f7f7f;
	font-size:77%;
	margin-top:20px;
	border-top:1px dotted #CCC;
	padding-top:10px;
}

/* 商品詳細左側／セット内容＆順番アイコン */
div.resultWrap div.itemNaiyou{
	margin-bottom:15px;
	padding: 5px 8px;
	border: #69F 1px solid;
	background-color: #EEF7FF;
	margin-top: 20px;
}

div.resultWrap div.itemNaiyou p {
	padding: 0;
	border-bottom: #69F 1px solid;
	margin-bottom: 5px;
}

div.resultWrap div.itemNaiyou li{
	padding-left:80px;
	line-height: 20px;
	margin-bottom: 3px;
}

div.resultWrap div.itemNaiyou li.step1{
	background: url(../image/common/step1.gif) no-repeat left top;
}

div.resultWrap div.itemNaiyou li.step2{
	background: url(../image/common/step2.gif) no-repeat left top;
}

div.resultWrap div.itemNaiyou li.step3{
	background: url(../image/common/step3.gif) no-repeat left top;
}

div.resultWrap div.itemNaiyou li.step4{
	background: url(../image/common/step4.gif) no-repeat left top;
}


/* 商品詳細右側／セット商品説明テキストエリア／説明文 */
div.resultWrap div.resultTxt p.itemTxt{
	margin-top:20px;
}
/* 商品詳細右側／セット商品説明テキストエリア／注意文 */
div.resultWrap div.resultTxt p.itemNotice{
	padding:10px;
	margin:20px 0 10px;
	background:url(/image/common/icon_error.png) no-repeat #e9e9e9 10px 10px;
	text-indent:20px;
}
/* 商品詳細右側／クリスマスキャンペーン_ミラクルクレンジング／注意文 */
div.resultWrap div.resultTxt div.attention{
	padding:10px;
	margin:20px 0 10px;
	background:#fef6fa;
	border:#f5288d solid 1px;
	text-align:center;
	line-height:1.3;
}
div.resultWrap div.resultTxt div.attention p{
	text-align:center;
	color:#f5288d;
	font-weight:bold;
}

div.resultWrap div.resultTxt div.attention2{
	padding:10px;
	margin:20px 0 10px;
	background:#FFEEE6;
	border:#FF8040 solid 1px;
	text-align:center;
	line-height:1.3;
}
div.resultWrap div.resultTxt div.attention2 p{
	text-align:center;
	color:#FF8040;
	font-weight:bold;
}






/*分割払い*/

.bunkatu {
	padding: 10px;
	background-color:#FFF4F4;
	border-left: 1px #FCC solid;
	border-right: 1px #FCC solid;
	border-bottom: 1px #FCC solid;
}

/* ================================================================
　　　　ユーザーコメント
================================================================ */
div#comment{
	margin-bottom:40px;
}

div#comment div#function{
	margin-bottom:10px;
	width:660px;
	background: url(../image/comment/comment_bg1.gif) top left no-repeat;
	height: 50px;
	display: block;
	padding: 10px;
}

/*コメント検索の右側*/
div#comment div#function div#functionR {
	float:right;
	width: 380px;
	background-color: #FFF;
	height: 50px;
	position: relative;
}

div#comment div#function div#functionR .link1{
	position: absolute;
	top: 15px;
	left:10px;
	padding-left: 20px;
	background:url(../../image/common/ico_arrow01.gif) left center no-repeat;
}
div#comment div#function div#functionR .link2{
	position: absolute;
	top: 6px;
	left:185px;
}

/*コメント検索の左側*/
div#comment div#function div#functionL {
	float:left;
	width: 270px;
	height: 50px;
	position: relative;
}

div#comment div#function div#functionL .link1{
	position: absolute;
	top: 20px;
	left:0;
	width: 100px;
}
div#comment div#function div#functionL .link2{
	position: absolute;
	top: 15px;
	left:70px;
}

/* コメント表示部分（縦スクロール付） */
div#comment div#inflame{
	height:300px;
	overflow-y:scroll;
	scrollbar-base-color:#ffffff;
	scrollbar-face-color:#ffffff;
	scrollbar-arrow-color:#FCD127;
	scrollbar-shadow-color:#FCD127;
	scrollbar-darkshadow-color:#ffffff;
	scrollbar-highlight-color:#FCD127;
	scrollbar-3dlight-color:#ffffff;
	scrollbar-track-color:#ffffff;
	width:680px;
	background-color:#FFFBEC;
}
/* コメント表示部分（縦スクロール付）／コメント1件表示部分 */
div#comment div#inflame .comntBox{
	border:3px solid #fef2c0;
	width:635px;
	padding:10px;
	clear: both;
	background-color:#FFF;
}
/* コメント表示部分（縦スクロール付）／コメント1件表示部分／ユーザー情報表示部分 */
div#comment div#inflame .comntBox .aboutArea{
	width: 210px;
	padding: 0 10px 0 0;
	border-right: 1px #ccc dotted;
	float: left;
}

div#comment div#inflame .comntBox .aboutArea .itemArea {
	border-bottom: #ccc 1px dotted;
	padding-bottom: 10px;
	margin-bottom: 10px;
}

div#comment div#inflame .comntBox .aboutArea .itemname {
	float: right;
	width: 160px;
}

div#comment div#inflame .comntBox .aboutArea .itemicon {
	float:left;
	width: 50px;
}

div#comment div#inflame .comntBox .aboutArea .nickname {
	border-bottom: #ccc 1px dotted;
	padding-bottom: 10px;
	margin-bottom: 10px;
	display: block;
	width: 210px;
}

div#comment div#inflame .comntBox .aboutArea .nickname img {
	float:right;
	display:block;
	padding-left:5px;
}

div#comment div#inflame .comntBox ul li{
	padding-left:90px;
	display: block;
	text-align: left;
	height: 25px;
	line-height: 25px;
	margin-bottom: 5px;
}

div#comment div#inflame .comntBox ul li.period {
	background: url(../image/comment/icon_period.gif) top left no-repeat;
	
}

div#comment div#inflame .comntBox ul li.views {
	background: url(../image/comment/icon_views.gif) top left no-repeat;
}

div#comment div#inflame .comntBox ul li.user {
	background: url(../image/comment/icon_user.gif) top left no-repeat;
}


/* コメント表示部分（縦スクロール付）／コメント1件表示部分／コメント内容表示部分 */
div#comment div#inflame .comntBox div.textArea{
	width:400px;
	float: right;
}
div#comment div#inflame .comntBox div.textArea p{
	padding:10px 0;
}

div#comment div#inflame .comntBox div.textArea .title {
	padding-left: 45px;
	background:  #FFFFE8 url(../image/comment/comment_titile_icon.gif) 10px 10px no-repeat;
	font-weight: bold;
	
}
div#comment div#inflame .comntBox div.textArea .photoArea{
	padding:0 10px 10px 0;
	display: block;
}
div#comment div#inflame .comntBox div.textArea .photoArea img{
	padding-right: 10px;
}

h3 {
	clear:both;
}


/* canpen用プルダウン内用 */
.txt_333 {
	color:#333333
}


/* ================================
単品 関連商品
================================ */

ol.direction{
	background:url(../image/common/direction_bcg.gif) no-repeat left center;
	height:204px;
	
}
ol.direction li{
	float:left;
	width: 125px;
	margin-left:13px;
	margin-bottom:20px;
	padding-top: 17px;
}
ol.direction li.first{
	float:left;
	width: 125px;
	margin-left:0;
}
ol.direction li.last{
	color:#F00;
}

ol.direction li.set {
	background:url(../image/common/osusume.jpg) top center no-repeat;
}


ol.direction li a {
	display:block;
	width: 125px;
	border:#FFF 1px solid;
}

ol.direction li a:hover{
	display:block;
	width: 125px;
	border:#CCC 1px solid;
}

ol.direction li.select a{
	display:block;
	width: 125px;
	border: #F69 1px solid;
}


ol.direction2{
	background:url(../image/common/direction_bcg2.gif) no-repeat left center;
	height:204px;
}
ol.direction2 li{
	float:left;
	width: 125px;
	margin-left:13px;
	margin-bottom:20px;
	padding-top: 17px;
}
ol.direction2 li.first{
	float:left;
	width: 125px;
	margin-left:0;
}

ol.direction2 li.set {
	background:url(../image/common/osusume.jpg) top center no-repeat;
}

ol.direction2 li a {
	display:block;
	width: 125px;
	border:#FFF 1px dotted;
}

ol.direction2 li a:hover{
	display:block;
	width: 125px;
	border:#CCC 1px solid;
}

ol.direction2 li.select a{
	display:block;
	width: 125px;
	border: #F69 1px solid;
}

/* ================================
セット　関連商品
================================ */

ol.setdirection{
	height:187px;
}
ol.setdirection li{
	float:left;
	width: 125px;
	margin-left:10px;
	margin-bottom:20px;
}

ol.setdirection li a {
	display:block;
	width: 125px;
	border:#FFF 1px solid;
}

ol.setdirection li a:hover{
	display:block;
	width: 125px;
	border:#CCC 1px solid; 
}

/*クリスマスキャンペーン商品一覧 */
.setdirection .cam{
	float:left;
	width:140px;
	margin:0 15px;
}
.setdirection li .sale {
	text-align:center;
	}
.setdirection li .sale .price{
	color: #CC0033;
    font-size: 146.5%;
    font-weight: bold;
	}


/* ================================
下部バナー
================================ */
ul#banner_btn{
	margin:0 -15px;
	width: 710px;
}
ul#banner_btn li{
	float:left;
	width: 345px;
}


