@charset "UTF-8";
/* mo */
@media screen and (max-width: 680px) {

  /* 공통 */
  .min_wrap {
    min-width: 360px;
    width: 100%;
    overflow: hidden;
  }
  .blind {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
  }

  /* 하단 고정 버튼 */
  .fixed_btn {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10;
    min-width: 360px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 16px;
    pointer-events: none;
  }
  .fixed-notice {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 6px 12px;
    background: #ffffff;
    border: 2px solid #ef5000;
    border-radius: 99px;
    box-shadow: 0 5px 11px rgba(238, 65, 0, 0.1), 0 19px 19px rgba(238, 65, 0, 0.09), 0 44px 26px rgba(238, 65, 0, 0.05);
    opacity: 0;
    width: 57px; /* 축소 상태 */
    overflow: hidden;
    white-space: nowrap;
    transform: translateY(46px) scale(0.84);
      transition: transform 0.24s ease-in, opacity 0.18s ease-in,
      width 0.28s cubic-bezier(0.2, 0.9, 0.25, 1) 0.22s;
    pointer-events: none;
  }
  .fixed-notice.is-shown {
    opacity: 1;
    transform: translateY(0) scale(1);
    animation: notice-pop-in 0.5s cubic-bezier(0.2, 0.9, 0.25, 1) both;
  }
  .fixed-notice-txt {
    font-size: 12px;
    line-height: 18px;
    letter-spacing: -0.6px;
    font-weight: 700;
    color: #444444;
    white-space: nowrap;
    display: flex;
    align-items: center;
  }
  .fixed-notice-txt.is-changing {
    animation: notice-swap 0.42s cubic-bezier(0.2, 0.9, 0.25, 1) both;
  }
  /* 하단 안내 pill */
  /* 실측 고정값 */
  .fixed-notice.is-shown.step-1 {
    width: 211px;
  }
  .fixed-notice.is-shown.step-2 {
    width: 236px;
  }
  .fixed-notice.is-shown.step-3 {
    width: 249px;
  }
  .fixed-notice.is-shown.step-4 {
    width: 317px;
  }
  .notice-part {
    height: 18px;
    overflow: hidden;
  }
  .notice-roll {
    display: flex;
    align-items: center;
    transition: transform 0.24s cubic-bezier(0.2, 0.9, 0.25, 1), opacity 0.18s ease-out;
  }
  .notice-part.is-out .notice-roll {
    transform: translateY(-115%);
    opacity: 0;
  }
  .notice-part.is-pre .notice-roll {
    transform: translateY(115%);
    opacity: 0;
    transition: none;
  }
  .notice-dot {
    padding: 0 3px 0 0;
    font-weight: 500;
  }

  .notice-event {
    font-weight: 700;
  }
  .notice-label {
    font-weight: 500;
  }
  .notice-amount {
    color: #ef5000;
    font-weight: 700;
  }
  #go_apply_fixed {
    width: 328px;
    height: 58px;
    border-radius: 12px;
    overflow: hidden;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: auto;
    opacity: 0;
    transition: opacity 0.3s ease;
  }
  .button-apply {
    width: 328px;
    height: 58px;
  }

  /* 키비주얼 */
  .kv {
    width: 100%;
    position: relative;
    overflow: hidden;
    background: linear-gradient(180deg, #ffc481 0%, #ffd18e 3%, #ffebc2 19.231%, #fff5df 100%);
  }
  .kv-inner {
    position: relative;
    max-width: 360px;
    margin: 0 auto;
    padding: 72px 24px 64px;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .bg-autumn-scatter {
    position: absolute;
    top: 23px;
    left: 50%;
    transform: translateX(-50%);
    width: 424px;
    height: 175px;
    z-index: 1;
  }
  .bg-leaf {
    position: absolute;
    top: 0;
    left: 0;
    width: 41px;
    height: 48px;
    z-index: 1;
  }
  .bg-decoration-small {
    position: absolute;
    top: 50%;
    right: -10px;
    transform: translateY(-50%);
    width: 29px;
    height: 36px;
    z-index: 1;
  }
  .bg-autumn-city {
    position: absolute;
    bottom: -21px;
    left: 50%;
    transform: translateX(-50%);
    width: 474px;
    height: 189px;
    z-index: 1;
  }
  .kv-head {
    position: relative;
    z-index: 2;
    width: 260px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 32px;
  }
  .kv-promotion {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
  }
  .kv-badge {
    width: 87px;
    height: 22px;
  }
  .kv-title {
    width: 252px;
    height: 60px;
  }
  .kv-tab-filter {
    width: 100%;
    height: 32px;
    padding: 2px;
    display: flex;
    border-radius: 99px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.7) 0%, rgba(255, 255, 255, 0.3) 43.75%), #ffecc6;
    box-shadow: 0 5px 11px rgba(238, 65, 0, 0.1), 0 19px 19px rgba(238, 65, 0, 0.09), 0 44px 26px rgba(238, 65, 0, 0.05);
  }
  .kv-tab {
    width: 128px;
    height: 28px;
    background-image: url("../../static/images/localikit1520_84benefit_2611/loca-likit.png");
    background-repeat: no-repeat;
    background-size: 592px 60px;
    }
  .kv-tab-1 {
    background-position: -304px -17.25px;
  }
  .kv-tab-1.active {
    background-position: -16px -16px;
  }
  .kv-tab-2 {
    background-position: -448.5px -16px;
  }
  .kv-tab-2.active {
    background-position: -160px -16px;
  }

  .card-cnt-area {
    position: relative;
    z-index: 2;
    width: 100%;
    height: 420px;
    display: flex;
    align-items: flex-start;
    gap: 8px;
  }
  .card-item {
    flex: 1 0 0;
    min-width: 0;
    height: 420px;
    padding-top: 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    transform-origin: center center;
    transition: width 0.42s cubic-bezier(0.32, 0.72, 0, 1), transform 0.42s cubic-bezier(0.32, 0.72, 0, 1), opacity 0.28s ease-out;
  }
  .card-img-box {
    width: 100px;
    height: 159px;
    flex-shrink: 0;
    cursor: pointer;
    filter: drop-shadow(0 5px 5.5px rgba(238, 65, 0, 0.1)) drop-shadow(0 19px 9.5px rgba(238, 65, 0, 0.09)) drop-shadow(0 44px 13px rgba(238, 65, 0, 0.05));
    transition: width 0.42s cubic-bezier(0.32, 0.72, 0, 1), height 0.42s cubic-bezier(0.32, 0.72, 0, 1);
  }
  .card-img-box .card-img {
    width: 100%;
    height: 100%;
  }
  .kv-move-area {
    width: 100%;
    flex: 1 0 0;
    min-height: 0;
    background: #ffffff;
    border-radius: 12px;
    padding: 12px 8px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    transition: padding 0.42s cubic-bezier(0.32, 0.72, 0, 1), opacity 0.28s ease-out;
  }
  .kv-title-area {
    flex: 1 0 0;
    min-height: 0;
    width: 100%;
    padding: 0 4px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
  }
  .kv-card-title {
    width: 105px;
    height: 29px;
  }
  .kv-min-title {
    width: 110px;
    height: 34px;
  }
  .kv-rate-area {
    width: 100%;
    padding: 0 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
  }
  .kv-rate-box {
    flex: 1 0 0;
    min-width: 0;
    background: #f5f3ec;
    border-radius: 8px;
    padding: 8px 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .kv-rate-img {
    width: 44px;
    height: 44px;
  }
  .kv-detail-btn {
    width: 100%;
    padding: 8px 4px 10px 12px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    overflow: hidden;
  }
  .card-item-1 .kv-detail-btn {
    background: rgba(0, 147, 55, 0.1);
    border: 0.5px solid #00aa1e;
  }
  .card-item-2 .kv-detail-btn {
    background: rgba(0, 118, 180, 0.1);
    border: 0.5px solid #00a0e8;
  }
  .kv-btn-label {
    width: 93px;
    height: 26px;
  }
  .icon-chevron-right {
    width: 11px;
    height: 11px;
    position: relative;
    flex-shrink: 0;
  }
  .icon-chevron-right::before {
    content: "";
    position: absolute;
    top: 3px;
    left: 2px;
    width: 5px;
    height: 5px;
    border-top: 1.6px solid currentColor;
    border-right: 1.6px solid currentColor;
    transform: rotate(45deg);
  }
  .card-item-1 .icon-chevron-right {
    color: #009337;
  }
  .card-item-2 .icon-chevron-right {
    color: #0076b4;
  }

  .card-item.active {
    position: absolute;
    top: 0;
    left: 0;
    width: 312px;
    z-index: 1;
  }
  .card-item.active .card-img-box {
    width: 110px;
    height: 174.9px;
  }
  .card-item.active .kv-move-area {
    padding: 12px 24px;
  }
  .card-item.active .kv-title-area {
    flex-direction: row;
    gap: 12px;
  }
  .card-item.active .kv-rate-img {
    width: 55.75px;
    height: 55.25px;
  }
  .card-item.active .kv-btn-label {
    width: 114.31px;
    height: 32.92px;
  }

  .card-item.disable {
    position: absolute;
    top: 0;
    width: 40px;
    padding-top: 16px;
    gap: 0;
    z-index: 2;
  }
  .card-item-1.disable {
    left: 0;
    right: auto;
  }
  .card-item-2.disable {
    right: 0;
    left: auto;
  }
  .card-item.disable .card-img-box {
    width: 40px;
    height: 63.6px;
    filter: drop-shadow(0 4px 5px rgba(238, 65, 0, 0.2));
  }
  .card-item.disable .kv-move-area {
    opacity: 0;
    pointer-events: none;
  }

  .card-cnt-area.is-resting .card-item {
    transition: transform 1100ms cubic-bezier(0.4, 0, 0.2, 1);
  }
  .card-cnt-area.is-resting .is-breathing-active {
    transform: scale(1.04);
  }
  .card-cnt-area.is-resting .is-breathing-inactive {
    transform: scale(0.96);
  }

  /* EVENT 요약 */
  .cont-1 {
    width: 100%;
    background: #433531;
  }
  .cont-inner {
    max-width: 360px;
    margin: 0 auto;
    padding: 32px 16px 24px;
    display: flex;
    align-items: stretch;
    justify-content: center;
    gap: 4px;
  }
  .cont-item {
    flex: 1 0 0;
    min-width: 0;
    background: #fdfbf4;
    border-radius: 18px;
    padding: 14px 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
  }
  .cont-badge {
    padding: 5px 8px 4px;
    border-radius: 99px;
    background: #ef5000;
    color: #fdfbf4;
    font-size: 8px;
    line-height: 1;
    font-weight: 700;
    white-space: nowrap;
  }
  .cont-txt {
    width: 79px;
    height: 58px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
  }
  .cont-amount {
    display: flex;
    align-items: center;
    gap: 1px;
    color: #ef5000;
  }
  .cont-amount .unit {
    font-size: 8px;
    line-height: 1;
    font-weight: 700;
    text-align: center;
  }
  .cont-amount .amount {
    font-size: 18px;
    line-height: 1.15;
    letter-spacing: -0.9px;
    font-weight: 700;
  }
  .cont-label {
    font-size: 11px;
    line-height: 13px;
    letter-spacing: -0.55px;
    font-weight: 700;
    color: #444444;
    text-align: center;
  }

  /* EVENT 본문 */
  .eve {
    width: 100%;
    background: #fbe9ca;
  }
  .eve-inner {
    max-width: 360px;
    margin: 0 auto;
    padding: 60px 16px;
    display: flex;
    flex-direction: column;
    gap: 60px;
  }
  .eve-item {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
  }
  .eve-head {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
  }
  .eve-badge {
    padding: 7px 10px 6px;
    border-radius: 99px;
    background: #ef5000;
    color: #ffffff;
    font-size: 12px;
    line-height: 1;
    font-weight: 700;
    white-space: nowrap;
  }
  .eve-visual {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
  }
  .heading-discount-coupon {
    width: 232px;
    height: 42px;
  }
  .heading-shipping-discount {
    width: 228px;
    height: 66px;
  }
  .heading-membership-benefits {
    width: 262px;
    height: 87px;
  }
  .heading-amex-benefits {
    width: 290px;
    height: 55px;
  }
  .banner-cashback {
    width: 242px;
    height: 156px;
  }
  .banner-instant-discount {
    width: 328px;
    height: 109px;
  }
  .heading-starbucks {
    width: 262px;
    height: 104px;
  }
  .banner-starbucks-coupon {
    width: 220px;
    height: 134px;
  }
  .illustration-gift-box {
    width: 210px;
    height: 151px;
  }

  .chip-row {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
  }
  .chip-entry {
    width: 162px;
    height: 45px;
    display: flex;
    flex-direction: column;
  }
  .chip-entry-1 {
    align-items: flex-end;
  }
  .chip-entry-2 {
    align-items: flex-start;
  }
  .chip-tail {
    width: 32px;
    height: 7px;
    position: relative;
    flex-shrink: 0;
  }
  .chip-tail::after {
    content: "";
    position: absolute;
    left: 10px;
    top: 0;
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 7px solid #fdfbf4;
  }
  .chip-body {
    width: 100%;
    height: 38px;
    background: #fdfbf4;
    border-radius: 8px;
    padding: 8px 11px 8px 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 3px;
  }
  .badge-required {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
    padding-top: 1px;
  }
  .badge-required-pill {
    background: rgba(239, 80, 0, 0.15);
    border-radius: 4px;
    padding: 4px 6px 3px;
    font-size: 10px;
    line-height: 1;
    letter-spacing: -0.5px;
    font-weight: 700;
    color: #ef5000;
    white-space: nowrap;
  }
  .badge-required-check {
    flex-shrink: 0;
    width: 12px;
    height: 12px;
    border-radius: 3px;
    background: #ef5000;
    position: relative;
  }
  .badge-required-check::after {
    content: "";
    position: absolute;
    left: 4px;
    top: 2px;
    width: 3px;
    height: 6px;
    border: solid #fdfbf4;
    border-width: 0 1.5px 1.5px 0;
    transform: rotate(45deg);
  }
  .chip-txt {
    font-size: 13px;
    line-height: 21px;
    letter-spacing: -0.65px;
    font-weight: 700;
    color: #444444;
    white-space: nowrap;
  }

  .toggle-box {
    width: 100%;
    border-radius: 18px;
    overflow: hidden;
  }
  .eve-toggle-btn {
    width: 100%;
    height: 45px;
    background: #ef5000;
    padding: 13px 24px;
    display: flex;
    align-items: center;
    gap: 8px;
  }
  .icon-toggle {
    width: 12px;
    height: 12px;
    flex-shrink: 0;
    transform: rotate(90deg);
    transition: transform 0.3s ease;
  }
  .eve-toggle-btn.open .icon-toggle {
    transform: rotate(-90deg);
  }
  .toggle-txt {
    font-size: 15px;
    line-height: 19px;
    letter-spacing: -0.75px;
    font-weight: 700;
    color: #ffffff;
  }
  .eve-detail-body {
    width: 100%;
    background: #ffffff;
      padding: 18px 22px 32px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
  }

  .detail-block {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  .detail-title {
    font-size: 12px;
    line-height: 1.15;
    letter-spacing: -0.6px;
    font-weight: 700;
    color: #ef5000;
  }
  .detail-title-inline {
    display: flex;
    align-items: center;
    gap: 1.17px;
  }
  .detail-title-sub {
    font-size: 12px;
    line-height: 1.15;
    letter-spacing: -0.6px;
    font-weight: 400;
    color: #444444;
  }
  .detail-cnt {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .main-desc {
    font-size: 14px;
    line-height: 20px;
    letter-spacing: -0.7px;
    font-weight: 700;
    color: #444444;
  }
  .point {
    color: #ef5000;
  }
  .small {
    font-size: 13px;
    line-height: 19px;
    letter-spacing: -0.65px;
    font-weight: 400;
  }
  .tiny {
    font-size: 11px;
    line-height: 20px;
    letter-spacing: -0.55px;
    font-weight: 400;
  }
  .sub-list {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 2px;
  }
  .sub-list li {
    display: flex;
    align-items: flex-start;
    gap: 1px;
    font-size: 11px;
    line-height: 15px;
    letter-spacing: -0.5px;
    font-weight: 400;
    color: #444444;
  }
  .sub-list .mark {
    flex-shrink: 0;
    width: 7px;
  }
  .sub-list .mark-ref {
    width: 11px;
    margin-right: 2px;
  }
  /* 유의사항 리스트 */
  .notice-list .mark {
    font-weight: 700;
  }
  .notice-list .txt {
    font-weight: 500;
  }
  .notice-list.mark-regular .mark {
    font-weight: 400;
  }
  .weight-regular {
    font-weight: 400;
  }
  .method-item {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .method-head {
    display: flex;
    align-items: flex-start;
    gap: 4px;
    font-size: 14px;
    line-height: 19px;
    font-weight: 700;
    color: #444444;
  }
  .method-head .num {
    flex-shrink: 0;
    letter-spacing: -0.7px;
    font-weight: 700;
  }
  .method-head .desc {
    line-height: 18px;
    letter-spacing: -0.5px;
    font-weight: 700;
  }
  .method-sub {
    padding-left: 18px;
  }
  .pay-list {
    display: flex;
    flex-direction: column;
    gap: 2px;
  }

  .table-box {
    width: 100%;
    padding: 0 18px;
  }
  .eve-table {
    width: 100%;
    background: #ffffff;
    border-radius: 2px;
    border-top: 1px solid rgba(68, 68, 68, 0.14);
    border-bottom: 1px solid rgba(68, 68, 68, 0.14);
  }
  .eve-table th {
    padding: 6px 0;
    background: rgba(68, 68, 68, 0.06);
    font-size: 14px;
    line-height: 18px;
    letter-spacing: -0.5px;
    font-weight: 700;
    color: #444444;
    text-align: center;
    border-bottom: 1px solid rgba(68, 68, 68, 0.18);
  }
  .eve-table td {
    padding: 6px 0;
    font-size: 13px;
    line-height: 19px;
    letter-spacing: -0.65px;
    font-weight: 400;
    color: #444444;
    text-align: center;
    border-bottom: 1px solid rgba(68, 68, 68, 0.18);
  }
  .eve-table th:first-child,
  .eve-table td:first-child {
    border-right: 1px solid rgba(68, 68, 68, 0.18);
  }
  .eve-table tr:last-child td {
    border-bottom: 0;
  }

  .condition-box {
    width: 100%;
    background: #fdf9f5;
    border-top: 1px solid rgba(140, 88, 50, 0.1);
    border-bottom: 1px solid rgba(140, 88, 50, 0.1);
    padding: 10px 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  .condition-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .condition-item {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .condition-head {
    display: flex;
    align-items: flex-start;
    gap: 3px;
    font-size: 11px;
    line-height: 15px;
    letter-spacing: -0.55px;
    font-weight: 700;
    color: #444444;
    opacity: 0.88;
  }
  .condition-head .num,
  .condition-head .txt {
    font-weight: 700;
  }
  .dot-list {
    padding-left: 14px;
    display: flex;
    flex-direction: column;
    gap: 2px;
  }
  .dot-list li {
    display: flex;
    align-items: flex-start;
    gap: 1px;
    font-size: 10px;
    line-height: 13px;
    letter-spacing: -0.5px;
    font-weight: 400;
    color: #444444;
    opacity: 0.88;
  }
  .dot-list li.indent {
    padding-left: 8px;
  }
  .dot-list li.bold {
    font-weight: 700;
  }
  .dot-list .mark {
    flex-shrink: 0;
    margin-right: 2px;
  }

  .info-box {
    width: 100%;
    background: #fdf9f5;
    border-radius: 8px;
    padding: 16px 12px;
    display: flex;
    flex-direction: column;
    gap: 16px;
  }
  .info-item {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .info-label {
    font-size: 12px;
    line-height: 1.15;
    letter-spacing: -0.6px;
    font-weight: 700;
    color: #868583;
  }
  .info-highlight {
    background: rgba(239, 80, 0, 0.11);
    border-radius: 8px;
    padding: 8px 12px;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: -0.7px;
    font-weight: 700;
    color: #ef5000;
  }

  /* EVENT4 로고 배너 */
  .flow-banner {
    width: 100%;
    height: 24px;
    overflow: hidden;
  }
  .flow-track {
    height: 24px;
    display: flex;
    align-items: center;
    gap: 16px;
    width: max-content;
    animation: flow-scroll 22s linear infinite;
  }
  .flow-track img {
    height: 24px;
    flex-shrink: 0;
  }
  .logo-naver-membership {
    width: 69px;
  }
  .logo-coupang-wow {
    width: 138px;
  }
  .logo-youtube-premium {
    width: 130px;
  }
  .logo-tving {
    width: 72px;
  }
  .logo-netflix {
    width: 72px;
  }
  .logo-baemin {
    width: 78px;
  }
  .logo-ssg7club {
    width: 100px;
  }
  .logo-wavve {
    width: 85px;
  }

  /* EVENT4 멤버십 카드 */
  .benefit-list {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: 2px;
  }
  .benefit-item {
    width: 163px;
    height: 145px;
    background: #ffffff;
    border-radius: 24px;
    overflow: hidden;
    padding: 14px 12px 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
  }
  .benefit-name-box {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
  }
  .benefit-name {
    font-size: 13px;
    line-height: 1.15;
    letter-spacing: -0.65px;
    font-weight: 700;
    color: #444444;
    white-space: nowrap;
  }
  .benefit-price {
    font-size: 11px;
    line-height: 14px;
    letter-spacing: -0.55px;
    font-weight: 400;
    color: #444444;
    white-space: nowrap;
  }
  .benefit-points {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 1px;
  }
  .benefit-points li {
    display: flex;
    align-items: flex-start;
    gap: 3px;
    font-size: 10px;
    line-height: 12px;
    letter-spacing: -0.5px;
    font-weight: 500;
    color: #444444;
  }
  .benefit-points .txt {
    font-weight: 500;
  }
  .benefit-points .dot {
    width: 2px;
    height: 2px;
    border-radius: 50%;
    background: #444444;
    margin: 5px 0;
    flex-shrink: 0;
  }
  .benefit-thumb-1,
  .benefit-thumb-2,
  .benefit-thumb-3,
  .benefit-thumb-4,
  .benefit-thumb-5,
  .benefit-thumb-6,
  .benefit-thumb-7,
  .benefit-thumb-8 {
    width: 60px;
    height: 44px;
  }

  /* AMEX 이동 버튼 */
  /* EVENT 요약 - EVENT 4 강조 문구 */
  .cont-label-point {
    font-size: 12px;
    line-height: 1.15;
    letter-spacing: -0.6px;
    color: #ef5000;
  }
  /* EVENT 4 크레딧케어 */
  .detail-cnt-lg {
    gap: 24px;
  }
  .svc-box {
    position: relative;
    width: 100%;
    background: #fbf9f8;
    border: 1px solid #ef5000;
    border-radius: 12px;
    padding: 24px 16px 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  .svc-badge {
    position: absolute;
    left: 16px;
    top: -13px;
    padding: 4px 12px;
    border-radius: 99px;
    background: #ef5000;
    font-size: 12px;
    line-height: 18px;
    letter-spacing: 0;
    font-weight: 700;
    color: #ffffff;
    white-space: nowrap;
  }
  .svc-item {
    display: flex;
    align-items: center;
    gap: 12px;
  }
  .svc-txt {
    width: 160px;
    display: flex;
    flex-direction: column;
    gap: 3px;
  }
  .svc-name {
    font-size: 12px;
    line-height: 16px;
    letter-spacing: 0;
    font-weight: 700;
    color: #444444;
  }
  .svc-desc {
    font-size: 11px;
    line-height: 14px;
    letter-spacing: 0;
    font-weight: 500;
    color: #444444;
  }
  .evt-img-4 {
    width: 80px;
    height: 80px;
    flex-shrink: 0;
  }
  .amex-btn {
    width: 100%;
    padding: 10px 8px 10px 16px;
    border-radius: 8px;
    background: rgba(239, 80, 0, 0.1);
    border: 0.5px solid #ff5f00;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    position: relative;
    overflow: hidden;
  }
  .amex-btn-txt {
    font-size: 16px;
    line-height: 21px;
    letter-spacing: -0.8px;
    font-weight: 700;
    color: #ef5000;
    text-align: center;
  }
  .icon-chevron-circle {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
  }

  /* 유의사항 */
  .footer {
    width: 100%;
    background: #f4f4f4;
      padding-bottom: calc(constant(safe-area-inset-bottom) + 129px);
    padding-bottom: calc(env(safe-area-inset-bottom) + 129px);
  }
  .footer-inner {
      max-width: 1000px;
    margin: 0 auto;
    padding: 38px 16px 64px;
  }

  .footer-title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 18px;
  }
  .icon-alert {
    width: 24px;
    height: 24px;
  }
  .footer-title h2 {
    font-size: 18px;
    line-height: 22px;
    letter-spacing: -0.9px;
    font-weight: 700;
    color: #111111;
  }
  .footer-list {
    display: flex;
    flex-direction: column;
    gap: 18px;
  }
  .footer-block {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .footer-heading {
    display: inline-flex;
    align-self: flex-start;
    padding: 0 20px;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: -0.7px;
    font-weight: 700;
    color: #111111;
  }
  .footer-txt li {
    list-style: disc;
    margin-left: 21px;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: -0.7px;
    font-weight: 400;
    color: #111111;
  }
  .footer-txt li.bold,
  .footer-txt .bold {
    font-weight: 700;
  }
  .footer-txt li.underline {
    text-decoration: underline;
  }
  .footer-mark-list li {
    display: flex;
    align-items: flex-start;
    gap: 4px;
    padding-left: 4px;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: -0.7px;
    font-weight: 700;
    color: #111111;
  }
  .footer-mark-list.regular li {
    font-weight: 400;
  }
  .footer-mark-list li.indent {
    padding-left: 20px;
  }
  .footer-mark-list .mark {
    flex-shrink: 0;
    width: 13px;
  }

  /* 키프레임 */




  /* 모션 줄이기 */


}