<table class="sample1">
    <tbody>
        <tr>
            <th>会社名</th>
            <td>株式会社〇〇〇</td>
        </tr>
        <tr>
            <th>所在地</th>
            <td>〇〇県〇〇市〇〇町 〇丁目〇番〇号</td>
        </tr>
        <tr>
            <th>電話番号</th>
            <td>00-0000-0000</td>
        </tr>
        <tr>
            <th>事業内容</th>
            <td>〇〇事業<br>〇〇事業<br>〇〇事業</td>
        </tr>
    </tbody>
</table>

.sample1 {
    border-collapse: collapse;
    table-layout: fixed;
    width: 100%; /* table幅を100%に指定 */
    background: #fff;
    border: none;
}
.sample1 th,
.sample1 td {
    display: block; /* セルをブロック要素に指定 */
    width: 100%; /* セルを親要素いっぱいの幅に指定 */
    border: none;
    font-size: 14px;   
    padding: 10px;
    vertical-align: top;
    text-align: left;
    box-sizing: border-box;
}
.sample1 th {
    font-weight: 700;
    color: #fff;
    background: #14116e; /* thの背景色 */
}

@media screen and (min-width: 768px) {
    .sample1 th,
    .sample1 td {
        display: table-cell; /* デフォルト値に指定 */
        border-bottom: 1px solid #ccc;
        color: #000;
        background: #fff;
    }
    .sample1 th {
        color: #000;
        background: #fff; /* thの背景色 */
    }
    .sample1 tr th:first-child {
        width: 100px; /* thの固定幅 */
    }
}

<table class="sample2">
    <thead>
        <tr>
            <th>本日のランチ</th>
            <th>期間限定メニュー</th>　<!-- 別の場所に表示したいth -->
            <th>特別価格</th>　<!-- 別の場所に表示したいth -->
        </tr>
    </thead>
    <tbody>
        <tr>
            <th>ランチA</th>
            <td data-label="期間限定メニュー">スパイシーチキンカレー<br>グリーンサラダ<br>ライスまたはチーズナン</td>
            <td data-label="特別価格">800円</td>
        </tr>
        <tr>
            <th>ランチB</th>
            <td data-label="期間限定メニュー">エビバターマサラ<br>グリーンサラダ<br>ライスまたはチーズナン</td>
            <td data-label="特別価格">1,000円</td>
        </tr>
    </tbody>
</table>

.sample2 {
    border-collapse: collapse;
    table-layout: fixed;
    width: 100%;
    background: #fff;
    border: none;
}
.sample2 th,
.sample2 td {
    font-size: 14px;
    background: #fff;
    border: 1px solid #ccc;
    padding: 8px;
    vertical-align: middle;
    box-sizing: border-box;
}
.sample2 th {
    font-weight: 700;
    text-align: center;
}
.sample2 thead th {
    color: #fff;
    background: #14116e;
}
.sample2 tbody td:last-child {
  text-align: right;
}
.sample2 thead th:first-child,
.sample2 thead th:last-child {
  width: 20%;
}
@media screen and (max-width: 768px) {
  .sample2 thead {
    display:none;
  }
  .sample2 tr {
    background-color: unset;
  }
  .sample2 th, .ex_sample2 td {
    display: block;
    width: 100%;
    border: 0;
    border-bottom: 1px solid #ccc;
  }
  .sample2 tbody th{
    background: #14116e;
    color:#fff;
    text-align: center;
  }
  .sample2 tbody tr td:not(:last-child) {
    display: flex;
    flex-direction: column;
    gap: 5px;
  }
  .sample2 tbody tr td:not(:last-child)::before{
    content: attr(data-label);
    width: fit-content;
    padding: 0.2em 1em;
    border-radius: 100vw;
    font-size: 12px;
    background: #eee;
  }
  .sample2 tbody td:last-child::before{
    content: attr(data-label);
    display: inline-block;
    margin-right: 10px;
  }
  .sample2 tbody td:last-child{
    display: flex;
    justify-content: space-between;
  }
}