﻿
body {
    background: url("/img/login-bg.jpg") no-repeat bottom left;
    background-size: 100% 100%;
    overflow:hidden;
}

.login_cenc {
    text-align: center;
    position: fixed;
    right: calc(50% - 330px);
    top: calc(50% - 200px);
    background:rgba(255,255,255,0.5);
    padding:0 50px 50px 0px;
    border-radius:10px;
}
    .login_cenc .tit {
        color: rgba(0,0,0,0.7);
        font-weight: bold;
        font-size: 20px;
        margin-bottom: 50px;
        display: inline-block;
        padding: 10px 20px;
        background: #b8cbfe;
        color: #525fde;
        margin-left:50px;
    }

    .login_cenc .loginLogo {
        margin-bottom: 2em;
    }

        .login_cenc .loginLogo img {
            max-width: 50px;
        }

        .login_cenc .loginLogo .iconfont {
            font-size: 50px;
            color: #92d1ff;
        }


    .login_cenc .loginLine{
        position:relative;
    }
        .login_cenc .loginLine .iconfont {
            position: absolute;
            z-index: 10;
            left: 10px;
            top: 0px;
            line-height: 50px;
            font-size: 22px;
            background: linear-gradient(45deg,#3ca1fd,#0d75fc);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }
    .login_cenc .layui-input {
        background: #f8f8f8;
        color: #333;
        border:1px solid #ddd;
        border-radius: 5px;
        height: 50px;
        line-height: 50px;
        text-indent: 30px;
        margin-bottom:20px;
    }

        .login_cenc .layui-input::-webkit-input-placeholder {
            color: rgba(0,0,0,0.5);
        }

    .login_cenc .layui-btn {
        background: linear-gradient(45deg,#3ca1fd,#0d75fc);
        border-radius: 10em;
        line-height: 50px;
        height: 50px;
        margin-top: 30px;
        width:100%;
    }

.blbg {
    width: 300%;
    height: 500px;
    margin: 0em auto;
    left: -100%;
    overflow: hidden;
    bottom: 0px;
    position: fixed;
}

    .blbg .waves {
        width: 100% !important;
    }

.bg-cicle {
    background: linear-gradient(45deg,#98c3ff,#0d75fc);
    position: absolute;
    width: 200px;
    height: 200px;
    border-radius: 100%;
    box-shadow: rgba(0,0,0,0.3) 0 0 10px;
}

    .bg-cicle.top {
        top: -100px;
    }

    .bg-cicle.right {
        right: -100px;
    }

    .bg-cicle.left {
        left: -100px;
    }

    .bg-cicle.bottom {
        bottom: -100px;
    }

    .bg-cicle.large {
        width: 500px;
        height: 500px;
    }

        .bg-cicle.large.top {
            top: -250px;
        }

        .bg-cicle.large.right {
            right: -250px;
        }
        .bg-cicle.large.bottom {
            bottom: -250px;
        }

        .bg-cicle.large.left {
            left: -250px;
        }

    .bg-cicle.small {
        width: 100px;
        height: 100px;
    }

        .bg-cicle.small.top {
            top: -50px;
        }

        .bg-cicle.small.right {
            right: -50px;
        }
        .bg-cicle.small.bottom {
            bottom: -50px;
        }

        .bg-cicle.small.left {
            left: -50px;
        }

        .loginbox{
            display:flex;
            flex-flow:row nowrap;
        }
.loginbox .pic{
    background:url("/img/login-pic.png") no-repeat center;
    background-size:auto 100%;
    width:300px;
    height:200px;
}
            .loginbox .form{
                width:300px;
            }
            .mob-btn{
                display:none;
            }
            .pc-btn{
                display:block;
            }
@media (max-width:500px){
    .login_cenc {
        width:90%;
        position:initial;
        margin:30% auto 0px auto;
        background:none;
        padding:0px;
    }
        .login_cenc .tit{
            margin-left:0px;
            border-radius:5px;
        }
        .login_cenc .loginbox {
            display: block;
            width: 100%;
        }
            .login_cenc .loginbox .pic {
                display:none;
            }
            .login_cenc .loginbox .form{
                width:100%;
            }
        .login_cenc .layui-btn{
            box-shadow:0px 0px 10px rgba(0,0,0,0.1);
            border:none;
        }

    .mob-btn {
        display: block;
    }

    .pc-btn {
        display: none;
    }
}