/* P3 only. Terms supplied by the advertiser on 2026-09-10.
   The first payment is INCLUDED in the total 5% deposit, not an extra charge. */
#k_popup2.osan-single-banner-popup.show { animation: none; }
#k_popup2.osan-single-banner-popup .popup { width: 100%; min-height: 100dvh; display: flex; justify-content: center; align-items: center; padding: 14px 16px; }
#k_popup2.osan-single-banner-popup .pop_content { width: min(420px, calc(66.6667dvh - 176px), 100%); max-width: 420px; top: 0; margin: 0; }
#k_popup2.osan-single-banner-popup .popup_close_txt { padding: 11px 14px; margin-bottom: 8px; }
#k_popup2 .claude-popup-card.osan-contract-banner {
  clear: both;
  display: block;
  height: auto;
  min-height: 0;
  max-height: calc(100dvh - 74px);
  overflow-y: auto;
  overscroll-behavior: contain;
  background: #052443;
  border-radius: 10px;
  color: #fff;
}
#k_popup2 .osan-contract-banner .osan-contract-banner-image {
  position: relative;
  display: block;
  width: 100%;
  float: none;
  line-height: 0;
}
#k_popup2 .osan-contract-banner .osan-banner-phone-hit {
  position: absolute;
  left: 4%;
  top: 64.4%;
  width: 89%;
  height: 11.2%;
  display: block;
  float: none;
  border-radius: 8px;
}
#k_popup2 .osan-banner-phone-hit:focus-visible { outline: 3px solid #fff; outline-offset: -3px; }
#k_popup2 .osan-contract-banner img {
  display: block;
  float: none;
  width: 100%;
  height: auto;
  object-fit: contain;
}
#k_popup2 .osan-contract-banner-caption { padding: 12px 14px; text-align: center; }
#k_popup2 .osan-contract-banner-caption p { margin: 0 0 8px; color: #fff; font-size: 12px; line-height: 1.55; word-break: keep-all; }
#k_popup2 .osan-contract-banner-caption p + p { color: #d4dfeb; font-size: 11px; }
#k_popup2 .osan-contract-banner-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
#k_popup2 .osan-contract-banner .osan-contract-banner-cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  min-width: 0;
  min-height: 60px;
  padding: 8px 4px;
  box-sizing: border-box;
  color: #06243b;
  background: #efd79e;
  border: 1px solid #efd79e;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
  text-decoration: none;
  white-space: nowrap;
}
#k_popup2 .osan-contract-banner-cta span { font-size: 12px; font-weight: 500; }
#k_popup2 .osan-contract-banner-cta strong { font-size: 16px; font-weight: 700; }
#k_popup2 .osan-contract-banner .osan-contract-banner-call { color: #fff; background: #103754; }
#k_popup2 .osan-contract-banner-cta:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.osan-offer-poster { margin-top: 20px; }
.osan-offer-poster summary { cursor: pointer; text-decoration: underline; text-underline-offset: 4px; }
.osan-offer-poster img { display: block; width: 100%; max-width: 600px; height: auto; margin: 16px auto 0; }
#section1 .offer-badge {
  /* Keep the badge in the upper-right safe area and scale its copy with the star. */
  --offer-star-size: clamp(180px, 18vw, 250px);
  display: flex !important;
  width: var(--offer-star-size);
  height: var(--offer-star-size);
  top: clamp(48px, 9vh, 96px);
  right: clamp(0px, 1.2vw, 18px);
  left: auto;
  bottom: auto;
}
#section1 .offer-badge-first {
  left: 32px;
  right: auto;
  /* section1 includes SUMMARY on mobile: anchor to the hero viewport, not its full height. */
  top: calc(100vh - var(--offer-star-size) - 100px);
  top: calc(100dvh - var(--offer-star-size) - 100px);
}
#section1 .offer-badge .by_bn_bg {
  /* The reference keeps the star still; only its SVG perimeter lettering travels. */
  background: url('data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=') center / contain no-repeat;
  filter: drop-shadow(0 4px 10px rgba(60, 45, 25, .3));
  animation: none;
}
#section1 .offer-badge-first .by_bn_bg {
  background-image: url('data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=');
  filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .45));
}
/* Enlarge the star independently of its copy, preserving a generous inner safe zone. */
#section1 .offer-badge .by_bn_txt {
  width: clamp(82px, calc(var(--offer-star-size) * .47), 130px);
  height: clamp(82px, calc(var(--offer-star-size) * .47), 130px);
  box-sizing: border-box;
}
#section1 .offer-badge h4 {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  margin: 0;
  color: #fff;
  font-family: 'Noto Sans KR', sans-serif;
  font-size: clamp(9px, calc(var(--offer-star-size) * .052), 15px);
  font-weight: 500;
  line-height: 1.25;
  letter-spacing: -.035em;
  max-width: 88%;
  text-align: center;
  white-space: normal;
  overflow-wrap: keep-all;
  text-shadow: 0 1px 4px rgba(0, 0, 0, .45);
}
#section1 .offer-badge h4 span { display: block; max-width: 100%; overflow-wrap: keep-all; }
#section1 .offer-badge h4 strong {
  font-size: clamp(18px, calc(var(--offer-star-size) * .143), 40px);
  font-weight: 650;
  line-height: 1.1;
}
#section1 .offer-badge h4 small { font-size: clamp(14px, calc(var(--offer-star-size) * .093), 26px); }
#section1 .offer-badge-first h4 strong { font-size: clamp(18px, calc(var(--offer-star-size) * .136), 38px); }
.osan-hero-offer {
  position: absolute;
  z-index: 20;
  top: calc(50vh - 12px);
  top: calc(50dvh - 12px);
  left: 50%;
  transform: translateX(-50%);
  width: min(530px, calc(100% - 32px));
  box-sizing: border-box;
  text-align: center;
  color: #fff;
  font-family: 'Noto Sans KR', sans-serif;
  line-height: 1.5;
  text-shadow: 0 1px 5px #002b40;
}
.osan-offer-gift {
  display: inline-block;
  padding: 8px 20px;
  border: 1px solid rgba(230, 206, 163, .75);
  border-radius: 999px;
  background: rgba(0, 37, 57, .87);
  font-size: 18px;
  letter-spacing: -.035em;
}
.osan-offer-gift strong { color: #f4dbac; font-weight: 650; }
.osan-hero-offer .osan-offer-blocks { margin: 7px 0 4px; font-size: 13px; color: #f4dbac; }
.osan-hero-offer .osan-offer-terms { margin: 0; font-size: 14px; }
.osan-hero-offer .osan-offer-gift-note { margin: 5px 0; font-size: 12px; }
.osan-offer-detail { display: inline-block; color: inherit; padding: 5px 10px; font-size: 13px; text-decoration: underline; text-underline-offset: 4px; }
.osan-offer-detail:focus-visible { outline: 2px solid #f4dbac; outline-offset: 3px; }

/* Keep long project headlines clear of the upper-right flowing-star badge. */
@media (min-width: 1101px) {
  #section1 .offer-badge { top: clamp(8px, 1.8vh, 22px); }
  #section1 .main_txt_box h2 {
    max-width: clamp(760px, calc(100vw - 500px), 1080px);
    margin-inline: auto;
    white-space: normal !important;
    overflow-wrap: keep-all;
    text-wrap: balance;
    font-size: clamp(42px, 5.2vw, 67px) !important;
    line-height: 1.18 !important;
  }
  #section1 .main_txt_box p { max-width: min(760px, calc(100vw - 520px)); margin-inline: auto; }
}
@media (min-width: 768px) and (max-width: 1100px) {
  #section1 .offer-badge { top: clamp(10px, 2.2vh, 28px); }
  #section1 .main_txt_box h2 {
    max-width: calc(100vw - 380px);
    margin-inline: auto;
    white-space: normal !important;
    overflow-wrap: keep-all;
    font-size: clamp(34px, 5vw, 58px) !important;
    line-height: 1.18 !important;
  }
}
@media (max-width: 767px) {
  #section1 .main_txt_box h2 {
    max-width: calc(100vw - 32px);
    white-space: normal !important;
    overflow-wrap: keep-all;
    text-wrap: balance;
    font-size: clamp(24px, 7.5vw, 44px) !important;
    line-height: 1.18 !important;
  }
}
.osan-current-offer {
  scroll-margin-top: 110px;
  max-width: 960px;
  margin: 0 auto 36px;
  padding: clamp(22px, 4vw, 40px);
  box-sizing: border-box;
  text-align: center;
  background: #f4f7f7;
  border: 1px solid #d7e1e3;
  border-top: 3px solid #7185a2;
  border-radius: 14px;
  color: #123444;
  font-family: 'Noto Sans KR', sans-serif;
  line-height: 1.6;
}
.osan-current-offer h3 { margin: 6px 0 18px; font-size: clamp(22px, 5vw, 30px); line-height: 1.45; font-weight: 600; word-break: keep-all; }
.osan-current-offer h3 span { display: inline-block; }
.osan-current-offer .osan-offer-date { margin: 0; color: #536b76; font-size: 13px; }
.osan-current-offer .osan-offer-gift { color: #fff; }
.osan-current-offer .osan-offer-terms { margin: 18px 0 8px; font-size: 15px; }
.osan-current-offer .osan-offer-gift-note { margin: 6px 0; font-size: 13px; color: #536b76; }
.osan-current-offer .osan-offer-cta { display: inline-block; margin-top: 16px; padding: 11px 24px; background: #1b2856; border-radius: 8px; color: #fff; font-weight: 600; }
@media (max-width: 1024px) {
  #section1 .offer-badge {
    --offer-star-size: clamp(156px, 24vw, 220px);
    top: clamp(42px, 7vh, 76px);
    right: clamp(8px, 2.2vw, 22px);
    left: auto;
  }
  #section1 .offer-badge-first {
    right: auto;
    left: 16px;
    top: calc(100vh - var(--offer-star-size) - 100px);
    top: calc(100dvh - var(--offer-star-size) - 100px);
  }
  #section1 .offer-badge .by_bn_txt {
    width: clamp(76px, 52%, 112px);
    height: clamp(76px, 52%, 112px);
  }
  #section1 .offer-badge h4 {
    font-size: clamp(9px, calc(var(--offer-star-size) * .052), 13px);
    gap: 2px;
    margin-top: 0;
  }
  #section1 .offer-badge h4 strong { font-size: clamp(18px, calc(var(--offer-star-size) * .136), 30px); }
  #section1 .offer-badge-first h4 strong { font-size: clamp(18px, calc(var(--offer-star-size) * .136), 30px); }
  #section1 .offer-badge h4 small { font-size: clamp(14px, calc(var(--offer-star-size) * .1), 22px); }
  .osan-hero-offer { top: 43vh; top: 43dvh; }
  .osan-offer-gift { font-size: 16px; padding: 7px 17px; }
  .osan-hero-offer .osan-offer-terms { font-size: 13px; }
}
@media (orientation: portrait) and (max-width: 1024px) {
  /* Portrait screens: keep the total-benefit star in the upper-right safe area. */
  #section1 .offer-badge-total {
    --offer-star-size: clamp(136px, 29vw, 180px);
    top: clamp(14px, 2.8dvh, 34px);
    right: clamp(6px, 2vw, 16px);
  }
  #section1 .offer-badge-total .by_bn_txt {
    width: clamp(58px, 52%, 78px);
    height: clamp(58px, 52%, 78px);
  }
  #section1 .offer-badge-total h4 {
    font-size: clamp(9px, calc(var(--offer-star-size) * .052), 12px);
    line-height: 1.15;
  }
  #section1 .offer-badge-total h4 strong { font-size: clamp(18px, calc(var(--offer-star-size) * .136), 26px); }
  #section1 .offer-badge-total h4 small { font-size: clamp(14px, calc(var(--offer-star-size) * .1), 20px); }
}
@media (max-width: 767px) {
  /* Mobile keeps the star above the headline; its copy scales with the star. */
  #section1 .offer-badge-total { --offer-star-size: clamp(128px, 29vw, 168px); top: clamp(16px, 2.8dvh, 34px); right: clamp(6px, 2vw, 10px); }
  #section1 .offer-badge-total .by_bn_txt { width: clamp(58px, 52%, 76px); height: clamp(58px, 52%, 76px); }
  #section1 .offer-badge-total h4 { margin-top: 0; font-size: clamp(9px, calc(var(--offer-star-size) * .052), 12px); line-height: 1.15; }
  #section1 .offer-badge-total h4 strong { font-size: clamp(18px, calc(var(--offer-star-size) * .136), 24px); }
  #section1 .offer-badge-total h4 small { font-size: clamp(14px, calc(var(--offer-star-size) * .1), 19px); }
  #section1 .offer-badge-first { left: 0; }
  #section1 .main_txt_box { top: 200px; height: auto; transform: none !important; }
}
@media (max-width: 359px), (max-height: 700px) and (max-width: 1024px) {
  #section1 .offer-badge-first { --offer-star-size: 200px; }
  #section1 .offer-badge-first {
    top: calc(100vh - var(--offer-star-size) - 35px);
    top: calc(100dvh - var(--offer-star-size) - 35px);
  }
  #section1 .offer-badge h4 { font-size: 12px; }
  #section1 .offer-badge h4 strong { font-size: 28px; }
  #section1 .offer-badge-first h4 { font-size: 11px; gap: 1px; }
  #section1 .offer-badge-first h4 strong { font-size: 26px; }
  .osan-hero-offer { top: 42vh; top: 42dvh; }
  .osan-hero-offer .osan-offer-gift { padding: 5px 15px; font-size: 15px; }
  .osan-hero-offer .osan-offer-blocks { margin: 3px 0; }
  .osan-hero-offer .osan-offer-gift-note { font-size: 11px; margin: 3px 0; }
}
@media (prefers-reduced-motion: reduce) {
  #section1 .offer-badge .by_bn_bg { animation: none; }
}
@media (max-height: 700px) and (max-width: 767px) {
  /* Short phones keep the star in the upper-right safe area as well. */
  #section1 .offer-badge-total { --offer-star-size: 128px; top: 12px; right: 6px; }
  #section1 .main_txt_box h2 { font-size: clamp(22px, 7.2vw, 38px) !important; }
  #section1 .main_txt_box p { margin-top: 8px !important; font-size: 10px !important; line-height: 1.4 !important; }
  #section1 .main_txt_box .osan-hero-wordmark { margin-top: 12px; }
  #section1 .main_txt_box .osan-hero-wordmark img { margin: 0 !important; max-height: 24px !important; }
  .osan-hero-offer { top: 326px; }
}
@media (max-height: 600px) and (max-width: 1024px) {
  /* Keep the full terms link above the existing fixed contact bar. */
  .osan-hero-offer .osan-offer-blocks { display: none; }
  .osan-hero-offer .osan-offer-terms { margin-top: 5px; }
}
@media (max-height: 640px) and (max-width: 767px) {
  /* Short screens scroll through the hero instead of overlapping the larger badge and terms. */
  #section1 .main_wrap, #section1 .main_box { height: 680px !important; }
  #section1 .offer-badge-first { top: calc(680px - var(--offer-star-size) - 35px); }
}