.accb-ph-table-wrap {
    overflow-x: auto;
    margin: 0 0 40px 0;
}

.accb-ph-table {
    /* width: 100%; */
    /* min-width: 800px;  */
    /* sum of the fixed column widths below; scroll horizontally rather than crush columns */
    table-layout: fixed; /* without this, columns auto-size to content and end up wildly uneven */
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
    display: table;
    border-collapse: collapse;
}

.accb-ph-row {
    display: table-row;
    background: #f6f6f6;
}
.accb-ph-row:nth-of-type(odd) {
    background: #e9e9e9;
}
.accb-ph-row.accb-ph-header {
    font-weight: bold;
    color: #ffffff;
    background: #2c3e50;
}

.accb-ph-cell {
    box-sizing: border-box;
    padding: 6px 8px;
    display: table-cell;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
}

/* Fixed per-column widths, in the same left-to-right order as the columns in template.php:
   投稿ID / DB行ID / メール / 名 / 姓 / 会員ID / レベルID / レベル名 / 支払い内容 / 取引日 /
   取引ID / サブスクリプションID / 参照番号 / 金額 / 決済方法 / ステータス / サブスク状態 /
   IP / ボタンID / 本番テスト / 割引額 / カスタムデータ */
.accb-ph-row > .accb-ph-cell:nth-child(1)  { width: 200px; }
.accb-ph-row > .accb-ph-cell:nth-child(2)  { width: 350px; }
.accb-ph-row > .accb-ph-cell:nth-child(3)  { width: 150px; }
.accb-ph-row > .accb-ph-cell:nth-child(4)  { width: 150px; }
/* .accb-ph-row > .accb-ph-cell:nth-child(5)  { width: 90px; }
.accb-ph-row > .accb-ph-cell:nth-child(6)  { width: 80px; }
.accb-ph-row > .accb-ph-cell:nth-child(7)  { width: 90px; }
.accb-ph-row > .accb-ph-cell:nth-child(8)  { width: 150px; }
.accb-ph-row > .accb-ph-cell:nth-child(9)  { width: 220px; }
.accb-ph-row > .accb-ph-cell:nth-child(10) { width: 100px; }
.accb-ph-row > .accb-ph-cell:nth-child(11) { width: 220px; }
.accb-ph-row > .accb-ph-cell:nth-child(12) { width: 180px; }
.accb-ph-row > .accb-ph-cell:nth-child(13) { width: 110px; }
.accb-ph-row > .accb-ph-cell:nth-child(14) { width: 100px; }
.accb-ph-row > .accb-ph-cell:nth-child(15) { width: 100px; }
.accb-ph-row > .accb-ph-cell:nth-child(16) { width: 90px; }
.accb-ph-row > .accb-ph-cell:nth-child(17) { width: 130px; }
.accb-ph-row > .accb-ph-cell:nth-child(18) { width: 120px; }
.accb-ph-row > .accb-ph-cell:nth-child(19) { width: 90px; }
.accb-ph-row > .accb-ph-cell:nth-child(20) { width: 80px; }
.accb-ph-row > .accb-ph-cell:nth-child(21) { width: 100px; }
.accb-ph-row > .accb-ph-cell:nth-child(22) { width: 280px; white-space: normal; word-break: break-all; } */

.accb-ph-error {
    padding: 10px;
    background: #fdecea;
    color: #611a15;
    border: 1px solid #f5c6cb;
}

@media screen and (max-width: 580px) {
    .accb-ph-table {
        display: block;
        min-width: 0;
        table-layout: auto;
    }
    .accb-ph-row {
        padding: 8px 0;
        display: block;
    }
    .accb-ph-cell {
        padding: 2px 12px;
        display: block;
        /* width: auto !important; */
        white-space: normal;
        overflow: visible;
        text-overflow: clip;
    }
}