/* MONS v30 — 상세 페이지 정리 (Claude, 2026-10-02)
   헤더, 푸터, 홈, 색상 체계는 건드리지 않음. */

/* 흰색 상품이 크림색 배경에 묻히지 않도록 그림자를 조금 진하게 */
.mons-detail-standard.page-main .mons-photo-frame:not(.mons-photo-closeup) img{
  filter:drop-shadow(0 10px 12px rgba(48,35,24,.20)) drop-shadow(0 1px 2px rgba(48,35,24,.22))!important}

/* 작은 태그 글씨 키우기 (사이즈, 소재 등) */
.mons-detail-standard .product-detail-meta span,
.mons-detail-standard .sock-sizes span,
.mons-detail-standard .shuttle-meta span{
  font-size:11px!important;padding:8px 11px!important;letter-spacing:.06em!important;line-height:1.3!important}

/* 티셔츠: 작은 그림을 뺐으니 설명을 한 칸으로 */
.mons-detail-standard .product-detail{display:block!important}
.mons-detail-standard .product-gallery{margin-top:8px}

/* 양말: 색상 이름이 사진 위로 */
.mons-detail-standard .sock-colour-item .sock-info{margin:0 0 20px!important;padding-top:8px!important}
.mons-detail-standard .sock-colour-item{margin-top:16px!important}
.mons-detail-standard.socks-page .sock-lineup{margin:8px auto 28px!important}

/* 남성 가방: 사진 4장을 한 줄에 */
@media(min-width:769px){
  .mons-detail-standard .mens-full-detail .mons-photo-grid>figure{
    flex:0 0 calc((100% - 72px)/4)!important;width:calc((100% - 72px)/4)!important}
}

/* 휴대폰: 모든 상세 페이지 사진을 옆으로 넘기기 */
@media(max-width:768px){
  .mons-detail-standard .mons-photo-grid.mons-carousel{
    display:flex!important;flex-wrap:nowrap!important;justify-content:flex-start!important;
    gap:12px!important;overflow-x:auto!important;scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;overscroll-behavior-x:contain}
  .mons-detail-standard .mons-photo-grid.mons-carousel::-webkit-scrollbar{display:none}
  .mons-detail-standard .mons-photo-grid.mons-carousel>figure{
    flex:0 0 100%!important;width:100%!important;scroll-snap-align:start}

  /* 라켓 사진 틀: 화면 폭을 채우되, 가격이 첫 화면에 보이도록 높이 제한 */
  .mons-detail-standard .racket-photo-grid .mons-photo-frame,
  .mons-detail-standard .racket-photo-grid figcaption{
    width:min(100%,calc(50svh * .8))!important}

  .mons-detail-standard .sock-colour-item{margin-top:8px!important}
}

/* 테두리 상자 없애기: 상품 묶음은 배경판·테두리 없이 여백과 얇은 구분선으로만 나눔 */
.mons-detail-standard .racket-item,
.mons-detail-standard .sock-colour-item,
.mons-detail-standard .bag-detail,
.mons-detail-standard .product-detail,
.mons-detail-standard .shuttle-info{
  background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important}
.mons-detail-standard .racket-item + .racket-item,
.mons-detail-standard .sock-colour-item + .sock-colour-item{
  margin-top:56px!important;padding-top:48px!important;border-top:1px solid rgba(0,44,16,.14)!important}
.mons-detail-standard .sock-colour-item .sock-info{border-top:0!important}
.mons-detail-standard .racket-info{padding-top:4px}

/* 라켓 사양: 칸마다 상자 대신 깔끔한 표 형태 */
.mons-detail-standard .racket-spec-grid{gap:0 28px!important;margin-top:20px}
.mons-detail-standard .racket-spec-grid>div{
  background:transparent!important;border:0!important;border-top:1px solid rgba(0,44,16,.14)!important;
  padding:12px 0!important}
.mons-detail-standard .racket-spec-grid dt{font-size:10px!important;opacity:.8}
.mons-detail-standard .racket-spec-grid dd{font-size:14px!important}

/* 사이즈·소재 태그: 테두리 상자 대신 은은한 알약 모양 */
.mons-detail-standard .product-detail-meta span,
.mons-detail-standard .sock-sizes span,
.mons-detail-standard .shuttle-meta span{
  border:0!important;border-radius:999px!important;background:rgba(0,44,16,.07)!important}

@media(max-width:768px){
  .mons-detail-standard .racket-item + .racket-item,
  .mons-detail-standard .sock-colour-item + .sock-colour-item{margin-top:8px!important;padding-top:32px!important}
}

/* 사진 틀(크림색 네모) 없애기: 누끼 상품은 페이지 배경 위에 바로 놓이게 */
.mons-detail-standard.page-main .mons-photo-frame,
.mons-detail-standard .mons-photo-frame .mons-photo-zoom{background:transparent!important}
.mons-detail-standard .mons-photo-frame:not(.mons-photo-closeup) img{background-image:none!important}
/* 배경까지 찍힌 클로즈업 사진은 '사진'답게 모서리만 살짝 둥글게 */
.mons-detail-standard .mons-photo-frame.mons-photo-closeup{border-radius:6px;overflow:hidden!important}

/* 모든 상세 페이지 맨 위 메뉴 줄 색을 페이지 배경과 같게 (가방 페이지만 밝게 나오던 문제) */
body:has(.mons-detail-standard) .site-header{background:rgb(232,208,184)!important}

/* 양말 대표 사진 뒤 연한 네모 제거 */
.mons-detail-standard .sock-lineup{background:transparent!important;border:0!important}

/* 'VIEW FULL SCREEN' 버튼: 검정 상자 대신 작고 은은한 둥근 버튼 */
.mons-detail-standard .mons-photo-frame .mons-photo-zoom-hint{
  background:rgba(244,240,234,.85)!important;color:#102119!important;border:1px solid rgba(0,44,16,.15)!important;
  border-radius:999px!important;padding:6px 11px!important;font-size:9px!important;letter-spacing:.08em!important;
  box-shadow:0 2px 8px rgba(48,35,24,.10)!important}

/* 셔틀콕: 두 통을 실제 길이 비율대로(하프 = 풀의 약 69%) 같은 바닥선에 세우기 */
.mons-detail-standard .mons-photo-frame.shuttle-full img,
.mons-detail-standard .mons-photo-frame.shuttle-half img{
  top:auto!important;bottom:9%!important;transform:translateX(-50%)!important;
  width:auto!important;max-width:none!important;max-height:none!important}
.mons-detail-standard .mons-photo-frame.shuttle-full img{height:78%!important}
.mons-detail-standard .mons-photo-frame.shuttle-half img{height:54%!important}
/* 셔틀콕 가격·버튼: 이름 아래 두 줄로 */
.mons-detail-standard .shuttle-options{display:grid;gap:14px;margin:18px 0 22px;max-width:520px}
.mons-detail-standard .shuttle-option{display:grid;grid-template-columns:1fr auto;align-items:center;gap:6px 16px;
  padding-top:14px;border-top:1px solid rgba(0,44,16,.14)}
.mons-detail-standard .shuttle-option-name{font-size:13px;font-weight:700}
.mons-detail-standard .shuttle-option .product-price{margin:0!important;text-align:right}
.mons-detail-standard .shuttle-option .product-whatsapp{grid-column:1 / -1;justify-self:start}
.mons-detail-standard .shuttle-product-gallery{justify-content:center!important}

/* 라켓: 사양표를 옆이 아니라 아래로 (다른 상세 페이지와 같은 흐름) */
.mons-detail-standard .racket-info{display:block!important}
.mons-detail-standard .racket-spec-grid{max-width:560px;margin-top:28px!important}

/* 크게 보기 화면: 하프 더즌이 혼자 확대돼 보이지 않게 풀 더즌과 같은 비율로 (하프 ≈ 풀의 69%) */
.mons-photo-viewer-image[src*='black-label-full-dozen']{max-height:calc((100dvh - 166px) * .86)!important}
.mons-photo-viewer-image[src*='black-label-half-dozen']{max-height:calc((100dvh - 166px) * .59)!important}

/* 사진을 눌러도 바로 크게 보기가 열리지 않고, 'VIEW FULL SCREEN' 버튼을 눌렀을 때만 열리게 */
.mons-detail-standard .mons-photo-frame .mons-photo-zoom{pointer-events:none!important;cursor:default!important}
.mons-detail-standard .mons-photo-frame .mons-photo-zoom-hint{pointer-events:auto!important;cursor:pointer!important;
  min-height:30px;display:inline-flex!important;align-items:center}
.mons-detail-standard .mons-photo-frame .mons-photo-zoom-hint:hover{background:#102119!important;color:#f4f0ea!important}

/* 전체 화면 확대 중에는 손바닥(끌기) 커서, 확대 안내 문구 */
.mons-photo-lightbox .mons-photo-viewer-stage{cursor:zoom-in;user-select:none;-webkit-user-select:none}
.mons-photo-lightbox.mons-zoomed .mons-photo-viewer-stage{cursor:grab}
.mons-photo-lightbox .mons-photo-viewer-image{will-change:transform}
.mons-photo-lightbox .mons-photo-caption::after{content:' · Pinch or double-tap to zoom';opacity:.55;font-size:.85em}
@media(hover:hover){.mons-photo-lightbox .mons-photo-caption::after{content:' · Scroll or double-click to zoom'}}
.mons-photo-lightbox.mons-zoomed .mons-photo-caption::after{content:' · Double-tap to reset'}
html[lang=ko] .mons-photo-lightbox .mons-photo-caption::after{content:' · 두 손가락으로 벌리거나 두 번 탭해서 확대'}
@media(hover:hover){html[lang=ko] .mons-photo-lightbox .mons-photo-caption::after{content:' · 스크롤하거나 더블클릭해서 확대'}}
html[lang=ko] .mons-photo-lightbox.mons-zoomed .mons-photo-caption::after{content:' · 두 번 탭하면 원래 크기'}

/* ===== ON COURT / OFF COURT 목록 카드 ===== */
/* 공통: 테두리 상자·배경판 없애고, 제목 줄 간격을 넉넉하게 (두 줄로 꺾여도 겹치지 않게) */
.page-main .icon-grid .product-icon-card{
  background:transparent!important;border:0!important;box-shadow:none!important;text-decoration:none}
.page-main .icon-grid .product-icon-card .product-icon-label strong{
  line-height:1.05!important;overflow-wrap:anywhere;word-break:keep-all}
.page-main .icon-grid .product-icon-card .product-icon-label span{line-height:1.45!important}
.page-main .icon-grid .product-icon-stage{background:rgba(255,253,249,.35)!important;border-radius:8px}
.page-main .icon-grid .product-icon-card:hover .product-icon-stage{background:rgba(255,253,249,.6)!important}

/* 휴대폰: 한 줄에 한 상품 — 왼쪽 그림, 오른쪽 이름·설명·가격 */
@media(max-width:768px){
  .page-main .icon-grid{display:block!important}
  .page-main .icon-grid .product-icon-card{
    display:grid!important;grid-template-columns:104px minmax(0,1fr) 20px!important;grid-template-rows:auto auto!important;
    align-items:center!important;column-gap:16px!important;row-gap:2px!important;
    padding:16px 0!important;border-top:1px solid rgba(0,44,16,.14)!important;text-align:left!important}
  .page-main .icon-grid .product-icon-card:last-child{border-bottom:1px solid rgba(0,44,16,.14)!important}
  .page-main .icon-grid .product-icon-card>*{width:auto!important;text-align:left!important;justify-self:stretch!important}
  .page-main .icon-grid .product-icon-stage{grid-column:1;grid-row:1 / span 2;width:104px!important;height:104px!important;min-height:0!important;
    display:grid!important;place-items:center!important}
  .page-main .icon-grid .product-icon-stage img,.page-main .icon-grid .product-icon-stage picture{max-width:84px!important;max-height:84px!important;width:auto!important;height:auto!important}
  .page-main .icon-grid .product-icon-label{grid-column:2;grid-row:1;align-self:end;margin:0!important}
  .page-main .icon-grid .product-icon-label strong{font-size:30px!important;display:block}
  .page-main .icon-grid .product-icon-label span{display:block;margin-top:4px;font-size:13px!important}
  .page-main .icon-grid .product-price{grid-column:2;grid-row:2;align-self:start;margin:6px 0 0!important;font-size:15px!important;line-height:1.4!important;text-align:left!important}
  .page-main .icon-grid .product-icon-card::after{content:'→'!important;display:block!important;position:static!important;
    grid-column:3;grid-row:1 / span 2;color:#A41C08;font-size:18px;line-height:1}
}
@media(max-width:768px){
  .page-main .icon-grid .product-icon-card{align-content:center!important}
  .page-main .icon-grid .product-icon-card .product-icon-label,
  .page-main .icon-grid .product-icon-card .product-icon-label *{text-align:left!important}
  .page-main .icon-grid .product-icon-card .product-icon-label strong{font-size:28px!important;line-height:1.05!important}
  .page-main .icon-grid .product-icon-stage{align-self:center!important}
}
@media(max-width:768px){
  .page-main .icon-grid .product-icon-card .product-icon-label{display:block!important}
  .page-main .icon-grid .product-icon-card{padding:18px 0!important;min-height:0!important}
}
/* 상세 페이지 큰 제목 위아래 여유 */
.mons-detail-standard .bag-detail-copy h1,.mons-detail-standard .shuttle-info h1{margin:8px 0 12px!important;line-height:.95!important}

/* ===== 목록 카드 v2: 브랜드 색 블록 + 크림색 원 위의 큰 그림 + 번호 ===== */
.world-on{--world:#A41C08;--world-hover:#8e1806}
.world-off{--world:#002C10;--world-hover:#0a3d1d}
.page-main .icon-grid{counter-reset:item}
.page-main .icon-grid .product-icon-card{counter-increment:item;position:relative!important;overflow:hidden!important;
  background:var(--world)!important;color:#F4EDE4!important;border:0!important;border-radius:14px!important;
  transition:transform .2s ease,background-color .2s ease!important}
.page-main .icon-grid .product-icon-card:hover{background:var(--world-hover)!important;transform:translateY(-3px)}
.page-main .icon-grid .product-icon-card::before{content:'0' counter(item)!important;position:absolute;top:16px;left:18px;
  font-family:var(--display);font-size:15px;letter-spacing:.12em;color:rgba(244,237,228,.65);z-index:2}
.page-main .icon-grid .product-icon-stage{background:#F4EDE4!important;border-radius:50%!important;
  box-shadow:0 14px 26px rgba(0,0,0,.22)!important;animation:mons-card-float 4s ease-in-out infinite}
.page-main .icon-grid .product-icon-card:nth-child(2) .product-icon-stage{animation-delay:-1.3s}
.page-main .icon-grid .product-icon-card:nth-child(3) .product-icon-stage{animation-delay:-2.6s}
.page-main .icon-grid .product-icon-card .product-icon-label strong{color:#F4EDE4!important}
.page-main .icon-grid .product-icon-card .product-icon-label span{color:rgba(244,237,228,.78)!important}
.page-main .icon-grid .product-icon-card .product-price{color:var(--world)!important;background:#F4EDE4!important;
  border-radius:999px!important;padding:6px 14px!important;font-weight:800!important;width:max-content!important;max-width:100%}
@keyframes mons-card-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@media(prefers-reduced-motion:reduce){.page-main .icon-grid .product-icon-stage{animation:none}}

/* 데스크톱: 세 칸, 원은 카드 위쪽 가운데 */
@media(min-width:769px){
  .page-main .icon-grid{gap:20px!important}
  .page-main .icon-grid .product-icon-card{padding:44px 22px 28px!important;grid-template-rows:auto auto auto!important;gap:18px!important}
  .page-main .icon-grid .product-icon-stage{width:190px!important;height:190px!important;min-height:0!important;margin:0 auto!important;display:grid!important;place-items:center!important}
  .page-main .icon-grid .product-icon-stage img{max-width:130px!important;max-height:130px!important}
  .page-main .icon-grid .product-icon-card .product-icon-label strong{font-size:40px!important}
  .page-main .icon-grid .product-icon-card .product-price{margin:4px auto 0!important}
}

/* 휴대폰: 한 줄에 하나, 큰 색 카드 — 왼쪽 원 그림, 오른쪽 글 */
@media(max-width:768px){
  .page-main .icon-grid .product-icon-card{grid-template-columns:118px minmax(0,1fr) 18px!important;
    padding:34px 16px 22px 14px!important;margin:0 0 12px!important;border-top:0!important;border-bottom:0!important}
  .page-main .icon-grid .product-icon-card:last-child{border-bottom:0!important}
  .page-main .icon-grid .product-icon-stage{width:118px!important;height:118px!important}
  .page-main .icon-grid .product-icon-stage img,.page-main .icon-grid .product-icon-stage picture{max-width:86px!important;max-height:86px!important}
  .page-main .icon-grid .product-icon-card .product-icon-label strong{font-size:34px!important}
  .page-main .icon-grid .product-icon-card .product-price{font-size:14px!important;margin-top:10px!important}
  .page-main .icon-grid .product-icon-card::after{color:#F4EDE4!important}
}
/* v2 다듬기: 원 안 그림 크게, 제목은 단어 중간에서 끊지 않기, 긴 가격은 줄바꿈 */
.page-main .icon-grid .product-icon-stage img{width:72%!important;height:72%!important;max-width:none!important;max-height:none!important;object-fit:contain!important}
.page-main .icon-grid .product-icon-stage picture{display:contents!important}
.page-main .icon-grid .product-icon-card .product-icon-label strong{overflow-wrap:normal!important;word-break:normal!important;hyphens:none}
.page-main .icon-grid .product-icon-card .product-price{white-space:normal!important;width:auto!important;border-radius:16px!important;line-height:1.35!important}
@media(min-width:769px){.page-main .icon-grid .product-icon-card .product-price{width:max-content!important}}
@media(max-width:768px){
  .page-main .icon-grid .product-icon-card{grid-template-columns:108px minmax(0,1fr) 16px!important;column-gap:14px!important}
  .page-main .icon-grid .product-icon-stage{width:108px!important;height:108px!important}
  .page-main .icon-grid .product-icon-stage img{width:74%!important;height:74%!important}
  .page-main .icon-grid .product-icon-card .product-icon-label strong{font-size:clamp(24px,8vw,34px)!important}
  .page-main .icon-grid .product-icon-card .product-price{justify-self:start!important}
}
.page-main .icon-grid .product-icon-card .product-price{display:block!important;height:auto!important;min-height:0!important;padding:7px 14px!important;line-height:1.3!important;margin-bottom:0!important}

/* ===== 홈 ON/OFF COURT 카드: 만화풍 'CLICK!' 효과음 말풍선 (카드와 반대 색) ===== */
.category-card{position:relative}
.mons-click-burst{position:absolute;top:22px;right:20px;z-index:3;width:118px;height:118px;display:grid;place-items:center;pointer-events:none;
  --b-bg:#002C10;--b-fg:#F4EDE4;--b-edge:#F4EDE4;
  clip-path:polygon(50% 0%,61% 18%,79% 7%,79% 28%,98% 26%,86% 43%,100% 57%,81% 64%,88% 84%,67% 79%,60% 100%,48% 84%,32% 98%,30% 78%,9% 85%,17% 65%,0% 54%,16% 41%,4% 23%,24% 25%,23% 5%,40% 17%);
  background:var(--b-edge);animation:mons-burst 1.25s cubic-bezier(.3,1.6,.5,1) infinite;transform-origin:50% 50%}
.mons-click-burst::before{content:'';position:absolute;inset:6px;background:var(--b-bg);clip-path:inherit}
.mons-click-burst span{position:relative;font-family:'Bebas Neue',Impact,sans-serif;font-size:30px;letter-spacing:.04em;line-height:1;color:var(--b-fg);
  transform:rotate(-12deg);text-shadow:2px 2px 0 rgba(0,0,0,.25)}
/* 빨간 ON COURT 카드엔 진초록, 초록 OFF COURT 카드엔 빨강 */
.category-card--court .mons-click-burst{--b-bg:#002C10}
.category-card--street .mons-click-burst{--b-bg:#A41C08;animation-delay:-.6s}
@keyframes mons-burst{
  0%{transform:scale(.82) rotate(-8deg)}
  18%{transform:scale(1.12) rotate(6deg)}
  32%{transform:scale(.96) rotate(-3deg)}
  46%,100%{transform:scale(1) rotate(0deg)}}
.category-card:hover .mons-click-burst{animation-duration:.6s}
@media(max-width:620px){.mons-click-burst{width:92px;height:92px;top:16px;right:14px}.mons-click-burst span{font-size:24px}}
@media(prefers-reduced-motion:reduce){.mons-click-burst{animation:none}}
/* 카드의 기존 span 규칙에 말풍선 크기가 덮이지 않게 고정 */
#shop .category-card>.mons-click-burst{position:absolute!important;top:22px!important;right:20px!important;left:auto!important;width:118px!important;height:118px!important;max-width:none!important;margin:0!important;align-self:auto!important;padding:0!important}
.category-card .mons-click-burst span{font-size:30px!important;max-width:none!important;align-self:auto!important;color:var(--b-fg)!important;font-weight:400!important;letter-spacing:.04em!important}
@media(max-width:620px){#shop .category-card>.mons-click-burst{width:96px!important;height:96px!important;top:14px!important;right:14px!important}.category-card .mons-click-burst span{font-size:25px!important}}
/* CLICK ME! 두 줄 */
.category-card .mons-click-burst span{font-size:27px!important;line-height:.9!important;text-align:center}
@media(max-width:620px){.category-card .mons-click-burst span{font-size:22px!important}}
/* ===== v33 홈 카드: 제품 아이콘 모음 그림 ===== */
#shop .category-card{grid-template-rows:auto auto auto 1fr!important}
#shop .category-card .mons-gear-art{display:flex!important;align-items:flex-end;justify-content:center;width:100%;height:auto!important;min-height:0!important;align-self:end!important;position:static!important;padding-top:22px}
#shop .category-card .mons-gear-art img{display:block;width:auto!important;max-width:100%!important;height:auto!important;max-height:300px;object-fit:contain;transform:none!important;animation:none!important;transition:transform .35s ease!important}
#shop .category-card:hover .mons-gear-art img{transform:translateY(-6px) scale(1.02)!important}
@media(max-width:620px){#shop .category-card .mons-gear-art img{max-height:220px}}
/* ===== v34 홈 카드: 아이콘 하나씩 나란히 + 둥실둥실 떠다니기 ===== */
#shop .category-card .mons-float-art{display:flex!important;align-items:flex-end;justify-content:center;gap:clamp(14px,3vw,34px);width:100%;height:clamp(170px,22vw,250px)!important;min-height:0!important;align-self:end!important;position:static!important;margin-top:26px;padding-bottom:18px}
#shop .category-card .mons-float{position:relative;display:flex;align-items:flex-end;justify-content:center;height:var(--h);font-style:normal}
#shop .category-card .mons-float img{display:block;height:100%!important;width:auto!important;max-width:none!important;object-fit:contain;position:relative;z-index:1;
  animation:mons-float 3.6s ease-in-out infinite;animation-delay:var(--d);filter:drop-shadow(0 6px 6px rgba(0,0,0,.18));transform:none}
/* 바닥 그림자: 아이콘이 올라가면 작아지고 흐려짐 */
#shop .category-card .mons-float::after{content:'';position:absolute;left:50%;bottom:-12px;width:72%;height:12px;border-radius:50%;background:rgba(0,0,0,.28);filter:blur(4px);transform:translateX(-50%);
  animation:mons-float-shadow 3.6s ease-in-out infinite;animation-delay:var(--d)}
@keyframes mons-float{0%,100%{transform:translateY(0) rotate(-1.5deg)}50%{transform:translateY(-14px) rotate(1.5deg)}}
@keyframes mons-float-shadow{0%,100%{transform:translateX(-50%) scaleX(1);opacity:1}50%{transform:translateX(-50%) scaleX(.72);opacity:.55}}
#shop .category-card:hover .mons-float img{animation-duration:1.6s}
#shop .category-card:hover .mons-float::after{animation-duration:1.6s}
@media(max-width:620px){#shop .category-card .mons-float-art{height:165px!important;gap:16px}}
@media(prefers-reduced-motion:reduce){#shop .category-card .mons-float img,#shop .category-card .mons-float::after{animation:none}}
/* v34 크기 보정: 줄 높이 하나(--row)에 맞춰 각 아이콘 높이를 비율로 */
#shop .category-card .mons-float-art{--row:clamp(110px,30vw,200px);height:auto!important;gap:clamp(10px,2.4vw,30px)!important}
#shop .category-card .mons-float{height:auto!important;flex:0 0 auto}
#shop .category-card .mons-float img{height:calc(var(--row) * var(--h))!important;width:auto!important}
@media(max-width:620px){#shop .category-card .mons-float-art{height:auto!important}}
/* 목록 페이지(온코트/오프코트) 동그라미는 움직이지 않게 — 움직임은 홈 화면 아이콘만 */
.page-main .icon-grid .product-icon-stage{animation:none!important;transform:none!important}
/* v34 보정: 예전 규칙(transform:none!important)에 막히지 않도록 translate/rotate 속성으로 움직임 */
@keyframes mons-float2{0%,100%{translate:0 0;rotate:-1.5deg}50%{translate:0 -14px;rotate:1.5deg}}
@keyframes mons-float2-soft{0%,100%{translate:0 0}50%{translate:0 -6px}}
#shop .category-card .mons-float img{animation:mons-float2 3.6s ease-in-out infinite!important;animation-delay:var(--d)!important}
#shop .category-card:hover .mons-float img{animation-duration:1.6s!important}
/* 휴대폰 '애니메이션 줄이기'를 켠 경우에도 아주 살짝만 떠다니게 */
@media(prefers-reduced-motion:reduce){
  #shop .category-card .mons-float img{animation:mons-float2-soft 4.5s ease-in-out infinite!important;animation-delay:var(--d)!important}
  #shop .category-card .mons-float::after{animation:none!important}}
/* 목록 카드: 크림색 동그라미 없애고 아이콘만 크게 */
.page-main .icon-grid .product-icon-stage{background:transparent!important;box-shadow:none!important;border-radius:0!important}
.page-main .icon-grid .product-icon-stage img{width:100%!important;height:100%!important;filter:drop-shadow(0 8px 10px rgba(0,0,0,.28))}
@media(min-width:769px){.page-main .icon-grid .product-icon-stage{width:210px!important;height:210px!important}}
@media(max-width:768px){.page-main .icon-grid .product-icon-stage img{width:112%!important;height:112%!important;max-width:none!important}}
/* 예전 규칙(66% 고정)보다 강하게: 아이콘 크게 */
body.world-catalog .page-main .icon-grid .product-icon-stage img.mons-product-icon{width:100%!important;max-width:none!important;height:100%!important;max-height:none!important;object-fit:contain!important}
@media(max-width:768px){body.world-catalog .page-main .icon-grid .product-icon-stage img.mons-product-icon{width:118%!important;height:118%!important;margin:-9%!important}}
@media(max-width:768px){body.world-catalog .page-main .icon-grid .product-icon-stage img.mons-product-icon{width:106%!important;height:106%!important;margin:-3% 0 0 2%!important}}
/* ===== v35 홈 아이콘: 물건마다 다른 동작을 차례로 (4.8초 주기) ===== */
#shop .category-card .mons-float img{animation-duration:4.8s!important;animation-iteration-count:infinite!important;animation-delay:var(--d)!important;animation-timing-function:linear!important;transform-origin:50% 100%}
#shop .category-card .mons-float::after{animation:none!important}
#shop .category-card .mons-act--racket img{animation-name:act-swing!important;transform-origin:50% 88%!important}
#shop .category-card .mons-act--socks img{animation-name:act-hop!important}
#shop .category-card .mons-act--shuttlecock img{animation-name:act-flip!important;transform-origin:50% 55%!important}
#shop .category-card .mons-act--tshirt img{animation-name:act-flap!important;transform-origin:50% 8%!important}
#shop .category-card .mons-act--bag img{animation-name:act-hop-tilt!important}
#shop .category-card .mons-act--pouch img{animation-name:act-shake!important;transform-origin:50% 20%!important}
#shop .category-card .mons-act--socks::after,#shop .category-card .mons-act--shuttlecock::after,#shop .category-card .mons-act--bag::after{animation:act-shadow 4.8s linear infinite!important;animation-delay:var(--d)!important}
/* 라켓: 쉬다가 → 뒤로 젖히고 → 스매시 → 반동 */
@keyframes act-swing{0%,52%{rotate:0deg;animation-timing-function:ease-in-out}
  62%{rotate:-24deg;animation-timing-function:cubic-bezier(.6,0,.9,.5)}
  69%{rotate:30deg;animation-timing-function:ease-out}
  77%{rotate:-8deg}84%{rotate:4deg}90%,100%{rotate:0deg}}
/* 양말: 쪼그렸다 점프, 착지할 때 찌그러짐 */
@keyframes act-hop{0%,52%{translate:0 0;scale:1 1}
  58%{translate:0 0;scale:1.12 .86;animation-timing-function:cubic-bezier(.2,.7,.4,1)}
  68%{translate:0 -34px;scale:.92 1.1;animation-timing-function:cubic-bezier(.6,0,.8,.4)}
  77%{translate:0 0;scale:1.14 .84}83%{scale:.96 1.05}89%,100%{translate:0 0;scale:1 1}}
/* 셔틀콕 통: 점프하며 공중 한 바퀴 */
@keyframes act-flip{0%,52%{translate:0 0;rotate:0deg;scale:1 1}
  57%{scale:1.08 .9;translate:0 0;animation-timing-function:cubic-bezier(.2,.7,.4,1)}
  68%{translate:0 -46px;rotate:180deg;scale:1 1;animation-timing-function:cubic-bezier(.6,0,.8,.4)}
  79%{translate:0 0;rotate:360deg;scale:1.1 .9}85%{scale:.97 1.03;rotate:360deg}90%,100%{translate:0 0;rotate:360deg;scale:1 1}}
/* 티셔츠: 계속 살랑살랑 + 차례가 오면 크게 펄럭 */
@keyframes act-flap{0%{rotate:-2deg}13%{rotate:2deg}26%{rotate:-2deg}39%{rotate:2deg}52%{rotate:-2deg}
  58%{rotate:9deg;scale:1.04 .98}64%{rotate:-8deg;scale:.98 1.03}70%{rotate:6deg}76%{rotate:-4deg}83%{rotate:2deg}91%,100%{rotate:-2deg;scale:1 1}}
/* 가방: 점프하면서 살짝 기울고 털썩 착지 */
@keyframes act-hop-tilt{0%,52%{translate:0 0;rotate:0deg;scale:1 1}
  58%{scale:1.1 .88;animation-timing-function:cubic-bezier(.2,.7,.4,1)}
  68%{translate:0 -30px;rotate:-8deg;scale:.95 1.06;animation-timing-function:cubic-bezier(.6,0,.8,.4)}
  77%{translate:0 0;rotate:3deg;scale:1.12 .86}84%{rotate:-1deg;scale:.97 1.03}90%,100%{translate:0 0;rotate:0deg;scale:1 1}}
/* 파우치: 부르르 */
@keyframes act-shake{0%,55%{rotate:0deg}58%{rotate:9deg}61%{rotate:-9deg}64%{rotate:8deg}67%{rotate:-7deg}70%{rotate:5deg}73%{rotate:-3deg}76%{rotate:1deg}80%,100%{rotate:0deg}}
/* 점프하는 아이콘의 그림자 */
@keyframes act-shadow{0%,58%{transform:translateX(-50%) scaleX(1);opacity:1}68%{transform:translateX(-50%) scaleX(.55);opacity:.4}77%{transform:translateX(-50%) scaleX(1.1);opacity:1}90%,100%{transform:translateX(-50%) scaleX(1);opacity:1}}
#shop .category-card:hover .mons-float img,#shop .category-card:hover .mons-float::after{animation-duration:2.4s!important}
@media(prefers-reduced-motion:reduce){#shop .category-card .mons-float img{animation-name:mons-float2-soft!important;animation-duration:4.5s!important}#shop .category-card .mons-float::after{animation:none!important}}
#shop .category-card .mons-float-art{margin-top:44px!important}
/* ===== v36 티셔츠: 깃발처럼 펄럭 (그림을 12조각 세로 띠로 나눠 물결) ===== */
#shop .category-card .mons-flag .mons-flag-cloth{display:flex;height:calc(var(--row) * var(--h));aspect-ratio:544/520;position:relative;z-index:1;filter:drop-shadow(0 6px 6px rgba(0,0,0,.18))}

@keyframes flag-wave{0%,100%{translate:0 calc(var(--a) * -1);rotate:calc(var(--k) * -.25deg)}50%{translate:0 var(--a);rotate:calc(var(--k) * .25deg)}}
@keyframes flag-shade{0%,100%{filter:brightness(1.04)}50%{filter:brightness(.9)}}
/* 깃대 쪽(왼쪽)은 붙어 있고 오른쪽으로 갈수록 크게: 전체도 살짝 흔들 */
#shop .category-card .mons-flag .mons-flag-cloth{transform-origin:0 30%;animation:flag-sway 3s ease-in-out infinite}
@keyframes flag-sway{0%,100%{rotate:-2deg}50%{rotate:2deg}}
#shop .category-card:hover .mons-flag .mons-flag-cloth b{animation-duration:.8s}
@media(prefers-reduced-motion:reduce){}
/* v36 보정: 미리 그린 16장면 깃발 물결(스프라이트)로 교체 */
#shop .category-card .mons-flag .mons-flag-cloth{display:block;height:calc(var(--row) * var(--h) * 404 / 360);aspect-ratio:376/404;margin-bottom:calc(var(--row) * var(--h) * -22 / 360);
  background:0 0 / 1600% 100% no-repeat;
  animation:flag-frames 1.3s steps(16,jump-none) infinite,flag-sway 3.2s ease-in-out infinite!important;transform-origin:8% 20%;filter:drop-shadow(0 6px 6px rgba(0,0,0,.18))}

@keyframes flag-frames{to{background-position:100% 0}}
@keyframes flag-sway{0%,100%{rotate:-2.5deg}50%{rotate:2deg}}
#shop .category-card:hover .mons-flag .mons-flag-cloth{animation-duration:.7s,3.2s!important}
@media(prefers-reduced-motion:reduce){#shop .category-card .mons-flag .mons-flag-cloth{animation:flag-frames 2.6s steps(16,jump-none) infinite!important}}
#shop .category-card .mons-flag .mons-flag-cloth{width:calc(var(--row) * var(--h) * 376 / 360)!important;flex:0 0 auto!important}
#shop .category-card .mons-flag .mons-flag-cloth{max-width:none!important;align-self:auto!important;font-size:0!important}

/* v37: 티셔츠도 다른 아이콘처럼 자기 차례에만 한 번 펄럭 (명암 없음) */
@keyframes flag-turn{0%,52%{background-position:0 0}52.00%{background-position:0.0000% 0}54.40%{background-position:6.6667% 0}56.80%{background-position:13.3333% 0}59.20%{background-position:20.0000% 0}61.60%{background-position:26.6667% 0}64.00%{background-position:33.3333% 0}66.40%{background-position:40.0000% 0}68.80%{background-position:46.6667% 0}71.20%{background-position:53.3333% 0}73.60%{background-position:60.0000% 0}76.00%{background-position:66.6667% 0}78.40%{background-position:73.3333% 0}80.80%{background-position:80.0000% 0}83.20%{background-position:86.6667% 0}85.60%{background-position:93.3333% 0}88.00%{background-position:100.0000% 0}88.01%,100%{background-position:0 0}}
@keyframes flag-turn-lift{0%,52%{translate:0 0;rotate:0deg}60%{translate:0 -10px;rotate:-4deg}72%{translate:0 -12px;rotate:3deg}84%{translate:0 -4px;rotate:-1deg}90%,100%{translate:0 0;rotate:0deg}}
#shop .category-card .mons-flag .mons-flag-cloth{background-image:url(img/home-v34/tshirt-flap-sprite-sm.webp?v=2)!important;
  animation:flag-turn 4.8s step-end infinite,flag-turn-lift 4.8s ease-in-out infinite!important;animation-delay:var(--d),var(--d)!important;transform-origin:50% 100%}
@media(min-width:621px){#shop .category-card .mons-flag .mons-flag-cloth{background-image:url(img/home-v34/tshirt-flap-sprite.webp?v=2)!important}}
#shop .category-card:hover .mons-flag .mons-flag-cloth{animation-duration:2.4s,2.4s!important}
@media(prefers-reduced-motion:reduce){#shop .category-card .mons-flag .mons-flag-cloth{animation:none!important}}
/* 아이콘 줄: 간격 균일, 가운데 정렬 */
#shop .category-card .mons-float-art{justify-content:center!important;gap:clamp(14px,4vw,40px)!important}
/* ===== v38: 아이콘 줄을 같은 너비 3칸으로 → 가운데 아이콘이 정중앙 ===== */
#shop .category-card .mons-float-art{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;justify-items:center;align-items:end;gap:0!important;max-width:520px;margin-left:auto!important;margin-right:auto!important}
/* 라켓 옆 셔틀콕: 스매시 순간 맞고 날아갔다가 다시 떨어짐 */
#shop .category-card .mons-float .mons-shuttle-hit{position:absolute;z-index:2;left:88%;top:18%;width:auto!important;height:calc(var(--row) * .26)!important;max-width:none!important;
  rotate:-35deg;filter:drop-shadow(0 4px 4px rgba(0,0,0,.2));animation:shuttle-hit 4.8s linear infinite!important;animation-delay:var(--d)!important;transform-origin:50% 60%}
@keyframes shuttle-hit{
  0%{translate:0 0;opacity:1;scale:1}
  20%{translate:0 -5px}40%{translate:0 0}60%{translate:0 -4px}
  66%{translate:0 0;rotate:-35deg;scale:1;opacity:1;animation-timing-function:cubic-bezier(.15,.7,.4,1)}
  67.5%{translate:-3px 2px;scale:1.15 .85}
  76%{translate:150px -120px;rotate:-120deg;scale:.7;opacity:0}
  86%{translate:0 -70px;rotate:-35deg;scale:1;opacity:0;animation-timing-function:cubic-bezier(.5,0,.9,.6)}
  94%{translate:0 0;opacity:1}
  97%{translate:0 -6px}100%{translate:0 0;opacity:1}}
#shop .category-card:hover .mons-float .mons-shuttle-hit{animation-duration:2.4s!important}
@media(prefers-reduced-motion:reduce){#shop .category-card .mons-float .mons-shuttle-hit{animation:none!important}}
@media(max-width:620px){#shop .category-card .mons-float .mons-shuttle-hit{left:84%}}
#shop .category-card .mons-float .mons-shuttle-hit{position:absolute!important;margin:0!important;transform:none!important}
#shop .category-card .mons-float .mons-shuttle-hit{left:96%!important;top:4%!important}
@media(max-width:620px){#shop .category-card .mons-float .mons-shuttle-hit{left:92%!important}}
@keyframes shuttle-hit{
  0%{translate:0 0;opacity:1;scale:1}
  20%{translate:0 -5px}40%{translate:0 0}60%{translate:0 -4px}
  66.5%{translate:0 0;rotate:-35deg;scale:1;opacity:1;animation-timing-function:cubic-bezier(.15,.7,.4,1)}
  68%{translate:-4px 3px;scale:1.18 .82}
  77%{translate:90px -190px;rotate:-160deg;scale:.6;opacity:0}
  86%{translate:0 -80px;rotate:-35deg;scale:1;opacity:0;animation-timing-function:cubic-bezier(.5,0,.9,.6)}
  94%{translate:0 0;opacity:1}
  97%{translate:0 -6px}100%{translate:0 0;opacity:1}}
/* v39: 셔틀콕이 맞으면 흐려지지 않고 화면 밖까지 날아감 (카드 밖으로도 보이게) */
#shop .category-card--court{overflow:visible!important}
#shop .category-card .mons-float .mons-shuttle-hit{z-index:20!important}
@keyframes shuttle-hit{
  0%{translate:0 0;opacity:1;scale:1}
  20%{translate:0 -5px}40%{translate:0 0}60%{translate:0 -4px}
  66.5%{translate:0 0;rotate:-35deg;scale:1;opacity:1;animation-timing-function:cubic-bezier(.12,.75,.35,1)}
  68%{translate:-4px 3px;scale:1.2 .8;rotate:-35deg}
  80%{translate:75vw -110vh;rotate:-560deg;scale:1.3;opacity:1}
  80.01%,86%{translate:0 -90px;rotate:-35deg;scale:1;opacity:0;animation-timing-function:cubic-bezier(.5,0,.9,.6)}
  94%{translate:0 0;opacity:1}
  97%{translate:0 -6px}100%{translate:0 0;opacity:1}}
/* v40: 셔틀콕 비행을 위쪽보다 옆으로 */
@keyframes shuttle-hit{
  0%{translate:0 0;opacity:1;scale:1}
  20%{translate:0 -5px}40%{translate:0 0}60%{translate:0 -4px}
  66.5%{translate:0 0;rotate:-35deg;scale:1;opacity:1;animation-timing-function:cubic-bezier(.12,.75,.35,1)}
  68%{translate:-4px 3px;scale:1.2 .8;rotate:-35deg}
  80%{translate:115vw -14vh;rotate:-480deg;scale:1.2;opacity:1}
  80.01%,86%{translate:0 -90px;rotate:-35deg;scale:1;opacity:0;animation-timing-function:cubic-bezier(.5,0,.9,.6)}
  94%{translate:0 0;opacity:1}
  97%{translate:0 -6px}100%{translate:0 0;opacity:1}}
html,body{overflow-x:clip}
/* v41: 포물선 비행 — 바깥(.mons-shuttle-x)은 옆으로 일정 속도, 안쪽 셔틀콕은 위로 올라갔다 떨어짐 */
#shop .category-card .mons-float .mons-shuttle-x{position:absolute!important;z-index:20;left:96%;top:4%;width:auto;height:auto;display:block;
  animation:shuttle-x 4.8s linear infinite;animation-delay:var(--d)}
@media(max-width:620px){#shop .category-card .mons-float .mons-shuttle-x{left:92%}}
#shop .category-card .mons-float .mons-shuttle-x .mons-shuttle-hit{position:relative!important;left:0!important;top:0!important;display:block;
  animation:shuttle-y 4.8s linear infinite!important;animation-delay:var(--d)!important}
@keyframes shuttle-x{0%,67.5%{translate:0 0}
  67.5%{animation-timing-function:linear}
  83%{translate:100vw 0}83.01%,100%{translate:0 0}}
@keyframes shuttle-y{
  0%{translate:0 0;rotate:-35deg;opacity:1;scale:1}
  20%{translate:0 -5px}40%{translate:0 0}60%{translate:0 -4px}
  66.5%{translate:0 0;rotate:-35deg;scale:1}
  67.5%{translate:-3px 3px;scale:1.2 .8;rotate:-35deg;animation-timing-function:cubic-bezier(.2,.6,.45,1)}
  69%{scale:1;rotate:-135deg}
  71.5%{translate:0 -13vh;rotate:-90deg;animation-timing-function:cubic-bezier(.55,0,.8,.45)}
  83%{translate:0 16vh;rotate:-40deg;opacity:1}
  83.01%,86%{translate:0 -90px;rotate:-35deg;opacity:0;animation-timing-function:cubic-bezier(.5,0,.9,.6)}
  94%{translate:0 0;opacity:1}
  97%{translate:0 -6px}100%{translate:0 0;opacity:1}}
#shop .category-card:hover .mons-float .mons-shuttle-x,#shop .category-card:hover .mons-float .mons-shuttle-x .mons-shuttle-hit{animation-duration:2.4s!important}
@media(prefers-reduced-motion:reduce){#shop .category-card .mons-float .mons-shuttle-x,#shop .category-card .mons-float .mons-shuttle-x .mons-shuttle-hit{animation:none!important}}
/* v42: 라켓은 평소 뒤로 기울인 자세 → 더 젖혔다가 앞으로 스매시 → 다시 기울인 자세 */
@keyframes act-swing{0%,50%{rotate:-18deg;animation-timing-function:ease-in-out}
  25%{rotate:-15deg}
  61%{rotate:-36deg;animation-timing-function:cubic-bezier(.6,0,.9,.5)}
  68%{rotate:30deg;animation-timing-function:ease-out}
  76%{rotate:12deg}84%{rotate:-22deg}90%,100%{rotate:-18deg}}
/* 목록 아이콘: 여백을 잘라낸 그림으로 바꿔 모든 아이콘 높이를 똑같이 */
body.world-catalog .page-main .icon-grid .product-icon-stage img.mons-product-icon.mons-icon-even{width:100%!important;height:100%!important;margin:0!important;object-fit:contain!important;object-position:50% 50%}
@media(max-width:768px){body.world-catalog .page-main .icon-grid .product-icon-stage img.mons-product-icon.mons-icon-even{width:100%!important;height:92%!important;margin:4% 0 0!important}}
/* 목록 아이콘: 눌러도/올려도 뒤에 네모 배경이 생기지 않게 */
.page-main .icon-grid .product-icon-card .product-icon-stage,.page-main .icon-grid .product-icon-card:hover .product-icon-stage,.page-main .icon-grid .product-icon-card:active .product-icon-stage,.page-main .icon-grid .product-icon-card:focus-visible .product-icon-stage{background:transparent!important;box-shadow:none!important}

@keyframes flag-turn{0%,44%{background-position:0 0}44.00%{background-position:0.0000% 0}46.00%{background-position:6.6667% 0}48.00%{background-position:13.3333% 0}50.00%{background-position:20.0000% 0}52.00%{background-position:26.6667% 0}54.00%{background-position:33.3333% 0}56.00%{background-position:40.0000% 0}58.00%{background-position:46.6667% 0}60.00%{background-position:53.3333% 0}62.00%{background-position:60.0000% 0}64.00%{background-position:66.6667% 0}66.00%{background-position:73.3333% 0}68.00%{background-position:80.0000% 0}70.00%{background-position:86.6667% 0}72.00%{background-position:93.3333% 0}74.00%{background-position:100.0000% 0}74.01%,100%{background-position:0 0}}
#shop .category-card--street .mons-flag .mons-flag-cloth{animation-delay:0s,0s!important}

/* ===== v43 OFF COURT: 보스턴백에서 티셔츠(왼쪽)와 남성 가방(오른쪽)이 튀어나왔다가 다시 들어감 ===== */
#shop .category-card--street .mons-float-art{container-type:inline-size}
#shop .category-card--street .mons-act--bag{z-index:3}
#shop .category-card--street .mons-act--tshirt,#shop .category-card--street .mons-act--pouch{z-index:1}
#shop .category-card--street .mons-act--tshirt{animation:bag-pop-left 4.8s linear infinite!important}
#shop .category-card--street .mons-act--pouch{animation:bag-pop-right 4.8s linear infinite!important;animation-delay:.25s!important}
#shop .category-card--street .mons-act--pouch img{animation:none!important}
#shop .category-card--street .mons-act--bag img{animation:bag-open 4.8s ease-in-out infinite!important}
#shop .category-card--street .mons-act--bag::after{animation:none!important}
@keyframes bag-pop-left{0%,10%{translate:33.33cqw 20px;scale:.3;opacity:0}18%{translate:33.33cqw 20.0px;scale:0.30;opacity:0;rotate:-12deg}21.5%{translate:25.00cqw -45.0px;scale:0.47;opacity:1;rotate:-9deg}25%{translate:16.66cqw -70.0px;scale:0.65;opacity:1;rotate:-6deg}28.5%{translate:8.33cqw -55.0px;scale:0.82;opacity:1;rotate:-3deg}32%{translate:0.00cqw 0.0px;scale:1.00;opacity:1;rotate:0deg}35%{translate:0 0;scale:1.08 .92}38%,80%{translate:0 0;scale:1;rotate:0deg;opacity:1}80.01%{translate:0.00cqw 0.0px;scale:1.00;opacity:1;rotate:0deg}83%{translate:8.33cqw -55.0px;scale:0.82;opacity:1;rotate:-3deg}86%{translate:16.66cqw -70.0px;scale:0.65;opacity:1;rotate:-6deg}89%{translate:25.00cqw -45.0px;scale:0.47;opacity:1;rotate:-9deg}92%{translate:33.33cqw 20.0px;scale:0.30;opacity:0;rotate:-12deg}100%{translate:33.33cqw 20px;scale:.3;opacity:0}}
@keyframes bag-pop-right{0%,10%{translate:-33.33cqw 20px;scale:.3;opacity:0}18%{translate:-33.33cqw 20.0px;scale:0.30;opacity:0;rotate:12deg}21.5%{translate:-25.00cqw -45.0px;scale:0.47;opacity:1;rotate:9deg}25%{translate:-16.66cqw -70.0px;scale:0.65;opacity:1;rotate:6deg}28.5%{translate:-8.33cqw -55.0px;scale:0.82;opacity:1;rotate:3deg}32%{translate:-0.00cqw 0.0px;scale:1.00;opacity:1;rotate:0deg}35%{translate:0 0;scale:1.08 .92}38%,80%{translate:0 0;scale:1;rotate:0deg;opacity:1}80.01%{translate:-0.00cqw 0.0px;scale:1.00;opacity:1;rotate:0deg}83%{translate:-8.33cqw -55.0px;scale:0.82;opacity:1;rotate:3deg}86%{translate:-16.66cqw -70.0px;scale:0.65;opacity:1;rotate:6deg}89%{translate:-25.00cqw -45.0px;scale:0.47;opacity:1;rotate:9deg}92%{translate:-33.33cqw 20.0px;scale:0.30;opacity:0;rotate:12deg}100%{translate:-33.33cqw 20px;scale:.3;opacity:0}}
@keyframes bag-open{0%,10%{scale:1 1;rotate:0deg}13%{scale:1.1 .86}17%{scale:.94 1.08;rotate:-3deg}21%{scale:1.04 .97;rotate:2deg}25%{scale:1 1;rotate:0deg}86%{scale:1 1}91%{scale:1.08 .9}94%{scale:.95 1.06}97%,100%{scale:1 1}}
@keyframes flag-turn-lift{0%,100%{translate:0 0;rotate:0deg}}
#shop .category-card--street:hover .mons-act--tshirt,#shop .category-card--street:hover .mons-act--pouch,#shop .category-card--street:hover .mons-act--bag img{animation-duration:2.4s!important}
@media(prefers-reduced-motion:reduce){#shop .category-card--street .mons-act--tshirt,#shop .category-card--street .mons-act--pouch,#shop .category-card--street .mons-act--bag img{animation:none!important}}

/* ===== v44 보스턴백 표정: 콜록(뱉기) → 꿀꺽(삼키기) → 트림 ===== */
@keyframes bag-pop-left{0%,10%{translate:33.33cqw 20px;scale:.3;opacity:0}18%{translate:33.33cqw 20.0px;scale:0.30;opacity:0;rotate:-12deg}21.5%{translate:25.00cqw -45.0px;scale:0.47;opacity:1;rotate:-9deg}25%{translate:16.66cqw -70.0px;scale:0.65;opacity:1;rotate:-6deg}28.5%{translate:8.33cqw -55.0px;scale:0.82;opacity:1;rotate:-3deg}32%{translate:0.00cqw 0.0px;scale:1.00;opacity:1;rotate:0deg}35%{translate:0 0;scale:1.08 .92}38%,76%{translate:0 0;scale:1;rotate:0deg;opacity:1}76.01%{translate:0.00cqw 0.0px;scale:1.00;opacity:1;rotate:0deg}78.5%{translate:8.33cqw -55.0px;scale:0.82;opacity:1;rotate:-3deg}81%{translate:16.66cqw -70.0px;scale:0.65;opacity:1;rotate:-6deg}83.5%{translate:25.00cqw -45.0px;scale:0.47;opacity:1;rotate:-9deg}86%{translate:33.33cqw 20.0px;scale:0.30;opacity:0;rotate:-12deg}86.01%,100%{translate:33.33cqw 20px;scale:.3;opacity:0}}
@keyframes bag-pop-right{0%,10%{translate:-33.33cqw 20px;scale:.3;opacity:0}18%{translate:-33.33cqw 20.0px;scale:0.30;opacity:0;rotate:12deg}21.5%{translate:-25.00cqw -45.0px;scale:0.47;opacity:1;rotate:9deg}25%{translate:-16.66cqw -70.0px;scale:0.65;opacity:1;rotate:6deg}28.5%{translate:-8.33cqw -55.0px;scale:0.82;opacity:1;rotate:3deg}32%{translate:-0.00cqw 0.0px;scale:1.00;opacity:1;rotate:0deg}35%{translate:0 0;scale:1.08 .92}38%,76%{translate:0 0;scale:1;rotate:0deg;opacity:1}76.01%{translate:-0.00cqw 0.0px;scale:1.00;opacity:1;rotate:0deg}78.5%{translate:-8.33cqw -55.0px;scale:0.82;opacity:1;rotate:3deg}81%{translate:-16.66cqw -70.0px;scale:0.65;opacity:1;rotate:6deg}83.5%{translate:-25.00cqw -45.0px;scale:0.47;opacity:1;rotate:9deg}86%{translate:-33.33cqw 20.0px;scale:0.30;opacity:0;rotate:12deg}86.01%,100%{translate:-33.33cqw 20px;scale:.3;opacity:0}}
@keyframes bag-open{
  0%,9%{scale:1 1;rotate:0deg;translate:0 0}
  15%{scale:.95 1.09;rotate:-6deg;translate:0 -2px}
  17.5%{scale:1.14 .86;rotate:5deg;translate:0 2px}
  19.5%{scale:.97 1.05;rotate:-4deg;translate:0 0}
  22.5%{scale:1.12 .88;rotate:5deg;translate:0 2px}
  25%{scale:.98 1.03;rotate:-2deg}28%{scale:1.02 .99;rotate:1deg}31%,72%{scale:1 1;rotate:0deg;translate:0 0}
  50%{scale:1.015 .99}
  76%{scale:1.04 1.1;translate:0 -4px;rotate:0deg}
  86%{scale:1.04 1.1;translate:0 -4px}
  87.5%{scale:1.12 .86;translate:0 2px}
  89%{scale:1.03 1.07;translate:0 -2px}
  91%{scale:1.1 .9;translate:0 2px}
  93%{scale:1 1;translate:0 0}
  95.5%{scale:1.06 .94;rotate:-3deg}97.5%{scale:.97 1.04;rotate:2deg}100%{scale:1 1;rotate:0deg}}
#shop .category-card--street .mons-act--bag img{animation:bag-open 4.8s ease-in-out infinite!important}
/* 기침 선 */
#shop .category-card--street .mons-cough{position:absolute;left:50%;top:-30%;width:42%;aspect-ratio:3/2;translate:-50% 0;z-index:4;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 40'%3E%3Cg stroke='%23F4EDE4' stroke-width='5' stroke-linecap='round'%3E%3Cpath d='M30 36 L30 8'/%3E%3Cpath d='M16 36 L6 14'/%3E%3Cpath d='M44 36 L54 14'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat;opacity:0;animation:bag-cough 4.8s linear infinite}
@keyframes bag-cough{0%,17%{opacity:0;scale:.6}17.6%{opacity:1;scale:1}19.5%{opacity:0;scale:1.25}22%{opacity:0;scale:.6}22.6%{opacity:1;scale:1}24.5%{opacity:0;scale:1.25}100%{opacity:0}}
/* 트림 방울 */
#shop .category-card--street .mons-burp{position:absolute;left:58%;top:6%;width:16%;aspect-ratio:1;border-radius:50%;z-index:4;pointer-events:none;
  border:3px solid #F4EDE4;background:rgba(244,237,228,.15);opacity:0;animation:bag-burp 4.8s ease-out infinite}
@keyframes bag-burp{0%,94%{opacity:0;translate:0 0;scale:.3}95.5%{opacity:1;scale:.8}98.5%{opacity:1;translate:6px -28px;scale:1.1}99.2%{opacity:0;scale:1.6;translate:6px -30px}100%{opacity:0}}
#shop .category-card--street:hover .mons-cough,#shop .category-card--street:hover .mons-burp{animation-duration:2.4s}
@media(prefers-reduced-motion:reduce){#shop .category-card--street .mons-cough,#shop .category-card--street .mons-burp{display:none}}
/* v45: 가방 혼자 있을 때는 1.3배로 크게 → 둘이 나오면 원래 크기 → 다 삼키면 다시 크게 */
#shop .category-card--street .mons-act--bag img{transform-origin:50% 100%}
@keyframes bag-open{
  0%,9%{scale:1.3 1.3;rotate:0deg;translate:0 0}
  15%{scale:1.24 1.42;rotate:-6deg;translate:0 -2px}
  17.5%{scale:1.45 1.12;rotate:5deg;translate:0 2px}
  19.5%{scale:1.2 1.3;rotate:-4deg;translate:0 0}
  22.5%{scale:1.3 1.03;rotate:5deg;translate:0 2px}
  25%{scale:1.05 1.1;rotate:-2deg}28%{scale:1.04 1.01;rotate:1deg}31%,72%{scale:1 1;rotate:0deg;translate:0 0}
  50%{scale:1.015 .99}
  76%{scale:1.04 1.1;translate:0 -4px;rotate:0deg}
  86%{scale:1.08 1.14;translate:0 -4px}
  87.5%{scale:1.22 .94;translate:0 2px}
  89%{scale:1.16 1.24;translate:0 -2px}
  91%{scale:1.38 1.12;translate:0 2px}
  93%{scale:1.3 1.3;translate:0 0}
  95.5%{scale:1.38 1.22;rotate:-3deg}97.5%{scale:1.26 1.35;rotate:2deg}100%{scale:1.3 1.3;rotate:0deg}}
#shop .category-card--street .mons-cough{top:-58%!important}
@keyframes bag-burp{0%,94%{opacity:0;translate:0 -20px;scale:.3}95.5%{opacity:1;scale:.8;translate:0 -24px}98.5%{opacity:1;translate:8px -56px;scale:1.1}99.2%{opacity:0;scale:1.6;translate:8px -58px}100%{opacity:0}}
/* v46: 화면 밖에서 먼저 완전히 투명해진 뒤, 한참 뒤에 제자리로 옮김 (돌아올 때 번쩍임 방지) */
@keyframes shuttle-x{0%,67.5%{translate:0 0}
  67.5%{animation-timing-function:linear}
  83%{translate:100vw 0}85%{translate:100vw 0}85.01%,100%{translate:0 0}}
@keyframes shuttle-y{
  0%{translate:0 0;rotate:-35deg;opacity:1;scale:1}
  20%{translate:0 -5px}40%{translate:0 0}60%{translate:0 -4px}
  66.5%{translate:0 0;rotate:-35deg;scale:1;opacity:1}
  67.5%{translate:-3px 3px;scale:1.2 .8;rotate:-35deg;animation-timing-function:cubic-bezier(.2,.6,.45,1)}
  69%{scale:1;rotate:-135deg}
  71.5%{translate:0 -13vh;rotate:-90deg;animation-timing-function:cubic-bezier(.55,0,.8,.45)}
  82.4%{opacity:1}
  83%{translate:0 16vh;rotate:-40deg;opacity:0}
  83.01%,86.5%{translate:0 -90px;rotate:-35deg;opacity:0;animation-timing-function:cubic-bezier(.5,0,.9,.6)}
  94%{translate:0 0;opacity:1}
  97%{translate:0 -6px}100%{translate:0 0;opacity:1}}
/* 셔틀콕 상세: 실제 셔틀콕 사진 */
.mons-detail-standard .shuttle-real{grid-column:1/-1;margin-top:clamp(40px,6vw,72px);padding-top:clamp(28px,4vw,44px);border-top:1px solid rgba(0,44,16,.18)}
.mons-detail-standard .shuttle-real-head{margin-bottom:18px}
.mons-detail-standard .shuttle-real-head h2{margin:6px 0 0;line-height:.95}
.mons-detail-standard .shuttle-real-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;max-width:760px}
.mons-detail-standard .shuttle-real-grid .mons-photo-frame{aspect-ratio:4/5;height:auto!important}
.mons-detail-standard .shuttle-real-grid .mons-photo-frame img{width:100%!important;height:100%!important;object-fit:cover!important}
@media(min-width:769px){.mons-detail-standard .shuttle-real-head{text-align:center}.mons-detail-standard .shuttle-real-grid{margin-left:auto!important;margin-right:auto!important}}
/* 셔틀콕 누끼 사진: 배경 없이, 다른 제품 사진처럼 그림자만 */
.mons-detail-standard .shuttle-real-grid .mons-photo-frame.shuttle-cut{aspect-ratio:4/5;background:transparent!important;border-radius:0!important;overflow:visible!important;display:grid;place-items:center}
.mons-detail-standard .shuttle-real-grid .mons-photo-frame.shuttle-cut img{width:auto!important;height:auto!important;max-width:86%!important;max-height:86%!important;object-fit:contain!important}
/* 셔틀콕 사진을 통 사진과 같은 갤러리에: 같은 바닥선, 같은 틀 */
.mons-detail-standard .shuttle-product-gallery .mons-photo-frame.shuttle-shot{aspect-ratio:auto!important;display:block!important;overflow:visible!important}
.mons-detail-standard .shuttle-product-gallery .mons-photo-frame.shuttle-shot img{position:absolute!important;left:50%!important;top:auto!important;bottom:9%!important;transform:translateX(-50%)!important;
  height:56%!important;width:auto!important;max-width:88%!important;max-height:none!important;object-fit:contain!important}
@media(min-width:769px){.mons-detail-standard .shuttle-product-gallery{grid-template-columns:repeat(4,minmax(0,1fr))!important;max-width:none!important}}
.mons-detail-standard .shuttle-product-gallery .mons-photo-frame.shuttle-shot{aspect-ratio:4/5!important}
@media(min-width:769px){.mons-detail-standard .shuttle-product-gallery{flex-wrap:nowrap!important;gap:12px!important}.mons-detail-standard .shuttle-product-gallery>figure{flex:1 1 0!important;min-width:0!important;max-width:300px!important;width:auto!important}}
/* 기술점검: 붐박스 그림이 마스코트를 덮어서 스와이프(옷 바꾸기)가 안 되던 문제 → 붐박스는 터치 통과 */
.hero-radio,.hero-shock{pointer-events:none!important}
/* 기술점검: 화면에는 안 보이지만 검색엔진·화면낭독기가 읽는 제목 */
.mons-sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
/* 기술점검: 푸터 링크를 손가락으로 누르기 쉽게 (높이 44px) */
.footer-links a,.footer-mark{display:inline-flex!important;align-items:center;min-height:44px}
.footer-links{column-gap:20px}
/* 기술점검: 좁은 휴대폰(≤390px)에서 Moss 말풍선이 오른쪽에서 잘리지 않게 */
@media(max-width:390px){.mons-speech{right:8px!important;left:auto!important;max-width:calc(100vw - 48px)!important;transform-origin:100% 50%;scale:.86}}
/* 기술점검: 휴대폰에서 Moss 말풍선이 WHATSAPP/INSTAGRAM 버튼을 가리지 않게 */
.contact-side .mons-speech{pointer-events:none}
@media(max-width:768px){.contact-side{padding-top:56px!important}}
footer a{display:inline-flex!important;align-items:center;min-height:44px}
