@charset "UTF-8";
/* CSS Document */
.section-news, .section-live, .section-bio, .section-disco {
  padding: 40px 24px 0;
}
.news-container, .live-container, .bio-container, .disco-container {
  text-align: left;
  margin: 40px 0;
}
.section-title, .section-title-live {
  font-size: 2.4rem;
}
.news-area {
  padding-bottom: 40px;
}
.info_URL {
  text-decoration: underline;
}
.live-headline h3, .news-headline {
  font-size: 1.8rem;
  padding: 8px 0;
  line-height: 2.4rem;
}
.main-area-time {
  font-size: 1.4rem;
}
.btn-box button {
  width: 100px;
  display: block;
  border: solid 1px #333333;
  background-color: #fff;
  color: #333;
  font-size: 1.2rem;
  line-height: 3.6rem;
  transition: .5s;
  user-select: none;
  cursor: pointer
}
.btn-box button:hover {
  opacity: 0.6;
}
.more {
  display: none;
  margin-top: 10px;
}
.more.panelactive {
  display: block;
}
/*タブ切り替え全体のスタイル*/
.tabs {
  width: 100%;
  margin: auto;
  flex-wrap: wrap;
  display: flex;
  justify-content: center;
}
/*タブのスタイル*/
.tab_class {
  width: 100px;
  margin-right: 5px;
  margin-top: 5px;
  background-color: #fff;
  color: #333;
  text-align: center;
  display: block;
  float: left;
  order: -1;
  font-size: 1.2rem;
  line-height: 3.8rem;
  border: solid 1px #333333;
}
.tab_class:last-of-type {
  margin-right: 0px;
}
.tab_class:hover {
  opacity: 0.75;
}
/*ラジオボタンを全て消す*/
input[name="tab_name"] {
  display: none;
}
/*タブ切り替えの中身のスタイル*/
.content_class {
  display: none;
  padding: 40px 0px;
  width: 100%
}
/*選択されているタブのコンテンツのみを表示*/
input:checked + .tab_class + .content_class {
  display: block;
}
.tab_content_description ul li {
  display: flex;
  padding-bottom: 20px;
}
.disco-detail {
  margin-left: 10px;
}
/*選択されているタブのスタイルを変える*/
.tabs input:checked + .tab_class {
  background-color: #5ab4bd;
  color: #fff;
}
.disco-jacket img {
  width: 100px;
}
time {
  font-size: 1.0rem;
}
.credit {
  font-size: 1.0rem;
  line-height: 1.2rem;
  padding:6px 0;
}
.small-text, .songlist {
  font-size: 1.2rem;
  line-height: 1.4rem;
}
.songlist {
  padding-top: 6px;
}
.disco-detail h3 {
  line-height: 1.8rem;
}
.subscription_icon {
    display: flex;
    justify-content: center;
  }
  .subscription_icon img {
    width: 20px;
    padding: 10px;
}
.content_class ul li {
  margin-bottom: 30px;
}
@media (min-width: 1280px) {
  .section-news, .section-live, .section-bio, .section-disco {
    position: relative;
    padding-bottom: 2rem;
    margin-top: 70px;
    box-sizing: border-box;
    padding: 0 4.25vw;
  }
  .news-container, .live-container, .bio-container, .disco-container {
    text-align: left;
    margin: 40px 0;
  }
  .section-title, .section-title-live {
    font-size: 2.4rem;
  }
  .news-headline {
    font-size: 2.4rem;
    padding: 10px 0;
  }
  .live-headline h3 {
    font-size: 1.8rem;
    padding: 8px 0;
  }
  .btn-box button {
    width: 120px;
  }
  .btn-box button:hover {
    opacity: 0.6;
  }
  .more {
    display: none;
  }
  .more.panelactive {
    display: block;
  }
  /*タブ切り替え全体のスタイル*/
  .tabs {
    width: 100%;
    margin: auto;
    flex-wrap: wrap;
    display: flex;
    justify-content: flex-start;
  }
  /*タブのスタイル*/
  .tab_class {
    width: 120px;
    margin-right: 5px;
    text-align: center;
    display: block;
    float: left;
    order: -1;
    font-size: 1.2rem;
    line-height: 3.8rem;
  }
  .tab_class:last-of-type {
    margin-right: 0px;
  }
  .tab_class:hover {
    opacity: 0.75;
  }
  /*ラジオボタンを全て消す*/
  input[name="tab_name"] {
    display: none;
  }
  /*タブ切り替えの中身のスタイル*/
  .content_class {
    display: none;
    padding: 40px 10px 0;
    width: 100%
  }
  /*選択されているタブのコンテンツのみを表示*/
  input:checked + .tab_class + .content_class {
    display: block;
  }
  .disco-detail {
    margin-left: 20px;
  }
  /*選択されているタブのスタイルを変える*/
  .tabs input:checked + .tab_class {
    background-color: #5ab4bd;
    color: #fff;
  }
  .disco-jacket img {
    width: 180px;
  }
  .credit {
  line-height: 1.4rem;
  padding:8px 0;
}
  .small-text {
    font-size: 1.2rem;
    line-height: 1.6rem;
  }

  .subscription_icon img {
    width: 30px;
    
  }
}