@charset "utf-8";

div.caution{
	padding: 0 20px 20px 20px;
}

/*
===========================================================================
| 			site common style
===========================================================================
*/
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;
}

address,caption,cite,code,dfn,em,strong,th,var {
	font-style: normal;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

caption,th {
	text-align: left;
}

q:before,q:after {
	content: '';
}

object,
embed {
	vertical-align: top;
}

hr,legend {
	display: none;
}

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

img,abbr,acronym,fieldset {
	border: 0;
}

li {
	list-style-type: none;
}

body {
	background: #ffffff;
	color: #222;
	font-size: 87%;
	font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif;
	line-height: 140%;
}
div#category{
	font-size: 90%;
}

/*----------------------------------------------------------------------
/			clearfix
/----------------------------------------------------------------------*/
.clearfix:after {
 	content:"."; 
 	display:block; 
 	height:0; 
 	clear:both; 
 	visibility:hidden;
}
.clearfix {
 	display:inline-block;
}

/* hide mac ie \*/
* html .clearfix {
	 height:1%;
}
.clearfix {
	 display: block;
}

/*----------------------------------------------------------------------
/			link 
/----------------------------------------------------------------------*/
a{
}

a:link{
	color: #069;
	text-decoration: underline;
}

a:visited{
	color: #004a6f;
	text-decoration: underline;
}

a:hover{
	color: #666;
	text-decoration: underline;
}

/*----------------------------------------------------------------------
/			image 
/----------------------------------------------------------------------*/
div.contents img.middle{
	vertical-align: middle;
}

div.contents img.top{
	vertical-align: top;
}

div.contents img.bototm{
	vertical-align: bottom;
}

/*----------------------------------------------------------------------
/			form 
/----------------------------------------------------------------------*/
input,select{
	vertical-align: middle;
	font-size: 1.2em;
	margin: 0 3px;
}
input.email{
	width: 25em;
}
input.full{
	width: 100%;
}
option{
	padding-right: 10px;
}
textarea{
	font-size: 1.2em;
}
/* cart */
#orderinfo table.line{
	width: 100%;
}
div.contents form p.attention {
	font-weight: bold;
	margin: 2px 0;
}
/*----------------------------------------------------------------------
/			paragraph 
/----------------------------------------------------------------------*/
h1{	
	/*color: #663300;*/
	font-size: 150%;
	line-height: 140%;
	font-weight: bold;
	margin: 10px 0 20px 0;
}

h2{
	font-size: 120%;
	font-weight:bold;
	background-color: #efefef;
	padding: 4px 10px 4px 8px;
	margin: 0 0 10px -8px;
	/*color: #663300;*/
}

h3{
	font-size: 100%;
	font-weight:bold;
	margin: 20px 0 10px;
	border-bottom: 1px solid #cccccc;
	/*color: #663300;*/
}

h4{
}

strong{
	color :#af1341;
	text-decoration: none;
	font-style: normal;
}

em{
	font-weight:bold;
	text-decoration: none;
	font-style: normal;
}

div.contents{
	margin: 0 15px;
	padding: 15px 15px 20px 0;
}

div.contents p{
	margin: 0 0 10px 0;
}

div.contents div.separator{
	margin-top: 10px;
	padding-top: 10px;
	border-top: solid 1px #999;
}

/*----------------------------------------------------------------------
/			table
/----------------------------------------------------------------------*/
div.contents table{
	line-height: 140%;
	font-size: 100%;
	margin: 0 0 10px;
}

div.contents caption{
	position: absolute;
	display: none;
}

table th,
table td{
	padding: 5px 8px;
}

table th{
	font-weight: normal;
	text-align: center;
}

div.contents table th.center,
div.contents table td.center{
	text-align: center;
}

div.contents table th.right,
div.contents table td.right{
	text-align: right;
}

div.contents table th.middle,
div.contents table td.middle{
	vertical-align: middle;
}

div.contents .nowrap{
	white-space: nowrap;
}

/*----------------------------------------------------------------------
/			list
/----------------------------------------------------------------------*/
div.contents ol,ul{
	margin: 0 0 10px 26px;
}

div.contents ul li{
	list-style-type: disc;
}

div.contents ol li{
	list-style-type: decimal;
}

/*----------------------------------------------------------------------
/			header
/----------------------------------------------------------------------*/
div#header{
	position: relative;
	height: 95px;
	background: #fff url(/images/common/header_bg.gif) repeat-x left bottom;
	text-align: center;
}

div#header img{
	vertical-align: middle;
}

div#logo{
	position: absolute;
	left: 31px;
	top: 5px;
}

div#logoJ{
	position: absolute;
	left: 15px;
	bottom: 4px;
}

/*----------サーチ---------*/
div#wordSearch{
	position: absolute;
	left: 50%;
	top: 10px;
	z-index: 100;
	width: 420px;
	height: 33px;
	margin-left: -210px;
	padding: 0;
	background: url(/images/common/search_bg.gif) no-repeat;
}

div#wordSearch div.inner{
	padding-top: 5px;
}

div#wordSearch input#word{
	width: 200px;
}

div#wordSearch input,
div#wordSearch select{
	margin-left: 5px;
	font-size: 90%;
}

div#wordSearch input,
div#wordSearch select option{
	font-size: 93%;
}

div#wordSearch input.typeText{
	width: 160px;
	padding: 1px;
	border: solid 1px #999;
}

div#wordSearch input.typeSubmit{
	width: 5em;
	color: #333;
}

/*----------ナビ----------*/
div#navi{
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 100;
	width: 550px;
/*	margin-left: -235px; */
	margin: 0 auto;
}

div#navi ul{
	margin: 0;
	padding: 0;
}
div#navi ul li{
	list-style-type: none;
	display: inline;
	margin: 0;
	padding: 0;
}

div#navi1 ul{
	height: 19px;
	margin: 0 0 9px;
	overflow: hidden;
}
div#navi1 ul li{
	height: 19px;
}
div#navi1 ul li a:hover{
	background-color: #fcf8a8;
}

div#navi2 ul{
	height: 20px;
	overflow: hidden;
}
div#navi2 ul li{
	height: 20px;
}
div#navi2 ul li img{
	margin: 0 8px;
}

/*----------買い物かご----------*/
div#cart{
	position: absolute;
	right: 15px;
	top:15px;
}

/*----------------------------------------------------------------------
/			cateogry
/----------------------------------------------------------------------*/
div#category{
	width: 310px;
	padding: 8px 0 15px;
}

div#category h3{
	margin: 0 0 6px 0;
	padding: 4px 15px;
	background-color: #ffe700;
}

div#category ul li{
	list-style-type: none;
	padding: 0 0 0 9px;
	background: url(/images/common/arrow.gif) no-repeat left top;
}

/*----------what's new----------*/
div#categoryNew ul{
	margin: 0 0 15px 15px;
	padding: 0;
	font-size: 110%;
	line-height: 140%;
}
div#categoryNew ul li a{
	text-decoration: none;
}
/*----------category list----------*/
div#categoryList ul{
	float: left;
	width: 146px;
	margin: 0;
	padding: 0 0 17px 15px;
	line-height: 150%;
}

div#categoryList ul li{
	list-style-type: none;
/*	width: 136px; */
	margin: 0 0 2px 0;
	font-size: 1em;
}
div#categoryList ul li a{
	text-decoration: none;
}
div#categoryList ul ul{
	padding-bottom: 5px;
}
/*----------hi-fi category list----------*/
div#categoryListSelect select{
	margin: 0 5px 5px 15px;
}

div#categoryListSelect input{
	width: 3em;
	margin: 0 0 5px;
	color: #333;
}

p.hifiTop {
	font-size: 12px;
	padding-top: 10px;
}

p.hifiTop a{
	text-decoration: none;
}

/*---------mobile---------*/
div#mobileSite{

}
div#mobileSite div.inner h4{
	margin: 0 0 10px 0;
	background:url(/images/common/arrow.gif) no-repeat 0 2px;
	padding-left: 10px;
	font-size: 105%;
}
div#mobileSite div.inner h4 a{
	color: #ff3300;
}
div#mobileSite div.inner{
	padding: 0px 0 16px 16px ;
}
div#mobileSite div.inner p{
	padding: 0px 0 0 0;
	width: 170px;
	float:right;
}
div#mobileSite div.inner img#hifiMobile{
	float:left;
	padding-top: 3px;
}
/****************************
 * 左のカテゴリー枠の幅決め。index.htmlの<frameset cols="350,*" border="0">も指定
 ****************************/
div#category{
	width: 100%;
}
div#categoryList>div>ul{
	width: 47%
}

/*----------------------------------------------------------------------
/			その他共通
/----------------------------------------------------------------------*/
.center{
	text-align: center;
}
.caution{
	border: 1px solid #c41c0f;
	background: url(images/icon/error.png) no-repeat 4px center #ffefed;
	padding: 12px 12px 12px 32px ;
}
span.attention{
	font-weight: bold;
	color: #c41933;
}
.navButton{
	padding: 14px 10px;
	width: 30%;
}