/* 이펙터 · 2026-10 제작 · 눈코센터 페이지 스타일 */

:root {
  --en-pink: #f997ba;
  --en-blue: #84c4ff;
  --en-narrow: 62.5rem;
  --en-sub: 1.0625rem;
  --en-sub-sm: .9375rem;
  --en-cap: 1rem;
  --en-label: 1.25rem;
}
@media (min-width: 576px) { :root { --en-sub: 1.125rem; --en-sub-sm: 1rem; --en-cap: 1.0625rem; --en-label: 1.375rem; } }
@media (min-width: 768px) { :root { --en-sub: 1.375rem; --en-sub-sm: 1.125rem; --en-cap: 1.125rem; --en-label: 1.625rem; } }
@media (min-width: 992px) { :root { --en-sub: 1.5rem; --en-sub-sm: 1.25rem; --en-cap: 1.25rem; --en-label: 1.75rem; } }
@media (min-width: 1400px) { :root { --en-sub: 1.875rem; --en-sub-sm: 1.5rem; --en-label: 1.875rem; } }

.en-eye { --en-accent: var(--en-pink); }
.en-nose { --en-accent: var(--en-blue); }

.sp-kv.sp-kv-full .sp-kv-img { inset: 0; width: 100%; height: 100%; transform: none; object-fit: cover; }
.sp-kv.sp-kv-full .img-ph.sp-kv-img { aspect-ratio: auto !important; }

.en-head { margin: 0; }
.en-t { margin: 0; font-size: var(--sp-h3); font-weight: 700; line-height: 1.4; color: var(--ss-ink); }
.en-t-c { text-align: center; }
.en-t b { font-weight: 700; }
.en-t-reg { font-weight: 400; }
.en-d { margin: .75rem 0 0; font-size: var(--en-sub); font-weight: 500; line-height: 1.5; letter-spacing: -.012em; color: var(--ss-text); }
.en-d-sm { font-size: var(--en-sub-sm); line-height: 1.42; }
.en-d-c { text-align: center; }
.en-d-reg { font-weight: 400; }
.en-d-cap { font-size: var(--en-cap); line-height: 1.5; }
@media (min-width: 768px) { .en-d { margin-top: 1rem; } }
@media (min-width: 992px) { .en-d { margin-top: 1.25rem; } }
.en-head + .en-media, .en-head + .en-duo, .en-head + .sp-pair, .en-head + .en-pair, .en-head + .en-fig { margin-top: 2rem; }
@media (min-width: 768px) { .en-head + .en-media, .en-head + .en-duo, .en-head + .sp-pair, .en-head + .en-pair, .en-head + .en-fig { margin-top: 3rem; } }
@media (min-width: 992px) { .en-head + .en-media, .en-head + .en-duo, .en-head + .sp-pair, .en-head + .en-pair, .en-head + .en-fig { margin-top: 5.5rem; } }

.en-narrow { max-width: var(--en-narrow); margin-inline: auto; }
.en-lead-fig { margin: 0; }
.en-lead-fig .img-ph, .en-lead-fig img { border-radius: var(--sp-r); }
.en-lead-t { margin: 1.5rem 0 0; font-size: var(--sp-h3); font-weight: 700; line-height: 1.4; color: var(--ss-ink); }
.en-lead-d { margin: .75rem 0 0; font-size: var(--en-sub); font-weight: 500; line-height: 1.53; letter-spacing: -.012em; color: var(--ss-text); }
.en-lead-d ul { margin: 0; padding: 0; list-style: none; }
.en-lead-d li { display: flex; gap: .4em; }
.en-bul { flex: none; width: .75em; text-align: center; }
@media (min-width: 768px) { .en-lead-t { margin-top: 2rem; } .en-lead-d { margin-top: 1rem; } }
@media (min-width: 992px) { .en-lead-t { margin-top: 2.375rem; } .en-lead-d { margin-top: 1.25rem; } }

.en-duo { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sp-gap); align-items: center; }
.en-duo .img-ph, .en-duo img { border-radius: var(--sp-r); }
.en-duo-g { width: 100%; margin-inline: auto; }
.en-duo-g .img-ph, .en-duo-g img { border-radius: 0; }
@media (min-width: 768px) { .en-duo { grid-template-columns: repeat(2, minmax(0, 1fr)); } .en-duo-g { width: 85.5%; } }
.en-fig { margin: 0; }
.en-fig .img-ph, .en-fig img { border-radius: 0; }

@media (min-width: 768px) { .sp-feat-panel-top { grid-template-columns: minmax(0, 1fr); } .sp-feat-panel-top .sp-feat-pic { order: -1; height: auto; max-width: none; aspect-ratio: var(--r, 866 / 272); } }
.sp-feat-panel-top .sp-feat-pic { max-width: none; margin-inline: 0; }
.sp-feat-panel-top .sp-feat-txt { gap: 1rem; padding-bottom: 1.5rem; }
.sp-feat-panel-top .sp-feat-title + .sp-feat-desc, .sp-feat-panel-top .sp-feat-txt > .sp-feat-desc { margin-top: 0; }
@media (min-width: 1400px) { .sp-feat-panel-top .sp-feat-txt { gap: 2.25rem; padding: 2.25rem 2.5rem 2.75rem 2.4375rem; } }
.sp-feat-panel-top .sp-feat-pic { border-radius: var(--sp-r-lg) var(--sp-r-lg) 0 0; overflow: hidden; }

.en-cmp { width: 100%; border-collapse: collapse; table-layout: fixed; background: var(--ss-white); font-size: .8125rem; line-height: 1.45; color: var(--ss-text); }
.en-cmp th, .en-cmp td { padding: .5rem .5rem; border: 1px solid var(--ss-line-strong); text-align: center; vertical-align: middle; font-weight: 400; }
.en-cmp-corner { width: 4.5rem; border-color: var(--ss-line-strong); }
.en-cmp thead th { padding: .625rem .5rem; border-color: var(--ss-ink); background: var(--ss-ink); color: var(--ss-white); font-size: .9375rem; font-weight: 600; }
.en-cmp thead .en-cmp-corner { border: 1px solid var(--ss-line-strong); border-bottom-color: transparent; }
.en-cmp-pic th { border-top-color: transparent; }
.en-cmp .en-cmp-pic td { padding: 0; border-top-color: var(--ss-ink); }
.en-cmp-pic .img-ph, .en-cmp-pic img { width: 100%; border-radius: 0; }
.en-cmp tbody th { font-size: .9375rem; font-weight: 500; color: var(--ss-ink); }
.en-cmp td b { font-weight: 700; color: var(--ss-ink); }
@media (min-width: 576px) { .en-cmp { font-size: .9375rem; } .en-cmp-corner { width: 6rem; } .en-cmp tbody th { font-size: 1.0625rem; } .en-cmp thead th { font-size: 1.0625rem; } .en-cmp th, .en-cmp td { padding: .75rem 1rem; } }
@media (min-width: 992px) { .en-cmp { font-size: 1.0625rem; } .en-cmp-corner { width: 9.8125rem; } .en-cmp tbody th { font-size: 1.25rem; } .en-cmp thead th { padding: .875rem 1rem; font-size: 1.125rem; } .en-cmp tbody th, .en-cmp tbody td { height: 4.4375rem; } }
@media (min-width: 1400px) { .en-cmp { font-size: 1.125rem; } .en-cmp tbody th { font-size: 1.375rem; } }

.en-gray { margin-top: var(--sp-sec); padding-block: var(--sp-sec-sm); background: var(--ss-bg-soft); }
.en-gray .en-block + .en-block { margin-top: var(--sp-sec-sm); }
.en-block-h { margin: 0; text-align: center; font-size: var(--sp-h2); font-weight: 600; line-height: 1.25; color: var(--ss-ink); }
.en-block-d { margin: .75rem 0 0; text-align: center; font-size: 1rem; font-weight: 400; line-height: 1.55; color: var(--ss-text); }
.en-block .sp-steps { margin-top: 2rem; }
@media (min-width: 768px) { .en-block-d { margin-top: 1rem; font-size: 1.0625rem; } .en-block .sp-steps { margin-top: 3rem; } }
@media (min-width: 992px) { .en-block-d { margin-top: 1.25rem; font-size: 1.125rem; } .en-block .sp-steps { margin-top: 4rem; } }
@media (min-width: 1400px) { .en-block-d { font-size: 1.125rem; } }
.sp-steps-3 { max-width: var(--en-narrow); margin-inline: auto; }
@media (max-width: 767.98px) { .sp-steps-3 { grid-template-columns: minmax(0, 1fr); max-width: 22rem; } }
@media (min-width: 768px) { .sp-steps-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; } }
.en-gray .sp-steps-d { color: var(--ss-text-2); }
.en-gray .sp-steps-t { font-weight: 600; }
@media (min-width: 992px) { .en-gray .sp-steps-d { font-size: 1.125rem; margin-inline: 0; } .en-gray .sp-steps-t { font-size: 1.5rem; } }
@media (min-width: 1400px) { .en-gray .sp-steps-d { font-size: 1.125rem; } .en-gray .sp-steps { column-gap: 1.75rem; } }

.en-split-half { display: none; aspect-ratio: 650 / 390; background: no-repeat 0 0 / 200% 100%; }
.en-split-half + .en-split-half { background-position: 100% 0; }
@media (max-width: 767.98px) {
  .en-split { display: grid; gap: 1.25rem; }
  .en-split-half { display: block; }
  .en-split img.en-split-full { display: none; }
}
.en-cmp-wrap { margin-top: 2rem; }
@media (min-width: 768px) { .en-cmp-wrap { margin-top: 3rem; } }
@media (min-width: 992px) { .en-cmp-wrap { margin-top: 4rem; } }

.en-side { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.5rem; align-items: center; }
.en-side-pic { order: -1; margin: 0; }
.en-side-pic .img-ph, .en-side-pic img { border-radius: var(--sp-r); }
.en-side .en-d { margin-top: 1rem; }
@media (min-width: 768px) { .en-side { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: var(--sp-gap); } .en-side-pic { order: 0; } .en-side .en-d { margin-top: 1.5rem; } }
@media (min-width: 992px) { .en-side .en-d { margin-top: 2rem; } }
@media (min-width: 1400px) { .en-side { grid-template-columns: minmax(0, 1fr) 39.6875rem; } }

.en-cases-h { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.5rem; margin: 0; font-size: var(--sp-h3); font-weight: 700; line-height: 1.4; color: var(--ss-ink); }
.en-toggle { position: relative; flex: none; width: 3.125rem; height: 1.5625rem; border: 2px solid var(--en-pink); border-radius: 62.4375rem; background: var(--ss-white); }
.en-toggle::after { content: ""; position: absolute; right: .28125rem; top: 50%; width: 1.125rem; height: 1.125rem; margin-top: -.5625rem; border-radius: 50%; background: var(--en-pink); }
.en-nose .en-toggle { border-color: #b2daff; }
.en-nose .en-toggle::after { background: var(--en-blue); }
@media (min-width: 768px) { .en-toggle { width: 4.25rem; height: 2.125rem; } .en-toggle::after { width: 1.5rem; height: 1.5rem; margin-top: -.75rem; right: .3125rem; } }
@media (min-width: 992px) { .en-toggle { width: 6.25rem; height: 3.125rem; } .en-toggle::after { width: 2.25rem; height: 2.25rem; margin-top: -1.125rem; right: .4375rem; } }
.en-case { margin: 0; }
.en-case + .en-case, .en-cases-h + .en-case { margin-top: 1.5rem; }
.en-case-cap { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 1.25rem; margin: 0 0 .75rem; font-size: var(--en-label); line-height: 1.45; font-weight: 400; color: var(--ss-text); }
.en-case-no { flex: none; font-weight: 700; color: var(--en-accent, var(--en-pink)); }
.en-case-fig { margin: 0; }
.en-case-fig .img-ph, .en-case-fig img { border-radius: var(--sp-r); }
@media (min-width: 768px) { .en-case + .en-case, .en-cases-h + .en-case { margin-top: 2.5rem; } .en-case-cap { margin-bottom: 1rem; } }
@media (min-width: 992px) { .en-case + .en-case { margin-top: 4.5rem; } .en-cases-h + .en-case { margin-top: 3.5rem; } .en-case-cap { column-gap: 1.25rem; margin-bottom: 1.125rem; } }

@media (max-width: 767.98px) { .en-eye .sp-info-grid > div:last-child, .en-nose .sp-info-grid > div:last-child { order: -1; } .sp-info-grid { display: flex; flex-direction: column; } }

.en-pair { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; margin: 0; padding: 0; }
.en-pair > * { margin: 0; min-width: 0; }
.en-pair .img-ph, .en-pair img { border-radius: var(--sp-r); }
@media (min-width: 768px) { .en-pair { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; } }
@media (min-width: 1400px) { .en-pair { gap: 2rem; } }
.en-tech + .en-tech { margin-top: 3.5rem; }
.en-tech .en-d { margin: 0; }
.en-tech-t { margin: .25rem 0 .75rem; font-size: var(--en-label); font-weight: 700; line-height: 1.5; color: var(--ss-ink); }
.en-head + .en-tech { margin-top: 1.5rem; }
@media (min-width: 768px) { .en-tech + .en-tech { margin-top: 4rem; } .en-head + .en-tech { margin-top: 2rem; } }
@media (min-width: 992px) { .en-tech + .en-tech { margin-top: 5rem; } .en-head + .en-tech { margin-top: 2.5rem; } .en-tech-t { margin-bottom: .75rem; } }
.en-card { display: flex; flex-direction: column; margin: 0; }
.en-card .img-ph, .en-card img { border-radius: var(--sp-r) var(--sp-r) 0 0; }
.en-card-cap { display: grid; place-items: center; min-height: 3.5rem; padding: .75rem 1rem; border-radius: 0 0 var(--sp-r) var(--sp-r); background: var(--ss-point-soft); text-align: center; font-size: 1rem; font-weight: 700; line-height: 1.5; color: var(--ss-ink); }
@media (min-width: 768px) { .en-card-cap { min-height: 4.5rem; font-size: 1.125rem; } }
@media (min-width: 992px) { .en-card-cap { min-height: 5.125rem; font-size: 1.25rem; } }
@media (min-width: 1400px) { .en-card-cap { font-size: 1.5rem; } }
.en-pill { display: block; width: fit-content; max-width: 100%; margin: 1.5rem auto 0; padding: .625rem 1.5rem; border-radius: 62.4375rem; background: var(--en-pink); text-align: center; font-size: var(--en-sub); font-weight: 600; line-height: 1.4; color: var(--ss-white); }
@media (min-width: 768px) { .en-pill { margin-top: 2rem; padding-inline: 2.5rem; } }
@media (min-width: 992px) { .en-pill { margin-top: 2.5rem; padding: .625rem 3.5rem; } }
.en-media { margin-block: 0; }
.en-media .img-ph, .en-media img { border-radius: var(--sp-r); }
.en-head > .en-t-c + .en-d-c { margin-top: 1rem; }

.en-eye .sp-banner-card .sp-banner-img, .en-nose .sp-banner-card .sp-banner-img { left: 0; width: 100%; transform: none; object-fit: cover; }

@media (min-width: 1400px) { .en-side-s { grid-template-columns: minmax(0, 1fr) 36.75rem; } }
.en-gray .en-t-c + .en-d { margin-top: 1rem; }
.en-gray .en-head > .en-d-c { margin-top: 1rem; }
.sp-steps-ages .sp-steps-t { font-weight: 700; margin-top: 1rem; }
.sp-steps-ages .sp-steps-d { font-weight: 500; color: var(--ss-text); }
@media (min-width: 992px) { .en-gray .sp-steps-ages { margin-top: 4rem; } .sp-steps-ages .sp-steps-d { font-size: 1.125rem; } }
@media (min-width: 1400px) { .sp-steps-ages .sp-steps-d { font-size: 1.25rem; } .en-gray .sp-steps-ages { column-gap: 1.875rem; } }
.en-case-card { margin: 0; }
.en-case-card .en-case-cap { margin-bottom: .75rem; }
.en-case-card-d { margin: .75rem 0 0; font-size: 1rem; font-weight: 400; line-height: 1.5; color: var(--ss-text); }
@media (min-width: 992px) { .en-case-card-d { margin-top: 1.25rem; font-size: 1.125rem; } }
@media (min-width: 1400px) { .en-case-card-d { font-size: 1.25rem; } }
.en-pair-case { margin-top: 1.5rem; }
@media (min-width: 992px) { .en-pair-case { margin-top: 2.5rem; } }
.en-cmp-b td { font-weight: 600; color: var(--ss-text); }
.en-cmp-b tbody th { font-weight: 600; color: var(--ss-text); }
.en-cmp-b thead th { font-weight: 600; }
.en-cmp-b th, .en-cmp-b td { border-color: var(--ss-line-strong); }
.en-cmp-b thead th { border-color: var(--ss-ink); }
.en-cmp-b .en-cmp-corner { border-top-color: transparent; border-left-color: transparent; }
.en-cmp-b .en-cmp-pic th { border-left-color: var(--ss-line-strong); }
.en-cmp.en-cmp-b .en-cmp-pic td { padding: 0; border-top-color: var(--ss-ink); border-color: transparent; }
@media (min-width: 992px) { .en-cmp-b { font-size: 1.125rem; } .en-cmp-b tbody th { font-size: 1.375rem; } .en-cmp-b thead th { font-size: 1.375rem; } .en-cmp-b .en-cmp-corner { width: 11.4375rem; } }
@media (min-width: 1400px) { .en-cmp-b { font-size: 1.25rem; } .en-cmp-b tbody th { font-size: 1.5rem; } .en-cmp-b thead th { font-size: 1.5rem; } }
.en-step { margin: 0; }
.en-step + .en-step { margin-top: 3.5rem; }
.en-step-no { margin: 0; font-size: var(--sp-h3); font-weight: 700; line-height: 1.4; color: var(--en-accent, var(--en-pink)); }
.en-step-d { margin: .5rem 0 0; font-size: var(--en-sub); font-weight: 500; line-height: 1.53; letter-spacing: -.012em; color: var(--ss-text); }
.en-step-fig { margin: 1.25rem 0 0; }
.en-step-fig .img-ph, .en-step-fig img { border-radius: var(--sp-r); }
@media (min-width: 768px) { .en-step + .en-step { margin-top: 5rem; } .en-step-fig { margin-top: 1.75rem; } }
@media (min-width: 992px) { .en-step + .en-step { margin-top: 6.5rem; } .en-step-fig { margin-top: 2rem; } .en-step-d { margin-top: .75rem; } }

.en-gray .en-head + .sp-steps, .en-gray .en-head + .en-cmp-wrap { margin-top: 2rem; }
.en-cmp-b .en-cmp-corner { width: 5.25rem; }
@media (min-width: 992px) { .en-cmp-b .en-cmp-corner { width: 11.4375rem; } }
@media (min-width: 768px) { .en-gray .en-head + .sp-steps, .en-gray .en-head + .en-cmp-wrap { margin-top: 3rem; } }
@media (min-width: 992px) { .en-gray .en-head + .sp-steps, .en-gray .en-head + .en-cmp-wrap { margin-top: 4.5rem; } }

.en-types-tabs { max-width: var(--en-narrow); margin-inline: auto; margin-top: 1.25rem; }
@media (min-width: 768px) { .en-types-tabs { margin-top: 1.5rem; } }
.en-tab { display: grid; place-items: center; width: 100%; min-height: 3rem; padding: .5rem 1rem; border: 1px solid var(--ss-ink); border-radius: 0; background: var(--ss-white); color: var(--ss-ink); font: 500 1rem/1.3 var(--ss-font); cursor: pointer; transition: background-color .2s, color .2s; }
.en-tab:hover { background: var(--ss-bg-soft); }
.en-tab.is-active, .en-tab.is-active:hover { background: var(--ss-ink); color: var(--ss-white); }
@media (max-width: 767.98px) { :root .en-types-tabs .en-tab { width: auto; min-width: 6.5rem; } }
@media (min-width: 768px) {
  .en-types-tabs .ss-mtab-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; }
  .en-types-tabs .ss-mtab-list > li + li .en-tab { margin-left: -1px; }
  .en-tab { min-height: 4rem; font-size: 1.125rem; }
}
@media (min-width: 992px) { .en-tab { min-height: 5rem; font-size: 1.25rem; } }
@media (min-width: 1400px) { .en-tab { font-size: 1.375rem; } }
.en-types-panels { margin-top: 1.5rem; }
.en-types-panel { padding: 1.5rem 1rem 2rem; border: 1px solid var(--ss-ink); background: var(--ss-white); }
.en-types-panel[hidden] { display: none; }
.en-types-t { margin: 0; text-align: center; font-size: var(--en-label); font-weight: 700; line-height: 1.5; color: var(--ss-ink); }
.en-types-d { margin: .5rem 0 0; text-align: center; font-size: var(--en-sub-sm); font-weight: 500; line-height: 1.5; letter-spacing: -.012em; color: var(--ss-text); }
.en-types-row { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.5rem; align-items: center; margin-top: 1.5rem; }
.en-types-pic { margin: 0; }
.en-types-pic .img-ph, .en-types-pic img { border-radius: var(--sp-r); }
.en-types-list-h { margin: 0 0 1rem; font-size: var(--en-sub-sm); font-weight: 600; line-height: 1.5; color: var(--ss-ink); }
.en-types-list { margin: 0; padding: 0; list-style: none; }
.en-types-list li { display: grid; grid-template-columns: 1.5rem minmax(0, 1fr); column-gap: .75rem; align-items: start; font-size: var(--en-cap); font-weight: 400; line-height: 1.5; color: var(--ss-ink); }
.en-types-list li + li { margin-top: .5rem; }
.en-types-list .ss-ico { width: 1.5rem; height: 1.5rem; margin-top: .0625rem; }
.en-types-t2 { margin: 3rem 0 0; text-align: center; font-size: var(--en-label); font-weight: 700; line-height: 1.5; color: var(--ss-ink); }
.en-types-steps { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.5rem; max-width: 22rem; margin: 1.5rem auto 0; padding: 0; list-style: none; }
.en-types-step { text-align: center; }
.en-types-step .img-ph, .en-types-step img { border-radius: var(--sp-r); }
.en-types-no { display: inline-block; margin: 1rem 0 0; padding: .25rem 1.25rem; border-radius: 62.4375rem; background: #c8e0ff; font-size: 1rem; font-weight: 600; line-height: 1.5; color: var(--ss-ink); }
.en-types-sd { margin: .75rem 0 0; font-size: 1rem; font-weight: 400; line-height: 1.5; color: var(--ss-text); }
@media (min-width: 768px) {
  .en-types-panels { margin-top: 2rem; }
  .en-types-panel { padding: 2.5rem 2rem 2.5rem; }
  .en-types-row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem; margin-top: 2.5rem; }
  .en-types-t2 { margin-top: 4rem; }
  .en-types-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; max-width: none; margin-top: 2rem; }
  .en-types-steps-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .en-types-no { margin-top: 1.25rem; }
  .en-types-sd { margin-top: .75rem; }
}
@media (min-width: 992px) {
  .en-types-panel { padding: 3rem 3rem 3.5rem; }
  .en-types-row { grid-template-columns: 46.6923fr 53.3077fr; gap: 3rem; }
  .en-types-steps-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .en-types-t2 { margin-top: 5rem; }
}
@media (min-width: 1400px) {
  .en-types-panel { padding: 3.75rem 3.125rem 3.4375rem; }
  .en-types-row { grid-template-columns: 37.9375rem minmax(0, 1fr); gap: 6.25rem; margin-top: 2.25rem; }
  .en-types-t2 { margin-top: 7.4375rem; }
  .en-types-steps { gap: 1.375rem; margin-top: 3.125rem; }
  .en-types-no { padding-inline: 1.5rem; font-size: 1.25rem; }
  .en-types-sd { font-size: 1.25rem; }
}

.en-slider { overflow: hidden; --en-card: 17.5rem; }
.en-slider .swiper-wrapper { margin: 0; padding: 0; list-style: none; }
.en-slider .swiper-slide { width: var(--en-card); height: auto; }
.en-slider-wide { --en-card: 19.5rem; }
@media (min-width: 768px) { .en-slider { --en-card: 22.5rem; } .en-slider-wide { --en-card: 24rem; } }
@media (min-width: 1400px) { .en-slider { --en-card: 26.25rem; } .en-slider-wide { --en-card: 30.625rem; } }
.en-slider-card { display: flex; flex-direction: column; margin: 0; }
.en-slider-card .img-ph, .en-slider-card img { border-radius: var(--sp-r) var(--sp-r) 0 0; }
.en-slider-cap { flex: 1 1 auto; display: grid; align-content: start; justify-items: center; gap: .25rem; padding: 1rem 1rem 1.25rem; border-radius: 0 0 var(--sp-r) var(--sp-r); background: var(--en-soft, #d8f2ff); text-align: center; }
.en-slider-t { margin: 0; font-size: 1.125rem; font-weight: 700; line-height: 1.5; color: var(--ss-ink); }
.en-slider-d { margin: 0; font-size: .9375rem; font-weight: 500; line-height: 1.5; color: var(--ss-text); }
@media (min-width: 768px) { .en-slider-t { font-size: 1.25rem; } .en-slider-d { font-size: 1rem; } }
@media (min-width: 992px) { .en-slider-cap { padding: 1.125rem 1.5rem 1.5rem; } .en-slider-t { font-size: 1.375rem; } .en-slider-d { font-size: 1.125rem; } }
@media (min-width: 1400px) { .en-slider-t { font-size: 1.5rem; } .en-slider-d { font-size: 1.25rem; } }
.en-soft-pink { --en-soft: #ffecf3; }

.en-pair-case4 { margin-top: 1.5rem; row-gap: 2rem; }
.en-pair-case4 .en-case-card .en-case-cap { margin: 0 0 .75rem; }
@media (min-width: 576px) { .en-pair-case4 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem 1rem; } }
@media (min-width: 992px) { .en-pair-case4 { margin-top: 3.5rem; gap: 4.5rem 1.5rem; } }
.en-d-strong { font-weight: 600; margin-top: 1.5rem; }
@media (min-width: 992px) { .en-d-strong { margin-top: 2.5rem; } }
.en-case-fig .img-ph, .en-case-fig img { border-radius: var(--sp-r); }

.en-head + .en-slider { margin-top: 2rem; }
@media (min-width: 768px) { .en-head + .en-slider { margin-top: 3rem; } }
@media (min-width: 992px) { .en-head + .en-slider { margin-top: 4rem; } }
.en-slider-cap-t { align-content: center; min-height: 3.5rem; padding-block: .75rem; }
@media (min-width: 768px) { .en-slider-cap-t { min-height: 4.5rem; } }
@media (min-width: 992px) { .en-slider-cap-t { min-height: 5.125rem; } }
.en-ba { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0; overflow: hidden; border-radius: var(--sp-r); }
.en-ba-cell { margin: 0; }
.en-ba-cell .img-ph, .en-ba-cell img { border-radius: 0; }
.en-ba-lab { display: grid; place-items: center; min-height: 3.5rem; margin: 0; font-size: var(--en-label); font-weight: 700; line-height: 1.4; color: var(--ss-ink); background: var(--ss-point-soft); }
.en-ba-cell:first-child .en-ba-lab { background: var(--ss-line-strong); }
@media (min-width: 768px) { .en-ba-lab { min-height: 4.5rem; } }
@media (min-width: 992px) { .en-ba-lab { min-height: 5.125rem; } }
.en-ba + .en-d { margin-top: 1.5rem; }
@media (min-width: 992px) { .en-ba + .en-d { margin-top: 2.5rem; } }
.en-d-lead { font-weight: 400; }
.en-pair-captioned { margin-top: 1.5rem; }
.en-pair-cap { margin: .75rem 0 0; font-size: var(--en-sub); font-weight: 400; line-height: 1.33; letter-spacing: -.012em; color: var(--ss-text); }
@media (min-width: 992px) { .en-pair-captioned { margin-top: 3rem; } .en-pair-cap { margin-top: 1.25rem; } }
.en-head + .en-pair-captioned { margin-top: 2rem; }
@media (min-width: 768px) { .en-head + .en-pair-captioned { margin-top: 3rem; } }
@media (min-width: 992px) { .en-head + .en-pair-captioned { margin-top: 5.5rem; } }

.en-head + .en-head-gap { margin-top: 2rem; }
@media (min-width: 768px) { .en-head + .en-head-gap { margin-top: 3rem; } }
@media (min-width: 992px) { .en-head + .en-head-gap { margin-top: 5.5rem; } }
.en-cp-pill { display: inline-flex; align-items: center; gap: .5rem; margin: 0 0 1rem; padding: .5rem 1.25rem; border-radius: 62.4375rem; background: #ff7da9; font-size: 1.0625rem; font-weight: 600; line-height: 1.5; color: var(--ss-white); }
.en-cp-pill .ss-ico { width: 1.25rem; height: 1.25rem; }
@media (min-width: 768px) { .en-cp-pill { margin-bottom: 1.25rem; padding: .5rem 1.5rem; font-size: 1.25rem; } .en-cp-pill .ss-ico { width: 1.5rem; height: 1.5rem; } }
@media (min-width: 1400px) { .en-cp-pill { min-width: 18.3125rem; padding: .625rem 1.5rem; font-size: 1.625rem; } .en-cp-pill .ss-ico { width: 1.75rem; height: 1.75rem; } }
.en-cp .en-d { margin-top: 1rem; }
.en-cp .en-pair { margin-top: 1.5rem; }
@media (min-width: 992px) { .en-cp .en-d { margin-top: 1.25rem; } .en-cp .en-pair { margin-top: 3rem; } }
.en-gfx { position: relative; aspect-ratio: 634 / 318; border-radius: var(--sp-r) var(--sp-r) 0 0; background: var(--ss-bg-soft); overflow: hidden; }
.en-gfx img, .en-gfx .img-ph { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: contain; aspect-ratio: auto !important; border-radius: 0; }
.en-card-cap-2 { align-content: center; gap: .5rem; min-height: 5.5rem; padding-block: 1rem; }
.en-card-t { display: block; font-size: 1rem; font-weight: 700; line-height: 1.5; color: var(--ss-ink); }
.en-card-d { display: block; font-size: .875rem; font-weight: 400; line-height: 1.5; color: var(--ss-text); }
@media (min-width: 768px) { .en-card-t { font-size: 1.125rem; } .en-card-d { font-size: .9375rem; } }
@media (min-width: 992px) { .en-card-cap-2 { min-height: 9.25rem; } .en-card-t { font-size: 1.25rem; } .en-card-d { font-size: 1.0625rem; } }
@media (min-width: 1400px) { .en-card-t { font-size: 1.5rem; } .en-card-d { font-size: 1.25rem; } }
.en-nsteps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem 1rem; margin: 0; padding: 0; list-style: none; }
.en-nsteps img, .en-nsteps .img-ph { border: 1px solid var(--ss-line); border-radius: 0; }
.en-nsteps-no { margin: 1rem 0 0; font-size: 1.125rem; font-weight: 700; line-height: 1.5; color: var(--ss-ink); }
.en-nsteps-d { margin: .5rem 0 0; font-size: .9375rem; font-weight: 400; line-height: 1.5; color: var(--ss-ink); }
@media (min-width: 768px) { .en-nsteps { gap: 2rem 1.5rem; } .en-nsteps-no { font-size: 1.25rem; } .en-nsteps-d { font-size: 1rem; } }
@media (min-width: 992px) { .en-nsteps { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 1.25rem; } .en-nsteps-no { margin-top: 1.5rem; font-size: 1.375rem; } .en-nsteps-d { margin-top: 1rem; font-size: 1.125rem; } }
@media (min-width: 1400px) { .en-nsteps { column-gap: 1.25rem; } .en-nsteps-no { font-size: 1.5rem; } .en-nsteps-d { font-size: 1.25rem; } }

.en-head + .en-nsteps { margin-top: 2rem; }
@media (min-width: 768px) { .en-head + .en-nsteps { margin-top: 3rem; } }
@media (min-width: 992px) { .en-head + .en-nsteps { margin-top: 4rem; } }
img.en-ratio { object-fit: cover; }
.en-ratio-299x310 { aspect-ratio: 299 / 310; }
.en-ratio-300x310 { aspect-ratio: 300 / 310; }
.en-ratio-305x266 { aspect-ratio: 305 / 266; }
.en-ratio-307x250 { aspect-ratio: 307 / 250; }
.en-ratio-310x300 { aspect-ratio: 310 / 300; }
.en-ratio-311x300 { aspect-ratio: 311 / 300; }
.en-ratio-322x276 { aspect-ratio: 322 / 276; }
.en-ratio-384x310 { aspect-ratio: 384 / 310; }
.en-ratio-385x310 { aspect-ratio: 385 / 310; }
.en-ratio-420x250 { aspect-ratio: 420 / 250; }
.en-ratio-488x542 { aspect-ratio: 488 / 542; }
.en-ratio-490x250 { aspect-ratio: 490 / 250; }
.en-ratio-490x318 { aspect-ratio: 490 / 318; }
.en-ratio-500x510 { aspect-ratio: 500 / 510; }
.en-ratio-542x255 { aspect-ratio: 542 / 255; }
.en-ratio-560x250 { aspect-ratio: 560 / 250; }
.en-ratio-561x250 { aspect-ratio: 561 / 250; }
.en-ratio-588x400 { aspect-ratio: 588 / 400; }
.en-ratio-600x375 { aspect-ratio: 600 / 375; }
.en-ratio-607x500 { aspect-ratio: 607 / 500; }
.en-ratio-634x318 { aspect-ratio: 634 / 318; }
.en-ratio-634x400 { aspect-ratio: 634 / 400; }
.en-ratio-634x480 { aspect-ratio: 634 / 480; }
.en-ratio-635x550 { aspect-ratio: 635 / 550; }
.en-ratio-636x400 { aspect-ratio: 636 / 400; }
.en-ratio-1000x400 { aspect-ratio: 1000 / 400; }
.en-ratio-1000x542 { aspect-ratio: 1000 / 542; }
.en-ratio-1000x650 { aspect-ratio: 1000 / 650; }
.en-ratio-1300x390 { aspect-ratio: 1300 / 390; }
.en-ratio-1300x542 { aspect-ratio: 1300 / 542; }

.sp-kv.sp-kv-full .sp-kv-img-m { display: block; }
.sp-kv.sp-kv-full .sp-kv-img-pc { display: none; }
@media (min-width: 768px) { .sp-kv.sp-kv-full .sp-kv-img-m { display: none; } .sp-kv.sp-kv-full .sp-kv-img-pc { display: block; } }
/* 1018 수정(W-11): 눈·코 */
@media (min-width: 1400px) { .en-lead-d { font-size: 1.5rem; } .en-side .en-d { font-size: 1.5rem; } .en-cp-pill { min-width: 0; padding: .5rem 1.5rem; font-size: 1.3125rem; } .en-cp-pill .ss-ico { width: 1.5rem; height: 1.5rem; } }
@media (max-width: 767.98px) {
  .en-split-half { aspect-ratio: 628 / 392; background-size: 208.12% 100%; }
  .en-types-list-h { font-size: 1.125rem; }
  .en-types-list li { grid-template-columns: 1rem minmax(0, 1fr); }
  .en-types-list .ss-ico { width: 1rem; height: 1rem; margin-top: .25rem; }
  .en-d-lead { text-align: center; }
  .en-ba-lab { min-height: 2.5rem; }
  .en-tech-t { margin-bottom: 1rem; }
}
@media (min-width: 768px) { .en-ba-lab { min-height: 3rem; } }
@media (min-width: 992px) { .en-ba-lab { min-height: 4rem; } .en-tech-t { margin-bottom: 2.5rem; } }
.en-case-card .en-case-cap > span:last-child { font-weight: 700; }
.en-pair-case4 .en-case-card .en-case-cap > span:last-child { font-weight: 400; }
.en-cmp-b td { font-weight: 500; }
.en-cmp .en-cmp-pic td { border-style: hidden; }
.en-cmp thead th { border-left-style: hidden; border-right-style: hidden; }
.en-ratio-866x492 { aspect-ratio: 866 / 492; }

/* 검정 머리행 바로 아래 사진 사이 흰 선 제거: 머리행·사진 사이 경계를 hidden 이 아닌 검정 선으로 이어 붙임 */
.en-cmp .en-cmp-pic td { border-top-style: solid; border-top-color: var(--ss-ink); }
.en-cmp-pic img { display: block; }