@charset "UTF-8";
/* ==============================================
   ACF Timetable Style（番組表）
   ----------------------------------------------
   ・曜日タブ＋今日のハイライト
   ・現在時刻中の番組行をハイライト
   ============================================== */
.acf-timetable {
  max-width: 960px;
  margin: 0 auto;
  font-family: "Noto Sans JP", sans-serif;
  color: #222;
  /* ------------------------------
     日付切り替えタブナビゲーション
     ------------------------------ */
  /* ------------------------------
     日付見出し（例：9月28日(日)）
     ------------------------------ */
  /* ------------------------------
     番組リスト全体
     ------------------------------ */
  /* ------------------------------
     各番組行
     ------------------------------ */ }
  .acf-timetable__nav {
    display: flex;
    overflow-x: auto;
    gap: 0.25rem;
    border-bottom: 3px solid #eee;
    margin-bottom: 1.5rem; }
    .acf-timetable__nav button {
      flex: 1;
      min-width: 120px;
      background: #fff;
      color: #222;
      border: none;
      border-bottom: 3px solid transparent;
      font-weight: 600;
      padding: 1.5rem 0.4rem;
      cursor: pointer;
      transition: all 0.2s ease; }
      .acf-timetable__nav button.active {
        background: #f72585;
        color: #fff;
        border-bottom-color: #f72585; }
      .acf-timetable__nav button.today {
        position: relative;
        color: #f72585;
        font-weight: 700;
        background: rgba(247, 37, 133, 0.05);
        border-bottom: 3px solid #f72585; }
        .acf-timetable__nav button.today::after {
          content: "TODAY";
          position: absolute;
          right: 6px;
          top: 5px;
          font-size: 0.65rem;
          font-weight: 700;
          color: #f72585; }
        .acf-timetable__nav button.today.active {
          background: #f72585;
          color: #fff; }
          .acf-timetable__nav button.today.active::after {
            color: #fff; }
      @media (max-width: 768px) {
        .acf-timetable__nav button {
          font-size: 0.85rem;
          min-width: 100px; } }
  .acf-timetable h3 {
    background: #f72585;
    color: #fff;
    font-size: 1.2rem;
    padding: 0.75rem 1rem;
    margin: 2rem 0 1rem;
    border-radius: 4px; }
  .acf-timetable ul {
    list-style: none;
    margin: 0;
    padding: 0;
    border-top: 1px solid #ddd; }
  .acf-timetable li {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    border-bottom: 1px solid #eee;
    padding: 1rem 0.5rem;
    line-height: 1.5;
    /* -------------------------
       番組メイン情報部分
       ------------------------- */
    /* 番組タイトル＋ラベル */
    /* -------------------------
       サブ番組（下の段）
       ------------------------- */
    /* --- 現在放送中 --- */
    /* --- スマホ時 --- */ }
    .acf-timetable li .time {
      width: 110px;
      flex-shrink: 0;
      font-weight: 700;
      color: #444; }
    .acf-timetable li .program-main {
      flex: 1;
      display: flex;
      flex-direction: column; }
    .acf-timetable li .program-header {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 0.4rem;
      margin-bottom: 0.4rem;
      /* --- ラベル群（例：J-WAVE、生放送など） --- */ }
      .acf-timetable li .program-header .program-title {
        font-weight: 600;
        color: #000;
        text-decoration: none;
        transition: 0.2s; }
        .acf-timetable li .program-header .program-title:hover {
          color: #f72585; }
        .acf-timetable li .program-header .program-title.no-link {
          color: #666;
          cursor: default;
          text-decoration: none;
          pointer-events: none; }
      .acf-timetable li .program-header .program-labels {
        display: inline-flex;
        gap: 0.3rem;
        margin-left: 0.5rem;
        vertical-align: middle; }
        .acf-timetable li .program-header .program-labels .label-item {
          display: inline-block;
          font-size: 0.75rem;
          font-weight: 700;
          padding: 0.15rem 0.45rem;
          border-radius: 3px;
          color: #fff;
          line-height: 1;
          text-transform: uppercase;
          background: #999;
          transition: background 0.3s ease; }
          .acf-timetable li .program-header .program-labels .label-item.jwave {
            background: #7e7e7e; }
          .acf-timetable li .program-header .program-labels .label-item.live {
            background: #e60033; }
          .acf-timetable li .program-header .program-labels .label-item.rebroadcast {
            background: #999; }
          .acf-timetable li .program-header .program-labels .label-item.recording {
            background: #2e3192; }
          .acf-timetable li .program-header .program-labels .label-item.special {
            background: #ff6b00; }
          .acf-timetable li .program-header .program-labels .label-item.guest {
            background: #1ca9e3; }
          .acf-timetable li .program-header .program-labels .label-item.local {
            background: #008a00; }
          .acf-timetable li .program-header .program-labels .label-item.network {
            background: #6c43a0; }
    .acf-timetable li .note {
      padding: 0.5rem 0 1rem; }
    .acf-timetable li .sub-programs {
      margin-top: 0.2rem;
      padding-left: 0.8rem;
      border-left: 2px solid #eee; }
      .acf-timetable li .sub-programs .sub-program {
        margin-bottom: 0.4rem; }
        .acf-timetable li .sub-programs .sub-program .sub-top {
          display: flex;
          align-items: baseline;
          gap: 0.4rem;
          font-size: 0.9rem;
          color: #444; }
        .acf-timetable li .sub-programs .sub-program .sub-time {
          color: #666;
          font-weight: 600;
          min-width: 70px; }
        .acf-timetable li .sub-programs .sub-program .sub-title {
          font-weight: 500; }
        .acf-timetable li .sub-programs .sub-program .sub-note {
          font-size: 0.85rem;
          color: #777;
          margin-left: 1.5rem;
          margin-top: 0.2rem;
          line-height: 1.4; }
    .acf-timetable li.now {
      background: #ffe7f1;
      border-left: 4px solid #f72585; }
    @media (max-width: 768px) {
      .acf-timetable li {
        flex-direction: column;
        gap: 0.3rem; }
        .acf-timetable li .time {
          width: auto; }
        .acf-timetable li .sub-programs {
          padding-left: 0.8rem;
          margin-top: 0.3rem; } }