cssでoverflow: auto;をあてた横スクロールするtableの右側に余白をつける方法

table::after {
  position: absolute;
  content: '';
  display: block;
  top: 0;
  left: 100%;
  height: 1px;
  width: 30px;
  background-color: transparent;
}

<div class="table-wrap">
  <table>
    <thead>
      <tr>
        <th>1列目タイトル1列目タイトル1列目タイトル</th>
        <th>2列目タイトル2列目タイトル2列目タイトル</th>
        <th>3列目タイトル3列目タイトル3列目タイトル</th>
        <th>4列目タイトル4列目タイトル4列目タイトル</th>
        <th>5列目タイトル5列目タイトル5列目タイトル</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <th>1行目タイトル1行目タイトル1行目タイトル</th>
        <td>テキストテキストテキストテキストテキスト</td>
        <td>テキストテキストテキストテキストテキスト</td>
        <td>テキストテキストテキストテキストテキスト</td>
        <td>テキストテキストテキストテキストテキスト</td>
      </tr>
      <tr>
        <th>2行目タイトル2行目タイトル2行目タイトル</th>
        <td>テキストテキストテキストテキストテキスト</td>
        <td>テキストテキストテキストテキストテキスト</td>
        <td>テキストテキストテキストテキストテキスト</td>
        <td>テキストテキストテキストテキストテキスト</td>
      </tr>
      <tr>
        <th>3行目タイトル3行目タイトル3行目タイトル</th>
        <td>テキストテキストテキストテキストテキスト</td>
        <td>テキストテキストテキストテキストテキスト</td>
        <td>テキストテキストテキストテキストテキスト</td>
        <td>テキストテキストテキストテキストテキスト</td>
      </tr>
      <tr>
        <th>4行目タイトル4行目タイトル4行目タイトル</th>
        <td>テキストテキストテキストテキストテキスト</td>
        <td>テキストテキストテキストテキストテキスト</td>
        <td>テキストテキストテキストテキストテキスト</td>
        <td>テキストテキストテキストテキストテキスト</td>
      </tr>
    </tbody>
  </table>
</div>

.table-wrap {
  overflow-x: auto;
  padding-left: 30px;
}
table {
  position: relative;
  white-space: nowrap;
}
table::after {
  position: absolute;
  content: '';
  display: block;
  top: 0;
  left: 100%;
  height: 1px;
  width: 30px;
  background-color: transparent;
}