@charset "utf-8";

/* *****************************************************************************

  jobs style

***************************************************************************** */
/* voice-box */
.voice-box{
  display: flex;
	justify-content: space-between;
}
.voice-box > .-item{
  width: 47.9604%;
  display: flex;
	justify-content: space-between;
  align-items: center;
}
.voice-box > .-item > .-img{
  width: 25.7732%;
}
.voice-box > .-item > .-img > img{
  width: 100%;
}
.voice-box > .-item > .-text{
  width: 66.4948%;
}
.voice-box > .-item > .-text > p{
  font-size: 1.6rem;
  line-height: 1.75;
}

@media print, screen and (max-width: 1200px){
  /* voice-box */
  .voice-box{
    display: block;
  }
  .voice-box > .-item{
    width: 100%;
    margin-top: 4rem;
  }
  .voice-box > .-item > .-img{
    width: 100px;
    margin-right: 3.2rem;
  }
  .voice-box > .-item > .-text{
    width: 100%;
    flex: 1;
  }
}

@media print, screen and (max-width: 760px){
  /* voice-box */
  .voice-box > .-item > .-img{
    width: 25.7732%;
  }
  .voice-box > .-item > .-text{
    width: 66.4948%;
  }
}

/* *****************************************************************************

  jobs list style

***************************************************************************** */
/* jobs-intro */
.jobs-intro{
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
}
.jobs-intro > .-img{
  max-width: 809px;
  margin-left: auto;
  margin-right: auto;
}
.jobs-intro > .-img > img{
  width: 100%;
}
.jobs-intro > .-text{
  margin-top: 10rem;
  max-width: 809px;
  margin-left: auto;
  margin-right: auto;
}

@media print, screen and (max-width: 1000px){
  /* jobs-intro */
  .jobs-intro > .-text{
    max-width: none;
  }
  .jobs-intro > .-text{
    margin-top: 8rem;
  }
}

@media print, screen and (max-width: 1000px){
  /* jobs-intro */
  .jobs-intro > .-text{
    margin-top: 6rem;
  }
}

/* job-list */
.job-list{
  margin-top: 7.2rem;
  display: flex;
  flex-wrap: wrap;
  column-gap: 4rem;
  row-gap: 3rem;
}
.job-list-item{
  width: calc((100% - 4rem) / 2);
}
.job-list-item > a{
  display: flex;
  align-items: center;
  border: 1px solid #c3c6c8;
  background-color: var(--color-white);
  border-radius: 0.6rem;
  height: 100%;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
  background: var(--color-white) url(/recruit/assets/images/arrow-list-red.svg) right 1.8rem center no-repeat;
  background-size: 30px auto;
}
.job-list-item > a:hover{
  background-color: var(--color-red);
  border-color: var(--color-red);
  color: #ffffff;
  background: var(--color-red) url(/recruit/assets/images/arrow-list-white.svg) right 1.8rem center no-repeat;
  background-size: 30px auto;
}
.job-list-item > a > .-img{
  width: 28.3019%;
  flex-shrink: 0;
}
.job-list-item > a > .-img > img{
  width: 100%;
}
.job-list-item > a > .-body{
  flex: 1;
  white-space: nowrap;
}
.job-list-item > a > .-body > .-number{
  font-size: 1.8rem;
  font-weight: 800;
  color: var(--color-red);
  line-height: 1;
  margin-bottom: 1.2rem;
}
.job-list-item > a:hover > .-body > .-number{
  color: #ffffff;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
.job-list-item > a > .-body > .-title > .-ja{
  font-size: 2.6rem;
  font-weight: 700;
  line-height: 1;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
.job-list-item > a > .-body > .-title > .-ja.-two-column{
  display: flex;
  align-items: center;
}
.job-list-item > a > .-body > .-title > .-ja.-two-column > span:nth-child(2){
  font-size: 1.3rem;
  padding-left: 0.5em;
}

@media screen and (max-width: 1240px){
  /* job-list */
  .job-list{
    column-gap: 3.2258vw;
    row-gap: 2.4194vw;
  }
  .job-list-item{
    width: calc((100% - 3.2258vw) / 2);
  }
  .job-list-item > a{
    background-position: right 1.4516vw center;
    background-size: 2.4194vw auto;
  }
  .job-list-item > a:hover{
    background-position: right 1.4516vw center;
    background-size: 2.4194vw auto;
  }
  .job-list-item > a > .-body > .-number{
    font-size: 1.4516vw;
    margin-bottom: 0.9677vw;
  }
  .job-list-item > a > .-body > .-title > .-ja{
    font-size: 2.0968vw;
    margin-top: 0.8065vw;
  }
  .job-list-item > a > .-body > .-title > .-ja.-two-column > span:nth-child(2){
    font-size: 1.0484vw;
  }
}

@media screen and (max-width: 1000px){
  /* job-list */
  .job-list{
    column-gap: 2.4174vw;
    margin-top: 6rem;
  }
  .job-list-item{
    width: calc((100% - 2.4174vw) / 2);
  }
}

@media screen and (max-width: 760px){
  /* job-list */
  .job-list{
    column-gap: 1.5rem;
    row-gap: 2rem;
    margin-top: 4rem;
  }
  .job-list-item{
    width: 100%;
  }
  .job-list-item > a > .-body > .-number{
    font-size: 2.8421vw;
    margin-bottom: 2.0526vw;
  }
  .job-list-item > a > .-body > .-title > .-ja{
    font-size: 3.9474vw;
    margin-top: 2.8421vw;
  }
  .job-list-item > a > .-body > .-title > .-ja.-two-column > span:nth-child(2){
    font-size: 2.2237vw;
  }
  .job-list-item > a{
    background-position: right 2.8421vw center;
    background-size: 4.7368vw auto;
  }
  .job-list-item > a:hover{
    background-position: right 2.8421vw center;
    background-size: 4.7368vw auto;
  }
}

/* *****************************************************************************

  business produce style

***************************************************************************** */
