@charset "UTF-8";

.link_btn {
  margin: 0 auto;
}

/****** title ******/
.title_wrap {
  background-image: url(../images/recruit_entry/title_bg.png);
  background-position: center 25%;
}

/****** recruit ******/
.recruit {
  position: relative;
  padding: 64px 0 248px;
  background: url(../images/recruit_entry/recruit_bg.png) no-repeat center
    center;
  background-size: cover;
  color: #fff;
}

.recruit .inner_wrap {
  padding: 0 30px;
}

.recruit_flex {
  display: flex;
  justify-content: space-between;
}

.recruit_title_wrap {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.recruit_title {
  width: 291px;
  margin-right: -12px;
}

.recruit_catch {
  font-size: 1.875rem;
  line-height: 1.68;
}

.recruit_catch_text {
  width: 666px;
  padding-top: 54px;
}

/****** slider ******/
.slide_wrap {
  position: absolute;
  bottom: -159px;
}
.slide01 .slide_inner {
  width: 170px;
  margin: 31px 30px 0 0;
}
.slide02 .slide_inner {
  width: 160px;
  margin: 54px 30px 117px 0;
}
.slide03 .slide_inner {
  width: 305px;
  margin: 0 30px 26px 0;
}
.slide04 .slide_inner {
  width: 240px;
  margin: 114px 30px 47px 0;
}
.slide05 .slide_inner {
  width: 130px;
  margin: 76px 30px 26px 0;
}
.slide06 .slide_inner {
  width: 200px;
  margin: 14px 30px 117px 0;
}

/****** page_bg ******/
.page_bg::after {
  top: -130px;
}

/****** requirements ******/
.requirements {
  padding: 276px 0 130px;
}

.list_wrap {
  margin-bottom: 60px;
}

.requirements .inner_wrap {
  padding: 0 30px;
}

/****** flow ******/
.flow {
  padding: 117px 0 130px;
  background-color: #f7fbf7;
}

.flow .inner_wrap {
  padding: 0 30px;
}

.flow_flex {
  margin-bottom: 60px;
  display: flex;
  flex-direction: column;
}

.flow_item {
  width: 1000px;
  padding: 20px 0 19px;
  margin: 0 auto;
  border-bottom: 1px solid #d2d2d2;
  display: flex;
  align-items: center;
}
.flow_item:first-child {
  border-top: 1px solid #d2d2d2;
}

.flow_num {
  position: relative;
  width: 130px;
  height: 130px;
  margin-right: 30px;
  border-radius: 50%;
  background-color: #6b9d72;
}
.flow_num::before {
  content: "s t e p";
  position: absolute;
  left: 50%;
  top: 31px;
  transform: translateX(-50%);
  font-size: 1rem;
  font-weight: 500;
  color: #fff;
  font-family: "Barlow", sans-serif;
  text-transform: uppercase;
}
.number {
  position: absolute;
  left: 50%;
  bottom: 39px;
  transform: translateX(-50%);
  font-size: 2.8125rem;
  font-weight: 400;
  color: #fff;
}

.flow_text_wrap {
  margin-right: auto;
  display: flex;
  align-items: center;
}

.flow_title {
  width: 110px;
  margin-right: 70px;
  font-size: 1.375rem;
  color: #1c5624;
}

.flow_text {
  width: 500px;
  padding-top: 3px;
  font-size: 0.875rem;
  line-height: 1.85;
}

.flow_icon01 {
  width: 81px;
  height: 104px;
  margin-right: 30px;
  background: url(../images/recruit_entry/flow_icon01.png) no-repeat center
    center;
  background-size: contain;
}
.flow_icon02 {
  width: 62px;
  height: 68px;
  margin-right: 38px;
  background: url(../images/recruit_entry/flow_icon02.png) no-repeat center
    center;
  background-size: contain;
}
.flow_icon03 {
  width: 70px;
  height: 62px;
  margin-right: 34px;
  background: url(../images/recruit_entry/flow_icon03.png) no-repeat center
    center;
  background-size: contain;
}
.flow_icon04 {
  width: 84px;
  height: 51px;
  margin-right: 25px;
  background: url(../images/recruit_entry/flow_icon04.png) no-repeat center
    center;
  background-size: contain;
}

@media screen and (max-width: 750px) {
  /****** title ******/
  .title_wrap {
    background-image: url(../images/recruit_entry/title_bg_sp.png);
  }

  /****** recruit ******/
  .recruit {
    position: relative;
    padding: 1.2vw 0 32.27vw;
    background-image: url(../images/recruit_entry/recruit_bg_sp.png);
  }

  .recruit .inner_wrap {
    padding: 0;
  }

  .recruit_flex {
    flex-direction: column;
    justify-content: inherit;
  }

  .recruit_title_wrap {
    align-items: inherit;
  }

  .recruit_title {
    width: 46.53vw;
    margin: 0 9.07vw 0 auto;
  }

  .recruit_catch {
    margin-top: -0.93vw;
    font-size: 5.07vw;
    line-height: 1.73;
  }

  .recruit_catch_text {
    width: 89vw;
    padding-top: 7.87vw;
  }

  /****** slider ******/
  .slide_wrap {
    bottom: -22.27vw;
  }
  .slide01 .slide_inner {
    width: 22.67vw;
    margin: 4.13vw 4vw 0 0;
  }
  .slide02 .slide_inner {
    width: 21.33vw;
    margin: 7.2vw 4vw 15.6vw 0;
  }
  .slide03 .slide_inner {
    width: 40.67vw;
    margin: 0 4vw 3.47vw 0;
  }
  .slide04 .slide_inner {
    width: 32vw;
    margin: 15.2vw 4vw 6.27vw 0;
  }
  .slide05 .slide_inner {
    width: 17.33vw;
    margin: 10.13vw 4vw 3.47vw 0;
  }
  .slide06 .slide_inner {
    width: 26.67vw;
    margin: 1.87vw 4vw 15.6vw 0;
  }

  /****** page_bg ******/
  .page_bg::after {
    top: -11.87vw;
  }

  /****** requirements ******/
  .requirements {
    padding: 37.07vw 0 17.33vw;
  }

  .list_wrap {
    margin-bottom: 12vw;
  }

  .requirements .inner_wrap {
    padding: 0;
  }

  .list_detail {
    width: 69.2vw;
  }

  /****** flow ******/
  .flow {
    padding: 14.67vw 0 17.33vw;
  }

  .flow .inner_wrap {
    padding: 0;
  }

  .flow_flex {
    margin-bottom: 12vw;
  }

  .flow_item {
    width: 100%;
    padding: 8vw 0 5.87vw;
    border-bottom: 0.27vw solid #d2d2d2;
  }
  .flow_item:first-child {
    border-top: 0.27vw solid #d2d2d2;
  }

  .flow_num {
    width: 17.33vw;
    height: 17.33vw;
    margin-top: -1.73vw;
    margin-right: 4vw;
  }
  .flow_num::before {
    /* top: 4.27vw; */
    top: 5.33vw;
    font-size: 1.87vw;
    line-height: 1;
  }
  .number {
    /* bottom: 5.33vw; */
    bottom: 4.4vw;
    font-size: 5.33vw;
    line-height: 1;
  }

  .flow_text_wrap {
    width: 49.33vw;
    flex-direction: column;
    align-items: flex-start;
    gap: 3.73vw;
  }

  .flow_title {
    width: inherit;
    margin-right: 0;
    font-size: 4.8vw;
  }

  .flow_text {
    width: inherit;
    padding-top: 0;
    font-size: 3.2vw;
    line-height: 1.8;
  }

  .flow_icon01 {
    width: 14vw;
    height: 17.2vw;
    margin: -1.6vw 0.53vw 0 0;
    background-image: url(../images/recruit_entry/flow_icon01_sp.png);
  }
  .flow_icon02 {
    width: 14vw;
    height: 11.33vw;
    margin: -1.6vw 0.53vw 0 0;
    background-image: url(../images/recruit_entry/flow_icon02_sp.png);
  }
  .flow_icon03 {
    width: 14vw;
    height: 10.4vw;
    margin: -1.6vw 0.53vw 0 0;
    background-image: url(../images/recruit_entry/flow_icon03_sp.png);
  }
  .flow_icon04 {
    width: 14vw;
    height: 8.4vw;
    margin: -1.6vw 0.53vw 0 0;
    background-image: url(../images/recruit_entry/flow_icon04_sp.png);
  }
}