@charset "UTF-8";

.main-area{
  padding-top: 0;
}

:root{
  --mv-area-bg: url(../../../Contents/ThemeImage/recruit/environment/environment_mv_sp.jpg);
}

.recruit-section{
  padding-inline: 2rem;
  letter-spacing: 0.05em;
}

.environment-sub-title{
  margin-bottom: 3rem;
  font-size: 1.8rem;
  line-height: 1.5;
  text-align: center;
  font-weight: normal;
  font-weight: var(--fw-bold);
}

.environment-sub-title h2{
  font-weight: inherit;
}

.environment-sub-title--date{
  display: block;
  margin-top: 1rem;
  font-size: 1.3rem;
  text-align: center;
  line-height: 1;
}

.section-in-numbers{
  padding-block: 5rem 2.5rem;
}

.p-in-numbers{
  display: grid;
  gap: 0.6rem;
}

.p-in-number{
  border: 0.2rem solid #EDEDED;
  padding: 2.5rem 2.5rem;
}

.p-in-number__inner{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
}

.p-in-number__text-group{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  flex: 1;
}

.p-in-number-info{
  display: block;
  text-align: left;
}

.p-in-number-info-item__inner{
  display: flex;
  gap: 0.3rem;
  align-items: baseline;
}

.p-in-number img{
  width: 10.5rem;
}

.p-in-number-heading{
  margin-bottom: 1rem;
  font-size: 1.5rem;
  line-height: 1;
  font-weight: var(--fw-bold);
  text-align: center;
}

.p-in-number-info-item__label,
.p-in-number-info-item__heading{
  font-size: 1.4rem;
  font-weight: var(--fw-bold);
}

.p-in-number-info-item__label *,
.p-in-number-info-item__heading *{
  font-weight: var(--fw-bold);
}

.p-in-number-info-item__number{
  font-size: 2.8rem;
  line-height: 1.5;
  font-weight: var(--fw-medium);
  font-family: var(--font-en);
  letter-spacing: 0;
}

.p-in-number-info-item__number span{
  font-weight: var(--fw-medium);
 
}

.p-in-number-info-item__supplemental{
  display: inline-block;
  font-size: 1.2rem;
  font-weight: var(--fw-bold);
  text-indent: -0.5em;
}

.p-in-number-info-item__caption{
  font-size: 10px;
  font-weight: var(--fw-light);
}

.p-in-number:last-child{
  padding: 3rem 1.5rem;
}

.p-in-number:last-child .p-in-number__text-group img{
  margin-bottom: 1.5rem;
}

.p-in-number:last-child .p-in-number__text-group{
  width: auto;
}

.p-in-number:last-child .p-in-number-heading{
  margin-bottom: 2rem;
}

.p-in-number:last-child .p-in-number__inner{
  align-items: flex-start;
}

.p-in-number:last-child .p-in-number-info-item__inner{
  white-space: nowrap;
  justify-content: center;
}



/* welfare */
.section-welfare{
  padding-block: 2.5rem 5rem;
}

.p-welfares{
  display: grid;
  gap: 2rem;
}

.p-welfare{
  display: flex;
  align-items: flex-start;
  gap: 1.7rem;
}

.p-welfare-info__heading{
  margin-top: 1.9rem;
  margin-bottom: 1.3rem;
  font-size: 1.5rem;
  line-height: 1;
  font-weight: var(--fw-bold);
}

.p-welfare > img{
  width: 8.5rem;
}

.p-welfare-info__text{
  font-size: 1.3rem;
  line-height: 1.69230769231;
}

/* Q&A */
.section-faq{
  padding-block: 5rem;
  background-color: #F8F8F8;
}

.c-accordion-list{
  display: grid;
  gap: 1rem;
}

.c-accordion{
  border-radius: 1rem;
  background-color: var(--color-white);
}

.c-accordion-title{
  position: relative;
  padding-right: 4rem;
  font-size: 1.4rem;
  list-style: none;
  line-height: 1.6;
  transition: all 0.3s;
}

.c-accordion-title:hover{
  opacity: 0.7;
}

.c-accordion-title:hover .c-accordion-icon{
  color: #C7AF72;
}

.c-accordion-title__inner{
  display: flex;
  align-items: baseline;
  padding: 1.5rem 2rem;
  font-weight: var(--fw-bold);
}

summary::-webkit-details-marker {
  display:none;
}
.c-accordion-title::before, .c-accordion-title::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 2rem;
  transform: translateY(-50%);
  margin: auto;
  width: 1.8rem;
  height: 0.2rem;
  background-color: var(--color-black);
  transition: all 0.3s;
}
.c-accordion-title::after {
  transform: translateY(-50%) rotate(90deg);
}
.c-accordion-title.open::after {
  transform: translateY(-50%) rotate(180deg);
  opacity: 0;
}
.c-accordion[data-state-accordion=opened] .c-accordion-title::after {
  transform: translateY(-50%) rotate(180deg);
  opacity: 0;
}

.c-accordion-icon{
  margin-right: 1rem;
  font-size: 2rem;
  font-weight: var(--fw-medium);
  font-family: var(--font-en);
  transition: all 0.3s;
}

.c-accordion-desc{
  padding: 0 2rem 1.5rem;
  font-size: 1.3rem;
  line-height: 1.69230769231;
}

.c-accordion-desc__inner{
  display: flex;
  align-items: baseline;
  padding-top: 1.6rem;
  border-top: 1px solid #D5D5D5;
}

.c-accordion-desc__inner .c-accordion-icon{
  color: #C7AF72;
}

.p-imgslide{
  padding: 5rem 0 0;
  background-color: var(--color-white);
}

@media (min-width: 768px) {

  .environment{
    --inner-width: min(85%, 120rem); 
  }

  .recruit-section{
    max-width: var(--inner-width);
    padding-inline: 0;
    margin: 0 auto;
  }

  .environment-sub-title{
    margin-bottom: 4rem;
    font-size: 2.4rem;
  }

  .environment-sub-title--date{
    margin-top: 2rem;
  }

  .section-in-numbers{
    padding-block: 10rem 5rem;
  }

  .p-in-numbers{
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(4, 1fr);
    gap: 2rem;
  }

  .p-in-number{
    padding: 4rem 1rem 2rem;
  }

  .p-in-number:nth-of-type(1) { grid-area: 1 / 1 / 3 / 2; }
  .p-in-number:nth-of-type(2) { grid-area: 1 / 2 / 3 / 3; }
  .p-in-number:nth-of-type(3) { grid-area: 1 / 3 / 3 / 4; }
  .p-in-number:nth-of-type(4) { grid-area: 1 / 4 / 3 / 5; }
  .p-in-number:nth-of-type(5) { grid-area: 3 / 1 / 4 / 3; }
  .p-in-number:nth-of-type(6) { grid-area: 4 / 1 / 5 / 3; }
  .p-in-number:nth-of-type(7) { grid-area: 3 / 3 / 5 / 5; }

  .p-in-number__inner{
    flex-direction: column;
    gap: 2rem;
  }

  .p-in-number__text-group{
    flex: unset;
  }

  .p-in-number-info{
    text-align: center;
  }

  .p-in-number:nth-of-type(-n + 4) .p-in-number__inner > img{
    order: 1;
  }

  .p-in-number:nth-of-type(-n + 4) .p-in-number__inner .p-in-number-heading{
    order: 0;
  }

  .p-in-number:nth-of-type(-n + 4) .p-in-number__inner .p-in-number-info{
    order: 2;
  }

  .p-in-number:nth-of-type(-n + 4) .p-in-number__text-group{
    display: contents;
    width: auto;
  }

  .p-in-number:nth-of-type(3) .p-in-number__inner > img,
  .p-in-number:nth-of-type(4) .p-in-number__inner > img{
    margin-bottom: 1.5rem;
  }

  .p-in-number:nth-of-type(5),
  .p-in-number:nth-of-type(6){
    padding: 2.5rem 1rem;
  }

  .p-in-number:nth-of-type(5) .p-in-number__inner,
  .p-in-number:nth-of-type(6) .p-in-number__inner{
    flex-direction: row;
    align-items: center;
    height: 100%;
    gap: 2.5rem;
  }

  .p-in-number:nth-of-type(5) .p-in-number__inner .p-in-number__text-group,
  .p-in-number:nth-of-type(6) .p-in-number__inner .p-in-number__text-group{
    gap: 1rem;
    width: 21rem;
    margin-top: 1rem;
  }

  .p-in-number-info-item__inner{
    gap: 0.3rem;
  }

  .p-in-number img{
    width: 16.5rem;
  }

  .p-in-number-heading{
    margin-bottom: 0.5rem;
    font-size: 1.8rem;
  }

  .p-in-number-info-item__label,
  .p-in-number-info-item__heading{
    font-size: 1.6rem;
  }

  .p-in-number-info-item__number{
    font-size: 3.5rem;
    line-height: 1.6;
  }

  .p-in-number-info-item__supplemental{
    margin-top: 0.5rem;
    font-size: 1.6rem;
    text-indent: -0.5em;
  }

  .p-in-number-info-item__caption{
    font-size: 10px;
    font-weight: var(--fw-light);
  }

  .p-in-number:last-child{
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 3rem 1.5rem;
  }

  .p-in-number:last-child .p-in-number__text-group{
    flex: unset;
  }

  .p-in-number:last-child .p-in-number__text-group:first-child{
    width: 18rem;
  }

  .p-in-number:last-child .p-in-number-heading{
    margin-bottom: 2rem;
  }

  .p-in-number:last-child .p-in-number__text-group img{
    margin-bottom: 3.2rem;
  }

  .p-in-number:last-child .p-in-number__inner{
    flex-direction: row;
    gap: 8rem;
  }

  /* welfare */
  .section-welfare{
    padding-block: 5rem 10rem;
  }

  .p-welfares{
    grid-template-columns: repeat(2,1fr);
    gap: 3.2rem 4.4rem;
  }

  .p-welfare{
    display: flex;
    align-items: flex-start;
    gap: 1.7rem;
  }

  .p-welfare-info__heading{
    margin-top: 1.9rem;
    margin-bottom: 1.3rem;
    font-size: 1.5rem;
    line-height: 1;
    font-weight: var(--fw-bold);
  }

  .p-welfare > img{
    width: 8.5rem;
  }

  .p-welfare-info__text{
    font-size: 1.3rem;
    line-height: 1.69230769231;
  }

  /* Q&A */
  .section-faq{
    max-width: 100%;
    padding-block: 10rem;
  }

  .section-faq .environment-sub-title{
    font-size: 2rem;
  }

  .section-faq .c-accordion-list{
    max-width: calc(var(--inner-width) * 0.8333);
    padding-inline: 0;
    margin: 0 auto;
  }

  .c-accordion-list{
    gap: 1.5rem;
  }

  .c-accordion{
    cursor: pointer;
  }

  .c-accordion-title{
    padding-right: 7.1rem;
    font-size: 1.5rem;
  }

  .c-accordion-title__inner{
    padding: 1.5rem 2rem;
    align-items: center; 
  }

  .c-accordion-title::before, .c-accordion-title::after {
    right: 2.5rem;
  }

  .c-accordion-icon{
    margin-right: 0.7rem;
    font-size: 2.5rem;
    line-height: 1.44;
  }

  .c-accordion-desc{
    padding: 0 2.5rem 2rem;
    font-size: 1.3rem;
    line-height: 1.5;
  }

  .p-imgslide{
    padding: 10rem 0 0;
  }

}