/* BASIC css start */
#coupon-zone .page-body { padding: 25px 20px; }
#coupon-zone .coupon-memberbox { padding:30px 0 24px; border:1px solid #000; }
#coupon-zone .coupon-memberbox .m-level { position:relative; padding-left:170px; text-align:left; }
#coupon-zone .coupon-memberbox .m-level .ico { position:absolute; top:15px; left:98px; display:inline-block; width:52px; height:52px; line-height:52px; font-family:"Malgun Gothic"; font-size:13px; font-weight:bold; text-align:center; }
#coupon-zone .coupon-memberbox .m-level .ico > img { width: 60px; height: auto; }
#coupon-zone .coupon-memberbox .m-level strong { display:block; width:100%; padding-top:4px; color:#000; font-size:14px; font-weight:bold; line-height:26px; }
#coupon-zone .coupon-memberbox .m-level p { padding-top:3px; color:#888; }
#coupon-zone .coupon-memberbox .m-info { width:603px; margin:0 auto; }
#coupon-zone .coupon-memberbox .m-info:after { clear: both; content: ""; display: block; }
#coupon-zone .coupon-memberbox .m-info { margin-top:20px; }
#coupon-zone .coupon-memberbox .m-info li { float:left; width:150px; border-left:1px solid #e2e2e2; text-align:center; }
#coupon-zone .coupon-memberbox .m-info li:first-child { border-left:0; }
#coupon-zone .coupon-memberbox .m-info li dl { padding:16px 0; }
#coupon-zone .coupon-memberbox .m-info li dl dt { color:#999; font-weight:bold; }
#coupon-zone .coupon-memberbox .m-info li dl dd { padding:5px 0 0; color:#000; font-weight:bold; }
#coupon-zone .coupon-memberbox .m-info li dl dd a { color:#000; font-weight:bold; }
#coupon-zone .coupon-memberbox-none { clear: both; padding:40px 0 35px; border:1px solid #000; text-align:center; color:#000; font-size:14px; font-weight:bold; }
#coupon-zone .coupon-memberbox-none a { display:inline-block; margin-top:20px; }
#coupon-zone .coupon-codebox { padding:35px 0 35px 78px; margin:30px 0; border:5px solid #ededed; color:#000; }
#coupon-zone .coupon-codebox .input-text { width:280px; height:21px; line-height:22px; padding:0 5px; margin-left:5px; font-size:11px; }
#coupon-zone .coupon-codebox a { display:inline-block; height:23px; line-height:25px; padding:0 10px; color:#fff; border:1px solid #b5b5b5; background:#646464; }
#coupon-zone .coupon-codebox p { padding-top:13px; font-size:11px; color:#656565; }

#coupon-zone .couponWrap { border:1px solid #cecece; }
#coupon-zone .couponWrap .all-down { padding:30px 0 25px; border-bottom:1px solid #cecece; text-align:center; }
#coupon-zone .couponWrap .all-down strong { display:block; margin-bottom:15px; color:#000; font-size:16px; font-weight:bold; }
#coupon-zone .couponWrap .all-down a { display:inline-block; }

/* 기본 쿠폰 공통 */
#coupon-zone .couponWrap .coupon-list { width:636px; margin:0 auto; padding-top:45px; position: relative; }
#coupon-zone .couponWrap .coupon-list ul:after { clear: both; content: ""; display: block; }
#coupon-zone .couponWrap .coupon-list ul li { float:left; min-height:220px; padding:15px 25px; box-sizing: border-box; width: 50%; }
#coupon-zone .couponWrap .coupon-list ul li .c-image { display:block; border:1px solid #cecece; border-radius:10px; width: 266px; height: 180px; }
#coupon-zone .couponWrap .coupon-list ul li .c-image img { width: 100%;  height: 100%; border-radius: 10px; }
#coupon-zone .couponWrap .coupon-list ul li .c-info { width:266px; padding-top:13px; border:1px solid #cecece; border-radius:10px 10px 0 0; border-bottom:0; text-align:center; letter-spacing:-1px; }
#coupon-zone .couponWrap .coupon-list ul li p { padding:7px 10px 0; font-size:12px; color:#999; word-break:break-all; font-family:"Malgun Gothic"; }
#coupon-zone .couponWrap .coupon-list ul li p a { color:#999; font-family:"Malgun Gothic"; }
#coupon-zone .couponWrap .coupon-list ul li.sc-style2 p a { color:#999; }
#coupon-zone .couponWrap .coupon-list ul li p.c-name { width: 190px; margin:0 auto; font-size:14px; color:#000; font-weight:bold; line-height:18px; }
#coupon-zone .couponWrap .coupon-list ul li p.c-price { font-size:26px; color:#ff3a34; font-weight:bold;}
#coupon-zone .couponWrap .coupon-list ul li p.c-price .fc-blue {color:#3b6ce9;}
#coupon-zone .couponWrap .coupon-list ul li p.c-txt { width:200px; margin:0 auto; padding-top:7px; padding-bottom:0; line-height:18px; margin-top: 10px;}
#coupon-zone .couponWrap .coupon-list ul li .btn-down { display:block; padding:18px 0; border-radius:0 0 10px 10px; border:1px solid #cecece; border-top:1px dashed #cecece; background:#f8f8f8; font-family:"Malgun Gothic"; text-align:center; }
#coupon-zone .couponWrap .coupon-list ul li .btn-down span a { font-size:12px; color:#000; font-weight:bold; font-family:"Malgun Gothic";}
#coupon-zone .couponWrap .coupon-list ul li .btn-down span.bg-none {background-image:none !important;}
#coupon-zone .couponWrap .coupon-list ul li .btn-down.btn-auto span {color:#999;}
#coupon-zone .couponWrap .coupon-list ul li .btn-down span .num {display:inline-block; margin-left:3px; font-weight:normal; letter-spacing:0;}
#coupon-zone .couponWrap .coupon-list ul li .btn-down span .num em {font-weight:bold;}
#coupon-zone .couponWrap .coupon-list ul li .btn-down a { vertical-align:top; padding-right:18px; background:url('/images/common/ico_h11_down_black.png') no-repeat center right; }
#coupon-zone .couponWrap .coupon-list ul li.sc-style1.sc-reserve p.c-price {color:#3b6ce9;}
#coupon-zone .couponWrap .coupon-list ul li.sc-style2 .c-info { background:#171940; border-color:#171940; }
#coupon-zone .couponWrap .coupon-list ul li.sc-style2 p { color:#fff; }
#coupon-zone .couponWrap .coupon-list ul li.sc-style2 p.c-txt { color:#999; }
#coupon-zone .couponWrap .coupon-list ul li.sc-style2 .btn-down { background:#ff3a34; border:0; color:#fff; }
#coupon-zone .couponWrap .coupon-list ul li.sc-style2 .btn-down span a { color:#fff; }
#coupon-zone .couponWrap .coupon-list ul li.sc-style2 .btn-down a { background:url('/images/common/ico_h11_down_white.png') no-repeat center right; }
#coupon-zone .couponWrap .coupon-list ul li.sc-style2.sc-reserve .btn-down { background:#3b6ce9; color:#fff; }
#coupon-zone .couponWrap .coupon-list ul li.sc-style3 .c-info {border-color:#000; border-radius:10px;}
#coupon-zone .couponWrap .coupon-list ul li.sc-style3 p.c-price {color:#eb3697;}
#coupon-zone .couponWrap .coupon-list ul li.sc-style3 .btn-down { background:#fff2f9; border-color:#000; border-radius:10px; border-top:2px dotted #000; }
#coupon-zone .couponWrap .coupon-list ul li.sc-style3 .btn-down span a { color:#eb3697; }
#coupon-zone .couponWrap .coupon-list ul li.sc-style3 .btn-down a { background:url('/images/common/ico_h11_down_pink.png') no-repeat center right; }
#coupon-zone .couponWrap .coupon-list ul li.sc-style3.sc-reserve p.c-price {color:#18b776;}
#coupon-zone .couponWrap .coupon-list ul li.sc-style3.sc-reserve .btn-down { background:#eefff7; }
#coupon-zone .couponWrap .coupon-list ul li.sc-style3.sc-reserve .btn-down span a {color:#000;}
#coupon-zone .couponWrap .coupon-list ul li.sc-style3.sc-reserve .btn-down a { background:url('/images/common/ico_h11_down_green.png') no-repeat center right; }
#coupon-zone .couponWrap .coupon-list ul li.sc-style2 .btn-auto span { color:#fff; }
#coupon-zone .couponWrap .coupon-list ul li p.c-item { padding-bottom: 15px; }
#coupon-zone .couponWrap .coupon-list ul li.sc-img-style .c-info {position: relative;}
#coupon-zone .couponWrap .coupon-list ul li.sc-img-style .c-info .c-img {width: 70px; height: 70px; position: absolute; top: 15px; left: 15px; border-radius:100%; overflow: hidden;}
#coupon-zone .couponWrap .coupon-list ul li.sc-img-style .c-info .c-img img {width: 100%; height: 100%;}
#coupon-zone .couponWrap .coupon-list ul li.sc-img-style .c-info .c-data {text-align: right; padding:0 15px;}
#coupon-zone .couponWrap .coupon-list ul li.sc-img-style .c-info .c-data p.c-name {width: auto; margin: 0; padding-right: 0; padding-left: 70px;}
#coupon-zone .couponWrap .coupon-list ul li.sc-img-style .c-info .c-data p.c-price {padding-right: 0; padding-left: 70px;}
#coupon-zone .couponWrap .coupon-list ul li.sc-img-style .c-info .c-data .c-txt {margin-top: 15px; padding: 0; width: auto;  }


/* ===== 쿠폰존 리디자인 (마이페이지 gz-mp 톤) 2026-10-13 ===== */
/* 위 옛 규칙은 .page-body/.coupon-memberbox/.couponWrap 등 옛 클래스 전용이라 새 마크업에는 적용되지 않음 */
#coupon-zone.gz-mp { --green:#2c8a5a; --green-dark:#1f6e47; --green-deep:#1d7a4d; --green-soft:#eaf4ee; --green-line:#cfe5d8; --ink:#2a2f2c; --ink-sub:#5b635e; --muted:#939c96; --accent:#e08a2e; --line:#e6eae7; --line-soft:#eef1ef; --block:#f6f8f7; --radius:12px; --radius-sm:8px; --radius-xs:6px; position:relative; margin:0 auto 60px; box-sizing:border-box; color:var(--ink); font-family:Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif; font-size:13px; letter-spacing:-.01em; -webkit-font-smoothing:antialiased; }
#coupon-zone.gz-mp *,#coupon-zone.gz-mp *::before,#coupon-zone.gz-mp *::after { box-sizing:border-box; }
#coupon-zone.gz-mp a { color:inherit; text-decoration:none; }
#coupon-zone.gz-mp img { vertical-align:middle; }
#coupon-zone.gz-mp p { margin:0; }
#coupon-zone.gz-mp .panel { background:#fff; border:1px solid var(--line); border-radius:14px; box-shadow:0 1px 2px rgba(20,40,30,.03); overflow:hidden; }
#coupon-zone.gz-mp .page-head { display:flex; align-items:baseline; gap:12px; padding:22px 24px 18px; border-bottom:1px solid var(--line-soft); }
#coupon-zone.gz-mp .page-head .en { font-size:22px; font-weight:800; color:var(--ink); text-transform:uppercase; white-space:nowrap; }
#coupon-zone.gz-mp .page-head .en .lt { color:var(--green); }
#coupon-zone.gz-mp .page-head .kr { font-size:13.5px; color:var(--muted); }
#coupon-zone.gz-mp .pbody { padding:22px 24px 26px; }

/* 버튼 */
#coupon-zone.gz-mp .btn { display:inline-flex; align-items:center; justify-content:center; height:40px; padding:0 20px; border:none; background:var(--green); color:#fff; font-family:inherit; font-size:13.5px; font-weight:700; border-radius:var(--radius-sm); cursor:pointer; transition:.15s; white-space:nowrap; }
#coupon-zone.gz-mp .btn:hover { background:var(--green-dark); }
#coupon-zone.gz-mp .btn-sm { height:30px; padding:0 14px; font-size:12.5px; border-radius:var(--radius-xs); font-weight:600; }
#coupon-zone.gz-mp .btn-ghost { background:#fff; border:1px solid var(--line); color:var(--ink-sub); }
#coupon-zone.gz-mp .btn-ghost:hover { border-color:var(--green-line); color:var(--green-deep); background:var(--green-soft); }

/* 회원 정보 */
#coupon-zone.gz-mp .cz-member { display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; background:var(--block); border:1px solid var(--line); border-radius:var(--radius); padding:18px 20px; }
#coupon-zone.gz-mp .cz-level { display:flex; align-items:center; gap:14px; min-width:0; flex:1 1 0; }
#coupon-zone.gz-mp .cz-level .ico { flex:none; display:flex; align-items:center; justify-content:center; width:48px; height:48px; border-radius:50%; background:#fff; border:1px solid var(--line); overflow:hidden; }
#coupon-zone.gz-mp .cz-level .ico img { max-width:36px; max-height:36px; width:auto; height:auto; }
#coupon-zone.gz-mp .cz-level strong { display:block; font-size:15px; font-weight:700; color:var(--ink); line-height:1.4; }
#coupon-zone.gz-mp .cz-level strong b { color:var(--green-deep); font-weight:800; }
#coupon-zone.gz-mp .cz-level p { margin-top:4px; font-size:12.5px; color:var(--muted); }
#coupon-zone.gz-mp .cz-stats { list-style:none; margin:0; padding:0; display:flex; background:#fff; border:1px solid var(--line); border-radius:var(--radius-sm); }
#coupon-zone.gz-mp .cz-stats li + li { border-left:1px solid var(--line-soft); }
#coupon-zone.gz-mp .cz-stats a { display:flex; flex-direction:column; align-items:center; gap:4px; min-width:92px; padding:12px 16px; transition:.15s; }
#coupon-zone.gz-mp .cz-stats a:hover { background:var(--green-soft); }
#coupon-zone.gz-mp .cz-stats .k { font-size:12px; font-weight:600; color:var(--muted); }
#coupon-zone.gz-mp .cz-stats .v { font-size:16px; font-weight:700; color:var(--green-deep); white-space:nowrap; }
#coupon-zone.gz-mp .cz-guest { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; background:var(--block); border:1px solid var(--line); border-radius:var(--radius); padding:20px 22px; }
#coupon-zone.gz-mp .cz-guest p { font-size:14px; font-weight:600; color:var(--ink); }
#coupon-zone.gz-mp .cz-guest-btns { display:flex; gap:8px; }

/* 쿠폰 등록 */
#coupon-zone.gz-mp .coupon-reg { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:16px; background:var(--block); border:1px solid var(--line); border-radius:var(--radius); padding:16px 18px; }
#coupon-zone.gz-mp .coupon-reg form { display:flex; align-items:center; gap:10px; flex-wrap:wrap; flex:1 1 auto; min-width:0; margin:0; }
#coupon-zone.gz-mp .coupon-reg .crl { font-size:13.5px; font-weight:700; color:var(--ink); margin-right:4px; }
#coupon-zone.gz-mp .coupon-reg input:not([type=hidden]) { flex:1 1 0; min-width:200px; width:auto; height:40px; margin:0; padding:0 13px; border:1px solid var(--line); border-radius:var(--radius-sm); font-family:inherit; font-size:13.5px; line-height:normal; text-align:left; color:var(--ink); background:#fff; }
#coupon-zone.gz-mp .coupon-reg input:focus { outline:none; border-color:var(--green); box-shadow:0 0 0 3px rgba(44,138,90,.14); }
#coupon-zone.gz-mp .tips { margin:10px 4px 0; padding:0; list-style:none; }
#coupon-zone.gz-mp .tips li { position:relative; padding-left:15px; font-size:12px; color:var(--muted); line-height:1.5; }
#coupon-zone.gz-mp .tips li::before { content:""; position:absolute; left:2px; top:7px; width:5px; height:5px; border-radius:50%; background:var(--green-line); }

/* 다운로드 쿠폰 */
#coupon-zone.gz-mp .mp-sec-hd { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin:30px 4px 0; padding-bottom:12px; }
#coupon-zone.gz-mp .mp-sec-hd .hd-l { display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; min-width:0; }
#coupon-zone.gz-mp .mp-sec-hd h3 { margin:0; font-size:15px; font-weight:700; color:var(--ink); }
#coupon-zone.gz-mp .mp-sec-hd .hd-sub { font-size:12.5px; color:var(--muted); }
#coupon-zone.gz-mp .cz-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
#coupon-zone.gz-mp .cz-list ul { display:contents; list-style:none; }
#coupon-zone.gz-mp .cz-list li { min-width:0; list-style:none; }

/* 이미지형 쿠폰 */
#coupon-zone.gz-mp .cz-img-coupon .c-image { display:block; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:#fff; }
#coupon-zone.gz-mp .cz-img-coupon .c-image img { display:block; width:100%; height:auto; }

/* 기본형 쿠폰 카드 */
#coupon-zone.gz-mp .cz-card { display:flex; flex-direction:column; background:#fff; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; transition:border-color .15s, box-shadow .15s, transform .15s; }
#coupon-zone.gz-mp .cz-card:hover { border-color:var(--green-line); box-shadow:0 10px 24px rgba(20,40,30,.08); transform:translateY(-2px); }
#coupon-zone.gz-mp .cz-card .c-info { flex:1 1 auto; display:flex; gap:12px; padding:18px 18px 16px; border-top:3px solid var(--green); }
#coupon-zone.gz-mp .cz-card.sc-reserve .c-info { border-top-color:var(--accent); }
#coupon-zone.gz-mp .cz-card .c-img { flex:none; width:56px; height:56px; border-radius:50%; overflow:hidden; border:1px solid var(--line); }
#coupon-zone.gz-mp .cz-card .c-img a { display:block; width:100%; height:100%; }
#coupon-zone.gz-mp .cz-card .c-img img { width:100%; height:100%; object-fit:cover; }
#coupon-zone.gz-mp .cz-card .c-data { flex:1 1 0; min-width:0; }
#coupon-zone.gz-mp .cz-card .c-name { font-size:13.5px; font-weight:700; color:var(--ink); line-height:1.4; word-break:keep-all; }
#coupon-zone.gz-mp .cz-card .c-price { margin-top:6px; font-size:24px; font-weight:800; color:var(--green-deep); line-height:1.2; letter-spacing:-.02em; }
#coupon-zone.gz-mp .cz-card.sc-reserve .c-price { color:var(--accent); }
#coupon-zone.gz-mp .cz-card .c-txt { margin-top:10px; font-size:12px; color:var(--muted); line-height:1.6; word-break:keep-all; }
#coupon-zone.gz-mp .cz-card .c-item { margin-top:8px; font-size:12px; color:var(--ink-sub); }
#coupon-zone.gz-mp .cz-card .c-item a { display:inline-block; padding:3px 9px; border:1px solid var(--line); border-radius:var(--radius-xs); font-size:11.5px; font-weight:600; color:var(--ink-sub); }
#coupon-zone.gz-mp .cz-card .c-item a:hover { border-color:var(--green-line); color:var(--green-deep); }
#coupon-zone.gz-mp .cz-card .btn-down { position:relative; padding:12px 14px 14px; border-top:1px dashed var(--line); }
#coupon-zone.gz-mp .cz-card .btn-down::before,
#coupon-zone.gz-mp .cz-card .btn-down::after { content:""; position:absolute; top:-8px; width:14px; height:14px; border-radius:50%; background:#fff; border:1px solid var(--line); }
#coupon-zone.gz-mp .cz-card .btn-down::before { left:-8px; }
#coupon-zone.gz-mp .cz-card .btn-down::after { right:-8px; }
#coupon-zone.gz-mp .cz-card .btn-down span { display:flex; align-items:center; justify-content:center; height:38px; border-radius:var(--radius-sm); background:var(--block); font-size:13px; font-weight:600; color:var(--muted); }
#coupon-zone.gz-mp .cz-card .btn-down span a { display:flex; align-items:center; justify-content:center; width:100%; height:100%; border-radius:var(--radius-sm); background:var(--green); color:#fff; font-weight:700; transition:.15s; }
#coupon-zone.gz-mp .cz-card .btn-down span a:hover { background:var(--green-dark); }
#coupon-zone.gz-mp .cz-card.sc-reserve .btn-down span a { background:var(--accent); }
#coupon-zone.gz-mp .cz-card.sc-reserve .btn-down span a:hover { filter:brightness(.92); }

@media (max-width:860px){ #coupon-zone.gz-mp .cz-list{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:560px){ #coupon-zone.gz-mp .cz-list{ grid-template-columns:minmax(0,1fr); } #coupon-zone.gz-mp .cz-stats{ width:100%; } #coupon-zone.gz-mp .cz-stats li{ flex:1 1 0; } #coupon-zone.gz-mp .cz-stats a{ min-width:0; } }
@media (prefers-reduced-motion:reduce){ #coupon-zone.gz-mp *{ transition:none !important; } }

/* ===== 초록 토큰을 사이트 대표색 #438D46 계열로 교체 (2026-10-13) ===== */
#coupon-zone.gz-mp { --green:#438d46; --green-dark:#2d6b30; --green-deep:#357a38; --green-soft:#edf5ed; --green-line:#d3e6d4; }
#coupon-zone.gz-mp .coupon-reg input:focus { box-shadow:0 0 0 3px rgba(67,141,70,.14); }

/* BASIC css end */

