body {
    margin: 0px;
    padding: 0px;
}

div {
    margin: 0px;
    padding: 0px;
}

dl {
    margin: 0px;
    padding: 0px;
}

dt {
    margin: 0px;
    padding: 0px;
}

dd {
    margin: 0px;
    padding: 0px;
}

ul {
    margin: 0px;
    padding: 0px;
}

ol {
    margin: 0px;
    padding: 0px;
}

li {
    margin: 0px;
    padding: 0px;
}

form {
    margin: 0px;
    padding: 0px;
}

input {
    margin: 0px;
    padding: 0px;
}

button {
    margin: 0px;
    padding: 0px;
}

textarea {
    margin: 0px;
    padding: 0px;
}

p {
    margin: 0px;
    padding: 0px;
}

address {
    font-style: normal;
    font-weight: normal;
}

caption {
    font-style: normal;
    font-weight: normal;
}

cite {
    font-style: normal;
    font-weight: normal;
}

code {
    font-style: normal;
    font-weight: normal;
}

dfn {
    font-style: normal;
    font-weight: normal;
}

em {
    font-style: normal;
    font-weight: normal;
}

strong {
    font-style: normal;
    font-weight: normal;
}

th {
    font-style: normal;
    font-weight: normal;
}

var {
    font-style: normal;
    font-weight: normal;
}

body {
    font-family: "Microsoft Yahei";
    background-color: rgb(255, 255, 255);
}

a {
    text-decoration: none;
}

ol {
    list-style: none;
}

ul {
    list-style: none;
}

li {
    list-style: none;
}

.fl {
    float: left;
}

.fr {
    float: right;
}

input {
    border: currentColor;
    border-image: none;
}

.header {
    margin: 0px auto;
    width: 954px;
    color: rgb(66, 127, 241);
    font-size: 28px;
    font-weight: bold;
}

.header-title {
    padding: 12px 0px;
}

.header-title-name {
    color: rgb(46, 109, 192);
}

.current {
    color: rgb(215, 215, 215) !important;
}

.main-con {
    background: url("../images/bg01.png") no-repeat center / cover;
    height: 500px;
}

.main-smhelp {
    height: 780px;
}

.main-con .main {
    margin: 0px auto;
    width: 1200px;
    height: 100%;
    position: relative;
}

.left-con {
    left: 160px;
    width: 560px;
    height: 100%;
    position: absolute;
}

.panel1 {
    left: 30px;
    top: 26px;
    width: 180px;
    height: 200px;
    position: absolute;
}

    .panel1 > img {
        left: 0px;
        top: 0px;
        width: 100%;
        height: 100%;
        position: absolute;
    }

.panel2 {
    left: 48px;
    top: 242px;
    width: 180px;
    height: 200px;
    position: absolute;
}

    .panel2 > img {
        left: 0px;
        top: 0px;
        width: 100%;
        height: 100%;
        position: absolute;
    }

.panel3 {
    left: 285px;
    top: 12px;
    width: 180px;
    height: 200px;
    position: absolute;
}

    .panel3 > img {
        left: 0px;
        top: 0px;
        width: 100%;
        height: 100%;
        position: absolute;
    }

.panel4 {
    left: 296px;
    top: 218px;
    width: 220px;
    height: 210px;
    position: absolute;
}

    .panel4 > img {
        left: 0px;
        top: 0px;
        width: 100%;
        height: 100%;
        position: absolute;
    }

.panel-center {
    left: 166px;
    top: 90px;
    position: absolute;
    z-index: 99;
}

    .panel-center > img {
        width: 200px;
    }

.ani-top {
    animation: ani-jump 3s linear infinite;
    -webkit-animation: ani-jump 3s linear infinite;
}

.data-canva {
    left: -8px;
    top: 58px;
    position: absolute;
    transform: rotateZ(2deg) rotateX(34deg) rotateY(39deg);
}

.main-login {
    background: rgb(255, 255, 255);
    padding: 45px 35px 35px;
    border-radius: 4px;
    top: 60px;
    right: 80px;
    position: absolute;
    z-index: 8;
}

.main-login-title {
    text-align: center;
    color: rgb(66, 127, 241);
    font-weight: bold;
    margin-bottom: 20px;
}

    .main-login-title span {
        font-size: 22px;
    }

.main-login-item {
    height: 38px;
    margin-top: 20px;
}

    .main-login-item.but {
        margin-top: 38px;
    }

    .main-login-item span {
        width: 38px;
        height: 38px;
        vertical-align: top;
        border-right-color: rgb(238, 236, 236);
        border-right-width: 1px;
        border-right-style: solid;
        display: inline-block;
    }

        .main-login-item span.user_span {
            background: url("../images/user.png") no-repeat center;
        }

        .main-login-item span.pass_span {
            background: url("../images/pass.png") no-repeat center;
        }

.main-login input {
    height: 38px;
    color: rgb(25, 22, 22);
    line-height: 38px;
    padding-left: 10px;
    font-size: 14px;
    font-weight: 500;
    background-color: rgb(252, 252, 252);
}

.user-info {
    width: 230px;
}

.login-number {
    padding: 0px 5px;
    width: 110px;
    line-height: 38px;
    vertical-align: middle;
}

.change {
    color: rgb(25, 22, 22);
    font-size: 14px;
    text-decoration: underline;
}

.confirm {
    margin-bottom: -12px;
    vertical-align: sub;
}

.main-login-item.info {
    border-radius: 3px;
    border: 1px solid rgb(240, 240, 240);
    border-image: none;
    background-color: rgb(252, 252, 252);
}

.con_input input {
    border-radius: 3px;
    border: 1px solid rgb(240, 240, 240);
    border-image: none;
    background-color: rgb(252, 252, 252);
}

.form-btn {
    border-radius: 3px;
    border: currentColor;
    border-image: none;
    width: 120px;
    height: 38px;
    text-align: center;
    color: white !important;
    line-height: 38px;
    font-size: 16px !important;
    display: block;
    cursor: pointer;
    background-color: rgb(56, 158, 242);
}

    .form-btn:hover {
        background-color: rgb(66, 127, 241);
    }

.footer {
    margin-top: 20px;
    
    margin-bottom: 60px;
}

    .footer > p {
        text-align: center;
        color: rgb(65, 96, 141);
        font-size: 14px;
    }

        .footer > p > a {
            margin: 14px;
            color: rgb(65, 96, 141);
            font-size: 14px;
        }

.droplet {
    width: 2px;
    height: 4px;
    position: absolute;
    box-shadow: 1px -2px 7px rgba(255,255,255,0.57);
    transform: rotate(-115deg);
    background-color: rgba(255, 255, 255, 0.33);
}

.droplet2 {
    box-shadow: 1px 3px 7px rgba(255,255,255,0.57);
}

.droplet3 {
    box-shadow: -1px -3px 7px rgba(255,255,255,0.57);
}

.droplet4 {
    transform: rotate(-231.999985deg);
}

.dot-ani1 {
    animation: myfirst 3s linear infinite;
    position: absolute;
    -webkit-animation: myfirst 3s infinite linear;
    -moz-animation: myfirst 3s infinite linear;
    -o-animation: myfirst 3s infinite linear;
    -webkit-animation-fill-mode: forwards;
}

.dot-ani2 {
    animation: mysecond 3s linear infinite;
    position: absolute;
    -webkit-animation: mysecond 3s infinite linear;
    -moz-animation: mysecond 3s infinite linear;
    -o-animation: mysecond 3s infinite linear;
    -webkit-animation-fill-mode: forwards;
}

.dot-ani3 {
    animation: mythird 3s linear infinite;
    position: absolute;
    -webkit-animation: mythird 3s infinite linear;
    -moz-animation: mythird 3s infinite linear;
    -o-animation: mythird 3s infinite linear;
    -webkit-animation-fill-mode: forwards;
}

.dot-ani4 {
    animation: myfirth 3s linear infinite;
    position: absolute;
    -webkit-animation: myfirth 3s infinite linear;
    -moz-animation: myfirth 3s infinite linear;
    -o-animation: myfirth 3s infinite linear;
    -webkit-animation-fill-mode: forwards;
}

.dot-ani1-2 {
    animation: myfirst2 3s linear infinite;
    position: absolute;
    -webkit-animation: myfirst2 3s infinite linear;
    -moz-animation: myfirst2 3s infinite linear;
    -o-animation: myfirst2 3s infinite linear;
    -webkit-animation-fill-mode: forwards;
}

.dot-ani2-2 {
    animation: mysecond2 3s linear infinite;
    position: absolute;
    -webkit-animation: mysecond2 3s infinite linear;
    -moz-animation: mysecond2 3s infinite linear;
    -o-animation: mysecond2 3s infinite linear;
    -webkit-animation-fill-mode: forwards;
}

.dot-ani3-2 {
    animation: mythird2 3s linear infinite;
    position: absolute;
    -webkit-animation: mythird2 3s infinite linear;
    -moz-animation: mythird2 3s infinite linear;
    -o-animation: mythird2 3s infinite linear;
    -webkit-animation-fill-mode: forwards;
}

.dot-ani4-2 {
    animation: myfirth2 3s linear infinite;
    position: absolute;
    -webkit-animation: myfirth2 3s infinite linear;
    -moz-animation: myfirth2 3s infinite linear;
    -o-animation: myfirth2 3s infinite linear;
    -webkit-animation-fill-mode: forwards;
}

.dot-ani1-3 {
    animation: myfirst3 3s linear infinite;
    position: absolute;
    -webkit-animation: myfirst3 3s infinite linear;
    -moz-animation: myfirst3 3s infinite linear;
    -o-animation: myfirst3 3s infinite linear;
    -webkit-animation-fill-mode: forwards;
}

.dot-ani2-3 {
    animation: mysecond3 3s linear infinite;
    position: absolute;
    -webkit-animation: mysecond3 3s infinite linear;
    -moz-animation: mysecond3 3s infinite linear;
    -o-animation: mysecond3 3s infinite linear;
    -webkit-animation-fill-mode: forwards;
}

.dot-ani3-3 {
    animation: mythird3 3s linear infinite;
    position: absolute;
    -webkit-animation: mythird3 3s infinite linear;
    -moz-animation: mythird3 3s infinite linear;
    -o-animation: mythird3 3s infinite linear;
    -webkit-animation-fill-mode: forwards;
}

.dot-ani4-3 {
    animation: myfirth3 3s linear infinite;
    position: absolute;
    -webkit-animation: myfirth3 3s infinite linear;
    -moz-animation: myfirth3 3s infinite linear;
    -o-animation: myfirth3 3s infinite linear;
    -webkit-animation-fill-mode: forwards;
}

.dot-ani1-4 {
    animation: myfirst4 3s linear infinite;
    position: absolute;
    -webkit-animation: myfirst4 3s infinite linear;
    -moz-animation: myfirst4 3s infinite linear;
    -o-animation: myfirst4 3s infinite linear;
    -webkit-animation-fill-mode: forwards;
}

.dot-ani2-4 {
    animation: mysecond4 3s linear infinite;
    position: absolute;
    -webkit-animation: mysecond4 3s infinite linear;
    -moz-animation: mysecond4 3s infinite linear;
    -o-animation: mysecond4 3s infinite linear;
    -webkit-animation-fill-mode: forwards;
}

.dot-ani4-4 {
    animation: mythird4 3s linear infinite;
    position: absolute;
    -webkit-animation: mythird4 3s infinite linear;
    -moz-animation: mythird4 3s infinite linear;
    -o-animation: mythird4 3s infinite linear;
    -webkit-animation-fill-mode: forwards;
}

.dot-ani3-4 {
    animation: myfirth4 3s linear infinite;
    position: absolute;
    -webkit-animation: myfirth4 3s infinite linear;
    -moz-animation: myfirth4 3s infinite linear;
    -o-animation: myfirth4 3s infinite linear;
    -webkit-animation-fill-mode: forwards;
}

input[type=text]:focus {
    -webkit-box-shadow: 0 0 0 1000px #fcfcfc inset;
}

input[type=password]:focus {
    -webkit-box-shadow: 0 0 0 1000px #fcfcfc inset;
}