:root{
/* Figma Design Color Variables */
--wht: #FFFFFF;
--text: #2A2A2A;
--text_light: #484848;
--point: #51331C;

/* Color Tokens */
--color-primary: var(--point);
--color-secondary: var(--text);
--color-text: var(--text);
--color-subtext: var(--text_light);
--color-bg-light: #F7F4EF;
--mn-sec-padding: 100px;
--sub-sec-padding: 120px;
--fz-10: min(2.1vw, 10px); --fz-11: min(2.4vw, 11px); --fz-12: min(2.7vw, 12px); --fz-13: min(2.9vw, 13px); --fz-14: min(3.2vw, 14px); --fz-15: min(3.5vw, 15px); --fz-16: min(3.7vw, 16px); --fz-17: min(4.0vw, 17px); --fz-18: min(4.3vw, 18px); --fz-19: min(4.5vw, 19px); --fz-20: min(4.8vw, 20px); --fz-21: min(5.1vw, 21px); --fz-22: min(5.3vw, 22px); --fz-23: min(5.6vw, 23px); --fz-24: min(5.9vw, 24px); --fz-25: min(6.1vw, 25px); --fz-26: min(6.4vw, 26px); --fz-27: min(6.7vw, 27px); --fz-28: min(6.9vw, 28px); --fz-29: min(7.2vw, 29px); --fz-30: min(7.5vw, 30px); --fz-31: min(7.7vw, 31px); --fz-32: min(8.0vw, 32px); --fz-33: min(8.3vw, 33px); --fz-34: min(8.5vw, 34px); --fz-35: min(8.8vw, 35px); --fz-36: min(9.1vw, 36px); --fz-37: min(9.3vw, 37px); --fz-38: min(9.6vw, 38px); --fz-39: min(9.9vw, 39px); --fz-40: min(10.1vw, 40px); --fz-41: min(10.4vw, 41px); --fz-42: min(10.7vw, 42px); --fz-43: min(10.9vw, 43px); --fz-44: min(11.2vw, 44px); --fz-45: min(11.5vw, 45px); --fz-46: min(11.7vw, 46px); --fz-47: min(12.0vw, 47px); --fz-48: min(12.3vw, 48px); --fz-49: min(12.5vw, 49px); --fz-50: min(12.8vw, 50px);
--h1-fz: 36px;
--h2-fz: 28px;
--h3-fz: 24px;
--h4-fz: 20px;
--h5-fz: 18px;
--tit-desc-fz: 18px;
--detail-fz: 18px;
--ff-pretendard: 'Pretendard Variable', sans-serif;
--ff-body: var(--ff-pretendard);
--ff-cormorant: 'Cormorant', serif;
--ff-notoserif: 'Noto Serif KR', serif;
--ff-pinyon: 'Pinyon Script', cursive;
}

h1{font-size: var(--fz-36);}
h2{font-size: var(--fz-28);}
h3{font-size: var(--fz-24);}
h4{font-size: var(--fz-20);}
h5{font-size: var(--fz-18);}

*, a, p {word-break: keep-all; overflow-wrap: break-word;}

*{-webkit-tap-highlight-color: transparent;}
::selection{background-color: rgba(0, 178, 220, 0.2); background-color: color-mix(in srgb, var(--color-primary) 20%, transparent);}
::-webkit-scrollbar{width: 14px; height: 14px;}
::-webkit-scrollbar-track, ::-webkit-scrollbar-track-piece{background: transparent !important;}
::-webkit-scrollbar-thumb{border: 4px solid transparent; border-radius: 10px; background-clip: padding-box; background-color: #999999;}
::-webkit-scrollbar-thumb:hover{background-clip: padding-box; background-color: #777777;}
::-webkit-scrollbar-corner{background: transparent !important;}

body, button, input, select, textarea, a{color: var(--color-text); font-family: var(--ff-body);}
html, body{
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
html.no-scroll, body.no-scroll{overflow: hidden !important; height: 100% !important;}

body {background-color: #FFFDF9;}
body img{width: 100%; height: auto; display: block;}

.mo{display: none !important;}
.mo-ib{display: none !important;}
.mo-if{display: none !important;}
.mo-f{display: none !important;}
.mo-g{display: none !important;}

/* ========== Header ========== */
.header-container{position: fixed; top: 0; left: 0; width: 100%; z-index: 999; transition: transform 0.35s cubic-bezier(0.33, 1, 0.68, 1);}
.header-container.is-hide{transform: translateY(-100%);}
.header-container .hd-cont{display: flex; align-items: center; justify-content: space-between; height: 90px; padding: 0 clamp(20px, 3.5vw, 80px); background: transparent; position: relative; z-index: 2; border-bottom: 1px solid rgba(255, 255, 255, 0.2); transition: background 0.3s, border-color 0.3s, backdrop-filter 0.3s, -webkit-backdrop-filter 0.3s;}
.header-container .logo-area{flex-shrink: 0; transition: opacity 0.3s, visibility 0.3s; z-index: 10;}
.header-container .logo-area a{display: block;}
.header-container .logo-area img{height: 54px; width: auto; transition: filter 0.3s; filter: brightness(0) invert(1);}
.header-container .navigation{position: absolute; left: 50%; top: 0; transform: translateX(-50%); z-index: 3;}
.header-container .menu-list{display: flex; list-style: none; margin: 0; padding: 0; gap: 0;}
.header-container .menu-item{display: flex; flex-direction: column; width: 186px; transition: background 0.3s;}
.header-container .menu-link{display: flex; align-items: center; justify-content: center; height: 90px; padding: 0 10px; font-family: var(--ff-notoserif); font-size: 18px; font-weight: 400; color: #fff; cursor: pointer; transition: color 0.2s; white-space: nowrap; word-break: keep-all; width: 100%; box-sizing: border-box; text-align: center; flex-shrink: 0;}
.header-container .menu-item:first-child .menu-link{font-family: var(--ff-cormorant); font-size: 22px; font-weight: 500;}
.header-container .sub-menu{display: flex; flex-direction: column; gap: 27px; padding: 0; width: 100%; height: 0; overflow: hidden; box-sizing: border-box; text-align: center; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 0.15s ease-in-out, visibility 0.15s ease-in-out, height 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94), padding 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94);}
.header-container .sub-menu a{display: inline-block; font-family: var(--ff-notoserif); font-size: 16px; font-weight: 400; color: #fff; line-height: normal; text-decoration: none; transition: all 0.2s; word-break: keep-all; text-align: center;}
.header-container .sub-menu a:hover{text-decoration: underline; text-underline-offset: 4px;}
.header-container .hd-btn-wrap{flex-shrink: 0; position: relative; z-index: 10; display: flex; align-items: center; gap: 20px; transition: opacity 0.3s, visibility 0.3s;}
.header-container .signature-switcher{position: relative;}
.header-container .signature-btn{width: 200px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 22px; height: 42px; background: transparent; border: 1px solid #fff; border-radius: 99px; color: #fff; font-family: var(--ff-cormorant); font-size: 18px; font-weight: 500; line-height: 26px; cursor: pointer; transition: all 0.3s ease; box-sizing: border-box; white-space: nowrap;}
.header-container .signature-btn .full-txt{display: inline;}
.header-container .signature-btn .short-txt{display: none;}
.header-container .signature-btn .arrow{display: inline-block; width: 6px; height: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); transition: transform 0.3s ease; flex-shrink: 0; margin-top: -3px;}
.header-container .signature-btn.open .arrow{transform: rotate(-135deg); margin-top: 3px;}
.header-container .signature-dropdown{position: absolute; top: calc(100% + 7px); right: 0; width: 199px; z-index: 50;}
.header-container .signature-dropdown ul{list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 7px;}
.header-container .signature-dropdown li a{display: flex; align-items: center; justify-content: space-between; height: 42px; padding: 8px 22px; background: rgba(255, 255, 255, 0.2); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border: 1px solid #fff; border-radius: 99px; color: #fff; text-decoration: none; font-family: var(--ff-notoserif); font-size: 15px; box-sizing: border-box; transition: background 0.2s, transform 0.2s; white-space: nowrap;}
.header-container .signature-dropdown li a span.full-txt{font-family: var(--ff-cormorant); font-size: 18px; font-weight: 400; margin-right: 3px;}
.header-container .signature-dropdown li a .arrow-right{font-size: 13px; margin-left: auto; transition: transform 0.2s;}
.header-container .signature-dropdown li a:hover{background: rgba(255, 255, 255, 0.35); transform: translateY(-1px);}
.header-container .signature-dropdown li a:hover .arrow-right{transform: translateX(3px);}
.header-container .lang-switcher{position: relative;}
.header-container .lang-curr-btn{display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 22px; width: 90px; height: 42px; background: transparent; border: 1px solid #fff; border-radius: 99px; color: #fff; font-family: var(--ff-cormorant); font-size: 18px; font-weight: 500; line-height: 26px; cursor: pointer; transition: all 0.3s ease; box-sizing: border-box;}
.header-container .lang-curr-btn .arrow{display: inline-block; width: 6px; height: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); transition: transform 0.3s ease; flex-shrink: 0; margin-top: -3px;}
.header-container .lang-curr-btn.open .arrow{transform: rotate(-135deg); margin-top: 3px;}
.header-container .lang-dropdown{position: absolute; top: calc(100% + 7px); right: 0; width: 90px; z-index: 50;}
.header-container .lang-dropdown ul{list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 7px;}
.header-container .lang-dropdown li a.lang-item{display: flex; align-items: center; justify-content: center; height: 42px; padding: 8px 22px; background: rgba(255, 255, 255, 0.2); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border: 1px solid #fff; border-radius: 99px; color: #fff; font-family: var(--ff-cormorant); font-size: 18px; text-decoration: none; box-sizing: border-box; transition: background 0.2s, transform 0.2s;}
.header-container .lang-dropdown li a.lang-item:hover{background: rgba(255, 255, 255, 0.35); transform: translateY(-1px);}
.header-container .hamburger-button{display: none;}
#side_menu{display: none;}
.header-container.is-open .hd-cont{background: #51331c; border-bottom: 1px solid rgba(255, 255, 255, 0.2);}
.header-container.is-open .menu-link{color: #fff;}
.header-container.is-open .gnb-bg{position: absolute; top: 90px; left: 0; width: 100%; height: 250px; background: #51331c; z-index: 1; border-top: 1px solid rgba(255, 255, 255, 0.1); pointer-events: none; transition: height 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94);}
.header-container.is-open .sub-menu{height: 250px; padding: 50px 0px; opacity: 1; visibility: visible; pointer-events: auto;}
.header-container.scrolled:not(.is-open) .hd-cont{background: rgba(255, 255, 255, 0.38); backdrop-filter: blur(15px); -webkit-backdrop-filter: blur(15px); border-bottom: 1px solid rgba(0, 0, 0, 0.08); box-shadow: 0 4px 15px rgba(0,0,0,0.05);}
.header-container.scrolled:not(.is-open) .menu-link{color: var(--color-text);}
.header-container.scrolled:not(.is-open) .logo-area img{filter: brightness(0) saturate(100%) invert(18%) sepia(50%) saturate(596%) hue-rotate(344deg) brightness(96%) contrast(91%);}
.header-container.scrolled:not(.is-open) .signature-btn{border-color: var(--color-text); color: var(--color-text);}
.header-container.scrolled:not(.is-open) .signature-dropdown li a{background: rgba(255, 255, 255, 0.9); border-color: var(--color-text); color: var(--color-text);}
.header-container.scrolled:not(.is-open) .lang-curr-btn{border-color: var(--color-text); color: var(--color-text);}
.header-container.scrolled:not(.is-open) .lang-dropdown li a.lang-item{background: rgba(255, 255, 255, 0.9); border-color: var(--color-text); color: var(--color-text);}
.header-container.scrolled.on-dark:not(.is-open) .hd-cont{background: transparent; /* backdrop-filter: none; -webkit-backdrop-filter: none; */ box-shadow: none; border-bottom: 1px solid rgba(255, 255, 255, 0.2);}
.header-container.scrolled.on-dark:not(.is-open) .menu-link{color: #fff;}
.header-container.scrolled.on-dark:not(.is-open) .logo-area img{filter: brightness(0) invert(1);}
.header-container.scrolled.on-dark:not(.is-open) .signature-btn{border-color: #fff; color: #fff;}
.header-container.scrolled.on-dark:not(.is-open) .signature-dropdown li a{background: rgba(255, 255, 255, 0.2); border-color: #fff; color: #fff;}
.header-container.scrolled.on-dark:not(.is-open) .lang-curr-btn{border-color: #fff; color: #fff;}
.header-container.scrolled.on-dark:not(.is-open) .lang-dropdown li a.lang-item{background: rgba(255, 255, 255, 0.2); border-color: #fff; color: #fff;}
.header-container.scrolled.on-dark .hamburger-button .bar{background-color: #fff;}

@media(max-width: 1780px){
.header-container .hd-cont{padding: 0 clamp(20px, 3vw, 50px);}
.header-container .menu-item{width: 150px;}
.header-container .menu-link{font-size: 17px;}
.header-container .menu-item:first-child .menu-link{font-size: 21px;}
.header-container .sub-menu a{font-size: 15px;}
.header-container .hd-btn-wrap{gap: 14px;}
.header-container .signature-btn{padding: 8px 18px; font-size: 17px;}
.header-container .signature-dropdown{width: 185px;}
.header-container .lang-curr-btn{width: 80px; font-size: 17px;}
.header-container .lang-dropdown{width: 80px;}
}

@media(max-width: 1500px){
.header-container .hd-cont{padding: 0 clamp(20px, 2.5vw, 35px);}
.header-container .menu-item{width: 130px;}
.header-container .menu-link{font-size: 16.5px;}
.header-container .menu-item:first-child .menu-link{font-size: 19px;}
.header-container .sub-menu a{font-size: 14.5px;}
.header-container .hd-btn-wrap{gap: 10px;}
.header-container .signature-btn .full-txt{display: none;}
.header-container .signature-btn .short-txt{display: inline;}
.header-container .signature-btn{padding: 8px 16px; font-size: 16px; height: 40px; width: 150px;}
.header-container .signature-dropdown{width: 100%; min-width: 100%; right: 0; left: 0;}
.header-container .signature-dropdown .full-txt{display: none;}
.header-container .signature-dropdown li a{height: 40px; padding: 8px 12px; font-size: 13.5px;}
.header-container .signature-dropdown li a .arrow-right{font-size: 12px;}
.header-container .lang-curr-btn{width: 75px; padding: 8px 14px; font-size: 16px; height: 40px;}
.header-container .lang-dropdown{width: 100%; min-width: 100%; right: 0; left: 0;}
.header-container .lang-dropdown li a.lang-item{height: 40px; padding: 8px 14px; font-size: 15px;}
}

@media(max-width: 1200px){
.header-container .hd-cont{padding: 0 15px;}
.header-container .navigation{left: calc(50% - 30px);}
.header-container .menu-item{width: 120px;}
.header-container .menu-link{font-size: 15.5px;}
.header-container .menu-item:first-child .menu-link{font-size: 17.5px;}
.header-container .sub-menu{gap: 20px;}
.header-container .sub-menu a{font-size: 14px; white-space: nowrap;}
.header-container .logo-area img{height: 44px;}
.header-container .hd-btn-wrap{gap: 6px;}
.header-container .signature-btn{padding: 6px 10px; font-size: 14.5px; height: 36px;}
.header-container .signature-dropdown li a{height: 36px; padding: 6px 10px; font-size: 12.5px;}
.header-container .lang-curr-btn{width: 60px; padding: 6px 6px; font-size: 14.5px; height: 36px;}
.header-container .lang-dropdown li a.lang-item{height: 36px; padding: 6px 6px; font-size: 14px;}
}

footer{background: #302218; color: #fff; text-align: center; padding: 80px 20px; display: flex; flex-direction: column; align-items: center; gap: 34px; position: relative; box-sizing: border-box;}
footer .ft-logo img{height: 80px; width: auto; filter: brightness(0) invert(1); display: block;}
footer .ft-link-wrap{display: flex; justify-content: center; align-items: center; gap: 25px;}
footer .ft-link-wrap a{color: #fff; font-size: 17px; font-weight: 500; text-decoration: none; transition: opacity 0.2s;}
footer .ft-link-wrap a:hover{opacity: 0.8;}
footer .ft-info-wrap{display: flex; flex-direction: column; align-items: center; gap: 13px; max-width: 1006px; width: 100%; margin: 0 auto;}
footer .ft-info{color: rgba(255, 255, 255, 0.8); font-size: 16px; font-weight: 400; line-height: 1.6; margin: 0;}
footer .ft-info .bar{margin: 0 10px; opacity: 0.6;}
footer .ft-copy{color: rgba(255, 255, 255, 0.8); font-size: 16px; font-weight: 400; line-height: 1.6; margin: 0;}
footer .ft-copy a{color: inherit; text-decoration: none;}
footer .ft-copy a:hover{text-decoration: underline;}

/* ========== Floating Quick Menu ========== */
.btm-fix-area{position: fixed; right: clamp(20px, 2.5vw, 40px); bottom: clamp(20px, 2.5vw, 40px); z-index: 999; pointer-events: none;}
.floating-container{display: flex; flex-direction: column; align-items: center; gap: 15px; pointer-events: auto;}

/* 1. 기본형 원형 트리거 (76px x 76px, #51331c, 40px 로고) */
.floating-trigger{cursor: pointer; display: block; transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.25s ease;}
.floating-trigger:hover{transform: translateY(-2px);}
.floating-trigger:active{transform: scale(0.92); transition-duration: 0.1s;}
.floating-container .trigger-circle{width: 76px; height: 76px; background: #51331c; border-radius: 999px; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.18); box-sizing: border-box; transition: box-shadow 0.35s ease, background-color 0.3s ease;}
.floating-trigger:hover .trigger-circle{box-shadow: 0 8px 25px rgba(81, 51, 28, 0.35);}
.floating-container .trigger-circle .quick-logo{width: 40px; height: auto; display: block; filter: brightness(0) invert(1); transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);}

/* 2. 펼침 상태 패널 (76px 너비, #fffcf8, 둥근 캡슐 스프링 모션) */
.floating-panel{display: none; flex-direction: column; align-items: center; width: 76px; background: #fffcf8; border-radius: 999px; box-shadow: 0 10px 35px rgba(0, 0, 0, 0.15); border: 1px solid rgba(81, 51, 28, 0.1); padding: 20px 0; box-sizing: border-box; transform-origin: bottom center; transform: scale(0.92) translateY(15px); opacity: 0; transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.25s ease; overflow: hidden;}
.floating-container.active .floating-panel{display: flex; transform: scale(1) translateY(0); opacity: 1;}
.floating-container.active .floating-trigger{display: none;}

.floating-panel .quick-group{display: flex; flex-direction: column; width: 100%;}
.floating-panel .quick-item{display: flex; align-items: center; justify-content: center; width: 100%; height: 76px; border-bottom: 1px solid #eee; text-decoration: none; transition: background 0.2s; box-sizing: border-box;}
.floating-panel .quick-item:hover{background: rgba(81, 51, 28, 0.06);}
.floating-panel .quick-item img{width: auto; height: 30px; max-width: 32px; object-fit: contain; display: block; transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);}
.floating-panel .quick-item:hover img{transform: scale(1.15);}
.floating-panel .quick-item:active img{transform: scale(0.95);}

.floating-panel .quick-close-btn{display: flex; align-items: center; justify-content: center; width: 100%; height: 76px; background: none; border: none; padding: 0; cursor: pointer; transition: background 0.2s; box-sizing: border-box;}
.floating-panel .quick-close-btn:hover{background: rgba(81, 51, 28, 0.06);}
.floating-panel .quick-close-btn img{width: 24px; height: 24px; object-fit: contain; display: block; transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1); }
.floating-panel .quick-close-btn:hover img{transform: rotate(90deg) scale(1.15);}
.floating-panel .quick-close-btn:active img{transform: rotate(90deg) scale(0.95);}

/* 3. 상단 이동 버튼 */
#top_btn{position: static; display: flex; align-items: center; justify-content: center; background: none; border: none; padding: 0; cursor: pointer; color: #2A2A2A; width: 16px; height: 25px; transition: color 0.3s, transform 0.2s; margin: 0 auto;}
#top_btn:hover{color: #2A2A2A; background: none; border: none; transform: translateY(-3px);}
#top_btn svg{width: 16px; height: 24.5px; display: block;}
#top_btn.on-dark{color: #ffffff;}
#top_btn.on-dark:hover{color: #ffffff;}

/* 4. LINE & WeChat QR 모달 */
#line_modal.modal-overlay, #wechat_modal.modal-overlay{position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: rgba(0, 0, 0, 0.6); z-index: 10000; align-items: center; justify-content: center; backdrop-filter: blur(2px); cursor: pointer; pointer-events: auto;}
.line-modal-content, .wechat-modal-content{background: #fffcf8; border-radius: 10px; padding: 40px; width: 324px; box-sizing: border-box; text-align: center; position: relative; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15); cursor: default; pointer-events: auto;}
.line-modal-header, .wechat-modal-header{display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px;}
.line-title, .wechat-title{font-size: 20px; font-weight: 500; color: #2a2a2a; margin: 0; font-family: var(--ff-body);}
.line-close, .wechat-close{background: none; border: none; padding: 6px; margin: -6px; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: transform 0.2s, opacity 0.2s;}
.line-close:hover, .wechat-close:hover{transform: scale(1.2); opacity: 0.7;}
.line-qr-box, .wechat-qr-box{width: 244px; height: 244px; background: #fff; border: 1px solid #eee; display: flex; align-items: center; justify-content: center; margin: 0 auto 20px auto; color: #484848; font-size: 18px; font-family: var(--ff-body);}
.line-qr-box img, .wechat-qr-box img{width: 100%; height: 100%; object-fit: contain; display: block;}
.line-desc, .wechat-desc{font-size: 18px; color: #484848; margin: 0; text-align: center; font-family: var(--ff-body);}

@media(max-width: 1024px){
:root{
--mn-sec-padding: 80px;
--sub-sec-padding: 100px;
--h1-fz: var(--fz-25);
--h2-fz: var(--fz-22);
--h3-fz: var(--fz-20);
--h4-fz: var(--fz-18);
--h5-fz: var(--fz-16);
--tit-desc-fz: var(--fz-16);
--detail-fz: var(--fz-18);
}

.pc{display: none !important;}
.mo{display: block !important;}
.mo-ib{display: inline-block !important;}
.mo-if{display: inline-flex !important;}
.mo-f{display: flex !important;}
.mo-g{display: grid !important;}

.header-container .gnb-bg{display: none !important;}
.header-container .navigation{display: none !important;}
.header-container .signature-switcher{display: none !important;}
.header-container .lang-switcher{display: block !important;}
.header-container .hd-cont{height: 75px; padding: 0 20px;}
.header-container .hd-btn-wrap{gap: 12px;}
.header-container .lang-curr-btn{width: 58px; height: 32px; padding: 4px 8px; font-size: 14px;}
.header-container .lang-dropdown{width: 58px; top: calc(100% + 5px);}
.header-container .lang-dropdown li a.lang-item{height: 32px; padding: 4px 8px; font-size: 14px;}
.header-container .logo-area img{height: 48px; width: auto;}
.header-container .hamburger-button{display: flex; flex-direction: column; justify-content: space-between; width: 24px; height: 16px; background: none; border: none; padding: 0; cursor: pointer; outline: none;}
.header-container .hamburger-button .bar{display: block; width: 100%; height: 2px; background-color: #fff; border-radius: 1px; transition: all 0.3s ease;}
.header-container.scrolled .hamburger-button .bar{background-color: var(--color-text);}
#top_menu{display: none;}
#side_menu{position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #fff; z-index: 10000; transform: translateY(-100%); transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), visibility 0.4s; display: flex; flex-direction: column; box-sizing: border-box; visibility: hidden; pointer-events: none;}
#side_menu.open{transform: translateY(0); visibility: visible; pointer-events: auto;}
#side_menu .nav-head{display: flex; align-items: center; justify-content: space-between; height: 75px; padding: 0 20px; border-bottom: 1px solid #efefef; flex-shrink: 0;}
#side_menu .side-close{background: none; border: none; padding: 0; cursor: pointer; display: flex; align-items: center; justify-content: center;}
#side_menu .nav-logo img{height: 44px; width: auto; filter: brightness(0) saturate(100%) invert(18%) sepia(50%) saturate(596%) hue-rotate(344deg) brightness(96%) contrast(91%);}
#side_menu .nav-body{flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 10px 0 60px 0;}
#moNav ul{list-style: none; margin: 0; padding: 0;}
#moNav .gnb-menu-depth1{border-bottom: 1px solid #f5f4f0;}
#moNav .gnb-menu-depth1 > a{display: flex; justify-content: space-between; align-items: center; padding: 18px 24px; font-size: 17px; font-weight: 600; color: #403627; text-decoration: none; transition: color 0.3s; font-family: var(--ff-notoserif);}
#moNav .gnb-menu-depth1:first-child > a{font-family: var(--ff-cormorant); font-size: 20px;}
#moNav .gnb-menu-depth1 > a::after{content: ''; display: inline-block; width: 8px; height: 8px; border-right: 2px solid #bcaea3; border-bottom: 2px solid #bcaea3; transform: rotate(45deg); transition: transform 0.3s ease;}
#moNav .gnb-menu-depth1.active > a{color: var(--color-primary);}
#moNav .gnb-menu-depth1.active > a::after{transform: rotate(-135deg); border-color: var(--color-primary);}
#moNav .gnb-menu-depth2{list-style: none; margin: 0; padding: 14px 24px 20px 24px; background-color: #fbfaf8; border-top: 1px solid #f5f4f0;}
#moNav .gnb-menu-depth2 li{margin-bottom: 14px;}
#moNav .gnb-menu-depth2 li:last-child{margin-bottom: 0;}
#moNav .gnb-menu-depth2 li a{font-size: 15px; color: #666; text-decoration: none; font-weight: 400; display: block; transition: color 0.2s; font-family: var(--ff-notoserif);}
#moNav .gnb-menu-depth2 li a:hover{color: var(--color-primary);}

footer{padding: 60px 20px 80px 20px; gap: 24px;}
footer .ft-logo img{height: 58px;}
footer .ft-link-wrap{gap: 25px;}
footer .ft-link-wrap a{font-size: 12px;}
footer .ft-info-wrap{gap: 10px;}
footer .ft-info{font-size: 12px; line-height: 18px; color: rgba(255, 255, 255, 0.8);}
footer .ft-info p{margin: 0; line-height: 18px;}
footer .ft-info .bar{margin: 0 8px; opacity: 0.6;}
footer .ft-copy{font-size: 12px; line-height: 18px;}

.btm-fix-area{right: 15px; bottom: 15px;}
.floating-container .trigger-circle{width: 60px; height: 60px;}
.floating-container .trigger-circle .quick-logo{width: 32px;}
.floating-panel{width: 60px; padding: 15px 0;}
.floating-panel .quick-item{width: 100%; height: 60px;}
.floating-panel .quick-item img{height: 24px; max-width: 26px;}
.floating-panel .quick-close-btn{width: 100%; height: 60px;}
.floating-panel .quick-close-btn img{width: 20px; height: 20px;}
#top_btn svg{width: 14px; height: 20px;}
}