@charset "utf-8";
/* テーブル */

:root {
  /* 固定表ヘッダの先頭のオフセット */
  --fw-fixed-header-1-offset: calc(var(--fw-header-navi-height) - 1px);
  /* 2列名以降の変数は上書きする */
  --fw-fixed-header-2-offset: calc(var(--fw-fixed-header-1-offset) + 2rem);
  --fw-fixed-header-3-offset: calc(var(--fw-fixed-header-2-offset) + 2rem);
  --fw-fixed-header-4-offset: calc(var(--fw-fixed-header-3-offset) + 2rem);
  --fw-fixed-header-5-offset: calc(var(--fw-fixed-header-4-offset) + 2rem);
}

/* ------------------------------------------ */
/* 基本テーブル */
table.fw-basic-table-table {
  background-color: white;
}
.dark-mode table.fw-basic-table-table {
  background-color: var(--dark-mode-background-color);
}

table.fw-basic-table-table th,
table.fw-basic-table-table td {
  padding: 0.4rem;
  white-space: nowrap;

}

/* ------------------------------------------ */
/* ソートリンクアクティブ */
.fw-sort-link.fw-sort-selected{
  color: black;
}
.dark-mode .fw-sort-link.fw-sort-selected {
  color: inherit;
}

/* ------------------------------------------ */

/* 列の最大長 */
.fw-td-wrap.fw-td-long-contents {
  white-space: normal;
  word-break: break-all;
  display: block;
  width: 55rem;
}

/* ------------------------------------------ */
/* 固定ヘッダ */

@media screen {

  .fw-basic-table table.fw-basic-table-table .fw-fixed-header th,
  .fw-basic-table table.fw-basic-table-table .fw-fixed-header td {
    background: white;
    position: sticky;
    border-bottom: 2px solid #dee2e6;
    box-shadow: 0 0 0 1px #dee2e6;
    z-index: 1;
  }

  .dark-mode .fw-basic-table table.fw-basic-table-table .fw-fixed-header th,
  .dark-mode .fw-basic-table table.fw-basic-table-table .fw-fixed-header td{
    background-color: var(--dark-mode-background-color);
    border-bottom: inherit;
    box-shadow: inherit;
  }

  /* 固定ヘッダ1行目 */
  .fw-basic-table table.fw-basic-table-table .fw-fixed-header tr:nth-of-type(1) th,
  .fw-basic-table table.fw-basic-table-table .fw-fixed-header tr:nth-of-type(1) td {
    top: var(--fw-fixed-header-1-offset);
  }

  /* ヘッダ２行目以降 */
  .fw-basic-table table.fw-basic-table-table .fw-fixed-header tr:nth-of-type(2) th,
  .fw-basic-table table.fw-basic-table-table .fw-fixed-header tr:nth-of-type(2) td {
    top: var(--fw-fixed-header-2-offset);
  }
  .fw-basic-table table.fw-basic-table-table .fw-fixed-header tr:nth-of-type(3) th,
  .fw-basic-table table.fw-basic-table-table .fw-fixed-header tr:nth-of-type(3) td {
    top: var(--fw-fixed-header-3-offset);
  }
  .fw-basic-table table.fw-basic-table-table .fw-fixed-header tr:nth-of-type(4) th,
  .fw-basic-table table.fw-basic-table-table .fw-fixed-header tr:nth-of-type(4) td {
    top: var(--fw-fixed-header-4-offset);
  }
  .fw-basic-table table.fw-basic-table-table .fw-fixed-header tr:nth-of-type(5) th,
  .fw-basic-table table.fw-basic-table-table .fw-fixed-header tr:nth-of-type(5) td {
    top: var(--fw-fixed-header-5-offset);
  }

}

/* ------------------------------------------ */

/* スマホのテーブル変換 */
@media screen and (max-width: 575px) {

  table.fw-table-mobile .fw-td-wrap {
    max-width: 100vw;
  }

  table.fw-table-mobile .fw-td-wrap.fw-td-long-contents {
    width: auto;
  }

  table.fw-table-mobile thead {
    display: none;
  }

  table.fw-table-mobile tbody tr {
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: initial;
  }

  table.fw-table-mobile th,
  table.fw-table-mobile td {
    display: block;
    width: 100%;
    white-space: normal;
    word-break:break-all;
  }

  table.fw-table-mobile.fw-table-mobile-type1 th ,
  table.fw-table-mobile.fw-table-mobile-type1 td  {
    text-align: left;
  }

  table.fw-table-mobile.fw-table-mobile-type2 th,
  table.fw-table-mobile.fw-table-mobile-type2 td {
    text-align: right;
    display: flex;
    flex-direction: column;
  }

  table.fw-table-mobile th[aria-label]:not([aria-label=""]):before,
  table.fw-table-mobile td[aria-label]:not([aria-label=""]):before {
    color: #666;
    font-weight: bold;
    content: attr(aria-label) " : ";
    margin-right: 0.5rem;
  }

  table.fw-table-mobile.fw-table-mobile-type1 th[aria-label]:before,
  table.fw-table-mobile.fw-table-mobile-type1 td[aria-label]:before {
    display: block;
    float: none;
  }

  table.fw-table-mobile.fw-table-mobile-type2 th[aria-label]:before,
  table.fw-table-mobile.fw-table-mobile-type2 td[aria-label]:before {
    float: left;
  }

}