/* 샘플 2 테마(.theme_b) — 모바일 기준 간격 · 글자 규칙 (10/21). 옛 이름 lush.css → theme.css (10/29) */

/* ---------- 글자 — 러쉬: Pretendard, 자간 -0.02em, 제목 700 · 이름표 500 · 본문 400 ---------- */
.theme_b,.theme_b *:not(svg):not(svg *){letter-spacing:-.02em!important}
.theme_b{color:#222}

/* ---------- 섹션 간격 — 러쉬: 섹션 사이 60 (10/30 팀장 「영역이 확실히 나뉘게」 48→60) · 제목 18px 굵게 줄 27 · 설명 14px · 내용까지 20 ---------- */
.theme_b #content .hs,.theme_b #content .flow_isc > section{margin-top:60px!important}
.theme_b #content .hs_band{padding-top:48px!important;padding-bottom:48px!important;margin-top:60px!important}
.theme_b #content .hs_band + .hs{margin-top:60px!important}
.theme_b #content .hs + .flow_isc > section:first-child{margin-top:60px!important}
.theme_b #content .flow_isc > section:last-child{margin-bottom:60px!important}
.theme_b #content .lq.hs{margin-top:0!important}
.theme_b .tit_area{margin-bottom:20px!important}
.theme_b .tit_area h2,.theme_b .flow_isc .tit_area h2{font-size:18px!important;font-weight:700!important;line-height:27px!important;color:#222!important}
.theme_b .tit_area h2 .txt_sub{font-size:14px;font-weight:400;line-height:21px;color:#222}
.theme_b .btn_more{font-size:13px;font-weight:500;color:#757575}

/* ---------- 메인 배너 (main__vis) ---------- */
.lv{container-type:inline-size;position:relative;overflow:hidden;background:#fff}
.lv .slide_list{gap:0!important;padding:0 5.7333cqw!important;transition:transform .8s ease}
.lv .slide_item{width:88.5333cqw!important;flex:0 0 auto;padding:4.2667cqw 1.6cqw 0;border-radius:0!important;background:none!important;color:#fff}
.lv_card{container-type:inline-size;position:relative;display:block;aspect-ratio:320/409;border-radius:16px;overflow:hidden;background:#e9eaec;transition:transform .3s}
/* 러쉬 실제 값(10/21 다시 잼): 양옆 장은 0.9531배, 왼쪽 장은 오른쪽 기준 · 오른쪽 장은 왼쪽 기준으로 줄어 옆 카드가 11.6px 보임. 0.3초 */
.lv .slide_item{transition:transform .3s}
.lv .slide_item:not(.is_on){transform:scale(.9531);transform-origin:26.57% 50%}
.lv .slide_item.is_before{transform-origin:73.43% 50%}
/* 바탕: 같은 사진을 흐리게 꽉 채우고, 그 위에 강아지 사진을 조금 작게 위쪽에 둔다 → 글이 강아지 아래 색 바탕에 앉는다 */
.lv_card .lv_full{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .3s ease-in-out}
.lv_card .dd{position:absolute;z-index:2;display:block;line-height:0;filter:drop-shadow(0 1px 2px rgba(0,0,0,.12))}
.lv_card .lv_ph{position:absolute;z-index:1;left:12%;top:0;width:76%;height:auto;-webkit-mask-image:radial-gradient(ellipse 52% 50% at 50% 44%,#000 58%,transparent 98%);mask-image:radial-gradient(ellipse 52% 50% at 50% 44%,#000 58%,transparent 98%);transition:transform .3s ease-in-out}
.lv_card .hand{position:absolute;z-index:3;font-family:"Gaegu",cursive;font-weight:700;font-size:8cqw;line-height:1.05;color:#fff;letter-spacing:0!important}
.lv_card .deco{position:absolute;z-index:2;display:block;font-style:normal;line-height:0}
.lv_card .prd{position:absolute;z-index:2;filter:drop-shadow(0 2cqw 2.4cqw rgba(0,0,0,.18))}
/* 아래만 아주 살짝 어둡게  + 글자에 옅은 그림자 */
.lv_card::after{content:"";position:absolute;z-index:2;inset:auto 0 0;height:50%;background:linear-gradient(to bottom,rgba(var(--scrim),0),rgba(var(--scrim),.5) 60%,rgba(var(--scrim),.72));pointer-events:none}
.lv_txt{position:absolute;z-index:3;text-shadow:0 0 14px rgba(0,0,0,.22),0 1px 2px rgba(0,0,0,.18);left:50%;top:80cqw;width:90.625cqw;transform:translateX(-50%);text-align:center}
.lv_tit{display:block;margin-bottom:8px;font-size:22px;font-weight:700;line-height:33px;color:#fff}
.lv_desc{display:block;font-size:14px;font-weight:500;line-height:21px;color:#fff}
/* 꼬리표(브로치) — 러쉬: 장 칸 기준 오른쪽 5.867vw · 위 2.133vw(카드 위로 8px 튀어나옴), 52px 네모 · 아래 4px · 11px 600.
   가운데 장에서만 위에서 아래로 펼쳐짐(clip-path 0.3초, 0.2초 뒤), 옆 장에서는 안 보임 */
.lv .slide_item{position:relative}
.lv_tags{position:absolute;z-index:4;top:2.1333cqw;right:5.8667cqw}
.lv_tag{display:flex;align-items:center;justify-content:center;overflow:hidden;width:13.8667cqw;height:13.8667cqw;margin-bottom:1.0667cqw;padding:1.3333cqw;border-radius:1.0667cqw;border:1px solid var(--pc);background:#fff;color:var(--pc);font-style:normal;font-size:2.9333cqw;font-weight:600;line-height:3.7333cqw;letter-spacing:-.1173cqw!important;text-align:center;word-break:keep-all;clip-path:polygon(0 0,100% 0,100% 0,0 0);transition:clip-path .3s ease-out .2s}
.lv_tag:last-child{margin-bottom:0}
.lv_tag.type_fill{background:var(--pc);color:#fff}
.lv .slide_item.is_on .lv_tag{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}
.lv_ctrl{position:absolute;z-index:3;left:50%;bottom:20px;transform:translateX(-50%);display:flex;align-items:center;gap:2px}
.lv_ctrl .slide_count{position:static!important;display:block;min-width:40px;height:18px;padding:0 8px;border-radius:9px;background:rgba(34,34,34,.25)!important;color:rgba(255,255,255,.5);font-size:10px;font-weight:500;line-height:18px;text-align:center;white-space:pre}
.lv_ctrl .slide_count b{font-weight:500;color:#fff}
.lv_ctrl .btn_pause{position:relative;width:44px;height:44px;margin:-13px -11px -13px -13px;background:none;border:0;display:grid;place-items:center}
.lv_ctrl .btn_pause::before{content:"";position:absolute;width:18px;height:18px;border-radius:50%;background:rgba(34,34,34,.25)}
.lv_ctrl .btn_pause svg{position:relative;width:10px;height:10px;fill:none;stroke:#fff;stroke-width:3;stroke-linecap:round}
.lv_ctrl .btn_pause .i_play{display:none;fill:#fff;stroke:none}
.lv_ctrl .btn_pause[aria-pressed="true"] .i_pause{display:none}
.lv_ctrl .btn_pause[aria-pressed="true"] .i_play{display:block}
/* 배너 아래 다시 온 손님 카드와 간격 */

/* ---------- 카테고리 (main__quick) — 위 24 · 아래 32 · 줄 사이 10 · 칸 사이 6 ---------- */
.lq{padding:24px 0 32px;background:#fff}
.lq_row{display:flex;gap:6px;padding:0 20px;overflow-x:auto;scrollbar-width:none}
.lq_row::-webkit-scrollbar{display:none}
.lq_row + .lq_row{margin-top:10px}
.lq_row li{flex:0 0 auto;list-style:none}
.lq_chip{position:relative;display:flex;align-items:center;gap:4px;min-height:44px;padding:4px 14px 4px 8px;border:1px solid #eee;border-radius:4px;background:#fff;color:#222;transition:border-color .2s}
.lq_ic{display:block;width:32px;height:32px}
.lq_ic svg{display:block;width:100%;height:100%}
.lq_tit{font-size:13px;font-weight:500;line-height:13px;white-space:nowrap}
.lq_badge{position:absolute;top:-1px;right:-1px;padding:0 4px;height:16px;border-radius:0 4px 0 4px;background:var(--pc);color:#fff;font-style:normal;font-size:10px;font-weight:700;line-height:16px}
.lq_chip:has(.lq_badge){padding-right:22px}
.lq_chip:active{border-color:#949494}
@media (hover:hover){.lq_chip:hover{border-color:#949494}}

/* ---------- 기획전 (main__fresh4) ---------- */
.lf4_sec .tit_area{margin-bottom:0!important;padding:0 20px}
.lf4_desc{margin:4px 0 20px;padding:0 20px;font-size:14px;font-weight:400;line-height:21px;color:#222}
.lf4{container-type:inline-size;position:relative;overflow:hidden}
.lf4 .slide_list{gap:0!important;padding:0 0 0 18px!important;transition:transform .3s ease}
.lf4 .slide_item{position:relative;width:calc(90.4cqw + 4px)!important;flex:0 0 auto;padding:0 2px;border-radius:0!important;color:#fff}
.lf4_media{position:relative;display:block;aspect-ratio:339/335;border-radius:4px;overflow:hidden;background:#222}
.lf4_media::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(rgba(0,0,0,.15),rgba(0,0,0,.8))}
.lf4_media img,.lf4_media video{width:100%;height:100%;object-fit:cover;animation:lf4Move 14s ease-in-out infinite alternate}
@keyframes lf4Move{from{transform:scale(1) translate(0,0)}to{transform:scale(1.14) translate(-2%,-2%)}}
.lf4_arrow{position:absolute;z-index:2;top:16px;right:20px;width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,.28);display:grid;place-items:center}
.lf4_arrow svg{width:16px;height:16px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.lf4_txt{position:absolute;z-index:2;left:18px;right:18px;bottom:24px}
.lf4_tag{display:inline-block;margin-bottom:8px;padding:0 6px;height:18px;border-radius:2px;background:var(--pc);color:#fff;font-style:normal;font-size:11px;font-weight:700;line-height:18px}
.lf4_txt b{display:block;margin-bottom:0;font-size:18px;font-weight:700;line-height:27px}
.lf4_txt span{display:block;font-size:14px;font-weight:400;line-height:21px}
.lf4 .slide_count{display:none}
.lf4_prd{margin:16px 0 20px;padding:0 20px}
.lf4_set{display:grid;gap:8px}
.lf4_set[hidden]{display:none}
.lf4_mini{display:flex;align-items:center;gap:16px;color:#222}
.lf4_mini .th{position:relative;flex:0 0 80px;height:80px;background:#f6f6f6;overflow:hidden;display:grid;place-items:center}
.lf4_mini .th img{width:84%;height:84%;object-fit:contain;transition:transform .3s ease-in-out}
.lf4_mini .th .kit_packs{width:90%;height:70%}
.lf4_mini .tx{display:flex;flex-direction:column;min-width:0}
.lf4_mini b{margin-bottom:2px;font-size:13px;font-weight:400;line-height:19px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lf4_mini small{margin-bottom:8px;font-size:12px;line-height:18px;color:#757575}
.lf4_mini em{font-style:normal;font-size:13px;font-weight:600;line-height:19px}
.lf4_btn{display:flex;align-items:center;justify-content:center;height:44px;margin:0 20px;border:1px solid #dbdbdb;border-radius:2px;color:#222;font-size:13px;font-weight:500;transition:border-color .2s}
.lf4_btn:active{border-color:#949494}
@media (hover:hover){.lf4_btn:hover{border-color:#949494}}

/* ---------- 마우스 · 누름 반응 — 러쉬: 사진 1.1배(0.3초 ease-in-out) · 글 버튼 누르면 흐리게 0.6 · 채운 버튼 0.8 ---------- */
.theme_b .thumb,.theme_b .prd_thumb{overflow:hidden}
.theme_b .thumb img,.theme_b .prd_thumb img,.theme_b .bs_band img,.theme_b .box_donate img{transition:transform .3s ease-in-out}
@media (hover:hover){
  .theme_b .prd_card:hover .thumb img,.theme_b .prd_card:hover .prd_thumb img,.lf4_mini:hover .th img{transform:scale(1.1)}
  .lv .slide_item.is_on:hover .lv_card .lv_ph,.lv .slide_item.is_on:hover .lv_card .lv_full{transform:scale(1.05)}
  .theme_b .btn_more:hover,.theme_b .isc_more:hover,.theme_b .footer_link button:hover{text-decoration:underline;text-underline-offset:3px}
}
.theme_b .btn_more:active,.theme_b .isc_more:active,.theme_b .footer_link button:active,.lg_guest:active,.lg_pill:active{opacity:.6}
.theme_b .btn:active,.lg_kakao:active{opacity:.8}
.theme_b .tab_pill button{transition:background-color .2s,border-color .2s,color .2s}

/* ---------- 푸터 로고 띠 ---------- */
.theme_b .footer{margin-top:48px;background:#f6f6f6}
.ft_brand{display:flex;overflow:hidden;height:72px;margin:-28px calc(var(--gut) * -1) 28px;background:#fff}
.ft_brand ul{display:flex;flex:0 0 auto;align-items:center;gap:16px;padding-right:16px;animation:ftFlow 36s linear infinite}
.ft_brand:hover ul{animation-play-state:paused}
.ft_brand li{list-style:none;flex:0 0 auto;display:grid;place-items:center;min-width:104px;height:32px}
.ft_brand img{height:22px;width:auto;opacity:.55;filter:grayscale(1)}
.ft_word{font-size:15px;font-weight:800;color:#9a9a9a;white-space:nowrap}
@keyframes ftFlow{to{transform:translateX(-100%)}}

/* ---------- 로그인 (모든 샘플 공통 화면) ---------- */
.lg{min-height:calc(100vh - 52px);background:#f6f6f6;text-align:center;display:flex;flex-direction:column}
.lg_top{padding-top:4px;font-size:22px;font-weight:700;line-height:32px;letter-spacing:-.02em;color:#222}
.lg_pill{align-self:center;margin-top:16px;display:inline-flex;align-items:center;height:30px;padding:0 14px;border:1px solid #949494;border-radius:500px;background:#fff;color:#222;font-size:13px;font-weight:500;letter-spacing:-.02em;position:relative}
.lg_pill::after{content:"";position:absolute;inset:-7px 0}
.lg_flow{position:relative;height:258px;margin-top:32px;overflow:hidden;-webkit-mask-image:linear-gradient(#000 70%,transparent);mask-image:linear-gradient(#000 70%,transparent)}
.lg_flow ul{display:flex;flex-direction:column;gap:10px;padding:0 48px;animation:lgFlow 16s linear infinite}
.lg_flow li{display:flex;align-items:center;gap:12px;height:70px;padding:0 20px;border-radius:10px;background:#fff;text-align:left}
.lg_flow .ph{flex:0 0 40px;width:40px;height:40px;border-radius:50%;overflow:hidden;background:#eee}.lg_flow .ph img{width:100%;height:100%;object-fit:cover}
.lg_flow small{display:block;font-size:11px;font-weight:500;line-height:17px;color:#757575}
.lg_flow b{display:block;font-size:13px;font-weight:500;line-height:19px;color:#222}
@keyframes lgFlow{to{transform:translateY(calc(-50% - 5px))}}
.lg_panel{flex:1;margin-top:-1px;padding:44px 32px 40px;background:#fff;position:relative}
.lg_tip{position:absolute;left:50%;top:6px;transform:translateX(-50%);padding:8px 8px;border-radius:5px;background:#222;color:#fff;font-size:11px;line-height:11px;white-space:nowrap;box-shadow:0 0 4px rgba(0,0,0,.04);animation:lgTip 1.3s ease-in-out infinite alternate}
.lg_tip::after{content:"";position:absolute;left:50%;bottom:-5px;margin-left:-5px;border:5px solid transparent;border-bottom:0;border-top-color:#222}
.lg_tip em{font-style:normal;font-weight:700;color:color-mix(in srgb,var(--pc-raw) 45%,#fff)}
@keyframes lgTip{to{transform:translate(-50%,-4px)}}
.lg_kakao{display:flex;align-items:center;justify-content:center;gap:0;position:relative;height:48px;border-radius:4px;background:#fee500;color:#191600;font-size:14px;font-weight:600}
.lg_kakao svg{position:absolute;left:20px;width:22px;height:22px}
.lg_or{display:flex;align-items:center;gap:8px;margin:24px 0 12px;font-size:12px;line-height:28px;color:#757575}
.lg_or::before,.lg_or::after{content:"";flex:1;height:1px;background:#eee}
.lg_round{display:flex;justify-content:center;gap:24px}
.lg_round a{display:grid;place-items:center;width:44px;height:44px;border:1px solid #dbdbdb;border-radius:50%;background:#fff;transition:border-color .2s}
.lg_round a:active{border-color:#949494}
@media (hover:hover){.lg_round a:hover{border-color:#949494}}
.lg_round svg{width:20px;height:20px}
.lg_guest{margin-top:28px;min-height:44px;padding:0 8px;background:none;border:0;font-size:12px;color:#757575}
.lg_note{margin-top:8px;font-size:11px;line-height:17px;color:#757575}

@media (prefers-reduced-motion:reduce){
  .lf4_media img,.lf4_media video,.ft_brand ul,.lg_flow ul,.lg_tip{animation:none!important}
  .lv_tag{transition:none!important}
}
#wrap:has(.lg) .header_sub,#wrap:has(.lg) #container{background:#f6f6f6}
.theme_b #content .lq + .hs,.theme_b #content .lq + .hs_band{margin-top:0!important}

/* ---------- 밸런스키트 페이지 맨 위 포스터 (레퍼런스 GOOD DOG DAYS, 736 × 920에서 잰 비율) ---------- */
.kp{container-type:inline-size;position:relative;overflow:hidden;background:#0074E0;color:#f3ece1;min-height:153cqw}
.kp_top{position:relative;z-index:4;display:flex;justify-content:space-between;padding:5cqw 5cqw 0;font-size:3.2cqw;font-weight:700;letter-spacing:.02em!important}
.kp_word{position:absolute;z-index:1;left:13cqw;top:9cqw;margin:0;font-family:"Pretendard Variable",Pretendard,sans-serif;font-size:25cqw;font-weight:900;line-height:31cqw;letter-spacing:-.035em!important;color:#f3ece1}
.kp_word span:not(.blind){display:block}
.kp_pk{position:absolute;z-index:2;height:auto;filter:drop-shadow(0 2.6cqw 2.4cqw rgba(0,30,80,.35))}
.kp_info{position:absolute;z-index:3;left:13cqw;top:103cqw;width:44cqw}
.kp_lb{font-size:3cqw;font-weight:600;letter-spacing:.04em!important}
.kp_price{margin-top:.6cqw;padding-bottom:1.6cqw;border-bottom:1px solid rgba(243,236,225,.55);font-size:6.4cqw;font-weight:800}
.kp_desc{margin-top:1.8cqw;font-size:3cqw;font-weight:500;line-height:1.45}
.kp_feat{position:absolute;z-index:3;left:8cqw;right:8cqw;bottom:3.4cqw;display:grid;grid-template-columns:repeat(4,1fr);gap:1.6cqw;padding-top:3cqw;border-top:1px solid rgba(243,236,225,.45)}
.kp_feat li{display:flex;align-items:center;gap:1.2cqw;list-style:none;font-size:2.9cqw;font-weight:600;line-height:1.3;white-space:nowrap}
.kp_feat svg{flex:0 0 4.6cqw;width:4.6cqw;height:4.6cqw}
.theme_b #content .lq.hs{padding:24px 0 32px!important}
.theme_b .bv_strip{aspect-ratio:335/96}
.theme_b .lq_row{padding:0 7.3333%;overflow:visible}
.theme_b .lq_row li{flex:1 1 0;min-width:0}
.theme_b .lq_chip{justify-content:flex-start;padding:4px 6px 4px 8px}
.theme_b .lq_chip:has(.lq_badge){padding-right:6px}
/* 상품 카드 사진 60% · 가운데 (10/21) */
.prd_card .thumb:not(.type_kit){display:flex;align-items:center;justify-content:center}
.prd_card .thumb:not(.type_kit) img{width:100%;height:100%;object-fit:cover} /* 10/29 팀장: 썸네일은 상자에 가운데 꽉 — 60%로 띄우던 것 뺌 */
.prd_card .thumb:not(.type_kit) img.img_cut{width:92%;height:92%;object-fit:contain}

/* ---------- 같은 단계 버튼 통일 (10/21) ----------
   ① 섹션 맨 아래 「전체 보기」 버튼: 러쉬 article__btn 하나로 — 높이 44 · 둥글기 2 · 테두리 #dbdbdb · 13px 500 · 화살표 없음
   ② 섹션 안 분류 고르기(베스트 분류 · 브랜드): 알약 하나로 — 높이 32(누르는 곳 44) · 고른 것은 포인트색 채움
   ③ 제목 옆 「더보기」: 글자는 그대로, 누르는 곳만 44 */
.theme_b .isc_more,.theme_b .lf4_btn{display:flex;align-items:center;justify-content:center;gap:0;height:44px;margin:20px 20px 0;border:1px solid #dbdbdb;border-radius:2px;background:none;color:#222;font-size:13px;font-weight:500}
.theme_b .isc_more i{display:none}
.theme_b .lf4_btn{margin-top:0}
.theme_b .bs_tabs{gap:6px;margin:0 0 16px;padding:0 20px;border:0;overflow-x:auto;scrollbar-width:none}
.theme_b .bs_tabs::-webkit-scrollbar{display:none}
.theme_b .bs_tabs button,.theme_b .tab_pill button{position:relative;flex:none;height:32px;padding:0 14px;border:1px solid #dfe2e6;border-radius:99px;background:#fff;color:#555;font-size:13px;font-weight:400}
.theme_b .bs_tabs button[aria-selected=true],.theme_b .tab_pill button.on{background:var(--pc-raw);border-color:var(--pc-raw);color:#fff;font-weight:600}
.theme_b .bs_tabs button[aria-selected=true]::after{display:none}
.theme_b .bs_tabs button::before,.theme_b .tab_pill button::before{content:"";position:absolute;inset:-6px -3px}
.theme_b .tab_pill{padding-bottom:16px}
.theme_b .btn_more{position:relative}
.theme_b .btn_more::before{content:"";position:absolute;inset:-12px -8px}
/* 맞춤 · 무료 배지 — 러쉬 N 배지처럼 칸 안 정렬에 끼어들지 않게 칸 바깥 위 모서리에 걸친 작은 알약 (10/21) */
.theme_b .lq_badge{top:-8px;right:6px;height:16px;padding:0 6px;border-radius:99px;font-size:10px;line-height:16px}
.theme_b .lq_chip:has(.lq_badge){padding-right:6px}
.lv_card .lv_full[src*="bnr-kit-grass"]{top:-7%;height:107%}

/* 상품 이름 굵게 · 할인율은 상품이 나오는 모든 곳에 같은 모양으로 (10/21) */
.prd_card .name,.lf4_mini b,.search_result .prd_name,.prd_item .prd_name{font-weight:700!important}
.sale_price{display:block}
.sale_price s{display:block;font-size:12px;line-height:1.3;color:#8a9099}
.sale_price .now{display:block;font-size:14px}
.sale_price em{margin-right:4px;font-style:normal;font-weight:800;color:var(--pc)}
.sale_price b{font-size:16px;font-weight:800;font-variant-numeric:tabular-nums}
.sale_price.type_mini s{font-size:11px}
.sale_price.type_mini .now{font-size:13px}
.sale_price.type_mini b{font-size:13px}
.sale_price.type_detail s{font-size:14px}
.sale_price.type_detail .now{font-size:18px}
.sale_price.type_detail em{font-size:22px}
.sale_price.type_detail b{font-size:24px}
.lf4_mini small{margin-bottom:4px}
/* 메인 배너 꼬리표(브로치) — 어떤 사진 · 포인트색에도 어울리게 블랙그레이 (10/21)
   위: 숯색 채움 + 흰 글 · 아래: 흰 바탕 + 숯색 글 · 테두리 없이 아주 옅은 그림자, 모서리 조금 더 둥글게 */
.lv_tag{border:0;border-radius:6px;background:#fff;color:#2b2d31;font-weight:700;box-shadow:0 2px 6px rgba(0,0,0,.12)}
.lv_tag.type_fill{background:#2b2d31;color:#fff}
/* 아이콘 메뉴 위아래 — 배지가 칸 위로 8px 튀어나와 위가 좁아 보이던 것: 눈에 보이는 간격(배너 → 배지 끝, 칸 끝 → 다음 섹션)을 둘 다 32로 (10/21) */
.theme_b #content .lq.hs{padding:40px 0 32px!important}
.theme_b .lq_row + .lq_row{margin-top:10px}
/* 아이콘 메뉴 배지도 블랙그레이로 — 어떤 포인트색에도 어울리게 */
.theme_b .lq_badge{background:#2b2d31;color:#fff}

/* ===== 글자 크기 — 쇼핑몰 · 웹 가독성 기준으로 올림 (10/21) =====
   단계: 가장 작은 글(배지 · 꼬리표 · 안내) 12 / 보조 글(브랜드 · 분류 · 정가) 13 / 버튼 · 칩 · 아이콘 이름 14 /
         본문 · 상품 이름 · 설명 15 / 가격 17 / 카드 제목 20 / 섹션 제목 20 / 배너 제목 24.  자간 -0.02em 그대로 */
.theme_b{font-size:15px}
/* 섹션 제목 */
.theme_b .tit_area h2,.theme_b .flow_isc .tit_area h2{font-size:20px!important;line-height:28px!important}
.theme_b .tit_area h2 .txt_sub{font-size:15px;line-height:22px}
.theme_b .btn_more{font-size:14px}
/* 메인 배너 */
.lv_tit{font-size:24px;line-height:34px}
.lv_desc{font-size:15px;line-height:22px}
.lv_tag{font-size:12px!important;line-height:15px}
.lv_ctrl .slide_count{min-width:46px;height:22px;border-radius:11px;font-size:12px;line-height:22px}
.lv_ctrl .btn_pause::before{width:22px;height:22px}
/* 아이콘 메뉴 — 이름 14px가 칸에 들어가게 아이콘 30 */
.theme_b .lq_tit{font-size:14px;line-height:16px}
.theme_b .lq_ic{width:30px;height:30px}
.theme_b .lq_badge{height:18px;padding:0 7px;font-size:12px;line-height:18px;top:-9px}
/* 버튼 · 칩 · 알약 */
.theme_b .isc_more,.theme_b .lf4_btn{height:48px;font-size:15px}
.theme_b .bs_tabs button,.theme_b .tab_pill button{height:36px;padding:0 16px;font-size:14px}
.theme_b .chip,.theme_b .filter_grp button,.theme_b .filter_list button{font-size:14px}
/* 기획전 */
.lf4_desc{font-size:15px;line-height:22px}
.lf4_tag{height:20px;line-height:20px;font-size:12px}
.lf4_txt b{font-size:20px;line-height:29px}
.lf4_txt span{font-size:15px;line-height:22px}
.lf4_mini b{font-size:15px;line-height:21px}
.lf4_mini small{font-size:13px;line-height:19px}
.sale_price.type_mini s{font-size:13px}
.sale_price.type_mini .now,.sale_price.type_mini b{font-size:16px}
/* 상품 카드 */
.theme_b .prd_card .brand{font-size:13px}
.theme_b .prd_card .name{font-size:15px;line-height:21px;height:42px}
.theme_b .prd_card .price s,.theme_b .sale_price s{font-size:13px}
.theme_b .prd_card .price .now,.theme_b .sale_price .now{font-size:15px}
.theme_b .prd_card .price b,.theme_b .sale_price b{font-size:17px}
.theme_b .prd_card .ship{font-size:13px}
.theme_b .prd_card .flag{font-size:12px}
.theme_b .prd_card .tags i{font-size:12px}
/* 목록 · 검색 · 상세 */
.theme_b .grp_label{font-size:13px}
.theme_b .prd_item .prd_brand,.theme_b .prd_brand{font-size:13px}
.theme_b .prd_item .prd_name{font-size:15px}
.theme_b .txt_note_label{font-size:12px}
/* 아래 탭바 · 푸터 */
.theme_b .tabbar a,.theme_b .tabbar button{font-size:12px}
.theme_b .footer{font-size:14px}
.theme_b .footer .txt_safe,.theme_b .footer .txt_safe button{font-size:13px}
.ft_word{font-size:16px}
/* 띠 배너 안 작은 스티커 */
.theme_b .bv_strip .bnr_oval{font-size:12px!important}
/* 밸런스키트 포스터 — 작은 글을 12~14px로 */
.kp_top{font-size:3.6cqw}
.kp_lb{font-size:3.6cqw}
.kp_price{font-size:7cqw}
.kp_desc{font-size:3.7cqw}
.kp_feat li{font-size:3.3cqw}
.kp{min-height:160cqw}
/* 로그인 (모든 샘플 공통 화면) */
.lg_top{font-size:24px;line-height:34px}
.lg_pill{height:36px;font-size:14px}
.lg_flow small{font-size:12px;line-height:18px}
.lg_flow b{font-size:15px;line-height:21px}
.lg_flow li{height:76px}
.lg_tip{font-size:12px;line-height:12px}
.lg_kakao{height:52px;font-size:16px}
.lg_or{font-size:13px}
.lg_guest{font-size:14px}
.lg_note{font-size:12px;line-height:18px}
.theme_b .tab_bar a{font-size:12px}
/* 밸런스키트 페이지 안 휴대폰 · 카드 그림 속 글도 12px 아래로 내려가지 않게 */
.theme_b .lf_phone .bar,.theme_b .lf_phone .who,.theme_b .lf_phone .price,.theme_b .lf_phone li,.theme_b .lf_float .fc_out li,.theme_b .lf_phone .tag{font-size:12px}
.theme_b .lf_float dt,.theme_b .lf_float dd{font-size:13px}
.theme_b .btn_icon .num{font-size:12px}
.theme_b .lf_float .pk{font-size:12px}
/* 메인 배너 홍보 문구 더 크게 (10/21) — 제목 30 · 설명 17, 글 시작은 카드 위에서 76% */
.lv_tit{font-size:30px;line-height:39px;font-weight:800;margin-bottom:8px}
.lv_desc{font-size:17px;line-height:24px;font-weight:600}
.lv_txt{top:76cqw!important}

/* 따뜻한 한끼 배너 — 사진 카드 모음 (레퍼런스 National Puppy Day) */
.lv_pc{position:absolute;z-index:1;width:31cqw;height:33cqw;border-radius:3.4cqw;overflow:hidden;box-shadow:0 1.2cqw 3cqw rgba(0,0,0,.08)}
.lv_pc img{width:100%;height:100%;object-fit:cover;object-position:50% 30%}
.lv_pc.type_cut img{position:absolute;left:8%;bottom:0;width:84%;height:92%;object-fit:contain;object-position:50% 100%}
.lv_burst{position:absolute;z-index:3;left:6cqw;top:71cqw;display:flex;flex-direction:column;align-items:center;justify-content:center;width:19cqw;height:19cqw;color:#2b2d31;font-size:3.6cqw;font-weight:700;line-height:1.1;transform:rotate(-12deg);
  background:#ffd93b;clip-path:polygon(50% 0,58% 10%,70% 4%,73% 16%,86% 14%,84% 27%,96% 30%,89% 41%,100% 50%,89% 59%,96% 70%,84% 73%,86% 86%,73% 84%,70% 96%,58% 90%,50% 100%,42% 90%,30% 96%,27% 84%,14% 86%,16% 73%,4% 70%,11% 59%,0 50%,11% 41%,4% 30%,16% 27%,14% 14%,27% 16%,30% 4%,42% 10%)}
.lv_burst b{font-size:4.6cqw;font-weight:900}
.lv_kick{display:block;margin-bottom:4px;font-size:15px;font-weight:700;color:#2b2d31}
.lv .type_light .lv_card::after{display:none}
.lv .type_light .lv_txt{text-shadow:none}
.lv .type_light .lv_tit{color:#1b1d21}
.lv .type_light .lv_desc{color:#3a3f47}
.lv .type_light .lv_kick{color:#2b2d31}
.lv_pc{width:29cqw;height:30cqw}
.lv .type_light .lv_txt{top:69cqw!important}
.lv_burst{left:3cqw;top:63cqw}
/* 밝은 장에서는 장 번호 · 멈춤 버튼 바탕을 진하게 (흰 글이 보이게) */
.lv:has(.type_light.is_on) .lv_ctrl .slide_count,.lv:has(.type_light.is_on) .lv_ctrl .btn_pause::before{background:rgba(34,34,34,.6)!important}
.lv:has(.type_light.is_on) .lv_ctrl .slide_count{color:rgba(255,255,255,.7)}

/* 메인 배너 타이포그래피 다듬기 (10/21 「타이포그라피 더 신경 써서」) — 세 장 같은 규칙
   제목: 30px 800 · 줄 간격 1.24 · 자간 -0.045em(큰 글은 좁게) · 두 줄 길이 고르게(balance)
   설명: 17px 500 · 자간 -0.02em · 제목과 12px 띄움 · 제목보다 한 단계 옅게 → 굵기 · 농도로 위계 */
.lv .lv_tit{font-size:30px;font-weight:800;line-height:1.24;letter-spacing:-.045em!important;margin-bottom:12px;text-wrap:balance;word-break:keep-all}
.lv .lv_desc{font-size:17px;font-weight:500;line-height:1.4;letter-spacing:-.02em!important;opacity:.92}
.lv .type_light .lv_txt{top:76cqw!important}
.lv .type_light .lv_tit{color:#17191c}
.lv .type_light .lv_desc{color:#4a4f57;opacity:1}
.lv_burst{top:66cqw}

/* 무료 샘플 배너 — 제품 강조 (레퍼런스 핏펫플렉스 · 반려소반) */
.lv_hero_dog{position:absolute;z-index:1;height:auto}
.lv_pack{position:absolute;z-index:2;height:auto;filter:drop-shadow(0 2.4cqw 2.6cqw rgba(0,0,0,.22))}
.lv_pack.type_front{z-index:3}
.lv_free{position:absolute;z-index:4;left:5cqw;top:24cqw;display:flex;flex-direction:column;align-items:center;justify-content:center;width:21cqw;height:21cqw;border-radius:50%;background:#23477e;color:#fff;font-size:3.2cqw;font-weight:700;letter-spacing:.04em!important;line-height:1.1;transform:rotate(-8deg);box-shadow:0 1.6cqw 3cqw rgba(0,0,0,.18)}
.lv_free b{font-size:6.4cqw;font-weight:900;letter-spacing:-.03em!important}
.lv_card .hand.lv_hand_dk{color:#2b2d31;font-size:6.4cqw}
/* 무료 샘플 2차 — 흰 둥근 판 */
.lv_stage{position:absolute;z-index:0;left:8cqw;right:8cqw;top:9cqw;height:61cqw;border-radius:5cqw;background:#f6f3ee;box-shadow:0 2cqw 5cqw rgba(0,20,60,.25)}
.lv_free{left:3cqw;top:5cqw;width:19cqw;height:19cqw;background:#ffd93b;color:#1f3f73}
.lv_free b{font-size:5.8cqw}
.lv_card .hand.lv_hand_dk{font-size:5.6cqw}
/* 따뜻한 한끼 사진 카드 — 얼굴을 가까이 (10/21): 누끼도 카드를 꽉 채우고 얼굴 쪽으로 확대 */
.lv_pc.type_cut img{position:static;width:100%;height:100%;object-fit:cover}
/* 무료 샘플 — 하이파이브 (레퍼런스 HYDRA) : 휘어진 손글씨 · 민트 계열 진한 초록 글 */
.lv_curve{position:absolute;z-index:2;inset:0;width:100%;height:100%;overflow:visible}
.lv_curve text{font-family:"Gochi Hand","Gaegu",cursive;font-weight:400;font-size:9px;letter-spacing:.06em;fill:#2f6b4f}
.lv .type_mint .lv_tit{color:#1f3b2a}
.lv .type_mint .lv_desc{color:#3d5c48}
.lv_card .lv_full[src*="bnr-sample-hifive"]{top:-18%;height:118%}
/* 글 뒤 그라데이션 — 세 장 공통 (10/21)
   카드 아래 52%에 깔고, 글이 시작하는 곳부터 거의 불투명. 흰 글 장은 같은 계열 진한 색(--scrim), 진한 글 장은 바탕색(--fade) */
.lv_card::after{height:52%!important;background:linear-gradient(to bottom,rgba(var(--scrim),0) 0,rgba(var(--scrim),.55) 38%,rgba(var(--scrim),.78) 100%)!important}
.lv .type_light .lv_card::after{display:block!important;background:linear-gradient(to bottom,rgba(var(--fade),0) 0,rgba(var(--fade),.9) 36%,rgba(var(--fade),.97) 100%)!important}
/* 아이콘 메뉴 배지 — 포인트색 (10/21). 흰 글 대비가 보장되는 --pc(진하게 보정된 포인트색) */
.theme_b .lq_badge{background:var(--pc)}
/* 아이콘 메뉴 간격 — 누르는 곳 사이 8px로 가로 · 세로 같게 (모바일 터치 기준 8dp, 6 → 8 · 10 → 8) */
.theme_b .lq_row{gap:8px}
.theme_b .lq_row + .lq_row{margin-top:8px}

/* ===== 포인트색 쓰는 기준 (10/21) =====
   ① 포인트색 그대로 — 돈과 행동만: 할인율, 장바구니 숫자, 구매 · 신청 같은 주요 버튼
   ② 포인트색 옅게(바탕 10% + 진한 포인트색 글) — 상품의 특별 표시: 맞춤 · 무료 배지, BEST
   ③ 블랙 #222 — 고르는 것 · 길 안내: 상단 탭 · 하단 탭 · 분류 알약 · 브랜드 탭 선택, 기획전 꼬리표, 당일출고, 띠 배너 강조 글 */
.theme_b{--pc-tint:color-mix(in srgb,var(--pc-raw) 10%,#fff);--pc-deep:color-mix(in srgb,var(--pc) 82%,#000)}
/* ② 옅게 */
.theme_b .lq_badge{background:var(--pc-tint)!important;color:var(--pc-deep)!important;box-shadow:none}
.theme_b .prd_card .flag{background:var(--pc-tint);border-color:transparent;color:var(--pc-deep)}
.theme_b .prd_card .flag.type_new{background:#f1f2f4;color:#222}
/* ③ 블랙 */
.theme_b .gnb_list a.on{color:#222!important;border-bottom-color:#222!important;font-weight:700}
.theme_b .tab_bar a.btn_kit{color:#666}
.theme_b .tab_bar a.on,.theme_b .tab_bar a.btn_kit.on{color:#222}
.theme_b .bs_tabs button[aria-selected=true],.theme_b .tab_pill button.on{background:#222!important;border-color:#222!important;color:#fff!important}
.theme_b .lf4_tag{background:#222}
.theme_b .prd_card .ship{color:#3a3f47;font-weight:600}
.theme_b .bv_strip .tit span,.theme_b .bv_strip .hand{color:#222!important}
.theme_b .bv_strip .bnr_oval{background:#222!important}
.theme_b .bv_strip .deco svg:not([fill="none"]){fill:#222}
.theme_b .bv_strip .deco svg[fill="none"]{stroke:#222}
/* 기획전 01 강아지 — 얼굴 가까이 (10/21) */
.ex_card .img img[src*="dog-donate"]{transform:scale(1.6);transform-origin:50% 62%}

/* 메인 맨 아래 — 직접 만든 공장 */
.fc_head{padding:0 20px}
.fc_lead{margin:-8px 20px 20px;font-size:15px;line-height:23px;color:#4a4f57}
.fc_list{display:grid;grid-template-columns:1fr 1fr;gap:20px 12px;margin:0 20px;padding:0;list-style:none}
.fc_list li{list-style:none;min-width:0}
.fc_list li.type_big{grid-column:1/-1}
.fc_list .ph{position:relative;display:block;aspect-ratio:4/3;border-radius:12px;overflow:hidden;background:#eee}
.fc_list li.type_big .ph{aspect-ratio:16/10}
.fc_list .ph img{width:100%;height:100%;object-fit:cover;transition:transform .3s ease-in-out}
.fc_list .ph i{position:absolute;left:10px;top:10px;padding:2px 8px;border-radius:99px;background:rgba(0,0,0,.55);color:#fff;font-style:normal;font-size:12px;font-weight:700}
.fc_list b{display:block;margin-top:10px;font-size:16px;font-weight:700;color:#222}
.fc_list li > span:last-child{display:block;margin-top:2px;font-size:14px;line-height:20px;color:#5f6670}
@media (hover:hover){.fc_list li:hover .ph img{transform:scale(1.06)}}
/* 상품 목록 — 이름 위 브랜드 줄 뺌 (상품 이름이 이미 브랜드로 시작해 같은 말이 두 번 나옴, 10/21) */
.theme_b .prd_card .info .brand,.theme_b .prd_item .prd_brand{display:none}
/* 상품 이름이 한 줄이면 아래(가격 · 태그)가 바로 따라 올라오게 — 두 줄 고정 높이 삭제, 최대 두 줄은 유지 (10/21) */
.theme_b .prd_card .name{height:auto!important;max-height:42px}
/* 당일출고 — 둥근 배지 · 지운 정가 — 얇게 (10/21). 색은 기준 ③(안내는 블랙 계열): 연회색 바탕 + 진회색 글 */
.theme_b .prd_card .ship:not(.type_none){display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:99px;background:#f1f2f4;color:#3a3f47;font-size:12px;font-weight:600;line-height:22px}
.theme_b .prd_card .price s,.theme_b .sale_price s{font-weight:400!important;color:#9aa0a8}
.theme_b .prd_card .ship:not(.type_none){flex:none}
.theme_b .prd_card .acts .act_wish{margin-left:auto}
/* 밸런스키트 포스터 높이 — 화면 폭이 아니라 포스터 자기 폭 기준 비율로 (PC 크롬에서 파란 영역이 끝없이 늘어나던 것, 10/21) */
.kp{min-height:0!important;aspect-ratio:100/160}
/* GOOD MEAL DAYS 가운데 정렬 */
.kp_word{left:0!important;right:0;text-align:center}
/* 설문 하단 이전 · 다음 (위키 기준) */
.survey_btn_area .survey_auto{margin:0 0 8px;font-size:13px;color:#5f6670;text-align:center}
.survey_btns{display:grid;grid-template-columns:1fr 2fr;gap:8px}
.survey_btns .btn_line{background:#fff;border:1px solid #d5d9e0;color:#222}
.survey_btns .btn[disabled]{opacity:.35}
.survey_btns .btn+.btn{margin-top:0}
.survey{padding-bottom:32px}

/* ===== UI/UX · 웹 표준 점검 수정 (10/21) ===== */
/* 마이 — 숫자 칸 셋 정렬(링크 · 버튼 모양이 달라 글 높이가 어긋남) · 칸 사이 */
.theme_b .my_status{margin-top:16px}
.theme_b .my_status a,.theme_b .my_status button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-height:76px;padding:12px 0;margin:0;border:0;background:none;font:inherit;line-height:1.3}
.theme_b .my_status > * + *{border-left:1px solid var(--line)!important}
.theme_b .my_status b{font-size:20px;line-height:24px}
.theme_b .my_status span{font-size:13px;line-height:18px;color:#5f6670}
/* 푸터 — 사업자 정보 누르는 곳 44 · 브랜드 글자 대비 4.5 이상 */
.theme_b .footer details.biz_info summary{display:flex;align-items:center;min-height:44px}
.ft_word{color:#767676}
/* 카테고리 — 위 두 입구는 포인트색 기준 ③(길 안내 = 블랙 계열) · 전체 보기 · 모아 보기 누르는 곳 44 */
.theme_b .menu_gate a{display:flex;flex-direction:column;justify-content:center;min-height:64px;background:#f4f5f7;border-color:#f4f5f7}
.theme_b .menu_gate b{color:#222;font-size:16px}
.theme_b .menu_gate span{font-size:13px;color:#5f6670}
.theme_b .menu_all{display:flex;align-items:center;min-height:44px;padding-bottom:0}
.theme_b .menu_more a{display:inline-flex;align-items:center;min-height:44px}
/* 알약 칩(목록 거르기 · 검색어 · 사진 추가 · 배송지 변경) — 모양은 36 그대로, 누르는 곳만 44 */
.theme_b .chip{position:relative}
.theme_b .chip::after{content:"";position:absolute;left:0;right:0;top:-4px;bottom:-4px}
.theme_b .list_rank button{min-height:44px}
/* 글자 대비 4.5 이상 */
.theme_b .prd_card .price s,.theme_b .sale_price s{color:#767676!important}
.theme_b .list_good li div > span{color:#5f6670}
.theme_b .lp_next small{color:var(--pc-deep)}
.theme_b .worry_ans{color:#3a3f47}
.theme_b .lf_kicker{color:var(--pc-deep)}
.ex_card .img i{font-size:12px}
/* 밸런스키트 포스터 작은 글 — 크림색은 파랑 위에서 대비 3.9 → 흰색(4.6) */
.kp_top,.kp_lb,.kp_desc,.kp_feat{color:#fff}
/* 점검 2차 — 남은 대비 · 누르는 곳 */
.theme_b .back_card em{color:var(--pc-deep)}
.theme_b .worry_ans b{color:var(--pc-deep)}
.theme_b .lf_sizes .nm,.theme_b .lf_lines li span{color:#5f6670}
.theme_b .progress_grp span{color:#767676}
.theme_b .list_info dt,.theme_b .prd_brand{color:#5f6670}
.theme_b .gnb_list a{min-width:44px;justify-content:center;text-align:center}
.theme_b .header .logo,.theme_b .header h1 a{display:inline-flex;align-items:center;min-height:44px}
/* 카테고리 — 왼쪽 선택 칸과 오른쪽 「전체 보기」 줄 높이 맞춤 (10px 어긋남) */
.theme_b .menu_2{padding-top:6px!important}

/* 마이 — 우리 아이 (10/21) */
.theme_b .tit_pets{display:flex;align-items:center;justify-content:space-between}
.theme_b .tit_pets em{font-style:normal;color:#5f6670;font-weight:600;margin-left:4px}
.theme_b .btn_add_pet{display:inline-flex;align-items:center;min-height:44px;margin:-12px 0;padding:0 2px;font-size:14px;font-weight:600;color:#222}
.theme_b .my_pets.type_one .pet_tile{width:100%}
.theme_b .pets_empty{margin:0 20px;padding:16px;border-radius:12px;background:#f4f5f7;font-size:14px;line-height:21px;color:#5f6670}
/* 아이 카드 버튼 — 보기 · 관리는 길 안내라 블랙(포인트색 기준 ③) */
.theme_b .pet_tile .btn_half .btn:not(.btn_line){background:#222;border-color:#222;color:#fff}
.theme_b .tit_pets .t{margin:0;color:#222;font-size:15px}
/* 푸터 — 고객센터 번호 · 운영시간 (위키 「약관 채울 항목」 1-1 · 1-2, 9/23 확정: 본사 대표 번호 하나, 모든 몰 같음) */
.ft_cs{display:flex;align-items:center;gap:10px;margin-top:4px}
.ft_cs_t{font-size:14px;font-weight:600;color:#3a3f47}
.ft_tel{display:inline-flex;align-items:center;min-height:44px;font-size:20px;font-weight:800;color:#222;letter-spacing:0!important}
.ft_hours{display:block;font-size:13px;line-height:20px;color:#5f6670}
/* 푸터 아래 흰 바탕 — 화면 아래 탭바 자리(여백)까지 푸터 회색으로 */
.theme_b .footer{position:relative}
.theme_b .footer::after{content:"";position:absolute;left:0;right:0;top:100%;height:var(--ft-tail,84px);background:inherit}
/* 기획전 아래 상품 — 다른 섹션과 같은 상품 카드(prdBox)로 통일, 두 개를 두 칸 격자 (10/21) */
.lf4_set{display:grid!important;grid-template-columns:1fr 1fr;gap:20px 12px}
.lf4_set[hidden]{display:none!important}
.lf4_prd{margin:20px 0 24px}
.lf4_set .prd_card{width:auto!important;min-width:0}
/* 기획전 03 안 공장 이야기 — 기획전 본문 폭(ex_sec 안쪽 여백)에 맞춤 */
.ex_factory .fc_head,.ex_factory .fc_lead,.ex_factory .fc_list{padding-left:0;padding-right:0;margin-left:0;margin-right:0}
.ex_factory .fc_head h2{font-size:20px;line-height:28px}

/* ===== 밸런스키트 페이지 다듬기 (10/21) ===== */
/* 포스터 — 글은 모두 왼쪽 7% 한 줄에, 오른쪽도 7% */
.kp_top{padding:6cqw 7cqw 0!important}
.kp_info{left:7cqw!important;top:100cqw!important;width:60cqw!important}
.kp_lb{font-size:3.6cqw}
.kp_price{margin-top:1cqw;padding-bottom:2.4cqw;font-size:7.4cqw}
.kp_desc{margin-top:2.6cqw;font-size:3.7cqw;line-height:1.5;white-space:nowrap}
.kp_feat{left:7cqw!important;right:7cqw!important;bottom:5cqw!important;padding-top:4cqw!important;gap:2cqw!important}
.kp_feat li{gap:1.4cqw!important}
/* 페이지 바탕 — 연보라 · 연파랑 대신 중립 회색 하나(푸터와 같은 #f6f6f6)와 흰색만 */
.theme_b .lf_page{--lf:#f6f6f6}
.theme_b .lf_phone .scr{background:#f4f5f7}
.theme_b .lf_phone{box-shadow:0 10px 30px rgba(0,0,0,.08)}
/* 「밸런스키트, 어떻게 받나요?」 — 색 띠 대신 흰 바탕 + 위아래 가는 선, 버튼은 누르는 곳 44 */
.theme_b .lf_band{background:#fff;border-top:1px solid #eee;border-bottom:1px solid #eee;padding:14px 20px;font-size:16px;font-weight:700;color:#222}
.theme_b .lf_band i{display:inline-flex;align-items:center;min-height:36px;padding:0 14px;border:1px solid #222;font-size:14px;position:relative}
.theme_b .lf_band i::after{content:"";position:absolute;inset:-4px 0}
/* 하단 탭 아이콘 선 두께 — 눈에 같은 굵기로 보이게 (10/21). 숫자는 달라도 보이는 무게를 맞춤:
   빽빽한 모양(카테고리 네모 4개)은 같은 두께여도 진해 보여 조금 가늘게, 트인 모양(밥그릇)은 조금 두껍게 */
.theme_b .tab_bar a svg{stroke-width:1.6}
.theme_b .tab_bar a:nth-child(2) svg{stroke-width:1.45}
.theme_b .tab_bar a.btn_kit svg{stroke-width:1.75}
.theme_b .tab_bar a:nth-child(5) svg{stroke-width:1.55}

/* 무료 샘플 입체 배너 */
.theme_b #content .sb3_sec{margin-top:16px!important}
.sb3{position:relative;display:block;height:156px;margin:30px 20px 0;border-radius:16px;background:#f4f5f7;color:#222}
.sb3_txt{position:absolute;left:22px;top:50%;transform:translateY(-50%);z-index:3;width:52%}
.sb3_txt b{display:block;font-size:20px;font-weight:700;line-height:120%}
.sb3_txt span{display:block;margin-top:8px;font-size:14px;line-height:20px;color:#5f6670}
.sb3 img{position:absolute;height:auto;pointer-events:none}
.sb3_pk{top:50%;bottom:auto;z-index:1;filter:drop-shadow(0 6px 8px rgba(0,0,0,.16))}
.sb3_pk.type_a{right:78px;width:82px;transform:translateY(-50%) rotate(-8deg)}
.sb3_pk.type_b{right:12px;width:84px;transform:translateY(-50%) rotate(7deg)}
.sb3_dog{z-index:2;right:28px;bottom:58px;width:104px;filter:drop-shadow(0 6px 8px rgba(0,0,0,.14))}
@media (hover:hover){.sb3:hover .sb3_dog{transform:translateY(-3px)}.sb3_dog{transition:transform .3s ease-in-out}}
/* 무료 샘플 입체 배너 2차 — 강아지가 카드 위로 30px 튀어나오게, 봉지는 오른쪽으로 모아 제목과 안 겹치게 */
.sb3_txt{width:auto;max-width:56%}
.sb3_pk.type_a{right:66px;width:74px}
.sb3_pk.type_b{right:10px;width:76px}
.sb3_dog{right:20px;bottom:74px;width:112px}
/* 밸런스키트 「설문 한 번이면 이렇게 와요」 섹션 바탕 흰색 (10/21) */
.theme_b .section_flow:has(> .how3){background:#fff!important}
.opt_item.type_card .ico_body{width:56px;height:46px}
.opt_item.type_card .ico_body{width:84px!important;height:52px!important}
.opt_item.type_card .ico_body{width:80px!important;height:55px!important}
.survey{padding-bottom:64px!important}
/* (10/21 GNB 밸런스키트 · 무료 샘플 강조색은 원래대로 되돌림) */
.opt_item.type_card .ico_body{width:42px!important;height:61px!important}

/* ===== 공통 규칙을 상품 상세 · 기획전 상세에도 같은 규격으로 (10/21) — 규칙 목록은 puffinmall/DESIGN-RULES.md ===== */
/* 제목 단계: 페이지 제목 24 · 섹션 제목 20 · 섹션 안 작은 제목 16 (모두 700, 자간 -0.02em) */
.theme_b .ex_head h2,.theme_b .pd2_buy h1{font-size:24px!important;font-weight:700!important;line-height:32px!important}
.theme_b .pd2_buy h1{font-size:20px!important;line-height:28px!important}
.theme_b .pd2_sec h3,.theme_b .ex_sec h3,.theme_b .tit_good,.theme_b .tit_info,.theme_b .pd2 h2{font-size:20px!important;font-weight:700!important;line-height:28px!important;font-family:inherit!important}
.theme_b .pd2_sec .box_store h3,.theme_b .pd2_sec li h3,.theme_b .pd2_sec .box h3{font-size:16px!important;line-height:24px!important}
/* 섹션 간격 48 · 회색 바탕은 하나(#f6f6f6) */
.theme_b .pd2_sec{padding:48px 20px}
.theme_b .pd2_sec.bg_gray,.theme_b .prd_gallery{background:#f6f6f6}
.theme_b .ex_sec{padding:24px 20px}
/* 찜 · 담기 — 누르는 곳 44 (모양은 32 그대로) */
.theme_b .prd_card .act_wish::before,.theme_b .prd_card .act_cart::before{content:"";position:absolute;inset:-6px}
/* 큰 버튼(아래 고정 · 본문) — 높이 52 · 둥글기 8 · 16px 700. 구매 · 신청 같은 행동 버튼은 포인트색(기준 ①), 보조는 흰 바탕 + 회색 테두리 */
.theme_b .btn{border-radius:8px}
.theme_b .fixed_btn_area .btn{height:52px}
.theme_b .fixed_btn_area .btn_wish{width:52px;height:52px;border-radius:8px}
.theme_b .fixed_btn_area .btn_dark{background:var(--pc)!important;color:#fff!important}
.theme_b .btn.btn_line{background:#fff;border:1px solid #d5d9e0;color:#222}
.theme_b .pd2_sec .box_howto h3{font-size:16px!important;line-height:24px!important}

/* ---------- 배너 → 상세 연결 (10/21): 메인 배너 장 · 기획전 카드를 상세 맨 위에 같은 모양으로 ---------- */
.theme_b .lv_hero{padding:16px 20px 0;background:#fff}
.theme_b .lv_hero .slide_item{width:100%!important;padding:0;transform:none!important}
.theme_b .lv_hero .lv_tags{top:12px;right:16px}
.theme_b .lv_hero .lv_tag{width:52px;height:52px}
.theme_b .ex_lf4{padding:16px 20px 0}
.theme_b .ex_lf4 .slide_item{width:100%!important;padding:0}
.theme_b .ex_lf4 .lf4_txt .ex_tit{margin:4px 0 2px;font-size:24px!important;font-weight:700;line-height:32px!important;color:#fff}
/* 마이 맨 아래 로그아웃 (샘플 시연용) */
.btn_logout{display:block;min-height:44px;margin:16px 20px 24px;padding:0 4px;border:0;background:none;color:#767676;font-size:14px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
/* 체형 아이콘 — 펫프렌즈 컨셉 (샘플 1 카테고리 아이콘과 같은 선 1.5px · 포인트 동그라미) */
.opt_item.type_card .ico_body.type_pf{width:68px!important;height:68px!important}
.ico_body.type_pf *{vector-effect:non-scaling-stroke;stroke-width:1.5px}
.ico_body.type_pf .ln_thin{stroke-width:1.2px}
.ico_body.type_pf .ico_point{opacity:1}
/* 로그인 — 카카오 · 네이버 · 이메일 같은 급 버튼 (10/21): 52 높이 · 둥글기 4 · 16px 600 · 아이콘 왼쪽 20 · 버튼 사이 8 */
.lg_sns + .lg_sns{margin-top:8px}
.lg_sns.type_naver{background:#03c75a;color:#fff}
.lg_sns.type_naver svg{width:18px;height:18px;left:22px}
.lg_sns.type_mail{background:#fff;color:#222;box-shadow:inset 0 0 0 1px #dbdbdb}
.lg_sns.type_mail svg{width:22px;height:22px}
.lg_panel .lg_guest{margin-top:16px}
/* 무료 샘플 입체 배너 — 강아지 뺌 · 높이 낮춤 (10/21). 사료 팩만 위로 살짝 튀어나와 입체감 유지 */
.sb3{height:116px;margin-top:0}
.sb3_pk.type_a{right:70px;width:70px}
.sb3_pk.type_b{right:12px;width:72px}
/* 기획전 상세 맨 위 — 메인에서는 카드, 상세 안에서는 화면 꽉 찬 사진 (10/21). 글 · 꼬리표 · 어둡게 깔리는 정도는 카드와 같게 */
.theme_b .ex_lf4{padding:0}
.theme_b .ex_lf4 .lf4_media{aspect-ratio:375/440;border-radius:0}
.theme_b .ex_lf4 .lf4_txt{left:20px;right:20px;bottom:32px}
/* 품종 목록 — 작은 상자 안 스크롤을 없애고 전부 펼침(10/21). 화면 전체로 내려 보고, 아래 고정 버튼에 가리지 않게 여백 */
.list_breed{max-height:none!important;overflow:visible!important;padding-bottom:8px}
/* 설문 「고르면 바로 다음」 안내 — 로그인 화면 말풍선(lg_tip)과 같은 모양으로, 꼬리가 「다음」 버튼 가운데를 가리킴 (10/21) */
.survey_btn_area .survey_auto{display:table;position:relative;left:calc((100% - 8px) / 3 + 8px + (100% - 8px) / 3);margin:0 0 10px;padding:8px;border-radius:5px;background:#222;color:#fff;font-size:12px;line-height:12px;white-space:nowrap;text-align:center;transform:translateX(-50%);animation:lgTip 1.3s ease-in-out infinite alternate}
.survey_btn_area .survey_auto::after{content:"";position:absolute;left:50%;bottom:-5px;margin-left:-5px;border:5px solid transparent;border-bottom:0;border-top-color:#222}
.survey_btn_area .survey_auto em{font-style:normal;font-weight:700;color:color-mix(in srgb,var(--pc-raw) 45%,#fff)}
@media (prefers-reduced-motion:reduce){.survey_btn_area .survey_auto{animation:none}}
/* 무료 샘플 · 따뜻한 한끼 상세 맨 위 — 기획전 상세와 같이 화면 꽉 찬 그림 (10/21). 메인에서는 카드 그대로 */
.theme_b .lv_hero{padding:0}
.theme_b .lv_hero .lv_card{aspect-ratio:375/440;border-radius:0}
.theme_b .lv_hero .lv_tags{top:16px;right:20px}
/* 아이콘 메뉴 — 회색 타일 + 아래 이름, 한 줄 옆으로 넘김 (10/21). 칸 68 · 타일 64 · 둥글기 16 · 아이콘 40 · 이름 13px · 칸 사이 12 */
.theme_b .lq.type_tile .lq_row{display:flex;gap:12px;padding:10px 20px 0;overflow-x:auto;scrollbar-width:none;scroll-padding:0 20px;scroll-snap-type:x proximity}
.theme_b .lq.type_tile .lq_row::-webkit-scrollbar{display:none}
.theme_b .lq.type_tile .lq_row li{flex:0 0 68px;min-width:0;scroll-snap-align:start}
.theme_b .lq.type_tile .lq_chip{flex-direction:column;align-items:center;justify-content:flex-start;gap:8px;min-height:0;padding:0;border:0;border-radius:0;background:none}
.theme_b .lq.type_tile .lq_ic{display:grid;place-items:center;width:64px;height:64px;border-radius:16px;background:#f4f5f7;transition:background .2s}
.theme_b .lq.type_tile .lq_ic svg{width:40px;height:40px}
.theme_b .lq.type_tile .lq_tit{font-size:13px;font-weight:500;line-height:18px;text-align:center;white-space:nowrap}
.theme_b .lq.type_tile .lq_badge{top:-8px;right:-2px}
.theme_b .lq.type_tile .lq_chip:active .lq_ic{background:#e9ebee}
@media (hover:hover){.theme_b .lq.type_tile .lq_chip:hover .lq_ic{background:#e9ebee}}
.theme_b .lq.type_tile .lq_chip:focus-visible{outline:2px solid #222;outline-offset:2px;border-radius:16px}

/* 메인 배너 무료 샘플(사료 3종) 장 — 글 뒤 그라데이션 없앰 (10/21). 민트 바탕에 진한 초록 글이 그대로 읽힌다 */
.lv .type_mint .lv_card::after{display:none!important}
/* 「우리 아이 등록하고 추천받기」 등 채움형 더보기 버튼 = 주요 버튼 규격 (10/21) */
.theme_b .isc_more.type_fill{height:52px;border:0;border-radius:8px;background:var(--pc);color:#fff;font-size:16px;font-weight:700}
@media (hover:hover){.theme_b .isc_more.type_fill:hover{text-decoration:none;background:var(--pc-deep)}}
/* 아이콘 메뉴 — 러쉬 테두리 칸 + 세로 구성 (10/21). 3칸 2줄 · 칸 사이 8 · 흰 바탕 · 테두리 #eee · 둥글기 4 · 아이콘 36 위 · 이름 14px 아래 · 칸 높이 84 */
.theme_b .lq.type_col .lq_chip{flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:84px;padding:10px 4px 12px;border:1px solid #eee;border-radius:4px;background:#fff}
.theme_b .lq.type_col .lq_ic{width:36px;height:36px}
.theme_b .lq.type_col .lq_tit{font-size:14px;line-height:18px;text-align:center}
.theme_b .lq.type_col .lq_chip:has(.lq_badge){padding-right:4px}
/* 메인 배너 밸런스키트 장(어두운 사진 · 흰 글) 글 위치 조금 아래로 76 → 80cqw (10/21 「조금만」) */
.lv .lv_item:not(.type_light) .lv_txt{top:80cqw!important}
/* 아이콘 메뉴 — 기존 러쉬 가로 칸, 칸 폭은 글 길이대로 · 줄마다 가운데 정렬 (10/21) */
.theme_b .lq.type_auto .lq_row{justify-content:center;padding:0 20px}
.theme_b .lq.type_auto .lq_row li{flex:0 0 auto}
.theme_b .lq.type_auto .lq_chip{justify-content:center;padding:4px 14px 4px 10px}
.theme_b .lq.type_auto .lq_chip:has(.lq_badge){padding-right:14px}

/* 카드 아래 글(상품 이름 · 가격 · 태그 등)에 양옆 2px 안쪽 여백 — 사진 모서리와 글 시작이 딱 붙지 않게 (10/21) */
.theme_b .prd_card > .acts,.theme_b .prd_card > .info,.theme_b .prd_card > .price,.theme_b .prd_card > .tags,.theme_b .prd_card > .sale_price,
.theme_b .lf4_mini .tx,.theme_b .lp_sample li > b,.theme_b .lp_sample li > em{padding-left:2px;padding-right:2px}

/* ---------- 10/22 GPT 검토 재검증 후 맞는 지적만 반영 ---------- */
/* 수량 −/+ 34 → 44 (장바구니 · 상품 상세), 삭제 22 → 44 (사내 기준 44 × 44) */
.theme_b .qty button{width:44px;height:44px}
.theme_b .btn_del{min-width:44px;min-height:44px;padding:0 8px;margin:-11px 0 -11px -8px}
/* 찜 · 담기: 넓힌 누르는 영역이 서로 겹치던 것(사이 2px)을 겹치지 않게 — 맞닿는 쪽은 1px만 넓힘 */
.theme_b .prd_card .act_wish::before{inset:-6px -1px -6px -6px}
.theme_b .prd_card .act_cart::before{inset:-6px -6px -6px -1px}
/* 없는 주소 안내 */
.nf{padding:96px 20px 64px;text-align:center}
.nf h1{font-size:20px;font-weight:700;line-height:28px}
.nf p{margin-top:8px;font-size:15px;line-height:22px;color:#5f6670}
.nf_btns{display:grid;gap:8px;margin-top:32px}
/* 상품 카드 — 당일출고는 사진 왼쪽 위(전 BEST 자리), 사진 아래 줄은 찜 · 담기 44 × 44만 (10/22) */
.theme_b .prd_card .flag.type_ship{display:inline-flex;align-items:center;height:22px;padding:0 9px;border:0;border-radius:99px;background:#fff;color:#3a3f47;font-size:12px;font-weight:600;line-height:22px;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.theme_b .prd_card .acts{justify-content:flex-end;gap:0;margin-top:2px;margin-right:-8px}
.theme_b .prd_card .acts .act_wish{margin-left:0}
.theme_b .prd_card .act_wish,.theme_b .prd_card .act_cart{width:44px;height:44px}
.theme_b .prd_card .act_wish::before,.theme_b .prd_card .act_cart::before{content:none}
.theme_b .prd_card .acts + .info,.theme_b .prd_card .acts ~ .info{margin-top:-6px}

/* ---------- 러쉬와 다르게 (10/22) ---------- */
/* 메인 배너 꼬리표 — 네모 두 개 · 펼침 → 강아지 이름표(동그란 목걸이 태그) 하나, 줄에 매달려 살짝 흔들림 */
.lv .lv_tag:not(.type_fill){display:none}
.lv .lv_tags{top:0;right:6.4cqw}
.lv .lv_tag.type_fill{position:relative;width:15cqw;height:15cqw;margin:3.2cqw 0 0;padding:0;border-radius:50%;background:#2b2d31;color:#fff;font-size:12px!important;line-height:14px;clip-path:none!important;box-shadow:0 2px 6px rgba(0,0,0,.18);transform-origin:50% -3.2cqw}
.lv .lv_tag.type_fill::before{content:"";position:absolute;left:50%;top:-3.4cqw;width:1.5px;height:3.6cqw;margin-left:-.75px;background:#2b2d31}
.lv .lv_tag.type_fill::after{content:"";position:absolute;left:50%;top:1.2cqw;width:1.8cqw;height:1.8cqw;margin-left:-.9cqw;border-radius:50%;background:rgba(255,255,255,.35)}
.lv .slide_item.is_on .lv_tag.type_fill{animation:lvSwing 1.1s ease-out .25s both}
@keyframes lvSwing{0%{transform:rotate(-14deg)}35%{transform:rotate(9deg)}65%{transform:rotate(-4deg)}100%{transform:rotate(0)}}
/* 숫자 알약 → 카드 아래 진행 막대 + 멈춤 버튼 */
.lv .lv_ctrl{position:relative;left:auto;bottom:auto;transform:none;justify-content:center;gap:4px;margin:14px 0 0}
.lv .lv_ctrl .btn_pause{margin:-12px -4px -12px -12px}
.lv .lv_ctrl .btn_pause::before{display:none}
.lv .lv_ctrl .btn_pause svg{width:12px;height:12px;stroke:#222}
.lv .lv_ctrl .btn_pause .i_play{fill:#222}
.lv_bar{display:flex;align-items:center;gap:4px}
.lv_bar i{display:block;width:12px;height:3px;border-radius:2px;background:#d5d9e0;transition:width .3s,background .3s}
.lv_bar i.on{width:28px;background:#222}
.theme_b #content .lq.hs{padding-top:24px!important}
@media (prefers-reduced-motion:reduce){.lv .slide_item.is_on .lv_tag.type_fill{animation:none}.lv_bar i{transition:none}}

/* 로그인 — 흐르는 카드 띠 → 사진 한 장 + 세 단계 */
.lg_intro{margin:28px 20px 0}
.lg_ph{display:block;aspect-ratio:335/180;border-radius:16px;overflow:hidden;background:#eee}
.lg_ph img{width:100%;height:100%;object-fit:cover;object-position:50% 35%}
.lg_steps{display:flex;justify-content:space-between;gap:8px;margin:16px 0 4px;padding:0;list-style:none}
.lg_steps li{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;font-size:14px;font-weight:500;line-height:20px;color:#222;text-align:center}
.lg_steps b{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--pc-tint);color:var(--pc-deep);font-size:12px;font-weight:700}

/* 푸터 로고 — 흐르는 띠 → 멈춰 있는 로고 격자 */
.ft_brand{flex-wrap:wrap;height:auto;padding:20px 0}
.ft_brand ul{flex:1 1 100%;flex-wrap:wrap;justify-content:center;gap:12px 24px;padding:0 20px;animation:none!important}
.ft_brand ul[aria-hidden="true"]{display:none}
.ft_brand li{min-width:0;height:28px}

/* 더보기 · 기획전 전체 보기 테두리 버튼 — 둥글기 2(러쉬) → 8(우리 버튼 규칙) */
.theme_b .isc_more,.theme_b .lf4_btn{border-radius:8px}
.lv .lv_ctrl .slide_count.blind{position:absolute!important;width:1px!important;min-width:0!important;height:1px!important;padding:0!important;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;background:none!important}

/* ---------- 둥글기 3단계 통일 (10/22) — 전에는 4 · 8 · 10 · 12 · 14 · 16 · 18 · 20 · 24 · 34가 섞여 있었다
   16 큰 카드: 화면 폭 카드 · 배너 · 큰 사진 · 결과 / 키트 카드 상자
   12 작은 카드: 상품 사진 · 작은 사진 · 안내 · 메시지 상자 · 접는 목록
    8 누르는 것: 버튼 · 칩 칸 · 입력 · 작은 숫자 상자
   예외(그림이라 그대로): 휴대폰 그림(lf_phone · scr · phone · res), 말풍선(bub), 아래 고정 판 위 모서리, 배너 속 기울인 사진 카드(lv_pc), 동그라미 · 알약 */
.theme_b .lv_card,.theme_b .sb3,.theme_b .lf4_media,.theme_b .back_card,.theme_b .bs_band,.theme_b .pd2_hero,.theme_b .note_item,.theme_b .box_howto,
.theme_b .lp_next,.theme_b .lp_img,.theme_b .lg_ph,.theme_b .result_summary,.theme_b .box_kcal,.theme_b .result_card,.theme_b .lf_sizes,.theme_b .lf_card,
.theme_b .lf_sample,.theme_b .kit_line,.theme_b .box_supp,.theme_b .bnr_kit_strip,.theme_b .order_sum,.theme_b .fc,.theme_b .lp_points > li{border-radius:16px!important}
.theme_b .prd_card .thumb,.theme_b .lf_lines .th,.theme_b .pack,.theme_b .cart_item > img,.theme_b .lp_sample .img,.theme_b .box_msg,.theme_b .box_ship,
.theme_b .box_notice,.theme_b .result_save,.theme_b .box_kcal ul,.theme_b .lf_acc details,.theme_b .lf4_mini .th{border-radius:12px!important}
.theme_b .lq_chip,.theme_b .lg_kakao,.theme_b .box_kcal .txt_val b{border-radius:8px!important}
.theme_b .ex_lf4 .lf4_media,.theme_b .lv_hero .lv_card{border-radius:0!important}
/* 로그인 흐르는 단계 카드 — 러쉬 움직임 그대로, 생김새만 우리 것 (10/22) */
.lg_flow.type_step li{position:relative;gap:14px;height:84px;padding:0 20px 0 22px;border-radius:16px;overflow:hidden}
.lg_flow.type_step li::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--pc-tint)}
.lg_flow.type_step .no{flex:0 0 36px;display:grid;place-items:center;width:36px;height:36px;border-radius:12px;background:var(--pc-tint);color:var(--pc-deep);font-size:14px;font-weight:700;letter-spacing:0!important}
.lg_flow.type_step small{display:block;font-size:11px;font-weight:700;line-height:14px;letter-spacing:.06em!important;color:var(--pc-deep)}
.lg_flow.type_step strong{display:block;margin-top:2px;font-size:16px;font-weight:700;line-height:22px;color:#222}
.lg_flow.type_step em{display:block;font-style:normal;font-size:13px;line-height:18px;color:#5f6670}
/* 둥글기 통일 — 나머지 화면(기획전 목록 · 마이 · 설문 · 주문 · 결제 · 결과 · 검색)까지 (10/22) */
.theme_b .ex_card .img,.theme_b .pet_tile,.theme_b .my_status,.theme_b .opt_item.type_card,.theme_b .order_card{border-radius:16px!important}
.theme_b .opt_item{border-radius:12px!important}
.theme_b .bnr_kit_strip > img,.theme_b .line_thumb,.theme_b .line_thumb img,.theme_b .order_item > img{border-radius:12px!important}
.theme_b .pay_list > button,.theme_b .pay_list > a{border-radius:8px!important}

/* 메인 배너 넘김 표시 — 다시 배너 카드 안 아래로, 막대 더 굵게 (10/22) */
.lv .lv_ctrl{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);margin:0;gap:6px}
.lv_bar{gap:5px}
.lv_bar i{width:16px;height:5px;border-radius:3px;background:rgba(255,255,255,.5)}
.lv_bar i.on{width:32px;background:#fff}
.lv .lv_ctrl .btn_pause svg{stroke:#fff}
.lv .lv_ctrl .btn_pause .i_play{fill:#fff}
.lv:has(.type_light.is_on) .lv_bar i{background:rgba(34,34,34,.22)}
.lv:has(.type_light.is_on) .lv_bar i.on{background:#222}
.lv:has(.type_light.is_on) .lv_ctrl .btn_pause svg{stroke:#222}
.lv:has(.type_light.is_on) .lv_ctrl .btn_pause .i_play{fill:#222}
.theme_b #content .lq.hs{padding-top:40px!important}
/* 로그인 단계 카드 — 「01」과 「STEP 1」이 겹쳐 「STEP」 글 뺌 (10/22) */
.lg_flow.type_step strong{margin-top:0}
/* 로그인 단계 카드 더 단순하게 · 글자 작게 (10/22) — 왼쪽 띠 · 숫자 배지 바탕 뺌, 제목 14 · 설명 12, 높이 64 */
.lg_flow.type_step li{gap:12px;height:64px;padding:0 20px}
.lg_flow.type_step li::before{content:none}
.lg_flow.type_step .no{flex:0 0 auto;width:auto;height:auto;border-radius:0;background:none;color:var(--pc-deep);font-size:13px}
.lg_flow.type_step strong{font-size:14px;line-height:20px}
.lg_flow.type_step em{font-size:12px;line-height:17px}
/* 메인 배너 화살표 — 기획전 카드와 같은 28px 반투명 동그라미 (10/22). 밝은 장은 진한 색, 상세 맨 위 배너에서는 숨김 */
.lv .lv_arrow{z-index:4;top:16px;right:16px}
.lv .type_light .lv_arrow{background:rgba(34,34,34,.12)}
.lv .type_light .lv_arrow svg{stroke:#222}
.lv_hero .lv_arrow{display:none}
.lv .lv_tags{right:auto;left:6.4cqw}
.lv_card .dd[style*="top:7cqw"]{display:none}
/* 브랜드 이야기 띠도 같은 화살표 — 오른쪽 위 28px 반투명 동그라미 (10/22) */
.bs_band .lf4_arrow{z-index:3;top:16px;right:16px}
/* 상품 카드 하트만 사진 오른쪽 위 (10/22) — 누르는 곳 44 × 44, 사진 아래 줄은 없앰 */
.theme_b .prd_card .acts{position:absolute;z-index:2;top:0;right:0;margin:0}
.theme_b .prd_card .acts .act_wish{color:#767676}
.theme_b .prd_card .acts .act_wish svg{width:22px;height:22px}
.theme_b .prd_card .acts .act_wish[aria-pressed="true"]{color:#e5484d}
.theme_b .prd_card .acts + .info,.theme_b .prd_card .acts ~ .info{margin-top:12px}
/* 밸런스키트 카드 사진 속 사료 팩 묶음 — 아래로 쏠려 있던 것(아래 14%)을 사진 가운데로 (10/22) */
.theme_b .prd_card .thumb.type_kit .kit_packs{top:50%;bottom:auto;left:8%;right:8%;height:60%;transform:translateY(-67%)}
/* 10/22 정정 — 메인 배너 화살표 버튼 취소. 이름표는 다시 오른쪽 위, 밸런스키트 장 손그림 빗금 다시 보임 */
.lv .lv_tags{left:auto;right:6.4cqw}
.lv_card .dd[style*="top:7cqw"]{display:block}
/* 페이징을 기획전 화살표와 같은 생김새로: 반투명 흰 동그라미(28) 안 멈춤 아이콘 + 같은 반투명 알약(높이 28) 안 진행 막대 */
.lv .lv_ctrl{gap:6px;bottom:16px}
.lv .lv_ctrl .btn_pause{width:44px;height:44px;margin:-8px}
.lv .lv_ctrl .btn_pause::before{display:block;content:"";position:absolute;width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,.28)}
.lv .lv_ctrl .btn_pause svg{width:12px;height:12px;stroke:#fff;stroke-width:2.4}
.lv_bar{height:28px;padding:0 11px;border-radius:14px;background:rgba(255,255,255,.28);gap:4px}
.lv_bar i{width:6px;height:6px;border-radius:3px;background:rgba(255,255,255,.55)}
.lv_bar i.on{width:18px;background:#fff}
.lv:has(.type_light.is_on) .lv_ctrl .btn_pause::before,.lv:has(.type_light.is_on) .lv_bar{background:rgba(34,34,34,.12)}
.lv:has(.type_light.is_on) .lv_bar i{background:rgba(34,34,34,.3)}
.lv:has(.type_light.is_on) .lv_bar i.on{background:#222}
/* 페이징 — 막대 대신 숫자(10/22). 멈춤 동그라미와 같은 반투명 흰 판(높이 28) 안에 「1 / 3」 */
.lv_bar{display:none}
.lv .lv_ctrl .slide_count.blind{position:static!important;width:auto!important;min-width:0!important;height:28px!important;margin:0;padding:0 12px!important;overflow:visible;clip:auto;border-radius:14px;background:rgba(255,255,255,.28)!important;color:rgba(255,255,255,.75);font-size:12px;font-weight:500;line-height:28px;letter-spacing:0!important}
.lv .lv_ctrl .slide_count.blind b{color:#fff;font-weight:700}
.lv:has(.type_light.is_on) .lv_ctrl .slide_count.blind{background:rgba(34,34,34,.12)!important;color:rgba(34,34,34,.6)}
.lv:has(.type_light.is_on) .lv_ctrl .slide_count.blind b{color:#222}
.lv:has(.type_light.is_on) .lv_ctrl .btn_pause svg{stroke:#222}
.lv:has(.type_light.is_on) .lv_ctrl .btn_pause .i_play{fill:#222}
/* 하트 새 그림 — 그림의 색 그대로(위 CSS의 선 · 채움 덮어쓰기 해제), 찜하면 빨간 채움 */
.theme_b .prd_card .act_wish svg.ic_heart2{width:24px;height:24px;fill:none;stroke:none}
.theme_b .prd_card .act_wish[aria-pressed="true"] svg.ic_heart2 path{fill:#e5484d;fill-opacity:1;stroke:#fff;stroke-opacity:.6}
/* 하트 — 사진 오른쪽 아래로, 크기 24 → 20 (10/22). 사진이 정사각이라 카드 폭(cqw)으로 사진 아래 끝을 잡는다. 누르는 곳 44 그대로 */
.theme_b .prd_card{container-type:inline-size}
.theme_b .prd_card .acts{top:calc(100cqw - 44px);right:0}
.theme_b .prd_card .act_wish svg.ic_heart2{width:20px;height:20px}
.theme_b .prd_card .acts{right:-2px}
/* 상품 카드 글 단계 다시 (10/22)
   이름 14/600 · 지운 정가 12/400 · 할인율 13/700(포인트색) · 판매가 16/700 · 원 13/600 · 태그 · 당일출고 12. 카드 안 자간 -0.02 → -0.04em */
.theme_b .prd_card *:not(svg):not(svg *),.theme_b .sale_price *:not(svg){letter-spacing:-.04em!important}
.theme_b .prd_card .name{font-size:14px!important;font-weight:600!important;line-height:20px!important;max-height:40px}
.theme_b .prd_card .price s,.theme_b .sale_price s{font-size:12px!important;font-weight:400!important;line-height:16px}
.theme_b .prd_card .price .now,.theme_b .sale_price .now{font-size:13px!important;font-weight:600!important;line-height:22px}
.theme_b .prd_card .price .now em,.theme_b .sale_price .now em{font-size:13px!important;font-weight:700!important;margin-right:4px}
.theme_b .prd_card .price .now b,.theme_b .sale_price .now b{font-size:16px!important;font-weight:700!important}
/* 메인 배너 멈춤 아이콘 12 → 16 (10/22) */
.lv .lv_ctrl .btn_pause svg{width:16px;height:16px}
/* 밝은 장에서 멈춤 동그라미만 진하던 것(예전 규칙 60% !important가 남아 있었음) → 「1 / 3」 판과 같은 12% (10/22) */
.lv:has(.type_light.is_on) .lv_ctrl .btn_pause::before{background:rgba(34,34,34,.12)!important}
/* 무료 샘플 배너 사진 교체 — 팔 · 다리를 더 넓게 벌린 새 사진(Figma AI 노드 38:2, 원본 img/src-bnr-sample-hifive2.png, 옛 사진은 bnr-sample-hifive-old.webp) (10/22) */
.lv_card .lv_full[src*="bnr-sample-hifive"]{top:-10%;height:110%}
/* 무료 샘플 장 — 글 높이에서 팔 · 다리가 더 바깥으로 벌어져 보이게 사진을 위로(-10% → -17%), 영문 곡선 글도 같이 올림, 큰 제목은 살짝 아래로(76 → 80cqw) (10/22) */
.lv_card .lv_full[src*="bnr-sample-hifive"]{top:-17%;height:117%}
.lv .type_mint .lv_curve{transform:translateY(-7%)}
.lv .type_mint .lv_txt{top:77cqw!important}
/* 무료 샘플 장 — 사진을 올렸더니 손끝이 카드 위로 잘려(10/22) → 손끝이 들어오는 만큼만(-17% → -8%), 영문 곡선 글도 맞춰 내림 */
.lv_card .lv_full[src*="bnr-sample-hifive"]{top:-8%;height:108%}
.lv .type_mint .lv_curve{transform:translateY(2%)}
/* 밸런스키트 페이지 사료 라인 목록 2열 · 간격 세로 24 가로 12 (10/22) */
.theme_b .lf_lines{display:grid;grid-template-columns:1fr 1fr;gap:24px 12px}
/* 밸런스키트 페이지 맨 아래 — 회색 섹션 다음 빈 줄 · 바닥 고정 버튼 뒤 여백이 흰색으로 비치던 것 → 같은 회색 (10/22) */
.theme_b #wrap:has(.lf_page),.theme_b .lf_page ~ .lp_end{background:#f6f6f6}
#wrap.theme_b:has(.lf_page){background:#f6f6f6}
/* 밸런스키트 페이지 「밸런스키트」 꼬리말 → 뱃지 (10/22): 포인트색 옅은 바탕 + 진한 포인트색 글, 알약 둥글기 */
.theme_b .lf_kicker{display:inline-flex;align-items:center;height:26px;padding:0 11px;border-radius:13px;background:var(--pc-tint);color:var(--pc-deep);font-size:13px;font-weight:700;line-height:26px}
/* 페이지 맨 아래 빈 줄(lp_end 24px) 높이 없앰 (10/22) — 밸런스키트 · 무료 샘플 · 따뜻한 한끼 */
.theme_b .lp_end{height:0}
/* 「밸런스키트」 뱃지 회색으로 (10/22) — 회색 섹션(#f6f6f6) 위라 한 단계 진한 회색 바탕 + 진회색 글 */
.theme_b .lf_kicker{background:#e9ebee;color:#3a3f47}
.theme_b .lf_kicker{font-weight:500}
/* 몸무게별 하루 급여량 표 (10/22 상무) */
.feed_tbl{margin:16px 0 12px}
.feed_me{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-radius:12px;background:var(--pc-tint);font-size:14px;color:#3a3f47}
.feed_me b{font-size:18px;font-weight:700;color:var(--pc-deep)}
.feed_tbl table{width:100%;margin-top:12px;border-collapse:collapse;font-size:13px}
.feed_tbl caption{padding-bottom:8px;text-align:left;font-size:14px;font-weight:600;color:#222}
.feed_tbl th,.feed_tbl td{padding:8px 4px;border-bottom:1px solid #eee;text-align:right;font-weight:400;color:#3a3f47}
.feed_tbl th:first-child{text-align:left}
.feed_tbl thead th{font-size:12px;color:#767676}
.feed_tbl tr.on th,.feed_tbl tr.on td{font-weight:700;color:#222}
.feed_tbl tr.on em{margin-left:4px;padding:1px 6px;border-radius:9px;background:var(--pc-tint);color:var(--pc-deep);font-style:normal;font-size:11px;font-weight:700}
.feed_note{margin-top:8px;font-size:12px;line-height:18px;color:#767676}
/* 상세 맨 위 배너(무료 샘플 · 따뜻한 한끼 등)에서는 이름표 꼬리표 숨김 — 메인 배너에만 (10/22) */
.lv_hero .lv_tags{display:none}
/* 밸런스키트 페이지 머리 글 = 따뜻한 한끼 머리 글 구성 (10/22)
   꼬리말 13/700 포인트색 글자 → 제목 24/700 줄 1.36 검정(둘째 줄 색 없음) → 본문 15/400 줄 1.7 회색, 꼬리말 아래 4 · 제목 아래 12. 맨 위 「밸런스키트」 뱃지는 그대로 */
.theme_b .lf_sec .lf_kicker{display:block;height:auto;padding:0;border-radius:0;background:none;color:var(--pc-deep);font-size:13px;font-weight:700;line-height:20.8px}
.theme_b .lf_head h2{margin-top:4px;font-size:24px;font-weight:700;line-height:1.36}
.theme_b .lf_hero .lf_head h2{margin-top:8px}
.theme_b .lf_head h2 em{color:inherit;font-style:normal}
.theme_b .lf_body,.theme_b .lf_head + p,.theme_b .lf_head p:not(.lf_kicker){font-size:15px;font-weight:400;line-height:1.7;color:#4a5260}
/* 따뜻한 한끼 「이렇게 전달해요」(푸터 바로 위 회색 섹션) → 흰 바탕, 카드는 회색 — 회색 섹션 · 흰 여백 · 회색 푸터가 번갈아 애매하게 끊기던 것 (10/22) */
.theme_b .lp_sec.bg_tint:has(+ .lp_end){background:#fff}
.theme_b .lp_sec.bg_tint:has(+ .lp_end) .lp_points > li{background:#f6f6f6}
.theme_b #wrap:has(.lp_sec.bg_tint + .lp_end) .footer{margin-top:0}
/* GNB 「밸런스키트」 강조 — 아이콘 + 진한 포인트색 (10/22) */
.theme_b .gnb_list a.gnb_kit{display:inline-flex;align-items:center;gap:4px;color:var(--pc-deep)!important;font-weight:600}
.theme_b .gnb_list a.gnb_kit.on{font-weight:700;border-bottom-color:var(--pc-deep)!important}
.theme_b .gnb_list .ic_gnb_kit{flex:none;width:18px;height:18px;margin-top:-1px}
/* 글자 화살표를 바꾼 선 아이콘 — 글자 크기를 따라가고 글 가운데 높이에 맞춤 (10/22) */
.theme_b .ic_arrow{display:inline-block;width:1em;height:1em;margin-left:.15em;vertical-align:-.14em;flex:none}
.theme_b i > .ic_arrow:only-child{margin-left:0}
/* 추천 결과 머리 영역 — 검정(--ink) → 연회색 바탕 + 검정 글 (10/22). 밸런스키트 · 따뜻한 한끼와 같은 결, 아래 흰 카드가 회색 위에 얹힘 */
.theme_b .header_sub.type_plain[style*="--ink"]{background:#f6f6f6!important;color:#222!important}
.theme_b .result_visual{background:#f6f6f6;color:#222}
.theme_b .result_visual .txt_date{color:#767676}
.theme_b .result_visual h1 em{color:var(--pc-deep)}
.theme_b .result_summary{box-shadow:0 2px 12px rgba(0,0,0,.06)}
/* 「정기구독」 등 포인트 뱃지 — 진한 바탕에 진한 글이라 안 읽히던 것 → 뱃지 규칙(포인트색 옅은 바탕 + 진한 포인트색 글, 알약) (10/22) */
.theme_b .badge.badge_point{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:12px;background:var(--pc-tint)!important;color:var(--pc-deep)!important;font-size:12px;font-weight:700;line-height:24px}
/* 상품 사진 썸네일 기준 통일 — 회색 칸(#f4f5f7) 안에 사진 60% 가운데, 잘리지 않게 (10/22)
   추천 결과 사료 줄 100% · 밸런스키트 사료 라인 72% · 무료 샘플 구성 81% · 장바구니 100% · 주문 내역(잘라 채움)을 상품 카드와 같게 */
.theme_b .line_thumb{display:grid;place-items:center;background:#f4f5f7}
.theme_b .line_thumb img,.theme_b .lf_lines .th img,.theme_b .lp_sample .img img{width:60%!important;height:60%!important;object-fit:contain!important;margin:auto}
.theme_b .lf_lines .th,.theme_b .lp_sample .img{display:grid;place-items:center}
.theme_b .cart_item > img{box-sizing:border-box;padding:17px;object-fit:contain;background:#f4f5f7}
.theme_b .order_item > img{box-sizing:border-box;padding:11px;object-fit:contain;background:#f4f5f7}
.theme_b .lf_lines .th,.theme_b .lp_sample .img,.theme_b .line_thumb{padding:0!important}
/* 사료 라인 단백질 칩(닭 · 소 · 양) — 아이콘이 22px 포인트색으로 너무 부각되던 것 → 14px 회색, 칩 글 보통 굵기 (10/22) */
.theme_b .line_prot span{gap:3px;padding:3px 9px 3px 6px;font-size:12px;font-weight:500;color:#5f6670}
.theme_b .line_prot svg{width:14px;height:14px;filter:grayscale(1);opacity:.55}
/* GNB 「밸런스키트」 강조 더 확실하게 — 글 700 · 포인트색, 아이콘 20px (10/22) */
.theme_b .gnb_list a.gnb_kit{gap:5px;color:var(--pc)!important;font-weight:700!important}
.theme_b .gnb_list .ic_gnb_kit{width:20px;height:20px;stroke-width:1.8}
/* 추천 결과 영양제 카드 — 「정기구독 시 무료 증정!」 표시를 카드 안 위에 (10/22) */
.theme_b .box_supp{position:relative;flex-wrap:wrap;padding-top:46px}
.theme_b .box_supp .supp_flag{position:absolute;left:16px;top:14px;display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:12px;background:var(--pc);color:#fff;font-style:normal;font-size:12px;font-weight:700;line-height:24px}
.theme_b .box_supp{flex-wrap:nowrap}
/* 단백질 아이콘 선 그림으로 교체 — 흑백 필터 없이 글자색(회색) 그대로, 16px (10/22) */
.theme_b .line_prot svg{width:16px;height:16px;filter:none;opacity:1;color:#5f6670}
/* 안내 박스 — 중요도에 따라 색으로 단계 (10/22). 포인트색 또는 회색만
   1 주의(type_warn, 체중 조절 등): 포인트색 14% 바탕 · 진한 포인트색 글 · 아이콘, 700
   2 알림(type_cold, 냉동 배송 등): 포인트색 6% 바탕 · 진회색 글 · 포인트색 아이콘, 600
   3 참고(type_info, 처방식 상담 등): 회색 바탕 · 회색 글 · 회색 아이콘, 500 */
.theme_b .box_msg.type_warn{background:color-mix(in srgb,var(--pc-raw) 14%,#fff)!important;color:var(--pc-deep)!important;font-weight:700}
.theme_b .box_msg.type_warn span{color:var(--pc-deep)!important}
.theme_b .box_msg.type_warn svg,.theme_b .box_msg.type_warn svg *{color:var(--pc-deep);stroke:var(--pc-deep)!important}
.theme_b .box_msg.type_cold{background:color-mix(in srgb,var(--pc-raw) 6%,#fff)!important;color:#343a40!important;font-weight:600}
.theme_b .box_msg.type_cold svg,.theme_b .box_msg.type_cold svg *{color:var(--pc-deep);stroke:var(--pc-deep)!important;fill:none!important}
.theme_b .box_msg.type_info{background:#f4f5f7!important;color:#5f6670!important;font-weight:500}
.theme_b .box_msg.type_info span{color:#5f6670!important}
.theme_b .box_msg.type_info svg,.theme_b .box_msg.type_info svg *{color:#8a919b;stroke:#8a919b!important}
/* 「정기구독 시 무료 증정!」 — 카드 오른쪽 위, 글 600 (10/22) */
.theme_b .box_supp .supp_flag{left:auto;right:16px;font-weight:600}
.theme_b .gnb_list a.gnb_kit{gap:2px}

/* ---------- 여백 전체 정리 (10/22) — 섹션 안쪽 위아래 48, 같은 바탕 섹션이 붙으면 사이도 48 (두 여백이 겹쳐 100~130이 되던 것) ---------- */
.theme_b .lp_sec,.theme_b .lf_sec{padding-top:48px;padding-bottom:48px}
/* 같은 바탕끼리 붙으면 아래 섹션 위 여백 없앰 */
.theme_b .lp_sec:not(.bg_tint) + .lp_sec:not(.bg_tint),
.theme_b .lp_sec + .lp_sec.bg_tint:has(+ .lp_end),
.theme_b .lf_sec.type_white + .lf_sec.type_white,
.theme_b .lf_sec:not(.type_white) + .lf_sec:not(.type_white),
.theme_b .pd2_sec:not(.bg_gray) + .pd2_sec:not(.bg_gray),
.theme_b .pd2_sec.bg_gray + .pd2_sec.bg_gray{padding-top:0}
/* 무료 샘플 「받는 분」 — 위 흰 섹션과 48 */
.theme_b .lp_sec + .form_sec{padding-top:0}
/* 밸런스키트 예시 그림 — 위 글과 18 → 48 */
.theme_b .lf_flow{margin-top:30px}
/* 메인 무료 샘플 배너 → 베스트 상품 30 → 60 (10/30) */
.theme_b .sb3_sec + .flow_isc > section:first-child{margin-top:60px}
.theme_b #content .sb3_sec + .flow_isc > section:first-child{margin-top:60px!important}
/* 카테고리 화면 오른쪽 칸 — 제목과 메뉴 구분 (10/22)
   제목(연령 · 종류 · 크기 · 단백질) = 작은 회색 이름표 12px 600 / 메뉴 = 테두리 알약 버튼(높이 36, 누르는 곳 44) / 묶음 사이 구분선 */
.theme_b .menu_grp{margin-top:0;padding:16px 0;border-top:1px solid #f0f1f3}
.theme_b .menu_all + .menu_grp{border-top:0}
.theme_b .menu_grp b{font-size:12px!important;font-weight:600!important;color:#8a919b;letter-spacing:.02em!important}
.theme_b .menu_grp div{gap:8px 6px;margin-top:10px}
.theme_b .menu_grp a{position:relative;display:inline-flex;align-items:center;height:36px;padding:0 13px;border:1px solid #e1e4e8;border-radius:18px;background:#fff;font-size:14px;color:#222}
.theme_b .menu_grp a::before{content:"";position:absolute;inset:-4px 0}
@media (hover:hover){.theme_b .menu_grp a:hover{border-color:#222}}
.theme_b .menu_grp a:active{background:#f4f5f7}
.theme_b .menu_all{border-bottom:1px solid #e1e4e8;font-size:16px}
/* 1:1 문의 — 목록 · 문의하기 (10/22). 규칙: 제목 16 · 본문 15 · 보조 13 · 작은 글 12 / 카드 12 · 버튼 8 · 누르는 곳 44 */
.qna{padding:20px 20px 32px}
.qna_lead{font-size:15px;line-height:1.6;color:#4a5260}
.qna_top{display:flex;justify-content:space-between;align-items:center;margin-top:24px;padding-bottom:10px;border-bottom:1px solid #222;font-size:14px;color:#5f6670}
.qna_top b{color:#222}
.qna_list{list-style:none;margin:0;padding:0}
.qna_list li{border-bottom:1px solid #eceef1}
.qna_list summary{display:grid;gap:6px;padding:16px 0;cursor:pointer;list-style:none;min-height:44px}
.qna_list summary::-webkit-details-marker{display:none}
.qna_list summary:focus-visible{outline:2px solid #222;outline-offset:2px;border-radius:4px}
.qna_meta{display:flex;align-items:center;gap:8px;font-size:12px;color:#767676}
.qna_st{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:11px;background:#f1f2f4;color:#5f6670;font-size:12px;font-weight:600}
.qna_st.type_done{background:var(--pc-tint);color:var(--pc-deep)}
.qna_tit{font-size:16px;font-weight:600;line-height:1.45;color:#222}
.qna_date{font-size:13px;color:#8a919b}
.qna_body{padding:0 0 16px}
.qna_q{padding:14px 16px;border-radius:12px;background:#f6f6f6;font-size:15px;line-height:1.6;color:#343a40}
.qna_a{margin-top:8px;padding:14px 16px;border-radius:12px;background:color-mix(in srgb,var(--pc-raw) 6%,#fff)}
.qna_a_lb{display:block;margin-bottom:4px;font-size:13px;font-weight:600;color:var(--pc-deep)}
.qna_a p{font-size:15px;line-height:1.6;color:#343a40}
.qna_wait{margin-top:8px;font-size:13px;line-height:1.6;color:#767676}
.qna_note{margin-top:24px}
.qna_form{padding:4px 20px 32px}
.qna_form fieldset{border:0;margin:24px 0 0;padding:0;min-width:0}
.qna_lb{display:block;margin-bottom:10px;padding:0;font-size:15px;font-weight:600;color:#222}
.qna_lb em{margin-left:4px;font-style:normal;font-size:12px;font-weight:600;color:var(--pc-deep)}
.qna_opt{margin-left:4px;font-size:12px;font-weight:500;color:#8a919b}
.qna_types{display:flex;flex-wrap:wrap;gap:8px}
.qna_type_opt{position:relative;cursor:pointer}
.qna_type_opt input{position:absolute;opacity:0;width:1px;height:1px}
.qna_type_opt span{display:inline-flex;align-items:center;height:40px;padding:0 14px;border:1px solid #e1e4e8;border-radius:20px;background:#fff;font-size:14px;color:#343a40}
.qna_type_opt input:checked + span{border-color:#222;background:#222;color:#fff}
.qna_type_opt input:focus-visible + span{outline:2px solid #222;outline-offset:2px}
.qna_form .input_txt{height:52px;border-radius:8px;font-size:15px}
.qna_select{appearance:none;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235f6670' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center/18px}
.qna_form textarea.qna_text{height:180px;padding:14px 16px;line-height:1.6;resize:vertical}
.qna_count{margin-top:6px;text-align:right;font-size:12px;color:#8a919b}
.qna_photo{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:80px;height:80px;border:1px dashed #c9ced6;border-radius:12px;background:#fafafa;color:#5f6670;font-size:12px}
.qna_photo svg{width:20px;height:20px}
.qna_agree{display:flex;align-items:center;gap:8px;min-height:44px;margin-top:20px;font-size:14px;color:#343a40}
.qna_agree input{width:20px;height:20px;accent-color:var(--pc)}
.qna_err{margin-top:12px;font-size:14px;font-weight:600;color:#d1242f}
/* 마이 목록 — 묶음 제목과 메뉴 줄 구분 (10/22): 묶음 사이 회색 띠 8 · 제목 13px 600 회색(줄 없음) · 메뉴 줄 15px 보통 굵기 흰 바탕 + 옅은 화살표 */
.theme_b .tit_menu:not(.tit_pets){margin-top:8px;padding:20px 20px 6px;border-top:8px solid #f6f6f6;font-size:13px!important;font-weight:600!important;color:#8a919b;letter-spacing:.02em!important}
.theme_b .list_menu a,.theme_b .list_menu button{min-height:52px;padding:0 20px;font-size:15px;font-weight:400;color:#222;border-bottom:1px solid #f0f1f3}
.theme_b .list_menu a svg,.theme_b .list_menu button svg{width:16px;height:16px;color:#b0b5bc}
.theme_b .list_menu a:active,.theme_b .list_menu button:active{background:#f6f6f6}
.theme_b .img_profile{width:52px;height:52px;padding:0;border-radius:50%;background:none;overflow:hidden;flex:none}
.theme_b .img_profile .avatar_def{display:block;width:100%;height:100%}
.theme_b .header_inner{gap:0}
/* 동의 체크박스 — 20px 칸 · 체크하면 포인트색 채움 + 흰 체크 · 줄 전체가 누르는 곳(44) (10/22) */
.theme_b label.chk_agree{align-items:center;min-height:44px;padding:0;cursor:pointer}
.theme_b .chk_in{appearance:none;-webkit-appearance:none;flex:none;width:22px;height:22px;margin:0;border:1.5px solid #c9ced6;border-radius:6px;background:#fff;cursor:pointer;transition:background .15s,border-color .15s}
.theme_b .chk_in:checked{border-color:var(--pc);background:var(--pc) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") no-repeat center/16px}
.theme_b .chk_in:focus-visible{outline:2px solid #222;outline-offset:2px}
/* 결제수단 버튼 — 마우스 올리면 포인트색 테두리 · 글 (10/22) */
.theme_b .pay_list > button,.theme_b .pay_list > a{transition:border-color .15s,color .15s}
/* 모바일이라 마우스 올림 대신: 누르는 순간(:active) · 고른 수단(.on) = 포인트색 테두리 · 글 · 옅은 바탕 */
.theme_b .pay_list > button:active,.theme_b .pay_list > a:active,.theme_b .pay_list > button.on,.theme_b .pay_list > a.on{border-color:var(--pc)!important;color:var(--pc-deep)!important;background:var(--pc-tint)!important}
.theme_b .pay_list > button:focus-visible,.theme_b .pay_list > a:focus-visible{outline:2px solid var(--pc);outline-offset:2px}
.theme_b .header .logo_img,.logo_img{display:block;width:132px;height:20px}
/* 아이콘 메뉴 — 펫프렌즈 컨셉 (10/23) */
.theme_b .lq_pf .cate_list{padding:0 7.3333%;gap:16px 12px}
.theme_b .lq_pf .cate_item{font-size:13px;font-weight:500;line-height:18px;min-height:44px}
.theme_b .lq_pf .cate_item .cate_ico{border-radius:16px;background:#fff!important;border:1px solid #e6e8eb}
.theme_b .lq_pf .cate_item:focus-visible{outline:2px solid #222;outline-offset:2px;border-radius:16px}