

.iconfont {
  font-family: iconfont !important;
}

.icon-close-bold:before {
  content: "\e685";
}

.icon-ii:before {
  content: "\e654";
}

.icon-speaker:before {
  content: "\ed95";
}

.icon-fees:before {
  content: "\ed6d";
}

.icon-otc:before {
  content: "\ed7e";
}

.icon-okexchain:before {
  content: "\ed92";
}

.icon-jumpstart:before {
  content: "\ed93";
}

.icon-Star-o:before {
  content: "\e6c3";
}

.icon-Star:before {
  content: "\e6c6";
}

.icon-earn:before {
  content: "\ed94";
}

.icon-Close:before {
  content: "\e6b1";
}

.icon-Down:before {
  content: "\e6b2";
}

.icon-More:before {
  content: "\e6b4";
}

.icon-Order:before {
  content: "\e6b5";
}

.icon-exchange:before {
  content: "\e6b7";
}

.icon-more2:before {
  content: "\e6bb";
}

.icon-Play:before {
  content: "\e6bc";
}

.icon-icon_web_outline_sm_k-chat:before {
  content: "\ea94";
}

.icon-icon_web_outline_sm_tradingdate:before {
  content: "\ead1";
}

.icon-icon_web_outline_sm_favorite_active:before {
  content: "\ead7";
}

.icon-web_16_deposit:before {
  content: "\e6bf";
}

.icon-web_16_loan:before {
  content: "\e6c0";
}

.icon-web_16_withdraw:before {
  content: "\e6c1";
}

.icon-web_16_trade:before {
  content: "\e6c2";
}

.icon-web_16_transfer:before {
  content: "\e6c4";
}

.icon-web_16_show:before {
  content: "\e6c5";
}

.icon-web_16_un_show:before {
  content: "\e6c7";
}

.icon-annotation:before {
  content: "\e6cd";
}

.icon-arrow_right_small:before {
  content: "\eb92";
}

.icon-icon_web_outline_sm_introduce:before {
  content: "\eae0";
}

.icon-jiantou:before {
  content: "\ed28";
}

.icon-a-33:before {
  content: "\ed32";
}

.icon-a-111:before {
  content: "\ed33";
}

.icon-a-22:before {
  content: "\ed34";
}

.icon-a-Frame47145:before {
  content: "\ed24";
}

.icon-a-Frame47144:before {
  content: "\ed25";
}

.icon-a-Frame47146:before {
  content: "\ed26";
}

.icon-bxs_user-circle:before {
  content: "\ed27";
}

.icon-kline-up:before {
  content: "\e64e";
}

.icon-info-circle1:before {
  content: "\e681";
}

.icon-Telegram:before {
  content: "\e694";
}

.icon-check-circle-o1:before {
  content: "\e69f";
}

.icon-qq:before {
  content: "\e752";
}

.icon-google-forward1:before {
  content: "\e7ce";
}

.icon-dropdown-cell:before {
  content: "\e89d";
}

.icon-Dropdown_switch:before {
  content: "\e8ac";
}

.icon-invite_link:before {
  content: "\e94c";
}

.icon-invite_share:before {
  content: "\e94e";
}

.icon-icon_close:before {
  content: "\e97b";
}

.icon-home_user:before {
  content: "\e7f1";
}

.icon-web_info:before {
  content: "\ea9a";
}

.icon-arrow_down:before {
  content: "\eae5";
}

.icon-Nodeallist:before {
  content: "\e6d0";
}

.icon-kline-down:before {
  content: "\e7cc";
}

.icon-dropdown-mail:before {
  content: "\e89e";
}

.icon-weibo:before {
  content: "\e604";
}

.icon-twitter2:before {
  content: "\e605";
}

.icon-close-circle1:before {
  content: "\e673";
}

.icon-exclamation-circle1:before {
  content: "\e67f";
}

.icon-Loading:before {
  content: "\e655";
}

.icon-Unfold:before {
  content: "\e660";
}

.icon-search:before {
  content: "\e6be";
}

.icon-mac:before {
  content: "\e6f5";
}

.icon-android:before {
  content: "\e734";
}

.icon-check-circle:before {
  content: "\e785";
}

.icon-info-circle:before {
  content: "\e786";
}

.icon-exclamation-circle:before {
  content: "\e787";
}

.icon-close-circle:before {
  content: "\e788";
}

.icon-cancel:before {
  content: "\e791";
}

.icon-dropdown_api1:before {
  content: "\e99b";
}

.icon-fabi_right:before {
  content: "\e9e5";
}

.icon-fabi_selected:before {
  content: "\e9e9";
}

.icon-bitcoin:before {
  content: "\eab1";
}

.icon-web_16_dollar:before {
  content: "\eb80";
}

.icon-web_16_purse:before {
  content: "\eb82";
}

.icon-renwu_share:before {
  content: "\ec38";
}

.icon-renwu_gift:before {
  content: "\ec39";
}

.icon-renwu_Earn:before {
  content: "\ec3a";
}

.icon-icon_search:before {
  content: "\ec59";
}

.icon-web_16_offline:before {
  content: "\eb4d";
}

.icon-Mul_edit:before {
  content: "\ebcc";
}

.icon-web_16_right:before {
  content: "\ebf6";
}

.icon-share_WhatsApp:before {
  content: "\ec06";
}

.icon-share_telegram:before {
  content: "\ec07";
}

.icon-share_twitter:before {
  content: "\ec08";
}

.icon-share_facebook:before {
  content: "\ec09";
}

.icon-qq1:before {
  content: "\ec0a";
}

.icon-Weibo_Color:before {
  content: "\ec0e";
}

.icon-Copy:before {
  content: "\ec44";
}

.icon-twitter:before {
  content: "\e600";
}

.icon-twitter1:before {
  content: "\e659";
}

.okx-growth-more:before {
  content: "\e000";
  font-family: fa-413cf12742;
}

.okx-growth-right:before {
  content: "\e001";
  font-family: fa-413cf12742;
}

.okx-growth-mark-done:before {
  content: "\e004";
  font-family: fa-413cf12742;
}

.okx-growth-flag:before {
  content: "\e005";
  font-family: fa-413cf12742;
}

.okx-growth-warning:before {
  content: "\e006";
  font-family: fa-413cf12742;
}

.okx-growth-arrow-right:before {
  content: "\e007";
  font-family: fa-413cf12742;
}

.okx-growth-arrow-left:before {
  content: "\e008";
  font-family: fa-413cf12742;
}

.okx-growth-mark-ing:before {
  content: "\e009";
  font-family: fa-413cf12742;
}

.okx-growth-profile:before {
  content: "\e00a";
  font-family: fa-413cf12742;
}

.okx-growth-vector:before {
  content: "\e00b";
  font-family: fa-413cf12742;
}

.okx-growth-vector2:before {
  content: "\e00c";
  font-family: fa-413cf12742;
}

.okx-growth-wheat:before {
  content: "\e00d";
  font-family: fa-413cf12742;
}

.okx-growth-vector4-1:before {
  content: "\e00e";
  font-family: fa-413cf12742;
}

.okx-growth-vector4:before {
  content: "\e00f";
  font-family: fa-413cf12742;
}

.okx-growth-vector3:before {
  content: "\e010";
  font-family: fa-413cf12742;
}

.okx-growth-and:before {
  content: "\e013";
  font-family: fa-413cf12742;
}

.okx-growth-copy:before {
  content: "\e015";
  font-family: fa-413cf12742;
}

.okx-growth-question:before {
  content: "\e016";
  font-family: fa-413cf12742;
}

.okx-growth-link-1:before {
  content: "\e018";
  font-family: fa-413cf12742;
}

.okx-growth-more-2:before {
  content: "\e019";
  font-family: fa-413cf12742;
}

.okx-growth-edit:before {
  content: "\e01b";
  font-family: fa-413cf12742;
}

.okx-growth-warning-circle:before {
  content: "\e01c";
  font-family: fa-413cf12742;
}

.okx-growth-arrow-chevrons-top:before {
  content: "\e01d";
  font-family: fa-413cf12742;
}

.okx-growth-arrow-pointer:before {
  content: "\e01e";
  font-family: fa-413cf12742;
}

.okx-growth-buy-crypto:before {
  content: "\e01f";
  font-family: fa-413cf12742;
}

.okx-growth-camera-flip:before {
  content: "\e020";
  font-family: fa-413cf12742;
}

.okx-growth-chevrons-right:before {
  content: "\e021";
  font-family: fa-413cf12742;
}

.okx-growth-close:before {
  content: "\e022";
  font-family: fa-413cf12742;
}

.okx-growth-chevrons:before {
  content: "\e023";
  font-family: fa-413cf12742;
}

.okx-growth-complete:before {
  content: "\e024";
  font-family: fa-413cf12742;
}

.okx-growth-deposit:before {
  content: "\e026";
  font-family: fa-413cf12742;
}

.okx-growth-drawer:before {
  content: "\e027";
  font-family: fa-413cf12742;
}

.okx-growth-eye-hide-filled:before {
  content: "\e029";
  font-family: fa-413cf12742;
}

.okx-growth-eye-show-filled:before {
  content: "\e02a";
  font-family: fa-413cf12742;
}

.okx-growth-faceid:before {
  content: "\e02b";
  font-family: fa-413cf12742;
}

.okx-growth-google:before {
  content: "\e02c";
  font-family: fa-413cf12742;
}

.okx-growth-history:before {
  content: "\e02d";
  font-family: fa-413cf12742;
}

.okx-growth-insurance-fund:before {
  content: "\e02e";
  font-family: fa-413cf12742;
}

.okx-growth-lv1:before {
  content: "\e02f";
  font-family: fa-413cf12742;
}

.okx-growth-mail:before {
  content: "\e030";
  font-family: fa-413cf12742;
}

.okx-growth-lv2:before {
  content: "\e031";
  font-family: fa-413cf12742;
}

.okx-growth-mobile:before {
  content: "\e032";
  font-family: fa-413cf12742;
}

.okx-growth-colon:before {
  content: "\e033";
  font-family: fa-413cf12742;
}

.okx-growth-clear-fill:before {
  content: "\e034";
  font-family: fa-413cf12742;
}

.okx-growth-area:before {
  content: "\e035";
  font-family: fa-413cf12742;
}

.okx-growth-success-circle:before {
  content: "\e036";
  font-family: fa-413cf12742;
}

.okx-growth-tip-dialog:before {
  content: "\e037";
  font-family: fa-413cf12742;
}

.okx-growth-upgrade:before {
  content: "\e038";
  font-family: fa-413cf12742;
}

.okx-growth-arrow-1:before {
  content: "\e03b";
  font-family: fa-413cf12742;
}

.okx-growth-pound:before {
  content: "\e03c";
  font-family: fa-413cf12742;
}

.okx-growth-arrow-down:before {
  content: "\e03d";
  font-family: fa-413cf12742;
}

.okx-growth-arrow-up:before {
  content: "\e03e";
  font-family: fa-413cf12742;
}

.okx-growth-expand:before {
  content: "\e03f";
  font-family: fa-413cf12742;
}

.okx-growth-restore:before {
  content: "\e040";
  font-family: fa-413cf12742;
}

.okx-growth-progress-point:before {
  content: "\e041";
  font-family: fa-413cf12742;
}

.okx-growth-desktop:before {
  content: "\e042";
  font-family: fa-413cf12742;
}

.okx-growth-down:before {
  content: "\e043";
  font-family: fa-413cf12742;
}

.okx-growth-info:before {
  content: "\e044";
  font-family: fa-413cf12742;
}

.okx-growth-ios:before {
  content: "\e045";
  font-family: fa-413cf12742;
}

.okx-growth-phone:before {
  content: "\e046";
  font-family: fa-413cf12742;
}

.okx-growth-windows:before {
  content: "\e047";
  font-family: fa-413cf12742;
}

.okx-growth-android:before {
  content: "\e048";
  font-family: fa-413cf12742;
}

.okx-growth-ai:before {
  content: "\e049";
  font-family: fa-413cf12742;
}

.okx-growth-earn:before {
  content: "\e04a";
  font-family: fa-413cf12742;
}

.okx-growth-assets:before {
  content: "\e04b";
  font-family: fa-413cf12742;
}

.okx-growth-exchange:before {
  content: "\e04c";
  font-family: fa-413cf12742;
}

.okx-growth-search:before {
  content: "\e04d";
  font-family: fa-413cf12742;
}

.okx-growth-refresh:before {
  content: "\e04e";
  font-family: fa-413cf12742;
}

.okx-growth-crown:before {
  content: "\e04f";
  font-family: fa-413cf12742;
}

.okx-growth-open-link:before {
  content: "\e050";
  font-family: fa-413cf12742;
}

.okx-growth-circular-remove:before {
  content: "\e052";
  font-family: fa-413cf12742;
}

.okx-growth-retry:before {
  content: "\e053";
  font-family: fa-413cf12742;
}

.okx-growth-trending-down:before {
  content: "\e056";
  font-family: fa-413cf12742;
}

.okx-growth-trending-up:before {
  content: "\e057";
  font-family: fa-413cf12742;
}

.okx-growth-gift:before {
  content: "\e058";
  font-family: fa-413cf12742;
}

.okx-growth-rule:before {
  content: "\e059";
  font-family: fa-413cf12742;
}

.okx-growth-information:before {
  content: "\e05a";
  font-family: fa-413cf12742;
}

.iconfont {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 16px;
  font-style: normal;
}

.iconfont:before {
  display: inline-block;
}

@font-face {
  font-display: block;
  font-family: fa-413cf12742;
  font-style: normal;
  src: url(../d37c03c836006f6d7502.woff2) format("woff2");
}

[dir="rtl"] .okx-growth-arrow-1:before,
[dir="rtl"] .okx-growth-arrow-left:before,
[dir="rtl"] .okx-growth-arrow-pointer:before,
[dir="rtl"] .okx-growth-arrow-right:before,
[dir="rtl"] .okx-growth-chevrons-right:before,
[dir="rtl"] .okx-growth-chevrons:before,
[dir="rtl"] .okx-growth-open-link:before,
[dir="rtl"] .okx-growth-question:before {
  transform: scaleX(-1);
}

.index_errorBoundaryPage__2ZS5k {
  min-height: calc(100vh - 48px);
}

.index_errorBoundaryComp__Tdolz,
.index_errorBoundaryPage__2ZS5k {
  align-items: center;
  display: flex;
  justify-content: center;
}

.index_errorBoundaryContent__mJjpI {
  text-align: center;
}

.index_errorBoundaryContent__mJjpI .index_errorBoundaryImg__f3LV9 {
  height: 100px;
  margin: 0 auto 40px;
  width: 100px;
}

.index_errorBoundaryContent__mJjpI .index_errorBoundaryTitle__23JrC {
  font-size: 16px;
  font-weight: 500;
  line-height: 20px;
}

.index_errorBoundaryContent__mJjpI .index_errorBoundarySubTitle__AMhnC {
  color: #929292;
  font-size: 16px;
  font-weight: 500;
  line-height: 20px;
  margin-top: 4px;
}

.index_errorBoundaryContent__mJjpI .index_errorBoundaryBtnGr__cV78M {
  margin-top: 25px;
}

.index_errorBoundaryContent__mJjpI .index_errorBoundaryBtnGr__cV78M .index_errorBoundaryBtn__pnDaN {
  min-width: 132px;
}

.index_container__HCsU-,
.index_container__PWrc5 {
  align-items: center;
  display: flex;
  justify-content: center;
  min-height: calc(100vh - 48px);
}

.index_content__tz4x9 {
  text-align: center;
}

.index_content__tz4x9 .index_img__a5\+B1 {
  height: 100px;
  margin: 0 auto 4px;
  width: 100px;
}

.index_content__tz4x9 .index_title__tpDgy {
  font-size: 16px;
  font-weight: 500;
  line-height: 20px;
}

.index_content__tz4x9 .index_btn__MkOJ0 {
  margin-top: 20px;
}

@media (max-width: 767px) {
  .index_goToAffWrapper__W5--k {
    padding-top: 40px;
  }
}

.index_referralBanner__fyt1\+ {
  display: flex;
  padding-left: 8px;
  padding-right: 8px;
  padding-top: 52px;
}

@media (min-width: 768px) {
  .index_referralBanner__fyt1\+ {
    padding-left: 12px;
    padding-right: 12px;
  }
}

@media (min-width: 1024px) {
  .index_referralBanner__fyt1\+ {
    padding-left: calc(50% - 480px);
    padding-right: calc(50% - 480px);
  }
}

@media (min-width: 1270px) {
  .index_referralBanner__fyt1\+ {
    padding-left: calc(50% - 624px);
    padding-right: calc(50% - 624px);
  }
}

@media (min-width: 768px) {
  .index_referralBanner__fyt1\+ {
    background-color: var(--okd-color-gray-900);
    padding-bottom: 80px;
    padding-top: 80px;
  }
}

@media (min-width: 1024px) {
  .index_referralBanner__fyt1\+ {
    padding-bottom: 90px;
    padding-top: 90px;
  }
}

@media (min-width: 1270px) {
  .index_referralBanner__fyt1\+ {
    padding-bottom: 135px;
    padding-top: 135px;
  }
}

.index_content__xBEKD {
  align-items: center;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-left: 8px;
  padding-right: 8px;
  width: 100%;
}

@media (min-width: 768px) {
  .index_content__xBEKD {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}

@media (min-width: 1024px) {
  .index_content__xBEKD {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}

@media (min-width: 1270px) {
  .index_content__xBEKD {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}

@media (min-width: 768px) {
  .index_content__xBEKD {
    align-items: unset;
    justify-content: unset;
    margin-left: 25%;
  }
}

@media (min-width: 768px) and (min-width: 768px) {
  .index_content__xBEKD {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}

@media (min-width: 768px) and (min-width: 1024px) {
  .index_content__xBEKD {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}

@media (min-width: 768px) and (min-width: 1270px) {
  .index_content__xBEKD {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}

@media (min-width: 768px) and (min-width: 768px) {
  .index_content__xBEKD {
    margin-left: 8.33333333%;
  }
}

@media (min-width: 768px) and (min-width: 1024px) {
  .index_content__xBEKD {
    margin-left: 8.33333333%;
  }
}

@media (min-width: 768px) and (min-width: 1270px) {
  .index_content__xBEKD {
    margin-left: 8.33333333%;
  }
}

@media (min-width: 1024px) {
  .index_content__xBEKD {
    flex-direction: column;
    margin-left: 0;
  }
}

@media (min-width: 1024px) and (min-width: 768px) {
  .index_content__xBEKD {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 58.33333333%;
  }
}

@media (min-width: 1024px) and (min-width: 1024px) {
  .index_content__xBEKD {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 58.33333333%;
  }
}

@media (min-width: 1024px) and (min-width: 1270px) {
  .index_content__xBEKD {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 58.33333333%;
  }
}

@media (min-width: 1270px) and (min-width: 768px) {
  .index_content__xBEKD {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 50%;
  }
}

@media (min-width: 1270px) and (min-width: 1024px) {
  .index_content__xBEKD {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 50%;
  }
}

@media (min-width: 1270px) and (min-width: 1270px) {
  .index_content__xBEKD {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 50%;
  }
}

.index_bannerImageWrapper__ujQpD {
  align-items: center;
  display: flex;
  justify-content: center;
}

@media (min-width: 768px) {
  .index_bannerImageWrapper__ujQpD {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 41.66666667%;
  }
}

@media (min-width: 1024px) {
  .index_bannerImageWrapper__ujQpD {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 41.66666667%;
  }
}

@media (min-width: 1270px) {
  .index_bannerImageWrapper__ujQpD {
    box-sizing: border-box;
    margin-left: 50%;
    padding-left: 12px;
    padding-left: 8px;
    padding-right: 12px;
    padding-right: 8px;
    width: 41.66666667%;
    width: 100%;
  }
}

@media (min-width: 1270px) and (min-width: 768px) {
  .index_bannerImageWrapper__ujQpD {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 33.33333333%;
  }
}

@media (min-width: 1270px) and (min-width: 1024px) {
  .index_bannerImageWrapper__ujQpD {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 33.33333333%;
  }
}

@media (min-width: 1270px) and (min-width: 1270px) {
  .index_bannerImageWrapper__ujQpD {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 33.33333333%;
  }
}

@media (min-width: 1270px) and (min-width: 768px) {
  .index_bannerImageWrapper__ujQpD {
    margin-left: 16.66666667%;
  }
}

@media (min-width: 1270px) and (min-width: 1024px) {
  .index_bannerImageWrapper__ujQpD {
    margin-left: 16.66666667%;
  }
}

@media (min-width: 1270px) and (min-width: 1270px) {
  .index_bannerImageWrapper__ujQpD {
    margin-left: 16.66666667%;
  }
}

.index_bannerImage__GJ0cq {
  width: 300px;
}

.index_bannerTitle__0kTLX {
  color: #222a3c;
  font-size: 36px;
  font-weight: 700;
  line-height: 42px;
  margin-bottom: 12px;
  text-align: center;
}

@media (min-width: 768px) {
  .index_bannerTitle__0kTLX {
    color: #f7f9fc;
    font-size: 48px;
    line-height: 63px;
    margin-bottom: 36px;
    text-align: left;
  }
}

.index_bannerImageSM__c2B6t {
  display: flex;
  justify-content: center;
  margin-bottom: 32px;
  width: 247px;
}

.index_copySection__3yQ9Y {
  border: 1px solid #d9d9d9;
  border-radius: 4px;
  width: 100%;
}

@media (min-width: 768px) {
  .index_copySection__3yQ9Y {
    border: 0;
    display: flex;
    flex-direction: column;
    gap: 15px;
    padding: 0;
  }
}

.index_ctaButton__GKxH7 {
  box-sizing: border-box;
  padding-left: 8px;
  padding-right: 8px;
  width: 100%;
}

@media (min-width: 768px) {
  .index_ctaButton__GKxH7 {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 33.33333333%;
  }
}

@media (min-width: 1024px) {
  .index_ctaButton__GKxH7 {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 33.33333333%;
  }
}

@media (min-width: 1270px) {
  .index_ctaButton__GKxH7 {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 33.33333333%;
  }
}

@media (min-width: 768px) {
  .index_ctaButton__GKxH7 {
    width: 70%;
  }
}

.index_inviteSection__2AWQG {
  display: flex;
  flex-direction: column;
  width: 100%;
}

@media (max-width: 767px) {
  .index_inviteSection__2AWQG {
    border: 1px solid #d9d9d9;
    border-radius: 4px;
  }
}

@media (min-width: 768px) {
  .index_inviteSection__2AWQG {
    gap: 12px;
  }
}

.index_shareContainer__A2EP4 {
  align-items: center;
  display: flex;
  gap: 8px;
  position: relative;
}

@media (max-width: 767px) {
  .index_shareContainer__A2EP4 {
    padding: 11px 12px;
  }
}

@media (min-width: 768px) {
  .index_shareContainer__A2EP4 {
    padding: 7px 12px;
  }
}

@media (min-width: 1024px) {
  .index_shareContainer__A2EP4 {
    padding: 3px 8px;
  }
}

@media (min-width: 1270px) {
  .index_shareContainer__A2EP4 {
    padding: 8px 12px;
  }
}

.index_shareContainer__A2EP4.index_borderBottom__jLngM:after {
  border-bottom: 1px solid var(--okd-color-gray-100);
  bottom: 0;
  content: "";
  display: block;
  left: 12px;
  position: absolute;
  width: calc(100% - 24px);
}

@media (min-width: 768px) {
  .index_shareContainer__A2EP4 {
    background-color: var(--okd-color-background-1);
    border: 1px solid var(--okd-color-gray-100);
    border-radius: 4px;
  }
}

.index_label__cjEd3 {
  line-height: 20px;
  width: 104px;
}

i.index_shareIcon__ur5iV {
  font-size: 24px;
}

.index_value__7KmWW {
  flex: 1 1;
  line-height: 20px;
  overflow: hidden;
  text-align: right;
  text-overflow: ellipsis;
}

.index_copyIcon__a\+RkM {
  background-color: var(--okd-color-background-1);
  border: 1px solid var(--okd-color-gray-200);
  border-radius: 4px;
  cursor: pointer;
  height: 32px;
  margin-left: 4px;
  padding: 0;
  width: 32px;
}

.index_copyIcon__a\+RkM.index_active__T9y5p {
  color: #05c28c;
}

.index_goToAffiliate__995eh {
  align-items: center;
  display: flex;
  justify-content: center;
  padding: 128px 0 136px;
}

@media (max-width: 767px) {
  .index_goToAffiliate__995eh {
    padding: 24px 0 64px;
  }
}

.index_goToAffiliate__995eh .index_content__Xlct4 {
  text-align: center;
}

.index_goToAffiliate__995eh .index_content__Xlct4 .index_congrats__CIbmn {
  font-size: 16px;
  font-weight: 500;
  line-height: 20px;
  margin-top: 14px;
}

.index_goToAffiliate__995eh .index_content__Xlct4 .index_desc__PT5Hu {
  color: var(--okd-color-gray-500);
  font-size: 14px;
  line-height: 22px;
  margin-top: 4px;
  max-width: 380px;
}

.index_goToAffiliate__995eh .index_content__Xlct4 .index_button__KbQ99 {
  margin-top: 20px;
  width: 160px;
}

.index_referralRules__Eyv5- {
  margin: 0 auto;
  padding-bottom: 60px;
}

.index_rulesGrid__8gr4B {
  margin-top: 80px;
  padding-left: 8px;
  padding-right: 8px;
}

@media (min-width: 768px) {
  .index_rulesGrid__8gr4B {
    padding-left: 12px;
    padding-right: 12px;
  }
}

@media (min-width: 1024px) {
  .index_rulesGrid__8gr4B {
    padding-left: calc(50% - 480px);
    padding-right: calc(50% - 480px);
  }
}

@media (min-width: 1270px) {
  .index_rulesGrid__8gr4B {
    margin-top: 100px;
    padding-left: calc(50% - 624px);
    padding-right: calc(50% - 624px);
  }
}

.index_rulesTitle__lJGrg {
  color: white;
  font-size: 28px;
  font-weight: 700;
  line-height: 37px;
  margin: 0 auto;
  text-align: center;
  width: 343px;
}

@media (min-width: 768px) {
  .index_rulesTitle__lJGrg {
    font-size: 28px;
    line-height: 37px;
    width: 472px;
  }
}

@media (min-width: 1024px) {
  .index_rulesTitle__lJGrg {
    width: 616px;
  }
}

@media (min-width: 1270px) {
  .index_rulesTitle__lJGrg {
    width: 808px;
  }
}

.index_rulesContent__ZTCNK {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: space-between;
  margin-top: 52px;
  width: 100%;
}


.index_rulesContent__ZTCNK>* {
  flex: 0 0 calc(33.33% - 20px);
  
}

@media (min-width: 1270px) {
  .index_rulesContent__ZTCNK {
    box-sizing: border-box;
    margin-left: 8.33333333%;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}

@media (min-width: 768px) {
  .index_rulesContent__ZTCNK {
    flex-direction: row;
  }
}

.index_rulesInfo__AzpZw {
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 100%;
}

.index_rulesImage__G3dW- {
  height: 60px;
  margin-bottom: 10px;
  width: 60px;
}

@media (max-width: 768px) {
  .index_rulesContent__ZTCNK > * {
      flex-basis: calc(50% - 20px); /* Two columns on smaller screens */
  }
}

@media (max-width: 500px) {
  .index_rulesContent__ZTCNK > * {
      flex-basis: calc(100% - 20px); /* One column on smaller screens */
  }
}


.index_rulesItemTitle__LBWBt {
  color: white;
  font-size: 20px;
  font-weight: 700;
  line-height: 24px;
  text-align: center;
  min-height: 50px;
}
.index_rulesItemTitle__LBWBt a {
  color: white;

}

.index_rulesItemDesc__1SEpP a {
  color: var(--okd-color-gray-400) !important;

}
.index_rulesItemDesc__1SEpP {
  color: var(--okd-color-gray-400);
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  text-align: center;
  width: 75%;
  min-height: 80%;
}



.index_introduceWrapper__dva2D {
  padding-bottom: 80px;
  padding-left: 8px;
  padding-right: 8px;
}

@media (min-width: 768px) {
  .index_introduceWrapper__dva2D {
    padding-left: 12px;
    padding-right: 12px;
  }
}

@media (min-width: 1024px) {
  .index_introduceWrapper__dva2D {
    padding-left: calc(50% - 480px);
    padding-right: calc(50% - 480px);
  }
}

@media (min-width: 1270px) {
  .index_introduceWrapper__dva2D {
    padding-left: calc(50% - 624px);
    padding-right: calc(50% - 624px);
  }
}

.index_introduceContent__pAmnf {
  box-sizing: border-box;
  margin: 0 auto;
  padding-left: 8px;
  padding-right: 8px;
  width: 100%;
}

@media (min-width: 768px) {
  .index_introduceContent__pAmnf {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}

@media (min-width: 1024px) {
  .index_introduceContent__pAmnf {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}

@media (min-width: 1270px) {
  .index_introduceContent__pAmnf {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
    width: 83.33333333%;
  }
}

.index_introduceTitle__5Gq9d {
  color: #222a3c;
  font-size: 28px;
  font-weight: 700;
  line-height: 36px;
  margin-bottom: 32px;
}

.index_introduceRule__MrvuQ {
  color: #222a3c;
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  margin-bottom: 16px;
}

.index_referralLink__HUVx7 {
  margin-left: 2px;
}

.index_loadHome__iCLvU {
  align-items: center;
  display: flex;
  justify-content: center;
}

@media (max-width: 767px) {
  .index_loadHome__iCLvU {
    min-height: 300px;
  }
}

@media (min-width: 768px) {
  .index_loadHome__iCLvU {
    min-height: 500px;
  }
}

.index_wrapper__m7sZ8 {
  padding-left: 8px;
  padding-right: 8px;
}

@media (min-width: 768px) {
  .index_wrapper__m7sZ8 {
    padding-left: 12px;
    padding-right: 12px;
  }
}

@media (min-width: 1024px) {
  .index_wrapper__m7sZ8 {
    padding-left: calc(50% - 480px);
    padding-right: calc(50% - 480px);
  }
}

@media (min-width: 1270px) {
  .index_wrapper__m7sZ8 {
    padding-left: calc(50% - 624px);
    padding-right: calc(50% - 624px);
  }
}

.index_rulesHref__obL6j,
.index_subHeader__4Yl3n {
  color: var(--okd-color-gray-700);
}

.index_rulesHref__obL6j {
  cursor: pointer;
}

.index_rulesHref__obL6j,
.index_rulesHref__obL6j:hover {
  text-decoration: underline;
}

.index_rewards__ZBiaG {
  display: flex;
  justify-content: center;
}

.index_prizeRule1__YVdN2 {
  color: var(--okd-color-text-amplifed);
}

.index_prizeRule2Wrapper__ZZ9Um {
  color: var(--okd-color-gray-700);
}

.index_prizeRule2Wrapper__ZZ9Um .index_icon__UcQ5M {
  color: var(--okd-color-gray-500);
  position: relative;
  top: 1px;
}

.index_tooltipContent__gav41 {
  white-space: pre-line;
}

@media (min-width: 1024px) {
  .index_prizeRule2Wrapper__ZZ9Um {
    text-align: center;
  }
}

@media (min-width: 768px) {
  .index_content__p4Pgx {
    margin-left: 50%;
    padding-bottom: 54px;
  }

  .index_content__p4Pgx .index_header__RTiXz {
    font-size: 36px;
    font-weight: 700;
    line-height: 48px;
    text-align: center;
  }

  .index_content__p4Pgx .index_subHeader__4Yl3n {
    font-size: 18px;
    line-height: 30px;
    margin-top: 12px;
    text-align: center;
  }

  .index_content__p4Pgx .index_prizeRule1__YVdN2 {
    font-size: 16px;
    line-height: 20px;
    margin-top: 56px;
  }

  .index_content__p4Pgx .index_rewards__ZBiaG {
    margin-top: 12px;
  }

  .index_content__p4Pgx .index_prizeRule2Wrapper__ZZ9Um {
    font-size: 16px;
    line-height: 20px;
    margin-top: 16px;
  }

  .index_content__p4Pgx .index_prizeRule2Wrapper__ZZ9Um .index_icon__UcQ5M {
    margin-left: 2px;
  }
}

@media (min-width: 768px) and (min-width: 768px) {
  .index_content__p4Pgx {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 66.66666667%;
  }
}

@media (min-width: 768px) and (min-width: 1024px) {
  .index_content__p4Pgx {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 66.66666667%;
  }
}

@media (min-width: 768px) and (min-width: 1270px) {
  .index_content__p4Pgx {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 66.66666667%;
  }
}

@media (min-width: 768px) and (min-width: 768px) {
  .index_content__p4Pgx {
    margin-left: 16.66666667%;
  }
}

@media (min-width: 768px) and (min-width: 1024px) {
  .index_content__p4Pgx {
    margin-left: 16.66666667%;
  }
}

@media (min-width: 768px) and (min-width: 1270px) {
  .index_content__p4Pgx {
    margin-left: 16.66666667%;
  }
}

@media (min-width: 768px) and (min-width: 768px) {
  .index_content__p4Pgx {
    padding-top: 40px;
  }
}

@media (min-width: 768px) and (min-width: 1270px) {
  .index_content__p4Pgx {
    padding-top: 80px;
  }
}

@media (max-width: 767px) {
  .index_content__p4Pgx {
    box-sizing: border-box;
    padding: 20px 8px 40px;
    width: 100%;
  }

  .index_content__p4Pgx .index_header__RTiXz {
    font-size: 18px;
    font-weight: 700;
    line-height: 24px;
  }

  .index_content__p4Pgx .index_subHeader__4Yl3n {
    font-size: 12px;
    line-height: 16px;
    margin-top: 4px;
  }

  .index_content__p4Pgx .index_prizeRule1__YVdN2 {
    font-size: 14px;
    line-height: 16px;
    margin-top: 33px;
  }

  .index_content__p4Pgx .index_rewards__ZBiaG {
    margin-top: 8px;
  }

  .index_content__p4Pgx .index_prizeRule2Wrapper__ZZ9Um {
    font-size: 14px;
    line-height: 16px;
    margin-top: 8px;
  }

  .index_content__p4Pgx .index_prizeRule2Wrapper__ZZ9Um .index_icon__UcQ5M {
    margin-left: 6px;
  }
}

@media (max-width: 767px) and (min-width: 768px) {
  .index_content__p4Pgx {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 33.33333333%;
  }
}

@media (max-width: 767px) and (min-width: 1024px) {
  .index_content__p4Pgx {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 33.33333333%;
  }
}

@media (max-width: 767px) and (min-width: 1270px) {
  .index_content__p4Pgx {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 33.33333333%;
  }
}

@media (max-width: 767px) {
  .index_cardsWrapper__BNPUf {
    width: 100%;
  }
}

.index_cardsWrapper__BNPUf.index_side__X3lvm {
  grid-row-gap: 0;
  grid-column-gap: 0;
  display: grid;
  grid-auto-flow: row;
  grid-template-columns: repeat(2, 1fr);
}

@media (min-width: 768px) {
  .index_cardsWrapper__BNPUf.index_side__X3lvm {
    min-height: 158px;
  }
}

@media (min-width: 1024px) {
  .index_cardsWrapper__BNPUf.index_side__X3lvm {
    min-height: 178px;
  }
}

@media (min-width: 1270px) {
  .index_cardsWrapper__BNPUf.index_side__X3lvm {
    min-height: 200px;
  }
}

.index_cardsWrapper__BNPUf.index_side__X3lvm .index_card__qKmBH {
  box-sizing: border-box;
}

@media (min-width: 768px) {
  .index_cardsWrapper__BNPUf.index_side__X3lvm .index_card__qKmBH {
    min-width: 236px;
  }
}

@media (min-width: 1024px) {
  .index_cardsWrapper__BNPUf.index_side__X3lvm .index_card__qKmBH {
    min-width: 308px;
  }
}

@media (min-width: 1270px) {
  .index_cardsWrapper__BNPUf.index_side__X3lvm .index_card__qKmBH {
    min-width: 404px;
  }
}

.index_cardsWrapper__BNPUf.index_side__X3lvm .index_card__qKmBH:first-child {
  border-top-left-radius: 12px;
}

.index_cardsWrapper__BNPUf.index_side__X3lvm .index_card__qKmBH:nth-child(2) {
  border-top-right-radius: 12px;
}

.index_cardsWrapper__BNPUf.index_side__X3lvm .index_card__qKmBH:nth-child(3) {
  border-bottom-left-radius: 12px;
}

.index_cardsWrapper__BNPUf.index_side__X3lvm .index_card__qKmBH:nth-child(4) {
  border-bottom-right-radius: 12px;
}

@media (min-width: 768px) {
  .index_cardsWrapper__BNPUf.index_side__X3lvm .index_card__qKmBH .index_title__GDu09 {
    padding: 40px 16px 0;
  }
}

@media (min-width: 1024px) {
  .index_cardsWrapper__BNPUf.index_side__X3lvm .index_card__qKmBH .index_title__GDu09 {
    padding: 42px 28px 0;
  }
}

@media (min-width: 1270px) {
  .index_cardsWrapper__BNPUf.index_side__X3lvm .index_card__qKmBH .index_title__GDu09 {
    padding: 53px 40px 0;
  }
}

@media (min-width: 768px) {
  .index_cardsWrapper__BNPUf.index_side__X3lvm .index_card__qKmBH .index_content__hFicz {
    padding: 16px 16px 40px;
  }
}

@media (min-width: 1024px) {
  .index_cardsWrapper__BNPUf.index_side__X3lvm .index_card__qKmBH .index_content__hFicz {
    padding: 16px 28px 42px;
  }
}

@media (min-width: 1270px) {
  .index_cardsWrapper__BNPUf.index_side__X3lvm .index_card__qKmBH .index_content__hFicz {
    padding: 16px 40px 53px;
  }
}

.index_cardsWrapper__BNPUf.index_stacked__TBi6\+ {
  display: flex;
  flex-direction: column;
}

.index_cardsWrapper__BNPUf.index_stacked__TBi6\+ .index_card__qKmBH {
  box-sizing: border-box;
}

.index_cardsWrapper__BNPUf.index_stacked__TBi6\+ .index_card__qKmBH:first-child {
  border-radius: 8px;
  height: 114px;
  justify-content: center;
  padding: 0 20px;
  position: relative;
  z-index: 2;
}

.index_cardsWrapper__BNPUf.index_stacked__TBi6\+ .index_card__qKmBH:first-child:after {
  background: repeating-linear-gradient(90deg,
      rgba(0, 0, 0, 0.08),
      rgba(0, 0, 0, 0.08) 5px,
      transparent 0,
      transparent 10px);
  bottom: 0;
  content: "";
  height: 1px;
  left: 16px;
  position: absolute;
  right: 16px;
}

.index_cardsWrapper__BNPUf.index_stacked__TBi6\+ .index_card__qKmBH:not(:first-child) {
  height: 94px;
  padding: 25px 20px 16px;
  position: relative;
  top: -9px;
  z-index: 1;
}

.index_cardsWrapper__BNPUf.index_stacked__TBi6\+ .index_card__qKmBH:last-child {
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}

.index_cardsWrapper__BNPUf.index_stacked__TBi6\+ .index_card__qKmBH .index_content__hFicz {
  margin-top: 8px;
}

.index_cardsWrapper__BNPUf .index_card__qKmBH {
  background-position: top;
  background-repeat: no-repeat;
  background-size: calc(100% - 8px) auto;
  display: flex;
  flex-direction: column;
}

.index_cardsWrapper__BNPUf .index_primary__g47WD {
  background-color: #bcff2f;
}

.index_cardsWrapper__BNPUf .index_secondary__-r2ns {
  background-color: var(--okd-color-background-2);
}

.index_cardsWrapper__BNPUf .index_secondary__-r2ns .index_content__hFicz {
  color: rgba(0, 0, 0, 0.57);
}

.index_cardsWrapper__BNPUf .index_title__GDu09 {
  font-weight: 700;
}

@media (max-width: 767px) {
  .index_cardsWrapper__BNPUf .index_title__GDu09 {
    font-size: 14px;
    line-height: 16px;
  }
}

@media (min-width: 768px) {
  .index_cardsWrapper__BNPUf .index_title__GDu09 {
    font-size: 20px;
    line-height: 24px;
  }
}

@media (min-width: 1024px) {
  .index_cardsWrapper__BNPUf .index_title__GDu09 {
    font-size: 22px;
    line-height: 30px;
  }
}

@media (min-width: 1270px) {
  .index_cardsWrapper__BNPUf .index_title__GDu09 {
    font-size: 22px;
    line-height: 30px;
  }
}

.index_cardsWrapper__BNPUf .index_content__hFicz {
  font-weight: 700;
}

@media (max-width: 767px) {
  .index_cardsWrapper__BNPUf .index_content__hFicz {
    font-size: 20px;
    line-height: 28px;
  }
}

@media (min-width: 768px) {
  .index_cardsWrapper__BNPUf .index_content__hFicz {
    font-size: 28px;
    line-height: 36px;
  }
}

@media (min-width: 1024px) {
  .index_cardsWrapper__BNPUf .index_content__hFicz {
    font-size: 28px;
    line-height: 34px;
  }
}

@media (min-width: 1270px) {
  .index_cardsWrapper__BNPUf .index_content__hFicz {
    font-size: 28px;
    line-height: 34px;
  }
}

@media (max-width: 767px) {
  .index_primary__g47WD .index_content__hFicz {
    font-size: 28px;
    line-height: 34px;
  }
}

.index_banner__kiBzr {
  background: #000;
  padding-left: 8px;
  padding-right: 8px;
}

@media (min-width: 768px) {
  .index_banner__kiBzr {
    padding-left: 12px;
    padding-right: 12px;
  }
}

@media (min-width: 1024px) {
  .index_banner__kiBzr {
    padding-left: calc(50% - 480px);
    padding-right: calc(50% - 480px);
  }
}

@media (min-width: 1270px) {
  .index_banner__kiBzr {
    padding-left: calc(50% - 624px);
    padding-right: calc(50% - 624px);
  }
}

.index_banner__kiBzr .index_content__bLZFz {
  align-items: center;
  box-sizing: border-box;
  display: flex;
  flex-direction: column-reverse;
  padding-left: 8px;
  padding-right: 8px;
  width: 100%;
}

@media (min-width: 768px) {
  .index_banner__kiBzr .index_content__bLZFz {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}

@media (min-width: 1024px) {
  .index_banner__kiBzr .index_content__bLZFz {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}

@media (min-width: 1270px) {
  .index_banner__kiBzr .index_content__bLZFz {
    box-sizing: border-box;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}

.index_banner__kiBzr .index_content__bLZFz .index_infoWrapper__xhT0a {
  flex: 1 1;
}

.index_banner__kiBzr .index_content__bLZFz .index_infoWrapper__xhT0a .index_placeholder__aOyqe {
  align-items: center;
  display: flex;
}

@media (max-width: 767px) {
  .index_banner__kiBzr .index_content__bLZFz .index_infoWrapper__xhT0a .index_placeholder__aOyqe {
    min-height: 64px;
  }
}

@media (min-width: 768px) {
  .index_banner__kiBzr .index_content__bLZFz .index_infoWrapper__xhT0a .index_placeholder__aOyqe {
    min-height: 52px;
  }
}

@media (min-width: 1024px) {
  .index_banner__kiBzr .index_content__bLZFz .index_infoWrapper__xhT0a .index_placeholder__aOyqe {
    min-height: 116px;
  }
}

@media (min-width: 1270px) {
  .index_banner__kiBzr .index_content__bLZFz .index_infoWrapper__xhT0a .index_placeholder__aOyqe {
    min-height: 58px;
  }
}

.index_banner__kiBzr .index_content__bLZFz .index_infoWrapper__xhT0a .index_title__ePmq2 {
  color: #fff;
  font-weight: 700;
}

.index_banner__kiBzr .index_content__bLZFz .index_infoWrapper__xhT0a .index_action__NS6s9 {
  display: flex;
  justify-content: center;
  margin-top: 40px;
}

@media (min-width: 768px) {
  .index_banner__kiBzr .index_content__bLZFz .index_infoWrapper__xhT0a .index_action__NS6s9 {
    width: 471px;
  }
}

@media (min-width: 1024px) {
  .index_banner__kiBzr .index_content__bLZFz .index_infoWrapper__xhT0a .index_action__NS6s9 {
    width: 456px;
  }
}

@media (min-width: 1270px) {
  .index_banner__kiBzr .index_content__bLZFz .index_infoWrapper__xhT0a .index_action__NS6s9 {
    width: 496px;
  }
}

@media (max-width: 767px) {
  .index_banner__kiBzr {
    background: #fff;
  }

  .index_banner__kiBzr .index_content__bLZFz {
    padding-bottom: 40px;
    padding-top: 40px;
  }

  .index_banner__kiBzr .index_content__bLZFz .index_infoWrapper__xhT0a {
    width: 100%;
  }

  .index_banner__kiBzr .index_content__bLZFz .index_infoWrapper__xhT0a .index_title__ePmq2 {
    color: #000;
    font-size: 24px;
    line-height: 32px;
  }

  .index_banner__kiBzr .index_content__bLZFz .index_infoWrapper__xhT0a .index_action__NS6s9 {
    margin-top: 24px;
  }

  .index_banner__kiBzr .index_content__bLZFz .index_infoWrapper__xhT0a .index_action__NS6s9 .index_signupButton__ygHF9 {
    width: 100%;
  }

  .index_banner__kiBzr .index_content__bLZFz .index_pictureWrapper__h5n8B {
    height: 200px;
    padding: 0 0 40px;
    width: 200px;
  }
}

@media (min-width: 768px) {
  .index_banner__kiBzr .index_content__bLZFz {
    padding-bottom: 60px;
    padding-top: 0;
  }

  .index_banner__kiBzr .index_content__bLZFz .index_infoWrapper__xhT0a .index_title__ePmq2 {
    font-size: 40px;
    line-height: 52px;
    text-align: center;
  }

  .index_banner__kiBzr .index_content__bLZFz .index_infoWrapper__xhT0a .index_action__NS6s9 {
    margin-left: auto;
    margin-right: auto;
  }

  .index_banner__kiBzr .index_content__bLZFz .index_pictureWrapper__h5n8B {
    height: 300px;
    padding: 24px;
    width: 300px;
  }
}

@media (min-width: 1024px) {
  .index_banner__kiBzr .index_content__bLZFz {
    align-items: center;
    display: flex;
    flex-direction: row;
    gap: 48px;
    justify-content: space-between;
    padding-bottom: 60px;
    padding-top: 60px;
  }

  .index_banner__kiBzr .index_content__bLZFz .index_infoWrapper__xhT0a .index_title__ePmq2 {
    font-size: 44px;
    line-height: 58px;
    text-align: left;
  }

  .index_banner__kiBzr .index_content__bLZFz .index_infoWrapper__xhT0a .index_action__NS6s9 {
    justify-content: left;
    margin-left: unset;
    margin-right: unset;
  }

  .index_banner__kiBzr .index_content__bLZFz .index_pictureWrapper__h5n8B {
    height: 200px;
    padding: 24px;
    width: 200px;
  }
}

@media (min-width: 1270px) {
  .index_banner__kiBzr .index_content__bLZFz .index_pictureWrapper__h5n8B {
    height: 300px;
    padding: 75px;
    width: 300px;
  }
}

.index_errorContainer__9gDnh {
  align-items: center;
  display: flex;
  justify-content: center;
  min-height: 400px;
}

.index_dialogContent__QIhVQ {
  display: flex;
  flex-direction: column;
  text-align: center;
}

.index_dialogContentTitle__tg2sf {
  font-size: 24px;
  font-weight: 700;
  line-height: 28px;
}

.index_container__7giD2 {
  padding: 16px 8px;
}

@media (min-width: 768px) {
  .index_container__7giD2 {
    padding-left: 12px;
    padding-right: 12px;
  }
}

@media (min-width: 1024px) {
  .index_container__7giD2 {
    padding-left: calc(50% - 480px);
    padding-right: calc(50% - 480px);
  }
}

@media (min-width: 1270px) {
  .index_container__7giD2 {
    padding-left: calc(50% - 624px);
    padding-right: calc(50% - 624px);
  }
}

.index_title__pPlIG {
  font-size: 18px;
  font-weight: 700;
  line-height: 24px;
}

.index_contentCenter__d1hAO {
  align-items: center;
  display: flex;
  flex-direction: column;
}

@media (max-width: 767px) {
  .index_wrapper__mibsm {
    box-sizing: border-box;
    padding-left: 8px;
    padding-right: 8px;
    width: 100%;
  }
}

@media (min-width: 768px) {
  .index_wrapper__mibsm {
    box-sizing: border-box;
    margin-left: 16.66666667%;
    padding-left: 12px;
    padding-right: 12px;
    width: 66.66666667%;
  }
}

@media (min-width: 1024px) {
  .index_wrapper__mibsm {
    box-sizing: border-box;
    margin-left: 0;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}

.index_rewardsImage__cVg8C {
  margin: 20px 0;
}

.index_buttonContainer__\+FxzQ {
  display: flex;
  flex-direction: column;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

.index_rewardsButton__noIEA {
  height: 42px;
}

@media (min-width: 768px) {
  .index_rewardsButton__noIEA {
    height: auto;
  }

  .index_rewardsButtonContent__Z8y56 {
    font-weight: 700;
  }

  .index_wrapper__mibsm {
    grid-row-gap: 24px;
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    row-gap: 24px;
  }

  .index_cardContainer__G-FJK,
  .index_rewardsCard__UOndk {
    border: 1px solid var(--okd-color-gray-100);
    border-radius: 8px;
    padding: 40px;
  }

  .index_rewardsCard__UOndk {
    -webkit-column-gap: 5px;
    -moz-column-gap: 5px;
    column-gap: 5px;
    display: flex;
    justify-content: space-between;
  }

  .index_overviewCard__suAqN {
    grid-column-gap: 12px;
    -webkit-column-gap: 12px;
    -moz-column-gap: 12px;
    column-gap: 12px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }

  .index_title__pPlIG {
    font-size: 24px;
    font-weight: 700;
    line-height: 136%;
    margin-bottom: 12px;
  }

  .index_cardCount__alN8C {
    font-size: 56px;
    font-weight: 700;
    line-height: 132%;
  }

  .index_buttonContainer__\+FxzQ {
    margin-top: 12px;
  }

  .index_cardCountDesc__OA2oe {
    font-size: 16px;
    font-weight: 500;
    line-height: 20px;
    margin-top: 6px;
  }
}

@media (min-width: 1024px) {
  .index_wrapper__mibsm {
    -webkit-column-gap: 24px;
    -moz-column-gap: 24px;
    column-gap: 24px;
    grid-template-columns: repeat(2, 1fr);
  }
}

.index_container__qkbly {
  padding: 36px 8px 60px;
}

@media (min-width: 768px) {
  .index_container__qkbly {
    padding-left: 12px;
    padding-right: 12px;
  }
}

@media (min-width: 1024px) {
  .index_container__qkbly {
    padding-left: calc(50% - 480px);
    padding-right: calc(50% - 480px);
  }
}

@media (min-width: 1270px) {
  .index_container__qkbly {
    padding-left: calc(50% - 624px);
    padding-right: calc(50% - 624px);
  }
}

@media (max-width: 767px) {
  .index_wrapper__ixPmT {
    box-sizing: border-box;
    padding-left: 8px;
    padding-right: 8px;
    width: 100%;
  }
}

@media (min-width: 768px) {
  .index_wrapper__ixPmT {
    box-sizing: border-box;
    margin-left: 8.33333333%;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}

@media (min-width: 1024px) {
  .index_wrapper__ixPmT {
    box-sizing: border-box;
    margin-left: 0;
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
  }
}

.index_historyTitle__OEkEX {
  font-size: 18px;
  font-weight: 700;
  line-height: 24px;
}

@media (min-width: 768px) {
  .index_container__qkbly {
    padding-bottom: 80px;
    padding-top: 40px;
  }

  .index_historyTitle__OEkEX {
    padding-top: 16px;
  }
}

.index_noRecordContainer__XROHQ {
  margin-top: 40px;
  text-align: center;
}

.index_noRecordHint__1oPPC {
  color: var(--okd-color-gray-700);
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  margin-top: 8px;
}

.index_roundImage__YZYj7 {
  border-radius: 50%;
  margin-right: 8px;
}

@media (min-width: 768px) {
  .index_roundImage__YZYj7 {
    margin-right: 4px;
  }
}

.index_emptyAvatar__xi158 {
  align-items: center;
  border-radius: 50%;
  color: #f7f7f7;
  display: flex;
  font-size: 12px;
  font-weight: 700;
  height: 28px;
  justify-content: center;
  margin-right: 8px;
  width: 28px;
}

@media (min-width: 768px) {
  .index_emptyAvatar__xi158 {
    font-size: 10px;
    height: 16px;
    margin-right: 4px;
    width: 16px;
  }
}

.index_emptyAvatarBg1__QNLab {
  background-color: #60bdff;
}

.index_emptyAvatarBg2__hoodL {
  background-color: #ff993a;
}

.index_emptyAvatarBg3__1PYGY {
  background-color: #ffba23;
}

.index_emptyAvatarBg4__hE2A8 {
  background-color: #ff49a2;
}

.index_emptyAvatarBg5__pOEvj {
  background-color: #cd6966;
}

.index_emptyAvatarBg6__0fb4S {
  background-color: #ac76ec;
}

.index_emptyAvatarBg0__nu2cv {
  background-color: #ff3875;
}

.index_tableContainer__1VemK {
  font-size: 12px;
  font-weight: 500;
  line-height: 16px;
  margin-top: 16px;
}

.index_tableContainer__1VemK .index_headerCell__OiMW1.index_accountCell__7FXQR,
.index_tableContainer__1VemK .index_headerCell__OiMW1.index_dateCell__KGq6z,
.index_tableContainer__1VemK .index_headerCell__OiMW1.index_statusCell__TmatH {
  border: none;
  font-weight: 400;
  padding-bottom: 10px;
  padding-top: 0;
}

@media (min-width: 768px) {

  .index_tableContainer__1VemK .index_headerCell__OiMW1.index_accountCell__7FXQR,
  .index_tableContainer__1VemK .index_headerCell__OiMW1.index_dateCell__KGq6z,
  .index_tableContainer__1VemK .index_headerCell__OiMW1.index_statusCell__TmatH {
    background: var(--okd-color-gray-050);
    border-bottom: 1px solid var(--okd-table-cell-bordered-color);
    color: var(--okd-color-gray-900);
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    padding-bottom: 8px;
    padding-top: 8px;
  }
}

.index_tableContainer__1VemK .index_headerIcon__SI5EF {
  align-items: center;
  -webkit-column-gap: 2px;
  -moz-column-gap: 2px;
  column-gap: 2px;
  display: flex;
  justify-content: flex-end;
}

@media (min-width: 768px) {
  .index_tableContainer__1VemK .index_headerIcon__SI5EF {
    -webkit-column-gap: 4px;
    -moz-column-gap: 4px;
    column-gap: 4px;
  }
}

.index_tableContainer__1VemK .index_rowIcon__LGCw9 {
  align-items: center;
  display: flex;
}

.index_tableContainer__1VemK .index_accountCell__7FXQR {
  padding: 26px 0;
}

@media (min-width: 768px) {
  .index_tableContainer__1VemK .index_accountCell__7FXQR {
    padding: 12px 8px;
    padding-left: 24px;
  }
}

.index_tableContainer__1VemK .index_dateCell__KGq6z {
  padding: 26px 8px;
}

@media (min-width: 768px) {
  .index_tableContainer__1VemK .index_dateCell__KGq6z {
    padding: 12px 8px;
  }
}

.index_tableContainer__1VemK .index_statusCell__TmatH {
  padding: 26px 0;
}

@media (min-width: 768px) {
  .index_tableContainer__1VemK .index_statusCell__TmatH {
    padding: 12px 8px;
    padding-right: 24px;
  }
}

.index_tableContainer__1VemK tbody tr:last-child .index_accountCell__7FXQR,
.index_tableContainer__1VemK tbody tr:last-child .index_dateCell__KGq6z,
.index_tableContainer__1VemK tbody tr:last-child .index_statusCell__TmatH {
  padding-bottom: 0;
}

@media (min-width: 768px) {

  .index_tableContainer__1VemK tbody tr:last-child .index_accountCell__7FXQR,
  .index_tableContainer__1VemK tbody tr:last-child .index_dateCell__KGq6z,
  .index_tableContainer__1VemK tbody tr:last-child .index_statusCell__TmatH {
    padding-bottom: 12px;
  }
}

.index_invalidText__DAx32 {
  -webkit-text-decoration-style: dotted;
  text-decoration-style: dotted;
}

.index_claimRewardText__qPnp6,
.index_invalidText__DAx32 {
  cursor: pointer;
  -webkit-text-decoration-line: underline;
  text-decoration-line: underline;
}

.index_pagination__sMOKJ {
  margin-top: 16px;
}

@media (min-width: 768px) {
  .index_tableContainer__1VemK {
    margin-top: 40px;
  }

  .index_pagination__sMOKJ {
    margin-top: 24px;
  }
}

.index_container__Ze\+I- {
  padding: 20px 8px 60px;
}

@media (min-width: 768px) {
  .index_container__Ze\+I- {
    padding-left: 12px;
    padding-right: 12px;
  }
}

@media (min-width: 1024px) {
  .index_container__Ze\+I- {
    padding-left: calc(50% - 480px);
    padding-right: calc(50% - 480px);
  }
}

@media (min-width: 1270px) {
  .index_container__Ze\+I- {
    padding-left: calc(50% - 624px);
    padding-right: calc(50% - 624px);
  }
}

@media (max-width: 767px) {
  .index_wrapper__nZ4oL {
    box-sizing: border-box;
    padding-left: 8px;
    padding-right: 8px;
    width: 100%;
  }
}

@media (min-width: 768px) {
  .index_wrapper__nZ4oL {
    box-sizing: border-box;
    margin-left: 8.33333333%;
    padding-left: 12px;
    padding-right: 12px;
    width: 83.33333333%;
  }
}

.index_ruleTitle__LK1X7 {
  font-size: 18px;
  font-weight: 700;
  line-height: 24px;
  margin-bottom: 16px;
}

.index_ruleDescription__G224T {
  color: var(--okd-color-gray-700);
  font-size: 12px;
  font-weight: 400;
  line-height: 20px;
  white-space: pre-line;
}

.index_ruleDescription__G224T a {
  color: var(--okd-color-blue-700);
}

@media (min-width: 768px) {
  .index_container__Ze\+I- {
    padding-bottom: 80px;
    padding-top: 40px;
  }

  .index_ruleTitle__LK1X7 {
    font-size: 24px;
    line-height: 136%;
    margin-bottom: 32px;
  }

  .index_ruleDescription__G224T {
    font-size: 14px;
    line-height: 22px;
  }
}

@media (min-width: 1270px) {
  .index_container__Ze\+I- {
    padding-bottom: 136px;
  }
}