CSS table-row:after провести линию

Подскажите, как можно применить after к table-row в этом коде:

HTML:

<div class="table">
    <div class="table-row line">
        <div class="table-cell">Поле 1</div>
        <div class="table-cell">Поле 2</div>
        <div class="table-cell">Поле 3</div>
        <div class="table-cell">Поле 4</div>
    </div>
    <div class="table-row line">
        <div class="table-cell">Поле 1</div>
        <div class="table-cell">Поле 2</div>
        <div class="table-cell">Поле 3</div>
        <div class="table-cell">Поле 4</div>
    </div>
    <div class="table-row line">
        <div class="table-cell">Поле 1</div>
        <div class="table-cell">Поле 2</div>
        <div class="table-cell">Поле 3</div>
        <div class="table-cell">Поле 4</div>
    </div>
</div>

CSS:

.table {
    display: table;
    width: 100%;
}
.table-row {
    display: table-row;
}
.table-cell {
    display: table-cell;
    padding: 10px 0
}
.line:after {
    content: "";
    display: block;
    height: 1px;
    background: #000;
}