@charset "shift_jis";


/*
===== CONTENTS ===========================================

	1: reset 
	2: body and base setting
	3: link setting
	4: color setting
	5: layout

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


/*
===== 1: reset =================================
*/

h1,h2,h3,h4,h5,h6,p,ol,ul,li,dl,dt,dd,form{
	margin:0px;
	padding:0px;
}

/*
===== 2: body and base setting ===========================
*/


body {
	text-align:center;/* box centering */
	font-family:"Lucida Grande", "Hiragino Kaku Gothic Pro", "osaka", "verdana", "arial", "helvetica", "sans-serif";
	margin: 0px auto;
	padding: 0px;	
	color:#000;
	font-size:12px;
	background:#fff;
	width:850px;	
	
}

* html body{
	font-size: 75%;
}

*+html body{
	font-size: 75%;	
}

h1, h2, h3, h4, h5, h6,
div, p, pre, ul, ol, dl, dt, dd,
address, form, blockquote{
	line-height: 1.5em;/* base line height */
	text-align: left;
	display: block;
}

h1 {
	font-style:normal;
	color:#999;
	margin: 0;
	padding:1em 0;
	font-size:10px;
	font-weight: normal;
	text-align:right;
	width:850px;
}



h1, h2, h3, h4, h5, h6{
	font-size: 100%;
}

table {
	margin : 0px;
	padding: 0px;
	empty-cells: show;
	font-size: 12px;
}

table th{
	text-align: left;
}

img{
	border:none;
	vertical-align:top;
}

ul,ol{
	list-style:none;
}

input,textarea,select{
	font-size:12px;
	color:#444;
	font-family:sans-serif;
}



/*
===== 3: link setting ===========================
*/
a:link,
a:visited{
	color: #555555;
}

a:hover,
a:active{
	color: #c1c1c1;
}


/* 重要なお知らせ */
div.newsBox dl dd ul li.important a:link,
div.newsBox dl dd ul li.important a:visited{
	color: #e10303;
}

div.newsBox dl dd ul li.important a:hover,
div.newsBox dl dd ul li.important a:active{
	color: #ea8080;
}


div.category a:link,
div.category a:visited,
div.search a:link,
div.search a:visited,
div.company a:link,
div.company a:visited{
	color: #555555;
}

div.category a:hover,
div.category a:active,
div.search a:hover,
div.search a:active,
div.company a:hover,
div.company a:active{
	color: #c1c1c1;
}


/*
===== 4: color setting ===========================
*/

/* 商品名 */
p.name{
	margin: 0px 0px 5px 0px;
	font-weight: normal;
	text-align: center;
	line-height:1.2;
}


p.detail{
	text-align: center;
	line-height:1.2;
}
/* ポイント */
p.detail span{
	display: block;
}

p.detail span.point{
	color: #ff9601;
	text-align: center;
	font-weight: bold;
}

/* 価格 */
p.detail span.price{
	color: #cc0202;
	font-weight: bold;
	text-align: center;
}

p.item{
	margin: 0px 0px 5px 0px;
	text-align: center;
}

p.item img{
	padding: 1px;
	border: solid 1px #cccccc;
}


div#footer{
	border-top: solid 1px #cccccc;
}


div.gnavi ul li a:link,
div.gnavi ul li a:visited{
	color: #ffffff;
	text-decoration: none;
}

div.gnavi ul li a:hover,
div.gnavi ul li a:active{
	color: #ffffff;
	text-decoration: none;
}

/*
===== 5: layout ==========================================
*/

div#container{
	width: 100%;
	text-align: center;
	background:#fff ;
}






/* wrapper */

div#wrapper{
	margin: 0px auto 20px;
	width: 850px;
}

div#mainContents{
	width: 850px;	
}

body.top div#mainContents{
	width: 705px;
	float: left;
}

body.top div#contents{
	width: 490px;
	float: right;
}

body.column02 div#contents{
	width: 685px;
	float: right;
}

div#side01{
	width: 200px;
	float: left;
}

div#side02{
	width: 180px;
	float: right;
}


/* side01 */

div.category{
	margin: 0px 0px 10px 0px;
	padding: 0px 0px 1px 0px;
	background: url(../img/side_btm.gif) no-repeat left bottom;
}

div.category dl{
	width: 200px;	
}

div.category dl dd{
	padding: 5px 0px 0px 0px;
	width: 200px;
	background: url(../img/side_bg.gif) repeat-y left top;
}

div.category ul{
	margin: 0px 0px 0px 6px;
	width: 188px;
}

div.category ul li{
	margin: 0px 0px 5px 0px;
	padding: 0px 0px 0px 0px;
	width: 186px;
	background:#e7e7e7 url(../img/category01_bg.gif) no-repeat left top;
	font-size: 1.10em;
	font-weight: bold;
	line-height: 1.8em;
	border:solid 1px #cccccc;
}

* html div.category ul li{
	width: 188px;
}



div.category ul li a{
	padding: 0px 0px 0px 22px;
	background: url(../img/category01.gif) no-repeat 8px center;
	display: block;
}

div.category ul li ul{
	margin: 0px;
	width: 186px;
}

div.category ul li ul li{
	margin: 0px;
	padding: 0px 0px 0px 0px;
	background:#f2f2f2 url(../img/side_contents_bg.gif) no-repeat left top;
	font-size: 0.78em;
	font-weight: normal;
	line-height: 2.2em;
	border-top:solid 1px #cccccc;
	border-left: none;
	border-right: none;
	border-bottom: none;
	width: 186px;
}

div.category ul li ul li a{
	padding: 0px 0px 0px 25px;
	background: url(../img/category02.gif) no-repeat 12px center;	
}

div.category ul li ul li ul{
	width: 186px;
}

div.category ul li ul li ul li{
	margin: 0px;
	padding: 0px 0px 0px 0px;
	font-size: 1.0em;
	font-weight: normal;
	border-top: solid 1px #cccccc;
	border-left: none;
	border-right: none;
	border-bottom: none;
	width: 186px;
}

div.category ul li ul li ul li a{
	padding: 0px 0px 0px 48px;
	background: url(../img/category03.gif) no-repeat 35px center;
}


/* search */

div.search{
	margin: 0px 0px 10px 0px;
	width:200px;
	border:1px solid #CCCCCC;
}

div.search p{
	text-aline:left;
	font-size:82%;
	margin:0 0 10px 10px;
}

input.searchBox{
	width:80px;
	margin:15px 0 0 10px;

}

div.search p.detailsearch{
	padding: 0px 0px 0px 10px;
	background: url(../img/arrow_detail.gif) no-repeat 0px 3px;
}

/* background: url(../img/side_btm.gif) no-repeat left bottom; */

/* company */

div.company{
	margin: 0px 0px 20px 0px;
}

div.company dl{
	width: 200px;
}

div.company ul{
	border-bottom: solid 1px #cccccc;	
}

div.company ul li{
	padding: 5px 0px 5px 0px;
	background:#f2f2f2 url(../img/side_contents_bg.gif) repeat-x left top;
	border-top: solid 1px #cccccc;
	border-left: solid 1px #cccccc;
	border-right: solid 1px #cccccc;
}

div.company ul li a{
	padding: 5px 0px 5px 37px;
}

div.company ul li.overview a{
	background: url(../img/arrow_company_overview.gif) no-repeat 12px 2px;
}

div.company ul li.act a{
	background: url(../img/arrow_company_act.gif) no-repeat 12px 2px;
}

div.company ul li.faq a{
	background: url(../img/arrow_company_faq.gif) no-repeat 12px 2px;
}

div.company ul li.guide a{
	background: url(../img/arrow_company_guide.gif) no-repeat 12px 2px;
}

div.company ul li.pay a{
	background: url(../img/arrow_company_pay.gif) no-repeat 12px 2px;
}

div.company ul li.shipping a{
	background: url(../img/arrow_company_shipping.gif) no-repeat 12px 2px;
}

div.company ul li.privacy a{
	background: url(../img/arrow_company_privacy.gif) no-repeat 12px 2px;
}

div.company ul li.contact a{
	background: url(../img/arrow_company_contact.gif) no-repeat 12px 2px;
}

/* manager */

div.manager{
	margin: 0px 0px 15px 0px;
	width: 200px;
}


div.manager dl{
	padding: 0px 0px 2px 0px;
	width: 200px;
	background: url(../img/side_btm.gif) no-repeat left bottom;
}

div.manager dl dd{
	padding: 10px 0px 10px 0px;
	text-align: center;
	background: url(../img/side_bg.gif) repeat-y left bottom;
	border-top: solid 1px #cccccc;
}

div.manager dl dd p.pic{
	text-align: center;
}

div.manager dl dd p.pic img{
	padding: 1px;
	border: solid 1px #dddddd;
}

div.manager dl dd dl{
	margin: 0px 0px 0px 15px;
	padding: 10px 0px 0px 0px;
	width: 170px;
	background: none;
}

div.manager dl dd dl dt{
	margin: 0px 0px 0px 0px;
	padding: 0px;
	background: none;
	text-align: center;
	font-weight: bold;
	font-size: 1.1666em;
}

div.manager dl dd dl dd{
	margin: 0px 0px 10px 0px;
	padding: 0px;
	background: none;
	text-align: left;
	border: none;
}

div.manager dl dd dl dd.second{
	text-align: center;
}


/* mobile */

div.mobile{
	margin: 0px 0px 15px 0px;
	width: 200px;
}


div.mobile dl{
	padding: 0px 0px 2px 0px;
	width: 200px;
	background: url(../img/side_btm.gif) no-repeat left bottom;
}

div.mobile dl dd{
	padding: 10px 0px 10px 0px;
	text-align: center;
	background: url(../img/side_bg.gif) repeat-y left bottom;
	border-top: solid 1px #cccccc;
}

div.mobile dl dd p{
	text-align: center;
}



/* contents */



p#key{
	margin: 0px 0px 10px 0px;
}

div.bunnerBox{
	margin: 0px 0px 20px 0px;
	width: 490px;
}

div.bunnerBox p.boxL{
	width: 240px;
}

div.bunnerBox p.boxR{
	width: 240px;
}


/* news */

div.newsBox{
	margin: 0px 0px 20px 0px;
	padding: 0px 0px 6px 0px;
	width: 490px;	
	background: url(../img/news_btm.gif) no-repeat left bottom;
}

div.newsBox dl dd{
	padding: 9px 0px 0px 0px;
	width: 490px;
	background: url(../img/news_bg.gif) repeat-y left top;
}

div.newsBox dl dd ul{
	margin: 0px 0px 0px 17px;
	width: 450px;
}

div.newsBox dl dd ul li{
	margin: 0px 0px 4px 0px;
	padding: 3px 0px 3px 0px;
	background: url(../img/dot.gif) repeat-x left bottom;
}

div.newsBox dl dd ul li span{
	margin: 0px 10px 0px 0px;
	padding: 0px 0px 0px 16px;
	background: url(../img/arrow_news.gif) no-repeat 5px 0px;
}

div.newsBox dl dd ul li.important a{
	padding: 0px 0px 0px 18px;
	background: url(../img/arrow_news.gif) no-repeat 5px 0px;	
}


div.newStockBox{
	margin: 0px 0px 0px 0px;
	width: 490px;
}

div.newStockBox dl{
	width: 490px;
}

div.newStockBox dl dd{
	padding: 10px 0px 0px 0px;
	width: 490px;
}




div.recommendedBox{
	margin: 0px 0px 0px 0px;
	width: 490px;
}

div.recommendedBox dl{
	width: 490px;
}

div.recommendedBox dl dd{
	padding: 10px 0px 0px 0px;
	width: 490px;
}


ul.itemBox{
	margin: 0px 0px 20px 0px;
	width: 490px;	
}

ul.itemBox li{
	margin: 0px 2px 0px 2px;
	width: 118px;
	float: left;
	display: inline;
}



/* side02 */

div.recommendedRightBox{
	margin: 0px 0px 20px 0px;
	width: 180px;
	padding: 0px 0px 6px 0px;
	background: url(../img/side_left_btm.gif) no-repeat left bottom;	
}

div.recommendedRightBox dl dd{
	padding: 10px 10px 0px 10px;
	background: url(../img/side_left_bg.gif) repeat-y left bottom;
}



div#side02 p.name{
	font-weight: bold;
	text-align: center;
	height:auto;
	line-height:1.2;
	overflow:hidden;
}





/* about */


div#about{
	padding: 20px 0px 0px 0px;
	width: 100%;
	text-align: center;
}

div.aboutBox{
	margin: 0px auto 20px;
	
	width: 850px;
	background: url(../img/about_btm.gif) no-repeat left bottom;
}

div.aboutBox div.boxL{
	width: 425px;
}

div.aboutBox div.boxR{
	width: 425px;	
}

div.aboutBox dl{
	padding: 0px 0px 5px 0px;

}

div.aboutBox dl dd{
	padding: 15px 0px 0px 20px;
}

div.aboutBox dl dd p{
	margin: 0px 20px 10px 0px;
	line-height: 1.3em;
}

div.aboutBox dl dd dl{
	margin: 0px 0px 10px 0px;
	padding: 0px;
	width: 400px;
	background: none;
	border-bottom: solid 1px #cccccc;
}

div.aboutBox dl dd dl dt{
	margin: 0px 0px 0px 0px;
}

div.aboutBox dl dd dl dd{
	margin: 0px 0px 10px 0px;
	padding: 0px;
	background: none;
	line-height: 1.3em;
}

div.aboutBox dl dd dl dd span{
	font-size: 0.8333em;
}

div.aboutBox dl dd dl dd.credit img{
	margin-right: 8px;
}

div.aboutBox dl dd dl dd.convenience img{
	margin-right: 5px;
}

div.aboutBox dl dd dl dd.shipping{
	color: #cb1110;
}

div.aboutBox dl dd dl dd.shipping span{
	font-size: 1.0em;
	font-weight: bold;
}

div.aboutBox dd.exchange{
	background: url(../img/exchange_img.gif) no-repeat 240px 6px;
}


/* iframe */

iframe#head{
	width: 850px;
	border: none;
	height: 165px;
}

iframe#sidenavi1{
	width: 200px;
	border: none;
	height: 1600px;
}

iframe#sidenavi2{
	width: 180px;
	border: none;
	height: 1600px;
}

iframe#foot{
	width: 100%;
	border: none;
	height: 470px;
}



/* section */


div.section{
	
}

.boxL{
	float: left;
	display: inline;
}

.boxR{
	float: right;
	display: inline;
}

.imgL{
	margin-right: 10px;
	float: left;
}

.imgR{
	margin-left: 10px;
	float: right;
}


/*
===== 00: CLEARFIX ==========================================
*/
div.section:after,
div#wrapper:after,
div.gnavi ul:after,
div#mainContents:after,
div.newStockBox dl dd ul:after,
ul.itemBox:after,
div.rankingBox dl dd dl.moduleB dd:after
{ content: url(../img/pixel.gif); display: block; clear: both; height: 0; }

div.section,
div#wrapper,
div.gnavi ul,
div#mainContents,
div.newStockBox dl dd ul,
ul.itemBox,
div.rankingBox dl dd dl.moduleB dd
{ display: inline-block; }

div.section,
div#wrapper,
div.gnavi ul,
div#mainContents,
div.newStockBox dl dd ul,
ul.itemBox,
div.rankingBox dl dd dl.moduleB dd
{ display: block; }

/* MacIE \*//*/
div.section,
div#wrapper,
div.gnavi ul,
div#mainContents,
div.newStockBox dl dd ul,
ul.itemBox,
div.rankingBox dl dd dl.moduleB dd
{ overflow: hidden; }
/* */



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

	header
	
=======================================*/

.menu{margin:0;padding:0;width:850px;list-style:none;}
.menu img{margin:0px 1px;padding:0;}
.menu a:hover img{-moz-opacity:0.5;opacity:0.5;filter: alpha(opacity=90);
overflow:hidden;} 	 
.menu .logo{float:left;margin:0;}
.menu li{position:relative;margin:0;padding:0;float:right;list-style: none;display:block;}
.hellow{width:100%; margin:0 0 5px 0;clear:both;text-align:right;font-size:11px;color:#333;}
.hellow .point{font-weight:bold; color:#FF00CC;}
.mnavi{width:100%;}
.mnavi ul{margin:0;padding:0;clear:both;}
.mnavi li{margin:0;padding:0;float:left;}
.tmenu{width:100%;margin:0;padding:0;}
.tmenu ul{margin: 0;padding: 0;clear:both;/* for MacIE5.x \*//*/ overflow: hidden;/* end */}
.tmenu li{margin:0;padding:0;float:left;width:170px;}
.tmenu img{margin:8px 0 0 0;padding:0;float:left;}
.gmenu{width:850px;margin:0 0 20px;padding:0;}
.gmenu ul{margin: 0;padding: 0;clear:both;/* for MacIE5.x \*//*/ overflow: hidden;/* end */}
.gmenu li{margin:0 15px 0 0;padding:0;float:left;font-size:10px;}
.gmenu img{margin:8px 0 0 0;padding:0;float:left;}
.gmenu .txt{margin:8px 0 0 0;padding:0;float:left;width:450px;text-align:right; color:#333;
font-size:11px;}



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

	footer
	
=======================================*/
#footer {width:850px;height:200px;	margin:20px 0px;padding:35px 20px;color:#fff;clear:both;background-color:#4c4c4c;}
#footer .calendar {margin:0 20px 0 0;padding:0;display:block;font-size:90%;text-align: center;float: left;}	
#footer a{color:#ccc;}	
.calendar img{margin:0;padding:0 5px;}
.calendar table{float:left;margin:0 10px 0 0;padding:0;}	
.calendar td{margin:5px;padding:5px; color:#fff; text-align:center;}
.calendar .day{font-weight: bold;color: #ccc;}
.calendar .sunday{font-weight: bold;color: red;}
.calendar .holiday{color: red;}

div#footer .info{border-left:solid 1px;width:310px;margin:0;padding:0 0 0 20px;float:right;}	
div#footer .info li{font-size:10px;	margin:px 0 0 0;padding:0;clear:both;}

.copyright {width:850px;	clear:both;padding:5px 0 20px 0;}
.copyright li{padding:0 8px;float:left;color:#4c4c4c;font-size:10px;border-right:dotted 1px;}
.copyright img{text-align:right;position:relative;	}	
.top{width:850px;	text-align:right;}
.top a img{text-decoration:none;} 		
.top a:hover img{-moz-opacity:0.5;opacity:0.5;filter: alpha(opacity=90);}




