.recruitTop header {
  background-color: #f8f8f8;
  border-bottom: none; }
@media screen and (max-width: 1000px) {
  .recruitTop .header_inner {
    background-color: transparent; }
    .recruitTop .header_inner.is_active {
      background-color: #fff; } }

main {
  position: relative; }

.mv {
  width: 100%;
  height: calc(100vh - 80px);
  position: relative; }
  @media screen and (max-width: 768px) {
    .mv {
      height: calc(51vh - 54px); } }
  .mv_bg {
    background-image: url(../img/top/mv_bg.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: calc(100vh - 80px);
    position: fixed;
    z-index: 1; }
    @media screen and (max-width: 1000px) {
      .mv_bg {
        background-image: url(../img/top/mv_bg_sp.jpg);
        height: calc(100vh - 54px); } }
    @media screen and (max-width: 768px) {
      .mv_bg {
        height: calc(52vh - 54px); } }
  .mv_inner {
    width: 100%;
    height: calc(100vh - 80px);
    position: relative;
    top: 80px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    z-index: 4; }
    @media screen and (max-width: 768px) {
      .mv_inner {
        height: calc(52vh - 54px);
        top: 0; } }
    .mv_inner h2 {
      position: absolute;
      right: 5%;
      bottom: calc(2vw + 80px);
      width: 34vw;
      z-index: 1; }
      @media screen and (min-width: 1400px) {
        .mv_inner h2 {
          width: 47vh; } }
      @media screen and (max-width: 768px) {
        .mv_inner h2 {
          width: 68vw;
          position: absolute;
          top: 60.5vh;
          bottom: auto;
          left: 50%;
          transform: translate(-50%, -50%);
          -webkit-transform: translate(-50%, -50%);
          -ms-transform: translate(-50%, -50%);
          animation: name duration linear delay iteration-count direction forwards; } }
    .mv_inner h3 {
      position: absolute;
      left: 12%;
      bottom: calc(10vw + 80px);
      width: 21vw;
      z-index: 3; }
      @media screen and (max-width: 768px) {
        .mv_inner h3 {
          width: 34vw;
          bottom: 8vh;
          left: 5%; } }
  .mv_person {
    width: 38vw;
    margin: 0 auto;
    position: fixed;
    top: 100px;
    left: 48%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    z-index: 2;
    opacity: 1; }
    .mv_person.is_active {
      opacity: 0; }
    @media screen and (max-width: 1000px) {
      .mv_person {
        width: 60vw; } }
    @media screen and (max-width: 768px) {
      .mv_person {
        top: 70px;
        width: 32vh; } }
  .mv_build {
    position: absolute;
    width: 100%;
    bottom: -2px;
    z-index: 2; }
    @media screen and (max-width: 768px) {
      .mv_build {
        bottom: -2vh; } }

@media (min-height: 1000px) {
  .mv_person {
    width: 62vh; } }
.underWrap {
  position: relative;
  z-index: 2;
  background-color: #d50d1c; }
  @media screen and (max-width: 768px) {
    .underWrap {
      background-color: #e60012; } }

.btnArea {
  padding-top: 100px; }
  @media screen and (max-width: 768px) {
    .btnArea {
      padding-top: 44vh; } }
  .btnArea_inner {
    display: flex;
    justify-content: center;
    align-items: flex-end;
    max-width: 888px;
    width: 90%;
    margin: 0 auto; }
  .btnArea_box {
    width: 27%;
    display: block;
    position: relative;
    cursor: pointer; }
    .btnArea_box:nth-of-type(n + 2) {
      margin-left: 9.5%; }
    .btnArea_box_inner {
      width: 100%;
      position: relative;
      transition-duration: 0.3s; }
      .btnArea_box_inner h3 {
        position: absolute;
        z-index: 1;
        width: 77.25%;
        top: -6%;
        left: -21%; }
        @media screen and (max-width: 768px) {
          .btnArea_box_inner h3 {
            width: 81.25%;
            top: -6%;
            left: -17%; } }
      .btnArea_box_inner .img {
        position: relative;
        z-index: 2; }
      .btnArea_box_inner .border {
        width: 100%;
        height: 100%;
        position: absolute;
        border: 1px solid #fff;
        top: 6px;
        left: 6px;
        transition-duration: 0.3s; }
      .btnArea_box_inner.btn01 {
        background: #226d83;
        background: linear-gradient(0deg, #226d83 0%, #51c4a9 65%, #71ffc3 100%); }
      .btnArea_box_inner.btn02 {
        background: #1da0ff;
        background: linear-gradient(0deg, #1da0ff 0%, #e30aff 100%); }
        .btnArea_box_inner.btn02 h3 {
          width: 74.25%;
          top: -5%;
          left: -16%; }
          @media screen and (max-width: 768px) {
            .btnArea_box_inner.btn02 h3 {
              width: 85.25%;
              top: -6%;
              left: -14%; } }
      .btnArea_box_inner.btn03 {
        background: #ffd336;
        background: linear-gradient(0deg, #ffd336 0%, #ff9315 100%); }
        .btnArea_box_inner.btn03 h3 {
          width: 74.25%;
          top: -5%;
          left: -30%; }
          @media screen and (max-width: 768px) {
            .btnArea_box_inner.btn03 h3 {
              width: 92.25%;
              top: -6%; } }
    .btnArea_box .moreDetail {
      margin-top: 20px;
      color: #fff;
      display: flex;
      justify-content: space-between;
      align-items: center;
      width: 102.5%; }
      @media screen and (max-width: 768px) {
        .btnArea_box .moreDetail {
          margin-top: 5vw;
          width: 106.5%; } }
      .btnArea_box .moreDetail_ttl .en {
        font-size: 2.0625em;
        font-family: "Oswald", sans-serif;
        line-height: 1; }
        @media screen and (max-width: 1000px) {
          .btnArea_box .moreDetail_ttl .en {
            font-size: 3vw; } }
      .btnArea_box .moreDetail_ttl .ja {
        font-size: 0.8125em; }
        @media screen and (max-width: 768px) {
          .btnArea_box .moreDetail_ttl .ja {
            font-size: 2vw; } }
      .btnArea_box .moreDetail_icon {
        position: relative;
        background: #000;
        display: block;
        width: 43px;
        height: 43px;
        text-indent: 100%;
        white-space: nowrap;
        overflow: hidden;
        transition-duration: 0.3s; }
        @media screen and (max-width: 768px) {
          .btnArea_box .moreDetail_icon {
            width: 6vw;
            height: 6vw; } }
        .btnArea_box .moreDetail_icon::before {
          display: block;
          content: "";
          background-color: #fff;
          position: absolute;
          width: 1px;
          height: 27px;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%) rotate(0);
          transition-duration: 0.3s; }
          @media screen and (max-width: 768px) {
            .btnArea_box .moreDetail_icon::before {
              height: 4vw; } }
        .btnArea_box .moreDetail_icon::after {
          display: block;
          content: "";
          background-color: #fff;
          position: absolute;
          width: 27px;
          height: 1px;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%) rotate(0);
          transition-duration: 0.3s; }
          @media screen and (max-width: 768px) {
            .btnArea_box .moreDetail_icon::after {
              width: 4vw; } }
    .btnArea_box:hover {
      opacity: 1; }
      .btnArea_box:hover .btnArea_box_inner {
        transform: translate(6px, 6px); }
        .btnArea_box:hover .btnArea_box_inner .border {
          transform: translate(-6px, -6px); }
      .btnArea_box:hover .moreDetail_icon {
        background-color: #fff; }
      .btnArea_box:hover .moreDetail_icon::before {
        top: 52%;
        left: 73%;
        transform: translate(-50%, -50%) rotate(120deg);
        background-color: transparent;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 5px 0 5px 8.66px;
        border-color: transparent transparent transparent #000; }
        @media screen and (max-width: 768px) {
          .btnArea_box:hover .moreDetail_icon::before {
            border-width: 1vw 0 1vw 1.5vw; } }
      .btnArea_box:hover .moreDetail_icon::after {
        transform: translate(-50%, -50%) rotate(180deg);
        background-color: #000; }

.secLink {
  padding-top: 140px; }
  @media screen and (max-width: 768px) {
    .secLink {
      padding-top: 22vw;
      position: relative; } }
  .secLink_bg {
    width: 100%;
    height: 100vh;
    position: sticky;
    top: -40px;
    left: 0;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center; }
    @media screen and (max-width: 768px) {
      .secLink_bg {
        top: -54px;
        height: 200vh; } }
    .secLink_bg .gradeBottom {
      position: absolute;
      bottom: -40px;
      width: 100%;
      height: 200px;
      background-color: #000; }
    .secLink_bg.sec01 {
      background-image: url(../img/top/sec01_bg.png);
      z-index: 1; }
      @media screen and (max-width: 768px) {
        .secLink_bg.sec01 {
          background-image: url(../img/top/sec01_bg_sp.png); } }
      .secLink_bg.sec01 .gradeBottom {
        background: #247084;
        background: linear-gradient(0deg, #247084 0%, #3fa29a 30%, rgba(66, 168, 157, 0) 100%); }
    .secLink_bg.sec02 {
      background-image: url(../img/top/sec02_bg.png);
      z-index: 2; }
      @media screen and (max-width: 768px) {
        .secLink_bg.sec02 {
          background-image: url(../img/top/sec02_bg_sp.png); } }
      @media screen and (max-width: 768px) {
        .secLink_bg.sec02 .secLink_inner {
          top: 18vh; } }
      .secLink_bg.sec02 .secLink_inner_person .person {
        width: 126%; }
        @media screen and (max-width: 768px) {
          .secLink_bg.sec02 .secLink_inner_person .person {
            width: 45vh; } }
      .secLink_bg.sec02 .secLink_inner_person .copy {
        top: 47%; }
      .secLink_bg.sec02 .secLink_inner_txtArea {
        margin-top: -10vh; }
      .secLink_bg.sec02 .gradeBottom {
        background: #5a72ff;
        background: linear-gradient(0deg, #5a72ff 0%, #209fff 55%, rgba(77, 125, 255, 0) 100%); }
    .secLink_bg.sec03 {
      background-image: url(../img/top/sec03_bg.png);
      z-index: 3; }
      @media screen and (max-width: 768px) {
        .secLink_bg.sec03 {
          background-image: url(../img/top/sec03_bg_sp.png); } }
      .secLink_bg.sec03 .secLink_inner_person .person {
        width: 65.2%;
        top: 24%; }
        @media screen and (max-width: 1000px) {
          .secLink_bg.sec03 .secLink_inner_person .person {
            width: 90.2%; } }
        @media screen and (max-width: 768px) {
          .secLink_bg.sec03 .secLink_inner_person .person {
            top: 2vh;
            width: 32vh; } }
      .secLink_bg.sec03 .secLink_inner_person .copy {
        top: 40%;
        width: 106%; }
        @media screen and (max-width: 768px) {
          .secLink_bg.sec03 .secLink_inner_person .copy {
            width: 92%; } }
      .secLink_bg.sec03 .secLink_inner_txtArea {
        margin-top: -2vh; }
      .secLink_bg.sec03 .gradeBottom {
        background: #ff9315;
        background: linear-gradient(0deg, #ff9315 0%, #ffd336 60%, rgba(255, 211, 54, 0) 100%); }
  .secLink_inner {
    max-width: 1000px;
    width: 90%;
    margin: 0 auto;
    display: flex;
    align-items: center;
    height: calc(100vh - 80px);
    overflow: hidden;
    position: relative;
    top: 80px; }
    @media screen and (max-width: 768px) {
      .secLink_inner {
        flex-direction: column;
        width: 100%;
        height: calc(100vh - 54px);
        top: 16vh; } }
    .secLink_inner_person {
      width: 50%;
      height: 100%;
      position: relative; }
      @media screen and (max-width: 768px) {
        .secLink_inner_person {
          width: 100%;
          height: auto;
          z-index: 1; } }
      .secLink_inner_person .person {
        position: absolute;
        top: 19%;
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        width: 66%; }
        @media screen and (min-width: 1400px) {
          .secLink_inner_person .person {
            width: 80%; } }
        @media screen and (max-width: 768px) {
          .secLink_inner_person .person {
            position: relative;
            width: 22vh;
            margin: 0 auto;
            transform: none;
            top: auto;
            left: auto; } }
      .secLink_inner_person .copy {
        width: 75.4%;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%); }
        @media screen and (min-width: 1400px) {
          .secLink_inner_person .copy {
            width: 90%; } }
        @media screen and (max-width: 768px) {
          .secLink_inner_person .copy {
            position: absolute;
            top: 46%;
            left: 50%;
            transform: translate(-50%, -50%);
            -webkit-transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%); } }
    .secLink_inner_txtArea {
      width: 50%;
      color: #fff;
      padding-left: 9%; }
      @media screen and (max-width: 768px) {
        .secLink_inner_txtArea {
          padding-left: 0;
          width: 100%;
          text-align: center;
          margin-top: -16vh;
          z-index: 2; } }
      .secLink_inner_txtArea h4 {
        font-size: 1.875em;
        font-weight: bold; }
        @media screen and (max-width: 1000px) {
          .secLink_inner_txtArea h4 {
            font-size: 3.5vw; } }
        @media screen and (max-width: 768px) {
          .secLink_inner_txtArea h4 {
            font-size: 8.5vw;
            line-height: 1.4; } }
      .secLink_inner_txtArea .txt {
        font-size: 0.9375em;
        font-weight: 500;
        line-height: 1.8;
        margin-top: 20px; }
        @media screen and (max-width: 768px) {
          .secLink_inner_txtArea .txt {
            margin-top: 4vw;
            font-size: 3.5vw; } }
      .secLink_inner_txtArea .detailBtn {
        margin-top: 4.375em; }
        @media screen and (max-width: 768px) {
          .secLink_inner_txtArea .detailBtn {
            margin-top: 8vw;
            position: relative;
            z-index: 3; } }
        .secLink_inner_txtArea .detailBtn a {
          color: #fff;
          background-color: #000;
          padding: 0.15em 1em 0.2em 0.8em;
          font-size: 1.5625em;
          font-weight: 400;
          letter-spacing: -0.01em;
          font-family: "Oswald", sans-serif;
          border-radius: 115px;
          width: 54.64%;
          display: block;
          position: relative; }
          @media screen and (max-width: 1000px) {
            .secLink_inner_txtArea .detailBtn a {
              width: 74%; } }
          @media screen and (max-width: 768px) {
            .secLink_inner_txtArea .detailBtn a {
              width: 64%;
              margin: 0 auto;
              text-align: left;
              padding: 0.15em 1em 0.2em 1.2em;
              font-size: 6vw; } }
          .secLink_inner_txtArea .detailBtn a::after {
            position: absolute;
            top: 50%;
            right: 8%;
            transform: translateY(-50%);
            -webkit-transform: translateY(-50%);
            -ms-transform: translateY(-50%);
            content: "";
            display: inline-block;
            width: 0;
            height: 0;
            border-style: solid;
            border-width: 8px 0 8px 10px;
            border-color: transparent transparent transparent #fff; }

.footCopy {
  overflow-y: auto;
  width: 100%;
  height: auto;
  position: sticky;
  top: 80px;
  left: 0;
  z-index: 5; }
  @media screen and (max-width: 768px) {
    .footCopy {
      top: 0;
      position: relative; } }
  .footCopy .build {
    position: relative;
    bottom: -2px; }
  .footCopy_color {
    background-color: #d50d1c; }
  .footCopy_inner {
    position: relative;
    max-width: 1000px;
    width: 90%;
    margin: 0 auto; }
    @media screen and (max-width: 1000px) {
      .footCopy_inner {
        padding-top: 7vw; } }
    .footCopy_inner_img {
      max-width: 402px;
      width: 90%;
      margin: 0 auto;
      transform: translateX(-42%); }
    .footCopy_inner_copy {
      position: absolute;
      top: 50%;
      right: 0%;
      transform: translateY(-50%);
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%); }
