/*公共颜色*/
:root {
    --N1-1: #f4f8fb; /*  页面背景色 [通用页面背景色使用] */
    --N1-2: #FFFFFF; /*  白色 */

    --B1-1: #3979e5; /* 品牌色浅色 */
    --B1-5: #0057fc; /* 品牌色*/
    --B1-6: #008dff; /* 品牌色*/
    --B1-7: #008dff; /* 品牌色轻色 */


    --S1-6: #fdae38; /* 金色 S1-6 [页面辅助色]*/
    --S2-6: #ed2f53; /* 红色 S2-6  [文本颜色、错误提示] */
    --S3-6: #4cd964; /* 绿色 S3-6  [正确提示] */
    --S4-6: #3979e5; /* 蓝色 S4-6  [正确提示] */
    --S5-6: #717485; /* 灰色 S5-6  [正确提示] */
    --S6-6: #999; /* 灰色 S5-6  [正确提示] */
    /* 文字颜色*/
    --N2-1: #363A44; /* 深色 [文本颜色、行动点图标与文字]*/
    --N2-2: #686b73; /* 灰色 [弱化文本]*/
    --N2-6: #999999; /* 灰色 [弱化文本]*/
    --N2-3: #B3B5B9; /* 灰色 [水印文本]*/
    --N2-4: #B9BCBF; /* 灰色 [不可用颜色]*/
    --N2-5: #FFFFFF; /* 白色 [白色文字]*/
    /* 遮罩层颜色*/
    --N3-1: #000000; /* 遮罩层颜色 [通用页面弹出层下使用的遮罩层]*/
    --N4-1: #E8E9EC; /* 分割线\描边线颜色 */
    /* 圆角大小*/
    --BorderRadius-min: 5px; /* 圆角小*/
    --BorderRadius-max: 10px; /* 圆角大*/
    /* 间距s*/
    --S1: 6px; /* 间距s1*/
    --S2: 10px; /* 间距s2*/
    /* 常规版*/
    /* 文字大小*/
    --headilneSize: 16px; /* 页面标题*/
    --titleSize: 18px; /* 标题中*/
    --SubheadSize: 16px; /* 标题小*/
    --ContentSize: 14px; /* 正文*/
    --CaptionSize: 13px; /* 水印文字 / 辅助文字*/
    --FootnoteSize: 12px; /* 备注*/

    --max_width: 800px;
    --van-overlay-z-index:111;
}



/*常规样式*/
*{ padding: 0; margin: 0;	font-family: "微软雅黑", Microsoft yahei;font-size: 15px; }
html { overflow-x: hidden;	font-size: 14px; position: relative; min-height: 100%;	background: var(--N1-1);}
body{background: var(--N1-1); margin: 0; padding: 0;}
.content_m{ max-width: var(--max_width); margin: auto;}
img { border: 0; vertical-align: bottom; max-width: 100%;}
a, a:link, a:visited, a:focus, a:hover, a:active {color: var(--N2-1); text-decoration: none; cursor: pointer;}
table {width: 100%; max-width: 100%; border-collapse: collapse; border-spacing: 0; border: 1px solid var(--N2-4);}
td, th { padding:.5em; font-size: 14px; text-align: center; border-right: 1px solid var(--N2-4); border-bottom: 1px solid var(--N2-4);}

.xl_input{ line-height:36px;  border:1px solid #ccc; display:block; border-radius:8px; width:94%; padding:0 3%; }

/* 常规版——文字标题*/
.headilne{font-size: var(--headilneSize); font-weight: bold; color:var(--N2-5);} /* 页面标题*/
.title{font-size: var(--titleSize); font-weight: bold; color:var(--N2-1); line-height: 36px;} /* 标题中*/
.Subhead{font-size: var(--SubheadSize); font-weight: bold; color:var(--N2-1);line-height: 28px;} /* 标题小*/
.Subhead_min{font-size: var(--SubheadSize);  color:var(--N2-1);line-height: 28px;} /* 标题小*/
.Content{font-size: var(--ContentSize); color:var(--N2-2); line-height: 24px;  word-wrap: break-word;} /* 正文*/
.Content_fw{font-size: var(--ContentSize); color:var(--N2-1);  font-weight: 600;} /* 正文加粗颜色加深*/
.Caption{font-size: var(--CaptionSize); color:var(--N2-3);} /* 水印文字 / 辅助文字*/
.Caption_1{font-size: var(--CaptionSize); color:var(--N2-6);} /* 水印文字 / 辅助文字*/
.Footnote{font-size: var(--FootnoteSize); color:var(--N2-3); line-height: 22px;} /* 备注*/


.red{color:var(--S2-6)!important;}
.blue{color:var(--S4-6)!important;}
.green{color:green!important;}
.xl_bj_red{ background:var(--S2-6)!important;}
.xl_bj_blue{background:var(--S4-6)!important;}
.xl_bj_green{background:var(--S3-6)!important}
.xl_bj_grey{background:var(--S5-6)!important}

/*标题只显示行数*/
.Showline_1 {	text-overflow: -o-ellipsis-lastline;	overflow: hidden;	text-overflow: ellipsis;	display: -webkit-box;	-webkit-line-clamp: 1;	-webkit-box-orient: vertical;}
.Showline_2 {	text-overflow: -o-ellipsis-lastline;	overflow: hidden;	text-overflow: ellipsis;	display: -webkit-box;	-webkit-line-clamp: 2;	-webkit-box-orient: vertical; }
.Showline_3 {	text-overflow: -o-ellipsis-lastline;	overflow: hidden;	text-overflow: ellipsis;	display: -webkit-box;	-webkit-line-clamp: 3;	-webkit-box-orient: vertical;}

/* div富文本框*/
.xl_werd_fwbkbj {background: #fff;border: none;line-height: 26px; min-height :120px; color : var(--N2-2 ); user-modify: read-write; -webkit-user-modify: read-write; overflow-wrap: break-word; padding-left: 5px;}
.xl_werd_fwbkbj:empty::before {content: attr(placeholder);color: #ccc;}
.xl_werd_fwbkbj:focus-visible {border: none;background: none;outline: none;}

/* 用户模块*/
.xl_uesr_img{ border-radius:10px; overflow:hidden;}
.xl_user_xs{border-radius:10px; width:32px; height:32px; margin-right:10px;}


/* 按钮*/
.anniu{background-image: linear-gradient(to bottom, var(--B1-6),var(--B1-7)); border-radius: 20px; display: inline-block; font-size:15px; line-height: 30px; padding: 0 15px; color: var(--N2-5);}

.xl_color_0{/* 待审核*/color:var(--S4-6);}
.xl_color_1{/* 已同意*/color:var(--S3-6);}
.xl_color_2{/* 已拒绝*/color:var(--S2-6);}
.xl_color_3{/* 已取消*/color:var(--S5-6);}

/* 提示*/
.xl_yuanqian{ width:16px; height:16px; border-radius:10px; border:1px solid #999; display:inline-block;}
.xl_dian{ /* new 提示 （点）*/background:var(--S2-6); display:inline-block; width:8px; height:8px; border-radius:5px; margin-right:10px;}
.xl_bitian {/* 必填提示*/ background: #feb32e;padding: 0px 6px;color: #fff;font-size: 13px;border-radius: 20px;line-height: 22px; font-size:13px;font-weight: normal;}
.xl_chuiban{ /* 催办*/ background:var(--S4-6); color:var(--N2-5); font-weight:normal; padding:0 8px; border-radius:20px; border-top-right-radius:0px; line-height:20px; font-size:13px; display:inline-block;}

.prompt{ /* 标签*/background:var(--S4-6); line-height:24px; padding:0 8px; margin:0 3px; border-radius:5px; display:inline-block; color:var(--N2-5);}
.prompt1{ /* 标签*/background:var(--S4-6); line-height:20px; padding:0 5px; margin:0 5px; border-radius:5px; display:inline-block; color:var(--N2-5);}

.xl_prompt1{/* 标签*/ position:absolute; top:0px; right:0; line-height:22px; font-size:13px; padding:0 8px; margin:0 3px; border-radius:10px 0 10px 10px; display:inline-block; color:var(--N2-5);}


.xl_Signedin{ /* 已签到*/ border:1px solid var(--S4-6); color:var(--S4-6); font-weight:normal; padding:0 8px; border-radius:10px; line-height:24px; display:inline-block;}
.xl_NotSignedin{ /* 未签到*/ border:1px solid var(--S1-6); color:var(--S1-6); padding:0 8px; font-weight:normal; border-radius:10px; line-height:24px; display:inline-block;}
.xl_grey{ /* 灰色提示 已补卡*/ border:1px solid var(--S5-6); color:var(--S5-6); padding:0 8px;min-width:46px; text-align:center;  font-weight:normal; border-radius:10px; line-height:24px; display:inline-block;}
.xl_qingjia1{ /* 绿色提示 已请假*/ border:1px solid var(--S3-6); color:var(--S3-6); padding:0 8px;min-width:46px; text-align:center;  font-weight:normal; border-radius:10px; line-height:24px; display:inline-block;}


.abnormal_bottom{/*按钮  异常处理*/ line-height:32px; display:inline-block;padding:0 20px; color:var(--N2-2); border:1px solid var(--N2-2); border-radius:5px; font-size:16px;}
.botton {/* 主色调按钮*/ display: block; height: 45px;line-height: 45px; background: var(--B1-1);border-radius: 8px;font-size: 16px; color: var(--N2-5); text-align:center;}
.bottonon{/* 灰色调按钮*/ display: block; height: 45px;line-height: 45px; background: #999;border-radius: 8px;font-size: 16px; color: var(--N2-5); text-align:center;}

.botton_duan {/* 主色调按钮*/ display: inline-block; padding:0 20px; height: 40px;line-height: 40px; background: var(--B1-1);border-radius: 8px;font-size: 16px; color: var(--N2-5); text-align:center;}


.xl_refuse{/* 拒绝按钮*/ display: inline-block; padding:0 20px; height: 40px;line-height: 40px; background: #999;border-radius: 8px;font-size: 16px; color: var(--N2-5); text-align:center;}
.xl_pass{/* 通过按钮*/ display: inline-block; padding:0 20px; height: 40px;line-height: 40px; background: var(--B1-1);border-radius: 8px;font-size: 16px; color: var(--N2-5); text-align:center;}
.xl_pass_wz{ /* 通过文字提示*/color:var(--B1-1); font-weight:600; color:var(--N2-2); font-weight:600;}
.xl_refuse_wz{ /* 拒绝文字提示*/color:var(--S2-6); font-weight:600; color:var(--N2-2); font-weight:600;}
.xl_wshengpi_wz{ /* 未审批文字提示*/color:var(--N2-2); font-weight:600;color:var(--N2-2); font-weight:600;}

.xl_shzt_wz{ /* 文字提示*/color:var(--N2-2); font-weight:600;}


.xl_yshengpi{ /* 已审批*/ background:var(--S4-6); color:var(--N2-5);font-size:13px; font-weight:normal; padding:0 8px; border-radius:20px; border-top-right-radius:0px; line-height:22px; display:inline-block;}
.xl_wshengpi{ /* 未审批*/ background:var(--S6-6); color:var(--N2-5);font-size:13px; font-weight:normal; padding:0 8px; border-radius:20px; border-top-right-radius:0px; line-height:22px; display:inline-block;}

.xl_guanbi{ position:absolute; top:-5px; right:-5px; width:26px; height:26px; line-height:26px; text-align:center; background:#ccc; border-radius:15px;}
.xl_guanbi .iconfont{ color:#fff;}
/* 页面顶部提示条*/
.xl_pointout { /* 提示标签*/padding: 10px;background: #f8efe6;border-radius: 10px;color: var(--N2-2);font-size: 14px;line-height: 20px;}
.xl_pointout .iconfont {color: var(--S1-6);font-size: 18px;font-weight: 600;margin-right: 5px}

/* 框*/
.werd{background:var(--N1-2) ;  padding:  var(--S2); border-radius: var(--BorderRadius-max); box-sizing: border-box;}
.werd_h{background:var(--N1-1) ;  padding: var(--S2); border-radius: var(--BorderRadius-max); box-sizing: border-box;}

.werd_img{height:220px; overflow:hidden;}

/*对齐方式*/
.xl_space_between { /*两端对其*/ display: flex;flex-wrap: wrap;justify-content: space-between;	}
.xl_flex_start { /*左对其*/ display: flex; flex-wrap: wrap; justify-content: flex-start;}
.xl_flex_center { /*居中对其*/display: flex; position: relative; justify-content:center;}
.xl_flex_end { /*右对其*/ display: flex;flex-wrap: wrap;justify-content: flex-end;	}
.xl_flex_center_center { /*上下居中左右居中*/display: flex; position: relative; flex-direction: row; align-items: center; justify-content: center; }
.xl_start_center{ /*右对其 居中对其*/display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; flex-direction: row;}
.xl_space_between_center { /*两端对其*/ display: flex; position: relative; flex-direction: row; align-items: center; justify-content: space-between;	}
.xl_align_end{/*上下居底*/display: flex; position: relative; flex-direction: row; align-items: flex-end;}
.xl_align_center{/*上下居中*/display: flex; position: relative; flex-direction: row; align-items: center;}


/*线条*/
.xl_xx { border-bottom:1px solid var(--N4-1);}
.xl_top_xx { border-top:1px solid var(--N4-1);}
.xl_left_x{border-right:1px solid var(--N4-1);}

.xl_left_xx{/*标题左侧的蓝色线条*/  height:18px; width:4px; display:inline-block; background:var(--B1-1); border-radius:2px; margin-right:12px;}

.xl_box{ border:1px solid #f4f4f4; padding:10px;}

/*公共顶部*/
.xl_top{}
.xl_top .xl_top_hi {height: 50px;}
.xl_top .xl_top_row {position: fixed;top: 0;width: 100%;max-width: var(--max_width);margin: auto;background-color: var(--B1-1);height: 50px;line-height: 50px;text-align: center;color: #fff;z-index: 22; }
.xl_top .xl_top_title {color: #fff;font-size: 18px;font-weight: 600;}
.xl_top .van-nav-bar .van-icon {color: #fff}

/*公共底部按钮*/
.xl_buttom_hi {height: 60px;}
.xl_buttom {position: fixed;  bottom: 0px; width: 100%;max-width:var(--max_width);margin:auto; background:var(--N1-2) ; height: 55px;text-align: center; padding-top: 8px;  z-index:20; box-shadow:none;	}
.xl_buttom2 {position: fixed;  bottom: 59px; width: 100%;max-width:var(--max_width);margin:auto; background:var(--N1-2) ; height: 55px;text-align: center; padding-top: 8px; z-index:20; box-shadow:none;	}
.xl_buttom .botton {width: 90%;display: block;height: 45px;line-height: 45px; background: var(--B1-1);border-radius: 8px;font-size: 16px; color: var(--N2-5); margin: 0 5%;}
.xl_buttom .bottonon {width: 90%;display: block;height: 45px;line-height: 45px;background: #999;border-radius: 8px; font-size: 16px; color: var(--N2-5);margin: 0 5%;}
.xl_buttom .botton .iconfont{ font-size:16px; color:var(--N2-5); margin-right:10px;}

/*公共底部*/
.xl_tabbar {height: 55px;background: var(--N1-2);position: fixed;display: block;z-index: 1;bottom: 0px;width: 100%;max-width: var(--max_width);margin: auto;box-shadow: 5px 5px 10px #ccc;}
.xl_tabbar .xl_tabbar_werd {text-align:center; padding-top:3px; }
.xl_tabbar .xl_tabbar_werd .iconfont{ width:30px; height:28px; line-height:28px; color: var(--N2-2); font-size:20px !important;}
.xl_tabbar .xl_tabbar_werd .xl_tabbar_title1 {color: var(--N2-2);line-height: 20px; font-size: 14px; }
.xl_tabbar .xl_tabbar_werd .xl_tabbar_title {color: var(--N2-2);line-height: 53px; font-size: 14px; margin-top:2px; }
.xl_tabbar .xl_tabbar_werd .xl_tabbar_on{color:var(--B1-1);}
.xl_tabbar .xl_tabbar_werd .xl_tabbar_on .iconfont{color:var(--B1-1);}

/**/
.padding10 {padding: 10px}
.padding5 {padding: 5px}
.padding0{padding:0px !important; }
.padding_bottom {padding-bottom: 10px}
.padding_top {padding-top: 10px}
.margin10 { margin: 10px 0;}
.margin_left5 { margin-left: 5px;}
.margin_left10 { margin-left: 10px;}
.margin_right5 { margin-right: 5px;}
.margin_right10 { margin-right: 10px;}
.margin_right20 { margin-right: 20px;}
.margin_top5 { margin-top: 5px;}
.margin_top10 { margin-top: 10px;}
.margin_bottom10 { margin-bottom: 10px;}
.margin_bottom5 { margin-bottom: 5px;}


.van-cell-group { margin: 0px;}


/*弹窗*/
.wrapper {display: flex; align-items: center; justify-content: center;height: 100%; }
.block {width: 80%;min-height: 40%;background-color: #fff; border-radius:10px; position:relative; }
.block .title{ height:50px; line-height:50px; background:var(--N1-1); text-align:center; position:relative; border-top-left-radius:10px; border-top-right-radius:10px;}
.block .title .iconfont{ position:absolute; top:-40px; right:10px; font-size:28px; color:#fff;}
.block .bottom{ position:absolute; width:100%; bottom:10px;}

.icon-ppt{/*icon ppt*/ font-size:30px; color:#0cbf03;}
.icon-excel{ /*icon excel*/ font-size:30px; color:#fb626d;}
.icon-word{ /*icon werd*/ font-size:30px; color:#3979e5;}
.icon-pdf{ /*icon PDF*/ font-size:30px; color:#fdae38;}
.icon-video{ /*icon video*/ font-size:30px; color:#fdae38;}
.icon-qt{ /*icon qt*/ font-size:30px; color:#3979e5;}

/*icon*/
.xl_qingjia{ /*icon 请假*/ font-size:30px; color:#0cbf03;}
.xl_buka{ /*icon 补卡 */font-size:34px; color:#fb626d;}