﻿.login-bg{background-image:url('../../Images/Common/bg-login-w.svg');background-position:center;background-attachment:fixed;background-repeat:no-repeat;background-size:cover;height:100vh;width:100%;padding-bottom: 44px;max-width:unset !important;-webkit-transform:scale(0.2);-moz-transform:scale(0.2);-ms-transform:scale(0.2);transform:scale(0.2);opacity:0;-webkit-transition:all .3s;-moz-transition:all .3s;transition:all .3s;transition-timing-function:ease-in-out}
.login-bg.show{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);transform:scale(1);opacity:1;overflow-x: auto;}
.login-top{margin:0 auto !important;padding:32px 0;max-width: 1420px;}
.login-top .sinopac-logo{content:url('../../Images/Icon/logo-sinopac.svg');width:152px;height:35px}
.login-top .close{content:url('../../Images/Icon/icon-close-w.svg');width:30px;height:30px;float:right}
.login-content{max-width:1180px;height:738px;margin:auto auto;border-radius:30px;box-shadow:0 0 15px 0 rgba(23,36,57,0.2);background-color:#fff;display:flex}
.login-content>*{padding:80px 0px}
.login-content>* >*{max-width:486px;margin:0 auto}
.login-content .intro{background-image:url('../../Images/Common/img-login-bottom.svg');background-repeat:no-repeat;background-size:cover;background-position:bottom left;border-top-left-radius:30px;-moz-border-radius-topleft:30px;position:relative}
.login-content .intro>a{position:absolute;left:0;top:0;width:100%;height:50%}
.login-content .intro>div{background-image:url('../../Images/Common/img-login-top.svg');background-repeat:no-repeat;background-size:cover}
.login-content .intro .h1title{color:#3f5372}
.login-content .intro .subtitle{display:flex;margin-top:20px}
.login-content .intro .subtitle>div{margin-right:32px}
.login-content .intro .subtitle>div .p{color:#8a919c}
.login-content input{font-size:20px;font-weight:normal;line-height:1.5;letter-spacing:normal}
.login-content #IDNO_Area, .login-content #IDNOH_Area{margin-top:52px}
.login-content #PW_Area{margin-top:32px}
.login-content .rember-area{margin-top:20px;position:relative}
.login-content .rember-area .forgot{position:absolute;top:0;right:0}
.login-content #reCAPTCHAv2{padding-top:10px;padding-bottom:0 !important}
.login-content .button-area{display:flex;justify-content:center;position:relative;padding-top:80px}
.login-content .button-area button,.login-content .button-area a{height:60px;width:300px;padding:15px 0;display:flex;justify-content:center}
.login-content .openact{text-align:center;margin-top:12px}
.login-content .recaptcha{margin-top:40px;color:#8a919c;display:flex}
.grecaptcha-badge{display:none}
.login-content.gift-card {height:756px}
.login-content.gift-card .intro{background-image:url('../../Images/GiftCard/img-login-bottom-gift-card.png')}
.login-content.gift-card #IDNO_Area, .login-content #IDNOH_Area{margin-top:44px}
.login-content.gift-card hr{margin:39.5px 0}
.login-content.gift-card .button-area{padding-top:24px}
.login-content.gift-card .recaptcha{margin-top:40px}



/****** RWD Setting ******/
@media screen and (max-width: 1000px) {
    .login-content .intro{display:none}
    .login-side{width:100%}
}
@media screen and (max-width: 767px) {
    .login-bg{background-image:url('../../Images/Common/bg-login-m.svg');padding:32px 16px 70px 16px !important;-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);transform:scale(1);opacity:1;position:fixed;left:100vw}
    .login-bg.show{left:0;}
    .login-top{padding:0 0;}
    .login-top .close{width:20px;height:20px}
    .login-content{width:100%;border-radius:20px;margin:44px 0 0;height:unset}
    .login-content>*{padding:32px 16px}
    .login-content input{font-size:18px;font-weight:normal;line-height:1.56;letter-spacing:normal}
    .login-content #IDNO_Area, .login-content #IDNOH_Area{margin-top:36px}
    .login-content #PW_Area{margin-top:24px}
    .login-content .rember-area{margin-top:13px}
    .login-content .button-area{padding-top:44px}
    .login-content .button-area button,.login-content .button-area a{width:240px;height:48px;padding:10px 0}
    .login-content .openact{margin-top:20px}
    .login-content .recaptcha{margin-top:24px}
    .login-content.gift-card {height:unset}
    .login-content.gift-card #IDNO_Area, .login-content #IDNOH_Area{margin-top:36px}
    .login-content.gift-card hr{margin:23.5px 0}
    .login-content.gift-card .button-area{padding-top:24px}
    .login-content.gift-card .recaptcha{margin-top:24px}
}
