@import url("root.css");
.info_wrap {
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 20px;
}
.info_wrap .box {
  width: calc((100% - 40px) / 3);
}
@media (max-width: 1024px) {
  .info_wrap .box {
    width: 100%;
  }
}
.info_wrap .text-large {
  font-size: clamp(18px, 3.2vw, 32px);
}
.info_wrap .common_button {
  max-width: none;
  flex-direction: inherit;
  margin-bottom: 10px;
  min-height: clamp(60px, 9.11vw, 80px);
}
.info_wrap .tel {
  display: flex;
  align-items: center;
}
.info_wrap .tel a {
  font-size: 28px;
}
.info_wrap .contact a {
  min-height: clamp(60px, 9.11vw, 80px);
}

.flow_block {
  margin-bottom: 50px;
}
.flow_block .flow_box {
  border: solid 1px var(--base-color01);
  background: #fff;
}
.flow_block .flow_box:not(:last-child) {
  margin-bottom: 50px;
  position: relative;
}
.flow_block .flow_box:not(:last-child):after {
  content: "";
  width: 50px;
  height: 15px;
  background-color: var(--link-color);
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 20px);
  margin: auto;
  clip-path: polygon(50% 100%, 0 0, 100% 0);
}
.flow_block .info_wrap_block {
  padding: clamp(10px, 2.6vw, 40px);
}
.flow_block .other {
  padding: clamp(10px, 2.6vw, 40px);
}
.flow_block h3 {
  margin: 0;
  display: flex;
  align-items: center;
  gap: clamp(10px, 2.6vw, 20px);
  font-size: clamp(20px, 3.125vw, 24px);
  border-bottom: solid 1px var(--base-color01);
}
.flow_block h3 .step {
  width: clamp(45px, 7.8vw, 60px);
  height: clamp(45px, 7.8vw, 60px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #fff;
  background: var(--base-color01);
  font-size: clamp(11px, 1.9vw, 15px);
}
.flow_block h3 .step .num {
  font-size: clamp(18px, 3.38vw, 26px);
  line-height: 1;
}
.flow_block .row {
  margin: 0;
}
@media (min-width: 768px) {
  .flow_block .row .col-4 {
    order: 2;
  }
  .flow_block .row .col-8 {
    order: 1;
  }
}
