@charset "EUC-JP";
@import'common.css';
@import'/common/css/special.css';

/* Base 
------------------------------------------ */
div#karaoke {
	width: 715px;
}
div#karaoke h1,h2,h3,h4,ul,li {
	margin: 0;
	padding: 0;
}
div#karaoke h2 {
	margin: 0 0 10px 0;
}
div#karaoke h3 {
	margin: 20px 0 10px 2px;
}
div#karaoke .clear {
	clear: both;
}
div#karaoke .clearfix {
	zoom: 100%;
}
div#karaoke .clearfix:after {
	display:block;
	clear:both;
	height: 0;
	visibility:hidden;
	content:"";
}
div#karaoke .floatR {
	float: right;
}
div#karaoke .floatL {
	float: left;
}

/* other
------------------------------------------ */
div#karaoke .note {
	color: #4d4d4d;
	font-size: 92.4%;
	margin: 3px 0 0 0;
}
div#karaoke .bnr {
	margin: 5px 35px 0;
}
div#karaoke .pagetop {
	background: url(../../../../r_img/base/footer_bg_pagetop.gif) no-repeat 0 5px;
	display: inline;
	float: right;
	padding: 0 0 0 10px;
	clear: both;
}

/* navi
------------------------------------------ */
div#karaoke #navi {
	width: 715px;
	padding: 15px 0 10px;
	position: relative;
}
div#karaoke #navi li {
	list-style: none;
	float: left;
}
div#karaoke #navi:after {
	content: "";
	display: block;
	clear: both;
	height: 0;
	overflow: hidden;
}	
div#karaoke #navi li a {
	background: url(../img02/parts.gif) no-repeat 0 0;
	display: block;
	overflow: hidden;
	text-indent: -9999px;
	height: 30px;
}
div#karaoke #navi #top a {
	background-position: left top;
	width: 119px;
	height: 30px;
}
div#karaoke #navi #top a:hover {
	background-position: left -59px;
}
div#karaoke #navi #latest a {
	background-position: -119px top;
	width: 119px;
}
div#karaoke #navi #latest a:hover {
	background-position: -119px -59px;
}
div#karaoke #navi #latest .up {
	position: absolute;
	top: 19px;
	left: 200px;
}
div#karaoke #navi #k-pop a {
	background-position: -238px top;
	width: 119px;
}
div#karaoke #navi #k-pop a:hover {
	background-position: -238px -59px;
}
div#karaoke #navi #k-pop .up {
	position: absolute;
	top: 19px;
	left: 320px;
}
div#karaoke #navi #k-pop .new {
	position: absolute;
	top: 19px;
	left: 320px;
}
div#karaoke #navi #idol a {
	background-position: -357px top;
	width: 119px;
}
div#karaoke #navi #idol a:hover {
	background-position: -357px -59px;
}
div#karaoke #navi #idol .up {
	position: absolute;
	top: 19px;
	left: 455px;
}
div#karaoke #navi #ranking a {
	background-position: -476px top;
	width: 119px;
}
div#karaoke #navi #ranking a:hover {
	background-position: -476px -59px;
}
div#karaoke #navi #ranking .up {
	position: absolute;
	top: 19px;
	left: 570px;
}
div#karaoke #navi #anime a {
	background-position: -595px top;
	width: 120px;
}
div#karaoke #navi #anime a:hover {
	background-position: -595px -59px;
}
div#karaoke #navi #anime .up {
	position: absolute;
	top: 19px;
	left: 690px;
}
div#karaoke #navi #enka a {
	background-position: left -30px;
	width: 119px;
	height: 29px;
}
div#karaoke #navi #enka a:hover {
	background-position: left -89px;
}
div#karaoke #navi #enka .up {
	position: absolute;
	top: 48px;
	left: 95px;
}
div#karaoke #navi #drama a {
	background-position: -119px -30px;
	width: 119px;
	height: 29px;
}
div#karaoke #navi #drama a:hover {
	background-position: -119px -89px;
}
div#karaoke #navi #drama .up {
	position: absolute;
	top: 48px;
	left: 215px;
}
div#karaoke #navi #sta01 a {
	background-position: -238px -30px;
	width: 119px;
	height: 29px;
}
div#karaoke #navi #sta01 a:hover {
	background-position: -238px -89px;
}
div#karaoke #navi #sta01 .up {
	position: absolute;
	top: 48px;
	left: 320px;
}
div#karaoke #navi #sta02 a {
	background-position: -357px -30px;
	width: 119px;
	height: 29px;
}
div#karaoke #navi #sta02 a:hover {
	background-position: -357px -89px;
}
div#karaoke #navi #sta02 .up {
	position: absolute;
	top: 48px;
	left: 440px;
}
div#karaoke #navi #sta03 a {
	background-position: -476px -30px;
	width: 119px;
	height: 29px;
}
div#karaoke #navi #sta03 a:hover {
	background-position: -476px -89px;
}
div#karaoke #navi #sta03 .up {
	position: absolute;
	top: 48px;
	left: 560px;
}
div#karaoke #navi #sta04 a {
	background-position: -595px -30px;
	width: 120px;
	height: 29px;
}
div#karaoke #navi #sta04 a:hover {
	background-position: -595px -89px;
}
div#karaoke #navi #sta04 .up {
	position: absolute;
	top: 48px;
	left: 680px;
}

/* btn
------------------------------------------ */
div#karaoke #btn {
	width: 705px;
	margin: 5px;
	clear: both;
}

/* main
------------------------------------------ */
div#karaoke #main {
	width: 705px;
	padding: 10px 5px;
	clear: both;
}

/* pack
------------------------------------------ */
div#karaoke #main #pack {
	width: 202px;
	float: left;
	margin: 0 17px 0 5px;
}
div#karaoke #main #pack li {
	list-style: none;
	margin: 0 0 2px 0;
}

div#karaoke #main #pack li a {
	background: url(../img02/parts.gif) no-repeat 0 0;
	display: block;
	overflow: hidden;
	text-indent: -9999px;
	height: 50px;
}
div#karaoke #main #pack #latest a {
	background-position: left -120px;
	width: 202px;
}
div#karaoke #main #pack #latest a:hover {
	background-position: left -220px;
}
div#karaoke #main #pack #k-pop a {
	background-position: -1010px -120px;
	width: 202px;
}
div#karaoke #main #pack #k-pop a:hover {
	background-position: -1010px -220px;
}
div#karaoke #main #pack #idol a {
	background-position: -808px -170px;
	width: 202px;
}
div#karaoke #main #pack #idol a:hover {
	background-position: -808px -270px;
}
div#karaoke #main #pack #ranking a {
	background-position: -202px -120px;
	width: 202px;
}
div#karaoke #main #pack #ranking a:hover {
	background-position: -202px -220px;
}
div#karaoke #main #pack #enka a {
	background-position: -404px -120px;
	width: 202px;
}
div#karaoke #main #pack #enka a:hover {
	background-position: -404px -220px;
}
div#karaoke #main #pack #anime a {
	background-position: -606px -120px;
	width: 202px;
}
div#karaoke #main #pack #anime a:hover {
	background-position: -606px -220px;
}
div#karaoke #main #pack #drama a {
	background-position: -808px -120px;
	width: 202px;
}
div#karaoke #main #pack #drama a:hover {
	background-position: -808px -220px;
}
div#karaoke #main #pack #st01 a {
	background-position: left -170px;
	width: 202px;
}
div#karaoke #main #pack #st01 a:hover {
	background-position: left -270px;
}
div#karaoke #main #pack #st02 a {
	background-position: -202px -170px;
	width: 202px;
}
div#karaoke #main #pack #st02 a:hover {
	background-position: -202px -270px;
}
div#karaoke #main #pack #st03 a {
	background-position: -404px -170px;
	width: 202px;
}
div#karaoke #main #pack #st03 a:hover {
	background-position: -404px -270px;
}
div#karaoke #main #pack #st04 a {
	background-position: -606px -170px;
	width: 202px;
}
div#karaoke #main #pack #st04 a:hover {
	background-position: -606px -270px;
}

/* monthly
------------------------------------------ */
div#karaoke #main #monthly {
	width: 473px;
	float: left;
}
div#karaoke #main #monthly .btm {
	margin: 0 0 2px 0;
}
div#karaoke #main #monthly #latest {
	width: 473px;
}
div#karaoke #main #monthly #latest:after {
	content: "";
	display: block;
	clear: both;
	height: 0;
	overflow: hidden;
}
div#karaoke #main #monthly #latest #new {
	width: 230px;
	float: left;
}
div#karaoke #main #monthly #latest #enka {
	width: 230px;
	float: right;
}
div#karaoke #main #monthly #latest ul {
	list-style: none;
	margin: 0 0 2px 2px;
}
div#karaoke #main #monthly #latest .btn {
	margin: 10px 0 0 0;
	text-align: right;
}
div#karaoke #main #monthly #push {
	width: 473px;
	margin: 20px 0 0 0;
	clear: both;
}
div#karaoke #main #monthly #push .sam {
	width: 112px;
	float: left;
}
div#karaoke #main #monthly #push .sum {
	width: 350px;
	float: right;
}
div#karaoke #main #monthly #push .btn {
	float: right;
	margin: 10px 0 0 0;
}

/* 9pack
------------------------------------------ */
div#karaoke #intro {
	width: 695px;
	padding: 20px 10px;
	clear: both;
}
div#karaoke #intro ul {
	list-style: none;
	padding: 10px;
	font-size: 92.4%;
}
div#karaoke #intro .more {
	float: right;
	padding: 0 8px;
	background: url(../../../../r_img/base/bg_arrow.gif) no-repeat 0 5px;
	display: block;
}
div#karaoke #intro .packL {
	width: 345px;
	background: url(../img02/pack_bg.gif) repeat-y;
	float: left;
	margin: 5px 0 0 0;
}
div#karaoke #intro .packR {
	width: 345px;
	background: url(../img02/pack_bg.gif) repeat-y;
	float: right;
	margin: 5px 0 0 0;
}
div#karaoke #intro .space {
	float: right;
	margin: 5px -1px 0 0;
}
/* first
------------------------------------------ */
div#karaoke #beginner {
	width: 695px;
	padding: 20px 10px;
	clear: both;
}
div#karaoke #beginner li {
	list-style: none;
	float: left;
}