/* ====== 通用 Reset ====== */
* { margin: 0; padding: 0; }
/* ====== 基础样式 ====== */
body { background-color: #f4f4f4; color: #141414; font-weight: normal; font-family: "PingFang SC", "BlinkMacSystemFont", "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif; /* 垂直水平居中 */ display: flex; flex-direction: column; justify-content: center; align-items: center; }
.container { width: 100%; }
/* ====== 主内容区 ====== */
.jbc_content{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;padding:10px;gap:10px;}

.jbc_banner { align-self: stretch; position: relative; max-width: 100%; max-height: 100%; overflow: hidden; object-fit: cover; border-radius: 4px; }
/* ====== 公告列表 ====== */
.list_notice{width:100%;position:relative;border-radius:8px;background-color:#fff;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:6px;font-size:14px;text-align:left;}


#marqueebox.notice { height: 40px; width: 100%; }
.list_notice_list{align-self:stretch;display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:6px;padding:8px 0px 8px 8px;}
.icon_notice { width: 14px; height: 14px; position: relative; overflow: hidden; flex-shrink: 0; }
.text_notice { flex: 1; width: 100%; position: relative; font-size: 14px; line-height: 18px; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* ====== 新闻卡片 ====== */
.newscard-list { width: 100%; position: relative; border-radius: 8px; background-color: #fff; display: flex; flex-direction: column; align-items: flex-end; justify-content: flex-start; padding: 8px; gap: 4px; font-size: 12px; color: #141414; box-sizing: border-box; }
/* 顶部标签/时间/资讯角标 */
.news-part { align-self: stretch; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: 12px; color: #fff; }
.news-part-left { flex: 1; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: 8px; }
.match-label { border-radius: 3px; background-color: #56b118; display: flex; flex-direction: row; align-items: center; justify-content: center; padding: 3px 6px; line-height: 14px; position: relative; }
.text2 { position: relative; line-height: 14px; }
.match-time { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: 4px; color: #8e8e8e; }
.news-part-right { border-radius: 3px; border: 0.4px solid #f44336; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; padding: 3px 3px 2px 3px; gap: 1px; color: #f44336; position: relative; }
.news-icon { width: 14px; height: 14px; position: relative; overflow: hidden; flex-shrink: 0; }
.text3 { position: relative; line-height: 14px; font-weight: 500; }
/* 球队信息 */
.team-part { align-self: stretch; height: 30px; display: flex; flex-direction: row; align-items: center; justify-content: space-between; gap: 0; font-size: 14px; text-align: right; }
.team-left { flex: 1; display: flex; flex-direction: row; align-items: center; justify-content: flex-end; gap: 6px; }
.team-name { flex: 1; position: relative; line-height: 18px; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.team-name-icon { width: 24px; height: 24px; position: relative; object-fit: cover; }
.vs-text,
.vs-text2 { width: 44px; position: relative; line-height: 18px; font-weight: 500; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex-shrink: 0; }
.vs-text2 { color: #f44336; }
.team-right { flex: 1; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: 6px; text-align: left; }
/* 详情区块 */
.detail-part { align-self: stretch; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 8px; font-size: 16px; }
.article-content { align-self: stretch; border-radius: 6px; background-color: #f9f9f9; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 10px; gap: 8px; }
.text-h1 { align-self: stretch; position: relative; line-height: 20px; font-weight: bold; overflow: hidden; text-overflow: ellipsis; height: 18px; flex-shrink: 0; }
.text-h2 { flex: 1; width: 100%; position: relative; font-size: 16px; line-height: 20px; font-weight: bold; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #141414; }
.text-content { align-self: stretch; position: relative; font-size: 14px; line-height: 20px; color: #545454; display: -webkit-inline-box; overflow: hidden; text-overflow: ellipsis; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
/* 标签分类 */
.label-sort { align-self: stretch; display: flex; flex-direction: row; align-items: flex-start; justify-content: flex-start; gap: 10px; font-size: 12px; color: #515151; text-align: right; }
.label-sort-type { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: 3px; }
.newscard-list-icon { width: 16px; height: 16px; position: relative; object-fit: cover; }
/* ====== 列表卡片 ====== */
.item-card { width: 100%; position: relative; border-radius: 8px; background-color: #fff; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: 8px; font-size: 10px; color: #141414; }
/* ====== 新闻列表 ====== */
.news-list { width: 100%; position: relative; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; padding: 10px 0; gap: 8px; text-align: left; }
.news-list:last-child { padding-bottom: 0px; }
.item-list1,
.item-list2 { align-self: stretch; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; padding: 8px; gap: 10px; border-radius: 6px; }
.item-list1 { background: linear-gradient( 90deg, rgba(146, 131, 255, 0.15), rgba(146, 131, 255, 0) ); }
.item-list2 { background: linear-gradient( 90deg, rgba(254, 109, 101, 0.15), rgba(254, 109, 101, 0) ); font-size: 10px; color: #141414; }
.line-border { width: 100%; position: relative; background-color: #eaeaea; height: 0.5px; }
.line-border2 { width: 100%; position: relative; background-color: #eaeaea; height: 0.5px; margin: 10px 0px; }
.item-name { flex: 1; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; }
.item-img { flex: 1; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; }
.item-img-icon { max-width: 100%; position: relative; height: 20px; object-fit: cover; }
/* ====== 展开/收起按钮 ====== */
.btn-open,
.btn-close { border-radius: 100px; background-color: #efefef; display: flex; flex-direction: row; align-items: center; justify-content: flex-end; padding: 4px 4px 4px 6px; gap: 2px; }
.item-text { position: relative; line-height: 12px; }
.icon-sanjiaoxing { width: 10px; height: 10px; position: relative; overflow: hidden; flex-shrink: 0; }
/* ====== 新闻标题栏 ====== */
.news-list-title { width: 100%; position: relative; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: 6px; font-size: 11px; color: #fff; font-family: "PingFang SC"; }
.team-label1,.team-label2,.team-label3 { border-radius: 3px; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; padding:4px; gap: 2px; }
.team-label1 { background: linear-gradient( 90deg, rgba(3, 170, 255, 0.8), rgba(0, 47, 255, 0.8) ); }
.team-label2 { background: linear-gradient( 90deg, rgba(255, 111, 82, 0.9), rgba(255, 19, 59, 0.9) ); }
.team-label3 { background: linear-gradient( 90deg, rgba(255, 111, 82, 0.9), rgba(255, 19, 59, 0.9) );  }


.icon-ball { width: 10px; height: 10px; position: relative; }
.news-text { width: 100%; position: relative; font-size: 14px; line-height: 22px; font-family: "PingFang SC"; color: #545454; text-align: left; display: inline-block; }
/* ====== 折叠面板 ====== */
.expand-panel { width: 100%; padding: 8px; border-radius: 8px; overflow: hidden; background: #fff; }
.expand-header { align-self: stretch; border-radius: 6px; display: flex; line-height: 14px; flex-direction: row; align-items: center; justify-content: flex-start; gap: 10px; font-size: 10px; color: #141414; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.expand-title { flex: 1; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; }
.toggle-btn { border-radius: 100px; background-color: #efefef; display: flex; flex-direction: row; align-items: center; justify-content: flex-end; padding: 4px 4px 4px 6px; gap: 1px; transition: all 0.3s; }
.toggle-btn:hover { background: #e0e0e0; }
.toggle-icon { width: 10px; height: 10px; background-image: url("/Content/images/JieBaoCat/icon-sanjiaoxing.svg"); transition: transform 0.3s; }
.toggle-text { font-size: 10px; }
.toggle-text::after { content: "展开"; }
.expand-content { max-height: 0; overflow: hidden; transition: max-height 0.3s ease; background: #fff; }
.expand-content-inner { padding: 16px; color: #555; line-height: 1.6; }
/* 激活状态 */
.expand-panel.active .expand-content { max-height: 1500px; }
.expand-panel.active .toggle-icon { transform: rotate(180deg); }
.expand-panel.active .toggle-text::after { content: "收起"; }
/* 背景渐变列表项（兼容写法） */
.item-list-bg1 { flex: 1; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; border-radius: 6px; padding: 8px; background: linear-gradient( 90deg, rgba(146, 131, 255, 0.15), rgba(146, 131, 255, 0) ); }
.item-list-bg2,.item-list-bg5 { flex: 1; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; border-radius: 6px; padding: 8px; background: linear-gradient(90deg, rgba(254, 109, 101, 0.15), rgba(254, 109, 101, 0)); }
.item-list-bg4 { flex: 1; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; border-radius: 6px; padding: 8px; background: linear-gradient(90deg, rgba(108, 169, 255, 0.15), rgba(108, 169, 255, 0)); }
.item-list-bg6,.item-list-bg7  { flex: 1; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; border-radius: 6px; padding: 8px; background: linear-gradient(90deg, rgba(96, 214, 161, 0.15), rgba(96, 214, 161, 0)); }
.item-list-bg3 { flex: 1; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; border-radius: 6px; padding: 8px; background: linear-gradient(90deg, rgba(255, 147, 76, 0.15), rgba(255, 147, 76, 0)); }


.x-content { width: 100%; position: relative; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 6px; padding: 10px 0; font-size: 12px; line-height: 18px; color: #8e8e8e; }
.x-text { font-size: 14px; line-height: 18px; font-weight: 500; color: #141414; }
.team-partbg { background-color: #fff; margin: 10px 0px; border-radius: 6px; padding-bottom: 4px; overflow: visible; justify-content: center; display: flex; }
.team-partbg:last-child { margin-bottom: 0px; }
.teama-hurt { width: calc(100% - 2px); position: relative; border-radius: 6px; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; padding: 0px 0px 10px; box-sizing: border-box; box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.05); }
.teamA-title { align-self: stretch; border-radius: 6px 6px 0px 0px; background: linear-gradient(90deg, rgba(3, 163, 255, 0.7), rgba(1, 53, 255, 0.7)); display: flex; flex-direction: row; align-items: center; padding: 6px 8px 4px; gap: 4px; color: #fff; font-size: 12px; }
.teamB-title { align-self: stretch; border-radius: 6px 6px 0px 0px; background: linear-gradient(90deg, rgba(255, 107, 81, 0.8), rgba(255, 20, 59, 0.8)); display: flex; flex-direction: row; align-items: center; padding: 6px 8px 4px; gap: 4px; color: #fff; font-size: 12px; }
.team-icon { width: 20px; position: relative; max-height: 100%; object-fit: cover; }
.team-player { align-self: stretch; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; padding: 10px 8px; text-align: center; font-size: 12px; line-height: 14px; font-weight: 500; }
.player-left { flex: 1; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: 3px; text-align: right; }
.icon { width: 16px; position: relative; height: 16px; overflow: hidden; flex-shrink: 0; }
.player-middle { flex: 1; position: relative; }
.player-list { align-self: stretch; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; padding: 0px 8px; }
.player-list-left { flex: 1; position: relative; line-height: 14px; font-size: 12px; }
.player-pon { flex: 1; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 2px; text-align: center; }
.player-text { align-self: stretch; position: relative; line-height: 14px; font-size: 12px; }
.player-list-right { flex: 1; display: flex; flex-direction: row; align-items: center; justify-content: center; }
.league-label { border-radius: 3px; background-color: #ff9400; display: flex; flex-direction: row; align-items: center; justify-content: center; padding: 3px 7px; font-size: 12px; color: #fff; }
.league-label2 { border-radius: 3px; background-color: #ff3333; display: flex; flex-direction: row; align-items: center; justify-content: center; padding: 3px 7px; font-size: 12px; color: #fff; }
.referee-content { line-height: 18px; font-size: 12px; color: #141414; padding-top: 10px; }