/* コンテナの基本設定 */
.container1 {
  display: flex;
  justify-content: center; /* PCで横並びにした際に中央に配置 */
  flex-wrap: wrap; /* 必要に応じて折り返し */
  margin: 25px;
  gap: 25px; /* アイテム間の隙間(縦並び/横並び共通) */
}

/* divの基本設定 */
.box1 {
  margin: 0;
  width: 220px; /* 幅を220pxに固定 */
  border: 2px solid #015f13;
  background: #015f13;
  border-radius: 5px;
  padding: 2%;
  font-size: 20px;
  font-weight: bold;
  color: #fff;
  text-align: center;
}

.box2 {
  margin: 0;
  width: 220px; /* 幅を220pxに固定 */
  border: 2px solid #1fb1a9;
  background: #d3ffea;
  border-radius: 5px;
  padding: 2%;
  font-size: 20px;
  font-weight: bold;
  color: #015f13;
  text-align: center;
}

/* 768px以下の画面での設定 */
@media (max-width: 768px) {
  .container1 {
    flex-direction: column; /* 縦並びにする */
    align-items: center; /* divを中央に揃える */
  }
}