/*setting*/
:root {
  /* Contents */
  --cont-width: 1140px;

  /* vw */
  --vw-value-lg: 1280;
  --vw-value-md: 896;
  --vw-value-sm: 375;
  --vw-calc-lg: (100vw / var(--vw-value-lg));
  --vw-calc-md: (100vw / var(--vw-value-md));
  --vw-calc-sm: (100vw / var(--vw-value-sm));
  /* clamp(8rem, calc(var(--vw-calc-lg) * 144), 14.4rem);
  min(calc(var(--vw-calc-lg) * 242), 24.2rem); */


  /* Color */
  --color-main: #B50023;
  --color-border: #707070;
  --color-bg: #D9DED8;
  --color-text: #666;
  --color-back: #EFEFEF;
  --color-reverse: #fff;
  --color-kokai: #0090D1;
  --color-haken: #9E2730;
  --color-contents: #BC9756;
  --color-eigyo: #AA8582;
  --color-suishin: #175197;

  /* Other */
  --opacity: 0.6;
  --transition: 0.3s;
}

/*ページ内リンク*/
html {
  scroll-behavior: smooth;
  scroll-padding-top: 100px;
}

/*hover*/
a {
  transition: var(--transition);
}

a:hover {
  opacity: var(--opacity);
}

/*layout*/
.l_main {
  width: 100%;
  overflow: hidden;
}

.l_wrapper {
  max-width: var(--cont-width);
  width: calc(100% - 2rem * 2);
  margin: 0 auto;
}

.l_flex {
  display: flex;
}

.l_jc_space-between {
  justify-content: space-between;
}

.l_alignItemsCenter {
  align-items: center !important;
}

.l_gap_4 {
  gap: 4px;
}

.l_gap_8 {
  gap: 8px;
}

.l_gap_12 {
  gap: 12px;
}

.l_gap_14 {
  gap: 14px;
}

.l_gap_16 {
  gap: 16px;
}

.l_gap_24 {
  gap: 24px;
}

.l_gap_40 {
  gap: 40px;
}

.l_gap_80 {
  gap: 80px;
}

.u_bold {
  font-weight: 700;
}

/*Images*/
.u_img {
  display: block;
  line-height: 0;
}

.u_img * {
  display: block;
  width: 100%;
  margin: 0 auto;
}

/*Font*/
.u_textAlignC {
  text-align: center;
}

/*general*/
.g_c_text {
  color: var(--color-text);
  letter-spacing: 0.5px;
}

.g_c_insRed {
  color: var(--color__red1);
}

.g_c_wh {
  color: var(--color-reverse);
}

/*unique*/

/*header*/
.recruit_header {
  display: flex;
  justify-content: space-between;
  padding: 16px;
  position: sticky;
  top: 0;
  background: var(--color-reverse);
  z-index: 999;
}

.recruit_header_logo {
  width: 72px;
}

.recruit_contact {
  display: block;
  padding: 8px 32px;
  background: var(--color-text);
  color: var(--color-reverse);
  border-radius: 50vw;
  font-weight: 700;
}

/*MV*/
.recruit_top {
  background: url(https://www.insource-da.co.jp/common/img/middle/recruit/summary/recruit_mv.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center top;
  height: 480px;
}

.recruit_top_inr {
  margin: 0 0 0 auto;
  max-width: 672px;
  padding-top: 88px;
}

.recruit_top_ttl {
  color: var(--color-reverse);
  font-family: serif;
  font-weight: 600;
  font-size: 48px;
}

.recruit_top_img {
  width: 304px;
}

.recruit_top_box {
  margin-top: 64px;
  background: rgba(255, 255, 255, 0.85);
  padding: 24px 16px;
  display: flex;
}

.recruit_top_ttl_sm {
  font-weight: 700;
  color: var(--color-main);
  padding-right: 8px;
  border-right: 1px solid var(--color-border);
  margin-right: 8px;
}

/*各セクション*/
/*共通レイアウト*/
.recruit_sec {
  margin-top: 120px;

}

.recruit_ttl {
  font-size: 32px;
  font-weight: 700;
  font-family: serif;
  color: var(--color-text);
}

.recruit_ttl br {
  display: none;
}

.recruit_ttl span {
  display: block;
  color: var(--color-main);
  font-size: 16px;
  font-family: "Helvetica Neue", "Noto Sans JP", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", Arial, メイリオ, Meiryo, sans-serif;
}

.recruit_ttl_center {
  text-align: center;
  font-weight: 700;
  font-size: 24px;
  color: var(--color-text);
}

.recruit_ttl_center span {
  color: var(--color-main);
  display: block;
  font-size: 16px;
}

/*WHAT'S IDA*/
.recruit_ttl_bg {
  position: relative;
  margin-top: 80px;
}

.recruit_ttl_bg::before {
  content: "";
  display: block;
  background: var(--color-main);
  height: 32px;
  width: 36vw;
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
}

.recruit_ttl_bg p {
  line-height: 32px;
}

.recruit_top_message_img {
  max-width: 360px;
  flex-shrink: 0;
}

/*BUSINESS*/
.recruit_business_bg {
  padding: 24px 0 56px;
  background: var(--color-back);
  margin-top: 48px;
}

.recruit_business_bg__wh {
  padding: 32px;
  background: var(--color-reverse);
}

.recruit_business_box {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-column-gap: 32px;
  margin-top: 40px;
}

.recruit_business_icon {
  position: relative;
}

.recruit_business_icon::before {
  content: "";
  display: block;
  width: 48px;
  height: 48px;
  position: absolute;
  top: 0;
  left: 0;
}

.recruit_business_icon.recruit_business_icon__haken::before {
  background: rgba(from var(--color-haken) r g b / 0.15);
}

.recruit_business_icon.recruit_business_icon__kokai::before {
  background: rgba(from var(--color-kokai) r g b / 0.15);
}

.recruit_business_list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-column-gap: 32px;
  margin-top: 40px;
}

.recruit_business_leafLog {
  width: 100%;
  height: 245px;
  border: 16px solid #DFA300;
}

.recruit_business_leafLog img {
  width: 50%;
  height: 100%;
  margin: auto;
}

/*INTERVIEW*/
.recruit_interview_list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-column-gap: 32px;
  grid-row-gap: 32px;
}

.recruit_interview_list_itm {
  position: relative;
}

.recruit_interview_list_itm.recruit_interview_list_itm__btm a {
  border-radius: 16px;
  background: var(--color-main);
  padding: 32px 0 24px 120px;
  display: block;
  font-weight: 700;
}

.recruit_interview_list_itm.recruit_interview_list_itm__btm a::after {
  content: "";
  display: block;
  width: 48px;
  height: 96px;
  background: url(../../common/img/middle/recruit/summary/recruit_interview_icon.svg);
  background-position: center bottom;
  background-repeat: no-repeat;
  background-size: contain;
  position: absolute;
  bottom: 0;
  right: 40px;
}

.recruit_interview_list_img {
  width: 192px;
  margin: 0 0 0 auto;
}

.recruit_interview_list_bg {
  border-radius: 16px;
  background: var(--color-bg);
  padding-bottom: 24px;
  position: absolute;
  bottom: 0;
  overflow: hidden;
  width: 100%;
  z-index: -1;
}

.recruit_interview_list_num {
  font-family: bahnschrift-semicondensed, sans-serif;
  font-size: 88px;
  font-weight: 300;
  color: var(--color-reverse);
  line-height: 1;
  position: absolute;
  top: -20px;
  left: -6px;
}

.recruit_interview_list_name {
  margin-top: 96px;
  padding: 8px 32px;
  background: var(--color-main);
  color: var(--color-reverse);
  font-weight: 700;
  width: 80%;
}

/*社員インタビュー*/
.recruit_interview_list_itm:has(.recruit_interview_name) {
  width: 730px;
  margin: 80px auto 0;
}

.recruit_interview_list_itm:has(.recruit_interview_name) .recruit_interview_list_name {
  font-size: 20px;
  padding: 24px 0 24px 80px;
}


.recruit_interview_list_itm:has(.recruit_interview_name) .recruit_interview_list_img {
  width: 240px;
  margin: 0 24px 0 auto;
}

.recruit_interview_name {
  font-size: 56px;
  line-height: 1;
}


.recruit_interview_topic {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-column-gap: 56px;
  grid-row-gap: 72px;
  margin-top: 176px;
}

.recruit_interview_topic_ttl {
  font-size: 24px;
  font-weight: 700;
  color: var(--color-text);
  padding-bottom: 8px;
  border-bottom: 1px solid var(--color-border);
  margin-bottom: 32px;
}

.recruit_interview_schedule {
  background: var(--color-back);
  border-radius: 8px;
  padding: 24px;
  overflow: hidden;
  position: relative;
  z-index: -2;
}

.recruit_interview_schedule::before {
  content: "";
  display: block;
  width: 160px;
  height: 160px;
  background: url(../../common/img/middle/recruit/summary/recruit_interview_schedule.svg);
  position: absolute;
  top: -18px;
  right: -40px;
  z-index: -1;
}

.recruit_interview_table {
  margin-top: 24px;
  width: 100%;
  font-size: 18px;
}

.recruit_interview_table tr>* {
  padding: 4px 16px;
}

.recruit_interview_table th {
  text-align: right;
  color: var(--color-text);
  border-right: 1px solid var(--color-border);
}

.recruit_interview_message, .recruit_interview_experience{
  margin: 88px auto 0;
  width: calc(100%/2 - 56px);
}

.recruit_interview_message_text {
  margin-top: 8px;
  border-top: 1px solid var(--color-text);
  padding-top: 32px;
}

.recruit_interview_btn {
  width: fit-content;
  display: block;
  margin: 64px auto 72px;
  color: var(--color-main);
  position: relative;
  font-weight: 700;
  font-size: 20px;
}

.recruit_interview_btn::before {
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  transform: rotate(45deg);
  border-bottom: 1px solid var(--color-main);
  border-left: 1px solid var(--color-main);
  position: absolute;
  left: -32px;
  top: 0;
  bottom: 0;
  margin: auto 0;
}
.recruit_interview_topic_ttl br{
  display: none;
}

/*JOB*/
.recruit_job_img {
  width: 240px;
  flex-shrink: 0;
}

.recruit_job_box {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-column-gap: 32px;
  margin-top: 32px;
}

.recruit_job_box_itm {
  display: grid;
  grid-template-rows: subgrid;
  grid-row: span 3;
  gap: 16px;
}

.recruit_job_icon {
  line-height: 18px;
  font-size: 10px;
  border: 1px solid;
  letter-spacing: 0;
  font-weight: bold;
}

.recruit_job_icon.recruit_job_icon__eigyo {
  border-color: var(--color-eigyo);
  color: var(--color-eigyo);
  padding: 0 6px;
}

.recruit_job_icon.recruit_job_icon__contents {
  border-color: var(--color-contents);
  color: var(--color-contents);
  padding: 0 2px;
}

.recruit_job_icon.recruit_job_icon__suishin {
  border-color: var(--color-suishin);
  color: var(--color-suishin);
  padding: 0 2px;
}

.recruit_job_bg {
  padding: 24px 0 56px;
  background: var(--color-back);
  margin-top: 80px;
}

.recruit_job_box__bg {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-column-gap: 32px;
  margin-top: 40px;
}

.recruit_job_box__bg_inr {
  background: var(--color-reverse);
  padding: 24px;
}

.recruit_role_img {
  width: 112px;
}

/*募集要項*/
.recruit_table {
  width: 100%;
  border: 1px solid var(--color-border);
}

.recruit_table tr>* {
  padding: 16px 24px;
  border-bottom: 1px solid var(--color-border);
}

.recruit_table th {
  color: var(--color-text);
  background: var(--color-back);
  width: 176px;
}

.recruit_btn {
  display: block;
  width: 360px;
  margin: 80px auto;
  background: var(--color-main);
  color: var(--color-reverse);
  position: relative;
  border-radius: 4px;
  padding: 20px 0;
  font-weight: 700;
  font-size: 20px;
  text-align: center;
}

.recruit_btn::after {
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  transform: rotate(45deg);
  border-top: 1px solid var(--color-reverse);
  border-right: 1px solid var(--color-reverse);
  position: absolute;
  right: 20px;
  top: 0;
  bottom: 0;
  margin: auto 0;
}

.recruit_btn_ins {
  display: block;
  margin: 80px auto;
  background: none;
  color: var(--color-main);
  position: relative;
  border-radius: 4px;
  padding: 20px 0;
  font-weight: 700;
  font-size: 20px;
  text-align: center;
  text-decoration: underline;
}



/* レスポンシブ */
@media screen and (max-width:768px) {
  #sec01 picture {
    margin: 0 auto;
  }
.recruit_header > .l_flex{
  display: flex;
  flex-wrap: wrap;
}
.recruit_header .l_gap_40{
  display: none;
}

  .recruit_top_ttl {
    font-size: 30px;
  }
  .recruit_top{
    background-position: left -215px top;
    height: 315px;
  }

  .recruit_top_inr {
    margin-left: 154px;
　　padding-top: 156px;
  }
.recruit_top_message_img{
    max-width: 60%;
    margin: 20px auto;
}

  .recruit_top_inr .recruit_top_img {
    width: 168px;
  }

  .recruit_top_box {
    display: none;
  }
  .recruit_job_box_itm figure img{
    width: 70%;

  }

  .recruit_ttl {
    font-size: 20px;
    text-align: center;
  }

  .recruit_ttl br {
    display: block;
  }

  .recruit_header {
    display: block;
  }

  .l_flex {
    display: block
  }

  .recruit_top {
    font-size: 20px;
  }

  .recruit_business_box {
    display: block;
  }

  .recruit_business_icon {
    margin-bottom: 20px;
  }

  .recruit_business_list {
    display: flex;
    flex-wrap: wrap;
  }

  .recruit_business_list li {
    width: 40%;
    margin-bottom: 20px;
  }

  .recruit_business_leafLog {
    height: 122.59px;
  }

  .recruit_interview_list {
    display: block;
  }

  .recruit_job_box {
    display: block;
  }

  .recruit_job_box_itm .l_flex {
    display: flex;
  }

  .recruit_job_box_itm {
    margin-bottom: 40px;
  }

  .recruit_job_box__bg {
    display: block;
  }

  .recruit_table th {
    writing-mode: vertical-rl;
    width: 0;
　　text-orientation: upright;
  }

  .recruit_business_bg__wh br {
    display: none;
  }

  .recruit_interview_list_itm {
    margin-bottom: 20px;
  }

  #sec04 figure {
    margin: 0 auto;
  }

  .recruit_job_bg .l_flex {
    display: flex;
  }
.recruit_btn_ins {
  font-size: 16px;
}


  /* 下層ページレスポンシブ */
  .recruit_interview_topic{
    display: block;
  }
  .recruit_interview_topic > div{
    margin-bottom: 40px;
  }
  .recruit_interview_table th{
    padding: 0 10px 0 0;
  }
  .recruit_interview_list_itm:has(.recruit_interview_name){
    margin: 0;
    width: 100%;
  }
  .recruit_interview_list_itm:has(.recruit_interview_name) .recruit_interview_list_img {
   margin: 0 -15px 0 auto;
  }
  .recruit_interview_list_itm:has(.recruit_interview_name) .recruit_interview_list_name{
    font-size: 16px;
    padding: 24px 0 24px 10px;
  }
  
.recruit_interview_name{
  font-size: 28px;
} 
.recruit_interview_topic{
  margin-top: 50px;
}
.recruit_interview_schedule .u_fs16{
display: block;
}
.recruit_interview_topic_ttl br{
  display: block;
}
.recruit_interview_message, .recruit_interview_experience{
  margin: 0;
  width: 100%;
  margin-top: 40px;
}
.recruit_btn{
  width: 100%;
}