*{padding: 0; margin: 0;}
body {background-image: linear-gradient(#3597d4, #ffffff);background-repeat: no-repeat; }
div{font-family:'microsoft yahei', Courier, monospace; font-size: 14px; box-sizing: border-box;  }
a{text-decoration: none; color: #3597d4; font-size: 16px;}
a:hover{ }
li{display: block;}
img{ border: none;}
input,select{ outline: none;}

.layui-table{  color: #000;}

[v-cloak]{display: none;}
.fc-000{ color: #000000;}
.fc-333{color: #333333;}
.fc-red{color: #ff0028;}
.fc-green{color: #009688;}
.fc-lv{color:#16baaa}
.fc-lan{color: #3597d4;}
.fc-999{color: #999;}
.fc-ccc{color: #ccc;}
.fc-eee{color: #eee;}
.fc-cheng{color: #ff6629;}
.fc-huang{color: #fcd601;}a.fc-huang{color: #fcd601;}

.bold{font-weight: bold;}

.f12{font-size: 12px;}
.f13{font-size: 13px;}
.f14{font-size: 14px;}
.f16{font-size: 16px}
.f18{font-size: 18px;}
.f20{font-size: 20px;}
.f24{font-size: 24px;}.f28{font-size: 28px;}

.pd15{ padding:15px}
.mt5{margin-top: 5px;}.mt10{margin-top: 10px;}.mt20{margin-top: 20px;}
.mr5{margin-right: 5px;}.mr10{margin-right: 10px;}.mr20{margin-right: 20px;}
.ml5{margin-left: 5px;}.ml10{margin-left: 10px;}.ml20{margin-left: 20px;}
.pb-bot{padding-bottom: 13px;} .pt0{ padding-top: 0px;}.pb0{ padding-bottom: 0;}


.flex{display: flex;}
	.f1{ flex: 1;}
	.fx-r{justify-content:flex-end}
	.fx-c{justify-content:center}
	.fx-w{justify-content:space-between}
	.fx-m{justify-content:space-around}
	.fy-top{ align-items: flex-start}
	.fy-bot{  align-items: flex-end}
	.fy-c{align-items:center }
	.fy-h{ align-items: stretch}
	.fd-down{flex-direction:column}
	.fwrap{flex-wrap: wrap;}
    .layui-select{-webkit-appearance:auto;height: 30px;}
    .layui-input{border-color: #bbb;height: 30px;} 
    .layui-input.w50{ width: 50px;}.layui-input.w100{ width: 100px;}.layui-input.w150{ width: 150px;}
    .layui-input.w200{ width: 200px;}.layui-input.w300{ width: 300px;} 
    .layui-layer-btn .layui-layer-btn0 {  background-color: #16baaa;   color: #fff;  }
 

.header{width: 100%;  padding:5px 0; color: #fff; }   
.header .top{ display: flex; width: 1200px; margin-left: auto; margin-right: auto; align-items:center}
.header .logo img{ height: 40px;}
.header .city{  }
.header .login{display: flex;}
.header .login a{font-size: 14px;}


.w1200{ width: 1200px; margin-left: auto; margin-right: auto;}
.fl{float: left;}
.fr{float: right;}
.clear{ clear: both;}
.ml20{ margin-left: 20px;}
.mt20{ margin-top: 20px;} .mt10{ margin-top: 10px;}
.mr20{ margin-right: 20px;} .mr10{ margin-right: 10px;}
.mb20{ margin-bottom: 20px;} .mb10{ margin-bottom: 10px;}
.f16{ font-size: 16px;}.f18{font-size: 18px;}
.bgf{ background-color: #FFFFFF;}
.hidden{ display: none;}
.align-c{text-align: center;}

.nav{ display: flex;   margin: 10px auto; margin-left: 100px; flex:1 }
.nav .all{  padding: 0  ; height: 50px; } 
.nav  a{ display: block; color: #fff; border: 1px solid #fff; border-radius:2px; margin-left: 5px;  font-size:14px; line-height:30px; width:100px;  text-align:center;  cursor:pointer;}
.nav a:hover,.nav a.cur{ border:1px solid #f0ad4e; background-color: #f0ad4e; color: #fff;  }

.main{ background-color:#fff; padding:20px; border-top:0px solid #16baaa; margin-top:10px;}
.main .info{ width: 220px;  border: 2px solid #eee;  padding: 20px; line-height:200%; padding-bottom: 0; position: relative; }
.main .info .tit{ font-size: 16px; font-weight: bold;}
.main .info .li{ text-align: center;  display: block; margin:16px auto; line-height: 150%;}
.main .info .li i{font-size: 38px;color: #83b41a; }
.main .info a{color: #333; font-weight: bold;}
.main .info .tag{ position: absolute; left: -12px; top:-10px}

.main .shuoming{ width: 220px;  background:url(../images/shuoming.png) top center no-repeat; color:#fff; padding: 20px; line-height:200%; padding-bottom: 0;}
.main .shuoming .tit{ font-size: 18px;   text-align: center; margin-top: 20px;}

.main .bs{flex:1; margin-left: 20px; display: flex;flex-wrap: wrap;}
.main .bs .li{ width: 110px; height: 110px; margin-right: 20px; margin-bottom:10px; text-align: center;
    padding:10px;  box-sizing: border-box; }
.main .bs .li:nth-child(3n){  margin-right: 0px;}
.main .bs .li:nth-child(n+3){  margin-bottom: 0px;}
.main .bs .li i{font-size: 50px;color: #ec5f5b; }
.main .bs .li .btn{font-size:16px;  border-radius: 20px; line-height: 30px;text-align: center;
    margin-top:6px; color: #333;}
.main  .li.huang i{ color: #f5c95d;}
.main  .li.lv i{ color: #63c899;}
.main  .li.qing i{ color: #a6c863;}
.main  .li.lan i{ color: #638ec8;}

.table{ border-top: 1px solid #ddd; border-right: 1px solid #ddd;}
.table td,.table th{ border-left:1px solid #ddd; border-bottom: 1px solid #ddd; padding:10px;}
.table th{ background:#f1f4f6; text-align: left; }
.table{ width: 100%;}

.layui-layer-molv .layui-layer-title{background:#16ba82;color:#fff;border:none}
.layui-btn.layui-btn-primary:hover{color:#3597d4;}

.layui-table td{padding:8px;}
.layui-table[lay-skin=row]{border-color:#666}
.layui-table td,.layui-table th{border-color: #666;}

/* 修改checkbox边框颜色 */
.layui-form-checkbox[lay-skin="primary"] i {
    border-color: #1E9FFF; /* 修改为所需的边框颜色 */
}
 
/* 修改checkbox勾选图标颜色 */
.layui-form-checked[lay-skin="primary"] i,
.layui-form-checked:hover[lay-skin="primary"] i {
    border-color: #3597d4; /* 修改为所需的边框颜色 */
    background-color: #3597d4; /* 修改为所需的图标背景颜色 */
    color: #fff; /* 图标颜色 */
}
/* 改变未选中状态的 Radio 按钮颜色 */
.layui-form-radio>i,.layui-form-radioed>i, .layui-form-radio>i:hover {   border-color: #3597d4; /* 边框颜色 */}
 
/* 改变选中状态的 Radio 按钮的图标颜色 */
.layui-form-radioed>i::before, .layui-form-radio>i:hover::before {    color: #3597d4; /* 例如：#ffffff */}
.layui-form-radio>div,.layui-form-radioed>div, .layui-form-radio>div:hover  {  color: #333;  }