@import url('https://fonts.googleapis.com/css2?family=Nanum+Myeongjo:wght@400;700&family=Noto+Sans+KR:wght@400;500;600;700&display=swap');

:root {
  --paper: #faf9f5;
  --forest: #233e32;
  --ink: #26382f;
  --muted: #56685b;
  --line: #d4d8cc;
  --sage: #e9ede2;
  --serif: 'Nanum Myeongjo', 'Batang', Georgia, serif;
  --sans: 'Noto Sans KR','Malgun Gothic',sans-serif;
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 15px/1.85 var(--sans); word-break: keep-all; overflow-wrap: break-word; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; cursor: pointer; }
a:focus-visible, button:focus-visible { outline: 3px solid #987234; outline-offset: 5px; }
h1,h2,h3,p,figure,dl,dd,ul { margin: 0; }
h1,h2 { font-family: var(--serif); letter-spacing: -.055em; font-weight: 700; line-height: 1.45; }
h2 { font-size: clamp(27px,2.55vw,40px); }
p { color: var(--muted); }
figure img { display: block; width: 100%; height: auto; }
figcaption { font-size: 12px; color: var(--muted); margin-top: 8px; }
.skip, .sr-only { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.skip:focus { z-index:50; background:white; color:var(--forest); padding:12px; width:auto; height:auto; clip-path:none; }
.wrap,.header-inner,.footer-inner { width:min(91%,1392px); margin-inline:auto; }
.site-header { border-bottom:1px solid var(--line); background:var(--paper); position:relative; z-index:10; }
.header-inner { display:flex; min-height:92px; align-items:center; justify-content:space-between; gap:22px; }
.brand { display:flex; gap:12px; align-items:center; flex-shrink:0; }
.brand img { width:46px; height:46px; border-radius:50%; }
.brand strong { display:block; font-size:22px; letter-spacing:-1.1px; line-height:1.3; }
.brand small,.footer-name small { display:block; font-size:9px; letter-spacing:.17em; line-height:1.8; }
#site-nav { display:flex; align-items:center; gap:clamp(13px,1.6vw,30px); }
#site-nav a { font-size:13px; white-space:nowrap; padding:7px 0; }
#site-nav a[aria-current],#site-nav a:hover,.subnav a[aria-current] { text-decoration:underline; text-underline-offset:7px; }
#site-nav .contact-nav { border:1px solid #7c8c7e; padding:8px 16px; border-radius:24px; }
.contact-nav span { margin-left:8px; }
.menu-button { display:none; }
.hero { display:grid; grid-template-columns:.84fr 1.16fr; align-items:center; gap:clamp(24px,4vw,75px); padding-block:44px; }
.hero-text { padding-left:clamp(0px,1.4vw,24px); }
.place { color:#435d47; font-size:12px; letter-spacing:.035em; display:flex; gap:10px; align-items:center; font-weight:600; }
.place i { width:7px; height:7px; background:#819362; border-radius:50%; }
.hero h1 { font-size:clamp(41px,4.05vw,69px); line-height:1.42; margin:23px 0 17px; }
.hero h1 em { color:#687c56; font-style:normal; }
.hero-desc { font-size:clamp(14px,1.05vw,17px); }
.hero .photo { overflow:hidden; border-radius:clamp(48px,6vw,104px) 4px 4px 4px; }
.hero .photo img { aspect-ratio:1.43; object-fit:cover; object-position:52% 50%; }
.actions { display:flex; flex-wrap:wrap; align-items:center; gap:13px 18px; margin-top:25px; }
.button { display:inline-flex; justify-content:center; align-items:center; gap:19px; font-size:14px; font-weight:500; line-height:1.4; background:var(--forest); border:1px solid var(--forest); color:white; padding:14px 23px; border-radius:30px; }
.button:hover { background:#375543; }
.button.secondary { background:transparent; border-color:#9da898; color:var(--forest); }
.button.secondary:hover { background:var(--sage); }
.textlink { background:transparent; border:0; border-bottom:1px solid #9fad9e; display:inline-flex; align-items:center; gap:9px; padding:4px 0; color:var(--forest); font-size:14px; font-weight:500; }
.textlink:hover { border-color:var(--forest); }
.schedule-strip { background:var(--forest); color:#fff; }
.strip-inner { min-height:83px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.strip-inner>div { display:flex; align-items:center; gap:19px; }
.strip-inner b { font-size:14px; font-weight:500; }
.strip-inner span { font-size:13px; color:#d5dfd1; }
.strip-inner a { font-size:13px; display:flex; align-items:center; gap:18px; }
.overview { padding-block:clamp(57px,6.5vw,100px); display:grid; grid-template-columns:.83fr 1.17fr; gap:clamp(30px,6vw,105px); }
.overview>div>p,.info-columns p,.feature-copy p,.profile-layout .lead-text { margin-top:18px; }
.overview .textlink,.info-columns .textlink { margin-top:18px; }
.rows { border-top:1px solid #5a705d; }
.rowlink { display:flex; align-items:center; gap:20px; justify-content:space-between; padding:21px 2px; border-bottom:1px solid var(--line); }
.rowlink strong { display:block; font-size:clamp(17px,1.45vw,23px); font-weight:500; letter-spacing:-.045em; }
.rowlink small { color:var(--muted); font-size:13px; display:block; margin-top:4px; }
.row-arrow { font-size:20px; padding:3px 8px; }
.rowlink:hover .row-arrow { color:#839466; }
.tint { background:var(--sage); }
.feature,.profile-layout,.contact-layout { display:grid; align-items:center; gap:clamp(26px,6vw,100px); grid-template-columns:1fr 1fr; padding-block:clamp(40px,5vw,80px); }
.feature .photo img { max-height:520px; object-fit:cover; border-radius:4px; }
.feature .arch-seated img,.feature .arch-stretch img { height:460px; object-fit:contain; background:#ece9df; }
.feature .guidance img,.feature .teaching img { height:470px; object-position:50% 32%; }
.feature-copy>.textlink,.feature-copy>.button { margin-top:23px; }
.feature-copy { max-width:550px; }
.consult { display:flex; align-items:center; justify-content:space-between; gap:30px; border:1px solid var(--line); background:var(--sage); padding:clamp(25px,3.5vw,55px); margin-bottom:70px; }
.consult h2 { font-size:clamp(23px,2.2vw,34px); }
.consult p { margin-top:8px; font-size:14px; }
.consult .button { flex-shrink:0; }
.footer { background:var(--forest); color:#f7f7ef; }
.footer-inner { display:grid; grid-template-columns:1fr 1.3fr 1fr; gap:30px; align-items:center; padding-block:38px; }
.footer-name { font-family:var(--serif); font-size:23px; }
.footer-name small { font-family:var(--sans); margin-top:3px; }
.footer p,.footer a,.foot-sep { color:#e4eae0; font-size:12px; }
.footer-links { display:flex; gap:6px 16px; justify-content:flex-end; flex-wrap:wrap; }
.footer a:hover { text-decoration:underline; }
.intro { padding-block:29px 33px; border-bottom:1px solid var(--line); }
.crumb { display:flex; align-items:center; flex-wrap:wrap; gap:9px; color:var(--muted); font-size:11px; }
.crumb a:hover { text-decoration:underline; }
.intro h1 { font-size:clamp(34px,3.35vw,55px); margin-top:26px; }
.intro p { margin-top:10px; }
.pair-photos { display:grid; grid-template-columns:1fr 1fr; gap:20px; padding-block:25px 35px; }
.pair-photos img { aspect-ratio:4/4.8; object-fit:contain; background:#edeae2; border-radius:3px; max-height:570px; }
.subnav { display:flex; gap:28px; flex-wrap:wrap; border-bottom:1px solid var(--line); padding:16px 0; font-size:14px; }
.subnav a[aria-current] { font-weight:600; }
.profile-layout,.contact-layout { grid-template-columns:1.06fr .94fr; }
.profile-layout h2 { margin:13px 0 18px; font-size:44px; }
.profile-layout img { max-height:620px; object-fit:cover; object-position:50% 32%; }
.facts { border-top:1px solid var(--line); font-size:14px; margin-top:26px; }
.facts>div { display:grid; grid-template-columns:90px 1fr; gap:15px; padding:12px 0; border-bottom:1px solid var(--line); }
.facts dt { color:var(--muted); }
.info-columns { display:grid; grid-template-columns:1fr 1fr; gap:7%; padding-block:35px 80px; }
.info-columns h2 { font-size:27px; }
.info-columns .facts { margin-top:12px; }
.schedule-heading { display:flex; justify-content:space-between; gap:20px; align-items:center; flex-wrap:wrap; padding:38px 0 23px; }
.schedule-heading h2 {font-size:29px;}
.day-picker { display:flex; flex-wrap:wrap; gap:5px; }
.day-switch { background:none; border:1px solid var(--line); border-radius:22px; min-width:40px; padding:7px 10px; font-size:13px; }
.day-switch.active { background:var(--forest); color:#fff; border-color:var(--forest); }
.day-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,238px),1fr)); gap:16px; align-items:start; }
.day-panel { border:1px solid var(--line); background:#fffefa; }
.day-panel h3 { font-size:17px; padding:12px 16px; color:var(--forest); background:var(--sage); }
.day-panel ul { padding:0 16px; list-style:none; }
.day-panel li { display:flex; justify-content:space-between; gap:12px; align-items:center; padding:11px 0; font-size:13px; }
.day-panel li+li { border-top:1px solid var(--line); }
.day-panel time { font-variant-numeric:tabular-nums; white-space:nowrap; }
.day-panel a:hover { text-decoration:underline; }
.schedule-note { display:flex; flex-wrap:wrap; align-items:center; gap:10px 20px; border-block:1px solid var(--line); padding:18px 0; margin:28px 0 10px; }
.schedule-note p,.note { font-size:13px; }
.note { margin:10px 0 40px; }
.note .textlink { font-size:13px; }
.reading { max-width:760px; min-height:350px; padding:45px 0 80px; }
.reading p+p { margin-top:18px; }
.director-reading { max-width:760px; margin:0 auto; padding:clamp(32px,5vw,75px) 0; }
.director-reading h2 { font-size:clamp(22px,2vw,29px); margin:32px 0 12px; }
.director-reading h2:first-child { margin-top:0; }
.director-reading .lead-text { color:var(--ink); font-size:clamp(16px,1.4vw,20px); }
.director-reading .facts { margin-top:12px; }
.career-list { padding-left:1.3em; color:var(--muted); }
.source-note { margin-top:32px; padding-top:15px; border-top:1px solid var(--line); font-size:12px; }
.teacher-roster { padding-block:clamp(30px,4vw,62px); border-bottom:1px solid var(--line); }
.teacher-roster h2 { margin-bottom:24px; font-size:clamp(23px,2.1vw,32px); }
.teacher-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px 22px; }
.teacher-card { min-width:0; border:1px solid var(--line); border-radius:5px; overflow:hidden; background:#fffefb; }
.teacher-portrait { aspect-ratio:5 / 6; background:#e9ede4; }
.teacher-portrait img { display:block; width:100%; height:100%; object-fit:cover; }
.teacher-photo-placeholder { height:100%; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:12px; color:#5a6f5d; font-size:13px; }
.teacher-details { padding:17px 21px 21px; }
.teacher-details h3 { font:700 21px/1.4 var(--serif); }
.teacher-details p { margin-top:8px; font-size:13px; }
.teacher-details b { font-weight:600; }
@media(max-width:900px) {
  .teacher-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
}
@media(max-width:540px) {
  .teacher-grid { grid-template-columns:1fr; }
}
.contact-layout .address { margin-top:15px; font-size:18px; }
.contact-layout .actions { margin-top:12px; }
.contact-layout img { min-height:310px; object-fit:cover; border-radius:4px; }
#copy-status { display:block; font-size:12px; color:var(--muted); }
[hidden] { display:none!important; }

@media(max-width:1070px) {
  .header-inner { min-height:78px; }
  .menu-button { display:flex; align-items:center; gap:10px; background:none; border:1px solid var(--line); border-radius:24px; padding:8px 14px; font-size:13px; }
  #site-nav { display:none; position:absolute; inset:100% 0 auto; padding:12px 4.5% 22px; background:var(--paper); box-shadow:0 12px 18px #1f35201a; }
  #site-nav.open { display:grid; grid-template-columns:1fr 1fr; gap:4px 20px; }
  #site-nav a { border-bottom:1px solid var(--line); padding:10px 3px; }
  #site-nav .contact-nav { justify-self:start; border:1px solid var(--line); margin-top:5px; }
  .hero h1 { font-size:clamp(36px,4.25vw,46px); }
  .strip-inner>div { flex-direction:column; align-items:start; gap:0; }
}
@media(max-width:720px) {
  .wrap,.header-inner,.footer-inner { width:89%; }
  .header-inner { min-height:72px; }
  .brand img { width:39px; height:39px; }
  .brand strong { font-size:19px; }
  .brand small { font-size:8px; }
  .hero { grid-template-columns:1fr; gap:27px; padding:36px 0 24px; }
  .hero-text { padding:0; }
  .hero h1 { font-size:clamp(35px,7.8vw,46px); margin:15px 0 12px; }
  .hero .photo { border-top-left-radius:47px; }
  .hero .photo img { aspect-ratio:1.5; }
  .hero .actions { margin-top:19px; }
  .desktop { display:none; }
  .button { padding:12px 18px; font-size:13px; }
  .strip-inner { display:grid; grid-template-columns:1fr 1fr; gap:9px; padding:18px 0; }
  .strip-inner a { grid-column:1/-1; }
  .strip-inner span { font-size:12px; }
  .overview,.feature,.info-columns,.profile-layout,.contact-layout { grid-template-columns:1fr; gap:22px; }
  .overview { padding-block:45px; }
  .rowlink { padding:16px 0; }
  .feature { padding-block:32px; }
  .feature .arch-seated img,.feature .arch-stretch img { height:auto; max-height:440px; }
  .feature .teaching img,.feature .guidance img { height:340px; }
  .consult { display:grid; margin-bottom:38px; gap:17px; }
  .consult .button { justify-self:start; }
  .footer-inner { grid-template-columns:1fr; gap:15px; padding-block:27px; }
  .footer-links { justify-content:flex-start; }
  .intro { padding-block:18px 23px; }
  .intro h1 { margin-top:18px; font-size:34px; }
  .intro p { font-size:14px; }
  .subnav { gap:18px; font-size:13px; }
  .profile-layout .photo { max-width:430px; }
  .profile-layout img { max-height:470px; }
  .facts>div { grid-template-columns:70px 1fr; font-size:13px; }
  .pair-photos { gap:12px; padding-block:10px 20px; }
  figcaption { font-size:11px; }
  .info-columns { gap:32px; padding:20px 0 40px; }
  .schedule-heading { align-items:flex-start; }
  .day-switch { min-width:33px; padding:7px 9px; }
  .contact-layout img {min-height:0;}
}
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; } }

