input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0px 1000px rgba(ff,ff,ff,1) inset; /*淡淡的白*/
    transition: background-color 5000s ease-in-out 0s; /*透明*/
}

a {
    text-decoration: none;
    color: #4a4a4a;
}
.PopupWindow {
    width: 100%;
    height: 100%;
    text-align: center;
    top: 0%;
    visibility: hidden;
    opacity: 0;
    z-index: 1000;
    display: flex;
    position: fixed;
    align-items: center;
    justify-content: center;
}

.PopupContent {
    border-color: #d0d1d1;
    border-image: none;
    border-style: solid;
    border-width: 1px 3px 3px 1px;
    box-sizing: border-box;
    width: auto;
    z-index: 2000;
    display: inline-block;
    background-color: #fff;
    max-width: 90%;
    min-width:200px;
    max-height: calc(100% - 20px);
    overflow: auto;
    text-align: left;
    padding: 5px;
    
}
    .PopupContent li {
        list-style-type: none;
    }
.PopupBG {
    width: 100%;
    height: 100%;
    text-align: center;
    top: 0%;
    opacity: 0.8;
    z-index: 1000;
    display: block;
    position: fixed;
    background-color: #FFFFFF;
}
.PopupMessage {
    min-height: 30px;
    margin: 10px 0;
    text-align: center;
}
.PopupTitleTr {
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    line-height: 2.5;
    text-align: center;
    color: #000000;
    height: 27px;
    letter-spacing: 1px;
    position: relative;
}
.nipLine {
    background-color: #d0d1d1;
    height: 1px;
    margin: 0 auto;
    width: 270px;
}
#block {
    display: none;
    width: 100%;
    height: 100%;
    text-align: center;
    top: 0%;
    opacity: 0.8;
    z-index: 1000;
    position: fixed;
    background-color: #FFFFFF;
}
.BtnConfirm {
    width: 196px;
    height: 40px;
    background-color: #000000;
    letter-spacing: 0.5px;
    text-align: center;
    color: #ffffff;
    line-height: 40px;
    cursor:pointer;
    margin:0 auto;
}
body {
    font-family: Jaldi, Helvetica, 微軟正黑體, sans-serif;
    font-size:14px;
}
/*.logo {
    font-size: 36px;
}*/
@media screen and (min-width: 768px) {
    .SignupThirdParty {
        -webkit-transition: all .5s linear;
        -moz-transition: all .5s linear;
        -o-transition: all .5s linear;
        -ms-transition: all .5s linear;
        transition: all .5s linear;
    }

    .SignupBlock {
        margin-top: 180px; /*width:50%;
        background:gray;*/
        width: 420px;
        height: 640px;
    }

    .SignupLogoBlock, .SignupShowBlock {
        width: 100%;
    }

    .SignupLogo {
        width: 30%;
        max-width: 86px;
        max-height: 25px;
        cursor: pointer;
    }

    .SignupShowBlock {
        margin-top: 20px;
    }

    .SignupShowTxt {
        width: 30%;
        max-width: 365px;
        max-height: 18px;
        object-fit: contain;
        font-weight: normal;
        
        font-stretch: normal;
        text-align: center;
        color: #4a4a4a;
    }

    .SignupTypeBlock {
        width: 100%;
        margin-top: 1em;
    }

    .SignupTypeBlockMob, .SignupTypeBlockMobOl {
        display: none;
    }

    .SignupType {
        width: 70%;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .SignupThirdPartyTwitter, .SignupThirdPartyWeibo {
        line-height: 40px;
        margin-top: 20px;
        background-color: rgba(236, 239, 241, 0.8);
        max-width: 280px;
        max-height: 40px;
        vertical-align: center;
        color: #4a4a4a;
        cursor: pointer;
    }

    .SignupThirdPartyFB {
        line-height: 40px;
        margin-top: 32px;
        background-color: rgba(236, 239, 241, 0.8);
        max-width: 280px;
        max-height: 40px;
        vertical-align: center;
        color: #4a4a4a;
        cursor: pointer;
    }

    .SignupThirdPartyTxtFB, .SignupThirdPartyTxtWB, .SignupThirdPartyTxtTW {

        font-size: 11px;
        font-weight: 600;
        letter-spacing: 0.5px;
        text-align: center;
        text-transform: uppercase;
        position: relative;
       
        cursor: pointer;
    }

    .SignupLogo {
        content: url("/images/store/iohll/iohll-logo.svg");
    }

        .SignupLogo:hover {
            content: url("/images/store/iohll/iohll-logo-over.svg");
        }

    .SignupThirdPartyTwitter:hover, .SignupThirdPartyWeibo:hover, .Signup:hover {
        background-color: #000000;
        color: #ffffff;
    }

    .SignupThirdPartyFB:hover {
        background-color: #000000;
        color: #ffffff;
    }

    .SignupThirdPartyTxtFB::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 40px;
        border-radius: 4px 0 0 4px;
        /*background: url("/images/store/iohll/fblogo.svg") no-repeat 0px center;*/ /*background-size: 20px 20px;
        background-position: 0px center;*/
    }

    .SignupThirdPartyTxtWB::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 40px;
        border-radius: 4px 0 0 4px;
        background: url("/images/store/iohll/weiboLogo.svg") no-repeat 0px center; /*background-size: 20px 20px;
        background-position: 0px center;*/
    }

    .SignupThirdPartyTxtTW::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 40px;
        border-radius: 4px 0 0 4px;
        background: url("/images/store/iohll/twitterLogo.svg") no-repeat 0px center; /*background-size: 20px 20px;
        background-position: 0px center;*/
    }

    .SignupThirdPartyFB:hover .SignupThirdPartyTxtFB::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 40px;
        border-radius: 4px 0 0 4px;
        /*background: url("/images/store/iohll/fblogo-over.svg") no-repeat 0px center;*/
    }

    .SignupThirdPartyWeibo:hover .SignupThirdPartyTxtWB::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 40px;
        border-radius: 4px 0 0 4px;
        background: url("/images/store/iohll/weiboLogo-over.svg") no-repeat 0px center;
    }

    .SignupThirdPartyTwitter:hover .SignupThirdPartyTxtTW::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 40px;
        border-radius: 4px 0 0 4px;
        background: url("/images/store/iohll/twitterLogo-over.svg") no-repeat 0px center;
    }

    .SignupThirdPartyFB:active .SignupThirdPartyTxtFB::before, .SignupThirdPartyWeibo:active .SignupThirdPartyTxtWB::before, .SignupThirdPartyTwitter:active .SignupThirdPartyTxtTW::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 0px;
        border-radius: 4px 0 0 4px;
        background: url("") no-repeat 0px center;
    }

    .SignupThirdPartyTxtFB:active, .SignupThirdPartyTxtWB:active, .SignupThirdPartyTxtTW:active {
        position: relative;
        padding: 12px 0px 11px 0px;
    }

    .Remember-me-Copy {
        width: 82px;
        height: 15px;
        font-size: 11px;
        letter-spacing: 0.5px;
        text-align: center;
        color: #4a4a4a;
        vertical-align: top;
    }

    .Signup {
        height: 40px;
        background-color: rgba(0, 0, 0, 0.8);
        color: #ffffff;
        font-weight: 600;
        cursor: pointer;
    }
        .Signup:hover {
            background-color: rgba(0, 0, 0, 1);
        }
    .SignupForgetPassword {
        height: 14px;
        font-size: 12px;
        font-style: italic;
        text-align: center;
        color: #000000;
        float: right;
    }

    .SignupCheckBox {
        float: left;
    }

    .SignupLabelWeb {
        margin-top: 7px;
        width: 70%;
        max-width: 280px;
    }

    .SignupLabelMob {
        display: none;
    }

    .SignupLabel {
        margin-top: 7px;
        width: 70%;
        max-width: 280px;
    }

    .SignupBtn {
        width: 70%;
        max-width: 280px;
        padding-top: 17px;
        cursor: pointer;
    }

    .New-Customer {
        width: 90px;
        height: 18px;
        font-size: 14px;
        font-style: italic;
        text-align: center;
        color: #4a4a4a;
    }

    .Start-Here {
        margin-left: 18px;
        width: 62px;
        height: 18px;
        font-size: 14px;
        font-style: italic;
        text-align: center;
        color: #000000;
    }

    .NewOrStart {
        margin-top: 33px;
    }

    .RemberCheckBox {
        margin: 0;
    }

    .SIGN-IN {
        width: 40px;
        height: 15px;
        font-size: 11px;
        font-weight: 600;
        letter-spacing: 0.5px;
        text-align: center;
        color: #ffffff;
        line-height: 3.5em;
    }

    a {
        text-decoration: underline;
        color: #4a4a4a;
    }

        a:hover {
            text-decoration: underline;
            color: #000000;
        }

        a:active {
            text-decoration: underline;
            width: 91px;
            font-weight: bold;
            color: #000000;
        }

    .SignupInputTitleTxt {
        float: left;
        height: 15px;
        font-size: 14px;
        font-weight: normal;
        font-style: normal;
        font-stretch: normal;
        letter-spacing: 0.5px;
        text-align: center;
        color: #000000;
    }

    .SignupInputValueTxt {
        height: 45px;
        width: 100%;
        border: 0;
        outline: 0;
        background: transparent;
        border-bottom: 1px solid #9b9b9b;
    }

    .SignupInputTitle {
        margin-top: 18px;
        width: 70%;
        max-width: 280px;
    }

    .SignupInputPASSWORD {
        margin-top: 15px;
        width: 70%;
        max-width: 280px;
    }

    .SignupInputValue {
        width: 70%;
        max-width: 280px;
    }

    .jardsonaraujogmail {
        font-size: 14px;
        font-weight: normal;
        font-style: normal;
        font-stretch: normal;
        letter-spacing: 0.5px;
        color: #4a4a4a;
    }

    .SignupTypeMore {
        margin-top: 22.6px;
        margin-bottom: 65px;
        cursor: pointer;
    }

    ::-webkit-input-placeholder {
        /* Chrome/Opera/Safari */
        opacity: 0;
    }

    ::-moz-placeholder {
        /* Firefox 19+ */
        opacity: 0;
    }

    :-ms-input-placeholder {
        /* IE 10+ */
        opacity: 0;
    }

    :-moz-placeholder {
        /* Firefox 18- */
        opacity: 0;
    }

    .Already-Have-an-acco {
        height: 18px;
        font-size: 14px;
        font-weight: normal;
        font-style: italic;
        font-stretch: normal;
        text-align: center;
        color: #4a4a4a;
    }

    u {
        text-decoration: none;
    }
}

@media screen and (max-width: 767px) {
    .SignupThirdParty {
        -webkit-transition: all .5s linear;
        -moz-transition: all .5s linear;
        -o-transition: all .5s linear;
        -ms-transition: all .5s linear;
        transition: all .5s linear;
    }

    .SignupBlock {
        margin-top: 70px;
        max-width: 750px;
    }

    .SignupLogoBlock {
        width: 100%;
    }

    .SignupShowBlock {
        width: 215px;
        margin-top: 47px;
    }

    .SignupLogo {
        max-height: 37px;
        cursor: pointer;
    }

    .SignupShowTxt {
        min-height: 18px;
        font-size: 15px;
        font-weight: normal;
        font-style: italic;
        font-stretch: normal;
        text-align: center;
        color: #4a4a4a;
    }

    .SignupTypeBlock {
        display: none;
        width: 100%;
        margin-top: 1em;
    }

    .SignupTypeBlockMob {
        width: 100%;
        margin-top: 52px;
    }

    .SignupTypeBlockMobOl {
        width: 100%;
        margin-top: 27px;
    }

    .SignupType {
        width: 80.5%;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .SignupThirdPartyTxtFB, .SignupThirdPartyTxtWB, .SignupThirdPartyTxtTW {
        font-size: 12px;
        font-weight: 600;
        letter-spacing: 0.5px;
        text-align: center;
        text-transform: uppercase;
        position: relative;
        padding: 12px 0px 11px 43px;
        cursor: pointer;
        font-style: normal;
        font-stretch: normal;
    }

    .SignupLogo {
        content: url("/images/store/iohll/mob-iohll-logo.svg");
    }

    .SignupThirdPartyTxtFB::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 43px;
        border-radius: 4px 0 0 4px;
        background: url("/images/store/iohll/mob-fb.svg") no-repeat 0px center; /*background-size: 20px 20px;
        background-position: 0px center;*/
    }

    .SignupThirdPartyTxtWB::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 43px;
        border-radius: 4px 0 0 4px;
        background: url("/images/store/iohll/mob-wb.svg") no-repeat 0px center; /*background-size: 20px 20px;
        background-position: 0px center;*/
    }

    .SignupThirdPartyTxtTW::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 43px;
        border-radius: 4px 0 0 4px;
        background: url("/images/store/iohll/mob-tw.svg") no-repeat 0px center; /*background-size: 20px 20px;
        background-position: 0px center;*/
    }

    .slide-wrapper:active .SignupThirdPartyTxtFB::before, .slide-wrapper:active .SignupThirdPartyTxtWB::before, .slide-wrapper:active .SignupThirdPartyTxtTW::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 0px;
        border-radius: 4px 0 0 4px;
        background: url("") no-repeat 0px center;
    }

    .slide-wrapper:active, .Signup:active {
        background-color: #000000;
        color: #ffffff;
    }

    .Remember-me-Copy {
        width: 82px;
        height: 15px;
        font-size: 11px;
        letter-spacing: 0.5px;
        text-align: center;
        color: #4a4a4a;
        vertical-align: top;
    }

    .Signup {
        height: 43px;
        background-color: rgba(236, 239, 241, 0.8);
        color: rgb(74, 74, 74);
        cursor: pointer;
    }

    .SignupForgetPassword {
        height: 18px;
        font-size: 15px;
        font-weight: normal;
        font-style: italic;
        font-stretch: normal;
        text-align: center;
        color: #4a4a4a;
        float: right;
    }

    .SignupCheckBox {
        float: left;
    }

    .SignupLabel {
        margin-top: 7px;
        width: 80.5%;
        max-width: 610px;
    }

    .SignupLabelWeb {
        display: none;
    }

    .SignupLabelMob {
        margin-top: 15px;
        width: 80.5%;
        max-width: 610px;
    }

    .SignupBtn {
        width: 80.5%;
        max-width: 610px;
        max-height: 43px;
        padding-top: 17px;
        cursor: pointer;
    }

    .New-Customer {
        width: 97px;
        height: 18px;
        font-size: 15px;
        font-weight: normal;
        font-style: italic;
        font-stretch: normal;
        text-align: center;
        color: #4a4a4a;
    }

    .Start-Here {
        margin-left: 10px;
        width: 67px;
        height: 18px;
        font-size: 15px;
        font-weight: normal;
        font-style: italic;
        font-stretch: normal;
        text-align: center;
        color: #4a4a4a;
    }

    .NewOrStart {
        margin-top: 34px;
    }

    .RemberCheckBox {
        margin: 0;
    }

    .SIGN-IN {
        width: 52px;
        height: 20px;
        font-size: 15px;
        font-weight: 600;
        font-style: normal;
        font-stretch: normal;
        text-align: center;
        color: #ffffff;
        line-height: 3em;
    }

    a {
        text-decoration: underline;
        color: #4a4a4a;
    }

        a:hover {
            text-decoration: underline;
            color: #000000;
        }

        a:active {
            text-decoration: underline;
            width: 91px;
            font-weight: bold;
            color: #000000;
        }

    .SignupInputTitleTxt {
        float: left;
        width: 35px;
        height: 15px;
        font-size: 11px;
        font-weight: normal;
        font-style: normal;
        font-stretch: normal;
        letter-spacing: 0.5px;
        text-align: center;
        color: #000000;
    }

    .SignupInputValueTxt {
        height: 43px;
        width: 100%;
        border: 0;
        outline: 0;
        background: transparent;
        border-bottom: 1px solid #9b9b9b;
    }

    .SignupInputTitle {
        display: none;
        margin-top: 18px;
        width: 80.5%;
        max-width: 610px;
    }

    .SignupInputPASSWORD {
        display: none;
        margin-top: 15px;
        width: 80.5%;
        max-width: 610px;
    }

    .SignupInputValue {
        width: 80.5%;
        max-width: 610px;
    }

    .jardsonaraujogmail {
        font-size: 12px;
        font-weight: normal;
        font-style: normal;
        font-stretch: normal;
        letter-spacing: 0.5px;
        color: #4a4a4a;
    }

    .SignupTypeMore {
        margin-top: 22.6px;
        margin-bottom: 65px;
        cursor: pointer;
    }

    ::-webkit-input-placeholder {
        /* Chrome/Opera/Safari */
        opacity: 0.5;
    }

    ::-moz-placeholder {
        /* Firefox 19+ */
        opacity: 0.5;
    }

    :-ms-input-placeholder {
        /* IE 10+ */
        opacity: 0.5;
    }

    :-moz-placeholder {
        /* Firefox 18- */
        opacity: 0.5;
    }

    .SignupInputEMAIL {
        margin-top: 43px;
    }

    .SignupInputPW {
        margin-top: 18px;
    }

    @ import url(http: // fonts.googleapis.com / css?family=Josefin + Slab:100);

    .animate {
        transition: transform 0.3s ease-out;
    }

    .slider-wrap {
        width: 80.5%;
        max-width: 610px;
    }

    .slider {
        width: 100%;
        height: 100%;
        overflow: hidden;
    }

    .ms-touch.slider {
        overflow-x: scroll;
        overflow-y: hidden;
        -ms-overflow-style: none; /* Hides the scrollbar. */
        -ms-scroll-chaining: none; /* Prevents Metro from swiping to the next tab or app. */
        -ms-scroll-snap-type: mandatory; /* Forces a snap scroll behavior on your images. */
        -ms-scroll-snap-points-x: snapInterval(0%, 100%); /* Defines the y and x intervals to snap to when scrolling. */
    }

    .holder {
        width: 300%;
        height: 100%;
        overflow-y: hidden;
    }

    .slide-wrapper {
        width: 33.333%;
        height: 100%;
        float: left;
        position: relative;
        overflow: hidden;
        line-height: 43px;
        background-color: rgba(236, 239, 241, 0.8);
        max-height: 43px;
        color: #4a4a4a;
        cursor: pointer;
    }

    .slide {
        height: 100%;
        position: relative;
    }

    .dots li {
        border-radius: 8px;
        cursor: pointer;
        display: inline-block;
        height: 10px;
        width: 10px;
        margin: 0 4px;
        opacity: 1;
        text-indent: -999em;
        transition: background 0.5s ease 0s, opacity 0.5s ease 0s;
        background-color: #d7d7d7;
    }

        .dots li.active {
            background-color: #4a4a4a;
        }

    .Already-Have-an-acco {
        height: 18px;
        font-size: 14px;
        font-weight: normal;
        font-style: italic;
        font-stretch: normal;
        text-align: center;
        color: #4a4a4a;
    }
}

.canSend {
    color: #4a4a4a;
}

/* [2026-03-24] 目的：註冊頁補上 footer 顯示樣式（品牌 footer 或 fallback footer） */
#Footer,
#SignupFooter {
    width: min(460px, 94vw);
    margin: 8px auto 28px;
    color: #666;
}

.SignupFooterInner {
    border-top: 1px solid #e8e3d8;
    padding-top: 12px;
    text-align: center;
}

.SignupFooterLinks {
    font-size: 13px;
    line-height: 1.8;
}

.SignupFooterLinks a {
    color: #4a4a4a;
    text-decoration: underline;
}

.SignupFooterCopy {
    margin-top: 4px;
    font-size: 12px;
    color: #8a8a8a;
}

/* [2026-03-24] 目的：註冊頁第一版視覺升級（僅 HTML/CSS，不調整任何後端或 JS 流程） */
body {
    background: #f6f5f1;
    color: #222;
}

/* [2026-03-24] 目的：避免影響站台既有 header 版面，主容器不改成 flex */
#MainContent {
    min-height: 0;
    display: block;
    padding: 0;
}

.SignupBlock {
    width: min(460px, 94vw) !important;
    height: auto !important;
    margin: 110px auto 40px !important;
    background: #fff;
    border: 1px solid #ece8df;
    border-radius: 16px;
    box-shadow: 0 16px 36px rgba(0, 0, 0, .12);
    padding: 32px 30px 30px;
    box-sizing: border-box;
}

.SignupLogoBlock {
    margin-bottom: 8px;
}

.SignupShowBlock {
    margin-top: 0 !important;
    margin-bottom: 14px;
}

.SignupShowTxt {
    display: block;
    font-size: 22px !important;
    font-weight: 800 !important;
    font-style: normal !important;
    color: #181818 !important;
    letter-spacing: .01em;
    line-height: 1.25;
    width: 100% !important;
    max-width: none !important;
    max-height: none !important;
    text-align: center !important;
    white-space: normal;
    word-break: keep-all;
}

/* [2026-03-24] 目的：註冊頁主標下方補充副標，清楚說明註冊價值 */
.SignupShowSubTxt {
    margin: 6px 0 0;
    font-size: 13px;
    color: #6c6c6c;
    line-height: 1.6;
    text-align: center;
    width: 100%;
}

.SignupType {
    width: 100% !important;
}

.SignupTypeBlock {
    margin-top: 12px !important;
}

.SignupThirdPartyFB {
    max-width: none !important;
    margin-top: 0 !important;
    border: 1px solid #e6e2d8;
    border-radius: 10px;
    background: #f8f7f3 !important;
}

.SignupThirdPartyFB:hover {
    background: #111 !important;
}

/* [2026-08-07] 目的：Google 註冊按鈕取代 Facebook，桌機與手機共用同一個清楚的第三方入口。 */
.SignupThirdPartyGoogle,
.SignupThirdParty.GOOGLESIGNUP {
    max-width: none !important;
    margin-top: 0 !important;
    border: 1px solid #dadce0 !important;
    border-radius: 10px !important;
    background: #fff !important;
    color: #3c4043 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    cursor: pointer;
}

.SignupThirdPartyTxtGoogle {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: auto !important;
    color: #3c4043 !important;
    font-weight: 500;
}

.SignupThirdPartyTxtGoogle::before {
    content: "G";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    margin-right: 10px;
    border-radius: 50%;
    color: #4285f4;
    background: #fff;
    font: 700 16px/1 Arial, sans-serif;
}

.SignupThirdPartyGoogle:hover,
.SignupThirdPartyGoogle:focus,
.SignupThirdParty.GOOGLESIGNUP:hover,
.SignupThirdParty.GOOGLESIGNUP:focus {
    background: #f8f9fa !important;
    border-color: #c5c8cc !important;
}

.SignupInputBlock {
    margin-top: 22px;
}

.SignupInputEMAIL,
.SignupInputPW {
    margin-top: 0 !important;
}

.SignupInputTitle,
.SignupInputPASSWORD,
.SignupInputValue,
.SignupBtn,
.SignupLabel {
    width: 100% !important;
    max-width: none !important;
}

/* [2026-03-24] 目的：註冊欄位標題與同意條款改為左對齊，提升閱讀節奏 */
.SignupInputTitle,
.SignupInputPASSWORD,
.SignupInputValue,
.SignupInputBlock > div {
    text-align: left !important;
}

.SignupInputTitle {
    margin-top: 18px !important;
}

.SignupInputPASSWORD {
    margin-top: 18px !important;
}

.SignupInputTitleTxt {
    float: none !important;
    display: inline-block;
    font-size: 14px !important;
    color: #555 !important;
    text-align: left !important;
    width: 100% !important;
}

.SignupInputValueTxt {
    height: 46px !important;
    border: 1px solid #ddd7ca !important;
    border-radius: 10px;
    padding: 0 12px;
    background: #fff !important;
    box-sizing: border-box;
}

.SignupInputValueTxt:focus {
    border-color: #89b4ff !important;
    box-shadow: 0 0 0 3px rgba(53, 120, 230, .15);
}

.SignupInputValue {
    margin-top: 8px;
}

.SignupBtn {
    padding-top: 24px !important;
}

.Signup {
    height: 46px !important;
    border-radius: 999px;
    background: #111 !important;
    color: #fff !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

.SIGN-IN {
    font-size: 15px !important;
    line-height: 1 !important;
    width: auto !important;
    height: auto !important;
}

.SignupLabel.NewOrStart {
    margin-top: 24px !important;
    text-align: center;
}

.Already-Have-an-acco {
    font-size: 14px !important;
    color: #666 !important;
}

#AgreePolicy {
    margin-top: 2px;
}

#AgreePolicy + label {
    font-size: 14px;
    color: #555;
    line-height: 1.75;
    text-align: left !important;
    display: inline-block;
}

@media (max-width: 767px) {
    #Footer,
    #SignupFooter {
        width: min(94vw, 460px);
        margin: 8px auto 20px;
    }

    .SignupFooterLinks {
        font-size: 12px;
    }

    .SignupFooterCopy {
        font-size: 11px;
    }

    /* [2026-03-24] 目的：修正註冊頁手機 header logo 與漢堡按鈕垂直對齊 */
    #HeaderContentMobile {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        min-height: 58px !important;
        padding: 10px 12px 10px 14px !important;
        box-sizing: border-box;
        border-bottom: 1px solid #ece9e2;
        position: relative !important;
    }

    #HeaderContentMobile .HeaderLeft {
        margin: 0 !important;
        line-height: 1 !important;
        display: flex;
        align-items: center;
        font-size: 30px !important;
        font-weight: 700 !important;
        letter-spacing: 0.02em;
    }

    #HeaderContentMobile .HeaderLeft a,
    #HeaderContentMobile .HeaderLeft span {
        font-size: 30px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
    }

    .SignupBlock {
        /* [2026-03-24] 目的：註冊主視覺貼近 header 下方，避免首屏留白過大 */
        margin: 12px auto 22px !important;
        padding: 24px 16px 22px;
    }
    .SignupTypeBlock {
        display: block !important;
    }
    .SignupTypeBlockMob,
    .SignupTypeBlockMobOl {
        display: none !important;
    }
    .SignupInputTitle,
    .SignupInputPASSWORD {
        display: block !important;
    }

    /* [2026-03-24] 目的：手機版註冊頁第二輪優化，提升可讀性與點擊舒適度 */
    .SignupBlock {
        width: min(94vw, 460px) !important;
        border-radius: 16px;
        padding: 22px 14px 20px !important;
        box-shadow: 0 8px 20px rgba(0, 0, 0, .10);
    }

    .SignupLogoBlock {
        margin-bottom: 6px;
    }

    .SignupShowTxt {
        font-size: 20px !important;
        line-height: 1.3 !important;
        letter-spacing: .01em;
        font-style: normal !important;
    }

    .SignupShowSubTxt {
        font-size: 13px;
        line-height: 1.65;
        margin-top: 5px;
    }

    .SignupTypeBlock {
        margin-top: 10px !important;
    }

    .SignupThirdPartyFB {
        line-height: 42px !important;
        max-height: 42px !important;
        border-radius: 10px;
    }

    .SignupThirdPartyTxtFB {
        font-size: 13px !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        line-height: 42px !important;
    }

    .SignupInputBlock {
        margin-top: 18px;
    }

    .SignupInputTitle {
        margin-top: 14px !important;
    }

    .SignupInputPASSWORD {
        margin-top: 14px !important;
    }

    .SignupInputTitleTxt {
        font-size: 13px !important;
    }

    .SignupInputValue {
        margin-top: 7px;
    }

    .SignupInputValueTxt {
        height: 44px !important;
        font-size: 15px !important;
    }

    #AgreePolicy + label {
        font-size: 13px;
        line-height: 1.7;
    }

    .SignupBtn {
        padding-top: 18px !important;
    }

    .Signup {
        height: 44px !important;
    }

    .SIGN-IN {
        font-size: 15px !important;
    }

    .SignupLabel.NewOrStart {
        margin-top: 18px !important;
    }

    .Already-Have-an-acco {
        font-size: 13px !important;
    }

    /* [2026-03-24] 目的：修正手機版 Facebook 按鈕文字偏移，維持置中可讀 */
    .SignupThirdPartyTxtFB {
        display: block !important;
        width: 100% !important;
        padding-left: 0 !important;
        text-align: center !important;
    }

    .SignupThirdPartyTxtFB::before {
        display: none !important;
    }

    /* [2026-03-24] 目的：第二輪修正手機版漢堡按鈕越界與主選單被註冊區塊覆蓋 */
    #Header,
    header {
        z-index: 5000 !important;
        overflow: visible !important;
    }

    #HeaderContentMobile,
    header .header-inner {
        position: relative !important;
        overflow: visible !important;
        z-index: 5010 !important;
    }

    #MainContent {
        position: relative;
        z-index: 1;
    }

    #Header .menu-mobile {
        position: relative;
    }

    #Header .menu-mobile .navbar-toggle,
    #HeaderContentMobile .navbar-toggle,
    header .menu-mobile .navbar-toggle {
        /* [2026-03-24] 目的：漢堡按鈕保留右側留白並與 logo 垂直置中 */
        position: absolute !important;
        right: 10px !important;
        top: 50% !important;
        float: none !important;
        margin: 0 !important;
        margin-right: 0 !important;
        z-index: 5120 !important;
        transform: translateY(-50%) !important;
        align-self: auto !important;
        width: 38px !important;
        height: 38px !important;
        padding: 8px 7px !important;
        border-radius: 8px !important;
        border: 1px solid #e2ded4 !important;
        background: #f8f7f4 !important;
        box-sizing: border-box;
    }

    #Header .menu-mobile .navbar-toggle .icon-bar,
    #HeaderContentMobile .navbar-toggle .icon-bar,
    header .menu-mobile .navbar-toggle .icon-bar {
        width: 22px !important;
        height: 2px !important;
        margin-top: 4px !important;
        background-color: #8f8f8f !important;
    }

    #Header .menu-mobile .HeaderCenter,
    #HeaderContentMobile .HeaderCenter,
    header .menu-mobile .HeaderCenter {
        position: absolute;
        left: 0 !important;
        right: 0 !important;
        top: 100% !important;
        z-index: 5110 !important;
        background: #fff !important;
        max-height: calc(100vh - 72px) !important;
        overflow-y: auto !important;
        box-shadow: 0 8px 20px rgba(0, 0, 0, .12) !important;
    }

    /* [2026-03-24] 目的：避免手機選單展開時把 header 當成積木撐高，改為覆蓋層 */
    header .menu-mobile {
        position: relative !important;
        min-height: 40px;
    }

    /* [2026-03-24] 目的：保留原生 collapse 顯示邏輯，僅在展開時調整為覆蓋層 */
    #main_manu {
        display: block !important;
        position: static !important;
        max-height: none !important;
        overflow: visible !important;
        box-shadow: none !important;
        background: transparent !important;
    }

    /* [2026-03-24] 目的：修正註冊頁手機選單僅顯示登入/購物車，補強 LeftMenu 顯示 */
    #HeaderContentMobile .HeaderCenter .menu,
    #Header .menu-mobile .HeaderCenter .menu,
    #main_manu .menu,
    #HeaderContentMobile .HeaderCenter .cbp-hrmenu,
    #Header .menu-mobile .HeaderCenter .cbp-hrmenu,
    #main_manu .cbp-hrmenu {
        display: block !important;
        width: 100% !important;
    }

    /* [2026-03-24] 目的：避免 bootstrap collapse 把手機 menu 隱藏，強制展開於註冊頁檢視 */
    #main_manu.collapse,
    #main_manu.collapse:not(.in),
    #main_manu.collapsing,
    #HeaderContentMobile .HeaderCenter .collapse,
    #HeaderContentMobile .HeaderCenter .collapse:not(.in),
    #HeaderContentMobile .HeaderCenter .collapsing {
        display: block !important;
        height: auto !important;
        visibility: visible !important;
        overflow: visible !important;
    }

    /* [2026-03-24] 目的：修正手機點擊後 Facebook 註冊按鈕變黑（避免 sticky hover） */
    .SignupThirdPartyFB:hover,
    .SignupThirdPartyFB:active,
    .SignupThirdPartyFB:focus,
    .SignupThirdPartyFB:focus-visible {
        background: #f8f7f3 !important;
        color: #4a4a4a !important;
    }
}
