@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&display=swap");
/* ==========================================================================

COLOR

========================================================================== */
/* ==========================================================================

SCREEN

========================================================================== */
/* ==========================================================================

MODULE

========================================================================== */
/* ==========================================================================

BASE

========================================================================== */
@media only screen and (max-width: 750px) {
  .is-pc {
    display: none; } }

.is-sp {
  display: none; }
  @media only screen and (max-width: 750px) {
    .is-sp {
      display: inherit; } }
a img {
  -webkit-transition: all 0.5s ease-out;
  -moz-transition: all 0.5s ease-out;
  -ms-transition: all 0.5s ease-out;
  -o-transition: all 0.5s ease-out;
  transition: all 0.5s ease-out;
  border-style: none;
  border: 0;
  outline: none; }

img {
  vertical-align: bottom;
  max-width: 100%; }
  img.img100 {
    width: 100%;
    height: auto; }
  img.imgMax100 {
    max-width: 100%;
    height: auto; }
  @media only screen and (max-width: 750px) {
    img {
      max-width: 100%; } }
.objfit {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  font-family: 'object-fit: cover;'; }

/* clearfix
----------------------------------------------------------- */
/* For modern browsers */
.clearfix:before,
.clearfix:after {
  content: "";
  display: table; }

.clearfix:after {
  clear: both; }

/* ==========================================================================

MODULE

========================================================================== */
/* ==========================================================================

Layout

========================================================================== */
.c-content_inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px; }

/* ==========================================================================

BASE

========================================================================== */
* {
  margin: 0;
  padding: 0;
  font-size: 100%;
  font-style: normal; }

html {
  -webkit-text-size-adjust: 100%;
  font-size: 10px;
  /*
	visibility: hidden;
	&.wf-active {
		visibility: visible;
	}
	*/ }

body {
  font-family: "Noto Sans JP", "游ゴシック", "YuGothic", "メイリオ", "Meiryo", sans-serif;
  font-weight: 400;
  font-size: 1.6rem;
  line-height: 1.75;
  font-style: normal;
  color: #000;
  letter-spacing: 0.1em; }
  @media only screen and (max-width: 750px) {
    body {
      font-size: 1.2rem;
      line-height: 1.5;
      overflow-x: hidden; } }
li {
  list-style-type: none; }

main {
  display: block; }

h1, h2, h3, h4, h5, h6 {
  font-size: 2.2rem;
  font-weight: 500; }

a:focus, *:focus {
  outline: none; }

/* ==========================================================================

DEFAULT STYLE

========================================================================== */
a {
  color: #000; }
  a.link-underline {
    text-decoration: underline; }
  a:hover {
    color: #000; }
  a:visited {
    color: #000; }

li {
  list-style: none; }

table {
  border-collapse: separate;
  border-spacing: 0; }

/* ==========================================================================

HEADER

========================================================================== */
.h-header {
  padding: 25px 0;
  width: 100%;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 100; }
  @media only screen and (max-width: 750px) {
    .h-header {
      padding: 0; } }
  .h-header .h-globalnavi {
    padding-right: 10px;
    font-weight: 700;
    letter-spacing: 0; }
    @media only screen and (max-width: 750px) {
      .h-header .h-globalnavi {
        padding-right: 0;
        background-color: #e1f5e9;
        display: none; } }
    .h-header .h-globalnavi ul {
      display: -webkit-flex;
      display: -moz-flex;
      display: -ms-flex;
      display: -o-flex;
      display: flex;
      justify-content: flex-end;
      align-items: flex-start; }
      @media only screen and (max-width: 750px) {
        .h-header .h-globalnavi ul {
          padding: 30px;
          display: block;
          font-size: 1.6rem; } }
      .h-header .h-globalnavi ul li {
        margin-right: 25px; }
        @media only screen and (max-width: 750px) {
          .h-header .h-globalnavi ul li {
            margin: 0 0 20px; } }
        .h-header .h-globalnavi ul li a {
          text-decoration: none;
          position: relative; }
          .h-header .h-globalnavi ul li a::before {
            content: " ";
            display: block;
            height: 2px;
            width: 0;
            background-color: #000;
            position: absolute;
            bottom: -5px;
            left: 0;
            -webkit-transition: all 0.3s ease-out;
            -moz-transition: all 0.3s ease-out;
            -ms-transition: all 0.3s ease-out;
            -o-transition: all 0.3s ease-out;
            transition: all 0.3s ease-out; }
          @media only screen and (min-width: 751px) {
            .h-header .h-globalnavi ul li a:hover::before {
              width: 100%; } }
  .h-header .h-menu {
    display: none;
    width: 50px;
    height: 50px;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 10; }
    @media only screen and (max-width: 750px) {
      .h-header .h-menu {
        display: block; } }
    .h-header .h-menu span {
      display: block;
      width: 30px;
      height: 2px;
      background-color: #000;
      position: absolute;
      top: 50%;
      left: 10px;
      margin-top: -1px; }
      .h-header .h-menu span::before, .h-header .h-menu span::after {
        content: " ";
        width: 100%;
        height: 2px;
        background-color: #000;
        position: absolute;
        left: 0;
        -webkit-transition: all 0.3s ease-out;
        -moz-transition: all 0.3s ease-out;
        -ms-transition: all 0.3s ease-out;
        -o-transition: all 0.3s ease-out;
        transition: all 0.3s ease-out; }
      .h-header .h-menu span::before {
        top: -8px; }
      .h-header .h-menu span::after {
        bottom: -8px; }
    .h-header .h-menu.opened span {
      background-color: transparent; }
      .h-header .h-menu.opened span::before {
        top: 0;
        -webkit-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        transform: rotate(45deg); }
      .h-header .h-menu.opened span::after {
        bottom: 0;
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        transform: rotate(-45deg); }

/* ==========================================================================

CONTENT

========================================================================== */
/* =====================================
COMMON
======================================*/
.c-title .en {
  display: inline-block;
  font-size: 8.0rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.02em;
  color: #12ad58; }
  @media only screen and (max-width: 750px) {
    .c-title .en {
      font-size: 4.0rem; } }
  .c-title .en.vol02 {
    padding-right: 20px;
    position: relative; }
    @media only screen and (max-width: 750px) {
      .c-title .en.vol02 {
        padding-right: 10px; } }
    .c-title .en.vol02::before {
      content: " ";
      display: block;
      width: 80px;
      height: 1px;
      background-color: #000;
      position: absolute;
      top: 50%;
      right: -80px;
      margin-top: 10px; }
      @media only screen and (max-width: 750px) {
        .c-title .en.vol02::before {
          width: 40px;
          right: -40px;
          margin-top: 5px; } }
/* =====================================
キービジュアル
======================================*/
@media only screen and (max-width: 750px) {
  .t-mv h1 {
    overflow: hidden; } }

.t-mv h1 img {
  width: 100%;
  height: auto;
  max-width: inherit; }
  @media only screen and (max-width: 750px) {
    .t-mv h1 img {
      transform: scale(1.1); } }
/* =====================================
Vision
======================================*/
.t-vision {
  background: url(../img/vision_bg.jpg) 0 0 no-repeat;
  background-size: 40% auto; }
  @media only screen and (max-width: 750px) {
    .t-vision {
      background-size: 140px auto; } }
  .t-vision .c-content_inner {
    position: relative; }
    .t-vision .c-content_inner:before, .t-vision .c-content_inner:after {
      content: "";
      display: table; }
    .t-vision .c-content_inner:after {
      clear: both; }
    .t-vision .c-content_inner {
      zoom: 1; }
    .t-vision .c-content_inner::before {
      content: " ";
      display: block;
      width: 580px;
      height: 657px;
      background: url(../img/vision_shape.png) 0 0 no-repeat;
      position: absolute;
      bottom: 0;
      left: -5px;
      z-index: 0; }
      @media only screen and (max-width: 750px) {
        .t-vision .c-content_inner::before {
          width: 145px;
          height: 165px;
          background-size: 145px auto;
          bottom: inherit;
          top: 70px;
          left: 10px; } }
  .t-vision .t-vision_contents {
    padding-top: 85px;
    margin-right: 8.3333333333%;
    width: 48.3333333333%;
    float: right;
    position: relative;
    z-index: 1; }
    @media only screen and (max-width: 750px) {
      .t-vision .t-vision_contents {
        padding-top: 30px;
        margin-right: 0;
        width: auto;
        float: none; } }
  .t-vision .t-vision_main {
    max-width: 440px;
    margin: 0 auto 90px; }
    @media only screen and (max-width: 750px) {
      .t-vision .t-vision_main {
        padding-left: 140px;
        margin-bottom: 40px;
        max-width: inherit; } }
    .t-vision .t-vision_main .c-title {
      margin-bottom: 30px; }
      @media only screen and (max-width: 750px) {
        .t-vision .t-vision_main .c-title {
          margin-bottom: 15px; } }
    .t-vision .t-vision_main .t-vision_lead {
      margin-bottom: 25px;
      font-size: 3.2rem;
      font-weight: 700;
      letter-spacing: 0.08em;
      line-height: 1.4; }
      @media only screen and (max-width: 750px) {
        .t-vision .t-vision_main .t-vision_lead {
          margin-bottom: 15px;
          font-size: 2.2rem; } }
  .t-vision .t-vision_box {
    padding: 50px 45px;
    background-color: #f5f5f5;
    position: relative;
    box-shadow: 0 4px 16px rgba(39, 39, 39, 0.08); }
    @media only screen and (max-width: 750px) {
      .t-vision .t-vision_box {
        padding: 25px 20px;
        box-shadow: 0 4px 8px rgba(39, 39, 39, 0.08); } }
    .t-vision .t-vision_box::before {
      content: " ";
      display: block;
      width: 172px;
      height: 170px;
      background: url(../img/vision_icon.png) 0 0 no-repeat;
      position: absolute;
      top: -60px;
      right: -45px; }
      @media only screen and (max-width: 750px) {
        .t-vision .t-vision_box::before {
          width: 86px;
          height: 85px;
          background-size: 86px auto;
          top: -15px;
          right: -15px; } }
    .t-vision .t-vision_box .t-vision_copy {
      font-size: 1.4rem;
      font-weight: 700;
      color: #12ad58; }
    .t-vision .t-vision_box h3 {
      padding-right: 85px;
      margin-bottom: 18px;
      font-size: 2.8rem;
      font-weight: 700;
      line-height: 1.4;
      font-feature-settings: "palt"; }
      @media only screen and (max-width: 750px) {
        .t-vision .t-vision_box h3 {
          padding-right: 40px;
          margin-bottom: 9px;
          font-size: 2.0rem; } }
/* =====================================
What we do
======================================*/
.t-what {
  margin-top: 65px;
  padding-top: 50px; }
  @media only screen and (max-width: 750px) {
    .t-what {
      margin-top: 30px;
      padding-top: 20px; } }
  .t-what .c-title {
    text-align: center;
    position: relative;
    z-index: 1; }
  .t-what .t-what_list {
    margin-top: -45px;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    position: relative;
    z-index: 0;
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 0 4px 16px rgba(39, 39, 39, 0.08);
    background: url(../img/what_bg.png) center/cover no-repeat #e1f5e9; }
    @media only screen and (max-width: 750px) {
      .t-what .t-what_list {
        margin-top: -20px;
        display: block;
        box-shadow: 0 4px 8px rgba(39, 39, 39, 0.08);
        background: url(../img/what_bg01.png) left bottom/300px auto no-repeat, url(../img/what_bg02.png) right top/250px auto no-repeat;
        background-color: #e1f5e9; } }
    .t-what .t-what_list li {
      width: 50%;
      border-right: 2px solid #fff;
      position: relative; }
      @media only screen and (max-width: 750px) {
        .t-what .t-what_list li {
          margin-right: 0;
          width: auto;
          border-right: 0;
          border-bottom: 1px solid #fff; } }
      .t-what .t-what_list li::before {
        content: "01";
        display: block;
        font-size: 16.0rem;
        font-weight: 700;
        letter-spacing: 0;
        color: #fff;
        line-height: 1.1;
        width: 100%;
        position: absolute;
        top: 50%;
        left: 0;
        z-index: 0;
        text-align: center;
        -webkit-transform: translate(0, -50%);
        -moz-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        -o-transform: translate(0, -50%);
        transform: translate(0, -50%);
        margin-top: -5px; }
        @media only screen and (max-width: 750px) {
          .t-what .t-what_list li::before {
            font-size: 8.0rem;
            margin-top: -3px; } }
      @media only screen and (max-width: 750px) {
        .t-what .t-what_list li:nth-child(1) {
          background-size: 150px auto; } }
      .t-what .t-what_list li:nth-child(1)::before {
        content: "01"; }
      @media only screen and (max-width: 750px) {
        .t-what .t-what_list li:nth-child(2) {
          background-size: 150px auto; } }
      .t-what .t-what_list li:nth-child(2)::before {
        content: "02"; }
      @media only screen and (max-width: 750px) {
        .t-what .t-what_list li:nth-child(3) {
          margin-bottom: 0;
          background-size: 150px auto; } }
      .t-what .t-what_list li:nth-child(3)::before {
        content: "03"; }
      @media only screen and (max-width: 750px) {
        .t-what .t-what_list li:nth-child(4) {
          margin-bottom: 0;
          background-size: 150px auto; } }
      .t-what .t-what_list li:nth-child(4)::before {
        content: "04"; }
      .t-what .t-what_list li:last-child {
        border-right: 0; }
        @media only screen and (max-width: 750px) {
          .t-what .t-what_list li:last-child {
            border-bottom: 0; } }
      .t-what .t-what_list li div {
        width: 100%;
        padding-bottom: 144.6666666667%;
        position: relative; }
        @media only screen and (max-width: 750px) {
          .t-what .t-what_list li div {
            padding-bottom: 120px; } }
        .t-what .t-what_list li div p {
          font-size: 2.8rem;
          font-weight: 700;
          line-height: 1.4;
          letter-spacing: 0.02em;
          width: 100%;
          position: absolute;
          top: 50%;
          left: 0;
          z-index: 2;
          text-align: center;
          -webkit-transform: translate(0, -50%);
          -moz-transform: translate(0, -50%);
          -ms-transform: translate(0, -50%);
          -o-transform: translate(0, -50%);
          transform: translate(0, -50%); }
          @media only screen and (max-width: 750px) {
            .t-what .t-what_list li div p {
              font-size: 1.8rem; } }
/* =====================================
CEO
======================================*/
.t-clients {
  margin-top: 65px; }
  @media only screen and (max-width: 750px) {
    .t-clients {
      margin-top: 30px; } }
  .t-clients .c-title {
    text-align: center;
    position: relative;
    z-index: 1; }
  .t-clients .box {
    padding: 95px 60px 85px;
    margin-top: -40px;
    background-color: #f5f5f5;
    box-shadow: 4px 4px 16px rgba(39, 39, 39, 0.08);
    text-align: center; }
    @media only screen and (max-width: 750px) {
      .t-clients .box {
        padding: 40px 20px 30px;
        margin-top: -20px;
        box-shadow: 2px 2px 8px rgba(39, 39, 39, 0.08); } }
  .t-clients .box > img {
    max-width: 100%;
    display: block;
    margin: 0 auto; }
  .t-clients .new-logos {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 45px 60px;
    margin-bottom: 60px; }
  .t-clients .new-logos img {
    display: inline-block !important;
    height: 36px !important;
    width: auto !important;
    max-width: none !important;
    object-fit: contain; }
  .t-clients .new-logos img.logo-lg {
    height: 55px !important; }
  .t-clients .new-logos img.logo-xl {
    height: 80px !important; }
    @media only screen and (max-width: 750px) {
      .t-clients .new-logos {
        gap: 30px 30px;
        margin-bottom: 35px; }
      .t-clients .new-logos img {
        height: 24px !important; }
      .t-clients .new-logos img.logo-lg {
        height: 36px !important; }
      .t-clients .new-logos img.logo-xl {
        height: 50px !important; } }
/* =====================================
CEO
======================================*/
.t-bg {
  background: url(../img/ceo_bg.jpg) 0 0/100% auto no-repeat, url(../img/contact_bg.png) 0 bottom no-repeat;
  background-color: #12ad58; }
  @media only screen and (max-width: 750px) {
    .t-bg {
      background: url(../img/ceo_bg.jpg) 0 0 / 140% auto no-repeat, url(../img/contact_bg.png) 0 bottom no-repeat;
      background-color: #12ad58; } }
.t-ceo {
  margin-top: 150px; }
  @media only screen and (max-width: 750px) {
    .t-ceo {
      margin-top: 50px; } }
  .t-ceo .t-ceo_box {
    padding: 50px 100px 65px;
    border-radius: 5px;
    background-color: #fff;
    box-shadow: 0 4px 16px rgba(39, 39, 39, 0.08);
    box-sizing: border-box; }
    @media only screen and (max-width: 750px) {
      .t-ceo .t-ceo_box {
        padding: 25px 30px 30px;
        box-shadow: 0 4px 8px rgba(39, 39, 39, 0.08); } }
    .t-ceo .t-ceo_box .c-title {
      margin-bottom: 40px; }
      @media only screen and (max-width: 750px) {
        .t-ceo .t-ceo_box .c-title {
          margin-bottom: 15px; } }
    .t-ceo .t-ceo_box .t-ceo_name {
      margin-bottom: 22px;
      font-size: 3.2rem;
      font-weight: 700;
      line-height: 1.3;
      letter-spacing: 0.02em; }
      @media only screen and (max-width: 750px) {
        .t-ceo .t-ceo_box .t-ceo_name {
          margin-bottom: 15px;
          font-size: 2.2rem; } }
    .t-ceo .t-ceo_box .t-ceo_text {
      line-height: 1.55;
      letter-spacing: 0.02em; }

/* =====================================
Company
======================================*/
.t-company {
  margin-top: 150px; }
  @media only screen and (max-width: 750px) {
    .t-company {
      margin-top: 50px; } }
  .t-company .t-company_box {
    max-width: 1000px;
    padding: 50px;
    border-radius: 5px;
    margin: 0 auto;
    background-color: #fff;
    box-shadow: 0 4px 16px rgba(39, 39, 39, 0.08);
    box-sizing: border-box; }
    @media only screen and (max-width: 750px) {
      .t-company .t-company_box {
        padding: 25px 30px 30px;
        box-shadow: 0 4px 8px rgba(39, 39, 39, 0.08); } }
    .t-company .t-company_box .c-title {
      margin-bottom: 35px;
      text-align: center; }
      @media only screen and (max-width: 750px) {
        .t-company .t-company_box .c-title {
          margin-bottom: 25px; } }
    .t-company .t-company_box .t-company_list {
      max-width: 640px;
      margin: 0 auto; }
      .t-company .t-company_box .t-company_list dl {
        padding: 10px 0;
        border-bottom: 1px solid #e6e6e6;
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: -o-flex;
        display: flex;
        justify-content: flex-start;
        align-items: flex-start;
        letter-spacing: 0.02em;
        font-weight: 700; }
        .t-company .t-company_box .t-company_list dl:last-child {
          border-bottom: 0; }
        .t-company .t-company_box .t-company_list dl dt {
          width: 40.625%;
          text-align: center; }
        .t-company .t-company_box .t-company_list dl dd {
          width: 59.375%; }

/* =====================================
Contact
======================================*/
.t-contact {
  padding: 50px 0 125px;
  margin-top: 190px; }
  @media only screen and (max-width: 750px) {
    .t-contact {
      padding: 20px 0 50px;
      margin-top: 30px; } }
  .t-contact .c-title {
    margin-bottom: 40px;
    text-align: center; }
    @media only screen and (max-width: 750px) {
      .t-contact .c-title {
        margin-bottom: 15px; } }
    .t-contact .c-title .en {
      color: #fff; }
  .t-contact .t-company_text {
    text-align: center;
    color: #fff;
    letter-spacing: 0.02em; }
  .t-contact .t-company_btn {
    margin: 55px auto 0;
    max-width: 500px;
    text-align: center;
    font-size: 3.0rem;
    font-weight: 700;
    line-height: 1.4; }
    @media only screen and (max-width: 750px) {
      .t-contact .t-company_btn {
        margin-top: 20px;
        max-width: 300px;
        font-size: 2.0rem; } }
    .t-contact .t-company_btn a {
      display: block;
      padding-top: 25px;
      border-radius: 5px;
      background: url(../img/contact_mail.png) 10px center no-repeat;
      background-color: #fff;
      height: 100px;
      box-sizing: border-box;
      color: #005928;
      text-decoration: none;
      box-shadow: 0 4px 20px rgba(39, 39, 39, 0.3);
      -webkit-transition: all 0.3s ease-out;
      -moz-transition: all 0.3s ease-out;
      -ms-transition: all 0.3s ease-out;
      -o-transition: all 0.3s ease-out;
      transition: all 0.3s ease-out; }
      @media only screen and (min-width: 751px) {
        .t-contact .t-company_btn a:hover {
          background-color: #d2f0df; } }
      @media only screen and (max-width: 750px) {
        .t-contact .t-company_btn a {
          background-size: 90px auto;
          padding-top: 20px;
          height: 70px;
          box-shadow: 0 4px 10px rgba(39, 39, 39, 0.3); } }
/* ==========================================================================

FOOTER

========================================================================== */
.f-footer {
  background-color: #333333; }
  .f-footer .f-copyright {
    padding: 10px 0;
    font-size: 1.4rem;
    font-weight: 400;
    color: #fff;
    text-align: center; }
    @media only screen and (max-width: 750px) {
      .f-footer .f-copyright {
        font-size: 1.2rem; } }