@charset "UTF-8";
/* CSS Document */

/* #sidebar1 に関するヒント：
1. 単位は相対単位であるため、サイドバーで余白を使用することは回避してください。標準に準拠したブラウザでは、余白は全体の幅に追加されるため、実際の幅が不特定の幅になります。 
2. サイドバーの値の単位として em が使用されているので、その幅が初期設定のテキストサイズに応じて変化することに注意してください。
3. 「.twoColHybLtHdr #sidebar1 p」ルールで見られるように、div の端と div に含まれるエレメントの間のスペースは、エレメントに左マージンと右マージンを適用することによって設定できます。
*/
.HybLtHdr #sidebar1 {
	float: left; 
	width: 12em; /* このエレメントはフローティングエレメントであるため、幅が設定されている必要があります */
	background: #000000; /* 背景色は、列内のコンテンツの長さにわたって表示されます */
	padding: 30px 0; /* 上余白と下余白により、この div 内に視覚的なスペースが設定されます */
}
.HybLtHdr #sidebar1 h3, .HybLtHdr #sidebar1 p {
	margin-left: 10px; /* サイドバーに配置されるすべてのエレメントに左マージンと右マージンが設定されている必要があります */
	margin-right: 10px;
}

/* #mainContent に関するヒント：
1. #mainContent と #sidebar1 の間のスペースは、#mainContent div の左マージンによって設定されます。#sidebar1 div に含まれるコンテンツの量に関係なく、#sidebar1 div のスペースは維持されます。#sidebar1 のコンテンツが終了した後のスペースに #mainContent div のテキストを挿入するには、この左マージンを削除します。
2. #mainContent div の幅より広いエレメントが #mainContent div 内に配置されると、フローティングエレメントの落下（フローティング状態ではない #mainContent 領域がサイドバーの下に配置されること）が発生する可能性があります。ハイブリッドレイアウトの場合（全体の幅の単位はパーセント、サイドバーの単位は em）、使用可能な幅を正確に計算できない場合があります。ユーザーのテキストサイズが平均よりも大きい場合、#sidebar1 div が広くなるため、#mainContent div のスペースが狭くなります。クライアントが Contribute を使用してコンテンツを追加する予定である場合は、この制限に注意してください。
3. 下の Internet Explorer の条件分岐コメントでは、#mainContent に「hasLayout」を設定するのにズームプロパティが使用されます。これにより、いくつかの IE 固有のバグを回避できます。
*/
.HybLtHdr #mainContent {
	margin: 30px 50px 0 13em; /* 右マージンは、パーセントまたはピクセルで設定できます。これにより、ページの右側にスペースが設定されます。 */
} 


/* 再使用できる各種クラス */
.fltrt { /* このクラスは、ページ上でフローティングエレメントを右側に配置するのに使用できます。プローティングエレメントは、ページ上でその横に配置されるエレメントの前に配置される必要があります。 */
	float: right;
	margin-left: 8px;
}
.fltlft { /* このクラスは、ページ上でフローティングエレメントを左側に配置するのに使用できます */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* このクラスは、div またはブレークエレメントに適用される必要があり、また、フローティングエレメントが完全に含まれているコンテナの末尾の直前にある最後のエレメントである必要があります */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}


#sidebar1 ul {
	list-style-image: url(../img/mark01.gif);
	list-style-position: inside;
	font-family: "ＭＳ Ｐゴシック", Osaka, HiraKakuPro-W3;
	font-size: 0.75em;
	line-height: 150%;
	color: #FFFFFF;
	margin-left: 10px;
}

#sidebar1 li {
margin-bottom: .75em;
padding-left: .5em;
}

#sidebar1 ul ul {
margin-top: .5em;
list-style-image: url(../img/mark02.gif);
font-size: 1em;
}

#sidebar1 ul ul ul {
list-style-image: url(../img/mark03.jpg);
}

#sidebar1 ul ul li {
padding-left: 20px;
}


/* カタログ */
.catalog {
	width: 130px;
	height:63px;
	margin-top: 20px;
	margin-left: 15px;
	background:url(../../instruments/img/catalog.gif) no-repeat left bottom;
}
.catalog a {
	display:block;
	width:130px;
	height:63px;
	font-size:1px;
	line-height:1px;
	outline:none;
	text-indent:-9999px;
}
.catalog a:hover {
	background:url(../../instruments/img/catalog_on.gif) no-repeat left bottom;
	}

/* 楽器 */
#gakki {
	margin:0px;
}

#gakki div.imagebox {
	background-color: #000000;
	width: 177px;
	height:366px;
	float: left;
	margin: 0px;
}
#gakki div.imagebox_right {
	background-color: #000000;
	width: 176px;
	height:366px;
	float: left;
	margin: 0px;
}
p.exp {
	clear: left;
		}
/* 楽器-トランペット */
.trumpet {
	width:177px;
	height:366px;
	background:url(../../instruments/img/trumpet.jpg) no-repeat left bottom;
}
.trumpet a {
	display:block;
	width:177px;
	height:366px;
	font-size:1px;
	line-height:1px;
	outline:none;
	text-indent:-9999px;
}
.trumpet a:hover {
	background:url(../../instruments/img/trumpet_on.jpg) no-repeat left bottom;
	}
/* 楽器-コルネット */
.cornet {
	width:177px;
	height:366px;
	background:url(../../instruments/img/cornet.jpg) no-repeat left bottom;
}
.cornet a {
	display:block;
	width:177px;
	height:366px;
	font-size:1px;
	line-height:1px;
	outline:none;
	text-indent:-9999px;
}
.cornet a:hover {
	background:url(../../instruments/img/cornet_on.jpg) no-repeat left bottom;
	}
/* 楽器-フリューゲルホルン */
.fluegelhone {
	width:177px;
	height:366px;
	background:url(../../instruments/img/fluegelhone.jpg) no-repeat left bottom;
}
.fluegelhone a {
	display:block;
	width:177px;
	height:366px;
	font-size:1px;
	line-height:1px;
	outline:none;
	text-indent:-9999px;
}
.fluegelhone a:hover {
	background:url(../../instruments/img/fluegelhone_on.jpg) no-repeat left bottom;
	}
/* 楽器-トロンボーン */
.trombone {
	width:177px;
	height:366px;
	background:url(../../instruments/img/trombone.jpg) no-repeat left bottom;
}
.trombone a {
	display:block;
	width:177px;
	height:366px;
	font-size:1px;
	line-height:1px;
	outline:none;
	text-indent:-9999px;
}
.trombone a:hover {
	background:url(../../instruments/img/trombone_on.jpg) no-repeat left bottom;
	}
/* 楽器-アクセサリー */
.accessories {
	width:176px;
	height:366px;
	background:url(../../instruments/img/accessories.jpg) no-repeat left bottom;
}
.accessories a {
	display:block;
	width:176px;
	height:366px;
	font-size:1px;
	line-height:1px;
	outline:none;
	text-indent:-9999px;
}
.accessories a:hover {
	background:url(../../instruments/img/accessories_on.jpg) no-repeat left bottom;
	}		



#list {
	margin:0px;
}

div#list .box {
	overflow: hidden;
	position: relative;
	width: 884px;
	margin: 0px 0px 50px;
}
div#list .right
	{
	width: 417px;
	float: left;
	margin: 0px;
	}
	
div#list .left
	{
	width: 417px;
	float: right;
	margin: 0px;
	}
	


div#list .model {
	width: 417px;
}
div#list .name {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #999999;
	margin-bottom: 5px;
}


/* model 720px */
div#mainContent .boxs {
	overflow: hidden;
	position: relative;
	width: 720px;
	margin: 0px 0px 50px;
}

div#mainContent .rights
	{
	width: 335px;
	float: left;
	margin: 0px;
	}
	
div#mainContent .lefts
	{
	width: 335px;
	float: right;
	margin: 0px;
	}

/* model 720px */
div#mainContent .box02 {
	overflow: hidden;
	position: relative;
	width: 720px;
	margin: 0px 0px 50px;
}

div#mainContent .right02
	{
	width: 335px;
	float: left;
	margin: 0px;
	}
	
div#mainContent .left02
	{
	width: 335px;
	float: right;
	margin: 0px;
	}
div#mainContent .left02_ph
	{
	width: 100px;
	float: left;
	margin: 0px;
	}
div#mainContent .right02_txt
	{
	width: 235px;
	float: right;
	margin: 0px;
	}
	
/* model 660px */
div#mainContent .box {
	overflow: hidden;
	position: relative;
	width: 660px;
	margin: 0px 30px 50px;
}

div#mainContent .right
	{
	width: 305px;
	float: left;
	margin: 0px;
	}
	
div#mainContent .left
	{
	width: 305px;
	float: right;
	margin: 0px;
	}
	
.model {
	width: 305px;
}
.models {
	width: 330px;
}
.name {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #999999;
	margin-bottom: 5px;
}

.con {
margin-top: 0px;
margin-left: 30px;
margin-right: 30px;
margin-bottom: 20px;
width: 660px;
}


/* trumpet stradivarius 180 */
#sp {
	background-image:url(../../instruments/trumpet/bb/stradivarius/img/ph_180ml37sp.jpg);
	margin: 30px 30px 50px;
	height: 300px;
	width: 660px;
	background-repeat: no-repeat;
}
#sp02 {
	background-image:url(../../instruments/trumpet/bb/stradivarius/img/ph_182ml37sp.jpg);
	margin: 30px 30px 50px;
	height: 340px;
	width: 660px;
	background-repeat: no-repeat;
}

/* trumpet Bass */
#bass {
	background-image:url(../../instruments/trumpet/other/stradivarius/img/ph_b188.jpg);
	margin: 30px 30px 50px;
	height: 280px;
	width: 660px;
	background-repeat: no-repeat;
}
#trianfal {
	background-image:url(../../instruments/trumpet/other/stradivarius/img/ph_b185.jpg);
	margin: 30px 30px 50px;
	height: 240px;
	width: 660px;
	background-repeat: no-repeat;
}

/* trumpet Artisan Collection */
h2.title_bg_bach {
	background:url(../../instruments/trumpet/img/h2_titlebg_bach.jpg) top right no-repeat;
	height:50px;
}
.btn_enter {
	text-align:center;
	margin-bottom:40px;
}

#ab190 {
	background-image:url(../../instruments/trumpet/bb/artisan/img/ph_ab190.jpg);
	background-position:bottom;
	margin: 0 30px 50px;
	height: 320px;
	width: 660px;
	background-repeat: no-repeat;
}
#ab190s {
	background-image:url(../../instruments/trumpet/bb/artisan/img/ph_ab190s.jpg);
	background-position:bottom;
	margin: 0 30px 50px;
	height: 320px;
	width: 660px;
	background-repeat: no-repeat;
}
#ac190 {
	background-image:url(../../instruments/trumpet/c/artisan/img/ph_ac190.jpg);
	background-position:bottom;
	margin: 0 30px 50px;
	height: 320px;
	width: 660px;
	background-repeat: no-repeat;
}
#ac190s {
	background-image:url(../../instruments/trumpet/c/artisan/img/ph_ac190s.jpg);
	background-position:bottom;
	margin: 0 30px 50px;
	height: 320px;
	width: 660px;
	background-repeat: no-repeat;
}
#ae190 {
	background-image:url(../../instruments/trumpet/other/artisan/img/ph_ae190.jpg);
	background-position:bottom;
	margin: 0 30px 50px;
	height: 320px;
	width: 660px;
	background-repeat: no-repeat;
}
#ae190s {
	background-image:url(../../instruments/trumpet/other/artisan/img/ph_ae190s.jpg);
	background-position:bottom;
	margin: 0 30px 50px;
	height: 320px;
	width: 660px;
	background-repeat: no-repeat;
}
#ade190 {
	background-image:url(../../instruments/trumpet/other/artisan/img/ph_ade190.jpg);
	background-position:bottom;
	margin: 0 30px 50px;
	height: 320px;
	width: 660px;
	background-repeat: no-repeat;
}
#ade190s {
	background-image:url(../../instruments/trumpet/other/artisan/img/ph_ade190s.jpg);
	background-position:bottom;
	margin: 0 30px 50px;
	height: 500px;
	width: 660px;
	background-repeat: no-repeat;
}
#ap190 {
	background-image:url(../../instruments/trumpet/piccolo/artisan/img/ph_ap190.jpg);
	background-position:bottom;
	margin: 0 30px 50px;
	height: 420px;
	width: 660px;
	background-repeat: no-repeat;
}
#ap190s {
	background-image:url(../../instruments/trumpet/piccolo/artisan/img/ph_ap190s.jpg);
	background-position:bottom;
	margin: 0 30px 50px;
	height: 420px;
	width: 660px;
	background-repeat: no-repeat;
}

div#mainContent .box .item_box {
	overflow:hidden;
}
div#mainContent .box .item_box dl {
	float:left;
	width:210px;
	padding:0 5px;
	margin-bottom:10px;
}
div#mainContent .box .item_box dd {
	width:200px;
	padding:0 5px;
	font-size:12px;
}

/* 注釈 */
div#mainContent .annotation_box {
	overflow: hidden;
	position: relative;
	width: 720px;
	margin: 0px 0px 0px;
}

div#mainContent .annotation_honbun
	{
	width: 430px;
	float: left;
	margin: 0px;
	}
	
div#mainContent .annotation_txt
	{
	width: 250px;
	float: right;
	margin: 0px;
	border: 1px solid #666666;
	padding: 5px;
	}
div#mainContent .txt
	{
	font-family: "ＭＳ Ｐゴシック", Osaka, HiraKakuPro-W3;
	font-size: 0.75em;
	line-height: 150%;
	color: #CCCCCC;
	}


/* ベルの説明 */
div#mainContent .bell_box {
	overflow: hidden;
	position: relative;
	width: 720px;
	margin: 0px 0px 0px;
}

div#mainContent .bell_ph
	{
	width: 260px;
	float: right;
	margin: 0px;
	}
	
div#mainContent .bell_txt
	{
	width: 460px;
	float: left;
	margin: 0px;
	}
	
/* フィニッシュの説明 */
div#mainContent .finish_box {
	overflow: hidden;
	position: relative;
	width: 720px;
	margin: 0px 0px 20px;
}

div#mainContent .finish_ph
	{
	width: 160px;
	float: left;
	margin: 0px;
	}
	
div#mainContent .finish_txt
	{
	width: 560px;
	float: right;
	margin: 0px;
	}
	
	
/* 一覧 */
#select {
	margin:0px;
}
#select ul {
	padding: 0px;
}
#select li {
	list-style-type:square;
	list-style-position: inside;
}


div.imagebox {
	background-color: #000000;
	width: 160px;
	height:370px;
	float: left;
	margin: 0px 20px 15px 0px;
}

div.imagebox_trombone {
	background-color: #000000;
	width: 160px;
	height:450px;
	float: left;
	margin: 0px 20px 15px 0px;
}
div.imagebox_trombonetxt {
	background-color: #000000;
	width: 350px;
	height:430px;
	float: left;
	margin: 0px 20px 15px 15px;
}

p.image, p.caption {
	margin: 0px;
		}
p.caption {
	font-size: 0.75em;
	line-height: 160%;
	text-align:center;
		}

p.exp {
	clear: left;
		}
		
/* テーブル */

table.list{
	border-top:1px solid #FFFFFF;
	border-left:1px solid #FFFFFF;
	border-collapse:collapse;
	border-spacing:0;
	background-color:#000000;
	empty-cells:show;
	width: 720px;
	margin-bottom: 20px;
	color: #FFFFFF;
	font-size: 0.75em;
}
.list th{
    border-right:1px solid #FFFFFF;
    border-bottom:1px solid #FFFFFF;
    color:#FFFFFF;
    background-color:#444444;
    background-position:left top;
    padding:0.3em 1em;
	text-align: center;
}
.list td{
    border-right:1px solid #FFFFFF;
    border-bottom:1px solid #FFFFFF;
    padding:0.3em 1em;
	text-align: center;
}

.midashi {
	background-color: #8b8b8b;
}