.box {
  display: grid;
}

/* ===============
上下左右中央寄せ
==================*/
.grid_vh {
  place-content: center;
}

/* ===============
子要素が複数ある場合
==================*/
.grid_v {
  place-content: center;
  place-items: center;
  
  /* 
  ▼こっちでもOK▼
  justify-content: center;
  align-items: center;
   */
}

/* ===============
子要素を横並びで左右中央寄せ
==================*/
.grid_h {
  place-content: center;
  place-items: center;
  grid-auto-flow: column;
}


/* ===============
装飾のためのCSS
==================*/
.box {
  background-color: #efefef;
  height: 200px;
}
.box + .box {
  margin-top: 40px;
}
.box--item {
  background-color: #2eb7cf;
  color: #fff;
  font-weight: bold;
  padding: 20px;
}
.box--item.-second {
  background-color: #95cf2e;
}