/* ★10-01 모바일(819px 이하) 앱 화면 배치 — index.html <head> 에서 바로 읽는다(그려진 뒤 바뀌는 깜빡임 방지). 원본은 이 파일 */
@media (max-width:819px){.app{display:block!important}
.side{position:fixed!important;left:0;top:0;bottom:0;width:270px!important;height:100%!important;transform:translateX(-102%);transition:transform .22s ease;z-index:1001!important;box-shadow:0 0 40px rgba(0,0,0,.18);background:var(--side,#fff)}
body.mnav-open .side{transform:none}
#mnavBg{display:none;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:1000}
body.mnav-open #mnavBg{display:block}
#mnavBtn{display:flex!important}
#mnavHome{display:block!important}
.work-top{left:0!important;padding:10px 12px 10px 60px!important;min-height:58px!important;flex-wrap:wrap;gap:6px}
.work-top .gp{flex:1 1 100%;margin-left:0}
.work-top #planBtn{padding:6px 12px!important}
.work-top #topNav{position:fixed;left:0;right:0;bottom:0;z-index:998;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:rgba(255,255,255,.97);border-top:1px solid #e6e8ec;box-shadow:0 -4px 16px rgba(0,0,0,.06)}
.work-top #topNav:empty{display:none}
.work-top #topNav{flex-wrap:wrap}
.work-top #topNav>*:not(.btn){flex:1 1 100%;order:-1;writing-mode:horizontal-tb;font-size:13px}
.work-top #topNav>*:not(.btn) *{writing-mode:horizontal-tb}
.work-top #topNav .btn{padding:12px 22px!important;font-size:15px!important}
body.has-tnav .work{padding-bottom:96px!important}
.work{height:auto!important;min-height:100vh;padding:74px 14px 40px!important;overflow-x:hidden}
.work img,.work video,.work canvas{max-width:100%}
.work table{display:block;overflow-x:auto;max-width:100%}
.hero-big{height:62vh!important}
.hero-h{font-size:28px!important;line-height:1.3!important}
.fsec{grid-template-columns:1fr!important;gap:18px!important;padding:28px 0!important}
.fsec.flip .fsec-media{order:0!important}
.sysbox-grid,.fd-two,.pr-grid{grid-template-columns:1fr!important}
.film-row{grid-template-columns:1fr!important}
.qrx-mini{flex-direction:column!important;padding:14px!important}
.qrx-card,.qrx-tx{flex:none!important;width:100%!important;min-width:0!important}
#srvbar{display:none!important}
}
#mnavBtn{display:none;position:fixed;top:9px;left:10px;z-index:999;width:42px;height:40px;align-items:center;justify-content:center;border:1px solid #d8dbe0;border-radius:10px;background:#fff;font-size:20px;cursor:pointer;color:#111}