.popup-area { position:absolute; background:#ffffff; max-width:50%; top:50%; left:calc((100% - 1200px) / 2); z-index:1999; box-shadow:0.5rem 0.5rem 1.5rem rgba(0, 0, 0, 0.25); transform:translate(0, -50%); }
.popup-area img { max-width:100%; max-height:60vh; vertical-align:top; }
.popup-area div { padding:0; background:#000000; color:#ffffff; position:relative; height:4.5rem; line-height:4.5rem; }
.popup-area div * { position:absolute; padding:0 15px; }
.popup-area div a { display:block; top:0; left:0; font-size:1.5rem; font-weight:300; }
.popup-area div button { top:0; right:0; line-height:inherit; border:none; background:none; color:inherit; font-weight:700; font-size:inherit; cursor:pointer; font-size:1.4rem; }

@media screen and (max-width:1280px) {
    .popup-area { max-width:60%; left:calc((100% - 980px) / 2); }
    .popup-area div { height:41px; line-height:41px; font-size:15px; }
    .popup-area div * { padding:0 14px; }
}
@media screen and (max-width:1024px) {
    .popup-area { top:130px; max-width:70%; left:15% !important; transform:translate(0, 0); }
    .popup-area div { height:37px; line-height:37px; font-size:14px; }
    .popup-area div * { padding:0 13px; }
}
@media screen and (max-width:768px) {
    .popup-area { top:150px; max-width:80%; left:10% !important; }
    .popup-area div { height:33px; line-height:33px; font-size:13px; }
    .popup-area div * { padding:0 12px; }
}
@media screen and (max-width:640px) {
    .popup-area { top:150px; max-width:90%; left:5% !important; }
    .popup-area div { height:29px; line-height:29px; font-size:12px; }
    .popup-area div * { padding:0 11px; }
}