.pl-shop-promo { margin: 32px 0 8px; } .pl-shop-promo-title { margin: 0 0 14px; font-size: 15px; font-weight: 700; } .pl-shop-promo-grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); } .pl-shop-promo-card { display: block; text-decoration: none; color: inherit; } .pl-shop-promo-thumb { display: block; width: 100%; aspect-ratio: 1 / 1; object-fit: cover; border: 1px solid rgba(0, 0, 0, .08); border-radius: 6px; background: rgba(0, 0, 0, .03); } .pl-shop-promo-card:hover .pl-shop-promo-thumb { border-color: rgba(0, 0, 0, .2); } .pl-shop-promo-name { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-top: 7px; font-size: 13px; line-height: 1.4; } .pl-shop-promo-price { margin-top: 3px; font-size: 13px; font-weight: 700; } /* 더 보기 */ .pl-shop-promo-more { display: inline-block; margin-top: 18px; padding: 9px 18px; font-size: 13px; font-weight: 600; line-height: 1; text-decoration: none; color: inherit; border: 1px solid currentColor; border-radius: 999px; opacity: .75; transition: opacity .15s, background-color .15s; } .pl-shop-promo-more:hover { opacity: 1; background: rgba(0, 0, 0, .04); } @media (max-width: 480px) { .pl-shop-promo-grid { grid-template-columns: repeat(auto-fill, minmax(112px, 1fr)); gap: 10px; } }