@charset "UTF-8";
@font-face {
  font-family: "kozukafonmt";
  src: url("../../fonts/soratohikouki.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
.recruit header {
  position: relative;
}

.loading-video-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: 99999999;
  background-image: url("../../images/loading-blue.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}
.loading-video-wrapper video {
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
  width: 100%;
  height: 100%;
}
@media screen and (max-width: 1023px) {
  .loading-video-wrapper video {
    -o-object-fit: contain;
       object-fit: contain;
  }
}
.loading-video-wrapper #skip-button {
  position: absolute;
  bottom: 50px;
  right: 50px;
  display: block;
  z-index: 10000;
  width: 100px;
  aspect-ratio: 1/1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -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: center;
      -ms-flex-align: center;
          align-items: center;
  color: rgb(255, 255, 255);
  border: 1px solid rgb(255, 255, 255);
  font-size: 2rem;
  border-radius: 50%;
  cursor: pointer;
}
@media screen and (max-width: 1023px) {
  .loading-video-wrapper #skip-button {
    right: 10px;
    bottom: 20px;
    font-size: 1.5rem;
    width: 80px;
  }
}

.hidden {
  display: none; /* 非表示にする */
}

.loading-blue {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-image: url("../../images/loading-blue.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  z-index: 989999;
}
.loading-blue .recruit-fv-en {
  position: absolute;
  top: 30%;
  left: 50%;
  width: 100%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
.loading-blue img {
  position: absolute;
  bottom: 20%;
  left: 20%;
  width: 50%;
  max-width: 640px;
}
@media screen and (max-width: 1023px) {
  .loading-blue img {
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: 65%;
  }
}

body.recruit {
  font-family: "kozuka-gothic-pr6n", sans-serif;
  font-weight: 600;
}

.bg-recruit-blue {
  background-image: url("../../images/recruit-bg.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}

.recruit-header {
  padding: 0;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1000;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media screen and (max-width: 767px) {
  .recruit-header {
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
}
.recruit-header .recruit-logo a {
  display: block;
  background-color: rgb(255, 255, 255);
  padding: 30px 40px 30px 30px;
  border-radius: 0 0 31px 0;
}
@media screen and (max-width: 767px) {
  .recruit-header .recruit-logo a {
    padding: 10px 20px;
  }
}
.recruit-header .recruit-logo a img {
  display: inline-block;
  margin: 0;
  width: 90px;
  vertical-align: middle;
}
@media screen and (max-width: 1023px) {
  .recruit-header .recruit-logo a img {
    width: 50px;
  }
}
@media screen and (max-width: 767px) {
  .recruit-header .recruit-logo a img {
    width: 30px;
  }
}
.recruit-header .recruit-logo a span {
  color: rgb(128, 128, 128);
}
.recruit-header .recruit-logo a .recruit {
  font-size: 2.9rem;
  font-family: "futura-pt", sans-serif;
  vertical-align: middle;
}
@media screen and (max-width: 767px) {
  .recruit-header .recruit-logo a .recruit {
    font-size: 2rem;
  }
}
@media screen and (max-width: 767px) {
  .recruit-header .recruit-logo a .small {
    display: block;
    font-size: 12px;
  }
}

.recruit-menu-btn {
  position: fixed;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
  top: 0;
  right: 0;
}
.recruit-menu-btn #navi {
  display: none;
}
.recruit-menu-btn #navi:checked ~ label {
  width: 45px;
  -webkit-transform: rotate(225deg);
          transform: rotate(225deg);
}
.recruit-menu-btn #navi:checked ~ label .dots:nth-of-type(1) {
  -webkit-filter: opacity(0);
          filter: opacity(0);
}
.recruit-menu-btn #navi:checked ~ label .dots:nth-of-type(2) {
  -webkit-transform: scaleY(4.75);
          transform: scaleY(4.75);
}
.recruit-menu-btn #navi:checked ~ label .dots:nth-of-type(3) {
  -webkit-filter: opacity(0);
          filter: opacity(0);
}
.recruit-menu-btn #navi:checked ~ label .dots:nth-of-type(4) {
  -webkit-transform: scaleX(4.75);
          transform: scaleX(4.75);
}
.recruit-menu-btn #navi:checked ~ label .dots:nth-of-type(5) {
  -webkit-filter: opacity(0);
          filter: opacity(0);
}
.recruit-menu-btn #navi:checked ~ label .dots:nth-of-type(6) {
  -webkit-transform: scaleX(4.75);
          transform: scaleX(4.75);
}
.recruit-menu-btn #navi:checked ~ label .dots:nth-of-type(7) {
  -webkit-filter: opacity(0);
          filter: opacity(0);
}
.recruit-menu-btn #navi:checked ~ label .dots:nth-of-type(8) {
  -webkit-transform: scaleY(4.75);
          transform: scaleY(4.75);
}
.recruit-menu-btn #navi:checked ~ label .dots:nth-of-type(9) {
  -webkit-filter: opacity(0);
          filter: opacity(0);
}
.recruit-menu-btn #navi:checked ~ label .dots {
  width: 5px;
  border-radius: 0;
}
.recruit-menu-btn .recruit-navi-btn-wrapper {
  position: relative;
  margin: 19px;
  font-family: "futura-pt", sans-serif;
  border-radius: 20px;
  -ms-flex-item-align: start;
      align-self: flex-start;
  width: 60px;
  aspect-ratio: 1/1;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -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: center;
      -ms-flex-align: center;
          align-items: center;
  background-color: rgb(255, 255, 255);
}
@media screen and (max-width: 767px) {
  .recruit-menu-btn .recruit-navi-btn-wrapper {
    margin: 10px;
  }
}
.recruit-menu-btn .menu {
  position: absolute;
  bottom: 0;
  left: 50%;
  -webkit-transform: translate(-50%, 100%);
          transform: translate(-50%, 100%);
}
.recruit-menu-btn label {
  cursor: pointer;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -ms-flex-line-pack: justify;
      align-content: space-between;
  width: 60px;
  padding: 10px;
  aspect-ratio: 1/1;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}
@media screen and (max-width: 767px) {
  .recruit-menu-btn label {
    width: 50px;
  }
}
.recruit-menu-btn label .dots {
  width: 10px;
  aspect-ratio: 1/1;
  border-radius: 50%;
  background-color: rgb(128, 128, 128);
  -webkit-transition: 0.5s;
  transition: 0.5s;
}
@media screen and (max-width: 767px) {
  .recruit-menu-btn label .dots {
    width: 6px;
  }
}
.recruit-menu-btn label .dots:nth-of-type(3n+2) {
  margin: 0 4px;
}
.recruit-menu-btn label .dots:nth-of-type(2) {
  -webkit-transform-origin: top;
          transform-origin: top;
}
.recruit-menu-btn label .dots:nth-of-type(4) {
  -webkit-transform-origin: left;
          transform-origin: left;
}
.recruit-menu-btn label .dots:nth-of-type(6) {
  -webkit-transform-origin: right;
          transform-origin: right;
}
.recruit-menu-btn label .dots:nth-of-type(8) {
  -webkit-transform-origin: bottom;
          transform-origin: bottom;
}

.recruit-header-menu {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  gap: 30px;
  padding: 20px 30px;
  border-radius: 40px;
  background-color: rgba(255, 255, 255, 0.6);
  -ms-flex-item-align: center;
      -ms-grid-row-align: center;
      align-self: center;
  opacity: 0;
  pointer-events: none;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}
@media screen and (max-width: 1300px) {
  .recruit-header-menu {
    display: block;
    position: absolute;
    top: 110%;
    right: 20px;
    z-index: 100;
    width: 200px;
    background-color: rgba(255, 255, 255, 0.9);
  }
  .recruit-header-menu li:not(:last-child) {
    margin-bottom: 10px;
  }
}
@media screen and (max-width: 767px) {
  .recruit-header-menu {
    width: 160px;
    right: 10px;
    padding: 20px 10px;
  }
}
.recruit-header-menu.active {
  pointer-events: visible;
  opacity: 1;
}
.recruit-header-menu a {
  color: rgb(128, 128, 128);
}

.recruit-bottom-section {
  padding-bottom: 190px;
}

.contents-wrapper.recruit {
  max-width: 1700px;
}

@media (max-width: 767px) {
  .contents-wrapper.recruit {
      width: calc(100% - 30px);
  }
}

.recruit-fv-section {
  padding-top: 200px;
}
@media screen and (max-width: 767px) {
  .recruit-fv-section {
    padding-top: 110px;
  }
}
.recruit-fv-section .video-wrapper {
  position: relative;
  border-radius: 20px;
  overflow: hidden;
  -webkit-box-shadow: 9px 9px 10px rgba(77, 77, 77, 0.3);
          box-shadow: 9px 9px 10px rgba(77, 77, 77, 0.3);
  aspect-ratio: 16/9;
}
.recruit-fv-section .video-wrapper video {
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
}
.recruit-fv-section .video-wrapper img {
  width: 10%;
  max-width: 150px;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
.recruit-fv-section .video-wrapper img.playActive {
  display: none;
}
.recruit-fv-section .recruit-movie {
  display: block;
  width: 100%;
  aspect-ratio: 16/9;
}
.recruit-fv-section .contents-wrapper:not(.recruit-en-wrapper) {
  position: relative;
  z-index: 2;
}

.recruit-en-wrapper {
  position: relative;
}

.recruit-fv-en {
  position: absolute;
  left: 0;
  bottom: 0;
  line-height: 190px;
  font-size: clamp(6.875rem, 1.875rem + 7.8125vw, 11.25rem);
  color: rgba(255, 255, 255, 0.3);
}
@media screen and (max-width: 1023px) {
  .recruit-fv-en {
    font-size: 5rem;
  }
}
@media screen and (max-width: 767px) {
  .recruit-fv-en {
    line-height: 80px;
    font-size: 2.5rem;
    bottom: 55px;
  }
}

.recruit-link {
  position: relative;
  padding: 20px;
  text-align: center;
  display: block;
  color: rgb(255, 255, 255);
  border-radius: 40px;
  font-size: 1.8rem;
  font-weight: 600;
}
@media screen and (max-width: 767px) {
  .recruit-link {
    padding: 10px;
    font-size: 1.5rem;
  }
}
.recruit-link::after {
  position: absolute;
  top: 50%;
  right: 40px;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  content: "";
  display: block;
  width: 53px;
  height: 7px;
  background-image: url("../../images/recruit-arrow.png");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}
@media screen and (max-width: 767px) {
  .recruit-link::after {
    right: 9px;
  }
}
.recruit-link:hover::after {
  -webkit-transform: translate(5px, -50%);
          transform: translate(5px, -50%);
}
.recruit-link.orange,
.recruit-link.white {
  max-width: 500px;
  width: 50%;
  margin: 50px 30px 50px auto;
  background-color: rgb(251, 176, 59);
}
.recruit-link.white {
  background-color: rgb(255, 255, 255);
  color: #0472BF;
  width: 100%;
  margin: 30px 0;
}
@media screen and (max-width: 767px) {
  .recruit-link.orange,
  .recruit-link.white {
    width: calc(100% - 60px);
    margin: 50px auto;
  }
  .recruit-link.white {
    width: 100%;
  }
}
.recruit-link.blue {
  background-color: rgb(116, 215, 255);
}
.recruit-link.transparent {
  border: 2px solid rgb(255, 255, 255);
  background-color: transparent;
}
.recruit-link.bg-image {
  background-image: url("../../images/recruit-bg.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}
.recruit-link.long {
  width: 70%;
  margin: auto;
}
@media screen and (max-width: 767px) {
  .recruit-link.long {
    width: 100%;
  }
}
.recruit-link.long::after {
  width: 116px;
}
@media screen and (max-width: 767px) {
  .recruit-link.long::after {
    width: 80px;
  }
}

.recruit-fv-wrapper {
  margin-top: 70px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  gap: 50px;
}
.recruit-fv-wrapper .text-box {
  width: 50%;
}
@media screen and (max-width: 1023px) {
  .recruit-fv-wrapper .text-box {
    width: 80%;
    margin: auto;
  }
}
@media screen and (max-width: 767px) {
  .recruit-fv-wrapper .text-box {
    width: 100%;
  }
}
.recruit-fv-wrapper .text-box img {
  margin-bottom: 50px;
}
@media screen and (max-width: 767px) {
  .recruit-fv-wrapper .text-box img {
    margin-bottom: 30px;
  }
}
.recruit-fv-wrapper .text-box p {
  width: 90%;
  margin: auto;
  text-align: left;
  line-height: 2.5;
  color: rgb(255, 255, 255);
}
@media screen and (max-width: 1300px) {
  .recruit-fv-wrapper .text-box p {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .recruit-fv-wrapper .text-box p {
    width: 100%;
    line-height: 2;
  }
}
.recruit-fv-wrapper .image-box {
  position: relative;
  width: calc(45% - 50px);
  display: -ms-grid;
  display: grid;
  gap: 30px;
  -ms-grid-columns: 1fr 30px 1fr;
  grid-template-columns: repeat(2, 1fr);
}
.recruit-fv-wrapper .image-box {
  position: relative;
  width: calc(45% - 50px);
  display: grid;
  gap: 30px;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto auto auto;
  margin-left: 5%;
}
.recruit-fv-wrapper .image-box img:nth-child(1) {
  grid-column: 1 / -1;
  grid-row: 1;
}
.recruit-fv-wrapper .image-box img:nth-child(2) {
  grid-column: 1;
  grid-row: 2 / 4;
}
.recruit-fv-wrapper .image-box img:nth-child(3) {
  grid-column: 2;
  grid-row: 2;
  transform: translateY(-5%);
}
.recruit-fv-wrapper .image-box img:nth-child(4) {
  grid-column: 2;
  grid-row: 3;
  transform: translateY(25%);
}
@media screen and (max-width: 1023px) {
  .recruit-fv-wrapper .image-box {
    width: 100%;
    margin: auto;
  }
}
@media screen and (max-width: 767px) {
  .recruit-fv-wrapper .image-box {
    gap: 10px;
  }
}
.recruit-fv-wrapper .image-box .image2 {
  -webkit-transform: translateY(20%);
          transform: translateY(20%);
}

.bg-white {
  background-color: rgb(255, 255, 255);
}

.after-round-section {
  position: relative;
  margin-top: -90px;
  border-radius: 90px 90px 0 0;
}
@media screen and (max-width: 767px) {
  .after-round-section {
    border-radius: 30px 30px 0 0;
  }
}

.recruit-energy-section {
  position: relative;
}
.recruit-energy-section .white-lightning {
  max-width: 130px;
  width: 30%;
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-transform: translate(-50%, -100%);
          transform: translate(-50%, -100%);
}
@media screen and (max-width: 1300px) {
  .recruit-energy-section .white-lightning {
    max-width: 100px;
  }
}

.fukudome-enrgy-image {
  max-width: 1920px;
  width: 65%;
  margin: 0 auto 50px;
}

.recruit-link-wrapper {
  position: relative;
  z-index: 2;
  display: -ms-grid;
  display: grid;
  gap: 10px;
  -ms-grid-columns: 1fr 10px 1fr;
  grid-template-columns: repeat(2, 1fr);
}
@media screen and (max-width: 1023px) {
  .recruit-link-wrapper {
    -ms-grid-columns: 80%;
    grid-template-columns: 80%;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
@media screen and (max-width: 767px) {
  .recruit-link-wrapper {
    -ms-grid-columns: 100%;
    grid-template-columns: 100%;
  }
}

.recruit-page-link {
  position: relative;
  aspect-ratio: 16/6;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -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: center;
      -ms-flex-align: center;
          align-items: center;
  color: rgb(255, 255, 255);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  font-size: 2.2rem;
  font-weight: 600;
  text-shadow: 2px 2px 3px rgba(27, 20, 100, 0.5);
}
@media screen and (max-width: 1023px) {
  .recruit-page-link {
    font-size: 1.5rem;
  }
}
.recruit-page-link span {
  position: relative;
  z-index: 2;
}
.recruit-page-link::before {
  background-color: rgba(27, 20, 100, 0.2);
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  content: "";
  display: block;
  width: 100%;
  height: 100%;
}
.recruit-page-link.interview {
  background-image: url("../../images/recruit-page-image1.jpg");
}
.recruit-page-link.careerup {
  background-image: url("../../images/recruit-page-image2.jpg");
}

.lightning-title {
  margin: 50px 0;
  position: relative;
}
.lightning-title::before {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  display: block;
  width: 30%;
  max-width: 200px;
  aspect-ratio: 7/13;
  background-image: url("../../images/blue-lightning.svg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}
.lightning-title span {
  position: relative;
  z-index: 2;
}
.lightning-title .en {
  margin-bottom: 10px;
  position: relative;
  z-index: 2;
  max-width: 250px;
}
@media screen and (max-width: 767px) {
  .lightning-title .en {
    max-width: 150px;
  }
}
.lightning-title .ja {
  font-size: 1.8rem;
}
@media screen and (max-width: 767px) {
  .lightning-title .ja {
    font-size: 1.3rem;
  }
}
.lightning-title .ja .big {
  font-family: "kozukafonmt", sans-serif;
  font-size: 2.5rem;
}
@media screen and (max-width: 767px) {
  .lightning-title .ja .big {
    font-size: 1.8rem;
  }
}

.recruit-top-interview {
  margin-bottom: 50px;
  position: relative;
  z-index: 2;
  display: -ms-grid;
  display: grid;
  gap: 50px;
  -ms-grid-columns: 1fr 50px 1fr 50px 1fr 50px 1fr;
  grid-template-columns: repeat(4, 1fr);
  font-size: 1.6rem;
  font-family: "kozukafonmt", sans-serif;
  text-align: left;
}
@media screen and (max-width: 1485px) {
  .recruit-top-interview {
    font-size: 1.2rem;
  }
}
@media screen and (max-width: 1175px) {
  .recruit-top-interview {
    -ms-grid-columns: (1fr)[2];
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (max-width: 767px) {
  .recruit-top-interview {
    gap: 30px 10px;
    font-size: 0.8rem;
  }
}
.recruit-top-interview .recruit-top-interview-link {
  text-decoration: underline;
  text-decoration-color: rgb(77, 77, 77);
  color: rgb(77, 77, 77);
}
.recruit-top-interview .recruit-top-interview-link img {
  margin-bottom: 20px;
}

.recruit-about-section {
  padding-top: 30px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}
@media screen and (max-width: 767px) {
  .recruit-about-section .recruit-link {
    font-size: 1.1rem;
    padding-right: 50px;
  }
}

.about-en {
  font-weight: 700;
  font-family: "futura-pt", sans-serif;
  font-size: 8rem;
  line-height: 130px;
  color: rgba(255, 255, 255, 0.6);
  text-align: center;
}
@media screen and (max-width: 1023px) {
  .about-en {
    font-size: 8rem;
  }
}
@media screen and (max-width: 767px) {
  .about-en {
    font-size: 5rem;
    line-height: 100px;
  }
}

.recruit-about-title {
  margin-bottom: 100px;
  color: rgb(128, 128, 128);
  font-size: 1.5rem;
}
.recruit-about-title .big {
  font-size: 2rem;
  font-family: "kozukafonmt", sans-serif;
}

.recruit-about-wrapper {
  margin-bottom: 50px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  gap: 30px;
}
@media screen and (max-width: 1023px) {
  .recruit-about-wrapper {
    gap: 10px;
  }
}

.recruit-about-box {
  position: relative;
  background-color: rgba(255, 255, 255, 0.8);
  padding: 30px;
  color: rgb(128, 128, 128);
}
@media screen and (max-width: 1023px) {
  .recruit-about-box {
    padding: 30px 15px;
  }
}
.recruit-about-box .title {
  font-size: 1.8rem;
}
@media screen and (max-width: 1023px) {
  .recruit-about-box .title {
    width: 100%;
  }
  .recruit-about-box .title br {
    display: none;
  }
}
.recruit-about-box .number {
  font-family: "ta-kakugo-gf-01", sans-serif;
  color: rgb(83, 204, 255);
  font-size: 7em;
  font-weight: 700;
  line-height: 150px;
}
@media screen and (max-width: 1250px) {
  .recruit-about-box .number {
    font-size: 5.2rem;
  }
}
@media screen and (max-width: 1023px) {
  .recruit-about-box .number {
    line-height: 105px;
  }
}
.recruit-about-box .number .small {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  font-size: 1.3rem;
}
.recruit-about-box .after-text {
  font-size: 1.2rem;
}
@media screen and (max-width: 1023px) {
  .recruit-about-box .after-text {
    position: absolute;
    bottom: 20px;
    font-size: 1rem;
  }
}
.recruit-about-box.one {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -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: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0 20px;
}
@media screen and (max-width: 1023px) {
  .recruit-about-box.one {
    width: calc((100% - 10px) / 2);
    display: block;
  }
}
@media screen and (max-width: 767px) {
  .recruit-about-box.one {
    width: 100%;
  }
}
.recruit-about-box.one .title {
  -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
          order: 1;
}
.recruit-about-box.one .number {
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
}
@media screen and (max-width: 1023px) {
  .recruit-about-box.one .number {
    -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
            order: 3;
  }
}
.recruit-about-box.one img {
  margin: 0;
  -webkit-box-ordinal-group: 4;
      -ms-flex-order: 3;
          order: 3;
  max-width: 180px;
}
@media screen and (max-width: 1250px) {
  .recruit-about-box.one img {
    max-width: 120px;
  }
}
@media screen and (max-width: 1023px) {
  .recruit-about-box.one img {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
    margin: 30px auto 0;
  }
}
.recruit-about-box.one .after-text {
  width: 100%;
  -webkit-box-ordinal-group: 5;
      -ms-flex-order: 4;
          order: 4;
  font-size: 1.5rem;
}
@media screen and (max-width: 1023px) {
  .recruit-about-box.one .after-text {
    font-size: 1rem;
  }
}
.recruit-about-box.three {
  width: calc((100% - 60px) / 3);
}
@media screen and (max-width: 1023px) {
  .recruit-about-box.three {
    width: calc((100% - 10px) / 2);
  }
}
@media screen and (max-width: 767px) {
  .recruit-about-box.three {
    width: 100%;
  }
}
.recruit-about-box.three .title {
  margin-bottom: 30px;
}
.recruit-about-box.three img {
  max-width: 130px;
}
.recruit-about-box.three .after-text {
  position: absolute;
  bottom: 20px;
  left: 0;
  width: 100%;
}
.recruit-about-box.two {
  width: calc((100% - 30px) / 2);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -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: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 20px;
}
@media screen and (max-width: 1023px) {
  .recruit-about-box.two {
    width: calc((100% - 10px) / 2);
  }
}
@media screen and (max-width: 767px) {
  .recruit-about-box.two {
    width: 100%;
  }
}
.recruit-about-box.two .inner-text {
  width: calc(100% - 115px - 21px);
}
@media screen and (max-width: 1023px) {
  .recruit-about-box.two .inner-text {
    display: contents;
  }
}
.recruit-about-box.two img {
  max-width: 115px;
  margin: 0;
}
@media screen and (max-width: 1023px) {
  .recruit-about-box.two img {
    -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
            order: 2;
    margin: auto;
  }
}
@media screen and (max-width: 1023px) {
  .recruit-about-box.two .number {
    -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
            order: 3;
    width: 100%;
  }
}

.top-flow-title {
  width: 65%;
  margin: 0 auto 50px;
  font-size: 1.8rem;
  font-weight: 600;
}
@media screen and (max-width: 767px) {
  .top-flow-title {
    font-size: 1.1rem;
  }
}

.recruit-flow-link-wrapper {
  display: -ms-grid;
  display: grid;
  gap: 50px 70px;
  -ms-grid-columns: 1fr 70px 1fr;
  grid-template-columns: repeat(2, 1fr);
}
@media screen and (max-width: 1023px) {
  .recruit-flow-link-wrapper {
    -ms-grid-columns: 100%;
    grid-template-columns: 100%;
  }
}
.recruit-flow-link-wrapper > div {
  text-align: left;
}
@media screen and (max-width: 767px) {
  .recruit-flow-link-wrapper > div {
    font-size: 0.9rem;
  }
}

.recruit-flow-link {
  position: relative;
  display: block;
  margin-bottom: 30px;
}
@media screen and (max-width: 767px) {
  .recruit-flow-link {
    margin-bottom: 15px;
  }
}
.recruit-flow-link .text-box {
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 2;
  font-size: 2rem;
  font-weight: 600;
  background-image: linear-gradient(150deg, rgb(255, 255, 255) 11%, rgb(255, 255, 255) 37%, rgb(255, 255, 255) 65%, rgb(255, 255, 255) 89%);
  padding: 20px 120px 20px 30px;
  border-radius: 20px 0 0;
  color: rgb(77, 77, 77);
}
@media screen and (max-width: 1100px) {
  .recruit-flow-link .text-box {
    font-size: 1.5rem;
    padding-right: 80px;
  }
}
@media screen and (max-width: 767px) {
  .recruit-flow-link .text-box {
    font-size: 1rem;
    padding: 15px 50px 5px 30px;
  }
}
.recruit-flow-link .text-box::before {
  position: absolute;
  right: 5px;
  bottom: 50%;
  -webkit-transform: translateY(50%);
          transform: translateY(50%);
  content: "";
  display: block;
  aspect-ratio: 80/13;
  width: 80px;
  background-image: url("../../images/black-arrow.png");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}
@media screen and (max-width: 1100px) {
  .recruit-flow-link .text-box::before {
    width: 60px;
  }
}
@media screen and (max-width: 767px) {
  .recruit-flow-link .text-box::before {
    width: 30px;
    bottom: 35%;
  }
}
.recruit-flow-link .text-box:hover {
  background-image: linear-gradient(150deg, rgb(138, 218, 251) 11%, rgb(79, 183, 249) 37%, rgb(111, 198, 250) 65%, rgb(72, 167, 248) 89%);
  color: #fff;
}
.recruit-flow-link:hover .text-box::before {
  -webkit-transform: translate(5px, 50%);
          transform: translate(5px, 50%);
}

.recruit-link.flow-link {
  margin-top: 100px;
}
@media screen and (max-width: 767px) {
  .recruit-link.flow-link {
    margin-top: 40px;
  }
}

.recruit-footer-section {
  padding: 0;
  background-color: #fff;
}
.recruit-footer-section .contents-wrapper {
  display: block;
}
.recruit-footer-section .google-link {
  padding: initial;
  background-color: #fff;
  border: none;
  border-radius: initial;
}
.recruit-footer-section .sns-link {
  width: 10%;
}

.recruit-footer-image {
  position: relative;
}
.recruit-footer-image .recruit-footer-message {
  position: absolute;
  top: 70px;
  left: 10%;
  -webkit-transform: rotate(-15deg);
          transform: rotate(-15deg);
  z-index: 2;
  color: rgb(255, 255, 255);
  font-family: "kozukafonmt", sans-serif;
  font-size: 5rem;
}
@media screen and (max-width: 1200px) {
  .recruit-footer-image .recruit-footer-message {
    font-size: 3rem;
    -webkit-transform: rotate(-10deg);
            transform: rotate(-10deg);
  }
}
@media screen and (max-width: 1023px) {
  .recruit-footer-image .recruit-footer-message {
    left: 30px;
  }
}
@media screen and (max-width: 767px) {
  .recruit-footer-image .recruit-footer-message {
    font-size: 1.5rem;
    top: 30px;
    left: 10px;
  }
}

.recruit-footer-logo {
  width: 40%;
  max-width: 580px;
  margin: 50px auto;
}
@media screen and (max-width: 767px) {
  .recruit-footer-logo {
    width: 100%;
    margin: 40px auto 30px;
  }
}

.recruit-footer-menu {
  margin-bottom: 70px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -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: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 30px;
}
@media screen and (max-width: 767px) {
  .recruit-footer-menu {
    display: none;
  }
}
.recruit-footer-menu a {
  color: rgb(77, 77, 77);
}
.recruit-footer-menu a::after {
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  margin-top: 5px;
  background-color: rgb(77, 77, 77);
  -webkit-transition: 0.5s;
  transition: 0.5s;
}
.recruit-footer-menu a:hover::after {
  opacity: 0;
}

.recruit-footer-address {
  margin-bottom: 50px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -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: center;
      -ms-flex-align: center;
          align-items: center;
  gap: 0;
}
@media screen and (max-width: 767px) {
  .recruit-footer-address {
    margin-bottom: 30px;
  }
}

.recruit-footer-copy {
  background-image: url("../../images/recruit-bg.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  padding: 30px;
  color: rgb(255, 255, 255);
}
@media screen and (max-width: 767px) {
  .recruit-footer-copy {
    padding: 10px;
  }
}

.recruit-mv {
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}
.recruit-mv::after {
  background-color: rgba(27, 20, 100, 0.2);
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  content: "";
  display: block;
  width: 100%;
  height: 100%;
}

.recruit-mv-title {
  position: absolute;
  bottom: 40px;
  font-size: 10rem;
  font-family: "futura-pt", sans-serif;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.8);
}
@media screen and (max-width: 1023px) {
  .recruit-mv-title {
    font-size: 7rem;
    bottom: 60px;
  }
}
@media screen and (max-width: 767px) {
  .recruit-mv-title {
    font-size: 4rem;
    bottom: 75px;
  }
}
.recruit-mv-title .ja {
  position: absolute;
  top: -20px;
  font-family: "kozuka-gothic-pr6n", sans-serif;
  left: -20px;
  font-size: 1.3rem;
}
@media screen and (max-width: 767px) {
  .recruit-mv-title .ja {
    font-size: 1rem;
  }
}
.message-mv-wrapper {
  height: 670px;
  background-image: url("../../images/message-mv.jpg?v2");
  background-size: contain;
  margin-top: 3%;
}
.contents-wrapper .blue-color {
  color: #0674BF;
}
.contents-wrapper.recruit.message {
  max-width: 950px;
}
.contents-wrapper.recruit.message .text-box p {
  text-align: left;
  color: #666666;
  letter-spacing: 3px;
  margin-top: 50px;
}
.contents-wrapper.recruit.message .text-box p.name-box {
  text-align: right;
}
.contents-wrapper.recruit .name-box {
  margin-top: 30px;
  text-align: right;
}
.contents-wrapper.recruit .name-box img {
  display: inline-block;
  margin-left: 10px;
  width: 200px;
  vertical-align: middle;
}
.recruit-link.flow-link.message {
  width: 800px;
  margin: 100px auto;
}
.recruit-mv.message-mv-wrapper::after {
  background-color: transparent;
}
@media screen and (max-width: 767px) {
  .message-mv-wrapper {
    margin-top: 0;
    height: 370px;
  }
  .recruit-link.flow-link.message {
    width: 100%;
    margin: 40px auto;
  }
  .contents-wrapper.recruit .name-box img {
    width: 130px;
  }
}
.interview-mv-wrapper {
  height: 670px;
  background-image: url("../../images/interview-mv.jpg");
}

@media screen and (max-width: 1023px) {
  .interview-mv-wrapper {
    height: 550px;
  }
}
@media screen and (max-width: 767px) {
  .interview-mv-wrapper {
    height: 350px;
  }
}

.page-interview-list {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 50px 1fr;
  grid-template-columns: repeat(2, 1fr);
  gap: 100px 50px;
}
@media screen and (max-width: 1023px) {
  .page-interview-list {
    -ms-grid-columns: 100%;
    grid-template-columns: 100%;
    gap: 50px;
  }
}
.page-interview-list .profile-box {
  margin: 10px 0 30px;
  padding: 20px 50px;
  background-image: url("../../images/refcruit-prof-bg.png");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  border-radius: 10px;
  color: rgb(255, 255, 255);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 1.2rem;
  text-align: left;
}
@media screen and (max-width: 1140px) {
  .page-interview-list .profile-box {
    padding: 20px;
  }
}
@media screen and (max-width: 767px) {
  .page-interview-list .profile-box {
    padding: 10px 20px;
    font-size: 1rem;
  }
}
@media screen and (max-width: 1400px) {
  .page-interview-list .profile-box .inlineblock-item {
    display: block;
  }
}
@media screen and (max-width: 767px) {
  .page-interview-list .profile-box .inlineblock-item {
    display: inline-block;
  }
}
.page-interview-list .profile-box .name {
  font-size: 1.8rem;
  font-weight: 700;
}
@media screen and (max-width: 767px) {
  .page-interview-list .profile-box .name {
    font-size: 1.3rem;
  }
}
.page-interview-list .message {
  text-align: left;
  text-decoration: underline;
  text-decoration-color: rgb(77, 77, 77);
  color: rgb(77, 77, 77);
  font-size: 1.6rem;
  font-family: "kozukafonmt", sans-serif;
}
@media screen and (max-width: 767px) {
  .page-interview-list .message {
    font-size: 1.3rem;
  }
}

.side-entry-btn {
  position: fixed;
  right: 0;
  top: 20%;
  z-index: 50;
  padding: 30px 15px;
  border-radius: 20px 0 0 20px;
  display: block;
  background: linear-gradient(108deg, rgb(2, 126, 255), rgb(116, 215, 255));
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  text-align: left;
}
@media screen and (max-width: 767px) {
  .side-entry-btn {
    padding: 20px 5px 20px 10px;
  }
}
.side-entry-btn span {
  vertical-align: top;
  -webkit-writing-mode: vertical-lr;
      -ms-writing-mode: tb-lr;
          writing-mode: vertical-lr;
  color: rgb(255, 255, 255);
}
@media screen and (max-width: 1023px) {
  .side-entry-btn span {
    font-size: 0.9rem;
  }
}
.side-entry-btn .en {
  font-size: 2rem;
  font-weight: 600;
  line-height: 25px;
}
@media screen and (max-width: 1023px) {
  .side-entry-btn .en {
    font-size: 1.5rem;
  }
}
.side-entry-btn img {
  margin-top: 60px;
  width: 50px;
}
@media screen and (max-width: 1023px) {
  .side-entry-btn img {
    width: 30px;
  }
}

.interview-page-mv-section {
  padding-top: 150px;
}
@media screen and (max-width: 767px) {
  .interview-page-mv-section {
    padding-top: 70px;
  }
}

.interview-page-mv {
  position: relative;
  width: 80%;
  margin-left: auto;
}
@media screen and (max-width: 1023px) {
  .interview-page-mv {
    width: 90%;
  }
}
@media screen and (max-width: 767px) {
  .interview-page-mv {
    width: 95%;
  }
}
.interview-page-mv .text-box {
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: rgb(255, 255, 255);
  padding: 30px 100px 0 0;
  border-radius: 0 50px 0 0;
  text-align: left;
  font-size: 1.4rem;
}
@media screen and (max-width: 1023px) {
  .interview-page-mv .text-box {
    font-size: 1.2rem;
    padding: 15px 80px 0 0;
  }
}
@media screen and (max-width: 767px) {
  .interview-page-mv .text-box {
    font-size: 0.8rem;
    border-radius: 0 30px 0 0;
    padding: 10px 40px 0 0;
  }
}
.interview-page-mv .text-box .name {
  display: block;
  font-size: 2.8rem;
  font-weight: 600;
}
@media screen and (max-width: 1023px) {
  .interview-page-mv .text-box .name {
    font-size: 2.3rem;
  }
}
@media screen and (max-width: 767px) {
  .interview-page-mv .text-box .name {
    font-size: 1.5rem;
  }
}
.interview-page-mv .message-box {
  position: absolute;
  left: -50px;
  top: 50px;
  text-align: left;
  font-size: 4rem;
  font-family: "kozukafonmt", sans-serif;
  color: rgb(255, 255, 255);
}
@media screen and (max-width: 1400px) {
  .interview-page-mv .message-box {
    font-size: 2.5rem;
  }
}
@media screen and (max-width: 1023px) {
  .interview-page-mv .message-box {
    top: -50px;
    font-size: 2rem;
  }
}
@media screen and (max-width: 1023px) {
  .interview-page-mv .message-box {
    position: static;
    color: rgb(77, 77, 77);
  }
}
.interview-page-mv .message-box span {
  display: inline-block;
  padding: 10px;
  border-radius: 5px;
  background-color: rgba(2, 151, 255, 0.8);
}
@media screen and (max-width: 1023px) {
  .interview-page-mv .message-box span {
    background-color: transparent;
    padding: 0;
  }
}
.interview-page-mv .message-box span:not(:last-child) {
  margin-bottom: 10px;
}

.interview-page-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  gap: 100px;
}
@media screen and (max-width: 1200px) {
  .interview-page-wrapper {
    gap: 50px;
  }
}
.interview-page-wrapper:not(:last-child) {
  margin-bottom: 100px;
}
.interview-page-wrapper .image-box {
  width: calc(50% - 100px);
}
@media screen and (max-width: 1023px) {
  .interview-page-wrapper .image-box {
    width: 60%;
  }
}
@media screen and (max-width: 767px) {
  .interview-page-wrapper .image-box {
    width: 70%;
  }
}
.interview-page-wrapper .interview-text-box {
  width: 50%;
  text-align: left;
}
@media screen and (max-width: 1200px) {
  .interview-page-wrapper .interview-text-box {
    width: calc(50% + 50px);
  }
}
@media screen and (max-width: 1023px) {
  .interview-page-wrapper .interview-text-box {
    width: calc(100% - 120px);
  }
}
@media screen and (max-width: 767px) {
  .interview-page-wrapper .interview-text-box {
    width: calc(100% - 60px);
    margin: auto;
  }
}
.interview-page-wrapper:nth-child(odd) .interview-text-box {
  padding-right: 120px;
}
@media screen and (max-width: 1023px) {
  .interview-page-wrapper:nth-child(odd) .interview-text-box {
    margin-left: auto;
  }
}
@media screen and (max-width: 767px) {
  .interview-page-wrapper:nth-child(odd) .interview-text-box {
    padding-right: 0;
  }
}
.interview-page-wrapper:nth-child(even) {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}
.interview-page-wrapper:nth-child(even) .interview-text-box {
  padding-left: 120px;
}
@media screen and (max-width: 1023px) {
  .interview-page-wrapper:nth-child(even) .interview-text-box {
    margin-right: auto;
  }
}
@media screen and (max-width: 767px) {
  .interview-page-wrapper:nth-child(even) .interview-text-box {
    padding-left: 0;
  }
}

.interview-text-box .q-box {
  margin-bottom: 50px;
  position: relative;
  width: calc(100% - 25px);
  margin-left: auto;
  background-color: rgba(83, 204, 255, 0.1);
  padding: 20px 20px 20px 50px;
  border-radius: 10px;
  font-size: 1.5rem;
  font-weight: 600;
}
@media screen and (max-width: 767px) {
  .interview-text-box .q-box {
    font-size: 1.3rem;
  }
}
@media screen and (max-width: 767px) {
  .interview-text-box .q-box {
    margin-bottom: 30px;
    padding-left: 29px;
    font-size: 1.1rem;
    width: calc(100% - 20px);
  }
}
.interview-text-box .q-box::before {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: absolute;
  top: 50%;
  left: 0;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  content: "Q";
  background-color: rgb(2, 151, 255);
  color: rgb(255, 255, 255);
  aspect-ratio: 1/1;
  width: 55px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -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: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 10px;
  border-radius: 5px;
  font-family: "futura-pt", sans-serif;
}
@media screen and (max-width: 767px) {
  .interview-text-box .q-box::before {
    width: 40px;
    padding: 5px;
  }
}
@media screen and (max-width: 767px) {
  .interview-text-box .a-box {
    font-size: 0.9rem;
  }
}
.interview-text-box .main-answer {
  margin-bottom: 25px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: 20px;
  font-size: 1.3rem;
  font-weight: 600;
}
@media screen and (max-width: 767px) {
  .interview-text-box .main-answer {
    font-size: 1rem;
  }
}
.interview-text-box .main-answer::before {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  content: "A";
  font-size: 1.5rem;
  background-color: rgb(83, 204, 255);
  color: rgb(255, 255, 255);
  aspect-ratio: 1/1;
  width: 55px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -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: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 10px;
  border-radius: 5px;
  font-family: "futura-pt", sans-serif;
}
@media screen and (max-width: 767px) {
  .interview-text-box .main-answer::before {
    width: 40px;
    padding: 5px;
  }
}
.interview-text-box .main-answer span {
  width: calc(100% - 55px - 20px);
}
@media screen and (max-width: 767px) {
  .interview-text-box .main-answer span {
    width: calc(100% - 40px - 20px);
  }
}

.synergy-section {
  overflow: hidden;
  color: rgb(255, 255, 255);
}

.synergy-wrapper {
  gap: 50px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
}
.synergy-wrapper .text-box {
  width: 50%;
  text-align: left;
}
@media screen and (max-width: 1023px) {
  .synergy-wrapper .text-box {
    width: 100%;
  }
}
.synergy-wrapper .image-box {
  width: calc(50% - 50px);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
@media screen and (max-width: 1023px) {
  .synergy-wrapper .image-box {
    width: 80%;
    margin: auto;
  }
}
.synergy-wrapper .image-box img {
  width: 48%;
}
.synergy-wrapper .image-box img:nth-child(2) {
  margin-top: 150px;
}
@media screen and (max-width: 1023px) {
  .synergy-wrapper .image-box img:nth-child(2) {
    margin-top: 50px;
  }
}

.synergy-title {
  margin-bottom: 50px;
  position: relative;
  padding-top: 110px;
  text-align: left;
  font-size: 2rem;
  font-weight: 700;
}
@media screen and (max-width: 1200px) {
  .synergy-title {
    padding-top: 70px;
    font-size: 1.5rem;
  }
}
@media screen and (max-width: 767px) {
  .synergy-title {
    margin-bottom: 30px;
    font-size: 1.2rem;
  }
}
.synergy-title .big {
  font-size: 3rem;
  font-family: "kozukafonmt", sans-serif;
}
@media screen and (max-width: 1200px) {
  .synergy-title .big {
    font-size: 2.5rem;
  }
}
@media screen and (max-width: 767px) {
  .synergy-title .big {
    font-size: 1.8rem;
  }
}
.synergy-title .en {
  position: absolute;
  left: -160px;
  top: 0;
  color: rgba(255, 255, 255, 0.3);
  font-size: 10rem;
  font-family: "futura-pt", sans-serif;
}
@media screen and (max-width: 1200px) {
  .synergy-title .en {
    font-size: 8rem;
    left: -50px;
  }
}
@media screen and (max-width: 767px) {
  .synergy-title .en {
    font-size: 6rem;
  }
}

.synergy-sub-title {
  margin-bottom: 30px;
  font-size: 2rem;
}
@media screen and (max-width: 767px) {
  .synergy-sub-title {
    font-size: 1.4rem;
    margin-bottom: 20px;
  }
}

.last-interview-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  text-align: left;
  gap: 80px;
}
@media screen and (max-width: 1200px) {
  .last-interview-wrapper {
    gap: 50px;
  }
}
.last-interview-wrapper .interview-text-box {
  width: calc((100% - 80px) / 2);
}
@media screen and (max-width: 1200px) {
  .last-interview-wrapper .interview-text-box {
    width: calc((100% - 50px) / 2);
  }
}
@media screen and (max-width: 1023px) {
  .last-interview-wrapper .interview-text-box {
    width: 100%;
  }
}

.careerup-mv-wrapper {
  background-image: url("../../images/careerup-mv.jpg");
  height: 1074px;
}
@media screen and (max-width: 1023px) {
  .careerup-mv-wrapper {
    height: 790px;
  }
}
@media screen and (max-width: 767px) {
  .careerup-mv-wrapper {
    height: 390px;
  }
}

.careerup-first-section {
  overflow: hidden;
}

.careerup-title {
  width: 50%;
  margin: 0 auto 100px;
  border-bottom: solid;
  -o-border-image: linear-gradient(to right, #FFF, #FFF) 1/0 0 3px;
     border-image: -webkit-gradient(linear, left top, right top, from(#FFF), to(#FFF)) 1/0 0 3px;
     border-image: linear-gradient(to right, #FFF, #FFF) 1/0 0 3px;
}
@media screen and (max-width: 1023px) {
  .careerup-title {
    width: 80%;
    margin-bottom: 50px;
  }
}

.careerup-first-wrapepr {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 100px 1fr;
  grid-template-columns: repeat(2, 1fr);
  gap: 100px;
}
@media screen and (max-width: 1200px) {
  .careerup-first-wrapepr {
    gap: 50px;
  }
}
@media screen and (max-width: 1023px) {
  .careerup-first-wrapepr {
    gap: 30px;
  }
}
@media screen and (max-width: 767px) {
  .careerup-first-wrapepr {
    -ms-grid-columns: 100%;
    grid-template-columns: 100%;
  }
}
.careerup-first-wrapepr .text-box {
  position: relative;
  text-align: left;
  line-height: 2;
}
.careerup-first-wrapepr .text-box span {
  position: relative;
  z-index: 2;
  color: #fff;
  text-shadow: 1px 1px 10px #000;
}
.careerup-first-wrapepr .text-box img {
  position: absolute;
  bottom: -100px;
  right: -10%;
  width: 50%;
}
@media screen and (max-width: 767px) {
  .careerup-first-wrapepr .text-box img {
    bottom: -50px;
  }
}

.infra-title {
  position: relative;
  margin-bottom: 50px;
  padding-top: 90px;
}
@media screen and (max-width: 1023px) {
  .infra-title {
    padding-top: 60px;
  }
}
@media screen and (max-width: 767px) {
  .infra-title {
    padding-top: 20px;
    margin-bottom: 10px;
  }
}
.infra-title::before {
  position: absolute;
  bottom: -9px;
  left: 50%;
  -webkit-transform: translateX(-23%) rotate(-35deg);
          transform: translateX(-23%) rotate(-35deg);
  display: block;
  width: 30px;
  height: 2px;
  background-color: rgb(116, 215, 255);
}
.infra-title .en {
  position: absolute;
  top: 0;
  left: 50%;
  width: 100%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  font-size: 10rem;
  font-family: "futura-pt", sans-serif;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.3);
}
@media screen and (max-width: 1308px) {
  .infra-title .en {
    font-size: 8rem;
  }
}
@media screen and (max-width: 1023px) {
  .infra-title .en {
    font-size: 5rem;
  }
}
@media screen and (max-width: 767px) {
  .infra-title .en {
    font-size: 3rem;
  }
}
.infra-title .ja {
  position: relative;
  z-index: 2;
  font-size: 3rem;
  font-weight: 700;
  color: rgb(116, 215, 255);
  display: inline-block;
  width: 70%;
}
@media screen and (max-width: 1023px) {
  .infra-title .ja {
    font-size: 2rem;
  }
}
@media screen and (max-width: 767px) {
  .infra-title .ja {
    font-size: 1.5rem;
    padding-bottom: 5px;
    width: 100%;
  }
}
.infra-title .ja::before, .infra-title .ja::after {
  position: absolute;
  bottom: 0;
  content: "";
  width: calc(50% - 20px);
  height: 2px;
  display: block;
  background-color: rgb(255, 255, 255);
}
.infra-title .ja::before {
  left: 0;
}
.infra-title .ja::after {
  right: 0;
}

.infra-wrapper {
  margin-bottom: 50px;
  gap: 80px 100px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
}
@media screen and (max-width: 767px) {
  .infra-wrapper {
    gap: 40px;
  }
}

.infra-box {
  position: relative;
  padding: 30px;
  background-color: rgba(255, 255, 255, 0.8);
}
@media screen and (max-width: 767px) {
  .infra-box {
    padding: 15px;
  }
}
.infra-box::before, .infra-box::after {
  position: absolute;
  bottom: 0;
  display: block;
  width: 25px;
  aspect-ratio: 25/72;
  background-image: url("../../images/one-arrow.svg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}
@media screen and (max-width: 767px) {
  .infra-box::before, .infra-box::after {
    width: 11px;
  }
}
.infra-box.big {
  width: 100%;
  font-weight: 700;
  font-size: 2rem;
  border-radius: 55px;
}
@media screen and (max-width: 1023px) {
  .infra-box.big {
    font-size: 1.5rem;
  }
}
@media screen and (max-width: 767px) {
  .infra-box.big {
    font-size: 1.2rem;
  }
}
.infra-box.big img {
  position: relative;
}
.infra-box.one::before {
  content: "";
  left: 50%;
  -webkit-transform: translate(-50%, 100%);
          transform: translate(-50%, 100%);
}
.infra-box.two::before {
  content: "";
  left: 20%;
  -webkit-transform: translateY(100%);
          transform: translateY(100%);
}
@media screen and (max-width: 767px) {
  .infra-box.two::before {
    left: 50%;
    -webkit-transform: translate(-50%, 100%);
            transform: translate(-50%, 100%);
  }
}
.infra-box.two::after {
  content: "";
  right: 20%;
  -webkit-transform: translateY(100%);
          transform: translateY(100%);
}
@media screen and (max-width: 767px) {
  .infra-box.two::after {
    display: none;
  }
}
.infra-box.two .bg-blue-text-box {
  margin-right: 10px;
}
.infra-box .bg-blue-text-box {
  display: inline-block;
  background-color: #1B3666;
  color: rgb(255, 255, 255);
  padding: 5px 25px;
  font-size: 1.5rem;
  font-weight: 600;
  letter-spacing: 2px;
}
@media screen and (max-width: 1023px) {
  .infra-box .bg-blue-text-box {
    font-size: 1.2rem;
  }
}
.infra-box.small {
  padding: 40px 50px;
  width: calc((100% - 100px) / 2);
  border-radius: 40px;
}
@media screen and (max-width: 1023px) {
  .infra-box.small {
    padding: 40px 20px;
  }
}
@media screen and (max-width: 767px) {
  .infra-box.small {
    width: 100%;
  }
}
.infra-box.small .title {
  display: block;
  width: 100%;
  font-size: 1.8rem;
  font-weight: 600;
  margin: 20px 0 30px;
}
@media screen and (max-width: 1023px) {
  .infra-box.small .title {
    font-size: 1.5rem;
  }
}
.infra-box.small p {
  width: 100%;
  border-top: 3px dotted rgb(116, 215, 255);
  text-align: left;
  padding-top: 30px;
}
.infra-box.three::before {
  top: 40%;
  right: 0;
  -webkit-transform: translateX(100%);
          transform: translateX(100%);
  content: "連携";
  color: rgb(255, 255, 255);
  font-size: 1.2rem;
  width: 100px;
  background-image: none;
}
@media screen and (max-width: 767px) {
  .infra-box.three::before {
    top: auto;
    bottom: 0;
    right: auto;
    left: 50%;
    -webkit-transform: translateY(102%);
            transform: translateY(102%);
  }
}
.infra-box.three::after {
  content: "";
  width: 100px;
  height: 20px;
  background-image: url("../../images/two-arrow.svg");
  right: 0;
  top: 50%;
  -webkit-transform: translateX(100%);
          transform: translateX(100%);
}
@media screen and (max-width: 767px) {
  .infra-box.three::after {
    right: auto;
    left: 50%;
    top: auto;
    bottom: 0;
    width: 40px;
    -webkit-transform: translate(-50%, 30px) rotate(90deg);
            transform: translate(-50%, 30px) rotate(90deg);
  }
}
.infra-box.four {
  background-color: rgba(27, 54, 102, 0.9);
  color: rgb(255, 255, 255);
}
.infra-box.four .bg-blue-text-box {
  background-color: rgb(255, 255, 255);
  color: #1B3666;
}
.infra-box.four .title img {
  width: 70%;
}
@media screen and (max-width: 1023px) {
  .infra-box.four .title img {
    width: 100%;
  }
}

.careerupswiper .swiper-pagination {
  position: static;
  text-align: right;
}
.careerupswiper .swiper-pagination .swiper-pagination-bullet {
  width: 30px;
  height: 2px;
  border-radius: 0;
  background: rgb(255, 255, 255);
}

.department-title {
  position: relative;
  padding-top: 100px;
}
@media screen and (max-width: 1100px) {
  .department-title {
    padding-top: 60px;
  }
}
@media screen and (max-width: 767px) {
  .department-title {
    padding-top: 20px;
  }
}
.department-title.white .en {
  color: rgba(255, 255, 255, 0.3);
}
.department-title .en {
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  font-size: 10rem;
  color: rgba(116, 215, 255, 0.3);
  font-family: "futura-pt", sans-serif;
  width: 100%;
}
@media screen and (max-width: 1100px) {
  .department-title .en {
    font-size: 7rem;
  }
}
@media screen and (max-width: 1023px) {
  .department-title .en {
    font-size: 6rem;
  }
}
@media screen and (max-width: 767px) {
  .department-title .en {
    font-size: 3.5rem;
  }
}
.department-title .ja {
  position: relative;
  z-index: 2;
  font-size: 3rem;
  font-weight: 600;
  color: #666666;
}
@media screen and (max-width: 767px) {
  .department-title .ja {
    font-size: 2rem;
  }
}

.department-title-after {
  font-weight: 600;
  margin-bottom: 100px;
  color: #666666;
}
@media screen and (max-width: 767px) {
  .department-title-after {
    margin-bottom: 40px;
  }
}

.modal-open .department-section {
  z-index: 90000;
  background-color: transparent;
}

.department-wrapper {
  gap: 50px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
}
@media screen and (max-width: 1023px) {
  .department-wrapper {
    gap: 30px;
  }
}
.department-wrapper .department-modal-box {
  width: calc((100% - 50px) / 2);
}
@media screen and (max-width: 1023px) {
  .department-wrapper .department-modal-box {
    width: calc((100% - 30px) / 2);
  }
}
@media screen and (max-width: 767px) {
  .department-wrapper .department-modal-box {
    width: 100%;
  }
}
.department-wrapper .js_modalBtnCont {
  cursor: pointer;
  position: relative;
  display: block;
  color: rgb(255, 255, 255);
  text-shadow: 3px 3px 5px rgba(27, 20, 100, 0.5);
  font-size: 2.5rem;
  font-weight: 600;
}
@media screen and (max-width: 1023px) {
  .department-wrapper .js_modalBtnCont {
    font-size: 1.5rem;
  }
}
.department-wrapper .js_modalBtnCont:hover .image-box::before {
  opacity: 0;
}
.department-wrapper .js_modalBtnCont .image-box {
  position: relative;
}
.department-wrapper .js_modalBtnCont .image-box::before {
  background-color: rgba(27, 54, 102, 0.2);
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}
.department-wrapper .js_modalBtnCont .text {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 100%;
}
.department-wrapper .moodal-title {
  margin-bottom: 20px;
  font-size: 3rem;
  font-weight: 600;
}

.development-linik-wrapper {
  margin-bottom: 100px;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr)[5];
  grid-template-columns: repeat(5, 1fr);
  border-radius: 20px;
  background-color: #005CB0;
  border: 1px solid rgb(255, 255, 255);
}
@media screen and (max-width: 767px) {
  .development-linik-wrapper {
    margin-bottom: 50px;
  }
}
.development-linik-wrapper a {
  position: relative;
  padding: 15px 5px;
  color: rgb(255, 255, 255);
  font-size: 1.2rem;
  background-color: #53CCFF;
  letter-spacing: 3px;
}
.development-linik-wrapper a:first-child {
  border-radius: 20px 0 0 20px;
}
.development-linik-wrapper a:last-child {
  border-radius: 0 20px 20px 0;
}
.development-linik-wrapper a:not(:last-child) {
  border-right: 1px solid rgb(255, 255, 255);
}
.development-linik-wrapper a::after {
  position: absolute;
  bottom: 0;
  left: 50%;
  letter-spacing: 50%;
  -webkit-transform: translate(-50%, 50%) rotate(45deg);
          transform: translate(-50%, 50%) rotate(45deg);
  content: "";
  display: block;
  width: 10px;
  aspect-ratio: 1/1;
  background-color: #005CB0;
  border-bottom: 1px solid rgb(255, 255, 255);
  border-right: 1px solid rgb(255, 255, 255);
  opacity: 0;
  -webkit-transition: 0.6s;
  transition: 0.6s;
}
.development-linik-wrapper a span {
  font-size: 2.2rem;
  font-weight: 700;
  font-family: "futura-pt", sans-serif;
}
@media screen and (max-width: 767px) {
  .development-linik-wrapper a span {
    display: block;
  }
}
.development-linik-wrapper a:hover {
  background-color: transparent;
}
.development-linik-wrapper a:hover::after {
  opacity: 1;
}

.development-contents {
  position: relative;
  gap: 50px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
}
@media screen and (max-width: 1023px) {
  .development-contents {
    gap: 30px;
  }
}
@media screen and (max-width: 767px) {
  .development-contents {
    gap: 30px 5px;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
}
.development-contents::after {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  content: "";
  width: 1px;
  height: 100%;
  background-color: rgb(255, 255, 255);
}
@media screen and (max-width: 1023px) {
  .development-contents::after {
    top: 30%;
    display: none;
  }
}
@media screen and (max-width: 767px) {
  .development-contents::after {
    top: 20%;
    display: none;
  }
}
.development-contents:nth-child(even) {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}
.development-contents:not(:last-child) {
  margin-bottom: 100px;
}
@media screen and (max-width: 767px) {
  .development-contents:not(:last-child) {
    margin-bottom: 50px;
  }
}
.development-contents .image-box {
  width: 55%;
  position: relative;
  z-index: 2;
}
@media screen and (max-width: 1100px) {
  .development-contents .image-box {
    width: 60%;
  }
}
@media screen and (max-width: 1023px) {
  .development-contents .image-box {
    width: 100%;
  }
}
.development-contents .text-box {
  width: calc(45% - 50px);
  color: #000;
}
@media screen and (max-width: 1100px) {
  .development-contents .text-box {
    display: contents;
  }
}
.development-contents .text-box h3 {
  color: #027eff;
  font-weight: 700;
  font-size: 2.4rem;
}
.development-contents .text-box p {
  text-align: left;
}
@media screen and (max-width: 1100px) {
  .development-contents .text-box p {
    position: relative;
    z-index: 2;
    width: 60%;
    padding: 30px;
    background-color: rgba(116, 215, 255, 0.5);
    margin: auto;
  }
}
@media screen and (max-width: 1023px) {
  .development-contents .text-box p {
    width: 100%;
  }
}
@media screen and (max-width: 767px) {
  .development-contents .text-box p {
    padding: 30px 20px;
  }
}
.development-contents .year {
  margin-bottom: 20px;
  -webkit-writing-mode: vertical-lr;
      -ms-writing-mode: tb-lr;
          writing-mode: vertical-lr;
  font-size: 2.5rem;
  width: 35%;
}
@media screen and (max-width: 1100px) {
  .development-contents .year {
    width: calc(40% - 50px);
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -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: center;
        -ms-flex-align: center;
            align-items: center;
  }
}
@media screen and (max-width: 1023px) {
  .development-contents .year {
    width: calc(30% - 30px);
  }
}
@media screen and (max-width: 767px) {
  .development-contents .year {
    font-size: 1.3rem;
    width: 80%;
  }
}
.development-contents .year span {
  font-size: 7rem;
  text-combine-upright: all;
  font-family: "futura-pt", sans-serif;
}
@media screen and (max-width: 767px) {
  .development-contents .year span {
    font-size: 5rem;
  }
}

.career-interview-section {
  padding-top: 200px;
}

.career-interview-link {
  position: relative;
  display: block;
}
.career-interview-link::before {
  background-color: rgba(27, 20, 100, 0.2);
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  -webkit-transition: 0.5s;
  transition: 0.5s;
}
.career-interview-link .interview-title {
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  font-size: 5rem;
  letter-spacing: 2px;
  color: rgb(116, 215, 255);
  font-weight: 700;
}
.career-interview-link .ja {
  position: absolute;
  top: 50%;
  letter-spacing: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  color: rgb(255, 255, 255);
  font-size: 2rem;
  text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2);
}
.career-interview-link::after {
  position: absolute;
  right: 20px;
  bottom: 30px;
  content: "";
  display: block;
  width: 40px;
  aspect-ratio: 1/1;
  background-image: url("../../images/side-entry-arrow.svg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  z-index: 2;
}
.career-interview-link:hover::before {
  opacity: 0;
}

.recruit-mv.recruitment {
  background-image: url("../../images/floew-mv.jpg");
}
@media screen and (max-width: 767px) {
  .recruit-mv.recruitment {
    background-position: left;
  }
}
@media screen and (max-width: 1100px) {
  .recruit-mv.recruitment .recruit-mv-title {
    font-size: 9rem;
  }
}
@media screen and (max-width: 1023px) {
  .recruit-mv.recruitment .recruit-mv-title {
    font-size: 7rem;
  }
}
@media screen and (max-width: 767px) {
  .recruit-mv.recruitment .recruit-mv-title {
    font-size: 3.5rem;
  }
}

.recruitment-first-text {
  margin-bottom: 100px;
  font-size: 1.4rem;
}
@media screen and (max-width: 767px) {
  .recruitment-first-text {
    font-size: 1rem;
  }
}

.recruitment-first-box {
  position: relative;
  border: 1px solid rgb(2, 151, 255);
  border-radius: 30px;
}
.recruitment-first-box::after {
  position: absolute;
  top: 0;
  left: 50%;
  z-index: 3;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  content: "";
  display: block;
  width: 40%;
  height: 7px;
  background-color: rgb(255, 255, 255);
}
@media screen and (max-width: 767px) {
  .recruitment-first-box::after {
    width: 60%;
  }
}
.recruitment-first-box > div {
  position: relative;
  z-index: 5;
  padding: 80px 30px 60px;
}
@media screen and (max-width: 767px) {
  .recruitment-first-box > div {
    padding: 50px 20px 30px;
  }
}
.recruitment-first-box > div::after {
  position: absolute;
  bottom: 0;
  left: 50%;
  z-index: 3;
  -webkit-transform: translate(-50%, 50%);
          transform: translate(-50%, 50%);
  content: "";
  display: block;
  width: 50%;
  height: 1px;
  background-color: rgb(2, 151, 255);
}
@media screen and (max-width: 767px) {
  .recruitment-first-box > div::after {
    display: none;
  }
}
.recruitment-first-box > div::before {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  display: block;
  width: 30%;
  max-width: 300px;
  aspect-ratio: 300/556;
  background-image: url("../../images/blue-lightning.svg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}
@media screen and (max-width: 767px) {
  .recruitment-first-box > div::before {
    width: 50%;
  }
}
.recruitment-first-box h2 {
  position: absolute;
  top: 0;
  left: 50%;
  z-index: 10;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  font-size: 3rem;
  font-weight: 600;
  color: rgb(116, 215, 255);
  padding: 0 20px;
}
@media screen and (max-width: 767px) {
  .recruitment-first-box h2 {
    font-size: 2rem;
    width: 100%;
  }
}

.recruit-dot-list {
  position: relative;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  text-align: left;
  margin: auto;
  font-size: 1.6rem;
  color: rgb(128, 128, 128);
  z-index: 2;
}
@media screen and (max-width: 767px) {
  .recruit-dot-list {
    font-size: 1.2rem;
  }
}
.recruit-dot-list li {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  border-bottom: 1px solid rgb(2, 151, 255);
}
.recruit-dot-list li::before {
  content: "";
  display: inline-block;
  width: 20px;
  aspect-ratio: 1/1;
  border-radius: 50%;
  margin-right: 20px;
  background-color: rgb(2, 151, 255);
}
@media screen and (max-width: 767px) {
  .recruit-dot-list li::before {
    width: 10px;
    margin-right: 5px;
  }
}
.recruit-dot-list li:not(:last-child) {
  margin-bottom: 15px;
}

.requirements-tabs {
  margin: 100px 0;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: (1fr)[2];
  grid-template-columns: repeat(2, 1fr);
}
@media screen and (max-width: 767px) {
  .requirements-tabs {
    margin: 50px 0;
  }
}

.tab-content {
  background-color: rgb(255, 255, 255);
  border-radius: 70px;
  display: none;
}
@media screen and (max-width: 767px) {
  .tab-content {
    border-radius: 40px;
  }
}
.tab-content .inner-box {
  padding: 50px;
}
@media screen and (max-width: 767px) {
  .tab-content .inner-box {
    padding: 50px 20px;
  }
}

.tab-content.active {
  display: block;
}

.tab-link {
  position: relative;
  padding: 20px 10px;
  background-color: #53CCFF;
  border: none;
  color: rgb(255, 255, 255);
  font-size: 1.9rem;
  font-weight: 600;
  letter-spacing: 3px;
  border: 1px solid rgb(255, 255, 255);
  cursor: pointer;
}
@media screen and (max-width: 767px) {
  .tab-link {
    font-size: 1.4rem;
    padding: 10px 5px;
  }
}
.tab-link::after {
  position: absolute;
  bottom: 0;
  left: 50%;
  -webkit-transform: translate(-50%, 50%) rotate(45deg);
          transform: translate(-50%, 50%) rotate(45deg);
  background-color: rgb(0, 91, 171);
  content: "";
  display: block;
  width: 10px;
  aspect-ratio: 1/1;
  border-bottom: 1px solid rgb(255, 255, 255);
  border-right: 1px solid rgb(255, 255, 255);
  opacity: 0;
  -webkit-transform: 0.5s;
          transform: 0.5s;
}

.tab-link.active {
  background-color: rgb(0, 91, 171);
}
.tab-link.active::after {
  opacity: 1;
}

.blue-dot-list.recruit li::before {
  background-color: rgb(0, 154, 239);
}

.requirements-table {
  text-align: left;
}
.requirements-table th {
  padding: 30px 50px;
  width: 300px;
  font-size: 1.5rem;
  background-color: rgb(242, 242, 242);
  border-bottom: 1px solid #E6E6E6;
}
@media screen and (max-width: 1023px) {
  .requirements-table th {
    width: 200px;
    font-size: 1.2rem;
    padding: 20px 30px;
  }
}
@media screen and (max-width: 767px) {
  .requirements-table th {
    display: block;
    width: 100%;
    padding: 10px 5px;
    text-align: center;
  }
}
.requirements-table td {
  padding: 30px 50px;
  border-bottom: 1px solid #E6E6E6;
  font-weight: 400;
}
@media screen and (max-width: 1023px) {
  .requirements-table td {
    padding: 20px 30px;
  }
}
@media screen and (max-width: 767px) {
  .requirements-table td {
    display: block;
    width: 100%;
    padding: 20px 0;
  }
}
.requirements-table tr:first-child th {
  border-top: 1px solid #0297FF;
}
.requirements-table tr:first-child td {
  border-top: 1px solid #E6E6E6;
}
.requirements-table .bold {
  font-weight: 700;
}
.requirements-table .margin-left {
  margin-left: 15px;
}

.recruit-flow-wrapper {
  margin-top: 100px;
  counter-reset: number 0;
}

.recruit-flow-box {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  gap: 250px;
  counter-increment: number 1;
}
@media screen and (max-width: 1023px) {
  .recruit-flow-box {
    gap: 30px;
  }
}
.recruit-flow-box:not(:last-child) {
  padding-bottom: 100px;
}
@media screen and (max-width: 1023px) {
  .recruit-flow-box:not(:last-child) {
    padding-bottom: 70px;
  }
}
.recruit-flow-box:nth-child(odd) {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}
.recruit-flow-box::before {
  position: absolute;
  left: 50%;
  top: 0;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  content: counter(number, decimal-leading-zero);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -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: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 3rem;
  font-family: "futura-pt", sans-serif;
  color: #0297FF;
  width: 150px;
  aspect-ratio: 1/1;
  border-radius: 50%;
  border: 1px solid #0297FF;
  background-color: rgb(255, 255, 255);
  z-index: 2;
}
@media screen and (max-width: 1023px) {
  .recruit-flow-box::before {
    width: 60px;
    left: 0;
    font-size: 1.2rem;
    -webkit-transform: translate(0);
            transform: translate(0);
  }
}
@media screen and (max-width: 767px) {
  .recruit-flow-box::before {
    width: 40px;
  }
}
.recruit-flow-box::after {
  position: absolute;
  top: 50px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  content: "";
  height: 100%;
  width: 1px;
  background-color: #0297FF;
}
@media screen and (max-width: 1023px) {
  .recruit-flow-box::after {
    left: 33px;
  }
}
@media screen and (max-width: 767px) {
  .recruit-flow-box::after {
    left: 21px;
    top: 20px;
  }
}
.recruit-flow-box .text-box,
.recruit-flow-box .image-box {
  width: calc((100% - 250px) / 2);
}
@media screen and (max-width: 1023px) {
  .recruit-flow-box .text-box,
  .recruit-flow-box .image-box {
    width: 100%;
    padding-left: 80px;
  }
}
@media screen and (max-width: 767px) {
  .recruit-flow-box .text-box,
  .recruit-flow-box .image-box {
    padding-left: 50px;
  }
}
.recruit-flow-box .text-box {
  text-align: left;
}
@media screen and (max-width: 767px) {
  .recruit-flow-box .text-box {
    font-size: 0.9rem;
  }
}
.recruit-flow-box .text-box a {
  color: #0297FF;
  border-bottom: 1px solid #0297FF;
}
.recruit-flow-box .title {
  margin-bottom: 30px;
  background-image: url("../../images/refcruit-prof-bg.png");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  color: rgb(255, 255, 255);
  padding: 20px;
  border-radius: 10px;
  font-weight: 600;
  font-size: 1.3rem;
}
@media screen and (max-width: 767px) {
  .recruit-flow-box .title {
    padding: 15px;
    font-size: 1.1rem;
    margin-bottom: 15px;
  }
}

.recruit-mv.benefits {
  background-image: url("../../images/benefits-mv.jpg");
}

.benefits-first-title {
  font-size: 1.4rem;
  margin-bottom: 150px;
}
@media screen and (max-width: 767px) {
  .benefits-first-title {
    font-size: 1.1rem;
  }
}

.benefits-first-box {
  position: relative;
  border: 1px solid rgb(2, 151, 255);
  border-radius: 20px;
  padding: 70px 50px 50px;
}
@media screen and (max-width: 767px) {
  .benefits-first-box {
    padding: 50px 30px 30px;
  }
}
.benefits-first-box .title {
  position: absolute;
  top: 0;
  left: 50%;
  -webkit-transform: translate(-50%, -70%);
          transform: translate(-50%, -70%);
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  background-color: rgb(255, 255, 255);
  padding: 0 40px;
}
@media screen and (max-width: 1100px) {
  .benefits-first-box .title {
    width: 60%;
  }
}
@media screen and (max-width: 1023px) {
  .benefits-first-box .title {
    width: 65%;
  }
}
@media screen and (max-width: 767px) {
  .benefits-first-box .title {
    width: 85%;
    padding: 0;
  }
}
.benefits-first-box .title .en {
  color: rgb(116, 215, 255);
  font-family: "futura-pt", sans-serif;
}
.benefits-first-box .title .ja {
  display: block;
  font-weight: 700;
  font-size: 3rem;
}
@media screen and (max-width: 1023px) {
  .benefits-first-box .title .ja {
    font-size: 2.5rem;
  }
}
@media screen and (max-width: 767px) {
  .benefits-first-box .title .ja {
    font-size: 1.7rem;
  }
}

.benefits-list {
  gap: 50px;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 50px 1fr;
  grid-template-columns: repeat(2, 1fr);
}
@media screen and (max-width: 1023px) {
  .benefits-list {
    gap: 30px;
  }
}
@media screen and (max-width: 767px) {
  .benefits-list {
    -ms-grid-columns: 100%;
    grid-template-columns: 100%;
    gap: 10px;
  }
}
.benefits-list li {
  background-image: url("../../images/refcruit-prof-bg.png");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  border-radius: 40px;
  padding: 20px;
  color: rgb(255, 255, 255);
  font-size: 1.5rem;
  font-weight: 700;
}
@media screen and (max-width: 767px) {
  .benefits-list li {
    padding: 10px;
  }
}

.department-title.white.benefits {
  margin-bottom: 100px;
}
@media screen and (max-width: 767px) {
  .department-title.white.benefits {
    margin-bottom: 30px;
  }
}
.department-title.white.benefits .ja {
  color: rgb(255, 255, 255);
}

.benefits-wrapper {
  margin-bottom: 100px;
  position: relative;
  gap: 80px 120px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  background-color: rgb(255, 255, 255);
  padding: 100px;
  border-radius: 70px;
}
@media screen and (max-width: 1200px) {
  .benefits-wrapper {
    gap: 50px;
  }
}
@media screen and (max-width: 767px) {
  .benefits-wrapper {
    gap: 30px;
  }
}
@media screen and (max-width: 1200px) {
  .benefits-wrapper {
    padding: 100px 50px;
  }
}
@media screen and (max-width: 767px) {
  .benefits-wrapper {
    padding: 50px 20px;
    border-radius: 30px;
  }
}
.benefits-wrapper::before {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  content: "";
  display: block;
  width: 40%;
  aspect-ratio: 1/1;
  background-image: url("../../images/logo-light-blue.svg");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
}
.benefits-wrapper .benefits-main-box {
  width: calc((100% - 120px) / 2);
}
@media screen and (max-width: 1200px) {
  .benefits-wrapper .benefits-main-box {
    width: calc((100% - 50px) / 2);
  }
}
@media screen and (max-width: 1023px) {
  .benefits-wrapper .benefits-main-box {
    width: 100%;
  }
}
.benefits-wrapper .title {
  position: relative;
  margin-bottom: 30px;
  padding: 16px 40px;
  border-radius: 50px;
  background: -webkit-gradient(linear, right top, left top, from(#74D7FF), to(#027EFF));
  background: linear-gradient(to left, #74D7FF, #027EFF);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  gap: 10px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media screen and (max-width: 767px) {
  .benefits-wrapper .title {
    padding: 10px 20px;
    margin-bottom: 10px;
  }
}
.benefits-wrapper .title::before {
  content: "";
  display: inline-block;
  width: 20px;
  aspect-ratio: 1/1;
  background-color: rgb(255, 255, 255);
  border-radius: 50%;
}
@media screen and (max-width: 767px) {
  .benefits-wrapper .title::before {
    width: 10px;
  }
}
.benefits-wrapper .title span {
  color: rgb(255, 255, 255);
  font-size: 1.5rem;
  font-weight: 700;
}
@media screen and (max-width: 767px) {
  .benefits-wrapper .title span {
    font-size: 1.2rem;
  }
}
.benefits-wrapper .title img {
  position: absolute;
  bottom: 10px;
  right: 20px;
  width: 100px;
  aspect-ratio: 1/1;
  -o-object-fit: contain;
     object-fit: contain;
}
@media screen and (max-width: 1023px) {
  .benefits-wrapper .title img {
    width: 80px;
  }
}
@media screen and (max-width: 767px) {
  .benefits-wrapper .title img {
    width: 50px;
  }
}

.benefits-main-list {
  text-align: left;
}
.benefits-main-list li {
  color: rgb(128, 128, 128);
}
.benefits-main-list li .big {
  font-size: 1.4rem;
  font-weight: 700;
}
@media screen and (max-width: 767px) {
  .benefits-main-list li .big {
    font-size: 1.2rem;
  }
}
.benefits-main-list li .big::before {
  -ms-flex-item-align: center;
      -ms-grid-row-align: center;
      align-self: center;
  content: "";
  display: inline-block;
  width: 15px;
  margin-right: 10px;
  aspect-ratio: 1/1;
  border-radius: 50%;
  border: 1px solid #027EFF;
}
.benefits-main-list li .small {
  margin-left: 25px;
  display: block;
  font-weight: 400;
}
@media screen and (max-width: 767px) {
  .benefits-main-list li .small {
    font-size: 0.9rem;
  }
}