.wpcf7_form {

  .confirm_area {
    display: none;
    opacity: 0;
    transition: opacity 1s ease-in-out;
    .confirm_title {
      font-size: 24px;
      font-weight: bold;
      margin-bottom: 20px;
      text-align: center;
    }

    table {
      width: 100%;
      th,td {
        padding: 10px;
        border-bottom: 1px solid #ddd;
      }

      em.require {
        display: none;
      }
    }

    .btnArea {
      margin-top: 40px;
      text-align: center;
      display:flex;
      justify-content: center;
      align-items: center;
      gap: 20px;

      p,br {
        display:contents !important;
      }
    }


    .btn_return,
    .btn_confirm {
      display: inline-block;
      margin: 0;
    }

    .confirm_your_zipcode-0::before {
      content: '〒 ';
    }

    .confirm_your_zipcode-1::before {
      content: ' - ';
    }
    
  }

  #confirmButton[disabled] {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
  }

  label:has(input) ,
  select {
    cursor: pointer;
  }


  .wpcf7-form-control-wrap:has(.wpcf7-not-valid-tip) input ,
  .wpcf7-form-control-wrap:has(.wpcf7-not-valid-tip) select {
    border-color: red;
  }
  
  [name="your_zipcode-0"] ,
  [name="your_zipcode-1"] {
    width: min(45%, 120px);
  }
  
}

.wpcf7-response-output {
  display: none !important;
}

.ui-datepicker-year,
.ui-datepicker-month {
  background: white;
  border: 1px solid #ddd;
  padding: 2px;
  cursor: pointer;
  color: #000;
}

.is-loading {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
  position: relative;
  &::before {
    content: '';
    width: 40px;
    height: 40px;
    border: 4px solid #ccc;
    border-top: 4px solid #d9ab28;
    border-radius: 50%;
    animation: spin 1s linear infinite;
    position: absolute;
    top: 0;
    left: 50%;
    translate: -50% 0;
    z-index: 100;
    pointer-events: none;
  }
}


.grecaptcha-badge {
  bottom: 10px;
  right: 10px;
  transform: scale(0.85);
  opacity: 0.6;
 }

@keyframes spin {
  to { rotate: 360deg; }
}

@media (max-width: 767px) {
  .wpcf7_form { 
    .btnArea {
      flex-direction: column;
      gap: 10px;
    }
  }
}