@charset "UTF-8";

#main {
   background-image: url(../introduction/img/bg-intro_sp.jpg);
}
#story .subnav {
   width: 95%;
   margin: 0 auto;
}
#story .subnav li  {
   width: 20%;
   border-right: solid 1px #909090;
   height: 30px;
}
#story .subnav li:nth-child(6),
#story .subnav li:nth-child(11) {
   border-left: solid 1px #909090;
}

#story .subnav li a{
   padding: 0;
   height: 30px;
   line-height: 30px;
}

.num_story {
   font-size: 0.7em;
}

.tag_story {
   font-family:  'Noto Serif JP','Playfair Display',"游明朝体", "Yu Mincho", YuMincho, serif;
   background-image: url(../music/img/bg_tag_op.svg);
   background-repeat: no-repeat;
   -webkit-background-size: 100%;
   background-size: 100%;
   width: 120px;
   height: 25px;
   line-height: 25px;
   text-align: center;
   margin-bottom: 10px;
   font-size: 0.8em;
}
#story .news_ttl {
   margin-bottom:15px;
}
.story_box {
   border-bottom: solid 1px #6b6b6b;
   padding-bottom: 20px;
   padding-top: 20px;
   margin-bottom: 30px;
}

.story_txt {
   padding: 10px 10px;
}


.bx-pager {
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
}
#story .bx-pager a {
   display: block;
   width: 31.3%;
}

.bx-pager a img {
   width: 100%;
}

.staff_txt {
   font-size: 0.7em;
   margin-bottom: 15px;
}

#story .bx-wrapper {
   margin: 0;
   padding-left: 0;
   margin-bottom: 10px;
}
#story .bx-wrapper .bx-viewport {
   left:0;
}



@media screen and (min-width:960px) {


   #story .subnav {
      width: 800px;
      margin-bottom: 30px;
   }
   #story .subnav li  {
      width: 15%;
      border-right: solid 1px #909090;
      height: 30px;
   }
   #story .subnav li:nth-child(7){
      border-left: solid 1px #909090;
   }
   #story .subnav li:nth-child(6),
   #story .subnav li:nth-child(11){
      border-left: none;
   }

   #story .subnav li a{
      padding: 0;
      height: 30px;
      line-height: 30px;
   }
   #story .cts_box h1.news_ttl {
      display: flex;
   }
   #main {
      background-image: url(../introduction/img/bg-intro.jpg);
      -webkit-background-size: cover;
      background-size: cover;
   }
   #story .cts_box h1.news_ttl .tag_story {
      background-repeat: no-repeat;
      -webkit-background-size: 100%;
      background-size: 100%;
      width:150px;
      height: 32px;
      line-height: 32px;
      text-align: center;
      margin-bottom: 0;
      font-size: 0.8em;
      margin-right: 10px;
      margin-top: 3px;
   }
   .h2_cts {
      width: 100%;
   }
   #main::before {
   background: none;
   }
   .story_ttl {
      font-size: 28px;
      margin-bottom: 40px;
   }
   #story .bx-pager a {
      display: block;
      width: 16%;
   }

}