/*
base规范
样式类名：
1、6字母一下单词使用整个单词，6字母以上考虑缩写
2、使用-符号连接单词
3、使用正确，易读的单词

样式区域：
区域头尾部必须包含开头说明与结尾说明

清理：
不定期检查自己加入的类区块，清除无用样式

兼容：
创建样式时应考虑兼容性与复杂性，太过复杂可创建多个样式代替
不应对已有的样式进行修改，如需修改应先通知所有开发人员
*/
/*重置浏览器固有的css*/
body, html {
    font-family:  "Helvetica Neue", Helvetica, Arial, "Microsoft YaHei", '\9ED1\4F53', '\5B8B\4F53', Arial, sans-serif;
    font-size: 14px;
    color: #333;
    background-color:#E6E9F0;
}

article,aside,body,dd,dialog,div,dl,dt,footer,h1,h2,h3,h4,h5,h6,header,html,input,li,nav,ol,p,section,textarea,ul {
	margin: 0;
	padding: 0;
}
li,ol,ul {
	list-style-type: none
}
a{
    text-decoration: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0
}
textarea {
	resize: none;
	outline: 0
}
input,button,textarea {
	outline: 0;
	border: 0;
}
/*重置input的placeholder固有样式*/
::-webkit-input-placeholder {
    font-size: 14px;
    color: rgba(144, 144, 144, 1);
    padding-top: 2px;
  }

  :-moz-placeholder {
    font-size: 14px;
    color: rgba(144, 144, 144, 1);
    padding-top: 2px;
  }
  
  ::-moz-placeholder {
    font-size: 14px;
    color: rgba(144, 144, 144, 1);
    padding-top: 2px;
  }
  
  :-ms-input-placeholder {
    font-size: 14px;
    color: rgba(144, 144, 144, 1);
    padding-top: 2px;
  }
/*重置input的placeholder固有样式结束*/

  /*input悬浮出现*/
  input[disabled]:hover {
    cursor: not-allowed;

  }
  textarea[disabled]:hover {
    cursor: not-allowed;
  }
  button[disabled]:hover {
    cursor: not-allowed;
  }
/*input悬浮出现结束*/
/*Input去掉黄色*/
input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px rgba(230, 233, 240, 1) inset !important;
   }
/*Input聚焦去掉黄色*/
/*重置滚动条开始*/
::-webkit-scrollbar {
    width: 8px; 
    height: 1px;
    height: 10px;
  }
::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    background: #D2D2D2;
    height: 10px !important;
  }
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    border-radius: 10px;
    background: none !important;
    display: none;
}
/*重置滚动条结束*/
/*重置浏览器固有的css结束*/

/*flex布局专用*/
.flex{
    display:-ms-flexbox;
    display:flex;
}
.flex1{
    -ms-flex:1;
        flex:1
}
.flex2{
    -ms-flex:2;
        flex:2
}
.flex3{
    -ms-flex:3;
        flex:3
}
.flex-center{
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
}
.flex-row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row wrap;
        flex-flow: row wrap;
}
.flex-column {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: column wrap;
        flex-flow: column wrap;
}
/*flex部分结束*/

/*左右对其部分*/
.text-left{
    text-align: left;
}
.text-center{
    text-align: center;
}
.text-right{
    text-align: right;
}
/*左右对其部分结束*/

/*display部分*/
.hidden{
    display: none!important;
}
.block{
    display: block!important;
}
.inline{
    display: inline;
}
.inline-block{
    display: inline-block;
}
/*display部分结束*/

/*宽高区域*/
.height-percent-100{
    height:100%;
}
.width-percent-100{
    width:100%;
}
.height-vh-100{
    height: 100vh;
}
/*宽高区域结束*/
/*浮动*/
.pull-left{
    float: left;
}
.pull-right{
    float: right;
}
/*浮动结束*/
/*清除浮动*/
.clearfix {
    *zoom: 1;
    clear: both;
    overflow: hidden;
}
/*清除浮动结束*/

/*绝对定位*/
.rel {
    position: relative;
}
.abs {
    position: absolute
}
/*绝对定位结束*/

/*文字超出隐藏*/
.text-elli {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
/*文字超出隐藏结束*/

/*手指指针*/
.pointer{
    cursor: pointer;
}
/*手指指针结束*/

/*手指悬浮上去有模糊特效*/
.pointer-opacity{
    cursor: pointer;
}
.pointer-opacity:hover{
    opacity: .8;
}
/*手指悬浮上去有模糊特效结束*/

/*超出样式*/
.over-hidden{
    overflow: hidden;
}
.over-scroll{
    overflow: scroll;
}
.over-auto{
    overflow: auto;
}
/*超出样式结束*/

/*-------------------------------------------------以下是重置element-ui的区域-------------------------------------*/

/*重置按钮区域*/

.el-button{
    transition: .3s all ease;
    padding: 0 20px;
    height: 36px;
    line-height: 36px;
}
.el-button--medium{
    height: 32px;
    line-height: 32px;
    padding: 0 15px;
}
.el-button--small{
    height: 30px;
    line-height: 30px;
    padding: 0 15px;
}
.el-button--mini{
    height:24px;
    line-height: 24px;
    padding: 0 15px;
}
.el-button+.el-button {
    margin-left: 18px;
}
.el-message-box__btns .el-button--small:not(.el-button--primary){
    color: #286EFF;
    border-color: #286EFF;
}
.el-message-box__btns .el-button--small:not(.el-button--primary):focus,.el-message-box__btns .el-button--small:not(.el-button--primary):hover{
    color: #286EFF;
    border-color: #286EFF;
    background-color: #ecf5ff;
}
.el-button--primary:focus, .el-button--primary:hover{
    background-color: #528AFF;
    border-color:#528AFF;
}
.el-button.is-plain:focus, .el-button.is-plain:hover{
    border-color: #528AFF;
    color: #528AFF;
    background-color: #ecf5ff;
}
.el-button--primary{
    background-color: #286EFF;
    border-color:#286EFF;
}
.el-button.is-plain{
    border-color:#286EFF;
    color: #286EFF;
}
/*四种按钮颜色*/
.ai-edit-btn{
    border-color: #286EFF;
    color:#286EFF;
}
.ai-edit-btn:focus,.ai-edit-btn:hover{
    border-color: #286EFF;
    color:#286EFF;
    opacity: .8;
    background-color: #fff!important;
}
.ai-add-btn{
    border-color: #7D64F0;
    color:#7D64F0;
}
.ai-add-btn:focus,.ai-add-btn:hover{
    border-color: #7D64F0;
    color:#7D64F0;
    opacity: .8;
    background-color: #fff!important;
}
.ai-delete-btn{
    border-color: #FF5A5A;
    color:#FF5A5A;
}
.ai-delete-btn:focus,.ai-delete-btn:hover{
    border-color: #FF5A5A;
    color:#FF5A5A;
    opacity: .8;
    background-color: #fff!important;
}
.ai-disabled-btn{
    border-color: #F7B84B;
    color:#F7B84B;
}
.ai-disabled-btn:focus,.ai-disabled-btn:hover{
    border-color: #F7B84B;
    color:#F7B84B;
    opacity: .8;
    background-color: #fff!important;
   
}
.ai-model-btn{
    border-color: #46BEB4;
    color:#46BEB4;
}
.ai-model-btn:focus,.ai-model-btn:hover{
    border-color: #46BEB4;
    color:#46BEB4;
    opacity: .8;
    background-color: #fff!important;
}

.ai-gray-disabled-btn{
    color: #c0c4cc;
    background-image: none;
    background-color: #fff;
    border-color: #c0c4cc;
}
.ai-gray-disabled-btn:focus,.ai-gray-disabled-btn:hover{
    color: #c0c4cc;
    border-color: #c0c4cc;
    opacity: .8;
    background-color: #fff!important;
}
/*固定长度不带图标*/
.ai-first-fixlen-btn{
    width:100px;
    height:36px;
    line-height: 36px;
    padding: 0;   
}
.ai-second-fixlen-btn{
    width:168px;
    height:50px;
    line-height: 50px;
    padding: 0;
}
/*固定长度不带图标结束*/
/*导出按钮*/
.ai-export-btn{
    background-color: transparent;
    color: #286EFF;
    border: none;
    width: 60px;
    text-align: center;
    padding: 0;
}
.ai-export-btn:hover,.ai-export-btn:focus{
    background: transparent;
    color: #286EFF;
    opacity: .7;
}
/*分类添加的按钮*/
.el-icon-plus-add.el-icon-circle-plus{
    height: 24px;
    line-height: 24px;
    border: none;
    font-size: 20px;
    vertical-align: middle;
    background: transparent;
}
.el-icon-plus-add.el-icon-circle-plus::before{
    color: #286EFF;
}
.el-icon-plus-add:hover,.el-icon-plus-add:focus{
    color: #286EFF;
    opacity: .7;
}
.el-table--enable-row-hover .el-table__body tr:hover .el-icon-plus-add{
     color: #286EFF;
}
.ai-general-btn{
    border-color: #E6E9F0;
    color:#286EFF;
    font-size: 14px;
    height: 24px;
    line-height: 24px;
    border-radius: none;
}
.ai-general-btn:focus,.ai-general-btn:hover{
    border-color: #286EFF;
    color:#286EFF;
    background-color: #fff!important;
}
/*分类添加的按钮结束*/
/*重置按钮区域*/

/*重置表格开始*/
.el-table .cell, .el-table th div, .el-table--border td:first-child .cell, .el-table--border th:first-child .cell{
    padding-left: 20px;
}
.el-table__body tr:hover .el-button{
    background-color: #f5f7fa;
}
/*重置表格结束*/

/*重置图标*/
.el-button i{
    font-size: 18px;
    vertical-align: middle;
    padding-bottom: 2px;
}
/*重置图标*/
/*重置提示tooltip*/
.el-tooltip__popper.is-dark{
    opacity: .8;
}
/*重置提示tooltip结束*/

/*重置表单开始*/

.el-checkbox__input.is-checked+.el-checkbox__label{
    color: #286EFF;
}
.el-checkbox__input.is-checked .el-checkbox__inner, .el-checkbox__input.is-indeterminate .el-checkbox__inner{
    background-color: #286EFF;
    border-color: #286EFF;
}
.el-input.is-active .el-input__inner, .el-input__inner:focus{
    border-color: #286EFF;
}
.el-select .el-input.is-focus .el-input__inner{
    border-color: #286EFF;
}
.el-select .el-input__inner:focus{
    border-color: #286EFF;
}
.el-date-table td.available:hover{
    color: #286EFF;
}
.el-date-table td.today span{
    color: #286EFF;
}
.el-select-dropdown__item.selected{
    color: #286EFF;
}
.el-radio__input.is-checked .el-radio__inner{
    border-color: #286EFF;
    background: #286EFF;
}
.el-radio__inner:hover {
    border-color: #286EFF;
}
.el-radio__input.is-checked+.el-radio__label{
    color: #286EFF;
}
/*重置表单结束*/

/*重置弹窗开始*/
.el-message-box__headerbtn:focus .el-message-box__close, .el-message-box__headerbtn:hover .el-message-box__close{
    color: #286EFF;
}

/*重置弹窗结束*/

/*重置时间选择*/
.el-picker-panel{
    margin-left: 20px;
}
.el-range-editor.is-active, .el-range-editor.is-active:hover{
    border-color: #286EFF;
}
.el-date-table td.end-date span, .el-date-table td.start-date span{
    background-color: #286EFF;
}
/*重置时间选择*/

/*重置分页*/
.el-pager li.active{
    color: #286EFF;
}
.el-pager li:hover{
    color: #286EFF;
}
.el-pagination button:hover{
    color: #286EFF;
}
/*重置分页结束*/

/*-------------------------------------------------重置element-ui的区域结束-------------------------------------*/

/*常用padding margin*/
/*margin*/
.margin10{
    margin:10px;
}
.margin12{
    margin:12px;
}
.margin14{
    margin:14px;
}
.margin16{
    margin:16px;
}
.margin18{
    margin:18px;
}
.margin20{
    margin:20px;
}
.margin22{
    margin:22px;
}
.margin24{
    margin:24px;
}
/*margin-left*/
.margin-left10{
    margin-left:10px;
}
.margin-left12{
    margin-left:12px;
}
.margin-left14{
    margin-left:14px;
}
.margin-left16{
    margin-left:16px;
}
.margin-left18{
    margin-left:18px;
}
.margin-left20{
    margin-left:20px;
}
.margin-left22{
    margin-left:22px;
}
.margin-left24{
    margin-left:24px;
}
/*margin-top*/
.margin-top10{
    margin-top:10px;
}
.margin-top12{
    margin-top:12px;
}
.margin-top14{
    margin-top:14px;
}
.margin-top16{
    margin-top:16px;
}
.margin-top18{
    margin-top:18px;
}
.margin-top20{
    margin-top:20px!important;
}
.margin-top22{
    margin-top:22px;
}
.margin-top24{
    margin-top:24px;
}
/*margin-bottom*/
.margin-bottom10{
    margin-bottom:10px;
}
.margin-bottom12{
    margin-bottom:12px;
}
.margin-bottom14{
    margin-bottom:14px;
}
.margin-bottom16{
    margin-bottom:16px;
}
.margin-bottom18{
    margin-bottom:18px;
}
.margin-bottom20{
    margin-bottom:20px;
}
.margin-bottom22{
    margin-bottom:22px;
}
.margin-bottom24{
    margin-bottom:24px;
}
/*margin-right*/
.margin-right10{
    margin-right:10px;
}
.margin-right12{
    margin-right:12px;
}
.margin-right14{
    margin-right:14px;
}
.margin-right16{
    margin-right:16px;
}
.margin-right18{
    margin-right:18px;
}
.margin-right20{
    margin-right:20px;
}
.margin-right22{
    margin-right:22px;
}
.margin-right24{
    margin-right:24px;
}
/*padding*/
.padding-layout{
    padding-left: 20px;
    padding-top: 20px;
}
.padding10{
    padding:10px;
}
.padding12{
    padding:12px;
}
.padding14{
    padding:14px;
}
.padding16{
    padding:16px;
}
.padding18{
    padding:18px;
}
.padding20{
    padding:20px;
}
.padding22{
    padding:22px;
}
.padding24{
    padding:24px;
}
/*padding-left*/
.padding-left10{
    padding-left:10px;
}
.padding-left12{
    padding-left:12px;
}
.padding-left14{
    padding-left:14px;
}
.padding-left16{
    padding-left:16px;
}
.padding-left18{
    padding-left:18px;
}
.padding-left20{
    padding-left:20px;
}
.padding-left22{
    padding-left:22px;
}
.padding-left24{
    padding-left:24px;
}
/*padding-top*/
.padding-top10{
    padding-top:10px;
}
.padding-top12{
    padding-top:12px;
}
.padding-top14{
    padding-top:14px;
}
.padding-top16{
    padding-top:16px;
}
.padding-top18{
    padding-top:18px;
}
.padding-top20{
    padding-top:20px;
}
.padding-top22{
    padding-top:22px;
}
.padding-top24{
    padding-top:24px;
}
/*padding-bottom*/
.padding-bottom10{
    padding-bottom:10px;
}
.padding-bottom12{
    padding-bottom:12px;
}
.padding-bottom14{
    padding-bottom:14px;
}
.padding-bottom16{
    padding-bottom:16px;
}
.padding-bottom18{
    padding-bottom:18px;
}
.padding-bottom20{
    padding-bottom:20px;
}
.padding-bottom22{
    padding-bottom:22px;
}
.padding-bottom24{
    padding-bottom:24px;
}
/*padding-right*/
.padding-right10{
    padding-right:10px;
}
.padding-right12{
    padding-right:12px;
}
.padding-right14{
    padding-right:14px;
}
.padding-right16{
    padding-right:16px;
}
.padding-right18{
    padding-right:18px;
}
.padding-right20{
    padding-right:20px;
}
.padding-right22{
    padding-right:22px;
}
.padding-right24{
    padding-right:24px;
}
/*常用padding margin结束*/

/*常用颜色*/
/*背景颜色*/
.bg-white{
    background-color: white;
}
.bg-black{
    background-color: black;
}
/*字体颜色*/
.color-white{
    color:white;
}
.color-black{
    color:black;
}
.color-main{
    color: #286EFF;
}
/*边框颜色*/
.border-main{
    border-color: #286EFF;
}
/*边框颜色结束*/
/*常用颜色结束*/

/*常用字体大小*/

.font-size10{
    font-size: 10px;
}
.font-size12{
    font-size:12px;
}
.font-size14{
    font-size:14px;
}
.font-size16{
    font-size:16px;
}
.font-size18{
    font-size:18px;
}
.font-size20{
    font-size:20px;
}
.font-size22{
    font-size:22px;
}
.font-size24{
    font-size:24px;
}
/*常用字体大小结束*/