.login-l{
    /*width: 1100px;*/
    /*background-color: rgba(255, 255, 255, 0.27);*/
    /*border-radius: 10px;*/
    /*border: 1px solid #aaa;*/
    /*margin: 20px auto;*/
    /*padding: 30px 0 20px 60px;*/
    /*font-size: 12px;*/
    /*box-shadow: inset 0px 0px 10px rgba(255, 255, 255, 0.5), 0px 0px 15px rgba(75, 75, 75, 0.3);*/

}

.login-warp {
    width: 100%;

}

.login-warp-content {
    width: 1000px;
    min-width: 1000px;
    max-width: 1180px;
    margin: 0 auto;
    overflow: hidden;
    position: relative;
    height: 500px;
}

.login-box {
    padding: 10px 20px 0px 20px;
    width: 344px;
    height: 360px;
    position: absolute;
    background: #fff;
    right: 2px;
    top: 50px;
    border: 1px solid #e8e8e8;
    border-top: 1px solid #58a7f7;
    box-shadow: 2px 2px 2px #e8e8e8;
}

.login-box:after {
    content: "";
    position: absolute;
    top: 370px;
    left: 0px;
    width: 384px;
    height: 16px;
    background: url(../img/login-box-shadow.png) no-repeat center center;
}

.login-ad {
    width: 495px;
    height: 298px;
    position: absolute;
    left: 0;
    top: 94px;
}

.login-ad img {
    width: 495px;
    height: 298px;
}

.loin-box-btn {
    width: 344px;
    margin-bottom: 20px;
    overflow: hidden;
}

.loin-box-btn li {
    font-size: 18px;
    color: #333;
    cursor: pointer;
    position: relative;
    float: left;
    width: 172px;
    text-align: center;
    border-bottom: 1px solid #e8e8e8;
    height: 36px;
    line-height: 36px;
}

.loin-box-btn li.active, .loin-box-btn li:hover {
    color: #58a7f7;
    border-bottom: 2px solid #58a7f7;
    top: -1px;
}

.loin-box-list {
    width: 344px;
}

.loin-box-list li {
    width: 342px;
    border: 1px solid #cccccc;
    height: 42px;
    margin-bottom: 18px;
    position: relative;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}

.loin-box-list li.active {
    border: 1px solid #a4cef9;
    box-shadow: 1px 1px 4px #a4cef9;
}

.loin-box-list li label {
    line-height: 42px;
    -webkit-transition: all .4s;
    -moz-transition: all .4s;
    transition: all .4s;
    display: block;
    float: left;
    height: 42px;
    width: 44px;
    background: #f0efef;
    border-right: 1px solid #ccc;
    -moz-border-radius-bottomleft: 4px;
    -webkit-border-bottom-left-radius: 4px;
    -moz-border-radius-topleft: 4px;
    -webkit-border-top-left-radius: 4px;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

.loin-box-list li.active label {
    border-right: 1px solid #a4cef9;
    -moz-border-radius-bottomleft: 4px;
    -webkit-border-bottom-left-radius: 4px;
    -moz-border-radius-topleft: 4px;
    -webkit-border-top-left-radius: 4px;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

.loin-box-list li p {
    float: left;
    height: 22px;
    padding: 10px 0px 0px 8px;
    width: 285px;
    outline: none;
    border: none;
}

.loin-box-list li p input {
    height: 22px;
    width: 100%;
    outline: none;
    border: none;
    background: none;
    font-size: 16px;
    font-family: Microsoft YaHei;
}

.loin-box-list li cite {
    font-style: normal;
    position: absolute;
    background: #fef0ed;
    border: 1px solid #fdc4b8;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    border-radius: 6px;
    z-index: 1;
    color: #ee4d2b;
    height: 28px;
    line-height: 28px;
    width: 200px;
    text-align: center;
    left: 54px;
    top: -24px;
}

.loin-box-list li cite:after {
    content: "";
    position: absolute;
    overflow: hidden;
    left: 105px;
    top: 28px;
    width: 10px;
    height: 6px;
    background: url(../img/login-arrow.png) no-repeat;
    background-position: -0px -127px;
    display: block;
    z-index: 2;
}

.loin-box-list li.user {
}

.loin-box-list li.user label {
    background: url(../img/login-arrow.png) no-repeat #f0efef;
    background-position: -69px -56px;
}

.loin-box-list li.user label.active {
    background: url(../img/login-arrow.png) no-repeat #bddcfc;
    background-position: -69px 8px;
}

.loin-box-list li.pas {
    margin-bottom: 15px;
}

.loin-box-list li.pas label {
    background: url(../img/login-arrow.png) no-repeat #f0efef;
    background-position: 11px -56px;
}

.loin-box-list li.pas label.active {
    background: url(../img/login-arrow.png) no-repeat #bddcfc;
    background-position: 11px 8px;
}

.loin-box-list li.ver {
    margin-bottom: 15px;
    border: none;
}

.loin-box-list li.ver label {
    background: none;
    border-right: none;
}

.loin-box-list li.ver p {
    width: 140px;
    height: 22px;
    padding: 10px 0px 10px 8px;
    border: 1px solid #cccccc;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}

.loin-box-list li.ver img {
    cursor: pointer;
    font-style: normal;
    text-align: center;
    display: inline-block;
    height: 42px;
    float: right;
    background: #61a8f0;
    color: #fff;
    border: 1px solid #61a8f0;
    font-size: 16px;
    line-height: 42px;
    width: 130px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}

.loin-box-list li.user {
}

.loin-box-list li.ipone label {
    background: url(../img/login-arrow.png) no-repeat #f0efef;
    background-position: -170px 6px;
}

.loin-box-list li.ipone label.active {
    background: url(../img/login-arrow.png) no-repeat #bddcfc;
    background-position: -170px -57px;
}

.loin-box-list li.code {
    border: none;
}

.loin-box-list li.code p {
    width: 175px;
    height: 22px;
    padding: 10px 0px 10px 8px;
    border: 1px solid #cccccc;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}

.loin-box-list li.code p.active {
    border: 1px solid #a4cef9;
    box-shadow: 1px 1px 1px #a4cef9;
}

.loin-box-list li.code em {
    cursor: pointer;
    font-style: normal;
    text-align: center;
    display: inline-block;
    height: 42px;
    float: right;
    background: #61a8f0;
    color: #fff;
    border: 1px solid #61a8f0;
    font-size: 16px;
    line-height: 42px;
    width: 130px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}

.loin-box-list li.hint {
    background: #fef0ed;
    border: 1px solid #fdc4b8;
    color: #ee4d2b;
    line-height: 42px;
    padding-left: 15px;
    width: 327px;
}

.loin-box-list li.re-pas {
    border: none;
    height: 20px;
    margin-bottom: 10px;
}

.loin-box-list li.re-pas input {
    margin-right: 5px;
}

.loin-box-list li.re-pas a {
    display: inline-block;
    float: right;
    color: #2b86e3;
}

.loin-box-list li.re-pas a:hover {
    text-decoration: underline;
}

.loin-box-list li.login-btn {
    cursor: pointer;
    border: 1px solid #ff9813;
    background: #ff9813;
    color: #fff;
    font-size: 16px;
    text-align: center;
    line-height: 42px;
    margin-bottom: 10px;
}

.loin-box-list li.login-btn span {
}

.login-box > p {
    height: 20px;
    line-height: 20px;
}

.login-box > p a {
    display: inline-block;
    color: #2b86e3;
    margin-left: 15px;
}

.login-box > p a:hover {
    text-decoration: underline;
}

.collapse {
    display: none;
}