@charset "UTF-8";
/*英字*/
/* -----------------------------------------------------
	top
----------------------------------------------------- */
#toppage {
  margin-top: -120px; }
  @media screen and (max-width: 768px) {
    #toppage {
      margin-top: -19.53125vw; } }
  #toppage .inner {
    max-width: 1560px;
    width: 100%; }
    @media screen and (max-width: 1560px) {
      #toppage .inner {
        padding: 0 4%; } }
    @media screen and (max-width: 768px) {
      #toppage .inner {
        padding: 0 6.51042vw; } }
  #toppage h2 {
    text-align: left;
    margin-top: 0;
    line-height: 1; }
    @media screen and (max-width: 1560px) {
      #toppage h2 {
        font-size: 5.38462vw; } }
    @media screen and (max-width: 768px) {
      #toppage h2 {
        font-size: 9.375vw; } }
    #toppage h2 span {
      line-height: 1; }
    #toppage h2 + p {
      text-align: left;
      margin: 35px 0; }
      @media screen and (max-width: 1560px) {
        #toppage h2 + p {
          font-size: 1.41026vw; } }
      @media screen and (max-width: 768px) {
        #toppage h2 + p {
          font-size: 3.64583vw;
          margin: 4.55729vw 0; } }
  #toppage .txtWrap {
    font-size: 1.6rem;
    line-height: 2.25; }
    @media screen and (max-width: 1560px) {
      #toppage .txtWrap {
        font-size: 1.02564vw; } }
    @media screen and (max-width: 768px) {
      #toppage .txtWrap {
        font-size: 3.64583vw; } }
  #toppage #kv {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 1.6%;
    min-height: 100vh; }
    @media screen and (max-width: 1560px) {
      #toppage #kv {
        padding: 6.41026vw 4%; } }
    @media screen and (max-width: 768px) {
      #toppage #kv {
        display: block;
        padding: 33.85417vw 6.51042vw 16.92708vw; } }
    #toppage #kv .gr_anime {
      font-weight: bold;
      line-height: 1.22;
      font-size: 10rem; }
      @media screen and (max-width: 1560px) {
        #toppage #kv .gr_anime {
          font-size: 6.41026vw; } }
      @media screen and (max-width: 768px) {
        #toppage #kv .gr_anime {
          font-size: 12.5vw; } }
      #toppage #kv .gr_anime span {
        background: -webkit-linear-gradient(60deg, #007b7b, #009999, #00bebe);
        display: inline-block;
        background-size: 350%;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        -webkit-animation: textAnime 5s infinite;
        animation: textAnime 5s infinite;
        line-height: 1.22; }

@-webkit-keyframes textAnime {
  0% {
    background-position: 0% 50%; }
  50% {
    background-position: 100% 50%; }
  100% {
    background-position: 0% 50%; } }

@keyframes textAnime {
  0% {
    background-position: 0% 50%; }
  50% {
    background-position: 100% 50%; }
  100% {
    background-position: 0% 50%; } }
    #toppage #kv .readTxt {
      margin-left: auto;
      margin-bottom: 0; }
      @media screen and (max-width: 1560px) {
        #toppage #kv .readTxt {
          font-size: 1.41026vw; } }
      @media screen and (max-width: 768px) {
        #toppage #kv .readTxt {
          margin-top: 13.02083vw;
          font-size: 3.51563vw; } }
      #toppage #kv .readTxt span {
        display: block;
        line-height: 2.27; }
        #toppage #kv .readTxt span:nth-of-type(2) {
          margin: 2em 0; }
    @media screen and (min-width: 769px) {
      #toppage #kv .scrolldown {
        position: absolute;
        bottom: 1%;
        right: 66px;
        -webkit-animation: arrowmove 1s ease-in-out infinite;
        animation: arrowmove 1s ease-in-out infinite;
        background: url(../img/top/scroll_icon.png) center/100% no-repeat;
        width: 9px;
        height: 93px; } }
  @media screen and (min-width: 769px) and (max-width: 1560px) {
    #toppage #kv .scrolldown {
      right: 2%; } }
    @media screen and (min-width: 769px) {
      @-webkit-keyframes arrowmove {
        0% {
          bottom: 1%; }
        50% {
          bottom: 3%; }
        100% {
          bottom: 1%; } }
      @keyframes arrowmove {
        0% {
          bottom: 1%; }
        50% {
          bottom: 3%; }
        100% {
          bottom: 1%; } } }
  #toppage #aboutus {
    background-color: #009999;
    color: #fff;
    position: relative; }
    @media screen and (max-width: 768px) {
      #toppage #aboutus {
        padding: 14.32292vw 0 16.27604vw; } }
    #toppage #aboutus .inner {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center; }
      @media screen and (min-width: 769px) {
        #toppage #aboutus .inner {
          padding-bottom: 5%; } }
      @media screen and (min-width: 769px) {
        #toppage #aboutus .inner .movie_wrapper::before {
          content: "";
          display: block;
          background: url(../img/top/img-about.jpg) 50%/cover no-repeat;
          width: 62.5vw;
          height: 44.2708vw;
          position: absolute;
          right: 0;
          top: 0; }
        #toppage #aboutus .inner .movie_wrapper::after {
          content: "";
          display: block;
          height: 44.2708vw;
          margin-left: auto;
          margin-bottom: 7%; } }
      @media screen and (max-width: 768px) {
        #toppage #aboutus .inner .movie_wrapper::after {
          content: "";
          display: block;
          background: url(../img/top/img-about.jpg) 50%/cover no-repeat;
          width: calc(100% + (100vw * ( 100 / 750 )));
          height: 65.10417vw;
          margin-left: -6.51042vw;
          margin-top: 9.11458vw;
          margin-bottom: 10.41667vw; } }
      @media screen and (max-width: 768px) {
        #toppage #aboutus .inner {
          display: block; } }
    #toppage #aboutus .cacthCopy {
      display: block;
      width: 100%;
      height: 47px;
      margin: 100px 0 45px;
      background: url(../img/top/txt-about_cach.svg) no-repeat left/contain; }
      @media screen and (max-width: 1560px) {
        #toppage #aboutus .cacthCopy {
          height: 3.01282vw;
          margin: 6.41026vw 0 2.88462vw; } }
      @media screen and (max-width: 768px) {
        #toppage #aboutus .cacthCopy {
          height: 7.03125vw;
          margin: 13.02083vw 0 7.8125vw; } }
      #toppage #aboutus .cacthCopy span {
        border: 0;
        -webkit-clip-path: inset(50%);
        clip-path: inset(50%);
        clip: rect(0, 0, 0, 0);
        height: 1px;
        overflow: hidden;
        padding: 0;
        position: absolute;
        white-space: nowrap;
        width: 1px; }
    #toppage #aboutus .txtWrap {
      font-weight: 700;
      font-size: 2.4rem;
      letter-spacing: .1em;
      margin-bottom: 60px; }
      @media screen and (max-width: 1560px) {
        #toppage #aboutus .txtWrap {
          font-size: 1.53846vw;
          margin-bottom: 3.84615vw; } }
      @media screen and (max-width: 768px) {
        #toppage #aboutus .txtWrap {
          font-size: 3.64583vw;
          margin-bottom: 0; } }
    #toppage #aboutus .btn {
      -webkit-box-shadow: 0px 0px 10px rgba(0, 99, 99, 0.25);
      box-shadow: 0px 0px 10px rgba(0, 99, 99, 0.25); }
      #toppage #aboutus .btnLink {
        background-color: #f1f1f1; }
        @media screen and (min-width: 769px) {
          #toppage #aboutus .btnLink {
            -webkit-transition: all .3s ease-in-out;
            -o-transition: all .3s ease-in-out;
            transition: all .3s ease-in-out; }
            #toppage #aboutus .btnLink:hover {
              color: #009999;
              opacity: .8; } }
  #toppage #business {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-top: 200px;
    padding-bottom: 200px; }
    @media screen and (max-width: 768px) {
      #toppage #business {
        display: block;
        padding-top: 13.02083vw;
        padding-bottom: 13.02083vw; } }
    #toppage #business h2 span {
      display: inline-block; }
    #toppage #business h2 + p {
      margin-bottom: 65px; }
      @media screen and (max-width: 1560px) {
        #toppage #business h2 + p {
          margin-bottom: 4.16667vw; } }
      @media screen and (max-width: 768px) {
        #toppage #business h2 + p {
          margin-bottom: 8.46354vw; } }
    #toppage #business .businessTxt {
      width: 26.28%; }
      @media screen and (max-width: 768px) {
        #toppage #business .businessTxt {
          width: 100%; } }
    #toppage #business .businessList {
      width: 73.72%;
      padding-left: 8.65%; }
      @media screen and (max-width: 1560px) {
        #toppage #business .businessList {
          padding-left: 5.12821vw; } }
      @media screen and (max-width: 768px) {
        #toppage #business .businessList {
          width: 100%;
          padding-left: 0; } }
      #toppage #business .businessList__item {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        width: 100%;
        border-bottom: 1px solid #bfbfbf;
        padding: 45px 15px; }
        @media screen and (max-width: 768px) {
          #toppage #business .businessList__item {
            display: block;
            padding: 13.02083vw 0; } }
        #toppage #business .businessList__item:first-of-type {
          padding-top: 2%; }
          @media screen and (max-width: 768px) {
            #toppage #business .businessList__item:first-of-type {
              padding-top: 13.02083vw; } }
        #toppage #business .businessList__item:last-of-type {
          border: none; }
        #toppage #business .businessList__item::before {
          content: "";
          display: block;
          width: 82px;
          height: 82px;
          margin-right: 50px; }
          @media screen and (max-width: 1560px) {
            #toppage #business .businessList__item::before {
              height: 5.25641vw;
              width: 5.25641vw; } }
          @media screen and (max-width: 768px) {
            #toppage #business .businessList__item::before {
              height: 21.35417vw;
              width: 21.35417vw;
              margin: auto; } }
        #toppage #business .businessList__itemTxt {
          -webkit-box-flex: 2;
          -ms-flex-positive: 2;
          flex-grow: 2; }
        #toppage #business .businessList__itemLink {
          -webkit-box-flex: 1;
          -ms-flex-positive: 1;
          flex-grow: 1;
          margin-left: 1%;
          min-width: 190px; }
          @media screen and (max-width: 1560px) {
            #toppage #business .businessList__itemLink {
              min-width: 12.17949vw; } }
          @media screen and (max-width: 768px) {
            #toppage #business .businessList__itemLink {
              margin-left: 0;
              margin-top: 9.11458vw; } }
        #toppage #business .businessList__item:nth-of-type(1)::before {
          background: url(../img/top/business_icon01.png) center/contain no-repeat; }
        #toppage #business .businessList__item:nth-of-type(1) .businessList__Ttl {
          background-image: url(../img/top/businessList_ttl01.svg); }
        #toppage #business .businessList__item:nth-of-type(2)::before {
          background: url(../img/top/business_icon02.png) center/contain no-repeat; }
        #toppage #business .businessList__item:nth-of-type(2) .businessList__Ttl {
          background-image: url(../img/top/businessList_ttl02.svg); }
        #toppage #business .businessList__item:nth-of-type(3)::before {
          background: url(../img/top/business_icon03.png) center/contain no-repeat; }
        #toppage #business .businessList__item:nth-of-type(3) .businessList__Ttl {
          background-image: url(../img/top/businessList_ttl03.svg); }
        #toppage #business .businessList__item:nth-of-type(4)::before {
          background: url(../img/top/business_icon04.png) center/contain no-repeat; }
        #toppage #business .businessList__item:nth-of-type(4) .businessList__Ttl {
          background-image: url(../img/top/businessList_ttl04.svg); }
        #toppage #business .businessList__item:nth-of-type(5)::before {
          background: url(../img/top/business_icon05.png) center/contain no-repeat; }
        #toppage #business .businessList__item:nth-of-type(5) .businessList__Ttl {
          background-image: url(../img/top/businessList_ttl05.svg); }
      #toppage #business .businessList__Ttl {
        display: block;
        width: 100%;
        height: 42px;
        margin-bottom: 20px;
        background-position: left;
        background-repeat: no-repeat;
        background-size: contain; }
        @media screen and (max-width: 1560px) {
          #toppage #business .businessList__Ttl {
            height: 2.69231vw; }
            #toppage #business .businessList__Ttl + p {
              font-size: 1.02564vw; } }
        @media screen and (max-width: 768px) {
          #toppage #business .businessList__Ttl {
            height: 5.59896vw;
            background-position: center;
            margin: 9.11458vw 0; }
            #toppage #business .businessList__Ttl + p {
              font-size: 3.64583vw; } }
        #toppage #business .businessList__Ttl span {
          border: 0;
          -webkit-clip-path: inset(50%);
          clip-path: inset(50%);
          clip: rect(0, 0, 0, 0);
          height: 1px;
          overflow: hidden;
          padding: 0;
          position: absolute;
          white-space: nowrap;
          width: 1px; }
  @media screen and (min-width: 769px) {
    #toppage #company::before {
      content: "";
      display: block;
      background: url(../img/top/img-company.jpg) 50%/cover no-repeat;
      width: 90.625vw;
      height: 37.5vw; } }
  #toppage #company .inner {
    padding-top: 60px;
    padding-bottom: 100px; }
    @media screen and (max-width: 768px) {
      #toppage #company .inner {
        padding-top: 0;
        padding-bottom: 19.53125vw; }
        #toppage #company .inner h2 + p::after {
          content: "";
          display: block;
          background: url(../img/top/img-company.jpg) 50%/cover no-repeat;
          width: calc(100% + (100vw * ( 100 / 750 )));
          height: 54.94792vw;
          margin-left: -6.51042vw;
          margin-top: 13.02083vw; } }
    #toppage #company .inner .btn {
      margin-top: 50px; }
      @media screen and (max-width: 768px) {
        #toppage #company .inner .btn {
          margin-top: 9.11458vw; } }
  #toppage #recruit {
    background: #fff;
    padding: 260px 0; }
    @media screen and (max-width: 768px) {
      #toppage #recruit {
        padding: 13.02083vw 0 19.53125vw; } }
    #toppage #recruit .inner {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center; }
      #toppage #recruit .inner .recTxt {
        width: 35.32%;
        margin-right: 5%; }
        #toppage #recruit .inner .recTxt .txtWrap {
          padding: 20px 0 60px; }
      #toppage #recruit .inner .btnLink.newWindow::after {
        content: "";
        width: .875em;
        height: .875em;
        margin-left: .5em;
        background: url(../img/top/icon-newin.svg) center/100% no-repeat;
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out; }
      #toppage #recruit .inner .btnLink.newWindow:hover::after {
        background: url(../img/top/icon-newin_w.svg) center/100% no-repeat; }
      @media screen and (min-width: 769px) {
        #toppage #recruit .inner::after {
          content: "";
          display: block;
          background: url(../img/top/img-recruit.jpg) 50%/cover no-repeat;
          width: 46.154%;
          height: calc(100vw * (480 / 1560));
          max-height: 480px;
          margin: auto; } }
      @media screen and (max-width: 768px) {
        #toppage #recruit .inner {
          display: block; }
          #toppage #recruit .inner .recTxt {
            width: 100%; }
            #toppage #recruit .inner .recTxt .txtWrap {
              padding: 5.20833vw 0 9.11458vw; }
              #toppage #recruit .inner .recTxt .txtWrap::after {
                content: "";
                display: block;
                background: url(../img/top/img-recruit.jpg) 50%/cover no-repeat;
                width: 84.63542vw;
                height: 56.38021vw;
                margin: 9.11458vw auto 0; } }
  #toppage #news {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-top: 200px;
    padding-bottom: 200px; }
    @media screen and (max-width: 768px) {
      #toppage #news {
        display: block;
        padding-top: 13.02083vw;
        padding-bottom: 19.53125vw; } }
    #toppage #news .newsTxt {
      margin-right: 12.82%;
      min-width: 200px; }
      #toppage #news .newsTxt .btn {
        margin-top: 55px; }
    #toppage #news .newsList {
      margin-top: 15px;
      width: 100%; }
      #toppage #news .newsList__item {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin-bottom: 60px; }
        @media screen and (max-width: 768px) {
          #toppage #news .newsList__item {
            display: block;
            margin: 9.11458vw 0; } }
        #toppage #news .newsList__item:last-of-type {
          margin-bottom: 0; }
        #toppage #news .newsList__item a {
          font-weight: 700; }
          @media screen and (min-width: 769px) {
            #toppage #news .newsList__item a:hover {
              color: #009999;
              opacity: 1;
              text-decoration: underline; } }
      #toppage #news .newsList__time {
        display: inline-block;
        color: #bfbfbf;
        width: 16%; }
        @media screen and (max-width: 1560px) {
          #toppage #news .newsList__time {
            font-size: 1.02564vw;
            margin-right: 3.84615vw; } }
        @media screen and (max-width: 768px) {
          #toppage #news .newsList__time {
            width: 100%;
            font-size: 3.64583vw;
            margin: 0 0 1.95313vw; } }
      #toppage #news .newsList p {
        width: 100%; }
    @media screen and (max-width: 768px) {
      #toppage #news .btn {
        margin-top: 9.11458vw; } }
  #toppage #contact {
    background-color: #009999;
    color: #fff;
    text-align: center;
    padding: 150px 1.5%; }
    @media screen and (max-width: 768px) {
      #toppage #contact {
        padding: 13.02083vw 6.51042vw 15.625vw; } }
    #toppage #contact h2 {
      text-align: center;
      font-size: 6.8rem; }
      #toppage #contact h2 + p {
        text-align: center;
        font-size: 2rem;
        margin: 25px 0 80px; }
      @media screen and (max-width: 768px) {
        #toppage #contact h2 {
          font-size: 9.375vw; }
          #toppage #contact h2 + p {
            font-size: 3.64583vw;
            margin: 3.25521vw 0 11.71875vw; } }
    #toppage #contact dt {
      font-size: 2rem;
      font-weight: 700; }
      @media screen and (max-width: 768px) {
        #toppage #contact dt {
          font-size: 3.64583vw; } }
    #toppage #contact dd {
      font-family: 'Kanit',YuGothic,'Hiragino Kaku Gothic ProN',Meiryo,sans-serif;
      font-size: 4.2rem;
      display: -webkit-inline-box;
      display: -ms-inline-flexbox;
      display: inline-flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center; }
      #toppage #contact dd::before {
        content: "";
        display: inline-block;
        width: 32px;
        height: 32px;
        background: url(../img/top/icon-tel.svg) center/100% no-repeat;
        margin: 5px 20px 0 0; }
      @media screen and (max-width: 768px) {
        #toppage #contact dd {
          font-size: 8.59375vw;
          margin-bottom: 9.11458vw; }
          #toppage #contact dd::before {
            width: 6.51042vw;
            height: 6.51042vw;
            margin: 0.65104vw 3.90625vw 0 0; } }
    #toppage #contact .conBtn {
      -webkit-box-shadow: 0px 0px 10px rgba(0, 99, 99, 0.25);
      box-shadow: 0px 0px 10px rgba(0, 99, 99, 0.25);
      margin: 70px auto 0;
      max-width: 350px;
      height: 60px;
      border-radius: 50vw;
      overflow: hidden; }
      @media screen and (max-width: 768px) {
        #toppage #contact .conBtn {
          max-width: 71.09375vw;
          height: 13.67188vw;
          margin: auto; } }
      #toppage #contact .conBtn .conBtnLink {
        background-color: #f1f1f1;
        color: #009999;
        font-weight: 700;
        width: 100%;
        height: 100%;
        display: block;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center; }
        @media screen and (min-width: 769px) {
          #toppage #contact .conBtn .conBtnLink {
            -webkit-transition: all .3s ease-in-out;
            -o-transition: all .3s ease-in-out;
            transition: all .3s ease-in-out; }
            #toppage #contact .conBtn .conBtnLink:hover {
              opacity: .8; } }