@charset "UTF-8";

/* ==========================================================================
   FV (First View) - 20260908
   ========================================================================== */

main section.fv20260908 {
  max-width: 100%;
  padding: 0;
}

article.l-flex {
  width: calc(100% - 0.5rem);
  padding: 0 0.5rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;

  .fv20260908_inner {
    flex-basis: 100%;
    padding: 1.25rem 0 0;

    h1 {
      display: flex;
      flex-direction: column;
      margin-bottom: 1rem;
    }

    h1 span {
      display: flex;
      justify-content: center;
    }

    h1 img {
      width: 85%;
      height: auto;
    }

    img {
      width: 100%;
      max-width: 774px;
      height: auto;

      &.Satisfaction {
        width: 156px;
      }

      &.price {
        margin-top: 1rem;
      }
    }
  }

  form {
    display: none;
    margin: 20px 7px 0 0;
    width: 400px;
    height: 643px;
    float: right;

    h2 {
      color: #ffffff;
      font-size: 20px;
      font-weight: 700;
      text-align: center;
    }

    div.hForm {
      width: 340px;
      margin: 50px auto 0 auto;
      font-size: 16px;
      font-weight: 500;

      div.name div,
      div.pref {
        width: 49%;
        position: relative;
      }

      div.pref::after {
        content: "";
        position: absolute;
        right: 15px;
        top: 25px;
        width: 10px;
        height: 10px;
        border-top: 2px solid #bcbcbc;
        border-left: 2px solid #bcbcbc;
        transform: translateY(-50%) rotate(-135deg);
        pointer-events: none;
      }

      p.sendTel {
        margin-top: 15px;
      }
    }
  }
}

.sp-button {
  margin: 2rem 1rem 0;

  display: flex;
  flex-direction: column;
  gap: 1rem;

  img {
    width: 100%;
    height: auto;
  }
}

@media (min-width: 988px) {
  main section.fv20260908 {
    max-width: 1200px;
    background-image: url(./images/fv_pc20260908.png) !important;
    background-repeat: no-repeat;
    background-position: right;
  }

  article.l-flex {
    /*width: calc(100% - 3rem);*/
    flex-direction: row;

    .fv20260908_inner {
      flex-basis: 64%;

      h1 {
        flex-direction: row;
        margin-bottom: -0.25rem;
        gap: 0.5rem;
      }

      h1 img {
        width: 100%;
        height: auto;
      }

      img {
        width: 100%;
        height: auto;

        &.Satisfaction {
          width: 100%;
          max-width: 254px;
        }
      }
    }

    form {
      display: block;
      flex-basis: 31.5%;
      float: unset;
    }
  }

  .sp-button {
    display: none;
  }
}

/* Firefox */
@-moz-document url-prefix() {
  article.l-flex form div.hForm {
    margin: 35px auto 0 auto;
  }
}

/* .siteTitle */
header .siteTitle {
  margin: 0;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  width: 156px;
  height: 35px;
}

header .siteTitle a {
  display: block;
  width: 100%;
  height: 35px;
  background-image: url(./images/logo.png);
  background-repeat: no-repeat;
  background-size: cover;
}

@media (min-width: 988px) {
  header .siteTitle {
    width: 286px;
    height: 64px;
  }

  header .siteTitle a {
    height: auto;
    padding-top: 64px;
    background-size: contain;
  }
}