/* 공개 사이트 products 공통 — 시안 prod-printer.html, prod-consumables.html, prod-pda.html에서 이식 (2026-11-02) */
.e-scan{animation:e-scan 4.8s cubic-bezier(.45,0,.55,1) infinite alternate}
@keyframes e-scan{from{transform:translateY(0)}to{transform:translateY(250px)}}
.e-blink{animation:e-blink 2.4s ease-in-out infinite}
.e-blink:nth-of-type(2){animation-delay:.8s}
.e-blink:nth-of-type(3){animation-delay:1.6s}
@keyframes e-blink{0%,100%{opacity:.25}50%{opacity:1}}
/* ---- S8 관련 솔루션 ---- */
.e-rels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:48px}
.e-rel{position:relative;display:flex;flex-direction:column;min-height:240px;padding:32px 28px 28px;border-radius:var(--r-card);border:1px solid var(--e-line);background:#fff;transition:border-color .2s,transform .25s,box-shadow .25s}
.e-rel:hover{border-color:#212222;transform:translateY(-4px);box-shadow:0 18px 40px rgba(11,11,12,.08)}
.e-rel-l{font-family:var(--font-head);font-size:14px;font-weight:800;letter-spacing:.12em;color:var(--e-red)}
.e-rel h3{margin-top:10px;font-family:var(--font-head);font-size:24px;font-weight:800;letter-spacing:-.03em}
.e-rel p{margin-top:8px;font-size:16px;color:var(--e-sub)}
.e-rel-go{margin-top:auto;padding-top:24px;display:flex;align-items:center;justify-content:space-between;font-family:var(--font-head);font-size:15px;font-weight:700}
.e-rel-go i{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;border:1.5px solid var(--e-line);transition:background-color .2s,color .2s,border-color .2s}
.e-rel-go svg{width:20px;height:20px}
.e-rel:hover .e-rel-go i{background:var(--e-black);color:#fff;border-color:var(--e-black)}
/* ---- S9 문의 CTA ---- */
@media (max-width:1279px){
  .e-flow{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:48px}
  .e-flow::before{display:none}
  .e-hub{grid-template-columns:minmax(0,1fr) 240px minmax(0,1fr);padding:40px 32px}
  .e-hub-l{padding-right:36px}
  .e-hub-r{padding-left:36px}
  .e-hub-l .e-node::after,.e-hub-r .e-node::before{width:36px}
  .e-mods{grid-template-columns:repeat(2,minmax(0,1fr))}
  .e-hws{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:1023px){
  .e-ov{grid-template-columns:1fr;gap:28px}
  .e-ov-cards{margin-top:8px}
  .e-bens{grid-template-columns:repeat(2,minmax(0,1fr))}
  .e-ben,.e-ben:nth-child(4),.e-ben:nth-child(5){grid-column:span 1}
  .e-ben:nth-child(5){grid-column:1/-1}
  .e-hub{grid-template-columns:1fr;gap:0;padding:32px 24px 48px}
  .e-hub-l,.e-hub-r{padding:0}
  .e-hub-l .e-node::after,.e-hub-r .e-node::before{display:none}
  .e-core{width:200px;margin:56px auto}
  .e-core::before{inset:-12px}
  .e-core::after{inset:-24px}
  .e-hub-l::after,.e-hub-r::before{content:"";display:block;width:2px;height:40px;margin:0 auto;background:repeating-linear-gradient(180deg,#555758 0 6px,transparent 6px 11px)}
  .e-hub-l{display:grid}
  .e-hub-l::after{margin-bottom:-56px;margin-top:16px}
  .e-hub-r::before{margin-top:-56px;margin-bottom:16px}
  .e-hub-r{grid-template-columns:repeat(2,minmax(0,1fr))}
  .e-hub-r .e-hub-cap,.e-hub-r::before{grid-column:1/-1}
  .e-scr{grid-template-columns:1fr;gap:32px}
  .e-rels{grid-template-columns:1fr}
  .e-rel{min-height:0}
}
@media (max-width:767px){
  .e-ov-text p{font-size:16px}
  .e-ov-cards{grid-template-columns:1fr}
  .e-flow{grid-template-columns:1fr;row-gap:0;margin-top:40px}
  .e-step{display:grid;grid-template-columns:64px minmax(0,1fr);column-gap:18px;align-items:start;text-align:left;padding-bottom:32px}
  .e-step:not(:last-child)::before{content:"";position:absolute;left:31px;top:68px;bottom:4px;width:2px;background:repeating-linear-gradient(180deg,#212222 0 6px,transparent 6px 11px);opacity:.35}
  .e-step-ic{grid-row:1/4;width:64px;height:64px}
  .e-step-ic svg{width:28px;height:28px}
  .e-step-n{width:24px;height:24px;font-size:12px}
  .e-step h3{margin-top:4px}
  .e-step-d{min-height:0}
  .e-step-fn{justify-content:flex-start;margin-top:12px;padding-top:12px}
  .e-bens{grid-template-columns:1fr;margin-top:40px}
  .e-ben:nth-child(5){grid-column:auto}
  .e-ben{padding:28px 22px}
  .e-ben h3{font-size:21px;margin-top:20px}
  .e-ben li{font-size:15px}
  .e-menu-sum b{font-size:34px}
  .e-menu-sum div{text-align:left}
  .e-mods{grid-template-columns:1fr;margin-top:32px}
  .e-mod ul{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:12px}
  .e-mod li{font-size:15px}
  .e-mod li:nth-last-child(2):nth-child(odd){border-bottom:0}
  .e-hub{padding:24px 16px 40px;margin-top:40px}
  .e-hub-r{grid-template-columns:1fr}
  .e-node{font-size:16px}
  .e-hws{grid-template-columns:1fr}
  .e-hw-art{height:100px}
  .e-rel{padding:26px 22px 22px}
}
/* ---- 제품 목록 (Products 공통 템플릿) ---- */
.e-hero--list .e-hero-in{min-height:560px}
.e-feed{animation:e-feed 3.6s cubic-bezier(.45,0,.55,1) infinite alternate}
@keyframes e-feed{from{transform:translateY(-70px)}to{transform:translateY(0)}}
.e-spin{transform-box:fill-box;transform-origin:center;animation:e-spin 40s linear infinite}
@keyframes e-spin{to{transform:rotate(360deg)}}
.e-beam{animation:e-beam 2.4s ease-in-out infinite}
@keyframes e-beam{0%,100%{opacity:.45}50%{opacity:1}}
.e-plist{padding:72px 0 112px}
.e-ptool{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 24px;margin-top:32px}
.e-chips{display:flex;flex-wrap:wrap;gap:8px}
.e-chip{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 18px;border-radius:999px;border:1.5px solid var(--e-line);background:#fff;font-family:var(--font-head);font-size:15px;font-weight:700;color:var(--e-sub);transition:background-color .18s,color .18s,border-color .18s}
.e-chip span{font-size:13px;font-weight:600;color:var(--e-mute)}
.e-chip:hover{border-color:#212222;color:var(--e-text)}
.e-chip[aria-pressed="true"]{background:#212222;border-color:#212222;color:#fff}
.e-chip[aria-pressed="true"] span{color:rgba(255,255,255,.75)}
.e-psearch{position:relative;flex:0 1 320px;min-width:0}
.e-psearch svg{position:absolute;left:18px;top:50%;width:20px;height:20px;transform:translateY(-50%);color:var(--e-mute);pointer-events:none}
.e-psearch input{width:100%;min-height:48px;padding:0 18px 0 48px;border:1.5px solid var(--e-line);border-radius:999px;background:#fff;font:inherit;font-size:16px;color:var(--e-text);transition:border-color .18s}
.e-psearch input::placeholder{color:var(--e-mute)}
.e-psearch input:hover,.e-psearch input:focus{border-color:#212222}
.e-psearch input:focus-visible{outline:2px solid var(--e-focus);outline-offset:2px}
.e-pcount{margin-top:28px;padding-bottom:16px;border-bottom:1px solid var(--e-line);font-size:15px;color:var(--e-sub)}
.e-pcount b{font-family:var(--font-head);font-weight:800;color:var(--e-text)}
.e-pnote{margin-top:12px;font-size:14px;color:var(--e-mute)}
.e-pgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px 20px;margin-top:32px}
.e-pcard{display:flex;flex-direction:column;height:100%;border:1px solid var(--e-line);border-radius:var(--r-card);overflow:hidden;background:#fff;transition:border-color .2s,transform .25s,box-shadow .25s}
.e-pcard:hover{border-color:#212222;transform:translateY(-4px);box-shadow:0 18px 40px rgba(11,11,12,.08)}
.e-pimg{position:relative;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--e-bg2);border-bottom:1px solid var(--e-line)}
.e-pimg svg{width:38%;height:auto;color:var(--e-dsub);transition:transform .35s}
.e-pimg img{width:100%;height:100%;object-fit:contain;background:#fff}
.e-pcard:hover .e-pimg svg{transform:scale(1.06)}
.e-pimg-wm{position:absolute;left:16px;right:16px;bottom:12px;overflow:hidden;font-family:var(--font-head);font-size:26px;font-weight:800;line-height:1;letter-spacing:-.02em;text-transform:uppercase;white-space:nowrap;text-overflow:clip;color:rgba(11,11,12,.08)}
.e-pbody{display:flex;flex-direction:column;flex:1;padding:20px 20px 18px}
.e-pbadge{align-self:flex-start;display:inline-flex;align-items:center;min-height:26px;padding:0 10px;border-radius:999px;background:var(--e-black);color:#fff;font-family:var(--font-head);font-size:12px;font-weight:700;letter-spacing:.04em}
.e-pname{margin-top:12px;font-family:var(--font-head);font-size:17px;font-weight:700;line-height:1.45;letter-spacing:-.03em;overflow-wrap:anywhere}
/* 요약: 구분선 아래 제목 1줄 + 내용 3줄 (넘치면 …), 비어 있어도 같은 높이 */
.e-psum{margin-top:12px;padding-top:12px;border-top:1px solid var(--e-line);font-size:14px;line-height:1.55}
.e-psum-t{height:1.55em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:700;color:var(--e-text)}
.e-psum-d{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;height:calc(1.55em * 3);margin-top:6px;overflow:hidden;white-space:pre-line;overflow-wrap:anywhere;color:var(--e-sub)}
.e-ptags{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.e-ptags li{display:inline-flex;align-items:center;min-height:26px;padding:0 10px;border-radius:999px;border:1px solid var(--e-line);font-size:13px;font-weight:600;color:var(--e-sub)}
.e-pgo{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:18px;font-family:var(--font-head);font-size:14px;font-weight:700}
.e-pgo i{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;border:1.5px solid var(--e-line);transition:background-color .2s,color .2s,border-color .2s}
.e-pgo svg{width:18px;height:18px}
.e-pcard:hover .e-pgo i{background:var(--e-black);color:#fff;border-color:var(--e-black)}
.e-pempty{margin-top:32px;padding:64px 24px;border:1px dashed var(--e-dsub);border-radius:var(--r-card);text-align:center;color:var(--e-sub)}
.e-pempty strong{display:block;font-family:var(--font-head);font-size:20px;font-weight:800;color:var(--e-text)}
.e-pempty p{margin-top:6px;font-size:15px}
.e-pempty .e-btn{margin-top:20px}
.e-pmore{display:flex;justify-content:center;margin-top:48px}
.e-pmore .e-btn span{font-size:14px;font-weight:600;color:var(--e-mute)}
.e-noscript{margin-top:32px;padding:24px;border-radius:var(--r-sm);background:var(--e-bg2);font-size:15px;color:var(--e-sub)}
.e-rels--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.e-psol{display:flex;flex-wrap:wrap;align-items:center;gap:4px 24px;margin-top:32px;padding-top:24px;border-top:1px solid var(--e-line)}
.e-psol>span{font-family:var(--font-head);font-size:14px;font-weight:800;letter-spacing:.12em;color:var(--e-sub)}
@media (max-width:1279px){
  .e-pgrid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:1023px){
  .e-hero--list .e-hero-in{min-height:0}
  .e-pgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .e-psearch{flex:1 1 100%}
  .e-rels--2{grid-template-columns:1fr}
}
@media (max-width:767px){
  .e-plist{padding:48px 0 80px}
  .e-chips{flex-wrap:nowrap;overflow-x:auto;margin:0 calc(var(--gut) * -1);padding:2px var(--gut);scrollbar-width:none}
  .e-chips::-webkit-scrollbar{display:none}
  .e-chip{flex:none;padding:0 16px;font-size:14px}
  .e-pgrid{gap:16px 12px;margin-top:24px}
  .e-pbody{padding:16px 14px 14px}
  .e-pname{font-size:15px}
  .e-pimg-wm{left:12px;bottom:10px;font-size:20px}
  .e-pmore .e-btn{width:100%}
}
@media (max-width:479px){
  .e-pgrid{grid-template-columns:1fr}
  .e-pcard{flex-direction:row}
  .e-pimg{flex:none;width:112px;aspect-ratio:auto;border-bottom:0;border-right:1px solid var(--e-line)}
  .e-pimg-wm{display:none}
  .e-pgo{padding-top:12px}
}
@media (prefers-reduced-motion:reduce){
  .e-pcard:hover{transform:none}
}
