@charset "UTF-8";

/* Steam data base styles migrated from the legacy Steam data stylesheet. */
#SteamData {
  display: block;
}

#SteamData .SD_content {
  overflow: visible;
  margin-bottom: 15px;
}

#SteamData .SD_content:last-child {
  margin-bottom: 0;
}

#SteamData .SD_content_top {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
}

#SteamData .SD_content_top .SD_content_tit {
  font-size: 18px !important;
  font-weight: bold !important;
  font-weight: 500;
  line-height: 14px;
  letter-spacing: 0;
  color: var(--index-primary-color) !important;
  flex-shrink: 0;
}

#SteamData .SD_content_top i {
  margin: 0 8px;
  display: flex;
  width: 100%;
  height: 0.5px;
  background: #fff;
  opacity: 0;
}

#SteamData .SD_content_top a {
  flex-shrink: 0;
  position: relative;
  font-size: 12px;
  font-weight: normal;
  color: #888;
  line-height: 14px;
  padding-right: 12px;
  color: #666666;
  font-size: 12px;
  line-height: 14px;
  white-space: nowrap;
  flex-shrink: 0;
}

#SteamData .SD_content_top a::after {
  display: inline-block;
  position: absolute;
  right: 0;
  top: 2px;
  content: "";
  width: 10px;
  height: 10px;
  background: url(//image.gamersky.com/webimg13/www/newPc/ku/arrow-right-solid.svg)
    no-repeat center/10px;
}

#SteamData .SD_content_data {
  box-sizing: border-box;
  margin: 10px 0 5px 0;
  display: flex;
  gap: 5px;
  cursor: pointer;
  width: 100%;
  min-width: 0;
  margin: 0 0 12px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

#SteamData .SD_content_data a {
  display: flex;
  flex-direction: column;
  flex: 1;
  height: 50px;
  padding: 5px 0;
  gap: 2px;
  /* background: color-mix(in srgb, #FF0000 6%, transparent); */
  background: var(--GamerSky-F5F7F9);
  border-radius: 2px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  text-decoration: none;
}

#SteamData .SD_content_data a .t1 {
  font-family: "BarlowSemi";
  font-size: 16px;
  font-weight: 600;
  line-height: 22px;
  color: var(--GamerSky-FFFFFD);
  text-align: center;
}

#SteamData .SD_content_data a .t2 {
  font-size: 12px;
  font-weight: normal;
  line-height: 16px;
  text-align: center;
  color: #999999;
}

#SteamData .SD_content_data .t1 {
  color: var(--GamerSky-222222, #d7d7d9);
  font-family:
    var(--font-family-Font-4, Barlow), "BarlowSemi", "Barlow", sans-serif;
  font-size: 20px;
  font-weight: 600;
  line-height: 24px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#SteamData .SD_content_data .t2 {
  color: var(--GamerSky-666666, #a3a3a6);
  font-size: 12px;
  font-weight: 400;
  line-height: 14px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#SteamData .SD_online-echart {
  box-sizing: border-box;
  width: 280px;
  height: 78px;
  border-radius: 2px;
  /* background: color-mix(in srgb, #FF0000 6%, transparent); */
  background: var(--GamerSky-F5F7F9);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  padding: 5px 0;
  gap: 2px;
  cursor: pointer;
}

#SteamData .SD_online-echart .echart-label {
  font-size: 12px;
  font-weight: normal;
  line-height: 16px;
  text-align: center;
  color: #999999;
}

#SteamData .SD_online-echart .echart {
  box-sizing: border-box;
  width: 100%;
  height: 50px;
  padding: 4px 0px 0px 0;
}

#SteamData .SD_content_saleCount {
  display: flex;
}

#SteamData .echart-label {
  margin-top: 4px;
  color: var(--GamerSky-666666, #a3a3a6);
  font-size: 12px;
  line-height: 14px;
  text-align: center;
}

#SteamData .steamOnlyPriceData .GamePriceData,
#SteamData .steamOnlyPriceData .GamePriceDataList {
  width: 100%;
  min-width: 0;
}

.SD_content .echart.noData {
  font-size: 13px;
  font-weight: 500;
  line-height: 16px;
  color: var(--GamerSky-FFFFFD);
  display: flex;
  align-items: center;
  justify-content: center;
}

.ku-pop-top-tit {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  float: none;
  font-size: 15px;
  font-family:
    -apple-system,
    BlinkMacSystemFont,
    PingFang SC,
    Hiragino Sans GB,
    Microsoft YaHei,
    "微软雅黑",
    helvetica neue,
    helvetica,
    ubuntu,
    roboto,
    noto,
    segoe ui,
    Arial,
    sans-serif;
}

.ku-pop-top-tit .tbhp {
  color: #ff9f1d;
  font-size: 13px;
  font-weight: 500;
  line-height: 18px;
  text-align: right;
}

.highScoreRankList .ku-pop-top-tit {
  font-size: 18px;
  line-height: 24px;
}

.ku_pop_layer {
  padding: 20px 20px;
  box-sizing: border-box;
  width: 640px;
  margin: -150px 0 0 -320px;
}

.ku_pop_layer .sdpl-nums {
  margin-top: 0px;
  margin-bottom: 0px;
  background: #fff;
}

.ku_pop_layer .sdpl-nums .sdpl-item {
  width: 150px;
  height: 40px;
  box-sizing: border-box;
  padding: 0;
  position: relative;
}

.ku_pop_layer .sdpl-nums .sdpl-item::after {
  content: "";
  position: absolute;
  display: block;
  right: -30px;
  top: 15px;
  width: 1px;
  height: 10px;
  background: #e5e7e9;
}

.ku_pop_layer .sdpl-nums .sdpl-item:last-child:after {
  content: "";
  position: absolute;
  display: none;
}

.ku_pop_layer .sdpl-nums .sdpl-item .sdpl-i-fz {
  font-size: 12px;
  font-weight: normal;
  line-height: 16px;
  text-align: center;
  display: flex;
}

.ku_pop_layer.praise-rate_pop_layer {
  height: 600px;
  margin: -300px 0 0 -320px;
}

.ku_pop_layer.praise-rate_pop_layer .ku-pop-top-tit {
  height: 26px;
}

.ku_pop_layer.praise-rate_pop_layer table {
  border-spacing: 0;
  width: 100%;
}

.ku_pop_layer .ku-pop-top .ku_pop_close {
  right: 0;
}

.ku_pop_layer.list_rank_layer .ku-pop-top {
  height: 24px;
  margin: 0 0 20px 0;
  padding: 0;
}

.ku_pop_layer.sale_count_pop_layer {
  height: 600px;
  padding-bottom: 20px;
  margin: -300px 0 0 -320px;
}

.ku_pop_layer.Metacritic_pop_layer {
  margin: -208px 0 0 -320px;
  padding: 20px;
  height: 416px;
  box-sizing: border-box;
}

.ku_pop_layer.price_data_pop_layer {
  margin: -155px 0 0 -365px;
}

#steamEchart {
  height: 124px;
  margin-bottom: 0px;
  padding-bottom: 0;
}

.ku-pop-top {
  margin-left: 0;
  background: none;
  width: 100%;
  box-sizing: border-box;
  overflow: visible;
  padding: 0;
}

.ku-steam-parise-echart {
  height: 136px;
}

.praise-rate_pop_layer.ku_pop_layer .sdpl-nums .sdpl-item {
  width: 120px;
  height: 40px;
  position: relative;
}

.praise-rate_pop_layer.ku_pop_layer .sdpl-nums .sdpl-item::after {
  content: "";
  position: absolute;
  display: block;
  right: -15px;
  top: 15px;
  width: 1px;
  height: 10px;
  background: #e5e7e9;
}

.praise-rate_pop_layer .sdpl-nums {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 15px 31px;
  background: transparent;
  margin-bottom: 15px;
  position: relative;
}

.praise-rate_pop_layer .sdpl-nums::after {
  position: absolute;
  display: block;
  content: "";
  width: 100%;
  height: 1px;
  background: #f5f7fa;
  bottom: 0;
  left: 0;
}

.praise-rate_pop_layer table tbody tr::after {
  display: block;
  content: "";
  position: absolute;
  bottom: 0;
  height: 0.5px;
  background: #eeeeee;
  width: 100%;
  left: 0;
}

.praise-rate_pop_layer table tbody tr:last-child:after {
  display: none;
}

.praise-rate_pop_layer table tbody td:first-child {
  width: 173.18px;
  color: #222222;
  font-weight: 500;
}

.praise-rate_pop_layer table tbody td:nth-child(2) {
  width: 118.95px;
  color: #222222;
  font-weight: 500;
}

.praise-rate_pop_layer table tbody td:last-child {
  width: 69.97px;
  color: #ff0000;
  font-weight: 500;
  text-align: right;
}

.praise-rate_pop_layer table thead td:last-child {
  text-align: right;
}

.ku_pop_layer_content {
  height: 520px;
  overflow: hidden auto;
  box-sizing: border-box;
  scrollbar-width: none;
}

.praise-rate_pop_layer #pariseEchart1,
.praise-rate_pop_layer #pariseEchart2 {
  margin-bottom: 15px;
  padding: 15px 0;
  border-bottom: 0.5px solid #f5f7fa;
}

.praise-rate_pop_layer table thead tr,
.praise-rate_pop_layer table tbody tr {
  color: #999;
  font-size: 12px;
  height: 44px;
  box-sizing: border-box;
  position: relative;
}

.praise-rate_pop_layer table tbody td:nth-child(3),
.praise-rate_pop_layer table tbody td:nth-child(4) {
  width: 118.95px;
  color: #666;
}

.ku_pop_layer.list_rank_layer,
.ku_pop_layer.hsrkMask {
  width: 640px;
  height: 372px;
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -186px;
  margin-left: -320px;
  padding: 20px;
}

.SD_content_saleCount {
  display: none;
}

.sale_count_pop_layer #saleCountEchart {
  margin: 15px 0;
  height: 156px;
  padding-bottom: 15px;
  border-bottom: 0.5px solid #f5f7fa;
  box-sizing: border-box;
}

.sale_count_pop_layer table {
  border-spacing: 0;
  margin-top: 15px;
}

.sale_count_pop_layer table thead tr {
  color: #999;
  font-size: 12px;
  height: 44px;
  box-sizing: border-box;
  border-bottom: 0.5px solid #eee;
  height: 26px;
}

.sale_count_pop_layer table thead tr td:last-child {
  text-align: right;
}

.sale_count_pop_layer table tbody {
  margin-top: 15px;
}

.sale_count_pop_layer table tbody td:first-child {
  width: 150px;
  color: #222222;
  font-weight: 500;
  font-size: 13px;
}

.sale_count_pop_layer table tbody td:nth-child(2) {
  width: 150px;
  color: #222222;
  font-weight: 500;
  font-size: 12px;
}

.sale_count_pop_layer table tbody td:nth-child(3) {
  width: 150px;
  display: flex;
  align-items: center;
  justify-content: start;
  height: 44px;
  font-size: 12px;
}

.sale_count_pop_layer table tbody td:last-child {
  width: 150px;
  color: #666;
  font-weight: normal;
  font-size: 13px;
  text-align: right;
}

.sale_count_pop_layer table tr {
  height: 44px;
  box-sizing: border-box;
  position: relative;
}

.sale_count_pop_layer table tr::after {
  height: 0.5px;
  display: block;
  position: absolute;
  content: "";
  bottom: 0;
  left: 0;
  width: 100%;
  background: #eee;
}

.sale_count_pop_layer table .zengjia {
  font-size: 10px;
  color: #ff9f1d;
  font-weight: 500;
}

.sale_count_pop_layer table .xiajiang {
  color: #00bf60;
  font-weight: 12px;
  font-weight: 500;
}

.sale_count_pop_layer table .shangsheng {
  color: #ff0000;
  font-weight: 12px;
  font-weight: 500;
}

.sale_count_pop_layer .ku-pop-top-tit {
  height: 26px;
}

.sale_count_pop_layer table tr:last-child::after,
.sale_count_pop_layer table tr:first-child::after {
  display: none;
}

.SD_praiseRate-echart {
  box-sizing: border-box;
  width: 280px;
  height: 72px;
  border-radius: 2px;
  /* background: color-mix(in srgb, #FF0000 6%, transparent); */
  background: var(--GamerSky-F5F7F9);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  padding: 5px 0;
  gap: 2px;
  cursor: pointer;
}

.SD_praiseRate-echart .echart-label {
  font-size: 12px;
  font-weight: normal;
  line-height: 16px;
  text-align: center;
  color: #999999;
}

.SD_praiseRate-echart .echart {
  width: 100%;
  height: 44px;
}

.SD_saleCount-echart {
  box-sizing: border-box;
  width: 280px;
  height: 96px;
  border-radius: 2px;
  /* background: color-mix(in srgb, #FF0000 6%, transparent); */
  background: var(--GamerSky-F5F7F9);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  padding: 5px 0;
  gap: 2px;
  cursor: pointer;
}

.SD_saleCount-echart .echart-label {
  font-size: 12px;
  font-weight: normal;
  line-height: 16px;
  text-align: center;
  color: #999999;
}

.SD_saleCount-echart .echart {
  width: 100%;
  height: 68px;
}

.MTPC .MZPC {
  margin-top: 20px;
}

.MTPC .MZPC .MZPC_tb_plat {
  margin-top: 10px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.MTPC .MZPC .MZPC_tb_plat .MZPC_tb_plat_item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #cccccc;
  font-size: 12px;
  height: 16px;
}

.MTPC .MZPC .MZPC_tb_plat .MZPC_tb_plat_item .act_score {
  color: var(--GamerSky-FFFFFD);
}

.Metacritic_pop_layer .ku-pop-top {
  margin-left: 0;
  padding: 0;
  width: 100%;
  margin-bottom: 20px;
  background: #fff;
}

.Metacritic_pop_layer .ku-pop-top-tit {
  font-size: 18px;
}

.Metacritic_pop_layer .list-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 40px;
  box-sizing: border-box;
  border-bottom: 0.5px solid #e5e7e9;
  color: #999;
  font-size: 13px;
  line-height: 16px;
}

.Metacritic_pop_layer .list-item:last-child {
  border-bottom: 0;
}

.Metacritic_pop_layer .list-item .item-title {
  width: 200px;
  color: #5485bd;
  font-weight: bold;
}

.Metacritic_pop_layer .list-item .media-item-score {
  width: 50px;
  color: #222;
  text-align: start;
}

.Metacritic_pop_layer .list-item .media-item-score .publish-time {
  color: #999;
}

.Metacritic_pop_layer .list-item > .publish-time {
  width: 75px;
}

.Metacritic_list {
  overflow: auto;
  height: 320px;
}

.Metacritic_list::-webkit-scrollbar {
  display: none;
}

.Metacritic-table-tit {
  display: flex;
  justify-content: space-between;
  align-items: center;
  text-align: start;
  color: #999;
  line-height: 12px;
  font-size: 12px;
}

.Metacritic-table-tit .tit-meta {
  width: 200px;
}

#palyMark {
  display: none;
  position: absolute;
  background: #fff;
  z-index: 999;
  box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.1);
  overflow: visible;
  border-radius: 8px;
  right: 132px;
  width: 288px;
  top: -140px;
}

#palyMark:hover {
  opacity: 1;
}

#palyMark::after {
  width: 20px;
  height: 10px;
  content: "";
  display: block;
  position: absolute;
  transform: rotate(180deg);
  right: 8px;
  bottom: -10px;
  background: url(//image.gamersky.com/webimg13/www/newPc/img_bubble_arrow@2x.png)
    no-repeat center/20px 10px;
}

#palyMark .box {
  padding: 20px;
}

#palyMark .box .tit {
  display: flex;
  align-items: center;
}

#palyMark .box .tit img {
  width: 20px;
  height: 20px;
}

#palyMark .box .tit span {
  font-size: 18px;
  font-weight: 600;
  line-height: 24px;
  margin-left: 4px;
  color: #222;
}

#palyMark .box .m {
  margin: 12px 0;
  font-size: 12px;
  line-height: 16px;
  color: #999;
}

#palyMark .box .b {
  display: flex;
  align-items: center;
  gap: 12px;
}

#palyMark .box .b span:first-child {
  font-size: 15px;
  line-height: 24px;
  color: #222;
}

#palyMark .box .b span:last-child {
  font-size: 12px;
  line-height: 16px;
  color: #999;
}

#palyMark .box .b .star {
  display: flex;
  gap: 8px;
  cursor: pointer;
}

#palyMark .box .b .star div {
  width: 18px;
  height: 18px;
  background: #ddd;
  -webkit-mask-image: url("https://image.gamersky.com/webimg13/www/newPc/ku/star.svg");
  mask-image: url("https://image.gamersky.com/webimg13/www/newPc/ku/star.svg");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: cover;
  mask-size: cover;
}

#palyMark .box .b .star div.starLight {
  background: #ff9c1e;
}

#mode {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 998;
  display: none;
}

#textarea {
  display: none;
  padding: 20px;
  border-radius: 8px;
  width: 640px;
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 999;
  transform: translate(-50%, -50%);
  background: #fff;
  overflow: visible;
}

#textarea .header {
  margin-bottom: 12px;
  position: relative;
  overflow: visible;
}

#textarea .header .btn {
  display: flex;
  gap: 20px;
}

#textarea .header .btn div {
  font-size: 18px;
  line-height: 24px;
  color: #999;
  padding-bottom: 10px;
  cursor: pointer;
}

#textarea .header .btn .cur {
  color: #222;
  font-weight: 600;
  border-bottom: 2px solid #ff0000;
}

#textarea .textarea_close {
  width: 20px;
  height: 20px;
  position: absolute;
  right: -60px;
  background: url("https://image.gamersky.com/webimg13/www/newPc/ku/guanbi-bai.svg")
    no-repeat;
  background-size: cover;
  cursor: pointer;
}

#textarea .score {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}

#textarea .score .txt {
  color: #ccc;
  font-size: 12px;
  line-height: 16px;
}

#textarea .score .star {
  display: flex;
  gap: 2px;
}

#textarea .score .star div {
  width: 24px;
  height: 24px;
  background: #ddd;
  -webkit-mask-image: url("https://image.gamersky.com/webimg13/Star.svg");
  mask-image: url("https://image.gamersky.com/webimg13/Star.svg");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: cover;
  mask-size: cover;
  cursor: pointer;
}

#textarea .score .star div.starLight {
  background: #ff9c1e;
}

#textarea .pt {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
}

#textarea .pt .ptList {
  display: flex;
  gap: 8px;
}

#textarea .pt .ptList .ptItem {
  width: 59px;
  height: 22px;
  border-radius: 2px;
  background: #f5f7fa;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  font-size: 12px;
  line-height: 12px;
  text-align: center;
  color: #666;
  cursor: pointer;
}

#textarea .pt .ptList .ptItem img {
  width: 16px;
  height: 16px;
}

#textarea .pt .ptList .cur {
  background: rgba(255, 156, 30, 0.1);
  color: #ff9c1e;
}

#textarea .ku-pop-textarea {
  border: 1px solid #e5e7e9;
  padding: 15px;
  margin-bottom: 20px;
  border-radius: 4px;
}

#textarea .ku-pop-textarea .con {
  border: 0;
  border-bottom: 1px solid #e5e7e9;
  margin-bottom: 15px;
  height: 96px;
  padding: 0;
}

#textarea .bottom_btn {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

#textarea .bottom_btn .del {
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 4px;
  color: #999;
}

#textarea .bottom_btn .del img {
  width: 20px;
  height: 20px;
}

#textarea .bottom_btn .fabu {
  width: 58px;
  height: 32px;
  background: #ff0000;
  border-radius: 4px;
  font-size: 14px;
  font-weight: 600;
  line-height: 32px;
  text-align: center;
  color: #fff;
  cursor: pointer;
}

#textarea .score .t,
#textarea .pt .t {
  font-size: 15px;
  line-height: 24px;
  color: #222;
}

#textarea .ku-pop-textarea,
#textarea .ku-pop-textarea .con,
.ku-pop-textarea .con .textarea-code,
.ku-pop-textarea .bot {
  width: auto !important;
}

#delTip {
  width: 260px;
  background: #fff;
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 1001;
  transform: translate(-50%, -50%);
  box-sizing: border-box;
  border-radius: 6px;
  display: none;
}

#delTip .del_t {
  padding: 20px;
  border-bottom: 1px solid #e5e7e9;
}

#delTip .del_t .t1 {
  font-size: 17px;
  font-weight: 500;
  line-height: 22px;
  text-align: center;
  color: #222;
}

#delTip .del_t .t2 {
  font-size: 13px;
  font-weight: normal;
  line-height: 18px;
  text-align: center;
  color: #444;
}

#delTip .del_btn {
  display: flex;
}

#delTip .del_btn div {
  width: 50%;
  padding: 12px 15px;
  text-align: center;
  font-size: 17px;
  color: #999;
  cursor: pointer;
}

#delTip .del_btn div:last-child {
  border-left: 1px solid #e5e7e9;
  color: #ff9c1e;
}

.total {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 6px 8px;
  border-radius: 4px;
  background: rgba(0, 0, 0, 0.7);
  color: #fff;
  z-index: 9999;
}

.real-time-rank,
.week-rank {
  position: relative;
  top: 1px;
  margin-left: 2px;
  display: inline-block;
  width: 10px;
  height: 10px;
  cursor: pointer;
  background: url("//image.gamersky.com/webimg13/www/newPc/zq/images/icon_questionMark.png")
    no-repeat center/10px;
}

#real-time-rank,
#week-rank {
  position: relative;
}

/* Index2 local layout overrides. */
.contentArea .steamDataModules {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.contentArea .steamDataModules .steamDataMain {
  width: 100%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.contentArea .steamDataModules .steamDataMain .bigTitle {
  margin-bottom: 0;
}

.contentArea .steamDataModules .steamDataMain #SteamData {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
  align-items: stretch;
  width: 100%;
  min-width: 0;
}

.contentArea .steamDataModules .steamDataMain #SteamData .SD_content,
.contentArea .steamDataModules .steamDataMain #SteamData .steamOnlyPriceData {
  float: none;
  width: 100%;
  min-width: 0;
  height: auto;
  min-height: 236px;
  margin: 0;
  padding: 20px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
}

.contentArea .steamDataModules .steamDataMain #SteamData .steamOnlyPriceData {
  gap: 15px;
}

.contentArea .steamDataModules .steamDataMain #SteamData .SD_content_saleCount {
  display: flex;
}

.contentArea .steamDataModules .steamDataMain #SteamData .SD_content_top,
.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .MidRtit {
  width: 100%;
  min-height: 24px;
  margin: 0 0 15px;
  display: flex;
  align-items: center;
  gap: 8px;
  box-sizing: border-box;
}

.contentArea .steamDataModules .steamDataMain #SteamData .SD_content_tit,
.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .MidRtit
  .t1 {
  color: #999999;
  font-size: 12px;
  font-weight: 500;
  line-height: 14px;
  white-space: nowrap;
  flex-shrink: 0;
}

.contentArea .steamDataModules .steamDataMain #SteamData .SD_content_top i {
  content: "";
  display: block;
  height: 0.5px;
  flex: 1;
  background: #fff;
  opacity: 0.1;
}

.contentArea .steamDataModules .steamDataMain #SteamData .SD_content_top a {
  color: #666666;
  font-size: 12px;
  line-height: 14px;
  white-space: nowrap;
  flex-shrink: 0;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .MidRtit::after {
  content: "";
  display: block;
  height: 0.5px;
  flex: 1;
  background: #fff;
  opacity: 0.1;
}

.contentArea .steamDataModules .steamDataMain #SteamData .SD_content_data {
  width: 100%;
  min-width: 0;
  margin: 0 0 12px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.contentArea .steamDataModules .steamDataMain #SteamData .SD_content_data a {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  text-decoration: none;
}

.contentArea .steamDataModules .steamDataMain #SteamData .SD_content_data .t1 {
  color: var(--GamerSky-222222, #d7d7d9);
  font-family:
    var(--font-family-Font-4, Barlow), "BarlowSemi", "Barlow", sans-serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.contentArea .steamDataModules .steamDataMain #SteamData .SD_content_data .t2 {
  color: var(--GamerSky-666666, #a3a3a6);
  font-size: 12px;
  font-weight: 400;
  line-height: 14px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .SD_content_PraiseRate
  .SD_content_data,
.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .SD_content_saleCount
  .SD_content_data {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.contentArea .steamDataModules .steamDataMain #SteamData .SD_online-echart,
.contentArea .steamDataModules .steamDataMain #SteamData .SD_praiseRate-echart,
.contentArea .steamDataModules .steamDataMain #SteamData .SD_saleCount-echart {
  width: 100%;
  min-width: 0;
  height: auto;
  min-height: 112px;
  margin: auto 0 0;
  display: flex;
  flex: 1;
  flex-direction: column;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .SD_online-echart
  .echart,
.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .SD_praiseRate-echart
  .echart,
.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .SD_saleCount-echart
  .echart {
  width: 100%;
  min-width: 0;
  height: 96px;
  flex: 1 1 auto;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .SD_online-echart
  .echart.noData,
.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .SD_praiseRate-echart
  .echart.noData,
.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .SD_saleCount-echart
  .echart.noData {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--GamerSky-666666, #a3a3a6);
  font-size: 12px;
  line-height: 16px;
}

.contentArea .steamDataModules .steamDataMain #SteamData .echart-label {
  margin-top: 4px;
  color: var(--GamerSky-666666, #a3a3a6);
  font-size: 12px;
  line-height: 14px;
  text-align: center;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .MidRtit {
  width: 100%;
  min-height: 24px;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  box-sizing: border-box;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .MidRtit::after {
  display: none;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .MidRtit
  .t1 {
  color: var(--index-primary-color);
  font-size: 18px;
  font-weight: 600;
  line-height: 24px;
  white-space: nowrap;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .MidRtit
  .shopGuide {
  position: relative;
  flex-shrink: 0;
  box-sizing: border-box;
  min-height: 24px;
  padding: 4px 10px;
  border-radius: 13px;
  background: var(--GamerSky-FFFFFF, #ffffff);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  color: var(--GamerSky-999999, #999999);
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
  text-decoration: none;
  white-space: nowrap;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .MidRtit
  .shopGuide::before {
  content: "";
  width: 12px;
  height: 12px;
  flex-shrink: 0;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cg clip-path='url(%23clip0_1081_3032)'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 6C0 9.31371 2.68629 12 6 12C8.71629 12.0186 11.1002 10.1949 11.793 7.5684C11.9268 7.05621 11.9963 6.52936 12 6C12 2.68629 9.31371 0 6 0C2.68629 0 0 2.68629 0 6ZM0.858398 6.00042C0.858178 3.16032 3.1603 0.857753 6.0004 0.857422C7.36441 0.857263 8.6726 1.399 9.63715 2.36344C10.6017 3.32788 11.1436 4.63602 11.1436 6.00002C11.1436 8.84012 8.8413 11.1425 6.0012 11.1426C3.1611 11.1427 0.858619 8.84052 0.858398 6.00042Z' fill='black'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.853 6.38692C7.1806 6.08252 7.4078 5.86612 7.5346 5.73772C7.66547 5.60069 7.77527 5.44499 7.8604 5.27572C7.95669 5.08417 8.00488 4.87206 8.0008 4.65772C8.00212 4.36309 7.91792 4.07442 7.7584 3.82672C7.59003 3.56581 7.35264 3.35667 7.0726 3.22252C6.75326 3.06945 6.40246 2.99341 6.0484 3.00052C5.66732 2.99224 5.29069 3.08366 4.9558 3.26572C4.66392 3.42386 4.41841 3.6555 4.2436 3.93772C4.09034 4.17726 4.00605 4.4544 4 4.73872C4.00289 4.87269 4.05852 5.00011 4.1548 5.09332C4.25114 5.20014 4.38897 5.26008 4.5328 5.25772C4.786 5.25772 4.958 5.10052 5.0488 4.78612C5.11761 4.53759 5.23734 4.30609 5.4004 4.10632C5.57331 3.9402 5.80954 3.85686 6.0484 3.87772C6.27451 3.86918 6.49472 3.951 6.6604 4.10512C6.81623 4.24919 6.90348 4.45271 6.9004 4.66492C6.90112 4.77497 6.87431 4.88346 6.8224 4.98052C6.77095 5.07681 6.70633 5.16546 6.6304 5.24392C6.5548 5.32372 6.4312 5.44012 6.2608 5.59492C6.09795 5.73998 5.94294 5.89359 5.7964 6.05512C5.67957 6.18773 5.58623 6.3393 5.5204 6.50332C5.44786 6.69748 5.41402 6.90396 5.4208 7.11112C5.40913 7.26452 5.46023 7.41609 5.5624 7.53112C5.65502 7.62403 5.78164 7.67498 5.9128 7.67212C6.03355 7.67914 6.15204 7.63732 6.24164 7.55607C6.33124 7.47483 6.38441 7.36097 6.3892 7.24012C6.4186 7.10452 6.4408 7.00972 6.4552 6.95572C6.46969 6.89983 6.48979 6.84555 6.5152 6.79372C6.54789 6.72915 6.58818 6.66872 6.6352 6.61372C6.70342 6.53403 6.77614 6.45831 6.853 6.38692ZM6.37599 8.22501C6.26649 8.1076 6.11231 8.04218 5.95179 8.04501C5.79009 8.04358 5.63486 8.10841 5.52219 8.22441C5.40554 8.3406 5.34176 8.49962 5.34579 8.66421C5.33541 8.83623 5.40124 9.00411 5.52579 9.12321C5.64147 9.2306 5.79397 9.28945 5.95179 9.28761C6.11487 9.28899 6.27129 9.22298 6.38408 9.10519C6.49687 8.9874 6.55604 8.82828 6.54759 8.66541C6.55188 8.50152 6.49003 8.3428 6.37599 8.22501Z' fill='black'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_1081_3032'%3E%3Crect width='12' height='12' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E")
    no-repeat center/12px 12px;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cg clip-path='url(%23clip0_1081_3032)'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 6C0 9.31371 2.68629 12 6 12C8.71629 12.0186 11.1002 10.1949 11.793 7.5684C11.9268 7.05621 11.9963 6.52936 12 6C12 2.68629 9.31371 0 6 0C2.68629 0 0 2.68629 0 6ZM0.858398 6.00042C0.858178 3.16032 3.1603 0.857753 6.0004 0.857422C7.36441 0.857263 8.6726 1.399 9.63715 2.36344C10.6017 3.32788 11.1436 4.63602 11.1436 6.00002C11.1436 8.84012 8.8413 11.1425 6.0012 11.1426C3.1611 11.1427 0.858619 8.84052 0.858398 6.00042Z' fill='black'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.853 6.38692C7.1806 6.08252 7.4078 5.86612 7.5346 5.73772C7.66547 5.60069 7.77527 5.44499 7.8604 5.27572C7.95669 5.08417 8.00488 4.87206 8.0008 4.65772C8.00212 4.36309 7.91792 4.07442 7.7584 3.82672C7.59003 3.56581 7.35264 3.35667 7.0726 3.22252C6.75326 3.06945 6.40246 2.99341 6.0484 3.00052C5.66732 2.99224 5.29069 3.08366 4.9558 3.26572C4.66392 3.42386 4.41841 3.6555 4.2436 3.93772C4.09034 4.17726 4.00605 4.4544 4 4.73872C4.00289 4.87269 4.05852 5.00011 4.1548 5.09332C4.25114 5.20014 4.38897 5.26008 4.5328 5.25772C4.786 5.25772 4.958 5.10052 5.0488 4.78612C5.11761 4.53759 5.23734 4.30609 5.4004 4.10632C5.57331 3.9402 5.80954 3.85686 6.0484 3.87772C6.27451 3.86918 6.49472 3.951 6.6604 4.10512C6.81623 4.24919 6.90348 4.45271 6.9004 4.66492C6.90112 4.77497 6.87431 4.88346 6.8224 4.98052C6.77095 5.07681 6.70633 5.16546 6.6304 5.24392C6.5548 5.32372 6.4312 5.44012 6.2608 5.59492C6.09795 5.73998 5.94294 5.89359 5.7964 6.05512C5.67957 6.18773 5.58623 6.3393 5.5204 6.50332C5.44786 6.69748 5.41402 6.90396 5.4208 7.11112C5.40913 7.26452 5.46023 7.41609 5.5624 7.53112C5.65502 7.62403 5.78164 7.67498 5.9128 7.67212C6.03355 7.67914 6.15204 7.63732 6.24164 7.55607C6.33124 7.47483 6.38441 7.36097 6.3892 7.24012C6.4186 7.10452 6.4408 7.00972 6.4552 6.95572C6.46969 6.89983 6.48979 6.84555 6.5152 6.79372C6.54789 6.72915 6.58818 6.66872 6.6352 6.61372C6.70342 6.53403 6.77614 6.45831 6.853 6.38692ZM6.37599 8.22501C6.26649 8.1076 6.11231 8.04218 5.95179 8.04501C5.79009 8.04358 5.63486 8.10841 5.52219 8.22441C5.40554 8.3406 5.34176 8.49962 5.34579 8.66421C5.33541 8.83623 5.40124 9.00411 5.52579 9.12321C5.64147 9.2306 5.79397 9.28945 5.95179 9.28761C6.11487 9.28899 6.27129 9.22298 6.38408 9.10519C6.49687 8.9874 6.55604 8.82828 6.54759 8.66541C6.55188 8.50152 6.49003 8.3428 6.37599 8.22501Z' fill='black'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_1081_3032'%3E%3Crect width='12' height='12' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E")
    no-repeat center/12px 12px;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .MidRtit
  .shopGuide::after {
  display: none;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .MidRtit
  .shopGuide:hover {
  color: var(--index-primary-color, #2aae68);
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .GamePriceData,
.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .GamePriceDataList {
  width: 100%;
  min-width: 0;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .GamePriceData {
  flex: 1 1 auto;
  height: auto;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .GamePriceDataList {
  width: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  gap: 15px;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .GamePriceDataList
  .gamePriceItem {
  cursor: pointer;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .gamePriceItem {
  position: relative;
  width: auto;
  height: auto;
  min-height: 62px;
  padding: 10px 0 10px 54px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  box-sizing: border-box;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .gamePriceItem::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 42px;
  height: 42px;
  border: 0.5px solid var(--GamerSky-EEEEEE, #eeeeee);
  border-radius: 4px;
  box-sizing: border-box;
  transform: translateY(-50%);
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .gamePriceItem::after {
  position: absolute;
  display: block;
  content: "";
  width: 100%;
  height: 0.5px;
  background: var(--GamerSky-EEEEEE, #eeeeee);
  bottom: 0;
  left: 0;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .gamePriceItem:last-child::after {
  display: none;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .gamePriceItem[data-plat="Steam"] {
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .gamePriceItem[data-plat="Steam"]::before {
  background:
    url("//image.gamersky.com/webimg13/www/newPc/zq/images/icon_price_steam.png")
      no-repeat center/28px 28px,
    var(--GamerSky-F5F7FA, #f5f7fa);
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .gamePriceItem[data-plat="FengHuang"] {
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .gamePriceItem[data-plat="FengHuang"]::before {
  background:
    url("//image.gamersky.com/webimg13/www/newPc/zq/images/icon_price_fenghuang.png")
      no-repeat center/28px 28px,
    var(--GamerSky-F5F7FA, #f5f7fa);
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .gamePriceItem[data-plat="FengHuang"]
  .buyNow {
  background: #ff8900;
  color: var(--GamerSky-FFFFFD, #fffffd);
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .gamePriceItem[data-plat="FengHuang"]
  .gamePriceInfo
  .rightArrow {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M10.8786 6.23195C11.1716 5.93894 11.1716 5.46295 10.8786 5.16995L7.12861 1.41995C6.83561 1.12695 6.36061 1.12695 6.06761 1.41995C5.77461 1.71295 5.77461 2.18895 6.06761 2.48195L8.53961 4.95195H1.34961C0.934609 4.95195 0.599609 5.28695 0.599609 5.70195C0.599609 6.11695 0.934609 6.45195 1.34961 6.45195H8.53761L6.06961 8.92195C5.77661 9.21494 5.77661 9.69095 6.06961 9.98395C6.36261 10.2769 6.83861 10.2769 7.13161 9.98395L10.8816 6.23395L10.8786 6.23195Z' fill='%23FF9F1D'/%3E%3C/svg%3E")
    no-repeat center/12px 12px;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .gamePriceName {
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
  width: auto;
  justify-content: flex-start;
  flex-direction: column;
  gap: 4px;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .gamePriceName
  .buyNow {
  position: relative;
  box-sizing: border-box;
  min-height: 18px;
  padding: 2px 6px;
  margin-right: 0;
  width: fit-content;
  background: var(--GamerSky-F5F7FA, #f5f7fa);
  color: var(--GamerSky-222222, #222222);
  font-size: 10px;
  line-height: 14px;
  font-weight: normal;
  text-align: center;
  border-radius: 10px;
  text-decoration: none;
  white-space: nowrap;
  flex-shrink: 0;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .gamePriceName
  .buyNow::after {
  display: none;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .gameName {
  margin-right: 0;
  max-width: 90px;
  width: auto;
  font-size: 16px;
  font-weight: 500;
  line-height: 20px;
  color: var(--GamerSky-222222, #222222);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .price {
  font-size: 16px;
  line-height: 18px;
  font-weight: 600;
  color: var(--GamerSky-222222, #222222);
  display: flex;
  justify-content: flex-end;
  font-family: "BarlowSemi";
  white-space: nowrap;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .price
  span {
  margin-left: 2px;
  font-size: 10px;
  font-weight: 600;
  color: var(--GamerSky-999999, #999999);
  font-family: "BarlowSemi";
  text-decoration: line-through;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .gamePriceInfo {
  position: relative;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: end;
  justify-content: center;
  min-width: 82px;
  max-width: 118px;
  min-height: 22px;
  padding-right: 18px;
  font-family: "BarlowSemi";
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .gamePriceInfo
  .rightArrow {
  display: block;
  position: absolute;
  top: 50%;
  right: 0;
  width: 12px;
  height: 12px;
  margin-top: -6px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='M10.8786 6.23195C11.1716 5.93894 11.1716 5.46295 10.8786 5.16995L7.12861 1.41995C6.83561 1.12695 6.36061 1.12695 6.06761 1.41995C5.77461 1.71295 5.77461 2.18895 6.06761 2.48195L8.53961 4.95195H1.34961C0.934609 4.95195 0.599609 5.28695 0.599609 5.70195C0.599609 6.11695 0.934609 6.45195 1.34961 6.45195H8.53761L6.06961 8.92195C5.77661 9.21494 5.77661 9.69095 6.06961 9.98395C6.36261 10.2769 6.83861 10.2769 7.13161 9.98395L10.8816 6.23395L10.8786 6.23195Z' fill='%23717173'/%3E%3C/svg%3E")
    no-repeat center/12px 12px;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .saleInfo {
  margin-top: 2px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  color: var(--GamerSky-666666, #666666);
  font-size: 10px;
  white-space: nowrap;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .saleInfo
  .saleEndDate {
  margin-right: 2px;
  font-size: 12px;
  line-height: 12px;
  font-weight: normal;
  color: #999;
  max-width: 49px;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .saleInfo
  .saleDiscountRate {
  display: flex;
  align-items: center;
  height: 16px;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .saleInfo
  .saleDiscountRate
  > span:first-child {
  box-sizing: border-box;
  min-width: 31px;
  height: 16px;
  padding: 2px;
  border-radius: 2px 0 0 2px;
  background: var(--GamerSky-222222, #222222);
  font-size: 10px;
  font-weight: 400;
  line-height: 12px;
  color: var(--GamerSky-FFFFFF, #ffffff);
  text-align: center;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .saleInfo
  .lowest {
  box-sizing: border-box;
  min-width: 22px;
  height: 16px;
  padding: 2px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 400;
  line-height: 12px;
  color: var(--GamerSky-FFFFFD, #fffffd);
  background: #ff9f1d;
  border-radius: 0 2px 2px 0;
}

.ku_pop_layer.steam-data-local-modal {
  position: fixed;
  z-index: 30000;
  top: 50%;
  left: 50%;
  width: 704px;
  max-width: calc(100vw - 160px);
  max-height: calc(100vh - 72px);
  margin: 0;
  padding: 20px;
  box-sizing: border-box;
  transform: translate(-50%, -50%);
  display: block;
  background: #fff;
  border-radius: 8px;
  color: #222;
  overflow: visible;
  text-align: left;
  font-family:
    -apple-system,
    BlinkMacSystemFont,
    PingFang SC,
    Hiragino Sans GB,
    Microsoft YaHei,
    "微软雅黑",
    helvetica neue,
    helvetica,
    ubuntu,
    roboto,
    noto,
    segoe ui,
    Arial,
    sans-serif;
}

.ku_pop_layer.steam-data-local-modal .ku-pop-top {
  position: relative;
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0;
  overflow: visible;
  background: none;
  border-radius: 0;
  box-sizing: border-box;
}

.ku_pop_layer.steam-data-local-modal .ku-pop-top-t {
  margin: 0 0 20px;
  color: #222;
  font-size: 18px;
  font-weight: 600;
  line-height: 24px;
}

.ku_pop_layer.steam-data-local-modal .ku-pop-top-tit {
  width: 100%;
  height: auto;
  min-height: 26px;
  margin: 0 0 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  float: none;
  overflow: visible;
  color: #222;
  font-size: 15px;
  font-weight: 600;
  line-height: 22px;
  box-sizing: border-box;
}

.ku_pop_layer.steam-data-local-modal .ku-pop-top-date {
  margin-left: auto;
  padding: 2px;
  border-radius: 13px;
  background: #f5f7fa;
  display: flex;
  align-items: center;
  gap: 0;
  color: #999;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
}

.ku_pop_layer.steam-data-local-modal .ku-pop-top-date div {
  min-width: 42px;
  height: 22px;
  padding: 0 8px;
  border-radius: 12px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 12px;
}

.ku_pop_layer.steam-data-local-modal .ku-pop-top-date div.cur {
  color: #222;
  font-weight: 600;
  background: #fff;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.16);
}

.ku_pop_layer.steam-data-local-modal .ku_pop_close {
  position: absolute;
  right: -72px;
  top: 0;
  width: 20px;
  height: 20px;
  display: block;
  cursor: pointer;
  background: url("https://image.gamersky.com/webimg13/www/newPc/ku/guanbi-bai.svg")
    no-repeat center/20px;
}

.ku_pop_layer.steam-data-local-modal .sdpl-nums {
  width: 100%;
  margin: 0 0 18px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.ku_pop_layer.steam-data-local-modal .sdpl-nums .sdpl-item {
  width: auto;
  height: 44px;
  flex: 1;
  padding: 0 10px;
  box-sizing: border-box;
  position: relative;
  text-align: center;
}

.ku_pop_layer.steam-data-local-modal .sdpl-nums .sdpl-item::after {
  content: "";
  position: absolute;
  display: block;
  right: 0;
  top: 15px;
  width: 1px;
  height: 10px;
  background: #e5e7e9;
}

.ku_pop_layer.steam-data-local-modal .sdpl-nums .sdpl-item:last-child::after {
  display: none;
}

.ku_pop_layer.steam-data-local-modal .sdpl-nums .sdpl-i-mm {
  color: #222;
  font-size: 16px;
  font-weight: 600;
  line-height: 22px;
  text-align: center;
}

.ku_pop_layer.steam-data-local-modal .sdpl-nums .sdpl-i-fz {
  color: #999;
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
  text-align: center;
  display: block;
}

.ku_pop_layer.steam-data-local-modal #steamEchart {
  width: 100%;
  height: 124px;
  margin: 0;
  padding: 0;
}

.ku_pop_layer.steam-data-local-modal .ku_pop_layer_content {
  height: auto;
  max-height: calc(100vh - 144px);
  overflow: hidden auto;
  box-sizing: border-box;
  scrollbar-width: none;
}

.ku_pop_layer.steam-data-local-modal .ku_pop_layer_content::-webkit-scrollbar {
  display: none;
}

.ku_pop_layer.steam-data-local-modal.praise-rate_pop_layer,
.ku_pop_layer.steam-data-local-modal.sale_count_pop_layer {
  height: auto;
  margin: 0;
  padding-bottom: 24px;
}

.ku_pop_layer.steam-data-local-modal.praise-rate_pop_layer .sdpl-nums {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 15px 31px;
  margin-bottom: 15px;
  padding-bottom: 15px;
  background: transparent;
  position: relative;
}

.ku_pop_layer.steam-data-local-modal.praise-rate_pop_layer .sdpl-nums::after {
  position: absolute;
  display: block;
  content: "";
  width: 100%;
  height: 1px;
  background: #f5f7fa;
  bottom: 0;
  left: 0;
}

.ku_pop_layer.steam-data-local-modal.praise-rate_pop_layer
  .sdpl-nums
  .sdpl-item {
  width: auto;
  padding: 0;
}

.ku_pop_layer.steam-data-local-modal.sale_count_pop_layer #saleCountEchart {
  width: 100%;
  height: 156px;
  margin: 15px 0;
  padding-bottom: 15px;
  border-bottom: 0.5px solid #f5f7fa;
  box-sizing: border-box;
}

.ku_pop_layer.steam-data-local-modal.price_data_pop_layer {
  width: 640px;
  height: auto;
  max-height: calc(100vh - 72px);
  margin: 0;
  padding: 20px;
  background: #fff;
  color: #222;
  overflow: visible;
  box-sizing: border-box;
}

.ku_pop_layer.steam-data-local-modal.price_data_pop_layer .ku-pop-top {
  margin-left: 0;
  width: 100%;
  background: #fff;
  padding: 0;
  font-size: 14px;
  overflow: visible;
  position: static;
}

.ku_pop_layer.steam-data-local-modal.price_data_pop_layer .ku-pop-top > div {
  position: relative;
}

.ku_pop_layer.steam-data-local-modal.price_data_pop_layer .ku-pop-top-tit-left {
  display: flex;
  flex-direction: row;
  font-size: 18px;
  height: 24px;
  line-height: 24px;
  color: #222;
  font-weight: 600;
}

.ku_pop_layer.steam-data-local-modal.price_data_pop_layer .ku-pop-tubiao {
  margin-top: 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 15px;
  font-weight: 600;
  line-height: 26px;
  color: #444;
}

.ku_pop_layer.steam-data-local-modal.price_data_pop_layer .ku-pop-top-date {
  display: flex;
  align-items: center;
  font-size: 12px;
  font-weight: normal;
  line-height: 14px;
  letter-spacing: 0;
  color: #999;
  background: #f5f7fa;
  border-radius: 100px;
  padding: 0 2px;
  box-sizing: border-box;
  height: 26px;
}

.ku_pop_layer.steam-data-local-modal.price_data_pop_layer .ku-pop-top-date div {
  min-width: 0;
  height: auto;
  padding: 4px 8px;
  font-size: 12px;
  color: #999;
  text-align: center;
  font-weight: 400;
  cursor: pointer;
  border-radius: 0;
  display: block;
}

.ku_pop_layer.steam-data-local-modal.price_data_pop_layer
  .ku-pop-top-date
  div.cur {
  background: #fff;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
  color: #222;
  font-weight: bold;
  border-radius: 100px;
}

.ku_pop_layer.steam-data-local-modal.price_data_pop_layer
  .ku-price-data-echart {
  width: 100%;
  height: 124px;
  margin: 15px 0;
  padding: 0;
  position: relative;
}

.ku_pop_layer.steam-data-local-modal.price_data_pop_layer .tooltipPrice {
  min-width: 58px;
  font-family: "BarlowSemi";
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  color: #dfae29;
}

.ku_pop_layer.steam-data-local-modal.price_data_pop_layer .tooltipPrice .p {
  color: #dfae29;
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
}

.ku_pop_layer.steam-data-local-modal.price_data_pop_layer .tooltipPrice .t {
  margin-top: 4px;
  color: #999;
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
}

.ku_pop_layer.steam-data-local-modal.price_data_pop_layer .noDiscount,
.ku_pop_layer.steam-data-local-modal.price_data_pop_layer .noData {
  position: absolute;
  top: 120px;
  left: 50%;
  transform: translate(-45%, -50%);
  font-size: 12px;
  color: #999;
  display: none;
}

.ku_pop_layer.steam-data-local-modal.price_data_pop_layer .steamDataOnlineMax {
  margin-top: 15px;
  margin-bottom: 20px;
  font-size: 12px;
  color: #999;
  text-align: center;
}

.ku_pop_layer.steam-data-local-modal.price_data_pop_layer
  .steamDataOnlineMax
  .onlineMaxNum {
  font-size: 12px;
  margin-left: 8px;
  color: #eb413d;
}

.ku_pop_layer.steam-data-local-modal.price_data_pop_layer .area-price {
  font-size: 15px;
  font-weight: 600;
  line-height: 26px;
  color: #444;
}

.ku_pop_layer.steam-data-local-modal.price_data_pop_layer .ku-price-List {
  padding-bottom: 0;
  max-height: 300px;
  overflow-y: auto;
  display: grid;
  grid-template-columns: 50% 1fr;
  background: #f5f5f5;
  border-radius: 2px;
}

.ku_pop_layer.steam-data-local-modal.price_data_pop_layer .ku-price-item {
  padding: 12px 10px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 50px;
  box-sizing: border-box;
}

.ku_pop_layer.steam-data-local-modal.price_data_pop_layer
  .ku-price-item
  .gameName {
  color: #222;
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
}

.ku_pop_layer.steam-data-local-modal.price_data_pop_layer .currencypriceLowest {
  margin-top: 4px;
  font-size: 10px;
  color: #999;
  line-height: 12px;
}

.ku_pop_layer.steam-data-local-modal.price_data_pop_layer
  .ku-price-item
  .gamePriceInfo {
  display: flex;
  align-items: center;
}

.ku_pop_layer.steam-data-local-modal.price_data_pop_layer .ku-price-item .day {
  margin-right: 4px;
  color: #999;
  font-size: 10px;
}

.ku_pop_layer.steam-data-local-modal.price_data_pop_layer
  .ku-price-item
  .saleInfo {
  margin-right: 40px;
  display: flex;
  align-items: center;
  color: #666;
  font-size: 10px;
}

.ku_pop_layer.steam-data-local-modal.price_data_pop_layer
  .ku-price-item
  .saleDiscountRate
  .rate {
  padding: 4px 2px;
  display: inline-block;
  font-size: 10px;
  font-weight: 600;
  line-height: 10px;
  color: #fff;
  background: #222;
}

.ku_pop_layer.steam-data-local-modal.price_data_pop_layer
  .ku-price-item
  .lowest {
  padding: 2px;
  display: inline-block;
  font-size: 10px;
  font-weight: 600;
  color: #fff;
  background: #ff9f1d;
  border-radius: 0 2px 2px 0;
}

.ku_pop_layer.steam-data-local-modal.price_data_pop_layer
  .ku-price-item
  .price {
  display: flex;
  flex-direction: column;
  align-items: end;
  color: #222;
  font-family: "BarlowSemi";
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
}

.ku_pop_layer.steam-data-local-modal.price_data_pop_layer .price-currency-name {
  margin-top: 2px;
  font-size: 10px;
  color: #999;
  font-weight: 400;
  line-height: 12px;
}

.ku_pop_layer.steam-data-local-modal.price_data_pop_layer .ku-price-empty {
  grid-column: 1 / -1;
  padding: 20px 0;
  font-size: 12px;
  color: #999;
  text-align: center;
}

.contentArea
  .steamDataModules
  .steamDataMain
  #SteamData
  .steamOnlyPriceData
  .gamePriceItem[data-plat="Steam"]
  .gamePriceInfo {
  cursor: pointer;
}

.ku_pop_mask.steam-data-mask {
  position: fixed;
  z-index: 20000;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  background: #000;
  opacity: 0.6;
}