/* DF 쇼핑몰 — 직각·촘촘한 기본 디자인 */
.dfs{--dfs-ink:#111;--dfs-txt:#333;--dfs-sub:#666;--dfs-mute:#999;--dfs-line:#e4e4e4;--dfs-line2:#d6d7da;--dfs-bg:#f7f7f8;--dfs-pt:#2447d6;--dfs-red:#e11d48;
	font-size:15px;line-height:1.55;color:var(--dfs-txt);letter-spacing:-.03em}
.dfs *,.dfs *::before,.dfs *::after{box-sizing:border-box;border-radius:0}
.dfs a{text-decoration:none}
.dfs table{border-collapse:collapse;width:100%;margin:0}

/* 단계 */
.dfs-steps{display:flex;justify-content:flex-end;gap:22px;list-style:none;margin:0 0 22px;padding:0}
.dfs-steps li{padding:0 0 7px;border-bottom:2px solid #cfd0d3;color:var(--dfs-mute);font-weight:700;font-size:15px}
.dfs-steps li b{font-weight:800;margin-right:2px}
.dfs-steps li.is-on{color:var(--dfs-ink);border-bottom-color:var(--dfs-red)}
.dfs-steps li.is-done{color:var(--dfs-sub)}

.dfs-msg{padding:12px 16px;margin:0 0 16px;font-size:14px;border:1px solid}
.dfs-msg ul{margin:0;padding-left:18px}
.dfs-msg.is-ok{background:#f0fdf4;border-color:#bbf7d0;color:#15803d}
.dfs-msg.is-err{background:#fff1f2;border-color:#fecdd3;color:#be123c}

/* 표 */
.dfs-table{border-top:2px solid var(--dfs-ink)}
.dfs-table th{background:var(--dfs-bg);font-weight:700;color:var(--dfs-ink);font-size:14px;padding:12px 10px;border-bottom:1px solid var(--dfs-line);text-align:center}
.dfs-table td{padding:14px 10px;border-bottom:1px solid var(--dfs-line);vertical-align:middle;font-size:14px}
.dfs-table .c{text-align:center;width:70px}
.dfs-table .r{text-align:right;white-space:nowrap}
.dfs-table del{color:var(--dfs-mute);font-size:13px}
.dfs-table.is-compact td{padding:11px 8px}
.dfs-table tr.is-total td{font-size:15px;color:var(--dfs-ink);background:var(--dfs-bg)}
.dfs-none{text-align:center;color:var(--dfs-sub);padding:30px 10px!important}
.dfs-item{display:flex;align-items:center;gap:12px;color:var(--dfs-ink)}
.dfs-item b{display:block;font-size:15px;font-weight:800}
.dfs-item small{display:block;color:var(--dfs-sub);font-size:12.5px;margin-top:2px}
.dfs-item__img{flex:none;width:64px;height:48px;border:1px solid var(--dfs-line);background:var(--dfs-bg);display:flex;align-items:center;justify-content:center;overflow:hidden}
.dfs-item__img img{width:100%;height:100%;object-fit:cover}
.dfs-noimg{font-size:12px;font-weight:800;color:var(--dfs-pt)}
.dfs-x{display:inline-flex;width:26px;height:26px;align-items:center;justify-content:center;border:1px solid var(--dfs-line2);color:var(--dfs-sub);font-size:16px}
.dfs-x:hover{border-color:var(--dfs-ink);color:var(--dfs-ink)}
.dfs input[type=checkbox]{width:16px;height:16px;accent-color:var(--dfs-ink)}

/* 합계 */
.dfs-sum{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--dfs-line2);border-top:0;background:var(--dfs-bg)}
.dfs-sum>div{padding:16px 18px;display:flex;flex-direction:column;gap:6px;border-left:1px solid var(--dfs-line2)}
.dfs-sum>div:first-child{border-left:0}
.dfs-sum span{font-size:13.5px;color:var(--dfs-sub)}
.dfs-sum b{text-align:right;font-size:17px;color:var(--dfs-ink)}
.dfs-sum .is-total b{color:var(--dfs-red);font-size:19px}
.dfs-sum.is-col{grid-template-columns:1fr;border:0;background:none}
.dfs-sum.is-col>div{flex-direction:row;justify-content:space-between;align-items:center;border-left:0;padding:8px 0}
.dfs-sum.is-col .is-total{border-top:1px solid var(--dfs-line);margin-top:6px;padding-top:14px}
.dfs-note{font-size:12.5px;color:var(--dfs-mute);margin:8px 0 0}

/* 버튼 */
.dfs-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px;align-items:center;justify-content:flex-end}
.dfs-actions.is-center{justify-content:center}
.dfs-sp{flex:1}
.dfs-btn{display:inline-flex;align-items:center;justify-content:center;height:40px;padding:0 18px;font-size:14px;font-weight:700;border:1px solid var(--dfs-line2);background:#f3f4f6;color:#333!important;cursor:pointer;white-space:nowrap;font-family:inherit;letter-spacing:-.03em}
.dfs-btn:hover{border-color:#999}
.dfs-btn.is-line{background:#fff;border-color:#b9bbbf}
.dfs-btn.is-dark{background:var(--dfs-ink);border-color:var(--dfs-ink);color:#fff!important}
.dfs-btn.is-dark:hover{background:var(--dfs-pt);border-color:var(--dfs-pt)}
.dfs-btn.is-blue{background:var(--dfs-pt);border-color:var(--dfs-pt);color:#fff!important}
.dfs-btn.is-blue:hover{background:#1a37b0}
.dfs-btn.is-off{background:#f3f4f6;color:#999!important;cursor:default}
.dfs-btn.is-sm{height:32px;padding:0 12px;font-size:13px}
.dfs-btn.is-lg{height:50px;padding:0 26px;font-size:15.5px}
.dfs-btn.is-full{width:100%}
.dfs-btn[disabled]{opacity:.5;cursor:not-allowed}

.dfs-box{border:1px solid var(--dfs-line2);padding:22px 24px;background:#fff}
.dfs-center{text-align:center}
.dfs .dfs-center p{margin:0 0 6px}
.dfs .dfs-h{font-size:16px;font-weight:800;color:var(--dfs-ink);margin:26px 0 10px;letter-spacing:-.05em}
.dfs .dfs-box>.dfs-h:first-child,.dfs .dfs-co__main>.dfs-h:first-child{margin-top:0}

/* 공유 */
.dfs-share{display:flex;align-items:center;justify-content:flex-end;gap:6px;margin-top:22px;flex-wrap:wrap}
.dfs-share>span{font-size:13px;color:var(--dfs-sub);margin-right:4px}
.dfs-sh{width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;color:#fff!important;border:0;cursor:pointer;font-family:inherit;letter-spacing:0}
.dfs-sh.is-kakao{background:#fee500;color:#3c1e1e!important}
.dfs-sh.is-fb{background:#3b5998;font-size:17px}
.dfs-sh.is-blog{background:#03c75a;font-size:10px}
.dfs-sh.is-band{background:#56585e;font-size:9.5px}
.dfs-sh.is-x{background:#000;font-size:14px}
.dfs-sh.is-mail{background:#e0874a;font-size:15px}
.dfs-sh.is-link{background:#d8d9dc;font-size:14px}

/* 체크아웃 */
.dfs-co{display:grid;grid-template-columns:1fr 340px;gap:28px;align-items:start}
.dfs-co__side{position:sticky;top:20px}
.dfs-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px 14px}
.dfs-f{display:flex;flex-direction:column;gap:5px;margin:0}
.dfs-f.is-wide{grid-column:1/-1}
.dfs-f>span{font-size:13.5px;font-weight:700;color:var(--dfs-ink)}
.dfs-f em{color:var(--dfs-red);font-style:normal}
.dfs-f small,.dfs-bank small{font-size:12.5px;color:var(--dfs-mute)}
.dfs input[type=text],.dfs input[type=tel],.dfs input[type=email]{height:42px;border:1px solid #cfd0d3;padding:0 12px;font:inherit;font-size:14.5px;width:100%;background:#fff;color:var(--dfs-ink);outline:0}
.dfs input[type=text]:focus,.dfs input[type=tel]:focus,.dfs input[type=email]:focus{border-color:var(--dfs-ink)}
.dfs-pays{display:grid;grid-template-columns:1fr 1fr;gap:0}
.dfs-pays label{cursor:pointer;margin:0 0 0 -1px}
.dfs-pays input{position:absolute;opacity:0;pointer-events:none}
.dfs-pays span{display:flex;flex-direction:column;gap:2px;padding:14px 16px;border:1px solid var(--dfs-line2);background:#fff}
.dfs-pays b{font-size:15px;color:var(--dfs-ink)}
.dfs-pays i{font-style:normal;font-size:12.5px;color:var(--dfs-sub)}
.dfs-pays input:checked+span{border-color:var(--dfs-ink);box-shadow:inset 0 0 0 1px var(--dfs-ink);position:relative}
.dfs-pays label.is-off span{background:var(--dfs-bg);color:var(--dfs-mute);cursor:not-allowed}
.dfs-pays label.is-off b{color:var(--dfs-mute)}
.dfs-bank{margin-top:10px;padding:14px 16px;background:var(--dfs-bg);border:1px solid var(--dfs-line);display:flex;flex-direction:column;gap:10px}
.dfs-bank p{margin:0;display:flex;gap:12px;font-size:14px}
.dfs-bank p span{color:var(--dfs-sub);flex:none}
.dfs-bank p b{color:var(--dfs-ink)}
.dfs-coupon{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.dfs-coupon input{max-width:240px}
.dfs-coupon [data-dfs-coupon-msg]{font-size:13px;color:var(--dfs-pt)}
.dfs-coupon [data-dfs-coupon-msg].is-err{color:var(--dfs-red)}
.dfs-agree{display:flex;gap:8px;align-items:flex-start;font-size:12.5px;color:var(--dfs-sub);margin:14px 0 14px;line-height:1.5;cursor:pointer}
.dfs-agree input{flex:none;margin-top:2px}
.dfs-agree a{color:var(--dfs-pt);font-weight:600}

/* 주문완료 */
.dfs-done{text-align:center;padding:26px 0 24px;border-bottom:1px solid var(--dfs-line);margin-bottom:22px}
.dfs .dfs-done h2{font-size:24px;font-weight:800;color:var(--dfs-ink);margin:0 0 6px;letter-spacing:-.06em}
.dfs .dfs-done p{margin:0;color:var(--dfs-sub)}
.dfs-done b{color:var(--dfs-ink)}
.dfs-bankinfo{margin-bottom:18px}
.dfs-bankinfo dl{display:grid;grid-template-columns:110px 1fr;gap:9px 12px;margin:0;font-size:14.5px}
.dfs-bankinfo dt{color:var(--dfs-sub)}
.dfs-bankinfo dd{margin:0;color:var(--dfs-ink)}
.dfs-strong{color:var(--dfs-red);font-size:18px}

/* 구매내역 */
.dfs-order{border:1px solid var(--dfs-line2);margin-bottom:12px;background:#fff}
.dfs-order header{display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--dfs-bg);border-bottom:1px solid var(--dfs-line);font-size:14px}
.dfs-order header>span:first-child{flex:1;color:var(--dfs-sub)}
.dfs-order header b{color:var(--dfs-ink)}
.dfs-order__sum{font-weight:800;color:var(--dfs-ink)}
.dfs-order__bank{margin:0;padding:10px 16px;font-size:13px;color:var(--dfs-sub);border-bottom:1px solid var(--dfs-line)}
.dfs-order ul{list-style:none;margin:0;padding:0}
.dfs-order li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 16px;border-top:1px solid var(--dfs-line)}
.dfs-order li:first-child{border-top:0}
.dfs-order__item b{display:block;font-size:15px;color:var(--dfs-ink)}
.dfs-order__item small{display:block;font-size:12.5px;color:var(--dfs-mute)}
.dfs-lic{display:flex;align-items:center;gap:6px;margin-top:6px;font-size:12.5px;color:var(--dfs-sub)}
.dfs-lic code{background:#f1f2f4;padding:2px 8px;font-size:13px;color:var(--dfs-ink);letter-spacing:.02em}
.dfs-copy{border:1px solid var(--dfs-line2);background:#fff;font-size:11.5px;padding:2px 8px;cursor:pointer;font-family:inherit}
.dfs-st{font-size:12px;font-weight:700;padding:3px 9px;background:#eef2ff;color:#1d4ed8}
.dfs-st.is-paid{background:#ecfdf5;color:#047857}
.dfs-st.is-cancelled,.dfs-st.is-refunded{background:#f3f4f6;color:#6b7280}

/* 상품 상세 구매 상자 */
.dfs-buy{display:grid;grid-template-columns:minmax(0,420px) 1fr;gap:34px;padding-bottom:30px;margin-bottom:34px;border-bottom:1px solid var(--dfs-line)}
.dfs-buy__img{border:1px solid var(--dfs-line);background:var(--dfs-bg);aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;overflow:hidden}
.dfs-buy__img img{width:100%;height:100%;object-fit:cover}
.dfs-buy__img .dfs-noimg{font-size:40px}
.dfs .dfs-buy__info h2{font-size:26px;font-weight:900;color:var(--dfs-ink);letter-spacing:-.06em;margin:4px 0 8px}
.dfs .dfs-buy__desc{font-size:15px;color:var(--dfs-sub);margin:0 0 18px}
.dfs-buy__meta{display:grid;grid-template-columns:90px 1fr;gap:10px 14px;margin:0 0 6px;padding:16px 0;border-top:2px solid var(--dfs-ink);border-bottom:1px solid var(--dfs-line);font-size:14.5px}
.dfs-buy__meta dt{color:var(--dfs-sub)}
.dfs-buy__meta dd{margin:0;color:var(--dfs-ink)}
.dfs-buy__meta del{color:var(--dfs-mute);margin-right:6px}
.dfs-buy .dfs-actions{justify-content:flex-start}
.dfs-buy .dfs-actions .dfs-btn{flex:1;max-width:220px}
.dfs-buy .dfs-share{justify-content:flex-start}

/* 사이드 */
.dfs-side__cart{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--dfs-line2)}
.dfs-side__cart a{display:flex;align-items:center;justify-content:center;gap:5px;height:44px;font-size:14px;font-weight:700;color:var(--dfs-ink)}
.dfs-side__cart a+a{border-left:1px solid var(--dfs-line2)}
.dfs-side__cart b{color:var(--dfs-red)}
.dfs-guides{list-style:none;margin:10px 0 0;padding:0}
.dfs-guides li+li{margin-top:6px}
.dfs-guides a{display:flex;align-items:center;gap:14px;padding:14px 16px;border:1px solid var(--dfs-line);color:var(--dfs-ink)}
.dfs-guides a:hover{border-color:var(--dfs-ink)}
.dfs-guides i{flex:none;width:34px;height:34px;display:flex;align-items:center;justify-content:center;background:var(--dfs-ink);color:#fff;font-style:normal;font-weight:800}
.dfs-guides b{display:block;font-size:14.5px}
.dfs-guides small{display:block;font-size:12.5px;color:var(--dfs-sub)}

.dfs-toast{position:fixed;left:50%;bottom:30px;transform:translate(-50%,20px);background:#111;color:#fff;padding:12px 18px;font-size:14px;opacity:0;transition:all .25s;z-index:99999;display:flex;gap:14px;align-items:center}
.dfs-toast a{color:#9db4ff;font-weight:700;text-decoration:none}
.dfs-toast.is-on{opacity:1;transform:translate(-50%,0)}

@media (max-width:900px){
	.dfs-co{grid-template-columns:1fr}
	.dfs-co__side{position:static}
	.dfs-buy{grid-template-columns:1fr;gap:20px}
}
@media (max-width:640px){
	.dfs-steps{justify-content:space-between;gap:8px}
	.dfs-steps li{font-size:13px}
	.dfs-table th:nth-child(3),.dfs-table td:nth-child(3){display:none}
	.dfs-table .c{width:44px}
	.dfs-item__img{width:48px;height:36px}
	.dfs-sum{grid-template-columns:1fr}
	.dfs-sum>div{border-left:0;border-top:1px solid var(--dfs-line2);flex-direction:row;justify-content:space-between;align-items:center;padding:11px 14px}
	.dfs-sum>div:first-child{border-top:0}
	.dfs-grid,.dfs-pays{grid-template-columns:1fr}
	.dfs-pays label{margin:-1px 0 0}
	.dfs-actions .dfs-btn{flex:1}
	.dfs-sp{display:none}
}
