@charset "utf-8";
*{margin:0; padding:0;outline: 0;}
a{color:#222; text-decoration:none;}
ol,li,ul,dl,dt,dd{list-style:none;}
button,input,select,textarea {vertical-align:middle;outline: 0;}
table{border-collapse:collapse; border-spacing:0;}
select,button{outline-style:none; outline-width:0pt; padding: 0; margin: 0;}
input:-webkit-autofill {transition:background-color 5000s ease-in-out 0s; background-color: #fff;}
@font-face{font-family: '方正粗谭黑简体';src : url('../../fonts/方正粗谭黑简体.ttf');} 
@font-face{font-family: 'AlibabaSans';src : url('../../fonts/AlibabaSans-Regular.otf');}
@font-face {font-family: 'iconfont';src: url('../../icon/iconfont.eot');src: url('../../icon/iconfont.eot?#iefix') format('embedded-opentype'),url('../../icon/iconfont.woff2') format('woff2'),url('../../icon/iconfont.woff') format('woff'),url('../../icon/iconfont.ttf') format('truetype'),url('../../icon/iconfont.svg#iconfont') format('svg');}
body{font:12px "AlibabaSans","iconfont";font-weight: normal;color:#333; -webkit-font-smoothing: antialiased;}

/* 公共样式 */
    .none {
        display: none;
    }
/* 公共样式 */

/* 加载模块 */
    #loading-wrapper {position: fixed;top: 0;left: 0;right: 0;bottom: 0;background: rgba(0,0,0,.5);z-index: 1000;}
    #loading {width: 100%;height: 100%;display: flex;align-items: center;justify-content: center;}
    #loading .text {font-size: 18px;color: #fff;}
    #loading .many-load {position: relative;width: 80px;height: 80px;z-index: 1000;min-height: 100px;}
    #loading .sk-circle {width: 38px;height: 38px;position: absolute;top: 50%;left: 50%;margin: -19px 0 0 -19px;}
    #loading .sk-circle:before {content: '';display: block;margin: 0 auto;width: 1px;height: 8px;background-color: #fff;border: 1px solid #fff;-webkit-animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;animation: sk-circleFadeDelay 1.2s infinite ease-in-out both; }
    #loading .sk-circle2 {-webkit-transform: rotate(30deg);-ms-transform: rotate(30deg);transform: rotate(30deg); }
    #loading .sk-circle3 {-webkit-transform: rotate(60deg);-ms-transform: rotate(60deg);transform: rotate(60deg); }
    #loading .sk-circle4 {-webkit-transform: rotate(90deg);-ms-transform: rotate(90deg);transform: rotate(90deg); }
    #loading .sk-circle5 {-webkit-transform: rotate(120deg);-ms-transform: rotate(120deg);transform: rotate(120deg); }
    #loading .sk-circle6 {-webkit-transform: rotate(150deg);-ms-transform: rotate(150deg);transform: rotate(150deg); }
    #loading .sk-circle7 {-webkit-transform: rotate(180deg);-ms-transform: rotate(180deg);transform: rotate(180deg); }
    #loading .sk-circle8 {-webkit-transform: rotate(210deg);-ms-transform: rotate(210deg);transform: rotate(210deg); }
    #loading .sk-circle9 {-webkit-transform: rotate(240deg);-ms-transform: rotate(240deg);transform: rotate(240deg); }
    #loading .sk-circle10 {-webkit-transform: rotate(270deg);-ms-transform: rotate(270deg);transform: rotate(270deg); }
    #loading .sk-circle11 {-webkit-transform: rotate(300deg);-ms-transform: rotate(300deg);transform: rotate(300deg); }
    #loading .sk-circle12 {-webkit-transform: rotate(330deg);-ms-transform: rotate(330deg);transform: rotate(330deg); }
    #loading .sk-circle2:before {-webkit-animation-delay: -1.1s;animation-delay: -1.1s; }
    #loading .sk-circle3:before {-webkit-animation-delay: -1s;animation-delay: -1s; }
    #loading .sk-circle4:before {-webkit-animation-delay: -0.9s;animation-delay: -0.9s; }
    #loading .sk-circle5:before {-webkit-animation-delay: -0.8s;animation-delay: -0.8s; }
    #loading .sk-circle6:before {-webkit-animation-delay: -0.7s;animation-delay: -0.7s; }
    #loading .sk-circle7:before {-webkit-animation-delay: -0.6s;animation-delay: -0.6s; }
    #loading .sk-circle8:before {-webkit-animation-delay: -0.5s;animation-delay: -0.5s; }
    #loading .sk-circle9:before {-webkit-animation-delay: -0.4s;animation-delay: -0.4s; }
    #loading .sk-circle10:before {-webkit-animation-delay: -0.3s;animation-delay: -0.3s; }
    #loading .sk-circle11:before {-webkit-animation-delay: -0.2s;animation-delay: -0.2s; }
    #loading .sk-circle12:before {-webkit-animation-delay: -0.1s;animation-delay: -0.1s; }
    @-webkit-keyframes sk-circleFadeDelay {0%, 39%, 100% {opacity: 0;}40% {opacity: 1; } }
    @keyframes sk-circleFadeDelay {0%, 39%, 100% {opacity: 0; }40% {opacity: 1; } }


    .circle-box {width: 100%;height: 100%;min-width: 100px;min-height: 100px;display: flex;justify-content: center;align-items: center;margin: 0 auto !important;}
    .circle-box span {padding-right: 40px;}
    .circle-cont {width: 60px;height: 60px;position: relative;-webkit-animation: circlebox 1.5s linear infinite normal;animation: circlebox 1.5s linear infinite normal;}
    @-webkit-keyframes circlebox {0%{    transform: rotateZ(360deg);}100% {    transform: rotateZ(0deg);}}
    @keyframes circlebox {0%{    transform: rotateZ(360deg);}100% {    transform: rotateZ(0deg);} }
    .circle-cont:before{content: "";position: absolute;width: 22px;height: 22px;border-color: #1E90FF #1E90FF transparent transparent;border-width: 2px 0 0 2px;border-style: solid;border-radius: 50%;top: 50%;left: 50%;transform: translate(-50%, -50%);}
    .circle-cont:after{content: "";position: absolute;width: 22px;height: 22px;border-color: transparent transparent #1E90FF #1E90FF;border-width: 0 2px 2px 0;border-style: solid;border-radius: 50%;top: 50%;left: 50%;transform: translate(-50%, -50%);}


/* 加载模块 */

/* 提示框 */
    .alert-msg {
        position: fixed;
        z-index: 99999;
        background: rgba(0,0,0,.7);
        color: #fff;
        border-radius: 3px;
        top: 50%;
        left: 50%;
        padding: 10px 20px;
        transform: translate(-50%, -50%) scale(0.5,0.5);
        font-size: 14px;
        -webkit-animation: msg 3s linear;
        animation: msg 3s linear;
    }
    @-webkit-keyframes msg {
        0% {
            opacity: 0.3;
            transform: translate(-50%, -50%) scale(0.5,0.5);
        }
        5% {
            opacity: 1; 
            transform: translate(-50%, -50%) scale(1,1);
        }

        95% {
            opacity: 1; 
            transform: translate(-50%, -50%) scale(1,1);
        }
        100% {
            opacity: 0.3;
            transform: translate(-50%, -50%) scale(0.5,0.5);
        }
    }
    @keyframes msg {
        0% {
            opacity: 0.3;
            transform: translate(-50%, -50%) scale(0.5,0.5);
        }
        5% {
            opacity: 1; 
            transform: translate(-50%, -50%) scale(1,1);
        }

        95% {
            opacity: 1; 
            transform: translate(-50%, -50%) scale(1,1);
        }
        100% {
            opacity: 0.3;
            transform: translate(-50%, -50%) scale(0.5,0.5);
        }
    }
/* 提示框 */

/* 提示删除框 */
    .alert-del {position: fixed;z-index: 99999;background: #fff;border-radius: 3px;top: 50%;left: 50%;padding: 10px 20px;transform: translate(-50%, -50%) scale(1,1);font-size: 14px;width: 250px;height: 150px;border: 1px solid #ccc;-webkit-animation: del 0.3s linear normal;animation: del 0.3s linear normal;}
    @-webkit-keyframes del {0% {    opacity: 0.3;    transform: translate(-50%, -50%) scale(0.5,0.5);}100% {    opacity: 1;     transform: translate(-50%, -50%) scale(1,1);}}
    @keyframes del {0% {    opacity: 0.3;    transform: translate(-50%, -50%) scale(0.5,0.5);}100% {    opacity: 1;     transform: translate(-50%, -50%) scale(1,1);}}
    .alert-del-title {position: absolute;top: 0;left: 0;right: 0;height: 36px;display: flex;padding: 0 10px 0 15px;background: #000;color: #fff;align-items: center;font-size: 14px;}
    .alert-del-title > span {margin-left: auto;font-size: 26px;cursor: pointer;}
    .alert-del-text {position: absolute;top: 40px;left: 0;right: 0;bottom: 40px;display: flex;align-items: center;justify-content: center;}
    .alert-del-btn {position: absolute;left: 0;right: 0;bottom: 0;height: 40px;display: flex;align-items: center;justify-content: flex-end;border-top: 1px dashed #efefef;}
    .alert-del-btn > div {margin: 0 10px;width: 60px;height: 25px;line-height: 25px;text-align: center;cursor: pointer;}
    .alert-del-btn > div:first-of-type{border: 1px solid #ccc;}
    .alert-del-btn > div:last-of-type{border: 1px solid #1D86D9;background: #1D86D9;color: #fff;}
    .alert-del-btn > div:first-of-type:hover{border: 1px solid #1D86D9;background: #1D86D9;color: #fff;}
    .alert-del-btn > div:first-of-type:hover + div:last-of-type{border: 1px solid #ccc;background: #fff;color: #222;}
/* 提示删除框 */

/* 提示框 */
    #msgAlert {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 999999;
    }
    #msgAlert .box {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background: #fff;
        box-shadow: 0 0 10px #aaa;
        border-radius: 3px;
    }
    #msgAlert .box .t {
        height: 34px;
        background: #1E78BE;
        color: #fff;
        text-align: center;
        line-height: 34px;
        font-size: 14px;
        font-weight: bold;
    }
    #msgAlert .box .x {
        padding: 40px 60px;
        font-size: 14px;
        min-width: 200px;
        text-align: center;
    }
    #msgAlert .box .but {
        display: flex;
        justify-content: center;
        padding-bottom: 15px;
    }
    #msgAlert .box .but div{
        width: 66px;
        height: 28px;
        line-height: 28px;
        text-align: center;
        font-size: 12px;
        cursor: pointer;
        user-select: none;
        margin: 0 15px;
    }
    #msgAlert .box .but .n {
        border: 1px solid #ccc;
        color: #888;
    }
    #msgAlert .box .but .y {
        border: 1px solid #1E78BE;
        background: #1E78BE;
        color: #fff;
    }

/* 提示框 */

/* 截图 */
    #cropper {position: fixed;top: 0;left: 0;right: 0;bottom: 0;background: rgba(0,0,0,.3);z-index: 1000;}
    #cropper .box {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);background: #fff;box-shadow: 0 0 10px #f1f3f4;border: 2px solid #009688;}
    #cropper .box .title {height: 40px;display: flex;align-items: center;background: #009688;padding: 0 20px;font-size: 16px;color: #fff;}
    #cropper .box .title .del {margin-left: auto;cursor: pointer;user-select: none;font-size: 20px;}
    #cropper .box .img{border: 1px dashed #009688;margin: 30px 100px;width: 400px;height: 300px;background: #f8f8f8;}
    #cropper .box .img img {display: block;}
    #cropper .box .btn {height: 60px;display: flex;justify-content: center;align-items: center;}
    #cropper .box .btn div {width: 80px;height: 27px;font-size: 12px;text-align: center;line-height: 26px;margin: 0 20px;cursor: pointer;user-select: none;border: 1px solid #009688;}
    #cropper .box .btn div:first-of-type {color: #009688;}
    #cropper .box .btn div:last-of-type {color: #fff;background: #009688;}
    #cropper .box .btn div:first-of-type:hover{color: #fff;background: #009688;}
    #cropper .box .btn div:first-of-type:hover + div:last-of-type {color: #009688;background: #fff;}
/* 截图 */