@charset "UTF-8";
/*-----------------------------*/
/*  혜택 :: 공통 스타일 */
/*-----------------------------*/
.bf-top__tab {
  height: 45px;
}
.bf-top__tab .tab-component {
  position: fixed;
  top: 54px;
  width: 100%;
  z-index: 100;
  max-width: 761px;
}
.bf-top__tab .tab-component .swiper-slide:nth-child(2) .tab-component__item::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 44px;
  height: 44px;
  transform: translate(-50%, -50%);
}

.content > .benefit__section:first-of-type {
  margin-top: 0;
}

.benefit__section {
  margin-top: 40px;
}
.benefit__section.benefit__spacing--s {
  margin-top: 12px;
}
.benefit__section.benefit__spacing--m {
  margin-top: 16px;
}
.benefit__box {
  border-radius: 16px;
  padding: 16px;
}
.benefit__box.dis-padding {
  padding: 0;
}
.benefit__box.padding-lm {
  padding: 20px 16px;
}
.benefit__box.border-l {
  border-radius: 12px;
}
.benefit__box--white {
  background-color: #ffffff;
}
.benefit__box--gray {
  background-color: rgba(10, 31, 65, 0.05);
}
.benefit__cont-box {
  position: relative;
  padding: 20px;
  border-radius: 16px;
  background-color: var(--color-bg-neutral-inverted, #ffffff);
}
.benefit__cont-box.sdk {
  padding-top: 20px;
  padding-bottom: 20px;
  padding-right: 0;
  padding-left: 0;
}
.benefit__cont-box.sdk .banner-item {
  background: none;
}

.banner-gradient-bg, .benefit-unit.active {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.8) 80%), linear-gradient(90deg, #FFF7EF 0%, #F5E5F7 100%);
}

[data-change-bg] {
  background-color: var(--color-bg-neutral-weak, #f0f3f5);
}

.benefit-unit {
  position: relative;
  display: block;
  background-color: #ffffff;
  border-radius: 10px;
  width: 100%;
  height: 100%;
}
.benefit-unit.active {
  border-color: transparent;
  position: relative;
  z-index: 0;
  border: 1px solid var(--color-gradient-red-basic, rgba(251, 24, 34, 0.4));
}
.benefit-unit[data-dot=true] .benefit-unit__icon::after {
  content: "";
  position: absolute;
  top: 0px;
  right: -3px;
  width: 6px;
  height: 6px;
  border-radius: 100%;
  background-color: var(--color-bg-brand-solid, #fb1822);
  z-index: 5;
}
.benefit-unit__content {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
  justify-content: flex-start;
  overflow: hidden;
  padding: 16px;
  position: relative;
  width: 100%;
  height: 100%;
}
.benefit-unit__icon {
  position: relative;
  width: 28px;
  height: 28px;
  flex-shrink: 0;
}
.benefit-unit__icon img {
  width: 100%;
}
.benefit-unit__icon-shape {
  position: absolute;
  inset: 0;
  overflow: hidden;
}
.benefit-unit__icon-shape img {
  width: 100%;
}
.benefit-unit__icon-inner {
  width: 100%;
  height: 100%;
}
.benefit-unit__icon-inner svg,
.benefit-unit__icon-inner img {
  display: block;
  max-width: none;
  width: 100%;
  height: 100%;
}
.benefit-unit__text-container {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: flex-start;
  justify-content: flex-start;
  position: relative;
  flex-shrink: 0;
  width: 100%;
}
.benefit-unit__text-wrapper {
  display: flex;
  gap: 4px;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  position: relative;
  flex-shrink: 0;
  width: 100%;
}
.benefit-unit__title {
  font-size: var(--font-title-2-size, 1rem);
  font-weight: var(--font-title-2-sb-weight, 600);
  line-height: var(--font-title-2-line-height, 1.4);
  letter-spacing: var(--font-title-2-letter-spacing, -0.005em);
  color: var(--color-fg-neutral-solid, #222832);
  position: relative;
  flex-shrink: 0;
  width: 100%;
  line-height: 1.4;
  margin: 0;
  word-break: break-all;
  position: relative;
  width: fit-content;
  display: block;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.benefit-unit__title span {
  position: relative;
}
.benefit-unit__txt {
  color: var(--color-fg-neutral-subtle, #5f646c);
  width: 100%;
  word-break: break-all;
  font-size: var(--font-caption-3-size, 0.75rem);
  font-weight: var(--font-caption-3-r-weight, 400);
  line-height: var(--font-caption-3-line-height, 1.4);
  letter-spacing: var(--font-caption-3-letter-spacing, -0.005em);
  display: block;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.benefit-unit__border {
  position: absolute;
  border: 1px solid var(--color-border-neutral-weak, #f0f3f5);
  inset: 0;
  pointer-events: none;
  border-radius: 10px;
}
.benefit-unit .point__label {
  position: absolute;
  display: none;
  top: -6px;
  right: 8px;
  z-index: 5;
}
.benefit-unit .point__label.active {
  display: flex;
}

/*-----------------------------*/
/*  혜택 :: 혜택홈 전용 스타일 */
/*-----------------------------*/
#benefit {
  max-width: 761px;
  margin: 0 auto;
}
#benefit .tab-component .container,
#benefit #bottomNavigation .container {
  background-color: var(--color-fg-neutral-inverted, #ffffff);
}
#benefit .container {
  background: none;
}
#benefit .container.bottom-sheet {
  background-color: #fff;
}
#benefit .benefit__charge .main-quick-menu__list {
  padding-top: 0;
}
#benefit .list-component .list-component__tit {
  font-weight: 600;
}
#benefit .benefit__section:not(.benefit-main__service) .list-component .list-component__info {
  flex: none;
  width: calc(100% - 65px - 16px);
}
#benefit .benefit__section:not(.benefit-main__service) .list-component .list-component__info .list-component__content {
  min-width: 0;
  width: calc(100% - 44px - 16px);
}
#benefit .benefit__section:not(.benefit-main__service) .list-component .list-component__info .list-component__tit {
  display: block;
  word-break: keep-all;
  overflow-wrap: break-word;
  max-width: 100%;
}
#benefit .benefit__section:not(.benefit-main__service) .list-component .list-component__btn, #benefit .benefit__section:not(.benefit-main__service) .list-component .list-component__option {
  min-width: 78px;
  display: flex;
  justify-content: flex-end;
}
#benefit .benefit__section:not(.benefit-main__service) .list-component:has(.list-component__btn, .list-component__option) .list-component__info {
  width: calc(100% - 78px - 16px);
}

/*-----------------------------*/
/*  혜택 :: 개별 섹션 스타일 */
/*-----------------------------*/
/*퀵 메뉴 스타일*/
.benefit__quick-button__swiper .swiper-slide {
  height: auto;
  margin-right: 10px;
}
.benefit__quick-button__swiper .swiper-slide .quick-button__card__item {
  height: 100%;
}
.benefit__quick-button__swiper .swiper-slide .quick-button__card__tit-box {
  align-items: flex-start;
}
.benefit__quick-button__swiper .swiper-slide .quick-button__card__tit {
  display: block;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}
.benefit__quick-button__swiper .swiper-slide .quick-button__card__icon {
  flex-shrink: 0;
}

/* 만보걷기 컴포넌트 */
.benefit-walking {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 12px 20px;
  background: var(--color-gradient-special-banner, linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #FFF 80%), linear-gradient(90deg, #FFF7EF 0%, #F5E5F7 100%));
  border: 1px solid var(--color-border-neutral-inverted, #ffffff);
  border-radius: 16px;
}
.benefit-walking__content {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}
.benefit-walking .title {
  flex: 1;
  font-size: var(--font-title-2-size, 1rem);
  font-weight: var(--font-title-2-sb-weight, 600);
  line-height: var(--font-title-2-line-height, 1.4);
  letter-spacing: var(--font-title-2-letter-spacing, -0.005em);
}
.benefit-walking[data-login=true] .title {
  display: flex;
  gap: 2px;
  align-items: flex-end;
  flex: 1;
}
.benefit-walking[data-login=true] .title > * {
  display: block;
}
.benefit-walking[data-login=true] .title .value {
  font-size: var(--font-heading-1-size, 2rem);
  font-weight: var(--font-heading-1-weight, 600);
  line-height: var(--font-heading-1-line-height, 1.4);
  letter-spacing: var(--font-heading-1-letter-spacing, -0.005em);
  font-weight: 700;
  line-height: 1em;
}
.benefit-walking[data-login=true] .title .unit {
  font-size: var(--font-body-3-size, 0.875rem);
  font-weight: var(--font-body-3-m-weight, 500);
  line-height: var(--font-body-3-line-height, 1.5);
  letter-spacing: var(--font-body-3-letter-spacing, -0.005em);
  color: var(--color-fg-neutral-subtle, #5f646c);
}
.benefit-walking .date {
  font-size: var(--font-title-3-size, 0.875rem);
  font-weight: var(--font-title-3-weight, 600);
  line-height: var(--font-title-3-line-height, 1.4);
  letter-spacing: var(--font-title-3-letter-spacing, -0.005em);
  color: var(--color-fg-neutral-subtle, #5f646c);
  margin-bottom: 2px;
}
.benefit-walking .img-wrap {
  width: 64px;
  height: 64px;
  aspect-ratio: 1/1;
}
.benefit-walking .img-wrap canvas {
  width: 100%;
  height: 100%;
}

.banner-band:has(> .tooltip) {
  z-index: 10;
}
.banner-band .tooltip.benefit-main {
  position: absolute;
  right: 14px;
  top: -16px;
}

/*엘포인트 앱(APP) 전용 혜택*/
.app-benefit__box-wrap {
  display: flex;
  gap: 10px;
}
.app-benefit__box-wrap .swiper-container {
  width: 100%;
}
.app-benefit__box-wrap .swiper-container .swiper-slide {
  width: auto;
  margin-right: 8px;
}
.app-benefit__box {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
  justify-content: center;
  background-color: var(--color-fg-neutral-inverted, #ffffff);
  text-align: center;
  width: 170px;
  border: 1px solid var(--color-bg-neutral-weak);
}
.app-benefit__content {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.app-benefit__content .title {
  font-size: var(--font-title-2-size, 1rem);
  font-weight: var(--font-title-2-sb-weight, 600);
  line-height: var(--font-title-2-line-height, 1.4);
  letter-spacing: var(--font-title-2-letter-spacing, -0.005em);
}
.app-benefit__content .desc {
  font-size: var(--font-caption-2-size, 0.8125rem);
  font-weight: var(--font-caption-2-r-weight, 400);
  line-height: var(--font-caption-2-line-height, 1.4);
  letter-spacing: var(--font-caption-2-letter-spacing, -0.005em);
  color: var(--color-fg-neutral-subtle, #5f646c);
}

/* 가장 많이 본 인기 혜택*/
.benefit__card__swiper .swiper-slide {
  width: 120px;
  height: initial;
  margin-right: 10px;
}
.benefit__card__swiper .swiper-slide .benefit-unit__title,
.benefit__card__swiper .swiper-slide .benefit-unit__txt {
  word-break: inherit;
}

/* 엘포인트 전용 혜택  */
.benefit-all-card__inner {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.benefit-all-card__inner > * {
  min-height: 130px;
}

/*고향 사랑 기부*/
.benefit-hometown {
  padding: 12px 20px 20px;
}
.benefit-hometown__title-wrap {
  display: flex;
  justify-content: space-between;
}
.benefit-hometown__title-wrap .title-component {
  flex-grow: 1;
  flex-shrink: 1;
  padding-bottom: 24px;
  padding-top: 8px;
}
.benefit-hometown__title-wrap .img-wrap {
  width: 79px;
  height: 79px;
  max-width: 79px;
  flex-shrink: 1;
}
.benefit-hometown__title-wrap img {
  width: 100%;
  height: auto;
  aspect-ratio: 1/1;
}

/*포인트 충전소*/
.benefit__charge {
  margin-bottom: 16px;
}
.benefit__charge .swiper-slide {
  height: auto;
}
.benefit__charge .benefit__charge-box {
  background-color: var(--color-bg-neutral-inverted, #ffffff);
  border-radius: 16px;
  padding: 20px;
  overflow: hidden;
}
.benefit__charge .benefit__charge-list {
  display: flex;
  flex-wrap: wrap;
  gap: 16px 8px;
  width: 100%;
}
.benefit__charge .benefit__charge-list > * {
  width: calc((100% - 24px) / 4);
  flex-grow: calc(25% - 4px);
}
.benefit__charge .benefit__charge-list > * .element__quick-menu {
  width: 100%;
}
.benefit__charge .benefit__charge-list > * .element__quick-menu__tit {
  width: 100%;
  text-align: center;
  word-break: break-all;
}
.benefit__charge .benefit__charge-list > * .element__quick-menu__img {
  max-width: 64px;
  max-height: 64px;
  width: 100%;
  height: 100%;
}
.benefit__charge .benefit__charge-list > * .element__quick-menu__img img,
.benefit__charge .benefit__charge-list > * .element__quick-menu__img .element__thumb {
  max-width: 64px;
  max-height: 64px;
  width: 100%;
  height: 100%;
  aspect-ratio: 1/1;
  object-fit: contain;
  background-color: var(--color-bg-neutral-weak, #f0f3f5);
}
.benefit__charge .benefit__charge-list > * .element__quick-menu__img img::before,
.benefit__charge .benefit__charge-list > * .element__quick-menu__img .element__thumb::before {
  display: none;
}
.benefit__charge .benefit__charge-carousel {
  margin-top: 16px;
}

/* 오늘의 상품추천 */
.benefit-recommend__label {
  position: absolute;
  top: -6px;
  right: 8px;
}
.benefit-recommend__title-wrap .title-component__content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
}
.benefit-recommend__list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px 10px;
}
.benefit-recommend__list.column-1 {
  grid-template-columns: 1fr;
}
.benefit-recommend__list .txt-product__info-tit {
  font-size: var(--font-caption-1-size, 0.875rem);
  font-weight: var(--font-caption-1-m-weight, 500);
  line-height: var(--font-caption-1-line-height, 1.4);
  letter-spacing: var(--font-caption-1-letter-spacing, -0.005em);
}

/*금융서비스*/
.benefit-main__service {
  background: var(--color-bg-neutral-weak, #f0f3f5);
}
.benefit-main__service .list-component__inner.banner-wrap {
  border: 1px solid var(--color-border-neutral-line, rgba(0, 0, 0, 0.08));
  border-bottom: none;
  border-top-left-radius: 16px;
  border-top-right-radius: 16px;
}
.benefit-main__service .__content {
  background-color: var(--color-bg-neutral-inverted, #ffffff);
  border-radius: 16px;
  border: 1px solid var(--color-border-neutral-line, rgba(0, 0, 0, 0.08));
}
.benefit-main__service .__content .banner .banner-item {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.benefit-main__service .__content .banner-default__item {
  border-bottom-left-radius: 0px;
  border-bottom-right-radius: 0px;
}
.benefit-main__service .__content .list-component-wrap {
  padding: 12px 20px;
}
.benefit-main__service .__content .list-component-wrap .list-component {
  padding-top: 12px;
  padding-bottom: 12px;
}

/* 공통 포인트 팝업 */
.bf-point-popup {
  position: relative;
}
.bf-point-popup__img-container {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: -1;
}
.bf-point-popup__img-container img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.bf-point-popup__tit-box {
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 90% 0 24px;
}
.bf-point-popup__red-txt {
  color: var(--color-fg-brand-solid, #fb1822);
}
.bf-point-popup__tit-info {
  color: var(--color-fg-neutral-muted, #6A6F77);
}
.bf-point-popup__more-btn {
  max-width: 1024px;
  margin: 0 auto;
}
@media (max-width: 768px) {
  .bf-point-popup__more-btn {
    padding: 15px;
  }
}

/* 혜택 - 포춘 광고 하우스배너 */
.bf-fortune__banner[data-type=network] .banner-network__img {
  background: #F3F3F3;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 780/176;
}
.bf-fortune__banner[data-type=network] .banner-network__img img {
  width: auto;
  height: 100%;
}

/*바텀 시트*/
.mw-go-app .container {
  background-color: var(--color-bg-neutral-inverted, #ffffff) !important;
}

/*-----------------------------*/
/*    혜택 :: 게임    */
/*-----------------------------*/
#benefitGame {
  max-width: 761px;
  margin: 0 auto;
}
#benefitGame .tab-component .container {
  background-color: var(--color-fg-neutral-inverted, #ffffff);
  border-bottom: 1px solid var(--color-border-neutral-line, rgba(0, 0, 0, 0.08));
}
#benefitGame .container:not(.bf-top__tab .container) {
  background: none;
  overflow: hidden;
}
#benefitGame #bottomNavigation .container {
  background: var(--color-bg-neutral-inverted, #ffffff);
}
#benefitGame .bf-game__top {
  background-color: var(--color-bg-neutral-inverted, #ffffff);
  border-radius: 16px;
  overflow: hidden;
}
#benefitGame .bf-game__top .img-wrap {
  display: block;
  width: 100%;
  height: auto;
}
#benefitGame .bf-game__top .img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
#benefitGame .bf-game__top .bf-game__quick-menu {
  display: flex;
  justify-content: space-evenly;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  padding: 16px;
  overflow-x: auto;
}
@media screen and (max-width: 380px) {
  #benefitGame .bf-game__top .bf-game__quick-menu {
    gap: 8px 0px;
  }
  #benefitGame .bf-game__top .bf-game__quick-menu > * {
    width: 50%;
  }
}
#benefitGame .bf-game__top .bf-game__quick-menu::-webkit-scrollbar {
  display: none;
}
#benefitGame .bf-game__top .bf-game__quick-menu__item {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 6px;
}
#benefitGame .bf-game__hot .list-component__arrow {
  color: var(--color-icon-neutral-muted-weak, #c8cccf);
}
#benefitGame .bf-unit-contents {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}
#benefitGame .bf-unit-contents[data-type=vertical] {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
#benefitGame .bf-unit-contents__box {
  display: flex;
  flex-direction: column;
}
#benefitGame .bf-unit-contents__box__title {
  font-size: var(--font-title-2-size, 1rem);
  font-weight: var(--font-title-2-sb-weight, 600);
  line-height: var(--font-title-2-line-height, 1.4);
  letter-spacing: var(--font-title-2-letter-spacing, -0.005em);
}
#benefitGame .bf-unit-contents__img-wrap {
  border-radius: 10px;
  overflow: hidden;
  flex-shrink: 0;
  aspect-ratio: 85/57;
}
#benefitGame .bf-unit-contents__img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
#benefitGame .bf-unit-contents__swiper-container {
  width: 100%;
  display: flex;
}

/*-----------------------------*/
/*    혜택 :: 적립 허니   */
/*-----------------------------*/
/* 적립 허니 전환하기 스타일링 */
.benefit-point-convert__gray-box {
  background-color: var(--color-bg-neutral-weak, #f0f3f5);
  border-radius: 12px;
  padding: 20px;
}
.benefit-point-convert__contents {
  display: flex;
  justify-content: center;
  gap: 24px;
  padding: 12px 0;
}
.benefit-point-convert__item {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
}
.benefit-point-convert__rate-icon {
  display: flex;
  padding-top: 32px;
}
.benefit-point-convert__rate-icon i {
  width: 18px;
  height: 18px;
}
.benefit-point-convert__rate-icon i svg {
  width: 100%;
  height: 100%;
}
.benefit-point-convert__rate-icon i:nth-child(1) svg {
  color: #cbcdcf;
}
.benefit-point-convert__rate-icon i:nth-child(2) svg {
  color: var(--color-red-300);
}
.benefit-point-convert__rate-icon i:nth-child(3) svg {
  color: var(--color-red-600);
}
.benefit-point-convert__points {
  padding-top: 10px;
  font-size: var(--font-title-1-size, 1.125rem);
  font-weight: var(--font-title-1-sb-weight, 600);
  line-height: var(--font-title-1-line-height, 1.4);
  letter-spacing: var(--font-title-1-letter-spacing, -0.005em);
}
.benefit-point-convert__text {
  text-align: center;
  font-size: var(--font-body-3-size, 0.875rem);
  font-weight: var(--font-body-3-m-weight, 500);
  line-height: var(--font-body-3-line-height, 1.5);
  letter-spacing: var(--font-body-3-letter-spacing, -0.005em);
}

/* 적립 허니 추천 상품 스타일링 */
.save-honey-recommended-product {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* 적립 허니 안내 팝업 스타일링 */
.save-honey-change-popup .btn {
  width: fit-content;
}
.save-honey-change-popup .full-popup .title-component[data-size=l] {
  margin-bottom: 0;
}

/* 적립 허니 적립 완료 스타일링 */
.save-honey-change-complete .title-component[data-size=xs] {
  padding-bottom: 10px;
}

/*-----------------------------*/
/*    혜택 :: 매일,광고적립    */
/*-----------------------------*/
.saving-daily__item-list {
  border-radius: 16px;
  background-color: var(--color-bg-neutral-inverted, #ffffff);
  padding: 16px;
}
.saving-daily__item-list .list-component__content .list-component__tit {
  display: flex;
  align-items: center;
  gap: 4px;
}
.saving-daily__item-list .list-component__content .label {
  padding: 2px 3px 1px;
  font-size: 8px;
  font-weight: 600;
  line-height: 140%;
  letter-spacing: -0.04px;
}
.saving-daily__national-item-list .list-component__content .list-component__tit, .saving-daily__lpoint-item-list .list-component__content .list-component__tit {
  display: flex;
  align-items: center;
  gap: 4px;
}
.saving-daily__national-item-list .list-component__content .label, .saving-daily__lpoint-item-list .list-component__content .label {
  padding: 2px 3px 1px;
  font-size: 8px;
  font-weight: 600;
  line-height: 140%;
  letter-spacing: -0.04px;
}
.saving-daily__accent {
  color: var(--color-fg-accent-red-solid-800, #ae060d);
  font-weight: 500;
}
.saving-daily__list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px 8px;
}
.saving-daily__list[data-columns="4"] {
  grid-template-columns: repeat(4, 1fr);
}
.saving-daily__list li {
  position: relative;
}
.saving-daily__list li .tooltip {
  position: absolute;
  top: 4px;
  left: 50%;
  transform: translate(-50%, -100%);
}

.saving-national .list-component__content .list-component__tit {
  display: flex;
  align-items: center;
  gap: 4px;
}
.saving-national .list-component__content .label {
  padding: 2px 3px 1px;
  font-size: 8px;
  font-weight: 600;
  line-height: 140%;
  letter-spacing: -0.04px;
}

.saving-monthly .unit-list__point {
  gap: 20px;
  padding: 20px;
  background-color: var(--color-bg-neutral-inverted, #ffffff);
  border: 1px solid var(--color-border-neutral-line, rgba(0, 0, 0, 0.08));
  border-radius: 16px;
}
.saving-monthly__unit-list-content {
  display: flex;
  align-items: center;
}
.saving-monthly__unit-list-content .element-list-text {
  flex-direction: column;
  flex: 1;
}
.saving-monthly__unit-list-divider {
  width: 1px;
  height: 24px;
  margin: 0 8px;
  background-color: var(--color-bg-neutral-muted-weak, #dee1e4);
}
.saving-monthly__brand-list .swiper-slide {
  width: fit-content;
}
.saving-monthly__brand-list .element__quick-menu__img {
  padding: 0;
  height: 64px;
}
.saving-monthly__point-banner {
  border-radius: 16px;
  border: 1px solid var(--color-border-neutral-inverted, #ffffff);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #FFF 80%), linear-gradient(90deg, #FFF7EF 0%, #F5E5F7 100%);
  display: flex;
  gap: 8px;
  padding: 8px 20px;
}
.saving-monthly__point-banner .btn {
  width: fit-content;
}
.saving-monthly__point-banner-content {
  padding: 8px 0;
  flex: 1;
}
.saving-monthly__point-banner-title {
  color: var(--color-fg-neutral-solid, #222832);
  margin-bottom: 8px;
}
.saving-monthly__point-banner-img {
  width: 83px;
  height: 83px;
}
.saving-monthly__point-banner-img svg {
  width: 100%;
  height: 100%;
}
.saving-monthly__view-more-button {
  margin-top: 20px;
}

.saving-ad .unit-partner {
  background-color: var(--color-bg-neutral-inverted, #ffffff);
  border: 1px solid #E7E9EA;
}
.saving-ad .unit-list__point {
  gap: 20px;
  padding: 20px;
  background-color: var(--color-bg-neutral-inverted, #ffffff);
  border: 1px solid var(--color-border-neutral-line, rgba(0, 0, 0, 0.08));
  border-radius: 16px;
}
.saving-ad__unit-list-content {
  display: flex;
  align-items: center;
}
.saving-ad__unit-list-content .element-list-text {
  flex: 1;
}
.saving-ad__unit-list-divider {
  width: 1px;
  height: 24px;
  margin: 0 8px;
  background-color: var(--color-bg-neutral-muted-weak, #dee1e4);
}
.saving-ad__brand-list .swiper-slide {
  width: fit-content;
}
.saving-ad__brand-list .element__quick-menu__img {
  padding: 0;
  height: 64px;
}
.saving-ad__point-banner {
  border-radius: 16px;
  border: 1px solid var(--color-border-neutral-inverted, #ffffff);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #FFF 80%), linear-gradient(90deg, #FFF7EF 0%, #F5E5F7 100%);
  display: flex;
  gap: 8px;
  padding: 8px 20px;
}
.saving-ad__point-banner .btn {
  width: fit-content;
}
.saving-ad__point-banner-content {
  padding: 8px 0;
  flex: 1;
}
.saving-ad__point-banner-title {
  color: var(--color-fg-neutral-solid, #222832);
}
.saving-ad__view-more-button {
  margin-top: 20px;
}

/* 게임 메인 */
.gradient-bg.lp-game {
  position: absolute;
  z-index: 0;
}

.lp-game-index .banner-band .banner-band__title--sub {
  font-size: var(--font-caption-1-size, 0.875rem);
  font-weight: var(--font-caption-1-r-weight, 400);
  line-height: var(--font-caption-1-line-height, 1.4);
  letter-spacing: var(--font-caption-1-letter-spacing, -0.005em);
}
.lp-game-index .title-component .title-component__text {
  margin-top: 0;
  margin-bottom: 8px;
}
.lp-game-index__content-wrap {
  position: relative;
}
@media screen and (max-height: 600px) {
  .lp-game-index__content-wrap {
    overflow-y: auto;
    overflow-x: hidden;
  }
}
.lp-game-index__content {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  max-width: 485px;
  width: 68.6%;
  padding: 20px 0;
  opacity: 0;
}
.lp-game-index__content.loaded {
  opacity: 1;
}
.lp-game-index__content:has(canvas.lp-game-index__kv__canvas) {
  padding-top: 0;
  width: 100%;
  overflow: visible;
}
.lp-game-index__content:has(canvas.lp-game-index__kv__canvas) .lp-game-index__kv-wrap {
  overflow: visible;
}
.lp-game-index__content:has(canvas.lp-game-index__kv__canvas) canvas {
  width: 100%;
  min-width: 120px;
  max-width: inherit;
  height: auto;
  object-fit: contain;
}
.lp-game-index__kv-wrap {
  width: 100%;
  height: 100%;
  margin: 0 auto;
  overflow: hidden;
}
.lp-game-index__kv-wrap img {
  width: 100%;
  height: 100%;
  min-width: 120px;
  min-height: 120px;
  aspect-ratio: 1/1;
  object-fit: contain;
}
.lp-game-index__kv__canvas {
  width: calc(100% + 60px) !important;
  height: auto !important;
  margin: 48px -30px 0 -30px;
}
@media screen and (max-height: 700px) {
  .lp-game-index__kv__canvas {
    margin-top: 0;
  }
}
.lp-game-index__kv__desc {
  font-size: var(--font-title-2-size, 1rem);
  font-weight: var(--font-title-2-m-weight, 500);
  line-height: var(--font-title-2-line-height, 1.4);
  letter-spacing: var(--font-title-2-letter-spacing, -0.005em);
  color: var(--color-fg-neutral-subtle, #5f646c);
  text-align: center;
  margin-top: 8px;
}
.lp-game-index__bottom-button .tooltip {
  position: absolute;
  top: 10px;
  left: 50%;
  transform: translateX(-50%);
}
.lp-game-index #dotlottie-canvas {
  width: 100%;
  height: 100%;
  aspect-ratio: 1/1;
  object-fit: contain;
}

/* 게임 메인 : 광고 보고 온 후 페이지 */
.lp-game-index__point__title {
  padding-top: 48px;
}

/* 게임 페이지 */
.lp-game-board .full-container {
  height: 100%;
  min-height: calc(100dvh - 54px - var(--bottom-banner-height, 0));
  overflow: hidden;
}
.lp-game-board .state-intro {
  transition: opacity 1s ease-in-out, visibility 1s 1s;
  opacity: 1;
  visibility: visible;
}
.lp-game-board .state-result {
  display: none;
  visibility: hidden;
}
.lp-game-board[data-game-state=playing] .state-intro {
  opacity: 0;
  visibility: hidden;
}
.lp-game-board[data-game-state=playing] .state-result {
  display: block;
  opacity: 0;
}
.lp-game-board[data-game-state=result] .state-intro {
  opacity: 0;
  display: none;
}
.lp-game-board[data-game-state=result] .state-result {
  transition: opacity 1s ease-in-out;
  display: block;
  visibility: visible;
  opacity: 1;
}
.lp-game-board__content-wrap {
  position: absolute;
  top: 272px;
  left: 50%;
  transform: translate(-50%, 0);
  width: 100%;
  background-color: transparent;
}
.lp-game-board__content-wrap .tooltip {
  position: absolute;
  top: -20px;
  left: 50%;
  transform: translate(-50%, -100%);
}
.lp-game-board__card-wrap {
  position: relative;
  display: flex;
  justify-content: center;
  gap: 12px;
}
.lp-game-board__card {
  position: relative;
  width: 100%;
  height: auto;
  aspect-ratio: 104/132;
  max-width: 104px;
  max-height: 132px;
  border-radius: 12px;
  transform-style: preserve-3d;
  backface-visibility: hidden;
  transition: 0.5s ease-in;
}
.lp-game-board__card.flipped {
  transform: rotateY(180deg);
}
.lp-game-board__card .card__inner {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
  backface-visibility: hidden;
}
.lp-game-board__card .card__inner.front svg {
  width: 57.6923%;
  height: auto;
}
.lp-game-board__card .card__inner.back {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 12px;
  background-color: #fff;
  transform: rotateY(180deg);
  overflow: hidden;
  background-size: 100% 100%;
  background-position: center;
  background-repeat: no-repeat;
}
.lp-game-board__card .card__inner.back[data-type="0"] {
  background-image: url("data:image/svg+xml,%3Csvg width='100' height='128' viewBox='0 0 100 128' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_3231_187311)'%3E%3Cpath d='M90.8999 0H9.10014C4.07427 0 0 4.10879 0 9.17724V118.823C0 123.891 4.07427 128 9.10014 128H90.8999C95.9257 128 100 123.891 100 118.823V9.17724C100 4.10879 95.9257 0 90.8999 0Z' fill='%238CEAC0'/%3E%3Cpath d='M89.2951 123.924H10.7048C6.9165 123.924 3.83911 120.82 3.83911 117V10.9903C3.83911 7.16987 6.9165 4.06641 10.7048 4.06641H89.2951C93.0835 4.06641 96.1609 7.16987 96.1609 10.9903V117C96.1609 120.82 93.0835 123.924 89.2951 123.924ZM10.7048 6.07393C8.0134 6.07393 5.82977 8.27606 5.82977 10.9903V117C5.82977 119.714 8.0134 121.916 10.7048 121.916H89.2951C91.9866 121.916 94.1702 119.714 94.1702 117V10.9903C94.1702 8.27606 91.9866 6.07393 89.2951 6.07393H10.7048Z' fill='%2347D18F'/%3E%3Cpath d='M68.2206 45.6188C63.1831 40.5385 55.0275 40.5385 49.9899 45.6188C44.9523 40.5385 36.7967 40.5385 31.7591 45.6188C26.7216 50.699 26.7216 58.9237 31.7591 64.004C26.7216 69.0843 26.7216 77.309 31.7591 82.3892C36.7967 87.4695 44.9523 87.4695 49.9899 82.3892C55.0275 87.4592 63.1831 87.4592 68.2206 82.3892C73.2582 77.309 73.2582 69.0843 68.2206 64.004C73.2582 58.9237 73.2582 50.699 68.2206 45.6188Z' fill='%2355D896'/%3E%3Cpath d='M59.1103 41.8091C62.4112 41.8091 65.7019 43.0791 68.2206 45.6193C73.2582 50.6995 73.2582 58.9242 68.2206 64.0045C73.2582 69.0847 73.2582 77.3094 68.2206 82.3897C65.7019 84.9298 62.401 86.1999 59.1103 86.1999C55.8197 86.1999 52.5188 84.9298 50 82.3897C47.4813 84.9298 44.1906 86.1999 40.8897 86.1999C37.5889 86.1999 34.2881 84.9298 31.7795 82.3897C26.7419 77.3094 26.7419 69.0847 31.7795 64.0045C26.7419 58.9242 26.7419 50.6995 31.7795 45.6193C34.2982 43.0791 37.5991 41.8091 40.8897 41.8091C44.1804 41.8091 47.4813 43.0791 50 45.6193C52.5188 43.0791 55.8197 41.8091 59.1103 41.8091ZM59.1103 38.7363C55.7994 38.7363 52.6509 39.7503 50 41.6145C47.3492 39.7401 44.1906 38.7363 40.8897 38.7363C36.6342 38.7363 32.6326 40.4058 29.6263 43.4479C26.62 46.4796 24.9543 50.5152 24.9543 54.8067C24.9543 58.1458 25.9598 61.3209 27.8083 63.9942C25.9497 66.6675 24.9543 69.8529 24.9543 73.1817C24.9543 77.4733 26.6098 81.5088 29.6263 84.5406C32.6326 87.5724 36.6342 89.2521 40.8897 89.2521C44.2007 89.2521 47.3492 88.2484 50 86.374C52.6509 88.2484 55.8095 89.2521 59.1103 89.2521C63.3659 89.2521 67.3675 87.5826 70.3738 84.5406C73.3801 81.5088 75.0458 77.4733 75.0458 73.1817C75.0458 69.8427 74.0403 66.6675 72.1918 63.9942C74.0504 61.3209 75.0458 58.1355 75.0458 54.8067C75.0458 50.5152 73.3903 46.4796 70.3738 43.4479C67.3675 40.4161 63.3659 38.7363 59.1103 38.7363Z' fill='white'/%3E%3Cpath d='M67.1949 79.3176C62.4519 84.1009 54.7533 84.1009 50.0001 79.3176C45.2571 84.1009 37.5585 84.1009 32.8053 79.3176C29.2302 75.7123 28.3466 70.4272 30.1545 65.9922C26.813 71.0417 27.3513 77.9247 31.7694 82.3801C36.8069 87.4604 44.9625 87.4604 50.0001 82.3801C55.0377 87.4501 63.1933 87.4501 68.2309 82.3801C72.6489 77.9247 73.1872 71.0417 69.8457 65.9922C71.6536 70.4272 70.77 75.7123 67.1949 79.3176Z' fill='%2330C479'/%3E%3Cpath d='M32.6325 44.832C32.338 45.0779 32.0536 45.3339 31.7794 45.6105C26.7418 50.6907 26.7418 58.9154 31.7794 63.9957L33.1607 62.828C27.3614 58.516 28.0825 49.6357 32.6427 44.832H32.6325Z' fill='%2330C479'/%3E%3Cpath d='M67.3675 44.832C67.662 45.0779 67.9464 45.3339 68.2206 45.6105C73.2582 50.6907 73.2582 58.9154 68.2206 63.9957L66.8394 62.828C72.6387 58.516 71.9176 49.6357 67.3573 44.832H67.3675Z' fill='%2330C479'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_3231_187311'%3E%3Crect width='100' height='128' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
}
.lp-game-board__card .card__inner.back[data-type="1"] {
  background-image: url("data:image/svg+xml,%3Csvg width='100' height='128' viewBox='0 0 100 128' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_3231_187312)'%3E%3Cpath d='M90.8999 0H9.10014C4.07427 0 0 4.10879 0 9.17724V118.823C0 123.891 4.07427 128 9.10014 128H90.8999C95.9257 128 100 123.891 100 118.823V9.17724C100 4.10879 95.9257 0 90.8999 0Z' fill='%23FFE75A'/%3E%3Cpath d='M89.2951 123.924H10.7048C6.9165 123.924 3.83911 120.82 3.83911 117V10.9903C3.83911 7.16987 6.9165 4.06641 10.7048 4.06641H89.2951C93.0835 4.06641 96.1609 7.16987 96.1609 10.9903V117C96.1609 120.82 93.0835 123.924 89.2951 123.924ZM10.7048 6.07393C8.0134 6.07393 5.82977 8.27606 5.82977 10.9903V117C5.82977 119.714 8.0134 121.916 10.7048 121.916H89.2951C91.9866 121.916 94.1702 119.714 94.1702 117V10.9903C94.1702 8.27606 91.9866 6.07393 89.2951 6.07393H10.7048Z' fill='%23FFF6CA'/%3E%3Cpath d='M55.129 44.5544L58.7142 50.0649C59.5166 51.3042 60.7455 52.2056 62.1674 52.5948L68.4644 54.3257C72.6488 55.4729 74.2942 60.5839 71.5824 63.9946L67.4995 69.1261C66.5753 70.2835 66.1081 71.7379 66.1792 73.2231L66.494 79.7987C66.6972 84.1723 62.401 87.327 58.3384 85.7803L52.2344 83.4451C50.8633 82.9227 49.3399 82.9227 47.9687 83.4451L41.8647 85.7803C37.8022 87.327 33.4959 84.1723 33.7091 79.809L34.024 73.2333C34.0951 71.7482 33.6279 70.2937 32.7037 69.1363L28.6208 64.0049C27.5036 62.6017 24.7106 56.2718 31.7388 54.336L38.0358 52.605C39.4577 52.2158 40.6866 51.3145 41.489 50.0751L45.0742 44.5647C47.4508 40.9081 52.7727 40.9081 55.1595 44.5647L55.129 44.5544Z' fill='%23FFD13E'/%3E%3Cpath d='M50.0812 41.8091C52.0109 41.8091 53.9304 42.7206 55.1187 44.554L58.704 50.0645C59.5063 51.3038 60.7352 52.2052 62.1571 52.5944L68.4541 54.3253C72.6385 55.4725 74.2839 60.5835 71.5721 63.9942L67.4892 69.1257C66.565 70.2831 66.0978 71.7375 66.1689 73.2227L66.4838 79.7983C66.6564 83.4037 63.7618 86.1794 60.4712 86.1794C59.7704 86.1794 59.0391 86.0565 58.3282 85.7799L52.2242 83.4447C51.5335 83.1784 50.8124 83.0554 50.0913 83.0554C49.3702 83.0554 48.639 83.1886 47.9585 83.4447L41.8545 85.7799C41.1435 86.0565 40.4123 86.1794 39.7115 86.1794C36.4208 86.1794 33.5262 83.4037 33.6989 79.7983L34.0137 73.2227C34.0848 71.7375 33.6176 70.2831 32.6934 69.1257L28.6105 63.9942C27.4933 62.591 24.7003 56.2612 31.7285 54.3253L38.0255 52.5944C39.4474 52.2052 40.6763 51.3038 41.4787 50.0645L45.0639 44.554C46.2522 42.7206 48.1819 41.8091 50.1015 41.8091M50.0812 38.7363C47.0139 38.7363 44.1701 40.2829 42.4943 42.8743L38.9091 48.3847C38.513 48.9993 37.9036 49.4397 37.2028 49.6343L30.9059 51.3653C26.6605 52.5329 25.0456 55.0423 24.4362 56.9372C23.1667 60.8805 25.2894 64.7624 26.2136 65.9301L30.2965 71.0615C30.7535 71.6351 30.9871 72.3521 30.9465 73.0895L30.6316 79.6652C30.5098 82.1951 31.3934 84.5816 33.12 86.4047C34.8364 88.2176 37.2333 89.2624 39.6912 89.2624C40.788 89.2624 41.8748 89.0575 42.9107 88.6581L49.0147 86.3228C49.3499 86.1896 49.7054 86.1282 50.071 86.1282C50.4366 86.1282 50.7921 86.1896 51.1273 86.3228L57.2313 88.6581C58.2774 89.0575 59.354 89.2624 60.4509 89.2624C62.9087 89.2624 65.3056 88.2176 67.022 86.4047C68.7486 84.5816 69.6221 82.1848 69.5104 79.6652L69.1955 73.0895C69.1651 72.3521 69.3885 71.6351 69.8455 71.0615L73.9284 65.9301C75.848 63.5128 76.4269 60.3172 75.4823 57.3776C74.5378 54.438 72.2018 52.1949 69.2361 51.3755L62.9392 49.6445C62.2384 49.4499 61.629 49.0095 61.2329 48.395L57.6477 42.8845C55.9617 40.2932 53.1281 38.7466 50.0608 38.7466L50.0812 38.7363Z' fill='white'/%3E%3Cpath d='M70.8715 55.6465C71.9075 57.5721 71.8465 60.0507 70.3231 61.9763L66.4636 66.821C65.5902 67.9169 65.1534 69.2894 65.2144 70.6824L65.5089 76.8893C65.7019 81.0171 61.6393 83.9874 57.8104 82.5227L52.0517 80.3206C50.7517 79.8289 49.3196 79.8289 48.0196 80.3206L42.2609 82.5227C38.4319 83.9874 34.3694 81.0068 34.5623 76.8893L34.8569 70.6824C34.928 69.2894 34.4811 67.9067 33.6076 66.821L29.7482 61.9763C29.0474 61.0955 27.6661 58.1764 28.7427 55.7796C25.6247 58.4222 27.6458 62.8469 28.5599 64.0043L32.6428 69.1358C33.567 70.2932 34.0342 71.7476 33.9631 73.2328L33.6483 79.8084C33.4451 84.182 37.7413 87.3366 41.8039 85.7798L47.9079 83.4445C49.279 82.9222 50.8024 82.9222 52.1735 83.4445L58.2776 85.7798C62.3401 87.3264 66.6464 84.1717 66.4332 79.8084L66.1183 73.2328C66.0472 71.7476 66.5144 70.2932 67.4386 69.1358L71.5215 64.0043C73.6239 61.3618 73.1059 57.7052 70.8207 55.6567L70.8715 55.6465Z' fill='%23FFC200'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_3231_187312'%3E%3Crect width='100' height='128' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
}
.lp-game-board__card .card__inner.back[data-type="2"] {
  background-image: url("data:image/svg+xml,%3Csvg width='100' height='128' viewBox='0 0 100 128' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_3231_187313)'%3E%3Cpath d='M90.8999 0H9.10014C4.07427 0 0 4.10879 0 9.17724V118.823C0 123.891 4.07427 128 9.10014 128H90.8999C95.9257 128 100 123.891 100 118.823V9.17724C100 4.10879 95.9257 0 90.8999 0Z' fill='%23FFA1A1'/%3E%3Cpath d='M89.2951 123.924H10.7048C6.9165 123.924 3.83911 120.82 3.83911 117V10.9903C3.83911 7.16987 6.9165 4.06641 10.7048 4.06641H89.2951C93.0835 4.06641 96.1609 7.16987 96.1609 10.9903V117C96.1609 120.82 93.0835 123.924 89.2951 123.924ZM10.7048 6.07393C8.0134 6.07393 5.82977 8.27606 5.82977 10.9903V117C5.82977 119.714 8.0134 121.916 10.7048 121.916H89.2951C91.9866 121.916 94.1702 119.714 94.1702 117V10.9903C94.1702 8.27606 91.9866 6.07393 89.2951 6.07393H10.7048Z' fill='%23FFD2D2'/%3E%3Cpath d='M73.3393 54.7879C72.3947 49.3184 68.3322 44.8937 63.3352 43.9309C57.9422 42.8861 53.1077 45.6721 50.5382 50.1685C50.2944 50.5885 49.6952 50.5885 49.4616 50.1685C46.892 45.6618 42.0575 42.8861 36.6645 43.9309C31.6675 44.8937 27.5948 49.3184 26.6604 54.7879C25.7464 60.1242 27.6964 64.9586 31.048 67.9699L47.2881 83.2005C48.8116 84.6344 51.178 84.6344 52.7116 83.2005L68.9517 67.9699C72.3033 64.9484 74.2635 60.1242 73.3393 54.7879Z' fill='%23FF6666'/%3E%3Cpath d='M38.9193 43.7153C43.3779 43.7153 47.2577 46.3067 49.4616 50.1783C49.5835 50.3832 49.7866 50.4958 49.9999 50.4958C50.2132 50.4958 50.4163 50.3934 50.5382 50.1783C52.7421 46.3067 56.6117 43.7153 61.0806 43.7153C61.822 43.7153 62.5736 43.787 63.3353 43.9304C68.3322 44.8932 72.405 49.3179 73.3393 54.7874C74.2534 60.1237 72.3034 64.9582 68.9518 67.9695L52.7117 83.2C51.9499 83.917 50.9749 84.2755 49.9999 84.2755C49.0249 84.2755 48.0499 83.917 47.2882 83.2L31.0481 67.9695C27.6964 64.9479 25.7363 60.1237 26.6605 54.7874C27.5949 49.3179 31.6676 44.8932 36.6646 43.9304C37.4263 43.787 38.188 43.7153 38.9193 43.7153ZM38.9193 40.6426C37.9849 40.6426 37.0302 40.7348 36.0856 40.9191C29.809 42.138 24.812 47.505 23.6542 54.2753C22.6182 60.3286 24.6089 66.2999 28.9965 70.2535L45.2162 85.4636C46.5163 86.6824 48.2225 87.3584 49.9999 87.3584C51.7773 87.3584 53.4836 86.6824 54.7836 85.4636L71.0034 70.2535C75.3909 66.2999 77.3816 60.3286 76.3456 54.2753C75.1777 47.505 70.1807 42.138 63.9142 40.9191C62.9697 40.7348 62.0251 40.6426 61.0806 40.6426C56.8352 40.6426 52.8843 42.4862 49.9999 45.7126C47.1155 42.4862 43.1647 40.6426 38.9193 40.6426Z' fill='white'/%3E%3Cpath d='M73.3394 54.7868C72.7808 51.5297 71.105 48.6516 68.7995 46.6543C70.4245 48.4467 71.5823 50.7513 72.0191 53.2914C72.8824 58.3307 71.044 62.8783 67.8752 65.7258L52.5594 80.0959C51.1172 81.4479 48.8828 81.4479 47.4507 80.0959L32.1348 65.7258C28.966 62.8783 27.1277 58.3307 27.991 53.2914C28.4277 50.7513 29.5856 48.4467 31.2106 46.6543C28.8949 48.6618 27.2293 51.54 26.6707 54.7971C25.7566 60.1334 27.7066 64.9678 31.0583 67.9791L47.2984 83.2096C48.8218 84.6436 51.1883 84.6436 52.7219 83.2096L68.962 67.9791C72.3136 64.9576 74.2738 60.1334 73.3495 54.7971L73.3394 54.7868Z' fill='%23F73C3C'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_3231_187313'%3E%3Crect width='100' height='128' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
}
.lp-game-board #dotlottie-canvas {
  position: absolute;
  top: 0;
  left: 50%;
  width: 1400px;
  max-width: 1400px;
  height: auto;
  transform: translate(-50%, 0);
  z-index: 10009;
}

/* 상금 당첨자 리스트 페이지*/
.lp-game-winner .container {
  background-color: transparent !important;
}
.lp-game-winner__list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.lp-game-winner__item {
  display: flex;
  gap: 12px;
  justify-content: space-between;
  flex-wrap: wrap;
  padding: 16px 20px;
  background-color: var(--color-fg-neutral-inverted, #ffffff);
  border-radius: 10px;
  border: 1px solid var(--color-border-neutral-line, rgba(0, 0, 0, 0.08));
}
.lp-game-winner__item--tit {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: var(--font-title-2-size, 1rem);
  font-weight: var(--font-title-2-m-weight, 500);
  line-height: var(--font-title-2-line-height, 1.4);
  letter-spacing: var(--font-title-2-letter-spacing, -0.005em);
}
.lp-game-winner__item--tit .tit {
  width: 100%;
}
.lp-game-winner__item--tit .tit.special span {
  display: inline-block;
  position: relative;
}
.lp-game-winner__item--tit .tit.special span:after {
  content: "";
  position: absolute;
  top: 0;
  right: -12px;
  width: 6px;
  height: 6px;
  background: var(--color-bg-brand-solid, #fb1822);
  border-radius: 100%;
}
.lp-game-winner__item--tit .icon {
  width: 24px;
  height: 24px;
}
.lp-game-winner__item--tit .icon svg {
  width: 100%;
  height: 100%;
}
.lp-game-winner__item--value {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.lp-game-winner__item--value .value {
  font-size: var(--font-title-2-size, 1rem);
  font-weight: var(--font-title-2-sb-weight, 600);
  line-height: var(--font-title-2-line-height, 1.4);
  letter-spacing: var(--font-title-2-letter-spacing, -0.005em);
}
.lp-game-winner__item--value .date {
  font-size: var(--font-caption-1-size, 0.875rem);
  font-weight: var(--font-caption-1-r-weight, 400);
  line-height: var(--font-caption-1-line-height, 1.4);
  letter-spacing: var(--font-caption-1-letter-spacing, -0.005em);
  color: var(--color-fg-neutral-muted, #6A6F77);
}
.lp-game-winner__section:not(:last-child) {
  margin-bottom: 40px;
}
.lp-game-winner__section .winner-benefit__item {
  display: flex;
  align-items: center;
  gap: 16px;
}
.lp-game-winner__section .winner-benefit__item .rank {
  color: var(--color-fg-brand-solid, #fb1822);
  font-size: var(--font-title-1-size, 1.125rem);
  font-weight: var(--font-title-1-sb-weight, 600);
  line-height: var(--font-title-1-line-height, 1.4);
  letter-spacing: var(--font-title-1-letter-spacing, -0.005em);
}
.lp-game-winner__box {
  padding: 12px 20px;
  border-radius: 16px;
  background: var(--color-fg-neutral-inverted, #ffffff);
  border: 1px solid var(--color-border-neutral-line, rgba(0, 0, 0, 0.08));
}

body:has(.lp-game-winner):has(.tab-component[data-fixed=true]) #topNavigation .container, body:has(.lp-game-winner):has(.tab-component[data-fixed=true]) .tab-component__inner {
  background-color: var(--color-fg-neutral-inverted, #ffffff) !important;
}
body:has(.lp-game-winner):has(.tab-component[data-fixed=false]) #topNavigation .container, body:has(.lp-game-winner):has(.tab-component[data-fixed=false]) .tab-component__inner {
  background-color: transparent !important;
}