/* storefarm/new/ai_intro.php — 고객 갤러리(CUSTOMER GALLERY) 섹션
   2026-11-04 /feelai/ 갤러리 이식. 모든 규칙은 #ai-lp-gallery 범위 안에서만 */
#ai-lp-gallery{--g-ink:#17181d;--g-sub:#6e6f76;--g-gold:#796324;padding:80px 0 0}
#ai-lp-gallery .alg-inner{max-width:1120px;margin:0 auto;padding:0 40px;box-sizing:border-box;font-family:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,sans-serif}
#ai-lp-gallery .alg-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:24px}
#ai-lp-gallery .alg-kicker{display:inline-flex;align-items:center;gap:7px;font-size:11px;font-weight:700;letter-spacing:.14em;line-height:1.4;color:var(--g-gold)}
#ai-lp-gallery .alg-kicker svg{width:15px;height:15px;color:#55565e}
#ai-lp-gallery .alg-head h2{margin:0;font-size:27px;font-weight:700;line-height:1.4;letter-spacing:-.04em;color:var(--g-ink);text-align:left;word-break:keep-all}
#ai-lp-gallery a.alg-more{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:700;line-height:16px;color:var(--g-sub);border-bottom:1px solid #bfb09e;padding-bottom:4px;text-decoration:none;white-space:nowrap}
#ai-lp-gallery a.alg-more svg{width:13px;height:13px;transition:transform .25s}
#ai-lp-gallery a.alg-more:hover svg{transform:translateX(3px)}
#ai-lp-gallery .alg-track{position:relative}
#ai-lp-gallery .alg-swiper{position:relative;overflow:hidden;margin:0;padding:4px 0 14px;width:100%}
#ai-lp-gallery .alg-swiper .swiper-wrapper{position:relative;display:flex;align-items:stretch;box-sizing:content-box;transition-property:transform;z-index:1}
#ai-lp-gallery .alg-item{flex-shrink:0;position:relative;width:276px;height:auto;cursor:pointer}
#ai-lp-gallery .alg-item figure{margin:0}
#ai-lp-gallery .alg-shot{position:relative;overflow:hidden;border-radius:10px;background:#eae4dc}
#ai-lp-gallery .alg-shot img{display:block;width:100%;height:246px;object-fit:cover;background:#eee9e2;transition:transform .8s cubic-bezier(.22,1,.36,1)}
#ai-lp-gallery .alg-item:hover .alg-shot img{transform:scale(1.05)}
#ai-lp-gallery .alg-shot img.alg-noimg{visibility:hidden}
#ai-lp-gallery .alg-play{position:absolute;top:50%;left:50%;z-index:1;display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.92);color:#14120f;box-shadow:0 4px 16px rgba(20,18,15,.22);transform:translate(-50%,-50%);transition:transform .18s ease}
#ai-lp-gallery .alg-item:hover .alg-play{transform:translate(-50%,-50%) scale(1.08)}
#ai-lp-gallery .alg-play svg{width:17px;height:17px;margin-left:2px}
#ai-lp-gallery .alg-item figcaption{margin-top:11px;font-size:11px;line-height:1.6;color:var(--g-sub);text-align:left;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
#ai-lp-gallery .alg-nav{position:absolute;top:98px;z-index:2;display:flex;align-items:center;justify-content:center;width:50px;height:50px;padding:0;background:#fff;border:1px solid #e6ded2;box-shadow:0 4px 12px #41371f17;color:#17181d;cursor:pointer}
#ai-lp-gallery .alg-nav svg{width:18px;height:18px}
#ai-lp-gallery .alg-prev{left:-25px}
#ai-lp-gallery .alg-next{right:-25px}
#ai-lp-gallery .alg-nav.swiper-button-disabled{opacity:.35;cursor:default}
/* 영상 모달 */
.alg-modal{display:none;position:fixed;inset:0;z-index:3000;align-items:center;justify-content:center;padding:24px;background:rgba(20,18,15,.72)}
.alg-modal.is-on{display:flex}
.alg-modal-box{width:min(1080px,96vw)}
.alg-modal-box video{display:block;width:100%;max-height:80vh;background:#14120f;border-radius:12px}
.alg-modal-cap{margin-top:12px;text-align:center;font-size:13.5px;font-weight:600;color:#faf8f5}
.alg-close{position:absolute;top:18px;right:24px;display:grid;place-items:center;width:40px;height:40px;padding:0;background:none;border:0;color:#faf8f5;cursor:pointer}
.alg-close svg{width:22px;height:22px}
@media (max-width:1280px){#ai-lp-gallery .alg-prev{left:-8px}#ai-lp-gallery .alg-next{right:-8px}}
@media (max-width:720px){
  #ai-lp-gallery{padding-top:48px}
  #ai-lp-gallery .alg-inner{padding:0 18px}
  #ai-lp-gallery .alg-head{flex-direction:column;align-items:flex-end;gap:12px;margin-bottom:19px}
  #ai-lp-gallery .alg-kicker{font-size:9px}
  #ai-lp-gallery .alg-kicker svg{width:13px;height:13px}
  #ai-lp-gallery .alg-head h2{font-size:21px;line-height:1.35}
  #ai-lp-gallery a.alg-more{font-size:10px;margin-top:8px}
  #ai-lp-gallery .alg-item{width:194px}
  #ai-lp-gallery .alg-shot img{height:266px}
  #ai-lp-gallery .alg-item figcaption{font-size:10px}
  #ai-lp-gallery .alg-nav{top:118px;width:30px;height:30px}
  #ai-lp-gallery .alg-prev{left:-15px}
  #ai-lp-gallery .alg-next{right:-15px}
}
