/* === フィルタボタン ============================ */
.tfArea{
    display    : inline-block;
    position   : relative;
    vertical-align: middle;
}
.tfImg{
    display    : inline-block;
    width      : 13px;
    height     : 13px;
    background : #eee;
    border     : 1px solid #777;
    margin     : 0;
    padding    : 1px;
    cursor     : pointer;
}
/* === フィルタボタン（カーソルオーバー時）======= */
.tfImg:hover{
    background : #FFD700;
}
/* === フィルタボタン内の画像色（SVG）============ */
.tfImg path{
    fill       : #777;
}
/* === フィルタリスト ============================ */
.tfList{
    display    : inline-block;
    position   : absolute;
    max-width  : 250px;
    min-width  : 140px;
    background : #fff;
    border     : 1px solid #777;
    top        : 30px;
    left       : -80px;
    line-height: 1.1;
    font-weight: normal;
}
/* === フィルタリスト内のform ==================== */
.tfList form{
    max-height : 150px;           /* 縦幅 */
    overflow   : scroll;
    overflow   : overflow-y;
    overflow   : auto;
}
/* === フィルタリスト内のチェックボックス ======== */
.tfMeisai{
    text-align : left;
    padding    : 2px;
}
/* === フィルタリスト内の文字位置合わせ ========== */
.tfMeisai label{
    padding    : 0 10px 0 3px;
    color: #000;
}
/* === OK/CANCELボタン =========================== */
.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;
}
/* === フィルタ非表示 ============================ */
#filter_table tr[cmanfilternone]{
    display    : none;
}
/* === フィルタ非表示行と次行の間を二重線にする == */
#filter_table tr[cmanfilternone] + tr td{
    border-top : 3px double #777;
}
/* --- （参考）テーブル全体のスタイル指定 ------- */
#sampleTable {
    width          : 100%;
    border-collapse: collapse;         /* 境界線結合 */
    border-spacing : 0;                /* 罫線間余白 */
    font-size      : 9pt;              /* 文字サイズ */
}
/* --- ヘッダーのスタイル指定 ------------------- */
#sampleTable th {
    text-align    : center;            /* 文字位置   */
    font-weight   : bold;              /* 太文字     */
    padding       : 3px 5px;          /* 余白       */
    border        : 1px #666666 solid; /* 罫線       */
    background    : #99ccff;           /* 背景色     */
    white-space   : nowrap;
}
/* --- 明細のスタイル指定 ----------------------- */
#sampleTable td {
    text-align    : center;            /* 文字位置   */
    padding       : 3px 5px;           /* 余白       */
    border        : 1px #666666 solid; /* 罫線       */
    white-space   : nowrap;
}

.scroll-table {
    display: block;
    overflow: scroll;
    white-space: nowrap;
    max-height: 500px;
    min-height: 280px;
}

.scroll-table tr:first-child th {
    position: sticky;
    top: 0;
}

.scroll-table tr:nth-child(2) th {
    position: sticky;
    top: 22px;;
}
.scroll-table tr th:first-child {
    position: sticky;
    left: -1px;
    z-index: 9990;
}

.scroll-table tbody tr:nth-child(2) th {
    position: sticky;
    top: 22px;
    left: unset;
    z-index: 999;
}

.scroll-table tbody tr td:first-child {
    position: sticky;
    left: -1px;
}

.scroll-table-vertical {
    display: block;
    overflow-y: scroll;
    white-space: nowrap;
    max-height: 500px;
    min-height: 280px;
}

.scroll-table-vertical tr:first-child th {
    position: sticky;
    top: 0;
}

.scroll-table-vertical tr:nth-child(2) th {
    position: sticky;
    top: 22px;;
}

.scroll-table-vertical tbody tr:nth-child(2) th {
    position: sticky;
    top: 22px;
    left: unset;
    z-index: 999;
}

.scroll-table-side {
    display: block;
    overflow-x: scroll;
    white-space: nowrap;
}

.scroll-table-side tr th:first-child {
    position: sticky;
    left: -1px;
    z-index: 9990;
}

.scroll-table-side tbody tr td:first-child {
    position: sticky;
    left: -1px;
}