/* ============================================================
   마시안 2체험장 — 와이어프레임 오버라이드
   사진은 빼되 읽히게. 픽토그램 + 단일 포인트 컬러 + 굵기 위계.
   style.css 뒤에 로드되어 값만 덮어쓴다. 레이아웃은 그대로 유지.
   실제 오픈 시 이 파일 링크 한 줄만 지우면 된다.
   ============================================================ */

/* 사진 자리는 회색 상자로 남기고, 안에 들어갈 파일명을 적어 둔다 */
.ph{background:#EFEDE7}
.ph .ic{background:#B7B3A8}

/* 히어로 — 사진 대신 로고 곡선 모티프를 옅게 깐다 */
.hero>.ph{height:200px;background:var(--tint);border:0;border-bottom:1px solid var(--line)}
.hero>.ph .ic{background:var(--sea-soft);width:54px;height:54px}
.hero>.ph{color:var(--sea-soft)}

/* 픽토그램 (CSS 마스크용 SVG) */
:root{
  --i-clam:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20 2.5 10.5A7 7 0 0 1 12 4a7 7 0 0 1 9.5 6.5z'/%3E%3Cpath d='M12 4v16M7.5 6.2 5 17M16.5 6.2 19 17'/%3E%3C/svg%3E");
  --i-wave:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round'%3E%3Cpath d='M2 8c2.5-4 5-4 7.5 0s5 4 7.5 0 3.5-2 5 0'/%3E%3Cpath d='M2 14c2.5-4 5-4 7.5 0s5 4 7.5 0 3.5-2 5 0'/%3E%3Cpath d='M2 20c2.5-4 5-4 7.5 0s5 4 7.5 0 3.5-2 5 0'/%3E%3C/svg%3E");
  --i-clock:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpolyline points='12 6.5 12 12 16 14'/%3E%3C/svg%3E");
  --i-ticket:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 8V6a1 1 0 0 1 1-1h16a1 1 0 0 1 1 1v2a2 2 0 0 0 0 4v6a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1v-6a2 2 0 0 0 0-4z'/%3E%3Cpath d='M12 6v2M12 11v2M12 16v2'/%3E%3C/svg%3E");
  --i-boot:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h5v9l7 3.5a3 3 0 0 1 1.6 2.7V21H6z'/%3E%3Cpath d='M6 15h5'/%3E%3C/svg%3E");
  --i-shower:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 21V6a3 3 0 0 1 6 0v1'/%3E%3Cpath d='M9.5 9h11l-2.5 4h-6z'/%3E%3Cpath d='M12 17v1M15 16v1M18 17v1'/%3E%3C/svg%3E");
  --i-locker:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='3' width='16' height='18' rx='1.5'/%3E%3Cpath d='M12 3v18'/%3E%3Cpath d='M8.5 11h1M14.5 11h1'/%3E%3C/svg%3E");
  --i-park:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='2'/%3E%3Cpath d='M9.5 17V7.5h3a3 3 0 0 1 0 6h-3'/%3E%3C/svg%3E");
  --i-shop:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 9h18l-1 11H4z'/%3E%3Cpath d='M3 9 5 4h14l2 5'/%3E%3Cpath d='M9 13a3 3 0 0 0 6 0'/%3E%3C/svg%3E");
  --i-shield:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
  --i-pin:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E");
  --i-photo:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Ccircle cx='8.5' cy='10' r='1.6'/%3E%3Cpath d='m4 17 5-4.5 3.5 2.8L16 12l4 4'/%3E%3C/svg%3E");
  --i-doc:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/%3E%3Cpolyline points='14 2 14 8 20 8'/%3E%3Cline x1='8' y1='13' x2='16' y2='13'/%3E%3Cline x1='8' y1='17' x2='13' y2='17'/%3E%3C/svg%3E");
  --i-mail:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='4' width='20' height='16' rx='2'/%3E%3Cpath d='m2 7 10 6 10-6'/%3E%3C/svg%3E");
  --i-grid:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7'%3E%3Crect x='3' y='3' width='7' height='7'/%3E%3Crect x='14' y='3' width='7' height='7'/%3E%3Crect x='3' y='14' width='7' height='7'/%3E%3Crect x='14' y='14' width='7' height='7'/%3E%3C/svg%3E");
  --i-users:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='9' cy='7' r='3.5'/%3E%3Cpath d='M22 21v-2a4 4 0 0 0-3-3.9'/%3E%3Cpath d='M16 3.6a4 4 0 0 1 0 7'/%3E%3C/svg%3E");
  --i-dot:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='3'/%3E%3C/svg%3E");
}

.ic-clam{-webkit-mask-image:var(--i-clam);mask-image:var(--i-clam)}
.ic-wave{-webkit-mask-image:var(--i-wave);mask-image:var(--i-wave)}
.ic-clock{-webkit-mask-image:var(--i-clock);mask-image:var(--i-clock)}
.ic-ticket{-webkit-mask-image:var(--i-ticket);mask-image:var(--i-ticket)}
.ic-boot{-webkit-mask-image:var(--i-boot);mask-image:var(--i-boot)}
.ic-shower{-webkit-mask-image:var(--i-shower);mask-image:var(--i-shower)}
.ic-locker{-webkit-mask-image:var(--i-locker);mask-image:var(--i-locker)}
.ic-park{-webkit-mask-image:var(--i-park);mask-image:var(--i-park)}
.ic-shop{-webkit-mask-image:var(--i-shop);mask-image:var(--i-shop)}
.ic-shield{-webkit-mask-image:var(--i-shield);mask-image:var(--i-shield)}
.ic-pin{-webkit-mask-image:var(--i-pin);mask-image:var(--i-pin)}
.ic-photo{-webkit-mask-image:var(--i-photo);mask-image:var(--i-photo)}
.ic-doc{-webkit-mask-image:var(--i-doc);mask-image:var(--i-doc)}
.ic-mail{-webkit-mask-image:var(--i-mail);mask-image:var(--i-mail)}
.ic-users{-webkit-mask-image:var(--i-users);mask-image:var(--i-users)}

/* 관리자 사이드바 아이콘 */
.adm-side a::before{content:"";width:15px;height:15px;flex:none;background:currentColor;opacity:.55;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;
  -webkit-mask-position:center;mask-position:center;
  -webkit-mask-image:var(--i-dot);mask-image:var(--i-dot)}
.adm-side a.on::before{opacity:1}
.adm-side a[href*="dashboard"]::before{-webkit-mask-image:var(--i-grid);mask-image:var(--i-grid)}
.adm-side a[href*="tide"]::before{-webkit-mask-image:var(--i-clock);mask-image:var(--i-clock)}
.adm-side a[href*="notice"]::before{-webkit-mask-image:var(--i-doc);mask-image:var(--i-doc)}
.adm-side a[href*="group"]::before{-webkit-mask-image:var(--i-users);mask-image:var(--i-users)}
.adm-side a[href*="price"]::before{-webkit-mask-image:var(--i-ticket);mask-image:var(--i-ticket)}
.adm-side a[href*="faq"]::before{-webkit-mask-image:var(--i-mail);mask-image:var(--i-mail)}

/* 빈 상태 아이콘 */
.empty::before{content:"";display:block;width:32px;height:32px;margin:0 auto 16px;background:var(--line2);
  -webkit-mask:var(--i-doc) no-repeat center/contain;mask:var(--i-doc) no-repeat center/contain}

/* ══════════════════════════════════════════════════════════
   실사진이 들어온 자리
   photo() 가 assets/img/ 에서 파일을 찾으면 회색 상자 대신 <img> 를 넣는다.
   비율(r169 · r43 · r11 · wide)은 그대로 유지돼서 레이아웃이 흔들리지 않는다.
   ══════════════════════════════════════════════════════════ */
.ph.has{background:none;padding:0;border:0;overflow:hidden;display:block}
.ph.has img{width:100%;height:100%;object-fit:cover;display:block}
