/* 이 파일의 규칙은 모두 #p-<화면이름> 안쪽에만 걸립니다.
   접두사를 떼면 특이도가 낮아져 base.css 의 반응형 규칙을 덮어쓰게 되므로 그대로 둡니다. */
#p-article-mes h1, #p-article-mes h2, #p-article-mes h3, #p-article-mes h4{margin:0;font-weight:700;line-height:.95;color:var(--ink)}
#p-article-mes p{margin:0}
#p-article-mes :focus-visible{outline:2px solid var(--ink);outline-offset:2px}
#p-article-mes .display-xl{font-size:clamp(32px, 20.4px + 3.09vw, 56px);font-weight:700;line-height:1.2}
#p-article-mes .display-lg{font-size:clamp(26px, 19.2px + 1.80vw, 40px);font-weight:700;line-height:1}
#p-article-mes .display-md{font-size:clamp(22px, 17.2px + 1.29vw, 32px);font-weight:700;line-height:1}
#p-article-mes .heading-lg{font-size:24px;font-weight:700;line-height:.95}
#p-article-mes .subtitle{font-size:19.2px;font-weight:600;line-height:1.3}
#p-article-mes .body-lg{font-size:18px;line-height:1.5}
#p-article-mes .body-md{font-size:16px;line-height:1.4}
#p-article-mes .body-sm{font-size:14px;line-height:1.57}
#p-article-mes .caption{font-size:12px;line-height:1.4}
#p-article-mes .overline{font-size:12px;font-weight:700;line-height:1.45;letter-spacing:0}
#p-article-mes  
.band{padding:var(--s-section) 64px}
#p-article-mes .band.light{background:var(--canvas)}
#p-article-mes .band.soft{background:var(--surface-soft)}
#p-article-mes .band.dark{background:var(--surface-dark);color:var(--on-dark)}
#p-article-mes .band.dark h1, #p-article-mes .band.dark h2, #p-article-mes .band.dark h3{color:var(--on-dark)}
#p-article-mes .inner{max-width:1152px;margin:0 auto}
@media(max-width:900px){#p-article-mes .band{padding:96px 24px}}
#p-article-mes .btn{display:inline-flex;align-items:center;justify-content:center;font-size:15px;font-weight:700;letter-spacing:.144px;line-height:1;
  padding:14px 24px;border-radius:var(--r-xs);border:1px solid transparent;min-height:50px}
#p-article-mes .btn-primary{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
#p-article-mes .band.dark .btn-primary{background:var(--accent-on-dark);color:var(--ink);border-color:var(--accent-on-dark)}
#p-article-mes .btn-outline-dark{background:var(--canvas);color:var(--ink);border-color:var(--hairline-strong);padding:13px 23px}
#p-article-mes .btn-outline-light{background:var(--surface-dark);color:var(--on-dark);border-color:var(--on-dark);padding:13px 23px}
#p-article-mes .btns{display:flex;flex-wrap:wrap;gap:var(--s-sm)}
#p-article-mes .more{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:700;color:var(--ink);
  border-bottom:1px solid var(--ink);padding-bottom:2px;align-self:flex-start}
#p-article-mes .band.dark .more{color:var(--on-dark);border-bottom-color:var(--on-dark)}
#p-article-mes  
.hero{background:var(--surface-dark);color:var(--on-dark);padding:var(--s-section) 64px}
#p-article-mes .hero .inner{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--s-xxxl)}
#p-article-mes .hero .stack{display:flex;flex-direction:column;align-items:center;gap:var(--s-lg)}
#p-article-mes .hero h1{color:var(--on-dark);max-width:18ch}
#p-article-mes .hero .subtitle{color:var(--on-dark-mute);max-width:46ch}
@media(max-width:900px){#p-article-mes .hero{padding:96px 24px}}
#p-article-mes  
.filmband{background:var(--surface-dark);padding:0 64px var(--s-section)}
@media(max-width:900px){#p-article-mes .filmband{padding:0 24px 96px}}
#p-article-mes .film{max-width:1152px;margin:0 auto;height:542px;background:var(--surface-deep);
  display:flex;align-items:flex-end;justify-content:flex-start;padding:var(--s-lg)}
@media(max-width:900px){#p-article-mes .film{height:340px}}
#p-article-mes .film .lb{font-size:11px;color:rgba(255,255,255,.35)}
#p-article-mes  
.cloud{display:flex;flex-wrap:wrap;gap:var(--s-lg) 56px;align-items:center;margin-top:var(--s-xl);
  padding-top:var(--s-xl);border-top:1px solid var(--hairline-strong)}
#p-article-mes .cloud .c{font-size:24px;font-weight:700;color:var(--ink);letter-spacing:-.01em}
#p-article-mes  
.frow{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:var(--s-xxxl)}
@media(max-width:900px){#p-article-mes .frow{grid-template-columns:1fr;gap:var(--s-xl)}}
#p-article-mes .fcopy{display:flex;flex-direction:column;gap:var(--s-md)}
#p-article-mes .fcopy .d{font-size:17px;line-height:1.6;color:var(--charcoal)}
#p-article-mes .band.dark .fcopy .d{color:var(--on-dark-mute)}
#p-article-mes .fcopy ul{list-style:none;margin:var(--s-xs) 0 0;padding:0;display:flex;flex-direction:column;gap:var(--s-xs)}
#p-article-mes .fcopy li{font-size:16px;font-weight:700;color:var(--ink);border-top:1px solid var(--hairline);padding-top:var(--s-xs)}
#p-article-mes .band.dark .fcopy li{color:var(--on-dark);border-top-color:var(--divider-dark)}
#p-article-mes .fimg{height:440px;background:var(--surface-soft);
  display:flex;align-items:flex-end;justify-content:flex-start;padding:var(--s-md)}
#p-article-mes .band.dark .fimg{background:var(--surface-deep)}
#p-article-mes .fimg .lb{font-size:11px;color:var(--ash)}
#p-article-mes .band.dark .fimg .lb{color:rgba(255,255,255,.35)}
@media(max-width:900px){#p-article-mes .fimg{height:260px}
#p-article-mes .frow.rev .fimg{order:-1}}
#p-article-mes  
.nums{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-xxxl);margin-top:var(--s-xxl)}
@media(max-width:767px){#p-article-mes .nums{grid-template-columns:1fr;gap:var(--s-xl)}}
#p-article-mes .nums .n{border-top:1px solid var(--hairline-strong);padding-top:var(--s-md);display:flex;flex-direction:column;gap:var(--s-xs)}
#p-article-mes .nums .v{font-size:40px;font-weight:700;line-height:.95;color:var(--ink);font-variant-numeric:tabular-nums}
#p-article-mes .nums .t{font-size:16px;font-weight:700;color:var(--ink);margin-top:4px}
#p-article-mes .nums .d{font-size:14px;line-height:1.6;color:var(--mute)}
#p-article-mes  
.cta{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--s-lg)}
#p-article-mes .cta p{color:var(--on-dark-mute);max-width:50ch}
#p-article-mes  
a{text-decoration:none;color:inherit}
#p-article-mes .btn{transition:background-color .15s,color .15s,border-color .15s;cursor:pointer}
#p-article-mes .btn-primary:hover{background:var(--accent-deep);border-color:var(--accent-deep)}
#p-article-mes .band.dark .btn-primary:hover{background:#e6e6e6;border-color:#e6e6e6}
#p-article-mes .btn-outline-light:hover{background:var(--on-dark);color:var(--ink)}
#p-article-mes .more{transition:opacity .15s}
#p-article-mes .more:hover{opacity:.6}
#p-article-mes  
.arts{border-top:1px solid var(--hairline-strong);margin-top:var(--s-xxl)}
#p-article-mes .art{display:grid;grid-template-columns:minmax(260px,1fr) 1.45fr;gap:var(--s-xxxl);
  padding:var(--s-xxxl) 0;border-bottom:1px solid var(--hairline)}
#p-article-mes .art:last-of-type{border-bottom:0}
@media(max-width:900px){#p-article-mes .art{grid-template-columns:1fr;gap:var(--s-lg);padding:var(--s-xl) 0}}
#p-article-mes .art .meta{display:flex;gap:var(--s-sm);align-items:center;margin-bottom:var(--s-md)}
#p-article-mes .art .dt{font-size:12px;font-weight:700;letter-spacing:.06em;color:var(--ash);font-variant-numeric:tabular-nums}
#p-article-mes .art .cat{font-size:10px;font-weight:700;letter-spacing:.16em;color:var(--mute);
  border:1px solid var(--stone);padding:3px 8px;line-height:1}
#p-article-mes .art h3{font-size:30px;line-height:1.05;color:var(--ink)}
@media(max-width:767px){#p-article-mes .art h3{font-size:24px}}
#p-article-mes .art .side{align-self:start}
#p-article-mes .art .main{display:flex;flex-direction:column;gap:var(--s-lg);align-items:flex-start}
#p-article-mes .art .lede{font-size:17px;line-height:1.7;color:var(--charcoal)}
#p-article-mes .ev{width:100%;border-top:1px solid var(--hairline-strong);padding-top:var(--s-xs)}
#p-article-mes .ev .rw{display:grid;grid-template-columns:1fr auto;gap:var(--s-md);align-items:baseline;
  padding:10px 0;border-bottom:1px solid var(--hairline)}
#p-article-mes .ev .rw:last-child{border-bottom:0}
#p-article-mes .ev .k{font-size:14px;line-height:1.45;color:var(--mute)}
#p-article-mes .ev .n{font-size:15px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap}
#p-article-mes .ev .rw.hi .k{color:var(--ink);font-weight:700}
#p-article-mes .evcap{font-size:12px;line-height:1.6;color:var(--ash);margin-top:var(--s-sm)}
#p-article-mes .vs{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-lg);width:100%}
@media(max-width:600px){#p-article-mes .vs{grid-template-columns:1fr;gap:var(--s-md)}}
#p-article-mes .vs .col{border-top:2px solid var(--hairline-strong);padding-top:var(--s-sm)}
#p-article-mes .vs .col.off{border-top-color:var(--stone)}
#p-article-mes .vs .cl{font-size:14px;font-weight:700;color:var(--ink)}
#p-article-mes .vs .col.off .cl{color:var(--mute)}
#p-article-mes .vs .cd{font-size:14px;line-height:1.65;color:var(--mute);margin-top:8px}
#p-article-mes .xref{margin-top:var(--s-xxl);border-top:1px solid var(--hairline-strong);padding-top:var(--s-md);
  display:flex;gap:var(--s-md);flex-wrap:wrap;align-items:baseline;justify-content:space-between}
#p-article-mes .xref .q{font-size:14px;line-height:1.6;color:var(--mute);max-width:62ch}
#p-article-mes  
.ahead{background:var(--surface-dark);color:var(--on-dark);padding:var(--s-section) 64px var(--s-xxxl)}
@media(max-width:900px){#p-article-mes .ahead{padding:64px 24px 32px}}
#p-article-mes .ahead .in{max-width:1152px;margin:0 auto}
#p-article-mes .crumb{display:flex;gap:var(--s-xs);align-items:center;font-size:12px;font-weight:700;
  letter-spacing:.06em;color:rgba(255,255,255,.5);margin-bottom:var(--s-xl)}
#p-article-mes .crumb a{color:rgba(255,255,255,.5)}
#p-article-mes .crumb a:hover{color:var(--on-dark)}
#p-article-mes .amt{display:flex;gap:var(--s-sm);align-items:center;margin-bottom:var(--s-lg)}
#p-article-mes .amt .dt{font-size:12px;font-weight:700;letter-spacing:.06em;color:rgba(255,255,255,.55);font-variant-numeric:tabular-nums}
#p-article-mes .amt .cat{font-size:10px;font-weight:700;letter-spacing:.16em;color:var(--on-dark);
  border:1px solid rgba(255,255,255,.4);padding:3px 8px;line-height:1}
#p-article-mes .ahead h1{color:var(--on-dark);max-width:20ch}
#p-article-mes .ahead .lede{font-size:19px;line-height:1.7;color:var(--on-dark-mute);max-width:62ch;margin-top:var(--s-xl)}
#p-article-mes .abody{background:var(--canvas);padding:var(--s-xxxl) 64px var(--s-section)}
@media(max-width:900px){#p-article-mes .abody{padding:40px 24px 64px}}
#p-article-mes .abody .in{max-width:1152px;margin:0 auto;display:grid;grid-template-columns:200px minmax(0,1fr);gap:var(--s-xxxl)}
@media(max-width:1023px){#p-article-mes .abody .in{grid-template-columns:1fr;gap:var(--s-xl)}}
#p-article-mes .toc{position:sticky;top:84px;align-self:start;display:flex;flex-direction:column;gap:var(--s-sm);
  border-top:1px solid var(--hairline-strong);padding-top:var(--s-sm)}
@media(max-width:1023px){#p-article-mes .toc{position:static;flex-direction:row;flex-wrap:wrap;gap:var(--s-md)}}
#p-article-mes .toc .lb{font-size:10px;font-weight:700;letter-spacing:.16em;color:var(--ash)}
#p-article-mes .toc a{font-size:14px;line-height:1.45;color:var(--mute)}
#p-article-mes .toc a:hover{color:var(--ink)}
#p-article-mes .prose{max-width:68ch}
#p-article-mes .prose h2{font-size:28px;line-height:1.15;margin:var(--s-xxxl) 0 var(--s-md)}
#p-article-mes .prose h2:first-child{margin-top:0}
@media(max-width:767px){#p-article-mes .prose h2{font-size:23px}}
#p-article-mes .prose p{font-size:18px;line-height:1.8;color:var(--charcoal);margin-bottom:var(--s-md)}
#p-article-mes .prose p b{color:var(--ink);font-weight:700}
#p-article-mes .prose a.inl{color:var(--ink);font-weight:700;border-bottom:1px solid var(--stone)}
#p-article-mes .prose a.inl:hover{border-bottom-color:var(--ink)}
#p-article-mes .pledge{list-style:none;margin:var(--s-lg) 0 var(--s-xl);padding:0;border-top:1px solid var(--hairline-strong)}
#p-article-mes .pledge li{display:grid;grid-template-columns:32px 1fr;gap:var(--s-md);align-items:baseline;
  padding:var(--s-md) 0;border-bottom:1px solid var(--hairline)}
#p-article-mes .pledge .no{font-size:14px;font-weight:700;color:var(--ash);font-variant-numeric:tabular-nums}
#p-article-mes .pledge .tx{font-size:17px;line-height:1.6;color:var(--ink)}
#p-article-mes .pledge .tx span{display:block;font-size:15px;font-weight:400;color:var(--mute);margin-top:4px}
#p-article-mes .terms{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s-lg);margin:var(--s-xl) 0}
@media(max-width:600px){#p-article-mes .terms{grid-template-columns:1fr}}
#p-article-mes .terms .t{border-top:2px solid var(--hairline-strong);padding-top:var(--s-sm)}
#p-article-mes .terms .v{font-size:32px;font-weight:700;line-height:1;color:var(--ink);font-variant-numeric:tabular-nums}
#p-article-mes .terms .k{font-size:14px;font-weight:700;color:var(--ink);margin-top:var(--s-sm)}
#p-article-mes .terms .d{font-size:14px;line-height:1.6;color:var(--mute);margin-top:4px}
#p-article-mes .pull{border-left:2px solid var(--ink);padding:var(--s-xs) 0 var(--s-xs) var(--s-lg);margin:var(--s-xl) 0}
#p-article-mes .pull p{font-size:21px;line-height:1.55;font-weight:700;color:var(--ink);margin:0}
#p-article-mes .rel{border-top:1px solid var(--hairline-strong);margin-top:var(--s-xxxl);padding-top:var(--s-md)}
#p-article-mes .rel .lb{font-size:10px;font-weight:700;letter-spacing:.16em;color:var(--ash)}
#p-article-mes .rel a{display:grid;grid-template-columns:1fr 24px;gap:var(--s-md);align-items:baseline;
  padding:var(--s-md) 0;border-bottom:1px solid var(--hairline)}
#p-article-mes .rel a:last-child{border-bottom:0}
#p-article-mes .rel .h{font-size:17px;font-weight:700;line-height:1.4;color:var(--ink)}
#p-article-mes .rel a:hover .h{text-decoration:underline;text-underline-offset:4px}
#p-article-mes .rel .ar{color:var(--mute);justify-self:end}
#p-article-mes .fig{margin:var(--s-xl) 0}
#p-article-mes .fig .ph{aspect-ratio:16/9;background:var(--surface-soft);display:flex;align-items:flex-end;padding:var(--s-md)}
#p-article-mes .fig .ph span{font-size:11px;color:var(--ash)}
#p-article-mes .fig figcaption{font-size:13px;line-height:1.65;color:var(--mute);margin-top:var(--s-sm)}
#p-article-mes .evx{width:100%;border-top:1px solid var(--hairline-strong);padding-top:var(--s-xs);margin:var(--s-xl) 0}
#p-article-mes .evx .rw{display:grid;grid-template-columns:1fr auto;gap:var(--s-md);align-items:baseline;
  padding:11px 0;border-bottom:1px solid var(--hairline)}
#p-article-mes .evx .rw:last-child{border-bottom:0}
#p-article-mes .evx .k{font-size:15px;line-height:1.45;color:var(--mute)}
#p-article-mes .evx .n{font-size:16px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap}
#p-article-mes .evx .rw.hi .k{color:var(--ink);font-weight:700}
#p-article-mes .two{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-lg);margin:var(--s-xl) 0}
@media(max-width:600px){#p-article-mes .two{grid-template-columns:1fr}}
#p-article-mes .two .c{border-top:2px solid var(--hairline-strong);padding-top:var(--s-sm)}
#p-article-mes .two .c.off{border-top-color:var(--stone)}
#p-article-mes .two .l{font-size:15px;font-weight:700;color:var(--ink)}
#p-article-mes .two .c.off .l{color:var(--mute)}
#p-article-mes .two .p{font-size:15px;line-height:1.7;color:var(--mute);margin-top:8px}
#p-article-mes .cite{margin-top:var(--s-xxxl);border-top:1px solid var(--hairline);padding-top:var(--s-md);
  font-size:12px;line-height:1.75;color:var(--ash)}
#p-article-mes .crumb .cur{color:var(--on-dark)}
#p-article-mes .crumb span[aria-hidden]{color:rgba(255,255,255,.25)}
@media(max-width:900px){#p-article-mes .trio{grid-template-columns:1fr}}
#p-article-mes .trio .i{background:var(--canvas);padding:var(--s-xl);display:flex;flex-direction:column;gap:var(--s-sm)}
#p-article-mes .trio .v{font-size:34px;font-weight:700;line-height:.95;color:var(--ink);font-variant-numeric:tabular-nums}
#p-article-mes .trio .t{font-size:17px;font-weight:700;line-height:1.3;color:var(--ink)}
#p-article-mes .trio .d{font-size:14px;line-height:1.7;color:var(--mute)}
#p-article-mes .trio .s{font-size:12px;line-height:1.5;color:var(--ash);border-top:1px solid var(--hairline);padding-top:var(--s-sm);margin-top:auto}
#p-article-mes .spec{border-top:1px solid var(--hairline-strong);margin-top:var(--s-xxl)}
#p-article-mes .spec .r{display:grid;grid-template-columns:230px 180px 1fr;gap:var(--s-lg);align-items:baseline;
  padding:var(--s-lg) 0;border-bottom:1px solid var(--hairline)}
@media(max-width:767px){#p-article-mes .spec .r{grid-template-columns:1fr;gap:4px}}
#p-article-mes .spec .k{font-size:16px;font-weight:700;color:var(--ink)}
#p-article-mes .spec .v{font-size:22px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
#p-article-mes .spec .c{font-size:14px;line-height:1.6;color:var(--mute)}
#p-article-mes .iface{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-xxxl);margin-top:var(--s-xxl)}
@media(max-width:900px){#p-article-mes .iface{grid-template-columns:1fr;gap:var(--s-xl)}}
#p-article-mes .iface ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--s-xs)}
#p-article-mes .iface li{font-size:16px;color:var(--on-dark);border-top:1px solid var(--divider-dark);padding-top:var(--s-xs)}
#p-article-mes .iface .d{font-size:17px;line-height:1.6;color:var(--on-dark-mute)}
#p-article-mes a{text-decoration:none;color:inherit}
#p-article-mes .arts{border-top:1px solid var(--hairline-strong);margin-top:var(--s-xxl)}
#p-article-mes .terms .t{display:flex;flex-direction:column;align-items:flex-start}
#p-article-mes .terms .k{margin-top:8px}
#p-article-mes .terms .d{margin-top:8px}
#p-article-mes .fig{margin:var(--s-xl) 0}
#p-article-mes .fig .ph{aspect-ratio:16/9;background:var(--surface-soft);display:flex;align-items:flex-end;padding:var(--s-md)}
#p-article-mes .fig .ph span{font-size:11px;color:var(--ash);letter-spacing:.02em}
#p-article-mes .fig figcaption{font-size:13px;line-height:1.65;color:var(--mute);margin-top:var(--s-sm)}
#p-article-mes .evx{width:100%;border-top:1px solid var(--hairline-strong);padding-top:var(--s-xs);margin:var(--s-xl) 0}
#p-article-mes .evx .rw{display:grid;grid-template-columns:1fr auto;gap:var(--s-md);align-items:baseline;padding:11px 0;border-bottom:1px solid var(--hairline)}
#p-article-mes .evx .rw:last-child{border-bottom:0}
#p-article-mes .evx .k{font-size:15px;line-height:1.45;color:var(--mute)}
#p-article-mes .evx .n{font-size:16px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap}
#p-article-mes .evx .rw.hi .k{color:var(--ink);font-weight:700}
#p-article-mes .two{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-lg);margin:var(--s-xl) 0}
@media(max-width:600px){#p-article-mes .two{grid-template-columns:1fr}}
#p-article-mes .two .c{border-top:2px solid var(--hairline-strong);padding-top:var(--s-sm)}
#p-article-mes .two .c.off{border-top-color:var(--stone)}
#p-article-mes .two .p{font-size:15px;line-height:1.7;color:var(--mute)}
#p-article-mes .prose .cite{margin-top:var(--s-xxxl);border-top:1px solid var(--hairline);padding-top:var(--s-md);font-size:12px;line-height:1.75;color:var(--ash)}
#p-article-mes .terms .v i{font-style:normal;font-weight:700}
#p-article-mes .terms .v[data-num], #p-article-mes .terms .v[data-t="en"], #p-article-mes .terms .v [data-num]{letter-spacing:-.04em}
#p-article-mes .terms .t, #p-article-mes .two .c{border-top-width:1px}
/* MES 아티클의 조건 카드는 셋인데 격자가 두 열이라 늘 2+1이었습니다.
   본문 폭이 648px이고 가장 넓은 값이 168px이라 세 열로 나누어도 들어갑니다.
   좁아지면 두 열로 접지 않고 곧바로 한 열로 세웁니다. */
#p-article-mes .terms{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:900px){#p-article-mes .terms{grid-template-columns:1fr}}
@media(pointer:coarse){#p-article-mes .toc{row-gap:var(--s-xl)}}