@charset "UTF-8";
/* ///////////////////////////////////////////////

採用情報 のスタイル

/////////////////////////////////////////////// */
/* ページタイトル */
.pagetitle {
  background-image: url(../img/recruit/bg-pagetitle.jpg);
}

#intro {
  padding-left: calc(50% - 450px);
  padding-right: calc(50% - 450px);
  padding-top: 150px;
  padding-bottom: 50px;
  display: flex;
  align-items: flex-end;
}

@media screen and (max-width: 960px) {
  #intro {
    padding-left: 30px;
    padding-right: 30px;
  }
}

@media (max-width: 960px) {
  #intro {
    padding-top: 100px;
    padding-bottom: 0;
    flex-direction: column;
  }
}

#intro .text {
  width: 50%;
}

#intro .text .lead {
  margin-bottom: 1em;
  font-size: 24rem;
  font-weight: bold;
}

@media (max-width: 960px) {
  #intro .text {
    width: 100%;
  }
}

#intro .image {
  width: 50%;
  padding-left: 100px;
}

#intro .image img {
  max-width: inherit;
}

@media (max-width: 960px) {
  #intro .image {
    margin-top: 30px;
    width: 100%;
    padding-left: 0;
  }
  #intro .image img {
    max-width: 100%;
  }
}

/* 採用実績 */
#employment_record {
  padding-left: calc(50% - 450px);
  padding-right: calc(50% - 450px);
  padding-top: 150px;
  padding-bottom: 100px;
}

@media screen and (max-width: 960px) {
  #employment_record {
    padding-left: 30px;
    padding-right: 30px;
  }
}

@media (max-width: 960px) {
  #employment_record {
    padding-top: 100px;
    padding-bottom: 0;
  }
}

#employment_record table {
  width: 100%;
}

#employment_record table thead td {
  padding: 0 0 .5em;
  border-bottom: 1px solid #000;
  font-weight: bold;
  font-family: 'Roboto', sans-serif;
}

#employment_record table tbody th, #employment_record table tbody td {
  padding: 1em 0;
  border-top: 1px solid #C6C6C6;
}

#employment_record table tbody th {
  white-space: nowrap;
  padding-right: 1em;
}

#employment_record table tbody td:nth-of-type(1) {
  white-space: nowrap;
  padding-right: 1em;
}

@media (max-width: 960px) {
  #employment_record table th, #employment_record table td {
    padding-right: 1em;
  }
}

/* 募集要項 */
#requirements {
  padding-left: calc(50% - 450px);
  padding-right: calc(50% - 450px);
  padding-top: 150px;
  padding-bottom: 50px;
}

@media screen and (max-width: 960px) {
  #requirements {
    padding-left: 30px;
    padding-right: 30px;
  }
}

@media (max-width: 960px) {
  #requirements {
    padding-top: 100px;
    padding-bottom: 0;
  }
}

#requirements table {
  width: 100%;
}

#requirements table th, #requirements table td {
  padding: 1em 0 2.5em;
  border-top: 1px solid #C6C6C6;
  vertical-align: top;
}

#requirements table th {
  font-weight: bold;
  white-space: nowrap;
  padding-right: 1em;
}

#requirements table .colorG {
  color: #2E8E39;
}

#requirements table em {
  display: inline-block;
  margin-top: .7em;
}

#requirements table li + li {
  margin-top: 1em;
}

#requirements table small {
  display: inline-block;
  margin-top: .3em;
  font-size: 12rem;
  line-height: 1.5;
}

/* 採用に関してのお問い合わせ */
#inquiries {
  padding-left: calc(50% - 450px);
  padding-right: calc(50% - 450px);
  padding-top: 150px;
  padding-bottom: 200px;
}

@media screen and (max-width: 960px) {
  #inquiries {
    padding-left: 30px;
    padding-right: 30px;
  }
}

@media (max-width: 960px) {
  #inquiries {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}

#inquiries ul {
  margin-top: 2.5em;
}

#inquiries ul li {
  border-top: 1px solid #C6C6C6;
}

#inquiries .tel {
  display: flex;
  align-items: center;
  padding: 50px 20px;
}

#inquiries .tel .text {
  width: calc(100% - 300px);
}

#inquiries .tel .text p {
  line-height: 1.4;
}

#inquiries .tel .text .phone {
  font-weight: 700;
  font-size: 36rem;
}

#inquiries .tel .text .phone a {
  font-size: 54rem;
  text-decoration: none;
}

#inquiries .tel .btnBlack {
  width: 300px;
  height: 90px;
}

@media (max-width: 960px) {
  #inquiries .tel {
    flex-direction: column;
    padding: 30px 0px;
  }
  #inquiries .tel .text {
    width: 100%;
    margin-bottom: 20px;
  }
  #inquiries .tel .text .phone {
    font-size: 30rem;
  }
  #inquiries .tel .text .phone a {
    font-size: 42rem;
  }
  #inquiries .tel .btnBlack {
    width: 100%;
  }
}

#inquiries .mynavi {
  padding-top: 100px;
}

#inquiries .mynavi a {
  display: flex;
  justify-content: center;
  flex-direction: column;
  width: 720px;
  max-width: 100%;
  height: 200px;
  padding: 0 70px;
  border: 5px solid #000;
  font-weight: bold;
  text-decoration: none;
}

#inquiries .mynavi a .text {
  margin-top: 1em;
}

@media (max-width: 960px) {
  #inquiries .mynavi {
    padding-top: 50px;
  }
  #inquiries .mynavi a {
    padding: 40px 30px 70px;
    height: inherit;
  }
}