@charset "UTF-8";
/**************************************/
/* -------------------------
 * 共通
 * ------------------------- */
/* 改行 */
.br-834 {
  display: none;
}
@media (max-width: 834px) {
  .br-834 {
    display: block;
  }
}

.no-br-834 {
  display: block;
}
@media (max-width: 834px) {
  .no-br-834 {
    display: none;
  }
}

/* フォント */
.f150 {
  font-size: 15rem;
}
@media (max-width: 1334px) {
  .f150 {
    font-size: 10rem;
  }
}
@media (max-width: 834px) {
  .f150 {
    font-size: 3rem;
  }
}

.f48 {
  font-size: 4.8rem;
}
@media (max-width: 1334px) {
  .f48 {
    font-size: 3.8rem;
  }
}
@media (max-width: 834px) {
  .f48 {
    font-size: 2.8rem;
  }
}

.f34 {
  font-size: 3.4rem;
}
@media (max-width: 1334px) {
  .f34 {
    font-size: 2.8rem;
  }
}
@media (max-width: 834px) {
  .f34 {
    font-size: 2.3rem;
  }
}

/* インナー */
.inner--1350 {
  max-width: 1350px;
  width: 90%;
  margin-inline: auto;
}

/* セクション余白 */
.pad--120 {
  padding-block: 120px;
}
@media (max-width: 1334px) {
  .pad--120 {
    padding-block: 8vw;
  }
}
@media (max-width: 834px) {
  .pad--120 {
    padding-block: 8vw;
  }
}
@media (max-width: 500px) {
  .pad--120 {
    padding-block: 45px;
  }
}

/* テキスト */
.show-mess > span.char {
  width: auto;
}

/* スタイル*/
:root {
  --red: #d50000;
  --gradient-red: linear-gradient(90deg, #d50000, #ff2c00);
}

/* -------------------------
 * イントロ
 * ------------------------- */
.job-introduction-intro {
  background: url(../img/job-introduction/intro_bg.webp) no-repeat center center/cover;
  position: relative;
  min-height: 100rem;
  overflow: clip;
}
@media (max-width: 834px) {
  .job-introduction-intro {
    min-height: 70rem;
  }
}

.job-introduction-intro__catch {
  -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
          writing-mode: vertical-rl;
  position: absolute;
  right: 0rem;
  top: 5rem;
  line-height: 0.9;
}
@media (max-width: 834px) {
  .job-introduction-intro__catch {
    right: 0;
    line-height: 1.7;
    top: 2rem;
  }
}

.job-introduction-intro__body {
  position: absolute;
  left: 5%;
  bottom: 10rem;
  max-width: 75rem;
}
@media (max-width: 834px) {
  .job-introduction-intro__body {
    left: 0;
    padding-inline: 5%;
    bottom: 5rem;
  }
}

.job-introduction-intro__lead {
  margin-bottom: 4rem;
}
@media (max-width: 834px) {
  .job-introduction-intro__lead {
    font-size: 2rem;
    margin-bottom: 2rem;
  }
}

/* -------------------------
 * 現場を動かす
 * 施工管理の5大管理
 * ------------------------- */
.job-introduction-management {
  background-color: #f7f7f7;
}

.job-introduction-management__list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 5rem;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media (max-width: 1240px) {
  .job-introduction-management__list {
    gap: 3rem;
  }
}
@media (max-width: 834px) {
  .job-introduction-management__list {
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
  }
  .job-introduction-management__list > .--head {
    grid-column: 1/-1;
  }
}
@media (max-width: 639px) {
  .job-introduction-management__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}

.job-introduction-management__list-item:not(:first-child) {
  padding: 2rem 2rem 4rem 4rem;
  border-radius: 10px;
  background-color: #fff;
}
@media (max-width: 1240px) {
  .job-introduction-management__list-item:not(:first-child) {
    padding: 2rem;
  }
}
.job-introduction-management__list-item:nth-child(2) .job-introduction-management__list-item-icon img {
  aspect-ratio: 1;
  width: 4rem;
  height: auto;
}
@media (max-width: 1240px) {
  .job-introduction-management__list-item:nth-child(2) .job-introduction-management__list-item-icon img {
    width: 2rem;
  }
}
.job-introduction-management__list-item:nth-child(3) .job-introduction-management__list-item-icon img {
  aspect-ratio: 33/45;
  width: 3.3rem;
  height: auto;
}
@media (max-width: 1240px) {
  .job-introduction-management__list-item:nth-child(3) .job-introduction-management__list-item-icon img {
    width: 1.6rem;
  }
}
.job-introduction-management__list-item:nth-child(4) .job-introduction-management__list-item-icon img {
  aspect-ratio: 42/39;
  width: 4.2rem;
  height: auto;
}
@media (max-width: 1240px) {
  .job-introduction-management__list-item:nth-child(4) .job-introduction-management__list-item-icon img {
    width: 2.1rem;
  }
}
.job-introduction-management__list-item:nth-child(5) .job-introduction-management__list-item-icon img {
  aspect-ratio: 42/45;
  width: 4.2rem;
  height: auto;
}
@media (max-width: 1240px) {
  .job-introduction-management__list-item:nth-child(5) .job-introduction-management__list-item-icon img {
    width: 2.1rem;
  }
}
.job-introduction-management__list-item:nth-child(6) .job-introduction-management__list-item-icon img {
  aspect-ratio: 40/42;
  width: 4rem;
  height: auto;
}
@media (max-width: 1240px) {
  .job-introduction-management__list-item:nth-child(6) .job-introduction-management__list-item-icon img {
    width: 2rem;
  }
}
.job-introduction-management__list-item.--head {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 5rem;
}
@media (max-width: 834px) {
  .job-introduction-management__list-item.--head {
    gap: 2rem;
    margin-bottom: 1rem;
  }
}

.job-introduction-management__ttl-wrap {
  font-size: clamp(2.4rem, 2.8vw, 4.8rem);
}

.job-introduction-management__list-item-head {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.job-introduction-management__list-item-ttl-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 1.2rem;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media (max-width: 1240px) {
  .job-introduction-management__list-item-ttl-wrap {
    gap: 0.6rem;
  }
}

@media (max-width: 1240px) {
  .job-introduction-management__list-item-ttl {
    font-size: 2rem;
  }
}

.job-introduction-management__list-item-num {
  background: var(--gradient-red);
  width: 4rem;
  height: 2.5rem;
  display: grid;
  place-items: center;
  border-radius: 50px;
  -webkit-transform: translateY(0.3rem);
          transform: translateY(0.3rem);
}
@media (max-width: 1240px) {
  .job-introduction-management__list-item-num {
    -webkit-transform: translateY(0.1rem);
            transform: translateY(0.1rem);
    width: 3rem;
    height: 1.8rem;
    font-size: 1rem;
  }
}

.job-introduction-management__list-item-icon {
  width: 8rem;
  height: 8rem;
  border-radius: 10px;
  background-color: #f6e8e7;
  display: grid;
  place-items: center;
}
@media (max-width: 1240px) {
  .job-introduction-management__list-item-icon {
    width: 5.5rem;
    height: 5.5rem;
    -ms-flex-negative: 0;
        flex-shrink: 0;
  }
}

.job-introduction-management__list-item-lead {
  margin-block: 3.2rem 2.8rem;
}
@media (max-width: 1240px) {
  .job-introduction-management__list-item-lead {
    font-size: 1.8rem;
    margin-block: 1.6rem 1.2rem;
  }
}

/* -------------------------
 * 施工管理のやりがい
 * ------------------------- */
.job-introduction-challenging {
  background-color: #d7e3ec;
}

.job-introduction-challenging__ttl-wrap {
  margin-bottom: 10rem;
}
@media (max-width: 834px) {
  .job-introduction-challenging__ttl-wrap {
    margin-bottom: 0;
  }
}

.job-introduction-challenging__inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}

.job-introduction-challenging__head {
  position: sticky;
  top: 100px;
  right: 0;
  width: 28.5vw;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
  padding: 0 4vw 0 5%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.job-introduction-challenging__head-mess {
  -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
          writing-mode: vertical-rl;
  letter-spacing: 0.05em;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.job-introduction-challenging__link {
  margin-top: 50px;
}

.job-introduction-challenging__box-area {
  width: 71.5vw;
  position: relative;
  z-index: 2;
}

.job-introduction-challenging__box {
  position: relative;
  z-index: 3;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  border-radius: 0;
}

.job-introduction-challenging__box01 {
  position: sticky;
  z-index: 2;
  top: 100px;
  left: 0;
}

.job-introduction-challenging__box02 {
  position: sticky;
  z-index: 2;
  top: 100px;
  left: 0;
  margin-top: 20px;
}

.job-introduction-challenging__box03 {
  margin-top: 20px;
}

.job-introduction-challenging__box picture {
  width: 100%;
  height: 100%;
}

@supports (-webkit-touch-callout: none) {
  .job-introduction-challenging__box02 {
    z-index: 9999;
  }
  .job-introduction-challenging__box03 {
    z-index: 10000;
  }
}
.job-introduction-challenging__box-inner {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: end;
  padding: 0 0 35px 5%;
  background: url(../img/top/mask_red.png) no-repeat center bottom 20%/cover;
}

.job-introduction-challenging__box-ttl__wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 5px;
  padding-bottom: 15px;
}

.job-introduction-challenging__box-ttl__num {
  position: absolute;
  top: 15px;
  right: 5px;
  -webkit-writing-mode: sideways-rl;
      -ms-writing-mode: sideways-rl;
          writing-mode: sideways-rl;
}

.job-introduction-challenging__box-link {
  margin-right: 30px;
}

@media (max-width: 1000px) {
  .job-introduction-challenging__ttl-wrap {
    padding: 30px 0 40px 30px;
  }
  .job-introduction-challenging__inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .job-introduction-challenging__head {
    position: static;
    top: 0px;
    right: 0;
    width: 100%;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    padding: 0px 5% 50px;
  }
  .job-introduction-challenging__head-mess {
    -webkit-writing-mode: vertical-rl;
        -ms-writing-mode: tb-rl;
            writing-mode: vertical-rl;
    letter-spacing: 0.05em;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin: 0 auto;
  }
  .job-introduction-challenging__link {
    margin: 30px auto 0;
  }
  .job-introduction-challenging__box-area {
    width: 100%;
    position: relative;
    z-index: 2;
  }
}
@media (max-width: 834px) {
  .job-introduction-challenging__ttl-wrap {
    padding-top: 0;
    padding-left: 0;
  }
  .job-introduction-challenging__box-inner {
    position: absolute;
    bottom: 0;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: end;
    padding-bottom: 20px;
  }
  .job-introduction-challenging__box-ttl__wrap {
    padding-bottom: 0px;
  }
  .job-introduction-challenging__box-link {
    margin-right: 15px;
  }
}
@media (max-width: 500px) {
  .job-introduction-challenging__box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    border-radius: 0;
    width: 100%;
    aspect-ratio: 750/840;
  }
  img.job-introduction-challenging__box-img {
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }
  .job-introduction-challenging__box-inner {
    position: absolute;
    bottom: 0;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-bottom: 20px;
    background: url(../img/top/mask_red.png) no-repeat center bottom/cover;
  }
}
/* -------------------------
 * 施工管理の一日
 * ------------------------- */
.job-introduction-routine {
  background-color: #f7f7f7;
}

.job-introduction-routine__ttl-wrap {
  margin-bottom: 10rem;
}
@media (max-width: 834px) {
  .job-introduction-routine__ttl-wrap {
    margin-bottom: 3rem;
  }
}

.job-introduction-routine__head {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 2rem 7%;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  margin-bottom: 8rem;
}
@media (max-width: 834px) {
  .job-introduction-routine__head {
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    margin-bottom: 3rem;
  }
}

.job-introduction-routine__schedule-item {
  display: grid;
  grid-template-columns: 20fr 115fr;
  gap: 3rem 0;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  position: relative;
}
@media (max-width: 834px) {
  .job-introduction-routine__schedule-item {
    grid-template-columns: 8rem 1fr;
  }
}
.job-introduction-routine__schedule-item::before {
  background: var(--red);
  content: "";
  display: inline-block;
  position: absolute;
  width: 1px;
  height: calc(100% + 4rem);
  top: 0px;
  left: 0.6rem;
  z-index: 1;
}
@media (max-width: 834px) {
  .job-introduction-routine__schedule-item::before {
    height: calc(100% + 2rem);
  }
}
.job-introduction-routine__schedule-item:last-child::before {
  height: 100%;
}
.job-introduction-routine__schedule-item:nth-child(1)::before {
  height: 100%;
}
.job-introduction-routine__schedule-item:nth-child(2)::before {
  height: calc(100% + 8rem);
  top: -4rem;
}
@media (max-width: 834px) {
  .job-introduction-routine__schedule-item:nth-child(2)::before {
    height: calc(100% + 4rem);
    top: -2rem;
  }
}
.job-introduction-routine__schedule-item + .job-introduction-routine__schedule-item {
  margin-top: 4rem;
}
@media (max-width: 834px) {
  .job-introduction-routine__schedule-item + .job-introduction-routine__schedule-item {
    margin-top: 2rem;
  }
}

.job-introduction-routine__schedule-item.--only-ttl .job-introduction-routine__time-wrap {
  margin-top: 2rem;
}
.job-introduction-routine__schedule-item.--only-ttl .job-introduction-routine__content-body {
  padding: 2rem 5%;
  background-color: transparent;
}
.job-introduction-routine__schedule-item.--only-ttl .job-introduction-routine__content-ttl {
  margin-bottom: 0rem;
}

@media (max-width: 834px) {
  .job-introduction-routine__time-label {
    font-size: 1.8rem;
  }
}

.job-introduction-routine__time-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 2rem;
  margin-top: 6rem;
}
@media (max-width: 834px) {
  .job-introduction-routine__time-wrap {
    margin-top: 2rem;
    gap: 0.5rem;
  }
}
.job-introduction-routine__time-wrap::before {
  width: 12px;
  height: 12px;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  content: "";
  background-color: var(--red);
  border-radius: 100vmax;
}
.job-introduction-routine__time-wrap::after {
  background: #cdcdcd;
  content: "";
  display: inline-block;
  width: 100%;
  height: 1px;
  z-index: 1;
}

.job-introduction-routine__content {
  display: grid;
  grid-template-columns: 800fr 351fr;
  gap: 0;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media (max-width: 834px) {
  .job-introduction-routine__content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}

.job-introduction-routine__content-body {
  padding: 6rem 5%;
  background-color: #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media (max-width: 834px) {
  .job-introduction-routine__content-body {
    padding: 2rem;
  }
}

.job-introduction-routine__content-ttl {
  margin-bottom: 3rem;
}
@media (max-width: 834px) {
  .job-introduction-routine__content-ttl {
    margin-bottom: 1rem;
    font-size: 1.8rem;
  }
}

.job-introduction-routine__content-img {
  -ms-flex-item-align: stretch;
      align-self: stretch;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.job-introduction-routine__content-img img {
  -o-object-fit: cover;
     object-fit: cover;
}/*# sourceMappingURL=job-introduction.css.map */