@charset "UTF-8";
/* 수정 #121 : campaign-popup 팝업 스타일을 app.css 에서 분리 — 운영 DOMS 블록·관리자 미리보기 공용 module.campaign.css */
:where(.campaign-popup) :is(.btn, .btn-text) {
  position: revert;
  display: revert;
  flex-shrink: revert;
  align-items: revert;
  justify-content: revert;
  gap: revert;
  height: revert;
  padding: revert;
  border: revert;
  border-radius: revert;
  background: revert;
  background-clip: revert;
  color: revert;
  font-size: inherit;
  font-weight: inherit;
  white-space: revert;
  text-decoration: revert;
  user-select: revert;
  cursor: revert;
  transition: revert;
}

:where(.campaign-popup) :is(.btn, .btn-text)::before {
  content: none;
  position: revert;
  inset: revert;
  border-radius: revert;
  background: revert;
  opacity: revert;
  pointer-events: revert;
  transition: revert;
}

:where(.campaign-popup) :is(.btn, .btn-text):is(:hover, :active)::before {
  opacity: revert;
}

:where(.campaign-popup) .checkbox {
  display: revert;
  align-items: revert;
  gap: revert;
  cursor: revert;
  user-select: revert;
}

.campaign-popup {
  outline: 0;
}
.campaign-popup:is(.module-b, .module-c, .module-d) {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  pointer-events: none;
  transition: background-color var(--duration-base);
}
.campaign-popup.active[data-campaign-dimmed=true] {
  background-color: var(--overlay-backdrop);
}
.campaign-popup :is(a, button, input):focus-visible {
  outline: var(--stroke-3) solid var(--border-box-heavy);
  outline-offset: 0;
}
.campaign-popup .popup-page-body {
  display: flex;
  width: 100%;
}
.campaign-popup .popup-local {
  position: relative;
  pointer-events: auto;
}
.campaign-popup .popup-local-head {
  position: absolute;
  overflow: hidden;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  clip-path: inset(50%);
  white-space: nowrap;
}
.campaign-popup .board-cover {
  display: block;
}
.campaign-popup .board-cover img {
  display: block;
  width: 100%;
}
.campaign-popup .board-subject,
.campaign-popup .board-summary {
  margin: 0;
}
.campaign-popup .board-name {
  display: block;
  color: var(--label-normal) !important;
}
.campaign-popup .board-summary {
  color: var(--label-muted) !important;
}
.campaign-popup button.btn {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  font: inherit;
  cursor: pointer;
  appearance: none;
}
.campaign-popup .popup-local-util {
  display: flex;
  align-items: center;
}
.campaign-popup .submit-form {
  display: flex;
  flex: 1 1 0%;
  align-items: center;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}
.campaign-popup .submit-form legend,
.campaign-popup .submit-form .form-head {
  position: absolute;
  overflow: hidden;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  clip-path: inset(50%);
  white-space: nowrap;
}
.campaign-popup .option-item .form {
  display: flex;
  align-items: center;
  column-gap: var(--gap-1-5);
  cursor: pointer;
}
.campaign-popup .option-item .form-elem {
  flex-shrink: 0;
  margin: 0;
  appearance: none;
  cursor: pointer;
}
.campaign-popup .option-item .form-elem::before {
  content: "";
  display: block;
  width: 16px;
  height: 16px;
  border: var(--stroke-1) solid var(--border-box-strong);
  border-radius: var(--rounded-sm);
  background: var(--fill-normal);
}
.campaign-popup .option-item .form-elem:checked::before {
  border-color: transparent;
  background: var(--fill-hyper) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M5.77734 10.2227L4.22266 11.7774L10 17.5557L19.7773 7.77736L17.3251 7.12027L10 14.4453L5.77734 10.2227Z' fill='white'/%3E%3C/svg%3E") center/100% no-repeat;
}
.campaign-popup .option-item .form-text {
  display: block;
  font-size: var(--font-size-component-medium);
  font-weight: var(--font-weight-medium);
  line-height: 22px;
  color: var(--label-muted);
}
.campaign-popup .button-display .button-area {
  display: flex;
  align-items: center;
}

html:is(.active-campaign-default-popup-dimmed,
.active-campaign-scroll-popup-dimmed,
.active-campaign-floating-popup-dimmed) body {
  overflow: hidden;
}

.campaign-popup.module-b .popup-page-body {
  justify-content: center;
  max-height: 100%;
}
.campaign-popup.module-b .popup-local {
  border-radius: var(--rounded-3xl);
  background-color: var(--background-elevated-normal);
  box-shadow: 0 24px 38px -10px rgba(25, 27, 30, 0.08), 0 10px 15px -5px rgba(25, 27, 30, 0.08);
  display: flex;
  flex-direction: column;
  width: 100%;
}
.campaign-popup.module-b .popup-local-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
}
.campaign-popup.module-b .board-figure {
  padding: var(--p-3) var(--p-3) var(--p-4);
}
.campaign-popup.module-b .board-cover {
  position: relative;
  overflow: hidden;
}
.campaign-popup.module-b .board-cover::after {
  content: "";
  position: absolute;
  inset: 0;
  border: var(--stroke-1) solid var(--border-box-normal);
  border-radius: inherit;
  pointer-events: none;
}
.campaign-popup.module-b .board-cover {
  border-radius: var(--rounded-xl);
}
.campaign-popup.module-b .board-inform {
  padding: 0 var(--p-5);
}
.campaign-popup.module-b .board-subject {
  font-size: var(--font-size-title-medium);
  font-weight: var(--font-weight-bold);
  line-height: 1.4;
}
.campaign-popup.module-b .board-summary {
  margin-top: var(--gap-1);
  font-size: var(--font-size-body-large);
  font-weight: var(--font-weight-medium);
  line-height: 1.6;
}
.campaign-popup.module-b .board-head + .board-util {
  margin-top: var(--gap-5);
}
.campaign-popup.module-b .board-util .button-area {
  display: flex;
  flex-wrap: wrap;
  gap: var(--gap-2);
}
.campaign-popup.module-b .board-util .btn {
  flex: 1 1 100%;
}
.campaign-popup.module-b .board-util .btn:nth-last-child(2):not(.attr-move),
.campaign-popup.module-b .board-util .btn:nth-last-child(2):not(.attr-move) + .btn {
  flex: 1 1 0%;
}
.campaign-popup.module-b .btn.type-cta {
  position: relative;
}
.campaign-popup.module-b .btn.type-cta::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: var(--fill-hyper);
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--transition-base);
}
@media (hover: hover) {
  .campaign-popup.module-b .btn.type-cta:hover::after {
    opacity: 0.0375;
  }
}
.campaign-popup.module-b .btn.type-cta:active::after {
  opacity: 0.09;
}
.campaign-popup.module-b .btn.type-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 52px;
  padding: 0 var(--p-6);
  border: var(--stroke-1) solid var(--border-box-normal) !important;
  border-radius: var(--rounded-xl);
  background-color: var(--fill-normal) !important;
  font-size: var(--font-size-component-large);
  font-weight: var(--font-weight-semibold);
  line-height: 1.6;
  color: var(--label-muted);
  text-decoration: none;
}
.campaign-popup.module-b .btn.type-cta .btn-text {
  white-space: nowrap;
  color: inherit !important;
}
.campaign-popup.module-b .btn.type-cta.attr-move {
  position: relative;
}
.campaign-popup.module-b .btn.type-cta.attr-move::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: var(--fill-hyper);
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--transition-base);
}
@media (hover: hover) {
  .campaign-popup.module-b .btn.type-cta.attr-move:hover::after {
    opacity: 0.075;
  }
}
.campaign-popup.module-b .btn.type-cta.attr-move:active::after {
  opacity: 0.18;
}
.campaign-popup.module-b .btn.type-cta.attr-move {
  border-color: transparent !important;
  background-color: var(--brand-blue-normal) !important;
  color: var(--label-inverse-normal);
}
.campaign-popup.module-b .popup-local-util {
  column-gap: var(--gap-3);
  padding: var(--p-3);
}
.campaign-popup.module-b .option-item .form {
  padding: var(--p-2);
}
.campaign-popup.module-b .popup-local-util .button-display .btn {
  position: relative;
}
.campaign-popup.module-b .popup-local-util .button-display .btn::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: var(--fill-hyper);
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--transition-base);
}
@media (hover: hover) {
  .campaign-popup.module-b .popup-local-util .button-display .btn:hover::after {
    opacity: 0.0375;
  }
}
.campaign-popup.module-b .popup-local-util .button-display .btn:active::after {
  opacity: 0.09;
}
.campaign-popup.module-b .popup-local-util .button-display .btn {
  padding: var(--p-2) var(--p-3);
  border-radius: var(--rounded-md);
  font-size: var(--font-size-component-medium);
  font-weight: var(--font-weight-medium);
  line-height: 22px;
  color: var(--label-muted);
}

.campaign-popup.module-b[data-campaign-toggle=campaignDefaultPopup] {
  align-items: center;
  justify-content: center;
  padding: var(--p-3) !important;
  visibility: hidden;
  opacity: 0;
  transition: opacity var(--duration-base), visibility 0s linear var(--duration-base), background-color var(--duration-base);
}
.campaign-popup.module-b[data-campaign-toggle=campaignDefaultPopup].active {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
  transition: opacity var(--duration-base), background-color var(--duration-base);
}
.campaign-popup.module-b[data-campaign-toggle=campaignDefaultPopup] .popup-local {
  max-width: 460px;
}
@media (min-width: 768px) {
  .campaign-popup.module-b[data-campaign-toggle=campaignDefaultPopup][data-campaign-device=laptop] {
    padding: var(--p-16) !important;
  }
  .campaign-popup.module-b[data-campaign-toggle=campaignDefaultPopup][data-campaign-device=laptop] .board-figure {
    padding: var(--p-4) var(--p-4) var(--p-5);
  }
  .campaign-popup.module-b[data-campaign-toggle=campaignDefaultPopup][data-campaign-device=laptop] .board-inform {
    padding: 0 var(--p-7);
  }
  .campaign-popup.module-b[data-campaign-toggle=campaignDefaultPopup][data-campaign-device=laptop] .board-head + .board-util {
    margin-top: var(--gap-7);
  }
  .campaign-popup.module-b[data-campaign-toggle=campaignDefaultPopup][data-campaign-device=laptop] .popup-local-util {
    padding: var(--p-6) var(--p-5);
  }
}

.campaign-popup.module-b[data-campaign-toggle=campaignScrollPopup] {
  align-items: center;
  justify-content: center;
  padding: 0 var(--p-3) !important;
}
.campaign-popup.module-b[data-campaign-toggle=campaignScrollPopup].active {
  pointer-events: auto;
}
.campaign-popup.module-b[data-campaign-toggle=campaignScrollPopup] .popup-local {
  max-width: 336px;
  visibility: hidden;
  transform: translateY(100vh);
  transition: transform var(--duration-fast) var(--ease-in), visibility 0s linear var(--duration-fast);
}
.campaign-popup.module-b[data-campaign-toggle=campaignScrollPopup].active .popup-local {
  visibility: visible;
  transform: translateY(0);
  transition: transform var(--duration-base) var(--ease-out), visibility 0s;
}
@media (prefers-reduced-motion: reduce) {
  .campaign-popup.module-b[data-campaign-toggle=campaignScrollPopup] .popup-local, .campaign-popup.module-b[data-campaign-toggle=campaignScrollPopup].active .popup-local {
    transition: none;
  }
}
@media (min-width: 768px) {
  .campaign-popup.module-b[data-campaign-toggle=campaignScrollPopup][data-campaign-device=laptop] {
    align-items: flex-start;
    justify-content: flex-start;
    padding: 140px 0 0 var(--p-20) !important;
  }
  .campaign-popup.module-b[data-campaign-toggle=campaignScrollPopup][data-campaign-device=laptop] .popup-page-body {
    justify-content: flex-start;
  }
}

.campaign-popup.module-b.type-c .popup-local-body {
  padding-top: var(--p-12);
}
.campaign-popup.module-b.type-c .popup-local-body::before {
  content: "";
  position: absolute;
  z-index: 1;
  bottom: calc(100% - 32px);
  left: calc(50% - 32px);
  width: 64px;
  height: 64px;
  border: var(--stroke-1) solid var(--border-box-normal);
  border-radius: var(--rounded-full);
  background: var(--fill-normal) var(--campaign-profile-image) center/cover no-repeat;
}
.campaign-popup.module-b.type-c .board-inform {
  text-align: center;
}
.campaign-popup.module-b.type-c .board-subject {
  font-size: var(--font-size-component-xlarge);
}
.campaign-popup.module-b.type-c .board-summary {
  font-size: var(--font-size-component-medium);
}

.campaign-popup .scroll-slides {
  position: relative;
}
.campaign-popup .scroll-slides .swiper-pagination {
  display: flex;
  align-items: center;
  gap: var(--gap-0-5);
  inset: var(--p-5) var(--p-5) auto auto;
  width: auto;
  padding: var(--p-0-5) var(--p-1-5);
  border-radius: var(--rounded-lg);
  background: var(--fill-alpha-black-normal);
  font-size: var(--font-size-component-xsmall);
  font-weight: var(--font-weight-medium);
  line-height: 1.6;
  color: var(--label-inverse-soft);
}
.campaign-popup .scroll-slides .swiper-pagination-current {
  color: var(--label-inverse-normal);
}

.campaign-popup.module-c {
  padding: 0 var(--p-3);
}
.campaign-popup.module-c.active {
  pointer-events: auto;
}
.campaign-popup.module-c .popup-page-body {
  align-items: flex-start;
  justify-content: flex-end;
  padding-top: var(--p-3);
}
.campaign-popup.module-c .popup-local {
  border-radius: var(--rounded-3xl);
  background-color: var(--background-elevated-normal);
  box-shadow: 0 24px 38px -10px rgba(25, 27, 30, 0.08), 0 10px 15px -5px rgba(25, 27, 30, 0.08);
  overflow: hidden;
  width: 100%;
  max-width: 460px;
  visibility: hidden;
  opacity: 0;
  transform: translateY(24px);
  transition: visibility var(--duration-base), opacity var(--duration-base), transform var(--duration-base) var(--ease-out);
}
.campaign-popup.module-c.active .popup-local {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
}
.campaign-popup.module-c.active[style*="effect: b;"] .popup-local {
  animation: doms-fade-in 1s both;
}
.campaign-popup.module-c.active[style*="effect: c;"] .popup-local {
  animation: doms-fade-in-bottom 1s both;
}
.campaign-popup.module-c.active[style*="effect: d;"] .popup-local {
  animation: doms-shake 1s both;
}
@media (prefers-reduced-motion: reduce) {
  .campaign-popup.module-c .popup-local, .campaign-popup.module-c.active .popup-local, .campaign-popup.module-c.active[style*=effect] .popup-local {
    animation: none;
    transition: none;
  }
}
.campaign-popup.module-c .board-util {
  position: absolute;
  inset: 0;
}
.campaign-popup.module-c .board-util .button-area,
.campaign-popup.module-c .board-util .btn.type-goto {
  display: block;
  width: 100%;
  height: 100%;
}
.campaign-popup.module-c .board-util .btn.type-goto {
  outline-offset: calc(-1 * var(--stroke-3));
}
.campaign-popup.module-c .board-util .btn.type-goto .btn-text {
  position: absolute;
  overflow: hidden;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  clip-path: inset(50%);
  white-space: nowrap;
}
.campaign-popup.module-c .popup-local-body {
  padding: var(--p-3) var(--p-10) var(--p-3) var(--p-3);
}
.campaign-popup.module-c .board-wrap {
  display: flex;
  align-items: center;
}
.campaign-popup.module-c .board-figure {
  flex-shrink: 0;
}
.campaign-popup.module-c .board-cover {
  position: relative;
  overflow: hidden;
}
.campaign-popup.module-c .board-cover::after {
  content: "";
  position: absolute;
  inset: 0;
  border: var(--stroke-1) solid var(--border-box-normal);
  border-radius: inherit;
  pointer-events: none;
}
.campaign-popup.module-c .board-cover {
  width: 80px;
  height: 80px;
  border-radius: var(--rounded-2xl);
}
.campaign-popup.module-c .board-cover img {
  height: 100%;
  object-fit: cover;
}
.campaign-popup.module-c .board-inform {
  flex: 1 1 100%;
  min-width: 0;
  padding-left: var(--p-3);
}
.campaign-popup.module-c .board-subject {
  font-size: var(--font-size-title-small);
  font-weight: var(--font-weight-bold);
  line-height: 1.4;
}
.campaign-popup.module-c .board-summary {
  margin-top: var(--gap-1);
  font-size: var(--font-size-component-medium);
  font-weight: var(--font-weight-medium);
  line-height: 1.6;
}
.campaign-popup.module-c .popup-local-util {
  position: absolute;
  top: var(--p-2);
  right: var(--p-2);
}
.campaign-popup.module-c .popup-local-util .button-display .btn {
  position: relative;
  width: 32px;
  height: 32px;
}
.campaign-popup.module-c .popup-local-util .button-display .btn::before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--label-muted);
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M17.7719 7.6421C18.1624 7.25158 18.1624 6.61841 17.7719 6.22789C17.3814 5.83737 16.7482 5.83737 16.3577 6.22789L11.9992 10.5863L7.64265 6.22973C7.25213 5.8392 6.61896 5.8392 6.22844 6.22973C5.83792 6.62025 5.83792 7.25342 6.22844 7.64394L10.585 12.0005L6.22938 16.3562C5.83886 16.7467 5.83886 17.3799 6.22938 17.7704C6.61991 18.1609 7.25307 18.1609 7.6436 17.7704L11.9992 13.4147L16.3567 17.7722C16.7472 18.1627 17.3804 18.1627 17.7709 17.7722C18.1615 17.3817 18.1615 16.7485 17.7709 16.358L13.4135 12.0005L17.7719 7.6421Z'/%3E%3C/svg%3E") center/24px no-repeat;
}
.campaign-popup.module-c .popup-local-util .button-display .btn .btn-text {
  position: absolute;
  overflow: hidden;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  clip-path: inset(50%);
  white-space: nowrap;
}
@media (min-width: 768px) {
  .campaign-popup.module-c[data-campaign-device=laptop] {
    padding: 0 var(--p-12);
  }
  .campaign-popup.module-c[data-campaign-device=laptop] .popup-page-body {
    padding-top: var(--p-12);
  }
  .campaign-popup.module-c[data-campaign-device=laptop] .popup-local {
    max-width: 435px;
  }
}

.campaign-popup.module-a {
  position: relative;
  z-index: 40;
  display: flex;
  justify-content: center;
  overflow: clip;
  width: 100%;
  padding: 0 var(--p-3);
  background-color: var(--campaign-background-color);
}
.campaign-popup.module-a:not(.active) {
  display: none;
}
.campaign-popup.module-a .board-util {
  position: absolute;
  inset: 0;
}
.campaign-popup.module-a .board-util .button-area,
.campaign-popup.module-a .board-util .btn.type-goto {
  display: block;
  width: 100%;
  height: 100%;
}
.campaign-popup.module-a .board-util .btn.type-goto {
  outline-offset: calc(-1 * var(--stroke-3));
}
.campaign-popup.module-a .board-util .btn.type-goto .btn-text {
  position: absolute;
  overflow: hidden;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  clip-path: inset(50%);
  white-space: nowrap;
}
.campaign-popup.module-a .popup-local {
  width: 100%;
}
.campaign-popup.module-a .popup-content-body {
  display: flex;
  justify-content: center;
}
.campaign-popup.module-a .info-board {
  width: 100%;
}
.campaign-popup.module-a .board-cover {
  display: flex;
  justify-content: center;
  margin: 0 -8px;
}
.campaign-popup.module-a .board-cover img {
  width: 100%;
  max-width: 565px;
  height: auto;
}
.campaign-popup.module-a .popup-local-util {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
}
.campaign-popup.module-a .submit-form {
  display: none;
}
.campaign-popup.module-a .option-item .form {
  padding: 0 10px;
}
.campaign-popup.module-a .popup-local-util .button-display .btn {
  position: relative;
  width: 32px;
  height: 32px;
}
.campaign-popup.module-a .popup-local-util .button-display .btn::before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--label-muted);
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M17.7719 7.6421C18.1624 7.25158 18.1624 6.61841 17.7719 6.22789C17.3814 5.83737 16.7482 5.83737 16.3577 6.22789L11.9992 10.5863L7.64265 6.22973C7.25213 5.8392 6.61896 5.8392 6.22844 6.22973C5.83792 6.62025 5.83792 7.25342 6.22844 7.64394L10.585 12.0005L6.22938 16.3562C5.83886 16.7467 5.83886 17.3799 6.22938 17.7704C6.61991 18.1609 7.25307 18.1609 7.6436 17.7704L11.9992 13.4147L16.3567 17.7722C16.7472 18.1627 17.3804 18.1627 17.7709 17.7722C18.1615 17.3817 18.1615 16.7485 17.7709 16.358L13.4135 12.0005L17.7719 7.6421Z'/%3E%3C/svg%3E") center/24px no-repeat;
}
.campaign-popup.module-a .popup-local-util .button-display .btn .btn-text {
  position: absolute;
  overflow: hidden;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  clip-path: inset(50%);
  white-space: nowrap;
}
@media (min-width: 768px) {
  .campaign-popup.module-a[data-campaign-device=laptop] {
    z-index: 50;
    padding: 0 var(--p-12);
  }
  .campaign-popup.module-a[data-campaign-device=laptop] .info-board {
    width: 565px;
  }
  .campaign-popup.module-a[data-campaign-device=laptop] .board-cover {
    overflow: hidden;
    height: 56px;
    margin: 0;
  }
  .campaign-popup.module-a[data-campaign-device=laptop] .board-cover img {
    flex-shrink: 0;
    width: auto;
    max-width: none;
    height: 100%;
  }
  .campaign-popup.module-a[data-campaign-device=laptop] .submit-form {
    display: flex;
  }
  .campaign-popup.module-a[data-campaign-device=laptop] .popup-local-util .button-display .btn {
    width: 40px;
    height: 40px;
  }
}

.campaign-popup.module-d {
  align-items: flex-end;
  justify-content: center;
  padding: 0 var(--p-3) 82px;
}
.campaign-popup.module-d.active[data-campaign-dimmed=true] {
  pointer-events: auto;
}
.campaign-popup.module-d .popup-page-body {
  align-items: flex-start;
  justify-content: flex-start;
}
.campaign-popup.module-d .popup-local {
  --width: 128px;
  --max-width: min(336px, 100%);
  border-radius: var(--rounded-3xl);
  background-color: var(--background-elevated-normal);
  box-shadow: 0 24px 38px -10px rgba(25, 27, 30, 0.08), 0 10px 15px -5px rgba(25, 27, 30, 0.08);
  width: var(--width);
  max-width: var(--max-width);
  visibility: hidden;
  opacity: 0;
  transition: visibility var(--duration-base), opacity var(--duration-base);
}
.campaign-popup.module-d.active .popup-local {
  visibility: visible;
  opacity: 1;
  animation: doms-expand 2s ease-in-out 1s forwards;
}
.campaign-popup.module-d.active[style*="effect: b;"] .popup-local {
  animation: doms-fade-in 1s both, doms-expand 2s ease-in-out 1s forwards;
}
.campaign-popup.module-d.active[style*="effect: c;"] .popup-local {
  animation: doms-fade-in-top 1s both, doms-expand 2s ease-in-out 1s forwards;
}
.campaign-popup.module-d.active[style*="effect: d;"] .popup-local {
  animation: doms-shake 1s both, doms-expand 2s ease-in-out 1s forwards;
}
@media (prefers-reduced-motion: reduce) {
  .campaign-popup.module-d.active .popup-local, .campaign-popup.module-d.active[style*=effect] .popup-local {
    width: var(--max-width);
    animation: none;
  }
}
.campaign-popup.module-d .board-util {
  position: absolute;
  inset: 0;
}
.campaign-popup.module-d .board-util .button-area,
.campaign-popup.module-d .board-util .btn.type-goto {
  display: block;
  width: 100%;
  height: 100%;
}
.campaign-popup.module-d .board-util .btn.type-goto {
  outline-offset: calc(-1 * var(--stroke-3));
}
.campaign-popup.module-d .board-util .btn.type-goto .btn-text {
  position: absolute;
  overflow: hidden;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  clip-path: inset(50%);
  white-space: nowrap;
}
.campaign-popup.module-d .popup-content-body {
  overflow: hidden;
}
.campaign-popup.module-d .popup-local-body {
  padding: var(--p-3);
}
.campaign-popup.module-d .board-wrap {
  display: flex;
  align-items: flex-start;
}
.campaign-popup.module-d .board-figure {
  position: relative;
  overflow: hidden;
}
.campaign-popup.module-d .board-figure::after {
  content: "";
  position: absolute;
  inset: 0;
  border: var(--stroke-1) solid var(--border-box-normal);
  border-radius: inherit;
  pointer-events: none;
}
.campaign-popup.module-d .board-figure {
  flex-shrink: 0;
  border-radius: var(--rounded-2xl);
}
.campaign-popup.module-d .board-cover {
  width: 104px;
  height: 104px;
}
.campaign-popup.module-d .board-cover img {
  height: 100%;
  object-fit: cover;
}
.campaign-popup.module-d .board-inform {
  flex: 1 1 100%;
  width: 0;
  visibility: hidden;
  opacity: 0;
}
.campaign-popup.module-d.active .board-inform {
  width: 100%;
  visibility: visible;
  opacity: 1;
}
.campaign-popup.module-d .board-subject {
  padding: var(--p-2) var(--p-2) var(--p-2) var(--p-3);
  font-size: var(--font-size-component-xlarge);
  line-height: 1.4;
}
.campaign-popup.module-d .board-name {
  display: -webkit-box;
  overflow: hidden;
  font-weight: var(--font-weight-semibold);
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.campaign-popup.module-d .popup-local-util {
  position: absolute;
  right: var(--p-3);
  bottom: var(--p-3);
}
.campaign-popup.module-d .popup-local-util .button-display .btn {
  position: relative;
  width: 32px;
  height: 32px;
}
.campaign-popup.module-d .popup-local-util .button-display .btn::before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--label-muted);
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M17.7719 7.6421C18.1624 7.25158 18.1624 6.61841 17.7719 6.22789C17.3814 5.83737 16.7482 5.83737 16.3577 6.22789L11.9992 10.5863L7.64265 6.22973C7.25213 5.8392 6.61896 5.8392 6.22844 6.22973C5.83792 6.62025 5.83792 7.25342 6.22844 7.64394L10.585 12.0005L6.22938 16.3562C5.83886 16.7467 5.83886 17.3799 6.22938 17.7704C6.61991 18.1609 7.25307 18.1609 7.6436 17.7704L11.9992 13.4147L16.3567 17.7722C16.7472 18.1627 17.3804 18.1627 17.7709 17.7722C18.1615 17.3817 18.1615 16.7485 17.7709 16.358L13.4135 12.0005L17.7719 7.6421Z'/%3E%3C/svg%3E") center/24px no-repeat;
}
.campaign-popup.module-d .popup-local-util .button-display .btn .btn-text {
  position: absolute;
  overflow: hidden;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  clip-path: inset(50%);
  white-space: nowrap;
}
@media (min-width: 768px) {
  .campaign-popup.module-d[data-campaign-device=laptop] {
    justify-content: flex-start;
    padding: 0 0 var(--p-20) var(--p-20);
  }
}

@keyframes doms-fade-in {
  from {
    opacity: 0;
  }
}
@keyframes doms-fade-in-top {
  from {
    opacity: 0;
    transform: translate3d(0, -20%, 0);
  }
}
@keyframes doms-fade-in-bottom {
  from {
    opacity: 0;
    transform: translate3d(0, 20%, 0);
  }
}
@keyframes doms-shake {
  10%, 90% {
    transform: translate3d(-3px, 0, 0);
  }
  20%, 80% {
    transform: translate3d(6px, 0, 0);
  }
  30%, 70% {
    transform: translate3d(-9px, 0, 0);
  }
  40%, 60% {
    transform: translate3d(12px, 0, 0);
  }
  50% {
    transform: translate3d(-15px, 0, 0);
  }
}
@keyframes doms-expand {
  30%, 100% {
    width: var(--max-width);
  }
}
.campaign-popup {
  --color-gray-00: #ffffff;
  --color-gray-10: #f4f5f7;
  --color-gray-20: #e4e6e8;
  --color-gray-30: #d7dade;
  --color-gray-40: #c9ccd1;
  --color-gray-50: #b0b4b9;
  --color-gray-60: #7f848a;
  --color-gray-70: #6a6e73;
  --color-gray-80: #494e52;
  --color-gray-90: #33363b;
  --color-gray-100: #191b1e;
  --color-blue-10: #f5f4fb;
  --color-blue-15: #ece9fb;
  --color-blue-20: #dbd5f8;
  --color-blue-30: #beb4f2;
  --color-blue-40: #9989ea;
  --color-blue-50: #6147df;
  --color-blue-60: #3617ce;
  --color-blue-70: #2b12a5;
  --color-blue-80: #200e7c;
  --color-blue-90: #160952;
  --color-blue-100: #0c062d;
  --color-skyblue-10: #f2fafc;
  --color-skyblue-15: #d9f2fc;
  --color-skyblue-20: #b6e3f7;
  --color-skyblue-30: #9cdaf4;
  --color-skyblue-40: #6dc7ed;
  --color-skyblue-50: #3cb4e7;
  --color-skyblue-60: #1a9bd2;
  --color-skyblue-70: #157ca8;
  --color-skyblue-80: #2d7b9b;
  --color-skyblue-90: #24637d;
  --color-skyblue-100: #051f2a;
  --color-green-10: #edf8f1;
  --color-green-15: #d5f1e1;
  --color-green-20: #c3ead4;
  --color-green-30: #a0deba;
  --color-green-40: #70cd96;
  --color-green-50: #42bc74;
  --color-green-60: #209d54;
  --color-green-70: #1a7e43;
  --color-green-80: #135e32;
  --color-green-90: #0d3f22;
  --color-green-100: #061f11;
  --color-red-10: #fce7e7;
  --color-red-15: #fbdada;
  --color-red-20: #f8baba;
  --color-red-30: #f0a1a1;
  --color-red-40: #e97171;
  --color-red-50: #e14242;
  --color-red-60: #cc2121;
  --color-red-70: #a31a1a;
  --color-red-80: #7a1414;
  --color-red-90: #520d0d;
  --color-red-100: #290707;
  --color-yellow-10: #fcf8ee;
  --color-yellow-15: #fbebbc;
  --color-yellow-20: #f4e4ae;
  --color-yellow-30: #efd990;
  --color-yellow-40: #e9cb66;
  --color-yellow-50: #e1b933;
  --color-yellow-60: #daa800;
  --color-yellow-70: #ae8600;
  --color-yellow-80: #836500;
  --color-yellow-90: #574300;
  --color-yellow-100: #2c2200;
  --color-orange-10: #fbf1e7;
  --color-orange-15: #fce9d4;
  --color-orange-20: #fad8b3;
  --color-orange-30: #efc499;
  --color-orange-40: #e7a767;
  --color-orange-50: #df8934;
  --color-orange-60: #d9730d;
  --color-orange-70: #ac5601;
  --color-orange-80: #814101;
  --color-orange-90: #562b00;
  --color-orange-100: #2b1600;
  --color-alpha-blue-40: #3617ce66;
  --color-alpha-blue-90: #3617cee5;
  --color-alpha-white-5: #ffffff0d;
  --color-alpha-white-10: #ffffff1a;
  --color-alpha-white-20: #ffffff33;
  --color-alpha-white-30: #ffffff4d;
  --color-alpha-white-40: #ffffff66;
  --color-alpha-white-50: #ffffff80;
  --color-alpha-white-60: #ffffff99;
  --color-alpha-white-70: #ffffffb2;
  --color-alpha-white-80: #ffffffcc;
  --color-alpha-white-90: #ffffffe5;
  --color-alpha-black-5: #191b1e0d;
  --color-alpha-black-10: #191b1e1a;
  --color-alpha-black-20: #191b1e33;
  --color-alpha-black-30: #191b1e4d;
  --color-alpha-black-40: #191b1e66;
  --color-alpha-black-50: #191b1e80;
  --color-alpha-black-60: #191b1e99;
  --color-alpha-black-70: #191b1eb2;
  --color-alpha-black-80: #191b1ecc;
  --color-alpha-black-90: #191b1ee5;
  --label-disabled: var(--color-gray-60);
  --label-inverse-muted: var(--color-alpha-white-80);
  --label-inverse-normal: var(--color-gray-00);
  --label-inverse-soft: var(--color-alpha-white-70);
  --label-muted: var(--color-gray-80);
  --label-normal: var(--color-gray-100);
  --label-soft: var(--color-gray-70);
  --background-elevated-normal: var(--color-gray-00);
  --background-elevated-strong: var(--color-gray-10);
  --background-normal: var(--color-gray-00);
  --background-strong: var(--color-gray-10);
  --fill-alpha-black-heavy: var(--color-alpha-black-90);
  --fill-alpha-black-muted: var(--color-alpha-black-30);
  --fill-alpha-black-normal: var(--color-alpha-black-50);
  --fill-alpha-black-soft: var(--color-alpha-black-5);
  --fill-alpha-black-strong: var(--color-alpha-black-80);
  --fill-alpha-white-muted: var(--color-alpha-white-50);
  --fill-alpha-white-normal: var(--color-alpha-white-70);
  --fill-alpha-white-soft: var(--color-alpha-white-20);
  --fill-disabled: var(--color-gray-20);
  --fill-heavy: var(--color-gray-20);
  --fill-hyper: var(--color-gray-100);
  --fill-normal: var(--color-gray-00);
  --fill-strong: var(--color-gray-10);
  --fill-ultra: var(--color-gray-80);
  --border-box-heavy: var(--color-alpha-black-60);
  --border-box-normal: var(--color-alpha-black-10);
  --border-box-strong: var(--color-alpha-black-50);
  --border-box-ultra: var(--color-gray-100);
  --border-line-muted: var(--color-alpha-black-5);
  --border-line-normal: var(--color-alpha-black-10);
  --border-line-strong: var(--color-gray-100);
  --brand-blue-alpha-muted: var(--color-alpha-blue-40);
  --brand-blue-alpha-normal: var(--color-alpha-blue-90);
  --brand-blue-muted: var(--color-blue-40);
  --brand-blue-normal: var(--color-blue-60);
  --brand-blue-soft: var(--color-blue-30);
  --brand-blue-subtle: var(--color-blue-15);
  --brand-blue-weak: var(--color-blue-10);
  --brand-green-muted: var(--color-green-40);
  --brand-green-normal: var(--color-green-60);
  --brand-green-soft: var(--color-green-30);
  --brand-green-strong: var(--color-green-70);
  --brand-green-subtle: var(--color-green-15);
  --brand-green-weak: var(--color-green-10);
  --brand-orange-muted: var(--color-orange-40);
  --brand-orange-normal: var(--color-orange-60);
  --brand-orange-soft: var(--color-orange-30);
  --brand-orange-strong: var(--color-orange-80);
  --brand-orange-subtle: var(--color-orange-15);
  --brand-red-muted: var(--color-red-40);
  --brand-red-normal: var(--color-red-60);
  --brand-red-soft: var(--color-red-30);
  --brand-red-strong: var(--color-red-70);
  --brand-red-subtle: var(--color-red-15);
  --brand-red-weak: var(--color-red-10);
  --brand-skyblue-heavy: var(--color-skyblue-90);
  --brand-skyblue-muted: var(--color-skyblue-40);
  --brand-skyblue-normal: var(--color-skyblue-60);
  --brand-skyblue-soft: var(--color-skyblue-30);
  --brand-skyblue-strong: var(--color-skyblue-70);
  --brand-skyblue-subtle: var(--color-skyblue-15);
  --brand-skyblue-weak: var(--color-skyblue-10);
  --brand-yellow-muted: var(--color-yellow-40);
  --brand-yellow-normal: var(--color-yellow-60);
  --brand-yellow-soft: var(--color-yellow-30);
  --brand-yellow-strong: var(--color-yellow-80);
  --brand-yellow-subtle: var(--color-yellow-15);
  --state-error-muted: var(--color-red-20);
  --state-error-normal: var(--color-red-60);
  --state-error-soft: var(--color-red-10);
  --p-0-5: 2px;
  --p-1: 4px;
  --p-1-5: 6px;
  --p-2: 8px;
  --p-3: 12px;
  --p-4: 16px;
  --p-5: 20px;
  --p-6: 24px;
  --p-7: 28px;
  --p-8: 32px;
  --p-9: 36px;
  --p-10: 40px;
  --p-12: 48px;
  --p-14: 56px;
  --p-16: 64px;
  --p-18: 72px;
  --p-20: 80px;
  --p-22: 88px;
  --p-24: 96px;
  --p-26: 104px;
  --p-28: 112px;
  --p-30: 120px;
  --p-32: 128px;
  --p-34: 136px;
  --p-36: 144px;
  --p-38: 152px;
  --p-40: 160px;
  --gap-0-5: 2px;
  --gap-1: 4px;
  --gap-1-5: 6px;
  --gap-2: 8px;
  --gap-3: 12px;
  --gap-4: 16px;
  --gap-5: 20px;
  --gap-6: 24px;
  --gap-7: 28px;
  --gap-8: 32px;
  --gap-9: 36px;
  --gap-10: 40px;
  --gap-12: 48px;
  --gap-14: 56px;
  --gap-16: 64px;
  --gap-18: 72px;
  --gap-20: 80px;
  --gap-22: 88px;
  --gap-24: 96px;
  --gap-26: 104px;
  --rounded-sm: 4px;
  --rounded-md: 6px;
  --rounded-lg: 8px;
  --rounded-xl: 12px;
  --rounded-2xl: 16px;
  --rounded-3xl: 24px;
  --rounded-4xl: 32px;
  --rounded-full: 9999px;
  --stroke-1: 1px;
  --stroke-2: 2px;
  --stroke-3: 3px;
  --font-family-pretendard: "Pretendard";
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-size-title-medium: 18px;
  --font-size-title-small: 16px;
  --font-size-title-xlarge: 22px;
  --font-size-title-2xlarge: 28px;
  --font-size-title-3xlarge: 30px;
  --font-size-body-large: 16px;
  --font-size-body-medium: 14px;
  --font-size-body-small: 13px;
  --font-size-caption-medium: 12px;
  --font-size-component-large: 16px;
  --font-size-component-2xsmall: 11px;
  --font-size-component-xlarge: 18px;
  --font-size-component-3xlarge: 22px;
  --font-size-component-medium: 14px;
  --font-size-component-small: 13px;
  --font-size-component-xsmall: 12px;
  --font-size-component-2xlarge: 20px;
}

@media (min-width: 768px) {
  .campaign-popup {
    --font-size-title-medium: 22px;
    --font-size-title-small: 18px;
    --font-size-title-xlarge: 28px;
    --font-size-title-2xlarge: 38px;
    --font-size-title-3xlarge: 48px;
    --font-size-body-large: 18px;
    --font-size-body-medium: 16px;
    --font-size-body-small: 14px;
  }
}
.campaign-popup {
  --state-error-text: var(--color-red-70);
  --transition-base: 0.15s ease;
  --duration-instant: 100ms;
  --duration-fast: 150ms;
  --duration-base: 250ms;
  --duration-slow: 400ms;
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out: cubic-bezier(0.2, 0, 0, 1);
  --ease-in: cubic-bezier(0.4, 0, 1, 1);
  --overlay-backdrop: var(--color-alpha-black-50);
  --shadow-popover:
    0 10px 15px -3px rgba(25, 27, 30, 0.03), 0 4px 6px -2px rgba(25, 27, 30, 0.06);
  --scrollbar-size: 0px;
}

.campaign-popup {
  font-family: "Pretendard Variable", "Pretendard", -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Noto Sans KR", sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: var(--label-normal);
}

:where(.campaign-popup),
:where(.campaign-popup) *,
:where(.campaign-popup) ::before,
:where(.campaign-popup) ::after {
  box-sizing: border-box;
}

:where(.campaign-popup) :where(h2, p, fieldset, legend, label, figure, ul, ol, li) {
  margin: 0;
  padding: 0;
}

:where(.campaign-popup) :where(ul, ol) {
  list-style: none;
}

:where(.campaign-popup) :where(img) {
  display: block;
  max-width: 100%;
  height: auto;
}

:where(.campaign-popup) :where(input, button) {
  font: inherit;
}

:where(.campaign-popup) :where(a) {
  color: inherit;
  text-decoration: none;
}