@charset "UTF-8"; /*-- 页面辅助文字 --*/ /*-- 页面辅助文字 --*/ /* -- 按钮 -- */ /*-- 文本截取,超出一行行加省略号 --*/ /*-- 文本截取,超出两行加省略号 --*/ /*-- 圆角 --*/ /*-- inline-block --*/ /*-- 透明度 --*/ /*-- 一级下拉菜单样式 --*/ /*-- 导航下拉菜单原始样式 --*/ /*-- 导航下拉菜单hover样式 --*/ /*-- new标记 --*/ /*-- 分隔符 --*/ .passcard-box, .passcon .retrieve-pass-box .retrie-center { margin: 0 auto; } .passcon .retrieve-pass-box { box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; } /*-- 按钮通用 --*/ /*-- 卡片透明度 --*/ /*-- 小三角朝下投影效果 --*/ .passcon .retrieve-pass-box { border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; } .passcon .retrieve-pass-box .retrie-center .form-eye-icon { right: 10px; top: 10px; } .mask-layer { width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); position: fixed; top: 0; left: 0; z-index: 12; } .login-div-box { width: 400px; height: 500px; text-align: center; margin: 0 auto; border-radius: 4px; overflow: hidden; } .clear { clear: both; } .text-center { text-align: center; } .btn-default-main, .btn-default-secondary { height: 42px; } .disabled-color { color: #bbbbbb; background: #eeeeee; border: 1px solid #eeeeee; border-radius: 4px; cursor: pointer; text-align: center; } .pass-header-wrap { max-width: 1200px; margin: 0 auto; } .top-error-tips { background: rgba(253, 209, 0, 0.2); border: 1px solid #fdd100; margin-bottom: 20px; padding: 5px 10px; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; } .passcard-box { width: 900px; padding-top: 48px; } .pass-main-body { width: 100%; min-height: 100%; min-width: 900px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; position: relative; } .passcard-nav, .login-passcard-nav { padding-top: 40px; line-height: 24px; font-size: 24px; } .login-passcard-nav { padding-top: 30px; color: #ffffff; display: flex; align-items: center; } .login-passcard-nav .login-zcool-logo { /* width: 137px; */ height: 24px; float: left; margin-right: 10px; padding-right: 10px; /* background-image: url(/static/image/logo_04.png); */ background-repeat: no-repeat; background-size: auto 24px; display: inline-block; vertical-align: middle; *vertical-align: auto; zoom: 1; *display: inline; position: relative; } .login-passcard-nav .login-zcool-logo::after { content: ""; width: 1px; height: 24px; background: #ffffff; position: absolute; right: 0; top: 50%; margin-top: -12px; } .login-logo { margin: 0 auto; color: #fff; font-size: 18px; text-align: center; padding: 20px 0 30px; } .zcool-logo img { margin-bottom: 10px; display: inline-block; } .passcard-nav { color: #444444; } .passcard-nav .check-zcool-logo { width: 134px; height: 24px; float: left; margin-right: 22px; background: url(../images/logo.svg) no-repeat left top; display: inline-block; vertical-align: middle; *vertical-align: auto; zoom: 1; *display: inline; } .passcard-nav .login-right-subnav { margin-left: 25px; font-size: 14px; float: right; } .passcard-nav .login-nav { color: #666666; } .passcard-nav .login-nav:after { content: ""; display: inline-block; vertical-align: middle; *vertical-align: auto; zoom: 1; *display: inline; width: 1px; height: 14px; margin-top: -4px; background: #666666; margin-left: 20px; } .login-existing-account { float: right; font-size: 14px; color: #666666; } .pass-foot-wrap { margin-top: 30px; } .login-imgsource { text-align: center; font-size: 14px; color: #ffffff; margin-top: 20px; } .footer p { font-size: 12px; color: #999999; text-align: center; margin-bottom: 8px; } .login-footer { margin-top: 32px; } .login-footer p { color: #ffffff; margin-bottom: 0; } .login-footer p:first-child { margin-bottom: 8px; } .account-wrap { padding-top: 30px; } .passcon { min-height: 394px; /* margin: 30px 0; */ border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; background: #ffffff; } .passcon input[name="password"] { padding-right: 40px; } .passcon .passmail-title { height: 76px; line-height: 76px; font-size: 24px; text-align: center; font-weight: normal; border-top-left-radius: 4px; border-top-right-radius: 4px; } .passcon .mail-con-wrap .has-been-sent { font-size: 14px; color: #444444; } .passcon .mail-con-wrap .resend { font-size: 12px; color: #999999; } .passcon .mail-con-wrap .has-been-sent, .passcon .mail-con-wrap .mail-btn { margin-top: 25px; } .passcon .mail-con-wrap .receive-mail-box { margin-top: 36px; margin-bottom: 17px; } .passcon .mail-con-wrap .mail-btn { margin-bottom: 15px; } .passcon .mail-con-wrap .has-been-sent, .passcon .mail-con-wrap .resend { line-height: 22px; } .passcon .mail-con-wrap .expired-mail { margin-top: 30px; color: #444444; font-size: 16px; } .passcon .mail-con-wrap .vermail, .passcon .mail-con-wrap .bannar-mail, .passcon .mail-con-wrap .send-mails { width: 350px; margin: 0 auto; color: #999999; font-size: 12px; text-align: left; } .passcon .mail-con-wrap .vermail { padding-bottom: 16px; } .passcon .mail-con-wrap .bannar-mail a { color: #999999; } .passcon .mail-con-wrap .bannar-mail a:hover { color: #666666; } .passcon .mail-con-wrap .send-mails { margin-top: 8px; } .passcon .enter-zcool-box { margin-top: 50px; } .passcon .receive-mailbtn { display: inline-block; vertical-align: middle; *vertical-align: auto; zoom: 1; *display: inline; width: 336px; height: 42px; text-align: center; line-height: 42px; font-size: 16px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .passcon .failed-txt { line-height: 36px; color: #666666; font-size: 16px; margin-top: 110px; } .passcon .retrieve-pass-box { /* padding: 40px 0 40px; */ border-top: none; } .passcon .retrieve-pass-box .binding-tab { height: 42px; font-size: 20px; line-height: 20px; border-bottom: 1px solid #dedede; text-align: center; } .passcon .retrieve-pass-box .binding-tab span { height: 41px; margin: 0 28px; border-bottom: 2px solid transparent; text-align: center; display: inline-block; vertical-align: middle; *vertical-align: auto; zoom: 1; *display: inline; color: #999999; cursor: pointer; } .passcon .retrieve-pass-box .binding-tab span.curent { color: #333333; border-bottom: 2px solid #333333; } .passcon .retrieve-pass-box .retrie-center { width: 336px; } .passcon .retrieve-pass-box .retrie-center .form-tip { padding: 10px 0; display: block; font-size: 12px; *zoom: 1; } .passcon .retrieve-pass-box .retrie-center .form-tip:after { content: ""; display: table; } .passcon .retrieve-pass-box .retrie-center .form-tip:after { clear: both; } .passcon .retrieve-pass-box .retrie-center .gray-color { color: #999999; } .passcon .retrieve-pass-box .retrie-center .red-color { color: #f75234; } .passcon .retrieve-pass-box .retrie-center .user-name-tip { padding-left: 3px; } .passcon .retrieve-pass-box .retrie-center .unregistered { color: #999999; display: none; } .passcon .retrieve-pass-box .retrie-center .register, .passcon .retrieve-pass-box .retrie-center .registers { color: #666666; } .passcon .retrieve-pass-box .retrie-center .skip { font-size: 14px; line-height: 14px; color: #333333; cursor: pointer; margin-top: 10px; } .passcon .retrieve-pass-box .retrie-center .binding-tips-text { text-align: center; line-height: 14px; font-size: 14px; color: #999999; margin-top: 20px; margin-bottom: 40px; } .passcon .retrieve-pass-box .retrie-center .user-mailbox-register { margin-top: 20px; line-height: 14px; } .passcon .retrieve-pass-box .retrie-center .user-mailbox-register a { font-size: 14px; } .passcon .retrieve-pass-box .retrie-center .forget-pass { margin-top: 10px; font-size: 12px; text-align: right; } .passcon .retrieve-pass-box .retrie-center .bind-account { display: none; } .passcon .retrieve-pass-box .retrie-center .text-wrong-style { border: 1px solid #f75234; background-color: #fdf6f5; } .passcon .retrieve-pass-box .retrie-center .codeeye { left: 8px; top: 16px; } .passcon .retrieve-pass-box .retrie-center .agreemen-txt { font-size: 14px; color: #666666; } .passcon .retrieve-pass-box .retrieve-password { font-size: 20px; line-height: 20px; color: #333333; margin-bottom: 40px; text-align: center; } .passcon .retrieve-pass-box .retrieve-password .three-binding-title { font-size: 20px; color: #333333; } .passcon .retrieve-pass-box .retrieve-password .autobinding-tips { display: block; font-size: 14px; color: #999999; margin-top: 4px; } .passcon .retrieve-pass-box .parent-input-box { position: relative; } .passcon .retrieve-pass-box .intensity { float: right; } .passcon .retrieve-pass-box .intensity i { display: inline-block; vertical-align: middle; *vertical-align: auto; zoom: 1; *display: inline; width: 52px; height: 8px; margin-right: 2px; line-height: 8px; text-align: center; color: #ffffff; font-size: 12px; background: #bbbbbb; border-radius: 50px; float: left; } .passcon .retrieve-pass-box .intensity .bg-red-strength { background: #f4533b; } .passcon .retrieve-pass-box .intensity .bg-yellow-strength { background: #fed109; } .passcon .retrieve-pass-box .intensity .bg-green-strength { background: #58bf4c; } .passcon .retrieve-pass-box .email { background: url(/static/image/envelopesicon.png); } .passcon .retrieve-pass-box .setpassword, .passcon .retrieve-pass-box .tel, .passcon .retrieve-pass-box .username { width: 12px; height: 18px; } .passcon .retrieve-pass-box .email { width: 17px; height: 13px; } .form-eye-icon { display: inline-block; vertical-align: middle; *vertical-align: auto; zoom: 1; *display: inline; width: 22px; height: 22px; position: absolute; cursor: pointer; background-position: center; background-image: url(/static/image/vericodeicon.png); background-repeat: no-repeat; } .disabled-glance { background-image: url(/static/image/disabledglance.png); } .input-normal-style { width: 336px; } .passcon .retrieve-pass-box .transition-time { transition: 0.4s linear; } .passcon .retrieve-pass-box .verification-code { width: 218px; margin-right: 7px; } .passcon .retrieve-pass-box .img-vericode { width: 120px; margin-right: 7px; } .passcon .retrieve-pass-box .codebtn { width: 100px; height: 42px; font-size: 14px; float: right; } .passcon .retrieve-pass-box .vericode-btn { display: inline-block; vertical-align: middle; *vertical-align: auto; zoom: 1; *display: inline; width: 118px; height: 48px; line-height: 48px; text-align: center; border: 1px solid #aaaaaa; background: #ffffff; color: #666666; font-size: 14px; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; float: right; cursor: pointer; display: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .passcon .retrieve-pass-box .passcard-btn, .passcon .retrieve-pass-box .qibtn { width: 336px; font-size: 16px; } .passcon .retrieve-pass-box .bind-num-btn { margin-top: 20px; } .passcon .retrieve-pass-box .verifica-code { position: relative; } .passcon .retrieve-pass-box .verifica-code img { width: 165px; vertical-align: middle; margin-top: -3px; } .passcon .retrieve-pass-box .verifica-code .code-tips { width: 20px; height: 48px; background: url(/static/image/iconver.png) center no-repeat; display: inline-block; vertical-align: middle; *vertical-align: auto; zoom: 1; *display: inline; float: right; cursor: pointer; } .passcon .retrieve-pass-box .deter-mine-btn, .passcon .retrieve-pass-box .return-btn { width: 160px; font-size: 16px; } .passcon .retrieve-pass-box .return-btn { float: right; } .passcon .account-number-tab { height: 42px; border-bottom: 1px solid #eeeeee; text-align: center; } .passcon .account-number-tab span { display: inline-block; vertical-align: middle; *vertical-align: auto; zoom: 1; *display: inline; height: 41px; border-bottom: 2px solid transparent; font-size: 24px; line-height: 24px; color: #999999; margin: 0 29px; cursor: pointer; } .passcon .account-number-tab span.current-status { color: #333333; border-bottom: 2px solid #333333; } .passcon .account-num-box { padding: 40px 80px; } .passcon .account-num-tabcon { *zoom: 1; } .passcon .account-num-tabcon:after { content: ""; display: table; } .passcon .account-num-tabcon:after { clear: both; } .passcon .account-num-tabcon p { margin-top: 28px; *zoom: 1; } .passcon .account-num-tabcon p:after { content: ""; display: table; } .passcon .account-num-tabcon p:after { clear: both; } .passcon .account-num-tabcon p > span { margin-top: -4px; float: left; color: #444444; font-size: 14px; display: inline-block; vertical-align: middle; *vertical-align: auto; zoom: 1; *display: inline; } .passcon .account-num-tabcon p > a { display: inline-block; vertical-align: middle; *vertical-align: auto; zoom: 1; *display: inline; width: 120px; height: 36px; line-height: 36px; float: right; font-size: 14px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin-left: 10px; } .passcon .account-num-tabcon p .account-title { width: 56px; text-align: right; margin-right: 23px; color: #bbbbbb; } .passcon .account-num-tabcon p .account-tips-text { width: 380px; color: #666666; } .passcon .account-num-tabcon .first-line { margin-top: 8px; } .account-binding-box { width: 400px; margin: 0 auto; *zoom: 1; } .account-binding-box:after { content: ""; display: table; } .account-binding-box:after { clear: both; } .account-binding-box .icon-box { line-height: 42px; font-size: 14px; color: #666666; margin-bottom: 30px; display: flex; justify-content: space-between; } .account-binding-box .icon-box .binding-btn, .account-binding-box .icon-box .bound { width: 120px; height: 36px; float: right; font-size: 14px; line-height: 36px; margin-top: 3px; } .account-binding-box .bindtxt { margin-right: 18px; float: right; font-size: 14px; color: #666666; text-align: center; } .account-binding-box .weibo-login, .account-binding-box .wechat-login, .account-binding-box .qq-login { width: 42px; height: 42px; margin-right: 10px; background-repeat: no-repeat; background-position: center; border-radius: 50%; display: inline-block; vertical-align: middle; *vertical-align: auto; zoom: 1; *display: inline; } .account-binding-box .wechat-login { background-image: url("/static/image/wechat.png"); background-color: #53bb4c; } .account-binding-box .weibo-login { background-image: url("/static/image/weibo.png"); background-color: #f4523b; } .account-binding-box .qq-login { background-image: url("/static/image/qq.png"); background-color: #3db0da; } .gt_holder { width: 290px; margin: 0 auto; } .verigy-img-box { margin-bottom: 20px; } .country-phone-covers { border: 1px solid #dddddd; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; *zoom: 1; } .country-phone-covers:after { content: ""; display: table; } .country-phone-covers:after { clear: both; } .phone-area-code-ipt { width: 70px; height: 42px; line-height: 42px; padding-left: 10px; border-radius: 4px 0 0 4px; color: #666666; font-size: 14px; background: #f4f4f4 url(/static/image/shixinjiantou.svg) no-repeat 48px center; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; display: inline-block; float: left; cursor: pointer; } .ipt-area-current { width: 264px; border-radius: 0 4px 4px 0; float: left; border: 0; } .ipt-area-current.ipt-w-334 { width: 334px; } .area-wrap { width: 360px; margin-left: -180px; margin-top: -178px; background: #ffffff; box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.2); position: fixed; left: 50%; top: 50%; z-index: 16; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; } .area-code-covers ul li { margin: 0 30px; height: 40px; line-height: 40px; font-size: 14px; color: #282828; border-bottom: 1px solid #eeeeee; cursor: pointer; } .area-code-covers ul li:last-of-type { border-bottom: 0; } .p-area-code { float: right; } .pop-close { width: 15px; height: 15px; background: url(/static/image/guanbi.svg?v=1) no-repeat; cursor: pointer; display: inline-block; vertical-align: middle; *vertical-align: auto; zoom: 1; *display: inline; position: absolute; right: 30px; top: 20px; } .pop-close:hover { background: url(/static/image/guanbihover.svg) no-repeat; } .js-scroll-covers { height: 300px; overflow: hidden; } .js-hide-country-code { display: none; } #footer { width: 100%; height: 229px; background: #282828; position: absolute; bottom: 0; color: #666666; } #footer .footer-wrapper { height: 100%; margin: 0 auto; background: #282828; } #footer .footer-wrapper .footer-wrapper-top { width: 100%; height: 130px; line-height: 130px; border-bottom: 1px solid #333333; } #footer .footer-wrapper .footer-wrapper-top a:hover { color: #999999; } #footer .footer-wrapper .footer-wrapper-top .footer-wrapper-top-left { float: left; } #footer .footer-wrapper .footer-wrapper-top .footer-wrapper-top-left a { margin-right: 38px; } #footer .footer-wrapper .footer-wrapper-top .footer-wrapper-top-left .footer-mobile { position: relative; } #footer .footer-wrapper .footer-wrapper-top .footer-wrapper-top-left .footer-mobile i { position: absolute; background: url("/static/image/footer-mobile-code.png") no-repeat; width: 122px; height: 131px; bottom: 23px; left: -20px; } #footer .footer-wrapper .footer-wrapper-top .footer-wrapper-top-left .footer-mobile:hover i { display: inline-block; } #footer .footer-wrapper .footer-wrapper-top .footer-wrapper-top-left .footer-mobile:before { content: ""; display: inline-block; background: url("/static/image/footer-mobile.svg?v=1") no-repeat; width: 14px; height: 23px; vertical-align: middle; margin-right: 10px; margin-top: -3px; } #footer .footer-wrapper .footer-wrapper-top .footer-wrapper-top-right { float: right; } #footer .footer-wrapper .footer-wrapper-top .footer-wrapper-top-right .weixin, #footer .footer-wrapper .footer-wrapper-top .footer-wrapper-top-right .weibo { display: inline-block; margin-left: 40px; } #footer .footer-wrapper .footer-wrapper-top .footer-wrapper-top-right .weixin { background-position: 0 0; width: 25px; height: 21px; position: relative; background: url("/static/image/footer-share-weixin.svg?v=1") no-repeat; } #footer .footer-wrapper .footer-wrapper-top .footer-wrapper-top-right .weixin i { position: absolute; background: url("/static/image/footer-weixin-code.jpg") no-repeat; background-size: 110px 110px; -moz-background-size: 110px 110px; -webkit-background-size: 110px 110px; -o-background-size: 110px 110px; width: 110px; height: 110px; bottom: 40px; right: -40px; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; } #footer .footer-wrapper .footer-wrapper-top .footer-wrapper-top-right .weixin i:after { content: ""; border-top: 10px solid #fff; border-right: 10px solid transparent; border-bottom: none; border-left: 10px solid transparent; position: absolute; bottom: -10px; left: 50%; margin-left: -10px; display: block; } #footer .footer-wrapper .footer-wrapper-top .footer-wrapper-top-right .weixin:hover { background: url("/static/image/footer-share-weixinhover.svg?v=1") no-repeat; } #footer .footer-wrapper .footer-wrapper-top .footer-wrapper-top-right .weixin:hover i { display: inline-block; } #footer .footer-wrapper .footer-wrapper-top .footer-wrapper-top-right .weibo { width: 26px; height: 21px; background: url("/static/image/footer-share-weibo.svg?v=1") no-repeat; } #footer .footer-wrapper .footer-wrapper-top .footer-wrapper-top-right .weibo:hover { background: url("/static/image/footer-share-weibohover.svg?v=1") no-repeat; } #footer .footer-wrapper .footer-wrapper-bottom { margin-top: 20px; position: relative; } #footer .footer-wrapper .footer-wrapper-bottom span, #footer .footer-wrapper .footer-wrapper-bottom a { font-size: 12px; } #footer .footer-wrapper .footer-wrapper-bottom i { display: inline-block; width: 1px; height: 12px; margin: 0 26px; background: #666666; vertical-align: middle; } #footer .footer-wrapper .footer-wrapper-bottom .copyrightLink { position: absolute; right: 0; } #footer .footer-wrapper .footer-wrapper-bottom a:hover { color: #999999; text-decoration: underline; } #footer .footer-wrapper .space-footer-bottom { margin-top: 10px; } .p-666 { color: #666666; } .passcon .z-p-covers .verification-code { width: 120px; } .passcon .z-p-covers .codebtn { float: none; } .passcard-btn { height: 42px; } .third-party-covers { margin-top: 32px; line-height: 28px; *zoom: 1; } .third-party-covers:after { content: ""; display: table; } .third-party-covers:after { clear: both; } .third-party-covers > span { float: left; margin-right: 20px; } .pass-account-covers { display: inline-block; } .p-wechat-login, .p-weibo-login, .p-qq-login { width: 28px; height: 28px; margin-right: 14px; display: inline-block; background-color: #ddd; background-repeat: no-repeat; background-position: center; background-size: auto 14px; border-radius: 50%; } .p-wechat-login { background-image: url(/static/image/wechat.png); } .p-wechat-login:hover { background-color: #58bc46; } .p-weibo-login { background-image: url(../images/weibo.png); } .p-weibo-login:hover { background-color: #e90e24; } .p-qq-login { background-image: url(../images/qq.png); } .p-qq-login:hover { background-color: #3caae3; } .p-bottom-tips-covers { margin-top: 18px; } .jump-over-btn { margin-top: 20px; background: transparent; cursor: pointer; } .bind-r-link-cover { color: #999999; } .js-h-from-ele { display: none; } .no-ver-code { color: #282828; line-height: 42px; float: right; cursor: pointer; display: none; } .err-link-tips { color: #d36f16 !important; } .err-tips-ml { margin-left: 8px; } .nc-container .imgCaptcha, .nc-container .clickCaptcha, .nc-container #nc_1_wrapper, .nc-container.tb-login #nc_1_wrapper { width: 100% !important; } @media screen and (max-width: 1600px) { .footer-wrapper { width: 1130px; } .pass-main-body { height: 900px; } } @media screen and (min-width: 1601px) { .footer-wrapper { width: 1380px; } } .passcon .retrieve-pass-box { border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; } .form-eye-icon { right: 10px; top: 10px; } input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill { background-color: #FFFFFF; background-image: none; color: #333; } .pop-up-normal { padding: 0 0 30px; } .pop-up-normal .tips-text-normal { position: static; margin: 0; } .pop-up-normal .tips-text { padding: 30px 30px 0; } .btn-default-main { color: #444444; background: #ffe300; border: 1px solid #ffe300; border-radius: 4px; cursor: pointer; text-align: center; } .btn-default-main:hover { color: #444444; background: #ffd100; border: 1px solid #ffd100; } .btn-default-secondary { color: #666666; background: transparent; border: 1px solid #bbbbbb; border-radius: 4px; cursor: pointer; text-align: center; } .btn-default-secondary:hover { color: #444444; background: transparent; border: 1px solid #999999; } .login-switch .static-l { background: url(/static/image/wx_l.svg) no-repeat; } .login-switch .quick-l { background: url(/static/image/web_l.svg) no-repeat 1px 0; }