@charset "utf-8";

.deal__first-deal-prd {
    
}

/* 추천 가전 모듈 커스텀 */
.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 {
    color: rgb(255 255 255 / 70%) !important;
    margin-top: 8px;
    font-size: 20px;
    font-weight: 400;
    line-height: 30px;
    letter-spacing: -0.4px;
    text-align: center;
}

@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: 32px 24px;
}

.prdList li {
    position: relative;
    max-width: 231px;
    overflow: hidden;
}

/* 상품 카드 공통 */
.prdList .img {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-height: 231px;
    aspect-ratio: 1 / 1;
    margin-bottom: 18px;
    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;
    letter-spacing: -0.312px;
    color: #fff;
    white-space: nowrap;
    background: #b7a095;
    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: 9px;
    font-size: 20px;
    font-weight: 600;
    line-height: normal;
    color: #fff;
    border-bottom: 1px solid #cec7b4;
}

.prdList strong em {
    display: block;
    padding-top: 6px;
    font-size: 17px;
    line-height: normal;
    font-weight: 400;
    color: #7e7c77;
}

.prdList dl {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    gap: 8px;
    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%;
    color: rgba(255, 255, 255, 0.90);
    font-size: 20px;
    font-weight: 400;
    line-height: normal;
}

.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/07/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/07/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/07/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/07/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/07/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/07/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 {
    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: 24px 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 {
    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;
}

.high-efficiency-flag .img::after {
    content: '';
    position: absolute;
    z-index: 1;
    top: 4.8%;
    right: 4.8%;
    width: 32px;
    height: 40px;
    background: url('/kr/event/2025/07/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;
    list-style: none;
    overflow: hidden;
}

.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 {
    content: '';
    position: absolute;
    z-index: 1;
    top: 4.8%;
    right: 4.8%;
    width: 32px;
    height: 40px;
    background: url('/kr/event/2025/07/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/07/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 {
    content: '';
    position: absolute;
    z-index: 1;
    top: 5%;
    right: 5%;
    width: 60px;
    height: 72px;
    background: url('/kr/event/2025/07/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 .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 .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 {
        padding-top: calc(8 / 720 * 100vw);
        font-size: calc(22 / 720 * 100vw);
    }

    .prdList .pd dl {
        gap: calc(8 / 720 * 100vw);
        padding-top: calc(16 / 720 * 100vw);
    }

    .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: 0;
    }

    .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 .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 .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 {
        padding: 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);
    }
    

    /* case 02 */
    .prdList--case02 li:first-child {
        grid-row: initial;
    }
    
    .prdList--case02 li:first-child > span {
        border-radius: calc(22 / 720 * 100vw);
    }

    .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.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 .badge em {
        font-size: calc(20 / 720 * 100vw);
        font-weight: 600;
        line-height: normal;
        letter-spacing: -0.32px;
    }
    
    .prdList--case02 li:first-child .typeBtn {
        width: 100%;
        padding: 0 calc(24/ 720 * 100vw) calc(24/ 720 * 100vw);
        margin-left: 0;
    }
}

/* 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: 16px;
    font-weight: 500;
    line-height: 28px;
    color: #aeaeae;
    letter-spacing: -0.32px;
    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: #696969;
        text-align: center;
        letter-spacing: calc(-1.12em / 28);
    }
}

/* // 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;
    gap: 16px;
    width: 100%;
    overflow-x: auto;
    white-space: nowrap;
}

.small-tab .tab_inner li {
    position: relative;
    height: 48px;
    background: transparent;
    border: 2px solid rgb(255 255 255 / 80%);
    border-radius: 24px;
}

.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: 20px;
    font-weight: 500;
    color: #fff;
    letter-spacing: calc(-0.4em / 20);
}

.small-tab .tab_inner li.active {
    background-color: #ea1917;
    border-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 {
        gap: calc(16 / 720 * 100vw);
        padding: 0;
    }

    .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(24 / 720 * 100vw);
        font-size: calc(26 / 720 * 100vw);
        font-weight: 600;
        line-height: 146.154%;
        letter-spacing: calc(-0.78em / 26);
    }
}

.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/07/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: 30%;
    left: 41%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 44%;
    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: 18%;
}

.kv-time--min {
    margin-left: 7%;
}

.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/07/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: 11%;
        width: 71%;
    }

    .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(128 / 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;
}

.event-benefit-template .coupon-benefit .coupon-notice--01 {
    margin-bottom: calc(56 / 980 * 100%);
}

.event-benefit-template .coupon-benefit .coupon-notice--02 {
    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);
    }

    .event-benefit-template .coupon-benefit__banner {
        margin: 0 calc(48 / 720 * 100vw);
    }

    .event-benefit-template .coupon-benefit .coupon-notice--01 {
        margin-bottom: calc(64 / 720 * 100vw);
    }

    .event-benefit-template .coupon-benefit .coupon-notice--02 {
        margin-bottom: calc(64 / 720 * 100%);
    }
}

/* // 한 번 더 아껴주는 어워즈 쿠폰 */

/* 구매의 즐거움을 더해줄 결제 혜택 */
.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/07/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: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::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/07/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: 20%;
    height: 32%;
}
.event-benefit-template .payment-benefits__linker--digiloca {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 20%;
    height: 32%;
}

.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: 30%;
    }
    .event-benefit-template .payment-benefits__linker--digiloca {
        bottom: 0;
        left: 0;
        width: 100%;
        height: 30%;
    }

    .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%;
    }

    .event-benefit-template .payment-benefits__list {
        padding: 0 calc(48 / 720 * 100vw);
    }

    .event-benefit-template .payment-benefits__item {
        padding: calc(34 / 720 * 100vw) calc(31 / 720 * 100vw);
        border-radius: calc(16 / 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);
    }

    .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 7월의 딜 */
.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 54px;
    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'] {
    padding-top: 44px;
}

.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__sub-title--care {
    margin-top : 100px;
}

.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 {
    margin-top: 24px;
}

.event-benefit-template .deal__first-deal-prd {
    position: relative;
    margin-top: 32px;
    margin-bottom: 56px;
    overflow: hidden;
    border-radius: 20px;
}

.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: 517px;
    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(540 / var(--user-img-height) * 100%) calc(545 / var(--user-img-height) * 100%) calc(567 / var(--user-img-height) * 100%) calc(560 / var(--user-img-height) * 100%) calc(559 / var(--user-img-height) * 100%);
    grid-template-columns: repeat(4, 1fr);
    gap: calc(22 / var(--user-img-height) * 100%) calc(24 / 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'] {
        padding-top: calc(44 / 720 * 100vw);
    }

    .event-benefit-template .deal__sub-title {
        padding: 0 calc(48 / 720 * 100vw);
        font-size: calc(40 / 720 * 100vw);
        font-weight: 700;
        line-height: 150%;
        text-align: left;
        letter-spacing: -0.8px;
    }
    
    .event-benefit-template .deal__sub-title--care {
        margin-top : calc(100 / 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: -0.56px;
    }

    .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__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(1317 / 720 * 100vw);
    }

    .event-benefit-template .product-img-linker {
        grid-template-rows: calc(677.3 / var(--user-img-height) * 100%) calc(678.3 / var(--user-img-height) * 100%) calc(697.3 / var(--user-img-height) * 100%) calc(687.3 / var(--user-img-height) * 100%) calc(714.3 / var(--user-img-height) * 100%) calc(716.3 / var(--user-img-height) * 100%) calc(716.3 / var(--user-img-height) * 100%) calc(716.3 / var(--user-img-height) * 100%);
        grid-template-columns: repeat(2, 1fr);
        row-gap: calc(24 / var(--user-img-height) * 100%);
        column-gap: calc(55 / 624 * 100%);
    }

    .event-benefit-template .deal__more-btn-wrap {
        margin: calc(48 / 720 * 100vw) auto 0;
    }

    .event-benefit-template .deal .tooltip-box {
        top: 38px !important;
        right: 28px !important;
        left: 28px !important;
    }

    .event-benefit-template .deal__sub-title-desc--bottom-margin {
        margin-bottom: calc(48 / 720 * 100vw);
    }
}

/* // LG Days 7월의 딜 */

/* 포토리뷰 이벤트 */
.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: 43.9%;
        left: 5%;
        width: 42%;
        height: 3.3%;
    }

    .event-benefit-template .photo-review__content .tooltip-box {
        top: 7vw !important;
        left: -4vw !important;
        width: 86.7vw;
    }
}

/* // 포토리뷰 이벤트 */