.b4__menu {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.b4__menu-link {
  color: #54657e;
  display: block;
  font-weight: 500;
  line-height: 3.5rem;
  padding: 0 0.75rem;
  text-decoration: none;
}

.b4__menu-link:hover {
  color: #1d2533;
  position: relative;
}

.b4__menu-link:hover::before {
  background: #1d2533;
  content: '';
  height: 0.25rem;
  left: 0.75rem;
  position: absolute;
  right: 0.75rem;
  top: 0;
}

.b4__menu-link--current {
  color: #1d2533;
  position: relative;
}

.b4__menu-link--current::before {
  background: #d71c1c;
  content: '';
  height: 0.25rem;
  left: 0.75rem;
  position: absolute;
  right: 0.75rem;
  top: 0;
}

@media screen and (min-width: 26.5625em) {
  .b4__menu-link {
    padding: 0 1.5rem;
  }

  .b4__menu-link:hover::before {
    left: 1.5rem;
    right: 1.5rem;
  }

  .b4__menu-link--current::before {
    left: 1.5rem;
    right: 1.5rem;
  }
}

@media screen and (min-width: 48em) {
  .b4__menu-link {
    line-height: 4.5rem;
  }
}