@charset "utf-8";

/* 추천 가전 모듈 커스텀 */
.event-benefit-wrap #recommended-appliances .evt-cont {
    padding-right: 0;
    padding-left: 0;
}

.event-benefit-wrap #recommended-appliances div.evt-cont:first-child {
    padding-top: 0;
}
.event-benefit-wrap #recommended-appliances div.evt-cont:first-child .title-box {
    display: none;
}

.event-benefit-wrap #recommended-appliances .title-box .sub-tit {
    margin-top: 8px;
    font-size: 20px;
    font-weight: 400;
    line-height: 30px;
    color: rgb(255 255 255 / 70%) !important;
    text-align: center;
    letter-spacing: -0.4px;
}

@media screen and (width <= 767px) {
    .event-benefit-wrap #recommended-appliances .title-box {
        padding: 0;
    }
    .event-benefit-wrap #recommended-appliances .title-box .sub-tit {
        padding: 0 calc(48 / 720 * 100vw);
        font-size: calc(28 / 720 * 100vw);
        font-weight: 500;
        line-height: 142.857%;
        text-align: left;
        letter-spacing: -0.56px;
    }
}
/* // 추천 가전 모듈 커스텀 */

/* ==========================================================================
   API Product List - 기본 스타일
   ========================================================================== */

.prdList {
    max-width: 980px;
    margin: 0 auto;
    /* padding-bottom: 56px; */
}

.prdList * {
    font-family: Pretendard, sans-serif;
}

.prdList > ul {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 48px 24px;
}

.prdList li {
    position: relative;
    max-width: 231px;
    overflow: hidden;
}

.prdList--time-deal li .img::after,
.prdList--time-deal li .pcImg::after {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 32px;
    font-size: 16px;
    font-weight: 600;
    line-height: 162.5%;
    color: #fff;
    letter-spacing: -0.32px;
    content: var(--user-stock-quantity, '');
    background-color: rgba(0, 0, 0, 0.7);
}

.prdList--time-deal li .pcImg::after {
    height: 40px;
}

/* .prdList li.stock-quantity-less-than-10 .img::after {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 32px;
    font-size: 16px;
    font-weight: 600;
    line-height: 162.5%;
    color: #fff;
    letter-spacing: -0.32px;
    content: '재고 10개 미만';
    background-color: rgba(0, 0, 0, 0.7);
}

.prdList li.stock-quantity-0 .img::after {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 32px;
    font-size: 16px;
    font-weight: 600;
    line-height: 162.5%;
    color: #fff;
    letter-spacing: -0.32px;
    content: '재고 0개';
    background-color: rgba(0, 0, 0, 0.7);
} */

/* 상품 카드 공통 */
.prdList .img {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-height: 230px;
    aspect-ratio: 1 / 1;
    margin-bottom: 16px;
    overflow: hidden;
    background: #fff;
    border-radius: 16px;
}

.prdList .img img {
    width: auto;
    height: 100%;
    max-height: 180px;
}

.prdList .badge {
    display: flex;
    flex-wrap: wrap;
    gap: 7px 9px;
    width: 100%;
    padding-bottom: 12px;
}

.prdList .badge em {
    display: inline-block;
    padding: 3px 6px;
    font-size: 15px;
    font-weight: 600;
    line-height: normal;
    color: #fff;
    letter-spacing: -0.312px;
    white-space: nowrap;
    background: #bebab2;
    border-radius: 6px;
}

.prdList .badge em.p,
.prdList .badge em.sale {
    color: #fff;
    background: #ea1917;
}

.prdList .badge em.sale + .sale {
    display: none;
}

.prdList .badge + .txt {
    padding-top: 13px;
}

.prdList .txt {
    text-align: left;
}

.prdList strong {
    display: block;
    padding-bottom: 12px;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.5;
    color: #fff;
    border-bottom: 1px solid #cec7b4;
}

.prdList strong em {
    display: block;
    padding-top: 0;
    font-size: 17px;
    font-weight: 400;
    line-height: 1.625;
    color: #7e7c77;
}

.prdList dl {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    row-gap: 6px;
    align-items: flex-start;
    padding-top: 12px;
    padding-bottom: 12px;
    white-space: nowrap;
}

.prdList .normal-member-price-area {
    display: flex;
    flex-direction: column;
    row-gap: 6px;
}

.prdList dt {
    display: none;
    font-size: 17px;
    font-weight: 700;
    color: #fff;
    letter-spacing: -0.34px;
}

.prdList .last-price-area {
    display: flex;
    column-gap: 6px;
    align-items: center;
}

.prdList .last {
    display: inline-flex;
}

.prdList dd {
    flex: 1 0 100%;
    font-size: 20px;
    font-weight: 400;
    line-height: normal;
    color: rgba(255, 255, 255, 0.9);
}

.prdList .member-price em {
    letter-spacing: -0.4px;
}
.prdList .last-price-area em {
    letter-spacing: -0.44px;
}

.prdList del {
    color: #bebab2;
}

.prdList del::after,
.prdList dl em::after {
    content: '원';
}

.prdList .lastPrice {
    flex: 1 0 50%;
}

.prdList .lastPrice em {
    font-size: 22px;
    font-weight: 600;
}

/* 버튼 */
.prdList .typeBtn {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
    /* padding-top: 12px; */
}

.prdList .typeBtn a {
    position: relative;
    display: flex;
    flex: 1;
    gap: 11px;
    align-items: center;
    justify-content: center;
    height: 44px;
    overflow: hidden;
    font-size: 17px;
    font-weight: 600;
    color: #bebab2;
    letter-spacing: -0.02em;
    cursor: pointer;
    border: 1px solid #bebab2;
    border-radius: 9px;
}

.prdList .typeBtn--white a {
    color: #bebab2;
    border: 1px solid #bebab2;
}

.prdList .typeBtn a::after {
    display: none; /* 기본 숨김, 필요시 'inline-block'으로 변경 */
    width: 8px;
    height: 14px;
    content: '';
    background: url('/kr/event/2025/08/19_lg_days/images/img_pd_arrow_right.png') no-repeat center;
    background-size: cover;
}

/* 품절 상태 */
.prdList li.soldout::before,
.prdList li.soldoutAll::before {
    position: absolute;
    inset: 0;
    z-index: 3;
    content: '';
    background: rgb(0 0 0 / 86%) url('/kr/event/2025/08/19_lg_days/images/img_soldout.png') no-repeat center;
    background-size: 140px;
}

.prdList .typeBtn a.soldout::before {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: #fff;
    content: 'SOLD OUT';
    background: rgb(0 0 0 / 80%);
    border-radius: 6px;
}

.prdList li.soldoutAll .typeBtn .soldout::before {
    display: none;
}

/* ==========================================================================
   케어십 & 아코디언 UI
   ========================================================================== */

.prdList .careCase dd em::before {
    content: '월 ';
}

.prdList .careCase .lastPrice em::after {
    content: '원 ~';
}

.prdList .careCase .careItem {
    margin-top: 8px;
    border: 1px solid #000;
    border-radius: 10px;
}

.prdList .careCase .careItem dt {
    display: flex;
    gap: 14px;
    align-items: center;
    justify-content: center;
    height: 42px;
    font-size: 17px;
    font-weight: 500;
    color: #000;
    cursor: pointer;
}

.prdList .careCase .careItem dt::after {
    display: inline-block;
    width: 14px;
    height: 8px;
    content: '';
    background: url('/kr/event/2025/08/19_lg_days/images/img_pd_arrow_down.png') no-repeat center;
    background-size: cover;
    transition: transform 0.3s ease;
}

.prdList .careCase .careItem.active dt::after {
    transform: rotate(180deg);
}

.prdList .careCase .careItem dd {
    display: none;
    padding: 0 20px;
}

.prdList .careCase .careItem.active dd {
    display: block;
}

.prdList .careCase .careItem.active dd span {
    display: block;
    min-height: 68px;
    padding-top: 10px;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.5;
    color: #000;
    text-align: right;
    border-top: 1px solid #000;
}

.prdList .careCase .careItem.active dd label {
    float: left;
    margin-right: 5px;
    color: #7e7c77;
}

/* ==========================================================================
   가로형 레이아웃 (.landscape)
   ========================================================================== */

.prdList.landscape > ul {
    display: block;
    max-width: 486px;
}

.prdList.landscape li {
    width: 100%;
    max-width: none;
    min-height: 172px;
}

.prdList.landscape li ~ li {
    margin-top: 25px;
}

.prdList.landscape .pd {
    position: relative;
    display: block;
    width: 100%;
    padding: 0 0 0 190px;
}

.prdList.landscape .pd .img {
    position: absolute;
    top: 0;
    left: 0;
    width: 172px;
    margin-bottom: 0;
}

.prdList.landscape .pd .img img {
    max-height: 140px;
}

.prdList.landscape .typeBtn,
.prdList.landscape .careItem {
    margin-left: 190px;
}

.prdList.landscape .pd dd:nth-child(2) {
    flex: 0 1 auto;
}
.prdList.landscape .pd dd:nth-child(4) {
    flex: 0 1 50%;
}
.prdList.landscape .pd dd.lastPrice {
    flex: 1 0 50%;
}

.prdList.landscape .careCase .pd dd:nth-child(2) {
    flex: 0 1 100%;
}
.prdList.landscape .careCase .pd dd:nth-child(4) {
    flex: 1 0 50%;
}
.prdList.landscape .careCase .pd dd.lastPrice {
    flex: 1 0 50%;
}

.prdList.landscape li.soldout::before,
.prdList.landscape li.soldoutAll::before {
    background-size: 120px;
}

/* ==========================================================================
   인테리어 레이아웃 (.interior)
   ========================================================================== */

.prdList.interior li {
    width: 460px;
    max-width: 460px;
    padding-bottom: 24px;
    overflow: hidden;
    background: #fff;
    border-radius: 24px;
}

.prdList.interior .pd .pcImg {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-height: 296px;
    aspect-ratio: 1 / 0.93;
    margin-bottom: 24px;
    overflow: hidden;
    background: #fff;
}

.prdList.interior .pd .pcImg img {
    display: block;
    width: 100%;
}

.prdList.interior .pd .img {
    display: none;
}

.prdList.interior .pd .badge {
    padding: 0 24px 14px;
}

.prdList.interior .pd .txt {
    display: block;
    padding: 0 24px;
}

.prdList.interior .pd dd:nth-child(2) {
    flex: 0 1 auto;
}
.prdList.interior .pd dd:nth-child(4) {
    flex: 0 1 55%;
}

.prdList.interior .typeBtn {
    padding: 16px 24px 0;
}

.prdList.interior .careCase .pd dd:nth-child(2) {
    flex: 0 1 100%;
}
.prdList.interior .careCase .pd dd:nth-child(4) {
    flex: 1 0 50%;
}
.prdList.interior .careCase .pd dd.lastPrice {
    flex: 1 0 50%;
}

.prdList.interior .careCase .careItem {
    margin: 8px 24px 0;
}

/* ==========================================================================
   스켈레톤 로딩 UI
   ========================================================================== */

.skeleton {
    position: relative;
    z-index: 2;
    overflow: hidden;
}

.skeleton .pd::after {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    width: 100%;
    height: 100%;
    content: '';
    background-image: linear-gradient(270deg, rgb(255 255 255 / 20%), rgb(255 255 255 / 10%), rgb(255 255 255 / 20%));
    transform: translateX(-100%);
    animation: skeleton-loader 2s infinite;
}

.skeleton .pd i {
    display: block;
    height: 18px;
    overflow: hidden;
    font-size: 0 !important;
    background: #e3e3e3;
    border-radius: 10px;
}

.skeleton .pd strong {
    padding-bottom: 33px !important;
}

.skeleton .pd strong em i {
    width: 50%;
}

.skeleton .pd dl {
    gap: 16px 8px !important;
}

@keyframes skeleton-loader {
    0% {
        transform: translateX(-100%);
    }
    100% {
        transform: translateX(100%);
    }
}

/* ==========================================================================
통이미지 제품 레이아웃
========================================================================== */

.pdImg {
    position: relative;
    max-width: 980px;
    margin: 0 auto 56px;
}

.pdImg .pdInner {
    position: absolute;
    inset: 0;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 3% calc(25 / 980 * 100%);
}

.pdImg .pdInner a.soldout {
    background: rgb(0 0 0 / 86%) url('/kr/event/2025/08/19_lg_days/images/img_soldout.png') no-repeat center;
    background-size: 140px;
}

.pdImg .pdInner .tvSet {
    position: relative;
}

.pdImg .pdInner .tvSet a {
    position: relative;
    display: block;
}

.pdImg .pdInner .tvSet a.tvSet1,
.pdImg .pdInner .tvSet a.tvSet2 {
    position: absolute;
    bottom: 0;
    z-index: 2;
    width: calc(154 / 318 * 100%);
    height: calc(43 / 578 * 100%);
}

.pdImg .pdInner .tvSet a.tvSet1 {
    left: 0;
}
.pdImg .pdInner .tvSet a.tvSet2 {
    right: 0;
}
.pdImg .pdInner .tvSet a.tvSet3 {
    height: 100%;
}

.pdImg .pdInner .tvSet a.tvSet1.soldout,
.pdImg .pdInner .tvSet a.tvSet2.soldout {
    background: url('/kr/event/2025/08/19_lg_days/images/img_soldoutSmall.png') no-repeat center;
    background-size: 100% 100%;
}

.pdImg .pdInner .tvSet a.tvSet3.soldout {
    background: transparent !important;
}

.pdImg .pdInner .tvSet.allSoldOut a.tvSet1,
.pdImg .pdInner .tvSet.allSoldOut a.tvSet2 {
    display: none;
}

.pdImg .pdInner .tvSet.allSoldOut a.tvSet3 {
    background: rgb(0 0 0 / 86%) url('/kr/event/2025/08/19_lg_days/images/img_soldout.png') no-repeat center;
    background-size: 140px;
}

/* ==========================================================================
   Case 01
   ========================================================================== */

.prdList--case01 > ul {
    grid-template-columns: 1fr;
}

.prdList--case01 li {
    width: 100%;
    max-width: 100%;
    min-height: 350px;
    color: #000;
    background: white;
    border-radius: 20px;
}

.prdList--case01 li.soldoutAll {
    outline: 2px solid #000;
    outline-offset: -1px;
}

.prdList--case01 .pd .img {
    display: none;
}

.prdList--case01 .pd .pcImg {
    position: relative;
    float: left;
    width: 40%;
    height: 100%;
}

.prdList--case01 .pd .pcImg img {
    width: 100%;
    height: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    object-position: right;
}

.prdList--case01 .pd .txt {
    float: left;
    width: 60%;
    padding: 64px 32px 0;
}

.prdList--case01 .typeBtn {
    float: left;
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: space-between;
    width: 60%;
    padding: 20px 32px;
}

.prdList--case01 .typeBtn a {
    height: 48px;
    color: #000;
    border-color: #000;
}

.prdList--case01 .typeBtn .typeBtn__inner {
    position: relative;
    display: flex;
    flex: 1;
    height: 42px;
    border: 1px solid #000;
    border-radius: 8px;
}

.prdList--case01 .typeBtn .typeBtn__inner a {
    height: 100%;
    overflow: visible;
    border: none;
    border-radius: 0;
}

.prdList--case01 .typeBtn a::after {
    display: inline-block;
}

.prdList--case01 .badge {
    display: inline !important;
    flex-wrap: wrap;
    gap: 7px 9px;
    padding: 0 32px;
}

.prdList--case01 .limited-icon {
    position: absolute;
    right: 0;
    bottom: -102%;
    z-index: 1;
    padding: 2px 10px;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 1.625;
    color: #fff;
    letter-spacing: -0.32px;
    background: #ea1917;
    border-radius: 4px;
}

.prdList--case01 .limited-icon::before {
    position: absolute;
    top: -9px;
    left: 53px;
    z-index: -1;
    width: 0;
    height: 0;
    content: '';
    border-right: 13px solid transparent;
    border-bottom: 15px solid #ea1917;
    border-left: 3px solid transparent;
}

.prdList--case01 .pd strong,
.prdList--case01 .pd dt,
.prdList--case01 .pd dd {
    color: #000;
}

.prdList--case01 .pd dt.last,
.prdList--case01 .pd dd.lastPrice {
    color: #ea1917;
}

.prdList--case01 .sale {
    margin-right:10px;
}

.high-efficiency-flag .img::after {
    position: absolute;
    top: 4.8%;
    right: 4.8%;
    z-index: 1;
    width: 32px;
    height: 40px;
    content: '';
    background: url('/kr/event/2025/08/19_lg_days/images/icon-cashback-everyone.png') no-repeat;
    background-size: contain;
}

/* ==========================================================================
   Case 02
   ========================================================================== */

.prdList--case02 ul {
    display: grid;
    grid-template-columns: calc(436 / 980 * 100%) calc(476 / 980 * 100%);
    /* grid-template-rows: repeat(var(--column-number), auto); */
    grid-auto-rows: minmax(min-content, auto);
    gap: 40px 65px;
    justify-content: space-between;
    max-width: 100%;
    padding: 0;
    overflow: hidden;
    list-style: none;
}

.prdList--case02 li {
    max-width: 100%;
    overflow: visible;
}

.prdList--case02 .pd {
    position: relative;
    display: flex;
    flex-direction: column;
    column-gap: 18px;
    width: 100%;
    padding-left: 190px;
}

.prdList--case02 .badge,
.prdList--case02 .typeBtn {
    column-gap: 9px;
    width: calc(100% - 190px);
    margin-left: 190px;
}

.prdList--case02 .badge {
    padding-bottom: 0;
}
.prdList--case02 .badge:has(+ .typeBtn) {
    padding-bottom: 12px;
}

.prdList--case02 .badge em {
    padding: 3px 6.5px;
    font-size: 15.6px;
    font-weight: 500;
    color: #fff;
    white-space: nowrap;
    background: #b7a095;
    border-radius: 6px;
}

.prdList--case02 .badge .sale {
    background: #ea1917;
}

.prdList--case02 .badge .sale + .sale {
    display: none;
}

.prdList--case02 .pd dl {
    display: flex;
    row-gap: 6px;
    align-items: flex-start;
}

.prdList--case02 .img {
    position: absolute !important;
    top: 0;
    left: 0;
    max-width: 167px;
    max-height: 167px;
    margin-bottom: 0;
    border-radius: 12px;
}

.prdList--case02 .txt {
    width: 100%;
}

.prdList--case02 .normal-member-price-area {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    column-gap: 6px;
}

.prdList--case02 .normal-price {
    flex: initial;
    font-size: 20px;
    font-weight: 400;
    line-height: normal;
}

.prdList--case02 .normal-price del {
    color: #7e7c77;
}

.prdList--case02 .member-price {
    flex: initial;
    font-size: 19.6px;
    font-weight: 600;
    line-height: normal;
    letter-spacing: -0.392px;
}

.prdList--case02 .last-price-area {
    display: flex;
    column-gap: 6px;
    align-items: center;
    color: #fff;
}

.prdList--case02 .last {
    font-size: 14px;
    font-weight: 700;
    line-height: normal;
    color: inherit;
    text-align: center;
    letter-spacing: -0.28px;
}

.prdList--case02 .lastPrice {
    font-size: 19px;
    font-weight: 600;
    line-height: normal;
    color: inherit;
    letter-spacing: -0.392px;
}

.prdList--case02 .pd .lastPrice em {
    font-size: inherit;
    font-weight: inherit;
}

.prdList--case02 .high-efficiency-flag .img::after {
    position: absolute;
    top: 4.8%;
    right: 4.8%;
    z-index: 1;
    width: 32px;
    height: 40px;
    content: '';
    background: url('/kr/event/2025/08/19_lg_days/images/icon-cashback-everyone.png') no-repeat;
    background-size: contain;
}

/* Case 02 - 첫번째 아이템 특별 스타일 */
.prdList--case02 li:first-child {
    grid-row: 1 / calc(var(--column-number) + 1);
    /* max-height: 580px; */
}

.prdList--case02 li.soldout::before,
.prdList--case02 li.soldoutAll::before {
    display: none;
}

.prdList--case02 li.soldout > span:not(.badge)::before,
.prdList--case02 li.soldoutAll > span:not(.badge)::before {
    position: absolute;
    inset: 0;
    z-index: 3;
    content: '';
    background: rgb(0 0 0 / 86%) url(/kr/event/2025/08/19_lg_days/images/img_soldout.png) no-repeat center;
    background-size: 140px;
}

.prdList--case02 li:first-child > span {
    display: block !important;
    overflow: hidden;
    background-color: #fff;
    border-radius: 22px;
    /* max-height: 580px; */
}

.prdList--case02 li:first-child .pd {
    display: flex;
    flex-direction: column;
    padding: 0;
}

.prdList--case02 li.high-efficiency-flag:first-child .custom-img {
    position: relative;
}

.prdList--case02 li.high-efficiency-flag:first-child .custom-img::after {
    position: absolute;
    top: 5%;
    right: 5%;
    z-index: 1;
    width: 60px;
    height: 72px;
    content: '';
    background: url('/kr/event/2025/08/19_lg_days/images/icon-cashback-everyone.png') no-repeat;
    background-size: contain;
}

.prdList--case02 li:first-child .img {
    display: none;
}

.prdList--case02 li:first-child .txt {
    padding: 16px 16px 0;
}

.prdList--case02 li:first-child .pd dl {
    flex-direction: column;
    padding: 12px 0;
}

.prdList--case02 li:first-child strong {
    padding-bottom: 12px;
    font-size: 19.6px;
    font-weight: 600;
    line-height: normal;
    color: #1a1a1a;
    letter-spacing: -0.392px;
}

.prdList--case02 li:first-child .normal-price,
.prdList--case02 li:first-child .member-price {
    color: #1a1a1a;
}

.prdList--case02 li:first-child .normal-price em,
.prdList--case02 li:first-child .member-price em {
    letter-spacing: -0.57px;
}

.prdList--case02 li:first-child .last-price-area {
    color: #000;
    letter-spacing: -0.57px;
}

.prdList--case02 li:first-child .badge {
    order: 1;
    width: 100%;
    padding: 0 16px 16px;
    margin: 0;
}

.prdList--case02 li .badge em {
    font-size: 16px;
    font-weight: 600;
    line-height: normal;
    letter-spacing: -0.32px;
}

.prdList--case02 li:first-child .typeBtn {
    width: 100%;
    padding: 0 16px 16px;
    margin-left: 0;
}

/* ==========================================================================
   반응형 미디어 쿼리
   ========================================================================== */

/* 컨테이너 쿼리 */
@container article-area (max-width: 999px) {
    .prdList--case01 .limited-icon {
        font-size: clamp(12px, calc(16 / 999 * 100vw), 16px);
        line-height: 1.625;
    }
}

@media screen and (width <= 767px) {
    .prdList {
        padding: 0 calc(48 / 720 * 100vw);
    }

    .prdList > ul {
        grid-template-columns: repeat(2, 1fr);
        gap: calc(40 / 720 * 100vw) calc(32 / 720 * 100vw);
    }

    .prdList li {
        width: auto;
        max-width: none;
    }

    /* 공통 카드 스타일 조정 */
    .prdList .pd .img {
        max-height: calc(296 / 720 * 100vw);
        margin-bottom: calc(24 / 720 * 100vw);
        border-radius: calc(16 / 720 * 100vw);
    }

    .prdList .pd .img img {
        max-height: calc(220 / 720 * 100vw);
    }

    .prdList .badge {
        padding-bottom: 0;
        margin-top: calc(16 / 720 * 100vw);
    }

    .prdList .badge em {
        padding: calc(4 / 720 * 100vw) calc(8 / 720 * 100vw);
        font-size: calc(20 / 720 * 100vw);
        border-radius: calc(8 / 720 * 100vw);
    }

    .prdList .pd .badge {
        gap: calc(8 / 720 * 100vw) calc(12 / 720 * 100vw);
        padding-bottom: calc(13 / 720 * 100vw);
    }

    .prdList .pd .badge em {
        padding: calc(4 / 720 * 100vw) calc(8 / 720 * 100vw);
        font-size: calc(20 / 720 * 100vw);
        border-radius: calc(8 / 720 * 100vw);
    }

    .prdList .badge + .txt {
        padding-top: calc(14 / 720 * 100vw);
    }

    .prdList .pd strong {
        padding-bottom: calc(16 / 720 * 100vw);
        font-size: calc(26 / 720 * 100vw);
        calc(-0.52em): /;
        calc(-0.52em): /;
        letter-spacing: calc(-0.52em / 26);
    }

    .prdList .pd strong em {
        font-size: calc(22 / 720 * 100vw);
        line-height: normal;
    }

    .prdList .pd dl {
        gap: calc(8 / 720 * 100vw);
        padding-top: calc(16 / 720 * 100vw);
        padding-bottom: 0;
    }

    .prdList .member-price em {
        letter-spacing: -0.52px;
    }
    .prdList .last-price-area em {
        letter-spacing: -0.56px;
    }

    .prdList .pd dt {
        font-size: calc(22 / 720 * 100vw);
    }

    .prdList .pd dd {
        font-size: calc(26 / 720 * 100vw);
    }

    .prdList .pd dd.lastPrice em {
        font-size: calc(28 / 720 * 100vw);
    }

    .prdList .typeBtn {
        gap: calc(16 / 720 * 100vw);
        padding-top: calc(16 / 720 * 100vw);
    }

    .prdList .typeBtn a {
        gap: calc(14 / 720 * 100vw);
        height: calc(54 / 720 * 100vw);
        font-size: calc(22 / 720 * 100vw);
        border-radius: calc(12 / 720 * 100vw);
    }

    .prdList .typeBtn a::after {
        width: calc(9 / 720 * 100vw);
        height: calc(18 / 720 * 100vw);
    }

    .prdList--time-deal li .img::after {
        height: calc(41 / 720 * 100vw);
        font-size: calc(22 / 720 * 100vw);
        font-weight: 600;
        line-height: 1.5454;
        letter-spacing: calc(-0.32em / 22);
        border-bottom-right-radius: calc(14 / 720 * 100vw);
        border-bottom-left-radius: calc(14 / 720 * 100vw);
        transform: translateY(1px);
    }

    /* .prdList li.stock-quantity-less-than-10 .img::after {
        height: calc(40 / 720 * 100vw);
        font-size: calc(22 / 720 * 100vw);
        font-weight: 600;
        line-height: 1.5454;
        letter-spacing: calc(-0.32em / 22);
    }

    .prdList li.stock-quantity-0 .img::after {
        height: calc(40 / 720 * 100vw);
        font-size: calc(22 / 720 * 100vw);
        font-weight: 600;
        line-height: 1.5454;
        letter-spacing: calc(-0.32em / 22);
    } */

    /* 케어십 */
    .prdList .careCase .careItem {
        margin-top: calc(8 / 720 * 100vw);
        border-radius: calc(12 / 720 * 100vw);
    }

    .prdList .careCase .careItem dt {
        gap: calc(14 / 720 * 100vw);
        height: calc(54 / 720 * 100vw);
        font-size: calc(22 / 720 * 100vw);
    }

    .prdList .careCase .careItem dt::after {
        width: calc(18 / 720 * 100vw);
        height: calc(10 / 720 * 100vw);
    }

    .prdList .careCase .careItem.active dd {
        padding: 0 calc(24 / 720 * 100vw);
    }

    .prdList .careCase .careItem.active dd span {
        min-height: calc(80 / 720 * 100vw);
        padding-top: calc(10 / 720 * 100vw);
        font-size: calc(19 / 720 * 100vw);
    }

    /* 가로형 레이아웃 */
    .prdList.landscape li {
        min-height: calc(220 / 720 * 100vw);
    }

    .prdList.landscape li ~ li {
        margin-top: calc(32 / 720 * 100vw);
    }

    .prdList.landscape .pd {
        padding-left: calc(244 / 720 * 100vw);
    }

    .prdList.landscape .pd .img {
        width: calc(220 / 720 * 100vw);
    }

    .prdList.landscape .pd .img img {
        max-height: calc(160 / 720 * 100vw);
    }

    .prdList.landscape .typeBtn,
    .prdList.landscape .careItem {
        margin-left: calc(244 / 720 * 100vw);
    }

    /* 인테리어 레이아웃 */
    .prdList.interior li {
        width: auto;
        padding-bottom: calc(24 / 720 * 100vw);
        border-radius: calc(24 / 720 * 100vw);
    }

    .prdList.interior .pd .pcImg {
        display: none;
    }

    .prdList.interior .pd .img {
        display: flex;
        margin-bottom: 0;
    }

    .prdList.interior .pd .badge,
    .prdList.interior .pd .txt {
        padding-right: calc(24 / 720 * 100vw);
        padding-left: calc(24 / 720 * 100vw);
    }

    .prdList.interior .pd dd:nth-child(2),
    .prdList.interior .pd dd:nth-child(4) {
        flex: 1 0 100%;
    }

    .prdList.interior .typeBtn {
        padding: calc(16 / 720 * 100vw) calc(24 / 720 * 100vw) 0;
    }

    .prdList.interior .careCase .careItem {
        margin: calc(8 / 720 * 100vw) calc(24 / 720 * 100vw) 0;
    }

    /* 스켈레톤 */
    .skeleton .pd strong {
        padding-bottom: calc(33 / 720 * 100vw) !important;
    }

    .skeleton .pd dl {
        gap: calc(16 / 720 * 100vw) calc(8 / 720 * 100vw) !important;
    }

    /* 품절 */
    .prdList li.soldout::before,
    .prdList li.soldoutAll::before {
        background-size: calc(176 / 720 * 100vw);
    }

    .prdList.landscape li.soldout::before,
    .prdList.landscape li.soldoutAll::before {
        background-size: calc(156 / 720 * 100vw);
    }

    .prdList .typeBtn a.soldout::before {
        font-size: calc(22 / 720 * 100vw);
    }

    /* 통이미지 */
    .pdImg {
        padding: 0 calc(48 / 720 * 100vw);
        margin-bottom: calc(80 / 720 * 100vw);
    }

    .pdImg .pdInner {
        inset: 0 calc(45 / 720 * 100vw);
        grid-template-columns: repeat(2, 1fr);
        gap: calc(30 / 720 * 100vw);
    }

    .pdImg .pdInner a.soldout {
        background-size: calc(176 / 720 * 100vw);
    }

    .pdImg .pdInner .tvSet a.tvSet1,
    .pdImg .pdInner .tvSet a.tvSet2 {
        width: calc(310 / 656 * 100%);
        height: calc(56 / 666 * 100%);
    }

    .pdImg .pdInner .tvSet.allSoldOut a.tvSet3 {
        background-size: calc(176 / 720 * 100vw);
    }

    /* 이벤트 템플릿 Case 01 */
    .prdList--case01 > ul {
        grid-template-columns: initial;
    }

    .prdList--case01 .pd .pcImg,
    .prdList--case01 .pd .txt,
    .prdList--case01 .typeBtn,
    .prdList--case01 .badge {
        width: 100%;
    }

    .prdList--case01 .pd .pcImg {
        height: auto;
    }

    .prdList--case01 .pd .txt {
        padding: calc(25 / 720 * 100vw);
    }

    .prdList--case01 .typeBtn {
        padding: calc(24 / 720 * 100vw) calc(25 / 720 * 100vw) calc(36 / 720 * 100vw);
    }

    .prdList--case01 .badge {
        display: flex !important;
        padding: 0 calc(25 / 720 * 100vw) calc(25 / 720 * 100vw);
    }

    .prdList--case01 .limited-icon {
        bottom: -41px;
        font-size: 15px;
        font-weight: 600;
        line-height: 1.5;
        letter-spacing: -0.02em;
    }

    .high-efficiency-flag .img::after {
        top: 6.3%;
        right: 6.3%;
        width: calc(56 / 720 * 100vw);
        height: calc(70 / 720 * 100vw);
    }

    /* ==========================================================================
       Case 02
       ========================================================================== */
    .prdList--case02 ul {
        grid-template-columns: auto;
        row-gap: calc(48 / 720 * 100vw);
    }

    .prdList--case02 .pd {
        padding-left: calc(244 / 720 * 100vw);
    }

    .prdList--case02 .badge,
    .prdList--case02 .typeBtn {
        column-gap: calc(8 / 720 * 100vw);
        width: calc(100% - 244 / 720 * 100vw);
        margin-left: calc(244 / 720 * 100vw);
    }

    .prdList--case02 .badge {
        padding-bottom: 0;
    }
    .prdList--case02 .badge:has(+ .typeBtn) {
        padding-bottom: calc(16 / 720 * 100vw);
    }

    .prdList--case02 .badge em {
        padding: 3px 6.5px;
        font-size: 15.6px;
        font-weight: 500;
        color: #fff;
        white-space: nowrap;
        background: #b7a095;
        border-radius: calc(8 / 720 * 100vw);
    }

    .prdList--case02 .pd dl {
        row-gap: calc(6 / 720 * 100vw);
    }

    .prdList--case02 .img {
        width: calc(220 / 720 * 100vw);
        max-width: 220px;
        max-height: 220px;
        border-radius: calc(16 / 720 * 100vw);
    }

    .prdList--case02 .txt {
        width: 100%;
    }

    .prdList--case02 .normal-member-price-area {
        column-gap: calc(6 / 720 * 100vw);
    }

    .prdList--case02 .normal-price {
        flex: initial;
        font-size: 20px;
        font-weight: 400;
        line-height: normal;
    }

    .prdList--case02 .normal-price del {
        color: #7e7c77;
    }

    .prdList--case02 .member-price {
        flex: initial;
        font-size: 19.6px;
        font-weight: 600;
        line-height: normal;
        letter-spacing: -0.392px;
    }

    .prdList--case02 .last-price-area {
        display: flex;
        column-gap: 6px;
        align-items: center;
        color: #fff;
    }

    .prdList--case02 .last {
        font-size: 14px;
        font-weight: 700;
        line-height: normal;
        color: inherit;
        text-align: center;
        letter-spacing: -0.28px;
    }

    .prdList--case02 .lastPrice {
        font-size: 19px;
        font-weight: 600;
        line-height: normal;
        color: inherit;
        letter-spacing: -0.392px;
    }

    .prdList--case02 .pd .lastPrice em {
        font-size: inherit;
        font-weight: inherit;
    }

    .prdList--case02 .high-efficiency-flag .img::after {
        top: 6.3%;
        right: 6.3%;
        width: calc(56 / 720 * 100vw);
        height: calc(70 / 720 * 100vw);
    }

    .prdList--case02 li .badge em {
        font-size: calc(20 / 720 * 100vw);
        font-weight: 600;
        line-height: normal;
        letter-spacing: -0.32px;
    }

    .prdList--case02 li.soldout > span:not(.badge)::before,
    .prdList--case02 li.soldoutAll > span:not(.badge)::before {
        background-size: calc(176 / 720 * 100vw);
    }

    .prdList--case02 li:first-child {
        grid-row: initial;
    }

    .prdList--case02 li:first-child > span {
        border-radius: calc(22 / 720 * 100vw);
    }

    .prdList--case02 li.high-efficiency-flag:first-child .custom-img::after {
        width: calc(84 / 720 * 100vw);
        height: calc(105 / 720 * 100vw);
    }

    .prdList--case02 li:first-child .txt {
        padding: calc(24 / 720 * 100vw) calc(24 / 720 * 100vw) 0;
    }

    .prdList--case02 li:first-child strong {
        padding-bottom: calc(16 / 720 * 100vw);
        font-size: calc(28 / 720 * 100vw);
        letter-spacing: calc(-0.56em / 28);
    }

    .prdList--case02 li:first-child .pd dl {
        padding: calc(16 / 720 * 100vw) 0;
    }

    .prdList--case02 li:first-child strong em {
        padding-top: calc(8 / 720 * 100vw);
    }

    .prdList--case02 li:first-child .badge {
        padding: 0 calc(24 / 720 * 100vw) calc(24 / 720 * 100vw);
    }

    .prdList--case02 li:first-child .typeBtn {
        width: 100%;
        padding: 0 calc(24 / 720 * 100vw) calc(24 / 720 * 100vw);
        margin-left: 0;
    }

    /* ==========================================================================
       PC - vertical, MO - horizon Case
       ========================================================================== */
    .prdList--pc-vertical-mo-horizon ul {
        display: flex;
        flex-direction: column;
        row-gap: calc(48 / 720 * 100vw);
        max-width: 100%;
        padding: 0;
        overflow: hidden;
        list-style: none;
    }

    .prdList--pc-vertical-mo-horizon li {
        max-width: 100%;
        min-height: calc(220 / 720 * 100vw);
        overflow: visible;
    }

    .prdList--pc-vertical-mo-horizon .pd {
        position: relative;
        display: flex;
        flex-direction: column;
        column-gap: calc(18 / 720 * 100vw);
        width: 100%;
        padding-left: calc(244 / 720 * 100vw);
    }

    .prdList--pc-vertical-mo-horizon .badge,
    .prdList--pc-vertical-mo-horizon .typeBtn {
        column-gap: calc(8 / 720 * 100vw);
        width: calc(100% - 244 / 720 * 100vw);
        margin-left: calc(244 / 720 * 100vw);
    }

    .prdList--pc-vertical-mo-horizon .pd .badge {
        display: flex;
        order: 1;
        width: 100%;
        padding-bottom: 0;
        margin-left: 0;
        margin-top: calc(16 / 720 * 100vw);
    }
    .prdList--pc-vertical-mo-horizon .badge:has(+ .typeBtn) {
        padding-bottom: calc(16 / 720 * 100vw);
    }

    .prdList--pc-vertical-mo-horizon .badge em {
        padding: 3px 6.5px;
        font-size: 15.6px;
        font-weight: 500;
        white-space: nowrap;
        border-radius: calc(8 / 720 * 100vw);
    }

    .prdList--pc-vertical-mo-horizon .badge .sale + .sale {
        display: none;
    }

    .prdList--pc-vertical-mo-horizon .pd dl {
        display: flex;
        row-gap: calc(6 / 720 * 100vw);
        align-items: flex-start;
    }

    .prdList--pc-vertical-mo-horizon .pd .img {
        position: absolute !important;
        top: 0;
        left: 0;
        width: calc(220 / 720 * 100vw);
        overflow: visible;
        align-items: flex-start;
        max-width: 220px;
        margin-bottom: 0;
        max-height: 220px;
        border-radius: calc(16 / 720 * 100vw);
    }

    .prdList--pc-vertical-mo-horizon .pd .img img {
        margin-top: calc(12 / 720 * 100vw);
        max-height: calc(168 / 720 * 100vw);
    }

    .prdList--pc-vertical-mo-horizon .pd .txt {
        width: 100%;
        padding-top: 0;
    }

    .prdList--pc-vertical-mo-horizon .normal-member-price-area {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        column-gap: calc(8 / 720 * 100vw);
    }

    .prdList--pc-vertical-mo-horizon .normal-price {
        flex: initial;
        font-size: 20px;
        font-weight: 400;
        line-height: normal;
    }

    .prdList--pc-vertical-mo-horizon .normal-price del {
        color: #7e7c77;
    }

    .prdList--pc-vertical-mo-horizon .pd dd.member-price {
        flex: initial;
        font-size: calc(24 / 720 * 100vw);
        font-weight: 400;
        line-height: normal;
        letter-spacing: calc(-0.48em / 24);
    }

    .prdList--pc-vertical-mo-horizon .last-price-area {
        display: flex;
        column-gap: calc(8 / 720 * 100vw);
        align-items: center;
        color: #fff;
    }

    .prdList--pc-vertical-mo-horizon .last {
        font-size: 14px;
        font-weight: 700;
        line-height: normal;
        color: inherit;
        text-align: center;
        letter-spacing: -0.28px;
    }

    .prdList--pc-vertical-mo-horizon .lastPrice {
        font-size: 19px;
        font-weight: 600;
        line-height: normal;
        color: inherit;
        letter-spacing: -0.392px;
    }

    .prdList--pc-vertical-mo-horizon .pd .lastPrice em {
        font-size: inherit;
        font-weight: inherit;
    }

    .prdList--pc-vertical-mo-horizon .high-efficiency-flag .img::after {
        top: 6.3%;
        right: 6.3%;
        width: calc(56 / 720 * 100vw);
        height: calc(70 / 720 * 100vw);
    }

    .prdList--pc-vertical-mo-horizon li .badge em {
        font-size: calc(20 / 720 * 100vw);
        font-weight: 600;
        line-height: normal;
        letter-spacing: -0.32px;
    }
}

/* sticky tab */
.event-benefit-template .content-wrap .tab_wrap {
    position: sticky;
    top: 0;
    right: 0;
    left: 0;
    z-index: 20;
    transform: translateZ(0);
    backface-visibility: hidden;
    will-change: transform;
}

.event-benefit-template .tab_wrap .tab_inner {
    display: flex;
    justify-content: center;
    background-color: #222;
}

.event-benefit-template .tab_wrap .tab_inner ul {
    display: flex;
    height: 56px;
    overflow-x: auto;
}

.event-benefit-template .tab_wrap .tab_inner li {
    position: relative;
    width: calc(100% / 3);
}

.event-benefit-template .tab_wrap .tab_inner li::after {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 4px;
    content: '';
    background-color: transparent;
    transition: background-color 0.3s;
}

.event-benefit-template .tab_wrap .tab_inner li.active::after {
    background-color: #ea1917;
}

.event-benefit-template .tab_wrap .tab_inner li a {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 240px;
    height: 100%;
    padding: 0 20px;
    font-size: 18px;
    font-weight: 500;
    line-height: 28px;
    color: #aeaeae;
    letter-spacing: -0.36px;
    transition: color 0.3s;
}

.event-benefit-template .tab_wrap .tab_inner li.active a {
    font-weight: 700;
    color: #fff;
}

@container article-inner-area (max-width: 999px) {
    .event-benefit-template .tab_wrap .tab_inner li a {
        padding: 0 calc(40 / 999 * 100vw);
        font-size: 20px;
    }
}

@media screen and (width <= 767px) {
    .event-benefit-template .content-wrap .tab_wrap {
        top: 46px;
    }

    .header.helloBar ~ .container .event-benefit-template .content-wrap .tab_wrap {
        top: 88px;
    }

    .event-benefit-template .tab_wrap .tab_inner ul {
        width: 100%;
        height: calc(96 / 720 * 100vw);
    }

    .event-benefit-template .tab_wrap .tab_inner li a {
        width: 100%;
        padding: 0 calc(32 / 720 * 100vw);
        font-size: calc(28 / 720 * 100vw);
        font-weight: 500;
        line-height: 1.4;
        color: #aeaeae;
        text-align: center;
        letter-spacing: calc(-0.7em / 28);
    }

    .event-benefit-template .tab_wrap .tab_inner li::after {
        height: calc(8 / 720 * 100vw);
    }
}

/* // sticky tab */

/* small tab */
.small-tab {
    position: sticky;
    top: 56px;
    left: 0;
    z-index: 19;
    width: 100%;
    background-color: #080808;
}

.small-tab .tab_inner {
    max-width: 1000px;
    padding: 20px 10px;
    margin: 0 auto;
    text-align: left;
}

.small-tab .tab_inner ul {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    padding: 8px;
    white-space: nowrap;
    background-color: rgba(255, 255, 255, 0.2);
    border-radius: 100px;
}

.small-tab .tab_inner li {
    position: relative;
    flex-basis: calc(100% / 3);
    height: 48px;
    background-color: transparent;
    border-radius: 100px;
}

.small-tab .tab_inner li a,
.small-tab .tab_inner li button {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    padding: 0 24px;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.5556;
    color: #fff;
    letter-spacing: calc(-0.45em / 18);
}

.small-tab .tab_inner li.active {
    background-color: #ea1917;
}

.small-tab .tab_inner li.active a {
    color: #fff;
}

@media screen and (width <= 767px) {
    .event-benefit-template .small-tab {
        top: calc(46px + calc(96 / 720 * 100vw));
    }

    .header.helloBar ~ .container .small-tab {
        top: calc(86px + calc(96 / 720 * 100vw));
    }

    .small-tab .tab_inner {
        padding: calc(20 / 720 * 100vw) calc(48 / 720 * 100vw);
    }

    .small-tab .tab_inner ul {
        padding: calc(8 / 720 * 100vw);
    }

    .small-tab .tab_inner li {
        height: calc(62 / 720 * 100vw);
        border-radius: calc(32 / 720 * 100vw);
    }

    .small-tab .tab_inner li a,
    .small-tab .tab_inner li button {
        padding: 0 calc(12 / 720 * 100vw);
        font-size: calc(28 / 720 * 100vw);
        font-weight: 600;
        line-height: 1.4285;
        letter-spacing: calc(-0.7em / 28);
    }
}

.tab_container3 .tab_con {
    display: none;
    max-width: 980px;
    margin: 0 auto;
}

.tab_container3 .tab_con.active {
    display: block;
}

/* // small tab */

/* big tab */
.bigTabArea .tab_inner {
    max-width: 742px;
    padding: 0 0 48px;
    margin: 0 auto;
}

.bigTabArea .tab_inner ul {
    display: inline-flex;
    flex-wrap: nowrap;
    width: 100%;
    height: 80px;
    padding: 8px;
    white-space: nowrap;
    background: #fff;
    border: 2px solid #e2e0de;
    border-radius: 200px;
}

.bigTabArea .tab_inner li {
    position: relative;
    flex: 1;
    height: 100%;
    text-align: center;
    background: transparent;
    border-radius: 200px;
}

.bigTabArea .tab_inner li a {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    padding: 0 18px;
    font-size: 20px;
    font-weight: 400;
    line-height: 1.2;
    color: #696969;
    letter-spacing: -0.04em;
}

.bigTabArea .tab_inner li.active {
    background: #181818;
    box-shadow: 2px 2px 10px rgb(0 0 0 / 30%);
}

.bigTabArea .tab_inner li.active a {
    color: #fff;
}

@media screen and (width <= 767px) {
    .bigTabArea .tab_inner {
        display: flex;
        justify-content: center;
        width: calc(448 / 720 * 100vw);
        padding: calc(48 / 720 * 100vw) 0;
    }

    .bigTabArea .tab_inner ul {
        height: calc(106 / 720 * 100vw);
        padding: calc(6 / 720 * 100vw);
    }

    .bigTabArea .tab_inner li a {
        font-size: calc(28 / 720 * 100vw);
        font-weight: 500;
        line-height: 1.2;
        text-align: center;
        letter-spacing: calc(-0.28em / 28);
    }
}

/* // big tab */

/* kv */
.event-benefit-template .main-kv {
    position: relative;
}

.event-benefit-template .main-kv-video {
    display: block;
    width: 100%;
}

.kv-time__box {
    position: absolute;
    bottom: 46px;
    left: 50%;
    z-index: 3;
    width: 840px;
    height: 104px;
    background: url('/kr/event/2025/08/19_lg_days/images/bg-kv-timer-pc.png') no-repeat 0 0;
    background-size: 100%;
    transform: translateX(-50%);
}

.kv-time__box div {
    position: absolute;
    top: 29.3%;
    left: 43.9%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 40.5%;
    text-align: right;
    background: rgb(255 0 0 / 0%);
}

.kv-time__box p {
    justify-content: center;
    font-size: 48px;
    font-weight: bold;
    color: #fff;
}

.kv-time__box .kv-time {
    min-width: 19%;
}

.kv-time--min {
    margin-left: 3.5%;
}

.kv-time--sec {
    margin-left: 0%;
}

.kv-time__box p span {
    width: 50%;
    background: rgb(0 255 0 / 0%);
}

@media screen and (width <= 1380px) {
    .kv-time__box {
        font-size: calc(48 / 1380 * 100vw);
    }
}

@media screen and (width <= 767px) {
    .kv-time__box {
        bottom: calc(40 / 720 * 100vw);
        width: calc(640 / 720 * 100vw);
        height: calc(200 / 720 * 100vw);
        background: url('/kr/event/2025/08/19_lg_days/images/bg-kv-timer-mo.png') no-repeat 0 0;
        background-size: 100%;
    }

    .kv-time__box div {
        top: 53.4%;
        right: 0;
        left: 15.2%;
        width: 67.8%;
    }

    .kv-time__box p {
        font-size: calc(62 / 720 * 100vw);
    }
}
/* // kv */

/* 한 번 더 아껴주는 어워즈 쿠폰 */
.event-benefit-template .coupon-benefit {
    background-color: #f7f7f7;
}

.event-benefit-template .coupon-benefit-title {
    padding-bottom: calc(48 / 980 * 100%);
}

.event-benefit-template .coupon-benefit-swiper {
    max-width: 980px;
    margin-bottom: calc(24 / 980 * 100%);
}

.event-benefit-template .coupon-benefit-swiper--01 .swiper-wrapper {
    display: grid;
    grid-template-columns: repeat(3, minmax(calc((100% - 32px) / 3), auto));
    gap: 16px;
}

.event-benefit-template .coupon-benefit-swiper--02 .swiper-wrapper {
    display: grid;
    grid-template-columns: repeat(2, minmax(calc((100% - 32px) / 2), auto));
    gap: 16px;
}

.event-benefit-template .coupon-benefit-swiper .swiper-slide {
    position: relative;
    background-color: transparent;
}

.event-benefit-template .coupon-benefit-swiper .swiper-slide img {
    width: 100%;
}

.event-benefit-template .coupon-benefit .btn-wrap {
    position: relative;
    width: fit-content;
    margin-bottom: calc(80 / 980 * 100%);
}

.event-benefit-template .coupon-benefit .coupon-pack-btn {
    position: absolute;
    top: 0;
    left: 0;
    width: 48.9%;
    height: 100%;
}

.event-benefit-template .coupon-benefit .app-only-btn {
    position: absolute;
    top: 0;
    right: 0;
    width: 49.1%;
    height: 100%;
}

.event-benefit-template .coupon-benefit .must-have-coupon-btn {
    position: absolute;
    top: 0;
    right: 0;
    width: 23.4%;
    height: 100%;
}

.event-benefit-template .coupon-benefit .coupon-notice {
    position: relative;
    margin-bottom: calc(48 / 980 * 100%);
}

@media screen and (width <= 767px) {
    .event-benefit-template .coupon-benefit .c-title {
    }

    .event-benefit-template .coupon-benefit-title {
        padding: 0 calc(48 / 720 * 100%) calc(48 / 720 * 100%);
    }

    .event-benefit-template .coupon-benefit-swiper {
        padding: 0 calc(48 / 720 * 100%) calc(64 / 720 * 100%);
        margin-bottom: 0;
    }

    .event-benefit-template .coupon-benefit-swiper .swiper-wrapper {
        display: flex;
        gap: initial;
    }

    .event-benefit-template .coupon-benefit-swiper .swiper-slide {
        width: calc(460 / 720 * 100vw);
        margin-left: calc(24 / 720 * 100vw);
    }

    .event-benefit-template .coupon-benefit-swiper--02 .swiper-slide {
        width: calc(570 / 720 * 100vw);
    }

    .event-benefit-template .coupon-benefit-swiper .swiper-slide:first-child {
        margin-left: 0;
    }

    .event-benefit-template .coupon-benefit .btn-wrap {
        margin: 0 calc(48 / 720 * 100vw) calc(148 / 720 * 100vw);
    }

    .event-benefit-template .coupon-benefit .coupon-pack-btn {
        top: 0;
        left: 0;
        width: 48.7%;
        height: 100%;
    }

    .event-benefit-template .coupon-benefit .app-only-btn {
        top: 0;
        right: 0;
        width: 48.7%;
        height: 100%;
    }

    .event-benefit-template .coupon-benefit .must-have-coupon-btn {
        top: 0;
        right: 0;
        width: 26.9%;
        height: 100%;
    }

    .event-benefit-template .coupon-benefit .coupon-notice {
        margin: 0 calc(48 / 720 * 100vw) calc(64 / 720 * 100vw);
    }

    .event-benefit-template .coupon-benefit__banner {
        margin: 0 calc(48 / 720 * 100vw);
    }
}

/* // 한 번 더 아껴주는 어워즈 쿠폰 */

/* 구매의 즐거움을 더해줄 결제 혜택 */
.event-benefit-template .payment-benefits .article__inner {
}

.event-benefit-template .payment-benefits .c-title {
}

/* .event-benefit-template .payment-benefits .c-title::after {
    position: absolute;
    right: 0;
    bottom: -51%;
    width: calc(182 / 1000 * 100%);
    height: 73.5%;
    content: '';
    background: url('/kr/event/2025/08/19_lg_days/images/img-coupon-benefit-card.png')
        no-repeat;
    background-size: contain;
} */

.event-benefit-template .payment-benefits .c-title__desc {
    color: #767676;
}

.event-benefit-template .payment-benefits__desc {
    position: relative;
}

.event-benefit-template .payment-benefits__list {
}

.event-benefit-template .payment-benefits__img-linker {
    position: absolute;
}

.event-benefit-template .payment-benefits__img-linker--01 {
    bottom: 0%;
    left: 25.4%;
    width: 49.2%;
    height: 14.8%;
}

.event-benefit-template .payment-benefits__img-linker--02 {
    right: 0%;
    bottom: 0%;
    width: 48.7%;
    height: 17.1%;
}

.event-benefit-template .payment-benefits__item {
    padding: calc(40 / 980 * 100%) calc(104 / 980 * 100%) calc(40 / 980 * 100%) calc(120 / 980 * 100%);
    background-color: #fff;
    border-radius: 16px;
}

.event-benefit-template .payment-benefits__item--main {
    padding: 0;
    margin: 0 0 calc(40 / 980 * 100%);
    background-color: transparent;
}

.event-benefit-template .payment-benefits__item--sub {
    padding: calc(12 / 980 * 100%) calc(39 / 980 * 100%);
    margin-top: calc(24 / 980 * 100%);
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 16px;
}

.event-benefit-template .payment-benefits__item--sub:has(.c-toggle__btn.on) {
    padding-bottom: calc(32 / 980 * 100%);
}

.event-benefit-template .payment-benefits__item--sub:first-child {
    margin-top: 0;
}

.event-benefit-template .payment-benefits__item--sub .c-toggle__btn {
    position: relative;
}

.event-benefit-template .payment-benefits__item--sub .c-toggle__btn.on + .c-toggle__data {
    margin-top: 0;
}

.event-benefit-template .payment-benefits__item--sub .c-toggle__btn::after {
    position: absolute;
    top: 50%;
    right: 0;
    display: block;
    width: calc(36 / 936 * 100%);
    height: calc(36 / 81 * 100%);
    content: '';
    background: url('/kr/event/2025/08/19_lg_days/images/icon-accordion-arrow.svg') no-repeat center center;
    background-size: 100%;
    transform: translateY(-50%) rotate(180deg);
    transition: transform 0.2s;
}

.event-benefit-template .payment-benefits__item--sub .c-toggle__btn.on::after {
    transform: translateY(-50%) rotate(0deg);
}

.event-benefit-template .payment-benefits__linker--shinhan {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 21%;
    height: 16%;
}
.event-benefit-template .payment-benefits__linker--digiloca {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 21%;
    height: 22%;
}

.payment-benefits .payment-benefits__more-area {
    margin-top: 60px;
}

.payment-benefits .payment-benefits__more-area .c-toggle__btn--benefit-more.on {
    display: none;
    margin-top: 64px;
}
.payment-benefits .payment-benefits__more-area:has(.c-toggle__btn--benefit-more.on) {
    margin-top: 0px;
}

.event-benefit-template .payment-benefits__notice {
    position: relative;
    margin-bottom: calc(48 / 980 * 100%);
}

.event-benefit-template .payment-benefits__notice .c-toggle__btn {
}

.event-benefit-template .payment-benefits .c-toggle__data-item {
    position: relative;
    padding-left: 15px;
    font-size: 16px;
    font-weight: 500;
    line-height: 162.5%;
    color: #505050;
    letter-spacing: calc(-0.48em / 16);
}

.event-benefit-template .payment-benefits .c-toggle__data-item + li {
    margin-top: 4px;
}

.event-benefit-template .payment-benefits .c-toggle__data-item::before {
    position: absolute;
    top: 0.7em;
    left: 0;
    width: 4px;
    height: 4px;
    content: '';
    background-color: #505050;
    border-radius: 100px;
}

.event-benefit-template .payment-benefits__more-area {
    margin-top: calc(60 / 980 * 100%);
}

.event-benefit-template .payment-benefits__more-area .payment-benefits__item--sub {
    margin-top: 24px;
}

.event-benefit-template .payment-benefits__more-area .c-toggle__btn--benefit-more.on {
    margin-top: calc(60 / 980 * 100%);
}

.payment-benefits__more-area:has(.c-toggle__btn--benefit-more.on) {
    margin-top: 0;
}

@container article-inner-area (max-width: 999px) {
    .event-benefit-template .payment-benefits .c-toggle__data-item {
        font-size: clamp(12px, calc(24 / 1000 * 100vw), 24px);
    }
}

@media screen and (width <= 767px) {
    .event-benefit-template .payment-benefits .c-title::after {
        right: calc(48 / 720 * 100vw);
        bottom: -48%;
        width: calc(182 / 720 * 100vw);
        height: 70.5%;
    }

    .event-benefit-template .payment-benefits__linker--shinhan {
        bottom: 0;
        left: 0;
        width: 100%;
        height: 14%;
    }
    .event-benefit-template .payment-benefits__linker--digiloca {
        bottom: 0;
        left: 0;
        width: 100%;
        height: 16%;
    }

    .event-benefit-template .payment-benefits__notice .c-toggle__btn {
    }

    .payment-benefits__item--sub .c-toggle__btn.on + .c-toggle__data {
        padding-top: 0;
        margin-top: calc(8 / 720 * 100vw);
    }

    .event-benefit-template .payment-benefits__more-area {
        margin-top: calc(36 / 720 * 100vw);
    }

    .event-benefit-template .payment-benefits__more-area .payment-benefits__item--sub {
        margin-top: calc(24 / 720 * 100vw);
    }

    .payment-benefits__more-area .c-toggle__btn--benefit-more.on {
        margin-top: calc(36 / 720 * 100vw);
    }

    .event-benefit-template .payment-benefits .c-title {
    }

    .event-benefit-template .payment-benefits .c-toggle__data-item {
        font-size: calc(24 / 720 * 100vw);
        line-height: 150%;
        letter-spacing: calc(-0.72em / 24);
    }

    .event-benefit-template .payment-benefits__list {
        padding: 0 calc(48 / 720 * 100vw);
    }

    .event-benefit-template .payment-benefits__item {
        padding: calc(29 / 720 * 100vw) calc(31 / 720 * 100vw);
        border-radius: calc(16 / 720 * 100vw);
    }

    .event-benefit-template .payment-benefits__item--sub:has(.c-toggle__btn.on) {
        padding-bottom: calc(29 / 720 * 100vw);
    }

    .event-benefit-template .payment-benefits__item--sub {
        margin-top: calc(24 / 720 * 100vw);
    }

    .event-benefit-template .payment-benefits__item--sub .c-toggle__btn::after {
        width: calc(48 / 720 * 100vw);
        height: calc(48 / 720 * 100vw);
    }

    .event-benefit-template .payment-benefits__item--sub .c-toggle__btn.on + .c-toggle__data {
        margin-top: calc(16 / 720 * 100vw);
    }

    .payment-benefits .payment-benefits__more-area {
        margin-top: calc(48 / 780 * 100vw);
    }

    .payment-benefits .payment-benefits__more-area .c-toggle__btn--benefit-more.on {
        margin-top: calc(36 / 780 * 100vw);
    }

    .event-benefit-template .payment-benefits__notice {
        margin: 0;
    }
}

/* // 구매의 즐거움을 더해줄 결제 혜택 */

/* LG Days 8월의 딜 */
.event-benefit-template .deal {
    background-color: #080808;
}

.event-benefit-template .deal .article__inner {
    max-width: 100%;
    padding: 100px 0;
}

.event-benefit-template .deal .c-title {
    max-width: 1000px;
    padding: 0 10px 28px;
    margin: 0 auto;
}

.event-benefit-template .deal .c-title__main-title {
    color: #fff;
}

.event-benefit-template .deal .c-title__desc {
    color: rgb(255 255 255 / 70%);
}

.event-benefit-template .deal .tab_scroll_cont2 {
    max-width: 1000px;
    padding: 0 10px;
    margin: 0 auto;
}

.event-benefit-template .tab_scroll_cont2 [role='tabpanel'] {
}

.event-benefit-template .deal__sub-title {
    font-size: 24px;
    font-weight: 600;
    line-height: 36px;
    color: #fff;
    letter-spacing: -0.48px;
}

.event-benefit-template .deal__limit-sale-banner {
    margin: 32px 0;
}

.event-benefit-template .deal__limit-ankor-drop-list {
    display: flex;
    flex-wrap: wrap;
    column-gap: 16px;
    align-content: flex-start;
    align-items: flex-start;
    margin-top: 32px;
    margin-bottom: 32px;
}

.event-benefit-template .deal__limit-ankor-drop-item {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 7px 23px;
    font-size: 20px;
    font-weight: 600;
    line-height: 1.6;
    color: #fff;
    text-align: center;
    letter-spacing: -0.4px;
    border: solid 1px #fff;
    border-radius: 100px;
}

.event-benefit-template .deal__limit-ankor-drop-item.active {
    background-color: #ea1917;
    border-color: #ea1917;
}

.event-benefit-template .deal__sub-title {
    margin-top: 100px;
}

.event-benefit-template .deal__sub-title--limit-deal {
    margin-top: 28px;
}

.event-benefit-template .deal__sub-title:first-child {
    margin-top: 23px;
}

.event-benefit-template .deal__sub-title--center {
    text-align: center;
}

.event-benefit-template .deal__sub-title-desc {
    margin-top: 8px;
    font-size: 20px;
    font-weight: 400;
    line-height: 30px; /* 150% */
    color: rgb(255 255 255 / 70%);
    letter-spacing: -0.4px;
}

.event-benefit-template .deal__sub-title-desc--center {
    text-align: center;
}

.event-benefit-template .deal__sub-title-desc--bottom-margin {
    margin-bottom: 32px;
}

.event-benefit-template .tab_scroll_cont2 .prdList--time-deal {
    margin-top: 0;
}

.event-benefit-template .tab_scroll_cont2 .prdList {
    margin-top: 32px;
}

.event-benefit-template .deal__first-deal-prd {
    position: relative;
    margin: 32px -70px 56px;
}

.event-benefit-template .deal__first-deal-prd.soldout::after {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    font-size: 24px;
    font-weight: 700;
    line-height: 36px; /* 150% */
    color: #fff;
    letter-spacing: -0.48px;
    content: '선착순 마감';
    background-color: rgb(0 0 0 / 85%);
}

.event-benefit-template .deal__first-deal-linker {
    position: absolute;
}

.event-benefit-template .deal__first-deal-linker--01 {
    top: 60%;
    left: 43%;
    width: 26%;
    height: 13%;
}

.event-benefit-template .deal__first-deal-linker--02 {
    top: 60%;
    left: 71%;
    width: 26%;
    height: 13%;
}

.event-benefit-template .deal__care-prd {
    max-height: 533px;
    overflow: hidden;
    /* transition: max-height 0.3s; */
}

.event-benefit-template .relative-area {
    position: relative;
    overflow: hidden;
}

.event-benefit-template .deal__care-prd-wrap.active .deal__care-prd {
    max-height: calc(var(--user-img-height, 0) * 1px);
}

.event-benefit-template .product-img-linker {
    position: absolute;
    inset: 0;
    display: grid;
    grid-template-rows:
        calc(533 / var(--user-img-height) * 100%)
        calc(556 / var(--user-img-height) * 100%)
        calc(557 / var(--user-img-height) * 100%)
        calc(557 / var(--user-img-height) * 100%);
    grid-template-columns: repeat(4, 1fr);
    gap: calc(48 / var(--user-img-height) * 100%) calc(16 / 980 * 100%);
}

.event-benefit-template .deal__more-btn-wrap {
    display: block;
    margin: 48px auto 0;
    text-align: center;
}

.event-benefit-template .deal__more-btn-wrap picture {
    display: inline-block;
}

@container article-area (max-width: 999px) {
    .event-benefit-template .deal__care-prd {
        max-height: calc(549 / 999 * 100vw);
    }

    .event-benefit-template .deal .article__inner {
        padding: calc(100 / 999 * 100vw) 0;
    }

    .event-benefit-template .deal .c-title {
        padding: 0 10px calc(44 / 999 * 100vw);
    }
}

@media screen and (width <= 767px) {
    .event-benefit-template .deal .article__inner {
        padding: calc(100 / 720 * 100vw) 0;
    }

    .event-benefit-template .deal .c-title {
        padding: 0 calc(48 / 720 * 100vw) calc(28 / 720 * 100vw);
    }

    .event-benefit-template .deal .c-title__main-title {
        color: #fff;
    }

    .event-benefit-template .deal .c-title__desc {
        color: rgb(255 255 255 / 70%);
    }

    .event-benefit-template .deal .tab_scroll_cont2 {
        max-width: 1000px;
        padding: 0;
        margin: 0 auto;
    }

    .event-benefit-template .tab_scroll_cont2 [role='tabpanel'] {
    }

    .event-benefit-template .deal__sub-title {
        padding: 0 calc(48 / 720 * 100vw);
        font-size: calc(36 / 720 * 100vw);
        font-weight: 700;
        line-height: 150%;
        text-align: left;
        letter-spacing: calc(-0.72em / 36);
    }

    .event-benefit-template .deal__sub-title {
        margin-top: calc(80 / 720 * 100vw);
    }

    .event-benefit-template .deal__sub-title-desc {
        padding: 0 calc(48 / 720 * 100vw);
        font-size: calc(28 / 720 * 100vw);
        font-weight: 500;
        line-height: 142.857%;
        text-align: left;
        letter-spacing: calc(-0.56em / 28);
    }

    .event-benefit-template .deal__first-deal-prd {
        margin: 32px calc(48 / 720 * 100vw) calc(48 / 720 * 100vw);
        border-radius: calc(16 / 720 * 100vw);
    }

    .event-benefit-template .deal__limit-sale-banner {
        margin: calc(48 / 720 * 100vw);
    }

    .event-benefit-template .deal__limit-ankor-drop-list {
        column-gap: calc(16 / 720 * 100vw);
        margin: calc(48 / 720 * 100vw);
    }

    .event-benefit-template .deal__limit-ankor-drop-item {
        padding: calc(11 / 720 * 100vw) calc(23 / 720 * 100vw);
        font-size: calc(26 / 720 * 100vw);
        font-weight: 500;
        line-height: 1.4615;
        letter-spacing: calc(-0.78em / 26);
    }

    .event-benefit-template .deal__first-deal-prd.soldout::after {
        font-size: calc(40 / 720 * 100vw);
        font-weight: 700;
        line-height: 135%;
        letter-spacing: calc(-0.8em / 40);
    }

    .event-benefit-template .deal__first-deal-linker {
        position: absolute;
    }

    .event-benefit-template .deal__first-deal-linker--01 {
        top: 90%;
        left: 6%;
        width: 42%;
        height: 6%;
    }

    .event-benefit-template .deal__first-deal-linker--02 {
        top: 90%;
        left: 52%;
        width: 42%;
        height: 6%;
    }

    .event-benefit-template .deal .prdList {
        margin-bottom: calc(48 / 720 * 100vw);
    }

    .event-benefit-template .deal__care-prd-wrap {
        margin: 0 calc(48 / 720 * 100vw);
    }

    .event-benefit-template .deal__care-prd {
        max-height: calc(1382 / 720 * 100vw);
    }

    .event-benefit-template .product-img-linker {
        grid-template-rows:
            calc(677.3 / var(--user-img-height) * 100%)
            calc(663.3 / var(--user-img-height) * 100%)
            calc(704.3 / var(--user-img-height) * 100%)
            calc(701.3 / var(--user-img-height) * 100%)
            calc(706.3 / var(--user-img-height) * 100%)
            calc(672.3 / var(--user-img-height) * 100%)
            calc(667.3 / var(--user-img-height) * 100%);
        grid-template-columns: repeat(2, 1fr);
        row-gap: calc(40 / var(--user-img-height) * 100%);
        column-gap: calc(32 / 624 * 100%);
    }

    .event-benefit-template .deal__more-btn-wrap {
        margin: calc(48 / 720 * 100vw) auto 0;
    }

    .event-benefit-template .deal .tooltip-box {
        top: calc(55 / 720 * 100vw) !important;
        right: calc(48 / 720 * 100vw) !important;
        left: calc(48 / 720 * 100vw) !important;
    }

    .event-benefit-template .deal__sub-title-desc--bottom-margin {
        margin-bottom: calc(48 / 720 * 100vw);
    }
}

/* // LG Days 8월의 딜 */

/* 포토리뷰 이벤트 */
.event-benefit-template .photo-review {
    background-color: #080808;
}

.event-benefit-template .photo-review .c-title__main-title {
    color: #fff;
}

.event-benefit-template .photo-review .c-title__desc {
    color: rgb(255 255 255 / 70%);
}

.event-benefit-template .photo-review__content {
    position: relative;
}

.event-benefit-template .photo-review__content .tooltip-wrap {
    position: absolute;
    bottom: 42.8%;
    left: 53.4%;
    width: 18%;
    height: 3%;
}

.event-benefit-template .photo-review__content .tooltip-wrap .tooltip-icon {
    width: 100%;
    height: 100%;
    background: none;
}

.event-benefit-template .photo-review__content .tooltip-box {
    top: 39px;
}

.event-benefit-template .bullet-list {
    margin-top: 0px;
}

.event-benefit-template .title + .bullet-list {
    margin-top: 24px;
}

@media screen and (width <= 767px) {
    .event-benefit-template .photo-review__content {
        margin: 0 calc(48 / 720 * 100%);
    }

    .event-benefit-template .photo-review__content .tooltip-wrap {
        bottom: 48%;
        left: 5%;
        width: 42%;
        height: 3.3%;
    }

    .event-benefit-template .photo-review__content .tooltip-box {
        top: 7vw !important;
        left: -4vw !important;
        width: 86.7vw;
    }
}

/* // 포토리뷰 이벤트 */
