@import url('https://cdn.jsdelivr.net/gh/fonts-archive/MaruBuri/MaruBuri.css'); /* 코너 헤더·히어로 명조 (2026-07-06) */

/* ============================================================
 * plan_b.css — 기획전 B타입(plan_view2) 전용 재디자인
 * 기준: DESIGN_POLICY.md (그린 1 + 중립 + 강조 1)
 * 스코프: .plan_b (plan_view2.jsp 루트 .event_view_wrap 에만 부여)
 *   → A(plan_view)·공유 style_v2.css 무영향. 기존 클래스를 .plan_b 안에서만 오버라이드.
 * 로드: plan_view2.jsp 에서만 (mobile/shop 공용). 수정 시 commScripts 버전 갱신.
 * 반응형: 기본=모바일 가로형 / @media(min-width:1025px)=PC 4열 그리드
 * ============================================================ */

.plan_b{
  --pb-green:#3d6041; --pb-green-d:#1d271e; --pb-green-2:#2f5233;
  --pb-ink:#1d271e; --pb-muted:#565a57; --pb-weak:#828284;
  --pb-line:#d8d8d8; --pb-surface:#f4f4f4; --pb-accent:#f8a31e; --pb-sale:#D8352A;
  --pb-cpn:#c85a12; --pb-cpn-bg:#fff6ec;
  --pb-num:'Roboto','Pretendard','Noto Sans KR',sans-serif;
  word-break:keep-all;
}
.plan_b, .plan_b p, .plan_b a, .plan_b dl, .plan_b dt, .plan_b dd, .plan_b h2{ letter-spacing:-.01em; }
.plan_b .mono, .plan_b .roboto{ font-family:var(--pb-num); font-variant-numeric:tabular-nums; }

/* ---- 상단 타이틀/공급일 ---- */
.plan_b .event_view_title .date{ color:var(--pb-muted); font-size:14px; }

/* ---- 쿠폰 배너 (신규 HTML: .pb-coupon) ---- */
.plan_b .pb-coupon{ background:var(--pb-cpn-bg); border:1px solid #f0dcc0; border-radius:16px; padding:14px; margin:8px 3px; }
.plan_b .pb-coupon .msg{ display:flex; align-items:center; gap:8px; font-size:14px; font-weight:700; color:var(--pb-green); margin-bottom:11px; line-height:1.4; }
.plan_b .pb-coupon .msg .ck{ flex:0 0 auto; width:20px; height:20px; border-radius:50%; background:var(--pb-green); color:#fff; display:grid; place-items:center; font-size:12.5px; }
/* 2026-07-29 다중쿠폰: 티켓 여러 장 세로 스택 */
.plan_b .pb-tickets{ display:flex; flex-direction:column; gap:8px; }
.plan_b .pb-ticket{ display:flex; background:#fff; border:1.5px solid var(--pb-cpn); border-radius:12px; overflow:hidden; }
.plan_b a.pb-ticket{ color:inherit; text-decoration:none; cursor:pointer; }
.plan_b .pb-ticket .tl{ flex:0 0 108px; background:var(--pb-cpn); color:#fff; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:12px 6px; position:relative; }
.plan_b .pb-ticket .tl .v{ font-size:24px; font-weight:800; line-height:1; }
.plan_b .pb-ticket .tl .v small{ font-size:13px; }
.plan_b .pb-ticket .tl .l{ font-size:12.5px; font-weight:700; margin-top:4px; opacity:.92; }
.plan_b .pb-ticket .tl::after{ content:""; position:absolute; right:-7px; top:0; bottom:0; width:14px; background:radial-gradient(circle at 7px 7px,transparent 6px,#fff 6px) repeat-y; background-size:14px 14px; }
.plan_b .pb-ticket .tr{ flex:1 1 auto; padding:11px 15px; min-width:0; }
.plan_b .pb-ticket .tr .nm{ font-size:15px; font-weight:800; color:var(--pb-ink); margin-bottom:3px; }
.plan_b .pb-ticket .tr .pd{ font-size:12.5px; color:var(--pb-muted); margin-bottom:8px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.plan_b .pb-ticket .tr .use{ font-size:12.5px; color:var(--pb-muted); white-space:nowrap; }
.plan_b .pb-ticket .tr .use b{ color:var(--pb-green); font-weight:800; }
.plan_b .pb-coupon .note{ font-size:12.5px; color:var(--pb-muted); margin-top:8px; }
.plan_b .pb-coupon .note b{ color:var(--pb-green); }

/* ---- 기획전 내 검색 (신규 HTML: .pb-search) ---- */
.plan_b .pb-search{ display:flex; align-items:center; gap:9px; background:#fff; border:1.5px solid var(--pb-line); border-radius:12px; padding:12px 15px; margin:4px 3px 2px; }
.plan_b .pb-search .si{ color:var(--pb-weak); font-size:15px; }
.plan_b .pb-search input{ border:0; outline:0; flex:1; min-width:0; font-family:inherit; font-size:16px; background:transparent; color:var(--pb-ink); }

/* ---- 탭 (그린 알약) — 스크롤 고정은 기존 .fixed JS 그대로 사용 ----
 * 주의: 기존 .est_menu .swc_tab a{line-height:60px} 상속 + a.active:after(초록 알약 가상요소)와
 * 충돌해 세로로 늘어난 타원/이중 알약이 됨 → line-height 재정의 + 가상요소 무력화 필수 */
.plan_b .event_slider_tab .swiper-slide a{ font-size:14px; font-weight:700; line-height:1.3; height:auto; color:var(--pb-muted); border:1px solid var(--pb-line); background:#fff; border-radius:999px; padding:9px 16px; margin:9px 0; white-space:nowrap; display:inline-block; }
.plan_b .event_slider_tab .swiper-slide a.active{ background:var(--pb-green); color:#fff; border-color:var(--pb-green); }
.plan_b .est_menu .swc_tab a.active:after{ display:none; }

/* ---- 섹션 제목: 이미지형 = 전체폭, 텍스트형 = 그린 밑줄 ---- */
.plan_b .ev_product .inner > img,
.plan_b .ev_product .inner > a > img{ width:100%; border-radius:12px; }
.plan_b .tabcon_tt{ font-size:19px; font-weight:800; color:var(--pb-green); border-bottom:2px solid var(--pb-green); padding:2px 0; margin:2px 3px 2px; }

/* ============================================================
 * 상품 그리드/카드 — 기본(모바일) = 가로형, PC = 그리드
 * 기존 마크업: .product_type4 > .content > a(.img_wrap + .txt_box) + a.cart
 * ============================================================ */
/* ---- 기존 mobile style_v2.css .product_type4(2열 float 카드) 규칙 무력화 ----
 * width:46.684% + nth float / img_wrap padding-bottom:100% 정사각 / tag li 54px 고정
 * 이 잔재가 새 카드에 새어들면 카드가 절반폭으로 찌그러지고 텍스트가 테두리 밖으로 넘침 */
.plan_b .product_type4 .content{ width:100%; float:none; }
.plan_b .product_type4 .content:nth-child(n+3){ margin-top:0; }
.plan_b .content .img_wrap{ padding-bottom:0; border:0; }
.plan_b .content .img_wrap .tag li{ float:none; width:auto; height:auto; line-height:1.4; }
.plan_b .content .txt_box .title{ height:auto; }
.plan_b .content .txt_box dl.price{ padding:0; height:auto; }
.plan_b .product_type4{ display:flex; flex-direction:column; gap:6px; padding:1px 3px 3px; margin:0; }
.plan_b .content{ position:relative; background:#fff; border:1px solid var(--pb-line); border-radius:16px; padding:12px; display:grid; grid-template-columns:146px 1fr; gap:6px 14px; align-items:start; }
.plan_b .content > a:not(.cart){ display:contents; }         /* 상품링크 래퍼 무력화 → 자식(img_wrap·txt_box)이 grid셀 */
.plan_b .content .img_wrap{ grid-column:1; grid-row:1/3; align-self:stretch; width:146px; height:auto; min-height:146px; border-radius:12px; overflow:hidden; background:#f7f8f6; position:relative; margin:0; flex-direction:row; justify-content:normal; }
.plan_b .content .img_wrap img{ width:100%; height:100%; object-fit:cover; }
.plan_b .content .img_wrap .tag{ position:absolute; top:8px; left:8px; display:flex; gap:4px; margin:0; padding:0; z-index:2; }
.plan_b .content .img_wrap .tag li{ list-style:none; font-size:12.5px; font-weight:800; color:#fff; padding:2px 6px; border-radius:5px; }
.plan_b .content .img_wrap .tag li.bg_y{ background:#D8352A; color:#fff; }  /* 할인% */
.plan_b .content .img_wrap .tag li.bg_g{ background:var(--pb-green-2); }                        /* 증정 */
.plan_b .content .img_wrap .tag li.bg_c{ background:var(--pb-green); }                          /* 쿠폰 */
/* 2026-07-09 사전예약/택배예약 카드 구분 (배경색·뱃지) */
.plan_b .content.pb-reserve{ background:#f5f2fc; border-color:#e2d8f5; }        /* 사전예약 = 연보라 */
.plan_b .content.pb-gift{ background:#eaf4fb; border-color:#cfe6f5; }           /* 택배예약 = 연하늘 */
.plan_b .content .img_wrap .tag li.bg_reserve{ background:#7b5cc7; }            /* 사전예약 뱃지 */
.plan_b .content .img_wrap .tag li.bg_gift{ background:#2f8fd6; }               /* 택배예약 뱃지 */
/* 2026-07-10 기획전은 style_v2.css를 로드하지 않음 → 반짝장터 밴드 스타일이 전무해 깨짐. style_v2의 .ts_band 규칙을 .plan_b 스코프로 자체 포함(모바일=스택 / PC=그리드) */
.plan_b .pb-tsband{ margin:0 0 22px; }
.plan_b .ts_band{ background:#ffffff; border:1px solid #ececea; padding:24px 0 28px; position:relative; overflow:hidden; border-radius:16px; }
.plan_b .ts_band::before{ content:""; position:absolute; inset:0; background:radial-gradient(1100px 240px at 12% -30%, rgba(217,184,74,.18), transparent 60%); pointer-events:none; }
.plan_b .ts_band .inner{ position:relative; z-index:1; padding:0 18px; }
.plan_b .ts_band .ts_panel{ color:#1d271e; }
.plan_b .ts_band .ts_eyebrow{ font-family:'Pretendard','Noto Sans KR',sans-serif; font-size:22px; display:flex; align-items:center; gap:9px; }
.plan_b .ts_band .ts_eyebrow .ts_spark{ color:#b8902e; font-size:17px; }
.plan_b .ts_band .ts_deadline{ margin-top:7px; font-size:13.5px; color:#6c7268; }
.plan_b .ts_band .ts_deadline b{ color:#b8902e; font-weight:600; }
.plan_b .ts_band .ts_count{ margin-top:12px; font-size:44px; line-height:1; font-weight:800; font-variant-numeric:tabular-nums; display:flex; align-items:baseline; gap:1px; white-space:nowrap; color:#1d271e; }
.plan_b .ts_band .ts_count .ts_num{ width:59px; min-width:59px; text-align:center; display:inline-block; }   /* 2026-09-05 QC D40: 숫자 열 폭 고정 = 라벨 열과 1:1 */
.plan_b .ts_band .ts_count .ts_colon{ color:#b8902e; padding:0 3px; font-weight:600; }
.plan_b .ts_band .ts_count .ts_sec{ color:#b8902e; }
.plan_b .ts_band .ts_count .ts_days{ font-size:20px; font-weight:700; color:#b8902e; min-width:44px; text-align:center; margin-right:7px; align-self:center; }   /* 2026-09-05 QC D40: 라벨 오프셋 결정용 폭 고정 */
.plan_b .ts_band .ts_count .ts_days:empty{ display:none; }
/* [2026-09-05 QC D40] '시간/분/초' 라벨이 숫자 열과 어긋나 있었다(실측: 라벨 중심 194/249/298 vs
   숫자 중심 250/329/407 = 최대 109px 이탈). gap 38 + padding-left 14 의 눈대중 값을 폐기하고
   숫자 열(59px)·콜론(18px)·flex gap(1px) 실측에 맞춘 격자로 바꾼다 — 피치 59+18+2 = 79px.
   일수(.ts_days)가 있으면 그 폭(44) + margin(7) + gap(1) = 52px 만큼 통째로 민다. */
.plan_b .ts_band .ts_count_lab{ margin-top:6px; font-size:12.5px; color:#8a8f86; letter-spacing:.16em;
	display:grid; grid-template-columns:repeat(3,59px); column-gap:20px; justify-content:start; text-align:center; padding-left:0; }
.plan_b .ts_band .ts_count:has(.ts_days:not(:empty)) + .ts_count_lab{ padding-left:52px; }
.plan_b .ts_band .ts_ember{ margin-top:12px; height:7px; border-radius:6px; background:#ececea; overflow:hidden; }
.plan_b .ts_band .ts_ember>i{ display:block; height:100%; width:100%; border-radius:6px; background:#C9A24B; }
.plan_b .ts_band .ts_tag{ margin-top:13px; font-size:13.5px; color:#6c7268; }
.plan_b .ts_band .ts_tag b{ color:#1d271e; }
.plan_b .ts_band .slider_tab{ margin-top:16px; }
.plan_b .ts_band .slider_tab li{ display:inline-block; margin:0 8px 0 0; }
.plan_b .ts_band .slider_tab a{ display:block; background:#f2f2ef; width:108px; height:38px; border-radius:22px; line-height:38px; text-align:center; font-size:15px; color:#4f554b; }
.plan_b .ts_band .slider_tab li.on a{ background:#D9B84A; color:#2E4A32; font-weight:700; }
.plan_b .ts_band .ms4_prod_wrap{ position:relative; overflow:hidden; margin-top:16px; }
.plan_b .ts_band .ms4_slider_wrap{ overflow:hidden; position:relative; padding:6px 2px 8px; }
.plan_b .ts_band .ms4_slider_wrap .swiper-wrapper{ display:flex; }
.plan_b .ts_band .ms4_slider_wrap .swiper-slide{ width:230px; flex:0 0 auto; margin-right:16px; background:#fff; border-radius:12px; box-shadow:0 4px 16px rgba(31,42,26,.10); overflow:hidden; position:relative; }
.plan_b .ts_band .ms4_slider_wrap .img_wrap{ position:relative; aspect-ratio:1/1; background:#fff; }
.plan_b .ts_band .ms4_slider_wrap .img_wrap img{ width:100%; height:100%; object-fit:cover; }
.plan_b .ts_band .ms4_slider_wrap .img_wrap .tag{ position:absolute; top:10px; left:10px; z-index:2; }
.plan_b .ts_band .ms4_slider_wrap .img_wrap .tag .bg_y{ display:inline-block; background:#D8352A; color:#fff; font-size:20px; font-weight:900; line-height:1; padding:7px 11px; border-radius:10px; }
.plan_b .ts_band .ms4_slider_wrap .img_wrap .tag .bg_g{ display:inline-block; background:#3D6041; color:#fff; font-size:12.5px; padding:4px 8px; border-radius:6px; margin-top:4px; }
.plan_b .ts_band .ms4_slider_wrap .img_wrap .tag .bg_c{ display:inline-block; background:#B8902E; color:#fff; font-size:12.5px; padding:4px 8px; border-radius:6px; margin-top:4px; }
.plan_b .ts_band .ms4_slider_wrap .txt_box{ background:#fff; padding:12px 13px 14px; margin:0; box-sizing:border-box; overflow:hidden; position:relative; height:auto; width:auto; }
.plan_b .ts_band .ms4_slider_wrap .txt_box .title{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:15px; font-weight:600; color:#23301F; margin-bottom:8px; height:auto; display:block; }
.plan_b .ts_band .ms4_slider_wrap .txt_box .comf{ margin-top:0; display:inline-block; font-size:12.5px; line-height:1; color:#6f7a63; background:#e7e3d6; padding:3px 7px; border-radius:4px; border:0; width:auto; height:auto; }
.plan_b .ts_band .ms4_slider_wrap .txt_box dl.price{ display:flex; align-items:baseline; gap:6px; padding:0; margin:0; width:auto; }
.plan_b .ts_band .ms4_slider_wrap .txt_box dl.price dt{ display:none; }
.plan_b .ts_band .ms4_slider_wrap .txt_box dl.price .won{ display:flex; align-items:baseline; gap:6px; flex-wrap:wrap; }
.plan_b .ts_band .ms4_slider_wrap .txt_box dl.price:first-of-type .won{ font-size:23px; font-weight:800; color:#3D6041; }
.plan_b .ts_band .ms4_slider_wrap .txt_box dl.price .won .sale{ font-size:12.5px; color:#a79f8d; text-decoration:line-through; font-weight:400; margin-left:6px; } /* 2026-09-06 창A검수6: 반짝장터 슬라이더도 판매가 '원'과 정가 붙음 → 좌측 여백 */
.plan_b .ts_band .ms4_slider_wrap .txt_box dl.price + dl.price{ display:none; }
.plan_b .ts_band .ms4_slider_wrap .cart{ position:absolute; bottom:10px; right:10px; width:44px; height:44px; border-radius:9px; background:#fff url(../../images/shop/ico_cart_line_g.svg) 50% 50% no-repeat; background-size:26px; border:1.5px solid #3D6041; font-size:0; box-shadow:none; }
.plan_b .ts_band .btn_more{ display:none; }
/* 타임세일 노출문구 (2026-07-14) — TS_COMMENT, 창A 계약, 값 있을 때만 */
.plan_b .ts_note{ margin:10px 14px 4px; padding:11px 14px; background:#FFF8EC; border:1px solid #F3E3C2; border-radius:11px; font-size:13.5px; line-height:1.55; color:#5C4A22; word-break:keep-all; }
/* PC: 좌측 타이머 패널 + 우측 상품 그리드 */
@media (min-width:1025px){
.plan_b .pb-tsband{ margin:0 0 22px; }
.plan_b .ts_band .inner{ position:relative; z-index:1; padding:0 18px; }
.plan_b .ts_band .ts_count{ margin-top:12px; font-size:44px; line-height:1; font-weight:800; font-variant-numeric:tabular-nums; display:flex; align-items:baseline; gap:1px; white-space:nowrap; color:#1d271e; }
.plan_b .ts_band .ts_count .ts_num{ width:59px; min-width:59px; text-align:center; display:inline-block; }   /* 2026-09-05 QC D40: 숫자 열 폭 고정 = 라벨 열과 1:1 */
.plan_b .ts_band .ms4_prod_wrap{ position:relative; overflow:hidden; margin-top:16px; }
  .plan_b .ts_note{ grid-column:1 / -1; margin:0; }
}

/* 2026-07-25 반짝장터 카드 = 모바일 메인(.pcard) 형식 통일. main_rd.css 미로드 → 필요한 카드규칙만 .pb-tsband 스코프로 이식(.mrdz·button 전역리셋 미사용). 1장=풀폭 솔로 / 2장=2열 / 3장+=가로레일 */
.plan_b .pb-tsband .pb-tsrail{ display:flex; gap:12px; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; padding:14px 2px 4px; margin-top:14px; }
.plan_b .pb-tsband .pb-tsrail::-webkit-scrollbar{ display:none; }
.plan_b .pb-tsband .pb-tsrail .pcard{ flex:0 0 240px; display:flex; flex-direction:column; background:#fff; border:1px solid #E4E0D2; border-radius:17px; overflow:hidden; box-shadow:0 8px 20px rgba(0,0,0,.16); }
/* 1장 = 풀폭 가로형(이미지 42% + 정보) */
.plan_b .pb-tsband .pb-tsrail.ts-solo{ display:block; overflow:visible; }
.plan_b .pb-tsband .pb-tsrail.ts-solo .pcard{ flex-direction:row; align-items:stretch; width:100%; }
.plan_b .pb-tsband .pb-tsrail.ts-solo .imwrap{ flex:0 0 42%; width:42%; }
.plan_b .pb-tsband .pb-tsrail.ts-solo .body{ flex:1 1 auto; min-width:0; justify-content:center; }
/* 2장 = 2열 그리드 */
.plan_b .pb-tsband .pb-tsrail.ts-duo{ display:grid; grid-template-columns:1fr 1fr; gap:12px; overflow:visible; }
.plan_b .pb-tsband .pb-tsrail.ts-duo .pcard{ flex:none; width:100%; }
/* 2026-07-29 3~8장(모바일) = 2열 그리드 세로 쌓기(전부 보임, 가로 스크롤 폐지 — "스크롤되는 줄 모름" 해결). 카드 동일높이(그리드 stretch) */
.plan_b .pb-tsband .pb-tsrail.ts-multi{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; overflow:visible; padding:14px 2px 4px; margin-top:14px; }
.plan_b .pb-tsband .pb-tsrail.ts-multi .pcard{ flex:none; width:100%; }
/* 썸네일 */
.plan_b .pb-tsband .imwrap{ position:relative; padding:8px; background:transparent; }
.plan_b .pb-tsband .imwrap .ilink{ display:block; }
.plan_b .pb-tsband .imwrap img{ width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:14px; background:#f7f7f4; filter:saturate(1.18) contrast(1.07) brightness(1.03); }
.plan_b .pb-tsband .imwrap .tags{ position:absolute; top:14px; left:14px; display:flex; flex-wrap:wrap; gap:5px; z-index:2; }
.plan_b .pb-tsband .imwrap .tg{ font-size:12.5px; font-weight:800; line-height:1.35; padding:3px 9px; border-radius:8px; color:#fff; box-shadow:0 1px 3px rgba(0,0,0,.16); }
.plan_b .pb-tsband .imwrap .tg-dc{ background:#D8352A; }
.plan_b .pb-tsband .imwrap .halt{ position:absolute; inset:8px; border-radius:14px; background:rgba(255,255,255,.74); display:grid; place-items:center; text-align:center; z-index:3; }
.plan_b .pb-tsband .imwrap .halt span{ font-size:14px; font-weight:800; color:#5a5d58; line-height:1.4; padding:0 8px; }
/* 본문 */
.plan_b .pb-tsband .pcard .body{ display:flex; flex-direction:column; flex:1; padding:8px 14px 12px; }
.plan_b .pb-tsband .pcard .metatop{ display:flex; align-items:center; gap:8px; margin-bottom:2px; min-height:20px; }
.plan_b .pb-tsband .pcard .metatop .farmer{ font-size:14px; color:#4F554B; font-weight:500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%; }
.plan_b .pb-tsband .pcard .tlink{ display:block; text-decoration:none; }
/* 상품명 앵커 기본 밑줄·방문색 제거(메인 .pcard와 동일). 담기버튼 등 다른 링크엔 무영향 — .tlink/.nm 한정 */
.plan_b .pb-tsband .pcard .tlink, .plan_b .pb-tsband .pcard .tlink:visited, .plan_b .pb-tsband .pcard .tlink:hover,
.plan_b .pb-tsband .pcard .nm{ text-decoration:none; color:#1D271E; }
.plan_b .pb-tsband .pcard .nm{ text-decoration:none; color:#1D271E; }
/* 규격·인증·산지·온도 칩 1줄 */
.plan_b .pb-tsband .pcard .specrow{ display:flex; flex-wrap:wrap; align-items:center; gap:5px; max-height:26px; overflow:hidden; margin-top:5px; }
.plan_b .pb-tsband .pcard .specrow .cpill{ flex:0 1 auto; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:12.5px; font-weight:600; border-radius:7px; padding:3px 9px; line-height:1.35; }
.plan_b .pb-tsband .pcard .specrow .cpill-spec{ background:#f3f2ec; border:1px solid #e3e0d4; color:#5f6b56; min-width:3.5em; }
.plan_b .pb-tsband .pcard .specrow .cpill-cert{ background:#e7efe8; border:1px solid #c9dccb; color:#2c4a30; font-weight:700; flex:0 0 auto; }
.plan_b .pb-tsband .pcard .specrow .cpill-sanji{ background:#FBF0E4; border:1px solid #F0DCC2; color:#9A5B1E; flex:0 0 auto; }
.plan_b .pb-tsband .pcard .specrow .tpill{ flex:0 0 auto; border:1px solid; }
.plan_b .pb-tsband .pcard .specrow .tpill-frozen{ background:#EAF2F8; border-color:#CFE0EE; color:#2F6D9E; }
.plan_b .pb-tsband .pcard .specrow .tpill-cold{ background:#E8F4F7; border-color:#CFE6EC; color:#1c7ea4; }
.plan_b .pb-tsband .pcard .specrow .tpill-room{ background:#F0F3EE; border-color:#DCE3D8; color:#6b7f6e; }
/* 가격 = 할인율(레드) + 조합원가 크게 + 원가 취소선 */
.plan_b .pb-tsband .pcard .pr{ display:flex; align-items:baseline; flex-wrap:nowrap; white-space:nowrap; min-width:0; gap:5px; margin-top:8px; margin-bottom:10px; }
/* 2026-07-29 개수 그리드(좁은 카드)에서 가격 1줄 유지: nowrap + 폰트 축소로 dc%·금액·원·원가 한 줄 */
.plan_b .pb-tsband .pb-tsrail.ts-multi .pcard .pr .now,
.plan_b .pb-tsband .pb-tsrail.ts-duo .pcard .pr .now{ font-size:20px; }
.plan_b .pb-tsband .pb-tsrail.ts-multi .pcard .pr .dc,
.plan_b .pb-tsband .pb-tsrail.ts-duo .pcard .pr .dc{ font-size:14px; }
.plan_b .pb-tsband .pb-tsrail.ts-multi .pcard .pr .won,
.plan_b .pb-tsband .pb-tsrail.ts-duo .pcard .pr .won{ font-size:13px; margin-left:-2px; }
.plan_b .pb-tsband .pb-tsrail.ts-multi .pcard .pr .old,
.plan_b .pb-tsband .pb-tsrail.ts-duo .pcard .pr .old{ font-size:12.5px; }
.plan_b .pb-tsband .pcard .pr .dc{ color:#D8352A; font-weight:800; font-size:17px; font-family:"Roboto",sans-serif; }
.plan_b .pb-tsband .pcard .pr .now{ font-family:"Roboto","Pretendard",sans-serif; font-weight:800; font-size:25px; color:#1D271E; }
.plan_b .pb-tsband .pcard .pr .won{ font-size:15.5px; font-weight:800; color:#1D271E; margin-left:-4px; }
.plan_b .pb-tsband .pcard .pr .old{ width:auto; font-size:14px; color:#767C72; text-decoration:line-through; font-family:"Roboto",sans-serif; }
/* 담기 = 아웃라인 통일(흰 배경+딥그린 테두리·글자, hover/active #eaf1e8, 36px) */
.plan_b .pb-tsband .pcard .addbtn{ display:flex; align-items:center; justify-content:center; width:100%; margin-top:auto; min-height:36px; padding:7px 0; background:#fff; color:#3D6041; border:1.5px solid #3D6041; border-radius:12px; font-size:17px; font-weight:800; letter-spacing:.02em; cursor:pointer; font-family:inherit; }
.plan_b .pb-tsband .pcard .addbtn:hover,.plan_b .pb-tsband .pcard .addbtn:active{ background:#eaf1e8; border-color:#3D6041; color:#3D6041; }
.plan_b .pb-tsband .pcard.soldout .addbtn{ background:#EEF0EC; border-color:#DDE1D8; color:#9AA095; }
/* PC: 솔로 카드 과도확대 방지(밴드 우측 그리드 컬럼 내) */
@media (min-width:1025px){
.plan_b .pb-tsband .pb-tsrail.ts-solo .imwrap{ flex:0 0 42%; width:42%; }
.plan_b .pb-tsband .pcard .nm{ text-decoration:none; color:#1D271E; }
}

/* 2026-07-29 PC 반짝장터(shop plan_view2 = Swiper 마크업) = 개수 반응형 그리드. Swiper 마크업/JS 무변경, CSS로 정적 그리드 전환(가로 스크롤·화살표 폐지 → 전부 보임). 열수 = min(개수,4), 5~8장=4열 줄바꿈. loop 복제(.swiper-slide-duplicate)는 숨김 */
@media (min-width:1025px){
  .plan_b .ts_band .ms4_prod_wrap.tspc-cnt{ overflow:visible; }
  .plan_b .ts_band .ms4_prod_wrap.tspc-cnt .btn_prev,
  .plan_b .ts_band .ms4_prod_wrap.tspc-cnt .btn_next{ display:none; }
  .plan_b .ts_band .ms4_prod_wrap.tspc-cnt .ms4_slider_wrap{ overflow:visible; padding:0; }
  .plan_b .ts_band .ms4_prod_wrap.tspc-cnt .swiper-wrapper{ display:grid !important; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; width:auto !important; height:auto !important; transform:none !important; align-items:start; }
  .plan_b .ts_band .ms4_prod_wrap.tspc-cnt .swiper-slide{ width:auto !important; margin:0 !important; }
  .plan_b .ts_band .ms4_prod_wrap.tspc-cnt .swiper-slide-duplicate{ display:none !important; }
  /* 개수별 열수: 1=중앙 솔로 / 2=2열 / 3=3열 / 4·5~8=4열(기본값) */
  .plan_b .ts_band .ms4_prod_wrap.tspc-cnt[data-cnt="1"] .swiper-wrapper{ grid-template-columns:minmax(0,300px); justify-content:center; }
  .plan_b .ts_band .ms4_prod_wrap.tspc-cnt[data-cnt="2"] .swiper-wrapper{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .plan_b .ts_band .ms4_prod_wrap.tspc-cnt[data-cnt="3"] .swiper-wrapper{ grid-template-columns:repeat(3,minmax(0,1fr)); }
  /* 2026-07-29 PC 카드 정상화: 가격 1줄(원 안 내려감) + 담기 버튼 복구(구 product_type1 절대배치 아이콘 → 풀폭 텍스트 버튼) + 카드 세로플렉스 */
  .plan_b .ts_band .ms4_prod_wrap.tspc-cnt .swiper-slide{ width:auto !important; margin:0 !important; }
  .plan_b .ts_band .ms4_prod_wrap.tspc-cnt .swiper-slide > a:first-child{ display:block; }
  .plan_b .ts_band .ms4_prod_wrap.tspc-cnt .swiper-slide .txt_box dl.price{ flex-wrap:nowrap; white-space:nowrap; }
  .plan_b .ts_band .ms4_prod_wrap.tspc-cnt .swiper-slide .txt_box dl.price dd.won{ white-space:nowrap; flex-wrap:nowrap; }
  .plan_b .ts_band .ms4_prod_wrap.tspc-cnt .swiper-slide .cart{ position:static; display:block; width:auto; height:36px; line-height:33px; margin:8px 12px 14px; padding:0; text-align:center; text-indent:0; background:#fff; color:#3D6041; border:1.5px solid #3D6041; border-radius:10px; font-size:16px; font-weight:800; letter-spacing:.02em; overflow:visible; }
  /* txt_box 고정높이(112px) 해제 → 내용 높이로, 가격~담기 갭 제거 */
  .plan_b .ts_band .ms4_prod_wrap.tspc-cnt .swiper-slide .txt_box{ height:auto !important; min-height:0 !important; overflow:visible; padding:12px 14px 4px; }
  .plan_b .ts_band .ms4_prod_wrap.tspc-cnt .swiper-slide .cart:before,
  .plan_b .ts_band .ms4_prod_wrap.tspc-cnt .swiper-slide .cart:after{ display:none !important; }
}

.plan_b .content .txt_box{ grid-column:2; grid-row:1; display:flex; flex-direction:column; min-width:0; min-height:132px; padding:0; }
.plan_b .content .txt_box .title{ font-size:18.5px; font-weight:700; color:var(--pb-ink); line-height:1.36; margin:0 0 8px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; word-break:keep-all; }
/* 조합원 가격 = 그린 굵게 / 비조합원 = 숨김 */
.plan_b .content .txt_box dl.price{ display:flex; align-items:baseline; gap:6px; margin:0; width:auto; }
.plan_b .content .txt_box dl.price dt{ display:none; }
.plan_b .content .txt_box dl.price dd{ display:inline-flex; align-items:baseline; margin:0; }
.plan_b .content .txt_box dl.price .won{ display:inline-flex; align-items:baseline; font-size:25px; font-weight:800; color:var(--pb-green); font-family:var(--pb-num); }
.plan_b .content .txt_box dl.price .won .sale{ font-size:15.5px; font-weight:700; color:var(--pb-weak); text-decoration:line-through; margin-left:6px; margin-right:2px; } /* 2026-09-06 창A검수6: 판매가 '원'과 정가가 붙던 것(14,900원17,500원) 좌측 여백 */
.plan_b .content .txt_box dl.price + dl.price{ display:none; }   /* 두 번째 dl.price = 비조합원 → 미노출 */
/* 쿠폰 적용가 (다운로드쿠폰 대상 생활재) */
.plan_b .content .txt_box .cpnp{ margin-top:5px; font-size:14px; font-weight:700; color:var(--pb-cpn); }
.plan_b .content .txt_box .cpnp b{ font-family:var(--pb-num); font-size:15.5px; font-variant-numeric:tabular-nums; }
/* 사양(GMBREEDING) = 그린 칩. 기존 mobile style_v2 .comf(58px 고정)·.txt(회색 테두리) 무력화 포함 */
.plan_b .content .txt_box .comf{ width:auto; height:auto; border:0; text-align:left; line-height:1.4; margin:6px 0 0; }
.plan_b .content .txt_box .comf .txt{ display:inline-block; width:auto; border:1px solid #cfdccf; background:#f2f6f2; border-radius:6px; padding:3px 9px; font-size:14px; line-height:1.4; color:var(--pb-green); font-weight:600; text-align:left; }

/* 담기 = 작은 보조 버튼(우하단, 그린 외곽선) */
.plan_b .content .cart{ position:static; float:none; top:auto; right:auto; grid-column:2; grid-row:2; justify-self:end; align-self:end; min-width:92px; width:auto; height:36px; padding:0 20px; border:1.5px solid transparent; border-radius:12px; background:#eaf1e8; color:#2f4b33; font-size:15px; font-weight:700; display:inline-flex; align-items:center; justify-content:center; gap:6px; text-indent:0; overflow:visible; }
.plan_b .content .cart:after{ display:none; }
.plan_b .content .cart .in, .plan_b .content .cart .num{ position:static; }
.plan_b .content .cart:hover,.plan_b .content .cart:active{ background:#eaf1e8; color:var(--pb-green); }
/* 품절 */
.plan_b .content.soldout .cart{ border-color:var(--pb-line); color:var(--pb-weak); background:var(--pb-surface); }
.plan_b .content .v2_halt{ position:absolute; inset:0; background:rgba(255,255,255,.55); display:grid; place-items:center; font-weight:800; color:var(--pb-weak); }

/* ---- 정보성 이미지(상품 없는 이미지 섹션)은 기존 inner>img 규칙으로 전체폭 노출 ---- */

/* ============================================================
 * PC (≥1025px) = 4열 그리드 · 세로 카드 · 사진 hero
 * ============================================================ */
@media (min-width:1025px){
  .plan_b .product_type4{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; align-items:stretch; padding:8px 0 16px; }
  .plan_b .content{ display:flex; flex-direction:column; height:100%; border-radius:16px; }
  .plan_b .content > a:not(.cart){ display:flex; flex-direction:column; }
  .plan_b .content .img_wrap{ width:100%; min-height:0; aspect-ratio:4/3; margin-bottom:12px; }
  .plan_b .content .txt_box{ min-height:0; }
  .plan_b .content .txt_box .title{ font-size:16px; height:45px; margin-bottom:9px; }
  .plan_b .content .txt_box dl.price .won{ font-size:23px; }
  .plan_b .content .cart{ width:100%; height:36px; margin-top:14px; align-self:auto; justify-self:auto; }
  .plan_b .content .cart:hover{ background:#eaf1e8; color:var(--pb-green); }
  .plan_b .tabcon_tt{ font-size:21px; margin:24px 0 14px; }
  .plan_b .pb-coupon{ width:1140px; max-width:100%; margin:20px auto 0; }
  .plan_b .pb-search{ width:1140px; max-width:100%; margin:14px auto 4px; }
  .plan_b .product_type4{ padding-left:0; padding-right:0; }
}

/* ============================================================
 * 판매 1위 배지 (신규 HTML: .content 안에 .pb-rank1 — 이미지 위 절대배치)
 * ============================================================ */
.plan_b .content .pb-rank1{ position:absolute; top:9px; right:9px; z-index:3; display:inline-flex; align-items:center; gap:4px; background:var(--pb-green); color:#fff; font-size:12.5px; font-weight:800; padding:4px 10px; border-radius:8px; box-shadow:0 2px 6px rgba(0,0,0,.18); }

/* ============================================================
 * 쿠폰 다운 토스트 (신규 HTML: .pb-toast, 하단·짧게)
 * ============================================================ */
.plan_b-toast{ position:fixed; bottom:76px; left:50%; transform:translateX(-50%) translateY(14px); width:calc(100% - 28px); max-width:452px; background:#1d271e; color:#fff; padding:13px 16px; border-radius:12px; font-size:15px; font-weight:600; display:flex; align-items:center; gap:9px; box-shadow:0 12px 28px rgba(0,0,0,.28); z-index:2000; opacity:0; transition:.35s; pointer-events:none; }
.plan_b-toast.show{ opacity:1; transform:translateX(-50%) translateY(0); }
.plan_b-toast .ic{ background:var(--pb-accent); width:24px; height:24px; border-radius:50%; display:grid; place-items:center; flex:0 0 auto; font-size:13px; }
@media (min-width:1025px){ .plan_b-toast{ bottom:28px; } }

/* 접근성: 모션 줄이기 존중 */
@media (prefers-reduced-motion:reduce){ .plan_b-toast{ transition:none; } }


/* ============================================================
 * 2026-07-06 v1.2.0 매거진 보강 — 텍스트 히어로 / 코너 매거진 헤더 / 지면 리듬 / 담기 주황 / 1개 코너 중앙
 * ============================================================ */
.plan_b .pb-hero{ background:linear-gradient(135deg,#3d6041,#5f8253); border-radius:16px; padding:32px 28px 28px; color:#fff; margin:6px 3px 6px; }
.plan_b .pb-hero .eb{ font-size:12.5px; letter-spacing:.3em; font-weight:800; color:#cfe0c8; }
.plan_b .pb-hero .tt{ font-family:'Pretendard','Noto Sans KR',sans-serif; font-size:27px; font-weight:700; line-height:1.32; margin:10px 0 16px; color:#fff; }
.plan_b .pb-hero .dt{ display:inline-block; font-size:13px; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.28); border-radius:16px; padding:6px 14px; color:#f2f5ee; }
/* 코너 매거진 헤더: eyebrow(CORNER NN) + 마루부리 + 그린 바 */
.plan_b .event_slider_tab_con{ counter-increment:pbsec; }
.plan_b .tabcon_tt{ font-family:'Pretendard','Noto Sans KR',sans-serif; font-weight:700; color:#2f3a2c; border-bottom:0; }
.plan_b .tabcon_tt::before{ content:"CORNER " counter(pbsec, decimal-leading-zero); display:block; font-family:'Pretendard','Apple SD Gothic Neo','Malgun Gothic',sans-serif; font-size:12.5px; letter-spacing:.28em; font-weight:800; color:#5f8253; margin-bottom:7px; }
.plan_b .tabcon_tt::after{ content:""; display:block; width:38px; height:3px; background:var(--pb-green); margin-top:6px; }
/* 담기 = 주황 알약(모바일 메인후기 담기와 톤 통일) */
.plan_b .content .cart{ background:var(--pb-accent); border:none; color:#3a2700; font-weight:800; }
.plan_b .content .cart:hover, .plan_b .content .cart:active{ background:#e8940f; color:#3a2700; }
.plan_b .content.soldout .cart{ background:var(--pb-surface); color:var(--pb-weak); border:1.5px solid var(--pb-line); }
/* 카드 경계(흰 바닥 위 카드 흐림 방지) */
.plan_b .product_type4 .content{ background:#fff; border:1px solid #eee9db; border-radius:16px; box-shadow:0 2px 10px rgba(70,75,60,.05); padding:10px 10px 12px; }
@media (min-width:1025px){
  .plan_b .pb-hero{ width:1140px; max-width:100%; margin:12px auto 6px; padding:42px 46px 38px; }
  .plan_b .pb-hero .tt{ font-size:34px; }
  .plan_b .tabcon_tt{ font-size:26px; margin:34px 0 18px; }
  .plan_b .event_slider_tab_con{ padding:6px 0 26px; }
  .plan_b .event_slider_tab_con:nth-of-type(even){ background:#f7f7f4; border-radius:18px; padding:6px 26px 30px; }
  .plan_b .product_type4.pb-one{ grid-template-columns:minmax(0,420px); justify-content:center; }
  /* 등록수와 무관하게 실제 카드 1장만 렌더된 코너도 중앙(모던 브라우저) */

}
/* ============================================================
 * 2026-07-06 v1.2.2 카드 이커머스 점검(50-60대 장보기) — 담기 톤다운·정보 위계 보정
 *  - 담기 = 연녹 틴트(이벤트 연관생활재 확정 톤과 통일). 주황(--pb-accent)은 쿠폰·강조 전용 환원
 *  - 구매결정 정보(쿠폰적용가·할인태그·취소선원가) 반 단계 상향, 품절 안내 대비 강화
 * ============================================================ */
.plan_b .content .cart{ background:#fff; border:1.5px solid var(--pb-green); color:var(--pb-green); font-weight:800; }
.plan_b .content .cart:hover, .plan_b .content .cart:active{ background:#eaf1e8; border-color:var(--pb-green); color:var(--pb-green); }
.plan_b .content.soldout .cart{ background:var(--pb-surface); color:var(--pb-weak); border:1px solid var(--pb-line); }
.plan_b .content .txt_box .title{ font-size:16px; line-height:1.42; }
.plan_b .content .img_wrap .tag li{ font-size:12.5px; padding:3px 8px; border-radius:6px; }
.plan_b .content .txt_box .cpnp{ font-size:13.5px; }
.plan_b .content .txt_box .cpnp b{ font-size:16px; }
.plan_b .content .txt_box dl.price .won .sale{ font-size:13px; }
.plan_b .content .v2_halt{ background:rgba(255,255,255,.72); color:#5a5d58; font-size:15px; }
@media (min-width:1025px){
  .plan_b .content .txt_box .title{ font-size:16.5px; height:auto; min-height:46px; }
}
/* v1.2.3: 가격 옆 할인율(pb 한정) — 시니어 인지용, 사진 위 태그와 병행 */
.plan_b .content .txt_box dl.price .pb-dcr{ font-style:normal; font-size:19px; font-weight:900; color:var(--pb-sale); margin-right:7px; font-family:var(--pb-num); }
@media (min-width:1025px){ .plan_b .content .txt_box dl.price .pb-dcr{ font-size:19px; } }
/* v1.2.4: 카드 동일 높이 — 행 내 카드 스트레치 + 담기 버튼 하단 고정 */
@media (min-width:1025px){
  .plan_b .content > a:not(.cart){ flex:1 1 auto; }
  .plan_b .content .txt_box{ padding-bottom:14px; }
  .plan_b .content .cart{ margin-top:auto; }
}
/* ============================================================
 * v1.3.0 — 검색을 탭 줄에 통합(PC 우측 컴팩트) + 1개 카드 코너 = 가로 히어로
 * ============================================================ */
/* v1.3.1: 같은 줄 통합 철회(스와이퍼 폭 간섭·정렬 깨짐) — 탭 줄 원상 복원, 검색 = 탭 바로 아래 우측 컴팩트 */
.plan_b .event_slider_tab .pb-search{ margin:10px 12px 4px; }
@media (min-width:1025px){
  .plan_b .event_slider_tab .pb-search{ width:320px; margin:12px 0 2px auto; padding:10px 14px; }
  .plan_b .event_slider_tab .pb-search input{ font-size:14px; }

  /* 1개 카드 코너: 가로 히어로 — 사진 좌 크게 + 정보 우 + 와이드 담기 */
  .plan_b .product_type4.pb-one{ grid-template-columns:minmax(0,780px); justify-content:center; }
  .plan_b .product_type4.pb-one .content{ display:grid; grid-template-columns:300px minmax(0,1fr); grid-template-rows:1fr auto; gap:8px 30px; align-items:start; padding:18px; height:auto; }
  .plan_b .product_type4.pb-one .content > a:not(.cart){ display:contents; }
  .plan_b .product_type4.pb-one .content .img_wrap{ grid-column:1; grid-row:1/3; width:300px; aspect-ratio:1/1; margin:0; }
  .plan_b .product_type4.pb-one .content .txt_box{ grid-column:2; grid-row:1; padding:10px 0 0; min-height:0; }
  .plan_b .product_type4.pb-one .content .txt_box .title{ font-size:20px; line-height:1.4; min-height:0; margin-bottom:12px; }
  .plan_b .product_type4.pb-one .content .txt_box dl.price .won{ font-size:28px; }
  .plan_b .product_type4.pb-one .content .txt_box dl.price .pb-dcr{ font-size:22px; }
  .plan_b .product_type4.pb-one .content .txt_box dl.price .won .sale{ font-size:15px; }
  .plan_b .product_type4.pb-one .content .cart{ grid-column:2; grid-row:2; align-self:end; justify-self:start; width:auto; min-width:220px; height:52px; margin-top:16px; }
}
/* ============================================================
 * v1.4.0 — 히어로 재구성: 검색 표지 내장 + 탭 밀착(표지+목차 한 카드) + 밴드 장식
 *  (pb-noimg = 마스터 이미지 없는 히어로형에만 적용)
 * ============================================================ */
.plan_b .pb-hero{ position:relative; overflow:hidden; }
.plan_b .pb-hero::before{ content:""; position:absolute; right:-70px; top:-90px; width:300px; height:300px; border-radius:50%; background:rgba(255,255,255,.07); }
.plan_b .pb-hero::after{ content:""; position:absolute; right:110px; bottom:-120px; width:220px; height:220px; border-radius:50%; background:rgba(255,255,255,.05); }
.plan_b .pb-hero > *{ position:relative; z-index:1; }
/* 검색 = 표지 내장(흰 알약) */
.plan_b .pb-hero .pb-search{ background:#fff; border:none; box-shadow:0 6px 18px rgba(15,30,15,.22); max-width:520px; margin:24px 0 0; padding:13px 16px; border-radius:14px; }
.plan_b .pb-hero .pb-search .si{ color:var(--pb-green); }
/* 탭 밀착: 표지 하단에 목차 패널이 붙는 한 카드 구성 */
.plan_b.pb-noimg .pb-hero{ margin-bottom:0; border-radius:16px 16px 0 0; }
.plan_b.pb-noimg .event_visual{ margin:0; padding:0; }
.plan_b.pb-noimg section.inner{ padding-top:0; margin-top:0; }
.plan_b.pb-noimg .event_slider_tab{ background:#fff; border:1px solid #e4e8dc; border-top:0; border-radius:0 0 16px 16px; padding:12px 14px 10px; margin:0 12px 14px; }
@media (min-width:1025px){
  .plan_b.pb-noimg .pb-hero{ margin:12px auto 0; }
  .plan_b.pb-noimg .event_slider_tab{ width:1140px; max-width:100%; margin:0 auto 18px; padding:14px 18px 12px; }
}
/* v1.4.1: 표지 검색 우측 정렬 + 내부 정돈(선형 돋보기 아이콘·완전 알약·플레이스홀더 톤) */
.plan_b .pb-hero .pb-search{ margin:20px 0 0 auto; max-width:400px; border-radius:999px; padding:12px 20px; }
.plan_b .pb-search .si{ font-size:0; width:18px; height:18px; position:relative; flex:none; }
.plan_b .pb-search .si::before{ content:""; position:absolute; left:1px; top:1px; width:11px; height:11px; border:2px solid #5f8253; border-radius:50%; }
.plan_b .pb-search .si::after{ content:""; position:absolute; right:0; bottom:1px; width:7px; height:2.5px; border-radius:2px; background:#5f8253; transform:rotate(45deg); transform-origin:right bottom; }
.plan_b .pb-search input{ font-size:16px; } /* 2026-08-25 15px→16px: iOS는 16px 미만 입력 포커스 시 자동확대 → 확대 잔류 시 하단 고정바(.bottom_menu_wrap)가 화면 중간에 떠 보임(문자 인앱 뷰 실측). PC는 아래 미디어(14.5px)가 덮어 무영향 */
.plan_b .pb-search input::placeholder{ color:#9aa094; }
/* ============================================================
 * v1.5.0 — 이커머스 풍성화(신뢰정보): 생산자·인증·규격·보관온도·한정수량 + 카드 호버 + pb-one 히어로 + 상단 통계
 *  (전부 .plan_b 스코프, pb 게이트 한정 = 기본 화면 무영향)
 * ============================================================ */
/* 보관온도 칩 (사진 우상단) */
.plan_b .content .img_wrap{ position:relative; }
.plan_b .content .pb-temp{ position:absolute; top:8px; right:8px; z-index:2; font-size:12.5px; font-weight:700; color:#fff; background:rgba(29,39,30,.6); border-radius:6px; padding:3px 8px; letter-spacing:-.02em; }
/* 인기 배지(주황) */
.plan_b .content .img_wrap .tag li.bg_o{ background:var(--pb-accent); color:var(--pb-ink); }
/* 생산자/작목반 — 신뢰 핵심(잎 마커 + 그린) */
.plan_b .content .txt_box .pb-farmer{ display:flex; align-items:center; gap:6px; font-size:12.5px; font-weight:700; color:var(--pb-green); margin:0 0 5px; line-height:1.3; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.plan_b .content .txt_box .pb-farmer::before{ content:""; flex:none; width:13px; height:13px; background:var(--pb-green-2); border-radius:0 100% 0 100%; }
/* 인증 + 규격 메타 줄 */
.plan_b .content .txt_box .pb-metarow{ display:flex; align-items:center; flex-wrap:wrap; gap:5px 8px; margin:0 0 9px; }
.plan_b .content .txt_box .pb-cert{ font-size:12.5px; font-weight:700; color:var(--pb-green); background:#eef4ec; border:1px solid #cfe0c8; border-radius:6px; padding:2px 8px; }
.plan_b .content .txt_box .pb-qty{ font-size:12.5px; color:var(--pb-muted); }
/* 조합원 가격 라벨 복원(시니어 위계) */
.plan_b .content .txt_box dl.price:first-of-type dt{ display:inline-block; font-size:12.5px; font-weight:700; color:var(--pb-weak); margin-right:6px; }
/* 한정수량 잔여(희소성, 주황계) */
.plan_b .content .txt_box .pb-limited{ margin-top:5px; font-size:12.5px; font-weight:700; color:var(--pb-cpn); }
.plan_b .content .txt_box .pb-limited b{ color:var(--pb-cpn); font-family:var(--pb-num); font-size:14px; }
/* 상단 통계 칩 */
.plan_b .pb-hero .pb-herometa{ display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.plan_b .pb-hero .pb-herometa .dt{ margin:0; }
.plan_b .pb-hero .pb-herometa .pb-cnt b{ color:#fff; font-size:15px; }

@media (min-width:1025px){
  /* 카드 호버 = 누를 수 있음 신호 */
  .plan_b .content{ transition:box-shadow .18s, transform .18s; }
  .plan_b .content:hover{ box-shadow:0 14px 30px rgba(61,96,65,.16); transform:translateY(-2px); }
  .plan_b .content .img_wrap{ overflow:hidden; }
  .plan_b .content .img_wrap img{ transition:transform .3s; }
  .plan_b .content:hover .img_wrap img{ transform:scale(1.04); }
  /* pb-one 히어로 풍성화 — 빈 우측을 신뢰정보로 채움 */
  .plan_b .product_type4.pb-one .content{ padding:24px 26px; }
  .plan_b .product_type4.pb-one .content .txt_box{ padding:2px 0; }
  .plan_b .product_type4.pb-one .content .txt_box .pb-farmer{ font-size:15px; margin-bottom:9px; }
  .plan_b .product_type4.pb-one .content .txt_box .pb-farmer::before{ width:16px; height:16px; }
  .plan_b .product_type4.pb-one .content .txt_box .title{ font-size:24px; line-height:1.35; margin-bottom:13px; }
  .plan_b .product_type4.pb-one .content .txt_box .pb-metarow{ margin-bottom:15px; gap:7px 10px; }
  .plan_b .product_type4.pb-one .content .txt_box .pb-cert{ font-size:13px; padding:4px 11px; }
  .plan_b .product_type4.pb-one .content .txt_box .pb-qty{ font-size:14px; }
  .plan_b .product_type4.pb-one .content .txt_box .pb-limited{ font-size:14px; margin-top:11px; }
  .plan_b .product_type4.pb-one .content .cart{ margin-top:18px; }
}
/* v1.5.1: pb-one 히어로 — 우측 내용(가격~담기) 수직 중앙 정렬로 빈 여백 정돈 */
@media (min-width:1025px){
  .plan_b .product_type4.pb-one .content{ grid-template-rows:auto auto; align-content:center; }
  .plan_b .product_type4.pb-one .content .img_wrap{ height:300px; align-self:center; }
}
/* ============================================================
 * v1.6.0 — D안(표지=목차): 탭을 그린 히어로 안으로 통합. 검색은 표지 상단 우측, 표지 세로 확장
 *  (pb-noimg = 이미지 없는 히어로형만 / 이미지형은 기존 유지)
 * ============================================================ */
.plan_b.pb-noimg .pb-hero{ position:relative; padding-bottom:20px; }
/* 검색: 표지 상단 우측(탭과 겹침 방지) */
.plan_b.pb-noimg .pb-hero .pb-search{ position:absolute; top:28px; right:28px; margin:0; width:320px; max-width:40%; }
/* 탭 띠 = 그린 표지 연장(고스트 알약) */
.plan_b.pb-noimg .event_slider_tab{ background:linear-gradient(135deg,#3d6041,#5f8253); border:0; border-radius:0 0 16px 16px; padding:2px 18px 18px; }
.plan_b.pb-noimg .event_slider_tab .swiper-slide a{ background:rgba(255,255,255,.16); border:1px solid rgba(255,255,255,.58); color:#fff; font-size:14.5px; font-weight:700; }
.plan_b.pb-noimg .event_slider_tab .swiper-slide a.active{ background:#fff; color:var(--pb-green); border-color:#fff; }
/* 화살표: 흰 박스 제거 → 투명 + 흰 화살표(invert) */
.plan_b.pb-noimg .event_slider_tab .est_menu .est_menu_Prev,
.plan_b.pb-noimg .event_slider_tab .est_menu .est_menu_Next{ background-color:transparent; filter:invert(1); width:44px; }
@media (min-width:1025px){
  .plan_b.pb-noimg .pb-hero{ padding-bottom:24px; }
  .plan_b.pb-noimg .event_slider_tab{ width:auto; max-width:none; margin:0 0 18px; padding:2px 30px 22px; }
}
/* ============================================================
 * v1.6.2 — 조합원 라벨 제거 + 표지 이커머스 배경(그라데이션 메시·스포트라이트)
 * ============================================================ */
/* 가격에서 '조합원' 글씨 제거(라벨 없이 가격만) */
.plan_b .content .txt_box dl.price:first-of-type dt{ display:none; }
/* 표지 배경 = 깊이감 있는 그린 메시(우상단 스포트라이트 + 좌하단 비네트) */
.plan_b .pb-hero{ background:
  radial-gradient(135% 100% at 84% 4%, rgba(255,255,255,.14), rgba(255,255,255,0) 44%),
  radial-gradient(120% 96% at 4% 106%, rgba(0,0,0,.14), rgba(0,0,0,0) 46%),
  linear-gradient(118deg, #315039 0%, #3d6041 50%, #497251 100%); }
/* 탭 띠 = 표지 하단색과 이어지게 */
.plan_b.pb-noimg .event_slider_tab{ background:linear-gradient(118deg, #3d6041 0%, #497251 100%); }
/* ============================================================
 * v1.6.3 — D안 고정(sticky) 상태 대비 복구: 탭이 상단 고정되면 .est_menu 흰배경(style_v2)
 *   → 흰 위에서 읽히도록 회색 알약/그린 active/검정 화살표로 되돌림(고정 상태에서만)
 * ============================================================ */
.plan_b.pb-noimg .event_slider_tab.fixed .swiper-slide a{ background:#fff; border:1px solid var(--pb-line); color:var(--pb-muted); }
.plan_b.pb-noimg .event_slider_tab.fixed .swiper-slide a.active{ background:var(--pb-green); color:#fff; border-color:var(--pb-green); }
.plan_b.pb-noimg .event_slider_tab.fixed .est_menu .est_menu_Prev,
.plan_b.pb-noimg .event_slider_tab.fixed .est_menu .est_menu_Next{ filter:none; background-color:#fff; }
/* ============================================================
 * v1.7.0 — 코너 판매1위(급등) 강조: 왕관 + 골드 테두리 + 맨앞 배치(order)
 * ============================================================ */
.plan_b .content.pb-best{ order:-1; border:1px solid #eee9db; box-shadow:0 2px 10px rgba(70,75,60,.06); background:#fff; }
.plan_b .content.pb-best .pb-crown{ display:none; position:absolute; top:-18px; left:50%; transform:translateX(-50%); z-index:4; width:44px; height:32px; pointer-events:none; }
.plan_b .content.pb-best .pb-crown svg{ width:100%; height:100%; display:block; filter:drop-shadow(0 2px 3px rgba(150,110,10,.35)); }
.plan_b .content.pb-best .pb-rankbadge{ position:absolute; top:10px; left:10px; z-index:3; font-size:12.5px; font-weight:800; color:#fff; background:#3d6041; border-radius:14px; padding:4px 11px; box-shadow:0 2px 6px rgba(0,0,0,.15); }
/* 1위 카드에선 할인/쿠폰 태그를 사진 하단으로(랭크배지와 겹침 방지) */
.plan_b .content.pb-best .img_wrap .tag{ top:auto; bottom:8px; }
/* ============================================================
 * v1.8.0 — 상단·제목 타이포 강화 (히어로 표지감 + 코너 목차감, 왕관 골드 스토리 연장)
 * ============================================================ */
.plan_b .pb-hero .eb{ color:#e9cd8a; letter-spacing:.34em; }
.plan_b .pb-hero .eb::before{ content:""; display:block; width:26px; height:2px; background:linear-gradient(90deg,#e6b84a,#f2d78c); margin-bottom:10px; border-radius:2px; }
.plan_b .pb-hero .tt{ font-size:30px; line-height:1.26; letter-spacing:-0.012em; margin:12px 0 18px; text-shadow:0 2px 14px rgba(10,25,12,.25); }
@media (min-width:1025px){
  .plan_b .pb-hero{ padding:48px 46px 40px; }
  .plan_b .pb-hero .tt{ font-size:44px; }
}
.plan_b .tabcon_tt{ font-size:24px; letter-spacing:-0.01em; }
@media (min-width:1025px){ .plan_b .tabcon_tt{ font-size:28px; } }
.plan_b .tabcon_tt::before{ font-size:12.5px; color:#4a6b4e; }
/* 2026-09-03 PC 영문 아이브로우 정리 — 코너 번호 'CORNER NN' 제거(제목 + 아래 선만 남김).
   PC 전용 스코프(min-width:1025px)로 모바일(plan_view2 모바일 렌더)은 기존 유지. */
@media (min-width:1025px){ .plan_b .tabcon_tt::before{ content:none; display:none; } }
.plan_b .tabcon_tt::after{ width:44px; height:3px; background:linear-gradient(90deg, var(--pb-green) 0%, var(--pb-green) 62%, #e6b84a 62%, #f0cd74 100%); }
.plan_b .tabcon_tt .pb-ccnt{ display:inline-block; vertical-align:6px; margin-left:10px; font-family:'Pretendard','Apple SD Gothic Neo','Malgun Gothic',sans-serif; font-size:12.5px; font-weight:700; color:#5f8253; background:#eef3ea; border-radius:12px; padding:3px 10px; letter-spacing:0; }

/* v1.8.1 — 카드 리뷰 칩(개수·평점, 클릭=상세 후기 이동) */
.plan_b .content .pb-rvline{ display:flex; align-items:center; gap:5px; font-size:12.5px; margin:2px 0 4px; color:#5F6B62; text-decoration:none; }
.plan_b .content .pb-rvline .st{ color:#d99a1e; font-weight:800; }
.plan_b .content .pb-rvline .sep{ color:#5F6B62; }
.plan_b .content .pb-rvline .rc{ font-weight:700; color:#6b7265; }
.plan_b .content .pb-rvline:hover .rc{ text-decoration:underline; color:var(--pb-green); }
/* ============================================================
 * v1.9.0 — 모바일 동일 느낌(히어로·왕관·신뢰정보·리뷰칩 모바일 최적화)
 * ============================================================ */
@media (max-width:1024px){
  .plan_b .pb-hero{ margin:0 0 10px; border-radius:0 0 16px 16px; padding:26px 18px 22px; }
  .plan_b.pb-noimg .pb-hero{ border-radius:0; margin-bottom:0; }
  .plan_b .pb-hero .tt{ font-size:24px; }
  .plan_b.pb-noimg .pb-hero .pb-search{ position:relative; z-index:2; top:auto; right:auto; width:auto; max-width:none; margin:16px 0 0; } /* static이면 히어로 장식원(absolute ::before/::after)이 위에 그려져 클릭 가로챔 - 2026-07-07 수정 */
  .plan_b .content.pb-best .pb-crown{ width:36px; height:26px; top:-14px; }
  .plan_b .content.pb-best .pb-rankbadge{ font-size:12.5px; padding:3px 9px; }
  .plan_b .tabcon_tt{ font-size:21px; }
  .plan_b .tabcon_tt .pb-ccnt{ vertical-align:4px; margin-left:8px; font-size:12.5px; padding:2px 8px; }
  .plan_b .content .pb-rvline{ font-size:12.5px; }
}
/* ============================================================
 * v1.9.1 — 모바일 탭 띠 보정: style_v2 전역(margin:80px/-40px·박스테두리·페이드PNG·fixed 1200px)이
 *   모바일 pb 표지-탭 연결을 깨던 문제. pb 게이트라 기본 화면 무영향.
 * ============================================================ */
@media (max-width:1024px){
  .plan_b .event_slider_tab{ margin:0 0 14px; }
  .plan_b.pb-noimg .event_slider_tab{ margin:0 0 14px; padding:2px 12px 16px; }
  .plan_b .event_slider_tab .est_menu{ padding-top:6px; }
  .plan_b .event_slider_tab .est_menu:before,
  .plan_b .event_slider_tab .est_menu:after{ display:none; }
  .plan_b .event_slider_tab .est_menu .est_menu_box{ border:0; padding:6px 8px; }
  .plan_b .event_slider_tab.fixed{ height:auto; }
  .plan_b .event_slider_tab.fixed .est_menu{ width:100%; left:0; margin-left:0; top:0; }
}
/* ============================================================
 * v1.9.2 — PC 그린 탭 띠 정돈: 알약 둘레 회색 박스테두리(est_menu_box)·좌우 흰 페이드(:before/:after)
 *   제거(모바일 v1.9.1과 동일 조치의 PC 확장 — 표지형 pb-noimg 한정, 이미지형 흰 띠는 원형 유지)
 * ============================================================ */
.plan_b.pb-noimg .event_slider_tab .est_menu:before,
.plan_b.pb-noimg .event_slider_tab .est_menu:after{ display:none; }
.plan_b.pb-noimg .event_slider_tab .est_menu .est_menu_box{ border:0; }
/* ============================================================
 * v1.9.3 — 쿠폰 알림 강화(50~60대 시인성): 하단 구석 소형 → 화면 중앙 상단 대형 카드
 *   딥그린+골드 테두리(왕관 골드 스토리)·17px 굵게·아이콘 확대·5초 유지(JS)
 * ============================================================ */
.plan_b-toast{ bottom:auto; top:16vh; width:calc(100% - 32px); max-width:520px; padding:18px 22px; border-radius:16px; font-size:17px; font-weight:700; line-height:1.45; background:linear-gradient(135deg,#2c4630,#3d6041); border:2px solid #e6b84a; box-shadow:0 18px 44px rgba(15,30,15,.42); transform:translateX(-50%) translateY(-14px); }
.plan_b-toast.show{ transform:translateX(-50%) translateY(0); }
.plan_b-toast .ic{ width:32px; height:32px; font-size:17px; box-shadow:0 2px 8px rgba(0,0,0,.25); }
@media (min-width:1025px){ .plan_b-toast{ bottom:auto; top:140px; max-width:560px; } }

/* ============================================================
 * 2026-07-10 기획전(모바일) 폰트 시안성 — 누적 규칙이 16px로 덮던 것을 최후순위 재정의
 * - 상품명 18.5px(메인과 동일) / 규격 14px / 가격 25px
 * - 좌우 폭 축소: 가로카드 이미지 폭을 줄여 텍스트 열을 넓힘(가독성)
 * 파일 맨 끝 = 캐스케이드 최후순위라 확실히 적용됨. PC 열/레이아웃은 건드리지 않음.
 * ============================================================ */
.plan_b .content .txt_box .title{ font-size:18.5px; line-height:1.36; height:auto; min-height:0; -webkit-line-clamp:2; }
.plan_b .content .txt_box .comf .txt{ font-size:14px; line-height:1.4; }
.plan_b .content .txt_box dl.price .won,
.plan_b .content .txt_box dl.price:first-of-type .won{ font-size:25px; }
.plan_b .content .txt_box dl.price .pb-dcr{ font-size:19px; }
/* 모바일 전용(가로카드): 이미지 좌우폭 132→112px로 줄여 텍스트 공간 확보 */
@media (max-width:1024px){
  .plan_b .content{ grid-template-columns:112px 1fr; gap:6px 13px; padding:11px; }
  .plan_b .content .img_wrap{ width:112px; min-height:112px; }
}

/* 2026-07-29 PC 기획전 컨테이너 확대: 본문 카드가 커진 만큼 전체 폭 1140 -> 1320 (기획전 스코프 한정) */
@media (min-width:1025px){
  .plan_b section.inner{ width:1320px; max-width:calc(100% - 40px); }
  .plan_b .pb-tsband, .plan_b .pb-coupon, .plan_b .pb-search, .plan_b .pb-hero{ width:1320px; }
  .plan_b.pb-noimg .event_slider_tab{ width:1320px; }
}

/* ============================================================
 * v1.9.29 (2026-07-29) 기획전 딥링크(#bookd*) 착지 보정
 * - 고정헤더+고정탭바에 앵커가 가려지지 않도록 scroll-margin-top 확보
 *   (JS 보정 스크롤과 이중화 — 브라우저 기본 앵커점프도 올바른 위치에 정지)
 * - 상품카드 이미지 치수 예약(레이아웃 시프트 억제 → 착지 흔들림 감소)
 * ============================================================ */
[id^="bookd"]{ display:block; scroll-margin-top:100px; }
@media (min-width:1025px){ [id^="bookd"]{ scroll-margin-top:150px; } }
/* 모바일 가로카드 이미지: 로드 전에도 정사각 박스 예약(시프트 최소화) */
@media (max-width:1024px){
  .plan_b .content .img_wrap{ aspect-ratio:1/1; }
}
/* 2026-07-29 모바일: 반짝장터 타이머 하단 ember 바(앞금색/뒤회색)가 좌우 스와이프 인디케이터로 오해됨 → 모바일 숨김. 타이머(카운트다운)로 잔여시간 충분 전달 */
@media (max-width:1024px){ .plan_b .ts_band .ts_ember{ display:none; } }

/* ============================================================
 * v1.10.0 (2026-08-15) 기획전 지면 정돈 — "한 칼럼, 한 리듬"
 *   전 항목 .plan_b 스코프(기획전 B 전용) · A타입(plan_view)·공용 CSS 무영향.
 *   파일 맨 끝 = 캐스케이드 최후순위(이 파일의 기존 관례).
 *
 *   1) 칼럼 통일  : 표지·공급일·검색·탭·반짝장터·코너·카드가 좌우 경계 하나를 공유
 *                  (07-29 컨테이너 1320 확대가 카드(.event_prod>.inner=1140)에는
 *                   닿지 않아 60/120/150 세 갈래 들쭉날쭉 → 표지·카드가 실제 쓰는 1140로 수렴)
 *   2) 탭 띠 여백 : style_v2 `.event_slider_tab{margin:80px 0 -40px}`의 음수 아래여백이
 *                  다음 블록(반짝장터)을 끌어올려 기획전 내 검색창을 덮던 결함 복구
 *   3) 죽은 장식  : `.est_menu:before/:after` = 구 CMS 경로 그라데이션 PNG(404 2건).
 *                  보이지도 않으면서 탭 좌우 가장자리 위에 z-index:2로 얹혀 클릭을 가로챔 → 제거
 *   4) 지면 리듬  : 코너 제목→카드 간격 축소, 코너끼리 분리(PC 띠 패널 / 모바일 여백 정리)
 *   5) 카드 정합  : 판매1위 카드만 할인율 태그가 사진 하단으로 내려가 스캔선이 어긋나던 것을
 *                  다른 카드와 같은 좌상단 열로 복귀(랭크배지 아래 단 정렬)
 *   6) 고정 탭바  : 칼럼 폭에 정렬 + 아래 경계 그림자(카드가 밑으로 미끄러질 때 구분)
 *   7) 공급일 줄  : 라벨=그린 칩 / 날짜=본문 톤, 붙어 있던 "[공급일 기준]날짜" 분리(JSP 동반)
 * ============================================================ */

/* ---- 7) 공급일 기준 줄(표지 상단) : 라벨 칩 + 날짜 ---- */
.plan_b .event_visual .date,
.plan_b .event_view_title .date{ font-size:15px; font-weight:600; color:var(--pb-muted); letter-spacing:-.01em; }
.plan_b .date .lb{ display:inline-block; margin-right:9px; padding:3px 9px; border-radius:6px;
  font-size:12.5px; font-weight:800; letter-spacing:-.01em; color:var(--pb-green);
  background:#eef4ec; border:1px solid #cfe0c8; vertical-align:1px; }
.plan_b .date .roboto{ color:var(--pb-ink); font-weight:700; }

/* ---- 5) 판매1위 카드도 할인/증정/쿠폰 태그를 좌상단 같은 열에(랭크배지 바로 아래) ---- */
.plan_b .content.pb-best .img_wrap .tag{ top:38px; bottom:auto; }

/* ---- 3) 죽은 그라데이션 가상요소(404·클릭 가로챔) 전 유형 제거 ---- */
.plan_b .event_slider_tab .est_menu:before,
.plan_b .event_slider_tab .est_menu:after{ display:none; }

/* ---- 탭 알약 터치 타깃 38 → 44px (시니어 규격). 담기 36px 은 전사 통일값이라 유지 ---- */
.plan_b .event_slider_tab .swiper-slide a{ padding:12px 18px; }

/* ============================ PC ============================ */
@media (min-width:1025px){
  /* 1) 한 칼럼 = 1140 (표지 콘텐츠·상품 그리드가 실제로 쓰는 폭) */
  .plan_b section.inner{ width:1140px; max-width:calc(100% - 40px); }
  .plan_b .pb-tsband,
  .plan_b .pb-coupon{ width:100%; max-width:100%; }
  .plan_b .pb-hero{ width:1140px; max-width:calc(100% - 40px); }
  .plan_b.pb-noimg .event_slider_tab{ width:auto; max-width:none; }
  .plan_b .event_prod > .inner{ width:100%; margin:0; }

  /* 2) 탭 띠 여백 정상화(80/-40 → 균형). 검색창은 JSP에서 탭 위로 분리 = 고정 시 흔들림 없음 */
  .plan_b .event_slider_tab{ margin:26px 0 18px; }
  .plan_b .pb-search{ width:360px; max-width:100%; margin:16px 0 2px auto; padding:11px 16px; }
  .plan_b .pb-search input{ font-size:14.5px; }

  /* 6) 고정 탭바 = 칼럼 폭 정렬 + 경계 */
  .plan_b .event_slider_tab.fixed .est_menu{ width:1140px; margin-left:-570px;
    box-shadow:0 4px 12px rgba(29,39,30,.09); }

  /* 4) 코너 리듬: 제목→카드 68px 공백 축소, 코너끼리 분리 */
  .plan_b .tabcon_tt{ margin:30px 0 4px; }
  .plan_b .event_prod{ margin-top:24px; }
  .plan_b .event_slider_tab_con{ padding:8px 0 30px; }
  .plan_b .event_slider_tab_con:nth-of-type(even){ padding:16px 28px 32px; margin:10px 0; }
}

/* ========================== 모바일 ========================== */
@media (max-width:1024px){
  /* 1) 한 칼럼 = 좌우 20px (카드·코너 제목이 쓰는 거터에 검색·반짝장터·탭을 맞춤) */
  .plan_b .product_type4{ padding:0; }
  .plan_b .tabcon_tt{ margin-left:0; margin-right:0; }
  .plan_b .pb-search{ margin:10px 20px 2px; }
.plan_b .pb-tsband{ margin:0 0 22px; }
  .plan_b .pb-tsband .inner{ width:auto; margin:0; padding:0 16px; }
  .plan_b .event_slider_tab .est_menu .est_menu_box{ padding:6px 20px; }
  /* style_v2 `.event_view_title .date{height:39px;line-height:39px;opacity:.6}` 고정치 해제 —
     라벨 칩이 39px 상자를 넘쳐 바로 아래 표지 이미지에 물리고, opacity .6 이 칩 색을 흐리게 먹였다 */
  .plan_b .event_view_title .date{ height:auto; line-height:1.5; opacity:1; padding:13px 20px 11px; margin:0; }

  /* 4) 코너 리듬: 코너 위 80px 공백 → 정돈(제목이 코너의 시작임을 유지하는 선에서) */
  .plan_b .event_slider_tab_con{ padding:34px 0 6px; }
  .plan_b .tabcon_tt{ margin-top:0; margin-bottom:4px; }

  /* 5) 모바일 카드는 사진이 작아 랭크배지 높이만큼만 내림 */
  .plan_b .content.pb-best .img_wrap .tag{ top:34px; }
  /* 가로카드에선 왕관을 카드 중앙(=글자 위)이 아니라 사진 열 위로 — 왕관·판매1위 배지가 한 덩어리로 읽히게 */
  .plan_b .content.pb-best .pb-crown{ left:67px; }

  /* 6) 고정 탭바 아래 경계(카드가 밑으로 미끄러질 때 구분) */
  .plan_b .event_slider_tab.fixed .est_menu{ box-shadow:0 3px 10px rgba(29,39,30,.10); }
}

/* ---- 딥링크 착지 여유(JS pbTabOffset 과 이중화). 모바일 고정탭바 74 + 여유 ---- */
[id^="bookd"]{ scroll-margin-top:92px; }
@media (min-width:1025px){ [id^="bookd"]{ scroll-margin-top:146px; } }

/* ============================================================
 * v1.11.0 — .jsy30p 감사전 프리미엄 밴드 (2026-08-21)
 *   부여 = plan_view2 인라인 JS: 코너 제목(.tabcon_tt)에 '장수이야기' 또는 '감사전' 포함 시
 *   article.event_slider_tab_con 에 .jsy30p 클래스 + 제목 뒤 '30년 감사' 라벨(span.jsy30p-lb).
 *   래퍼 배경(딥그린+수확 이미지)·헤더 톤만 변경 — 카드 마크업·담기 로직 무변경, 타 코너 회귀 0.
 * ============================================================ */
.plan_b .event_slider_tab_con.jsy30p{
  position:relative;
  background:
    linear-gradient(180deg, rgba(30,47,34,.58) 0, rgba(36,56,41,.86) 300px, #2f4b33 620px),
    url(../../images/comm/jsy30_bg.jpg) top center/100% auto no-repeat,
    #2f4b33;
  border:1px solid rgba(201,162,75,.42);
  border-radius:20px;
  padding:24px 14px 22px;
  margin:14px 0 24px;
  box-shadow:inset 0 1px 0 rgba(233,209,147,.35), 0 12px 30px rgba(22,36,26,.16);
}
.plan_b .event_slider_tab_con.jsy30p::before{
  content:""; position:absolute; left:24px; right:24px; top:10px; height:1px;
  background:linear-gradient(90deg, rgba(201,162,75,0), rgba(201,162,75,.75) 18%, rgba(233,209,147,.9) 50%, rgba(201,162,75,.75) 82%, rgba(201,162,75,0));
}
.plan_b .jsy30p .tabcon_tt{ color:#f6f1e2; }
.plan_b .jsy30p .tabcon_tt::before{ color:#d9b96a; }
.plan_b .jsy30p .tabcon_tt::after{ background:linear-gradient(90deg,#c9a24b 0%,#e9d193 100%); }
.plan_b .jsy30p .tabcon_tt .pb-ccnt{ color:#efe6cd; background:rgba(255,255,255,.13); }
.plan_b .jsy30p .tabcon_tt .pbdg{ background:rgba(201,162,75,.2); color:#f0e3bd; border:1px solid rgba(201,162,75,.55); }
.plan_b .jsy30p .jsy30p-lb{
  display:inline-block; vertical-align:6px; margin-left:10px;
  font-family:'Pretendard','Apple SD Gothic Neo','Malgun Gothic',sans-serif;
  font-size:12.5px; font-weight:800; letter-spacing:.06em; color:#e9d193;
  border:1px solid rgba(201,162,75,.7); background:rgba(201,162,75,.14);
  border-radius:999px; padding:3px 12px; white-space:nowrap;
}
/* [2026-09-04 A5] jsy1692 커스텀 카드(.jsyc-intro/.jsyc-item) 잔여 스타일 제거 — jsy1692.js 미로드(장수이야기=서버렌더 .jsy30p 밴드로 대체)로 해당 마크업 미생성. */
@media (min-width:1025px){
  .plan_b .event_slider_tab_con.jsy30p{ padding:16px 30px 34px; }
  .plan_b .jsy30p .tabcon_tt{ margin-top:26px; }
}
@media (max-width:1024px){
  .plan_b .event_slider_tab_con.jsy30p{ margin:12px 8px 20px; padding:20px 12px 16px; border-radius:16px; }
  .plan_b .event_slider_tab_con.jsy30p::before{ left:16px; right:16px; top:8px; }
  .plan_b .jsy30p .jsy30p-lb{ vertical-align:4px; margin-left:8px; font-size:12.5px; padding:2px 10px; }
}

/* [임시 2026-37주 v1.11.10] 장단콩 고정 배지(신규 출시) — 판매1위 왕관과 별개, 38주 해제 시 제거 */
.plan_b .content.pb-pin .pb-newbadge{ position:absolute; top:10px; left:10px; z-index:3; font-size:12.5px; font-weight:800; color:#3D6041; background:#F7F7F4; box-shadow:inset 0 0 0 1px #C9A24B; border-radius:14px; padding:4px 10px; line-height:1; box-shadow:0 1px 3px rgba(0,0,0,.14); }
.plan_b .content.pb-best.pb-pin .pb-newbadge{ top:40px; }
@media (max-width:767px){ .plan_b .content.pb-pin .pb-newbadge{ font-size:12.5px; padding:3px 9px; } }
/* [임시 2026-37주 v1.11.11] 장단콩 1~2위: .product_type4 는 flex/grid 라 order 로 재배치(JSP 순서 무변경). 택배 4박스(60239) -2, 일반 16팩(60106) -1. 38주 해제 시 제거 */
.plan_b .product_type4 .content.pb-pin{ order:-1; }
.plan_b .product_type4 .content.pb-gift.pb-pin{ order:-2; }
/* [임시 2026-37주] 택배 카드 핀 배지는 '택배예약/할인' 태그 줄 아래로(겹침 방지) */
.plan_b .content.pb-gift.pb-pin .pb-newbadge{ top:40px; }

/* [임시 2026-37주 v1.11.13] 기획전 상단 증정 안내 카드(.pb-notice) — 1697 햇양파 1kg */
.plan_b .pb-notice{ background:#fff8e6; border:1px solid #f1dfa8; border-radius:16px; padding:16px 18px 15px; margin:8px 3px; }
.plan_b .pb-notice .pb-ntt{ font-family:'Pretendard','Noto Sans KR',sans-serif; font-size:20px; font-weight:800; color:#1d271e; line-height:1.3; letter-spacing:-.02em; }
.plan_b .pb-notice .pb-nsub{ margin:6px 0 0; font-size:15px; line-height:1.45; color:#5b5a4a; word-break:keep-all; }
.plan_b .pb-notice .pb-nhow{ margin:10px 0 0; padding-top:10px; border-top:1px dashed #e8d9a8; font-size:14px; line-height:1.5; color:#3d6041; font-weight:600; word-break:keep-all; }
.plan_b .pb-notice .pb-nlim{ display:inline-block; margin-left:8px; color:#b8902e; font-weight:700; }
@media (min-width:768px){ .plan_b .pb-notice{ width:1140px; max-width:100%; margin:16px auto 0; padding:20px 26px 18px; } .plan_b .pb-notice .pb-ntt{ font-size:24px; } }


/* ============================================================
 * v1.11.14 (2026-09-03) PC 코너 카드 = 오아시스 4단 문법
 *   팀장 지시("오아시스 스타일 4단 노출"). 마크업 무변경 = CSS 오버라이드만.
 *   1) 카드 아웃박스 제거 — 배경/테두리/그림자/패딩 0, 사진만 남는다(예약·택배·판매1위 카드 포함)
 *   2) 사진 = 정사각 + 8px 라운드, 담기는 사진 우하단 44px 흰 원형(cat_best .cb-addbtn 규격과 같은 값)
 *   3) 글(생산자·상품명·칩·가격)은 사진 좌측선에 맞춰 맨바닥 — .txt_box 패딩 0
 *   4) 4열 그리드(칼럼 1140 = 카드 268.5 / 열간격 22)
 *   5) 코너 제목 26px/700 좌측정렬 + 제목 아래 전폭 1px #1d271e 선(38px 그린 바 대체),
 *      짝수 코너 회색 띠 해제 = 코너마다 카드 좌측선이 한 줄로 정렬
 *   유지: pb-one(1장 코너 가로 히어로) / pb-pin order(-2,-1) / pb-newbadge / pb-rankbadge /
 *         pb-temp / tag / v2_halt / pb-limited / pb-notice / pb-coupon / 모바일(≤1024) 전부 무변경
 * ============================================================ */
@media (min-width:1025px){
  /* 4) 4열 그리드 — 세로 간격은 카드 박스가 사라진 만큼 넓힌다 */
  .plan_b .product_type4{ grid-template-columns:repeat(4,1fr); gap:36px 22px; }

  /* 1) 카드 = 박스 없음. 사진(1행) + 글(2행) 2단 그리드, 담기는 사진 위 오버레이 */
  .plan_b .product_type4:not(.pb-one) .content{
    display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:auto 1fr;
    background:transparent; border:0; box-shadow:none; padding:0; border-radius:0; height:100%;
  }
  .plan_b .product_type4:not(.pb-one) .content.pb-reserve,
  .plan_b .product_type4:not(.pb-one) .content.pb-gift,
  .plan_b .product_type4:not(.pb-one) .content.pb-best{
    background:transparent; border:0; box-shadow:none;
  }
  /* 상품링크 래퍼 무력화 → img_wrap·txt_box 가 직접 grid 셀 (모바일·pb-one 과 같은 문법) */
  .plan_b .product_type4:not(.pb-one) .content > a:not(.cart){ display:contents; }

  /* 2) 사진 = 정사각 8px 라운드 */
  .plan_b .product_type4:not(.pb-one) .content .img_wrap{
    grid-column:1; grid-row:1; width:100%; min-height:0; aspect-ratio:1/1; margin:0;
    border-radius:8px; overflow:hidden; background:#f5f3ec;
  }

  /* 3) 글 = 사진 좌측선 맨바닥 */
  .plan_b .product_type4:not(.pb-one) .content .txt_box{ grid-column:1; grid-row:2; padding:12px 0 0; }
  .plan_b .product_type4:not(.pb-one) .content .txt_box .title{ font-size:15.5px; line-height:1.45; min-height:45px; margin-bottom:8px; }

  /* 2) 담기 = 사진 우하단 44px 흰 원형(텍스트 '담기'는 시각적으로 숨기고 + 아이콘) */
  .plan_b .product_type4:not(.pb-one) .content .cart{
    grid-column:1; grid-row:1; justify-self:end; align-self:end; z-index:6;
    width:44px; min-width:44px; height:44px; margin:0 8px 8px 0; padding:0;
    border-radius:50%; background:#fff; color:#3D6041; border:1px solid rgba(47,75,51,.10);
    box-shadow:0 2px 8px rgba(31,40,30,.18); font-size:0; line-height:0; overflow:hidden;
  }
  .plan_b .product_type4:not(.pb-one) .content .cart::before{
    content:"+"; display:block; font-size:27px; line-height:1; font-weight:400; color:#3D6041;
    font-family:'Pretendard','Apple SD Gothic Neo','Malgun Gothic',sans-serif; margin-top:-2px;
  }
  .plan_b .product_type4:not(.pb-one) .content .cart:hover,
  .plan_b .product_type4:not(.pb-one) .content .cart:active{
    background:#eaf1e8; color:#3D6041; border-color:rgba(47,75,51,.10);
  }
  .plan_b .product_type4:not(.pb-one) .content.soldout .cart{ background:#fff; border:1px solid rgba(47,75,51,.10); }

  /* 5) 코너 제목 = 26px/700 좌측정렬 + 전폭 1px 선 */
  .plan_b .tabcon_tt{
    font-size:26px; font-weight:700; color:#1d271e; text-align:left;
    margin:46px 0 18px; padding:0 0 12px; border-bottom:1px solid #1d271e;
  }
  .plan_b .tabcon_tt::after{ display:none; }
  /* 짝수 코너 회색 띠 해제(카드 좌측선 정렬) */
  .plan_b .event_slider_tab_con:nth-of-type(even):not(.jsy30p){ background:transparent; padding:8px 0 30px; margin:0; }
}

/* [v1.11.16 2026-09-03] 코너 제목 앞 'CORNER 01' 영문 번호 — 모바일도 제거(PC와 통일, 팀장 지시) */
.plan_b .tabcon_tt::before { content: none !important; }

/* [v1.11.17 2026-09-03] 기획전 상단 반짝장터 밴드 — 금빛 라디얼 워시 제거, 흰 바탕 + 1px #e9e4d8, 카드 플랫(메인과 동일 문법) */
.plan_b .ts_band{ background:#fff; border:1px solid #e9e4d8; }
.plan_b .ts_band::before{ display:none; }
.plan_b .ts_band .ms4_prod_wrap .swiper-slide{ background:transparent; border:0; border-radius:0; box-shadow:none; padding:0; } /* 기획전 밴드 카드는 .dcz 없음 */
.plan_b .ts_band .ms4_prod_wrap .img_wrap{ border-radius:8px; overflow:hidden; background:#f5f3ec; }
.plan_b .ts_band .ms4_prod_wrap .txt_box{ padding:12px 2px 6px; background:transparent; }
.plan_b .ts_band .ms4_prod_wrap .tag .bg_y{ font-size:15px; padding:4px 9px; border-radius:8px; min-width:0; height:auto; line-height:1.2; }



/* ============================================================
 * v1.11.21 (2026-09-05) QC D42 — PC 콘텐츠 열 1160 통일
 *   표준 = gnbp_flat4.css:19 "1160 콘텐츠 열"(1440에서 x 140~1300).
 *   기획전만 본문이 1140(150~1290)이고 상단 안내 바(planSwipeComm .plsw-pcbar)는
 *   1200/안쪽 1176(132~1308) 이라, 한 화면 안에서 좌우선이 세 갈래로 갈렸다.
 *   마크업 무변경 = 폭 값만. PC(>=1025) 전용, 모바일 무접촉.
 *   plan_swipe.css 는 무수정 — .plan_b 스코프 오버라이드로만 세운다.
 *   롤백 = 이 블록 삭제.
 * ============================================================ */
@media (min-width:1025px){
  .plan_b .inner,
  .plan_b .event_title,
  .plan_b .pb-coupon,
  .plan_b .pb-search,
  .plan_b .pb-hero,
  .plan_b .pb-notice,
  .plan_b.pb-noimg .event_slider_tab{ width:1160px; max-width:100%; }
  .plan_b .event_visual .date{ width:1160px; }
  /* L659 .plan_b section.inner{width:1140px} = (0,2,1) 로 그룹 규칙(0,2,0)보다 세다 — 같은 특정도로 뒤에서 덮는다(본문 열) */
  .plan_b section.inner{ width:1160px; }
  /* 표지 검색은 히어로 안 우측 정렬(v1.4.1) 유지 */
  .plan_b .pb-hero .pb-search{ width:auto; }
  /* 상단 기획전 안내 바 = 본문과 같은 1160 열 */
  .plan_b #plswPcbar{ width:1160px; max-width:100%; margin-left:auto; margin-right:auto; padding-left:0; padding-right:0; }
  .plan_b #plswPcbar .plsw-pcbar-inner{ width:100%; max-width:none; }
}

/* ============================================================
 * v1.11.23 (2026-09-06) 기획전 상단 탭 · 반짝장터 밴드 · 썸네일 규격 정돈
 *   팀장 지적 원문 : "기획전 내 타임세일 디자인 및 썸네일 크기, 상단에 탭 — 디자인적으로 수정"
 *
 *   [진단 — 신데브 1697 실측]
 *   T1 밴드 바탕이 PC/모바일 반대. 모바일 style_v2.css 끝줄
 *      `.main_section4.ts_band{background:…#3D6041… !important}` 가 v1.11.17(09-03 "흰 바탕")을
 *      !important 로 덮어 모바일만 딥그린. 그런데 글자색은 흰 바탕 전제(#1d271e)라
 *      카운트다운 "11:56" 이 딥그린 위 먹색 = 대비 약 1.5:1(사실상 안 보임),
 *      라벨(#8a8f86 2.3:1) · "지금 담으면 조합원가"(b=#1d271e) 도 같은 증상.
 *   T2 골드(#B8902E/#D9B84A)가 콜론·초·일수·ember 바에 흩어져 강조가 3갈래.
 *      (규격 = 빨강은 할인율 1종, 금색은 별점 전용 → 밴드는 흰색·딥그린 계열)
 *   T3 썸네일 크기 불일치.
 *      · 모바일 : 코너 카드 112x150.6(정사각 지정이 align-self:stretch 에 밀려 세로로 늘어남)
 *                vs 밴드 카드 152x152 + 라운드 14px(코너는 8px) → 밴드만 36% 크고 더 둥굶.
 *      · PC     : 코너 273.5 vs 밴드 236.7(좌 340 타이머 패널이 카드 열을 좁힘) → 밴드만 13% 작음.
 *   T4 상단 탭 : 띠 높이 80.2px 인데 알약은 44px(=36px 죽은 여백),
 *      style_v2 `.est_menu .swc_tab{padding:0 80px 0 0}` 로 모바일 가시폭이 350→270 (80px 공백),
 *      잘림 힌트 없음, 비활성 글자 #565A57(먹 아님)·테두리 #D8D8D8(헤어라인 아님),
 *      PC 고정(sticky) 바가 width:1140/margin-left:-570 = v1.11.21 의 1160 열과 10px 어긋남.
 *
 *   [조치] 전 항목 .plan_b 스코프 · CSS 만(마크업·JS 무변경) · style_v2.css 무접촉.
 *   롤백 = 이 블록 삭제.
 * ============================================================ */

/* ---------- ③ 상단 탭 (섹션 이동) ---------- */
/* 띠 = 크림 바닥. 표지형(pb-noimg = 그린 히어로 연장)은 더 센 특정도 규칙이 이미 있어 무영향 */
.plan_b .event_slider_tab{ background:#F7F7F4; }
.plan_b .event_slider_tab .est_menu{ padding-top:0; }
.plan_b .event_slider_tab .est_menu .est_menu_box{ border:0; }
/* 띠 높이 80 → 60 : 알약 44 + 상하 8. (알약 자체 margin 9px 이 높이를 키우던 주범)
   좌우 패딩은 건드리지 않는다 — PC 는 60px 이 화살표 자리라 줄이면 알약이 화살표 밑으로 들어간다 */
.plan_b .event_slider_tab .swiper-slide a{ margin:0; }
.plan_b .event_slider_tab .est_menu .est_menu_box{ padding-top:8px; padding-bottom:8px; }
/* 죽은 우측 80px 제거 + 오른쪽 페이드 = "더 있음" 잘림 힌트(가상요소 아님 → 클릭 가로챔 0) */
.plan_b .event_slider_tab .est_menu .swc_tab{ padding-right:0;
  -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 34px), rgba(0,0,0,0) 100%);
          mask-image:linear-gradient(90deg,#000 calc(100% - 34px), rgba(0,0,0,0) 100%); }
/* 비활성 = 먹 글자 + 헤어라인 / 활성 = 딥그린 채움 + 흰 글자 */
.plan_b .event_slider_tab .swiper-slide a{ color:#1D271E; background:#fff; border-color:#DFE5DC; font-weight:600; }
.plan_b .event_slider_tab .swiper-slide a.active{ background:#3D6041; border-color:#3D6041; color:#fff; font-weight:700; }
/* 화살표(PC) = 흰 박스 → 띠와 같은 크림 */
.plan_b .event_slider_tab .est_menu .est_menu_Prev,
.plan_b .event_slider_tab .est_menu .est_menu_Next{ background-color:#F7F7F4; border:0; }
.plan_b .event_slider_tab .est_menu .est_menu_Prev:hover,
.plan_b .event_slider_tab .est_menu .est_menu_Next:hover{ background-color:#EFEFE9; }
/* 고정(sticky) 상태 = 같은 크림 + 헤어라인 경계(카드가 밑으로 미끄러지는 구분) */
.plan_b .event_slider_tab.fixed .est_menu{ background:#F7F7F4; border-bottom:1px solid #DFE5DC; }
.plan_b .event_slider_tab.fixed .est_menu .est_menu_Prev,
.plan_b .event_slider_tab.fixed .est_menu .est_menu_Next{ background-color:#F7F7F4; }
@media (min-width:1025px){
  .plan_b .event_slider_tab{ border-radius:14px; }
  /* v1.11.21 이 본문 열을 1160 으로 올렸는데 고정 바만 1140/-570 로 남아 10px 어긋나 있었다.
     max-width 를 함께 쓰려면 margin-left 중앙정렬이 깨지므로 transform 중앙정렬로 바꾼다. */
  .plan_b .event_slider_tab.fixed .est_menu{ width:1160px; max-width:calc(100% - 40px);
    margin-left:0; transform:translateX(-50%); border-radius:0 0 14px 14px;
    box-shadow:0 6px 16px rgba(29,39,30,.08); }
}
@media (max-width:1024px){
  .plan_b .event_slider_tab .est_menu .est_menu_box{ padding-left:20px; padding-right:0; }
  .plan_b .event_slider_tab.fixed .est_menu{ box-shadow:0 3px 10px rgba(29,39,30,.08); }
}

/* ---------- ② 코너 카드 썸네일 = 정사각 복원(모바일) ----------
 * .img_wrap 은 grid-row:1/3 + align-self:stretch 라 글 열 높이만큼 세로로 늘어나
 * 112x150.6 이 되고 object-fit:cover 가 사진을 세로로 잘라냈다.
 * → 정사각 복원은 아래 v1.11.24(모바일 2열 전환)에서 사진이 열 폭 전부를 쓰는 형태로 마무리한다. */

/* ---------- ① 반짝장터 밴드 = 딥그린 예외 구간 ---------- */
/* 바탕 : PC·모바일 통일. 모바일 style_v2 의 !important 를 이기려면 여기도 !important 가 필요 */
.plan_b .pb-tsband.ts_band{
  background:linear-gradient(180deg,#3D6041 0%,#33513A 100%) !important;
  border:0 !important; border-radius:0; overflow:hidden;
}
.plan_b .pb-tsband.ts_band::before{ display:none !important; }
/* 글자 = 흰색 계열 한 갈래(골드 제거) */
.plan_b .pb-tsband .ts_panel{ color:#fff; }
.plan_b .pb-tsband .ts_eyebrow{ color:#fff; font-weight:700; }
.plan_b .pb-tsband .ts_eyebrow .ts_spark{ color:#fff; opacity:.7; }
.plan_b .pb-tsband .ts_deadline{ color:rgba(255,255,255,.82); }
.plan_b .pb-tsband .ts_deadline b{ color:#fff; font-weight:700; }
.plan_b .pb-tsband .ts_count{ color:#fff; text-shadow:none; }
.plan_b .pb-tsband .ts_count .ts_num{ color:#fff; }
.plan_b .pb-tsband .ts_count .ts_days{ color:#fff; }
.plan_b .pb-tsband .ts_count .ts_colon{ color:rgba(255,255,255,.5); }
.plan_b .pb-tsband .ts_count .ts_sec{ color:#fff; }
.plan_b .pb-tsband .ts_count_lab{ color:rgba(255,255,255,.7); }
.plan_b .pb-tsband .ts_tag{ color:rgba(255,255,255,.82); }
.plan_b .pb-tsband .ts_tag b{ color:#fff; font-weight:700; }
.plan_b .pb-tsband .ts_ember{ display:none; }   /* 금색 진행바 = 좌우 스와이프로 오해(07-29 모바일 조치)를 PC 까지 확장 */
.plan_b .pb-tsband .ts_note{ background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.3); color:#fff; }

/* ---- 모바일 : 밴드 = 전폭 그린 띠, 카드 = 코너와 같은 2열·같은 썸네일(사진이 카드 폭을 꽉 채움) ---- */
@media (max-width:1024px){
  .plan_b .pb-tsband .inner{ padding:0 20px; }   /* 코너 카드와 같은 20px 거터 = 좌우선 1개 */
  /* 개수(1/2/3+)에 따라 솔로·2열·2열그리드로 갈리던 것을 2열 한 문법으로 통일.
     예전 2열은 흰 카드 안쪽 8px 여백 때문에 사진이 152 였다 → 카드 여백 0 = 사진이 열 폭(약 170) 전부. */
  .plan_b .pb-tsband .pb-tsrail,
  .plan_b .pb-tsband .pb-tsrail.ts-duo,
  .plan_b .pb-tsband .pb-tsrail.ts-multi{
    display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 10px;
    overflow:visible; padding:0; margin-top:16px; }
  .plan_b .pb-tsband .pb-tsrail.ts-solo{ display:block; overflow:visible; padding:0; margin-top:16px; }
  .plan_b .pb-tsband .pb-tsrail .pcard{
    flex:none; width:100%; display:flex; flex-direction:column; overflow:hidden;
    border:0; border-radius:12px; box-shadow:0 4px 14px rgba(12,26,14,.16); padding:0; }
  .plan_b .pb-tsband .pb-tsrail .imwrap{ flex:none; width:100%; padding:0; }
  /* card_flat_m.css 가 .cfm-ph 에 border-radius:8px !important 를 박는다(그 파일은 다른 단위 소유·무접촉).
     사진이 카드의 윗면 자체가 되는 형태라 카드 라운드(12)를 따라야 해서 여기서만 !important 로 덮는다. */
  .plan_b .pb-tsband .pb-tsrail .imwrap{ border-radius:12px 12px 0 0 !important; }
  .plan_b .pb-tsband .imwrap img{ width:100%; height:auto; aspect-ratio:1/1; border-radius:0; }
  .plan_b .pb-tsband .imwrap .tags{ top:8px; left:8px; }
  .plan_b .pb-tsband .imwrap .halt{ inset:0; border-radius:0; }
  .plan_b .pb-tsband .pcard .body{ padding:10px 10px 12px; }
  /* 1장 = 전폭 가로카드(썸네일 크기는 2열과 같은 열 폭 유지) */
  .plan_b .pb-tsband .pb-tsrail.ts-solo .pcard{ flex-direction:row; align-items:stretch; }
  .plan_b .pb-tsband .pb-tsrail.ts-solo .imwrap{ flex:0 0 48%; width:48%; border-radius:12px 0 0 12px !important; }
  .plan_b .pb-tsband .pb-tsrail.ts-solo .body{ flex:1 1 auto; min-width:0; justify-content:center; }
  /* 활자 = 모바일 2열 표준(.pgrid 실측: 제목 17 / 할인 16 / 가격 21 / 규격칩 12.5) */
  .plan_b .pb-tsband .pcard .nm{ font-size:17px; font-weight:700; line-height:1.38; }
  .plan_b .pb-tsband .pcard .metatop .farmer{ font-size:13px; }
  .plan_b .pb-tsband .pb-tsrail.ts-multi .pcard .pr .now,
  .plan_b .pb-tsband .pb-tsrail.ts-duo .pcard .pr .now,
  .plan_b .pb-tsband .pcard .pr .now{ font-size:19px; }
  .plan_b .pb-tsband .pb-tsrail.ts-multi .pcard .pr .dc,
  .plan_b .pb-tsband .pb-tsrail.ts-duo .pcard .pr .dc,
  .plan_b .pb-tsband .pcard .pr .dc{ font-size:15px; }
  .plan_b .pb-tsband .pb-tsrail.ts-multi .pcard .pr .won,
  .plan_b .pb-tsband .pb-tsrail.ts-duo .pcard .pr .won,
  .plan_b .pb-tsband .pcard .pr .won{ font-size:13px; }
  .plan_b .pb-tsband .pb-tsrail.ts-multi .pcard .pr .old,
  .plan_b .pb-tsband .pb-tsrail.ts-duo .pcard .pr .old,
  .plan_b .pb-tsband .pcard .pr .old{ font-size:12.5px; }
  .plan_b .pb-tsband .pcard .pr{ margin-bottom:0; gap:4px; }
  .plan_b .pb-tsband .ts_note{ margin:14px 0 0; }
}

/* ---- PC : 타이머 = 상단 헤더 1줄 / 카드 = 코너와 같은 4열 ---- */
@media (min-width:1025px){
  .plan_b .pb-tsband.ts_band{ border-radius:16px; padding:28px 0 32px; }
  /* style_v2 `.main_section4.ts_band .inner{grid-template-columns:340px 1fr}` 해제 —
     좌 340 패널이 카드 열을 746 으로 좁혀 썸네일이 코너보다 13% 작았다 */
  .plan_b .pb-tsband .inner{ display:block; padding:0 18px; }
  .plan_b .pb-tsband .ts_panel{
    display:grid; grid-template-columns:auto auto 1fr; align-items:end; column-gap:34px;
    padding-bottom:18px; margin-bottom:20px; border-bottom:1px solid rgba(255,255,255,.2); }
  .plan_b .pb-tsband .ts_eyebrow{ grid-column:1; grid-row:1; align-self:end; }
  .plan_b .pb-tsband .ts_deadline{ grid-column:1; grid-row:2; margin:5px 0 0; }
  .plan_b .pb-tsband .ts_count{ grid-column:2; grid-row:1; margin:0; }
  .plan_b .pb-tsband .ts_count_lab{ grid-column:2; grid-row:2; margin-top:5px; }
  .plan_b .pb-tsband .ts_tag{ grid-column:3; grid-row:1/3; justify-self:end; align-self:center; margin:0; font-size:15px; }
  .plan_b .pb-tsband .ts_note{ margin:18px 0 0; }
  /* 카드 폭 = 코너 4열 카드와 같게(268 vs 273.5, 오차 2%). 개수가 4 미만이면 열수를 개수에 맞추고
     가운데로 모은다 — 4열 고정으로 두면 그린 바닥 위에 빈 칸이 통째로 드러난다 */
  .plan_b .pb-tsband .ms4_prod_wrap.tspc-cnt .swiper-wrapper{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important; gap:26px 14px; }
  .plan_b .pb-tsband .ms4_prod_wrap.tspc-cnt[data-cnt="1"] .swiper-wrapper{
    grid-template-columns:minmax(0,268px) !important; justify-content:center; }
  .plan_b .pb-tsband .ms4_prod_wrap.tspc-cnt[data-cnt="2"] .swiper-wrapper{
    grid-template-columns:repeat(2,minmax(0,268px)) !important; justify-content:center; }
  .plan_b .pb-tsband .ms4_prod_wrap.tspc-cnt[data-cnt="3"] .swiper-wrapper{
    grid-template-columns:repeat(3,minmax(0,268px)) !important; justify-content:center; }
  /* 그린 바닥 위에서는 카드가 흰 상자여야 읽힌다(v1.11.17 은 흰 밴드 전제의 플랫 카드였다) */
  .plan_b .pb-tsband .ms4_prod_wrap .swiper-slide{
    display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:auto 1fr;
    background:#fff; border:0; border-radius:14px; padding:8px; box-shadow:0 6px 18px rgba(12,26,14,.18); }
  .plan_b .pb-tsband .ms4_prod_wrap.tspc-cnt .swiper-slide > a:first-child{ display:contents; }
  .plan_b .pb-tsband .ms4_prod_wrap .img_wrap{ grid-column:1; grid-row:1; border-radius:8px; }
  .plan_b .pb-tsband .ms4_prod_wrap .txt_box{ grid-column:1; grid-row:2; padding:10px 2px 2px; }
  /* 담기 = 코너 카드와 같은 사진 우하단 44px 원형 */
  .plan_b .pb-tsband .ms4_prod_wrap.tspc-cnt .swiper-slide .cart{
    grid-column:1; grid-row:1; justify-self:end; align-self:end; z-index:6; position:static;
    width:44px; min-width:44px; height:44px; margin:0 8px 8px 0; padding:0; line-height:0;
    border-radius:50%; background:#fff; color:#3D6041; border:1px solid rgba(47,75,51,.10);
    box-shadow:0 2px 8px rgba(31,40,30,.18); font-size:0; overflow:hidden; }
  .plan_b .pb-tsband .ms4_prod_wrap.tspc-cnt .swiper-slide .cart::before{
    display:block !important; content:"+"; font-size:27px; line-height:1; font-weight:400; color:#3D6041;
    font-family:'Pretendard','Apple SD Gothic Neo','Malgun Gothic',sans-serif; margin-top:-2px; }
  .plan_b .pb-tsband .ms4_prod_wrap.tspc-cnt .swiper-slide .cart:hover{ background:#eaf1e8; }
}

/* ============================================================
 * v1.11.24 (2026-09-06) 코너(섹션) 시작 경계선 + 썸네일 한 단계 확대 — 팀장 추가 지시 2건
 *   1) "기획전 내 섹션에는 줄이 들어가야 하지 않아? 각 섹션 시작 부분에"
 *      → 코너(article.event_slider_tab_con)마다 시작 헤어라인 #DFE5DC 1px + 위 여백 26~34px.
 *        배경이 다른 구간(반짝장터 그린 밴드 다음 = 첫 코너 / 감사전 .jsy30p 밴드와 그 다음 코너)은
 *        배경 전환 자체가 경계이므로 선을 넣지 않는다.
 *   2) "기획전 내 썸네일 조금 더 커도 되지 않아?"
 *      → 모바일 = 가로형(사진 112) 폐지, 2열 그리드 + 사진이 열 폭을 꽉 채우는 정사각(약 170).
 *        PC   = 4열 유지, 열 간격 22→16 으로 좁혀 사진 273.5→278. 반짝장터 카드도 여백 0 = 사진 268~272.
 *        활자는 모바일 2열 표준(.pgrid 실측: 제목 17 / 할인 16 / 가격 21 / 원 14.5 / 칩 12.5)에 맞춘다.
 *   롤백 = 이 블록 삭제.
 * ============================================================ */

/* ---------- 1) 코너 시작 경계 ---------- */
.plan_b .event_slider_tab_con{ border-top:1px solid #DFE5DC; }
.plan_b .event_slider_tab_con:first-of-type,
.plan_b .event_slider_tab_con.jsy30p,
.plan_b .event_slider_tab_con.jsy30p + .event_slider_tab_con{ border-top:0; }
@media (min-width:1025px){
  /* v1.11.14 의 :nth-of-type(even):not(.jsy30p) 규칙(0,4,0)이 padding 을 잡고 있어 같은 특정도로 뒤에서 덮는다 */
  .plan_b .event_slider_tab_con:not(.jsy30p),
  .plan_b .event_slider_tab_con:nth-of-type(even):not(.jsy30p){ padding-top:34px; margin-top:0; }
  .plan_b .tabcon_tt{ margin-top:0; }
}
@media (max-width:1024px){
  .plan_b .event_slider_tab_con:not(.jsy30p){ padding-top:26px; }
}

/* ---------- 2-PC) 코너 4열 = 열 간격 22→16 (사진 273.5 → 278) ---------- */
@media (min-width:1025px){
  .plan_b .product_type4{ gap:36px 16px; }
  /* 반짝장터 카드도 여백 0 = 사진이 카드 폭 전부(268~272 ≥ 260). 사진은 카드 윗면이라 카드 라운드를 따른다 */
  .plan_b .pb-tsband .ms4_prod_wrap.tspc-cnt .swiper-wrapper{ gap:26px 16px; }
  .plan_b .pb-tsband .ms4_prod_wrap.tspc-cnt[data-cnt="1"] .swiper-wrapper{ grid-template-columns:minmax(0,272px) !important; }
  .plan_b .pb-tsband .ms4_prod_wrap.tspc-cnt[data-cnt="2"] .swiper-wrapper{ grid-template-columns:repeat(2,minmax(0,272px)) !important; }
  .plan_b .pb-tsband .ms4_prod_wrap.tspc-cnt[data-cnt="3"] .swiper-wrapper{ grid-template-columns:repeat(3,minmax(0,272px)) !important; }
  .plan_b .pb-tsband .ms4_prod_wrap .swiper-slide{ padding:0; border-radius:12px; overflow:hidden; }
  .plan_b .pb-tsband .ms4_prod_wrap .img_wrap{ border-radius:12px 12px 0 0; }
  .plan_b .pb-tsband .ms4_prod_wrap .txt_box{ padding:11px 12px 13px; }
}

/* ---------- 2-MO) 코너 카드 = 2열 그리드 · 사진이 열 폭 전부(정사각 8px) ---------- */
@media (max-width:1024px){
  .plan_b .product_type4{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
    gap:24px 10px; padding:0; margin:0; align-items:start; }
  /* 카드 상자 해제 — card_flat_m.js 가 .cfm-card 를 못 붙여도 같은 결과가 되도록 여기서도 명시 */
  .plan_b .product_type4 .content,
  .plan_b .product_type4 .content.pb-best,
  .plan_b .product_type4 .content.pb-reserve,
  .plan_b .product_type4 .content.pb-gift{
    display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:auto 1fr; gap:0;
    background:transparent; border:0; box-shadow:none; border-radius:0; padding:0; height:100%; align-items:start; }
  .plan_b .product_type4 .content > a:not(.cart){ display:contents; }
  .plan_b .product_type4 .content .img_wrap{ grid-column:1; grid-row:1; width:100%; height:auto;
    min-height:0; aspect-ratio:1/1; align-self:start; margin:0; border-radius:8px; overflow:hidden; background:#f5f3ec; }
  .plan_b .product_type4 .content .txt_box{ grid-column:1; grid-row:2; min-height:0; padding:10px 0 0; }
  .plan_b .product_type4 .content .cart{ grid-column:1; grid-row:1; justify-self:end; align-self:end; }
  /* 활자 = 모바일 2열 표준 */
  .plan_b .content .txt_box .title{ font-size:17px; line-height:1.4; margin:0 0 7px; min-height:0; }
  .plan_b .content .txt_box .pb-farmer{ font-size:13px; margin-bottom:4px; }
  .plan_b .content .txt_box .comf{ margin-top:5px; }
  .plan_b .content .txt_box .comf .txt{ font-size:12.5px; padding:2px 7px; }
  .plan_b .content .txt_box dl.price{ flex-wrap:nowrap; white-space:nowrap; margin-top:5px; }
  /* 6자리 가격(취소선 136,000원 + 119,600 원)까지 170px 열에서 한 줄 nowrap 유지 = 실측 160 < 166 */
  .plan_b .content .txt_box dl.price .pb-dcr{ font-size:15px; margin-right:4px; }
  .plan_b .content .txt_box dl.price .won,
  .plan_b .content .txt_box dl.price:first-of-type .won{ font-size:20px; }
  .plan_b .content .txt_box dl.price .won .sale{ font-size:12.5px; margin-right:2px; }
  .plan_b .content .txt_box .cpnp{ font-size:12.5px; }
  .plan_b .content .txt_box .cpnp b{ font-size:14px; }
  .plan_b .content .txt_box .pb-limited{ font-size:12.5px; }
  /* 판매1위 카드: 사진이 열 폭 전부라 왕관 좌표 보정(가로카드 시절 left:67px)을 원복 */
  .plan_b .content.pb-best .pb-crown{ left:50%; }
}

/* ============================================================
 * 2026-09-07 v1.11.26 큰글씨(시스템 폰트 확대) 가격줄 안전화 — 팀장 실기기 스크린샷(75,60|0 원 · 1|0%)
 *  - 숫자 토큰(할인율·판매가·정가) 내부 절단 금지, 토큰 사이에서만 줄바꿈(flex-wrap)
 *  - 순서 고정: 할인율 → 판매가(+원) → 정가 (JSP 마크업 순서 무관, 모바일/PC 통일)
 *  - '원' 접미는 JSP에서 .wsuf 로 판매가 span 안에 묶음(익명 텍스트노드가 홀로 줄바꿈되던 문제)
 * ============================================================ */
.plan_b .content .txt_box dl.price .won{ display:flex; flex-wrap:wrap; align-items:baseline; column-gap:5px; row-gap:0; white-space:nowrap; flex:1 1 auto; min-width:0; }
.plan_b .content .txt_box dl.price .won > *{ flex:0 0 auto; white-space:nowrap; word-break:keep-all; overflow-wrap:normal; }
.plan_b .content .txt_box dl.price .won > .pb-dcr{ order:1; margin-right:0; }
.plan_b .content .txt_box dl.price .won > .roboto:not(.sale){ order:2; }
.plan_b .content .txt_box dl.price .won > .sale{ order:3; margin-left:0; }
.plan_b .content .txt_box dl.price .won .wsuf{ font-size:.72em; font-weight:700; }

/* ============================================================
 * 2026-09-17 v1.11.27 PC 담기 아이콘 '+' → 사이트 공통 장바구니 아이콘 (사용자 지시)
 *  - 코너 카드(v1.11.14)·반짝장터 카드(pb-tsband) 의 44px 원형 담기 안 '+'(::before 글자)를 걷고
 *    메인 메가 담기(category_v2 .catz-add)·ngv2 와 같은 딥그린 카트 SVG 21px 로 바꾼다.
 *  - 원형 크기·위치·그림자·hover 는 기존 그대로. 1장 코너(pb-one)·모바일 무변경.
 *  - 담기 불가(.bbvz-off) 회색 카트는 basket_block_view.css 공통 목록이 담당.
 *  롤백 = 이 블록 삭제.
 * ============================================================ */
@media (min-width:1025px){
  .plan_b .product_type4:not(.pb-one) .content .cart,
  .plan_b .pb-tsband .ms4_prod_wrap.tspc-cnt .swiper-slide .cart{
    background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233D6041' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4h2.2l2.1 11.2a1.6 1.6 0 0 0 1.6 1.3h8.5a1.6 1.6 0 0 0 1.6-1.3L21 8H6'/%3E%3Ccircle cx='9.6' cy='20' r='1.4'/%3E%3Ccircle cx='17.4' cy='20' r='1.4'/%3E%3C/svg%3E");
    background-position:center; background-size:21px 21px; background-repeat:no-repeat;
  }
  .plan_b .product_type4:not(.pb-one) .content .cart::before,
  .plan_b .pb-tsband .ms4_prod_wrap.tspc-cnt .swiper-slide .cart::before{ content:none !important; display:none !important; }
}