.circle_btn02 {
  position: relative;
  display: flex;
  justify-content: space-around;
  align-items: center;
  max-width: 230px; /* ボタンの最大幅 */
  padding: 1em 2em;
  color: initial; /* 文字色 */
  transition: 0.3s ease-in-out;
  font-weight: bold;
  text-decoration: none;
}

.circle_btn02::before, .circle_btn02::after {
  content: "";
  position: absolute;
  display: block;
  top: 50%;
}

.circle_btn02::before {
  width: 0.7em;
  height: 0.7em;
  left: 2.3em;
  border-top: solid 2px #fff; /* 矢印の色 */
  border-right: solid 2px #fff; /* 矢印の色 */
  z-index: 2;
  transform: translateY(-50%) rotate(45deg);
  transition: all 0.3s;
}

.circle_btn02::after {
  left: 1em;
  background: #E6A907; /* 背景色 */
  z-index: 1;
  width: 3.5em;
  height: 3.5em;
  border-radius: 3em;
  transform: translateY(-50%);
  transition: all 0.5s;
}

.circle_btn02 span {
  position: relative;
  transition: all 0.3s;
  z-index: 3;
  font-size: 20px;
  margin-left: 30px;
  margin-bottom: -3px;
}

@media (min-width: 991px) and (max-width: 1199px) {
  .circle_btn02 span {
    margin-left: 40px;
    margin-bottom: -3px;
  }}

/* マウスオーバーした際のデザイン */
.circle_btn02:hover span {
  color: #fff; /* 文字色 */
}

.circle_btn02:hover:before {
  left: 2rem;
}

.circle_btn02:hover:after {
  right: 0;
  width: 100%;
}


.circle_btn03 {
  position: relative;
  display: flex;
  justify-content: space-around;
  align-items: center;
  max-width: 230px; /* ボタンの最大幅 */
  padding: 1em 2em;
  color: initial; /* 文字色 */
  transition: 0.3s ease-in-out;
  font-weight: bold;
  text-decoration: none;
}

.circle_btn03::before, .circle_btn03::after {
  content: "";
  position: absolute;
  display: block;
  top: 50%;
}

.circle_btn03::before {
  width: 0.7em;
  height: 0.7em;
  left: 2.3em;
  border-top: solid 2px #fff; /* 矢印の色 */
  border-right: solid 2px #fff; /* 矢印の色 */
  z-index: 2;
  transform: translateY(-50%) rotate(45deg);
  transition: all 0.3s;
}

.circle_btn03::after {
  left: 1em;
  background: #009689; /* 背景色 */
  z-index: 1;
  width: 3.5em;
  height: 3.5em;
  border-radius: 3em;
  transform: translateY(-50%);
  transition: all 0.5s;
}

.circle_btn03 span {
  position: relative;
  transition: all 0.3s;
  z-index: 3;
  font-size: 20px;
  margin-left: 30px;
  margin-bottom: -3px;
}
@media (min-width: 1199px) {
.circle_btn03 span {
  margin-left: 10px;
}}
@media (max-width: 991px)  {
  .circle_btn03 span {
    margin-left: 5px;
  }}
@media (min-width: 991px) and (max-width: 1199px) {
  .circle_btn03 span {
    font-size: 18px;
  }}
/* マウスオーバーした際のデザイン */
.circle_btn03:hover span {
  color: #fff; /* 文字色 */
}

.circle_btn03:hover:before {
  left: 2rem;
}

.circle_btn03:hover:after {
  right: 0;
  width: 100%;
}


.circle_btn04 {
  position: relative;
  display: flex;
  justify-content: space-around;
  align-items: center;
  max-width: 230px; /* ボタンの最大幅 */
  padding: 1em 2em;
  color: initial; /* 文字色 */
  transition: 0.3s ease-in-out;
  font-weight: bold;
  text-decoration: none;
}

.circle_btn04::before, .circle_btn04::after {
  content: "";
  position: absolute;
  display: block;
  top: 50%;
}

.circle_btn04::before {
  width: 0.7em;
  height: 0.7em;
  left: 2.3em;
  border-top: solid 2px #fff; /* 矢印の色 */
  border-right: solid 2px #fff; /* 矢印の色 */
  z-index: 2;
  transform: translateY(-50%) rotate(45deg);
  transition: all 0.3s;
}

.circle_btn04::after {
  left: 1em;
  background: #1957DE; /* 背景色 */
  z-index: 1;
  width: 3.5em;
  height: 3.5em;
  border-radius: 3em;
  transform: translateY(-50%);
  transition: all 0.5s;
}

.circle_btn04 span {
  position: relative;
  transition: all 0.3s;
  z-index: 3;
  font-size: 20px;
  margin-left: 40px;
  margin-bottom: -3px;
}
@media (min-width: 991px) and (max-width: 1199px) {
  .circle_btn04 span {
    font-size: 16px;
  }}
/* マウスオーバーした際のデザイン */
.circle_btn04:hover span {
  color: #fff; /* 文字色 */
}

.circle_btn04:hover:before {
  left: 2rem;
}

.circle_btn04:hover:after {
  right: 0;
  width: 100%;
}

.circle_btn05 {
  position: relative;
  display: flex;
  justify-content: space-around;
  align-items: center;
  max-width: 230px; /* ボタンの最大幅 */
  padding: 1em 2em;
  color: initial; /* 文字色 */
  transition: 0.3s ease-in-out;
  font-weight: bold;
  text-decoration: none;
}

.circle_btn05::before, .circle_btn05::after {
  content: "";
  position: absolute;
  display: block;
  top: 50%;
}

.circle_btn05::before {
  width: 0.7em;
  height: 0.7em;
  left: 2.3em;
  border-top: solid 2px #fff; /* 矢印の色 */
  border-right: solid 2px #fff; /* 矢印の色 */
  z-index: 2;
  transform: translateY(-50%) rotate(45deg);
  transition: all 0.3s;
}

.circle_btn05::after {
  left: 1em;
  background: #B12F70; /* 背景色 */
  z-index: 1;
  width: 3.5em;
  height: 3.5em;
  border-radius: 3em;
  transform: translateY(-50%);
  transition: all 0.5s;
}

.circle_btn05 span {
  position: relative;
  transition: all 0.3s;
  z-index: 3;
  font-size: 20px;
  margin-left: 30px;
  margin-bottom: -3px;
}
@media (min-width: 1199px) {
  .circle_btn05 span {
    margin-left: 10px;
  }}
  @media (max-width: 991px)  {
    .circle_btn05 span {
      margin-left: 5px;
    }}
  @media (min-width: 991px) and (max-width: 1199px) {
    .circle_btn05 span {
      font-size: 18px;
    }}
/* マウスオーバーした際のデザイン */
.circle_btn05:hover span {
  color: #fff; /* 文字色 */
}

.circle_btn05:hover:before {
  left: 2rem;
}

.circle_btn05:hover:after {
  right: 0;
  width: 100%;
}

@media (max-width: 1199px) {
  .font2 {
    font-size: 23px!important;
  }}

.Table_btn a{
  text-decoration: none;
}