/*
전체 페이지 공통 CSS
2026. 03. 25 신규 디자인 템플릿 전용 파일



@charset "utf-8";

/* ========================= */
/* Reset */
/* ========================= */

/* 외부 환경 조정 */
.contents.exhibition.ex-module-wrap .ev-detail-con.wide {
    max-width: 1380px;
}
.contents.event .ev-detail-wrap .ev-detail-con {
    max-width: inherit;
    padding: 0;
}
.contents.event .ev-detail-wrap .ev-detail-con .ev-cont {
    max-width: 1380px;
    margin: 0 auto;
}
.contents.event .ev-detail-wrap .ev-detail-con .event-benefit-template {
    text-align: initial;
}
.contents.event .ev-detail-wrap .ev-detail-con .event-benefit-template .evt-cont {
    text-align: center;
}
/* // 외부 환경 조정 */

.event-benefit-template {
    max-width: var(--container-max-width);
    margin: 0 auto;

    * {
        font-family: "Pretendard";
    }

    picture,
    img {
        display: block;
        max-width: 100%;
    }

    a,
    button {
        background-color: rgba(0, 255, 0, 0);
    }
    
    section {
        width: 100%;
    }

    section article {
        text-align: initial;
    }

    a:focus-visible,
    input:focus-visible,
    div:focus-visible,
    button:focus-visible {
        outline: 2px solid #000;
        outline-offset: 4px;
    }

    @media screen and (max-width: 767px) {
        a,
        a:active {
            outline: none;
            -webkit-tap-highlight-color: transparent;
        }
        input {
            outline: none;
            -webkit-tap-highlight-color: transparent;
        }
        div:focus {
            -webkit-tap-highlight-color: transparent;
        }
        button:focus,
        button:active {
            -webkit-tap-highlight-color: transparent;
        }
        a:focus-visible,
        input:focus-visible,
        div:focus-visible,
        button:focus-visible {
            outline: 2px solid #000;
            outline-offset: 2px;
        }
    }
}
/* ========================= */
/* // Reset */
/* ========================= */

/* ========================= */
/* Layout */
/* ========================= */
.l-article {

    &.dark-mode {
        background-color: var(--primary-black);
    }

    .l-article__inner {
        display: flex;
        flex-direction: column;
        position: relative;
        width: 100%;
        padding: var(--spacing-article-split) 0;
        row-gap: var(--spacing-main-title-content);

        /* gt.yang 260330 : 메인 타이틀 없이 2depth 탭이 있을 경우 작업 필요.. */
        /* &:not(:has( > .c-title)) > .c-tab--2depth[data-tab-type="switch"] {
            row-gap: var(--spacing-standard-flow);
        } */

    }

    .l-article__inner--mo-gutter {
        padding-right: var(--spacing-standard-gutter);
        padding-left: var(--spacing-standard-gutter);

        .c-title {
            margin-right: 0;
            margin-left: 0;
        }
        .c-list {
            margin-right: 0;
            margin-left: 0;
        }
        .c-product__list {
            margin-right: 0;
            margin-left: 0;
        }
        .c-tab__list {
            padding-right: 0;
            padding-left: 0;
        }
    }

    .l-article__content-wrap {
        display: flex;
        flex-direction: column;
        width: 100%;
        row-gap: var(--spacing-standard-gutter);

        &:has(>.c-button--box) .c-button--box{
            margin-top: var(--spacing-group-connect);
        }
    }

    .l-article__content {
        position:relative;
        display: flex;
        width: 100%;
        flex-direction: column;
        row-gap: var(--spacing-group-connect);

        > .c-button--box{
            margin-top: var(--spacing-standard-gutter);
        }
    }

    .l-article__box {
        position: relative;
        display: flex;
        flex-direction: column;
        width: 100%;
        row-gap: var(--spacing-tight-bind);
    }
}

/* 최초 article 상단 여백 설정 */
.c-tab--main-switch + .c-tab__content > .c-tab__panel:first-of-type > section:first-of-type > .l-article:first-of-type .l-article__inner,
.c-tab--main-sticky + .c-tab__content > .c-tab__panel:first-of-type > section:first-of-type > .l-article:first-of-type .l-article__inner{
    padding-top: calc(40 * var(--ratio));
}
/* // 최초 article 상단 여백 설정 */

/* ========================= */
/* // Layout */
/* ========================= */

/* ========================= */
/* 전체 공통 변수 */
/* ========================= */
.event-benefit-template,
.ui_modal_wrap {
    --container-max-width: 780px;
    --design-base-width: 390; /* 모바일 디자인 기준 너비 */
    --fixed-vw: min(100vw, var(--container-max-width));
    --ratio: calc(var(--fixed-vw) / var(--design-base-width));

    --spacing-article-split: calc(32 * var(--ratio));       /* 큰 성격이 변하는 구간 */
    --spacing-nav-break: calc(28 * var(--ratio));           /* 탭 메뉴와 실제 콘텐츠 사이 */
    --spacing-standard-gutter: calc(20 * var(--ratio));     /* 전체 영역 좌우 여백 */
    --spacing-standard-flow: calc(20 * var(--ratio));       /* 일반적인 콘텐츠(카드-카드) 사이 */
    --spacing-main-title-content: calc(16 * var(--ratio));  /* 타이틀과 콘텐츠 사이 */
    --spacing-group-connect: calc(12 * var(--ratio));       /* 부피감이 있는 레이블과 컴포넌트 사이 */
    --spacing-tight-bind: calc(8 * var(--ratio));           /* 작은 텍스트 레이블과 리스트 시작점 사이 */
    --spacing-head-body: calc(2 * var(--ratio));            /* 타이틀과 아이브로우 사이 */

    --primary-black: #000;
    --primary-active-red: #FD312E;

    --lge-gray-g70: #181818;
    --lge-gray-g60: #242424;
    --lge-gray-g50: #777;
    --lge-gray-g40: #949494;
    --lge-gray-g30: #a7a7a7;
    --lge-gray-g20: #cbcbcb;
    --lge-gray-g10: #efefef;
    --lge-gray-g00: #fff;

    --warm-gray-30: #bfb8ae;
    --warm-gray-20: #e3e0dc;

    --calc-size--02: calc( 2 / 390 * var(--fixed-vw));
    --calc-size--04: calc( 4 / 390 * var(--fixed-vw));
    --calc-size--05: calc( 5 / 390 * var(--fixed-vw));
    --calc-size--06: calc( 6 / 390 * var(--fixed-vw));
    --calc-size--08: calc( 8 / 390 * var(--fixed-vw));
    --calc-size--09: calc( 9 / 390 * var(--fixed-vw));
    --calc-size--10: calc(10 / 390 * var(--fixed-vw));
    --calc-size--11: calc(11 / 390 * var(--fixed-vw));
    --calc-size--12: calc(12 / 390 * var(--fixed-vw));
    --calc-size--13: calc(13 / 390 * var(--fixed-vw));
    --calc-size--14: calc(14 / 390 * var(--fixed-vw));
    --calc-size--15: calc(15 / 390 * var(--fixed-vw));
    --calc-size--16: calc(16 / 390 * var(--fixed-vw));
    --calc-size--17: calc(17 / 390 * var(--fixed-vw));
    --calc-size--18: calc(18 / 390 * var(--fixed-vw));
    --calc-size--19: calc(19 / 390 * var(--fixed-vw));
    --calc-size--20: calc(20 / 390 * var(--fixed-vw));
    --calc-size--21: calc(21 / 390 * var(--fixed-vw));
    --calc-size--22: calc(22 / 390 * var(--fixed-vw));
    --calc-size--23: calc(23 / 390 * var(--fixed-vw));
    --calc-size--24: calc(24 / 390 * var(--fixed-vw));
    --calc-size--25: calc(25 / 390 * var(--fixed-vw));
    --calc-size--26: calc(26 / 390 * var(--fixed-vw));
    --calc-size--27: calc(27 / 390 * var(--fixed-vw));
    --calc-size--28: calc(28 / 390 * var(--fixed-vw));
    --calc-size--30: calc(30 / 390 * var(--fixed-vw));
    --calc-size--32: calc(32 / 390 * var(--fixed-vw));
    --calc-size--34: calc(34 / 390 * var(--fixed-vw));
    --calc-size--35: calc(35 / 390 * var(--fixed-vw));
    --calc-size--36: calc(36 / 390 * var(--fixed-vw));
    --calc-size--37: calc(37 / 390 * var(--fixed-vw));
    --calc-size--38: calc(38 / 390 * var(--fixed-vw));
    --calc-size--40: calc(40 / 390 * var(--fixed-vw));
    --calc-size--44: calc(44 / 390 * var(--fixed-vw));
    --calc-size--45: calc(45 / 390 * var(--fixed-vw));
    --calc-size--50: calc(50 / 390 * var(--fixed-vw));
    --calc-size--52: calc(52 / 390 * var(--fixed-vw));
    --calc-size--56: calc(56 / 390 * var(--fixed-vw));
    --calc-size--60: calc(60 / 390 * var(--fixed-vw));
    --calc-size--62: calc(62 / 390 * var(--fixed-vw));
    --calc-size--64: calc(64 / 390 * var(--fixed-vw));
    --calc-size--68: calc(68 / 390 * var(--fixed-vw));
    --calc-size--72: calc(72 / 390 * var(--fixed-vw));
    --calc-size--76: calc(76 / 390 * var(--fixed-vw));
    --calc-size--80: calc(80 / 390 * var(--fixed-vw));
}
/* ========================= */
/* // 전체 공통 변수 */
/* ========================= */

/* ========================= */
/* main KV */
/* ========================= */
.event-benefit-template .main-kv {
    position: relative;
}
.event-benefit-template .main-kv__video {
    display: block;
    width: 100%;
}
.event-benefit-template .main-kv__img {
    width: 100%;
}
/* ========================= */
/* // main KV */
/* ========================= */

/* ========================= */
/* 공유하기 버튼 위치 커스텀 */
/* ========================= */
/* 
@media screen and (max-width: 767px) {
    .contents.event .ev-detail-wrap .ev-detail-con .ev-cont .component-wrap.layer-btn {
        top: calc(427 / 390 * 100vw - 46px) !important;
        right: calc(20 / 390 * 100vw) !important;
    }
} */
/* ========================= */
/* // 공유하기 버튼 위치 커스텀 */
/* ========================= */

/* ========================= */
/* TAB */
/* ========================= */

/* TAB 전체 공통 */
.c-tab {
    .c-tab__inner {
        display: flex;
        justify-content: center;
    }

    .c-tab__list {
        display: flex;
        width: 100%;
        overflow-y: hidden;
        overflow-x: auto;
    }
    
    .c-tab__list--left {
        .c-tab__item {
            &:first-child {
                margin-left: initial;
            }
            &:last-child {
                margin-right: auto;
            }
        }
    }

    .c-tab__item {
        position: relative;
    }

    .c-tab__button {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 100%;
        text-align: center;
        white-space: nowrap;
    }
    .c-tab__button:focus-visible {
        outline-offset: -2px;
    }
}

.c-tab__panel:focus {
    outline: none;
}
.c-tab__panel:focus-visible {
    outline-offset: 2px;
}
.c-tab__panel {
    display: none;
}
.c-tab__panel.active {
    display: block;
}
[data-tab-type="scroll"] + .c-tab__content > .c-tab__panel {
    display: flex;
}

[data-tab-sticky="2depth"] {
    position: sticky;
    top: calc(var(--header-height) + var(--sticky-main-switch-height) + var(--sticky-main-sticky-height));
    z-index: 19;
}

.c-tab--main-switch {
    position: sticky;
    top: var(--header-height);
    right: 0;
    left: 0;
    z-index: 20;
    transform: translateZ(0);
    backface-visibility: hidden;
    will-change: transform;
}

.c-tab--main-sticky {
    position: sticky;
    top: calc(var(--header-height) + var(--sticky-main-switch-height));
    right: 0;
    left: 0;
    z-index: 20;
    transform: translateZ(0);
    backface-visibility: hidden;
    will-change: transform;
}

.c-tab--1depth {
    .c-tab__button {
        padding: calc(12 * var(--ratio)) 0;
        font-size: calc(16 * var(--ratio));
        font-weight: 400;
        line-height: 130%;
        letter-spacing: calc(-0.32 * var(--ratio));
    }
    .c-tab__item {
        flex: 1;
    }
    .c-tab__item.active .c-tab__button {
        font-weight: 700;
    }
}

.c-tab--2depth {
    .c-tab__list {
        width: 100%;
        column-gap: 0;
    }
    .c-tab__item {
        flex: 1;
    }
    .c-tab__button {
        padding: calc(12 * var(--ratio)) calc(20 * var(--ratio));
        font-size: calc(14 * var(--ratio));
        font-weight: 400;
        line-height: 130%;
        letter-spacing: calc(-0.56 * var(--ratio));
        &::after {
            content: '';
            position: absolute;
            right: 0;
            bottom: 0;
            width: 100%;
            height: 2px;
            opacity: 0;
        }
    }
    .c-tab__item.active .c-tab__button {
        font-weight: 600;
        &::after {
            opacity: 1;
        }
    }
}

.c-tab--3depth {

    .c-tab__inner {
        display: flex;
        justify-content: center;

        [data-tab-sticky="2depth"] & {
            padding: var(--spacing-group-connect) 0;
        }
    }

    .c-tab__list {
        display: flex;
        flex-wrap: nowrap;
        gap: calc(8 * var(--ratio));
        width: 100%;
        padding: 0 calc(20 * var(--ratio));
        overflow-x: auto;
        white-space: nowrap;
    }

    .c-tab__item {
        position: relative;
        flex: initial;
        background-color: transparent;
        border-radius: 100px;
        border-width: 1px;
        border-style: solid;

        &:first-child {
            margin-left: auto;
        }

        &:last-child {
            margin-right: auto;
        }

        &.active .c-tab__button {
            font-weight: 600;
        }
    }

    .c-tab__button {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 100%;
        padding: calc(5 * var(--ratio)) calc(11 * var(--ratio));
        text-align: center;
        font-size: calc(14 * var(--ratio));
        font-weight: 400;
        line-height: 140%;
        letter-spacing: calc(-0.56 * var(--ratio));
    }
}
/* // TAB 전체 공통 */

.c-tab--1depth-type01 {
    .c-tab__list {
        border-bottom: solid 1px var(--lge-gray-g20);
    }
    .c-tab__button {
        color: #444;
        background-color: var(--lge-gray-g00); 

        &:focus-visible {
            outline-color: var(--primary-active-red) !important;
        }
    }
    .c-tab__item.active .c-tab__button {
        background-color: var(--primary-black);
        color: var(--lge-gray-g00); 
    }
}

.c-tab--2depth-type01 {
    border-bottom: solid 1px var(--lge-gray-g20);
    
    .c-tab__inner {
        background-color: var(--lge-gray-g00);
    }
    .c-tab__button {
        color: #6F6F6F;
        
        &::after {
            background-color: var(--primary-black);
        }
        &:focus-visible {
            outline-color: var(--primary-active-red);
        }
    }
    .c-tab__item.active .c-tab__button {
        color: var(--primary-black);

        &::after {
            background-color: var(--primary-black);
        }
    }
}

.c-tab--3depth-type01 {
    .c-tab__inner {
        background-color: var(--lge-gray-g00);
    }
    .c-tab__item {
        border-color: var(--primary-black);
        
        &.active {
            background-color: var(--primary-black);
            border-color: var(--primary-black);

            .c-tab__button {
                color: var(--lge-gray-g00);
            }
        }
    }

    .c-tab__button {
        color: #111;
    }
}

.c-tab--1depth-type02 {
    .c-tab__list {
        border-bottom: solid 1px var(--lge-gray-g20);
    }
    .c-tab__button {
        color: var(--lge-gray-g40);
        background-color: var(--primary-black);

        &:focus-visible {
            outline-color: var(--primary-active-red) !important;
        }
    }
    .c-tab__item.active .c-tab__button {
        background-color: var(--lge-gray-g00);
        color: var(--lge-gray-g70);
    }
}

.c-tab--2depth-type02 {
    .c-tab__inner {
        background-color: var(--primary-black);
    }
    .c-tab__button {
        color: var(--lge-gray-g40);
        &::after {
            background-color: var(--primary-black);
        }
        &:focus-visible {
            outline-color: var(--primary-active-red);
        }
    }
    .c-tab__item.active .c-tab__button {
        color: var(--lge-gray-g00);

        &::after {
            background-color: var(--lge-gray-g00);
        }
    }
}

.c-tab--3depth-type02 {
    .c-tab__inner {
        background-color: var(--primary-black);
    }
    .c-tab__item {
        border-color: var(--lge-gray-g40);
        &.active {
            background-color: var(--lge-gray-g00); 
            border-color: var(--lge-gray-g00);

            .c-tab__button {
                color: var(--primary-black);
            }
        }
    }

    .c-tab__button {
        color: var(--lge-gray-g40);
    }
}


.c-tab--1depth-type03 {
    .c-tab__list {
        border-bottom: solid 1px var(--primary-active-red);
    }
    .c-tab__button {
        color: var(--lge-gray-g40);
        background-color: var(--primary-black);

        &:focus-visible {
            outline-color: var(--primary-active-red) !important;
        }
    }
    .c-tab__item.active .c-tab__button {
        background-color: var(--primary-active-red);
        color: var(--lge-gray-g00);
    }
}

.c-tab--2depth-type03 {
    .c-tab__inner {
        background-color: var(--primary-black);
    }
    .c-tab__button {
        color: var(--lge-gray-g40);
        &::after {
            background-color: var(--primary-active-red);
        }
        &:focus-visible {
            outline-color: var(--primary-active-red);
        }
    }
    .c-tab__item.active .c-tab__button {
        color: var(--lge-gray-g00);

        &::after {
            background-color: var(--primary-active-red);
        }

        &:focus-visible {
            outline-color: var(--primary-black);
        }
    }
}

.c-tab--3depth-type03 {
    .c-tab__inner {
        background-color: var(--primary-black);
    }
    .c-tab__item {
        border-color: var(--lge-gray-g40);
        &.active {
            background-color: var(--primary-active-red); 
            border-color: var(--primary-active-red);

            .c-tab__button {
                color: var(--lge-gray-g00);
            }
        }
    }

    .c-tab__button {
        color: var(--lge-gray-g40);
    }
}

.c-tab--1depth-type04 {
    .c-tab__list {
        border-bottom: solid 1px var(--lge-gray-g20);
    }
    .c-tab__button {
        color: #6F6F6F;
        background-color: var(--lge-gray-g00);

        &:focus-visible {
            outline-color: var(--primary-active-red) !important;
        }
    }
    .c-tab__item.active .c-tab__button {
        background-color: var(--primary-active-red);
        color: var(--lge-gray-g00);
    }
}

.c-tab--2depth-type04 {
    .c-tab__inner {
        background-color: var(--lge-gray-g00);
    }
    .c-tab__button {
        color: #7c7c7c;
        &::after {
            background-color: var(--primary-active-red);
        }
        &:focus-visible {
            outline-color: var(--primary-active-red);
        }
    }
    .c-tab__item.active .c-tab__button {
        color: var(--primary-active-red);

        &::after {
            background-color: var(--primary-active-red);
        }

        &:focus-visible {
            outline-color: var(--primary-black);
        }
    }
}

.c-tab--3depth-type04 {
    .c-tab__inner {
        background-color: var(--lge-gray-g00);
    }
    .c-tab__item {
        border-color: var(--lge-gray-g20);
        &.active {
            background-color: var(--primary-active-red); 
            border-color: var(--primary-active-red);

            .c-tab__button {
                color: var(--lge-gray-g00);
            }
        }
    }

    .c-tab__button {
        color: #6F6F6F;
    }
}

.c-tab--dot-text {
    margin: calc(12 * var(--ratio)) 0;
    .c-tab__list {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        white-space: nowrap;
        padding: 0 calc(20 * var(--ratio));
    }
    .c-tab__button {
        padding: calc(14 * var(--ratio)) 0;
        font-size: calc(13 * var(--ratio));
        letter-spacing: calc(-0.2em/13);
        font-weight: 400;
        line-height: 140%;
        color: #727780;

        .dark-mode & {
            color: #7E7E7E;
        }
    }
    .c-tab__item {
        position: relative;
    }
    .c-tab__item + .c-tab__item {
        margin-left: calc(18 * var(--ratio));
    }
    .c-tab__item + .c-tab__item{
        &::before {
            content: "";
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            left: calc(-8 * var(--ratio));
            width: calc(2 * var(--ratio));
            height: calc(2 * var(--ratio));
            background-color: #727780;
            border-radius: 50px;
        }
        .dark-mode &::before {
            background-color: #7E7E7E;
        }
    }
    .c-tab__item.active .c-tab__button {
        font-weight: 600;
        color: #111;

        .dark-mode & {
            color: #fff;
        }
    }
}

/* ========================= */
/* // TAB */
/* ========================= */


/* ========================= */
/* Title */
/* ========================= */

.c-title {
    margin-right: calc(20 * var(--ratio));
    margin-left: calc(20 * var(--ratio));

}
.c-title--normal {
    display: flex;
    flex-direction: column;
    row-gap: calc(2 * var(--ratio));
    text-align: center;

    .c-title__eyebrow {
        font-size: calc(16 * var(--ratio));
        font-weight: 500;
        line-height: 140%;
        letter-spacing: calc(-0.64 * var(--ratio));
        color: var(--lge-gray-g50);

        /* .dark-mode & {
            color: var(--lge-gray-g00);
        } */
    }
    .c-title__main {
        font-size: calc(26 * var(--ratio));
        font-weight: 700;
        line-height: 140%;
        letter-spacing: calc(-1.04 * var(--ratio));

        .dark-mode & {
            color: var(--lge-gray-g00);
        }
    }
    .c-title__sub-main {
        font-size: calc(18 * var(--ratio));
        font-weight: 600;
        line-height: 140%;
        letter-spacing: calc(-0.72 * var(--ratio));
    }
}

.c-title--left {
    text-align:left;
}
/* ========================= */
/* // Title */
/* ========================= */

/* ========================= */
/* List */
/* ========================= */
.c-list {
    display: flex;
    flex-direction: column;
    padding: 0;
    margin-right: calc(20 * var(--ratio));
    margin-left: calc(20 * var(--ratio));
    .c-list__item {
        position: relative;
        word-break: keep-all;
        &::before {
            content: '';
            position: absolute;
            border-radius: 100px;
        }
    }
}

.c-list--normal {
    row-gap: calc(2 * var(--ratio));
    .c-list__item {
        padding-left: calc(12 * var(--ratio));
        color: var(--primary-black);
        font-size: calc(13 * var(--ratio));
        font-weight: 400;
        line-height: 140%;
        letter-spacing: calc(-0.52 * var(--ratio));

        .dark-mode & {
            color: #ACACAC;
        }

        &::before {
            top: calc(9 * var(--ratio));
            left: calc(5 * var(--ratio));
            width: calc(2 * var(--ratio));
            height: calc(2 * var(--ratio));
            background-color: var(--primary-black);
        }

        .dark-mode &::before {
            background-color: #acacac;
        }
    }
    
}
/* ========================= */
/* // List */
/* ========================= */


/* ========================= */
/* toggle */
/* ========================= */
.c-toggle {
    .c-toggle__btn {
        position: relative;
        display: inline-flex;
        align-items: center;

        .dark-mode & {
            color: var(--lge-gray-g00);
        }
    }
    
    .c-toggle__btn--text::after {
        content: "";
        position: absolute;
        transition: transform 0.3s;
    }
    
    .c-toggle__content {
        position: relative;
        display: none;
    }
    &.on .c-toggle__btn::after {
        transform: translateY(-50%) rotate(180deg);
    }
    &.on .c-toggle__content {
        display: flex;
        flex-direction: column;
    }
    &.c-toggle--qna .c-toggle__content {
        margin-top: 0;
    }

    .c-toggle__title {
        margin-bottom: calc(2 * var(--ratio));
        color: var(--primary-black);
        font-size: calc(13 * var(--ratio));
        font-weight: 600;
        line-height: 140%;
        letter-spacing: calc(-0.26em / 12);

        .dark-mode & {
            color: var(--lge-gray-g00);
        }
    }
}

.c-toggle--normal {
    margin-top: calc(4 * var(--ratio));
    
    .c-toggle__content {
        row-gap: calc(16 * var(--ratio));
        margin-top:  calc(24 * var(--ratio));
    }

    .c-toggle__content--gray-bg {
        row-gap: calc(16 * var(--ratio));
        margin-top: calc(24 * var(--ratio));
        padding: calc(20 * var(--ratio)) calc(16 * var(--ratio));
        background-color: var(--lge-gray-g10);
        border-radius: calc(8 * var(--ratio));

        .dark-mode & {
            background-color: var(--lge-gray-g70);
        }
    }

    .c-button__icon {
        transition: transform 0.25s;
    }

    &.on .c-button__icon {
        transform: rotate(180deg);
    }
    
    &.on .c-toggle__btn::after {
        transform: translateY(-50%) rotate(0deg);
    }
}
/* ========================= */
/* // toggle */
/* ========================= */


/* ========================= */
/* QNA */
/* ========================= */
.l-toggle:has(.c-toggle--qna) {
    border-top:solid 1px var(--primary-black);
}
.c-toggle--qna {
    border-bottom:solid 1px var(--lge-gray-g30);
    .c-toggle__btn-wrap {
        margin: 0;
    }
    .c-toggle__btn {
        display: flex;
        align-items: flex-start;
        font-size: calc(14 * var(--ratio));
        font-weight:500;
        line-height: 1.4;
        text-align: left;
        padding: calc(16 * var(--ratio)) calc(12 * var(--ratio));
        outline-offset: -2px !important;
        width: 100%;

        &::after {
            content: "";
            position: absolute;
            top: calc(24 * var(--ratio));
            right: calc(12 * var(--ratio));
            width: calc(16 * var(--ratio));
            height: calc(16 * var(--ratio));
            background: url(/kr/event/promotions/images/icon-new-line-chevron-down-black.svg) no-repeat;
            background-size: contain;
            transform: translateY(-50%);
            transform-origin: center;
            transition: transform 0.3s;
        }
    }
    .c-toggle__head-symbol {
        padding-right: calc(2 * var(--ratio));
    }
    .c-toggle__content {
        margin-top: 0;
        row-gap: 0;
        padding: calc(16 * var(--ratio));
        background-color: #F3F5F7;
        font-size: calc(14 * var(--ratio));
        line-height: 1.4;
        letter-spacing: calc(-0.26em / 14);
        word-break: keep-all;
    }
}
/* ========================= */
/* // QNA */
/* ========================= */



/* ========================= */
/* coupon */
/* ========================= */

.c-coupon{
    width: calc(350* var(--ratio));
    height: calc(68* var(--ratio));
    margin: 0 auto;
    border-radius: calc(4* var(--ratio));
    overflow: hidden;
    display: flex;
    -webkit-mask-image: radial-gradient(circle at 100% 50%, transparent calc(6* var(--ratio)), var(--primary-black) calc(7* var(--ratio)));
    mask-image: radial-gradient(circle at 100% 50%, transparent calc(6* var(--ratio)), var(--primary-black) calc(7* var(--ratio)));

    .c-coupon__content{
        display: flex;
        flex-direction: row;
        width: 100%;
    }

    .c-coupon__info{
        display: flex;
        flex-direction: row;
        flex: 1;
    }
    .c-coupon__benefit {
        display: flex;
        width: calc(68 * var(--ratio));
        align-items: center;
        justify-content: center;
    }
    .c-coupon__ico--coupon {
        width: calc(28 * var(--ratio));
        height: calc(28 * var(--ratio));
    }

    .c-coupon__number {
        font-size: calc(22 * var(--ratio));
        font-weight: 600;
    }

    .c-coupon__unit--per {
        font-size: calc(16 * var(--ratio));
        font-weight: 500;
        line-height: 100%;
        letter-spacing: calc(-0.32em / 16);
    }

    .c-coupon__unit--kor {
        margin-top: 3px;
        font-size: calc(10 * var(--ratio));
        font-weight: 600;
        line-height: 100%;
        letter-spacing: calc(-0.2em / 10);
    }

    .c-coupon__title {
        display: flex;
        flex: 1;
        min-width: calc(187 * var(--ratio));
        margin: calc(16 * var(--ratio)) calc(10 * var(--ratio)) calc(16 * var(--ratio)) 0;
        flex-direction: column;
        justify-content: center;
        row-gap: calc(2 * var(--ratio));
    }

    .c-coupon__title-main {
        font-size: calc(14 * var(--ratio));
        line-height: 1.3;
        font-weight: 600;
        letter-spacing: calc(-0.28em / 14);
    }

    .c-coupon__title-desc {
        font-size: calc(11 * var(--ratio));
        line-height: 1.4;
        font-weight: 500;
        letter-spacing: calc(-0.22em / 11);
    }

    .c-coupon__button-box {
        display: flex;
        width: calc(85 * var(--ratio));
        flex-direction: column;
        align-items: center;
        justify-content: center;
        border-left: 1px dashed rgba(255, 255, 255, 0.5);
    }

    .c-coupon__button {
        display: flex;
        width: 100%;
        height: 100%;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: calc(2 * var(--ratio));
        outline-offset: -4px !important;
    }

    .c-coupon__ico--download {
        width: calc(20 * var(--ratio));
        height: calc(20 * var(--ratio));
        background: url('/kr/event/promotions/images/icon-new-white-download.svg') center / calc(20 * var(--ratio)) no-repeat;
    }

    .c-coupon__ico--link {
        width: calc(20 * var(--ratio));
        height: calc(20 * var(--ratio));
        background: url('/kr/event/promotions/images/icon-new-white-link.svg') center / calc(20 * var(--ratio)) no-repeat;
    }

    .c-coupon__button-text {
        font-size: calc(11 * var(--ratio));
        font-weight: 400;
        line-height: 1.4;
        letter-spacing: calc(-0.28em / 11);
    }
}

.c-coupon--red{
    background-color: var(--primary-active-red);

    .c-coupon__benefit {
        color: var(--lge-gray-g00);
    }

    .c-coupon__title-main {
        color: var(--lge-gray-g00);
    }

    .c-coupon__title-desc {
        color: var(--lge-gray-g00);
    }

    .c-coupon__button-text{
        color: var(--lge-gray-g00);
    }
    
    .c-coupon__ico--coupon {
        background: url('/kr/event/promotions/images/icon-new-red-coupon.svg') center / calc(28 * var(--ratio)) no-repeat;
    }
}
.c-coupon--white{
    background-color: var(--lge-gray-g00);
    .c-coupon__title-main{
        color: var(--primary-black);
    }
    .c-coupon__title-desc{
        color: var(--primary-black);
    }
    .c-coupon__benefit{
        color: var(--primary-active-red);
    }
    .c-coupon__button-box{
        border-left-color: rgba(0, 0, 0, 0.15);
    }
    .c-coupon__button-text{
        color: var(--primary-black);
    }
    .c-coupon__ico--download {
        background: url('/kr/event/promotions/images/icon-new-dark-download.svg') center / calc(20 * var(--ratio)) no-repeat;
    }

    .c-coupon__ico--coupon {
        background: url('/kr/event/promotions/images/icon-new-white-coupon.svg') center / calc(28 * var(--ratio)) no-repeat;
    }
}
.c-coupon--black{
    background-color: #2B2B2B;

    .c-coupon__benefit{
        color: var(--primary-active-red);
    }
    .c-coupon__title-main {
        color: var(--lge-gray-g00);
    }
    .c-coupon__title-desc {
        color: var(--lge-gray-g00);
    }
    .c-coupon__ico--coupon {
        background: url('/kr/event/promotions/images/icon-new-black-coupon.svg') center / calc(28 * var(--ratio)) no-repeat;
    }
    .c-coupon__button-text{
        color: var(--lge-gray-g00);
    }
}

/* ========================= */
/* // coupon */
/* ========================= */


/* ========================= */
/* 버튼 */
/* ========================= */


.c-button--text {
    .c-button__inner {
        text-align: center;
    }
    .c-button__label {
        position: relative;
        color: var(--primary-black);
        font-size: calc(12 * var(--ratio));
        font-weight: 500;
        line-height: 140%;
        letter-spacing: calc(-0.48em / 12);

        .dark-mode & {
            color: var(--lge-gray-g00);
        }

        &::after {
            content: '';
            position: absolute;
            top: 50%;
            right: 0;
            transform: translateY(-50%);
            transform-origin: center;
            transition: transform 0.3s;
        }
    }
}
.c-button--text-arrow-down {
    .c-button__label {
        padding-right: calc(18 * var(--ratio));
        &::after {
            width: calc(16 * var(--ratio));
            height: calc(16 * var(--ratio));
            transform: translateY(-50%) rotate(180deg);
            background: url(/kr/event/promotions/images/icon-new-line-chevron-up-black.svg) no-repeat;
            background-size: contain;
        }

        .dark-mode &::after {
            background: url(/kr/event/promotions/images/icon-new-line-chevron-up-white.svg) no-repeat;
            background-size: contain;
        }
    }
}

.c-button--text-underline {
    .c-button__label {
        border-bottom: solid 1px var(--primary-black);

        .dark-mode & {
            border-bottom: solid 1px var(--lge-gray-g00);
        }
    }
}

.c-button--box {
    .l-article__content > & {
        margin-top: var(--spacing-standard-flow);
    }

    .c-button__label {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: calc(4 * var(--ratio));
        min-width: calc(350 * var(--ratio));
        margin: 0;
        padding: calc(10 * var(--ratio)) calc(20 * var(--ratio));
        text-align: center;
        font-size: calc(16 * var(--ratio));
        font-weight: 700;
        line-height: 140%;
        letter-spacing: calc(-0.64 * var(--ratio));
        border-radius: 100px;
        border-width: 1px;
        border-style: solid;
    }
}

.c-button--box-filled-black {
    .c-button__label {
        color: var(--lge-gray-g00);
        background-color: var(--primary-black);
        border-color: var(--primary-black);
    }
}

.c-button--box-filled-white {
    .c-button__label {
        color: var(--primary-black);
        background-color: var(--lge-gray-g00);
        border-color: var(--lge-gray-g00);
    }
}

.c-button--box-outlined-black {
    .c-button__label {
        color: var(--primary-black);
        background-color: var(--lge-gray-g00);
        border-color: var(--primary-black);
    }
}

.c-button--box-outlined-white {
    .c-button__label {
        color: var(--lge-gray-g00);
        background-color: var(--primary-black);
        border-color: var(--lge-gray-g00);
    }
}

.c-button__icon--arrow-down-black {
    width: calc(16 * var(--ratio));
    height: calc(16 * var(--ratio));
    background: url(/kr/event/promotions/images/icon-new-line-chevron-down-black.svg) no-repeat;
    background-size: contain;
}

.c-button__icon--arrow-right-black {
    width: calc(16 * var(--ratio));
    height: calc(16 * var(--ratio));
    background: url(/kr/event/promotions/images/icon-new-line-chevron-down-black.svg) no-repeat;
    background-size: contain;
    transform: rotate(270deg);
}

.c-button__icon--arrow-down-white {
    width: calc(16 * var(--ratio));
    height: calc(16 * var(--ratio));
    background: url(/kr/event/promotions/images/icon-new-line-chevron-down-white.svg) no-repeat;
    background-size: contain;
}
/* ========================= */
/* // 버튼 */
/* ========================= */

/* ========================= */
/* 브라우저 내장 가로 스크롤 슬라이드 */
/* ========================= */
.c-native-scroll-slide {
    .c-native-scroll-slide__inner {
        overflow-x: auto;
        display: inline-flex; /* 중복 선언 통합 */
        padding: 0 calc(20 * var(--ratio));
        column-gap: calc(16 * var(--ratio));
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
    }

    .c-native-scroll-slide__item {
        scroll-snap-align: start;
        scroll-margin-left: calc(20 * var(--ratio));
    }
}
/* ========================= */
/* // 브라우저 내장 가로 스크롤 슬라이드 */
/* ========================= */


/* ========================= */
/* swiper */
/* ========================= */

/* 공통 */
.c-swiper.c-swiper {
    display: flex;
    flex-direction: column;
    row-gap: var(--spacing-standard-flow);
    width: 100%;

    &:has(.c-swiper__play-and-stop-button) {
        flex-direction: column-reverse;
    }

    .swiper-container {
        display: flex;
        position: relative;
        flex-direction: column;
        width: 100%;
        row-gap: var(--spacing-standard-flow);
        padding: 0 calc(20 * var(--ratio));

        &:has(.c-swiper__play-and-stop-button) {
            flex-direction: column-reverse;
        }
    }

    .swiper-container-wrap {
        position: relative;
        margin: 0;
    }

    .swiper-slide {
        background-color: transparent;
    }

    .swiper-slide a,
    .swiper-slide buttonm {
        scroll-margin-top: calc(var(--sticky-main-switch-height) + var(--sticky-main-sticky-height) + 200px);
    }

    .swiper-slide-visible {
        cursor: grab;

        &[aria-hidden="true"] {
            cursor: default;
        }
    }

    .c-swiper__controls {
        display: flex;
        align-items: center;
        justify-content: center;
        column-gap: calc(6 * var(--ratio));
    }

    .swiper-pagination-bullets {
        position: relative;
        bottom: initial;
        display: flex;
        justify-content: center;
        gap: max(2px, calc(2 * var(--ratio)));
        width: fit-content;
        padding-top: 0;
    }

    .swiper-pagination-bullet {
        display: flex;
        align-items: center;
        justify-content: center;
        width: max(18px, calc(18 * var(--ratio)));
        height: max(18px, calc(18 * var(--ratio)));
        margin: 0;
        background-color: transparent;
        opacity: 1;

        &::after {
            content: "";
            display: block;
            width: max(5px, calc(5 * var(--ratio)));
            height: max(5px, calc(5 * var(--ratio)));
            background-color: #898989;
            border-radius: 100px;
        }

        .dark-mode &::after {
            background-color: #8F9298;
        }
    }

    .swiper-pagination-bullet-active {
        background-color: transparent;
        opacity: 1;

        .dark-mode &::after {
            background-color: transparent;
        }

        &::after {
            content: "";
            display: block;
            width: max(10px, calc(10 * var(--ratio)));
            height: max(10px, calc(10 * var(--ratio)));
            border: solid max(2px, calc(2 * var(--ratio))) #111;
            background-color: transparent;
        }

        .dark-mode &::after {
            border: solid max(2px, calc(2 * var(--ratio))) var(--lge-gray-g00);
        }
    }

    .c-swiper__play-and-stop-button-wrap {
        position: relative;
    }

    .c-swiper__play-and-stop-button {
        display: flex;
        width: max(18px, calc(18 * var(--ratio)));
        height: max(18px, calc(18 * var(--ratio)));
        cursor: pointer;
        background-color: #fff;
        border-radius: 100px;
        align-items: center;
        justify-content: center;

        &::before {
            display: block;
            content: "";
        }

        &[aria-pressed="false"]:before {
            box-sizing: border-box;
            width: max(6px, calc(6 * var(--ratio)));
            height: max(6px, calc(6 * var(--ratio)));
            border-right: max(2px, calc(2 * var(--ratio))) solid #111;
            border-left: max(2px, calc(2 * var(--ratio))) solid #111;
        }

        &[aria-pressed="true"]:before {
            border-top: max(4px, calc(4 * var(--ratio))) solid transparent;
            border-bottom: max(4px, calc(4 * var(--ratio))) solid transparent;
            border-left: max(6px, calc(6 * var(--ratio))) solid #111;
        }
    }

    .swiper-navigation-button {
        position: absolute;
        top: 50%;
        z-index: 10;
        display: flex;
        align-items: center;
        justify-content: center;
        width: calc(32 * var(--ratio));
        height: calc(32 * var(--ratio));
        cursor: pointer;
        border-radius: 100px;
        box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.36), 0 2px 8px 0 rgba(0, 0, 0, 0.08);
        transform: translateY(-50%) rotate(270deg);
        background: #fff url(/kr/event/promotions/images/icon-new-line-chevron-up-black.svg) no-repeat;
        background-size: calc(16 * var(--ratio)) calc(16 * var(--ratio));
        background-position: center;
        transition:
            background-color 0.2s,
            box-shadow 0.2s,
            opacity 0.2s;

        &:hover {
            background-color: #fff;
            box-shadow: 0 0 0.5px 0 rgba(33, 39, 49, 0.36), 0 1px 4px 0 rgba(33, 39, 49, 0.08);
        }

        &:focus-visible {
            outline: 3px solid #007bff;
            outline-offset: 2px;
        }
    }

    .swiper-navigation-button--prev {
        left: calc(4* var(--ratio));
    }

    .swiper-navigation-button--next {
        right: calc(4* var(--ratio));
        transform: translateY(-50%) rotate(90deg);
    }

    .swiper-button-disabled {
        pointer-events: none;
        cursor: not-allowed;
        opacity: 0.3;
        display: none !important;
    }
}
/* // 공통 */

.synced-tab-slider {
    width: 100%;
    .c-tab--3depth {
        margin-bottom: var(--spacing-group-connect);
    }
}

/* ========================= */
/* // swiper */
/* ========================= */


/* ========================= */
/* custom scroll slider */
/* ========================= */
.custom-scroll-slider {
    .custom-scroll-slider__container {
        position: relative;
        overflow: visible;
    }

    .custom-scroll-slider__nav-button {
        position: absolute;
        top: 50%;
        z-index: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        width: calc(32 * var(--ratio));
        height: calc(32 * var(--ratio));
        cursor: pointer;
        border-radius: 100px;
        box-shadow: 0 0 1px 0 rgba(33, 39, 49, 0.36), 0 2px 6px 0 rgba(33, 39, 49, 0.08);
        transform: translateY(-50%);
        background: #fff url(/kr/event/promotions/images/icon-line-chervron-left-black-mo.svg) no-repeat;
        background-size: calc(5 * var(--ratio)) calc(8 * var(--ratio));
        background-position: center;
        transition:
            background-color 0.2s,
            box-shadow 0.2s,
            opacity 0.2s;

        &:hover {
            background-color: #fff;
            box-shadow: 0 0 0.5px 0 rgba(33, 39, 49, 0.36), 0 1px 4px 0 rgba(33, 39, 49, 0.08);
        }

        &:focus-visible {
            outline: 3px solid #007bff;
            outline-offset: 2px;
        }
    }

    .custom-scroll-slider__nav-button--prev {
        left: calc(-18 * var(--ratio));
    }

    .custom-scroll-slider__nav-button--next {
        right: calc(-18 * var(--ratio));
        transform: translateY(-50%) rotate(180deg);
    }

    .custom-scroll-slider__nav-button--disabled {
        pointer-events: none;
        cursor: not-allowed;
        opacity: 0.3;
        display: none !important;
    }

    .custom-scroll-slider__content-wrapper {
        display: flex;
        column-gap: calc(12 * var(--ratio));
        overflow-x: auto;
        overflow-y: hidden;
        cursor: grab;
        user-select: none;
        scrollbar-width: none;

        &::-webkit-scrollbar {
            display: none;
        }

        &:has(.c-img-product--pc-vertical-horizon-scroll) {
            column-gap: initial;
            padding: 0;
            margin: 0;
        }
    }

    .j-custom-scroll-slider--only-mo .custom-scroll-slider__content-wrapper {
        overflow: initial;
    }

    .j-custom-scroll-slider--only-pc .custom-scroll-slider__content-wrapper {
        overflow: initial;
    }

    &:not(.j-custom-scroll-slider--only-mo):not(.j-custom-scroll-slider--only-pc) .custom-scroll-slider__content-wrapper {
        overflow-x: auto;
    }

    .custom-scroll-slider__item {
        position: relative;
        scroll-snap-align: start;

        &:has(.c-img-product--pc-vertical-horizon-scroll) {
            display: flex;
            display: block;
        }

        &:focus-visible {
            outline: 3px solid #007bff !important;
            outline-offset: -3px !important;
        }
    }

    .custom-scroll-slider--disabled-on-touch-device .custom-scroll-slider__scrollbar {
        display: none;
    }

    .custom-scroll-slider__content-wrapper--active {
        cursor: grabbing;
        cursor: -webkit-grabbing;
    }

    .custom-scroll-slider__scrollbar {
        display: flex;
        justify-content: center;
        padding: 10px 0;
        margin-top: calc(16 * var(--ratio));
    }

    .custom-scroll-slider__scrollbar-track {
        position: relative;
        width: calc(80 * var(--ratio));
        height: max(4px, calc(4 * var(--ratio)));
        background-color: #CFCFCF;
    }

    .custom-scroll-slider__scrollbar-thumb {
        position: absolute;
        top: 0;
        left: 0;
        width: 50px;
        height: 100%;
        cursor: grab;
        background-color: #000;

        &::before {
            position: absolute;
            top: -10px;
            right: 0;
            bottom: -10px;
            left: 0;
            content: "";
            background-color: transparent;
        }
    }

    .custom-scroll-slider__scrollbar-thumb--active {
        cursor: grabbing;
        cursor: -webkit-grabbing;
    }

    @media screen and (max-width: 767px) {
        .custom-scroll-slider__content-wrapper {
            scroll-snap-type: x mandatory;
            scroll-behavior: smooth;
        }
        .custom-scroll-slider__item {
            scroll-snap-align: start;
        }
    }
}
/* ========================= */
/* // custom scroll slider */
/* ========================= */

/* ========================= */
/* 통이미지 제품 */
/* ========================= */

/* 기본 형태 - PC : 작은 세로형, MO : 작은 세로형 */
.c-img-product {

    .c-img-product__content {
        overflow: hidden;
        position: relative;
        margin: 0 calc(20 * var(--ratio));
        max-height: calc(1196 * var(--ratio));
    }
    
    .c-img-product__content-wrapper {
        overflow: hidden;
    }
    
    .c-img-product__content-wrapper .c-img-product__content {
        position: relative;
        margin-top: 20px;
    }

    .c-img-product__picture-wrapper {
        margin-top: calc(20 * var(--ratio));
    }

    .c-img-product__content:first-child {
        margin-top: 0;
    }

    .c-img-product__picture {
        display: block;
    }

    &.active .c-img-product__content-wrapper {
        max-height: initial;
    }

    &.active .c-img-product__content {
        max-height: initial;
    }

    &.active .l-button-group {
        display: none;
    }

    .c-img-product__linker {
        position: absolute;
        display: grid;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        column-gap: calc(12 * var(--ratio));
        row-gap: calc(20 / var(--user-img-height) * 100%);
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(15, calc(295 / var(--user-img-height) * 100%));
    }
}

/* PC : 3줄 작은 가로형, MO : 3줄 가로형 */
.c-img-product--only-horizon {
    .c-img-product__content {
        margin: 0 calc(20 * var(--ratio));
        max-height: calc(546 * var(--ratio));
    }

    .c-img-product__linker {
        column-gap: 0;
        row-gap: 0;
        grid-template-columns: 1fr;
        grid-template-rows: repeat(3, calc(120 / var(--user-img-height) * 100%));
    }
}

/* PC : 가로 스크롤 및 작은 세로형, MO : 작은 세로형 */
.c-img-product--pc-vertical-horizon-scroll {
    .c-img-product__content {
        max-height: 100%;
    }

    .c-img-product__pircture { /* 원본 오타(pircture) 유지 */
        display: block;
        width: 100%;
    }

    .c-img-product__linker {
        width: auto;
        column-gap: calc(12 * var(--ratio));
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(15, calc(295 / var(--user-img-height) * 100%));
    }
}

/* ========================= */
/* // 통이미지 제품 */
/* ========================= */

/* ========================= */
/* Product API */
/* ========================= */

/* 기본 형태 - PC : 작은 세로형, MO : 작은 세로형 */
.event-benefit-template .c-product {
    position: relative;
}

.event-benefit-template .c-product__list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: calc(20 * var(--ratio)) calc(12 * var(--ratio));
    padding: 0;
    margin: 0;
    list-style: none;
}

.event-benefit-template .c-product__item {
    position: relative;
    display: flex;
    flex-direction: column;
    background-color: #fff;
    transition: transform 0.3s ease;
}

.event-benefit-template .c-product__item > span[data-prdvalue] > a {
    display: flex;
    flex-grow: 1;
    flex-direction: column;
    color: inherit;
    text-decoration: none;
}

.event-benefit-template .c-product__item > span[data-prdvalue] > a:focus-visible {
    outline-offset: -4px;
}

.event-benefit-template .c-product__visual {
    position: relative;
    padding: calc(14 * var(--ratio));
    overflow: hidden;
    border: solid 1px #dee1e5;
    border-radius: calc(4 * var(--ratio));
}

.event-benefit-template .c-product__visual:has(.c-product__image-badge--time-deal) {
    padding-top: calc(14 * var(--ratio));
    padding-bottom: calc(14 * var(--ratio));
}

.event-benefit-template .c-product__image-wrapper {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
}

.event-benefit-template .c-product__ranking-number {
    position: absolute;
    z-index: 1;
    top: max(4px, calc(4 * var(--ratio)));
    left: max(4px, calc(4 * var(--ratio)));
    display: flex;
    min-width: max(20px, calc(20 * var(--ratio)));
    min-height: max(20px, calc(20 * var(--ratio)));
    justify-content: center;
    align-items: center;
    padding: max(2px, calc(2 * var(--ratio))) max(6px, calc(6 * var(--ratio)));
    color: #F5F6F8;
    font-size: max(11px, calc(11 * var(--ratio)));
    font-weight: 600;
    line-height: 127.273%;
    letter-spacing: normal;
    border-radius: max(4px, calc(4 * var(--ratio)));
    background: #000;
}

.event-benefit-template .c-product__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.event-benefit-template .c-product__image-badge--time-deal {
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: calc(2 * var(--ratio));
    background: #000;
    color: #FFF;
    text-align: center;
    font-size: calc(10 * var(--ratio));
    font-weight: 600;
    line-height: 220%;
    letter-spacing: calc(-0.2em / 10);
}

.event-benefit-template .c-product__info-container a:has(.c-product__info) {
    display: block;
}

.event-benefit-template .c-product__badge-container {
    display: flex;
    flex-wrap: wrap;
    gap: calc(4 * var(--ratio));
    margin-top: calc(10 * var(--ratio));
}

.event-benefit-template .c-product__badge {
    padding: calc(2 * var(--ratio)) calc(6 * var(--ratio));
    font-size: calc(11 * var(--ratio));
    font-weight: 600;
    line-height: 127.273%;
    border-radius: max(2px, calc(2 * var(--ratio)));
}

.event-benefit-template .c-product__badge--limit-membership {
    color: #fff;
    background-color: #ea1917;
}

.event-benefit-template .c-product__badge--normal-membership {
    color: #ea1917;
    background-color: #fef3f3;
}

.event-benefit-template .c-product__badge--sale {
    color: white;
    background-color: #e53935;
}

.event-benefit-template .c-product__badge--card-discount {
    color: white;
    background-color: #e53935;
}

.event-benefit-template .c-product__badge--time-deal {
    color: white;
    background-color: #3563e5;
}

.event-benefit-template .c-product__badge--subscription-first {
    background-color: #EA1917;
    color: #fff;
}
.event-benefit-template .c-product__badge--discount-half {
    background-color: #978075;
    color: #fff;
}
.event-benefit-template .c-product__badge--promotion-limited {
    background-color: #111111;
    color: #fff;
}
.event-benefit-template .c-product__badge--review-reward {
    background-color: #F3F5F7;
    color: #111111;
}
.event-benefit-template .c-product__badge--membership-benefit {
    background-color: #FDF2F0;
    color: #EA1917;
}

.event-benefit-template .c-product__care-service {
    display: flex;
    flex-wrap: wrap;
    gap: max(4px, calc(4 * var(--ratio))) 0px;
    align-items: center;
    padding: calc(8 * var(--ratio)) calc(12 * var(--ratio));
    margin-top: calc(12 * var(--ratio));
    background: #f3f5f7;
    border-radius: max(4px, calc(4 * var(--ratio)));
}

.event-benefit-template .c-product__care-service-title {
    width: 100%;
    font-size: max(11px, calc(11 * var(--ratio)));
    font-weight: 600;
    line-height: 127.273%;
    color: #000;
}

.event-benefit-template .c-product__care-service-list {
    display: flex;
    flex-wrap: wrap;
    gap: calc(4 * var(--ratio)) calc(9 * var(--ratio));
    margin-top: max(2px, calc(2 * var(--ratio)));
}

.event-benefit-template .c-product__care-service-item {
    position: relative;
    font-size: max(11px, calc(11 * var(--ratio)));
    font-weight: 400;
    line-height: 127.273%;
    color: #444;
}

.event-benefit-template .c-product__care-service-item::after {
    position: absolute;
    top: 50%;
    right: 0;
    display: block;
    width: 1px;
    height: max(8px, calc(8 * var(--ratio)));
    margin-right: calc(-5 * var(--ratio));
    content: "";
    background-color: #ddd;
    transform: translateY(-50%);
}

.event-benefit-template .c-product__care-service-item:last-child::after {
    display: none;
}

.event-benefit-template.iphone.safari .c-product__info,
.event-benefit-template.iphone.safari .c-product__brand-name,
.event-benefit-template.iphone.safari .c-product__name {
    word-break: break-all;
}

.event-benefit-template .c-product__info {
    display: flex;
    flex-direction: column;
    margin-top: max(8px, calc(12 * var(--ratio)));
}

.event-benefit-template .c-product__brand-name {
    margin-bottom: calc(4 * var(--ratio));
    color: #727780;
    font-size: calc(11 * var(--ratio));
    font-weight: 400;
    line-height: 163.636%;
}

.event-benefit-template .c-product__name {
    font-size: calc(13 * var(--ratio));
    font-weight: 500;
    line-height: 140%;
    color: #111;
    letter-spacing: calc(-0.2em / 13);
}

.event-benefit-template .c-product__model-id {
    margin-top: max(2px, calc(2 * var(--ratio)));
    font-size: calc(12 * var(--ratio));
    font-weight: 400;
    line-height: 133.33%;
    color: #43474D;
}

.event-benefit-template .c-product__price-area {
    margin-top: calc(10 * var(--ratio));
}

.event-benefit-template .c-product__price-list {
    display: flex;
    flex-wrap: wrap;
    gap: max(2px, calc(2 * var(--ratio))) max(6px, calc(6 * var(--ratio)));
    margin: 0;
}

.event-benefit-template .c-product__price-list--one-time-purchase {
    flex-wrap: wrap;
}

.event-benefit-template .c-product__price-list--subscription {
    flex-direction: column;
}

.event-benefit-template .c-product__price-item {
    display: flex;
    column-gap: calc(4 * var(--ratio));
    align-items: center;
}

.event-benefit-template .c-product__discount {
    color: #EA1917;
    font-size: calc(15 * var(--ratio));
    font-weight: 600;
    line-height: 173.333%;
    letter-spacing: calc(-0.4 * var(--ratio));
}

.event-benefit-template .c-product__price-item--final {
    flex-basis: 100%;
    justify-content: flex-start;
    color: #ea1917;
}

.event-benefit-template .c-product__price-label--final {
    font-size: calc(12 * var(--ratio));
    font-weight: 400;
    line-height: 133.333%;
}

.event-benefit-template .c-product__price-value {
    display: flex;
    text-align: right;
    align-items: center;
}

.event-benefit-template .c-product__price-value--fianl {
    font-size: calc(14 * var(--ratio));
    font-weight: 600;
    line-height: 142.857%;
    letter-spacing: -0.4px;
    white-space: nowrap;
}

.event-benefit-template .c-product__unit {
    font-size: calc(12 * var(--ratio));
    font-weight: 400;
    line-height: 133.333%;
    color: inherit;
    letter-spacing: -0.2px;
}

.event-benefit-template .c-product__unit--month {
    margin-right: calc(2 * var(--ratio));
}

.event-benefit-template .c-product__price-item--member {
    font-size: calc(15 * var(--ratio));
    font-weight: 600;
    line-height: 133.333%;
    color: #111;
    letter-spacing: calc(-0.2em / 15);
}

.event-benefit-template .c-product__price-item--discount-rate {
    font-size: calc(15 * var(--ratio));
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: calc(-0.4em / 15);
    white-space: nowrap;
    color: #EA1917;
}

.event-benefit-template .c-product__price-item--original {
    font-size: calc(12 * var(--ratio));
    font-weight: 400;
    line-height: 133.333%;
    color: #43474D;
    text-decoration-line: line-through;
    letter-spacing: calc(-0.2em / 12);
}

.event-benefit-template .c-product__price-item--final .c-product__price-value strong {
    font-size: calc(14 * var(--ratio));
    font-weight: 600;
    line-height: 120%;
    letter-spacing: calc(-0.4em / 14);
    color: #ea1917;
}

.event-benefit-template .c-product__info-container {
    display: flex;
    flex-direction: column;
}

.event-benefit-template .c-product__actions {
    position: relative;
    z-index: 1;
    display: flex;
    flex-wrap: wrap;
    gap: calc(6 * var(--ratio));
    justify-content: center;
    margin-top: calc(12 * var(--ratio));
}

.event-benefit-template .c-product__actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    padding: calc(5 * var(--ratio)) calc(10 * var(--ratio));
    overflow: hidden;
    font-size: calc(12 * var(--ratio));
    font-weight: 400;
    line-height: 133.333%;
    color: #111;
    text-decoration: none;
    cursor: pointer;
    background-color: #fff;
    border: 1px solid #dee1e5;
    border-radius: 32px;
    transition:
        background-color 0.2s,
        border-color 0.2s,
        color 0.2s;
}

.event-benefit-template .c-product__actions a:hover {
    background-color: #f0f0f0;
}

.event-benefit-template .c-product__actions a.sold-out {
    position: relative;
    pointer-events: none;
    cursor: not-allowed;
    opacity: 0.3;
}

.event-benefit-template .c-product__sold-out-icon {
    position: relative;
    display: none;
    padding-left: calc(18 * var(--ratio));
    margin-top: calc(10 * var(--ratio));
    font-size: calc(14 * var(--ratio));
    font-weight: 600;
    line-height: 120%;
    color: #111;
    letter-spacing: calc(-0.4em / 14);
}

.event-benefit-template .c-product__sold-out-icon::before {
    position: absolute;
    left: 0;
    display: block;
    width: calc(16 * var(--ratio));
    height: calc(16 * var(--ratio));
    content: "";
    background: url("/kr/event/promotions/images/icon-product-api-sold-out.svg") no-repeat;
    background-size: contain;
}

.event-benefit-template .c-product__item--loading .c-product__image-wrapper,
.event-benefit-template .c-product__item--loading .c-product__brand-name,
.event-benefit-template .c-product__item--loading .c-product__name,
.event-benefit-template .c-product__item--loading .c-product__model-id {
    color: transparent;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200px 100%;
    border-radius: 4px;
    animation: skeleton-gradient 3s infinite linear alternate;
}

.event-benefit-template .c-product__item--loading .c-product__brand-name {
    width: 80%;
    height: calc(11 * var(--ratio) * 1.636);
}

.event-benefit-template .c-product__item--loading .c-product__name {
    width: 80%;
    height: calc(44 * var(--ratio));
}

.event-benefit-template .c-product__item--loading .c-product__model-id {
    width: 50%;
    height: calc(18 * var(--ratio));
}

.event-benefit-template .c-product__item--sold-out {
    position: relative;
}

.event-benefit-template .c-product__item--sold-out > span > a {
    pointer-events: none;
}

.event-benefit-template .c-product__item--sold-out .c-product__visual::after {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    font-size: calc(16 * var(--ratio));
    font-weight: 500;
    line-height: 22px;
    color: #fff;
    letter-spacing: -0.2px;
    content: "일시품절";
    background-color: rgba(0, 0, 0, 0.5);
}

.event-benefit-template .c-product__item--sold-out .c-product__sold-out-icon {
    display: block;
}

.event-benefit-template .c-product__item--sold-out .c-product__price-item--member,
.event-benefit-template .c-product__item--sold-out .c-product__price-item--original {
    opacity: 0.2;
}

.event-benefit-template .c-product__item--sold-out .c-product__price-item--final,
.event-benefit-template .c-product__item--sold-out .c-product__badge-container {
    opacity: 0.3;
}

@keyframes skeleton-gradient {
    0% {
        background-position: -200px 0;
    }

    100% {
        background-position: calc(200px + 100%) 0;
    }
}

/* 가로형 */
.event-benefit-template .c-product__list--only-horizontal {
    grid-template-columns: 1fr;
}

.event-benefit-template .c-product__list--only-horizontal .c-product__visual {
    padding: calc(10 * var(--ratio));
}

.event-benefit-template .c-product__list--only-horizontal .c-product__info-container a:has(.c-product__info) {
    order: 1;
}

.event-benefit-template .c-product__list--only-horizontal .c-product__actions {
    justify-content: flex-start;
    order: initial;
    margin-top: calc(10 * var(--ratio));
}

.event-benefit-template .c-product__list--only-horizontal .c-product__info {
    margin-top: 0;
}

.event-benefit-template .c-product__list--only-horizontal .c-product__badge-container {
    order: 3;
    margin-top: calc(10 * var(--ratio));
}

.event-benefit-template .c-product__list--only-horizontal .c-product__care-service {
    order: 4;
    margin-top: calc(10 * var(--ratio));
}

.event-benefit-template .c-product__list--only-horizontal span[data-prdvalue] {
    display: flex;
    column-gap: calc(12 * var(--ratio));
}

.event-benefit-template .c-product__list--only-horizontal span[data-prdvalue] > a {
    flex-basis: calc(120 * var(--ratio));
}

.event-benefit-template .c-product__list--only-horizontal .c-product__info-container {
    flex-basis: calc(218 * var(--ratio));
}

.event-benefit-template .c-product__list--only-horizontal .c-product__sold-out-icon {
    order: 3;
}
/* // 가로형 */


/* 썸네일 커스텀 - 전체 공통 */
.event-benefit-template [class*="c-product__list--thumnail-custom"] .c-product__image-badge--time-deal {
    padding-top: calc(10 * var(--ratio));
    padding-bottom: calc(10 * var(--ratio));
    font-size: calc(14 * var(--ratio));
    line-height: 157.143%;
    letter-spacing: calc(-0.28em / 14);
}

.event-benefit-template [class*="c-product__list--thumnail-custom"] .c-product__name {
    font-size: calc(17 * var(--ratio));
    font-weight: 600;
    line-height: calc(24 * var(--ratio));
    letter-spacing: calc(-0.3em/17);
}

.event-benefit-template [class*="c-product__list--thumnail-custom"] .c-product__price-area {
    margin-top: calc(8 * var(--ratio));
}

.event-benefit-template [class*="c-product__list--thumnail-custom"] .c-product__price-list {
    gap: max(2px, calc(2 * var(--ratio))) max(6px, calc(6 * var(--ratio)));
}

.event-benefit-template [class*="c-product__list--thumnail-custom"] .c-product__actions {
    display: flex;
    flex-wrap: nowrap;
    column-gap: calc(8 * var(--ratio));
}

.event-benefit-template [class*="c-product__list--thumnail-custom"] .c-product__actions a {
    display: flex;
    column-gap: max(2px, calc(2 * var(--ratio)));
    justify-content: center;
    align-items: center;
    flex-basis: 100%;
    border-radius: max(3px, calc(3 * var(--ratio)));
    border: solid 1px #8F9298;
    text-align: center;
    font-size: calc(12 * var(--ratio));
    font-weight: 500;
    line-height: 133.333%;
}

.event-benefit-template [class*="c-product__list--thumnail-custom"] .c-product__actions a::after {
    content: '';
    width: calc(16 * var(--ratio));
    height: calc(16 * var(--ratio));
    background-image: url(/kr/event/promotions/images/icon-black-arrow-right.svg);
    background-size: contain;
}
/* // 썸네일 커스텀 - 전체 공통 */

/* 썸네일 커스텀, 큰 세로형 */
.event-benefit-template .c-product__list--thumnail-custom-vertical {
    border-radius: 8px;
    grid-template-columns: 1fr;
    margin: 0;
}

.event-benefit-template .c-product__list--thumnail-custom-vertical .c-product__item {
    overflow: hidden;
    border-radius: calc(8 * var(--ratio));
    box-shadow: 0 0 1px 0 rgba(33, 39, 49, 0.00), 0 2px 10px 0 rgba(33, 39, 49, 0.15);
}

.event-benefit-template .c-product__list--thumnail-custom-vertical .c-product__visual {
    padding: 0;
    border-radius: 0;
}

.event-benefit-template .c-product__list--thumnail-custom-vertical .c-product__info-container {
    padding: 0 calc(20 * var(--ratio)) calc(20 * var(--ratio));
}
/* // 썸네일 커스텀, 세로형 */


/* 가로형 */
.event-benefit-template .c-product__list--horizontal {
    grid-template-columns: 1fr;
}

.event-benefit-template .c-product__list--horizontal span[data-prdvalue],
.event-benefit-template .c-product__list--horizontal span[data-home-style-product],
.event-benefit-template .c-product__list--horizontal .c-product__ranking-linker {
    display: flex;
    column-gap: calc(12 * var(--ratio));
}

.event-benefit-template .c-product__list--horizontal span[data-prdvalue] > a,
.event-benefit-template .c-product__list--horizontal span[data-home-style-product] > a {
    flex-basis: calc(120 * var(--ratio));
}

.event-benefit-template .c-product__list--horizontal .c-product__visual {
    flex-basis: calc(120 * var(--ratio));
    align-self: start;
    padding: calc(10 * var(--ratio));
}

.event-benefit-template .c-product__list--horizontal .c-product__info-container {
    flex-basis: calc(218 * var(--ratio));
}

.event-benefit-template .c-product__list--horizontal .c-product__actions {
    order: initial;
    margin-top: calc(10 * var(--ratio));
}

.event-benefit-template .c-product__list--horizontal .c-product__info {
    margin-top: 0;
}

.event-benefit-template .c-product__list--horizontal .c-product__badge-container {
    margin-top: calc(10 * var(--ratio));
}

.event-benefit-template .c-product__list--horizontal .c-product__care-service {
    margin-top: calc(10 * var(--ratio));
}
/* // 가로형 */

/* home style */
.event-benefit-template .c-product--home-style .c-product__model-id {
    display: none;
}

.event-benefit-template [class*="c-product--home-style"] .c-product__visual {
    padding: 0;
}

.event-benefit-template [class*="c-product--home-style"] a {
    outline-offset: 0px;
}
/* // home style */

/* ========================= */
/* // Product API */
/* ========================= */


/* ================================ */
/* tooltip */
/* ================================ */
.c-tooltip {
    .tooltip-wrap {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: clamp(20px, calc(20 * var(--ratio)), 40px);
        height: clamp(20px, calc(20 * var(--ratio)), 40px);
        line-height: 1;
    }
    .tooltip-box {
        left: calc(-166 * var(--ratio));
        min-width: max(280px, calc(280 * var(--ratio)));
        padding: calc(20 * var(--ratio)) calc(48 * var(--ratio)) calc(20 * var(--ratio)) calc(20 * var(--ratio));
        border-radius: calc(16 * var(--ratio));
        background-color: var(--lge-gray-g00);
        box-shadow: 0 0 1px 0 rgba(33, 39, 49, 0.08), 0 calc(12 * var(--ratio)) calc(64 * var(--ratio)) 0 rgba(33, 39, 49, 0.09);

        &.dark-mode {
            background-color: var(--lge-gray-g70);
        }
    }
    .ui_tooltip-target {
        background: url(/kr/event/promotions/images/icon_tooltip_notice_gray.svg) no-repeat;
        background-size: contain;
        width: calc(16 * var(--ratio));
        height: calc(16 * var(--ratio));
    }
    .c-tooltip__title {
        color: #111;
        font-size: calc(15 * var(--ratio));
        font-weight: 600;
        line-height: 133.333%;
        letter-spacing: calc(-0.2 * var(--ratio));

        .dark-mode & {
            color: var(--lge-gray-g00);
        }
    }
    .c-tooltip__line {
        width: 100%;
        height: 1px;
        margin: calc(16 * var(--ratio)) 0;
        background-image: linear-gradient(to right, #777 50%, rgba(255, 255, 255, 0) 0%);
        background-position: center;
        background-size: 4px 2px;
        background-repeat: repeat-x;
        border: none;

        .dark-mode & {
            background-image: linear-gradient(to right, #444 50%, rgba(255, 255, 255, 0) 0%);
        }
    }
    .btn-close {
        top: calc(20 * var(--ratio));
        right: calc(18 * var(--ratio));
        width: max(20px, calc(20 * var(--ratio)));
        height: max(20px, calc(20 * var(--ratio)));
        &::after {
            display: flex;
            align-items: center;
            justify-content: center;
            width: max(20px, calc(20 * var(--ratio)));
            height: max(20px, calc(20 * var(--ratio)));
            background: url(/kr/event/promotions/images/icon_tooltip_close_btn_dark_black.svg) no-repeat;
            background-size: contain;
        }

        .dark-mode & {
            &::after {
                background: url(/kr/event/promotions/images/icon_tooltip_close_btn_white.svg) no-repeat;
                background-size: contain;
            }
        }
    }
}
/* ================================ */
/* // tooltip */
/* ================================ */

/* ========================= */
/* 아이템 더보기 기능 */
/* ========================= */
.view-more-content {
    .c-product__list {
        row-gap: 0;
    }
    .c-product__item {
        visibility: hidden;
        max-height: 0;
        margin-bottom: 0;
        /* overflow: hidden; */ /* gt.yang 26.01.29 : 웹 접근성 초점 표시 안되는 현상으로 제거 */
        opacity: 0;
    }
    
    .limit-view__item {
        visibility: hidden;
        max-height: 0;
        opacity: 0;
    }
    
    .c-product__item.is-visible {
        visibility: visible;
        max-height: 2000px;
        margin-bottom: calc(20 * var(--ratio));
        opacity: 1;
    }
    
    .limit-view__item.is-visible {
        visibility: visible;
        max-height: 2000px;
        opacity: 1;
    }
    
    .c-product__item[style*="--item-delay"],
    .limit-view__item[style*="--item-delay"] {
        transition-delay: var(--item-delay, 0s);
    }
    
    .l-button-group:has( .limit-view__button.is-hidden ) {
        display: none;
    }
}
/* ========================= */
/* // 아이템 더보기 기능 */
/* ========================= */


/* ========================= */
/* toggle */
/* ========================= */

/* 왼쪽 아이콘 있는 형태 */
.event-benefit-template .c-toggle__btn--icon-info-white {
    padding-left: calc(24 * var(--ratio));
}
.event-benefit-template .c-toggle__btn--icon-info-white::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    width: calc(20 * var(--ratio));
    height: calc(20 * var(--ratio));
    background: url(/kr/event/promotions/images/icon-info-white.svg) no-repeat;
    background-size: contain;
    transform: translateY(-50%);
}
/* // 왼쪽 아이콘 있는 형태 */


/* 트리거 버튼 유지되는 이미지 형태 토글 */
.c-toggle--img-only {
    margin: 0;
    .c-toggle__content{
        overflow: hidden;
        display: block;
        height: calc(var(--close-height) * var(--ratio));
    }
    &.on .c-toggle__content{
        height: auto;
        margin: 0;
        padding: 0;
    }
    .c-toggle__picture{
        display: block;
    }
}
/* // 트리거 버튼 유지되는 이미지 형태 토글 */


/* ========================= */
/* // toggle */
/* ========================= */


/* ========================= */
/* 커스텀 toggle */
/* ========================= */
.c-custom-accordion {
    position: relative;
}
.c-custom-accordion__area--fade {
    position: relative;
    overflow: hidden;
}
.c-custom-accordion__area--fade::after {
    content: '';
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.c-custom-accordion__area--none {
    display: none;
}
.c-custom-accordion__btn-wrap {
    width: 100%;
    z-index: 3;
    text-align: center;
}
.c-custom-accordion__btn-wrap--hidden {
    display: none;
}
.c-custom-accordion__btn-wrap.on .c-button--text-arrow-down .c-button__label::after {
    transform: translateY(-50%) rotate(0deg);
}
.c-custom-accordion__area--active {
    display: block;
    height: auto !important;
}
.c-custom-accordion__area--active::after {
    display: none;
}
.c-custom-accordion[data-accordion-toggle="true"] .c-button--text-arrow-down .c-button__label[aria-expanded="true"]::after {
    transform: translateY(-50%) rotate(0deg);
}

/* 토글 */
[data-accordion-toggle="true"] {

    &:has([data-tab-sticky="2depth"]) {
        [data-expand-scroll-dest],
        [data-expand-scroll-target] {
            scroll-margin-top: calc(var(--header-height) + var(--sticky-main-switch-height) + var(--sticky-main-sticky-height) + var(--sticky-2depth-height));
        }
    }

    .c-tab__content {
        display: flex;
        flex-direction: column;

        .c-custom-accordion__area--none {
            display: none;
        }
        .c-custom-accordion__area--active {
            display: flex;
        }
    }

    .l-article__content .c-custom-accordion__btn-wrap {
        position: absolute;
        left: 0;
        bottom: 0;
        margin-top: 0;
    }

    .c-custom-accordion__btn-wrap:has([aria-expanded="true"]) {
        position: relative;
        margin-top: var(--spacing-standard-flow);
    }

    .c-custom-accordion__btn-wrap--hidden {
        display: block;
    }

    .c-custom-accordion__txt-close {
        display: none;
    }

    [aria-expanded="true"] .c-custom-accordion__txt-open {
        display: none;
    }

    [aria-expanded="true"] .c-custom-accordion__txt-close {
        display: block;
    }

    [data-expand-scroll-dest],
    [data-expand-scroll-target] {
        scroll-margin-top: calc(var(--header-height) + var(--sticky-main-switch-height) + var(--sticky-main-sticky-height));
    }

    [aria-expanded="true"] [class*="c-button__icon--arrow-down"] {
        transform: rotate(180deg);
    }
}
/* // 토글 */

/* ========================= */
/* // 커스텀 toggle */
/* ========================= */

/* ========================= */
/* img-accordion */
/* ========================= */
.event-benefit-template .l-img-accordion-manager {
    display: flex;
    flex-direction: column;
    row-gap: calc(8 * var(--ratio));
    margin: 0 calc(20 * var(--ratio));
}
.event-benefit-template .c-img-accordion {
    position: relative;
}

.event-benefit-template .c-img-accordion__close-area {
    position: relative;
}
.event-benefit-template .c-img-accordion__open-area {
    display: none;
    position: relative;
}
.event-benefit-template .c-img-accordion__trigger-btn {
    position: absolute;
    z-index: 1;
    top: 4px;
    left: 4px;
    width: calc(100% - 8px);
    height: calc(100% - 8px);
    outline-offset: 2px;
}

.event-benefit-template .c-img-accordion--open .c-img-accordion__open-area {
    display: block;
}
.event-benefit-template .c-img-accordion--open .c-img-accordion__close-area {
    display: none;
}
/* ========================= */
/* // img-accordion */
/* ========================= */

/* ========================= */
/* responsive video (PC/MO 영상 구분하여 처리하기 위함) */
/* ========================= */
.c-responsive-video {
    --img-ratio: var(--img-ratio-mo, 16 / 9);
    --poster-image: var(--poster-mo, none);
    position: relative;
    width: 100%;
    max-width: 100%;
    height: calc(var(--full-video-height-mo) * var(--ratio));
    aspect-ratio: var(--img-ratio);
    background-image: var(--poster-image);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.c-responsive-video__controls {
    position: absolute;
    left: 5%;
    top: 2.5%;
}

.c-responsive-video__element {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    transition: opacity 0.2s ease-out;
    will-change: opacity;
}

.c-responsive-video.is-loaded .c-responsive-video__element {
    opacity: 1;
}
/* ========================= */
/* // responsive video (PC/MO 영상 구분하여 처리) */
/* ========================= */


/* ========================= */
/* LG.COM 단독 구매 혜택 (전체 공통) */
/* ========================= */
.lg-only-purchase-benefits {
    display: block;
    position: relative;
    .lg-only-purchase-benefits__linker {
        position: absolute;
    }
    .lg-only-purchase-benefits__linker-01 {
        width: 14.1%;
        height: 6%;
        bottom: 68%;
        left: 35.4%;
    }
    .lg-only-purchase-benefits__linker-02 {
        width: 21%;
        height: 6%;
        bottom: 68%;
        left: 49.2%;
    }
    .lg-only-purchase-benefits__linker-04 {
        width: 18%;
        height: 6%;
        bottom: 48%;
        left: 34.2%;
    }
    .lg-only-purchase-benefits__linker-05 {
        width: 19%;
        height: 6%;
        bottom: 30%;
        left: 34.2%;
    }

}
/* ========================= */
/* // LG.COM 단독 구매 혜택 (전체 공통) */
/* ========================= */

/* ========================= */
/* 카카오톡 친구 전용 특별 할인 쿠폰 혜택 (전체 공통) */
/* ========================= */
.kakao-friend-coupon {
    position: relative;
    .c-title {
        text-align: center;
    }
    .kakao-friend-coupon__linker {
        position: absolute;
    }
    .kakao-friend-coupon__linker-01 {
        width: 46.1%;
        height: 29%;
        bottom: 15%;
        left: 4%;
    }
    .kakao-friend-coupon__linker-02 {
        width: 46.1%;
        height: 29%;
        bottom: 15%;
        left: 51%;
    }
}
/* ========================= */
/* // 카카오톡 친구 전용 특별 할인 쿠폰 혜택 (전체 공통) */
/* ========================= */


/* ========================= */
/* 구독 기본 혜택 (전체 공통 영역) */
/* ========================= */
subscription-basic-benefits {
    .c-title--normal {
        margin-bottom: calc(4 * var(--ratio));
    }
}

.nested-accordion {
    --color-black-bg-01: #282726;
    --color-black-text-01: var(--lge-gray-g00);
    --color-black-bg-02: #4F4E4A;
    --color-black-text-02: var(--lge-gray-g00);
    --color-black-bg-03: #77756E;
    --color-black-text-03: var(--lge-gray-g00);
    --color-black-bg-04: #A8A79D;
    --color-black-text-04: #111;
    --color-black-bg-05: #BBBBB3;
    --color-black-text-05: #111;
    --radius: calc(16 * var(--ratio));
    --font-weight-bold: 600;
    --transition-speed: 0.4s;
    --stack-offset: calc(-16 * var(--ratio)); /* 카드 겹침 정도 */
    --card-height: calc(58 * var(--ratio)); /* 헤더 고정 높이 */
    list-style: none;
    width: calc(350 * var(--ratio));
    display: flex;
    flex-direction: column;
    isolation: isolate;
    margin: 0 auto;
    padding: 0 calc(20 * var(--ratio));

    .dark-mode & {
        --color-black-bg-01: #2C2C2C;
        --color-black-bg-02: #4F4F4F;
        --color-black-bg-03: #797979;
        --color-black-bg-04: #ACACAC;
        --color-black-bg-05: #C8C8C8;
    }
    
    .l-article__inner--mo-gutter & {
        padding: 0;
    }

    .nested-accordion__item {
        position: relative;
        background: var(--item-bg);
        color: var(--item-text);
        border-top-left-radius: var(--radius);
        border-top-right-radius: var(--radius);
        margin-top: var(--stack-offset);
        z-index: 1; 
        transition: transform 0.3s ease, margin 0.3s ease;
        transform-origin: center top;
    }
    
    .nested-accordion__item:first-child {
        margin-top: 0;
    }
    
    .nested-accordion__item:last-child {
        border-bottom-left-radius: var(--radius);
        border-bottom-right-radius: var(--radius);
    }
    
    .nested-accordion__item:last-child .nested-accordion__trigger{
        height: auto;
    }
    
    .nested-accordion__item:last-child .nested-accordion__divider{
        top: 0;
    }
    
    .nested-accordion__item:last-child .nested-accordion__inner-content{
        padding-top: calc(16 * var(--ratio));
        padding-bottom: calc(16 * var(--ratio));
    }
    
    .nested-accordion__item[data-theme="black-bg-01"] { --item-bg: var(--color-black-bg-01); --item-text: var(--color-black-text-01); }
    .nested-accordion__item[data-theme="black-bg-02"] { --item-bg: var(--color-black-bg-02); --item-text: var(--color-black-text-02); }
    .nested-accordion__item[data-theme="black-bg-03"] { --item-bg: var(--color-black-bg-03); --item-text: var(--color-black-text-03); }
    .nested-accordion__item[data-theme="black-bg-04"] { --item-bg: var(--color-black-bg-04); --item-text: var(--color-black-text-04); }
    .nested-accordion__item[data-theme="black-bg-05"] { --item-bg: var(--color-black-bg-05); --item-text: var(--color-black-text-05); }
    
    .nested-accordion__header { 
        margin: 0; 
    }
    
    .nested-accordion__trigger {
        width: 100%;
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        padding: calc(8 * var(--ratio));
        height: var(--card-height);
        background: none;
        border: none;
        cursor: pointer;
        color: inherit;
        font-size: calc(12 * var(--ratio));
        font-weight: 400;
        text-align: left;
        -webkit-tap-highlight-color: transparent;
    }
    .nested-accordion__header:has([aria-expanded="false"]) .nested-accordion__divider{
        display: none;
    }
    
    .nested-accordion__title-wrap {
        display: flex;
        align-items: center;
        gap: calc(8 * var(--ratio));
        padding-right: calc(8 * var(--ratio));
        flex: 1;
    }
    
    .nested-accordion__icon {
        display: flex;
        align-items: center;
        justify-content: center;
        width: calc(32 * var(--ratio));
        height: calc(32 * var(--ratio));
        flex-shrink: 0;
    }
    
    .nested-accordion__icon--first img {
        width: 100%;
    }

    .nested-accordion__icon svg {
        fill: currentColor;
    }
    
    .nested-accordion__text { 
        font-size: calc(14 * var(--ratio));
        font-weight: var(--font-weight-bold);
        line-height: 114.286%;
        letter-spacing: calc(-0.28 * var(--ratio));
        word-break: keep-all;
        overflow: hidden;
    }
    
    .nested-accordion__text--highlight { 
        font-weight: var(--font-weight-bold);
    }
    
    .nested-accordion__icon-chevron {
        transform: rotate(0deg);
        transition: transform var(--transition-speed) ease;
    }

    .nested-accordion__icon-chevron img {
        width: calc(12 * var(--ratio));
        height: calc(12 * var(--ratio));
    }
    
    .nested-accordion__item--active .nested-accordion__icon-chevron {
        transform: rotate(180deg); 
    }
    
    .nested-accordion__panel {
        display: grid;
        grid-template-rows: 0fr;
        transition: grid-template-rows var(--transition-speed) cubic-bezier(0.25, 0.8, 0.25, 1);
    }
    
    .nested-accordion__item--active .nested-accordion__panel {
        grid-template-rows: 1fr;
    }
    
    .nested-accordion__content {
        overflow: hidden;
    }
    
    .nested-accordion__inner-content {
        padding: calc(8 * var(--ratio)) calc(16 * var(--ratio)) calc(32 * var(--ratio));
        font-size: calc(12 * var(--ratio));
        font-weight: 400;
        line-height: 133.333%;
        letter-spacing: calc(-0.24 * var(--ratio));

        .c-list {
            margin-top: calc(3 * var(--ratio));
        }
        .c-list__item {
            color: var(--lge-gray-g00);
            font-size: calc(14 * var(--ratio));
            line-height: 142.857%;
            letter-spacing: calc(-0.28em/14);
        }
        .c-list__item::before {
            background-color: var(--lge-gray-g00);
        }
    }
    
    .nested-accordion__divider {
        position: relative;
        top: calc(-10 * var(--ratio));
        left: 50%;
        transform: translateX(-50%);
        width: calc(100% - calc(32 * var(--ratio)));
        height: 1px;
        margin-bottom: 0;
        background-image: linear-gradient(to right, var(--lge-gray-g00) 50%, rgba(255, 255, 255, 0) 0%);
        background-position: center;
        background-size: calc(8 * var(--ratio)) calc(2 * var(--ratio));
        background-repeat: repeat-x;
        opacity: 0.7;
        border: none;
    }
    
    .nested-accordion__item[data-theme="black-bg-04"] .nested-accordion__divider,
    .nested-accordion__item[data-theme="black-bg-05"] .nested-accordion__divider {
        background-image: linear-gradient(to right, #000 50%, rgba(255, 255, 255, 0) 0%);
    }
    
    .nested-accordion__desc-title {
        display: block;
        font-weight: var(--font-weight-bold);
        margin-bottom: calc(2 * var(--ratio));
        margin-top: calc(8 * var(--ratio));
        font-size: calc(12 * var(--ratio));
        line-height: 133.333%;
        letter-spacing: -0.24px;
    }
    
    .nested-accordion__desc-title:first-child { 
        margin-top: 0; 
    }
    
    .nested-accordion__desc-text {
        display: block;
        word-break: keep-all;
        font-size: calc(14 * var(--ratio));
        font-weight: 400;
        line-height: 142.857%;
        letter-spacing: calc(-0.28 * var(--ratio));
    }
}
/* ========================= */
/* // 구독 기본 혜택 (전체 공통 영역) */
/* ========================= */


/* ========================= */
/* 가전 구독이 좋은 이유 (구독 기획전 공통 영역) */
/* ========================= */
why-home-appliance-subscription-is-goood {
    .l-article__inner:has(&) {
        background-color: var(--lge-gray-g10);
    }
    .c-title {
        color: var(--color-black-text-05);
    }
}
/* ========================= */
/* // 가전 구독이 좋은 이유 (구독 기획전 공통 영역) */
/* ========================= */


/* ============================================= */
/* 구독이 좋은 이유 추가 2번 타입 (전체 공통 영역) */
/* =============================================*/
.nested-accordion_type02 {
    .nested-accordion__item {
        border-top: 1px solid #777;
        border-radius: 0;

        &:last-child {
            border-bottom: 1px solid #777;
            margin: 0;
            border-radius: 0;
        }
    }

    .nested-accordion__trigger {
        height: auto !important;
        padding: calc(14 * var(--ratio)) 0px;
    }

    .nested-accordion__icon {
        width: calc(30 * var(--ratio));
        height: calc(30 * var(--ratio));
    }

    .nested-accordion__desc-title {
        font-size: calc(14 * var(--ratio));
        color: #111;
        margin-bottom: calc(8 * var(--ratio));
        line-height: 1.4;
    }

    .nested-accordion__desc-text {
        font-size: calc(13 * var(--ratio));
        color: #444;
        line-height: 1.4;
    }

    .nested-accordion__inner-content {
        padding: calc(16 * var(--ratio));
        border-radius: calc(6 * var(--ratio));
        background-color: #f3f5f7;
        margin-bottom: calc(20 * var(--ratio));
    }
}
/* ============================================= */
/* // 구독이 좋은 이유 추가 2번 타입 (전체 공통 영역) */
/* =============================================*/


/* ========================= */
/* 멤버십 포인트로 월 요금 납부하기 방법 (구독 기획전 공통 영역) */
/* ========================= */
pay-monthly-bill-with-membership-points {
    background-color: var(--primary-black);
    .c-title {
        color: var(--lge-gray-g00);
    }
    .c-button__inner {
        text-align: center;
    }
}
/* ========================= */
/* // 멤버십 포인트로 월 요금 납부하기 방법 (구독 기획전 공통 영역) */
/* ========================= */


/* ========================= */
/* 공통 유틸리티 */
/* ========================= */
.event-benefit-template .relative-area {
    position: relative;
}
.event-benefit-template .hidden-all {
    display: none !important;
}

@media screen and (min-width: 768px) {
    .event-benefit-template .hidden-pc {
        display: none !important;
    }
}

@media screen and (max-width: 767px) {
    .event-benefit-template .hidden-mo {
        display: none !important;
    }
}


/* horizen-scroll-bar */
@media screen and (min-width: 768px) {
    .c-custom-scrollbar.c-custom-scrollbar {
        padding-bottom: 2px;
        -webkit-overflow-scrolling: touch; /* iOS에서 부드러운 스크롤 */
    }

    .c-custom-scrollbar::-webkit-scrollbar {
        width: 6px;
        height: 6px;
    }

    .c-custom-scrollbar {
        &::-webkit-scrollbar-thumb{ 
            background-color: rgba(0, 0, 0, 0.2);
            border-radius: 6px;
        }
        .dark-mode &::-webkit-scrollbar-thumb {
            background-color: rgba(255, 255, 255, 0.4); 
        }
    }

    .c-custom-scrollbar{
        &::-webkit-scrollbar-thumb:hover {
            background-color: rgba(0, 0, 0, 0.4);
        }
        .dark-mode &::-webkit-scrollbar-thumb:hover {
            background-color: rgba(255, 255, 255, 0.6);
        }
    }

    .c-custom-scrollbar{
        &::-webkit-scrollbar-track {
            background: rgba(0, 0, 0, 0.1);
            border-radius: 6px;

        }   
        .dark-mode &::-webkit-scrollbar-track {
            background: rgba(255, 255, 255, 0.3);
        }
    }
}
/* // horizen-scroll-bar */

/* Font Color 공통 */
.c-font--primary-active-red{ color:var(--primary-active-red); }
/* // Font Color 공통 */

/* Font Size 공통 (gt.yang 260324 : 확정되지 않아 예전 Foundation 기준으로 맞춤) */
.u-font {
    --lge-ls: -0.02em;
    --lge-lh-default: 1.4;
    --lge-lh-tight: 1.2;

    letter-spacing: var(--lge-ls);
    line-height: var(--lge-lh-default);
    word-break: keep-all;

    &.u-font--title-big {
        font-size: calc(26 * var(--ratio));
        font-weight: 700;
    }

    &.u-font--title-medium {
        font-size: calc(22 * var(--ratio));
        font-weight: 700;
    }

    &.u-font--title-small {
        font-size: calc(18 * var(--ratio));
        font-weight: 700;
    }

    &.u-font--body-big {
        font-size: calc(16 * var(--ratio));
        font-weight: 500;
    }

    &.u-font--body-medium {
        font-size: calc(14 * var(--ratio));
        font-weight: 600;
        line-height: var(--lge-lh-tight);
    }

    &.u-font--body-small {
        font-size: calc(14 * var(--ratio));
        font-weight: 400;
        line-height: var(--lge-lh-tight);
    }

    &.u-font--caption-big {
        font-size: calc(12 * var(--ratio));
        font-weight: 500;
    }

    &.u-font--caption-medium {
        font-size: calc(11 * var(--ratio));
        font-weight: 400;
    }
}
/* // Font Size 공통 */

/* 공통 여백 */
.event-benefit-template .margin-t--m00, .event-benefit-template .l-article__inner .margin-t--m00 {margin-top: var(--calc-size--00);}
.event-benefit-template .margin-t--m04, .event-benefit-template .l-article__inner .margin-t--m04 {margin-top: var(--calc-size--04);}
.event-benefit-template .margin-t--m05, .event-benefit-template .l-article__inner .margin-t--m05 {margin-top: var(--calc-size--05);}
.event-benefit-template .margin-t--m06, .event-benefit-template .l-article__inner .margin-t--m06 {margin-top: var(--calc-size--06);}
.event-benefit-template .margin-t--m08, .event-benefit-template .l-article__inner .margin-t--m08 {margin-top: var(--calc-size--08);}
.event-benefit-template .margin-t--m10, .event-benefit-template .l-article__inner .margin-t--m10 {margin-top: var(--calc-size--10);}
.event-benefit-template .margin-t--m12, .event-benefit-template .l-article__inner .margin-t--m12 {margin-top: var(--calc-size--12);}
.event-benefit-template .margin-t--m15, .event-benefit-template .l-article__inner .margin-t--m15 {margin-top: var(--calc-size--15);}
.event-benefit-template .margin-t--m16, .event-benefit-template .l-article__inner .margin-t--m16 {margin-top: var(--calc-size--16);}
.event-benefit-template .margin-t--m18, .event-benefit-template .l-article__inner .margin-t--m18 {margin-top: var(--calc-size--18);}
.event-benefit-template .margin-t--m20, .event-benefit-template .l-article__inner .margin-t--m20 {margin-top: var(--calc-size--20);}
.event-benefit-template .margin-t--m22, .event-benefit-template .l-article__inner .margin-t--m22 {margin-top: var(--calc-size--22);}
.event-benefit-template .margin-t--m24, .event-benefit-template .l-article__inner .margin-t--m24 {margin-top: var(--calc-size--24);}
.event-benefit-template .margin-t--m25, .event-benefit-template .l-article__inner .margin-t--m25 {margin-top: var(--calc-size--25);}
.event-benefit-template .margin-t--m26, .event-benefit-template .l-article__inner .margin-t--m26 {margin-top: var(--calc-size--26);}
.event-benefit-template .margin-t--m28, .event-benefit-template .l-article__inner .margin-t--m28 {margin-top: var(--calc-size--28);}
.event-benefit-template .margin-t--m30, .event-benefit-template .l-article__inner .margin-t--m30 {margin-top: var(--calc-size--30);}
.event-benefit-template .margin-t--m32, .event-benefit-template .l-article__inner .margin-t--m32 {margin-top: var(--calc-size--32);}
.event-benefit-template .margin-t--m34, .event-benefit-template .l-article__inner .margin-t--m34 {margin-top: var(--calc-size--34);}
.event-benefit-template .margin-t--m35, .event-benefit-template .l-article__inner .margin-t--m35 {margin-top: var(--calc-size--35);}
.event-benefit-template .margin-t--m36, .event-benefit-template .l-article__inner .margin-t--m36 {margin-top: var(--calc-size--36);}
.event-benefit-template .margin-t--m38, .event-benefit-template .l-article__inner .margin-t--m38 {margin-top: var(--calc-size--38);}
.event-benefit-template .margin-t--m40, .event-benefit-template .l-article__inner .margin-t--m40 {margin-top: var(--calc-size--40);}
.event-benefit-template .margin-t--m45, .event-benefit-template .l-article__inner .margin-t--m45 {margin-top: var(--calc-size--45);}
.event-benefit-template .margin-t--m50, .event-benefit-template .l-article__inner .margin-t--m50 {margin-top: var(--calc-size--50);}
.event-benefit-template .margin-t--m52, .event-benefit-template .l-article__inner .margin-t--m52 {margin-top: var(--calc-size--52);}
.event-benefit-template .margin-t--m54, .event-benefit-template .l-article__inner .margin-t--m54 {margin-top: var(--calc-size--54);}
.event-benefit-template .margin-t--m56, .event-benefit-template .l-article__inner .margin-t--m56 {margin-top: var(--calc-size--56);}
.event-benefit-template .margin-t--m58, .event-benefit-template .l-article__inner .margin-t--m58 {margin-top: var(--calc-size--58);}
.event-benefit-template .margin-t--m60, .event-benefit-template .l-article__inner .margin-t--m60 {margin-top: var(--calc-size--60);}
.event-benefit-template .margin-t--m62, .event-benefit-template .l-article__inner .margin-t--m62 {margin-top: var(--calc-size--62);}
.event-benefit-template .margin-t--m64, .event-benefit-template .l-article__inner .margin-t--m64 {margin-top: var(--calc-size--64);}
.event-benefit-template .margin-t--m66, .event-benefit-template .l-article__inner .margin-t--m66 {margin-top: var(--calc-size--66);}
.event-benefit-template .margin-t--m68, .event-benefit-template .l-article__inner .margin-t--m68 {margin-top: var(--calc-size--68);}
.event-benefit-template .margin-t--m70, .event-benefit-template .l-article__inner .margin-t--m70 {margin-top: var(--calc-size--70);}
.event-benefit-template .margin-t--m72, .event-benefit-template .l-article__inner .margin-t--m72 {margin-top: var(--calc-size--72);}
.event-benefit-template .margin-t--m74, .event-benefit-template .l-article__inner .margin-t--m74 {margin-top: var(--calc-size--74);}
.event-benefit-template .margin-t--m76, .event-benefit-template .l-article__inner .margin-t--m76 {margin-top: var(--calc-size--76);}
.event-benefit-template .margin-t--m78, .event-benefit-template .l-article__inner .margin-t--m78 {margin-top: var(--calc-size--78);}
.event-benefit-template .margin-t--m80, .event-benefit-template .l-article__inner .margin-t--m80 {margin-top: var(--calc-size--80);}

.event-benefit-template .margin-b--m00, .event-benefit-template .l-article__inner .margin-b--m00 {margin-bottom: var(--calc-size--00);}
.event-benefit-template .margin-b--m04, .event-benefit-template .l-article__inner .margin-b--m04 {margin-bottom: var(--calc-size--04);}
.event-benefit-template .margin-b--m05, .event-benefit-template .l-article__inner .margin-b--m05 {margin-bottom: var(--calc-size--05);}
.event-benefit-template .margin-b--m06, .event-benefit-template .l-article__inner .margin-b--m06 {margin-bottom: var(--calc-size--06);}
.event-benefit-template .margin-b--m08, .event-benefit-template .l-article__inner .margin-b--m08 {margin-bottom: var(--calc-size--08);}
.event-benefit-template .margin-b--m10, .event-benefit-template .l-article__inner .margin-b--m10 {margin-bottom: var(--calc-size--10);}
.event-benefit-template .margin-b--m12, .event-benefit-template .l-article__inner .margin-b--m12 {margin-bottom: var(--calc-size--12);}
.event-benefit-template .margin-b--m15, .event-benefit-template .l-article__inner .margin-b--m15 {margin-bottom: var(--calc-size--15);}
.event-benefit-template .margin-b--m16, .event-benefit-template .l-article__inner .margin-b--m16 {margin-bottom: var(--calc-size--16);}
.event-benefit-template .margin-b--m18, .event-benefit-template .l-article__inner .margin-b--m18 {margin-bottom: var(--calc-size--18);}
.event-benefit-template .margin-b--m20, .event-benefit-template .l-article__inner .margin-b--m20 {margin-bottom: var(--calc-size--20);}
.event-benefit-template .margin-b--m22, .event-benefit-template .l-article__inner .margin-b--m22 {margin-bottom: var(--calc-size--22);}
.event-benefit-template .margin-b--m24, .event-benefit-template .l-article__inner .margin-b--m24 {margin-bottom: var(--calc-size--24);}
.event-benefit-template .margin-b--m25, .event-benefit-template .l-article__inner .margin-b--m25 {margin-bottom: var(--calc-size--25);}
.event-benefit-template .margin-b--m26, .event-benefit-template .l-article__inner .margin-b--m26 {margin-bottom: var(--calc-size--26);}
.event-benefit-template .margin-b--m28, .event-benefit-template .l-article__inner .margin-b--m28 {margin-bottom: var(--calc-size--28);}
.event-benefit-template .margin-b--m30, .event-benefit-template .l-article__inner .margin-b--m30 {margin-bottom: var(--calc-size--30);}
.event-benefit-template .margin-b--m32, .event-benefit-template .l-article__inner .margin-b--m32 {margin-bottom: var(--calc-size--32);}
.event-benefit-template .margin-b--m34, .event-benefit-template .l-article__inner .margin-b--m34 {margin-bottom: var(--calc-size--34);}
.event-benefit-template .margin-b--m35, .event-benefit-template .l-article__inner .margin-b--m35 {margin-bottom: var(--calc-size--35);}
.event-benefit-template .margin-b--m36, .event-benefit-template .l-article__inner .margin-b--m36 {margin-bottom: var(--calc-size--36);}
.event-benefit-template .margin-b--m38, .event-benefit-template .l-article__inner .margin-b--m38 {margin-bottom: var(--calc-size--38);}
.event-benefit-template .margin-b--m40, .event-benefit-template .l-article__inner .margin-b--m40 {margin-bottom: var(--calc-size--40);}
.event-benefit-template .margin-b--m45, .event-benefit-template .l-article__inner .margin-b--m45 {margin-bottom: var(--calc-size--45);}
.event-benefit-template .margin-b--m50, .event-benefit-template .l-article__inner .margin-b--m50 {margin-bottom: var(--calc-size--50);}
.event-benefit-template .margin-b--m52, .event-benefit-template .l-article__inner .margin-b--m52 {margin-bottom: var(--calc-size--52);}
.event-benefit-template .margin-b--m54, .event-benefit-template .l-article__inner .margin-b--m54 {margin-bottom: var(--calc-size--54);}
.event-benefit-template .margin-b--m56, .event-benefit-template .l-article__inner .margin-b--m56 {margin-bottom: var(--calc-size--56);}
.event-benefit-template .margin-b--m58, .event-benefit-template .l-article__inner .margin-b--m58 {margin-bottom: var(--calc-size--58);}
.event-benefit-template .margin-b--m60, .event-benefit-template .l-article__inner .margin-b--m60 {margin-bottom: var(--calc-size--60);}
.event-benefit-template .margin-b--m62, .event-benefit-template .l-article__inner .margin-b--m62 {margin-bottom: var(--calc-size--62);}
.event-benefit-template .margin-b--m64, .event-benefit-template .l-article__inner .margin-b--m64 {margin-bottom: var(--calc-size--64);}
.event-benefit-template .margin-b--m66, .event-benefit-template .l-article__inner .margin-b--m66 {margin-bottom: var(--calc-size--66);}
.event-benefit-template .margin-b--m68, .event-benefit-template .l-article__inner .margin-b--m68 {margin-bottom: var(--calc-size--68);}
.event-benefit-template .margin-b--m70, .event-benefit-template .l-article__inner .margin-b--m70 {margin-bottom: var(--calc-size--70);}
.event-benefit-template .margin-b--m72, .event-benefit-template .l-article__inner .margin-b--m72 {margin-bottom: var(--calc-size--72);}
.event-benefit-template .margin-b--m74, .event-benefit-template .l-article__inner .margin-b--m74 {margin-bottom: var(--calc-size--74);}
.event-benefit-template .margin-b--m76, .event-benefit-template .l-article__inner .margin-b--m76 {margin-bottom: var(--calc-size--76);}
.event-benefit-template .margin-b--m78, .event-benefit-template .l-article__inner .margin-b--m78 {margin-bottom: var(--calc-size--78);}
.event-benefit-template .margin-b--m80, .event-benefit-template .l-article__inner .margin-b--m80 {margin-bottom: var(--calc-size--80);}

.event-benefit-template .margin-l--m00, .event-benefit-template .l-article__inner .margin-l--m00 {margin-left: var(--calc-size--00);}
.event-benefit-template .margin-l--m04, .event-benefit-template .l-article__inner .margin-l--m04 {margin-left: var(--calc-size--04);}
.event-benefit-template .margin-l--m05, .event-benefit-template .l-article__inner .margin-l--m05 {margin-left: var(--calc-size--05);}
.event-benefit-template .margin-l--m06, .event-benefit-template .l-article__inner .margin-l--m06 {margin-left: var(--calc-size--06);}
.event-benefit-template .margin-l--m08, .event-benefit-template .l-article__inner .margin-l--m08 {margin-left: var(--calc-size--08);}
.event-benefit-template .margin-l--m10, .event-benefit-template .l-article__inner .margin-l--m10 {margin-left: var(--calc-size--10);}
.event-benefit-template .margin-l--m12, .event-benefit-template .l-article__inner .margin-l--m12 {margin-left: var(--calc-size--12);}
.event-benefit-template .margin-l--m15, .event-benefit-template .l-article__inner .margin-l--m15 {margin-left: var(--calc-size--15);}
.event-benefit-template .margin-l--m16, .event-benefit-template .l-article__inner .margin-l--m16 {margin-left: var(--calc-size--16);}
.event-benefit-template .margin-l--m18, .event-benefit-template .l-article__inner .margin-l--m18 {margin-left: var(--calc-size--18);}
.event-benefit-template .margin-l--m20, .event-benefit-template .l-article__inner .margin-l--m20 {margin-left: var(--calc-size--20);}
.event-benefit-template .margin-l--m22, .event-benefit-template .l-article__inner .margin-l--m22 {margin-left: var(--calc-size--22);}
.event-benefit-template .margin-l--m24, .event-benefit-template .l-article__inner .margin-l--m24 {margin-left: var(--calc-size--24);}
.event-benefit-template .margin-l--m25, .event-benefit-template .l-article__inner .margin-l--m25 {margin-left: var(--calc-size--25);}
.event-benefit-template .margin-l--m26, .event-benefit-template .l-article__inner .margin-l--m26 {margin-left: var(--calc-size--26);}
.event-benefit-template .margin-l--m28, .event-benefit-template .l-article__inner .margin-l--m28 {margin-left: var(--calc-size--28);}
.event-benefit-template .margin-l--m30, .event-benefit-template .l-article__inner .margin-l--m30 {margin-left: var(--calc-size--30);}
.event-benefit-template .margin-l--m32, .event-benefit-template .l-article__inner .margin-l--m32 {margin-left: var(--calc-size--32);}
.event-benefit-template .margin-l--m34, .event-benefit-template .l-article__inner .margin-l--m34 {margin-left: var(--calc-size--34);}
.event-benefit-template .margin-l--m35, .event-benefit-template .l-article__inner .margin-l--m35 {margin-left: var(--calc-size--35);}
.event-benefit-template .margin-l--m36, .event-benefit-template .l-article__inner .margin-l--m36 {margin-left: var(--calc-size--36);}
.event-benefit-template .margin-l--m38, .event-benefit-template .l-article__inner .margin-l--m38 {margin-left: var(--calc-size--38);}
.event-benefit-template .margin-l--m40, .event-benefit-template .l-article__inner .margin-l--m40 {margin-left: var(--calc-size--40);}
.event-benefit-template .margin-l--m45, .event-benefit-template .l-article__inner .margin-l--m45 {margin-left: var(--calc-size--45);}
.event-benefit-template .margin-l--m50, .event-benefit-template .l-article__inner .margin-l--m50 {margin-left: var(--calc-size--50);}
.event-benefit-template .margin-l--m52, .event-benefit-template .l-article__inner .margin-l--m52 {margin-left: var(--calc-size--52);}
.event-benefit-template .margin-l--m54, .event-benefit-template .l-article__inner .margin-l--m54 {margin-left: var(--calc-size--54);}
.event-benefit-template .margin-l--m56, .event-benefit-template .l-article__inner .margin-l--m56 {margin-left: var(--calc-size--56);}
.event-benefit-template .margin-l--m58, .event-benefit-template .l-article__inner .margin-l--m58 {margin-left: var(--calc-size--58);}
.event-benefit-template .margin-l--m60, .event-benefit-template .l-article__inner .margin-l--m60 {margin-left: var(--calc-size--60);}
.event-benefit-template .margin-l--m62, .event-benefit-template .l-article__inner .margin-l--m62 {margin-left: var(--calc-size--62);}
.event-benefit-template .margin-l--m64, .event-benefit-template .l-article__inner .margin-l--m64 {margin-left: var(--calc-size--64);}
.event-benefit-template .margin-l--m66, .event-benefit-template .l-article__inner .margin-l--m66 {margin-left: var(--calc-size--66);}
.event-benefit-template .margin-l--m68, .event-benefit-template .l-article__inner .margin-l--m68 {margin-left: var(--calc-size--68);}
.event-benefit-template .margin-l--m70, .event-benefit-template .l-article__inner .margin-l--m70 {margin-left: var(--calc-size--70);}
.event-benefit-template .margin-l--m72, .event-benefit-template .l-article__inner .margin-l--m72 {margin-left: var(--calc-size--72);}
.event-benefit-template .margin-l--m74, .event-benefit-template .l-article__inner .margin-l--m74 {margin-left: var(--calc-size--74);}
.event-benefit-template .margin-l--m76, .event-benefit-template .l-article__inner .margin-l--m76 {margin-left: var(--calc-size--76);}
.event-benefit-template .margin-l--m78, .event-benefit-template .l-article__inner .margin-l--m78 {margin-left: var(--calc-size--78);}
.event-benefit-template .margin-l--m80, .event-benefit-template .l-article__inner .margin-l--m80 {margin-left: var(--calc-size--80);}

.event-benefit-template .margin-r--m00, .event-benefit-template .l-article__inner .margin-r--m00 {margin-right: var(--calc-size--00);}
.event-benefit-template .margin-r--m04, .event-benefit-template .l-article__inner .margin-r--m04 {margin-right: var(--calc-size--04);}
.event-benefit-template .margin-r--m05, .event-benefit-template .l-article__inner .margin-r--m05 {margin-right: var(--calc-size--05);}
.event-benefit-template .margin-r--m06, .event-benefit-template .l-article__inner .margin-r--m06 {margin-right: var(--calc-size--06);}
.event-benefit-template .margin-r--m08, .event-benefit-template .l-article__inner .margin-r--m08 {margin-right: var(--calc-size--08);}
.event-benefit-template .margin-r--m10, .event-benefit-template .l-article__inner .margin-r--m10 {margin-right: var(--calc-size--10);}
.event-benefit-template .margin-r--m12, .event-benefit-template .l-article__inner .margin-r--m12 {margin-right: var(--calc-size--12);}
.event-benefit-template .margin-r--m15, .event-benefit-template .l-article__inner .margin-r--m15 {margin-right: var(--calc-size--15);}
.event-benefit-template .margin-r--m16, .event-benefit-template .l-article__inner .margin-r--m16 {margin-right: var(--calc-size--16);}
.event-benefit-template .margin-r--m18, .event-benefit-template .l-article__inner .margin-r--m18 {margin-right: var(--calc-size--18);}
.event-benefit-template .margin-r--m20, .event-benefit-template .l-article__inner .margin-r--m20 {margin-right: var(--calc-size--20);}
.event-benefit-template .margin-r--m22, .event-benefit-template .l-article__inner .margin-r--m22 {margin-right: var(--calc-size--22);}
.event-benefit-template .margin-r--m24, .event-benefit-template .l-article__inner .margin-r--m24 {margin-right: var(--calc-size--24);}
.event-benefit-template .margin-r--m25, .event-benefit-template .l-article__inner .margin-r--m25 {margin-right: var(--calc-size--25);}
.event-benefit-template .margin-r--m26, .event-benefit-template .l-article__inner .margin-r--m26 {margin-right: var(--calc-size--26);}
.event-benefit-template .margin-r--m28, .event-benefit-template .l-article__inner .margin-r--m28 {margin-right: var(--calc-size--28);}
.event-benefit-template .margin-r--m30, .event-benefit-template .l-article__inner .margin-r--m30 {margin-right: var(--calc-size--30);}
.event-benefit-template .margin-r--m32, .event-benefit-template .l-article__inner .margin-r--m32 {margin-right: var(--calc-size--32);}
.event-benefit-template .margin-r--m34, .event-benefit-template .l-article__inner .margin-r--m34 {margin-right: var(--calc-size--34);}
.event-benefit-template .margin-r--m35, .event-benefit-template .l-article__inner .margin-r--m35 {margin-right: var(--calc-size--35);}
.event-benefit-template .margin-r--m36, .event-benefit-template .l-article__inner .margin-r--m36 {margin-right: var(--calc-size--36);}
.event-benefit-template .margin-r--m38, .event-benefit-template .l-article__inner .margin-r--m38 {margin-right: var(--calc-size--38);}
.event-benefit-template .margin-r--m40, .event-benefit-template .l-article__inner .margin-r--m40 {margin-right: var(--calc-size--40);}
.event-benefit-template .margin-r--m45, .event-benefit-template .l-article__inner .margin-r--m45 {margin-right: var(--calc-size--45);}
.event-benefit-template .margin-r--m50, .event-benefit-template .l-article__inner .margin-r--m50 {margin-right: var(--calc-size--50);}
.event-benefit-template .margin-r--m52, .event-benefit-template .l-article__inner .margin-r--m52 {margin-right: var(--calc-size--52);}
.event-benefit-template .margin-r--m54, .event-benefit-template .l-article__inner .margin-r--m54 {margin-right: var(--calc-size--54);}
.event-benefit-template .margin-r--m56, .event-benefit-template .l-article__inner .margin-r--m56 {margin-right: var(--calc-size--56);}
.event-benefit-template .margin-r--m58, .event-benefit-template .l-article__inner .margin-r--m58 {margin-right: var(--calc-size--58);}
.event-benefit-template .margin-r--m60, .event-benefit-template .l-article__inner .margin-r--m60 {margin-right: var(--calc-size--60);}
.event-benefit-template .margin-r--m62, .event-benefit-template .l-article__inner .margin-r--m62 {margin-right: var(--calc-size--62);}
.event-benefit-template .margin-r--m64, .event-benefit-template .l-article__inner .margin-r--m64 {margin-right: var(--calc-size--64);}
.event-benefit-template .margin-r--m66, .event-benefit-template .l-article__inner .margin-r--m66 {margin-right: var(--calc-size--66);}
.event-benefit-template .margin-r--m68, .event-benefit-template .l-article__inner .margin-r--m68 {margin-right: var(--calc-size--68);}
.event-benefit-template .margin-r--m70, .event-benefit-template .l-article__inner .margin-r--m70 {margin-right: var(--calc-size--70);}
.event-benefit-template .margin-r--m72, .event-benefit-template .l-article__inner .margin-r--m72 {margin-right: var(--calc-size--72);}
.event-benefit-template .margin-r--m74, .event-benefit-template .l-article__inner .margin-r--m74 {margin-right: var(--calc-size--74);}
.event-benefit-template .margin-r--m76, .event-benefit-template .l-article__inner .margin-r--m76 {margin-right: var(--calc-size--76);}
.event-benefit-template .margin-r--m78, .event-benefit-template .l-article__inner .margin-r--m78 {margin-right: var(--calc-size--78);}
.event-benefit-template .margin-r--m80, .event-benefit-template .l-article__inner .margin-r--m80 {margin-right: var(--calc-size--80);}

.event-benefit-template .padding-t--m00, .event-benefit-template .l-article__inner .padding-t--m00 {padding-top: var(--calc-size--00);}
.event-benefit-template .padding-t--m04, .event-benefit-template .l-article__inner .padding-t--m04 {padding-top: var(--calc-size--04);}
.event-benefit-template .padding-t--m05, .event-benefit-template .l-article__inner .padding-t--m05 {padding-top: var(--calc-size--05);}
.event-benefit-template .padding-t--m06, .event-benefit-template .l-article__inner .padding-t--m06 {padding-top: var(--calc-size--06);}
.event-benefit-template .padding-t--m08, .event-benefit-template .l-article__inner .padding-t--m08 {padding-top: var(--calc-size--08);}
.event-benefit-template .padding-t--m10, .event-benefit-template .l-article__inner .padding-t--m10 {padding-top: var(--calc-size--10);}
.event-benefit-template .padding-t--m12, .event-benefit-template .l-article__inner .padding-t--m12 {padding-top: var(--calc-size--12);}
.event-benefit-template .padding-t--m15, .event-benefit-template .l-article__inner .padding-t--m15 {padding-top: var(--calc-size--15);}
.event-benefit-template .padding-t--m16, .event-benefit-template .l-article__inner .padding-t--m16 {padding-top: var(--calc-size--16);}
.event-benefit-template .padding-t--m18, .event-benefit-template .l-article__inner .padding-t--m18 {padding-top: var(--calc-size--18);}
.event-benefit-template .padding-t--m20, .event-benefit-template .l-article__inner .padding-t--m20 {padding-top: var(--calc-size--20);}
.event-benefit-template .padding-t--m22, .event-benefit-template .l-article__inner .padding-t--m22 {padding-top: var(--calc-size--22);}
.event-benefit-template .padding-t--m24, .event-benefit-template .l-article__inner .padding-t--m24 {padding-top: var(--calc-size--24);}
.event-benefit-template .padding-t--m25, .event-benefit-template .l-article__inner .padding-t--m25 {padding-top: var(--calc-size--25);}
.event-benefit-template .padding-t--m26, .event-benefit-template .l-article__inner .padding-t--m26 {padding-top: var(--calc-size--26);}
.event-benefit-template .padding-t--m28, .event-benefit-template .l-article__inner .padding-t--m28 {padding-top: var(--calc-size--28);}
.event-benefit-template .padding-t--m30, .event-benefit-template .l-article__inner .padding-t--m30 {padding-top: var(--calc-size--30);}
.event-benefit-template .padding-t--m32, .event-benefit-template .l-article__inner .padding-t--m32 {padding-top: var(--calc-size--32);}
.event-benefit-template .padding-t--m34, .event-benefit-template .l-article__inner .padding-t--m34 {padding-top: var(--calc-size--34);}
.event-benefit-template .padding-t--m35, .event-benefit-template .l-article__inner .padding-t--m35 {padding-top: var(--calc-size--35);}
.event-benefit-template .padding-t--m36, .event-benefit-template .l-article__inner .padding-t--m36 {padding-top: var(--calc-size--36);}
.event-benefit-template .padding-t--m38, .event-benefit-template .l-article__inner .padding-t--m38 {padding-top: var(--calc-size--38);}
.event-benefit-template .padding-t--m40, .event-benefit-template .l-article__inner .padding-t--m40 {padding-top: var(--calc-size--40);}
.event-benefit-template .padding-t--m45, .event-benefit-template .l-article__inner .padding-t--m45 {padding-top: var(--calc-size--45);}
.event-benefit-template .padding-t--m50, .event-benefit-template .l-article__inner .padding-t--m50 {padding-top: var(--calc-size--50);}
.event-benefit-template .padding-t--m52, .event-benefit-template .l-article__inner .padding-t--m52 {padding-top: var(--calc-size--52);}
.event-benefit-template .padding-t--m54, .event-benefit-template .l-article__inner .padding-t--m54 {padding-top: var(--calc-size--54);}
.event-benefit-template .padding-t--m56, .event-benefit-template .l-article__inner .padding-t--m56 {padding-top: var(--calc-size--56);}
.event-benefit-template .padding-t--m58, .event-benefit-template .l-article__inner .padding-t--m58 {padding-top: var(--calc-size--58);}
.event-benefit-template .padding-t--m60, .event-benefit-template .l-article__inner .padding-t--m60 {padding-top: var(--calc-size--60);}
.event-benefit-template .padding-t--m62, .event-benefit-template .l-article__inner .padding-t--m62 {padding-top: var(--calc-size--62);}
.event-benefit-template .padding-t--m64, .event-benefit-template .l-article__inner .padding-t--m64 {padding-top: var(--calc-size--64);}
.event-benefit-template .padding-t--m66, .event-benefit-template .l-article__inner .padding-t--m66 {padding-top: var(--calc-size--66);}
.event-benefit-template .padding-t--m68, .event-benefit-template .l-article__inner .padding-t--m68 {padding-top: var(--calc-size--68);}
.event-benefit-template .padding-t--m70, .event-benefit-template .l-article__inner .padding-t--m70 {padding-top: var(--calc-size--70);}
.event-benefit-template .padding-t--m72, .event-benefit-template .l-article__inner .padding-t--m72 {padding-top: var(--calc-size--72);}
.event-benefit-template .padding-t--m74, .event-benefit-template .l-article__inner .padding-t--m74 {padding-top: var(--calc-size--74);}
.event-benefit-template .padding-t--m76, .event-benefit-template .l-article__inner .padding-t--m76 {padding-top: var(--calc-size--76);}
.event-benefit-template .padding-t--m78, .event-benefit-template .l-article__inner .padding-t--m78 {padding-top: var(--calc-size--78);}
.event-benefit-template .padding-t--m80, .event-benefit-template .l-article__inner .padding-t--m80 {padding-top: var(--calc-size--80);}

.event-benefit-template .padding-b--m00, .event-benefit-template .l-article__inner .padding-b--m00 {padding-bottom: var(--calc-size--00);}
.event-benefit-template .padding-b--m04, .event-benefit-template .l-article__inner .padding-b--m04 {padding-bottom: var(--calc-size--04);}
.event-benefit-template .padding-b--m05, .event-benefit-template .l-article__inner .padding-b--m05 {padding-bottom: var(--calc-size--05);}
.event-benefit-template .padding-b--m06, .event-benefit-template .l-article__inner .padding-b--m06 {padding-bottom: var(--calc-size--06);}
.event-benefit-template .padding-b--m08, .event-benefit-template .l-article__inner .padding-b--m08 {padding-bottom: var(--calc-size--08);}
.event-benefit-template .padding-b--m10, .event-benefit-template .l-article__inner .padding-b--m10 {padding-bottom: var(--calc-size--10);}
.event-benefit-template .padding-b--m12, .event-benefit-template .l-article__inner .padding-b--m12 {padding-bottom: var(--calc-size--12);}
.event-benefit-template .padding-b--m15, .event-benefit-template .l-article__inner .padding-b--m15 {padding-bottom: var(--calc-size--15);}
.event-benefit-template .padding-b--m16, .event-benefit-template .l-article__inner .padding-b--m16 {padding-bottom: var(--calc-size--16);}
.event-benefit-template .padding-b--m18, .event-benefit-template .l-article__inner .padding-b--m18 {padding-bottom: var(--calc-size--18);}
.event-benefit-template .padding-b--m20, .event-benefit-template .l-article__inner .padding-b--m20 {padding-bottom: var(--calc-size--20);}
.event-benefit-template .padding-b--m22, .event-benefit-template .l-article__inner .padding-b--m22 {padding-bottom: var(--calc-size--22);}
.event-benefit-template .padding-b--m24, .event-benefit-template .l-article__inner .padding-b--m24 {padding-bottom: var(--calc-size--24);}
.event-benefit-template .padding-b--m25, .event-benefit-template .l-article__inner .padding-b--m25 {padding-bottom: var(--calc-size--25);}
.event-benefit-template .padding-b--m26, .event-benefit-template .l-article__inner .padding-b--m26 {padding-bottom: var(--calc-size--26);}
.event-benefit-template .padding-b--m28, .event-benefit-template .l-article__inner .padding-b--m28 {padding-bottom: var(--calc-size--28);}
.event-benefit-template .padding-b--m30, .event-benefit-template .l-article__inner .padding-b--m30 {padding-bottom: var(--calc-size--30);}
.event-benefit-template .padding-b--m32, .event-benefit-template .l-article__inner .padding-b--m32 {padding-bottom: var(--calc-size--32);}
.event-benefit-template .padding-b--m34, .event-benefit-template .l-article__inner .padding-b--m34 {padding-bottom: var(--calc-size--34);}
.event-benefit-template .padding-b--m35, .event-benefit-template .l-article__inner .padding-b--m35 {padding-bottom: var(--calc-size--35);}
.event-benefit-template .padding-b--m36, .event-benefit-template .l-article__inner .padding-b--m36 {padding-bottom: var(--calc-size--36);}
.event-benefit-template .padding-b--m38, .event-benefit-template .l-article__inner .padding-b--m38 {padding-bottom: var(--calc-size--38);}
.event-benefit-template .padding-b--m40, .event-benefit-template .l-article__inner .padding-b--m40 {padding-bottom: var(--calc-size--40);}
.event-benefit-template .padding-b--m45, .event-benefit-template .l-article__inner .padding-b--m45 {padding-bottom: var(--calc-size--45);}
.event-benefit-template .padding-b--m50, .event-benefit-template .l-article__inner .padding-b--m50 {padding-bottom: var(--calc-size--50);}
.event-benefit-template .padding-b--m52, .event-benefit-template .l-article__inner .padding-b--m52 {padding-bottom: var(--calc-size--52);}
.event-benefit-template .padding-b--m54, .event-benefit-template .l-article__inner .padding-b--m54 {padding-bottom: var(--calc-size--54);}
.event-benefit-template .padding-b--m56, .event-benefit-template .l-article__inner .padding-b--m56 {padding-bottom: var(--calc-size--56);}
.event-benefit-template .padding-b--m58, .event-benefit-template .l-article__inner .padding-b--m58 {padding-bottom: var(--calc-size--58);}
.event-benefit-template .padding-b--m60, .event-benefit-template .l-article__inner .padding-b--m60 {padding-bottom: var(--calc-size--60);}
.event-benefit-template .padding-b--m62, .event-benefit-template .l-article__inner .padding-b--m62 {padding-bottom: var(--calc-size--62);}
.event-benefit-template .padding-b--m64, .event-benefit-template .l-article__inner .padding-b--m64 {padding-bottom: var(--calc-size--64);}
.event-benefit-template .padding-b--m66, .event-benefit-template .l-article__inner .padding-b--m66 {padding-bottom: var(--calc-size--66);}
.event-benefit-template .padding-b--m68, .event-benefit-template .l-article__inner .padding-b--m68 {padding-bottom: var(--calc-size--68);}
.event-benefit-template .padding-b--m70, .event-benefit-template .l-article__inner .padding-b--m70 {padding-bottom: var(--calc-size--70);}
.event-benefit-template .padding-b--m72, .event-benefit-template .l-article__inner .padding-b--m72 {padding-bottom: var(--calc-size--72);}
.event-benefit-template .padding-b--m74, .event-benefit-template .l-article__inner .padding-b--m74 {padding-bottom: var(--calc-size--74);}
.event-benefit-template .padding-b--m76, .event-benefit-template .l-article__inner .padding-b--m76 {padding-bottom: var(--calc-size--76);}
.event-benefit-template .padding-b--m78, .event-benefit-template .l-article__inner .padding-b--m78 {padding-bottom: var(--calc-size--78);}
.event-benefit-template .padding-b--m80, .event-benefit-template .l-article__inner .padding-b--m80 {padding-bottom: var(--calc-size--80);}

.event-benefit-template .padding-l--m00, .event-benefit-template .l-article__inner .padding-l--m00 {padding-left: var(--calc-size--00);}
.event-benefit-template .padding-l--m04, .event-benefit-template .l-article__inner .padding-l--m04 {padding-left: var(--calc-size--04);}
.event-benefit-template .padding-l--m05, .event-benefit-template .l-article__inner .padding-l--m05 {padding-left: var(--calc-size--05);}
.event-benefit-template .padding-l--m06, .event-benefit-template .l-article__inner .padding-l--m06 {padding-left: var(--calc-size--06);}
.event-benefit-template .padding-l--m08, .event-benefit-template .l-article__inner .padding-l--m08 {padding-left: var(--calc-size--08);}
.event-benefit-template .padding-l--m10, .event-benefit-template .l-article__inner .padding-l--m10 {padding-left: var(--calc-size--10);}
.event-benefit-template .padding-l--m12, .event-benefit-template .l-article__inner .padding-l--m12 {padding-left: var(--calc-size--12);}
.event-benefit-template .padding-l--m15, .event-benefit-template .l-article__inner .padding-l--m15 {padding-left: var(--calc-size--15);}
.event-benefit-template .padding-l--m16, .event-benefit-template .l-article__inner .padding-l--m16 {padding-left: var(--calc-size--16);}
.event-benefit-template .padding-l--m18, .event-benefit-template .l-article__inner .padding-l--m18 {padding-left: var(--calc-size--18);}
.event-benefit-template .padding-l--m20, .event-benefit-template .l-article__inner .padding-l--m20 {padding-left: var(--calc-size--20);}
.event-benefit-template .padding-l--m22, .event-benefit-template .l-article__inner .padding-l--m22 {padding-left: var(--calc-size--22);}
.event-benefit-template .padding-l--m24, .event-benefit-template .l-article__inner .padding-l--m24 {padding-left: var(--calc-size--24);}
.event-benefit-template .padding-l--m25, .event-benefit-template .l-article__inner .padding-l--m25 {padding-left: var(--calc-size--25);}
.event-benefit-template .padding-l--m26, .event-benefit-template .l-article__inner .padding-l--m26 {padding-left: var(--calc-size--26);}
.event-benefit-template .padding-l--m28, .event-benefit-template .l-article__inner .padding-l--m28 {padding-left: var(--calc-size--28);}
.event-benefit-template .padding-l--m30, .event-benefit-template .l-article__inner .padding-l--m30 {padding-left: var(--calc-size--30);}
.event-benefit-template .padding-l--m32, .event-benefit-template .l-article__inner .padding-l--m32 {padding-left: var(--calc-size--32);}
.event-benefit-template .padding-l--m34, .event-benefit-template .l-article__inner .padding-l--m34 {padding-left: var(--calc-size--34);}
.event-benefit-template .padding-l--m35, .event-benefit-template .l-article__inner .padding-l--m35 {padding-left: var(--calc-size--35);}
.event-benefit-template .padding-l--m36, .event-benefit-template .l-article__inner .padding-l--m36 {padding-left: var(--calc-size--36);}
.event-benefit-template .padding-l--m38, .event-benefit-template .l-article__inner .padding-l--m38 {padding-left: var(--calc-size--38);}
.event-benefit-template .padding-l--m40, .event-benefit-template .l-article__inner .padding-l--m40 {padding-left: var(--calc-size--40);}
.event-benefit-template .padding-l--m45, .event-benefit-template .l-article__inner .padding-l--m45 {padding-left: var(--calc-size--45);}
.event-benefit-template .padding-l--m50, .event-benefit-template .l-article__inner .padding-l--m50 {padding-left: var(--calc-size--50);}
.event-benefit-template .padding-l--m52, .event-benefit-template .l-article__inner .padding-l--m52 {padding-left: var(--calc-size--52);}
.event-benefit-template .padding-l--m54, .event-benefit-template .l-article__inner .padding-l--m54 {padding-left: var(--calc-size--54);}
.event-benefit-template .padding-l--m56, .event-benefit-template .l-article__inner .padding-l--m56 {padding-left: var(--calc-size--56);}
.event-benefit-template .padding-l--m58, .event-benefit-template .l-article__inner .padding-l--m58 {padding-left: var(--calc-size--58);}
.event-benefit-template .padding-l--m60, .event-benefit-template .l-article__inner .padding-l--m60 {padding-left: var(--calc-size--60);}
.event-benefit-template .padding-l--m62, .event-benefit-template .l-article__inner .padding-l--m62 {padding-left: var(--calc-size--62);}
.event-benefit-template .padding-l--m64, .event-benefit-template .l-article__inner .padding-l--m64 {padding-left: var(--calc-size--64);}
.event-benefit-template .padding-l--m66, .event-benefit-template .l-article__inner .padding-l--m66 {padding-left: var(--calc-size--66);}
.event-benefit-template .padding-l--m68, .event-benefit-template .l-article__inner .padding-l--m68 {padding-left: var(--calc-size--68);}
.event-benefit-template .padding-l--m70, .event-benefit-template .l-article__inner .padding-l--m70 {padding-left: var(--calc-size--70);}
.event-benefit-template .padding-l--m72, .event-benefit-template .l-article__inner .padding-l--m72 {padding-left: var(--calc-size--72);}
.event-benefit-template .padding-l--m74, .event-benefit-template .l-article__inner .padding-l--m74 {padding-left: var(--calc-size--74);}
.event-benefit-template .padding-l--m76, .event-benefit-template .l-article__inner .padding-l--m76 {padding-left: var(--calc-size--76);}
.event-benefit-template .padding-l--m78, .event-benefit-template .l-article__inner .padding-l--m78 {padding-left: var(--calc-size--78);}
.event-benefit-template .padding-l--m80, .event-benefit-template .l-article__inner .padding-l--m80 {padding-left: var(--calc-size--80);}

.event-benefit-template .padding-r--m00, .event-benefit-template .l-article__inner .padding-r--m00 {padding-right: var(--calc-size--00);}
.event-benefit-template .padding-r--m04, .event-benefit-template .l-article__inner .padding-r--m04 {padding-right: var(--calc-size--04);}
.event-benefit-template .padding-r--m05, .event-benefit-template .l-article__inner .padding-r--m05 {padding-right: var(--calc-size--05);}
.event-benefit-template .padding-r--m06, .event-benefit-template .l-article__inner .padding-r--m06 {padding-right: var(--calc-size--06);}
.event-benefit-template .padding-r--m08, .event-benefit-template .l-article__inner .padding-r--m08 {padding-right: var(--calc-size--08);}
.event-benefit-template .padding-r--m10, .event-benefit-template .l-article__inner .padding-r--m10 {padding-right: var(--calc-size--10);}
.event-benefit-template .padding-r--m12, .event-benefit-template .l-article__inner .padding-r--m12 {padding-right: var(--calc-size--12);}
.event-benefit-template .padding-r--m15, .event-benefit-template .l-article__inner .padding-r--m15 {padding-right: var(--calc-size--15);}
.event-benefit-template .padding-r--m16, .event-benefit-template .l-article__inner .padding-r--m16 {padding-right: var(--calc-size--16);}
.event-benefit-template .padding-r--m18, .event-benefit-template .l-article__inner .padding-r--m18 {padding-right: var(--calc-size--18);}
.event-benefit-template .padding-r--m20, .event-benefit-template .l-article__inner .padding-r--m20 {padding-right: var(--calc-size--20);}
.event-benefit-template .padding-r--m22, .event-benefit-template .l-article__inner .padding-r--m22 {padding-right: var(--calc-size--22);}
.event-benefit-template .padding-r--m24, .event-benefit-template .l-article__inner .padding-r--m24 {padding-right: var(--calc-size--24);}
.event-benefit-template .padding-r--m25, .event-benefit-template .l-article__inner .padding-r--m25 {padding-right: var(--calc-size--25);}
.event-benefit-template .padding-r--m26, .event-benefit-template .l-article__inner .padding-r--m26 {padding-right: var(--calc-size--26);}
.event-benefit-template .padding-r--m28, .event-benefit-template .l-article__inner .padding-r--m28 {padding-right: var(--calc-size--28);}
.event-benefit-template .padding-r--m30, .event-benefit-template .l-article__inner .padding-r--m30 {padding-right: var(--calc-size--30);}
.event-benefit-template .padding-r--m32, .event-benefit-template .l-article__inner .padding-r--m32 {padding-right: var(--calc-size--32);}
.event-benefit-template .padding-r--m34, .event-benefit-template .l-article__inner .padding-r--m34 {padding-right: var(--calc-size--34);}
.event-benefit-template .padding-r--m35, .event-benefit-template .l-article__inner .padding-r--m35 {padding-right: var(--calc-size--35);}
.event-benefit-template .padding-r--m36, .event-benefit-template .l-article__inner .padding-r--m36 {padding-right: var(--calc-size--36);}
.event-benefit-template .padding-r--m38, .event-benefit-template .l-article__inner .padding-r--m38 {padding-right: var(--calc-size--38);}
.event-benefit-template .padding-r--m40, .event-benefit-template .l-article__inner .padding-r--m40 {padding-right: var(--calc-size--40);}
.event-benefit-template .padding-r--m45, .event-benefit-template .l-article__inner .padding-r--m45 {padding-right: var(--calc-size--45);}
.event-benefit-template .padding-r--m50, .event-benefit-template .l-article__inner .padding-r--m50 {padding-right: var(--calc-size--50);}
.event-benefit-template .padding-r--m52, .event-benefit-template .l-article__inner .padding-r--m52 {padding-right: var(--calc-size--52);}
.event-benefit-template .padding-r--m54, .event-benefit-template .l-article__inner .padding-r--m54 {padding-right: var(--calc-size--54);}
.event-benefit-template .padding-r--m56, .event-benefit-template .l-article__inner .padding-r--m56 {padding-right: var(--calc-size--56);}
.event-benefit-template .padding-r--m58, .event-benefit-template .l-article__inner .padding-r--m58 {padding-right: var(--calc-size--58);}
.event-benefit-template .padding-r--m60, .event-benefit-template .l-article__inner .padding-r--m60 {padding-right: var(--calc-size--60);}
.event-benefit-template .padding-r--m62, .event-benefit-template .l-article__inner .padding-r--m62 {padding-right: var(--calc-size--62);}
.event-benefit-template .padding-r--m64, .event-benefit-template .l-article__inner .padding-r--m64 {padding-right: var(--calc-size--64);}
.event-benefit-template .padding-r--m66, .event-benefit-template .l-article__inner .padding-r--m66 {padding-right: var(--calc-size--66);}
.event-benefit-template .padding-r--m68, .event-benefit-template .l-article__inner .padding-r--m68 {padding-right: var(--calc-size--68);}
.event-benefit-template .padding-r--m70, .event-benefit-template .l-article__inner .padding-r--m70 {padding-right: var(--calc-size--70);}
.event-benefit-template .padding-r--m72, .event-benefit-template .l-article__inner .padding-r--m72 {padding-right: var(--calc-size--72);}
.event-benefit-template .padding-r--m74, .event-benefit-template .l-article__inner .padding-r--m74 {padding-right: var(--calc-size--74);}
.event-benefit-template .padding-r--m76, .event-benefit-template .l-article__inner .padding-r--m76 {padding-right: var(--calc-size--76);}
.event-benefit-template .padding-r--m78, .event-benefit-template .l-article__inner .padding-r--m78 {padding-right: var(--calc-size--78);}
.event-benefit-template .padding-r--m80, .event-benefit-template .l-article__inner .padding-r--m80 {padding-right: var(--calc-size--80);}
/* // 공통 여백 */

/* ========================= */
/* // 공통 유틸리티 */
/* ========================= */