*,:before,:after {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x: ;
  --tw-pan-y: ;
  --tw-pinch-zoom: ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position: ;
  --tw-gradient-via-position: ;
  --tw-gradient-to-position: ;
  --tw-ordinal: ;
  --tw-slashed-zero: ;
  --tw-numeric-figure: ;
  --tw-numeric-spacing: ;
  --tw-numeric-fraction: ;
  --tw-ring-inset: ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / .5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur: ;
  --tw-brightness: ;
  --tw-contrast: ;
  --tw-grayscale: ;
  --tw-hue-rotate: ;
  --tw-invert: ;
  --tw-saturate: ;
  --tw-sepia: ;
  --tw-drop-shadow: ;
  --tw-backdrop-blur: ;
  --tw-backdrop-brightness: ;
  --tw-backdrop-contrast: ;
  --tw-backdrop-grayscale: ;
  --tw-backdrop-hue-rotate: ;
  --tw-backdrop-invert: ;
  --tw-backdrop-opacity: ;
  --tw-backdrop-saturate: ;
  --tw-backdrop-sepia: ;
  --tw-contain-size: ;
  --tw-contain-layout: ;
  --tw-contain-paint: ;
  --tw-contain-style:
}

::backdrop {
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x: ;
  --tw-pan-y: ;
  --tw-pinch-zoom: ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position: ;
  --tw-gradient-via-position: ;
  --tw-gradient-to-position: ;
  --tw-ordinal: ;
  --tw-slashed-zero: ;
  --tw-numeric-figure: ;
  --tw-numeric-spacing: ;
  --tw-numeric-fraction: ;
  --tw-ring-inset: ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / .5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur: ;
  --tw-brightness: ;
  --tw-contrast: ;
  --tw-grayscale: ;
  --tw-hue-rotate: ;
  --tw-invert: ;
  --tw-saturate: ;
  --tw-sepia: ;
  --tw-drop-shadow: ;
  --tw-backdrop-blur: ;
  --tw-backdrop-brightness: ;
  --tw-backdrop-contrast: ;
  --tw-backdrop-grayscale: ;
  --tw-backdrop-hue-rotate: ;
  --tw-backdrop-invert: ;
  --tw-backdrop-opacity: ;
  --tw-backdrop-saturate: ;
  --tw-backdrop-sepia: ;
  --tw-contain-size: ;
  --tw-contain-layout: ;
  --tw-contain-paint: ;
  --tw-contain-style:
}

*,:before,:after {
  box-sizing: border-box;
  border-width: 0;
  border-style: solid;
  border-color: #e5e7eb
}

:before,:after {
  --tw-content: ""
}

html,:host {
  line-height: 1.5;
  -webkit-text-size-adjust: 100%;
  -moz-tab-size: 4;
  -o-tab-size: 4;
  tab-size: 4;
  font-family: ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";
  font-feature-settings: normal;
  font-variation-settings: normal;
  -webkit-tap-highlight-color: transparent
}

body {
  margin: 0;
  line-height: inherit
}

hr {
  height: 0;
  color: inherit;
  border-top-width: 1px
}

abbr:where([title]) {
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted
}

h1,h2,h3,h4,h5,h6 {
  font-size: inherit;
  font-weight: inherit
}

a {
  color: inherit;
  text-decoration: inherit
}

b,strong {
  font-weight: bolder
}

code,kbd,samp,pre {
  font-family: ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;
  font-feature-settings: normal;
  font-variation-settings: normal;
  font-size: 1em
}

small {
  font-size: 80%
}

sub,sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline
}

sub {
  bottom: -.25em
}

sup {
  top: -.5em
}

table {
  text-indent: 0;
  border-color: inherit;
  border-collapse: collapse
}

button,input,optgroup,select,textarea {
  font-family: inherit;
  font-feature-settings: inherit;
  font-variation-settings: inherit;
  font-size: 100%;
  font-weight: inherit;
  line-height: inherit;
  letter-spacing: inherit;
  color: inherit;
  margin: 0;
  padding: 0
}

button,select {
  text-transform: none
}

button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]) {
  -webkit-appearance: button;
  background-color: transparent;
  background-image: none
}

:-moz-focusring {
  outline: auto
}

:-moz-ui-invalid {
  box-shadow: none
}

progress {
  vertical-align: baseline
}

::-webkit-inner-spin-button,::-webkit-outer-spin-button {
  height: auto
}

[type=search] {
  -webkit-appearance: textfield;
  outline-offset: -2px
}

::-webkit-search-decoration {
  -webkit-appearance: none
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit
}

summary {
  display: list-item
}

blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre {
  margin: 0
}

fieldset {
  margin: 0;
  padding: 0
}

legend {
  padding: 0
}

ol,ul,menu {
  list-style: none;
  margin: 0;
  padding: 0
}

dialog {
  padding: 0
}

textarea {
  resize: vertical
}

input::-moz-placeholder,textarea::-moz-placeholder {
  opacity: 1;
  color: #9ca3af
}

input::placeholder,textarea::placeholder {
  opacity: 1;
  color: #9ca3af
}

button,[role=button] {
  cursor: pointer
}

:disabled {
  cursor: default
}

img,svg,video,canvas,audio,iframe,embed,object {
  display: block;
  vertical-align: middle
}

img,video {
  max-width: 100%;
  height: auto
}

[hidden]:where(:not([hidden=until-found])) {
  display: none
}

.fixed {
  position: fixed
}

.absolute {
  position: absolute
}

.relative {
  position: relative
}

.bottom-0 {
  bottom: 0
}

.bottom-4 {
  bottom: 1rem
}

.bottom-\[12\%\] {
  bottom: 12%
}

.bottom-\[141px\] {
  bottom: 141px
}

.bottom-\[16px\] {
  bottom: 16px
}

.left-0 {
  left: 0
}

.left-\[-200px\] {
  left: -200px
}

.left-\[25\%\] {
  left: 25%
}

.left-\[4\%\] {
  left: 4%
}

.left-\[46\%\] {
  left: 46%
}

.left-\[70px\] {
  left: 70px
}

.right-0,.right-\[0px\] {
  right: 0
}

.right-\[16px\] {
  right: 16px
}

.top-0 {
  top: 0
}

.top-\[-10px\] {
  top: -10px
}

.top-\[-2px\] {
  top: -2px
}

.top-\[-50px\] {
  top: -50px
}

.top-\[10px\] {
  top: 10px
}

.top-\[130px\] {
  top: 130px
}

.z-10 {
  z-index: 10
}

.z-30 {
  z-index: 30
}

.z-50 {
  z-index: 50
}

.z-\[10\] {
  z-index: 10
}

.z-\[1\] {
  z-index: 1
}

.z-\[200\] {
  z-index: 200
}

.z-\[2\] {
  z-index: 2
}

.z-\[30\] {
  z-index: 30
}

.z-\[80\] {
  z-index: 80
}

.z-\[999\] {
  z-index: 999
}

.mx-2 {
  margin-left: 2rem;
  margin-right: 2rem
}


.mx-\[5px\] {
  margin-left: 5px;
  margin-right: 5px
}

.mb-\[10px\] {
  margin-bottom: 10px
}

.mb-\[12px\] {
  margin-bottom: 12px
}

.mb-\[39px\] {
  margin-bottom: 39px
}

.mb-\[40px\] {
  margin-bottom: 40px
}

.mb-\[4px\] {
  margin-bottom: 4px
}

.mb-\[6px\] {
  margin-bottom: 6px
}

.mb-\[8px\] {
  margin-bottom: 8px
}

.ml-6 {
  margin-left: 1.5rem
}

.ml-\[100px\] {
  margin-left: 100px
}

.ml-\[12px\] {
  margin-left: 12px
}

.ml-\[14px\] {
  margin-left: 14px
}

.ml-\[20px\] {
  margin-left: 20px
}

.ml-\[6px\] {
  margin-left: 6px
}

.mr-\[10px\] {
  margin-right: 10px
}

.mr-\[12px\] {
  margin-right: 12px
}

.mt-2 {
  margin-top: .5rem
}

.mt-3 {
  margin-top: .75rem
}

.mt-4 {
  margin-top: 1rem
}

.mt-\[119px\] {
  margin-top: 119px
}

.mt-\[12px\] {
  margin-top: 12px
}

.mt-\[16px\] {
  margin-top: 16px
}

.mt-\[18px\] {
  margin-top: 18px
}

.mt-\[20px\] {
  margin-top: 20px
}

.mt-\[24px\] {
  margin-top: 24px
}

.mt-\[2px\] {
  margin-top: 2px
}

.mt-\[32px\] {
  margin-top: 32px
}

.mt-\[35px\] {
  margin-top: 35px
}

.mt-\[36px\] {
  margin-top: 36px
}

.mt-\[37px\] {
  margin-top: 37px
}

.mt-\[38px\] {
  margin-top: 38px
}

.mt-\[40px\] {
  margin-top: 40px
}

.mt-\[42px\] {
  margin-top: 42px
}

.mt-\[48px\] {
  margin-top: 48px
}

.mt-\[4px\] {
  margin-top: 4px
}

.mt-\[50px\] {
  margin-top: 50px
}

.mt-\[5px\] {
  margin-top: 5px
}

.mt-\[6px\] {
  margin-top: 6px
}

.mt-\[70px\] {
  margin-top: 70px
}

.mt-\[8px\] {
  margin-top: 8px
}

.flex {
  display: flex
}

.grid {
  display: grid
}

.size-\[12px\] {
  width: 12px;
  height: 12px
}

.size-\[14px\] {
  width: 14px;
  height: 14px
}

.size-\[16px\] {
  width: 16px;
  height: 16px
}

.size-\[20px\] {
  width: 20px;
  height: 20px
}

.size-\[22px\] {
  width: 22px;
  height: 22px
}

.size-\[28px\] {
  width: 28px;
  height: 28px
}

.size-\[30px\] {
  width: 30px;
  height: 30px
}

.size-\[32px\] {
  width: 32px;
  height: 32px
}

.size-\[42px\] {
  width: 42px;
  height: 42px
}

.size-\[44px\] {
  width: 44px;
  height: 44px
}

.size-\[72px\] {
  width: 72px;
  height: 72px
}

.h-7 {
  height: 1.75rem
}

.h-\[150px\] {
  height: 150px
}

.h-\[16px\] {
  height: 16px
}

.h-\[20px\] {
  height: 20px
}

.h-\[22px\] {
  height: 22px
}

.h-\[27px\] {
  height: 27px
}

.h-\[28px\] {
  height: 28px
}

.h-\[36\.00px\] {
  height: 36px
}

.h-\[40px\] {
  height: 40px
}

.h-\[48px\] {
  height: 48px
}

.h-\[80px\] {
  height: 80px
}

.h-auto {
  height: auto
}

.w-6 {
  width: 1.5rem
}

.w-\[10\%\] {
  width: 10%
}

.w-\[100\%\] {
  width: 100%
}

.w-\[100px\] {
  width: 100px
}

.w-\[1200px\] {
  width: 1200px
}

.w-\[155px\] {
  width: 155px
}

.w-\[180px\] {
  width: 180px
}

.w-\[28px\] {
  width: 28px
}

.w-\[30\%\] {
  width: 30%
}

.w-\[300px\] {
  width: 300px
}

.w-\[40\%\] {
  width: 40%
}

.w-\[55\%\] {
  width: 55%
}

.w-full {
  width: 100%
}

.max-w-full {
  max-width: 100%
}

.flex-1 {
  flex: 1 1 0%
}

.cursor-pointer {
  cursor: pointer
}

.resize {
  resize: both
}

.grid-cols-2 {
  grid-template-columns: repeat(2,minmax(0,1fr))
}

.grid-cols-3 {
  grid-template-columns: repeat(3,minmax(0,1fr))
}

.grid-cols-4 {
  grid-template-columns: repeat(4,minmax(0,1fr))
}

.grid-cols-5 {
  grid-template-columns: repeat(5,minmax(0,1fr))
}

.flex-col {
  flex-direction: column
}

.items-center {
  align-items: center
}

.justify-start {
  justify-content: flex-start
}

.justify-center {
  justify-content: center
}

.justify-between {
  justify-content: space-between
}

.justify-around {
  justify-content: space-around
}

.gap-5 {
  gap: 1.25rem
}

.gap-1 {
  gap: 0.25rem
}

.gap-2 {
  gap: 0.5rem
}

.gap-3 {
  gap: 0.75rem
}

.gap-4 {
  gap: 1.00rem
}

.gap-\[10px\] {
  gap: 10px
}

.gap-\[12px\] {
  gap: 12px
}

.gap-\[18px\] {
  gap: 18px
}

.gap-\[8px\] {
  gap: 8px
}

.self-center {
  align-self: center
}

.overflow-hidden {
  overflow: hidden
}

.rounded-\[16px\] {
  border-radius: 16px
}

.rounded-\[22px\] {
  border-radius: 22px
}

.rounded-\[48px\] {
  border-radius: 48px
}

.rounded-\[8px\] {
  border-radius: 8px
}

.bg-\[\#1A1A1A\;\] {
  background-color: #1a1a1a
}

.bg-\[\#1A1A1A\],.bg-\[\#1a1a1a\] {
  --tw-bg-opacity: 1;
  background-color: rgb(26 26 26 / var(--tw-bg-opacity, 1))
}

.bg-\[\#935b22\] {
  --tw-bg-opacity: 1;
  background-color: rgb(147 91 34 / var(--tw-bg-opacity, 1))
}

.bg-\[\#FED980\] {
  --tw-bg-opacity: 1;
  background-color: rgb(254 217 128 / var(--tw-bg-opacity, 1))
}

.bg-\[rgba\(254\,217\,128\,0\.2\)\] {
  background-color: #fed98033
}

.bg-\[rgba\(254\,217\,128\,0\.3\)\] {
  background-color: #fed9804d
}

.bg-\[rgba\(254\,217\,128\,0\.5\)\] {
  background-color: #fed98080
}

.bg-\[rgba\(254\,217\,128\,0\.7\)\] {
  background-color: #fed980b3
}

.bg-black {
  --tw-bg-opacity: 1;
  background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1))
}

.bg-white {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1))
}

.bg-gradient-to-b {
  background-image: linear-gradient(to bottom,var(--tw-gradient-stops))
}

.from-\[\#bd731e\] {
  --tw-gradient-from: #bd731e var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(189 115 30 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}

.from-\[\#fdfdfb\] {
  --tw-gradient-from: #fdfdfb var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(253 253 251 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}

.to-\[\#3b1c07\] {
  --tw-gradient-to: #3b1c07 var(--tw-gradient-to-position)
}

.to-\[\#fed980\] {
  --tw-gradient-to: #fed980 var(--tw-gradient-to-position)
}

.object-cover {
  -o-object-fit: cover;
  object-fit: cover
}

.p-\[10px\] {
  padding: 10px
}

.p-\[16px\] {
  padding: 16px
}

.p-\[6px\] {
  padding: 6px
}

.px-2 {
  padding-right: 2rem;
  padding-left: 2rem;
}

.px-\[10px\] {
  padding-left: 10px;
  padding-right: 10px
}

.px-\[12px\] {
  padding-left: 12px;
  padding-right: 12px
}

.px-\[16px\] {
  padding-left: 16px;
  padding-right: 16px
}

.px-\[20px\] {
  padding-left: 20px;
  padding-right: 20px
}

.px-\[24\.5px\] {
  padding-left: 24.5px;
  padding-right: 24.5px
}

.px-\[32px\] {
  padding-left: 32px;
  padding-right: 32px
}

.px-\[37\.5px\] {
  padding-left: 37.5px;
  padding-right: 37.5px
}

.py-\[12px\] {
  padding-top: 12px;
  padding-bottom: 12px
}

.py-\[16px\] {
  padding-top: 16px;
  padding-bottom: 16px
}

.pb-\[12px\] {
  padding-bottom: 12px
}

.pb-\[80px\] {
  padding-bottom: 80px
}

.pl-\[40px\] {
  padding-left: 40px
}

.pr-\[12px\] {
  padding-right: 12px
}

.pr-\[24px\] {
  padding-right: 24px
}

.pt-0 {
  padding-top: 0
}

.pt-\[16px\] {
  padding-top: 16px
}

.pt-\[20px\] {
  padding-top: 20px
}

.pt-\[30px\] {
  padding-top: 30px
}

.pt-\[4px\] {
  padding-top: 4px
}

.text-left {
  text-align: left
}

.text-center {
  text-align: center
}

.text-justify {
  text-align: justify
}

.text-\[10px\] {
  font-size: 10px
}

.text-\[12px\] {
  font-size: 12px
}

.text-\[14px\] {
  font-size: 14px
}

.text-\[16px\] {
  font-size: 16px
}

.text-\[20px\] {
  font-size: 20px
}

.text-\[clamp\(4px\,2vw\,8px\)\] {
  font-size: clamp(4px,2vw,8px)
}

.text-\[clamp\(6px\,2vw\,10px\)\] {
  font-size: clamp(6px,2vw,10px)
}

.font-\[500\] {
  font-weight: 500
}

.font-bold {
  font-weight: 700
}

.font-medium {
  font-weight: 500
}

.font-normal {
  font-weight: 400
}

.leading-\[27px\] {
  line-height: 27px
}

.leading-\[28px\] {
  line-height: 28px
}

.leading-\[33px\] {
  line-height: 33px
}

.leading-\[40px\] {
  line-height: 40px
}

.text-\[\#935b22\] {
  --tw-text-opacity: 1;
  color: rgb(147 91 34 / var(--tw-text-opacity, 1))
}

.text-\[\#FED980\] {
  --tw-text-opacity: 1;
  color: rgb(254 217 128 / var(--tw-text-opacity, 1))
}

.text-\[\#acacac\] {
  --tw-text-opacity: 1;
  color: rgb(172 172 172 / var(--tw-text-opacity, 1))
}

.text-\[\#cccccc\] {
  --tw-text-opacity: 1;
  color: rgb(204 204 204 / var(--tw-text-opacity, 1))
}

.text-\[\#fed980\] {
  --tw-text-opacity: 1;
  color: rgb(254 217 128 / var(--tw-text-opacity, 1))
}

.text-white {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1))
}

.opacity-\[0\.8\] {
  opacity: .8
}

.shadow-\[0_2px_4px_rgba\(0\,0\,0\,0\.15\)\] {
  --tw-shadow: 0 2px 4px rgba(0,0,0,.15);
  --tw-shadow-colored: 0 2px 4px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)
}

.transition-opacity {
  transition-property: opacity;
  transition-timing-function: cubic-bezier(.4,0,.2,1);
  transition-duration: .15s
}

.duration-300 {
  transition-duration: .3s
}

* {
  padding: 0;
  margin: 0
}

.website {
  width: 100%;
  background: #000;
  display: flex;
  flex-direction: column;
  overflow: hidden
}

.BmOne {
  width: 100%;
  height: 300px;
  color: #1a1a1a;
  display: flex;
  color: wheat
}

.BmTwo {
  width: 100%;
  height: 104px;
  background: #935b22;
  display: flex
}

@media screen and (max-width: 768px) and (min-width: 686px) {
  .IPAD {
    width:686px;
    height: 1394px;
    background: #1a1a1a;
    border-radius: 12px;
    margin: 24px auto 0
  }
}

.BmOne_a {
  height: 20%;
  display: flex
}

.BmOneFirst1 {
  width: 40px;
  height: 40px
}

.BmOneFirst2 {
  height: 36px;
  font-family: Manrope,Manrope;
  font-weight: 500;
  font-size: 22px;
  color: #fff;
  line-height: 36px;
  text-align: justify;
  font-style: normal;
  margin-top: 36px;
  margin-left: 12px
}

.flex-container {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 12px
}

.box {
  border: 1px solid #979797;
  border-radius: 8px;
  padding: 10px;
  height: 42px;
  display: flex;
  align-items: center;
  justify-content: start;
  opacity: .8;
  flex-basis: calc(33.33% - 12px);
  min-width: 0
}

.BmOne_b {
  height: 60px;
  display: flex;
  gap: 12px;
  margin-top: 36px
}

.payment0 {
  background-image: url(../assets/payment/payment0.png) no-repeat;
  width: 100%
}

.BT {
  display: flex
}

.BOb1 {
  width: 164px;
  height: 60px;
  border-radius: 8px;
  border: 1px solid #979797;
  opacity: .6;
  display: flex;
  align-items: center
}

.Bob1_img {
  width: 28px;
  height: 28px;
  margin: 0 10px
}

.Bob1_font {
  width: 89px;
  height: 19px;
  font-family: Manrope,Manrope;
  font-weight: 700;
  font-size: 14px;
  color: #fff;
  line-height: 19px;
  text-align: justify;
  font-style: normal
}

.Bob1_font2 {
  width: 95px;
  height: 19px;
  font-family: Manrope,Manrope;
  font-weight: 400;
  font-size: 14px;
  color: #acacac;
  line-height: 19px;
  text-align: justify;
  font-style: normal
}

.BmOne_c {
  font-family: Manrope,Manrope;
  font-weight: 500;
  font-size: 16px;
  color: #acacac;
  line-height: 24px;
  text-align: justify;
  font-style: normal;
  margin-top: 24px
}

.BmOne_c1 {
  font-family: Manrope,Manrope;
  font-weight: 500;
  font-size: 8px;
  color: #acacac;
  line-height: 12px;
  text-align: justify;
  font-style: normal
}


.BackToTopBtn {
  opacity: 0;
  pointer-events: none;
}

.BackToTopBtn.show {
  opacity: 1;
  pointer-events: auto;
}

.BmTwo1 {
  display: flex
}

.BmTwo_One {
  width: 32px;
  height: 32px;
  margin-top: 36px
}

.BwTwo_Three-Font1 {
  font-family: Manrope,sans-serif;
  padding: 0;
  margin: 0;
  position: relative;
  z-index: 2;
  font-family: Manrope,Manrope;
  font-weight: 700;
  font-size: 20px;
  color: #935b22;
  line-height: 10px;
  text-align: center;
  font-style: normal
}

.BmTwo_Two {
  height: 30px;
  font-family: Manrope,Manrope;
  font-weight: 500;
  font-size: 22px;
  color: #fff;
  line-height: 30px;
  text-align: justify;
  font-style: normal;
  margin-top: 37px;
  margin-left: 8px
}

.BmTwo_Three {
  width: 382px;
  height: 56px;
  background: linear-gradient(180deg,#fdfdfb,#fed980);
  border-radius: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  margin-bottom: 15px;
  box-shadow: 0 3px 8px #00000040;
  position: relative;
  overflow: hidden;
  margin-top: 24px
}

.BmTwo_Three1 {
  width: 95%;
  height: 48px;
  margin: 24px auto 15px;
  background: linear-gradient(180deg,#fdfdfb,#fed980);
  border-radius: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  box-shadow: 0 3px 8px #00000040;
  position: relative;
  overflow: hidden
}

.BwTwo_Three-Font {
  font-family: Manrope,sans-serif;
  padding: 0;
  margin: 0;
  position: relative;
  z-index: 2;
  font-family: Manrope,Manrope;
  font-weight: 700;
  font-size: 20px;
  color: #935b22;
  line-height: 10px;
  text-align: center;
  font-style: normal
}

.BmTwo_Four {
  margin-top: 40px;
  display: flex
}

.BmTwo_Five {
  width: 152px;
  height: 24px;
  font-family: Manrope,Manrope;
  font-weight: 500;
  font-size: 18px;
  color: #fff;
  line-height: 24px;
  text-align: justify;
  font-style: normal;
  margin-left: 100px;
  cursor: pointer;
}

.BmTwo_Six {
  width: 46px;
  height: 24px;
  font-family: Manrope,Manrope;
  font-weight: 500;
  font-size: 18px;
  color: #fff;
  line-height: 24px;
  text-align: justify;
  font-style: normal;
  margin-left: 110px
}

.BmTwo_Seven {
  width: 64px;
  height: 64px;
  background: #fff;
  border-radius: 50%;
  margin-left: 276px;
  margin-top: 20px
}

.BmTwo_einght {
  width: 16px;
  height: 20px;
  margin: 24px
}

@media screen and (max-width: 768px) and (min-width: 686px) {
  .S1 Game {
    width:750px;
    height: 575px;
    background: #1a1a1a
  }

  .S1 Game .IMG {
    width: 40px;
    height: 40px
  }

  .S1 Game .TITLE1 {
    height: 32px;
    font-family: Manrope,Manrope;
    font-weight: 500;
    font-size: 28px;
    color: #fff;
    line-height: 32px;
    text-align: left;
    font-style: normal;
    margin-left: 8px
  }

  .S1 Game .TITLE2 {
    height: 32px;
    font-family: Manrope,Manrope;
    font-weight: 700;
    font-size: 24px;
    color: #fff;
    line-height: 32px;
    text-align: left;
    font-style: normal;
    margin-top: 53px
  }

  .S1 Game .IMG1 {
    width: 100px;
    height: 40px;
    margin-top: 28px
  }

  .S1 Game .IMG2 {
    width: 90px;
    height: 40px;
    margin-top: 28px
  }

  .S1 Game .IMG3 {
    width: 62px;
    height: 40px;
    margin-top: 28px
  }

  .S1 Game .S1 GameFLEX {
    margin-top: 67px;
    gap: 16px
  }

  .S1 Game .S1 GameFLEX .FLEX1 {
    width: 232px;
    height: 84px;
    border-radius: 12px;
    border: 1px solid #979797
  }

  .S1 Game .S1 GameFLEX .FLEX1 .IMG1 {
    height: 32px;
    width: 32px;
    position: relative;
    left: 10px;
    top: -15px
  }

  .S1 Game .S1 GameFLEX .FLEX1 .IMG2 {
    height: 32px;
    width: 32px;
    position: relative;
    left: 10px;
    top: -15px
  }

  .S1 Game .S1 GameFLEX .FLEX1 .IMG3 {
    height: 32px;
    width: 32px;
    position: relative;
    left: 10px;
    top: -15px
  }

  .S1 Game .S1 GameFLEX .FLEX1 .FLEX1P1 {
    height: 33px;
    font-family: Manrope,Manrope;
    font-weight: 700;
    font-size: 24px;
    color: #fff;
    line-height: 33px;
    text-align: justify;
    font-style: normal;
    position: relative;
    left: 15px
  }

  .S1 Game .S1 GameFLEX .FLEX1 .FLEX1P2 {
    height: 27px;
    font-family: Manrope,Manrope;
    font-weight: 400;
    font-size: 20px;
    color: #acacac;
    line-height: 27px;
    text-align: justify;
    font-style: normal;
    position: relative;
    left: 15px
  }

  .S1 Game .S1 GameFLEX .FLEX1 .FLEX1P3 {
    height: 33px;
    font-family: Manrope,Manrope;
    font-weight: 700;
    font-size: 24px;
    color: #fff;
    line-height: 33px;
    text-align: justify;
    font-style: normal;
    position: relative;
    left: 15px
  }

  .S1 Game .S1 GameFLEX .FLEX1 .FLEX1P4 {
    height: 27px;
    font-family: Manrope,Manrope;
    font-weight: 400;
    font-size: 20px;
    color: #acacac;
    line-height: 27px;
    text-align: left;
    font-style: normal;
    position: relative;
    left: 15px
  }

  .S1 Game .S1 GameFLEX .FLEX1 .FLEX1P5 {
    height: 33px;
    font-family: Manrope,Manrope;
    font-weight: 700;
    font-size: 24px;
    color: #fff;
    line-height: 33px;
    text-align: justify;
    font-style: normal;
    position: relative;
    left: 15px
  }

  .S1 Game .S1 GameFLEX .FLEX1 .FLEX1P6 {
    height: 27px;
    font-family: Manrope,Manrope;
    font-weight: 400;
    font-size: 20px;
    color: #acacac;
    line-height: 27px;
    text-align: justify;
    font-style: normal;
    position: relative;
    left: 15px
  }

  .S1 Game .S1 GameFLEX .FLEX3 {
    width: 190px;
    height: 84px;
    border-radius: 12px;
    border: 1px solid #979797
  }

  .S1 Game .S1 GameFLEX .FLEX3 .IMG1 {
    width: 32px;
    height: 32px;
    position: relative;
    left: 10px;
    top: -15px
  }

  .S1 Game .S1 GameFLEX .FLEX3 .FLEX3P1 {
    height: 33px;
    font-family: Manrope,Manrope;
    font-weight: 700;
    font-size: 24px;
    color: #fff;
    line-height: 33px;
    text-align: justify;
    font-style: normal;
    position: relative;
    left: 15px
  }

  .S1 Game .S1 GameFLEX .FLEX3 .FLEX3P2 {
    height: 27px;
    font-family: Manrope,Manrope;
    font-weight: 400;
    font-size: 20px;
    color: #acacac;
    line-height: 27px;
    text-align: left;
    font-style: normal;
    position: relative;
    left: 15px
  }

  .S1 GameCONTENT {
    width: 686px;
    height: 96px;
    font-family: Manrope,Manrope;
    font-weight: 500;
    font-size: 16px;
    color: #acacac;
    line-height: 24px;
    text-align: justify;
    font-style: normal;
    margin-top: 32px
  }
}

.ContentFone {
  width: 538px;
  height: 49px;
  font-family: Manrope,Manrope;
  font-weight: 700;
  font-size: 26px;
  color: #fed980;
  line-height: 49px;
  text-align: center;
  font-style: normal;
  padding-top: 70px;
  margin-left: 193px;
  margin-bottom: 40px
}

.Bbox {
  width: 446px;
  height: 273px;
  background: #1a1a1a;
  border-radius: 12px
}

.Bbox>div:first-child {
  padding: 25px 0 10px;
  align-items: center
}

.Bbox h4 {
  width: 196px;
  font-family: Manrope,Manrope;
  font-weight: 500;
  font-size: 16px;
  color: #fff;
  line-height: 27px;
  text-align: left;
  font-style: normal;
  margin: 0 126px 0 20px
}

.Bbox-small {
  width: 96%;
  height: 1px;
  background: #45494a;
  margin-left: 16px;
  margin-top: 5px
}

.Bbox-small1 {
  border-top: 1px dashed #45494a;
  width: 90%;
  margin-left: 20px
}

.TbTwo01 img,.TbTwo02 img,.TbTwo03 img,.TbTwo04 img {
  display: block;
  width: 84px
}

.CtOneimg {
  height: 60px;
  width: 60px
}

.Bbox-ul {
  padding-left: 16px;
  padding-top: 10px;
  list-style-type: none
}

.Bbox-li {
  background-repeat: no-repeat;
  color: #ccc;
  font-style: normal;
  font-size: 14px;
  line-height: 18px
}

.Cone {
  height: 49px;
  font-family: Manrope,Manrope;
  font-weight: 700;
  font-size: 36px;
  color: #fed980;
  line-height: 49px;
  text-align: center;
  font-style: normal;
  margin-top: 80px
}

.Cthree1 {
  width: 202px;
  height: 56px;
  background: linear-gradient(180deg,#fdfdfb,#fed980);
  border-radius: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  margin-bottom: 15px;
  box-shadow: 0 3px 8px #00000040;
  overflow: hidden
}

.Cthreefont {
  font-family: Manrope,sans-serif;
  padding: 0;
  margin: 0;
  position: relative;
  z-index: 2;
  font-family: Manrope,Manrope;
  font-weight: 700;
  font-size: 20px;
  color: #935b22;
  line-height: 10px;
  text-align: center;
  font-style: normal
}

.Donebox {
  width: 460px
}

.Donebbox-p1 {
  width: 426px;
  height: 49px;
  font-family: Manrope,Manrope;
  font-weight: 700;
  font-size: 32px;
  color: #fed980;
  line-height: 49px;
  font-style: normal;
  margin-top: 80px
}

.Donefont {
  width: 222px;
  height: 19px;
  font-family: Manrope,Manrope;
  font-weight: 500;
  font-size: 9px;
  color: #ccc;
  line-height: 19px;
  text-align: justify;
  font-style: normal
}

.Done1 {
  width: 202px;
  height: 56px;
  background: linear-gradient(180deg,#fdfdfb,#fed980);
  border-radius: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  margin-bottom: 15px;
  box-shadow: 0 3px 8px #00000040;
  position: relative;
  overflow: hidden
}

.Donefont1 {
  font-family: Manrope,sans-serif;
  padding: 0;
  margin: 0;
  position: relative;
  z-index: 2;
  font-family: Manrope,Manrope;
  font-weight: 700;
  font-size: 20px;
  color: #935b22;
  line-height: 10px;
  text-align: center;
  font-style: normal
}

.Eone {
  display: flex;
  flex-direction: column;
  align-items: center
}

.Eone-2 {
  height: 27px;
  font-family: Manrope,Manrope;
  font-weight: 500;
  font-size: 15px;
  color: #ccc;
  line-height: 27px;
  text-align: center;
  font-style: normal
}

.Etwo {
  height: 272px;
  display: flex;
  gap: 24px
}

.Etwo-box {
  width: 378px;
  height: 272px;
  background: #1a1a1a;
  display: flex
}

.Etwo-box2 {
  width: 522px;
  height: 272px;
  padding-top: 10px;
  background: #1a1a1a
}

.Etwo-box-a {
  width: 40%;
  height: 50%;
  padding-left: 32px;
  padding-top: 32px
}

.Etwo-box-b {
  width: 40%;
  padding-top: 32px
}

.Etwo-a-font1 {
  width: 58px;
  height: 22px;
  font-family: Manrope,Manrope;
  font-weight: 500;
  font-size: 18px;
  color: #fff;
  line-height: 22px;
  text-align: justify;
  font-style: normal
}

.Etwo-a-font11 {
  width: 58px;
  height: 22px;
  font-family: Manrope,Manrope;
  font-weight: 500;
  font-size: 10px;
  color: #fff;
  line-height: 22px;
  text-align: justify;
  font-style: normal
}

.Etwo-a-font2 {
  width: 56px;
  height: 49px;
  font-family: Manrope,Manrope;
  font-weight: 700;
  font-size: 36px;
  color: #fff;
  line-height: 49px;
  text-align: justify;
  font-style: normal
}

.Etwo-a-font21 {
  width: 56px;
  height: 49px;
  font-family: Manrope,Manrope;
  font-weight: 700;
  font-size: 18px;
  color: #fff;
  line-height: 49px;
  text-align: justify;
  font-style: normal
}

.Etwo-a-font4 {
  width: 83px;
  height: 19px;
  font-family: Manrope,Manrope;
  font-weight: 500;
  font-size: 12px;
  color: #acacac;
  line-height: 19px;
  font-style: normal
}

.Etwo-a-font41 {
  width: 83px;
  height: 19px;
  font-family: Manrope,Manrope;
  font-weight: 500;
  font-size: 10px;
  color: #acacac;
  line-height: 19px;
  font-style: normal
}

.Etwo-b-font {
  width: 9px;
  height: 19px;
  font-family: Manrope,Manrope;
  font-weight: 500;
  font-size: 16px;
  color: #acacac;
  line-height: 19px;
  text-align: justify;
  font-style: normal
}

.Etwo-b-font1 {
  width: 9px;
  height: 19px;
  font-family: Manrope,Manrope;
  font-weight: 500;
  font-size: 10px;
  color: #acacac;
  line-height: 19px;
  text-align: justify;
  font-style: normal
}

.Etwo-b-box1 {
  position: relative;
  left: 15px;
  top: -15px;
  width: 17px;
  height: 10px;
  background: #fed98033
}

.Etwo-b-box2 {
  position: relative;
  left: 15px;
  top: -15px;
  width: 17px;
  height: 10px;
  background: #fed9804d
}

.Etwo-b-box3 {
  position: relative;
  left: 15px;
  top: -15px;
  width: 50px;
  height: 10px;
  background: #fed98080
}

.Etwo-b-box4 {
  position: relative;
  left: 15px;
  top: -15px;
  width: 66px;
  height: 10px;
  background: #fed980b3
}

.Etwo-b-box5 {
  position: relative;
  left: 15px;
  top: -15px;
  width: 160px;
  height: 10px;
  background: #fed980
}

.Etwo-box2-c {
  width: 522px;
  display: flex
}

.Etwo-box2-c-A {
  padding-left: 12px
}

.EbcA-01 {
  height: 27px;
  font-family: Manrope,Manrope;
  font-weight: 500;
  font-size: 20px;
  color: #fff;
  line-height: 27px;
  text-align: justify;
  font-style: normal
}

.EbcA-011 {
  font-family: Manrope,Manrope;
  font-weight: 500;
  font-size: 12px;
  color: #fff;
  line-height: 16px;
  text-align: justify;
  font-style: normal
}

.EbcA-02 {
  height: 22px;
  font-family: Manrope,Manrope;
  font-weight: 500;
  font-size: 16px;
  color: #e5300f;
  line-height: 22px;
  text-align: justify;
  font-style: normal
}

.EbcA-022 {
  font-family: Manrope,Manrope;
  font-weight: 500;
  font-size: 10px;
  color: #e5300f;
  line-height: 14px;
  text-align: justify;
  font-style: normal
}

.Ebcb01 {
  background: linear-gradient(180deg,#fdfdfb,#fed980);
  border-radius: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  margin-bottom: 15px;
  box-shadow: 0 3px 8px #00000040;
  position: relative;
  overflow: hidden;
  width: 80px;
  height: 32px;
  margin-left: 33px;
  margin-top: 10px
}

.Ebcb011 {
  background: linear-gradient(180deg,#fdfdfb,#fed980);
  border-radius: 4px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  margin-bottom: 15px;
  box-shadow: 0 3px 8px #00000040;
  position: relative;
  overflow: hidden;
  width: 48px;
  height: 24px;
  margin-left: 33px
}

.Ebcb01_one {
  font-family: Manrope,sans-serif;
  padding: 0;
  margin: 0;
  position: relative;
  z-index: 2;
  font-family: Manrope,Manrope;
  font-weight: 700;
  font-size: 20px;
  color: #9d6161;
  line-height: 10px;
  text-align: center;
  font-style: normal
}

.Ebcb01_two {
  font-family: Manrope,sans-serif;
  padding: 0;
  margin: 0;
  position: relative;
  z-index: 2;
  font-family: Manrope,Manrope;
  font-weight: 700;
  font-size: 20px;
  color: #935b22;
  line-height: 10px;
  text-align: center;
  font-style: normal
}

.Ebcb01_two1 {
  font-family: Manrope,sans-serif;
  padding: 0;
  margin: 0;
  position: relative;
  z-index: 2;
  font-family: Manrope,Manrope;
  font-weight: 700;
  font-size: 10px;
  color: #935b22;
  line-height: 10px;
  text-align: center;
  font-style: normal
}

.Ebcb02 {
  margin-left: 120px;
  margin-top: 16px
}

.Ebcb02img1 {
  width: 24px;
  height: 24px
}

.Ebcb02img2 {
  width: 24px;
  height: 24px;
  margin-left: 12px
}

.Etwo-box2-d {
  width: 458px;
  font-family: Manrope,Manrope;
  font-weight: 500;
  font-size: 16px;
  color: #acacac;
  line-height: 24px;
  text-align: justify;
  font-style: normal;
  margin-left: 32px
}

.FoneTw-two {
  width: 188px;
  font-family: Manrope,Manrope;
  font-weight: 500;
  font-size: 16px;
  color: #fff;
  line-height: 44px;
  text-align: center;
  font-style: normal
}

.FoneTw-three {
  font-family: Manrope,Manrope;
  font-weight: 500;
  font-size: 15px;
  color: #ccc;
  line-height: 24px;
  text-align: center;
  font-style: normal;
  width: 868px
}

.Ftb_box {
  width: 217px;
  height: 101px
}

.app-details {
  margin-top: 82px
}

.DoneImg {
  margin-right: 16px
}

@media screen and (max-width: 768px) and (min-width: 686px) {
  .IMG1 {
    width:32px;
    height: 32px
  }

  .TEXT1 {
    width: 563px;
    height: 38px;
    font-family: Manrope,Manrope;
    font-weight: 500;
    font-size: 28px;
    color: #fff;
    line-height: 38px;
    text-align: left;
    font-style: normal
  }

  .CONTEXT1 {
    width: 605px;
    height: 66px;
    font-family: Manrope,Manrope;
    font-weight: 500;
    font-size: 24px;
    color: #ccc;
    line-height: 32px;
    font-style: normal
  }

  .IPadContent {
    font-family: Manrope,Manrope;
    font-weight: 700;
    font-size: 28px;
    color: #fed980;
    line-height: 32px;
    text-align: center;
    font-style: normal
  }

  .TRustMade {
    height: 27px;
    font-family: Manrope,Manrope;
    font-weight: 500;
    font-size: 20px;
    color: #ccc;
    line-height: 27px;
    text-align: justify;
    font-style: normal
  }

  .CRCRT {
    display: flex;
    align-items: start
  }

  .CRCRT img {
    margin-top: 10px
  }

  .CTHREE {
    width: 310px;
    height: 84px;
    background: linear-gradient(180deg,#fdfdfb,#fed980);
    border-radius: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    margin-bottom: 15px;
    box-shadow: 0 3px 8px #00000040;
    overflow: hidden
  }

  .CTHREEFONT {
    font-family: Manrope,sans-serif;
    padding: 0;
    margin: 0;
    position: relative;
    z-index: 2;
    font-family: Manrope,Manrope;
    font-weight: 700;
    font-size: 32px;
    color: #935b22;
    line-height: 10px;
    text-align: center;
    font-style: normal
  }

  .BESTFONT {
    height: 33px;
    font-family: Manrope,Manrope;
    font-weight: 500;
    font-size: 24px;
    color: #ccc;
    line-height: 33px;
    text-align: justify;
    font-style: normal
  }

  .TOPTEXT {
    width: 150px;
    height: 27px;
    font-family: Manrope,Manrope;
    font-weight: 500;
    font-size: 20px;
    color: #fff;
    line-height: 27px;
    text-align: center;
    font-style: normal
  }

  .Etwo-a-font11 {
    width: 58px;
    height: 22px;
    font-family: Manrope,Manrope;
    font-weight: 500;
    font-size: 20px;
    color: #fff;
    line-height: 27px;
    text-align: justify;
    font-style: normal
  }

  .Etwo-a-font21 {
    width: 56px;
    height: 49px;
    font-family: Manrope,Manrope;
    font-weight: 700;
    font-size: 36px;
    color: #fff;
    line-height: 49px;
    text-align: center;
    font-style: normal
  }

  .Etwo-a-font41 {
    width: 130px;
    height: 27px;
    font-family: Manrope,Manrope;
    font-weight: 500;
    font-size: 20px;
    color: #acacac;
    line-height: 27px;
    text-align: justify;
    font-style: normal
  }

  .PLAYACIMG {
    width: 60px;
    height: 60px
  }

  .EbcA-011 {
    width: 126px;
    height: 33px;
    font-family: Manrope,Manrope;
    font-weight: 500;
    font-size: 24px;
    color: #fff;
    line-height: 33px;
    text-align: justify;
    font-style: normal
  }

  .EbcA-022 {
    width: 137px;
    height: 27px;
    font-family: Manrope,Manrope;
    font-weight: 500;
    font-size: 20px;
    color: #e5300f;
    line-height: 27px;
    text-align: justify;
    font-style: normal
  }

  .Ebcb011 {
    background: linear-gradient(180deg,#fdfdfb,#fed980);
    border-radius: 4px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    margin-bottom: 15px;
    box-shadow: 0 3px 8px #00000040;
    position: relative;
    overflow: hidden;
    width: 96px;
    height: 48px;
    margin-left: 33px;
    margin-top: 10px
  }

  .Ebcb011 img {
    width: 24px;
    height: 24px
  }

  .Ebcb011 .Ebcb01_two1 {
    width: 37px;
    height: 33px;
    font-family: Manrope,Manrope;
    font-weight: 700;
    font-size: 24px;
    line-height: 33px;
    text-align: center;
    font-style: normal
  }

  .Ratings {
    width: 686px;
    height: 196px;
    background: #1a1a1a;
    border-radius: 12px;
    margin: 32px auto 24px
  }

  .PLAYAC {
    width: 686px;
    height: 282px;
    background: #1a1a1a;
    border-radius: 12px;
    margin: 24px auto
  }

  .PLAYACCONTXT {
    width: 678px;
    height: 150px;
    font-family: Manrope,Manrope;
    font-weight: 500;
    font-size: 20px;
    color: #acacac;
    line-height: 30px;
    text-align: justify;
    font-style: normal;
    margin-top: 24px
  }

  .READ {
    width: 686px;
    margin: 0 auto
  }

  .READ .READBOX1 {
    height: 32px;
    font-family: Manrope,Manrope;
    font-weight: 700;
    font-size: 28px;
    color: #fed980;
    line-height: 32px;
    text-align: left;
    font-style: normal
  }

  .READ .READBOX2 {
    height: 27px;
    font-family: Manrope,Manrope;
    font-weight: 500;
    font-size: 20px;
    color: #ccc;
    line-height: 27px;
    text-align: justify;
    font-style: normal
  }

  .READ .READBOX3 {
    width: 686px;
    height: 120px;
    font-family: Manrope,Manrope;
    font-weight: 500;
    font-size: 20px;
    color: #ccc;
    line-height: 30px;
    text-align: justify;
    font-style: normal
  }

  .JILI {
    width: 686px;
    margin: 32px auto 70px
  }

  .GRIDONE1 {
    display: grid;
    grid-template-columns: repeat(5,minmax(0,1fr));
    padding-left: 75px;
    padding-right: 75px;
    gap: 24px
  }

  .GRIDONE2 {
    display: grid;
    grid-template-columns: repeat(5,minmax(0,1fr));
    padding-left: 49px;
    padding-right: 49px;
    gap: 32px
  }
}

@keyframes zoom-in-out {
  0% {
    transform: scale(1)
  }

  50% {
    transform: scale(1.1)
  }

  to {
    transform: scale(1)
  }
}

@keyframes moneyPulse {
  0% {
    transform: scale(1)
  }

  50% {
    transform: scale(1.1)
  }

  to {
    transform: scale(.9)
  }
}

@keyframes slideFromLeft {
  0% {
    transform: translate(-800%) rotate(-40deg)
  }

  to {
    transform: translate(800%) rotate(-40deg)
  }
}

.HedaerTbOne {
  height: 622px;
  background: linear-gradient(180deg,#bd731e,#3b1c07);
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center
}

.Zflex_box {
  display: flex;
  top: 20px;
  width: 100%;
  position: relative;
  align-items: center;
  z-index: 1000
}

.TbOneImg1 {
  width: 44px;
  height: 44px
}

.TbOneFont1 {
  margin-left: 8px;
  font-family: Manrope,sans-serif;
  font-weight: 500;
  font-size: 28px;
  color: #fff;
  line-height: 32px;
  position: relative;
  z-index: 1000
}

.TbOneFont18 {
  margin-left: 8px;
  font-family: Manrope,sans-serif;
  font-weight: 500;
  font-size: 18px;
  color: #fff;
  line-height: 32px;
  position: relative;
  z-index: 1000
}

.main-content {
  z-index: 6;
  margin-top: 34px
}

.app-details {
  width: 100%
}

.TbOneFont2 {
  font-family: AvenirNext,sans-serif;
  font-weight: 800;
  font-size: 42px;
  line-height: 55px;
  color: transparent;
  background: linear-gradient(2deg,#fdfdfb 30%,#fed980);
  -webkit-background-clip: text;
  background-clip: text;
  text-shadow: 0px 2px 4px rgba(0,0,0,.15);
  position: relative;
  z-index: 1000
}

.TbOneFont3 {
  font-family: Manrope,sans-serif;
  font-weight: 500;
  font-size: 18px;
  color: #fff;
  margin: 15px 0 20px;
  text-shadow: 0px 1px 2px rgba(0,0,0,.4);
  position: relative;
  z-index: 1000
}

.TbOneBox1 {
  width: 200px;
  height: 50px;
  background: linear-gradient(180deg,#fdfdfb,#fed980);
  border-radius: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  margin-bottom: 15px;
  font-size: 20px;
  box-shadow: 0 3px 8px #00000040;
  position: relative;
  overflow: hidden
}

.btn-gradient {
  position: relative
}

.btn-gradient:after {
  content: "";
  position: absolute;
  top: 1.5px;
  left: 1.5px;
  width: calc(100% - 3px);
  height: calc(100% - 3px);
  background: linear-gradient(180deg,#7d4814,#754311);
  border-radius: 8px;
  z-index: 0
}

.btn-gradient>p {
  position: relative;
  z-index: 1;
  color: #fde3a1
}

.TbOneFont4 {
  font-family: Manrope,sans-serif;
  font-weight: 700;
  font-size: 20px;
  color: #935b22;
  text-align: center;
  padding: 0;
  margin: 0;
  position: relative;
  z-index: 2
}

.slanted-stripe {
  position: absolute;
  bottom: -30px;
  height: 200%;
  width: 50px;
  background-color: #fff9;
  transform: rotate(-30deg);
  z-index: 1;
  pointer-events: none;
  animation: slideFromLeft 3s linear infinite
}

.slanted-stripe2 {
  transform: translate(-800%) rotate(-40deg);
  animation-delay: 1.2s
}

.bonus-text {
  display: flex;
  align-items: center;
  margin: 10px 0 0
}

.TbOneFonto {
  font-size: 16px;
  margin-right: 5px
}

.TbOneFont5 {
  font-family: Manrope,sans-serif;
  font-weight: 500;
  font-size: 14px;
  color: #fed980
}

.casino-graphics {
  position: absolute;
  left: -50px;
  top: 40px;
  right: calc(50% - 680px);
  width: 550px;
  height: 350px;
  z-index: 5
}

.scatter-img {
  position: absolute;
  width: 120px;
  height: 120px;
  right: 50px;
  top: 170px
}

.money-img {
  position: absolute;
  width: 280px;
  height: 180px;
  right: -20px;
  top: 60px
}

.money-animation {
  animation: moneyPulse 3s infinite ease-in-out;
  transform-origin: center
}

/* 預設隱藏手機版 */
.mobile-content {
  display: none;
}

/* 小於 769px 時：隱藏桌機版，顯示手機版 */
@media (max-width: 768px) {
  .desktop-content {
    display: none;
  }
  .mobile-content {
    display: block;
  }
}

.TbOneBox2 {
  display: flex;
  align-items: center
}

.app-logo {
  width: 42px;
  height: 42px;
  border-radius: 8px
}

.TbOneBox3 {
  margin-left: 12px
}

.TbOneFont6 {
  font-family: Manrope,sans-serif;
  font-weight: 600;
  font-size: 14px;
  color: #fff;
  margin-left: 13px
}

.TbOneFont7 {
  font-family: Manrope,sans-serif;
  font-weight: 500;
  font-size: 12px;
  color: #ccc;
  margin: 2px 0 0 13px
}

.TbOneFont7 span {
  margin-left: 20px
}

.TbOneBox4 {
  height: 34px;
  background: #ccc;
  width: 1px;
  margin: 0 12px 0 32px
}

.TbOneFont8 {
  font-family: Manrope,sans-serif;
  font-weight: 500;
  font-size: 12px;
  color: #ccc;
  padding-left: 30px
}

.TbOneImg13 {
  height: 28px;
  width: 28px;
  margin-left: 28px;
  margin-top: 4px
}

.TbOneImg14 {
  height: 28px;
  width: 28px;
  margin-left: 58px;
  margin-top: -28px;
  position: relative
}

.HedaerTbTwo {
  height: 108px;
  background: #1a1a1a;
  display: flex;
  justify-content: center
}

.HTTb {
  display: flex;
  position: relative;
  align-items: center;
  justify-content: end
}

.TbTwobox1 {
  position: relative;
  height: 64px;
  font-family: Manrope,Manrope;
  font-weight: 500;
  font-size: 28px;
  color: #fff;
  line-height: 64px;
  font-style: normal
}

.TBTwotitle {
  position: relative;
  left: -66%;
  top: 30%;
  height: 64px;
  font-family: Manrope,Manrope;
  font-weight: 500;
  font-size: 18px;
  color: #fff;
  line-height: 32px;
  font-style: normal;
  padding-top: 22px
}

.TbTwobox2 {
  background-image: url(../assets/header/TbTwo1.webp);
  background-repeat: no-repeat;
  background-size: 100% auto;
  width: 82px;
  height: 37px;
  position: relative;
  left: 0
}

.TbTwobox3 {
  background-image: url(../assets/header/TbTwo2.webp);
  background-repeat: no-repeat;
  background-size: 100% auto;
  width: 82px;
  height: 37px;
  position: relative;
  left: 0
}

.TbTwobox4 {
  background-image: url(../assets/header/TbTwo3.webp);
  background-repeat: no-repeat;
  background-size: 100% auto;
  width: 82px;
  height: 37px;
  position: relative;
  left: 0
}

.TbTwobox5 {
  background-image: url(../assets/header/TbTwo4.webp);
  background-repeat: no-repeat;
  background-size: 100% auto;
  width: 82px;
  height: 37px;
  position: relative;
  left: 0
}

.TbTwoBox4 {
  width: 1px;
  height: 28px;
  background: #e8e8eb;
  opacity: .3;
  margin-left: 20px;
  margin-right: 20px
}

.TbTwofont1 {
  height: 19px;
  font-family: Manrope,Manrope;
  font-weight: 500;
  font-size: 14px;
  color: #acacac;
  line-height: 19px;
  text-align: justify;
  font-style: normal;
  position: relative;
  margin-top: 5px;
  left: 10px
}

.TbTwopng1 {
  width: 108px;
  padding-top: 21px
}

.wheel-img {
  position: absolute;
  width: 624.01px;
  height: 601.14px;
  left: 12px;
  top: -85px;
  z-index: 1
}

.coins-img {
  position: absolute;
  width: 216.47px;
  height: 223.2px;
  left: 253px;
  top: 263px;
  z-index: 2;
  animation: zoom-in-out 4s infinite
}

.slot-machine-img1 {
  position: absolute;
  width: 639.97px;
  height: 417.91px;
  left: 4px;
  top: 30px;
  z-index: 3
}

.slot-machine-img {
  position: relative;
  left: 4px;
  top: 30px;
  z-index: 3
}

.slot-machine-img3 {
  width: 100%;
  position: absolute;
  top: 110px
}

.money-animation2 {
  animation: moneyPulse 3s infinite
}

@media screen and (max-width: 768px) and (min-width: 686px) {
  .logotitle {
    background-image:url(../assets/header/logotitle-DBX0ek-h.webp);
    position: relative;
    width: 100%;
    height: 160px;
    background-size: 100%;
    background-repeat: no-repeat;
    z-index: 2;
    top: 30px
  }

  .logotitle .titletwo {
    font-family: Manrope,Manrope;
    font-weight: 500;
    font-size: 18px;
    color: #fff;
    font-style: normal;
    z-index: 20;
    position: absolute;
    width: 100%;
    text-align: center;
    top: 100%
  }

  .btn-gradient:after {
    background: linear-gradient(180deg,#60340f,#67340d)
  }

  .HedaerTbOne {
    background: linear-gradient(180deg,#bd731e,#3b1c07)
  }

  .TbOneImg1 {
    width: 40px;
    height: 40px
  }

  .right-bar {
    top: 6.3%
  }

  .TbOneFont1 {
    width: 101px;
    height: 32px;
    font-family: Manrope,Manrope;
    font-weight: 700;
    font-size: 28px;
    color: #fff;
    line-height: 32px;
    text-align: left;
    font-style: normal
  }

  .TbOneFont3 {
    width: 361px;
    height: 33px;
    font-family: Manrope,Manrope;
    font-weight: 500;
    font-size: 24px;
    color: #fff;
    line-height: 33px;
    text-align: justify;
    font-style: normal
  }

  .TbOneFont4 {
    width: 308px;
    height: 38px;
    font-family: Manrope,Manrope;
    font-weight: 700;
    font-size: 28px;
    color: #9d6161;
    line-height: 38px;
    text-align: center;
    font-style: normal;
    background: linear-gradient(270deg,#442b0f,#935b22)
  }

  .IPad .IPadtext1 {
    font-family: Manrope,Manrope;
    font-weight: 500;
    font-size: 24px;
    color: #fff;
    line-height: 32px;
    text-align: center;
    font-style: normal
  }

  .IPad .IPadIMG1 {
    width: 176px;
    height: 64px
  }

  .IPad .IPadDIV1 {
    width: 1px;
    height: 68px;
    background: #e8e8eb
  }
}

@media screen and (max-width: 685px) and (min-width: 500px) {
  .Zflex_box {
    top:10px
  }

  .btn-gradient:after {
    background: linear-gradient(180deg,#60340f,#67340d)
  }

  .TbOneImg1 {
    width: 32px;
    height: 32px
  }

  .IPad .IPadtext1 {
    font-family: Manrope,Manrope;
    font-weight: 500;
    font-size: 20px;
    color: #fff;
    line-height: 32px;
    text-align: center;
    font-style: normal
  }

  .IPad .IPadIMG1 {
    width: 176px;
    height: 64px
  }

  .IPad .IPadDIV1 {
    width: 1px;
    height: 68px;
    background: #e8e8eb
  }

  .right-bar {
    top: 6%
  }

  .logotitle {
    background-image: url(../assets/header/logotitle-DBX0ek-h.webp);
    position: relative;
    width: 100%;
    height: 160px;
    background-size: 100%;
    background-repeat: no-repeat;
    z-index: 2;
    top: 30px
  }

  .logotitle .titletwo {
    font-family: Manrope,Manrope;
    font-weight: 500;
    font-size: 16px;
    color: #fff;
    font-style: normal;
    z-index: 20;
    position: absolute;
    width: 100%;
    text-align: center;
    top: 80%
  }
}

@media screen and (max-width: 500px) and (min-width: 400px) {
  .right-bar {
    top:5.3%
  }

  .Zflex_box {
    top: 0
  }

  .btn-gradient:after {
    background: linear-gradient(180deg,#60340f,#67340d)
  }

  .TbOneImg1 {
    width: 32px;
    height: 32px
  }

  .logotitle {
    background-image: url(../assets/header/logotitle-DBX0ek-h.webp);
    position: relative;
    width: 100%;
    height: 160px;
    background-size: 100%;
    background-repeat: no-repeat;
    z-index: 2;
    top: 30px
  }

  .logotitle .titletwo {
    font-family: Manrope,Manrope;
    font-weight: 500;
    font-size: 14px;
    color: #fff;
    font-style: normal;
    z-index: 20;
    position: absolute;
    width: 100%;
    text-align: center;
    top: 55.5%
  }
}

@media screen and (max-width: 400px) and (min-width: 300px) {
  .right-bar {
    top:5%
  }

  .Zflex_box {
    top: 0
  }

  .TbOneImg1 {
    width: 32px;
    height: 32px
  }

  .logotitle {
    background-image: url(../assets/header/logotitle-DBX0ek-h.webp);
    position: relative;
    width: 100%;
    height: 160px;
    background-size: 100%;
    background-repeat: no-repeat;
    z-index: 2;
    top: 30px
  }

  .logotitle .titletwo {
    font-family: Manrope,Manrope;
    font-weight: 500;
    font-size: 14px;
    color: #fff;
    font-style: normal;
    z-index: 20;
    position: absolute;
    width: 100%;
    text-align: center;
    top: 48.5%
  }
}

@media screen and (max-width: 300px) and (min-width: 100px) {
  .logotitle .titletwo {
    font-family: Manrope, Manrope;
    font-weight: 500;
    font-size: 14px;
    color: #fff;
    font-style: normal;
    z-index: 20;
    /* position: static; */
    width: 100%;
    text-align: center;
    /* top: 48.5%; */
    margin-top: 22px;
  }
}
/* --- AD786 hero gradient stops (custom tailwind-like utilities) --- */
.from-\[\#D6A64A\]{
  --tw-gradient-from:#D6A64A var(--tw-gradient-from-position);
  --tw-gradient-to:rgb(214 166 74 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to);
}
.via-\[\#B8731D\]{
  --tw-gradient-to:rgb(184 115 29 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops:var(--tw-gradient-from), #B8731D var(--tw-gradient-via-position), var(--tw-gradient-to);
}
.to-\[\#2A1406\]{
  --tw-gradient-to:#2A1406 var(--tw-gradient-to-position);
}
/* === FIX: WhatsApp / Telegram floating bar (auto height, right edge, icons 1.5x) === */
.right-bar{
  position: fixed;
  right: 0;
  top: 52%;
  transform: translateY(-50%);
  z-index: 9999;
  background: rgba(0,0,0,0.35);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border-radius: 18px 0 0 18px;
  padding: 10px 8px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: max-content;
  height: auto;
  box-shadow: 0 10px 30px rgba(0,0,0,0.35);
}
.right-bar__btn{
  width: 48px;   /* 32px * 1.5 */
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.right-bar__btn img{
  width: 48px;
  height: 48px;
  object-fit: contain;
  display: block;
}

/* Mobile: a bit lower (to the right of the tiger) */
@media (max-width: 768px){
  .right-bar{
    top: 58%;
    padding: 9px 7px;
    gap: 10px;
    border-radius: 20px 0 0 20px;
  }
  .right-bar__btn,
  .right-bar__btn img{
    width: 48px;
    height: 48px;
  }
}
/* =========================================================
   AD786 FINAL OVERRIDES (do not delete)
   - Dark premium green/gold layered gradient for hero section
   - Right floating WhatsApp/Telegram bar: auto height, no stretching
   - Mobile: move bar upward near hero copy + icons 1.5x
   ========================================================= */

.ad786-hero-bg{
  /* layered, premium dark green with a warm gold bloom */
  background:
    radial-gradient(900px 520px at 18% 18%, rgba(19, 92, 60, 0.42) 0%, rgba(0,0,0,0) 60%),
    radial-gradient(760px 520px at 70% 30%, rgba(167, 126, 45, 0.18) 0%, rgba(0,0,0,0) 62%),
    linear-gradient(180deg, #081815 0%, #071614 35%, #050606 100%) !important;
  background-color: #0b1a13 !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}

/* Floating social bar */
.right-bar{
  --rb-icon: 40px;              /* desktop base */
  position: fixed !important;
  right: 12px !important;
  top: 46% !important;
  transform: translateY(-50%) !important;
  z-index: 99999 !important;

  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;

  padding: 10px 10px !important;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;

  background: rgba(0, 0, 0, 0.32) !important;
  border: 1px solid rgba(255, 255, 255, 0.10) !important;
  border-radius: 18px !important;

  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  box-shadow: 0 10px 30px rgba(0,0,0,0.35) !important;
}

/* clickable area equals icon box */
.right-bar a,
.right-bar .right-bar__item{
  width: var(--rb-icon) !important;
  height: var(--rb-icon) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
}

/* prevent image squashing */
.right-bar img{
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  display: block !important;
}

/* Mobile tuning */
@media (max-width: 768px){
  .right-bar{
    /* Shrink to 0.8x and move slightly downward to avoid covering hero copy */
    --rb-icon: 48px;                 /* 60px * 0.8 */
    right: 6px !important;           /* 贴边 */
    top: clamp(170px, 30vh, 260px) !important;  /* ↓ 下移一点，避免遮挡主文案 */
    transform: none !important;

    padding: 3px 3px !important;     /* 背景条跟随缩小 */
    gap: 6px !important;             /* 背景条跟随缩小 */
    border-radius: 16px !important;
  }

  /* 防止 a 标签自带的奇怪间距导致“看起来变高” */
  .right-bar a{
    padding: 0 !important;
    margin: 0 !important;
    line-height: 0 !important;
  }

  /* 保险：图片不要被任何全局样式拉伸 */
  .right-bar img{
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
  }
}