@charset "utf-8";

/*
===========================================================================
| 			top
===========================================================================
*/
/*----------------------------------------------------------------------
/			右カラム
/----------------------------------------------------------------------*/
div#top.contents div.rightColumn{
	float: right;
	width: 194px;
	margin-bottom: 10px;
	font-size: 83%;
	line-height: 140%;
}
div#top.contents div.rightColumn h1{
	font-size: 110%;
	font-weight: bold;
	color: #cc0000;
}

/*----------概要----------*/
div#top.contents div.rightColumn div.info{
	margin: 5px 0 20px 0;
	padding: 8px 0;
	border-top: solid 1px #cccccc;
	border-bottom: solid 1px #cccccc;
}
div#top.contents div.rightColumn div.info h1{
	margin: 0 0 3px;
}
div#top.contents div.rightColumn div.info p{
	margin: 0;
}

/*----------バナー----------*/
div#top.contents div.rightColumn div.banner{
	margin-bottom: 15px;
}
div#top.contents div.rightColumn div.banner ul{
	width: 194px;
	margin: 0;
	padding: 0;
}
div#top.contents div.rightColumn div.banner ul li{
	list-style-type: none;
	float: left;
/*	width: 194px; */
/*	height: 40px; */
	margin: 0;
	padding: 0 0 2px;
}

/*----------ニュース----------*/
div#top.contents div.rightColumn div.news{
	background-color: #edede4;
	margin: 5px 0 0;
	padding: 10px;
}
div#top.contents div.rightColumn div.news h2{
	padding:0;
	margin:0;
	background: none;
}
div#top.contents div.rightColumn div.news ul{
	margin: 0;
	padding: 0;
}
div#top.contents div.rightColumn div.news ul li{
	list-style-type: none;
	margin: 5px 0 0;
	padding: 5px 0 0;
	border-top: solid 1px #b5b5ac;
}
div#top.contents div.rightColumn div.news ul li strong{
	font-weight: normal;
}

/*----------------------------------------------------------------------
/			画像ランダム表示
/----------------------------------------------------------------------*/
div#top.contents div.randomImage{
	margin-right: 210px;
}
div#top.contents div.randomImage ul{
	margin: 0;
	padding: 0;
}
div#top.contents div.randomImage ul li,div#top.contents div.randomImage ul li img{
	width: 120px;
	height: 120px;
}
div#top.contents div.randomImage ul li{
	list-style-type: none;
	float: left;
	overflow: hidden;
	margin: 0 7px 7px 0;
	padding: 0;
	background: #ccc url(/images/common/icon_loading.gif) no-repeat center center;
}
div#top.contents div.randomImage ul li img{
	margin: 0;
}

/*----------------------------------------------------------------------
/			下部メニュー
/----------------------------------------------------------------------*/
div#top.contents ul.otherNavi{
	margin: 0 0 0 5px;
	padding: 0;
}
div#top.contents ul.otherNavi li{
	list-style-type: none;
	margin: 1px 0;
	padding: 0 0 0 14px;
	background: #fff url(/images/top/icon_othernavi.gif) no-repeat left top;
}
div#top.contents ul.otherNavi li a:link{
 	color: #060;
}
div#top.contents ul.otherNavi li a:visited{
 	color: #004f00;
}
div#top.contents ul.otherNavi li a:hover{
 	color: #af1341;
}

/*----------------------------------------------------------------------
/			ハイファイ詳細
/----------------------------------------------------------------------*/
/*----------カード----------*/
div#top.contents div.card{
	padding: 15px 0 0;
}
div#top.contents div.card ul{
	margin: 0;
	padding: 0;
}
div#top.contents div.card ul li{
	list-style-type: none;
	display: inline;
	margin: 0;
	padding-right: 10px;
}

/*----------セキュア・サーバ----------*/
div#top.contents div.secure{
	padding: 15px 0 0;
}
div#top.contents div.secure img{
	float: left;
}
div#top.contents div.secure p{
	margin-left: 120px;
	padding: 20px 0 0;
}

/*----------ストア・会社詳細----------*/
div#top.contents div.hifiDetails{
	padding: 15px 0 0;
}
div#top.contents div.hifiDetails img{
	margin-right: 10px;
}
/*----------コピーライト----------*/
div#top.contents div.copyright{
	padding: 15px 0 0;
}

/*
===========================================================================
| 			search
===========================================================================
*/
div.contents#search{
	font-size: 95%;
}
div#search.contents div.searchResult{
	margin-bottom: 15px;
}
div#search.contents div.searchResult strong{
	float: right;
}
div#search.contents div.searchResult form.reOrder{
	display: inline;
	margin: 0; padding: 0;
}
div#search.contents div.searchResult p.rec_order{
	display: inline;
	margin: 0;
}
div#search.contents div.searchResult p.rec_order span{
	margin: 0 ;
	padding: 2px 8px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}
div#search.contents div.searchResult p.rec_order span.title{
	font-weight: bold;
	color: #fff;
}
div#search.contents div.searchResult p.rec_order span.on{
	background-color: #00639c;
}
div#search.contents div.searchResult p.rec_order span.on a{
	color: #fff;
}
div#search.contents p.soldout{
	text-align: right;
	font-weight: bold;
	font-size: 1.3em;
	color: #af1341;
	padding-right: 12px;
}
div#search.contents div.artist-search{
	text-align: left;
	margin: 6px 0 0 2px;
}
div#search.contents div.artist-search a{
	background: url(images/icon/point_arrow_r.gif) no-repeat left center;
	padding-left: 12px;
}
/*----------------------------------------------------------------------
/			ページ遷移
/----------------------------------------------------------------------*/
div#search.contents div.pageNavi{
	position: relative;
	width: 100%;
	margin: 5px 0 0;
	padding: 5px 0;
	background-color: #e9e9e9;
}
div#search.contents div.pageNavi div.pageList{
	margin: 0 140px 0 10px;
	font-size: 90%;
}
div#search.contents div.pageNavi div.pageList span.on{
	font-weight: bold;
}
div#search.contents div.pageNavi img.next{
	position: absolute;
	right: 10px;
	top: 5px;
}
div#search.contents div.pageNavi img.back{
	position: absolute;
	right: 72px;
	top: 5px;
}

/*----------------------------------------------------------------------
/			商品詳細
/----------------------------------------------------------------------*/
div#search.contents div.item{
	margin: 20px 0;
	padding: 0 0 20px 0;
	background: url(/images/common/dot_line.gif) repeat-x bottom;
}
div#search.contents div.item div.jacket{
	float: left;
	overflow: hidden;
	width: 120px;
/*	height: 188px; */
	text-align:center;
	line-height: 120%;
	margin-bottom: 15px;
	background: #fff url(/images/common/icon_loading.gif) no-repeat center 10px;
}
div#search.contents div.item div.jacket a{
	cursor: zoom-in;
}
div#search.contents div.item div.form{
	margin-bottom: 20px;
	text-align: right;
}
div#search.contents div.item div.form form{
	display: inline;
}
div#search.contents div.item div.form form input{
	margin: 2px 6px 0 0;padding:0;
}
div#search.contents div.item div.jacket img{
}
div#search.contents div.item div.jacket div.zoom{
	font-size: 90%;
	color: #990000;
	text-align: left;
}
div#search.contents div.item div.jacket img.no-zoom{
	cursor: default;
}
div#search.contents div.item ul.otherJacket{
	padding: 2px 0 0 0;
	margin: 0;
/*	text-align: left; */
}
div#search.contents div.item ul.otherJacket li{
	display: inline;
	list-style-type: none;
	padding: 0;
	margin: 1px;
}
div#search.contents div.item ul.otherJacket li img{
	width: 55px;
	height: 55px;
}
div#search.contents div.item ul.otherJacket li a{
	cursor: zoom-in;
	border: #fff;
}
div#search.contents div.item span.price{
	font-weight:bold;
	color: #af1341
}
div#search.contents div.item div.info{
	margin: 0 0 20px 130px;
	line-height: 1.4em;
}
div#search.contents div.item div.info h2.artist,
div#search.contents div.item div.info h3.title{
	display: inline;
	font-weight: bold;
	padding: 0;
	background: none;
	border:none;
	font-size: 120%;
	line-height: 140%;
	color: #333333;
}
div#search.contents div.item h4{
	margin: 0px 0 0 ;
	color: #af1341;
	font-weight: bold;
	font-size: 105%;
}
div#search.contents div.item div.today,
div#search.contents div.item div.bargain,
div#search.contents div.item div.new,
div#search.contents div.item div.stillNew{
	margin:0px 6px 6px 0;
	padding-top: 3px;
	display: inline-block;
}
div#search.contents div.item div.stillNew{
	display: none;
}
div#search.contents div.item div.today span,span.today,
div#search.contents div.item div.bargain span,span.bargain,
div#search.contents div.item div.new span,span.new,
div#search.contents div.item div.stillNew span, span.stillNew{
	font-size: 70%;
	font-weight: bold;
	color: #cc0000;
	line-height: 100%;
	background-color: #bb1341;
	color: #ffffff;
	padding: 2px 8px 1px 8px;
}
div#search.contents div.item div.new span, span.new{
	background-color: #339900;
}
div#search.contents div.item div.bargain span, span.bargain{
	background-color: #ffe700;
	color: #bb1341;
}
div#search.contents div.item div.stillNew span,span.stillNew{
	background-color: #006699;
}
div#search.contents div.item div.title{
	margin: 2px 0 0 6px;
}
div#search.contents div.item div.category{
	margin: 2px 0 0 5px;
	font-weight: bold;
	color: #cc9900
}
div#search.contents div.item div.category a,
div#search.contents div.item div.category a:visited{
	color: #cc9900;
}
div#search.contents div.item .condition{
	margin: 0 0 10px 0;
}
div#search.contents div.item .condition li{
	list-style-type: none;
	line-height: 1.3em;
}
div#search.contents div.item .condition li label{
/*	width: 10em;
	float: left; */
	padding-right: 0.3em;
}
div#search.contents div.item .condition li span{
}
div#search.contents div.item .condition span.jacketCondition{
}
div#search.contents div.item .condition span.recordCondition{
}
div#search.contents div.item .condition span.status1,
div#search.contents div.item .condition span.status2,
div#search.contents div.item .condition span.status3,
div#search.contents div.item .condition span.status4,
div#search.contents div.item .condition span.status5{
}
div#search.contents div.item div.etc{
	margin: 2px 0;
	line-height: 1.3em;
}
div#search.contents div.item dl.musicList{
	margin: 10px 0 15px;
}
div#search.contents div.item dl.musicList dt{
	margin: 0 0 3px;
	padding-left: 12px;
	background: url(/images/common/arrow_musiclist.gif) no-repeat left center;
	color: #006699;
	text-decoration: underline;
	white-space: nowrap;
	width: 50px;
}
div#search.contents div.item dl.musicList dt.show{
	background: url(/images/common/arrow_musiclist_on.gif) no-repeat left center;
}
div#search.contents div.item dl.musicList dd{
	display: none;
}
div#search.contents div.item dl.musicList dd.show{
	display: block;
}
div#search.contents div.item div.sound{
/*
	position: relative;*/
	width: 100%;

}
div#search.contents div.item div.sound div.sample{
	/*float:left;*/
}
div#search.contents div.item div.sound div.sample img{
	margin-right: 10px;
}
div#search.contents div.item div.sound img.icon{
	margin: 0 5px 0 0;
	vertical-align: middle;
}
div#search.contents div.item div.sound div.sample div.mp3Flash{
	padding: 3px 0 0;
}
div#search.contents div.item div.sound div.sample div.mp3Flash div.mpPlayer{
	display: inline;
	width: 50px;
	height: 20px;
	padding-right: 4px;
	background: #ffffff url(/images/common/mp3_loading.gif) no-repeat 50% 50%;
}
div#search.contents div.item div.sound input.cartButton{
	/*
	position: absolute;
	right: 0;
	bottom: 0;
	padding: 0 5px; 
	*/
	float:right;
	width:120px;
}
/*
div#search.contents div.item div.sound form.cartForm{
	/*
	position: absolute;
	right: 20;
	bottom: 0;
	*/

}



/*
===========================================================================
| 			chargeFree
===========================================================================
*/

div#chargeFree div.chapter#last{
	margin-bottom: 300px;
}
/*
===========================================================================
| 			static共通
===========================================================================
*/
div.chapter{
	margin: 0 0 30px;
}
div.contents div.photoRight{
	float: right;
}
div.contents table.line{
}
div.contents table.line th,
div.contents table.line td{
	border: solid 1px #ccc;
}
div.contents table.line th{
	background-color: #efefef;
}
div.contents p.pagetop{
	padding: 5px 0 0;
	font-size: 85%;
	text-align: right;
}
div.contents ul.pageLink{
	margin: 0 0 25px;
	padding: 0;
}
div.contents ul.pageLink li{
	list-style-type: none;
	margin: 0;
	padding: 0 0 0 17px;
	background: url(/images/common/icon_pagelink.gif) no-repeat left top;
}

/*
===========================================================================
| 			info　Hi-Fiについて
===========================================================================
*/
/*----------------------------------------------------------------------
/			about
/----------------------------------------------------------------------*/
div#info.contents div.photoRight img{
	margin: 0 0 5px;
}
div#info.contents div.section{
	padding: 0 240px 0 0;
}

/*----------------------------------------------------------------------
/			map
/----------------------------------------------------------------------*/
div#info.contents div.map img{
	margin: 0 0 5px;
}

/*
===========================================================================
| 			rule　特定商取引法に基づく表記
===========================================================================
*/

/*
===========================================================================
| 			condition　コンディション表記
===========================================================================
*/
div#condition table.line{
	width: 650px;
	margin: 0;
}
div#condition table.line td.omission{
	width: 90px;
	text-align: left;
}
div#condition table.line td.omission div.sample{
	float: right;
}
div#condition table.line td.english{
	width: 200px;
}

/*
===========================================================================
| 			howto　ご注文について
===========================================================================
*/
/*----------------------------------------------------------------------
/			送料
/----------------------------------------------------------------------*/
div#howto table.carriage th,
div#howto table.carriage td{
	width: 50px;
}
div#howto table.carriage td{
	text-align: right;
}

/*----------------------------------------------------------------------
/			代金引換手数料
/----------------------------------------------------------------------*/
div#howto table.charge th{
	text-align: left;
}
div#howto table.charge td{
	width: 60px;
	text-align: right;
}

/*
===========================================================================
| 			topics　お知らせ
===========================================================================
*/
div#topics div.detail03 div.photoRight img{
	margin: 0 0 10px;
}
div#topics div.detail03 div.section{
	padding: 0 170px 0 0;
}

/*
===========================================================================
| 			form
===========================================================================
*/

div#shipping td.right{
	text-align:right;
}
div#shipping td.center{
	text-align:center;
}
div#shipping td span.tax{
	font-size:80%;
	color: #666666;
	display: block;
}
div#shipping table.line tr.amount td{
	/*background-color:#FEDC23;*/
background-color:#ffffff;
}
div#shipping table.line tr.amount th{
	background-color:#FEDC23;
  color:#333333;
	text-align:left;
}
div#shipping table.line tr.amount td{
	background-color:#ffffcc;
  color:#333333;
	font-weight:bold;
}
div#shipping table.line{
	width: 100%;
}
div#shipping table.line td{
	background-color:#ffffff;
}
div#shipping table.line th{
	text-align: center;
	background-color: #666666;
	color: #ffffff;
}

div#shipping table.line tr.title th{
	background-color: #006699;
	text-align:left;
}
div#shipping table.line th.left{
	text-align: left;
}
div#shipping tr.stt th{
	white-space: nowrap;
}
div#shipping option{
	padding-right: 10px;
}
div#shipping select{
	font-size:90%;
}
div#shipping table tr.error td{
	font-weight: bold;
	color: #bb1341;
}
div#shipping table.line#allamount{
	margin-bottom: 10px;
}
div#shipping table.line#allamount td{
	font-size:130%;
	color: #ff6600;
	font-weight:bold;
}
div#shipping table.line#allamount th{
	border-right:none;
	background-color:#ffffff;
	color: #333333;
	text-align: left;
}

div#shipping div.explain{
	text-align:center;
}
div#shipping div.explain p{
	margin-top: 10px;
	margin-bottom: 10px;
}
div#shipping select#map, select#credit{
	width: 200px;
}
div#shipping input#order{
	width: 200px;
	height: 40px;
	background-color:#cccccc;
}
div#shipping .caption{
	font-size:90%;
}
div#shipping div#header{
	margin-bottom: 20px;
}
div#shipping div#header div#logo{
	left: 0;
}

div#shipping input.inputButton{
	width: 200px;
	height: 40px;
	background-color:#cccccc;
}
div#shipping.contents .payment.annotation{
    font-size: 0.85em;
    padding: 2px 8px;
    margin: 8px 3px 0;
    border: 1px solid #b7b7b7;
    border-radius: 5px;
}
/*====================================
	orderinfo
====================================*/
div#orderinfo div#header{
	margin-bottom: 20px;
}
div#orderinfo{
	padding-top:20px;
}
div#orderinfo h1{
	font-size:120%;
	color :#af1341;
}
div#orderinfo div.message{
	border:1px solid #cccccc;
	background-color: #f5f5f5;
	padding: 10px 15px;
	margin: 0 0 14px 0;
}
div#orderinfo p.from{
	text-align: right;
	font-size: 90%;
	font-weight: bold;
	margin-bottom:0;
	color: #cc9900;
}
div#orderinfo div#header div#logo{
	left: 0;
}
div#orderinfo input#order{
	width: 200px;
	height: 40px;
	background-color:#cccccc;
}
div#orderinfo div.explain{
	text-align:center;
	border-top:1px solid #cccccc;
	margin-top: 30px;
	padding: 30px 0;
}
div.basicinfo{
	border:1px solid #cccccc;
	padding: 10px;
	background-color:#cccccc;
	margin-bottom: 20px;
}
div.basicinfo table{
	margin-bottom: 10px;
}
div.basicinfo table.line#allamount{
	margin-bottom: 0px;
}
div#orderinfo th{
	text-align: left;
	width: 200px;
}
div#orderinfo th{
	text-align: left;
}
/*====================================
	reserve
====================================*/
div#shipping td.right{
	text-align:right;
}
div#reserve td.center{
	text-align:center;
}
div#reserve td span.tax{
	font-size:80%;
	color: #666666;
	display: block;
}
div#reserve table.line tr.amount td{
	/*background-color:#FEDC23;*/
background-color:#ffffff;
}
div#reserve table.line tr.amount th{
	background-color:#FEDC23;
  color:#333333;
	text-align:left;
}
div#reserve table.line tr.amount td{
	background-color:#ffffcc;
  color:#333333;
	font-weight:bold;
}
div#reserve table.line{
	width: 100%;
}
div#reserve table.line td{
	background-color:#ffffff;
}
div#reserve table.line th{
	width: 165px;
	text-align: center;
	background-color: #666666;
	color: #ffffff;
}

div#reserve table.line tr.title th{
	background-color: #006699;
	text-align:left;
}
div#reserve table.line tr.error th{
	background-color: #bb1341;
}
div#reserve table.line th.left{
	text-align: left;
}
div#reserve tr.stt th{
	white-space: nowrap;
}
div#reserve option{
	padding-right: 10px;
}
div#reserve select{
	font-size:90%;
}

div#reserve table.line#allamount{
	margin-bottom: 10px;
}
div#reserve table.line#allamount td{
	font-size:130%;
	color: #ff6600;
	font-weight:bold;
}
div#reserve table.line#allamount th{
	border-right:none;
	background-color:#ffffff;
	color: #333333;
	text-align: left;
}

div#reserve div.explain{
	text-align:center;
}
div#reserve div.explain p{
	margin-top: 10px;
	margin-bottom: 10px;
}
div#reserve select#map, select#credit{
	width: 200px;
}
div#reserve input#order{
	width: 200px;
	height: 40px;
	background-color:#cccccc;
}
div#reserve .caption{
	font-size:90%;
}
div#reserve div#header{
	margin-bottom: 20px;
}
div#reserve div#header div#logo{
	left: 0;
}

div#reserve input.inputButton{
	width: 200px;
	height: 40px;
	background-color:#cccccc;
}
/*====================================
	error
====================================*/
div.error{
	color: #bb1341;
	margin-bottom: 10px;
}
span.must, span.required{
	color: #bb1341;
	font-weight: normal;
	font-size: 90%;
}
div.error ul{
	padding: 0 0 0 20px;
}
table.line tr.error td{
	background-color: #bb1341;
	color: #ffffff;
}
table.line tr.error th{
	background-color: #bb1341;
	color: #ffffff;
}
table.line tr.error th span.must{
	color: #ffffff
}
/*
===========================================================================
| 			searchOrder　Hi-Fi Search Service Order Form
===========================================================================
*/
div#searchOrder table.line th{
	text-align: left;
}
div#searchOrder table.line tr.button td{
	padding-top: 20px;
	border: none;
	text-align: center;
}

div#searchOrder table.line tr.button td input{
	padding: 2px 10px;
}

/*====================================
	mailmag
====================================*/
table#mailmagForm{
   width: 100%;
}
table#mailmagForm th{
   width: 120px;
}
table#mailmagForm input.txt-name{
	 width: 220px;
}
table#mailmagForm input.txt-email{
	 width: 340px;
}
table#mailmagForm input#sbutton{
    padding: 4px 16px;
    width: 200px;
    height: 40px;
    background-color: #cccccc;
}
div.contents .notice {
    color: #d80400;
    background-color: #f2dede;
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid #ebccd1;
    border-radius: 4px;
}