*{box-sizing:border-box}
:root{color-scheme:light;--ink:#142b51;--muted:#596b86;--line:#dde5f5}
body{margin:0;min-height:100vh;padding:32px 22px;font-family:"Pretendard","Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif;color:var(--ink);background:radial-gradient(ellipse at 5% 10%,#e9e4ff 0,transparent 45%),radial-gradient(ellipse at 100% 80%,#dff7f6 0,transparent 45%),#f6f8ff}
.hero{width:100%;max-width:1040px;margin:auto;padding:38px 22px 28px;padding:38px clamp(22px,5vw,64px) 28px;border:1px solid #fff;border-radius:30px;background:#fff;box-shadow:0 20px 70px #34457510}
.brand-intro{text-align:center}
/* Show the supplied logo directly; keep the original reference image intact. */
.brand-art{position:relative;overflow:hidden;width:100%;max-width:420px;margin:0 auto 12px}
.brand-art:before{content:"";display:block;padding-top:58.82353%}
.brand-art img{position:absolute;display:block;width:147.53%;height:auto;max-width:none;left:-25.88%;top:-17%}
.tagline{margin:8px 0 18px;font-size:15px;letter-spacing:.17em;color:var(--muted)}
.brand-message{margin:0;font-size:28px;font-size:clamp(23px,3.5vw,32px);font-weight:650;line-height:1.5;letter-spacing:-.05em}
.brand-message strong{color:#5266c6}
.description{margin:12px 0 0;font-size:14px;line-height:1.9;color:var(--muted)}
.mobile-break{display:none}
.branch-section{margin:30px 0;padding:24px;background:linear-gradient(115deg,#f4f1ff,#f0fafa);border:1px solid var(--line);border-radius:22px}
.section-heading{text-align:center;margin-bottom:18px}.section-heading h2{font-size:19px;margin:0 0 6px;letter-spacing:-.04em}.section-heading p{font-size:13px;color:var(--muted);margin:0}
.list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:row;gap:12px}
.branch{position:relative;display:flex;align-items:center;justify-content:center;min-height:86px;padding:14px 24px;text-decoration:none;color:var(--ink);font-size:24px;font-weight:800;letter-spacing:-.04em;text-align:center;overflow-wrap:anywhere;border:1px solid #d5deef;border-radius:15px;background:#fff;box-shadow:0 5px 14px #34457508;transition:transform .18s,border-color .18s,box-shadow .18s}
.branch:after{content:'›';position:absolute;right:12px;color:#6478c5;font-size:23px;font-weight:400}.branch img{display:block;max-width:88%;width:auto;height:54px;object-fit:contain}
.branch:hover{transform:translateY(-2px);border-color:#8b93e1;box-shadow:0 7px 18px #535bb91a}.branch:focus-visible{outline:3px solid #5365c7;outline-offset:3px}
.empty{grid-column:1/-1;text-align:center;padding:20px;color:var(--muted)}
.values{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));margin-top:32px}.values article{text-align:center;padding:0 8px}.values article+article{border-left:1px solid var(--line)}
.value-icon{display:block;height:48px;font-size:39px;line-height:1;color:#7272d8}.values article:nth-child(3n) .value-icon{color:#3ca7ae}.values h2{margin:12px 0 8px;font-size:15px;letter-spacing:-.04em}.values p{margin:0;font-size:12px;line-height:1.9;color:var(--muted)}
footer{text-align:center;margin-top:30px;padding-top:20px;border-top:1px solid #eef0f8;color:#63749a}footer span{font-family:Georgia,serif;font-style:italic;font-size:24px;color:#6872bd}footer p{font-size:11px;letter-spacing:.13em;margin:8px 0 0}
@media(max-width:620px){body{padding:12px}.hero{padding:26px 16px 22px;border-radius:23px}.brand-art{width:300px;max-width:100%}.tagline{font-size:12px;letter-spacing:.08em}.description{font-size:12px}.branch-section{margin:24px 0;padding:18px 12px}.section-heading h2{font-size:17px}.list{gap:9px}.branch{min-height:76px;font-size:19px;padding:12px 19px 12px 10px}.branch img{height:46px}.values{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 0}.values article+article{border-left:0}.values article:nth-child(even){border-left:1px solid var(--line)}.values article:last-child{grid-column:1/-1}.mobile-break{display:block}}
@media(prefers-reduced-motion:reduce){.branch{transition:none}}

svg.value-icon{width:42px;height:42px;margin:0 auto}

/* 구형 브라우저에서도 지점 선택과 로고의 공간을 확보합니다. */
@supports not (display:grid){.list,.values{display:flex;flex-wrap:wrap}.branch{width:48%;margin:1%}.values article{width:20%}.brand-message{font-weight:700}@media(max-width:620px){.values article{width:50%;margin-bottom:24px}.values article:last-child{width:100%}}}