#rikvip-page {
  width: 100% !important;
  overflow: hidden;
}

.main-container {
  width: fit-content;
  transform-origin: top left;
  visibility: hidden;
}

/* screen - index */

.index {
  background-color: #13171c;
  height: 1080px;
  overflow: hidden;
  position: relative;
  width: 1920px;
}

.index .bg-4 {
  aspect-ratio: 1.78;
  height: 1080px;
  left: calc(50.00% - 959px);
  object-fit: cover;
  position: absolute;
  top: calc(50.00% - 540px);
  width: 1918px;
}

.index .badge-dangky {
  background-image: url(../img/bg-form-1.webp);
  background-position: 50% 50%;
  background-size: cover;
  height: 552px;
  left: 1133px;
  position: absolute;
  top: 306px;
  width: 671px;
}

.index .domain-notice {
  color: #ffffff;
  font-family: var(--font-family-inter);
  font-size: 25px;
  font-weight: 700;
  left: 1133px;
  line-height: 1.4;
  margin: 0;
  position: absolute;
  text-align: center;
  top: 875px;
  width: 671px;
}

.index .domain-notice span {
  color: #ffdf00;
}

.index .cta-4 {
  animation: zoom-pulse 1.6s ease-in-out infinite;
  background: url(../img/cta-4.webp) center / cover no-repeat;
  border: none;
  cursor: pointer;
  height: 94px;
  left: 12.67%;
  padding: 0;
  position: absolute;
  top: 428px;
  width: 74.52%;
}

.index .cta-4:hover {
  filter: brightness(1.08);
}

.index .input_-field {
  height: 52.54%;
  left: 8.20%;
  position: absolute;
  top: 19.93%;
  width: 84.65%;
}

.index .input_field3 {
  background-color: var(--white);
  border: 1px solid;
  border-color: var(--burnt-maroon);
  border-radius: 25px;
  height: 26.90%;
  left: 0;
  position: absolute;
  top: 73.10%;
  width: 98.94%;
}

.index .icon_phone {
  height: 53.85%;
  left: 7.65%;
  position: absolute;
  top: 23.08%;
  width: 7.65%;
}

.index .input_field2 {
  background-color: var(--white);
  border: 1px solid;
  border-color: var(--burnt-maroon);
  border-radius: 25px;
  height: 26.90%;
  left: 0;
  position: absolute;
  top: 36.55%;
  width: 98.94%;
}

.index .icon_pass {
  height: 60.26%;
  left: 8.19%;
  position: absolute;
  top: 20.51%;
  width: 6.41%;
}

.index .eye_on {
  height: 48.08%;
  left: 84.70%;
  position: absolute;
  top: 26.92%;
  width: 8.90%;
}

.index .input_field1 {
  background-color: var(--white);
  border: 1px solid;
  border-color: var(--burnt-maroon);
  border-radius: 25px;
  height: 26.90%;
  left: 0;
  position: absolute;
  top: 0;
  width: 98.94%;
}

.index .icon_user {
  height: 57.69%;
  left: 7.83%;
  position: absolute;
  top: 20.51%;
  width: 7.12%;
}

.index .input_-field .input_field1,
.index .input_-field .input_field2,
.index .input_-field .input_field3 {
  overflow: hidden;
}

.index .input_-field input {
  background: transparent;
  border: none;
  color: #333333;
  font-family: var(--font-family-inter);
  font-size: 18px;
  font-weight: 300;
  height: 100%;
  left: 0;
  outline: none;
  padding-left: 19%;
  padding-right: 12%;
  position: absolute;
  top: 0;
  width: 100%;
}

.index .input_field2 input {
  padding-right: 17%;
}

.index .input_field2 .pass-toggle {
  align-items: center;
  background: transparent;
  border: none;
  cursor: pointer;
  display: flex;
  height: 50%;
  justify-content: center;
  padding: 0;
  position: absolute;
  right: 7%;
  top: 25%;
  width: 10%;
  z-index: 4;
}

.index .input_field2 .pass-toggle .eye_on {
  height: 100%;
  position: static;
  width: 100%;
}

.index .input_field2 .pass-toggle::after {
  background: #3e0000;
  border-radius: 2px;
  content: '';
  height: 5px;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%) rotate(45deg);
  width: 100%;
}

.index .input_field2 .pass-toggle.reveal::after {
  display: none;
}

.index .input_-field .fmsg {
  color: #ffffff;
  font-family: var(--font-family-inter);
  font-size: 13px;
  font-weight: 600;
  left: 0;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  text-align: center;
  transition: opacity 0.3s;
  width: 100%;
}

.index .input_-field .fmsg.show {
  opacity: 1;
}

.index .input_-field #msg-user {
  top: 27.5%;
}

.index .input_-field #msg-pass {
  top: 64.5%;
}

.index .input_-field #msg-phone {
  top: 101%;
}

.index .tn-ng-nhp {
  height: 8.28%;
  left: 20.77%;
  letter-spacing: 0;
  line-height: normal;
  position: absolute;
  top: 9.31%;
  white-space: nowrap;
  width: 24.65%;
}

.index .mt-khu {
  height: 8.28%;
  left: 20.77%;
  letter-spacing: 0;
  line-height: normal;
  position: absolute;
  top: 45.86%;
  white-space: nowrap;
  width: 15.32%;
}

.index .s-in-thoi {
  height: 8.28%;
  left: 20.77%;
  letter-spacing: 0;
  line-height: normal;
  position: absolute;
  top: 82.41%;
  white-space: nowrap;
  width: 21.83%;
}

.index .logo-1 {
  aspect-ratio: 1.11;
  background-image: url(../img/logo-1.webp);
  background-position: 50% 50%;
  background-size: cover;
  height: 217px;
  left: 434px;
  position: absolute;
  top: 48px;
  width: 240px;
}

.index .ctkm {
  align-items: center;
  display: inline-flex;
  gap: 133.78px;
  left: calc(50.00% - 766px);
  position: absolute;
  top: 936px;
}

.index .ctkm_1 {
  aspect-ratio: 4.82;
  background-image: url(../img/ctkm-1-1.webp);
  background-position: 50% 50%;
  background-size: cover;
  height: 74.09px;
  position: relative;
  width: 357.25px;
}

.index .ctkm_2 {
  aspect-ratio: 3.82;
  background-image: url(../img/ctkm-2-1.webp);
  background-position: 50% 50%;
  background-size: cover;
  height: 70.29px;
  position: relative;
  width: 268.54px;
}

.index .ctkm_3 {
  aspect-ratio: 4.54;
  background-image: url(../img/ctkm-3-1.webp);
  background-position: 50% 50%;
  background-size: cover;
  height: 64.12px;
  position: relative;
  width: 290.81px;
}

.index .ctkm_4 {
  aspect-ratio: 3.33;
  background-image: url(../img/ctkm-4-1.webp);
  background-position: 50% 50%;
  background-size: cover;
  height: 64.06px;
  position: relative;
  width: 213.53px;
}

.index .text-3 {
  aspect-ratio: 5.62;
  height: 111px;
  left: 1159px;
  object-fit: cover;
  position: absolute;
  top: 118px;
  width: 623px;
}

.index .visual-1 {
  aspect-ratio: 1.29;
  height: 746px;
  left: 71px;
  object-fit: cover;
  position: absolute;
  top: 134px;
  width: 965px;
}
/* screen - ldpu47mobile */

.ldpu47mobile {
  background-color: #13171c;
  height: 1007px;
  overflow: hidden;
  position: relative;
  width: 390px;
}

.ldpu47mobile .bg-4-1 {
  aspect-ratio: 1.78;
  height: 1156px;
  left: calc(50.00% - 1301px);
  object-fit: cover;
  position: absolute;
  top: calc(50.00% - 510px);
  width: 2053px;
}

.ldpu47mobile .logo-1-1 {
  aspect-ratio: 1.11;
  background-image: url(../img/logo-1.webp);
  background-position: 50% 50%;
  background-size: cover;
  height: 166px;
  left: 103px;
  position: absolute;
  top: 37px;
  width: 184px;
}

.ldpu47mobile .tab {
  display: flex;
  height: 599px;
  left: 623px;
  position: absolute;
  top: 370px;
  width: 673px;
}

.ldpu47mobile .tabdangky {
  height: 599px;
  position: relative;
  width: 673px;
}

.ldpu47mobile .bg-2 {
  aspect-ratio: 1.35;
  height: 499px;
  left: 0;
  object-fit: cover;
  position: absolute;
  top: 44px;
  width: 673px;
}

.ldpu47mobile .cta-1 {
  aspect-ratio: 5.31;
  height: 88px;
  left: 103px;
  object-fit: cover;
  position: absolute;
  top: 511px;
  width: 467px;
}

.ldpu47mobile .buttondangky {
  aspect-ratio: 7.39;
  height: 76px;
  left: 56px;
  object-fit: cover;
  position: absolute;
  top: 0;
  width: 562px;
}

.ldpu47mobile .input-fields {
  height: 321px;
  left: 56px;
  position: absolute;
  top: 131px;
  width: 565px;
}

.ldpu47mobile .phone {
  aspect-ratio: 6.88;
  height: 81px;
  left: 2px;
  object-fit: cover;
  position: absolute;
  top: 240px;
  width: 557px;
}

.ldpu47mobile .pass {
  aspect-ratio: 6.88;
  height: 81px;
  left: 0;
  object-fit: cover;
  position: absolute;
  top: 120px;
  width: 557px;
}

.ldpu47mobile .login {
  aspect-ratio: 6.88;
  height: 81px;
  left: 2px;
  object-fit: cover;
  position: absolute;
  top: 0;
  width: 557px;
}

.ldpu47mobile .tn-ng-nhp-1 {
  left: 89px;
  top: 25px;
}

.ldpu47mobile .mt-khu-1 {
  left: 89px;
  top: 144px;
}

.ldpu47mobile .s-in-thoi-1 {
  left: 89px;
  top: 263px;
}

.ldpu47mobile .frame {
  gap: 20px;
  left: 35px;
  position: absolute;
  top: 213px;
  width: 319px;
}

.ldpu47mobile .text-3-1 {
  aspect-ratio: 5.62;
  height: 57px;
  margin-left: -0.46px;
  margin-right: -0.46px;
  object-fit: cover;
  position: relative;
  width: 320px;
}

.ldpu47mobile .badge-dangky-1 {
  background-image: url(../img/bg-form-1.webp);
  background-position: 50% 50%;
  background-size: cover;
  height: 262.36px;
  position: relative;
  width: 318.81px;
}

.ldpu47mobile .domain-notice {
  color: #ffffff;
  font-family: var(--font-family-inter);
  font-size: 12px;
  font-weight: 700;
  left: 0;
  line-height: 15px;
  margin: 0;
  position: absolute;
  text-align: center;
  top: 345px;
  width: 319px;
	margin: 5px 0px 10px 0px;
}

.ldpu47mobile .domain-notice span {
  color: #ffdf00;
}

.ldpu47mobile .cta-4-1 {
  animation: zoom-pulse 1.6s ease-in-out infinite;
  background: url(../img/cta-4.webp) center / cover no-repeat;
  border: none;
  cursor: pointer;
  height: 45px;
  left: 12.67%;
  padding: 0;
  position: absolute;
  top: 203px;
  width: 74.33%;
}

.ldpu47mobile .cta-4-1:hover {
  filter: brightness(1.08);
}

.ldpu47mobile .input_-field-1 {
  height: 52.54%;
  left: 8.20%;
  position: absolute;
  top: 19.93%;
  width: 85.64%;
}

.ldpu47mobile .input_field3-1 {
  background-color: var(--white);
  border: 0.48px solid;
  border-color: var(--burnt-maroon);
  border-radius: 11.88px;
  height: 26.90%;
  left: 0;
  position: absolute;
  top: 73.10%;
  width: 97.80%;
}

.ldpu47mobile .icon_phone-1 {
  height: 53.85%;
  left: 7.65%;
  position: absolute;
  top: 23.08%;
  width: 7.65%;
}

.ldpu47mobile .input_field2-1 {
  background-color: var(--white);
  border: 0.48px solid;
  border-color: var(--burnt-maroon);
  border-radius: 11.88px;
  height: 26.90%;
  left: 0;
  position: absolute;
  top: 36.55%;
  width: 97.80%;
}

.ldpu47mobile .icon_pass-1 {
  height: 60.26%;
  left: 8.19%;
  position: absolute;
  top: 20.51%;
  width: 6.41%;
}

.ldpu47mobile .eye_on-1 {
  height: 48.08%;
  left: 84.70%;
  position: absolute;
  top: 26.92%;
  width: 8.90%;
}

.ldpu47mobile .input_field1-1 {
  background-color: var(--white);
  border: 0.48px solid;
  border-color: var(--burnt-maroon);
  border-radius: 11.88px;
  height: 26.90%;
  left: 0;
  position: absolute;
  top: 0;
  width: 97.80%;
}

.ldpu47mobile .icon_user-1 {
  height: 57.69%;
  left: 7.83%;
  position: absolute;
  top: 20.51%;
  width: 7.12%;
}

.ldpu47mobile .input_-field-1 .input_field1-1,
.ldpu47mobile .input_-field-1 .input_field2-1,
.ldpu47mobile .input_-field-1 .input_field3-1 {
  overflow: hidden;
}

.ldpu47mobile .input_-field-1 input {
  background: transparent;
  border: none;
  color: #333333;
  font-family: var(--font-family-inter);
  font-size: 9px;
  font-weight: 300;
  height: 100%;
  left: 0;
  outline: none;
  padding-left: 19%;
  padding-right: 12%;
  position: absolute;
  top: 0;
  width: 100%;
}

.ldpu47mobile .input_field2-1 input {
  padding-right: 17%;
}

.ldpu47mobile .input_field2-1 .pass-toggle {
  align-items: center;
  background: transparent;
  border: none;
  cursor: pointer;
  display: flex;
  height: 50%;
  justify-content: center;
  padding: 0;
  position: absolute;
  right: 7%;
  top: 25%;
  width: 10%;
  z-index: 4;
}

.ldpu47mobile .input_field2-1 .pass-toggle .eye_on-1 {
  height: 100%;
  position: static;
  width: 100%;
}

.ldpu47mobile .input_field2-1 .pass-toggle::after {
  background: #3e0000;
  border-radius: 1.5px;
  content: '';
  height: 3px;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%) rotate(45deg);
  width: 100%;
}

.ldpu47mobile .input_field2-1 .pass-toggle.reveal::after {
  display: none;
}

.ldpu47mobile .input_-field-1 .fmsg {
  color: #ffffff;
  font-family: var(--font-family-inter);
  font-size: 8.5px;
  font-weight: 600;
  left: 0;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  text-align: center;
  transition: opacity 0.3s;
  width: 100%;
}

.ldpu47mobile .input_-field-1 .fmsg.show {
  opacity: 1;
}

.ldpu47mobile .input_-field-1 #msg-user-mb {
  top: 27.5%;
}

.ldpu47mobile .input_-field-1 #msg-pass-mb {
  top: 64.5%;
}

.ldpu47mobile .input_-field-1 #msg-phone-mb {
  top: 101%;
}

.ldpu47mobile .tn-ng-nhp-2 {
  height: 8.71%;
  left: 20.54%;
  top: 9.31%;
  width: 24.54%;
}

.ldpu47mobile .mt-khu-2 {
  height: 8.71%;
  left: 20.54%;
  top: 45.86%;
  width: 15.38%;
}

.ldpu47mobile .s-in-thoi-2 {
  height: 8.71%;
  left: 20.54%;
  top: 82.41%;
  width: 21.61%;
}

.ldpu47mobile .ctkm-1 {
  align-items: flex-start;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 40.06px;
  position: relative;
	margin-top: 20px;
}

.ldpu47mobile .frame-2085663170 {
  gap: 12.59px;
  position: relative;
  width: 154.52px;
}

.ldpu47mobile .ctkm_1-1 {
  aspect-ratio: 4.82;
  background-image: url(../img/ctkm-1-1.webp);
  background-position: 50% 50%;
  background-size: cover;
  height: 32.05px;
  position: relative;
  width: 154.52px;
}

.ldpu47mobile .ctkm_3-1 {
  aspect-ratio: 4.54;
  background-image: url(../img/ctkm-3-1.webp);
  background-position: 50% 50%;
  background-size: cover;
  height: 34.07px;
  position: relative;
  width: 154.52px;
}

.ldpu47mobile .frame-2085663171 {
  gap: 12.59px;
  position: relative;
  width: 122.43px;
}

.ldpu47mobile .ctkm_2-1 {
  aspect-ratio: 3.82;
  background-image: url(../img/ctkm-2-1.webp);
  background-position: 50% 50%;
  background-size: cover;
  height: 32.05px;
  position: relative;
  width: 122.43px;
}

.ldpu47mobile .ctkm_4-1 {
  aspect-ratio: 3.33;
  background-image: url(../img/ctkm-4-1.webp);
  background-position: 50% 50%;
  background-size: cover;
  height: 36.73px;
  position: relative;
  width: 122.43px;
}

.ldpu47mobile .visual-1-1 {
  aspect-ratio: 1.29;
  height: 291.79px;
  margin-left: -29.19px;
  margin-right: -29.19px;
  object-fit: cover;
  position: relative;
  width: 377.47px;
}

.ldpu47mobile .frame-1 {
  align-items: center;
  display: flex;
  flex-direction: column;
}

.ldpu47mobile .mt-khu {
  letter-spacing: 0;
  line-height: normal;
  position: absolute;
}

.ldpu47mobile .s-in-thoi {
  letter-spacing: 0;
  line-height: normal;
  position: absolute;
}

.ldpu47mobile .tn-ng-nhp {
  letter-spacing: 0;
  line-height: normal;
  position: absolute;
}

.index .tn-ng-nhp,
.index .mt-khu,
.index .s-in-thoi,
.ldpu47mobile .tn-ng-nhp,
.ldpu47mobile .mt-khu,
.ldpu47mobile .s-in-thoi {
  pointer-events: none;
  z-index: 3;
}
@media screen and (orientation: portrait) {
  html,
  body {
    overflow-x: hidden;
  }
  .screen.index {
    display: none;
  }
  .screen.ldpu47mobile {
    display: block;
  }
}
@media screen and (min-width: 1025px) and (orientation: landscape) {
  html,
  body {
    overflow: hidden;
  }
  #rikvip-page {
    background: url(../img/bg-4.webp) center / cover no-repeat;
  }
  .screen.index {
    background-color: transparent;
    display: block;
  }
  .screen.index .bg-4 {
    display: none;
  }
  .screen.ldpu47mobile {
    display: none;
  }
}
@media screen and (max-width: 1024px) and (orientation: landscape) {
  html,
  body {
    overflow-x: hidden;
  }
  #rikvip-page {
    background: url(../img/bg-4.webp) center / cover no-repeat;
  }
  .screen.index {
    background-color: transparent;
    display: block;
  }
  .screen.index .bg-4 {
    display: none;
  }
  .screen.ldpu47mobile {
    display: none;
  }
}
@keyframes zoom-pulse {
  0%,
  100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.08);
  }
}