/* default frame setting */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

a,
img {
    border: none;
    text-decoration: none;
}

html {
    font-family: "微軟正黑體", Arial, sans-serif !important;
    -webkit-text-size-adjust: none;
}

ul,
li {
    list-style: none;
    margin: 0;
}

body {
    background-color: #f4f6f7;
}

.clearfix {
    clear: both;
}

.bg-icon {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-image: url(https://www.1111.com.tw/Content/images/bg-hiring-icon-bk.svg);
    opacity: .055;
    background-size: 30em;
    z-index: -1;
}

.header {
    height: 44px;
    line-height: 44px;
    position: absolute;
    background-color: #014FA2;
    width: 100%;
    top: 0;
    z-index: 99;
}

.headercenter {
    text-align: center;
    font-weight: bold;
    color: #fff;
    letter-spacing: 1px;
    width: 100%;
    font-size: 20px;
}

    .headercenter img {
        vertical-align: text-top;
    }

/*.btnTopRight{position:absolute; top:0; right:0; padding: 0 5px;}
.btnTopLeft{position:absolute; top:0; left:0;}*/
.btnTopR {
    display: inline-block;
    height: 30px;
    line-height: 30px;
    text-decoration: none;
    color: #fff;
    background: url(https://www.1111.com.tw/Content/images/iconBG.png) top left no-repeat;
    font-size: 13px;
}

    .btnTopR b {
        display: inline-block;
        height: 30px;
        line-height: 30px;
        text-decoration: none;
        color: #fff;
        background: url(https://www.1111.com.tw/Content/images/iconBG.png) top right no-repeat;
        padding: 0px 10px;
    }

.btnHome {
    display: inline-block;
    width: 16px;
    height: 22px;
    background: url(https://www.1111.com.tw/Content/images/icon_backward.png) no-repeat;
    -webkit-background-size: 16px 22px;
    background-size: 16px 22px;
    vertical-align: middle;
    margin: -5px 0 0 10px;
}

.footer {
    width: 100%;
    clear: both;
    background-color: #909090;
    position: relative;
    z-index: 1 !important;
}

    .footer .mainService {
        font-weight: bold;
    }

    .footer a {
        color: #fff;
    }

    .footer div {
        width: 100%;
        line-height: 2;
    }

    .footer ul {
        list-style: none;
        margin: 0;
        padding: 0;
        overflow: hidden;
        background: #575757;
    }

    .footer li:first-child {
        width: 35%;
    }

    .footer li {
        float: left;
        text-align: center;
        width: 21%;
    }

.copyright {
    color: #919191;
    text-align: center;
    font-size: 13px;
    background-color: #575757;
}

.NewLoginMain {
    max-width: 990px;
    margin: 0 auto;
    padding: 20px 0;
}

    .NewLoginMain .breadcrumb {
        font-size: 13px;
        margin: 70px 0 30px;
        padding-left: 10px;
        position: relative;
        font-family: "微軟正黑體", Arial, sans-serif !important; /*自動找手機裡的黑體字*/
        -webkit-text-size-adjust: none; /*修正iphone旋轉後文字不要放大*/
    }

        .NewLoginMain .breadcrumb a {
            color: #000;
            padding: 0 3px;
            text-decoration: none;
        }

            .NewLoginMain .breadcrumb a::after {
                content: "\f105";
                padding: 0 3px 0 8px;
                font: normal normal normal 15px/1 FontAwesome;
            }

.inlineBlockMain {
    margin-bottom: 30px;
    text-align: center;
}

.registeredMain {
    justify-content: space-around;
    margin-bottom: 30px;
}

.NewLoginMain .Loginitem {
    background: #fff;
    -webkit-box-shadow: 0px 2px 15px rgb(100, 100, 100, 0.12);
    box-shadow: 0px 2px 15px rgb(100, 100, 100, 0.12);
    border-radius: 8px;
    width: 440px;
    position: relative;
    margin: auto;
    padding: 1.5rem 2rem;
    -webkit-transition: 0.3s ease;
    transition: 0.3s ease;
    font-family: "微軟正黑體", Arial, sans-serif !important; /*自動找手機裡的黑體字*/
    -webkit-text-size-adjust: none; /*修正iphone旋轉後文字不要放大*/
}

    .NewLoginMain .Loginitem.loginInLeft {
        display: inline-block;
        vertical-align: top;
        margin: 0 25px;
    }

    .NewLoginMain .Loginitem .logincontent {
        width: 100%;
        min-height: 390px;
        padding: 30px 35px 10px;
        padding: 1rem 2rem;
        float: left;
    }

        .NewLoginMain .Loginitem .logincontent.stepFirst {
            min-height: auto;
        }

        .NewLoginMain .Loginitem .logincontent.type01 {
            padding: 0.5rem 0 1rem;
        }

/*logo+大標題*/
.Loginitem .logincontent .title_content {
    /*text-align: center;*/
    margin-bottom: 1rem;
    position: relative;
}

    .Loginitem .logincontent .title_content h2 {
        font-weight: 500;
        font-size: 26px;
        background: linear-gradient(0deg, #03aff0 0%, #9438cc 100%) 0% 0% no-repeat padding-box;
        background: -webkit-linear-gradient(0deg, #03aff0 0%, #9438cc 100%) 0% 0% no-repeat padding-box;
        background-clip: text;
        -webkit-background-clip: text;
        color: transparent;
        display: inline-block;
        margin: 0 auto;
        text-align: left;
        vertical-align: middle;
        font-family: "微軟正黑體", Arial, sans-serif !important; /*自動找手機裡的黑體字*/
        -webkit-text-size-adjust: none; /*修正iphone旋轉後文字不要放大*/
    }

    .Loginitem .logincontent .title_content img {
        display: inline-block;
        max-width: 7rem;
        vertical-align: middle;
        margin-right: 10px;
    }

.Loginitem .logincontent .language_switch {
    position: absolute;
    right: 0;
    top: 10px;
}

    .Loginitem .logincontent .language_switch a {
        color: #04AFF0;
        text-decoration: underline;
        -webkit-transition: 0.3s ease;
        transition: 0.3s ease;
        padding: 0 0 0 3px;
    }

.NewLoginMain .Loginitem .logincontent h3 {
    font-size: 16px;
    font-weight: bold;
    color: #000;
    padding-bottom: 5px;
    text-align: left;
}

    .NewLoginMain .Loginitem .logincontent h3.other_title {
        margin-top: 2rem;
    }

    .NewLoginMain .Loginitem .logincontent h3 span {
        font-size: 14px;
        color: #505050;
        font-weight: normal;
        padding-left: 5px;
    }

.NewLoginMain .Loginitem .logincontent .mobileAd {
    display: none;
    margin-bottom: 20px;
}

    .NewLoginMain .Loginitem .logincontent .mobileAd img {
        width: 100%;
        border: 1px solid #eee;
    }

.logincontent ul.tablebar {
    padding: 0.5rem 0 0;
    color: #a7a7a7;
}

.logincontent.type01 ul.tablebar {
    padding: 0rem 2rem;
}

@media screen and (max-width: 767px) {
    .logincontent.type01 ul.tablebar {
        padding: 0;
    }
}

.logincontent ul.tablebar a {
    color: #04AFF0;
    text-decoration: underline;
    -webkit-transition: 0.3s ease;
    transition: 0.3s ease;
}

    .logincontent ul.tablebar a:hover {
        color: #0988CB;
    }

.logincontent ul.tablebar li.twoItem-box {
    font-size: 0;
    margin-bottom: 0.5rem;
}

.forgrtmessage {
    color: #888;
    font-size: 14px;
    text-align: center;
}

.anniversary img {
    width: 100%;
}

/*填寫表單欄位*/
ul.tablebar .inputSty {
    position: relative;
    margin-bottom: 5px;
}

    ul.tablebar .inputSty span {
        color: #6f6f6f;
        position: absolute;
        top: 50%;
        width: 40px;
        text-align: center;
        transform: translateY(-50%);
        transition: 0.3s;
    }

        ul.tablebar .inputSty span.EnterCodeText {
            color: #6C757D;
            text-indent: 42px;
            font-weight: 800;
            left: 0;
            top: 20px;
        }

        ul.tablebar .inputSty span.inputicon {
            left: 0;
        }

        ul.tablebar .inputSty span i {
            font-size: 18px;
        }

            ul.tablebar .inputSty span i.fa-mobile {
                font-size: 32px;
            }

    ul.tablebar .inputSty input {
        width: 100%;
        height: 40px;
        font-family: "微軟正黑體", Arial, sans-serif !important;
        font-size: 1rem;
        outline: none;
        text-indent: 30px;
        transition: 0.3s;
        box-shadow: none;
        -webkit-appearance: none;
        display: block;
        padding: 0.375rem 0.75rem;
        line-height: 1.5;
        color: #495057;
        background-color: #fff;
        background-clip: padding-box;
        border-radius: 0.25rem;
        transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
        border: 1px solid #CBCBCB;
        border-radius: 6px;
        padding: 0.9rem 1rem 0.9rem 0.5rem;
    }

        ul.tablebar .inputSty input.EnterCode {
            text-indent: 74px;
        }

        ul.tablebar .inputSty input:focus,
        ul.tablebar .sexmaxclick select:focus {
            color: #495057;
            border-color: #80bdff;
            outline: 0;
            border: 1px solid #04AFF0;
            -webkit-box-shadow: 0 0 0 3px #d1eaf8;
            box-shadow: 0 0 0 3px #d1eaf8;
        }

            ul.tablebar .inputSty input:focus + span i {
                background: linear-gradient( -45deg, #03aff0 0%, #9438cc 100%) 0% 0% no-repeat padding-box;
                background: -webkit-linear-gradient(-45deg, #03aff0 0%, #9438cc 100%) 0% 0% no-repeat padding-box;
                background-clip: text;
                -webkit-background-clip: text;
                color: transparent;
            }

        ul.tablebar .inputSty input::placeholder {
            color: #999;
            opacity: 1;
        }

        ul.tablebar .inputSty input::-ms-input-placeholder {
            color: #999;
        }

        /*清除Edge瀏覽器 password密碼input的明文圖標*/
        ul.tablebar .inputSty input::-ms-reveal {
            display: none;
        }

        ul.tablebar .inputSty input.error {
            border-color: #FF6B81;
        }

        ul.tablebar .inputSty input.fontSize13::placeholder {
            font-size: 13px;
        }

    ul.tablebar .inputSty div.btns,
    ul.tablebar .inputSty button,
    ul.tablebar .inputSty a.gobackbtn {
        position: absolute;
        top: 50%;
        z-index: 2;
        display: block;
        text-align: center;
        transform: translateY(-50%);
        cursor: pointer;
    }

    ul.tablebar .inputSty div.eyebor {
        right: 5px;
        position: absolute;
        top:25%;
    }

    ul.tablebar .inputSty div.downbor {
        right: 9px;
        background-color: #fff;
        position: absolute;
        top: 10px;
    }

    ul.tablebar .inputSty div.checkedicon {
        right: 35px;
        position: absolute;
        top: 10px;
    }

        ul.tablebar .inputSty div.checkedicon i {
            color: #4BC74C;
        }

    ul.tablebar .inputSty div.checkicon {
        right: 40px;
        color: #4BC74C;
    }

    ul.tablebar .inputSty div i {
        font-size: 20px;
    }

        ul.tablebar .inputSty div i.fa.fa-eye-slash {
            color: #999;
        }

        ul.tablebar .inputSty div i.fa.fa-eye {
            color: #4BC74C;
        }

    ul.tablebar .inputSty button {
        right: 0;
        border: none;
        outline: none;
        background: transparent linear-gradient(90deg, #03aff0 0%, #9438cc 100%) 0% 0% no-repeat padding-box;
        color: #fff;
        padding: 10px 15px;
        border-radius: 6px;
        font-size: 14px;
        font-family: "微軟正黑體";
        font-weight: 600;
    }

        ul.tablebar .inputSty button.disabled {
            cursor: inherit;
            background: #f2f2f2;
            color: #505050;
            right: 1px;
        }

    ul.tablebar .inputSty span.codeTips {
        right: 0;
        border: none;
        outline: none;
        background: #4983DB;
        color: #fff;
        padding: 10px 15px;
        border-radius: 5px;
        font-size: 14px;
        font-family: "微軟正黑體";
        width: auto;
        top: 50%;
    }

        ul.tablebar .inputSty span.codeTips.disabled {
            background: #999999;
            cursor: inherit;
        }

    ul.tablebar .inputSty a.gobackbtn {
        width: 35px;
        height: 40px;
        line-height: 40px;
        background: #FF6B81;
        /*font-size: 20px;*/
        color: #fff;
        border-radius: 5px 0 0 5px;
    }

        ul.tablebar .inputSty a.gobackbtn i {
            font-size: 14px;
        }

    ul.tablebar .inputSty span.awicon {
        position: absolute;
        top: 50%;
        right: 0;
        z-index: 2;
        display: block;
        text-align: center;
        transform: translateY(-50%);
        cursor: pointer;
    }

        ul.tablebar .inputSty span.awicon i {
            font-size: 20px;
            color: #999;
        }

ul.tablebar .floatL {
    width: calc(100% - 5rem);
    display: inline-block;
    vertical-align: top;
    margin-bottom: 5px;
}

    ul.tablebar .floatL .inputSty {
        margin-bottom: 0;
    }

@media screen and (max-width: 767px) {
    ul.tablebar .floatL {
        margin-bottom: 0;
    }
}

ul.tablebar .sexmaxclick {
    display: inline-block;
    width: 4.75rem;
    margin-left: 0.25rem;
    position: relative;
    /*overflow: hidden;*/
    border: 1px solid #CBCBCB;
    border-radius: 6px;
}

    ul.tablebar .sexmaxclick select {
        width: 100%;
        height: 38px;
        border: none;
        padding: 0 8px;
        font: normal normal normal 14px/1 FontAwesome, 微軟正黑體;
        color: #888;
        outline: none;
        transition: 0.3s;
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        z-index: 2;
        position: relative;
        border: 1px solid #fff;
        border-radius: 6px;
        background-color: transparent;
    }

        ul.tablebar .sexmaxclick select::-ms-expand {
            display: none;
        }

    ul.tablebar .sexmaxclick:after {
        content: "";
        display: inline-block;
        width: 13px;
        height: 13px;
        margin-left: auto;
        background-image: url(https://www.1111.com.tw/Content/img/icon_arrow_3.svg);
        background-repeat: no-repeat;
        background-position: center;
        position: absolute;
        right: 5px;
        top: 50%;
        transform: translate(-20%, -50%);
        z-index: 2;
    }

    ul.tablebar .sexmaxclick option {
        padding: 5px;
    }

    ul.tablebar .sexmaxclick span {
        position: absolute;
        top: 50%;
        z-index: 2;
        display: block;
        text-align: center;
        transform: translateY(-50%);
        cursor: pointer;
    }

        ul.tablebar .sexmaxclick span.errorMsg {
            transform: none;
            left: 88px;
            text-align: left;
        }

    ul.tablebar .sexmaxclick.error {
        border-color: #FF6B81;
    }

ul.tablebar li.mobile-inlineBox {
    font-size: 0;
}

ul.tablebar .inputSty select:focus + span {
    color: #777;
}

ul.tablebar .inputSty .btns {
    position: absolute;
    right: 1px;
    font-size: 0;
    border-radius: 6px;
    background: transparent linear-gradient(90deg, #03aff0 0%, #9438cc 100%) 0% 0% no-repeat padding-box;
    /*overflow: hidden;*/
}

    ul.tablebar .inputSty .btns button {
        display: inline-block;
        position: static;
        transform: none;
        vertical-align: middle;
        background-color: transparent;
        color: #fff;
        -webkit-transition: 0.3s ease;
        transition: 0.3s ease;
        font-weight: 600;
    }

        ul.tablebar .inputSty .btns button:hover {
            -webkit-box-shadow: 0px 3px 10px rgb(0, 0, 0, 0.22);
            box-shadow: 0px 3px 10px rgb(0, 0, 0, 0.22);
            color: #fff;
        }

    ul.tablebar .inputSty .btns .change {
        display: inline-block;
        background-color: transparent;
        color: #fff;
        border-left: 1px solid #fff;
        padding: 10px;
        vertical-align: middle;
        height: 39px;
        -webkit-transition: 0.3s ease;
        transition: 0.3s ease;
    }

        ul.tablebar .inputSty .btns .change:hover {
            -webkit-box-shadow: 0px 3px 10px rgb(0, 0, 0, 0.22);
            box-shadow: 0px 3px 10px rgb(0, 0, 0, 0.22);
            color: #fff;
        }

        ul.tablebar .inputSty .btns .change i {
            font-size: 14px;
            transform: translate(0px, 2px);
        }

ul.tablebar .en_link {
    margin-bottom: 5px;
    display: flex;
    justify-content: flex-end;
}

/*出生年月日*/
ul.tablebar .select_item {
    display: inline-block;
    vertical-align: top;
    position: relative;
    margin-bottom: 5px;
    overflow: hidden;
    border: 1px solid #d7d7d7;
    border-radius: 5px;
}

    ul.tablebar .select_item.year {
        width: 58%;
        margin-right: 1%;
    }

        ul.tablebar .select_item.year select {
            padding-left: 40px;
        }

    ul.tablebar .select_item.month {
        width: 20%;
        margin-right: 1%;
    }

    ul.tablebar .select_item.day {
        width: 20%;
    }

    ul.tablebar .select_item select:focus {
        border-color: #a8dce2;
        box-shadow: 0 2px 0 0 #a8dce2;
    }

    ul.tablebar .select_item select {
        width: 100%;
        height: 38px;
        border: none;
        padding: 0 8px;
        font: normal normal normal 14px/1 FontAwesome, 微軟正黑體;
        color: #888;
        outline: none;
        transition: 0.3s;
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        z-index: 2;
        position: relative;
        background-color: transparent;
    }

        ul.tablebar .select_item select::-ms-expand {
            display: none;
        }

        ul.tablebar .select_item select:focus + span {
            background: linear-gradient( -45deg, #03aff0 0%, #9438cc 100%) 0% 0% no-repeat padding-box;
            background: -webkit-linear-gradient(-45deg, #03aff0 0%, #9438cc 100%) 0% 0% no-repeat padding-box;
            background-clip: text;
            -webkit-background-clip: text;
            color: transparent;
        }

    ul.tablebar .select_item:after {
        position: absolute;
        top: 23%;
        right: .5em;
        font-family: "FontAwesome";
        content: "\f078";
        font-size: 18px;
        color: #999;
        /*z-index: 1;*/
    }

    ul.tablebar .select_item option {
        padding: 5px;
    }

    ul.tablebar .select_item span {
        color: #777;
        position: absolute;
        top: 55%;
        width: 40px;
        text-align: center;
        transform: translateY(-50%);
        transition: 0.3s;
    }

        ul.tablebar .select_item span.EnterCodeText {
            color: #6C757D;
            text-indent: 42px;
            font-weight: 800;
            left: 0;
            top: 20px;
        }

        ul.tablebar .select_item span.inputicon {
            left: 0;
        }

        ul.tablebar .select_item span i {
            font-size: 20px;
        }

            ul.tablebar .select_item span i.fa-mobile {
                font-size: 32px;
            }

    ul.tablebar .select_item.error {
        border-color: #FF6B81;
    }


/*輸入&錯誤提示框*/
.logincontent .tooltiptext {
    position: relative;
    top: -40px;
}

    .logincontent .tooltiptext span {
        width: 330px;
        height: 40px;
        font-size: 13px;
        line-height: 15px;
        color: #000;
        border-radius: 6px;
        padding: 3px 5px;
        position: absolute;
        z-index: 1;
        left: auto;
        right: -110%;
        top: 15px;
        transform: translate(0, -50%);
        margin: auto;
        /*border: 1px solid #CBCBCB;*/
        -webkit-box-shadow: 0 2px 5px rgb(0, 0, 0, 0.16);
        box-shadow: 0 2px 5px rgb(0, 0, 0, 0.16);
    }

        .logincontent .tooltiptext span p {
            display: inline-block;
            vertical-align: middle;
        }

        /*輸入中提示*/
        .logincontent .tooltiptext span.hintMsg {
            background: #F2F2F2;
            display: none;
        }

        /*錯誤提示*/
        .logincontent .tooltiptext span.errorMsg {
            background: #F2F2F2;
            color: #D60505;
            display: none;
        }

        .logincontent .tooltiptext span.show {
            display: block;
        }

        .logincontent .tooltiptext span.hintMsg:before,
        .logincontent .tooltiptext span.hintMsg:after,
        .logincontent .tooltiptext span.errorMsg:before,
        .logincontent .tooltiptext span.errorMsg:after {
            content: "";
            position: absolute;
            border: 9px solid;
            top: 50%;
            transform: translate(0, -50%);
        }

        .logincontent .tooltiptext span.hintMsg:before,
        .logincontent .tooltiptext span.errorMsg:before {
            content: none;
            border-color: transparent #CBCBCB transparent transparent;
            right: auto;
            left: -18px;
        }

        .logincontent .tooltiptext span.hintMsg:after,
        .logincontent .tooltiptext span.errorMsg:after {
            border-color: transparent #F2F2F2 transparent transparent;
            right: auto;
            left: -16px
        }

.logincontent a.btn {
    display: block;
    border-radius: 50px;
    text-align: center;
    padding: 10px;
    margin: 10px 0;
    letter-spacing: 2;
}

.logincontent a.btncram {
    font-size: 15px;
    font-weight: bold;
    color: #fff;
    background: transparent linear-gradient(90deg, #03aff0 0%, #9438cc 100%) 0% 0% no-repeat padding-box;
    -webkit-transition: 0.3s ease;
    transition: 0.3s ease;
    padding: 0.625rem 1.125rem;
    width: auto;
    margin: 1.5rem auto 1rem;
    max-width: 12rem;
}

    .logincontent a.btncram:hover {
        -webkit-box-shadow: 0px 3px 10px rgb(0, 0, 0, 0.22);
        box-shadow: 0px 3px 10px rgb(0, 0, 0, 0.22);
        color: #fff;
    }

.logincontent .waybox a.fb-login {
    background-color: #3b5999;
    border: #3b5999 solid 1px;
    font-size: 14px;
    color: #fff;
    font-weight: normal;
}

    .logincontent .waybox a.fb-login i {
        color: #3b5999;
    }

.logincontent .waybox a.gg-login {
    background-color: #ea4335;
    border: #ea4335 solid 1px;
    font-size: 14px;
    color: #fff;
    font-weight: normal;
}

.logincontent .waybox a.btnborder {
    width: 32%;
    height: 45px;
    max-width: 260px;
    padding: 9px 5px;
    margin: 5px 0.625%;
    display: inline-block;
    background-color: #fff;
    border: #cbcbcb solid 1px;
    font-size: 16px;
    color: #505050;
    font-weight: normal;
    -webkit-transition: 0.3s ease;
    transition: 0.3s ease;
}

.logincontent .waybox a:hover.btnborder {
    color: #000;
    background-color: #f8f8f8;
    -webkit-box-shadow: 0px 2px 5px rgb(0, 0, 0, 0.1);
    box-shadow: 0px 2px 5px rgb(0, 0, 0, 0.1);
}

@media screen and (max-width: 497px) {
    .logincontent .waybox a.btnborder {
        display: block;
        width: auto;
        margin: 8px auto;
        max-width: 280px;
    }
}

/*.logincontent .waybox a.fb-login.btnborder{background-color: #fff; border:#3b5999 solid 1px; font-size:14px; color:#3b5999; font-weight: normal;}
.logincontent .waybox a.gg-login.btnborder{background-color: #fff; border:#ea4335 solid 1px; font-size:14px; color:#ea4335; font-weight: normal;}*/
.logincontent .waybox a.btnborder img {
    width: 20px;
    vertical-align: middle;
    margin-right: 0.25rem;
}

.logincontent .waybox a.btnborder i {
    margin-right: 0.25rem;
    border-radius: 50px;
    background-color: #fff;
    color: #ea4335;
    padding: 4px 5px 5px 5px;
    font-size: 13px;
    width: 20px;
    height: 20px;
}

.logincontent .waybox a.btnborder > span {
    /*width: calc(100% - 25px);*/
    text-align: left;
    width: 4rem;
}

.logincontent .waybox a.fb-login.btnborder i {
    background-color: #3b5999;
    color: #fff;
}

.logincontent .waybox .btn i,
.logincontent .waybox .btn span {
    vertical-align: middle;
}

/*.logincontent .waybox a.gg-login.btnborder i {background-color: #ea4335; color: #fff; background-image: url(../images/gg-logo-bg.svg); padding: 3px 4px 4px 4px; font-size: 15px; width: 21px; height: 21px; text-shadow: 0 0 1px rgba(0,0,0,0.5);}*/


.logincontent .linkway {
    text-align: center;
    font-size: 14px;
    color: #CBCBCB;
}

    .logincontent .linkway a {
        font-family: "微軟正黑體", Arial, sans-serif !important;
        color: #04AFF0;
        /*padding: 0 10px;*/
        text-decoration: underline;
        -webkit-transition: 0.3s ease;
        transition: 0.3s ease;
        padding: 8px 10px;
        display: inline-block;
    }

        .logincontent .linkway a:hover,
        .NewLoginMain .Loginitem .errorBox a:hover {
            color: #0988CB;
        }

.logincontent .waybox {
    text-align: center;
    margin: 30px 0 10px;
    position: relative;
    font-size: 0;
}

.logincontent .fakeline {
    height: 1px;
    width: 100%;
    background-color: #CBCBCB;
    position: absolute;
    top: 10px;
}

.logincontent .waybox .waytext {
    position: relative;
    margin: auto;
    width: 100%;
    height: 1px;
    display: block;
    margin-bottom: 30px;
}

    .logincontent .waybox .waytext span {
        font-size: 14px;
        background: #fff;
        color: #505050;
        padding: 0 10px;
    }

.logincontent .promptmessage,
.logincontent .errorexplain,
.logincontent .redText,
.logincontent .field-validation-error {
    text-align: center;
    color: #D60505;
    font-size: 14px;
}

.logincontent .tipsText {
    text-align: center;
    color: #505050;
    font-size: 14px;
    margin-top: 10px;
}

.logincontent .blueText {
    text-align: center;
    color: #000;
    font-size: 14px;
}

.logincontent .promptmessageblue {
    color: #4c5d79;
    font-size: 15px;
    text-align: center;
    margin: 20px 0 10px;
}

.logincontent .promptmessage,
.logincontent .redText,
.logincontent .normalText,
.logincontent .blueText {
    margin-bottom: 5px;
}

.NewLoginMain .Loginitem .errorBox {
    position: absolute;
    top: 0;
    left: 442px;
    width: 490px;
    min-height: 522px;
    background: #fff;
    border-radius: 8px;
    border-left: #f1f1f1 solid 1px;
    padding: 60px;
    -webkit-box-shadow: 0px 2px 15px rgb(100, 100, 100, 0.12);
    box-shadow: 0px 2px 15px rgb(100, 100, 100, 0.12);
    text-align: left;
}

    .NewLoginMain .Loginitem .errorBox dt,
    .NewLoginMain .Loginitem .errorBox_M dt {
        font-size: 16px;
        font-weight: bold;
        color: #000;
        margin: 20px 0 5px;
    }

        /*.NewLoginMain .Loginitem .errorBox dt::before,
.NewLoginMain .Loginitem .errorBox_M dt::before {
    content: "\f005";
    color: #FF7F50;
    padding-right: 8px;
    font: normal normal normal 15px/1 FontAwesome;
}*/
        .NewLoginMain .Loginitem .errorBox dt span,
        .NewLoginMain .Loginitem .errorBox_M dt span {
            display: inline-block;
            margin: 0;
            padding-left: 7px;
            vertical-align: middle;
        }

        .NewLoginMain .Loginitem .errorBox dt img,
        .NewLoginMain .Loginitem .errorBox_M dt img {
            width: 25px;
            display: inline-block;
            vertical-align: middle;
        }

    .NewLoginMain .Loginitem .errorBox dd,
    .NewLoginMain .Loginitem .errorBox_M dd {
        font-size: 15px;
        color: #505050;
        line-height: initial;
        display: block;
        padding-left: 2rem;
    }

    .NewLoginMain .Loginitem .errorBox a,
    .NewLoginMain .Loginitem .errorBox_M a {
        color: #04AFF0;
        text-decoration: underline;
        -webkit-transition: 0.3s ease;
        transition: 0.3s ease;
    }

        .NewLoginMain .Loginitem .errorBox a:hover,
        .NewLoginMain .Loginitem .errorBox_M a:hover {
            color: #0988CB;
        }

.NewLoginMain .Loginitem .errorBox_M {
    text-align: left;
    padding: 0.05rem 1rem 1rem;
    border-radius: 6px;
    background-color: #f8f8f8;
    border: none;
    margin-top: 10px;
}

/*得知其他資訊*/
.logincontent .inforroute {
    font-size: 13px;
    max-width: 370px;
    background: #f4fcfd;
    padding: 10px 8px;
}

    .logincontent .inforroute h4 {
        color: #4c5d79;
        text-align: center;
        padding-bottom: 2px;
        font-weight: bold;
    }

        .logincontent .inforroute h4.mt5 {
            margin-top: 5px;
        }

    .logincontent .inforroute span {
        position: relative;
    }

    .logincontent .inforroute .chooseItem {
        display: inline-block;
        margin: 2px 2px 2px 0;
        line-height: 24px;
        border-radius: 3px;
        border: 1px solid #d7d7d7;
        text-align: center;
        background: #FFF;
        cursor: pointer;
    }

        .logincontent .inforroute .chooseItem a {
            color: #313131;
        }

        .logincontent .inforroute .chooseItem.active {
            background: #88a3be;
            color: #FFF;
            border: 1px solid #88a3be;
        }

        .logincontent .inforroute .chooseItem input[type="checkbox"] {
            display: none;
        }

            .logincontent .inforroute .chooseItem input[type="checkbox"] + label {
                display: inline-block;
                cursor: pointer;
                line-height: 24px;
                padding: 0 14px;
                border-radius: 3px;
            }

    .logincontent .inforroute input[type="text"] {
        border: 1px solid #d7d7d7;
        font-size: 13px;
        height: 25px;
        line-height: 25px;
        border-radius: 3px;
        padding: 0 3px;
    }

    .logincontent .inforroute .chooseItem input[type="checkbox"]:checked + label {
        background: #88a3be;
        color: #FFF;
    }

.logincontent .iagreebox {
    font-size: 13px;
    max-width: 370px;
    margin: 15px 0;
    display: flex;
}

    .logincontent .iagreebox a {
        color: #4983DB;
    }

    .logincontent .iagreebox [type="checkbox"]:not(:checked),
    .logincontent .iagreebox [type="checkbox"]:checked {
        position: absolute;
        left: -9999px;
    }

        .logincontent .iagreebox [type="checkbox"]:not(:checked) + label,
        .logincontent .iagreebox [type="checkbox"]:checked + label {
            position: relative;
            padding-left: 30px;
            cursor: pointer;
        }

            .logincontent .iagreebox [type="checkbox"]:not(:checked) + label:before,
            .logincontent .iagreebox [type="checkbox"]:checked + label:before {
                content: '';
                position: absolute;
                left: 0;
                top: 2px;
                width: 20px;
                height: 20px;
                border: 2px solid #d7d7d7;
                background: #f8f8f8;
                border-radius: 2px;
            }

            .logincontent .iagreebox [type="checkbox"]:not(:checked) + label:after,
            .logincontent .iagreebox [type="checkbox"]:checked + label:after {
                content: '✔';
                position: absolute;
                top: -4px;
                left: 2px;
                font-size: 24px;
                color: #4983DB;
                transition: all .2s;
            }

            .logincontent .iagreebox [type="checkbox"]:not(:checked) + label:after {
                opacity: 0;
                transform: scale(0);
            }

            .logincontent .iagreebox [type="checkbox"]:checked + label:after {
                opacity: 1;
                transform: scale(1);
            }

    .logincontent .iagreebox p {
        line-height: 14px;
    }

.NewLoginMain .Loginitem .loginbottom {
    clear: both;
    background: #f1f1f1;
    color: #000;
    font-size: 12px;
    line-height: 1.3;
    padding: 15px 5px;
    text-align: center;
    border-radius: 6px;
    background-color: #f8f8f8;
    font-family: "微軟正黑體", Arial, sans-serif !important; /*自動找手機裡的黑體字*/
    -webkit-text-size-adjust: none; /*修正iphone旋轉後文字不要放大*/
}


/*右欄廣告與求職者感言*/
.NewLoginMain .Otheritem {
    max-width: 425px;
    display: inline-block;
    vertical-align: top;
    margin: 0 25px;
}

    .NewLoginMain .Otheritem .bannerExposure {
        margin-bottom: 20px;
    }

.NewLoginMain .Otheritemstep {
    width: 450px;
}

.Otheritemstep .stepshare ul li {
    margin: 30px 20px;
}

.Otheritemstep .stepshare img {
    margin: 20px auto 40px;
    text-align: center;
    display: block;
}

.Otheritemstep .stepshare .sharelist {
    width: 400px;
    height: 72px;
    border-radius: 5px;
    padding: 10px 12px;
    position: relative;
    border: 1px solid #174384;
}

    .Otheritemstep .stepshare .sharelist.leftbor::after {
        border-color: transparent #708fc9 transparent transparent;
        right: 100%;
    }

    .Otheritemstep .stepshare .sharelist.rightbor::after {
        border-color: transparent transparent transparent #708fc9;
        left: 100%;
    }

.Otheritemstep .stepshare .leftbor {
}

.Otheritemstep .stepshare .rightbor {
}

.Otheritemstep .stepshare .peoimg {
    position: absolute;
}

    .Otheritemstep .stepshare .peoimg i {
        font-size: 40px;
        color: #174384;
        margin-top: 5px;
    }

    .Otheritemstep .stepshare .peoimg.peo1 {
        background-position: 0 0;
    }

    .Otheritemstep .stepshare .peoimg.peo2 {
        background-position: 0 -80px;
        right: 10px;
    }

    .Otheritemstep .stepshare .peoimg.peo3 {
        background-position: 0 -160px;
    }

    .Otheritemstep .stepshare .peoimg.peo4 {
        background-position: 0 -240px;
        right: 10px;
    }

.Otheritemstep .stepshare .sharelist p {
    color: #fff;
    font-size: 15px;
    height: 35px;
    font-weight: bold;
    line-height: 1;
    margin: auto;
}

.Otheritemstep .stepshare .leftbor p,
.Otheritemstep .stepshare .leftbor .peoname {
    padding-left: 60px;
}

.Otheritemstep .stepshare .rightbor p,
.Otheritemstep .stepshare .leftbor .peoname {
    padding-right: 60px;
}

.Otheritemstep .stepshare .sharelist .peoname {
    font-size: 12px;
    color: #ddd;
}

    .Otheritemstep .stepshare .sharelist .peoname span {
        display: inline-block;
    }

        .Otheritemstep .stepshare .sharelist .peoname span:last-chlid {
            padding-left: 5px;
        }


/*新版註冊停權頁*/
.NewLoginMain .loginError {
    width: 600px;
    font-size: 14px;
}

    .NewLoginMain .loginError .logincontent {
        padding: 30px 95px 10px;
        color: #6c757d;
    }

.loginError .logincontent .greeting {
    margin-top: 40px;
    margin-bottom: 20px;
    font-size: 18px;
    font-weight: 800;
}

.loginError .logincontent > p {
    margin-bottom: 10px;
}

.loginError .logincontent .red {
    color: #FF6B81;
}

.loginError .logincontent .mainMsg {
    color: #17A2B8;
    text-align: center;
    margin: 30px auto 40px;
}

    .loginError .logincontent .mainMsg b {
        font-size: 16px;
    }

    .loginError .logincontent .mainMsg .mmsgBox {
        margin: 15px auto;
        padding: 20px;
        background-color: #f1f5f9;
        border-radius: 5px;
    }

        .loginError .logincontent .mainMsg .mmsgBox .decorationBar {
            width: 60px;
            height: 5px;
            background-color: #17A2B8;
            margin: auto;
            margin-top: -22px;
            margin-bottom: 15px;
        }

        .loginError .logincontent .mainMsg .mmsgBox .btnBox {
            max-width: 180px;
            margin: 20px auto 0px;
        }

        .loginError .logincontent .mainMsg .mmsgBox .btnAcc {
            font-size: 16px;
            color: #fff;
            background: #4983DB;
            box-shadow: 0 4px 0 0 #2d60ad;
        }

/*忘記密碼-取得臨時密碼後重新登入*/
ul.tablebar .twoItem-box {
    font-size: 0;
}

    ul.tablebar .twoItem-box .inputSty {
        display: inline-block;
        width: 50%;
    }

        ul.tablebar .twoItem-box .inputSty div.verification {
            width: 100%;
            padding: 0 2%;
        }

            ul.tablebar .twoItem-box .inputSty div.verification img {
                margin: auto;
                width: 100%;
                max-width: 150px;
            }

.forgetemail {
    margin-top: 10px;
    text-align: center;
    color: #6f6f6f;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(183, 222, 232);
    border-image: initial;
    background: rgb(244, 252, 253);
    padding: 10px 5px;
}

    .forgetemail h5 {
        font-size: 15px;
        color: #525252;
        padding-bottom: 5px;
    }

    .forgetemail p {
        font-size: 13px;
    }

    .forgetemail a {
        color: #4983DB;
    }

    .forgetemail span {
        color: #525252;
        font-weight: bold;
    }

/*樣式2設定*/
body.type2 {
    background-image: none;
    background-color: #fff;
}

    body.type2 .NewLoginMain .breadcrumb,
    body.type2 .NewLoginMain .breadcrumb a {
        color: #6C757D;
    }

    body.type2 .NewLoginMain .Loginitem {
        box-shadow: 0 0 25px 0px rgba(204, 204, 204, 0.60);
    }

    body.type2 ul.tablebar .inputSty input {
        border: 1px solid #d7d7d7;
    }

    body.type2 ul.tablebar .sexmaxclick select {
        border: 1px solid #d7d7d7;
    }

    body.type2 .NewLoginMain .Loginitem .loginbottom {
        background: #fff;
    }


/* MOBILE
-----------------------------------------------------------------------------------------------------------------------------*/
/*覆蓋header.css*/
#NewLoginBox .btn {
    letter-spacing: normal;
    text-shadow: none;
    text-align: center;
    /*font-size: 18px;
    cursor: pointer;
    padding: 10px 20px;
    margin: 5px;
    color: #fff;
    border: 0px solid;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;*/
}

/*登入 英文*/
._en .input-validation-error {
    border: 1px #dc3545 solid;
}

._en .logincontent.type01 .waybox a.btnborder {
    margin: 5px 0.825%;
    width: 43%;
}

._en .logincontent.type01 .waybox .waytext {
    margin-bottom: 50px;
}

._en .Loginitem .logincontent.type01 .title_content h2 {
    font-size: 16px;
}

._en .logincontent ul.tablebar .inputSty input {
    font-size: 15px;
}

._en .NewLoginMain .Loginitem.loginInLeft .errorBox dt span, .NewLoginMain .Loginitem.loginInLeft .errorBox_M dt span {
    font-size: 14px;
}

@media screen and (max-width: 990px) {
    .NewLoginMain .Otheritemstep {
        display: none;
    }

    .NewLoginMain .Otheritem {
        display: none;
    }

    .NewLoginMain .Loginitem .errorBox {
        display: none;
    }

    .NewLoginMain .Loginitem.loginInLeft {
        margin: auto;
        display: block;
    }

    .NewLoginMain .Loginitem .logincontent .mobileAd {
        display: block;
    }
}

@media screen and (min-width: 990px) {
    .NewLoginMain .Loginitem .errorBox_M {
        display: none;
    }
}

@media screen and (max-width: 767px) {

    html,
    body {
        height: 100%;
        margin: 0;
    }

    .bg-icon {
        background-image: none;
    }

    .logincontent ul.tablebar li {
        margin-bottom: 0.5rem;
    }

    #NewLoginBox {
        min-height: calc(100% - 97px);
        background-image: none;
        background-color: #fff;
    }

    .NewLoginMain .breadcrumb {
        display: none;
    }

    .NewLoginMain .Otheritem,
    .NewLoginMain .Otheritemstep {
        display: none;
    }

    .NewLoginMain {
        padding: 20px 10px;
    }

        .NewLoginMain .Loginitem {
            box-shadow: none;
            margin: auto;
        }

            .NewLoginMain .Loginitem .logincontent .title_content img {
                display: none;
            }

    .Loginitem .logincontent .title_content h2 {
        font-size: 32px;
    }

    .Loginitem .logincontent .language_switch {
        top: 15px;
    }

    .NewLoginMain .Loginitem .logincontent {
        padding: 0.5rem 0 1rem;
    }

        .NewLoginMain .Loginitem .logincontent.stepmobile {
        }

    .NewLoginMain .Loginitem .errorBox dt,
    .NewLoginMain .Loginitem .errorBox_M dt {
        margin-top: 15px;
    }

    .logincontent .tooltiptext {
        top: 0;
        /*margin-top: 0.25rem;*/
    }

        .logincontent .tooltiptext span {
            width: 100%;
            height: auto;
            display: block;
            position: static;
            padding: 5px 10px;
            box-shadow: none;
            transform: none;
        }

            .logincontent .tooltiptext span.hintMsg {
                background: #F2F2F2;
                border: 3px solid #F2F2F2;
                margin-top: 0.3rem
            }

                .logincontent .tooltiptext span.hintMsg::after,
                .logincontent .tooltiptext span.errorMsg::after {
                    border: none;
                }

            .logincontent .tooltiptext span.errorMsg.pair02 {
                float: left;
                margin-top: 0.3rem;
            }

                .logincontent .tooltiptext span.errorMsg.pair02 p {
                    position: static;
                    top: auto;
                }

            .logincontent .tooltiptext span p {
                vertical-align: middle;
            }

    ul.tablebar .inputSty button {
        font-size: 13px;
    }
}

@media screen and (max-width: 497px) {
    .NewLoginMain .Loginitem {
        width: auto;
        max-width: 440px;
        padding: 1.5rem 1rem;
    }

        .NewLoginMain .Loginitem .errorBox_M dd {
            margin: 2px 0 0 0px;
        }

    /*.logincontent .waybox .btn span {
        display: none;
    }

    .logincontent .waybox a.gg-login.btnborder img {
        margin-right: 0;
        width: 1.5rem;
    }

    .logincontent .waybox a i {
        margin-right: 0;
    }

    .logincontent .waybox a.btnborder {
        width: 32%;
        height: auto;
        padding: 7px;
        height: 40px;
    }

    .logincontent .waybox a.btnborder i {
        width: 24px;
        height: 24px;
        font-size: 17px;
    }*/
}

@media screen and (max-width: 320px) {
    ul.tablebar .inputSty button#sendValid {
        position: static;
        width: 100%;
        transform: translateY(0);
        margin-top: 5px;
    }

    ul.tablebar .inputSty span.mobile {
        top: 25%;
    }
}

ul.tablebar .select_item option:disabled {
    background-color: #ccc;
    font-weight: bold;
}

ul.tablebar .select_item.year.simple select {
    font-size: 1rem;
    margin-left: -2px;
}

.wordColor {
    background: linear-gradient(0deg, #03aff0 0%, #9438cc 100%) 0% 0% no-repeat padding-box;
    background: -webkit-linear-gradient(0deg, #03aff0 0%, #9438cc 100%) 0% 0% no-repeat padding-box;
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    text-align: center;
    font-weight: bold;
}

.fa {
    font-family: FontAwesome, "微軟正黑體", Arial, sans-serif !important;
}


/* 推薦 TAG */
.form-group-area {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    max-width: 100%;
    padding-bottom: 11px;
    padding-top: 5px;
}

    .form-group-area .form-control-group {
        width: 100%;
        max-width: 100%;
        padding: 0;
        /* margin-top: 4px; */
    }

        .form-group-area .form-control-group.btnGroup {
            display: flex;
            justify-content: flex-start;
            align-items: center;
            flex-direction: row;
            flex-wrap: nowrap;
            gap: 6px;
        }

@media (max-width: 768px) {
    .form-group-area .form-control-group.btnGroup {
        gap: 8px;
    }
}

.form-group-area .form-control-group.btnGroup.btnGroupRecommend {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 8px;
    width: 100%;
    max-width: 100%;
    /* margin-top: 8px; */
}

    .form-group-area .form-control-group.btnGroup.btnGroupRecommend .input-btn span {
        width: fit-content;
        max-width: 100%;
        padding: 7px 13px;
        font-size: 14px;
        font-weight: 400;
        line-height: 1.7;
        color: #00B2B2;
        border: 1px solid #2BD9D9;
        background-color: #fff;
        border-radius: 8px;
    }

        .form-group-area .form-control-group.btnGroup.btnGroupRecommend .input-btn span:hover {
            background-color: #C7F2EF;
        }

        .form-group-area .form-control-group.btnGroup.btnGroupRecommend .input-btn span:focus {
            background-color: #C7F2EF;
            box-shadow: 0 0 0 4px rgba(43, 217, 217, 0.12);
        }

        .form-group-area .form-control-group.btnGroup.btnGroupRecommend .input-btn span:active {
            color: #03A1A1;
            background-color: #C7F2EF;
            box-shadow: none;
        }

        .form-group-area .form-control-group.btnGroup.btnGroupRecommend .input-btn span.disabled,
        .form-group-area .form-control-group.btnGroup.btnGroupRecommend .input-btn span:disabled {
            opacity: .5;
            pointer-events: none;
        }

    .form-group-area .form-control-group.btnGroup.btnGroupRecommend .input-btn input.disabled,
    .form-group-area .form-control-group.btnGroup.btnGroupRecommend .input-btn input:disabled span {
        opacity: .5;
        pointer-events: none;
    }

    .form-group-area .form-control-group.btnGroup.btnGroupRecommend .input-btn input:checked ~ span {
        color: #03A1A1;
        background-color: #C7F2EF;
        border: 1px solid #2BD9D9;
        box-shadow: none;
    }

.form-group-area .form-control-group input {
    width: 100%;
    max-width: 100%;
    margin: 0;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.7;
    color: #212529;
    border: 1px solid #CED4DA;
    background-color: #fff;
}

@media (max-width: 768px) {
    .form-group-area .form-control-group input {
        font-size: 15px;
    }
}

.form-group-area .form-control-group input::placeholder {
    color: #ADB5BD;
}

.form-group-area .form-control-group input:disabled,
.form-group-area .form-control-group input.disabled {
    color: #939DA7;
    border: 1px solid #E9ECEF;
    background-color: #F8F9FA;
    pointer-events: none;
}

.form-group-area .form-control-group input {
    padding: 7px 12px;
}

.form-group-area .form-control-group .input-btn {
    box-sizing: border-box;
    margin-bottom: 0;
}

    .form-group-area .form-control-group .input-btn input[type="radio"],
    .form-group-area .form-control-group .input-btn input[type="checkbox"] {
        display: none;
    }

        .form-group-area .form-control-group .input-btn input[type="radio"].disabled ~ span,
        .form-group-area .form-control-group .input-btn input[type="checkbox"].disabled ~ span,
        .form-group-area .form-control-group .input-btn input[type="radio"]:disabled ~ span,
        .form-group-area .form-control-group .input-btn input[type="checkbox"]:disabled ~ span {
            color: #939DA7;
            border: 1px solid #E9ECEF;
            background-color: #F8F9FA;
            pointer-events: none;
            cursor: auto;
        }

    .form-group-area .form-control-group .input-btn span {
        display: block;
        padding: 8px 8px;
        font-size: 15px;
        font-weight: 400;
        line-height: 1.7;
        word-break: keep-all;
        color: #212529;
        border: 1px solid #CED4DA;
        background-color: #fff;
        border-radius: 8px;
        cursor: pointer;
    }

@media (max-width: 768px) {
    .form-group-area .form-control-group .input-btn span {
        padding: 8px 14px;
    }
}