
.modal-body .login-warp{display:flex;}
.modal-body .signin {background-size: 100%;border:1px solid #ffffff47;width:100%;border-radius: 20px;display: flex;justify-content:center;    position: relative;}
.modal-body .login-logo{width: 200px;position:absolute;left:0px;top: -78px;  height: 0px;}
.modal-body .sign-warp .check-font a{color:#4a95fb}
.modal-body .form-warp .svgimg{width:20px;height:20px;overflow: hidden;position:absolute;top: 30px;left:0px;opacity: 0.8;}
.modal-body .form-warp .svgimg img{width: 100%;height: 100%; filter: drop-shadow(#333 100px 0); transform: translateX(-100px); }
.modal-body .form-warp .password-icon{height:24px;top: 28px;left: 3px;}
.modal-body .form-warp .code-icon{height:24px;top: 28px;left:0px;}


.modal-body .form-tips{color:#fff}
.modal-body .form-warp .password-icon img{width: 80%;height: 80%; }
.modal-body .login-logo img{width:100%}
.modal-body .login-footer {font-size: 12px;width: 100%;position: absolute;left: 0px;bottom: -13px; height: 0px;color: #c9c9c9; text-align: center;opacity: 0.6;}
.modal-body .sign-box{width:90%;height:100%;    position: relative;}

.modal-body .sign-warp{color:#333;position:relative;}
.modal-body .sign-warp .sign-title{text-align: center;padding-top: 28px;}
.modal-body .sign-warp .sign-title .title{font-size:16px;font-weight:bold;}
.modal-body .sign-warp .sign-title a{color:#4a95fb}
.modal-body .sign-warp .sign-title .s-font{font-size:14px;color:#666}
.modal-body .sign-warp .sign-title .s-font .btn-primary{background:transparent;font-size: 14px;padding-top: 6px;color: #4a95fb;}
.modal-body .btn-close{position: absolute;right: -33px;padding: 13px; top: -13px;}
.modal-body .btn-close:focus{box-shadow:none;}
.modal-body .login-tab{padding-top:0px;}
.modal-body .login-tab ul{display:flex;height:40px;justify-content: center;}
.modal-body .login-tab li button{background:transparent;color:#333;border:0px;height:42px;display:block;padding: 0px 9px;}
.modal-body .login-tab li .active{height: 40px;color:#000;font-size:18px;font-weight: bold;}
.modal-body .login-tab li{padding: 0px 14px;}
.modal-body .form-check-input {--bs-form-check-bg: #ffffff;}

.modal-body .web-button{position: relative;    margin-top: 20px;}
.modal-body .web-button .form-tips{top:-37px}

.modal-body .form-warp{margin-top:20px;}
.modal-body .sign-warp .form-group{position:relative;margin-top:12px;padding-bottom:6px;}
.modal-body .form-warp .form-title{font-size:13px;display:block;padding-bottom:6px;opacity:0.8}
.modal-body .form-warp .form-control,
.modal-body .form-warp .form-control:focus,
.modal-body .form-warp .form-control:active{box-shadow:none;outline:none;background:transparent;border-radius:0px;border:none;border-bottom:1px solid #494a55;color:#333;font-size:14px;text-indent: 15px;}
.modal-body .form-warp .form-control:hover{border-bottom:1px solid #fbb92a;}
.modal-body .form-warp .form-control::-moz-placeholder {color: #999;}
.modal-body .form-warp .form-control:-ms-input-placeholder {color: #999;}
.modal-body .form-warp .form-control::-webkit-input-placeholder {color: #999;}

.modal-body .form-warp .form-code{position:relative;display:flex}
.modal-body .form-warp .form-code .code-img{width: 210px;height: 36px}
.modal-body .form-warp .form-code .code-img img {width: 107px;position: absolute; bottom: 0px;    right: 0px}
.modal-body .sign-warp .check-font{position:relative;display:flex;justify-content: space-between;opacity: 0.8;    font-size: 13px;}
.modal-body .form-warp .form-code .code-btn {display: block;margin-left: 30px;background: transparent; border: 1px solid var(--font-theme);border-radius: 6px;font-size: 13px; color: var(--font-theme);padding:8px 0px; width: 140px;}
.modal-body .form-warp .form-code .code-btn[disabled=disabled]{border: 1px solid #373737;color: #828282;cursor: no-drop;}
.modal-body .tab-content .unable{font-size:13px;padding-bottom:30px;opacity: 0.8;}
.modal-body .tab-content .unable span{color:#66dfc6}
.modal-body .tab-content .return-btn{opacity: 0.8;display:flex;justify-content:center;padding:20px;}
.modal-body .tab-content .return-btn button{cursor: pointer;background: transparent;color: #fff;opacity: 0.8;border: 0px;padding: 12px;font-size:13px}
.modal-body .tab-content .return-btn button:hover{opacity:1}
.modal-body .third-login{text-align:center;padding-top:15px;}
.modal-body .third-login .or-line{height: 12px;font-size: 12px;color: #9e9e9e;position:relative;display:flex;}
.modal-body .third-login .or-line:before,
.modal-body .third-login .or-line:after{content: "";border-bottom:1px solid #e5e5e5;width:40%;display: block;flex:1}
.modal-body .third-login .or-line span{font-size: 12px;padding: 0px 12px;position: relative;top: 2px;}
.modal-body .third-login .third-font {font-size: 12px;padding-top: 15px;color: #9a9a9a;}
.modal-body .third-icon{display:flex;justify-content:center;margin-top: 0px;}
.modal-body .third-icon span {width: 30px; background: #fff; border-radius: 4px; margin: 7px;padding: 3px; height: 30px;cursor:pointer;opacity:0.8}
.modal-body .third-icon img{height:80%;width:80%}
.modal-body .third-icon span:first-child img{height:90%;width:90%}
.modal-body .third-icon span:hover{opacity:1}

.modal-body .step ul{margin-top: 34px;display:flex;height: 18px;}
.modal-body .step li{line-height:32px;flex:1;color:#9f9f9f;position:relative;text-align:center;font-size:12px}
.modal-body .step li span{margin:auto;font-size:12px;background: #1e212a;color:#8d8d93;border-radius:40px;line-height:25px;width:25px;height:25px;border:1px solid #494a55;display:inline-block;    margin-right: 10px;}
.modal-body .step .active{color: var(--font-theme);}
.modal-body .step .active span{ background: var(--btn-theme);color: #000;border:1px solid var(--font-theme);}
.modal-body .forgot-success{text-align:center}
.modal-body .forgot-success img{width:90px;display:block;margin:auto;padding: 38px 0px;}
.modal-body .forgot-success .btn { border-radius: 62px;padding: 8px 0px;font-size: 14px;width: 221px;}
.modal-body .btn-top-m{margin-top:18px}
.modal-body .mod-flex {display: flex;align-items: center;justify-content: center;padding: 30px 15px;position: relative;}
.modal-body .mod-flex .svgimg{width: 80px;height: 80px;overflow: hidden;}
.modal-body .mod-flex .svgimg img{width: 100%;height: 100%; filter: drop-shadow(#d19595 100px 0); transform: translateX(-100px); }
.modal-body .mod-flex .mode-title{color:#d19595;font-size: 20px; padding-bottom: 6px;}
.modal-body .mod-flex .mode-cont{color:#7e7e7e}
.modal-body .mod-flex .mode-warp{padding-left:12px}
.modal-body .mod-flex .btn-close {position: absolute;right: 0;padding: 2px; top: 0;}
.modal-body .success-color .svgimg img{filter: drop-shadow(#77b38a 100px 0); }
.modal-body .success-color .mode-title{color: #77b38a;}
.modal-body .warn-color .svgimg img{filter: drop-shadow(#ffb17d 100px 0); }
.modal-body .warn-color .mode-title{color: #ffb17d;}
.modal-body .fail-color .svgimg img{filter: drop-shadow(#d19595 100px 0); }
.modal-body .fail-color .mode-title{color: #d19595;}

/*tips*/
.brief-ok,
.brief-wrong{background: #fff;border-radius: 5px;position:fixed;z-index: 99;;left:50%;top:50%;margin-left:-67px;margin-top:-24px;padding: 9px 21px;box-shadow: 0 12px 24px 0 rgb(175 175 175 / 20%);display: none;}
.brief-ok .brief-warp,
.brief-wrong .brief-warp{display: flex;justify-content: center;align-items: center;font-size: 14px;}
.brief-ok .svgimg,
.brief-wrong .svgimg{width: 30px;height: 30px;overflow: hidden;}
.brief-ok img,
.brief-wrong img{width: 100%;height: 100%; filter: drop-shadow(#77b38a 100px 0); transform: translateX(-100px); }
.brief-ok .brief-cont,
.brief-wrong .brief-cont{color:#77b38a;padding-left:6px}
.brief-ok,
.brief-wrong{opacity:1;animation:myfirst 1s;-moz-animation:myfirst 1s;-webkit-animation:myfirst 1s;-o-animation:myfirst 1s;transform: scale(1);}
@keyframes myfirst
{from {opacity:0.1;transform: scale(0.5);}}
@-moz-keyframes myfirst /* Firefox */
{from {opacity:0.1;transform: scale(0.5);}}
@-webkit-keyframes myfirst /* Safari and Chrome */
{from {opacity:0.1;transform: scale(0.5);}}
@-o-keyframes myfirst /* Opera */
{from {opacity:0.5;transform: scale(0.5);}}
.brief-wrong img{filter: drop-shadow(#f36276 100px 0);}
.brief-wrong .brief-cont{color: #f36276;}