@charset "utf-8";


/*============================
 MUSIC
============================*/
.music #contents #main{
	background:url(../../images/music/bg-text.gif) no-repeat;
}



/*  list-area
-----------------------------*/

.music #list-area{
	margin-top:30px;
}

.music #list-area .music-box{
	float:left;
	width:213px;
	height:290px;
	border-bottom:1px solid #CCC;
	border-right:1px solid #ccc;
	position:relative;
}
.music #list-area .music-box:hover{
	box-shadow:0px 0px 6px #777;
}
.music #list-area .music-box dt{
	background:url(../../images/music/headphone.gif) no-repeat;
	padding-left:25px;
	font-size:117%;
	border-bottom:1px solid #CCC;
	margin:30px 15px 20px 15px;
	padding-bottom:5px;
	color:#196baa;
}
.music #list-area .music-box dt span{
	display:inline-block;
	margin-top:6px;
	margin-left:1px;
	font-size:74%;
	color:#000000;
}

.music #list-area .music-box dd{
	margin:0px 15px 0px 15px;
	line-height:1.5;
}
.music #list-area .music-box dd .text{
	position:relative;
	z-index:10;
}
.music #list-area .music-box dd .info{
	position:absolute;
	left:0px;
	bottom:25px;
	width:100%;
	z-index:2;
}
.music #list-area .music-box dd .info object{
	outline:none;
}

.music #list-area .music-box dd .info ul{
	float:right;
	margin-top:5px;
	margin-right:15px;
}
.music #list-area .music-box dd .info ul li{
	float:left;
	margin-left:10px;
}



.music #list-area .music-box #tooltip{
	min-width:150px;
	z-index:300;
}


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

 -- media query --

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

@media only screen and
(max-width : 900px) {
	.music #list-area{
		width:100%;
		margin-bottom:20px;
	}
	.music #list-area .music-box{
		clear:both;
		float:none;
		margin:0 auto;
		padding-top:30px;
		border-left:1px solid #ccc;
	}
	.music #list-area .music-box dt{
		margin:0px 15px 20px 15px;
	}
}
