@charset "UTF-8";
#visual {
  position: relative;
  width: 100%;
  aspect-ratio: 1713/970;
  min-height: 600px;
  max-height: 80vh;
  background: #fff; }
  @media (max-width: 480px) {
    #visual {
      min-width: 100%;
      max-height: unset;
      min-height: auto;
      aspect-ratio: 780 / 936; } }
  #visual .visual {
    position: relative;
    max-width: 1600px;
    min-width: 1100px;
    height: 100%;
    margin: 0 auto;
    border-radius: 0 0 80px 80px;
    overflow: hidden; }
    @media (max-width: 480px) {
      #visual .visual {
        max-width: 100%;
        min-width: 100%;
        border-radius: 0 0 25px 25px; } }
    #visual .visual #photo {
      position: relative;
      width: 100%;
      height: 100%;
      margin: 0 auto;
      overflow: hidden; }
      #visual .visual #photo img {
        position: absolute;
        -o-object-fit: cover;
           object-fit: cover;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0; }
    #visual .visual .visual_title {
      position: absolute;
      display: inline-block;
      width: 100%;
      bottom: 50px;
      left: 50%;
      -webkit-transform: translateX(-520px);
              transform: translateX(-520px);
      z-index: 50; }
      @media (max-width: 480px) {
        #visual .visual .visual_title {
          padding: 0 5vw;
          bottom: 3vw;
          left: 0;
          -webkit-transform: none;
                  transform: none; } }
      #visual .visual .visual_title .main_text {
        font-size: 6.6rem;
        line-height: 1.2;
        margin-bottom: 30px;
        text-shadow: 0px 0px 5px #fff, 0px 0px 5px #fff, 0px 0px 5px #fff, 0px 0px 15px #fff, 0px 0px 15px #fff, 0px 0px 15px #fff; }
        @media (max-width: 480px) {
          #visual .visual .visual_title .main_text {
            font-size: 9.6vw;
            margin-bottom: 5vw;
            letter-spacing: 0.3vw; } }
        #visual .visual .visual_title .main_text p {
          margin-bottom: 0; }
      #visual .visual .visual_title .sub_text {
        color: #1d50a2;
        font-size: 3rem;
        line-height: 1;
        letter-spacing: 0.01rem;
        text-shadow: 0px 0px 5px #fff, 0px 0px 5px #fff, 0px 0px 5px #fff, 0px 0px 15px #fff, 0px 0px 15px #fff, 0px 0px 15px #fff; }
        @media (max-width: 480px) {
          #visual .visual .visual_title .sub_text {
            font-size: 4.3vw;
            white-space: nowrap; } }
        #visual .visual .visual_title .sub_text .large {
          font-size: 4.3rem; }
          @media (max-width: 480px) {
            #visual .visual .visual_title .sub_text .large {
              font-size: 6vw; } }
          #visual .visual .visual_title .sub_text .large .ml-10 {
            margin-left: -10px; }
            @media (max-width: 480px) {
              #visual .visual .visual_title .sub_text .large .ml-10 {
                margin-left: -3vw; } }
          #visual .visual .visual_title .sub_text .large .ml-40 {
            margin-left: -40px; }
            @media (max-width: 480px) {
              #visual .visual .visual_title .sub_text .large .ml-40 {
                margin-left: -6vw; } }

#contents {
  overflow: hidden; }
  #contents .philosophy .ttl_area::before {
    position: absolute;
    content: "";
    width: 629px;
    height: 583px;
    top: -120px;
    left: 50%;
    -webkit-transform: translateX(310px);
            transform: translateX(310px);
    background-image: url(../img/clover-yellow.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain; }
    @media (max-width: 480px) {
      #contents .philosophy .ttl_area::before {
        width: 48vw;
        height: 48vw;
        top: -15.4vw;
        -webkit-transform: translateX(12vw);
                transform: translateX(12vw); } }
  #contents .philosophy_inner {
    width: 900px;
    margin: 0 auto; }
    @media (max-width: 480px) {
      #contents .philosophy_inner {
        width: 100%; } }
    #contents .philosophy_inner .slogan {
      text-align: center;
      margin-bottom: 85px; }
      @media (max-width: 480px) {
        #contents .philosophy_inner .slogan {
          margin-bottom: 9vw; } }
      #contents .philosophy_inner .slogan .main_text {
        position: relative;
        font-size: 6.5rem;
        color: #1d50a2;
        line-height: 1;
        letter-spacing: 1rem;
        margin-bottom: 40px; }
        @media (max-width: 480px) {
          #contents .philosophy_inner .slogan .main_text {
            font-size: 9.4vw;
            letter-spacing: 0.6vw;
            margin-bottom: 4vw; } }
        #contents .philosophy_inner .slogan .main_text::before {
          position: absolute;
          content: "";
          display: block;
          width: 312px;
          height: 91px;
          top: -12px;
          left: 19.5%;
          background-image: url(../img/text-bg.png);
          background-repeat: no-repeat;
          background-position: top left;
          background-size: contain; }
          @media (max-width: 480px) {
            #contents .philosophy_inner .slogan .main_text::before {
              width: 60vw;
              height: 13vw;
              left: 12vw;
              top: -1.4vw; } }
      #contents .philosophy_inner .slogan .sub_text {
        font-size: 2rem;
        font-family: "Lato", sans-serif;
        font-weight: 400;
        font-style: normal;
        color: #c4c4c4;
        line-height: 1; }
        @media (max-width: 480px) {
          #contents .philosophy_inner .slogan .sub_text {
            font-size: 2.8vw; } }
        #contents .philosophy_inner .slogan .sub_text .c-bule {
          color: #1d50a2; }
    #contents .philosophy_inner .msg_area {
      position: relative;
      z-index: 1; }
      @media (max-width: 480px) {
        #contents .philosophy_inner .msg_area {
          padding: 0 3.9vw; } }
      #contents .philosophy_inner .msg_area .explanation {
        letter-spacing: 0.1rem;
        margin-bottom: 90px; }
        @media (max-width: 480px) {
          #contents .philosophy_inner .msg_area .explanation {
            font-size: 4.1vw;
            letter-spacing: 0.1vw;
            margin-bottom: 10.8vw; } }
      @media (max-width: 480px) {
        #contents .philosophy_inner .msg_area .list {
          padding: 0 4vw; } }
      #contents .philosophy_inner .msg_area .list ol {
        font-size: 2rem;
        list-style: auto;
        padding-left: 1.5em; }
        @media (max-width: 480px) {
          #contents .philosophy_inner .msg_area .list ol {
            font-size: 4.4vw;
            line-height: 1.3; } }
        @media (max-width: 480px) {
          #contents .philosophy_inner .msg_area .list ol li {
            padding-left: 1vw;
            margin-bottom: 3vw; } }
  #contents .service .ttl_area {
    z-index: 0; }
    #contents .service .ttl_area::before {
      position: absolute;
      content: "";
      width: 497px;
      height: 497px;
      top: -157%;
      left: 50%;
      -webkit-transform: translateX(-750px);
              transform: translateX(-750px);
      background-image: url(../img/clover-blur.png);
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain;
      z-index: -1; }
      @media (max-width: 480px) {
        #contents .service .ttl_area::before {
          content: none; } }
  #contents .service .reduce {
    margin-left: -20px; }
    @media (max-width: 480px) {
      #contents .service .reduce {
        margin-left: -3vw; } }
  #contents .company {
    padding-bottom: 120px; }
    @media (max-width: 480px) {
      #contents .company {
        padding-bottom: 15vw; } }
    #contents .company .ttl_area::before {
      position: absolute;
      content: "";
      width: 487px;
      height: 487px;
      top: -210px;
      left: 50%;
      -webkit-transform: translateX(270px);
              transform: translateX(270px);
      background-image: url(../img/clover-blue.png);
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain;
      opacity: 0.5; }
      @media (max-width: 480px) {
        #contents .company .ttl_area::before {
          width: 38vw;
          height: 38vw;
          top: -26vw;
          -webkit-transform: translateX(14vw);
                  transform: translateX(14vw); } }
    #contents .company .section_inner {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      width: 1100px;
      margin: 0 auto;
      gap: 60px;
      font-size: 1.6rem; }
      @media (max-width: 480px) {
        #contents .company .section_inner {
          width: 100%;
          -webkit-box-orient: vertical;
          -webkit-box-direction: normal;
              -ms-flex-direction: column;
                  flex-direction: column;
          padding: 0 3.9vw;
          gap: 10vw; } }
      #contents .company .section_inner .img_area {
        position: relative;
        display: inline-block;
        z-index: 0; }
        @media (max-width: 480px) {
          #contents .company .section_inner .img_area {
            width: 100%; } }
        #contents .company .section_inner .img_area img {
          display: block;
          border-radius: 0 60px 0 60px; }
          @media (max-width: 480px) {
            #contents .company .section_inner .img_area img {
              width: 96%;
              border-radius: 0 30px 0 30px; } }
        #contents .company .section_inner .img_area::after {
          content: "";
          position: absolute;
          right: -20px;
          bottom: -20px;
          width: 600px;
          height: 416px;
          border: 1px solid #0f589480;
          border-radius: 0 60px 0 60px;
          pointer-events: none;
          -webkit-box-sizing: border-box;
                  box-sizing: border-box;
          z-index: -1; }
          @media (max-width: 480px) {
            #contents .company .section_inner .img_area::after {
              width: 96%;
              height: 60vw;
              right: 0;
              bottom: -4vw;
              border-radius: 0 30px 0 30px; } }
      #contents .company .section_inner .txt_area p {
        margin-bottom: 46px; }
        @media (max-width: 480px) {
          #contents .company .section_inner .txt_area p {
            font-size: 4.1vw;
            line-height: 1.6;
            letter-spacing: 0.08vw;
            margin-bottom: 9.6vw; } }
      #contents .company .section_inner .txt_area .btn {
        text-align: center;
        font-size: 1.8rem;
        line-height: 1; }
        @media (max-width: 480px) {
          #contents .company .section_inner .txt_area .btn {
            font-size: 4.25vw; } }
        #contents .company .section_inner .txt_area .btn a {
          position: relative;
          display: block;
          width: 100%;
          padding: 24px;
          color: #333;
          background-color: #fff;
          border: 1px solid #1d50a2;
          border-radius: 50px;
          text-decoration: none;
          -webkit-transition: background-color 0.3s;
          transition: background-color 0.3s; }
          @media (max-width: 480px) {
            #contents .company .section_inner .txt_area .btn a {
              padding: 5vw; } }
          #contents .company .section_inner .txt_area .btn a::before {
            content: '';
            position: absolute;
            top: 0;
            bottom: 0;
            right: 10px;
            width: 48px;
            height: 48px;
            margin: auto;
            border-radius: 50px;
            background-color: #1d50a2;
            -webkit-transition: background-color 0.3s, border-color 0.3s;
            transition: background-color 0.3s, border-color 0.3s; }
            @media (max-width: 480px) {
              #contents .company .section_inner .txt_area .btn a::before {
                width: 8vw;
                height: 8vw;
                right: 4vw; } }
          #contents .company .section_inner .txt_area .btn a::after {
            content: '→';
            position: absolute;
            font-size: 2.4rem;
            top: 50%;
            right: 10px;
            -webkit-transform: translateY(-50%);
                    transform: translateY(-50%);
            width: 48px;
            height: 48px;
            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;
            color: #fff;
            -webkit-transition: color 0.3s;
            transition: color 0.3s; }
            @media (max-width: 480px) {
              #contents .company .section_inner .txt_area .btn a::after {
                font-size: 4.5vw;
                right: 4vw;
                width: 8vw;
                height: 8vw; } }
          #contents .company .section_inner .txt_area .btn a:hover {
            color: #fff;
            background-color: #1d50a2; }
            @media (max-width: 480px) {
              #contents .company .section_inner .txt_area .btn a:hover {
                color: #333;
                background-color: #fff; } }
            #contents .company .section_inner .txt_area .btn a:hover::before {
              background-color: #fff; }
              @media (max-width: 480px) {
                #contents .company .section_inner .txt_area .btn a:hover::before {
                  background-color: #1d50a2; } }
            #contents .company .section_inner .txt_area .btn a:hover::after {
              color: #1d50a2; }
              @media (max-width: 480px) {
                #contents .company .section_inner .txt_area .btn a:hover::after {
                  color: #fff; } }