/*==================================================
    ページ共通
==================================================*/
.pageRecruit .inner {
  width: 1100px;
  position: relative;

  @media screen and (max-width: 767px) {
    max-width: 100%;
    padding: 0 2.133vw;
  }
}

.title-h3 {
  font-size: 2.6rem;
  font-weight: 600;
  padding-left: 2.6rem;
  position: relative;
  line-height: 1;
  padding-bottom: 2.2rem;
  border-bottom: 1px solid #000;
}

.title-h3::before {
  content: '';
  background-color: var(--color-orange);
  width: 1.3rem;
  height: 1.3rem;
  position: absolute;
  left: 0;
  top: 0.4rem;
  border-radius: 50%;
}

@media screen and (max-width: 767px) {
  .title-h3 {
    font-size: 4.8vw;
    padding-bottom: 3.2667vw;
    padding-left: 3.2vw;
    line-height: 1.2;
  }

  .title-h3::before {
    width: 2.1333vw;
    height: 2.1333vw;
    top: 1.2vw;
  }
}

/*==================================================
    パンくず
==================================================*/
.breadcrumb {
  padding: 2.8rem 0;
}

/*==================================================
    ページタイトル
==================================================*/
.pageHead {
  padding: 2.2rem 0 3.2rem;

  .inner {
    width: 1100px;
  }

  @media screen and (max-width: 767px) {
    padding: 17.8667vw 0 0 0;
  }
}

/*==================================================
    アンカーリンク
==================================================*/
.scrollButtons {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.4rem;
  margin: 2rem auto 7.1rem;

  .scrollButton {
    padding: 1.4rem 3rem 1.2rem 3rem;
    gap: 2.4rem;
    font-size: 1.6rem;
    height: 5.258rem;
    width: 19.645rem;
    border: 1px solid #000;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.5rem;
    background-color: #fff;
    font-weight: 500;
    position: relative;
    justify-content: space-between;
    transition: 0.3s;
  }

  .scrollButton:hover {
    opacity: 1;
    background: #000;
    color: #fff;
  }

  .scrollButton::after {
    width: 1.203rem;
    height: 1.4rem;
    content: '';
    background: url(../img/recruit/arrow-down.png) no-repeat center center / contain;
    display: inline-block;
  }

  .scrollButton:hover::after {
    background: url(../img/recruit/arrow-down_hover.png) no-repeat center center / contain;
  }

  @media screen and (max-width: 767px) {
    margin: 8.533vw 0 8.733vw;
    gap: 1.8667vw;

    .scrollButton {
      padding: 2.3vw 3.4667vw;
      gap: 0;
      font-size: 3.733vw;
      height: auto;
      line-height: 1.4;
      width: 30vw;
    }

    .scrollButton::after {
      width: 1.604vw;
      height: 1.867vw;
    }
  }
}

/*==================================================
    【共通】各採用情報
==================================================*/
.categorySquare-orange {
  background-color: var(--color-orange);
  width: 23.8rem;
  height: 23.8rem;
  display: grid;
  place-content: center;
  color: #fff;
  font-size: 3.3rem;
  font-weight: 600;
  position: absolute;
  top: 0;
  left: 0;
}

.sectionHead__text {
  font-size: 2rem;
  font-weight: 600;
  padding-top: 4.7rem;
  text-align: center;
  line-height: 1.75;
}

.information__contents {
  padding: 6.9rem 5rem;
}

.recruitmentBox {
  border: 1px solid #000;
  font-size: 2rem;
  font-weight: 600;
  padding: 2rem 5.1rem;
  margin: 3.6rem auto 0;
  text-align: center;
  width: fit-content;
  min-width: 510px;
  display: block;
}

.recruitmentBox.orange {
  border: 1px solid var(--color-orange);
  color: var(--color-orange);
}

@media screen and (max-width: 767px) {
  .sectionHead__text {
    padding: 7.4667vw 2vw 0;
    font-size: 4vw;
    line-height: 1.56;
  }

  .recruitmentBox {
    margin: 4.4vw 3.0667vw 0;
    font-size: 3.733vw;
    padding: 3.2667vw 2vw;
    min-width: unset;
  }

  .categorySquare-orange {
    width: 31.73vw;
    height: 31.73vw;
    font-size: 4.39vw;
  }

  #part-time .categorySquare-orange {
    left: 2vw;
  }

  .information__contents {
    padding: 7.8667vw 3.4667vw;
  }
}

/*==================================================
    【共通】テーブルリスト
==================================================*/
.information__table {
  max-width: 940px;
  margin: 2.6rem auto 0;
}

.information__list {
  display: flex;
  border-bottom: 1px solid #eee;
  padding-top: 1.8rem;
  padding-bottom: 1.8rem;
}

.information__list dt {
  flex: 0 1 18.4rem;
  font-size: 1.8rem;
  padding-left: 1.4rem;
  font-weight: 700;
  border-right: 1px solid var(--color-orange);
}

.information__list dd {
  font-size: 1.8rem;
  font-weight: 400;
  padding-left: 2.9rem;
  flex: 1;
}

.information__list dd .mt {
  margin-top: 2rem;
}

.information__list--link {
  color: var(--color-orange);
  text-decoration: underline;
}

.listStyle__disc {
  padding-left: 2rem;
}

.listStyle__disc li {
  position: relative;
}

.listStyle__disc li::before {
  position: absolute;
  content: '・';
  left: -2rem;
  top: 0;
}

.dd-flex {
  display: flex;
  gap: 1.7rem;
  margin-top: 1.6rem;
}

.information__list .link-mail {
  margin-left: 0;
  color: var(--color-orange);
  text-decoration: underline;
}

.information__test-s {
  display: block;
  font-size: 1.6rem;
}

.span-bold {
  font-weight: 600;
  display: block;
}

@media screen and (max-width: 767px) {
  .information__table {
    margin-top: 0;
  }

  .information__list {
    flex-direction: column;
    gap: 1.533vw;
    padding: 4.26vw 0 5vw;
  }

  .information__list dt {
    flex: auto;
    font-size: 4vw;
    padding-left: 2.8vw;
    position: relative;
    border: none;
  }

  .information__list dt::before {
    content: '';
    background-color: var(--color-orange);
    width: 0.533vw;
    height: 4.667vw;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
  }

  .information__list dd {
    font-size: 3.733vw;
    padding-left: 3.33vw;
  }

  .listStyle__disc li::before {
    left: -4.5vw;
  }

  .information__test-s {
    font-size: 3.4667vw;
  }

  .span-bold {
    margin-top: 3vw;
  }

  .dd-flex {
    display: block;
  }
}

/*==================================================
    アルバイト
==================================================*/
#part-time {
  padding-bottom: 6.8rem;

  .part-time__inner {
    position: relative;
    background-color: #fff;
  }

  .part-time__img {
    display: block;
  }

  @media screen and (max-width: 767px) {
    padding-bottom: 8.533vw;
  }
}

/*==================================================
    正社員
==================================================*/
#full-time {
  background-color: #fff;

  .full-time__img {
    position: relative;
  }

  .scrollButtons {
    margin-top: 4.8rem;
  }

  .scrollButton {
    background-color: #efebe9;
    width: fit-content;
  }

  .scrollButton:hover {
    background-color: #000;
  }

  .categorySquare-orange__wrapper {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    max-width: 1100px;
    width: 100%;
    height: 100%;
  }

  .categorySquare-orange__wrapper span {
    position: relative;
  }

  .information__contents {
    margin-top: 2rem;
  }

  @media screen and (max-width: 767px) {
    .scrollButtons {
      margin-top: 7.2vw;

      .scrollButton {
        align-items: flex-end;
        gap: 1.33vw;
      }
    }

    .scrollButton::after {
      margin-bottom: 1.5vw;
    }

    .information__contents {
      margin-top: 13.0667vw;
      padding: 0 2.133vw;
    }

    .information__contents:not(:first-of-type) {
      margin-top: 14.4vw;
    }

    .information__contents:last-of-type {
      padding-bottom: 10.4vw;
    }

    .recruitmentBox {
      margin: 5.33vw auto;
      width: 59.8667vw;
      height: 12.533vw;
    }

    .dd-flex {
      margin-top: 0;
    }
  }
}

/*==================================================
    ギャラリー
==================================================*/
#recruitGallery {
  padding-top: 3rem;

  picture {
    display: block;
  }

  @media screen and (max-width: 767px) {
    padding-top: 0;
  }
}
