﻿* { padding: 0px; margin: 0px; }
body { background: #f5f5f5; font-size: 12px;}
#content {
    padding-bottom: calc(35px + 40px);
    min-height: 100vh;
    box-sizing: border-box;
}
ul, li, ol { list-style: none; }
a, a:hover { text-decoration: none; }
.subMenu { overflow: hidden; position: relative; background: #fff; padding: 0 2%; }
    .subMenu.dsi { padding: 0 2% 5px; }
    .subMenu li { float: left; transform: skewX(-15deg); }
        .subMenu li.number1 { width: 32.3%; margin: 4px 0 0 1%; }
        .subMenu li.number2 { width: 23.8%; margin: 4px 0 0 1%; }
.hornleft a::before { content: ""; background: #f7f8fa; position: absolute; top: 0px; left: -4px; width: 30%; height: 28px; transform: skewX(15deg); }
.hornright a::after { content: ""; background: #f7f8fa; position: absolute; top: 0px; right: -4px; width: 30%; height: 28px; transform: skewX(15deg); }
.hornleft a.on::before { content: ""; background: #E82828; position: absolute; top: 0px; left: -4px; width: 30%; height: 28px; transform: skewX(15deg); }
.hornright a.on::after { content: ""; background: #E82828 !important; position: absolute; top: 0px; right: -4px; width: 30%; height: 28px; transform: skewX(15deg); }
.subMenu a { width: 100%; float: left; line-height: 28px; text-align: center; color: #555; font-size: 12px; background-color: #f7f8fa; }
    .subMenu a.on { background: none; line-height: 28px; color: #fff; font-weight: 600; background-color: #E82828; }
    .subMenu a span { transform: skewX(15deg); display: block; }
.subMenu i { background: #d52b1e; color: #fff; width: 16px; height: 16px; border-radius: 10px; font-style: normal; font-size: 12px; line-height: 16px; position: absolute; right: 1px; top: 1px; }
.more a.worldcup { background-size: auto 50px; }
.worldcup img { height: 25px; }
#championOdds { background: #fff; }
    #championOdds * { box-sizing: border-box; }
.leagueItems.dsi { background-color: #fff; }
#championOdds .leagueItems ul { font-size: 16px; }
.leagueItems ul { overflow: hidden; border-bottom: solid 1px #f0f0f0; display: flex; background-color: #ffffffd4; padding: 0 8px }
    .leagueItems ul.dsi { width: 70%; margin: 0 auto 5px; }
    .leagueItems ul li { flex: 1; float: left; text-align: center; line-height: 30px; display: block; }
#championOdds .leagueItems ul { background: #FFF; }
    #championOdds .leagueItems ul li.on { border-bottom: 2px solid #882858; line-height: 32px; color: #882858; font-weight: 600; }
.leagueItems ul li span { background: #f5f4f4; border-radius: 20px; width: 90%; display: inline-block; height: 20px; line-height: 20px; color: #666; }
    .leagueItems ul li span.dsi { height: 26px; line-height: 26px; }
.leagueItems ul li.on span.dsi { height: 26px; line-height: 26px; }
.leagueItems ul li.on span { line-height: 20px; background-color: #fdefd2; color: #f39a45; border-radius: 20px; font-weight: 600; width: 90%; height: 20px; }
.leagueItems ul li.line { display: block; width: 100%; border-bottom: solid 1px #ccc; }
table { background: #fff; }
    table tr th,
    table tr td { border-bottom: solid 1px #f0f0f0; }
    table tr th { background: #f5f4f4; font-size: 12px; line-height: 22px; color: #999EAC; font-weight: 400; }
    table tr td { text-align: center; line-height: 30px; }
.explain { background-color: #f7f8fa; margin: 0px 8px; color: #b9b9b9; text-align: center; padding: 2px 0; }
.red { color: #e8641a; }
.green { color: #0ba52d; }
.blue { color: #0993d3; }
#content .match { padding: 5px 0px 5px 0; overflow: hidden; line-height: 26px; border: 1px #f5f4f4 solid; margin: 8px; box-shadow: 2px; }
    #content .match .team { display: flex; padding: 0 4px; color: #000!important;}
    #content .match .home .team { justify-content: flex-end; }
    #content .match .data { font-size: 12px; }
        #content .match .data .halfScore { padding: 0px 3px; display: inline; }
        #content .match .data .time { padding: 0px 5px; }
        #content .match .data .conner { float: right; padding: 0px 0px 0px 15px; background: url("/Content/images/flag.png") left 5px no-repeat; background-size: 13px 13px; }
    #content .match .other { text-align: center; color: #b9b9b9; line-height: 20px; }
    #content .match .home.time { padding: 0px 5px; }
.rc, .yc { font-size: 11px; float: none !important; vertical-align: middle; text-align: center; font-style: normal; border-radius: 2px; color: #fff; margin: 0 2px; padding: 0 2px; position: relative; min-width: 11px; }
.yc { background: #F9AF06; }
.rc { background: #F04545; }
.name.green { color: #008000 !important; font-weight: 600; }
.name.red { color: #E62229 !important; font-weight: 600; }
#content .match .settop { margin-top: 12px; width: 10%; float: left; background: url("/Content/images/staroff_s.png?v=1") right center no-repeat; height: 36px; }
    #content .match .settop.on { background: url("/Content/images/staron_s.png?v=1") right center no-repeat; }
#content .match i { width: 24px; height: 16px; display: inline-block; border: 1px solid rgba(0, 0, 0, .05); line-height: normal; box-sizing: content-box; margin-top: 4px; border-radius: 3px; overflow: hidden; }
    #content .match i img { width: 100%; height: 100%; vertical-align: baseline; }
#content .match .home { float: left; width: 43%; text-align: right; color: #333; }
    #content .match .home i { float: right; }
#content .match .vs { float: left; width: 14%; }
#content .match .guest { float: left; width: 43%; text-align: left; color: #333; }
    #content .match .guest .data { padding-right: 10px; }
    #content .match .guest i { float: left; }
#content .match .msg { font-size: 12px; position: relative; padding: 4px 10px; display: block; width: 100%; float: right; line-height: 22px; color: #008000; background-color: #f0f5f8; }
    #content .match .msg::before { content: ""; display: block; position: absolute; border-left: 5px solid transparent; border-right: 5px solid transparent; border-bottom: 5px solid #f0f5f8; top: -5px; left: 50%; transform: translate(-50%, 0); }
#content .match .vs .name { font-size: 16px; color: #999EAC; text-align: center; line-height: 26px; }
#content .match .vs .score { font-size: 16px; text-align: center; line-height: 26px; font-weight: 600; }
.contectItems ul { overflow: hidden; background: #fff; }
    .contectItems ul li { width: 50%; float: left; line-height: 30px; border-bottom: solid 1px #f0f0f0; font-size: 14px; box-sizing: border-box; }
.selected { background-color: #f7f8fa; color: #b9b9b9; text-align: center; width: 98%; line-height: 22px; float: left; margin: 0 1%; color: #dea259; }
    .selected img { width: 16px; vertical-align: -3px; margin-right: 4px; }
.open { margin: 0 auto 4px; background-color: #f7f8fa; border-radius: 20px; color: #666; display: block; padding: 6px 14px 6px 24px; width: 70px; }
    .open i { display: inline-block; width: 0; height: 0; border-top: 5px solid #999; border-bottom: 0 none; border-left: 5px solid transparent; border-right: 5px solid transparent; vertical-align: middle; margin-left: 5px; transition: all 300ms; }
.matchList { padding: 4px 0px; background: #fff; }
.separate { color: #e86c6a; font-size: 12px; line-height: 30px; margin: 0 10px; position: relative; text-align: center;background: #fff; }
    .separate span { color: #666; padding: 0 6px; }
    .separate::before, .separate::after { content: ""; background: #e86c6a; opacity: 0.25; position: absolute; top: 15px; left: 0; width: 38%; height: 1px; }
    .separate::after { left: auto; right: 0; }
ul#type_0 li span { width: 25%; }
    ul#type_0 li span.upOdds { width: 25%; }
ul#type_0 li .name { width: 50%; }
#groupfirst ul li span { width: 25%; }
    #groupfirst ul li span:first-child { width: 25%; }
    #groupfirst ul li span:last-child { width: 50%; }
.contectItems ul li span:first-child { font-weight: bold; width: 30%; box-sizing: border-box; }
.contectItems ul li .name { text-align: left; width: 70%; height: 30px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; box-sizing: border-box; }
.contectItems ul li:nth-child(even) { border-left: solid 1px #f0f0f0; }
.contectItems ul li span { width: 33%; float: left; text-align: center; }
.downOdds { color: green; }
.upOdds { color: red; }
.on { color: red; }
.tabs { margin: 12px auto; overflow: hidden; padding: 1px !important; }
    .tabs ul { overflow: hidden; width: 60%; margin: 0 auto; border-radius: 20px; background: #f0f0f0; padding: 2px; }
        .tabs ul li { width: 25%; float: left; text-align: center; line-height: 30px; color: #666971; font-size: 14px; }
            .tabs ul li:hover { color: #F00; }
            .tabs ul li.on { background: #FFF; color: #333; font-weight: 600; border-radius: 20px; box-shadow: 0 0 3px rgb(0 0 0 / 12%); }
#group { border-top: 1px solid #f0f0f0; }
.out span { color: #999; }
#content .match .team .name { font-size: 16px; font-weight: 600; overflow: hidden; white-space: nowrap; line-height: 26px; text-overflow: ellipsis; margin: 0 4px; }
@media screen and (min-width:700px) {
    #content .match .team .name { max-width: 80%; }
}
@media screen and (max-width:414px) {
    #content .match .team .name { max-width: 55%; }
}
@media screen and (max-width:375px) {
    #content .match .team .name { max-width: 55%; }
}
@media screen and (max-width:320px) {
    #content .match .team .name { max-width: 46%; }
    .subMenu { padding: 0 1.2%; }
}
/*@media only screen and (max-width: 999px) {*/
.spacing { height: 6px; background-color: #f0f0f0; display: block; clear: both; }
.information { display: inline-block; color: #9A5F4B; padding: 0 14px 0 26px; line-height: 21px; border-radius: 20px; background: #fbf1d2 url(/Content/images/worldcup/star.png) no-repeat 10px 4px; background-size: 13px; margin: 6px 0 0 0; }
.header { text-align: center !important; }

/*}*/
/*对阵图*/
.lleft { text-align: left; }
.g-tr tr { color: #777; }
    .g-tr tr:nth-child(odd) td { background: #f0f6ff; }
    .g-tr tr td.win { color: #e86c6a; }
.worldcup-top-title { clear: both; line-height: 36px; height: 36px; border-bottom: 1px solid #f0f0f0; padding: 0 10px; }
    .worldcup-top-title h2 { font-size: 16px; font-weight: 600; float: left; }
        .worldcup-top-title h2::before { display: inline-block; margin-right: 4px; vertical-align: 0; content: "♦"; color: #7c5cb7; font-size: 16px; }
    .worldcup-top-title span { box-sizing: border-box; float: left; display: inline-block; padding: 0 14px 0 32px; line-height: 26px; margin-left: 8px; border-radius: 3px; background-size: 12px 13px; border-radius: 20px; }
.worldcup-top-menu { float: right; padding-top: 4px; }
.du { color: #444; background: #f5f4f4 url(/Content/images/worldcup/du.png) no-repeat 14px; }
.zz { color: #444; background: #f5f4f4 url(/Content/images/worldcup/zz.png) no-repeat 14px; }
.content, #content { background-color: #f5f5f5; }
.topImg { padding: 10px 10px 0px; position: relative; margin: 10px; background: #fff; border-radius: 8px; }
.bigImg { position: relative; height: 160px; overflow: hidden;border-radius: 6px;}
.picTitle { height: 160px; position: relative; overflow: hidden; }
    .picTitle .img img { width: 100%; }
    .picTitle .bg { background: #000000; bottom: 0; height: 30px; left: 0; opacity: 0.6; filter: alpha(opacity=60); position: absolute; width: 100%; z-index: 10; }
    .picTitle .name { bottom: 0; color: #FFFFFF; height: 30px; left: 0; line-height: 30px; overflow: hidden; position: absolute; width: 100%; z-index: 11; font-size: 12px; }
        .picTitle .name span { font-size: 14px; width: 46px; height: 30px; background: #E82828; float: left; display: block; text-align: center; margin-right: 6px; }
        .picTitle .name a { color: #FFF; font-size: 13.5px; }

#GroupContainer { background: #fff; }
.leagueItems { border-radius: 4px 4px 0 0; overflow: hidden; }
.g-tr { /* box-shadow: 1px 1px 0 rgb(0 0 0 / 4%); */ border-radius: 0 0 4px 4px; overflow: hidden; padding: 0 8px; margin-bottom: 10px; }
    .g-tr tr:last-child td { border-bottom: none; }
.header { background-color: #882858; background: url(/Content/Images/top-bg-newtop.jpg) no-repeat; background-size: 100%; font-weight: 600; font-size: 18px; color: #fff; line-height: 45px; }
    .header .back { transform: rotate(45deg); -webkit-transform: rotate(45deg); margin-left: 15px; width: 14px; height: 14px; display: inline-block; position: absolute; left: 5px; top: 15px; border-left: 2px solid #FFF; border-bottom: 2px solid #FFF; z-index: 9999; }
.bigImg li { height: 160px; position: absolute; }
.jfhit { color: #E62229; font-weight: 600; }
.nodata { text-align: center; padding: 70px 20px 10px 20px; background: url(/Content/images/worldcup/nodata.png) no-repeat center 0px; background-size: 20%; font-size: 14px; color: #999EAC; }
.contectItems ul li span:first-child { background-color: #f8f9f9; border-right: 1px solid #f0f0f0; }
.contectItems ul li span:last-child { padding-left: 10px; }
.header .back { z-index: 1 !important; }
.groud-t { width: 100% !important; }
    .groud-t p { color: #e86c6a; font-size: 12px; line-height: 30px; margin: 0 10px; position: relative; text-align: center; }
        .groud-t p::before, .groud-t p::after { content: ""; background: #e86c6a; opacity: 0.3; position: absolute; top: 15px; left: 0; width: 38%; height: 1px; }
        .groud-t p::after { left: auto; right: 0; }
.idx { height: 5px; margin: 0 auto; overflow: hidden; text-align: center; padding: 0; width: 40px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; position: absolute; bottom: 12px; right: 5px; z-index: 99; }
    .idx li { -webkit-box-flex: 1; -webkit-flex: 1; -ms-flex: 1; flex: 1; border-radius: 6px; height: 4px; background: #fff; margin: 0 2px; display: block; line-height: 0; opacity: 0.5; }
        .idx li.on { opacity: 1; }
/*最底部*/
#footer { text-align: center; color: #909090; font-size: 12px; float: left; overflow: hidden; clear: both; width: 100%; background-color: #F0F0F0; border-top-width: 1px; border-top-style: solid; border-top-color: #E3E3E3; }
    #footer a { padding-right: 3px; padding-left: 3px; display: inline; color: #216283; }
.blue, a.blue { color: #2196F3 !important; }
a.blue { color: #658ECD; font-size: 14px; }
.popupwin { position: fixed; bottom: 2em; border-radius: 0.5em; -webkit-box-shadow: 0 5px 20px rgb(60 48 114 / 50%); -moz-box-shadow: 0 5px 20px rgb(60 48 114 / 50%); box-shadow: 0 5px 20px rgb(60 48 114 / 50%); background: #54498d; color: #fff; width: 90%; text-align: center; left: 5%; right: 5%; padding: 1em 0; }
    .popupwin span { display: block; line-height: 22px; }
    .popupwin .ppicon { float: left; width: 20%; height: 40px; vertical-align: middle; }
    .popupwin .ppleague { float: left; width: 20%; font-size: 12px; }
    .popupwin .ppteamname { float: left; width: 45%; }
    .popupwin .ppscore { float: left; width: 15%; font-weight: bold; }
.ppscore .foul { color: #e0353c; background: #e0353c; width: 11px; height: 14px; border-radius: 2px; margin: 4px auto; /* box-shadow: 0 3px 6px 1px rgb(230 33 41 / 30%); */ }
.popupwin .red { color: #e0353c !important; }
.popupwin .yellow { color: #E2C514; }

.insafe {width: 95%;position: fixed;bottom: 15px;left: 50%;transform: translate(-50%,0);z-index: 12;padding-bottom: env(safe-area-inset-bottom);}
.navbar { background: #fff; padding: 0 5px; border: 1px solid #ffe2e0; border-radius: 50px; box-shadow: 0 2px 10px var(--black20); display: flex; align-items: center; height: 35px; }
.navbar .nbtn {color: #000000;font-size: 12px;text-align: center;padding: 3px 0;border-radius: 20px;display: inline-block;flex: 1;}
.navbar .nbtn.on {background: #FF4400;color: #FFFFFF;}

.top-news{ display: flex; flex-direction: column; margin-top: 8px; gap: 4px; }
.top-news span a{ font-size: 14px; line-height: 20px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #333;font-weight: 500; }
.match-cards { display: flex; flex-direction: column; background: #fff; padding: 10px; margin: 0 10px 10px; border-radius: 8px; }
.match-top-header{ color:#8E8E8E; display: flex; align-items: center; justify-content: center; line-height: 14px;padding-left: 2px;gap: 4px;}
.match-item-l{ display: flex; flex: 1; justify-content: space-between; }
.match-stime{width: 58px;text-align: center;}
.match-stime span{ background: #FFF0F5; padding: 0px 12px; border-radius: 100px; color: #E53935; }
.match-item-r { display: flex; flex: 1;gap: 6px; }
.icon-group{display: flex;gap: 4px;}
.icon-group img{width: 14px;height: 14px;}


.match-vs { display: flex; align-items: center; line-height: 18px; padding: 0 2px 0 0px; justify-content: center; margin: 4px 0 1px; gap: 4px; }
.team-home { display: flex; align-items: center; justify-content: space-between; font-size: 13px; gap: 2px; flex: 1; min-width: 0; }
.team-logo { display: flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 500; min-width: 0; }
.text-team { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; flex: 1; min-width: 0; }
.team-logo img { width: 25px; height: 16.5px; flex-shrink: 0; }
.VS-text{ width: 58px; color: #9C9C9C; font-weight: 500; font-size: 14px; text-align: center; }
.team-away { display: flex; align-items: center; justify-content: space-between; font-size: 13px; gap: 2px; flex: 1; min-width: 0; }
.btn-show { width: 15px; height: 15px; background: url(/Content/Images/show-icon.svg) no-repeat; background-size: cover; display: block; flex-shrink: 0; transition: transform 0.3s ease;}
.btn-show.down { transform: scaleY(-1) }
.odds-box{ display: flex; justify-content: space-between; align-items: center; gap: 64px; position: relative; padding: 0 10px 0px; margin-top: 2px;}
.odds-home { flex: 1; display: flex; justify-content: flex-end; gap: 6px; font-size: 12px; color: #666; }
.odds-away { flex: 1; display: flex; justify-content: flex-start; gap: 6px; font-size: 12px; color: #666;}
.odds-home span{min-width: 28px;text-align: center;}
.odds-away span{min-width: 28px;text-align: center;}
.btn-collect { width: 16px; height: 16px; background: url(/Content/Images/staroff-new.svg) no-repeat; background-size: cover; display: block; flex-shrink: 0; }
.btn-collect.on{background: url(/Content/Images/staron-new.svg) no-repeat; } 
.border-line { height: 0.5px; background: #e7e7e7; margin: 10px 0px; }
.tab-navnew { display: flex; gap: 0; background: #f5f5f5; padding: 3px; border-radius: 8px; margin-bottom: 14px; }
.tab-itemnew { padding: 5px 24px; font-size: 12.5px; border: none; line-height: 15px; background: transparent; color: #666; cursor: pointer; transition: all 0.25s ease; border-radius: 6px; flex: 1; }
.tab-itemnew.active { background: #fff; color: #e82829; font-weight: bold; }

.expert-card-world { background: #fff; }
.expert-card-world:not(:last-of-type) { border-bottom: 0.5px solid #e7e7e7; padding-bottom: 10px; margin-bottom: 10px; }
.expert-card-world:last-of-type { border-bottom: none; padding-bottom: 0; margin-bottom: 0; }

.label-part-item{display:flex;align-items:center;height:16px;}
.label-red-item {
    color: #fff;
    font-size: 10px;
    font-weight: 400;
    line-height: 14px;
    border-radius: 20px;
    background: var(--design-red, #F44336);
    padding: 0px 6px 0px 0px;
    align-items: center;
    position: relative;
    height: 14px;
    display: flex;
    flex-direction: row;
    margin-right: 4px;
    flex-shrink: 0;
}
.icon-16{width:16px;height:16px;margin-right:2px;}
.gray-text{color: #999;}
.prediction-title.qishu { font-size: 15px; color: #3E3276; margin: 10px 0 6px; line-height: 1.4; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-indent: -7px; font-weight: 500;}
.prediction-title.qishu span{color: #333;font-weight: 400;}
.week-winrate{display: flex;gap: 4px;color: #333;margin-left: 6px;}
.week-winrate span{color:#F44336 ;}
.go-btn { font-size: 12px; color: #fff; background: #F44336; padding: 2px 10px; border-radius: 2px; line-height: 14px; }
.footer-stats{align-items: center;margin-top: 8px !important;}

.content-table{ margin: 10px; border-radius: 8px; background: #fff;overflow: hidden;}
.tablebox{ background: #fff; width: 100%; border-radius: 8px;font-size: 14px; table-layout: fixed;}
.tablebox .tab-navnew { display: flex; gap: 0; background: #f5f5f5; padding: 3px; border-radius: 8px; margin: 10px !important; }
table tr th { font-size: 12px; line-height: 20px; font-weight: 400; padding: 5px 0; }
.rl { border-right: solid 1px #f3f3f3; }
table tr td { text-align: center; line-height: 35px; }
table tr th, table tr td { border-bottom: solid 1px #f3f3f3; }
table tr.table-head th { background: #f9f9f9; font-size: 12px; line-height: 22px; color: #999EAC; font-weight: 400; }
.counttit { font-size: 12px; font-weight: 600; padding: 10px;}

.nav-top{
    display: flex;
    padding: 16px 10px 4px;
    font-size: 14px;
    text-align: center;
    align-items: center;
    justify-content: center;
}

.more-new {
    width: 90%;
    display: flex;
    border: 1px solid #E23F23;
    border-radius: 4px;
}


.more-new a {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: #e24022;
    white-space: nowrap;
    padding: 0;
    margin: 0;
    border: none;
    box-sizing: border-box;
    padding: 2.5px 0px;
}

.more-new .on {
    color: #fff;
    background: #E23F23;
}

.more-new a + a {
    border-left: 1px solid #E23F23;
}

.left-team-item{ text-align: left; padding-left: 12px; }

.newsBox a{color: #333;}

.newstitle b { font-size: 16px; line-height: 18px; }
.b_title span{font-size: 14px; padding-top: 10px;}

.text{font-size: 14px;}
.r_news {
    font-size: 13px;
    display: flex;
    gap: 8px 12px;        /* 条目之间间距 */
    flex-wrap: wrap;
    padding:0;
    margin:0;
    list-style:none;
}

ul.r_news li {
    /* 50% - 间距均分，实现一行两个 */
    width: calc(50% - 6px);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}


@media (max-width: 375px) {
  .label-red-item{font-size: 9px;}
  .icon-16 { width: 14px; height: 14px; margin-right: 2px; }
}


.expert-list-wc {
    display: flex;
    background: #fff;
    padding: 2px 4px 12px;
    margin-bottom: 6px;
    justify-content: flex-start;
    overflow-x: auto;
}

.expert-item-wc {
    text-align: center;
    /* flex: 1; */
    min-width: 71px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    position: relative;
}



.expert-list-wc::-webkit-scrollbar {
    display: none;
}

.expert-list-wc {
    -ms-overflow-style: none;
    scrollbar-width: none;
}




/* 标题 */
.data-title {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 14px 0 16px;
}

.data-title .tag {
  font-size: 26px;
  font-weight: 600;
  color: #333;
  line-height: 1;
}

.data-title .line {
  flex: 1;
  height: 1px;
  background: #e9e9e9;
}

/* 支持率表格 */

.support-table,
.history-table {
    width: 100%;
    margin-bottom: 10px;

    border: 1px solid #ededed;
    border-radius: 6px;

    border-collapse: separate;
    border-spacing: 0;

    overflow: hidden;
    background: #fff;


    -webkit-tap-highlight-color: transparent;
}

.support-table th, .history-table th {
    padding: 8px;
    font-size: 11px;
    line-height: 13px;
    font-weight: 600;
    color: #666;
    text-align: left;
    background: #f7f7f7;
    border-bottom: 1px solid #f0f0f0;
}


table.support-table tr td{line-height: 24px;}

.support-table td,
.history-table td {


    text-align: center;
    vertical-align: middle;

    border-right: 1px solid #f0f0f0;
    border-bottom: 1px solid #f0f0f0;

    background: #fff;
}

.support-table td:last-child,
.history-table td:last-child {
    border-right: none;
}

.support-table tbody tr:last-child td,
.history-table tbody tr:last-child td {
    border-bottom: none;
}

.support-table tbody tr:last-child td:first-child,
.history-table tbody tr:last-child td:first-child {
    border-bottom-left-radius: 14px;
}

.support-table tbody tr:last-child td:last-child,
.history-table tbody tr:last-child td:last-child {
    border-bottom-right-radius: 14px;
}

.handicap,.handicap2,
.label {


    text-align: center;

    font-size: 12px;
    font-weight: 500;
    color: #444;
}


.handicap {
    width: 15%;
}

.handicap2 {
    width: 25%;
}

.rate-item .odds {
    margin: 0;

    font-size: 12px;
    line-height: 1;

    color: #333;
}

.rate-item {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 4px;
    padding: 10px;
}

.rate-item span {
    display: block;
    /* margin-top: 8px; */
    font-size: 12px;
    line-height: 1;
    color: #999;
}


.rate-item span.red {
    color: #ff4d4f;
    font-weight: 500;
}

.rate-item span.blue {
    color: #4096ff;
    font-weight: 500;
}

.rate-item span.green {
    color: #52c41a;
    font-weight: 500;
}

@media screen and (-webkit-min-device-pixel-ratio: 2) {
    .support-table,
    .history-table {
        border-color: #eaeaea;
    }

    .support-table td,
    .history-table td,
    .support-table th,
    .history-table th {
        border-color: #f3f3f3;
    }
}


.wcSubMenu {
    display: flex;
    align-items: center;
    gap: 4px;
    overflow-x: auto;
    white-space: nowrap;
    padding: 12px 2% 4px;
    box-sizing: border-box;
    background: #fff;
}

.wcSubMenu::-webkit-scrollbar {
    display: none;
}

.wcSubMenu li {
    flex: 1;
    min-width: 0;

    list-style: none;

    transform: skewX(-15deg);
}

.wcSubMenu li a {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f2f2f2;
    color: #555;
    text-decoration: none;
    font-size: 12px;
    line-height: 28px;
}

.wcSubMenu li a.on {
    background: #ef2020;
    color: #fff;
    font-weight: 500;
}

.wcSubMenu li span {
    transform: skewX(15deg);
}

.newsBox{
    margin-top: 10px;
}

.news-newlist{
    display: flex;
    flex-direction: column;
    margin-top: 8px;
    gap: 6px;
    padding-bottom: 10px;
}

.rate-chart{
    display:flex;
    justify-content:space-around;
    align-items:flex-end;
    padding-top: 5px;
}

.goal-wrap{
    display:flex;
    flex-direction:column;
    align-items:center;
}

.goal-bottom-text {
    font-size: 11px;
    font-weight: 500;
    color: #444;
    line-height: 12px;
    margin: 8px 0px;
}


.goal-chart{
    display:flex;
    align-items:flex-end;
    justify-content:center;
    gap:8px;
}

/* 单项 */
.goal-item{
    width:24px;
}


.goal-bar-wrap{
    display:flex;
    flex-direction:column;
    align-items:center;
}

/* 柱状图区域 */
.goal-bar{
    width:26px;
    height:80px;
    position:relative;
    display:flex;
    align-items:flex-end;
    margin-top:12px;
}


.goal-fill{
    width:100%;
    /* 原来：18px + (60px * var(--percent) / 100%) */
    height:calc(18px + (60px * var(--percent) / 100));
    border-radius:6px;
    overflow:hidden;
    display:flex;
    align-items:flex-end;
    min-height:18px;
}

/* 百分比 */
.goal-percent{
    position:absolute;
    left:50%;
    /* 原来：calc(18px + (60px * var(--percent) / 100%) + 5px) */
    bottom:calc(18px + (60px * var(--percent) / 100) + 5px);
    transform:translateX(-50%);
    font-size:10px;
    font-weight:600;
    line-height:1;
    white-space:nowrap;
}


/* 标签 */
.goal-tag{
    width:100%;
    height:18px;

    background:rgba(255,255,255,.2);

    color:#fff;
    font-size:10px;
    font-weight:500;

    display:flex;
    align-items:center;
    justify-content:center;
}

/* 红色 */
.goal-item.red .goal-fill{
    background:#FA4F4E;
}

.goal-item.red .goal-percent{
    color:#FA4F4E;
}

/* 绿色 */
.goal-item.green .goal-fill{
    background:#0EB555;
}

.goal-item.green .goal-percent{
    color:#0EB555;
}

/* 蓝色 */
.goal-item.blue .goal-fill{
    background:#2288FF;
}

.goal-item.blue .goal-percent{
    color:#2288FF;
}


@media (max-width: 375px) {
    .picTitle .name a {
    color: #FFF;
    font-size: 12px;
}

.picTitle .name span {
    font-size: 13px;
    width: 44px;}

}

.title-a{font-size: 14px;}