.art-head .col-text { display: flex; flex-direction: column; gap: var(--sp-label-desc); }
.art-head .svc { font-size: var(--fs-body-sm); line-height: var(--lh-body-sm); letter-spacing: var(--ls-body-sm); color: #5E6370; }   
.art-main { padding-top: var(--sp-heading-content); }
.pic { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: calc(32 * var(--ut)); background: #ECEDF0; }   
.art-body { padding-top: var(--sp-section); }
.art-body .col-text { display: flex; flex-direction: column; gap: var(--sp-text); }
.art-body p { font-size: var(--fs-body); line-height: var(--lh-body); letter-spacing: var(--ls-body); }   
.art-pics { padding-top: var(--sp-section); }
.art-pics .col-grid { display: flex; flex-direction: column; gap: var(--sp-section); }
.pics2 { display: grid; grid-template-columns: 1fr 1fr; gap: calc(40 * var(--ut)); }
.art-credit { padding-top: var(--sp-section); }
.art-credit .col-text { display: flex; flex-direction: column; gap: var(--sp-heading-content); }
.art-credit h2 { margin: 0; font-family: var(--heading); font-size: var(--fs-title); line-height: var(--lh-title); font-weight: 500; letter-spacing: var(--ls-title); }   
.credit { margin: 0; display: flex; flex-direction: column; gap: var(--sp-text); }
.credit div { display: flex; flex-direction: column; gap: var(--sp-label-desc); }
.credit dt { font-size: var(--fs-body-sm); line-height: var(--lh-body-sm); letter-spacing: var(--ls-body-sm); color: #5E6370; }   
.credit dd { margin: 0; font-size: var(--fs-body); line-height: var(--lh-body); letter-spacing: var(--ls-body); }                     
.pager { box-sizing: border-box; width: min(calc(884 * var(--uh)), calc(100% - 2 * var(--sp-gutter)));    margin: var(--sp-section) auto 0; padding-top: var(--sp-group); border-top: 1px solid #C9CCD3; display: grid; grid-template-columns: 1fr 1fr 1fr; align-items: start; }
.pager a { display: inline-flex; align-items: center; gap: calc(4 * var(--ut)); font-size: var(--fs-body-sm); line-height: var(--lh-body-sm); letter-spacing: var(--ls-body-sm); color: #5E6370; text-decoration: none; transition: color .25s var(--ease-out-cubic); }
.pager a:hover { color: #1A1A1C; }
.pager .idx { justify-self: center; }
.pager .next { justify-self: end; }
.pager .chev { width: calc(16 * var(--ut)); height: calc(16 * var(--ut)); color: inherit; }
.pager .prev .chev { transform: rotate(180deg); }
@media (prefers-reduced-motion: reduce) { .pager a { transition: none; } }
.pic-free { aspect-ratio: auto; }   
@media (max-width: 1023px) {   
  .pic { border-radius: 16px; }
  .art-pics .col-grid { gap: var(--sp-column-gap); }
  .pics2 { grid-template-columns: 1fr; gap: var(--sp-column-gap); }
  .pager { width: min(var(--sp-max), calc(100% - 2 * var(--sp-gutter))); column-gap: 16px; }
}
