.nav-pc li:nth-child(3) a {
  color: #9fc53c; }
  .nav-pc li:nth-child(3) a::before {
    background-color: #9fc53c;
    width: 100%; }

.section-philosophy {
  position: relative;
  padding: 12vw 0;
  overflow: hidden; }
  .section-philosophy::before {
    content: "PHILOSOPHY";
    position: absolute;
    top: -1.818vw;
    left: 0;
    z-index: -1;
    font-family: "Outfit", sans-serif;
    font-size: 12.121vw;
    font-weight: 600;
    line-height: 1;
    color: #f5f5f5;
    transform: skewX(-8deg);
    letter-spacing: -0.1em; }
  .section-philosophy::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    bottom: 0;
    transform: translateY(-60%) perspective(21vw) rotateX(23deg);
    z-index: -1;
    background-color: #f5f5f5;
    mask-image: url("../../img/common/title-map.png");
    mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center right;
    width: 50%;
    height: 140%; }
    @media screen and (max-width: 768px) {
      .section-philosophy::after {
        top: 30%; } }
  .section-philosophy .box {
    display: grid;
    grid-template-columns: 36vw auto;
    gap: 20px; }
    @media screen and (max-width: 768px) {
      .section-philosophy .box {
        grid-template-columns: 1fr; } }
    .section-philosophy .box__left .txt01 {
      margin-top: 4.545vw;
      font-size: 2.4vw;
      font-weight: 600;
      line-height: 1.4; }
      @media screen and (max-width: 768px) {
        .section-philosophy .box__left .txt01 {
          margin-top: 35px;
          font-size: 18.6px; } }
      .section-philosophy .box__left .txt01 span {
        color: #9fc53c; }
    .section-philosophy .box__right .txt01 {
      margin-top: 4vw;
      line-height: 2; }
      @media screen and (max-width: 768px) {
        .section-philosophy .box__right .txt01 {
          margin-top: 30px; } }
      @media screen and (max-width: 768px) {
        .section-philosophy .box__right .txt01 {
          margin-top: 30px; } }
.section-system {
  position: relative;
  z-index: 0;
  background-color: #e9e9e9;
  padding: 4vw 0 10vw;
  overflow: hidden; }
  .section-system::after {
    content: "CLASS1 SYSTEM";
    position: absolute;
    bottom: -0.6vw;
    right: 0;
    z-index: -1;
    font-family: "Outfit", sans-serif;
    font-size: 8vw;
    font-weight: 500;
    line-height: 1;
    color: #f5f2f2;
    transform: skewX(-8deg);
    letter-spacing: -0.05em; }
  .section-system .txt01 {
    margin-top: 2vw; }
    @media screen and (max-width: 480px) {
      .section-system .txt01 {
        margin-top: 20px; } }
  .section-system .img01 {
    padding: 2vw 0 5vw;
    text-align: center; }
    @media screen and (max-width: 480px) {
      .section-system .img01 {
        padding: 20px 0; } }
    .section-system .img01 img {
      width: 40vw; }
  .section-system .box {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 4vw;
    max-width: 900px;
    margin: 0 auto; }
    @media screen and (max-width: 1024px) {
      .section-system .box {
        grid-template-columns: repeat(3, 1fr); } }
    @media screen and (max-width: 480px) {
      .section-system .box {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px; } }
    .section-system .box-col {
      display: grid;
      grid-template-rows: 2fr 1fr;
      background-color: #9fc53c;
      border-radius: 2vw;
      padding: 2vw 1vw;
      color: #fff;
      text-align: center; }
      @media screen and (max-width: 480px) {
        .section-system .box-col {
          padding: 20px 10px; } }
      .section-system .box-col .no {
        font-size: 5vw;
        font-weight: 500;
        line-height: 1; }
      .section-system .box-col h3 {
        margin-top: 1vw;
        font-size: 1.125rem;
        font-weight: 500;
        line-height: 1.4; }
        @media screen and (max-width: 480px) {
          .section-system .box-col h3 {
            margin-top: 10px; } }
      .section-system .box-col .txt02 {
        font-size: 0.875rem;
        font-weight: 500;
        line-height: 1.4; }
      .section-system .box-col .txt03 {
        font-size: 0.875rem;
        font-weight: 500;
        line-height: 1.4; }
    .section-system .box-txt-1 {
      border-bottom: 2px solid #fff;
      padding-bottom: 1vw; }
      @media screen and (max-width: 480px) {
        .section-system .box-txt-1 {
          padding-bottom: 10px; } }
    .section-system .box-txt-2 {
      padding-top: 1vw; }
      @media screen and (max-width: 480px) {
        .section-system .box-txt-2 {
          padding-top: 10px; } }
.section-greeting {
  position: relative;
  padding: 4vw 20px; }
  .section-greeting h2 {
    position: relative;
    font-size: 2.4vw;
    color: #fff;
    text-align: center; }
    @media screen and (max-width: 768px) {
      .section-greeting h2 {
        font-size: 20px; } }
    .section-greeting h2::after {
      content: "";
      position: absolute;
      bottom: 0;
      left: 50%;
      transform: translateX(-50%);
      background-color: #fff;
      width: 60px;
      height: 5px; }
      @media screen and (max-width: 480px) {
        .section-greeting h2::after {
          height: 3px; } }
  .section-greeting .box {
    background-color: rgba(255, 255, 255, 0.9);
    width: 100%;
    max-width: 80vw;
    margin: 4vw auto 0;
    padding: 6vw; }
    @media screen and (max-width: 480px) {
      .section-greeting .box {
        max-width: 100%; } }
    .section-greeting .box-row {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 3vw; }
      @media screen and (max-width: 480px) {
        .section-greeting .box-row {
          grid-template-columns: 1fr;
          gap: 10px; } }
    .section-greeting .box-txt h3 {
      font-feature-settings: "palt";
      font-family: "Times New Roman", "Noto Serif JP", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;
      font-size: 3.2vw;
      font-weight: 500;
      line-height: 1.5;
      letter-spacing: 0.1em; }
      @media screen and (max-width: 480px) {
        .section-greeting .box-txt h3 {
          font-size: 1.5rem; } }
    .section-greeting .box-txt .txt01 {
      margin-top: 4vw;
      text-align: right; }
      .section-greeting .box-txt .txt01 img {
        width: 19.6vw; }
        @media screen and (max-width: 480px) {
          .section-greeting .box-txt .txt01 img {
            width: 100px; } }
    .section-greeting .box-img img {
      width: 100%; }
    .section-greeting .box-message {
      margin-top: 4vw;
      font-size: 0.875rem; }
      @media screen and (max-width: 480px) {
        .section-greeting .box-message {
          margin-top: 20px; } }
  .section-greeting .bg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
    background-color: #174977;
    filter: grayscale(0.1); }
    .section-greeting .bg img {
      width: 100%;
      height: 100%;
      object-fit: cover; }
.section-profile {
  position: relative;
  padding: 12vw 0 4vw;
  overflow: hidden; }
  .section-profile::before {
    content: "PROFILE";
    position: absolute;
    top: -1.818vw;
    left: 0;
    z-index: -1;
    font-family: "Outfit", sans-serif;
    font-size: 12.121vw;
    font-weight: 600;
    line-height: 1;
    color: #f5f5f5;
    transform: skewX(-8deg);
    letter-spacing: -0.05em;
    white-space: nowrap; }
  .section-profile .box {
    width: 100%;
    max-width: 900px;
    margin: 6vw auto 0;
    padding: 0 20px; }
    @media screen and (max-width: 480px) {
      .section-profile .box {
        padding: 0; } }
    .section-profile .box table {
      width: 100%;
      border-spacing: 1px; }
    .section-profile .box th,
    .section-profile .box td {
      padding: 1.6vw 3vw;
      text-align: left;
      line-height: 1.4; }
      @media screen and (max-width: 480px) {
        .section-profile .box th,
        .section-profile .box td {
          padding: 10px; } }
    .section-profile .box th {
      background-color: #a1a1a1;
      font-weight: normal;
      color: #fff;
      vertical-align: top;
      min-width: 13vw; }
      @media screen and (max-width: 480px) {
        .section-profile .box th {
          min-width: 80px; } }
    .section-profile .box td {
      background-color: #f4f4f4; }
    .section-profile .box dl {
      display: grid;
      grid-template-columns: auto 1fr;
      gap: 5px 20px; }
.section-location {
  padding: 4vw 0; }
  .section-location .box {
    display: grid;
    grid-template-columns: 14vw auto;
    gap: 2vw;
    margin-top: 4vw; }
    @media screen and (max-width: 480px) {
      .section-location .box {
        grid-template-columns: 1fr;
        grid-template-rows: repeat(2, auto); } }
    .section-location .box__left {
      border-right: 1px solid #174977;
      padding: 1vw; }
      @media screen and (max-width: 480px) {
        .section-location .box__left {
          border-right: 0;
          border-bottom: 1px solid #174977;
          padding: 1vw 2vw; } }
      .section-location .box__left h3 {
        font-size: 2vw;
        font-weight: 500;
        color: #174977; }
        @media screen and (max-width: 480px) {
          .section-location .box__left h3 {
            font-size: 1.125rem; } }
    .section-location .box__right {
      padding: 1vw 2vw; }
    .section-location .box-txt {
      line-height: 1.4; }
      .section-location .box-txt .tel {
        margin-top: 1vw; }
    .section-location .box-map {
      margin-top: 2vw; }
      .section-location .box-map iframe {
        width: 100%; }
        @media screen and (max-width: 480px) {
          .section-location .box-map iframe {
            height: 300px; } }
.section-certificates {
  position: relative;
  z-index: 0;
  background-color: #e9e9e9;
  padding: 12vw 0 4vw;
  overflow: hidden; }
  .section-certificates::before {
    content: "CERTIFICATES";
    position: absolute;
    top: -1.818vw;
    left: 0;
    z-index: -1;
    font-family: "Outfit", sans-serif;
    font-size: 12.121vw;
    font-weight: 600;
    line-height: 1;
    color: #f5f2f2;
    transform: skewX(-8deg);
    letter-spacing: -0.05em; }
  .section-certificates .box {
    margin-top: 6vw;
    padding: 0 20px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px; }
    @media screen and (max-width: 768px) {
      .section-certificates .box {
        grid-template-columns: repeat(3, 1fr); } }
    @media screen and (max-width: 480px) {
      .section-certificates .box {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
        padding: 0; } }
    .section-certificates .box .img img {
      width: 100%; }
    .section-certificates .box .img.span2 {
      grid-column: span 2; }
.section-history {
  position: relative;
  padding: 12vw 0;
  overflow: hidden; }
  .section-history::before {
    content: "HISTORY";
    position: absolute;
    top: -1.818vw;
    left: 0;
    z-index: -1;
    font-family: "Outfit", sans-serif;
    font-size: 12.121vw;
    font-weight: 600;
    line-height: 1;
    color: #f5f5f5;
    transform: skewX(-8deg);
    letter-spacing: -0.05em;
    white-space: nowrap; }
  .section-history .box {
    margin-top: 6vw;
    padding-left: 8vw; }
    @media screen and (max-width: 480px) {
      .section-history .box {
        padding-left: 0; } }
    .section-history .box-row {
      display: grid;
      grid-template-columns: 13vw auto;
      font-size: 1.6vw;
      line-height: 1.4; }
      @media screen and (max-width: 480px) {
        .section-history .box-row {
          grid-template-columns: 100px auto;
          font-size: 1rem; } }
      .section-history .box-row .dt {
        padding: 1vw 0; }
        @media screen and (max-width: 480px) {
          .section-history .box-row .dt {
            padding: 5px 0;
            font-size: 0.875rem; } }
      .section-history .box-row .txt {
        position: relative;
        border-left: 2px solid #2c2c2c;
        padding: 1vw 0 1vw 3vw; }
        @media screen and (max-width: 480px) {
          .section-history .box-row .txt {
            padding: 5px 0 5px 20px;
            font-size: 0.875rem; } }
        .section-history .box-row .txt::before {
          content: "";
          position: absolute;
          top: 1.1vw;
          left: -0.9vw;
          background-color: #2c2c2c;
          border-radius: 50%;
          width: 1.6vw;
          height: 1.6vw; }
          @media screen and (max-width: 480px) {
            .section-history .box-row .txt::before {
              top: 9px;
              left: -6px;
              width: 10px;
              height: 10px; } }