/* search */
#archive-search{ position:fixed; top:var(--marginTop); right:var(--marginLeft); z-index:110;
  /* width:calc(((100% - var(--marginLeft) * 2) - var(--column) * 11) / 12 * 2 + var(--column) * 1); */
  width:var(--col2)
}
  #archive-search #searchInput{ width:100%; }
  #archive-search #searchSubmit{ position:absolute; top:50%; right:10px; transform:translateY(-50%); z-index:10; cursor:pointer; font-size:0; }
  #archive-search #reset{ position:absolute; top:50%; left:-6px; transform:translate(-100%,-50%); font-size:0; cursor:pointer; display:none; }
/* search on */
body.onSearch{  }
  body.onSearch #archive-search{  }
    body.onSearch #archive-search #reset{ display:block; }

/* table */
.archive-table{  }
.archive-table,
.archive-table :is(tbody,thead){ display:block; font-size:0; width:100%; }
  .archive-table :is(tbody,thead) tr:not(.archive-detail-row){ padding:0 var(--marginLeft);
    /* display:grid; grid-template-columns: 2fr 5fr 1fr 1fr 1fr 2fr; gap:var(--column); */
    display:grid; grid-template-columns:repeat(12, 1fr); gap:var(--column);
  }
    .archive-table :is(tbody,thead) tr:not(.archive-detail-row) :is(th,td){ padding:7px 0 3px;
      font-size:1rem;
      line-height:1.1;
    }
    /* nth */
    .archive-table :is(tbody,thead) tr:not(.archive-detail-row) :is(th,td):nth-child(1){ grid-column:span 2; }
    .archive-table :is(tbody,thead) tr:not(.archive-detail-row) :is(th,td):nth-child(2){ grid-column:span 5; }
    .archive-table :is(tbody,thead) tr:not(.archive-detail-row) :is(th,td):nth-child(3){ grid-column:span 2; }
    .archive-table :is(tbody,thead) tr:not(.archive-detail-row) :is(th,td):nth-child(4){ grid-column:span 1;
      display:none;
    }
    .archive-table :is(tbody,thead) tr:not(.archive-detail-row) :is(th,td):nth-child(5){ grid-column:span 2; }
    .archive-table :is(tbody,thead) tr:not(.archive-detail-row) :is(th,td):nth-child(6){ grid-column:span 1; }
  /* thead */
  .archive-table thead{ padding-top:60px; border-bottom:1px solid var(--inklight); background-color:var(--white);
    position:sticky; top:0; z-index:20;
  }
    .archive-table thead th{ cursor:pointer; }
    /* active */
    .archive-table thead th.active:after{ content:''; display:inline-block; width:8px; height:8px; vertical-align:baseline; margin-left:4px;
      background-position:center;
      background-repeat:no-repeat;
      background-size:contain;
    }
    .archive-table thead th.active.desc:after{
      background-image:url('../img/btn_up.svg');
    }
    .archive-table thead th.active.asc:after{
      background-image:url('../img/btn_down.svg');
    }
  /* tbody */
  .archive-table tbody tr.archive-row{ border-bottom:1px solid var(--inklight); max-height:80px; overflow:hidden; }
  .archive-table tbody tr.archive-row:last-child{ border:none; }
    .archive-table tbody tr.archive-row td{  }
    /* specific */
    .archive-table tbody tr.archive-row td[data-key="title"]{ cursor:pointer; }
    .archive-table tbody tr.archive-row td[data-key="title"]:hover{ text-decoration:underline; }
    .archive-table tbody tr.archive-row[data-youtube]{  }
      .archive-table tbody tr.archive-row[data-youtube]:not([data-youtube=""]) td[data-key="title"]:after{ content:''; display:inline-block; width:8px; height:8px; margin-left:2px;
        background-position:center;
        background-repeat:no-repeat;
        background-size:contain;
        background-image:url('../img/arrow_topright.svg');
      }
  /* active */
  .archive-table tbody tr.archive-row.active{ border-width:0; border-color:transparent; }
  /* hidden */
  .archive-table tbody tr.archive-row.hidden{ border-bottom:none; max-height:0; }
  .archive-table tbody tr.archive-row.hidden + tr.archive-detail-row.open{ border:none; }
  .archive-table tbody tr.archive-row.hidden + tr.archive-detail-row.open .archive-detail{ padding:0; max-height:0; }
  /* detail */
  .archive-table tbody tr.archive-detail-row,
  .archive-table tbody tr.archive-detail-row td{ display:block; width:100%; }
    .archive-table tbody tr.archive-detail-row .archive-detail{ padding:0 var(--marginLeft);
      /* display:grid; grid-template-columns: 7fr 3fr 2fr; gap:var(--column); */
      display:grid; grid-template-columns:repeat(12, 1fr); gap:var(--column);
      overflow:hidden; max-height:0;
    }
      .archive-table tbody tr.archive-detail-row .archive-detail > div{ align-self:start; }
      /* nth */
      .archive-table tbody tr.archive-detail-row .archive-detail > :nth-child(1){ grid-column:span 7; }
      .archive-table tbody tr.archive-detail-row .archive-detail > :nth-child(2){ grid-column:span 3; }
      .archive-table tbody tr.archive-detail-row .archive-detail > :nth-child(3){ grid-column:span 2; }
      /* specific */
      .archive-table tbody tr.archive-detail-row .archive-detail > div.archive-swiper{ width:100%; }
        .archive-table tbody tr.archive-detail-row .archive-detail > div.archive-swiper .swiper-slide{ height:400px; width:auto !important; }
          .archive-table tbody tr.archive-detail-row .archive-detail > div.archive-swiper .swiper-slide img{  width:auto; height:100%; object-fit:cover; }
      .archive-table tbody tr.archive-detail-row .archive-detail > div.archive-description{  }
        .archive-table tbody tr.archive-detail-row .archive-detail > div.archive-description > p{
          line-height:1.56;
        }
        .archive-table tbody tr.archive-detail-row .archive-detail > div.archive-description > .archive-credits{ font-size:0; margin-top:22px;
          --titleWidth:120px;
        }
          .archive-table tbody tr.archive-detail-row .archive-detail > div.archive-description > .archive-credits :is(dt,dd){ display:inline-block; vertical-align:top; font-size:1rem; }
          .archive-table tbody tr.archive-detail-row .archive-detail > div.archive-description > .archive-credits dt{ width:var(--titleWidth); }
          .archive-table tbody tr.archive-detail-row .archive-detail > div.archive-description > .archive-credits dd{ width:calc(100% - var(--titleWidth)); }
      .archive-table tbody tr.archive-detail-row .archive-detail > .archive-links{  }
        .archive-table tbody tr.archive-detail-row .archive-detail > .archive-links > li{  }
          .archive-table tbody tr.archive-detail-row .archive-detail > .archive-links > li a{  }
            .archive-table tbody tr.archive-detail-row .archive-detail > .archive-links > li a img{ display:inline-block; margin-left:2px; }
  /* on */
  .archive-table tbody tr.archive-detail-row.open{ border-bottom:1px solid var(--inklight); }
    .archive-table tbody tr.archive-detail-row.open .archive-detail{ max-height:calc(400px + 16px + 48px); padding:16px var(--marginLeft) 48px; }

/* modal */
#concert-modal{ position:fixed; top:0; left:0; right:0; bottom:0; width:100%; height:100%; z-index:120; opacity:0; pointer-events:none;
  background-color:rgba(0,0,0,0.8);
  backdrop-filter:blur(var(--blur));
  -webkit-backdrop-filter:blur(var(--blur));
}
  #concert-modal .closeBtn{ top:48px; right:48px; z-index:20; cursor:pointer;
    filter:invert(1) brightness(10);
    -webkit-filter:invert(1) brightness(10);
  }
  #concert-modal > .concert-modal-inner{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:10;
    width:80%; max-width:1024px;
  }
    #concert-modal > .concert-modal-inner .concert-modal-content{ position:relative; padding-top:56.25%; }
      #concert-modal > .concert-modal-inner .concert-modal-content iframe{ position:absolute; top:0; left:0; right:0; bottom:0; width:100%; height:100%; }
/* open */
#concert-modal.open{ opacity:1; pointer-events:all; }