@charset "UTF-8";
/******************** Flow ********************/
/*** --------------- introduction-area --------------- ***/
.introduction_text .section_text {
  position: relative;
  padding-bottom: 20px;
}

.introduction_text .section_text::before {
  content: "";
  background-image: url(../img/flow_bg01.png);
  background-size: cover;
  display: inline-block;
  position: absolute;
  width: 180px;
  height: 180px;
  right: 50px;
  bottom: 0;
}

.flow_area {
  margin-top: 40px;
}

.flow_area .section_text {
  padding: 6px 0;
}

.flow_area .flow_wrap ul {
  padding: 0;
}

.introduction_area_box .flow_wrap ul::before {
  height: 90%;
  top: calc(10% - 80px);
  z-index: 1;
}

.flow_area .flow_wrap .ilist_in {
  position: relative;
  justify-content: end;
  margin-top: 60px;
}

.flow_area .flow_wrap .ilist_number {
  left: 0;
}

.flow_area .flow_wrap .ilist_text {
  max-width: 955px;
  border-radius: 20px;
  padding: 40px 30px 40px 75px;
}

@media only screen and (max-width: 1399px) {
  .introduction_text .section_text::before {
    right: 0;
}
}

@media only screen and (max-width: 1199px) {
  .introduction_text .section_text {
    padding-bottom: 170px;
}

  .introduction_text .section_text::before {
    width: 150px;
    height: 150px;
}

  .introduction_area_box .flow_wrap ul::before {
    left: 62px;
}

  .flow_area .flow_wrap .ilist_number {
    left: 30px;
}

  .flow_area .flow_wrap .ilist_text {
    padding-left: 130px;
}
}

@media only screen and (max-width: 420px) {
  .introduction_area_box .flow_wrap ul::before {
    height: 88%;
}
}

/*** --------------- support-area --------------- ***/
.support_area_box ul {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  margin-top: 60px;
  gap: 30px;
}

.support_area_box ul li {
  max-width: 380px;
  width: 100%;
}

.support_area_box .support_img img {
  border-radius: 20px;
}

.support_area_box h3 {
  font-size: 2rem;
  padding-top: 20px;
}

.support_area_box .support_text {
  margin-top: 20px;
  padding: 0 25px;
}

.support_area_box .support_text p {
  text-align: left;
  margin-top: 10px;
}

.support_btn {
  margin-top: 30px;
}

.support_btn a{
  position: relative;
  display: inline-block;
  align-items: center;
  padding: 15px 25px;
  z-index: 1;
}

.support_btn a::before {
  content: "";
  position: absolute;
  inset: 0;
  padding: 2px;
  border-radius: 60px;
  background: linear-gradient(90deg, #84CFF3 0%, #007AC3 100%);
  -webkit-mask:
    linear-gradient(#fff 0%, #fff 100%) content-box,
    linear-gradient(#fff 0%, #fff 100%);
  mask-composite: exclude;
  -webkit-mask-composite: xor;
  z-index: -1;
}

.support_btn .tv_rogo {
  max-width: 100px;
  width: 100%;
  margin-bottom: 4px;
}

@media only screen and (max-width: 575px) {
    .support_area_box .support_text {
    margin-top: 15px;
    padding: 0 15px;
}

  .support_btn {
    margin-top: 15px;
}

  .support_btn .tv_rogo {
    display: block;
    margin: 0 auto 4px;
}
}