@charset "UTF-8";

/* =============================================================================

CAD CSS

・製品カタログ / CADデータダウンロード用CSS「.cad-×××」

上記はここに記述する

============================================================================= */

body:not(.is-global_menu-open) {
  .g-header {
    &::before {
      background-color:var(--cc-blue-A);
    }
    .logo > a {
      &::before {
        background-color:#fff;
      }
    }
  }
}

.g-pagetop_button {
  display:none;
}

.page-container {
  padding-bottom:16.0rem;
  @media (width <= 640px) {
    padding-bottom:5.6rem;
  }
}

.cad-heading {
  padding-block:10.8rem 5.0rem;
  text-align: center;
  font-weight: 700;
  font-size:2.5rem;
  line-height:1.6;
  letter-spacing: .18em;
  color:#fff;

  @media (width > 640px) {
  }
  @media (width <= 640px) {
    padding-block:4.0rem 2.6rem;
    font-size:1.8rem;
    line-height:1.6;
  }
}


.cad-contents {
  display:grid;
  gap:10.0rem;
  padding:10.0rem 11.7rem 13.5rem 11.8rem;

  @media (width <= 640px) {
    gap:6.0rem;
    margin-inline:3.7rem;
    padding:4.0rem 2.0rem 5.0rem;
  }
  .contents-block {

  }
  .contents-heading {
    padding:1.2rem 2.8rem;
    font-weight:700;
    font-size:1.5rem;
    line-height:1.5;
    letter-spacing: .28em;
    @media (width <= 640px) {
      padding-inline:2.0rem;
    }
  }
  .contents-desc {
    margin-top:2.4rem;
    font-size:1.5rem;
    letter-spacing: .2em;
    line-height:calc(26/15);
    font-weight:600;
    .is-ftest & {
      font-weight: 700;
    }
    @media (width <= 640px) {
      margin-top:2.0rem;
    }
  }

  .catalog-bnr {
    display:block;
    margin-top:4.5rem;
    @media (width <= 640px) {
      margin-top:2.8rem;
    }
  }

  .data_list {
    display:grid;
    margin-top:3.6rem;
    @media (width > 640px) {
      grid-template-columns: repeat(2,1fr);
      gap:3.2rem 2.8rem;
    }
    @media (width <= 640px) {
      margin-top:2.0rem;
      gap:2.0rem;
    }
  }
  .data_list-item {
    display:flex;
    flex-direction: column;
    padding:3.5rem 3.0rem;
    @media (width <= 640px) {
      padding:3.0rem 2.0rem;
    }

    .heading {
      margin-bottom:1.6rem;
      padding:.5rem 1.0rem;
      width:fit-content;
      font-weight: 700;
      font-size:1.5rem;
      line-height:1.5;
      letter-spacing: .18em;
      @media (width > 640px) {
        margin-bottom:1.2rem;
      }
    }

    .desc {
      margin-bottom:1.6rem;
      width:fit-content;
      font-size:1.4rem;
      line-height:calc(23/14);
      letter-spacing: .20em;
      text-align: justify;
      @media (width > 640px) {
        min-height:3lh;
      }
      @media (width <= 640px) {
        margin-bottom:.4rem;
      }
    }

    .l-button-A {
      width:100%;
      gap:0;
      @media (width > 640px) {
        margin-top:auto;
      }

      > i {
        width:2.0rem;
        height:2.0rem;
        &::before {
          width:.5rem;
          height:.6rem;
        }
      }

    }
  }
}



/* Sample
============================================================================= */
.cad-selectorName {
  @media (width > 640px) {
  }
  @media (width <= 640px) {
  }
}



:root {
  @media (width > 640px) {
    --fp-border-color:var(--cc-blue-A);
    --fp-border:2px solid var(--fp-border-color);
  }
}

.fp-submit-button {
  max-width:49.5rem;
  height:5.5rem;
  background-color:var(--cc-black-A);
  color:#fff;
  font-size:1.6rem;
  letter-spacing: .2em;

  @media (width <= 640px) {
    font-size:1.4rem;
  }
}