/* BASIC css start */
/* 쿠폰존 */
#coupon-zone .coupon-memberbox .m-level {text-align:center; padding:32px 0 36px; font-size:18px; font-weight:700;}
#coupon-zone .coupon-memberbox .btn {display:flex; gap:8px; padding:var(--defalt-padding);}
#coupon-zone .coupon-memberbox .btn a {flex:1;}
#coupon-zone .coupon-memberbox .btn a:after {content: ""; display: inline-block; width: 5px; height: 5px; transform: rotate(45deg); border-top: 1px solid var(--pri-black); border-right: 1px solid var(--pri-black); margin: 0 0 1px 6px;}
#coupon-zone .coupon-memberbox .m-info {display:flex; border-top:1px solid var(--gray-10); border-bottom:8px solid var(--gray-05);}
#coupon-zone .coupon-memberbox .m-info li {flex:1;}
#coupon-zone .coupon-memberbox .m-info li:first-child {border-right:1px solid var(--gray-10);}
#coupon-zone .coupon-memberbox .m-info li dl {padding:20px; display:flex; align-items:center; justify-content:space-between;}
#coupon-zone .coupon-memberbox .m-info li dl dt {font-size:14px;}
#coupon-zone .coupon-memberbox .m-info li dl dd {font-size:16px; font-weight:700;}
#coupon-zone .coupon-memberbox .m-info li dl dd b {font-size:14px;}
#coupon-zone .coupon-memberbox.no-member {border-bottom:8px solid var(--gray-05); padding-bottom:32px;}
#coupon-zone .coupon-memberbox.no-member .m-level {padding-bottom:24px;}

/* 쿠폰 리스트 */
#coupon-zone .coupon-list {padding:var(--defalt-padding);}
#coupon-zone .coupon-list .all-down {padding:36px 0 20px;}

/* 기본 쿠폰이미지 공통 */
#coupon-zone .list .list-box { position:relative; border:1px solid var(--gray-15); border-radius:10px; margin-bottom:18px; }
#coupon-zone .list .list-box .c-info { padding:18px 16px; }
#coupon-zone .list .list-box .box-top { position:relative; }
#coupon-zone .list .list-box .box-top .coupon-type {font-weight: 700; font-size:11px; color:var(--gray-35); margin-bottom:8px;}
#coupon-zone .list .list-box .box-top .coupon-name {font-weight: 600; font-size:14px; margin-bottom:16px; word-break: keep-all; }
#coupon-zone .list .list-box .box-top .coupon-discount { display: flex; align-items: center; height: 18px; line-height: 18px; margin-bottom: 8px; font-weight: 600; font-size:15px; color:var(--pri-brand);}
#coupon-zone .list .list-box .box-top .coupon-discount span { color:#000C8C; }
#coupon-zone .list .list-box .box-top .dday { padding: 0 6px; margin-left: 10px; border-radius: 2px; font-weight: 500; font-size: 10px; background: #F2F2F2; color: #757575; }
#coupon-zone .list .list-box .box-top .dc-item { position: absolute; right: 0; top: 0; padding: 0 2px; }
#coupon-zone .list .list-box .box-top .dc-item a { position: relative; font-weight: 500; display: flex; align-items: center; font-size: 12px; line-height: 18px; }
#coupon-zone .list .list-box .box-top .dc-item a.layer-open:after { content: ""; position: absolute; left: 0; bottom: 2px; width: 100%; height: 1px; border-bottom: 1px solid var(--pri-black); }
#coupon-zone .list .list-box .box-top .add_txt { margin-top: 3px; color: #8f8f8f; }
#coupon-zone .list .list-box .box-top .dc-price-txt { color: #8f8f8f; }
#coupon-zone .list .list-box .box-top .c-img { position: absolute; top: 0; left: 0; }
#coupon-zone .list .list-box .box-top .c-img a img { width: 48px; border-radius: 100px; }

#coupon-zone .list .list-box.sc-img-style .box-top .coupon-discount,
#coupon-zone .list .list-box.sc-img-style .box-top .coupon-name { padding-left: 60px; }


.sc-style2 .c-info .box-top .cpn-done:after { content: "조건충족시 자동발급"; width: 42px; text-align: center; margin-top: 3px; font-size: 10px; font-weight: 400; color: var(--gray-25); letter-spacing: -0.5px; }
.sc-style2 .c-info .box-top .cpn-done .cpn-done_txt { display: none; }


.cpn-done { position: absolute; bottom: 0; right: 0; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; box-sizing: border-box; }
.cpn-done_icon { display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; background: var(--gray-05); }
.cpn-done_icon svg { display: block; width: 16px; height: 16px; }
.cpn-done_icon path { fill: none; stroke: var(--gray-20); stroke-width: 5; stroke-linecap: round; stroke-linejoin: round; }
.cpn-done_txt { margin-top: 3px; font-size: 10px; font-weight: 400; color: var(--gray-25); letter-spacing: -0.5px; }

.cpn-get { position: absolute; bottom: 0; right: 0; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; box-sizing: border-box; text-decoration: none; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.cpn-get_icon { display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; background: #e3e3e3; transition: background-color 0.2s ease; }
.cpn-get_icon svg { display: block; width: 18px; height: 18px; transition: transform 0.2s ease; }
.cpn-get_icon path { fill: none; stroke: #6e6e6e; stroke-width: 5; stroke-linecap: round; stroke-linejoin: round; }
.cpn-get_txt { display: block; margin-top: 3px; font-size: 10px; font-weight: 400; line-height: 1.2; color: #333; letter-spacing: -0.5px; }
.cpn-get:hover, .cpn-get:focus, .cpn-get:active { text-decoration: none; }
.cpn-get:hover .cpn-get_icon { background: #d9d9d9; }
.cpn-get:hover .cpn-get_icon svg { transform: translateY(0px); }
.cpn-get:focus { outline: none; }
.cpn-get:focus-visible { outline: 2px solid #333; outline-offset: 4px; border-radius: 8px; }
/* BASIC css end */