html,body{
        overflow: hidden;
        background-color: #F4F9FD;
        width: 100vw;
        height: 100vh;
    }
     .index-head{
         display: flex;
         display: -webkit-flex;
         justify-content: space-between;
         -webkit-justify-content: space-between;
         width: 100vw;
         height:8.2rem;
     }
    .index-head-left{
        width: 10rem;
        height: 6rem;
        line-height: 6rem;
        font-size: 2rem;
        font-weight: bold;
        color: #000;
        text-align: center;
        display: inline-block;
    }
    
   
    
    .index-head-right{
        position: relative;
        width: calc(100% - 22rem);
        height: 8.2rem;
    }
    
     .index-head-right >.index-seach{
        position: absolute;
        left:22rem;
        top:.5rem;
        width: 30rem;
        height:4rem;
        outline-color: #3eede7;
        border:1px solid #fff;
        border-radius: 1rem;
        padding-left: 1rem;
    }
     
    .index-head-right >input:hover{
         border:1px solid  #3eede7;
    }
    
     .index-head-right-a{
         display: flex;
        display: -webkit-flex;
        justify-content: flex-end;
        align-items:center;
        width: auto;
        max-width:100%;
        height: 5rem;
    }
    
     .index-head-right-b{
         display: flex;
        display: -webkit-flex;
        justify-content: space-between;
       -webkit-justify-content:space-between;
        align-items:center;
        width:100%;
        height: 3.1rem;
        line-height: 3rem;
          background-color: #f9f9f9;
          border-bottom:.1rem  solid #ccc;
    }
     .index-head-right-b-a{
         display: flex;
        display: -webkit-flex;
        align-items:center;
        width:calc(100%  - 20rem);
        height: 3rem;
        line-height: 3rem;
    }
    
     .index-head-right-b-b{
         display: flex;
        display: -webkit-flex;
        justify-content: flex-end;
        align-items:center;
        width:18rem;
        height: 3rem;
        line-height: 3rem;
    }
  

    .tabs{
        width: auto;
        height: 100%;
        color: #808080;
        cursor:pointer;
        font-size: 1.6rem;
        padding:0 1rem 0 .3rem;
        border-left: 1px solid #fff;
        border-top-right-radius:2rem;
    }

     .tabs-active,.tabs-active span{
    background-color:  rgba(66,195,175,1) !important;
    color: #fff;
    }
    
      .tabs:hover{
        background-color:rgba(66,195,175,0.5);
        color: #fff !important;
    }
    .tabs-close{
        margin-left: .3rem;
        display: inline-block;
        font-size: 1.8rem;
        width: 2rem;
        height: 2rem;
        line-height: 2rem;
        text-align: center;
        border-radius: 2rem;
        background-color: #999;
        color:#fff;
    }
     .tabs-close:hover{
         font-size: 2rem;
         font-weight: bold;
         color: red !important;
     }
     
    .index-nav{
        width: 8rem;
        height: 4rem;
        line-height:4rem;
        text-align: center;
        font-size:1.6rem;
        margin-right: .5rem;
    }
     .index-body{
          display: flex;
         width: 100%;
         height:calc(100vh  -  8.2rem);
     }
      .index-left{
          flex-shrink: 0;
          width: 22rem;
           height:100%;
      }
      
          .index-right{
             position: relative;
            flex: 1;
            padding:2px;
            height:100%;
            background-color: #f1f1f1;
            overflow:hidden;
      }
      #app .page-container{
          width:calc(100vw - 22.5rem);
          height:100%;
     }
      .sub-page{ /*跟page-containe 同一个容器 这个主要是用于打开子页面背景色*/
     background: rgba(0,0,0,0.5);
     z-index: 99999;
     }
      .flex-layout{
           width:100%;
           height: 100%;
           display: flex;
            flex-direction: column;
            background-color: #fff;
            overflow-y:auto;
         }
    #app .page-main{
        flex: 1;          /* 占据主要空间 */
    overflow: auto;   /* 内容多时滚动 */
    min-height: 0;    /* 重要：允许收缩 */
    }     

   #app .page-footer{
        margin-top: auto;
   }
      .index-iframe{
          width:100%;
          height:calc(100% - 3rem);
          margin: 0;
          padding: 0;
      }
      .index-footer{
          width: 100%;
          height: 3rem;
          line-height: 3rem;
          text-align: center;
          
      }
      
      
      .index-left-left{
          width: 10rem;
          height: 100%;
          border-right: 1px solid #f1f1f1;
      }
      
      .index-menu{
          width: 100%;
          height: 5rem;
          line-height: 5rem;
          text-align: center;
          font-size: 1.6rem;
          border-radius: .5rem;
          margin-bottom:.5rem; 
          background-size: 1.6rem  1.6rem;
          background-position: 1.5rem center;
          background-repeat: no-repeat;
          color: #111;
      }
      .icon-main{
          background-image: url(/image/icon/main.png);
      }
      
         .icon-smaper{
          background-image: url(/image/icon/smaper.png);
      }
         .icon-goods{
          background-image: url(/image/icon/goods.png);
      }
         .icon-shop{
          background-image: url(/image/icon/shop.png);
      }
         .icon-anchor{
          background-image: url(/image/icon/anchor.png);
      }
         .icon-order{
          background-image: url(/image/icon/order.png);
      }
         .icon-work{
          background-image: url(/image/icon/work.png);
      }   .icon-operate{
          background-image: url(/image/icon/operate.png);
      }
        .icon-finance{
          background-image: url(/image/icon/finance.png);
      }
        .icon-set{
          background-image: url(/image/icon/set.png);
      }
      
      
      .index-left-child{
          position: absolute;
          top:8.2rem;
          left:10rem;
          width:auto;
          padding-bottom: 1rem;
          display: none;
          height: 45rem;
          background-color:#fff;
      }
      
      .index-left-child >div{
          width: 10rem;
          margin: 1rem 1rem 0 1rem;
          height: 4rem;
          line-height: 4rem;
          overflow-x: hidden;
          font-size: 1.5rem;
          text-indent:.3rem;
          
      }
      
      .index-left-child-div-active{
          background-color: rgba(66,195,175,1);
          border-radius: 1rem;
          color: #fff;
      }
      
      .index-menu-active{
          background-color: rgba(66,195,175,0.4);
          color: #fff;
      }
      
    .index-left-child>div:hover,.index-menu:hover,.index-head-left:hover{
     background-color: rgba(66,195,175,0.4);
     color: #fff;
     cursor:pointer;
 }
 
 .index-nav{
     width: auto;
     padding: 0 .5rem 0 .5rem;
     height: 5rem;
     line-height:5rem;
     text-align: center;
     margin-right:2rem;
     color: #353535;
     margin-bottom:.2rem;
 }
 
 .index-nav:hover{
     border-bottom: 2px solid #009966;
     color: #009966;
 }
 .index-nav-active{
      border-bottom: 2px solid #009966;
     color: #009966;
 }
 .index-nav>span{
     background-color: red;
     border-radius:.5rem;
     display: inline-block;
     min-width: 2rem;
     width: auto;
     height:auto;
     line-height:2rem;
     color: #fff;
     font-size: 1.2rem;
     padding:0 .3rem  0 .3rem ;
     margin-left:3px;
 }
 
 .index-nav>img{
     width: 4rem;
     height: 4rem;
     border-radius: 100%;
 }
 
 .user-annexP{
      display: flex;
        display: -webkit-flex;
        align-items:center;
 }
 .user-annexP span{
     background-color: #F4F9FD;
     color: #353535;
     font-size: 1.4rem;
 }
 
 .user-annex{
     position: absolute;
     top:4rem;
     right:1rem;
     width: 10rem;
     height: auto;
     border: 1px solid #ccc;
     z-index: 999999;
     display: none;
     color:#353535;
 }
 .user-annexP:hover .user-annex{
  display: block;
}
 
 .user-annex >div{
     border-bottom: 1px solid #ccc;
     height: 4rem;
     line-height: 4rem;
     text-align: center;
    background-color: #f9f9f9;
 }
 
 .user-annex >div:hover{
     background-color: #ccc;
 }
 
 
 .index-left-child-data{
       position: absolute;
       top:36rem;
        left:10rem;
        padding-bottom: 1rem;
        display:block;
     width: 13rem;
     height:20rem;
     text-align: center;
     border-top: 1px solid #fff;
     padding-top:1rem;
 }
 
 .index-left-child-data >div{
     height: 3rem;
     line-height: 3rem;
     color: #888;
     
 }
 
 .index-left-child a{
     display: inline-block;
     width: 100%;
     height: 100%;
 }
#bigpic{
    position: fixed;
    left: 50%;
    top:5rem;
    margin-left: -15rem;
    width: 30rem;
    height:60rem;
     background-color: transparent !important;
}


   

.win-mask{
   position: fixed;
   top:0;
   left: 0;
   width: 100%;
   height: 100%;
   z-index: 9999;
   background-color: rgba(0,0,0,0.3);
   display: flex;
   display: -webkit-flex;
   justify-content: center;
  -webkit-justify-content: center;
   align-items: center;
}
    .checkId{
        width: 30rem;
        height: 30rem;
        background-color: #fff;
        border:1px solid #f9f9f9;
         display: flex;
   display: -webkit-flex;
   justify-content: center;
  -webkit-justify-content: center;
   align-items: center;
   flex-direction: column;
   border-radius: 1rem;
   position: relative;
    }    
    .checkId-head{
        margin-top:2rem;
        margin-bottom:1rem !important;
    }
    .checkId-head>img{
        width: 8rem;
        height: 8rem;
        border-radius: 100%;
    }
 .checkId >div{
      margin-bottom: 2rem;
      font-weight: bold;
 }
 .checkId-name{
     font-size:1.8rem;
     font-weight: bold;
     color: #003366;
 }
 .win-del{
     position: absolute;
     right:-1rem;
     top:-1rem;
     width: 3rem;
     height: 3rem;
     border-radius:100%;
     background-image: url(/image/icon/close1.png);
     background-size: 3rem 3rem;
 }
 .win-del:hover{
   width: 4rem;
   height: 4rem;
    background-size: 4rem 4rem;
 }
 
 
 
 
 
 
   .win-notice{
        width: 30rem;
        height: 20rem;
        background-color: #fff;
        border:1px solid #f9f9f9;
         display: flex;
   display: -webkit-flex;
   justify-content: center;
  -webkit-justify-content: center;
   align-items: center;
   flex-direction: column;
   border-radius: 1rem;
   position: relative;
    }    
    
    


 .index-left-child a{
     display: inline-block;
     width: 100%;
     height: 100%;
 }