@charset "utf-8";

.mbskin a.btn01 {}
.mbskin a.btn01:focus, .mbskin .btn01:hover {}
.mbskin a.btn02 {}
.mbskin a.btn02:focus, .mbskin .btn02:hover {}
.mbskin .btn_confirm {}
.mbskin .btn_submit {}
.mbskin button.btn_submit {}
.mbskin fieldset .btn_submit {}
.mbskin .btn_cancel {}
.mbskin button.btn_cancel {}
.mbskin .btn_cancel:focus, .mbskin .btn_cancel:hover {}
.mbskin a.btn_frmline, .mbskin button.btn_frmline {}
.mbskin button.btn_frmline {}
.mbskin .win_btn {}
.mbskin .win_btn button {}
.mbskin .win_btn input {}
.mbskin .win_btn a {}
.mbskin .win_btn a:focus, .mbskin .win_btn a:hover {}
.mbskin a.btn_b01 {}
.mbskin a.btn_b01:focus, .mbskin .btn_b01:hover {}
.mbskin a.btn_b02 {}
.mbskin a.btn_b02:focus, .mbskin .btn_b02:hover {}
.mbskin a.btn_admin {}
.mbskin a.btn_admin:focus, .mbskin a.btn_admin:hover {}

#mb_login.mu-premium-login{
    position:relative;
    width:min(1180px, calc(100% - 40px));
    max-width:1180px;
    min-height:760px;
    margin:30px auto 40px;
    border:1px solid rgba(212,178,92,.26);
    border-radius:28px;
    background:
        linear-gradient(135deg, rgba(8,12,20,.76) 0%, rgba(9,14,22,.58) 38%, rgba(30,14,20,.46) 100%),
        url('./img/login_bg_darkmage.png') center top / cover no-repeat;
    box-shadow:0 30px 80px rgba(0,0,0,.45);
    overflow:hidden;
    text-align:left;
}
#mb_login.mu-premium-login:before,
#mb_login.mu-premium-login:after{display:none}
#mb_login.mu-premium-login .mu_login_overlay{
    position:absolute;inset:0;
    background:
        radial-gradient(circle at 50% 10%, rgba(255,133,92,.22), transparent 24%),
        radial-gradient(circle at 50% 100%, rgba(0,0,0,.45), transparent 35%),
        linear-gradient(180deg, rgba(5,8,14,.28) 0%, rgba(5,8,14,.58) 100%);
    pointer-events:none;
}
#mb_login.mu-premium-login .mu_login_frame{
    position:relative;z-index:1;
    min-height:760px;
    display:grid;
    grid-template-columns:1.1fr minmax(360px, 430px);
    align-items:center;
    gap:40px;
    padding:54px 58px;
}
#mb_login.mu-premium-login .mu_login_visual_copy{align-self:end;max-width:560px;padding:18px 12px 18px 4px}
#mb_login.mu-premium-login .mu_login_badge{
    display:inline-flex;align-items:center;padding:8px 14px;border-radius:999px;
    background:rgba(17,25,39,.58);border:1px solid rgba(234,197,100,.38);
    color:#efd088;font-size:12px;letter-spacing:.2em;text-transform:uppercase;
}
#mb_login.mu-premium-login h1{
    margin:20px 0 16px;font-size:54px;line-height:1.04;font-weight:800;
    letter-spacing:-0.03em;color:#fff6df;text-shadow:0 10px 30px rgba(0,0,0,.45);
}
#mb_login.mu-premium-login .mu_login_desc{max-width:520px;margin:0;padding:0;border:0;color:#d8deea;font-size:16px;line-height:1.8}
#mb_login.mu-premium-login .mu_login_card{
    position:relative;margin-left:auto;width:100%;padding:30px 30px 24px;border-radius:26px;
    background:linear-gradient(180deg, rgba(16,22,35,.84) 0%, rgba(10,15,25,.92) 100%);
    border:1px solid rgba(224,189,95,.28);box-shadow:0 24px 55px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.05);
}
#mb_login.mu-premium-login .mu_login_card_head{margin-bottom:22px}
#mb_login.mu-premium-login .mu_login_card_head strong{display:block;color:#fff4d0;font-size:27px;font-weight:800;letter-spacing:.02em}
#mb_login.mu-premium-login .mu_login_card_head span{display:block;margin-top:8px;color:#a8b3c6;font-size:14px;line-height:1.7}
#mb_login.mu-premium-login #login_fs{padding:0;border:0}
#mb_login.mu-premium-login #login_fs legend,
#mb_login.mu-premium-login #login_info h2{position:absolute;font-size:0;line-height:0;overflow:hidden}
#mb_login.mu-premium-login .frm_input{
    width:100%;height:56px;margin:0 0 12px;padding:0 18px;border-radius:16px;
    border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.06);color:#f5f8ff;box-sizing:border-box;
}
#mb_login.mu-premium-login .frm_input::placeholder{color:#8c99ae}
#mb_login.mu-premium-login .mu_login_row{display:flex;align-items:center;justify-content:space-between;margin:2px 0 16px}
#mb_login.mu-premium-login .mu_auto_login{display:inline-flex;align-items:center;gap:8px;color:#c8d1de;font-size:13px;cursor:pointer}
#mb_login.mu-premium-login .mu_auto_login input{accent-color:#d2a649}
#mb_login.mu-premium-login .btn_submit{
    width:100%;height:56px;margin:0;border:0;border-radius:16px;
    background:linear-gradient(180deg,#f0d08b 0%,#c9963b 100%);color:#241809;font-size:17px;font-weight:800;letter-spacing:.04em;
    box-shadow:0 14px 24px rgba(201,150,59,.26);
}
#mb_login.mu-premium-login #login_info{margin:18px 0 0;padding:18px 0 0;border-top:1px solid rgba(255,255,255,.08);background:none}
#mb_login.mu-premium-login #login_info div{display:grid;grid-template-columns:1fr 1fr;gap:10px}
#mb_login.mu-premium-login #login_info a{
    width:auto;float:none;display:flex;align-items:center;justify-content:center;min-height:48px;border-radius:14px;
    border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.03);color:#dfe8f6;text-decoration:none;
}
#mb_login.mu-premium-login #login_password_lost{border-right:0}
@media (max-width:1024px){
    #mb_login.mu-premium-login{width:min(100%, calc(100% - 22px));min-height:auto;background-position:center top}
    #mb_login.mu-premium-login .mu_login_frame{grid-template-columns:1fr;min-height:auto;gap:24px;padding:28px 22px 24px}
    #mb_login.mu-premium-login .mu_login_visual_copy{max-width:none;padding:8px 4px 0;align-self:start}
    #mb_login.mu-premium-login h1{font-size:36px}
    #mb_login.mu-premium-login .mu_login_card{max-width:540px;margin:0 auto;width:100%}
}
@media (max-width:640px){
    #mb_login.mu-premium-login{margin:16px auto 20px;border-radius:24px}
    #mb_login.mu-premium-login .mu_login_frame{padding:18px 14px 16px}
    #mb_login.mu-premium-login h1{font-size:30px;margin:16px 0 12px}
    #mb_login.mu-premium-login .mu_login_desc{font-size:14px;line-height:1.7}
    #mb_login.mu-premium-login .mu_login_card{padding:22px 16px 18px;border-radius:20px}
    #mb_login.mu-premium-login .mu_login_card_head strong{font-size:22px}
    #mb_login.mu-premium-login .frm_input,
    #mb_login.mu-premium-login .btn_submit{height:52px;border-radius:14px}
    #mb_login.mu-premium-login #login_info div{grid-template-columns:1fr}
}
