/* global */
@font-face {
    font-family: "Sukhumvit Set";
    src: url("../fonts/SukhumvitSet-Bold.eot");
    src: url("../fonts/SukhumvitSet-Bold.eot?#iefix") format("embedded-opentype"),
      url("../fonts/SukhumvitSet-Bold.woff2") format("woff2"),
      url("../fonts/SukhumvitSet-Bold.woff") format("woff"),
      url("../fonts/SukhumvitSet-Bold.ttf") format("truetype"),
      url("../fonts/SukhumvitSet-Bold.svg#SukhumvitSet-Bold") format("svg");
    font-weight: bold;
    font-style: normal;
  }
  @font-face {
    font-family: "Sukhumvit Set";
    src: url("../fonts/SukhumvitSet-Medium.eot");
    src: url("../fonts/SukhumvitSet-Medium.eot?#iefix")
        format("embedded-opentype"),
      url("../fonts/SukhumvitSet-Medium.woff2") format("woff2"),
      url("../fonts/SukhumvitSet-Medium.woff") format("woff"),
      url("../fonts/SukhumvitSet-Medium.ttf") format("truetype"),
      url("../fonts/SukhumvitSet-Medium.svg#SukhumvitSet-Medium") format("svg");
    font-weight: 500;
    font-style: normal;
  }
  @font-face {
    font-family: "Sukhumvit Set";
    src: url("../fonts/SukhumvitSet-Light.eot");
    src: url("../fonts/SukhumvitSet-Light.eot?#iefix") format("embedded-opentype"),
      url("../fonts/SukhumvitSet-Light.woff2") format("woff2"),
      url("../fonts/SukhumvitSet-Light.woff") format("woff"),
      url("../fonts/SukhumvitSet-Light.ttf") format("truetype"),
      url("../fonts/SukhumvitSet-Light.svg#SukhumvitSet-Light") format("svg");
    font-weight: 300;
    font-style: normal;
  }
  @font-face {
    font-family: "Sukhumvit Set";
    src: url("../fonts/SukhumvitSet-Thin.eot");
    src: url("../fonts/SukhumvitSet-Thin.eot?#iefix") format("embedded-opentype"),
      url("../fonts/SukhumvitSet-Thin.woff2") format("woff2"),
      url("../fonts/SukhumvitSet-Thin.woff") format("woff"),
      url("../fonts/SukhumvitSet-Thin.ttf") format("truetype"),
      url("../fonts/SukhumvitSet-Thin.svg#SukhumvitSet-Thin") format("svg");
    font-weight: 100;
    font-style: normal;
  }
  @font-face {
    font-family: "Sukhumvit Set";
    src: url("../fonts/SukhumvitSet-SemiBold.eot");
    src: url("../fonts/SukhumvitSet-SemiBold.eot?#iefix")
        format("embedded-opentype"),
      url("../fonts/SukhumvitSet-SemiBold.woff2") format("woff2"),
      url("../fonts/SukhumvitSet-SemiBold.woff") format("woff"),
      url("../fonts/SukhumvitSet-SemiBold.ttf") format("truetype"),
      url("../fonts/SukhumvitSet-SemiBold.svg#SukhumvitSet-SemiBold")
        format("svg");
    font-weight: 600;
    font-style: normal;
  }
  @font-face {
    font-family: "Sukhumvit Tadmai";
    src: url("../fonts/SukhumvitTadmai-Heavy.eot");
    src: url("../fonts/SukhumvitTadmai-Heavy.eot?#iefix")
        format("embedded-opentype"),
      url("../fonts/SukhumvitTadmai-Heavy.woff2") format("woff2"),
      url("../fonts/SukhumvitTadmai-Heavy.woff") format("woff"),
      url("../fonts/SukhumvitTadmai-Heavy.ttf") format("truetype"),
      url("../fonts/SukhumvitTadmai-Heavy.svg#SukhumvitTadmai-Heavy")
        format("svg");
    font-weight: 800;
    font-style: normal;
  }
  @font-face {
    font-family: "Sukhumvit Tadmai";
    src: url("../fonts/SukhumvitTadmai-ExtraBold.eot");
    src: url("../fonts/SukhumvitTadmai-ExtraBold.eot?#iefix")
        format("embedded-opentype"),
      url("../fonts/SukhumvitTadmai-ExtraBold.woff2") format("woff2"),
      url("../fonts/SukhumvitTadmai-ExtraBold.woff") format("woff"),
      url("../fonts/SukhumvitTadmai-ExtraBold.ttf") format("truetype"),
      url("../fonts/SukhumvitTadmai-ExtraBold.svg#SukhumvitTadmai-ExtraBold")
        format("svg");
    font-weight: bold;
    font-style: normal;
  }
  
  body {
    font-family: "Sukhumvit Set";
    background-color: #aed5fd;
  }
  img {
    max-width: 100%;
  }
  
  /*** header start ***/
  header .head-wrapper {
    background: rgb(25, 91, 214);
    background: -moz-linear-gradient(
      180deg,
      rgba(25, 91, 214, 1) 1.23%,
      rgba(38, 131, 239, 1) 98.77%
    );
    background: -webkit-linear-gradient(
      180deg,
      rgba(25, 91, 214, 1) 1.23%,
      rgba(38, 131, 239, 1) 98.77%
    );
    background: linear-gradient(
      180deg,
      rgba(25, 91, 214, 1) 1.23%,
      rgba(38, 131, 239, 1) 98.77%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#195bd6",endColorstr="#2683ef",GradientType=1);
  }
  header .head-wrapper .head-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 64px;
    padding-left: 5px;
    padding-right: 21px;
  }
  header .head-wrapper .head-inner .head-left,
  header .head-wrapper .head-inner .head-right {
    display: inline-flex;
    align-items: center;
  }
  header .head-wrapper .head-inner .head-right > div:not(:last-child) {
    margin-right: 15px;
  }
  header .head-wrapper .head-inner .head-center .menu-list {
    display: inline-flex;
    gap: 1px;
  }
  header .head-wrapper .head-inner .head-center .menu-list .menu-item {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    position: relative;
    min-width: 80px;
    height: 30px;
    border-radius: 4px;
    padding: 0 10px;
  }
  header .head-wrapper .head-inner .head-center .menu-list .menu-item:hover {
    background: #ffffff;
  }
  header .head-wrapper .head-inner .head-center .menu-list .menu-item a {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #ffffff;
    font-size: 12px;
    font-weight: 500;
    line-height: normal;
    text-decoration: none;
  }
  header .head-wrapper .head-inner .head-center .menu-list .menu-item:hover a {
    color: #195bd6;
  }
  header
    .head-wrapper
    .head-inner
    .head-center
    .menu-list
    .menu-item:not(:last-child)
    a::after {
    content: "";
    position: absolute;
    top: 50%;
    right: -1px;
    transform: translate(0, -50%);
    width: 1px;
    height: 13px;
    background: #4c9bf7;
  }
  header .head-wrapper .head-inner .head-center .menu-list .menu-item a .mn-icon {
    width: 15px;
    height: 15px;
  }
  header
    .head-wrapper
    .head-inner
    .head-center
    .menu-list
    .menu-item
    a
    .mn-icon.mn-home {
    background: url("../image/icon/icon-home.svg") no-repeat center / contain;
  }
  header
    .head-wrapper
    .head-inner
    .head-center
    .menu-list
    .menu-item
    a
    .mn-icon.mn-lotto {
    background: url("../image/icon/icon-lotto-4.svg") no-repeat center / contain;
  }
  header
    .head-wrapper
    .head-inner
    .head-center
    .menu-list
    .menu-item
    a
    .mn-icon.mn-money-bag {
    background: url("../image/icon/icon-money-bag-3.svg") no-repeat center /
      contain;
  }
  header
    .head-wrapper
    .head-inner
    .head-center
    .menu-list
    .menu-item
    a
    .mn-icon.mn-prize {
    background: url("../image/icon/icon-promotion-2.svg") no-repeat center /
      contain;
  }
  header
    .head-wrapper
    .head-inner
    .head-center
    .menu-list
    .menu-item
    a
    .mn-icon.mn-telephone {
    background: url("../image/icon/icon-telephone-2.svg") no-repeat center /
      contain;
  }
  header
    .head-wrapper
    .head-inner
    .head-center
    .menu-list
    .menu-item:hover
    a
    .mn-icon.mn-home {
    background: #195bd6;
    mask: url("../image/icon/icon-home.svg") no-repeat center / contain;
    -webkit-mask: url("../image/icon/icon-home.svg") no-repeat center / contain;
  }
  header
    .head-wrapper
    .head-inner
    .head-center
    .menu-list
    .menu-item:hover
    a
    .mn-icon.mn-lotto {
    background: #195bd6;
    mask: url("../image/icon/icon-lotto-4.svg") no-repeat center / contain;
    -webkit-mask: url("../image/icon/icon-lotto-4.svg") no-repeat center / contain;
  }
  header
    .head-wrapper
    .head-inner
    .head-center
    .menu-list
    .menu-item:hover
    a
    .mn-icon.mn-money-bag {
    background: #195bd6;
    mask: url("../image/icon/icon-money-bag-3.svg") no-repeat center / contain;
    -webkit-mask: url("../image/icon/icon-money-bag-3.svg") no-repeat center /
      contain;
  }
  header
    .head-wrapper
    .head-inner
    .head-center
    .menu-list
    .menu-item:hover
    a
    .mn-icon.mn-prize {
    background: #195bd6;
    mask: url("../image/icon/icon-promotion-2.svg") no-repeat center / contain;
    -webkit-mask: url("../image/icon/icon-promotion-2.svg") no-repeat center /
      contain;
  }
  header
    .head-wrapper
    .head-inner
    .head-center
    .menu-list
    .menu-item:hover
    a
    .mn-icon.mn-telephone {
    background: #195bd6;
    mask: url("../image/icon/icon-telephone-2.svg") no-repeat center / contain;
    -webkit-mask: url("../image/icon/icon-telephone-2.svg") no-repeat center /
      contain;
  }
  @media (min-width: 1200px) {
    header .head-wrapper .head-inner {
      padding-right: 5px;
    }
  }
  
  /* logo */
  .logo {
    width: 126px;
    height: 49.62px;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
  }
  
  /* rules */
  .rules a {
    color: #ffffff;
    font-size: 13px;
    font-weight: 500;
    line-height: normal;
    text-decoration: none;
  }
  .rules img {
    width: 21px;
    height: 21px;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
    margin-right: 3px;
  }
  @media (min-width: 1200px) {
    .rules a {
      font-size: 15px;
    }
  }
  
  /* signin-login */
  .signin-or-login {
    gap: 15px;
  }
  .signin-or-login .btn-custom {
    display: inline-flex;
    justify-content: center;
    gap: 10px;
    min-width: 136px;
    font-family: "Sukhumvit Tadmai";
    font-size: 16px;
    font-weight: bold;
    line-height: 22px;
    text-decoration: none;
    border-radius: 4px;
    border: none;
    box-shadow: 0px -2px 0px 0px rgba(0, 0, 0, 0.12) inset,
      0px 1px 2.8px -1px rgba(106, 106, 106, 0.4);
    padding: 10px 10px;
    cursor: pointer;
  }
  .signin-or-login .btn-custom.btn-cus-green {
    background: rgb(4, 184, 78);
    background: -moz-linear-gradient(
      90deg,
      rgba(4, 184, 78, 1) 0%,
      rgba(6, 199, 85, 1) 100%
    );
    background: -webkit-linear-gradient(
      90deg,
      rgba(4, 184, 78, 1) 0%,
      rgba(6, 199, 85, 1) 100%
    );
    background: linear-gradient(
      90deg,
      rgba(4, 184, 78, 1) 0%,
      rgba(6, 199, 85, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#04b84e",endColorstr="#06c755",GradientType=1);
    color: #ffffff;
  }
  .signin-or-login .btn-custom.btn-cus-gold {
    background: rgb(182, 130, 18);
    background: -moz-linear-gradient(
      90deg,
      rgba(182, 130, 18, 1) 0%,
      rgba(219, 186, 79, 1) 30%,
      rgba(244, 222, 121, 1) 50%,
      rgba(215, 180, 88, 1) 70%,
      rgba(193, 149, 60, 1) 100%
    );
    background: -webkit-linear-gradient(
      90deg,
      rgba(182, 130, 18, 1) 0%,
      rgba(219, 186, 79, 1) 30%,
      rgba(244, 222, 121, 1) 50%,
      rgba(215, 180, 88, 1) 70%,
      rgba(193, 149, 60, 1) 100%
    );
    background: linear-gradient(
      90deg,
      rgba(182, 130, 18, 1) 0%,
      rgba(219, 186, 79, 1) 30%,
      rgba(244, 222, 121, 1) 50%,
      rgba(215, 180, 88, 1) 70%,
      rgba(193, 149, 60, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#b68212",endColorstr="#c1953c",GradientType=1);
    color: #195dd7;
  }
  
  /* credit balance */
  .credit-balance {
    display: flex;
    align-items: center;
    width: 156px;
    border-radius: 500px;
    border: 2px solid rgba(255, 255, 255, 0.2);
    overflow: hidden;
  }
  .credit-balance .credit-balance-inner {
    display: inline-flex;
    align-items: center;
    flex: 1 0 auto;
    gap: 4px;
    background: #ffffff;
    padding: 3px;
  }
  .credit-balance .credit-balance-inner img {
    width: 24px;
    height: 24px;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
  }
  .credit-balance .credit-balance-inner span {
    color: #195bd6;
    font-size: 16px;
    font-weight: 700;
    line-height: 14px;
  }
  
  /* burger menu */
  #burger-menu {
    width: 30px;
    height: 25px;
    position: relative;
    z-index: 1;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: 0.5s ease-in-out;
    -moz-transition: 0.5s ease-in-out;
    -o-transition: 0.5s ease-in-out;
    transition: 0.5s ease-in-out;
    cursor: pointer;
  }
  #burger-menu span {
    display: block;
    position: absolute;
    z-index: 4;
    width: 100%;
    height: 5px;
    background: #ffffff;
    border-radius: 500px;
    opacity: 1;
    left: 0;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: 0.25s ease-in-out;
    -moz-transition: 0.25s ease-in-out;
    -o-transition: 0.25s ease-in-out;
    transition: 0.25s ease-in-out;
  }
  #burger-menu span:nth-child(1) {
    top: 0px;
    -webkit-transform-origin: left center;
    -moz-transform-origin: left center;
    -o-transform-origin: left center;
    transform-origin: left center;
  }
  #burger-menu span:nth-child(2) {
    top: 10px;
    -webkit-transform-origin: left center;
    -moz-transform-origin: left center;
    -o-transform-origin: left center;
    transform-origin: left center;
  }
  #burger-menu span:nth-child(3) {
    top: 20px;
    -webkit-transform-origin: left center;
    -moz-transform-origin: left center;
    -o-transform-origin: left center;
    transform-origin: left center;
  }
  #burger-menu.open span {
    background: #d03333;
  }
  #burger-menu.open span:nth-child(1) {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    top: 0px;
    left: 5px;
  }
  #burger-menu.open span:nth-child(2) {
    width: 0%;
    opacity: 0;
  }
  #burger-menu.open span:nth-child(3) {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
    top: 21px;
    left: 5px;
  }
  #burger-menu .burger-open {
    width: 51px;
    height: 58px;
    position: absolute;
    top: -12px;
    right: -11px;
    z-index: 2;
    background: #ffffff;
    border-bottom: none;
    box-shadow: 0px 4px 4px 0px #00000040;
    -webkit-border-top-left-radius: 4px;
    -webkit-border-top-right-radius: 4px;
    -moz-border-radius-topleft: 4px;
    -moz-border-radius-topright: 4px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    opacity: 0;
    visibility: hidden;
    transition: visibility 0.3s linear, opacity 0.3s linear;
  }
  #burger-menu.open .burger-open {
    opacity: 1;
    visibility: visible;
  }
  #burger-menu .burger-lists {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 300px;
    position: absolute;
    top: 45px;
    right: -32px;
    z-index: 2;
    background: #ffffff;
    border-radius: 4px;
    box-shadow: 0px 4px 4px 0px #00000040;
    opacity: 0;
    visibility: hidden;
    transition: visibility 0.3s linear, opacity 0.3s linear;
    padding: 35px 0;
  }
  #burger-menu.open .burger-lists {
    opacity: 1;
    visibility: visible;
  }
  #burger-menu .burger-lists ul {
    display: flex;
    flex-direction: column;
    list-style: none;
    width: 100%;
    border-top: 1px solid #d9d9d9;
    padding: 0;
    margin: 0;
  }
  #burger-menu .burger-lists ul li a {
    display: inline-flex;
    align-items: center;
    width: 100%;
    min-height: 60px;
    color: #1e1e1e;
    font-size: 24px;
    font-weight: 600;
    line-height: 14px;
    text-decoration: none;
    border-bottom: 1px solid #d9d9d9;
    padding: 0 20px;
  }
  #burger-menu .burger-lists ul li:hover a {
    background: rgb(25, 91, 214);
    background: -moz-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: -webkit-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#195bd6",endColorstr="#2683ef",GradientType=1);
    color: #ffffff;
    font-family: "Sukhumvit Tadmai";
    font-weight: 700;
  }
  #burger-menu .burger-lists ul li .burger-icon {
    width: 33px;
    height: 36px;
    margin-right: 15px;
  }
  #burger-menu .burger-lists ul li .burger-icon.icon-information {
    background: url("../image/icon/icon-information.svg") no-repeat center /
      contain;
  }
  #burger-menu .burger-lists ul li .burger-icon.icon-history {
    background: url("../image/icon/icon-history.svg") no-repeat center / contain;
  }
  #burger-menu .burger-lists ul li .burger-icon.icon-promotion {
    background: url("../image/icon/icon-promotion.svg") no-repeat center / contain;
  }
  #burger-menu .burger-lists ul li .burger-icon.icon-invite {
    background: url("../image/icon/icon-invite.svg") no-repeat center / contain;
  }
  #burger-menu .burger-lists ul li:hover .burger-icon.icon-information {
    background: #ffffff;
    mask: url("../image/icon/icon-information.svg") no-repeat center / contain;
    -webkit-mask: url("../image/icon/icon-information.svg") no-repeat center /
      contain;
  }
  #burger-menu .burger-lists ul li:hover .burger-icon.icon-history {
    background: #ffffff;
    mask: url("../image/icon/icon-history.svg") no-repeat center / contain;
    -webkit-mask: url("../image/icon/icon-history.svg") no-repeat center / contain;
  }
  #burger-menu .burger-lists ul li:hover .burger-icon.icon-promotion {
    background: #ffffff;
    mask: url("../image/icon/icon-promotion.svg") no-repeat center / contain;
    -webkit-mask: url("../image/icon/icon-promotion.svg") no-repeat center /
      contain;
  }
  #burger-menu .burger-lists ul li:hover .burger-icon.icon-invite {
    background: #ffffff;
    mask: url("../image/icon/icon-invite.svg") no-repeat center / contain;
    -webkit-mask: url("../image/icon/icon-invite.svg") no-repeat center / contain;
  }
  #burger-menu .burger-lists .burger-logout {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    min-width: 240px;
    height: 60px;
    background: rgb(218, 35, 35);
    background: -moz-linear-gradient(
      270deg,
      rgba(218, 35, 35, 1) 0%,
      rgba(178, 13, 13, 1) 100%
    );
    background: -webkit-linear-gradient(
      270deg,
      rgba(218, 35, 35, 1) 0%,
      rgba(178, 13, 13, 1) 100%
    );
    background: linear-gradient(
      270deg,
      rgba(218, 35, 35, 1) 0%,
      rgba(178, 13, 13, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#da2323",endColorstr="#b20d0d",GradientType=1);
    color: #ffffff;
    font-size: 24px;
    font-weight: 700;
    line-height: 14px;
    text-decoration: none;
    border-radius: 4px;
    margin-top: 35px;
  }
  #burger-menu .burger-lists .burger-logout .icon-logout {
    width: 27px;
    height: 27px;
    background: url("../image/icon/icon-logout.svg") no-repeat center / contain;
    margin-right: 10px;
  }
  /*** header end ***/
  
  /*** body start ***/
  .over-body-wrapper {
    max-width: 940px;
    background: rgb(76, 155, 247);
    background: -moz-linear-gradient(
      180deg,
      rgba(76, 155, 247, 1) 0%,
      rgba(218, 239, 255, 1) 70%,
      rgba(231, 243, 255, 1) 87%
    );
    background: -webkit-linear-gradient(
      180deg,
      rgba(76, 155, 247, 1) 0%,
      rgba(218, 239, 255, 1) 70%,
      rgba(231, 243, 255, 1) 87%
    );
    background: linear-gradient(
      180deg,
      rgba(76, 155, 247, 1) 0%,
      rgba(218, 239, 255, 1) 70%,
      rgba(231, 243, 255, 1) 87%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#4c9bf7",endColorstr="#e7f3ff",GradientType=1);
    margin-left: auto;
    margin-right: auto;
  }
  .over-body-wrapper.re-width {
    max-width: none;
  }
  .body-wrapper {
    min-height: 100vh;
    background-image: url("../image/background/bg-body-2.svg");
    background-repeat: no-repeat;
    background-position: top left;
    background-size: contain;
  }
  .bule-head {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    background: #f7fbff;
    color: #195bd6;
    font-family: "Sukhumvit Tadmai";
    font-size: 22px;
    font-weight: 700;
    line-height: 26px;
    text-align: center;
    border-radius: 4px;
    padding: 7px 44px;
    margin: 20px 0 10px;
  }
  .bule-head a {
    position: absolute;
    top: 5px;
    left: 5px;
    display: flex;
  }
  .bule-head img {
    width: 34px;
    height: 30px;
  }
  .red-card {
    padding-top: 100%;
    background: #d33737;
    border-radius: 4px;
    filter: drop-shadow(0px 4px 14.8px rgba(37, 113, 184, 0.2));
    overflow: hidden;
  }
  .red-card-2 {
    border-radius: 4px;
    filter: drop-shadow(0px 4px 14.8px rgba(37, 113, 184, 0.2));
    overflow: hidden;
  }
  .red-card-2 img {
    width: 100%;
  }
  .custom-popover {
    max-width: 196px;
    border-radius: 4px;
    border: none;
    filter: drop-shadow(0px 4px 14.8px rgba(37, 113, 184, 0.2));
  }
  .custom-popover .popover-arrow::before {
    border-top-color: transparent !important;
  }
  .custom-popover .popover-header {
    background-color: transparent;
    color: #195bd6;
    font-family: "Sukhumvit Set";
    font-size: 18px;
    font-weight: 700;
    line-height: 24px;
    border: none;
    padding: 15px 15px 2px;
  }
  .custom-popover .popover-header::before {
    border-bottom: none;
  }
  .custom-popover .popover-body {
    color: #797979;
    font-family: "Sukhumvit Set";
    font-size: 12px;
    font-weight: 700;
    line-height: 18px;
    padding: 0 15px 15px;
  }
  .user-id {
    display: inline-flex;
    align-items: baseline;
    gap: 3px;
    flex: 0 0 auto;
    position: relative;
    height: 20px;
    background: #ffffff;
    color: #797979;
    font-size: 10px;
    font-weight: 600;
    line-height: 14px;
    border-radius: 14px;
    overflow: hidden;
    padding: 3px 13px 3px 26px;
  }
  .user-id span {
    color: #195bd6;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .user-id img {
    position: absolute;
    top: -1px;
    left: 0;
  }
  .balance-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    overflow: hidden;
    border-radius: 4px;
    margin-bottom: 10px;
  }
  .balance-box .balance-now {
    width: 100%;
    background: rgb(25, 91, 214);
    background: -moz-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 2.62%,
      rgba(38, 131, 239, 1) 97.81%
    );
    background: -webkit-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 2.62%,
      rgba(38, 131, 239, 1) 97.81%
    );
    background: linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 2.62%,
      rgba(38, 131, 239, 1) 97.81%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#195bd6",endColorstr="#2683ef",GradientType=1);
    padding: 8px 20px 5px;
  }
  .balance-box .balance-now .user-credit {
    display: flex;
    justify-content: center;
    align-items: baseline;
    gap: 8px;
    color: #ffffff;
    font-size: 50px;
    font-weight: 700;
    line-height: 40px;
    margin: 10px 0 5px;
  }
  .balance-box .balance-now .user-credit span {
    font-size: 40px;
  }
  .balance-box .balance-now .balance-tex {
    color: #ffffff;
    font-size: 10px;
    font-weight: 700;
    line-height: 14px;
  }
  .balance-box .balance-note {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    column-gap: 5px;
    width: 100%;
    background: #f0f8ff;
    color: #1e1e1e;
    font-size: 10px;
    font-weight: 600;
    line-height: 14px;
    padding: 8px 55px;
  }
  .balance-box .balance-note .b-note {
    color: #195bd6;
    font-weight: 700;
  }
  .balance-box .balance-note .g-note {
    color: #06c755;
    font-weight: 700;
  }
  .deposit-withdraw-btn {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 10px;
  }
  .deposit-withdraw-btn .btn-custom {
    display: inline-flex;
    justify-content: center;
    flex: 0 1 100%;
    gap: 10px;
    font-size: 20px;
    font-weight: bold;
    line-height: normal;
    text-decoration: none;
    border-radius: 4px;
    border: none;
    box-shadow: 0px -2px 0px 0px rgba(0, 0, 0, 0.12) inset,
      0px 1px 2.8px -1px rgba(106, 106, 106, 0.4);
    padding: 10px 10px;
    cursor: pointer;
  }
  .deposit-withdraw-btn .btn-custom.btn-cus-green {
    background: rgb(4, 184, 78);
    background: -moz-linear-gradient(
      90deg,
      rgba(4, 184, 78, 1) 0%,
      rgba(6, 199, 85, 1) 100%
    );
    background: -webkit-linear-gradient(
      90deg,
      rgba(4, 184, 78, 1) 0%,
      rgba(6, 199, 85, 1) 100%
    );
    background: linear-gradient(
      90deg,
      rgba(4, 184, 78, 1) 0%,
      rgba(6, 199, 85, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#04b84e",endColorstr="#06c755",GradientType=1);
    color: #ffffff;
  }
  .deposit-withdraw-btn .btn-custom.btn-cus-red {
    background: rgb(218, 35, 35);
    background: -moz-linear-gradient(
      270deg,
      rgba(218, 35, 35, 1) 0%,
      rgba(178, 13, 13, 1) 100%
    );
    background: -webkit-linear-gradient(
      270deg,
      rgba(218, 35, 35, 1) 0%,
      rgba(178, 13, 13, 1) 100%
    );
    background: linear-gradient(
      270deg,
      rgba(218, 35, 35, 1) 0%,
      rgba(178, 13, 13, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#da2323",endColorstr="#b20d0d",GradientType=1);
    color: #ffffff;
  }
  @media (min-width: 1200px) {
    .body-wrapper {
      background-image: url("../image/background/bg-body.svg");
    }
    .combo-box {
      background: rgb(25, 91, 214);
      background: -moz-linear-gradient(
        90deg,
        rgba(25, 91, 214, 1) 2.62%,
        rgba(38, 131, 239, 1) 97.81%
      );
      background: -webkit-linear-gradient(
        90deg,
        rgba(25, 91, 214, 1) 2.62%,
        rgba(38, 131, 239, 1) 97.81%
      );
      background: linear-gradient(
        90deg,
        rgba(25, 91, 214, 1) 2.62%,
        rgba(38, 131, 239, 1) 97.81%
      );
      filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#195bd6",endColorstr="#2683ef",GradientType=1);
      border-radius: 4px;
      margin-bottom: 10px;
    }
    .balance-box .balance-now {
      background: transparent;
    }
    .balance-box .balance-note {
      border-top-left-radius: 4px;
      border-top-right-radius: 4px;
    }
  }
  
  /* login */
  .login-wrapper {
    position: relative;
    background: rgb(25, 91, 214);
    background: -moz-linear-gradient(
      0deg,
      rgba(25, 91, 214, 1) 2.62%,
      rgba(38, 131, 239, 1) 97.81%
    );
    background: -webkit-linear-gradient(
      0deg,
      rgba(25, 91, 214, 1) 2.62%,
      rgba(38, 131, 239, 1) 97.81%
    );
    background: linear-gradient(
      0deg,
      rgba(25, 91, 214, 1) 2.62%,
      rgba(38, 131, 239, 1) 97.81%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#195bd6",endColorstr="#2683ef",GradientType=1);
    border-radius: 4px;
    padding: 30px 25px;
    margin: 20px 0 10px;
  }
  .login-wrapper .close-login {
    position: absolute;
    top: 20px;
    right: 20px;
    color: #ffffff;
    cursor: pointer;
  }
  .login-wrapper form {
    display: flex;
    flex-direction: column;
  }
  .login-wrapper .logo-expand {
    display: inline-flex;
    justify-content: center;
  }
  .login-wrapper .logo-expand img {
    width: 254px;
    height: 100px;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
  }
  .login-wrapper .login-title {
    color: #ffffff;
    font-family: "Sukhumvit Tadmai";
    font-size: 25px;
    font-weight: bold;
    line-height: 14px;
    text-align: center;
    padding: 10px 10px;
    margin: 5px 0;
  }
  .login-wrapper .input-text {
    color: #ffffff;
    font-size: 16px;
    font-weight: 600;
    line-height: normal;
  }
  .login-wrapper form .input-box {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    position: relative;
    align-self: stretch;
    margin-bottom: 15px;
  }
  .login-wrapper form input[type="text"],
  .login-wrapper form input[type="password"] {
    color: #797979;
    width: 100%;
    height: 50px;
    border-radius: 4px;
    border: 1px solid #a9d1ff;
    outline: none;
    padding: 6px 45px 6px 42px;
  }
  .login-wrapper form input#login-phone {
    background: url("../image/icon/input-phone.svg") #ffffff no-repeat 15px / 22px
      22px;
  }
  .login-wrapper form input#login-password {
    background: url("../image/icon/input-password.svg") #ffffff no-repeat 15px /
      22px 22px;
  }
  .login-wrapper form input#login-password-in-desktop {
    background: url("../image/icon/input-password.svg") #ffffff no-repeat 15px /
      22px 22px;
  }
  .login-wrapper form input#login-password-in-mobile {
    background: url("../image/icon/input-password.svg") #ffffff no-repeat 15px /
      22px 22px;
  }
  .login-wrapper form #eye-toggle {
    position: absolute;
    right: 15px;
    width: 20px;
    height: 20px;
    background: url("../image/icon/pwd-invisible.svg") #ffffff no-repeat center /
      cover;
    cursor: pointer;
  }
  .login-wrapper form #eye-toggle.eye {
    width: 20px;
    height: 20px;
    background: url("../image/icon/pwd-eye.svg") #ffffff no-repeat center / cover;
  }
  .login-wrapper form .btn-box {
    display: inline-flex;
    margin-bottom: 15px;
  }
  .login-wrapper form .btn-box.more-btn {
    justify-content: space-between;
    gap: 10px;
  }
  .login-wrapper form .btn-custom {
    display: inline-flex;
    justify-content: center;
    flex: 0 1 100%;
    gap: 10px;
    font-family: "Sukhumvit Tadmai";
    font-size: 18px;
    font-weight: bold;
    line-height: normal;
    text-decoration: none;
    border-radius: 4px;
    border: none;
    box-shadow: 0px -2px 0px 0px rgba(0, 0, 0, 0.12) inset,
      0px 1px 2.8px -1px rgba(106, 106, 106, 0.4);
    padding: 10px 10px;
    cursor: pointer;
  }
  .login-wrapper form .btn-custom.btn-cus-green {
    background: rgb(4, 184, 78);
    background: -moz-linear-gradient(
      90deg,
      rgba(4, 184, 78, 1) 0%,
      rgba(6, 199, 85, 1) 100%
    );
    background: -webkit-linear-gradient(
      90deg,
      rgba(4, 184, 78, 1) 0%,
      rgba(6, 199, 85, 1) 100%
    );
    background: linear-gradient(
      90deg,
      rgba(4, 184, 78, 1) 0%,
      rgba(6, 199, 85, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#04b84e",endColorstr="#06c755",GradientType=1);
    color: #ffffff;
  }
  .login-wrapper form .btn-custom.btn-cus-green-light {
    background: #06c755;
    color: #ffffff;
  }
  .login-wrapper form .btn-custom.btn-cus-gold {
    background: rgb(239, 211, 105);
    background: -moz-linear-gradient(
      90deg,
      rgba(239, 211, 105, 1) 0%,
      rgba(255, 247, 145, 1) 25%,
      rgba(239, 191, 93, 1) 50%,
      rgba(255, 247, 145, 1) 75%,
      rgba(239, 211, 105, 1) 100%
    );
    background: -webkit-linear-gradient(
      90deg,
      rgba(239, 211, 105, 1) 0%,
      rgba(255, 247, 145, 1) 25%,
      rgba(239, 191, 93, 1) 50%,
      rgba(255, 247, 145, 1) 75%,
      rgba(239, 211, 105, 1) 100%
    );
    background: linear-gradient(
      90deg,
      rgba(239, 211, 105, 1) 0%,
      rgba(255, 247, 145, 1) 25%,
      rgba(239, 191, 93, 1) 50%,
      rgba(255, 247, 145, 1) 75%,
      rgba(239, 211, 105, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#efd369",endColorstr="#efd369",GradientType=1);
    color: #195dd7;
  }
  .login-wrapper form .btn-custom-2 {
    display: inline-flex;
    justify-content: center;
    color: #ffffff;
    font-size: 16px;
    font-weight: 500;
    line-height: normal;
    text-decoration: underline;
  }
  .login-wrapper form .btn-custom-2 img {
    width: 25px;
    height: 25px;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
  }
  
  /* register */
  .register-wrapper {
    position: relative;
    background: #ffffff;
    border-radius: 4px;
    padding: 30px 30px;
    margin: 20px 0;
    box-shadow: 0px 4px 14.8px -1px rgba(37, 113, 184, 0.2);
  }
  .register-wrapper .close-register {
    position: absolute;
    top: 20px;
    right: 20px;
    color: #195bd6;
    cursor: pointer;
  }
  .register-wrapper form {
    display: flex;
    flex-direction: column;
  }
  .register-wrapper .register-title {
    color: #195bd6;
    font-size: 20px;
    font-weight: 700;
    line-height: 14px;
    text-align: center;
    margin-bottom: 17px;
  }
  .register-wrapper .input-text {
    color: #797979;
    font-size: 16px;
    font-weight: 300;
    line-height: normal;
    margin-bottom: 8px;
  }
  .register-wrapper form .input-box {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    position: relative;
    align-self: stretch;
    margin-bottom: 8px;
  }
  .register-wrapper form input[type="text"],
  .register-wrapper form input[type="password"],
  .register-wrapper form select {
    color: #797979;
    width: 100%;
    height: 45px;
    border-radius: 4px;
    border: 1px solid #7ab7ff;
    outline: none;
    padding: 6px 45px 6px 42px;
  }
  .register-wrapper form select {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
  }
  .register-wrapper form .is-select::after {
    content: "";
    position: absolute;
    right: 15px;
    width: 17px;
    height: 17px;
    background: url("../image/icon/input-select-arrow.svg") no-repeat center /
      cover;
  }
  .register-wrapper form input#register-phone {
    background: url("../image/icon/input-phone-2.svg") #f0f7ff no-repeat 15px /
      17px 17px;
  }
  .register-wrapper form input#register-password {
    background: url("../image/icon/input-password-2.svg") #f0f7ff no-repeat 15px /
      17px 17px;
  }
  .register-wrapper form #eye-toggle {
    position: absolute;
    right: 15px;
    width: 17px;
    height: 17px;
    background: url("../image/icon/pwd-invisible-2.svg") #f0f7ff no-repeat center /
      cover;
    cursor: pointer;
  }
  .register-wrapper form #eye-toggle.eye {
    width: 17px;
    height: 17px;
    background: url("../image/icon/pwd-eye-2.svg") #f0f7ff no-repeat center /
      contain;
  }
  .register-wrapper form input#register-password-confirm {
    background: url("../image/icon/input-password-confirm.svg") #f0f7ff no-repeat
      15px / 17px 17px;
  }
  .register-wrapper form select#register-bank-select {
    background: url("../image/icon/input-bank.svg") #f0f7ff no-repeat 15px / 17px
      17px;
  }
  .register-wrapper form input#register-bank-account {
    background: url("../image/icon/input-bank-account.svg") #f0f7ff no-repeat 15px /
      17px 17px;
  }
  .register-wrapper form input#register-line {
    background: url("../image/icon/input-line-id.svg") #f0f7ff no-repeat 15px /
      17px 17px;
  }
  .register-wrapper form select#register-reference {
    background: url("../image/icon/input-reference.svg") #f0f7ff no-repeat 15px /
      17px 17px;
  }
  .register-wrapper form .input-note {
    background: #f2f2f2;
    color: #195bd6;
    font-size: 12px;
    font-weight: 300;
    line-height: 18px;
    text-align: center;
    border-radius: 4px;
    box-shadow: 0px 1px 3.5px -1px rgba(0, 0, 0, 0.16);
    padding: 10px 26px;
    margin-bottom: 8px;
  }
  .register-wrapper form .divider-box {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    margin-bottom: 8px;
  }
  .register-wrapper form .divider-box::before {
    content: "";
    position: absolute;
    top: 12px;
    left: 0;
    right: 0;
    z-index: 1;
    height: 2px;
    background: rgb(25, 91, 214);
    background: -moz-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: -webkit-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#195bd6",endColorstr="#2683ef",GradientType=1);
  }
  .register-wrapper form .divider-box .outter {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    position: relative;
    z-index: 2;
    background: rgb(25, 91, 214);
    background: -moz-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: -webkit-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#195bd6",endColorstr="#2683ef",GradientType=1);
    border-radius: 500px;
    padding: 2px 2px;
  }
  .register-wrapper form .divider-box .inner {
    background: #fff;
    color: #195bd6;
    font-size: 16px;
    font-weight: 700;
    line-height: 16px;
    text-align: center;
    border-radius: 500px;
    padding: 3px 20px;
  }
  .register-wrapper form .btn-box {
    display: inline-flex;
    margin-bottom: 8px;
  }
  .register-wrapper form .btn-custom {
    display: inline-flex;
    justify-content: center;
    flex: 0 1 100%;
    gap: 10px;
    font-family: "Sukhumvit Tadmai";
    font-size: 18px;
    font-weight: bold;
    line-height: normal;
    text-decoration: none;
    border-radius: 4px;
    border: none;
    box-shadow: 0px -2px 0px 0px rgba(0, 0, 0, 0.12) inset,
      0px 1px 2.8px -1px rgba(106, 106, 106, 0.4);
    padding: 10px 10px;
    cursor: pointer;
  }
  .register-wrapper form .btn-custom.btn-cus-green {
    background: #06c755;
    color: #ffffff;
  }
  .register-wrapper form .btn-custom.btn-cus-blue {
    background: rgb(25, 91, 214);
    background: -moz-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: -webkit-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#195bd6",endColorstr="#2683ef",GradientType=1);
    color: #ffffff;
  }
  
  /* welcom */
  .welcom-wrapper {
    display: flex;
    justify-content: center;
    background: #bcdbff;
    color: #195bd6;
    font-size: 13px;
    font-weight: 400;
    line-height: normal;
    border-radius: 4px;
    padding: 4px 4px;
    margin: 0 0 10px;
  }
  @media (min-width: 1200px) {
    .welcom-wrapper {
      margin: 0 0 0;
    }
  }
  
  /* banner */
  .full-banner {
    margin: 0 0 15px;
  }
  .step-banner {
    margin-bottom: 20px;
  }
  @media (min-width: 1200px) {
    .full-banner {
      margin: 10px 0 10px;
    }
  }
  
  /* logo set */
  .logo-box {
    margin-bottom: 10px;
  }
  .logo-box img {
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
    border-radius: 4px;
  }
  
  /* lotto set, lotto list */
  @media (min-width: 1200px) {
    .outter-static {
      border: 1px solid transparent;
    }
    .static-box {
      margin-top: 12px;
      margin-bottom: 12px;
    }
    .outter-scrolling {
      border-radius: 5px;
      border: 1px solid #ffffff;
    }
    .scrolling-box {
      max-height: 600px;
      overflow-y: scroll;
      margin-top: 12px;
      margin-bottom: 12px;
    }
    .scrolling-box::-webkit-scrollbar {
      display: none;
    }
  }
  
  /* lotto head */
  .lotto-head {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 45px;
    background: rgb(239, 211, 105);
    background: -moz-linear-gradient(
      90deg,
      rgba(239, 211, 105, 1) 0%,
      rgba(255, 247, 145, 1) 25%,
      rgba(239, 191, 93, 1) 50%,
      rgba(255, 247, 145, 1) 75%,
      rgba(239, 211, 105, 1) 100%
    );
    background: -webkit-linear-gradient(
      90deg,
      rgba(239, 211, 105, 1) 0%,
      rgba(255, 247, 145, 1) 25%,
      rgba(239, 191, 93, 1) 50%,
      rgba(255, 247, 145, 1) 75%,
      rgba(239, 211, 105, 1) 100%
    );
    background: linear-gradient(
      90deg,
      rgba(239, 211, 105, 1) 0%,
      rgba(255, 247, 145, 1) 25%,
      rgba(239, 191, 93, 1) 50%,
      rgba(255, 247, 145, 1) 75%,
      rgba(239, 211, 105, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#efd369",endColorstr="#efd369",GradientType=1);
    color: #195bd6;
    font-family: "Sukhumvit Tadmai";
    font-size: 18px;
    font-weight: bold;
    line-height: normal;
    border-radius: 4px;
    padding: 1px 1px;
    margin-bottom: 10px;
  }
  .lotto-head-2 {
    background: #bcdbff;
    border-radius: 4px;
    margin-bottom: 10px;
  }
  .lotto-head-2 .inner {
    display: flex;
    align-items: center;
    gap: 10px;
    height: 34px;
    color: #195bd6;
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
    padding: 0 10px;
  }
  .lotto-head-2 .inner img {
    width: 22px;
    height: 22px;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
  }
  .lotto-head-2 .inner img.expand {
    width: 28px;
    height: 28px;
  }
  
  /* lotto set */
  .lotto-set {
    margin-bottom: 10px;
  }
  .lotto-set .lotto-set-title {
    border-radius: 4px 4px 0px 0px;
    padding: 1px 1px;
    margin: -1px -1px;
  }
  .lotto-set .lotto-set-title .inner {
    display: flex;
    align-items: center;
    gap: 10px;
    height: 40px;
    border-radius: 3px 3px 0px 0px;
    padding: 0 10px;
  }
  .lotto-set .lotto-set-title .inner img {
    width: 24px;
    height: 24px;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
  }
  .lotto-set .lotto-set-title .inner .title {
    color: #ffffff;
    font-size: 18px;
    font-weight: bold;
    line-height: normal;
  }
  .lotto-set .lotto-set-title .inner .inner-sub {
    display: flex;
    flex-direction: column;
    margin-top: -6px;
  }
  .lotto-set .lotto-set-title .inner .inner-sub .title {
    line-height: 26px;
  }
  .lotto-set .lotto-set-title .inner .inner-sub .post-date {
    display: inline-flex;
  }
  .lotto-set .lotto-set-title .inner .inner-sub .post-date > span {
    height: 10px;
    background: #ffffff;
    font-size: 8px;
    font-weight: bold;
    line-height: 12px;
    letter-spacing: 0.5px;
    text-align: center;
    border-radius: 3px;
    padding: 0 6px;
  }
  .lotto-reward {
    padding: 10px 11px;
  }
  .lotto-reward .row-reward {
    margin-left: -5px;
    margin-right: -5px;
  }
  .lotto-reward .row-reward > * {
    padding-left: 5px;
    padding-right: 5px;
    margin-bottom: 4px;
  }
  .lotto-reward .reward-title {
    color: #797979;
    font-size: 10px;
    font-weight: 400;
    line-height: normal;
    text-align: center;
  }
  .lotto-reward .reward-number {
    height: 30px;
    background: #fff;
    color: #195bd6;
    font-family: "Sukhumvit Tadmai";
    font-size: 18px;
    font-weight: bold;
    line-height: 28px;
    text-align: center;
    text-overflow: ellipsis;
    overflow: hidden;
    border-radius: 4px;
    border: 1px solid #a9d1ff;
    -webkit-transition: all 0.25s ease-in-out;
    -moz-transition: all 0.25s ease-in-out;
    -o-transition: all 0.25s ease-in-out;
    transition: all 0.25s ease-in-out;
  }
  .lotto-reward .reward-number:hover {
    background: #bcdbff;
  }
  .lotto-reward-pack-small > .row-reward {
    margin-left: -4px;
    margin-right: -4px;
  }
  .lotto-reward-pack-small > .row-reward > * {
    padding-left: 4px;
    padding-right: 4px;
  }
  .lotto-set.set-1,
  .lotto-set.set-2,
  .lotto-set.set-3,
  .lotto-set.set-4 {
    background: #fff;
    border-radius: 4px;
    border: 1px solid #b0d6fd;
    box-shadow: 0px 4px 14.8px -1px rgba(37, 113, 184, 0.2);
  }
  .lotto-set.set-4 {
    margin-bottom: 8px;
  }
  .lotto-set.set-4 .lotto-set-title .inner {
    gap: 5px;
    height: 30px;
  }
  .lotto-set.set-4 .lotto-set-title .inner img {
    width: 20px;
    height: 20px;
  }
  .lotto-set.set-1 .lotto-set-title .inner .title,
  .lotto-set.set-2 .lotto-set-title .inner .title,
  .lotto-set.set-3 .lotto-set-title .inner .title {
    font-family: "Sukhumvit Tadmai";
  }
  .lotto-set.set-4 .lotto-set-title .inner .title {
    font-size: 16px;
    font-weight: 600;
    line-height: 16px;
  }
  .lotto-set.set-2 .lotto-set-title .inner .inner-sub .post-date > span {
    color: #ec008c;
  }
  .lotto-set.set-3 .lotto-set-title .inner .inner-sub .post-date > span {
    color: #1b954d;
  }
  .lotto-set.set-1 .lotto-set-title {
    background: rgb(38, 131, 239);
    background: -moz-linear-gradient(
      90deg,
      rgba(38, 131, 239, 1) 0%,
      rgba(25, 91, 214, 1) 100%
    );
    background: -webkit-linear-gradient(
      90deg,
      rgba(38, 131, 239, 1) 0%,
      rgba(25, 91, 214, 1) 100%
    );
    background: linear-gradient(
      90deg,
      rgba(38, 131, 239, 1) 0%,
      rgba(25, 91, 214, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#2683ef",endColorstr="#195bd6",GradientType=1);
  }
  .lotto-set.set-1 .lotto-set-title .inner {
    justify-content: center;
    background: rgb(25, 91, 214);
    background: -moz-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: -webkit-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#195bd6",endColorstr="#2683ef",GradientType=1);
  }
  .lotto-set.set-2 .lotto-set-title {
    background: #f651b3;
  }
  .lotto-set.set-2 .lotto-set-title .inner {
    background: rgb(236, 0, 140);
    background: -moz-linear-gradient(
      90deg,
      rgba(236, 0, 140, 1) 0%,
      rgba(248, 62, 172, 1) 100%
    );
    background: -webkit-linear-gradient(
      90deg,
      rgba(236, 0, 140, 1) 0%,
      rgba(248, 62, 172, 1) 100%
    );
    background: linear-gradient(
      90deg,
      rgba(236, 0, 140, 1) 0%,
      rgba(248, 62, 172, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ec008c",endColorstr="#f83eac",GradientType=1);
  }
  .lotto-set.set-3 .lotto-set-title {
    background: rgb(28, 151, 78);
    background: -moz-linear-gradient(
      90deg,
      rgba(28, 151, 78, 1) 0%,
      rgba(25, 142, 73, 1) 100%
    );
    background: -webkit-linear-gradient(
      90deg,
      rgba(28, 151, 78, 1) 0%,
      rgba(25, 142, 73, 1) 100%
    );
    background: linear-gradient(
      90deg,
      rgba(28, 151, 78, 1) 0%,
      rgba(25, 142, 73, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#1c974e",endColorstr="#198e49",GradientType=1);
  }
  .lotto-set.set-3 .lotto-set-title .inner {
    background: #1b954d;
  }
  .lotto-set.set-4 .lotto-set-title {
    background: #4c9bf7;
  }
  .lotto-set.set-4 .lotto-set-title .inner {
    background: rgb(25, 91, 214);
    background: -moz-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: -webkit-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#195bd6",endColorstr="#2683ef",GradientType=1);
  }
  
  /* lottery list */
  .lottery-list {
    background: #ffffff;
    border-radius: 4px;
    border: 1px solid #b0d6fd;
    box-shadow: 0px 4px 14.8px -1px #2571b833;
    margin-bottom: 60px;
  }
  .lottery-list ul {
    list-style: none;
    padding: 20px 0 30px;
    margin: 0;
  }
  .lottery-list ul li {
    display: flex;
    border-bottom: 1px solid #badaff;
    padding: 5px 10px;
  }
  .lottery-list ul li:first-child {
    border-bottom: none;
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .lottery-list ul li .lottery-round {
    display: inline-flex;
    flex: 0 1 50%;
    gap: 7px;
    color: #1e1e1e;
    font-size: 18px;
    font-weight: 600;
    line-height: 20px;
  }
  .lottery-list ul li .lottery-round img {
    width: 20px;
    height: 20px;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
  }
  .lottery-list ul li .lottery-3num,
  .lottery-list ul li .lottery-2num {
    display: inline-flex;
    justify-content: center;
    flex: 0 1 25%;
    color: #1e1e1e;
    font-size: 18px;
    font-weight: 600;
    line-height: 20px;
  }
  
  /* other */
  .other-box {
    margin-left: -5px;
    margin-right: -5px;
  }
  .other-box > * {
    padding-left: 5px;
    padding-right: 5px;
    margin-bottom: 10px;
  }
  .box-item a {
    display: block;
    text-decoration: none;
  }
  .box-item a img {
    border-radius: 4px;
  }
  
  /* deposit */
  .deposit-wrapper .deposit-tabs {
    margin-bottom: 10px;
  }
  .deposit-wrapper .deposit-tabs .deposit-select-tab {
    display: flex;
    gap: 10px;
  }
  .deposit-wrapper .deposit-tabs .deposit-select-tab .deposit-account {
    flex: 0 1 100%;
  }
  .deposit-wrapper .deposit-tabs .deposit-select-tab .deposit-account a {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100px;
    border-radius: 4px;
    box-shadow: 0px 4px 14.8px -1px rgba(37, 113, 184, 0.2);
    filter: grayscale(1);
    -webkit-transition: all 0.25s ease-in-out;
    -moz-transition: all 0.25s ease-in-out;
    -o-transition: all 0.25s ease-in-out;
    transition: all 0.25s ease-in-out;
  }
  .deposit-wrapper .deposit-tabs .deposit-select-tab .deposit-account.mint-box a {
    background: rgb(0, 182, 174);
    background: -moz-linear-gradient(
      270deg,
      rgba(0, 182, 174, 1) 0%,
      rgba(0, 148, 158, 1) 100%
    );
    background: -webkit-linear-gradient(
      270deg,
      rgba(0, 182, 174, 1) 0%,
      rgba(0, 148, 158, 1) 100%
    );
    background: linear-gradient(
      270deg,
      rgba(0, 182, 174, 1) 0%,
      rgba(0, 148, 158, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00b6ae",endColorstr="#00949e",GradientType=1);
  }
  .deposit-wrapper
    .deposit-tabs
    .deposit-select-tab
    .deposit-account.orange-box
    a {
    background: #ffffff;
  }
  .deposit-wrapper .deposit-tabs .deposit-select-tab .deposit-account a.active {
    filter: grayscale(0);
  }
  .deposit-wrapper #depositTabContent {
    margin-bottom: 15px;
  }
  .deposit-wrapper #depositTabContent .tab-pane {
    outline: none;
  }
  .deposit-wrapper .account-info {
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border-radius: 4px;
    box-shadow: 0px 4px 14.8px -1px rgba(37, 113, 184, 0.2);
    margin-bottom: 15px;
  }
  .deposit-wrapper .account-info .acc-info-1 {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    height: 50px;
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    line-height: 14px;
    border-radius: 4px;
    padding: 0 15px;
  }
  .deposit-wrapper .account-info.mint-bar .acc-info-1 {
    background: rgb(0, 182, 174);
    background: -moz-linear-gradient(
      270deg,
      rgba(0, 182, 174, 1) 0%,
      rgba(0, 148, 158, 1) 100%
    );
    background: -webkit-linear-gradient(
      270deg,
      rgba(0, 182, 174, 1) 0%,
      rgba(0, 148, 158, 1) 100%
    );
    background: linear-gradient(
      270deg,
      rgba(0, 182, 174, 1) 0%,
      rgba(0, 148, 158, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00b6ae",endColorstr="#00949e",GradientType=1);
  }
  .deposit-wrapper .account-info.orange-bar .acc-info-1 {
    background: #f58220;
  }
  .deposit-wrapper .account-info .acc-info-2 {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    height: 54px;
    font-size: 24px;
    font-weight: 700;
    line-height: 14px;
    border-bottom: 1px solid #cfdbe8;
    padding: 0 15px;
  }
  .deposit-wrapper .account-info.mint-bar .acc-info-2 {
    background: -webkit-linear-gradient(270deg, #00b6ae 0%, #00949e 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .deposit-wrapper .account-info.orange-bar .acc-info-2 {
    color: #f58220;
  }
  .deposit-wrapper .account-info .acc-info-3 {
    display: inline-flex;
    justify-content: space-between;
    align-items: center;
    height: 54px;
    border-bottom: 1px solid #cfdbe8;
    padding: 0 15px;
  }
  .deposit-wrapper .account-info .acc-info-4 {
    display: inline-flex;
    justify-content: space-between;
    align-items: center;
    height: 54px;
    padding: 0 15px;
  }
  .deposit-wrapper .account-info .acc-info-3 img,
  .deposit-wrapper .account-info .acc-info-4 img {
    width: 18px;
    height: 18px;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
  }
  .deposit-wrapper .account-info .acc-info-3 .text-1,
  .deposit-wrapper .account-info .acc-info-4 .text-1 {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #797979;
    font-size: 16px;
    font-weight: 300;
    line-height: normal;
  }
  .deposit-wrapper .account-info .acc-info-3 .text-2,
  .deposit-wrapper .account-info .acc-info-4 .text-2 {
    color: #1e1e1e;
    font-size: 24px;
    font-weight: 700;
    line-height: 14px;
  }
  .deposit-wrapper .account-copy .copy-now {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    position: relative;
    background: #06c755;
    color: #fff;
    font-size: 20px;
    font-weight: 600;
    line-height: normal;
    text-decoration: none;
    border-radius: 4px;
    box-shadow: 0px -2px 0px 0px rgba(0, 0, 0, 0.12) inset,
      0px 1px 2.8px -1px rgba(106, 106, 106, 0.4);
    padding: 10px 10px;
    cursor: pointer;
  }
  .deposit-wrapper .account-copy img {
    width: 19px;
    height: 22px;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
  }
  .deposit-wrapper .account-note {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 15px 0;
  }
  .deposit-wrapper .account-note .note-head {
    color: #da2323;
    font-size: 20px;
    font-weight: 700;
    line-height: 14px;
    text-align: center;
  }
  .deposit-wrapper .account-note .note-content {
    color: #797979;
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    text-align: center;
  }
  .deposit-wrapper .account-note .note-fee {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: #06c755;
    font-size: 14px;
    font-weight: 600;
    line-height: 24px;
    text-align: center;
  }
  .deposit-wrapper .account-note .note-fee img {
    width: 14px;
    height: 14px;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
  }
  .qr-wrapper {
    position: relative;
    background: #ffffff;
    border-radius: 4px;
    padding: 30px 30px;
    margin: 20px 0;
    box-shadow: 0px 4px 14.8px -1px rgba(37, 113, 184, 0.2);
  }
  .qr-wrapper .close-qr {
    position: absolute;
    top: 20px;
    right: 20px;
    color: #195bd6;
    cursor: pointer;
  }
  .qr-wrapper .qr-title {
    color: #195bd6;
    font-size: 20px;
    font-weight: 700;
    line-height: 14px;
    text-align: center;
    margin-bottom: 30px;
  }
  .qr-wrapper .qr-text {
    color: #797979;
    font-size: 16px;
    font-weight: 300;
    line-height: normal;
    text-align: center;
    margin-bottom: 8px;
  }
  .qr-wrapper .qr-amount {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    position: relative;
    align-self: stretch;
    margin-bottom: 10px;
  }
  .qr-wrapper .qr-amount input[type="number"] {
    background: #f0f7ff;
    color: #797979;
    width: 100%;
    height: 70px;
    text-align: center;
    border-radius: 4px;
    border: 1px solid #2682ef;
    outline: none;
    padding: 6px 45px 6px 42px;
  }
  .qr-wrapper .qr-amount input[type="number"]::placeholder {
    font-size: 20px;
    font-weight: 700;
    line-height: 14px;
  }
  .qr-wrapper .qr-select-amount {
    margin-bottom: 15px;
  }
  .qr-wrapper .qr-select-amount .row {
    margin-left: -2.5px;
    margin-right: -2.5px;
  }
  .qr-wrapper .qr-select-amount .row > * {
    padding-left: 2.5px;
    padding-right: 2.5px;
    margin-bottom: 5px;
  }
  .qr-wrapper .qr-select-amount .label-amonut {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 40px;
    background: #4c9bf7;
    color: #ffffff;
    font-size: 18px;
    font-weight: 700;
    line-height: 14px;
    text-align: center;
    border-radius: 4px;
    box-shadow: 0px 1px 3.5px -1px rgba(0, 0, 0, 0.16);
    -webkit-transition: all 0.25s ease-in-out;
    -moz-transition: all 0.25s ease-in-out;
    -o-transition: all 0.25s ease-in-out;
    transition: all 0.25s ease-in-out;
    cursor: pointer;
    padding: 10px 10px;
  }
  .qr-wrapper .qr-select-amount .label-amonut:hover {
    background: #1b5fd9;
  }
  .qr-wrapper .btn-box {
    display: flex;
  }
  .qr-wrapper .btn-custom {
    display: inline-flex;
    justify-content: center;
    flex: 0 1 100%;
    gap: 10px;
    font-size: 20px;
    font-weight: bold;
    line-height: normal;
    text-decoration: none;
    border-radius: 4px;
    border: none;
    box-shadow: 0px -2px 0px 0px rgba(0, 0, 0, 0.12) inset,
      0px 1px 2.8px -1px rgba(106, 106, 106, 0.4);
    padding: 10px 10px;
    cursor: pointer;
  }
  .qr-wrapper .btn-custom.btn-cus-green {
    background: #06c755;
    color: #fff;
  }
  
  /* withdraw */
  .withdraw-wrapper .withdraw-transfer {
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border-radius: 4px;
    box-shadow: 0px 4px 14.8px rgba(37, 113, 184, 0.2);
    padding: 20px 10px;
    margin-bottom: 10px;
  }
  .withdraw-wrapper .withdraw-transfer form {
    display: inline-flex;
    flex-direction: column;
  }
  .withdraw-wrapper .withdraw-transfer form .transfer-balance {
    background: rgb(25, 91, 214);
    background: -moz-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: -webkit-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#195bd6",endColorstr="#2683ef",GradientType=1);
    border-radius: 4px;
    padding: 18px 15px 25px;
    margin-bottom: 5px;
  }
  .withdraw-wrapper
    .withdraw-transfer
    form
    .transfer-balance
    .transfer-balance-text {
    color: #ffffff;
    font-size: 18px;
    font-weight: 600;
    line-height: 14px;
    text-align: center;
    margin-bottom: 30px;
  }
  .withdraw-wrapper
    .withdraw-transfer
    form
    .transfer-balance
    .transfer-balance-credit {
    color: #ffffff;
    font-family: "Sukhumvit Tadmai";
    font-size: 55px;
    font-weight: 700;
    line-height: 14px;
    text-align: center;
  }
  .withdraw-wrapper
    .withdraw-transfer
    form
    .transfer-balance
    .transfer-balance-credit
    span {
    font-size: 40px;
  }
  .withdraw-wrapper .transfer-head {
    color: #1a5cd7;
    font-size: 18px;
    font-weight: 600;
    line-height: 14px;
    text-align: center;
    margin-top: 20px;
    margin-bottom: 20px;
  }
  .withdraw-wrapper .transfer-bank {
    background: #eeeeee;
    color: #1e1e1e;
    font-size: 14px;
    font-weight: 500;
    line-height: normal;
    border-radius: 4px;
    padding: 15px 30px;
    margin-bottom: 20px;
  }
  .withdraw-wrapper .transfer-bank span {
    color: #06c554;
  }
  .withdraw-wrapper form .input-box {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    position: relative;
    align-self: stretch;
    margin-bottom: 20px;
  }
  .withdraw-wrapper form input[type="number"] {
    color: #797979;
    width: 100%;
    height: 50px;
    text-align: center;
    border-radius: 4px;
    border: 1px solid #7ab7ff;
    outline: none;
    padding: 6px 45px 6px 42px;
  }
  .withdraw-wrapper form input#amount {
    background: url("../image/icon/input-bank-account.svg") #f0f7ff no-repeat 15px /
      17px 17px;
  }
  .withdraw-wrapper form .btn-box {
    display: inline-flex;
  }
  .withdraw-wrapper form .btn-custom {
    display: inline-flex;
    justify-content: center;
    flex: 0 1 100%;
    gap: 10px;
    font-size: 20px;
    font-weight: bold;
    line-height: normal;
    text-decoration: none;
    border-radius: 4px;
    border: none;
    box-shadow: 0px -2px 0px 0px rgba(0, 0, 0, 0.12) inset,
      0px 1px 2.8px -1px rgba(106, 106, 106, 0.4);
    padding: 10px 10px;
    cursor: pointer;
  }
  .withdraw-wrapper form .btn-custom.btn-cus-red {
    background: rgb(218, 35, 35);
    background: -moz-linear-gradient(
      270deg,
      rgba(218, 35, 35, 1) 0%,
      rgba(178, 13, 13, 1) 100%
    );
    background: -webkit-linear-gradient(
      270deg,
      rgba(218, 35, 35, 1) 0%,
      rgba(178, 13, 13, 1) 100%
    );
    background: linear-gradient(
      270deg,
      rgba(218, 35, 35, 1) 0%,
      rgba(178, 13, 13, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#da2323",endColorstr="#b20d0d",GradientType=1);
    color: #ffffff;
  }
  
  /* card draw, spin draw */
  .lucky-wrapper .lucky-note {
    margin: 20px 0;
  }
  .lucky-wrapper .lucky-note .note-head {
    color: #da2323;
    font-size: 20px;
    font-weight: 700;
    line-height: 14px;
  }
  .lucky-wrapper .lucky-note .note-content ul {
    list-style: none;
    padding: 15px 0;
    margin: 0;
  }
  .lucky-wrapper .lucky-note .note-content ul li {
    background: url("../image/icon/green-dot.svg") no-repeat 0 3px/ 13px 13px;
    color: #1e1e1e;
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    padding-left: 20px;
  }
  .lucky-wrapper .lucky-note .note-content ul li span {
    font-family: "Sukhumvit Tadmai";
  }
  .lucky-wrapper .lucky-note .note-go a {
    color: #06c554;
    font-size: 20px;
    font-weight: 700;
    line-height: 14px;
    text-decoration: none;
  }
  
  /* card draw */
  .Lucky-card {
    border-radius: 4px;
    overflow: hidden;
  }
  .Lucky-card .title {
    background: #bcdbff;
  }
  .Lucky-card .title .inner {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    height: 34px;
    color: #195bd6;
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
    text-align: center;
    padding: 0 10px;
  }
  .Lucky-card .pickup-card {
    background: #ffffff;
  }
  
  /* cashback */
  .cashback-wrapper .cashback-transfer {
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border-radius: 4px;
    filter: drop-shadow(0px 4px 14.8px rgba(37, 113, 184, 0.2));
    padding: 20px 10px;
    margin-bottom: 10px;
  }
  .cashback-wrapper .cashback-transfer .transfer-intro {
    color: #1e1e1e;
    font-size: 14px;
    font-weight: 600;
    line-height: 14px;
    text-align: center;
    padding: 0 10px;
    margin-bottom: 18px;
  }
  .cashback-wrapper .cashback-transfer .transfer-head {
    color: #1e1e1e;
    font-size: 20px;
    font-weight: 700;
    line-height: 14px;
    padding: 0 10px;
    margin-bottom: 15px;
  }
  .cashback-wrapper .cashback-transfer .transfer-content {
    color: #797979;
    font-size: 14px;
    font-weight: 300;
    line-height: 20px;
    padding: 0 10px;
    margin-bottom: 15px;
  }
  .cashback-wrapper .cashback-transfer form {
    display: inline-flex;
    flex-direction: column;
  }
  .cashback-wrapper .cashback-transfer form .transfer-balance {
    background: rgb(25, 91, 214);
    background: -moz-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: -webkit-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#195bd6",endColorstr="#2683ef",GradientType=1);
    border-radius: 4px;
    padding: 18px 15px 25px;
    margin-bottom: 10px;
  }
  .cashback-wrapper
    .cashback-transfer
    form
    .transfer-balance
    .transfer-balance-text {
    color: #ffffff;
    font-size: 18px;
    font-weight: 600;
    line-height: 14px;
    text-align: center;
    margin-bottom: 30px;
  }
  .cashback-wrapper
    .cashback-transfer
    form
    .transfer-balance
    .transfer-balance-credit {
    color: #ffffff;
    font-family: "Sukhumvit Tadmai";
    font-size: 55px;
    font-weight: 700;
    line-height: 14px;
    text-align: center;
  }
  .cashback-wrapper
    .cashback-transfer
    form
    .transfer-balance
    .transfer-balance-credit
    span {
    font-size: 40px;
  }
  .cashback-wrapper form .btn-box {
    display: inline-flex;
    margin-bottom: 8px;
  }
  .cashback-wrapper form .btn-custom {
    display: inline-flex;
    justify-content: center;
    flex: 0 1 100%;
    gap: 10px;
    font-family: "Sukhumvit Tadmai";
    font-size: 20px;
    font-weight: bold;
    line-height: normal;
    text-decoration: none;
    border-radius: 4px;
    border: none;
    box-shadow: 0px -2px 0px 0px rgba(0, 0, 0, 0.12) inset;
    filter: drop-shadow(0px 1px 2.8px rgba(106, 106, 106, 0.4));
    padding: 12px 10px;
    cursor: pointer;
  }
  .cashback-wrapper form .btn-custom.btn-cus-green {
    color: #ffffff;
    background: #06c755;
  }
  .cashback-wrapper .cashback-transfer .transfer-note {
    color: #1e1e1e;
    font-size: 16px;
    font-weight: 500;
    line-height: normal;
    text-align: center;
  }
  .cashback-wrapper .cashback-transfer .transfer-note span {
    color: #dc3030;
  }
  .cashback-wrapper .cashback-note {
    margin: 20px 0;
  }
  .cashback-wrapper .cashback-note .note-head {
    color: #1e1e1e;
    font-size: 20px;
    font-weight: 700;
    line-height: 14px;
    text-align: center;
    margin-bottom: 15px;
  }
  .cashback-wrapper .cashback-note .note-head span {
    color: #da2323;
  }
  .cashback-wrapper .cashback-note .note-content {
    color: #1e1e1e;
    font-size: 14px;
    font-weight: 300;
    line-height: 20px;
  }
  .cashback-wrapper .cashback-note .note-content ul {
    list-style: none;
    padding: 0;
    margin: 20px 0 0;
  }
  
  /* reference */
  .reference-wrapper .reference-transfer {
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border-radius: 4px;
    box-shadow: 0px 4px 14.8px rgba(37, 113, 184, 0.2);
    padding: 20px 10px;
    margin-bottom: 10px;
  }
  .reference-wrapper .reference-transfer .transfer-intro {
    color: #1e1e1e;
    font-size: 12px;
    font-weight: 600;
    line-height: 14px;
    text-align: center;
    margin-bottom: 20px;
  }
  .reference-wrapper .reference-transfer form {
    display: inline-flex;
    flex-direction: column;
  }
  .reference-wrapper .reference-transfer form .transfer-balance {
    background: rgb(25, 91, 214);
    background: -moz-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: -webkit-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#195bd6",endColorstr="#2683ef",GradientType=1);
    border-radius: 4px;
    padding: 18px 15px 25px;
    margin-bottom: 5px;
  }
  .reference-wrapper
    .reference-transfer
    form
    .transfer-balance
    .transfer-balance-text {
    color: #ffffff;
    font-size: 18px;
    font-weight: 600;
    line-height: 14px;
    text-align: center;
    margin-bottom: 30px;
  }
  .reference-wrapper
    .reference-transfer
    form
    .transfer-balance
    .transfer-balance-credit {
    color: #ffffff;
    font-family: "Sukhumvit Tadmai";
    font-size: 55px;
    font-weight: 700;
    line-height: 14px;
    text-align: center;
  }
  .reference-wrapper
    .reference-transfer
    form
    .transfer-balance
    .transfer-balance-credit
    span {
    font-size: 40px;
  }
  .reference-wrapper .reference-transfer form .transfer-duo {
    display: inline-flex;
    gap: 5px;
  }
  .reference-wrapper .reference-transfer form .transfer-duo .transfer-friend {
    flex: 0 1 100%;
    background: #4c9bf7;
    border-radius: 4px;
    padding: 18px 15px 25px;
    margin-bottom: 5px;
  }
  .reference-wrapper
    .reference-transfer
    form
    .transfer-duo
    .transfer-friend
    .transfer-friend-text {
    color: #ffffff;
    font-size: 18px;
    font-weight: 600;
    line-height: 14px;
    text-align: center;
    margin-bottom: 30px;
  }
  .reference-wrapper
    .reference-transfer
    form
    .transfer-duo
    .transfer-friend
    .transfer-friend-count {
    color: #ffffff;
    font-family: "Sukhumvit Tadmai";
    font-size: 55px;
    font-weight: 700;
    line-height: 14px;
    text-align: center;
  }
  .reference-wrapper
    .reference-transfer
    form
    .transfer-duo
    .transfer-friend
    .transfer-friend-count
    span {
    font-size: 40px;
  }
  .reference-wrapper form .btn-box {
    display: inline-flex;
    margin-bottom: 20px;
  }
  .reference-wrapper form .btn-custom {
    display: inline-flex;
    justify-content: center;
    flex: 0 1 100%;
    gap: 10px;
    font-family: "Sukhumvit Tadmai";
    font-size: 20px;
    font-weight: bold;
    line-height: normal;
    text-decoration: none;
    border-radius: 4px;
    border: none;
    box-shadow: 0px -2px 0px 0px rgba(0, 0, 0, 0.12) inset;
    filter: drop-shadow(0px 1px 2.8px rgba(106, 106, 106, 0.4));
    padding: 12px 10px;
    cursor: pointer;
  }
  .reference-wrapper form .btn-custom.btn-cus-green {
    color: #ffffff;
    background: #06c755;
  }
  .reference-wrapper .transfer-note {
    color: #1e1e1e;
    font-size: 16px;
    font-weight: 300;
    line-height: 14px;
    text-align: center;
  }
  .reference-wrapper .transfer-note span {
    color: #06c755;
  }
  .reference-wrapper .transfer-divider {
    height: 1px;
    background: #e6e9ec;
    margin: 15px 10px 20px;
  }
  .reference-wrapper .transfer-promo-head {
    color: #1a5cd7;
    font-size: 18px;
    font-weight: 600;
    line-height: 14px;
    text-align: center;
    margin-bottom: 20px;
  }
  .reference-wrapper .transfer-promo-link {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    height: 69px;
    background: #dcecff;
    color: #000;
    font-size: 20px;
    font-weight: 300;
    line-height: 14px;
    border-radius: 4px;
    padding: 0 10px;
    margin: 0 5px 10px;
  }
  .reference-wrapper .transfer-promo-link span {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .reference-wrapper .transfer-copy {
    margin: 0 5px 20px;
  }
  .reference-wrapper .transfer-copy .copy-now {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    position: relative;
    background: rgb(218, 35, 35);
    background: -moz-linear-gradient(
      270deg,
      rgba(218, 35, 35, 1) 0%,
      rgba(178, 13, 13, 1) 100%
    );
    background: -webkit-linear-gradient(
      270deg,
      rgba(218, 35, 35, 1) 0%,
      rgba(178, 13, 13, 1) 100%
    );
    background: linear-gradient(
      270deg,
      rgba(218, 35, 35, 1) 0%,
      rgba(178, 13, 13, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#da2323",endColorstr="#b20d0d",GradientType=1);
    color: #fff;
    font-family: "Sukhumvit Tadmai";
    font-size: 20px;
    font-weight: bold;
    line-height: normal;
    text-decoration: none;
    border-radius: 4px;
    box-shadow: 0px -2px 0px 0px rgba(0, 0, 0, 0.12) inset;
    filter: drop-shadow(0px 1px 2.8px rgba(106, 106, 106, 0.4));
    padding: 12px 10px;
    cursor: pointer;
  }
  .reference-wrapper .transfer-copy img {
    width: 19px;
    height: 22px;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
  }
  .reference-wrapper .transfer-share-head {
    color: #1e1e1e;
    font-size: 16px;
    font-weight: 300;
    line-height: 14px;
    text-align: center;
    margin: 0 5px 15px;
  }
  .reference-wrapper .transfer-share-head span {
    font-weight: 700;
  }
  .reference-wrapper .transfer-share-btn {
    display: inline-flex;
    gap: 5px;
  }
  .reference-wrapper .transfer-share-btn a {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 5px;
    flex: 0 1 100%;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    line-height: normal;
    text-decoration: none;
    border-radius: 4px;
    padding: 14px 4px;
  }
  .reference-wrapper .transfer-share-btn a.share-line {
    background: #06c353;
  }
  .reference-wrapper .transfer-share-btn a.share-facebook {
    background: #225df9;
  }
  .reference-wrapper .transfer-share-btn a.share-message {
    background: #32ade6;
  }
  .reference-wrapper .reference-note {
    margin: 20px 5px;
  }
  .reference-wrapper .reference-note .note-head {
    color: #1e1e1e;
    font-size: 20px;
    font-weight: 700;
    line-height: 14px;
    text-align: center;
    margin-bottom: 30px;
  }
  .reference-wrapper .reference-note .note-head-2 {
    color: #1e1e1e;
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: 14px;
    margin: 15px 0;
  }
  .reference-wrapper .reference-note .note-content {
    color: #1e1e1e;
    font-size: 14px;
    font-weight: 300;
    line-height: 20px;
    margin-bottom: 7px;
  }
  .reference-wrapper .reference-note .note-content span.green {
    color: #06c554;
  }
  .reference-wrapper .reference-note .note-content span.heavy {
    font-weight: 700;
  }
  .reference-wrapper .reference-note .note-content-2 ul {
    list-style: none;
    padding: 0;
    margin: 0 0 15px;
  }
  .reference-wrapper .reference-note .note-content-2 ul li {
    background: url("../image/icon/green-dot.svg") no-repeat 0 3px/ 13px 13px;
    color: #1e1e1e;
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    padding-left: 20px;
  }
  .reference-wrapper .reference-note .note-content-2 ul li:not(:last-child) {
    margin-bottom: 10px;
  }
  .reference-wrapper .reference-note .note-content-2 ul li span {
    font-weight: 700;
  }
  .reference-wrapper .reference-note .note-bar {
    background: #ffffff;
    color: #1e1e1e;
    font-size: 18px;
    font-weight: 300;
    line-height: 20px;
    border-radius: 4px;
    padding: 10px 25px;
    margin-bottom: 7px;
  }
  .reference-wrapper .reference-note .note-bar span {
    font-weight: 600;
  }
  .reference-wrapper .reference-note .note-bar-2 {
    background: #ffffff;
    color: #1e1e1e;
    font-size: 14px;
    font-weight: 300;
    line-height: 20px;
    border-radius: 4px;
    border: 1px solid #e6e9ec;
    padding: 25px 25px;
    margin-bottom: 7px;
  }
  .reference-wrapper .reference-note .note-bar-2 span {
    font-weight: 700;
  }
  
  /* casino */
  .casino-wrapper .casino-tabs {
    margin: 15px 0;
  }
  .casino-wrapper .casino-tabs .casino-select-tab {
    display: flex;
    gap: 5px;
    background: rgb(25, 91, 214);
    background: -moz-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: -webkit-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#195bd6",endColorstr="#2683ef",GradientType=1);
    border-radius: 4px;
    box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.25) inset,
      0px 1px 1.4px -1px rgba(0, 0, 0, 0.2);
    padding: 5px 5px;
  }
  .casino-wrapper .casino-tabs .casino-select-tab .casino-type {
    flex: 0 1 100%;
  }
  .casino-wrapper .casino-tabs .casino-select-tab .casino-type a {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    width: 100%;
    height: 50px;
    color: #ffffff;
    font-size: 18px;
    font-weight: 700;
    line-height: 14px;
    text-decoration: none;
    border-radius: 4px;
    -webkit-transition: all 0.25s ease-in-out;
    -moz-transition: all 0.25s ease-in-out;
    -o-transition: all 0.25s ease-in-out;
    transition: all 0.25s ease-in-out;
  }
  .casino-wrapper .casino-tabs .casino-select-tab .casino-type a.active {
    background: #ffffff;
    color: #0e50cc;
  }
  .casino-wrapper .casino-tabs .casino-select-tab .casino-type a .casino-icon {
    width: 20px;
    height: 20px;
  }
  .casino-wrapper .casino-tabs .casino-select-tab .casino-type a .icon-sport {
    background: url("../image/icon/icon-sport.svg") no-repeat center / contain;
  }
  .casino-wrapper .casino-tabs .casino-select-tab .casino-type a .icon-casino {
    background: url("../image/icon/icon-casino.svg") no-repeat center / contain;
  }
  .casino-wrapper .casino-tabs .casino-select-tab .casino-type a .icon-slots {
    background: url("../image/icon/icon-slots.svg") no-repeat center / contain;
  }
  .casino-wrapper .casino-tabs .casino-select-tab .casino-type a .icon-lotto {
    background: url("../image/icon/icon-lotto-2.svg") no-repeat center / contain;
  }
  .casino-wrapper
    .casino-tabs
    .casino-select-tab
    .casino-type
    a.active
    .icon-sport {
    background: #0e50cc;
    mask: url("../image/icon/icon-sport.svg") no-repeat center / contain;
    -webkit-mask: url("../image/icon/icon-sport.svg") no-repeat center / contain;
  }
  .casino-wrapper
    .casino-tabs
    .casino-select-tab
    .casino-type
    a.active
    .icon-casino {
    background: #0e50cc;
    mask: url("../image/icon/icon-casino.svg") no-repeat center / contain;
    -webkit-mask: url("../image/icon/icon-casino.svg") no-repeat center / contain;
  }
  .casino-wrapper
    .casino-tabs
    .casino-select-tab
    .casino-type
    a.active
    .icon-slots {
    background: #0e50cc;
    mask: url("../image/icon/icon-slots.svg") no-repeat center / contain;
    -webkit-mask: url("../image/icon/icon-slots.svg") no-repeat center / contain;
  }
  .casino-wrapper
    .casino-tabs
    .casino-select-tab
    .casino-type
    a.active
    .icon-lotto {
    background: #0e50cc;
    mask: url("../image/icon/icon-lotto-2.svg") no-repeat center / contain;
    -webkit-mask: url("../image/icon/icon-lotto-2.svg") no-repeat center / contain;
  }
  .casino-wrapper #casinoTabContent .tab-pane {
    outline: none;
  }
  .casino-wrapper .row-casino {
    margin-left: -5px;
    margin-right: -5px;
  }
  .casino-wrapper .row-casino > * {
    padding-left: 5px;
    padding-right: 5px;
  }
  .casino-wrapper .casino-card {
    padding-top: 60%;
    background: #252525;
    border-radius: 4px;
    margin-bottom: 10px;
  }
  
  /* history */
  .history-wrapper .history-head-2 {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 50px;
    background: rgb(25, 91, 214);
    background: -moz-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: -webkit-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#195bd6",endColorstr="#2683ef",GradientType=1);
    color: #ffffff;
    font-size: 20px;
    font-weight: 700;
    line-height: 14px;
    border-radius: 4px;
    box-shadow: 0px 1px 3px -0.5px rgba(37, 113, 184, 0.14);
    margin-bottom: 10px;
  }
  .history-wrapper .history-head-3 {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 40px;
    background: #bcdbff;
    color: #1e1e1e;
    font-size: 20px;
    font-weight: 700;
    line-height: 14px;
    border-radius: 4px;
    margin-bottom: 20px;
  }
  .history-wrapper .history-list {
    background: #ffffff;
    border-radius: 4px;
    filter: drop-shadow(0px 4px 14.8px rgba(37, 113, 184, 0.2));
    margin-bottom: 20px;
  }
  .history-wrapper .history-list .log {
    list-style: none;
    padding: 20px 0 30px;
    margin: 0;
  }
  .history-wrapper .history-list .log li {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    padding-left: 15px;
    padding-right: 15px;
  }
  .history-wrapper .history-list .log li > * {
    flex: 0 1 100%;
  }
  .history-wrapper .history-list .log li:first-child {
    color: #797979;
    font-size: 14px;
    font-weight: 300;
    line-height: 14px;
  }
  .history-wrapper .history-list .log li:not(:first-child) {
    background: #f0f7ff;
    padding-top: 15px;
    padding-bottom: 15px;
  }
  .history-wrapper .history-list .log li:not(:last-child) {
    margin-bottom: 5px;
  }
  .history-wrapper .history-list .log li .log-desc {
    display: inline-flex;
    flex-direction: column;
    text-align: start;
  }
  .history-wrapper .history-list .log li .log-desc .type {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #1e1e1e;
    font-size: 18px;
    font-weight: 700;
    line-height: 14px;
    margin-bottom: 7px;
  }
  .history-wrapper .history-list .log li .log-desc .time {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #797979;
    font-size: 12px;
    font-weight: 300;
    line-height: 14px;
  }
  .history-wrapper .history-list .log li .log-desc .time.log-failed {
    color: #da2323;
  }
  .history-wrapper .history-list .log li .log-amount {
    text-align: end;
  }
  .history-wrapper .history-list .log li .log-amount .amount {
    font-size: 20px;
    font-weight: 700;
    line-height: 14px;
  }
  .history-wrapper .history-list .log li .log-amount .amount.log-success {
    color: #06c755;
  }
  .history-wrapper .history-list .log li .log-amount .amount.log-failed {
    color: #da2323;
  }
  .history-wrapper .status-active {
    width: 14px;
    height: 14px;
  }
  .history-wrapper .status-success {
    background: url("../image/icon/log-success.svg") no-repeat center / contain;
  }
  .history-wrapper .status-failed {
    background: url("../image/icon/log-failed.svg") no-repeat center / contain;
  }
  .history-wrapper .status-confirm {
    background: url("../image/icon/log-confirm.svg") no-repeat center / contain;
  }
  .history-wrapper .status-wait {
    background: url("../image/icon/log-wait.svg") no-repeat center / contain;
  }
  .history-wrapper .status-alert {
    background: url("../image/icon/log-alert.svg") no-repeat center / contain;
  }
  .history-wrapper .history-status .status-type {
    display: inline-flex;
    justify-content: flex-start;
    align-items: center;
    gap: 7px;
    color: #1e1e1e;
    font-size: 14px;
    font-weight: 500;
    line-height: 22px;
  }
  
  /* coin */
  .coin-wrapper .coin-member {
    display: flex;
    flex-direction: column;
    height: 75px;
    background: #bcdbff;
    border-radius: 4px;
    box-shadow: 0px 4px 14.8px -1px rgba(37, 113, 184, 0.2);
    padding: 3px 10px;
    margin-bottom: 10px;
  }
  .coin-wrapper .coin-member .member-info {
    display: inline-flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
  }
  .coin-wrapper .coin-member .member-info .member-name {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    flex: 1 1 auto;
    height: 34px;
    color: #195bd6;
    font-size: 16px;
    font-weight: 600;
    line-height: normal;
    overflow: hidden;
    padding-right: 10px;
  }
  .coin-wrapper .coin-member .member-info .member-name span {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .coin-wrapper .coin-member .member-coin {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 5px;
    height: 34px;
    color: #195bd6;
    font-size: 14px;
    font-weight: 600;
    line-height: 14px;
  }
  .coin-wrapper .coin-member .member-coin span {
    font-size: 16px;
    font-weight: 700;
  }
  .coin-wrapper .coin-redeem ul {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    list-style: none;
    padding: 0;
    margin: 0 0 20px;
  }
  .coin-wrapper .coin-redeem ul li {
    display: flex;
    flex: 1 0 auto;
    background: rgb(238, 247, 255);
    background: -moz-linear-gradient(
      0deg,
      rgba(238, 247, 255, 1) 0%,
      rgba(255, 255, 255, 1) 100%
    );
    background: -webkit-linear-gradient(
      0deg,
      rgba(238, 247, 255, 1) 0%,
      rgba(255, 255, 255, 1) 100%
    );
    background: linear-gradient(
      0deg,
      rgba(238, 247, 255, 1) 0%,
      rgba(255, 255, 255, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#eef7ff",endColorstr="#ffffff",GradientType=1);
    filter: drop-shadow(0px 4px 14.8px rgba(37, 113, 184, 0.2));
    border-radius: 4px;
    overflow: hidden;
  }
  .coin-wrapper .coin-redeem ul li .redeem-get,
  .coin-wrapper .coin-redeem ul li .redeem-use {
    display: inline-flex;
    align-items: center;
    padding: 16px 10px;
  }
  .coin-wrapper .coin-redeem ul li .redeem-get {
    flex: 1 0 calc(100% - 167px);
    gap: 5px;
  }
  .coin-wrapper .coin-redeem ul li .redeem-get img {
    flex: 1 0 55px;
    width: 55px;
    height: 55px;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
    margin: 0 10px;
  }
  .coin-wrapper .coin-redeem ul li .redeem-use {
    justify-content: center;
    flex: 1 0 167px;
    background: url("../image/background/redeem-blue-ticket.svg") repeat left /
      cover;
  }
  .coin-wrapper .coin-redeem ul li .redeem-info {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    flex: 1 1 calc(100% - 55px);
    text-align: center;
  }
  .coin-wrapper .coin-redeem ul li .redeem-info .redeem-text {
    color: #195bd6;
    font-size: 12px;
    font-weight: 400;
    line-height: 14px;
    margin-bottom: 10px;
  }
  .coin-wrapper .coin-redeem ul li .redeem-info .redeem-total {
    font-size: 22px;
    font-weight: 700;
    line-height: 24px;
  }
  .coin-wrapper .coin-redeem ul li .redeem-info .redeem-total span {
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
  }
  .coin-wrapper .coin-redeem ul li .redeem-get .redeem-info .redeem-text,
  .coin-wrapper .coin-redeem ul li .redeem-get .redeem-info .redeem-total {
    background: -webkit-linear-gradient(90deg, #195bd6 0%, #2683ef 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .coin-wrapper .coin-redeem ul li .redeem-use .redeem-info .redeem-text,
  .coin-wrapper .coin-redeem ul li .redeem-use .redeem-info .redeem-total {
    color: #ffffff;
  }
  @media (min-width: 768px) {
    .coin-wrapper .coin-redeem ul li {
      width: calc(50% - 2.5px);
    }
  }
  
  /* profile */
  .profile-wrapper .profile-information {
    position: relative;
    background: #ffffff;
    border-radius: 4px;
    box-shadow: 0px 4px 14.8px -1px rgba(37, 113, 184, 0.2);
    padding: 30px 30px 22px;
    margin: 10px 0 20px;
  }
  .profile-wrapper .profile-information .profile-title {
    color: #195bd6;
    font-size: 20px;
    font-weight: 700;
    line-height: 14px;
    text-align: center;
    margin-bottom: 30px;
  }
  .profile-wrapper .profile-information .profile-data {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #ffffff;
    border-radius: 4px;
    border: 1px solid #a9d1ff;
    padding: 7px 14px 7px 41px;
    margin-bottom: 8px;
  }
  .profile-wrapper .profile-information .profile-data.profile-user {
    background: url("../image/icon/icon-person.svg") no-repeat 14px / 17px 17px;
  }
  .profile-wrapper .profile-information .profile-data.profile-telephone {
    background: url("../image/icon/input-phone-2.svg") no-repeat 14px / 17px 17px;
  }
  .profile-wrapper .profile-information .profile-data.profile-bank {
    background: url("../image/icon/input-bank.svg") no-repeat 14px / 17px 17px;
  }
  .profile-wrapper .profile-information .profile-data.profile-bank-account {
    background: url("../image/icon/input-bank-account.svg") no-repeat 14px / 17px
      17px;
  }
  .profile-wrapper .profile-information .profile-data .data-left {
    color: #797979;
    font-size: 16px;
    font-weight: 300;
    line-height: normal;
  }
  .profile-wrapper .profile-information .profile-data .data-right {
    color: #195bd6;
    font-size: 18px;
    font-weight: 300;
    line-height: normal;
  }
  .change-password-wrapper {
    position: relative;
    background: #ffffff;
    border-radius: 4px;
    padding: 30px 30px 22px;
    margin: 20px 0;
    box-shadow: 0px 4px 14.8px -1px rgba(37, 113, 184, 0.2);
  }
  .change-password-wrapper form {
    display: flex;
    flex-direction: column;
  }
  .change-password-wrapper .change-password-title {
    color: #195bd6;
    font-size: 20px;
    font-weight: 700;
    line-height: 14px;
    text-align: center;
    margin-bottom: 30px;
  }
  .change-password-wrapper .input-text {
    color: #797979;
    font-size: 16px;
    font-weight: 300;
    line-height: normal;
    margin-bottom: 8px;
  }
  .change-password-wrapper form .input-box {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    position: relative;
    align-self: stretch;
    margin-bottom: 8px;
  }
  .change-password-wrapper form input[type="text"],
  .change-password-wrapper form input[type="password"] {
    color: #797979;
    width: 100%;
    height: 45px;
    border-radius: 4px;
    border: 1px solid #7ab7ff;
    outline: none;
    padding: 6px 45px 6px 42px;
  }
  .change-password-wrapper form .input-note {
    color: #797979;
    font-size: 12px;
    font-weight: 300;
    line-height: 18px;
    text-align: center;
    border-bottom: 1px solid #7ab7ff;
    padding: 10px 26px;
    margin-bottom: 8px;
  }
  .change-password-wrapper form input#old-password,
  .change-password-wrapper form input#new-password,
  .change-password-wrapper form input#new-password-confirm {
    background: url("../image/icon/input-password-confirm.svg") #f0f7ff no-repeat
      15px / 17px 17px;
  }
  .change-password-wrapper form .btn-box {
    display: inline-flex;
    margin-bottom: 8px;
  }
  .change-password-wrapper form .btn-custom {
    display: inline-flex;
    justify-content: center;
    flex: 0 1 100%;
    gap: 10px;
    font-family: "Sukhumvit Tadmai";
    font-size: 20px;
    font-weight: 700;
    line-height: normal;
    text-decoration: none;
    border-radius: 4px;
    border: none;
    padding: 10px 10px;
    cursor: pointer;
  }
  .change-password-wrapper form .btn-custom.btn-cus-green {
    color: #ffffff;
    background: #06c755;
  }
  
  /* lobby */
  .lobby-wrapper .bet-time-box {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 34px;
    background: rgb(238, 247, 255);
    background: -moz-linear-gradient(
      0deg,
      rgba(238, 247, 255, 1) 0%,
      rgba(255, 255, 255, 1) 100%
    );
    background: -webkit-linear-gradient(
      0deg,
      rgba(238, 247, 255, 1) 0%,
      rgba(255, 255, 255, 1) 100%
    );
    background: linear-gradient(
      0deg,
      rgba(238, 247, 255, 1) 0%,
      rgba(255, 255, 255, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#eef7ff",endColorstr="#ffffff",GradientType=1);
    border-radius: 4px;
    margin: 20px 0 10px;
  }
  .lobby-wrapper .bet-time-box .timer {
    color: #797979;
    font-size: 16px;
    font-weight: 600;
    line-height: 14px;
    letter-spacing: 0.8px;
    padding-left: 10px;
  }
  .lobby-wrapper .bet-time-box .title {
    color: #195bd6;
    font-size: 16px;
    font-weight: 700;
    line-height: 14px;
  }
  .lobby-wrapper .bet-time-box .bet-now-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 34px;
    background: rgb(4, 184, 78);
    background: -moz-linear-gradient(
      90deg,
      rgba(4, 184, 78, 1) 0%,
      rgba(6, 199, 85, 1) 100%
    );
    background: -webkit-linear-gradient(
      90deg,
      rgba(4, 184, 78, 1) 0%,
      rgba(6, 199, 85, 1) 100%
    );
    background: linear-gradient(
      90deg,
      rgba(4, 184, 78, 1) 0%,
      rgba(6, 199, 85, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#04b84e",endColorstr="#06c755",GradientType=1);
    color: #ffffff;
    font-size: 18px;
    font-weight: 700;
    line-height: 14px;
    text-decoration: none;
    border-radius: 4px;
    padding: 10px 20px;
  }
  .lobby-wrapper .lobby-btn-box {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-bottom: 15px;
  }
  .lobby-wrapper .lobby-btn-box .lotto-btn {
    display: flex;
    flex: 0 0 100%;
    background: rgb(182, 130, 18);
    background: -moz-linear-gradient(
      90deg,
      rgba(182, 130, 18, 1) 0%,
      rgba(219, 186, 79, 1) 30%,
      rgba(244, 222, 121, 1) 50%,
      rgba(215, 180, 88, 1) 70%,
      rgba(193, 149, 60, 1) 100%
    );
    background: -webkit-linear-gradient(
      90deg,
      rgba(182, 130, 18, 1) 0%,
      rgba(219, 186, 79, 1) 30%,
      rgba(244, 222, 121, 1) 50%,
      rgba(215, 180, 88, 1) 70%,
      rgba(193, 149, 60, 1) 100%
    );
    background: linear-gradient(
      90deg,
      rgba(182, 130, 18, 1) 0%,
      rgba(219, 186, 79, 1) 30%,
      rgba(244, 222, 121, 1) 50%,
      rgba(215, 180, 88, 1) 70%,
      rgba(193, 149, 60, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#b68212",endColorstr="#c1953c",GradientType=1);
    text-decoration: none;
    border-radius: 4px;
    padding: 1px;
  }
  .lobby-wrapper .lobby-btn-box .lotto-btn .inner {
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 0 0 100%;
    gap: 10px;
    height: 70px;
    background: rgb(239, 211, 105);
    background: -moz-linear-gradient(
      90deg,
      rgba(239, 211, 105, 1) 0%,
      rgba(255, 247, 145, 1) 25%,
      rgba(239, 191, 93, 1) 50%,
      rgba(255, 247, 145, 1) 75%,
      rgba(239, 211, 105, 1) 100%
    );
    background: -webkit-linear-gradient(
      90deg,
      rgba(239, 211, 105, 1) 0%,
      rgba(255, 247, 145, 1) 25%,
      rgba(239, 191, 93, 1) 50%,
      rgba(255, 247, 145, 1) 75%,
      rgba(239, 211, 105, 1) 100%
    );
    background: linear-gradient(
      90deg,
      rgba(239, 211, 105, 1) 0%,
      rgba(255, 247, 145, 1) 25%,
      rgba(239, 191, 93, 1) 50%,
      rgba(255, 247, 145, 1) 75%,
      rgba(239, 211, 105, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#efd369",endColorstr="#efd369",GradientType=1);
    color: #1e1e1e;
    font-size: 35px;
    font-weight: 700;
    line-height: 14px;
    border-radius: 3px;
    box-shadow: 0px -2px 0px 0px rgba(0, 0, 0, 0.12) inset,
      0px 1px 2.8px -1px rgba(106, 106, 106, 0.4);
    padding: 0 10px;
  }
  .lobby-wrapper .lobby-btn-box .dash-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 60px;
    gap: 16px;
    background: rgb(25, 91, 214);
    background: -moz-linear-gradient(
      360deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: -webkit-linear-gradient(
      360deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: linear-gradient(
      360deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#195bd6",endColorstr="#2683ef",GradientType=1);
    color: #ffffff;
    font-size: 25px;
    font-weight: 700;
    line-height: 14px;
    text-decoration: none;
    border-radius: 4px;
    box-shadow: 0px -2px 0px 0px rgba(0, 0, 0, 0.12) inset,
      0px 1px 2.8px -1px rgba(106, 106, 106, 0.4);
    padding: 0 10px;
  }
  .lobby-wrapper .lobby-btn-box .dash-btn.full {
    flex: 0 0 100%;
  }
  .lobby-wrapper .lobby-btn-box .dash-btn.half {
    flex: 0 0 calc(50% - 2.5px);
  }
  .lobby-wrapper .lobby-nav-box {
    display: flex;
    flex-wrap: wrap;
    gap: 2px;
    margin-bottom: 15px;
  }
  .lobby-wrapper .lobby-nav-box .nav-box {
    display: flex;
    justify-content: center;
    flex: 0 0 calc(33.33333333% - 1.35px);
    height: 90px;
    background: #ffffff;
    text-align: center;
  }
  .lobby-wrapper .lobby-nav-box .nav-box a {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 10px;
    width: 100%;
    text-decoration: none;
    padding: 10px;
  }
  .lobby-wrapper .lobby-nav-box .nav-box img {
    width: 35px;
    height: 35px;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
  }
  .lobby-wrapper .lobby-nav-box .nav-box .title {
    color: #195bd6;
    font-size: 16px;
    font-weight: 700;
    line-height: 14px;
  }
  .lobby-wrapper .dash-head {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 40px;
    gap: 10px;
    background: #bcdbff;
    color: #195bd6;
    font-size: 20px;
    font-weight: 700;
    line-height: 14px;
    text-decoration: none;
    border-radius: 4px;
    padding: 0 10px;
    margin: 0 0 10px;
  }
  .lobby-wrapper .dash-head img {
    width: 30px;
    height: 30px;
  }
  .lobby-wrapper .lobby-lotto-comingsoon ul {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    list-style: none;
    padding: 0;
    margin: 0 0 20px;
  }
  .lobby-wrapper .lobby-lotto-comingsoon ul li {
    display: flex;
    align-items: center;
    flex: 0 0 100%;
    min-height: 55px;
    background: #ffffff;
    filter: drop-shadow(0px 4px 14.8px rgba(37, 113, 184, 0.2));
    border-radius: 4px;
  }
  .lobby-wrapper .lobby-lotto-comingsoon ul li .comingsoon-left {
    display: inline-flex;
    align-items: center;
    flex: 1 0 calc(100% - 165px);
    gap: 14px;
    height: 100%;
    padding: 9px 9px;
  }
  .lobby-wrapper .lobby-lotto-comingsoon ul li .comingsoon-left img {
    width: 37px;
    height: 37px;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
  }
  .lobby-wrapper .lobby-lotto-comingsoon ul li .comingsoon-left .text-box {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
  }
  .lobby-wrapper
    .lobby-lotto-comingsoon
    ul
    li
    .comingsoon-left
    .text-box
    .text-1 {
    background: rgb(25, 91, 214);
    background: -moz-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: -webkit-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#195bd6",endColorstr="#2683ef",GradientType=1);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 16px;
    font-weight: 700;
    line-height: normal;
  }
  .lobby-wrapper
    .lobby-lotto-comingsoon
    ul
    li
    .comingsoon-left
    .text-box
    .text-2 {
    color: #ffffff;
    font-size: 10px;
    font-weight: 600;
    line-height: normal;
    text-align: center;
  }
  .lobby-wrapper
    .lobby-lotto-comingsoon
    ul
    li
    .comingsoon-left
    .text-box
    .text-2
    span {
    display: inline-block;
    min-width: 90px;
    height: 15px;
    background: rgb(25, 91, 214);
    background: -moz-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: -webkit-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#195bd6",endColorstr="#2683ef",GradientType=1);
    border-radius: 4px;
  }
  .lobby-wrapper .lobby-lotto-comingsoon ul li .comingsoon-right {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    flex: 1 0 165px;
    height: 100%;
    background: rgb(25, 91, 214);
    background: -moz-linear-gradient(
      360deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: -webkit-linear-gradient(
      360deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: linear-gradient(
      360deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#195bd6",endColorstr="#2683ef",GradientType=1);
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    box-shadow: 0px -2px 0px 0px rgba(0, 0, 0, 0.12) inset,
      0px 1px 2.8px -1px rgba(106, 106, 106, 0.4);
  }
  .lobby-wrapper .lobby-lotto-comingsoon ul li .comingsoon-right .time-box {
    display: inline-flex;
    flex-direction: column;
  }
  .lobby-wrapper
    .lobby-lotto-comingsoon
    ul
    li
    .comingsoon-right
    .time-box
    .time-1 {
    color: #1e1e1e;
    font-size: 12px;
    font-weight: 600;
    line-height: normal;
    text-align: center;
  }
  .lobby-wrapper
    .lobby-lotto-comingsoon
    ul
    li
    .comingsoon-right
    .time-box
    .time-1
    span {
    display: inline-block;
    min-width: 120px;
    height: 16px;
    background: rgb(239, 211, 105);
    background: -moz-linear-gradient(
      90deg,
      rgba(239, 211, 105, 1) 0%,
      rgba(255, 247, 145, 1) 25%,
      rgba(239, 191, 93, 1) 50%,
      rgba(255, 247, 145, 1) 75%,
      rgba(239, 211, 105, 1) 100%
    );
    background: -webkit-linear-gradient(
      90deg,
      rgba(239, 211, 105, 1) 0%,
      rgba(255, 247, 145, 1) 25%,
      rgba(239, 191, 93, 1) 50%,
      rgba(255, 247, 145, 1) 75%,
      rgba(239, 211, 105, 1) 100%
    );
    background: linear-gradient(
      90deg,
      rgba(239, 211, 105, 1) 0%,
      rgba(255, 247, 145, 1) 25%,
      rgba(239, 191, 93, 1) 50%,
      rgba(255, 247, 145, 1) 75%,
      rgba(239, 211, 105, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#efd369",endColorstr="#efd369",GradientType=1);
    border-radius: 4px;
  }
  .lobby-wrapper
    .lobby-lotto-comingsoon
    ul
    li
    .comingsoon-right
    .time-box
    .time-2 {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #ffffff;
    font-family: "Sukhumvit Tadmai";
    font-size: 16px;
    font-weight: 750;
    line-height: normal;
    letter-spacing: 0.8px;
    text-align: center;
  }
  @media (min-width: 1200px) {
    .row-dash {
      margin-left: -5px;
      margin-right: -5px;
    }
    .row-dash > * {
      padding-left: 5px;
      padding-right: 5px;
    }
    .lobby-wrapper .bet-time-box {
      margin: 0 0 10px;
    }
    .lobby-wrapper .lobby-nav-box .nav-box {
      height: 66px;
      flex: 0 0 calc(50% - 1px);
    }
    .lobby-wrapper .lobby-lotto-comingsoon ul li {
      flex: 0 0 calc(50% - 2.5px);
    }
  }
  
  /* promotions */
  .promotions-wrapper .promotions-box {
    margin-bottom: 20px;
  }
  .promotions-wrapper .promotions-box .promotions-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
  }
  .promotions-wrapper .promotions-box .promotions-list .promotions-item {
    background: #ffffff;
    border-radius: 4px;
    padding-top: 15px;
    padding-bottom: 15px;
  }
  .promotions-wrapper .promotions-box .promotions-list .promotions-item .title {
    color: #195bd6;
    font-family: "Sukhumvit Tadmai";
    font-size: 18px;
    font-weight: 700;
    line-height: normal;
  }
  .promotions-wrapper .promotions-box .promotions-list .promotions-item .content {
    color: #1e1e1e;
    font-size: 16px;
    font-weight: 500;
    line-height: normal;
    margin-top: 10px;
  }
  .promotions-wrapper .btn-box {
    display: inline-flex;
    margin-top: 10px;
  }
  .promotions-wrapper .btn-custom {
    display: inline-flex;
    justify-content: center;
    flex: 0 1 100%;
    gap: 10px;
    min-width: 100px;
    font-family: "Sukhumvit Tadmai";
    font-size: 16px;
    font-weight: bold;
    line-height: normal;
    text-decoration: none;
    border-radius: 4px;
    border: none;
    box-shadow: 0px -2px 0px 0px rgba(0, 0, 0, 0.12) inset;
    filter: drop-shadow(0px 1px 2.8px rgba(106, 106, 106, 0.4));
    padding: 6px 10px;
    cursor: pointer;
  }
  .promotions-wrapper .btn-custom.btn-cus-green {
    color: #ffffff;
    background: #06c755;
  }
  
  /* payrate */
  .payrate-wrapper .payrate-box .row {
    margin-left: -8px;
    margin-right: -8px;
  }
  .payrate-wrapper .payrate-box .row > div {
    padding-left: 8px;
    padding-right: 8px;
  }
  .payrate-card {
    background: rgb(25, 91, 214);
    background: -moz-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: -webkit-linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: linear-gradient(
      90deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#195bd6",endColorstr="#2683ef",GradientType=1);
    border-radius: 4px;
    overflow: hidden;
  }
  .payrate-card .payrate-title {
    display: flex;
    align-items: center;
    gap: 10px;
    height: 40px;
    padding: 0 10px;
  }
  .payrate-card .payrate-title .title {
    color: #ffffff;
    font-family: "Sukhumvit Tadmai";
    font-size: 18px;
    font-weight: bold;
    line-height: normal;
  }
  .payrate-card .payrate-table table {
    table-layout: fixed;
    font-size: 16px;
  }
  .payrate-card .payrate-table table thead th {
    background: #bcdbff;
  }
  .payrate-card .payrate-table table tbody {
    font-size: 16px;
    font-weight: bold;
    vertical-align: baseline;
  }
  .payrate-card .payrate-table table tbody td {
    color: #195bd6;
  }
  .payrate-card .payrate-table .t-small {
    font-size: 12px;
    font-weight: normal;
  }
  /*** body end ***/
  
  /*** footer start ***/
  footer .foot-wrapper {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 3;
  }
  footer .foot-wrapper .foot-inner {
    display: flex;
    justify-content: center;
  }
  footer .foot-copyrights {
    padding-bottom: 114px;
    background: rgb(30, 30, 30);
    background: -moz-linear-gradient(
      360deg,
      rgba(30, 30, 30, 1) 0%,
      rgba(66, 66, 66, 1) 100%
    );
    background: -webkit-linear-gradient(
      360deg,
      rgba(30, 30, 30, 1) 0%,
      rgba(66, 66, 66, 1) 100%
    );
    background: linear-gradient(
      360deg,
      rgba(30, 30, 30, 1) 0%,
      rgba(66, 66, 66, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#1e1e1e",endColorstr="#424242",GradientType=1);
  }
  footer .foot-copyrights .copyrights {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 45px;
    color: #ffffff;
    font-size: 18px;
    font-weight: 400;
    line-height: normal;
  }
  @media (min-width: 1200px) {
    footer .foot-copyrights {
      padding-bottom: 0;
    }
  }
  
  /* foot menu */
  .foot-nav {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
    background: #121212;
    width: 100%;
    max-width: 440px;
    height: 90px;
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;
    padding: 0;
    margin: 0;
  }
  .foot-nav li {
    list-style: none;
  }
  .foot-nav li a {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 7px;
    color: #929292;
    font-size: 13px;
    font-weight: 500;
    line-height: normal;
    text-decoration: none;
    text-align: center;
  }
  .foot-nav li.center-circle a {
    width: 97px;
    height: 97px;
    position: relative;
    top: -24px;
    color: #ffffff;
    font-size: 15px;
  }
  .foot-nav li.center-circle a::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1;
    background: rgb(25, 91, 214);
    background: -moz-linear-gradient(
      360deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: -webkit-linear-gradient(
      360deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: linear-gradient(
      360deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#195bd6",endColorstr="#2683ef",GradientType=1);
    border-radius: 50%;
  }
  .foot-nav li.center-circle a::after {
    content: "";
    position: absolute;
    top: 5px;
    bottom: 5px;
    left: 5px;
    right: 5px;
    z-index: 2;
    background: rgb(25, 91, 214);
    background: -moz-linear-gradient(
      180deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: -webkit-linear-gradient(
      180deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    background: linear-gradient(
      180deg,
      rgba(25, 91, 214, 1) 0%,
      rgba(38, 131, 239, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#195bd6",endColorstr="#2683ef",GradientType=1);
    border-radius: 50%;
  }
  .foot-nav li a:hover {
    color: #2683ef;
  }
  .foot-nav li.center-circle a:hover {
    color: #ffdd53;
  }
  .foot-nav li a .foot-icon {
    width: 29px;
    height: 29px;
  }
  .foot-nav li.center-circle a .foot-icon {
    position: relative;
    z-index: 3;
  }
  .foot-nav li a .icon-lotto {
    background: url("../image/icon/icon-lotto.svg") no-repeat center / contain;
  }
  .foot-nav li a .icon-money {
    background: url("../image/icon/icon-money-bag.svg") no-repeat center / contain;
  }
  .foot-nav li a .icon-home {
    background: url("../image/icon/icon-home.svg") no-repeat center / contain;
  }
  .foot-nav li a .icon-prize {
    background: url("../image/icon/icon-promotion-3.svg") no-repeat center /
      contain;
  }
  .foot-nav li a .icon-telephone {
    background: url("../image/icon/icon-telephone.svg") no-repeat center / contain;
  }
  .foot-nav li a:hover .icon-lotto {
    background: #2683ef;
    mask: url("../image/icon/icon-lotto.svg") no-repeat center / contain;
    -webkit-mask: url("../image/icon/icon-lotto.svg") no-repeat center / contain;
  }
  .foot-nav li a:hover .icon-money {
    background: #2683ef;
    mask: url("../image/icon/icon-money-bag.svg") no-repeat center / contain;
    -webkit-mask: url("../image/icon/icon-money-bag.svg") no-repeat center /
      contain;
  }
  .foot-nav li a:hover .icon-home {
    background: #ffdd53;
    mask: url("../image/icon/icon-home.svg") no-repeat center / contain;
    -webkit-mask: url("../image/icon/icon-home.svg") no-repeat center / contain;
  }
  .foot-nav li a:hover .icon-prize {
    background: #2683ef;
    mask: url("../image/icon/icon-promotion-3.svg") no-repeat center / contain;
    -webkit-mask: url("../image/icon/icon-promotion-3.svg") no-repeat center /
      contain;
  }
  .foot-nav li a:hover .icon-telephone {
    background: #2683ef;
    mask: url("../image/icon/icon-telephone.svg") no-repeat center / contain;
    -webkit-mask: url("../image/icon/icon-telephone.svg") no-repeat center /
      contain;
  }
  .foot-nav li.center-circle a span {
    position: relative;
    z-index: 3;
  }
  /*** footer end ***/

  /* ======Dropdown Bank Logo====== */
.custom-select-wrapper {
  position: relative;
  width: 100%;
}

.custom-select {
  position: relative;
  background: #fff;
  border: 1px solid #ccc;
  padding: 0 0 0 0;
  border-radius: 6px;
  cursor: pointer;
}

.custom-select-trigger {
  color: #797979;
  display: flex;
  align-items: center;
  padding: 8px 10px;
  /* background: url(./images/icon/input-bank-account.svg) #f6f7f8 no-repeat 15px / 17px 17px; */
  background-color: #f0f7ff;
  border-radius: 6px;
  border: 1px solid #7ab7ff;
}

.custom-select-trigger img.bank-icon {
  width: 24px;
  height: 24px;
  margin-right: 8px;
}

.custom-options {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: #fff;
  border: 1px solid #7ab7ff;
  border-radius: 6px;
  max-height: 200px;
  overflow-y: auto;
  z-index: 99;
}

.custom-option {
  padding: 8px 10px;
  display: flex;
  align-items: center;
}

.custom-option:hover {
  background: #f0f0f0;
}

.custom-option img.bank-icon {
  width: 24px;
  height: 24px;
  margin-right: 8px;
}

.custom-select.open .custom-options {
  display: block;
}
/* ======Dropdown Bank Logo====== */