@import url(//fonts.googleapis.com/earlyaccess/notosanskr.css);
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 100;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff2) format('woff2'),
    url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff) format('woff'),
    url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.otf) format('opentype');
}

@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 300;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) format('woff2'),
    url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) format('woff'),
    url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format('opentype');
}

@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 400;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) format('woff2'),
    url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) format('woff'),
    url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format('opentype');
}

@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 500;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format('woff2'),
    url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format('woff'),
    url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format('opentype');
}

@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 700;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) format('woff2'),
    url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) format('woff'),
    url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format('opentype');
}

@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 900;
  src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff2) format('woff2'),
    url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff) format('woff'),
    url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.otf) format('opentype');
}

@font-face {
  font-family: 'Ownglyph MinhyeChae';
  font-style: normal;
  src: url('https://cdn.banggooso.com/assets/fonts/Ownglyph MinhyeChae.ttf') format('truetype');
}

@font-face {
  font-family: 'esamanru';
  src: url('https://cdn.banggooso.com/assets/fonts/esamanru-Bold.woff2') format('woff2'),
    url('https://cdn.banggooso.com/assets/fonts/esamanru-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: 'Recipekorea';
  font-style: normal;
  src: url('https://cdn.banggooso.com/assets/fonts/Recipekorea.ttf') format('truetype');
}

@font-face {
  font-family: 'Nanum YeorIrCe';
  font-style: normal;
  src: url('https://cdn.banggooso.com/assets/fonts/Nanum YeorIrCe.ttf') format('truetype');
}

/* 
reset.css 
TODO: 히스토리 파악 후 공통으로 뺄 것 
*/
html,
body {
  font-size: 16px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  overscroll-behavior: none;
  font-family: 'Pretendard';
  text-align: center;
}
input:focus {
  outline: none;
}
button {
  cursor: pointer;
}
button:not(:disabled):hover {
  scale: 1.01;
}
button:not(:disabled):active {
  filter: brightness(0.9);
}
button:disabled {
  background: #d4d4d4 !important;
  cursor: default;
}
input,
textarea {
  border-radius: 0.1px;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input[type='number'] {
  -moz-appearance: textfield;
}
textarea {
  resize: none;
}

@media (max-width: 500px) {
  html,
  body {
    font-size: 3.2vw;
  }
}

/* 이미지 wrap */
.image-wrap > img {
  object-fit: contain;
  width: 100%;
}

.loading-spinner {
  width: 2rem;
  height: 2rem;
  border: 0.2rem solid rgba(25, 64, 68, 0.25);
  border-top: 0.2rem solid #fff;
  border-radius: 50%;
  animation: spin 1s linear infinite;
  margin-top: 0.5rem;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

/* 전체 배경 영역 */
.game-wrapper {
  background-image: url(https://cdn.banggooso.com/assets/images/game250/common/background.jpeg);
  background-size: calc(100% + 1px);
  background-repeat: repeat;
  letter-spacing: -0.02125rem;
}

/* 헤더 */
.game-wrapper .app-header {
  height: 4.0625rem;
  background: transparent;
  background-blend-mode: multiply;
  border: none;
  position: absolute;
  width: 100%;
  backdrop-filter: blur(1rem);
  -webkit-backdrop-filter: blur(1rem);
  z-index: 1;
}

.game-wrapper .app-header.ext.intro:not(.question) a.back {
  display: none;
}

/* 헤더 로고 */
.game-wrapper .app-header .app-logo {
  background-image: url(https://cdn.banggooso.com/assets/images/common/logo_2024.png);
  background-position: center;
  background-size: contain;
  width: 9.3025rem;
  background-position-y: 1.06rem;
  transform: none;
  margin: 0 auto;
}
.game-wrapper .app-header.ext .app-logo {
  background-image: url(https://cdn.banggooso.com/assets/images/game250/icons/logo.png);
  width: 15.75rem;
}

main.app-main {
  padding-top: 3.75rem;
}

.text-border {
  padding: 2.5rem 0 1.375rem;
  width: 100%;
}
.text-border::before {
  content: '';
  width: 100%;
  max-width: 25.5625rem;
  height: 1.875rem;
  position: absolute;
  left: 1.0625rem;
  top: 0.875rem;
  background-image: url(https://cdn.banggooso.com/assets/images/game250/common/text-border.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.text-border::after {
  content: '';
  width: 100%;
  max-width: 25.5625rem;
  height: 1.875rem;
  position: absolute;
  left: 1.0625rem;
  bottom: -0.4375rem;
  background-image: url(https://cdn.banggooso.com/assets/images/game250/common/text-border.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.game-button-wrap {
  width: 100%;
}

.game-button-tooltip-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: absolute;
  left: 4.71875rem;
  top: -2.375rem;
}

.game-button-tooltip {
  display: flex;
  padding: 0.625rem 1rem 0.75rem 1rem;
  justify-content: center;
  align-items: center;
  gap: 0.625rem;
  align-self: stretch;
  background: #222222;
  color: #fff;
  font-family: Pretendard;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  width: max-content;
}

.game-button-tooltip-wrap::after {
  content: '';
  background-image: url('https://cdn.banggooso.com/assets/images/game250/common/tooltip-tail.png');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: top;
  width: 1rem;
  height: 0.5rem;
  fill: #222222;
}

.game-button {
  display: flex;
  width: 100%;
  padding: 1.375rem 1.875rem 1.875rem 1.875rem;
  justify-content: center;
  align-items: center;
  gap: 0.25rem;
  background: #0090ff;
  box-shadow: 0.125rem 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.15);
  color: #fff;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.625rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  cursor: pointer;
}

/* 인트로 페이지 */
.game-intro {
  display: flex;
  padding: 0.62rem 0 0;
  flex-direction: column;
  align-items: center;
  gap: 2.5rem;
}
.game-wrapper .game-intro {
  padding-bottom: 0;
}

.game-intro > * {
  padding-left: 1.75rem;
  padding-right: 1.75rem;
}

.game-intro .intro-title {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2.125rem;
  align-self: stretch;
}

.game-intro .intro-title .intro-title-header {
  display: flex;
  padding: 1rem 0rem;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
  border-bottom: 0.094rem solid #222;
}

.game-intro .intro-title .intro-title-header p {
  color: #222;
  text-align: right;
  font-family: 'Noto Sans KR';
  font-size: 1.1875rem;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}

.game-intro .intro-title .intro-title-header-period {
  display: flex;
  padding: 0.25rem 1rem 0.4375rem 1rem;
  justify-content: center;
  align-items: center;
  border-radius: 6.25rem;
  border: 0.094rem solid #222;
  mix-blend-mode: multiply;
  color: #222;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.0625rem;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.game-intro .intro-title .intro-title-information {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  align-self: stretch;
  border-top: 0.094rem solid #222;
  border-bottom: 0.094rem solid #222;
}

.game-intro .intro-title .intro-title-information .intro-product-image {
  width: 10rem;
  height: 10rem;
  overflow: hidden;
}

.game-intro .intro-title .intro-title-information .intro-product-image .image-wrap {
  width: 10rem;
  height: 10rem;
  padding: 1.46875rem 0.81563rem 1.46875rem 0.81556rem;
  flex-shrink: 0;
}

.game-intro .intro-title .intro-title-image {
  width: 28.45188rem;
  height: 18.07325rem;
  overflow: hidden;
}

.game-intro .intro-title .intro-title-image .image-wrap {
  width: 28.45188rem;
  height: 18.07325rem;
  flex-shrink: 0;
}

.slide-images-3 {
  animation: slideThreeImages 3s steps(3) infinite;
  display: flex;
  justify-content: start;
  align-items: center;
}

/* 슬라이드 이미지 애니메이션 */
@keyframes slideThreeImages {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-300%);
  }
}

.slide-images-2 {
  animation: slideImages 2s steps(2) infinite;
  display: flex;
  justify-content: start;
  align-items: center;
}

/* 슬라이드 이미지 애니메이션 */
@keyframes slideImages {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-200%);
  }
}

.game-intro .intro-title .intro-title-information-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  flex: 1 0 0;
  align-self: stretch;
}

.game-intro .intro-title .intro-title-information-content-row {
  display: flex;
  align-items: center;
  flex: 1 0 0;
  align-self: stretch;
  border-left: 0.094rem solid #222;
}

.game-intro .intro-title .intro-title-information-content-row:not(:last-child) {
  border-bottom: 0.094rem solid #222;
}

.game-intro .intro-title .intro-title-information-content-header {
  display: flex;
  width: 6.625rem;
  padding: 0.75rem 0.625rem 0.9375rem 0.625rem;
  justify-content: center;
  align-items: center;
  align-self: stretch;
  border-right: 0.094rem solid #222;
  color: #222;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.game-intro .intro-title .intro-title-information-content-body {
  display: flex;
  padding: 0.75rem 0.625rem 0.9375rem 0.625rem;
  justify-content: center;
  align-items: center;
  flex: 1 0 0;
  align-self: stretch;
  color: #222;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.game-intro .intro-title .intro-title-information-content-body.name-preview {
  color: #222;
  text-align: center;
  -webkit-text-stroke-width: 0.019rem;
  -webkit-text-stroke-color: #222;
  font-family: 'Ownglyph MinhyeChae';
  font-size: 1.6875rem;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

/* 인트로 게임시작 영역 */
.game-intro .start-btn-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.5rem;
  align-self: stretch;
}

/* 인트로 유저이름 인풋 */
.game-intro .nickname {
  display: flex;
  padding: 2.25rem 1.125rem 2.375rem 1.125rem;
  justify-content: center;
  align-items: center;
  align-self: stretch;
  background: #fff;
  box-shadow: 0.125rem 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.15);
  color: #222;
  text-align: center;
  -webkit-text-stroke-width: 0.019rem;
  -webkit-text-stroke-color: #222;
  font-family: 'Ownglyph MinhyeChae';
  font-size: 2.375rem;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}
.game-intro .nickname::placeholder {
  color: rgba(81, 81, 81, 0.5);
  -webkit-text-stroke-width: 0.019rem;
  -webkit-text-stroke-color: rgba(81, 81, 81, 0.5);
}

/* 인트로 시작 버튼 */
.game-intro .start-btn {
  display: flex;
  padding: 1.375rem 1.875rem 1.875rem 1.875rem;
  justify-content: center;
  align-items: center;
  align-self: stretch;
  box-shadow: 0.125rem 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.15);
  color: #fff;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.75rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  background-color: #0090ff;
}

.game-intro .start-btn-tooltip-wrap {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 13.31rem;
}

.game-intro .start-btn-tooltip {
  display: flex;
  padding: 0.625rem 1rem 0.75rem 1rem;
  justify-content: center;
  align-items: center;
  gap: 0.25rem;
  align-self: stretch;
  background: #222222;
  color: #fff;
  text-align: center;
  font-family: Pretendard;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}
.game-intro .start-btn-tooltip::before {
  content: '';
  display: block;
  position: absolute;
  width: 7.25rem;
  height: 2.06338rem;
  right: 6.85rem;
  bottom: 0.37413rem;
  background: url(https://cdn.banggooso.com/assets/images/game250/intro/red-underline.png) no-repeat center center /
    contain;
}

.game-intro .start-btn-tooltip-tail {
  width: 1rem;
  height: 0.5rem;
  position: relative;
  top: 1px;
}

.game-intro .share-btn-wrap {
  display: flex;
  padding: 3.75rem 0rem 2rem 0rem;
  flex-direction: column;
  align-items: flex-start;
}

.game-intro .share-btn {
  display: flex;
  padding: 1.125rem 1.875rem 1.625rem 1.875rem;
  justify-content: center;
  align-items: center;
  gap: 0.375rem;
  align-self: stretch;
  background: #0090ff;
  box-shadow: 0.125rem 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.15);
  color: #fff;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.625rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.game-intro .share-btn .share-icon {
  width: 1.875rem;
  height: 1.875rem;
}

.game-intro .cheat-sheet {
  display: flex;
  justify-content: center;
}
.cheat-sheet-title {
  display: flex;
  width: 18.125rem;
  height: 8.625rem;
  padding: 1.17119rem 0.88644rem 1.17113rem 0.88631rem;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  position: absolute;
  top: 0;
  color: #ff4c1c;
  text-align: center;
  -webkit-text-stroke-width: 0.038rem;
  -webkit-text-stroke-color: #ff4c1c;
  font-family: 'Ownglyph MinhyeChae';
  font-size: 2.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: 3rem; /* 104.348% */
}

.twist {
  animation: twist 2s steps(1) infinite;
}

@keyframes twist {
  0% {
    transform: rotate(-1deg);
  }
  50% {
    transform: rotate(1deg);
  }
  100% {
    transform: rotate(-1deg);
  }
}

.giveaway .giveaway-top {
  display: flex;
  padding-top: 3.25rem;
  align-items: flex-start;
  align-self: stretch;
  flex-direction: row;
}

.giveaway .giveaway-top-item {
  display: flex;
  padding: 1.25rem 0rem 1.5rem 0rem;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  flex: 1 0 0;
}

.giveaway .giveaway-top-item .white-bubble {
  position: absolute;
  right: 1.25rem;
  top: -2.125rem;
}

.giveaway .giveaway-top-item:nth-child(2) .white-bubble {
  position: absolute;
  right: 3.3125rem;
  top: -2.125rem;
}

.giveaway .giveaway-image-coupon {
  display: flex;
  width: 9.67244rem;
  height: 6.875rem;
  padding: 0rem 0.00975rem;
  justify-content: center;
  align-items: center;
}
.giveaway .giveaway-image-coupon:not(.sold-out) > p {
  display: none;
}
.giveaway .giveaway-image-coupon.sold-out > img {
  filter: brightness(0.6);
}
.giveaway .giveaway-image-coupon.sold-out > p {
  display: flex;
  transform: rotate(-3deg) translateX(-50%);
  padding: 0.375rem 1.125rem;
  justify-content: center;
  align-items: center;
  position: absolute;
  background: #f27321;
  color: #fff;
  text-align: center;
  -webkit-text-stroke-width: 0.4000000059604645;
  -webkit-text-stroke-color: #fff;
  font-family: 'Ownglyph MinhyeChae';
  font-size: 2rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.6875rem; /* 84.375% */
  width: 13.0625rem;
  top: 2.8rem;
  left: 50%;
}

.giveaway .giveaway-image-box {
  display: flex;
  padding: 0.5rem 0rem 0rem 0.22413rem;
  justify-content: flex-end;
  align-items: center;
  width: 8.55639rem;
  height: 6.875rem;
}

.giveaway .giveaway-top-name-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.25rem;
}

.giveaway .giveaway-top-condition {
  color: #0090ff;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.375rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.giveaway .giveaway-top-name {
  color: #222;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 2.5rem;
  font-style: normal;
  font-weight: 700;
  line-height: 3.375rem; /* 135% */
  word-break: keep-all;
}

.giveaway .giveaway-top-period {
  color: #194044;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.0625rem;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.02125rem;
  opacity: 0.7;
  mix-blend-mode: multiply;
}

.giveaway .giveaway-bottom {
  display: flex;
  padding: 0.25rem 0rem 2.25rem 0rem;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  align-self: stretch;
}

.giveaway .giveaway-bottom-condition {
  color: #0090ff;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.375rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.giveaway .giveaway-bottom-item {
  display: flex;
  padding: 0.25rem 0rem 0.375rem 0rem;
  justify-content: center;
  align-items: center;
  gap: 0.75rem;
  align-self: stretch;
}

.giveaway .giveaway-image-package {
  width: 12rem;
  height: 14.6875rem;
}

.giveaway .giveaway-image-package.fcfs-event:not(.sold-out) p {
  display: none;
}

.giveaway .giveaway-image-package.fcfs-event.sold-out > img {
  filter: brightness(0.6);
}
.giveaway .giveaway-image-package.fcfs-event.sold-out > p {
  display: flex;
  width: 9.7075rem;
  transform: rotate(3.832deg) translateX(-50%);
  padding: 0.375rem 1.125rem;
  justify-content: center;
  align-items: center;
  background: #f27321;
  color: #fff;
  text-align: center;
  -webkit-text-stroke-width: 0.4000000059604645;
  -webkit-text-stroke-color: #fff;
  font-family: 'Ownglyph MinhyeChae';
  font-size: 2rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.5625rem; /* 78.125% */
  position: absolute;
  bottom: 4rem;
  left: 50%;
}

.giveaway .giveaway-bottom-name-wrap {
  display: flex;
  width: 13.125rem;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.25rem;
  text-align: left;
}

.giveaway .giveaway-bottom-name {
  color: #222;
  font-family: 'Noto Sans KR';
  font-size: 2.5rem;
  font-style: normal;
  font-weight: 700;
  line-height: 3.375rem; /* 135% */
}

.giveaway .giveaway-bottom-caption {
  color: #222;
  font-family: 'Noto Sans KR';
  font-size: 1.0625rem;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.02125rem;
  opacity: 0.7;
  mix-blend-mode: multiply;
}
.giveaway .giveaway-bottom-item:last-child .giveaway-bottom-caption {
  padding-top: 0.56rem;
}

.giveaway .add-image.star {
  width: 4.8125rem;
  height: 4.8125rem;
  transform: rotate(10deg);
  position: absolute;
  right: 1.19813rem;
  bottom: 3.73744rem;
}

.giveaway .add-image.underline {
  width: 13.5625rem;
  height: 1.75rem;
  position: absolute;
  right: 1.125rem;
  bottom: 2.3125rem;
}

.white-bubble {
  display: flex;
  padding: 0.625rem 1rem 0.75rem 1rem;
  justify-content: center;
  align-items: center;
  gap: 0.625rem;
  background: #fff;
  color: #f27321;
  font-family: Pretendard;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  box-shadow: 2px 2px 6px 0px rgba(0, 0, 0, 0.15);
  margin-bottom: 0.5rem;
}

.white-bubble::after {
  content: '';
  width: 1rem;
  height: 0.5rem;
  background: url(https://cdn.banggooso.com/assets/images/game250/common/white-bubble-tail.png) no-repeat center center /
    contain;
  position: absolute;
  bottom: calc(1px - 0.5rem);
}
.fade-slide-up {
  opacity: 0;
  transform: translateY(1rem);
  transition: opacity 0.5s ease-out, transform 0.5s ease-out;
  will-change: opacity transform;
}

.fade-slide-up.visible {
  opacity: 1;
  transform: translateY(0); /* 원래 위치로 */
}

.game-intro .terms-and-conditions-wrap {
  display: flex;
  width: 31.25rem;
  padding: 2.75rem 2.25rem 10rem 2.25rem;
  flex-direction: column;
  align-items: flex-start;
  gap: 2.75rem;
  background: #eae6db;
}

.game-intro .terms-and-conditions {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5rem;
  align-self: stretch;
  text-align: left;
}

.game-intro .terms-and-conditions-title {
  color: #646464;
  font-family: 'Noto Sans KR';
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.game-intro .terms-and-conditions-body {
  color: #646464;
  font-family: 'Noto Sans KR';
  font-size: 1rem;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  word-break: keep-all;
}
.game-intro .terms-and-conditions-body > li {
  margin-inline-start: 1.2rem;
}
.game-intro .terms-and-conditions-body > li::before {
  content: '●';
  display: inline-block;
  width: 1.2rem;
  margin-left: -1.2rem;
}
.game-intro .terms-and-conditions-body > li > ul {
  margin-inline-start: -0.2rem;
}
.game-intro .terms-and-conditions-body > li > ul > li {
  margin-inline-start: 0.6rem;
}
.game-intro .terms-and-conditions-body > li > ul > li::before {
  content: '-';
  display: inline-block;
  width: 0.6rem;
  margin-left: -0.6rem;
}
.game-intro .terms-and-conditions-body li strong {
  margin-left: -0.23rem;
  font-weight: 600;
}

.game-intro .intro-fade-in {
  opacity: 0;
  transition: opacity 1s ease-in-out;
  will-change: opacity;
}

.game-intro .intro-fade-in.visible {
  opacity: 1;
}

#intro-modal {
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
}
#intro-modal:not(.show) {
  display: none;
}

#intro-modal .modal-content {
  display: flex;
  width: 27.5rem;
  padding: 2rem 1.875rem;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  background: #fff;
}

#intro-modal .modal-image {
  width: 6.625rem;
  height: 6.25rem;
}

#intro-modal .modal-title {
  color: #222;
  text-align: center;
  font-family: Pretendard;
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.875rem; /* 125% */
}

#intro-modal .modal-desc {
  color: #222;
  text-align: center;
  font-family: Pretendard;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.75rem; /* 140% */
}

#intro-modal .modal-btn-wrap {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  align-self: stretch;
}

#intro-modal .modal-button {
  display: flex;
  padding: 1.25rem 0 1.375rem;
  justify-content: center;
  align-items: center;
  flex: 1 0 0;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.375rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

#intro-modal .modal-button.modal-button-primary {
  background: #0090ff;
  color: #fff;
}

#intro-modal .modal-button.modal-button-secondary {
  background: #fff;
  border: 1.5px solid #0090ff;
  color: #0090ff;
  font-weight: 600;
}

/** 실시간 랭킹 */
.leaderboard {
  display: flex;
  padding-bottom: 1.5rem;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  align-self: stretch;
}

.leaderboard .leaderboard-perfect-box-wrap {
  height: 10.625rem;
}
.leaderboard .leaderboard-perfect-box {
  width: 27.75rem;
  height: 8.5rem;
  background: #fff;
  box-shadow: 0.125rem 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.15);
  margin-top: 2.13rem;
}
.leaderboard .leaderboard-perfect-box::before {
  content: '';
  width: 5.473rem;
  height: 2.8125rem;
  flex-shrink: 0;
  background: url(https://cdn.banggooso.com/assets/images/game250/intro/perfect-a-rank.png) no-repeat center center /
    contain;
  position: absolute;
  top: 0.81rem;
  left: 9.38rem;
}
.leaderboard .leaderboard-perfect-name-award {
  color: #646464;
  font-family: 'Noto Sans KR';
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  position: absolute;
  top: 1.06rem;
  left: 2.31rem;
}
.leaderboard .leaderboard-perfect-name-user-wrap {
  display: flex;
  gap: 1.75rem;
  position: absolute;
  top: 2.62rem;
  left: 2.38rem;
  align-items: end;
}
.leaderboard .leaderboard-perfect-name-user {
  color: #222;
  -webkit-text-stroke-width: 0.063rem;
  -webkit-text-stroke-color: #222;
  font-family: 'Ownglyph MinhyeChae';
  font-size: 4.375rem;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  width: 7.1875rem;
}
.leaderboard .leaderboard-perfect-name-user.name-2 {
  width: max-content;
}
.leaderboard .leaderboard-perfect-name-user::before {
  content: '';
  width: 9.4375rem;
  height: 1.875rem;
  background: url(https://cdn.banggooso.com/assets/images/game250/common/highlight-3.png) no-repeat center center /
    contain;
  position: absolute;
  left: -1rem;
  bottom: 0.12rem;
  z-index: -1;
}
.leaderboard .leaderboard-perfect-name-user.name-2::before {
  background: url(https://cdn.banggooso.com/assets/images/game250/common/highlight-2.png) no-repeat center center /
    contain;
  width: 6.9375rem;
}
.leaderboard .leaderboard-perfect-name-date {
  color: rgba(0, 0, 0, 0.3);
  font-family: 'Noto Sans KR';
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.125rem; /* 128.571% */
  width: 4.6875rem;
  text-align: left;
}
.leaderboard .leaderboard-perfect-box-character-wrap {
  width: 10.58625rem;
  height: 10.625rem;
  flex-shrink: 0;
  position: absolute;
  bottom: 0;
  right: 0.48rem;
}
.leaderboard .leaderboard-perfect-box-character-wrap > img {
  position: absolute;
  top: 0;
}
.leaderboard .leaderboard-perfect-box-character {
  width: 7.9375rem;
  height: 10.625rem;
  flex-shrink: 0;
  left: 1.74rem;
}
.leaderboard .result-content-caption {
  color: #194044;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.0625rem;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.02125rem;
}
@keyframes moveUpDown {
  0% {
    width: transformY(0);
  }
  50% {
    transform: translateY(0.42rem);
  }
  100% {
    width: transformY(0);
  }
}
.move-up-down {
  animation: moveUpDown 2s ease-in-out infinite; /* 애니메이션을 적용 */
}

.leaderboard .leaderboard-perfect-box-confeti {
  left: 0;
}
.leaderboard .leaderboard-list-wrap {
  width: 100%;
}
.leaderboard .leaderboard-list {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  align-self: stretch;
}
.leaderboard .leaderboard-list-body {
  display: flex;
  padding: 1rem 1.5rem 1.125rem 1.5rem;
  align-items: center;
  gap: 1.5625rem;
  align-self: stretch;
  background: #fff;
  box-shadow: 0.125rem 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.15);
}
.leaderboard .leaderboard-list-body::before {
  content: '';
  width: 3.75rem;
  height: 3.75rem;
}
.leaderboard .leaderboard-list-body:nth-child(1)::before {
  background: url('https://cdn.banggooso.com/assets/images/game250/common/medal-1.png') no-repeat center center /
    contain;
}
.leaderboard .leaderboard-list-body:nth-child(2)::before {
  background: url('https://cdn.banggooso.com/assets/images/game250/common/medal-2.png') no-repeat center center /
    contain;
}
.leaderboard .leaderboard-list-body:nth-child(3)::before {
  background: url('https://cdn.banggooso.com/assets/images/game250/common/medal-3.png') no-repeat center center /
    contain;
}
.leaderboard .leaderboard-list-body-rank {
  width: 2.75rem;
  color: #b0b0b0;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 600;
  line-height: 1.5rem; /* 133.333% */
}
.leaderboard .leaderboard-list-body:first-child .leaderboard-list-body-rank {
  color: #0090ff;
}
.leaderboard .leaderboard-list-body-score {
  width: 7.6875rem;
  color: #646464;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}
.leaderboard .leaderboard-list-body-name {
  color: #222;
  flex: 1 0 0;
  text-align: center;
  -webkit-text-stroke-width: 0.031rem;
  -webkit-text-stroke-color: #222;
  font-family: 'Ownglyph MinhyeChae';
  font-size: 2.5rem;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

/* 문제 페이지 본문 영역 */
.game-wrap .game-body {
  width: 100%;
  margin: 0;
  display: flex;
  padding: 0.69rem 1.75rem 12.5rem;
  flex-direction: column;
  align-items: center;
  gap: 1.625rem;
}

.game-body .next-btn {
  display: flex;
  padding: 1.375rem 1.875rem 1.875rem 1.875rem;
  justify-content: center;
  align-items: center;
  align-self: stretch;
  background: #0090ff;
  box-shadow: 0.125rem 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.15);
  color: #fff;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.75rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.game-body .question-header {
  display: flex;
  padding: 1rem 0rem 1.25rem 0rem;
  justify-content: space-between;
  align-items: center;
  align-self: stretch;
}

.game-body .question-header .question-level {
  display: flex;
  padding: 0.25rem 1rem 0.4375rem 1rem;
  justify-content: center;
  align-items: center;
  border-radius: 6.25rem;
  border: 1.5px solid #222;
  mix-blend-mode: multiply;
  color: #222;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.0625rem;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.game-body .question-header .question-part {
  color: #222;
  text-align: right;
  font-family: 'Noto Sans KR';
  font-size: 1.1875rem;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}

.game-body .question-header .question-progress {
  display: flex;
  width: 27.75rem;
  height: 0.25rem;
  align-items: center;
  gap: 0.3125rem;
  position: absolute;
  bottom: 0rem;

  background: linear-gradient(to right, rgba(25, 64, 68, 0.25) 2.49rem, transparent 0.3125rem);
  background-size: 2.8025rem 100%;
}
.game-body .question-header .question-progress .question-progress-bar {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  background: linear-gradient(to right, #222 2.49rem, transparent 0.3125rem);
  background-size: 2.8025rem 100%;
}

.game-body .question-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.625rem;
  width: 100%;
  position: relative;
}

.game-body .question-content .question-container {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 0.625rem;
  align-self: stretch;
}

.game-body .question-content .question-animation {
  width: 9rem;
  height: 10rem;
  position: absolute;
  left: -1.38rem;
  top: -1rem;
}

.game-wrap .game-body .question-title {
  color: #222;
  font-family: 'Noto Sans KR';
  font-size: 1.875rem;
  font-style: normal;
  font-weight: 800;
  line-height: 2.875rem; /* 153.333% */
  margin-bottom: 0;
  text-align: left;
  word-break: break-all;
}
.game-wrap .game-body .question-title u {
  text-decoration: underline;
  text-underline-offset: 0.313rem;
}
.game-wrap .game-body .question-container .character-icon {
  width: 2.5rem;
  height: 2.5rem;
}

.game-body .question-option-list {
  display: flex;
  padding: 1.125rem 0rem;
  flex-direction: column;
  align-items: flex-start;
  gap: 1rem;
  align-self: stretch;
}

.game-body .question-option-item-wrap {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 1rem;
  width: 100%;
}

.game-body .question-option-item {
  flex-grow: 1;
  display: flex;
  padding: 1.125rem 0.875rem 1.25rem 0.875rem;
  justify-content: left;
  align-items: start;
  align-self: stretch;
  background: #fff;
  box-shadow: 0.125rem 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.15);
  color: #222;
  font-family: 'Noto Sans KR';
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 500;
  line-height: 2.125rem; /* 170% */
  cursor: pointer;
  text-align: left;
  position: relative;
}
.game-body .question-option-item:not(:has(input[type='radio']:checked)):hover {
  scale: 1.01;
}
.game-body .question-option-item:has(input[type='radio']:checked) {
  background: #e4f3ff;
}
.game-body .question-option-item:has(input[type='radio']:checked)::after {
  content: '';
  max-width: 3.6875rem;
  width: 0;
  height: 3.25rem;
  position: absolute;
  left: -0.25rem;
  top: 0.125rem;
  background-image: url('https://cdn.banggooso.com/assets/images/game250/common/question-check.png');
  background-size: cover;
  background-repeat: no-repeat;
  background-position: left;
  animation: drawLeftToRight 1s forwards; /* 애니메이션 시작 */
}
.game-body .question-option-item input[type='radio'] {
  display: none;
}

.game-body .question-option-item-wrap:nth-child(1) .question-option-item:before {
  content: '①\00a0';
}
.game-body .question-option-item-wrap:nth-child(2) .question-option-item:before {
  content: '②\00a0';
}
.game-body .question-option-item-wrap:nth-child(3) .question-option-item:before {
  content: '③\00a0';
}
.game-body .question-option-item-wrap:nth-child(4) .question-option-item:before {
  content: '④\00a0';
}

.game-body .question-audio-play-btn {
  display: flex;
  padding: 0.75rem 1.375rem;
  align-items: center;
  gap: 0.625rem;
  align-self: stretch;
  border: 0.094rem solid #0090ff;
  background-color: transparent;
  background-image: url(https://cdn.banggooso.com/assets/images/game250/common/sound.png);
  background-size: 1.75rem;
  background-position: center;
  background-repeat: no-repeat;
  width: 4.5rem;
}

.game-body .question-audio-play-btn:disabled {
  background-color: transparent !important;
  background-image: url(https://cdn.banggooso.com/assets/images/game250/common/sound.png) !important;
  background-size: 1.75rem !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  opacity: 0.5;
}

.game-body .question-audio-play-btn.play {
  background-color: #0090ff;
  background-image: url(https://cdn.banggooso.com/assets/images/game250/common/sound-active.png);
}

@keyframes drawLeftToRight {
  0% {
    width: 0; /* 애니메이션 시작 시 폭은 0% */
  }
  100% {
    width: 100%;
  }
}

.game-body .question-answer {
  display: flex;
  margin: 1.125rem 0rem;
  flex-direction: column;
  align-items: flex-start;
  gap: 1rem;
  align-self: stretch;
  display: flex;
  padding: 2.25rem 1.125rem 2.375rem 1.125rem;
  justify-content: center;
  align-items: center;
  align-self: stretch;
  background: #fff;
  box-shadow: 0.125rem 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.15);
  text-align: center;
  -webkit-text-stroke-width: 0.019rem;
  font-family: 'Ownglyph MinhyeChae';
  font-size: 2.375rem;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.game-body .question-answer::placeholder {
  color: #bfbfbf;
  -webkit-text-stroke-color: #bfbfbf;
}

.game-body .confirm-btn {
  display: flex;
  padding: 1.375rem 1.875rem 1.875rem 1.875rem;
  justify-content: center;
  align-items: center;
  align-self: stretch;
  background: #0090ff;
  box-shadow: 0.125rem 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.15);
  color: #fff;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.75rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

/* .game-body .confirm-btn:disabled {
  opacity: 0.5;
  cursor: default;
} */

.game-wrap .test-step-1 .instruction-title {
  display: flex;
  padding-top: 1rem;
  justify-content: space-between;
  align-items: center;
  color: #222;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.1875rem;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}

.game-wrap .test-step-1 .instruction-content {
  display: flex;
  padding: 1.375rem 1.75rem 1.5rem 1.75rem;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  align-self: stretch;
  background: #fff;
  box-shadow: 0.125rem 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.15);
}

.game-wrap .test-step-1 .instruction-content-title {
  color: #222;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 2.125rem;
  font-style: normal;
  font-weight: 700;
  line-height: 2.875rem; /* 135.294% */
}

.game-wrap .test-step-1 .instruction-content ul {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: left;
  gap: 1rem;
}

.game-wrap .test-step-1 .instruction-content li {
  color: #222;
  font-family: 'Noto Sans KR';
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 500;
  line-height: 2.125rem; /* 170% */
  text-align: left;
}

.game-wrap .test-step-1 .instruction-content li {
  margin-inline-start: 1.5rem;
}
.game-wrap .test-step-1 .instruction-content li::before {
  content: '○';
  display: inline-block;
  width: 1.5rem;
  margin-left: -1.5rem;
}

.game-wrap .test-step-1 .instruction-content li u::before {
  content: '';
  display: flex;
  padding-top: 0.125rem;
  align-items: center;
  position: absolute;
  bottom: -0.3125rem;
  width: 17.625rem;
  height: 0.5rem;
  background: url(https://cdn.banggooso.com/assets/images/game250/common/instruction-underline.png) no-repeat center
    center / contain;
}

.game-wrap .game-body .question-image {
  margin: 0;
}

.game-body .event-form {
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: center;
  gap: 1.625rem;
  padding-bottom: 10rem;
}

.fade-in {
  animation: fadeIn 0.5s forwards;
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

.fade-out {
  animation: fadeOut 0.5s forwards;
}

@keyframes fadeOut {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

.game-body .event-form * {
  transition: all 0.5s;
}

.game-body .event-form-body {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.625rem;
  align-self: stretch;
}

.game-body .event-form:not(.show) .event-form-title,
.game-body .event-form:not(.show) .event-form-body > *:nth-child(n + 3),
.game-body .event-form:not(.show) > *:not(.event-form-body),
.game-body .event-form:not(.show) > *:not(.event-form-body) * {
  opacity: 0;
}

.game-body .event-form:not(.show) .coupon-image {
  display: flex;
  width: 19.34481rem;
  padding: 0rem 0.01963rem 0rem 0.01938rem;
  justify-content: center;
  align-items: center;
}

.game-body .event-form:not(.show) .event-form-subtitle {
  font-size: 2.25rem;
}
.game-body .event-form[data-event='EVENT_3']:not(.show) .event-form-subtitle {
  font-size: 1.875rem;
}

.game-body .event-form:not(.show) .event-form-subtitle::after {
  opacity: 1;
}

.game-body .event-form .coupon-image {
  display: flex;
  width: 12.75rem;
  padding: 0rem 0.01288rem 0rem 0.01281rem;
  justify-content: center;
  align-items: center;
}

.game-body .event-form .event-form-title-wrap {
  display: flex;
  padding-top: 0.25rem;
  flex-direction: column;
  align-items: center;
  align-self: stretch;
}

.game-body .event-form .event-form-subtitle {
  color: #222;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.375rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  position: relative;
  width: 100%;
  letter-spacing: -0.063rem;
}

.game-body .event-form:not([data-event='EVENT_3']) .event-form-subtitle::after {
  content: '';
  opacity: 0;
  width: 2.80288rem;
  height: 2.43638rem;
  position: absolute;
  left: 5.9375rem;
  top: -0.4375rem;
  background-image: url('https://cdn.banggooso.com/assets/images/game250/page/coupon_effect.png');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  transition: all 0.5s;
}
.game-body .event-form[data-event='EVENT_3'] .event-form-subtitle::after {
  content: '';
  opacity: 0;
  width: 2.80288rem;
  height: 2.43638rem;
  position: absolute;
  left: 5.9375rem;
  top: -0.4375rem;
  background-image: url('https://cdn.banggooso.com/assets/images/game250/page/coupon_effect.png');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  transition: all 0.5s;
}

.game-body .event-form .event-form-title {
  color: #222;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 2.25rem;
  font-style: normal;
  font-weight: 800;
  line-height: 3.25rem; /* 144.444% */
}

.game-body .event-form .event-form-caution {
  color: #222;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.0625rem;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  mix-blend-mode: multiply;
  opacity: 0.7;
}
.game-body .event-form[data-event='EVENT_3'] .event-form-caution {
  margin-bottom: 1.38rem;
}

.game-body .event-form .event-form-input-top {
  color: #222;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.375rem;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.game-body .event-form .event-form-input-wrap {
  display: flex;
  padding: 1.125rem 0rem;
  flex-direction: column;
  align-items: flex-start;
  gap: 1rem;
  align-self: stretch;
}

.game-body .event-form .event-form-input-taste-area {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 100%;
}

.game-body .event-form .event-form-input-taste-area .event-form-input-title {
  width: 100%;
  text-align: left;
}

.game-body .event-form .event-form-radio-container {
  display: flex;
  padding-bottom: 0.25rem;
  align-items: center;
  gap: 0.75rem;
  align-self: stretch;
}

.game-body .event-form .event-form-radio-item {
  display: flex;
  padding: 1rem 0.2rem 1.125rem 0;
  flex-grow: 1;
  justify-content: center;
  align-items: center;
  flex: 1 0 0;
  align-self: stretch;
  background: #fff;
  box-shadow: 2px 2px 6px 0px rgba(0, 0, 0, 0.15);
  color: #222;
  font-family: 'Noto Sans KR';
  font-size: 1.1875rem;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: -0.02375rem;
  cursor: pointer;
}

.game-body .event-form .event-form-radio-item input[type='radio'] {
  display: none;
}

.game-body .event-form .event-form-radio-item::before {
  content: '';
  width: 2rem;
  height: 2rem;
  background-image: url('https://cdn.banggooso.com/assets/images/game250/icons/radio.png');
  background-size: contain;
  background-repeat: no-repeat;
}

.game-body .event-form .event-form-radio-item:has(input[type='radio']:checked)::before {
  content: '';
  width: 2rem;
  height: 2rem;
  background-image: url('https://cdn.banggooso.com/assets/images/game250/icons/radio-checked.png');
  background-size: contain;
  background-repeat: no-repeat;
}

.game-body .event-form .event-form-input-wrap .event-form-input-item {
  display: flex;
  padding-bottom: 0.25rem;
  align-items: center;
  gap: 1rem;
  align-self: stretch;
}

.game-body .event-form .event-form-input-title {
  width: 3.625rem;
  color: #222;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.375rem;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  opacity: 0.8;
  mix-blend-mode: multiply;
}

.game-body .event-form .event-form-input {
  display: flex;
  padding: 1.25rem 1.125rem 1.375rem 1.125rem;
  justify-content: center;
  align-items: center;
  flex: 1 0 0;
  background: #fff;
  box-shadow: 0.125rem 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.15);
  color: #222;
  text-align: center;
  -webkit-text-stroke-width: 0.031rem;
  -webkit-text-stroke-color: #222;
  font-family: 'Ownglyph MinhyeChae';
  font-size: 2.375rem;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  width: 100%;
  flex-shrink: 1;
}
.game-body .event-form .event-form-input::placeholder {
  color: #bfbfbf;
  -webkit-text-stroke-color: #bfbfbf;
}
.game-body .event-form textarea.event-form-input {
  max-height: 7.75rem;
  resize: none;
  text-align: left;
}
.game-body .event-form textarea.event-form-input::placeholder {
  text-align: center;
}

.game-body .event-form .event-form-checkbox-wrap {
  display: flex;
  margin-bottom: 2.5625rem;
  padding: 0.75rem 1rem 0.875rem 1rem;
  align-items: center;
  gap: 0.625rem;
  align-self: stretch;
  background: #fff;
  box-shadow: 0.125rem 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.15);
  color: #222;
  font-family: 'Noto Sans KR';
  font-size: 1.1875rem;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: -0.02375rem;
  text-align: left;
}

.game-body .event-form .event-form-checkbox-wrap label {
  display: flex;
  width: 2rem;
  height: 2rem;
  justify-content: center;
  align-items: center;
  cursor: pointer;
}

.game-body .event-form .event-form-checkbox {
  width: 1.25rem;
  height: 1.25rem;
  border: 0.125rem solid #a9a9a9;
  transition: none;
}

.game-body .event-form .event-form-checkbox-wrap input:checked + label .event-form-checkbox {
  border: none;
  background-image: url('https://cdn.banggooso.com/assets/images/game250/icons/checkbox-checked.png');
  background-position: center;
  background-size: calc(2rem - 0.125rem);
  background-repeat: no-repeat;
}

.game-body .event-form .event-form-checkbox-wrap input {
  display: none;
}

.game-body .event-form .event-form-checkbox-wrap button {
  display: flex;
  padding: 0.125rem;
  align-items: center;
  gap: 0.125rem;
  position: absolute;
  right: 1rem;
  bottom: 0.8125rem;
  color: #0090ff;
  font-family: 'Noto Sans KR';
  font-size: 1.1875rem;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.02375rem;
  background: none;
}

.game-body .event-form .event-form-submit-btn-wrap {
  position: relative;
}

.game-body .event-form .event-form-tooltip-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: absolute;
  left: 2.09375rem;
  top: -2.375rem;
}

.game-body .event-form .event-form-tooltip-wrap svg {
  width: 1rem;
  height: 0.5rem;
}

.game-body .event-form .event-form-tooltip {
  display: flex;
  padding: 0.625rem 1rem 0.75rem 1rem;
  justify-content: center;
  align-items: center;
  gap: 0.625rem;
  align-self: stretch;
  color: #fff;
  font-family: Pretendard;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  background: #222222;
}

.game-body .event-form .event-form-submit-btn {
  display: flex;
  width: 27.75rem;
  padding: 1.375rem 1.875rem 1.875rem 1.875rem;
  justify-content: center;
  align-items: center;
  gap: 0.25rem;
  background: #0090ff;
  box-shadow: 0.125rem 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.15);
  color: #fff;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.625rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.game-body .event-form .event-form-next-btn {
  color: #0090ff;
  font-family: 'Noto Sans KR';
  font-size: 1.375rem;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  letter-spacing: -0.0275rem;
  background: none;
}

.game-body .event-form .event-30-wrap {
  display: flex;
  padding-top: 0.75rem;
  flex-direction: column;
  align-items: center;
  gap: 0.375rem;
  align-self: stretch;
}

.game-body .event-form .event-30-image {
  width: 16.75rem;
}
.game-body .event-form .event-30-image.sold-out img {
  filter: brightness(0.6);
}
.game-body .event-form .event-30-image.sold-out::after {
  content: '선착순 끝!';
  display: flex;
  width: 9.7075rem;
  transform: rotate(3.832deg) translateX(-50%);
  padding: 0.375rem 1.125rem;
  justify-content: center;
  align-items: center;
  background: #f27321;
  color: #fff;
  text-align: center;
  -webkit-text-stroke-width: 0.4000000059604645;
  -webkit-text-stroke-color: #fff;
  font-family: 'Ownglyph MinhyeChae';
  font-size: 2rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.5625rem; /* 78.125% */
  position: absolute;
  top: 8rem;
  left: 50%;
}

.game-body .event-form .event-30-title-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 0.5rem;
}

.game-body .event-form .event-30-subtitle {
  display: flex;
  padding: 0rem 0.5rem 0.125rem 0.5rem;
  justify-content: center;
  align-items: center;
  border: 1.5px solid #ff4c1c;
  color: #ff4c1c;
  text-align: center;
  -webkit-text-stroke-width: 0.019rem;
  -webkit-text-stroke-color: #ff4c1c;
  font-family: 'Ownglyph MinhyeChae';
  font-size: 1.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: -0.0375rem;
}
.game-body .event-form .event-30-subtitle::before,
.game-body .event-form .event-30-subtitle::after {
  content: '★';
  color: #ff4c1c;
  text-align: center;
  -webkit-text-stroke-width: 0.025rem;
  -webkit-text-stroke-color: #ff4c1c;
  font-family: 'Nanum YeorIrCe';
  font-size: 2rem;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: 0.04rem;
}

.game-body .event-form .event-30-title {
  display: flex;
  padding-bottom: 0.1875rem;
  justify-content: center;
  align-items: center;
  color: #222;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.5625rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.game-body .event-form .event-30-input-wrap {
  display: flex;
  padding: 0.375rem 0rem;
  justify-content: center;
  align-items: flex-start;
  gap: 1.25rem;
  align-self: stretch;
}

.game-body .event-form .event-30-input {
  display: flex;
  padding: 0.875rem 1rem 1rem 0.75rem;
  justify-content: center;
  align-items: center;
  gap: 0.25rem;
  flex: 1 0 0;
  background: #fff;
  box-shadow: 0.125rem 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.15);
  color: #222;
  font-family: 'Noto Sans KR';
  font-size: 1.1875rem;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.02375rem;
  cursor: pointer;
}

.game-body .event-form .event-30-input:has(input[type='radio']:checked) .event-form-checkbox {
  border: none;
  background-image: url(https://cdn.banggooso.com/assets/images/game250/icons/checkbox-checked.png);
  background-position: center;
  background-size: calc(2rem - 0.125rem);
  background-repeat: no-repeat;
}

.game-body .event-form .event-30-input input {
  display: none;
}

.game-wrap #modal.show {
  transform: scale(1);
  background: rgba(0, 0, 0, 0.4);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

#sold-out-modal {
  display: flex;
  justify-content: center;
  align-items: center;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.fade-element {
  opacity: 0;
  transition: opacity 0.5s linear;
}

.fade-element.show {
  opacity: 1;
}

#sold-out-modal .modal-content {
  display: inline-flex;
  padding: 2rem;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0.75rem;
  background: linear-gradient(0deg, rgba(34, 34, 34, 0.75) 0%, rgba(34, 34, 34, 0.75) 100%), rgba(0, 0, 0, 0.5);
}

#sold-out-modal h2 {
  color: #fff;
  text-align: center;
  font-family: Pretendard;
  font-size: 1.625rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.75rem; /* 107.692% */
}

#sold-out-modal p {
  color: #fff;
  text-align: center;
  font-family: Pretendard;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 500;
  line-height: 1.75rem; /* 140% */
  opacity: 0.7;
}

#modal .closing-content-wrap {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 1.3125rem;
}

#modal .closing-phrase {
  color: #fff;
  text-align: center;
  text-shadow: 0px 2px 4px rgba(0, 0, 0, 0.25);
  font-family: 'Noto Sans KR';
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 500;
  line-height: 2.125rem; /* 141.667% */
}

#modal .loadindg-spinner {
  width: 3.6875rem;
  height: 1.75rem;
}

#modal .modal-content {
  display: flex;
  width: 27.5rem;
  height: 29.875rem;
  padding: 2rem 1.875rem;
  flex-direction: column;
  align-items: flex-start;
  gap: 1.75rem;
  flex-shrink: 0;
  background: #fff;
  text-shadow: none;
  text-align: left;
}

.game-body .modal-content {
  display: none;
}

#modal .modal-content-header {
  display: flex;
  justify-content: space-between;
  align-items: start;
  width: 100%;
}

#modal .modal-content-header h3 {
  color: #222;
  font-family: Pretendard;
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.875rem; /* 125% */
}

#modal .modal-close-btn {
  width: 2.25rem;
  height: 2.25rem;
  position: absolute;
  right: 1.5rem;
  top: 1.875rem;
  background: transparent;
}

#modal .modal-content-body {
  color: #222;
  font-family: Pretendard;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.75rem; /* 140% */
  overflow-y: scroll;
  letter-spacing: 0;
}

/* 결과 페이지 */
.game-result {
  display: flex;
  width: 31.25rem;
  padding: 0 1.75rem 18.625rem;
  flex-direction: column;
  align-items: center;
  gap: 2.25rem;
}

.result-content-wrap {
  display: flex;
  padding-bottom: 1.5rem;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  align-self: stretch;
}

.result-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
}

.result-content-title {
  display: flex;
  padding: 2.5rem 0rem 1.375rem 0rem;
  justify-content: center;
  align-items: end;
  align-self: stretch;
  color: #222;
  text-align: center;
  -webkit-text-stroke-width: 0.063rem;
  -webkit-text-stroke-color: #222;
  font-family: 'Ownglyph MinhyeChae';
  font-size: 3.125rem;
  font-style: normal;
  font-weight: 400;
  line-height: 2.875rem; /* 92% */
}
.result-image-container .result-content-title,
.result-content-wrap.sns-event .result-content-title {
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.result-content-title span {
  color: #222;
  text-align: center;
  -webkit-text-stroke-width: 0.038rem;
  -webkit-text-stroke-color: #222;
  font-family: 'Ownglyph MinhyeChae';
  font-size: 2.375rem;
  font-style: normal;
  font-weight: 400;
  line-height: 2.5rem; /* 105.263% */
}
.result-content-title::before {
  content: '';
  width: 100%;
  max-width: 25.5625rem;
  height: 1.875rem;
  position: absolute;
  left: 1.0625rem;
  top: 0.875rem;
  background-image: url(https://cdn.banggooso.com/assets/images/game250/common/text-border.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.result-content-title::after {
  content: '';
  width: 100%;
  max-width: 25.5625rem;
  height: 1.875rem;
  position: absolute;
  left: 1.0625rem;
  bottom: -0.4375rem;
  background-image: url(https://cdn.banggooso.com/assets/images/game250/common/text-border.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.result-content-title i {
  color: #222;
  font-family: 'Nanum YeorIrCe';
  font-size: 3.125rem;
  font-style: normal;
  font-weight: 400;
  line-height: 2.875rem;
}
.result-content-button {
  display: flex;
  width: 27.75rem;
  padding: 1.375rem 1.875rem 1.875rem 1.875rem;
  justify-content: center;
  align-items: center;
  gap: 0.25rem;
  background: #0090ff;
  box-shadow: 0.125rem 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.15);
  color: #fff;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.625rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}
.result-content-button svg {
  position: relative;
  width: 1.25rem;
  height: 1.375rem;
  top: 0.063rem;
}
.result-content-tooltip {
  display: flex;
  padding: 0.625rem 1rem 0.75rem 1rem;
  justify-content: center;
  align-items: center;
  gap: 0.625rem;
  align-self: stretch;
  position: absolute;
  left: 50%;
  top: -2.375rem;
  background: #222222;
  color: #fff;
  font-family: Pretendard;
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  transform: translateX(-50%);
  width: max-content;
}
.result-content-tooltip svg {
  content: '';
  display: block;
  width: 1rem;
  height: 0.5rem;
  position: absolute;
  bottom: calc(1px - 0.5rem);
}
.result-content-caption {
  color: #222222;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.0625rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  opacity: 0.7;
}

.sns-event-box {
  display: flex;
  padding: 0.875rem 1.5rem 1.25rem 1.5rem;
  flex-direction: column;
  align-items: center;
  gap: 0.25rem;
  align-self: stretch;
  border-top: 1px solid rgba(237, 214, 175, 0.15);
  background: #fff;
  box-shadow: 2px 2px 6px 0px rgba(0, 0, 0, 0.15);
}

.sns-event-box .sns-event-title {
  color: #0090ff;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.1875rem;
  font-style: normal;
  font-weight: 700;
  line-height: 2rem; /* 168.421% */
}

.sns-event-box .sns-event-row:nth-child(2) {
  display: flex;
  padding: 0.5rem 0rem 1rem 0rem;
  align-items: center;
  gap: 0.625rem;
  align-self: stretch;
  border-bottom: 1px solid rgba(28, 83, 93, 0.2);
}

.sns-event-box .sns-event-row:last-child {
  display: flex;
  padding-top: 0.5rem;
  align-items: center;
  gap: 0.625rem;
  align-self: stretch;
}

.sns-event-box .sns-event-row-title {
  width: 4.3125rem;
  color: #222222;
  font-family: 'Noto Sans KR';
  font-size: 1.0625rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.sns-event-box .sns-event-account-wrap {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-grow: 1;
  justify-content: center;
}

.sns-event-box .sns-event-account {
  display: flex;
  padding-top: 0.125rem;
  justify-content: center;
  align-items: center;
}

.sns-event-box .sns-event-account i {
  width: 1.75rem;
  height: 1.75rem;
}

.sns-event-box .sns-event-account p {
  color: #222222;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.0625rem;
  font-style: normal;
  font-weight: 700;
  line-height: 140%; /* 1.4875rem */
  opacity: 0.7;
  padding-bottom: 0.25rem;
}

.sns-event-box .sns-event-hashtag {
  display: flex;
  width: 15.125rem;
  flex-direction: column;
  justify-content: center;
  align-self: stretch;
  color: #222222;
  font-family: 'Noto Sans KR';
  font-size: 1.0625rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  opacity: 0.7;
}

.sns-event-box .sns-event-button {
  display: flex;
  padding: 0.5625rem 0.875rem 0.8125rem 0.875rem;
  justify-content: center;
  align-items: center;
  gap: 0.25rem;
  flex: 1 0 0;
  border-radius: 0.25rem;
  background: #0090ff;
  box-shadow: 2px 2px 6px 0px rgba(0, 0, 0, 0.15);
  color: #fff;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.25rem;
  font-style: normal;
  font-weight: 800;
  line-height: 140%; /* 1.75rem */
}

.game-result .result-report-container {
  display: flex;
  padding-top: 1.75rem;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  align-self: stretch;
}

.game-result .result-report-title {
  color: #0090ff;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.1875rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.game-result .result-report-wrap {
  width: 27.75rem;
  height: 3.3125rem;
  color: #0090ff;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.1875rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  position: relative;
  background-image: url(https://cdn.banggooso.com/assets/images/game250/result/report.png);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.game-result .result-report-wrap .result-report-name {
  display: inline-flex;
  padding: 0.625rem 0.625rem 0.75rem 0.625rem;
  justify-content: center;
  align-items: center;
  gap: 0.625rem;
  position: absolute;
  left: 3.19rem;
  width: 5.625rem;
}

.game-result .result-report-wrap .result-report-score {
  display: inline-flex;
  padding: 0.625rem;
  justify-content: center;
  align-items: center;
  gap: 0.625rem;
  position: absolute;
  left: 12.8rem;
  width: 4.5625rem;
  top: 0.125rem;
}

.game-result .result-report-wrap .result-report-rank {
  width: 5.6875rem;
  position: absolute;
  top: 0.56rem;
  right: 0.9rem;
}

.game-result .result-image-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  align-self: stretch;
}

.game-result .result-image-wrap {
  width: 22.625rem;
  height: 34.375rem;
  position: relative;
}

.game-result .result-image-wrap > * {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
}

.game-result .result-image:not(.show),
.game-result .result-image-wrap .download-img:not(.show) {
  display: none;
}

.game-result .result-image-nickname-wrap {
  padding: 4.87rem 4.11rem 22.1rem 3.45rem;
}
.game-result .result-image-nickname {
  width: 14.4375rem;
  height: 4.5rem;
  transform: rotate(-12deg);
  color: #390000;
  font-family: esamanru;
  font-size: 3.875rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: -0.11625rem;
  text-align: left;
}

.game-result .result-image-taste-wrap {
  padding: 24.06rem 3.04rem 6.3rem 11.5rem;
}
.game-result .result-image-taste {
  width: 7.8125rem;
  height: 2.0625rem;
  transform: rotate(-15deg);
  color: #fff366;
  font-family: Recipekorea;
  font-size: 1.5625rem;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: -0.10938rem;
}

.game-result .result-image-taste-text-wrap {
  padding: 26.75rem 10.75rem 6.2rem 10.31rem;
}
.game-result .result-image-taste-text {
  width: 1.3125rem;
  height: 1.125rem;
  transform: rotate(-15deg);
  color: #fff366;
  font-family: Recipekorea;
  font-size: 0.875rem;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  letter-spacing: -0.06125rem;
}

.game-result .result-image-caution {
  display: flex;
  padding-bottom: 1.375rem;
  justify-content: center;
  align-items: center;
  align-self: stretch;
  color: #989898;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 500;
  line-height: 2.125rem; /* 188.889% */
}

.game-result .result-image-selector-wrap {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
}

.game-result .result-image-selector {
  display: flex;
  width: 5rem;
  height: 5rem;
  padding: 0.91669rem 0.57138rem 0.91669rem 0.58338rem;
  justify-content: center;
  align-items: center;
  border-radius: 8.33331rem;
  box-shadow: 0.167rem 0.167rem 0.5rem 0 rgba(0, 0, 0, 0.15);
  cursor: pointer;
  background-size: 3.84525rem 3.16669rem;
  background-position: center;
  background-repeat: no-repeat;
}

.game-result .result-image-selector.active {
  border: 0.313rem solid #f27321;
}

.game-result .result-image-selector[data-product='1'] {
  background-image: url(https://cdn.banggooso.com/assets/images/game250/common/product-chip-1.png);
  background-color: #9bd140;
}
.game-result .result-image-selector[data-product='2'] {
  background-image: url(https://cdn.banggooso.com/assets/images/game250/common/product-chip-2.png);
  background-color: #00c1e1;
}
.game-result .result-image-selector[data-product='3'] {
  background-image: url(https://cdn.banggooso.com/assets/images/game250/common/product-chip-3.png);
  background-color: #e7ab69;
}

.game-result .btn_retest {
  margin: 0 0 6.5rem;
  width: 100%;
}

.game-restart-button,
.game-result .btn_retest > a {
  display: flex;
  width: 27.75rem;
  padding: 1.375rem 1.875rem 1.875rem 1.875rem;
  justify-content: center;
  align-items: center;
  gap: 0.25rem;
  background: #0090ff;
  box-shadow: 0.125rem 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.15);
  color: #fff;
  text-align: center;
  font-family: 'Noto Sans KR';
  font-size: 1.625rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  border-radius: 0;
  border: none;
}
.game-restart-button::after,
.game-result .btn_retest > a::after {
  content: '';
  width: 1.4rem;
  height: 1.4rem;
  background-image: url(https://cdn.banggooso.com/assets/images/common/re-test-w.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  position: relative;
  top: 0.1rem;
}

.game-result .btn_retest > a:hover {
  scale: 1.01;
}

/* 방구소 더보기 영역 */
.game-result .contents-more {
  background: #fffefa;
  box-shadow: 2px -2px 10px 0px rgba(0, 0, 0, 0.1);
  flex-direction: column;
  width: calc(100% + (1.75rem * 2));
  border-radius: 0;
  padding-top: 2.5rem;
  padding-bottom: 2.19rem;
  margin-bottom: -2.25rem;
}

/* 방구소 더보기 제목 영역 */
.game-result .contents-more .contents-main {
  padding: 0 2rem 1rem;
  align-items: baseline;
  gap: 0.33331rem;
  margin: 0;
}

/* 방구소 더보기 방구소 로고 */
.game-result .contents-more .contents-main .contents-logo {
  width: 8.72094rem;
}

/* 방구소 더보기 방구소 제목 */
.game-result .contents-more .contents-main .sub-text {
  color: #333;
  font-family: Pretendard;
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 700;
  line-height: 2.125rem; /* 141.667% */
  margin: 0;
}

/* 방구소 더보기 리스트 */
.game-result .contents-more .contents-list {
  margin: 0;
  padding: 0;
  border: none;
}

/* 방구소 더보기 버튼 */
.game-result .contents-more .contents-list .game-btn {
  border: 0;
  border-top: 0.083rem solid #333;
  border-radius: 0;
  background: transparent;
  padding: 1.66669rem 2rem;
  margin: 0;
}

/* 방구소 더보기 버튼 텍스트 */
.game-result .contents-more .contents-list .game-btn > a {
  color: #333;
  font-family: Pretendard;
  font-size: 1.375rem;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

/* 방구소 더보기 버튼 아이콘 */
.game-result .contents-more .contents-list .game-btn::before {
  width: 2rem;
  height: 2rem;
  left: 87%;
  background-size: 30%;
  background-position: center center;
}

/* 결과 콘텐츠 추천 */
.game-result .recommend-list {
  margin: 0;
  background: #fffefa;
  width: calc(100% + (1.75rem * 2));
}

/* 결과 콘텐츠 추천 배경 색상 */
.game-result .recommend-list:before {
  background: #fffefa;
  height: 16.125rem;
}

/* 결과 콘텐츠 추천 제목 */
.game-result .recommend-list .inner .title {
  color: #2c2b2f;
  font-family: 'Pretendard';
  font-size: 1.50013rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: -0.033rem;
  margin: -0.13rem 0 0.46rem 1.46rem;
  padding: 0;
}

/* 결과 콘텐츠 추천 카드 */
.game-result .recommend-list .swiper-container {
  padding-left: 2.17rem;
  padding-bottom: 3.25rem;
}
.game-result .recommend-list .swiper-slide {
  width: 10.83988rem;
  height: 13.37894rem;
}
.game-result .recommend-list .slide-box {
  border: 0.33rem solid #000;
  border-radius: 0;
  background-color: #000;
}
.game-result .recommend-list .slide-box .link {
  width: 100%;
  height: 100%;
  padding: 0;
  display: block;
}
.game-result .recommend-list .slide-box .link > * {
  width: 100%;
  margin: 0;
  position: absolute;
  left: 0;
}

/* 결과 콘텐츠 추천 카드 이미지 */
.game-result .recommend-list .slide-box .img-box {
  top: 0.063rem;
  height: calc(100% - 2.1rem);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

/* 결과 콘텐츠 추천 카드 콘텐츠명 */
.game-result .recommend-list .slide-box .slide-text {
  display: flex;
  justify-content: center;
  align-items: center;
  bottom: 0;
  color: #000;
  font-family: Pretendard;
  font-size: 1.00006rem;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: -0.02rem;
  background-color: #fff;
  padding: 0.66rem;
  height: auto;
}

.game-result .recommend-list .btn-wrap {
  display: flex;
  justify-content: center;
}

.btn-white-round {
  border-radius: 2.00013rem;
  border: 2px solid #0090ff;
  background: #fff;
  color: #0090ff;
  text-align: center;
  font-family: 'RixGulim';
  font-size: 1.25006rem;
  font-style: normal;
  font-weight: 900;
  line-height: normal;
  letter-spacing: -0.0275rem;
  width: 15.25106rem;
  height: 4.00025rem;
  flex-shrink: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}

.image-wrap.event-closed {
  padding: 0;
}

.image-wrap.event-gift-closed {
  padding: 0 0.94rem 1.12rem;
}

.image-wrap.event-form-closed,
.image-wrap.event-gift-closed-2 {
  width: inherit;
  padding: 0 0.94rem;
}