【firebox表示崩れ】縦書き部分　左寄りから中央寄せにしたい

前提・実現したいこと

コーディングが終わり、ブラウザ・端末で最終チェックをおこなっています。
Google crome、safariで確認するも問題なし。
fireboxで確認すると縦書きの部分が、中央寄せから左寄せになります。
この表示崩れを解決したいです。

発生している問題・エラーメッセージ

html
1<div class="footer">
2    <div class="footer__top">
3      <div class="footer__top__wrapprer">
4        <div class="footer__top__wrapprer__link">
5          <a href="room.html" class="footer__top__wrapprer__link__room">
6            お部屋
7          </a>
8          <br>
9          <a href="" class="footer__top__wrapprer__link__food">
10            お料理
11          </a>
12          <br>
13          <a href="spa.html" class="footer__top__wrapprer__link__spa">
14            温泉
15          </a>
16        </div>
17      </div>
18    </div>
19  </div>

該当のソースコード

scss
1.footer{
2  width: 100%;
3  background: url("img/bg3.png");
4  background-position: center;
5  background-size: cover;
6  background-repeat: no-repeat;
7  text-align: center;
8  .footer__top{
9    .footer__top__wrapprer{
10      padding-top: 64px;
11     .footer__top__wrapprer__link{
12      margin: 0 auto;
13      text-orientation: upright;
14      writing-mode: vertical-rl;
15      font-size: 18px;
16      line-height: 1.77;
17      text-align: left; 
18      letter-spacing: 0.5em;
19      .footer__top__wrapprer__link--item{
20        height: 81px;
21      }
22      .footer__top__wrapprer__link__food{
23        display: inline-block;
24        margin: 0 20px;
25      }
26     }
27    }
28  }
29}