@charset "UTF-8";



/*----------------------------------------------*/
/*----------------------------------------------*/
/*S.A.I PM J-HITS TOP20 [COMMON]*/
/*----------------------------------------------*/
/*Created: 2013.10.10*/
/*Last Update:	2013.10.10*/
/*----------------------------------------------*/




/*INDEX*/

/*COMMON----------------------------------------*/

/*HEADER----------------------------------------*/

/*FOOTER----------------------------------------*/

/*SIZE,SCALE & COLOR----------------------------*/











/*----------------------------------------------*/
/*COMMON*/
/*----------------------------------------------*/

body {
margin:0;
padding:0;
background:#CCC url(../images/bg_dot_pt.png) repeat 0 0;
color:#222;
}


/* Clearfix */
.cf:before,
.cf:after {
content:"";
display:table;
}
.cf:after {
clear:both;
}
.cf {
zoom:1;
}


@font-face {
    font-family: 'din1451';
    src: url('../font/din1451alt.eot');
    src: url('../font/din1451alt.eot?#iefix') format('embedded-opentype'),
         url('../font/din1451alt.woff') format('woff'),
         url('../font/din1451alt.ttf') format('truetype'),
         url('../font/din1451alt.svg#alte_din_1451_mittelschriftRg') format('svg');
    font-weight: normal;
    font-style: normal;
}









/*----------------------------------------------*/
/*HEADER*/
/*----------------------------------------------*/

/*header*/
body#j20-main header {
	width:auto;
	height:auto;
	margin:0;
	padding:0;
	background:url(../images/bg_header.gif) repeat-x 0 0;
}
/*for J-HITS*/
body#j20-main header hgroup {
	width:960px;
	height:235px;
	margin:0 auto;
	padding:0;
	position:relative;
}
body#j20-main header hgroup h1 {
	width:540px;
	height:150px;
	margin:0;
	padding:0;
	text-indent:-9999px;
	background:url(../../images/ttl_main.png) no-repeat 0 0;
	position:absolute;
	left:35px;
	top:15px;
}
body#j20-main header hgroup h2 {
	width:280px;
	height:40px;
	margin:0;
	padding:0;
	text-indent:-9999px;
	background:url(../../images/txt_djname.png) no-repeat 0 0;
		position:absolute;
		left:405px;
		top:165px;
	}
body#j20-main header hgroup figure.h-marke {
	margin:0;
	padding:0;
		position:absolute;
		left:685px;
		top:0;
}
body#j20-main header hgroup figure.h-marke img {
	margin:0;
	padding:0;
	vertical-align:bottom;
}











/*----------------------------------------------*/
/*NAVIGATION*/
/*----------------------------------------------*/

/***********/
/*MAIN NAVI*/
/***********/

header nav.nav-main {
	width:auto;
	height:auto;
	margin:0;
	padding:0;
	text-align:left;
}
header nav.nav-main ul {
	width:940px;
	margin:0 auto;
	padding:0;
	position:relative;
}
header nav.nav-main ul li {
	float:left;
	margin-right:1.2em;
	padding:0;
	font-family:'din1451';
	/*font-size:0.9em;*/
	font-size:14px;
	line-height:36px;
	letter-spacing:.1em;
}
header nav.nav-main ul li a {
	width:auto;
	height:36px;
	margin:0;
	padding:7px 0 7px 40px;
	color:#FFF;
	display:block;
	overflow:hidden;
	text-decoration:none;
	background:url(../images/ic_arrow_navi.png) no-repeat left center;
}
/*for radiko*/
header nav.nav-main ul li.btn-radiko {
	font-size:0;
	line-height:none;
	margin:0;
	position:absolute;
	right:0;
	top:0;
}
header nav.nav-main ul li.btn-radiko a {
	width:42px;
	height:42px;
	margin:0;
	padding:4px 0;
	text-indent:-9999px;
	background:url(../images/btn_radiko.png) no-repeat 0 4px;
}
header nav.nav-main ul li a:hover {
	opacity:0.7;
filter: alpha(opacity=70);
-ms-filter: "alpha( opacity=70 )";
}

body#j20-main header nav.nav-main ul li.btn-top a,
body#j20-nextage header nav.nav-main ul li.btn-nextage a {
	color:#FF0;
}



/************/
/*UNDER NAVI*/
/************/

footer hgroup {
	width:960px;
	height:auto;
	margin:0 auto;
	padding:0;
}

/*LOGO*/
footer hgroup figure {
	margin:0;
	padding:0;
	float:left;
	}

footer nav.nav-under {
	width:auto;
	height:auto;
	margin:0;
	padding:20px 0 0 0;
	text-align:left;
	float:right;
}
footer nav.nav-under ul {
	width:auto;
	margin:auto;
	padding:0;
	border-left:1px solid #FFF;
}
footer nav.nav-under ul li {
	float:left;
	margin:0;
	padding:0;
	font-family:'din1451';
	font-size:0.75em;
	line-height:1.5em;
	letter-spacing:.1em;
	border-right:1px solid #FFF;
}
footer nav.nav-under ul li a {
	width:auto;
	height:auto;
	margin:0;
	padding:0 12px;
	color:#FFF;
	text-decoration:none;
}
footer nav.nav-under ul li a:hover {
	text-decoration:underline;
}

body#j20-main footer nav.nav-under ul li.ulink-top a,
body#j20-nextage footer nav.nav-under ul li.ulink-nextage a {
	color:#FF0;
}











/*----------------------------------------------*/
/*FOOTER*/
/*----------------------------------------------*/

footer {
	width:auto;
	height:auto;
	margin:0;
	padding:20px 0;
	background:#111;
}

/*copyright*/
footer p {
	width:960px;
	height:60px;
	margin:0 auto;
	padding:0;
	text-indent:-9999px;
	background:url(../images/lg_copyright.png) no-repeat right top;
	position:relative;
}
footer p small {
	width:360px;
	height:40px;
	margin:0;
	padding:0;
	position:absolute;
	right:0;
	top:0;
}

/*PAGE TOP BTN*/
ul.fNavi {
width:auto;
height:auto;
margin:0;
padding:0;
list-style:none;
position: fixed;
bottom: 195px;
right: 20px;
z-index:9998;
}
ul.fNavi li {
margin:0;
padding:0;
}
ul.fNavi li.fb-ptop {
font-size:0.8em;
}
ul.fNavi li.fb-ptop a {
background: #111;
text-decoration: none;
color: #fff;
width: 80px;
padding: 20px 0;
text-align: center;
display: block;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border:2px solid #FFF;
box-shadow:0px 0px 5px #FFF;
}
ul.fNavi li.fb-ptop a:hover {
text-decoration: none;
background: #666;
}










/*----------------------------------------------*/
/*CONTENT*/
/*----------------------------------------------*/

/*content frame*/
#content {
	width:960px;
	height:auto;
	margin:0 auto;
	padding:30px 0;
}










/*----------------------------------------------*/
/*SNS*/
/*----------------------------------------------*/

/*BTN BOX*/
.social {
width:auto;
position:absolute;
top:183px;
left:40px;
display:inline-block;
height:30px;
overflow:hidden;
text-align:left;
vertical-align:bottom;
}
.twitter {
float:left;
width:105px;
height:30px;
overflow:hidden;
}
.facebook {
float:left;
width:115px;
height:25px;
line-height:20px;
overflow:hidden;
}
.googleplus {
float:left;
width:80px;
height:25px;
line-height:20px;
overflow:hidden;
}










/*----------------------------------------------*/
/*SIZE,SCALE & COLOR*/
/*----------------------------------------------*/

/*----------------------------------------------*/
/*[TEXT]*/

.text10 {font-size:77%;}
.text11 {font-size:85%;}
.text12 {font-size:93%;}
.text13 {font-size:100%;}
.text14 {font-size:108%;}
.text15 {font-size:116%;}
.text16 {font-size:123.1%;}
.text17 {font-size:131%;}
.text18 {font-size:138.5%;}
.text19 {font-size:146.5%;}
.text20 {font-size:153.9%;}
.text21 {font-size:161.6%;}
.text22 {font-size:167%;}
.text23 {font-size:174%;}
.text24 {font-size:182%;}
.text25 {font-size:189%;}
.text26 {font-size:197%;}





/*----------------------------------------------*/
/*[MARGIN]*/

/*margin top*/
.mgt5 {margin-top:5px;}
.mgt7 {margin-top:7px;}
.mgt10 {margin-top:10px;}
.mgt12 {margin-top:12px;}
.mgt15 {margin-top:15px;}
.mgt18 {margin-top:18px;}
.mgt20 {margin-top:20px;}
.mgt25 {margin-top:25px;}
.mgt30 {margin-top:30px;}
.mgt35 {margin-top:35px;}

/*margin bottom*/
.mgb5 {margin-bottom:5px;}
.mgb7 {margin-bottom:7px;}
.mgb10 {margin-bottom:10px;}
.mgb12 {margin-bottom:12px;}
.mgb15 {margin-bottom:15px;}
.mgb18 {margin-bottom:18px;}
.mgb20 {margin-bottom:20px;}
.mgb25 {margin-bottom:25px;}
.mgb30 {margin-bottom:30px;}
.mgb35 {margin-bottom:35px;}





/*----------------------------------------------*/
/*[PADDING]*/

/*margin top*/
.pdt10 {padding-top:10px;}
.pdt12 {padding-top:12px;}
.pdt15 {padding-top:15px;}
.pdt18 {padding-top:18px;}

/*margin bottom*/
.pdb10 {padding-bottom:10px;}
.pdb12 {padding-bottom:12px;}
.pdb15 {padding-bottom:15px;}
.pdb18 {padding-bottom:18px;}