*{
  	margin: 0;
	padding: 0;
	box-sizing: border-box;
   color: #404040;
  }
  [data-click]{
    user-select: none;
    cursor: pointer;
  }
   input{
     user-select: text !important; 
       caret-color: #16a951;
       border-radius: .3rem !important;
 }
a{
  color: inherit; /* 文字颜色继承父元素 */
  text-decoration: none; /* 去掉下划线 */
  pointer-events: auto; /* 允许链接响应鼠标事件 */
  cursor: pointer; /* 将鼠标样式设置为指针 */
}
html,body{
    width: 100%;
    height: 100%;
}
html {
     font-size: 62.5% !important;
   }
 body{
     font-size: 1.6rem;
 }  
 

        input[type="date"]{
         width: 16rem;
     }
 
@media screen and (orientation: landscape) and (max-width: 992px) {
 html{font-size: 33% !important;}
    /* 其他样式规则 */
}

   @media only screen and (min-width: 1024px){
    html{font-size: 40% !important;}
    } /*>=1024的设备*/

    @media  only screen and (min-width: 1100px) {
    html{font-size: 45% !important;}
    } /*>=1100的设备*/
    @media  only screen and (min-width: 1280px) {
    html{font-size: 48%  !important;}
    } /*>=1280的设备*/

    @media  only screen and   (min-width: 1366px) {
     html{font-size: 50%  !important;}
    }  

    @media   only screen and  (min-width: 1440px) {
    html{font-size: 55%  !important;}
    } 

    @media   only screen and  (min-width: 1640px) {
    html{font-size: 58%  !important;}
    } 
    @media   only screen and  (min-width: 1920px) {
       html{font-size: 62.5%  !important;}
    } 




 
 
 /*通用类的css*/
 /*定位CSS 定位在那个位置 上下左右  通常用于列表一些标记*/
.absolute-left-up{
    position: absolute;
    left: .5rem;
    top:.5rem;
}
.absolute-right-up{
    position: absolute;
    right: 1rem;
    top:.5rem;
}
.absolute-left-bottom{
    position: absolute;
    left: 1rem;
    bottom:.5rem;
}
.absolute-right-bottom{
    position: absolute;
    right: 1rem;
    bottom:.5rem;
}


/*渐变色背景色 10个色*/
.gradient0{
    background-image: linear-gradient(to right, #ff8177 0%, #ff867a 0%, #ff8c7f 21%, #f99185 52%, #cf556c 78%, #b12a5b 100%);
}
.gradient1{
    background-image: linear-gradient(120deg, #a1c4fd 0%, #c2e9fb 100%);
}

.gradient2{
   background-image: linear-gradient(120deg, #d4fc79 0%, #96e6a1 100%);
}

.gradient3{
    background-image: linear-gradient(120deg, #84fab0 0%, #8fd3f4 100%);
}

.gradient4{
   background-image: linear-gradient(to top, #96fbc4 0%, #f9f586 100%);
}

.gradient5{
   background-image: linear-gradient(180deg, #2af598 0%, #009efd 100%);
}

.gradient6{
   background-image: linear-gradient(to top, #cd9cf2 0%, #f6f3ff 100%);
}
.gradient7{
    background-image: linear-gradient(-20deg, #6e45e2 0%, #88d3ce 100%);
}

.gradient8{
    background-image: linear-gradient(15deg, #13547a 0%, #80d0c7 100%);
}

.gradient9{
    background-image: linear-gradient(to top, #505285 0%, #585e92 12%, #65689f 25%, #7474b0 37%, #7e7ebb 50%, #8389c7 62%, #9795d4 75%, #a2a1dc 87%, #b5aee4 100%);
}


.gradient10{
  background-image: linear-gradient(to right, #43e97b 0%, #38f9d7 100%);
}
.gradient11{
    background-image: linear-gradient(to top, #09203f 0%, #537895 100%);
}

/*渐变色按钮样式 圆形/长方形*/
.button-round{
    width:5rem;
    line-height:5rem;
    text-align: center;
    border-radius:5rem;
    display: inline-block;
    color: #fff;
   
}

.button-round:hover,.button-rectangle:hover{
      background-color:#FF9966; /* 要加亮的颜色 */
  box-shadow: 0 0 10px #FF9966; /* 高亮颜色和模糊半径 */

    user-select: none;
}
.button-rectangle:active,.button-round:active{
    opacity: 0.5;
    user-select: none;
}
.button-rectangle{
    width: auto;
    padding: .5rem;
    color: #fff;
    border-radius:.5rem;
    
}


/*按钮css*/

.button-a{
   min-width: 5rem;
   width:auto;
    padding:.5rem;
    height: 3rem;
    text-align: center;
    background-color: #ccc;
    border-radius:.5rem;
    display: inline-block;
    z-index: 999;
    
}
.button-b{
   min-width: 5rem;
   width:auto;
    padding:.5rem;
    height: 3rem;
    text-align: center;
    background-color: #ccc;
    border-radius:3rem;
    display: inline-block;
    z-index: 999;
    
}

.button-c{
    width:4rem;
    line-height:4rem;
    text-align: center;
    background-color: #99CC99;
    border-radius:4rem;
    display: inline-block;
    color: #fff;
    z-index: 1;
    
}

.button-e,.button-f{
        padding: 0 1rem 0  1rem;
        border-radius: .8rem;
        display: inline-block;
        height: 3rem;
        line-height: 3rem;
        text-align: center;
        margin-left: 1rem;
        box-sizing: none;
        
     }
     
     .button-d-active{
         background-color: #e0f0e9;
         color:#16a951;
         font-weight: bold;
        
     }
     
     .button-d{
         border: 1px solid  #16a951;
            padding: 0 2rem 0  2rem;
        border-radius: .8rem;
        display: inline-block;
        height: 4rem;
        line-height: 4rem;
        text-align: center;
        margin-left: 1rem;
        box-sizing: none;
        
     }
   .button-e{
         background-color: #16a951;
         color: #fff;
         
     }  
     
     .button-f{
         background-color: #20b2aa;
         color: #fff;
         
     }
     .button-d:hover,.button-f:hover{
         background-color: #e0f0e9;
         user-select: none;
     }

.button-a:hover,.button-b:hover,.button-c:hover,.button-e:hover{
    background-color: #3eede7;
    user-select: none;
}

.button-color-a{
         background-color: #9d2933;
     }
      .button-color-b{
         background-color: #057748;
     }
     
         .button-color-c{
         background-color: #ff8936;
     }
           .button-color-d{
         background-color: #725e82;
     }
     
     .button-color-e{
         background-color: #ff2d51;
     }
.button{
    width: auto;
    padding: .3rem;
    background-color: #f9f9f9;
    border:1px solid #ccc;
}





  .button-allow{
           padding: .5rem  .5rem .5rem  .5rem;
        border: 1px solid  #16a951;
        border-radius: 1rem;
        display: inline-block;
        margin-bottom: .5rem;
        margin-right: 1rem;
        color: #16a951;
        cursor: pointer;
        
     }
     
     .button-refuse{
          padding: .5rem  .5rem .5rem  .5rem;
        border: 1px solid  red;
        color: red;
        border-radius: 1rem;
        display: inline-block;
        margin-bottom: .5rem;
        margin-right: 1rem; 
        cursor: pointer;
        
     }
     
     .button-refuse:hover{
         background-color: #FF6666;
         color: #fff;
     }
     .button-allow:hover{
        background-color:#99CC99;
         color: #fff;
     }
     
/*按钮操作类的复选框*/

 
/* 隐藏原生复选框 */
.button-checkbox{
  width:auto;
}

.button-checkbox  input[type="checkbox"] {
  display: none;
}
.button-checkbox label{
    width:auto;
    height:2.2rem;
    line-height:2.2rem;
    display: inline-block;
    position: relative;
    border: 1px solid  #42C3AF;
    border-radius: .3rem;
    font-size: 1.2rem;
    text-align: center;
    margin:.5rem;
    padding-left: 2rem;

   
}
.button-checkbox>label>span{
    margin: 0;
}
.button-checkbox>label>span:last-child{
    font-size: 1.2rem;
    color:#42C3AF;
}
.button-checkbox>label>span:last-child:hover{
    font-size: 1.2rem;
    color:#fff;
}
/* 创建一个可见的自定义复选框 */
.button-checkbox .checkmark {
  display: inline-block;
  width: 2rem; /* 复选框的宽度 */
  height: 2rem; /* 复选框的高度 */
  /* 未选中状态下的背景色 */
  margin-right: 1rem; /* 与文本的距离 */
  border-radius:2rem; /* 圆角 */
  position: absolute;
  top:0;
  left: 0;
}
 
/* 当复选框被选中时 */
.button-checkbox input[type="checkbox"]:checked + .checkmark {
   background-color: #42C3AF;
  border-color: #42C3AF; /* 选中状态下的背景色 */
  color: #fff;
  opacity: 0.9;
}
 
/* 创建复选框内部的对勾 */
.button-checkbox .checkmark::after {
  content: "";
  position: absolute;
  display: none;
  left: .5rem;
  top: .3rem;
  width: .6rem;
  height: 1.2rem;
  border: solid white;
  border-width: 0 .2rem .2rem 0;
  transform: rotate(45deg); /* 对勾的形状和方向 */
}
 
/* 当复选框被选中时显示对勾 */
 .button-checkbox input[type="checkbox"]:checked + .checkmark::after {
  display: block;
}

 .button-checkbox >label:hover{
  opacity: 0.8;
  color:#fff;
  background-color: #84bf96;
  user-select: none;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}




.goods-edit >span{
    margin-right: 2rem;
}

.button-k{
    padding: .5rem;
    width: auto;
    border: 1px solid  #ccc;
    border-radius: 1rem;
}
.button-k:hover{
     border: 2px solid  #16a951;
     user-select: none;
}

/*字体大小粗细*/
.font-a{
    /*列表中的标题文字*/
    font-size: 1.8rem;
    color: #111;
}
.font-b{
    /*显示正文内容的文字*/
    font-size: 1.6rem;
    color: #666;
}

.font-c{
    /*小文字标注性的文字*/
    font-size:1.4rem;
    color:#666;
}

.font-d{
        color: #000;
        font-size: 1.4rem;
}

.font-e{
    /*用于显示数字*/
    font-weight:700;
    color: #392f41;
    font-size: 1.8rem;
}
 
.font-f{
    /*网页标题文字*/
   font-weight:700;
    color: #000;
    font-size: 2rem;  
}    
.font-g1{
    /*状态类标记文字*/
    color: #0c8918;
    font-size: 1.6rem;
}
.font-g0{
    /*状态类标记文字*/
    color: #808080;
     font-size: 1.6rem;
}     
     
.title-wrap{
    line-height: 1.8rem;
    margin-bottom:1rem;
}


 
 /*提示描述的无点击按钮效果*/
  .tips-a{
         width: auto;
         height: 2.5rem;
         line-height: 2.5rem;
         text-align: center;
         padding:0  1rem  0 1rem;
         background-color: #50616d;
         border-radius:2.5rem;
         color: #fff;
         font-size: 1.2rem;
     }
    /*自定义提示消息样式*/
    .g-tips{
     position: fixed;
     top:2rem;
     right:2rem;
     width: 40rem;
     height: auto;
     z-index: 99999999999;
    }      
    .g-tips> div{
    width: auto;
    padding: .5rem;
    right: 1rem;
    line-height:3rem;
    height: auto;
    border-radius: .5rem;
    background-color:rgba(0,0,0,0.8);
    color:#00e500;
    border: 1px solid #00e500;
    font-size: 1.6rem;
    margin-bottom: 1rem;
    text-align: center;
}     
         
@keyframes fadeOut {
  from {opacity: 1;}
  to {opacity: 0;}
}
     
     
 .list-out{
         position: relative;
     }
     
     .nodata{
    position:absolute;
    top:60%;
    left: 50%;
    height: 10rem;
    line-height: 10rem;
    text-align: center;
    width: 15rem;
    margin-top:5rem;
    margin-left: -7.5rem;
    font-size: 1.8rem;
   color: #888;
    background-image: url(/image/nodata.png);
    background-size: cover;
}    
     
                  /*加载中样式*/
.allScreen{
    position: fixed;
    height:100vh;
    width:100vw;
    z-index: 1000000;
    display: flex;
    display: -webkit-flex;
    justify-content: center;
    -webkit-justify-content:center;
    align-items: center;
    background-color:rgba(0,0,0,0.3);
    
}


   .allScreen>.loader{
    width: 10rem;
    height: 10rem;
    border-radius:100%;
    opacity: 0.8;
    background-size:cover;
}  
     
     
     
  

        .iframeNew{
            position: fixed;
            top:2rem;
            left: 2rem;
           width:calc(100%  -  5rem);
           height:calc(100%  -  3rem);
           background-color: #f9f9f9;
           z-index: 99999;
           display: block;
           border-radius: 1rem;
          }
     
.radio-custom {
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  margin-right: 2rem;
  position: relative;
  padding-left: 2rem;
}

.radio-custom input[type="radio"] {
  display: none;
}

.radio-custom span {
  position: relative;
  padding-left: 1rem;
  font-size: 1.4rem;
  color: #606266;
}

.radio-custom span::before {
  content: '';
  position: absolute;
  left: -3rem;
  top: 50%;
  transform: translateY(-50%);
  width: 2rem;
  height: 2rem;
  border: 2px solid #c0c4cc;
  border-radius: 50%;
  background: linear-gradient(135deg, #f5f7fa 0%, #ffffff 100%);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 
    inset 0 1px 3px rgba(0, 0, 0, 0.1),
    0 2px 4px rgba(0, 0, 0, 0.05);
}

/* 悬停效果 */
.radio-custom:hover span::before {
  border-color: #40de5a;
}

/* 选中状态 - 移除灰色背景，改为纯绿色 */
.radio-custom input:checked + span::before {
  border-color: #40de5a;
    background: linear-gradient(135deg, #40de5a 0%, #34c759 100%);

  box-shadow: 
    inset 0 1px 8px rgba(255, 255, 255, 0.5),
    0 3px 8px rgba(64, 222, 90, 0.3);
  animation: radioPulse 0.4s ease;
}

/* 白色小圆点 */
.radio-custom input:checked + span::after {
  content: '';
  position: absolute;
  left: -2rem;
  top: 50%;
  transform: translateY(-50%);
  width: 0.6rem;
  height: 0.6rem;
  background: #fff;
  border-radius: 50%;
  /* 移除 box-shadow，保持纯白 */
}

@keyframes radioPulse {
  0% {
    transform: translateY(-50%) scale(0.9);
  }
  50% {
    transform: translateY(-50%) scale(1.05);
  }
  100% {
    transform: translateY(-50%) scale(1);
  }
}

.radio-custom input:checked + span {
  color: #40de5a;
  font-weight: 500;
}

     .page-title{
         width: 100%;
         height: 4rem;
         line-height: 4rem;
         text-indent: 8rem;
         background-image: url(/image/icon/edit.png);
         background-repeat:  no-repeat;
         background-size: 2rem auto;
         background-position: 4rem center;
         font-size: 1.8rem;
         font-weight: 650;
         background-color: #f9f9f9;
         
     }
    .input-lable,.input-lableB{
        width:100%;
        height: 4rem;
        line-height:4rem;
        font-size: 1.6rem;
    }
    .input-lableB + div>  input{
        width: 14rem;
        height: 4rem;
        text-indent: 1rem;
        background-color: #fff;
    }
    
  .input-lableB + div> input[type="number"] {
  width: 10rem;
}

    [data-redstar]{
        content:"*";
        color: red;
    }
    .input-lable:before{
        content:"*";
        color: red;
    }
    .input-lable + div > input{
        width: 60rem;
        height: 4rem;
        text-indent: 1rem;
         background-color: #fff;
    }
    
     .input-lable + div > input:hover{
         border: 1px solid #3eede7;
     }
    
    
    
    
    /*flex*/
 .flex,.flex-around,.flex-between,.flex-center{
      height:auto;
      display: flex;
      display: -webkit-flex;
      align-items: center;
      flex-wrap: wrap;
  }

     .flex-between{
    justify-content:space-between;
    -webkit-justify-content:space-between;
}

    .flex-around{
        justify-content: space-around;
         -webkit-justify-content:space-around;
    }
    .flex-center{
        justify-content:center;
         -webkit-justify-content:center;
    }





/* 隐藏原生的单选按钮 */
input[type="radio"] {
  display: none;
}
 
/* 自定义外观的label，将其作为可点击区域 */
label.radio-custom {
  cursor: pointer;
  padding-left: 25px;
  position: relative;
}
 
/* 创建一个圆形的背景 */
label.radio-custom::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 15px;
  height: 15px;
  background-color: #fff;
  border: 2px solid #888;
  border-radius: 50%;
  transition: border-color 0.3s;
}
 
/* 当单选按钮被选中时，背景变色 */
input[type="radio"]:checked + label.radio-custom::before {
  background-color: #40de5a;
  border-color: #40de5a;
}
 
/* 可选：创建一个选中时的小圆形 */
label.radio-custom::after {
  content: '';
  position: absolute;
  left: 6px;
  top: 50%;
  transform: translateY(-50%);
  width: 7px;
  height: 7px;
  background-color: #fff;
  border-radius: 50%;
  visibility: hidden;
  transition: visibility 0.3s;
}
 
/* 当单选按钮被选中时，显示小圆形 */
input[type="radio"]:checked + label.radio-custom::after {
  visibility: visible;
}
     
.list-title-small{
    position: relative;
    width:auto;
    margin:2rem 0  2rem 0;
    height: 1rem;
    line-height:1rem;
    border-bottom:  2px solid #f3f9f1;
   font-size: 1.4rem;
   font-weight:300;
   color: #161823;
}

.list-title-small>span:first-child{
    position: absolute;
    left: 0;
    top:-1rem;
    min-width: 15rem;
    width: auto;
    padding:0 1rem 0  1rem;
    height:3rem;
    line-height:3rem;
    text-align: left;
    text-indent: 2rem;
    border-radius: 3rem;
    background-color: #f3f9f1;
}

.flex-center{
     display: flex;
    display: -webkit-flex;
    align-items: center;
    justify-content: center;
    -webkit-justify-content: center;
}
.flex-center > *{
    margin-left: 2rem;
}

.upfile-group{
    border: 1px solid #ccc;
    padding: 1rem;
     border-radius: 1rem;
}
.upfile-group>div:first-child{
    margin-bottom: 1rem;
}
/*复选框列表CSS 对接类目选项*/

.checkbox-list{
    display: flex;
    display: -webkit-flex;
    align-items: center;
    flex-wrap: wrap;
    margin-top:3rem;
}
.checkbox-list >label{
     display: flex;
    display: -webkit-flex;
    justify-content: center;
    -webkit-justify-content: center;
    align-items: center;
    width: auto;
    margin-right: 1rem;
    border: 1px solid #ccc;
    height: 4rem;
    line-height: 4rem;
    box-sizing:content-box ;
    margin-bottom: 1rem;
}
.checkbox-list >label:hover{
    border-color:  #40de5a;
    user-select: none;
}

.checkbox-list >label>span:first-child{
    width:auto;
    height:4rem;
    display: inline-block;
    background-color: #ccc;
    line-height:4rem;
    text-align:left;
    margin-right: 1rem;
    padding:0 .5rem 0 .5rem;
    color: #f9f9f9;
}

/* 隐藏原生复选框 */
.checkbox-list  input[type="checkbox"] {
  display: none;
}
 
/* 创建一个可见的自定义复选框 */
.checkbox-list .checkmark {
  display: inline-block;
  width: 3rem; /* 复选框的宽度 */
  height: 3rem; /* 复选框的高度 */
  background: #ccc; /* 未选中状态下的背景色 */
  margin-right: .8rem; /* 与文本的距离 */
  border-radius: .4rem; /* 圆角 */
  position: relative;
}
 
/* 当复选框被选中时 */
.checkbox-list input[type="checkbox"]:checked + .checkmark {
   background-color: #40de5a;
  border-color: #40de5a; /* 选中状态下的背景色 */
}
 
/* 创建复选框内部的对勾 */
.checkbox-list .checkmark::after {
  content: "";
  position: absolute;
  display: block;
  left: 1rem;
  top: .3rem;
  width: .6rem;
  height: 1.2rem;
  border: solid white;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg); /* 对勾的形状和方向 */
}
 
/* 当复选框被选中时显示对勾 */
 .checkbox-list input[type="checkbox"]:checked + .checkmark::after {
  display: block;
}

input[type="file"]{
    display: none;
}


   
        /* 修改整个下拉框的样式 */
select {
  background-color: #f0f0f0; /* 背景颜色 */
  border: 1px solid #45b97c; /* 边框颜色 */
  font-size: 1.4rem; /* 字体大小 */
  border-radius: 5px; /* 边框圆角 */
  width: auto;
}
 
 select:active{
      border: 1px solid #45b97c; /* 边框颜色 */
 }
/* 修改下拉选项的样式 */
option {
  background-color: white; /* 选项的背景颜色 */
  padding: 3px; /* 选项的内边距 */
  border-radius: 3px; /* 选项的圆角 */
}
 
/* 修改下拉选项在鼠标悬停时的样式 */
option:hover {
  background-color:#45b97c; /* 悬停时的背景颜色 */
  user-select: none;
} 


.custom-select {
  appearance: none; /* 移除默认外观（Chrome, Safari, Firefox） */
  -webkit-appearance: none; /* 移除Webkit引擎的默认外观 */
  -moz-appearance: none; /* 移除Firefox的默认外观 */
  outline: none; /* 移除轮廓 */
  box-shadow: none; /* 移除阴影 */
  background-color: transparent; /* 设置透明背景 */
  border: 1px solid #ccc; /* 自定义边框 */
  width: 50%;
  position: absolute;
  right: 1rem;
}

/* 可选：为下拉箭头添加自定义样式 */
.custom-select::after {
  content: "\25BC"; /* 向下箭头字符 */
  position: absolute; /* 绝对定位 */
  top: 50%; /* 置于中间 */
  right: 5px; /* 右侧距离 */
  transform: translateY(-50%); /* 微调垂直位置 */
  pointer-events: none; /* 避免点击箭头本身 */
  color: #6c757d; /* 箭头颜色 */
}

/* 可选：调整option的样式，但需注意此样式在某些浏览器可能不生效 */
.custom-select option {
  background-color: #f8f9f9; /* 背景色 */
  color: #343a40; /* 文字颜色 */
}
.custom-select option:hover {
  background-color: #339933 !important;
  color: #343a40; /* 文字颜色 */
}
.custom-select option:checked {
  background-color: #339933; /* 例如：#007bff */
  color: #ffffff; /* 可选：改变选中项的文字颜色 */
}

/*单独颜色*/
.color1{
   color:#367459;
}
.color2{
   color: #718C7D; 
}
.color3{
   color:#68AB82; 
}
.color4{
   color: #A2B98D;
}
.color5{
   color:  #C8CD97; 
}
     .bg-color1{
         background-color:#745F6E;
     }
     
     .bg-color2{
         background-color: #718C7D;
     }
     
     .bg-color3{
         background-color: #68AB82;
     }
     
     .bg-color4{
         background-color: #A2B98D;
     }
     
     .bg-color5{
         background-color: #C8CD97;
     }



     .input-tips{
         /*输入框下方文字提示信息*/
         height: 2rem;
         line-height: 2rem;
         font-size: 1.4rem;
         color: red;
     }
     
     .border-red{
         /*输入框变红色*/
         border: 1px solid red;
     }
     
     
     
     
     
     
     /*对话框组件CSS*/    
 .g-dialog{
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #f9f9f9;
  padding:1rem;
  border: 2px solid #ccc;
  z-index: 999;
  width: 30rem;
}

 .g-dialog>div:first-child{
     color:  #009966;
     margin-bottom: 1rem;
 }
 
 .g-dialog > input{
     width: 100%;
 }
 
 .g-dialog>div:last-child{
     display: flex;
     justify-content: space-around;
 }
 .g-dialog>div > div{
     width: 5rem;
     height: 3rem;
     border-radius: .5rem;
     color: #fff;
     line-height:3rem;
     text-align: center;
 }
 .g-dialog>div > div:hover{
     opacity: 0.8;
     user-select: none;
 }
 
 
 
  .flex-direction{
    display: flex;
flex-direction: column;
align-items: center;
}


.win-mask{
   position: fixed;
   top:0;
   left: 0;
   width: 100%;
   height: 100%;
   z-index: 9999000;
   background-color: rgba(0,0,0,0.3);
   display: flex;
   display: -webkit-flex;
   align-content:center;
   flex-direction: column;
   justify-content: center;
   align-items: center;

}
 
     .win-box{
     position: relative;
    width: 60vw;
    max-width: 30rem;
    height: auto;
    background-color: #fff;
    border-radius: 1rem;
    padding:1rem;
    text-align: center;
}

.win-title{
 width: 100%;
 height: 4rem;
 line-height: 4rem;
 text-align: center;
 font-weight: bold;
 color: #000;
 border-bottom: 1px solid #f2f2f2;
}

.win-content{
    width: 100%;
    line-height: 2rem;
    height: auto;
    box-sizing: border-box;
    padding: .5rem;
    font-size: 1.4rem;
    color: #808080;
    margin-bottom: 1rem;
}
 .win-button{
     width: 100%;
     height: 4rem;
 }
.win-button-l,.win-button-r{
    padding: .5rem 1rem .5rem 1rem;
    border-radius:.5rem;
    color: #fff;
}

.win-button-l:hover,.win-button-r:hover{
    opacity: 0.5;
}
.win-button-l{
     background-color: #16a951;
}
.win-button-r{
    background-color: red;
}


.hidden{
    display: none;
}
  #yulanbox{
    position:fixed;
    top:0;
    right:3rem;
    width: 30vw;
    height: 100%;
}




/*打开子页面的css*/
.sub-page{
    position: absolute;
    top:0;
    left:0;
    width: 100%;
    height: 100%;
}





/* 表单管理器内置样式 */
.form-field-error {
    border: 1px solid #ff4d4f !important;
    background-color: #fff2f0 !important;
}

.form-error-message {
    color: #ff4d4f;
    font-size: 12px;
    margin-top: 4px;
    padding: 0 8px;
}