#contact{
.wrapper{
  .contact{
    .inner{
      padding-bottom: calc(100 / 1363 * 100%);
      .title{
        margin-top: calc(320 / 1363 * 100%);
                            &:after {
                        content: "";
                        display: block;
                        width: 80px;
                        height: 2px;
                        background-color: var(--gold);
                        margin: calc(70 / 1363 * 100%) auto;
                        @media screen and (min-width: 769px) {
                        height: 4px;
                        }
                    }
      }
      form{
        width: 100%;
        margin: 0 auto;
        max-width: 100%;
        text-align: left;
        @media screen and (min-width: 769px) {
          max-width: calc(814 / 1363 * 100%);
        }
        label{
          width: 100%;
          font-size:clamp(16px, 0.2vw + 15.24px, 18px);
          margin-bottom: .5rem;
          display: inline-block;
          .required{
            color: var(--red);
            display: inline-block;
            margin-left: 5px;
          }
          
        }
        input{
          width: 100%;
          height: 50px;
          border: 1px solid #bcbcbc;
          margin-bottom: calc(30 / 1363 * 100%);
          padding:1rem;
          &.wpcf7-submit{
            border: none;
            height: 54px;
            line-height: 54px;
            padding:0;
          }
        }
        textarea{
          width: 100%;
           border: 1px solid #bcbcbc;
           height: 200px;
     padding:1rem;
           margin-bottom: calc(40 / 814 * 100%);
        }
        button{
          width: 100%;
        }
           .btn-box {
            height: 74px;
            @media screen and (min-width: 769px) {
              height: 74px;
            }
        }     
      }
      .privacy{
        max-width: 100%;
        margin: calc(30 / 1363 * 100%) auto 0;
        background-color: #f4f4f4;
        padding: calc(15 / 814 * 100%) calc(5 / 814 * 100%);
        @media screen and (min-width: 769px) {
          max-width: calc(814 / 1363 * 100%);
        }
        p{
          padding: 0 calc(30 / 1363 * 100%);
              text-align: center;
          @media screen and (min-width: 769px) {
       
           padding: 0;
          }
          a{
            text-decoration: underline;
          }
        }
      }
    }
  }
  .contact-content{
    background: url(../img/front/bg-grey.webp) repeat center center;
    .inner{
      padding-top: calc(100 / 1363 * 100%);
      padding-bottom: calc(100 / 1363 * 100%);
      .contact-content-lead{
        text-align: center;
        font-size: clamp(16px, 0.4vw + 14.48px, 18px);
        margin-bottom: calc(40 / 1363 * 100%);
      }
      p{
        margin-bottom: calc(40 / 1363 * 100%);
      }
      .contact-select-wrap{
        position: relative;
        width: 100%;
        max-width: 390px;
        margin: 0 auto calc(40 / 1363 * 100%);
        &::after{
          content: url(../img/front/icon-arrow.svg);
          position: absolute;
          top: 30%;
          right: 24px;
          pointer-events: none;
          transform: rotate(90deg);
        }
      }
      .contact-select{
        width: 100%;
        appearance: none;
        -webkit-appearance: none;
        -moz-appearance: none;
        border: 1px solid #ccc;
        background-color: var(--white);
        padding: 14px 0;
        font-size: clamp(14px, 0.4vw + 12.2px, 16px);
        line-height: 1.5;
        text-align: center;
        text-align-last: center;
        color: var(--black);
        cursor: pointer;
      }
      .contact-body{
        margin: 0 auto;
        text-align: left;
        .contact-panel{
          display: none;
          font-size: clamp(16px, 0.4vw + 14.48px, 18px);
          line-height: 2;
          &.is-active{
            display: block;
          }
        }
        p{
          margin-top: calc(40 / 1363 * 100%);
        }
      }
    }
  }
}
}


