@font-face {
  font-family: "SRN-CookieRun-Black";
  src: url(assets/main/fonts/SRN-CookieRun-Black.otf);
}
@font-face {
  font-family: "SRN-CookieRun-Bold";
  src: url(assets/main/fonts/SRN-CookieRun-Bold.otf);
}
.view {
  display: none;
}

.view.is-active {
  display: block;
  animation: viewIn 0.4s ease both;
}

@keyframes viewIn {
  from {
    opacity: 0;
    transform: translateY(40px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.MS__CookieRun-Black {
  font-family: "SRN-CookieRun-Black";
}

.MS__CookieRun-Bold {
  font-family: "SRN-CookieRun-Bold";
}

.layer-rotate {
  width: 100%;
  height: 100%;
  background-color: #000;
  position: fixed;
  z-index: 100;
  opacity: 1;
  transition: opacity 0.5s linear;
}
.layer-rotate img {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
#Frame1 {
  position: relative;
  height: 1000px;
}
@media (max-width: 768px) {
  #Frame1 {
    height: 1362.25px;
  }
}
#Frame1 .background {
  position: absolute;
  top: 0;
  left: 0;
}
#Frame1 .content {
  position: absolute;
  inset: 0;
}
#Frame1 .content-ai .MS__sprite-f1-btn {
  position: absolute;
  left: 220px;
  top: 722px;
  animation: f1-btn-scale 1s ease-in-out infinite;
}
@media (max-width: 768px) {
  #Frame1 .content-ai .MS__sprite-f1-btn {
    left: 2px;
    top: 1088px;
  }
}

@keyframes f1-btn-scale {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.1);
  }
}
#Frame2 {
  position: relative;
  height: 2860px;
}
@media (max-width: 768px) {
  #Frame2 {
    height: 3602.75px;
  }
}
#Frame2 .background {
  position: absolute;
  top: 0;
  left: 0;
}
#Frame2 .content {
  position: absolute;
  inset: 0;
}
#Frame2 .content-ai .MS__sprite-f2-btn-dangkysom {
  position: absolute;
  left: 1436px;
  top: 776px;
}
@media (max-width: 768px) {
  #Frame2 .content-ai .MS__sprite-f2-btn-dangkysom {
    left: 36px;
    top: 1236px;
    transform: scale(0.7906);
    transform-origin: left top;
  }
}
#Frame2 .content-ai .MS__sprite-f2-btn-thamgia {
  position: absolute;
  left: 711px;
  top: 1333px;
}
@media (max-width: 768px) {
  #Frame2 .content-ai .MS__sprite-f2-btn-thamgia {
    left: 20px;
    top: 2102px;
    transform: scale(0.6833);
    transform-origin: left top;
  }
}
#Frame2 .content-ai .list-socials {
  position: absolute;
  left: 661px;
  top: 2300px;
  width: 692px;
  height: 150px;
  z-index: 1;
}
@media (max-width: 768px) {
  #Frame2 .content-ai .list-socials {
    left: 58px;
    top: 3127px;
    width: 666px;
    height: 144px;
  }
}
#Frame2 .content-ai .list-socials .MS__sprite-f2-btn-fb {
  position: absolute;
  left: 0;
  top: 0;
}
@media (max-width: 768px) {
  #Frame2 .content-ai .list-socials .MS__sprite-f2-btn-fb {
    transform: scale(0.966);
    transform-origin: left top;
  }
}
#Frame2 .content-ai .list-socials .MS__sprite-f2-btn-yt {
  position: absolute;
  left: 181px;
  top: 0;
}
@media (max-width: 768px) {
  #Frame2 .content-ai .list-socials .MS__sprite-f2-btn-yt {
    left: 174px;
    transform: scale(0.9643);
    transform-origin: left top;
  }
}
#Frame2 .content-ai .list-socials .MS__sprite-f2-btn-tt {
  position: absolute;
  left: 369px;
  top: 0;
}
@media (max-width: 768px) {
  #Frame2 .content-ai .list-socials .MS__sprite-f2-btn-tt {
    left: 354px;
    transform: scale(0.9669);
    transform-origin: left top;
  }
}
#Frame2 .content-ai .list-socials .MS__sprite-f2-btn-gr {
  position: absolute;
  left: 523px;
  top: 0;
}
@media (max-width: 768px) {
  #Frame2 .content-ai .list-socials .MS__sprite-f2-btn-gr {
    left: 502px;
    transform: scale(0.9704);
    transform-origin: left top;
  }
}
#Frame2 .content-ai .list-logos {
  position: absolute;
  left: 637px;
  top: 2472px;
  width: 726px;
  height: 89px;
  z-index: 1;
}
@media (max-width: 768px) {
  #Frame2 .content-ai .list-logos {
    left: 149px;
    top: 3294px;
    width: 470px;
    height: 59px;
  }
}
#Frame2 .content-ai .list-logos .vnggames {
  position: absolute;
  left: 525px;
  top: 0;
  width: 201px;
  height: 84px;
}
@media (max-width: 768px) {
  #Frame2 .content-ai .list-logos .vnggames {
    left: 341px;
    width: 129px;
    height: 54px;
  }
}
#Frame2 .content-ai .list-logos .dapheduyet {
  position: absolute;
  left: 0;
  top: 21px;
  width: 196px;
  height: 68px;
}
@media (max-width: 768px) {
  #Frame2 .content-ai .list-logos .dapheduyet {
    top: 15px;
    width: 127px;
    height: 44px;
  }
}
#Frame2 .content-ai .list-logos .haegin {
  position: absolute;
  left: 237px;
  top: 37px;
  width: 257px;
  height: 37px;
}
@media (max-width: 768px) {
  #Frame2 .content-ai .list-logos .haegin {
    left: 153px;
    top: 24px;
    width: 168px;
    height: 24px;
  }
}
#Frame2 .content-ai .text {
  position: absolute;
  top: 2599px;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  height: 154px;
  z-index: 1;
  font-size: 20px;
  line-height: 1.6;
  text-align: center;
  color: #ffffff;
}
@media (max-width: 768px) {
  #Frame2 .content-ai .text {
    top: 3382px;
    width: 100%;
    height: 172px;
    font-size: 18px;
    line-height: 1.389;
  }
}
#Frame2 .content-ai .text .text-auto {
  position: absolute;
  z-index: 1;
  width: 100%;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  font-size: 20px;
  line-height: 1.6;
  color: #ffffff;
}
@media (max-width: 768px) {
  #Frame2 .content-ai .text .text-auto {
    font-size: 18px;
    line-height: 1.389;
  }
}
#Frame3 {
  position: relative;
  height: 1000px;
}
@media (max-width: 768px) {
  #Frame3 {
    height: 1402.96875px;
  }
}
#Frame3 .background {
  position: absolute;
  top: 0;
  left: 0;
}
#Frame3 .content {
  position: absolute;
  inset: 0;
}
#Frame3 .content-ai .MS__sprite-f3-btn {
  position: absolute;
  left: 1153px;
  top: 750px;
}
@media (max-width: 768px) {
  #Frame3 .content-ai .MS__sprite-f3-btn {
    left: 2px;
    top: 1133px;
    transform: scale(1.1736);
    transform-origin: left top;
  }
}
#Frame4 {
  position: relative;
  height: 5873px;
}
@media (max-width: 768px) {
  #Frame4 {
    height: 5235.03125px;
  }
}
#Frame4 .background {
  position: absolute;
  top: 0;
  left: 0;
}
#Frame4 .content {
  position: absolute;
  inset: 0;
}
#Frame4 .content-ai .swiper-activity {
  position: absolute;
  left: 386px;
  top: 4140px;
  width: 1228px;
  height: 628px;
  z-index: 5;
}
@media (max-width: 768px) {
  #Frame4 .content-ai .swiper-activity {
    left: 34px;
    top: 3920px;
    transform: scale(0.57);
    transform-origin: left top;
  }
}
#Frame4 .content-ai .swiper-activity .f4-swiper {
  position: absolute;
  top: 22px;
  left: 24px;
  width: 1180px;
  height: 584px;
  border-radius: 28px;
  overflow: hidden;
  z-index: 1;
}
#Frame4 .content-ai .swiper-activity .f4-swiper .swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
#Frame4 .content-ai .swiper-activity .swiper-frame {
  position: absolute;
  top: 0;
  left: 0;
  width: 1228px;
  height: 628px;
  pointer-events: none;
  z-index: 2;
}
#Frame4 .content-ai .swiper-activity .swiper-ticker {
  position: absolute;
  right: -30px;
  bottom: -130px;
  width: 227px;
  height: 371px;
  pointer-events: none;
  z-index: 3;
}
#Frame4 .content-ai .swiper-activity .f4-swiper-prev,
#Frame4 .content-ai .swiper-activity .f4-swiper-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 4;
  cursor: pointer;
}
#Frame4 .content-ai .swiper-activity .f4-swiper-prev {
  left: -160px;
}
@media (max-width: 768px) {
  #Frame4 .content-ai .swiper-activity .f4-swiper-prev {
    left: -30px;
  }
}
#Frame4 .content-ai .swiper-activity .f4-swiper-next {
  right: -160px;
}
@media (max-width: 768px) {
  #Frame4 .content-ai .swiper-activity .f4-swiper-next {
    right: -24px;
  }
}
#Frame4 .content-ai .swiper-activity .f4-swiper-pagination {
  position: absolute;
  left: 0;
  right: 0;
  bottom: -72px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 18px;
  z-index: 4;
}
#Frame4 .content-ai .swiper-activity .f4-swiper-pagination .swiper-pagination-bullet {
  background-image: url(assets/Frame4/images/sprite.png);
  background-position: -202px -426px;
  width: 46px;
  height: 46px;
  margin: 0;
  opacity: 1;
  background-color: transparent;
  border-radius: 0;
}
#Frame4 .content-ai .swiper-activity .f4-swiper-pagination .swiper-pagination-bullet-active {
  background-image: url(assets/Frame4/images/sprite.png);
  background-position: -156px -426px;
  width: 46px;
  height: 46px;
}
#Frame4 .content-ai .MS__sprite-f4-btn {
  position: absolute;
  left: 637px;
  top: 394px;
}
@media (max-width: 768px) {
  #Frame4 .content-ai .MS__sprite-f4-btn {
    left: 2px;
    top: 219px;
    transform: scale(1.0523);
    transform-origin: left top;
  }
}
#Frame4 .content-ai .line.MS__mb {
  position: absolute;
}
@media (max-width: 768px) {
  #Frame4 .content-ai .line.MS__mb {
    left: 94px;
    top: 1119px;
    width: 628px;
    height: 2309px;
  }
}
#Frame4 .content-ai .homes {
  position: absolute;
  left: 211px;
  top: 1245px;
  width: 2231px;
  height: 2359px;
  z-index: 1;
}
#Frame4 .content-ai .homes img.is-active {
  transform-origin: center center;
  animation: f4-home-pulse 1.2s ease-in-out infinite;
}
@media (max-width: 768px) {
  #Frame4 .content-ai .homes {
    left: -1px;
    top: 909px;
    width: 1200px;
    height: 2510px;
  }
}
#Frame4 .content-ai .homes .cantho {
  position: absolute;
  left: 1006px;
  top: 0px;
  width: 581px;
  height: 581px;
}
@media (max-width: 768px) {
  #Frame4 .content-ai .homes .cantho {
    left: 326px;
    width: 417px;
    height: 417px;
  }
}
#Frame4 .content-ai .homes .nhatrang {
  position: absolute;
  left: 20px;
  top: 121px;
  width: 581px;
  height: 569px;
}
@media (max-width: 768px) {
  #Frame4 .content-ai .homes .nhatrang {
    left: 19px;
    top: 426px;
    width: 417px;
    height: 409px;
  }
}
#Frame4 .content-ai .homes .danang {
  position: absolute;
  left: 880px;
  top: 746px;
  width: 1351px;
  height: 636px;
}
@media (max-width: 768px) {
  #Frame4 .content-ai .homes .danang {
    left: 229px;
    top: 807px;
    width: 971px;
    height: 457px;
  }
}
#Frame4 .content-ai .homes .quangninh {
  position: absolute;
  left: 20px;
  top: 977px;
  width: 581px;
  height: 581px;
}
@media (max-width: 768px) {
  #Frame4 .content-ai .homes .quangninh {
    top: 1252px;
    width: 417px;
    height: 416px;
  }
}
#Frame4 .content-ai .homes .hanoi {
  position: absolute;
  left: 1006px;
  top: 1591px;
  width: 581px;
  height: 573px;
}
@media (max-width: 768px) {
  #Frame4 .content-ai .homes .hanoi {
    left: 326px;
    top: 1664px;
    width: 417px;
    height: 411px;
  }
}
#Frame4 .content-ai .homes .hochiminh {
  position: absolute;
  left: 0px;
  top: 1764px;
  width: 615px;
  height: 595px;
}
#Frame4 .content-ai .homes .hochiminh {
  position: absolute;
}
@media (max-width: 768px) {
  #Frame4 .content-ai .homes .hochiminh {
    left: 0px;
    top: 2083px;
    width: 441px;
    height: 427px;
  }
}
#Frame4 .content-ai .line.MS__pc {
  position: absolute;
  left: 399px;
  top: 1641px;
  width: 1348px;
  height: 1980px;
}
#Frame4 .content-ai .character {
  position: absolute;
  left: 1085px;
  top: 1700px;
  width: 351px;
  height: 260px;
  z-index: 2;
  opacity: 0;
  transition: opacity 0.35s ease;
}
@media (max-width: 768px) {
  #Frame4 .content-ai .character {
    left: 430px;
    top: 1300px;
    width: 252px;
    height: 187px;
  }
}
#Frame4 .content-ai .MS__sprite-f4-btn-dangky {
  position: absolute;
  left: 656px;
  top: 3704px;
}
@media (max-width: 768px) {
  #Frame4 .content-ai .MS__sprite-f4-btn-dangky {
    left: 40px;
    top: 3465px;
  }
}
#Frame4 .content-ai .list-socials {
  position: absolute;
  left: 661px;
  top: 5313px;
  width: 692px;
  height: 150px;
  z-index: 1;
}
@media (max-width: 768px) {
  #Frame4 .content-ai .list-socials {
    left: 58px;
    top: 4759.28125px;
    width: 666px;
    height: 144px;
  }
}
#Frame4 .content-ai .list-socials .MS__sprite-f2-btn-fb {
  position: absolute;
  left: 0;
  top: 0;
}
@media (max-width: 768px) {
  #Frame4 .content-ai .list-socials .MS__sprite-f2-btn-fb {
    transform: scale(0.966);
    transform-origin: left top;
  }
}
#Frame4 .content-ai .list-socials .MS__sprite-f2-btn-yt {
  position: absolute;
  left: 181px;
  top: 0;
}
@media (max-width: 768px) {
  #Frame4 .content-ai .list-socials .MS__sprite-f2-btn-yt {
    left: 174px;
    transform: scale(0.9643);
    transform-origin: left top;
  }
}
#Frame4 .content-ai .list-socials .MS__sprite-f2-btn-tt {
  position: absolute;
  left: 369px;
  top: 0;
}
@media (max-width: 768px) {
  #Frame4 .content-ai .list-socials .MS__sprite-f2-btn-tt {
    left: 354px;
    transform: scale(0.9669);
    transform-origin: left top;
  }
}
#Frame4 .content-ai .list-socials .MS__sprite-f2-btn-gr {
  position: absolute;
  left: 523px;
  top: 0;
}
@media (max-width: 768px) {
  #Frame4 .content-ai .list-socials .MS__sprite-f2-btn-gr {
    left: 502px;
    transform: scale(0.9704);
    transform-origin: left top;
  }
}
#Frame4 .content-ai .list-logos {
  position: absolute;
  left: 637px;
  top: 5485px;
  width: 726px;
  height: 89px;
  z-index: 1;
}
@media (max-width: 768px) {
  #Frame4 .content-ai .list-logos {
    left: 149px;
    top: 4926.28125px;
    width: 470px;
    height: 59px;
  }
}
#Frame4 .content-ai .list-logos .vnggames {
  position: absolute;
  left: 525px;
  top: 0;
  width: 201px;
  height: 84px;
}
@media (max-width: 768px) {
  #Frame4 .content-ai .list-logos .vnggames {
    left: 341px;
    width: 129px;
    height: 54px;
  }
}
#Frame4 .content-ai .list-logos .dapheduyet {
  position: absolute;
  left: 0;
  top: 21px;
  width: 196px;
  height: 68px;
}
@media (max-width: 768px) {
  #Frame4 .content-ai .list-logos .dapheduyet {
    top: 15px;
    width: 127px;
    height: 44px;
  }
}
#Frame4 .content-ai .list-logos .haegin {
  position: absolute;
  left: 237px;
  top: 37px;
  width: 257px;
  height: 37px;
}
@media (max-width: 768px) {
  #Frame4 .content-ai .list-logos .haegin {
    left: 153px;
    top: 24px;
    width: 168px;
    height: 24px;
  }
}
#Frame4 .content-ai .text {
  position: absolute;
  top: 5612px;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  height: 154px;
  z-index: 1;
  font-size: 20px;
  line-height: 1.6;
  text-align: center;
  color: #ffffff;
}
@media (max-width: 768px) {
  #Frame4 .content-ai .text {
    top: 5014.28125px;
    width: 100%;
    height: 172px;
    font-size: 18px;
    line-height: 1.389;
  }
}
#Frame4 .content-ai .text .text-auto {
  position: absolute;
  z-index: 1;
  width: 100%;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  font-size: 20px;
  line-height: 1.6;
  color: #ffffff;
}
@media (max-width: 768px) {
  #Frame4 .content-ai .text .text-auto {
    font-size: 18px;
    line-height: 1.389;
  }
}

@keyframes f4-home-pulse {
  0%, 100% {
    transform: scale(1);
    filter: brightness(1) drop-shadow(0 0 0 rgba(255, 238, 150, 0));
  }
  50% {
    transform: scale(1.05);
    filter: brightness(1.08) drop-shadow(0 0 18px rgba(255, 238, 150, 0.85));
  }
}
#Frame5 {
  position: relative;
  height: 5784px;
}
@media (max-width: 768px) {
  #Frame5 {
    height: 5400px;
  }
}
#Frame5 .background {
  position: absolute;
  top: 0;
  left: 0;
}
#Frame5 .content {
  position: absolute;
  inset: 0;
}
#Frame5 .content-ai .logo {
  position: absolute;
  left: 70px;
  top: 25px;
}
#Frame5 .content-ai .logo img {
  display: block;
}
@media (max-width: 768px) {
  #Frame5 .content-ai .logo {
    left: 20px;
    top: 20px;
  }
  #Frame5 .content-ai .logo img {
    width: 293px;
    height: auto;
  }
}
#Frame5 .content-ai .text-form {
  position: absolute;
  left: 341px;
  top: 1055px;
  width: 1320px;
  display: flex;
  flex-direction: column;
}
#Frame5 .content-ai .text-form .emo {
  display: inline-block;
  height: 1em;
  width: auto;
  vertical-align: -0.15em;
}
#Frame5 .content-ai .text-form .intro {
  text-align: center;
}
#Frame5 .content-ai .text-form .intro p {
  margin: 0;
}
#Frame5 .content-ai .text-form .intro .line-red {
  font-family: "SRN-CookieRun-Black";
  font-size: 32px;
  line-height: 40px;
  color: #ff0000;
}
#Frame5 .content-ai .text-form .intro .line-orange {
  font-size: 27px;
  line-height: 36px;
  color: #ff8514;
}
#Frame5 .content-ai .text-form .intro .line-orange2 {
  margin-top: 22px;
  font-size: 26px;
  line-height: 36px;
  color: #ff5a00;
}
#Frame5 .content-ai .text-form .intro .line-dark {
  margin-top: 6px;
  font-size: 24px;
  line-height: 31px;
  color: #1c1c1c;
}
#Frame5 .content-ai .text-form .qsec {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 24px;
}
#Frame5 .content-ai .text-form .qbar {
  width: 100%;
  height: 72px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0 36px;
  border-radius: 18px;
  box-sizing: border-box;
}
#Frame5 .content-ai .text-form .qbar.qbar--blue {
  background: #4bd1fa;
  border: 3px solid #ffffff;
  box-shadow: 0 0 0 2px #48caff;
}
#Frame5 .content-ai .text-form .qbar.qbar--pink {
  background: #fddde6;
  border: 3px solid #ffffff;
  box-shadow: 0 0 0 2px #ff86ce;
}
#Frame5 .content-ai .text-form .qbar.qbar--2line {
  height: 109px;
}
#Frame5 .content-ai .text-form .qbar.qbar--tall {
  height: 127px;
}
#Frame5 .content-ai .text-form .qbar.qbar--note {
  height: 216px;
  justify-content: flex-start;
  padding-top: 14px;
}
#Frame5 .content-ai .text-form .qhead {
  font-family: "SRN-CookieRun-Black";
  font-size: 33px;
  line-height: 45px;
  color: #fff2a8;
  -webkit-text-stroke: 6px transparent;
  paint-order: stroke fill;
}
#Frame5 .content-ai .text-form .qhead.qhead--blue {
  -webkit-text-stroke-color: #00a5ea;
}
#Frame5 .content-ai .text-form .qhead.qhead--pink {
  -webkit-text-stroke-color: #fc41b1;
}
#Frame5 .content-ai .text-form .qhead .req {
  -webkit-text-stroke: 0;
  color: #ff0000;
  padding-left: 4px;
}
#Frame5 .content-ai .text-form .note-text {
  margin-top: 10px;
  font-family: "SRN-CookieRun-Bold";
  font-size: 30px;
  line-height: 1.35;
  color: #3d0732;
  -webkit-text-stroke: 0;
}
#Frame5 .content-ai .text-form .note-text .c-pink {
  color: #ff5bac;
}
#Frame5 .content-ai .text-form .note-text .c-blue {
  color: #1e90ff;
}
#Frame5 .content-ai .text-form .note-text .c-yellow {
  color: #ffb300;
}
#Frame5 .content-ai .text-form .qbody {
  margin: 0;
  padding-left: 4px;
  font-family: "SRN-CookieRun-Bold";
  font-size: 27px;
  line-height: 40px;
  color: #1c1c1c;
}
#Frame5 .content-ai .text-form .qbody.qbody--sm {
  font-size: 24px;
  line-height: 28px;
}
#Frame5 .content-ai .text-form .luuy-body {
  margin-top: 27px;
}
#Frame5 .content-ai .text-form .opts {
  padding-left: 12px;
}
#Frame5 .content-ai .text-form .opts .opt {
  display: flex;
  align-items: center;
  height: 48px;
  cursor: pointer;
}
#Frame5 .content-ai .text-form .opts .opt-in {
  position: absolute;
  width: 0;
  height: 0;
  opacity: 0;
  pointer-events: none;
}
#Frame5 .content-ai .text-form .opts .cb {
  position: relative;
  flex: none;
  width: 34px;
  height: 34px;
  margin-right: 18px;
  background: #ffffff;
  box-sizing: border-box;
  transition: background 0.15s;
}
#Frame5 .content-ai .text-form .opts .opt-in[type=checkbox] + .cb {
  border: 3px solid #ff7c34;
  border-radius: 8px;
}
#Frame5 .content-ai .text-form .opts .opt-in[type=checkbox]:checked + .cb {
  background: #ff7c34;
}
#Frame5 .content-ai .text-form .opts .opt-in[type=checkbox]:checked + .cb::after {
  content: "";
  position: absolute;
  left: 10px;
  top: 4px;
  width: 8px;
  height: 15px;
  border: solid #ffffff;
  border-width: 0 4px 4px 0;
  transform: rotate(45deg);
}
#Frame5 .content-ai .text-form .opts .opt-in[type=radio] + .cb {
  border: 3px solid #62bb46;
  border-radius: 50%;
}
#Frame5 .content-ai .text-form .opts .opt-in[type=radio]:checked + .cb::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #62bb46;
  transform: translate(-50%, -50%);
}
#Frame5 .content-ai .text-form .opts .opt-in[type=checkbox]:focus-visible + .cb {
  box-shadow: 0 0 0 3px rgba(255, 124, 52, 0.4);
}
#Frame5 .content-ai .text-form .opts .opt-in[type=radio]:focus-visible + .cb {
  box-shadow: 0 0 0 3px rgba(98, 187, 70, 0.4);
}
#Frame5 .content-ai .text-form .opts .opt-txt {
  font-family: "SRN-CookieRun-Bold";
  font-size: 27px;
  line-height: 1.1;
  white-space: nowrap;
  color: #1c1c1c;
}
#Frame5 .content-ai .text-form .q-input {
  display: block;
  width: 100%;
  height: 128px;
  padding: 18px 36px;
  border-radius: 24px;
  box-sizing: border-box;
  background: #e9f7ff;
  border: 3px solid #ffffff;
  box-shadow: 0 0 0 2px #bde6f5;
  font-family: "SRN-CookieRun-Bold";
  font-size: 27px;
  line-height: 1.3;
  color: #1c1c1c;
  resize: none;
  outline: none;
}
#Frame5 .content-ai .text-form .q-input::placeholder {
  color: #7f7f7f;
  opacity: 1;
}
#Frame5 .content-ai .text-form .q-input:focus {
  box-shadow: 0 0 0 2px #62bb46;
}
#Frame5 .content-ai .text-form .qsubmit {
  align-self: center;
  margin-top: 136px;
  padding: 0;
  border: none;
  background-color: transparent;
  cursor: pointer;
}
#Frame5 .content-ai .text-form .qsec--thongtin {
  margin-top: 28px;
}
#Frame5 .content-ai .text-form .qsec--diadiem {
  margin-top: 22px;
}
#Frame5 .content-ai .text-form .qsec--chondoi {
  margin-top: 23px;
}
#Frame5 .content-ai .text-form .qsec--muctieu {
  margin-top: 36px;
}
#Frame5 .content-ai .text-form .qsec--yesno {
  margin-top: 26px;
}
#Frame5 .content-ai .text-form .qsec--quantam {
  margin-top: 15px;
}
#Frame5 .content-ai .text-form .qsec--bietden {
  margin-top: 22px;
}
#Frame5 .content-ai .text-form .qsec--creator {
  margin-top: 21px;
}
#Frame5 .content-ai .text-form .qsec--dresscode {
  margin-top: 27px;
}
#Frame5 .content-ai .text-form .qsec--luuy {
  margin-top: 34px;
}
#Frame5 .content-ai .text-form .qsec--dongy {
  margin-top: 46px;
}
@media (max-width: 768px) {
  #Frame5 .content-ai .text-form {
    top: 827px;
    left: 68px;
    width: 632px;
  }
  #Frame5 .content-ai .text-form .intro .line-red {
    font-size: 30px;
    line-height: 38px;
  }
  #Frame5 .content-ai .text-form .intro .line-orange {
    font-size: 24px;
    line-height: 30px;
  }
  #Frame5 .content-ai .text-form .intro .line-orange2 {
    font-size: 24px;
    line-height: 30px;
    margin-top: 14px;
  }
  #Frame5 .content-ai .text-form .intro .line-dark {
    font-size: 22px;
    line-height: 28px;
  }
  #Frame5 .content-ai .text-form .qsec {
    gap: 11px;
  }
  #Frame5 .content-ai .text-form .qbar {
    height: auto;
    min-height: 60px;
    padding: 10px 18px;
    border-radius: 16px;
  }
  #Frame5 .content-ai .text-form .qbar.qbar--note {
    min-height: 0;
    padding: 12px 18px;
  }
  #Frame5 .content-ai .text-form .qhead {
    font-size: 24px;
    line-height: 29px;
    -webkit-text-stroke-width: 4px;
  }
  #Frame5 .content-ai .text-form .note-text {
    font-size: 16px;
    line-height: 22px;
    margin-top: 6px;
  }
  #Frame5 .content-ai .text-form .qbody {
    font-size: 20px;
    line-height: 26px;
  }
  #Frame5 .content-ai .text-form .qbody--sm {
    font-size: 16px;
    line-height: 17px;
  }
  #Frame5 .content-ai .text-form .luuy-body {
    margin-top: 8px;
  }
  #Frame5 .content-ai .text-form .opts {
    padding-left: 17px;
  }
  #Frame5 .content-ai .text-form .opts .opt {
    height: auto;
    align-items: flex-start;
    margin-bottom: 6px;
  }
  #Frame5 .content-ai .text-form .opts .cb {
    width: 28px;
    height: 28px;
    margin-right: 13px;
    margin-top: 2px;
  }
  #Frame5 .content-ai .text-form .opts .opt-in[type=checkbox]:checked + .cb::after {
    left: 8px;
    top: 3px;
    width: 7px;
    height: 12px;
  }
  #Frame5 .content-ai .text-form .opts .opt-in[type=radio]:checked + .cb::after {
    width: 13px;
    height: 13px;
  }
  #Frame5 .content-ai .text-form .opts .opt-txt {
    font-size: 20px;
    line-height: 25px;
    white-space: normal;
  }
  #Frame5 .content-ai .text-form .q-input {
    height: 140px;
    padding: 14px 20px;
    font-size: 20px;
  }
  #Frame5 .content-ai .text-form .qsubmit {
    margin-top: 140px;
    transform: scale(0.94);
  }
  #Frame5 .content-ai .text-form .qsec--thongtin {
    margin-top: 26px;
  }
  #Frame5 .content-ai .text-form .qsec--diadiem {
    margin-top: 26px;
  }
  #Frame5 .content-ai .text-form .qsec--chondoi {
    margin-top: 22px;
  }
  #Frame5 .content-ai .text-form .qsec--muctieu {
    margin-top: 26px;
  }
  #Frame5 .content-ai .text-form .qsec--yesno {
    margin-top: 16px;
  }
  #Frame5 .content-ai .text-form .qsec--quantam {
    margin-top: 22px;
  }
  #Frame5 .content-ai .text-form .qsec--bietden {
    margin-top: 22px;
  }
  #Frame5 .content-ai .text-form .qsec--creator {
    margin-top: 22px;
  }
  #Frame5 .content-ai .text-form .qsec--dresscode {
    margin-top: 24px;
  }
  #Frame5 .content-ai .text-form .qsec--luuy {
    margin-top: 18px;
  }
  #Frame5 .content-ai .text-form .qsec--dongy {
    margin-top: 20px;
  }
}
#Frame6 {
  position: relative;
  height: 5784px;
}
@media (max-width: 768px) {
  #Frame6 {
    height: 5700px;
  }
}
#Frame6 .background {
  position: absolute;
  top: 0;
  left: 0;
}
#Frame6 .content {
  position: absolute;
  inset: 0;
}
#Frame6 .content-ai .logo {
  position: absolute;
  left: 70px;
  top: 25px;
}
#Frame6 .content-ai .logo img {
  display: block;
}
@media (max-width: 768px) {
  #Frame6 .content-ai .logo {
    left: 20px;
    top: 20px;
  }
  #Frame6 .content-ai .logo img {
    width: 293px;
    height: auto;
  }
}
#Frame6 .content-ai .text-form {
  position: absolute;
  left: 323px;
  top: 1077px;
  width: 1352px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
#Frame6 .content-ai .text-form .emo {
  display: inline-block;
  height: 1em;
  width: auto;
  vertical-align: -0.15em;
}
#Frame6 .content-ai .text-form .intro {
  text-align: center;
}
#Frame6 .content-ai .text-form .intro p {
  margin: 0;
}
#Frame6 .content-ai .text-form .intro .line-red {
  font-family: "SRN-CookieRun-Black";
  font-size: 33px;
  line-height: 44px;
  color: #ff0000;
}
#Frame6 .content-ai .text-form .intro .line-dark {
  margin-top: 17px;
  font-size: 23px;
  line-height: 29px;
  color: #1c1c1c;
}
#Frame6 .content-ai .text-form .intro .line-note {
  margin-top: 18px;
  font-size: 24px;
  line-height: 30px;
  color: #1c1c1c;
  text-align: left;
}
#Frame6 .content-ai .text-form .intro .intro-body {
  padding-left: 37px;
  text-align: left;
}
#Frame6 .content-ai .text-form .qsec {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 24px;
}
#Frame6 .content-ai .text-form .qbar {
  width: 100%;
  height: 72px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0 36px;
  border-radius: 18px;
  box-sizing: border-box;
}
#Frame6 .content-ai .text-form .qbar.qbar--blue {
  background: #4bd1fa;
  border: 3px solid #ffffff;
  box-shadow: 0 0 0 2px #48caff;
}
#Frame6 .content-ai .text-form .qbar.qbar--pink {
  background: #fddde6;
  border: 3px solid #ffffff;
  box-shadow: 0 0 0 2px #ff86ce;
}
#Frame6 .content-ai .text-form .qbar.qbar--note {
  height: 220px;
  justify-content: flex-start;
  padding-top: 14px;
}
#Frame6 .content-ai .text-form .qhead {
  font-family: "SRN-CookieRun-Black";
  font-size: 33px;
  line-height: 45px;
  color: #fff2a8;
  -webkit-text-stroke: 6px transparent;
  paint-order: stroke fill;
}
#Frame6 .content-ai .text-form .qhead.qhead--blue {
  -webkit-text-stroke-color: #00a5ea;
}
#Frame6 .content-ai .text-form .qhead.qhead--pink {
  -webkit-text-stroke-color: #fc41b1;
}
#Frame6 .content-ai .text-form .qhead .req {
  -webkit-text-stroke: 0;
  color: #ff0000;
  padding-left: 4px;
}
#Frame6 .content-ai .text-form .note-text {
  display: block;
  margin-top: 10px;
  font-family: "SRN-CookieRun-Bold";
  font-size: 26px;
  line-height: 1.35;
  color: #3d0732;
  -webkit-text-stroke: 0;
}
#Frame6 .content-ai .text-form .qbody {
  margin: 0;
  padding-left: 4px;
  font-family: "SRN-CookieRun-Bold";
  font-size: 24px;
  line-height: 31px;
  color: #1c1c1c;
}
#Frame6 .content-ai .text-form .qbody.qbody--sm {
  font-size: 22px;
  line-height: 29px;
}
#Frame6 .content-ai .text-form .qbody.qbody--xs {
  font-size: 18px;
  line-height: 23px;
}
#Frame6 .content-ai .text-form .opts {
  padding-left: 12px;
}
#Frame6 .content-ai .text-form .opts .opt {
  display: flex;
  align-items: center;
  height: 48px;
  cursor: pointer;
}
#Frame6 .content-ai .text-form .opts .opt-in {
  position: absolute;
  width: 0;
  height: 0;
  opacity: 0;
  pointer-events: none;
}
#Frame6 .content-ai .text-form .opts .cb {
  position: relative;
  flex: none;
  width: 34px;
  height: 34px;
  margin-right: 18px;
  background: #ffffff;
  box-sizing: border-box;
  transition: background 0.15s;
}
#Frame6 .content-ai .text-form .opts .opt-in[type=checkbox] + .cb {
  border: 3px solid #ff7c34;
  border-radius: 8px;
}
#Frame6 .content-ai .text-form .opts .opt-in[type=checkbox]:checked + .cb {
  background: #ff7c34;
}
#Frame6 .content-ai .text-form .opts .opt-in[type=checkbox]:checked + .cb::after {
  content: "";
  position: absolute;
  left: 10px;
  top: 4px;
  width: 8px;
  height: 15px;
  border: solid #ffffff;
  border-width: 0 4px 4px 0;
  transform: rotate(45deg);
}
#Frame6 .content-ai .text-form .opts .opt-in[type=radio] + .cb {
  border: 3px solid #62bb46;
  border-radius: 50%;
}
#Frame6 .content-ai .text-form .opts .opt-in[type=radio]:checked + .cb::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #62bb46;
  transform: translate(-50%, -50%);
}
#Frame6 .content-ai .text-form .opts .opt-txt {
  font-family: "SRN-CookieRun-Bold";
  font-size: 27px;
  line-height: 1.1;
  white-space: nowrap;
  color: #1c1c1c;
}
#Frame6 .content-ai .text-form .q-input {
  display: block;
  width: 100%;
  height: 70px;
  padding: 0 36px;
  border-radius: 22px;
  box-sizing: border-box;
  background: #e9f7ff;
  border: 3px solid #ffffff;
  box-shadow: 0 0 0 2px #bde6f5;
  font-family: "SRN-CookieRun-Bold";
  font-size: 27px;
  line-height: 1.3;
  color: #1c1c1c;
  outline: none;
}
#Frame6 .content-ai .text-form .q-input::placeholder {
  color: #7f7f7f;
  opacity: 1;
}
#Frame6 .content-ai .text-form .q-input:focus {
  box-shadow: 0 0 0 2px #62bb46;
}
#Frame6 .content-ai .text-form .qsubmit {
  align-self: center;
  margin-top: 60px;
  padding: 0;
  border: none;
  background-color: transparent;
  cursor: pointer;
}
#Frame6 .content-ai .text-form .qsec--thongtin {
  margin-top: 29px;
}
#Frame6 .content-ai .text-form .qsec--hashtag {
  gap: 26px;
  margin-top: 22px;
}
#Frame6 .content-ai .text-form .qsec--bangthi {
  margin-top: 24px;
}
#Frame6 .content-ai .text-form .qsec--textinput {
  margin-top: 22px;
}
@media (max-width: 768px) {
  #Frame6 .content-ai .text-form {
    top: 827px;
    left: 68px;
    width: 632px;
  }
  #Frame6 .content-ai .text-form .intro .line-red {
    font-size: 22px;
    line-height: 28px;
  }
  #Frame6 .content-ai .text-form .intro .line-dark {
    font-size: 14px;
    line-height: 17px;
  }
  #Frame6 .content-ai .text-form .intro .line-note {
    font-size: 17px;
    line-height: 21px;
  }
  #Frame6 .content-ai .text-form .qsec {
    gap: 11px;
  }
  #Frame6 .content-ai .text-form .qbar {
    height: auto;
    min-height: 60px;
    padding: 10px 18px;
    border-radius: 16px;
  }
  #Frame6 .content-ai .text-form .qbar.qbar--note {
    min-height: 168px;
    padding: 12px 18px;
  }
  #Frame6 .content-ai .text-form .qhead {
    font-size: 23px;
    line-height: 28px;
    -webkit-text-stroke-width: 4px;
  }
  #Frame6 .content-ai .text-form .note-text {
    font-size: 16px;
    line-height: 21px;
    margin-top: 6px;
  }
  #Frame6 .content-ai .text-form .qbody {
    font-size: 16px;
    line-height: 20px;
  }
  #Frame6 .content-ai .text-form .qbody--sm {
    font-size: 15px;
    line-height: 19px;
  }
  #Frame6 .content-ai .text-form .qbody--xs {
    font-size: 13px;
    line-height: 16px;
  }
  #Frame6 .content-ai .text-form .opts {
    padding-left: 17px;
  }
  #Frame6 .content-ai .text-form .opts .opt {
    height: auto;
    align-items: flex-start;
    margin-bottom: 6px;
  }
  #Frame6 .content-ai .text-form .opts .cb {
    width: 28px;
    height: 28px;
    margin-right: 13px;
    margin-top: 2px;
  }
  #Frame6 .content-ai .text-form .opts .opt-in[type=checkbox]:checked + .cb::after {
    left: 8px;
    top: 3px;
    width: 7px;
    height: 12px;
  }
  #Frame6 .content-ai .text-form .opts .opt-in[type=radio]:checked + .cb::after {
    width: 13px;
    height: 13px;
  }
  #Frame6 .content-ai .text-form .opts .opt-txt {
    font-size: 20px;
    line-height: 25px;
    white-space: normal;
  }
  #Frame6 .content-ai .text-form .q-input {
    height: 58px;
    padding: 0 20px;
    font-size: 20px;
  }
  #Frame6 .content-ai .text-form .qsubmit {
    margin-top: 62px;
    transform: scale(0.94);
  }
  #Frame6 .content-ai .text-form .qsec--thongtin {
    margin-top: 24px;
  }
  #Frame6 .content-ai .text-form .qsec--hashtag {
    margin-top: 18px;
  }
  #Frame6 .content-ai .text-form .qsec--bangthi {
    margin-top: 18px;
  }
  #Frame6 .content-ai .text-form .qsec--textinput {
    margin-top: 18px;
  }
}
#Frame7 {
  position: relative;
  height: auto;
  overflow: hidden;
}
#Frame7 .background {
  position: absolute;
  top: 0;
  left: 0;
}
#Frame7 .content {
  position: absolute;
  inset: 0;
}
#Frame7 .content-ai {
  position: relative;
  inset: auto;
  padding-top: 1405px;
}
@media (max-width: 768px) {
  #Frame7 .content-ai {
    padding-top: 1759px;
  }
}
#Frame7 .content-ai .MS__sprite-f1-btn {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 800px;
}
@media (max-width: 768px) {
  #Frame7 .content-ai .MS__sprite-f1-btn {
    top: 1088px;
  }
}
#Frame7 .content-ai .detail-acc {
  position: relative;
  margin-left: 296px;
  width: 1400px;
  display: flex;
  flex-direction: column;
  gap: 43px;
  z-index: 4;
}
#Frame7 .content-ai .detail-acc .acc-item {
  position: relative;
  width: 1400px;
}
#Frame7 .content-ai .detail-acc .acc-item .acc-head {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 195px;
  cursor: pointer;
  z-index: 3;
}
#Frame7 .content-ai .detail-acc .acc-item .detail {
  position: relative;
  display: none;
}
#Frame7 .content-ai .detail-acc .acc-item .detail .txt {
  position: absolute;
  left: 150px;
  top: 212px;
  width: 1148px;
  height: 432px;
  overflow-y: auto;
  font-size: 30px;
  line-height: 1.4;
  color: #5a4a3a;
}
#Frame7 .content-ai .detail-acc .acc-item .detail .txt strong {
  color: #e0553b;
}
#Frame7 .content-ai .detail-acc .acc-item .detail .txt::-webkit-scrollbar {
  width: 8px;
}
#Frame7 .content-ai .detail-acc .acc-item .detail .txt::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.2);
  border-radius: 4px;
}
#Frame7 .content-ai .detail-acc .acc-item .deco {
  position: absolute;
  pointer-events: none;
  z-index: 2;
  transition: top 0.25s ease, left 0.25s ease, right 0.25s ease;
}
#Frame7 .content-ai .detail-acc .acc-item .caby {
  width: 308px;
  height: 542px;
  right: -175px;
  top: -242px;
}
#Frame7 .content-ai .detail-acc .acc-item .cogai {
  width: 140px;
  height: 263px;
  left: -76px;
  top: -16px;
}
#Frame7 .content-ai .detail-acc .acc-item .cogai2 {
  width: 168px;
  height: 211px;
  right: -77px;
  top: 48px;
}
#Frame7 .content-ai .detail-acc .acc-item .cogai3 {
  width: 241px;
  height: 421px;
  left: -128px;
  top: -150px;
}
#Frame7 .content-ai .detail-acc .acc-item.is-active .bar {
  display: none;
}
#Frame7 .content-ai .detail-acc .acc-item.is-active .detail {
  display: block;
}
#Frame7 .content-ai .detail-acc .acc-item.is-active .caby {
  top: 247px;
  right: -173px;
}
#Frame7 .content-ai .detail-acc .acc-item.is-active .cogai2 {
  top: 538px;
  right: -78px;
}
#Frame7 .content-ai .detail-acc .acc-item.is-active .cogai3 {
  top: 326px;
}
@media (max-width: 768px) {
  #Frame7 .content-ai .detail-acc {
    margin-left: 28px;
    width: 712px;
    gap: 50px;
  }
  #Frame7 .content-ai .detail-acc .acc-item {
    width: 712px;
  }
  #Frame7 .content-ai .detail-acc .acc-item .acc-head {
    height: 135px;
  }
  #Frame7 .content-ai .detail-acc .acc-item .detail .txt {
    left: 80px;
    top: 165px;
    width: 573px;
    height: 575px;
    font-size: 24px;
    line-height: 1.4;
  }
  #Frame7 .content-ai .detail-acc .acc-item:nth-child(1) .bar {
    background-image: url(assets/Frame7/images/sprite.png);
    background-position: -2112px -3357px;
    width: 712px;
    height: 181px;
  }
  #Frame7 .content-ai .detail-acc .acc-item:nth-child(1) .detail {
    background-image: url(assets/Frame7/images/sprite.png);
    background-position: -2800px -706px;
    width: 712px;
    height: 806px;
  }
  #Frame7 .content-ai .detail-acc .acc-item:nth-child(2) .bar {
    background-image: url(assets/Frame7/images/sprite.png);
    background-position: -2824px -3357px;
    width: 712px;
    height: 181px;
  }
  #Frame7 .content-ai .detail-acc .acc-item:nth-child(2) .detail {
    background-image: url(assets/Frame7/images/sprite.png);
    background-position: 0px -2118px;
    width: 712px;
    height: 806px;
  }
  #Frame7 .content-ai .detail-acc .acc-item:nth-child(3) .bar {
    background-image: url(assets/Frame7/images/sprite.png);
    background-position: 0px -3730px;
    width: 712px;
    height: 181px;
  }
  #Frame7 .content-ai .detail-acc .acc-item:nth-child(3) .detail {
    background-image: url(assets/Frame7/images/sprite.png);
    background-position: -712px -2118px;
    width: 712px;
    height: 806px;
  }
  #Frame7 .content-ai .detail-acc .acc-item:nth-child(4) .bar {
    background-image: url(assets/Frame7/images/sprite.png);
    background-position: -712px -3730px;
    width: 712px;
    height: 181px;
  }
  #Frame7 .content-ai .detail-acc .acc-item:nth-child(4) .detail {
    background-image: url(assets/Frame7/images/sprite.png);
    background-position: -1424px -2118px;
    width: 712px;
    height: 806px;
  }
  #Frame7 .content-ai .detail-acc .acc-item:nth-child(5) .bar {
    background-image: url(assets/Frame7/images/sprite.png);
    background-position: -1424px -3730px;
    width: 712px;
    height: 181px;
  }
  #Frame7 .content-ai .detail-acc .acc-item:nth-child(5) .detail {
    background-image: url(assets/Frame7/images/sprite.png);
    background-position: -2136px -2118px;
    width: 712px;
    height: 806px;
  }
  #Frame7 .content-ai .detail-acc .acc-item:nth-child(6) .bar {
    background-image: url(assets/Frame7/images/sprite.png);
    background-position: -2136px -3730px;
    width: 712px;
    height: 181px;
  }
  #Frame7 .content-ai .detail-acc .acc-item:nth-child(6) .detail {
    background-image: url(assets/Frame7/images/sprite.png);
    background-position: -2848px -2118px;
    width: 712px;
    height: 806px;
  }
  #Frame7 .content-ai .detail-acc .acc-item:nth-child(7) .bar {
    background-image: url(assets/Frame7/images/sprite.png);
    background-position: -2848px -3730px;
    width: 712px;
    height: 181px;
  }
  #Frame7 .content-ai .detail-acc .acc-item:nth-child(7) .detail {
    background-image: url(assets/Frame7/images/sprite.png);
    background-position: 0px -2924px;
    width: 712px;
    height: 806px;
  }
  #Frame7 .content-ai .detail-acc .acc-item .deco {
    transform: scale(0.6);
    transform-origin: top left;
  }
  #Frame7 .content-ai .detail-acc .acc-item .caby {
    left: 652px;
    right: auto;
    top: 30px;
  }
  #Frame7 .content-ai .detail-acc .acc-item .cogai {
    left: -20px;
    top: -19px;
  }
  #Frame7 .content-ai .detail-acc .acc-item .cogai2 {
    left: 640px;
    right: auto;
    top: 73px;
  }
  #Frame7 .content-ai .detail-acc .acc-item .cogai3 {
    left: -21px;
    top: 27px;
  }
  #Frame7 .content-ai .detail-acc .acc-item.is-active .caby {
    left: 583px;
    top: 525px;
  }
  #Frame7 .content-ai .detail-acc .acc-item.is-active .cogai {
    left: -25px;
    top: 662px;
  }
  #Frame7 .content-ai .detail-acc .acc-item.is-active .cogai2 {
    left: 641px;
    top: 698px;
  }
  #Frame7 .content-ai .detail-acc .acc-item.is-active .cogai3 {
    left: -20px;
    top: 653px;
  }
}
#Frame7 .content-ai .f7-footer {
  position: relative;
  width: 2000px;
  height: 2056px;
  margin-top: 185px;
  z-index: 5;
}
@media (max-width: 768px) {
  #Frame7 .content-ai .f7-footer {
    width: 768px;
    height: 1765px;
    margin-top: 172px;
  }
}
#Frame7 .content-ai .f7-footer .bg-footer {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 2000px;
  height: auto;
  z-index: 0;
}
#Frame7 .content-ai .f7-footer .bg-footer-mb {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 768px;
  height: auto;
  z-index: 0;
}
#Frame7 .content-ai .f7-footer .list-socials {
  position: absolute;
  left: 661px;
  top: 1496px;
  width: 692px;
  height: 150px;
  z-index: 1;
}
@media (max-width: 768px) {
  #Frame7 .content-ai .f7-footer .list-socials {
    left: 58px;
    top: 1289px;
    width: 666px;
    height: 144px;
  }
}
#Frame7 .content-ai .f7-footer .list-socials .MS__sprite-f2-btn-fb {
  position: absolute;
  left: 0;
  top: 0;
}
@media (max-width: 768px) {
  #Frame7 .content-ai .f7-footer .list-socials .MS__sprite-f2-btn-fb {
    transform: scale(0.966);
    transform-origin: left top;
  }
}
#Frame7 .content-ai .f7-footer .list-socials .MS__sprite-f2-btn-yt {
  position: absolute;
  left: 181px;
  top: 0;
}
@media (max-width: 768px) {
  #Frame7 .content-ai .f7-footer .list-socials .MS__sprite-f2-btn-yt {
    left: 174px;
    transform: scale(0.9643);
    transform-origin: left top;
  }
}
#Frame7 .content-ai .f7-footer .list-socials .MS__sprite-f2-btn-tt {
  position: absolute;
  left: 369px;
  top: 0;
}
@media (max-width: 768px) {
  #Frame7 .content-ai .f7-footer .list-socials .MS__sprite-f2-btn-tt {
    left: 354px;
    transform: scale(0.9669);
    transform-origin: left top;
  }
}
#Frame7 .content-ai .f7-footer .list-socials .MS__sprite-f2-btn-gr {
  position: absolute;
  left: 523px;
  top: 0;
}
@media (max-width: 768px) {
  #Frame7 .content-ai .f7-footer .list-socials .MS__sprite-f2-btn-gr {
    left: 502px;
    transform: scale(0.9704);
    transform-origin: left top;
  }
}
#Frame7 .content-ai .f7-footer .list-logos {
  position: absolute;
  left: 637px;
  top: 1668px;
  width: 726px;
  height: 89px;
  z-index: 1;
}
@media (max-width: 768px) {
  #Frame7 .content-ai .f7-footer .list-logos {
    left: 149px;
    top: 1456px;
    width: 470px;
    height: 59px;
  }
}
#Frame7 .content-ai .f7-footer .list-logos .vnggames {
  position: absolute;
  left: 525px;
  top: 0;
  width: 201px;
  height: 84px;
}
@media (max-width: 768px) {
  #Frame7 .content-ai .f7-footer .list-logos .vnggames {
    left: 341px;
    width: 129px;
    height: 54px;
  }
}
#Frame7 .content-ai .f7-footer .list-logos .dapheduyet {
  position: absolute;
  left: 0;
  top: 21px;
  width: 196px;
  height: 68px;
}
@media (max-width: 768px) {
  #Frame7 .content-ai .f7-footer .list-logos .dapheduyet {
    top: 15px;
    width: 127px;
    height: 44px;
  }
}
#Frame7 .content-ai .f7-footer .list-logos .haegin {
  position: absolute;
  left: 237px;
  top: 37px;
  width: 257px;
  height: 37px;
}
@media (max-width: 768px) {
  #Frame7 .content-ai .f7-footer .list-logos .haegin {
    left: 153px;
    top: 24px;
    width: 168px;
    height: 24px;
  }
}
#Frame7 .content-ai .f7-footer .text {
  position: absolute;
  top: 1795px;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  height: 154px;
  z-index: 1;
  font-size: 20px;
  line-height: 1.6;
  text-align: center;
  color: #ffffff;
}
@media (max-width: 768px) {
  #Frame7 .content-ai .f7-footer .text {
    top: 1544px;
    width: 100%;
    height: 172px;
    font-size: 18px;
    line-height: 1.389;
  }
}
#Frame7 .content-ai .f7-footer .text .text-auto {
  position: absolute;
  z-index: 1;
  width: 100%;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  font-size: 20px;
  line-height: 1.6;
  color: #ffffff;
}
@media (max-width: 768px) {
  #Frame7 .content-ai .f7-footer .text .text-auto {
    font-size: 18px;
    line-height: 1.389;
  }
}
#Frame7 .content-ai .swiper-kols {
  position: absolute;
  left: 342px;
  top: 0;
  width: 1316px;
  height: 725px;
  z-index: 5;
}
@media (max-width: 768px) {
  #Frame7 .content-ai .swiper-kols {
    left: 39px;
    top: 0;
    width: 690px;
    height: 548px;
  }
  #Frame7 .content-ai .swiper-kols .f7-swiper .swiper-slide {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  #Frame7 .content-ai .swiper-kols .f7-swiper .swiper-slide img {
    height: auto;
  }
  #Frame7 .content-ai .swiper-kols .f7-swiper .swiper-slide-active {
    transform: scale(1.4);
    z-index: 2;
  }
  #Frame7 .content-ai .swiper-kols .f7-swiper-prev {
    left: 114px;
    transform: translateY(-50%) scale(0.7);
  }
  #Frame7 .content-ai .swiper-kols .f7-swiper-next {
    right: 113px;
    transform: translateY(-50%) scale(0.7);
  }
  #Frame7 .content-ai .swiper-kols .f7-swiper-pagination {
    bottom: -52px;
    gap: 12px;
  }
  #Frame7 .content-ai .swiper-kols .f7-swiper-pagination .swiper-pagination-bullet {
    transform: scale(0.78);
  }
}
#Frame7 .content-ai .swiper-kols .f7-swiper {
  position: absolute;
  inset: 0;
  overflow: hidden;
  z-index: 1;
}
#Frame7 .content-ai .swiper-kols .f7-swiper .swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
#Frame7 .content-ai .swiper-kols .f7-swiper-prev,
#Frame7 .content-ai .swiper-kols .f7-swiper-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 4;
  cursor: pointer;
}
#Frame7 .content-ai .swiper-kols .f7-swiper-prev {
  left: -100px;
}
@media (max-width: 768px) {
  #Frame7 .content-ai .swiper-kols .f7-swiper-prev {
    left: -30px;
  }
}
#Frame7 .content-ai .swiper-kols .f7-swiper-next {
  right: -100px;
}
@media (max-width: 768px) {
  #Frame7 .content-ai .swiper-kols .f7-swiper-next {
    right: -30px;
  }
}
#Frame7 .content-ai .swiper-kols .f7-swiper-pagination {
  position: absolute;
  left: 0;
  right: 0;
  bottom: -64px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 18px;
  z-index: 4;
}
#Frame7 .content-ai .swiper-kols .f7-swiper-pagination .swiper-pagination-bullet {
  background-image: url(assets/Frame7/images/sprite.png);
  background-position: -3558px -823px;
  width: 46px;
  height: 46px;
  margin: 0;
  opacity: 1;
  background-color: transparent;
  border-radius: 0;
}
#Frame7 .content-ai .swiper-kols .f7-swiper-pagination .swiper-pagination-bullet-active {
  background-image: url(assets/Frame7/images/sprite.png);
  background-position: -3512px -823px;
  width: 46px;
  height: 46px;
}
#Frame7 .content-ai .swiper-kols .btn-nopbai {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 847px;
  z-index: 6;
}
@media (max-width: 768px) {
  #Frame7 .content-ai .swiper-kols .btn-nopbai {
    top: 666px;
  }
}
#Float_right {
  position: absolute;
  width: 234px;
  height: 533px;
  top: 199px;
  left: 1747px;
  transition: transform 0.35s ease;
}
#Float_right .btn-toggle {
  position: absolute;
  left: 6px;
  top: 157px;
  z-index: 2;
  cursor: pointer;
}
#Float_right .content-ai {
  position: absolute;
  inset: 0;
}
#Float_right .background {
  position: absolute;
  left: 44px;
  top: 0px;
}
#Float_right .qr {
  position: absolute;
  left: 69px;
  top: 118px;
  width: 140px;
  height: 140px;
}
#Float_right .MS__sprite-right-btn-ios {
  position: absolute;
  left: 68px;
  top: 266px;
}
#Float_right .MS__sprite-right-btn-android {
  position: absolute;
  left: 68px;
  top: 310px;
}
#Float_right .MS__sprite-right-btn-apk {
  position: absolute;
  left: 68px;
  top: 354px;
}
#Float_right .list-items {
  position: absolute;
  left: 60px;
  top: 425px;
  width: 158px;
  height: 28px;
}
#Float_right .list-items .MS__sprite-right-icon-home {
  position: absolute;
  left: 25px;
  top: 3px;
}
#Float_right .list-items .MS__sprite-right-icon-group {
  position: absolute;
  left: 65px;
  top: 3px;
}
#Float_right .list-items .MS__sprite-right-icon-facebook {
  position: absolute;
  left: 120px;
  top: 3px;
}
#Float_right .btn-top {
  position: absolute;
  left: 108px;
  top: 487px;
  cursor: pointer;
}
#Float_right.is-hidden {
  transform: translateX(210px);
}
#nth-gd-navigation {
  position: relative;
  pointer-events: none;
  height: 82px;
}
#nth-gd-navigation .background {
  position: absolute;
  top: 0;
  left: 0;
}
#nth-gd-navigation .content {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  box-sizing: border-box;
}
#nth-gd-navigation .logo {
  position: absolute;
  left: 95px;
  top: 11px;
  pointer-events: auto;
}
#nth-gd-navigation .logo img {
  display: block;
  width: 184px;
  height: 61px;
}
#nth-gd-navigation .menu {
  position: absolute;
  right: 120px;
  top: 0;
  height: 82px;
  display: flex;
  align-items: center;
  gap: 16px;
}
#nth-gd-navigation .menu__item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 52px;
  padding: 3px 32px 0;
  box-sizing: border-box;
  border-radius: 999px;
  font-size: 24px;
  line-height: 1;
  color: #2ca7e0;
  background: transparent;
  white-space: nowrap;
  pointer-events: auto;
  text-decoration: none;
  transition: opacity 0.2s linear;
}
#nth-gd-navigation .menu__item:hover {
  opacity: 0.8;
}
#nth-gd-navigation .menu__item.is-active {
  color: #0d5b8c;
  background: #ffd23d;
}
#nth-gd-navigation .menu__item--login {
  color: #ffffff;
  background: #ff8ec4;
}

#nth-gd-navigation-mb {
  position: relative;
  pointer-events: none;
  height: 82px;
}
#nth-gd-navigation-mb .background {
  position: absolute;
  top: 0;
  left: 0;
}
#nth-gd-navigation-mb .content {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  box-sizing: border-box;
  z-index: 100;
}
#nth-gd-navigation-mb .logo {
  position: absolute;
  left: 30px;
  top: 14px;
  pointer-events: auto;
}
#nth-gd-navigation-mb .logo img {
  display: block;
  width: 184px;
  height: 61px;
}
#nth-gd-navigation-mb .menu {
  position: absolute;
  right: 30px;
  top: 0;
  height: 82px;
  display: flex;
  align-items: center;
  gap: 28px;
}
#nth-gd-navigation-mb .btn-login {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 56px;
  padding: 3px 36px 0;
  box-sizing: border-box;
  border-radius: 999px;
  font-size: 28px;
  line-height: 1;
  color: #ffffff;
  background: #ff8ec4;
  white-space: nowrap;
  text-decoration: none;
  pointer-events: auto;
  transition: opacity 0.2s linear;
}
#nth-gd-navigation-mb .btn-login:hover {
  opacity: 0.8;
}
#nth-gd-navigation-mb .btn-burger {
  display: block;
  pointer-events: auto;
}
#nth-gd-navigation-mb .btn-close {
  display: none;
  pointer-events: auto;
}
#nth-gd-navigation-mb .nav-panel {
  position: fixed;
  left: 0;
  right: 0;
  top: 82px;
  bottom: 0;
  z-index: 90;
  display: flex;
  flex-direction: column;
  align-items: center;
  box-sizing: border-box;
  padding: 70px 0 80px;
  background: rgba(14, 17, 21, 0.88);
  pointer-events: auto;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s ease, visibility 0.25s ease;
}
#nth-gd-navigation-mb .nav-panel__list {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 90px;
}
#nth-gd-navigation-mb .nav-panel__item {
  font-size: 40px;
  line-height: 1;
  color: #f08a1d;
  white-space: nowrap;
  text-decoration: none;
}
#nth-gd-navigation-mb .nav-panel__item.is-active {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 18px 50px 13px;
  border-radius: 999px;
  background: #ffd23d;
  color: #b95f08;
}
#nth-gd-navigation-mb .nav-panel__cta {
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 22px 72px 17px;
  border-radius: 999px;
  background: #6e1512;
  color: #a51d16;
  font-size: 40px;
  line-height: 1;
  white-space: nowrap;
  text-decoration: none;
  box-shadow: inset 0 4px 8px rgba(0, 0, 0, 0.45);
}
#nth-gd-navigation-mb.is-open .btn-burger {
  display: none;
}
#nth-gd-navigation-mb.is-open .btn-close {
  display: block;
}
#nth-gd-navigation-mb.is-open .nav-panel {
  opacity: 1;
  visibility: visible;
}
.popup_login .content .list-btn {
  display: flex;
  flex-direction: column;
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 16px 0;
}
.popup_login .content .list-btn a {
  display: block;
}

.popup_register .content form {
  width: 88%;
  padding: 0 22px;
  overflow-y: auto;
  margin-top: 16px;
}
.popup_register .content form .desc {
  margin: 0 0 8px;
  font-size: 18px;
  line-height: 26px;
  text-align: left;
  color: #8f6a4b;
}
.popup_register .content form .row {
  width: 100%;
  display: flex;
  gap: 24px;
  margin-bottom: 16px;
}
@media (max-width: 768px) {
  .popup_register .content form .row {
    margin-bottom: 24px;
  }
}
.popup_register .content form .row .value {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
}
.popup_register .content form .row .value label {
  font-size: 18px;
  font-weight: bold;
  text-transform: uppercase;
  text-align: left;
  color: #6f401d;
}
.popup_register .content form .row .value select,
.popup_register .content form .row .value input {
  height: 52px;
  border-radius: 8px;
  padding-left: 12px;
  background-color: white;
  color: #5b6b75;
  border: 1px solid #d0aa65;
  font-size: 18px;
}
.popup_register .content form .row .value select::placeholder,
.popup_register .content form .row .value input::placeholder {
  color: #adbac3;
}
.popup_register .content form .warning {
  width: 100%;
  box-sizing: border-box;
  margin: 8px 0 20px;
  padding: 14px 16px;
  border: 1px solid #e3736f;
  border-radius: 8px;
  background-color: #fbe9e7;
  text-align: left;
}
.popup_register .content form .warning .warning__title {
  margin: 0 0 6px;
  font-size: 18px;
  font-weight: bold;
  color: #d0433d;
}
.popup_register .content form .warning .warning__desc {
  margin: 0;
  font-size: 15px;
  line-height: 21px;
  color: #c2756f;
}
.popup_register .content form .confirm {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  text-align: left;
  font-size: 16px;
  line-height: 22px;
  color: #8f6a4b;
  cursor: pointer;
}
.popup_register .content form .confirm input {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  margin-top: 2px;
  accent-color: #6f401d;
}
.popup_register .content form .btn {
  margin-top: 12px !important;
}

.popup_dxgntv .content .notice {
  font-size: 18px;
  color: #a35526;
  margin-top: 32px;
}
.popup_dxgntv .content form {
  width: 65%;
  height: 85%;
  padding: 0 22px;
  overflow-y: auto;
  margin-top: 12px;
}
.popup_dxgntv .content form .row {
  width: 100%;
  display: flex;
  gap: 24px;
  margin-bottom: 8px;
}
.popup_dxgntv .content form .row .value {
  display: flex;
  flex-direction: column;
  gap: 4px;
  width: 100%;
}
.popup_dxgntv .content form .row .value label {
  font-size: 24px;
  text-align: left;
}
.popup_dxgntv .content form .row .value select,
.popup_dxgntv .content form .row .value input {
  height: 38px;
  border-radius: 4px;
  padding-left: 12px;
  background-color: white;
  color: #adbac3;
  border: 1px solid #d0aa65;
  font-size: 18px;
}
.popup_dxgntv .content form .row .value select::placeholder,
.popup_dxgntv .content form .row .value input::placeholder {
  color: #adbac3;
}
.popup_dxgntv .content form .btn {
  margin-top: 15px !important;
}

.popup_getlist .content {
  padding: 24px 44px 50px;
}
.popup_getlist .content .title img {
  height: 46px;
  width: auto;
}
.popup_getlist .content .btn-getlis-custom {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 75px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #8f6a4b;
  font-size: 18px;
  text-decoration: none;
  white-space: nowrap;
}
.popup_getlist .content .task-panels {
  width: 100%;
}
.popup_getlist .content .task-panel {
  display: none;
}
.popup_getlist .content .task-panel.active {
  display: block;
}
.popup_getlist .content .task-tabs {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 26px;
  width: 100%;
  margin: 12px 0 14px;
}
.popup_getlist .content .task-tabs .task-tab {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #8f6a4b;
  font-size: 18px;
  text-decoration: none;
  white-space: nowrap;
}
.popup_getlist .content .task-tabs .task-tab.active {
  background-image: url(assets/libraryMainsite-t-popup/images/sprite.png);
  background-position: 0px -183px;
  width: 151px;
  height: 37px;
  color: #fff7d3;
}
.popup_getlist .content .task-reset {
  width: 100%;
  text-align: left;
  margin-bottom: 12px;
  box-sizing: border-box;
  padding: 0 24px;
}
.popup_getlist .content .task-reset__time {
  font-size: 20px;
  font-weight: bold;
  color: #5a3210;
}
.popup_getlist .content .task-reset__desc {
  margin: 0;
  font-size: 16px;
  line-height: 20px;
  color: #8f6a4b;
}
.popup_getlist .content .task-list {
  width: 100%;
  height: 355px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 18px;
  padding: 16px 20px 0;
  box-sizing: border-box;
}
.popup_getlist .content .task-list::-webkit-scrollbar {
  width: 6px;
}
.popup_getlist .content .task-list::-webkit-scrollbar-thumb {
  background: #d0a878;
  border-radius: 3px;
}
.popup_getlist .content .task-card {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 20px 16px 16px;
  border: 1px solid #e3cfa6;
  border-radius: 10px;
  background: #fffdf7;
}
.popup_getlist .content .task-card__badge {
  position: absolute;
  top: -12px;
  left: 14px;
  padding: 3px 14px;
  font-size: 13px;
  color: #7a5a36;
  background: #f2e3c4;
  border: 1px solid #e3cfa6;
  border-radius: 999px;
}
.popup_getlist .content .task-card__info {
  flex: 1;
  text-align: left;
}
.popup_getlist .content .task-card__name {
  margin: 0;
  font-size: 20px;
  font-weight: bold;
  color: #5a3210;
}
.popup_getlist .content .task-card__note {
  font-size: 16px;
  color: #a98a66;
}
.popup_getlist .content .task-card__btn {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff7e6;
  font-size: 16px;
  font-weight: bold;
  text-decoration: none;
}
.popup_getlist .content .task-card__btn.off, .popup_getlist .content .task-card__btn.received {
  filter: grayscale(1);
  pointer-events: none;
}

.popup_condition .content #pm__quiz-form .text {
  font-size: 42px;
  margin-bottom: 12px;
}
.popup_condition .content #pm__quiz-form .pm__quiz-name {
  font-size: 35px;
  margin-bottom: 12px;
}
.popup_condition .content #pm__quiz-form .pm__quiz-answer-text {
  color: #6c28d7;
  font-size: 35px;
}
.popup_condition .content #pm__quiz-form .pm__quiz-answer-list {
  display: flex;
  flex-direction: column;
  gap: 34px;
  margin-bottom: 32px;
}
.popup_condition .content #pm__quiz-form .pm__quiz {
  text-align: left;
}
.popup_condition .content #pm__quiz-form .pm__quiz-answer input {
  opacity: 0;
}
.popup_condition .content #pm__quiz-form .pm__quiz-answer .pm__quiz-answer-text:before {
  content: "";
  display: inline-block;
  position: relative;
  top: 5px;
  left: -8px;
}
.popup_condition .content #pm__quiz-form .pm__quiz-answer input:checked + .pm__quiz-answer-text:before {
  content: "";
}
.popup_condition .content #pm__invite-form .text-invite {
  background-color: white;
  width: 88%;
  margin: 16px 0 6px;
  height: 50px;
  padding-left: 18px;
  box-sizing: border-box;
  border-radius: 5px;
  margin-left: 22px;
}
.popup_condition .content #pm__invite-form .btn {
  margin: 0;
}
.popup_condition .content form {
  margin: 0 12px;
}
.popup_condition .content .table {
  width: 93%;
  height: 80%;
  overflow-y: auto;
  overflow-x: hidden;
  margin: 0 auto;
  margin-top: 24px;
}
.popup_condition .content .table .text {
  margin-top: 12px;
  font-weight: bold;
}
.popup_condition .content .table .text span {
  font-weight: inherit;
}
.popup_condition .content .table .btn {
  margin: 18px auto !important;
}
.popup_condition .content .table .btn-submit {
  margin: 12px auto !important;
  color: white;
}
.popup_condition .content .table .text-invite {
  background-color: #f7bf73;
  width: 70%;
  margin: 12px 0 6px;
  height: 40px;
  padding-left: 18px;
  box-sizing: border-box;
  border-radius: 34px;
}
.popup_condition .content .table .row {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  margin: 24px 0;
  position: relative;
}
.popup_condition .content .captcha {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-top: 12px;
}
.popup_condition .content .captcha img {
  background-color: white;
  border: 1px solid;
}
.popup_condition .content .captcha .btn-refresh,
.popup_condition .content .captcha .btn-refresh2 {
  background-image: url(assets/libraryMainsite-t-popup/images/sprite.png);
  background-position: -245px -86px;
  width: 44px;
  height: 44px;
  position: relative;
  top: -3px;
}
.popup_condition .content .captcha input {
  width: auto;
  height: 50px;
  padding: 0 12px;
  box-sizing: border-box;
}
.popup_condition .content .captcha-input input {
  height: 40px;
  width: 50%;
  text-align: center;
  border: 1px solid black;
  margin-top: 8px;
}
.popup_condition .content .template_history .table_history {
  height: auto;
  overflow-y: unset;
}

.popup_history .content {
  padding: 28px 56px 50px;
}
.popup_history .content .history-desc {
  width: 100%;
  margin: 0 0 20px;
  font-size: 18px;
  line-height: 26px;
  color: #8f6a4b;
}
.popup_history .content .history-filter {
  width: 100%;
  margin-bottom: 16px;
}
.popup_history .content .history-filter select {
  width: 100%;
  height: 56px;
  padding: 0 44px 0 18px;
  border: 1px solid #d0aa65;
  border-radius: 10px;
  background-color: #fff;
  color: #5a3210;
  font-size: 18px;
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2716%27 height=%2710%27 viewBox=%270 0 16 10%27%3E%3Cpath d=%27M1 1l7 7 7-7%27 stroke=%27%238f6a4b%27 stroke-width=%272%27 fill=%27none%27 stroke-linecap=%27round%27/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 18px center;
}
.popup_history .content .template_history {
  width: 100%;
  margin-top: 0;
}
.popup_history .content .template_history .table_history {
  max-height: 430px;
  overflow-y: auto;
}
.popup_history .content .template_history .table_history .history-empty {
  padding: 60px 0;
  text-align: center;
  font-size: 18px;
  color: #8f6a4b;
}

.popup_rule .content .iframe {
  width: 95%;
  height: 81%;
  margin-top: 10px;
}
.popup_rule .content div.iframe {
  overflow-x: hidden;
  overflow-y: auto;
}

.popup_inform .content p {
  height: 65%;
  line-height: 28px;
  align-content: center;
  font-size: 25px;
}

.popup_reward .content .item img {
  position: absolute;
  right: 62px;
  top: 810px;
}
.popup_reward .content .reward-name {
  width: 100%;
  padding: 22px 0;
  margin-bottom: 22px;
  min-height: 76px;
  text-align: center;
  font-size: 72px;
  line-height: 1.05;
  text-transform: uppercase;
  background: linear-gradient(180deg, #636499 0%, #353c75 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.popup_reward .content .reward-block {
  width: 100%;
  text-align: left;
  margin-bottom: 22px;
}
.popup_reward .content .reward-block:last-child {
  margin-bottom: 0;
}
.popup_reward .content .reward-label {
  display: inline-block;
  margin-bottom: 12px;
  padding: 5px 24px;
  border-radius: 999px;
  background: linear-gradient(180deg, #a9794f 0%, #8a5d36 100%);
  color: #fff3dc;
  font-size: 18px;
  font-weight: bold;
  text-transform: uppercase;
}
.popup_reward .content .reward-text {
  margin: 0;
  font-size: 20px;
  line-height: 30px;
  color: #6a4a2a;
}

.base .box {
  top: 200px;
  transform: translateX(-50%);
  transform-origin: left;
}
.base .box .btn-close {
  background-image: url(assets/libraryMainsite-t-popup/images/sprite.png);
  background-position: 0px 0px;
  width: 321px;
  height: 86px;
  left: 50%;
  transform: translateX(-50%);
  bottom: -20px;
}
.base .box .content {
  padding: 40px 70px 70px 70px;
  display: flex;
  justify-content: flex-start;
  flex-direction: column;
  align-items: center;
  text-align: center;
  color: #00a5ea;
  font-size: 25px;
}
.base .box .content .btn {
  background-image: url(assets/libraryMainsite-t-popup/images/sprite.png);
  background-position: 0px -86px;
  width: 245px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #f0d39a;
  font-size: 25px;
  text-decoration: none;
  margin: 0 auto;
  text-transform: uppercase;
  font-weight: bold;
}
.base .box .content .title {
  font-size: 25px;
  display: flex;
  align-items: center;
  color: #6f401d;
  text-transform: uppercase;
  width: 100%;
  height: 85px;
  box-sizing: border-box;
  justify-content: center;
  font-weight: bold;
  gap: 15px;
}
.base .box .content .title::before, .base .box .content .title::after {
  content: "";
  background-image: url(assets/libraryMainsite-t-popup/images/sprite.png);
  background-position: -289px -86px;
  width: 28px;
  height: 25px;
  display: block;
}
.base .template_history .table_history {
  width: 100%;
  margin: 0 auto;
}
.base .template_history .table_history::-webkit-scrollbar {
  width: 6px;
}
.base .template_history .table_history::-webkit-scrollbar-thumb {
  background: #d0a878;
  border-radius: 3px;
}
.base .template_history .table_history table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}
.base .template_history .table_history table thead th {
  position: sticky;
  top: 0;
  padding: 14px 22px;
  background: linear-gradient(180deg, #ecd9ac 0%, #d4b079 100%);
  color: #6f401d;
  font-size: 17px;
  font-weight: bold;
  text-transform: uppercase;
  white-space: nowrap;
}
.base .template_history .table_history table thead th:first-child {
  text-align: left;
  border-radius: 10px 0 0 10px;
}
.base .template_history .table_history table thead th:last-child {
  text-align: right;
  border-radius: 0 10px 10px 0;
}
.base .template_history .table_history table tbody tr:nth-child(even) {
  background: #f8efda;
}
.base .template_history .table_history table tbody tr td {
  padding: 15px 22px;
  color: #6a4a2a;
  font-size: 16px;
  text-align: left;
}
.base .template_history .table_history table tbody tr td:last-child {
  text-align: right;
  font-weight: bold;
  color: #b3611f;
}

.base.popup_reward .box {
  top: -110px;
}
.base.popup_reward .box .btn-close {
  right: 35px;
  top: 220px;
}
.base.popup_reward .box .content {
  padding: 320px 170px 170px 170px;
}

/*# sourceMappingURL=AI_Agent.css.map*/