﻿.modal-content-popup {
    position: relative;
    margin: auto;
    padding: 0px;
    width: 450px;
    background-color: unset;
    border: none;
    -webkit-box-shadow: 0 0px 6px rgb(0 0 0 / 20%);
    margin-top: 20px;
}

.close[name="close_popup_index"] {
    position: absolute;
    margin-top: -5.5rem;
    color: white;
    float: right;
    font-size: 66px;
    font-weight: 100;
    margin-right: 2.5rem;
    margin-left: 26.8rem;
    position: absolute !important;
    top: 10px !important;
    right: -39px !important;
    color: white !important;
    font-size: 60px !important;
    font-weight: 100 !important;
    cursor: pointer !important;
}

.modal-content-popup {
    position: relative;
    margin: auto;
    padding: 0px;
    width: 450px;
    background-color: unset;
    border: none;
    -webkit-box-shadow: 0 0px 6px rgb(0 0 0 / 20%);
    margin-top: 220px;
}

/*@media (max-width: 2560px) {
        .modal-content-popup {
            margin-top: 25% !important;*/
/*width: 80% !important;*/
/*}
    }*/


/* สำหรับหน้าจอขนาดกลาง (1366px) */
@media (max-width: 1439px) {
    .modal-content-popup {
        margin-top: 5% !important;
    }
}

/* สำหรับหน้าจอขนาด 1280px */
@media (max-width: 1366px) {
    .modal-content-popup {
        margin-top: 5% !important;
    }
}

/* สำหรับหน้าจอขนาด 1024px */
@media (max-width: 1280px) {
    .modal-content-popup {
        margin-top: 10% !important;
    }
}

/* สำหรับหน้าจอขนาด 820px */
@media (max-width: 1024px) {
    .modal-content-popup {
        margin-top: 10% !important;
    }
}

/* สำหรับหน้าจอขนาด 768px */
@media (max-width: 820px) {
    #myModal {
        padding-top: -55px !important;
    }
}

/* สำหรับหน้าจอขนาด 768px */
@media (max-width: 768px) {
    .modal-content-popup {
        margin-top: 20% !important;
    }
}

/* สำหรับหน้าจอขนาด 540px */
@media (max-width: 540px) {
    .modal-content-popup {
        margin-top: 20% !important;
        width: 75% !important;
    }
}

/* สำหรับหน้าจอขนาด 430px */
@media (max-width: 430px) {
    .modal-content-popup {
        margin-top: 30% !important;
        width: 75% !important;
    }
}

/* สำหรับหน้าจอขนาด 375px */
@media (max-width: 375px) {
    #myModal {
        padding-top: 20% !important;
    }
}

/* สำหรับหน้าจอขนาดเล็ก (Mobile Devices) */
@media (max-width: 320px) {
    .modal-content-popup {
        margin-top: -50px !important;
        width: 90% !important;
    }
}



@media screen and (max-width: 768px) {
    .close[name="close_popup_index"] {
        position: absolute !important;
        top: 10px !important;
        right: -41px !important;
        color: white !important;
        font-size: 60px !important;
        font-weight: 100 !important;
        cursor: pointer !important;
    }
}

/*@media screen and (min-width: 769px) and (max-width: 1024px) {
        .close {
            position: unset !important;
            margin-top: -6.5rem !important;
            color: white !important;
            float: right !important;
            font-size: 45px !important;
            font-weight: 100 !important;
            margin-right: -0.5rem !important;
            margin-left: 62rem !important;
        }
    }*/



#myModal {
    padding-top: 10%;
}

.modal-content-popup {
    position: relative;
    margin: auto;
    padding: 0px;
    width: 450px;
    background-color: unset;
    border: none;
    -webkit-box-shadow: 0 0px 6px rgb(0 0 0 / 20%);
    margin-top: 20px;
}

.responsive-popup {
    width: auto;
    height: auto;
}

input[name="chkNotShow"], textarea[name="chkNotShow"] {
    display: unset !important;
    width: unset !important;
}
