@charset "UTF-8";
/* クリアフィックス
-----------------------------------------------------------------*/
.careersSection_box, .projectSection_box, .systemSection_box {
  zoom: 1; }
  .careersSection_box:before, .projectSection_box:before, .systemSection_box:before, .careersSection_box:after, .projectSection_box:after, .systemSection_box:after {
    position: static;
    display: block;
    height: 0;
    visibility: hidden;
    content: "\0020"; }
  .careersSection_box:after, .projectSection_box:after, .systemSection_box:after {
    clear: both; }

/* カラー定義
-----------------------------------------------------------------*/
/* easing定義
-----------------------------------------------------------------*/
/* 共通fontスタイル
-----------------------------------------------------------------*/
.section_title .en {
  font-family: 'Montserrat','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro', '游ゴシック', YuGothic, Yu Gothic, 'メイリオ',Meiryo, "ＭＳ ゴシック", sans-serif; }

.introSection_content, .messageSection_comment {
  line-height: 2; }

/* パーツ・ボタン スタイル
-----------------------------------------------------------------*/
.introSection_caption {
  font-weight: bold;
  font-size: 32px;
  line-height: 2;
  letter-spacing: 0.1em; }
  @media only screen and (max-width: 767px) {
    .introSection_caption {
      font-size: 21px;
      line-height: 1.8; } }
  .introSection_caption span {
    padding: 0 0 5px;
    border-bottom: 2px solid #000; }
    html.ie .introSection_caption span {
      padding: 0; }
    @media only screen and (max-width: 767px) {
      .introSection_caption span {
        padding: 0 0 2px;
        border-bottom: 1px solid #000; } }

.section_title {
  margin-bottom: 78px; }
  @media only screen and (max-width: 767px) {
    .section_title {
      margin-bottom: 42px; } }
  .section_title span {
    font-weight: bold;
    display: block; }
  .section_title .jp {
    font-size: 70px;
    letter-spacing: .1em;
    line-height: 1.1; }
    @media only screen and (max-width: 767px) {
      .section_title .jp {
        font-size: 42px; } }
  .section_title .en {
    margin-top: 12px;
    font-size: 28px;
    font-weight: 700;
    letter-spacing: .15em;
    color: #041978; }
    @media only screen and (max-width: 767px) {
      .section_title .en {
        margin-top: 8px;
        font-size: 18px; } }

@-webkit-keyframes hoverAnime {
  0% {
    -webkit-transform: translate(-100%, 0);
    transform: translate(-100%, 0); }
  50% {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0); }
  100% {
    -webkit-transform: translate(100%, 0);
    transform: translate(100%, 0); } }

@keyframes hoverAnime {
  0% {
    -webkit-transform: translate(-100%, 0);
    transform: translate(-100%, 0); }
  50% {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0); }
  100% {
    -webkit-transform: translate(100%, 0);
    transform: translate(100%, 0); } }

@-webkit-keyframes hoverFontColor {
  0% {
    color: #fff; }
  50% {
    color: #313131; }
  100% {
    color: #fff; } }

@keyframes hoverFontColor {
  0% {
    color: #fff; }
  50% {
    color: #313131; }
  100% {
    color: #fff; } }

@-webkit-keyframes hoverBgColor {
  0% {
    background-color: #fff; }
  50% {
    background-color: #313131; }
  100% {
    background-color: #fff; } }

@keyframes hoverBgColor {
  0% {
    background-color: #fff; }
  50% {
    background-color: #313131; }
  100% {
    background-color: #fff; } }

@-webkit-keyframes hoverImgColor {
  0% {
    background-image: url(../img/common/arrow_left.svg); }
  50% {
    background-image: url(../img/common/arrow_left_grey.svg); }
  100% {
    background-image: url(../img/common/arrow_left.svg); } }

@keyframes hoverImgColor {
  0% {
    background-image: url(../img/common/arrow_left.svg); }
  50% {
    background-image: url(../img/common/arrow_left_grey.svg); }
  100% {
    background-image: url(../img/common/arrow_left.svg); } }

.messageSection_toList a, .interviewSection_toList a, .careersSection_toList a, .projectSection_toList a, .systemSection_toList a, .messageSection_button a {
  overflow: hidden;
  text-align: left;
  background-color: #313131;
  display: inline-block;
  width: 374px;
  padding: 40px 34px;
  color: #fff;
  font-size: 20px;
  font-weight: bold;
  position: relative;
  box-shadow: -1.8px 7.8px 21.3px 5.7px rgba(2, 2, 2, 0.2); }
  @media only screen and (max-width: 767px) {
    .messageSection_toList a, .interviewSection_toList a, .careersSection_toList a, .projectSection_toList a, .systemSection_toList a, .messageSection_button a {
      width: auto;
      padding: 30px 30px 30px 20px;
      font-size: 18px; } }
  .messageSection_toList a:before, .interviewSection_toList a:before, .careersSection_toList a:before, .projectSection_toList a:before, .systemSection_toList a:before, .messageSection_button a:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
    -webkit-transform: translate(-100%, 0);
    -ms-transform: translate(-100%, 0);
    transform: translate(-100%, 0); }
  .messageSection_toList a:after, .interviewSection_toList a:after, .careersSection_toList a:after, .projectSection_toList a:after, .systemSection_toList a:after, .messageSection_button a:after {
    content: "";
    width: 14px;
    height: 16px;
    position: absolute;
    right: 28px;
    bottom: 42px;
    background-image: url(../img/common/arrow_left.svg);
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 14px auto; }
    @media only screen and (max-width: 767px) {
      .messageSection_toList a:after, .interviewSection_toList a:after, .careersSection_toList a:after, .projectSection_toList a:after, .systemSection_toList a:after, .messageSection_button a:after {
        right: 20px;
        bottom: 0;
        width: 12px;
        height: 100%;
        background-size: 12px auto; } }
  .messageSection_toList a span, .interviewSection_toList a span, .careersSection_toList a span, .projectSection_toList a span, .systemSection_toList a span, .messageSection_button a span, .messageSection_toList a div, .interviewSection_toList a div, .careersSection_toList a div, .projectSection_toList a div, .systemSection_toList a div, .messageSection_button a div {
    position: relative; }
  @media only screen and (min-width: 1025px) {
    .messageSection_toList a:hover:before, .interviewSection_toList a:hover:before, .careersSection_toList a:hover:before, .projectSection_toList a:hover:before, .systemSection_toList a:hover:before, .messageSection_button a:hover:before {
      -webkit-animation: hoverAnime 1s ease-in-out 1 alternate;
      animation: hoverAnime 1s ease-in-out 1 alternate; }
    .messageSection_toList a:hover:after, .interviewSection_toList a:hover:after, .careersSection_toList a:hover:after, .projectSection_toList a:hover:after, .systemSection_toList a:hover:after, .messageSection_button a:hover:after {
      -webkit-animation: hoverImgColor 1s ease-in-out 1 alternate;
      animation: hoverImgColor 1s ease-in-out 1 alternate; }
    .messageSection_toList a:hover *, .interviewSection_toList a:hover *, .careersSection_toList a:hover *, .projectSection_toList a:hover *, .systemSection_toList a:hover *, .messageSection_button a:hover * {
      -webkit-animation: hoverFontColor 1s ease-in-out 1 alternate;
      animation: hoverFontColor 1s ease-in-out 1 alternate; }
    .messageSection_toList a:hover .messageSection_comment:before, .interviewSection_toList a:hover .messageSection_comment:before, .careersSection_toList a:hover .messageSection_comment:before, .projectSection_toList a:hover .messageSection_comment:before, .systemSection_toList a:hover .messageSection_comment:before, .messageSection_button a:hover .messageSection_comment:before {
      -webkit-animation: hoverBgColor 1s ease-in-out 1 alternate;
      animation: hoverBgColor 1s ease-in-out 1 alternate; } }
  .messageSection_toList a:active, .interviewSection_toList a:active, .careersSection_toList a:active, .projectSection_toList a:active, .systemSection_toList a:active, .messageSection_button a:active {
    -webkit-transform: translate(-2px, 2px);
    -ms-transform: translate(-2px, 2px);
    transform: translate(-2px, 2px);
    box-shadow: -1.8px 7.8px 21.3px 1px rgba(2, 2, 2, 0.2); }

.messageSection_toList a, .interviewSection_toList a, .careersSection_toList a, .projectSection_toList a, .systemSection_toList a {
  display: inline-block;
  background-color: #101177; }

/* ページ下部動線
-----------------------------------------------------------------*/
.companySection .pageLink_list {
  width: 100%; }
  @media only screen and (min-width: 768px) {
    .companySection .pageLink_list {
      display: table; } }

.companySection .pageLink_node {
  position: relative;
  text-align: center;
  overflow: hidden; }
  @media only screen and (min-width: 768px) {
    .companySection .pageLink_node {
      display: table-cell; } }
  @media only screen and (max-width: 767px) {
    .companySection .pageLink_node {
      margin-bottom: 15px; } }
  @media only screen and (min-width: 1025px) {
    .companySection .pageLink_node:hover img {
      opacity: .8;
      -webkit-transform: scale(1.1);
      -ms-transform: scale(1.1);
      transform: scale(1.1); } }
  .companySection .pageLink_node a {
    display: block; }
  .companySection .pageLink_node img {
    width: 100%;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    transition: 800ms ease; }

.companySection .pageLink_label {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  width: 100%;
  height: 100%;
  color: #041978;
  font-size: 24px;
  font-weight: bold; }
  @media only screen and (max-width: 767px) {
    .companySection .pageLink_label {
      font-size: 22px; } }

.companySection .pageLink_labelInner {
  display: table;
  width: 100%;
  height: 100%; }
  .companySection .pageLink_labelInner span {
    display: table-cell;
    vertical-align: middle;
    line-height: 1.2;
    text-shadow: 1px 0.5px 0px #fff; }

/* COVER
-----------------------------------------------------------------*/
.cover {
  background-color: #fff;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: table;
  text-align: center;
  z-index: 2000; }

.coverInner {
  display: table-cell;
  vertical-align: middle; }
  @media only screen and (max-width: 767px) {
    .coverInner {
      display: none; } }
  .coverInner svg {
    fill: #04197C;
    width: 810px;
    height: 220px;
    margin: 0 auto; }

/* MAINVISUAL
-----------------------------------------------------------------*/
.mainvisual {
  position: relative;
  z-index: 10;
  width: 100%;
  height: 100%;
  text-align: center;
  overflow: hidden; }
  @media only screen and (max-width: 767px) {
    .mainvisual {
      height: auto;
      padding-bottom: 100%;
      background-image: url(../img/top/mainvisual_sp.jpg);
      background-repeat: no-repeat;
      background-position: center;
      background-size: cover; } }

.movieBg_box {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0; }
  @media only screen and (max-width: 767px) {
    .movieBg_box {
      display: none; } }

.movieBg_cover {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 1;
  background-color: #000;
  mix-blend-mode: multiply;
  transition: 2s ease-in-out; }
  .movieBg_cover.hide {
    opacity: 0; }
  @media only screen and (max-width: 767px) {
    .movieBg_cover {
      display: none; } }
  .movieBg_cover .ieFallback {
    visibility: hidden;
    opacity: 0;
    width: 100%;
    height: 100%;
    background-image: url(../img/ogimg.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover; }
    .mainvisual.active .movieBg_cover .ieFallback {
      visibility: visible;
      opacity: 1;
      transition: opacity 1s ease; }
    html.touch .movieBg_cover .ieFallback {
      visibility: visible;
      opacity: 1;
      transition: opacity 1s ease;
      background-image: url(../img/top/mainvisual_sp.jpg); }

html.touch #js-youtubePlayer {
  display: none; }

.sliderBg_box {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10; }
  @media only screen and (min-width: 768px) {
    .sliderBg_box {
      display: none; } }

.mainvisual_caption {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  vertical-align: middle;
  z-index: 15; }
  @media only screen and (min-width: 768px) {
    .mainvisual_caption {
      width: 810px;
      height: 340px;
      bottom: 100px; }
      body.loaded .mainvisual_caption {
        bottom: 0;
        transition: 0.4s cubic-bezier(0.645, 0.045, 0.355, 1); } }
  @media only screen and (max-width: 767px) {
    .mainvisual_caption {
      margin: 11%; } }
  .mainvisual.active .mainvisual_caption {
    display: none; }
  .mainvisual_caption svg {
    fill: #fff;
    width: 810px;
    height: 220px; }
    @media only screen and (max-width: 767px) {
      .mainvisual_caption svg {
        width: 100%;
        height: 75px; } }
    html.touch .mainvisual_caption svg {
      fill: #041978; }

.mainvisual_captionInner {
  display: table;
  width: 100%;
  height: 100%; }
  @media only screen and (max-width: 767px) {
    .mainvisual_captionInner {
      padding: 8%;
      background-color: rgba(255, 255, 255, 0.7); } }
  .mainvisual_captionInner i {
    position: absolute;
    background-color: #101177;
    transition: 0.6s cubic-bezier(0.645, 0.045, 0.355, 1);
    opacity: 0.7; }
    .mainvisual_captionInner i.i1 {
      top: 0;
      right: 0;
      width: 0;
      height: 10px; }
      @media only screen and (max-width: 767px) {
        .mainvisual_captionInner i.i1 {
          height: 5px; } }
      body.loaded .mainvisual_captionInner i.i1 {
        width: 100%; }
    .mainvisual_captionInner i.i2 {
      top: 0;
      right: 0;
      width: 10px;
      height: 0; }
      @media only screen and (max-width: 767px) {
        .mainvisual_captionInner i.i2 {
          width: 5px; } }
      body.loaded .mainvisual_captionInner i.i2 {
        height: 100%; }
    .mainvisual_captionInner i.i3 {
      bottom: 0;
      left: 0;
      width: 0;
      height: 10px; }
      @media only screen and (max-width: 767px) {
        .mainvisual_captionInner i.i3 {
          height: 5px; } }
      body.loaded .mainvisual_captionInner i.i3 {
        width: 100%; }
    .mainvisual_captionInner i.i4 {
      bottom: 0;
      left: 0;
      width: 10px;
      height: 0; }
      @media only screen and (max-width: 767px) {
        .mainvisual_captionInner i.i4 {
          width: 5px; } }
      body.loaded .mainvisual_captionInner i.i4 {
        height: 100%; }
  .mainvisual_captionInner span {
    display: table-cell;
    vertical-align: middle; }
  @media only screen and (max-width: 767px) {
    .mainvisual_captionInner img {
      width: 100%; } }

.mainvisual_scroll {
  position: absolute;
  bottom: 30px;
  left: 0;
  right: 0;
  width: 46px;
  height: 46px;
  margin: 0 auto; }
  .mainvisual_scroll img {
    width: 100%; }
  @media only screen and (max-width: 767px) {
    .mainvisual_scroll {
      display: none; } }

/* SECTION STYLE
-----------------------------------------------------------------*/
.section_inner {
  position: relative;
  z-index: 10; }
  @media only screen and (max-width: 767px) {
    .section_inner {
      padding: 0 20px; } }

.section_innerBg {
  transition: -webkit-transform 2s ease;
  transition: transform 2s ease;
  transition: transform 2s ease, -webkit-transform 2s ease; }

.section_title {
  transition: -webkit-transform 2s ease;
  transition: transform 2s ease;
  transition: transform 2s ease, -webkit-transform 2s ease; }
  @media only screen and (max-width: 767px) {
    .section_title .jp {
      font-size: 35px;
      letter-spacing: 0; } }

.wrapper {
  width: 100%;
  overflow: hidden; }

.animationImg {
  transition: -webkit-transform 2s ease;
  transition: transform 2s ease;
  transition: transform 2s ease, -webkit-transform 2s ease; }

/* CONTENTS
-----------------------------------------------------------------*/
/* INTRODUCTION */
.introSection {
  padding-top: 40px;
  margin: 205px 0 0;
  position: relative; }
  @media only screen and (max-width: 767px) {
    .introSection {
      margin: 23px 0 0; } }
  .introSection .section_innerBg {
    border-top: 334px solid #fff;
    border-bottom: 70px solid #fff;
    height: 100%; }
    @media only screen and (max-width: 767px) {
      .introSection .section_innerBg {
        top: 0%;
        border-top: 300px solid #fff;
        border-bottom: 75px solid #fff; } }

.introSection_img {
  text-align: right; }

.introSection_caption {
  position: absolute;
  top: 85px;
  left: 0;
  transition: -webkit-transform 2s ease;
  transition: transform 2s ease;
  transition: transform 2s ease, -webkit-transform 2s ease; }
  @media only screen and (max-width: 767px) {
    .introSection_caption {
      top: 28px;
      left: 14px; } }

.introSection_content {
  margin-top: 60px;
  font-size: 16px; }
  @media only screen and (min-width: 768px) {
    .introSection_content {
      margin-left: 175px; } }
  @media only screen and (max-width: 767px) {
    .introSection_content {
      margin-top: 28px;
      font-size: 14px; } }
  .introSection_content .introSection_title {
    font-weight: bold; }
    @media only screen and (min-width: 768px) {
      .introSection_content .introSection_title {
        font-size: 24px; } }
    @media only screen and (max-width: 767px) {
      .introSection_content .introSection_title {
        font-size: 18px; } }

/* MESSAGE SECTION */
.messageSection {
  margin-top: 115px;
  position: relative; }
  @media only screen and (max-width: 767px) {
    .messageSection {
      margin-top: 75px; } }
  .messageSection .section_innerBg {
    max-width: 1020px;
    height: 1540px;
    background-color: #e5e5e5;
    top: 36px;
    left: auto;
    right: 50%;
    margin: 0 -329px 0 0; }
    @media only screen and (max-width: 767px) {
      .messageSection .section_innerBg {
        height: 100%;
        border-bottom: 84px solid #fff;
        top: 42px;
        right: 40px;
        margin: 0; } }

.messageSection_title {
  text-align: right; }

.messageSection_people {
  margin-bottom: 200px;
  position: relative; }
  @media only screen and (max-width: 767px) {
    .messageSection_people {
      margin-bottom: 38px; } }
  @media only screen and (min-width: 1025px) {
    .messageSection_people dt img {
      width: 600px; } }
  @media only screen and (min-width: 768px) {
    .messageSection_people dd {
      position: absolute;
      top: 308px;
      left: 484px; } }
  @media only screen and (max-width: 767px) {
    .messageSection_people dd {
      text-align: right;
      margin-top: -30px; } }
  .messageSection_people:nth-child(even) dt {
    text-align: right; }
  @media only screen and (min-width: 768px) {
    .messageSection_people:nth-child(even) dd {
      left: 60px; } }
  @media only screen and (max-width: 767px) {
    .messageSection_people:nth-child(even) dd {
      text-align: left; } }

.messageSection_button {
  line-height: 1.5; }

.messageSection_name {
  font-size: 40px;
  line-height: 1.2; }
  @media only screen and (max-width: 767px) {
    .messageSection_name {
      font-size: 35px; } }

.messageSection_status {
  margin: 0 0 12px;
  font-size: 20px;
  line-height: 1.5; }
  @media only screen and (max-width: 767px) {
    .messageSection_status {
      font-size: 17px; } }

.messageSection_comment {
  position: relative;
  margin: 15px 0 0;
  padding: 25px 26px 0 0;
  font-size: 14px;
  font-weight: normal; }
  @media only screen and (max-width: 767px) {
    .messageSection_comment {
      margin: 12px 12px 0 0;
      padding: 20px 0 0; } }
  .messageSection_comment:before {
    content: "";
    width: 50px;
    height: 2px;
    background-color: #fff;
    position: absolute;
    top: 0px;
    left: 0; }

.messageSection_toList {
  text-align: right; }
  .messageSection_toList a {
    margin-top: 35px;
    width: auto; }
    @media only screen and (min-width: 768px) {
      .messageSection_toList a {
        min-width: 400px; } }
    @media only screen and (max-width: 767px) {
      .messageSection_toList a {
        margin-top: 22px;
        width: 100%; } }

/* INTERVIEW SECTION */
.interviewSection {
  position: relative;
  margin-top: 150px; }
  @media only screen and (max-width: 767px) {
    .interviewSection {
      margin-top: 68px; } }
  .interviewSection .section_inner {
    width: 100%;
    padding: 0; }
  .interviewSection .section_innerBg {
    top: 44px;
    height: 100%;
    border-bottom: 90px solid #fff; }

@media only screen and (min-width: 768px) {
  .interviewSection_title {
    width: 930px;
    margin: 0 auto; } }

@media only screen and (max-width: 767px) {
  .interviewSection_title {
    padding: 0 20px; } }

.interviewSection_box {
  margin: 80px auto 70px; }
  @media only screen and (max-width: 767px) {
    .interviewSection_box {
      margin: 40px auto 45px; }
      .interviewSection_box .slick-dots {
        text-align: center;
        margin-top: 30px; }
        .interviewSection_box .slick-dots li {
          width: 15px;
          height: 15px; }
          .interviewSection_box .slick-dots li button {
            width: 15px;
            height: 15px;
            background-color: transparent;
            border: 1px solid #101177; }
          .interviewSection_box .slick-dots li.slick-active button {
            background-color: #101177; } }

.interviewSection_blockList {
  width: 100%; }
  @media only screen and (min-width: 768px) {
    .interviewSection_blockList {
      display: table; } }

@media only screen and (min-width: 768px) {
  .interviewSection_blockItem {
    display: table-cell;
    vertical-align: top; } }

.interviewSection_listItem {
  overflow: hidden; }
  .interviewSection_listItem a {
    display: block;
    cursor: pointer; }
  .interviewSection_listItem img {
    width: 100%;
    transition: 800ms ease; }
    @media only screen and (min-width: 1025px) {
      .interviewSection_listItem img:hover {
        opacity: .8;
        -webkit-transform: scale(1.05);
        -ms-transform: scale(1.05);
        transform: scale(1.05); } }

.interviewSection_toList {
  text-align: right; }
  @media only screen and (min-width: 768px) {
    .interviewSection_toList {
      width: 930px;
      margin: 0 auto; }
      .interviewSection_toList a {
        width: auto;
        min-width: 400px; } }
  @media only screen and (max-width: 767px) {
    .interviewSection_toList {
      padding: 0 20px; }
      .interviewSection_toList a {
        width: 100%;
        font-size: 16px; } }

/* CARREERS SECTION */
.careersSection {
  position: relative;
  margin-top: 280px; }
  @media only screen and (max-width: 767px) {
    .careersSection {
      margin-top: 70px; } }
  .careersSection .section_innerBg {
    max-width: 1020px;
    height: 100%;
    background-color: #e5e5e5;
    top: 44px;
    left: auto;
    right: 50%;
    margin: 0 -329px 0 0;
    border-bottom: 90px solid #fff; }
    @media only screen and (max-width: 767px) {
      .careersSection .section_innerBg {
        height: 100%;
        border-bottom: 84px solid #fff;
        top: 42px;
        right: 40px;
        margin: 0; } }

.careersSection_title {
  text-align: right; }

@media only screen and (min-width: 768px) {
  .careersSection_box {
    width: 1060px; } }

@media only screen and (min-width: 768px) {
  .careersSection_link {
    float: left;
    width: 400px;
    height: 575px;
    margin-right: 130px; } }

@media only screen and (max-width: 767px) {
  .careersSection_link {
    margin-bottom: 27px; } }

.careersSection_link:hover .careersSection_label:before {
  -webkit-animation: hoverAnime 1s ease-in-out 1 alternate;
  animation: hoverAnime 1s ease-in-out 1 alternate; }

.careersSection_link:hover .careersSection_label:after {
  -webkit-animation: hoverImgColor 1s ease-in-out 1 alternate;
  animation: hoverImgColor 1s ease-in-out 1 alternate; }

.careersSection_link:hover .careersSection_label * {
  -webkit-animation: hoverFontColor 1s ease-in-out 1 alternate;
  animation: hoverFontColor 1s ease-in-out 1 alternate; }

.careersSection_img {
  position: relative; }
  .careersSection_img img {
    transition: 800ms ease; }

.careersSection_label {
  position: relative;
  background-color: #313131;
  width: 100%;
  height: 80px;
  line-height: 80px;
  text-align: center;
  color: #fff;
  font-size: 24px;
  letter-spacing: 0.1em;
  overflow: hidden; }
  @media only screen and (max-width: 767px) {
    .careersSection_label {
      height: 65px;
      line-height: 65px;
      padding: 0 20px;
      text-align: left;
      font-size: 22px; } }
  .careersSection_label:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
    -webkit-transform: translate(-100%, 0);
    -ms-transform: translate(-100%, 0);
    transform: translate(-100%, 0); }
  .careersSection_label:after {
    content: "";
    width: 14px;
    height: 100%;
    position: absolute;
    right: 28px;
    bottom: 0;
    background-image: url(../img/common/arrow_left.svg);
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 14px auto; }
    @media only screen and (max-width: 767px) {
      .careersSection_label:after {
        right: 20px;
        bottom: 0;
        width: 12px;
        background-size: 12px auto; } }
  .careersSection_label span {
    position: relative; }

.careersSection_overview {
  margin-top: 18px;
  font-size: 20px;
  font-weight: bold;
  line-height: 1.4; }
  @media only screen and (max-width: 767px) {
    .careersSection_overview {
      font-size: 18px; } }

.careersSection_comment {
  margin-top: 18px;
  font: 14px;
  line-height: 1.8; }
  @media only screen and (max-width: 767px) {
    .careersSection_comment {
      margin-top: 8px; } }

.careersSection_toList {
  text-align: right; }
  .careersSection_toList a {
    margin-top: -100px;
    width: auto; }
    @media only screen and (min-width: 768px) {
      .careersSection_toList a {
        min-width: 400px; } }
    @media only screen and (max-width: 767px) {
      .careersSection_toList a {
        margin-top: 22px;
        width: 100%;
        font-size: 16px; } }

/* PROJECT SECTION */
.projectSection {
  position: relative;
  margin-top: 150px; }
  @media only screen and (max-width: 767px) {
    .projectSection {
      margin-top: 72px; } }
  .projectSection .section_innerBg {
    top: 34px;
    height: 105%; }
    @media only screen and (max-width: 767px) {
      .projectSection .section_innerBg {
        height: 90%; } }

@media only screen and (min-width: 768px) {
  .projectSection_detail {
    width: 282px;
    float: left;
    margin-top: 116px; } }

@media only screen and (max-width: 767px) {
  .projectSection_detail {
    width: 100%; } }

.projectSection_detailTitle {
  color: #221815;
  font-size: 20px;
  line-height: 1.6;
  font-weight: bold;
  margin-bottom: 20px; }
  @media only screen and (max-width: 767px) {
    .projectSection_detailTitle {
      font-size: 18px;
      line-height: 1.5; } }

.projectSection_detailText {
  font-size: 14px;
  line-height: 2; }
  @media only screen and (max-width: 767px) {
    .projectSection_detailText {
      font-size: 14px;
      line-height: 1.86;
      margin-bottom: 18px; } }

@media only screen and (min-width: 768px) {
  .projectSection_img {
    width: 600px;
    float: right; } }

@media only screen and (max-width: 767px) {
  .projectSection_img {
    width: 100%; } }

.projectSection_img img {
  width: 100%; }

.projectSection_toList a {
  margin-top: -50px;
  width: auto; }
  @media only screen and (min-width: 768px) {
    .projectSection_toList a {
      min-width: 400px; } }
  @media only screen and (max-width: 767px) {
    .projectSection_toList a {
      margin-top: 22px;
      width: 100%;
      font-size: 16px; } }

/* SYSTEM ENVIRONMENT SECTION */
.systemSection {
  position: relative;
  margin-top: 150px; }
  @media only screen and (max-width: 767px) {
    .systemSection {
      margin-top: 72px; } }
  .systemSection .section_innerBg {
    max-width: 1020px;
    height: 105%;
    background-color: #e5e5e5;
    top: 44px;
    left: auto;
    right: 50%;
    margin: 0 -329px 0 0;
    border-bottom: 90px solid #fff; }
    @media only screen and (max-width: 767px) {
      .systemSection .section_innerBg {
        height: 100%;
        border-bottom: 84px solid #fff;
        top: 42px;
        right: 40px;
        margin: 0; } }

.systemSection_title {
  text-align: right; }

@media only screen and (min-width: 768px) {
  .systemSection_detail {
    width: 282px;
    float: right;
    margin-top: 116px; } }

@media only screen and (max-width: 767px) {
  .systemSection_detail {
    width: 100%; } }

.systemSection_detailTitle {
  color: #221815;
  font-size: 20px;
  line-height: 1.6;
  font-weight: bold;
  margin-bottom: 20px; }
  @media only screen and (max-width: 767px) {
    .systemSection_detailTitle {
      font-size: 18px;
      line-height: 1.5; } }

.systemSection_detailText {
  font-size: 14px;
  line-height: 2; }
  @media only screen and (max-width: 767px) {
    .systemSection_detailText {
      font-size: 14px;
      line-height: 1.86;
      margin-bottom: 18px; } }

@media only screen and (min-width: 768px) {
  .systemSection_img {
    width: 600px;
    float: left; } }

@media only screen and (max-width: 767px) {
  .systemSection_img {
    width: 100%; } }

.systemSection_img img {
  width: 100%; }

.systemSection_toList {
  text-align: right; }
  .systemSection_toList a {
    margin-top: -50px;
    width: auto; }
    @media only screen and (min-width: 768px) {
      .systemSection_toList a {
        min-width: 400px; } }
    @media only screen and (max-width: 767px) {
      .systemSection_toList a {
        margin-top: 22px;
        width: 100%;
        font-size: 16px; } }

/* COMPANY SECTION */
.companySection {
  margin-top: 140px; }
  @media only screen and (max-width: 767px) {
    .companySection {
      margin-top: 70px; } }
  @media only screen and (min-width: 768px) {
    .companySection .pageLink_list {
      display: block;
      max-width: 941px;
      margin: 0 auto;
      font-size: 0; } }
  @media only screen and (max-width: 767px) {
    .companySection .pageLink_list {
      padding: 0 20px; } }
  @media only screen and (min-width: 768px) {
    .companySection .pageLink_node {
      display: inline-block;
      width: 460px;
      margin: 0 5px 10px; } }

.companySection_title {
  margin-bottom: 48px; }
  @media only screen and (max-width: 767px) {
    .companySection_title {
      margin-bottom: 28px; } }