@charset "UTF-8";
#global-header {
  position: relative;
  z-index: 10;
  padding: 16px; }
  #global-header.top {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%; }
  #global-header .inner {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center; }
    #global-header .inner h1 {
      width: 280px; }
      @media screen and (max-width: 1024px) {
        #global-header .inner h1 {
          width: 180px;
          padding: 0; } }
      @media screen and (max-width: 768px) {
        #global-header .inner h1 {
          padding: 0 0 0 12px;
          width: 160px; } }
      @media screen and (max-width: 480px) {
        #global-header .inner h1 {
          width: 150px;
          padding: 0; } }
      #global-header .inner h1 a {
        display: inline-block; }
        #global-header .inner h1 a img {
          width: 100%;
          height: auto;
          vertical-align: bottom; }
    #global-header .inner #global-navi {
      width: 100%; }
      @media screen and (max-width: 1240px) {
        #global-header .inner #global-navi {
          width: 70%; } }
      @media screen and (max-width: 1024px) {
        #global-header .inner #global-navi {
          display: none; } }
      #global-header .inner #global-navi ul {
        width: 70%;
        max-width: 900px;
        margin-left: auto;
        display: flex;
        justify-content: flex-end;
        flex: 1; }
        @media screen and (max-width: 1366px) {
          #global-header .inner #global-navi ul {
            width: 90%; } }
        @media screen and (max-width: 1240px) {
          #global-header .inner #global-navi ul {
            width: 100%; } }
        #global-header .inner #global-navi ul li {
          width: 100%; }
          #global-header .inner #global-navi ul li a {
            color: #010629;
            width: 100%;
            font-size: 1.4rem;
            font-weight: bold;
            display: inline-block;
            letter-spacing: 0.05em;
            transition: all 0.5s ease;
            text-align: center;
            padding: 8px 0; }
            #global-header .inner #global-navi ul li a:hover {
              color: #2976e1;
              background: #f6f6f6; }
        #global-header .inner #global-navi ul li.org_btn a {
          color: #ffffff;
          background: #2976e1;
          border-radius: 2em; }
          #global-header .inner #global-navi ul li.org_btn a:hover {
            background: #0e274b;
            border-radius: 0; }
          #global-header .inner #global-navi ul li.org_btn a img {
            display: inline-block;
            margin-right: 10px;
            position: relative;
            top: 2px; }

@media screen and (max-width: 480px) {
  .key-visual .inner .key_pic {
    display: none; } }
.key-visual .inner .key_pic img {
  width: 100%;
  height: auto;
  vertical-align: bottom; }
.key-visual .inner .key_pic_sp {
  display: none; }
  @media screen and (max-width: 480px) {
    .key-visual .inner .key_pic_sp {
      display: block; } }
  .key-visual .inner .key_pic_sp img {
    width: 100%;
    height: auto;
    vertical-align: bottom; }

.sub-key-visual .inner {
  width: 100%;
  height: 364px;
  position: relative; }
  @media screen and (max-width: 768px) {
    .sub-key-visual .inner {
      height: 264px; } }
  @media screen and (max-width: 480px) {
    .sub-key-visual .inner {
      height: 204px; } }
  .sub-key-visual .inner .key_txt {
    width: 35%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    display: grid;
    place-items: center; }
    @media screen and (max-width: 480px) {
      .sub-key-visual .inner .key_txt {
        left: 16px; } }
    .sub-key-visual .inner .key_txt h2 {
      font-size: 3.8rem;
      font-weight: bold;
      color: #010629;
      font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif"; }
      @media screen and (max-width: 768px) {
        .sub-key-visual .inner .key_txt h2 {
          font-size: 3.2rem;
          line-height: 1.2em; } }
      @media screen and (max-width: 480px) {
        .sub-key-visual .inner .key_txt h2 {
          font-size: 2.4rem; } }
    .sub-key-visual .inner .key_txt p {
      color: #96979c;
      font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
      font-size: 2.8rem; }
      @media screen and (max-width: 768px) {
        .sub-key-visual .inner .key_txt p {
          font-size: 2rem; } }
  .sub-key-visual .inner .key_pic {
    width: 100%;
    text-align: right;
    position: relative;
    z-index: 1; }
    @media screen and (max-width: 768px) {
      .sub-key-visual .inner .key_pic img.sp {
        width: 70%;
        margin: 0 0 0 auto; } }
    @media screen and (max-width: 480px) {
      .sub-key-visual .inner .key_pic img.sp {
        width: 60%; } }
    @media screen and (max-width: 415px) {
      .sub-key-visual .inner .key_pic img.sp {
        width: 58%; } }

html {
  scroll-behavior: smooth; }

#wrap {
  overflow: hidden; }

@media screen and (max-width: 480px) {
  img.pc {
    display: none; } }

img.sp {
  display: none; }
  @media screen and (max-width: 480px) {
    img.sp {
      width: 100%;
      display: block; } }

.page-header {
  margin-bottom: 0px; }
  @media screen and (max-width: 768px) {
    .page-header {
      margin-bottom: 12px; } }
  .page-header h2 {
    text-align: center;
    font-size: 12rem;
    padding-bottom: 8px;
    font-family: "neon";
    color: #f7f7f7;
    text-shadow: 0 0 20px rgba(255, 255, 255, 0.3), 0 0 10px rgba(255, 255, 255, 0.9);
    font-weight: normal; }
    @media screen and (max-width: 1024px) {
      .page-header h2 {
        font-size: 8rem; } }
    @media screen and (max-width: 768px) {
      .page-header h2 {
        font-size: 6rem; } }
    @media screen and (max-width: 480px) {
      .page-header h2 {
        font-size: 5rem; } }

.title-vertical h2 {
  text-align: center;
  font-size: 2.5rem;
  line-height: 2em;
  padding-bottom: 8px;
  position: relative;
  font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  color: #1a1a1a;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl; }
  .title-vertical h2::before {
    content: "";
    background: url("../images/gallery-txt.svg") no-repeat;
    width: 96px;
    height: 630px;
    background-size: contain;
    position: absolute;
    top: 0;
    right: 16px; }
    @media screen and (max-width: 768px) {
      .title-vertical h2::before {
        width: 75px;
        height: 450px; } }
    @media screen and (max-width: 480px) {
      .title-vertical h2::before {
        width: 80px;
        height: 500px; } }
    @media screen and (max-width: 375px) {
      .title-vertical h2::before {
        width: 70px;
        height: 400px; } }
    @media screen and (max-width: 320px) {
      .title-vertical h2::before {
        width: 60px;
        height: 330px; } }
  @media screen and (max-width: 480px) {
    .title-vertical h2 {
      font-size: 1.7rem; } }
  @media screen and (max-width: 375px) {
    .title-vertical h2 {
      font-size: 1.5rem; } }

.title-left {
  margin: 80px 0; }
  @media screen and (max-width: 480px) {
    .title-left {
      margin: 40px 0; } }
  .title-left::after {
    content: '';
    background: url("../images/title-line.png") repeat-x;
    display: block;
    height: 10px; }
  .title-left h2 {
    text-align: left;
    line-height: 2.5em;
    padding-bottom: 8px; }
    @media screen and (max-width: 480px) {
      .title-left h2 {
        line-height: 2em; } }
    .title-left h2 span.en {
      font-size: .9em;
      text-align: left;
      font-family: "Fjalla One", sans-serif;
      color: #2976e1; }
    .title-left h2 strong.ja {
      color: #2976e1;
      text-align: left;
      font-size: 2em;
      letter-spacing: .05em;
      font-family: "Fjalla One", sans-serif;
      line-height: .3em;
      font-weight: bold; }
      @media screen and (max-width: 480px) {
        .title-left h2 strong.ja {
          font-size: 1.6em; } }
  .title-left p {
    width: 50%;
    text-align: left;
    margin: 20px auto 0 auto;
    font-size: 1.4em;
    line-height: 2em; }
    @media screen and (max-width: 480px) {
      .title-left p {
        width: 80%; } }

.common-width {
  width: 1240px;
  margin: 0 auto; }
  @media screen and (max-width: 1366px) {
    .common-width {
      width: 1080px; } }
  @media screen and (max-width: 1240px) {
    .common-width {
      width: 80%; } }
  @media screen and (max-width: 1024px) {
    .common-width {
      width: 80%; } }
  @media screen and (max-width: 768px) {
    .common-width {
      width: 90%; } }

.common-ma {
  padding: 120px 0 0 0; }
  @media screen and (max-width: 768px) {
    .common-ma {
      padding: 96px 0 0 0; } }
  @media screen and (max-width: 480px) {
    .common-ma {
      padding: 80px 0 0 0; } }

/*---------------ボタン---------------*/
a.btn {
  display: flex;
  align-items: center;
  text-align: center;
  margin: 80px auto 0 auto;
  padding: 10px 100px;
  border: 1px solid #1a1a1a;
  font-size: 1.2rem;
  transition: all ease .5s; }
  a.btn:hover {
    background: rgba(255, 255, 255, 0.5); }
  @media screen and (max-width: 480px) {
    a.btn {
      margin: 40px auto 0 auto; } }

/*---------------animation---------------*/
/*---スクロール時遅れて表示、順番に表示---*/
.fadein {
  opacity: 0;
  transition: all 1.3s; }

/*---TOP遅れて表示---*/
.post {
  opacity: 0; }

.post2 {
  opacity: 0;
  transition: all 1.3s; }

.anchor {
  display: block;
  padding-top: 70px;
  margin-top: -70px; }

.cta {
  width: 100%;
  height: 350px;
  background: url(../images/cta_bg.png) no-repeat;
  background-size: cover;
  padding: 40px 0; }
  .cta .inner {
    width: 1024px;
    height: 100%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center; }
    @media screen and (max-width: 1240px) {
      .cta .inner {
        width: 90%; } }
    @media screen and (max-width: 768px) {
      .cta .inner {
        flex-direction: column; } }
    .cta .inner .in_left {
      width: 50%;
      height: 100%;
      display: grid;
      place-items: center;
      border-right: 2px solid #989898; }
      @media screen and (max-width: 768px) {
        .cta .inner .in_left {
          width: 100%;
          border-right: none;
          border-bottom: 1px solid #989898;
          padding-bottom: 24px; } }
    .cta .inner .in_right {
      width: 50%;
      height: 100%;
      display: grid;
      place-items: center; }
      @media screen and (max-width: 768px) {
        .cta .inner .in_right {
          width: 100%;
          padding-top: 24px; } }
    .cta .inner .in_box {
      text-align: center; }
      .cta .inner .in_box h3 {
        color: #fff;
        font-weight: bold;
        font-size: 3.2rem;
        margin-bottom: 20px; }
        @media screen and (max-width: 480px) {
          .cta .inner .in_box h3 {
            margin-bottom: 12px; } }
      .cta .inner .in_box .entry_btn {
        text-align: center;
        display: inline-block;
        background: #007aff;
        color: #fff;
        font-size: 2.1rem;
        font-weight: bold;
        padding: 12px 0px;
        width: 300px;
        border-radius: 2em;
        transition: all ease .5s; }
        @media screen and (max-width: 768px) {
          .cta .inner .in_box .entry_btn {
            font-weight: bold;
            padding: 8px 0px;
            width: 200px; } }
        .cta .inner .in_box .entry_btn:hover {
          background: #75a5e7; }
      .cta .inner .in_box .contact_btn {
        text-align: center;
        display: inline-block;
        background: #8c8c8c;
        color: #fff;
        font-size: 2.1rem;
        font-weight: bold;
        padding: 12px 0px;
        width: 300px;
        border-radius: 2em;
        transition: all ease .5s; }
        @media screen and (max-width: 768px) {
          .cta .inner .in_box .contact_btn {
            font-weight: bold;
            padding: 8px 0px;
            width: 200px; } }
        .cta .inner .in_box .contact_btn:hover {
          background: #ababab; }

#global-footer {
  position: relative;
  padding: 40px 0 0 0; }
  #global-footer .footer-inner {
    max-width: 1400px;
    width: 100%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between; }
    @media screen and (max-width: 1500px) {
      #global-footer .footer-inner {
        width: 80%; } }
    @media screen and (max-width: 768px) {
      #global-footer .footer-inner {
        width: 90%; } }
    #global-footer .footer-inner .f_left .f_left_inner h2 {
      margin-bottom: 16px; }
      @media screen and (max-width: 480px) {
        #global-footer .footer-inner .f_left .f_left_inner h2 {
          width: 200px; }
          #global-footer .footer-inner .f_left .f_left_inner h2 img {
            width: 100%; } }
    #global-footer .footer-inner .f_left .f_left_inner .comp_add {
      color: #010629;
      font-size: 1.2rem; }
    #global-footer .footer-inner .navibox {
      width: 700px;
      align-items: center;
      display: grid; }
      @media screen and (max-width: 1024px) {
        #global-footer .footer-inner .navibox {
          align-items: flex-end; } }
      #global-footer .footer-inner .navibox .inner {
        display: flex;
        justify-content: flex-end; }
        @media screen and (max-width: 1024px) {
          #global-footer .footer-inner .navibox .inner {
            display: none; } }
        #global-footer .footer-inner .navibox .inner ul {
          display: flex;
          justify-content: space-around;
          flex: 1;
          align-items: center; }
          #global-footer .footer-inner .navibox .inner ul li {
            width: 100%;
            text-align: center; }
            #global-footer .footer-inner .navibox .inner ul li a {
              display: inline-block;
              width: 100%;
              font-size: 1.4rem;
              font-weight: bold;
              padding: 12px 0;
              transition: all .6s ease; }
              #global-footer .footer-inner .navibox .inner ul li a:hover {
                color: #2976e1;
                background: #f7f7f7; }
      #global-footer .footer-inner .navibox .copy_small {
        text-align: right; }
        #global-footer .footer-inner .navibox .copy_small small {
          color: #010629; }

#container {
  min-height: 200px;
  padding: 120px 0 0; }
  @media screen and (max-width: 768px) {
    #container {
      padding: 40px 0 0; } }
  @media screen and (max-width: 480px) {
    #container {
      padding: 0; } }

.message {
  background: url(../recruit/images/recinfo_bg.png) no-repeat;
  background-size: cover;
  width: 100%;
  height: 630px;
  margin-bottom: 120px; }
  @media screen and (max-width: 768px) {
    .message {
      background: none;
      height: auto;
      margin-bottom: 80px; } }
  @media screen and (max-width: 480px) {
    .message {
      margin-bottom: 60px; } }
  .message .inner {
    width: 680px;
    margin: 0 auto;
    padding: 80px 0; }
    @media screen and (max-width: 1024px) {
      .message .inner {
        width: 90%; } }
    @media screen and (max-width: 768px) {
      .message .inner {
        padding: 0; } }
    .message .inner .title {
      font-size: 3.2rem;
      font-weight: bold;
      color: #007aff;
      margin-bottom: 40px; }
      @media screen and (max-width: 768px) {
        .message .inner .title {
          font-size: 2.6rem; } }
      @media screen and (max-width: 480px) {
        .message .inner .title {
          margin-bottom: 24px;
          font-size: 2rem; } }
    .message .inner .body {
      font-size: 2.1rem;
      line-height: 1.8;
      letter-spacing: .08em; }
      @media screen and (max-width: 480px) {
        .message .inner .body {
          font-size: 1.6rem; } }

.rec_info {
  margin-bottom: 120px; }
  @media screen and (max-width: 768px) {
    .rec_info {
      margin-bottom: 40px; } }
  .rec_info .content-header {
    margin-bottom: 40px; }
    @media screen and (max-width: 480px) {
      .rec_info .content-header {
        margin-bottom: 24px; } }
    .rec_info .content-header h2 {
      text-align: center;
      font-size: 2.8rem;
      font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif"; }
    .rec_info .content-header .desc {
      text-align: center;
      font-size: 1.8rem;
      color: #96979c;
      font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif"; }
  .rec_info .inner {
    width: 680px;
    margin: 0 auto; }
    @media screen and (max-width: 768px) {
      .rec_info .inner {
        width: 90%; } }
    .rec_info .inner dl {
      margin-bottom: 40px; }
      .rec_info .inner dl div {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        padding: 28px 0;
        border-bottom: 1px solid #01b3de; }
        @media screen and (max-width: 768px) {
          .rec_info .inner dl div {
            flex-direction: column;
            padding: 16px 0; } }
        @media screen and (max-width: 480px) {
          .rec_info .inner dl div {
            flex-direction: column;
            padding: 12px 0; } }
        .rec_info .inner dl div:nth-child(1) {
          border-top: 1px solid #01b3de; }
        .rec_info .inner dl div dt {
          width: 25%;
          font-size: 1.6rem; }
          @media screen and (max-width: 768px) {
            .rec_info .inner dl div dt {
              width: 100%;
              font-weight: bold; } }
        .rec_info .inner dl div dd {
          width: 75%;
          font-size: 1.6rem; }
          @media screen and (max-width: 768px) {
            .rec_info .inner dl div dd {
              width: 100%; } }
    .rec_info .inner .title {
      text-align: center;
      margin-bottom: 40px; }
      .rec_info .inner .title img {
        width: 100%; }
    .rec_info .inner .btn {
      text-align: center; }
      .rec_info .inner .btn a {
        display: inline-block;
        background: #007aff;
        color: #fff;
        font-size: 4rem;
        font-weight: bold;
        border-radius: 2em;
        padding: 12px 100px; }
        @media screen and (max-width: 480px) {
          .rec_info .inner .btn a {
            font-size: 3rem;
            padding: 6px 80px; } }