/* 오시는 길·문의(contact.html) — 메인 ‘오시는 길’(금색 + 선 지도)을 한 화면 너비로 펼치고, 아래에 문의를 붙인다. */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.out{display:inline-block;width:10px;height:10px;margin-left:6px;vertical-align:1px;opacity:.7}
.btn .out{width:10px;height:10px;margin-left:0}

/* 1 금색 지도 + 찾아오는 방법 */
.ct-way{display:block}
.ct-way .map{position:relative;inset:auto;width:100%;height:clamp(440px,42vw,640px);-webkit-mask-image:none;mask-image:none}
.ct-way .map svg{width:100%;height:100%}
.ct-way .map .bus{display:inline}
.ct-way .map .bus rect{fill:var(--navy)}
.ct-way .map .bus text{fill:var(--navy);font-family:var(--serif);font-size:15px;font-weight:600;letter-spacing:-.03em}
.ct-way .map .office .on{font-size:24px}.ct-way .map .office .oa{font-size:16px}
.js .ct-way .map .bus{opacity:0;transition:opacity 1.4s ease .3s}.js .ct-way .map.in .bus{opacity:1}
.ct-way .w{position:relative}
.ct-mapbtn{position:absolute;right:0;top:-80px;display:flex;gap:10px}
.ct-mapbtn .btn.line{background:rgba(189,155,106,.92)}
.ct-way .ct-ways{display:grid;grid-template-columns:1.35fr 1fr 1fr 1fr;border-top:1px solid rgba(0,22,75,.45)}
.ct-way .ct-ways>div{padding:30px 28px 64px;border-left:1px solid rgba(0,22,75,.18)}
.ct-way .ct-ways>div:first-child{padding-left:0;border-left:0}
.ct-way .ct-ways dt{font:600 13.5px var(--sans);letter-spacing:-.01em;opacity:.7}
.ct-way .ct-ways dd b{display:block;margin-top:14px;font-size:20px;line-height:1.45;font-weight:700;letter-spacing:-.05em}
.ct-way .ct-ways dd span{display:block;margin-top:10px;font-size:15.5px;line-height:1.75;color:rgba(0,22,75,.82)}
.ct-copy{margin-top:16px;padding:0 0 2px;border:0;border-bottom:1px solid rgba(0,22,75,.4);background:none;font:600 14px var(--sans);letter-spacing:-.01em;color:var(--navy);cursor:pointer}
.ct-copy:hover{border-bottom-color:var(--navy)}

/* 2 문의 */
.ct-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(40px,6.4vw,100px);margin-top:clamp(52px,5.6vw,80px)}
.ct-reach{align-self:start;position:sticky;top:120px}
.ct-tel{display:block;font:700 clamp(44px,4.2vw,60px)/1 var(--lat);letter-spacing:.01em;color:var(--navy);transition:color .2s}
.ct-tel small{display:block;margin-bottom:14px;font:600 16px var(--serif);letter-spacing:-.03em;color:var(--gold-d)}
.ct-tel:hover{color:var(--gold-d)}
.ct-hours{margin-top:20px;font-size:16px;line-height:1.85;color:var(--body)}
.ct-reach dl{display:grid;grid-template-columns:64px 1fr;gap:14px 14px;margin-top:36px;padding-top:30px;border-top:1px solid var(--line);font-size:16.5px;line-height:1.6;color:var(--ink)}
.ct-reach dt{font:600 13.5px/1.9 var(--sans);letter-spacing:-.01em;color:var(--muted)}
.ct-reach dd a:hover{color:var(--gold-d)}
.ct-reach .sns{display:flex;flex-wrap:wrap;gap:4px 18px}
/* 양식: 아래 선만 있는 칸, 분야는 알약 단추 */
.ct-form{border-top:1px solid var(--navy);padding-top:34px}
.ct-topic{margin:0;padding:0;border:0}
.ct-topic legend,.ct-f label{display:block;padding:0;font:600 14px var(--sans);letter-spacing:-.01em;color:var(--ink)}
.ct-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.ct-chips label{position:relative;cursor:pointer}
.ct-chips input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.ct-chips span{display:inline-flex;align-items:center;height:40px;padding:0 18px;border-radius:20px;box-shadow:inset 0 0 0 1px rgba(0,22,75,.22);font:600 15.5px/1 var(--serif);letter-spacing:-.035em;color:var(--ink);transition:background .25s,color .25s,box-shadow .25s}
.ct-chips label:hover span{box-shadow:inset 0 0 0 1px var(--navy)}
.ct-chips input:checked+span{background:var(--navy);color:var(--ivory);box-shadow:none}
.ct-chips input:focus-visible+span{outline:2px solid var(--gold);outline-offset:3px}
.ct-row{display:grid;grid-template-columns:1fr 1fr;gap:0 40px}
.ct-f{margin-top:34px;position:relative}
.ct-f label em,.ct-ck label em{font-style:normal;font-weight:500;color:var(--muted);margin-left:8px;font-size:12.5px}
.ct-f input,.ct-f textarea{display:block;width:100%;margin-top:8px;padding:10px 0 12px;border:0;border-bottom:1px solid rgba(0,22,75,.28);border-radius:0;background:transparent;font:500 17.5px/1.6 var(--serif);letter-spacing:-.035em;color:var(--ink);transition:border-color .2s,box-shadow .2s;-webkit-appearance:none;appearance:none}
.ct-f textarea{resize:vertical;min-height:150px;line-height:1.8}
.ct-f input::placeholder,.ct-f textarea::placeholder{color:#A6A8AF}
.ct-f input:focus,.ct-f textarea:focus{outline:0;border-bottom-color:var(--navy);box-shadow:0 1px 0 var(--navy)}
.ct-cnt{position:absolute;right:0;top:0;font:400 12.5px var(--sans);color:var(--muted)}
.ct-cnt b{font-weight:600;color:var(--ink)}
.ct-err{min-height:0;font:600 13px/1.5 var(--sans);letter-spacing:-.01em;color:var(--gold-d)}
.ct-err:not(:empty){margin-top:8px}
.ct-err:not(:empty)::before{content:"";display:inline-block;width:12px;height:1px;margin-right:8px;vertical-align:4px;background:currentColor}
.ct-f [aria-invalid=true]{border-bottom-color:var(--gold-d);box-shadow:0 1px 0 var(--gold-d)}
.ct-topic[data-invalid] .ct-chips span{box-shadow:inset 0 0 0 1px var(--gold-d)}
.ct-agree{margin-top:40px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.ct-ck{display:flex;align-items:center;gap:12px;min-height:66px}
.ct-ck input{flex:none;width:22px;height:22px;margin:0;border:1.4px solid var(--navy);border-radius:3px;background:transparent;-webkit-appearance:none;appearance:none;cursor:pointer;display:grid;place-items:center;transition:background .2s}
.ct-ck input::after{content:"";width:6px;height:11px;border:solid var(--ivory);border-width:0 2px 2px 0;transform:translateY(-1px) rotate(45deg) scale(0);transition:transform .2s var(--ease)}
.ct-ck input:checked{background:var(--navy)}
.ct-ck input:checked::after{transform:translateY(-1px) rotate(45deg) scale(1)}
.ct-ck input[aria-invalid=true]{border-color:var(--gold-d);box-shadow:0 0 0 1px var(--gold-d)}
.ct-ck label{font-size:16.5px;font-weight:500;color:var(--ink);letter-spacing:-.04em;cursor:pointer}
.ct-more{margin-left:auto;display:inline-flex;align-items:center;gap:8px;border:0;background:none;padding:8px 0;font:600 14px var(--sans);letter-spacing:-.01em;color:var(--navy);cursor:pointer}
.ct-more svg{width:10px;height:6px;transition:transform .3s var(--ease)}
.ct-more[aria-expanded=true] svg{transform:rotate(180deg)}
.ct-priv{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s var(--ease)}
.ct-priv>div{overflow:hidden}
.ct-priv.open{grid-template-rows:1fr}
.ct-priv dl{margin:4px 0 0;padding:20px 22px;background:var(--ivory2);font:400 14px/1.75 var(--sans);letter-spacing:-.01em;color:var(--body)}
.ct-priv dl>div{display:grid;grid-template-columns:150px 1fr;gap:16px}
.ct-priv dl>div+div{margin-top:8px}
.ct-priv dt{font-weight:600;color:var(--ink)}
.ct-priv p{padding:14px 0 20px;font:400 13.5px/1.7 var(--sans);color:var(--muted);letter-spacing:-.01em}
.ct-agree>.ct-err:not(:empty){margin:0 0 16px}
.ct-send{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-top:34px}
.ct-sum{font:500 14px/1.6 var(--sans);letter-spacing:-.01em;color:var(--muted)}
.ct-sum.bad{color:var(--gold-d);font-weight:700}
.ct-send .btn{height:54px;padding:0 24px 0 30px;border-radius:27px;font-size:17px;border:0;cursor:pointer}
/* 보낸 뒤 */
.ct-done{border-top:1px solid var(--navy);padding-top:40px;outline:0}
.ct-done .k{font:600 14px var(--sans);letter-spacing:-.01em;color:var(--gold-d)}
.ct-done h3{margin-top:12px;font-size:clamp(26px,2.6vw,36px);line-height:1.35;font-weight:700;letter-spacing:-.06em;color:var(--navy)}
.ct-done .d{margin-top:16px;font-size:17px;line-height:1.85;color:var(--body);max-width:34em}
.ct-done .d b{font-weight:600;color:var(--ink)}
.ct-done dl{margin-top:30px;border-top:1px solid var(--line)}
.ct-done dl>div{display:grid;grid-template-columns:110px 1fr;gap:16px;padding:16px 0;border-bottom:1px solid var(--line)}
.ct-done dt{font:600 13.5px/1.9 var(--sans);color:var(--muted)}
.ct-done dd{font-size:17px;color:var(--ink);letter-spacing:-.04em}
.ct-done .btns{display:flex;gap:10px;flex-wrap:wrap;margin-top:34px}
.ct-done .btns button{border:0;cursor:pointer}
.js .ct-done.show>*{animation:ctup .6s ease backwards}
.js .ct-done.show>*:nth-child(2){animation-delay:.08s}.js .ct-done.show>*:nth-child(3){animation-delay:.16s}.js .ct-done.show>*:nth-child(4){animation-delay:.24s}.js .ct-done.show>*:nth-child(5){animation-delay:.32s}
@keyframes ctup{from{opacity:0;transform:translateY(10px)}}

@media (max-width:1240px){.ct-way .ct-ways{grid-template-columns:1fr 1fr}.ct-way .ct-ways>div:nth-child(3){padding-left:0;border-left:0}.ct-way .ct-ways>div:nth-child(n+3){border-top:1px solid rgba(0,22,75,.18)}.ct-way .ct-ways>div{padding-bottom:44px}}
@media (max-width:900px){
  .ct-way .map{order:0;height:auto;aspect-ratio:960/900;margin-top:0;border-top:0}
  .ct-way .map .bus text{font-size:24px}
  .ct-way .map .office .on{font-size:40px}.ct-way .map .office .oa{font-size:27px}
  .ct-way .w{order:1}
  .ct-mapbtn{position:static;margin-top:28px}.ct-mapbtn .btn{flex:1;justify-content:center;padding:0 12px}
  .ct-mapbtn .btn.line{background:transparent}
  .ct-way .ct-ways{grid-template-columns:1fr;margin-top:28px}
  .ct-way .ct-ways>div,.ct-way .ct-ways>div:nth-child(3){padding:22px 0 24px;border-left:0}
  .ct-way .ct-ways>div+div{border-top:1px solid rgba(0,22,75,.18)}
  .ct-way .ct-ways>div:last-child{padding-bottom:56px}
  .ct-way .ct-ways dd b{margin-top:8px;font-size:18px}
  .ct-way .ct-ways dd span{font-size:15px;margin-top:6px}
  .ct-grid{grid-template-columns:1fr;gap:52px;margin-top:40px}
  .ct-reach{position:static}
  .ct-tel{font-size:46px}
  .ct-reach dl{margin-top:28px;padding-top:24px;font-size:15.5px}
  .ct-form{padding-top:28px}
  .ct-chips span{height:38px;padding:0 15px;font-size:15px}
  .ct-row{grid-template-columns:1fr}
  .ct-f{margin-top:28px}
  .ct-f input,.ct-f textarea{font-size:16.5px}
  .ct-ck{flex-wrap:wrap;gap:10px 12px;padding:14px 0}
  .ct-ck label{font-size:15.5px;flex:1}
  .ct-more{margin-left:34px}
  .ct-priv dl{padding:16px}
  .ct-priv dl>div{grid-template-columns:1fr;gap:2px}
  .ct-priv dl>div+div{margin-top:12px}
  .ct-send{flex-direction:column-reverse;align-items:stretch;gap:16px}
  .ct-send .btn{justify-content:center}
  .ct-sum{text-align:center}
  .ct-done dl>div{grid-template-columns:84px 1fr}
  .ct-done .btns .btn{flex:1 1 100%;justify-content:center}
}
.ct-way .ct-ways{margin-top:0;gap:0;font-size:inherit;line-height:inherit}
.ct-way .ct-ways dd{margin:0}
@media (max-width:900px){.ct-way .ct-ways{margin-top:26px}}
.ct-done{scroll-margin-top:84px}@media (max-width:900px){.ct-done{scroll-margin-top:76px}}
.ct-done .d b{white-space:nowrap}
