.popup .popup-prize {
  max-width: 400px;
  text-align: center;
  overflow: hidden;
  width: 88%;
  border-radius: 8px;
  z-index: 20;
  position: fixed;
  left: 50%;
  top: 53%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%); }
  .popup .popup-prize .prize {
    position: absolute;
    left: 50%;
    top: 22%;
    -webkit-transform: translate(-50%, 0%);
    -ms-transform: translate(-50%, 0%);
    transform: translate(-50%, 0%);
    width: 84%; }
  .popup .popup-prize .popup-button {
    position: absolute;
    left: 50%;
    bottom: 4.6%;
    -webkit-transform: translate(-50%, 0%);
    -ms-transform: translate(-50%, 0%);
    transform: translate(-50%, 0%);
    width: 75%; }
    .popup .popup-prize .popup-button img {
      cursor: pointer; }
      .popup .popup-prize .popup-button img:nth-of-type(1) {
        margin-bottom: 15px; }

.popup .popbg {
  position: fixed;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 10; }
  .popup .popbg img {
    width: 100%;
    position: absolute;
    left: 50%;
    top: 10%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%); }
    @media (min-width: 768px) {
      .popup .popbg img {
        width: 578px; } }
  .popup .popbg img:nth-of-type(2) {
    position: absolute;
    left: 50%;
    top: 76%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%); }

.wheel-area {
  padding: 5% 8% 0px 8%;
  margin-bottom: -22px; }
  .wheel-area .wheel-group {
    position: relative; }
    .wheel-area .wheel-group .start {
      position: absolute;
      z-index: 12;
      cursor: pointer; }
      .wheel-area .wheel-group .start.shake-anime {
        -webkit-animation: shake-anime 0.2s infinite;
        animation: shake-anime 0.2s infinite; }

@-webkit-keyframes shake-anime {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  25% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg); }
  50% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  75% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg); }
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); } }

@keyframes shake-anime {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  25% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg); }
  50% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  75% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg); }
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); } }
    .wheel-area .wheel-group .wheel {
      z-index: 11;
      position: absolute; }
    .wheel-area .wheel-group .wheel-bg {
      z-index: 10;
      position: relative; }
      .wheel-area .wheel-group .wheel-bg img:nth-of-type(2) {
        position: absolute;
        left: 50%;
        top: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%); }
    .wheel-area .wheel-group .stage {
      -webkit-transform: translate(0, -32px);
      -ms-transform: translate(0, -32px);
      transform: translate(0, -32px); }

.info-area {
  padding: 9px 3%;
  margin: 0 15px 0px 15px;
  background-color: rgba(253, 228, 219, 0.95);
  border-radius: 10px;
  text-align: left; }
  .info-area p {
    font-size: 12px; }
  .info-area .info-title {
    margin-bottom: 4px; }
    .info-area .info-title h6 {
      background-color: #e60000;
      display: inline-block;
      color: #fff;
      border-radius: 6px;
      -webkit-box-shadow: 0px 3px 5px 0px rgba(230, 0, 0, 0.3);
      box-shadow: 0px 3px 5px 0px rgba(230, 0, 0, 0.3);
      font-size: 14px;
      padding: 0px 8px;
      letter-spacing: 1px; }
  .info-area .prize-list {
    margin-bottom: 6px; }
  .info-area .event-date {
    margin-bottom: 6px; }
  .info-area .event-date p, .info-area .event-notice p {
    text-indent: -1.1em;
    margin-left: 1em; }

.hide {
  display: none !important; }

.blink {
  -webkit-animation: blink 0.7s linear;
  animation: blink 0.7s linear;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1; }

@-webkit-keyframes blink {
  0% {
    opacity: 0; }
  30% {
    opacity: 1; }
  70% {
    opacity: 1; }
  100% {
    opacity: 0; } }

@keyframes blink {
  0% {
    opacity: 0; }
  30% {
    opacity: 1; }
  70% {
    opacity: 1; }
  100% {
    opacity: 0; } }

.btnGray {
  background-color: #999 !important;
  border: 1px solid #999 !important;
  pointer-events: none !important; }

.d-none {
  display: none; }

.invisible {
  visibility: hidden; }

@-webkit-keyframes bounceInPopup {
  0% {
    opacity: 0;
    -webkit-transform: translate(-50%, -50%) scale(0.3);
    transform: translate(-50%, -50%) scale(0.3); }
  20% {
    -webkit-transform: translate(-50%, -50%) scale(1.1);
    transform: translate(-50%, -50%) scale(1.1); }
  40% {
    -webkit-transform: translate(-50%, -50%) scale(0.9);
    transform: translate(-50%, -50%) scale(0.9); }
  60% {
    opacity: 1;
    -webkit-transform: translate(-50%, -50%) scale(1.03);
    transform: translate(-50%, -50%) scale(1.03); }
  80% {
    -webkit-transform: translate(-50%, -50%) scale(0.97);
    transform: translate(-50%, -50%) scale(0.97); }
  100% {
    -webkit-transform: translate(-50%, -50%) scale(1);
    transform: translate(-50%, -50%) scale(1); } }

@keyframes bounceInPopup {
  0% {
    opacity: 0;
    -webkit-transform: translate(-50%, -50%) scale(0.3);
    transform: translate(-50%, -50%) scale(0.3); }
  20% {
    -webkit-transform: translate(-50%, -50%) scale(1.1);
    transform: translate(-50%, -50%) scale(1.1); }
  40% {
    -webkit-transform: translate(-50%, -50%) scale(0.9);
    transform: translate(-50%, -50%) scale(0.9); }
  60% {
    opacity: 1;
    -webkit-transform: translate(-50%, -50%) scale(1.03);
    transform: translate(-50%, -50%) scale(1.03); }
  80% {
    -webkit-transform: translate(-50%, -50%) scale(0.97);
    transform: translate(-50%, -50%) scale(0.97); }
  100% {
    -webkit-transform: translate(-50%, -50%) scale(1);
    transform: translate(-50%, -50%) scale(1); } }

.bounceInPopup {
  -webkit-animation-duration: 0.75s;
  animation-duration: 0.75s;
  -webkit-animation-name: bounceInPopup;
  animation-name: bounceInPopup; }

/*bounceInDownCong1*/
@-webkit-keyframes bounceInDownCong1 {
  0% {
    opacity: 0;
    -webkit-transform: translate(-50%, -3000px);
    transform: translate(-50%, -3000px); }
  60% {
    opacity: 1;
    -webkit-transform: translate(-50%, 25px);
    transform: translate(-50%, 25px); }
  75% {
    -webkit-transform: translate(-50%, -10px);
    transform: translate(-50%, -10px); }
  90% {
    -webkit-transform: translate(-50%, 5px);
    transform: translate(-50%, 5px); }
  100% {
    -webkit-transform: translate(-50%, 0px);
    transform: translate(-50%, 0px); } }
@keyframes bounceInDownCong1 {
  0% {
    opacity: 0;
    -webkit-transform: translate(-50%, -3000px);
    transform: translate(-50%, -3000px); }
  60% {
    opacity: 1;
    -webkit-transform: translate(-50%, 25px);
    transform: translate(-50%, 25px); }
  75% {
    -webkit-transform: translate(-50%, -10px);
    transform: translate(-50%, -10px); }
  90% {
    -webkit-transform: translate(-50%, 5px);
    transform: translate(-50%, 5px); }
  100% {
    -webkit-transform: translate(-50%, 0px);
    transform: translate(-50%, 0px); } }

.bounceInDownCong1 {
  -webkit-animation-name: bounceInDownCong1;
  animation-name: bounceInDownCong1; }

@-webkit-keyframes bounceInUpCong2 {
  0% {
    opacity: 0;
    -webkit-transform: translate(-50%, 3000px);
    transform: translate(-50%, 3000px); }
  60% {
    opacity: 1;
    -webkit-transform: translate(-50%, -20px);
    transform: translate(-50%, -20px); }
  75% {
    -webkit-transform: translate(-50%, 10px);
    transform: translate(-50%, 10px); }
  90% {
    -webkit-transform: translate(-50%, -5px);
    transform: translate(-50%, -5px); }
  100% {
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0); } }

@keyframes bounceInUpCong2 {
  0% {
    opacity: 0;
    -webkit-transform: translate(-50%, 3000px);
    transform: translate(-50%, 3000px); }
  60% {
    opacity: 1;
    -webkit-transform: translate(-50%, -20px);
    transform: translate(-50%, -20px); }
  75% {
    -webkit-transform: translate(-50%, 10px);
    transform: translate(-50%, 10px); }
  90% {
    -webkit-transform: translate(-50%, -5px);
    transform: translate(-50%, -5px); }
  100% {
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0); } }

.bounceInUpCong2 {
  -webkit-animation-name: bounceInUpCong2;
  animation-name: bounceInUpCong2; }
