@charset "UTF-8";
/* ==========================================================
   WHOMI TRANS - 고객사: 메인 OUR CLIENT 마퀴(kicpc-renewal order.html 기준) + 고객사 전체 페이지(ak-lee-gemini about-clients.html 기준)
   데이터: /include/lang/clients.json
   ========================================================== */
.htm-client,.clp{--navy:#16266B;--blue:#3A63DE;--sub:#6b7a93;--gold:#FFD56B}
.htm-client *,.clp *{box-sizing:border-box}
/* 메인 OUR CLIENT */
.htm-client{background:#fff;padding:40px 0 44px;overflow:hidden}
.hc-head{max-width:1280px;margin:0 auto 14px;padding:0 24px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.hc-title{font-size:19px;font-weight:900;color:var(--navy);letter-spacing:.6px}
.hc-sub{font-size:12.5px;color:var(--sub);font-weight:600}
.hc-more{margin-left:auto;font-size:13px;font-weight:800;color:#FF5A62;text-decoration:none}
.hc-more:hover{text-decoration:underline}
.hc-marquee{position:relative;width:100%;overflow:hidden;direction:ltr;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.hc-track{display:flex;gap:14px;width:max-content;padding:4px 24px;animation:hcScroll 172s linear infinite}
.hc-marquee:hover .hc-track{animation-play-state:paused}
@keyframes hcScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.hc-chip,.clp-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;border:1px solid #e9eef5;border-radius:12px;background:#fff;box-shadow:0 3px 12px rgba(8,22,48,.06);transition:box-shadow .2s,border-color .2s}
.hc-chip{flex:0 0 auto;width:162px;height:106px;padding:12px 14px}
.hc-chip:hover,.clp-card:hover{border-color:#cfe0f7;box-shadow:0 12px 24px rgba(20,40,100,.16);animation:hcWobble .6s ease}
@keyframes hcWobble{0%,100%{transform:rotate(0)}20%{transform:rotate(-4deg) translateY(-3px)}40%{transform:rotate(3deg) translateY(-3px)}60%{transform:rotate(-2deg) translateY(-2px)}80%{transform:rotate(1deg)}}
.hc-logo{height:38px;width:100%;display:flex;align-items:center;justify-content:center}
.hc-chip img{max-height:38px;max-width:126px;object-fit:contain;display:block}
.hc-chip .cn{font-size:12px;font-weight:800;color:#2a3a5c;max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.2}
@media(prefers-reduced-motion:reduce){.hc-track{animation:none}}
/* 고객사 전체 페이지 */
.clp-hero{position:relative;overflow:hidden;color:#0b1449;padding:44px 48px 40px 52px;background:#f4f7f9;border-radius:10px}
.clp-hero::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:#2ebb87}
.clp-eyebrow{display:inline-block;color:#4060b6;font-style:italic;font-weight:700;letter-spacing:.04em;font-size:16px;margin-bottom:10px}
.clp-hero h3{position:relative;font-size:34px;line-height:1.3;font-weight:700;color:#0b1449;letter-spacing:-.01em;word-break:keep-all}
.clp-hero p{position:relative;max-width:760px;margin-top:12px;color:#666;font-size:16px;line-height:1.7;font-weight:300;word-break:keep-all}
.clp-stats{position:relative;display:flex;gap:0;margin-top:26px;flex-wrap:wrap}
.clp-stat{padding:0 36px;border-left:1px solid #d2d2d2}
.clp-stat:first-child{padding-left:0;border-left:0}
.clp-stat b{display:block;font-size:36px;font-weight:700;color:#2ebb87;line-height:1}
.clp-stat span{display:block;margin-top:8px;font-size:14px;font-weight:500;color:#0b1449}
.clp-wall-head{margin:46px 0 20px}
.clp-h2{position:relative;padding-left:18px;font-size:26px;font-weight:700;color:#0b1449}
.clp-h2::before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:5px;background:#2ebb87;border-radius:3px}
.clp-count{margin-top:6px;font-size:14px;color:var(--sub);font-weight:600}
.clp-wall{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px 14px}
.clp-card{min-height:132px;padding:16px 12px}
.clp-card .ph{height:54px;width:100%;display:flex;align-items:center;justify-content:center}
.clp-card img{max-height:54px;max-width:90%;width:auto;object-fit:contain}
.clp-card .cn{margin-top:auto;font-size:12.5px;font-weight:800;color:var(--navy);text-align:center;line-height:1.3;word-break:keep-all}
@media(max-width:1024px){.clp-wall{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:768px){.clp-wall{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.clp-hero{padding:30px 22px 30px 28px}.clp-hero h3{font-size:26px}.clp-stat{padding:0 20px}.clp-stat b{font-size:28px}}
@media(max-width:480px){.clp-wall{grid-template-columns:repeat(2,minmax(0,1fr))}}
