@charset "utf-8";

/*
======== table of content. =================================

summary:コンテンツ用レイアウト定義

-CONTENT

-MAIN
  - MAIN RIGHT
  	

============================================================
*/

div#main div.commodity{
	width: 620px;
	margin:50px 0 0 0;
}

div#main div.commodity div.right{
	width: 310px;
	float: right;
}

div#main div.commodity div.right h2{
	padding: 8px 0 25px 0;
}

div#main div.commodity div.right p.comment{
	width: 300px;
	margin: 20px 0;
}

div#main div.commodity div.right div.order{
	width: 310px;
	padding: 0 0 6px 0;
	background: url(../commodity/images/jewelryfoam/bg_order.gif) no-repeat left bottom;
}

div#main div.commodity div.right div.order p.price{
	background: url(../commodity/images/jewelryfoam/bg_order_top.gif) no-repeat left top;
	font-weight: bold;
	color:#333333;
	text-align:center;
	padding:14px 0 0 0;
}

div#main div.commodity div.right div.order p.btn{
	padding: 9px 0 0 9px;
	text-align:center;
}

div#main div.commodity div.right div.order p.rakuten{
	padding: 20px 0 0 0;
	float: left;
}

/*pagelink*/
div#main ul.pagelink{
	width: 610px;
	padding: 0 0 10px 10px;
	margin: 33px 0 0 0;
	background: url(../commodity/images/jewelryfoam/bg_pagelink.jpg) repeat-x left bottom;
}

div#main ul.pagelink li{
	float: left;
	margin:0 5px 0 0;
}

/*section共通-----------------------------------------------------*/
div#main div.section{
	width: 620px;
	padding: 0 0 15px 0;
	background: url(../commodity/images/jewelryfoam/bg_section.gif) repeat-y left top;
}

div#main div.section h3{
	background: url(../commodity/images/jewelryfoam/bg_ttl.jpg) no-repeat left top;
	padding: 25px 0 49px 25px;
}

div#main div.section h4{
	padding: 0 0 0 20px;
}

div#main div.section div.sectionin{
	margin: 15px 0 50px 35px;
	width: 550px;
}

div#main div.section div.sectionin p.photo{
	padding: 0 0 30px 25px;
	float: right;
}

div#main div.section div.sectionin p.ttl{
	color: #F27C8B;
	font-weight: bold;
	padding: 0 0 15px 0;
}

div#main div.section div.sectionin p.ttl02{
color:#333;
font-weight:bold;
padding:0 0 0 16px;
background:url(../commodity/images/fineball/ic_01.jpg) no-repeat left 6px;
}

/* koan */
div#main div.section div.koanout{
	width: 580px;
	margin: 0 0 0 20px;
	background: url(../commodity/images/jewelryfoam/bg_koan_middle.jpg) repeat-y left bottom;
	clear: both;
}

div#main div.section div.koan{
	width: 580px;
	padding: 0 0 12px 0;
	background: url(../commodity/images/jewelryfoam/bg_koan_bottom.jpg) no-repeat left bottom;
}

div#main div.section div.koan div.left{
	width: 340px;
	padding: 13px 0 0 17px;
	float: left;
}

div#main div.section div.koan div.left p.comment{
	padding: 10px 10px 6px 0;
	color:#333;
	float:left;
}

div#main div.section div.koan div.left p.flash_btn{
	width:88px;
	height:26px;
	padding: 5px 10px 0 0;
	float:left;
}
div#main div.section div.koan p.photo{
	margin: 0 0 0 10px;
	float: left;
}

/* orderbnr */
div#main div.section div.orderbnr{
	width: 578px;
	height: 114px;
	margin: 25px 0 0 20px;
	background: url(../commodity/images/joyshower/btn_order02.jpg) no-repeat left top;
}

div#main div.section div.orderbnr div.left{
	width: 228px;
	padding: 10px 0 0 115px;
	float: left;
}

div#main div.section div.orderbnr p.btn{
	padding: 20px 0 5px 0;
}

div#main p.sec-pagetop{
	clear: both;
	width: 620px;
	text-align: right;
	padding: 20px 0 40px 0;
	background: url(../commodity/images/jewelryfoam/bg_section_bottom.gif) no-repeat left top;
}

/* step */
div#main div.section dl.step{
	width: 556px;
	margin: 0 0 0 35px;
}

div#main div.section dl.step dt{
	width: 271px;
	float: left;
}

div#main div.section dl.step dd{
	width:270px;
	float:right;
}


/* voice */
div#main div#voice{
	width: 620px;
	padding: 0 0 10px 0;
	margin: 0 0 28px 0;
	background: url(../commodity/images/jewelryfoam/bg_voice.gif)  no-repeat left bottom;
}

div#main div#voice div.right{
	width: 442px;
	float: right;
}

div#main div#voice div.right h4{
	font-weight: bold;
	font-size: 134%;
	color:#F27A8A;
	padding: 0 0 10px 0;
}

div#main div#voice div.right p.comment{
	padding: 0 20px 0 0;
}

div#main div#voice div.right p.name{
	font-size:92%;
	font-weight: bold;
	text-align:right;
	padding: 8px 20px 0 0;
}

div#main div#voice div.right p.btn{
	margin: 20px 0 0 250px;
	padding: 0 0 5px 0;
}

div#main div#voice p.photo{
	float: right;
	padding: 0 5px 0 0;
}

/* osusume */
div#main div.osusume{
	background: url(../images/common/line_gray_doded.gif) repeat-x left top;
	padding: 27px 0 0 0;
	position:relative;
}

div#main div.osusume p.purpose{
	top:35px;
	left:527px;
	position:absolute;
}

div#main div.osusume ul{
	width: 620px;
	padding: 0;
	background: url(../commodity/images/jewelryfoam/bg_osusume.gif) repeat-y left top;
}

div#main div.osusume li{
	width: 165px;
	padding: 0 0 10px 10px;
	margin: 0 0 0 15px;
	display: inline;
	background: url(../images/common/ic_pink.gif) no-repeat left 7px;
	float: left;
}

div#main p.sec-pagetop2{
	clear: both;
	width: 620px;
	text-align: right;
	padding: 20px 0 40px 0;
	background: url(../commodity/images/jewelryfoam/bg_osusume_bottom.gif) no-repeat left top;
}