@import "base.css";

.login-body {
    position: relative;
    background: #fff;
    min-width: 1250px;
    min-height: 676px;
}

.login-bg {
    background: #0e9cce;
    height: 100%;
}

.index-pro {
    width: 8.39%;
    position: absolute;
    left: 29.27%;
    top: 14.72%;
}

.img-pro {
    padding-top: 27.95%;
    background-size: 100%;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAYwAAABACAYAAAAJZEAxAAAUgElEQVR4Xu1dTehdRxU/p2KbdmP/iAtdWKsLQQTThSAimiwUNELbhUIRbILQnbTBhYKCycKPnS24KRWbgoiC0AYbEF20RYobwQRxI6jtSheijYumVuiR8zL3n/vum5nzO3Pn3nffe/OgtPQ/dz7OnDm/OZ/DlPiJyN1E9CgRnSWi96Xa7en/v0pEzxHRE8z8Wuka37hC+u07rO+Z6NLtd9F5Pr1qn/yJyAUi+rbV34L/rutTul5k5lfmmqeIPEJETxLRU8ys/91+jQKNAgUU4Ng3ASxeIKKTBX3u0ycKHKdLQePG83SJmR4GCXL1xBm6zwCMF4noU2B/S26mwKF0VfpO/muAMTmJ2wAHQoEUYDwetIsDIUN2mc8ws2pZ7t+NK3SWiZ5GP2SmB+/43OoGHv2JyL4Ahq7vRWY+jdJmTLtdA4xwYVMNzNROiejeObU1ZB9ERHn4fqPtUclFTETU2vG3TN/nmVnlV/tNQIEUYPybiNQk1X43KVB0KOUFuvu/r5PSEv09ceIMPXYggKHLVC1DQXDS364BhhJDRC4RQdqpmvfUVLmYH2g6Ldp7EdHLW+4SVnRWF0O8hU9kAzBERM1Qf1j4vOeeXhFz6yTfeJ6uEtNHwAm/cuIM3XtAgDHLbXBHAcO6SXdsouY9FZLFvjaQN+FmInKKiNSknfsVAZ2hvVxj5kM3o8P7VNIwBhjIZg/Heqlk8N43usmI+t19co0o7yA25uMdrxgwblyhC+xwVN9GdN/tZyhq2xeRfTMVFgkNL6/tImAELQMx7WjTc8ysGskifsGkZmnWl5n5Ac+EgX5n4SfPnPetbRXAYOaoaQslVoFtvliAh4Po9QUUj/fmFTr5lkdjEzp/4vOUtMEGGy4atabA+AN0H4hIgThpEgP6sW6Vwy5mOeBTAoaICECXXW/i3icRUR/MPZmFv8LMSW069h1gjlLenSqQ4vpcQRpLZpYGGNjuFAOGdo+G14apmNFS2JRXdnCvtvgSM+s3Rb8C4ekWRCUTa4BRQrW1b9z7NIXjG+xz9GITHYw6G1NNau5+G2BgFB8FGM7wWrrjLjqycjKQaTfAuEmlBhgIt2TbbABGMA/lfHPqnLaiCy2N4PhWD5ijRi/S6KABBhE1wMDYbBxg/JJO8W2mE/B4JkJ07s4zNNom3QBjFsBYVIQSxs7uVhoCvRbNVsBb7kGJ6FhIA+aokv493zTAaIAB88sowNBRNCeDaOUAz9l1uwldPnGGXA7B2EoKDvWoQ3GIJimYg/asYQFvlVCgDxi5MONXAW2mZPz+N6/V9mHkQLCCX1j9l5o03EWNdaZmjabr/DwaVKHBB3DVhaZhYGw0GjCwYeq2KjjUDTDqbsHe9lbAWyW06ANGLjesOLm2ZFI1vrE0plLAEBEtHeQt56SAcYGZn7HW1gDDotDNvzfAAOjUNAyASHvSJETrxXwUuVpnGn7vSdTUSKpLIqLa9rMZ0j3IzMkKCUsjuQUWOl8vYAQA14RGNIIyRhbdG82NSkaaNcDAuKkBBkCnBhhxIoHJsFVvyaAGMPeYRfkiRta7OsZ3pipF4AUNP8/O2QMYCAABx7drkq3zVgUwHJPZ1aYNMICda4CRJhKYa1StrIWIqFCyQqSrjacrB0Cq6ByJSM4cpbfhLnfInSshIrlinq967PvWEUHBwqNhVAYLEzQaYFi7XGiSCio74uBOzUDLHIwq9wAc4OHYzYeB8YO7FbgXVW78c47VJwQwrhswAHNUfwpu/jUuOe78kxRjeMACBQwnbbw8G9U0GmBgZHQxOlBRExnVNWasQ+AAN8BAdqJSm7m0jG1oF0HD0Jt+rrLAfd5Io0hlA62CkMr/WCRgeMECAYyQl6JVez3mOI0m81xirzLz2pMLDTAwYeAS3gWCOjYL15gNMLLmoEU8oATyxSgtY44xMrfo7ANfHrt8ZoxcWZ/FAUYJWICAgVQzvk60KjN0qW9aCyCse4W81bPmd2qA0QBjlEo/MEl46ypVU/lz2zhlpjfGPrdaTa1lbEu7CBpGA4weQ5SChQUYoAVDtYkHchpduFxodFmu8KuG3KpmuDKPN8DATrzrtg/e8qyRXWM2DWP5GkYQqkh9ryItA+S7or4tZg1ry1bXLdUwBv5AvTGnSpj3HeDIlLVNLsxXb/GrigvM7KrIPQYsAMCwqlarZnEScdiDPHOsZdQCjIvo7iTaaTy3x7amCSZwdmJkTO94LuENboJFMteYDTCWAxhBwKktX2Pid+F9hi77V9+wL85nMLQnt7mo21HwQSbrPI36uxfsjMgucy658YC+XXkpAH2PX8esAhheYg6pBarp/c9GCdOpxwsOKb2ZWM9U5hhn1Bodt9n+HIoPdRjv4E1SASz0ATKPM9IUIDM2KDYTNsC4tUsFIeZrW5ySqUBklIYCu5L3wCeBVyHYDTCwk1hDeHuFaXTMoOqij03p7dbzvrFHpd+IUS84JMXCCdu2m63m9GFsuQS3hyy5tkX5GSKiUTspYVV8GQFuwLXWnezHeykuOAsoYFjmqCmSI3Vuq34bYGCstgjAqGTqwlZst9JibEf9ZgWHZB8BI5dkpuRy2cLtbShqoUI9ZwIuFTreS9Fw8mpmfo6Zzw/4Sv0+XRJizpysjl5vlWeolIn33XTjLOg89Zfcg4yGkQNl7fOoJH8LqEaweiGxAQZ23pYCGNkoFGwp9VoNmboBxkqbyQlN9RGMedGwyuYBUTZFQF6w/6n1JB3ztc1eUyXuJfrtwlxVS1BfUTLLPAYYwJsgxVpc0MTVl5WyXqxeSGyAgR3BBhgROjXA2CTKVAIIY1O8Ve15AiCET+5my2iS3w4DxmUtYdJFLll+1ARgWBF2RUDfbQxgTj1qgIGxcQOMBhgQp9QWxNCgBY1qzxMwl+p78f1SN5ZZLBrps4OAoetWoBg+QJVLQIxWqwV8OaPklIhYmfqnG2Bgh23URgR1z2vf3RgT2FBsNZVaNQ2jroZh2JHXYuuD8EiZNNTenA122AJgrPEzADDR2/IOAYaCo74xEd2HQg3DcngX+S96GoalwZyvAhhKmJEyyPvghzq20DwMPTxr9d2tzYqsZSmAoaGayjRo2Jy2z727PFyqCqVkLfxB48eHMfsFNuxRKjTKczNHSeUuBtn1Glnaa98aJiAVVhrplCxeOQFgWG9WHBpg3G3Qv0TDcH+DnpFwqdWoSg0JT/0uxgDD+sgzh6W0XbOH7ipgeIkJ3OKGXY51mnm1qAYYYQeM+PpobL1hoshmdE8AGK6yIABvlmgY3iNitZ+MPy0ZlPBh5ABDq1uPThI1+OLyBmAEpMl5yy0iL/Hvw9tNFqmHC/DGYMcIUHD7rqHVWCpmA4zK3FoiiEP0i97sUppjKidHNUjVCFPhmUkeKplnjlSWfT1ivrR4swHGgOBGhveoy17PLJWT/S+lAGNR4ZsVzvQYwKgSCtkAI7qLk93g+qMt3SRlCNtV/HvqDBiayUZ56p5gKDadJS5EWft6A4x1qhVqGLk9qwUY+WrAGUZEyudWkOWzdFEKGBrhcKokEWa4qgYYDTCIaAMgjVIiUBE5Q/joG80bjtcJNAxX2fGJTFK1E/cmu9BMABhVikoa89osDTK4makzOvbQ+yxSvtIgqmKd7Qt9EclVvOyG1Rry3qzR5JQbYDTASADGs1qGOsE4kMAqcYDvKWC4b9m16YDKrAkAA+IVa37mvKwO2t/rUKABRgOMIWAYt2xXEblwCXo0wa0bt8/agtIb7jqRhtEAY6S4aoAxkoC1Pm+A0QAjAhjq6E5FtriCHoCKo0OzbG0fhqu/BhjiDpGtDfIJX1R+XrUEYusnT4EGGA0w+oBhJGFmHd0Zv6Oaj59O/H3NAV5b+Hj7a4DRAKNhRoYCDTAaYAwAQzWL/psZWjW1q8ha6yzpw2b9khQKGqtkPq+Atybk7a8BRgMMi6cO+u8NMBpgxJzeQXirVjBVcEmqJpPLhJQ7vIDw35gD8E3LwxgQ3QvKJQJ3qz6MYFeNlqaw3sgNDGVlDmt2Y7L8QcJGpzc76wGijceBSojf/6YBRgOMTFitvnEw1S+ai1FT+ADCP1YXrSXu+cubT1463wCMa9HEvbGcKyIPh/pSyZpHVva0iGgGK1IHSVVujTWHaiBZGam9tWutKn1IJvdIPEyqBhgNMBKAYQlOzQWy3tnWKqPJS1CizMScGkYDjE1tobbT2x0hlrhQ+xL3RORrRPQxInpXRhr+hJl/lBjQqqi4+gwADKifMIfV4x6I9AZuQ/1uVHvROlRoocPkFBpgNMAoBAwzWsq6BM0AGFZZ7I0qqsA5LDFJHXLiXi3AyL0Yeas0iIi8jYieIaIvAYI3lT1q3ZaOuwYAw6p+OZxm1FY7bAS8WjX8JLpWgEZrTRpgNMDYY8BwFR5UTpgIMNxCs6ZpziMTTF8Bc6wwrCub3jOfri1cfFBEzhHRj8FBHmLmn0WEMVxOxAKMwFSWD6M/Bbjmk8Pcpf27mTCheXnWol2YN0trr4BDOexi1FoLQLFKdipAh0eI6EkieoqZ9b8n+3kFELBHJh8sQMNogOHkqAkAw7TaWFME3vW+Vd5cRH5KRA9ZnYa/a32ljcfsLSL0+wYBw1NV1mOW8pi7XmPmI5AuyWYFwtQUFNacAGHUAMMiovPvBwoY6mO5P0GqaNltgDdLTFLuC493v5zskJMHJT6M7IUckam5+QN7cusBJRH5XfBdIDT5IDP/OaJhwAIeWVzBC3PRd4Aj8/Sau6B+jc1oGsYmgZqGIWKZcc2LwwI0DLepBBBODTAG58Xa57FWCUDe3nqiVUTUYfReBC00IoOZ/zMDYHgfc4L8DdvwYzQNI8pZDTAaYKRETgOMTcCwLrqQ/EsRXERymqJ+dnTsWBGRN4no7QBg/I+Zb4+1q22S0jFExPOYE6ySOv0YRaUa+jRqgNEAY4+d3ppHkgqhj/oWPRpGwdkBxJi7CSxbkJ4tWZmIbFMa53J2Rskp44GmVTHMFWCIyDuJ6J/IQonor8z8gRkBA3akhzlBD6Eb1T2HyxvtxyhgetMUYe0XcCiHXYw6FAVrVFNGl+eiFwOtqupKxLRoEPi7Ob03b6s18zDcfQG8eaxhFPAVwhbeNqPOhtcakzLZGxdo2I8bmY9lzVmBUQcYHyaiP4IUfJmZPzEjYOQKqsWmgYbXWurdsO97x+RjFDD9IQDGkMajVOqMqt0AowEGKN6SzZYCGJbZSJON3e/4iIh1MV/12wHGp4no1yBFf8HMX5gRMCw1bDgV6OUp49GZ2PKKNqLrqAEGxF2T+DSW/EQrcNM2Lw6WM3TKxD3AHxg9N8C6+xqGhu1u+6e3d7cgzlxi3FFSQVu2LtAvMvNpD7HCHqqpq18MM3ph7gDjyyFpDxnnh8z81bkAIxAJLROizWG1TEQ0g/seZNHBXFJcIK4BBkTlBhibZNIbpVX2RjOtk4d9YsAoivLyAAbEOTvWqMSHEWSh7rNmY+d+rsutdeHo56J1gPF1Ivo+SPNvMvN3ZwYMC1WH04HCYAE1rN8vDEQJ2hxCWK2l1losdoiA4dWgLRoO/x41pdTKPwAEf1RDAr6bhBe8xJuqfSlgBNCwzFLqB1S6WxcNJONehzwGoA4wPIlsX2HmaEa4RYQ+8ZE8jH77gILZImu99hCziYgXiIr9GFvSMPQ2olqUVZ23Ix2cLZ8ARR1PQSOVxGWdP9P8YnWQmNdifRhBAHjOn5cEKYHtdlQnaGv5AqNnZgxggBe9JC+B3xefdWSDLFmZk48A7XQKJmiEfvRN+ZwpStMtTnbBKB1g/JyIvogslIg+y8y/mlPDAOflbgbYX4d9ulS9AeDNrmF04wfGsOijGtToIotBACoDpp4eTc2j2vjDAZbsw+jtUba8hrV5kb/rQT+bqrZcUcNwlwUJPGKZslJ5GIhGlnVQg/5LyBdasC+rT8YABvJ9mJeChmojSsvjsx1KgOj774iJfU3mdYDxWyKKRj5FCJI091hE6Pfl1TBKN8b6zpmPUXwD34aGYa39UP6+C4DRAw4ViMlnAcA9O35ZL9V+hwEDMXua2sG2tQxLVlryMYCempxQ60GndeS0iSG7bJR16QDjL0T0fpAZ383M/9gHDSMgtcccEH2MBqFbAwyEStO02SXAmIYCm73OBBirZK+ErHBrGDU1g5p9lezZWMAIsstrUvdM9bo+GTz0g3SA8ToR3Qn09pZmgzOz/nvjZxFh8EHt94uB6a+arL3SJyKWDXbYL5QYOPyoAQa6PfXbNcCYFDDcdaSCsCsBjCraRU+bQ/qbyq9WFFYbkStTgEYULHRsFhGtxPov8Jj+nZnfk2rrBAxwyOrN1uKUC/wYUGJgBcCovvAd6bB68l4DDDdgwDxunPmkLwFw3K7NYQqNAOzTndeAnDODbteZGTYdFQTv5KaYBIsOMD5ERH9CFklEv2fmj+44YOj01/wwc/gxnGOA27GXzapm1Ibb7KKjpLaxixmNVwWGRsVAARCG4EvWNgIAY3hGNZpHrQG5n+m7iFzktqJllNItI3s1yETXgjxrnepGn6x4LBeOqxqGJ8s7mbQXDqYVH7yNsxEbc+0WC5T17fdRJNCASpBLoc2251FE39ykm4bh0jBckYClvhADMNaABgAXXWBRVNO2tIwMYLgAOwKAmnqg/6AJydqFRtRdQDLZFTAeDsiECIpPMrNGVEV/lVUjZD6lbdaEUjBLwfkKVgRDbFIg05euZ5++23XA6IopxvbkEnIo59jMILD6Q2nEjc7PTPbqf1QZMFRw6aVThddxEUoReUEdsLW1i64/MGKqqi8jAhgKFMo7esOHtDvjkqQah/o3uvB2/bdGVOk43R4rrdXkBu+5AsY3iOh7AJN+h5m/ZbXblZv0UOgHsNOIKSRMrYh5nBVyLVLv6993GjD2dVPauhoFlAIKGJ8hoo8b5PgNM7+MkixEHnkTt9Dua7SLFhIL6qneZKw4eEXl3E0yOcegaSgwjbE11qDBUvvYaaf3Uona5tUoUIMC/wcw48h43zPGVAAAAABJRU5ErkJggg==) no-repeat;
}

.index-logo {
    width: 11.51%;
    position: absolute;
    right: 30.313%;
    top: 15.648%;
}

.img-logo {
    padding-top: 12.66%;
    background: url(../images/login-logo.png) no-repeat;
    background-size: 100%;
}

.login-back {
    width: 3.75%;
    position: absolute;
    top: 4.62%;
    right: 5.208%;
}

.login-bg_title {
    position: absolute;
    left: 11.5%;
    top: 8%;
    color: #fff;
    width: 44%;
    z-index: 9;
}

.layout-login-body {
    height: 100%;
}

.layout-login-main {
    width: 26.05%;
    position: absolute;
    top: 20.55%;
    left: 0;
    right: 0;
    margin: auto;
    background-color: rgba(251,253,255,1);
    z-index: 3;
    padding: 1.57% 1.83% 2.09% 1.83%;
    border-radius: 12px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.login-pro {
    width: 39.6%;
    position: absolute;
}

.login-body-bg {
    width: 44.8%;
    left: 7%;
    bottom: 8.57%;
    position: absolute;
    z-index: 1;
}

    .login-body-bg.supplier {
        width: 44.8%;
    }

    .login-body-bg.customer {
        width: 44.8%;
    }

    .login-body-bg.franchisee {
        width: 44.8%;
    }

.login-box {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 41%;
    color: #A2A7AC;
    float: right;
}

.login-form {
    padding-top: 25.9%;
}

.login-title {
    font-size: 1.5rem;
    font-weight: 700;
    color: #424656;
    padding-bottom: 5px;
    padding-left: 20px;
}

.txt-ico-box {
    position: relative;
    border-radius: 5px;
    margin-bottom: 4.91%;
}

    .txt-ico-box .iconfont {
        font-size: 1.4rem;
        position: absolute;
        left: 10px;
        top: 15%;
    }

    .txt-ico-box input.login-input {
        border: 1px solid #FFF;
        padding-left: 18%;
        color: #424656;
        height: 3.15rem;
        font-size: 1rem;
        width: 100%;
        border-radius: 5px;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        background: #d3f2fc;
    }

    .txt-ico-box .login-label {
        position: absolute;
        padding-left: 18%;
        line-height: 3rem;
        color: #7F7983;
        font-size: 1rem;
    }

.verify-Code .txt-ico-box {
    width: 57%;
    float: left;
}

    .verify-Code .txt-ico-box .login-label {
        padding-left: 5%;
    }

    .verify-Code .txt-ico-box input.login-input {
        padding-left: 5%;
    }

input.login-password:-webkit-autofill {
    font-size: 1.5rem;
}

.ver-code {
    float: right;
    border-radius: 5px;
    overflow: hidden;
    width: 40%;
    height: 30px;
    border: 1px solid #d3f2fc;
    text-align: center;
    background-color: #d3f2fc;
    cursor: pointer;
}

.btn-box {
    margin-top: 2%;
}

.login-btn {
    background-color: #0e9cce;
    border-radius: 4px;
    line-height: 227%;
    font-size: 1.375rem;
    color: #fff;
    text-decoration: none;
    width: 100%;
    display: inline-block;
    text-align: center;
}

.login-tips {
    position: absolute;
    text-align: center;
    bottom: 8%;
    font-size: 12px;
    width: 100%;
    color: red;
    z-index: 4;
}

.login-loading {
    position: absolute;
    text-align: center;
    line-height: 400px;
    color: #fff;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,.3);
    display: none;
}

.layout-login-footer {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: #fff;
    padding: 0.94% 0 0.99%;
}

.return-index {
    display: inline-block;
}

.btn-Online {
    display: none;
}

    .btn-Online .login-btn {
        background-color: #fff;
        color: #3DAFD8;
        border: 1px solid #3DAFD8;
        line-height: 218%;
    }

.online-query .btn-Online {
    display: block;
}

.loginWay-box {
    display: none;
    position: absolute;
    z-index: 1;
    top: 1px;
    right: 3px;
    width: 220px;
    height: 70px;
}

    .loginWay-box #loginWayTip {
        float: left;
        display: inline-block;
        margin-top: 2px;
        width: 150px;
        height: 20px;
        text-align: right;
        color: #7F7983;
    }

    .loginWay-box #loginWayImg {
        float: right;
    }

.loginQrBindTip {
    position: absolute;
    z-index: 1;
    top: 70px;
    right: 130px;
    width: 80px;
    height: 20px;
    color: red;
}

.loginByQr-box {
    display: none;
    position: absolute;
    z-index: 1;
    top: 70px;
    right: 15px;
    width: 220px;
    height: 265px;
    background-color: #fff;
}

    .loginByQr-box .loginByQr-flex {
        width: 100%;
        height: 100%;
        padding: 2px;
        position: relative;
        display: flex;
        flex: 1;
        flex-direction: column;
    }

        .loginByQr-box .loginByQr-flex * {
            margin: auto;
            text-align: center;
            font-size: 14px;
        }

        .loginByQr-box .loginByQr-flex #loginQrMsg {
            color: red;
            overflow-wrap: break-word;
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
        }

.protocol-box {
    margin-top: 16px;
    color: #b3b7c7;
    position: absolute;
    z-index: 1;
    width: 220px;
    bottom: 10px;
    right: 10px;
}

    .protocol-box input[type="checkbox"] {
        vertical-align: -2px;
        margin-right: 4px;
    }

    .protocol-box a {
        color: #00a0e9;
        text-decoration: none;
    }

/*input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus { box-shadow: 0 0 0 60px white inset; -webkit-text-fill-color: #878787; }*/

input.login-input:focus {
    outline: none;
    border: 1px solid #d3f2fc;
    background-color: #d3f2fc;
}

.browser-logo {
    background: url(../images/login-logo-blue.png) no-repeat;
    width: 149px;
    height: 22px;
    margin: 20px 18px 0 0;
    float: right;
}

.login-auth-box {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
    background-color: rgba(0,0,0,0.4);
    display: none;
}

.login-auth-dialog {
    width: 430px;
    height: 215px;
    background-color: #fff;
    border-radius: 5px;
    position: absolute;
    top: 30%;
    left: 0;
    right: 0;
    margin: auto;
    padding: 10px;
    box-sizing: border-box;
}

    .login-auth-dialog ._title {
        padding: 5px;
        border-bottom: 1px solid #ccc;
        margin-bottom: 10px;
    }

    .login-auth-dialog ._body {
        font-size: 12px;
        color: red;
        margin-bottom: 20px;
    }

    .login-auth-dialog ._content {
        padding-top: 10px;
        text-align: center;
        margin-bottom: 20px;
    }

    .login-auth-dialog ._btn {
        margin-right: 10px;
        padding: 5px 20px;
        background: #fff;
        border: 1px solid #ccc;
        border-radius: 3px;
        line-height: 20px;
        font-size: 12px;
        float: right;
    }

        .login-auth-dialog ._btn:hover {
            background: #ccc;
            cursor: pointer;
        }


.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /*filter: alpha(opacity=0.8); 
    opacity: 0.8;*/ 
    z-index: 9999; /* 设置 z-index 值确保遮罩层位于其他元素之上 */
    display: flex;
    justify-content: center;
    background-color: rgba(173, 216, 230, 0.7);    
}

.overlay::before{
    content: '';
    position: absolute;
    top: 20.55%;
    left: 60%;
    right: calc(40% - 500px) ;
    bottom: calc(79.45% - 450px) ;
    background-color: rgba(255,255,255, 1);
    border-radius:12px;
  }


.content {
    position: relative;
    z-index: 10000; /* 设置 z-index 值确保内容层位于遮罩层之上 */
    width: 500px;
    height: 450px;
    top: 20.55%;
    margin-left: 60%;
    margin-right: auto;
    /*background: white;*/
    font: 12px "Helvetica Neue", Helvetica, Arial, sans-serif;
    border: none;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}

.content input {
        height: 30px;
        width: 125px;
        border-radius: 5px;
        border: none;
        padding-left: 5px;
    }

.content button {
        border-radius: 8px;
        box-sizing: border-box;
        cursor: pointer;
        display: inline-block;
        font-family: "Haas Grot Text R Web", "Helvetica Neue", Helvetica, Arial, sans-serif;
        font-size: 14px;
        font-weight: 500;
        height: 30px;
        width: 100px;
        line-height: 20px;
        list-style: none;
        outline: none;
        padding: 5px 16px;
        position: relative;
        text-align: center;
        text-decoration: none;
        transition: color 100ms;
        vertical-align: baseline;
        user-select: none;
        -webkit-user-select: none;
        touch-action: manipulation;
    }

.content button :hover,
.content button :focus {
            background-color: cornflowerblue;
        }

.button-1 {
    background-color: dodgerblue;
    color: #FFFFFF;
    border-style: none;
}

.button-1:hover,
.button-1:focus {
    background-color: skyblue;
}

.button-2 {
    background-color: white;
    color: black;
    border-color: gray;
    border-style: groove;
    border-width: 1px;
    margin-left: 20px;
}

.button-2:hover,
.button-2:focus {
    background-color: white;
}

.login-pwd-box {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: #A2A7AC;
    float: right;
    width: 100%;
}

.login-pwd-box .iconfont {
        top: 25%;
    }

.login-pwd-box .login_pwd_subbox .txt-ico-box {
        display: inline-block;
        margin-bottom: 5px;
        width: 200px;
    }

.login_pwd_subbox {
    text-align: right;
    width: 380px;
    margin-top:5px;
}

.login_pwd_span {
    color: black;
    font-size:16px;
}

.login-pwd-title {
    text-align: left;
    margin-left: 110px;
    margin-top: 20px;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
}

.login-pwd-title-span {
    color: black;
    font-size: 24px;
    font-weight: bold;
    margin-left: 20px;
}

.login-pwd-button {
    text-align: right;
    width: 380px;
    margin-top: 20px;
}

.login-pwd-msg {
    color: red;
    font-size: 15px;
    text-align: left;
    width: 350px;
    margin-left: 60px;
    margin-top:15px;
}

.login-pwd-img {
width:48px;
height:48px;
}

@media screen and (max-width: 1920px) {
    html {
        font-size: 14px;
    }

    .layout-login-main {
        width: 500px;
        padding: 30px 35px 40px;
    }

    .login-pro {
        width: 198px;
    }

    .login-title {
        font-size: 24px;
    }

    .login-body-bg {
        width: 224px;
        left: 35px;
        bottom: 35px;
    }

    .login-box {
        width: 176px;
    }
}

@media screen and (min-width: 1930px) {
    .login-box {
        width: 45%;
    }

    .protocol-box {
        right: 10%;
        width: 250px;
    }
}

/*@media screen and (max-width: 1600px) {
    html { font-size: 14px; }
}

@media screen and (max-width: 1400px) {
    html { font-size: 12px; }
}*/

/*IE hack*/
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .login-form .login-btn {
        line-height: 2.7;
        height: 3.1rem;
    }
}