/* 페이지빌더 공개 블록 스타일 (반응형 한 벌로 PC/모바일 대응) */
.pb-page { width: 100%; }
.pb-container { max-width: 1080px; margin-left: auto; margin-right: auto; padding-left: 20px; padding-right: 20px; }

/* 정렬 유틸 */
.pb-align-left   { text-align: left; }
.pb-align-center { text-align: center; }
.pb-align-right  { text-align: right; }

/* 히어로 */
.pb-hero { padding: 80px 20px; background: #f3f4f6; }
.pb-hero--bg { background-size: cover; background-position: center; color: #fff; }
.pb-hero--bg .pb-hero__subtitle { color: rgba(255,255,255,.9); }
.pb-hero__inner { max-width: 880px; margin: 0 auto; }
.pb-hero__title { font-size: 40px; line-height: 1.2; margin: 0 0 16px; font-weight: 800; }
.pb-hero__subtitle { font-size: 18px; margin: 0 0 24px; color: #4b5563; }

/* 버튼 */
.pb-btn { display: inline-block; padding: 12px 26px; border-radius: 10px; text-decoration: none; font-weight: 600; font-size: 15px; transition: opacity .15s; }
.pb-btn:hover { opacity: .9; }
.pb-btn--primary { background: #2563eb; color: #fff; border: 1px solid #2563eb; }
.pb-btn--outline { background: transparent; color: #2563eb; border: 1px solid #2563eb; }
.pb-buttonwrap { padding-top: 16px; padding-bottom: 16px; }

/* 텍스트 */
.pb-richtext { padding-top: 24px; padding-bottom: 24px; font-size: 16px; line-height: 1.8; color: #374151; }
.pb-richtext img { max-width: 100%; height: auto; }

/* 이미지 */
.pb-image { margin: 0; padding-top: 16px; padding-bottom: 16px; }
.pb-image__img { max-width: 100%; height: auto; border-radius: 8px; display: inline-block; }

/* 여백 */
.pb-spacer { width: 100%; }

/* 자유 HTML */
.pb-html img { max-width: 100%; height: auto; }

/* 컬럼 (2~3단) */
.pb-columns { display: flex; gap: 24px; flex-wrap: wrap; padding-top: 24px; padding-bottom: 24px; }
.pb-col { flex: 1 1 0; min-width: 0; }
.pb-col img { max-width: 100%; height: auto; }

/* 게시판 최신글 위젯 */
.pb-latest { padding-top: 16px; padding-bottom: 16px; }

/* 배너 */
.pb-banner { padding-top: 16px; padding-bottom: 16px; }
.pb-banner img { max-width: 100%; height: auto; }

/* 상품 진열 */
.pb-shop { padding-top: 20px; padding-bottom: 20px; display: grid; gap: 20px; grid-template-columns: repeat(4, 1fr); }
.pb-shop-cols-2 { grid-template-columns: repeat(2, 1fr); }
.pb-shop-cols-3 { grid-template-columns: repeat(3, 1fr); }
.pb-shop-cols-5 { grid-template-columns: repeat(5, 1fr); }
.pb-shop__item a { display: block; text-decoration: none; color: inherit; }
.pb-shop__img img { max-width: 100%; height: auto; border-radius: 8px; display: block; }
.pb-shop__name { display: block; margin-top: 8px; font-size: 14px; color: #374151; }
.pb-shop__price { display: block; margin-top: 4px; font-weight: 700; color: #111827; }
.pb-shop__empty { color: #9aa1ab; text-align: center; }

/* 반응형 표시 제어 */
.pb-dev-mobile { display: none; }

@media (max-width: 640px) {
    .pb-hero { padding: 56px 18px; }
    .pb-hero__title { font-size: 28px; }
    .pb-hero__subtitle { font-size: 16px; }
    .pb-columns { flex-direction: column; gap: 16px; }
    .pb-dev-pc { display: none !important; }
    .pb-dev-mobile { display: block !important; }
    .pb-shop { grid-template-columns: repeat(2, 1fr) !important; gap: 12px; }
}
