@charset "utf-8";
/* FUI2025 */
:root { --color-white: rgba(255,255,255,1); /* 白色 */
 --color-black: rgba(0,0,0,1);/* 黑色 */
 --color-gray: rgba(184,192,197,1); /* 灰色 */
 --color-pale: rgba(237,237,237,1); /* 淡色 */
 --color-r: rgba(240,60,0,1); /* 红色 */
 --color-g: rgba(62,179,50,1); /* 绿色 */
 --color-b: rgba(0,82,217,1); /* 蓝色 */
 --color-o: rgba(243,120,0,1); /* 橙色 */
 --color-p: rgba(140,60,240,1); /* 紫色 */
 --opacity: 0.7; /* 透明度 */
 --radius-2: 2px; /* 默认圆角 */
 --radius-25: 25px; /* 半圆角 */
 --radius-50: 50%; /* 圆形圆角 */
}
.fui .cr-r { color: var(--color-r);}
.fui .cr-g { color: var(--color-g);}
.fui .cr-b { color: var(--color-b);}
.fui .cr-o { color: var(--color-o);}
.fui .cr-p { color: var(--color-p);}

/*动画*/
 @keyframes fadeInLeft { from {opacity: 0; transform: translateX(-50px);}to { opacity: 1; transform: translateX(0); }}
 @keyframes fadeInRight { from {opacity: 0;transform: translateX(50px);}to { opacity: 1; transform: translateX(0); }}
 @keyframes fadeInDown { from {opacity: 0;transform: translateY(50px);}to { opacity: 1; transform: translateY(0); }}
 @keyframes fadeInUP { from {opacity: 0;transform: translateY(-50px);}to { opacity: 1; transform: translateY(0); }}
 @keyframes zoomIn { from {transform: scale(0.5);opacity: 0;}to { transform: scale(1); opacity: 1; }}
 @keyframes rotateIn { from {transform: rotate(-180deg);opacity: 0;}to { transform: rotate(0); opacity: 1; }}
 @keyframes flipInX { from {transform: perspective(400px) rotateX(90deg);opacity: 0;}to { transform: perspective(400px) rotateX(0); opacity: 1; }}
 @keyframes flipInY { from {transform: perspective(400px) rotateY(90deg);opacity: 0;}to { transform: perspective(400px) rotateY(0); opacity: 1; }}
.an-l { animation: fadeInLeft 1s ease forwards; }
.an-r { animation: fadeInRight 1s ease forwards; }
.an-d { animation: fadeInDown 1s ease forwards; }
.an-u { animation: fadeInUP 1s ease forwards; }
.an-z { animation: zoomIn 1s ease forwards; }
.an-i { animation: rotateIn 1s ease forwards; }
.an-x { flipInX: fadeInLeft 1s ease forwards; }
.an-y { animation: fadeInLeft 1s ease forwards; }

html, body { scroll-behavior: smooth; margin: 0px; padding: 0px; }
/*组件*/
.fui { font-size: 14px;  }
.fui fieldset { border: 1px solid #e1e1e1; padding: 10px; }
.fui hr { height: 1px; background: rgba(0,0,0,.1); -webkit-transform: scaleY(0.5); -webkit-transform-origin: 0 0; overflow: hidden; clear: both; margin-bottom: 10px; border: 0; margin-top: 10px; }
.fui h1 { font-size: 24px; font-weight: 400; margin-bottom: 10px; }
.fui h2 { font-size: 20px; font-weight: 400; margin-bottom: 10px; }
.fui h3 { font-size: 18px; font-weight: 400; margin-bottom: 10px; }
.fui h4 { font-size: 15px; font-weight: 400; margin-bottom: 10px; }
.fui h5 { font-size: 12px; font-weight: 400; margin-bottom: 10px; }
.fui a {  font-weight: 400;  color: #000; text-decoration: none; }
.fui a:hover {opacity: var(--opacity); }
.fui ul { margin: 0px; padding: 0px; list-style-type: none; }
.fui img { image-rendering: -moz-crisp-edges; image-rendering: -o-crisp-edges; image-rendering: -webkit-optimize-contrast; image-rendering: crisp-edges; -ms-interpolation-mode: nearest-neighbor; max-width: 100%; }
/*布局*/

.fui .g-l { display: grid; grid-template-columns: auto 1fr; min-width: 0; gap: 10px; justify-content: space-between; }
.fui .g-lr { display: grid;grid-template-columns: repeat(2, 1fr); min-width: 0; gap: 10px; justify-content: space-between; vertical-align: middle; }/* 两端对齐 */
.fui .g-lr > div:last-child { margin-left: auto;}
@media (max-width: 768px) {.fui .g-lr {grid-template-columns: 100%; }}
  
/*分组*/
.fui .g { display: inline-flex; position: relative; margin: 10px; }
.fui .g b{ font-size: 12px; background-color: #FFF; padding-right: 5px; padding-left: 5px; position: absolute; left: 10px; top: -7px; font-weight: normal; }
.fui .g i{ line-height: 10px; color: #FFF; background-color: #F00; text-align: center; position: absolute; z-index: 3; top: -3px; right: -2px; display: block; border-radius: 50%; height: 10px; width: 10px; cursor: pointer; }

.fui .g input{ margin-right: 2px; }
.fui .g select{ padding: 8px; }
 
.fui .g0 { display: grid; grid-template-columns: repeat(auto-fit, minmax(80px, auto));gap: 1px; }
.fui .g2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; }
.fui .g3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px;}
.fui .g4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 15px; }
.fui .g5 { display: grid; grid-template-columns: repeat(5, 1fr); gap: 15px; }
.fui .g6 { display: grid; grid-template-columns: repeat(6, 1fr); gap: 15px; }
.fui .g7 { display: grid; grid-template-columns: repeat(7, 1fr); gap: 15px; }
.fui .g9 { display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 1px;}
.fui .g100 { min-height: 100vh; display: flex; align-items: center;  position: fixed; left: 0px; top: 0px; right: 0px; bottom: 0px; }/* 绝对居中 */


.fui .m2 { display: grid; grid-template-columns: auto 1fr ; flex-wrap: wrap; align-items: center; white-space: nowrap; }

.fui .flex { display: flex; flex-wrap: wrap; align-items: center; white-space: nowrap;grid-template-columns: repeat(auto, 1fr); }

.fui .r25 { border-radius: var(--radius-25)!important; }
.fui .r50 { border-radius: var(--radius-50)!important; }
/*按钮*/
.fui .btn { border: 1px solid var(--color-black);  outline: none; padding: 5px 15px; border-radius: 2px; color: var(--color-white); background-color: var(--color-black); cursor: pointer; transition: opacity 0.3s ease; position: relative; }
.fui .btn:hover { opacity: var(--opacity); }
.fui .btn:disabled { background-color: var(--color-gray); opacity: 0.6; cursor: not-allowed; user-select: none; }
.fui .btn sup { color: #FFF; background-color: #F30; padding: 4px; }
 .btn.r { background-color: var(--color-r); }
.fui .btn.g { background-color: var(--color-g);  margin: 0;}
.fui .btn.b { background-color: var(--color-b); }
.fui .btn.o { background-color: var(--color-o); }
.fui .btn.p { background-color: var(--color-p); }

.fui .btn-k { border: 1px solid var(--color-gray); outline: none; padding: 5px 15px; border-radius: 2px; cursor: pointer; transition: opacity 0.3s ease; background-color: rgba(255,255,255,.9); position: relative; }
.fui .btn-k:hover { opacity: 0.7; }
.fui .btn-k:disabled { opacity: 0.6; cursor: not-allowed; user-select: none; color: var(--color-gray); }
.fui .btn-k.r { color: var(--color-r); border: 1px solid var(--color-r); background-color: rgba(254, 240, 240); }
.fui .btn-k.g { color: var(--color-g); border: 1px solid var(--color-g); background-color: rgba(240, 254, 235); margin: 0; }
.btn-k.b { color: var(--color-b); border: 1px solid var(--color-b); background-color: rgba(236, 245, 255); }
.btn-k.o { color: var(--color-o); border: 1px solid var(--color-o); background-color: rgba(253, 246, 236); }
.btn-k.p { color: var(--color-p); border: 1px solid var(--color-p); background-color: rgba(236, 211, 253); }
.btn-r { border: none; outline: none; padding: 8px 15px; border-radius: 2px; cursor: pointer; transition: opacity 0.3s ease; background-color: var(--color-white); }
 .btn-r:hover { opacity: 0.7; }
 .btn-r:disabled { opacity: 0.6; cursor: not-allowed; user-select: none; color: var(--color-gray); }
.btn-r.r { color: var(--color-r); }
.btn-r.g { color: var(--color-g);  margin: 0;}
.btn-r.b { color: var(--color-b); }
.btn-r.o { color: var(--color-o); }
.btn-r.p { color: var(--color-p); }
 .btn sup, .fui .btn-k sup { position: absolute; z-index: 1; top: -5px; right: -5px; height: 10px; min-width: 10px; text-align: center; border-radius: 24px; padding: 2px; font-size: 9px; background-color: #F00; color: #FFF; }

 .gop { display: flex; gap: 0; vertical-align: middle;  border-radius: 2px; }
 .gop .btn-r,.fui .gop a { border-radius: 0; margin-left: -1px; border: 1px solid var(--color-pale); display:inline-block; padding-right: 5px; padding-left: 5px; }
 .gop > :first-child { margin-left: 0; }

/*飞光按钮*/
.fui .btn-f { padding: 12px 32px; font: 500 16px sans-serif; color: #fff; background: linear-gradient(90deg, #3247ff, #724fff); border: none; border-radius: 2px; cursor: pointer; position: relative; overflow: hidden;transition: opacity 0.3s ease; }
.fui .btn-f.r { padding: 11px 32px; color: #3247ff; background: rgba(255,255,255,.5); border: 1px solid #3247ff; border-radius: 2px; cursor: pointer; position: relative; overflow: hidden; }
.fui .btn-f.j { padding: 12px 32px; color: #4c3a2b; background: linear-gradient(45deg, #ffedc3, #ffdea8, #ffc379); border: none; border-radius: 2px; cursor: pointer; position: relative; overflow: hidden; font-family: sans-serif; font-size: 16px; font-weight: 500; }
.fui .btn-f.q { color: #512D00; padding: 11px 32px; border: 2px solid #ffc379; border-left-width: .5px; border-right-width: .5px; border-radius: 30px; background: rgba(255,255,255,.5); cursor: pointer; }
.fui .btn-f::before { content: ""; position: absolute; top: 0; left: -100%; width: 80%; height: 100%; background: linear-gradient(90deg, transparent 25%, rgba(255,255,255,0.3) 50%, transparent 75%); transform: skewX(-20deg); animation: light 3s ease-in-out infinite; }
.fui .btn-f:hover { opacity: var(--opacity); }
.fui .btn-j { padding: 12px 32px; font: 500 16px sans-serif; color: #fff; background: linear-gradient(90deg, #ffedc3, #ffc379); border: none; border-radius: 2px; cursor: pointer; position: relative; overflow: hidden; }
@keyframes light { to {left: 150%;}}
/*表单*/

.fui form { margin: 10px; position: relative; }
.fui form button { border-radius: 0!important; }
.fui form b { font-weight: 400; width: 70px; text-align: right; margin-right: 6px; }
.fui form .icos { outline: none; padding: 7px; display: inline-block; background-color: rgba(255, 255, 255, .9); box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; border: 1px solid #e1e1e1; }
.fui form .icos img{ height:40px;width:auto; }

.fui label { display: flex;  flex-wrap: nowrap; vertical-align: middle;position: relative; box-sizing: border-box;  }
.fui label i { position: absolute; top: 1px; right: 1px; background-color:#fff; z-index: 1; font-style: normal; padding-right: 10px; padding-left: 10px; line-height: 33px; cursor: pointer; }

input,search { width: 100%; max-width:350px;  outline: none; padding: 7px; background-color: rgba(255, 255, 255, .9); box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; border: 1px solid #e1e1e1; height: 36px; }

.fui input:-webkit-autofill {-webkit-box-shadow: 0 0 0px #f2f2f2 inset;}
.fui input[type="button"], .fui input[type="submit"], .fui input[type="reset"] { -webkit-appearance: none; }
.fui [contenteditable]:focus { outline: none; }

.fui select {width: 100%; min-width:100px; max-width:350px;  outline: none;  display: inline-block; background-color: rgba(255, 255, 255, .9); border: 1px solid #e1e1e1; margin: 0px; }
.fui form select{ padding: 8px; }

.fui input[type="checkbox"], input[type="radio"] { width: 16px; height: 16px; margin-right: 7px; margin-top: 2px; }
.fui input[type="file"] { appearance: none; -webkit-appearance: none; -moz-appearance: none; display: none; }
.fui textarea { outline: none; padding: 8px; border: 0px solid #e1e1e1; border-radius: 2px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; vertical-align: middle; background-color: #FFF; border: 1px solid #e1e1e1; min-height: 50px; }
.fui input:focus, .fui form select:focus, .fui textarea:focus { outline: none; border-color: #5BB6FF; box-shadow: 0 0 1px 2px rgba(0, 100, 255, 0.2); }
.fui input[type="range"]:focus, .fui input[type="radio"]:focus, .fui input[type="checkbox"]:focus { box-shadow: 0 0 0 0; }
.fui input:disabled {
  cursor: not-allowed;
  /* 背景变灰，视觉上表示不可用 */
  background-color: #f5f5f5;
  
  /* 文字颜色变浅 */
  color: #999;
  
  /* 边框变浅 */
  border: 1px solid #ddd;
  
  /* 禁止选中文字（可选） */
  user-select: none;
}

.fui .search{ display: inline-flex; margin-right: 15px; }
.fui .search input{ width: auto !important; }
.fui .search select{ width: auto; border-right-width: 0px; }
.fui .search button{ width: auto; border: 1px solid var(--color-black);  outline: none; padding: 5px 15px; border-radius: 0; color: var(--color-white); background-color: var(--color-black); cursor: pointer; transition: opacity 0.3s ease; position: relative; }

.fui .switch { position: relative; display: inline-block; width: 50px; height: 26px; margin-right: 7px; }
.fui .switch input { opacity: 0; width: 0; height: 0; }
.fui .switch span { position: absolute; inset: 0; cursor: pointer; background: #ccc; border-radius: 13px; transition: .4s; }
.fui .switch span::before { content: ""; position: absolute; width: 20px; height: 20px; left: 3px; bottom: 3px; background: #fff; border-radius: 50%; transition: .4s; }
.fui .switch input:checked + span { background-color: #0066FF; }
.fui .switch input:checked + span::before { transform: translateX(24px); }
/*卡片*/
.fui .card { background-color: #FFF; border-radius: 2px; box-shadow: 1px 1px 5px #CCCCCC; overflow: hidden; position: relative; padding: 12px; margin: 15px; }
.fui .card h3 { margin-bottom: 10px; font-size: 16px; font-weight: 400; margin-top: 0px; margin-right: 0px; margin-left: 0px; line-height: 20px; }
.fui .card p { font-size: 14px; }
.fui .tool-d { left: 0px; right: 0px; bottom: 0px; position: fixed; z-index: 99; padding: 9px; text-align: right; display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; justify-content: space-between; background-color: rgba(255,255,255,.9); box-shadow: 0 -1px 0px rgba(0,0,0,.1); }
.fui .tool-d .ts { color: #F66; text-align: left; line-height: 32px; }
.fui .tool-m { padding: 10px; }
/*标签*/
.fui .tags { display: inline-block; margin-right: 15px; }
.fui .tags p{ font-size: 12px; color: #999; padding: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 3px; margin-left: 0px; }
.fui .tags a { color: #000; text-decoration: none; display: inline-block; line-height: 24px; padding-right: 7px; padding-left: 7px; }
.fui .tags a:hover { background-color: rgba(0,0,255,.1); }
.fui .tags a.on { color: #FFF; background-color: var(--color-b); }
.fui .tags button { color: var(--color-o);cursor: pointer; background-color:#FFF; border: none; margin-left:10px}
/*工具栏*/
.fui .tool{ background-color: #FFF; border-radius: 2px; overflow: hidden; position: relative; margin: 15px; box-shadow: 1px 1px 5px #CCCCCC; padding: 8px; }

/*动态边框*/
.fui .box { background: repeating-linear-gradient(135deg, transparent, transparent 3px, #ccc 3px, #ccc 8px); animation: shine 1s infinite linear; overflow: hidden; margin-bottom: 10px; }
.fui main { margin: 1px; padding: 10px; background-color: #fff; }
@keyframes shine { 0% {background-position: -1px -1px;}100% {background-position: -12px -12px;}}
/*动画虚线*/
.fui .hr { height: 1px; background: repeating-linear-gradient(to right, #ccc, #ccc 5px, transparent 5px, transparent 10px  ); animation: dashMove 1s linear infinite; will-change: background-position; }
@keyframes dashMove {  0% {background-position: 0 0;}100% {background-position: 10px 0;}}

/*选项卡 */
.fui .tabs { margin: 0 auto; }
.fui .tabs-nav { display: flex; gap: 2px; z-index: 1; padding-left: 1px; }
.fui .tabs-nav button { cursor: pointer; border: 0px solid #fff; border-bottom: 2px solid var(--color-pale); font-size: 16px; font-weight: 600; padding-top: 8px; padding-right: 15px; padding-bottom: 4px; padding-left: 15px; background-color: rgba(255,255,255,.7); margin: 0px;clip-path:polygon(1% 0%, 100% 0%, 99% 100%, 0% 100%)}
.fui .tabs-nav button.active { background-color: rgba(255,255,255,1); color: var(--color-b); border-bottom: 2px solid var(--color-b);}
.fui .tabs ul { padding: 15px; list-style: none; background-color: #FFF; margin-top: -2px; border-top: 2px solid var(--color-pale) ; }
.fui .tabs li { padding: 5px 0; }


/*固定栏 */
.fui .fd-rd { position: fixed; z-index: 9; right: 10px; bottom: 10%; }
.fui .fd-rd a { color: #FFF; text-decoration: none; background-color: rgba(0,0,0,.8); margin-bottom: 1px; font-size: 12px; line-height: 15px; height: 32px; width: 32px; display: block; text-align: center; padding: 8px; letter-spacing: 1px; word-spacing: 1px; }
.fui .fd-l { position: fixed; z-index: 9; left: 10px; top: 10%; }
.fui .fd-l a { color: #FFF; text-decoration: none; background-color: rgba(0,0,0,.8); margin-bottom: 1px; font-size: 12px; line-height: 15px; height: 32px; width: 32px; display: block; text-align: center; padding: 8px; letter-spacing: 1px; word-spacing: 1px; }

/*导航*/
.fui .menu { position: relative; float: right; width: 100%; padding: 0; z-index: 1; }
.fui .menu, .fui .menu ul { list-style: none; }
.fui .menu > li { float: left; position: relative; perspective: 1000px; }
.fui .menu li li { float: left; }
.fui .menu a { display: block; float: left;\ position: relative; z-index: 10; padding: 13px 20px 13px 20px; text-decoration: none; color: rgba(75,75,75,1); line-height: 1; font-size: 16px;font-weight: 600;  letter-spacing: -.05em; background: transparent; text-shadow: 0 1px 1px rgba(255,255,255,.9); transition: all .25s ease-in-out; }
.fui .menu > li:hover > a { color: rgba(0,51,255,1); text-shadow: none;}
.fui .menu li ul { position: absolute; top: 42px; left: 0; z-index: 1; width: 220px; padding: 0; opacity: 0; visibility: hidden; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; background: transparent; overflow: hidden; transform-origin: 50% 0%; display:grid;grid-template-columns: repeat(auto-fit, minmax(50%, 1fr)); gap: 0px;  }
.fui .menu li:hover ul { padding: 15px 0; opacity: 1; visibility: visible; box-shadow: 1px 1px 7px rgba(0,0,0,.2); animation-name: swingdown; animation-duration: 1s; animation-timing-function: ease; background-color: rgb(255,255,255); }
.fui .menu li li a { font-size: 14px; font-weight: 400; color: #333; text-shadow: none; border-top: dotted 1px transparent; border-bottom: dotted 1px transparent; transition: all .15s linear; padding-top: 3px; padding-right: 20px; padding-bottom: 3px; padding-left: 20px; }
.fui .menu li li a:hover { color: rgba(0,102,255,1); border-top: dotted 1px rgba(255,255,255,.1); border-bottom: dotted 1px rgba(255,255,255,.1); background-color: rgba(255,255,255,0.02); }

@keyframes swingdown {  
 0% {opacity: .99999; transform: rotateX(90deg);}
 30% {transform: rotateX(-20deg) rotateY(5deg);animation-timing-function: ease-in-out;}
 65% { transform: rotateX(20deg) rotateY(-3deg); animation-timing-function: ease-in-out;}
 100% {transform: rotateX(0);animation-timing-function: ease-in-out;}
}

/*右键*/
.fui .f-menu { list-style: none; width: 120px; position: absolute; display: none; background-color: #FFF; z-index: 999; box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.3); margin: 0px; padding: 0px; font-size: 12px; }
.fui .f-menu li { position: relative; }
.fui .f-menu li ul { list-style-type: none; display: none; position: absolute; top: -1px; background-color: #FFF; width: 120px; left: 120px; box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.3); margin: 0px; padding: 0px; }
.fui .f-menu li:hover ul { display: block; }
.fui .f-menu li a, .fui .f-menu li b { cursor: pointer; display: block; font-weight: normal; padding-top: 5px; padding-right: 10px; padding-bottom: 5px; padding-left: 20px; }
.fui .f-menu li a:hover, .fui .f-menu li b:hover { background-color: rgba(185,214,231,0.5); }
.fui .f-menu li i { font-weight: normal; margin-right: 6px; display: inline-block; font-size: 15px; }
.fui .f-menu li s { font-weight: normal; display: inline-block; font-size: 12px; text-decoration: none; float: right; line-height: 20px; }




/*后端框架*/

.fui header { height: 55px; left: 0px; right: 0px; position: fixed; z-index: 999; background-image: none; color: #FFF; background-color: #0F101A; line-height: 55px; padding-right: 15px; padding-left: 15px; }
.fui header .logo{ font-size: 18px; line-height: 50px; }
.fui header .logo i{ font-size: 9px; font-style: normal; vertical-align: super; }
.fui header .nav { text-align: right; }
.fui header .nav a { font-size: 14px; color: #FFF; display: inline-block; margin-left: 10px; margin-right: 10px; }

.fui .left { background-color: #FFFFFF; position: absolute; width: 200px; left: 0px; top: 55px; bottom: 0px; overflow: hidden; box-shadow: 2px 1px 4px rgba(0, 0, 0, 0.2);}
.fui .left b { line-height: 25px; color: #dcdcdc; display: block; text-decoration: none; text-align: center; font-size: 14px; padding-top: 5px; padding-bottom: 5px; cursor: pointer; font-weight: normal; }
.fui .left b:hover { background-color: #262f3e; }
.fui .left b.on { background-color: #FFFFFF; color: #262f3e; }
.fui .left b i{ display: block; margin: auto; font-size: 24px; line-height: 30px; }

.fui .left b img { filter: grayscale(100%); width: 24px; display: block; margin: auto; }
.fui .left b.on img { filter: grayscale(0%) }

.fui .left h2 { font-size: 14px; color: #2D3151; text-align: center; line-height: 36px; margin: 0px; padding: 0px; }
.fui .left ul { width: 75px; display: block; background-color: #151726; height: 100%; }
.fui .left ul li{ position: static; }
.fui .left ul li div { position: absolute; left: 75px; top: 0px; bottom: 0px; padding: 10px; width: 105px; display: none; -webkit-transition: all 1s; -moz-transition: all 1s; -ms-transition: all 1s; -o-transition: all 1s; transition: all 1s; }
.fui .left ul li div a { color: #3C3C4A; border-radius: 4px; display: block; margin: 3px; padding: 7px; text-decoration: none; }
.fui .left ul li div a:hover { color: #66F;  }
.fui .left ul li div a.on { color: #0033FF; background-color: #ecf2fe; }
.fui .left ul li div a i{ font-size: 13px; font-style: normal; color: #FFF; background-color: #F00; display: inline-block; height: 20px; width: 20px; margin-left: 3px; border-radius: 50%; line-height: 20px; text-align: center; overflow: hidden;transform: scale(.7, .7); }

.fui .right { position: absolute; top: 55px; right: 0px; bottom: 0px; left: 200px; }
.fui .right iframe { height: 100%; width: 100%; border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; overflow: auto; }
.fui .right #shou { position: absolute; left: 0px; top: 45%; text-align: center; text-decoration: none; border-radius: 0px 3px 3px 0px; float: left; width: 0; height: 0; border-top-width: 8px; border-right-width: 8px; border-bottom-width: 8px; border-left-width: 8px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: transparent; border-right-color: transparent; border-bottom-color: transparent; border-left-color: #FFFFFF; margin-left: -10px; }

/*组织架构*/
.os_left { position: absolute; z-index: 2; width: 250px; left: 15px; top: 15px; bottom: 15px; background-color: #FFF; padding: 15px; overflow: auto;  }
.os_left ul { list-style: none; padding-left: 20px; margin: 5px 0; }
.os_left .tree-item { display: flex; align-items: center; cursor: pointer; padding: 2px 4px; border-radius: 3px; }
.os_left .tree-item:hover { background: #f5f5f5; }
.os_left .tree-toggle { width: 16px; height: 16px; line-height: 16px; text-align: center; margin-right: 6px; font-size: 12px; }
.os_left .tree-empty { width: 16px; height: 16px; line-height: 16px; text-align: center; margin-right: 6px; font-size: 12px; }
.os_left .tree-name { flex: 1; }
.os_left .tree-child { display: none; }
.os_left .tree-item.on { color: #03F; background: #e8f4ff; }

.os_right { position: absolute; z-index: 1; left: 296px; top: 15px; bottom: 15px; background-color: #FFF; padding: 15px; right: 15px; overflow: auto; }
.os_right ul { display: grid; grid-template-columns: repeat(auto-fill, minmax(max(160px, 20%), 1fr)); gap: 0;  }

.os_right li {position: relative; }
.os_right a{ display:block; padding: 5px 9px; margin:3px; }
.os_right a:hover{ background: #e8f4ff;}
.os_right a.on { color: #03F; background: #e8f4ff; }
.os_right a img{ height:32px; margin-right:7px;}
.os_right li i {font-size: 14px; font-style: normal; position: absolute; z-index: 1; top: 10px; right: 10px; cursor: pointer; color: #F00;}

.os_right .search { margin-bottom: 15px; margin-left: 3px;  display:flex;}
.os_right .search input { padding:2px 4px;border: 1px solid #000; }
.os_right .search button { padding:2px 15px; background-color:#000;color:#FFF; border: 0px none #000; cursor: pointer;}


/*表格修饰*/
.layui-table tbody tr:hover { background-color: var(--color-pale); }
.layui-table-fixed-l { box-shadow: 0 0 0 ;}
.layui-laypage .layui-laypage-curr .layui-laypage-em { background-color:var(--color-b); }
.layui-table .layui-table-edit { border-color: var(--color-b); }
.layui-table .layui-table-cell { line-height:24px;}
  .sh{ padding: 20px; }  
  .sh textarea{ width: 320px; height: 60px; margin-top: 10px; margin-bottom: 10px;}
  .sh button { margin-right: 10px; }
.photos img{ height:20px !important;}

/*列表*/
.list { margin: 15px; }
.list ul{ position: relative; border-radius: 2px; background-color: #FFF; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1); padding: 20px; box-sizing: border-box; grid-template-columns: repeat(auto-wrap, minmax(25%, max-content)); box-sizing: border-box; margin: 0; list-style-type: none; }
.list ul sup { clip-path: polygon(0 0, 100% 0, 100% 100%, 20px 100%, 0 2px); border-radius: 0 4px 0px 25px; background: linear-gradient(90deg, #ff4400 0%, #ff633b 50%, #ff4400 100%); color: #FFFFFF; font-size: 0.8rem; font-weight: 500; text-align: center; line-height: 1.5; letter-spacing: 0.5px; display: inline-block; box-sizing: border-box; -webkit-font-smoothing: antialiased; position: absolute; top: -1px; right: -1px;  padding-top: 3px; padding-right: 12px; padding-bottom: 3px; padding-left: 28px; }

.list h3{ margin: 0px; padding: 0px; font-size: 1.2rem; font-weight: normal; }
.list p{ color: #28323E; font-size: 0.85rem; margin-bottom: 20px; }

.list ol{ margin: 0px; padding: 0px; list-style-type: none; }
.list li{ background-color: #fff; padding: 20px; transition: all 1s; list-style-type: none; position: relative; }
.list li:hover{ box-shadow: 2px 2px 7px rgba(0,0,0,0.1); z-index: 9; }
 
/*条块*/

.fui .block { margin: 15px; border-radius: 2px;  padding: 20px; color: #FFF; background: linear-gradient(90deg, #1f63d5 0%, #2f7ae8 50%, #1f63d5 100%);  }
.fui .block h3{ margin: 0px; padding: 0px; font-size: 1.2rem; font-weight: normal;  }
.fui .block p{ color: #FFFFFF; font-size: 0.85rem; padding: 0px; margin-top: 10px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; }
.fui .block a{ font-size: 14px; line-height: 30px; color: #FFF; padding-right: 40px; padding-left: 40px; border: 1px solid #FFF; float: right; }