@font-face {
  font-family: RobotoCondensed-Regular;
  src: url(../images/lucky-draw-choose-gift/RobotoCondensed-Regular.ttf);
}
#luckydrawchoose_gift {
  font-family: RobotoCondensed-Regular;
}
#luckydrawchoose_gift .section--1 {
  background-image: url(../images/lucky-draw-choose-gift/bg.jpg);
  background-repeat: no-repeat;
  width: 2000px;
  height: 1000px;
  position: relative;
}
@media (max-width: 576px) {
  #luckydrawchoose_gift .section--1 {
    background-image: url(../images/lucky-draw-choose-gift/bg-mb.jpg);
    background-repeat: no-repeat;
    width: 768px;
    height: 1300px;
  }
}
#luckydrawchoose_gift .section--1 .content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
#luckydrawchoose_gift .section--1 .content .info {
  position: absolute;
  left: 710px;
  top: 166px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  width: 720px;
  height: 54px;
  font-size: 24px;
  gap: 12px;
}
@media (max-width: 576px) {
  #luckydrawchoose_gift .section--1 .content .info {
    left: 0;
    width: 100%;
    top: 158px;
  }
}
#luckydrawchoose_gift .section--1 .content .list-item {
  position: absolute;
  left: 54%;
  transform: translateX(-50%);
  top: 32%;
  display: flex;
  flex-direction: column;
  gap: 22px;
}
@media (max-width: 576px) {
  #luckydrawchoose_gift .section--1 .content .list-item {
    flex-direction: row;
    width: 464px;
    height: 694px;
    left: 42px;
    top: 416px;
    transform: unset;
    gap: 0;
  }
}
#luckydrawchoose_gift .section--1 .content .list-item .row {
  display: flex;
  gap: 12px;
  justify-content: center;
  width: 740px;
  height: 110px;
  align-items: center;
}
@media (max-width: 576px) {
  #luckydrawchoose_gift .section--1 .content .list-item .row {
    flex-direction: column;
    justify-content: flex-start;
  }
}
#luckydrawchoose_gift .section--1 .content .list-item .row .item img.normal {
  display: none;
}
#luckydrawchoose_gift .section--1 .content .list-item .row .item img.grayscale {
  display: block;
}
#luckydrawchoose_gift .section--1 .content .list-item .row .item.active img.normal {
  display: block;
}
#luckydrawchoose_gift .section--1 .content .list-item .row .item.active img.grayscale {
  display: none;
}
#luckydrawchoose_gift .section--1 .content .list-btn1 {
  display: flex;
  position: absolute;
  left: 54%;
  transform: translateX(-50%);
  top: 230px;
  gap: 22px;
}
@media (max-width: 576px) {
  #luckydrawchoose_gift .section--1 .content .list-btn1 {
    flex-direction: column;
    transform: translateX(-50%) scale(0.75);
    left: 81.5%;
    top: 51%;
    gap: 34px;
  }
}
#luckydrawchoose_gift .section--1 .content .list-btn1 .btn-nhiemvunhanluot {
  background-image: url(../images/lucky-draw-choose-gift/btn-nhiemvunhanluot.png);
  background-repeat: no-repeat;
  width: 282px;
  height: 56px;
}
#luckydrawchoose_gift .section--1 .content .list-btn1 .btn-doiqua {
  background-image: url(../images/lucky-draw-choose-gift/btn-doiqua.png);
  background-repeat: no-repeat;
  width: 282px;
  height: 56px;
}
#luckydrawchoose_gift .section--1 .content .point {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  font-size: 20px;
  text-transform: uppercase;
  color: #fff0c5;
  position: absolute;
  left: 515px;
  top: 225px;
  background-image: url(../images/lucky-draw-choose-gift/bg-info.png);
  background-repeat: no-repeat;
  width: 179px;
  height: 52px;
}
@media (max-width: 576px) {
  #luckydrawchoose_gift .section--1 .content .point {
    left: 50%;
    transform: translateX(-50%);
    top: 222px;
  }
}
#luckydrawchoose_gift .section--1 .content .list-btn2 {
  display: flex;
  position: absolute;
  left: 54%;
  transform: translateX(-50%);
  top: 72%;
  gap: 34px;
}
@media (max-width: 576px) {
  #luckydrawchoose_gift .section--1 .content .list-btn2 {
    flex-direction: column;
    gap: 24px;
    left: 81.5%;
    top: 35%;
    transform: translateX(-50%) scale(0.8);
  }
}
#luckydrawchoose_gift .section--1 .content .list-btn2 .rut-1 {
  background-image: url(../images/lucky-draw-choose-gift/rut-1.png);
  background-repeat: no-repeat;
  width: 222px;
  height: 89px;
}
#luckydrawchoose_gift .section--1 .content .list-btn2 .rut-10 {
  background-image: url(../images/lucky-draw-choose-gift/rut-10.png);
  background-repeat: no-repeat;
  width: 222px;
  height: 89px;
}
#luckydrawchoose_gift .section--1 .content .list-btn3 {
  display: flex;
  gap: 12px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 84.5%;
}
@media (max-width: 576px) {
  #luckydrawchoose_gift .section--1 .content .list-btn3 {
    flex-direction: column;
    gap: 34px;
    left: 81.5%;
    top: 60.5%;
    transform: translateX(-50%) scale(0.75);
  }
}
#luckydrawchoose_gift .section--1 .content .list-btn3 .btn-thelechuongtrinh {
  background-image: url(../images/lucky-draw-choose-gift/btn-thelechuongtrinh.png);
  background-repeat: no-repeat;
  width: 282px;
  height: 56px;
}
#luckydrawchoose_gift .section--1 .content .list-btn3 .btn-lichsurutthuong {
  background-image: url(../images/lucky-draw-choose-gift/btn-lichsurutthuong.png);
  background-repeat: no-repeat;
  width: 282px;
  height: 56px;
}
#luckydrawchoose_gift .section--1 .content .list-btn3 .btn-lichsudoiqua {
  background-image: url(../images/lucky-draw-choose-gift/btn-lichsudoiqua.png);
  background-repeat: no-repeat;
  width: 282px;
  height: 56px;
}

.popup_changegifts-custom .info {
  background-image: url(../images/lucky-draw-choose-gift/popup-bg-info.png);
  background-repeat: no-repeat;
  width: 1028px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  font-size: 23px;
  margin-top: 34px;
}
@media (max-width: 576px) {
  .popup_changegifts-custom .info {
    background-image: url(../images/lucky-draw-choose-gift/popup-bg-info-mb.png);
    background-repeat: no-repeat;
    width: 637px;
    height: 121px;
    margin-top: 0px;
  }
}
.popup_changegifts-custom .info .list {
  display: flex;
  gap: 54px;
}
@media (max-width: 576px) {
  .popup_changegifts-custom .info .list {
    flex-direction: column;
    gap: 11px;
  }
}
.popup_changegifts-custom .info .list span {
  color: var(--text-gray);
}
.popup_changegifts-custom .list-items {
  position: absolute;
  top: 230px;
  left: 50%;
  transform: translateX(-50%);
  width: 82%;
  display: flex;
  flex-wrap: wrap;
  column-gap: 24px;
  row-gap: 10px;
  max-height: 58%;
  height: auto;
  overflow-y: auto;
}
.popup_changegifts-custom .list-items::-webkit-scrollbar {
  width: 6px;
}
.popup_changegifts-custom .list-items::-webkit-scrollbar-thumb {
  background: #AAA;
  border-radius: 10px;
}
.popup_changegifts-custom .list-items::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px #CCC;
  border-radius: 10px;
}
@media (max-width: 576px) {
  .popup_changegifts-custom .list-items {
    width: 92%;
    top: 260px;
    height: 57%;
  }
}
.popup_changegifts-custom .list-items .item {
  position: relative;
  width: 140px;
  height: 110px;
  cursor: pointer;
}
.popup_changegifts-custom .list-items .item.off, .popup_changegifts-custom .list-items .item.received {
  pointer-events: none;
}
.popup_changegifts-custom .list-items .item.off .normal, .popup_changegifts-custom .list-items .item.received .normal {
  display: none;
}
.popup_changegifts-custom .list-items .item.off .grayscale, .popup_changegifts-custom .list-items .item.received .grayscale {
  display: block;
}
.popup_changegifts-custom .list-items .item.active .normal {
  display: block;
}
.popup_changegifts-custom .list-items .item.active .grayscale {
  display: none;
}
.popup_changegifts-custom .list-items .item .pick {
  background-image: url(../images/lucky-draw-choose-gift/popup-unpick.png);
  background-repeat: no-repeat;
  width: 23px;
  height: 23px;
  display: block;
  position: absolute;
  top: 10px;
  left: 10px;
}
.popup_changegifts-custom .list-items .item.pick .pick {
  background-image: url(../images/lucky-draw-choose-gift/popup-pick.png);
  background-repeat: no-repeat;
  width: 23px;
  height: 23px;
}
.popup_changegifts-custom .btn-xacnhan {
  background-image: url(../images/lucky-draw-choose-gift/popup-btn-xacnhan.png);
  background-repeat: no-repeat;
  width: 232px;
  height: 60px;
  display: block;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 60px;
}
@media (max-width: 576px) {
  .popup_changegifts-custom .btn-xacnhan {
    bottom: 32px;
  }
}