@charset "utf-8";
/* CSS Document */

/* =========================
   フィルタ（ドロップパネル）
   ========================= */
/* 左寄せを安定させる（※下の .tfList 定義より後勝ちにして left:0 を固定） */
.tfList { left: 0 !important; }

/* === フィルタボタン ============================ */
.tfArea{
  display    : inline-block;
  position   : relative;
}
.tfImg{
  display    : inline-block;
  width      : 8px;
  height     : 8px;
  background : #eee;
  border     : 1px solid #777;
  margin     : 0px 3px;
  padding    : 3px;
  cursor     : pointer;
}
.tfImg:hover{
  background : #FFD700;
}
.tfImg path{
  fill       : #777;
}
/* === フィルタリスト ============================ */
.tfList{
  display    : inline-block;
  position   : absolute;
  max-width  : 250px;
  min-width  : 140px;
  background : #fff;
  border     : 1px solid #777;
  top        : 20px;
  left       : 0;              /* ← 以前の -4vw をやめて 0 に固定 */
  line-height: 1.1;
  font-weight: normal;
  z-index    : 20;
}
.tfList form{
  max-height : 250px;
  overflow   : auto;
}
.tfMeisai{
  text-align : left;
  padding    : 2px;
}
.tfMeisai label{
  padding    : 0 10px 0 3px;
}
.tfBtnArea{
  text-align : center;
  font-size  : 8pt;
  padding    : 3px 5px;
}
.tfBtnArea input{
  display    : inline-block;
  margin     : 0 5px;
}
.tfInStr{
  padding    : 5px 3px;
  border-top : 1px solid #999;
  border-bottom: 1px solid #999;
}
.tfInStr input{
  box-sizing : border-box;
  width      : 100%;
  padding    : 1px 3px;
  font-weight: normal;
  font-size  : 95%;
  border     : 1px solid #ccc;
}

/* =========================
   共通テーブル（1～4）設定
   ========================= */
#listTable, #listTable2, #listTable3, #listTable4 {
  width: 100%;
  max-width: none;                 /* A案：固定最大幅を撤廃 */
  border-collapse: collapse;
  border-spacing : 1;
  font-size      : 1rem;         /* ※必要なら 1rem に揃えてもOK */
  table-layout   : auto;           /* A案：内容ベースの列幅 */
  min-height     : 5vh;            /* 既存を尊重 */
}

/* 見出し */
#listTable th, #listTable2 th, #listTable3 th, #listTable4 th {
  font-size    : 0.9rem;
  text-align   : center;
  font-weight  : bold;
  padding      : 3px 5px;
  border       : 1px #555555 solid;
  background   : #B2CEA5;
  white-space  : nowrap;           /* ヘッダーは折り返さない */
}

/* 明細 */
#listTable td, #listTable2 td, #listTable3 td, #listTable4 td {
  text-align    : center;
  padding       : 5px 5px;
  border        : 1px #666666 solid;
  overflow-wrap : break-word;
  background    : #fff;            /* sticky背景のため明示 */
}

/* 以前の 8列目の固定幅は撤廃（A案に合わせる） */
#listTable tr td:nth-child(8),
#listTable2 tr td:nth-child(8),
#listTable3 tr td:nth-child(8),
#listTable4 tr td:nth-child(8) {
  width: auto !important;
  word-break: break-all;           /* URL等の強制改行は維持 */
}

/* フィルタで非表示にする行 */
#listTable  tr[cmanFilterNone],
#listTable2 tr[cmanFilterNone],
#listTable3 tr[cmanFilterNone],
#listTable4 tr[cmanFilterNone]{
  display: none;
}
/* 非表示行の次行の罫線を二重線に */
#listTable  tr[cmanFilterNone] + tr td,
#listTable2 tr[cmanFilterNone] + tr td,
#listTable3 tr[cmanFilterNone] + tr td,
#listTable4 tr[cmanFilterNone] + tr td{
  border-top : 3px double #777;
}

/* 長文になりがちな列は折り返し許可（必要に応じて調整） */
#listTable  td:nth-child(5),
#listTable  td:nth-child(9),
#listTable  td:nth-child(13),
#listTable  td:nth-child(14),
#listTable2 td:nth-child(5),
#listTable2 td:nth-child(9),
#listTable2 td:nth-child(13),
#listTable2 td:nth-child(14),
#listTable3 td:nth-child(5),
#listTable3 td:nth-child(9),
#listTable3 td:nth-child(13),
#listTable3 td:nth-child(14),
#listTable4 td:nth-child(5),
#listTable4 td:nth-child(9),
#listTable4 td:nth-child(13),
#listTable4 td:nth-child(14) {
  white-space: normal;
  overflow-wrap: anywhere;
}

/* URLは強制改行を許可（はみ出し防止） */
#listTable  td:nth-child(13) a,
#listTable2 td:nth-child(13) a,
#listTable3 td:nth-child(13) a,
#listTable4 td:nth-child(13) a {
  word-break: break-all;
}

/* =========================
   横スクロール＋先頭列/ヘッダー固定
   ========================= */
/* 横スクロール枠（子ページで <div class="table-scroll"> でラップ） */
.table-scroll {
  position: relative;
  overflow-x: auto;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
  border: 1px solid #e0e0e0; /* 任意 */
}

/* 先頭行（見出し）固定：最初の行の th を sticky に */
.table-scroll table tr:first-child th {
 /* position: sticky;*/
  top: 0;
  z-index: 3;                  /* 先頭列より前面 */
  background: #B2CEA5;
}

/* 先頭列固定（th/td 共通） */
.table-scroll table tr > :first-child {
 /* position: sticky;*/
  left: 0;
  z-index: 2;
  background: #fff;            /* 行背景に合わせる */
  border-right: 1px solid #666;
}

/* 見出しかつ先頭列（左上セル）は最前面に 
.table-scroll table tr:first-child > :first-child {
  z-index: 4;
  background: #B2CEA5;
}*/
.filter-reset-area {
  text-align: left;
  margin-bottom: 10px;
}
.filter-reset-area button {
  background: #f0f0f0;
  border: 1px solid #999;
  border-radius: 4px;
  padding: 5px 10px;
  cursor: pointer;
  font-size: 0.9rem;
}
.filter-reset-area button:hover {
  background: #ffffcc;
}
/* スマホでスクロールできるヒント（任意） */
@media (max-width: 768px) {
  .table-scroll {
    background:
      linear-gradient(to right, rgba(247,248,249,1), rgba(247,248,249,0)) 0 0/24px 100% no-repeat,
      linear-gradient(to left,  rgba(247,248,249,1), rgba(247,248,249,0)) 100% 0/24px 100% no-repeat;
  }
}