@import "cms.css";
/*login*/
body{width: 100%;height: 100%;position: relative;background-size: 100% 100%;background-repeat: no-repeat;background-position: top center}
.header-logo{position: absolute;left: 40px;top: 40px}
.header-logo-item{width: 280px;height: 52px;background-repeat: no-repeat;background-position: left center;position: relative}
.header-logo-item a{display: block;width: 100%;height: 100%;opacity: 0}
.header-title{margin-left: 20px;padding-left: 21px;position: relative;height: 52px;padding-top: 6px;}
.header-title:before{position: absolute;left: 0;top: 50%;width: 1px;height: 36px;margin-top: -18px;content: "";background: #fff}
.header-title span{height: 40px;border: solid 1px #fff;border-radius: 20px;line-height:38px;display: block;padding: 0 20px;font-size: 20px;color: #fff;}
#app{width:100%;height: 100%;}

.login-container{position: fixed;left: 50%;top: 50%;border-radius: 10px;transform: translateX(-50%) translateY(-50%);-webkit-transform: translateX(-50%) translateY(-50%);-moz-transform: translateX(-50%) translateY(-50%);-ms-transform: translateX(-50%) translateY(-50%);max-width: 68.54%;width: 1350px;display: flex;min-width: 1200px;}
.advertising-left{min-width: 52.296%;max-width: 706px;background-size: 100%;flex: 1}
.advertising-ad{width: 100%;height: 100%}
.advertising-ad .el-carousel__container{height: 100%}
.advertising-ad .el-carousel__container button{display: none}
.advertising-ad .el-carousel__item img{max-height: 100%}
.advertising-ad .el-carousel__indicators--horizontal{left: 0;transform: translateX(0);-webkit-transform: translateX(0)}
.login-page{width: calc(100% - 705px);padding: 20px;min-width: 35.518%;max-width: 520px;background: #fff;border-radius: 10px;margin-left: 9%}
.login-form-content{height: 300px;}
.login-form{display: none}
.login-switch{height: 47px;overflow: hidden}
.login-switch-button{background: url(../images/icon_1.png) no-repeat right top;padding-right: 56px;height: 100%;cursor: pointer;}
.login-switch-text{height: 25px;background: url(../images/backg_2.png) no-repeat left center;width: 132px;border-radius: 2px;display: inline-block;padding: 4px 10px;font-size: 12px;color: #738299;line-height: 17px;position: relative;text-align: left}
.login-switch-text i{color: #25c725;float: left;margin-right: 5px;font-size: 14px}
.login-content{width: 340px;margin-top:60px}
.login-content h2{font-size:25px;color: #0088ff;font-weight:normal;line-height: 1;margin-bottom: 25px;}
.login-switch-tab{position: relative;overflow: hidden}
.login-switch-tab:after{position: absolute;left: 0;bottom: 0;width: 100%;height: 2px;background: #f0f2f7;content: ""}
.login-switch-tab span{cursor: pointer;text-align: center;font-size: 18px;color: #a1a6bb;line-height: 36px;padding-bottom: 4px;float: left;width: 50%;float: left}
.login-switch-tab span.active{color: #3a405b;position: relative}
.login-switch-tab span.active:after{position: absolute;left: 0;bottom: 0;width: 100%;height: 2px;background: #0088ff;content: "";z-index: 2}
.login-box{margin-top: 20px;}
.login-block{display:none}
.login-input{border: solid 1px #e3e8f0;height: 48px;margin-bottom: 20px;border-radius: 24px;position: relative}
.login-input.active{border-color: #0088ff}
.login-input i{padding-left: 17px;line-height: 48px;font-size: 20px;color: #b9bed1;width: 50px;float: left}
.login-input input{float: left;width: calc(100% - 90px);height: 46px;border: none;outline: none;font-size: 14px;color: #333;background: transparent}
.login-input input::placeholder{color: #a1a6bb}
.login-input input::-webkit-input-placeholder{color: #a1a6bb}
.login-input input::-moz-placeholder{color: #a1a6bb}
.login-input input::-ms-input-placeholder{color: #a1a6bb}
.login-input.login-input-paw i{font-size: 19px;}
.login-input.login-input-paw em{width: 40px;float: left;line-height: 46px;text-align: center;padding-right: 10px;color: #b9bed1;cursor: pointer}
.login-input.login-input-paw em.seePassword{color: #0088ff;font-size: 20px}
.login-input:focus{border-color: #0088ff}
.login-input .upperCaseTips{position: absolute;top: 46px;left: 0;text-align: center;color: #FFF;background: #1a84fe;display: inline-block;height: 30px;line-height: 30px;padding: 0 12px;z-index: 2;font-size: 14px;border-radius: 10px;display: none;}
.login-input .upperCaseTips:after{position: absolute;left: 15px;top: -8px;width: 0;height: 0;border-left: solid 8px transparent;border-right: solid 8px transparent;border-bottom: solid 8px #0088ff;content: ""}
.login-checkbox{overflow: hidden;font-size: 14px;color: #333333}
.form-check{position: relative;padding-left: 25px;cursor: pointer;font-size: 14px;color: #333}
.form-check input[type=checkbox]{position: absolute;left: 0;top:50%;transform: translateY(-50%);-webkit-transform: translateY(-50%);-moz-transform: translateY(-50%);-ms-transform: translateY(-50%);outline: none;border:1px solid rgba(0,0,0,.25);-webkit-appearance:none;appearance: none;width: 16px;height: 16px;border-radius: 2px;}
.form-check input[type=checkbox]:checked{background: #0088ff url(../images/icon_4.png) no-repeat center;border-color: #0088ff;background-size: 12px;}
.form-check label{cursor: pointer}
.login-checkbox a{color: #a1a6bb}
.login-checkbox a:hover{color: #0088ff}
.login-button{margin-top: 20px;}
.login-button .login-button-submit{height: 50px;width: 100%;background: #0088ff;border-radius: 25px;outline: none;border: none;font-size: 22px;color: #fff;letter-spacing: 5px;cursor: pointer}
.login-way{margin-top: 20px;}
.login-way-qq{line-height: 30px;font-size: 14px;color: #a1a6bb;display: flex}
.login-way-qq .Yc-icon{line-height: 30px;font-size: 30px;color: #61bce9}
.login-register{font-size: 14px;color: #a1a6bb;line-height: 30px;}
.login-register a{color: #2882fe}
.login-input-code{overflow: hidden}
.login-input-code .login-input{width: 60%}
.login-input-code .login-code-button{width: 35%;margin-left: 5%;height: 48px;border-radius: 24px;border: solid 1px #0088ff;line-height: 46px;text-align: center;font-size: 14px;color: #0088ff;cursor: pointer;background: transparent}
.login-input-code .login-code-button.active{background: #f1f7ff;color: #bac3d3}
/*weChat*/
.login-switch-button.active{background: url(../images/icon_5.png) no-repeat right top }
.login-switch-button.active i{display: none}
.login-weChat-title{text-align: center;font-size: 22px;color: #333333;margin-bottom: 20px;line-height: 30px;display: flex}
.login-weChat-title i{color: #25c725;font-size: 30px;margin-right: 10px;}
.login-weChat-text{display: flex;}
.login-weChat-way{overflow: hidden;line-height: 30px;}
/*registered*/
.registered-backdrop{background:#f6fbfe url(../images/backg_3.png) no-repeat bottom center}
.registered-container{position: fixed;left: 50%;top:50%;transform: translateX(-50%) translateY(-50%);-webkit-transform: translateX(-50%) translateY(-50%);-moz-transform: translateX(-50%) translateY(-50%);-ms-transform: translateX(-50%) translateY(-50%);width: 700px;}
.registered-logo{background: url(../images/logo_2.png) no-repeat center;height: 68px;overflow: hidden;margin-bottom: 7vh}
.registered-logo a{opacity: 0;visibility: hidden}
.registered-container .registered-page{border-radius: 10px;box-shadow: 0 0 28px rgba(172,202,255,.5);width: 100%;min-width: 100%;max-width: 100%}
.registered-page .login-switch-title{font-size: 22px;color: #333333;padding-left: 15px;font-weight: normal;position:relative;line-height: 1}
.registered-page .login-switch-title:before{position: absolute;left: 0;top: 50%;width: 3px;height: 25px;margin-top: -11px;content: "";background: #2c8fff}
.registered-content{margin-top: 30px;}
.registered-protocol-link{color: #0088ff !important}
.registered-info{margin-top: 20px;}
/*protocol*/
.protocol-logo{background: url(../images/logo_3.png) no-repeat left center;width:222px;height: 60px}
.protocol-container{position: fixed;left:50%;top: 12%;width: 825px;transform: translateX(-50%);-webkit-transform: translateX(-50%);-moz-transform: translateX(-50%);-ms-transform: translateX(-50%);border-radius: 10px;box-shadow: 0 0 28px rgba(172,202,255,.5);padding: 40px;height: 80%}
.protocol-title{font-size: 22px;color: #333333}
.protocol-title:after{display: block;margin: 10px auto auto;width: 25px;height: 3px;background: #0088ff;content: ""}
.protocol-tab{margin-top: 40px;border-bottom: dashed 1px #dbdbdb;padding-bottom: 25px;margin-bottom: 25px}
.protocol-tab span{display: inline-block;width: 125px;height: 40px;background: #f5f5f5;border-radius: 20px;line-height: 40px;font-size: 16px;color: #333333;cursor: pointer;margin: auto 20px;}
.protocol-tab span.active{background: #0088ff;color: #fff;}
.protocol-content{height: calc(100% - 170px)}
.protocol-block{overflow: hidden;display: none}
.protocol-text{font-size: 14px;color: #333333;line-height: 2}
/*retrieve password*/
.retrieve-switch{height: auto}
.retrieve-content{width: 460px;margin-top: 40px;min-height: 400px}
.retrieve-password-tab{display: flex;width: 100%;margin-bottom: 45px;position: relative;}
.retrieve-password-tab:before{position: absolute;left: 45px;top: 17px;width: calc(100% - 90px);height:3px;background: #ccd2dc;content: ""}
.retrieve-password-tab:after{position: absolute;left: 45px;top: 17px;width: 0;height: 3px;background: #0075ff;content: ""}
.retrieve-password-tab li{flex: 1;position: relative;z-index: 2;}
.retrieve-password-tab li p{display: inline-block}
.retrieve-password-tab li i{width: 36px;height: 36px;border: solid 7px #fff;border-radius: 50%;background: #ccd2dc;line-height: 22px;font-style: normal;display: block;text-align: center;font-size: 14px;color: #fff;margin: auto}
.retrieve-password-tab li span{display: block;font-size: 14px;color: #ccd2dc;}
.retrieve-password-tab.one:after{width: calc(50% - 46px)}
.retrieve-password-tab.two:after{width: calc(100% - 90px)}
.retrieve-password-tab li.active i{background: #0075ff}
.retrieve-password-tab li.active span{color: #0075ff}
.retrieve-password-block{display: none}
.retrieve-password-input{margin-bottom: 50px;overflow: hidden}
.retrieve-password-input span{float: left;width: 125px;font-size: 14px;color: #738299;line-height: 34px}
.retrieve-password-input input{width: calc(100% - 135px);margin-left: 10px;border: none;border-bottom: solid 1px #dddddd;height: 34px;outline: none;padding-left: 10px;font-size: 14px;color: #333;float: left}
.retrieve-password-input input::placeholder{color: #dddddd;}
.retrieve-password-input input::-webkit-input-placeholder{color: #dddddd;}
.retrieve-password-input input::-moz-placeholder{color: #dddddd;}
.retrieve-password-input input::-ms-input-placeholder{color: #dddddd;}
.retrieve-password-code input{width: calc(100% - 255px)}
.retrieve-code-button{width: 100px;float: left;margin-left: 20px;height: 27px;border: solid 1px #a7cfff;border-radius: 2px;background: transparent;line-height: 25px;padding: 0;cursor: pointer}
.retrieve-code-button span{width: 100%;line-height: 25px;color: #4e9fff;font-size: 14px;}
.retrieve-code-button.active{background: #f1f7ff;color: #bac3d3}
.retrieve-code-button.active span{color: #bac3d3}
.retrieve-next-button,.retrieve-password-carry a{width: 260px;height: 40px;background: #0088ff;border: none;cursor: pointer;outline: none;font-size: 22px;color: #fff;margin: auto;display: block;text-align: center}
.retrieve-password-info{text-align: center;font-size: 16px;color: #333333;line-height: 26px;width: 100%;display: flex;margin-bottom: 25px;}
.retrieve-password-info p{display: flex;margin: auto}
.retrieve-password-info i{font-size: 26px;color: #3d9bfc;margin-right: 15px;}
.retrieve-password-text{text-align: center;font-size: 14px;color: #333333;line-height: 2}
.retrieve-password-carry{margin-top: 50px;margin-bottom: 50px;}
/*404*/
.error-container{width: 100%;height: 100%;position: relative;overflow: hidden}
.error-container:before{position: absolute;left: 60px;top:-30px;width: 24px;height: 200px;content: "";background: -webkit-gradient(linear,0% 0%, 0% 100%, from(#EA8D8D), to(#a890de));border-radius: 10px;transform: rotate(-45deg);opacity: .2}
.error-container:after{position: absolute;right:-100px;bottom:-100px;width: 400px;height: 400px;background: #2599ff;border-radius: 50%;content: "";opacity: .05}
.error-content{display: flex}
.error-img{max-width: 400px}
.error-text{padding-left: 50px;}
.error-text h3{font-weight: normal;font-size: 18px;background: linear-gradient(to top, #007991,#78ffd6);-webkit-background-clip: text;color: transparent;font-weight: bold;margin-bottom: 15px;}
.error-text p{color: #333;font-size: 14px;line-height: 2;margin-bottom: 20px;}
.error-link a{display: inline-block;border: solid 1px rgba(56,231,238,1);border-radius: 5px;line-height: 30px;padding: 0 20px;ont-size: 14px;color: #38e7ee}