/* CSS for html/special  */

@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700;900&display=swap');


.contact-form { max-width: 600px; margin: 0 auto; }
.contact-form h2 { text-align: center; margin-bottom: 30px; font-size: 30px; color: #333; }

.contact-form .star { color: red; vertical-align:super; }

.contact-form .form-group { margin-bottom: 20px; }
.contact-form .form-group label { display: block; margin-bottom: 8px; font-weight: bold; color: #555; }
.contact-form .form-group input[type="text"],
.contact-form .form-group input[type="email"],
.contact-form .form-group textarea { width: 100%; padding: 12px; border: 1px solid #ddd; border-radius: 6px; 
  box-sizing: border-box; font-size: 16px; }
.contact-form .form-group input:focus,
.contact-form .form-group textarea:focus { border-color: #8154c3 !important; }
.contact-form .form-group textarea { height: 150px; resize: vertical; }

.contact-form .privacy-agree-chk { display: flex; align-items: center; }
.contact-form .privacy-agree-chk input { margin-right: 6px; margin-bottom: 5px; transform: scale(1.3); }
.contact-form .submit-btn { width: 100%; padding: 15px; background-color: #502E82; border: none; border-radius: 6px; color: white; font-size: 18px; font-weight: bold; cursor: pointer; transition: background 0.3s; }
.contact-form .submit-btn:hover { background-color: #8154c3; }

.modal-policy { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.6); z-index: 9999; }
.modal-policy .modal-content { background: #fff; width: 1000px; max-width: 95%; margin: 10vh auto; padding: 40px 20px;
  position: relative; height: 80vh; display: flex; flex-direction: column; }
.modal-policy .policy-body { flex: 1; overflow-y: auto; margin: 30px; }
.modal-policy .modal-close { position: absolute; top: 10px; right: 15px; }
.modal-policy .modal-actions { margin-top: 20px; display: flex; justify-content: center; gap: 10px; }
.modal-policy .btn-agree { background: #8154c3; color: #fff; padding: 10px 20px; }
.modal-policy .btn-disagree { background: #ccc; padding: 10px 20px; }
.modal-policy .modal-txt { margin-left: 30px; }

.special-title { font-size: 2.6rem; font-weight: 300; line-height: 1.25; margin-bottom: 10px; text-align: center; }
.special-subtitle { font-size: 1.5rem; font-weight: 200; line-height: 1.35; margin-bottom: 10px; text-align: center;
  opacity: 0.85; }

.specialBanner {
  max-width: 800px;
  margin: 0 auto 60px auto;
}

@media (max-width:1024px){
  .special-title{ font-size:2.2rem; }
  .special-subtitle{ font-size:1.35rem; }
}

@media (max-width:768px){
  .special-title{ font-size:1.6rem; line-height:1.3; }
  .special-subtitle{ font-size:1rem; line-height:1.4; }
}