/* CSS Document */


/************************************************************/
/* popup newsletter */

.subscribe-to-newsletter{ position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); max-width: 600px; width: 93%; background: linear-gradient(172deg,rgba(217, 231, 252, 1) 0%, rgba(255, 255, 255, 1) 37%);box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.29); border-radius: 8px; pointer-events: auto; z-index: 1001; }

.newsletter-popup{ display: flex; flex-direction: column; align-items: center; justify-content: space-between; text-align: center; padding: 30px 20px; }
.newsletter-logo img{ width: 128px; height: auto; margin-bottom: 10px; }
.newsletter-title{ font-family: 'DM Sans', sans-serif; font-weight: 600; font-size: 11px; line-height: 1.4; color: #000; }
.newsletter-title span{ font-size: 16px; font-weight: bold; color: #FF5D5D; }
.newsletter-text{ font-family: 'DM Sans', sans-serif; font-weight: 600; font-size: 28px; line-height: 1.2; color: #000; margin-bottom: 20px; }
.newsletter-consent{ font-family: 'DM Sans', sans-serif; font-weight: 400; font-size: 10px; line-height: 1.3; color: #000; margin-bottom: 10px; }
.newsletter-consent a{ color: #0089FF; text-decoration: underline; }
.newsletter-consent a:hover{ color: #000; text-decoration: underline; }


@media (max-width: 576px){

  .newsletter-text{ font-size: 20px; }

}


.newsletter-nothanks{ margin-top: 15px; }
.newsletter-nothanks a{ font-family: 'Arial', sans-serif; font-weight: 400; font-size: 10px; line-height: 1.3; color: #707070; }
.newsletter-nothanks a:hover{ color: #000; text-decoration: underline; }

.newsletter-close{ position: absolute; right: 15px; top: 15px; z-index: 5; }
.newsletter-close img{ width: 10px; height: 10px; filter: invert(40%) sepia(100%) saturate(1502%) hue-rotate(197deg) brightness(93%) contrast(99%); cursor: pointer; }

.newsletter-form{ max-width: 370px; width: 100%; }
.inputgroup{ display: flex; }
.newsletter-form .form--email{ width: 100%; height: 28px; padding: 0 40px; border: 0.5px solid #0064EA; border-radius: 20px; font-size: 15px; line-height: 28px; color: #707070; opacity: 1; background-image: url('../images/icon/icn-email.svg'); background-repeat: no-repeat; background-position: 15px center; display: flex; align-items: center; }
.newsletter-form .form--email::placeholder {
  color: #707070; 
  opacity: 0.2; font-size: 15px;
}
/* เจาะจงแก้เฉพาะ Placeholder ใน Chrome (Webkit) */
.newsletter-form .form--email::-webkit-input-placeholder {
    font-size: 7px;
    line-height: normal;
    position: relative;
    top: -2px; 
}


.newsletter-form .btn--subscribe{ padding: 3px 20px; background-color: #2F80ED; color: #fff; border: 1px solid #2F80ED; border-radius: 20px; font-family: 'Arial', sans-serif; font-size: 16px; font-weight: bold; margin-left: -30px; cursor: pointer; }
.newsletter-form .btn--subscribe:hover{ background-color: #fff; color: #2F80ED; }