@charset "UTF-8";
/*
---------------------------------------------------------------------------------------------------------------------
大切にしていること
---------------------------------------------------------------------------------------------------------------------
*/
#values {
  padding: 60px 0 0 0; }
  @media (min-width: 1024px) {
    #values {
      padding: 0 0 0 0;
      margin-top: 80px; } }
  @media (min-width: 1200px) {
    #values {
      margin-top: 120px; } }
  #values .values-in {
    background: linear-gradient(to bottom, #C1F1FF, #BFFFEF);
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    padding: 40px 0 60px; }
    @media (min-width: 1024px) {
      #values .values-in {
        padding: 80px 0 100px; } }
    @media (min-width: 1200px) {
      #values .values-in {
        border-top-left-radius: 40px;
        border-top-right-radius: 40px;
        margin-top: 120px;
        padding: 100px 0 140px; } }
  #values .values-contact {
    max-width: 1400px;
    margin: auto; }
    #values .values-contact .values-title {
      position: relative;
      padding: 0 5%; }
      #values .values-contact .values-title .txt {
        margin-top: 20px; }
        @media (min-width: 1200px) {
          #values .values-contact .values-title .txt {
            margin-top: 40px; } }
      #values .values-contact .values-title .tokarin {
        position: absolute;
        bottom: -120px;
        right: 5%;
        width: 260px; }
        @media (min-width: 768px) {
          #values .values-contact .values-title .tokarin {
            bottom: 0;
            width: 300px; } }
        @media (min-width: 1024px) {
          #values .values-contact .values-title .tokarin {
            bottom: -30px;
            width: 350px; } }
    #values .values-contact .values-grid {
      margin-top: 100px; }
      @media (min-width: 768px) {
        #values .values-contact .values-grid {
          margin: 40px auto 0;
          width: 70%; } }
      @media (min-width: 1024px) {
        #values .values-contact .values-grid {
          width: 96%; } }
      @media (min-width: 1200px) {
        #values .values-contact .values-grid {
          margin-top: 80px; } }
      #values .values-contact .values-grid ul {
        display: grid;
        align-items: start;
        grid-template-columns: repeat(2, 1fr); }
        @media (min-width: 1024px) {
          #values .values-contact .values-grid ul {
            grid-template-columns: repeat(4, 1fr); } }
        #values .values-contact .values-grid ul li {
          position: relative; }
          #values .values-contact .values-grid ul li:nth-child(even) {
            margin-top: 40px; }
          #values .values-contact .values-grid ul li .item {
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            display: flex;
            align-items: center;
            justify-content: center; }
            #values .values-contact .values-grid ul li .item .item-in {
              text-align: center; }
              #values .values-contact .values-grid ul li .item .item-in h6 {
                font-family: 'Montserrat', sans-serif;
                font-style: italic;
                font-weight: bold;
                font-size: 1em;
                line-height: 0.8em;
                color: #019A47; }
                @media (min-width: 768px) {
                  #values .values-contact .values-grid ul li .item .item-in h6 {
                    font-size: 1.125em; } }
                @media (min-width: 1200px) {
                  #values .values-contact .values-grid ul li .item .item-in h6 {
                    font-size: 1.25em; } }
              #values .values-contact .values-grid ul li .item .item-in .title {
                margin-top: 5px; }
                @media (min-width: 768px) {
                  #values .values-contact .values-grid ul li .item .item-in .title {
                    margin-top: 10px; } }
                #values .values-contact .values-grid ul li .item .item-in .title h2 {
                  font-size: 1.25em;
                  line-height: 1.2em;
                  color: #019A47; }
                  @media (min-width: 768px) {
                    #values .values-contact .values-grid ul li .item .item-in .title h2 {
                      font-size: 1.5em; } }
                  @media (min-width: 1200px) {
                    #values .values-contact .values-grid ul li .item .item-in .title h2 {
                      font-size: 2em; } }
                #values .values-contact .values-grid ul li .item .item-in .title img {
                  width: 150px; }
              #values .values-contact .values-grid ul li .item .item-in p {
                margin-top: 5px;
                text-align: center; }
                @media (min-width: 768px) {
                  #values .values-contact .values-grid ul li .item .item-in p {
                    margin-top: 10px; } }

/*
---------------------------------------------------------------------------------------------------------------------
職種について
---------------------------------------------------------------------------------------------------------------------
*/
#jobs {
  padding: 60px 0 0 0;
  margin-top: -60px; }
  @media (min-width: 1024px) {
    #jobs {
      padding: 0 0 0 0; } }
  @media (min-width: 1200px) {
    #jobs {
      margin-top: 0; } }
  #jobs .jobs-in {
    background-color: #0F7AC1;
    border-radius: 20px;
    margin-top: -20px;
    padding: 50px 0; }
    @media (min-width: 1024px) {
      #jobs .jobs-in {
        padding: 80px 0; } }
    @media (min-width: 1200px) {
      #jobs .jobs-in {
        border-radius: 40px;
        margin-top: -40px;
        padding: 100px 0; } }
  #jobs .jobs-contact {
    max-width: 1400px;
    margin: auto;
    width: 90%; }
    @media (min-width: 768px) {
      #jobs .jobs-contact {
        width: 95%; } }
    @media (min-width: 768px) {
      #jobs .jobs-contact .values-title {
        display: flex;
        padding: 0 0 0 2.5%; } }
    @media (min-width: 768px) {
      #jobs .jobs-contact .values-title .values-title-in {
        width: 45%;
        padding-right: 5%; } }
    #jobs .jobs-contact .values-title .values-title-in .txt {
      color: #fff;
      margin-top: 20px; }
      @media (min-width: 1200px) {
        #jobs .jobs-contact .values-title .values-title-in .txt {
          margin-top: 40px; } }
    #jobs .jobs-contact .values-title .rotation {
      border: 3px solid #15E5AD;
      border-radius: 40px;
      padding: 20px;
      margin-top: 20px; }
      @media (min-width: 768px) {
        #jobs .jobs-contact .values-title .rotation {
          display: flex;
          align-items: center;
          width: 55%;
          margin-top: 0; } }
      @media (min-width: 1200px) {
        #jobs .jobs-contact .values-title .rotation {
          border-radius: 60px;
          padding: 40px; } }
      #jobs .jobs-contact .values-title .rotation h3 {
        font-size: 1.125em;
        font-weight: bold;
        line-height: 1.4em; }
        @media (min-width: 768px) {
          #jobs .jobs-contact .values-title .rotation h3 {
            font-size: 1.35em; } }
        @media (min-width: 1200px) {
          #jobs .jobs-contact .values-title .rotation h3 {
            font-size: 1.75em; } }
      #jobs .jobs-contact .values-title .rotation .tokarin {
        display: flex;
        align-items: center; }
        @media (min-width: 768px) {
          #jobs .jobs-contact .values-title .rotation .tokarin {
            margin-top: auto; } }
        #jobs .jobs-contact .values-title .rotation .tokarin img {
          width: 60px;
          margin-right: 20px; }
          @media (min-width: 1200px) {
            #jobs .jobs-contact .values-title .rotation .tokarin img {
              width: 120px; } }
        #jobs .jobs-contact .values-title .rotation .tokarin h3 {
          color: #fff; }
          @media (min-width: 768px) {
            #jobs .jobs-contact .values-title .rotation .tokarin h3 {
              display: none; } }
      #jobs .jobs-contact .values-title .rotation .txt-area {
        width: 100%; }
        @media (min-width: 1200px) {
          #jobs .jobs-contact .values-title .rotation .txt-area {
            width: calc(100% - 120px);
            padding-left: 20px; } }
        #jobs .jobs-contact .values-title .rotation .txt-area .txt-area-in {
          color: #fff; }
          #jobs .jobs-contact .values-title .rotation .txt-area .txt-area-in h3 {
            display: none; }
            @media (min-width: 768px) {
              #jobs .jobs-contact .values-title .rotation .txt-area .txt-area-in h3 {
                display: block; } }
          #jobs .jobs-contact .values-title .rotation .txt-area .txt-area-in p {
            margin-top: 10px; }
            @media (min-width: 1200px) {
              #jobs .jobs-contact .values-title .rotation .txt-area .txt-area-in p {
                margin-top: 20px; } }
    #jobs .jobs-contact .job-grid {
      margin-top: 30px; }
      @media (min-width: 1200px) {
        #jobs .jobs-contact .job-grid {
          margin-top: 60px; } }
      #jobs .jobs-contact .job-grid .job-box {
        padding-top: 60px;
        margin: -60px 0 20px; }
        @media (min-width: 1200px) {
          #jobs .jobs-contact .job-grid .job-box {
            margin-bottom: 40px; } }
      #jobs .jobs-contact .job-grid .job-card {
        background-color: #fff;
        border-radius: 10px;
        padding: 30px 20px; }
        @media (min-width: 768px) {
          #jobs .jobs-contact .job-grid .job-card {
            padding: 60px 40px; } }
        @media (min-width: 1200px) {
          #jobs .jobs-contact .job-grid .job-card {
            border-radius: 20px;
            padding: 5%; } }
        #jobs .jobs-contact .job-grid .job-card:last-child {
          margin-bottom: 0; }
        @media (min-width: 768px) {
          #jobs .jobs-contact .job-grid .job-card .prologue {
            display: flex; } }
        #jobs .jobs-contact .job-grid .job-card .prologue .txt-area {
          margin-top: 20px; }
          @media (min-width: 768px) {
            #jobs .jobs-contact .job-grid .job-card .prologue .txt-area {
              width: 50%;
              padding-right: 5%;
              margin-top: 0; } }
          #jobs .jobs-contact .job-grid .job-card .prologue .txt-area .job-tilte h6 {
            font-family: 'Montserrat', sans-serif;
            font-style: italic;
            font-size: 1.125em;
            line-height: 1.0em;
            color: #019A47;
            margin: 0 5px 0 0; }
            @media (min-width: 768px) {
              #jobs .jobs-contact .job-grid .job-card .prologue .txt-area .job-tilte h6 {
                font-size: 1.35em; } }
            @media (min-width: 1200px) {
              #jobs .jobs-contact .job-grid .job-card .prologue .txt-area .job-tilte h6 {
                font-size: 1.75em; } }
          #jobs .jobs-contact .job-grid .job-card .prologue .txt-area .job-tilte h2 {
            position: relative;
            font-size: 1.5em;
            line-height: 1.2em;
            font-feature-settings: "palt";
            letter-spacing: 0.04em; }
            @media (min-width: 768px) {
              #jobs .jobs-contact .job-grid .job-card .prologue .txt-area .job-tilte h2 {
                font-size: 2.0em; } }
            @media (min-width: 1200px) {
              #jobs .jobs-contact .job-grid .job-card .prologue .txt-area .job-tilte h2 {
                font-size: 3.0em; } }
          #jobs .jobs-contact .job-grid .job-card .prologue .txt-area .txt {
            margin-top: 40px; }
            @media (min-width: 1200px) {
              #jobs .jobs-contact .job-grid .job-card .prologue .txt-area .txt {
                margin-top: 60px; } }
            #jobs .jobs-contact .job-grid .job-card .prologue .txt-area .txt h3 {
              font-size: 1.125em;
              font-weight: bold;
              line-height: 1.4em; }
              @media (min-width: 768px) {
                #jobs .jobs-contact .job-grid .job-card .prologue .txt-area .txt h3 {
                  font-size: 1.35em; } }
              @media (min-width: 1200px) {
                #jobs .jobs-contact .job-grid .job-card .prologue .txt-area .txt h3 {
                  font-size: 1.75em; } }
            #jobs .jobs-contact .job-grid .job-card .prologue .txt-area .txt p {
              margin-top: 10px; }
              @media (min-width: 1200px) {
                #jobs .jobs-contact .job-grid .job-card .prologue .txt-area .txt p {
                  margin-top: 20px; } }
          #jobs .jobs-contact .job-grid .job-card .prologue .txt-area .content {
            background-color: #E8FAFF;
            border-radius: 10px;
            padding: 20px;
            margin-top: 20px; }
            @media (min-width: 768px) {
              #jobs .jobs-contact .job-grid .job-card .prologue .txt-area .content {
                border-radius: 20px;
                padding: 30px; } }
            @media (min-width: 1200px) {
              #jobs .jobs-contact .job-grid .job-card .prologue .txt-area .content {
                padding: 40px;
                margin-top: 40px; } }
            #jobs .jobs-contact .job-grid .job-card .prologue .txt-area .content h4 {
              font-size: 0.8em;
              font-weight: bold;
              line-height: 1.4em;
              margin: 0 0 5px 0; }
              @media (min-width: 768px) {
                #jobs .jobs-contact .job-grid .job-card .prologue .txt-area .content h4 {
                  font-size: 0.9em; } }
              @media (min-width: 1200px) {
                #jobs .jobs-contact .job-grid .job-card .prologue .txt-area .content h4 {
                  font-size: 1.0em; } }
            #jobs .jobs-contact .job-grid .job-card .prologue .txt-area .content ul {
              margin-top: 10px; }
              @media (min-width: 1200px) {
                #jobs .jobs-contact .job-grid .job-card .prologue .txt-area .content ul {
                  margin-top: 20px; } }
              #jobs .jobs-contact .job-grid .job-card .prologue .txt-area .content ul li {
                font-size: 0.8em;
                line-height: 1.4em;
                padding-left: 1em;
                text-indent: -1em;
                margin: 0 0 5px 0; }
                @media (min-width: 768px) {
                  #jobs .jobs-contact .job-grid .job-card .prologue .txt-area .content ul li {
                    font-size: 0.9em; } }
                @media (min-width: 1200px) {
                  #jobs .jobs-contact .job-grid .job-card .prologue .txt-area .content ul li {
                    font-size: 1.0em; } }
        #jobs .jobs-contact .job-grid .job-card .prologue .photo-area {
          border-radius: 10px;
          overflow: hidden; }
          @media (min-width: 768px) {
            #jobs .jobs-contact .job-grid .job-card .prologue .photo-area {
              border-radius: 20px;
              width: 50%; } }
          #jobs .jobs-contact .job-grid .job-card .prologue .photo-area img {
            height: 100%;
            object-fit: cover;
            display: block; }
        #jobs .jobs-contact .job-grid .job-card .interview {
          margin-top: 40px; }
          @media (min-width: 1200px) {
            #jobs .jobs-contact .job-grid .job-card .interview {
              margin-top: 80px; } }
          #jobs .jobs-contact .job-grid .job-card .interview .title {
            border-bottom: 1px solid #019A47;
            padding-bottom: 10px; }
            #jobs .jobs-contact .job-grid .job-card .interview .title h3 {
              font-family: 'Montserrat', sans-serif;
              font-style: italic;
              font-weight: bold;
              font-size: 1.125em;
              line-height: 1.0em;
              text-align: justify;
              color: #019A47; }
              @media (min-width: 768px) {
                #jobs .jobs-contact .job-grid .job-card .interview .title h3 {
                  font-size: 1.35em; } }
              @media (min-width: 1200px) {
                #jobs .jobs-contact .job-grid .job-card .interview .title h3 {
                  font-size: 1.75em; } }
          #jobs .jobs-contact .job-grid .job-card .interview ul {
            display: grid;
            align-items: start;
            grid-template-columns: repeat(1, 1fr);
            margin-top: 20px;
            gap: 20px; }
            @media (min-width: 768px) {
              #jobs .jobs-contact .job-grid .job-card .interview ul {
                grid-template-columns: repeat(2, 1fr);
                gap: 30px; } }
            @media (min-width: 1024px) {
              #jobs .jobs-contact .job-grid .job-card .interview ul {
                gap: 60px; } }
            @media (min-width: 1200px) {
              #jobs .jobs-contact .job-grid .job-card .interview ul {
                margin-top: 40px;
                gap: 80px; } }
            #jobs .jobs-contact .job-grid .job-card .interview ul li a.interview-card {
              display: flex; }
              #jobs .jobs-contact .job-grid .job-card .interview ul li a.interview-card .photo {
                width: 30%; }
              #jobs .jobs-contact .job-grid .job-card .interview ul li a.interview-card .txt-area {
                width: 70%;
                padding-left: 20px;
                align-items: center;
                display: flex; }
                #jobs .jobs-contact .job-grid .job-card .interview ul li a.interview-card .txt-area p {
                  font-size: 0.9em;
                  line-height: 1.4em;
                  margin: 0 0 10px 0; }
                  @media (min-width: 768px) {
                    #jobs .jobs-contact .job-grid .job-card .interview ul li a.interview-card .txt-area p {
                      font-size: 1.0em; } }
                  @media (min-width: 1200px) {
                    #jobs .jobs-contact .job-grid .job-card .interview ul li a.interview-card .txt-area p {
                      font-size: 1.125em;
                      margin: 0 0 15px 0; } }
                #jobs .jobs-contact .job-grid .job-card .interview ul li a.interview-card .txt-area .name {
                  position: relative; }
                  #jobs .jobs-contact .job-grid .job-card .interview ul li a.interview-card .txt-area .name h4 {
                    font-size: 0.9em;
                    font-weight: bold;
                    line-height: 1.4em;
                    margin: 0 0 5px 0; }
                    @media (min-width: 1024px) {
                      #jobs .jobs-contact .job-grid .job-card .interview ul li a.interview-card .txt-area .name h4 {
                        font-size: 1.0em; } }
                    @media (min-width: 1200px) {
                      #jobs .jobs-contact .job-grid .job-card .interview ul li a.interview-card .txt-area .name h4 {
                        font-size: 1.125em; } }
                  #jobs .jobs-contact .job-grid .job-card .interview ul li a.interview-card .txt-area .name h5 {
                    font-size: 0.8em;
                    font-weight: normal;
                    color: #707070; }
                    @media (min-width: 1024px) {
                      #jobs .jobs-contact .job-grid .job-card .interview ul li a.interview-card .txt-area .name h5 {
                        font-size: 0.9em; } }
                    @media (min-width: 1200px) {
                      #jobs .jobs-contact .job-grid .job-card .interview ul li a.interview-card .txt-area .name h5 {
                        font-size: 1.0em; } }
                  #jobs .jobs-contact .job-grid .job-card .interview ul li a.interview-card .txt-area .name .common-btn {
                    position: absolute;
                    top: 0;
                    bottom: 0;
                    right: 0;
                    margin: auto;
                    display: flex;
                    align-items: center; }