/* ■ 인사말 */
.about__greeting { padding: 160px 0; }
.about__greeting > .wrap-medium { display: grid; grid-template-columns: minmax(0, 720fr) minmax(0, 760fr); gap: 120px; align-items: center; }
.about__greeting-photo { overflow: hidden; margin: 0; aspect-ratio: 720 / 860; border-radius: 20px; font-size: 0; }
.about__greeting-photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.about__greeting-text { display: flex; flex-direction: column; align-items: flex-start; gap: 40px; }
.about__greeting-text h2 { margin: 0; font-family: var(--font-serif); font-size: 48px; font-weight: 700; line-height: 1.4; color: var(--color-primary); word-break: keep-all; }
.about__greeting-line { display: block; width: 60px; height: 3px; background-color: var(--color-sub-1); }
.about__greeting-body { display: flex; flex-direction: column; gap: 1.6em; font-size: 20px; line-height: 1.6; color: var(--color-sub-3); word-break: keep-all; }
.about__greeting-body p { margin: 0; }
.about__greeting-sign { margin: 0; font-family: var(--font-serif); font-size: 24px; font-weight: 700; line-height: 1.4; color: var(--color-primary); }

@media all and (max-width:1279px) {
  .about__greeting { padding: 120px 0; }
  .about__greeting > .wrap-medium { gap: 64px; }
  .about__greeting-text { gap: 32px; }
  .about__greeting-text h2 { font-size: 36px; }
  .about__greeting-body { font-size: 18px; }
  .about__greeting-sign { font-size: 20px; }
}

@media all and (max-width:1023px) {
  .about__greeting { padding: 80px 0; }
  .about__greeting > .wrap-medium { grid-template-columns: 1fr; gap: 40px; }
  .about__greeting-photo { aspect-ratio: 343 / 380; max-width: 560px; }
}

@media all and (max-width:767px) {
  .about__greeting { padding: 60px 0; }
  /* 모바일은 제목 → 사진 → 본문 순서 */
  .about__greeting > .wrap-medium { display: flex; flex-direction: column; align-items: stretch; gap: 24px; }
  .about__greeting-text { display: contents; }
  .about__greeting-text h2 { order: -1; font-size: 24px; }
  .about__greeting-photo { max-width: none; border-radius: 10px; }
  .about__greeting-body { gap: 1.8em; font-size: 15px; line-height: 1.8; }
  .about__greeting-sign { font-size: 18px; }
}


/* ■ 숫자 */
.about__numbers { padding: 80px 0; background-color: var(--color-sub-1); }
.about__numbers ul { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.about__numbers li { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; line-height: 1.4; white-space: nowrap; }
.about__numbers li + li { border-left: 1px solid rgba(255, 255, 255, 0.3); }
.about__numbers strong { font-family: var(--font-serif); font-size: 56px; font-weight: 700; color: var(--color-neutral-1); }
.about__numbers span { font-size: 20px; color: var(--color-bg-1); opacity: 0.85; }

@media all and (max-width:1023px) {
  .about__numbers { padding: 60px 0; }
  .about__numbers strong { font-size: 40px; }
  .about__numbers span { font-size: 16px; }
}

@media all and (max-width:767px) {
  .about__numbers { padding: 40px 0; }
  .about__numbers ul { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 24px; }
  .about__numbers li { gap: 2px; }
  .about__numbers li + li { border-left: 0; }
  .about__numbers strong { font-size: 32px; }
  .about__numbers span { font-size: 13px; }
}


/* ■ 주요연혁 */
.about__history { padding: 160px 0; background-color: var(--color-sub-4); }
.about__history > .wrap-medium { display: flex; align-items: flex-start; gap: 120px; }
.about__history-head { display: flex; flex-direction: column; gap: 24px; flex: 0 0 520px; }
.about__history-lead { margin: 0; font-size: 20px; line-height: 1.7; color: var(--color-sub-3); word-break: keep-all; }
.about__timeline { flex: 1 1 0; min-width: 0; margin: 0; padding: 0 0 0 56px; border-left: 2px solid rgba(48, 35, 27, 0.2); list-style: none; }
.about__timeline > li { display: flex; flex-direction: column; gap: 10px; padding: 28px 0; }
.about__timeline > li:first-child { padding-top: 0; }
.about__timeline-year { position: relative; margin: 0; font-family: var(--font-serif); font-size: 40px; font-weight: 700; line-height: 1.4; color: var(--color-sub-1); }
/* 점 중심을 연혁 선(2px) 가운데, 연도 첫 줄 가운데에 맞춘다 */
.about__timeline-dot { position: absolute; top: 15px; left: -70px; font-size: 0; }
.about__timeline-dot img { display: block; width: 26px; height: 26px; }
.about__timeline-item { display: flex; flex-direction: column; gap: 10px; }
.about__timeline-item + .about__timeline-item { margin-top: 40px; }
.about__timeline-item h3 { margin: 0; font-family: var(--font-serif); font-size: 28px; font-weight: 700; line-height: 1.4; color: var(--color-primary); word-break: keep-all; }
.about__timeline-item p { margin: 0; font-size: 20px; line-height: 1.4; color: var(--color-sub-3); word-break: keep-all; }

@media all and (max-width:1279px) {
  .about__history { padding: 120px 0; }
  .about__history > .wrap-medium { gap: 64px; }
  .about__history-head { flex-basis: 340px; }
  .about__history-lead { font-size: 18px; }
}

@media all and (max-width:1023px) {
  .about__history { padding: 80px 0; }
  .about__history > .wrap-medium { flex-direction: column; gap: 48px; }
  .about__history-head { flex-basis: auto; }
  .about__timeline { align-self: stretch; }
  .about__timeline-year { font-size: 32px; }
  .about__timeline-dot { top: 9px; }
  .about__timeline-item + .about__timeline-item { margin-top: 28px; }
  .about__timeline-item h3 { font-size: 24px; }
  .about__timeline-item p { font-size: 18px; }
}

@media all and (max-width:767px) {
  .about__history { padding: 60px 0; }
  .about__history > .wrap-medium { gap: 28px; }
  .about__history-head { gap: 28px; }
  .about__history-lead { font-size: 15px; line-height: 1.8; }
  .about__timeline { padding-left: 28px; }
  .about__timeline > li { gap: 6px; padding: 16px 0; }
  .about__timeline-year { font-size: 22px; }
  .about__timeline-dot { top: 7px; left: -38px; }
  .about__timeline-dot img { width: 18px; height: 18px; }
  .about__timeline-item { gap: 6px; }
  .about__timeline-item + .about__timeline-item { margin-top: 10px; }
  .about__timeline-item h3 { font-size: 17px; }
  .about__timeline-item p { font-size: 14px; }
}


/* ■ 오시는 길 */
.about__location { padding: 160px 0; }
.about__location > .wrap-medium { display: flex; flex-direction: column; gap: 80px; }
.about__location-wrap { display: grid; grid-template-columns: minmax(0, 1fr) 540px; overflow: hidden; }
.about__location-map { position: relative; min-height: 560px; background-color: #e8e0d6; }
.about__location-map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.about__location-info { display: flex; flex-direction: column; gap: 32px; padding: 80px 60px; background-color: var(--color-primary); color: var(--color-sub-4); line-height: 1.4; }
.about__location-info h3 { margin: 0; font-family: var(--font-serif); font-size: 32px; font-weight: 700; }
.about__location-address { margin: 0; font-size: 20px; word-break: keep-all; }
.about__location-info dl { display: flex; flex-direction: column; gap: 12px; margin: 0 0 auto; font-size: 20px; }
.about__location-info dl > div { display: flex; gap: 9px; }
.about__location-info dt { flex: 0 0 100px; opacity: 0.7; }
.about__location-info dd { margin: 0; word-break: break-all; }
.about__location-btn { display: flex; align-items: center; justify-content: center; padding: 16px 40px; border-radius: 99px; background-color: var(--color-sub-2); font-family: var(--font-serif); font-size: 20px; font-weight: 700; color: var(--color-primary); transition: filter 0.2s ease; }
.about__location-btn:hover { filter: brightness(1.06); }

@media all and (max-width:1279px) {
  .about__location { padding: 120px 0; }
  .about__location > .wrap-medium { gap: 60px; }
  .about__location-wrap { grid-template-columns: minmax(0, 1fr) 420px; }
  .about__location-info { padding: 60px 40px; }
  .about__location-info h3 { font-size: 28px; }
  .about__location-address,
  .about__location-info dl,
  .about__location-btn { font-size: 18px; }
}

@media all and (max-width:1023px) {
  .about__location { padding: 80px 0; }
  .about__location-wrap { grid-template-columns: 1fr; }
  .about__location-map { min-height: 400px; }
}

@media all and (max-width:767px) {
  .about__location { padding: 60px 0; }
  .about__location > .wrap-medium { gap: 32px; }
  .about__location-wrap { gap: 32px; }
  .about__location-map { min-height: 240px; }
  .about__location-info { gap: 20px; padding: 28px 24px; }
  .about__location-info h3 { font-size: 20px; }
  .about__location-address,
  .about__location-info dl { font-size: 16px; }
  .about__location-info dl { gap: 8px; }
  .about__location-info dt { flex-basis: 80px; }
  .about__location-btn { padding: 11px 20px; font-size: 16px; }
}

/* 노트북(1024~1599px): 1920 기준 디자인이라 글자가 커 보여 한 단계 줄인다 */
@media all and (min-width:1024px) and (max-width:1599px) {
  .about__greeting-text h2 { font-size: 36px; }
  .about__greeting-body { font-size: 17px; }
  .about__greeting-sign { font-size: 20px; }
  .about__numbers strong { font-size: 44px; }
  .about__numbers span { font-size: 17px; }
  .about__history-lead { font-size: 17px; }
  .about__timeline-year { font-size: 32px; }
  .about__timeline-item h3 { font-size: 22px; }
  .about__timeline-item p { font-size: 17px; }
  .about__location-info h3 { font-size: 26px; }
  .about__location-address,
  .about__location-info dl { font-size: 17px; }
  .about__location-btn { font-size: 18px; }
}