:root {
--ink: #111111;
--muted: #66635f;
--line: #d9d5cf;
--soft: #f6f3ee;
--paper: #ffffff;
--gold: #debc68;
--navy: #081b33;
--max: 1220px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: "Noto Sans KR", Arial, sans-serif; line-height: 1.75; word-break: keep-all; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button, input, textarea { font: inherit; }
.container { width: min(calc(100% - 48px), var(--max)); margin-inline: auto; }
.skip-link { position: fixed; left: 12px; top: -80px; z-index: 1000; padding: 10px 14px; background: #fff; border: 1px solid #111; }
.skip-link:focus { top: 12px; }
.site-header { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,.96); border-bottom: 1px solid var(--line); backdrop-filter: blur(12px); }
.header-inner { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand img { width: 235px; height: auto; }
.primary-nav { display: flex; align-items: center; gap: 38px; font-weight: 600; font-size: 15px; }
.primary-nav a { position: relative; padding: 28px 0; }
.primary-nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: 20px; height: 1px; background: var(--ink); transition: right .25s ease; }
.primary-nav a:hover::after, .primary-nav a:focus-visible::after { right: 0; }
.menu-toggle { display: none; background: transparent; border: 1px solid var(--ink); padding: 8px 13px; }
.hero { background: var(--soft); border-bottom: 1px solid var(--line); }
.hero-inner { min-height: 610px; padding: 112px 0 96px; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
.eyebrow { margin: 0 0 23px; color: var(--gold); font-family: Georgia, serif; font-size: 13px; font-weight: 700; letter-spacing: .22em; }
.eyebrow.light { color: #d5b477; }
h1, h2, h3 { margin-top: 0; }
h1, h2 { font-family: "Noto Serif KR", Georgia, serif; font-weight: 500; letter-spacing: -.055em; line-height: 1.28; }
h1 { max-width: 900px; margin-bottom: 30px; font-size: clamp(48px, 6vw, 82px); }
h2 { margin-bottom: 54px; font-size: clamp(38px, 4.8vw, 64px); }
.hero-copy { max-width: 650px; margin: 0 0 42px; color: var(--muted); font-size: 20px; }
.hero-actions { display: flex; gap: 14px; }
.button { min-width: 152px; padding: 16px 26px; border: 1px solid var(--ink); text-align: center; font-weight: 700; transition: background .2s, color .2s; }
.button-dark { background: var(--ink); color: #fff; }
.button-light { background: transparent; }
.button-dark:hover { background: #333; }
.button-light:hover { background: var(--ink); color: #fff; }
.section { padding: 128px 0; border-bottom: 1px solid var(--line); }
.soft-section { background: var(--soft); }
.about-grid { display: grid; grid-template-columns: .78fr 1.42fr; gap: 88px; align-items: start; }
.section-lead { margin: 0; max-width: 420px; font-family: "Noto Serif KR", Georgia, serif; font-size: 22px; line-height: 2.05; }
.pillars { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); }
.pillars article { min-height: 285px; padding: 42px 28px; border-right: 1px solid var(--line); }
.pillars article:last-child { border-right: 0; }
.pillars span, .contact-number { color: var(--gold); font-family: Georgia, serif; font-size: 13px; }
.pillars h3 { margin: 55px 0 16px; font-size: 24px; }
.pillars p { margin: 0; color: var(--muted); }
.split-section { display: grid; grid-template-columns: 1.05fr .95fr; gap: 100px; align-items: start; }
.body-copy { padding-top: 62px; color: var(--muted); font-size: 19px; }
.body-copy p { margin: 0 0 24px; }
.section-heading-row { display: flex; justify-content: space-between; gap: 30px; align-items: end; margin-bottom: 45px; }
.section-heading-row h2 { margin-bottom: 0; }
.section-heading-row p { max-width: 430px; margin: 0; color: var(--muted); }
.book-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.book-card { min-height: 320px; padding: 42px 34px; border-right: 1px solid var(--line); }
.book-card:last-child { border-right: 0; }
.book-card > span { color: var(--gold); font-size: 13px; letter-spacing: .08em; }
.book-card h3 { margin: 70px 0 22px; font-family: "Noto Serif KR", Georgia, serif; font-size: 28px; line-height: 1.5; }
.book-card p { color: var(--muted); }
.featured-book { display: flex; flex-direction: column; }
.book-cover-wrap { margin: 26px 0 18px; }
.book-cover { display: block; width: 100%; max-width: 220px; height: auto; border: 1px solid var(--line); box-shadow: 0 12px 28px rgba(0,0,0,.08); }
.featured-book h3 { margin: 10px 0 18px; }
.dark-section { color: #fff; background: #151515; border-bottom-color: #303030; }
.light-copy { color: #c7c5c1; }
.contact-section { background: #fff; }
.contact-heading { display: grid; grid-template-columns: 1.05fr .95fr; gap: 100px; align-items: end; margin-bottom: 70px; }
.contact-heading h2 { margin-bottom: 0; }
.contact-intro { padding-bottom: 10px; color: var(--muted); font-size: 18px; }
.contact-intro p { margin: 0 0 12px; }
.contact-grid { display: grid; grid-template-columns: .9fr 1.1fr 1.15fr; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.contact-card { min-height: 360px; padding: 40px 32px; border-right: 1px solid var(--line); display: flex; flex-direction: column; align-items: flex-start; }
.contact-card:last-child { border-right: 0; }
.contact-card h3 { margin: 56px 0 16px; font-size: 23px; }
.contact-value { margin: 0 0 18px; font-family: "Noto Serif KR", Georgia, serif; font-style: normal; font-size: 24px; font-weight: 600; line-height: 1.55; }
.email-value { font-family: "Noto Sans KR", Arial, sans-serif; font-size: 19px; letter-spacing: -.025em; }
.contact-card p { margin: 0 0 26px; color: var(--muted); }
.text-link { margin-top: auto; border-bottom: 1px solid var(--ink); font-weight: 700; }
.contact-note { margin-top: 28px; padding: 22px 26px; background: var(--soft); }
.contact-note p { margin: 0; color: var(--muted); }
.contact-note strong { color: var(--ink); margin-right: 14px; }
.site-footer { background: #111; color: #fff; padding: 58px 0 26px; }
.footer-top { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding-bottom: 34px; border-bottom: 1px solid #343434; }
.footer-brand img { width: 225px; filter: invert(1) grayscale(1) brightness(2.2); mix-blend-mode: screen; }
.footer-top p { margin: 0; color: #aaa; }
.footer-info { display: grid; grid-template-columns: auto auto 1fr; gap: 22px 36px; padding: 30px 0; color: #c8c8c8; font-size: 14px; border-bottom: 1px solid #343434; }
.footer-info strong { margin-right: 8px; color: #fff; }
.footer-info a:hover { text-decoration: underline; }
.footer-bottom { display: flex; justify-content: space-between; align-items: center; padding-top: 24px; color: #8f8f8f; font-size: 13px; }
.footer-bottom p { margin: 0; }
@media (max-width: 980px) {
.primary-nav { gap: 22px; }
.about-grid, .split-section, .contact-heading { grid-template-columns: 1fr; gap: 45px; }
.body-copy { padding-top: 0; }
.pillars, .book-grid, .contact-grid { grid-template-columns: 1fr; }
.pillars article, .book-card, .contact-card { border-right: 0; border-bottom: 1px solid var(--line); }
.pillars article:last-child, .book-card:last-child, .contact-card:last-child { border-bottom: 0; }
.footer-info { grid-template-columns: 1fr; }
}
@media (max-width: 740px) {
.container { width: min(calc(100% - 32px), var(--max)); }
.header-inner { min-height: 70px; }
.brand img { width: 190px; }
.menu-toggle { display: block; }
.primary-nav { display: none; position: absolute; left: 0; right: 0; top: 70px; flex-direction: column; gap: 0; padding: 12px 24px 20px; background: #fff; border-bottom: 1px solid var(--line); align-items: stretch; }
.primary-nav.is-open { display: flex; }
.primary-nav a { padding: 13px 0; }
.primary-nav a::after { display: none; }
.hero-inner { min-height: 540px; padding: 86px 0 76px; }
h1 { font-size: 44px; }
h2 { margin-bottom: 38px; font-size: 38px; }
.hero-copy { font-size: 17px; }
.hero-actions { width: 100%; flex-direction: column; }
.button { width: 100%; }
.section { padding: 88px 0; }
.section-heading-row { display: block; }
.section-heading-row p { margin-top: 20px; }
.pillars article, .book-card, .contact-card { min-height: auto; padding: 34px 20px; }
.pillars h3, .book-card h3, .contact-card h3 { margin-top: 34px; }
.book-cover { max-width: 180px; }
.contact-value { font-size: 21px; }
.email-value { font-size: 16px; overflow-wrap: anywhere; }
.footer-top, .footer-bottom { align-items: flex-start; flex-direction: column; }
.footer-brand img { width: 205px; }
}
.postal-code {
display: inline-block;
margin-bottom: 0.2rem;
font-size: 0.82em;
font-style: normal;
letter-spacing: 0.04em;
color: var(--muted, #6f6a63);
}
/* Book cards, detail dialogs, and purchase links */
.book-card-clickable {
display: flex;
flex-direction: column;
cursor: pointer;
transition: background .2s ease, transform .2s ease, box-shadow .2s ease;
}
.book-card-clickable:hover,
.book-card-clickable:focus-visible {
background: #fbfaf7;
outline: none;
box-shadow: inset 0 0 0 1px rgba(163,122,53,.28);
}
.book-card-topline {
min-height: 24px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 14px;
}
.book-card-topline > span:first-child {
color: var(--gold);
font-size: 13px;
letter-spacing: .08em;
}
.book-badge {
padding: 3px 9px;
border: 1px solid var(--gold);
border-radius: 999px;
color: var(--gold);
font-family: Georgia, serif;
font-size: 10px;
font-weight: 700;
letter-spacing: .12em;
}
.book-card-clickable h3 { margin: 10px 0 18px; }
.book-card-clickable p { margin: 0 0 28px; }
.book-actions {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin-top: auto;
padding-top: 8px;
}
.book-detail-button,
.book-buy-link {
min-width: 112px;
padding: 11px 15px;
border: 1px solid var(--ink);
background: transparent;
color: var(--ink);
text-align: center;
font-size: 14px;
font-weight: 700;
line-height: 1.35;
cursor: pointer;
transition: background .2s ease, color .2s ease;
}
.book-detail-button:hover,
.book-buy-link:hover,
.book-detail-button:focus-visible,
.book-buy-link:focus-visible {
background: var(--ink);
color: #fff;
outline: none;
}
.book-dialog {
width: min(1040px, calc(100% - 40px));
max-height: calc(100vh - 40px);
padding: 0;
border: 0;
background: transparent;
overflow: visible;
}
.book-dialog::backdrop {
background: rgba(17,17,17,.72);
backdrop-filter: blur(4px);
}
.book-dialog-panel {
position: relative;
max-height: calc(100vh - 40px);
padding: 52px;
background: #fff;
overflow: auto;
box-shadow: 0 24px 80px rgba(0,0,0,.28);
}
.dialog-close {
position: absolute;
top: 16px;
right: 20px;
width: 42px;
height: 42px;
border: 0;
background: transparent;
color: var(--ink);
font-family: Arial, sans-serif;
font-size: 34px;
line-height: 1;
cursor: pointer;
}
.dialog-close:hover,
.dialog-close:focus-visible {
background: var(--soft);
outline: none;
}
.book-dialog-grid {
display: grid;
grid-template-columns: minmax(240px, 330px) 1fr;
gap: 58px;
align-items: start;
}
.book-dialog-grid figure { margin: 0; }
.book-dialog-grid figure img {
width: 100%;
max-height: 650px;
object-fit: contain;
border: 1px solid var(--line);
box-shadow: 0 14px 36px rgba(0,0,0,.12);
}
.book-dialog h2 {
margin-bottom: 20px;
font-size: clamp(34px, 4vw, 52px);
}
.book-dialog-lead {
margin: 0 0 20px;
font-family: "Noto Serif KR", Georgia, serif;
font-size: 22px;
line-height: 1.75;
}
.book-dialog p:not(.eyebrow):not(.book-dialog-lead) {
color: var(--muted);
font-size: 17px;
}
.book-meta {
margin: 32px 0;
border-top: 1px solid var(--line);
border-bottom: 1px solid var(--line);
}
.book-meta > div {
display: grid;
grid-template-columns: 92px 1fr;
gap: 18px;
padding: 13px 0;
border-bottom: 1px solid var(--line);
}
.book-meta > div:last-child { border-bottom: 0; }
.book-meta dt { color: var(--muted); }
.book-meta dd { margin: 0; font-weight: 700; }
.dialog-actions {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 14px 20px;
}
.availability-note {
max-width: 330px;
color: var(--muted);
font-size: 13px;
line-height: 1.6;
}
body.dialog-open { overflow: hidden; }
@media (max-width: 760px) {
.book-dialog { width: min(100% - 20px, 1040px); max-height: calc(100vh - 20px); }
.book-dialog-panel { max-height: calc(100vh - 20px); padding: 54px 22px 28px; }
.book-dialog-grid { grid-template-columns: 1fr; gap: 30px; }
.book-dialog-grid figure img { max-width: 230px; margin-inline: auto; }
.book-dialog h2 { font-size: 34px; }
.book-dialog-lead { font-size: 19px; }
.book-actions { flex-direction: column; }
.book-detail-button, .book-buy-link { width: 100%; }
}
/* Company intro submenu */
.nav-dropdown { position: relative; }
.nav-dropdown-toggle {
display: flex;
align-items: center;
gap: 6px;
padding: 28px 0;
border: 0;
background: transparent;
color: var(--ink);
font-weight: 600;
cursor: pointer;
}
.nav-dropdown-toggle span { font-size: 13px; transition: transform .2s ease; }
.nav-dropdown.is-open .nav-dropdown-toggle span { transform: rotate(180deg); }
.nav-submenu {
display: none;
position: absolute;
left: 50%;
top: calc(100% - 8px);
width: 150px;
padding: 10px 0;
background: #fff;
border: 1px solid var(--line);
box-shadow: 0 14px 34px rgba(0,0,0,.1);
transform: translateX(-50%);
}
.nav-dropdown:hover .nav-submenu,
.nav-dropdown:focus-within .nav-submenu,
.nav-dropdown.is-open .nav-submenu { display: block; }
.primary-nav .nav-submenu a {
display: block;
padding: 10px 18px;
font-size: 14px;
font-weight: 500;
white-space: nowrap;
}
.primary-nav .nav-submenu a::after { display: none; }
.primary-nav .nav-submenu a:hover,
.primary-nav .nav-submenu a:focus-visible { background: var(--soft); }
/* Founder introduction */
.founder-section { background: #fff; }
.founder-layout {
display: grid;
grid-template-columns: minmax(270px, .72fr) minmax(0, 1.48fr);
gap: 92px;
align-items: start;
}
.founder-identity {
position: sticky;
top: 118px;
padding: 42px 36px;
border: 1px solid var(--line);
background: var(--soft);
}
.founder-visuals {
display: grid;
grid-template-columns: 116px minmax(0, 1fr);
gap: 30px;
align-items: start;
margin-bottom: 34px;
}
.founder-mark {
width: 116px;
height: 116px;
margin: 18px 0 0;
display: grid;
place-items: center;
background: #fff;
border: 1px solid var(--line);
}
.founder-mark img { width: 78px; height: auto; }
.founder-photo {
margin: 0;
overflow: hidden;
background: #d8d2cb;
aspect-ratio: 0.9;
}
.founder-photo img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center top;
}
.founder-role {
margin: 0 0 12px;
color: var(--gold);
font-family: Georgia, serif;
font-size: 11px;
font-weight: 700;
letter-spacing: .13em;
}
.founder-identity h2 {
margin: 0 0 16px;
font-size: 46px;
}
.founder-name-en {
white-space: nowrap;
line-height: 1.1;
letter-spacing: 0;
}
.founder-name-ko {
margin: -6px 0 18px;
color: var(--ink);
font-family: "Noto Sans KR", "Malgun Gothic", sans-serif;
font-size: 20px;
font-weight: 600;
line-height: 1.35;
}
.founder-position {
margin: 0 0 28px;
color: var(--muted);
font-size: 17px;
line-height: 1.8;
}
.founder-email {
display: inline-block;
padding-bottom: 3px;
border-bottom: 1px solid var(--ink);
font-size: 14px;
font-weight: 700;
overflow-wrap: anywhere;
}
.founder-story { padding-top: 10px; }
.founder-story > h3 {
margin: 0 0 34px;
font-family: "Noto Serif KR", Georgia, serif;
font-size: clamp(34px, 4vw, 56px);
font-weight: 500;
letter-spacing: -.045em;
line-height: 1.38;
}
.founder-story > p {
max-width: 780px;
margin: 0 0 24px;
color: var(--muted);
font-family: "Noto Serif KR", Georgia, serif;
font-size: 19px;
line-height: 2;
}
.founder-story blockquote {
margin: 48px 0;
padding: 30px 34px;
border-left: 3px solid var(--gold);
background: var(--soft);
font-family: "Noto Serif KR", Georgia, serif;
font-size: 22px;
line-height: 1.85;
}
.founder-expertise {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin-bottom: 52px;
}
.founder-expertise span {
padding: 9px 15px;
border: 1px solid var(--line);
color: var(--muted);
font-size: 14px;
}
.founder-works { margin: 0 0 46px; }
.founder-works-label {
margin: 0 0 14px;
color: var(--gold);
font-family: Georgia, serif;
font-size: 12px;
font-weight: 700;
letter-spacing: .16em;
}
.founder-work-list { border-top: 1px solid var(--line); }
.founder-work-list a {
display: grid;
grid-template-columns: 1.35fr 1fr;
gap: 24px;
padding: 18px 0;
border-bottom: 1px solid var(--line);
transition: padding-left .2s ease, background .2s ease;
}
.founder-work-list a:hover,
.founder-work-list a:focus-visible {
padding-left: 12px;
background: #fbfaf7;
outline: none;
}
.founder-work-list strong { font-size: 16px; }
.founder-work-list span { color: var(--muted); font-size: 14px; }
.founder-actions { display: flex; gap: 14px; }
@media (max-width: 980px) {
.founder-layout { grid-template-columns: 1fr; gap: 48px; }
.founder-identity { position: static; }
}
@media (max-width: 740px) {
.nav-dropdown { width: 100%; }
.nav-dropdown-toggle {
width: 100%;
justify-content: space-between;
padding: 13px 0;
}
.nav-submenu {
position: static;
width: 100%;
padding: 0 0 6px 14px;
border: 0;
border-left: 1px solid var(--line);
box-shadow: none;
transform: none;
}
.nav-dropdown:hover .nav-submenu:not(.is-mobile-open),
.nav-dropdown:focus-within .nav-submenu:not(.is-mobile-open) { display: none; }
.nav-dropdown.is-open .nav-submenu { display: block; }
.primary-nav .nav-submenu a { padding: 9px 12px; }
.founder-identity { padding: 30px 24px; }
.founder-identity h2 { font-size: 40px; }
.founder-name-en { font-size: clamp(34px, 7vw, 40px); }
.founder-name-ko { font-size: 18px; }
.founder-story > h3 { font-size: 36px; }
.founder-story > p { font-size: 17px; }
.founder-story blockquote { margin: 36px 0; padding: 24px 22px; font-size: 19px; }
.founder-work-list a { grid-template-columns: 1fr; gap: 4px; }
.founder-actions { flex-direction: column; }
}
/* Expanded books catalog */
.book-grid {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.book-card {
min-height: auto;
}
.book-card h3 {
min-height: 4.2em;
}
.book-card p {
font-size: 15px;
line-height: 1.85;
}
.book-cover {
max-width: 230px;
}
@media (max-width: 1100px) {
.book-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
.book-grid { grid-template-columns: 1fr; }
.book-card h3 { min-height: 0; }
}
/* v11 expanded multilingual catalog */
.book-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.book-card h3 { min-height: 4.6em; font-size: 25px; }
.book-card p { font-size: 14px; line-height: 1.8; }
.book-cover { max-width: 205px; }
@media (max-width: 1280px) { .book-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 980px) { .book-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .book-grid { grid-template-columns: 1fr; } .book-card h3 { min-height: 0; } }
/* Founder portrait responsive refinement */
@media (max-width: 520px) {
.founder-visuals { grid-template-columns: 92px minmax(0, 1fr); gap: 18px; }
.founder-mark { width: 92px; height: 92px; margin-top: 14px; }
.founder-mark img { width: 62px; }
}
/* KR / EN language switch */
.language-switch {
display: flex;
align-items: center;
gap: 7px;
margin-left: 2px;
font-size: 12px;
font-weight: 600;
letter-spacing: .12em;
white-space: nowrap;
}
.primary-nav .language-switch a {
padding: 28px 0;
color: #9a9690;
}
.primary-nav .language-switch a::after {
display: none;
}
.primary-nav .language-switch a:hover,
.primary-nav .language-switch a:focus-visible {
color: var(--ink);
}
.primary-nav .language-switch .is-active {
color: var(--ink);
font-weight: 800;
}
.language-divider {
color: #c3beb6;
}
/* English page typography */
body.lang-en {
font-family: Arial, Helvetica, sans-serif;
line-height: 1.7;
word-break: normal;
}
body.lang-en h1,
body.lang-en h2,
body.lang-en .section-lead,
body.lang-en .contact-value,
body.lang-en .book-card h3,
body.lang-en .book-dialog-lead {
font-family: Georgia, "Times New Roman", serif;
letter-spacing: -.025em;
}
body.lang-en .book-card h3 {
line-height: 1.32;
}
body.lang-en .email-value {
font-family: Arial, Helvetica, sans-serif;
}
@media (max-width: 740px) {
.language-switch {
justify-content: flex-start;
margin: 6px 0 0;
padding: 13px 0 4px;
border-top: 1px solid var(--line);
}
.primary-nav .language-switch a {
padding: 0;
}
}
/* Corporate Identity section */
.identity-section {
background: #fff;
}
.identity-heading {
display: grid;
grid-template-columns: 1.05fr .95fr;
gap: 90px;
align-items: end;
margin-bottom: 68px;
}
.identity-heading h2 {
margin-bottom: 0;
}
.identity-heading > p {
margin: 0 0 10px;
color: var(--muted);
font-size: 18px;
}
.identity-showcase {
display: grid;
grid-template-columns: 1.55fr .75fr;
border-top: 1px solid var(--line);
border-bottom: 1px solid var(--line);
}
.identity-logo-card {
min-height: 360px;
padding: 34px 36px;
display: flex;
flex-direction: column;
border-right: 1px solid var(--line);
}
.identity-logo-card:last-child {
border-right: 0;
}
.identity-label {
color: var(--gold);
font-family: Georgia, serif;
font-size: 12px;
font-weight: 700;
letter-spacing: .16em;
}
.identity-logo-card figure {
flex: 1;
min-height: 210px;
margin: 26px 0 20px;
display: grid;
place-items: center;
background: var(--soft);
}
.identity-logo-primary figure img {
width: min(84%, 520px);
}
.identity-logo-symbol figure img {
width: min(44%, 130px);
}
.identity-logo-card > p {
margin: 0;
color: var(--muted);
}
.identity-concept-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
margin-top: 58px;
border-top: 1px solid var(--line);
border-bottom: 1px solid var(--line);
}
.identity-concept-grid article {
min-height: 285px;
padding: 38px 30px;
border-right: 1px solid var(--line);
}
.identity-concept-grid article:last-child {
border-right: 0;
}
.identity-concept-grid article > span {
color: var(--gold);
font-family: Georgia, serif;
font-size: 13px;
}
.identity-concept-grid h3 {
margin: 46px 0 15px;
font-size: 24px;
}
.identity-concept-grid p {
margin: 0;
color: var(--muted);
}
.identity-lower-grid {
display: grid;
grid-template-columns: 1.05fr .95fr;
gap: 80px;
margin-top: 70px;
}
.identity-colors h3,
.identity-usage h3 {
margin-bottom: 28px;
font-size: 28px;
}
.identity-color-list {
display: grid;
grid-template-columns: repeat(2, 1fr);
border-top: 1px solid var(--line);
border-left: 1px solid var(--line);
}
.identity-color-item {
display: grid;
grid-template-columns: 68px 1fr;
min-height: 86px;
border-right: 1px solid var(--line);
border-bottom: 1px solid var(--line);
}
.identity-swatch {
display: block;
border-right: 1px solid var(--line);
}
.identity-swatch-black { background: #111111; }
.identity-swatch-white { background: #ffffff; }
.identity-swatch-paper { background: #f6f3ee; }
.identity-swatch-gold { background: #a37a35; }
.identity-color-item p {
margin: 0;
padding: 15px 16px;
display: flex;
flex-direction: column;
justify-content: center;
}
.identity-color-item strong {
font-size: 14px;
}
.identity-color-item code {
color: var(--muted);
font-size: 12px;
}
.identity-small-note {
margin: 18px 0 0;
color: var(--muted);
font-size: 14px;
}
.identity-usage ul {
margin: 0;
padding: 0;
list-style: none;
border-top: 1px solid var(--line);
}
.identity-usage li {
position: relative;
padding: 15px 0 15px 24px;
border-bottom: 1px solid var(--line);
color: var(--muted);
}
.identity-usage li::before {
content: "—";
position: absolute;
left: 0;
color: var(--gold);
}
.identity-downloads {
display: flex;
flex-wrap: wrap;
gap: 12px;
margin-top: 28px;
}
.identity-downloads .button {
min-width: 168px;
}
.nav-submenu {
width: 180px;
}
@media (max-width: 900px) {
.identity-heading,
.identity-lower-grid {
grid-template-columns: 1fr;
gap: 34px;
}
.identity-showcase {
grid-template-columns: 1fr;
}
.identity-logo-card {
border-right: 0;
border-bottom: 1px solid var(--line);
}
.identity-logo-card:last-child {
border-bottom: 0;
}
.identity-concept-grid {
grid-template-columns: 1fr;
}
.identity-concept-grid article {
min-height: auto;
border-right: 0;
border-bottom: 1px solid var(--line);
}
.identity-concept-grid article:last-child {
border-bottom: 0;
}
}
@media (max-width: 600px) {
.identity-logo-card {
min-height: 290px;
padding: 28px 20px;
}
.identity-logo-card figure {
min-height: 170px;
}
.identity-color-list {
grid-template-columns: 1fr;
}
.identity-downloads {
flex-direction: column;
}
.identity-downloads .button {
width: 100%;
}
}
/* Transparent symbol mark support */
.identity-symbol-figure {
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 14px;
align-items: stretch;
background: transparent !important;
}
.identity-symbol-preview {
min-height: 180px;
padding: 14px 12px 10px;
display: grid;
grid-template-rows: auto 1fr;
align-items: center;
justify-items: center;
border: 1px solid var(--line);
}
.identity-symbol-preview-light {
background: #ffffff;
}
.identity-symbol-preview-dark {
background: linear-gradient(180deg, #c7ae7a 0%, #5f4d34 100%);
}
.identity-symbol-mini-label {
margin-bottom: 10px;
color: var(--gold);
font-family: Georgia, serif;
font-size: 10px;
font-weight: 700;
letter-spacing: .14em;
}
.identity-symbol-preview img {
width: min(78%, 120px);
height: auto;
}
@media (max-width: 600px) {
.identity-symbol-figure {
grid-template-columns: 1fr;
}
}
/* v20 official navy-and-gold corporate identity */
.site-header {
background: rgba(8,27,51,.98);
border-bottom-color: rgba(222,188,104,.34);
}
.header-inner { min-height: 86px; }
.brand img { width: 250px; max-height: 62px; object-fit: contain; }
.primary-nav,
.primary-nav a,
.nav-dropdown-toggle { color: #f6f3ee; }
.primary-nav a::after { background: #debc68; }
.menu-toggle { color: #debc68; border-color: #debc68; }
.nav-submenu { background: #081b33; border-color: rgba(222,188,104,.35); }
.primary-nav .nav-submenu a:hover,
.primary-nav .nav-submenu a:focus-visible { background: rgba(222,188,104,.12); }
.language-switch .is-active { color: #debc68 !important; }
.language-switch a { color: #c9c1b5 !important; }
.founder-mark { background: #081b33; border-color: #debc68; }
.founder-mark img { width: 78px; }
.site-footer { background: #081b33; }
.footer-brand img { width: 255px; filter: none; mix-blend-mode: normal; }
.footer-top, .footer-info { border-color: rgba(222,188,104,.26); }
.official-ci-section { background: #f8f6f2; }
.official-ci-primary {
padding: 30px;
background: #081b33;
border: 1px solid rgba(222,188,104,.55);
}
.official-ci-primary .identity-label { color: #debc68; }
.official-ci-primary figure {
min-height: 260px;
margin: 20px 0 12px;
display: grid;
place-items: center;
}
.official-ci-primary figure img { width: min(88%, 760px); }
.official-ci-primary > p { margin: 0; color: #d7d1c7; }
.official-ci-concepts { margin-top: 58px; }
.official-ci-concepts strong { color: #081b33; }
.publication-ci {
display: grid;
grid-template-columns: .92fr 1.08fr;
gap: 70px;
margin-top: 76px;
padding: 64px;
background: #081b33;
color: #f6f3ee;
}
.publication-ci h3 {
margin: 0 0 24px;
font-size: clamp(30px,4vw,48px);
line-height: 1.35;
}
.publication-ci-copy > p:not(.eyebrow) { color: #d6d0c7; }
.publication-ci ul { margin: 28px 0 0; padding: 0; list-style: none; }
.publication-ci li { position: relative; padding: 11px 0 11px 22px; border-bottom: 1px solid rgba(222,188,104,.24); color: #eee8de; }
.publication-ci li::before { content: "—"; position: absolute; left: 0; color: #debc68; }
.publication-ci-examples {
display: grid;
grid-template-columns: 1fr 1fr .46fr .46fr;
gap: 16px;
align-items: stretch;
}
.cover-example, .spine-example {
position: relative;
min-height: 360px;
padding: 28px 18px;
overflow: hidden;
}
.cover-example-light, .spine-example-light { background: #f6f3ee; }
.cover-example-color { background: linear-gradient(160deg,#7b3f3f,#263d5a 62%,#141b28); }
.spine-example-color { background: #293c59; }
.publication-ci-examples img {
position: absolute;
top: 43%;
left: 50%;
height: auto;
transform: translate(-50%, -50%);
}
.cover-example img { width: 68%; max-width: 180px; }
.spine-example img { width: 78%; max-width: 72px; }
.cover-example span, .spine-example span {
position: absolute;
left: 14px; bottom: 10px;
color: #debc68;
font-size: 12px; font-weight: 700; letter-spacing: .08em;
}
.official-ci-lower { margin-top: 76px; }
.identity-swatch-navy { background: #081b33; }
.identity-swatch-official-gold { background: #debc68; }
.identity-swatch-ink { background: #111111; }
@media (max-width: 900px) {
.publication-ci { grid-template-columns: 1fr; padding: 42px 26px; }
.publication-ci-examples { grid-template-columns: 1fr 1fr; }
.cover-example, .spine-example { min-height: 300px; }
.spine-example img { width: 64px; }
}
@media (max-width: 740px) {
.primary-nav { background: #081b33; border-bottom-color: rgba(222,188,104,.34); }
.brand img { width: 210px; }
.publication-ci-examples { grid-template-columns: 1fr 1fr; gap: 10px; }
.cover-example, .spine-example { min-height: 250px; padding: 20px 12px; }
.cover-example img { width: 60%; }
.spine-example img { width: 58px; }
.cover-example span, .spine-example span { left: 10px; font-size: 11px; }
}
.footer-bottom a[data-scroll-top] {
cursor: pointer;
}
.footer-bottom a[data-scroll-top]:hover,
.footer-bottom a[data-scroll-top]:focus-visible {
color: var(--gold);
outline: none;
}
/* v23 official logo CI */
.official-ci-primary figure img { width: min(96%, 1040px); height: auto; }
.identity-color-item small { display:block; margin-top:3px; color:#7d756b; font-size:.72rem; letter-spacing:.02em; }
.official-ci-section .identity-heading strong { color:#081b33; font-weight:700; }
/* v26 navigation, organization, and business architecture */
.nav-books-submenu {
left: auto;
right: 0;
width: min(430px, 90vw);
max-height: min(68vh, 640px);
overflow-y: auto;
padding: 10px;
transform: none;
scrollbar-width: thin;
scrollbar-color: rgba(222,188,104,.6) rgba(255,255,255,.08);
}
.nav-book-group-label {
display: block;
padding: 10px 12px 7px;
color: #debc68;
font-family: Georgia, serif;
font-size: 11px;
font-weight: 700;
letter-spacing: .16em;
text-transform: uppercase;
}
.nav-book-link {
display: block;
width: 100%;
padding: 9px 12px;
border: 0;
background: transparent;
color: #f6f3ee;
font: inherit;
font-size: 13px;
font-weight: 500;
line-height: 1.45;
text-align: left;
cursor: pointer;
border-radius: 2px;
}
.nav-book-link:hover,
.nav-book-link:focus-visible {
background: rgba(222,188,104,.12);
outline: none;
}
.organization-section { background: #f6f3ee; }
.organization-heading,
.business-heading {
display: grid;
grid-template-columns: minmax(0, 1.1fr) minmax(300px, .9fr);
gap: 72px;
align-items: end;
margin-bottom: 58px;
}
.organization-heading > p,
.business-heading > p {
margin: 0;
color: var(--muted);
font-size: 17px;
line-height: 1.9;
}
.org-chart { position: relative; padding-top: 6px; }
.org-node {
border: 1px solid rgba(222,188,104,.55);
background: #081b33;
color: #f6f3ee;
box-shadow: 0 18px 44px rgba(8,27,51,.10);
}
.org-node > span {
display: block;
color: #debc68;
font-family: Georgia, serif;
font-size: 11px;
font-weight: 700;
letter-spacing: .17em;
}
.org-node h3 { margin: 10px 0 7px; font-size: 23px; }
.org-node strong { display: block; color: #debc68; font-size: 15px; }
.org-node p { margin: 15px 0 0; color: #d9d5ce; font-size: 14px; line-height: 1.75; }
.org-leader { width: min(360px, 100%); margin: 0 auto; padding: 27px 30px; text-align: center; }
.org-second-row {
display: grid;
grid-template-columns: minmax(0, 1.45fr) minmax(270px, .75fr);
gap: 72px;
align-items: stretch;
margin: 58px auto 0;
}
.org-headquarters,
.org-support { padding: 28px 30px; }
.org-headquarters { text-align: center; }
.org-office-grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 22px;
width: calc((100% - 72px) * .66);
margin-top: 54px;
}
.org-office { padding: 25px 24px 27px; }
.org-connector-main,
.org-connector-division { position: relative; margin: 0 auto; }
.org-connector-main::before {
content: "";
position: absolute;
top: 0;
left: 50%;
width: 1px;
height: 58px;
background: #debc68;
}
.org-connector-division { width: calc((100% - 72px) * .66); height: 54px; }
.org-connector-division::before {
content: "";
position: absolute;
top: 0;
left: 50%;
width: 1px;
height: 28px;
background: #debc68;
}
.org-connector-division::after {
content: "";
position: absolute;
top: 28px;
left: 16.666%;
right: 16.666%;
height: 1px;
background: #debc68;
}
.org-office-grid .org-office { position: relative; }
.org-office-grid .org-office::before {
content: "";
position: absolute;
top: -27px;
left: 50%;
width: 1px;
height: 27px;
background: #debc68;
}
.business-section { background: #fff; }
.business-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
border-top: 1px solid var(--line);
border-left: 1px solid var(--line);
}
.business-card {
scroll-margin-top: 120px;
min-height: 300px;
padding: 42px 42px 38px;
border-right: 1px solid var(--line);
border-bottom: 1px solid var(--line);
background: #fff;
}
.business-card > span {
color: #debc68;
font-family: Georgia, serif;
font-size: 13px;
font-weight: 700;
}
.business-card h3 { margin: 24px 0 18px; font-size: 28px; }
.business-card p { margin: 0 0 26px; color: var(--muted); font-size: 16px; line-height: 1.85; }
@media (max-width: 980px) {
.organization-heading,
.business-heading { grid-template-columns: 1fr; gap: 24px; }
.org-second-row { grid-template-columns: 1fr; gap: 24px; margin-top: 44px; }
.org-office-grid { width: 100%; }
.org-connector-main::before { height: 44px; }
.org-connector-division { width: 100%; }
}
@media (max-width: 740px) {
.nav-books-submenu {
width: 100%;
max-height: 52vh;
padding: 2px 0 8px 12px;
overflow-y: auto;
}
.nav-book-link { padding: 8px 12px; font-size: 12px; }
.organization-heading,
.business-heading { margin-bottom: 38px; }
.org-office-grid { grid-template-columns: 1fr; gap: 18px; margin-top: 30px; }
.org-connector-division { display: none; }
.org-office-grid .org-office::before { display: none; }
.org-leader,
.org-headquarters,
.org-support,
.org-office { text-align: left; }
.business-grid { grid-template-columns: 1fr; }
.business-card { min-height: 0; padding: 34px 26px; }
}
/* History */
.history-section {
background: #f6f3ee;
}
.history-heading,
.records-heading {
display: grid;
grid-template-columns: minmax(0, .9fr) minmax(320px, 1.1fr);
gap: 72px;
align-items: end;
margin-bottom: 48px;
}
.history-heading h2,
.records-heading h2 {
margin: 0;
font-family: var(--serif);
font-size: clamp(34px, 4.2vw, 58px);
line-height: 1.14;
letter-spacing: -.04em;
}
.history-heading > p,
.records-heading > p {
margin: 0;
color: var(--muted);
font-size: 17px;
line-height: 1.9;
}
.history-timeline {
border-top: 1px solid #c9a35c;
border-bottom: 1px solid var(--line);
}
.history-timeline article {
display: grid;
grid-template-columns: 190px 1fr;
gap: 42px;
padding: 34px 0;
align-items: start;
}
.history-timeline time {
color: #a37a35;
font-family: Georgia, 'Times New Roman', serif;
font-size: 22px;
font-weight: 700;
}
.history-timeline h3 {
margin: 0 0 10px;
font-size: 23px;
}
.history-timeline p {
margin: 0;
color: var(--muted);
line-height: 1.8;
}
/* News & Records */
.records-section {
background: #fff;
}
.records-grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 24px;
}
.record-card {
display: grid;
grid-template-rows: 220px 1fr;
min-height: 490px;
border: 1px solid var(--line);
background: #fff;
color: inherit;
text-decoration: none;
overflow: hidden;
transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.record-card:hover,
.record-card:focus-visible {
transform: translateY(-4px);
border-color: #c9a35c;
box-shadow: 0 18px 42px rgba(8,27,51,.12);
outline: none;
}
.record-card-media {
margin: 0;
padding: 22px;
display: flex;
align-items: center;
justify-content: center;
background: #f6f3ee;
overflow: hidden;
}
.record-card-media img {
width: 100%;
height: 100%;
object-fit: contain;
}
.record-card-body {
display: flex;
flex-direction: column;
padding: 25px 26px 27px;
}
.record-meta {
display: flex;
justify-content: space-between;
gap: 16px;
margin-bottom: 15px;
color: #a37a35;
font-size: 11px;
font-weight: 700;
letter-spacing: .12em;
}
.record-meta time {
color: var(--muted);
letter-spacing: .06em;
text-align: right;
}
.record-card h3 {
margin: 0 0 13px;
font-size: 21px;
line-height: 1.42;
letter-spacing: -.02em;
}
.record-card p {
margin: 0 0 24px;
color: var(--muted);
font-size: 14px;
line-height: 1.75;
}
.record-source {
margin-top: auto;
color: #081b33;
font-size: 13px;
}
.record-source span {
color: #a37a35;
}
.records-note {
margin: 28px 0 0;
color: var(--muted);
font-size: 13px;
line-height: 1.7;
}
@media (max-width: 1040px) {
.records-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.record-card { min-height: 470px; }
}
@media (max-width: 760px) {
.history-heading,
.records-heading {
grid-template-columns: 1fr;
gap: 22px;
margin-bottom: 34px;
}
.history-timeline article {
grid-template-columns: 1fr;
gap: 12px;
}
.records-grid { grid-template-columns: 1fr; }
.record-card {
grid-template-columns: 120px 1fr;
grid-template-rows: auto;
min-height: 0;
}
.record-card-media { min-height: 190px; padding: 16px; }
.record-card-body { padding: 20px; }
}
@media (max-width: 520px) {
.record-card { grid-template-columns: 1fr; }
.record-card-media { height: 230px; }
}
/* v28 founder categories and complete sitemap menu */
.founder-category-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 22px;
margin: 42px 0 34px;
}
.founder-category {
position: relative;
min-height: 250px;
padding: 30px 28px 28px;
border: 1px solid var(--line);
background: #fff;
}
.founder-category-number {
display: block;
margin-bottom: 20px;
color: var(--gold);
font-family: Georgia, serif;
font-size: 12px;
font-weight: 700;
letter-spacing: .16em;
}
.founder-category h4 {
margin: 0 0 16px;
color: var(--ink);
font-family: "Noto Serif KR", Georgia, serif;
font-size: 23px;
line-height: 1.35;
}
.founder-category p {
margin: 0;
color: var(--muted);
font-size: 16px;
line-height: 1.9;
}
.founder-blog-card {
display: grid;
grid-template-columns: minmax(0, 1fr) auto;
gap: 6px 28px;
align-items: center;
margin-top: 24px;
padding: 28px 30px;
border: 1px solid rgba(222,188,104,.58);
background: #081b33;
color: #f6f3ee;
text-decoration: none;
transition: transform .2s ease, border-color .2s ease;
}
.founder-blog-card:hover,
.founder-blog-card:focus-visible {
transform: translateY(-2px);
border-color: #debc68;
outline: none;
}
.founder-blog-kicker {
grid-column: 1 / -1;
color: #debc68;
font-family: Georgia, serif;
font-size: 11px;
font-weight: 700;
letter-spacing: .18em;
}
.founder-blog-card strong {
font-family: "Noto Serif KR", Georgia, serif;
font-size: 24px;
line-height: 1.35;
}
.founder-blog-card p {
grid-column: 1 / 2;
margin: 4px 0 0;
color: rgba(246,243,238,.74);
font-size: 14px;
line-height: 1.7;
}
.founder-blog-cta {
grid-column: 2 / 3;
grid-row: 2 / 4;
color: #debc68;
font-size: 14px;
font-weight: 700;
white-space: nowrap;
}
/* Complete menu / sitemap */
.nav-all-dropdown { position: relative; }
.nav-sitemap-menu {
left: auto;
right: 0;
width: min(1080px, calc(100vw - 40px));
max-height: min(76vh, 760px);
padding: 26px;
overflow-y: auto;
transform: none;
grid-template-columns: 150px 170px minmax(470px, 1fr) 170px;
gap: 24px;
}
.nav-all-dropdown:hover .nav-sitemap-menu,
.nav-all-dropdown:focus-within .nav-sitemap-menu,
.nav-all-dropdown.is-open .nav-sitemap-menu {
display: grid;
}
.sitemap-section {
min-width: 0;
padding-right: 18px;
border-right: 1px solid rgba(222,188,104,.22);
}
.sitemap-section:last-child {
padding-right: 0;
border-right: 0;
}
.sitemap-heading {
display: block;
margin: 0 0 12px;
color: #debc68;
font-family: Georgia, "Noto Serif KR", serif;
font-size: 12px;
font-weight: 700;
letter-spacing: .12em;
}
.primary-nav .nav-sitemap-menu a {
padding: 8px 0;
color: #f6f3ee;
font-size: 13px;
white-space: normal;
}
.primary-nav .nav-sitemap-menu a:hover,
.primary-nav .nav-sitemap-menu a:focus-visible {
background: transparent;
color: #debc68;
}
.sitemap-books-section { min-width: 0; }
.sitemap-book-groups {
display: grid;
grid-template-columns: 1.15fr .85fr;
gap: 20px;
}
.sitemap-subheading {
display: block;
margin-bottom: 5px;
color: rgba(246,243,238,.58);
font-size: 11px;
font-weight: 700;
letter-spacing: .08em;
}
.sitemap-book-link {
padding: 6px 0;
font-size: 12px;
line-height: 1.38;
}
.sitemap-book-link:hover,
.sitemap-book-link:focus-visible {
color: #debc68;
background: transparent;
}
.sitemap-external-link { margin-top: 10px; }
@media (max-width: 1180px) {
.nav-sitemap-menu {
width: min(900px, calc(100vw - 32px));
grid-template-columns: 140px 155px minmax(390px, 1fr);
}
.nav-sitemap-menu .sitemap-section:last-child {
grid-column: 1 / -1;
display: flex;
flex-wrap: wrap;
gap: 10px 24px;
padding-top: 18px;
border-top: 1px solid rgba(222,188,104,.22);
}
.nav-sitemap-menu .sitemap-section:last-child .sitemap-heading {
flex-basis: 100%;
}
}
@media (max-width: 740px) {
.founder-category-grid { grid-template-columns: 1fr; margin-top: 30px; }
.founder-category { min-height: auto; padding: 26px 22px; }
.founder-blog-card { grid-template-columns: 1fr; padding: 24px 22px; }
.founder-blog-card p,
.founder-blog-cta {
grid-column: 1;
grid-row: auto;
}
.nav-all-dropdown { width: 100%; }
.nav-sitemap-menu {
position: static;
width: 100%;
max-height: 58vh;
padding: 16px 10px 18px 16px;
transform: none;
grid-template-columns: 1fr;
gap: 20px;
}
.nav-all-dropdown:hover .nav-sitemap-menu:not(.is-mobile-open),
.nav-all-dropdown:focus-within .nav-sitemap-menu:not(.is-mobile-open) {
display: none;
}
.nav-all-dropdown.is-open .nav-sitemap-menu { display: grid; }
.sitemap-section,
.sitemap-section:last-child {
display: block;
padding: 0 0 16px;
border-right: 0;
border-bottom: 1px solid rgba(222,188,104,.22);
}
.sitemap-section:last-child { border-bottom: 0; }
.sitemap-book-groups { grid-template-columns: 1fr; gap: 18px; }
}
/* v29 founder featured works */
.founder-featured-works {
scroll-margin-top: 110px;
margin-top: 38px;
padding: 34px 0 4px;
border-top: 1px solid var(--line);
}
.founder-featured-heading {
display: grid;
grid-template-columns: minmax(0, .55fr) minmax(280px, 1fr);
gap: 12px 42px;
align-items: end;
margin-bottom: 24px;
}
.founder-featured-eyebrow {
grid-column: 1 / -1;
color: var(--gold);
font-family: Georgia, serif;
font-size: 11px;
font-weight: 700;
letter-spacing: .18em;
}
.founder-featured-heading h4 {
margin: 0;
color: var(--ink);
font-family: "Noto Serif KR", Georgia, serif;
font-size: clamp(28px, 3vw, 42px);
line-height: 1.25;
}
.founder-featured-heading p {
margin: 0;
color: var(--muted);
font-size: 15px;
line-height: 1.75;
}
.founder-featured-grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 18px;
}
.founder-featured-card {
display: flex;
flex-direction: column;
min-width: 0;
padding: 0;
overflow: hidden;
border: 1px solid var(--line);
background: #fff;
color: inherit;
text-align: left;
cursor: pointer;
transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.founder-featured-card:hover,
.founder-featured-card:focus-visible {
transform: translateY(-4px);
border-color: rgba(222,188,104,.85);
box-shadow: 0 14px 34px rgba(8,27,51,.10);
outline: none;
}
.founder-featured-card figure {
aspect-ratio: 0.69;
margin: 0;
overflow: hidden;
background: #f6f3ee;
}
.founder-featured-card figure img {
width: 100%;
height: 100%;
object-fit: cover;
}
.founder-featured-body {
display: flex;
flex: 1;
flex-direction: column;
padding: 20px 18px 18px;
}
.founder-featured-category {
margin-bottom: 9px;
color: var(--gold-dark, #a37a35);
font-size: 11px;
font-weight: 700;
letter-spacing: .05em;
}
.founder-featured-body strong {
display: block;
margin-bottom: 12px;
color: var(--ink);
font-family: "Noto Serif KR", Georgia, serif;
font-size: 18px;
line-height: 1.48;
word-break: keep-all;
}
.founder-featured-body p {
margin: 0 0 16px;
color: var(--muted);
font-size: 13px;
line-height: 1.72;
}
.founder-featured-more {
margin-top: auto;
color: var(--navy);
font-size: 12px;
font-weight: 700;
}
@media (max-width: 1050px) {
.founder-featured-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (max-width: 640px) {
.founder-featured-heading {
grid-template-columns: 1fr;
gap: 10px;
}
.founder-featured-grid {
grid-template-columns: 1fr;
}
.founder-featured-card {
display: grid;
grid-template-columns: 112px minmax(0, 1fr);
}
.founder-featured-card figure {
aspect-ratio: auto;
height: 100%;
min-height: 190px;
}
}
/* v33 portal and image search links */
.portal-search-strip {
display: grid;
grid-template-columns: 190px minmax(0, 1fr);
gap: 22px;
align-items: center;
margin-bottom: 28px;
padding: 22px 24px;
border: 1px solid rgba(222,188,104,.55);
background: #081b33;
}
.portal-search-title {
color: #debc68;
font-family: "Noto Serif KR", Georgia, serif;
font-size: 17px;
}
.portal-search-links {
display: flex;
flex-wrap: wrap;
gap: 10px;
}
.portal-search-links a {
display: inline-flex;
align-items: center;
min-height: 36px;
padding: 8px 12px;
border: 1px solid rgba(222,188,104,.35);
color: #f6f3ee;
font-size: 12px;
font-weight: 700;
text-decoration: none;
transition: border-color .2s ease, color .2s ease, background .2s ease;
}
.portal-search-links a:hover,
.portal-search-links a:focus-visible {
border-color: #debc68;
background: rgba(222,188,104,.08);
color: #debc68;
outline: none;
}
@media (max-width: 760px) {
.portal-search-strip {
grid-template-columns: 1fr;
gap: 14px;
padding: 20px;
}
}
/* v35 — approved CI, expanded header, business lines and careers */
.header-inner.container {
width: min(calc(100% - 64px), 1760px);
min-height: 172px;
gap: 34px;
}
.brand {
flex: 0 0 auto;
display: flex;
align-items: center;
}
.brand img {
width: 520px;
max-height: 148px;
object-fit: contain;
}
.primary-nav {
flex: 1 1 auto;
justify-content: flex-end;
gap: 24px;
font-size: 19.5px;
white-space: nowrap;
}
.nav-dropdown-toggle { font-size: inherit; font-weight: 600; }
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch { padding-block: 62px; }
.primary-nav a::after { bottom: 50px; }
.nav-submenu { top: calc(100% - 42px); }
/* Eight business lines */
.business-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.business-card { min-height: 340px; }
.business-card h3 { min-height: 2.65em; display: flex; align-items: flex-end; }
/* Founder role architecture */
.founder-category-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.founder-category { min-height: 410px; }
.founder-position { font-size: 17px; line-height: 1.75; }
.org-office h3 { min-height: 1.6em; }
/* Careers */
.careers-section {
background: #081b33;
color: #f7f2e8;
border-bottom-color: rgba(222,188,104,.28);
}
.careers-inner > h2 { margin-bottom: 24px; }
.careers-slogan {
margin: 0;
color: #debc68;
font-family: "Noto Serif KR", Georgia, serif;
font-size: clamp(28px, 3.2vw, 48px);
font-weight: 600;
line-height: 1.45;
letter-spacing: -.035em;
}
.careers-criteria {
display: inline-block;
margin: 18px 0 54px;
padding: 10px 20px;
border: 1px solid rgba(222,188,104,.62);
color: #f7f2e8;
font-size: 18px;
font-weight: 700;
letter-spacing: .05em;
}
.careers-grid {
display: grid;
grid-template-columns: minmax(0, 1.25fr) minmax(320px, .75fr);
gap: 30px;
}
.career-notice,
.career-principles {
padding: 44px 42px;
border: 1px solid rgba(222,188,104,.38);
background: rgba(255,255,255,.035);
}
.career-status {
color: #debc68;
font-family: Georgia, serif;
font-size: 12px;
font-weight: 700;
letter-spacing: .16em;
}
.career-notice h3,
.career-principles h3 { margin: 18px 0; font-size: 28px; }
.career-notice p,
.career-principles p { color: #d6d0c7; font-size: 17px; }
.career-notice ul { margin: 26px 0 34px; padding: 0; list-style: none; }
.career-notice li { padding: 10px 0; border-bottom: 1px solid rgba(222,188,104,.18); }
.career-notice li::before { content: "—"; margin-right: 12px; color: #debc68; }
.button-gold { border-color: #debc68; background: #debc68; color: #081b33; }
.button-gold:hover { background: transparent; color: #debc68; }
.career-principles dl { margin: 30px 0 0; }
.career-principles dl > div { display: grid; grid-template-columns: 78px 1fr; gap: 20px; padding: 15px 0; border-top: 1px solid rgba(222,188,104,.2); }
.career-principles dt { color: #debc68; font-weight: 700; }
.career-principles dd { margin: 0; color: #d6d0c7; }
.footer-brand img { width: 390px; max-height: 120px; object-fit: contain; }
@media (max-width: 1500px) {
.menu-toggle { display: block; font-size: 17px; padding: 10px 16px; }
.primary-nav {
display: none;
position: absolute;
left: 0;
right: 0;
top: 172px;
flex-direction: column;
align-items: stretch;
gap: 0;
padding: 16px 32px 28px;
background: #081b33;
border-bottom: 1px solid rgba(222,188,104,.34);
font-size: 18px;
white-space: normal;
}
.primary-nav.is-open { display: flex; }
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch { padding-block: 15px; }
.primary-nav a::after { display: none; }
.nav-dropdown-toggle { width: 100%; justify-content: space-between; padding-inline: 0; }
.nav-submenu { position: static; width: 100%; transform: none; box-shadow: none; margin-top: 0; }
}
@media (max-width: 1120px) {
.founder-category-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
.founder-category { min-height: 330px; }
.careers-grid { grid-template-columns: 1fr; }
}
@media (max-width: 740px) {
.header-inner.container { width: min(calc(100% - 28px), 1760px); min-height: 142px; }
.brand img { width: min(72vw, 390px); max-height: 120px; }
.primary-nav { top: 142px; padding: 12px 22px 22px; }
.business-grid, .founder-category-grid { grid-template-columns: 1fr; }
.business-card h3 { min-height: 0; }
.founder-category { min-height: 0; }
.career-notice, .career-principles { padding: 32px 24px; }
.careers-criteria { font-size: 15px; letter-spacing: 0; }
.footer-brand img { width: min(82vw, 360px); }
}
/* =========================================================
v36 final corrections — 2026-07-27
The official logo artwork is used as-is. Only rendered size changes.
========================================================= */
:root {
--font-batang: "KoPubWorld Batang", serif;
--font-dotum: "KoPubWorld Dotum", sans-serif;
}
html, body, button, input, textarea, select {
font-family: var(--font-dotum) !important;
font-weight: 400;
}
body, p, li, dd, address, a, span { font-weight: 400; }
h1, h2, h3, h4, h5, h6,
.section-title, .eyebrow, strong, dt,
.nav-dropdown-toggle, .primary-nav > a,
.button, .text-link, .book-detail-button, .book-buy-link {
font-family: var(--font-batang) !important;
font-weight: 700 !important;
}
/* Supporting descriptions remain Medium. */
p, .section-lead, .body-copy, .organization-heading > p,
.business-heading > p, .founder-category p, .career-notice p,
.career-principles p, .contact-card p, .footer-info, .footer-top p {
font-family: var(--font-dotum) !important;
font-weight: 400 !important;
}
/* Header: 50% of the v35 expanded height and logo scale. */
.header-inner.container {
width: min(calc(100% - 56px), 1760px);
min-height: 86px !important;
gap: 28px;
}
.brand img {
width: 260px !important;
max-height: 70px !important;
height: auto !important;
object-fit: contain;
}
.primary-nav { gap: 22px; font-size: 16px; }
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch { padding-block: 28px !important; }
.primary-nav a::after { bottom: 20px !important; }
.nav-submenu { top: calc(100% - 8px) !important; }
/* Founder: smaller title and readable card-news layout. */
.founder-story > h3 {
max-width: 900px;
margin-bottom: 30px;
font-size: clamp(27px, 2.8vw, 39px) !important;
line-height: 1.38;
letter-spacing: -.035em;
}
.founder-category-grid {
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
gap: 20px !important;
margin: 30px 0 38px;
}
.founder-category {
min-height: 0 !important;
padding: 26px 24px 24px;
border: 1px solid rgba(8,27,51,.14);
border-radius: 14px;
background: #fff;
box-shadow: 0 12px 28px rgba(8,27,51,.07);
}
.founder-category-number { margin-bottom: 13px; }
.founder-category h4 { margin-bottom: 12px; font-size: 22px; }
.founder-category p { font-size: 15.5px; line-height: 1.78; }
/* Simple organization: representative and three departments only. */
.org-chart-simple { max-width: 1060px; margin: 0 auto; padding-top: 0; }
.org-simple-top { width: min(390px, 100%); margin: 0 auto; padding: 27px 30px; text-align: center; }
.org-simple-line { position: relative; height: 58px; }
.org-simple-line::before { content:""; position:absolute; left:50%; top:0; width:1px; height:30px; background:#debc68; }
.org-simple-line::after { content:""; position:absolute; left:16.666%; right:16.666%; top:30px; height:1px; background:#debc68; }
.org-simple-departments { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.org-simple-dept { position:relative; min-height:230px; padding:28px 26px; text-align:center; }
.org-simple-dept::before { content:""; position:absolute; left:50%; top:-28px; width:1px; height:28px; background:#debc68; }
.org-simple-dept h3 { min-height:0 !important; }
/* Seven final business lines. */
.business-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
.business-card { min-height: 320px; }
/* Contact buttons removed; cards no longer force excessive blank height. */
.contact-card { min-height: 300px; }
.contact-card .contact-value { margin-bottom: 18px; }
/* Footer: 50% height, official lockup unchanged in proportion. */
.site-footer { padding: 28px 0 14px !important; }
.footer-top { gap: 22px; padding-bottom: 16px !important; }
.footer-brand img {
width: 195px !important;
max-height: 60px !important;
height: auto !important;
object-fit: contain;
filter: none !important;
mix-blend-mode: normal !important;
}
.footer-info { gap: 12px 30px; padding: 14px 0 !important; }
.footer-bottom { padding-top: 12px !important; }
@media (max-width: 1500px) {
.primary-nav { top: 86px !important; }
}
@media (max-width: 1100px) {
.founder-category-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
}
@media (max-width: 740px) {
.header-inner.container { width: min(calc(100% - 32px),1760px); min-height: 68px !important; }
.brand img { width: 205px !important; max-height: 54px !important; }
.primary-nav { top: 68px !important; }
.founder-category-grid, .org-simple-departments { grid-template-columns: 1fr !important; }
.org-simple-line { display:none; }
.org-simple-dept::before { display:none; }
.footer-brand img { width: 175px !important; max-height: 54px !important; }
.footer-top, .footer-bottom { gap: 12px; }
}
/* =========================================================
v38 menu typography corrections — 2026-07-27
Menu uses KoPub Dotum. Visible top menu size increased to 150%.
========================================================= */
.primary-nav {
gap: 26px;
font-size: 24px !important;
}
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch,
.primary-nav > .language-switch a {
font-family: var(--font-dotum) !important;
font-weight: 700 !important;
font-size: 24px !important;
letter-spacing: -0.015em;
}
.nav-dropdown-toggle span,
.language-divider {
font-size: 15px !important;
}
.nav-submenu,
.nav-submenu a,
.nav-submenu button,
.nav-book-group-label,
.sitemap-heading,
.sitemap-subheading,
.sitemap-book-link,
.nav-book-link {
font-family: var(--font-dotum) !important;
}
.nav-submenu a,
.nav-submenu button,
.sitemap-book-link,
.nav-book-link {
font-size: 18px !important;
font-weight: 700 !important;
line-height: 1.55;
}
@media (max-width: 1280px) {
.primary-nav { font-size: 21px !important; gap: 20px; }
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch,
.primary-nav > .language-switch a { font-size: 21px !important; }
}
@media (max-width: 900px) {
.primary-nav { font-size: 18px !important; gap: 14px; }
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch,
.primary-nav > .language-switch a { font-size: 18px !important; }
.nav-submenu a,
.nav-submenu button,
.sitemap-book-link,
.nav-book-link { font-size: 16px !important; }
}
/* =========================================================
v39 original typography restoration — 2026-07-27
Restore the site's original Noto Serif KR / Noto Sans KR system.
Keep the enlarged navigation size requested after v37.
========================================================= */
:root {
--font-serif-original: "Noto Serif KR", Georgia, serif;
--font-sans-original: "Noto Sans KR", Arial, sans-serif;
}
html,
body,
button,
input,
textarea,
select,
p,
li,
dd,
address,
a,
span,
.body-copy,
.organization-heading > p,
.business-heading > p,
.founder-category p,
.career-notice p,
.career-principles p,
.contact-card p,
.footer-info,
.footer-top p {
font-family: var(--font-sans-original) !important;
}
h1,
h2,
h3,
h4,
h5,
h6,
.section-title,
.section-lead,
.eyebrow,
.book-card h3,
.contact-value,
strong,
dt {
font-family: var(--font-serif-original) !important;
}
/* Navigation remains enlarged, but returns to the original sans-serif face. */
.primary-nav,
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch,
.primary-nav > .language-switch a,
.nav-submenu,
.nav-submenu a,
.nav-submenu button,
.nav-book-group-label,
.sitemap-heading,
.sitemap-subheading,
.sitemap-book-link,
.nav-book-link {
font-family: var(--font-sans-original) !important;
}
.primary-nav {
font-size: 24px !important;
}
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch,
.primary-nav > .language-switch a {
font-size: 24px !important;
font-weight: 700 !important;
}
@media (max-width: 1280px) {
.primary-nav,
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch,
.primary-nav > .language-switch a {
font-size: 21px !important;
}
}
@media (max-width: 900px) {
.primary-nav,
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch,
.primary-nav > .language-switch a {
font-size: 18px !important;
}
}
/* =========================================================
v40 content hierarchy and typography corrections
- unfinished CI download buttons removed from HTML
- action links use original sans typeface and 130% sizing
- business cards use larger, more readable type
- top-level menu labels use a unified navy/gold box
- top-level section titles use the original sans typeface
========================================================= */
/* Action links and buttons: original sans-serif, 130% scale. */
.text-link,
.book-detail-button,
.book-buy-link,
.button,
.founder-featured-more,
.founder-blog-cta,
.record-link,
.sitemap-external-link {
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-weight: 700 !important;
}
.text-link {
font-size: 21px !important;
line-height: 1.5;
}
/* Business cards: titles and descriptions enlarged for readability. */
.business-card h3 {
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-size: 42px !important;
font-weight: 700 !important;
line-height: 1.3;
letter-spacing: -0.035em;
}
.business-card p {
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-size: 24px !important;
font-weight: 400 !important;
line-height: 1.8;
}
.business-card {
min-height: 470px !important;
}
/* Top-level menu labels: 300% scale, navy box, gold type. */
#about > .container > .eyebrow,
#founder > .container > .eyebrow,
#organization > .container > .eyebrow,
#history > .container > .eyebrow,
#identity > .container > .eyebrow,
#business > .container > .eyebrow,
#books > .container > .eyebrow,
#news-records > .container > .eyebrow,
#careers > .container > .eyebrow,
#contact > .container > .eyebrow {
display: inline-flex;
align-items: center;
width: fit-content;
margin: 0 0 34px !important;
padding: 12px 22px;
border: 1px solid rgba(222,188,104,.65);
border-radius: 2px;
background: #081b33;
color: #debc68 !important;
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-size: 39px !important;
font-weight: 700 !important;
line-height: 1.15;
letter-spacing: .06em;
}
/* Main section titles use the site's original sans-serif face. */
#about-title,
#founder-title,
#organization-title,
#history-title,
#identity-title,
#business-title,
#books-title,
#records-title,
#careers-title,
#contact-title,
.founder-story > h3,
.business-heading h2,
.section-heading-row h2,
.history-heading h2,
.records-heading h2,
.contact-heading h2 {
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-weight: 700 !important;
}
/* Supporting section descriptions: 150% scale where shown alongside menu titles. */
.business-heading > p,
.section-heading-row > p,
.history-heading > p,
.records-heading > p,
.contact-intro,
.organization-heading > p {
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-size: 25.5px !important;
line-height: 1.8;
}
@media (max-width: 1100px) {
.business-card h3 { font-size: 36px !important; }
.business-card p { font-size: 21px !important; }
#about > .container > .eyebrow,
#founder > .container > .eyebrow,
#organization > .container > .eyebrow,
#history > .container > .eyebrow,
#identity > .container > .eyebrow,
#business > .container > .eyebrow,
#books > .container > .eyebrow,
#news-records > .container > .eyebrow,
#careers > .container > .eyebrow,
#contact > .container > .eyebrow {
font-size: 31px !important;
}
}
@media (max-width: 740px) {
.text-link { font-size: 18px !important; }
.business-card { min-height: 0 !important; }
.business-card h3 { font-size: 30px !important; }
.business-card p { font-size: 18px !important; }
.business-heading > p,
.section-heading-row > p,
.history-heading > p,
.records-heading > p,
.contact-intro,
.organization-heading > p { font-size: 19px !important; }
#about > .container > .eyebrow,
#founder > .container > .eyebrow,
#organization > .container > .eyebrow,
#history > .container > .eyebrow,
#identity > .container > .eyebrow,
#business > .container > .eyebrow,
#books > .container > .eyebrow,
#news-records > .container > .eyebrow,
#careers > .container > .eyebrow,
#contact > .container > .eyebrow {
padding: 9px 14px;
font-size: 24px !important;
letter-spacing: .04em;
}
}
/* =========================================================
v41 consolidated visual corrections
Official logo artwork remains unaltered; header uses exact crops.
========================================================= */
:root {
--brand-serif: "Cinzel", "Noto Serif KR", Georgia, serif;
--brand-korean: "Noto Serif KR", Georgia, serif;
--utility-sans: "Noto Sans KR", Arial, sans-serif;
}
/* Medium, restrained brand typography. Latin uses Cinzel; Korean falls back to Noto Serif KR. */
html, body, button, input, textarea, select,
body p, body li, body dd, body address, body a, body span,
h1, h2, h3, h4, h5, h6, strong, dt {
font-family: var(--brand-serif) !important;
font-weight: 500 !important;
}
/* Header: 70% of the prior expanded height, with approved artwork assembled more tightly. */
.site-header { background: #081b33 !important; }
.header-inner.container {
min-height: 96px !important;
padding-block: 8px !important;
gap: 24px !important;
}
.brand { flex: 0 0 auto; }
.brand-lockup {
display: inline-flex;
align-items: center;
gap: 12px;
width: 405px;
max-width: 42vw;
}
.brand-symbol {
flex: 0 0 auto;
width: 76px !important;
height: 78px !important;
object-fit: contain;
}
.brand-wordmark-stack {
display: flex;
flex: 1;
flex-direction: column;
align-items: flex-start;
justify-content: center;
gap: 1px;
min-width: 0;
}
.brand-wordmark-en {
width: 100% !important;
max-width: 292px !important;
height: 30px !important;
object-fit: contain;
object-position: left center;
}
.brand-wordmark-ko {
width: 84% !important;
max-width: 245px !important;
height: 30px !important;
margin-left: 12px;
object-fit: contain;
object-position: left center;
}
.primary-nav {
gap: 22px !important;
font-size: 18px !important;
}
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch,
.primary-nav > .language-switch a {
padding-block: 28px !important;
color: #f6f3ee !important;
font-family: var(--brand-serif) !important;
font-size: 18px !important;
font-weight: 500 !important;
}
.primary-nav a::after { bottom: 20px !important; }
.nav-dropdown-toggle span { font-size: 12px !important; }
.nav-submenu a, .nav-submenu button,
.nav-book-group-label, .sitemap-heading, .sitemap-subheading,
.sitemap-book-link, .nav-book-link {
font-family: var(--brand-serif) !important;
font-weight: 500 !important;
}
/* Titles reduced to 70% of v40 and returned to a medium serif treatment. */
h1 { font-size: clamp(40px, 4.5vw, 58px) !important; font-weight: 500 !important; }
h2,
#about-title, #founder-title, #organization-title, #history-title,
#identity-title, #business-title, #books-title, #records-title,
#careers-title, #contact-title,
.founder-story > h3, .business-heading h2, .section-heading-row h2,
.history-heading h2, .records-heading h2, .contact-heading h2 {
font-family: var(--brand-serif) !important;
font-size: clamp(34px, 3.3vw, 46px) !important;
font-weight: 500 !important;
line-height: 1.32 !important;
letter-spacing: -.035em !important;
}
h3, h4, h5, h6 { font-weight: 500 !important; }
/* Section labels: retain navy/gold identity but scale down to 70% and use Medium. */
#about > .container > .eyebrow,
#founder > .container > .eyebrow,
#organization > .container > .eyebrow,
#history > .container > .eyebrow,
#identity > .container > .eyebrow,
#business > .container > .eyebrow,
#books > .container > .eyebrow,
#news-records > .container > .eyebrow,
#careers > .container > .eyebrow,
#contact > .container > .eyebrow {
padding: 10px 18px !important;
margin-bottom: 28px !important;
font-family: var(--brand-serif) !important;
font-size: 27px !important;
font-weight: 500 !important;
letter-spacing: .05em !important;
}
/* Descriptive copy: 80% scale, medium weight, compact 6pt-like leading and full justification. */
.hero-copy,
.section-lead, .body-copy, .body-copy p,
.business-heading > p, .section-heading-row > p,
.history-heading > p, .records-heading > p,
.organization-heading > p, .identity-heading > p,
.publication-ci-copy > p, .contact-intro,
.business-card p, .history-timeline p,
.record-card p, .career-notice p, .career-principles p,
.contact-card p, .contact-note p,
.founder-featured-heading p, .founder-featured-body p,
.founder-blog-card p, .records-note {
font-size: 16px !important;
font-weight: 500 !important;
line-height: 1.48 !important;
text-align: justify !important;
text-justify: inter-word;
}
.section-lead { font-size: 18px !important; }
.business-heading > p, .section-heading-row > p,
.history-heading > p, .records-heading > p,
.organization-heading > p, .contact-intro {
font-size: 20px !important;
}
/* Founder card-news layout. */
.founder-category-grid {
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
gap: 20px !important;
}
.founder-category {
min-height: 0 !important;
padding: 24px !important;
}
.founder-category-number {
margin-bottom: 12px !important;
font-family: var(--brand-serif) !important;
font-size: 36px !important;
font-weight: 500 !important;
line-height: 1 !important;
}
.founder-category h4 {
margin-bottom: 12px !important;
font-family: var(--brand-serif) !important;
font-size: 24px !important;
font-weight: 500 !important;
}
.founder-category p {
font-size: 14px !important;
line-height: 1.43 !important;
text-align: justify !important;
}
.founder-featured-grid { grid-template-columns: repeat(3, minmax(0,1fr)) !important; }
.founder-featured-body strong {
font-family: var(--brand-serif) !important;
font-size: 21px !important;
font-weight: 500 !important;
}
.founder-featured-category,
.founder-featured-more,
.founder-blog-kicker,
.founder-blog-cta {
font-size: 17px !important;
font-weight: 500 !important;
}
/* Organization and business cards. */
.org-node h3, .business-card h3 {
font-family: var(--brand-serif) !important;
font-weight: 500 !important;
}
.business-card > span,
.identity-concept-grid article > span,
.contact-number {
font-family: var(--brand-serif) !important;
font-size: 36px !important;
font-weight: 500 !important;
}
.business-card h3 {
min-height: 0 !important;
font-size: 31px !important;
line-height: 1.35 !important;
}
.business-card p { font-size: 17px !important; }
.text-link, .book-detail-button, .book-buy-link, .button,
.record-link, .sitemap-external-link {
font-family: var(--brand-serif) !important;
font-size: 18px !important;
font-weight: 500 !important;
}
/* Books: exactly three per row, larger covers, genre band equal to cover width. */
.book-grid {
grid-template-columns: repeat(3, minmax(0,1fr)) !important;
align-items: start;
}
.book-card {
min-height: 0 !important;
padding: 34px 28px 42px !important;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
}
.book-card-topline {
width: 100% !important;
max-width: 370px !important;
min-height: 54px;
padding: 12px 18px !important;
margin: 0 auto 24px !important;
background: #081b33 !important;
color: #debc68 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
gap: 14px;
border: 1px solid rgba(222,188,104,.48);
}
.book-card-topline > span:first-child {
color: #debc68 !important;
font-family: var(--brand-serif) !important;
font-size: 26px !important;
font-weight: 500 !important;
text-align: center;
}
.book-badge {
color: #debc68 !important;
border-color: #debc68 !important;
font-size: 18px !important;
font-weight: 500 !important;
}
.english-book .book-card-topline > span:first-child,
.english-book .book-badge { font-size: 20px !important; }
.book-cover-wrap {
width: 100%;
display: flex;
justify-content: center;
margin: 0 0 24px !important;
}
.book-cover {
width: 100% !important;
max-width: 370px !important;
height: auto !important;
}
.book-card h3 {
min-height: 0 !important;
margin: 12px 0 16px !important;
font-family: var(--brand-serif) !important;
font-size: 31px !important;
font-weight: 500 !important;
line-height: 1.4 !important;
}
.book-card p {
font-size: 15px !important;
line-height: 1.5 !important;
text-align: justify !important;
}
.book-actions { justify-content: center; }
/* Records: enlarge the cover image area and the requested Naver labels. */
.record-card {
grid-template-rows: 360px 1fr !important;
min-height: 650px !important;
}
.record-card-media { padding: 18px !important; }
.record-meta {
font-size: 18px !important;
font-weight: 500 !important;
}
.record-source {
font-size: 21px !important;
font-weight: 500 !important;
}
.record-card h3 {
font-family: var(--brand-serif) !important;
font-size: 23px !important;
font-weight: 500 !important;
}
/* Careers: medium rather than bold, with enlarged key phrases. */
.careers-slogan {
font-family: var(--brand-serif) !important;
font-size: clamp(42px, 4vw, 62px) !important;
font-weight: 500 !important;
}
.careers-criteria {
font-family: var(--brand-serif) !important;
font-size: 27px !important;
font-weight: 500 !important;
}
.career-status {
font-family: var(--brand-serif) !important;
font-size: 24px !important;
font-weight: 500 !important;
}
.career-notice h3, .career-principles h3 {
font-family: var(--brand-serif) !important;
font-size: 31px !important;
font-weight: 500 !important;
}
.career-principles dt { font-weight: 500 !important; }
/* Footer: compact block, 130% sans type, 150% logo. */
.site-footer {
padding: 20px 0 12px !important;
}
.footer-top {
padding-bottom: 12px !important;
}
.footer-brand img {
width: 450px !important;
max-height: 92px !important;
object-fit: contain;
}
.footer-info {
padding: 12px 0 !important;
gap: 10px 26px !important;
font-family: var(--utility-sans) !important;
font-size: 18px !important;
}
.footer-info *,
.footer-top p,
.footer-bottom,
.footer-bottom * {
font-family: var(--utility-sans) !important;
font-weight: 500 !important;
}
.footer-top p { font-size: 18px !important; }
.footer-bottom {
padding-top: 10px !important;
font-size: 17px !important;
}
@media (max-width: 1180px) {
.brand-lockup { width: 335px; }
.brand-symbol { width: 64px !important; height: 66px !important; }
.brand-wordmark-en { max-width: 235px !important; height: 26px !important; }
.brand-wordmark-ko { max-width: 205px !important; height: 25px !important; }
.primary-nav, .primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch,
.primary-nav > .language-switch a { font-size: 16px !important; }
.founder-category-grid, .book-grid, .founder-featured-grid { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
}
@media (max-width: 760px) {
.header-inner.container { min-height: 74px !important; }
.brand-lockup { width: 270px; max-width: 74vw; }
.brand-symbol { width: 51px !important; height: 53px !important; }
.brand-wordmark-en { max-width: 190px !important; height: 22px !important; }
.brand-wordmark-ko { max-width: 165px !important; height: 21px !important; margin-left: 6px; }
.primary-nav { top: 74px !important; }
.founder-category-grid, .book-grid, .founder-featured-grid, .records-grid { grid-template-columns: 1fr !important; }
.book-card-topline, .book-cover { max-width: 340px !important; }
.record-card { grid-template-rows: 300px 1fr !important; min-height: 570px !important; }
.footer-brand img { width: min(86vw, 410px) !important; }
.footer-info { grid-template-columns: 1fr !important; }
}
/* =========================================================
v42 density reset — original typography and compact layout
2026-07-27
========================================================= */
:root {
--font-sans-original: "Noto Sans KR", Arial, sans-serif;
--font-serif-original: "Noto Serif KR", Georgia, serif;
}
/* Restore the original site typography. */
html,
body,
button,
input,
textarea,
select,
p,
li,
dd,
address,
a,
span {
font-family: var(--font-sans-original) !important;
}
h1,
h2,
h3,
h4,
h5,
h6,
.section-lead,
.contact-value,
.book-card h3,
.founder-featured-body strong,
.business-card h3,
.org-node h3,
strong,
dt {
font-family: var(--font-serif-original) !important;
}
.eyebrow,
.founder-featured-eyebrow,
.book-badge,
.pillars > article > span,
.business-card > span,
.contact-number {
font-family: Georgia, "Times New Roman", serif !important;
}
/* Return descriptions to normal left alignment. */
p,
.hero-copy,
.section-lead,
.body-copy,
.body-copy p,
.business-heading > p,
.section-heading-row > p,
.history-heading > p,
.records-heading > p,
.organization-heading > p,
.identity-heading > p,
.publication-ci-copy > p,
.contact-intro,
.business-card p,
.history-timeline p,
.record-card p,
.career-notice p,
.career-principles p,
.contact-card p,
.contact-note p,
.founder-category p,
.founder-featured-heading p,
.founder-featured-body p,
.founder-blog-card p,
.records-note,
.book-card p {
text-align: left !important;
text-justify: auto !important;
}
/* Compact header and bring the approved symbol and wordmarks together. */
.header-inner.container {
width: min(calc(100% - 48px), 1640px) !important;
min-height: 76px !important;
padding-block: 4px !important;
gap: 18px !important;
}
.brand-lockup {
width: 365px !important;
max-width: 38vw !important;
gap: 4px !important;
}
.brand-symbol {
width: 70px !important;
height: 70px !important;
}
.brand-wordmark-stack {
gap: 0 !important;
}
.brand-wordmark-en {
width: 100% !important;
max-width: 284px !important;
height: 28px !important;
}
.brand-wordmark-ko {
width: 88% !important;
max-width: 240px !important;
height: 27px !important;
margin-left: 0 !important;
}
/* Tighter navigation to remove horizontal and vertical pressure. */
.primary-nav {
gap: 14px !important;
font-size: 16px !important;
}
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch,
.primary-nav > .language-switch a {
padding-block: 20px !important;
font-family: var(--font-sans-original) !important;
font-size: 16px !important;
font-weight: 500 !important;
letter-spacing: -.02em !important;
}
.primary-nav a::after {
bottom: 13px !important;
}
.nav-dropdown-toggle span {
font-size: 10px !important;
}
.nav-submenu {
top: calc(100% - 4px) !important;
}
.nav-submenu a,
.nav-submenu button,
.nav-book-group-label,
.sitemap-heading,
.sitemap-subheading,
.sitemap-book-link,
.nav-book-link {
font-family: var(--font-sans-original) !important;
font-weight: 500 !important;
}
/* Reduce overall scroll pressure and remove excess vertical whitespace. */
.section {
padding: 84px 0 !important;
}
.hero-inner {
min-height: 520px !important;
padding: 82px 0 72px !important;
}
h1 {
margin-bottom: 24px !important;
}
h2 {
margin-bottom: 36px !important;
}
#about > .container > .eyebrow,
#founder > .container > .eyebrow,
#organization > .container > .eyebrow,
#history > .container > .eyebrow,
#identity > .container > .eyebrow,
#business > .container > .eyebrow,
#books > .container > .eyebrow,
#news-records > .container > .eyebrow,
#careers > .container > .eyebrow,
#contact > .container > .eyebrow {
margin-bottom: 22px !important;
padding: 8px 16px !important;
font-family: Georgia, "Times New Roman", serif !important;
font-size: 21px !important;
font-weight: 500 !important;
}
.about-grid {
gap: 54px !important;
}
.section-lead {
line-height: 1.8 !important;
}
.pillars article {
min-height: 220px !important;
padding: 30px 24px !important;
}
.pillars h3 {
margin: 34px 0 12px !important;
}
.section-heading-row,
.organization-heading,
.business-heading,
.history-heading,
.records-heading,
.contact-heading {
margin-bottom: 34px !important;
}
/* Compact founder role cards. */
.founder-category-grid {
gap: 16px !important;
margin: 24px 0 30px !important;
}
.founder-category {
padding: 21px 20px !important;
}
.founder-category-number {
margin-bottom: 9px !important;
}
.founder-category h4 {
margin-bottom: 9px !important;
}
/* Representative books: four in one row with consistent image frames. */
.founder-featured-works {
margin-top: 28px !important;
padding-top: 26px !important;
}
.founder-featured-heading {
margin-bottom: 18px !important;
}
.founder-featured-grid {
grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
gap: 14px !important;
}
.founder-featured-card figure {
height: 350px !important;
aspect-ratio: auto !important;
padding: 12px !important;
background: #f6f3ee !important;
}
.founder-featured-card figure img {
width: 100% !important;
height: 100% !important;
object-fit: contain !important;
}
.founder-featured-body {
padding: 16px 15px 15px !important;
}
.founder-featured-category {
margin-bottom: 7px !important;
}
.founder-featured-body strong {
margin-bottom: 9px !important;
font-size: 18px !important;
line-height: 1.45 !important;
}
.founder-featured-body p {
margin-bottom: 12px !important;
font-size: 13px !important;
line-height: 1.65 !important;
}
/* Business cards: content-driven height instead of oversized fixed boxes. */
.business-grid {
gap: 0 !important;
}
.business-card {
min-height: 0 !important;
padding: 28px 32px 30px !important;
}
.business-card > span {
font-size: 25px !important;
}
.business-card h3 {
min-height: 0 !important;
margin: 14px 0 12px !important;
font-family: var(--font-serif-original) !important;
font-size: 27px !important;
line-height: 1.35 !important;
}
.business-card p {
margin-bottom: 17px !important;
font-family: var(--font-sans-original) !important;
font-size: 15px !important;
line-height: 1.7 !important;
}
.business-card .text-link {
font-family: var(--font-sans-original) !important;
font-size: 16px !important;
font-weight: 500 !important;
}
/* Main book catalogue: keep three per row and normalize every cover frame. */
.book-grid {
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
align-items: stretch !important;
}
.book-card {
min-height: 0 !important;
padding: 26px 24px 30px !important;
}
.book-card-topline {
max-width: 310px !important;
min-height: 44px !important;
margin-bottom: 18px !important;
padding: 9px 14px !important;
}
.book-card-topline > span:first-child {
font-size: 18px !important;
}
.english-book .book-card-topline > span:first-child,
.english-book .book-badge {
font-size: 16px !important;
}
.book-cover-wrap {
height: 390px !important;
margin-bottom: 18px !important;
align-items: center !important;
}
.book-cover {
width: auto !important;
max-width: 100% !important;
height: 100% !important;
max-height: 390px !important;
object-fit: contain !important;
}
.book-card h3 {
margin: 8px 0 13px !important;
font-family: var(--font-serif-original) !important;
font-size: 26px !important;
line-height: 1.42 !important;
}
.book-card p {
font-family: var(--font-sans-original) !important;
font-size: 14px !important;
line-height: 1.65 !important;
}
/* Keep the footer compact and on the original sans typeface. */
.footer-info,
.footer-info *,
.footer-top p,
.footer-bottom,
.footer-bottom * {
font-family: var(--font-sans-original) !important;
}
@media (max-width: 1260px) {
.header-inner.container {
width: min(calc(100% - 36px), 1640px) !important;
}
.brand-lockup {
width: 315px !important;
}
.brand-symbol {
width: 60px !important;
height: 62px !important;
}
.brand-wordmark-en {
max-width: 244px !important;
height: 25px !important;
}
.brand-wordmark-ko {
max-width: 208px !important;
height: 24px !important;
}
.primary-nav {
gap: 10px !important;
}
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch,
.primary-nav > .language-switch a {
font-size: 14px !important;
}
}
@media (max-width: 1050px) {
.founder-featured-grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
.book-grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
}
@media (max-width: 760px) {
.header-inner.container {
min-height: 68px !important;
}
.brand-lockup {
width: 250px !important;
max-width: 72vw !important;
}
.brand-symbol {
width: 48px !important;
height: 50px !important;
}
.brand-wordmark-en {
max-width: 194px !important;
height: 21px !important;
}
.brand-wordmark-ko {
max-width: 168px !important;
height: 20px !important;
}
.primary-nav {
top: 68px !important;
}
.section {
padding: 66px 0 !important;
}
.founder-featured-grid,
.book-grid {
grid-template-columns: 1fr !important;
}
.founder-featured-card figure {
height: 330px !important;
}
.book-cover-wrap {
height: 350px !important;
}
.business-card {
padding: 24px 22px 26px !important;
}
}
/* =========================================================
v43 final density and footer-lockup corrections — 2026-07-27
========================================================= */
/* Narrative descriptions remain left aligned. Language-specific wrapping
is defined in the final typography rules below; do not force character-level breaks. */
.hero-copy,
.section-lead,
.body-copy,
.body-copy p,
.business-heading > p,
.section-heading-row > p,
.history-heading > p,
.records-heading > p,
.organization-heading > p,
.identity-heading > p,
.publication-ci-copy > p,
.contact-intro,
.business-card p,
.history-timeline p,
.record-card p,
.career-notice p,
.career-principles p,
.contact-card p,
.contact-note p,
.founder-category p,
.founder-featured-heading p,
.founder-featured-body p,
.founder-blog-card p,
.records-note,
.book-card p {
text-align: left !important;
text-justify: auto !important;
}
/* Keep the founder blog title on one line without crowding the card. */
.founder-blog-card {
grid-template-columns: minmax(0, 1fr) auto !important;
gap: 5px 18px !important;
padding: 20px 22px !important;
}
.founder-blog-card strong {
font-family: var(--font-sans-original) !important;
font-size: 20px !important;
font-weight: 500 !important;
white-space: nowrap !important;
}
.founder-blog-kicker,
.founder-blog-cta {
font-family: var(--font-sans-original) !important;
font-weight: 500 !important;
}
.founder-blog-card p {
font-size: 14px !important;
line-height: 1.55 !important;
}
/* Equal-height links and buttons. */
.book-actions {
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 10px !important;
width: 100% !important;
margin-top: auto !important;
}
.book-detail-button,
.book-buy-link,
.text-link {
font-family: var(--font-sans-original) !important;
font-weight: 500 !important;
}
.book-detail-button,
.book-buy-link {
min-height: 46px !important;
height: 46px !important;
padding: 8px 12px !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
line-height: 1.2 !important;
}
/* Compact card boxes and sans utility headings. */
.identity-concept-grid article,
.contact-card,
.career-notice,
.career-principles {
min-height: 0 !important;
}
.identity-concept-grid article {
padding: 26px 24px !important;
}
.contact-card {
padding: 28px 26px !important;
}
.contact-card h3 {
margin: 26px 0 12px !important;
}
.career-notice,
.career-principles {
padding: 30px 28px !important;
}
.identity-concept-grid h3,
.contact-card h3,
.career-notice h3,
.career-principles h3,
.record-card h3 {
font-family: var(--font-sans-original) !important;
font-weight: 500 !important;
}
.contact-card h3,
.career-notice h3,
.career-principles h3 {
font-size: 27px !important;
}
/* Business cards: compact leading and no artificial blank area. */
.business-card {
padding: 24px 28px 25px !important;
}
.business-card p {
margin-bottom: 14px !important;
font-size: 15px !important;
line-height: 1.55 !important;
}
.business-card .text-link {
min-height: 28px !important;
display: inline-flex !important;
align-items: center !important;
}
/* Portal and record labels enlarged while preserving density. */
.portal-search-strip {
grid-template-columns: 210px minmax(0, 1fr) !important;
gap: 18px !important;
padding: 18px 22px !important;
}
.portal-search-title {
font-family: var(--font-sans-original) !important;
font-size: 23px !important;
font-weight: 500 !important;
}
.portal-search-links a {
min-height: 42px !important;
padding: 9px 13px !important;
font-family: var(--font-sans-original) !important;
font-size: 17px !important;
font-weight: 500 !important;
}
.record-meta {
font-family: var(--font-sans-original) !important;
font-size: 17px !important;
font-weight: 500 !important;
}
.record-source {
font-family: var(--font-sans-original) !important;
font-size: 18px !important;
font-weight: 500 !important;
}
.records-note {
font-size: 17px !important;
line-height: 1.55 !important;
}
.record-card h3 {
font-size: 21px !important;
line-height: 1.38 !important;
}
.record-card p {
font-size: 14px !important;
line-height: 1.6 !important;
}
/* Footer uses the same close symbol/wordmark construction as the header. */
.footer-top {
gap: 22px !important;
}
.footer-brand {
display: inline-flex !important;
align-items: center !important;
flex: 0 0 auto !important;
}
.footer-brand-lockup {
display: inline-flex !important;
align-items: center !important;
gap: 6px !important;
width: 350px !important;
max-width: 42vw !important;
}
.footer-brand-symbol {
width: 68px !important;
height: 70px !important;
object-fit: contain !important;
flex: 0 0 auto !important;
}
.footer-brand-wordmark-stack {
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
gap: 0 !important;
min-width: 0 !important;
}
.footer-brand-wordmark-en {
width: 270px !important;
max-width: 100% !important;
height: 27px !important;
object-fit: contain !important;
object-position: left center !important;
}
.footer-brand-wordmark-ko {
width: 230px !important;
max-width: 88% !important;
height: 26px !important;
margin-left: 0 !important;
object-fit: contain !important;
object-position: left center !important;
}
.footer-brand > img {
display: none !important;
}
.footer-top p {
font-family: var(--font-sans-original) !important;
font-size: 16px !important;
font-weight: 500 !important;
}
@media (max-width: 1180px) {
.footer-brand-lockup {
width: 300px !important;
}
.footer-brand-symbol {
width: 58px !important;
height: 60px !important;
}
.footer-brand-wordmark-en {
width: 232px !important;
height: 24px !important;
}
.footer-brand-wordmark-ko {
width: 198px !important;
height: 23px !important;
}
}
@media (max-width: 760px) {
.founder-blog-card strong {
white-space: normal !important;
}
.book-actions {
grid-template-columns: 1fr !important;
}
.portal-search-strip {
grid-template-columns: 1fr !important;
}
.footer-brand-lockup {
width: min(86vw, 310px) !important;
max-width: none !important;
}
.footer-brand-symbol {
width: 58px !important;
height: 60px !important;
}
.footer-brand-wordmark-en {
width: 235px !important;
}
.footer-brand-wordmark-ko {
width: 200px !important;
}
}
/* =========================================================
v44 official lockup density correction — 2026-07-27
Use the approved complete logo artwork so the symbol and both
wordmarks retain the exact official spacing and proportions.
========================================================= */
.brand,
.footer-brand {
display: inline-flex !important;
align-items: center !important;
flex: 0 0 auto !important;
}
.official-header-lockup,
.official-footer-lockup {
display: block !important;
width: auto !important;
object-fit: contain !important;
object-position: left center !important;
filter: none !important;
mix-blend-mode: normal !important;
}
.official-header-lockup {
height: 64px !important;
max-width: 330px !important;
}
.official-footer-lockup {
height: 64px !important;
max-width: 330px !important;
}
/* Retire the reconstructed component lockups. */
.brand-lockup,
.footer-brand-lockup,
.brand-symbol,
.brand-wordmark-stack,
.brand-wordmark-en,
.brand-wordmark-ko,
.footer-brand-symbol,
.footer-brand-wordmark-stack,
.footer-brand-wordmark-en,
.footer-brand-wordmark-ko {
display: none !important;
}
@media (max-width: 1180px) {
.official-header-lockup,
.official-footer-lockup {
height: 58px !important;
max-width: 300px !important;
}
}
@media (max-width: 760px) {
.official-header-lockup,
.official-footer-lockup {
width: min(78vw, 285px) !important;
height: auto !important;
max-width: none !important;
}
}
/* =========================================================
v46 primary navigation enlargement — 2026-07-27
Desktop top-level menu is 200% of the v45 16px size.
========================================================= */
@media (min-width: 1401px) {
.primary-nav {
gap: 18px !important;
font-size: 32px !important;
}
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch,
.primary-nav > .language-switch a {
font-size: 32px !important;
font-weight: 500 !important;
line-height: 1.1 !important;
letter-spacing: -.035em !important;
white-space: nowrap !important;
}
.nav-dropdown-toggle span,
.language-divider {
font-size: 16px !important;
}
}
@media (min-width: 1181px) and (max-width: 1400px) {
.primary-nav {
gap: 12px !important;
font-size: 23px !important;
}
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch,
.primary-nav > .language-switch a {
font-size: 23px !important;
white-space: nowrap !important;
}
}
/* =========================================================
v47 descriptive-copy typography and line-break rules
All narrative copy uses the original sans family. Korean words remain
intact; spacing is never stretched to imitate full justification.
========================================================= */
:where(
.hero-copy,
.section-lead,
.body-copy,
.body-copy p,
.about-copy,
.pillars p,
.founder-position,
.founder-category p,
.founder-featured-heading p,
.founder-featured-body p,
.founder-blog-card p,
.organization-heading > p,
.org-node p,
.history-heading > p,
.history-timeline p,
.identity-heading > p,
.identity-concept-grid p,
.publication-ci-copy > p,
.identity-small-note,
.business-heading > p,
.business-card p,
.section-heading-row > p,
.book-card p,
.book-dialog p:not(.eyebrow):not(.book-dialog-lead),
.book-dialog dd,
.records-heading > p,
.record-card p,
.records-note,
.career-notice p,
.career-principles p,
.career-principles dd,
.contact-intro,
.contact-card p,
.contact-note p,
.footer-top p,
.footer-info,
main li,
main dd,
main address
) {
font-family: var(--font-sans-original) !important;
text-align: left !important;
text-justify: auto !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
hyphens: none !important;
word-spacing: normal !important;
letter-spacing: normal !important;
}
/* Long technical tokens and addresses may wrap only when they cannot fit. */
.email-value,
.contact-value a,
.footer-info a {
overflow-wrap: anywhere !important;
word-break: normal !important;
}
/* Maintain compact, readable leading without forced spacing. */
:where(
.hero-copy,
.section-lead,
.business-heading > p,
.section-heading-row > p,
.records-heading > p,
.organization-heading > p,
.history-heading > p,
.identity-heading > p,
.contact-intro
) {
line-height: 1.62 !important;
}
:where(
.founder-category p,
.founder-featured-body p,
.business-card p,
.book-card p,
.record-card p,
.career-notice p,
.career-principles p,
.contact-card p,
.history-timeline p,
.identity-concept-grid p
) {
line-height: 1.58 !important;
}
/* =========================================================
v48 label legibility update — 2026-07-27
Beige background + gold text had low contrast.
Section eyebrow labels now use archive navy and sans-serif.
========================================================= */
.eyebrow,
#about > .container > .eyebrow,
#founder > .container > .eyebrow,
#organization > .container > .eyebrow,
#history > .container > .eyebrow,
#identity > .container > .eyebrow,
#business > .container > .eyebrow,
#books > .container > .eyebrow,
#news-records > .container > .eyebrow,
#careers > .container > .eyebrow,
#contact > .container > .eyebrow {
color: var(--archive-navy, #081B33) !important;
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-weight: 500 !important;
letter-spacing: 0.08em !important;
}
/* =========================================================
v48 careers simplification + hero label correction
========================================================= */
.hero .eyebrow {
color: var(--navy) !important;
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-weight: 600 !important;
letter-spacing: .12em !important;
}
.careers-section .careers-inner {
text-align: left;
}
.careers-section .careers-slogan {
margin: 20px 0 12px !important;
max-width: none !important;
color: var(--gold) !important;
font-family: "Noto Serif KR", Georgia, serif !important;
font-size: clamp(24px, 2.35vw, 40px) !important;
font-weight: 500 !important;
line-height: 1.25 !important;
letter-spacing: -.035em !important;
white-space: nowrap;
}
.careers-section .careers-criteria {
margin: 0 !important;
}
.careers-section .careers-grid {
display: none !important;
}
@media (max-width: 1100px) {
.careers-section .careers-slogan {
font-size: clamp(20px, 3vw, 30px) !important;
}
}
@media (max-width: 760px) {
.careers-section .careers-slogan {
white-space: normal;
font-size: 24px !important;
}
}
/* =========================================================
v52 — selected works and author-card refinement
========================================================= */
.founder-featured-eyebrow {
font-size: 2em !important;
line-height: 1.2 !important;
}
html[lang="ko"] .founder-category:nth-child(2) p {
font-family: var(--font-sans-original) !important;
font-size: 12px !important;
font-weight: 400 !important;
line-height: 1.35 !important;
letter-spacing: -0.025em !important;
white-space: nowrap !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
}
@media (max-width: 1280px) {
html[lang="ko"] .founder-category:nth-child(2) p {
white-space: normal !important;
font-size: 13px !important;
}
}
/* =========================================================
v53 — founder descriptions standardized to six lines
========================================================= */
.founder-category {
min-height: 258px !important;
}
.founder-category p.founder-six-lines {
min-height: 9.12em !important;
margin: 0 !important;
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-size: 12px !important;
font-weight: 400 !important;
line-height: 1.52 !important;
letter-spacing: -0.015em !important;
text-align: left !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
white-space: normal !important;
}
.founder-category p.founder-six-lines .founder-desc-line {
display: block;
white-space: nowrap;
word-break: keep-all;
overflow-wrap: normal;
}
html[lang="en"] .founder-category p.founder-six-lines {
font-size: 11.5px !important;
letter-spacing: -0.01em !important;
}
@media (max-width: 1280px) {
.founder-category {
min-height: 250px !important;
}
.founder-category p.founder-six-lines {
font-size: 12px !important;
}
}
@media (max-width: 760px) {
.founder-category {
min-height: 0 !important;
}
.founder-category p.founder-six-lines {
min-height: 0 !important;
font-size: 13px !important;
}
.founder-category p.founder-six-lines .founder-desc-line {
white-space: normal;
}
}
/* =========================================================
v54 — selected works summary: sans-serif and single line
========================================================= */
html[lang="ko"] .founder-featured-heading {
grid-template-columns: minmax(150px, .32fr) minmax(0, 1.68fr) !important;
column-gap: 24px !important;
}
html[lang="ko"] .founder-featured-summary {
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-size: 14px !important;
font-weight: 400 !important;
line-height: 1.45 !important;
letter-spacing: -0.035em !important;
white-space: nowrap !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
}
@media (max-width: 980px) {
html[lang="ko"] .founder-featured-heading {
grid-template-columns: 1fr !important;
}
html[lang="ko"] .founder-featured-summary {
white-space: normal !important;
}
}
/* =========================================================
v55 — representative cover size normalization
========================================================= */
.founder-featured-grid .founder-featured-card figure {
height: 350px !important;
padding: 12px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
overflow: hidden !important;
}
.founder-featured-grid .founder-featured-card figure img {
display: block !important;
width: auto !important;
height: 100% !important;
max-width: 100% !important;
object-fit: contain !important;
}
/* =========================================================
v56 — representative works category labels in sans-serif
========================================================= */
.founder-featured-category {
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-weight: 400 !important;
letter-spacing: -0.02em !important;
}
html[lang="en"] .founder-featured-category {
font-family: "Noto Sans KR", Arial, sans-serif !important;
}
/* =========================================================
v57 — representative works descriptions in sans-serif
========================================================= */
.founder-featured-body p {
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-weight: 400 !important;
letter-spacing: -0.02em !important;
}
html[lang="en"] .founder-featured-body p {
font-family: "Noto Sans KR", Arial, sans-serif !important;
}
/* =========================================================
v58 — founder blog description in sans-serif
========================================================= */
.founder-blog-card p {
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-weight: 400 !important;
letter-spacing: -0.02em !important;
}
html[lang="en"] .founder-blog-card p {
font-family: "Noto Sans KR", Arial, sans-serif !important;
}
/* =========================================================
v59 — CI intro description in sans-serif
========================================================= */
.identity-heading > p {
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-weight: 400 !important;
letter-spacing: -0.02em !important;
}
html[lang="en"] .identity-heading > p {
font-family: "Noto Sans KR", Arial, sans-serif !important;
}
/* =========================================================
v60 — organization chart typography in sans-serif
========================================================= */
.org-chart-simple .org-top,
.org-chart-simple .org-top *,
.org-node.org-simple-top,
.org-node.org-simple-top *,
.org-node.org-simple-dept,
.org-node.org-simple-dept *,
.organization-section .org-node,
.organization-section .org-node *,
.organization-section .org-branch,
.organization-section .org-branch * {
font-family: "Noto Sans KR", Arial, sans-serif !important;
}
.organization-section .org-node h3,
.organization-section .org-top h3,
.organization-section .org-branch h3,
.organization-section .org-simple-top h3,
.organization-section .org-simple-dept h3 {
font-weight: 700 !important;
}
.organization-section .org-node p,
.organization-section .org-top p,
.organization-section .org-branch p,
.organization-section .org-simple-top p,
.organization-section .org-simple-dept p,
.organization-section .org-node span,
.organization-section .org-top span,
.organization-section .org-branch span,
.organization-section .org-simple-top span,
.organization-section .org-simple-dept span {
font-weight: 400 !important;
letter-spacing: -0.02em !important;
}
/* =========================================================
v61 — history timeline title and description in sans-serif
========================================================= */
.history-timeline h3,
.history-timeline p {
font-family: "Noto Sans KR", Arial, sans-serif !important;
letter-spacing: -0.02em !important;
}
.history-timeline h3 {
font-weight: 700 !important;
}
.history-timeline p {
font-weight: 400 !important;
}
html[lang="en"] .history-timeline h3,
html[lang="en"] .history-timeline p {
font-family: "Noto Sans KR", Arial, sans-serif !important;
}
/* =========================================================
v62 — CI descriptive texts in sans-serif
========================================================= */
.identity-heading > p,
.identity-logo-card > p,
.identity-concept-grid p {
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-weight: 400 !important;
letter-spacing: -0.02em !important;
}
html[lang="en"] .identity-heading > p,
html[lang="en"] .identity-logo-card > p,
html[lang="en"] .identity-concept-grid p {
font-family: "Noto Sans KR", Arial, sans-serif !important;
}
/* =========================================================
v63 — CI concept-card headings in sans-serif
========================================================= */
.identity-concept-grid h3 {
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-weight: 700 !important;
letter-spacing: -0.02em !important;
}
html[lang="en"] .identity-concept-grid h3 {
font-family: "Noto Sans KR", Arial, sans-serif !important;
}
/* =========================================================
v64 — publication standard section typography in sans-serif
========================================================= */
.publication-ci-copy h3,
.publication-ci-copy p,
.publication-ci-copy li {
font-family: "Noto Sans KR", Arial, sans-serif !important;
letter-spacing: -0.02em !important;
}
.publication-ci-copy h3 {
font-weight: 700 !important;
}
.publication-ci-copy p,
.publication-ci-copy li {
font-weight: 400 !important;
}
html[lang="en"] .publication-ci-copy h3,
html[lang="en"] .publication-ci-copy p,
html[lang="en"] .publication-ci-copy li {
font-family: "Noto Sans KR", Arial, sans-serif !important;
}
/* =========================================================
v65 — identity small note in sans-serif
========================================================= */
.identity-small-note {
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-weight: 400 !important;
letter-spacing: -0.02em !important;
}
html[lang="en"] .identity-small-note {
font-family: "Noto Sans KR", Arial, sans-serif !important;
}
/* =========================================================
v66 — official file list items in sans-serif
========================================================= */
.identity-usage li {
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-weight: 400 !important;
letter-spacing: -0.02em !important;
}
html[lang="en"] .identity-usage li {
font-family: "Noto Sans KR", Arial, sans-serif !important;
}
/* =========================================================
v67 — record card descriptions in sans-serif
========================================================= */
.record-card-body p {
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-weight: 400 !important;
letter-spacing: -0.02em !important;
}
html[lang="en"] .record-card-body p {
font-family: "Noto Sans KR", Arial, sans-serif !important;
}
/* =========================================================
v68 — careers slogan split into two fixed sentence lines
========================================================= */
.careers-section .careers-slogan {
white-space: normal !important;
}
.careers-section .careers-slogan .slogan-line {
display: block;
white-space: nowrap;
}
@media (max-width: 760px) {
.careers-section .careers-slogan .slogan-line {
white-space: normal;
}
}
/* =========================================================
v70 — careers criteria in sans-serif with middle dots
========================================================= */
.careers-criteria,
.careers-section .careers-criteria {
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-weight: 500 !important;
letter-spacing: -0.01em !important;
}
/* =========================================================
v71 — careers panel typography and CTA fallback rules
========================================================= */
.careers-section .career-status {
display: none !important;
}
.careers-section h2,
.careers-section h3,
.careers-section h4 {
font-family: "Noto Serif KR", Georgia, serif !important;
}
.careers-section p,
.careers-section li,
.careers-section dt,
.careers-section dd,
.careers-section button,
.careers-section a {
font-family: "Noto Sans KR", Arial, sans-serif !important;
}
.careers-section .career-notice a,
.careers-section .career-notice button {
pointer-events: none;
cursor: default;
text-decoration: none;
}
/* =========================================================
v72 — contact introduction and inquiry note in sans-serif
========================================================= */
.contact-intro,
.contact-intro p,
.contact-note,
.contact-note p,
.contact-note strong {
font-family: "Noto Sans KR", Arial, sans-serif !important;
letter-spacing: -0.02em !important;
}
.contact-intro p,
.contact-note p {
font-weight: 400 !important;
}
.contact-note strong {
font-weight: 700 !important;
}
html[lang="en"] .contact-intro,
html[lang="en"] .contact-intro p,
html[lang="en"] .contact-note,
html[lang="en"] .contact-note p,
html[lang="en"] .contact-note strong {
font-family: "Noto Sans KR", Arial, sans-serif !important;
}
/* =========================================================
v73 — contact card description heights aligned
========================================================= */
.contact-grid {
align-items: stretch !important;
}
.contact-card {
display: flex !important;
flex-direction: column !important;
}
.contact-card .contact-value {
min-height: 2.6em !important;
display: flex !important;
align-items: flex-start !important;
}
.contact-card p {
min-height: 3.2em !important;
margin-bottom: 0 !important;
}
/* =========================================================
v74 — header menu size reduced to about 60%
========================================================= */
.primary-nav {
font-size: 14px !important;
gap: 16px !important;
}
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch,
.primary-nav > .language-switch a {
font-size: 14px !important;
}
.nav-dropdown-toggle span,
.language-divider {
font-size: 10px !important;
}
@media (max-width: 1280px) {
.primary-nav {
font-size: 13px !important;
gap: 14px !important;
}
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch,
.primary-nav > .language-switch a {
font-size: 13px !important;
}
}
@media (max-width: 900px) {
.primary-nav {
font-size: 12px !important;
gap: 10px !important;
}
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch,
.primary-nav > .language-switch a {
font-size: 12px !important;
}
}
/* =========================================================
v75 — restore visible section menu labels
Navy background + gold text for all section eyebrow labels.
========================================================= */
#about > .container > .eyebrow,
#founder > .container > .eyebrow,
#organization > .container > .eyebrow,
#history > .container > .eyebrow,
#identity > .container > .eyebrow,
#business > .container > .eyebrow,
#books > .container > .eyebrow,
#news-records > .container > .eyebrow,
#careers > .container > .eyebrow,
#contact > .container > .eyebrow {
background: #081b33 !important;
color: #debc68 !important;
border: 1px solid rgba(222, 188, 104, 0.65) !important;
display: inline-flex !important;
align-items: center !important;
}
/* =========================================================
v76 final consolidation
========================================================= */
/* Header and footer use the same exact official assets, closely packed. */
.brand-lockup-final {
display: inline-flex !important;
align-items: center !important;
gap: 2px !important;
width: 318px !important;
height: 66px !important;
overflow: visible !important;
}
.brand-lockup-final-symbol {
display: block !important;
width: 68px !important;
height: 66px !important;
flex: 0 0 68px !important;
object-fit: contain !important;
}
.brand-lockup-final-words {
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
gap: 0 !important;
width: 248px !important;
min-width: 0 !important;
margin-left: -1px !important;
}
.brand-lockup-final-en,
.brand-lockup-final-ko {
display: block !important;
object-fit: contain !important;
object-position: left center !important;
}
.brand-lockup-final-en {
width: 248px !important;
height: 27px !important;
}
.brand-lockup-final-ko {
width: 218px !important;
height: 27px !important;
margin-top: -2px !important;
margin-left: 7px !important;
}
.official-header-lockup,
.official-footer-lockup,
.brand-lockup,
.footer-brand-lockup { display: none !important; }
.brand,
.footer-brand {
width: 318px !important;
max-width: 318px !important;
overflow: visible !important;
}
.footer-top { overflow: visible !important; }
/* Company overview: numbers match founder-card scale; all card text is sans-serif. */
.pillars article,
.pillars article span,
.pillars article h3,
.pillars article p {
font-family: "Noto Sans KR", Arial, sans-serif !important;
}
.pillars > article > span {
font-size: 36px !important;
line-height: 1 !important;
font-weight: 600 !important;
letter-spacing: .03em !important;
color: #d6aa46 !important;
}
.pillars h3 {
margin-top: 20px !important;
font-weight: 600 !important;
color: #111 !important;
}
.pillars p {
font-weight: 400 !important;
color: #3f3f3f !important;
}
/* Founder role descriptions remain readable and darker. */
.founder-category p,
.founder-desc-line {
font-family: "Noto Sans KR", Arial, sans-serif !important;
color: #424242 !important;
font-weight: 400 !important;
}
/* Book catalogue: reduce all title sizes to 80%, darken, and align description starts. */
.book-card h3 {
width: 100% !important;
min-height: 5.4em !important;
margin: 8px 0 12px !important;
font-size: 21px !important;
line-height: 1.35 !important;
font-weight: 600 !important;
color: #111 !important;
display: flex !important;
align-items: flex-start !important;
justify-content: center !important;
}
.book-card p {
width: 100% !important;
min-height: 5.2em !important;
margin-top: 0 !important;
color: #3f3f3f !important;
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-weight: 400 !important;
}
.book-actions { margin-top: auto !important; }
.book-card-topline,
.book-card-topline *,
.book-actions,
.book-actions * {
font-family: "Noto Sans KR", Arial, sans-serif !important;
}
/* Representative works: title reduced to 80%; descriptions begin at the same height. */
.founder-featured-card { display: flex !important; flex-direction: column !important; }
.founder-featured-body { display: flex !important; flex: 1 1 auto !important; flex-direction: column !important; }
.founder-featured-body strong {
min-height: 4.4em !important;
font-size: 15px !important;
line-height: 1.45 !important;
font-weight: 600 !important;
color: #111 !important;
}
.founder-featured-body p {
min-height: 5.2em !important;
color: #3f3f3f !important;
}
.founder-featured-more { margin-top: auto !important; }
/* Contact card text starts on a common horizontal line. */
.contact-card h3 { min-height: 1.55em !important; }
.contact-card .contact-value {
height: 2.8em !important;
min-height: 2.8em !important;
margin-bottom: 12px !important;
}
.contact-card p {
min-height: 3.2em !important;
margin-top: 0 !important;
}
/* Careers title matches the header item; title uses serif, body uses sans. */
.careers-section #careers-title {
font-family: "Noto Serif KR", Georgia, serif !important;
}
.careers-section p,
.careers-section li,
.careers-section dt,
.careers-section dd {
font-family: "Noto Sans KR", Arial, sans-serif !important;
}
/* Publication standard is a subsection label, not a top-menu title. */
.subsection-label {
margin: 0 0 18px !important;
color: #debc68 !important;
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-size: 15px !important;
font-weight: 600 !important;
letter-spacing: .08em !important;
}
@media (max-width: 1180px) {
.brand-lockup-final,
.brand,
.footer-brand { width: 286px !important; max-width: 286px !important; }
.brand-lockup-final-symbol { width: 61px !important; height: 60px !important; flex-basis: 61px !important; }
.brand-lockup-final-words { width: 223px !important; }
.brand-lockup-final-en { width: 223px !important; height: 25px !important; }
.brand-lockup-final-ko { width: 197px !important; height: 25px !important; }
}
@media (max-width: 760px) {
.brand-lockup-final,
.brand,
.footer-brand { width: min(78vw, 270px) !important; max-width: none !important; }
.brand-lockup-final { height: 58px !important; }
.brand-lockup-final-symbol { width: 58px !important; height: 58px !important; flex-basis: 58px !important; }
.brand-lockup-final-words { width: calc(100% - 60px) !important; }
.brand-lockup-final-en { width: 100% !important; height: 23px !important; }
.brand-lockup-final-ko { width: 88% !important; height: 23px !important; }
.book-card h3,
.book-card p,
.founder-featured-body strong,
.founder-featured-body p { min-height: 0 !important; }
}
/* =========================================================
v77 — remove hero CTA boxes and use sans-serif hero copy
========================================================= */
.hero-copy {
font-family: "Noto Sans KR", Arial, sans-serif !important;
}
.hero-actions {
display: none !important;
}
/* =========================================================
v78 — header menu increased to about 130%
========================================================= */
.primary-nav {
font-size: 18px !important;
gap: 20px !important;
}
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch,
.primary-nav > .language-switch a {
font-size: 18px !important;
}
.nav-dropdown-toggle span,
.language-divider {
font-size: 12px !important;
}
@media (max-width: 1280px) {
.primary-nav {
font-size: 17px !important;
gap: 18px !important;
}
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch,
.primary-nav > .language-switch a {
font-size: 17px !important;
}
}
@media (max-width: 900px) {
.primary-nav {
font-size: 15px !important;
gap: 12px !important;
}
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch,
.primary-nav > .language-switch a {
font-size: 15px !important;
}
}
/* =========================================================
v79 — sans-serif descriptive copy + move intro above founder panel
========================================================= */
.section-lead,
.founder-position,
.founder-featured-heading p,
.founder-intro-copy {
font-family: "Noto Sans KR", Arial, sans-serif !important;
}
.founder-intro-copy {
margin: 0 0 18px;
color: var(--muted);
font-size: 17px;
line-height: 1.9;
}
/* =========================================================
v80 — featured works summary forced to sans-serif
========================================================= */
#founder-featured-works .founder-featured-heading > p,
html[lang="ko"] #founder-featured-works .founder-featured-heading > p {
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-weight: 400 !important;
letter-spacing: -0.02em !important;
}
/* v81 about-section refinement: denser company overview */
.about-grid {
grid-template-columns: minmax(280px, 0.72fr) minmax(760px, 1.48fr) !important;
gap: 34px !important;
align-items: stretch !important;
}
.section-lead {
max-width: none !important;
font-size: 23px !important;
line-height: 1.9 !important;
margin: 0 !important;
align-self: stretch !important;
}
.pillars {
width: 100% !important;
}
.pillars article {
min-height: 290px !important;
padding: 34px 26px !important;
}
.pillars h3 {
margin: 22px 0 14px !important;
font-size: 26px !important;
}
.pillars p {
font-size: 18px !important;
line-height: 1.8 !important;
}
@media (max-width: 1100px) {
.about-grid {
grid-template-columns: 1fr !important;
}
.section-lead {
font-size: 20px !important;
}
.pillars article {
min-height: 0 !important;
}
}
/* v83 English book fixes */
.english-book .book-cover-wrap { height: 390px !important; display:flex !important; align-items:center !important; justify-content:center !important; }
.english-book .book-cover { width:auto !important; height:100% !important; max-height:390px !important; max-width:100% !important; object-fit:contain !important; }
.english-book h3, .english-book p, .english-book .book-card-topline, .english-book .book-card-topline *, .english-book .book-detail-button, .english-book .book-buy-link { word-break: normal !important; overflow-wrap: normal !important; hyphens: none !important; white-space: normal !important; }
.english-book p { text-align:left !important; line-height:1.7 !important; }
.english-book h3 { font-size: 23px !important; line-height:1.45 !important; }
.english-book .book-card-topline > span:first-child { font-size: 18px !important; }
.english-book .book-badge { font-size: 18px !important; }
/* v84 — prevent mid-word English breaks across the site */
:where(
main p,
main li,
main dd,
main dt,
main blockquote,
main figcaption,
.section-lead,
.hero-copy,
.organization-heading > p,
.identity-heading > p,
.publication-ci-copy > p,
.contact-intro,
.business-card p,
.history-timeline p,
.record-card p,
.career-notice p,
.career-principles p,
.contact-card p,
.contact-note p,
.founder-category p,
.founder-featured-heading p,
.founder-featured-body p,
.founder-blog-card p,
.records-note,
.book-card p,
.book-dialog p,
.footer-top p,
.footer-info,
.footer-info span,
.footer-bottom p,
.footer-bottom span
) {
word-break: keep-all !important;
overflow-wrap: normal !important;
hyphens: none !important;
white-space: normal !important;
word-spacing: normal !important;
letter-spacing: normal !important;
}
/* Keep contact tokens and URLs readable while still avoiding ugly splits whenever possible. */
:where(.email-value, .contact-value a, .footer-info a, .record-search-bar a, .record-search-bar button) {
word-break: keep-all !important;
overflow-wrap: normal !important;
hyphens: none !important;
}
/* v85 — visually center header/footer wordmarks relative to the symbol */
.brand,
.footer-brand {
display: inline-flex !important;
align-items: center !important;
}
.brand-lockup-final {
align-items: center !important;
}
.brand-lockup-final-words {
align-self: center !important;
position: relative !important;
top: 2px !important;
}
.brand-lockup-final-en,
.brand-lockup-final-ko {
vertical-align: middle !important;
}
@media (max-width: 760px) {
.brand-lockup-final-words { top: 1px !important; }
}
/* =========================================================
v86 — contact card typography and baseline alignment
========================================================= */
.contact-card h3 {
font-family: "Noto Serif KR", Georgia, serif !important;
font-weight: 500 !important;
min-height: 1.6em !important;
margin: 26px 0 12px !important;
}
.contact-card .contact-value,
.contact-card address.contact-value,
.contact-card a.contact-value {
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-weight: 500 !important;
height: 2.8em !important;
min-height: 2.8em !important;
margin: 0 0 12px !important;
display: flex !important;
align-items: flex-start !important;
line-height: 1.45 !important;
}
.contact-card p {
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-weight: 400 !important;
min-height: 3.2em !important;
margin: 0 !important;
line-height: 1.6 !important;
}
.contact-grid {
align-items: stretch !important;
}
.contact-card {
display: flex !important;
flex-direction: column !important;
align-items: flex-start !important;
}
@media (max-width: 760px) {
.contact-card h3,
.contact-card .contact-value,
.contact-card p {
min-height: 0 !important;
height: auto !important;
}
}
/* =========================================================
v87 — protect English words from mid-word line breaks
========================================================= */
.latin-word,
.nowrap-token {
display: inline-block;
white-space: nowrap !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
hyphens: none !important;
}
/* Descriptive copy wraps only between complete words. */
:where(
body,
main,
main p,
main li,
main dd,
main dt,
main address,
main figcaption,
.hero-copy,
.section-lead,
.records-heading p,
.records-note,
.record-card p,
.business-card p,
.book-card p,
.book-dialog p,
.contact-intro,
.contact-card p,
.contact-note p,
.footer-info,
.footer-top p,
.footer-bottom
) {
word-break: keep-all !important;
overflow-wrap: normal !important;
hyphens: none !important;
}
/* =========================================================
v88 — widen business and books dropdown menus
========================================================= */
#business-submenu {
width: 380px !important;
max-width: calc(100vw - 32px) !important;
padding: 12px 0 !important;
}
#business-submenu a {
padding: 11px 20px !important;
white-space: normal !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
hyphens: none !important;
line-height: 1.55 !important;
}
#books-submenu,
.nav-books-submenu {
width: 620px !important;
max-width: calc(100vw - 32px) !important;
padding: 14px !important;
overflow-x: hidden !important;
}
#books-submenu .nav-book-link,
.nav-books-submenu .nav-book-link {
padding: 10px 14px !important;
white-space: normal !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
hyphens: none !important;
line-height: 1.5 !important;
}
/* Keep long English titles intact and move complete words to the next line. */
html[lang="en"] #business-submenu a,
html[lang="en"] #books-submenu .nav-book-link,
html[lang="en"] .nav-books-submenu .nav-book-link {
word-break: normal !important;
overflow-wrap: normal !important;
hyphens: none !important;
}
@media (max-width: 900px) {
#business-submenu,
#books-submenu,
.nav-books-submenu {
width: 100% !important;
max-width: none !important;
}
}
/* =========================================================
v89 — stable complete-menu layout and matching menu typography
========================================================= */
.nav-sitemap-menu {
box-sizing: border-box !important;
width: min(1120px, calc(100vw - 24px)) !important;
max-width: calc(100vw - 24px) !important;
padding: 22px 18px !important;
grid-template-columns: 115px 155px minmax(455px, 1fr) 125px !important;
gap: 14px !important;
overflow-x: hidden !important;
overflow-y: auto !important;
}
.nav-sitemap-menu .sitemap-section {
min-width: 0 !important;
padding-right: 14px !important;
}
.nav-sitemap-menu .sitemap-section:last-child {
padding-right: 0 !important;
}
.nav-sitemap-menu,
.nav-sitemap-menu *,
.nav-books-submenu,
.nav-books-submenu *,
#business-submenu,
#business-submenu * {
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-style: normal !important;
}
.nav-sitemap-menu .sitemap-heading,
.nav-sitemap-menu .sitemap-subheading,
.nav-sitemap-menu a,
.nav-sitemap-menu button,
.nav-books-submenu .nav-book-link,
#business-submenu a {
font-family: "Noto Sans KR", Arial, sans-serif !important;
}
.nav-sitemap-menu .sitemap-heading {
font-size: 12px !important;
font-weight: 700 !important;
line-height: 1.4 !important;
}
.nav-sitemap-menu .sitemap-subheading {
font-size: 11px !important;
font-weight: 600 !important;
line-height: 1.4 !important;
}
.primary-nav .nav-sitemap-menu a,
.primary-nav .nav-sitemap-menu button,
.nav-sitemap-menu .sitemap-book-link {
box-sizing: border-box !important;
width: 100% !important;
max-width: 100% !important;
padding: 7px 0 !important;
font-size: 13px !important;
font-weight: 600 !important;
line-height: 1.38 !important;
text-align: left !important;
white-space: normal !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
hyphens: none !important;
}
.sitemap-book-groups {
min-width: 0 !important;
grid-template-columns: minmax(0, 1.42fr) minmax(0, 1fr) !important;
gap: 14px !important;
}
.sitemap-book-group {
min-width: 0 !important;
overflow: hidden !important;
}
.menu-title-line {
display: block !important;
max-width: 100% !important;
white-space: nowrap !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
hyphens: none !important;
}
/* The ordinary books dropdown uses the same Korean-compatible menu face. */
#books-submenu .nav-book-link,
.nav-books-submenu .nav-book-link {
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-size: 14px !important;
font-weight: 500 !important;
line-height: 1.45 !important;
}
/* Keep the last column isolated from the English-book column. */
.nav-sitemap-menu .sitemap-section:last-child a {
display: block !important;
max-width: 100% !important;
font-size: 13px !important;
line-height: 1.45 !important;
}
@media (max-width: 1050px) and (min-width: 741px) {
.nav-sitemap-menu {
width: min(980px, calc(100vw - 20px)) !important;
grid-template-columns: 105px 145px minmax(420px, 1fr) 110px !important;
gap: 12px !important;
padding: 20px 14px !important;
}
.primary-nav .nav-sitemap-menu a,
.primary-nav .nav-sitemap-menu button,
.nav-sitemap-menu .sitemap-book-link {
font-size: 12.5px !important;
}
}
@media (max-width: 900px) and (min-width: 741px) {
.nav-sitemap-menu {
grid-template-columns: 110px 145px minmax(390px, 1fr) !important;
}
.nav-sitemap-menu .sitemap-section:last-child {
grid-column: 1 / -1 !important;
display: flex !important;
flex-wrap: wrap !important;
gap: 8px 22px !important;
padding-top: 14px !important;
border-top: 1px solid rgba(222,188,104,.22) !important;
}
.nav-sitemap-menu .sitemap-section:last-child .sitemap-heading {
flex-basis: 100% !important;
}
.nav-sitemap-menu .sitemap-section:last-child a {
width: auto !important;
}
}
@media (max-width: 740px) {
.nav-sitemap-menu {
width: 100% !important;
max-width: 100% !important;
grid-template-columns: 1fr !important;
overflow-x: hidden !important;
}
.sitemap-book-groups {
grid-template-columns: 1fr !important;
}
.menu-title-line {
white-space: normal !important;
}
}
/* =========================================================
v90 — strengthen all English text inside navy/gold menu boxes
========================================================= */
.eyebrow,
#about > .container > .eyebrow,
#founder > .container > .eyebrow,
#organization > .container > .eyebrow,
#history > .container > .eyebrow,
#identity > .container > .eyebrow,
#business > .container > .eyebrow,
#books > .container > .eyebrow,
#news-records > .container > .eyebrow,
#careers > .container > .eyebrow,
#contact > .container > .eyebrow,
.hero .eyebrow,
.founder-featured-eyebrow,
.founder-blog-kicker,
.book-card-topline > span:first-child,
.book-badge {
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-weight: 700 !important;
letter-spacing: 0.03em !important;
text-rendering: optimizeLegibility;
}
.book-card-topline > span:first-child {
font-weight: 700 !important;
}
.book-badge {
font-weight: 700 !important;
}
.english-book .book-card-topline > span:first-child,
.english-book .book-badge {
font-weight: 700 !important;
}
/* =========================================================
v91 — load and apply actual bold weights to English labels
========================================================= */
html[lang="ko"] #identity > .container > .eyebrow,
html[lang="en"] #about > .container > .eyebrow,
html[lang="en"] #founder > .container > .eyebrow,
html[lang="en"] #organization > .container > .eyebrow,
html[lang="en"] #history > .container > .eyebrow,
html[lang="en"] #identity > .container > .eyebrow,
html[lang="en"] #business > .container > .eyebrow,
html[lang="en"] #books > .container > .eyebrow,
html[lang="en"] #news-records > .container > .eyebrow,
html[lang="en"] #careers > .container > .eyebrow,
html[lang="en"] #contact > .container > .eyebrow,
.founder-featured-eyebrow,
.founder-blog-kicker,
.book-card-topline > span:first-child,
.book-badge {
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-weight: 800 !important;
letter-spacing: 0.025em !important;
font-synthesis: none !important;
}
html[lang="ko"] #identity > .container > .eyebrow {
font-size: 21px !important;
line-height: 1 !important;
}
/* =========================================================
v92 — founder publication timeline / history removal
========================================================= */
.founder-publication-timeline {
margin: 34px 0 24px;
padding: 34px 32px 30px;
border: 1px solid var(--line);
background: #f6f3ee;
}
.founder-timeline-heading {
display: grid;
grid-template-columns: minmax(0,1fr) auto;
gap: 12px 28px;
align-items: end;
margin-bottom: 28px;
}
.founder-timeline-kicker {
grid-column: 1 / -1;
color: #a87d28;
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-size: 14px;
font-weight: 800;
letter-spacing: .14em;
}
.founder-timeline-heading h4 {
margin: 0;
font-family: "Noto Serif KR", Georgia, serif !important;
font-size: 30px;
font-weight: 600;
line-height: 1.35;
}
.founder-timeline-heading > p {
grid-column: 1 / 2;
margin: 0;
max-width: 760px;
color: #555;
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-size: 16px;
line-height: 1.7;
word-break: keep-all;
}
.founder-timeline-stats {
grid-column: 2;
grid-row: 2 / 4;
display: flex;
gap: 10px;
}
.founder-timeline-stats > div {
min-width: 92px;
padding: 11px 13px;
border: 1px solid #d8c9aa;
background: #fff;
text-align: center;
}
.founder-timeline-stats strong,
.founder-timeline-stats span {
display: block;
font-family: "Noto Sans KR", Arial, sans-serif !important;
}
.founder-timeline-stats strong { color:#081b33; font-size:19px; font-weight:800; }
.founder-timeline-stats span { margin-top:2px; color:#766d60; font-size:11px; font-weight:600; }
.founder-timeline-grid {
display: grid;
grid-template-columns: 1.12fr 1.35fr .72fr;
gap: 14px;
}
.founder-timeline-year {
padding: 22px 20px 18px;
border: 1px solid #d8d2c8;
background: #fff;
}
.founder-timeline-year h5 {
margin: 0 0 15px;
color: #c79534;
font-family: Georgia, "Times New Roman", serif !important;
font-size: 30px;
font-weight: 600;
letter-spacing: .03em;
}
.founder-timeline-year ul { margin:0; padding:0; list-style:none; }
.founder-timeline-year li {
display:grid;
grid-template-columns:48px minmax(0,1fr);
gap:10px;
padding:10px 0;
border-top:1px solid #ece7de;
}
.founder-timeline-year li:first-child { border-top:0; }
.founder-timeline-year time {
color:#a87d28;
font-family:"Noto Sans KR", Arial, sans-serif !important;
font-size:12px;
font-weight:800;
line-height:1.55;
}
.timeline-titles span {
display:block;
color:#222;
font-family:"Noto Sans KR", Arial, sans-serif !important;
font-size:13px;
font-weight:600;
line-height:1.55;
word-break:keep-all;
overflow-wrap:normal;
}
.timeline-titles span + span { margin-top:4px; color:#5e5a54; font-size:12.5px; }
.founder-timeline-note {
margin:14px 0 0;
color:#81796f;
font-family:"Noto Sans KR", Arial, sans-serif !important;
font-size:12px;
line-height:1.6;
}
@media (max-width:1100px) {
.founder-timeline-heading { grid-template-columns:1fr; }
.founder-timeline-stats { grid-column:1; grid-row:auto; }
.founder-timeline-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.founder-timeline-year:last-child { grid-column:1/-1; }
}
@media (max-width:720px) {
.founder-publication-timeline { padding:26px 18px 22px; }
.founder-timeline-grid { grid-template-columns:1fr; }
.founder-timeline-year:last-child { grid-column:auto; }
.founder-timeline-stats { display:grid; grid-template-columns:repeat(3,1fr); }
.founder-timeline-stats > div { min-width:0; }
}
/* =========================================================
v93 — publication timeline as three-column cover cards
========================================================= */
.founder-publication-gallery {
margin-top: 34px;
padding-top: 34px;
border-top: 1px solid var(--line);
}
.founder-gallery-heading {
display: grid;
grid-template-columns: minmax(170px,.45fr) minmax(0,1.55fr);
gap: 10px 34px;
align-items: end;
margin-bottom: 28px;
}
.founder-gallery-heading .founder-timeline-kicker {
grid-column: 1;
color: var(--gold);
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-size: 15px;
font-weight: 700;
letter-spacing: .12em;
}
.founder-gallery-heading h4 {
grid-column: 1;
margin: 0;
font-size: 32px;
line-height: 1.35;
}
.founder-gallery-heading > p {
grid-column: 2;
grid-row: 1 / span 2;
margin: 0;
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-size: 17px;
line-height: 1.75;
}
.founder-gallery-heading .founder-timeline-stats {
grid-column: 1 / -1;
margin-top: 16px;
}
.founder-publication-card-grid {
display: grid;
grid-template-columns: repeat(3, minmax(0,1fr));
border-top: 1px solid var(--line);
border-left: 1px solid var(--line);
}
.founder-publication-card {
display: flex;
flex-direction: column;
min-width: 0;
padding: 24px 22px 26px;
border-right: 1px solid var(--line);
border-bottom: 1px solid var(--line);
background: #fff;
cursor: pointer;
transition: transform .18s ease, box-shadow .18s ease;
}
.founder-publication-card:hover,
.founder-publication-card:focus-visible {
z-index: 2;
transform: translateY(-2px);
box-shadow: 0 12px 28px rgba(8,27,51,.10);
outline: none;
}
.founder-publication-card figure {
height: 390px;
margin: 0 0 18px;
padding: 12px;
display: flex;
align-items: center;
justify-content: center;
background: #f6f3ee;
overflow: hidden;
}
.founder-publication-card figure img {
width: auto;
max-width: 100%;
height: 100%;
max-height: 390px;
object-fit: contain;
}
.founder-publication-card-body {
display: flex;
flex-direction: column;
flex: 1;
}
.founder-publication-meta {
display: flex;
justify-content: space-between;
gap: 12px;
align-items: baseline;
margin-bottom: 12px;
color: var(--gold);
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-size: 14px;
font-weight: 700;
}
.founder-publication-meta time {
color: #6c655d;
white-space: nowrap;
}
.founder-publication-card h5 {
margin: 0;
font-family: "Noto Serif KR", Georgia, serif !important;
font-size: 23px;
font-weight: 600;
line-height: 1.5;
word-break: keep-all;
overflow-wrap: normal;
}
.founder-publication-card .founder-publication-genre {
min-width: 0;
}
.founder-publication-gallery .founder-timeline-note {
margin: 18px 0 0;
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-size: 14px;
line-height: 1.65;
color: var(--muted);
}
@media (max-width: 1120px) {
.founder-publication-card-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
.founder-publication-card figure { height: 360px; }
}
@media (max-width: 720px) {
.founder-gallery-heading { grid-template-columns: 1fr; }
.founder-gallery-heading > p { grid-column: 1; grid-row: auto; }
.founder-publication-card-grid { grid-template-columns: 1fr; }
.founder-publication-card figure { height: 380px; }
}
/* =========================================================
v94 — publication gallery alignment and date corrections
========================================================= */
.founder-gallery-heading {
display: grid !important;
grid-template-columns: minmax(260px, .72fr) minmax(0, 1.28fr) !important;
grid-template-areas:
"kicker summary"
"title summary"
"stats stats" !important;
column-gap: 48px !important;
row-gap: 8px !important;
align-items: start !important;
margin-bottom: 32px !important;
}
.founder-gallery-heading .founder-timeline-kicker {
grid-area: kicker !important;
margin: 0 !important;
}
.founder-gallery-heading h4 {
grid-area: title !important;
margin: 0 !important;
}
.founder-gallery-heading > p {
grid-area: summary !important;
align-self: center !important;
margin: 0 !important;
max-width: 760px !important;
}
.founder-gallery-heading .founder-timeline-stats {
grid-area: stats !important;
margin-top: 18px !important;
position: static !important;
z-index: auto !important;
}
/* Reserve two lines for genre/date so every title begins on the same baseline. */
.founder-publication-meta {
min-height: 48px !important;
align-items: flex-start !important;
margin-bottom: 12px !important;
}
.founder-publication-genre {
display: block !important;
line-height: 1.55 !important;
}
.founder-publication-card h5 {
margin-top: 0 !important;
}
/* This Korean title fits on one line and should not wrap awkwardly. */
.founder-publication-card[data-open-dialog="book-dialog-fidic"] h5 {
white-space: nowrap !important;
font-size: 21px !important;
letter-spacing: -0.03em !important;
}
@media (max-width: 1120px) {
.founder-gallery-heading {
grid-template-columns: 1fr !important;
grid-template-areas:
"kicker"
"title"
"summary"
"stats" !important;
row-gap: 10px !important;
}
.founder-gallery-heading > p {
max-width: none !important;
align-self: start !important;
}
}
@media (max-width: 720px) {
.founder-publication-card[data-open-dialog="book-dialog-fidic"] h5 {
white-space: normal !important;
}
}
/* =========================================================
v95 — keep Latin abbreviations inside body copy consistent
========================================================= */
/* The number style belongs only to the direct number label, not to
Latin-word spans that the line-break protection script inserts. */
.pillars > article > span {
color: var(--gold) !important;
font-family: Georgia, "Times New Roman", serif !important;
}
.pillars p .latin-word,
.pillars p .nowrap-token,
main p .latin-word,
main p .nowrap-token,
main li .latin-word,
main li .nowrap-token,
main dd .latin-word,
main dd .nowrap-token {
color: inherit !important;
font-family: inherit !important;
font-size: inherit !important;
font-weight: inherit !important;
font-style: inherit !important;
line-height: inherit !important;
letter-spacing: inherit !important;
text-transform: inherit !important;
}
/* =========================================================
v93 — language-safe word wrapping and English spacing fix
========================================================= */
/* English copy wraps only at normal word boundaries. This rule has explicit
language and element specificity so it overrides earlier generic :where()
rules without forcing character-level breaks. */
body.lang-en :is(
p,
li,
dd,
dt,
address,
figcaption,
h1,
h2,
h3,
h4,
h5,
h6
),
body.lang-en .primary-nav a,
body.lang-en .primary-nav button,
body.lang-en .footer-info,
body.lang-en .footer-bottom {
word-break: normal !important;
overflow-wrap: normal !important;
hyphens: none !important;
word-spacing: normal !important;
}
/* Korean narrative copy keeps complete Korean words intact. */
body:not(.lang-en) :is(
p,
li,
dd,
dt,
address,
figcaption
) {
word-break: keep-all !important;
overflow-wrap: normal !important;
hyphens: none !important;
}
/* Long contact tokens may wrap only when the available width is insufficient. */
body.lang-en .email-value,
body.lang-en .contact-value a,
body.lang-en .footer-info a {
word-break: normal !important;
overflow-wrap: anywhere !important;
}
/* =========================================================
v94 — English founder name lockup
========================================================= */
body.lang-en .founder-name-en {
white-space: nowrap !important;
font-size: clamp(32px, 2.35vw, 40px) !important;
line-height: 1.1 !important;
letter-spacing: 0 !important;
}
body.lang-en .founder-name-ko {
margin: -4px 0 18px !important;
color: var(--ink);
font-family: "Noto Sans KR", "Malgun Gothic", sans-serif;
font-size: 20px;
font-weight: 600;
line-height: 1.35;
}
/* =========================================================
v100 — book-title spacing, two-line lockups, and contact email
========================================================= */
/* Book titles keep real word spaces; the Latin-token script skips these nodes. */
.book-card h3,
.founder-publication-card h5,
.book-dialog h2,
.nav-book-link,
.sitemap-book-link {
word-spacing: normal !important;
white-space: normal !important;
}
.book-title-line {
display: inline-block !important;
max-width: 100%;
white-space: nowrap !important;
}
.founder-publication-card h5.long-book-title {
font-size: 19px !important;
line-height: 1.48 !important;
letter-spacing: -0.025em !important;
min-height: 2.96em;
}
.book-card h3.long-book-title {
font-size: 21px !important;
line-height: 1.42 !important;
}
@media (max-width: 1120px) {
.founder-publication-card h5.long-book-title {
font-size: 19px !important;
}
}
@media (max-width: 720px) {
.book-title-line {
white-space: normal !important;
}
}
/* Email addresses are identifiers, not display headings: keep them lowercase. */
a[href^="mailto:"],
.email-value,
.footer-info a[href^="mailto:"] {
text-transform: lowercase !important;
font-variant: normal !important;
}
/* =========================================================
v101 — align contact descriptions and rename head office
========================================================= */
@media (min-width: 981px) {
.contact-grid .contact-value {
display: flex !important;
align-items: flex-start !important;
min-height: 58px !important;
margin-bottom: 18px !important;
}
}
/* =========================================================
v102 — careers listing pages and links
========================================================= */
.careers-actions {
margin-top: -26px;
padding-bottom: 48px;
}
.careers-list-link {
display: inline-flex;
width: auto;
min-width: 196px;
align-items: center;
justify-content: center;
gap: 12px;
border-color: #debc68;
background: #debc68;
color: #081b33;
text-decoration: none;
}
.careers-list-link:hover,
.careers-list-link:focus-visible {
background: transparent;
color: #debc68;
outline: none;
}
.careers-page {
min-height: 100vh;
background: #f7f4ee;
color: #111;
}
.careers-page .site-header {
position: relative;
}
.careers-page-header .header-inner {
min-height: 86px !important;
}
.careers-page-nav {
margin-left: auto;
display: flex;
align-items: center;
gap: 28px;
font-size: 15px;
}
.careers-page-nav a {
color: #f7f2e8;
text-decoration: none;
}
.careers-page-nav a:hover,
.careers-page-nav a:focus-visible {
color: #debc68;
outline: none;
}
.careers-page-nav .language-switch {
padding: 0 !important;
}
.careers-page-hero {
padding: 96px 0 88px;
background: #081b33;
color: #f7f2e8;
border-bottom: 1px solid rgba(222,188,104,.34);
}
.careers-page-hero .eyebrow {
color: #debc68;
}
.careers-page-hero h1 {
max-width: 920px;
margin: 18px 0 28px;
font-size: clamp(42px, 6vw, 76px);
line-height: 1.18;
letter-spacing: -.045em;
}
.careers-page-hero p:last-child {
max-width: 760px;
margin: 0;
color: #d8d0c4;
font-size: 18px;
line-height: 1.8;
}
.job-list-section {
padding: 90px 0 110px;
}
.job-list-heading {
display: flex;
align-items: end;
justify-content: space-between;
gap: 28px;
margin-bottom: 28px;
}
.job-list-heading h2 {
margin: 0;
font-size: clamp(32px, 4vw, 52px);
}
.job-count {
color: #a77c20;
font-size: 15px;
font-weight: 700;
}
.job-list {
border-top: 1px solid #bdb6aa;
border-bottom: 1px solid #bdb6aa;
}
.job-empty {
padding: 86px 32px;
text-align: center;
}
.job-empty-mark {
display: inline-flex;
width: 52px;
height: 52px;
align-items: center;
justify-content: center;
margin-bottom: 24px;
border: 1px solid #c39a3b;
border-radius: 50%;
color: #a77c20;
font-family: Georgia, serif;
font-size: 24px;
}
.job-empty h3 {
margin: 0 0 16px;
font-size: 28px;
}
.job-empty p {
max-width: 620px;
margin: 0 auto;
color: #625d55;
font-size: 17px;
line-height: 1.8;
}
.job-list-actions {
display: flex;
flex-wrap: wrap;
gap: 12px;
margin-top: 34px;
}
.job-list-actions .button {
text-decoration: none;
}
@media (max-width: 760px) {
.careers-actions {
margin-top: -18px;
padding-bottom: 34px;
}
.careers-list-link {
width: 100%;
}
.careers-page-header .header-inner {
min-height: 74px !important;
}
.careers-page-header .brand img {
width: 218px !important;
}
.careers-page-nav {
gap: 14px;
font-size: 13px;
}
.careers-page-nav .careers-nav-company {
display: none;
}
.careers-page-hero {
padding: 70px 0 62px;
}
.job-list-section {
padding: 64px 0 80px;
}
.job-list-heading {
align-items: start;
flex-direction: column;
gap: 10px;
}
.job-empty {
padding: 64px 20px;
}
.job-empty h3 {
font-size: 23px;
}
.job-list-actions {
flex-direction: column;
}
.job-list-actions .button {
width: 100%;
}
}
/* =========================================================
v103 — records-card baselines, Dotum captions, organization labels
========================================================= */
@media (min-width: 761px) {
.records-grid {
align-items: stretch !important;
}
.record-card {
height: 100% !important;
}
.record-card-body {
height: 100% !important;
}
.record-card-body h3,
.record-card h3 {
min-height: 4.35em !important;
margin-bottom: 13px !important;
}
.record-card-body p,
.record-card p {
min-height: 5.25em !important;
margin-bottom: 24px !important;
}
}
.records-note,
.identity-logo-card > p,
.identity-logo-primary > p,
.official-ci-section .identity-logo-card > p {
font-family: var(--font-dotum), "KoPubWorld Dotum", "Malgun Gothic", "맑은 고딕", Dotum, "돋움", Arial, sans-serif !important;
font-weight: 400 !important;
font-style: normal !important;
letter-spacing: -0.02em !important;
}
.organization-section .org-node > span,
.organization-section .org-simple-top > span {
white-space: nowrap !important;
}
@media (max-width: 760px) {
.record-card-body h3,
.record-card h3,
.record-card-body p,
.record-card p {
min-height: 0 !important;
}
}
/* =========================================================
v105 — Korean mixed-script typography normalization
========================================================= */
/* Latin tokens inserted into Korean sentences must follow the surrounding
Korean typeface, weight and rhythm instead of switching to the brand serif. */
html[lang="ko"] .latin-word,
html[lang="ko"] .nowrap-token {
color: inherit !important;
font-family: inherit !important;
font-size: inherit !important;
font-weight: inherit !important;
font-style: inherit !important;
line-height: inherit !important;
letter-spacing: inherit !important;
text-transform: inherit !important;
}
/* News and Records is an information interface, so its metadata, mixed Korean-
English headings, descriptions and links use the same Dotum-style sans family. */
html[lang="ko"] .record-card h3,
html[lang="ko"] .record-card h3 .latin-word,
html[lang="ko"] .record-card h3 .nowrap-token,
html[lang="ko"] .record-meta,
html[lang="ko"] .record-meta span,
html[lang="ko"] .record-meta time,
html[lang="ko"] .record-source,
html[lang="ko"] .record-source span,
html[lang="ko"] .record-card-body > .record-source,
html[lang="ko"] .record-card-body > .record-source span {
font-family: var(--font-dotum), "KoPubWorld Dotum", "Malgun Gothic", "맑은 고딕", Dotum, "돋움", Arial, sans-serif !important;
font-synthesis: none !important;
}
html[lang="ko"] .record-card h3 {
font-weight: 700 !important;
letter-spacing: -0.035em !important;
}
html[lang="ko"] .record-meta,
html[lang="ko"] .record-meta span,
html[lang="ko"] .record-meta time {
font-weight: 600 !important;
letter-spacing: 0 !important;
}
html[lang="ko"] .record-source,
html[lang="ko"] .record-source span {
font-weight: 700 !important;
letter-spacing: -0.02em !important;
}
/* =========================================================
v108 — unify publication card category bar heights
========================================================= */
.book-card-topline {
box-sizing: border-box !important;
height: 50px !important;
min-height: 50px !important;
max-height: 50px !important;
padding: 0 14px !important;
align-items: center !important;
}
.book-card-topline > span:first-child {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
min-height: 0 !important;
line-height: 1.2 !important;
}
.book-card-topline .book-badge {
box-sizing: border-box !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
height: 34px !important;
min-height: 34px !important;
padding: 0 10px !important;
line-height: 1 !important;
}
/* =========================================================
v109 — align all publication-card description start lines
========================================================= */
@media (min-width: 761px) {
.book-card h3 {
box-sizing: border-box !important;
height: 118px !important;
min-height: 118px !important;
max-height: 118px !important;
flex: 0 0 118px !important;
margin: 8px 0 12px !important;
display: flex !important;
align-items: flex-start !important;
justify-content: center !important;
overflow: visible !important;
}
.book-card p {
margin-top: 0 !important;
}
}
@media (max-width: 760px) {
.book-card h3 {
height: auto !important;
min-height: 0 !important;
max-height: none !important;
flex-basis: auto !important;
}
}
/* =========================================================
v111 — preserve two-line English book-title lockups
========================================================= */
/* The fixed title box must not be a horizontal flex row. A row layout placed
the two intended title lines side by side and pushed them into adjacent cards. */
@media (min-width: 761px) {
.book-card h3 {
display: block !important;
text-align: center !important;
padding: 0 8px !important;
overflow: hidden !important;
}
}
.book-card h3.long-book-title .book-title-line {
display: block !important;
width: 100% !important;
max-width: 100% !important;
white-space: nowrap !important;
word-spacing: normal !important;
text-align: center !important;
}
/* Long English titles use the same two-line rhythm as the shorter title at left. */
.english-book h3.long-book-title {
font-size: 20px !important;
line-height: 1.42 !important;
letter-spacing: -0.02em !important;
word-spacing: normal !important;
text-transform: none !important;
font-variant: normal !important;
}
@media (max-width: 760px) {
.book-card h3,
.book-card h3.long-book-title .book-title-line {
display: block !important;
width: auto !important;
white-space: normal !important;
overflow: visible !important;
}
}
/* =========================================================
v112 — readable mixed-case typography in English-edition book dialogs
========================================================= */
/* Covers may retain their original all-capital artwork. Website dialog copy
uses mixed case so readers can recognize word shapes quickly. */
.book-dialog[id$="-en"] .eyebrow {
font-family: Arial, Helvetica, sans-serif !important;
font-variant: normal !important;
text-transform: none !important;
letter-spacing: .055em !important;
font-weight: 700 !important;
}
.book-dialog[id$="-en"] h2 {
font-family: Georgia, "Times New Roman", serif !important;
font-variant: normal !important;
text-transform: none !important;
letter-spacing: -0.035em !important;
}
.book-dialog[id$="-en"] .book-dialog-lead {
font-family: Georgia, "Times New Roman", serif !important;
font-variant: normal !important;
text-transform: none !important;
letter-spacing: -0.012em !important;
}
.book-dialog[id$="-en"] p:not(.eyebrow):not(.book-dialog-lead),
.book-dialog[id$="-en"] .book-meta dt,
.book-dialog[id$="-en"] .book-meta dd {
font-family: Arial, Helvetica, sans-serif !important;
font-variant: normal !important;
text-transform: none !important;
letter-spacing: normal !important;
}
.book-dialog[id$="-en"] .book-meta dd {
font-weight: 600 !important;
}
/* =========================================================
v114 — stacked English publication mark and Title Case timeline
========================================================= */
/* The English founder name and publication timeline use natural mixed case. */
body.lang-en .founder-name-en,
body.lang-en .founder-publication-card h5,
body.lang-en .founder-publication-card h5 .book-title-line,
body.lang-en .founder-publication-meta,
body.lang-en .founder-publication-genre,
body.lang-en .founder-publication-meta time {
text-transform: none !important;
font-variant: normal !important;
font-variant-caps: normal !important;
}
body.lang-en .founder-name-en {
letter-spacing: 0 !important;
}
body.lang-en .founder-publication-card h5,
body.lang-en .founder-publication-card h5 .book-title-line {
word-spacing: normal !important;
}
/* =========================================================
v115 — true Title Case typography and careers CTA clearance
========================================================= */
/* Cinzel is an all-capital display face. Use a true mixed-case serif for the
founder's English name and English book titles so lowercase letterforms are
visibly preserved rather than rendered as small capitals. */
body.lang-en .founder-name-en {
font-family: Georgia, "Times New Roman", serif !important;
text-transform: none !important;
font-variant: normal !important;
font-variant-caps: normal !important;
font-feature-settings: "smcp" 0, "c2sc" 0 !important;
letter-spacing: -0.02em !important;
}
/* English titles on the English site, plus English-edition titles embedded
in the Korean site, use true Title Case and ordinary word shapes. */
body.lang-en .founder-publication-card h5,
body.lang-en .founder-publication-card h5 .book-title-line,
body.lang-en .book-card h3,
body.lang-en .book-card h3 .book-title-line,
body.lang-en .book-dialog h2,
.founder-publication-card[data-open-dialog$="-en"] h5,
.founder-publication-card[data-open-dialog$="-en"] h5 .book-title-line,
.english-book h3,
.english-book h3 .book-title-line,
.book-dialog[id$="-en"] h2 {
font-family: Georgia, "Times New Roman", serif !important;
text-transform: none !important;
font-variant: normal !important;
font-variant-caps: normal !important;
font-feature-settings: "smcp" 0, "c2sc" 0 !important;
word-spacing: normal !important;
}
/* English dialog descriptions remain Title Case as authored, without any
all-capital or small-cap transformation from display typography. */
body.lang-en .book-dialog .book-dialog-lead,
body.lang-en .book-dialog .book-dialog-grid > div > p:not(.eyebrow),
.book-dialog[id$="-en"] .book-dialog-lead,
.book-dialog[id$="-en"] .book-dialog-grid > div > p:not(.eyebrow) {
text-transform: none !important;
font-variant: normal !important;
font-variant-caps: normal !important;
font-feature-settings: "smcp" 0, "c2sc" 0 !important;
}
/* The v102 negative margin pulled the vacancy button over the qualification
panel. Restore normal document flow and visible separation. */
.careers-section .careers-actions {
position: static !important;
margin-top: 20px !important;
padding-bottom: 0 !important;
clear: both !important;
}
.careers-section .careers-list-link {
position: static !important;
margin: 0 !important;
}
@media (max-width: 760px) {
.careers-section .careers-actions {
margin-top: 16px !important;
}
}
/* =========================================================
v116 — restrained data-center expertise signals
========================================================= */
.founder-current-project {
display: grid;
grid-template-columns: 120px minmax(0, 1fr);
gap: 20px;
align-items: start;
margin-top: 18px;
padding: 20px 22px;
border: 1px solid var(--line);
background: #fbfaf7;
}
.founder-current-project > span {
color: var(--gold);
font-size: 12px;
font-weight: 800;
letter-spacing: .08em;
text-transform: uppercase;
}
.founder-current-project strong {
display: block;
margin-bottom: 6px;
font-family: "Noto Serif KR", Georgia, serif;
font-size: 20px;
line-height: 1.45;
}
.founder-current-project p {
margin: 0;
color: var(--muted);
line-height: 1.75;
}
body.lang-en .founder-current-project strong {
font-family: Georgia, "Times New Roman", serif;
text-transform: none;
}
@media (max-width: 760px) {
.founder-current-project {
grid-template-columns: 1fr;
gap: 8px;
padding: 18px;
}
}
/* =========================================================
v117 — definitive mixed-case founder name
========================================================= */
html body.lang-en .founder-name-en.founder-name-titlecase {
font-family: Georgia, "Times New Roman", serif !important;
text-transform: none !important;
font-variant: normal !important;
font-variant-caps: normal !important;
font-feature-settings: normal !important;
letter-spacing: -0.025em !important;
}
/* =========================================================
v118 — visible mixed-case founder typography
========================================================= */
body.lang-en .founder-role,
body.lang-ko .founder-role {
font-family: Arial, Helvetica, sans-serif !important;
text-transform: none !important;
font-variant: normal !important;
font-variant-caps: normal !important;
font-feature-settings: normal !important;
letter-spacing: .035em !important;
font-weight: 600 !important;
}
html body.lang-en h2.founder-name-en.founder-name-titlecase,
html body.lang-en h2.founder-name-en.founder-name-titlecase span {
font-family: "Times New Roman", Times, serif !important;
text-transform: none !important;
font-variant: normal !important;
font-variant-caps: normal !important;
font-feature-settings: normal !important;
letter-spacing: 0 !important;
}
html body.lang-en h2.founder-name-en.founder-name-titlecase {
white-space: nowrap !important;
font-size: clamp(36px, 2.45vw, 44px) !important;
line-height: 1.08 !important;
}
html body.lang-en .founder-name-first,
html body.lang-en .founder-name-last {
text-transform: capitalize !important;
}
html body.lang-en .founder-name-middle {
text-transform: none !important;
}
/* =========================================================
v119 — unified English book-title typography
========================================================= */
/* All English book titles use one serif family and one regular weight.
Context-specific title sizes may differ in dialogs, but catalogue cards
and their explicit line spans share exactly the same type treatment. */
body.lang-en .book-card h3,
body.lang-en .book-card h3.long-book-title,
body.lang-en .book-card h3 .book-title-line,
.english-book h3,
.english-book h3.long-book-title,
.english-book h3 .book-title-line {
font-family: Georgia, "Times New Roman", serif !important;
font-size: 20px !important;
font-weight: 400 !important;
font-style: normal !important;
line-height: 1.42 !important;
letter-spacing: -0.015em !important;
word-spacing: normal !important;
text-transform: none !important;
font-variant: normal !important;
font-variant-caps: normal !important;
font-feature-settings: "smcp" 0, "c2sc" 0 !important;
}
body.lang-en .book-card h3 .book-title-line,
.english-book h3 .book-title-line {
font: inherit !important;
color: inherit !important;
}
/* Founder timeline and English-edition title references use the same family
and regular weight while retaining their existing contextual size. */
body.lang-en .founder-publication-card h5,
body.lang-en .founder-publication-card h5 .book-title-line,
.founder-publication-card[data-open-dialog$="-en"] h5,
.founder-publication-card[data-open-dialog$="-en"] h5 .book-title-line,
body.lang-en .book-dialog h2,
.book-dialog[id$="-en"] h2 {
font-family: Georgia, "Times New Roman", serif !important;
font-weight: 400 !important;
font-style: normal !important;
}
/* =========================================================
v121 — publication-title containment and record-card baselines
========================================================= */
/* Founder publication titles must remain inside their own cards. Long English
titles wrap at word boundaries and may use as many lines as required. */
.founder-publication-card,
.founder-publication-card-body {
min-width: 0 !important;
overflow: hidden !important;
}
.founder-publication-card h5,
.founder-publication-card h5.long-book-title,
.founder-publication-card h5 .book-title-line,
.founder-publication-card[data-open-dialog$="-en"] h5,
.founder-publication-card[data-open-dialog$="-en"] h5 .book-title-line,
body.lang-en .founder-publication-card h5,
body.lang-en .founder-publication-card h5 .book-title-line {
display: block !important;
width: 100% !important;
max-width: 100% !important;
min-width: 0 !important;
height: auto !important;
max-height: none !important;
padding: 0 !important;
white-space: normal !important;
word-break: normal !important;
overflow-wrap: break-word !important;
hyphens: none !important;
overflow: visible !important;
text-overflow: clip !important;
}
/* English titles in the founder timeline use one compact, readable rhythm. */
.founder-publication-card[data-open-dialog$="-en"] h5,
body.lang-en .founder-publication-card h5 {
font-family: Georgia, "Times New Roman", serif !important;
font-size: 17px !important;
font-weight: 400 !important;
line-height: 1.42 !important;
letter-spacing: -0.012em !important;
text-transform: none !important;
font-variant: normal !important;
font-variant-caps: normal !important;
}
/* All cards in the same row share the same content baselines. The title and
description zones are reserved independently so descriptions and links line up. */
@media (min-width: 761px) {
.records-grid {
align-items: stretch !important;
}
.record-card {
height: 100% !important;
}
.record-card-body {
display: grid !important;
grid-template-rows: auto minmax(5.7em, auto) minmax(7.1em, auto) auto !important;
height: 100% !important;
min-width: 0 !important;
}
.record-card-body .record-meta {
align-self: start !important;
}
.record-card-body h3,
.record-card h3 {
min-height: 5.7em !important;
margin: 0 0 13px !important;
align-self: start !important;
}
.record-card-body p,
.record-card p {
min-height: 7.1em !important;
margin: 0 0 24px !important;
align-self: start !important;
}
.record-card-body .record-source {
align-self: end !important;
margin-top: 0 !important;
}
}
@media (max-width: 760px) {
.record-card-body {
display: flex !important;
}
.record-card-body h3,
.record-card h3,
.record-card-body p,
.record-card p {
min-height: 0 !important;
}
}
/* =========================================================
v124 — make "English Edition" spacing explicit in category bars
========================================================= */
.english-book .book-card-topline > span:first-child {
display: inline-flex !important;
align-items: center !important;
white-space: nowrap !important;
word-spacing: 0.22em !important;
letter-spacing: 0.01em !important;
}
/* =========================================================
v125 — contact typography/alignment and current project emphasis
========================================================= */
/* Contact card titles use the same sans-serif family as the card body. */
.contact-card h3 {
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-weight: 600 !important;
line-height: 1.4 !important;
min-height: 1.6em !important;
margin: 26px 0 12px !important;
}
/* Keep title, value and explanatory copy on common horizontal baselines. */
.contact-card {
display: grid !important;
grid-template-rows: auto 2.3em 3.4em minmax(3.2em, auto) !important;
align-content: start !important;
}
.contact-card .contact-number {
align-self: start !important;
}
.contact-card .contact-value,
.contact-card address.contact-value,
.contact-card a.contact-value {
box-sizing: border-box !important;
height: 3.4em !important;
min-height: 3.4em !important;
margin: 0 !important;
align-self: start !important;
}
.contact-card p {
align-self: start !important;
margin: 0 !important;
padding-top: 0 !important;
}
/* Make the Korean "집필 중" status four times larger than its former 12px size. */
body:not(.lang-en) .founder-current-project {
grid-template-columns: 168px minmax(0, 1fr) !important;
align-items: center !important;
}
body:not(.lang-en) .founder-current-project > span {
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 48px !important;
font-weight: 700 !important;
line-height: 1.05 !important;
letter-spacing: -0.04em !important;
text-transform: none !important;
white-space: nowrap !important;
}
/* Current-project description uses the site's sans-serif body family. */
.founder-current-project p {
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 16px !important;
font-weight: 400 !important;
line-height: 1.65 !important;
}
body.lang-en .founder-current-project p {
font-family: Arial, Helvetica, sans-serif !important;
}
@media (max-width: 760px) {
.contact-card {
display: block !important;
}
.contact-card .contact-value,
.contact-card address.contact-value,
.contact-card a.contact-value {
height: auto !important;
min-height: 0 !important;
margin-bottom: 12px !important;
}
body:not(.lang-en) .founder-current-project {
grid-template-columns: 1fr !important;
align-items: start !important;
}
body:not(.lang-en) .founder-current-project > span {
font-size: 36px !important;
}
}
/* =========================================================
v126 — match short English book-card titles to Korean title size
========================================================= */
/* Single-line English titles use the same 21px catalogue-title scale as
Korean titles. Long two-line English titles retain their compact 20px rule. */
.english-book h3:not(.long-book-title),
body.lang-en .book-card h3:not(.long-book-title) {
font-size: 21px !important;
line-height: 1.35 !important;
letter-spacing: -0.01em !important;
}
/* =========================================================
v127 — keep the short FIDIC commentary title on one line
========================================================= */
@media (min-width: 769px) {
.book-card h3.single-line-book-title {
white-space: nowrap !important;
font-size: 21px !important;
}
}
/* =========================================================
v128 — remove redundant blank line inside explicit two-line book titles
========================================================= */
/* The title lines are already block elements. The intervening
created
an extra blank line between them. Hide only those redundant breaks so
two-line titles use the same compact rhythm as naturally wrapped titles. */
.long-book-title > br {
display: none !important;
}
.long-book-title .book-title-line {
margin: 0 !important;
padding: 0 !important;
line-height: 1.42 !important;
}
/* =========================================================
v129 — align English contact copy and normalize careers notices
========================================================= */
/* Keep all three English contact explanations on the same starting baseline. */
body.lang-en .contact-card {
display: grid !important;
grid-template-rows: auto 3.2em 4.8em auto !important;
row-gap: 12px !important;
align-content: start !important;
}
body.lang-en .contact-card .contact-number {
grid-row: 1 !important;
align-self: start !important;
}
body.lang-en .contact-card h3 {
grid-row: 2 !important;
align-self: center !important;
min-height: 0 !important;
margin: 0 !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
}
body.lang-en .contact-card .contact-value,
body.lang-en .contact-card address.contact-value,
body.lang-en .contact-card a.contact-value {
grid-row: 3 !important;
align-self: start !important;
height: auto !important;
min-height: 0 !important;
margin: 0 !important;
}
body.lang-en .contact-card > p {
grid-row: 4 !important;
align-self: start !important;
margin: 0 !important;
padding: 0 !important;
}
/* Careers empty-state copy: sans-serif and true mixed-case Title Case. */
body.lang-en.careers-page .job-empty h3,
body.lang-en.careers-page .job-empty p {
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
text-transform: none !important;
font-variant: normal !important;
letter-spacing: 0 !important;
}
body.lang-en.careers-page .job-empty h3 {
font-weight: 600 !important;
}
body.lang-en.careers-page .job-empty p {
font-weight: 400 !important;
}
@media (max-width: 760px) {
body.lang-en .contact-card {
display: block !important;
}
}
/* =========================================================
v130 — compact all explicit two-line book titles
========================================================= */
/* HTML no longer contains redundant
elements between the two line spans.
Each line follows the previous line directly with one normal line-height. */
.long-book-title {
line-height: 1.28 !important;
}
.long-book-title .book-title-line {
display: block !important;
margin: 0 !important;
padding: 0 !important;
line-height: 1.28 !important;
}
.long-book-title > br {
display: none !important;
}
/* =========================================================
v131 — repair Korean contact-card row stacking
========================================================= */
body:not(.lang-en) .contact-card {
display: grid !important;
grid-template-rows: auto 2.2em 3.4em auto !important;
row-gap: 12px !important;
align-content: start !important;
}
body:not(.lang-en) .contact-card .contact-number {
grid-row: 1 !important;
align-self: start !important;
}
body:not(.lang-en) .contact-card h3 {
grid-row: 2 !important;
margin: 0 !important;
min-height: 0 !important;
align-self: center !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
}
body:not(.lang-en) .contact-card .contact-value,
body:not(.lang-en) .contact-card address.contact-value,
body:not(.lang-en) .contact-card a.contact-value {
grid-row: 3 !important;
height: auto !important;
min-height: 0 !important;
margin: 0 !important;
align-self: start !important;
}
body:not(.lang-en) .contact-card > p {
grid-row: 4 !important;
margin: 0 !important;
padding: 0 !important;
align-self: start !important;
}
/* =========================================================
v131 — repair contact-card row overlap and align all baselines
========================================================= */
@media (min-width: 761px) {
.contact-card,
body.lang-en .contact-card {
display: grid !important;
grid-template-columns: minmax(0, 1fr) !important;
grid-template-rows: auto 2.3em 3.15em minmax(3.2em, auto) !important;
row-gap: 10px !important;
align-content: start !important;
align-items: start !important;
}
.contact-card .contact-number,
body.lang-en .contact-card .contact-number {
grid-row: 1 !important;
align-self: start !important;
margin: 0 !important;
}
.contact-card h3,
body.lang-en .contact-card h3 {
grid-row: 2 !important;
align-self: start !important;
box-sizing: border-box !important;
min-height: 0 !important;
margin: 0 !important;
padding: 0 !important;
line-height: 1.4 !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-weight: 600 !important;
}
.contact-card .contact-value,
.contact-card address.contact-value,
.contact-card a.contact-value,
body.lang-en .contact-card .contact-value,
body.lang-en .contact-card address.contact-value,
body.lang-en .contact-card a.contact-value {
grid-row: 3 !important;
align-self: start !important;
display: block !important;
box-sizing: border-box !important;
width: 100% !important;
height: auto !important;
min-height: 3.15em !important;
margin: 0 !important;
padding: 0 !important;
line-height: 1.45 !important;
}
.contact-card > p,
body.lang-en .contact-card > p {
grid-row: 4 !important;
align-self: start !important;
min-height: 3.2em !important;
margin: 0 !important;
padding: 0 !important;
}
}
/* =========================================================
v132 — align English organization-card description baselines
========================================================= */
@media (min-width: 741px) {
body.lang-en .org-simple-dept h3 {
display: flex !important;
align-items: center !important;
justify-content: center !important;
box-sizing: border-box !important;
min-height: 2.8em !important;
margin: 14px 0 18px !important;
line-height: 1.35 !important;
text-align: center !important;
}
body.lang-en .org-simple-dept p {
margin-top: 0 !important;
}
}
/* =========================================================
v133 — Korean text inside English CI copy uses sans-serif
========================================================= */
html[lang="en"] .korean-inline {
font-family: "Noto Sans KR", "Malgun Gothic", "Apple SD Gothic Neo", Arial, sans-serif !important;
font-weight: 600 !important;
letter-spacing: 0 !important;
}
/* =========================================================
v135 — footer business registration number and compact logo
========================================================= */
/* Four footer information items on desktop; responsive below. */
.footer-info {
grid-template-columns: auto auto auto 1fr !important;
}
/* Reduce only the footer lockup to approximately two-thirds of v134. */
.footer-brand {
width: 212px !important;
max-width: 212px !important;
}
.footer-brand .brand-lockup-final {
width: 212px !important;
height: 44px !important;
gap: 1px !important;
}
.footer-brand .brand-lockup-final-symbol {
width: 45px !important;
height: 44px !important;
flex: 0 0 45px !important;
}
.footer-brand .brand-lockup-final-words {
width: 165px !important;
margin-left: -1px !important;
top: 1px !important;
}
.footer-brand .brand-lockup-final-en {
width: 165px !important;
height: 18px !important;
}
.footer-brand .brand-lockup-final-ko {
width: 145px !important;
height: 18px !important;
margin-top: -1px !important;
margin-left: 5px !important;
}
@media (max-width: 1180px) {
.footer-info {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
.footer-brand {
width: 191px !important;
max-width: 191px !important;
}
.footer-brand .brand-lockup-final {
width: 191px !important;
height: 40px !important;
}
.footer-brand .brand-lockup-final-symbol {
width: 41px !important;
height: 40px !important;
flex-basis: 41px !important;
}
.footer-brand .brand-lockup-final-words {
width: 149px !important;
}
.footer-brand .brand-lockup-final-en {
width: 149px !important;
height: 17px !important;
}
.footer-brand .brand-lockup-final-ko {
width: 131px !important;
height: 17px !important;
margin-left: 4px !important;
}
}
@media (max-width: 760px) {
.footer-info {
grid-template-columns: 1fr !important;
}
.footer-brand {
width: min(66vw, 180px) !important;
max-width: none !important;
}
.footer-brand .brand-lockup-final {
width: 100% !important;
height: 37px !important;
}
.footer-brand .brand-lockup-final-symbol {
width: 38px !important;
height: 37px !important;
flex-basis: 38px !important;
}
.footer-brand .brand-lockup-final-words {
width: calc(100% - 39px) !important;
}
.footer-brand .brand-lockup-final-en {
width: 100% !important;
height: 15px !important;
}
.footer-brand .brand-lockup-final-ko {
width: 88% !important;
height: 15px !important;
margin-left: 4px !important;
}
}
/* =========================================================
v136 — active recruitment postings and Netlify application form
========================================================= */
.visually-hidden {
position: absolute !important;
width: 1px !important;
height: 1px !important;
padding: 0 !important;
margin: -1px !important;
overflow: hidden !important;
clip: rect(0, 0, 0, 0) !important;
white-space: nowrap !important;
border: 0 !important;
}
.recruitment-overview {
margin-bottom: 34px;
padding: 34px;
border: 1px solid rgba(8,27,51,.18);
background: #fffdf8;
box-shadow: 0 16px 34px rgba(8,27,51,.06);
}
.recruitment-overview-head {
display: grid;
grid-template-columns: minmax(140px, .35fr) minmax(0, 1fr);
align-items: end;
gap: 26px;
padding-bottom: 24px;
border-bottom: 1px solid #d9d1c5;
}
.recruitment-overview-head .eyebrow { margin: 0; color: #a77c20; }
.recruitment-overview-head h3 { margin: 0; font-size: clamp(25px, 3vw, 36px); line-height: 1.35; }
.recruitment-facts {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 0;
margin-top: 24px;
border-top: 1px solid #e2dbcf;
border-left: 1px solid #e2dbcf;
}
.recruitment-facts span {
min-height: 88px;
padding: 19px 20px;
border-right: 1px solid #e2dbcf;
border-bottom: 1px solid #e2dbcf;
color: #454039;
line-height: 1.6;
}
.recruitment-facts strong { display: block; margin-bottom: 5px; color: #081b33; font-size: 13px; letter-spacing: .04em; }
.employment-support-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 22px; }
.employment-support-grid article { padding: 24px; background: #f3eee4; }
.employment-support-grid h4 { margin: 0 0 10px; color: #081b33; font-size: 18px; }
.employment-support-grid p { margin: 0; color: #5b554d; line-height: 1.78; }
.job-posting-list { display: grid; gap: 22px; }
.job-posting-card { padding: 38px; border: 1px solid #c9c1b5; background: #fff; box-shadow: 0 12px 30px rgba(8,27,51,.045); }
.job-posting-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 28px; padding-bottom: 26px; border-bottom: 1px solid #ded6ca; }
.job-division { margin: 0 0 7px; color: #a77c20; font-size: 14px; font-weight: 800; letter-spacing: .06em; }
.job-posting-head h3 { margin: 0 0 12px; color: #081b33; font-size: clamp(27px, 3vw, 37px); line-height: 1.25; }
.job-summary { max-width: 730px; margin: 0; color: #625d55; font-size: 17px; line-height: 1.75; }
.job-vacancy { flex: 0 0 auto; padding: 9px 13px; border: 1px solid #c39a3b; color: #8a6518; font-size: 13px; font-weight: 800; white-space: nowrap; }
.job-detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 42px; padding: 30px 0; }
.job-detail-grid h4 { margin: 0 0 15px; color: #081b33; font-size: 19px; }
.job-detail-grid ul { margin: 0; padding-left: 1.25em; color: #4d4841; }
.job-detail-grid li { margin: 0 0 9px; line-height: 1.65; }
.job-apply-link { min-width: 190px; text-align: center; text-decoration: none; }
.application-section { padding: 105px 0 120px; background: #081b33; color: #f7f2e8; }
.application-layout { display: grid; grid-template-columns: minmax(260px, .55fr) minmax(0, 1fr); gap: clamp(42px, 7vw, 92px); align-items: start; }
.application-intro { position: sticky; top: 28px; }
.application-intro .eyebrow { color: #debc68; }
.application-intro h2 { margin: 16px 0 24px; font-size: clamp(36px, 5vw, 58px); line-height: 1.2; letter-spacing: -.035em; }
.application-intro > p { color: #d8d0c4; font-size: 17px; line-height: 1.8; }
.blind-hiring-note { margin-top: 28px; padding: 22px; border: 1px solid rgba(222,188,104,.42); background: rgba(255,255,255,.04); }
.blind-hiring-note strong { display: block; margin-bottom: 8px; color: #debc68; }
.blind-hiring-note p { margin: 0; color: #e8e0d5; line-height: 1.75; }
.email-inquiry-warning { margin-top: 22px !important; padding: 17px 18px; border-left: 3px solid #debc68; background: rgba(222,188,104,.12); color: #fff !important; font-weight: 700; }
.application-form { padding: 42px; background: #fffdf8; color: #171512; box-shadow: 0 24px 50px rgba(0,0,0,.22); }
.form-section { min-width: 0; margin: 0 0 36px; padding: 0 0 36px; border: 0; border-bottom: 1px solid #ddd4c7; }
.form-section:last-of-type { margin-bottom: 28px; }
.form-section legend { width: 100%; margin: 0 0 22px; padding: 0; color: #081b33; font-size: 23px; font-weight: 800; }
.form-section-note { margin: -10px 0 20px; color: #706a61; line-height: 1.65; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.form-field { min-width: 0; margin-bottom: 22px; }
.form-field:last-child { margin-bottom: 0; }
.form-field-full { grid-column: 1 / -1; }
.form-field label { display: block; margin-bottom: 9px; color: #171512; font-size: 15px; font-weight: 800; }
.required-mark { color: #9b6712; }
.field-help { margin: -2px 0 10px; color: #746e65; font-size: 13px; line-height: 1.6; }
.form-field input,
.form-field select,
.form-field textarea {
width: 100%;
border: 1px solid #bdb4a7;
border-radius: 0;
background: #fff;
color: #111;
font: inherit;
line-height: 1.55;
}
.form-field input,
.form-field select { min-height: 52px; padding: 12px 14px; }
.form-field textarea { min-height: 150px; padding: 14px; resize: vertical; }
.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus { border-color: #a77c20; outline: 2px solid rgba(222,188,104,.35); outline-offset: 1px; }
.privacy-box { padding: 24px; background: #f2ede4; }
.privacy-box dl { margin: 0 0 22px; }
.privacy-box dl div { display: grid; grid-template-columns: 115px minmax(0, 1fr); gap: 18px; padding: 10px 0; border-bottom: 1px solid #d7cec0; }
.privacy-box dt { color: #081b33; font-weight: 800; }
.privacy-box dd { margin: 0; color: #514c45; line-height: 1.6; }
.privacy-consent { display: flex !important; align-items: flex-start; gap: 12px; margin: 0 !important; font-weight: 500 !important; line-height: 1.65; }
.privacy-consent input { flex: 0 0 auto; width: 19px; height: 19px; margin-top: 3px; accent-color: #081b33; }
.application-submit { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.application-submit p { max-width: 620px; margin: 0; color: #6d675f; font-size: 13px; line-height: 1.65; }
.application-submit .button { flex: 0 0 auto; min-width: 160px; border: 1px solid #debc68; background: #debc68; color: #081b33; }
.application-submit .button:hover,
.application-submit .button:focus-visible { border-color: #081b33; background: #081b33; color: #fff; }
.thank-you-main { min-height: 100vh; display: grid; place-items: center; padding: 42px 20px; background: #081b33; }
.thank-you-card { width: min(760px, 100%); padding: 58px; background: #fffdf8; text-align: center; box-shadow: 0 24px 60px rgba(0,0,0,.26); }
.thank-you-card > img { width: min(300px, 74%); height: auto; margin-bottom: 38px; }
.thank-you-card .eyebrow { color: #a77c20; }
.thank-you-card h1 { margin: 16px 0 24px; color: #081b33; font-size: clamp(34px, 6vw, 54px); line-height: 1.25; }
.thank-you-card > p { max-width: 610px; margin: 0 auto 20px; color: #5c574f; font-size: 17px; line-height: 1.8; }
.thank-you-card .email-inquiry-warning { color: #081b33 !important; background: #f0e7d3; border-left: 0; }
.thank-you-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.thank-you-actions a { text-decoration: none; }
body.lang-en.careers-page .job-posting-card,
body.lang-en.careers-page .application-form,
body.lang-en.careers-page .recruitment-overview,
body.lang-en.careers-page .thank-you-card { font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif; }
body.lang-en.careers-page .job-posting-head h3,
body.lang-en.careers-page .job-detail-grid h4,
body.lang-en.careers-page .form-section legend,
body.lang-en.careers-page .recruitment-overview h3 { text-transform: none; letter-spacing: normal; }
@media (max-width: 980px) {
.recruitment-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.application-layout { grid-template-columns: 1fr; }
.application-intro { position: static; }
}
@media (max-width: 760px) {
.recruitment-overview { padding: 24px 20px; }
.recruitment-overview-head { grid-template-columns: 1fr; gap: 8px; }
.recruitment-facts { grid-template-columns: 1fr; }
.recruitment-facts span { min-height: 0; }
.employment-support-grid,
.job-detail-grid,
.form-grid { grid-template-columns: 1fr; }
.job-posting-card { padding: 28px 20px; }
.job-posting-head { flex-direction: column; gap: 16px; }
.job-vacancy { align-self: flex-start; }
.job-detail-grid { gap: 26px; }
.job-apply-link { width: 100%; }
.application-section { padding: 72px 0 84px; }
.application-form { padding: 28px 20px; }
.privacy-box dl div { grid-template-columns: 1fr; gap: 4px; }
.application-submit { align-items: stretch; flex-direction: column; }
.application-submit .button { width: 100%; }
.thank-you-card { padding: 40px 22px; }
.thank-you-actions { flex-direction: column; }
.thank-you-actions .button { width: 100%; }
}
/* v137 — FAQ in Contact navigation */
.faq-section {
padding: 108px 0 118px;
background: #f5f0e7;
}
.faq-heading {
display: grid;
grid-template-columns: minmax(0, .82fr) minmax(300px, .55fr);
gap: clamp(32px, 7vw, 96px);
align-items: end;
margin-bottom: 46px;
}
.faq-heading h2 {
margin: 15px 0 0;
color: #081b33;
font-size: clamp(38px, 5vw, 62px);
line-height: 1.18;
letter-spacing: -.04em;
}
.faq-heading > p {
margin: 0;
color: #5c574f;
font-size: 17px;
line-height: 1.82;
}
.faq-category-grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 22px;
align-items: start;
}
.faq-category {
min-width: 0;
padding: 28px;
border: 1px solid #d1c8bb;
background: #fffdf8;
box-shadow: 0 12px 30px rgba(8,27,51,.04);
}
.faq-category-head {
display: flex;
align-items: center;
gap: 14px;
margin-bottom: 20px;
padding-bottom: 18px;
border-bottom: 1px solid #ded6ca;
}
.faq-category-number {
display: grid;
place-items: center;
flex: 0 0 34px;
width: 34px;
height: 34px;
border: 1px solid #c49a3a;
color: #8b661c;
font-size: 12px;
font-weight: 800;
letter-spacing: .06em;
}
.faq-category h3 {
margin: 0;
color: #081b33;
font-size: 22px;
line-height: 1.35;
}
.faq-list {
display: grid;
gap: 10px;
}
.faq-item {
border: 1px solid #ddd4c7;
background: #fff;
}
.faq-item summary {
position: relative;
display: flex;
align-items: flex-start;
justify-content: space-between;
gap: 18px;
padding: 18px 46px 18px 18px;
color: #171512;
font-weight: 800;
line-height: 1.55;
cursor: pointer;
list-style: none;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after {
content: "+";
position: absolute;
top: 17px;
right: 18px;
color: #a77c20;
font-size: 22px;
font-weight: 500;
line-height: 1;
transition: transform .2s ease;
}
.faq-item[open] summary::after { transform: rotate(45deg); }
.faq-item[open] summary {
color: #081b33;
background: #f4eee2;
}
.faq-answer {
padding: 0 18px 19px;
color: #565149;
line-height: 1.78;
}
.faq-answer p { margin: 0; }
.faq-answer a { color: #081b33; font-weight: 700; }
body.lang-en .faq-category,
body.lang-en .faq-answer,
body.lang-en .faq-item summary {
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif;
word-break: normal;
overflow-wrap: normal;
hyphens: none;
}
@media (max-width: 1080px) {
.faq-category-grid { grid-template-columns: 1fr; }
.faq-category { padding: 26px; }
}
@media (max-width: 760px) {
.faq-section { padding: 76px 0 84px; }
.faq-heading { grid-template-columns: 1fr; gap: 20px; margin-bottom: 32px; }
.faq-category { padding: 22px 18px; }
.faq-item summary { padding: 17px 44px 17px 16px; }
.faq-answer { padding: 0 16px 18px; }
}
/* =========================================================
v138 — Korean careers page typography
Keep the page title “채용공고” in the established serif face.
Use a Dotum-style sans-serif for all other recruitment content.
========================================================= */
body.careers-page:not(.lang-en) main,
body.careers-page:not(.lang-en) main * {
font-family: "Noto Sans KR", "Malgun Gothic", "Apple SD Gothic Neo", Arial, sans-serif !important;
}
body.careers-page:not(.lang-en) .careers-page-hero .eyebrow,
body.careers-page:not(.lang-en) #job-list-title {
font-family: "Noto Serif KR", Georgia, serif !important;
}
/* =========================================================
v139 — Korean online application body typography
Preserve section headings and legends. Use a Dotum-style
sans-serif for all supporting copy, privacy details, form
controls, consent text, guidance and submit controls.
========================================================= */
body.careers-page:not(.lang-en) .application-intro > p,
body.careers-page:not(.lang-en) .blind-hiring-note p,
body.careers-page:not(.lang-en) .email-inquiry-warning,
body.careers-page:not(.lang-en) .application-form .form-section-note,
body.careers-page:not(.lang-en) .application-form .form-field label,
body.careers-page:not(.lang-en) .application-form .field-help,
body.careers-page:not(.lang-en) .application-form .form-field input,
body.careers-page:not(.lang-en) .application-form .form-field select,
body.careers-page:not(.lang-en) .application-form .form-field textarea,
body.careers-page:not(.lang-en) .application-form .privacy-box dt,
body.careers-page:not(.lang-en) .application-form .privacy-box dd,
body.careers-page:not(.lang-en) .application-form .privacy-consent,
body.careers-page:not(.lang-en) .application-form .privacy-consent span,
body.careers-page:not(.lang-en) .application-form .application-submit p,
body.careers-page:not(.lang-en) .application-form .application-submit button {
font-family: "Malgun Gothic", "맑은 고딕", Dotum, "돋움", "Noto Sans KR", Arial, sans-serif !important;
font-style: normal !important;
}
body.careers-page:not(.lang-en) .application-form .privacy-box,
body.careers-page:not(.lang-en) .application-form .privacy-box * {
font-family: "Malgun Gothic", "맑은 고딕", Dotum, "돋움", "Noto Sans KR", Arial, sans-serif !important;
}
body.careers-page:not(.lang-en) .application-form .application-submit,
body.careers-page:not(.lang-en) .application-form .application-submit * {
font-family: "Malgun Gothic", "맑은 고딕", Dotum, "돋움", "Noto Sans KR", Arial, sans-serif !important;
}
/* =========================================================
v140 — careers header navigation typography correction
Restore the right-side careers header menu to the established
clean sans-serif interface face. Keep official logo artwork intact.
========================================================= */
.careers-page-header .careers-page-nav,
.careers-page-header .careers-page-nav a,
.careers-page-header .careers-page-nav span,
.careers-page-header .careers-page-nav .language-switch,
.careers-page-header .careers-page-nav .language-switch a,
.careers-page-header .careers-page-nav .language-divider {
font-family: "Noto Sans KR", "Malgun Gothic", "Apple SD Gothic Neo", Arial, Helvetica, sans-serif !important;
font-style: normal !important;
font-weight: 600 !important;
}
.careers-page-header .careers-page-nav {
font-size: 15px !important;
letter-spacing: 0 !important;
}
.careers-page-header .careers-page-nav .language-switch,
.careers-page-header .careers-page-nav .language-switch a,
.careers-page-header .careers-page-nav .language-divider {
font-size: 12px !important;
letter-spacing: .08em !important;
}
body.lang-en .careers-page-header .careers-page-nav,
body.lang-en .careers-page-header .careers-page-nav a,
body.lang-en .careers-page-header .careers-page-nav span {
font-family: Arial, Helvetica, sans-serif !important;
}
/* =========================================================
v141 — Contact hierarchy
Contact/문의 is the parent category. FAQ and Contact Details
are subsection labels under that category.
========================================================= */
#faq > .container > .inquiry-parent-eyebrow {
display: inline-flex;
align-items: center;
width: fit-content;
margin: 0 0 34px !important;
padding: 12px 22px;
border: 1px solid rgba(222,188,104,.65);
border-radius: 2px;
background: #081b33;
color: #debc68 !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 39px !important;
font-weight: 700 !important;
line-height: 1.15;
letter-spacing: .06em !important;
}
.inquiry-subsection-label {
display: block;
width: fit-content;
margin: 0 0 14px;
color: #081b33;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 18px;
font-weight: 800 !important;
line-height: 1.35;
letter-spacing: .08em;
}
#contact > .container > .inquiry-subsection-label {
margin-bottom: 24px;
}
html[lang="en"] .inquiry-subsection-label,
html[lang="en"] #faq > .container > .inquiry-parent-eyebrow {
font-family: Arial, Helvetica, sans-serif !important;
word-break: normal;
overflow-wrap: normal;
hyphens: none;
}
@media (max-width: 1100px) {
#faq > .container > .inquiry-parent-eyebrow {
font-size: 31px !important;
}
}
@media (max-width: 740px) {
#faq > .container > .inquiry-parent-eyebrow {
padding: 9px 14px;
font-size: 24px !important;
letter-spacing: .04em !important;
}
.inquiry-subsection-label {
font-size: 16px;
}
}
/* =========================================================
v142 — readable mixed-case typography on English careers pages
Cinzel is an all-capital display face. English recruitment copy
must preserve real lowercase letterforms for legibility.
Titles remain in Title Case; explanatory copy remains sentence case.
========================================================= */
body.lang-en.careers-page main,
body.lang-en.careers-page main p,
body.lang-en.careers-page main li,
body.lang-en.careers-page main span,
body.lang-en.careers-page main strong,
body.lang-en.careers-page main label,
body.lang-en.careers-page main legend,
body.lang-en.careers-page main dt,
body.lang-en.careers-page main dd,
body.lang-en.careers-page main a,
body.lang-en.careers-page main button,
body.lang-en.careers-page main input,
body.lang-en.careers-page main select,
body.lang-en.careers-page main textarea,
body.lang-en.careers-page main h3,
body.lang-en.careers-page main h4 {
font-family: Arial, Helvetica, sans-serif !important;
text-transform: none !important;
font-variant: normal !important;
font-variant-caps: normal !important;
font-feature-settings: normal !important;
word-spacing: normal !important;
}
/* True mixed-case serif is retained for major display headings only. */
body.lang-en.careers-page .careers-page-hero h1,
body.lang-en.careers-page .job-list-heading h2,
body.lang-en.careers-page .recruitment-overview-head h3,
body.lang-en.careers-page .job-posting-head h3,
body.lang-en.careers-page .application-intro h2,
body.lang-en.careers-page .thank-you-card h1 {
font-family: Georgia, "Times New Roman", serif !important;
text-transform: none !important;
font-variant: normal !important;
font-variant-caps: normal !important;
font-feature-settings: normal !important;
}
/* Small labels keep their authored Title Case rather than simulated capitals. */
body.lang-en.careers-page .eyebrow,
body.lang-en.careers-page .job-count,
body.lang-en.careers-page .job-division,
body.lang-en.careers-page .job-vacancy,
body.lang-en.careers-page .recruitment-facts strong,
body.lang-en.careers-page .blind-hiring-note strong {
font-family: Arial, Helvetica, sans-serif !important;
text-transform: none !important;
font-variant: normal !important;
font-variant-caps: normal !important;
font-feature-settings: normal !important;
letter-spacing: normal !important;
}
/* =========================================================
v143 — Korean careers hero heading serif restoration
Keep the recruitment hero message in the established Batang-style
serif while preserving sans-serif typography for supporting copy.
========================================================= */
body.careers-page:not(.lang-en) .careers-page-hero h1#careers-page-title {
font-family: "Noto Serif KR", "Batang", "바탕", Georgia, serif !important;
font-weight: 500;
}
/* =========================================================
v144 — FAQ intro body text on Korean page uses serif family
to match the intended inquiry-section tone.
========================================================= */
body:not(.lang-en) .faq-heading > p {
font-family: "Noto Serif KR", "KoPub Batang", "Batang", Georgia, serif;
font-weight: 400;
}
/* =========================================================
v145 — Contact parent label size correction
Match the FAQ parent label to the established section-label
dimensions used by Careers and other top-level categories.
========================================================= */
#faq > .container > .inquiry-parent-eyebrow {
margin: 0 0 22px !important;
padding: 8px 16px !important;
font-family: "Noto Sans KR", Arial, Helvetica, sans-serif !important;
font-size: 21px !important;
font-weight: 700 !important;
line-height: 1.15 !important;
letter-spacing: .03em !important;
}
html[lang="en"] #faq > .container > .inquiry-parent-eyebrow {
font-family: Arial, Helvetica, sans-serif !important;
}
/* =========================================================
v146 — Korean identity/publication labels in sans-serif
Official color/file headings, the primary-logo note, and
publication example labels should use Dotum-style sans-serif.
========================================================= */
body:not(.lang-en) .official-ci-primary > p,
body:not(.lang-en) .identity-colors h3,
body:not(.lang-en) .identity-usage h3,
body:not(.lang-en) .cover-example span,
body:not(.lang-en) .spine-example span {
font-family: "Noto Sans KR", "Malgun Gothic", "Apple SD Gothic Neo", Arial, Helvetica, sans-serif !important;
font-style: normal !important;
}
body:not(.lang-en) .official-ci-primary > p {
font-weight: 400 !important;
letter-spacing: -0.02em !important;
}
body:not(.lang-en) .identity-colors h3,
body:not(.lang-en) .identity-usage h3 {
font-weight: 700 !important;
letter-spacing: -0.02em !important;
}
body:not(.lang-en) .cover-example span,
body:not(.lang-en) .spine-example span {
font-weight: 700 !important;
letter-spacing: 0 !important;
}
/* =========================================================
v147 — English contact-card overlap repair
Reserve enough shared height for the three-line Head Office
address so the explanatory copy begins below it on every card.
========================================================= */
@media (min-width: 761px) {
body.lang-en .contact-card {
grid-template-rows: auto 2.3em minmax(5.2em, auto) minmax(3.2em, auto) !important;
row-gap: 10px !important;
}
body.lang-en .contact-card .contact-value,
body.lang-en .contact-card address.contact-value,
body.lang-en .contact-card a.contact-value {
min-height: 5.2em !important;
height: auto !important;
line-height: 1.42 !important;
overflow: visible !important;
}
body.lang-en .contact-card > p {
position: static !important;
min-height: 3.2em !important;
margin: 0 !important;
padding: 0 !important;
line-height: 1.55 !important;
overflow: visible !important;
}
}
/* =========================================================
v148 — reduce the Contact/문의 parent label further
The short two-character Korean label still appeared visually too large.
Match the box closer to the smaller section-label feel.
========================================================= */
#faq > .container > .inquiry-parent-eyebrow {
margin: 0 0 20px !important;
padding: 6px 12px !important;
font-size: 18px !important;
font-weight: 600 !important;
line-height: 1.12 !important;
letter-spacing: 0 !important;
}
html[lang="en"] #faq > .container > .inquiry-parent-eyebrow {
font-size: 18px !important;
letter-spacing: .01em !important;
}
@media (max-width: 740px) {
#faq > .container > .inquiry-parent-eyebrow {
padding: 6px 10px !important;
font-size: 17px !important;
}
}
/* =========================================================
v154 — detailed organization duties in bullet lists
========================================================= */
.org-chart-simple {
max-width: 1160px;
}
.org-simple-top {
width: min(540px, 100%);
padding: 28px 34px 30px;
}
.org-simple-dept {
min-height: 320px;
padding: 28px 28px 30px;
}
.org-duty-list {
display: grid;
gap: 9px;
width: 100%;
margin: 18px 0 0;
padding: 0;
list-style: none;
text-align: left;
}
.org-duty-list li {
position: relative;
margin: 0;
padding-left: 16px;
color: #e4dfd6;
font-family: "Noto Sans KR", "Malgun Gothic", "Apple SD Gothic Neo", Arial, Helvetica, sans-serif !important;
font-size: 14px;
font-weight: 400;
line-height: 1.58;
letter-spacing: -0.02em;
word-break: keep-all;
}
.org-duty-list li::before {
content: "•";
position: absolute;
left: 0;
top: 0;
color: #debc68;
font-weight: 700;
}
.org-simple-top .org-duty-list {
max-width: 455px;
margin-right: auto;
margin-left: auto;
}
body.lang-en .org-duty-list li {
font-family: Arial, Helvetica, sans-serif !important;
letter-spacing: 0;
word-break: normal;
overflow-wrap: normal;
hyphens: none;
}
@media (max-width: 980px) {
.org-simple-departments {
gap: 16px;
}
.org-simple-dept {
padding-right: 22px;
padding-left: 22px;
}
.org-duty-list li {
font-size: 13.5px;
}
}
@media (max-width: 740px) {
.org-simple-top,
.org-simple-dept {
min-height: 0;
padding: 26px 22px 28px;
}
.org-duty-list {
gap: 8px;
margin-top: 16px;
}
.org-duty-list li {
font-size: 14px;
line-height: 1.62;
}
}
/* =========================================================
v155 — compact president card without repeated duty copy
The organization introduction already explains the president's role.
Keep only the title and name inside the top card.
========================================================= */
.org-chart-simple .org-simple-top {
width: min(390px, 100%) !important;
min-height: 0 !important;
padding: 27px 30px !important;
}
.org-chart-simple .org-simple-top h3 {
margin-bottom: 0 !important;
}
@media (max-width: 740px) {
.org-chart-simple .org-simple-top {
width: min(360px, 100%) !important;
padding: 24px 22px !important;
}
}
/* =========================================================
v157 — equalize FAQ category and question box dimensions
Keep all three category panels aligned and give closed
question summaries a consistent height regardless of line count.
========================================================= */
.faq-category-grid {
align-items: stretch !important;
}
.faq-category {
display: flex !important;
flex-direction: column !important;
height: 100% !important;
box-sizing: border-box !important;
}
.faq-list {
flex: 1 1 auto !important;
}
.faq-item summary {
box-sizing: border-box !important;
min-height: 78px !important;
align-items: center !important;
}
.faq-item summary::after {
top: 50% !important;
transform: translateY(-50%);
}
.faq-item[open] summary::after {
transform: translateY(-50%) rotate(45deg) !important;
}
@media (max-width: 740px) {
.faq-category {
height: auto !important;
}
.faq-item summary {
min-height: 72px !important;
}
}
/* =========================================================
v158 — Korean FAQ intro and category headings in sans-serif
========================================================= */
body:not(.lang-en) .faq-heading > p,
body:not(.lang-en) .faq-category h3 {
font-family: "Noto Sans KR", "Malgun Gothic", "Apple SD Gothic Neo", "Dotum", Arial, Helvetica, sans-serif !important;
font-style: normal !important;
}
body:not(.lang-en) .faq-heading > p {
font-weight: 400 !important;
letter-spacing: -0.02em !important;
}
body:not(.lang-en) .faq-category h3 {
font-weight: 600 !important;
letter-spacing: -0.02em !important;
}
/* =========================================================
v161 — footer publisher registration number
Add the legal publisher registration detail while preserving
a compact, responsive footer layout.
========================================================= */
.footer-info {
grid-template-columns: auto minmax(255px, auto) auto auto minmax(240px, 1fr) !important;
column-gap: 28px !important;
row-gap: 12px !important;
align-items: start !important;
}
.footer-info > span {
min-width: 0;
line-height: 1.55;
}
.footer-info .footer-legal-info {
white-space: nowrap;
}
.footer-info .footer-address {
overflow-wrap: normal;
word-break: keep-all;
}
body.lang-en .footer-info .footer-address {
word-break: normal;
overflow-wrap: normal;
}
@media (max-width: 1380px) {
.footer-info {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
.footer-info .footer-legal-info {
white-space: normal;
}
.footer-info .footer-address {
grid-column: 1 / -1;
}
}
@media (max-width: 760px) {
.footer-info {
grid-template-columns: 1fr !important;
}
.footer-info .footer-address {
grid-column: auto;
}
}
/* =========================================================
v162 — footer labels on first line, values on second line
========================================================= */
.footer-info {
grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
align-items: start !important;
gap: 12px 24px !important;
}
.footer-info .footer-item,
.footer-info .footer-legal-info,
.footer-info .footer-address {
display: flex !important;
flex-direction: column !important;
align-items: flex-start !important;
gap: 6px !important;
min-width: 0 !important;
}
.footer-info .footer-item strong,
.footer-info .footer-legal-info strong,
.footer-info .footer-address strong {
display: block !important;
margin-right: 0 !important;
line-height: 1.15 !important;
}
.footer-info .footer-value,
.footer-info .footer-value a,
.footer-info .footer-legal-info .footer-value,
.footer-info .footer-address .footer-value {
display: block !important;
line-height: 1.35 !important;
word-break: keep-all !important;
overflow-wrap: anywhere !important;
}
@media (max-width: 1100px) {
.footer-info { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 740px) {
.footer-info { grid-template-columns: 1fr !important; }
}
/* =========================================================
v163 — widen footer spacing so email and business registration
do not visually collide on desktop.
========================================================= */
.footer-info {
column-gap: 34px !important;
}
.footer-info > :nth-child(2) { min-width: 230px !important; }
.footer-info > :nth-child(3) { min-width: 190px !important; }
.footer-info > :nth-child(4) { min-width: 190px !important; }
.footer-info > :nth-child(5) { min-width: 170px !important; }
@media (max-width: 1280px) {
.footer-info {
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
row-gap: 16px !important;
}
.footer-info > :nth-child(2),
.footer-info > :nth-child(3),
.footer-info > :nth-child(4),
.footer-info > :nth-child(5) {
min-width: 0 !important;
}
}
@media (max-width: 1100px) {
.footer-info {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
column-gap: 26px !important;
}
}
@media (max-width: 740px) {
.footer-info {
grid-template-columns: 1fr !important;
column-gap: 0 !important;
}
}
/* =========================================================
v164 — definitive footer column sizing
Give the email column enough width instead of equal-width tracks.
========================================================= */
.footer-info {
grid-template-columns: 165px 280px 175px 205px minmax(220px, 1fr) !important;
column-gap: 28px !important;
row-gap: 14px !important;
}
.footer-info > * {
min-width: 0 !important;
}
.footer-info > :nth-child(2) .footer-value,
.footer-info > :nth-child(2) .footer-value a {
white-space: nowrap !important;
overflow-wrap: normal !important;
word-break: normal !important;
}
.footer-info > :nth-child(3) .footer-value,
.footer-info > :nth-child(4) .footer-value {
white-space: nowrap !important;
}
@media (max-width: 1260px) {
.footer-info {
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
column-gap: 32px !important;
}
.footer-info > :nth-child(2) .footer-value,
.footer-info > :nth-child(2) .footer-value a,
.footer-info > :nth-child(3) .footer-value,
.footer-info > :nth-child(4) .footer-value {
white-space: normal !important;
overflow-wrap: anywhere !important;
}
}
@media (max-width: 900px) {
.footer-info {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
column-gap: 28px !important;
}
}
@media (max-width: 620px) {
.footer-info {
grid-template-columns: 1fr !important;
column-gap: 0 !important;
}
}
/* =========================================================
v165 — align first line of contact-card descriptions
Give all contact-value blocks the same desktop height so the
explanatory copy starts on one common baseline.
========================================================= */
@media (min-width: 761px) {
.contact-card {
grid-template-rows: auto 2.3em 5.4em minmax(3.2em, auto) !important;
}
.contact-card .contact-value,
.contact-card address.contact-value,
.contact-card a.contact-value {
height: 5.4em !important;
min-height: 5.4em !important;
}
}
/* =========================================================
v166 — English official-logo note in true Title Case
========================================================= */
body.lang-en .official-ci-primary > p {
font-family: Georgia, "Times New Roman", serif !important;
font-variant: normal !important;
text-transform: none !important;
letter-spacing: 0 !important;
}
/* =========================================================
v168 — publisher metadata on all current books
Current website editions, including the poetry collection,
are published by Indiepub. Archivist Works editions are not
displayed until their ISBN/publication status is finalized.
========================================================= */
.book-publisher {
margin: -2px 0 12px !important;
color: #6f685f !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 13px !important;
font-weight: 400 !important;
line-height: 1.45 !important;
letter-spacing: 0 !important;
}
.book-publisher span {
margin-right: 7px;
color: #081b33 !important;
font-weight: 700 !important;
}
body.lang-en .book-publisher,
body.lang-en .book-publisher span {
font-family: Arial, Helvetica, sans-serif !important;
}
.founder-featured-publisher {
display: block;
margin: 4px 0 8px;
color: #6f685f;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif;
font-size: 12px;
font-weight: 500;
line-height: 1.4;
letter-spacing: 0;
}
body.lang-en .founder-featured-publisher {
font-family: Arial, Helvetica, sans-serif;
}
.founder-publication-publisher {
margin: 6px 0 0 !important;
color: #7a736a !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 11px !important;
font-weight: 500 !important;
line-height: 1.35 !important;
letter-spacing: 0 !important;
}
body.lang-en .founder-publication-publisher {
font-family: Arial, Helvetica, sans-serif !important;
}
/* =========================================================
v170 — founder entity definition for search/AI clarity
========================================================= */
.founder-entity-title {
margin: 0 0 14px;
color: var(--ink);
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif;
font-size: 24px;
font-weight: 700;
line-height: 1.6;
letter-spacing: -0.02em;
}
.founder-official-definition {
margin: 0 0 28px;
color: var(--muted);
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif;
font-size: 24px;
font-weight: 400;
line-height: 1.85;
word-break: keep-all;
}
body.lang-en .founder-entity-title,
body.lang-en .founder-official-definition {
font-family: Arial, Helvetica, sans-serif;
letter-spacing: 0;
word-break: normal;
overflow-wrap: normal;
}
@media (max-width: 760px) {
.founder-entity-title { font-size: 20px; }
.founder-official-definition { font-size: 19px; line-height: 1.8; }
}
/* =========================================================
v172 — new Archivist Works eBook ISBN cards under founder blog
========================================================= */
.founder-new-isbn-section {
margin-top: 28px;
padding-top: 28px;
border-top: 1px solid var(--line);
}
.founder-new-isbn-heading {
margin-bottom: 20px;
}
.founder-new-isbn-heading h4 {
margin: 7px 0 8px;
color: var(--ink);
font-size: clamp(22px, 2vw, 30px);
line-height: 1.3;
}
.founder-new-isbn-heading p {
max-width: 760px;
margin: 0;
color: var(--muted);
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif;
font-size: 14px;
line-height: 1.75;
word-break: keep-all;
}
.founder-new-isbn-grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 18px;
}
.founder-isbn-card {
min-width: 0;
border: 1px solid var(--line);
background: var(--paper, #f6f3ee);
display: flex;
flex-direction: column;
}
.founder-isbn-card figure {
margin: 0;
padding: 16px;
height: 260px;
display: flex;
align-items: center;
justify-content: center;
background: #f6f3ee;
border-bottom: 1px solid var(--line);
overflow: hidden;
}
.founder-isbn-card figure img {
display: block;
max-width: 100%;
max-height: 100%;
width: auto;
height: auto;
object-fit: contain;
}
.founder-isbn-card-body {
padding: 16px 17px 18px;
display: flex;
flex-direction: column;
flex: 1;
}
.founder-isbn-status {
display: block;
margin-bottom: 10px;
color: var(--gold, #b9892e);
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif;
font-size: 11px;
font-weight: 700;
line-height: 1.45;
}
.founder-isbn-card h5 {
margin: 0 0 15px;
color: var(--ink);
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif;
font-size: 15px;
font-weight: 700;
line-height: 1.55;
word-break: keep-all;
}
.founder-isbn-card dl {
margin: auto 0 0;
padding-top: 12px;
border-top: 1px solid var(--line);
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif;
font-size: 12px;
}
.founder-isbn-card dl div {
display: flex;
justify-content: space-between;
gap: 12px;
}
.founder-isbn-card dt { color: var(--muted); }
.founder-isbn-card dd { margin: 0; color: var(--ink); font-weight: 600; }
body.lang-en .founder-new-isbn-heading p,
body.lang-en .founder-isbn-status,
body.lang-en .founder-isbn-card h5,
body.lang-en .founder-isbn-card dl {
font-family: Arial, Helvetica, sans-serif;
word-break: normal;
}
@media (max-width: 1080px) {
.founder-new-isbn-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
.founder-new-isbn-section { margin-top: 22px; padding-top: 22px; }
.founder-new-isbn-grid { grid-template-columns: 1fr; gap: 14px; }
.founder-isbn-card figure { height: 300px; }
}
/* =========================================================
v173 — complete Archivist Works ISBN record (20 entries)
========================================================= */
.founder-isbn-group-title {
margin: 24px 0 14px;
color: var(--ink);
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif;
font-size: 16px;
font-weight: 700;
line-height: 1.4;
}
.founder-isbn-group-title-print {
margin-top: 34px;
padding-top: 26px;
border-top: 1px solid var(--line);
}
.founder-isbn-card dl { display: grid; gap: 7px; }
.founder-isbn-card dl div { align-items: baseline; }
.founder-isbn-card dl dd { text-align: right; overflow-wrap: anywhere; }
.founder-isbn-status.is-resubmitted { color: #9a6a19; }
.founder-isbn-placeholder {
flex-direction: column;
gap: 12px;
padding: 30px !important;
text-align: center;
background: linear-gradient(180deg,#f7f3eb 0%,#efe8dc 100%) !important;
}
.founder-isbn-placeholder span {
color: var(--gold,#b9892e);
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif;
font-size: 12px;
font-weight: 700;
}
.founder-isbn-placeholder strong {
max-width: 240px;
color: var(--ink);
font-family: "Noto Serif KR", serif;
font-size: 20px;
font-weight: 500;
line-height: 1.55;
word-break: keep-all;
}
.founder-isbn-note {
margin: 18px 0 0;
color: var(--muted);
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif;
font-size: 12px;
line-height: 1.65;
}
body.lang-en .founder-isbn-group-title,
body.lang-en .founder-isbn-placeholder span,
body.lang-en .founder-isbn-placeholder strong,
body.lang-en .founder-isbn-note {
font-family: Arial, Helvetica, sans-serif;
word-break: normal;
}
/* =========================================================
v175 — founding collection copy and chronology cleanup
========================================================= */
.founder-new-isbn-heading p {
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-style: normal !important;
letter-spacing: -0.01em !important;
line-height: 1.75 !important;
}
.founder-isbn-status {
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
}
body.lang-en .founder-new-isbn-heading p,
body.lang-en .founder-isbn-status {
font-family: Arial, Helvetica, sans-serif !important;
letter-spacing: 0 !important;
}
/* =========================================================
v176 — Featured Works becomes a non-clickable exhibition grid
========================================================= */
.founder-featured-card {
cursor: default !important;
transition: none !important;
}
.founder-featured-card:hover,
.founder-featured-card:focus-visible {
transform: none !important;
border-color: var(--line) !important;
box-shadow: none !important;
outline: none !important;
}
.founder-featured-date {
display: block;
margin: -3px 0 10px;
color: #6f685f;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif;
font-size: 12px;
font-weight: 500;
line-height: 1.4;
letter-spacing: 0;
}
body.lang-en .founder-featured-date {
font-family: Arial, Helvetica, sans-serif;
}
/* =========================================================
v177 — founder narrative: selected works / pre-founding / post-founding
========================================================= */
.founder-publication-gallery {
position: relative;
}
.founder-publication-gallery::before {
content: "02";
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 38px;
height: 30px;
margin-bottom: 14px;
border: 1px solid rgba(222,188,104,.72);
color: #a47719;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif;
font-size: 13px;
font-weight: 700;
}
.founder-post-founding-section {
position: relative;
margin-top: 58px !important;
padding-top: 48px !important;
border-top: 1px solid rgba(222,188,104,.4);
}
.founder-post-founding-section::before {
content: "03";
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 38px;
height: 30px;
margin-bottom: 14px;
border: 1px solid rgba(222,188,104,.72);
color: #a47719;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif;
font-size: 13px;
font-weight: 700;
}
.founder-featured-works { position: relative; }
.founder-featured-works::before {
content: "01";
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 38px;
height: 30px;
margin-bottom: 14px;
border: 1px solid rgba(222,188,104,.72);
color: #a47719;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif;
font-size: 13px;
font-weight: 700;
}
.founder-collection-stats {
display: grid;
grid-template-columns: repeat(4, minmax(0,1fr));
gap: 10px;
margin-top: 22px;
}
.founder-collection-stats > div {
border: 1px solid rgba(222,188,104,.55);
padding: 13px 14px;
min-height: 62px;
display: flex;
flex-direction: column;
justify-content: center;
}
.founder-collection-stats strong {
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif;
font-size: 17px;
line-height: 1.15;
color: #071b34;
}
.founder-collection-stats span {
margin-top: 5px;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif;
font-size: 12px;
color: #766b5d;
}
.founder-isbn-group-title {
margin-top: 34px !important;
}
.founding-edition-card .founder-isbn-status {
color: #a47719 !important;
}
.founder-isbn-placeholder-cover {
background: #f4ebdc !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
.founder-isbn-placeholder-inner {
width: 100%;
min-height: 230px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 22px;
box-sizing: border-box;
}
.founder-isbn-placeholder-inner img {
width: 54px !important;
height: auto !important;
object-fit: contain !important;
margin-bottom: 22px;
}
.founder-isbn-placeholder-inner span {
font-family: "Noto Serif KR", serif;
font-size: 20px;
line-height: 1.45;
text-align: center;
color: #27231f;
}
body.lang-en .founder-collection-stats strong,
body.lang-en .founder-collection-stats span { font-family: Arial, Helvetica, sans-serif; }
@media (max-width: 980px) {
.founder-collection-stats { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 620px) {
.founder-collection-stats { grid-template-columns: 1fr; }
}
/* =========================================================
v179 — founder identity simplification and 8 business lines
========================================================= */
.founder-business-lines {
display: grid !important;
grid-template-columns: 1fr !important;
gap: 10px !important;
margin-top: 4px !important;
margin-bottom: 0 !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 20.8px !important;
line-height: 1.7 !important;
color: var(--muted) !important;
}
.founder-business-lines > span {
display: block !important;
position: relative !important;
padding-left: 16px !important;
word-break: keep-all !important;
}
.founder-business-lines > span::before {
content: "·";
position: absolute;
left: 0;
top: 0;
color: var(--gold) !important;
}
body.lang-en .founder-business-lines {
font-family: Arial, Helvetica, sans-serif !important;
word-break: normal !important;
}
body.lang-en .founder-business-lines > span {
word-break: normal !important;
overflow-wrap: normal !important;
}
@media (max-width: 760px) {
.founder-business-lines { font-size: 18px !important; gap: 8px !important; }
}
/* =========================================================
v186 — book card: detail / purchase / Google AI actions
========================================================= */
.book-actions {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 6px;
margin-top: auto;
align-items: stretch;
}
.book-actions > a,
.book-actions > button {
min-width: 0;
min-height: 42px;
padding: 9px 7px;
display: inline-flex;
align-items: center;
justify-content: center;
text-align: center;
white-space: nowrap;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif;
font-size: 12px;
line-height: 1.2;
font-weight: 700;
border: 1px solid #191919;
background: #fff;
color: #111;
text-decoration: none;
cursor: pointer;
box-sizing: border-box;
}
.book-actions > a:hover,
.book-actions > button:hover,
.book-actions > a:focus-visible,
.book-actions > button:focus-visible {
background: #081B33;
border-color: #081B33;
color: #DEBC68;
}
.purchase-dialog {
width: min(520px, calc(100vw - 32px));
border: 0;
padding: 0;
background: #f8f5ef;
box-shadow: 0 22px 70px rgba(0,0,0,.30);
}
.purchase-dialog::backdrop { background: rgba(0,0,0,.55); }
.purchase-dialog-inner { padding: 30px; position: relative; }
.purchase-dialog .dialog-close {
position: absolute; right: 18px; top: 14px;
border: 0; background: transparent; font-size: 28px; cursor: pointer;
}
.purchase-dialog-kicker {
margin: 0 0 8px; color: #b58a2c; font: 700 12px/1.4 "Noto Sans KR", sans-serif;
letter-spacing: .06em;
}
.purchase-dialog h2 { margin: 0 40px 10px 0; font-size: 24px; line-height: 1.35; }
.purchase-dialog-note { margin: 0 0 22px; color: #5a554e; font-size: 14px; line-height: 1.7; }
.purchase-store-list { display: grid; gap: 9px; }
.purchase-store-list a {
display: flex; align-items: center; justify-content: space-between;
min-height: 48px; padding: 0 16px; border: 1px solid #d8d0c3;
background: #fff; color: #081B33; text-decoration: none; font-weight: 700;
}
.purchase-store-list a:first-child { border-color: #DEBC68; box-shadow: inset 3px 0 0 #DEBC68; }
.purchase-store-list a:hover { border-color: #081B33; }
.founding-card-actions {
display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 6px; margin-top: 14px;
}
.founding-card-actions a, .founding-card-actions button {
min-height: 38px; padding: 7px 5px; border: 1px solid #bfb7aa; background:#fff; color:#081B33;
text-decoration:none; font:700 11px/1.2 "Noto Sans KR", sans-serif; cursor:pointer;
}
@media (max-width: 680px) {
.book-actions { gap: 5px; }
.book-actions > a, .book-actions > button { font-size: 11px; padding: 8px 4px; }
.purchase-dialog-inner { padding: 26px 20px; }
}
/* =========================================================
v187 — founder identity body text to dotum/sans family
========================================================= */
.founder-identity .founder-entity-title,
.founder-identity .founder-official-definition,
.founder-identity .founder-business-lines,
.founder-identity .founder-business-lines > span {
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-style: normal !important;
letter-spacing: -0.01em !important;
}
body.lang-en .founder-identity .founder-entity-title,
body.lang-en .founder-identity .founder-official-definition,
body.lang-en .founder-identity .founder-business-lines,
body.lang-en .founder-identity .founder-business-lines > span {
font-family: Arial, Helvetica, sans-serif !important;
letter-spacing: 0 !important;
}
/* =========================================================
v188 — founder role visibility refinement
========================================================= */
.founder-identity .founder-role {
color: #081B33 !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 16.5px !important;
font-weight: 700 !important;
line-height: 1.4 !important;
letter-spacing: .08em !important;
margin-bottom: 12px !important;
}
body.lang-en .founder-identity .founder-role {
font-family: Arial, Helvetica, sans-serif !important;
color: #081B33 !important;
font-size: 16.5px !important;
}
/* =========================================================
v189 — hero description visibility
========================================================= */
.hero-copy {
font-size: 29px !important;
line-height: 1.55 !important;
max-width: 900px !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
word-break: keep-all !important;
}
body.lang-en .hero-copy {
font-family: Arial, Helvetica, sans-serif !important;
word-break: normal !important;
}
/* =========================================================
v190 — founder role cards: 2 columns × 3 rows and larger duty copy
========================================================= */
.founder-category-grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 20px !important;
}
.founder-category {
min-height: 330px !important;
padding: 28px 26px !important;
}
.founder-category p.founder-six-lines {
min-height: 9.3em !important;
font-size: 18px !important;
line-height: 1.55 !important;
letter-spacing: -0.015em !important;
}
.founder-category p.founder-six-lines .founder-desc-line {
font-size: inherit !important;
line-height: inherit !important;
}
html[lang="en"] .founder-category p.founder-six-lines {
font-size: 17.25px !important;
line-height: 1.5 !important;
}
@media (max-width: 760px) {
.founder-category-grid {
grid-template-columns: 1fr !important;
}
.founder-category {
min-height: 0 !important;
padding: 26px 22px !important;
}
.founder-category p.founder-six-lines,
html[lang="en"] .founder-category p.founder-six-lines {
min-height: 0 !important;
font-size: 18px !important;
}
.founder-category p.founder-six-lines .founder-desc-line {
white-space: normal !important;
}
}
/* v191: founder featured works 2x2 grid and larger typography */
.founder-featured-grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 1.75rem !important;
}
.founder-featured-card {
min-height: 100% !important;
}
.founder-featured-body {
padding: 1.6rem 1.5rem 1.7rem !important;
gap: 0.5rem !important;
}
.founder-featured-category {
font-size: 1.05rem !important;
line-height: 1.45 !important;
}
.founder-featured-publisher,
.founder-featured-date {
font-size: 0.98rem !important;
line-height: 1.5 !important;
}
.founder-featured-body strong {
font-size: 1.9rem !important;
line-height: 1.38 !important;
}
.founder-featured-body p {
font-size: 1.08rem !important;
line-height: 1.78 !important;
}
@media (max-width: 900px) {
.founder-featured-grid {
grid-template-columns: 1fr !important;
}
.founder-featured-body {
padding: 1.4rem 1.25rem 1.45rem !important;
}
.founder-featured-category {
font-size: 1rem !important;
}
.founder-featured-publisher,
.founder-featured-date {
font-size: 0.94rem !important;
}
.founder-featured-body strong {
font-size: 1.55rem !important;
}
.founder-featured-body p {
font-size: 1rem !important;
line-height: 1.72 !important;
}
}
/* v192: pre-founding publication cards 2-column layout and stronger meta visibility */
.founder-publication-card-grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
.founder-publication-meta {
min-height: 64px !important;
margin-bottom: 14px !important;
}
.founder-publication-genre {
color: #081b33 !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 18px !important;
font-weight: 700 !important;
line-height: 1.45 !important;
}
.founder-publication-meta time {
color: #5f5850 !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 28px !important;
font-weight: 700 !important;
line-height: 1.3 !important;
}
.founder-publication-publisher {
margin-top: 10px !important;
color: #766d60 !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 22px !important;
font-weight: 500 !important;
line-height: 1.45 !important;
}
@media (max-width: 1120px) {
.founder-publication-card-grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
}
@media (max-width: 720px) {
.founder-publication-card-grid {
grid-template-columns: 1fr !important;
}
.founder-publication-genre {
font-size: 16px !important;
}
.founder-publication-meta time {
font-size: 21px !important;
}
.founder-publication-publisher {
font-size: 17px !important;
}
}
/* v193 — founding collection unified with pre-founding archive cards */
.founder-new-isbn-grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 18px !important;
}
.founding-edition-card .founder-isbn-card-body {
padding: 20px 21px 22px !important;
}
.founding-edition-meta {
min-height: 64px !important;
margin-bottom: 14px !important;
}
.founding-edition-publisher {
margin: 12px 0 0 !important;
}
.founding-edition-card h5 {
margin: 0 !important;
color: var(--ink) !important;
font-family: "Noto Serif KR", serif !important;
font-size: 30px !important;
font-weight: 500 !important;
line-height: 1.42 !important;
letter-spacing: -0.02em !important;
word-break: keep-all !important;
}
.founding-edition-card .founding-card-actions {
margin-top: auto !important;
padding-top: 16px !important;
}
@media (max-width: 1080px) {
.founder-new-isbn-grid {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
}
@media (max-width: 720px) {
.founder-new-isbn-grid {
grid-template-columns: 1fr !important;
}
.founding-edition-card h5 {
font-size: 24px !important;
}
}
/* =========================================================
v194 — founding collection rhythm, title baselines and actions
========================================================= */
.founder-post-founding-section .founder-isbn-group-title {
margin: 42px 0 20px !important;
color: #081B33 !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 25px !important;
font-weight: 700 !important;
line-height: 1.35 !important;
}
.founder-post-founding-section .founder-isbn-group-title-print {
margin-top: 78px !important;
padding-top: 48px !important;
border-top: 1px solid rgba(8,27,51,.22) !important;
}
.founder-post-founding-section .founder-new-isbn-grid {
grid-template-columns: repeat(2, minmax(0,1fr)) !important;
gap: 22px !important;
}
.founder-post-founding-section .founder-isbn-card {
background: #fff !important;
}
.founder-post-founding-section .founder-isbn-card figure {
height: 340px !important;
padding: 20px !important;
background: #f6f3ee !important;
}
.founder-post-founding-section .founder-isbn-card figure img {
max-height: 300px !important;
}
.founder-post-founding-section .founder-isbn-card-body {
padding: 22px 24px 24px !important;
}
.founder-post-founding-section .founding-edition-meta {
min-height: 64px !important;
margin-bottom: 16px !important;
}
.founder-post-founding-section .founder-publication-genre {
color: #081B33 !important;
}
.founder-post-founding-section .founding-edition-card h5 {
min-height: 128px !important;
margin: 0 !important;
display: flex !important;
align-items: flex-start !important;
color: #111 !important;
font-family: "Noto Serif KR", Georgia, serif !important;
font-size: 28px !important;
font-weight: 500 !important;
line-height: 1.48 !important;
letter-spacing: -0.025em !important;
word-break: keep-all !important;
}
.founder-post-founding-section .founding-edition-publisher {
min-height: 34px !important;
margin: 8px 0 0 !important;
display: flex !important;
align-items: flex-start !important;
}
.founder-post-founding-section .founding-card-actions {
grid-template-columns: repeat(3, minmax(0,1fr)) !important;
gap: 9px !important;
margin-top: auto !important;
padding-top: 22px !important;
}
.founder-post-founding-section .founding-card-actions > a,
.founder-post-founding-section .founding-card-actions > button {
width: 100% !important;
min-width: 0 !important;
height: 52px !important;
min-height: 52px !important;
padding: 0 8px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
box-sizing: border-box !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 14px !important;
font-weight: 700 !important;
line-height: 1.2 !important;
text-align: center !important;
}
body.lang-en .founder-post-founding-section .founder-isbn-group-title,
body.lang-en .founder-post-founding-section .founder-publication-genre,
body.lang-en .founder-post-founding-section .founding-edition-publisher,
body.lang-en .founder-post-founding-section .founding-card-actions > a,
body.lang-en .founder-post-founding-section .founding-card-actions > button {
font-family: Arial, Helvetica, sans-serif !important;
letter-spacing: 0 !important;
}
body.lang-en .founder-post-founding-section .founding-edition-card h5 {
font-family: Georgia, "Times New Roman", serif !important;
letter-spacing: 0 !important;
}
@media (max-width: 900px) {
.founder-post-founding-section .founder-isbn-card figure {
height: 300px !important;
}
.founder-post-founding-section .founding-edition-card h5 {
min-height: 112px !important;
font-size: 24px !important;
}
}
@media (max-width: 720px) {
.founder-post-founding-section .founder-new-isbn-grid {
grid-template-columns: 1fr !important;
}
.founder-post-founding-section .founder-isbn-group-title-print {
margin-top: 58px !important;
padding-top: 36px !important;
}
.founder-post-founding-section .founding-edition-card h5 {
min-height: 0 !important;
}
.founder-post-founding-section .founding-card-actions {
grid-template-columns: 1fr !important;
}
.founder-post-founding-section .founding-card-actions > a,
.founder-post-founding-section .founding-card-actions > button {
height: 48px !important;
min-height: 48px !important;
}
}
/* =========================================================
v196 — normalize founder role card 02 typography
========================================================= */
.founder-category-grid > .founder-category:nth-child(2) h4 {
font-size: 23px !important;
line-height: 1.35 !important;
font-weight: 500 !important;
}
.founder-category-grid > .founder-category:nth-child(2) p.founder-six-lines,
.founder-category-grid > .founder-category:nth-child(2) p.founder-six-lines .founder-desc-line {
font-size: 18px !important;
line-height: 1.55 !important;
letter-spacing: -0.015em !important;
font-family: "Noto Sans KR", Arial, sans-serif !important;
}
@media (max-width: 760px) {
.founder-category-grid > .founder-category:nth-child(2) p.founder-six-lines,
.founder-category-grid > .founder-category:nth-child(2) p.founder-six-lines .founder-desc-line {
font-size: 18px !important;
}
}
/* =========================================================
v197 — featured works metadata visibility + larger pre-founding stat cards
========================================================= */
/* Selected works: category, publisher, date */
.founder-featured-card .founder-featured-category {
color: #081B33 !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 1.5rem !important;
font-weight: 700 !important;
line-height: 1.4 !important;
letter-spacing: -0.015em !important;
margin-bottom: 12px !important;
}
.founder-featured-card .founder-featured-publisher,
.founder-featured-card .founder-featured-date {
color: #766d60 !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 1.25rem !important;
font-weight: 500 !important;
line-height: 1.5 !important;
letter-spacing: -0.015em !important;
}
.founder-featured-card .founder-featured-date {
margin-top: 4px !important;
margin-bottom: 18px !important;
}
/* Pre-founding top stat cards */
.founder-timeline-stats {
gap: 20px !important;
}
.founder-timeline-stats > div {
min-width: 220px !important;
min-height: 170px !important;
padding: 28px 22px !important;
border: 1px solid rgba(216, 201, 170, 0.95) !important;
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
align-items: center !important;
box-sizing: border-box !important;
}
.founder-timeline-stats strong {
font-size: 38px !important;
font-weight: 800 !important;
line-height: 1.1 !important;
}
.founder-timeline-stats span {
margin-top: 10px !important;
font-size: 22px !important;
font-weight: 600 !important;
line-height: 1.3 !important;
}
@media (max-width: 1280px) {
.founder-timeline-stats > div {
min-width: 180px !important;
min-height: 150px !important;
}
.founder-timeline-stats strong {
font-size: 32px !important;
}
.founder-timeline-stats span {
font-size: 19px !important;
}
}
@media (max-width: 760px) {
.founder-featured-card .founder-featured-category {
font-size: 1.2rem !important;
}
.founder-featured-card .founder-featured-publisher,
.founder-featured-card .founder-featured-date {
font-size: 1.05rem !important;
}
.founder-timeline-stats {
display: grid !important;
grid-template-columns: 1fr !important;
gap: 14px !important;
}
.founder-timeline-stats > div {
min-width: 0 !important;
min-height: 120px !important;
width: 100% !important;
padding: 20px 16px !important;
}
.founder-timeline-stats strong {
font-size: 28px !important;
}
.founder-timeline-stats span {
font-size: 18px !important;
}
}
/* =========================================================
v198 — founding collection intro/stats enlarged and publication dates reduced
========================================================= */
/* Post-founding archive intro copy */
.founder-post-founding-section .founder-new-isbn-heading p {
max-width: 980px !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 42px !important; /* about 3x from 14px base */
font-weight: 500 !important;
line-height: 1.55 !important;
letter-spacing: -0.02em !important;
color: #6a635b !important;
}
/* Four summary cards under founding collection */
.founder-post-founding-section .founder-collection-stats {
gap: 24px !important;
margin-top: 28px !important;
}
.founder-post-founding-section .founder-collection-stats > div {
min-height: 186px !important;
padding: 34px 28px !important;
border-width: 1px !important;
}
.founder-post-founding-section .founder-collection-stats strong {
font-size: 51px !important;
font-weight: 800 !important;
line-height: 1.08 !important;
}
.founder-post-founding-section .founder-collection-stats span {
margin-top: 12px !important;
font-size: 24px !important;
font-weight: 600 !important;
line-height: 1.28 !important;
}
/* Reduce publication dates in archive and founding cards to about 50% */
.founder-publication-meta time,
.founder-post-founding-section .founder-publication-meta time,
.founder-post-founding-section .founding-edition-meta time {
font-size: 14px !important;
font-weight: 700 !important;
line-height: 1.3 !important;
}
@media (max-width: 1280px) {
.founder-post-founding-section .founder-new-isbn-heading p {
font-size: 34px !important;
}
.founder-post-founding-section .founder-collection-stats > div {
min-height: 162px !important;
padding: 28px 22px !important;
}
.founder-post-founding-section .founder-collection-stats strong {
font-size: 42px !important;
}
.founder-post-founding-section .founder-collection-stats span {
font-size: 20px !important;
}
}
@media (max-width: 900px) {
.founder-post-founding-section .founder-new-isbn-heading p {
font-size: 24px !important;
line-height: 1.55 !important;
}
.founder-post-founding-section .founder-collection-stats {
grid-template-columns: repeat(2, minmax(0,1fr)) !important;
gap: 16px !important;
}
.founder-post-founding-section .founder-collection-stats > div {
min-height: 134px !important;
padding: 22px 18px !important;
}
.founder-post-founding-section .founder-collection-stats strong {
font-size: 34px !important;
}
.founder-post-founding-section .founder-collection-stats span {
font-size: 18px !important;
}
}
@media (max-width: 640px) {
.founder-post-founding-section .founder-new-isbn-heading p {
font-size: 19px !important;
}
.founder-post-founding-section .founder-collection-stats {
grid-template-columns: 1fr !important;
}
.founder-post-founding-section .founder-collection-stats > div {
min-height: 112px !important;
padding: 18px 16px !important;
}
.founder-post-founding-section .founder-collection-stats strong {
font-size: 28px !important;
}
.founder-post-founding-section .founder-collection-stats span {
font-size: 16px !important;
}
.founder-publication-meta time,
.founder-post-founding-section .founder-publication-meta time,
.founder-post-founding-section .founding-edition-meta time {
font-size: 12px !important;
}
}
/* =========================================================
v199 — founder duty copy, blog/project descriptions, CTA button
========================================================= */
/* Founder identity: 8 business lines, 1.5x from v198 */
.founder-identity .founder-business-lines {
font-size: 31.2px !important;
line-height: 1.72 !important;
gap: 12px !important;
}
.founder-identity .founder-business-lines > span {
padding-left: 20px !important;
}
/* Blog explanatory sentence, 1.5x */
.founder-blog-card p {
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 21px !important;
line-height: 1.72 !important;
color: rgba(246,243,238,.86) !important;
}
/* Turn the blog visit text into a real visual button box */
.founder-blog-cta {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
min-height: 52px !important;
padding: 0 20px !important;
border: 1px solid #DEBC68 !important;
background: transparent !important;
color: #DEBC68 !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 16px !important;
font-weight: 700 !important;
line-height: 1.2 !important;
text-decoration: none !important;
white-space: nowrap !important;
box-sizing: border-box !important;
transition: background-color .18s ease, color .18s ease, border-color .18s ease !important;
}
.founder-blog-card:hover .founder-blog-cta,
.founder-blog-card:focus-visible .founder-blog-cta {
background: #DEBC68 !important;
color: #081B33 !important;
}
/* Current-writing-project explanatory sentence, 1.5x */
.founder-current-project p {
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 24px !important;
line-height: 1.7 !important;
}
body.lang-en .founder-identity .founder-business-lines,
body.lang-en .founder-blog-card p,
body.lang-en .founder-blog-cta,
body.lang-en .founder-current-project p {
font-family: Arial, Helvetica, sans-serif !important;
}
@media (max-width: 1100px) {
.founder-identity .founder-business-lines {
font-size: 25px !important;
}
.founder-blog-card p {
font-size: 18px !important;
}
.founder-current-project p {
font-size: 20px !important;
}
}
@media (max-width: 740px) {
.founder-identity .founder-business-lines {
font-size: 19px !important;
line-height: 1.68 !important;
gap: 8px !important;
}
.founder-blog-card p {
font-size: 17px !important;
}
.founder-blog-cta {
width: 100% !important;
margin-top: 12px !important;
}
.founder-current-project p {
font-size: 18px !important;
}
}
/* =========================================================
v200 — organization English titles x3, duty copy x1.5
========================================================= */
.org-chart-simple .org-node > span {
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 33px !important;
font-weight: 700 !important;
line-height: 1.18 !important;
letter-spacing: .04em !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
}
.org-chart-simple .org-duty-list {
gap: 12px !important;
margin-top: 22px !important;
}
.org-chart-simple .org-duty-list li {
padding-left: 20px !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 21px !important;
font-weight: 400 !important;
line-height: 1.62 !important;
letter-spacing: -0.02em !important;
}
.org-chart-simple .org-simple-top {
width: min(520px, 100%) !important;
padding: 34px 34px 32px !important;
}
.org-chart-simple .org-simple-dept {
min-height: 430px !important;
padding: 34px 30px 36px !important;
}
body.lang-en .org-chart-simple .org-node > span,
body.lang-en .org-chart-simple .org-duty-list li {
font-family: Arial, Helvetica, sans-serif !important;
letter-spacing: 0 !important;
}
@media (max-width: 1180px) {
.org-chart-simple .org-node > span {
font-size: 28px !important;
}
.org-chart-simple .org-duty-list li {
font-size: 19px !important;
}
}
@media (max-width: 740px) {
.org-chart-simple .org-node > span {
font-size: 24px !important;
}
.org-chart-simple .org-duty-list li {
font-size: 18px !important;
line-height: 1.6 !important;
}
.org-chart-simple .org-simple-top,
.org-chart-simple .org-simple-dept {
min-height: 0 !important;
}
}
/* =========================================================
v201 — desktop descriptive copy legibility refinement
Enlarges narrative/supporting text on PC only.
========================================================= */
@media (min-width: 1101px) {
/* CI introductory and primary-logo descriptions */
.identity-heading > p {
font-size: 26px !important;
line-height: 1.72 !important;
}
.official-ci-primary > p {
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 21px !important;
line-height: 1.7 !important;
letter-spacing: -0.015em !important;
}
/* Three CI principle cards */
.identity-concept-grid p {
font-size: 21px !important;
line-height: 1.7 !important;
}
/* Publication CI copy and bullet standards */
.publication-ci-copy > p,
.publication-ci-copy li {
font-size: 20px !important;
line-height: 1.75 !important;
}
/* Official color note and official-file rules */
.identity-small-note {
font-size: 19px !important;
line-height: 1.7 !important;
}
.identity-usage li {
font-size: 20px !important;
line-height: 1.65 !important;
padding-top: 18px !important;
padding-bottom: 18px !important;
}
/* Business section supporting copy */
.business-heading > p {
font-size: 30px !important;
line-height: 1.72 !important;
}
.business-card p {
font-size: 29px !important;
line-height: 1.72 !important;
}
.business-card .text-link {
font-size: 23px !important;
}
/* Organization supporting paragraph */
.organization-heading > p {
font-size: 29px !important;
line-height: 1.72 !important;
}
/* General section-level supporting descriptions visible beside large headings */
.section-heading-row > p,
.records-heading > p,
.contact-intro {
font-size: 28px !important;
line-height: 1.72 !important;
}
}
body.lang-en .official-ci-primary > p,
body.lang-en .identity-heading > p,
body.lang-en .identity-concept-grid p,
body.lang-en .publication-ci-copy > p,
body.lang-en .publication-ci-copy li,
body.lang-en .identity-small-note,
body.lang-en .identity-usage li,
body.lang-en .business-heading > p,
body.lang-en .business-card p,
body.lang-en .organization-heading > p {
font-family: Arial, Helvetica, sans-serif !important;
}
/* =========================================================
v203 — current-edition publishing metadata, cover assets and action typography
========================================================= */
/* Current publication catalogue: publisher + description doubled for PC readability. */
@media (min-width: 901px) {
.book-grid .book-publisher {
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 26px !important;
line-height: 1.5 !important;
margin-bottom: 18px !important;
}
.book-grid .book-publisher span {
font-family: inherit !important;
font-size: inherit !important;
}
.book-grid .book-card > p:not(.book-publisher) {
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 28px !important;
line-height: 1.72 !important;
}
}
/* Detail / purchase / AI analysis buttons: exact same typography. */
.book-actions .book-detail-button,
.book-actions .book-purchase-button,
.book-actions .book-ai-link,
.book-actions > button,
.book-actions > a {
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 15px !important;
font-weight: 700 !important;
line-height: 1.2 !important;
letter-spacing: 0 !important;
}
/* Founding collection action buttons use the same visual weight. */
.founder-post-founding-section .founding-card-actions > button,
.founder-post-founding-section .founding-card-actions > a {
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 15px !important;
font-weight: 700 !important;
line-height: 1.2 !important;
}
body.lang-en .book-grid .book-publisher,
body.lang-en .book-grid .book-card > p:not(.book-publisher),
body.lang-en .book-actions > button,
body.lang-en .book-actions > a {
font-family: Arial, Helvetica, sans-serif !important;
}
@media (max-width: 900px) {
.book-actions .book-detail-button,
.book-actions .book-purchase-button,
.book-actions .book-ai-link,
.book-actions > button,
.book-actions > a,
.founder-post-founding-section .founding-card-actions > button,
.founder-post-founding-section .founding-card-actions > a {
font-size: 13px !important;
}
}
/* =========================================================
v204 — founder 8-line duty copy reduced to one-third
========================================================= */
.founder-identity .founder-business-lines {
font-size: 10.4px !important; /* 31.2px × 1/3 */
line-height: 1.62 !important;
gap: 6px !important;
}
.founder-identity .founder-business-lines > span {
padding-left: 11px !important;
}
@media (max-width: 1100px) {
.founder-identity .founder-business-lines {
font-size: 10.4px !important;
line-height: 1.62 !important;
gap: 6px !important;
}
}
@media (max-width: 740px) {
.founder-identity .founder-business-lines {
font-size: 10.4px !important;
line-height: 1.62 !important;
gap: 6px !important;
}
}
/* =========================================================
v205 — integrated publication/archive/organization refinement
========================================================= */
/* Pre-founding archive cards: same metadata rhythm as Featured Works */
.founder-publication-card-body > .founder-featured-category,
.founder-publication-card-body > .founder-featured-publisher,
.founder-publication-card-body > .founder-featured-date {
display:block !important;
font-family:"Noto Sans KR","Malgun Gothic",Arial,sans-serif !important;
letter-spacing:-0.015em !important;
}
.founder-publication-card-body > .founder-featured-category {
color:#081B33 !important; font-size:24px !important; font-weight:700 !important; margin:0 0 10px !important;
}
.founder-publication-card-body > .founder-featured-publisher,
.founder-publication-card-body > .founder-featured-date {
color:#766d60 !important; font-size:20px !important; font-weight:500 !important; line-height:1.5 !important;
}
.founder-publication-card-body > .founder-featured-date { margin:4px 0 18px !important; }
.founder-publication-card-body h5 { margin-top:0 !important; }
/* Founding collection cards: same content hierarchy as Featured Works */
.founder-post-founding-section .founder-isbn-card-body > .founder-featured-category,
.founder-post-founding-section .founder-isbn-card-body > .founder-featured-publisher,
.founder-post-founding-section .founder-isbn-card-body > .founder-featured-date {
display:block !important; font-family:"Noto Sans KR","Malgun Gothic",Arial,sans-serif !important;
}
.founder-post-founding-section .founding-edition-category {
color:#081B33 !important; font-size:24px !important; font-weight:700 !important; margin:0 0 10px !important;
}
.founder-post-founding-section .founding-edition-publisher,
.founder-post-founding-section .founding-edition-date {
color:#766d60 !important; font-size:20px !important; font-weight:500 !important; line-height:1.5 !important; min-height:0 !important;
}
.founder-post-founding-section .founding-edition-date { margin:4px 0 18px !important; }
.founder-post-founding-section .founding-edition-card h5 {
min-height:0 !important; margin:0 0 18px !important;
}
.founder-post-founding-section .founding-edition-description {
margin:0 0 18px !important; color:#5f5850 !important;
font-family:"Noto Sans KR","Malgun Gothic",Arial,sans-serif !important;
font-size:15px !important; line-height:1.75 !important;
}
/* Current publication catalogue: image -> category -> publisher -> date -> title -> description */
.book-grid .book-card { padding-top:26px !important; }
.book-grid .book-cover-wrap { margin:0 0 20px !important; }
.book-grid .book-featured-category,
.book-grid .book-featured-publisher,
.book-grid .book-featured-date {
display:block !important; font-family:"Noto Sans KR","Malgun Gothic",Arial,sans-serif !important;
}
.book-grid .book-featured-category {
color:#081B33 !important; font-size:24px !important; font-weight:700 !important; margin:0 0 10px !important;
}
.book-grid .book-featured-publisher,
.book-grid .book-featured-date {
color:#766d60 !important; font-size:20px !important; font-weight:500 !important; line-height:1.5 !important;
}
.book-grid .book-featured-date { margin:4px 0 18px !important; }
.book-grid .book-card h3 {
min-height:0 !important; margin:0 0 18px !important; font-size:28px !important; line-height:1.48 !important;
}
@media (min-width:901px) {
.book-grid .book-card > p:not(.book-publisher) {
font-size:14px !important; /* 50% of previous 28px */
line-height:1.75 !important; margin-bottom:18px !important;
}
}
/* All three current-book buttons use the exact same type */
.book-actions > button,
.book-actions > a,
.founding-card-actions > button,
.founding-card-actions > a {
font-family:"Noto Sans KR","Malgun Gothic",Arial,sans-serif !important;
font-size:15px !important; font-weight:700 !important; line-height:1.2 !important;
}
/* Organization: English department names = Korean department-name size */
.org-chart-simple .org-simple-dept > span {
font-size:23px !important; line-height:1.25 !important; letter-spacing:.02em !important;
}
.org-chart-simple .org-simple-dept h3 { font-size:23px !important; line-height:1.35 !important; }
.org-chart-simple .org-duty-list li { line-height:1.55 !important; }
/* Business-section descriptions: 50% of previous 29px desktop setting */
@media (min-width:1101px) {
.business-card p { font-size:14.5px !important; line-height:1.72 !important; }
}
/* Featured Works current logo-bearing covers */
.founder-featured-card figure img { object-fit:contain !important; }
@media (max-width:760px) {
.founder-publication-card-body > .founder-featured-category,
.founder-post-founding-section .founding-edition-category,
.book-grid .book-featured-category { font-size:18px !important; }
.founder-publication-card-body > .founder-featured-publisher,
.founder-publication-card-body > .founder-featured-date,
.founder-post-founding-section .founding-edition-publisher,
.founder-post-founding-section .founding-edition-date,
.book-grid .book-featured-publisher,
.book-grid .book-featured-date { font-size:16px !important; }
.org-chart-simple .org-simple-dept > span,
.org-chart-simple .org-simple-dept h3 { font-size:21px !important; }
}
/* v205 patch 2 */
#books .book-featured-category,
#books .book-featured-publisher,
#books .book-featured-date,
#founder .founder-publication-date,
#founder .founding-edition-date,
#founder .founding-edition-category,
#founder .founding-edition-publisher {
display: block !important;
}
#books .book-featured-category {
color: var(--navy) !important;
font-size: 1.02rem !important;
font-weight: 800 !important;
line-height: 1.4 !important;
}
#books .book-featured-publisher,
#books .book-featured-date,
#founder .founder-publication-date,
#founder .founding-edition-date,
#founder .founding-edition-publisher {
color: var(--muted) !important;
font-size: 0.96rem !important;
font-weight: 600 !important;
line-height: 1.5 !important;
}
#founder .founding-edition-category {
color: var(--navy) !important;
font-size: 1.02rem !important;
font-weight: 800 !important;
line-height: 1.4 !important;
}
#founder .founding-edition-description,
#founder .founder-publication-summary {
margin: 6px 0 0 !important;
color: var(--muted) !important;
font-size: 13px !important;
line-height: 1.72 !important;
}
/* v205 patch 3: visual ordering for current books */
#books .book-card[data-dialog="current-book-dialog-constdict"]{order:1}
#books .book-card[data-dialog="current-book-dialog-constdict-en"]{order:2}
#books .book-card[data-dialog="current-book-dialog-leadership"]{order:3}
#books .book-card[data-dialog="current-book-dialog-leadership-en"]{order:4}
#books .book-card[data-dialog="current-book-dialog-econfin"]{order:5}
#books .book-card[data-dialog="current-book-dialog-econfin-en"]{order:6}
#books .book-card[data-dialog="current-book-dialog-fidic"]{order:7}
#books .book-card[data-dialog="current-book-dialog-fidic-en"]{order:8}
#books .book-card[data-dialog="current-book-dialog-meaning"]{order:9}
#books .book-card[data-dialog="current-book-dialog-meaning-en"]{order:10}
#books .book-card[data-dialog="current-book-dialog-together"]{order:11}
#books .book-card[data-dialog="current-book-dialog-together-en"]{order:12}
#books .book-card[data-dialog="current-book-dialog-bright"]{order:13}
#books .book-card[data-dialog="current-book-dialog-bright-en"]{order:14}
#books .book-card[data-dialog="current-book-dialog-overseas"]{order:15}
#books .book-card[data-dialog="current-book-dialog-overseas-en"]{order:16}
#books .book-card[data-dialog="current-book-dialog-selflove"]{order:17}
#books .book-card[data-dialog="current-book-dialog-cheer"]{order:18}
#books .book-card[data-dialog="current-book-dialog-again"]{order:19}
#books .book-card[data-dialog="current-book-dialog-slow"]{order:20}
#books .book-card[data-dialog="current-book-dialog-poetry"]{order:21}
/* =========================================================
v206 — 12-title catalog: print + ebook in one card
========================================================= */
.book-featured-format,
.founder-featured-format {
display: block;
color: #081B33;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif;
font-size: 14px;
font-weight: 700;
line-height: 1.45;
margin: 5px 0 5px;
}
#books .book-grid {
grid-template-columns: repeat(3, minmax(0,1fr)) !important;
}
#books .book-card h3 {
word-break: keep-all !important;
}
.founder-post-founding-section .founding-combined-grid {
grid-template-columns: repeat(2, minmax(0,1fr)) !important;
}
@media (max-width: 960px) {
#books .book-grid { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
}
@media (max-width: 720px) {
#books .book-grid,
.founder-post-founding-section .founding-combined-grid { grid-template-columns: 1fr !important; }
}
/* =========================================================
v207 — action button legibility + founding stats fit
========================================================= */
/* Three action labels: 15px -> 22.5px (1.5x) on PC */
@media (min-width: 901px) {
.book-actions > button,
.book-actions > a,
.founding-card-actions > button,
.founding-card-actions > a,
.founder-post-founding-section .founding-card-actions > button,
.founder-post-founding-section .founding-card-actions > a {
font-size: 22.5px !important;
font-weight: 700 !important;
line-height: 1.2 !important;
min-height: 56px !important;
padding: 10px 8px !important;
}
}
/* Founding collection summary values: keep every value inside its card */
.founder-post-founding-section .founder-collection-stats strong {
font-size: clamp(26px, 2.2vw, 34px) !important;
line-height: 1.08 !important;
white-space: nowrap !important;
overflow: visible !important;
text-align: left !important;
}
/* The full date needs a slightly smaller size than 12 / 24 */
.founder-post-founding-section .founder-collection-stats > div:first-child strong {
font-size: clamp(21px, 1.7vw, 27px) !important;
letter-spacing: -0.025em !important;
}
.founder-post-founding-section .founder-collection-stats > div {
min-width: 0 !important;
padding-left: 20px !important;
padding-right: 20px !important;
box-sizing: border-box !important;
}
@media (max-width: 1280px) and (min-width: 901px) {
.founder-post-founding-section .founder-collection-stats strong {
font-size: 28px !important;
}
.founder-post-founding-section .founder-collection-stats > div:first-child strong {
font-size: 22px !important;
}
}
@media (max-width: 900px) {
.book-actions > button,
.book-actions > a,
.founding-card-actions > button,
.founding-card-actions > a,
.founder-post-founding-section .founding-card-actions > button,
.founder-post-founding-section .founding-card-actions > a {
font-size: 15px !important;
}
}
/* =========================================================
v208 — founder 8-line duty copy doubled from v207
========================================================= */
.founder-identity .founder-business-lines {
font-size: 20.8px !important; /* 10.4px × 2 */
line-height: 1.62 !important;
gap: 8px !important;
}
.founder-identity .founder-business-lines > span {
padding-left: 14px !important;
}
@media (max-width: 1100px) {
.founder-identity .founder-business-lines {
font-size: 20.8px !important;
line-height: 1.62 !important;
gap: 8px !important;
}
}
@media (max-width: 740px) {
.founder-identity .founder-business-lines {
font-size: 20.8px !important;
line-height: 1.62 !important;
gap: 8px !important;
}
}
/* =========================================================
v209 — integrated final refinements
========================================================= */
/* Founding collection intro: descriptive copy ≈ 60% of heading */
@media (min-width: 901px) {
.founder-post-founding-section .founder-new-isbn-heading h4 {
font-size: 30px !important;
}
.founder-post-founding-section .founder-new-isbn-heading > p {
max-width: 980px !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 18px !important;
font-weight: 400 !important;
line-height: 1.7 !important;
letter-spacing: -0.015em !important;
}
}
/* Book-format text: sans-serif */
.book-featured-format,
.founder-featured-format,
.founding-edition-format {
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-style: normal !important;
letter-spacing: -0.01em !important;
}
/* All three action buttons: equal and compact enough to stay inside cards */
.book-actions,
.founding-card-actions,
.founder-post-founding-section .founding-card-actions {
grid-template-columns: repeat(3, minmax(0,1fr)) !important;
gap: 7px !important;
}
.book-actions > button,
.book-actions > a,
.founding-card-actions > button,
.founding-card-actions > a,
.founder-post-founding-section .founding-card-actions > button,
.founder-post-founding-section .founding-card-actions > a {
width: 100% !important;
min-width: 0 !important;
height: 46px !important;
min-height: 46px !important;
padding: 5px 5px !important;
box-sizing: border-box !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 13px !important;
font-weight: 700 !important;
line-height: 1.15 !important;
white-space: nowrap !important;
text-align: center !important;
}
/* Organization English labels: Title Case in HTML; size matches Korean department title */
.organization-section .org-leader > span,
.organization-section .org-simple-dept > span {
font-family: "Noto Sans KR", Arial, sans-serif !important;
font-size: 23px !important;
font-weight: 700 !important;
line-height: 1.2 !important;
letter-spacing: 0 !important;
text-transform: none !important;
}
/* CI color codes: 2x */
.identity-color-item code {
font-size: 1.5rem !important;
line-height: 1.35 !important;
}
.identity-color-item small {
font-size: 1.44rem !important;
line-height: 1.35 !important;
margin-top: 5px !important;
}
/* Keep summary values inside boxes */
.founder-post-founding-section .founder-collection-stats strong {
font-size: clamp(24px, 2vw, 32px) !important;
line-height: 1.08 !important;
white-space: nowrap !important;
}
.founder-post-founding-section .founder-collection-stats > div:first-child strong {
font-size: clamp(20px, 1.55vw, 25px) !important;
letter-spacing: -0.025em !important;
}
@media (max-width: 900px) {
.organization-section .org-leader > span,
.organization-section .org-simple-dept > span {
font-size: 18px !important;
}
.book-actions > button,
.book-actions > a,
.founding-card-actions > button,
.founding-card-actions > a,
.founder-post-founding-section .founding-card-actions > button,
.founder-post-founding-section .founding-card-actions > a {
font-size: 12px !important;
height: 44px !important;
min-height: 44px !important;
}
.identity-color-item code { font-size: 1.1rem !important; }
.identity-color-item small { font-size: 1rem !important; }
}
/* =========================================================
v211 — card descriptive-copy legibility on PC
========================================================= */
@media (min-width: 901px) {
#founder-featured-works .founder-featured-body > p {
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 2.16rem !important;
line-height: 1.65 !important;
font-weight: 400 !important;
color: #4a4640 !important;
min-height: 5.2em !important;
}
.founder-publication-gallery .founder-gallery-heading > p {
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 34px !important;
line-height: 1.62 !important;
font-weight: 400 !important;
color: #4a4640 !important;
}
#books .book-card > p,
#books .book-card p:not(.book-card-format):not(.book-featured-format) {
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 28px !important;
line-height: 1.65 !important;
font-weight: 400 !important;
color: #4a4640 !important;
min-height: 5.2em !important;
}
#news-records .record-card-body > p,
#news-records .record-card > p {
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 21px !important;
line-height: 1.65 !important;
font-weight: 400 !important;
color: #5d574f !important;
min-height: 7.1em !important;
}
}
@media (max-width: 900px) {
#founder-featured-works .founder-featured-body > p,
.founder-publication-gallery .founder-gallery-heading > p,
#books .book-card > p,
#books .book-card p:not(.book-card-format):not(.book-featured-format),
#news-records .record-card-body > p,
#news-records .record-card > p {
min-height: 0 !important;
}
}
/* =========================================================
v212 — Featured Works description matches publisher/date size
========================================================= */
@media (min-width: 901px) {
#founder-featured-works .founder-featured-body > p {
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 1.25rem !important;
line-height: 1.65 !important;
font-weight: 400 !important;
color: #5f5850 !important;
min-height: 0 !important;
}
}
/* =========================================================
v213 — align stat numbers and subtitles to equal heights
========================================================= */
/* Founding collection 4 stat cards */
.founder-post-founding-section .founder-collection-stats > div {
display: flex !important;
flex-direction: column !important;
align-items: flex-start !important;
justify-content: flex-start !important;
}
.founder-post-founding-section .founder-collection-stats strong {
display: flex !important;
align-items: flex-end !important;
min-height: 56px !important;
margin: 0 !important;
}
.founder-post-founding-section .founder-collection-stats span {
display: flex !important;
align-items: flex-start !important;
min-height: 64px !important;
margin-top: 10px !important;
}
/* Pre-founding stat cards as well, for consistency */
.founder-timeline-stats > div {
display: flex !important;
flex-direction: column !important;
align-items: flex-start !important;
justify-content: flex-start !important;
}
.founder-timeline-stats strong {
display: flex !important;
align-items: flex-end !important;
min-height: 28px !important;
margin: 0 !important;
}
.founder-timeline-stats span {
display: flex !important;
align-items: flex-start !important;
min-height: 34px !important;
margin-top: 4px !important;
}
/* =========================================================
v214 — publication-card typography: 1.5x except book titles
Scope: #books current publication catalogue only
========================================================= */
/* Book-title rules are intentionally untouched, so v213 title sizing remains exactly as-is. */
/* All other text in each current-book card: 1.5x from v213. */
#books .book-featured-category {
font-size: 1.53rem !important; /* 1.02rem × 1.5 */
}
#books .book-featured-format {
font-size: 21px !important; /* 14px × 1.5 */
}
#books .book-featured-publisher,
#books .book-featured-date {
font-size: 1.44rem !important; /* 0.96rem × 1.5 */
}
@media (min-width: 901px) {
#books .book-card > p,
#books .book-card p:not(.book-card-format):not(.book-featured-format) {
font-size: 42px !important; /* 28px × 1.5 */
}
#books .book-actions > button,
#books .book-actions > a {
font-size: 19.5px !important; /* 13px × 1.5 */
}
}
@media (max-width: 900px) {
#books .book-card > p,
#books .book-card p:not(.book-card-format):not(.book-featured-format) {
font-size: 21px !important; /* 14px × 1.5 */
}
#books .book-actions > button,
#books .book-actions > a {
font-size: 18px !important; /* 12px × 1.5 */
}
}
/* =========================================================
v215 — current writing project title/copy typography
- Korean working title: sans-serif (Dotum-family direction), 1.5x (20px -> 30px)
- Korean explanatory copy: 80% of v214 scale (24px -> 19.2px)
========================================================= */
body:not(.lang-en) .founder-current-project strong {
font-family: "Noto Sans KR", "Malgun Gothic", Dotum, Arial, sans-serif !important;
font-size: 30px !important;
font-weight: 700 !important;
line-height: 1.4 !important;
}
body:not(.lang-en) .founder-current-project p {
font-family: "Noto Sans KR", "Malgun Gothic", Dotum, Arial, sans-serif !important;
font-size: 19.2px !important;
line-height: 1.7 !important;
}
@media (max-width: 1100px) {
body:not(.lang-en) .founder-current-project p {
font-size: 16px !important;
}
}
@media (max-width: 740px) {
body:not(.lang-en) .founder-current-project p {
font-size: 14.4px !important;
}
}
/* =========================================================
v216 — official CI color typography
- Color names, HEX codes, and RGB values use KoPub Dotum family.
========================================================= */
.identity-color-item strong,
.identity-color-item code,
.identity-color-item small {
font-family: "KoPubWorldDotum", "KoPub Dotum", "KoPubDotum", "Noto Sans KR", "Malgun Gothic", Dotum, sans-serif !important;
font-style: normal !important;
letter-spacing: 0 !important;
}
.identity-color-item strong {
font-weight: 600 !important;
}
.identity-color-item code,
.identity-color-item small {
font-weight: 400 !important;
}
/* =========================================================
v217 — business-card body copy readability
=========================================================
Requested change: enlarge only the business-card work descriptions
to 180% of the current desktop size. Titles, numbering and links stay unchanged.
*/
@media (min-width: 1101px) {
.business-card p {
font-size: 26.1px !important; /* 14.5px × 1.8 */
line-height: 1.72 !important;
}
}
/* =========================================================
v218 — section-intro copy scale + poetry-series ordering
1) Major section/menu explanatory copy reduced to 70% of v217 desktop sizes.
2) Family poetry titles placed immediately after "참 수고 많았소...".
========================================================= */
@media (min-width: 1101px) {
/* Major menu/section explanatory copy only — card body copy is intentionally untouched. */
.business-heading > p {
font-size: 21px !important; /* 30px × 0.70 */
}
.organization-heading > p {
font-size: 20.3px !important; /* 29px × 0.70 */
}
.identity-heading > p {
font-size: 18.2px !important; /* 26px × 0.70 */
}
.section-heading-row > p,
.records-heading > p,
.contact-intro {
font-size: 19.6px !important; /* 28px × 0.70 */
}
}
/* Current publication catalogue: keep the three family poetry books directly after the poetry collection. */
#books .book-card[data-dialog="current-book-dialog-mother"] { order: 22 !important; }
#books .book-card[data-dialog="current-book-dialog-wife"] { order: 23 !important; }
#books .book-card[data-dialog="current-book-dialog-kids"] { order: 24 !important; }
/* =========================================================
v219 — publication format prominence + unified book copy
1) "종이책 · 전자책" / format line: Archive Navy, 2x v218 size.
2) All current-publication descriptive paragraphs use one identical size.
========================================================= */
#books .book-featured-format {
color: #081B33 !important;
font-size: 42px !important; /* 21px × 2 */
font-weight: 600 !important;
line-height: 1.35 !important;
}
@media (min-width: 901px) {
#books .book-card > p,
#books .book-card p:not(.book-card-format):not(.book-featured-format) {
font-size: 42px !important;
line-height: 1.65 !important;
}
}
@media (max-width: 900px) {
#books .book-featured-format {
font-size: 42px !important;
}
#books .book-card > p,
#books .book-card p:not(.book-card-format):not(.book-featured-format) {
font-size: 21px !important;
line-height: 1.65 !important;
}
}
/* =========================================================
v222 — pre-founding archive section intro copy alignment
- Match the pre-founding archive explanatory copy to the
same readable scale used for other menu/section intros.
========================================================= */
@media (min-width: 901px) {
.founder-publication-gallery .founder-gallery-heading > p {
font-size: 19.6px !important;
line-height: 1.72 !important;
}
}
/* =========================================================
v224 — pre-founding archive publisher/date prominence
- "발행처 인디펍": 20px -> 30px (1.5x) on tablet/desktop.
- "발행일": same 30px size to emphasize publication tempo.
- Mobile: 16px -> 24px (1.5x), both lines equal.
========================================================= */
#founder .founder-publication-card-body > .founder-publication-publisher,
#founder .founder-publication-card-body > .founder-publication-date {
color: #766d60 !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-weight: 500 !important;
line-height: 1.5 !important;
}
@media (min-width: 761px) {
#founder .founder-publication-card-body > .founder-publication-publisher,
#founder .founder-publication-card-body > .founder-publication-date {
font-size: 30px !important;
}
}
@media (max-width: 760px) {
#founder .founder-publication-card-body > .founder-publication-publisher,
#founder .founder-publication-card-body > .founder-publication-date {
font-size: 24px !important;
}
}
/* =========================================================
v225 — current publication cards: all non-title text 1.5x
- Book titles (h3) are intentionally unchanged.
- Category, format, publisher/date, description and actions:
150% of their v224 sizes.
========================================================= */
#books .book-featured-category {
font-size: 2.295rem !important; /* 1.53rem × 1.5 */
}
#books .book-featured-format {
font-size: 63px !important; /* 42px × 1.5 */
}
#books .book-featured-publisher,
#books .book-featured-date {
font-size: 2.16rem !important; /* 1.44rem × 1.5 */
}
@media (min-width: 901px) {
#books .book-card > p,
#books .book-card p:not(.book-card-format):not(.book-featured-format) {
font-size: 63px !important; /* 42px × 1.5 */
}
#books .book-actions > button,
#books .book-actions > a {
font-size: 29.25px !important; /* 19.5px × 1.5 */
}
}
@media (max-width: 900px) {
#books .book-card > p,
#books .book-card p:not(.book-card-format):not(.book-featured-format) {
font-size: 31.5px !important; /* 21px × 1.5 */
}
#books .book-actions > button,
#books .book-actions > a {
font-size: 27px !important; /* 18px × 1.5 */
}
}
/* =========================================================
v226 — founder identity title stacked + duty copy 70%
========================================================= */
.founder-identity .founder-entity-title-stacked {
display: flex !important;
flex-direction: column !important;
align-items: flex-start !important;
gap: 2px !important;
}
.founder-identity .founder-entity-title-stacked > span {
display: block !important;
}
/* v225 visible duty copy is 20.8px. Reduce to 70% = 14.56px. */
.founder-identity .founder-business-lines {
font-size: 14.56px !important;
line-height: 1.62 !important;
gap: 6px !important;
}
.founder-identity .founder-business-lines > span {
padding-left: 12px !important;
}
@media (max-width: 1100px) {
.founder-identity .founder-business-lines {
font-size: 14.56px !important;
line-height: 1.62 !important;
gap: 6px !important;
}
}
@media (max-width: 740px) {
.founder-identity .founder-business-lines {
font-size: 14.56px !important;
line-height: 1.62 !important;
gap: 6px !important;
}
}
/* =========================================================
v228 — publication-card typography aligned with timeline
- Keep book titles unchanged.
- Use the timeline's main content size (13px) consistently
for category, format, publisher/date, description and actions.
========================================================= */
#books .book-featured-category,
#books .book-featured-format,
#books .book-featured-publisher,
#books .book-featured-date,
#books .book-card > p,
#books .book-card p:not(.book-card-format):not(.book-featured-format),
#books .book-actions > button,
#books .book-actions > a {
font-size: 13px !important;
}
#books .book-featured-category,
#books .book-featured-format,
#books .book-featured-publisher,
#books .book-featured-date {
line-height: 1.55 !important;
}
#books .book-card > p,
#books .book-card p:not(.book-card-format):not(.book-featured-format) {
line-height: 1.7 !important;
}
/* Preserve the previously approved Archive Navy treatment for format text. */
#books .book-featured-format {
color: #081B33 !important;
}
/* Book titles are intentionally not included in this override. */
/* =========================================================
v229 — organization division duty copy reduced to 70%
- Only the duty bullets inside the three division cards.
- Division English/Korean titles remain unchanged.
========================================================= */
@media (min-width: 1181px) {
.org-chart-simple .org-simple-dept .org-duty-list li {
font-size: 14.7px !important; /* 21px × 0.70 */
}
}
@media (min-width: 741px) and (max-width: 1180px) {
.org-chart-simple .org-simple-dept .org-duty-list li {
font-size: 13.3px !important; /* 19px × 0.70 */
}
}
@media (max-width: 740px) {
.org-chart-simple .org-simple-dept .org-duty-list li {
font-size: 12.6px !important; /* 18px × 0.70 */
line-height: 1.6 !important;
}
}
/* =========================================================
v230 — business-card description copy reduced to 60%
- Only the explanatory paragraph under each business title.
- Number, business title and inquiry/action link remain unchanged.
========================================================= */
@media (min-width: 1101px) {
.business-card p {
font-size: 15.66px !important; /* 26.1px × 0.60 */
line-height: 1.72 !important;
}
}
@media (min-width: 761px) and (max-width: 1100px) {
.business-card p {
font-size: 15px !important;
line-height: 1.7 !important;
}
}
@media (max-width: 760px) {
.business-card p {
font-size: 14px !important;
line-height: 1.68 !important;
}
}
/* =========================================================
v231 — publication cards aligned to timeline / featured-work hierarchy
- Standardize alignment, type hierarchy and spacing.
- Book format equals publisher/date size.
- Book title matches founder timeline title size (23px).
========================================================= */
/* Entire textual content uses the same left-aligned card rhythm. */
#books .book-card {
text-align: left !important;
}
#books .book-card .book-featured-category,
#books .book-card .book-featured-format,
#books .book-card .book-featured-publisher,
#books .book-card .book-featured-date,
#books .book-card h3,
#books .book-card > p {
display: block !important;
width: 100% !important;
box-sizing: border-box !important;
text-align: left !important;
}
/* Category: compact identifier, consistent with archive / featured cards. */
#books .book-card .book-featured-category {
margin: 0 0 7px !important;
color: #081B33 !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 16px !important;
font-weight: 700 !important;
line-height: 1.45 !important;
letter-spacing: -0.015em !important;
}
/* Format, publisher and date now share exactly one size and rhythm. */
#books .book-card .book-featured-format,
#books .book-card .book-featured-publisher,
#books .book-card .book-featured-date {
margin: 0 !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 15px !important;
font-weight: 500 !important;
line-height: 1.5 !important;
letter-spacing: -0.015em !important;
}
#books .book-card .book-featured-format {
margin-bottom: 5px !important;
color: #081B33 !important;
font-weight: 600 !important;
}
#books .book-card .book-featured-publisher,
#books .book-card .book-featured-date {
color: #766d60 !important;
}
#books .book-card .book-featured-date {
margin-top: 3px !important;
margin-bottom: 15px !important;
}
/* Title: same scale as the Korean founder-timeline card title. */
#books .book-card h3,
#books .book-card h3.long-book-title,
#books .book-card h3 .book-title-line {
min-height: 0 !important;
margin: 0 0 17px !important;
padding: 0 !important;
font-family: "Noto Serif KR", Georgia, serif !important;
font-size: 23px !important;
font-weight: 600 !important;
line-height: 1.5 !important;
letter-spacing: -0.015em !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
white-space: normal !important;
}
/* Description: same restrained body scale used by archive/record cards. */
#books .book-card > p:not(.book-publisher),
#books .book-card p:not(.book-card-format):not(.book-featured-format) {
margin: 0 0 18px !important;
color: #5f5850 !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 14px !important;
font-weight: 400 !important;
line-height: 1.75 !important;
letter-spacing: -0.01em !important;
text-align: left !important;
}
/* Action labels remain subordinate and consistent. */
#books .book-actions > button,
#books .book-actions > a {
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 13px !important;
font-weight: 700 !important;
}
/* Mobile: preserve the same hierarchy without oversized metadata. */
@media (max-width: 760px) {
#books .book-card .book-featured-category {
font-size: 15px !important;
}
#books .book-card .book-featured-format,
#books .book-card .book-featured-publisher,
#books .book-card .book-featured-date {
font-size: 14px !important;
}
#books .book-card h3,
#books .book-card h3.long-book-title,
#books .book-card h3 .book-title-line {
font-size: 21px !important;
}
#books .book-card > p:not(.book-publisher),
#books .book-card p:not(.book-card-format):not(.book-featured-format) {
font-size: 14px !important;
}
}
/* =========================================================
v232 — unified book-card typography system
Applies one visual hierarchy to:
1) Featured Works
2) Current Publications
3) Founding Collection
4) Pre-founding timeline (same alignment/title/category rhythm,
while preserving its previously approved enlarged publisher/date)
========================================================= */
/* ---------- Shared left alignment ---------- */
#founder-featured-works .founder-featured-body,
#books .book-card,
#founder .founder-publication-card-body,
#founder .founder-post-founding-section .founder-isbn-card-body {
text-align: left !important;
}
#founder-featured-works .founder-featured-body > *,
#books .book-card > *,
#founder .founder-publication-card-body > *,
#founder .founder-post-founding-section .founder-isbn-card-body > * {
text-align: left !important;
}
/* ---------- Shared category ---------- */
#founder-featured-works .founder-featured-category,
#books .book-featured-category,
#founder .founder-publication-card-body > .founder-featured-category,
#founder .founder-post-founding-section .founding-edition-category {
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 16px !important;
font-weight: 700 !important;
line-height: 1.45 !important;
letter-spacing: -0.015em !important;
color: #081B33 !important;
margin: 0 0 7px !important;
}
/* ---------- Shared current/founding metadata ---------- */
#books .book-featured-format,
#books .book-featured-publisher,
#books .book-featured-date,
#founder .founder-post-founding-section .founding-edition-format,
#founder .founder-post-founding-section .founding-edition-publisher,
#founder .founder-post-founding-section .founding-edition-date,
#founder-featured-works .founder-featured-publisher,
#founder-featured-works .founder-featured-date {
display: block !important;
width: 100% !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 15px !important;
font-weight: 500 !important;
line-height: 1.5 !important;
letter-spacing: -0.015em !important;
color: #766d60 !important;
margin: 0 !important;
}
#books .book-featured-format,
#founder .founder-post-founding-section .founding-edition-format {
color: #081B33 !important;
font-weight: 600 !important;
margin-bottom: 5px !important;
}
#books .book-featured-date,
#founder .founder-post-founding-section .founding-edition-date,
#founder-featured-works .founder-featured-date {
margin-top: 3px !important;
margin-bottom: 15px !important;
}
/* ---------- Shared title ---------- */
#founder-featured-works .founder-featured-body > strong,
#books .book-card h3,
#books .book-card h3.long-book-title,
#books .book-card h3 .book-title-line,
#founder .founder-publication-card-body h5,
#founder .founder-post-founding-section .founding-edition-card h5 {
display: block !important;
min-height: 0 !important;
margin: 0 0 17px !important;
padding: 0 !important;
font-family: "Noto Serif KR", Georgia, serif !important;
font-size: 23px !important;
font-weight: 600 !important;
line-height: 1.5 !important;
letter-spacing: -0.015em !important;
color: #111111 !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
white-space: normal !important;
}
/* ---------- Shared description: restrained body scale ---------- */
#founder-featured-works .founder-featured-body > p,
#books .book-grid .book-card > p,
#books .book-card > p:not(.book-publisher),
#books .book-card p:not(.book-card-format):not(.book-featured-format),
#founder .founder-post-founding-section .founding-edition-description {
display: block !important;
width: 100% !important;
margin: 0 0 18px !important;
padding: 0 !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 14px !important;
font-weight: 400 !important;
line-height: 1.72 !important;
letter-spacing: -0.01em !important;
color: #5f5850 !important;
text-align: left !important;
}
/* ---------- Shared action typography ---------- */
#books .book-actions > button,
#books .book-actions > a,
#founder .founder-post-founding-section .founding-card-actions > button,
#founder .founder-post-founding-section .founding-card-actions > a {
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 13px !important;
font-weight: 700 !important;
line-height: 1.2 !important;
}
/* ---------- Pre-founding timeline ----------
Preserve the prior editorial decision: publisher/date are prominent
because the chronology and publication speed are important. */
#founder .founder-publication-card-body > .founder-publication-publisher,
#founder .founder-publication-card-body > .founder-publication-date {
display: block !important;
width: 100% !important;
text-align: left !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 30px !important;
font-weight: 500 !important;
line-height: 1.5 !important;
color: #766d60 !important;
}
/* English cards use sans serif body text while retaining title hierarchy. */
body.lang-en #founder-featured-works .founder-featured-category,
body.lang-en #founder-featured-works .founder-featured-publisher,
body.lang-en #founder-featured-works .founder-featured-date,
body.lang-en #books .book-featured-category,
body.lang-en #books .book-featured-format,
body.lang-en #books .book-featured-publisher,
body.lang-en #books .book-featured-date,
body.lang-en #books .book-card > p,
body.lang-en #founder .founder-publication-card-body > .founder-featured-category,
body.lang-en #founder .founder-publication-card-body > .founder-publication-publisher,
body.lang-en #founder .founder-publication-card-body > .founder-publication-date,
body.lang-en #founder .founder-post-founding-section .founding-edition-category,
body.lang-en #founder .founder-post-founding-section .founding-edition-format,
body.lang-en #founder .founder-post-founding-section .founding-edition-publisher,
body.lang-en #founder .founder-post-founding-section .founding-edition-date,
body.lang-en #founder .founder-post-founding-section .founding-edition-description {
font-family: Arial, Helvetica, sans-serif !important;
}
/* ---------- Mobile ---------- */
@media (max-width: 760px) {
#founder-featured-works .founder-featured-category,
#books .book-featured-category,
#founder .founder-publication-card-body > .founder-featured-category,
#founder .founder-post-founding-section .founding-edition-category {
font-size: 15px !important;
}
#books .book-featured-format,
#books .book-featured-publisher,
#books .book-featured-date,
#founder-featured-works .founder-featured-publisher,
#founder-featured-works .founder-featured-date,
#founder .founder-post-founding-section .founding-edition-format,
#founder .founder-post-founding-section .founding-edition-publisher,
#founder .founder-post-founding-section .founding-edition-date {
font-size: 14px !important;
}
#founder-featured-works .founder-featured-body > strong,
#books .book-card h3,
#books .book-card h3.long-book-title,
#books .book-card h3 .book-title-line,
#founder .founder-publication-card-body h5,
#founder .founder-post-founding-section .founding-edition-card h5 {
font-size: 21px !important;
}
#founder-featured-works .founder-featured-body > p,
#books .book-grid .book-card > p,
#books .book-card > p:not(.book-publisher),
#books .book-card p:not(.book-card-format):not(.book-featured-format),
#founder .founder-post-founding-section .founding-edition-description {
font-size: 14px !important;
}
#founder .founder-publication-card-body > .founder-publication-publisher,
#founder .founder-publication-card-body > .founder-publication-date {
font-size: 24px !important;
}
}
/* =========================================================
v233 — book action buttons: smaller text for clean fit
- Keep button boxes and layout unchanged.
- Reduce only the action-label font size.
========================================================= */
#books .book-actions > button,
#books .book-actions > a,
#founder .founder-post-founding-section .founding-card-actions > button,
#founder .founder-post-founding-section .founding-card-actions > a {
font-size: 11px !important;
white-space: nowrap !important;
}
/* =========================================================
v234 — Contact parent menu label aligned with all section menus
- The Contact/문의 parent label uses the same navy box,
gold type, dimensions and typography as other top-level labels.
========================================================= */
#contact > .container > .inquiry-parent-eyebrow {
display: inline-flex !important;
align-items: center !important;
width: fit-content !important;
margin: 0 0 22px !important;
padding: 8px 16px !important;
border: 1px solid rgba(222,188,104,.65) !important;
border-radius: 2px !important;
background: #081B33 !important;
color: #DEBC68 !important;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif !important;
font-size: 21px !important;
font-weight: 700 !important;
line-height: 1.15 !important;
letter-spacing: .03em !important;
}
html[lang="en"] #contact > .container > .inquiry-parent-eyebrow,
body.lang-en #contact > .container > .inquiry-parent-eyebrow {
font-family: Arial, Helvetica, sans-serif !important;
font-size: 21px !important;
font-weight: 700 !important;
}
@media (max-width: 1100px) {
#contact > .container > .inquiry-parent-eyebrow {
font-size: 21px !important;
}
}
@media (max-width: 740px) {
#contact > .container > .inquiry-parent-eyebrow {
padding: 9px 14px !important;
font-size: 24px !important;
letter-spacing: .04em !important;
}
}
/* =========================================================
v235 — navigation typography enlarged
- Main menu: 180% of v234.
- Dropdown/submenu text: 150% of v234.
- Widths adjusted only where needed to prevent clipping.
========================================================= */
/* Main desktop navigation: 18px -> 32.4px */
@media (min-width: 1281px) {
.primary-nav,
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch,
.primary-nav > .language-switch a {
font-size: 32.4px !important;
}
.primary-nav {
gap: 16px !important;
}
.nav-dropdown-toggle span,
.language-divider {
font-size: 18px !important;
}
}
/* 901–1280px: 17px -> 30.6px */
@media (min-width: 901px) and (max-width: 1280px) {
.primary-nav,
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch,
.primary-nav > .language-switch a {
font-size: 30.6px !important;
}
.primary-nav {
gap: 12px !important;
}
.nav-dropdown-toggle span,
.language-divider {
font-size: 17px !important;
}
}
/* 741–900px: 15px -> 27px */
@media (min-width: 741px) and (max-width: 900px) {
.primary-nav,
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch,
.primary-nav > .language-switch a {
font-size: 27px !important;
}
.primary-nav {
gap: 8px !important;
}
.nav-dropdown-toggle span,
.language-divider {
font-size: 15px !important;
}
}
/* Ordinary dropdown items: 18px -> 27px */
.primary-nav .nav-submenu > a,
.primary-nav .nav-submenu > button,
#business-submenu a {
font-size: 27px !important;
line-height: 1.5 !important;
}
/* Give ordinary menus enough room for the larger type. */
.primary-nav .nav-submenu:not(.nav-sitemap-menu):not(.nav-books-submenu) {
width: 240px !important;
max-width: calc(100vw - 32px) !important;
}
#business-submenu {
width: 520px !important;
max-width: calc(100vw - 32px) !important;
}
#business-submenu a {
padding: 14px 22px !important;
}
/* Books dropdown: 14px -> 21px */
#books-submenu,
.nav-books-submenu {
width: 760px !important;
max-width: calc(100vw - 32px) !important;
}
#books-submenu .nav-book-link,
.nav-books-submenu .nav-book-link {
font-size: 21px !important;
line-height: 1.5 !important;
padding: 12px 16px !important;
}
/* Complete-menu / sitemap typography: 150% of v234 */
.nav-sitemap-menu .sitemap-heading {
font-size: 18px !important; /* 12px × 1.5 */
}
.nav-sitemap-menu .sitemap-subheading {
font-size: 16.5px !important; /* 11px × 1.5 */
}
.primary-nav .nav-sitemap-menu a,
.primary-nav .nav-sitemap-menu button,
.nav-sitemap-menu .sitemap-book-link,
.nav-sitemap-menu .sitemap-section:last-child a {
font-size: 19.5px !important; /* 13px × 1.5 */
line-height: 1.45 !important;
}
/* Preserve usability on mobile drawer. */
@media (max-width: 740px) {
.primary-nav,
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch,
.primary-nav > .language-switch a {
font-size: 22px !important;
}
.primary-nav .nav-submenu > a,
.primary-nav .nav-submenu > button,
#business-submenu a,
#books-submenu .nav-book-link,
.nav-books-submenu .nav-book-link {
font-size: 18px !important;
}
.nav-sitemap-menu .sitemap-heading {
font-size: 17px !important;
}
.nav-sitemap-menu .sitemap-subheading {
font-size: 15px !important;
}
.primary-nav .nav-sitemap-menu a,
.primary-nav .nav-sitemap-menu button,
.nav-sitemap-menu .sitemap-book-link {
font-size: 17px !important;
}
}
/* =========================================================
v236 — hero English company name enlarged to 200%
- ARCHIVIST WORKS only.
- Main headline and supporting copy remain unchanged.
========================================================= */
.hero .eyebrow,
.hero-section .eyebrow,
.hero-content .eyebrow,
.hero-copy-wrap .eyebrow {
font-size: 26px !important; /* 13px × 2.0 */
line-height: 1.25 !important;
}
/* =========================================================
v237 — main navigation reduced to 60% of v236
- Main/top navigation only.
- Dropdown/submenu typography remains unchanged.
========================================================= */
/* Desktop: 32.4px -> 19.44px */
@media (min-width: 1281px) {
.primary-nav,
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch,
.primary-nav > .language-switch a {
font-size: 19.44px !important;
}
.nav-dropdown-toggle span,
.language-divider {
font-size: 13px !important;
}
}
/* 901–1280px: 30.6px -> 18.36px */
@media (min-width: 901px) and (max-width: 1280px) {
.primary-nav,
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch,
.primary-nav > .language-switch a {
font-size: 18.36px !important;
}
.nav-dropdown-toggle span,
.language-divider {
font-size: 12px !important;
}
}
/* 741–900px: 27px -> 16.2px */
@media (min-width: 741px) and (max-width: 900px) {
.primary-nav,
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch,
.primary-nav > .language-switch a {
font-size: 16.2px !important;
}
.nav-dropdown-toggle span,
.language-divider {
font-size: 11px !important;
}
}
/* Mobile: 22px -> 13.2px */
@media (max-width: 740px) {
.primary-nav,
.primary-nav > a,
.primary-nav > .nav-dropdown > .nav-dropdown-toggle,
.primary-nav > .language-switch,
.primary-nav > .language-switch a {
font-size: 13.2px !important;
}
}
/* =========================================================
v238 — founder role-card typography refinement
- Three-line founder title: switch to sans-serif / Dotum-style family.
- Duty descriptions: 130% of v237 size.
========================================================= */
/* Three-line title */
.founder-role-title,
.founder-role-title span,
.founder-profile-role,
.founder-profile-role span,
.founder-role-lines,
.founder-role-lines span {
font-family: "Noto Sans KR", "Malgun Gothic", "Dotum", Arial, sans-serif !important;
font-style: normal !important;
font-weight: 600 !important;
}
/* Duty descriptions / bullet list */
.founder-role-list,
.founder-role-list li,
.founder-duty-list,
.founder-duty-list li,
.founder-profile-duties,
.founder-profile-duties li {
font-size: 18.928px !important; /* 14.56px × 1.30 */
line-height: 1.65 !important;
font-family: "Noto Sans KR", "Malgun Gothic", "Dotum", Arial, sans-serif !important;
}
/* Mobile: preserve 130% scale from the compact baseline without crowding. */
@media (max-width: 760px) {
.founder-role-list,
.founder-role-list li,
.founder-duty-list,
.founder-duty-list li,
.founder-profile-duties,
.founder-profile-duties li {
font-size: 16.9px !important;
line-height: 1.6 !important;
}
}
/* Exact founder-card fallback for the current v237 DOM */
#founder .founder-role-card h3,
#founder .founder-role-card .founder-role-heading,
#founder .founder-identity-card h3,
#founder .founder-identity-card .founder-role-heading {
font-family: "Noto Sans KR", "Malgun Gothic", "Dotum", Arial, sans-serif !important;
font-style: normal !important;
font-weight: 600 !important;
}
#founder .founder-role-card ul li,
#founder .founder-identity-card ul li {
font-size: 18.928px !important;
line-height: 1.65 !important;
font-family: "Noto Sans KR", "Malgun Gothic", "Dotum", Arial, sans-serif !important;
}
/* =========================================================
v239 — Selected Works heading kept on one line
- "설립인의 대표 작품" must remain a single line.
- Supporting copy and featured-work cards remain unchanged.
========================================================= */
.founder-featured-heading {
grid-template-columns: max-content minmax(0, 1fr) !important;
}
.founder-featured-heading h4,
#founder-featured-title {
white-space: nowrap !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
}
/* On small screens keep the requested single-line title,
while stacking the supporting copy underneath. */
@media (max-width: 640px) {
.founder-featured-heading {
grid-template-columns: 1fr !important;
}
.founder-featured-heading h4,
#founder-featured-title {
white-space: nowrap !important;
}
}
/* =========================================================
v240 — pre-founding timeline metadata hierarchy corrected
- Publisher/date reduced below the book-title hierarchy.
- Book title remains unchanged.
========================================================= */
#founder .founder-publication-card-body > .founder-publication-publisher,
#founder .founder-publication-card-body > .founder-publication-date {
font-size: 15px !important;
line-height: 1.5 !important;
font-weight: 500 !important;
color: #766d60 !important;
text-align: left !important;
}
#founder .founder-publication-card-body > .founder-publication-date {
margin-top: 3px !important;
margin-bottom: 14px !important;
}
@media (max-width: 760px) {
#founder .founder-publication-card-body > .founder-publication-publisher,
#founder .founder-publication-card-body > .founder-publication-date {
font-size: 14px !important;
}
}
/* =========================================================
v241 — official color palette typography
- Color names, HEX codes and RGB values use Times New Roman.
- Section heading and Korean explanatory copy remain unchanged.
========================================================= */
.identity-color-item p,
.identity-color-item strong,
.identity-color-item code,
.identity-color-item small {
font-family: "Times New Roman", Times, serif !important;
}
/* =========================================================
v242 — Selected Works heading overlap fix
- Keep "설립인의 대표 작품" on one line.
- Give the title its own full-width grid column.
- Keep the summary in a separate column with sufficient gap.
- Stack title and summary when the available width becomes narrow.
========================================================= */
html[lang="ko"] #founder-featured-works .founder-featured-heading {
grid-template-columns: max-content minmax(320px, 1fr) !important;
column-gap: 52px !important;
row-gap: 10px !important;
align-items: end !important;
}
html[lang="ko"] #founder-featured-works .founder-featured-eyebrow {
grid-column: 1 / -1 !important;
}
html[lang="ko"] #founder-featured-works #founder-featured-title {
grid-column: 1 !important;
min-width: max-content !important;
margin: 0 !important;
white-space: nowrap !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
}
html[lang="ko"] #founder-featured-works .founder-featured-heading > p {
grid-column: 2 !important;
min-width: 0 !important;
margin: 0 !important;
padding-left: 0 !important;
}
/* Prevent any collision on narrower desktop/tablet widths. */
@media (max-width: 1180px) {
html[lang="ko"] #founder-featured-works .founder-featured-heading {
grid-template-columns: 1fr !important;
column-gap: 0 !important;
row-gap: 10px !important;
}
html[lang="ko"] #founder-featured-works .founder-featured-eyebrow,
html[lang="ko"] #founder-featured-works #founder-featured-title,
html[lang="ko"] #founder-featured-works .founder-featured-heading > p {
grid-column: 1 !important;
}
html[lang="ko"] #founder-featured-works #founder-featured-title {
min-width: 0 !important;
white-space: nowrap !important;
}
}
/* =========================================================
v243 — book action buttons: shorter labels + readable type
- Labels: 상세 소개 / 구매 링크 / AI 분석
- Keep existing button boxes and 3-button layout.
========================================================= */
#books .book-actions > button,
#books .book-actions > a,
#founder .founder-post-founding-section .founding-card-actions > button,
#founder .founder-post-founding-section .founding-card-actions > a {
font-size: 13px !important;
line-height: 1.2 !important;
white-space: nowrap !important;
letter-spacing: -0.02em !important;
}
/* =========================================================
v244 — dropdown/submenu typography matched to main navigation
- Main navigation size remains unchanged.
- All dropdown menu items now use the same size as the
corresponding top-level menu at each viewport width.
========================================================= */
/* Desktop: main nav = 19.44px */
@media (min-width: 1281px) {
.primary-nav .nav-submenu > a,
.primary-nav .nav-submenu > button,
#business-submenu a,
#books-submenu .nav-book-link,
.nav-books-submenu .nav-book-link,
.primary-nav .nav-sitemap-menu a,
.primary-nav .nav-sitemap-menu button,
.nav-sitemap-menu .sitemap-book-link,
.nav-sitemap-menu .sitemap-section:last-child a {
font-size: 19.44px !important;
}
.nav-sitemap-menu .sitemap-heading,
.nav-sitemap-menu .sitemap-subheading {
font-size: 19.44px !important;
}
}
/* 901–1280px: main nav = 18.36px */
@media (min-width: 901px) and (max-width: 1280px) {
.primary-nav .nav-submenu > a,
.primary-nav .nav-submenu > button,
#business-submenu a,
#books-submenu .nav-book-link,
.nav-books-submenu .nav-book-link,
.primary-nav .nav-sitemap-menu a,
.primary-nav .nav-sitemap-menu button,
.nav-sitemap-menu .sitemap-book-link,
.nav-sitemap-menu .sitemap-section:last-child a {
font-size: 18.36px !important;
}
.nav-sitemap-menu .sitemap-heading,
.nav-sitemap-menu .sitemap-subheading {
font-size: 18.36px !important;
}
}
/* 741–900px: main nav = 16.2px */
@media (min-width: 741px) and (max-width: 900px) {
.primary-nav .nav-submenu > a,
.primary-nav .nav-submenu > button,
#business-submenu a,
#books-submenu .nav-book-link,
.nav-books-submenu .nav-book-link,
.primary-nav .nav-sitemap-menu a,
.primary-nav .nav-sitemap-menu button,
.nav-sitemap-menu .sitemap-book-link,
.nav-sitemap-menu .sitemap-section:last-child a {
font-size: 16.2px !important;
}
.nav-sitemap-menu .sitemap-heading,
.nav-sitemap-menu .sitemap-subheading {
font-size: 16.2px !important;
}
}
/* Mobile: main nav = 13.2px */
@media (max-width: 740px) {
.primary-nav .nav-submenu > a,
.primary-nav .nav-submenu > button,
#business-submenu a,
#books-submenu .nav-book-link,
.nav-books-submenu .nav-book-link,
.primary-nav .nav-sitemap-menu a,
.primary-nav .nav-sitemap-menu button,
.nav-sitemap-menu .sitemap-book-link,
.nav-sitemap-menu .sitemap-section:last-child a {
font-size: 13.2px !important;
}
.nav-sitemap-menu .sitemap-heading,
.nav-sitemap-menu .sitemap-subheading {
font-size: 13.2px !important;
}
}
/* =========================================================
v245 — founding documents popup
========================================================= */
.founding-documents-dialog {
width: min(1180px, calc(100vw - 36px)) !important;
max-width: 1180px !important;
}
.founding-documents-dialog .book-dialog-panel {
width: 100% !important;
max-width: none !important;
padding: 34px !important;
}
.founding-documents-header {
margin: 0 52px 24px 0;
}
.founding-documents-header .eyebrow {
margin-bottom: 8px !important;
}
.founding-documents-header h2 {
margin: 0 0 8px;
font-family: "Noto Serif KR", Georgia, serif;
font-size: 28px;
line-height: 1.45;
}
.founding-documents-header p:last-child {
margin: 0;
color: #6c655d;
font-size: 14px;
}
.founding-documents-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 24px;
align-items: start;
}
.founding-document {
margin: 0;
border: 1px solid #d8d1c6;
background: #f6f3ee;
padding: 16px;
}
.founding-document figcaption {
margin: 0 0 12px;
color: #081B33;
font-family: "Noto Sans KR", "Malgun Gothic", Arial, sans-serif;
font-size: 16px;
font-weight: 700;
}
.founding-document a {
display: block;
}
.founding-document img {
display: block;
width: 100%;
height: auto;
max-height: 72vh;
object-fit: contain;
background: #fff;
border: 1px solid #e1ddd6;
}
.record-card[data-open-dialog] {
cursor: pointer;
}
@media (max-width: 760px) {
.founding-documents-dialog .book-dialog-panel {
padding: 22px 16px !important;
}
.founding-documents-header {
margin-right: 36px;
}
.founding-documents-grid {
grid-template-columns: 1fr;
gap: 18px;
}
.founding-documents-header h2 {
font-size: 23px;
}
.founding-document {
padding: 10px;
}
}
/* =========================================================
v246 — founder profile duty copy matched to role-card body
- Left profile's 8 duty lines now use the same 18px body size
and 1.55 line-height as the right-side role cards.
- Title and card structure remain unchanged.
========================================================= */
.founder-identity .founder-business-lines,
.founder-identity .founder-business-lines > span {
font-size: 18px !important;
line-height: 1.55 !important;
font-family: "Noto Sans KR", "Malgun Gothic", "Dotum", Arial, sans-serif !important;
}
.founder-identity .founder-business-lines {
gap: 7px !important;
}
@media (max-width: 1100px) {
.founder-identity .founder-business-lines,
.founder-identity .founder-business-lines > span {
font-size: 18px !important;
line-height: 1.55 !important;
}
}
@media (max-width: 740px) {
.founder-identity .founder-business-lines,
.founder-identity .founder-business-lines > span {
font-size: 18px !important;
line-height: 1.55 !important;
}
}
/* =========================================================
v247 — remove purchase-link buttons
- Keep only: 상세 소개 / AI 분석
- Normalize action areas to a 2-column layout.
========================================================= */
#books .book-actions,
#founder .founder-post-founding-section .founding-card-actions {
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 10px !important;
align-items: stretch !important;
}
#books .book-actions > button,
#books .book-actions > a,
#founder .founder-post-founding-section .founding-card-actions > button,
#founder .founder-post-founding-section .founding-card-actions > a {
width: 100% !important;
justify-content: center !important;
}
/* =========================================================
v248 — family poetry pre-release cards
- AI analysis removed for the three unpublished family poetry titles.
- If only one action remains, let it span the full action row.
========================================================= */
#books .book-actions > :only-child,
#founder .founder-post-founding-section .founding-card-actions > :only-child {
grid-column: 1 / -1 !important;
width: 100% !important;
}
/* =========================================================
v249 — organization division duty copy enlarged to 140%
- Only duty bullets inside the three department cards.
- Department English/Korean titles remain unchanged.
========================================================= */
@media (min-width: 1181px) {
.org-chart-simple .org-simple-dept .org-duty-list li {
font-size: 20.58px !important; /* 14.7px × 1.40 */
line-height: 1.62 !important;
}
}
@media (min-width: 741px) and (max-width: 1180px) {
.org-chart-simple .org-simple-dept .org-duty-list li {
font-size: 18.62px !important; /* 13.3px × 1.40 */
line-height: 1.62 !important;
}
}
@media (max-width: 740px) {
.org-chart-simple .org-simple-dept .org-duty-list li {
font-size: 17.64px !important; /* 12.6px × 1.40 */
line-height: 1.6 !important;
}
}
/* =========================================================
v250 — business-card action-link vertical alignment
- All eight business cards use a flex column.
- Action links sit on the same bottom baseline within each grid row.
- Link font size, wording and underline style remain unchanged.
========================================================= */
.business-grid .business-card {
display: flex !important;
flex-direction: column !important;
}
.business-grid .business-card .text-link {
margin-top: auto !important;
min-height: 28px !important;
display: inline-flex !important;
align-items: center !important;
align-self: flex-start !important;
line-height: 1.35 !important;
}
/* =========================================================
v251 — English founder profile: Korean name 2x + profession Title Case
- Applies only to the English founder profile block.
========================================================= */
body.lang-en .founder-name-ko {
font-size: 40px !important; /* 20px × 2 */
line-height: 1.28 !important;
font-weight: 600 !important;
letter-spacing: 0 !important;
}
body.lang-en .founder-entity-title-stacked > span {
text-transform: none !important;
font-variant: normal !important;
font-variant-caps: normal !important;
letter-spacing: 0 !important;
}
/* v252 — English pre-founding timeline reordered into Korean/English edition pairs. */
/* v253 — English Founding Collection collapsed to one 12-title grid; no duplicate print/e-book cards. */
/* =========================================================
v254 — Publication CI examples: three-tier layout
- Top: color cover
- Middle: white cover
- Bottom: four spine examples
========================================================= */
.publication-ci-examples {
display: flex !important;
flex-direction: column !important;
gap: 14px !important;
align-items: stretch !important;
}
.publication-cover-row {
display: block !important;
}
.publication-spine-row {
display: grid !important;
grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
gap: 14px !important;
align-items: stretch !important;
}
.publication-ci-examples .cover-example,
.publication-ci-examples .spine-example {
position: relative !important;
overflow: hidden !important;
}
.publication-ci-examples .publication-cover-full {
min-height: 255px !important;
padding: 28px 18px !important;
}
.publication-ci-examples .publication-cover-full img {
position: absolute !important;
top: 43% !important;
left: 50% !important;
transform: translate(-50%, -50%) !important;
width: 32% !important;
max-width: 170px !important;
height: auto !important;
}
.publication-ci-examples .publication-spine-standard,
.publication-ci-examples .publication-spine-narrow {
min-height: 310px !important;
padding: 22px 10px !important;
}
.publication-ci-examples .publication-spine-standard img {
position: absolute !important;
top: 42% !important;
left: 50% !important;
transform: translate(-50%, -50%) !important;
width: 74% !important;
max-width: 70px !important;
height: auto !important;
}
.publication-ci-examples .publication-spine-narrow img {
position: absolute !important;
top: 42% !important;
left: 50% !important;
transform: translate(-50%, -50%) !important;
width: 58% !important;
max-width: 54px !important;
height: auto !important;
}
.publication-ci-examples .cover-example span,
.publication-ci-examples .spine-example span {
position: absolute !important;
left: 14px !important;
bottom: 10px !important;
}
@media (max-width: 1180px) {
.publication-ci-examples .publication-cover-full {
min-height: 240px !important;
}
.publication-spine-row {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 12px !important;
}
.publication-ci-examples .publication-spine-standard,
.publication-ci-examples .publication-spine-narrow {
min-height: 250px !important;
}
}
@media (max-width: 740px) {
.publication-ci-examples {
gap: 10px !important;
}
.publication-ci-examples .publication-cover-full {
min-height: 220px !important;
padding: 22px 14px !important;
}
.publication-ci-examples .publication-cover-full img {
width: 40% !important;
max-width: 150px !important;
}
.publication-spine-row {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 10px !important;
}
.publication-ci-examples .publication-spine-standard,
.publication-ci-examples .publication-spine-narrow {
min-height: 220px !important;
}
}
/* v255 — English Published Books list excludes separate English-edition cards; pre-founding archive dialogs remain available. */
/* v256 — English-page Google links use Korean source queries with English Google UI (hl=en). */
/* =========================================================
v257 — English contact-card description baseline alignment
- Telephone / Email / Head Office explanatory copy starts
on exactly the same horizontal line.
- Reserve an identical fixed contact-value row for all 3 cards.
========================================================= */
@media (min-width: 761px) {
body.lang-en #contact .contact-grid .contact-card {
display: grid !important;
grid-template-columns: minmax(0, 1fr) !important;
grid-template-rows:
auto /* number */
2.3em /* title */
7.2em /* telephone / email / office value */
minmax(3.2em, auto) !important; /* description */
row-gap: 10px !important;
align-content: start !important;
align-items: start !important;
}
body.lang-en #contact .contact-grid .contact-card .contact-number {
grid-row: 1 !important;
margin: 0 !important;
}
body.lang-en #contact .contact-grid .contact-card h3 {
grid-row: 2 !important;
margin: 0 !important;
}
body.lang-en #contact .contact-grid .contact-card .contact-value,
body.lang-en #contact .contact-grid .contact-card address.contact-value,
body.lang-en #contact .contact-grid .contact-card a.contact-value {
grid-row: 3 !important;
display: block !important;
width: 100% !important;
height: 7.2em !important;
min-height: 7.2em !important;
max-height: 7.2em !important;
margin: 0 !important;
padding: 0 !important;
line-height: 1.42 !important;
overflow: visible !important;
}
body.lang-en #contact .contact-grid .contact-card > p {
grid-row: 4 !important;
align-self: start !important;
margin: 0 !important;
padding: 0 !important;
line-height: 1.55 !important;
}
}
/* v258 — English AI Analysis links use Korean-source title + Michael S. Suh with English Google AI interface (hl=en, gl=us, udm=50). */
/* =========================================================
v259 — English founder professions: true Title Case
- Remove inherited uppercase/small-caps styling.
========================================================= */
body.lang-en .founder-entity-title-stacked,
body.lang-en .founder-entity-title-stacked > span {
text-transform: none !important;
font-variant: normal !important;
font-variant-caps: normal !important;
font-feature-settings: normal !important;
letter-spacing: 0 !important;
font-family: "Times New Roman", Times, serif !important;
}
/* =========================================================
v260 — Founding Collection description baseline alignment
- Reserve identical title height across all 12 cards.
- Publisher/description line starts at the same vertical level.
========================================================= */
#founder .founder-post-founding-section .founding-edition-card h5 {
min-height: 4.5em !important; /* reserve up to 3 title lines */
margin-bottom: 12px !important;
display: block !important;
}
#founder .founder-post-founding-section .founding-edition-publisher {
margin-top: 0 !important;
align-self: start !important;
}
@media (max-width: 760px) {
#founder .founder-post-founding-section .founding-edition-card h5 {
min-height: 4.5em !important;
}
}
/* =========================================================
v261 — remove AI-analysis buttons from all book cards
- Keep only Details / 상세 소개.
- Remaining action button spans full card width.
========================================================= */
#books .book-actions,
#founder .founder-post-founding-section .founding-card-actions {
display: grid !important;
grid-template-columns: 1fr !important;
gap: 0 !important;
}
#books .book-actions > :only-child,
#founder .founder-post-founding-section .founding-card-actions > :only-child {
width: 100% !important;
grid-column: 1 / -1 !important;
}
/* v262 — English News & Records cleaned to 3 institutional cards only. */
/* =========================================================
v263 — Founder Featured Works cards open book details
========================================================= */
#founder-featured-works .founder-featured-card.book-card-clickable {
cursor: pointer !important;
}
#founder-featured-works .founder-featured-card.book-card-clickable:focus-visible {
outline: 2px solid #DEBC68 !important;
outline-offset: 3px !important;
}
/* =========================================================
v264 — Founding Collection cards open book details
========================================================= */
#founder .founder-post-founding-section .founding-edition-card.book-card-clickable {
cursor: pointer !important;
}
#founder .founder-post-founding-section .founding-edition-card.book-card-clickable:focus-visible {
outline: 2px solid #DEBC68 !important;
outline-offset: 3px !important;
}
/* v265 — add mother/wife/kids family poetry to English Published Books. */
/* =========================================================
v266 — narrow spine examples use AW symbol only
- Standard spines retain symbol + wordmark.
- Narrow spines use the approved symbol-only asset.
========================================================= */
.publication-ci-examples .publication-spine-narrow img {
width: 46% !important;
max-width: 48px !important;
height: auto !important;
}
/* v267 — all Jeongrihapsida cover references now use the uploaded final borderless cover. */
/* v268 — six current-edition covers replaced with uploaded final cover images. */
/* =========================================================
v269 — section anchor offset for sticky navigation
- Major menu destinations must not hide their section heading
behind the sticky header.
- JavaScript below performs the precise title-based scroll;
these values are a no-JS fallback.
========================================================= */
#about,
#founder,
#organization,
#identity,
#books,
#news-records,
#contact {
scroll-margin-top: 104px !important;
}
@media (max-width: 760px) {
#about,
#founder,
#organization,
#identity,
#books,
#news-records,
#contact {
scroll-margin-top: 88px !important;
}
}
/* =========================================================
v286 EN — Title Case labels
========================================================= */
body.lang-en .founder-collection-stats span {
text-transform: none !important;
font-variant: normal !important;
font-variant-caps: normal !important;
letter-spacing: 0 !important;
}