/* exbtn を navi2028 ボタン仕様に寄せる（#main配下のみ） */

#main a.exbtn{
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-height: 48px;
  padding: 10px 18px;

  border-radius: 100px;
  font-weight: 700;
  line-height: 1.35;
  text-align: center;
  white-space: normal;
  text-decoration: none;

  background-image: none;
  box-shadow: none;
  transition: background .2s, border-color .2s, color .2s, opacity .2s;
}

#main a.exbtn .exbtn__txt {
  font-weight: inherit; /* 親(a.exbtn)の700を継承させる */
}

/* 「>」を出している場合があるので確実に消す */
#main a.exbtn::after{
  content: none !important;
}

/* btn-01（詳細を見る）= navi2028 .btn-01 */
#main a.exbtn.exbtn--type1{
  color: var(--main-color-02, #3088f3);
  background: var(--neutral-color-01, #fff);
  border: 1px solid var(--neutral-color-04, #b0b0b0);
}

#main a.exbtn.exbtn--type1:hover,
#main a.exbtn.exbtn--type1:focus,
#main a.exbtn.exbtn--type1:active{
  color: var(--main-color-02, #3088f3);
  opacity: 0.8; /* navi2028準拠 */
}

/* btn-03（エントリー）= navi2028 .btn-03 */
#main a.exbtn.exbtn--type2{
  background: var(--conversion-color-01, #ff8b0f);
  color: var(--neutral-color-01, #fff);
  border: 1px solid transparent;
}

#main a.exbtn.exbtn--type2:hover,
#main a.exbtn.exbtn--type2:focus,
#main a.exbtn.exbtn--type2:active{
  background: var(--conversion-color-02, #ffaf59);
  color: var(--neutral-color-01, #fff);
}