/* 전체 작업은 썸네일과 짧은 소개를 한 줄씩 읽을 수 있는 목록으로 표시한다. */
.pl-main{padding-top:72px;padding-bottom:74px}
.pl-heading{padding-bottom:44px}
.pl-heading .pw-eyebrow{display:flex;align-items:center;gap:13px;margin-bottom:15px}
.pl-heading .pw-eyebrow span{display:inline-flex;align-items:center;justify-content:center;min-width:25px;height:25px;padding-inline:6px;border:1px solid var(--pw-line);border-radius:50%;font-size:11px;letter-spacing:0;color:var(--pw-muted)}
.pl-heading h1{font-family:GmarketSans,Pretendard,sans-serif;font-size:clamp(32px,4vw,52px);font-weight:700;letter-spacing:-.045em;line-height:1.4}
.pl-heading>p:last-child{margin-top:17px;color:var(--pw-muted);font-size:16px}
.pl-works{list-style:none;margin:0;padding:0;border-top:1px solid var(--pw-line)}
.pl-works>li{border-bottom:1px solid var(--pw-line)}
.pl-work{display:grid;grid-template-columns:26px 220px minmax(0,1fr) 28px;gap:28px;align-items:center;padding:28px 8px;transition:background-color .2s}
.pl-work:hover,.pl-work:focus-visible{background:rgba(111,134,232,.045)}
.pl-work:focus-visible{outline:2px solid var(--pw-cyan);outline-offset:4px}
.pl-number{font-size:12px;font-variant-numeric:tabular-nums;color:#7e899d;align-self:start;padding-top:5px}
.pl-thumbnail{display:flex;align-items:center;justify-content:center;height:140px;min-width:0;padding:12px;background:#101722;border:1px solid rgba(154,179,225,.11);border-radius:8px;overflow:hidden}
.pl-thumbnail img{width:auto;height:auto;max-width:100%;max-height:114px;object-fit:contain}
.pl-thumbnail--diagram{flex-direction:column;gap:6px;background:linear-gradient(140deg,#141d36,#0d1720)}
.pl-diagram-label{color:var(--pw-muted);font-size:10px;letter-spacing:.06em}
.pl-thumbnail--diagram strong{font-weight:500;font-size:26px;letter-spacing:-.035em;color:#dae3ff}
.pl-diagram-flow{display:flex;align-items:center;gap:7px;font-size:10px;color:#b2bfdb}
.pl-diagram-flow i{font-style:normal;color:var(--pw-cyan)}
.pl-copy{min-width:0}
.pl-kind{font-size:12px;line-height:1.6;color:#9aaae2;margin-bottom:6px}
.pl-copy h2{font-size:25px;font-weight:600;letter-spacing:-.025em;line-height:1.3;transition:color .2s}
.pl-work:hover h2,.pl-work:focus-visible h2{color:#b8c7ff}
.pl-summary{margin-top:9px;font-size:14px;line-height:1.7;color:#bac3d0}
.pl-stack{display:flex;flex-wrap:wrap;gap:5px 15px;list-style:none;margin:12px 0 0;padding:0;color:#818fa3;font-size:11px;line-height:1.6}
.pl-arrow{font-size:23px;color:var(--pw-muted);transition:transform .2s,color .2s}
.pl-work:hover .pl-arrow,.pl-work:focus-visible .pl-arrow{color:var(--pw-cyan);transform:translate(2px,-2px)}
@media(max-width:1050px){.pl-work{grid-template-columns:22px 180px minmax(0,1fr) 24px;gap:20px}.pl-thumbnail{height:124px}.pl-thumbnail img{max-height:98px}.pl-copy h2{font-size:23px}.pl-summary{font-size:13px}}
@media(max-width:760px){.pl-main{padding-top:42px;padding-bottom:48px}.pl-heading{padding-bottom:30px}.pl-heading>p:last-child{font-size:14px;max-width:300px;margin-top:12px}.pl-work{grid-template-columns:minmax(0,1fr) 22px;gap:0 16px;padding:24px 0}.pl-number{display:none}.pl-thumbnail{grid-column:1/-1;width:156px;height:98px;margin-bottom:18px;padding:9px}.pl-thumbnail img{max-height:78px}.pl-thumbnail--diagram{gap:2px}.pl-thumbnail--diagram strong{font-size:21px}.pl-diagram-label{font-size:9px}.pl-diagram-flow{font-size:8px;gap:5px}.pl-copy{grid-column:1}.pl-kind{font-size:11px}.pl-copy h2{font-size:23px}.pl-summary{font-size:14px}.pl-arrow{align-self:start;margin-top:25px;font-size:21px}.pl-stack{margin-top:11px}.portfolio-list .pw-footer{padding-top:0}}
@media(prefers-reduced-motion:reduce){.pl-work,.pl-copy h2,.pl-arrow{transition:none}.pl-work:hover .pl-arrow,.pl-work:focus-visible .pl-arrow{transform:none}}