@charset "utf-8";
/* ----test 採用情報 - 新卒採用 - 新人社員教育---- */
#wrap #main {
  padding-bottom: 80px;
}
/* ----新人社員教育---- */

#main section {
  margin-bottom: 60px;
}

#main section .type2 {
  margin: 0;
  margin-bottom: 30px;
}

/* 教育制度のポイント */
#main .support_point,
#main .support_point div {
  margin-bottom: 0;
}

#main .support_point_img_container {
  display: flex;
  flex-flow: column;
  row-gap: 30px;
}

#main .support_point_img_container img {
  width: 100%;
  height: auto;
}
.support_point_text {
  margin-top: 30px;
  line-height: 1.8;
}
.support_point_list {
  counter-reset: support_point_number;
  margin-top: 40px;
}
.support_point_list li {
  counter-increment: support_point_number;
}
.support_point_list li:not(:last-child) {
  margin-bottom: 40px;
}
.support_point_list li h4 {
  position: relative;
  font-size: 15px;
  font-weight: 700;
  margin-bottom: 32px;
}
.support_point_list li h4::before,
.support_point_list li h4::after {
  content: "";
  height: 2px;
  position: absolute;
  bottom: -10px;
  left: 0;
}
.support_point_list li h4::before {
  width: 100%;
  background-color: #EDEDED;
}
.support_point_list li h4::after {
  width: 30px;
  background-color: #F19716;
}
.support_point_list li h4 span {
  display: flex;
  column-gap: 5px;
}
.support_point_list li h4 span::before {
  content: counter(support_point_number);
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background-color: #F19716;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1;
  flex-shrink: 0;
}
.support_point_list .year_schedule {
  margin-top: 10px;
}
.support_point_list .year_schedule dl {
  display: flex;
  column-gap: 14px;
  align-items: flex-start;
}
.support_point_list .year_schedule dl + dl {
  margin-top: 10px;
}
.support_point_list .year_schedule dt {
  flex-shrink: 0;
  width: 81px;
  padding: 2px;
  text-align: center;
  background-color: #EDEDED;
}

/* 選べる3つのキャリアパス */
#main .career_path img  {
  width: 100%;
  height: auto;
}
#main .career_path {
  margin-bottom: 30px;
}
#main .career_path_text {
  line-height: 1.8;
  margin-bottom: 0;
}
.career_path_text dl {
  margin-top: 20px;
}
.career_path_text dt {
  font-weight: 700;
  margin-bottom: 10px;
  padding-bottom: 4px;
  border-bottom: 1px solid #D0D0D0;
}

/* 教育制度?成長環境 */
#main .feature_data div {
  margin-bottom: 0;
}

/* 資格取得奨制度 */
#main #qualification {
  margin-bottom: 0;
}
#qualification a {
  display: block;
  text-indent: 100%;
  width: 600px;
  height: 150px;
  margin: 0px auto;
  background-image: url(/wp/wp-content/themes/ios/recruit/graduate/img/img_qualification.jpg);
  background-repeat: no-repeat;
  background-size: contain;
  white-space: nowrap;
  overflow: hidden;
}

/* 先輩社員に聞きました */
#main .interview_block {
  display: flex;
  line-height: 1.8;
  justify-content: space-between;
  margin-bottom: 30px;
}
.interview_block dl {
  width: calc(50% - 24px);
}
.interview_block dt {
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 10px;
}
.interview_block dt span {
  display: block;
  font-weight: 400;
  font-size: 12px;
}
.interview_btn {
  color: #fff;
  background-color: #F19716;
  width: 500px;
  height: 70px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: auto;
  position: relative;
  font-weight: 700;
  font-size: 16px;
}
.interview_btn::after {
  content: "";
  width: 9px;
  height: 9px;
  border-right: 2px solid #fff;
  border-top: 2px solid #fff;
  transform: rotate(45deg) translateY(-50%);
  position: absolute;
  right: 20px;
  top: 50%;
}



/*
****     SP     ***
**/
@media (max-width: 767px) {
  #main section {
    margin-bottom: 40px;
  }

  #main section .type2 {
    margin-bottom: 20px;
  }

  #main section .support_mobile-scroll {
    width: 100%;
    overflow-x: scroll;
  }

  /* 教育制度のポイント */
  #main .support_point {
    margin-top: 20px;
  }
  #main .support_point_img_container {
    row-gap: 20px;
  }

  #main .support_point_img_container img {
    width: 600px;
    height: auto;
  }

  /* 選べる3つのキャリアパス */
  #main .career_path img  {
    width: 500px;
    height: auto;
  }

  /* 先輩社員に聞きました */
  .interview_block {
    flex-flow: column;
    row-gap: 30px;
  }
  .interview_block dl {
    width: 100%;
  }
  .interview_btn {
    max-width: 100%;
  }

}