/* =========================================================
   HXP — layout & components
   ========================================================= */

html {
  font-size: var(--fz);
}

body {
  color: var(--bk);
  background: var(--wh);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

main {
  display: block;
}

.wrap {
  width: 100%;
  margin: 0 auto;
  padding: 0 var(--space-d);
}

@media screen and (max-width: 1080px) {
  .wrap {
    padding-left: var(--space-xs);
    padding-right: var(--space-xs);
  }
}

/* ---------------------------------------------------------
   Buttons
--------------------------------------------------------- */
.btn {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  border: 0;
  cursor: pointer;
  font-family: 'Poppins', 'Pretendard Variable', sans-serif;
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 160%;
  text-decoration: none;
  color: inherit;
  background: none;
}

.btn--pill {
  border-radius: 50px;
  padding: var(--space-xs) var(--space-s);
  background: rgba(119, 126, 127, 0.10);
  backdrop-filter: blur(15px);
  color: var(--bk);
}

.btn--ghost {
  font-size: 14px;
  font-weight: 600;
  line-height: 160%;

  background: rgba(119, 126, 127, 0.10);
  backdrop-filter: blur(15px);
  color: var(--wh);
}

@media screen and (max-width: 1080px) {
  .btn {
    gap: 10px;
    font-size: 0.857rem;
    font-weight: 700;
    line-height: 160%;
    letter-spacing: -2%;
  }

  .btn--pill {
    border-radius: 50px;
    padding: 16px 32px;
    backdrop-filter: blur(50px);
  }

  .btn--ghost {
    font-size: 0.857rem;
    font-weight: 700;
    line-height: 160%;
    letter-spacing: -2%;
  }
}

/* ---------------------------------------------------------
   Header
--------------------------------------------------------- */
.header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  padding: var(--space-s) 0;
}

.header__inner {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  padding: 0 var(--space-s);
}

.header__logo {
  display: inline-flex;
}

.header__nav-group {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 12px;
}

.gnb {
  display: flex;
  align-items: center;
  gap: 65px;
  padding: var(--space-xs) var(--space-m);

  border-radius: 999px;
  background: rgba(119, 126, 127, 0.10);
  backdrop-filter: blur(50px);
}

.gnb a {
  display: inline-block;
  font-family: 'Poppins', 'Pretendard Variable', sans-serif;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  color: rgba(153, 153, 153, 0.30);
  border-radius: 999px;
  transition: color 0.2s;
}

.gnb a:hover,
.gnb a[aria-current="page"] {
  color: var(--gr);
}

.header--overlay .gnb {
  background: rgba(119, 126, 127, 0.10);
  backdrop-filter: blur(50px);
}

.header--overlay,
.header--overlay .gnb a {
  color: rgba(255, 255, 255, 0.30);
}

.header--overlay .gnb a:hover,
.header--overlay .gnb a[aria-current="page"] {
  color: var(--wh);
}

.header--wh-theme .gnb a {
  color: rgba(255, 255, 255, 0.30);
}

.header--wh-theme .gnb a:hover,
.header--wh-theme .gnb a[aria-current="page"] {
  color: var(--wh);
}

.header__nav-group {
  position: relative;
}

.header .snb {
  position: absolute;
  top: calc(100% + 12px);
  right: 0;
}

.snb-inner {
  display: flex;
  gap: 8px;
}

.snb__item {
  display: inline-block;
  white-space: nowrap;
  padding: 15px 35px;
  border-radius: 50px;
  background: rgba(119, 126, 127, 0.10);
  backdrop-filter: blur(15px);
  font-family: 'Poppins', 'Pretendard Variable', sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: rgba(153, 153, 153, 0.30);
  text-decoration: none;
  transition: color 0.2s, background 0.2s;
}

.snb__item:hover,
.snb__item.is-active {
  color: var(--gr);
}

.header--wh-theme .snb__item {
  color: rgba(255, 255, 255, 0.30);
}

.header--wh-theme .snb__item:hover,
.header--wh-theme .snb__item.is-active {
  color: var(--wh);
}

.snb--page {
  display: none;
}

@media screen and (max-width: 1120px) {
  .gnb {
    gap: 32px;
  }
}

@media screen and (max-width: 1080px) {
  .header__inner {
    flex-wrap: wrap;
    align-items: center;
    gap: 46px 20px;
  }

  .header__nav-group {
    display: contents;
  }

  .header__nav-btn {
    margin-left: auto;
  }

  .snb {
    width: 100vw;
    margin: 0 -30px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .snb::-webkit-scrollbar {
    display: none;
  }

  .snb-inner {
    flex-wrap: nowrap;
    justify-content: center;
    gap: 3px;
    width: max-content;
  }

  .snb__item {
    padding: 12px 22px;
    border-radius: 30px;
    backdrop-filter: blur(10px);
    font-size: 11px;
    font-weight: 700;
  }

  .header .snb {
    display: none;
  }

  .snb--page {
    display: block;
    width: auto;
    margin: 120px 0 0;
  }

  .snb--page .snb-inner {
    padding: 0 var(--space-xs);
  }
}

/* ---------------------------------------------------------
   Mobile Nav
--------------------------------------------------------- */
.header__nav-btn {
  display: none;
  padding: 0;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 999px;
  background: rgba(119, 126, 127, 0.10);
  backdrop-filter: blur(50px);
  cursor: pointer;
}

.header__nav-btn:after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg width='44' height='44' viewBox='0 0 44 44' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3CforeignObject x='0' y='0' width='0' height='0'%3E%3Cdiv xmlns='http://www.w3.org/1999/xhtml' style='backdrop-filter:blur(50px);clip-path:url(%23bgblur_0_2002_828_clip_path);height:100%25;width:100%25'%3E%3C/div%3E%3C/foreignObject%3E%3Cg data-figma-bg-blur-radius='100'%3E%3Cpath d='M15 16L29 16L29 18L15 18L15 16Z' fill='white'/%3E%3Cpath d='M15 22L29 22L29 24L15 24L15 22Z' fill='white'/%3E%3Cpath d='M15 28L29 28L29 30L15 30L15 28Z' fill='white'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='bgblur_0_2002_828_clip_path' transform='translate(0 0)'%3E%3Crect width='44' height='44' rx='22'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  pointer-events: none;
}

.nav-panel {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: flex;
  flex-direction: column;
  padding: var(--space-s) var(--space-s) calc(var(--space-s) + env(safe-area-inset-bottom, 0px));
}

/* 배경은 가상요소로 iOS 주소창 뒤(큰 뷰포트)까지 확장 —
   콘텐츠 박스는 그대로 두어 하단 버튼이 주소창에 가리지 않게 */
.nav-panel::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 100vh;
  height: 100lvh;
  z-index: -1;
  background: rgba(255, 158, 27, 0.50);
  backdrop-filter: blur(25px);
}

.nav-panel[hidden] {
  display: none;
}

.nav-panel__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.nav-panel__close {
  position: relative;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 999px;
  background: rgba(119, 126, 127, 0.10);
  backdrop-filter: blur(50px);
  cursor: pointer;
}

.nav-panel__close:after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg width='44' height='44' viewBox='0 0 44 44' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3CforeignObject x='0' y='0' width='0' height='0'%3E%3Cdiv xmlns='http://www.w3.org/1999/xhtml' style='backdrop-filter:blur(50px);clip-path:url(%23bgblur_0_2002_834_clip_path);height:100%25;width:100%25'%3E%3C/div%3E%3C/foreignObject%3E%3Cg data-figma-bg-blur-radius='100'%3E%3Cpath d='M16.3431 26.2426L26.2426 16.3431L27.6568 17.7574L17.7573 27.6568L16.3431 26.2426Z' fill='white'/%3E%3Cpath d='M27.6569 26.2426L17.7574 16.3431L16.3432 17.7574L26.2427 27.6568L27.6569 26.2426Z' fill='white'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='bgblur_0_2002_834_clip_path' transform='translate(0 0)'%3E%3Crect width='44' height='44' rx='22'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  pointer-events: none;
}

.nav-panel__menu {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 160px;
}

.nav-panel__link {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px 30px;
  border-radius: 999px;
  background: rgba(225, 226, 220, 0.10);
  backdrop-filter: blur(13px);
  color: var(--wh);
  font-family: 'Poppins', sans-serif;
  font-size: 1rem;
  font-weight: 600;
  text-decoration: none;
}

.nav-panel__contact {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: auto;
  padding: 8px 10px 8px 30px;
  -webkit-appearance: none;
  border: 0;
  border-radius: 999px;
  background: rgba(225, 226, 220, 0.10);
  backdrop-filter: blur(50px);
  color: var(--wh);
  font-family: 'Pretendard Variable', sans-serif;
  font-size: 1rem;
  font-weight: 700;
  line-height: 160%;
  cursor: pointer;
}

.nav-panel__contact-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 999px;
  background-image: url("data:image/svg+xml,%3Csvg width='42' height='42' viewBox='0 0 42 42' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M21 41.2881C32.598 41.2881 42 32.0455 42 20.6441C42 9.24266 32.598 0 21 0C9.40202 0 0 9.24266 0 20.6441C0 32.0455 9.40202 41.2881 21 41.2881Z' fill='%23E1E2DC' fill-opacity='0.1'/%3E%3Cpath d='M29.519 14.8731L21.3392 21.368C21.1534 21.5154 20.8465 21.5154 20.6606 21.368L12.4808 14.8731C12.1853 14.6383 12.4008 14.2446 12.8244 14.2446H29.1755C29.5991 14.2446 29.8146 14.6383 29.519 14.8731ZM10.9199 25.3186V15.7913C10.9199 15.4592 11.4429 15.295 11.7429 15.5332L20.586 22.555C20.6655 22.6184 20.7659 22.6658 20.8776 22.6849C21.0713 22.7181 21.2691 22.6703 21.403 22.5638L30.257 15.5336C30.557 15.2954 31.0799 15.4595 31.0799 15.7917V25.3189C31.0799 26.2716 30.08 27.044 28.8468 27.044H13.1536C11.9203 27.044 10.9204 26.2716 10.9204 25.3189L10.9199 25.3186Z' fill='white'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

@media screen and (max-width: 1080px) {
  .gnb {
    display: none;
  }

  .header__nav-btn {
    display: block;
  }
}

/* ---------------------------------------------------------
   Footer
--------------------------------------------------------- */
.footer {
  background: var(--4);
  color: var(--wh);
  padding: 84px var(--space-d) 40px;
  font-size: 14px;
}

.footer__inner {
  display: flex;
  align-items: center;
  gap: 70px;
  line-height: 160%;
}

.footer__contact {
  font-weight: 500;
}

.footer__contact strong {
  font-weight: 700;
  margin-right: 8px;
}

.footer__contact a {
  color: inherit;
  text-decoration: none;
}

.footer__copyright {
  font-weight: 500;
}

@media screen and (max-width: 1080px) {
  .footer {
    padding: var(--space-m) var(--space-s) 48px;

    font-size: 0.857rem;
  }

  .footer__inner {
    flex-direction: column;
    align-items: flex-start;
    gap: 18px;
  }

  .footer__contact strong {
    display: block;
    margin-right: 0;
  }
}

/* ---------------------------------------------------------
   디졸브 트랜지션 (페이지 이동 / 탭 전환 / 모바일 네비)
--------------------------------------------------------- */
body {
  animation: pageFade 0.45s ease;
}

@keyframes pageFade {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

body.page-leaving {
  opacity: 0;
  transition: opacity 0.3s ease;
}

.brand-panel.is-active,
.news__list.is-active {
  animation: tabFade 0.4s ease;
}

@keyframes tabFade {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.nav-panel {
  transition: opacity 0.3s ease;
}

.nav-panel.is-fading {
  opacity: 0;
}

.gnb:hover a,
.gnb:hover a[aria-current="page"] {
  color: rgba(153, 153, 153, 0.30);
}

.gnb:hover a:hover {
  color: var(--gr);
}

.header--overlay .gnb:hover a,
.header--overlay .gnb:hover a[aria-current="page"] {
  color: rgba(255, 255, 255, 0.30);
}

.header--overlay .gnb:hover a:hover {
  color: var(--wh);
}

.snb-inner:hover .snb__item,
.snb-inner:hover .snb__item.is-active {
  color: rgba(153, 153, 153, 0.30);
}

.snb-inner:hover .snb__item:hover {
  color: var(--gr);
}

.header--overlay .gnb a {
  color: var(--wh);
}

/* ---------------------------------------------------------
   Home
--------------------------------------------------------- */
.hero {
  position: relative;
  min-height: 100dvh;
  display: flex;
  align-items: flex-end;
  color: var(--wh);
  background-color: var(--3);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.20) 0%, rgba(0, 0, 0, 0.20) 100%);
}

.hero__headline {
  position: relative;
  z-index: 1;
  width: 100%;
  margin: 0 auto;
  padding: 0 var(--space-d) 123px;
  font-family: 'Poppins', sans-serif;
  font-size: 4.25rem;
  font-weight: 600;
  line-height: 120%;
  letter-spacing: -2%;
}

.hero__main,
.hero__sub {
  display: block;
}

.hero__sub {
  font-family: 'Pretendard Variable', sans-serif;
  font-size: 2rem;
  font-style: normal;
  font-weight: 700;
  line-height: 160%;
  letter-spacing: 0;
}

.hero__sub--top {
  margin-bottom: 5px;
}

.hero__sub--bottom {
  margin-top: 5px;
}

@media screen and (max-width: 1080px) {
  .hero__headline {
    padding: 0 var(--space-s) var(--space-d);
    font-size: 2rem;
  }

  .hero__sub {
    font-size: 1.143rem;
  }
}

/* ---------------------------------------------------------
   About
--------------------------------------------------------- */
.about-intro {
  min-height: 100dvh;
  margin: 0 auto;
  padding: calc(150px + 155px) var(--space-s) 150px;

  display: flex;
  justify-content: center;
  align-items: end;

  font-family: 'Pretendard Variable', sans-serif;
}

.about-intro-inner {
  width: 100%;
  max-width: calc(1400px + var(--space-d) * 2);
  padding: 0 var(--space-d);
}

.about-intro__headline {
  font-size: 2rem;
  font-weight: 700;
  line-height: 160%;
  text-align: left;
}

.about-intro__headline > em {
  font-size: 1.6rem;
  color: var(--2);
}

.about-intro__headline strong {
  color: var(--1);
}

.about-intro__body {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 1.6rem;
  margin: 160px 0 0 auto;
}

.about-intro__body p {
  max-width: 692px;
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 160%;
}

.about-intro__body p > em {
  font-size: 1rem;
  color: var(--2);
}

.about-intro__body p > strong {
  color: var(--1);
}

@media screen and (max-width: 1080px) {
  .about-intro {
    min-height: auto;
    padding: 260px var(--space-s) 80px;

    display: block;
  }

  .about-intro-inner {
    max-width: 100%;
    padding: 0;
  }

  .about-intro__headline {
    font-size: 1.6rem;
  }

  .about-intro__headline > em {
    font-size: 15.6px;
  }

  .about-intro__body {
    margin-top: 60px;
  }

  .about-intro__body p {
    font-size: 1.11rem;
  }
}

.about-intro {
  position: relative;
  overflow: hidden;
}

.about-intro-inner {
  position: relative;
}

.about-intro__shape {
  position: absolute;
  pointer-events: none;
}

.about-intro__shape--square {
  left: 26.8%;
  top: -22px;
  width: 82px;
  height: 88px;
  background: #553700;
}

.about-intro__shape--tri-top {
  left: 78.3%;
  top: 0;
  width: 112px;
  height: 122px;
  background: #FFE4B3;
  clip-path: polygon(0 0, 100% 0, 100% 100%);
}

.about-intro__shape--tri-gold {
  left: 26.8%;
  bottom: 34px;
  width: 81px;
  height: 89px;
  background: #FFC966;
  clip-path: polygon(0 0, 0 100%, 100% 100%);
}

.about-intro__shape--tri-right {
  right: -12px;
  bottom: 179px;
  width: 112px;
  height: 122px;
  background: #8F8070;
  clip-path: polygon(100% 0, 100% 100%, 0 100%);
}

@media screen and (max-width: 1080px) {
  .about-intro__shape--square {
    left: 61.7%;
    top: -6px;
    width: 48px;
    height: 52px;
  }

  .about-intro__shape--tri-top {
    left: auto;
    right: -26px;
    top: 158px;
    width: 56px;
    height: 61px;
  }

  .about-intro__shape--tri-gold {
    left: 65.3%;
    bottom: 20px;
    width: 48px;
    height: 49px;
    clip-path: polygon(100% 0, 100% 100%, 0 100%);
  }

  .about-intro__shape--tri-right {
    display: none;
  }
}

.mission {
  position: relative;
  margin: var(--space-xs);
  border-radius: var(--r);
  overflow: hidden;
  height: 600px;
  display: flex;
  align-items: center;
  background: center / cover no-repeat;
  color: var(--wh);
}

.mission::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.20) 0%, rgba(0, 0, 0, 0.20) 100%);
}

.mission__inner {
  position: relative;
  z-index: 1;
  margin: 0 auto;
  width: 100%;
  max-width: calc(1400px + var(--space-d) * 2);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-s);
  padding: 0 var(--space-d);
  align-items: center;
}

@media screen and (max-width: 1080px) {
  .mission {
    align-items: flex-end;
  }

  .mission__inner {
    display: block;
    padding: 0 var(--space-s) var(--space-s);
  }
}

.mission__label {
  font-family: 'Poppins', sans-serif;
  font-size: 2rem;
  font-weight: 600;
  line-height: 120%;
  letter-spacing: -2%;
}

.mission__text {
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 160%;
  margin-top: calc(var(--space-m) + 78px);
  margin-bottom: var(--space-m);
}

@media screen and (max-width: 1080px) {
  .mission__label {
    font-size: 1.6rem;
  }

  .mission__text {
    font-size: 1.11rem;
    margin-top: 35px;
    margin-bottom: 20px;
  }
}

.ceo {
  position: relative;
  padding: var(--space-d) var(--space-s);
  display: flex;
  justify-content: center;
}

.ceo::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.01);
  backdrop-filter: blur(10px);
}

.ceo__card {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 680px;
  padding: var(--space-d) var(--space-m) var(--space-s);
  border-radius: var(--r);
  background: rgba(119, 126, 127, 0.30);
  backdrop-filter: blur(50px);
  color: var(--wh);
}

@media screen and (max-width: 1080px) {
  .ceo {
    padding: var(--space-xs);
  }

  .ceo__card {
    padding: var(--space-m) var(--space-s);
  }
}

.ceo__letter {
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 160%;
}

.ceo__letter p + p {
  margin-top: 2.4rem;
}

.ceo__sign {
  margin-top: 2.4rem;
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 160%;
}

.ceo__logo {
  margin-top: 100px;
  display: flex;
  justify-content: end;
  align-items: center;
}

@media screen and (max-width: 1080px) {
  .ceo__letter {
    font-size: 1.11rem;
  }

  .ceo__letter p + p {
    margin-top: 1.78rem;
  }

  .ceo__sign {
    margin-top: 1.78rem;
    font-size: 1.11rem;
  }

  .ceo__logo {
    margin-top: 60px;
  }
}

/* ---------------------------------------------------------
   The HXP Way
--------------------------------------------------------- */
.way-grid {
  margin: 0 auto;
  padding: 240px 30px 20px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.way-card {
  position: relative;
  border-radius: var(--r);
  overflow: hidden;
  padding: 80px 60px 60px;
  text-align: center;
  aspect-ratio: 1 / 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

@media screen and (min-width: 2000px) {
  .way-grid {
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }

  .way-card {
    aspect-ratio: 1 / 1.4;
  }
}

.way-card__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

.way-card__bg svg {
  width: 100%;
  height: 100%;
  display: block;
}

.way-card > *:not(.way-card__bg) {
  position: relative;
  z-index: 1;
}

.way-card__tag {
  display: inline-block;
  margin: 0 auto;
  padding: var(--space-xs) var(--space-s);
  width: fit-content;
  font-family: 'Poppins', sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 3%;
  line-height: 160%;
  color: var(--wh);
  border-radius: 999px;
  background: rgba(135, 155, 170, 0.10);
  backdrop-filter: blur(50px);
}

.way-card__title {
  font-family: 'Pretendard Variable', sans-serif;
  font-size: 2.5rem;
  font-weight: 700;
  line-height: 140%;
  letter-spacing: -2%;
}

.way-card__subtitle {
  font-family: 'Pretendard Variable', sans-serif;
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 160%;
}

.way-card__body {
  font-family: 'Pretendard Variable', sans-serif;
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 160%;
}

@media screen and (max-width: 1080px) {
  .way-grid {
    margin: 0 auto;
    padding: 100px 30px 20px;
    grid-template-columns: 1fr;
  }

  .way-card {
    min-height: 0;
    padding: var(--space-s) var(--space-s) var(--space-m);
    aspect-ratio: 1 / 1.4;
    border-radius: 40px;
  }

  .way-card__tag {
    padding: 16px 32px;
    font-size: 0.857rem;
  }

  .way-card__title {
    font-size: 1.43rem;
    line-height: 160%;
    letter-spacing: 0;
  }

  .way-card__subtitle {
    font-size: 1rem;
  }

  .way-card__body {
    font-size: 1rem;
  }
}

/* ---------------------------------------------------------
   Business — 공통 페이지 상단 여백 (서브네비 포함 헤더)
--------------------------------------------------------- */
.business {
  padding-top: 280px;
}

.biz-bands,
.service-bands {
  margin: 0 auto;
  padding: 0 var(--space-xs) var(--space-xs);
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.biz-band {
  position: relative;
  border-radius: var(--r);
  overflow: hidden;
  height: 600px;
  display: flex;
  align-items: center;
  background: center / cover no-repeat;
  color: var(--wh);
}

.biz-band::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.30) 0%, rgba(0, 0, 0, 0.30) 100%);
}

.biz-band__inner {
  position: relative;
  z-index: 1;
  margin: 0 auto;
  width: 100%;
  max-width: calc(1400px + var(--space-d) * 2);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-s);
  padding: 0 var(--space-d);
  align-items: center;
}

@media screen and (max-width: 1080px) {
  .business {
    padding-top: 24px;
  }

  .biz-band {
    display: block;
    height: 500px;
  }

  .biz-band__inner {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    height: 100%;
    padding: 45px var(--space-s);
  }
}

.biz-band__label {
  font-family: 'Poppins', sans-serif;
  font-size: 2rem;
  font-weight: 600;
  line-height: 120%;
  letter-spacing: -2%;
}

.biz-band__text {
  font-family: 'Pretendard Variable', sans-serif;
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 160%;
}

@media screen and (max-width: 1080px) {
  .biz-band__label {
    font-size: 1.6rem;
  }

  .biz-band__text {
    font-size: 1.11rem;
    margin-top: 35px;
    margin-bottom: 20px;
  }
}

/* Service Areas */
.service-band {
  position: relative;
  border-radius: var(--r);
  overflow: hidden;
  height: 800px;
  display: flex;
  align-items: flex-end;
  background: center / cover no-repeat;
  color: var(--wh);
  padding: var(--space-s);
}

.service-band::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.30) 0%, rgba(0, 0, 0, 0.30) 100%);
}

.service-band__card {
  position: relative;
  z-index: 2;
  width: 740px;
  /*height: 420px;*/
  border-radius: var(--r);
  padding: 60px 50px 50px;
  background: rgba(119, 126, 127, 0.30);
  backdrop-filter: blur(25px);
  display: flex;
  align-items: flex-start;
  gap: 64px;
  cursor: pointer;
  transition: width 0.6s cubic-bezier(0.22, 1, 0.36, 1),
  height 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

.service-band__info {
  flex: 0 0 auto;
  width: 420px;

  font-family: 'Pretendard Variable', sans-serif;
}

.service-band__title {
  font-size: 2rem;
  font-weight: 700;
  line-height: 160%;
  margin-bottom: var(--space-s);
}

.service-band__text {
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 160%;
}

.service-band__details {
  display: none;
  flex: 1;
  min-width: 0;
  padding-right: 70px;
}

.service-band.is-open .service-band__card {
  width: 100%;
}

/* 확장 중 측정/자리 확보용 — 레이아웃에는 참여하되 보이지 않음 */
.service-band.is-preopen .service-band__details {
  display: block;
  opacity: 0;
}

.service-band.is-detailed .service-band__details {
  display: block;
  animation: serviceFade 0.35s both;
}

@keyframes serviceFade {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.service-band__detail-row {
  display: grid;
  grid-template-columns: 250px 1fr;
  font-size: 1.25rem;
  line-height: 160%;
}

.service-band__detail-row + .service-band__detail-row {
  margin-top: 20px;
}

.service-band__detail-row dt {
  font-weight: 600;
}

.service-band__detail-row dd {
  font-weight: 500;
}

.service-band__more {
  position: absolute;
  right: 50px;
  bottom: 50px;
  width: 70px;
  height: 70px;
  border: 0;
  border-radius: 50%;
  background-color: rgba(119, 126, 127, 0.30);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30' fill='none'%3E%3Cpath d='M15.7573 0L15.7573 30M30 15.7581L0 15.7581' stroke='white' stroke-width='1.90476'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 30px 30px;
  cursor: pointer;
}

.service-band.is-open .service-band__more {
  background-image: url("data:image/svg+xml,%3Csvg width='30' height='2' viewBox='0 0 30 2' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M30 0.952148L0 0.952151' stroke='white' stroke-width='1.90476'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 30px 2px;
}

.service-band.is-open {
  box-sizing: border-box;
}

@media screen and (max-width: 1080px) {
  .service-band {
    padding: 160px 16px var(--space-s);
    height: auto;
    min-height: 510px;
  }

  .service-band.is-open {

  }

  .service-band__card {
    width: 100%;
    height: auto;
    min-height: 317px;
    padding: var(--space-s) var(--space-s) 80px;
    backdrop-filter: blur(12px);
    gap: 0;
  }

  .service-band.is-open .service-band__card {
    flex-direction: column;
    height: auto;
  }

  .service-band__more {
    position: absolute;
    right: 30px;
    bottom: 15px;
    width: 38px;
    height: 38px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30' fill='none'%3E%3Cpath d='M15.7573 0L15.7573 30M30 15.7581L0 15.7581' stroke='white' stroke-width='1.90476'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 15px 15px;
  }

  .service-band.is-open .service-band__more {
    background-image: url("data:image/svg+xml,%3Csvg width='30' height='2' viewBox='0 0 30 2' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M30 0.952148L0 0.952151' stroke='white' stroke-width='1.90476'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 15px 1px;
  }

  .service-band.is-detailed .service-band__text {
    display: none;
  }

  .service-band__details {
    padding-right: 0;
  }

  .service-band__detail-row {
    grid-template-columns: 1fr;
    gap: 2px;
    font-size: 1.114rem;
  }

  .service-band__detail-row + .service-band__detail-row {
    margin-top: 15px;
  }

  .service-band__info {
    width: 100%;
  }

  .service-band__title {
    font-size: 1.6rem;
    margin-bottom: 28px;
  }

  .service-band__text {
    font-size: 1.114rem;
  }
}

/* ---------------------------------------------------------
   Brands / Properties
--------------------------------------------------------- */
.brand-stage {
  position: relative;
  margin: 0 auto;
  padding: 0 var(--space-xs) var(--space-xs);
}

.brand-tabs {
  /*position: absolute;
  top: var(--space-s);
  left: 50%;
  transform: translateX(-50%);
  z-index: 5;*/
  display: flex;
  gap: 20px;
  margin: auto;
  padding: 10px;
  border-radius: 999px;
  background: rgba(119, 126, 127, 0.10);
  backdrop-filter: blur(50px);
}

.brand-tabs__tab {
  border: 0;
  background: transparent;
  color: rgba(255, 255, 255, 0.30);
  font-size: 14px;
  font-weight: 700;
  line-height: 160%;
  padding: 15px 35px;
  border-radius: 50px;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}

.brand-tabs__tab.is-active {
  color: var(--wh);
}

.brand-panel {
  display: none;
  position: relative;
  border-radius: var(--r);
  overflow: hidden;
  min-height: 1080px;
  align-items: center;
  justify-content: center;
  text-align: center;
  background: var(--3) center / cover no-repeat;
  color: var(--wh);
}

.brand-panel.is-active {
  display: flex;
}

.brand-panel::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.20) 0%, rgba(0, 0, 0, 0.20) 100%);
}

.brand-panel__content {
  position: relative;
  z-index: 1;
}

.brand-panel__name {
  font-family: 'Poppins', sans-serif;
  font-size: 2rem;
  font-weight: 600;
  line-height: 120%;
  letter-spacing: -2%;
}

.brand-panel__name--kr {
  letter-spacing: 0;
}

.brand-panel__text {
  margin-top: 10px;
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 160%;
}

.brand-panel__content .btn {
  margin-top: var(--space-m);
  gap: 15px;
  font-size: 14px;
  font-weight: 700;
  line-height: 160%;
}

@media screen and (max-width: 1080px) {
  .brand-stage {
    margin-left: 0;
    margin-right: 0;
  }

  .brand-panel {
    min-height: 500px;
  }

  .brand-tabs {
    top: var(--space-xs);
    gap: 13px;
    padding: 6.5px;
    backdrop-filter: blur(32.5px);
  }

  .brand-tabs__tab {
    font-size: 11px;
    padding: 10px 23px;
    border-radius: 33px;
  }

  .brand-panel__name {
    font-size: 1.6rem;
  }

  .brand-panel__text {
    margin-top: var(--space-xs);
    font-size: 1.114rem;
    font-weight: 600;
  }

  .brand-panel__content {
    padding-top: 40px;
  }

  .brand-panel__content .btn {
    margin-top: var(--space-xs);
    gap: 10px;
    font-size: 0.857rem;
    letter-spacing: 3%;
  }
}

/* ---------------------------------------------------------
   Careers
--------------------------------------------------------- */
.careers-hero {
  position: relative;
  overflow: hidden;
  min-height: 50dvh; /* 화면 높이의 50% */
  background: center / cover no-repeat;
}

.careers-hero__lottie {
  position: absolute;
  inset: 0;
}

.careers-hero__lottie svg {
  width: 100%;
  height: 100%;
  display: block;
}

.how-we-work {
  padding: var(--space-xs) var(--space-xs) var(--space-xs) 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: stretch;
}

.how-we-work__text {
  width: 100%;
  max-width: calc(558px + var(--space-s) * 2);
  min-height: 840px;
  margin: 0 auto;
  padding: 104px var(--space-s);
}

.section-eyebrow {
  font-family: 'Poppins', sans-serif;
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 160%;
  color: var(--1);
  margin-bottom: 34px;
}

.how-we-work__visual {
  position: relative;
  overflow: hidden;
  border-radius: var(--r);
  width: 100%;
  background: var(--5) center / cover no-repeat;
}

.how-we-work__visual-img {
  position: absolute;
  inset: 0;
  background: center / cover no-repeat;
  opacity: 0;
  transition: opacity 0.45s ease;
}

.how-we-work__visual-img.is-active {
  opacity: 1;
}

@media screen and (max-width: 1080px) {
  .section-eyebrow {
    font-size: 1.114rem;
    font-weight: 600;
    line-height: 160%;
    margin-bottom: 20px;
  }

  .how-we-work__visual {
    display: none;
  }
}

/* Accordion */
.accordion__toggle {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  padding: 3.5px 0;
  border: 0;
  background: none;
  cursor: pointer;
  text-align: left;
}

.accordion__title {
  color: var(--bk);
  font-size: 2rem;
  font-weight: 700;
  line-height: 160%;
  opacity: 0.2;
  transition: opacity 0.2s;
}

.accordion__item.is-open .accordion__title {
  opacity: 1;
}

.accordion__icon {
  position: relative;
  flex: 0 0 40px;
  height: 40px;
  background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='40' height='40' rx='20' fill='%237F746A' fill-opacity='0.3'/%3E%3Cpath d='M20.3846 12.381L20.3846 27.6191M27.619 20.3851L12.3809 20.3851' stroke='white' stroke-width='1.90476'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.accordion__item.is-open .accordion__icon {
  background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='40' height='40' rx='20' fill='%237F746A' fill-opacity='0.3'/%3E%3Cpath d='M27.619 20L12.3809 20' stroke='white' stroke-width='1.90476'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

@media screen and (max-width: 1080px) {
  .accordion__icon {
    position: relative;
    flex: 0 0 30px;
    height: 30px;
    background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='40' height='40' rx='20' fill='%237F746A' fill-opacity='0.3'/%3E%3Cpath d='M20.3846 12.381L20.3846 27.6191M27.619 20.3851L12.3809 20.3851' stroke='white' stroke-width='1.90476'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
  }

  .accordion__item.is-open .accordion__icon {
    background-image: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='40' height='40' rx='20' fill='%237F746A' fill-opacity='0.3'/%3E%3Cpath d='M27.619 20L12.3809 20' stroke='white' stroke-width='1.90476'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
  }
}

.accordion__body {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

.accordion__body-inner {
  overflow: hidden;
  min-height: 0;
  max-width: 420px;
}

.accordion__item.is-open .accordion__body {
  grid-template-rows: 1fr;
}

.accordion__lead {
  font-size: 1.5rem;
  font-weight: 500;
  line-height: 160%;
  margin-bottom: 1.5em;
}

.accordion__detail {
  font-size: 1.5rem;
  font-weight: 500;
  line-height: 160%;
  padding-bottom: var(--space-d);
}

@media screen and (max-width: 1080px) {
  .how-we-work {
    padding: var(--space-m) var(--space-s);
    grid-template-columns: 1fr;
  }

  .how-we-work__text {
    max-width: 100%;
    min-height: auto;
    margin: 0 auto;
    padding: 0;
  }

  .accordion__item + .accordion__item {
    margin-top: 15px;
  }

  .accordion__toggle {
    padding: 10px 0;
  }

  .accordion__title {
    font-size: 1.6rem;
  }

  .accordion__lead {
    font-size: 1.114rem;
    font-weight: 600;
    margin-bottom: 1.114em;
  }

  .accordion__detail {
    font-size: 1.114rem;
    padding-bottom: 0;
  }
}

/* News */
.news-wrapper {
  background: var(--6);
}

.news {
  max-width: calc(1400px + var(--space-s) * 2);
  margin: 0 auto;
  padding: 120px var(--space-s);
}

.news__tabs {
  display: flex;
  gap: 40px;
  margin-bottom: 60px;
}

.news__tab {
  border: 0;
  background: none;
  padding: 0;
  color: var(--bk); /* iOS 사파리 버튼 기본색(파랑) 방지 */
  font-family: inherit;
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 160%;
  cursor: pointer;
  text-decoration: none;
  opacity: 0.3;

  transition: opacity 0.2s;
}

.news__tab.is-active,
.news__tab:hover {
  opacity: 1;
}

.news__list {
  display: none;
}

.news__list.is-active {
  display: block;
}

.news__row-title {
  font-weight: 600;
  line-height: 160%;
}

.news__row-side {
  display: flex;
  align-items: center;
  gap: 32px;
  color: var(--gr);
}

.news__row-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: var(--3);
  background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.4921 18.4472L9.9618 18.9775L11.0225 20.0382L11.5528 19.5079L11.0225 18.9775L10.4921 18.4472ZM19.7274 11.0226C19.7274 10.6084 19.3916 10.2726 18.9774 10.2726L12.2274 10.2726C11.8132 10.2726 11.4774 10.6084 11.4774 11.0226C11.4774 11.4368 11.8132 11.7726 12.2274 11.7726H18.2274V17.7726C18.2274 18.1868 18.5632 18.5226 18.9774 18.5226C19.3916 18.5226 19.7274 18.1868 19.7274 17.7726L19.7274 11.0226ZM11.0225 18.9775L11.5528 19.5079L19.5077 11.5529L18.9774 11.0226L18.4471 10.4923L10.4921 18.4472L11.0225 18.9775Z' fill='white'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

.news__row-date {
  color: var(--3);
  font-weight: 400;
  line-height: 160%;
}

@media screen and (max-width: 1080px) {
  .news {
    min-height: auto;
    padding: 80px var(--space-s);
  }

  .news__tabs {
    gap: 20px;
    margin-bottom: 30px;
  }

  .news__tab {
    font-size: 1.114rem;
  }

  .news__row a {
    padding: 10px 5px;
    font-size: 0.857rem;
  }
}

/* Notice detail */
.notice {
  padding: 180px 40px var(--space-m);
  background: var(--6);
}

.notice-inner {
  max-width: calc(1400px + var(--space-d) * 2);
  margin: 0 auto;
  padding: 0 var(--space-d);
}

.notice__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 20px 4px;
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
}

.notice__title {
  font-size: 1rem;
  font-weight: 700;
}

.notice__date {
  color: var(--gr);
  font-size: 0.8125rem;
}

.notice__body {
  padding: 48px 4px;
  font-size: 0.9375rem;
  line-height: 1.9;
}

.notice__body p + p {
  margin-top: 1.5em;
}

.notice__foot {
  display: flex;
  justify-content: flex-end;
  padding-top: 24px;
  border-top: 1px solid #ddd;
}

.notice__foot .btn {
  background: #eee;
}

/* Contact CTA */
.contact-cta {
  max-width: calc(1400px + var(--space-s) * 2);
  margin: 0 auto;
  padding: 27px var(--space-s);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.contact-cta__question {
  color: var(--gr);
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 160%;
}

.contact-cta__field {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 10px 8px 40px;
  min-width: 455px;
  color: var(--gr);
  font-size: 14px;
  font-weight: 700;
  line-height: 160%;

  border-radius: 999px;
  background: rgba(119, 126, 127, 0.05);
  backdrop-filter: blur(50px);

  cursor: pointer;
}

.contact-cta__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 49px;
  height: 49px;
  border-radius: 50%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='49' height='49' viewBox='0 0 49 49' fill='none'%3E%3Cpath d='M24.5 49C38.031 49 49 38.031 49 24.5C49 10.969 38.031 0 24.5 0C10.969 0 0 10.969 0 24.5C0 38.031 10.969 49 24.5 49Z' fill='%23777E7F' fill-opacity='0.1'/%3E%3Cpath d='M34.4392 17.6509L24.8961 25.3589C24.6793 25.5338 24.3212 25.5338 24.1044 25.3589L14.5613 17.6509C14.2165 17.3722 14.4679 16.905 14.9621 16.905H34.0384C34.5326 16.905 34.784 17.3722 34.4392 17.6509ZM12.7402 30.0474V18.7406C12.7402 18.3464 13.3503 18.1516 13.7004 18.4343L24.0173 26.7677C24.1101 26.8429 24.2272 26.8991 24.3575 26.9217C24.5836 26.9612 24.8142 26.9045 24.9705 26.7781L35.3001 18.4348C35.6501 18.152 36.2602 18.3469 36.2602 18.7411V30.0478C36.2602 31.1784 35.0937 32.095 33.6549 32.095H15.3461C13.9074 32.095 12.7408 31.1784 12.7408 30.0478L12.7402 30.0474Z' fill='%23999999'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

@media screen and (max-width: 1080px) {
  .contact-cta {
    padding: var(--space-m) var(--space-xs);
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
  }

  .contact-cta__question {
    width: 100%;
    font-size: 1.114rem;
    text-align: center;
  }

  .contact-cta__field {
    min-width: 100%;
  }
}

/* ---------------------------------------------------------
   Modal
--------------------------------------------------------- */
.modal {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
}

.modal[hidden] {
  display: none;
}

.modal__dim {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.20);
  backdrop-filter: blur(25px);
}

.modal__panel {
  position: relative;
  z-index: 1;
  width: 100%;
  border-radius: var(--r);
  background: var(--6);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

#contact-modal .modal__panel {
  background: var(--wh);
}

.modal__panel::-webkit-scrollbar {
  display: none;
}

.modal__panel--contact {
  max-width: 600px;
  max-height: calc(100dvh - 120px * 2);
  padding: var(--space-d) var(--space-m);
}

.modal__panel--detail {
  max-width: calc(100% - 120px * 2);
  max-height: calc(100dvh - 120px * 2);
  padding: 120px 100px;
  background: var(--wh);
}

.modal__close {
  position: fixed;
  z-index: 2;
  top: var(--space-d);
  right: 45px;
  width: 70px;
  height: 70px;
  border: 0;
  background-color: transparent;
  background-image: url("data:image/svg+xml,%3Csvg width='70' height='70' viewBox='0 0 70 70' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='70' height='70' rx='35' fill='white'/%3E%3Cpath d='M26.4059 25.4921L44.5078 43.594M44.5083 26.4064L26.4063 44.5084' stroke='black' stroke-opacity='0.3' stroke-width='3'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  cursor: pointer;
}

@media screen and (max-width: 1080px) {
  .modal__scroll {
    padding: 0 30px;
  }

  .modal__panel--detail {
    max-width: 100%;
    max-height: calc(100dvh - 100px * 2);
    padding: 60px 30px;
  }

  .modal__close {
    position: fixed;
    z-index: 2;
    top: var(--space-d);
    right: 35px;
    width: 30px;
    height: 30px;
    border: 0;
    border-radius: 50%;
    background-color: var(--wh);
    box-shadow: 0.75px 0.75px 3.75px 0 rgba(0, 0, 0, 0.10);
    /*backdrop-filter: blur(35px);*/
    /*background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3CforeignObject x='-68.1818' y='-68.1818' width='166.364' height='166.364'%3E%3Cdiv xmlns='http://www.w3.org/1999/xhtml' style='backdrop-filter:blur(34.09px);clip-path:url(%23bgblur_0_646_942_clip_path);height:100%25;width:100%25'%3E%3C/div%3E%3C/foreignObject%3E%3Cg filter='url(%23filter0_d_646_942)' data-figma-bg-blur-radius='68.1818'%3E%3Cpath opacity='0.3' d='M11.1636 10.7554L19.2448 18.8366M19.245 11.1636L11.1638 19.2448' stroke='black' stroke-width='1.5'/%3E%3C/g%3E%3Cdefs%3E%3Cfilter id='filter0_d_646_942' x='-68.1818' y='-68.1818' width='166.364' height='166.364' filterUnits='userSpaceOnUse' color-interpolation-filters='sRGB'%3E%3CfeFlood flood-opacity='0' result='BackgroundImageFix'/%3E%3CfeColorMatrix in='SourceAlpha' type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0' result='hardAlpha'/%3E%3CfeOffset dx='0.75' dy='0.75'/%3E%3CfeGaussianBlur stdDeviation='1.875'/%3E%3CfeComposite in2='hardAlpha' operator='out'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0'/%3E%3CfeBlend mode='normal' in2='BackgroundImageFix' result='effect1_dropShadow_646_942'/%3E%3CfeBlend mode='normal' in='SourceGraphic' in2='effect1_dropShadow_646_942' result='shape'/%3E%3C/filter%3E%3CclipPath id='bgblur_0_646_942_clip_path' transform='translate(68.1818 68.1818)'%3E%3Crect width='30' height='30' rx='15'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");*/
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    cursor: pointer;
  }
}

/* Contact form */
.contact-form__title {
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 160%;
  margin-bottom: var(--space-s);
}

.contact-form input,
.contact-form textarea {
  display: block;
  width: 100%;
  border: 0;
  border-radius: 40px;
  background: rgba(119, 126, 127, 0.10);
  padding: var(--space-xs) var(--space-s);
  margin-bottom: 10px;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 160%;
  font-family: inherit;
  resize: none;
}

.contact-form input::placeholder,
.contact-form textarea::placeholder {
  color: var(--gr);
  font-weight: 700;
  line-height: 160%;
}

/* 개인정보 수집·이용 동의 — 접힘: 인풋형 필 / 체크 시: 화이트 카드로 펼침 */
.contact-consent {
  border-radius: 40px;
  border: 1px solid rgba(119, 126, 127, 0.10);
  margin-bottom: 10px;
  transition: background 0.3s, box-shadow 0.3s;
}

.contact-consent__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  padding: var(--space-xs) var(--space-s);
  border: 0;
  background: none;
  font: inherit;
  cursor: pointer;
  text-align: left;
}

.contact-consent__label {
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 160%;
  color: var(--gr);
}

.contact-consent__check {
  flex: 0 0 auto;
  width: 28px;
  height: 28px;
  background-color: rgba(119, 126, 127, 0.10);
  transition: background-color 0.2s;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Ccircle cx='12' cy='12' r='9' stroke='white' stroke-width='1.5'/%3E%3Cpath d='M8 12.2L10.7 14.8L16 9.5' stroke='white' stroke-width='1.5'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Ccircle cx='12' cy='12' r='9' stroke='white' stroke-width='1.5'/%3E%3Cpath d='M8 12.2L10.7 14.8L16 9.5' stroke='white' stroke-width='1.5'/%3E%3C/svg%3E");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}

@media screen and (max-width: 1080px) {
  .contact-consent {
    border-radius: 30px;
  }

  .contact-consent__label {
    font-size: 1rem;
  }

  .contact-consent__check {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    background-color: rgba(119, 126, 127, 0.10);
    transition: background-color 0.2s;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Ccircle cx='12' cy='12' r='9' stroke='white' stroke-width='1.5'/%3E%3Cpath d='M8 12.2L10.7 14.8L16 9.5' stroke='white' stroke-width='1.5'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Ccircle cx='12' cy='12' r='9' stroke='white' stroke-width='1.5'/%3E%3Cpath d='M8 12.2L10.7 14.8L16 9.5' stroke='white' stroke-width='1.5'/%3E%3C/svg%3E");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
  }
}

.contact-consent__body {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}

.contact-consent__body-inner {
  overflow: hidden;
  min-height: 0;
  padding: 0 var(--space-s);
}

.contact-consent__text,
.contact-consent__meta {
  font-size: 1rem;
  font-weight: 700;
  line-height: 160%;
  color: var(--gr);
}

.contact-consent__meta {
  margin: 27px 0 0;
  padding-bottom: 40px;
}

@media screen and (max-width: 1080px) {
  .contact-consent__text,
  .contact-consent__meta {
    font-size: 12px;
  }

  .contact-consent__meta {
    margin: 20px 0 0;
    padding-bottom: 30px;
  }
}

.contact-consent.is-checked {
  background: var(--wh);
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
  /*border-radius: 24px;*/
}

.contact-consent.is-checked .contact-consent__check {
  background-color: var(--1);
  opacity: 1;
}

.contact-consent.is-checked .contact-consent__body {
  grid-template-rows: 1fr;
}

.contact-consent.is-error {
  animation: fieldShake 0.45s ease;
}

.contact-consent.is-error .contact-consent__label {
  color: var(--1);
}

.contact-form__actions {
  display: flex;
  justify-content: flex-end;
  margin-top: var(--space-s);
}

.contact-form__actions .btn {
  font-size: 14px;
  font-weight: 700;
}

/* 상세 팝업 */
.modal {
  overflow-x: hidden;
}

.detail,
.detail * {
  word-break: break-word;
  overflow-wrap: anywhere;
}

.detail__head > *,
.detail__section > *,
.detail__row > *,
.detail__values > *,
.detail__gallery > * {
  min-width: 0;
}

/* Brand detail modal */
.detail__head {
  display: grid;
  grid-template-columns: 3fr 1fr;
  gap: 60px;
  margin-bottom: 60px;
}

.detail__eyebrow {
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 160%;
}

.detail__title {
  font-size: 2.5rem;
  font-weight: 700;
  line-height: 160%;
  letter-spacing: -2%;
}

.detail__meta {
  display: flex;
  flex-direction: column;
  gap: 20px;
  font-size: 1rem;
  font-weight: 700;
  line-height: 160%;
}

.detail__meta-label {
  color: var(--gr);
  font-weight: 700;
  line-height: 160%;
}

@media screen and (max-width: 1080px) {
  .detail__head {
    gap: 30px;
    margin-bottom: 30px;
  }

  .detail__eyebrow {
    font-size: 1.114rem;
  }

  .detail__title {
    font-size: 1.429rem;
  }

  .detail__meta {
    font-size: 0.857rem;
  }

  .detail__meta-label {
    font-size: 0.857rem;
  }
}

.detail__hero {
  overflow: hidden;
  margin-bottom: 120px;
  border-radius: 40px;
}

.detail__hero img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.detail__hero--placeholder,
.detail__img-placeholder {
  border-radius: 40px;
}

.detail__section {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  margin-bottom: 120px;
}

.detail__section-title {
  font-size: 2rem;
  font-weight: 700;
  line-height: 160%;
  letter-spacing: -2%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.detail__section-lead {
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 160%;
}

.detail__gallery {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  margin-bottom: 120px;
}

.detail__gallery figure {
  border-radius: 40px;
  overflow: hidden;
}

.detail__gallery img {
  width: 100%;
  display: block;
}

.detail__paragraph {
  max-width: calc(50% - 30px);
  margin-left: auto;
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 160%;
  margin-bottom: 120px;
}

.detail__values {
  display: grid;
  grid-template-columns: 3fr 1fr;
  gap: 60px;
  align-items: end;
  margin-bottom: 120px;
}

.detail > :nth-last-child(2) {
  margin-bottom: 0;
}

.detail__values figure {
  border-radius: 40px;
  overflow: hidden;
}

.detail__values img {
  width: 100%;
  display: block;
}

.detail__value-list {
  display: flex;
  flex-direction: column;
  gap: 38px;
  padding-bottom: 20px;
}

.detail__value-list h5 {
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 160%;
}

.detail__value-list p {
  font-size: 1rem;
  font-weight: 700;
  line-height: 160%;
}

.detail__top {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 70px;
  height: 70px;
  margin: 100px 0 0 auto;
  border: 0;
  border-radius: 50%;
  background-image: url("data:image/svg+xml,%3Csvg width='80' height='80' viewBox='0 0 80 80' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='80' height='80' rx='40' fill='%23777E7F' fill-opacity='0.3'/%3E%3Cpath d='M38 55V57H42V55H40H38ZM41.4142 23.5858C40.6332 22.8047 39.3668 22.8047 38.5858 23.5858L25.8579 36.3137C25.0768 37.0948 25.0768 38.3611 25.8579 39.1421C26.6389 39.9232 27.9052 39.9232 28.6863 39.1421L40 27.8284L51.3137 39.1421C52.0948 39.9232 53.3611 39.9232 54.1421 39.1421C54.9232 38.3611 54.9232 37.0948 54.1421 36.3137L41.4142 23.5858ZM40 55H42V25H40H38V55H40Z' fill='white'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  cursor: pointer;
}

@media screen and (max-width: 1080px) {
  .detail__gallery {
    display: flex;
    flex-direction: column;
    gap: 30px;
  }

  .detail__section,
  .detail__values {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .detail__hero,
  .detail__section,
  .detail__values {
    margin-bottom: 30px;
  }

  .detail__head {
    display: flex;
    flex-direction: column;
  }

  .detail__paragraph {
    margin-bottom: 30px;
    max-width: 100%;
    font-size: 1.114rem;
  }

  .modal__panel--contact {
    padding: 40px 24px;
  }

  .detail__value-list {
    gap: 20px;
  }

  .detail__top {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin: 50px 0 0 auto;
    border: 0;
    border-radius: 50%;
    background-image: url("data:image/svg+xml,%3Csvg width='80' height='80' viewBox='0 0 80 80' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect width='80' height='80' rx='40' fill='%23777E7F' fill-opacity='0.3'/%3E%3Cpath d='M38 55V57H42V55H40H38ZM41.4142 23.5858C40.6332 22.8047 39.3668 22.8047 38.5858 23.5858L25.8579 36.3137C25.0768 37.0948 25.0768 38.3611 25.8579 39.1421C26.6389 39.9232 27.9052 39.9232 28.6863 39.1421L40 27.8284L51.3137 39.1421C52.0948 39.9232 53.3611 39.9232 54.1421 39.1421C54.9232 38.3611 54.9232 37.0948 54.1421 36.3137L41.4142 23.5858ZM40 55H42V25H40H38V55H40Z' fill='white'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    cursor: pointer;
  }

  .detail__section-title {
    font-size: 1.429rem;
  }

  .detail__value-list h5 {
    font-size: 1.114rem;
  }

  .detail__value-list p {
    font-size: 0.857rem;
  }
}

/* ---------------------------------------------------------
   Brand/Property 팝업
--------------------------------------------------------- */
.detail__category {
  font-size: 1rem;
  color: var(--gr);
  font-weight: 700;
  line-height: 160%;
}

.detail__meta {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.detail__meta-text {
  font-size: 1rem;
  font-weight: 700;
  line-height: 160%;
}

.detail__row {
  display: grid;
  gap: 60px;
  margin-bottom: 48px;
  align-items: end;
}

.detail__row--gallery {
  grid-template-columns: 2fr 1fr 1fr;
}

.detail__row--feature {
  grid-template-columns: 3fr 1fr;
}

.detail__row figure {
  border-radius: 40px;
  overflow: hidden;
}

.detail__row img {
  width: 100%;
  display: block;
}

.detail__hero--captioned {
  margin-bottom: 0;
}

.detail__caption {
  margin-top: 20px;
  margin-bottom: 120px;
  text-align: center;
  color: var(--gr);
  font-size: 1rem;
  font-weight: 700;
  line-height: 160%;
}

@media screen and (max-width: 1080px) {
  .detail__row {
    gap: 30px;
    margin-bottom: 30px;
  }

  .detail__row--gallery,
  .detail__row--feature {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .detail__meta {
    max-width: none;
  }

  .detail__category {
    font-size: 0.857rem;
  }

  .detail__meta-text {
    font-size: 0.857rem;
  }

  .detail__caption {
    margin-top: 10px;
    margin-bottom: 30px;
    font-size: 0.857rem;
  }
}

.detail__top {
  /*position: sticky;*/
  /*bottom: -120px;*/
  /*z-index: 5;*/
}

.detail__head--property {
  align-items: flex-start;
}

.detail__statement {
  font-size: 2rem;
  font-weight: 700;
  line-height: 160%;
}

.detail__hero--center {
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
}

@media screen and (max-width: 1080px) {
  .detail__head--property {
    flex-direction: column;
  }

  .detail__hero--center {
    max-width: 100%;
  }

  .detail__statement {
    font-size: 1.6rem;
    line-height: 140%;
  }
}

/* ---------------------------------------------------------
   개인정보처리방침 레이어 팝업
--------------------------------------------------------- */
.footer__policy {
  border: 0;
  background: none;
  padding: 0;
  color: inherit;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.modal__panel--privacy {
  max-width: 600px;
  max-height: calc(100dvh - 100px * 2);
  background: var(--wh);
  padding: var(--space-d) var(--space-s);
}

.privacy__title {
  font-size: 1.5rem;
  font-weight: 700;
  margin-bottom: 1.5em;
}

.privacy__date {
  font-size: 14px;
  color: var(--gr);
  margin-bottom: 2em;
}

.privacy__body {
  font-size: 14px;
  line-height: 1.8;
  color: #555;
}

.privacy__body p + p {
  margin-top: 1.4em;
}

.privacy__body strong {
  display: block;
  color: var(--bk);
  margin-bottom: 0.3em;
}

@media screen and (max-width: 1080px) {

}

/* ---------------------------------------------------------
   브랜드 탭 — 슬라이딩 배경 인디케이터
--------------------------------------------------------- */
.brand-tabs {
  position: relative;
  width: fit-content;
  z-index: 2;

  max-width: 444px;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

.brand-tabs::-webkit-scrollbar {
  display: none;
}

.brand-tabs.is-scrollable {
  cursor: grab;
}

.brand-tabs.is-scrollable:active {
  cursor: grabbing;
}

.brand-tabs .brand-tabs__tab {
  flex: 0 0 auto;
  white-space: nowrap;
}

.brand-tabs__indicator {
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 999px;
  background: rgba(119, 126, 127, 0.10);
  backdrop-filter: blur(15px);
  transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
  width 0.35s cubic-bezier(0.22, 1, 0.36, 1),
  height 0.35s cubic-bezier(0.22, 1, 0.36, 1);
  pointer-events: none;
  z-index: 0;
}

.brand-tabs__indicator.no-transition {
  transition: none;
}

.brand-tabs__tab {
  position: relative;
  z-index: 1;
}

.brand-tabs__tab.is-active {
  background: transparent;
}

.brand-stage {
  display: grid;
  grid-template-columns: 1fr;
}

.brand-stage > .brand-tabs {
  grid-area: 2 / 1;
  align-self: start;
  justify-self: center;
  margin: 40px 0 0;
  z-index: 5;
}

.brand-panel {
  display: flex;
  grid-area: 2 / 1;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.5s ease, visibility 0.5s;
  animation: none;
}

.brand-panel.is-active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  animation: none;
}

@media screen and (max-width: 1080px) {
  .brand-stage > .brand-tabs {
    grid-area: 2 / 1;
    align-self: start;
    justify-self: center;
    margin: var(--space-xs) 0 0;
    z-index: 5;
    max-width: min(341px, calc(100vw - 60px));
  }

  .brand-panel {
    margin-top: 0;
    padding: 0 30px;
  }
}

/* ---------------------------------------------------------
   이미지 레이지 로드
--------------------------------------------------------- */
[data-bg] {
  background-image: var(--bg);
}

img.lazy-blur {
  filter: blur(14px);
  transition: filter 0.45s ease;
}

img.lazy-blur.is-loaded {
  filter: none;
}

.header--wh-theme .gnb:hover a,
.header--wh-theme .gnb:hover a[aria-current="page"] {
  color: rgba(255, 255, 255, 0.30);
}

.header--wh-theme .gnb:hover a:hover {
  color: var(--wh);
}

.header--wh-theme .snb__item {
  color: rgba(255, 255, 255, 0.30);
}

.header--wh-theme .snb__item:hover,
.header--wh-theme .snb__item.is-active {
  color: var(--wh);
}

.header--wh-theme .snb-inner:hover .snb__item,
.header--wh-theme .snb-inner:hover .snb__item.is-active {
  color: rgba(255, 255, 255, 0.30);
}

.header--wh-theme .snb-inner:hover .snb__item:hover {
  color: var(--wh);
}

/* ---------------------------------------------------------
   화이트 테마 로고 스왑 — 기본 로고 위에 화이트 로고를 겹쳐두고
   .header--wh-theme일 때 크로스페이드로 전환.
   .header__logo--swap이 붙은 페이지(블랙 로고)만 스왑,
   About/Careers(오렌지)는 항상 그대로 유지
--------------------------------------------------------- */
.header__logo {
  display: inline-grid;
}

.header__logo-img {
  grid-area: 1 / 1;
  transition: opacity 0.25s ease;
}

.header__logo-img--wh {
  opacity: 0;
}

.header--wh-theme .header__logo--swap .header__logo-img--wh {
  opacity: 1;
}

.header--wh-theme .header__logo--swap .header__logo-img:not(.header__logo-img--wh) {
  opacity: 0;
}

/* ---------------------------------------------------------
   헤더 빈 영역 클릭 통과 — 헤더 바는 클릭을 흘려보내고
   실제 요소(로고/네비/버튼)만 클릭 가능
--------------------------------------------------------- */
.header {
  pointer-events: none;
}

.header__logo,
.gnb,
.snb,
.header__nav-btn {
  pointer-events: auto;
}

/* ---------------------------------------------------------
   게시판 아코디언 + 페이지네이션
--------------------------------------------------------- */
.news__row-toggle {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  padding: 13px 10px;
  border: 0;
  border-top: 1px solid var(--3);
  background: none;
  text-align: left;
  color: inherit;
  font-size: 14px;
  font-family: inherit;
  line-height: 160%;
  font-weight: 600;
  cursor: pointer;
}

.news__list .news__row:last-child {
  border-bottom: 1px solid var(--3);
}

.news__row-body {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

.news__row-body-inner {
  overflow: hidden;
  min-height: 0;
  border-top: 1px solid rgb(119 126 127 / 0.2);;
}

.news__row.is-open .news__row-body {
  grid-template-rows: 1fr;
}

.news__row-text {
  padding: 60px 10px 0;
  font-size: 14px;
  font-weight: 400;
  line-height: 160%;
  max-width: none;
}

.news__row-text p + p {
  margin-top: 1.6em;
}

/* 패널 본문 서식 — reset.css가 굵기·제목·목록 스타일을 지우므로 여기서 되살린다 */
.news__row-text > * + * {
  margin-top: 1.6em;
}

.news__row-text strong,
.news__row-text b {
  font-weight: 700;
}

.news__row-text em {
  font-style: italic;
}

.news__row-text h1,
.news__row-text h2,
.news__row-text h3,
.news__row-text h4,
.news__row-text h5,
.news__row-text h6 {
  font-weight: 700;
  line-height: 150%;
}

.news__row-text h1,
.news__row-text h2 {
  font-size: 18px;
}

.news__row-text h3 {
  font-size: 16px;
}

.news__row-text > h1:not(:first-child),
.news__row-text > h2:not(:first-child),
.news__row-text > h3:not(:first-child) {
  margin-top: 2.8em;
}

.news__row-text > h1 + *,
.news__row-text > h2 + *,
.news__row-text > h3 + *,
.news__row-text > h4 + *,
.news__row-text > h5 + *,
.news__row-text > h6 + * {
  margin-top: 0.6em;
}

.news__row-text ul,
.news__row-text ol {
  padding-left: 1.4em;
}

.news__row-text ul {
  list-style: disc;
}

.news__row-text ol {
  list-style: decimal;
}

.news__row-text li + li {
  margin-top: 0.8em;
}

.news__row-text a {
  text-decoration: underline;
  word-break: break-all;
}

/* 게시물이 없는 게시판 */
.news__empty {
  padding: 60px 10px;
  border-top: 1px solid var(--3);
  border-bottom: 1px solid var(--3);
  font-size: 14px;
  line-height: 160%;
  text-align: center;
  opacity: 0.5;
}

.news__row-body-inner .notice__file {
  margin: 60px 0;
}

.news__row-body-inner > :last-child {
  margin-bottom: 60px;
}

/* 페이지네이션 */
.news__pagination {
  display: flex;
  align-items: center;
  gap: 30px;
  padding: 42px 4px 0;
}

.news__page {
  border: 0;
  background: none;
  padding: 0;
  font-size: 1rem;
  font-weight: 700;
  font-family: inherit;
  color: var(--gr);
  cursor: pointer;
  transition: color 0.2s;
}

.news__page:hover {
  color: var(--gr);
}

.news__page.is-current {
  color: var(--bk);
  cursor: default;
}

.news__list:not(.is-active) + .news__pagination {
  display: none;
}

.modal {
  display: block;
  height: 100vh;
  height: 100lvh;
}

.modal__dim {
  position: absolute;
  inset: 0;
}

.modal__scroll {
  position: absolute;
  inset: 0;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding: 200px 0 125px;
}

.modal__scroll::-webkit-scrollbar {
  display: none;
}

.modal__panel {
  margin: 0 auto;
  max-height: none;
  overflow: visible;
}

.modal__panel--detail {
  width: calc(100% - 250px);
  max-width: none;
}

.modal__panel--contact,
.modal__panel--privacy {
  width: 100%;
  max-width: 600px;
}

@media screen and (max-width: 1080px) {
  .modal__scroll {
    padding: 90px 0 30px;
  }

  .modal__panel--detail,
  .modal__panel--contact,
  .modal__panel--privacy {
    width: calc(100% - 60px);
    max-width: none;
  }
}

.detail__hero img {
  width: 100%;
  aspect-ratio: 2 / 1;
  object-fit: cover;
  display: block;
}

.detail__hero--placeholder {
  aspect-ratio: 2 / 1;
}

.detail__hero--placeholder,
.detail__img-placeholder {
  min-height: 0;
}

.detail__row--feature figure,
.detail__row--feature .detail__img-placeholder {
  aspect-ratio: 3 / 2;
  overflow: hidden;
}

.detail__row--feature figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.detail__gallery figure,
.detail__gallery .detail__img-placeholder {
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

.detail__gallery figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.detail__values figure,
.detail__values .detail__img-placeholder {
  aspect-ratio: 3 / 2;
  overflow: hidden;
}

.detail__values figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media screen and (max-width: 1080px) {
  .detail__hero {
    margin-bottom: 30px;
    border-radius: 20px;
  }

  .detail__gallery {
    margin-bottom: 30px;
  }

  .detail__gallery figure,
  .detail__gallery .detail__img-placeholder {
    border-radius: 20px;
  }

  .detail__values figure,
  .detail__values .detail__img-placeholder {
    border-radius: 20px;
  }

  .detail__row--feature figure,
  .detail__row--feature .detail__img-placeholder {
    border-radius: 20px;
  }
}

.service-band__card {
  transition: width 0.6s cubic-bezier(0.22, 1, 0.36, 1),
  height 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

@media screen and (max-width: 1080px) {
  .hero {
    min-height: calc(var(--vh, 1vh) * 100);
  }

  .about-intro {
    min-height: auto;
  }

  .careers-hero {
    min-height: calc(var(--vh, 1vh) * 50);
  }
}

/* ---------------------------------------------------------
   게시판 아코디언 첨부파일 필 — 피그마 스펙
--------------------------------------------------------- */
.news__row-body-inner .notice__file {
  display: inline-flex;
  align-items: center;
  gap: 20px;
  padding: 16px 24px 16px 40px;
  border-radius: 999px;
  background: rgba(119, 126, 127, 0.10);
  backdrop-filter: blur(50px);

  color: var(--gr);
  font-family: 'Pretendard Variable', Pretendard, sans-serif;
  font-size: 1rem;
  font-weight: 700;
  line-height: 160%;
  text-decoration: none;
}

.news__row-body-inner .notice__file-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: var(--gr);
  background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M19.125 17.701C19.125 18.8572 18.7267 19.8411 17.93 20.6527C17.1334 21.4642 16.1592 21.87 15.0073 21.87C13.8555 21.87 12.8788 21.4642 12.0773 20.6527C11.2758 19.8411 10.875 18.8572 10.875 17.701V11.0365C10.875 10.2291 11.1527 9.54283 11.708 8.97757C12.2635 8.41245 12.9449 8.12988 13.7522 8.12988C14.5596 8.12988 15.2409 8.41245 15.7963 8.97757C16.3517 9.54283 16.6294 10.2291 16.6294 11.0365V17.3488C16.6294 17.797 16.473 18.183 16.1602 18.5069C15.8475 18.8308 15.4663 18.9928 15.0167 18.9928C14.5671 18.9928 14.1803 18.8334 13.8564 18.5146C13.5325 18.1957 13.3706 17.8071 13.3706 17.3488V11.0071H14.1339V17.3488C14.1339 17.5924 14.2173 17.8001 14.3841 17.9718C14.551 18.1436 14.7563 18.2295 14.9999 18.2295C15.2437 18.2295 15.4489 18.1436 15.6157 17.9718C15.7826 17.8001 15.8661 17.5924 15.8661 17.3488V11.0218C15.8632 10.4287 15.6592 9.92564 15.2543 9.51268C14.8495 9.09971 14.3488 8.89322 13.7522 8.89322C13.1603 8.89322 12.6599 9.10219 12.2513 9.52012C11.8427 9.93792 11.6383 10.4434 11.6383 11.0365V17.701C11.6354 18.6435 11.9618 19.4467 12.6175 20.1107C13.2731 20.7747 14.0715 21.1067 15.0127 21.1067C15.9404 21.1067 16.729 20.7747 17.3785 20.1107C18.028 19.4467 18.3557 18.6435 18.3617 17.701V11.0071H19.125V17.701Z' fill='white'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

/* ---------------------------------------------------------
   문의 폼 유효성 에러 — 텍스트/플레이스홀더 --1 컬러 + 좌우 흔들림 3회
--------------------------------------------------------- */
.contact-form .is-error {
  color: var(--1);
  animation: fieldShake 0.45s ease;
}

.contact-form .is-error::placeholder {
  color: var(--1);
}

@keyframes fieldShake {
  0%, 100% {
    transform: translateX(0);
  }
  12% {
    transform: translateX(-9px);
  }
  28% {
    transform: translateX(8px);
  }
  44% {
    transform: translateX(-7px);
  }
  60% {
    transform: translateX(6px);
  }
  76% {
    transform: translateX(-4px);
  }
  90% {
    transform: translateX(3px);
  }
}