:root {
  --bg: #262626;
  --bg-hover: linear-gradient(#101112ab, #17191b 40%, #1b1e20);
  --header-bg: rgba(52, 50, 50, 0.7);
  --header-icon-width: 22px;
  --text-color: #fff;
  --text-color2: #aaa;
  --text-color-hover: #f3f5f7;
  --border: 1px solid #f3f5f726;
  --borderRadius: 5px;
  --borderRadius2: 2em;
  --transition: all 0.5s;
  --padding: 1rem;
  --padding-vertical: calc(var(--padding) / 2);
  --padding-horizontal: var(--padding);
  --layout-padding: var(--padding);
  --layout-width: 940px;
  --line-bg: #444;
  --logo-width: 80px;
  --navList-color: #c9c9c9;
  --navList-color-hover: #ffffffbf;
  --navList-btnIn-hover: #1f1e1e;
  --navList-btnIn-padding: 0.782rem 0.469rem;
  --navList-btnIn-bg: #222;
  --navList-btnIn-bg-hover: #403e3e;
  --navList-borderRadius: 0.65rem;
  --navTop-width: 400px;
  --navTop-icon-width: 40px;
  --navTop-btn-bg: #2c2a2a;
  --navTop-center-bg: #161616;
  --navTop-btnIn-borderRadius: 0.5rem;
  --navTop-color: #888;
  --navTop-color2: #c9c9c9;
  --navTop-noRecord-color: #d1d1d1;
  --navTop-search-icon-width: 30px;
  --navTop-search-width: 466px;
  --navTop-search-input-color: #fff;
  --navTop-search-bg: #222;
  --navTop-search-searchBtn-width: 0;
  --navTop-search-searchBtn-bg: #414141;
  --navTop-userLogin-account-color: #1abc9d;
  --navTop-userLogin-accountId-color: var(--navList-color);
  --navTop-userLogin-logOut-color: #ee2b4b;

  --headerAdBg-color: #ffbf00;
  --headerAdBg-bg-hover: #ffbf000d;
  --headerAdBg-border: 1px solid #635220;
  --headerAdBg-borderRadius: var(--borderRadius);
  --headerAd-btnIn-topBeforeBg: linear-gradient(
    to right,
    transparent,
    #ffbf0080 var(--tw-gradient-via-position),
    transparent
  );
  --headerAd-btnIn-bg: linear-gradient(to bottom, #343232, #262626);
  --headerAd-btnIn-boxShadow:
    0 20px 25px -5px #ffbf000d, 0 8px 10px -6px #ffbf000d;
  --headerAdBg-line-bg: linear-gradient(
    to right,
    rgba(255, 191, 0, 0) 0%,
    #ffbf0080 43%,
    rgba(255, 191, 0, 0) 99%,
    rgba(255, 191, 0, 0) 100%
  );
  --lightBox_headerAd-borderRadius: 0;
  --lightBox_headerAd-bg: #0b0a0a;
  --lightBox_headerAd-bg2: radial-gradient(
    ellipse at center,
    rgba(238, 43, 75, 0.2) 20%,
    rgba(238, 71, 153, 0) 100%,
    rgba(238, 71, 153, 0) 100%
  );
  --lightBox_headerAd-bg3: #14141499;
  --lightBox_headerAd-border: 1px solid #33333380;
  --lightBox_headerAd-badge-borderRadius: 1.5em;
  --lightBox_headerAd-color: #999;
  --lightBox_headerAd-color2: #ffbf00;
  --lightBox_headerAd-color3: #ee2b4b;
  --lightBox_headerAd-gradient-bg: linear-gradient(90deg, #ff2fb3, #ffa33a);
  --lightBox_headerAd-reward-box-borderRadius: 0.75em;
  --lightBox_headerAd-reward-box-border: 1px solid rgba(255, 255, 255, 0.1);
  --lightBox_headerAd-reward-box-box-shadow:
    0 0 20px #ee2b4b66, 0 0 40px #ee2b4b33, 0 0 60px #ee2b4b1a;
  --lightBox_headerAd-cta-bg: linear-gradient(
    90deg,
    #ee2b4b,
    #f49d25,
    #eb4799,
    #f49d25,
    #ee2b4b
  );
  --lightBox_headerAd-stats-borderRadius: 1em;
  --lightBox_headerAd-stats-img: 40px;
  --lightBox_headerAd-stats-img-paddingLeft: 0.75rem;
  --lightBox_headerAd-stats-padding: 0.5rem 1rem;
  --lightBox_headerAd-stats-margin: 1rem;
  --lightBox_headerAd-btnRule-border: 1px solid var(--lightBox_headerAd-color3);
  --lightBox_cta-bg: hsla(0, 0%, 8%, 0.95);
  --lightBox_cta-border: 1px solid #33333399;
  --lightBox_cta-badge-borderRadius: 1.125rem;
  --lightBox_cta-badge-borderRadius2: 0.75rem;
  --lightBox_cta-link-color: #fff;
  --lightBox_cta-field-icon-bg: #262626;
  --lightBox_cta-uidTitle-color: #eb428c;
  --lightBox_cta-color: #999;
  --lightBox_cta-color2: #ffbf00;
  --lightBox_cta-color3: #eb428c;
  --lightBox_cta-btnShare-color: #0a0a0a;
  --lightBox_cta-btnSave-border: 0.125rem solid;
  --lightBox_cta-btnSave-color: #ee2b4b;
  --lightBox_cta-ruleItem-padding: var(--lightBox_cta-ruleItem-margin);
  --lightBox_cta-ruleItem-margin: 1rem;

  --login__error-color: #ef4444;
  --login-button-bg: #1abc9d;
  --login-button-borderRadius: var(--button-border-radius);
  --login-hint-color: #c0bfbf;

  --from-bg: var(--bg2);
  --input-bg: var(--bg2);
  --input-color: 0.75rem 1rem;
  --input-border: 1px solid #979797;
  --input-border-radius: var(--borderRadius);
  --input-padding: 0.75rem 1rem;
  --button-bg: #1abc9d;
  --button-color: #fff;
  --button-border: 1px solid;
  --button-border-radius: var(--borderRadius);
  --button-padding: 0.75rem 1rem;

  --lightBox-content-bg: #222;
  --lightBox-close-width: 42px;
  --promptMsg-color: va;
  --promptMsg-bg: rgba(25, 26, 29, 0.98);
  --promptMsg-border: 1px solid #ffffff1a;

  --navigationWeb-bg: #2c2a2a;
  --navigationWeb-route-borderRadius: 1em;
  --navigationWeb-route-title-color: #fff;
  --navigationWeb-route-link-bg: #1d1d1d;
  --navigationWeb-route-border: 1px solid #ff5b7a;
  --navigationWeb-down-borderRadius: 0.5em;
  --navigationWeb-down-color: #444;
  --navigationWeb-link-link: #ff5757;
  --navigationWeb-email-link: #ff3159;
  --navigationWeb-share-borderRadius: 50%;
  --navigationWeb-share-bg: #3c3b3b;
  --navigationWeb-store-height: 50%;

  --shareBanner-bg: linear-gradient(to right, #f33, #ff4da6, #ffbf00);
  --shareBanner-bg2: conic-gradient(
    from 0deg,
    transparent 0deg,
    rgba(255, 255, 255, 0.1) 10deg,
    transparent 20deg
  );
  --shareBanner-color: #fef9c3;
  --shareBanner-color2: #fef08a;
  --shareBanner-color3: #fff;
  --shareBanner-color5: #fbcc1b;
  --shareBanner-hot-color: #ff4459;
  --shareBanner-border: 2px solid #fbcc1b;
  --shareBanner-li-margin: 0.5rem;
  --shareBanner-mark-bg: linear-gradient(135deg, #fbcc1b, #f97716);
  --shareBanner-button-bg: linear-gradient(90deg, #fbcc1b, #f97716);
  --shareBanner-middle-border: 1px solid var(--shareBanner-middle-color);
  --shareBanner-middle-color: #fde047;
  --shareBanner-middle-bg: #00000050;
  --shareBanner-nowBtn-bg: #00000050;

  --withdrawal-bg: #111317;
  --withdrawal-margin: 1.5rem;
  --withdrawal-color: #f2f2f2;
  --withdrawal-color2: #818898;
  --withdrawal-icon-color: #21c45d;
  --withdrawal-icon-color2: #f4a125;
  --withdrawal-formBox-bg: linear-gradient(180deg, #1e2229, #16181d);
  --withdrawal-formBox-border: 1px solid #2b303b;
  --withdrawal-formBox-borderRadius: 1em;
  --withdrawal-labelRow-icon-width: 1rem;
  --withdrawal-input-marginTop: 0.5rem;
  --withdrawal-input-border: 0.0625rem solid #2b303b;
  --withdrawal-input-borderRadius: calc(
    var(--withdrawal-formBox-borderRadius) - 0.25em
  );
  --withdrawal-input-padding: 1em;
  --withdrawal-input-bg: #21242c;
  --withdrawal-labelRow-icon-width: 1rem;
  --withdrawal-submitBtn-bg: linear-gradient(90deg, #1ecf4f, #0da03a);
  --withdrawal-scheduleBtn-bg: linear-gradient(90deg, #e4b200, #f97716);
  --withdrawal-wsWarn-color: #ee2b4b;
  --withdrawal-wsWarn-border: 1px solid var(--withdrawal-wsWarn-color);

  --breadcrumb-link: #1abc9c;

  --pagination-link-bg: #fff;
  --pagination-link-hover: #333;
  --pagination-borderRadius: 5px;
  --pagination-border: 1px solid;
  --pagination-page-border: 2px solid #8242b6;
  --pagination-page-borderRadius: initial;

  --products-layout-width: 750px;
  --products-pagetTitleBg-color: #bcbcbc;
  --product_list-margin: 0.75rem;
  --products_subject-border: 1px solid #5e5c5c;
  --products_host-border: 1px solid #5e5c5c;
  --products_host-margin: -1px;
  --products_host-link: #1abc9c;
  --products_host-bg: rgba(255, 255, 255, 0.06);
  --products_host-bg2: #2c2a2a;
  --products_tags-bg: #403e3e;
  --products_tags-color: #f0f0f0;
  --products_tags-color-hover: #1abc9c;
  --products_news-color: #f0f0f0;
  --products_news-border: 1px solid #5e5c5c;
  --products_news-bg: transparent;
  --products_news-editor-border: 0 5px 5px 5px;
  --products_news-title-bg: #2c2a2a;
  --products_news-title-border: 0.25rem 0.25rem 0 0;
  --products_share-color: #fff;
  --products_copy-before-color: #fff6a9;
  --products_copy-before-textSadow:
    0 0 5px #ffa500, 0 0 15px #ffa500, 0 0 20px #ffa500, 0 0 40px #ffa500,
    0 0 60px #ff0000, 0 0 10px #ff8d00, 0 0 98px #ff0000;
  --products_copy-after-color: #fff;
  --products_copy-after-textSadow:
    0 0 10px #fff, 0 0 20px #fff, 0 0 30px #e60073, 0 0 40px #e60073,
    0 0 50px #e60073, 0 0 60px #e60073, 0 0 70px #e60073;
  --products_prevNext-bg: rgba(255, 255, 255, 0.04);
  --products_prevNext-color: #f0f0f0;
  --products_prevNext-titleH-color: #1abc9c;
  --products_prevNext-border-color: #444;
  --products_messageBoard-titleH-color: #1abc9c;
  --products_messageBoard-color: #f0f0f0;
  --products_messageBoard-button-bg: linear-gradient(
    to right,
    #4760ff,
    #0dccff
  );
  --products_comment-color: #f0f0f0;
  --products_comment-date-color: #ccc;
  --products_comment-reply-color: #1abc9c;
  --products_comment-img-width: 56px;
  --products_comment-img-marginRight: 0.5rem;
  --products_comment-name-color: #1abc9c;

  --banner-videoPlayNews-tagWebTitleBg-bg-height: 63px;
  --banner-videoPlayNews-tagWebTitleBg-bg-width: 30px;
  --banner-videoPlayNews-tagWebTitleBg-bg: #dbdbdb;
  --banner-videoPlayNews-tagWebTitleBg-border-color: #be2a2a;
  --banner-videoPlayNews-header-textShadow: 0 2px 3px rgba(0, 0, 0, 0.6);
  --banner-videoPlayNews-titleHBg-bg: #353535;
  --banner-videoPlayNews-videoBg-reduce: 1rem;
  --banner-videoPlayNews-video--portrait: 50px;

  --girlfriend-video-width: 70px;
  --girlfriend-video-bg: linear-gradient(135deg, #f0429f, #a542d7);
  --girlfriend-lightBox-maxHeight: calc(85dvh - 2rem);
  --girlfriend-lightBox-bg: linear-gradient(
    to bottom,
    rgba(66, 16, 57, 0.73) 0%,
    rgba(15, 12, 9, 0.83) 35%,
    rgba(15, 12, 9, 0.83) 100%
  );
  --girlfriend-lightBox-chat-bg: linear-gradient(
    to right,
    rgba(96, 69, 158, 1) 30%,
    rgba(36, 103, 118, 1) 76%
  );
  --girlfriend-lightBox-chat-bg2: linear-gradient(
    to right,
    rgba(160, 49, 112, 1) 30%,
    rgba(144, 75, 34, 1) 76%
  );
  --girlfriend-lightBox-chat-input-height: 35px;
  --girlfriend-lightBox-chat-form-height: calc(
    var(--girlfriend-lightBox-chat-input-height) + 5px
  );
  --girlfriend-lightBox-chat-input-right: 0.5rem;
  --girlfriend-lightBox-chat-input-border: 2px solid #d651bf;
  --girlfriend-lightBox-chat-input-bg: #231406;
  --girlfriend-lightBox-chat-button-bg: linear-gradient(
    to bottom,
    rgba(93, 169, 238, 1) 0%,
    rgba(102, 106, 229, 1) 100%
  );
  --girlfriend-lightBox-close-width: 30px;

  --editor-a: #1abc9c;
  --editor_bg-bg: rgba(255, 255, 255, 0.06);
  --editor_bg-padding: 1rem;
  --editor_bg-color: #ccc;

  --footer-bg: #2c2a2a;
  --footer-color: #fff;
  --footer-link: #939292;
  --footer-link-hover: #1abc9c;
  --footer-linkLine-color: rgba(255, 255, 255, 0.5);
  --footer-linkLine-border: 1px solid #444;
  --footer-footer-border: 1px solid #444;
  --footer-desc-color: rgba(255, 255, 255, 0.7);

  --label-products_messageBoard-button-bg: linear-gradient(
    -45deg,
    #ee7752,
    #e73c7e,
    #23a6d5,
    #23d5ab
  );

  --appDownload-bg-width: 480px;
  --appDownload-bg-size: auto 90%;
  --appDownload-bg: #000;
  --appDownload-bg-hover: #222;
  --appDownload-margin: 1rem;
  --appDownload-color: #fff;
  --appDownload-color2: #ccc;
  --appDownload-header-icon-width: 2.5rem;
  --appDownload-header-icon-borderRadius: 50%;
  --appDownload-h1-color: linear-gradient(to top, #b8987e 50%, #fffaf5);
  --appDownload-footerBtn-bg: #000;
  --appDownload-footer-borderRadius: 0.25em;
  --appDownload-footer-icon-width: 1.25em;
  --appDownload-footer-li-number: 2;
}

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
body::-webkit-scrollbar-track,
:hover::-webkit-scrollbar-track {
  background-color: rgba(255, 255, 255, 0.1);
}
body::-webkit-scrollbar-thumb,
:hover::-webkit-scrollbar-thumb {
  background-color: rgba(255, 255, 255, 0.6);
}
::-webkit-scrollbar-track {
  background: transparent;
  border-radius: var(--borderRadius);
  transition: var(--transition);
}
::-webkit-scrollbar-thumb {
  border-radius: var(--borderRadius);
  border: 2px solid transparent;
  background-clip: content-box;
  cursor: pointer;
  transition: var(--transition);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}
html {
  font-family:
    "Mirages Custom", "Merriweather", "Open Sans", "PingFang SC",
    "Hiragino Sans GB", "Microsoft Yahei", "WenQuanYi Micro Hei",
    "Segoe UI Emoji", "Segoe UI Symbol", Helvetica, Arial, sans-serif;
  line-height: 1.5;
  font-size: 16px;
  margin: auto;
  overflow-y: scroll;
  color: var(--text-color);
}
body {
  margin: 0;
  position: relative;
  background: var(--bg);
}
body,
a,
h1,
h2,
h3,
h4,
h5 {
  font-size: 0.875rem;
  color: var(--color);
}
article,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary {
  display: block;
}
textarea,
input:focus {
  outline: none;
}
textarea,
input,
button {
  border: 0;
  padding: 0;
}
textarea,
input {
  padding: var(--input-padding);
  background: var(--input-bg);
  color: var(--input-color);
  border-radius: var(--input-border-radius);
  width: 100%;
  border: var(--input-border);
}
button {
  background: transparent;
  color: var(--button-color);
  border-radius: var(--button-border-radius);
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.iconSvgAll {
  display: none;
}
a {
  background-color: transparent;
  -webkit-text-decoration-skip: objects;
  text-decoration: none;
  transition: var(--transition);
  transform: scale(1);
}
a:active,
a:hover {
  outline-width: 0;
}
b,
strong {
  font-weight: bolder;
}
ul,
ol,
li {
  list-style: none;
  padding: 0;
  margin: 0;
}
h1,
h2,
h3,
h4,
h5 {
  margin: 0;
  padding: 0;
  font-size: 1em;
}
p,
figure {
  margin: 0;
}
video,
iframe,
img {
  max-width: 100%;
  height: auto;
  vertical-align: bottom;
}
.site-header,
.content,
.site-footer {
  padding: var(--layout-padding);
}
.video video {
  width: 100%;
}
.slider {
  overflow: hidden;
  position: relative;
  touch-action: pan-y;
  cursor: grab;
}
.slider-track {
  display: flex;
  transition: transform 0.35s ease;
}
.slider .slide {
  min-width: 100%;
}
.lightBox {
  position: fixed;
  inset: 0;
  background: rgb(0 0 0 / 70%);
  z-index: 999;
  height: 100%;
  margin: auto;
  align-items: center;
  justify-content: center;
  display: flex;
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 0.2s ease,
    visibility 0.2s ease;
  padding: 1.5rem;
}
.lightBox > div {
  position: relative;
}
.lightBox.active {
  opacity: 1;
  visibility: visible;
}
.lightBox-close {
  cursor: pointer;
  width: var(--lightBox-close-width);
  display: inline-block;
  margin-bottom: 2em;
  position: absolute;
  top: -50px;
  left: 50%;
  transform: translateX(-50%);
}
.lightBox-content {
  background: var(--lightBox-content-bg);
  border-radius: var(--borderRadius);
  padding: 2rem;
  overflow-y: auto;
  max-height: calc(85dvh - var(--lightBox-close-width));
}
html.no-scroll {
  scrollbar-gutter: stable;
  position: fixed;
}
html.no-scroll::-webkit-scrollbar {
  background: transparent;
}
html.no-scroll body {
  position: fixed;
  left: 0;
  right: 0;
  width: 100%;
}
.site-header {
  font-size: 0.9875rem;
  position: sticky;
  left: 0;
  top: 0;
  background: var(--header-bg);
  z-index: 100;
  transition: var(--transition);
  width: -webkit-fill-available;
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  justify-content: space-between;
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  box-shadow: 0 0.3125rem 0.3125rem -0.3125rem rgba(0, 0, 0, 0.117);
}
/* .site-header.hide {
  transform: translateY(-100%);
} */
.site-header header {
  max-width: 1472px;
  width: 100%;
  margin: auto;
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  justify-content: space-between;
}
.site-header li {
  position: relative;
}
.site-header .mainNav .nav-list a {
  display: flex;
  align-items: center;
  white-space: nowrap;
}
.site-header .mainNav .nav-list a .icon {
  width: 0.8em;
  height: 0.8rem;
}
.site-header .mainNav .nav-list a.arrow::after {
  content: "";
  width: 15px;
  height: 15px;
  background: url(../images/icon-up.png) no-repeat center / 100% auto;
  display: block;
}
.site-header .mainNav .nav-list .btnIn a {
  color: var(--navList-color);
}
.logoBg {
  width: var(--logo-width);
}
.btnIn {
  display: none;
}
.navTop {
  display: flex;
  align-items: center;
  position: relative;
  z-index: 100;
}
.navTop > ul {
  display: flex;
  align-items: center;
  font-size: 0.875rem;
  margin: -0.65rem -0.65rem 0 0;
}
.navTop > ul > li {
  margin: 0.65rem 0.65rem 0 0;
}
.navTop > ul > li > a {
  width: var(--navTop-icon-width);
  height: var(--navTop-icon-width);
  padding: 0.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  background: var(--navTop-btn-bg);
  border-radius: 50%;
}
.navTop > ul > li.userLogin,
.navTop > ul > li.user {
  margin-left: 0.65rem;
}
.navTop .userLogin {
  margin-left: 0.65rem;
}
.navTop .userLogin .btnClick img {
  width: inherit;
}
.navTop .userLogin .btnClick {
  padding: 0;
  overflow: hidden;
  position: relative;
}
.navTop .userLogin .btnIn {
  position: absolute;
  min-width: 160px;
  top: 100%;
  left: inherit;
  transform: inherit;
  right: 0;
  background: var(--navList-btnIn-bg);
  z-index: 1;
  margin-top: 0.25rem;
  box-shadow: 0 0.0625rem 0.3125rem 0.0625rem rgba(0, 0, 0, 0.117);
  border-radius: var(--navTop-btnIn-borderRadius);
  overflow: hidden;
  text-align: center;
}
.navTop .userLogin .btnIn a {
  display: block;
  padding: var(--navList-btnIn-padding);
}
.navTop .userLogin .btnIn .accountBg {
  font-size: 0.9875em;
  padding: var(--navList-btnIn-padding);
}
.navTop .userLogin .btnIn .account {
  color: var(--navTop-userLogin-account-color);
}
.navTop .userLogin .btnIn .accountId {
  color: var(--navTop-userLogin-accountId-color);
}
.navTop .userLogin .btnIn .accountId span:first-child {
  margin-right: 0.25rem;
}
.navTop .userLogin .btnIn .logOut {
  color: var(--navTop-userLogin-logOut-color);
}
.navTop .titleHBg {
  margin-bottom: 0.75rem;
  font-size: 0.9375rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.navTop .clear {
  font-size: 0.85em;
  display: flex;
  align-items: center;
}
.navTop .clear img {
  max-width: 16px;
  margin-right: 0.25rem;
}
.navTop .title {
  color: var(--navTop-color2);
}
.navTop .hostoryIn {
  position: relative;
  margin-bottom: 1rem;
  padding: 1rem 0;
}
.navTop .hostoryIn ul {
  display: flex;
  flex-flow: row wrap;
  margin: -0.5rem -0.5rem 0 0;
  padding-bottom: 1rem;
  width: 100%;
}
.navTop .hostoryIn li {
  margin: 0.5rem 0.5rem 0 0;
}
.navTop .hostoryIn::before,
.navTop .hostoryIn::after {
  content: "";
  position: absolute;
  left: 0;
  background: var(--navTop-color);
  width: 100%;
  height: 1px;
  opacity: 0.5;
}
.navTop .hostoryIn::before {
  top: 0;
}
.navTop .hostoryIn::after {
  bottom: 0;
}
.navTop .hostoryIn .noRecord {
  text-align: center;
  min-height: 3.4rem;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--navTop-noRecord-color);
  font-size: 0.8rem;
}
.navTop .hostoryIn li a {
  background: rgba(50, 118, 255, 0.05);
  border: 0.05rem solid #bababa;
  font-size: 0.8125rem;
  padding: 0 0.9rem;
  border-radius: var(--borderRadius);
  display: block;
  min-width: 4em;
}
.navTop .hot ul {
  counter-reset: prod-counter;
}
.navTop .hot ul li {
  counter-increment: prod-counter;
}
.navTop .hot ul li::before {
  content: counter(prod-counter) " ";
  position: absolute;
  top: 0.1rem;
  left: 0;
  min-width: 1.5em;
  text-align: right;
  font-size: 0.71875rem;
  color: var(--navTop-color);
}
.navTop .hot ul li:nth-child(1)::before,
.navTop .hot ul li:nth-child(2)::before,
.navTop .hot ul li:nth-child(3)::before {
  content: "";
  top: -0.125rem;
  width: 1.875rem;
  height: 1.875rem;
  background-repeat: no-repeat;
  background-size: contain;
}
.navTop .hot ul li:nth-child(1)::before {
  background-image: url(../images/rank-1.png);
}
.navTop .hot ul li:nth-child(2)::before {
  background-image: url(../images/rank-2.png);
}
.navTop .hot ul li:nth-child(3)::before {
  background-image: url(../images/rank-3.png);
}
.navTop .hot ul li a {
  margin-left: 2rem;
  display: block;
  margin-bottom: 1rem;
}
.navTop .hot .title {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  position: relative;
  padding-right: 1rem;
  margin-bottom: 0.5rem;
}
.navTop .hot .hotTag .title::after {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  background: url(../images/hot.png) no-repeat center center/ 100% auto;
  width: 14px;
  height: 14px;
  margin-top: 0.25em;
}
.navTop .hot .view {
  font-size: 0.71875rem;
}
.navTop .search .close::before {
  content: "";
  width: 1.625rem;
  height: 1.625rem;
  background: url(../images/icon-up.png) no-repeat center / 100% auto;
  display: block;
  transform: rotate(90deg);
}
.navTop .search .btnIn {
  width: var(--navTop-search-width);
  right: 0;
  left: inherit;
  transform: inherit;
  top: 0;
  padding: 1rem;
  color: var(--navTop-color);
}
.navTop .search .btnIn .searchBtnBg {
  display: flex;
  align-items: center;
  width: 100%;
}
.navTop .search .scroll {
  overflow-y: auto;
}
.navTop .search .close {
}
.navTop .search .searchBtn {
  border-radius: var(--borderRadius2);
  padding: 0.435rem 0.9rem;
  margin-left: 0.5rem;
  white-space: nowrap;
  color: var(--text-color);
  width: var(--navTop-search-searchBtn-width);
  background: var(--navTop-search-searchBtn-bg);
}
.navTop .search .btnIn .inputBg {
  display: flex;
  align-items: center;
  margin-bottom: 1.5rem;
}
.navTop .search .btnIn .inputBg .btn {
  width: var(--navTop-search-icon-width);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 0.5rem;
}
.navTop .search .btnIn .inputBg input {
  color: var(--navTop-search-input-color);
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
}
.pagetTitleBg {
  background: #343232;
  width: 100%;
  text-align: center;
}
.pagetTitleBg[label-style="2"] {
  background: transparent;
  text-align: center;
}
.pagetTitleBg[label-style="2"] h2 {
  padding-bottom: 0;
}
.pagetTitleBg h1 {
  font-size: 2.5rem;
  font-weight: 300;
}
.pagetTitleBg h2 {
  font-size: 0.9375rem;
  font-weight: 400;
  padding-bottom: 1.25rem;
  width: 100%;
}
.contentBottom {
  background: var(--footer-bg);
}
.content {
  width: 100%;
  max-width: var(--layout-width);
  margin: auto;
}
.breadcrumb ol {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.breadcrumb li {
  display: flex;
  align-items: center;
  font-size: 0.75rem;
}
.breadcrumb li + li::before {
  content: ">";
  margin: 0 0.25rem;
}
.breadcrumb,
.breadcrumb a {
  color: var(--breadcrumb-link);
}
main {
  position: relative;
}
.banner {
  margin-top: 2rem;
}
.banner article {
  position: relative;
  margin-bottom: 1rem;
  padding-bottom: 26.38%;
  margin-bottom: 3rem;
  transition: var(--transition);
  transition: transform 0.2s ease-out;
  border-radius: var(--borderRadius);
  overflow: hidden;
}
.banner .h1Down {
  width: 100%;
}
.banner a:first-child .h1Down {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-items: center;
  margin-top: 0.625em;
}
.banner a:first-child .h1Down .tagWebTitleBg,
.banner a:first-child .h1Down .nameTime {
  display: flex;
  align-items: center;
  flex-flow: row wrap;
}
.banner article a,
.banner article a:before {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.banner article a:first-child a {
  left: 50%;
  transform: translateX(-50%);
  transition: all 0s;
}
.banner a:first-child {
  display: flex;
  align-items: center;
  justify-content: center;
}
.banner article a:first-child :before {
  content: "";
  background: #000;
  opacity: 0.3;
  transition: var(--transition);
}
.banner article.videoPlay a:first-child:before {
  opacity: 0.5;
}
.banner article.brighten a:first-child:before {
  opacity: 0.1;
}
.banner a:first-child header {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  padding: 2rem;
  color: #eee;
  font-size: 0.875rem;
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-items: center;
  text-align: center;
  text-shadow: var(--banner-videoPlayNews-header-textShadow);
  width: 100%;
}
.banner a:first-child h2 {
  font-weight: 400;
  width: 100%;
  font-size: 1.5625rem;
  transition: var(--transition);
}
.banner a:first-child .videoBg .video {
  position: relative;
  display: inline-block;
}
.banner a:first-child .videoBg .video,
.banner a:first-child .videoBg .video video {
  opacity: 1;
  width: auto;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
}
.banner a:first-child header.videoPlay {
  text-shadow:
    var(--banner-videoPlayNews-header-textShadow),
    var(--banner-videoPlayNews-header-textShadow),
    var(--banner-videoPlayNews-header-textShadow);
}
.banner .videoPlayNews__in h2 {
  position: relative;
  left: 0;
  padding-right: 10rem;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 1rem;
  z-index: 1;
  color: yellow;
  font-weight: bold;
}
.banner .videoPlayNews__in header {
  position: absolute;
  left: 0;
  bottom: 0.25rem;
  text-align: left;
  display: flex;
  flex-flow: row wrap;
  align-items: start;
  justify-content: space-between;
  padding: 0.5rem 1rem 0.5rem 1rem;
  width: 100%;
}
.banner .videoPlayNews__in .titleHBg .bg {
  position: absolute;
  left: 0;
  top: 0;
  width: calc(100% - 3rem);
  height: 100%;
  transform-origin: left center;
  animation: rightInUp3 0.5s ease forwards;
  transform: translateX(-100%);
}
@-webkit-keyframes rightInUp3 {
  0% {
    transform: translateX(-100%);
  }
  100% {
    transform: translateX(0);
  }
}
.banner .videoPlayNews__in .titleHBg .bg span::before {
  content: "";
  display: block;
  width: calc(100% - var(--banner-videoPlayNews-tagWebTitleBg-bg-width));
  height: 100%;
  background: var(--banner-videoPlayNews-titleHBg-bg);
}
.banner .videoPlayNews__in .titleHBg .bg::after {
  content: "";
  position: absolute;
  display: block;
  top: 0;
  right: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: var(--banner-videoPlayNews-tagWebTitleBg-bg-height)
    var(--banner-videoPlayNews-tagWebTitleBg-bg-width) 0 0;
  border-color: var(--banner-videoPlayNews-titleHBg-bg) transparent transparent
    transparent;
}
.banner .videoPlayNews__in .videoBg h2,
.banner .videoPlayNews__in .videoBg .h1Down {
  position: absolute;
  z-index: 1;
  bottom: 0;
  width: calc(100% - 2rem);
}
.banner .videoPlayNews__in .h1Down {
  font-size: 0.79rem;
}
.banner .videoPlayNews__in h2,
.banner .videoPlayNews__in .tagWebTitle,
.banner .videoPlayNews__in .nameTime {
  transform-origin: left center;
  animation: rightInUp2 1s ease 0.25s forwards;
  opacity: 0;
  clip-path: inset(0 100% 0 0);
}
.banner .videoPlayNews__in .nameTime {
  display: flex;
  align-items: center;
  animation-duration: 0.5s;
}
@-webkit-keyframes rightInUp2 {
  0% {
    clip-path: inset(0 100% 0 0);
    opacity: 1;
  }
  100% {
    clip-path: inset(0 0 0 0);
    opacity: 1;
  }
}
.banner .videoPlayNews__in time::after,
.banner .videoPlayNews__in .name::after {
  display: none;
}
.banner .videoPlayNews__in .name {
  margin-right: 0.5rem;
}
.banner .videoPlayNews__in .tagWebTitleBg .bg,
.banner .videoPlayNews__in .tagWebTitleBg::before,
.banner .videoPlayNews__in .tagWebTitleBg:after,
.banner .videoPlayNews__in .tagWebTitle::before {
  transform-origin: left center;
  animation: rightInUp 0.5s ease forwards;
}
@-webkit-keyframes rightInUp {
  0% {
    clip-path: inset(0 100% 0 0);
  }
  100% {
    clip-path: inset(0 0 0 0);
  }
}
.banner .videoPlayNews__in .tagWebTitleBg::before,
.banner .videoPlayNews__in .tagWebTitleBg:after {
  display: none;
}
.banner .videoPlayNews__in .tagWebTitleBg {
  position: absolute;
  right: 0;
  top: -2px;
  height: var(--banner-videoPlayNews-tagWebTitleBg-bg-height);
  font-size: 1.5rem;
  font-weight: bold;
  color: var(--banner-videoPlayNews-tagWebTitleBg-border-color);
  text-shadow: inherit;
  display: flex;
  align-items: center;
  padding: 0;
  white-space: nowrap;
}
.banner .videoPlayNews__in .tagWebTitleBg .bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.banner .videoPlayNews__in .tagWebTitleBg .bg::before {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 0 var(--banner-videoPlayNews-tagWebTitleBg-bg-height)
    var(--banner-videoPlayNews-tagWebTitleBg-bg-width);
  border-color: transparent transparent
    var(--banner-videoPlayNews-tagWebTitleBg-bg) transparent;
  left: 1px;
}
.banner .videoPlayNews__in .tagWebTitleBg .bg:after {
  content: "";
  position: absolute;
  left: 1px;
  bottom: 0;
  width: 100%;
  height: 3px;
  background: var(--banner-videoPlayNews-tagWebTitleBg-border-color);
}
.banner .videoPlayNews__in .tagWebTitleBg .bg span {
  display: block;
  background: var(--banner-videoPlayNews-tagWebTitleBg-bg);
  border-radius: 2px 0 0 0;
  height: var(--banner-videoPlayNews-tagWebTitleBg-bg-height);
  margin-left: var(--banner-videoPlayNews-tagWebTitleBg-bg-width);
}
.banner .videoPlayNews__in .tagWebTitle {
  display: flex;
  align-items: center;
  padding: 0 1rem 0
    calc(0.5rem + var(--banner-videoPlayNews-tagWebTitleBg-bg-width));
  z-index: 1;
}
.banner .h1Down > div::after,
.banner time::after,
.banner .name::after {
  content: "•";
  padding: 0 0.25rem;
}
.banner .videoPlayNews__in .h1Down > div:after,
.banner .h1Down .nameTime time:after,
.banner .h1Down > div:last-child:after {
  content: "";
  padding: 0;
}
.banner figure,
.banner figure img {
  width: 100%;
  height: 100%;
}
.banner .videoBg {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  opacity: 0;
  text-align: center;
}
.banner .videoPlay .videoBg {
  opacity: 1;
  width: 100%;
  height: 111%;
}
.banner .videoPlayNews__in {
  display: none;
  transition: none;
}
.banner .videoPlayNews .videoPlayNews__in {
  display: flex;
}
.banner .videoPlayNews__in .videoBg {
  top: 42%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.9);
  width: 100%;
  height: 80%;
  overflow: hidden;
  opacity: 0;
  text-align: center;
  transform-origin: center center;
  animation: rightInUp5 0.2s ease forwards;
}
@-webkit-keyframes rightInUp5 {
  0% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(0.85);
  }
  100% {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }
}
.banner .videoPlayNews .videoPlayNews__in .videoBg {
}
.banner .videoPlayNews__in .video,
.banner .videoPlayNews__in video {
  width: auto;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
}
.banner .videoPlayNews__in .video {
  margin-top: calc(var(--banner-videoPlayNews-videoBg-reduce) * -1);
  position: relative;
  display: inline-block;
}
.banner .videoPlayNews__in .video::before {
  content: "";
  position: absolute;
  left: 0;
  top: 16px;
  width: calc(100% + 2px);
  height: calc(100% - var(--banner-videoPlayNews-videoBg-reduce));
  border: 3px solid var(--banner-videoPlayNews-tagWebTitleBg-bg);
  box-shadow: var(--banner-videoPlayNews-header-textShadow);
}
.video--portrait .videoPlayNews__in video,
.video--portrait .videoPlayNews__in .video {
  min-height: 350px;
  top: calc(var(--banner-videoPlayNews-video--portrait) * -1);
}
.banner .video--portrait .videoPlayNews__in .video::before {
  top: calc(var(--banner-videoPlayNews-video--portrait) + 16px);
}
.banner .videoPlayNews__in .h1Down .tagLink-comma {
  display: none;
}
.banner figure img {
  object-fit: cover;
  object-position: center;
  display: block;
}
.shareBanner {
  display: flex;
  align-items: center;
  background: var(--shareBanner-bg);
  padding-bottom: 0;
  border-radius: var(--borderRadius);
  color: var(--shareBanner-color3);
  font-size: 0.875rem;
  position: relative;
  font-weight: bold;
  cursor: pointer;
  overflow: hidden;
}
.shareBanner::after,
.shareBanner::before {
  content: "";
  position: absolute;
  transform: translate(-50%, -50%);
  width: 200%;
  height: 200%;
  background-size: 200% 200%;
}
.shareBanner::after {
  left: 50%;
  top: 50%;
  background: var(--shareBanner-bg);
  animation: gradient-x 3s ease infinite;
  animation-delay: 0.5s;
  z-index: 1;
}
@keyframes gradient-x {
  0%,
  to {
    background-position: 0% 50%;
  }

  50% {
    background-position: 100% 50%;
  }
}
.shareBanner::before {
  left: -50%;
  top: -50%;
  width: 200%;
  height: 200%;
  background: var(--shareBanner-bg2);
  animation: spin-slow 8s linear infinite;
  z-index: 2;
}
@keyframes spin-slow {
  0% {
    transform: rotate(0);
  }

  to {
    transform: rotate(360deg);
  }
}
.shareBanner article {
  position: relative;
  width: 100%;
  z-index: 10;
  padding: 0.7em 1.25em;
}
.shareBanner ul {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: calc(var(--shareBanner-li-margin) * -1)
    calc(var(--shareBanner-li-margin) * -1) 0 0;
}
.shareBanner ul.in {
  flex-flow: row wrap;
}
.shareBanner ul li {
  margin: var(--shareBanner-li-margin) var(--shareBanner-li-margin) 0 0;
}
.shareBanner .icon {
  width: 30px;
  height: 30px;
}
.shareBanner .left {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
.shareBanner .mark {
  width: 1.65em;
  height: 1.65em;
  border-radius: 0.25em;
  background: var(--shareBanner-mark-bg);
  border: var(--shareBanner-border);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 3em;
  position: relative;
  animation: shareBanner 2s ease-in-out infinite;
}
@keyframes shareBanner {
  0%,
  to {
    transform: translateY(3px);
  }

  50% {
    transform: translateY(-3px);
  }
}
.shareBanner .mark .icon {
  position: absolute;
  opacity: 0.6;
  width: 20px;
  height: 20px;
}
.shareBanner .mark .star {
  right: -15px;
  top: -10px;
  color: var(--shareBanner-color5);
  animation: markAnimation 1s cubic-bezier(0, 0, 0.2, 1) infinite;
}
.shareBanner .mark .lightning {
  left: -15px;
  bottom: -10px;
  animation: markAnimation 1s cubic-bezier(0, 0, 0.2, 1) infinite;
  animation-delay: 0.3s;
  color: var(--shareBanner-color3);
}
@keyframes markAnimation {
  75%,
  to {
    transform: scale(2);
    opacity: 0;
  }
}
.shareBanner .text {
  font-size: 4.5em;
  line-height: 1.1;
  letter-spacing: 0.05em;
  text-align: center;
  text-shadow:
    5px 5px 10px #00000070,
    -5px -5px 10px #00000070,
    0px 0px 3px #00000052;
}
.shareBanner .hot {
  padding: 0.1em 0.5em;
  background: var(--shareBanner-color3);
  color: var(--shareBanner-hot-color);
  border-radius: 0.25em;
  margin-left: 0.25em;
  opacity: 0.6;
  animation: opacity 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}
@keyframes opacity {
  50% {
    opacity: 0.5;
  }
}
.shareBanner .gift {
  text-align: center;
  font-size: 0.9875em;
  color: var(--shareBanner-color);
}
.shareBanner .gift .icon {
  color: var(--shareBanner-color2);
  transition: var(--transition);
  animation: giftJump 1s infinite;
}
@keyframes giftJump {
  0%,
  to {
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
  }

  50% {
    transform: none;
    animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
  }
}
.shareBanner .right button {
  background: var(--shareBanner-button-bg);
  border: var(--shareBanner-border);
  color: var(--shareBanner-color3);
  padding: 1em 2em;
  font-size: 1.25em;
  border-radius: 2em;
  white-space: nowrap;
  font-weight: bold;
  transition: all 0.1s;
  position: relative;
  overflow: hidden;
}
.shareBanner .right button br {
  display: none;
}
.shareBanner .right button::before {
  content: "";
  position: absolute;
  left: -100%;
  top: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    to right,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.3) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  transition: all 0.3s;
}
.shareBanner .right button .icon {
  width: 25px;
  height: 25px;
  margin-left: 0.5em;
}
.shareBanner .middle {
  text-align: center;
  background: var(--shareBanner-middle-bg);
  padding: 0.75em 1.125em;
  border-radius: 0.5em;
  position: relative;
}
.shareBanner .middle::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border-radius: 0.5em;
  border: var(--shareBanner-middle-border);
  opacity: 0.5;
}
.shareBanner .middle .sub {
  font-size: 0.75em;
  opacity: 0.9;
}
.shareBanner .middle .reward {
  font-size: 1.25em;
}
.shareBanner .middle .max {
  color: var(--shareBanner-color2);
  font-size: 0.75em;
}
.shareBanner .middle .num {
  color: var(--shareBanner-middle-color);
  font-size: 2.5em;
  line-height: 1;
  animation: opacity 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}
.shareBanner .middle .desc {
  font-size: 0.75em;
  opacity: 0.7;
  color: var(--shareBanner-color2);
  font-weight: normal;
}
.shareBanner .ticker {
  overflow: hidden;
}
.shareBanner .ticker ul {
  font-size: 0.875em;
  color: var(--shareBanner-color);
  display: flex;
  align-items: center;
}
.shareBanner .ticker ul li {
  margin-right: 1em;
  white-space: nowrap;
}
.shareBanner .ticker ul li::before {
  margin-right: 0.25em;
}
.shareBanner .ticker ul li:nth-child(3n + 1):before {
  content: "🔥";
}
.shareBanner .ticker ul li:nth-child(3n + 2):before {
  content: "💰";
}
.shareBanner .ticker ul li:nth-child(3n + 3):before {
  content: "🎉";
}
.shareBanner .ticker ul li .icon {
  width: 1.25em;
  height: 1.25em;
  margin-right: 0.5em;
}
.shareBanner .nowBtn {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  color: var(--shareBanner-color);
  background: #00000050;
  padding: 0.5em;
  text-align: center;
  font-size: 1.125em;
}
.pagination div {
  margin: 0.5rem 0.5rem 0 0;
}
.paginationBg {
  margin-bottom: 2rem;
}
.pagination form,
.pagination {
  margin: -0.5rem -0.5rem 0 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.pagination form {
  justify-content: center;
}
.pagination .common {
  border: var(--pagination-border);
  border-radius: var(--pagination-borderRadius);
  white-space: nowrap;
  display: flex;
  align-items: center;
  justify-content: center;
}
.pagination .prevBtn,
.pagination .nextBtn,
.pagination button {
  font-size: 0.875rem;
  transition: var(--transition);
}
.pagination .prevBtn,
.pagination .nextBtn {
  width: 22%;
  max-width: 120px;
}
.pagination > div,
.pagination button,
.pagination input {
  line-height: 1.75;
}
.pagination .common.page {
  width: initial;
  border: 2px solid #8242b6;
  border-radius: var(--pagination-page-borderRadius);
}
.pagination .page span {
  opacity: 0.5;
}
.pagination input.common {
  width: 4.5em;
  text-align: center;
}
.pagination .center {
  width: calc(100% - 128px);
  max-width: 300px;
}
[class*="tagLink"] {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
}
[class*="tagLink"] a {
  position: relative;
}
[class*="tagLink"] a span {
  position: relative;
}
[class*="tagLink"] a span::after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  height: 1px;
  transition: var(--transition);
  background: var(--footer-link-hover);
  z-index: 2;
}
[class*="tagLink"] a span::before {
  content: "";
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 0;
  border-bottom: 0.0625rem dashed #bcbcbc;
  opacity: 0.2;
  z-index: 1;
}
.tagLink-comma div {
  position: relative;
  margin-right: 0.5em;
}
.tagLink-comma div::after {
  content: ",";
  position: absolute;
  top: 50%;
  right: -0.35em;
  transform: translateY(-50%);
}
.tagLink-comma div:last-child::after {
  display: none;
}
/*start.navigationWeb*/
.navigationWeb {
  margin: auto;
  padding: 2rem;
  background: var(--navigationWeb-bg);
}
.navigationWeb,
.navigationWeb a {
  font-size: 1rem;
}
.navigationWeb header {
  text-align: center;
  margin: 0.725rem 0 0.25rem 0;
}
.navigationWeb .logo img {
  max-width: 280px;
}
.headerAdBg {
  bottom: -0.875px;
  margin-right: 0.25rem;
}
.site-header .mainNav .nav-list .headerAd {
  color: var(--headerAdBg-color);
  border: var(--headerAdBg-border);
  font-size: 0.875rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  white-space: nowrap;
  padding: 0.35rem 0.875rem;
  background: var(--navTop-btn-bg);
  transition: var(--transition);
  border-radius: var(--headerAdBg-borderRadius);
}
.site-header .mainNav .nav-list .headerAd > div {
  display: flex;
  align-items: center;
}
.headerAd .icon {
  transform: scale(1);
  transition: var(--transition);
}
.headerAdBg .btnIn {
  margin-top: 0.5rem;
  padding: 0.35rem 0;
  border: var(--headerAdBg-border);
  border-radius: var(--headerAdBg-borderRadius);
  background: var(--headerAd-btnIn-bg);
  box-shadow: var(--headerAd-btnIn-boxShadow);
}
.headerAd .btnIn:before {
  content: "";
  position: absolute;
  left: 0;
  width: 100%;
  height: 2px;
  background: var(--headerAd-btnIn-topBeforeBg);
}
.headerAdBg .btnIn li {
  position: relative;
}
.headerAdBg .btnIn li:first-child::before,
.headerAdBg .btnIn::after,
.headerAdBg .btnIn li::before {
  content: "";
  position: absolute;
  height: 1px;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}
.headerAdBg .btnIn::after {
  content: "";
  left: 0;
  top: 0;
  transform: initial;
  width: 100%;
  height: 2px;
  background: var(--headerAdBg-line-bg);
  z-index: 1;
}
.headerAdBg .btnIn li:first-child::before {
  display: none;
}
.headerAdBg .btnIn li a {
  display: flex;
  align-items: center;
  padding: 0.75rem 1rem;
  white-space: nowrap;
  display: block;
}
.headerAdBg .btnIn li a .icon {
  opacity: 0.6;
  transition: var(--transition);
  margin-right: 0.5rem;
}
.site-header .mainNav .nav-list .headerAdBg li .icon {
  width: 16px;
  height: 16px;
  color: var(--headerAdBg-color);
}
.site-header .mainNav .nav-list a.arrow.headerAd::after {
  content: "";
  background-image: url(../images/icon-up2.png);
  margin-left: 0.25rem;
}
.site-header .mainNav .nav-list .headerAd .icon {
  width: 20px;
  height: 20px;
  margin-right: 0.25rem;
}
.lightBox_headerAd .in {
  z-index: 2;
  position: relative;
}
.lightBox_headerAd .lightBox-content {
  text-align: center;
  position: relative;
  border-radius: var(--lightBox_headerAd-borderRadius);
  background: var(--lightBox_headerAd-bg2), var(--lightBox_headerAd-bg);
}
.lightBox_headerAd .badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem 1rem;
  background: var(--lightBox_headerAd-bg3);
  border: var(--lightBox_headerAd-border);
  border-radius: var(--lightBox_headerAd-badge-borderRadius);
  font-size: 0.875rem;
  margin-bottom: 1.5rem;
  color: var(--lightBox_headerAd-color);
}
.lightBox_headerAd .badge .icon {
  width: 13px;
  height: 13px;
  display: inline-block;
  margin-right: 0.5rem;
  color: var(--lightBox_headerAd-color2);
}
.lightBox_headerAd .title {
  font-size: 3rem;
  line-height: 1;
  font-weight: bold;
}
.lightBox_headerAd .gradient {
  background: var(--lightBox_headerAd-gradient-bg);
  -webkit-background-clip: text;
  color: transparent;
}
.lightBox_headerAd p {
  color: var(--lightBox_headerAd-color);
}
.lightBox_headerAd .subtitle {
  margin-top: 1rem;
  font-size: 1.125rem;
}
.lightBox_headerAd .reward-box {
  margin: 1.5rem auto 1.85rem auto;
  max-width: 190px;
  padding: 0.75rem 1.5rem;
  background: var(--lightBox_headerAd-bg3);
  border-radius: var(--lightBox_headerAd-reward-box-borderRadius);
  border: var(--lightBox_headerAd-reward-box-border);
  z-index: 1;
  animation: rewardUpDown 2.8s ease-in-out infinite;
  position: relative;
}
.lightBox_headerAd .reward-box .bottom {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -1.75em;
  font-size: 0.75rem;
  white-space: nowrap;
}
.lightBox_headerAd .btnRow {
  display: flex;
  align-items: center;
  justify-content: center;
}
.lightBox_headerAd .btnRule {
  border: var(--lightBox_headerAd-btnRule-border);
  border-radius: 0.625rem;
  padding: 0.5rem 1.25rem;
  color: var(--lightBox_headerAd-color3);
  font-size: 0.875rem;
  font-weight: bold;
  cursor: pointer;
  width: inherit;
  font-weight: bold;
}
.lightBox_headerAd .btnRule .icon {
  width: 20px;
  height: 20px;
  margin-right: 0.5rem;
  color: var(--lightBox_headerAd-color3);
}

@keyframes rewardUpDown {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-10px);
  }
  100% {
    transform: translateY(0);
  }
}
.lightBox_headerAd .reward-box .label {
  color: var(--lightBox_headerAd-color);
}
.lightBox_headerAd .reward-box .reward {
  font-size: 2rem;
  color: var(--lightBox_headerAd-color2);
  font-weight: bold;
}
.lightBox_headerAd .reward-box .desc {
  color: var(--lightBox_headerAd-color3);
  white-space: nowrap;
}
.lightBox_headerAd .cta {
  padding: 1.25rem 2rem;
  border-radius: 0.5em;
  color: white;
  font-size: 1.25rem;
  font-weight: 600;
  max-width: 260px;
  margin: auto;
  box-shadow: var(--lightBox_headerAd-reward-box-box-shadow);
  background: var(--lightBox_headerAd-cta-bg);
  background-size: 200% auto;
  transition: var(--transition);
  white-space: nowrap;
}
.active .lightBox_headerAd .cta {
  animation: ctaGradientMove 1s linear 3;
}
@keyframes ctaGradientMove {
  0% {
    background-position: 0% 0;
  }
  100% {
    background-position: 100% 0;
  }
}
.lightBox_headerAd .cta div {
  display: flex;
  align-items: center;
  margin: -0.5rem -0.5rem 0 0;
}
.lightBox_headerAd .cta svg,
.lightBox_headerAd .cta span {
  margin: 0.5rem 0.5rem 0 0;
}
.lightBox_headerAd .cta svg {
  width: 30px;
  height: 30px;
}
.lightBox_headerAd .uid-tip {
  margin-top: 0.875rem;
  font-size: 0.75rem;
  margin-bottom: 1.5rem;
}
.lightBox_headerAd .stats {
  display: flex;
  margin: calc(var(--lightBox_headerAd-stats-margin) * -1)
    calc(var(--lightBox_headerAd-stats-margin) * -1) 1.5rem 0;
}
.lightBox_headerAd .stats .item {
  width: 100%;
  background: var(--lightBox_headerAd-bg3);
  padding: var(--lightBox_headerAd-stats-padding);
  margin: var(--lightBox_headerAd-stats-margin)
    var(--lightBox_headerAd-stats-margin) 0 0;
  border-radius: var(--lightBox_headerAd-stats-borderRadius);
  border: var(--lightBox_headerAd-border);
  text-align: left;
}
.lightBox_headerAd .stats .itemIn {
  position: relative;
  padding-left: calc(
    var(--lightBox_headerAd-stats-img) +
      var(--lightBox_headerAd-stats-img-paddingLeft)
  );
}
.lightBox_headerAd .stats .itemIn .iconBg .icon,
.lightBox_headerAd .stats .itemIn .iconBg::after {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  display: inline-block;
  width: var(--lightBox_headerAd-stats-img);
  height: var(--lightBox_headerAd-stats-img);
  border-radius: 50%;
  display: block;
}
.lightBox_headerAd .stats .itemIn .iconBg .icon {
  height: calc(var(--lightBox_headerAd-stats-img) / 2);
  border-radius: calc(var(--lightBox_headerAd-stats-img) / 2);
  z-index: 1;
}
.lightBox_headerAd .stats .itemIn .iconBg::after {
  opacity: 0.2;
}
.lightBox_headerAd .stats .item .num {
  font-size: 1.5rem;
  font-weight: bold;
  white-space: nowrap;
}
.lightBox_headerAd .stats .item .text {
  font-size: 0.75rem;
  white-space: nowrap;
  color: var(--lightBox_headerAd-color);
}
.lightBox_headerAd .stats .user .itemIn .iconBg:after {
  background: var(--lightBox_headerAd-color3);
}
.lightBox_headerAd .stats .money .itemIn .iconBg:after {
  background: var(--lightBox_headerAd-color2);
}
.lightBox_headerAd .stats .user .itemIn .icon {
  color: var(--lightBox_headerAd-color3);
}
.lightBox_headerAd .stats .money .itemIn .icon,
.lightBox_headerAd .stats .money .itemIn .num {
  color: var(--lightBox_headerAd-color2);
}
.lightBox_headerAd .lightBox-content,
.lightBox_cta .lightBox-content {
  border-radius: var(--lightBox_cta-badge-borderRadius);
  border: var(--lightBox_cta-border);
}
.lightBox_cta .basicWidthHeight {
  min-width: 350px;
  min-height: 320px;
}
.lightBox_cta .lightBox-content {
  background: var(--lightBox_cta-bg);
  padding: 1.75rem 1.375rem 1.875rem;
  position: relative;
  color: var(--lightBox_cta-color);
  text-align: center;
  max-width: 450px;
}
.lightBox_cta .modalClose {
  position: absolute;
  right: 0.875rem;
  top: 0.875rem;
  background: none;
  border: none;
  font-size: 1.25rem;
  cursor: pointer;
}
.lightBox_cta .iconWrap {
  position: relative;
  margin: 0 auto 0.625rem;
}
.lightBox_cta .iconCheck {
  border-radius: 50%;
  width: 4.25rem;
  height: 4.25rem;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgb(238 43 75 / 20%);
  animation: ctaCheck 2s ease-in-out infinite;
}
.lightBox-bottom {
  margin-top: 0.5rem;
}
.checkCircle {
  position: absolute;
  bottom: -25px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: #fff;
  font-size: 0.875rem;
  font-weight: bold;
}
.checkCircle input {
  display: none;
}
.checkCircle .circle {
  width: 1.25rem;
  height: 1.25rem;
  border: 2px solid;
  border-radius: 50%;
  margin-right: 0.5rem;
  position: relative;
  box-sizing: border-box;
  transition: var(--transition);
}
.checkCircle .circle svg {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 180%;
  height: 180%;
  margin-left: 0.25em;
  margin-top: -0.125em;
  opacity: 0;
}
.checkCircle input:checked + .circle svg {
  opacity: 1;
  color: #1abc9d;
}
@keyframes ctaCheck {
  0%,
  to {
    box-shadow:
      0 0 20px rgba(238, 43, 75, 0.4),
      0 0 40px rgba(238, 43, 75, 0.2);
  }

  50% {
    box-shadow:
      0 0 30px rgba(238, 43, 75, 0.6),
      0 0 60px rgba(238, 43, 75, 0.4),
      0 0 80px rgba(238, 43, 75, 0.2);
  }
}
.lightBox_cta .iconCheck .icon {
  width: 50%;
  height: 50%;
  color: var(--lightBox_cta-btnSave-color);
}
.lightBox_cta .uidTitle {
  text-align: center;
  font-size: 1.625rem;
  font-weight: 700;
  margin-bottom: var(--lightBox_cta-ruleItem-margin);
  color: var(--lightBox_cta-uidTitle-color);
}
.lightBox_cta .uidSub {
  text-align: center;
  font-size: 0.9375rem;
  margin-bottom: var(--lightBox_cta-ruleItem-margin);
}
.lightBox_cta .field {
  background: var(--lightBox_cta-field-icon-bg);
  margin-bottom: 1.125rem;
  padding: var(--lightBox_cta-ruleItem-padding);
  border-radius: var(--lightBox_cta-badge-borderRadius2);
}
.lightBox_cta .field label {
  display: block;
  margin-bottom: 0.375rem;
  font-size: 0.75rem;
}
.lightBox_cta .inputBox {
  border-radius: 0.625rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.lightBox_cta .uidText {
  padding-left: 40px;
  color: var(--lightBox_cta-color2);
  font-weight: bold;
  font-size: 0.9375rem;
}
.lightBox_cta .uidText,
.lightBox_cta .uidLink {
  word-break: break-all;
  text-align: center;
  width: calc(100% - 40px - 0.5rem);
  margin-right: 0.5rem;
}
.lightBox_cta .uidLink {
  color: var(--lightBox_cta-link-color);
  font-size: 0.75rem;
}
.lightBox_cta .btnIcon {
  background: none;
  border: none;
  font-size: 1.125rem;
  color: var(--lightBox_cta-link-color);
  cursor: pointer;
  width: 40px;
  height: 40px;
  background: #141414cc;
  border-radius: var(--lightBox_cta-badge-borderRadius2);
}
.lightBox_cta .btnIcon .icon {
  width: 50%;
  height: 50%;
  color: var(--lightBox_cta-link-color);
}
.lightBox_cta .btnIcon .icon.after {
  color: var(--lightBox_cta-btnSave-color);
}
.lightBox_cta .warning {
  font-size: 0.875em;
  color: var(--lightBox_cta-btnSave-color);
  margin: 0.325rem 0;
}
.lightBox_cta .btnRow {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  justify-content: center;
  margin: -0.625rem -0.625rem 0 0;
}
.lightBox_cta .btnRow > * {
  margin: 0.625rem 0.625rem 0 0;
}
.lightBox_cta button {
  transition: var(--transition);
  width: calc(100% / 2 - 0.625rem);
}
.lightBox_cta .btnSave {
  border: var(--lightBox_cta-btnSave-border);
  border-radius: 0.625rem;
  padding: 0.75rem;
  color: var(--lightBox_cta-btnSave-color);
  font-size: 0.9375rem;
  font-weight: bold;
  cursor: pointer;
}
.lightBox_cta .btnShare {
  border-radius: 0.625rem;
  padding: 0.75rem;
  background: var(--lightBox_cta-color2);
  color: var(--lightBox_cta-btnShare-color);
  font-size: 0.9375rem;
  font-weight: 700;
  cursor: pointer;
  box-shadow:
    0 0 20px #ffbf0080,
    0 0 40px #ffbf004d;
}
.lightBox_cta .btnRow .icon {
  width: 20px;
  height: 20px;
  margin-right: 0.5rem;
}
.lightBox_cta .ruleItem {
  display: flex;
  font-size: 1rem;
  flex-flow: row wrap;
  align-items: center;
  justify-content: space-between;
  background: var(--lightBox_cta-btnShare-color);
  border-radius: var(--lightBox_cta-badge-borderRadius2);
  border: var(--lightBox_cta-border);
  padding: var(--lightBox_cta-ruleItem-padding);
  margin-bottom: var(--lightBox_cta-ruleItem-margin);
}
.lightBox_cta .ruleItem.color1 {
  color: var(--lightBox_cta-color2);
}
.lightBox_cta .ruleItem.color2 {
  color: var(--lightBox_cta-btnSave-color);
}
.lightBox_cta .ruleItem.color3 {
  color: var(--lightBox_cta-color3);
}
.lightBox_cta .ruleItem .sideNote,
.lightBox_cta .ruleItem .label {
  color: var(--lightBox_cta-color);
  font-size: 0.875em;
}
.lightBox_cta .warnTitle {
  color: var(--lightBox_cta-link-color);
  font-weight: bold;
  font-size: 1.2em;
  margin-bottom: 0.25em;
}
.lightBox_cta .ruleItem .flex {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  text-align: left;
  z-index: 2;
  position: relative;
}
.lightBox_cta .ruleItem .icon {
  width: 35px;
  height: 35px;
  margin-right: var(--lightBox_cta-ruleItem-margin);
}
.lightBox_cta .ruleWarn {
  padding: var(--lightBox_cta-ruleItem-padding);
  align-items: start;
  position: relative;
  border: 0;
}
.lightBox_cta .ruleWarn::before,
.lightBox_cta .ruleWarn::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border-radius: 0.75rem;
  z-index: 1;
}
.lightBox_cta .ruleWarn::before {
  background: var(--lightBox_cta-btnSave-color);
  opacity: 0.1;
}
.lightBox_cta .ruleWarn::after {
  border: 1px solid var(--lightBox_cta-btnSave-color);
  opacity: 0.3;
}
.lightBox_cta .ruleWarn .flex {
  width: calc(100% - 25px - 1rem);
}
.lightBox_cta .ruleWarn .icon {
  width: 25px;
  height: 25px;
  color: var(--lightBox_cta-btnSave-color);
}
.lightBox_cta .textArea .value {
  font-size: 1.2em;
  font-weight: bold;
}
.lightBox-withdrawalSubmit {
  font-size: 1em;
  text-align: center;
  color: var(--withdrawal-color2);
}
.lightBox-withdrawalSubmit .lightBox-content {
  background: var(--withdrawal-formBox-bg);
  border: var(--withdrawal-formBox-border);
  border-radius: var(--withdrawal-formBox-borderRadius);
}
.lightBox-withdrawalSubmit .wsClose {
  position: absolute;
  right: 1rem;
  top: 1rem;
  background: none;
  border: none;
  font-size: 1.25em;
  cursor: pointer;
}
.lightBox-withdrawalSubmit .wsIconWrap {
  display: flex;
  justify-content: center;
  margin-bottom: 1rem;
}
.lightBox-withdrawalSubmit .wsIconCircle {
  width: 3.85rem;
  height: 3.85rem;
  background: rgba(0, 255, 120, 0.12);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.lightBox-withdrawalSubmit .wsIconCircle .icon {
  width: 60%;
  height: 60%;
  color: hsl(142 71% 45%);
}
.lightBox-withdrawalSubmit .wsIcon {
  width: 2rem;
  height: 2rem;
  color: #32d66a;
}
.lightBox-withdrawalSubmit .wsTitle {
  font-size: 1.375em;
  margin-bottom: 1rem;
  color: var(--withdrawal-color);
}
.lightBox-withdrawalSubmit .wsSub {
  color: var(--withdrawal-color);
  font-size: 1.125em;
  margin-bottom: var(--withdrawal-input-marginTop);
}
.lightBox-withdrawalSubmit .status .icon,
.lightBox-withdrawalSubmit .status .highlight {
  color: var(--withdrawal-icon-color);
}
.lightBox-withdrawalSubmit .queue .icon,
.lightBox-withdrawalSubmit .queue .highlight,
.lightBox-withdrawalSubmit .wsSub .highlight {
  color: var(--withdrawal-icon-color2);
}
.lightBox-withdrawalSubmit .wsProgressRow .highlight {
  min-width: 5em;
  text-align: left;
  max-width: calc(100% - 100px);
}
.lightBox-withdrawalSubmit .wsProgressBox {
  background: var(--withdrawal-formBox-bg);
  border: var(--withdrawal-formBox-border);
  border-radius: var(--withdrawal-input-borderRadius);
  padding: var(--withdrawal-input-padding);
  margin-bottom: 1.25rem;
}
.lightBox-withdrawalSubmit .wsProgressBox .icon {
  width: 20px;
  height: 20px;
  margin-right: 0.5rem;
}
.lightBox-withdrawalSubmit .wsBoxTitle {
  display: flex;
  align-items: center;
  font-size: 0.9375em;
  font-weight: bold;
  color: var(--withdrawal-color);
}
.lightBox-withdrawalSubmit .wsBoxTitle .icon {
  color: var(--withdrawal-icon-color);
}
.lightBox-withdrawalSubmit .wsProgressRow {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  margin: calc(var(--withdrawal-input-marginTop) * -1)
    calc(var(--withdrawal-input-marginTop) * -1) 0 0;
}
.lightBox-withdrawalSubmit .wsProgressRow p {
  display: flex;
  margin: var(--withdrawal-input-marginTop) var(--withdrawal-input-marginTop) 0
    0;
}
.lightBox-withdrawalSubmit .loadingBarBg {
  width: 100%;
  height: 8px;
  background: #2b303b;
  border-radius: 1em;
  margin: var(--withdrawal-margin) 0;
}
.lightBox-withdrawalSubmit .loadingBar {
  width: 0%;
  height: 100%;
  background: var(--withdrawal-icon-color);
  border-radius: 0.5rem;
  transition: var(--transition);
}
.active .lightBox-withdrawalSubmit .loadingBar {
  animation: loading 1s ease forwards;
}
@keyframes loading {
  0% {
    width: 0%;
  }
  100% {
    width: var(--loadingBar-width);
  }
}
.lightBox-withdrawalSubmit .wsWarn {
  color: var(--withdrawal-wsWarn-color);
  padding: var(--withdrawal-input-padding);
  font-size: 0.875em;
  position: relative;
  margin-bottom: var(--withdrawal-margin);
  opacity: 0.85;
}
.lightBox-withdrawalSubmit .wsWarn::before,
.lightBox-withdrawalSubmit .wsWarn::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border-radius: var(--withdrawal-input-borderRadius);
}
.lightBox-withdrawalSubmit .wsWarn::before {
  background: var(--withdrawal-wsWarn-color);
  opacity: 0.1;
}
.lightBox-withdrawalSubmit .wsWarn::after {
  border: var(--withdrawal-wsWarn-border);
  opacity: 0.3;
}
.lightBox-withdrawalSubmit .wsBtnClose {
  width: 100%;
  padding: var(--withdrawal-input-padding);
  background: var(--withdrawal-bg);
  border: var(--withdrawal-formBox-border);
  border-radius: var(--withdrawal-input-borderRadius);
  color: var(--withdrawal-color);
  cursor: pointer;
  font-weight: bold;
  transition: var(--transition);
}
.lightBox-withdrawalSubmit .wsBtnClose.lightBox-close {
  position: initial;
  transform: inherit;
  margin: 0;
}
.promptMsg {
  position: fixed;
  top: -70px;
  left: 50%;
  transform: translateX(-50%);
  opacity: 0;
  transition:
    top 0.4s ease,
    opacity 0.4s ease;
  color: var(--promptMsg-color);
  font-size: 0.9375rem;
  background: var(--promptMsg-bg);
  padding: 0.75rem 1rem;
  max-width: 300px;
  width: calc(100% - 3rem);
  border: var(--promptMsg-border);
  border-radius: 0.5em;
  z-index: 999;
}
.promptMsg.show {
  top: 2rem;
  opacity: 1;
}
.promptMsg .msgTitle {
  display: flex;
  align-items: center;
  font-weight: bold;
}
.promptMsg .icon {
  width: 20px;
  height: 20px;
  margin-right: 0.5rem;
}
.promptMsg .msgDesc {
  font-size: 0.875em;
  opacity: 0.8;
}
.promptMsg.warn {
  --promptMsg-bg: #2b1d1d;
  --promptMsg-color: #ffb3b3;
  --promptMsg-border: 1px solid #6d2c2c;
}
.promptMsg.warn .icon {
  fill: #ff6b6b;
}
.navigationWeb .route a {
  background: var(--navigationWeb-route-link-bg);
  border: var(--navigationWeb-route-border);
  border-radius: var(--navigationWeb-route-borderRadius);
  display: block;
  text-align: center;
  padding: 0.585rem;
  margin-bottom: 0.675rem;
}
.navigationWeb .route .title {
  color: var(--navigationWeb-route-title-color);
  width: 100%;
}
.navigationWeb .route .link {
  color: var(--navigationWeb-link-link);
  font-size: 0.875rem;
  width: 100%;
}
.navigationWeb .down {
  display: flex;
  align-items: center;
  padding: 0.5rem 0 0.625rem 0;
  margin-top: -0.15rem;
}
.navigationWeb .down a {
  background: var(--navigationWeb-down-color);
  text-align: center;
  width: 100%;
  padding: 1.1rem 0.5rem;
  border-radius: var(--navigationWeb-down-borderRadius);
}
.navigationWeb .down a:first-child {
  margin-right: 0.625rem;
}
.navigationWeb .email {
  background: url(../images/navigationWeb-bg.png) no-repeat center center / 100%
    100%;
  text-align: center;
  padding: 1.05rem 1rem;
  font-size: 0.95rem;
}
.navigationWeb .email a {
  color: var(--navigationWeb-email-link);
  text-decoration: underline;
  font-weight: bold;
}
.navigationWeb .share {
  display: flex;
  align-items: center;
  justify-content: space-around;
  margin: 1rem 0 3.5rem;
}
.navigationWeb .share a {
  font-size: 0.75rem;
  text-align: center;
}
.navigationWeb .share img {
  width: 42px;
  display: block;
  margin: auto;
  margin-bottom: 0.5rem;
  background: var(--navigationWeb-share-bg);
  border-radius: var(--navigationWeb-share-borderRadius);
}
.navigationWeb .copyright a {
  color: var(--footer-color);
  text-decoration: underline;
}
.navigationWeb .entrance {
  text-align: center;
  display: block;
  max-width: 200px;
  margin: 0 auto 0.35rem auto;
}
.navigationWeb .entrance .title {
  position: relative;
  padding-bottom: 0.5rem;
  margin-bottom: 0.25rem;
}
.navigationWeb .entrance .title::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(
    to right,
    rgba(114, 100, 111, 0) 0%,
    rgba(114, 100, 111, 0) 1%,
    rgba(114, 100, 111, 1) 24%,
    rgba(114, 100, 111, 1) 49%,
    rgba(114, 100, 111, 1) 69%,
    rgba(114, 100, 111, 0) 100%
  );
}
.navigationWeb .entrance .text {
  font-weight: bold;
  font-size: 0.7rem;
}
.navigationWeb .store {
  text-align: center;
  margin: 0 auto 1rem auto;
}
/*end.navigationWeb*/
/*start.products*/
.products .site-footer,
.products .content {
  max-width: var(--products-layout-width);
}
.products section {
  margin-bottom: 1rem;
}
.products .pagetTitleBg {
  background: transparent;
  margin: auto;
  text-align: left;
  color: var(--products-pagetTitleBg-color);
}
.products .pagetTitleBg h1 {
  font-size: 2.25rem;
}
.withdrawal .pagetTitleBg .banner,
.products .pagetTitleBg .banner {
  margin-top: 0;
}
.products_banner {
  padding-bottom: 0.25rem;
}
.products_banner article {
  margin-bottom: var(--product_list-margin);
}
[pl-columns="4"] {
  --pl-columns: 4;
}
.product_card_bg {
  display: flex;
  flex-flow: row wrap;
  margin: calc(var(--product_list-margin) * -1)
    calc(var(--product_list-margin) * -1) 0 0;
}
.product_card_bg article {
  width: calc(100% / var(--pl-columns) - var(--product_list-margin));
  margin: var(--product_list-margin) var(--product_list-margin) 0 0;
}
.products_subject a {
  display: block;
  border: 1px solid #5e5c5c;
  color: #bcbcbc;
  text-align: center;
  border-radius: 0.5em;
  padding: var(--product_list-margin);
  font-size: 0.9875rem;
}
.products_host {
  margin-bottom: 1.25rem;
}
.products_host .product_card_bg {
  margin: var(--products_host-margin) var(--products_host-margin) 0 0;
}
.products_host .product_card_bg article {
  width: calc(100% / var(--pl-columns) - var(--products_host-margin));
  margin: var(--products_host-margin) var(--products_host-margin) 0 0;
}
.products_host a {
  display: block;
  color: var(--products_host-link);
  text-align: center;
  padding: var(--product_list-margin);
  font-size: 0.9875rem;
}
.products_host article {
  display: flex;
  align-items: center;
  justify-content: center;
  border: var(--products_host-border);
}
.products_host .product_card_bg {
  background: var(--products_host-bg);
  align-items: normal;
}
.products_host article:nth-child(8n-3),
.products_host article:nth-child(8n-2),
.products_host article:nth-child(8n-1),
.products_host article:nth-child(8n) {
  background: var(--products_host-bg2);
}
.products_tags .product_card_bg a span {
  padding: 0.5rem 1rem;
  border-radius: var(--borderRadius2);
  background: var(--products_tags-bg);
  color: var(--products_tags-color);
  display: block;
  font-size: 0.75rem;
}
.products_tags .product_card_bg a span::before {
  display: none;
}
.products_news {
  color: var(--products_news-color);
}
.products_news .editor_bg,
.products_news .titleH {
  border: var(--products_news-border);
}
.products_news .titleH {
  background: var(--products_news-title-bg);
  border-bottom: 0;
  position: relative;
  z-index: 1;
  padding: 0.5rem 1rem;
  border-radius: var(--products_news-title-border);
}
.products_news .editor_bg {
  margin-top: -1px;
  background: transparent;
  border-radius: var(--products_news-editor-border);
  color: var(--products_news-color);
}
.products_share svg {
  width: 32px;
  height: 32px;
  color: var(--products_share-color);
  border-radius: 0.25rem;
  overflow: hidden;
  fill: currentColor;
}
.products_share svg.icon_add {
  background: rgb(1, 102, 255);
}
.products_share svg.icon_fb {
  background: rgb(8, 102, 255);
}
.products_share svg.icon_tg {
  background: rgb(44, 165, 224);
}
.products_share svg.icon_wechat {
  background: rgb(123, 179, 46);
}
.products_share svg.icon_x {
  background: rgb(26, 26, 26);
}
.products_share svg.icon_qzone {
  background: rgb(43, 130, 217);
}
.products_share svg.icon_sina {
  background: rgb(230, 22, 45);
}
.products_share svg.icon_sms {
  background: rgb(108, 190, 69);
}
.products_copy {
  padding: 1rem 0;
  min-height: 6.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.products_copy .before {
  cursor: pointer;
  font-weight: bold;
  font-size: calc(10px + 4vh);
  text-shadow: var(--products_copy-before-textSadow);
  color: var(--products_copy-before-color);
}
.products_copy .after {
  font-size: 2.3rem;
  text-shadow: var(--products_copy-after-textSadow);
  color: var(--products_copy-after-color);
  display: none;
}
.products_prevNext {
  background: var(--products_prevNext-bg);
  color: var(--products_prevNext-color);
}
.products_prevNext .titleH {
  color: var(--products_prevNext-titleH-color);
  font-size: 1.0625rem;
}
.products_prevNext a {
  padding: 1.75rem;
  display: block;
  font-size: 1rem;
}
.products_prevNext span {
  position: relative;
}
.products_prevNext h3 {
  font-weight: normal;
}
.products_messageBoard .titleHBg {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  justify-content: space-between;
  margin: 0.75rem 0;
}
.products_messageBoard .titleH {
  color: var(--products_messageBoard-titleH-color);
}
.products_messageBoard form {
  color: var(--products_messageBoard-color);
}
.products_messageBoard form textarea {
  min-height: 5em;
}
.products_messageBoard form input {
  font-size: 0.875em;
  padding: 0.38rem 1rem;
  max-width: 265px;
  margin-top: 0.125rem;
}
.products_messageBoard form .submit {
  background: var(--products_messageBoard-button-bg);
  padding: 0.7rem 1rem;
  margin-top: 0.5rem;
}
.products_comment {
  color: var(--products_comment-color);
}
.products_comment .titleHNumber {
  font-size: 1.25rem;
  margin: 3rem 0 1.5rem;
}
.products_comment .cardBg,
.products_comment .card {
  display: flex;
  flex-flow: row wrap;
}
.products_comment .cardBg {
  width: 100%;
}
.products_comment .cardBgIn {
  margin-left: calc(
    var(--products_comment-img-width) + var(--products_comment-img-marginRight)
  );
  border-left: 0.125rem solid #5e5d5d;
  padding: 1rem 0.25rem 1rem 0.5rem;
  width: 100%;
  margin-top: 0.5rem;
}
.products_comment .card {
  width: calc(
    100% - var(--products_comment-img-width) -
      var(--products_comment-img-marginRight)
  );
  justify-content: space-between;
}
.products_comment .card p {
  width: 100%;
}
.products_comment .name {
  color: var(--products_comment-name-color);
}
.products_comment .img {
  width: var(--products_comment-img-width);
  height: var(--products_comment-img-width);
  overflow: hidden;
  border-radius: 50%;
  margin-right: var(--products_comment-img-marginRight);
}
.products_comment .date {
  color: var(--products_comment-date-color);
  font-size: 0.75rem;
}
.products_comment .reply {
  width: initial;
  color: var(--products_comment-reply-color);
}
.products_comment article form {
  width: 100%;
  margin-left: calc(
    var(--products_comment-img-width) / 2 * -1 +
      var(--products_comment-img-marginRight)
  );
}
/*end.products*/
[class*="editor"],
[class*="editor"] a {
  font-size: 0.9875rem;
}
[class*="editor"] a {
  color: var(--editor-a);
}
.editor_bg {
  background: var(--editor_bg-bg);
  padding: var(--editor_bg-padding);
  color: var(--editor_bg-color);
  margin-bottom: 1rem;
  width: 100%;
}
.editor_bg p:last-child {
  margin-bottom: 0;
}
[class*="editor"] ul {
  width: 100%;
}
[class*="editor"] ul li,
[class*="editor"] ol li {
  margin-left: 1.5em;
}
[class*="editor"] ul li {
  list-style: auto;
}
[class*="editor"] ol li {
  list-style: disc;
}
.products_host h2,
[class*="editor"] h2 {
  font-size: 1.55rem;
}

[class*="editor"] h3 {
  font-size: 1.125rem;
  font-weight: 500;
}

[class*="editor"] h1 {
  font-size: 1.75rem;
}
.products_host h2,
[class*="editor"] h1,
[class*="editor"] h2,
[class*="editor"] h3,
[class*="editor"] p,
[class*="editor"] .imgFull,
[class*="editor"] .imgFull img {
  margin-bottom: 1em;
  width: 100%;
}
[class*="editor"] .center {
  text-align: center;
  margin: auto;
}
[class*="editor"] hr {
  width: 100%;
  background: #2c2a2a
    repeating-linear-gradient(
      -45deg,
      #bcbcbc,
      #bcbcbc 0.25rem,
      transparent 0.25rem,
      transparent 0.5rem
    );
  margin: 1rem 0;
  padding: 0;
  height: 0.125rem;
  border: none;
}
.line {
  background: var(--line-bg);
  height: 1px;
  margin: 1rem 0;
}
.readArticle {
  margin-bottom: 2rem;
}
.readArticle .readArticleText {
  overflow: hidden;
  max-height: 6em;
  position: relative;
}
.readArticle .readArticleText::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 6rem;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0), var(--bg));
  pointer-events: none;
}
.readArticle .readArticleBtn{
  border: 1px solid #5e5c5c; 
  padding: .5rem;
}
.readArticle.open .readArticleText{
  max-height: inherit;
}
.readArticle.open .readArticleText::after,
.readArticle.open .readArticleBtn {
  display: none;
}
.withdrawal {
  background: var(--withdrawal-bg);
}
.withdrawal .footerBg,
.withdrawal .site-header {
  background: rgb(24 29 37 / 70%);
}
.withdrawal .formBox {
  max-width: 28rem;
  margin: 0 auto;
  background: var(--withdrawal-formBox-bg);
  padding: 2rem 1.5rem;
  border-radius: var(--withdrawal-formBox-borderRadius);
  border: var(--withdrawal-formBox-border);
}
.withdrawal .formItem {
  margin-bottom: var(--withdrawal-margin);
  text-align: left;
}
.withdrawal .labelRow {
  display: flex;
  align-items: center;
  margin: -0.5rem -0.5rem 0 0;
}
.withdrawal .labelRow > * {
  margin: 0.5rem 0.5rem 0 0;
}
.withdrawal .labelRow .icon {
  width: var(--withdrawal-labelRow-icon-width);
  height: var(--withdrawal-labelRow-icon-width);
  color: var(--withdrawal-icon-color);
}
.withdrawal .labelRow label {
  font-size: 1.125em;
  color: var(--withdrawal-color);
  font-weight: bold;
  width: calc(100% - var(--withdrawal-labelRow-icon-width) - 0.5rem);
}
.withdrawal .formItem input {
  padding: var(--withdrawal-input-padding);
  margin-top: var(--withdrawal-input-marginTop);
  border-radius: var(--withdrawal-input-borderRadius);
  border: var(--withdrawal-input-border);
  background: var(--withdrawal-input-bg);
  color: var(--withdrawal-color);
}
.withdrawal .formItem .input {
  position: relative;
}
.withdrawal .formItem .input input {
  margin-top: 0;
}
.withdrawal .formItem .input {
  margin-top: var(--withdrawal-input-marginTop);
}
.withdrawal .formItem .btn {
  display: flex;
  flex-flow: row wrap;
  margin: calc(var(--withdrawal-input-marginTop) * -1)
    calc(var(--withdrawal-input-marginTop) * -1) 0 0;
  padding-top: var(--withdrawal-input-marginTop);
}
.withdrawal .formItem .btn button {
  padding: 0.5em 1em;
  font-size: 1em;
  border-radius: calc(var(--withdrawal-input-borderRadius) / 2);
  font-weight: bold;
  transition: var(--transition);
  width: inherit;
  margin: var(--withdrawal-input-marginTop) var(--withdrawal-input-marginTop) 0
    0;
}
.withdrawal .formItem .scheduleBtn {
  background: linear-gradient(90deg, #e97c2b, #b15715);
}
.withdrawal .formItem .incomeBtn {
  background: linear-gradient(90deg, #0d5fa1, #234ab4);
}
.withdrawal .formItem input::placeholder {
  color: var(--withdrawal-color2);
}
.withdrawal .tips {
  margin-top: var(--withdrawal-input-marginTop);
  color: var(--withdrawal-icon-color2);
  font-size: 0.875em;
  opacity: 0.8;
}
.withdrawal .tips.color-2 {
  color: var(--withdrawal-color2);
}
.withdrawal .tips.align-center {
  text-align: center;
}
.withdrawal .address .icon {
  color: var(--withdrawal-icon-color2);
}
.withdrawal .submitBtn {
  width: 100%;
  padding: var(--withdrawal-input-padding);
  background: var(--withdrawal-submitBtn-bg);
  border-radius: var(--withdrawal-input-borderRadius);
  font-size: 1.125em;
  font-weight: bold;
  margin-top: var(--withdrawal-margin);
  transition: var(--transition);
}

.login .logo {
  text-align: center;
}
.login .logo b {
  display: block;
  text-align: center;
  margin-top: 0.625rem;
  margin-bottom: 1.25rem;
}
.login .login__actions {
  display: flex;
  align-items: center;
  margin: -1rem -1rem 1rem 0;
}
.login .login__error-message {
  color: var(--login__error-color);
  margin-top: 0.375rem;
}
.login button {
  background: var(--login-button-bg);
  text-align: center;
  border-radius: var(--login-button-borderRadius);
  margin: 1rem 1rem 1rem 0;
}
.login .hint {
  color: var(--login-hint-color);
}
.login .hint .title {
  margin-bottom: 0.3125rem;
  font-weight: bold;
}
.login .hint li {
  list-style: decimal;
  font-size: 0.875em;
  margin-left: 1.25em;
}
.footerBg {
  background: var(--footer-bg);
  color: var(--footer-color);
}
.site-footer {
  max-width: var(--layout-width);
  margin: auto;
}
.footer-menu ul {
  display: flex;
  justify-content: space-around;
  text-align: center;
  margin-bottom: 2rem;
}
.footer-menu img {
  width: 27px;
  margin-bottom: 0.125rem;
}
.footer-menu span {
  display: block;
}
.footer-desc {
  color: var(--footer-desc-color);
  margin-bottom: 1.5rem;
}
.footer-desc b {
  font-size: 1rem;
  color: var(--footer-color);
  margin-bottom: 0.75rem;
  display: block;
}
.footer-desc a {
  color: var(--footer-link-hover);
}
.footer-linkLine {
  margin-bottom: 2rem;
}
.footer-linkLine li {
  border-bottom: var(--footer-linkLine-border);
}
.footer-linkLine li:first-child {
  border-top: var(--footer-linkLine-border);
}
.footer-linkLine a {
  font-size: 1rem;
  padding: 1rem 0;
  color: var(--footer-linkLine-color);
  display: block;
}
.footer-share {
  border-bottom: var(--footer-footer-border);
}
.footer-share ul {
  max-width: 200px;
  margin: 0 auto 2rem auto;
}
.footer-share ul {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.footer-share img {
  width: 32px;
}
.footer-link ul {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  margin: 0 auto 2rem auto;
}
.footer-link span::before {
  display: none;
}
.footer-link li {
  border-top: var(--footer-border);
  margin: 0.5rem 0.5rem 0 0;
}
.footer-link a {
  font-size: 0.875rem;
  font-weight: normal;
  color: var(--footer-link);
}
.copyright {
  display: block;
}
.copyright a,
.copyright {
  text-align: center;
  font-size: 0.7rem;
}
.copyright a {
  color: var(--footer-link-hover);
}
.copyright.tagLink a span::before {
  display: none;
}
[label-border="false"].common.page,
[label-border="false"].common {
  border-color: transparent;
}
[label-borderRadius="2em"] .common {
  border-radius: 2em;
}
.products_messageBoard[label-btnStyle="2"] form .submit {
  background: var(--label-products_messageBoard-button-bg);
  background-size: 1000% 1000%;
  -webkit-animation: Gradient 90s linear infinite;
  -moz-animation: Gradient 90s linear infinite;
  animation: Gradient 90s linear infinite;
}
@-webkit-keyframes Gradient {
  0% {
    background-position: 0 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0 50%;
  }
}
@-moz-keyframes Gradient {
  0% {
    background-position: 0 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0 50%;
  }
}
@keyframes Gradient {
  0% {
    background-position: 0 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0 50%;
  }
}
/* star.copy */
.copyClick .after {
  display: none;
}
.copyClick.active .before {
  display: none;
}
.copyClick.active .after {
  display: block;
}
.copyClick2 .after {
  display: none;
}
.copyClick2.active .before {
  display: none;
}
.copyClick2.active .after {
  display: block;
}
/* end.copy */

.appDownload {
  background: url(../images/app-bg.png) var(--appDownload-bg) top center /
    var(--appDownload-bg-width);
  color: var(--appDownload-color);
  text-align: center;
  background-size: var(--appDownload-bg-size);
}
.appDownload footer,
.appDownload .bg {
  max-width: var(--appDownload-bg-width);
  margin: auto;
}
.appDownload header {
  padding: var(--layout-padding) var(--layout-padding) 0 var(--layout-padding);
}
.appDownload h1,
.appDownload h2 {
  background-image: var(--appDownload-h1-color);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
}
.appDownload h1 {
  font-size: 2.25rem;
}
.appDownload h2 {
  font-size: 1.125rem;
}
.appDownload main {
  min-height: calc(100dvh - 210px);
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-items: center;
}
.appDownload .content {
  padding-top: 0;
}
.appDownload .iconBg {
  fill: currentColor;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.appDownload .icon {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  display: block;
}
.appDownload header {
  padding-top: var(--layout-padding);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.appDownload header .logo {
  width: 30%;
}
.appDownload header nav {
  max-width: calc(
    (var(--appDownload-header-icon-width) + 2px + var(--appDownload-margin)) * 3
  );
  text-align: center;
}
.appDownload header nav .iconBg {
  border: 1px solid;
  border-radius: var(--appDownload-header-icon-borderRadius);
  width: var(--appDownload-header-icon-width);
  height: var(--appDownload-header-icon-width);
  margin-bottom: 0.5em;
}
.appDownload header nav .icon {
  width: 60%;
  height: 60%;
  color: #fff;
}
.appDownload header nav ul {
  display: flex;
  justify-content: end;
  margin: calc(var(--appDownload-margin) * -1)
    calc(var(--appDownload-margin) * -1) 0 0;
}
.appDownload header nav ul li {
  margin: var(--appDownload-margin) var(--appDownload-margin) 0 0;
}
.appDownload header nav a {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}
.appDownload header nav a span {
  width: 100%;
  color: var(--appDownload-color2);
  transition: var(--transition);
}
.appDownload .footerBg {
  position: fixed;
  bottom: 1rem;
  background: transparent;
}
.appDownload footer {
  width: calc(100% - var(--layout-padding) * 2);
}
.appDownload footer ul {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  margin: calc(var(--appDownload-margin) * -1)
    calc(var(--appDownload-margin) * -1) 0 0;
}
.appDownload footer li {
  margin: var(--appDownload-margin) var(--appDownload-margin) 0 0;
  width: calc(
    100% / var(--appDownload-footer-li-number) - var(--appDownload-margin)
  );
}
.appDownload .appDownBanner {
  margin-top: -1rem;
  margin-bottom: 2rem;
}
.appDownload footer a {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  white-space: nowrap;
  text-align: center;
  border: 1px solid;
  position: relative;
  border-radius: var(--appDownload-footer-borderRadius);
  padding: 0.5em;
  background: var(--appDownload-bg);
  transition: var(--transition);
}
.appDownload footer .iconBg {
  width: var(--appDownload-footer-icon-width);
  height: var(--appDownload-footer-icon-width);
  margin-right: 0.5em;
}
.girlfriendBg {
  position: sticky;
  right: 0;
  bottom: 6rem;
  max-width: var(--layout-width);
  margin: auto;
  transition: none;
}
.no-scroll .girlfriend {
  opacity: 0;
  visibility: hidden;
}
.products .girlfriendBg {
  max-width: var(--products-layout-width);
}
.girlfriend {
  position: relative;
  transition: var(--transition);
  opacity: 1;
  float: right;
  z-index: 10;
  visibility: visible;
  /* transition: none; */
}
.products .girlfriendBg.bottom .girlfriend {
  bottom: 1rem;
}
.girlfriend,
.girlfriend .video video {
  width: var(--girlfriend-video-width);
  height: var(--girlfriend-video-width);
}
.girlfriend .video {
  border-radius: 50%;
  overflow: hidden;
  position: relative;
  z-index: 1;
  transition: var(--transition);
}
.girlfriend::after,
.girlfriend::before {
  content: "";
  position: absolute;
  left: 0%;
  top: 0%;
  border-radius: 50%;
  background: var(--girlfriend-video-bg);
  opacity: 0.3;
  transition: var(--transition);
  width: 100%;
  height: 100%;
  transform-origin: center;
  animation: ripple-effect 1s ease-out infinite;
}
.girlfriend::after {
  animation-delay: 0.5s;
}
@keyframes ripple-effect {
  0% {
    transform: scale(1);
    opacity: 0.6;
  }
  50% {
    opacity: 0.3;
  }
  100% {
    transform: scale(1.75);
    opacity: 0;
  }
}
.girlfriend .videoTalkBg {
  position: absolute;
  right: 69%;
  bottom: 95%;
  width: 12.3em;
  text-align: left;
  z-index: 10;
  opacity: 0;
  transform: scale(1);
  transform-origin: right bottom;
  font-size: 0.875rem;
  animation: bubble-cute-in 0.3s cubic-bezier(0.18, 1.4, 0.4, 1) forwards;
  animation-delay: 1s;
}
.girlfriend .videoTalkBg::before {
  content: "";
  position: absolute;
  right: 10px;
  bottom: -8px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 10px 7px 0 5px;
  transform: rotate(-20deg);
  border-color: #246776 transparent transparent transparent;
  z-index: 20;
}
.girlfriend .videoTalk,
.girlfriend .videoTalk div {
  position: relative;
  z-index: 1;
}
.girlfriend .videoTalk div {
  padding: 0.75rem 1rem;
}
#lightBox-girlfriend.lightBox {
  background: transparent;
  align-items: end;
  justify-content: end;
  padding: 0.5rem 1rem;
  width: 100%;
}
.lightBox_girlfriendBg {
  max-width: calc(var(--layout-width) + var(--girlfriend-video-width));
  margin: auto;
  width: 100%;
  display: flex;
  align-items: end;
  justify-content: end;
  margin-bottom: 0;
}
.lightBox_girlfriend {
  width: 100%;
  transform: scale(0);
  transform-origin: bottom right;
  transition: var(--transition);
}
#lightBox-girlfriend.active .lightBox_girlfriend {
  animation: bubble-cute-in 0.2s cubic-bezier(0.18, 1.4, 0.4, 1) forwards;
  transform-origin: bottom right;
}

@keyframes bubble-cute-in {
  0% {
    opacity: 0;
    transform: translate(60px, 60px) scale(0.2);
  }
  55% {
    opacity: 1;
    transform: translate(-6px, -6px) scale(1.02);
  }
  75% {
    opacity: 1;
    transform: translate(2px, 2px) scale(0.99);
  }
  100% {
    opacity: 1;
    transform: translate(0, 0) scale(1);
  }
}
.lightBox_girlfriend .lightBox-content {
  background: var(--girlfriend-lightBox-bg);
  border-radius: 1rem;
  font-size: 0.75rem;
  max-height: var(--girlfriend-lightBox-maxHeight);
}
.lightBox_girlfriend .chatPage {
  height: calc(100% - var(--girlfriend-lightBox-chat-form-height));
  margin-bottom: 1.5rem;
  scrollbar-width: none;
  -ms-overflow-style: none;
  overflow-y: scroll;
  max-height: calc(var(--girlfriend-lightBox-maxHeight) - 8rem);
  -webkit-overflow-scrolling: touch;
}
#lightBox-girlfriend .chatPage::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}
.lightBox_girlfriend .chatPage .scroll {
  display: flex;
  flex-flow: row wrap;
  align-items: end;
  align-content: end;
  min-height: 300px;
}
.lightBox_girlfriend .chatItem {
  display: flex;
  width: 100%;
  animation: chat-bubble-in 0.25s ease-out forwards;
}
@keyframes chat-bubble-in {
  0% {
    opacity: 0;
    transform: scale(0.9) translateY(3px);
  }
  100% {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}
.girlfriend .videoTalk::after,
.lightBox_girlfriend .chatItem div {
  border-radius: 0.75em;
  padding: 0.5rem 1rem;
  width: 52%;
  margin-bottom: 1rem;
  white-space: normal;
  overflow-wrap: break-word;
  word-break: break-word;
}
.lightBox_girlfriend .chatItem.right {
  justify-content: end;
}
.girlfriend .videoTalk::after,
.lightBox_girlfriend .chatItem.left div {
  background: var(--girlfriend-lightBox-chat-bg);
}
.lightBox_girlfriend .chatItem.right div {
  background: var(--girlfriend-lightBox-chat-bg2);
}
.lightBox_girlfriend .chatItem.left div {
  border-bottom-left-radius: 0;
}
.lightBox_girlfriend .chatItem.right div {
  border-bottom-right-radius: 0;
}
.girlfriend .videoTalk::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border-radius: 0.75em;
  margin: 0;
  opacity: 0.96;
}
.lightBox_girlfriend .chatInput {
  display: flex;
  align-items: center;
  height: var(--girlfriend-lightBox-chat-form-height);
}
.lightBox_girlfriend .chatInput input {
  border-radius: 2em;
  width: calc(
    100% - var(--girlfriend-lightBox-chat-input-height) -
      var(--girlfriend-lightBox-chat-input-right)
  );
  margin-right: var(--girlfriend-lightBox-chat-input-right);
  padding: 0 1rem;
  background: var(--girlfriend-lightBox-chat-input-bg);
  border: var(--girlfriend-lightBox-chat-input-border);
  height: calc(var(--girlfriend-lightBox-chat-input-height) + 2px);
}
.lightBox_girlfriend .chatInput button {
  padding: 1rem;
  width: var(--girlfriend-lightBox-chat-input-height);
  height: var(--girlfriend-lightBox-chat-input-height);
  background: var(--girlfriend-lightBox-chat-button-bg);
  border-radius: 50%;
  position: relative;
  transition: var(--transition);
}
.lightBox_girlfriend .chatInput button .icon {
  position: absolute;
  left: 55%;
  top: 50%;
  width: 40%;
  height: 40%;
  transform: translate(-50%, -50%);
}
.lightBox_girlfriend .lightBox-close {
  width: var(--girlfriend-lightBox-close-width);
  height: var(--girlfriend-lightBox-close-width);
  top: -1rem;
}

.lightBox_entrance {
  text-align: center;
  max-width: 420px;
}

.lightBox_entrance .lightBox-content {
  padding: 0;
  border-radius: 1em;
}

.lightBox_entrance-top {
  position: relative;
}

.lightBox_entrance-top::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(0, hsl(221deg 58% 12% / 100%) 0, transparent 50%);
}

.lightBox_entrance-top .title {
  background: linear-gradient(135deg, #f4b925 0%, #fbd26a 100%);
  color: #0c1831;
  padding: 0.25rem 1rem;
  display: inline-block;
  border-radius: 1em;
  font-size: 0.75rem;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -0.5em;
  max-width: 10em;
  white-space: nowrap;
}

.lightBox_entrance-bottom {
  background: linear-gradient(#0c1831 -100%, #092853 50%);
  padding: 1.5rem 2rem;
}

.lightBox_entrance-bottom p {
  margin-bottom: 0.25em;
}

.lightBox_entrance-bottom .slogan {
  background: linear-gradient(135deg, #f4b925, #fcd983) text;
  -webkit-text-fill-color: transparent;
  font-size: 1.5rem;
  font-family: system-ui;
  font-weight: 600;
}

.lightBox_entrance-bottom .subheading {
  color: #93c5fdcc;
  font-size: 0.875rem;
}

.lightBox_entrance-bottom .text {
  color: #fff6;
  font-size: 0.75rem;
}

.lightBox_entrance_btn button {
  background: linear-gradient(135deg, #f4b925 0%, #6c6b6b 100%);
  color: #0c1831;
  display: inline-block;
  font-size: 1.125rem;
  display: flex;
  align-items: center;
  padding: 1rem;
  max-width: 370px;
  margin: 1.25em auto 0.75rem auto;
  border-radius: 0.65em;
  transition: all 2.5s;
  font-family: system-ui;
  font-weight: 700;
}

.lightBox_entrance_btn .img {
  width: 24px;
  height: 24px;
  margin-right: 0.5rem;
}

.confirm18Bg {
  background: #000;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  min-height: 100dvh;
  font-weight: bold;
  padding: 1.5rem;
}
.confirm18 {
  background: url(../images/confirm18.jpg) no-repeat center center / 100% 100%;
  max-width: 800px;
  box-shadow: 6px 3px 20px 8px rgb(64 64 64 / 45%);
  padding: 5rem 3.95rem;
}
.confirm18 .logo {
  max-width: 195px;
  margin: auto;
}
.confirm18 .title {
  font-size: 3.125rem;
  margin: 1.46875rem 0 0 0;
}
.confirm18 .text {
  font-size: 1.5rem;
  line-height: 1.8;
  font-weight: normal;
  margin-bottom: 2rem;
  text-align: left;
}
.confirm18 .cancle {
  border: 1px solid;
}
.confirm18 .btn {
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  justify-content: space-between;
  margin: -1rem -1rem 0 0;
}
.confirm18 .btn button {
  font-size: 1.5rem;
  max-width: 18.75rem;
  width: calc(50% - 1rem);
  margin: 1rem 1rem 0 0;
  border-radius: 0;
  height: 4rem;
  font-weight: bold;
  transition: var(--transition);
}
.confirm18 .confirm {
  background: linear-gradient(
    50deg,
    rgba(255, 0, 112, 1) 10%,
    rgba(255, 104, 123, 1) 90%,
    rgba(255, 122, 125, 1) 100%
  );
  color: #000;
}

@media (min-width: 768px) {
  .collapse-button {
    display: none;
  }
  .btnIn {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    background: var(--navList-btnIn-bg);
    z-index: 1;
    box-shadow: 0 0.0625rem 0.3125rem 0.0625rem rgba(0, 0, 0, 0.117);
    border-radius: var(--navTop-btnIn-borderRadius);
    overflow: hidden;
  }
  .site-header .navBg {
    width: calc(100% - var(--logo-width) - var(--navTop-width) - 3rem);
  }
  .site-header .mainNav .logoBg {
    display: none;
  }
  .site-header .mainNav .nav-listBg {
    display: flex;
  }
  .site-header .mainNav .nav-list {
    display: flex;
    flex-flow: row wrap;
    align-items: center;
  }
  .site-header .mainNav .nav-list .search {
    display: none;
  }
  .site-header .mainNav .nav-list a {
    padding: var(--navList-btnIn-padding);
  }
  .site-header .mainNav .nav-list a:hover {
    color: var(--navList-color-hover);
  }
  .site-header .mainNav .nav-list .btnIn {
    min-width: 160px;
  }
  .site-header .mainNav .nav-list .btnIn a {
    justify-content: center;
  }
  .navTop .userLogin .btnIn a:hover,
  .site-header .mainNav .nav-list .btnIn a:hover {
    background: var(--navList-btnIn-bg-hover);
  }
  .site-header .mainNav .nav-list .headerAd:hover {
    color: var(--headerAdBg-color);
    filter: brightness(1.2);
  }
  .headerAd:hover img {
    transform: scale(1.15);
  }
  .site-header .mainNav .nav-list .headerAdBg .btnIn li a:hover {
    color: var(--headerAdBg-color);
    background: var(--headerAdBg-bg-hover);
  }
  .headerAdBg ul li a:hover .icon {
    opacity: 1;
  }
  .lightBox_headerAd .stats .pagination button:hover,
  .pagination a:hover {
    background: var(--pagination-link-bg);
    color: var(--pagination-link-hover);
  }
  .pagination form .common {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }
  .navTop {
    width: var(--navTop-width);
  }
  .navTop .btnClick img {
    width: 18px;
  }
  .navTop > ul > li > a:hover {
    background: #1f1e1e;
  }
  .navTop .search {
    margin-right: 1.5rem;
  }
  .navTop .search a {
    background: var(--navTop-search-bg);
  }
  .navTop .search .scroll {
    max-height: 75dvh;
  }
  .navTop .search .close,
  .navTop .search .searchBtn {
    display: none;
  }
  .navTop .search .btnIn {
    max-width: calc(100dvw - var(--navTop-width));
  }
  .navTop .center li span {
    display: none;
  }
  .lightBox_headerAd .cta:hover {
    transform: scale(1.05);
  }
  .pagination {
    font-size: 1rem;
  }
  .pagination .common {
    padding: 0.422rem 1.438rem;
  }
  .login {
    font-size: 1.125rem;
    width: 35vw;
    min-width: 420px;
  }
  .login .logo b {
    font-size: 1.625rem;
  }

  .login .logo img {
    max-width: 176px;
  }
  .login button {
    padding: 0.85rem;
  }
  .login .login__field-group {
    margin-bottom: 1.65rem;
  }

  [class*="tagLink"] a:hover span::after {
    width: 100%;
  }
  .banner article:hover {
    transform: scale(1.07, 1.07);
  }
  /*start.navigationWeb*/
  .navigationWeb {
    max-width: 500px;
  }
  /*end.navigationWeb*/

  /*start.products*/
  .products_tags .product_card_bg a:hover span {
    color: var(--products_tags-color-hover);
  }
  .products_share svg:hover {
    opacity: 0.7;
  }
  .products_prevNext {
    display: flex;
  }
  .products_prevNext article:first-child span::before {
    content: "";
    position: absolute;
    right: -1.75rem;
    top: 0;
    width: 1px;
    height: 100%;
    background: var(--products_prevNext-border-color);
  }
  .products_prevNext article:last-child {
    text-align: right;
  }
  .products_messageBoard {
    font-size: 1rem;
  }
  .products_comment .card {
    padding-bottom: 3rem;
  }
  .products_comment .cardBgIn .cardBg:last-child .card {
    padding-bottom: 0;
  }
  .products_comment .card p {
    font-size: 1.0625rem;
  }
  .products_comment .cardBgIn {
    margin-top: -1.5rem;
    margin-bottom: 3rem;
  }
  /*end.products*/
  .headerBg [label-imgWidth="12"] img {
    width: 18px;
  }
  .lightBox_cta .btnSave:hover {
    background: var(--lightBox_cta-btnSave-color);
    color: #fff;
    border-color: var(--lightBox_cta-btnSave-color);
  }
  .lightBox_cta .btnShare:hover {
    transform: scale(1.07, 1.07);
  }
  .withdrawal .btn button:hover,
  .withdrawal .submitBtn:hover {
    opacity: 0.8;
  }
  .lightBox-withdrawalSubmit .wsBtnClose:hover {
    background: var(--withdrawal-input-bg);
  }
  .shareBanner:hover .right button {
    transform: translate(0, 0) rotate(0) skew(0) skewY(0) scaleX(1.05)
      scaleY(1.05);
  }
  .shareBanner:hover .right button::before {
    left: 100%;
  }
  .appDownload header nav a:hover span {
    color: var(--appDownload-color);
  }
  .appDownload header nav a:hover .iconBg,
  .appDownload footer a:hover {
    background: var(--appDownload-bg-hover);
  }
  .girlfriend:hover::after,
  .girlfriend:hover::before {
    animation: ripple-effect-hover 1s ease-out infinite;
  }
  @keyframes ripple-effect-hover {
    0% {
      transform: scale(1);
      opacity: 0.7;
    }
    50% {
      opacity: 0.4;
    }
    100% {
      transform: scale(1.5);
      opacity: 0.1;
    }
  }
  .lightBox_girlfriend .chatInput button:hover {
    filter: brightness(0.8);
  }
  .lightBox_girlfriendBg {
    left: 11rem;
    bottom: 0;
    max-width: 400px;
  }
  .girlfriendBg.bottom .girlfriend {
    bottom: 12rem;
    margin-top: -8rem;
  }
  .products .girlfriendBg .girlfriend {
    right: 2rem;
  }

  .lightBox_entrance_btn button:hover {
    background: linear-gradient(135deg, #ca8a00 0%, #ffca43 100%);
  }
  .lightBox_entrance .lightBox-bottom {
    margin-top: 0;
  }
  .confirm18 .cancle:hover{
  background: #111;
  }
  .confirm18 .confirm:hover{
  background: linear-gradient(
    190deg,
    rgba(255, 0, 112, 1) 10%,
    rgba(255, 104, 123, 1) 90%,
    rgba(255, 122, 125, 1) 100%
  );
  }
}
@media (min-width: 960px) {
  .girlfriendBg.bottom .girlfriend {
    bottom: 8rem;
  }
  .girlfriend {
    right: -5rem;
  }
  .products .girlfriendBg .girlfriend {
    right: -4.5rem;
  }
}
@media (min-width: 1300px) {
  .lightBox_girlfriendBg {
    left: 18rem;
  }
}
@media all and (max-width: 1299px) {
  :root {
    --layout-width: 700px;

    --shareBanner-li-margin: 0.25rem;
  }
  .products .pagetTitleBg h1 {
    font-size: 1.5rem;
  }
  .shareBanner {
    font-size: 0.875rem;
  }
  .shareBanner .middle .max {
    display: block;
  }
  .shareBanner .text {
    max-width: 2.5em;
    font-size: 3.5em;
  }
  .shareBanner .middle {
    padding: 0.5em;
  }
  .shareBanner .right button {
    padding: 1em;
  }

  .banner .videoPlayNews__in .tagWebTitleBg {
    font-size: 1.25rem;
  }
  .banner .videoPlayNews__in h2 {
    padding-right: 7rem;
    position: relative;
  }
  .girlfriendBg{
    margin-bottom: 3rem;
  }
}

@media all and (max-width: 767px) {
  :root {
    --bg: #2c2a2a;
    --header-bg: #212322;
    --navTop-btn-bg: #ffffff1a;
    --navBg-width: 17.5rem;
    --navBg-mainNav-bg: #191919;
    --navBg-mainNav-btnIn-bg: #1b1b1b;
    --navList-bg: #222;

    --navTop-icon-width: 26px;
    --navTop-center-height: 50px;
    --navTop-search-bg: #222;
    --navTop-search-searchBtn-width: 3.5rem;
    --navTop-search-input-bg: #303030;

    --lightBox_headerAd-stats-img: 25px;
    --lightBox_headerAd-stats-margin: 0.5rem;
    --lightBox_headerAd-stats-img-paddingLeft: 0.5rem;
    --lightBox_cta-ruleItem-margin: 0.65rem;

    --product_list-margin: 0.35rem;
    --products_comment-img-width: 30px;

    --label-navTop-center-btn-bg: #2c2a2a;

    --banner-videoPlayNews-tagWebTitleBg-bg-height: 63px;

    --appDownload-margin: 0.5rem;

    --girlfriend-lightBox-maxHeight: 100dvh;
  }

  body {
    transition: var(--transition);
    left: 0;
  }
  html.headerOpen body {
    transform: translateX(var(--navBg-width));
  }
  .collapse-button {
    width: auto;
    background: transparent;
    font-size: 0.78125rem;
    background-color: #ffffff14;
    padding: 0.25rem 0.563rem;
    border-radius: var(--borderRadius2);
    justify-content: start;
  }
  .collapse-button img {
    max-width: 16px;
    margin-right: 0.25rem;
  }
  .navTop,
  .collapse-button {
    width: 65px;
  }
  .navTop .search .scroll {
    max-height: calc(100dvh - 100px);
  }
  .navBg,
  .navTop .center {
    left: calc(var(--navBg-width) * -1);
    position: fixed;
    transition: var(--transition);
    width: var(--navBg-width);
    z-index: 100;
  }
  .site-header .mainNav .logoBg,
  .navBg .scroll,
  .navTop .center {
    padding: 1.25rem 1rem;
  }
  .navBg .scroll {
    overflow-y: scroll;
    max-height: calc(100dvh - 30px);
    padding-top: 0;
  }
  .navBg {
    top: 0;
    padding-bottom: calc(var(--navTop-center-height) + 1rem);
    background: var(--navBg-mainNav-bg);
    padding-left: 0;
    padding-right: 0;
  }
  .navTop .center {
    top: calc(100dvh - var(--navTop-center-height) - 0.65rem);
    background: var(--navTop-center-bg);
    margin: 0;
    padding-top: 0.5rem;
    justify-content: space-evenly;
    overflow-y: scroll;
  }
  .navTop .center li {
    margin-top: 0;
  }
  .navTop .center li:last-child {
    margin-right: 0;
  }
  .navTop .center .ai {
    display: none;
  }
  .navTop .center a {
    flex-flow: row wrap;
    padding: 0;
    background: transparent;
  }
  .navTop .center a img {
    width: 20px;
  }
  .navTop .center li span {
    display: block;
    margin-top: 0.5rem;
    font-size: 0.625rem;
    white-space: nowrap;
  }
  .navTop .userLogin .btnIn {
    min-width: inherit;
    border: 1px solid #2c2a2a;
    margin-right: -0.25rem;
  }
  .navTop .userLogin .btnIn .accountBg,
  .navTop .userLogin .btnIn a {
    padding: 0.5rem 1rem;
  }
  .navTop .userLogin .btnIn .accountBg {
    font-size: 0.875em;
    padding-top: 1rem;
    padding-bottom: 0.35rem;
  }
  .navTop .userLogin .btnIn .logOut {
    padding-bottom: 0.5rem;
  }
  .site-header .mainNav .nav-list > li {
    background: var(--navList-bg);
    border-radius: var(--navList-borderRadius);
    margin-bottom: 0.625rem;
  }
  .site-header .mainNav .nav-list li.search {
    display: flex;
    align-items: center;
    margin-bottom: 1.25rem;
  }
  .site-header .mainNav .nav-list a {
    width: 100%;
    justify-content: space-between;
    padding: 0.477rem 0.8rem;
    font-weight: 600;
    font-size: 1.03125rem;
  }
  .site-header .mainNav .nav-list a.arrow:after {
    transform: rotate(-90deg);
    transition: var(--transition);
  }
  .site-header .mainNav .nav-list a.active.arrow:after {
    transform: rotate(0deg);
  }
  .site-header .mainNav .nav-list li.search input {
    padding: 0;
    font-size: 0.875rem;
    border: 0;
  }
  .site-header .mainNav .nav-list li.search img {
    max-width: 26px;
  }
  .site-header .mainNav .nav-list .btnIn {
    background: var(--navBg-mainNav-btnIn-bg);
    display: block;
    margin-top: 0.25rem;
    position: relative;
  }
  .site-header .mainNav .nav-list .btnIn a {
    font-size: 0.9375rem;
    font-weight: 500;
    padding-top: 0.547rem;
    padding-bottom: 0.547rem;
  }
  .site-header .mainNav .logoBg {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
  }
  .site-header .mainNav .logoBg .logo {
    width: 88px;
  }
  .site-header .mainNav .logoBg .close {
    width: 25px;
  }
  .site-header li.headerAdBg {
    position: fixed;
    left: 47px;
    top: 15px;
  }
  .site-header .mainNav .nav-list > li.headerAdBg {
    background: transparent;
  }
  .site-header .mainNav .nav-list .headerAd {
    padding: 0.25rem;
    margin-right: 0;
    width: 63px;
  }
  .site-header .mainNav .nav-list a.arrow.headerAd::after {
    display: none;
  }
  .site-header .mainNav .nav-list .headerAdBg .btnIn {
    width: 110px;
    left: 0;
    display: none;
  }
  .site-header .mainNav .nav-list .headerAdBg .btnIn a {
    font-size: 0.875rem;
  }
  .headerAd span {
    display: none;
  }
  .pagination,
  .pagination form {
    margin: -0.5rem -0.5rem 0 0;
  }
  .pagination div {
    margin: 0.5rem 0.5rem 0 0;
  }
  .pagination .common {
    padding: 0.25rem 1.25rem;
  }
  .pagination form .common {
    padding-right: 0.5rem;
    padding-left: 0.5rem;
  }
  .pagination input {
    width: 3em;
  }
  .content {
    padding-top: 0;
  }
  .content::before {
    display: none;
    content: "";
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    opacity: 0.8;
    z-index: 90;
    background: rgb(0, 0, 0);
  }
  .navTop .search .btnClick {
    padding: 0;
    background: transparent;
    width: var(--navTop-icon-width);
  }
  .navTop .search .searchBtnBg {
    background: var(--navTop-search-bg);
    border-radius: var(--borderRadius2);
    padding: 0.25rem;
  }
  .navTop .search .btnIn .inputBg,
  .navTop .search .scroll {
    padding: 0.5rem 1rem;
  }
  .navTop .search .btnIn .inputBg {
    background: var(--navTop-search-input-bg);
    position: relative;
  }
  .navTop .search .btnIn {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100dvh;
    overflow-y: auto;
    background: var(--navTop-search-bg);
    z-index: 2;
    padding: 0;
  }
  .pagetTitleBg h1 {
    font-size: 1.75rem;
    padding-top: 1rem;
  }
  .pagetTitleBg .banner {
    margin-top: 0;
  }
  .banner article {
    padding-bottom: 200px;
  }
  .banner a:first-child h2 {
    font-size: 1.1625rem;
  }
  .banner a:first-child .h1Down {
    margin-top: 0.25rem;
  }
  .login {
    width: 100%;
    font-size: 0.75rem;
  }
  .login .logo b {
    font-size: 0.8125rem;
  }
  .login .logo img {
    max-width: 96px;
  }
  .login button {
    padding: 0.75rem;
  }
  .login .login__field-group {
    margin-bottom: 0.625rem;
  }
  /*star.products*/
  .products_subject a {
    font-size: 0.75rem;
  }
  .products_tags .product_card_bg a span {
    padding-top: 0.35rem;
    padding-bottom: 0.35rem;
  }
  .products_prevNext a {
    padding: 1rem;
  }
  .footer-link {
    width: 100%;
  }
  .footer-linkLine a {
    padding: 0.75rem 0;
  }
  .products_comment .cardBg {
    padding-bottom: 1rem;
  }
  .products_comment article:last-child {
    padding-bottom: 5rem;
  }
  .products_comment .cardBgIn .cardBg:last-child {
    padding-bottom: 0;
  }
  .products_comment article form {
    margin-bottom: 0.75rem;
  }
  .products_comment .cardBgIn form {
    margin-bottom: 0;
  }
  /*end.products*/
  [label-collapseButton-style] {
    background: transparent;
    padding: 0;
  }
  [label-collapseButton-style] span {
    display: none;
  }
  [label-collapseButton-style] img {
    margin-right: 0;
    max-width: 27px;
  }
  .headerBg [label-onlyImg] a {
    background: var(--label-navTop-center-btn-bg);
    padding: 0.35rem;
  }
  .headerBg [label-onlyImg] a span {
    display: none;
  }
  .lightBox_headerAd .badge {
    margin-bottom: 0.5rem;
    font-size: 0.75rem;
  }
  .lightBox_headerAd .title {
    font-size: 2rem;
    line-height: 1.25;
  }
  .lightBox_headerAd .stats .item .num {
    font-size: 1.125rem;
  }
  .lightBox_headerAd .uid-tip {
    margin-bottom: 0.5rem;
  }
  .lightBox_headerAd .reward-box {
    margin-top: 0.985rem;
    padding: 0.5rem;
  }
  .lightBox_headerAd .subtitle {
    margin-top: 0.5rem;
    font-size: 0.875rem;
  }
  .lightBox_headerAd .stats .item {
    width: 100%;
    padding: 0.5rem;
  }
  .lightBox_cta .ruleItem {
    font-size: 0.875rem;
  }
  .lightBox-withdrawalSubmit {
    font-size: 0.875rem;
  }
  .shareBanner .right button,
  .shareBanner {
    font-size: 0.75rem;
  }
  .shareBanner .mark,
  .shareBanner .middle .num,
  .shareBanner .text {
    font-size: 8vw;
  }
  .shareBanner .right button {
    padding-top: 1vw;
    padding-bottom: 1vw;
  }

  .shareBanner .mark .icon {
    width: 30%;
    height: 30%;
  }
  .shareBanner .mark .star {
    right: -10%;
  }
  .shareBanner .mark .lightning {
    left: -10%;
  }
  .shareBanner .text {
    margin: 0 -0.05em;
  }
  .shareBanner .hot {
    margin-right: calc(-7% - 1em);
    margin-top: 4.5rem;
  }
  .shareBanner .middle {
    padding: 0.5em;
  }
  .appDownload footer a {
    font-size: 1rem;
  }
  .banner .videoPlayNews__in h2 {
    -webkit-line-clamp: 2;
    order: 2;
    font-size: 0.875rem;
    padding-right: 5rem;
    min-height: 3em;
  }
  .banner .videoPlayNews__in .h1Down {
    position: absolute;
    left: 0;
    padding-left: 1rem;
    margin-top: -27px;
    width: 100%;
    height: 28px;
    order: 1;
    font-size: 0.75rem;
  }
  .banner .videoPlayNews__in header time,
  .banner .videoPlayNews__in header .name {
    text-shadow: var(--banner-videoPlayNews-header-textShadow);
  }
  .banner .videoPlayNews__in .tagWebTitleBg {
    top: 16px;
    font-size: 1rem;
  }
  .banner .videoPlayNews__in .tagWebTitle {
    padding: 0 0.5rem 0 var(--banner-videoPlayNews-tagWebTitleBg-bg-width);
  }

  .girlfriendBg {
    margin-right: 2rem;
  }
  .girlfriendBg.bottom {
    position: absolute;
    bottom: 7rem;
  }
  .products .girlfriendBg.bottom .girlfriend {
    bottom: -7.5rem;
  }
  .girlfriend .videoTalkBg {
    font-size: 0.75rem;
    width: 12.7em;
  }
  .lightBox_girlfriend .lightBox-content {
    padding: 1rem;
  }
  .lightBox_girlfriend {
    margin: 1.25rem 0 0.75rem 0;
    max-width: inherit;
  }
  .lightBox_entrance_btn .img {
    margin-right: 0.125rem;
  }
  .confirm18 {
    max-width: 300px;
    padding: 1.875rem;
  }
  .confirm18 .logo {
    max-width: 167px;
  }
  .confirm18 .title {
    font-size: 1.5625rem;
  }
  .confirm18 .text {
    font-size: 0.9375rem;
  }
  .confirm18 .btn button {
    font-size: 0.875rem;
  height: 2rem;
  width: calc(100% - 1rem);
  }
  .confirm18 .cancle{
    order:2;
  }
  .confirm18 .confirm{
    order:1;
  }
}
@media all and (max-width: 567px) {
  .shareBanner .hot,
  .shareBanner .gift {
    display: none;
  }
  .appDownload h1 {
    font-size: 6.5vw;
  }
  .appDownload h2 {
    font-size: 3.5vw;
  }
  .lightBox_cta .basicWidthHeight {
    min-width: calc(100vw - 10rem);
  }
  .shareBanner .right button .icon {
    margin-left: 0;
  }
  .shareBanner .mark,
  .shareBanner .middle .num,
  .shareBanner .text {
    font-size: 7vw;
  }
}
@media all and (max-width: 390px) {
  .pagination .common {
    padding: 0.25rem;
  }
  .shareBanner .mark,
  .shareBanner .middle .num,
  .shareBanner .text {
    font-size: 6.7vw;
  }
}
@media all and (max-width: 360px) {
  :root {
    --appDownload-footer-li-number: 1;
  }
  .shareBanner .right button br {
    display: block;
  }
  .shareBanner article {
    min-width: 270px;
  }
  .shareBanner .mark,
  .shareBanner .middle .num,
  .shareBanner .text {
    font-size: 8vw;
  }
  .shareBanner .mark {
    font-size: 3vw;
    position: absolute;
    right: calc(-5% + 95px);
    top: 17%;
    z-index: 1;
  }
  .lightBox_entrance_btn button {
    font-size: 1rem;
  }
  .lightBox_entrance-bottom .slogan {
    letter-spacing: -0.05rem;
    font-size: 1.25rem;
  }
}
@media all and (max-width: 320px) {
  .site-header .mainNav .nav-list .headerAd {
    width: 30px;
    overflow: hidden;
  }
}

@media (hover: none) and (pointer: coarse) {
}

/***** <!----- dev css  --------> ****/
/** html -> Top Loading Shimmer Bar **/
html.loading::before {
  content: "";
  position: fixed;
  top: 0;
  left: -120%;
  width: 220%;
  height: 3px;
  z-index: 99999;

  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(120, 0, 0, 0.15) 30%,
    rgba(220, 40, 40, 0.85) 50%,
    rgba(120, 0, 0, 0.15) 70%,
    transparent 100%
  );
  animation: top-shimmer 2s linear infinite;
}

@keyframes top-shimmer {
  0% {
    left: -150%;
  }
  60% {
    left: 0%;
  }
  70% {
    left: 0%;
  }
  100% {
    left: 100%;
  }
}

/** archives img-wrap 間距 & 統一寬度 **/
.img-wrap {
  width: 100%;
  /* max-width: 720px; */
}
.img-wrap img {
  width: 100%;
  height: auto;
  display: block;
  margin-bottom: 20px;
}
.video {
  width: 100%;
  max-width: 720px; /* 跟 img-wrap 一樣 */
  margin: 0 auto;
}
.video video {
  width: 100%;
  height: auto;
  display: block;
}

/* 雪層完全獨立，不進 nav 結構 */
#navSnowLayer {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  pointer-events: none;
  z-index: 9999;
  overflow: hidden;
}

#navSnowLayer .snowflake {
  position: absolute;
  width: 14px;
  height: 14px;
  color: rgba(255, 255, 255, 0.55); /* ❄ 顏色來源 */
  pointer-events: none;
  will-change: transform;
}



#navSunRayLayer{
    position:fixed;
    left:0;
    width:100%;
    pointer-events:none;
    overflow:hidden;
    z-index:9998;
}

.sunRayLine{
    position:absolute;
    top:-40px;
    height:260px;

    background:linear-gradient(
        to bottom,
        rgba(255,255,255,0.95),
        rgba(255,255,200,0.7),
        rgba(255,230,150,0.4),
        rgba(255,200,100,0.1),
        transparent
    );

    filter:blur(8px);
    mix-blend-mode:screen;

    transform-origin:top center;
}






/* ===== overlay ===== */
.private-share-modal{
	position:fixed;
	inset:0;
	background:rgba(0,0,0,.65);
	display:none;
	align-items:center;
	justify-content:center;
	z-index:99999;
	padding:20px;
}

.private-share-modal.show{
	display:flex;
}

/* ===== panel ===== */
.private-share-panel{
	width:100%;
	max-width:520px;
	background:#1c1c1e;
	border:1px solid rgba(255,255,255,.08);
	border-radius:16px;
	box-shadow:0 20px 50px rgba(0,0,0,.45);
	padding:20px;
	color:#fff;
}

/* ===== header ===== */
.private-share-head{
	display:flex;
	align-items:center;
	justify-content:space-between;
	margin-bottom:14px;
}

.private-share-title{
	font-size:20px;
	font-weight:700;
	color:#fff;
	line-height:1.2;
	white-space:nowrap;
}

.private-share-close{
	border:0;
	background:none;
	color:#aaa;
	font-size:22px;
	cursor:pointer;
	padding:0;
	width:32px;
	height:32px;
	display:flex;
	align-items:center;
	justify-content:center;
	flex-shrink:0;
}

.private-share-close:hover{
	color:#fff;
}

/* ===== desc ===== */
.private-share-desc{
	font-size:14px;
	color:#bdbdbd;
	margin-bottom:14px;
	line-height:1.6;
}

/* ===== input box ===== */
.private-share-box{
	background:#111;
	border:1px solid rgba(255,255,255,.08);
	border-radius:12px;
	padding:12px;
	margin-bottom:18px;
}

#privateShareInput{
	width:100%;
	border:0;
	outline:none;
	background:transparent;
	color:#fff;
	font-size:14px;
	line-height:1.6;
	word-break:break-all;
}

/* ===== button ===== */
.private-share-actions{
	display:flex;
}

#privateShareCopyBtn{
	width:100%;
	border:0;
	background:#ff1f1f;
	color:#fff;
	height:44px;
	border-radius:10px;
	font-size:15px;
	font-weight:700;
	cursor:pointer;
	transition:.2s;
}

#privateShareCopyBtn:hover{
	opacity:.9;
}

/* ============================================================
   SEO 關鍵字區塊（首頁 / 內頁底部）
   - 三色系獨立：
     長尾合輯 .longtailBg   青綠 #1abc9c
     網紅主播 .influencerBg 橘金 #f5a623
     熱門分類 .categoryBg   粉紅 #e94e77
   - 展開邏輯：預設顯示前 12 條，按 ···查看更多 展開
============================================================ */

/* ----- 長尾合輯 ----- */
.longtailBg{
	margin:1rem 0;padding:1rem 1.25rem;
	background:linear-gradient(180deg,rgba(26,188,156,.06),rgba(255,255,255,.02));
	border:1px solid rgba(94,92,92,.8);border-radius:.5rem;
}
.longtail-title{
	display:flex;align-items:center;gap:.5rem;
	font-size:1.05rem;font-weight:600;color:#1abc9c;
	margin-bottom:.75rem;padding-bottom:.625rem;
	border-bottom:1px dashed rgba(26,188,156,.3);
}
.longtail-title .icon{width:1em;height:1em;color:#1abc9c;fill:currentColor}
.longtail-list{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.longtail-item{
	display:inline-block;padding:.375rem .875rem;font-size:.875rem;
	color:#d6d6d6;background:rgba(255,255,255,.03);
	border:1px solid #5e5c5c;border-radius:999px;
	text-decoration:none;white-space:nowrap;
	transition:all .2s ease;
}
.longtail-item:hover{
	background:#1abc9c;color:#fff;border-color:#1abc9c;
	text-decoration:none;
}
.longtailBg:not(.is-expanded) .longtail-item.is-more{display:none}
.longtailBg.is-expanded .longtail-toggle{display:none}
/* 吃瓜風 簡約查看更多 - teal */
.longtail-toggle{
	display:inline-flex;align-items:center;gap:.375rem;
	padding:.375rem .75rem;font-size:.8125rem;color:#1abc9c;
	background:transparent;border:0;border-radius:999px;
	cursor:pointer;font-family:inherit;line-height:1;
	transition:background .2s ease, transform .2s ease;
}
.longtail-toggle:hover{background:rgba(26,188,156,.12);transform:translateX(2px)}
.longtail-toggle .dots{font-size:1rem;letter-spacing:.15em;font-weight:600;line-height:.6;opacity:.7}
.longtail-toggle .txt{font-size:.8125rem;font-weight:500;letter-spacing:.04em}

/* ----- 網紅主播 ----- */
.influencerBg{
	margin:1rem 0;padding:1rem 1.25rem;
	background:linear-gradient(180deg,rgba(245,166,35,.08),rgba(255,255,255,.02));
	border:1px solid rgba(94,92,92,.8);border-radius:.5rem;
}
.influencer-title{
	display:flex;align-items:center;gap:.5rem;
	font-size:1.05rem;font-weight:600;color:#f5a623;
	margin-bottom:.75rem;padding-bottom:.625rem;
	border-bottom:1px dashed rgba(245,166,35,.3);
}
.influencer-title .icon{width:1em;height:1em;color:#f5a623;fill:currentColor}
.influencer-list{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.influencer-item{
	display:inline-block;padding:.375rem .875rem;font-size:.875rem;
	color:#d6d6d6;background:rgba(255,255,255,.03);
	border:1px solid #5e5c5c;border-radius:999px;
	text-decoration:none;white-space:nowrap;
	transition:all .2s ease;
}
.influencer-item:hover{
	background:#f5a623;color:#fff;border-color:#f5a623;
	text-decoration:none;
}
.influencerBg:not(.is-expanded) .influencer-item.is-more{display:none}
.influencerBg.is-expanded .influencer-toggle{display:none}
/* 吃瓜風 簡約查看更多 - orange */
.influencer-toggle{
	display:inline-flex;align-items:center;gap:.375rem;
	padding:.375rem .75rem;font-size:.8125rem;color:#f5a623;
	background:transparent;border:0;border-radius:999px;
	cursor:pointer;font-family:inherit;line-height:1;
	transition:background .2s ease, transform .2s ease;
}
.influencer-toggle:hover{background:rgba(245,166,35,.12);transform:translateX(2px)}
.influencer-toggle .dots{font-size:1rem;letter-spacing:.15em;font-weight:600;line-height:.6;opacity:.7}
.influencer-toggle .txt{font-size:.8125rem;font-weight:500;letter-spacing:.04em}

/* ----- 熱門分類 ----- */
.categoryBg{
	margin:1rem 0;padding:1rem 1.25rem;
	background:linear-gradient(180deg,rgba(233,78,119,.08),rgba(255,255,255,.02));
	border:1px solid rgba(94,92,92,.8);border-radius:.5rem;
}
.category-title{
	display:flex;align-items:center;gap:.5rem;
	font-size:1.05rem;font-weight:600;color:#e94e77;
	margin-bottom:.75rem;padding-bottom:.625rem;
	border-bottom:1px dashed rgba(233,78,119,.3);
}
.category-title .icon{width:1em;height:1em;color:#e94e77;fill:currentColor}
.category-list{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.category-item{
	display:inline-block;padding:.375rem .875rem;font-size:.875rem;
	color:#d6d6d6;background:rgba(255,255,255,.03);
	border:1px solid #5e5c5c;border-radius:999px;
	text-decoration:none;white-space:nowrap;
	transition:all .2s ease;
}
.category-item:hover{
	background:#e94e77;color:#fff;border-color:#e94e77;
	text-decoration:none;
}
.categoryBg:not(.is-expanded) .category-item.is-more{display:none}
.categoryBg.is-expanded .category-toggle{display:none}
/* 吃瓜風 簡約查看更多 - pink */
.category-toggle{
	display:inline-flex;align-items:center;gap:.375rem;
	padding:.375rem .75rem;font-size:.8125rem;color:#e94e77;
	background:transparent;border:0;border-radius:999px;
	cursor:pointer;font-family:inherit;line-height:1;
	transition:background .2s ease, transform .2s ease;
}
.category-toggle:hover{background:rgba(233,78,119,.12);transform:translateX(2px)}
.category-toggle .dots{font-size:1rem;letter-spacing:.15em;font-weight:600;line-height:.6;opacity:.7}
.category-toggle .txt{font-size:.8125rem;font-weight:500;letter-spacing:.04em}

/* ----- Mobile ----- */
@media (max-width:768px){
	.longtailBg,.influencerBg,.categoryBg{margin:.75rem 0;padding:.875rem 1rem}
	.longtail-title,.influencer-title,.category-title{font-size:.9375rem}
	.longtail-item,.influencer-item,.category-item,
	.longtail-toggle,.influencer-toggle,.category-toggle{padding:.3125rem .75rem;font-size:.8125rem}
}
