@charset "UTF-8"; body, p, ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, form, fieldset, legend, input, select, textarea, button, th, td, menu { margin: 0; padding: 0; } ul, dl, ol { list-style: none; } button, input[type=button] { cursor: pointer; } input, select, textarea { outline: none; } a { text-decoration: none; } a:hover { text-decoration: none; } a:focus { text-decoration: none; } cite { font-style: inherit; } .fl { float: left; } .fr { float: right; } .clear { clear: both; } .clearfix:after { content: ""; display: block; clear: both; } html { height: 100%; width: 100%; font-family: "Helvetica Neue", "Helvetica", "Arial", "PingFang SC", "Hiragino Sans GB", "Heiti SC", "WenQuanYi Micro Hei", "sans-serif"; } body { width: 100%; height: 100%; overflow: hidden; } .login-box { width: 100%; height: 100%; overflow: hidden; } .main-box { position: relative; width: 100%; height: 100%; z-index: 99; } .bg img { width: 100%; height: 100%; position: absolute; } .bg img:nth-child(2n) { top: -100%; left: 100%; } .bg img:nth-child(2n+1) { top: 100%; left: -100%; } .bg img.Original { top: 0px; left: 0px; transition: all 0.5s; } .login-logo { position: absolute; left: 46px; top: 3%; z-index: 100; } .login-logo img { width: 203px; height: 40px; } .user-choice { position: absolute; right: 46px; top: 3%; z-index: 100%; } .user-choice .language { width: 84px; height: 24px; font-size: 12px; color: #606262; display: inline-block; vertical-align: middle; border-radius: 3px; margin-right: 5px; /*下拉框样式*/ } .user-choice .language #selected { background: #ffffff; width: 100%; height: 100%; font-size: 12px; color: #606262; border-radius: 3px; } .user-choice .language .select-head { overflow: hidden; width: 84px; height: 24px; box-sizing: border-box; line-height: 24px; cursor: pointer; } .user-choice .language .select-head .select-head-cont { float: left; padding-left: 10px; } .user-choice .language .select-head .select-icon { line-height: 0; float: right; } .user-choice .language .select-head .select-icon img { padding-top: 2px; padding-right: 4px; } .user-choice .language .option { text-indent: 10px; margin-top: 1px; width: 84px; color: #606262; background: #ffffff; border-radius: 3px; line-height: 24px; padding-top: 2px; padding-bottom: 2px; display: none; } .user-choice .language .option-item:hover { background: #3b5e93; color: #ffffff; } .user-choice .theme { width: 30px; height: 24px; display: inline-block; text-align: center; border-radius: 3px; line-height: 24px; vertical-align: middle; background: #ffffff; position: relative; cursor: pointer; } .user-choice .theme .pifu { padding: 5px; width: 14px; height: 14px; } .user-choice .theme .theme-box { width: 173px; height: 54px; position: absolute; right: 0; bottom: -57px; background: #ffffff; border-radius: 2px; padding: 2px; box-sizing: border-box; display: none; } .user-choice .theme .theme-box li { width: 55px; height: 50px; display: inline-block; margin-right: 2px; } .user-choice .theme .theme-box li:last-child { margin-right: 0; } .user-choice .theme .theme-box img { width: 100%; height: 100%; } .login-main { position: absolute; left: 50%; top: 50%; border-radius: 8px; transform: translate(-50%, -50%); background-color: rgba(255, 250, 2550, .62); height: 450px; overflow: hidden; display: table; } .login-mastergraph { width: 550px; height: 500px; display: table-cell; vertical-align: top; overflow: hidden; } .login-mastergraph img { width: 100%; height: 100%; display: none; } .login-mastergraph .block { display: block; } .login-fill { width: 340px; height: 400px; display: table-cell; vertical-align: top; position: relative; } .login-fill .dingdingLogin, .login-fill .weixinLogin { width: 100%; height: 100%; } .login-fill .dingdingLogin .wxtips, .login-fill .dingdingLogin .ddtips, .login-fill .weixinLogin .wxtips, .login-fill .weixinLogin .ddtips { width: 280px; margin: 0 auto; font-size: 14px; color: #ffffff; height: 40px; background: black; opacity: 0.5; border-radius: 6px; text-align: center; line-height: 40px; position: absolute; bottom: 12px; left: 50%; z-index: 1; transform: translate(-50%, 0%); } .login-fill .dingdingLogin .close, .login-fill .weixinLogin .close { position: absolute; right: 15px; top: 15px; } .login-fill .dingdingLogin .qrcode, .login-fill .weixinLogin .qrcode { position: absolute; left: 50%; top: 55%; transform: translate(-50%, -60%); } .login-fill .dingdingLogin .qrcode h1, .login-fill .weixinLogin .qrcode h1 { text-align: center; } .login-fill .dingdingLogin .wxQrcode, .login-fill .weixinLogin .wxQrcode { position: absolute; left: 50%; top: 63%; transform: translate(-50%, -60%); } .login-fill .dingdingLogin .footImg, .login-fill .dingdingLogin .wxfootImg, .login-fill .weixinLogin .footImg, .login-fill .weixinLogin .wxfootImg { position: fixed; bottom: 20px; right: 40px; display: flex; align-items: center; } .login-fill .dingdingLogin .footImg .leftLine, .login-fill .dingdingLogin .wxfootImg .leftLine, .login-fill .weixinLogin .footImg .leftLine, .login-fill .weixinLogin .wxfootImg .leftLine { border-top: 1px solid #eaeaea; width: 100px; height: 1px; margin-right: 10px; } .login-fill .dingdingLogin .footImg img, .login-fill .dingdingLogin .wxfootImg img, .login-fill .weixinLogin .footImg img, .login-fill .weixinLogin .wxfootImg img { margin: 0 2px; } .login-fill .dingdingLogin .footImg .rightLine, .login-fill .dingdingLogin .wxfootImg .rightLine, .login-fill .weixinLogin .footImg .rightLine, .login-fill .weixinLogin .wxfootImg .rightLine { border-top: 1px solid #eaeaea; width: 100px; height: 1px; margin-left: 10px; } .login-fill .dingdingLogin .wxfootImg, .login-fill .weixinLogin .wxfootImg { right: 43px; bottom: 23px; } .code-switch { width: 340px; position: absolute; top: 10px; left: 0; } .code-switch .error-tip { width: 190px; background: #fde6e5; border-radius: 20px; font-size: 12px; text-align: center; line-height: 14px; color: #f66161; margin-left: 68px; padding: 4px; display: none; } .code-switch .login-code { /* width: 60px; height: 60px; */ padding-right: 10px; } .code-switch .login-code .static { display: none; } .login-operation { padding-bottom: 10px; } .login-operation h3 { font-size: 24px; text-align: center; padding-top: 45px; color: #333636; } .login-center { width: 280px; margin: 0 auto 6px; } .login-center .wxtips, .login-center .ddtips { width: 280px; font-size: 14px; color: #ffffff; height: 40px; background: black; opacity: 0.5; border-radius: 6px; text-align: center; line-height: 40px; position: absolute; bottom: 12px; left: 50%; z-index: 1; transform: translate(-50%, 0%); } .field_wrap { position: relative; height: 56px; padding-top: 24px; box-sizing: border-box; border-bottom: 1px solid #909595; margin-bottom: 10px; } .field_wrap .text-field-content { height: 32px; } .field_wrap .text-field-content input { width: 90%; height: 32px; line-height: 32px; border: none; position: absolute; z-index: 2; background: transparent; } .field_wrap .text-field-content input:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px white inset !important; } .field_wrap .text-field-content div.del-tran { font-size: 12px; bottom: 34px; scale: 0.5; transition: all 0.45s; } .field_wrap .text-field-content .mu-text-field-focus-line { background-color: #2878ff; margin: 0; height: 1px; border: none; position: absolute; left: 0; right: 0; top: 54px; -webkit-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); border-radius: 2px; -webkit-transition: -webkit-transform 0.45s cubic-bezier(0.23, 1, 0.32, 1); transition: -webkit-transform 0.45s cubic-bezier(0.23, 1, 0.32, 1); transition: transform 0.45s cubic-bezier(0.23, 1, 0.32, 1); transition: transform 0.45s cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 0.45s cubic-bezier(0.23, 1, 0.32, 1); } .field_wrap .text-field-content hr.focus { -webkit-transform: scaleX(1); -ms-transform: scaleX(1); transform: scaleX(1); } .field_wrap .text-field-content .mu-text-field-label { font-size: 14px; color: #909595; position: absolute; bottom: 7px; left: 0; z-index: 1; transition: all 0.45s; } .field_wrap .text-field-content .delbox , .field_wrap .text-field-content .eyebox_open , .field_wrap .text-field-content .eyebox_close{ width: 24px; height: 24px; position: absolute; bottom: 1px; right: 0px; z-index: 10; text-align: center; padding-top: 4px; box-sizing: border-box; display: none; } .field_wrap .text-field-content .del { width: 12px; height: 12px; cursor: pointer; } .login-form-group { position: relative; display: none; left: 9%; width: 280px; top: 12px; } .login-form-group .drop-down { cursor: pointer; } .login-form-group .domain { position: absolute; width: 100%; overflow: auto; top: 60px; background: #ffffff; z-index: 999; box-shadow: 0px 2px 5px 0px #b9bbbf; display: none; } .login-form-group .domain li { height: 30px; line-height: 30px; border: 1px solid #eaefef; padding-left: 10px; padding-right: 10px; color: #333636; font-size: 14px; width: 258px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .login-form-group .domain li:hover { background: #3b5e93; color: #ffffff; } .login-form-group .domain li:hover a { color: #ffffff; } .login-form-group .domain li:last-child { border: none; } .login-form-group .domain li a { font-size: 14px; color: #333636; } .verification { width: 100%; display: none; } .verification .field_wrap { width: 140px; display: inline-block; vertical-align: bottom; margin-bottom: 0px; } .verification .code { width: 130px; height: 56px; display: inline-block; vertical-align: bottom; } .verification .code img { width: 100%; height: 100%; } .verification .verification-tip { font-size: 12px; line-height: 18px; margin-top: 10px; color: #3b5e93; } .obpm-checkbox-section { display: flex; align-items: center; padding-top: 10px; } .obpm-checkbox-section .choice { width: 16px; height: 16px; position: relative; display: inline-block; font-weight: 400; color: #0c4757; cursor: pointer; vertical-align: middle; } .obpm-checkbox-section .choice input { display: none; } .obpm-checkbox-section .choice input:checked + i { background-position: left bottom; } .obpm-checkbox-section .choice i { display: inline-block; position: absolute; top: 0px; left: 0; width: 16px; height: 16px; outline: 0; background: url(../images/updown.png) no-repeat left top; } .obpm-checkbox-section .obpm-checkboxLogin { font-size: 12px; color: #606262; vertical-align: middle; padding: 0 6px; display: inline-block; width: 103px; box-sizing: border-box; } .obpm-checkbox-section .changeLogin { font-size: 12px; color: #2878ff; vertical-align: middle; padding: 0 6px; display: inline-block; width: 103px; box-sizing: border-box; } .obpm-checkbox-section .btnOk { width: 160px; height: 40px; border: none; outline-style: none; color: #ffffff; text-align: center; line-height: 40px; background: #3b5e93; border-radius: 20px; cursor: pointer; vertical-align: middle; } .obpm-checkbox-section .btnOk:hover { background: #4e6e9e; } .foot { position: absolute; bottom: 60px; display: flex; align-items: center; } .foot .leftLine { border-top: 1px solid #eaeaea; width: 83px; height: 1px; } .foot img { margin: 0 5px; } .foot .rightLine { border-top: 1px solid #eaeaea; width: 103px; height: 1px; } .sweep-code .sweep-code-box, .weixin-code .sweep-code-box, .dd-code .sweep-code-box { width: 240px; height: 240px; margin: 20px auto; } .sweep-code .sweep-code-box img, .weixin-code .sweep-code-box img, .dd-code .sweep-code-box img { width: 100%; height: 100%; } .sweep-code h5, .weixin-code h5, .dd-code h5 { font-size: 12px; color: #333636; text-align: center; } .other_login { border-top: 1px solid #c9c9c9; margin-top: 34px; position: relative; margin-left: 30px; margin-right: 30px; } .other_login .other_btn { color: #888888; margin: 0 auto; position: relative; top: -12px; left: 0; height: 24px; width: 78px; background: white; text-align: center; } .copyright { position: fixed; bottom: 5%; left: 50%; transform: translateX(-50%); text-align: center; font-size: 12px; color: #ffffff; z-index: 100; } /*# sourceMappingURL=login_new.css.map */