:root {
  --color-black: #222222;
  --color-white: #ffffff;
  --color-gray: #595757;
  --color-lightgray: #E6F0F0;
  --color-primary: #004F99;
  --color-secondary: #008A3B;
  --color-blue: #178FD9;
  --color-lightblue: #EBF2F4;
  --color-lightblue2: #D9E8EC;
  --color-navy: #2F2A7F;
  --color-lightnavy: #EBEBF4;
  --color-green: #258346;
  --color-yellowgreen: #579900;
  --color-lightyellowgreen: #EAF0E2;
  --color-orange: #E97406;
  --color-purple: #774B91;
  --color-enji: #842640;
  --color-lightenji: #F2ECEC;
  --color-pink: #AC4683;
  --color-lightpink: #F2ECF0;
  --color-gold: #A99500;
  --color-border: #DFEAED;
  --color-bg: #F4F4F4;
}

/*----------------------------------------

	recruit CSS

-----------------------------------------*/
/*----------------------------------------
	common
-----------------------------------------*/
.wrapper {
  overflow: clip;
  -webkit-filter: blur(18rem);
          filter: blur(18rem);
  opacity: 0.72;
}
.wrapper.is-recruit-loaded {
  -webkit-animation: recruitFocus 1.2s cubic-bezier(0.22, 1, 0.36, 1) forwards;
          animation: recruitFocus 1.2s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}
.wrapper.is-recruit-loaded .kv__title {
  -webkit-animation: kvTitleReveal 0.9s cubic-bezier(0.77, 0, 0.18, 1) 1.15s forwards;
          animation: kvTitleReveal 0.9s cubic-bezier(0.77, 0, 0.18, 1) 1.15s forwards;
}

.content {
  margin-top: 0;
  padding-top: 66rem;
  background: var(--color-white);
}
@media screen and (max-width: 959px ) {
  .content {
    padding-top: 48rem;
  }
}

.recruit-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: 30rem;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
@media screen and (max-width: 959px ) {
  .recruit-heading {
    gap: 20rem;
  }
}
.recruit-heading .en,
.recruit-heading .ja {
  -webkit-font-feature-settings: "palt" 1;
          font-feature-settings: "palt" 1;
  white-space: nowrap;
}
.recruit-heading .en {
  color: #055cbe;
  font-family: "Heebo", sans-serif;
  font-size: 34rem;
  font-weight: 700;
  letter-spacing: -0.04em;
  line-height: 1.2;
}
@media screen and (max-width: 959px ) {
  .recruit-heading .en {
    font-size: 18rem;
  }
}
.recruit-heading .ja {
  color: var(--color-black);
  font-size: 65rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.6;
}
@media screen and (max-width: 959px ) {
  .recruit-heading .ja {
    font-size: 34rem;
    line-height: 1.45;
  }
}

@-webkit-keyframes recruitFocus {
  from {
    -webkit-filter: blur(18rem);
            filter: blur(18rem);
    opacity: 0.72;
  }
  to {
    -webkit-filter: blur(0);
            filter: blur(0);
    opacity: 1;
  }
}

@keyframes recruitFocus {
  from {
    -webkit-filter: blur(18rem);
            filter: blur(18rem);
    opacity: 0.72;
  }
  to {
    -webkit-filter: blur(0);
            filter: blur(0);
    opacity: 1;
  }
}
@-webkit-keyframes kvTitleReveal {
  from {
    clip-path: inset(0 100% 0 0);
  }
  to {
    clip-path: inset(0 0 0 0);
  }
}
@keyframes kvTitleReveal {
  from {
    clip-path: inset(0 100% 0 0);
  }
  to {
    clip-path: inset(0 0 0 0);
  }
}
/*----------------------------------------
	kv
-----------------------------------------*/
.kv {
  position: relative;
  height: 949rem;
  overflow: hidden;
  background: var(--color-white);
}
@media screen and (max-width: 959px ) {
  .kv {
    height: 500rem;
  }
}
.kv__marquee {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.kv__marquee--reverse .kv__track {
  -webkit-animation: kvReverse 40s linear infinite;
          animation: kvReverse 40s linear infinite;
}
.kv__track {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  height: 100%;
  will-change: transform;
}
.kv__track img {
  width: 3836rem;
  height: 949rem;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  -o-object-fit: cover;
     object-fit: cover;
}
@media screen and (max-width: 959px ) {
  .kv__track img {
    width: 2020rem;
    height: 500rem;
  }
}
.kv__title {
  position: absolute;
  z-index: 2;
  bottom: 79rem;
  left: 76rem;
  width: 1330rem;
  clip-path: inset(0 100% 0 0);
}
@media screen and (max-width: 959px ) {
  .kv__title {
    bottom: 80rem;
    left: 15rem;
    width: 360rem;
  }
}
.kv__title img {
  display: block;
  width: 1330rem;
  height: 242rem;
}
@media screen and (max-width: 959px ) {
  .kv__title img {
    width: 360rem;
    height: auto;
  }
}

@-webkit-keyframes kvReverse {
  from {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  to {
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
}

@keyframes kvReverse {
  from {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  to {
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
}
/*----------------------------------------
	message
-----------------------------------------*/
.message {
  position: relative;
  color: var(--color-white);
  background: #004f99 url("../img/recruit/bg_intro.webp") center/cover no-repeat;
}
.message__inner {
  position: relative;
  max-width: 1330rem;
  width: 100%;
  margin-inline: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 220rem 0 700rem;
}
@media screen and (max-width: 959px ) {
  .message__inner {
    display: block;
    padding: 60rem 20rem 360rem;
  }
}
.message__inner > h2 {
  color: var(--color-white);
  font-size: 68rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1.6;
  -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
          writing-mode: vertical-rl;
}
@media screen and (max-width: 959px ) {
  .message__inner > h2 {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    margin: 0 auto 30rem;
    font-size: 34rem;
    letter-spacing: 0.08em;
    white-space: nowrap;
  }
}
.message__body {
  max-width: 720rem;
}
@media screen and (max-width: 959px ) {
  .message__body {
    width: 100%;
  }
}
.message__text {
  font-size: 24rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 2.4;
}
@media screen and (max-width: 959px ) {
  .message__text {
    font-size: 13rem;
    letter-spacing: 0.03em;
    line-height: 2;
    text-align: justify;
  }
}
@media screen and (max-width: 959px ) {
  .message__text br {
    display: none;
  }
}
.message__text p + p {
  margin-top: 30rem;
}
.message__text .txt-lead {
  margin-top: 99rem;
  font-size: 32rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 2.5;
}
@media screen and (max-width: 959px ) {
  .message__text .txt-lead {
    margin-top: 30rem;
    font-size: 18rem;
    line-height: 2;
  }
}
@media screen and (max-width: 959px ) {
  .message {
    background-position: center bottom;
  }
}

/*----------------------------------------
	data
-----------------------------------------*/
.data {
  position: relative;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 401rem 20rem 401rem 20rem 401rem 20rem 401rem;
  grid-template-columns: repeat(4, 401rem);
  gap: 80rem 20rem;
  padding: 180rem 128rem;
  background: #eef1f4;
}
@media screen and (max-width: 959px ) {
  .data {
    display: block;
    padding: 60rem 20rem;
  }
}
.data > .recruit-heading {
  -ms-grid-column-span: 4;
  grid-column: span 4;
  width: 100%;
}
@media screen and (max-width: 959px ) {
  .data > .recruit-heading {
    width: auto;
  }
}
.data__grid {
  display: contents;
}
@media screen and (max-width: 959px ) {
  .data__grid {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: minmax(0, 1fr) 10rem minmax(0, 1fr);
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10rem;
    width: 100%;
    margin-top: 35rem;
  }
}

.data-card {
  position: relative;
  overflow: hidden;
  padding: 32rem 50rem 32rem;
  border-radius: 2rem;
  background: var(--color-white);
}
@media screen and (max-width: 959px ) {
  .data-card {
    padding: 14rem 12rem 10rem;
  }
}
.data-card h3 {
  -webkit-transform: translateX(-15rem);
          transform: translateX(-15rem);
  margin-bottom: 10rem;
  font-size: 20rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1.5;
}
@media screen and (max-width: 959px ) {
  .data-card h3 {
    -webkit-transform: none;
            transform: none;
    margin-bottom: 0;
    font-size: 12rem;
  }
}
.data-card h3::before {
  display: inline-block;
  -webkit-transform: translateY(-4rem);
          transform: translateY(-4rem);
  margin-right: 8rem;
  width: 10rem;
  height: 10rem;
  border-radius: 50%;
  background: var(--color-secondary);
  content: "";
}
@media screen and (max-width: 959px ) {
  .data-card h3::before {
    -webkit-transform: translateY(-2rem);
            transform: translateY(-2rem);
    width: 6rem;
    height: 6rem;
  }
}
.data-card .pic {
  position: relative;
  margin-bottom: 20rem;
  text-align: center;
}
@media screen and (max-width: 959px ) {
  .data-card .pic {
    width: 100%;
    height: 94rem;
    margin: 20rem 0 12rem;
  }
}
.data-card .pic > img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
.data-card .pic .ico {
  position: absolute;
  right: -32rem;
  bottom: -20rem;
  display: block;
  width: 110rem;
  height: 110rem;
}
@media screen and (max-width: 959px ) {
  .data-card .pic .ico {
    right: -5rem;
    bottom: -8rem;
    width: 50rem;
    height: 50rem;
  }
}
.data-card .pic .ico img {
  width: 100%;
  height: 100%;
}
.data-card__value {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 8rem;
  width: 100%;
  color: #055cbe;
  font-weight: 700;
  line-height: 1;
}
@media screen and (max-width: 959px ) {
  .data-card__value {
    gap: 3rem;
  }
}
.data-card__value strong {
  font-family: "Heebo", sans-serif;
  font-size: 70rem;
  letter-spacing: -0.03em;
}
@media screen and (max-width: 959px ) {
  .data-card__value strong {
    font-size: 34rem;
  }
}
.data-card__value > span {
  padding-bottom: 7rem;
  color: var(--color-black);
  font-size: 30rem;
}
@media screen and (max-width: 959px ) {
  .data-card__value > span {
    padding-bottom: 4rem;
    font-size: 13rem;
  }
}
.data-card__value .data-counter {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  height: 1em;
  overflow: hidden;
}
.data-card__value .data-counter__digit {
  display: inline-block;
  height: 1em;
  overflow: hidden;
}
.data-card__value .data-counter__wheel {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-transform: translateY(0);
          transform: translateY(0);
  -webkit-transition: -webkit-transform 3s cubic-bezier(0.16, 1, 0.3, 1);
  transition: -webkit-transform 3s cubic-bezier(0.16, 1, 0.3, 1);
  transition: transform 3s cubic-bezier(0.16, 1, 0.3, 1);
  transition: transform 3s cubic-bezier(0.16, 1, 0.3, 1), -webkit-transform 3s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: transform;
}
.data-card__value .data-counter__wheel span {
  display: block;
  height: 1em;
  line-height: 1;
}
.data-card__value .data-counter__separator {
  display: inline-block;
  height: 1em;
  line-height: 1;
}
.data-card small {
  display: block;
  margin-top: 30rem;
  font-size: 13rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  line-height: 1.5;
}
@media screen and (max-width: 959px ) {
  .data-card small {
    margin-top: 10rem;
    font-size: 8rem;
  }
}

/*----------------------------------------
	environment
-----------------------------------------*/
.environment {
  position: relative;
  padding: 156rem 0 161rem;
  background: #EEF1F4;
}
@media screen and (max-width: 959px ) {
  .environment {
    padding: 30rem 0 0;
  }
}
.environment > .recruit-heading {
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  margin: 0 140rem 90rem auto;
  text-align: right;
}
@media screen and (max-width: 959px ) {
  .environment > .recruit-heading {
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    margin: 0 0 120rem;
    padding: 0 20rem;
    text-align: left;
  }
}
.environment__rows {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 114rem;
}
@media screen and (max-width: 959px ) {
  .environment__rows {
    gap: 70rem;
    margin-top: 40rem;
  }
}

.environment-row {
  position: relative;
}
@media screen and (max-width: 959px ) {
  .environment-row {
    background: none;
  }
}
.environment-row .environment-row__body {
  max-width: 1294rem;
  width: 100%;
  background: var(--color-white);
}
.environment-row.row01 .environment-row__body {
  padding: 120rem 140rem 120rem 338rem;
  margin-left: auto;
}
@media screen and (max-width: 959px ) {
  .environment-row.row01 .environment-row__body {
    padding: 330rem 20rem 40rem;
  }
}
.environment-row.row01 .environment-row__photo {
  left: 0;
  top: -80rem;
  border-radius: 0 6rem 6rem 0;
}
.environment-row.row02 .environment-row__body {
  padding: 120rem 338rem 120rem 140rem;
  margin-left: 0;
}
@media screen and (max-width: 959px ) {
  .environment-row.row02 .environment-row__body {
    padding: 330rem 20rem 40rem;
  }
}
.environment-row.row02 .environment-row__photo {
  right: 0;
  top: -114rem;
  border-radius: 6rem 0 0 6rem;
}
@media screen and (max-width: 959px ) {
  .environment-row.row02 .environment-row__photo {
    top: -70rem;
  }
}
.environment-row__photo {
  position: absolute;
  z-index: 10;
  width: 780rem;
}
@media screen and (max-width: 959px ) {
  .environment-row__photo {
    width: calc(100% - 40rem);
    margin: 0 auto;
    border-radius: 6rem;
  }
}
.environment-row h3 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 10rem;
  color: #055cbe;
  font-size: 50rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.6;
}
@media screen and (max-width: 959px ) {
  .environment-row h3 {
    gap: 6rem;
    font-size: 24rem;
  }
}
.environment-row h3 i {
  display: block;
  width: 61rem;
  height: 61rem;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
}
@media screen and (max-width: 959px ) {
  .environment-row h3 i {
    width: 30rem;
    height: 30rem;
  }
}
.environment-row h3 i img {
  display: block;
  width: 100%;
  height: 100%;
}
.environment-row__lead {
  margin-top: 20rem;
  font-size: 18rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.6;
}
@media screen and (max-width: 959px ) {
  .environment-row__lead {
    margin-top: 15rem;
    font-size: 13rem;
  }
}
.environment-row__points {
  margin-top: 65rem;
  border-top: 1rem solid #95b2d4;
}
@media screen and (max-width: 959px ) {
  .environment-row__points {
    margin-top: 25rem;
  }
}
.environment-row__points > li {
  border-bottom: 1rem solid #95b2d4;
}
.environment-row__point-inner {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 100rem;
  padding: 40rem 0;
}
@media screen and (max-width: 959px ) {
  .environment-row__point-inner {
    display: block;
    padding: 18rem 0;
  }
}
.environment-row__point-inner h4 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 260rem;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 20rem;
}
@media screen and (max-width: 959px ) {
  .environment-row__point-inner h4 {
    width: auto;
    gap: 5rem;
  }
}
.environment-row__point-inner h4 > span {
  color: #05a622;
  font-family: "Heebo", sans-serif;
  font-size: 14rem;
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.2;
}
@media screen and (max-width: 959px ) {
  .environment-row__point-inner h4 > span {
    font-size: 12rem;
  }
}
.environment-row__point-inner h4 strong {
  font-size: 28rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.6;
}
@media screen and (max-width: 959px ) {
  .environment-row__point-inner h4 strong {
    font-size: 18rem;
  }
}
.environment-row__point-inner > span {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  font-size: 18rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.6;
}
@media screen and (max-width: 959px ) {
  .environment-row__point-inner > span {
    display: block;
    margin-top: 8rem;
    font-size: 13rem;
  }
}
.environment-row__point-inner > span br {
  display: none;
}

/*----------------------------------------
	works
-----------------------------------------*/
.works {
  position: relative;
  overflow: hidden;
  padding: 226rem 140rem 140rem;
  background: #0155a7;
}
@media screen and (max-width: 959px ) {
  .works {
    padding: 90rem 20rem 70rem;
  }
}
.works > .recruit-heading {
  position: relative;
  z-index: 2;
}
.works > .recruit-heading .en,
.works > .recruit-heading .ja {
  color: var(--color-white);
}
.works__content {
  position: relative;
  z-index: 2;
  width: 1640rem;
  margin-top: 27rem;
}
@media screen and (max-width: 959px ) {
  .works__content {
    width: auto;
    margin-top: 35rem;
  }
}

.works-txt-slider {
  position: absolute;
  top: 108rem;
  left: -84rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  height: 137rem;
  opacity: 0.8;
  -webkit-animation: worksTicker 30s linear infinite;
          animation: worksTicker 30s linear infinite;
  will-change: transform;
}
@media screen and (max-width: 959px ) {
  .works-txt-slider {
    top: 28rem;
    left: 0;
    height: 47rem;
  }
}
.works-txt-slider p,
.works-txt-slider img {
  display: block;
  width: 2564rem;
  height: 137rem;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
}
@media screen and (max-width: 959px ) {
  .works-txt-slider p,
  .works-txt-slider img {
    width: 880rem;
    height: 47rem;
  }
}

@-webkit-keyframes worksTicker {
  from {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  to {
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
}

@keyframes worksTicker {
  from {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  to {
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
}
.works-filter {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  gap: 4rem;
  margin-bottom: 40rem;
}
@media screen and (max-width: 959px ) {
  .works-filter {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    gap: 4rem;
    margin-bottom: 25rem;
  }
}
.works-filter button {
  width: 140rem;
  padding: 18rem 15rem;
  border: 0;
  border-radius: 2rem;
  background: var(--color-bg);
  color: var(--color-black);
  font: 700 18rem/1.75 "Noto Sans JP", sans-serif;
  letter-spacing: 0.05em;
  cursor: pointer;
  -webkit-transition: color 0.25s ease, background 0.25s ease;
  transition: color 0.25s ease, background 0.25s ease;
}
@media screen and (max-width: 959px ) {
  .works-filter button {
    width: auto;
    min-width: 64rem;
    padding: 7rem 10rem;
    font-size: 11rem;
  }
}
.works-filter button:hover, .works-filter button.is-active {
  background: #2b963b;
  color: var(--color-white);
}

.works-slider {
  overflow: visible;
}
@media screen and (max-width: 959px ) {
  .works-slider {
    overflow: hidden;
  }
}
.works-slider__pagination {
  display: none;
}
@media screen and (max-width: 959px ) {
  .works-slider__pagination {
    position: static;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-top: 20rem;
  }
}

.works-list {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: minmax(0, 1fr) 20rem minmax(0, 1fr) 20rem minmax(0, 1fr);
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 50rem 20rem;
}
@media screen and (max-width: 959px ) {
  .works-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 0;
  }
}

.works-card {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: auto !important;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 20rem;
  overflow: visible;
  color: var(--color-white);
}
@media screen and (max-width: 959px ) {
  .works-card {
    gap: 12rem;
    width: calc(100% - 36rem) !important;
  }
}
.works-card.is-filtered-out {
  display: none !important;
}
.works-card__visual {
  position: relative;
  display: block;
  width: 100%;
  height: 335rem;
  overflow: hidden;
  border-radius: 6rem;
}
@media screen and (max-width: 959px ) {
  .works-card__visual {
    height: auto;
    aspect-ratio: 533/335;
  }
}
.works-card__visual > img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -webkit-transition: -webkit-transform 0.45s ease;
  transition: -webkit-transform 0.45s ease;
  transition: transform 0.45s ease;
  transition: transform 0.45s ease, -webkit-transform 0.45s ease;
}
.works-card:hover .works-card__visual > img {
  -webkit-transform: scale(1.04);
          transform: scale(1.04);
}
.works-card__category {
  position: absolute;
  top: 15rem;
  left: 21rem;
  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;
  padding: 4rem 14rem 6rem;
  border-radius: 60rem;
  background: #2b963b;
  color: var(--color-white);
  font-size: 15rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.85;
}
@media screen and (max-width: 959px ) {
  .works-card__category {
    top: 10rem;
    left: 10rem;
    padding: 2rem 8rem 3rem;
    font-size: 10rem;
  }
}
.works-card__category i {
  display: none;
}
.works-card__play {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 66rem;
  height: 66rem;
  border: 2rem solid var(--color-white);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.85);
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
@media screen and (max-width: 959px ) {
  .works-card__play {
    width: 48rem;
    height: 48rem;
  }
}
.works-card__play::after {
  position: absolute;
  top: 50%;
  left: 54%;
  width: 0;
  height: 0;
  border-top: 9rem solid transparent;
  border-bottom: 9rem solid transparent;
  border-left: 14rem solid #055cbe;
  content: "";
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.works-card > strong {
  font-size: 20rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.75;
}
@media screen and (max-width: 959px ) {
  .works-card > strong {
    font-size: 14rem;
  }
}

/*----------------------------------------
	description visual
-----------------------------------------*/
.description-visual {
  width: 100%;
  height: 500rem;
  overflow: hidden;
}
@media screen and (max-width: 959px ) {
  .description-visual {
    height: 220rem;
  }
}
.description-visual img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
@media screen and (max-width: 959px ) {
  .description-visual img {
    -o-object-position: center;
       object-position: center;
  }
}

/*----------------------------------------
	description
-----------------------------------------*/
.description {
  position: relative;
  padding: 141rem 140rem 140rem;
  background: var(--color-white);
}
@media screen and (max-width: 959px ) {
  .description {
    padding: 60rem 20rem 80rem;
  }
}
.description > .recruit-heading {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
}
.description__wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  margin-top: 27rem;
}
@media screen and (max-width: 959px ) {
  .description__wrap {
    display: block;
    margin-top: 35rem;
  }
}
.description__list {
  position: sticky;
  z-index: 3;
  top: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 190rem;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 10rem;
}
@media screen and (max-width: 959px ) {
  .description__list {
    top: 0;
    width: 100%;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    gap: 2rem;
  }
}
@media screen and (max-width: 959px ) {
  .description__list li {
    /*width: 25%;*/
    width: calc((100% - 4rem) / 3);
  }
}
.description__list li button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  -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;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 24rem;
  padding: 57rem 15rem;
  border: 0;
  border-radius: 0 0 0 6rem;
  background: var(--color-black);
  color: var(--color-white);
  cursor: pointer;
}
@media screen and (max-width: 959px ) {
  .description__list li button {
    gap: 8rem;
    padding: 19rem 4rem;
    border-radius: 0;
  }
}
.description__list li button span {
  font-family: "Heebo", sans-serif;
  font-size: 16rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.2;
}
@media screen and (max-width: 959px ) {
  .description__list li button span {
    font-size: 10rem;
  }
}
.description__list li button strong {
  font-size: 25rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.6;
}
@media screen and (max-width: 959px ) {
  .description__list li button strong {
    font-size: 13rem;
  }
}
.description__list li button i {
  position: relative;
  display: block;
  width: 11rem;
  height: 6rem;
}
@media screen and (max-width: 959px ) {
  .description__list li button i {
    width: 8rem;
    height: 5rem;
  }
}
.description__list li button i::before, .description__list li button i::after {
  position: absolute;
  top: 2rem;
  width: 7rem;
  height: 2rem;
  background: currentColor;
  content: "";
}
.description__list li button i::before {
  left: 0;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}
@media screen and (max-width: 959px ) {
  .description__list li button i::before {
    left: -1rem;
  }
}
.description__list li button i::after {
  right: 0;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}
@media screen and (max-width: 959px ) {
  .description__list li button i::after {
    right: -1rem;
  }
}
.description__list li.current button {
  background: #0155a7;
}
@media screen and (max-width: 959px ) {
  .description__list li.current button {
    gap: 8rem;
  }
}
.description__list li.current button strong {
  font-size: 30rem;
}
@media screen and (max-width: 959px ) {
  .description__list li.current button strong {
    font-size: 14rem;
  }
}
.description__panels {
  width: 1450rem;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
}
@media screen and (max-width: 959px ) {
  .description__panels {
    width: 100%;
  }
}
.description__panels > article {
  display: none;
}
.description__panels > article.is-current {
  display: block;
}

.job__summary h3 {
  margin-top: 10rem;
  color: #055cbe;
  font-size: 45rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.6;
}
@media screen and (max-width: 959px ) {
  .job__summary h3 {
    margin-top: 10rem;
    font-size: 26rem;
  }
}

.job__panel {
  padding: 60rem;
  border-radius: 0 6rem 6rem;
  background: #eef1f4;
}
@media screen and (max-width: 959px ) {
  .job__panel {
    padding: 20rem 15rem;
    border-radius: 0 0 6rem 6rem;
  }
}
.job__summary {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  gap: 40rem;
  margin-bottom: 60rem;
}
@media screen and (max-width: 959px ) {
  .job__summary {
    display: block;
    margin-bottom: 25rem;
  }
}
.job__summary > img {
  width: 457rem;
  height: 300rem;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  border-radius: 6rem;
  -o-object-fit: cover;
     object-fit: cover;
}
@media screen and (max-width: 959px ) {
  .job__summary > img {
    width: 100%;
    height: auto;
    margin-top: 20rem;
  }
}
.job__summary-text {
  width: 736rem;
}
@media screen and (max-width: 959px ) {
  .job__summary-text {
    width: auto;
  }
}
.job__en {
  font-family: "Heebo", sans-serif;
  font-size: 18rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.2;
}
@media screen and (max-width: 959px ) {
  .job__en {
    font-size: 11rem;
  }
}
.job__lead {
  margin-top: 20rem;
  font-size: 24rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.8;
}
@media screen and (max-width: 959px ) {
  .job__lead {
    margin-top: 15rem;
    font-size: 16rem;
    line-height: 1.8;
  }
}
.job__txt {
  margin-top: 15rem;
  font-size: 16rem;
}
@media screen and (max-width: 959px ) {
  .job__txt {
    font-size: 13rem;
    text-align: justify;
  }
}
.job__inner > .job__lead {
  margin: 0 0 40rem;
}

.job-table {
  background: var(--color-white);
}
.job-table > div {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  border-bottom: 1rem solid #eef1f4;
}
@media screen and (max-width: 959px ) {
  .job-table > div {
    display: block;
  }
}
.job-table > div:last-child {
  border-bottom: 0;
}
.job-table dt,
.job-table dd {
  padding-top: 40rem;
  padding-bottom: 40rem;
  font-size: 18rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.8;
}
@media screen and (max-width: 959px ) {
  .job-table dt,
  .job-table dd {
    padding: 15rem 20rem;
    font-size: 12rem;
  }
}
.job-table dt {
  width: 280rem;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  padding-left: 60rem;
  color: #055cbe;
  font-weight: 700;
  letter-spacing: 0.1em;
}
@media screen and (max-width: 959px ) {
  .job-table dt {
    width: 100%;
    padding-inline: 20rem;
    padding-bottom: 0;
  }
}
.job-table dd {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  padding-right: 40rem;
}
@media screen and (max-width: 959px ) {
  .job-table dd {
    padding-top: 8rem;
  }
}
.job-table dd strong {
  position: relative;
  display: inline-block;
  margin-top: 10rem;
  padding-left: 15rem;
}
.job-table dd strong::before {
  position: absolute;
  top: 3rem;
  bottom: 3rem;
  left: 0;
  width: 6rem;
  background: #055cbe;
  content: "";
}
.job-table dd .sarary {
  margin-top: 12rem;
}
.job-table dd small {
  font-size: 16rem;
  line-height: 2;
}
@media screen and (max-width: 959px ) {
  .job-table dd small {
    font-size: 10rem;
  }
}

/*----------------------------------------
	flow
-----------------------------------------*/
.flow {
  padding: 140rem 140rem 67rem;
  background: #eef1f4;
}
@media screen and (max-width: 959px ) {
  .flow {
    padding: 60rem 20rem 80rem;
  }
}
.flow > div {
  width: 1640rem;
}
@media screen and (max-width: 959px ) {
  .flow > div {
    width: auto;
  }
}
.flow__list {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 40rem;
  margin-top: 100rem;
}
@media screen and (max-width: 959px ) {
  .flow__list {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 35rem;
    margin-top: 40rem;
    margin-bottom: 80rem;
  }
}
.flow__list::before {
  position: absolute;
  bottom: 0;
  left: 12rem;
  width: 1628rem;
  height: 1rem;
  background: #95b2d4;
  content: "";
}
@media screen and (max-width: 959px ) {
  .flow__list::before {
    top: 0;
    bottom: 0;
    left: auto;
    right: 0;
    width: 1rem;
    height: auto;
  }
}
.flow__list li {
  position: relative;
  width: 380rem;
  -webkit-box-flex: 0;
      -ms-flex: none;
          flex: none;
  padding-bottom: 45rem;
}
@media screen and (max-width: 959px ) {
  .flow__list li {
    display: -ms-grid;
    display: grid;
    width: 100%;
    -ms-grid-columns: 120rem 15rem 1fr;
    grid-template-columns: 120rem 1fr;
    gap: 15rem;
  }
}
@media screen and (max-width: 959px ) {
  .flow__list li:last-child {
    padding-bottom: 0;
  }
}
.flow__list li::after {
  position: absolute;
  bottom: -6rem;
  left: 0;
  width: 13rem;
  height: 13rem;
  border-radius: 50%;
  background: #055cbe;
  content: "";
}
@media screen and (max-width: 959px ) {
  .flow__list li::after {
    top: 0;
    bottom: auto;
    left: auto;
    right: -6rem;
    width: 13rem;
    height: 13rem;
  }
}
.flow__list li > img {
  display: block;
  width: 380rem;
  height: 400rem;
  border-radius: 6rem;
  -o-object-fit: cover;
     object-fit: cover;
}
@media screen and (max-width: 959px ) {
  .flow__list li > img {
    width: 120rem;
    height: 126rem;
  }
}
.flow__list li > div {
  margin-top: 30rem;
}
@media screen and (max-width: 959px ) {
  .flow__list li > div {
    margin-top: 0;
  }
}
.flow__list h3 {
  font-size: 28rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.75;
}
@media screen and (max-width: 959px ) {
  .flow__list h3 {
    display: block;
    font-size: 17rem;
  }
}
.flow__list h3 small {
  font-size: 22rem;
}
.flow__list p {
  margin-top: 25rem;
  font-size: 16rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.75;
}
@media screen and (max-width: 959px ) {
  .flow__list p {
    padding-right: 20rem;
    margin-top: 10rem;
    font-size: 11rem;
  }
}
.flow__number {
  display: inline-block;
  -webkit-transform: translateY(3rem);
          transform: translateY(3rem);
  margin-right: 20rem;
  color: #055cbe;
  font-family: "Heebo", sans-serif;
  font-size: 50rem;
  font-weight: 700;
  letter-spacing: -0.04em;
  line-height: 1;
}
@media screen and (max-width: 959px ) {
  .flow__number {
    display: block;
    margin-bottom: 5rem;
    font-size: 26rem;
  }
}
.flow__last::after {
  background: #05a622 !important;
}
.flow__last .flow__number {
  color: #05a622;
}
.flow__notes {
  margin-top: 90rem;
  font-size: 16rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.75;
}
@media screen and (max-width: 959px ) {
  .flow__notes {
    margin-top: 35rem;
    font-size: 10rem;
  }
}

.works-card:focus-visible,
.works-filter button:focus-visible,
.description__list button:focus-visible {
  outline: 3rem solid #05a622;
  outline-offset: 4rem;
}

@media (prefers-reduced-motion: reduce) {
  .wrapper,
  .wrapper.is-recruit-loaded,
  .wrapper.is-recruit-loaded .kv__title,
  .kv__track,
  .works-txt-slider,
  .data-counter__wheel {
    -webkit-animation: none;
            animation: none;
    -webkit-transition: none;
    transition: none;
  }
  .wrapper {
    -webkit-filter: none;
            filter: none;
    opacity: 1;
  }
  .kv__title {
    clip-path: none;
  }
}
/*# sourceMappingURL=recruit.css.map */