/* DF 컨텐츠몰 v1.0.0 */
.dfmall{--ac:#1d4ed8;--ac-d:#1e3a8a;--tx:#111827;--sub:#6b7280;--line:#e5e7eb;--bg2:#f7f8fa;
	max-width:1180px;margin:0 auto;padding:10px 0 60px;color:var(--tx);
	font-family:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
	font-size:15px;line-height:1.6;letter-spacing:-.01em;-webkit-font-smoothing:antialiased}
.dfmall *,.dfmall *::before,.dfmall *::after{box-sizing:border-box}
.dfmall a{text-decoration:none}
.dfmall h2,.dfmall h3,.dfmall h4{font-family:inherit;color:var(--tx);letter-spacing:-.02em;margin:0}
.dfmall img{max-width:100%;height:auto;display:block}

/* 상단 */
.dfmall-top{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:0 0 18px;border-bottom:1px solid var(--line);margin-bottom:34px;font-size:14px}
.dfmall-crumb{color:var(--sub)}
.dfmall-crumb a{color:var(--tx);font-weight:600}
.dfmall-crumb span{margin:0 8px;color:#c0c4cc}
.dfmall-mylink{color:var(--tx)!important;font-weight:600;padding:7px 14px;border:1px solid var(--line);border-radius:20px;font-size:13.5px}
.dfmall-mylink:hover{border-color:var(--tx)}

/* 상단 어두운 배너 (화면 전체 폭) */
.dfmall-banner{position:relative;width:100vw;margin:-65px 0 40px calc(50% - 50vw);background:#1c1c1c;color:#fff;text-align:center;padding:190px 20px 80px}
.dfmall-banner__eyebrow{margin:0 0 10px!important;font-size:15px;font-weight:600;color:rgba(255,255,255,.6);letter-spacing:.02em}
.dfmall-banner h1{font-family:inherit;font-size:60px;font-weight:800;line-height:1.1;letter-spacing:-.01em;color:#fff;margin:0}
.dfmall-banner__intro{margin:18px auto 0!important;max-width:640px;font-size:16px;color:rgba(255,255,255,.72)}
/* 목록 */
.dfmall-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.dfmall-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#fff;color:var(--tx)!important;transition:transform .25s,box-shadow .25s}
.dfmall-card:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(17,24,39,.10)}
.dfmall-card__img{position:relative;aspect-ratio:16/10;background:var(--bg2);overflow:hidden}
.dfmall-card__img img{width:100%;height:100%;object-fit:cover}
.dfmall-noimg{width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding:20px;text-align:center;font-size:20px;font-weight:700;color:#fff;background:linear-gradient(135deg,#1d4ed8,#0f172a)}
.dfmall-badge{position:absolute;top:12px;left:12px;padding:4px 10px;border-radius:14px;background:var(--ac);color:#fff;font-size:12px;font-weight:700}
.dfmall-badge--inline{position:static;display:inline-block;margin-bottom:12px}
.dfmall-soon{position:absolute;top:12px;right:12px;padding:4px 10px;border-radius:14px;background:rgba(17,24,39,.75);color:#fff;font-size:12px;font-weight:600}
.dfmall-card__body{padding:20px 22px 22px;display:flex;flex-direction:column;flex:1}
.dfmall-card__body h3{font-size:19px;font-weight:700;margin-bottom:6px}
.dfmall-card__body p{color:var(--sub);font-size:14px;margin:0 0 16px;flex:1}
.dfmall-price{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px}
.dfmall-price strong{font-size:20px;font-weight:800;color:var(--tx)}
.dfmall-price strong small{font-size:14px;font-weight:600;margin-left:1px}
.dfmall-price del{color:#9ca3af;font-size:14px}
.dfmall-price__rate{color:#e11d48;font-weight:800;font-size:18px}
.dfmall-price__ask{font-size:17px;font-weight:700;color:var(--ac)}
.dfmall-price__unit{width:100%;color:var(--sub);font-size:13.5px}
.dfmall-empty{text-align:center;color:var(--sub);padding:60px 0}
.dfmall-empty a{color:var(--ac)}

/* 상세 */
.dfmall-detail{display:grid;grid-template-columns:1.15fr 1fr;gap:48px;align-items:start;margin-bottom:56px}
.dfmall-detail__img{border-radius:18px;overflow:hidden;border:1px solid var(--line);background:var(--bg2);aspect-ratio:16/11}
.dfmall-detail__img img{width:100%;height:100%;object-fit:cover}
.dfmall-detail__img .dfmall-noimg{font-size:28px}
.dfmall-detail__info h2{font-size:30px;font-weight:800;line-height:1.3;margin-bottom:10px}
.dfmall-summary{color:var(--sub);font-size:16px;margin:0 0 22px}
.dfmall-price--big{padding:20px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:22px}
.dfmall-price--big strong{font-size:30px}
.dfmall-price--big strong small{font-size:18px}
.dfmall-actions{display:flex;flex-wrap:wrap;gap:10px}
.dfmall-actions--center{justify-content:center;margin-top:26px}
.dfmall-btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 26px;border-radius:10px;font-size:15.5px;font-weight:700;border:0;cursor:pointer;font-family:inherit;line-height:1.2;transition:background .2s,border-color .2s,opacity .2s}
.dfmall-btn--primary{background:var(--ac);color:#fff!important}
.dfmall-btn--primary:hover{background:var(--ac-d)}
.dfmall-btn--line{background:#fff;color:var(--tx)!important;box-shadow:inset 0 0 0 1px #d1d5db}
.dfmall-btn--line:hover{box-shadow:inset 0 0 0 1px var(--tx)}
.dfmall-btn--disabled{background:#f3f4f6;color:#9ca3af!important;cursor:default}
.dfmall-btn--block{display:flex;width:100%}
.dfmall-btn--sm{padding:8px 14px;font-size:13px;border-radius:8px}
.dfmall-btn[disabled]{opacity:.6;cursor:default}
.dfmall-actions .dfmall-btn{flex:1 1 180px}
.dfmall-points{list-style:none;margin:22px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 18px;color:var(--sub);font-size:13.5px}
.dfmall-points li{margin:0;padding-left:18px;position:relative}
.dfmall-points li::before{content:"✓";position:absolute;left:0;color:var(--ac);font-weight:700}
.dfmall-sec{margin:0 0 48px}
.dfmall-sec h3{font-size:22px;font-weight:800;margin-bottom:18px}
.dfmall-features{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.dfmall-features li{margin:0;padding:16px 18px 16px 48px;background:var(--bg2);border-radius:12px;position:relative;font-size:15px}
.dfmall-features li::before{content:"✓";position:absolute;left:18px;top:15px;width:20px;height:20px;border-radius:50%;background:var(--ac);color:#fff;font-size:11px;font-weight:700;line-height:20px;text-align:center}
.dfmall-content{font-size:15.5px;line-height:1.8}
.dfmall-content img{border-radius:12px;margin:10px 0}
.dfmall-terms{padding:18px 22px;background:var(--bg2);border-radius:12px;color:#4b5563;font-size:14px;line-height:1.8}
.dfmall-terms--sm{font-size:13px;padding:14px 16px;margin-bottom:12px}

/* 구매 */
.dfmall-h{font-size:26px;font-weight:800;margin:0 0 24px!important}
.dfmall-buy{display:grid;grid-template-columns:1fr 360px;gap:32px;align-items:start}
.dfmall-box{border:1px solid var(--line);border-radius:14px;padding:22px 24px;margin-bottom:16px;background:#fff}
.dfmall-box h4{font-size:16px;font-weight:700;margin-bottom:14px}
.dfmall-f{display:block;margin:0 0 12px}
.dfmall-f>span{display:block;font-size:13.5px;font-weight:600;margin-bottom:6px;color:#374151}
.dfmall-f em{color:#e11d48;font-style:normal}
.dfmall input[type=text],.dfmall input[type=tel],.dfmall input[type=email],.dfmall textarea{
	display:block!important;width:100%!important;height:auto!important;min-height:44px;padding:10px 13px!important;border:1px solid #d1d5db!important;border-radius:9px!important;
	background:#fff!important;color:var(--tx)!important;font-family:inherit!important;font-size:15px!important;line-height:1.4!important;box-shadow:none!important;margin:0!important}
.dfmall input:focus,.dfmall textarea:focus{border-color:var(--ac)!important;outline:none!important;box-shadow:0 0 0 3px rgba(29,78,216,.12)!important}
.dfmall-hint{margin:6px 0 0;color:var(--sub);font-size:12.5px}
.dfmall-methods{display:flex;gap:10px;flex-wrap:wrap}
.dfmall-method{flex:1 1 160px;margin:0;cursor:pointer}
.dfmall-method input{position:absolute;opacity:0;pointer-events:none}
.dfmall-method span{display:block;padding:14px;text-align:center;border:1px solid #d1d5db;border-radius:10px;font-weight:600;font-size:14.5px;transition:.15s}
.dfmall-method input:checked+span{border-color:var(--ac);box-shadow:inset 0 0 0 1px var(--ac);color:var(--ac);background:#eff6ff}
.dfmall-method input:focus-visible+span{outline:2px solid var(--ac);outline-offset:2px}
.dfmall-bankinfo{margin-top:14px;padding:14px 16px;background:var(--bg2);border-radius:10px}
.dfmall-bankinfo[hidden]{display:none}
.dfmall-bankinfo>p:first-child{margin:0 0 10px;font-weight:700}
.dfmall-agree{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;cursor:pointer;margin:0}
.dfmall-agree input{width:18px;height:18px;margin:0;accent-color:var(--ac)}
.dfmall-summarybox{position:sticky;top:110px}
.dfmall-summarybox__in{border:1px solid var(--line);border-radius:14px;padding:22px;background:#fff;box-shadow:0 10px 30px rgba(17,24,39,.06)}
.dfmall-sb-prod{display:flex;gap:12px;align-items:center;padding-bottom:16px;border-bottom:1px solid var(--line)}
.dfmall-sb-prod img{width:64px;height:64px;object-fit:cover;border-radius:10px;flex:0 0 auto}
.dfmall-sb-prod strong{display:block;font-size:15.5px}
.dfmall-sb-prod span{font-size:12.5px;color:var(--sub)}
.dfmall-summarybox dl{display:grid;grid-template-columns:1fr auto;gap:8px;margin:16px 0;font-size:14px}
.dfmall-summarybox dt{color:var(--sub);margin:0}
.dfmall-summarybox dd{margin:0;text-align:right;font-weight:600}
.dfmall-sb-total{display:flex;justify-content:space-between;align-items:baseline;padding:16px 0;border-top:1px solid var(--line);margin-bottom:14px}
.dfmall-sb-total strong{font-size:24px;font-weight:800;color:var(--ac)}
.dfmall-msg{margin:10px 0 0;color:#e11d48;font-size:13.5px;font-weight:600;min-height:1em}
.dfmall-msg:empty{display:none}
.dfmall-notice{max-width:560px;margin:30px auto;text-align:center;padding:36px 30px;border:1px solid var(--line);border-radius:16px}
.dfmall-notice p{margin:0 0 18px;color:#4b5563}
.dfmall-notice strong{color:var(--tx);font-size:17px}

/* 완료 */
.dfmall-done{max-width:620px;margin:10px auto;text-align:center}
.dfmall-done__icon{width:64px;height:64px;margin:0 auto 18px;border-radius:50%;background:var(--ac);color:#fff;font-size:30px;font-weight:700;line-height:64px}
.dfmall-done__icon--x{background:#f59e0b}
.dfmall-done h2{font-size:26px;font-weight:800;margin-bottom:10px}
.dfmall-done>p{color:var(--sub);margin:0 0 22px}
.dfmall-bankbox{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:12px;overflow:hidden;margin:0 0 10px;text-align:left}
.dfmall-bankbox div{background:#fff;padding:14px 16px}
.dfmall-bankbox span{display:block;font-size:12.5px;color:var(--sub)}
.dfmall-bankbox strong{font-size:16px}
.dfmall-otable{width:100%;border-collapse:collapse;margin:22px 0 0;text-align:left;font-size:14.5px;border-top:2px solid var(--tx)}
.dfmall-otable th,.dfmall-otable td{padding:12px 14px;border-bottom:1px solid var(--line)}
.dfmall-otable th{width:120px;color:var(--sub);font-weight:600;background:var(--bg2)}

/* 내 구매내역 */
.dfmall-orders{display:flex;flex-direction:column;gap:12px}
.dfmall-order{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 22px;border:1px solid var(--line);border-radius:14px}
.dfmall-order__main{display:flex;flex-direction:column;gap:4px;min-width:0}
.dfmall-order__main strong{font-size:16.5px}
.dfmall-order__meta{color:var(--sub);font-size:13px;word-break:break-all}
.dfmall-order__side{display:flex;align-items:center;gap:14px;flex:0 0 auto}
.dfmall-order__amt{font-weight:800;font-size:16px}
.dfmall-st{align-self:flex-start;font-size:12px;font-weight:700;padding:3px 10px;border-radius:12px;background:#f3f4f6;color:#6b7280}
.dfmall-st--paid{background:#dcfce7;color:#15803d}
.dfmall-st--installed{background:#dbeafe;color:#1d4ed8}
.dfmall-st--awaiting{background:#fef3c7;color:#b45309}

@media (max-width:1000px){
	.dfmall-grid{grid-template-columns:repeat(2,1fr);gap:18px}
	.dfmall-detail{grid-template-columns:1fr;gap:28px}
	.dfmall-buy{grid-template-columns:1fr}
	.dfmall-summarybox{position:static}
}
@media (max-width:640px){
	.dfmall{font-size:14.5px}
	.dfmall-top{margin-bottom:24px}
	.dfmall-banner{padding:130px 16px 50px}
	.dfmall-banner h1{font-size:38px}
	.dfmall-banner__intro{font-size:14.5px}
	.dfmall-grid{grid-template-columns:1fr}
	.dfmall-detail__info h2{font-size:24px}
	.dfmall-features{grid-template-columns:1fr}
	.dfmall-box{padding:18px}
	.dfmall-order{flex-direction:column;align-items:stretch}
	.dfmall-order__side{justify-content:space-between}
	.dfmall-bankbox{grid-template-columns:1fr}
}

/* v1.0.2 결제 수단: 카드 준비 중 안내 */
.dfmall-method.is-soon span{color:#9ca3af}
.dfmall-method small{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:10px;background:#f3f4f6;color:#6b7280;font-size:11.5px;font-weight:600;vertical-align:1px}
.dfmall-cardsoon{margin-top:12px;padding:14px 16px;border-radius:10px;background:#fff7ed;border:1px solid #fed7aa;color:#9a3412;font-size:14px;line-height:1.6}
.dfmall-cardsoon[hidden]{display:none}
.dfmall-cardsoon p{margin:0}
#dfmall-pay[disabled]{opacity:.45;cursor:not-allowed}
