@charset "utf-8";
/* ============================================================
   合肥大学财务处  Finance Office  —  主体样式
   主题色：财务蓝  主色 #1E63D6 / 深蓝 #0E4FBF / 亮蓝 #3E8BF7
   页面最小宽度 1400px，不做移动端适配
   布局对齐：首行三块与下方三列严丝合缝
   快捷入口 449 | 图片幻灯片 475 | 财务动态 450（与幻灯片无缝相连）
   ============================================================ */
@font-face{font-family:"AlibabaPuHuiTi-2-55-Regular";
    /* 字体已子集化（GB2312 一二级汉字 + ASCII + 常用标点）：woff2 优先，woff 兜底 */
    src:url('../fonts/AlibabaPuHuiTi-2-55-Regular.woff2') format('woff2'),
        url('../fonts/AlibabaPuHuiTi-2-55-Regular.woff') format('woff');
    font-weight:normal;
    font-display:swap;
}
:root{
    /* ---------- 主题色 ---------- */
    --blue-main:#1E63D6;        /* 主色：财务蓝 */
    --blue-dark:#0E4FBF;
    --blue-deep:#0A3E9C;
    --blue-light:#3E8BF7;
    --blue-mid:#2E7BEF;         /* 渐变中间色 / 页脚底色 */
    --blue-top:#3E88F5;         /* 导航顶部亮蓝 */
    --blue-bg:#F1F4F8;          /* 页面底色 */
    --blue-border:#E2EAF6;
    --blue-line:#E3EBF7;        /* 列表虚线 */
    --blue-tint:#F1F6FE;        /* 栏目选中浅底 */
    --blue-pale:#CFE0FA;        /* 浅蓝描边 / 占位文字 */
    /* ---------- 文字 ---------- */
    --text-main:#222;
    --text-sub:#8A94A6;
    /* ---------- 日期块 ---------- */
    --date-bg:#E8F1FD;      /* 日期块浅蓝底，同 UI 图 */
    --date-border:#2E77E8;  /* 日期块蓝色边框 */
    /* ---------- 页面尺寸 ---------- */
    --page-w:1400px;            /* 主体内容宽度 */
    --page-min:1600px;          /* 页面最小宽度（不做移动端） */
    /* ---------- 页头 ---------- */
    --header-h:150px;           /* 页头高度 */
    --header-bg:#1E63D6;
    --header-img:url(../images/header-bg.png);
    --logo-w:600px;
    --logo-mt:44px;
    --search-w:280px;
    --search-h:40px;
    /* ---------- 导航 ---------- */
    --nav-h:56px;
    --nav-grad:linear-gradient(180deg,#3E88F5 0%,#2E7BEF 48%,#1E63D6 100%);
    --nav-hover:rgba(255,255,255,.20);
    /* ---------- 页脚 ---------- */
    --foot-bg:#2E7BEF;
    --foot-bar-bg:#1E63D6;
    --foot-bar-color:#D8E8FC;
    --foot-pad:32px 150px 32px 80px;
    --foot-logo-h:78px;
}
html,body,h1,h2,h3,h4,h5,h6,div,dl,dt,dd,ul,ol,li,p,figure,table,caption,th,td,form,fieldset,legend,input,button,textarea{margin:0;padding:0;font-family:"AlibabaPuHuiTi-2-55-Regular","Microsoft YaHei",arial,\5b8b\4f53;}
header,footer,section,article,aside,nav,figure,figcaption{display:block;}
table{border-collapse:collapse;border-spacing:0;}
ul,ol,li{list-style:none;}
a{color:#222;text-decoration:none;cursor:pointer;}
/* 悬停色统一为主题蓝（原模板为 #94070A，用 body 前缀保证优先级） */
body a:hover{color:var(--blue-main);}
img{border:0;}
html{overflow-x:auto;overflow-y:scroll;}
body{
    font:14px/1.6 "AlibabaPuHuiTi-2-55-Regular","Microsoft YaHei",arial;
    color:var(--text-main);
    background:var(--blue-bg);
    min-width:var(--page-min);
    -webkit-font-smoothing:antialiased;
}
.clearfix:after{clear:both;content:".";display:block;height:0;visibility:hidden;}
.clearfix{display:block;*zoom:1;}
.none{display:none;}

/* 拖动窗口宽度时不触发过渡动画（避免逐帧重绘造成的闪烁） */
.resizing *{transition:none!important;animation:none!important;}

/* ============================================================
   页头 header  —— 三个页面（main / listcolumn / displayinfo）共用
   说明：本文件先于原模板 style.css 加载，故统一加 body 前缀
        提升优先级，覆盖原模板的 #header{height:700px} 等默认值。
   ============================================================ */
body #header{
    height:auto;
    min-width:var(--page-min);
    background:var(--header-bg) var(--header-img) center/cover no-repeat;
}
body #header .headm{background:none;}
body #header .head{height:var(--header-h);}
/* logo：在 150px 头部通栏内上下居中（原模板为 float:left + margin-top 硬偏移，改高度易歪） */
body #header .logogl{
    width:var(--logo-w);height:var(--header-h);
    margin-top:0;
    display:flex;align-items:center;
}
body #header .logogl > a{display:block;width:100%;line-height:0;}
body #header .logogl img{width:100%;height:auto;display:block;}

/* ------------------------------------------------------------
   头部搜索框（后台注入，结构已按线上真实输出对齐）
   真实 DOM：
     <div class="searchbox" frag="窗口03" portletmode="search">
       <form ...><div class="wp_search"><table><tr>
         <td><input id="keyword" class="keyword" style="width:150px"></td>
         <td><input name="btnsearch" class="search" type="submit"></td>
       </tr></table></div></form>
     </div>
   → 因此必须：①重置 table 布局；②用 !important 压掉 input 的内联 width。
   ------------------------------------------------------------ */
body #header .head-search{float:right;margin-top:54px;position:relative;}
/* 窗口收窄到页面最小宽度（1600px）及以下时，头部 1600 定宽容器贴住窗口边缘，
   搜索框右侧会顶到页边（间距 0）；此时补 100px 右间距，与 1400px 内容区右边界对齐 */
@media screen and (max-width:1600px){
    body #header .head-search{margin-right:100px;}
}
body #header .head-search .searchbox,
body #header .head-search .wp_search,
body #header .head-search form{
    position:relative;display:block;float:none;width:auto;height:auto;margin:0;padding:0;
}
/* 后台搜索控件用 table 排版，这里全部拍平 */
body #header .head-search table,
body #header .head-search tbody,
body #header .head-search tr,
body #header .head-search td{
    display:block;width:auto;height:auto;margin:0;padding:0;border:0;background:none;
}

/* 输入框：#keyword 带内联 style="width:150px"，必须 !important 才压得住 */
body #header .head-search input[type="text"],
body #header .head-search input:not([type]),
body #header .head-search #keyword,
body #header #keyword{
    width:var(--search-w)!important;
    height:var(--search-h)!important;
    line-height:var(--search-h)!important;
    border:1px solid rgba(255,255,255,.85);
    border-radius:calc(var(--search-h) / 2);
    background:rgba(255,255,255,.12);color:#fff;
    font-size:13px;font-family:inherit;
    padding:0 52px 0 18px!important;margin:0;
    outline:none;box-shadow:none;box-sizing:border-box;
    transition:background .25s ease,border-color .25s ease;
}
body #header .head-search input[type="text"]:focus,
body #header #keyword:focus{
    background:rgba(255,255,255,.22);border-color:#fff;box-shadow:none;
}
body #header .head-search input::placeholder,
body #header #keyword::placeholder{color:var(--blue-pale);}

/* 搜索按钮（后台是 input[type=submit].search） */
body #header .head-search button,
body #header .head-search input[type="submit"],
body #header .head-search .search,
body #header .wp_search .search{
    position:absolute;right:3px;top:3px;width:34px;height:34px;
    border:0;border-radius:0;box-shadow:none;outline:none;
    padding:0;margin:0;cursor:pointer;overflow:hidden;
    font-size:0;line-height:0;color:transparent;
    -webkit-appearance:none;appearance:none;
    background:url(../images/btn-search.png) center/34px 34px no-repeat;
}
/* 模板里的 <img> 不再单独显示，避免与背景图重复 */
body #header .head-search button img{display:none;}

/* ============================================================
   导航 #nav —— 上下渐变蓝通栏，菜单内容与主体同宽
   ★ 导航由后台注入。线上真实输出（simpleSudyNavi 模式）为：
       <ul class="wp-menu">
         <li class="menu-item i1"><a class="menu-link">首页</a>
           <ul class="sub-menu"><li class="sub-item"><a class="sub-link">…</a></li></ul>
         </li>
       </ul>
     另有一种 simpleNav 模式输出 ul.wp_nav > li.nav-item > a > span.item-name。
     两套都写，另加「直接子元素」兜底，后台换控件也不会失去样式。
   ============================================================ */
body #nav{width:100%;background:var(--nav-grad);}
body #nav .wrapper-nav{width:var(--page-w);margin:0 auto;}
body #nav .navbar{height:var(--nav-h);background:none;}

/* 一级菜单容器：横向均分铺满 */
body #nav .wp-menu,
body #nav .wp_nav,
body #nav .navbar .navbox > ul{display:flex;justify-content:space-between;align-items:stretch;}
body #nav .wp-menu > li,
body #nav .wp_nav > li,
body #nav .navbar .navbox > ul > li{flex:1;text-align:center;position:relative;}
body #nav .wp-menu > li > a,
body #nav .wp_nav > li > a,
body #nav .navbar .navbox > ul > li > a{
    display:block;height:var(--nav-h);line-height:var(--nav-h);color:#fff;font-size:17px;
}
body #nav .wp-menu > li > a > span,
body #nav .wp_nav > li > a > span,
body #nav .navbar .navbox > ul > li > a > span{
    display:block;line-height:var(--nav-h);padding:0 8px;
}
/* 当前项 / 悬停：浅色半透明块（按 UI 图） */
body #nav .wp-menu > li > a:hover,
body #nav .wp-menu > li > a.parent,
body #nav .wp_nav > li > a:hover,
body #nav .wp_nav > li > a.parent,
body #nav .navbar .navbox > ul > li > a:hover,
body #nav .navbar .navbox > ul > li > a.parent{
    color:#fff;background:var(--nav-hover);transform:none;transition:background .25s ease;
}

/* ---------------- 二级 / 三级下拉菜单（后台输出 sub-menu） ---------------- */
body #nav .sub-menu{
    display:none;position:absolute;left:0;top:100%;min-width:100%;
    margin:0;padding:6px 0;background:#fff;z-index:99;
    border-radius:0 0 8px 8px;box-shadow:0 8px 20px rgba(20,60,140,.18);
}
body #nav .wp-menu > li:hover > .sub-menu,
body #nav .wp_nav li.nav-item:hover > .sub-nav{display:block;}
body #nav .sub-menu > li{flex:none;text-align:left;white-space:nowrap;}
body #nav .sub-menu > li > a{
    display:block;height:auto;line-height:40px;padding:0 20px;
    color:#44506A;font-size:15px;font-weight:normal;
}
body #nav .sub-menu > li > a:hover,
body #nav .sub-menu > li > a.parent{background:var(--blue-tint);color:var(--blue-main);}
/* 三级：向右展开 */
body #nav .sub-menu .sub-menu{left:100%;top:0;border-radius:8px;}
body #nav .sub-menu > li{position:relative;}
body #nav .sub-menu > li > a:hover + .sub-menu,
body #nav .sub-menu > li:hover > .sub-menu{display:block;}
/* 旧 simpleNav 模式的子菜单 hover 颜色 */
body .navbar .navbox .wp_nav .sub-nav li a:hover{background:var(--blue-main);color:#fff;}

/* ------------------------------------------------------------
   二级 / 三级菜单：选中与悬停统一主题蓝
   原模板给子菜单文字套了 span.item-name，并直写
     .navbar .navbox .wp_nav .sub-nav li.nav-item a span.item-name:hover{
         color:#fff; background:#94070A;  }
   特异度 (0,7,3)，普通覆盖压不住 → 只有 !important 才生效。
   下面同时覆盖 wp-menu / wp_nav 两套结构 + 常见「当前项」类名。
   ------------------------------------------------------------ */
body #nav .sub-menu a:hover,
body #nav .sub-menu a.parent,
body #nav .sub-menu a.selected,
body #nav .sub-menu a.on,
body #nav .sub-menu a.current,
body #nav .sub-menu li.on > a,
body #nav .sub-menu li.selected > a,
body #nav .sub-menu li.current > a,
body #nav .wp_nav .sub-nav a:hover,
body #nav .wp_nav .sub-nav a.parent,
body #nav .wp_nav .sub-nav a.selected,
body #nav .wp_nav .sub-nav a.on,
body #nav .wp_nav .sub-nav a.current,
body #nav .wp_nav .sub-nav li.on > a,
body #nav .wp_nav .sub-nav li.selected > a{
    background:var(--blue-tint)!important;
    color:var(--blue-main)!important;
}
/* ★ 底色只放在 <a>（整行），span 必须拍平为透明底——
   否则文字 hover 放大（scale）时会把 span 上的底色框一起放大 */
body #nav .wp_nav .sub-nav a:hover span,
body #nav .wp_nav .sub-nav a.parent span,
body #nav .wp_nav .sub-nav a.selected span,
body #nav .wp_nav .sub-nav a.on span,
body #nav .wp_nav .sub-nav a.current span,
body #nav .wp_nav .sub-nav li.on > a span,
body #nav .wp_nav .sub-nav li.selected > a span,
body #nav .sub-menu a:hover span,
body #nav .sub-menu a.parent span,
body .navbar .navbox .wp_nav .sub-nav li.nav-item a span.item-name:hover,
body .navbar .navbox .wp_nav .sub-nav li.nav-item a.parent span.item-name{
    background:transparent!important;
    color:var(--blue-main)!important;
}

/* 一级菜单的「当前栏目」态（部分导航控件用 .on / .selected 标记） */
body #nav .wp-menu > li.on > a,
body #nav .wp-menu > li.selected > a,
body #nav .wp-menu > li.current > a,
body #nav .wp_nav > li.on > a,
body #nav .wp_nav > li.selected > a,
body #nav .wp_nav > li.current > a{
    color:#fff;background:var(--nav-hover);
}

/* ------------------------------------------------------------
   后台 simpleNav 输出 ul.wp_nav > li.nav-item > ul.sub-nav：
   把它做成和本地 sub-menu 完全一致的白色浮层（圆角+阴影+40px 行高+浅蓝悬停）
   ★ 宽度必须自适应：min-width 与一级项同宽，内容更长时按文字撑开，
     并强制 nowrap，保证栏目名完整显示（原模板 sub-nav 被写死 100% 宽，
     长栏目名会换行/截断）
   ------------------------------------------------------------ */
body #nav .sub-nav{
    display:none;position:absolute;left:0;top:100%;
    /* ★ 宽高必须 !important：导航插件 sudyNav 初始化时会写内联 width/height
       （菜单隐藏时量到的是 0），不加会被压成 0×0 盒子——文字溢出可见但白底消失 */
    width:auto!important;min-width:100%;height:auto!important;
    margin:0;padding:6px 0;background:#fff;z-index:99;
    border:0;border-radius:0 0 8px 8px;box-shadow:0 8px 20px rgba(20,60,140,.18);
    opacity:1;
}
body #nav .wp_nav li.nav-item:hover > .sub-nav,
body #nav .sub-nav > li:hover > .sub-nav{display:block;}
body #nav .sub-nav > li{
    flex:none;float:none;position:relative;text-align:left;
    /* 插件会给 li 写内联 width:100%，同样需 !important 压住，保证按文字自适应 */
    white-space:nowrap;width:auto!important;
}
body #nav .sub-nav > li > a{
    display:block;height:auto;line-height:40px;padding:0 20px;
    color:#44506A;font-size:15px;font-weight:normal;white-space:nowrap;
}
/* 后台在子菜单文字外又套了 span.item-name（原模板给它 50px 行高、黑字、
   25px 内边距），这里全部拍平，只做内联文字 */
body #nav .sub-nav > li > a > span,
body #nav .sub-nav a span.item-name{
    display:inline-block;line-height:40px;padding:0;
    color:inherit;font-size:15px;font-weight:inherit;white-space:nowrap;
}
body #nav .sub-nav i.mark{display:none;}
/* 三级菜单：贴右侧展开，同样自适应宽度 */
body #nav .sub-nav .sub-nav{left:100%;top:0;width:auto;min-width:100%;border-radius:8px;}

/* 二 / 三级菜单文字 hover 放大（保留效果）
   只放大文字本身（span），面板与行高不变，避免展开/收起时面板宽度抖动 */
body #nav .sub-nav a span.item-name,
body #nav .sub-menu > li > a > span{
    display:inline-block;transform-origin:left center;transition:transform .22s ease;
}
body #nav .sub-nav a:hover span.item-name,
body #nav .sub-menu > li > a:hover > span{transform:scale(1.08);}
/* 注意：不要对子菜单 <a> 整体做 scale——高亮底色在 <a> 上，放大时框会一起变大。
   原模板 style.css 对 .wp_nav li.nav-item a:hover 写了 transform:scale(1.1)，
   会连子菜单整行一起放大，这里按住 */
body #nav .wp_nav .sub-nav li.nav-item a:hover,
body #nav .wp_nav .sub-nav li.nav-item a.parent{transform:none;}

/* ================= 首屏幻灯片（后台绑定幻灯片窗口直接传图） ================= */
.slide-banner{height:590px;min-width:1600px;background:#0E4FBF;overflow:hidden;}
.slide-banner .win,.slide-banner .win-con{height:100%;}
.slide-banner a.slide-item{display:block;height:100%;}
.slide-banner img{display:block;width:100%;height:100%;object-fit:cover;}

/* 幻灯片切换动效（JS 加 slide-ready 后启用淡入淡出）
   ★ 后台渲染会把模板里的 .win-con 包裹层剥掉（轮播项直接放在 .win 下），
     所以 .win 自身必须是定位锚点，否则绝对定位的轮播项会相对页面顶部定位、
     盖住页头导航（线上已复现），两套 DOM 都要命中 */
.slide-banner .win,.slide-banner .win-con,
.photo-news .win,.photo-news .win-con{position:relative;}
.slide-ready .slide-item{
    position:absolute;left:0;top:0;width:100%;height:100%;
    opacity:0;z-index:1;transition:opacity .7s ease;
}
/* ★ 压过 .photo-news a.slide-item 的 position:relative（特异度更高），
   否则轮播项变成文档流竖排、被 overflow 裁掉，画面在"首图/纯蓝"之间跳变
   注意 slide-ready 与面板类在同一个元素上，必须连写不能加空格 */
.slide-banner.slide-ready .slide-item,
.photo-news.slide-ready .slide-item{position:absolute;}
.slide-ready .slide-item.on{opacity:1;z-index:2;}

/* 无图占位：图片缺失或加载失败时（JS 标记 .no-img）显示浅蓝灰底 + "暂无图片"提示 */
.slide-banner .slide-item.no-img img,
.photo-news .slide-item.no-img img{display:none;}
.slide-banner .slide-item.no-img:before,
.photo-news .slide-item.no-img:before{
    content:"暂无图片";position:absolute;left:0;top:0;right:0;bottom:0;z-index:1;
    display:flex;align-items:center;justify-content:center;
    background:#D9E4F2;color:#7E8CA0;font-size:18px;letter-spacing:6px;text-indent:6px;
}
.photo-news .slide-item.no-img:after{display:none;}      /* 纯色底上不叠灰色渐变蒙版 */
.photo-news .slide-item.no-img .hot-tag{display:none;}   /* 无图时不显示 HOT 徽标 */

/* ================= 通用容器 ================= */
.section{width:1400px;margin:0 auto;}
/* 用容器自身 padding 撑开上下留白，避免外边距塌陷产生白条 */
.sec-bg{background:var(--blue-bg);padding:50px 0 46px;}

/* ================= 平台入口 / 图片幻灯片 / 财务动态（高 312） ================= */
.row-top{display:flex;height:372px;}
.quick-grid{width:449px;height:372px;display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr);gap:24px;}
.quick-item{
    position:relative;border-radius:12px;overflow:hidden;
    display:flex;flex-direction:column;justify-content:center;align-items:flex-start;
    padding:0 24px;background-color:#1E63D6;background-size:cover;background-position:center;
    color:#fff;font-size:17px;letter-spacing:1px;
    transition:transform .25s ease,box-shadow .25s ease;
}
.quick-item:before{content:"";position:absolute;left:0;top:0;right:0;bottom:0;background:rgba(21,86,203,.22);}
.quick-item .qi-ic{
    position:relative;z-index:1;width:44px;height:44px;object-fit:contain;margin-bottom:10px;
}
.quick-item .qi-txt{position:relative;z-index:1;}
.quick-item:hover{transform:translateY(-4px);box-shadow:0 10px 20px rgba(30,99,214,.35);color:#fff;}

/* 图片幻灯片：左圆角，右侧与财务动态面板无缝相连 */
.photo-news{
    width:475px;height:372px;margin-left:26px;position:relative;flex:none;
    border-radius:10px 0 0 10px;overflow:hidden;background:#0E4FBF;
}
.photo-news .win,.photo-news .win-con{height:100%;}
/* 只作用于轮播项本身（a.slide-item）：
   后台会在 .pn-cap 字幕里再包一层 <a> 链接，若用通配 .photo-news a，
   字幕链接会被错当成轮播项（变全高块 + 叠加灰色渐变蒙版），样式全乱 */
.photo-news a.slide-item{display:block;height:100%;position:relative;}
.photo-news img{width:100%;height:100%;object-fit:cover;display:block;}
/* HOT 徽标：亮蓝底、白字，位于左下、字幕上方 */
.photo-news .hot-tag{
    position:absolute;left:22px;bottom:56px;z-index:3;
    background:#1E6FE8;color:#fff;font-size:14px;font-weight:bold;
    padding:3px 12px;letter-spacing:1px;border-radius:4px;
}
/* 字幕区渐变灰色蒙版：自下而上由深灰渐变到透明，保证白字可读（按 UI 图） */
.photo-news a.slide-item:after{
    content:"";position:absolute;left:0;right:0;bottom:0;height:100px;z-index:2;
    background:linear-gradient(180deg,rgba(80,80,80,0) 0%,rgba(64,64,64,.45) 55%,rgba(48,48,48,.72) 100%);
    pointer-events:none;
}
/* 字幕：白色粗体，压在灰色渐变蒙版上 */
.photo-news .pn-cap{
    position:absolute;left:22px;right:22px;bottom:14px;z-index:3;
    color:#fff;font-size:17px;font-weight:bold;
    text-shadow:0 1px 6px rgba(0,30,80,.55);
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
/* 后台字幕里包了一层 <a>，链接色必须压回白色，否则变成模板默认色
   标题去下划线；hover 只变色（浅亮蓝），不再出现下划线 */
.photo-news .pn-cap a{color:#fff;text-decoration:none;}
.photo-news .pn-cap a:hover{color:#A6CDFF;text-decoration:none;}

/* 鼠标悬停：图片轻微放大（图片新闻幻灯片），文字与蒙版保持不动 */
.photo-news a.slide-item img{transition:transform .7s ease;transform-origin:50% 50%;}
.photo-news a.slide-item:hover img{transform:scale(1.07);}

/* 栏目面板（通用） */
.panel{position:relative;background:#fff;border:1px solid var(--blue-border);border-radius:10px;padding:16px 20px 14px;box-sizing:border-box;box-shadow:0 4px 14px rgba(30,99,214,.06);}
/* 面板头：大图标 + 中文标题/英文上下排 + 底部渐变短线 */
.panel-head{display:flex;align-items:center;position:relative;padding-bottom:14px;margin-bottom:6px;}
.panel-head:after{
    content:"";position:absolute;left:0;bottom:0;height:2px;width:100%;border-radius:2px;
    /* 灰色底线始终铺满整宽（track），彩色渐变以 background-size 控制长度 */
    background-color:#E9EEF5;
    background-image:linear-gradient(90deg,#1E63D6 0%,#2E7BEF 66%,#F6C344 82%,#F6C344 100%);
    background-repeat:no-repeat;background-position:left center;
    background-size:22% 100%;
    transition:background-size .45s cubic-bezier(.22,.61,.36,1);
}
/* 悬停该板块时，彩色渐变段由一半长度展开到原本长度（灰底不动） */
.panel:hover .panel-head:after{background-size:44% 100%;}
.panel-head .ph-icon{
    width:48px;height:48px;line-height:48px;text-align:center;border-radius:10px;
    background:linear-gradient(160deg,var(--blue-light) 0%,var(--blue-main) 100%);
    color:#fff;font-size:20px;margin-right:14px;flex:none;position:relative;
}
.panel-head .ph-icon:after{  /* 图标右下角黄色圆点点缀 */
    content:"";position:absolute;right:-4px;bottom:-2px;width:12px;height:12px;border-radius:50%;background:#FFC53D;
}
.panel-head .ph-ic{width:48px;height:48px;flex:none;margin-right:14px;border-radius:10px;}
.panel-head .ph-txt{display:flex;flex-direction:column;}
.panel-head .ph-title{font-size:22px;font-weight:bold;color:var(--blue-main);line-height:1.3;}
.panel-head .ph-en{font-size:13px;color:#A6B3C9;letter-spacing:2px;line-height:1.4;}
/* 「更多」按钮（frag="按钮" type="更多"，位于窗口内，绝对定位到面板标题右侧）
   注意：原模板 style.css 里 .view-link 是 132x42 的红色大按钮，这里全部重置为灰字链接 */
.panel .view-link,
.panel .ph-more{
    position:absolute;top:30px;right:20px;z-index:2;margin:0;float:none;
    width:auto;height:auto;background:none;border-radius:0;box-shadow:none;transform:none;
    display:flex;align-items:center;font-size:14px;color:#8A94A6;cursor:pointer;
    transition:color .2s ease;
    /* 原模板按钮自带 overflow:hidden（132x42 红按钮用），会把 hover 右移的箭头裁掉 */
    overflow:visible;
}
.panel .view-link::after{display:none;}
.panel .view-link .link-text,
.panel .ph-more .link-text{
    margin-right:6px;font-size:14px;font-weight:normal;color:inherit;letter-spacing:normal;
    text-shadow:none;z-index:auto;position:static;transition:none;
}
.panel .view-link:hover,
.panel .ph-more:hover{
    background:none;color:var(--blue-main);transform:none;box-shadow:none;
}
.panel .view-link:hover .link-text{color:var(--blue-main);letter-spacing:normal;text-shadow:none;}
.panel .view-link:active{transform:none;box-shadow:none;transition:none;}
.panel .view-link i,
.panel .ph-more i{font-size:12px;}
/* 财务动态：无图标，标题左侧宽边条 */
.panel-head.inline{align-items:center;}
.panel-head.inline .ph-title{position:relative;padding-left:16px;}
.panel-head.inline .ph-title:before{
    content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);
    width:7px;height:24px;border-radius:3px;
    background:linear-gradient(180deg,#2E7BEF,#1E63D6);
}
.panel-head.inline .ph-en{padding-left:16px;}
.panel-head.inline .ph-icon{width:38px;height:38px;line-height:38px;font-size:16px;border-radius:8px;}
.panel-head.inline .ph-ic{width:42px;height:42px;}
.panel-head.inline .ph-icon:after{width:10px;height:10px;right:-3px;bottom:-1px;}
.panel-head.inline .ph-txt{flex-direction:row;align-items:baseline;}
.panel-head.inline .ph-title{font-size:20px;}
.panel-head.inline .ph-en{margin-left:10px;}

/* 财务动态：450 宽 / 312 高，与图片幻灯片无缝相连，右侧圆角 */
.news-dynamic{width:450px;height:372px;margin-left:0;overflow:hidden;border-radius:0 10px 10px 0;border-left:none;}

/* 日期块：浅蓝底 + 蓝边框 + 蓝字（上行年 / 下行 月-日），同 UI 图 */
.date-sq{
    border-radius:8px;flex:none;
    background:var(--date-bg);border:1px solid var(--date-border);color:var(--blue-main);
    display:flex;flex-direction:column;align-items:center;justify-content:center;
}
.date-sq .d-day{font-size:13px;font-weight:bold;line-height:1.35;}
.date-sq .d-ym{font-size:13px;font-weight:bold;line-height:1.35;}

/* 列表行：分隔线只压在标题区（虚线），行 hover 有动效
   面板固定 372 高、5 行刚好占满 → 行距靠「日期块略收 + 行内边距加大」换来，
   行高总量不变（50+6 = 46+12），视觉上每行之间多出 6px 留白 */
.dyn-list li{
    display:flex;align-items:center;padding:6px 0;
    transition:background .25s ease,padding .25s ease;
}
.dyn-list li:hover{background:#F2F7FE;padding-left:8px;padding-right:8px;}
.dyn-list .date-sq{width:46px;height:46px;margin-right:14px;box-sizing:border-box;}
.dyn-list .li-title{
    flex:1;font-size:15px;color:#333;padding:2px 0 9px;border-bottom:1px dashed #DFE7F3;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
    transition:color .25s ease;
}
.dyn-list li:last-child .li-title{border-bottom:none;}
.dyn-list li:hover .li-title{color:var(--blue-main);}

/* ================= 三列栏目（高 316，与首行三块上下对齐） ================= */
.row-cols{display:flex;margin-top:26px;}
.row-cols .col-item{flex:1;height:340px;overflow:hidden;}
.row-cols .col-item + .col-item{margin-left:26px;}
.col-list li{
    display:flex;align-items:center;padding:5px 0;
    transition:background .25s ease,padding .25s ease;
}
.col-list li:hover{background:#F2F7FE;padding-left:8px;padding-right:8px;}
.col-list .date-sq{width:50px;height:50px;margin-right:14px;}
.col-list .li-title{
    flex:1;font-size:15px;color:#333;padding:2px 0 12px;border-bottom:1px dashed #DFE7F3;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
    transition:color .25s ease;
}
.col-list li:last-child .li-title{border-bottom:none;}
.col-list li:hover .li-title{color:var(--blue-main);}

/* ================= 开票信息（高 244，与标语图等高） ================= */
.row-billing{display:flex;margin-top:26px;}
/* 标语图：背景图 + 蓝色蒙版 + 白字居中 */
.slogan-card{
    width:568px;height:244px;border-radius:10px;overflow:hidden;flex:none;
    position:relative;background:linear-gradient(120deg,#0E4FBF,#2E7BEF);
}
.slogan-card .slogan-bg{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;}
.slogan-line img{position:static;width:auto;height:40px;}
.slogan-mask{position:absolute;left:0;top:0;right:0;bottom:0;background:rgba(20,80,196,.55);}
.slogan-text{
    position:absolute;left:0;top:0;right:0;bottom:0;z-index:2;
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:28px;
}
.slogan-line{display:flex;align-items:center;gap:24px;}
.slogan-line img{height:40px;display:block;}
.billing-box{
    flex:1;height:244px;margin-left:32px;background:#fff;
    border:1px solid #DCE6F5;border-radius:10px;
    padding:0 24px;box-sizing:border-box;overflow:hidden;
    box-shadow:0 4px 14px rgba(30,99,214,.06);
    display:flex;flex-direction:column;
}
/* 标题栏：浅蓝到深蓝渐变、白字（按 UI 图取色） */
.billing-box .panel-head{
    flex:none;
    background:linear-gradient(90deg,#4A90F6 0%,#1B55CB 100%);
    margin:0 -24px 0px;padding:12px 24px;
}
.billing-box .panel-head:after{display:none;}
.billing-box .panel-head .ph-icon{width:34px;height:34px;line-height:34px;font-size:15px;border-radius:8px;background:none;}
.billing-box .panel-head .ph-icon:after{display:none;}
.billing-box .panel-head .ph-title{color:#fff;font-size:19px;}
.billing-box .panel-head .ph-en{color:rgba(255,255,255,.8);margin-left:10px;}
.billing-box .panel-head.inline .ph-txt{flex-direction:row;align-items:baseline;}
.billing-grid{
    flex:1;display:flex;flex-wrap:wrap;gap:14px;
    align-content:space-evenly;margin:0;
}
.bill-item{
    height:66px;width:calc((100% - 28px)/3);box-sizing:border-box;
    border:1px solid var(--date-border);border-radius:8px;background:#fff;
    padding:6px 14px;display:flex;align-items:center;
    /* 柔和出现：大模糊 + 负扩散 + 低透明度，过渡曲线用 ease-out 缓收尾 */
    transition:box-shadow .42s cubic-bezier(.22,.61,.36,1),
               border-color .42s cubic-bezier(.22,.61,.36,1),
               transform .42s cubic-bezier(.22,.61,.36,1);
}
.bill-item:hover{
    border-color:rgba(46,123,239,.26);
    box-shadow:0 12px 26px -10px rgba(30,99,214,.16),
               0 3px 10px -2px rgba(30,99,214,.07);
    transform:translateY(-2px);
}
.bill-item .bi-icon{
    width:36px;height:36px;flex:none;margin-right:12px;
}
.bill-item .bi-icon img{width:36px;height:36px;display:block;border-radius:8px;}
.bill-item .bi-label{font-size:12px;color:#8A93A6;line-height:1.4;}
.bill-item .bi-value{font-size:14px;font-weight:bold;color:#1F3C8F;line-height:1.5;word-break:break-all;}

/* ================= 列表页 / 内容页 通用主题（三页共用） ================= */
/* 标题与元信息统一为主题蓝 */
body .title,
body .news_meta-size{color:var(--blue-main);}

/* 左侧栏目菜单 */
/* 容器本身不铺白底：没有子栏目时标题下方保持页面底色，不出现空白白块 */
body .col_menu{background:transparent;min-height:0;}
body .col_menu .col_menu_head{background:linear-gradient(90deg,var(--blue-mid) 0%,var(--blue-main) 100%);}
body .col_list{background:transparent;}
body .col_list .wp_listcolumn{border-top:1px solid var(--blue-pale);border-bottom:0;background:transparent;}
/* 普通状态左边竖条统一主题蓝（原模板末尾有 border-left:4px solid #94070A 深红，必须覆盖） */
body .col_list .wp_listcolumn .wp_column a{
    border-left:4px solid var(--blue-main);background:#fff;
    /* 原模板 a 写死 width:241px(content-box)，统一 border-box，
       否则带箭头项加 padding-right 后会溢出面板 */
    box-sizing:border-box;
}
body .col_list .wp_listcolumn .wp_column a:hover,
body .col_list .wp_listcolumn .wp_column a.selected{
    color:var(--blue-main);border-left:4px solid var(--blue-mid);background:var(--blue-tint);
}
body .col_list .wp_listcolumn .wp_column a.selected span.column-name,
body .col_list .wp_listcolumn .wp_subcolumn .wp_column a.selected span.column-name{color:var(--blue-main);}
/* 二级栏目：去掉原模板的 gif 小图标背景，统一浅蓝底 */
body .col_list .wp_listcolumn .wp_subcolumn .wp_column a{
    background:#fff;background-image:none;border-left:4px solid var(--blue-border);
}
body .col_list .wp_listcolumn .wp_subcolumn .wp_column a:hover,
body .col_list .wp_listcolumn .wp_subcolumn .wp_column a.selected{
    background:var(--blue-tint);background-image:none;color:var(--blue-main);
    border-left:4px solid var(--blue-mid);
}
/* 折叠式层级菜单（js/site.js 重建）：三级栏目默认收起，
   仅当前所在栏目那一支展开（与学校其它学院站点逻辑一致） */
body .col_list .wp_listcolumn ul.wp_subcolumn{
    display:none;margin:0;padding:0;list-style:none;
}
body .col_list .wp_listcolumn .wp_column.open > ul.wp_subcolumn{display:block;}
/* 含子栏目的项：右侧小箭头指示层级（展开时朝上）
   ★ 原模板把 <a> 写死 width:241px（content-box），加 padding 会溢出面板，
   必须 border-box 让内边距算进 241px 里 */
body .col_list .wp_listcolumn .wp_column.has-sub > a{
    position:relative;padding-right:34px;box-sizing:border-box;
}
body .col_list .wp_listcolumn .wp_column.has-sub > a .cm-caret{
    position:absolute;right:16px;top:50%;width:7px;height:7px;margin-top:-6px;
    border-right:2px solid #9AA7BD;border-bottom:2px solid #9AA7BD;
    transform:rotate(45deg);transition:transform .25s ease;
}
body .col_list .wp_listcolumn .wp_column.has-sub > a:hover .cm-caret,
body .col_list .wp_listcolumn .wp_column.has-sub > a.selected .cm-caret{border-color:var(--blue-mid);}
body .col_list .wp_listcolumn .wp_column.open > a .cm-caret{
    transform:rotate(-135deg);margin-top:-2px;
}
/* 展开后的三级栏目：更深的缩进 + 更小字号 + 浅底，层级一眼可辨 */
body .col_list .wp_listcolumn ul.wp_subcolumn .wp_column a{
    background:#FAFBFE;border-left:4px solid var(--blue-border);
}
body .col_list .wp_listcolumn ul.wp_subcolumn .wp_column a .column-name{
    padding-left:40px;font-size:14px;
}
body .col_list .wp_listcolumn ul.wp_subcolumn .wp_column a:hover,
body .col_list .wp_listcolumn ul.wp_subcolumn .wp_column a.selected{
    background:var(--blue-tint);border-left-color:var(--blue-mid);
}

/* 右侧列表 */
body .col_metas .col_title h2{color:var(--blue-main);}
body .col_news_head{border-bottom:1px solid var(--blue-line);}
body .col_news_list .wp_article_list .list_item{border-bottom:1px dashed var(--blue-line);}
body .col_news_list .wp_article_list .list_item a:hover{color:var(--blue-main);}
/* 列表项：去掉标题前的黑点/小图标，行宽拉满（原模板把 li 写死 800px!important，
   日期绝对定位在 800px 处，所以看起来靠不到右边） */
body .col_news_list .wp_article_list .list_item{
    list-style:none;width:auto!important;padding-right:110px;box-sizing:border-box;
}
body .col_news_list .wp_article_list .list_item::marker{content:none;}
body .col_news_list .wp_article_list .list_item .Article_Index{background:none;padding-left:0;margin-left:0;}
body .col_news_list .wp_article_list .list_item .Article_Index:before{content:none;}
/* 分页：字号放大，条目之间拉开距离 */
body .wp_paging{
    font-size:15px;margin-top:22px;text-align:right;color:#5A6478;
}
body .wp_paging a,
body .wp_paging span,
body .wp_paging input,
body .wp_paging button{font-size:15px;color:#44506A;}
body .wp_paging a{
    display:inline-block;margin:0 3px;padding:3px 9px;border-radius:4px;
    transition:background .2s ease,color .2s ease;
}
body .wp_paging input{width:46px;height:26px;border:1px solid #DDE6F4;border-radius:4px;padding:0 6px;}
body .wp_paging a:hover,
body .wp_paging .curr{background:var(--blue-main);border-color:var(--blue-main);color:#fff;}

/* 二级导航宽度自适应（原模板写死 100%，长栏目名会换行截断；用 auto 让它按文字撑开） */
body #nav .sub-nav{width:auto!important;min-width:100%;}
body #nav .sub-nav .sub-nav{min-width:100%;}

/* 内容区与页头之间留白 */
body #container{margin-top:36px;}

/* 内容页正文容器 */
body #container_infobody{width:1200px;}
body #infocontent{padding-top:5px;padding-bottom:5px;float:none;}
body #infocontent img{
    background-color:#fff;
    border-right:5px solid #fff;
    border-bottom:5px solid #fff;
}
/* 内容页标题（后台字段输出为 .art-title-txt） */
body .biaoti3 .art-title-txt{font-size:21px;color:var(--blue-main);}

/* ================= 页脚 footer（三页共用） ================= */
body .footer{background:var(--foot-bg);color:#fff;}
body .footer .foot-inner{
    width:var(--page-w);margin:0 auto;display:flex;align-items:center;justify-content:space-between;
    padding:var(--foot-pad);box-sizing:border-box;
}
body .footer .foot-logo-all{height:var(--foot-logo-h);display:block;}
body .footer .foot-contact .fc-title{font-size:22px;font-weight:bold;margin-bottom:12px;letter-spacing:3px;}
body .footer .foot-contact p{font-size:15px;color:#fff;line-height:2.1;}
body .footer .foot-contact p img{width:16px;height:16px;margin-right:8px;vertical-align:-2px;}
body .foot-bar{background:var(--foot-bar-bg);}
body .foot-bar .fb-inner{
    width:var(--page-w);margin:0 auto;text-align:center;padding:14px 80px;
    box-sizing:border-box;font-size:13px;color:var(--foot-bar-color);
}

/* ================= 列表页 / 内容页 ================= */
.list-header{
    height:220px;
    background:#1E63D6 url('../images/list-header-bg.png') center/cover no-repeat;
}
.list-header .lh-inner{width:1400px;margin:0 auto;padding-top:56px;color:#fff;}
.list-header .lh-inner h3{font-size:36px;font-weight:bold;letter-spacing:2px;}
.list-header .lh-inner h4{font-size:15px;font-weight:normal;color:#CFE0FA;margin-top:8px;}
.list-wrap{width:1400px;margin:34px auto 60px;display:flex;}
.col-menu{width:260px;flex:none;background:#fff;border:1px solid var(--blue-border);border-radius:10px;overflow:hidden;}
.col-menu .cm-head{
    background:linear-gradient(135deg,var(--blue-light),var(--blue-main));
    color:#fff;font-size:19px;font-weight:bold;text-align:center;padding:16px 0;
}
.col-menu .cm-con a{
    display:block;padding:13px 22px;font-size:15px;color:#44506A;border-bottom:1px solid #F0F4FB;
    position:relative;
}
.col-menu .cm-con a:hover,.col-menu .cm-con a.on{color:var(--blue-main);background:#F4F8FE;}
.news-main{flex:1;margin-left:30px;background:#fff;border:1px solid var(--blue-border);border-radius:10px;padding:24px 30px;min-height:520px;}
.news-main .nm-head{border-bottom:2px solid var(--blue-main);padding-bottom:12px;margin-bottom:8px;display:flex;align-items:baseline;}
.news-main .nm-head h2{font-size:22px;font-weight:bold;color:#1F2C45;}
.news-main .nm-head .path{margin-left:auto;font-size:13px;color:#8A94A6;}
.wp_article_list .list_item{padding:19px 6px;border-bottom:1px dashed #E4ECF8;position:relative;}
.wp_article_list .list_item .Article_Title a{font-size:16px;color:#333;line-height:1.8;}
.wp_article_list .list_item .Article_Title a:hover{color:var(--blue-main);}
/* 日期与标题行垂直居中对齐（绝对定位改为按行高中点对齐） */
.wp_article_list .list_item .Article_PublishDate{
    position:absolute;right:6px;top:50%;margin-top:0;line-height:1.6;
    font-size:14px;color:#8A94A6;transform:translateY(-50%);
}
.pagebar{margin-top:20px;}
.pagebar a{display:inline-block;padding:5px 12px;margin:0 4px;border:1px solid #DDE6F4;border-radius:4px;font-size:14px;color:#44506A;}
.pagebar a:hover{background:var(--blue-main);border-color:var(--blue-main);color:#fff;}

/* 内容页 */
.article-title{font-size:24px;font-weight:bold;color:#1F2C45;text-align:center;padding:18px 0 12px;}
.article-meta{text-align:center;font-size:13px;color:#8A94A6;padding-bottom:14px;border-bottom:1px solid #EDF2FA;}
.article-body{padding:22px 6px;font-size:16px;line-height:2;color:#333;}
.article-body img{max-width:100%;}

/* ============================================================
   动效与交互反馈（三页共用，配色沿用主题令牌）
   ★ 均为叠加式「反馈型」动效：不改动任何尺寸/结构，后台换内容也不受影响
   ★ 末尾 prefers-reduced-motion 一键关闭
   ============================================================ */

/* ---------- 1. 滚动进场：进入视口淡入上移（js/site.js 负责加类） ---------- */
.reveal{
    opacity:0;transform:translateY(26px);
    transition:opacity .75s cubic-bezier(.22,.61,.36,1),transform .75s cubic-bezier(.22,.61,.36,1);
    will-change:opacity,transform;
}
.reveal.is-in{opacity:1;transform:none;will-change:auto;}

/* ---------- 2. 首屏大图入场：轻微推近淡入 ---------- */
@keyframes heroIn{from{opacity:.35;transform:scale(1.06);}to{opacity:1;transform:none;}}
.slide-banner a.slide-item img{animation:heroIn 1.4s ease-out both;}

/* ---------- 3. 导航：下拉面板滑入 + 一级菜单短下划线 ---------- */
@keyframes ddIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}
body #nav .sub-menu,
body #nav .sub-nav{animation:ddIn .24s ease-out both;}

body #nav .wp-menu > li > a,
body #nav .wp_nav > li > a,
body #nav .navbar .navbox > ul > li > a{position:relative;}
body #nav .wp-menu > li > a:after,
body #nav .wp_nav > li > a:after,
body #nav .navbar .navbox > ul > li > a:after{
    content:"";position:absolute;left:50%;bottom:12px;width:0;height:2px;
    background:rgba(255,255,255,.9);border-radius:2px;
    transform:translateX(-50%);transition:width .28s ease;
}
body #nav .wp-menu > li > a:hover:after,
body #nav .wp-menu > li > a.parent:after,
body #nav .wp_nav > li > a:hover:after,
body #nav .wp_nav > li > a.parent:after{width:20px;}

/* ---------- 4. 卡片 / 列表反馈 ---------- */
/* 日期块：行 hover 时由浅蓝描边变实心蓝 */
.date-sq{transition:background .25s ease,border-color .25s ease,color .25s ease;}
.dyn-list li:hover .date-sq,
.col-list li:hover .date-sq{background:var(--blue-main);border-color:var(--blue-main);color:#fff;}
/* 「更多」箭头右移 */
.view-link i,.ph-more i{transition:transform .25s ease;}
.panel:hover .view-link i,.panel:hover .ph-more i,
.view-link:hover i,.ph-more:hover i{transform:translateX(4px);}
/* 快捷入口图标抬起放大 */
.quick-item .qi-ic{transition:transform .3s ease;}
.quick-item:hover .qi-ic{transform:translateY(-2px) scale(1.08);}
/* 开票信息卡图标轻转 */
.bill-item .bi-icon{transition:transform .3s ease;}
.bill-item:hover .bi-icon{transform:scale(1.08) rotate(-3deg);}

/* ---------- 5. 头部搜索框 ---------- */
body #header .head-search{transition:box-shadow .3s ease;border-radius:24px;}
body #header .head-search:focus-within{
    box-shadow:0 0 0 4px rgba(255,255,255,.18),0 10px 24px rgba(6,34,110,.28);
}
body #header .head-search button,
body #header .head-search input[type="submit"],
body #header .head-search .search{transition:transform .25s ease;}
body #header .head-search:hover button,
body #header .head-search input[type="submit"]:hover{transform:scale(1.08);}

/* ---------- 6. 列表页 / 内容页 ---------- */
body .col_news_list .wp_article_list .list_item{transition:background .25s ease;}
body .col_news_list .wp_article_list .list_item:hover .Article_Title a{color:var(--blue-main);}
body .Article_PublishDate{transition:color .25s ease;}
body .col_news_list .wp_article_list .list_item:hover .Article_PublishDate{color:var(--blue-main);}
body .col_list .wp_listcolumn .wp_column a{transition:background .25s ease,color .25s ease,border-color .25s ease;}
body .wp_paging a{transition:background .2s ease,color .2s ease,transform .2s ease;}
body .wp_paging a:hover{transform:translateY(-1px);}
body .article-body img{transition:box-shadow .3s ease;}
body .article-body img:hover{box-shadow:0 8px 24px rgba(30,99,214,.22);}

/* ---------- 7. 回到顶部按钮（js/site.js 动态插入） ---------- */
.to-top{
    position:fixed;right:38px;bottom:44px;width:48px;height:48px;
    display:flex;align-items:center;justify-content:center;
    border:0;border-radius:50%;cursor:pointer;z-index:900;
    background:var(--blue-main);box-shadow:0 8px 22px rgba(30,99,214,.38);
    opacity:0;visibility:hidden;transform:translateY(12px);
    transition:opacity .3s ease,transform .3s ease,background .25s ease,visibility .3s;
}
.to-top.show{opacity:1;visibility:visible;transform:none;}
.to-top:hover{background:var(--blue-mid);transform:translateY(-3px);}
.to-top i{
    width:11px;height:11px;margin-top:4px;
    border-left:2px solid #fff;border-top:2px solid #fff;
    transform:rotate(45deg);
}

/* ---------- 8. 系统偏好减少动效时全部关闭 ---------- */
@media (prefers-reduced-motion: reduce){
    .reveal,.reveal.is-in{opacity:1!important;transform:none!important;transition:none!important;}
    .slide-banner a.slide-item img{animation:none!important;}
    body #nav .sub-menu,body #nav .sub-nav{animation:none!important;}
    .to-top{transition:none!important;}
    .panel-head:after{transition:none!important;}
    .bill-item{transition:none!important;}
}
