@charset "UTF-8";

/* Clear CSS */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin:0;padding:0; }
table { border-collapse:collapse;border-spacing:0; }
fieldset,img { border:0; }
address,caption,cite,code,dfn,em,strong,th,var { font-style:normal;font-weight:normal; }
ol,ul { list-style:none; }
caption,th { text-align:left; }
h1,h2,h3,h4,h5,h6 { font-size:100%;font-weight:normal; }
q:before,q:after { content:''; }
abbr,acronym { border:0; }

/* float clear */
.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
.clearfix {display:inline-table;} /* Hides from IE-mac \*/
* html .clearfix{height:1%;}
.clearfix{display:block;} /* End hide from IE-mac */
.cb { clear:both; height:0; line-height:0; font-size:1%; }

/* default */
body {
	background:url(/matrix/img/topbar.gif) no-repeat 0 0 #ffffff;
	font-family:Arial, Helvetica, sans-serif;
	font-size:75%;
	line-height:1.5;
	color:#333333;
}
a:link, a:visited, a:active { color:#000000; text-decoration:underline; }
a:hover { text-decoration:none; }
a:hover img{ opacity:0.8; filter:alpha(opacity=80); }
img { vertical-align:top; }
strong { color:#F33 }
p, li, h3, dd { text-align:justify; }
.left { float:left; }
.right { float:right; }
.small { font-size:80%; }
.tal { text-align:left; }
.tac { text-align:center; }
.tar { text-align:right; }
.pagebute p {
	text-align:center;
	font-size:120%;
}
.pagebute p span a { text-decoration:none; }
.pagebute p span a:hover { text-decoration:underline; }

/* common */
h1 a, .toptitle ul li a, #entrylist li.link a, #contents .left .left ul.etc li a, 
#contents .left .left ul.banner li, #contents .right .hitocoto p a, #footer p.pagetop a, #footer div li a, 
.newitems p a {
	text-indent:-9999px;
	overflow:hidden;
	text-align:left;
}
#navigation, #contents .left .left ul.banner, #contents .left .left ul.etc, #contents .right .cart, 
#contents .right .welcome, #contents .right .hitocoto, #contents .right .banners {
	width:100%; margin-bottom:4em;
}
h2 { font-weight:bold; font-size:120%; color:#000000; line-height:1.3em; }
h2 a { display:block; margin-bottom:3px; }
h2 small { font-size:75%; font-weight:normal; color:#888; }
#navigation h2, #contents .right .cart h2, #contents .right .welcome h2, #contents .right .banners h2, 
#contents .right .hitocoto h2, #contents .right .newitems h2 { margin-bottom:1em; }

/* header */
h1 { width:100%; padding:30px 0 20px; }
h1 a {
	display:block;
	background:url(/matrix/img/logo.gif) no-repeat center center;
	width:170px; height:125px;
	margin:0 auto;
}

/* wire */
#contents { margin:0 auto; margin-bottom:4em; }
#contents .left, #contents .left .left { float:left; }
#contents .left .right, #contents .right { float:right; }

/* listpage */
.listpage #contents { width:900px; }
.listpage #contents .left { width:730px; }
.listpage #contents .left .right { width:540px; }
.listpage #contents .left .left { width:150px; }
.listpage #contents .right { width:150px; }
/* center */
#entrylist { width:100%; margin-bottom:3em; }
/* title */
.toptitle { width:520px; margin-bottom:3em; }
.detailpage .toptitle { width:auto; }
.toptitle div { float:left; }
.toptitle div p { font-size:10px; color:#666; }
.toptitle ul {
	float:right;
	width:94px;
	padding-top:6px;
}
.toptitle ul li { display:inline; float:left; }
.toptitle ul li a {
	display:block;
	width:47px; height:11px;
	background-image:url(/matrix/img/list-detail-icon.gif);
	background-repeat:no-repeat;
}
.toptitle ul li.vlist a { background-position:0 -11px; }
.toptitle ul li.vdetail a { background-position:-47px 0; }
.toptitle ul li.vlist a:hover, .toptitle ul li.vlist a.cc { background-position:0 0; }
.toptitle ul li.vdetail a:hover, .toptitle ul li.vdetail a.cc { background-position:-47px -11px; }
/* list */
#entrylist .list h3, #entrylist .list ul, #entrylist span.price { width:160px; }
#entrylist .list {
	float:left;
	width:180px;
	margin-bottom:4em;
}
#entrylist .list p { padding-bottom:1em; }
#entrylist .list img { border:1px solid #ddd;padding:9px; }
#entrylist .list h3 {
	font-weight:bold;
	line-height:1.4;
	margin-bottom:1em;
}
#entrylist .list h3 a {	
	text-decoration:none;
	display:block;
	padding:0 5px;
}
#entrylist .list h3 a:hover { text-decoration:underline; }
#entrylist .list li { width:100%; }
#entrylist .list li.price {
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
	font-size:10px;
	color:#595959;
	line-height:1.1;
	text-align:center;
	background:url(/matrix/img/list-text-price.gif) no-repeat 3px 3px #ededed;
	border-top:1px solid #000;
	margin-bottom:10px;
	padding:2px 0;
}
#entrylist .list li.text {
	width:auto;
	line-height:1.3;
	padding:0 5px 10px 5px;
}
#entrylist .list li.link {
	border-top:1px solid #ededed;
	border-bottom:1px solid #000000;
}
#entrylist .list li.link a {
	display:block;
	background:url(/matrix/img/list-text-detailpage.gif) no-repeat right 4px;
	width:100%; height:12px;
}

/* detailpage */
.detailpage #contents { width:760px; }
.detailpage #contents .left { width:550px; }
.detailpage #contents .left .right { width:342px; }
.detailpage #contents .left .left { width:150px; }
.detailpage #contents .right { width:150px; }

/* center : entries */
#entries .title {
	width:100%;
	margin-bottom:3em;
	border-bottom:1px solid #f0f0f0;
}
#entries .title h2 {
	background:#f0f0f0;
	text-align:center;
	line-height:1.2;
}
#entries .title p {
	font-size:90%;
	padding:2px 0;
	text-align:center;
	color:#646464;
}


/* left : navigation */
#navigation h2, #navigation ul li { text-align:right; }
#navigation ul { width:100%; margin-bottom:2em; }
#navigation li { margin-bottom:0.5em; line-height:1.2em; }
#navigation li a {
	display:block;
	width:100%;
	background:url(/matrix/img/arrow-bk-2x4.gif) no-repeat left center;
	text-decoration:none;
}
#navigation li a:hover { background:#000; color:#fff; }
#navigation li.cc a { font-weight:bold; }

/* left : banner */
#contents .left .left ul.banner li { margin-bottom:15px; }
#contents .left .left ul.banner li.b01 {
	background:url(/matrix/img/ban-soryo-300.gif) no-repeat right 0;
	height:80px;
}
#contents .left .left ul.banner li.b02 {
	background:url(/matrix/img/ban-oshiharai.gif) no-repeat right 0;
	height:150px;
}

/* left : etc */
#contents .left .left ul.etc li { height:20px; }
#contents .left .left ul.etc li a {
	display:block;
	width:100%;
	height:12px;
}
#contents .left .left ul.etc li.e01 { background:url(/matrix/img/ban-feed.gif) no-repeat right 0; }
#contents .left .left ul.etc li.e02 { background:url(/matrix/img/ban-contact.gif) no-repeat right 0; }

/* right: cart */
#contents .right .cart p a {
	display:block;
	text-indent:-9999px;
	overflow:hidden;
	width:150px;
	height:30px;
	background:url(/matrix/img/cart-look.gif) no-repeat 0 0;
}
#contents .right .cart li {
	font-size:90%;
}

/* right: welcome */

/* right: hitocoto */
#contents .right .hitocoto li {
	width:100%;
	margin-bottom:1em
}
#contents .right .hitocoto li a { text-decoration:none; }
#contents .right .hitocoto li a:hover { text-decoration:underline; }
#contents .right .hitocoto li span {
	color:#b3b3b3;
	display:block;
	font-size:90%;
	font-weight:bold;
}

/* more button */
#contents .right .hitocoto p a, .newitems p a {
	display:block;
	background:url(/matrix/img/btn-more.gif) no-repeat right 1px;
	width:100%; height:11px;
}

/* right : newitems */
.newitems dt {
	background:#f0f0f0;
	text-align:center;
	padding:3px 0;
	width:100%;
	margin-bottom:0.8em;
}
.newitems dt img { border:1px solid #000000; }
.newitems dd {
	width:100%;
	margin-bottom:0.8em;
	padding-bottom:0.8em;
	border-bottom:1px solid #ededed;
}
.newitems dd a {
	display:block;
	background:url(/matrix/img/arrow-bk-2x4.gif) no-repeat 0 0.5em;
	padding-left:10px;
	text-decoration:none;
}
.newitems dd a:hover { text-decoration:underline; }

/* footer */
#footer {
	width:760px;
	margin:0 auto 200px auto;
}
.listpage #footer {
	width:900px;
}
#footer p.pagetop {
	width:100%;
	border-bottom:1px solid #000000;
	padding:1px 0;
	margin-bottom:3em;
}
#footer p.pagetop a {
	display:block;
	background:url(/matrix/img/btn-pagetotop-l.gif) no-repeat center 1px;
	width:100%; height:9px;
}
#footer div p {
	float:left;
	width:650px;
	font-size:10px;
	color:#666;
}
#footer p a { text-decoration:none; color:#666; }
#footer div ul { float:right; width:32px; }
#footer div li { float:left; }
#footer div li.mail { width:20px; }
#footer div li.feed { width:12px; }
#footer div li a {
	display:block;
	width:12px;
	height:12px;
}
#footer div li.mail a { background:url(/matrix/img/ban-contact.gif) no-repeat -78px 0; }
#footer div li.feed a { background:url(/matrix/img/ban-feed.gif) no-repeat -78px 0; }


/* center : entry */
.entry {
	width:100%;
	margin-bottom:3em;
}
.entry h2 {
	width:100%;
	text-align:justify;
	margin-bottom:0.8em;
}
.entry p.category {
	margin-bottom:2.8em;
	font-size:90%;
	color:#666666;
}
.entry img {
	border:1px solid #888;
	margin-bottom:0.5em;
}
.entry .entryBody, .entry .entryMore {
	width:100%; margin-bottom:4em;
	line-height:1.8;
}
.entry p.more { margin-bottom:3em; }
.entry p.more a {
	display:block;
	width:75px; height:17px;
	text-indent:-9999px; overflow:hidden;
	background:url(/matrix/img/more.gif) no-repeat 0 0;
}
.entry p.pagetop {
	border-top:1px dotted #000;
	padding-top:5px;
}
.entry p.pagetop a {
	display:block;
	width:100%; height:15px;
	text-indent:-9999px; overflow:hidden;
	background:url(/matrix/img/btn-pagetotop-s.gif) no-repeat right 0;
}
/* center : entry in cart */
a.inCart {
	display:block;
	text-indent:-9999px;
	overflow:hidden;
	width:120px;
	height:40px;
	background:url(/matrix/img/cart-in.gif) no-repeat 0 center;
}
/* entry detail use */
.entry .spec {
	width:auto;
	padding:20px;
	border:1px solid #000;
	margin-bottom:4em;
}
.entry .spec dl {
	line-heigh:1.5;
	width:100%;
}
.entry .spec dd {
	margin:-1.5em 0 1em 50px;
}

/* relate and new entries list */
.relateNew {
	width:100%;
	margin-bottom:4em;
}
.relateNew h3 {
	font-weight:bold;
	line-height:1.2;
	font-size:115%;
}
.relateNew p {
	font-size:90%;
	color:#666666;
	line-height:1.2;
	margin-bottom:2em;
}
.relateNew li {
	background:url(/matrix/img/arrow-bk-2x4.gif) no-repeat 0 0.5em;
	padding:0 0 1em 10px;
	
}

/* back */
.backNavi {
	line-height:1.2;
}
.backNavi li {
	background:url(/matrix/img/arrow-wh-2x4.gif) no-repeat 5px 0.5em #000000;
	width:200px;
	margin-bottom:1em;
}
.backNavi li a {
	display:block;
	width:100%;
	padding:1px 0;
	text-decoration:none;
	font-size:90%;
	text-align:center;
}
.backNavi li a, .backNavi li a strong {
	color:#fff;
}
.backNavi li a strong { font-size:110%; }


/* web page */
#webpage {
	line-height:1.6;
}
#webpage p, #sg01, #sg02, #sg03, #sg04 {
	margin-bottom:3.5em;
}
#webpage h2 { margin-bottom:2em; }
#webpage h3 { margin-bottom:1.5em; }
#webpage h2 {
	font-size:18px;
	line-height:1.1;
}
#webpage h2 span {
	display:block;
	font-size:12px;
	color:#666;
	font-weight:normal;
	padding-top:5px;
}
#webpage h3 {
	font-weight:bold;
	padding-left:18px;
	background:url(/matrix/img/list-mark.gif) no-repeat 0 0.25em;
}
#webpage .section {
	width:100%; margin-bottom:3.5em;
}
#webpage .section p, #webpage .section ul {
	margin-bottom:1.5em;
}
#webpage .section li {
	background:url(/matrix/img/list-mark-s.gif) no-repeat 0 0.4em;
	padding:0 0 0.5em 1em; line-height:1.3;
}

/* shopping guide */
#sg01 dt { text-indent:-9999px; overflow:hidden; height:34px; }
#sg01 dt#sg0101 {
	background:url(/matrix/img/sg01-01.gif) no-repeat 0 0;
}
#sg01 dt#sg0102 {
	background:url(/matrix/img/sg01-02.gif) no-repeat 0 0;
}
#sg01 dd { margin:-36px 0 2em 50px; }
#sg02 {
	background:url(/matrix/img/sg02-01.gif) no-repeat right 5px;
}
#sg03 {
	background:url(/matrix/img/sg03-01.gif) no-repeat right 5px;
}
#sg02 p, #sg03 p {
	padding-right:155px;
}









