@charset "UTF-8";



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




/*INDEX*/

/*INDEX PAGE------------------------------------*/

/*BUTTONS---------------------------------------*/

/*J-HITS TOP20 CHART----------------------------*/

/*マーキー冷蔵庫--------------------------------*/

/*CHARTBREAKER NEXTAGE--------------------------*/

/*J-HITS ENTRY----------------------------------*/










/*----------------------------------------------*/
/*INDEX PAGE*/
/*----------------------------------------------*/

/*main content*/
#top20 {
width:580px;
height:auto;
margin:0;
padding:0;
float:left;
}


/*2nd contents*/
#second-contents {
width:360px;
height:auto;
margin:0;
padding:0;
float:right;
}










/*----------------------------------------------*/
/*BUTTONS*/
/*----------------------------------------------*/

/*ENTRY BUTTON(BASE)*/
#btn-entry {
width:auto;
height:auto;
margin:0;
padding:0;
}
#btn-entry li {
text-align:center;
margin:0;
padding:0;
}
#btn-entry li a {
width:auto;
height:28px;
margin:0;
padding:7px 0;
display:block;
text-decoration:none;
text-indent:-9999px;
background:url(../../images/btn_entry_txt.png) no-repeat center;
}


/*PAGE BUTTON(BASE)*/
#btn-page {
width:auto;
height:auto;
margin:0 auto;
padding:0;
}
#btn-page li {
margin:0;
padding:0;
text-align:center;
}
#btn-page li a {
width:auto;
height:28px;
margin:0;
padding:7px 0;
display:block;
text-decoration:none;
text-indent:-9999px;
}


/*CHART PDF BUTTON(BASE)*/
#btn-chart {
width:auto;
height:auto;
margin:0;
}
/*(for CHART)*/
#btn-chart.for-pdf {
padding:12px;
}
#btn-chart li {
margin:0;
padding:0;
text-align:center;
}
#btn-chart li a {
width:auto;
height:42px;
margin:0;
padding:7px 0;
display:block;
text-decoration:none;
text-indent:-9999px;
}

/*CHART,ENTRY & PAGE*/
#btn-entry li,
#btn-page li a,
#btn-chart li {
border-radius:5px;
-webkit-border-radius:5px;
-moz-border-radius:5px;
-o-border-radius:5px;
-ms-border-radius:5px;
}
#btn-entry li:hover,
#btn-page a:hover,
#btn-chart a:hover {
opacity:0.7;
filter: alpha(opacity=70);
-ms-filter: "alpha( opacity=70 )";
}










/*----------------------------------------------*/
/*J-HITS TOP 20 CHART*/
/*----------------------------------------------*/

/*frame(COMMON)*/
#t20-chart {
width:auto;
height:auto;
margin:0;
padding:0;
background:#FFF;
border:1px solid #99CCCC;
}


/*title & date(COMMON)*/
#t20-chart.this-week hgroup,
#t20-chart.sp-yearly hgroup,
#t20-chart.sp-half hgroup {
width:auto;
height:auto;
margin:0;
padding:0;
position:relative;
}
/*********/
/*[title]*/
/*(COMMON)*/
#t20-chart.this-week hgroup h2,
#t20-chart.sp-yearly hgroup h2,
#t20-chart.sp-half hgroup h2 {
width:570px;
height:150px;
margin:0 auto;
padding:0;
text-indent:-9999px;
}
/*(for THIS WEEK)*/
#t20-chart.this-week hgroup h2 {
background:url(../../images/ttl_chart_tw.png) no-repeat top center;
}
/*(for YEARLY)*/
#t20-chart.sp-yearly hgroup h2 {
background:url(../../images/ttl_chart_yearly.png) no-repeat top center;
}
/*(for YEARLY)*/
#t20-chart.sp-half hgroup h2 {
background:url(../../images/ttl_chart_half.png) no-repeat top center;
}
/********/
/*[year]*/
#t20-chart.sp-yearly hgroup h3,
#t20-chart.sp-half hgroup h3 {
font-size:1.8em;
font-family:'din1451';
letter-spacing:.1em;
margin:0;
padding:0;
color:#CC3300;
position:absolute;
top:8px;
left:38px;
text-shadow:1px 1px 2px rgba(0,0,0,0.3);
}
/********/
/*[date]*/
/*(COMMON)*/
#t20-chart.this-week hgroup p.t20-date,
#t20-chart.sp-yearly hgroup p.t20-date,
#t20-chart.sp-half hgroup p.t20-date {
text-align:right;
font-size:1.0em;
letter-spacing:.1em;
color:#CC3300;
font-family:'din1451';
margin:0;
padding:0 3px 2px;
border-bottom:1px solid #99CCCC;
float:left;
position:absolute;
bottom:10px;
right:12px;
}


/*chart list(THIS WEEK & YEARLY,HALF)*/
ul#t20-chart-list {
width:auto;
height:auto;
margin:0;
padding:0;
}
ul#t20-chart-list li#t20cl {
width:auto;
height:auto;
margin:0;
padding:0;
border-bottom:1px dotted #99CCCC;
}
ul#t20-chart-list li#t20cl:last-child {
border-bottom:1px solid #99CCCC;
}
/*************/
/*[chart box]*/
ul#t20-chart-list li#t20cl dl.chart-box {
width:auto;
height:auto;
margin:0;
padding:0;
display:table;
}
/*[chart box-No]*/
ul#t20-chart-list li#t20cl dl.chart-box dt.cb-no {
width:45px;
height:auto;
margin:0;
padding:12px 0;
/*float:left;*/
text-align:center;
vertical-align:middle;
display:table-cell;
font-family:'din1451';
letter-spacing:.1em;
color:#00A0A3;
}
/*(only No1)*/
ul#t20-chart-list li#t20cl.big dl.chart-box dt.cb-no {
font-size:0;
width:5px;
}
/*(between 2nd and 10th)*/
ul#t20-chart-list li#t20cl.mid dl.chart-box dt.cb-no {
font-size:1.8em;
}
/*(between 11th and 20th)*/
ul#t20-chart-list li#t20cl.small dl.chart-box dt.cb-no {
font-size:1.4em;
}
/*[chart box-detail]*/
ul#t20-chart-list li#t20cl dl.chart-box dd.cb-detail {
width:409px;
height:auto;
/*margin-left:45px;*/
padding:12px 10px;
display:table-cell;
border-left:1px solid #99CCCC;
}
/*(only No1)*/
ul#t20-chart-list li#t20cl.big dl.chart-box dd.cb-detail {
width:449px;
border-left:1px solid #FFF;
}
/*[chart-box-buy]*/
ul#t20-chart-list li#t20cl dl.chart-box dd.cb-btn {
width:90px;
height:auto;
/*margin-left:45px;*/
padding:12px 0;
text-align:center;
vertical-align:middle;
display:table-cell;
}
/***************/
/*[photo image]*/
/*(COMMON)*/
ul#t20-chart-list li#t20cl figure.ci-song {
width:auto;
margin:0;
padding:0;
background:#FFF;
float:left;
}
ul#t20-chart-list li#t20cl figure.ci-song img {
height:auto;
margin:0;
padding:0;
vertical-align:bottom;
border:1px solid #E6E6E6;
}
/*(only No1)*/
ul#t20-chart-list li#t20cl.big figure.ci-song img {
max-width:150px;
}
/*(between 2nd and 10th)*/
ul#t20-chart-list li#t20cl.mid figure.ci-song img {
max-width:110px;
}
/**********/
/*[detail]*/
/*(only No1)*/
ul#t20-chart-list li#t20cl.big div.ci-list {
padding-left:162px;
}
/*(between 10th and 20th)*/
ul#t20-chart-list li#t20cl.mid div.ci-list {
padding-left:125px;
}
/********************/
/*[detail-song name]*/
/*(COMMON)*/
li#t20cl.big li.ci-song,
li#t20cl.mid li.ci-song,
li#t20cl.small li.ci-song {
font-weight:bold;
margin:0;
}
/*(only No1)*/
li#t20cl.big li.ci-song {
font-size:1.2em;
padding-top:0.4em;
}
/*(between 2nd and 10th)*/
li#t20cl.mid li.ci-song {
font-size:1.0em;
padding-top:0.4em;
}
/*(between 11th and 20th)*/
li#t20cl.small li.ci-song {
font-size:0.9em;
}
/**********************/
/*[detail-artist name]*/
/*(COMMON)*/
li#t20cl.big li.ci-artist,
li#t20cl.mid li.ci-artist,
li#t20cl.small li.ci-artist {
margin:0 0 .3em 0;
padding:0;
}
/*(only No1)*/
li#t20cl.big li.ci-artist {
font-size:1.1em;
}
/*(between 2nd and 10th)*/
li#t20cl.mid li.ci-artist {
font-size:1.0em;
}
/*(between 11th and 20th)*/
li#t20cl.small li.ci-artist {
font-size:0.8em;
}
/***************/
/*[detail-date]*/
/*(COMMON)*/
li#t20cl li.ci-date {
font-size:0.7em;
color:#00A0A3;
margin:0;
padding:0;
word-wrap:break-word;
}
li#t20cl li.ci-date span {
color:#CC3300;
}
/***********/
/*[btns]*/
dl.chart-box dd.cb-btn ul {
width:auto;
height:auto;
margin:0;
padding:0;
}
dl.chart-box dd.cb-btn ul li {
margin:0 0 3px 0;
padding:0;
text-align:center;
}
dl.chart-box dd.cb-btn ul li:last-child {
margin:0;
}
dl.chart-box dd.cb-btn ul li a {
width:90px;
height:25px;
margin:0;
padding:0;
text-indent:-9999px;
display:block;
overflow:hidden;
text-decoration:none;
}
dl.chart-box dd.cb-btn ul li.btn-buy a {
background:url(../../images/btn_buy.png) no-repeat center;
}
dl.chart-box dd.cb-btn ul li.btn-graph a {
background:url(../../images/btn_graph.png) no-repeat center;
}
dl.chart-box dd.cb-btn ul li a:hover {
opacity:0.7;
filter: alpha(opacity=70);
-ms-filter: "alpha( opacity=70 )";
}


/*chart pdf download*/
#btn-chart.for-pdf li a  {
background:url(../../images/btn_pdf_txt.png) no-repeat center;
}

/*PDF BUTTON (for CHART)*/
#btn-chart.for-pdf li {
background: #D51A00; /* Old browsers */
background: -moz-linear-gradient(top, #D51A00 0%, #AC1300 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #D51A00), color-stop(0.00, #AC1300)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #D51A00 0%, #AC1300 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #D51A00 0%, #AC1300 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #D51A00 0%, #AC1300 100%); /* IE10+ */
background: linear-gradient(to bottom, #D51A00 0%, #AC1300 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#D51A00', endColorstr='#AC1300', GradientType=0); /* IE7,8,9 */
}


/*CHART BANNER*/
ul#chart-banner {
width:auto;
height:auto;
margin:0 0 20px 0;
padding:0;
}
ul#chart-banner li {
margin:0;
padding:0;
}
ul#chart-banner li img {
margin:0;
padding:0;
vertical-align:bottom;
}
ul#chart-banner li a img:hover {
opacity:0.7;
filter: alpha(opacity=70);
-ms-filter: "alpha( opacity=70 )";
}













/*----------------------------------------------*/
/*マーキー冷蔵庫*/
/*----------------------------------------------*/

/*frame*/
#marke-fridge {
width:auto;
height:auto;
margin:0 0 20px 0;
padding:52px 0 0 0;
text-align:center;
background:#4EB2CA;
position:relative;
}
*:first-child+html #marke-fridge {
width:360px;
zoom:1;
}



/*title*/
#marke-fridge h3 {
width:100%;
height:105px;
margin:0;
padding:0;
text-indent:-9999px;
background:url(../../images/ttl_marke_fridge.png) no-repeat top center;
position:absolute;
top:10px;
z-index:100;
}
*:first-child+html #marke-fridge h3 {
width:360px;
left:0;
zoom:1;
}
#marke-fridge h4 {
display:none;
}
/*photo,text & link*/
#marke-fridge .mf-inner {
width:auto;
height:auto;
margin:0;
padding:16px;
text-align:left;
position:relative;
z-index:50;
}
/*********/
/*[photo]*/
#marke-fridge .mf-inner figure {
width:auto;
height:auto;
margin:0 0 1.2em 0;
padding:0;
text-align:center;
}
#marke-fridge .mf-inner figure img {
max-width:250px;
height:auto;
margin:0;
padding:0;
}
#marke-fridge .mf-inner figure a:hover img {
opacity:0.7;
filter: alpha(opacity=70);
-ms-filter: "alpha( opacity=70 )";
transform:rotate(3deg)
}
/********/
/*[text]*/
#marke-fridge .mf-inner p {
font-size:0.9em;
line-height:1.4em;
margin:0 0 .8em 0;
padding:0 10px;
word-break:break-all;
}
#marke-fridge .mf-inner p a {
color:#FF0;
text-decoration:underline;
}
#marke-fridge .mf-inner p a:hover {
text-decoration:none;
}


/*ENTRY BUTTON (for MARKE FRIDGE)*/
#btn-entry.for-fridge li {
background: #003567; /* Old browsers */
background: -moz-linear-gradient(top, #003567 0%, #00214A 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #003567), color-stop(0.00, #00214A)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #003567 0%, #00214A 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #003567 0%, #00214A 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #003567 0%, #00214A 100%); /* IE10+ */
background: linear-gradient(to bottom, #003567 0%, #00214A 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#003567', endColorstr='#00214A', GradientType=0); /* IE7,8,9 */
}










/*----------------------------------------------*/
/*CHARTBREAKER NEXTAGE*/
/*----------------------------------------------*/

/*frame*/
#chart-nextage {
width:auto;
height:auto;
margin:0 0 20px 0;
padding:0;
text-align:left;
background:#FF9900;
}

/*title*/
#chart-nextage h3 {
width:auto;
height:115px;
margin:0;
padding:0;
text-indent:-9999px;
background:#FFCC00 url(../../images/ttl_nextage.png) no-repeat top center;
}


/*artist photo*/
/**************/
/*[photo frame]*/
#chart-nextage figure {
width:auto;
height:auto;
margin:0;
padding:0;
text-align:center;
background:#FF9900;
}
/************/
/*[photo img]*/
#chart-nextage figure img {
max-width:250px;
height:auto;
margin:0;
padding:0;
vertical-align:bottom;
}


/*artist name & link*/
#chart-nextage .cn-inner1 {
width:auto;
height:auto;
margin:0;
padding:16px;
text-align:left;
background:#FFCC00;
}
/*********/
/*[catch]*/
#chart-nextage .cn-inner1 h4 {
font-size:1.0em;
font-weight:bold;
margin:0 0 .8em 0;
padding:0;
}
/********/
/*[link]*/
#chart-nextage .cn-inner1 #btn-page li a {
background:#FFF url(../../images/btn_nextage_txt.png) no-repeat center;
}


/*entry*/
#chart-nextage .cn-inner2 {
width:auto;
height:auto;
margin:0;
padding:16px;
text-align:left;
background:url(../../images/li_arrow_down.png) no-repeat top center;
}
/********/
/*[test]*/
#chart-nextage .cn-inner2 p {
font-size:0.9em;
line-height:1.4em;
margin:0 0 .8em 0;
padding:0;
}


/*ENTRY BUTTON (for CHARTBREAKER)*/
#btn-entry.for-next li {
background: #D51A00; /* Old browsers */
background: -moz-linear-gradient(top, #D51A00 0%, #AC1300 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #D51A00), color-stop(0.00, #AC1300)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #D51A00 0%, #AC1300 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #D51A00 0%, #AC1300 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #D51A00 0%, #AC1300 100%); /* IE10+ */
background: linear-gradient(to bottom, #D51A00 0%, #AC1300 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#D51A00', endColorstr='#AC1300', GradientType=0); /* IE7,8,9 */
}










/*----------------------------------------------*/
/*J-HITS ENTRY*/
/*----------------------------------------------*/

/*frame*/
#entry-no1 {
width:auto;
height:auto;
margin:0;
padding:10px;
text-align:left;
background:#FFD24D;
}

/*title*/
#entry-no1 h3 {
width:340px;
height:87px;
margin:0 auto;
padding:0;
text-indent:-9999px;
background:url(../../images/ttl_no1.png) no-repeat 0 0;
}

/*present*/
#entry-no1 .en-inner {
width:auto;
height:auto;
margin:0;
padding:8px 16px 16px;
text-align:left;
}

/*text*/
#entry-no1 p.no1-txt {
font-size:0.9em;
line-height:1.4em;
margin:0 0 1.2em 0;
padding:0;
}

/*present image*/
#entry-no1 figure.no1-pre {
width:250px;
text-align:center;
margin:0 auto 1.2em auto;
padding:5px;
background:#FFF;
}
#entry-no1 figure.no1-pre img {
max-width:250px;
height:auto;
margin:0;
padding:0;
vertical-align:bottom;
}

/*ENTRY BUTTON (for NO1)*/
#btn-entry.for-no1 li {
background: #00689A; /* Old browsers */
background: -moz-linear-gradient(top, #00689A 0%, #003651 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #00689A), color-stop(0.00, #003651)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #00689A 0%, #003651 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #00689A 0%, #003651 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #00689A 0%, #003651 100%); /* IE10+ */
background: linear-gradient(to bottom, #00689A 0%, #003651 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00689A', endColorstr='#003651', GradientType=0); /* IE7,8,9 */
}
