@charset "utf-8";

body
{
	min-width: 100%;
	min-height: 100%;
	overflow: hidden;
	background: url(../img/goods/bg.png) repeat 0 0;
}

/*************************
	wrap
*************************/

#wrap
{
	width: 100%;
	min-width: 960px;
	min-height: 650px;
	background: url(../img/goods/bg_top.png) repeat-x 0 0;
	position: relative;
	padding-top: 50px;
}

#wrap h1.ttl
{
	width: 726px;
	height: 33px;
	background: url(../img/goods/ttl.png) no-repeat 0 0;
	margin: 0 auto 24px;
	text-indent: -726px;
	overflow: hidden;
	white-space: nowrap;
}

/*************************
	close
*************************/

#close
{
	display: block;
	width: 50px;
	height: 50px;
	background: url(../img/modal/bttn_close.png) no-repeat 0 0;
	text-indent: 100%;
	overflow: hidden;
	position: absolute;
	white-space: nowrap;
	top: 0;
	right: 0;
}

#close:hover
{
	background-position: 0 -50px;
}

/*************************
	list
*************************/

#list
{
	width: 741px;
	margin: 0 auto;
	overflow: hidden;
}

#list li
{
	width: 245px;
	height: 246px;
	float: left;
	margin: 0 1px 2px;
}

#list li a
{
	display: block;
	width: 227px;
	height: 222px;
	background: url(../img/goods/list_bg.png) no-repeat 0 0;
	padding: 24px 9px 0;
}

#list li a:hover
{
	background-position: -245px 0;
}

#list li a div
{
	width: 227px;
	height: 70px;
	background: url(../img/goods/list_img.png) no-repeat 0 0;
	padding-top: 143px;
}

#list li.g_01 a div, #list li.g_01 a div h2{ background-position: 0 0; }
#list li.g_02 a div, #list li.g_02 a div h2{ background-position: -227px 0; }
#list li.g_03 a div, #list li.g_03 a div h2{ background-position: -454px 0; }
#list li.g_04 a div, #list li.g_04 a div h2{ background-position: -681px 0; }
#list li.g_05 a div, #list li.g_05 a div h2{ background-position: -908px 0; }
#list li.g_06 a div, #list li.g_06 a div h2{ background-position: -1135px 0; }

#list li a div h2
{
	width: 227px;
	height: 70px;
	background: url(../img/goods/list_txt.png) no-repeat 0 0;
	text-indent: 100%;
	overflow: hidden;
	white-space: nowrap;
}

/*************************
	container
*************************/

#container
{
	width: 864px;
	height: 482px;
	margin: 0 auto 32px;
	padding-top: 50px;
}

#container a.arrow
{
	display: block;
	width: 72px;
	height: 84px;
	background: url(../img/goods/arrow.png) no-repeat 0 0;
	text-indent: 100%;
	overflow: hidden;
	white-space: nowrap;
	float: left;
	margin-top: 199px;
}

#container a.next{ background-position: -72px 0; }
#container a.prev:hover{ background-position: 0 -84px; }
#container a.next:hover{ background-position: -72px -84px; }

/*************************
	content
*************************/

#content
{
	width: 720px;
	height: 482px;
	background:url(../img/goods/content_bg.png) no-repeat 0 0;
	float: left;
	position: relative;
	overflow: hidden;
}

/*************************
	photo
*************************/

#photo
{
	margin: 35px 0 0 40px;
	float: left;
}

div#photo
{
	width: 338px;
	height: 416px;
	text-align: center;
}

#content.g_06 div#photo img{ margin-top: 108px; }

#photo li
{
	width: 338px;
	height: 214px;
	text-align: center;
}

/*************************
	detail
*************************/

#detail
{
	width: 285px;
	float: right;
	margin: 35px 31px 0 0;
}

#detail h1
{
	width: 285px;
	height: 78px;
	background: url(../img/goods/name.png) no-repeat 0 0;
	text-indent: 300px;
	white-space: nowrap;
	overflow: hidden;
	margin-bottom: 4px;
}

#content.g_01 #detail h1{ background-position: 0 0; }
#content.g_02 #detail h1{ background-position: 0 -78px; }
#content.g_03 #detail h1{ background-position: 0 -156px; margin-bottom: 28px; }
#content.g_04 #detail h1{ background-position: 0 -234px; }
#content.g_05 #detail h1{ background-position: 0 -312px; }
#content.g_06 #detail h1{ background-position: 0 -390px; }

/*************************
	type
*************************/

#type
{
	width: 281px;
}

#type li
{
	width: 281px;
	height: 32px;
	margin-bottom: 16px;
}

#content.g_03 #type li{ height: 50px; margin-bottom: 10px; }
#content.g_04 #type li{ margin-bottom: 10px; }

#type li.num_01{ background: url(../img/goods/num_01.png) no-repeat 0 3px; }
#type li.num_02{ background: url(../img/goods/num_02.png) no-repeat 0 3px; }

#type li span
{
	display: block;
	width: 240px;
	height: 32px;
	margin-left: 41px;
	background: url(../img/goods/name_type.png) no-repeat 0 0;
	text-indent: 240px;
	white-space: nowrap;
	overflow: hidden;
}

#content.g_01 #type li.num_01 span{ background-position: 0 0; }
#content.g_01 #type li.num_02 span{ background-position: 0 -50px; }
#content.g_02 #type li.num_01 span{ background-position: 0 -100px; }
#content.g_02 #type li.num_02 span{ background-position: 0 -150px; }
#content.g_03 #type li.num_01 span{ background-position: 0 -200px; height: 50px; }
#content.g_03 #type li.num_02 span{ background-position: 0 -250px; height: 50px; }
#content.g_04 #type li.num_01 span{ background-position: 0 -300px; }
#content.g_04 #type li.num_02 span{ background-position: 0 -350px; }

/*************************
	price
*************************/

#price
{
	width: 275px;
	position: absolute;
	bottom: 38px;
	right: 40px;
	background: url(../img/goods/release_price_bg.gif) no-repeat 0 24px;
}

#price p.date
{
	width: 275px;
	height: 14px;
	background: url(../img/goods/release_date.png) no-repeat 0 0;
	text-indent: 275px;
	white-space: nowrap;
	overflow: hidden;
	margin-bottom: 10px;
}

#price p.price
{
	width: 275px;
	height: 30px;
	background: url(../img/goods/release_price.png) no-repeat 0 0;
	text-indent: 275px;
	white-space: nowrap;
	overflow: hidden;
	margin-bottom: 7px;
}

#content.g_01 #price p.price{ background-position: 0 0; }
#content.g_02 #price p.price{ background-position: 0 -30px; }
#content.g_03 #price p.price{ background-position: 0 -60px; }
#content.g_04 #price p.price{ background-position: 0 -90px; margin-bottom: 17px; }
#content.g_05 #price p.price{ background-position: 0 -120px; margin-bottom: 17px; }
#content.g_06 #price p.price{ background-position: 0 -150px; margin-bottom: 17px; }

#price p.inquiry
{
	width: 266px;
	color: #003590;
}

#price p.attention
{
	width: 266px;
	color: #ff0000;
	margin-bottom: 13px;
}

/*************************
	return
*************************/

#return
{
	display: block;
	width: 189px;
	height: 36px;
	background: url(../img/goods/btn_return.png) no-repeat 0 0;
	text-indent: 100%;
	overflow: hidden;
	white-space: nowrap;
	margin: 0 auto
}

#return:hover
{
	background-position: 0 -36px;
}