/* --------------------------------------------------------
-----------------------------------------------------------
 index
-----------------------------------------------------------
----------------------------------------------------------- */

/* ヘッダーの右上ご注文ボタン */
body.page-wholesale-contact .order-button {
  display: none;
}

#wholesale-contact-index .form-wrap form .submit-btn {
  background: var(--color02);
  width: 88%;
  display: block;
  padding: 1.1rem;
  font-size: 1.9rem;
  border-radius: 100px;
  text-align: center;
  color: #FFF;
  letter-spacing: 0.1em;
  margin: 0 auto;
  max-width: 400px;
}

#wholesale-contact-index .p-section {
  background: #FFF;
  padding: 1.8rem 1.5rem 2rem;
  border-radius: 0.6rem;
}

#wholesale-contact-index .section-note {
  color: var(--color-text-sub);
  text-indent: -1em;
  margin: 1rem 0 0 1em;
  font-size: 1.2rem;
  line-height: 1.45;
}

#wholesale-contact-index .form-wrap {
  margin-top: 5rem;
}

#wholesale-contact-index .form-wrap form .error-tip {
  color: var(--color03);
  display: block;
  font-weight: bold;
  background: #f9eeee;
  border: 1px solid;
  line-height: 1.4;
  padding: 0.5rem 1rem;
  font-size: 1.3rem;
  margin-top: 1rem;
}

#wholesale-contact-index .form-wrap form .input-label {
  color: var(--color06);
  font-weight: bold;
  position: relative;
  font-size: 1.6rem;
  line-height: 1.45;
  margin-bottom: 0.8rem;
}

#wholesale-contact-index .form-wrap form .input-label .req-icon {
  background: var(--color03);
  display: inline-block;
  font-weight: normal;
  color: #FFF;
  font-size: 1rem;
  border-radius: 0.2rem;
  padding: 0.3rem 0.5rem 0.3rem 0.6rem;
  letter-spacing: 0.2rem;
  margin: 0 0.8rem;
  vertical-align: 0.3rem;
  line-height: 1.3;
}

#wholesale-contact-index .form-wrap form .input-wrap input[type=text],
#wholesale-contact-index .form-wrap form .input-wrap input[type=email],
#wholesale-contact-index .form-wrap form .input-wrap input[type=tel],
.input-wrap textarea {
  border: 0.1rem solid var(--color-border);
  background: #fff;
  border-radius: 0.4rem;
  padding: 0.6rem 1rem;
}

#wholesale-contact-index .form-wrap form .input-wrap input[type=text]::placeholder,
#wholesale-contact-index .form-wrap form .input-wrap input[type=email]::placeholder,
#wholesale-contact-index .form-wrap form .input-wrap input[type=tel]::placeholder {
  color: #c1c1c1;
}

#wholesale-contact-index .input-wrap textarea {
  min-height: 250px;
}

#wholesale-contact-index .form-wrap form .input-wrap {
  display: flex;
  flex-direction: column;
  margin: 0 0 5rem;
  align-items: stretch;
}


/* --------------------------------------------------------
-----------------------------------------------------------
 プラポリ
-----------------------------------------------------------
----------------------------------------------------------- */
#confirm-privacy {
  margin: 0 0 40px;
}

.scroll-box::-webkit-scrollbar {
    width: 6px;
    /* 横幅 */
}
.scroll-box::-webkit-scrollbar-thumb {
    background: #a9a9a9;
    /* ハンドルの色 */
}
.scroll-box::-webkit-scrollbar-track {
    background: #CCC;
    /* 背景色 */
}

#confirm-privacy * {
    letter-spacing: normal !important;
    line-height: 1.6 !important;
}
#confirm-privacy .scroll-box {
    max-height: 300px;
    background: #fff;
    border: #ddd solid 1px;
    border-radius: 0.4rem 0 0 0.4rem;
    margin: 0 0 20px;
    padding: 30px;
    overflow: auto;
}
#confirm-privacy h3 {
  color: #505050;
  padding: 0;
  font-size: 1.4rem;
  font-weight: bold;
  margin: 1.4em 0 0.75em;
  padding-bottom: 0.2em;
  border-bottom: 1px solid #ccc;
}
#confirm-privacy h3:first-child {
  margin-top: 0;
}
#confirm-privacy p,
#confirm-privacy li,
#confirm-privacy .in-box * {
    font-size: 1.3rem;
}
#confirm-privacy p {
    margin: 1em 0;
}
#confirm-privacy ul {
    margin: 1em 0;
    padding: 0 0 0 1em;
    list-style-type: disc;
}
#confirm-privacy ul li {
    margin: 0.5em 0;
}
#confirm-privacy dl {
    margin: 1em 0;
}
#confirm-privacy .in-box {
    background: #f3f3f3;
    padding: 15px 30px;
    margin-top: 30px;
}
#confirm-privacy .bottom-txt {
    text-align: center;
    margin: 30px 0 0;
}
@media (max-width: 520px) {
    #confirm-privacy .scroll-box {
        max-height: 240px;
        padding: 20px;
    }
    #confirm-privacy h2 {
        font-size: 1.5rem;
        text-align: left;
        margin-bottom: -0.5em;
    }
    #confirm-privacy h3 {
        font-size: 1.3rem;
    }
    #confirm-privacy p,
    #confirm-privacy li,
    #confirm-privacy .in-box * {
        font-size: 1.2rem;
    }
    #confirm-privacy .in-box {
        padding: 10px 20px;
    }
}