@charset "utf-8";
/* CSS Document */


/********** page **********/

main.page {
  padding: 0;
  .p-catch {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 300px;
    background: var(--green);
    hgroup {
      position: relative;
      padding: 1.5rem 0;
      font-size: 4rem;
      font-weight: 700;
      letter-spacing: .05em;
      color: #fff;
      z-index: 2;
      text-align: center;
      &::before {
        content: "";
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translate(-50%,0);
        display: block;
        width: 80px;
        height: 4px;
        background: #fff;
      }
      span {
        display: block;
        font-size: .5em;
      }
      h2 {
        position: relative;
        font-size: 1em;
      }
    }
  }
  .p-body {
    padding: 4rem 0 8rem;
    .p-chapter {
      padding: 8rem 0;
      .p-chapter__inner {
        margin: 0 auto;
        padding: 0 4rem;
        max-width: 1000px;
      }
    }
    #contact {
      .p-chapter__inner {
        max-width: 1200px;
      }
    }
  }
}

@media (max-width: 480px) {
  main.page {
    .p-catch {
      height: 180px;
      hgroup {
        padding: 1rem 0;
        font-size: 2.7rem;
        &::before {
          width: 40px;
          height: 2px;
        }
      }
    }
    .p-body {
      padding: 0 0 4rem;
      .p-chapter {
        padding: 6rem 0;
        .p-chapter__inner {
          padding: 0 2rem;
        }
      }
      #contact {
        padding-top: 0;
      }
    }
  }
}