/* 설명서의 기존 HTML 화면 그림을 되살린다. PC는 설명 옆, 모바일은 설명 바로 아래. */
.g-wrap:has(.guide-pair){max-width:1480px;grid-template-columns:220px minmax(0,1fr);gap:36px}
.g-main:has(.guide-pair){max-width:none}
.g-main:has(.guide-pair)>.lead{max-width:55ch}
.g-main:has(.guide-pair)>p,.g-main:has(.guide-pair)>ul,.g-main:has(.guide-pair)>ol,.g-main:has(.guide-pair)>table{max-width:760px}
.guide-pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,360px);gap:30px;align-items:start;margin:36px 0 42px}
.guide-pair>.guide-copy{min-width:0}
.g-main .guide-copy>h2:first-child{margin-top:0;padding-top:20px}
.g-main .guide-copy>h3:first-child{margin-top:0}
.g-main .guide-copy>p:first-child{margin-top:0}
.guide-pair>.guide-visual{min-width:0;margin:0;padding-top:20px;position:sticky;top:94px;align-self:start}
.guide-visual{width:100%;max-width:400px;margin-inline:auto}
.guide-visual .mk{max-width:360px;font-size:14px;line-height:1.6;user-select:text;box-shadow:0 14px 32px -24px rgba(69,23,42,.3)}
.guide-visual .mk .scr{min-height:0}
.guide-visual .mk .body{min-height:0;padding:16px 14px 18px;gap:12px}
.guide-visual .mk .top{padding:12px 14px}
.guide-visual .mk .acc{font-size:12px;min-width:0;overflow-wrap:anywhere}
.guide-visual .mk .top .brand{font-family:var(--serif);font-size:17px}
.g-main .guide-visual .mk p,.guide-visual .mk .ta,.guide-visual .mk .bub{font-size:14px;line-height:1.65;margin:0}
.g-main .guide-visual .mk li{font-size:13px;line-height:1.6}
.guide-visual .mk .btn{font-size:14px;padding:10px 12px;min-height:40px;white-space:normal;cursor:default}
.guide-visual .mk .opt b,.guide-visual .mk .ct b,.guide-visual .mk .gcard b{font-size:14px}
.guide-visual .mk .opt small,.guide-visual .mk .muted,.guide-visual .mk .ct small,.guide-visual .mk .gcard small,.guide-visual .mk .in label,.guide-visual .mk .in small,.guide-visual .mk .cnt small{font-size:12px;color:#75636b;line-height:1.55}
.guide-visual .mk .in span{font-size:14px;min-height:40px;overflow-wrap:anywhere}
.guide-visual .mk .in span.ph{color:#796a71}
.guide-visual .mk .chip,.guide-visual .mk .kw,.guide-visual .mk .taba,.guide-visual .mk .stat,.guide-visual .mk .fold span{font-size:12px}
.guide-visual .mk .tabs span{font-size:12px;padding:10px 2px;line-height:1.35;word-break:keep-all;color:#75636b}
.guide-visual .mk .tabs span.on{color:var(--wine);font-weight:700}
.guide-visual .mk .tabs span i{font-size:16px;line-height:1.3;margin-bottom:4px}
.guide-visual .mk .row{flex-wrap:wrap}
.guide-visual .mk .row>*{min-width:0}
.guide-visual .mk .tiles span{font-size:13px;padding:10px}
.guide-visual .mk .card{font-size:14px;overflow-wrap:anywhere}
.guide-visual .mk .menu{font-size:13px}
.guide-visual .mk .menu span{font-size:13px}
.guide-visual .mk .cal{font-size:13px}
.guide-visual .mk .cal i{font-size:12px;color:#75636b}
.guide-visual .mk .flash{font-size:13px;line-height:1.6}
.guide-visual .mk .hl::before,.guide-visual .mk .hl::after,.guide-visual .mk .typing::after{animation:none}
.guide-visual .mk .gv-title{display:block;font-size:16px;font-weight:700;line-height:1.45;margin:0 0 4px}
.guide-visual .mk .gv-label{font-size:12px;color:#75636b;line-height:1.55}
.guide-visual .mk .gv-mark{outline:2px solid #a66378;outline-offset:3px;border-radius:9px}
.guide-visual .gv-note{font-size:13px;line-height:1.6;padding:10px 12px;background:#f8f3f5;color:var(--wine);border-radius:9px}
.guide-visual .gv-media{aspect-ratio:16/9;display:grid;place-items:center;background:var(--paper-2);border:1px dashed var(--line);border-radius:10px;overflow:hidden}
.guide-visual .gv-media img{display:block;width:100%;height:100%;min-height:0;object-fit:cover}
.guide-visual figcaption,.g-main .guide-visual figcaption{font-size:13px;line-height:1.75;text-align:left;color:var(--ink-2);max-width:360px;padding:3px 3px 0}
.guide-visual figcaption b{color:var(--wine)}
.install-guide .guide-pair{grid-template-columns:minmax(0,1fr) 280px}
.install-guide .ph{width:100%;font-size:14px;padding:14px;border:0;border-radius:0;box-shadow:none}
.install-guide .ph .phone-note{font-size:12px}
@media(max-width:1150px){
  .g-wrap:has(.guide-pair){grid-template-columns:190px minmax(0,1fr);gap:26px}
  .guide-pair{grid-template-columns:minmax(0,1fr) minmax(250px,300px);gap:24px}
}
@media(max-width:1000px){
  .guide-pair,.install-guide .guide-pair{grid-template-columns:1fr;gap:14px;margin:30px 0 38px}
  .guide-pair>.guide-visual{position:static;padding-top:0;justify-self:center}
}
@media(max-width:900px){
  .g-wrap:has(.guide-pair){display:block;padding:0 20px}
  .g-main:has(.guide-pair){max-width:760px}
}
@media(max-width:600px){
  .guide-pair{margin:28px 0 36px;gap:14px}
  .guide-pair>.guide-visual{max-width:380px;margin:0 auto 4px}
  .guide-visual .mk{border-radius:19px}
  .guide-visual .mk .body{padding:15px 13px;gap:11px}
}
@media(max-width:380px){
  .g-wrap:has(.guide-pair){padding:0 17px}
  .guide-visual .mk .tabs span{font-size:12px;padding-inline:1px}
  .guide-visual .mk .top{padding-inline:12px}
}
