/* ボタン01 */
.btn01 {
  display: inline-flex;        /* 横並び維持 + 中央揃え */
  justify-content: center;     /* 横方向中央 */
  align-items: center;         /* 縦方向中央 */
  width: 39%;
  height: 60px;
  background-color: #fff;
  border: 2px solid #014897;
  margin-top: 5px;
  margin-right: 5px;
  font-size: 20px;
  color: #014897;
  font-weight: bold;
  padding: 1.3rem 2rem;
  border-radius: 5px;
  text-align: center;
  vertical-align: middle;      /* インライン要素の縦揃え */
}

a.btn01 {
  text-decoration: none;
}

.btn01:hover {
  background-image: url(https://www.nivr.jeed.go.jp/h3iskd0000005dp3-img/riha33.png);
  color: #000;
  border: 2px solid #000;
}

/* ボタン02 */
.btn02 {
  display: inline-flex;        /* 横並び維持 + 中央揃え */
  justify-content: center;
  align-items: center;
  width: 39%;
  height: 90px;
  background-color: #fff;
  border: 2px solid #014897;
  margin-top: 5px;
  margin-right: 5px;
  font-size: 20px;
  color: #014897;
  font-weight: bold;
  padding: 1.3rem 2rem;
  border-radius: 5px;
  text-align: center;
  vertical-align: middle;
}

a.btn02 {
  text-decoration: none;
}

.btn02:hover {
  background-image: url(https://www.nivr.jeed.go.jp/h3iskd0000005dp3-img/riha-1-1.jpg);
  color: #000;
  border: 2px solid #000;
}

/* スマホ対応 */
@media (max-width: 767px) {
  .btn01 {
    width: 80%;
    height: 100%;
    display: flex;             /* スマホでは1列にするためブロック化 */
  }
  .btn02 {
    width: 80%;
    height: 100%;
    display: flex;
  }
}

.btn01:hover, .btn02:hover {
  background-size: cover;   /* ボタン全体にフィット */
  background-position: center; /* 中央に配置 */
}