.scanlogin-mask {
    position: fixed;
    z-index: 1500;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.6)
}

.scanlogin-dialog {
    position: fixed;
    z-index: 5000;
    top: 50%;
    left: 16px;
    width: 480px;
    margin: 0 auto;
    right: 16px;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    background-color: #fff;
    text-align: center;
    border-radius: 12px;
    overflow: hidden;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    max-height: 90%
}

.scanlogin-dialog__hd {
    padding: 32px 24px 16px
}

.scanlogin-dialog__title {
    font-weight: 700;
    font-size: 17px;
    line-height: 1.4
}

.scanlogin-dialog__ht {
    padding: 0 24px;
    margin-bottom: 10px;
    font-size: 15px;
    line-height: 1.4;
    word-wrap: break-word;
    -webkit-hyphens: auto;
    hyphens: auto;
    color: rgba(0, 0, 0, 0.5)
}

.scanlogin-dialog__bd {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 0 24px;
    margin-bottom: 32px;
    font-size: 15px;
    line-height: 1.4;
    height: 200px
}

.scanlogin-dialog__ft {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex
}

.scanlogin-dialog__ft:after {
    content: " ";
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    height: 1px;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    color: rgba(0, 0, 0, 0.1);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: scaleY(0.5);
    transform: scaleY(0.5)
}

.scanlogin-dialog__btn {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    flex: 1;
    display: block;
    line-height: 1.41176471;
    padding: 16px 0;
    font-size: 17px;
    color: #014c90;
    font-weight: 700;
    text-decoration: none !important;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    position: relative;
    overflow: hidden
}

.scanlogin-codebox {
    width: 400px;
    margin: 0 auto;
    height: 200px;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.scanlogin-code {
    position: relative;
    width: 160px;
    height: 160px;
    background: #fff;
    border: 2px solid #f2f2f2;
    border-radius: 8px;
    overflow: hidden
}

.scanlogin-code_img {
    width: 100%;
    height: 100%
}

.scanlogin-code_box {
    position: absolute;
    top: 0;
    left: 0;
    background: hsla(0, 0%, 100%, .96);
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center
}

.scanlogin-code_box__hide {
    display: none !important
}

.scanlogin-code_tip {
    border-radius: .1875rem;
    color: #333;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    line-height: 1
}

.scanlogin-code_tip__icon {
    height: 37px;
    width: 37px;
    background-size: cover;
}

.scanlogin-code_tip__icon.error {
    color: #f48800 !important;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACUAAAAlCAYAAADFniADAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQyIDc5LjE2MDkyNCwgMjAxNy8wNy8xMy0wMTowNjozOSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo4RDZCNTNGOTk2MDExMUVDODJGRkNEMjA0MDc2MTk2NyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo4RDZCNTNGQTk2MDExMUVDODJGRkNEMjA0MDc2MTk2NyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjhENkI1M0Y3OTYwMTExRUM4MkZGQ0QyMDQwNzYxOTY3IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjhENkI1M0Y4OTYwMTExRUM4MkZGQ0QyMDQwNzYxOTY3Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+03ugCgAAAt5JREFUeNrMmGuIDWEYx2dmD2uzKMpKtiy5fFAuIdelNvmilC/klqyShCgpKZsvbCnWLYSjFMkH95BPq3aLWtdEhJKs60r21Fra4/fYZ2uMOefMOzN15l+/2nfOznv+53lvz/vY7XusMBoFU2A4jIURUAq/4S28gFfwUMmpvtuy/z1LGRjpA0thEcyV/nL83zTX32KyCa7BafgS5IuCmCqBtbAOxhlGVPqfo2yCk9AA3/K95BTodDTcgsMhDHk1DHbCHagOa2o+NEKNFa/kx93U6BuZWgmXYEiAL5GZulfn2g7IBHinDI5Cnd+Hts/qmwfXoVfAX74btrvaqyBtELn1rMAj+SI1Es4YGBJd9bSvQJvB+/sz9XZNLlO94QRUGM6RDk+70+dZPkkA0hir8DO1WvcfUzk+bduwj0qdj/90WKb7SDG1gmhVuU0t0eOimBoAG9ymFlvJ0EKi1c/Rw3VWQkzJwV4tpqbmOVyLocliqspKliaIqTEJM1Xp6DgmSX8nemnETrIF2qYqcTQ7jCLbx5QTob8uR3PqSBPTJ18aGKG/TEqT/Ciqh+9wV1fyccMsw6sPKb11RNEguADtUB7DRH8gw9cCv2LorDym1XdfTD2GewnZDj7JvaBnlVyMocM4on2D1Phzjym5KL4P2dE7TX3GwzJth9FPOOhOXb7qqgmzcW6B8/AMzsLWkBvoZaLU4k1lD8DzEPl5s+dZs+bpJpKVu8svv5ar9BrDpF/qCzM8z6brJcREG4nS01y1hCbN1Y8ZHDGHdLgeSS4kVybDi0MDhtKFChwyt4bqvT+IBuvm2aGRM5HMwc1Br+11msR3Gg6liSSiy4lS1qTAIcOyAN7EvEHKOVmrEcqGKQXdhpm6f7RFNCP70DmYDaei1KdErbI6rO5y4j54aWimVQseYkYqgU8KvWBSXnytG6UsACl6TYKJeuXub3VX/LrgB3yUg1VXZKOeaYH1R4ABAJ43l7hhL6p1AAAAAElFTkSuQmCC");
}

.scanlogin-code_tip__icon.success {
    color: #07c160 !important;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACUAAAAlCAYAAADFniADAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQyIDc5LjE2MDkyNCwgMjAxNy8wNy8xMy0wMTowNjozOSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpCMUJDQUI2OTk2MDExMUVDQjlGNERBMDIyNTQxNkFERCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpCMUJDQUI2QTk2MDExMUVDQjlGNERBMDIyNTQxNkFERCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkIxQkNBQjY3OTYwMTExRUNCOUY0REEwMjI1NDE2QUREIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkIxQkNBQjY4OTYwMTExRUNCOUY0REEwMjI1NDE2QUREIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+Y9nQvwAAAzpJREFUeNrEmFtIFFEYx9dpM1Ozt+rBoCK6vhSI9VBbRHSnO13QqKCgwG7PUVL0UlBUWgQZRhRk0QWMZCOKdaEeBO1GD5EUBYWVW+YWdrP+X/wHtunMzDmzjv7hB3pmzs6f78z5vu9MzoDEhkgAjQUlYAQYD0aCPPADvALPQCt4AFq8fqgrVvvfWNTAyEBQBpaDGSDf5b4pGX//AvfADSBPf6/zIB1T/cAWsBVMNIyozJ1OttHYUZDymmRpLNMtUB3AkFPFYA9IgplBTc0DCTAr0rOaABoYeSNT68E1MDQSjmRTnAT7dE3NBac5MWztzWvcWOFnajQ4B/pHek9HYGy2m6lcUAOGRHpXEoBaGBumMrWJ+acvZO/Mf0xJItzeCw//Al66XCtHtEZlmlrLnBSmJN+VMt+tA18d14vswNimVoVs6C5YDZ7SzHluKKeWIFpFYmoMmBaiIal7K8Anx/gLxb1S4GNRhjTf40fjUszBggCpIs5XI+0YHwzc2pMSi22HSj/BZpabpSRtYOiOiyFJPRfY8qg0yfJ4wZ8wb9m6CRaBdg1D9WxxPjrGZUWugoUec4d7RSpXMSYFepniYZm6zQh1OMYLwSUfQ6JBlkeNGwd2K8aTXMp2lwitZD5yRuiKhqG/PZjFd8etWB8AFYprjYxYymFIFaECRmiO5rvYbbGn9lIVu0a3iH3mspYpIiQJ8bJmhGylo2zy/XScPfohhbEYeA06FRG6COYbppG2KE8dOjrIbFztGH+ouLeAETI1JGqR5Wvm0UhHspS7fO4pzMKQqNni2azJpCnzMGZv+6CG5AiWsAvydcPJhxW7UrZ9XRaGRA04nL6zTcl57K3B5BwupURtKndXnPUxqL7Z76tt6gMPC6aSZbzPTiDbTqMeUWpytsPHNNNDGJKivV/Vo6fYp3f1gamdiNJjtyNWUmPL97SqYOiM32H0VGYoQ5Zk/B26x/ZKNvHfQzQkpasMUfpt8oFDtvxil146G3Wwo5UIdQf5FBTnVj/h09jp5qE6FvCabL5Pid4we5fyg1eroZk2cJan7zXgkd8Ek8+Lz7kzK/mAyaSYfVOUy9FJIy2sqwn+r60/AgwAzem3ZNnVCukAAAAASUVORK5CYII=");
}

.scanlogin-code_tip__text {
    color: #333;
    font-size: 14px;
    line-height: 22px;
    margin: 0;
    margin-top: 16px;
    text-align: center
}

.scanlogin-code_tip__link {
    text-decoration: none;
    color: #e06b03
}

.scanlogin-img {
    width: 150px;
    height: 200px;
    background: url(scanloginpic.png?t=2) no-repeat;
    background-size: 100%
}