How to make texts which are different in the number of characters start from the same place?

My design looks like this :: not aligned well vertically

enter image description here

<div class="sum">
      <div class="title">Summary</div>
      <div class="results">
        <div class="box">
          <div>Reaction</div>
          <div class="score">80 / 100</div>
        </div>
        <div class="box">
          <div>Memory</div>
          <div class="score">92 / 100</div>
        </div>
        <div class="box">
          <div>Verbal</div>
          <div class="score">61 / 100</div>
        </div>
        <div class="box">
          <div>Visual</div>
          <div class="score">72 / 100</div>
        </div>
      </div>
    </div>
my css code : 

.results{
   display: flex;
   flex-direction: column;
   height: 360px;
   justify-content: space-evenly;
}
.results .box{
   display: flex;
   justify-content: space-around;
   text-align: justify;
 }

<<sadly, “text-align: justify;” making no difference when the flex is in action>>
I know that the “justify-content: space-evenly;” is the reason they are not aligned well, but I wanted to know if there is a solution that allows me to still use the flex and still make them align well.