@charset "utf-8";
/* -----------J-ui前端后台框架-------------
* Copyright 红烧黄鼠狼 All rights reserved.
*/

/*初始化*/
html,body,h1,h2,h3,h4,h5,h6,hr,p,iframe,dl,dt,dd,ul,ol,li,pre,form,button,input,textarea,th,td,fieldset{ margin: 0; padding: 0;}
ul,li,ol,dl,dd { list-style: none; }
body { font: 12px/1.5 Tahoma,Verdana,Arial,"Microsoft YaHei"; color: #303133; background: #F0F3F4; }
a { color: #303133; text-decoration: none; outline: 0 none; -webkit-tap-highlight-color:rgba(0,0,0,0); }
img { border: none; }
input,textarea,button,select { outline: 0 none; font: 14px/1.5 Tahoma,"Lucida Grande",Verdana,"Microsoft Yahei",STXihei,hei; }
textarea { resize: none; box-sizing: border-box; }
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button{ -webkit-appearance: none !important; }
/*低版本IE提示*/
.browse_tips { height: 45px; line-height: 45px; font-size: 16px; color: #999; text-align: center; position: relative; background: #233646; position: fixed; top: 0; left: 0; right: 0; z-index: 9999; }
	.browse_tips .iconfont { margin-right: 5px; font-size: 17px; color: #FB6A49; }
	.browse_tips a { color: #FB6A49; }

/*图标*/
@font-face {
	font-family: 'iconfont';
    src: url('iconfont/iconfont.eot'); /* IE9*/
    src: url('iconfont/iconfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('iconfont/iconfont.woff') format('woff'), /* chrome、firefox */
    url('iconfont/iconfont.ttf') format('truetype'), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
    url('iconfont/iconfont.svg#iconfont') format('svg'); /* iOS 4.1- */
}
@font-face {
  font-family: 'DIN-Regular';
  src: url(fonts/DIN-Regular.5df569f.ttf) format('TrueType');
  font-weight: normal;
  font-style: normal;
}                
.iconfont{font-family:"iconfont";font-size:12px;font-style:normal; }

/*基础*/
.fl { float: left; }
.fr { float: right; }
.tl { text-align: left; }
.tc { text-align: center; }
.tr { text-align: right; }
.mc { margin: 0 auto; }
.pd5 { padding: 5px !important; }
.pd10 { padding: 10px !important; }
.pd15 { padding: 15px !important; }
.pd20 { padding: 20px !important; }
.pd30 { padding: 30px !important; }
.pd-t3 { padding-top: 3px !important; }
.pd-t5 { padding-top: 5px !important; }
.pd-t10 { padding-top: 10px !important; }
.pd-t15 { padding-top: 15px !important; }
.pd-t20 { padding-top: 20px !important; }
.pd-r5 { padding-right: 5px !important; }
.pd-r10 { padding-right: 10px !important; }
.pd-r15 { padding-right: 15px !important; }
.pd-r20 { padding-right: 20px !important; }
.pd-b5 { padding-bottom: 5px !important; }
.pd-b10 { padding-bottom: 10px !important; }
.pd-b15 { padding-bottom: 15px !important; }
.pd-b20 { padding-bottom: 20px !important; }
.pd-l5 { padding-left: 5px !important; }
.pd-l10 { padding-left: 10px !important; }
.pd-l15 { padding-left: 15px !important; }
.pd-l20 { padding-left: 20px !important; }
.mg5 { margin: 5px !important; }
.mg10 { margin: 10px !important; }
.mg15 { margin: 15px !important; }
.mg20 { margin: 20px !important; }
.mg-t5 { margin-top: 5px !important; }
.mg-t10 { margin-top: 10px !important; }
.mg-t15 { margin-top: 15px !important; }
.mg-t20 { margin-top: 20px !important; }
.mg-t25 { margin-top: 25px !important; }
.mg-t30 { margin-top: 30px !important; }
.mg-b5 { margin-bottom: 5px !important; }
.mg-b10 { margin-bottom: 10px !important; }
.mg-b15 { margin-bottom: 15px !important; }
.mg-b20 { margin-bottom: 20px !important; }
.mg-b25 { margin-bottom: 25px !important; }
.mg-b30 { margin-bottom: 30px !important; }
.mg-l5 { margin-left: 5px !important; }
.mg-l10 { margin-left: 10px !important; }
.mg-l15 { margin-left: 15px !important; }
.mg-l20 { margin-left: 20px !important; }
.mg-l25 { margin-left: 25px !important; }
.mg-l30 { margin-left: 30px !important; }
.mg-r5 { margin-right: 5px !important; }
.mg-r10 { margin-right: 10px !important; }
.mg-r15 { margin-right: 15px !important; }
.mg-r20 { margin-right: 20px !important; }
.mg-r25 { margin-right: 25px !important; }
.mg-r30 { margin-right: 30px !important; }
.bd { border: #ddd solid 1px; }
.bd-t { border-top: #ddd solid 1px; }
.bd-r { border-right: #ddd solid 1px; }
.bd-b { border-bottom: #ddd solid 1px; }
.bd-l { border-left: #ddd solid 1px; }
.hidedot { white-space: nowrap; word-break: keep-all; overflow: hidden; text-overflow: ellipsis; }
.clearfix { zoom: 1; }
.clearfix:after{ visibility: hidden; display: block; font-size: 0; content: "."; clear: both; height: 0; }
.hide { display: none; }
.show { display: block; }

/*字号*/
.fs12 { font-size: 12px; }
.fs14 { font-size: 14px; }
.fs15 { font-size: 15px; }
.fs16 { font-size: 16px; }
.fs18 { font-size: 18px; }
.fs20 { font-size: 20px; }
.fs22 { font-size: 22px; }
.fs24 { font-size: 24px; }
.fs26 { font-size: 26px; }
.fs28 { font-size: 28px; }
.fs30 { font-size: 30px; }
.fs32 { font-size: 32px; }
.fs34 { font-size: 34px; }
.fs36 { font-size: 36px; }

/*行距*/
.lh16 { line-height: 16px; }
.lh18 { line-height: 18px; }
.lh20 { line-height: 20px; }
.lh22 { line-height: 22px; }
.lh24 { line-height: 24px; }
.lh26 { line-height: 26px; }
.lh28 { line-height: 28px; }
.lh30 { line-height: 30px; }
.lh32 { line-height: 32px; }
.lh34 { line-height: 34px; }
.lh36 { line-height: 36px; }

/*字色*/
.c-blue { color: #1890FF; }
.c-red { color: #FC4949; }
.c-green { color: #68C23A; }
.c-org { color: #E6A23C; }
.c-white { color: #fff; }
.c-000 { color: #000; }
.c-333 { color: #303133; }
.c-666 { color: #606266; }
.c-999 { color: #909399; }
.c-bbb { color: #c0c4cc; }


/*栅格布局*/
.row { margin-left: -8px; margin-right: -8px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.row:before,.row:after { display: table; content: " "; }
.row:after { clear: both; }
.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12 { min-height: 1px; padding-left: 8px; padding-right: 8px; float: left; box-sizing: border-box; }
.col-1  { width: 8.33333333%; }
.col-2  { width: 16.66666667%; }
.col-3  { width: 25%; }
.col-4  { width: 33.33333333%; }
.col-5  { width: 41.66666667%; }
.col-6  { width: 50%; }
.col-7  { width: 58.33333333%; }
.col-8  { width: 66.66666667%; }
.col-9  { width: 75%; }
.col-10 { width: 83.33333333%; }
.col-11 { width: 91.66666667%; }
.col-12 { width: 100%; }

/*flex布局 -- 只适应高版本浏览器 --*/
.flex-box { display: flex; display: -webkit-flex; }
	.flex-item { -webkit-box-flex: 1; -webkit-flex: 1; flex: 2; }


/*主体框架*/
.Jui-header { height: 50px; }
	.header-fixed { height: 50px; position: fixed; top: 0; left: 0; right: 0; z-index: 999; border-bottom: #EBF0F8 solid 1px; box-sizing: border-box; }
	.header-fixed .logo { width: 220px; height: 50px; padding: 13px 0 0 10px; background: #00284D; white-space:nowrap; font-family: "Microsoft YaHei"; box-sizing: border-box; }
	.header-fixed .logo img { height: 26px; margin: -9px 10px 0 0; display: inline-block; vertical-align: middle; }
	.header-fixed .logo span { font-size: 16px; }
	.header-fixed .systemTips ul { padding: 17px 0 0 0; overflow: hidden; font-size: 13px; }
	.header-fixed .systemTips li { margin-right: 15px; float: left; }
	.header-fixed .systemTips li span { min-width: 12px; height: 18px; line-height: 18px; border-radius: 18px; margin: -5px 5px 0 0; padding: 0 3px; text-align: center; background: #FF3300; color: #fff; display: inline-block; vertical-align: middle; }
	.header-fixed .systemTips li a:hover { color: #FF3300 }
.navbar li { line-height: 50px; font-size: 14px; float: left; }
	.navbar li .icon-user { width: 30px; height: 30px; margin: -3px 0 0 0; display: inline-block; vertical-align: middle; color: #7270FF; }
	.navbar li a { padding: 0 10px; display: block;  }
	.navbar li.drop { position: relative; }
	
.Jui-sidebar { width: 220px; overflow-y: auto; box-sizing: border-box; position: absolute; left: 0; top: 50px; bottom: 0; z-index: 99; }
	.menu-drop { font-size: 14px; }
	.menu-drop dt a { line-height: 50px; padding-left: 5px; font-size: 14px; display: block; color: #fff; position: relative; white-space:nowrap; }
	
	.menu-drop dt .icon { width: 24px; height: 24px; margin: -5px 8px 0 5px; background-size: 24px 48px; display: inline-block; vertical-align: middle; }
	.menu-drop dt img { width: 24px; height: 24px; margin: -5px 8px 0 5px; display: inline-block; vertical-align: middle; }
	.menu-drop dt .arrow { color: #fff; font-size: 12px; line-height: 20px; position: absolute; right: 15px; top: 14px; transform: rotate(-90deg); transition-duration: 0.2s; transition-property: all; }
	.menu-drop dt.selected .arrow { top: 15px; transform: rotate(0deg); }
	/*.menu-drop dt.selected a { color: #1890FF; }*/
	.menu-drop dt.selected .icon { background-position: 0 0; }
	.menu-drop dt.current a { background: #1890FF; color: #fff; }
	.menu-drop dt.current .icon { background-position: 0 0; }
	.menu-drop dd { display: none; }
	.menu-drop li a { padding: 0 15px 0 42px; line-height: 44px; display: block; color: #bbb; position: relative; white-space:nowrap; font-weight: bold;}
	.menu-drop li a:hover{color: #fff!important;}
	.menu-drop li a .arrow { color: #fff; font-size: 12px; line-height: 20px; position: absolute; right: 15px; top: 12px; transform: rotate(-90deg); transition-duration: 0.2s; transition-property: all; }
	.menu-drop li ul { display: none; }
	.menu-drop li ul li a { padding-left: 60px; }
	.menu-drop li.active a .arrow { top: 11px; transform: rotate(0deg); }
	.menu-drop a .num { height: 16px; line-height: 16px; margin: -4px 0 0 5px; padding: 0 5px; font-size: 12px; background: #FF3300; color: #fff; border-radius: 20px; display: inline-block; vertical-align: middle; }
	.menu-drop li.current a { background: #1890FF; color: #fff; }
	.menu-drop li.current a:before,.menu-drop li.current a:after {  }
.Jui-sidebar::-webkit-scrollbar{ width: 3px; height: 3px; background-color: #f5f5f5; }
.Jui-sidebar::-webkit-scrollbar-track{ background-color: #001529; }
.Jui-sidebar::-webkit-scrollbar-thumb{ background-color: #015099; }

.Jui-content { overflow: hidden; position: absolute; left: 220px; top: 50px; right: 0; bottom: 0; z-index: 9; }

.breadcrumb { height: 50px; padding: 0 15px; line-height: 50px; font-size: 14px; overflow: hidden; position: relative; z-index: 99; }
	.breadcrumb .route { color: #909399; position: relative; }
	.breadcrumb .route i { margin: -4px -3px 0 -3px; color: #909399; font-style: normal; font-size: 12px; display: inline-block; vertical-align: middle; }
	.breadcrumb .route a { color: #909399; }
	.breadcrumb .route a:hover { color: #1890FF; text-decoration: underline; }
	.breadcrumb .route span:last-child { color: #333; }
.main { position: absolute; left: 0; top: 50px; right: 0; bottom: 0; overflow: auto; }
.mainIframe { width: 100%; height: 100%; position: absolute; bottom: 0; }
.mainLeft { width: 200px; background: #fff; overflow: auto; box-shadow: 0 0 5px rgba(0,0,0,.05); position: absolute; top: 10px; left: 10px; bottom: 9px; }
.mainRight { height: 100%; margin-left: 210px; overflow: auto; position: relative; }
.screenRight { position: absolute; top: 15px; left: 15px; right: 15px; bottom: 15px; overflow-y: auto; }

.mainBody { height: 100%; position: relative; }
	.mainPageTitle { height:44px; line-height: 44px; padding: 0 15px; font-weight: bold; font-size: 15px; border:#eee solid 1px; background: #F9F9F9; border-bottom: #eee solid 1px; position: relative; }
	.mainPageTitle .tools { position: absolute; right: 15px; top: 50%; transform: translateY(-50%); }
	.mainPageTitle .tools a:hover { color: #3D86D9; }
	.mainPageBody { background:#fff;position: absolute; left:0;bottom:0;top:46px;right:0; overflow-y: auto; }

.Jui-sidebar,.Jui-content,.display-arrow,.dataTables_scrollHeadInner,.dataTables_scrollHeadInner table,.header-fixed .logo,.header-fixed .logo span { -moz-transition: all 0.2s ease 0s;-webkit-transition: all 0.2s ease 0s;-ms-transition: all 0.2s ease 0s;-o-transition: all 0.2s ease 0s;transition: all 0.2s ease 0s; }
.full-page .Jui-content { left: 50px; }
.full-page .Jui-sidebar { width: 50px; overflow: visible }
.full-page .header-fixed .logo { width: 50px; }
.full-page .header-fixed .logo span { opacity: 0; }
.full-page .menu-drop dl { position: relative; }
.full-page .menu-drop dt a span,.full-page .menu-drop dt .arrow { opacity: 0; }
.full-page .menu-drop dd { background: #001529; position: absolute; left: 50px; top: 0; overflow-y: auto; }
.full-page .menu-drop dd::-webkit-scrollbar{ width: 3px; height: 3px; background-color: #f5f5f5; }
.full-page .menu-drop dd::-webkit-scrollbar-track{ background-color: #001529; }
.full-page .menu-drop dd::-webkit-scrollbar-thumb{ background-color: #7270FF; }
.full-page .menu-drop li a { padding: 0 15px 0 15px; }
.full-page .menu-drop li ul { display: block !important; }
.full-page .menu-drop li ul li a { padding-left: 30px; }
.full-page .menu-drop li a .arrow { display: none; }

.display-arrow { width:50px; height: 50px; line-height: 50px; text-align:center; display:inline-block; }
	.display-arrow i { font-size: 20px; display: inline-block; }
	.display-arrow:hover { color: #7270FF; }
	.display-arrow-open i { transform: rotate(180deg); }

/* 加载效果 */
.Jui-load { background: rgba(255,255,255,.6); border-radius: 5px; box-shadow: 0 1px 3px 0 rgba(0,0,0,.4); position: absolute; left: 0; top: 0; right: 0; bottom: 0; z-index: 999; }

@keyframes rotate {
  0% {
    -webkit-transform: rotate(0deg) scale(1);
            transform: rotate(0deg) scale(1); }

  50% {
    -webkit-transform: rotate(180deg) scale(0.6);
            transform: rotate(180deg) scale(0.6); }

  100% {
    -webkit-transform: rotate(360deg) scale(1);
            transform: rotate(360deg) scale(1); } }

.ball-clip-rotate-multiple { width: 50px; height: 50px; position: relative; left: 50%; top: 50%; transform: translate(-50%,-50%); }
.ball-clip-rotate-multiple > div {-webkit-animation-fill-mode: both;animation-fill-mode: both;position: absolute;left: 8px;top: 8px;border: 2px solid #0081CC;border-bottom-color: transparent;border-top-color: transparent;border-radius: 100%;height: 30px;width: 30px;-webkit-animation: rotate 1s 0s ease-in-out infinite; animation: rotate 1s 0s ease-in-out infinite; }
.ball-clip-rotate-multiple > div:last-child {display: inline-block;top: 18px;left: 18px;width: 10px;height: 10px; -webkit-animation-duration: 0.5s;animation-duration: 0.5s;border-color: #FFAE38 transparent #FFAE38 transparent;-webkit-animation-direction: reverse;animation-direction: reverse; }


/* 用户控制面板 */
.userInfoPanel { position: absolute; right: 15px; top: 44px; display: none; }
.userInfoPanel .inner { height: 100%; padding-top: 5px; background: #fff; font-size: 13px; line-height: 20px; position: relative; border-radius: 4px; box-shadow: 0 1px 15px rgba(194,200,231,.5);; box-sizing: border-box; overflow: hidden; }
	.userInfoPanel p { padding: 6px 15px 0 15px; white-space:nowrap; }
	.userInfoPanel p label { width: 90px; display: inline-block; color: #888; }
	.userInfoPanel .arrow { padding-right: 15%; text-align: right; line-height: 0; position: relative; z-index: 2; }
	.userInfoPanel .arrow span { width: 0; height: 0; border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 8px solid #EBF0F8; display: inline-block; vertical-align: middle; }
	.userInfoPanel .arrow span i { width: 0; height: 0; margin: 2px 0 0 -8px; border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 8px solid #fff; display: inline-block; vertical-align: middle; }
	.userInfoPanel ul { margin-top: 10px; border-top: #eee solid 1px; }
	.userInfoPanel li { width: 100%; line-height: 16px; float: none; font-size: 12px; }
	.userInfoPanel li a { padding: 9px 15px; }
	.userInfoPanel li a i { margin: -3px 5px 0 0; font-weight: bold; font-size: 15px; display: inline-block; vertical-align: middle; }
	.userInfoPanel li a:hover { background: #F5F7FF; }

/* 消息通知 */
.noticePanel { position: absolute; right: 15px; top: 44px; display: none;width: 450px;height: auto; }
.noticePanel .inner { height: 100%; padding-top: 5px; background: #fff; font-size: 13px; line-height: 20px; position: relative; border-radius: 4px; box-shadow: 0 1px 15px rgba(194,200,231,.5);; box-sizing: border-box; overflow: hidden; }
.noticePanel p { padding: 6px 15px 0 15px; white-space:nowrap; margin-top: 3px;}
.noticePanel p label { width: 90px; display: inline-block; color: #888; }
.noticePanel p span { width: 90px; display: inline-block; color: #888; }
.noticePanel .arrow { padding-right: 15%; text-align: right; line-height: 0; position: relative; z-index: 2; }
.noticePanel .arrow span { width: 0; height: 0; border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 8px solid #EBF0F8; display: inline-block; vertical-align: middle; }
.noticePanel .arrow span i { width: 0; height: 0; margin: 2px 0 0 -8px; border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 8px solid #fff; display: inline-block; vertical-align: middle; }
.noticePanel ul { margin-top: 10px; border-top: #eee solid 1px; }
.noticePanel li { width: 100%; line-height: 16px; float: none; font-size: 12px; }
.noticePanel li a { padding: 9px 15px; }
.noticePanel li a i { margin: -3px 5px 0 0; font-weight: bold; font-size: 15px; display: inline-block; vertical-align: middle; }
.noticePanel li a:hover { background: #F5F7FF; }