@charset "utf-8";

#page-header,#page-body,#page-footer {
	font-size:12px;
	line-height:1.5;
}

h1,h2,h3,h4,h5,h6 {
	font-family: "Lucida Grande","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ","Meiryo","ＭＳ Ｐゴシック",sans-serif;
	font-weight: bold;
	text-align: left;
	}

h1 { font-size: 40px; line-height: 42px;}
h2 { font-size: 24px; line-height: 28px; margin-bottom: 24px; }
h3 { font-size: 18px; line-height: 20px; margin-top: 30px; margin-bottom: 16px;}
h4 { font-size: 12px; line-height: 18px; margin-bottom: 4px;}

img {
	vertical-align: bottom;
	border: none;
	outline: none;
	}

/* over write ---------------------------------------------*/

/* ----------------------------------------------------------
#breadcrumbs from www.muji.net/css/muji.cc
---------------------------------------------------------- */
#breadcrumbs {padding-top: 12px; padding-bottom: 12px; overflow: hidden;}
#breadcrumbs ol {height: 19px; background: #DDD url(/img/common/breadcrumbsbg.gif) repeat-x 0 0;}
#breadcrumbs li {float: left; padding: 0 4px 0 0; color: #999; font-size: 10px; line-height: 19px; background: #FFF;}
#breadcrumbs a {display: block; padding: 0 12px 0 5px; text-decoration: none; background: #DDD url(/img/common/breadcrumbs.png) no-repeat 100% 0; -moz-border-radius: 2px 0 0 2px; -webkit-border-top-left-radius: 2px; -webkit-border-bottom-left-radius: 2px; border-radius: 2px 0 0 2px;}
#breadcrumbs a:hover { background: #CCC url(/img/common/breadcrumbs.png) no-repeat 100% -19px;}
/* shere */
#page-wrap { position:relative; }
.shareButton {position:absolute;top:10px;right:0;*top:20px;}
.shareButton li {display: inline-block; *display: inline; *zoom: 1; vertical-align: top;}
/*--------------------------------------------- over write */

html, body {
	width: 100%;
	height: 100%;
	}

.inblock {
	position: relative;
	display: inline-block;
	/display: inline;
	/zoom: 1;
	overflow: hidden;
	vertical-align: top;
	background-position: 0 0;
	}

a.btn:link,
a.btn:visited,
a.btn:hover,
a.btn:active {
	text-decoration: none;
	}
a.btn > * { cursor:pointer; } /* for IE */
a.disenable, a.disenable > * { cursor:default; }

.disenable {
	filter: alpha(opacity=25);
	-moz-opacity:0.25;
	opacity:0.25;
	}
a.disenable:hover {	color:#333; }


/* ============================================================
	chapter
   ============================================================ */

/* page header ------------------------------------------------ */

#page-header {
	position: relative;
	margin-bottom: 40px;
	/margin-bottom: 10px;
	text-align: left;
	width: 100%; /* for IE6 */
	z-index:200;
	}

#page-header h1 {
	position: absolute;
	top: 20px;
	left: 0;
	border-bottom: none;
	}

#page-header p.lead {
	position: absolute;
	top: 76px;
	left: 0;
	font-weight: bold;
	}

/* page body -------------------------------------------------- */

#page-body {
	position: relative;
	width: 880px; /* ie */
	margin-bottom: 30px;
	}

/* page footer ------------------------------------------------ */

#page-footer {
	position: relative;
	width: 880px; /* ie */
	margin-top: 60px;
	}

/* etc -------------------------------------------------------- */

img + p { margin-top: 8px; }
p + img { margin-top: 8px; }
img + span {
	display:block;
	margin-top: 6px;
	text-align: center;
	}

ol li h5 {
	margin-top: 0.4em;
	margin-bottom: 0.4em;
	margin-left: -1.4em;
	}
ol li {
	padding-bottom: 8px;
	text-align: left;
	padding-left:1.4em;
	}
ol .lm {
	margin-top: 0.4em;
	margin-bottom: 0.4em;
	}

ol .lm h5:first-letter {
	float: left;
	margin: 0em 0.2em 0 0;
	padding: 0 0;
	font-size: 130%;
	font-weight: normal;
	color: #7f0019;
	vertical-align: middle;
	}
.msie ol .lm h5:first-letter {
	line-height: 100%;
	}

/* ============================================================
	section jump tab
   ============================================================ */

.tab {
	position: relative;
	padding: 0;
	margin-top: 0px;
	margin-bottom: 24px;
	overflow: visible;
	border-bottom: 1px solid #333;
	}
.tab > div {
	overflow: visible;
	border-right: 1px solid #e8e8e8;
	}
.tab div:first-child {
	border-left: 1px solid #e8e8e8;
	}
.tab div.current {
	background-color: #f4f4f4;
	}

.tab a {
	display: block;
	margin-bottom: -1px;
	padding: 6px 10px 12px 12px;
	zoom: 1;
	text-decoration: none;
	}
.tab a span {
	font-weight: bold;
	text-decoration: none;
	}

.tab div.current a > span {
	filter: alpha(opacity=25);
	-moz-opacity:0.25;
	opacity:0.25;
	}
.tab div.current a, .tab div.current a > * {
	cursor: default;
	}

.tab a:hover img {
	-webkit-transition: all .2s ease;
	-moz-transition: all .2s ease;
	-o-transition: all .2s ease;
	transition: all .2s ease;
	filter: alpha(opacity=70);
	-moz-opacity:0.7;
	opacity:0.7;
	}
.tab div.current a:hover { color: #333 }
.tab div.current a:hover img {
	-webkit-transition: all 0 ease;
	-moz-transition: all 0 ease;
	-o-transition: all 0 ease;
	transition: all 0 ease;
	filter: alpha(opacity=100);
	-moz-opacity:1;
	opacity:1;	
	}

.tab span {
	position: relative;
	display: inline-block;
	/display: inline;
	/zoom: 1;
	vertical-align: middle;
	}
.tab img {
	display: block;
	}

.tab span.wrap {
	background-color: black;
	}
.tab span.title {
	padding-left: 8px;
	}

.tab em {
	display: block;
	position: absolute;
	width: 45px;
	height: 11px;
	left: 0px;
	bottom: -1px;
	}	
.tab em img {
	display: block;
	position: absolute;
	top:0;
	right:-14px;
	}

/* ============================================================
	section jump tab NEW
   ============================================================ */

.snSection1 .tabLink1,
.snSection2 .tabLink2,
.snSection3 .tabLink3,
.snSection4 .tabLink4,
.snSection5 .tabLink5,
.snSection6 .tabLink6,
.snSection7 .tabLink7,
.snSection8 .tabLink8,
.snSection9 .tabLink9 {
	background: #f4f4f4;
	}

.snSection1 .tabLink1 a:hover,
.snSection2 .tabLink2 a:hover,
.snSection3 .tabLink3 a:hover,
.snSection4 .tabLink4 a:hover,
.snSection5 .tabLink5 a:hover,
.snSection6 .tabLink6 a:hover,
.snSection7 .tabLink7 a:hover,
.snSection8 .tabLink8 a:hover,
.snSection9 .tabLink9 a:hover {
	color: #333; 
	}

.snSection1 .tabLink1 a, .snSection1 .tabLink1 a > *,
.snSection2 .tabLink2 a, .snSection2 .tabLink2 a > *,
.snSection3 .tabLink3 a, .snSection3 .tabLink3 a > *,
.snSection4 .tabLink4 a, .snSection4 .tabLink4 a > *,
.snSection5 .tabLink5 a, .snSection5 .tabLink5 a > *,
.snSection6 .tabLink6 a, .snSection6 .tabLink6 a > *,
.snSection7 .tabLink7 a, .snSection7 .tabLink7 a > *,
.snSection8 .tabLink8 a, .snSection8 .tabLink8 a > *,
.snSection9 .tabLink9 a, .snSection9 .tabLink9 a > * {
	cursor: default;
	opacity: 0.5;
	}

.snSection1 .tabLink1 a > span,
.snSection2 .tabLink2 a > span,
.snSection3 .tabLink3 a > span,
.snSection4 .tabLink4 a > span,
.snSection5 .tabLink5 a > span,
.snSection6 .tabLink6 a > span,
.snSection7 .tabLink7 a > span,
.snSection8 .tabLink8 a > span,
.snSection9 .tabLink9 a > span {
	/*opacity: 0.25;*/
	}

.snSection1 .tabLink1 a img,
.snSection2 .tabLink2 a img,
.snSection3 .tabLink3 a img,
.snSection4 .tabLink4 a img,
.snSection5 .tabLink5 a img,
.snSection6 .tabLink6 a img,
.snSection7 .tabLink7 a img,
.snSection8 .tabLink8 a img,
.snSection9 .tabLink9 a img {
	opacity: 1;
	}

/* ============================================================
	section
   ============================================================ */

.uppersection {
	position: relative;
	margin-top: 40px;
	margin-buttom: 20px;
	padding-top: 8px;
	}

/*#b7,#b22,#b37,#b57 {display: none;}*/

.section {
	position: relative;
	margin-bottom: 16px;
	}

header.wimg { position: relative; }
header.wimg h2 { position: absolute; top:1em; left:0; z-index:10; }

.section + h3 {
	padding-top: 20px;
	border-top: 1px solid #ccc;
	}

.ward {
	margin-top: 8px;
	margin-bottom: 16px;
	letter-spacing:-.40em;
	}
.sub-ward {
	letter-spacing:-.40em;
	}	
.ward > *,
.sub-ward > * {
	position: relative;
	display: inline-block;
	/display: inline;
	/zoom: 1;
	vertical-align: top;
	letter-spacing: normal;
	}
.ward p { text-align: left; }

.ward.multi, .sub-ward.multi { margin-bottom: -12px; } /* 8-20 */
.ward.multi > *, .sub-ward.multi > * { margin-bottom: 20px; }

.section .ward .free { width:auto; }
.section .ward .full { width:100%; }

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

.offset				{ margin-left:-16px; margin-right:-16px; }
.offset > *			{ margin-left: 16px; margin-right: 16px; }
.offset .tight		{ width: 312px; }
.offset .wide		{ width: 536px; }
.offset .wide .split2		{ margin-left:-12px; margin-right:-12px; }
.offset .wide .split2 > *	{ margin-left: 12px; margin-right: 12px; width:256px; }
.offset .wide .split3		{ margin-left:-11px; margin-right:-11px; }
.offset .wide .split3 > *	{ margin-left: 11px; margin-right: 11px; width:164px; }

.split2				{ margin-left:-20px; margin-right:-20px; }
.split2 > *			{ margin-left: 20px; margin-right: 20px; width: 418px; }
.split2 .full { width: 100%; }
.split2	.split2		{ margin-left:-10px; margin-right:-10px; }
.split2	.split2 > *	{ margin-left: 10px; margin-right: 10px; width: 200px; }
.split2	.split3		{ margin-left: -6px; margin-right: -6px; }
.split2	.split3 > *	{ margin-left:  6px; margin-right:  6px; width: 132px; }
.split2	.split4		{ margin-left: -6px; margin-right: -6px; }
.split2	.split4 > *	{ margin-left:  5px; margin-right:  5px; width: 96px; }

.split3				{ margin-left:-13px; margin-right:-13px; }
.split3 > *			{ margin-left: 13px; margin-right: 13px; width: 276px; }
.split3 .single		{ width: 276px; }
.split3 .double		{ width: 578px; }

.split4				{ margin-left:-12px; margin-right:-12px; }
.split4 > *			{ margin-left: 12px; margin-right: 12px; width: 202px; }
.split4 .double		{ width: 428px; }
.split4 .split2		{ margin-left:-12px; margin-right:-12px; }
.split4	.split2 > *	{ margin-left: 12px; margin-right: 12px; width: 200px; }

.split5				{ margin-left:-10px; margin-right:-10px; }
.split5 > *			{ margin-left: 10px; margin-right: 10px; width: 160px; }


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

.covering .wide		{ width: 460px; }
.covering .tight	{ width: 420px; }

.covering .tight > * {
	width:183px;
	margin-left: 23px;
	margin-bottom: 9px;
	}

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

.oak			{ margin-left:-17px; margin-right:-17px; margin-top: 24px; margin-bottom: 16px; }
.oak > *		{ margin-left: 17px; margin-right: 17px; }
.oak .wide		{ width: 562px; }
.oak .tight		{ width: 284px; }

/* ============================================================
	shop item
   ============================================================ */

.shopitem {
	position: relative;
	display: inline-block;
	/display: inline;
	/zoom: 1;
	}

.shopitem span {
	display: block;
	margin-top: 6px;
	text-align: center;
	vertical-align: baseline;
	}
.shopitem[href] span {
	text-decoration: underline;
	}
.shopitem ins,
.shopitem span.ins {
	display: block;
	position: relative;
	margin-top: 0.2em;
	/margin-top: 0.1em;
	margin-bottom: -1.2em;
	line-height: 100%;
	font-size: smaller;
	font-style: normal;
	text-align: center;
	text-decoration: none;
	}
/*
.shopitem ins var {
	display: block;
	padding: 0 4px;
	font-style: normal;
	text-decoration: none;
	white-space: nowrap;]
	margin: -1px 0;
	background-color: white;
	}
*/
a.shopitem.yet:hover {
	color: #333;
	}

a.shopitem + p {
	margin-top: 8px;
	}
span.lineSpace + p {
	margin-top: 8px;
	}

/* ============================================================
	shop category link
   ============================================================ */

.shoplinkbox {
	position: relative;
	text-align: right;
	margin-top: 16px;
	margin-bottom: 16px;
	/zoom:1;
	}
.shoplinkbox:after {
	content: " ";
	display: block;
	visibility: hidden;
	clear: both;
	height: 0.1px;
	font-size: 0.1em;
	line-height: 0;
	}
.shoplinkbox a {
	display: block;
	position: relative;
	float: right;
	margin-left: 12px;
	}

.shoplinkbox .yet a { display: none !important; }
.shoplinkbox .yet ins {
	text-decoration: none;
	font-style: normal;
	}

.shoplink {
	padding: 7px 14px 7px 28px;
	font-weight: bold;
	text-decoration: none;
	line-height: 100%;
	border: 1px solid #CCC;
	background: url("/img/common/arrow_right.png") no-repeat scroll 14px 50% transparent;
	}
.shoplink:link,
.shoplink:visited,
.shoplink:active { color: #333; }
.shoplink:hover { border: 1px solid #7F0019; color: #7F0019; }

/* ===========================================================
	cart
   ============================================================ */

.cart {
	position:relative;
	margin: 0 0 0 564px;
	padding: 1em 0 1em 0;
	width: 316px;
	right:0;
	bottom: 0;
	clear: both;
	z-index: 100;
	}
.cart div {
	position: relative;
	float: right;
	/*height: 47px;*/
	padding: 6px 8px;
	margin-bottom: 6px;
	_padding-bottom: 0;
	background-color: #f3f3f3;
	}
.cart div img {
	margin-bottom: 9px;
	}
.cart div p {
	position: relative;
	float: left;
	width: 170px;
	height: 21px;
	margin: 0 8px 0 0;
	padding: 2px 4px 0 4px;
	text-align: right;
	background-color: white;
	border: 1px solid #cccccc;
	}
.cart div p span {
	float: left;
	padding-top: 1px;
	color: #444444;
	}

.cart .cartin {
	display: block;
	position: relative;
	float: left;
	width: 95px;
	height: 23px;
	margin: 0;
	padding: 0;
	
	cursor: default;
	
	font-size: 12px;
	font-weight: bold;
	text-align: center;
	line-height: 24px;
	
	color: white;
	border: 0px solid black;
	border-radius: 2px;
	background-color: #ccc;
	}
.cart a.active {
	cursor: pointer;
	background-color: #333;
	}
.cart a.active:hover {
	background-color: #79001f;
	}

.cart p.cap {
	clear: both;
	text-align: left;
	background-color: white;
	text-indent: -1.3em;
	margin-left: 1.8em;
	margin-top: 0;
	letter-spacing: 0\9;
	margin-top: 2px\9;
	}
.cart strong,
.cart em {
	padding-left: 0.2em;
	padding-right: 0.1em;
	font-size: 16px;
	font-weight: bold;
	font-style: normal;
	}

/* ===========================================================
	combination cart
   ============================================================ */

.cmbcart {
	position: relative;
	width: 800px;
	margin: 0 40px;
	}
.cmbcart h3 {
	padding: 8px 0 8px 34px;
	font-size:14px;
	border-top: none;
	background: #f0ede4 url(/img/store/homewares/scene/uni/i_cart.png) no-repeat 8px center;
	}
.cmbcart h4 { margin: 0; }

div.sample {
	position: relative;
	float: right;
	width: 450px;
	margin-top:20px;
	}
div.sample h4.lb {
	position: absolute;
	top: -20px;
	left: 0;
	}
div.sample table {
	margin-top: 10px;
	}
div.sample th,
div.sample td {
	padding: 3px 4px;
	font-size:12px;
	line-height:150%;
	vertical-align: top;
	}
div.sample th {
	white-space: nowrap;
	text-align: right;
	}
.stackimg {
	position: absolute;
	top:0;
	left:0;
	margin:5px;
	}

div.control {
	float: left;
	position: relative;
	width: 330px;
	margin: 0 -10px 0 0;
	}
div.control ul {
	margin-bottom: 10px;
	}
div.control li {
	position: relative;
	display: inline-block;
	/display: inline;			/* ie */
	/zoom: 1;
	margin: 0 0 10px 0;
	vertical-align: top;
	}

div.control a {
	display: block;
	position: relative;
	height: 60px;
	margin: 0 5px 0 5px;
	overflow: hidden;
	background-repeat: no-repeat;
	background-position: 0 0;
	outline: 0px none black;
	}
div.control a:hover {
	background-position: 0 -60px;
	}
div.control a.checked,
div.control a.checked:hover {
	cursor: default;
	background-position: 0 -120px;
	}
div.control a img {
	display: none;
	position: absolute;
	clip: rect(auto auto 120px auto);
	border: 0;
	}

/* ============================================================
	pop frame
   ============================================================ */

#popwraper {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	filter: alpha(opacity=0);
	-webkit-transition: opacity .3s ease;
	-moz-transition: opacity .3s ease;
	-o-transition: opacity .3s ease;
	transition: opacity .3s ease;
	opacity: 0;
	background-color: black;
	z-index: 9997;
	position: expression('absolute');
	top: expression('0px');
	top: expression( (documentElement.scrollTop || document.body.scrollTop)+'px' );
	}
#popwraper.ready {
	filter: alpha(opacity=15);
	opacity: 0.15;
	}
#popframe {
	position: fixed;
	top: 50%;
	left: 50%;
	padding:20px;
	overflow: hidden;
	-webkit-transition: opacity .3s ease;
	-moz-transition: opacity .3s ease;
	-o-transition: opacity .3s ease;
	transition: opacity .3s ease;
	opacity: 0;
	background-color: white;
	border: 1px solid #aaa;
	border-radius: 7px;
	box-shadow: 0 0 20px rgba(0,0,0,.3);
	z-index: 9998;
	}
#popframe.ready {
	opacity: 1;
	}
#popframe .popcloser {
	position: absolute;
	top: 6px;
	right: 6px;
	width: 22px;
	height: 22px;
	cursor: pointer;
	border: none;
	outline: none;
	background: transparent url(/img/store/homewares/scene/uni/btn-closer.png) no-repeat 0 0;
	}
#popframe .popcloser:hover { background-position: 0 -22px; }


/* ===========================================================
	adjust space
   ============================================================ */

span.lineSpace { display: block; margin: 0; padding: 0; }

.top8 { margin-top: 8px; }
.top16 { margin-top: 16px; }

.btm8 { margin-bottom: 8px; }
.btm16 { margin-bottom: 16px; }
.btm24 { margin-bottom: 24px; }
.btm32 { margin-bottom: 32px; }

.align-btm,
.ward .align-btm  > *,
.ward.align-btm > *  { vertical-align: bottom; }
.align-cnt, .ward.align-cnt { text-align: center; }

.align-mid,
.align-mid > * { vertical-align: middle; }

.absbr {
	position: absolute;
	left:auto;
	top:auto;
	right:0;
	bottom:0;
	}