@charset "UTF-8";

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

Contact CSS

・お問い合わせページ用CSS「.contact-×××」

上記はここに記述する

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

body:not(.is-global_menu-open) {
  .g-header {
    &::before {
      background-color:var(--cc-black-A);
    }
    .logo > a {
      &::before {
        background-color:#fff;
      }
    }
    .header-menu {
      .link {
        &.translate {
          background-color:#fff;
          img {
            opacity:0;
          }
          &::after {
            opacity:1;
          }
        }
      }
      .separator {
        background-color: var(--cc-black-A);
      }
    }
    .g-header_menu-btn {
      background-color: #fff;

      &::before,
      &::after {
        background-color: var(--cc-black-A);
      }
    }
  }

}

.contact-form {
  padding-block:15.0rem 18.0rem;

  @media (width > 640px) {
    display:grid;
    grid-template-columns:auto 1fr;
    gap:6.4rem;
    align-items: flex-start;
  }
  @media (width <= 640px) {
    padding:6.6rem 3.8rem 10.0rem;
  }

  .title {
    @media (width <= 640px) {
      margin-bottom:3.2rem;
    }

  }
  > .form_inner {
    background-color:#fff;
    @media (width > 640px) {
      padding:9.0rem 11.6rem 13.2rem;
    }
    @media (width <= 640px) {
      padding:3.2rem 2.0rem 3.6rem;
    }
  }

  .fp_block {
  }
}




/* Sample
============================================================================= */
.contact-selectorName {
  @media (width > 640px) {
  }
  @media (width <= 640px) {
  }
}