@charset "UTF-8";
/* ==========================================================================
職種紹介ページ
========================================================================== */
.jobs-img img {
  width: 100%;
}

/* ==================================
専攻×職種マトリクス
================================== */
.matrix-content {
  display: flex;
  justify-content: center;
}
@media (max-width: 959px) {
  .matrix-content .width50 {
    display: none;
  }
}
.matrix-content img {
  width: 100%;
}

@media (max-width: 959px) {
  .matrix-box-wrapper {
    overflow-x: auto;
    width: 100%;
  }
}

.main-content {
  overflow: unset;
}

.matrix-box {
  position: relative;
}
@media (max-width: 959px) {
  .matrix-box {
    overflow-x: scroll;
    width: 100%;
  }
}

.matrix-box-head {
  position: sticky;
  top: 99px;
}
@media (max-width: 1440px) {
  .matrix-box-head {
    top: 6.875vw;
  }
}
@media (max-width: 959px) {
  .matrix-box-head {
    min-width: 700px;
    top: 0;
    border: 1px solid #053c7e;
  }
}

@media (max-width: 959px) {
  .matrix-box-body {
    min-width: 700px;
  }
}

/* ==================================
職種一覧
================================== */
.job-category-link {
  display: flex;
  justify-content: center;
  gap: 30px;
  margin-top: 60px;
}
@media (max-width: 1440px) {
  .job-category-link {
    gap: 2.0833333333vw;
    margin-top: 4.1666666667vw;
  }
}
@media (max-width: 959px) {
  .job-category-link {
    gap: 10px;
    margin-top: 20px;
  }
}
.job-category-link .btn {
  max-width: 574px;
  position: relative;
  height: 82px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  border-radius: 40px;
  font-size: 25px;
  letter-spacing: 0.12em;
}
@media (max-width: 1440px) {
  .job-category-link .btn {
    max-width: 39.8611111111vw;
    height: 5.6944444444vw;
    border-radius: 2.7777777778vw;
    font-size: 1.7361111111vw;
  }
}
@media (max-width: 959px) {
  .job-category-link .btn {
    max-width: 162px;
    min-width: 13em;
    height: 38px;
    border-radius: 40px;
    font-size: 12px;
    letter-spacing: 0.01em;
  }
}
.job-category-link .btn::after {
  content: "";
  position: absolute;
  background: url("./img/jobs/job-category-arrow.svg") no-repeat center center/12px 6px;
  border: 2px solid #fff;
  border-radius: 50px;
  width: 36px;
  height: 36px;
  right: 20px;
}
@media (max-width: 1440px) {
  .job-category-link .btn::after {
    background: url("./img/jobs/job-category-arrow.svg") no-repeat center center/0.8333333333vw 0.4166666667vw;
    border-radius: 3.4722222222vw;
    width: 2.5vw;
    height: 2.5vw;
    right: 1.3888888889vw;
  }
}
@media (max-width: 959px) {
  .job-category-link .btn::after {
    background: url("./img/jobs/job-category-arrow.svg") no-repeat center center/6px 3px;
    border-radius: 50px;
    width: 18px;
    height: 18px;
    right: 10px;
  }
}
.job-category-link .btn:nth-child(1) {
  background: #053c7e;
}
.job-category-link .btn:nth-child(2) {
  background: #3fb24f;
}
@media (max-width: 959px) {
  .job-category-link .btn:nth-child(2) {
    padding-right: 10px;
  }
}

.job-category-title {
  background: #053c7e;
  height: 250px;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media (max-width: 1440px) {
  .job-category-title {
    height: 17.3611111111vw;
  }
}
@media (max-width: 959px) {
  .job-category-title {
    height: 125px;
  }
}
.job-category-title .ja {
  font-size: 31px;
  letter-spacing: 0.12em;
  color: #fff;
  position: relative;
  z-index: 2;
}
@media (max-width: 1440px) {
  .job-category-title .ja {
    font-size: 2.1527777778vw;
  }
}
@media (max-width: 959px) {
  .job-category-title .ja {
    font-size: 18px;
  }
}
.job-category-title .en {
  font-size: 160px;
  letter-spacing: 0.02em;
  color: #003076;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  line-height: 1;
  z-index: 1;
  opacity: 0.7;
}
@media (max-width: 1440px) {
  .job-category-title .en {
    font-size: 11.1111111111vw;
  }
}
@media (max-width: 959px) {
  .job-category-title .en {
    font-size: 48px;
    font-size: 12.8vw;
  }
}
.job-category-title--green {
  background: #3fb24f;
}
.job-category-title--green .en {
  color: #2ba33d;
}

.job-category-content {
  display: flex;
}
@media (max-width: 959px) {
  .job-category-content .width50 {
    display: none;
  }
}

.job-category-item {
  display: flex;
}
@media (max-width: 959px) {
  .job-category-item:last-child img {
    aspect-ratio: 168/200;
  }
}

.job-category-left {
  width: 29.24%;
}
@media (max-width: 959px) {
  .job-category-left {
    width: 44.8%;
  }
}
.job-category-left img {
  width: 100%;
}
@media (max-width: 959px) {
  .job-category-left img {
    aspect-ratio: 168/180;
    object-fit: cover;
  }
}

.job-category-right {
  width: 895px;
  width: 70.75%;
  padding: 0 50px;
  opacity: 0.7;
}
@media (max-width: 1440px) {
  .job-category-right {
    padding: 0 3.4722222222vw;
  }
}
@media (max-width: 959px) {
  .job-category-right {
    width: 55.2%;
    padding: 0 20px;
  }
}
.job-category-right .fadein {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  height: 100%;
}

.job-category-item-title {
  font-size: 30px;
  letter-spacing: 0.12em;
}
@media (max-width: 1440px) {
  .job-category-item-title {
    font-size: 2.0833333333vw;
  }
}
@media (max-width: 959px) {
  .job-category-item-title {
    font-size: 15px;
  }
}

.job-category-text {
  letter-spacing: 0.08em;
  font-family: "kinto-sans", sans-serif;
  font-size: 20px;
  margin-top: 20px;
}
@media (max-width: 1440px) {
  .job-category-text {
    font-size: 1.3888888889vw;
    margin-top: 1.3888888889vw;
  }
}
@media (max-width: 959px) {
  .job-category-text {
    font-size: 12px;
    margin-top: 5px;
    letter-spacing: -0.02em;
    line-height: 1.6666666667;
  }
}/*# sourceMappingURL=jobs.css.map */