@charset "UTF-8";
#recruit .ud-ttl,
#recruit .sec-copy,
#recruit .sec-subttl,
#recruit,
#recruit p {
  font-family: var(--font-zen);
}
#recruit .sec-ttl-en {
  font-family: var(--font-cherry);
}
#recruit .ud-ttl,
#recruit .sec-subttl,
#recruit .sec-copy {
  font-weight: var(--fw-bold);
}

#interview .hd {
  position: relative;
  max-width: 960px;
  margin-left: auto;
  margin-right: auto;
}

#interview .flower-img-01,
#interview .flower-img-03 {
  position: absolute;
  z-index: -1;
}
#interview .flower-img-01 {
  top: 0;
  right: 0;
  transform: translate(50%, 50%);
}
#interview .flower-img-03 {
  bottom: 0;
  right: 100%;
  transform: translateX(-10%);
}
@media screen and (max-width: 960px) {
  #interview .flower-img-03 {
    bottom: auto;
    top: 5%;
    right: auto;
    left: 0;
    transform: translate(-50%, 50%);
  }
}
/* interview card */
#interview .cards {
  gap: 48px;
}
#interview .card {
  width: calc(100% / 3 - 48px * 2 / 3);
  margin: 0 auto;
}
#interview .card img {
  width: 100%;
  height: auto;
  display: block;
}
#interview .txt {
  padding: 24px 0 0;
}
#interview .txt__top {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 8px;
}
#interview .txt__job {
  display: inline-block;
  padding: 6px 8px;
  background-color: var(--color-text);
  color: var(--color-white);
  font-weight: var(--fw-bold);
  letter-spacing: 0.35em;
  line-height: 1;
  border-radius: 4px;
}
#interview .txt__year {
  font-weight: var(--fw-medium);
}
#interview .txt__msg {
  margin: 0 0 8px;
  line-height: 1.5;
}
#interview .txt__tags {
  margin: 0 0 16px;
  font-size: var(--fs-14);
  line-height: 1.8;
  color: var(--color-pink-03);
  display: flex;
  flex-wrap: wrap;
  gap: 0 0.5em;
  font-weight: var(--fw-bold);
}
@media screen and (max-width: 1200px) {
  #interview .cards {
    gap: 24px;
  }
  #interview .card {
    width: calc(100% / 3 - 24px * 2 / 3);
  }

  #interview .txt,
  #interview .txt__msg {
    font-size: var(--fs-14);
  }
  #interview .txt__job,
  #interview .txt__year,
  #interview .txt__tags {
    font-size: var(--fs-12);
  }
}
@media screen and (max-width: 768px) {
  #interview .cards {
    flex-direction: column;
    gap: 32px;
  }
  #interview .card {
    width: 100%;
    max-width: 414px;
  }
  #interview .txt {
    padding-top: 16px;
  }
}

/* ==========================================================================
   interview detail (itv-01, itv-02)
   ========================================================================== */
#itv-01 {
  background-image: linear-gradient(224deg, #dec4ff4d, #ff94804d);
}
#itv-02 {
  background-image: linear-gradient(224deg, #acd0ff4d, #ffabcb4d);
}
#itv-03 {
  background-image: linear-gradient(224deg, #e991ae4d, #ffebb34d);
}
.itv-detail {
  position: relative;
}
.itv-detail .flower-img-01,
.itv-detail .flower-img-03 {
  position: absolute;
  z-index: -1;
}
.itv-detail .flower-img-03.first {
  bottom: 100%;
  right: 0;
  transform: translate(50%, 30%);
}
.itv-detail .flower-img-03.second {
  top: 100%;
  left: -5%;
  transform: translate(-50%, -50%);
}
.itv-detail__inr {
  display: flex;
  gap: 48px;
  align-items: flex-end;
}
.itv-detail__left {
  flex-shrink: 0;
  width: 520px;
}
.itv-detail__num {
  width: 146px;
  height: auto;
  margin: 0 0 40px;
  mix-blend-mode: multiply;
}
.itv-detail__quote {
  width: auto;
  margin-bottom: 40px;
  height: 60px;
}
.itv-detail__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0 0.5em;
  margin: 0 0 32px;
  font-size: var(--fs-14);
  color: var(--color-pink-03);
  font-weight: var(--fw-bold);
}
.itv-detail__photo {
  margin-bottom: 24px;
}
.itv-detail__photo img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}
.itv-detail__info {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  font-size: var(--fs-14);
  padding: 0 12px;
}
.itv-detail__info-left {
  display: flex;
  align-items: center;
  gap: 12px;
}
.itv-detail__job {
  display: inline-block;
  padding: 6px 8px;
  background-color: var(--color-text);
  color: var(--color-white);
  font-weight: var(--fw-bold);
  letter-spacing: 0.35em;
  line-height: 1;
  border-radius: 4px;
}
.itv-detail__name {
  font-size: var(--fs-25);
  letter-spacing: 0.28em;
  font-weight: var(--fw-semibold);
}
.itv-detail__right {
  flex: 1;
  min-width: 0;
}
.itv-detail__qa {
  margin: 0;
}
.itv-detail__qa > div {
  margin-bottom: 32px;
}
.itv-detail__qa > div:last-child {
  margin-bottom: 0;
}
.itv-detail__qa dt {
  margin: 0 0 12px;
  padding: 8px 32px;
  font-size: var(--fs-17);
  font-weight: var(--fw-bold);
  background-color: var(--color-white);
  border-radius: 999px;
  color: var(--color-text);
}
.itv-detail__qa dd {
  margin: 0;
  padding: 0 0 0 1em;
  letter-spacing: 0.11em;
}
@media screen and (max-width: 1200px) {
  .itv-detail__inr {
    gap: 32px;
  }
  .itv-detail__left {
    width: 45%;
  }
  .itv-detail__job,
  .itv-detail__year,
  .itv-detail__tags {
    font-size: var(--fs-12);
  }
  .itv-detail__name {
    font-size: var(--fs-22);
  }
  .itv-detail__qa dt {
    font-size: var(--fs-16);
  }
  .itv-detail__qa dd {
    font-size: var(--fs-15);
  }
}
@media screen and (max-width: 960px) {
  .itv-detail__inr {
    flex-direction: column;
    gap: 40px;
  }
  .itv-detail__left {
    width: 100%;
    max-width: 520px;
    margin: 0 auto;
    text-align: center;
    padding-bottom: 0;
  }
  .itv-detail__info {
    flex-direction: column;
    align-items: center;
    gap: 8px;
  }
  .itv-detail__info-left {
    justify-content: center;
  }
  .itv-detail__num {
    width: 100px;
    margin-bottom: 24px;
  }
  .itv-detail__quote,
  .itv-detail__tags {
    margin-bottom: 20px;
  }

  .itv-detail__qa dt {
    padding: 8px 20px;
  }
  .itv-detail .flower-img-03.first,
  .itv-detail .flower-img-03.second {
    transform: translate(0, 0);
  }
}
@media screen and (max-width: 600px) {
  .itv-detail__num {
    width: 80px;
  }
  .itv-detail__qa dt {
    font-size: var(--fs-15);
    padding: 4px 20px;
    line-height: 1.5;
  }
}

/* ==========================================================================
   job description（募集要項）
   ========================================================================== */
#job-desc {
  background-color: #ffe7d9;
  background-image:
    linear-gradient(
      90deg,
      #fbd9d94d 0%,
      transparent 40%,
      transparent 60%,
      #ffebb34d 100%
    ),
    radial-gradient(circle, #ffffff80 2px, transparent 2px),
    radial-gradient(circle, #ffffff80 2px, transparent 2px),
    radial-gradient(circle, #ffffff80 2px, transparent 2px),
    radial-gradient(circle, #ffffff80 2px, transparent 2px);
  background-position:
    0 0,
    0 0,
    24px 0,
    12px 24px,
    36px 24px;
  background-size:
    100% 100%,
    48px 48px,
    48px 48px,
    48px 48px,
    48px 48px;
  position: relative;
  z-index: 1;
}
#job-desc::before,
#job-desc::after {
  position: absolute;
  display: block;
  content: "";
  width: 30vw;
  height: auto;
  aspect-ratio: 873 / 1154;
  background-image: url(../../img/page/recruit/job-desc-bg.webp);
  background-repeat: no-repeat;
  background-size: contain;
  z-index: -1;
  pointer-events: none;
  mix-blend-mode: multiply;
}
#job-desc::before {
  top: 30%;
  left: 0;
  background-position: left center;
  transform: translateX(20%);
}
#job-desc::after {
  bottom: 20%;
  right: 0;
  background-position: right center;
  transform: scaleX(-1) translateX(20%);
}
#job-desc .job-desc__hd {
  position: relative;
}
#job-desc .job-desc__hd .flower-img-03 {
  position: absolute;
  top: 0;
  right: 100%;
  z-index: -1;
  transform: translateY(-50%);
}
#job-desc .job-desc__block {
  margin-bottom: 40px;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
}
#job-desc .job-desc__block:last-child {
  margin-bottom: 0;
}
#job-desc .job-desc__ttl {
  width: 100vw;
  margin-left: calc(-50vw + 50%);
  padding: 16px 24px;
  background-color: var(--color-pink-07);
  font-size: var(--fs-20);
  font-weight: var(--fw-bold);
  letter-spacing: 0.4em;
  text-align: center;
  margin-top: 0;
  margin-bottom: 16px;
}
#job-desc .job-desc__list {
  margin: 0;
  padding: 0;
  border-top: none;
}
#job-desc .job-desc__row {
  display: flex;
  border-top: 0.5px solid var(--color-text);
}
#job-desc .job-desc__row:first-child {
  border-top: none;
}
#job-desc .job-desc__row dt {
  flex-shrink: 0;
  width: 260px;
  padding: 20px;
  font-weight: var(--fw-medium);
}
#job-desc .job-desc__row dd {
  flex: 1;
  padding: 20px 24px;
  font-weight: var(--fw-medium);
  margin: 0;
}
#job-desc-note {
  position: relative;
  z-index: 5;
  background-color: #ffe7d9;
}
#job-desc-note::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-image: url(../../img/page/recruit/note-bg.webp);
  background-size: contain;
  background-position: top center;
  background-repeat: no-repeat;
  z-index: -2;
}
#job-desc-note .job-desc__note__ttl {
  font-size: var(--fs-25);
  font-weight: var(--fw-bold);
  letter-spacing: 0.325em;
}
#job-desc-note .job-desc__note__txt {
  max-width: 680px;
  position: relative;
}
#job-desc-note .job-desc__note__img {
  position: absolute;
  bottom: 0;
  left: calc((100vw - 1300px) / 2);
  z-index: -1;
  width: 155px;
  height: auto;
  aspect-ratio: 155 / 95;
}

@media screen and (max-width: 1400px) {
  #job-desc-note .job-desc__note__img {
    left: 5%;
    width: 100px;
  }
}
@media screen and (max-width: 768px) {
  #job-desc::before,
  #job-desc::after {
    width: 70vw;
  }
  #job-desc::before {
    transform: translateX(-30%);
  }
  #job-desc::after {
    transform: scaleX(-1) translateX(-30%);
  }
  #job-desc .job-desc__ttl {
    margin-bottom: 8px;
    padding: 12px;
  }
  #job-desc .job-desc__block {
    margin-bottom: 24px;
  }
  #job-desc .job-desc__row {
    flex-direction: column;
  }
  #job-desc .job-desc__row dt {
    width: 100%;
    background-color: rgba(255, 255, 255, 0.3);
    padding: 4px 8px;
    margin: 8px 0;
    font-size: var(--fs-15);
    font-weight: var(--fw-bold);
  }
  #job-desc .job-desc__row dd {
    padding: 12px 8px;
    padding-top: 0;
    font-size: var(--fs-15);
  }
  #job-desc-note::before {
    background-image: url(../../img/page/recruit/note-bg-sp.webp);
    width: 100%;
    background-size: cover;
    transform: none;
  }
  #job-desc-note .job-desc__note__ttl {
    font-size: var(--fs-20);
  }
  #job-desc-note .job-desc__note__img {
    left: 2.5%;
  }
}
/* --------------------------------
 flow
--------------------------------*/
#recruit #flow .flow-step__txt {
  margin-bottom: 0;
}

/* --------------------------------
 contact
--------------------------------*/
#recruit .contanct .small-txt {
  font-size: var(--fs-17);
  letter-spacing: 0.17em;
  color: var(--color-white);
  font-weight: var(--fw-regular);
  text-align: center;
  padding-top: 16px;
}