Bootstrap checkbox size wrong with smaller body font

I have set my default font size to be based on 10px via 62.5%, and then set the body to be 1.4rem. This seems to cause issues with the custom checkbox controls and they no longer align correctly.

I'm using Bootstrap's SASS files combined with my own. Is there something in the variables file that I'm missing to fix this? Or maybe some overrides I need to do? I've tried messing with various padding, margins, font sizes, etc. but the way they have this working isn't obvious.

Here is what I have set for the default font sizes for the site:

html { 
  font-size: 62.5%;
}
body {
  font-size: 1.4rem;
}

And here is the HTML

<div class="container-fluid">
  <div class="row align-items-end">
    <div class="col">
      <div class="form-group">
        <label for="worker">Worker</label>
        <select class="form-control" id="worker">
          <option>Jane Doe</option>
          <option>John Smith</option>
        </select>
      </div>
    </div>
    <div class="col">
      <div class="form-group">
        <label class="custom-control custom-checkbox">
          <input type="checkbox" class="custom-control-input">
          <span class="custom-control-indicator"></span>
          <span class="custom-control-description">Check this custom checkbox</span>
        </label>
      </div>
    </div>
  </div>
</div>

JSFiddle

To sum up, basically I need the ability to change the body font size and yet still have the checkbox to still work correctly and be the same height as the input fields when they are next to each other.