@charset "UTF-8";
#top {
  /*main{
  	margin-bottom: 0;
  }*/ }
  #top section {
    padding: 2vw 0; }
    #top section .h2-01 {
      text-align: center; }
  #top .sec-keyv {
    padding: 0;
    margin: 0; }
    @media screen and (min-width: 768px) and (max-width: 1023px) {
      #top .sec-keyv {
        margin-top: 12vw; } }
    @media screen and (max-width: 767px) {
      #top .sec-keyv {
        margin-top: 13vw; } }
    #top .sec-keyv .slick-arrow {
      height: auto;
      z-index: 9999; }
    #top .sec-keyv .slick-prev {
      left: 2.85vw; }
      #top .sec-keyv .slick-prev:before {
        content: "";
        display: block;
        width: 1.57vw;
        height: 3.2vw;
        background: url("../../img/top/icon_prev.png") no-repeat 0 0;
        background-size: contain; }
    #top .sec-keyv .slick-next {
      right: 2.85vw; }
      #top .sec-keyv .slick-next:before {
        content: "";
        display: block;
        width: 1.57vw;
        height: 3.2vw;
        background: url("../../img/top/icon_next.png") no-repeat 0 0;
        background-size: contain; }
  #top .keyv-box {
    width: 100%;
    position: relative;
    height: 50vw; }
    #top .keyv-box::after {
      content: "";
      display: block;
      clear: both; }
    @media print, screen and (min-width: 1200px) {
      #top .keyv-box {
        width: 100%;
        height: 100vh; } }
    #top .keyv-box .keyv .keyv-slide {
      margin: 0;
      padding: 0; }
      #top .keyv-box .keyv .keyv-slide li {
        width: 100%;
        height: 50vw; }
        @media print, screen and (min-width: 1200px) {
          #top .keyv-box .keyv .keyv-slide li {
            width: 100%;
            height: 100vh; } }
      #top .keyv-box .keyv .keyv-slide .keyv01 {
        background: linear-gradient(to bottom, rgba(0, 22, 59, 0) 0%, rgba(0, 22, 59, 0) 40%, #00163b 100%), url("../../img/top/keyv01.jpg") no-repeat 50% 50%;
        background-blend-mode: multiply;
        background-size: cover; }
      #top .keyv-box .keyv .keyv-slide .keyv02 {
        background: linear-gradient(to bottom, rgba(0, 22, 59, 0) 0%, rgba(0, 22, 59, 0) 40%, #00163b 100%), url("../../img/top/keyv02.jpg") no-repeat 50% 50%;
        background-blend-mode: multiply;
        background-size: cover; }
      #top .keyv-box .keyv .keyv-slide .keyv03 {
        background: linear-gradient(to bottom, rgba(0, 22, 59, 0) 0%, rgba(0, 22, 59, 0) 40%, #00163b 100%), url("../../img/top/keyv03.jpg") no-repeat 50% 50%;
        background-blend-mode: multiply;
        background-size: cover; }
    #top .keyv-box .bg-blue {
      width: 100%;
      height: 29.8vw;
      position: absolute;
      bottom: 0;
      left: 0;
      padding: 12vw 1vw 1vw; }
    #top .keyv-box .keyvMainCopy {
      width: 100%;
      /*bottom: 6.7vw;
      left: 0;
      -ms-transform: translateX(-50%);
      -webkit-transform : translateX(-50%);
      transform : translateX(-50%);
      position: absolute;*/
      text-align: center;
      margin: 0; }
      #top .keyv-box .keyvMainCopy.en {
        font-family: 'Josefin Sans', sans-serif;
        font-size: 60px;
        font-size: 6rem;
        letter-spacing: 0.08em;
        color: #fff;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        margin: 0; }
        @media screen and (min-width: 480px) and (max-width: 1200px) {
          #top .keyv-box .keyvMainCopy.en {
            font-size: 7.5px;
            font-size: 4.8rem; } }
        @media screen and (max-width: 767px) {
          #top .keyv-box .keyvMainCopy.en {
            font-size: 25px;
            font-size: 2.5rem;
            line-height: 1.2; } }
  @media screen and (max-width: 767px) and (min-width: 480px) and (max-width: 1200px) {
    #top .keyv-box .keyvMainCopy.en {
      font-size: 3.125px;
      font-size: 2rem; } }

      #top .keyv-box .keyvMainCopy img {
        width: 30vw; }
        @media print, screen and (min-width: 1023px) {
          #top .keyv-box .keyvMainCopy img {
            width: 38vw; } }
    #top .keyv-box .icondown {
      text-align: center;
      position: absolute;
      bottom: 1em;
      left: 50%;
      transform: translateX(-50%); }
      @media screen and (max-width: 767px) {
        #top .keyv-box .icondown {
          bottom: 0.8em; } }
      @media screen and (max-width: 1199px) {
        #top .keyv-box .icondown {
          display: none; } }
      #top .keyv-box .icondown img {
        width: 34px; }
        @media screen and (max-width: 767px) {
          #top .keyv-box .icondown img {
            width: 13px; } }
      #top .keyv-box .icondown:before {
        position: absolute;
        content: '';
        width: 0.4vw;
        height: 0.4vw;
        background: #fff;
        margin-left: 0.87em;
        bottom: 2.9em;
        border-radius: 4px;
        -webkit-animation-duration: 1.5s;
        animation-duration: 1.5s;
        -webkit-animation-iteration-count: infinite;
        animation-iteration-count: infinite;
        -webkit-animation-name: scroll;
        animation-name: scroll; }
        @media screen and (max-width: 767px) {
          #top .keyv-box .icondown:before {
            bottom: 4.5vw;
            left: 2.4px; } }
@-webkit-keyframes scroll {
  0% {
    opacity: 1; }
  100% {
    opacity: 0;
    -webkit-transform: translateY(10px);
    transform: translateY(10px); } }
@keyframes scroll {
  0% {
    opacity: 1; }
  100% {
    opacity: 0;
    -webkit-transform: translateY(10px);
    transform: translateY(10px); } }
  #top .sec-movie {
    padding: 4vw 0 0; }
    #top .sec-movie .container {
      padding-bottom: 0; }
  #top .sec-aboutUs {
    padding: 0; }
    #top .sec-aboutUs h2 {
      text-align: center;
      font-size: 34px;
      font-size: 3.4rem;
      color: #00163B;
      padding-bottom: 1vw; }
      @media screen and (min-width: 480px) and (max-width: 1200px) {
        #top .sec-aboutUs h2 {
          font-size: 4.25px;
          font-size: 2.72rem; } }
      #top .sec-aboutUs h2.en-title {
        font-family: 'Josefin Sans', sans-serif; }
      @media screen and (max-width: 767px) {
        #top .sec-aboutUs h2 {
          font-size: 24px;
          font-size: 2.4rem; } }
  @media screen and (max-width: 767px) and (min-width: 480px) and (max-width: 1200px) {
    #top .sec-aboutUs h2 {
      font-size: 3px;
      font-size: 1.92rem; } }

    @media screen and (max-width: 767px) {
      #top .sec-aboutUs .aboutUs-container {
        background: #fff;
        margin: 3vw; }
        #top .sec-aboutUs .aboutUs-container .item-box {
          border-bottom: 1px solid #fff; } }
    #top .sec-aboutUs .aboutUs-container a {
      color: #fff;
      text-decoration: none; }
      #top .sec-aboutUs .aboutUs-container a:hover, #top .sec-aboutUs .aboutUs-container a:active, #top .sec-aboutUs .aboutUs-container a:focus {
        color: white;
        text-decoration: none; }
      #top .sec-aboutUs .aboutUs-container a:visited {
        color: white; }
    #top .sec-aboutUs .aboutUs-container .item {
      width: 100%;
      position: relative; }
      #top .sec-aboutUs .aboutUs-container .item.stay .item-box:after {
        content: "";
        display: block;
        width: 100%;
        height: 100%;
        background: rgba(0, 50, 145, 0.8);
        position: absolute;
        top: 0;
        left: 0;
        z-index: 100; }
      #top .sec-aboutUs .aboutUs-container .item .item-box {
        transition: all .3s;
        position: relative;
        overflow: hidden;
        z-index: 100;
        /*&.thumb01{
        	
        	.item-thumb{
        		background: url("../../img/top/aboutUs_thumb01.jpg") no-repeat 0 0;
        		background-size: cover;
        	}
        }
        &.thumb02{
        	
        	.item-thumb{
        		background: url("../../img/top/aboutUs_thumb02.jpg") no-repeat 0 0;
        		background-size: cover;
        	}
        }
        &.thumb03{
        	
        	.item-thumb{
        		background: url("../../img/top/aboutUs_thumb03.jpg") no-repeat 0 0;
        		background-size: cover;
        	}
        }*/ }
        @media screen and (min-width: 768px) and (max-width: 1023px) {
          #top .sec-aboutUs .aboutUs-container .item .item-box {
            overflow-y: visible; } }
        #top .sec-aboutUs .aboutUs-container .item .item-box:before {
          content: "";
          display: block;
          width: 0%;
          height: 100%;
          background: rgba(0, 50, 145, 0.8);
          position: absolute;
          top: 0;
          left: 0;
          transition: all .3s;
          z-index: 99; }
        #top .sec-aboutUs .aboutUs-container .item .item-box:hover:before {
          width: 100%; }
        #top .sec-aboutUs .aboutUs-container .item .item-box:hover .btn-noborder::after {
          transform: translate(5px, 0); }
        #top .sec-aboutUs .aboutUs-container .item .item-box .item-thumb:before {
          content: "";
          display: block;
          width: 100%;
          height: 100%;
          background: rgba(0, 0, 0, 0.3);
          position: absolute;
          top: 0;
          left: 0;
          transition: all .3s;
          z-index: 99; }
        @media screen and (min-width: 768px) and (max-width: 1023px) {
          #top .sec-aboutUs .aboutUs-container .item .item-box .item-thumb img {
            width: auto;
            height: 40vw;
            max-width: max-content; } }
      #top .sec-aboutUs .aboutUs-container .item .item-body {
        width: 100%;
        position: absolute;
        top: 0;
        left: 0;
        padding: 3.2vw 1.7vw;
        z-index: 200;
        text-align: center; }
        #top .sec-aboutUs .aboutUs-container .item .item-body p {
          line-height: 1.5;
          margin-top: 0.5em; }
        #top .sec-aboutUs .aboutUs-container .item .item-body .no {
          font-family: 'Josefin Sans', sans-serif;
          font-size: 36px;
          font-size: 3.6rem;
          font-weight: 100;
          font-style: normal; }
          @media screen and (min-width: 480px) and (max-width: 1200px) {
            #top .sec-aboutUs .aboutUs-container .item .item-body .no {
              font-size: 4.5px;
              font-size: 2.88rem; } }
        #top .sec-aboutUs .aboutUs-container .item .item-body .title {
          font-size: 24px;
          font-size: 2.4rem;
          font-weight: bold; }
          @media screen and (min-width: 480px) and (max-width: 1200px) {
            #top .sec-aboutUs .aboutUs-container .item .item-body .title {
              font-size: 3px;
              font-size: 1.92rem; } }
          #top .sec-aboutUs .aboutUs-container .item .item-body .title .en {
            font-family: 'Josefin Sans', sans-serif;
            font-size: 15px;
            font-size: 1.5rem;
            letter-spacing: 2px;
            display: block; }
            @media screen and (min-width: 480px) and (max-width: 1200px) {
              #top .sec-aboutUs .aboutUs-container .item .item-body .title .en {
                font-size: 1.875px;
                font-size: 1.2rem; } }
          #top .sec-aboutUs .aboutUs-container .item .item-body .title .jp-en {
            font-family: 'Josefin Sans', sans-serif;
            letter-spacing: 2px;
            line-height: 1.5;
            display: block;
            font-size: 24px;
            font-size: 2.4rem; }
            @media screen and (min-width: 480px) and (max-width: 1200px) {
              #top .sec-aboutUs .aboutUs-container .item .item-body .title .jp-en {
                font-size: 3px;
                font-size: 1.92rem; } }
            @media screen and (max-width: 1022px) {
              #top .sec-aboutUs .aboutUs-container .item .item-body .title .jp-en {
                font-size: 18px;
                font-size: 1.8rem; } }
  @media screen and (max-width: 1022px) and (min-width: 480px) and (max-width: 1200px) {
    #top .sec-aboutUs .aboutUs-container .item .item-body .title .jp-en {
      font-size: 2.25px;
      font-size: 1.44rem; } }

          @media screen and (max-width: 767px) {
            #top .sec-aboutUs .aboutUs-container .item .item-body .title {
              font-size: 20px;
              font-size: 2rem; } }
  @media screen and (max-width: 767px) and (min-width: 480px) and (max-width: 1200px) {
    #top .sec-aboutUs .aboutUs-container .item .item-body .title {
      font-size: 2.5px;
      font-size: 1.6rem; } }
          @media screen and (max-width: 767px) {
              #top .sec-aboutUs .aboutUs-container .item .item-body .title .en {
                font-size: 14px;
                font-size: 1.4rem; } }
    @media screen and (max-width: 767px) and (min-width: 480px) and (max-width: 1200px) {
      #top .sec-aboutUs .aboutUs-container .item .item-body .title .en {
        font-size: 1.75px;
        font-size: 1.12rem; } }

        #top .sec-aboutUs .aboutUs-container .item .item-body .text {
          font-size: 16px;
          font-size: 1.6rem;
          padding: 1vw 0; }
          @media screen and (min-width: 480px) and (max-width: 1200px) {
            #top .sec-aboutUs .aboutUs-container .item .item-body .text {
              font-size: 2px;
              font-size: 1.28rem; } }
          #top .sec-aboutUs .aboutUs-container .item .item-body .text br {
            display: block; }
          @media screen and (max-width: 767px) {
            #top .sec-aboutUs .aboutUs-container .item .item-body .text {
              font-size: 14px;
              font-size: 1.4rem; } }
  @media screen and (max-width: 767px) and (min-width: 480px) and (max-width: 1200px) {
    #top .sec-aboutUs .aboutUs-container .item .item-body .text {
      font-size: 1.75px;
      font-size: 1.12rem; } }

        @media screen and (max-width: 767px) {
          #top .sec-aboutUs .aboutUs-container .item .item-body .btn {
            font-size: 12px;
            font-size: 1.2rem; } }
  @media screen and (max-width: 767px) and (min-width: 480px) and (max-width: 1200px) {
    #top .sec-aboutUs .aboutUs-container .item .item-body .btn {
      font-size: 1.5px;
      font-size: 0.96rem; } }

    @media print, screen and (min-width: 768px) {
      #top .sec-aboutUs .aboutUs-container {
        -js-display: flex;
        display: -webkit-flex;
        display: flex; }
        #top .sec-aboutUs .aboutUs-container .item {
          width: 33.3333%; } }
  #top .sec-technology {
    background: #212121;
    color: #fff;
    padding: 2em 0 6em; }
    #top .sec-technology::after {
      content: "";
      display: block;
      clear: both; }
    @media screen and (max-width: 767px) {
      #top .sec-technology {
        padding: 3vw 0 7vw; } }
    #top .sec-technology .h2-01 {
      margin-bottom: 2vw; }
      #top .sec-technology .h2-01 .en {
        letter-spacing: normal; }
      @media screen and (max-width: 1022px) {
        #top .sec-technology .h2-01 .en.jp-en {
          margin-bottom: 0.5em; } }
    #top .sec-technology .technology-container {
      margin: 0; }
      @media print, screen and (min-width: 768px) {
        #top .sec-technology .technology-container {
          width: 100%;
          height: 22.14vw;
          position: relative;
          background: #003291; } }
      @media screen and (max-width: 767px) {
        #top .sec-technology .technology-container .technology-item {
          /*.text{
          	margin-top: -3em;
          }*/ } }
      #top .sec-technology .technology-container .technology-item .text {
        width: 100%;
        color: #fff;
        text-decoration: none; }
        #top .sec-technology .technology-container .technology-item .text:hover, #top .sec-technology .technology-container .technology-item .text:active, #top .sec-technology .technology-container .technology-item .text:focus {
          color: white;
          text-decoration: none; }
        #top .sec-technology .technology-container .technology-item .text:visited {
          color: white; }
        #top .sec-technology .technology-container .technology-item .text .inner {
          text-align: center;
          position: relative;
          padding: 2em;
          width: 100%; }
          @media screen and (max-width: 767px) {
            #top .sec-technology .technology-container .technology-item .text .inner {
              padding: 2em 2em 2em 1em; } }
          #top .sec-technology .technology-container .technology-item .text .inner dl {
            margin: 0; }
          #top .sec-technology .technology-container .technology-item .text .inner dt {
            font-size: 24px;
            font-size: 2.4rem;
            font-weight: bold;
            padding: 0 0 0.5vw; }
            @media screen and (min-width: 480px) and (max-width: 1200px) {
              #top .sec-technology .technology-container .technology-item .text .inner dt {
                font-size: 3px;
                font-size: 1.92rem; } }
            @media screen and (max-width: 1022px) {
              #top .sec-technology .technology-container .technology-item .text .inner dt {
                font-size: 20px;
                font-size: 2rem;
                line-height: 1.2; } }
  @media screen and (max-width: 1022px) and (min-width: 480px) and (max-width: 1200px) {
    #top .sec-technology .technology-container .technology-item .text .inner dt {
      font-size: 2.5px;
      font-size: 1.6rem; } }

          #top .sec-technology .technology-container .technology-item .text .inner dd {
            font-size: 16px;
            font-size: 1.6rem; }
            @media screen and (min-width: 480px) and (max-width: 1200px) {
              #top .sec-technology .technology-container .technology-item .text .inner dd {
                font-size: 2px;
                font-size: 1.28rem; } }
            @media screen and (max-width: 1022px) {
              #top .sec-technology .technology-container .technology-item .text .inner dd {
                font-size: 14px;
                font-size: 1.4rem; } }
  @media screen and (max-width: 1022px) and (min-width: 480px) and (max-width: 1200px) {
    #top .sec-technology .technology-container .technology-item .text .inner dd {
      font-size: 1.75px;
      font-size: 1.12rem; } }
            @media screen and (max-width: 1022px) {
                #top .sec-technology .technology-container .technology-item .text .inner dd br {
                  display: none; } }
          @media print, screen and (min-width: 768px) {
            #top .sec-technology .technology-container .technology-item .text .inner {
              transform: skewX(-10deg);
              width: 90%;
              margin: 0 auto; }
              #top .sec-technology .technology-container .technology-item .text .inner dl {
                transform: skewX(10deg) scale(1.15); } }
        #top .sec-technology .technology-container .technology-item .text::after {
          font-family: ionicons;
          content: "";
          display: inline-block;
          font-size: 18px;
          font-size: 1.8rem;
          transition: all 0.3s;
          transform: translate(0, 0);
          position: absolute;
          top: 45%;
          right: 10vw; }
          @media screen and (min-width: 480px) and (max-width: 1200px) {
            #top .sec-technology .technology-container .technology-item .text::after {
              font-size: 2.25px;
              font-size: 1.44rem; } }
          @media screen and (max-width: 767px) {
            #top .sec-technology .technology-container .technology-item .text::after {
              right: 1em; } }
        #top .sec-technology .technology-container .technology-item .text:hover::after {
          transform: translate(5px, 0); }
      @media screen and (max-width: 767px) {
        #top .sec-technology .technology-container .technology-item.odd {
          width: 100%;
          position: relative;
          background: none;
          background: url("../../img/top/technology_thumb01.png") no-repeat 50% 50%;
          background-size: cover; }
          #top .sec-technology .technology-container .technology-item.odd .thumb {
            display: none;
            position: absolute;
            top: 0;
            left: 0;
            width: 100%; }
            #top .sec-technology .technology-container .technology-item.odd .thumb img {
              mix-blend-mode: soft-light; }
          #top .sec-technology .technology-container .technology-item.odd .text {
            width: 100%;
            /*position: absolute;
            background: rgba(0,50,145,0.9);
            top: 0;
            left: 0;*/ } }
      @media print, screen and (min-width: 768px) {
        #top .sec-technology .technology-container .technology-item.odd {
          width: 53.5vw;
          position: absolute;
          left: 0;
          top: 0; }
          #top .sec-technology .technology-container .technology-item.odd:after {
            content: "";
            width: 100%;
            height: 2.1vw;
            display: block;
            background: #00B0F0; } }
      #top .sec-technology .technology-container .technology-item.odd .text {
        /*@include mq( $tb , max )  {
        	background: rgba(0,50,145,0.8);
        }*/ }
        #top .sec-technology .technology-container .technology-item.odd .text .inner {
          /*background: url("../../img/top/technology_bg01.png") no-repeat 50% 50%;
          background-size: contain;*/
          background: rgba(0, 50, 145, 0.9);
          /*@include mq( $tb , max )  {
          	background: none;
          }
          
          @include mq( $pc , $tb )  {
          	background: url("../../img/top/technology_bg01.png") no-repeat 50% 50%;
          	background-size: cover;
          }*/ }
        @media print, screen and (min-width: 768px) {
          #top .sec-technology .technology-container .technology-item.odd .text {
            width: 100%;
            position: absolute;
            left: 0;
            top: 11.5vw;
            z-index: 10; }
            #top .sec-technology .technology-container .technology-item.odd .text .inner {
              width: 45vw;
              margin: 0 auto 0 1vw; } }
      @media screen and (max-width: 767px) {
        #top .sec-technology .technology-container .technology-item.even {
          width: 100%;
          background: url("../../img/top/technology_thumb02.png") no-repeat 50% 50%;
          background-size: cover;
          position: relative; }
          #top .sec-technology .technology-container .technology-item.even .thumb {
            display: none;
            background: #003291;
            position: absolute;
            top: 0;
            left: 0;
            width: 100%; }
            #top .sec-technology .technology-container .technology-item.even .thumb img {
              mix-blend-mode: soft-light; }
          #top .sec-technology .technology-container .technology-item.even .text {
            width: 100%;
            /*background: rgba(0,176,240,0.9);
            position: absolute;
            top: 0;
            left: 0;*/ } }
      @media print, screen and (min-width: 768px) {
        #top .sec-technology .technology-container .technology-item.even {
          width: 51.4vw;
          position: absolute;
          top: 2.1vw;
          right: 0;
          margin: 0; } }
      #top .sec-technology .technology-container .technology-item.even .text {
        text-align: center; }
        #top .sec-technology .technology-container .technology-item.even .text::after {
          right: 7.5vw; }
          @media screen and (max-width: 767px) {
            #top .sec-technology .technology-container .technology-item.even .text::after {
              right: 1em; } }
        #top .sec-technology .technology-container .technology-item.even .text .inner {
          background: rgba(0, 176, 240, 0.9);
          /*background: url("../../img/top/technology_bg02.png") no-repeat 50% 50%;
          background-size: contain;
          
          @include mq( $tb , max )  {
          	background: none;
          }
          
          @include mq( $pc , $tb )  {
          	background: url("../../img/top/technology_bg02.png") no-repeat 50% 50%;
          	background-size: cover;
          }*/ }
        @media print, screen and (min-width: 768px) {
          #top .sec-technology .technology-container .technology-item.even .text {
            width: 100%;
            position: absolute;
            right: 0;
            top: 13vw;
            z-index: 10; }
            #top .sec-technology .technology-container .technology-item.even .text .inner {
              width: 45vw;
              margin: 0 auto; } }
      @media screen and (max-width: 767px) {
        #top .sec-technology .technology-container .technology-item.technology-item01 {
          width: 100%;
          position: relative;
          background: none;
          background: url("../../img/top/technology_thumb01.png") no-repeat 50% 50%;
          background-size: cover; } }
      @media screen and (max-width: 767px) {
        #top .sec-technology .technology-container .technology-item.technology-item02 {
          width: 100%;
          background: url("../../img/top/technology_thumb02.png") no-repeat 50% 50%;
          background-size: cover;
          position: relative; } }
      @media screen and (max-width: 767px) {
        #top .sec-technology .technology-container .technology-item.technology-item03 {
          background: url("../../img/top/technology_thumb03.png") no-repeat 50% 50%;
          background-size: cover; } }
      @media screen and (max-width: 767px) {
        #top .sec-technology .technology-container .technology-item.technology-item04 {
          background: url("../../img/top/technology_thumb04.png") no-repeat 50% 50%;
          background-size: cover; } }
      #top .sec-technology .technology-container .technology-item.en .text .inner dl {
        padding: 0 4.5vw 0 2vw; }
        #top .sec-technology .technology-container .technology-item.en .text .inner dl dt {
          font-family: 'Josefin Sans', sans-serif;
          line-height: 1.2; }
          @media screen and (max-width: 1022px) {
            #top .sec-technology .technology-container .technology-item.en .text .inner dl dt {
              font-size: 18px;
              font-size: 1.8rem; } }
  @media screen and (max-width: 1022px) and (min-width: 480px) and (max-width: 1200px) {
    #top .sec-technology .technology-container .technology-item.en .text .inner dl dt {
      font-size: 2.25px;
      font-size: 1.44rem; } }

        @media screen and (max-width: 1022px) {
          #top .sec-technology .technology-container .technology-item.en .text .inner dl dd {
            font-size: 14px;
            font-size: 1.4rem; } }
  @media screen and (max-width: 1022px) and (min-width: 480px) and (max-width: 1200px) {
    #top .sec-technology .technology-container .technology-item.en .text .inner dl dd {
      font-size: 1.75px;
      font-size: 1.12rem; } }

      @media screen and (min-width: 768px) and (max-width: 1200px) {
        #top .sec-technology .technology-container .technology-item.en .text .inner {
          width: 40vw;
          margin: 0 auto; }
          #top .sec-technology .technology-container .technology-item.en .text .inner dl {
            line-height: 1.2; } }
    #top .sec-technology .technology-container-3col {
      margin: 0; }
      @media print, screen and (min-width: 768px) {
        #top .sec-technology .technology-container-3col {
          width: 100%;
          height: 22.14vw;
          position: relative;
          background: #003291; } }
      @media screen and (max-width: 767px) {
        #top .sec-technology .technology-container-3col .technology-item {
          /*.text{
          	margin-top: -3em;
          }*/ } }
      #top .sec-technology .technology-container-3col .technology-item .text {
        width: 100%;
        color: #fff;
        text-decoration: none; }
        #top .sec-technology .technology-container-3col .technology-item .text:hover, #top .sec-technology .technology-container-3col .technology-item .text:active, #top .sec-technology .technology-container-3col .technology-item .text:focus {
          color: white;
          text-decoration: none; }
        #top .sec-technology .technology-container-3col .technology-item .text:visited {
          color: white; }
        #top .sec-technology .technology-container-3col .technology-item .text .inner {
          text-align: center;
          position: relative;
          padding: 2em;
          width: 100%; }
          @media screen and (max-width: 767px) {
            #top .sec-technology .technology-container-3col .technology-item .text .inner {
              padding: 2em 2em 2em 1em; } }
          #top .sec-technology .technology-container-3col .technology-item .text .inner dl {
            margin: 0; }
          #top .sec-technology .technology-container-3col .technology-item .text .inner dt {
            font-size: 24px;
            font-size: 2.4rem;
            font-weight: bold;
            padding: 0 0 0.5vw; }
            @media screen and (min-width: 480px) and (max-width: 1200px) {
              #top .sec-technology .technology-container-3col .technology-item .text .inner dt {
                font-size: 3px;
                font-size: 1.92rem; } }
            @media print, screen and (max-width: 1200px) {
              #top .sec-technology .technology-container-3col .technology-item .text .inner dt {
                font-size: 22px;
                font-size: 2.2rem; } }
  @media screen and (max-width: 1200px) and (min-width: 480px) and (max-width: 1200px) {
    #top .sec-technology .technology-container-3col .technology-item .text .inner dt {
      font-size: 2.75px;
      font-size: 1.76rem; } }

            @media screen and (max-width: 1022px) {
              #top .sec-technology .technology-container-3col .technology-item .text .inner dt {
                font-size: 20px;
                font-size: 2rem;
                line-height: 1.2; } }
  @media screen and (max-width: 1022px) and (min-width: 480px) and (max-width: 1200px) {
    #top .sec-technology .technology-container-3col .technology-item .text .inner dt {
      font-size: 2.5px;
      font-size: 1.6rem; } }

          #top .sec-technology .technology-container-3col .technology-item .text .inner dd {
            font-size: 16px;
            font-size: 1.6rem; }
            @media screen and (min-width: 480px) and (max-width: 1200px) {
              #top .sec-technology .technology-container-3col .technology-item .text .inner dd {
                font-size: 2px;
                font-size: 1.28rem; } }
            @media print, screen and (max-width: 1200px) {
              #top .sec-technology .technology-container-3col .technology-item .text .inner dd {
                font-size: 15px;
                font-size: 1.5rem; } }
  @media screen and (max-width: 1200px) and (min-width: 480px) and (max-width: 1200px) {
    #top .sec-technology .technology-container-3col .technology-item .text .inner dd {
      font-size: 1.875px;
      font-size: 1.2rem; } }

            @media screen and (max-width: 1022px) {
              #top .sec-technology .technology-container-3col .technology-item .text .inner dd {
                font-size: 14px;
                font-size: 1.4rem; } }
  @media screen and (max-width: 1022px) and (min-width: 480px) and (max-width: 1200px) {
    #top .sec-technology .technology-container-3col .technology-item .text .inner dd {
      font-size: 1.75px;
      font-size: 1.12rem; } }
            @media screen and (max-width: 1022px) {
                #top .sec-technology .technology-container-3col .technology-item .text .inner dd br {
                  display: none; } }
          @media print, screen and (min-width: 768px) {
            #top .sec-technology .technology-container-3col .technology-item .text .inner {
              transform: skewX(-10deg);
              width: 90%;
              margin: 0 auto; }
              #top .sec-technology .technology-container-3col .technology-item .text .inner dl {
                transform: skewX(10deg) scale(1.15); } }
        #top .sec-technology .technology-container-3col .technology-item .text::after {
          font-family: ionicons;
          content: "";
          display: inline-block;
          font-size: 18px;
          font-size: 1.8rem;
          transition: all 0.3s;
          transform: translate(0, 0);
          position: absolute;
          top: 45%;
          right: 7vw; }
          @media screen and (min-width: 480px) and (max-width: 1200px) {
            #top .sec-technology .technology-container-3col .technology-item .text::after {
              font-size: 2.25px;
              font-size: 1.44rem; } }
          @media screen and (max-width: 767px) {
            #top .sec-technology .technology-container-3col .technology-item .text::after {
              right: 1em; } }
          @media screen and (min-width: 768px) and (max-width: 1023px) {
            #top .sec-technology .technology-container-3col .technology-item .text::after {
              display: none; } }
        #top .sec-technology .technology-container-3col .technology-item .text:hover::after {
          transform: translate(5px, 0); }
      @media screen and (max-width: 767px) {
        #top .sec-technology .technology-container-3col .technology-item.odd {
          width: 100%;
          position: relative;
          background: none;
          background: url("../../img/top/technology_thumb01.png") no-repeat 50% 50%;
          background-size: cover; }
          #top .sec-technology .technology-container-3col .technology-item.odd .thumb {
            display: none;
            position: absolute;
            top: 0;
            left: 0;
            width: 100%; }
            #top .sec-technology .technology-container-3col .technology-item.odd .thumb img {
              mix-blend-mode: soft-light; }
          #top .sec-technology .technology-container-3col .technology-item.odd .text {
            width: 100%; } }
      @media print, screen and (min-width: 768px) {
        #top .sec-technology .technology-container-3col .technology-item.odd {
          width: 36vw;
          position: absolute;
          left: 0;
          top: 0; } }
      #top .sec-technology .technology-container-3col .technology-item.odd .text .inner {
        background: rgba(0, 50, 145, 0.9); }
      @media print, screen and (min-width: 768px) {
        #top .sec-technology .technology-container-3col .technology-item.odd .text {
          width: 100%;
          position: absolute;
          left: 0;
          top: 11.5vw;
          z-index: 10; }
          #top .sec-technology .technology-container-3col .technology-item.odd .text .inner {
            width: 85%;
            margin: 0 auto 0 1vw; } }
      @media screen and (max-width: 767px) {
        #top .sec-technology .technology-container-3col .technology-item.even {
          width: 100%;
          background: url("../../img/top/technology_thumb02.png") no-repeat 50% 50%;
          background-size: cover;
          position: relative; }
          #top .sec-technology .technology-container-3col .technology-item.even .thumb {
            display: none;
            background: #003291;
            position: absolute;
            top: 0;
            left: 0;
            width: 100%; }
            #top .sec-technology .technology-container-3col .technology-item.even .thumb img {
              mix-blend-mode: soft-light; }
          #top .sec-technology .technology-container-3col .technology-item.even .text {
            width: 100%; } }
      @media print, screen and (min-width: 768px) {
        #top .sec-technology .technology-container-3col .technology-item.even {
          width: 36vw;
          position: absolute;
          top: 2.1vw;
          left: 31%;
          margin: 0;
          z-index: 1; }
          #top .sec-technology .technology-container-3col .technology-item.even .thumb {
            clip-path: polygon(7% 0, 100% 0, 93% 100%, 0 100%);
            object-fit: cover; } }
      #top .sec-technology .technology-container-3col .technology-item.even .text {
        text-align: center; }
        #top .sec-technology .technology-container-3col .technology-item.even .text::after {
          right: 6vw; }
          @media screen and (max-width: 767px) {
            #top .sec-technology .technology-container-3col .technology-item.even .text::after {
              right: 1em; } }
        #top .sec-technology .technology-container-3col .technology-item.even .text .inner {
          background: rgba(0, 176, 240, 0.9);
          /*background: url("../../img/top/technology_bg02.png") no-repeat 50% 50%;
          background-size: contain;
          
          @include mq( $tb , max )  {
          	background: none;
          }
          
          @include mq( $pc , $tb )  {
          	background: url("../../img/top/technology_bg02.png") no-repeat 50% 50%;
          	background-size: cover;
          }*/ }
        @media print, screen and (min-width: 768px) {
          #top .sec-technology .technology-container-3col .technology-item.even .text {
            width: 100%;
            position: absolute;
            right: 0;
            top: 13vw;
            z-index: 10; }
            #top .sec-technology .technology-container-3col .technology-item.even .text .inner {
              width: 85%;
              margin: 0 11% 0 auto; } }
      @media screen and (max-width: 767px) {
        #top .sec-technology .technology-container-3col .technology-item.technology-item03 {
          width: 100%;
          position: relative;
          background: none;
          background: url("../../img/top/technology_thumb03_jp.jpg") no-repeat 50% 50%;
          background-size: cover; }
          #top .sec-technology .technology-container-3col .technology-item.technology-item03 .thumb {
            display: none;
            position: absolute;
            top: 0;
            left: 0;
            width: 100%; }
            #top .sec-technology .technology-container-3col .technology-item.technology-item03 .thumb img {
              mix-blend-mode: soft-light; }
          #top .sec-technology .technology-container-3col .technology-item.technology-item03 .text {
            width: 100%; } }
      @media print, screen and (min-width: 768px) {
        #top .sec-technology .technology-container-3col .technology-item.technology-item03 {
          width: 36vw;
          position: absolute;
          right: 0;
          top: 0; }
          #top .sec-technology .technology-container-3col .technology-item.technology-item03 .thumb {
            clip-path: polygon(7% 0, 100% 0, 100% 100%, 0 100%);
            object-fit: cover; } }
      #top .sec-technology .technology-container-3col .technology-item.technology-item03 .text .inner {
        background: rgba(0, 93, 188, 0.9); }
      @media print, screen and (min-width: 768px) {
        #top .sec-technology .technology-container-3col .technology-item.technology-item03 .text {
          width: 100%;
          position: absolute;
          left: 0;
          top: 12.5vw;
          z-index: 10; }
          #top .sec-technology .technology-container-3col .technology-item.technology-item03 .text .inner {
            width: 90%;
            margin: 0 auto 0 1vw; } }
  #top .sec-topbanner {
    padding: 4vw 0; }
    @media print, screen and (min-width: 768px) {
      #top .sec-topbanner {
        padding: 4vw 0 6vw; } }
    #top .sec-topbanner .banner-wrap {
      text-align: center; }
      @media print, screen and (min-width: 768px) {
        #top .sec-topbanner .banner-wrap {
          -js-display: flex;
          display: -webkit-flex;
          display: flex;
          -webkit-flex-wrap: wrap;
          flex-wrap: wrap;
          margin-left: -2em;
          margin-right: -2em; }
          #top .sec-topbanner .banner-wrap .banner-item {
            width: 50%;
            padding: 2em;
            margin: 0; } }
      #top .sec-topbanner .banner-wrap .banner-item img {
        border: 1px solid #cbcbcb; }
  #top .sec-recruit {
    background: url("../../img/top/recruit_bg.jpg") no-repeat 50% 0;
    background-size: cover;
    text-align: center;
    padding: 6em 0;
    color: #fff;
    margin: 0; }
    @media screen and (max-width: 1022px) {
      #top .sec-recruit {
        padding: 0; } }
    @media screen and (max-width: 1022px) {
      #top .sec-recruit .contents {
        background: rgba(0, 0, 0, 0.3); } }
    #top .sec-recruit .summary {
      text-align: center;
      color: #fff; }
      @media print, screen and (min-width: 1023px) {
        #top .sec-recruit .summary {
          width: 50%; } }
      @media screen and (max-width: 1022px) {
        #top .sec-recruit .summary {
          padding: 5vw 0; } }
    #top .sec-recruit .title h2 {
      font-family: 'Roboto Condensed', sans-serif;
      font-size: 60px;
      font-size: 6rem;
      font-weight: bold;
      margin-top: 0;
      margin-bottom: 0;
      letter-spacing: 0.3em;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      line-height: 1.2; }
      @media screen and (min-width: 480px) and (max-width: 1200px) {
        #top .sec-recruit .title h2 {
          font-size: 7.5px;
          font-size: 4.8rem; } }
      @media screen and (max-width: 767px) {
        #top .sec-recruit .title h2 {
          font-size: 40px;
          font-size: 4rem; } }
  @media screen and (max-width: 767px) and (min-width: 480px) and (max-width: 1200px) {
    #top .sec-recruit .title h2 {
      font-size: 5px;
      font-size: 3.2rem; } }

    #top .sec-recruit .title .en {
      font-family: 'Josefin Sans', sans-serif;
      font-size: 20px;
      font-size: 2rem;
      letter-spacing: 0.2em;
      font-weight: bold;
      color: #00B0F0;
      display: block; }
      @media screen and (min-width: 480px) and (max-width: 1200px) {
        #top .sec-recruit .title .en {
          font-size: 2.5px;
          font-size: 1.6rem; } }
      @media screen and (max-width: 767px) {
        #top .sec-recruit .title .en {
          font-size: 18px;
          font-size: 1.8rem; } }
  @media screen and (max-width: 767px) and (min-width: 480px) and (max-width: 1200px) {
    #top .sec-recruit .title .en {
      font-size: 2.25px;
      font-size: 1.44rem; } }

    #top .sec-recruit .title .jp {
      font-size: 20px;
      font-size: 2rem; }
      @media screen and (min-width: 480px) and (max-width: 1200px) {
        #top .sec-recruit .title .jp {
          font-size: 2.5px;
          font-size: 1.6rem; } }
      @media screen and (max-width: 767px) {
        #top .sec-recruit .title .jp {
          font-size: 16px;
          font-size: 1.6rem; } }
  @media screen and (max-width: 767px) and (min-width: 480px) and (max-width: 1200px) {
    #top .sec-recruit .title .jp {
      font-size: 2px;
      font-size: 1.28rem; } }

    #top .sec-recruit .recruit-copy {
      font-size: 30px;
      font-size: 3rem; }
      @media screen and (min-width: 480px) and (max-width: 1200px) {
        #top .sec-recruit .recruit-copy {
          font-size: 3.75px;
          font-size: 2.4rem; } }
      #top .sec-recruit .recruit-copy p {
        margin-top: 1em; }
      @media screen and (max-width: 767px) {
        #top .sec-recruit .recruit-copy {
          font-size: 20px;
          font-size: 2rem; } }
  @media screen and (max-width: 767px) and (min-width: 480px) and (max-width: 1200px) {
    #top .sec-recruit .recruit-copy {
      font-size: 2.5px;
      font-size: 1.6rem; } }

  #top .sec-media .interview-wrap {
    margin: 6vw 0 4vw;
    background: #ebecf0; }
    #top .sec-media .interview-wrap .thumb .movie-content-wrap {
      position: relative;
      width: 100%;
      padding-top: 52.5%; }
      @media screen and (max-width: 767px) {
        #top .sec-media .interview-wrap .thumb .movie-content-wrap {
          padding-top: 56.25%; } }
    #top .sec-media .interview-wrap .thumb .movie-content-wrap iframe {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%; }
      @media screen and (max-width: 767px) {
        #top .sec-media .interview-wrap .thumb .movie-content-wrap iframe {
          display: none; } }
    #top .sec-media .interview-wrap .thumb .movie-content-wrap img {
      position: absolute;
      top: 0;
      left: 0;
      cursor: pointer; }
    #top .sec-media .interview-wrap .thumb .sp-spacer {
      display: none;
      width: 1px;
      height: 1px; }
    @media screen and (max-width: 767px) {
      #top .sec-media .interview-wrap .thumb .sp-spacer {
        display: block; } }
    @media print, screen and (min-width: 768px) {
      #top .sec-media .interview-wrap {
        -js-display: flex;
        display: -webkit-flex;
        display: flex;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-align-items: center;
        align-items: center; }
        #top .sec-media .interview-wrap .thumb {
          order: 2;
          width: 60%; }
        #top .sec-media .interview-wrap .text {
          width: 40%; } }
    #top .sec-media .interview-wrap .text {
      text-align: center; }
      #top .sec-media .interview-wrap .text .copy {
        text-align: center;
        font-size: 32px;
        font-size: 3.2rem;
        color: #000;
        font-weight: bold;
        margin: 0;
        letter-spacing: 0.15em;
        padding: 1em 0 0.5em; }
        @media screen and (min-width: 480px) and (max-width: 1200px) {
          #top .sec-media .interview-wrap .text .copy {
            font-size: 4px;
            font-size: 2.56rem; } }
        @media screen and (max-width: 767px) {
          #top .sec-media .interview-wrap .text .copy {
            font-size: 20px;
            font-size: 2rem;
            padding: 0.5em 0 0; } }
  @media screen and (max-width: 767px) and (min-width: 480px) and (max-width: 1200px) {
    #top .sec-media .interview-wrap .text .copy {
      font-size: 2.5px;
      font-size: 1.6rem; } }

      @media screen and (max-width: 767px) {
        #top .sec-media .interview-wrap .text {
          padding: 1em 0; } }
  #top .sec-news .news-contents {
    border-top: 1px solid #D9DBDC;
    margin: 2em 0; }
    #top .sec-news .news-contents dl {
      padding: 1em 0;
      margin: 0;
      position: relative;
      border-bottom: 1px solid #D9DBDC; }
      @media print, screen and (min-width: 768px) {
        #top .sec-news .news-contents dl {
          -js-display: flex;
          display: -webkit-flex;
          display: flex; }
          #top .sec-news .news-contents dl::after {
            font-family: ionicons;
            content: "";
            display: inline-block;
            font-size: 16px;
            font-size: 1.6rem;
            transition: all 0.3s;
            transform: translate(0, 0);
            position: absolute;
            color: #898989;
            right: 1vw; } }
    @media screen and (min-width: 768px) and (min-width: 480px) and (max-width: 1200px) {
      #top .sec-news .news-contents dl::after {
        font-size: 2px;
        font-size: 1.28rem; } }

      #top .sec-news .news-contents dl:hover {
        background: #EAECF0; }
        #top .sec-news .news-contents dl:hover::after {
          transform: translate(5px, 0);
          color: #003291; }
      #top .sec-news .news-contents dl dt {
        width: 12%;
        text-align: center; }
      #top .sec-news .news-contents dl dd .category-icon {
        background: #003291;
        font-size: 12px;
        font-size: 1.2rem;
        color: #fff;
        padding: 2px 10px 1px;
        line-height: 1;
        margin-right: 1.5em; }
        @media screen and (min-width: 480px) and (max-width: 1200px) {
          #top .sec-news .news-contents dl dd .category-icon {
            font-size: 1.5px;
            font-size: 0.96rem; } }
