@charset "utf-8";
/* layout.css는 전체적인 레이아웃 스타일을 정의합니다. */

#skipToContent a {z-index:100000;position:absolute;overflow:hidden;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0;}
#skipToContent a:focus,
#skipToContent a:active {width:200px;height:50px;background:#21272e;color:#fff;font-size:14px;font-weight:bold;text-align:center;text-decoration:none;line-height:50px;outline-color:#f37736;}
a:focus {outline:#f37736;}

.only-desktop-tablet {display:block;}
.only-desktop {display:block;}
.only-tablet {display:none;}
.only-mobile {display:none;}
.fr-box .swiper-wrapper {display:block;}

.contain {max-width:1380px; padding-left:var(--container-space); padding-right:var(--container-space); margin:0 auto;}

/* header */
#header {position:sticky; top:0; width:100%; background:var(--color-bg-dark); border-bottom:1px solid rgba(196, 165, 116, 0.2); z-index:1000; transition:background .2s, box-shadow .2s;}
#header .contain {position:relative; display:flex; align-items:center; justify-content:space-between; max-width:1380px; height:var(--header-height); z-index:10;}

.sitelogo {display:flex; align-items:center; flex-shrink:0;}
.sitelogo a {display:block; line-height:0;}
.sitelogo img {height:40px; width:auto; display:block; object-fit:contain;}

#gnb {text-align:center; flex:1 1 auto; min-width:0; width:1%;}
#gnb>ul {display:flex; justify-content:flex-end; gap:4px;}
#gnb>ul>li {position:relative; padding:0;}
#gnb>ul>li>a {position:relative; display:flex; align-items:center; justify-content:center; height:var(--header-height); padding:0 16px; color:rgba(255, 255, 255, 0.85); font-size:16px; font-weight:600; letter-spacing:-.02em; line-height:1.3em; transition:color var(--transition);}
#gnb>ul>li>a:hover, #gnb>ul>li.active>a {color:var(--color-primary);}
#gnb>ul>li>a:after {content:""; position:absolute; bottom:-1px; left:16px; right:16px; width:auto; height:3px; background:var(--color-primary); opacity:0; transition:opacity var(--transition);}
#gnb>ul>li.active>a:after {opacity:1;}
#gnb .submenu {display: none; position:absolute; left:0; width:100%; min-width: 180px; overflow:hidden; text-align:left; background: #121820;}
#gnb>ul>li:last-child .submenu {min-width: auto;}
#gnb .submenu>ul {padding:10px 0;}
#gnb .submenu>ul>li>a {display:block; padding:8px 18px; color:rgba(255, 255, 255, 0.7); font-size:14px; line-height:1.4em; transition:color var(--transition);}
#gnb .submenu>ul>li>a:hover {color:var(--color-primary); text-decoration:none;}
#gnb .submenu>ul>li.active>a {color:var(--color-primary); font-weight:700;}

.language {position: relative;}
.language span {position: relative; z-index:1;display: flex; align-items: center; gap: 7px; font-weight: 600; color: #fff; padding: 4px 11px; cursor: pointer;}
.language span:before {content: ''; display: block; width: 19px; height: 19px;background: url('/images/common/icon-global.svg') no-repeat center center / contain;}
.language span:after {content: ''; display: block; width: 19px; height:19px; background: url('/images/common/arrow-lanuage.svg') no-repeat center center / contain;}
.language.active span:after {transform: rotate(180deg);}
.language .submenu {display: none; position: absolute; top: 50%; left: 0; right: 0; width: 100%; text-align: center; color: #686868; font-weight: 500; font-size: var(--font-size-14); line-height: 1.7143em;}
.language .submenu ul {padding: 30px 5px 6px; background: #fff; border-radius: 0 0 var(--radius-20) var(--radius-20); }
.language .submenu li:hover {color: var(--primary-color);}
.language .submenu a {display: block; padding: 5px 5px;}

#header.active {background:rgba(27, 36, 48, 0.98); box-shadow:0 4px 20px rgba(0, 0, 0, 0.25);}
#header.active .sitelogo img {filter:none;}
#header.active #gnb>ul>li>a {color:#fff;}
#header.active #gnb>ul>li>a:hover, #header.active #gnb>ul>li.active>a {color:var(--color-primary);  background: rgba(196, 165, 116, 0.08);}
#header.active .language span {color: #fff;}
#header.active .language span:before, #header.active .language span:after {filter:none;}
#header.active .btn-m-menu span {background:#fff;}
#header.active .btn-m-menu span:before, #header.active .btn-m-menu span:after {background:#fff;}

/* for mobile */
.btn-m-menu {display:none; position:relative; width:26px; height:26px;}
.btn-m-menu span {position:absolute; left:0; right:0; top:50%; height:2px; margin-top:-1px; background:#fff;}
.btn-m-menu span:before, .btn-m-menu span:after {content:" "; position:absolute; left:0; right:0; height:2px; background:#fff;}
.btn-m-menu span:before {top:-9px;}
.btn-m-menu span:after {bottom:-9px;}

.mobile-navigation {display:none; position:fixed; top:0; right:0; width:300px; height:100%; overflow:auto; transition:.2s linear; -ms-transform:translateX(100%); transform:translateX(100%); background:#fff; z-index:102;}
.mobile-navigation .sitelogo img {height:34px; width:auto; display:block;}
.mobile-navigation .home {display:flex; align-items:center; height:var(--header-height); padding:0 20px; background:var(--color-bg-dark); color:#fff; font-size:19px; font-weight:700; line-height:1.5em;}
.mobile-navigation .nav-menu>ul {border-top:1px solid #ddd;}
.mobile-navigation .nav-menu>ul>li {border-bottom:1px solid #ddd;}
.mobile-navigation .nav-menu>ul>li>a {position:relative; padding:10px 48px 10px 20px; display:block; color:#242424; font-size:19px; font-weight:700; line-height:1.5em;}
.mobile-navigation .nav-menu>ul>li>a:after {content:""; position:absolute; top:50%; right:20px; transform:translateY(-75%) rotate(45deg); width:11px; height:11px; border-right:2px solid #505050; border-bottom:2px solid #505050;}
.mobile-navigation .nav-menu>ul>li.active>a {color:#fff; background:var(--primary-color);}
.mobile-navigation .nav-menu>ul>li.active>a:after {transform:translateY(-35%) rotate(-135deg); border-color:#fff;}
.mobile-navigation .nav-menu .submenu {display:none; background:#f8f8f8; color:#454545; font-size:16px; font-weight:400; line-height:1.5em;}
.mobile-navigation .nav-menu .submenu ul li {border-top:1px solid #e5e5e5;}
.mobile-navigation .nav-menu .submenu ul li a {display:block; padding:12px 20px;}
.mobile-navigation .nav-menu .submenu ul li a:hover {color:var(--primary-color);}
.mobile-navigation .close {position:absolute; top:0; right:15px; width:26px; height:var(--header-height); text-indent:-9999em; overflow:hidden;}
.mobile-navigation .close:before, .mobile-navigation .close:after {content:" "; position:absolute; top:50%; left:0; width:100%; height:3px; background:#fff; border-radius:3px;}
.mobile-navigation .close:before {transform:rotate(45deg);}
.mobile-navigation .close:after {transform:rotate(-45deg);}
.mobile-overlay {display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:0.6; z-index:101;}

html.menu-opened {overflow:hidden;}
html.menu-opened .mobile-navigation {-ms-transform:translateX(0); transform:translateX(0);}
html.menu-opened .mobile-overlay {display:block;}

/* main */
.page-main {width:100%; overflow:hidden; background:var(--color-bg); color:var(--color-text);}

/* section common */
.section {padding:clamp(60px, calc(100 / var(--inner) * 100vw), 120px) 0;}
.section--soft {background:var(--color-bg-soft);}
.section--bg {background:var(--color-bg);}
.section--white {background:var(--color-white);}
.section--dark {background:var(--color-bg-dark); color:var(--color-white);}

.section__head {margin-bottom:clamp(30px, calc(48 / var(--inner) * 100vw), 48px);}
.section__head--row {display:flex; flex-direction:column;}
.section__head__row {display:flex; align-items:flex-end; justify-content:space-between; gap:24px; flex-wrap:wrap;}
.section__head--row .section__title {margin-bottom:0;}
.section__eyebrow {display:inline-block; margin-bottom:12px; font-size:12px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--color-primary);}
.section--dark .section__eyebrow {color:var(--color-primary);}
.section__title {margin:0 0 16px; font-size:clamp(26px, calc(40 / var(--inner) * 100vw), 42px); font-weight:800; line-height:1.25em; letter-spacing:-0.03em; color:var(--color-text);}
.section--dark .section__title {color:var(--color-white);}
.section__desc {margin:0; max-width:560px; color:var(--color-text-muted); font-size:clamp(15px, calc(17 / var(--inner) * 100vw), 17px); line-height:1.65em;}
.section--dark .section__desc {color:rgba(255, 255, 255, 0.72); max-width:none;}

.link-more {display:inline-flex; align-items:center; gap:6px; font-size:14px; font-weight:700; color:var(--color-primary-dark); letter-spacing:0.02em; transition:color var(--transition), transform var(--transition);}
.link-more:hover {color:var(--color-primary); transform:translateX(4px);}
.section--dark .link-more {color:var(--color-primary);}
.section--dark .link-more:hover {color:var(--color-white);}

/* buttons */
.btn {display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:10px 28px; border:1px solid transparent; border-radius:var(--radius-sm); font-weight:700; font-size:15px; cursor:pointer; transition:background var(--transition), color var(--transition), border-color var(--transition); text-decoration:none;}
.btn--primary {background:var(--color-primary); color:var(--color-bg-dark);}
.btn--primary:hover {background:var(--color-primary-dark); color:var(--color-white);}
.btn--outline-light {background:transparent; color:var(--color-white); border-color:rgba(255, 255, 255, 0.45);}
.btn--outline-light:hover {border-color:var(--color-primary); color:var(--color-primary);}

/* Hero & Main Visual */
.hero, .main-visual {position:relative; width:100%; min-height:calc(100vh - var(--header-height)); overflow:hidden; padding: 0;}
.main-visual .items {position:relative; width:100%; height:100%; margin:0; padding:0;}
.main-visual .item {position:relative; height:calc(100vh - var(--header-height)); display:flex; align-items:center; justify-content:center; overflow:hidden;}
.hero__bg {position:absolute; inset:0; z-index:0;}
.hero__bg img {width:100%; height:100%; object-fit:cover;}
.hero__overlay {position:absolute; inset:0; background:linear-gradient(105deg, rgba(18, 24, 32, 0.88) 0%, rgba(18, 24, 32, 0.55) 48%, rgba(18, 24, 32, 0.28) 100%);}
.hero__content {position:relative; z-index:1; display:flex; flex-direction:column; justify-content: center; align-items:center; text-align:center; height: 100%; padding:48px var(--container-space); margin-top:-40px; color:var(--color-white); max-width:800px; width:100%;}
.hero__eyebrow {display:inline-block; margin-bottom:20px; font-size:13px; font-weight:700; letter-spacing:0.16em; text-transform:uppercase; color:var(--color-primary);}
.hero__title {margin:0 0 24px; font-size:clamp(32px, calc(56 / var(--inner) * 100vw), 64px); font-weight:800; line-height:1.15em; letter-spacing:-0.035em;}
.hero__desc {margin:0 0 36px; font-size:clamp(15px, calc(18 / var(--inner) * 100vw), 19px); line-height:1.75em; color:rgba(255, 255, 255, 0.82); max-width:620px;}
.hero__actions {display:inline-grid; grid-template-columns:1fr 1fr; gap:12px; justify-content:center;}
.hero__actions .btn {width:100%; box-sizing:border-box;}
.hero__title, .hero__desc, .hero__actions, .hero__eyebrow {opacity:0; transform:translateY(20px); transition:opacity 0.7s ease, transform 0.7s ease;}
.hero.is-active .hero__eyebrow, .main-visual .slick-slide.active .hero__eyebrow {opacity:1; transform:none; transition-delay:0.1s;}
.hero.is-active .hero__title, .main-visual .slick-slide.active .hero__title {opacity:1; transform:none; transition-delay:0.22s;}
.hero.is-active .hero__desc, .main-visual .slick-slide.active .hero__desc {opacity:1; transform:none; transition-delay:0.34s;}
.hero.is-active .hero__actions, .main-visual .slick-slide.active .hero__actions {opacity:1; transform:none; transition-delay:0.46s;}

/* Main Visual Controller */
.main-visual .visual-func {position:absolute; bottom:84px; left:50%; transform:translateX(-50%); z-index:5; display:inline-flex; align-items:center; gap:14px; padding:8px 18px; background:rgba(18, 24, 32, 0.65); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border-radius:30px; border:1px solid rgba(255, 255, 255, 0.16); box-shadow:0 10px 30px rgba(0, 0, 0, 0.35);}
.main-visual .visual-func .slide-btn {width:24px; height:24px; background:transparent no-repeat center center; border:0; cursor:pointer; opacity:0.85; transition:opacity var(--transition), transform var(--transition); padding:0;}
.main-visual .visual-func .slide-btn:hover {opacity:1; transform:scale(1.1);}
.main-visual .visual-func .slide-prev {background-image:url(/images/main/mv-prev.svg); background-size:8px 10px;}
.main-visual .visual-func .slide-next {background-image:url(/images/main/mv-next.svg); background-size:8px 10px;}
.main-visual .visual-func .slide-stop {background-image:url(/images/main/mv-stop.svg); background-size:10px 10px;}
.main-visual .visual-func .slide-play {background-image:url(/images/main/mv-play.svg); background-size:10px 10px;}
.main-visual .pagination ul {display:flex; align-items:center; gap:8px; margin:0; padding:0; list-style:none;}
.main-visual .pagination li {display:inline-block; margin:0; padding:0;}
.main-visual .pagination li button {width:8px; height:8px; padding:0; border-radius:50%; border:0; background:rgba(255, 255, 255, 0.45); font-size:0; color:transparent; cursor:pointer; transition:all var(--transition);}
.main-visual .pagination li.slick-active button {width:24px; border-radius:4px; background:var(--color-primary);}
.main-visual .scroll {display:none;}

/* Business cards */
.biz-grid {display:grid; grid-template-columns:repeat(3, 1fr); gap:0; margin-top:-56px; position:relative; z-index:2;}
.biz-card {padding:clamp(24px, calc(36 / var(--inner) * 100vw), 36px) clamp(20px, calc(32 / var(--inner) * 100vw), 32px); background:var(--color-bg-dark); color:var(--color-white); border-right:1px solid rgba(255, 255, 255, 0.08); transition:background var(--transition); text-decoration:none;}
.biz-card:last-child {border-right:0;}
.biz-card:hover {background:var(--color-bg-darker);}
.biz-card__num {display:block; margin-bottom:16px; font-size:13px; font-weight:700; letter-spacing:0.12em; color:var(--color-primary);}
.biz-card__title {margin:0 0 12px; font-size:clamp(18px, calc(22 / var(--inner) * 100vw), 22px); font-weight:800; line-height:1.3em;}
.biz-card__desc {margin:0 0 20px; font-size:14px; line-height:1.7em; color:rgba(255, 255, 255, 0.68);}
.biz-card__more {font-size:13px; font-weight:700; color:var(--color-primary); letter-spacing:0.06em; transition:color var(--transition);}
a.biz-card__more:hover {color:var(--color-white);}
.biz-card__label {display:block; margin-top:4px; padding-top:16px; border-top:1px solid rgba(255, 255, 255, 0.1); font-size:11px; font-weight:600; letter-spacing:0.14em; color:rgba(255, 255, 255, 0.32);}

/* Spotlight */
.spotlight {display:grid; grid-template-columns:1.1fr 1fr; gap:clamp(30px, calc(56 / var(--inner) * 100vw), 56px); align-items:center;}
.spotlight__visual {align-self:center; overflow:hidden; border-radius:var(--radius-lg); box-shadow:var(--shadow-md);}
.spotlight__body {align-self:center;}
.spotlight__visual img {width:100%; aspect-ratio:4 / 3; object-fit:cover;}
.spotlight__keys {display:flex; flex-direction:column; gap:20px; margin:40px 0 0;}
.spotlight__cta {margin:40px 0 0;}
.spotlight__key {display:flex; gap:16px; align-items:flex-start; padding-bottom:20px; border-bottom:1px solid var(--color-border);}
.spotlight__key:last-child {border-bottom:0; padding-bottom:0;}
.spotlight__key strong {flex-shrink:0; width:72px; font-size:14px; font-weight:800; color:var(--color-primary-dark);}
.spotlight__key span {font-size:15px; color:var(--color-text-muted); line-height:1.65em;}

/* Features row */
.feature-row {display:grid; grid-template-columns:repeat(4, 1fr); gap:clamp(16px, calc(24 / var(--inner) * 100vw), 24px);}
.feature-item {text-align:left;}
.feature-item__icon {display:flex; align-items:center; justify-content:center; width:52px; height:52px; margin-bottom:18px; border:1px solid rgba(196, 165, 116, 0.4); border-radius:var(--radius-sm); color:var(--color-primary);}
.feature-item__icon svg {width:26px; height:26px;}
.feature-item__title {margin:0 0 8px; font-size:17px; font-weight:800; line-height:1.3em;}
.feature-item__desc {margin:0; font-size:14px; line-height:1.65em; color:rgba(255, 255, 255, 0.65);}

/* Product grid */
.product-grid {display:grid; grid-template-columns:repeat(4, 1fr); gap:clamp(16px, calc(20 / var(--inner) * 100vw), 20px);}
.product-card {display:flex; flex-direction:column; background:var(--color-white); border:1px solid var(--color-border); border-radius:var(--radius-md); overflow:hidden; transition:border-color var(--transition), transform var(--transition), box-shadow var(--transition); text-decoration:none;}
.product-card:hover {border-color:var(--color-primary); transform:translateY(-4px); box-shadow:var(--shadow-sm);}
.product-card__thumb {aspect-ratio:4 / 3; overflow:hidden; background:var(--color-bg-soft);}
.product-card__thumb img {width:100%; height:100%; object-fit:cover; transition:transform 0.45s ease;}
.product-card:hover .product-card__thumb img {transform:scale(1.04);}
.product-card__body {padding:24px; flex:1;}
.product-card__num {display:block; margin-bottom:8px; font-size:12px; font-weight:800; letter-spacing:0.1em; color:var(--color-primary);}
.product-card__title {margin:0 0 10px; font-size:18px; font-weight:800; line-height:1.3em; color:var(--color-text);}
.product-card__desc {margin:0; font-size:14px; color:var(--color-text-muted); line-height:1.65em;}

/* Gallery feature */
.gallery-feature {position:relative; overflow:hidden; border-radius:var(--radius-lg); background:var(--color-bg-dark);}
.gallery-feature__slide {display:none; position:relative; aspect-ratio:1320/480;}
.gallery-feature__slide.is-active {display:block;}
.gallery-feature__slide img {width:100%; height: 100%; object-fit:cover;}
.gallery-feature__caption {position:absolute; left:0; right:0; bottom:0; padding:40px 48px; background:linear-gradient(transparent, rgba(18, 24, 32, 0.9)); color:var(--color-white);}
.gallery-feature__cat {display:block; margin-bottom:8px; font-size:12px; font-weight:700; letter-spacing:0.1em; color:var(--color-primary); text-transform:uppercase;}
.gallery-feature__title {margin:0 0 8px; font-size:clamp(20px, calc(28 / var(--inner) * 100vw), 30px); font-weight:800; line-height:1.3em;}
.gallery-feature__tags {margin:0; font-size:14px; color:rgba(255, 255, 255, 0.75);}
.gallery-feature__nav {position:absolute; right:32px; bottom:40px; z-index:2; display:flex; gap:8px;}
.gallery-feature__btn {width:44px; height:44px; display:flex; align-items:center; justify-content:center; background:rgba(255, 255, 255, 0.12); border:1px solid rgba(255, 255, 255, 0.35); border-radius:var(--radius-sm); color:var(--color-white); cursor:pointer; font-size:18px; transition:background var(--transition), border-color var(--transition);}
.gallery-feature__btn:hover {background:var(--color-primary); border-color:var(--color-primary); color:var(--color-bg-dark);}
.gallery-feature__btn svg {width:20px; height:20px;}

/* Performance list */
.perf-list {display:flex; flex-direction:column; border-top:1px solid var(--color-border);}
.perf-item {display:grid; grid-template-columns:auto 1fr auto; gap:20px 24px; align-items:center; padding:20px 12px; border-bottom:1px solid var(--color-border); transition:background var(--transition); text-decoration:none;}
.perf-item:hover {background:var(--color-bg-soft);}
.perf-item__thumb {flex-shrink:0; width:72px; aspect-ratio:1; border-radius:8px; overflow:hidden; background:var(--color-bg-soft);}
.perf-item__thumb img {width:100%; height:100%; object-fit:cover;}
.perf-item__body {min-width:0;}
.perf-item__title {margin:0 0 4px; font-size:17px; font-weight:700; line-height:1.4em; color:var(--color-text);}
.perf-item__meta {margin:0; font-size:14px; color:var(--color-text-muted);}
.perf-item__date {font-size:14px; font-weight:800; color:var(--color-primary-dark); font-variant-numeric:tabular-nums;}
.perf-item__more {flex-shrink:0; display:inline-flex; align-items:center; gap:4px; padding:8px 14px; border:1px solid var(--color-border); border-radius:var(--radius-sm); background:var(--color-white); font-size:13px; font-weight:600; color:var(--color-text-muted); white-space:nowrap; transition:border-color var(--transition), color var(--transition), background var(--transition);}
.perf-item:hover .perf-item__more {border-color:var(--color-primary); color:var(--color-primary-dark); background:#fff;}
.perf-item__more .perf-item__arrow {font-size:12px; color:inherit;}

/* CTA Inquiry band */
.cta-band {position:relative; padding:clamp(56px, calc(80 / var(--inner) * 100vw), 88px) 0; color:var(--color-white); overflow:hidden;}
.cta-band__bg {position:absolute; inset:0; z-index:0;}
.cta-band__bg img {width:100%; height:100%; object-fit:cover;}
.cta-band__overlay {position:absolute; inset:0; background:linear-gradient(105deg, rgba(18, 24, 32, 0.92) 0%, rgba(18, 24, 32, 0.78) 52%, rgba(18, 24, 32, 0.62) 100%);}
.cta-band__inner {position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:32px; flex-wrap:wrap;}
.cta-band__title {margin:0 0 10px; font-size:clamp(22px, calc(32 / var(--inner) * 100vw), 34px); font-weight:800; letter-spacing:-0.02em; line-height:1.4em;}
.cta-band__desc {margin:0; font-size:16px; line-height:1.6em; color:rgba(255, 255, 255, 0.7);}
.cta-band__actions {display:flex; align-items:stretch; flex-wrap:nowrap; gap:12px;}
.cta-band__actions .btn {flex:1 1 0; min-width:148px; padding-left:20px; padding-right:20px; white-space:nowrap;}

/* sub */
.sub-visual {position:relative; min-height:clamp(260px, calc(340 / var(--inner) * 100vw), 340px); display:flex; align-items:flex-end; overflow:hidden; color:var(--color-white);}
.sub-visual .bg {position:absolute; inset:0; background-repeat:no-repeat; background-position:center center; background-size:cover;}
.sub-visual .bg:after {content:""; position:absolute; inset:0; background:linear-gradient(105deg, rgba(18, 24, 32, 0.92) 0%, rgba(18, 24, 32, 0.72) 55%, rgba(18, 24, 32, 0.45) 100%);}
.sub-visual .bg1 {background-image:url("/images/sub/about-site.jpg");}
.sub-visual .bg2 {background-image:url("/images/sub/about-visual-1.jpg");}
.sub-visual .bg3 {background-image:url("/images/sub/gallery-exterior.jpg");}
.sub-visual .bg4 {background-image:url("/images/sub/community-hero.jpg");}
.sub-visual .bg5 {background-image:url("/images/sub/inquiry-hero.jpg");}
.sub-visual .inner {position:relative; z-index:1; width:100%; padding-top:40px; padding-bottom:clamp(36px, calc(48 / var(--inner) * 100vw), 48px);}
.sub-visual .contain {text-align:left;}
.sub-visual .breadcrumb {margin:0 0 14px; font-size:13px; color:rgba(255, 255, 255, 0.55);}
.sub-visual .breadcrumb a {color:inherit; text-decoration:none; transition:color var(--transition);}
.sub-visual .breadcrumb a:hover {color:var(--color-primary);}
.sub-visual h2 {margin:0 0 12px; font-size:clamp(30px, 4vw, 42px); font-weight:800; letter-spacing:-0.03em; color:#fff; line-height:1.25em;}
.sub-visual .sub-desc {margin:0; max-width:580px; font-size:15px; color:rgba(255, 255, 255, 0.75); line-height:1.65em;}
.sv-txt {display: none;}
.sv-txt.active {display: block;}

.lnb-wrap {position:sticky; top:var(--header-height); z-index:90; background:var(--color-bg-dark); border-bottom:1px solid rgba(196, 165, 116, 0.2); border-top:0;}
.lnb {margin:0 auto; max-width:1380px; padding:0 var(--container-space);}
.lnb ul {display:flex; gap:0; width: max-content;}
.lnb ul li {flex:1 1 auto; width: auto; border:0 !important;}
.lnb ul li a {display:flex; align-items:center; justify-content:center; height:54px; padding:0 24px; font-size:15px; font-weight:700; color:rgba(255, 255, 255, 0.55); border-bottom:3px solid transparent; text-decoration:none; letter-spacing:-.02em; transition:color var(--transition), border-color var(--transition);}
.lnb ul li a:hover {color:#fff;}
.lnb ul li.active {background:transparent; border:0;}
.lnb ul li.active a {color:var(--color-primary); border-bottom-color:var(--color-primary);}

.sub-title {display:none;}

#contArea {max-width:1380px; padding-left:var(--container-space); padding-right:var(--container-space); padding-top:var(--space-100); margin:0 auto;}
#contArea.wide {max-width:100%; padding:0; margin:0;}
#contArea.wide .real-cont {padding-bottom:0;}
#container.bg-warm,
#container:has(#contArea.bg-warm) {background:var(--color-bg);}

.real-cont {padding-bottom:clamp(40px, calc( 120 / var(--inner) * 100vw ), 120px);}
.icon img {vertical-align: middle; margin-top: -.02em;}
.txt-center {text-align: center;}

.desc p:not(:last-child) {margin-bottom: 1.88em;}
.pb100-40 {padding-bottom: clamp(40px, calc( 100 / var(--inner) * 100vw ), 100px);}
.pt100-40 {padding-top: clamp(40px, calc( 100 / var(--inner) * 100vw ), 100px);}
.border-box {position: relative;}
.border-box:before {position: absolute; content: ''; top: 0; right: 0; bottom: 0; left: 0; border: 1px solid #ddd;}

.flex-wrap {display: flex;}
.flex-center {display: flex; justify-content: center;}
.flex-between {display: flex; justify-content: space-between;}
.flex-mid {display: flex; align-items: center;}
.flex-bottom {display: flex; align-items: flex-end;}
.flex-column {display: flex; flex-direction: column;}
.flex1 {flex: 1;}

.fw400 {font-weight: 400;}
.fw500 {font-weight: 500;}
.fw600 {font-weight: 600;}
.fw700 {font-weight: 700;}

.primary-color {color: var(--primary-color);}
.secondary-color {color: var(--secondary-color);}
.dark-color {color: var(--dark-color);}
.white-color {color: #fff;}

/* footer */
.footer {padding:48px 0 32px; background:var(--color-bg-dark); color:rgba(255, 255, 255, 0.65); font-size:14px;}
.footer__top {display:grid; grid-template-columns:1.2fr 1fr; gap:48px; padding-bottom:32px; border-bottom:1px solid rgba(255, 255, 255, 0.1);}
.footer__brand {display:inline-block; margin-bottom:16px; line-height:0;}
.footer__brand img {height:clamp(32px, calc(36 / var(--inner) * 100vw), 36px); width:auto; display:block; object-fit:contain;}
.footer__info {display:flex; flex-direction:column;}
.footer__info p {margin:0 0 6px; line-height:1.7em; color:inherit;}
.footer__info p span {display:inline-block;}
.footer__info p span + span:before {content:"|"; display:inline-block; margin:0 8px; opacity:0.35;}
.footer__aside {display:flex; flex-direction:column; justify-content:space-between; align-items:flex-end; gap:24px; justify-self:end; width:100%; min-height:100%;}
.footer__links {display:flex; flex-wrap:wrap; gap:16px; justify-content:flex-end;}
.footer__links a {color:inherit; font-size:14px; font-weight:500; transition:color var(--transition);}
.footer__links a:hover {color:var(--color-primary);}
.footer__sns {display:flex; justify-content:flex-end; align-items:center; gap:10px; margin-top:0;}
.footer__sns-btn {display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; border:0; border-radius:50%; color:#fff; font-size:15px; font-weight:800; transition:transform var(--transition), filter var(--transition);}
.footer__sns-btn:hover {transform:translateY(-2px); filter:brightness(1.08);}
.footer__sns-btn svg {width:18px; height:18px;}
.footer__sns-btn--kakao {background:#fee500; color:#3c1e1e;}
.footer__sns-btn--instagram {background:radial-gradient(circle at 30% 110%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%); color:#fff;}
.footer__sns-btn--blog {background:#03c75a; color:#fff;}
.footer__bottom {display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; padding-top:24px; font-size:13px; color:rgba(255, 255, 255, 0.4);}
.footer__bottom .copyright {margin:0; font-size:inherit; color:inherit; line-height:1.6em;}
.footer__bottom .design-credit {color:inherit; font-size:inherit; text-decoration:none;}
.footer__bottom .design-credit:hover {text-decoration:underline; color:var(--color-primary);}
.footer__policy {color:inherit; font-size:inherit;}
.footer__policy:hover {color:var(--color-primary);}

.scroll-top {display:flex; justify-content:center; align-items:center; z-index:80; position:fixed; bottom:var(--container-space); right:var(--container-space); width:70px; height:70px; border-radius: 100%; border: 1px solid #ddd; background-color:#23282c; color:#fff; font-size:14px; font-weight: 500; line-height:1em; text-align:center;}
.scroll-top span:before {display:block; content:""; margin:0 auto 10px; width:0; height:0; border-left:8px solid transparent; border-right:8px solid transparent; border-bottom:7px solid #fff;}