/* TOP section 3 — PC truth 201:779 / SP truth 229:5000. */
.sect3,
.sect3 * { box-sizing: border-box; }
.sect3 { position: relative; width: 1366px; height: 1078.337646px; margin: 0; overflow: hidden; color: #333; }
.sect3 img { display: block; max-width: none; }
.sect3 h2,
.sect3 h3,
.sect3 p,
.sect3 span { margin: 0; }

.sect3-pc { position: relative; display: block; width: 1366px; height: 1078.337646px; overflow: hidden; background: #f7e730; }
.sect3-pc__canvas { position: absolute; left: 0; top: 0; width: 1366px; height: 1078.337646px; overflow: hidden; transform-origin: 0 0; }
.sect3-pc__background { position: absolute; z-index: 1; left: 0; top: 0; width: 1366px; height: 1079px; }
.sect3-pc__inner { position: absolute; z-index: 2; left: 100px; top: 100px; width: 1166px; height: 878.337585px; }
.sect3-pc__main { position: absolute; left: 0; top: 0; width: 1166px; height: 878.337585px; }

.sect3-pc__heading { position: absolute; left: 0; top: 0; width: 414.832336px; height: 121.337593px; }
.sect3-pc__heading-row { position: absolute; left: 0; top: 0; width: 414.832336px; height: 65.337593px; }
.sect3-pc__symbol { position: absolute; left: 0; top: 7.168823px; width: 70px; height: 51px; }
.sect3-pc__match {
  position: absolute; left: 77.999991px; top: 0; width: 336.832346px; height: 65.337593px;
  display: flex; align-items: center; overflow: visible; white-space: nowrap;
  color: #333; font: 500 96px/138.720001px "Jost", sans-serif; letter-spacing: 0;
}
.sect3-pc__headline {
  position: absolute; left: 6.416168px; top: 89.337646px; width: 402px; height: 32px;
  white-space: nowrap; color: #333;
  font: 700 20px/32px "Noto Sans JP", sans-serif; letter-spacing: 4px;
}
.sect3-pc__lead {
  position: absolute; left: 0; top: 161.337646px; width: 1166px; height: 29px;
  white-space: nowrap; color: #333;
  font: 500 16px/28.8px "Noto Sans JP", sans-serif; letter-spacing: 2.4px;
}

.sect3-pc__layout { position: absolute; left: 0; top: 230.337646px; width: 1166px; height: 639px; }
.sect3-pc__cards { position: absolute; left: 0; top: 34.5px; width: 584px; height: 570px; }
.sect3-pc__card { position: absolute; left: 0; width: 584px; height: 174px; border: 1px solid #989898; background: #fff; }
.sect3-pc__card--01 { top: 0; }
.sect3-pc__card--02 { top: 198px; }
.sect3-pc__card--03 { top: 396px; }
.sect3-pc__card-image { position: absolute; left: 24px; top: 31px; width: 110px; height: 110px; }
.sect3-pc__card-copy { position: absolute; left: 174px; top: 24px; width: 384px; height: 124px; }
.sect3-pc__card-copy h3 {
  position: absolute; left: 0; top: 0; width: 158px; height: 64px;
  color: #333; white-space: nowrap;
  font: 700 20px/32px "Noto Sans JP", sans-serif; letter-spacing: 3px;
}
.sect3-pc__card-copy p {
  position: absolute; left: 0; top: 72px; height: 52px;
  color: #333; white-space: nowrap;
  font: 500 16px/25.6px "Noto Sans JP", sans-serif; letter-spacing: 2.4px;
}
.sect3-pc__card--01 .sect3-pc__card-copy p { width: 384px; }
.sect3-pc__card-row { position: absolute; left: 24px; top: 24px; height: 124px; }
.sect3-pc__card-row--02 { width: 422px; }
.sect3-pc__card-row--03 { width: 441px; }
.sect3-pc__card-row .sect3-pc__card-image { left: 0; top: 7px; }
.sect3-pc__card-row .sect3-pc__card-copy { left: 150px; top: 0; }
.sect3-pc__card-copy--02 { width: 272px; }
.sect3-pc__card-copy--03 { width: 291px; }
.sect3-pc__card-copy--02 p { width: 272px; }
.sect3-pc__card-copy--03 p { width: 291px; }
.sect3-pc__number {
  position: absolute; height: 46.364439px; display: flex; align-items: center; overflow: visible; white-space: nowrap;
  color: #333; font: 700 48px/48px "Jost", sans-serif; letter-spacing: 0;
}
.sect3-pc__card--01 .sect3-pc__number { left: 503.000514px; top: 8.162598px; width: 69.423314px; }
.sect3-pc__card--02 .sect3-pc__number { left: 496.000514px; top: 10.162598px; width: 76.423314px; }
.sect3-pc__card--03 .sect3-pc__number { left: 498.000514px; top: 10.162598px; width: 74.423314px; }

.sect3-pc__jobs { position: absolute; left: 608px; top: 0; width: 558px; height: 639px; }
.sect3-pc__jobs-image { position: absolute; left: 58.5px; top: 0; width: 441px; height: 341px; }
.sect3-pc__jobs-panel { position: absolute; left: 0; top: 341px; width: 558px; height: 298px; background: #333; }
.sect3-pc__jobs-copy { position: absolute; left: 32px; top: 32px; width: 494px; height: 136px; }
.sect3-pc__jobs-eyebrow {
  position: absolute; left: 0; top: 0; width: 272px; height: 32px;
  color: #fff; white-space: nowrap;
  font: 700 20px/32px "Noto Sans JP", sans-serif; letter-spacing: 3px;
}
.sect3-pc__jobs-title {
  position: absolute; left: 0; top: 40px; width: 494px; height: 96px;
  color: #fff; white-space: nowrap;
  font: 700 32px/48px "Noto Sans JP", sans-serif; letter-spacing: 4.8px;
}
.sect3-pc__jobs-title > span { color: #f7e730; }
.sect3-pc__jobs-button-wrap { position: absolute; left: 32px; top: 192px; width: 494px; height: 74px; }
.sect3-pc__jobs-button {
  position: absolute; left: 0; top: 0; width: 494px; height: 74px;
  display: block; border: 1px solid #333; background: #fff; box-shadow: 6px 6px 0 #f7e730; color: #333;
}
.sect3-pc__jobs-button > span {
  position: absolute; left: 140.5px; top: 24px; width: 174px; height: 24px;
  white-space: nowrap; color: #333;
  font: 700 20px/24px "Noto Sans JP", sans-serif; letter-spacing: 2px;
}
.sect3-pc__jobs-button > img { position: absolute; left: 326.5px; top: 28.636px; width: 26px; height: 15px; }

.sect3-sp { display: none; }

@media (max-width: 767px) {
  .sect3 { width: 100vw; height: calc(1380px * var(--sect-sp-scale, 1)); margin: 0; overflow: hidden; }
  .sect3-pc { display: none; }
  .sect3-sp { position: relative; display: block; width: 375px; height: 1380px; overflow: hidden; background: #f7e730; color: #333; transform: scale(var(--sect-sp-scale, 1)); transform-origin: 0 0; }
  .sect3-sp__background { position: absolute; z-index: 1; left: 0; top: 0; width: 375px; height: 1336px; }
  .sect3-sp__inner { position: absolute; z-index: 2; left: 16px; top: 80px; width: 343px; height: 1220px; }
  .sect3-sp__main { position: absolute; left: 0; top: 0; width: 343px; height: 1220px; }

  .sect3-sp__heading { position: absolute; left: 0; top: 0; width: 322px; height: 78px; }
  .sect3-sp__heading-row { position: absolute; left: 0; top: 0; width: 187.198593px; height: 28px; }
  .sect3-sp__symbol { position: absolute; left: 0; top: 0; width: 38px; height: 28px; }
  .sect3-sp__match {
    position: absolute; left: 46.000016px; top: .347412px; width: 141.198592px; height: 27.305263px;
    display: flex; align-items: center; overflow: visible; white-space: nowrap;
    color: #333; font: 500 40px/57.800003px "Jost", sans-serif; letter-spacing: 0;
  }
  .sect3-sp__headline {
    position: absolute; left: 0; top: 51.999878px; width: 322px; height: 26px;
    white-space: nowrap; color: #333;
    font: 700 16px/25.6px "Noto Sans JP", sans-serif; letter-spacing: 3.2px;
  }
  .sect3-sp__lead {
    position: absolute; left: 0; top: 110px; width: 304px; height: 50px;
    white-space: nowrap; color: #333;
    font: 500 14px/25.2px "Noto Sans JP", sans-serif; letter-spacing: 2.1px;
  }

  .sect3-sp__layout { position: absolute; left: 0; top: 192px; width: 343px; height: 1019px; }
  .sect3-sp__cards { position: absolute; left: 0; top: 0; width: 343px; height: 530px; }
  .sect3-sp__card { position: absolute; left: 0; width: 343px; height: 166px; border: 1px solid #989898; background: #fff; }
  .sect3-sp__card--01 { top: 0; }
  .sect3-sp__card--02 { top: 182px; }
  .sect3-sp__card--03 { top: 364px; }
  .sect3-sp__card-image { position: absolute; display: block; width: 50px; height: 50px; }
  .sect3-sp__card--01 > .sect3-sp__card-image { left: 17px; top: 58px; }
  .sect3-sp__card-copy { position: absolute; left: 83px; top: 17px; width: 243px; height: 132px; }
  .sect3-sp__card-copy h3 {
    position: absolute; left: 0; top: 0; width: 143px; height: 58px;
    color: #333; white-space: nowrap;
    font: 700 18px/28.8px "Noto Sans JP", sans-serif; letter-spacing: 2.7px;
  }
  .sect3-sp__card-copy p {
    position: absolute; left: 0; top: 66px; height: 44px;
    color: #333; white-space: nowrap;
    font: 500 14px/22.4px "Noto Sans JP", sans-serif; letter-spacing: 2.1px;
  }
  .sect3-sp__card--01 .sect3-sp__card-copy p { width: 243px; height: 66px; }
  .sect3-sp__card-stack { position: absolute; top: 17px; height: 110px; }
  .sect3-sp__card-stack--02 { left: 19.5px; width: 304px; }
  .sect3-sp__card-stack--03 { left: 17px; width: 321px; }
  .sect3-sp__card-stack--02 > .sect3-sp__card-image,
  .sect3-sp__card-stack--03 > .sect3-sp__card-image { left: 0; top: 30px; }
  .sect3-sp__card-stack--02 .sect3-sp__card-copy { left: 66px; top: 0; width: 238px; height: 110px; }
  .sect3-sp__card-stack--03 .sect3-sp__card-copy { left: 66px; top: 0; width: 255px; height: 110px; }
  .sect3-sp__card-copy--02 h3 { width: 142px; }
  .sect3-sp__card-copy--02 p { width: 238px; }
  .sect3-sp__card-copy--03 p { width: 255px; }
  .sect3-sp__number {
    position: absolute; height: 38.636px; display: flex; align-items: center; overflow: visible; white-space: nowrap;
    color: #333; font: 700 40px/40px "Jost", sans-serif; letter-spacing: 0;
  }
  .sect3-sp__card--01 .sect3-sp__number { left: -12px; top: -16.305176px; width: 57.423314px; }
  .sect3-sp__card--02 .sect3-sp__number { left: -16.1px; top: -14.305176px; width: 63.423314px; }
  .sect3-sp__card--03 .sect3-sp__number { left: -10.1px; top: -14.305176px; width: 62.423314px; }

  .sect3-sp__jobs { position: absolute; left: 0; top: 554px; width: 343px; height: 465px; }
  .sect3-sp__jobs-image { position: absolute; left: 44px; top: 0; width: 255px; height: 197px; }
  .sect3-sp__jobs-panel { position: absolute; left: 0; top: 197px; width: 343px; height: 268px; background: #333; }
  .sect3-sp__jobs-copy { position: absolute; left: 32px; top: 32px; width: 279px; height: 106px; }
  .sect3-sp__jobs-eyebrow {
    position: absolute; left: 0; top: 0; width: 217px; height: 26px;
    color: #fff; white-space: nowrap;
    font: 700 16px/25.6px "Noto Sans JP", sans-serif; letter-spacing: 2.4px;
  }
  .sect3-sp__jobs-title {
    position: absolute; left: 0; top: 34px; width: 279px; height: 72px;
    color: #fff; white-space: nowrap;
    font: 700 24px/36px "Noto Sans JP", sans-serif; letter-spacing: 3.6px;
  }
  .sect3-sp__jobs-title > span { color: #f7e730; }
  .sect3-sp__jobs-button-wrap { position: absolute; left: 32px; top: 162px; width: 279px; height: 74px; }
  .sect3-sp__jobs-button {
    position: absolute; left: 0; top: 0; width: 279px; height: 74px;
    display: block; border: 1px solid #333; background: #fff; box-shadow: 6px 6px 0 #f7e730; color: #333;
  }
  .sect3-sp__jobs-button > span {
    position: absolute; left: 33px; top: 24px; width: 174px; height: 24px;
    white-space: nowrap; color: #333;
    font: 700 20px/24px "Noto Sans JP", sans-serif; letter-spacing: 2px;
  }
  .sect3-sp__jobs-button > img { position: absolute; left: 219px; top: 28.636px; width: 26px; height: 15px; }

  /* Galaxy/Android fallback metrics: keep glyph ink and every card child
     inside the SP artboard without changing the PC canvas. */
  .sect3-sp :is(.sect3-sp__headline,.sect3-sp__lead,.sect3-sp__card-copy h3,.sect3-sp__card-copy p,.sect3-sp__jobs-eyebrow,.sect3-sp__jobs-title,.sect3-sp__jobs-button > span) {
    font-family: "Noto Sans JP", "Noto Sans CJK JP", "Hiragino Sans", "Yu Gothic", Meiryo, sans-serif;
  }
  .sect3-sp__match { top: 10px; height: 40px; align-items: flex-start; line-height: 40px; }
  .sect3-sp__headline,
  .sect3-sp__lead { width: 343px; height: auto; overflow: visible; }
  .sect3-sp__headline { letter-spacing: 2px; }
  .sect3-sp__lead { letter-spacing: 1px; line-height: 1.7; }
  .sect3-sp__card { overflow: hidden; }
  .sect3-sp__card-copy h3,
  .sect3-sp__card-copy p {
    width: 100% !important;
    height: auto !important;
    overflow: visible;
    white-space: normal;
    word-break: auto-phrase;
    overflow-wrap: normal;
    text-wrap: pretty;
  }
  .sect3-sp__card-copy h3 { font-size: 18px; line-height: 1.5; letter-spacing: 1.2px; }
  .sect3-sp__card-copy p { top: 62px; font-size: 14px; line-height: 1.55; letter-spacing: .7px; }
  .sect3-sp__card--01 .sect3-sp__number,
  .sect3-sp__card--02 .sect3-sp__number,
  .sect3-sp__card--03 .sect3-sp__number { left: 8px; top: 8px; height: 36px; font-size: 36px; line-height: 36px; }
}

@media (min-width: 768px) {
  .sect3 { width: 100vw; height: calc(1078.337646px * var(--sect-hero-scale, 1)); overflow: hidden; }
  .sect3-pc { width: 100vw; height: calc(1078.337646px * var(--sect-hero-scale, 1)); overflow: hidden; }
  .sect3-pc__canvas { transform: scale(var(--sect-hero-scale, 1)); }
  .sect3-sp { display: none; }
}