CSSで文字の頭を揃える方法を調べる

2列目の頭を揃えたい。

ただし、
見た目は表組みだけど、マークアップは表組みになってない

画像はこんなマークアップになっている
2列目の頭を揃えるために、スペースを手動で入れている状態

<tr>
  <td>・本社・支社&emsp;&emsp;9時00分～17時45分</td>
</tr>
<tr>
  <td>・技術センター&emsp;9時00分～17時45分</td>
</tr>
<tr>
  <td>・工場&emsp;&emsp;&emsp;&emsp;&emsp;8時00分～16時15分</td>
</tr>

※補足
マークアップは任意で変更可能

コメント失礼します！
tdタグ内の場所と時刻をそれぞれ新しく要素で囲み、flexで横並びにした後、場所の方にwidthを持たせれば、空白なしで揃えることができると思います:)

基本的にデザイン内で間が空いていたり区切りがあると感じた場合は、別の要素に分解して組み立てるとコーディングがしやすくなると思います🙇‍♂️

前述のマークアップはCMSで吐き出されたものではなく、手書きなので変更可能ではある

なので、
前提になるマークアップを書き換えるってのも選択肢に入れることができるかな、、

変更前↓

<td>場所○○○時間</td>

変更後↓

<th>場所</th>
<td>時間</td>

「マークアップを任意に変更可能」なのであれば、悩むことなんて何もないような、、
問題は、「任意に変更可能ではあるが工数の面からあまり変更が望ましくない」という一点にある気がしてきたな

スペースを手動で入れる場合に起きる不都合を理解しないと、これが良くない手段なのかすら判断できない