:root{ --maincolor:#5aaaff; /*#e8f3ff; #9ccdff; #5aaaff */}
html,body {height: 100vh;padding: 0;margin: 0;display: flex;flex-direction: column;font-family: "微软雅黑";}
.layout {width: 100vw;height: 100vh;margin: 0;padding: 0;display: flex;flex-direction: column;color: #003377;background: #fff;}
.layout a,.layout a:hover,.layout a:link{text-decoration: none;}
.layout img {vertical-align: middle;border: 0;}
.layout label {display: inline-block;margin-bottom: 5px;}
.layout ul { margin-top: 0; }
.mask{position: fixed;left: 0;right: 0;top: 0;bottom: 0;z-index: 1099;}

::-webkit-scrollbar{  width: 10px }
::-webkit-scrollbar-thumb{  background: rgba(0,0,0,0.1) }
::-webkit-scrollbar-thumb:window-inactive{ background: rgba(255, 0, 0, 0.4) }

.empty-block{
    align-items: center;
    color: rgb(96, 98, 102);
    display: flex;
    font-family: Avenir, Helvetica, Arial, sans-serif;
    font-size: 14px;
    height: 140px;
    justify-content: center;
    min-height: 60px;
    text-align: center;
}
.empty-text{
    color: rgb(144, 147, 153);
    display: block;
    font-family: Avenir, Helvetica, Arial, sans-serif;
    font-size: 14px;
    height: 140px;
    text-align: center;
}
.empty-icon{
    background-attachment: scroll;
    background-clip: border-box;
    background-color: rgba(0, 0, 0, 0);
    background-image: url(/pictures/empty.png);
    background-origin: padding-box;
    background-position-x: 0%;
    background-position-y: 0%;
    background-size: 100% 100%;
    color: rgb(144, 147, 153);
    display: block;
    font-family: Avenir, Helvetica, Arial, sans-serif;
    font-size: 14px;
    font-style: italic;
    height: 60px;
    margin-bottom: 0px;
    margin-left: 369.75px;
    margin-right: 369.75px;
    margin-top: 50px;
    text-align: center;
    width: 60px;
}

/*包裹*/
.packe {flex: 1;display: flex;flex-flow: column;align-items: stretch;overflow: hidden;}

/*载入*/
.loading{position:fixed; left:0; top:0; font-size:1rem; z-index:100000000;width:100%; height:100%; background:#fff; text-align:center;}
.loadbox{position:absolute; width:160px;height:150px;font-size:1rem; color: #54555a; left:50%; top:50%; margin-top:-100px; margin-left:-75px;}
.loadbox img{ margin:10px auto; display:block; width:40px;height:auto}

/*头部*/
.head{ position: relative;margin: 1rem;	border-radius: 0 0 1rem 1rem;background: #e4ecf5;box-shadow: #99c2eb70 4px 4px .4rem .1rem;}
.head .leftbar{width: 34rem;background: linear-gradient(45deg, #cac9f2, #8edafa,#cac9f2);padding: .3rem;overflow: hidden;white-space: nowrap;min-width: 34rem;border-radius: 0 0 0 1rem;}
.head .leftbar::after{background: #bacdf4;content: '';z-index: 1; transform:skewX(-40deg);border-radius: 0 0 .5rem 0;box-shadow: #99c2eb20 4px 4px .4rem .1rem;position: absolute; top:0;left: calc(34rem - 3rem);; width: 6rem;height: 100%;}
.head h1{ color:#003377; text-align: left; font-size: 2.4rem;font-weight: bold; letter-spacing: .05rem;margin:0 0 0 1rem;}
.head h1 img{ width:7rem; display: inline-block; vertical-align: middle; margin-right: .2rem}
.head .usertip{ height: 100%;line-height: 4;position: absolute;right: 1rem; }
.head .usertip .item {margin-left:.5rem;cursor: pointer;}
.head .mqr {display: none; position: absolute;z-index: 99;box-shadow: #aaaeb361 0 0 5px 5px;border-radius: 10px;padding: 10px;background: white;}

/*菜单*/
.menu{ font-size: 1rem;color: #c6dcf7;display: -webkit-inline-box;margin: 0 5rem;position: relative;padding: .5rem 0;-webkit-box-align: center;border-bottom: 2px solid var(--maincolor);transform: skewX(-40deg);}
.menu .wrap {cursor: pointer;color: var(--maincolor);border-radius: 3px;width: 7.5rem;height: 1.8rem;display: block;margin: 0 .7rem;}
.menu .wrap:first-of-type{margin-left: 0;}
.menu .wrap:last-of-type{margin-right: 0;}
.menu .wrap:hover{color: #003377;}
.menu .item {line-height: 1.6rem;border: 1px dashed transparent;border-radius: 2px;transform: skewX(40deg);}

/*内容*/
.maincontent {padding: 0;transition: margin-left 0.3s ease;flex: 1;display: flex;flex-direction: column;align-items: stretch;overflow: hidden;}

.progressback{ position: absolute; top: 35%; left: 35%; width: 30%; padding: 30px 20px; background: #d5d7d7; border: 1px solid #fcfcfc; display: none; }

@media (max-width: 1660px) {.usertip { display: none;}}
@media (max-width: 1360px) {.menu { display: none;}}
@media(min-width: 1660px){.usertip{display:flex; }}