@charset "UTF-8";
@import url('component.css') layer(component);
/* ==========================================================================
  RECRUIT TOP
========================================================================== */
@layer page {
  :root {
    --primary-grd: linear-gradient(to right, #20409c, #2e78bf, #85e1ff);
  }
  /* RECRUIT COMMON */
  @media all and (width >= 48rem) {
    .recruit-header {
      opacity: 0;
      -webkit-transition: 0.25s all ease-in-out;
      transition: 0.25s all ease-in-out;
      visibility: hidden;
    }
    .recruit-header.is-scroll {
      opacity: 1;
      visibility: visible;
    }
    .l-container {
      padding-top: calc(64 / var(--font-size) * 1rem);
    }
    .l-section {
      padding-inline: calc(40 / var(--font-size) * 1rem);
    }
    .l-section__head {
      margin-bottom: calc(32 / var(--font-size) * 1rem);
    }
    .c-heading {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;

      --heading-font-size: 67.39;
      --heading-letter-spacing: 100;
      -webkit-background-clip: border-box;
      background: transparent;
      -webkit-text-fill-color: inherit;
    }
    .c-heading__label {
      font-weight: 400;
    }
    .c-heading.--grd .c-heading__label {
      background: var(--primary-grd);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
    .c-heading-lead {
      color: var(--black-color);
      font-size: calc(20 / var(--font-size) * 1rem);
      letter-spacing: 0.2em;
      font-weight: 500;
      line-height: 1.44;
    }
  }
  @media all and (width < 64rem) {
    .l-section {
      padding-inline: 0;
    }
  }
  @media all and (width < 48rem) {
    .recruit-header {
      opacity: 0;
      -webkit-transition: 0.25s all ease-in-out;
      transition: 0.25s all ease-in-out;
    }
    .recruit-header.is-scroll {
      opacity: 1;
    }
    .l-container {
      padding-top: calc(40 / var(--font-size) * 1rem);
    }
    .l-section {
    }
    .l-section__head {
      margin-bottom: calc(32 / var(--font-size) * 1rem);
    }
    .c-heading {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      gap: calc(8 / var(--font-size) * 1rem);

      --heading-font-size: 44;
      --heading-line-height: 1.1363636364;
      --heading-letter-spacing: 80;
      -webkit-background-clip: border-box;
      background: transparent;
      -webkit-text-fill-color: inherit;
    }
    .c-heading__label {
      font-weight: 400;
    }
    .c-heading.--grd .c-heading__label {
      text-align: center;
      background: var(--primary-grd);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
    .c-heading-lead {
      padding-left: calc(12 / var(--font-size) * 1rem);
      color: var(--black-color);
      font-size: calc(15 / var(--font-size) * 1rem);
      letter-spacing: 0.2em;
      font-weight: 500;
      line-height: 1.44;
    }
  }
  /* HERO */
  @media all and (width >= 48rem) {
    .recruit-hero {
      /* コンテナ */
      container-type: inline-size;

      position: relative;
      max-width: calc(2048 / var(--font-size) * 1rem);
      margin-inline: auto;
    }
    .recruit-hero::before {
      content: '';
      top: 0;
      position: absolute;
      width: 100%;
      height: 100%;
      border-bottom-left-radius: calc(100 / var(--font-size) * 1rem);
      border-bottom-right-radius: calc(100 / var(--font-size) * 1rem);
      background-image: url(/assets/img/recruit/bg_hero.png);
      background-image: url(/assets/img/recruit/bg_hero.webp);
      background-image: url(/assets/img/recruit/bg_hero.avif);
      background-size: auto 100%;
      background-position: center;
      background-repeat: no-repeat;
      z-index: -2;
    }
    .recruit-hero::after {
      content: '';
      top: 0;
      left: 50%;
      -webkit-transform: translateX(-50%);
              transform: translateX(-50%);
      position: absolute;
      width: 96.25%;
      height: 107.5396825397%;
      background-image: url(/assets/img/recruit/deco_hero.png);
      background-image: url(/assets/img/recruit/deco_hero.webp);
      background-image: url(/assets/img/recruit/deco_hero.avif);
      background-size: auto 100%;
      background-position: center;
      background-repeat: no-repeat;
      z-index: -2;
    }
    .recruit-hero__in {
      position: relative;
    }
    .recruit-hero__in::before {
      content: 'Next Stage';
      white-space: nowrap;
      position: absolute;
      font-family: var(--ff-en);
      font-weight: 200;
      font-style: italic;
      font-size: min(183.53px, calc(183.53 / 1440 * 100vw));
      letter-spacing: 0.1em;
      line-height: 0.8;
      color: #4b87c5;
      opacity: 0.6;
      mix-blend-mode: multiply;
      top: 0;
      left: 50%;
      -webkit-transform: translateX(-50%);
              transform: translateX(-50%);
      z-index: -1;
    }
    .recruit-hero__body {
      padding-block: calc(128 / 1440 * 100cqi) calc(45 / 1440 * 100cqi);
      text-align: center;
    }
    .recruit-hero__header {
      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;
    }
    .recruit-hero__header-title {
      width: calc(798 / 1440 * 100cqi);
      position: relative;
    }
    .recruit-hero__header-title::before {
      position: absolute;
      content: '';
      width: 100%;
      height: 100%;
      background-image: url(/assets/img/recruit/title_recruit-hero.svg);
      background-size: contain;
      background-repeat: no-repeat;
      mix-blend-mode: multiply;
    }
    .recruit-hero__lead {
      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;
      gap: calc(12 / 1440 * 100cqi);
      font-weight: 500;
      font-size: clamp(calc(12 / var(--font-size) * 1rem), calc(22 / 1440 * 100cqi), calc(22 / var(--font-size) * 1rem));
      color: var(--white-color);
      letter-spacing: 0.1em;
    }
    .recruit-hero__lead > span {
      padding: calc(8 / 1440 * 100cqi);
      background: var(--primary-grd);
    }
  }
  @media all and (width < 48rem) {
    .recruit-hero {
      position: relative;
      aspect-ratio: 375 / 470;
      overflow: hidden;
      border-bottom-left-radius: calc(60 / 375 * 100vw);
      border-bottom-right-radius: calc(60 / 375 * 100vw);
    }
    .recruit-hero::before {
      content: '';
      top: 0;
      left: 50%;
      -webkit-transform: translateX(-50%);
              transform: translateX(-50%);
      position: absolute;
      width: 100%;
      height: 100%;
      background-image: url(/assets/img/recruit/bg_hero_sp.png);
      background-image: url(/assets/img/recruit/bg_hero_sp.webp);
      background-image: url(/assets/img/recruit/bg_hero_sp.avif);
      background-size: auto 100%;
      background-position: 40% top;
      background-repeat: no-repeat;
      z-index: -2;
    }
    .recruit-hero::after {
      content: '';
      top: 0;
      left: 50%;
      -webkit-transform: translateX(-50%);
              transform: translateX(-50%);
      position: absolute;
      width: 91.46666667%;
      aspect-ratio: 343/186;
      background-image: url(/assets/img/recruit/deco_hero_sp.png);
      background-image: url(/assets/img/recruit/deco_hero_sp.webp);
      background-image: url(/assets/img/recruit/deco_hero_sp.avif);
      background-size: contain;
      background-position: top center;
      background-repeat: no-repeat;
      z-index: -2;
    }
    .recruit-hero__in {
      position: relative;
      height: 100%;
    }
    .recruit-hero__in::before {
      content: 'Next Stage';
      white-space: nowrap;
      position: absolute;
      font-family: var(--ff-en);
      font-weight: 200;
      font-style: italic;
      font-size: calc(74 / 375 * 100vw);
      letter-spacing: 0.03em;
      line-height: 0.8;
      color: #4b87c5;
      opacity: 0.6;
      mix-blend-mode: multiply;
      top: calc(180 / 375 * 100vw);
      left: 50%;
      -webkit-transform: translateX(-50%);
              transform: translateX(-50%);
      z-index: -1;
    }
    .recruit-hero__body {
      height: 100%;
      padding-block: calc(236 / 375 * 100vw) calc(26 / 375 * 100vw);
      text-align: center;
    }
    .recruit-hero__header {
      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;
    }
    .recruit-hero__header-title {
      position: relative;
      width: 100vw;
      margin-bottom: calc(-10 / 375 * 100vw);
    }
    .recruit-hero__header-title::before {
      position: absolute;
      content: '';
      width: 100%;
      height: 100%;
      background-image: url(/assets/img/recruit/title_recruit-hero_sp.svg);
      background-size: contain;
      background-repeat: no-repeat;
      mix-blend-mode: multiply;
    }
    .recruit-hero__header-title img {
      width: 100%;
    }
    .recruit-hero__lead {
      margin-top: calc(3 / 375 * 100vw);
      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;
      gap: calc(8 / 375 * 100vw);
      font-weight: 500;
      font-size: calc(12 / 375 * 100vw);
      color: var(--white-color);
      letter-spacing: 0.1em;
    }
    .recruit-hero__lead > span {
      padding: calc(6 / 375 * 100vw) calc(8 / 375 * 100vw);
      background: var(--primary-grd);
    }
  }
  /* FEATURE */
  @media all and (width >= 48rem) {
    .feature.l-section {
      padding-inline: calc(40 / var(--font-size) * 1rem);
    }
    .feature .l-section__head {
      margin-bottom: calc(40 / var(--font-size) * 1rem);
    }
    .feature .l-section__head .c-heading {
      margin-inline: auto;
      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;
      background: transparent;
      -webkit-text-fill-color: inherit;
      --heading-font-size: 46.77;
      --heading-letter-spacing: 100;
    }
    .feature-heading-lead {
      color: var(--primary-color-500);
      font-family: var(--ff-jp-serif);
      font-size: calc(36.78 / var(--font-size) * 1rem);
    }
    .feature-heading-lead strong {
      font-weight: 500;
      font-size: calc(46.77 / var(--font-size) * 1rem);
      letter-spacing: 0.1em;
    }
    .feature .l-section__head .c-heading__label {
      background: -webkit-gradient(linear, left top, right top, from(#20409c), color-stop(#2e78bf), to(#85e1ff));
      background: linear-gradient(to right, #20409c, #2e78bf, #85e1ff);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
    .feature .l-section__head .c-heading__label strong {
      font-size: calc(71.96 / var(--font-size) * 1rem);
      font-weight: 500;
      letter-spacing: 0.1em;
    }
    .feature .l-block__content {
      /* コンテナ */
      container-type: inline-size;
      container-name: featureContainer;
    }
    .recruit-feature-list {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      gap: calc(43 / var(--font-size) * 1rem);
    }
    .recruit-feature-list::before {
      position: absolute;
      top: calc(571 / var(--font-size) * 1rem);
      left: calc(-72 / var(--font-size) * 1rem);
      content: '';
      width: calc(304 / var(--font-size) * 1rem);
      aspect-ratio: 304/197;
      background-image: url(/assets/img/recruit/img_feature01.png);
      background-size: contain;
      background-repeat: no-repeat;
      z-index: 2;
    }
    .recruit-feature-list::after {
      position: absolute;
      top: calc(433 / var(--font-size) * 1rem);
      right: calc(-112 / var(--font-size) * 1rem);
      content: '';
      width: calc(312 / var(--font-size) * 1rem);
      aspect-ratio: 397/277.5;
      background-image: url(/assets/img/recruit/img_feature02.png);
      background-size: contain;
      background-repeat: no-repeat;
      z-index: 2;
    }
    .recruit-feature {
      width: calc(380 / 1232 * 100cqi);
      -webkit-box-shadow: 0 0 calc(20 / var(--font-size) * 1rem) calc(2 / var(--font-size) * 1rem) rgba(32, 64, 156, 0.11);
              box-shadow: 0 0 calc(20 / var(--font-size) * 1rem) calc(2 / var(--font-size) * 1rem) rgba(32, 64, 156, 0.11);
    }
    .recruit-feature__in {
      position: relative;
      height: 100%;
      background: var(--white-color);
      padding-block: calc(40 / var(--font-size) * 1rem) calc(32 / var(--font-size) * 1rem);
      padding-inline: calc(36 / var(--font-size) * 1rem);
    }
    .recruit-feature-num {
      position: absolute;
      top: 0;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%);
    }
    .recruit-feature-num__label {
      font-family: var(--ff-en);
      font-weight: 300;
      font-style: italic;
      font-size: calc(64.75 / var(--font-size) * 1rem);
      letter-spacing: 0.1em;
      position: relative;
      background: var(--primary-grd);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
    .recruit-feature-content {
      display: -ms-grid;
      display: grid;
      -ms-grid-rows: calc(74 / var(--font-size) * 1rem) 1fr;
      grid-template-rows: calc(74 / var(--font-size) * 1rem) 1fr;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
    }
    .recruit-feature-title {
    }
    .recruit-feature-title__label {
      text-align: center;
      letter-spacing: 0.1em;
      font-size: calc(26 / var(--font-size) * 1rem);
      color: var(--primary-color-500);
      line-height: 1.4053846154;
      font-weight: 500;
    }
    .recruit-feature-lead {
      margin-top: calc(16 / var(--font-size) * 1rem);
    }
    .recruit-feature-lead__label {
      text-align: center;
      font-size: calc(16 / var(--font-size) * 1rem);
      line-height: 1.8;
      letter-spacing: 0.1em;
    }
  }
  @container featureContainer (width < 70rem) {
    .recruit-feature {
      width: calc(50% - calc(43 / 1232 * 100cqi));
      min-width: calc(362 / var(--font-size) * 1rem);
    }
    .recruit-feature-list::before {
      top: calc(720 / var(--font-size) * 1rem);
    }
    .recruit-feature-list::after {
      top: calc(840 / var(--font-size) * 1rem);
      right: calc(-80 / var(--font-size) * 1rem);
    }
  }
  @container featureContainer (width < 53.9375rem) {
    .recruit-feature-list {
      margin-top: calc(24 / var(--font-size) * 1rem);
      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;
      gap: calc(56 / var(--font-size) * 1rem);
      position: relative;
      margin-bottom: calc(280 / var(--font-size) * 1rem);
    }
    .recruit-feature-list::before {
      position: absolute;
      top: auto;
      bottom: 0;
      left: 50%;
      -webkit-transform: translateX(-50%);
              transform: translateX(-50%);
      margin-bottom: calc(-170 / var(--font-size) * 1rem);
      margin-left: calc(88 / var(--font-size) * 1rem);
      content: '';
      width: calc(278 / var(--font-size) * 1rem);
      aspect-ratio: 304/197;
      background-image: url(/assets/img/recruit/img_feature01.png);
      background-size: contain;
      background-repeat: no-repeat;
      z-index: 2;
    }
    .recruit-feature-list::after {
      position: absolute;
      top: auto;
      bottom: 0;
      margin-bottom: calc(-336 / var(--font-size) * 1rem);
      left: 50%;
      -webkit-transform: translateX(-50%);
              transform: translateX(-50%);
      margin-left: calc(-66 / var(--font-size) * 1rem);
      content: '';
      width: calc(296 / var(--font-size) * 1rem);
      aspect-ratio: 397/277.5;
      background-image: url(/assets/img/recruit/img_feature02.png);
      background-size: contain;
      background-repeat: no-repeat;
      z-index: 3;
    }
    .recruit-feature {
      width: calc(400 / var(--font-size) * 1rem);
      position: relative;
    }
    .recruit-feature-num {
      position: absolute;
      top: 0;
      left: calc(16 / var(--font-size) * 1rem);
      -webkit-transform: translate(0, -50%);
              transform: translate(0, -50%);
    }
    .recruit-feature-num__label {
      position: relative;
      background: var(--primary-grd);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
    .recruit-feature-title {
      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;
    }
    .recruit-feature-lead {
      margin-top: calc(16 / var(--font-size) * 1rem);
    }
  }
  @media all and (width < 68rem) {
    .feature.l-section {
      padding-inline: 0;
    }
  }
  @media all and (width < 48rem) {
    .feature.l-section {
    }
    .feature .l-section__head {
      margin-bottom: calc(32 / var(--font-size) * 1rem);
    }
    .feature .l-section__head .c-heading {
      margin-inline: auto;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      gap: 0;
      -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;
      background: transparent;
      -webkit-text-fill-color: inherit;
      --heading-font-size: 30;
      --heading-letter-spacing: 80;
    }
    .feature-heading-lead {
      color: var(--primary-color-500);
      font-family: var(--ff-jp-serif);
      font-size: calc(24 / var(--font-size) * 1rem);
    }
    .feature-heading-lead strong {
      font-weight: 500;
      font-size: calc(30 / var(--font-size) * 1rem);
    }
    .feature .l-section__head .c-heading__label {
      background: -webkit-gradient(linear, left top, right top, from(#20409c), color-stop(#2e78bf), to(#85e1ff));
      background: linear-gradient(to right, #20409c, #2e78bf, #85e1ff);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
    .feature .l-section__head .c-heading__label strong {
      font-size: calc(40 / var(--font-size) * 1rem);
      font-weight: 500;
      letter-spacing: 0.1em;
    }
    .recruit-feature-list {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      gap: calc(32 / var(--font-size) * 1rem);
      position: relative;
      margin-bottom: calc(380 / var(--font-size) * 1rem);
    }
    .recruit-feature-list::before {
      position: absolute;
      bottom: 0;
      left: 50%;
      -webkit-transform: translateX(-50%);
              transform: translateX(-50%);
      margin-bottom: calc(-170 / var(--font-size) * 1rem);
      margin-left: calc(88 / var(--font-size) * 1rem);
      content: '';
      width: calc(278 / var(--font-size) * 1rem);
      aspect-ratio: 304/197;
      background-image: url(/assets/img/recruit/img_feature01.png);
      background-size: contain;
      background-repeat: no-repeat;
      z-index: 2;
    }
    .recruit-feature-list::after {
      position: absolute;
      bottom: 0;
      margin-bottom: calc(-336 / var(--font-size) * 1rem);
      left: 50%;
      -webkit-transform: translateX(-50%);
              transform: translateX(-50%);
      margin-left: calc(-66 / var(--font-size) * 1rem);
      content: '';
      width: calc(296 / var(--font-size) * 1rem);
      aspect-ratio: 397/277.5;
      background-image: url(/assets/img/recruit/img_feature02.png);
      background-size: contain;
      background-repeat: no-repeat;
      z-index: 3;
    }
    .recruit-feature {
      position: relative;
      -webkit-box-shadow: 0 0 calc(20 / var(--font-size) * 1rem) calc(2 / var(--font-size) * 1rem) rgba(32, 64, 156, 0.11);
              box-shadow: 0 0 calc(20 / var(--font-size) * 1rem) calc(2 / var(--font-size) * 1rem) rgba(32, 64, 156, 0.11);
    }
    .recruit-feature__in {
      background: var(--white-color);
      padding-block: calc(20 / var(--font-size) * 1rem) calc(24 / var(--font-size) * 1rem);
      padding-inline: calc(16 / var(--font-size) * 1rem);
    }
    .recruit-feature-num {
      position: absolute;
      top: 0;
      left: calc(16 / var(--font-size) * 1rem);
      -webkit-transform: translate(0, -50%);
              transform: translate(0, -50%);
    }
    .recruit-feature-num__label {
      font-family: var(--ff-en);
      font-weight: 300;
      font-style: italic;
      font-size: calc(41.58 / var(--font-size) * 1rem);
      letter-spacing: 0.08em;
      position: relative;
      background: var(--primary-grd);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
    .recruit-feature-title {
      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;
    }
    .recruit-feature-title__label {
      text-align: center;
      letter-spacing: 0.06em;
      font-size: calc(19 / var(--font-size) * 1rem);
      color: var(--primary-color-500);
      line-height: 1.5;
      font-weight: 500;
    }
    .recruit-feature-lead {
      margin-top: calc(16 / var(--font-size) * 1rem);
    }
    .recruit-feature-lead__label {
      text-align: center;
      font-size: calc(14 / var(--font-size) * 1rem);
      line-height: 1.6;
      letter-spacing: 0.08em;
    }
  }
  /* INTERVIEW */
  @media all and (width >= 48rem) {
    .interview {
      container-type: inline-size;
    }
    .interview .l-section__head {
      margin-bottom: calc(60 / var(--font-size) * 1rem);
      position: relative;
      &::before {
        content: '';
        position: absolute;
        right: 0;
        top: calc(50% + calc(120 / var(--font-size) * 1rem));
        -webkit-transform: translateY(-50%);
                transform: translateY(-50%);
        margin-right: calc(152 / 1440 * 100cqi);
        width: calc(200 / 1440 * 100cqi);
        aspect-ratio: 200/190;
        background: url(/assets/img/recruit/img_pimy02.png) no-repeat center/contain;
      }
    }
    .interview .l-block__head {
      margin-bottom: calc(32 / var(--font-size) * 1rem);
    }
    .interview .l-block__head .c-heading,
    .interview .l-block__head .c-heading {
      --heading-font-family: var(--ff-jp);
      --heading-font-size: 30;
      --heading-line-height: 2.3333333333;
      --heading-letter-spacing: 100;
      position: relative;
      padding-left: calc(24 / var(--font-size) * 1rem);
      background: var(--primary-grd);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
    .interview .l-block__head .c-heading__label {
      font-weight: 500;
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
    .interview .l-block__head .c-heading::before {
      position: absolute;
      content: '';
      left: 0;
      top: 50%;
      -webkit-transform: translateY(-50%);
              transform: translateY(-50%);
      height: calc(40 / var(--font-size) * 1rem);
      width: calc(4 / var(--font-size) * 1rem);
      background: var(--primary-color-500);
    }
    .interview .l-block + .l-block {
      margin-top: calc(96 / var(--font-size) * 1rem);
    }
    .interview-list {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      gap: calc(36 / var(--font-size) * 1rem);
    }
    .interview-splide:not(.is-active) .splide__arrows {
      display: none;
      visibility: hidden;
    }
    .c-slider-arrow {
      --btn-bg-color: linear-gradient(-46deg, #203e9b, #76c1e4, #203e9b);

      width: calc(43 / var(--font-size) * 1rem);
      height: calc(43 / var(--font-size) * 1rem);
      overflow: hidden;
      -webkit-appearance: none;
         -moz-appearance: none;
              appearance: none;
      opacity: 1;
    }
    .c-slider-arrow::before {
      content: '';
      position: absolute;
      left: 0;
      width: 200%;
      height: 100%;
      background: var(--btn-bg-color);
      -webkit-transition: all 0.25s;
      transition: all 0.25s;
    }
    .c-slider-arrow:hover::before {
      -webkit-transform: translateX(-50%);
              transform: translateX(-50%);
    }
    .c-slider-arrow__label {
      position: relative;
      width: calc(12 / var(--font-size) * 1rem);
      height: calc(18 / var(--font-size) * 1rem);
      -webkit-mask-image: url(/assets/img/common/ico_slide_arrow.svg);
              mask-image: url(/assets/img/common/ico_slide_arrow.svg);
      -webkit-mask-size: contain;
              mask-size: contain;
      -webkit-mask-repeat: no-repeat;
              mask-repeat: no-repeat;
      background: var(--white-color);
    }
    .c-slider-arrow:hover .c-slider-arrow--prev {
      -webkit-transform: translateX(10px);
              transform: translateX(10px);
    }
    .c-slider-arrow--next .c-slider-arrow__label {
      -webkit-transform: rotate(180deg);
              transform: rotate(180deg);
    }
    .interview-block {
      max-width: calc(281 / var(--font-size) * 1rem);
    }
    .interview-block:nth-child(2n) {
      margin-top: calc(40 / var(--font-size) * 1rem);
    }
    .interview-block:nth-child(4n) {
      margin-top: calc(30 / var(--font-size) * 1rem);
    }
    .interview-block-catch {
      position: relative;
      aspect-ratio: 280 / 400;
    }
    .interview-block a:hover .interview-block-catch-visual::before {
      opacity: 0.3;
    }
    .interview-block-catch-visual {
      position: relative;
      -webkit-transition: all 0.25s ease;
      transition: all 0.25s ease;
    }
    .interview-block-catch-visual::before {
      content: '';
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%);
      width: 100%;
      height: 100%;
      background-color: var(--white-color);
      opacity: 0;
      -webkit-transition: all 0.25s ease;
      transition: all 0.25s ease;
      z-index: 2;
    }
    .interview-block-catch-heading {
      position: absolute;
      z-index: 1;
      top: calc(296 / 401 * 100%);
      left: 0;
    }
    .interview-block-catch-heading:has(span:nth-child(3)) {
      top: calc(248 / 401 * 100%);
    }
    .interview-block-catch-heading__label {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      gap: calc(8 / var(--font-size) * 1rem);
      font-size: calc(18 / var(--font-size) * 1rem);
      line-height: 1;
      letter-spacing: 0.1em;
      color: var(--white-color);
    }
    .interview-block-catch-heading__label > span {
      width: -webkit-fit-content;
      width: -moz-fit-content;
      width: fit-content;
      background: var(--primary-grd);
      padding-inline: calc(16 / var(--font-size) * 1rem) calc(16 / var(--font-size) * 1rem);
      padding-block: calc(11 / var(--font-size) * 1rem) calc(11 / var(--font-size) * 1rem);
    }
    .interview-block-catch + .interview-block-info {
      margin-top: calc(16 / var(--font-size) * 1rem);
    }
    .interview-block-info {
      position: relative;
    }
    .interview-block-info__label {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      row-gap: calc(12 / var(--font-size) * 1rem);
      font-size: calc(15 / var(--font-size) * 1rem);
      padding-right: calc(48 / var(--font-size) * 1rem);
    }
    .interview-block-info__label .c-txt {
      --txt-letter-spacing: 0.1em;
      --txt-line-height: 1;
    }
    .intve-position {
      min-width: calc(104 / var(--font-size) * 1rem);
      -ms-flex-negative: 0;
          flex-shrink: 0;
    }
    .intve-bio + .intve-name::before {
      content: '/';
      margin-inline: calc(6 / var(--font-size) * 1rem);
    }
    .interview-block-info__arrow {
      content: '';
      position: absolute;
      top: 50%;
      -webkit-transform: translateY(-50%);
              transform: translateY(-50%);
      right: 0;
      width: calc(48 / var(--font-size) * 1rem);
      height: calc(36 / var(--font-size) * 1rem);
      background-image: url(/assets/img/recruit/ico_arrow.svg);
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain;
    }
  }
  @media all and (width < 48rem) {
    .interview .l-section__head {
      margin-bottom: calc(48 / var(--font-size) * 1rem);
      &::before {
        content: '';
        position: absolute;
        right: 0;
        margin-right: calc(-20 / var(--font-size) * 1rem);
        top: 0;
        margin-top: calc(-24 / var(--font-size) * 1rem);
        width: calc(120 / var(--font-size) * 1rem);
        aspect-ratio: 200/190;
        background: url(/assets/img/recruit/img_pimy02.png) no-repeat center/contain;
      }
    }
    .interview .l-block__head {
      margin-bottom: calc(24 / var(--font-size) * 1rem);
    }
    .interview .l-block__head .c-heading,
    .interview .l-block__head .c-heading {
      --heading-font-family: var(--ff-jp);
      --heading-font-size: 20;
      --heading-line-height: 2.3333333333;
      --heading-letter-spacing: 100;
      position: relative;
      padding-left: calc(11 / var(--font-size) * 1rem);
      background: var(--primary-grd);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
    .interview .l-block__head .c-heading__label {
      font-weight: 500;
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
    .interview .l-block__head .c-heading::before {
      position: absolute;
      content: '';
      left: 0;
      top: 50%;
      -webkit-transform: translateY(-50%);
              transform: translateY(-50%);
      height: calc(20 / var(--font-size) * 1rem);
      width: calc(2 / var(--font-size) * 1rem);
      background: var(--primary-color-500);
    }
    .interview .l-block__head {
    }
    .interview-splide {
      margin-inline: calc(-16 / var(--font-size) * 1rem);
    }
    .c-slider-arrows {
      width: calc(330 / 375 * 100vw);
      height: calc(40 / var(--font-size) * 1rem);
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%);
      z-index: 10;
    }
    .c-slider-arrow {
      --btn-bg-color: linear-gradient(-46deg, #203e9b, #76c1e4, #203e9b);

      width: calc(30 / var(--font-size) * 1rem);
      height: calc(30 / var(--font-size) * 1rem);
      overflow: hidden;
      -webkit-appearance: none;
         -moz-appearance: none;
              appearance: none;
      opacity: 1;
    }
    .c-slider-arrow::before {
      content: '';
      position: absolute;
      left: 0;
      width: 200%;
      height: 100%;
      background: var(--btn-bg-color);
      -webkit-transition: all 0.25s;
      transition: all 0.25s;
    }
    .c-slider-arrow__label {
      position: relative;
      width: calc(7 / var(--font-size) * 1rem);
      height: calc(13 / var(--font-size) * 1rem);
      -webkit-mask-image: url(/assets/img/common/ico_slide_arrow.svg);
              mask-image: url(/assets/img/common/ico_slide_arrow.svg);
      -webkit-mask-size: contain;
              mask-size: contain;
      -webkit-mask-repeat: no-repeat;
              mask-repeat: no-repeat;
      background: var(--white-color);
    }
    .c-slider-arrow--prev {
      left: 0;
    }
    .c-slider-arrow--next {
      right: 0;
    }
    .c-slider-arrow--next .c-slider-arrow__label {
      -webkit-transform: rotate(180deg);
              transform: rotate(180deg);
    }
    .interview-list {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
    }
    .interview-block {
      max-width: calc(245 / var(--font-size) * 1rem);
      margin-right: calc(32 / var(--font-size) * 1rem);
    }
    .interview-block-catch {
      position: relative;
      aspect-ratio: 245 / 350;
    }
    .interview-block a:hover .interview-block-catch-visual::before {
      opacity: 0.3;
    }
    .interview-block-catch-visual {
      position: relative;
    }
    .interview-block-catch-heading {
      position: absolute;
      z-index: 1;
      top: calc(264 / 350 * 100%);
      left: 0;
    }
    .interview-block-catch-heading:has(span:nth-child(3)) {
      top: calc(223 / 350 * 100%);
    }
    .interview-block-catch-heading__label {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      gap: calc(10 / var(--font-size) * 1rem);
      font-size: calc(14 / var(--font-size) * 1rem);
      line-height: 1;
      letter-spacing: 0.1em;
      color: var(--white-color);
    }
    .interview-block-catch-heading__label > span {
      width: -webkit-fit-content;
      width: -moz-fit-content;
      width: fit-content;
      background: var(--primary-grd);
      padding-inline: calc(16 / var(--font-size) * 1rem) calc(12 / var(--font-size) * 1rem);
      padding-block: calc(8 / var(--font-size) * 1rem) calc(8 / var(--font-size) * 1rem);
    }
    .interview-block-catch + .interview-block-info {
      margin-top: calc(16 / var(--font-size) * 1rem);
    }
    .interview-block-info {
      position: relative;
    }
    .interview-block-info__label {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      row-gap: calc(8 / var(--font-size) * 1rem);
      font-size: calc(13 / var(--font-size) * 1rem);
    }
    .interview-block-info__label .c-txt {
      --txt-letter-spacing: 0.1em;
      --txt-line-height: 1;
    }
    .intve-position {
      min-width: calc(104 / var(--font-size) * 1rem);
      -ms-flex-negative: 0;
          flex-shrink: 0;
    }
    .intve-bio + .intve-name::before {
      content: '/';
      margin-inline: calc(6 / var(--font-size) * 1rem);
    }
    .interview-block-info__arrow {
      content: '';
      position: absolute;
      top: 50%;
      -webkit-transform: translateY(-50%);
              transform: translateY(-50%);
      right: 0;
      width: calc(36 / var(--font-size) * 1rem);
      height: calc(28 / var(--font-size) * 1rem);
      background-image: url(/assets/img/recruit/ico_arrow.svg);
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain;
    }
  }
  /* CAREER PATH */
  @media all and (width >= 48rem) {
    .career-path.l-section {
      container-type: inline-size;
      padding-left: 0;
      padding-right: calc(64 / var(--font-size) * 1rem);
      margin-left: calc(-64 / var(--font-size) * 1rem);
    }
    .career-path .l-section__in {
      background: var(--white-color);
      padding-inline: calc(104 / var(--font-size) * 1rem) calc(64 / var(--font-size) * 1rem);
      padding-block: calc(32 / var(--font-size) * 1rem) calc(56 / var(--font-size) * 1rem);
    }
    .career-path .l-section__head {
      position: relative;
      &::before {
        content: '';
        position: absolute;
        left: 0;
        top: calc(50% - calc(64 / var(--font-size) * 1rem));
        -webkit-transform: translateY(-50%);
                transform: translateY(-50%);
        width: calc(175 / 1312 * 100cqi);
        aspect-ratio: 175/196;
        background: url(/assets/img/recruit/img_pimy03.png) no-repeat left top/contain;
      }
    }
    .career-path .l-section__head .c-heading {
      margin-inline: auto;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      gap: calc(8 / var(--font-size) * 1rem);
    }
    .career-block + .career-block {
      margin-top: calc(28 / var(--font-size) * 1rem);
    }
    .career-block {
      --career-bg-color: #eaf5fb;
      --career-main-color: #3d7ba5;
    }
    .career-block.--blue {
      --career-bg-color: #e3ebf6;
      --career-main-color: #286db8;
    }
    .career-block.--purple {
      --career-bg-color: #e2e7f2;
      --career-main-color: #20439e;
    }
    .career-block__in {
      background: var(--career-bg-color);
      padding-block: calc(28 / var(--font-size) * 1rem);
      min-height: calc(168 / var(--font-size) * 1rem);
      padding-inline: calc(40 / var(--font-size) * 1rem);
      border-bottom-right-radius: calc(50 / var(--font-size) * 1rem);
    }
    .career-block-heading {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      gap: calc(14 / var(--font-size) * 1rem);
      color: var(--career-main-color);
    }
    .career-block-heading::before {
      content: '';
      display: block;
      width: calc(11 / var(--font-size) * 1rem);
      height: calc(11 / var(--font-size) * 1rem);
      background-color: var(--career-main-color);
      border-radius: 9999px;
    }
    .career-block-heading__label {
      font-size: calc(22 / var(--font-size) * 1rem);
      font-weight: 500;
      line-height: 1.3;
      letter-spacing: 0.2em;
    }
    .career-block-heading__label > small {
      font-size: calc(18 / var(--font-size) * 1rem);
      letter-spacing: 0.2em;
    }
    .career-block-heading + .career-block-content {
      margin-top: calc(12 / var(--font-size) * 1rem);
    }
    .career-block-content {
      padding-left: calc(8 / var(--font-size) * 1rem);
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: start;
          -ms-flex-align: start;
              align-items: start;
      gap: calc(13 / var(--font-size) * 1rem);
    }
    .career-block-tag {
      display: inline-block;
      font-size: calc(14 / var(--font-size) * 1rem);
      line-height: 1;
      text-align: center;
      margin-top: calc(2 / var(--font-size) * 1rem);
      padding-block: calc(7 / var(--font-size) * 1rem) calc(8 / var(--font-size) * 1rem);
      padding-inline: calc(12 / var(--font-size) * 1rem) calc(11 / var(--font-size) * 1rem);
      background: var(--career-main-color);
    }
    .career-block-tag__label {
      letter-spacing: 0.1em;
      font-weight: 500;
      color: var(--white-color);
    }
    .career-block-lead {
      font-size: calc(16 / var(--font-size) * 1rem);
      line-height: 2;
      letter-spacing: 0.1em;
    }
    .career-block-lead__label {
    }
    .career-block-lead-ex {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
    }
    .career-block-lead-ex::before {
      content: '（例）';
    }
    .career-path-note {
      margin-top: calc(8 / var(--font-size) * 1rem);
    }
    .career-path-note .c-list {
      --list-font-size: 14;
    }
  }
  @media all and (width < 64rem) {
    .career-path.l-section {
      margin-left: calc(-48 / var(--font-size) * 1rem);
      padding-right: calc(0 / var(--font-size) * 1rem);
    }
    .career-path .l-section__in {
      padding-left: calc(64 / var(--font-size) * 1rem);
    }
  }
  @media all and (width < 48rem) {
    .career-path.l-section {
      padding-left: 0;
      padding-right: calc(24 / var(--font-size) * 1rem);
      margin-inline: calc(-16 / var(--font-size) * 1rem);
      margin-top: calc(136 / var(--font-size) * 1rem);
    }
    .career-path .l-section__in {
      background: var(--white-color);
      padding-inline: calc(16 / var(--font-size) * 1rem);
      padding-block: calc(48 / var(--font-size) * 1rem) calc(44 / var(--font-size) * 1rem);
    }
    .career-path .l-section__head {
      position: relative;
      &::before {
        content: '';
        position: absolute;
        left: 0;
        margin-left: calc(-32 / var(--font-size) * 1rem);
        top: 0;
        margin-top: calc(-136 / var(--font-size) * 1rem);
        width: calc(106 / var(--font-size) * 1rem);
        aspect-ratio: 175/196;
        background: url(/assets/img/recruit/img_pimy03.png) no-repeat left top/contain;
      }
    }
    .career-path .l-section__head .c-heading {
      margin-inline: auto;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      gap: calc(8 / var(--font-size) * 1rem);
    }
    .career-block + .career-block {
      margin-top: calc(28 / var(--font-size) * 1rem);
    }
    .career-block {
      --career-bg-color: #eaf5fb;
      --career-main-color: #3d7ba5;
    }
    .career-block.--blue {
      --career-bg-color: #e3ebf6;
      --career-main-color: #286db8;
    }
    .career-block.--purple {
      --career-bg-color: #e2e7f2;
      --career-main-color: #20439e;
    }
    .career-block__in {
      background: var(--career-bg-color);
      padding-block: calc(20 / var(--font-size) * 1rem);
      padding-inline: calc(16 / var(--font-size) * 1rem);
      border-bottom-right-radius: calc(40 / var(--font-size) * 1rem);
    }
    .career-block-heading {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      gap: calc(8 / var(--font-size) * 1rem);
      color: var(--career-main-color);
    }
    .career-block-heading::before {
      content: '';
      display: block;
      width: calc(8 / var(--font-size) * 1rem);
      height: calc(8 / var(--font-size) * 1rem);
      background-color: var(--career-main-color);
      border-radius: 9999px;
    }
    .career-block-heading__label {
      font-size: calc(16 / var(--font-size) * 1rem);
      font-weight: 500;
      line-height: 1.3;
      letter-spacing: 0.2em;
    }
    .career-block-heading__label > small {
      font-size: calc(14 / var(--font-size) * 1rem);
      letter-spacing: 0.2em;
    }
    .career-block-heading + .career-block-content {
      margin-top: calc(16 / var(--font-size) * 1rem);
    }
    .career-block-content {
    }
    .career-block-tag {
      display: inline-block;
      font-size: calc(12 / var(--font-size) * 1rem);
      line-height: 1;
      text-align: center;
      padding-block: calc(6 / var(--font-size) * 1rem) calc(6 / var(--font-size) * 1rem);
      padding-inline: calc(11 / var(--font-size) * 1rem) calc(10 / var(--font-size) * 1rem);
      background: var(--career-main-color);
    }
    .career-block-tag__label {
      letter-spacing: 0.1em;
      font-weight: 500;
      color: var(--white-color);
    }
    .career-block-lead {
      margin-top: calc(12 / var(--font-size) * 1rem);
      font-size: calc(13 / var(--font-size) * 1rem);
      line-height: 1.6;
      letter-spacing: 0.08em;
    }
    .career-block-lead__label {
    }
    .career-block-lead-ex {
    }
    .career-block-lead-ex::before {
      content: '（例）';
    }
    .career-path-note {
      margin-top: calc(8 / var(--font-size) * 1rem);
    }
    .career-path-note .c-list {
      --list-font-size: 12;
    }
  }

  /* OPEN POSITION */
  @media all and (width >= 48rem) {
    .open-positions.l-section {
      position: relative;
      padding-inline: 0;
      margin-inline: calc(-64 / var(--font-size) * 1rem);
    }
    .open-positions.l-section::before {
      position: absolute;
      content: '';
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-image: url(/assets/img/recruit/bg_open-position_pc.png);
      background-image: url(/assets/img/recruit/bg_open-position_pc.webp);
      background-image: url(/assets/img/recruit/bg_open-position_pc.avif);
      background-size: auto 100%;
      background-repeat: no-repeat;
      background-position: center;
      mix-blend-mode: multiply;
      z-index: -1;
      opacity: 0;
      -webkit-transform: translateY(3rem);
      transform: translateY(3rem);
      -webkit-transition: 0.8s;
      transition: 0.8s;
    }
    .open-positions.l-section.is-fadeUp-active::before {
      opacity: 1;
      -webkit-transform: translateY(0);
      transform: translateY(0);
    }
    .open-positions .l-section__in {
      padding-inline: calc(104 / var(--font-size) * 1rem);
      padding-block: calc(64 / var(--font-size) * 1rem) calc(140 / var(--font-size) * 1rem);
    }
    .open-positions .l-section__head {
      margin-bottom: calc(56 / var(--font-size) * 1rem);
    }
    .open-positions .l-section__head .c-heading {
      gap: calc(12 / var(--font-size) * 1rem);
    }
    .open-positions .l-section__head .c-heading__label,
    .open-positions .l-section__head .c-heading-lead {
      color: var(--white-color);
    }
    .open-positions-block {
      max-width: calc(916 / var(--font-size) * 1rem);
      margin-inline: auto;
    }
    .position-sub-heading {
      background: var(--primary-grd);
      padding-block: calc(16 / var(--font-size) * 1rem);
      padding-inline: calc(40 / var(--font-size) * 1rem);
      margin-bottom: calc(40 / var(--font-size) * 1rem);
    }
    .position-sub-heading__label {
      font-size: calc(25.78 / var(--font-size) * 1rem);
      letter-spacing: 0.1em;
      text-align: center;
      color: var(--white-color);
    }
    .position-block-list {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
      row-gap: calc(32 / var(--font-size) * 1rem);
      -webkit-column-gap: calc(38 / var(--font-size) * 1rem);
         -moz-column-gap: calc(38 / var(--font-size) * 1rem);
              column-gap: calc(38 / var(--font-size) * 1rem);
    }
    .position-block + .position-block {
      margin-top: 0;
    }

    .position-block {
      position: relative;
      width: calc((100% - calc(38 / var(--font-size) * 1rem)) / 2);
      --position-main-color: #72bbe1;
      -webkit-transition: all 0.25s ease;
      transition: all 0.25s ease;
    }
    .position-block::before {
      position: absolute;
      content: '';
      width: 100%;
      height: 100%;
      border-bottom-right-radius: calc(30 / var(--font-size) * 1rem);
      background-color: var(--white-color);
      z-index: 1;
      pointer-events: none;
      -webkit-transition: all 0.25s ease;
      transition: all 0.25s ease;
      opacity: 0;
    }
    .position-block:hover::before {
      opacity: 0.3;
    }
    .position-block.--02 {
      --position-main-color: #4b87c5;
    }
    .position-block.--03 {
      --position-main-color: #2961c5;
    }
    .position-block.--04 {
      --position-main-color: #20409c;
    }
    .position-block__in {
      background: var(--white-color);
      border-bottom-right-radius: calc(30 / var(--font-size) * 1rem);
      padding-block: calc(24 / var(--font-size) * 1rem) calc(24 / var(--font-size) * 1rem);
      padding-inline: calc(24 / var(--font-size) * 1rem) calc(24 / var(--font-size) * 1rem);

      display: -webkit-box;

      display: -ms-flexbox;

      display: flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
      gap: calc(24 / var(--font-size) * 1rem);
    }
    .position-block-title {
      text-align: center;
      width: 100%;
      min-width: calc(160 / var(--font-size) * 1rem);
      min-height: calc(62 / var(--font-size) * 1rem);
      padding-block: calc(4 / var(--font-size) * 1rem);
      padding-inline: calc(24 / var(--font-size) * 1rem);
      background: var(--position-main-color);
      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;
    }
    .position-block-title__label {
      line-height: 1.5;
      font-size: calc(18 / var(--font-size) * 1rem);
      letter-spacing: 0.1em;
      font-weight: 400;
      color: var(--white-color);
    }
    .position-block-btn-wrap {
      max-width: calc(235 / var(--font-size) * 1rem);
    }
    .position-block-btn {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      gap: calc(8 / var(--font-size) * 1rem);
    }
    .position-block-btn-txt__label {
      color: var(--position-main-color);
      font-family: var(--ff-en);
      font-size: calc(24 / var(--font-size) * 1rem);
      letter-spacing: 0.16em;
    }
    .position-block-btn-ico {
      width: calc(44 / var(--font-size) * 1rem);
      height: calc(34 / var(--font-size) * 1rem);
      background-color: var(--position-main-color);
      -webkit-mask-image: url(/assets/img/recruit/ico_arrow.svg);
              mask-image: url(/assets/img/recruit/ico_arrow.svg);
      -webkit-mask-position: center;
              mask-position: center;
      -webkit-mask-repeat: no-repeat;
              mask-repeat: no-repeat;
      -webkit-mask-size: contain;
              mask-size: contain;
    }
  }
  @media all and (width < 64rem) {
    .position-block__in {
      -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;
    }
    .position-block__head {
      width: 100%;
    }
    .how-we-work-block:nth-child(1) {
      padding-right: calc(16 / var(--font-size) * 1rem);
    }
    .how-we-work-block:nth-child(2) {
      padding-left: calc(16 / var(--font-size) * 1rem);
      border-left: calc(1 / var(--font-size) * 1rem) solid var(--primary-color-500);
    }
    .how-we-work-block:nth-child(3) {
      margin-top: calc(16 / var(--font-size) * 1rem);
      padding-top: calc(16 / var(--font-size) * 1rem);
      border-top: calc(1 / var(--font-size) * 1rem) solid var(--primary-color-500);
      -ms-grid-column: 1;
      -ms-grid-column-span: 2;
      grid-column: 1/3;
    }
  }
  @media all and (width < 48rem) {
    .open-positions.l-section {
      position: relative;
      padding-inline: 0;
      margin-inline: calc(-16 / var(--font-size) * 1rem);
    }
    .open-positions.l-section::before {
      position: absolute;
      content: '';
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-image: url(/assets/img/recruit/bg_open-position_sp.png);
      background-image: url(/assets/img/recruit/bg_open-position_sp.webp);
      background-image: url(/assets/img/recruit/bg_open-position_sp.avif);
      background-size: auto 100%;
      background-position: 75%;
      background-repeat: no-repeat;
      mix-blend-mode: multiply;
      z-index: -1;
      opacity: 0;
      -webkit-transform: translateY(3rem);
      transform: translateY(3rem);
      -webkit-transition: 0.8s;
      transition: 0.8s;
    }
    .open-positions.l-section.is-fadeUp-active::before {
      opacity: 1;
      -webkit-transform: translateY(0);
      transform: translateY(0);
    }
    .open-positions .l-section__in {
      max-width: calc(573 / var(--font-size) * 1rem);
      margin-inline: auto;
      padding-inline: calc(16 / var(--font-size) * 1rem);
      padding-block: calc(48 / var(--font-size) * 1rem) calc(52 / var(--font-size) * 1rem);
    }
    .open-positions .l-section__head {
      margin-bottom: calc(32 / var(--font-size) * 1rem);
    }
    .open-positions .l-section__head .c-heading {
      --heading-line-height: 1.1363636364;
      gap: calc(12 / var(--font-size) * 1rem);
    }
    .open-positions .l-section__head .c-heading__label,
    .open-positions .l-section__head .c-heading-lead {
      color: var(--white-color);
    }
    .open-positions .l-section__head .c-heading-lead {
      padding-left: 0;
    }
    .open-positions-block {
      margin-inline: auto;
    }
    .position-sub-heading {
      isolation: isolate;
      background: var(--primary-grd);
      padding-block: calc(12 / var(--font-size) * 1rem);
      padding-inline: calc(24 / var(--font-size) * 1rem);
      margin-bottom: calc(24 / var(--font-size) * 1rem);
    }
    .position-sub-heading__label {
      font-size: calc(16 / var(--font-size) * 1rem);
      letter-spacing: 0.08em;
      text-align: center;
      color: var(--white-color);
    }
    .position-block-list {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
      row-gap: calc(16 / var(--font-size) * 1rem);
      -webkit-column-gap: calc(16 / var(--font-size) * 1rem);
         -moz-column-gap: calc(16 / var(--font-size) * 1rem);
              column-gap: calc(16 / var(--font-size) * 1rem);
    }
    .position-block + .position-block {
      margin-top: 0;
    }

    .position-block {
      position: relative;
      width: calc((100% - calc(16 / var(--font-size) * 1rem)) / 2);
      --position-main-color: #72bbe1;
      -webkit-transition: all 0.25s ease;
      transition: all 0.25s ease;
    }
    .position-block.--02 {
      --position-main-color: #4b87c5;
    }
    .position-block.--03 {
      --position-main-color: #2961c5;
    }
    .position-block.--04 {
      --position-main-color: #20409c;
    }
    .position-block__in {
      background: var(--white-color);
      border-bottom-right-radius: calc(20 / var(--font-size) * 1rem);
      padding-block: calc(16 / var(--font-size) * 1rem) calc(14 / var(--font-size) * 1rem);
      padding-inline: calc(16 / var(--font-size) * 1rem);
    }
    .position-block-title {
      text-align: center;
      width: 100%;
      padding-block: calc(8 / var(--font-size) * 1rem);
      padding-inline: calc(16 / var(--font-size) * 1rem);
      background: var(--position-main-color);
    }
    .position-block-title__label {
      line-height: 1;
      font-size: calc(16 / var(--font-size) * 1rem);
      letter-spacing: 0.1em;
      font-weight: 400;
      color: var(--white-color);
    }
    .position-block-btn-wrap {
      margin-top: calc(12 / var(--font-size) * 1rem);
      width: 100%;
    }
    .position-block-btn {
      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;
      gap: calc(8 / var(--font-size) * 1rem);
      padding-left: calc(12 / var(--font-size) * 1rem);
    }
    .position-block-btn-txt__label {
      color: var(--position-main-color);
      font-family: var(--ff-en);
      font-size: calc(18 / var(--font-size) * 1rem);
      letter-spacing: 0.16em;
    }
    .position-block-btn-ico {
      width: calc(36 / var(--font-size) * 1rem);
      height: calc(27 / var(--font-size) * 1rem);
      background-color: var(--position-main-color);
      -webkit-mask-image: url(/assets/img/recruit/ico_arrow.svg);
              mask-image: url(/assets/img/recruit/ico_arrow.svg);
      -webkit-mask-position: center;
              mask-position: center;
      -webkit-mask-repeat: no-repeat;
              mask-repeat: no-repeat;
      -webkit-mask-size: contain;
              mask-size: contain;
    }
  }

  /* HOW WE WORK */
  @media all and (width >= 48rem) {
    .how-we-work + .l-section {
      margin-top: calc(168 / var(--font-size) * 1rem);
    }
    .how-we-work.l-section {
      padding-inline: 0;
      margin-inline: calc(-64 / var(--font-size) * 1rem);
      container-type: inline-size;
    }
    .how-we-work .l-section__head {
      position: relative;
      margin-bottom: calc(48 / var(--font-size) * 1rem);
    }
    .pimy-intr {
      position: absolute;
      right: 0;
      top: 0;
      margin-top: calc(-20 / 1440 * 100cqi);
      margin-right: calc(80 / 1440 * 100cqi);
      width: calc(248 / 1440 * 100cqi);
      aspect-ratio: 248/192;
      -webkit-transition: -webkit-transform 0.25s ease;
      transition: -webkit-transform 0.25s ease;
      transition: transform 0.25s ease;
      transition: transform 0.25s ease, -webkit-transform 0.25s ease;
    }
    .pimy-intr:hover {
      -webkit-transform: scale(1.08);
              transform: scale(1.08);
    }
    .how-we-work .l-section__head .c-heading {
      margin-inline: auto;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
    }
    .how-we-work .l-section__in {
      position: relative;
      padding-bottom: calc(96 / var(--font-size) * 1rem);
    }
    .how-we-work .l-section__in::before {
      content: '';
      position: absolute;
      width: 100%;
      height: 100%;
      left: 0;
      top: calc(48 / var(--font-size) * 1rem);
      background: var(--primary-color-20);
      mix-blend-mode: multiply;
      border-top-right-radius: calc(150 / var(--font-size) * 1rem);
      border-bottom-left-radius: calc(150 / var(--font-size) * 1rem);
      z-index: -1;
      opacity: 0;
      -webkit-transform: translateY(3rem);
      transform: translateY(3rem);
      -webkit-transition: 0.8s;
      transition: 0.8s;
    }
    .how-we-work.is-fadeUp-active .l-section__in::before {
      opacity: 1;
      -webkit-transform: translateY(0);
      transform: translateY(0);
    }

    .how-we-work-block-heading {
    }
    .how-we-work-block-heading__label {
      text-align: center;
      font-size: calc(28 / var(--font-size) * 1rem);
      font-weight: 500;
      letter-spacing: 0.1em;
      line-height: 1.253125;
      color: var(--primary-color-500);
    }
    .how-we-work-block-content__icon {
      height: calc(179 / var(--font-size) * 1rem);
    }

    /* 男女比 */
    .how-we-work-block-gender-content {
      display: -ms-grid;
      display: grid;
      justify-items: center;
      -ms-grid-columns: (1fr)[2];
      grid-template-columns: repeat(2, 1fr);
      -webkit-column-gap: calc(28 / var(--font-size) * 1rem);
         -moz-column-gap: calc(28 / var(--font-size) * 1rem);
              column-gap: calc(28 / var(--font-size) * 1rem);
    }
    .how-we-work-block-gender__item.--female {
      --block-main-color: #72bbe1;
    }
    .how-we-work-block-gender__item.--male {
      --block-main-color: #2961c5;
    }
    .how-we-work-block-gender__icon {
      content: '';
      aspect-ratio: 133/127;
      max-width: calc(133 / var(--font-size) * 1rem);
      background-color: var(--block-main-color);
      -webkit-mask-size: contain;
              mask-size: contain;
      -webkit-mask-repeat: no-repeat;
              mask-repeat: no-repeat;
    }
    .how-we-work-block-gender__item.--female .how-we-work-block-gender__icon {
      -webkit-mask-image: url(/assets/img/recruit/ico_female.svg);
              mask-image: url(/assets/img/recruit/ico_female.svg);
    }
    .how-we-work-block-gender__item.--male .how-we-work-block-gender__icon {
      -webkit-mask-image: url(/assets/img/recruit/ico_male.svg);
              mask-image: url(/assets/img/recruit/ico_male.svg);
    }
    .how-we-work-block-gender__ratio {
      margin-top: calc(16 / var(--font-size) * 1rem);
      font-family: var(--ff-en);
      color: var(--block-main-color);
      font-size: calc(35 / var(--font-size) * 1rem);
      font-weight: 500;
      text-align: center;
    }
    .how-we-work-block-gender__ratio > strong {
      font-weight: 500;
      font-size: calc(63 / var(--font-size) * 1rem);
      letter-spacing: 0.1em;
    }

    /* 入社年齢 */
    .how-we-work-block-age-content {
      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;
    }
    .how-we-work-block-age__value {
      text-align: center;
      color: var(--primary-color-500);
      font-weight: 500;
      font-size: calc(32 / var(--font-size) * 1rem);
      letter-spacing: 0.1em;
    }
    .how-we-work-block-age__value strong {
      font-family: var(--ff-en);
      font-weight: 600;
      font-size: calc(106.7 / var(--font-size) * 1rem);
      background: -webkit-gradient(linear, left top, right top, from(#76c1e4), to(#203e9b));
      background: linear-gradient(to right, #76c1e4, #203e9b);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
    .how-we-work-block-age__value strong > small {
      font-size: calc(89.76 / var(--font-size) * 1rem);
    }
    .how-we-work-block-age__icon {
      aspect-ratio: 133/92;
      max-width: calc(133 / var(--font-size) * 1rem);
    }

    /* バックグラウンド */
    .how-we-work-block-bg {
      position: relative;
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
      padding-left: 0;
    }
    .how-we-work-block-bg-heading {
      top: 0;
      left: calc(8 / var(--font-size) * 1rem);
      position: absolute;
    }
    .how-we-work-block-bg-heading__label {
      text-align: left;
      line-height: 1.2303571429;
    }
    .how-we-work-block-bg-content {
      -ms-flex-negative: 0;
          flex-shrink: 0;
    }
    .how-we-work-block-bg__value {
      aspect-ratio: 1/1;
      margin-left: calc(128 / var(--font-size) * 1rem);
    }
    .how-we-work-block-bg__value picture {
      vertical-align: middle;
    }
    .how-we-work-block-bg__value img {
      aspect-ratio: 1/1;
      max-width: calc(279 / var(--font-size) * 1rem);
    }

    /* 福利厚生 */
    .how-we-work-block-benefits {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
      gap: calc(40 / var(--font-size) * 1rem);
      -webkit-box-align: stretch;
          -ms-flex-align: stretch;
              align-items: stretch;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
    }
    .how-we-work-block-benefits-content {
      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;
      -ms-flex-negative: 1;
          flex-shrink: 1;
    }
    .how-we-work-block-benefits__item {
      padding-block: calc(20 / var(--font-size) * 1rem);
      text-align: center;
      font-size: calc(28 / var(--font-size) * 1rem);
      font-weight: 500;
      letter-spacing: 0.1em;
      line-height: 1.253125;
      color: var(--primary-color-500);
    }
    .how-we-work-block-benefits__item + .how-we-work-block-benefits__item {
      border-top: calc(1 / var(--font-size) * 1rem) solid var(--primary-color-500);
    }
    .how-we-work-block-benefits__item > small {
      display: block;
      font-size: calc(14 / var(--font-size) * 1rem);
      letter-spacing: 0.04em;
    }
    .how-we-work-benefits-btn {
      position: relative;
      -ms-flex-negative: 0;
          flex-shrink: 0;
      -webkit-transition: all 0.25s;
      transition: all 0.25s;
    }
    .how-we-work-benefits-btn a {
      border: calc(1 / var(--font-size) * 1rem) solid var(--primary-color-500);
      padding-inline: calc(32 / var(--font-size) * 1rem);
      height: 100%;
      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;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      gap: calc(16 / var(--font-size) * 1rem);
    }
    .how-we-work-benefits-btn-txt {
      text-align: center;
      font-weight: 500;
      font-size: calc(22 / var(--font-size) * 1rem);
      line-height: 1.4545454545;
      color: var(--primary-color-500);
      letter-spacing: 0.1em;
    }
    .how-we-work-benefits-btn-ico {
      width: calc(44 / var(--font-size) * 1rem);
      height: calc(34 / var(--font-size) * 1rem);
      background-color: var(--primary-color-500);
      -webkit-mask-image: url(/assets/img/recruit/ico_arrow.svg);
              mask-image: url(/assets/img/recruit/ico_arrow.svg);
      -webkit-mask-position: center;
              mask-position: center;
      -webkit-mask-repeat: no-repeat;
              mask-repeat: no-repeat;
      -webkit-mask-size: contain;
              mask-size: contain;
    }
    .how-we-work-benefits-btn:hover {
      opacity: 0.6;
    }
    .how-we-work-benefits-btn-note::before {
      content: '※';
    }
    .how-we-work-benefits-btn-note {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      position: absolute;
      bottom: calc(8 / var(--font-size) * 1rem);
      left: 50%;
      -webkit-transform: translateX(-50%);
              transform: translateX(-50%);
      width: 82%;
      font-weight: 500;
      font-size: calc(12 / var(--font-size) * 1rem);
      line-height: 1.5;
      color: var(--primary-color-500);
      letter-spacing: 0.1em;
    }
  }
  @media all and (width >= 79.6875rem) {
    .how-we-work-list {
      /* コンテナ */
      container-type: inline-size;
      container-name: howWeWorkContainer;
      padding-inline: calc(104 / var(--font-size) * 1rem);
    }
    .how-we-work-list-row {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      gap: calc(72 / var(--font-size) * 1rem);
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
    }
    .how-we-work-list-row + .how-we-work-list-row {
      padding-top: calc(24 / var(--font-size) * 1rem);
      margin-top: calc(24 / var(--font-size) * 1rem);
      border-top: calc(1 / var(--font-size) * 1rem) solid var(--primary-color-500);
    }
    .how-we-work-block {
      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;
      gap: calc(40 / var(--font-size) * 1rem);
      position: relative;
    }
    .how-we-work-block + .how-we-work-block::before {
      position: absolute;
      content: '';
      left: calc(-36 / var(--font-size) * 1rem);
      top: 50%;
      -webkit-transform: translateY(-50%);
              transform: translateY(-50%);
      width: calc(1 / var(--font-size) * 1rem);
      height: 100%;
      background: var(--primary-color-500);
    }
    .how-we-work-list-row:nth-of-type(2) {
      display: -ms-grid;
      display: grid;
      -ms-grid-columns: 1fr 1fr 2.3fr;
      grid-template-columns: 1fr 1fr 2.3fr;
    }
    .how-we-work-block-benefits {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      -webkit-box-align: stretch;
          -ms-flex-align: stretch;
              align-items: stretch;
      gap: calc(40 / var(--font-size) * 1rem);
    }
  }
  @media all and (width < 79.6875rem) {
    .how-we-work-list {
      padding-inline: calc(48 / var(--font-size) * 1rem);
    }
    .how-we-work-list-row {
      display: -ms-grid;
      display: grid;
      -ms-grid-columns: (1fr)[2];
      grid-template-columns: repeat(2, 1fr);
    }
    .how-we-work-list-row + .how-we-work-list-row {
      margin-top: calc(24 / var(--font-size) * 1rem);
      padding-top: calc(24 / var(--font-size) * 1rem);
      border-top: calc(1 / var(--font-size) * 1rem) solid var(--primary-color-500);
    }
    .how-we-work-block {
      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;
      gap: calc(24 / var(--font-size) * 1rem);
    }
    .how-we-work-block:nth-child(1) {
      padding-right: calc(24 / var(--font-size) * 1rem);
    }
    .how-we-work-block:nth-child(2) {
      padding-left: calc(24 / var(--font-size) * 1rem);
      border-left: calc(1 / var(--font-size) * 1rem) solid var(--primary-color-500);
    }
    .how-we-work-block:nth-child(3) {
      margin-top: calc(24 / var(--font-size) * 1rem);
      padding-top: calc(24 / var(--font-size) * 1rem);
      border-top: calc(1 / var(--font-size) * 1rem) solid var(--primary-color-500);
      -ms-grid-column: 1;
      -ms-grid-column-span: 2;
      grid-column: 1/3;
    }
    .how-we-work-block-bg {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
    }
    .how-we-work-block-bg-heading {
      position: static;
    }
    .how-we-work-block-bg__value {
      margin-left: calc(24 / var(--font-size) * 1rem);
    }
    .how-we-work-block-benefits {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      -webkit-box-align: stretch;
          -ms-flex-align: stretch;
              align-items: stretch;
      gap: calc(40 / var(--font-size) * 1rem);
    }
    .pimy-intr {
      margin-top: calc(-54 / var(--font-size) * 1rem);
    }
  }
  @media all and (width < 48rem) {
    .how-we-work + .l-section {
      margin-top: calc(112 / var(--font-size) * 1rem);
    }
    .how-we-work.l-section {
      position: relative;
      padding-inline: 0;
      margin-inline: calc(-16 / var(--font-size) * 1rem);
      padding-top: calc(64 / var(--font-size) * 1rem);
    }
    .pimy-intr {
      position: absolute;
      right: calc(50% - calc(96 / var(--font-size) * 1rem));
      top: 0;
      -webkit-transform: translateX(50%);
              transform: translateX(50%);
      margin-top: calc(-72 / var(--font-size) * 1rem);
      width: calc(154 / var(--font-size) * 1rem);
      aspect-ratio: 248/192;
      -webkit-transition: all 0.25s ease;
      transition: all 0.25s ease;
    }
    .pimy-intr:hover {
      -webkit-transform: translateX(50%) scale(1.1);
              transform: translateX(50%) scale(1.1);
    }
    .how-we-work .l-section__head {
      margin-bottom: calc(24 / var(--font-size) * 1rem);
    }
    .how-we-work .l-section__head .c-heading {
      margin-inline: auto;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
    }
    .how-we-work .l-section__in {
      position: relative;
    }
    .how-we-work .l-section__in::before {
      content: '';
      position: absolute;
      width: 100%;
      height: calc(100% - calc(32 / var(--font-size) * 1rem));
      left: 0;
      top: calc(80 / var(--font-size) * 1rem);
      background: var(--primary-color-20);
      mix-blend-mode: multiply;
      border-top-left-radius: calc(50 / var(--font-size) * 1rem);
      border-bottom-right-radius: calc(50 / var(--font-size) * 1rem);
      z-index: -1;
      opacity: 0;
      -webkit-transform: translateY(3rem);
      transform: translateY(3rem);
      -webkit-transition: 0.8s;
      transition: 0.8s;
    }
    .how-we-work.is-fadeUp-active .l-section__in::before {
      opacity: 1;
      -webkit-transform: translateY(0);
      transform: translateY(0);
    }

    .how-we-work-list {
      padding-inline: calc(16 / var(--font-size) * 1rem);
    }
    .how-we-work-list-row {
      display: -ms-grid;
      display: grid;
      -ms-grid-columns: (1fr)[2];
      grid-template-columns: repeat(2, 1fr);
    }
    .how-we-work-list-row + .how-we-work-list-row {
      margin-top: calc(16 / var(--font-size) * 1rem);
      padding-top: calc(16 / var(--font-size) * 1rem);
      border-top: calc(1 / var(--font-size) * 1rem) solid var(--primary-color-500);
    }
    .how-we-work-block {
      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;
      gap: calc(16 / var(--font-size) * 1rem);
    }
    .how-we-work-block:nth-child(1) {
      padding-right: calc(16 / var(--font-size) * 1rem);
    }
    .how-we-work-block:nth-child(2) {
      padding-left: calc(16 / var(--font-size) * 1rem);
      border-left: calc(1 / var(--font-size) * 1rem) solid var(--primary-color-500);
    }
    .how-we-work-block:nth-child(3) {
      margin-top: calc(16 / var(--font-size) * 1rem);
      padding-top: calc(16 / var(--font-size) * 1rem);
      border-top: calc(1 / var(--font-size) * 1rem) solid var(--primary-color-500);
      -ms-grid-column: 1;
      -ms-grid-column-span: 2;
      grid-column: 1/3;
    }
    .how-we-work-block-heading {
    }
    .how-we-work-block-heading__label {
      text-align: center;
      font-size: calc(18 / var(--font-size) * 1rem);
      font-weight: 500;
      letter-spacing: 0.1em;
      line-height: 1.253125;
      color: var(--primary-color-500);
    }
    .how-we-work-block-content__icon {
      width: calc(96 / var(--font-size) * 1rem);
    }

    /* 男女比 */
    .how-we-work-block-gender-content {
      display: -ms-grid;
      display: grid;
      justify-items: center;
      -ms-grid-columns: (1fr)[2];
      grid-template-columns: repeat(2, 1fr);
      -webkit-column-gap: calc(8 / var(--font-size) * 1rem);
         -moz-column-gap: calc(8 / var(--font-size) * 1rem);
              column-gap: calc(8 / var(--font-size) * 1rem);
    }
    .how-we-work-block-gender__item.--female {
      --block-main-color: #72bbe1;
    }
    .how-we-work-block-gender__item.--male {
      --block-main-color: #2961c5;
    }
    .how-we-work-block-gender__icon {
      content: '';
      width: calc(70 / var(--font-size) * 1rem);
      height: calc(70 / var(--font-size) * 1rem);
      background-color: var(--block-main-color);
      -webkit-mask-size: contain;
              mask-size: contain;
      -webkit-mask-repeat: no-repeat;
              mask-repeat: no-repeat;
    }
    .how-we-work-block-gender__item.--female .how-we-work-block-gender__icon {
      -webkit-mask-image: url(/assets/img/recruit/ico_female.svg);
              mask-image: url(/assets/img/recruit/ico_female.svg);
    }
    .how-we-work-block-gender__item.--male .how-we-work-block-gender__icon {
      -webkit-mask-image: url(/assets/img/recruit/ico_male.svg);
              mask-image: url(/assets/img/recruit/ico_male.svg);
    }
    .how-we-work-block-gender__ratio {
      margin-top: calc(8 / var(--font-size) * 1rem);
      font-family: var(--ff-en);
      color: var(--block-main-color);
      font-size: calc(20 / var(--font-size) * 1rem);
      font-weight: 500;
      text-align: center;
    }
    .how-we-work-block-gender__ratio > strong {
      font-weight: 500;
      font-size: calc(33 / var(--font-size) * 1rem);
      letter-spacing: 0.1em;
    }

    /* 入社年齢 */
    .how-we-work-block-age-content {
      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;
    }
    .how-we-work-block-age__value {
      text-align: center;
      color: var(--primary-color-500);
      font-weight: 500;
      font-size: calc(17 / var(--font-size) * 1rem);
      letter-spacing: 0.1em;
    }
    .how-we-work-block-age__value strong {
      font-family: var(--ff-en);
      font-weight: 600;
      font-size: calc(56 / var(--font-size) * 1rem);
      background: -webkit-gradient(linear, left top, right top, from(#76c1e4), to(#203e9b));
      background: linear-gradient(to right, #76c1e4, #203e9b);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
    .how-we-work-block-age__value strong > small {
      font-size: calc(48 / var(--font-size) * 1rem);
    }
    .how-we-work-block-age__icon {
      width: calc(68 / var(--font-size) * 1rem);
      height: calc(44 / var(--font-size) * 1rem);
    }

    /* バックグラウンド */
    .how-we-work-block-bg {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      padding-left: 0;
    }
    .how-we-work-block-bg-heading {
    }
    .how-we-work-block-bg-heading__label {
      line-height: 1.5;
    }
    .how-we-work-block-bg-content {
    }
    .how-we-work-block-bg__value {
      aspect-ratio: 1/1;
    }
    .how-we-work-block-bg__value picture {
      vertical-align: middle;
    }
    .how-we-work-block-bg__value img {
      aspect-ratio: 1/1;
      width: calc(168 / var(--font-size) * 1rem);
      height: calc(168 / var(--font-size) * 1rem);
    }

    /* 福利厚生 */
    .how-we-work-block-benefits {
      -webkit-box-orient: horizontal;
      -webkit-box-direction: normal;
          -ms-flex-direction: row;
              flex-direction: row;
      gap: calc(16 / var(--font-size) * 1rem);
      -webkit-box-align: stretch;
          -ms-flex-align: stretch;
              align-items: stretch;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
    }
    .how-we-work-block-benefits-content {
      -webkit-box-flex: 1;
          -ms-flex: 1;
              flex: 1;
      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;
    }
    .how-we-work-block-benefits__item {
      padding-block: calc(16 / var(--font-size) * 1rem);
      text-align: center;
      font-size: calc(18 / var(--font-size) * 1rem);
      font-weight: 500;
      letter-spacing: 0.08em;
      line-height: 1.5;
      color: var(--primary-color-500);
    }
    .how-we-work-block-benefits__item + .how-we-work-block-benefits__item {
      border-top: calc(1 / var(--font-size) * 1rem) solid var(--primary-color-500);
    }
    .how-we-work-block-benefits__item > small {
      display: block;
      font-size: calc(12 / var(--font-size) * 1rem);
      letter-spacing: 0.04em;
    }
    .how-we-work-benefits-btn {
      position: relative;
      -webkit-box-flex: 1;
          -ms-flex: 1;
              flex: 1;
    }
    .how-we-work-benefits-btn a {
      border: calc(1 / var(--font-size) * 1rem) solid var(--primary-color-500);
      padding-inline: calc(8 / var(--font-size) * 1rem);
      height: 100%;
      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;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      gap: calc(16 / var(--font-size) * 1rem);
    }
    .how-we-work-benefits-btn-txt {
      text-align: center;
      font-weight: 500;
      font-size: calc(16 / var(--font-size) * 1rem);
      line-height: 1.4545454545;
      color: var(--primary-color-500);
      letter-spacing: 0.1em;
    }
    .how-we-work-benefits-btn-ico {
      width: calc(44 / var(--font-size) * 1rem);
      height: calc(34 / var(--font-size) * 1rem);
      background-color: var(--primary-color-500);
      -webkit-mask-image: url(/assets/img/recruit/ico_arrow.svg);
              mask-image: url(/assets/img/recruit/ico_arrow.svg);
      -webkit-mask-position: center;
              mask-position: center;
      -webkit-mask-repeat: no-repeat;
              mask-repeat: no-repeat;
      -webkit-mask-size: contain;
              mask-size: contain;
    }
    .how-we-work-benefits-btn-note::before {
      content: '※';
    }
    .how-we-work-benefits-btn-note {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      position: absolute;
      bottom: calc(8 / var(--font-size) * 1rem);
      left: 50%;
      -webkit-transform: translateX(-50%);
              transform: translateX(-50%);
      width: 91%;
      font-weight: 500;
      font-size: calc(10 / var(--font-size) * 1rem);
      line-height: 1.5;
      color: var(--primary-color-500);
      letter-spacing: 0.1em;
    }
  }

  /* JOIN US */
  @media all and (width >= 48rem) {
    .join-us.l-section {
      /* コンテナ */
      container-type: inline-size;
      background-image: url(/assets/img/recruit/bg_join-us_pc.png);
      background-image: url(/assets/img/recruit/bg_join-us_pc.webp);
      background-image: url(/assets/img/recruit/bg_join-us_pc.avif);
      background-size: 100% auto;
      background-repeat: no-repeat;
      margin-inline: calc(-64 / var(--font-size) * 1rem);
    }
    .join-us .l-section__head {
      aspect-ratio: 1360/512;
      position: relative;
      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: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
      margin-bottom: calc(32 / var(--font-size) * 1rem);
    }
    .join-us .l-section__head::before {
      content: 'Join us';
      white-space: nowrap;
      position: absolute;
      font-family: var(--ff-en);
      font-weight: 200;
      font-style: italic;
      font-size: calc(183.53 / 1440 * 100cqi);
      letter-spacing: 0.1em;
      line-height: 0.8;
      color: #72bbe1;
      opacity: 0.24;
      top: 0;
      left: 50%;
      -webkit-transform: translateX(-50%);
              transform: translateX(-50%);
      z-index: -1;
    }
    .join-us .l-section__head .c-heading {
      margin-inline: auto;
      padding-block: calc(60 / var(--font-size) * 1rem) calc(60 / var(--font-size) * 1rem);
    }
    .join-us .l-section__head .c-heading__label {
      font-size: calc(46.09 / var(--font-size) * 1rem);
      color: var(--primary-color-500);
      letter-spacing: 0;
    }
    .join-us-lead {
      position: relative;
      text-align: center;
      font-weight: 500;
      font-size: calc(20 / var(--font-size) * 1rem);
      line-height: 1.6615;
      letter-spacing: 0.16em;
      color: var(--white-color);
      width: -webkit-fit-content;
      width: -moz-fit-content;
      width: fit-content;
      margin-inline: auto;
      mix-blend-mode: multiply;
    }
    .join-us-lead::before {
      content: '';
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%);
      width: 100%;
      height: 100%;
      background-color: rgba(64, 146, 194, 1);
      z-index: -1;
      -webkit-filter: blur(48px);
              filter: blur(48px);
      mix-blend-mode: multiply;
    }
    .join-us-lead + .open-positions-block {
      margin-top: calc(32 / var(--font-size) * 1rem);
    }
    .join-us .open-positions-block {
    }
    .join-us .position-block__in {
      position: relative;
    }
    .join-us .position-block__in::before {
      content: '';
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%);
      width: 100%;
      height: 100%;
      background: #63a1da;
      opacity: 0.2;
      z-index: -1;
      -webkit-filter: blur(40px);
              filter: blur(40px);
      mix-blend-mode: multiply;
    }
  }
  @media all and (width < 48rem) {
    .join-us.l-section {
      background-image: url(/assets/img/recruit/bg_join-us_sp.png);
      /* background-image: url(/assets/img/recruit/bg_join-us_pc.webp);
      background-image: url(/assets/img/recruit/bg_join-us_pc.avif); */
      background-size: auto 54%;
      background-position: center calc(48 / var(--font-size) * 1rem);
      background-repeat: no-repeat;
      margin-inline: calc(-16 / var(--font-size) * 1rem);
    }
    .join-us .l-section__head {
      position: relative;
      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: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
      min-height: calc(380 / var(--font-size) * 1rem);
      margin-bottom: calc(16 / var(--font-size) * 1rem);
      padding-bottom: 0;
    }
    .join-us .l-section__head::before {
      content: 'Join us';
      white-space: nowrap;
      position: absolute;
      font-family: var(--ff-en);
      font-weight: 200;
      font-style: italic;
      font-size: calc(74 / var(--font-size) * 1rem);
      letter-spacing: 0.03em;
      line-height: 0.8;
      color: #72bbe1;
      opacity: 0.24;
      top: 0.4em;
      left: 50%;
      -webkit-transform: translateX(-50%);
              transform: translateX(-50%);
      z-index: -1;
    }
    .join-us .l-section__head .c-heading {
      margin-inline: auto;
      padding-block: calc(60 / var(--font-size) * 1rem) calc(60 / var(--font-size) * 1rem);
    }
    .join-us .l-section__head .c-heading__label {
      font-size: calc(30 / var(--font-size) * 1rem);
      color: var(--primary-color-500);
      letter-spacing: 0;
      line-height: 1.5;
    }
    .join-us-lead {
      position: relative;
      text-align: center;
      font-weight: 500;
      font-size: calc(14 / var(--font-size) * 1rem);
      line-height: 1.7857142857;
      letter-spacing: 0.06em;
      color: var(--white-color);
      width: -webkit-fit-content;
      width: -moz-fit-content;
      width: fit-content;
      margin-inline: auto;
      mix-blend-mode: multiply;
    }
    .join-us-lead::before {
      content: '';
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%);
      width: 100%;
      height: 100%;
      background-color: rgba(64, 146, 194, 1);
      z-index: -1;
      -webkit-filter: blur(48px);
              filter: blur(48px);
      mix-blend-mode: multiply;
    }
    .join-us-lead + .open-positions-block {
      margin-top: calc(16 / var(--font-size) * 1rem);
    }
    .join-us .open-positions-block {
      padding-inline: calc(16 / var(--font-size) * 1rem);
    }
    .join-us .position-block__in {
      position: relative;
    }
    .join-us .position-block__in::before {
      content: '';
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%);
      width: 100%;
      height: 100%;
      background: #63a1da;
      opacity: 0.2;
      z-index: -1;
      -webkit-filter: blur(40px);
              filter: blur(40px);
      mix-blend-mode: multiply;
    }
  }

  /* 動画セクション */
  @media all and (width >= 48rem) {
    .recruit-video {
      position: relative;
    }
    .recruit-video-slider .splide__arrows {
      right: calc(48 / var(--font-size) * 1rem);
    }
    .recruit-video::before {
      position: absolute;
      content: '';
      width: 100%;
      height: 100%;
      left: 0;
      top: 0;
      background: #e3eff596;
      mix-blend-mode: multiply;
      z-index: -1;
      opacity: 0;
      -webkit-transform: translateY(3rem);
              transform: translateY(3rem);
      -webkit-transition: 0.8s;
      transition: 0.8s;
    }
    .recruit-video.is-fadeUp-active::before {
      opacity: 1;
      -webkit-transform: translateY(0);
              transform: translateY(0);
    }
    .recruit-video .l-section__in {
      container-name: videoContainer;
      container-type: inline-size;
      padding-block: calc(40 / var(--font-size) * 1rem) calc(64 / var(--font-size) * 1rem);
    }
    .recruit-video-slider .splide__arrows {
      position: absolute;
      top: calc(-60 / var(--font-size) * 1rem);
      right: 0;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      gap: calc(24 / var(--font-size) * 1rem);
    }
    .recruit-video-slider .splide__arrow {
      pointer-events: none;
      position: static;
      background-color: #bdbfc1;
      opacity: 1;
      -webkit-mask-image: url(/assets/img/common/ico_btn-arrow.svg);
              mask-image: url(/assets/img/common/ico_btn-arrow.svg);
      -webkit-mask-size: contain;
              mask-size: contain;
      -webkit-mask-repeat: no-repeat;
              mask-repeat: no-repeat;
      width: calc(49 / var(--font-size) * 1rem);
      height: calc(31 / var(--font-size) * 1rem);
      -webkit-transform: rotate(360deg);
              transform: rotate(360deg);
      -webkit-transition: all 0.25s;
      transition: all 0.25s;
    }
    .recruit-video-slider.is-overflow .splide__arrow {
      pointer-events: auto;
      background-color: var(--primary-color-500);
    }
    .recruit-video-slider .splide__arrow--prev {
      -webkit-transform: rotate(180deg);
              transform: rotate(180deg);
    }
    .recruit-video-track {
      overflow: visible !important;
    }
    .recruit-video-item {
    }
    .recruit-video-title {
      margin-top: calc(8 / var(--font-size) * 1rem);
    }
    .recruit-video-title__label {
      font-size: calc(18 / var(--font-size) * 1rem);
      line-height: 1.6;
      font-weight: 500;
      letter-spacing: 0.1em;
    }
    .recruit-video-visual {
      position: relative;
      -webkit-transition: all 0.25s;
      transition: all 0.25s;
    }
    .recruit-video-visual::before {
      content: '';
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%);
      width: calc(54 / var(--font-size) * 1rem);
      height: calc(54 / var(--font-size) * 1rem);
      background-image: url(/assets/img/casestudy/ico_play.svg);
      background-size: contain;
      background-repeat: no-repeat;
    }
    .recruit-video-visual::after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: var(--white-color);
      opacity: 0;
      -webkit-transition: all 0.25s;
      transition: all 0.25s;
    }
    .recruit-video-item:hover .recruit-video-visual::after {
      opacity: 0.3;
    }

    /* モーダル */
    html.is-modal-active {
      overflow: hidden;
    }
    .modal-overlay {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: rgba(0, 0, 0, 0.8);
      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;
      z-index: 9999;
    }

    .modal-content {
      position: relative;
      background: white;
      padding-block: calc(48 / var(--font-size) * 1rem);
      padding-inline: calc(48 / var(--font-size) * 1rem);
      width: 100%;
      height: 90vh;
      height: 90dvh;
      max-width: calc(1080 / var(--font-size) * 1rem);
      max-height: calc(720 / var(--font-size) * 1rem);
      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;
    }

    .modal-close {
      position: absolute;
      top: calc(12 / var(--font-size) * 1rem);
      right: calc(16 / var(--font-size) * 1rem);
      background: none;
      border: none;
      font-size: calc(24 / var(--font-size) * 1rem);
      line-height: 1;
      cursor: pointer;
      z-index: 1;
      color: #333;
      width: calc(24 / var(--font-size) * 1rem);
      height: calc(24 / var(--font-size) * 1rem);
      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;
      -webkit-transition: background-color 0.2s;
      transition: background-color 0.2s;
    }

    .modal-close:hover {
      background-color: #f0f0f0;
    }

    #youtube-player {
      max-width: 100%;
      max-height: 100%;
    }
  }
  @media all and (width < 48rem) {
    /* 動画セクション */
    .recruit-video-slider {
    }
    .recruit-video-slider .splide__arrows {
      position: absolute;
      top: calc(-40 / var(--font-size) * 1rem);
      right: 0;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      gap: calc(20 / var(--font-size) * 1rem);
    }
    .recruit-video-slider .splide__arrow {
      position: static;
      background-color: var(--primary-color-500);
      opacity: 1;
      -webkit-mask-image: url(/assets/img/common/ico_btn-arrow.svg);
              mask-image: url(/assets/img/common/ico_btn-arrow.svg);
      -webkit-mask-size: contain;
              mask-size: contain;
      -webkit-mask-repeat: no-repeat;
              mask-repeat: no-repeat;
      width: calc(44 / var(--font-size) * 1rem);
      height: calc(28 / var(--font-size) * 1rem);
      -webkit-transform: rotate(360deg);
              transform: rotate(360deg);
      -webkit-transition: all 0.25s;
      transition: all 0.25s;
    }
    .recruit-video-item {
      max-width: calc(360 / var(--font-size) * 1rem);
      min-width: calc(272 / var(--font-size) * 1rem);
    }
    .recruit-video-slider .splide__arrow:disabled {
      pointer-events: none;
      background-color: #bdbfc1;
    }
    .recruit-video-slider .splide__arrow--prev {
      -webkit-transform: rotate(180deg);
              transform: rotate(180deg);
    }
    .recruit-video-track {
      overflow: visible !important;
    }
    .recruit-video-title {
      margin-top: calc(8 / var(--font-size) * 1rem);
    }
    .recruit-video-title__label {
      font-size: calc(16 / var(--font-size) * 1rem);
      line-height: 1.6;
      font-weight: 500;
      letter-spacing: 0.1em;
    }
    .recruit-video-visual {
      position: relative;
      -webkit-transition: all 0.25s;
      transition: all 0.25s;
    }
    .recruit-video-visual::before {
      content: '';
      position: absolute;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%);
      width: calc(40 / var(--font-size) * 1rem);
      height: calc(40 / var(--font-size) * 1rem);
      background-image: url(/assets/img/casestudy/ico_play.svg);
      background-size: contain;
      background-repeat: no-repeat;
    }
    .recruit-video-visual::after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: var(--white-color);
      opacity: 0;
      -webkit-transition: all 0.25s;
      transition: all 0.25s;
    }

    /* モーダル */
    html.is-modal-active {
      overflow: hidden;
    }
    .modal-overlay {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: rgba(0, 0, 0, 0.8);
      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;
      z-index: 9999;
    }

    .modal-content {
      position: relative;
      background: white;
      padding-block: calc(32 / var(--font-size) * 1rem) calc(16 / var(--font-size) * 1rem);
      padding-inline: calc(16 / var(--font-size) * 1rem);
      max-width: 100vw;
      max-height: 100vh;
      max-height: 100dvh;
      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;
    }

    .modal-close {
      position: absolute;
      top: calc(4 / var(--font-size) * 1rem);
      right: calc(8 / var(--font-size) * 1rem);
      background: none;
      border: none;
      font-size: calc(20 / var(--font-size) * 1rem);
      line-height: 1;
      cursor: pointer;
      z-index: 1;
      color: #333;
      width: calc(24 / var(--font-size) * 1rem);
      height: calc(24 / var(--font-size) * 1rem);
      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;
      -webkit-transition: background-color 0.2s;
      transition: background-color 0.2s;
    }

    #youtube-player {
      max-width: 100%;
      max-height: 100%;
    }
  }
}

/* ==========================================================================
  INTERVIEW 詳細
========================================================================== */
@layer page {
  @counter-style two-digit {
    system: numeric;
    symbols: '00' '01' '02' '03' '04' '05' '06' '07' '08' '09' '10';
  }
  @media all and (width >= 48rem) {
    .recruit-interview .l-container {
      padding-top: 0;
    }
    .recruit-interview-mv {
      position: relative;
      height: calc(544 / var(--font-size) * 1rem);
      margin-inline: calc(-104 / var(--font-size) * 1rem);
      padding-inline: calc(128 / var(--font-size) * 1rem) calc(64 / var(--font-size) * 1rem);
      padding-top: calc(48 / var(--font-size) * 1rem);
      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;
      gap: calc(72 / var(--font-size) * 1rem);
    }
    .recruit-interview-mv-visual {
      position: absolute;
      top: 0;
      left: 0;
      z-index: -1;
    }
    .recruit-interview-mv-visual img {
      height: calc(544 / var(--font-size) * 1rem);
      -o-object-fit: cover;
         object-fit: cover;
      -o-object-position: 60% top;
         object-position: 60% top;
    }
    .recruit-interview-mv-heading__label {
      color: var(--white-color);
      font-size: calc(49.08 / var(--font-size) * 1rem);
      letter-spacing: 0.1em;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      gap: calc(28 / var(--font-size) * 1rem);
      -webkit-box-align: start;
          -ms-flex-align: start;
              align-items: start;
    }
    .recruit-interview-mv-heading__label > span {
      padding-inline: calc(24 / var(--font-size) * 1rem);
      padding-block: calc(20 / var(--font-size) * 1rem);
      background: -webkit-gradient(linear, left top, right top, from(#20409c), to(#3394c6));
      background: linear-gradient(to right, #20409c, #3394c6);
    }
    .recruit-interview-mv-info {
      width: -webkit-fit-content;
      width: -moz-fit-content;
      width: fit-content;
      display: -ms-grid;
      display: grid;
      row-gap: calc(16 / var(--font-size) * 1rem);
      -ms-grid-columns: auto auto;
      grid-template-columns: auto auto;
      -webkit-box-align: end;
          -ms-flex-align: end;
              align-items: end;
      background: var(--white-color);
      padding-inline: calc(26 / var(--font-size) * 1rem);
      padding-block: calc(24 / var(--font-size) * 1rem);
    }
    .recruit-interview-mv-info .intve-bio {
      font-size: calc(20.42 / var(--font-size) * 1rem);
      letter-spacing: 0.1em;
    }
    .recruit-interview-mv-info .intve-name {
      font-size: calc(26 / var(--font-size) * 1rem);
      letter-spacing: 0.1em;
    }
    .recruit-interview-mv .intve-position {
      -ms-grid-column: 1;
      -ms-grid-column-span: 2;
      grid-column: 1/3;
      font-weight: 500;
      font-size: calc(20 / var(--font-size) * 1rem);
      color: var(--primary-color-500);
      letter-spacing: 0.08em;
    }
    .recruit-interview-lead {
      position: relative;
      container-type: inline-size;
      margin-block: calc(56 / var(--font-size) * 1rem) calc(80 / var(--font-size) * 1rem);
      padding-inline: calc(56 / var(--font-size) * 1rem);
      &::before {
        content: '';
        position: absolute;
        right: 0;
        bottom: 0;
        margin-bottom: calc(-80 / 1120 * 100cqi);
        margin-right: calc(-64 / 1120 * 100cqi);
        width: calc(186 / 1120 * 100cqi);
        aspect-ratio: 186/192;
        background: url(/assets/img/recruit/interview/img_lead.png) no-repeat left top/contain;
      }
    }
    .recruit-interview-lead__in {
      position: relative;
      padding-inline: calc(54 / var(--font-size) * 1rem) calc(64 / var(--font-size) * 1rem);
      padding-block: calc(32 / var(--font-size) * 1rem);
    }
    .recruit-interview-lead__in::before {
      position: absolute;
      content: '';
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: var(--primary-color-20);
      z-index: -1;
      mix-blend-mode: multiply;
      border-top-left-radius: calc(50 / var(--font-size) * 1rem);
      border-bottom-right-radius: calc(50 / var(--font-size) * 1rem);
    }
    .recruit-interview-lead__label {
      font-size: calc(20 / var(--font-size) * 1rem);
      line-height: 1.8;
      letter-spacing: 0.1em;
    }

    .recruit-interview-block {
      counter-reset: section 0;
    }
    .recruit-interview-block section {
      counter-increment: section 1;
    }
    .recruit-interview-block h3::before {
      content: counter(section, two-digit);
      font-size: calc(83.74 / var(--font-size) * 1rem);
      font-family: var(--ff-en);
      font-weight: 200;
      letter-spacing: 0.1em;
      font-style: italic;
      background: -webkit-gradient(linear, left top, right top, from(#203e9b), color-stop(#2e78bf), to(#85e1ff));
      background: linear-gradient(to right, #203e9b, #2e78bf, #85e1ff);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      margin-right: calc(16 / var(--font-size) * 1rem);
    }
    .recruit-interview-block * + * {
      margin-top: calc(32 / var(--font-size) * 1rem);
    }
    .recruit-interview-block section + section {
      margin-top: calc(96 / var(--font-size) * 1rem);
    }
    .recruit-interview-block h4 + * {
      margin-top: calc(24 / var(--font-size) * 1rem);
    }
    .recruit-interview-block p + p {
      margin-top: calc(16 / var(--font-size) * 1rem);
    }
    .recruit-interview-block h3 {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      position: relative;
      font-weight: 500;
      font-size: calc(36 / var(--font-size) * 1rem);
      color: #20409c;
      line-height: 1.41;
      letter-spacing: 0.1em;
    }
    .recruit-interview-block h3::after {
      content: '';
      bottom: 0;
      left: 0;
      position: absolute;
      width: 100%;
      height: calc(1 / var(--font-size) * 1rem);
      background: -webkit-gradient(linear, left top, right top, from(#20409c), color-stop(66%, #2e78bf), to(#85e1ff));
      background: linear-gradient(to right, #20409c, #2e78bf 66%, #85e1ff);
    }
    .recruit-interview-block h4 {
      font-size: calc(26 / var(--font-size) * 1rem);
      font-weight: 500;
      letter-spacing: 0.1em;
      line-height: 1.6;
    }
    .recruit-interview-block p {
      font-size: calc(16 / var(--font-size) * 1rem);
      line-height: 2;
      letter-spacing: 0.1em;
    }
    .recruit-interview-block picture {
      display: block;
      margin: 0 auto;
      margin-top: calc(32 / var(--font-size) * 1rem);
      text-align: center;
      max-width: calc(804 / var(--font-size) * 1rem);
    }
    .recruit-interview-block figcaption {
      margin-top: calc(16 / var(--font-size) * 1rem);
    }

    .interview-article-back-btn {
      margin-inline: auto;
      margin-top: calc(64 / var(--font-size) * 1rem);
    }
    .interview-article-back-btn .c-btn-ico__label {
      -webkit-transform: rotate(180deg);
              transform: rotate(180deg);
    }

    /*  */
    .interview-related {
      margin-top: calc(104 / var(--font-size) * 1rem);
      max-width: calc(959 / var(--font-size) * 1rem);
      margin-inline: auto;
    }
    .interview-related__content .interview-block:nth-child(2n) {
      margin-top: 0;
    }
    .interview-related__content .interview-block:nth-child(4n) {
      margin-top: 0;
    }
  }
  @media all and (width < 64rem) {
    .recruit-interview-article .l-section {
      padding-inline: 0;
    }
    .recruit-interview-mv {
      margin-inline: calc(-48 / var(--font-size) * 1rem);
      padding-inline: calc(48 / var(--font-size) * 1rem) calc(24 / var(--font-size) * 1rem);
    }
    .recruit-interview-lead {
      padding-inline: 0;
    }
  }
  @media all and (width < 48rem) {
    .recruit-interview .l-container {
      padding-top: 0;
    }
    .recruit-interview-mv {
      position: relative;
      margin-inline: calc(-16 / var(--font-size) * 1rem);
      padding-inline: 0;
      height: calc(380 / var(--font-size) * 1rem);
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      gap: calc(24 / var(--font-size) * 1rem);
      -webkit-box-pack: end;
          -ms-flex-pack: end;
              justify-content: end;
    }
    .recruit-interview-mv-visual {
      position: absolute;
      top: 0;
      left: 0;
      z-index: -1;
    }
    .recruit-interview-mv-visual img {
      height: calc(380 / var(--font-size) * 1rem);
      -o-object-fit: cover;
         object-fit: cover;
      -o-object-position: 78%;
         object-position: 78%;
    }
    .recruit-interview-mv-heading__label {
      color: var(--white-color);
      font-size: calc(22 / var(--font-size) * 1rem);
      letter-spacing: 0.08em;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      gap: calc(12 / var(--font-size) * 1rem);
      -webkit-box-align: start;
          -ms-flex-align: start;
              align-items: start;
    }
    .recruit-interview-mv-heading__label > span {
      padding-inline: calc(15 / var(--font-size) * 1rem) calc(11 / var(--font-size) * 1rem);
      padding-block: calc(9 / var(--font-size) * 1rem);
      background: -webkit-gradient(linear, left top, right top, from(#20409c), to(#3394c6));
      background: linear-gradient(to right, #20409c, #3394c6);
    }
    .recruit-interview-mv-info {
      width: -webkit-fit-content;
      width: -moz-fit-content;
      width: fit-content;
      display: -ms-grid;
      display: grid;
      row-gap: calc(8 / var(--font-size) * 1rem);
      -ms-grid-columns: auto auto;
      grid-template-columns: auto auto;
      -webkit-box-align: end;
          -ms-flex-align: end;
              align-items: end;
      background: var(--white-color);
      padding-inline: calc(16 / var(--font-size) * 1rem);
      padding-block: calc(16 / var(--font-size) * 1rem);
      margin-left: calc(16 / var(--font-size) * 1rem);
      margin-bottom: calc(-40 / var(--font-size) * 1rem);
    }
    .recruit-interview-mv-info .intve-bio {
      font-size: calc(16 / var(--font-size) * 1rem);
      letter-spacing: 0.1em;
    }
    .recruit-interview-mv-info .intve-name {
      font-size: calc(20 / var(--font-size) * 1rem);
      letter-spacing: 0.1em;
    }
    .recruit-interview-mv .intve-position {
      -ms-grid-column: 1;
      -ms-grid-column-span: 2;
      grid-column: 1/3;
      font-weight: 500;
      font-size: calc(16 / var(--font-size) * 1rem);
      color: var(--primary-color-500);
      letter-spacing: 0.08em;
    }
    .recruit-interview-lead {
      position: relative;
      margin-block: calc(72 / var(--font-size) * 1rem) calc(56 / var(--font-size) * 1rem);
      &::before {
        content: '';
        position: absolute;
        right: 0;
        top: 0;
        margin-right: calc(-32 / var(--font-size) * 1rem);
        margin-top: calc(-116 / var(--font-size) * 1rem);
        width: calc(113 / var(--font-size) * 1rem);
        aspect-ratio: 186/192;
        background: url(/assets/img/recruit/interview/img_lead.png) no-repeat left top/contain;
      }
    }
    .recruit-interview-lead__in {
      position: relative;
      padding-inline: calc(16 / var(--font-size) * 1rem);
      padding-block: calc(32 / var(--font-size) * 1rem);
    }
    .recruit-interview-lead__in::before {
      position: absolute;
      content: '';
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: var(--primary-color-20);
      z-index: -1;
      mix-blend-mode: multiply;
      border-top-left-radius: calc(50 / var(--font-size) * 1rem);
      border-bottom-right-radius: calc(50 / var(--font-size) * 1rem);
    }
    .recruit-interview-lead__label {
      font-size: calc(15 / var(--font-size) * 1rem);
      line-height: 1.8;
      letter-spacing: 0.08em;
    }

    .recruit-interview-block {
      counter-reset: section 0;
    }
    .recruit-interview-block section {
      counter-increment: section 1;
    }
    .recruit-interview-block h3::before {
      content: counter(section, two-digit);
      font-size: calc(70 / var(--font-size) * 1rem);
      font-family: var(--ff-en);
      font-weight: 200;
      letter-spacing: 0.08em;
      line-height: 0.83;
      font-style: italic;
      background: -webkit-gradient(linear, left top, right top, from(#203e9b), color-stop(#2e78bf), to(#85e1ff));
      background: linear-gradient(to right, #203e9b, #2e78bf, #85e1ff);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      margin-right: calc(16 / var(--font-size) * 1rem);
    }
    .recruit-interview-block * + * {
      margin-top: calc(32 / var(--font-size) * 1rem);
    }
    .recruit-interview-block section + section {
      margin-top: calc(56 / var(--font-size) * 1rem);
    }
    .recruit-interview-block h4 + * {
      margin-top: calc(24 / var(--font-size) * 1rem);
    }
    .recruit-interview-block p + p {
      margin-top: calc(16 / var(--font-size) * 1rem);
    }
    .recruit-interview-block h3 {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: start;
          -ms-flex-align: start;
              align-items: start;
      position: relative;
      font-weight: 500;
      font-size: calc(22 / var(--font-size) * 1rem);
      color: #20409c;
      line-height: 1.4;
      letter-spacing: 0.06em;
      padding-bottom: calc(16 / var(--font-size) * 1rem);
    }
    .recruit-interview-block h3::after {
      content: '';
      bottom: 0;
      left: 0;
      position: absolute;
      width: 100%;
      height: calc(1 / var(--font-size) * 1rem);
      background: -webkit-gradient(linear, left top, right top, from(#20409c), color-stop(66%, #2e78bf), to(#85e1ff));
      background: linear-gradient(to right, #20409c, #2e78bf 66%, #85e1ff);
    }
    .recruit-interview-block h4 {
      font-size: calc(16 / var(--font-size) * 1rem);
      font-weight: 500;
      letter-spacing: 0.08em;
      line-height: 1.6;
    }
    .recruit-interview-block p {
      font-size: calc(13 / var(--font-size) * 1rem);
      line-height: 2;
      letter-spacing: 0.08em;
    }
    .recruit-interview-block figure {
      margin-inline: auto;
      max-width: calc(343 / var(--font-size) * 1rem);
      margin-top: calc(32 / var(--font-size) * 1rem);
      text-align: center;
    }
    .recruit-interview-block figcaption {
      margin-top: calc(8 / var(--font-size) * 1rem);
      font-size: calc(12 / var(--font-size) * 1rem);
    }

    .interview-article-back-btn {
      margin-inline: auto;
      margin-top: calc(64 / var(--font-size) * 1rem);
    }
    .interview-article-back-btn .c-btn-ico {
      margin-left: calc(20 / var(--font-size) * 1rem);
    }
    .interview-article-back-btn .c-btn-ico__label {
      -webkit-transform: rotate(180deg);
              transform: rotate(180deg);
    }

    /*  */
    .interview-related {
      margin-top: calc(104 / var(--font-size) * 1rem);
      max-width: calc(959 / var(--font-size) * 1rem);
      margin-inline: auto;
    }
    .interview-related__content .interview-block:nth-child(2n) {
      margin-top: 0;
    }
    .interview-related__content .interview-block:nth-child(4n) {
      margin-top: 0;
    }
  }
}