body{
   margin: 0;
   padding: 0;
   line-height: 1.4;
   font-family: 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 
                'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
   }
   
   a:link{
   cursor: pointer;
   cursor: hand;
   }


.sp_none{
display: none;
}


.clear{
clear: both;
}


.center{
text-align: center;
}


.sp_center{
text-align: center;
}


.left{
text-align: left;
}


.red{
color: #C7161D;
}


.box_900{
}


#hum{
display: block;
position: absolute;
top: 5vw;
right: 5vw;
width: 40px;
}


   #hum img{
   width:100%;
   }


#waku{
width: 100%;
overflow: hidden;
position: relative;
}


#bgswitcher{
width: 100%;
height: 100vw;
background-position:center center;
background-size: cover;
align-items: center;
justify-content: center;
}


#header{
width: 50%;
margin-left: 5vw;
padding-top: 5vw;
position: relative;
}


   #header img{
   width: 100%;
   }
   
   
   #headersearch_box,#headersearch_btn{
   display: none;
   }


#navi{
position: fixed;
top: -110vw;
width: 100%;
background-color: #C7161D;
z-index: 1000;
overflow-y: hidden;
transition: all 0.2s ease-in-out;
}


   #navi ul{
   width: 96%;
   padding:  8vw 2% 0 2%;
   margin: 0 auto;
   }
   
   
   #navi ul li{
   list-style-type: none;
   text-align: center;
   border-bottom: solid 1px #FFF;
   }
   
   
   #navi ul li a{
   display: block;
   padding: 5vw 0;
   color: #FFF;
   text-decoration: none;
   font-size: 6vw;
   }
   
   
   #navi_close{
   text-align: center;
   color: #FFF;
   font-size: 10vw;
   display: block;
   padding: 5vw 0 8vw 0;
   }


.top_select_h{
font-size: 5.8vw;
margin: 5px 0;
}


.top_select_h_small{
font-size: 3vw;
}


#top_select{
width: 100%;
margin: 0 auto;
color: #FFF;
text-align: center;
padding-top: 10vw;
}


   #top_select ul{
   margin: 0;
   padding: 8vw 0;
   letter-spacing: 0em;
   }
   
   
   #top_select ul li{
   width: 29vw;
   height: 29vw;
   list-style-type: none;
   display: inline-block;
   letter-spacing: 0em;
   margin: 0 1vw;
   border: solid 1px #FFF;
   vertical-align: top;
   }
   
   
   #top_select ul li a{
   text-decoration: none;
   }
   
   
   .topbox_h1{
   color: #FFF;
   font-size: 2.6vw;
   margin-top: 10vw;
   }
   
   
   .topbox_h2{
   color: #FFF;
   font-size: 5vw;
   }
   
   #top_select ul li img{
   width: 100%;
   }


.top_h1{
font-size: 4vw;
text-align: center;
}


.top_h2{
font-size: 10vw;
text-align: center;
margin-bottom: 10vw;
}

.top_h3{
width: 100%;
background-color: #C7161D;
color: #FFF;
font-size: 5vw;
text-align: center;
padding-top: 2vw;
padding-bottom: 2vw;
}


.more{
width: 50%;
margin: 15vw auto 5vw auto;
border: solid 1px #000;
text-align: center;
background-color: #FFF;
}


   .more a{
   font-size: 5vw;
   display: block;
   padding-top: 2vw;
   padding-bottom: 2vw;
   text-decoration: none;
   color: #000;
   }
   
   
   .ranking_more{
   margin-top: 20vw;
   margin-bottom: 20vw;
   width: 70%;
   background-color: #FFF;
   }


#search{
width: 100%;
margin: 0 auto;
padding: 15vw 0;
position: relative;
}


   #topseach{
   width: 90%;
   margin: 10vw auto;
   }
   
   
   #topsearch_box{
   width: 78%;
   height: 10vw;
   font-size: 4vw;
   }
   
   
   #topsearch_btn{
   width: 18%;
   height: 10vw;
   float: right;
   border: solid 1px #000;
   background-color: #C8C9CA;
   font-size: 4vw;
   }
   
   
   .search_result_h{
   width: 96%;
   margin: 8vw auto;
   padding: 5vw 2%;
   border-top: solid 1px #000;
   border-bottom: solid 1px #000;
   font-size: 4vw;
   }
   
   
   .searchtop_btn{
   position: absolute;
   border: solid 1px #000;
   top: 70px;
   right: 30px;
   }
   
   
   .searchtop_btn a{
   padding: 10px 20px;
   display: block;
   text-decoration: none;
   color: #000;
   }
   
   
   #search_name{
   background-color: #C8C9CA;
   padding: 3vw 0;
   border: 0;
   }
   
   
   .search_list{
   padding: 0;
   letter-spacing: -1em;
   width: 100%;
   margin: 0 auto;
   padding: 5vw 0;
   border-bottom: solid 1px #000;
   font-size: 5vw;
   }
   
   
   .search_list li{
   list-style-type: none;
   display: inline-block;
   letter-spacing: 0em;
   padding: 0 1%;
   vertical-align: top;
   }
   
   
   .search_list li:nth-child(1){
   width: 45%;
   padding: 0 2%;
   }
   
   
   .search_list li:nth-child(2){
   width: 45%;
   padding: 0 2%;
   }
   
   
   .search_list li:nth-child(3){
   display: none;
   }
   
   
   .search_list li:nth-child(4){
   display: none;
   }
   
   
   .search_list li:nth-child(5){
   display: none;
   }
   
   
   .search_list li:nth-child(6){
   display: none;
   }
   
   
   #simple_search{
   width: 100%;
   margin-bottom: 20vw;
   }
   
   
   #simple_search_box{
   width: 90%;
   height: 10vw;
   font-size: 4vw;
   margin: 10vw 0;
   padding: 2vw;
   }
   
   
   #simple_search_btn{
   width: 20%;
   height: 10vw;
   border: solid 1px #000;
   background-color: #C8C9CA;
   font-size: 5vw;
   margin: 0 auto 8vw auto;
   text-align: center;
   }
   
   
   .search_h{
   display: block;
   background-color: #C8C9CA;
   color: #FFF;
   font-size: 7vw;
   text-align: center;
   padding: 2vw 0;
   }
   
   
   #manual_search{
   width: 100%;
   margin-bottom: 20vw;
   }
   
   
   .manual_search_list{
   width: 96%;
   margin: 5vw 2%;
   display: inline-block;
   text-align: left;
   }
   
   
   .search_coment{
   font-size: 4vw;
   text-align: left;
   display: inline-block;
   padding: 0 5%;
   }
   
   
   .manual_search_genre{
   width: 96%;
   margin: 5vw 2%;
   display: inline-block;
   text-align: left;
   }
   
   
   #ranking_radio_sp{
   width: 90%;
   padding: 2vw;
   margin: 0 2% 5vw 8%;
   font-size: 4vw;
   }
   
   
   .search_box{
   width: 90%;
   padding: 2vw;
   margin: 0 2% 5vw 8%;
   display: inline-block;
   font-size: 4vw;
   }
   
   
   .search_radio{
   width: 70%;
   display: inline-block;
   vertical-align: top;
   }
   
   
   .search_radio div{
   width: 20%;
   display: inline-block;
   margin: 5px 0;
   }
   
   
   #manual_search_btn{
   width: 20%;
   height: 10vw;
   border: solid 1px #000;
   background-color: #C8C9CA;
   font-size: 5vw;
   margin: 0 auto 8vw auto;
   text-align: center;
   }


#ranking{
width: 100%;
margin: 0 auto;
padding: 20vw 0;
}


   #ranking_box{
   background-color: #EEEEEF;
   }
   
   
   #topranking_period{
   width: 95%;
   margin: 5vw auto;
   font-size: 4vw;
   text-align: right;
   }
   
   
   #topranking_name{
   background-color: #C8C9CA;
   padding: 3vw 0;
   border: 0;
   }
   
   
   .topranking_list{
   padding: 0;
   letter-spacing: -1em;
   width: 100%;
   margin: 0 auto;
   padding: 6vw 0;
   vertical-align: middle;
   border-bottom: solid 1px #000;
   background-color: #FFF;
   font-size: 4.2vw;
   }
   
   
   .topranking_list li{
   list-style-type: none;
   display: inline-block;
   letter-spacing: 0em;
   position: relative;
   padding: 0 2%;
   vertical-align: middle;
   }
   
   
   .topranking_list img{
   width: 10vw;
   position: absolute;
   top: -5vw;
   left: 2vw;
   }
   
   
   .topranking_list li:nth-child(1){
   width: 9%;
   text-align: center;
   }
   
   
   .topranking_list li:nth-child(2){
   display: none;
   }
   
   
   .topranking_list li:nth-child(3){
   width: 39%;
   }
   
   
   .topranking_list li:nth-child(4){
   width: 39%;
   }
   
   
   .topranking_list li:nth-child(5){
   display: none;
   }
   
   .topranking_list a{
   padding: 10px 20px;
   display: block;
   text-decoration: none;
   color: #000;
   }
	
   
   .rank_up{
   color: #C7161D;
   }
   
   
   .rank_down{
   color: #003FBC;
   }
   
   
   .ranking_monthno{
   margin: 9vw 0;
   text-align: center;
   font-size: 9vw;
   }
   
   
   #weeklyranking{
   width: 95%;
   margin: 0 auto;
   text-align: left;
   padding-left: 5%;
   }
   
   
   #monthlyranking{
   width: 95%;
   margin: 0 auto;
   background-color: 1D5CAE;
   text-align: left;
   padding-left: 5%;
   }
   
   
   #anisonranking{
   width: 95%;
   margin: 0 auto;
   background-color: E2007F;
   text-align: left;
   padding-left: 5%;
   }
   
   
   .ranking_detail{
   width: 95%;
   margin: 7vw auto;
   padding-left: 5%;
   }
   
   
   .pastranking_box{
   width: 98%;
   text-align: center;
   margin: 15vw 1%;
   }
   
   
   .pastranking_year{
   width: 100%;
   margin: 0 auto;
   padding: 8vw 0;
   background-color: #C8C9CA;
   border-top: solid 1px #000;
   border-left: solid 1px #000;
   border-right: solid 1px #000;
   font-size: 6vw;
   }
   
   
   .pastranking_year_sp{
   margin: 0;
   padding: 0;
   letter-spacing: -1em;
   }
   
   
   .pastranking_year_sp li{
   list-style-type: none;
   display: inline-block;
   letter-spacing: 0em;
   width: 32.5%;
   padding: 4vw 0;
   background-color: #C8C9CA;
   text-align: center;
   }
   
   
   .pastranking_year_sp li:first-child{
   border-top: solid 1px #000;
   border-left: solid 1px #000;
   border-right: solid 1px #C8C9CA;
   color: #C8C9CA;
   }
   
   
   .pastranking_year_sp li:nth-child(2){
   border-top: solid 1px #000;
   vertical-align: top;
   color: #000;
   }
   
   
   .pastranking_year_sp li:last-child{
   border-top: solid 1px #000;
   border-left: solid 1px #C8C9CA;
   border-right: solid 1px #000;
   color: #C8C9CA;
   }
   
   
   .pastranking_month{
   margin: 0;
   padding: 0;
   width: 100%;
   letter-spacing: -1em;
   }
   
   
   .pastranking_month li{
   list-style-type: none;
   display: inline-block;
   letter-spacing: 0em;
   width: 32.5%;
   height: 15vw;
   border-right: solid 1px #000;
   border-bottom: solid 1px #000;
   line-height: 15vw;
   text-align: center;
   }
   
   
   .pastranking_month li:first-child,
   .pastranking_month li:nth-child(4),
   .pastranking_month li:nth-child(7),
   .pastranking_month li:nth-child(10){
   border-left: solid 1px #000;
   }
   
   
   .pastranking_month li a{
   margin: 0;
   display: block;
   text-decoration: none;
   color: #000;
   }
   
   #ranking_navi_sp{
   width: 60%;
   margin: 0 auto 8vw auto;
   padding: 2vw;
   font-size: 4vw;
   }

   .ranking_navi_sp_sel {
   width: 60%;
   margin: 0 auto 8vw auto;
   padding: 2vw;
   font-size: 4vw;
   }
   
   
   #monthlyranking_box,
   #anisonranking_box{
   display: none;
   }


#newsongs{
width: 100%;
margin: 0 auto;
padding: 20vw 0;
}


   #initial{
   padding: 0;
   letter-spacing: -1em;
   width: 100%;
   margin: 8vw 0 5vw 1%;
   }
   
   
   #initial li{
   list-style-type: none;
   float: left;
   letter-spacing: 0em;
   width: 14.5%;
   border: solid 1px #000;
   text-align: center;
   margin-right: 1.4%;
   margin-bottom: 2vw;
   text-align: left;
   }
   
   
   #initial:after{
   content: "";
   clear: both;
   height: 0;
   display: block;
   visibility: hidden;
   }
   
   
   #initial li a{
   text-decoration: none;
   color: #000;
   padding: 2vw 0;
   display: block;
   text-align: center;
   }
   
   
   .topnewsongs_month{
   text-align: center;
   margin: 3vw 0;
   font-size: 10vw;
   }
   
   
   #topnewsongs_name{
   background-color: #C8C9CA;
   padding: 3vw 0;
   border: 0;
   }
   
   
   .topnewsongs_list{
   padding: 0;
   letter-spacing: -1em;
   width: 100%;
   margin: 0 auto;
   padding: 6vw 0;
   border-bottom: solid 1px #000;
   font-size: 4.2vw;
   }
   
   
   .topnewsongs_list li{
   list-style-type: none;
   display: inline-block;
   letter-spacing: 0em;
   vertical-align: top;
   }
   
   
      .topnewsongs_list li a{
      color: #000;
      text-decoration: none;
      }
   
   
   .topnewsongs_list li:nth-child(1){
   width: 46%;
   font-feature-settings: "pkna";
   padding: 0 2% 0 3%
   }
   
   
   .topnewsongs_list li:nth-child(2){
   width: 45%;
   font-feature-settings: "pkna";
   padding: 0 2% 0 2%
   }
   
   
   .topnewsongs_list li:nth-child(3){
   display: none;
   }
   
   
   .topnewsongs_list li:nth-child(4){
   display: none;
   }
   
   
   .topnewsongs_list li:nth-child(5){
   display: none;
   }
   
   
   #newsongs_h{
   width: 95%;
   margin: 0 auto;
   text-align: left;
   padding-left: 5%;
   }
   
   
   #genre{
   padding: 0;
   letter-spacing: -1em;
   width: 100%;
   margin: 8vw 0 0 1%;
   }
   
   
   #genre li{
   width: 14.5%;
   text-align: center;
   list-style-type: none;
   display: inline-block;
   letter-spacing: 0em;
   border: solid 1px #000;
   padding: 2vw 0;
   margin-right: 1.4%;
   }
   
   
   #genre li a{
   text-decoration: none;
   color: #000;
   display: block;
   }
   
   
   #prevnext_box{
   font-size: 4vw;
   text-align: center;
   margin: 10vw 0;
   }
   
   
   #prevnext_box a{
   text-decoration: none;
   color: #000;
   }
   
   
   .prevnext{
   
   margin: 0 4vw;
   display: inline-block;
   }
   
   
   .prevnext a{
   border: solid 1px #000;
   padding: 4vw 4vw;
   display: inline-block;
   text-decoration: none;
   color: #000;
   }
   
   
   #sp_foot_navi{
   margin: 30vw 0 0 0;
   padding: 0;
   letter-spacing: -1em;
   width: 100%;
   border-top: solid 1px #C8C9CA;
   background-color: #E5E5E5;
   }
   
   
   #sp_foot_navi li{
   list-style-type: none;
   display: inline-block;
   letter-spacing: 0em;
   height: 12vw;
   width: 49.5%;
   position: relative;
   }
   
   
   #sp_foot_navi li:first-child{
   border-right: solid 1px #C8C9CA;
   border-bottom: solid 1px #C8C9CA;
   }
   
   
   #sp_foot_navi li:nth-child(2){
   border-bottom: solid 1px #C8C9CA;
   }
   
   
   #sp_foot_navi li:nth-child(3){
   border-right: solid 1px #C8C9CA;
   }
   
   
   #sp_foot_navi li a{
   display: block;
   padding: 3vw 1px 3vw 2%;
   text-decoration: none;
   color: #000;
   font-size: 3.5vw;
   }
   
   
   #sp_foot_navi li img{
   width: 12%;
   margin: 0 3vw;
   }
   
   
   #sp_foot_navi li span{
   position: absolute;
   top: 3.8vw;
   }
   
   
#database_box{
margin: 8vw 0 30vw 0;
width: 100%;
}


   .database_list{
   margin: 0;
   padding: 0;
   font-size: 4.2vw;
   }
   
   
   .database_list li{
   list-style-type: none;
   border-bottom: solid 1px #000;
   padding: 4vw 0;
   }
   
   
   .database_left{
   width: 34%;
   padding: 0 3%;
   display: inline-block;
   vertical-align: top;
   }
   
   
   .database_right{
   width: 50%;
   padding: 0 3%;
   display: inline-block;
   vertical-align: top;
   }


#footer{
width: 100%;
padding-top: 2vw;
padding-bottom: 10vw;
background-color: #C7161D;
color: #FFF;
}


   .site{
   width: 75%;
   margin: 5vw auto;
   border: solid 1px #FFF;
   }
   
   
   .site a{
   padding-top: 2vw;
   padding-bottom: 2vw;
   font-size: 3.5vw;
   display: block;
   text-decoration: none;
   color: #FFF;
   }
   
   
   .copy{
   font-size: 2.2vw;
   }
   
   
#topback{
position: fixed;
bottom: 50vw;
right: 5vw;
z-index: 500;
}


   #topback img{
   width: 12vw;
   }

   .search_artist_list{
   padding: 0;
   letter-spacing: -1em;
   width: 100%;
   margin: 0 auto;
   padding: 5vw 0;
   border-bottom: solid 1px #000;
   font-size: 5vw;
   }
   
   
   .search_artist_list li{
   list-style-type: none;
   display: inline-block;
   letter-spacing: 0em;
   padding: 0 1%;
   vertical-align: top;
   }
  
   .search_artist_list li:nth-child(1){
   width: 55%;
   font-size: 4vw !important;
   }
   
   
   .search_artist_list li:nth-child(2){
   width: 40%;
   }

   .more2{
   width: 100%;
   margin: 0px auto;
   border: solid 1px #000;
   text-align: center;
   background-color: #FFF;
   }


   .more2 a{
   font-size: 2.5vw;
   display: block;
   padding-top: 5px;
   padding-bottom: 5px;
   text-decoration: none;
   color: #000;
   }
   
   .more2 a:hover{
   background-color: #C8C9CA;
   }
