CSS Grid - Is it possible to justify center odd items in a grid

Question

I'm wondering if there is a solution to use Css Grid(not flexbox) to center odd items using something like Flexbox's justify-content. In the codepen below, I'd like to have the 4th and 5th items centered on desktop, and in tablet have the 5th item centered.

https://codepen.io/jordan-k-647/pen/LYQOyrm

<section class="grid">
  <div class="grid-item">Grid Item</div>
  <div class="grid-item">Grid Item</div>
  <div class="grid-item">Grid Item</div>
  <div class="grid-item">Grid Item</div>
  <div class="grid-item">Grid Item</div>
</section>



.grid {
    display: grid;
    grid-column-gap: 1.5rem;
    grid-template-columns: repeat(1, 1fr);
    max-width: 1170px;
    margin: 0 auto;
}
.grid-item {
  text-align: center;
  padding: 45px;
  background: royalblue;
  margin-top: 1.5rem;
  color: white;
  font-family: sans-serif;
  text-transform: uppercase;
}
@media only screen and (min-width: 640px) {
    .grid {
      grid-template-columns: repeat(2, 1fr);
  }
}
@media only screen and (min-width: 1024px) {
    .grid {
      grid-template-columns: repeat(3, 1fr);
  }
}