:root {
  color-scheme: light;
  --page: #efeff4;
  --text: #333;
  --muted: #666;
  --red: #c42017;
  --blue: #0d8ddd;
  --line: #f0f0f0;
}

* { box-sizing: border-box; }
html { font-size: 26.66667vw; }
html, body { margin: 0; min-height: 100%; }
body {
  width: 100%;
  overflow-x: hidden;
  background: var(--page);
  color: var(--muted);
  font-family: -apple-system, BlinkMacSystemFont, "PingFang TC", "Microsoft JhengHei", "Microsoft YaHei", sans-serif;
  font-size: .12rem;
  font-weight: 600;
}
body.drawer-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }

.headbox { align-items: center; background: #fff; display: flex; height: .5rem; justify-content: flex-end; line-height: 1; padding: 0 .1rem; position: relative; width: 100%; z-index: 20; }
.brand-title { align-items: center; display: flex; flex: 1 1 auto; height: 100%; min-width: 0; overflow: hidden; }
.brand-title img { display: block; height: .42rem; max-width: 100%; object-fit: contain; object-position: left center; width: auto; }
.logo { align-items: center; display: flex; flex: 0 0 65%; height: 100%; min-width: 0; width: 65%; }
.logo a { align-items: center; display: flex; height: 100%; }
.logo img { display: block; height: .35rem; width: auto; object-fit: contain; }
.header-table { flex: 0 0 35%; margin-left: 0; text-align: right; width: 35%; }
.ht-top { align-items: center; display: flex; line-height: .2rem; white-space: nowrap; }
.header-table a { color: #6d6d6d; font-size: .135rem; font-weight: 500; }
.ht-sethome { border-right: 1px solid #6d6d6d; margin-right: .02rem; padding-right: .04rem; }
.menu-button { align-items: center; background: transparent; border: 0; cursor: pointer; display: flex; flex-direction: column; gap: .04rem; height: .32rem; justify-content: center; padding: 0 .02rem; width: .28rem; }
.menu-button span { background: #c42017; display: block; height: 2px; width: .21rem; }

.bannerbox { min-height: 1.8rem; overflow: hidden; }
.main_visual { aspect-ratio: 656 / 315; background: #d8d8d8; min-height: 1.8rem; overflow: hidden; position: relative; width: 100%; }
.main_image { height: 100%; overflow: hidden; position: relative; width: 100%; }
.main_image ul { height: 100%; list-style: none; margin: 0; padding: 0; position: relative; width: 100%; }
.main_image li { display: none; height: 100%; width: 100%; }
.main_image li.is-active { display: block; }
.main_image li a, .main_image li img { display: block; height: 100%; width: 100%; }
.main_image li img { object-fit: cover; }
.banner-arrow { background: rgba(0,0,0,.2); border: 0; border-radius: 50%; color: #fff; cursor: pointer; display: none; font-size: .28rem; height: .36rem; line-height: .3rem; padding: 0; position: absolute; top: calc(50% - .18rem); width: .36rem; z-index: 2; }
.banner-arrow.prev { left: .08rem; }
.banner-arrow.next { right: .08rem; }
.flicking_con { bottom: .08rem; display: flex; gap: .08rem; justify-content: center; left: 0; position: absolute; width: 100%; z-index: 2; }
.flicking_con button { background: rgba(255,255,255,.6); border: 0; border-radius: 50%; cursor: pointer; height: .08rem; padding: 0; width: .08rem; }
.flicking_con button.on { background: #fff; }

.notice { align-items: center; background: #fff; border-bottom: 1px solid #e1e1e3; display: flex; height: .36rem; overflow: hidden; padding: 0 .1rem; width: 100%; }
.notice[hidden] { display: none; }
.notice-icon { align-items: center; border: 1px solid #f1010a; border-radius: 50%; color: #f1010a; display: inline-flex; flex: 0 0 auto; font-size: .1rem; height: .16rem; justify-content: center; margin-right: .08rem; width: .16rem; }
.noticeWrapper { overflow: hidden; width: 100%; }
#noticeT { color: #f1010a; font-size: .14rem; font-weight: 500; line-height: .36rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.info_box { border: 1px solid #ddd; box-sizing: border-box; float: left; font-size: .15rem; padding: 0; width: 99%; }
.info_box-lottery-list { background: #efeff4; box-sizing: border-box; margin-top: 0; padding: .1rem .12rem; }
.home-list { background: transparent; }
.lottery-list { margin: 0; padding: 0; }
.lottery-card { background: #fff; border: 1px solid var(--line); border-radius: .1rem; box-shadow: 0 .02rem .08rem rgba(0,0,0,.05); margin-bottom: .1rem; min-height: 1.05rem; padding: .14rem .14rem .12rem; width: 100%; }
.lottery-card:last-child { margin-bottom: 0; }
.lottery-card-header { align-items: center; color: var(--red); display: flex; font-size: .14rem; font-weight: 700; justify-content: space-between; line-height: 1.4; margin-bottom: .1rem; padding: 0 .02rem; }
.lottery-title { flex: 1; overflow: hidden; padding-right: .1rem; text-align: left; text-overflow: ellipsis; white-space: nowrap; }
.lottery-date { flex-shrink: 0; font-size: .13rem; text-align: right; white-space: nowrap; }
.lottery-card-balls { min-height: .44rem; padding: .08rem .02rem; text-align: left; width: 100%; }
.result_num { align-content: flex-start; align-items: flex-start; display: flex; flex-wrap: wrap; gap: .06rem; justify-content: flex-start; list-style: none; margin: 0; padding: 0; }
.result_num li { align-items: center; display: flex; flex: 0 0 .34rem; flex-direction: column; font-size: .14rem; font-weight: 600; height: auto; justify-content: flex-start; line-height: normal; margin: 0; min-width: .34rem; }
.result_num li i { align-items: center; background: #fff; border-radius: 50%; color: #000; display: inline-flex; font-size: .15rem; font-style: normal; font-weight: 700; height: .34rem; justify-content: center; min-height: .34rem; min-width: .34rem; width: .34rem; }
.result_num li.blue i { border: .03rem solid var(--blue); }
.result_num li.red i { border: .03rem solid #ed2a43; }
.result_num li.green i { border: .03rem solid #1ab246; }
.result_num.bgbg13 { display: grid; gap: .05rem .04rem; grid-template-columns: repeat(10, minmax(0, 1fr)); }
.result_num.bgbg13 li { flex: unset; min-width: 0; width: 100%; }
.result_num.bgbg13 li i { font-size: .15rem; height: auto; min-height: 0; width: 100%; aspect-ratio: 1; }
.result_num.ssq-result, .result_num.qlc-result, .result_num.dlt-result { flex-wrap: nowrap; gap: .05rem; }
.result_num.ssq-result li, .result_num.qlc-result li, .result_num.dlt-result li { flex-basis: .34rem; min-width: .34rem; }
.result_num.ssq-result li.red + li.blue, .result_num.qlc-result li.red + li.blue, .result_num.dlt-result li.red + li.blue { margin-left: .06rem; }
.result_num.ssq-result li i, .result_num.qlc-result li i, .result_num.dlt-result li i { font-size: .15rem; }
.empty-result { min-height: .34rem; }
.empty-message { color: #999; flex: 1 1 auto !important; font-size: .13rem; line-height: .34rem; width: 100% !important; }
.opening-result { justify-content: center; }
.opening-result .empty-message { color: var(--red); font-size: .16rem; font-weight: 700; text-align: center; }

.lottery-card-btns { align-items: stretch; border-top: 1px solid #f3f3f3; display: flex; flex-wrap: nowrap; gap: .08rem; justify-content: space-between; margin-top: .12rem; padding: .1rem .02rem .02rem; }
.lottery-btn { border: 1px solid var(--red); border-radius: 999px; color: var(--red); flex: 1 1 0; font-size: .12rem; font-weight: 500; line-height: 1.3; min-width: 0; overflow: hidden; padding: .06rem .04rem; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.lottery-btn:active, .lottery-btn:hover { background: #fff1f0; }
.lottery-card-loading { align-items: center; color: #999; display: flex; justify-content: center; min-height: 1.05rem; }
.lottery-card-loading .lottery-card-header { color: #999; justify-content: center; margin: 0; }
.drawer-backdrop {
  background: rgba(0,0,0,.35);
  inset: 0;
  opacity: 0;
  pointer-events: none;
  position: fixed;
  transition: opacity .2s ease;
  z-index: 40;
}
.drawer-backdrop.is-open { opacity: 1; pointer-events: auto; }
.lottery-drawer {
  background: #fff;
  bottom: 0;
  box-shadow: -.04rem 0 .16rem rgba(0,0,0,.16);
  max-width: 3.2rem;
  overflow-y: auto;
  position: fixed;
  right: 0;
  top: 0;
  transform: translateX(100%);
  transition: transform .22s ease;
  width: 78vw;
  z-index: 50;
}
.lottery-drawer.is-open { transform: translateX(0); }
.drawer-head {
  align-items: center;
  border-bottom: 1px solid #eee;
  color: var(--red);
  display: flex;
  font-size: .16rem;
  height: .56rem;
  justify-content: space-between;
  padding: 0 .16rem;
  position: sticky;
  top: 0;
  background: #fff;
  z-index: 1;
}
.drawer-close {
  background: transparent;
  border: 0;
  color: #777;
  cursor: pointer;
  font-size: .28rem;
  height: .36rem;
  line-height: .3rem;
  padding: 0;
  width: .36rem;
}
.drawer-list { padding: .08rem .12rem .2rem; }
.drawer-item {
  align-items: center;
  background: #fff;
  border: 1px solid #e6e6e6;
  border-radius: .04rem;
  color: #333;
  cursor: pointer;
  display: flex;
  font-size: .14rem;
  justify-content: space-between;
  margin: .06rem 0;
  min-height: .42rem;
  padding: 0 .12rem;
  text-align: left;
  width: 100%;
}
.drawer-item::after { color: #aaa; content: '›'; font-size: .22rem; line-height: 1; }
.drawer-item:hover, .drawer-item:active { border-color: var(--red); color: var(--red); }
.drawer-item.is-unavailable { color: #bbb; cursor: default; }
.drawer-item.is-unavailable::after { content: ''; }
.lottery-card { scroll-margin-top: .12rem; }
@media (min-width: 569px) {
  html { font-size: 16vw; }
  body { max-width: 750px; margin: 0 auto; }
  .banner-arrow { display: block; }
}
@media (max-width: 360px) {
  .header-table a { font-size: .12rem; }
  .lottery-card-btns { gap: .04rem; }
  .lottery-btn { font-size: .11rem; }
}