반응형 웹 디자인을 구현할 때 우리는 보통 미디어 쿼리(Media Queries)를 사용합니다.하지만 미디어 쿼리는 화면 크기를 기준으로 스타일을 변경하기 때문에 컴포넌트 중심의 디자인에서는 한계가 있습니다.이 문제를 해결하는 새로운 도구가 바로 CSS 컨테이너 쿼리(Container Queries)입니다.컨테이너 쿼리는 특정 컨테이너의 크기를 기준으로 스타일을 변경할 수 있어컴포넌트 단위의 반응형 디자인을 쉽게 구현할 수 있습니다. 🧐 왜 컨테이너 쿼리가 필요한가요?기존의 미디어 쿼리는 화면 전체의 크기만 고려하므로, 같은 컴포넌트가 다양한 컨텍스트(사이드바, 메인 콘텐츠 등)에서 다른 크기로 나타나야 하는 상황에 적합하지 않습니다.예를 들어, 카드 컴포넌트가 부모 컨테이너의 크기에 따라 레이아웃을 ..