@font-face {
    font-family: PT;
    src: url(/hb/2026/unseo2/assets/fonts/Pretendard-Light.woff2);
    font-weight: 300;
}
@font-face {
    font-family: PT;
    src: url(/hb/2026/unseo2/assets/fonts/Pretendard-Regular.woff2);
    font-weight: 400;
}
@font-face {
    font-family: PT;
    src: url(/hb/2026/unseo2/assets/fonts/Pretendard-Medium.woff2);
    font-weight: 500;
}
@font-face {
    font-family: PT;
    src: url(/hb/2026/unseo2/assets/fonts/Pretendard-Bold.woff2);
    font-weight: 700;
}
@font-face {
    font-family: AV;
    src: url(/hb/2026/unseo2/assets/fonts/Antro_Vectra.woff2);
    font-weight: 400;
}

*{margin : 0;padding : 0; box-sizing: border-box;}
li{list-style: none;}
a{text-decoration: none; color : inherit}
img{display: block;max-width: 100%;}
.moView{display : none !important}

html{scroll-behavior: smooth;}
/* 마우스오버 ANIMATION CSS */
.hover_ani{position:relative;/*width:500px;height:500px;*/}
.hover_ani>span.line{position:absolute;transition:width .5s,height .5s;background:#111;z-index: 10;}
.hover_ani>span.line:nth-child(1){width:0px;height:1px;left:0;top:0;}
.hover_ani>span.line:nth-child(2){width:1px;height:0px;right:0;top:0;}
.hover_ani>span.line:nth-child(3){width:0px;height:1px;right:0;bottom:0;}
.hover_ani>span.line:nth-child(4){width:1px;height:0px;left:0;bottom:0;}
.hover_ani:hover>span.line:nth-child(1),.hover_ani:hover>span.line:nth-child(3){width:100%;height:1px;}
.hover_ani:hover>span.line:nth-child(2),.hover_ani:hover>span.line:nth-child(4){width:1px;height:100%;}
/* 마우스오버 ANIMATION CSS END*/

/**/
.header{display: flex;justify-content: center;  position : fixed;left : 0;top : 0; width : 100%; padding : 50px 80px 36px ;z-index: 1000; opacity: 0;transition : opacity .5s, background .5s, border-color .5s; pointer-events: none;}
.header.show{opacity: 1; pointer-events: all;}
.header.sub{background: #fff; border-bottom : 1px solid rgba(0,0,0,0.1);opacity: 1; pointer-events: all;}
.header.active{background: transparent; border-color : transparent}
.header-inner{display: flex;justify-content: space-between; width : 100%;max-width: 1740px;}

.main-logo{width : 524px; height : 24px; background: url(/hb/2026/unseo2/assets/images/common/main-logo.png)no-repeat center / contain; transition : background .5s, opacity .5s;}
.dark .main-logo{background: url(/hb/2026/unseo2/assets/images/common/main-logo-dark.png)no-repeat center / contain;}
.sub .main-logo{background: url(/hb/2026/unseo2/assets/images/common/main-logo-dark.png)no-repeat center / contain;}
.active .main-logo{opacity: 0; pointer-events : none;}

.main-logo > a{font-size: 0;line-height: 0; display: block;width : 100%;height : 100%;}

.header-left{display: flex; align-items: center;gap : 15px}
.header-open{padding : 10px 18px; line-height: 1em; font-family: PT; font-size: 15px; color : #8E7C72; font-weight: 700; background: #fff; transition : opacity .5s;}
.active .header-open{opacity: 0;pointer-events: none;}

.header-right{display: flex;align-items: center; gap : 30px}

.header-customer{display: flex; gap : 4px; align-items: center; font-size: 15px; font-family: PT; font-weight: 700; color: #8E7C72;transition : color .5s, opacity .5s;color : #fff;}
.header.dark .header-customer{color : #8e7c72}
.header.sub .header-customer{color : #8e7c72}
.active .header-customer{opacity: 0; pointer-events: none;}

.header-customer > img{transition : filter .5s; filter: brightness(10);}
.header.dark .header-customer > img{filter: brightness(1);}
.header.sub .header-customer > img{filter: brightness(1);}

.header-tel{display: flex;align-items: center; gap : 9px; font-family: futura-pt; font-weight: 500; font-size: 22px; color : #fff; transition : color .5s, opacity .5s;}
.dark .header-tel{color : #000}
.sub .header-tel{color : #000}

.header-tel-icon{width : 21px;height : 21px; background: url(/hb/2026/unseo2/assets/images/common/header-tel-icon.png)no-repeat center / contain; transition :  background .5s}
.dark .header-tel-icon{background: url(/hb/2026/unseo2/assets/images/common/header-tel-icon-dark.png)no-repeat center / contain;}
.sub .header-tel-icon{background: url(/hb/2026/unseo2/assets/images/common/header-tel-icon-dark.png)no-repeat center / contain;}
.active .header-tel{opacity: 0; pointer-events: none;}

.hamburger{display: flex;align-items: center;justify-content: center; width : 26px; height : 20px;position : relative;}
.hamburger > span{width : 100%;height : 1px; background: #fff;position : absolute; transition : transform .5s, clip-path .5s, background .5s;}
.hamburger > span:nth-child(1){transform: translateY(-900%);}
.hamburger > span:nth-child(2){height : 2px; clip-path: inset(0 0 0 20%);}
.hamburger > span:nth-child(3){transform: translateY(900%);}

.dark .hamburger > span{background: #000;}
.sub .hamburger > span{background: #000;}

.active .hamburger > span:nth-child(1){transform: translateY(0) rotate(-45deg); background: #000;}
.active .hamburger > span:nth-child(2){height : 2px; clip-path: inset(0 0 0 100%);background: #000;}
.active .hamburger > span:nth-child(3){transform: translateY(0) rotate(45deg);background: #000;}


.hamburger-nav{display: flex; position :fixed;width : 100%;height : 100%; z-index: 999; transform: translateX(100%);transition : transform 1s;top : 0; left : 0;}
.active + .hamburger-nav{transform: translateX(0); transition-delay: .4s;}
.hamburger-bg{width : 50%;position :relative; background: transparent; transition : background 1s}

.active + .hamburger-nav .hamburger-bg{background: #fff; transition-delay: 1.6s;}
.hamburger-bg > img{position : absolute; left : 0;top : 0; width : 100%;height : 100%;height : 100%; object-fit: cover; object-position: center; opacity: 0; transition : opacity 1.2s;}
.hamburger-bg > img.hamburger-logo{width : auto;height : auto; top : auto; bottom : 0;}

.active + .hamburger-nav .hamburger-bg > img{opacity: 1; transition-delay: calc(var(--i) * 0.1s + 1.2s);}
.hamburger-bg > img:nth-child(1){clip-path: inset(0 66.6666% 66.6666% 0);}
.hamburger-bg > img:nth-child(2){clip-path: inset(0 33.3333% 66.6666% 33.3333%);}
.hamburger-bg > img:nth-child(3){clip-path: inset(0 0 66.6666% 66.6666%);}

.hamburger-bg > img:nth-child(4){clip-path: inset(33.3333% 66.6666% 33.3333% 0);}
.hamburger-bg > img:nth-child(5){clip-path: inset(33.3333% 33.3333% 33.3333% 33.3333%);}
.hamburger-bg > img:nth-child(6){clip-path: inset(33.3333% 0 33.3333% 66.6666%);}

.hamburger-bg > img:nth-child(7){clip-path: inset(66.6666% 66.6666% 0% 0);}
.hamburger-bg > img:nth-child(8){clip-path: inset(66.6666% 33.3333% 0% 33.3333%);}
.hamburger-bg > img:nth-child(9){clip-path: inset(66.6666% 0 0% 66.6666%);}

.hamburger-inner{background: #fff; width : 50%; padding : 96px 87px;}

.hamburger-inner-logo{margin-bottom: 100px;}

.hamburger-inner > ul{font-family: PT;letter-spacing: -0.04em;}
.hamburger-inner > ul > li > a{font-size: 22px; padding : 10px 0; position : relative}
.hamburger-inner > ul > li > a::after{position : absolute; content: '';width : 100%;height : 1px; bottom : 0; background: #000;left : 0; clip-path: inset(0 100% 0 0); transition : clip-path .5s;}
.hamburger-inner > ul > li:hover > a::after{clip-path: inset(0);}
.hamburger-inner > ul > li > a::before{position : absolute; content: '';width : 8px;height : 8px; bottom : 100%; background: #004E50;left : 0;border-radius: 50%; transform: scale(0); transition : transform .5s;}
.hamburger-inner > ul > li:hover > a::before{transform: scale(1); transition-delay: .2s;}
.hamburger-inner > ul > li + li{margin-top: 36px;}

.hamburger-btn-box{display: flex; position : absolute; bottom : 80px;gap : 24px;}

.hamburger-customer{display: flex; gap : 4px; align-items: center; font-size: 15px; font-family: PT; font-weight: 700; color: #8E7C72}
.hamburger-tel{display: flex; align-items: center;gap : 13px; font-size: 21px; font-family: futura-pt; font-weight: 600;}


.hamburger-dim{position :fixed;width : 100%;height : 100%; z-index: 998;background: rgba(0,0,0,0.8); transition : opacity .7s; opacity: 0; pointer-events : none; left : 0;top : 0;}
.header.active ~ .hamburger-dim{opacity: 1; pointer-events : all;}

.hamburger-link{display: flex; align-items: center; position : absolute; right : 80px; bottom : 90px;}
.hamburger-link > a{display: flex;justify-content : center; align-items: center; position :relative; height: 34px;}
.hamburger-link > a:not(:last-child)::after{position :absolute;content: ''; right : -20px; width : 1px; height : 14px; background: #C4C4C4;}
.hamburger-link > a::before{position : absolute; content : attr(data-text); bottom : 100%; color : #004E50; font-family : futura-pt; transform : translateY(100%); opacity : 0; pointer-events : none; transition : opacity .3s, transform .3s;}
.hamburger-link > a:hover::before{transform : translateY(0); opacity : 1;}

.hamburger-link > a + a{margin-left: 20px;}
.hamburger-link > a:not(:last-child){margin-right: 20px;}

.hamburger-link > a > img{opacity: 0.3; filter: grayscale(1);transition : filter .3s, opacity .3s;}
.hamburger-link > a:hover > img{opacity: 1; filter: grayscale(0);}



.m_nav{display: none;}


/**/
.footer{display: flex;justify-content: center;width : 100%;padding : 54px 0 68px;background : #000;position :relative;z-index : 1;}
.footer-inner{display: flex;justify-content: space-between;width : 100%;max-width : 1530px;position :relative;}
.footer-right{display: flex;justify-content: space-between;align-items: start;gap : 68px;}
.footer-list{display: flex;gap : 30px;font-weight: 300;color : #fff;letter-spacing: -0.025em;font-size: 14px;margin-bottom : 18px;}
.footer-list > li{display: flex;align-items: center;position : relative;}
.footer-list > li:not(:last-child)::after{position :absolute;content : '';width : 1px;height : 10px;background : #fff;right : -15px;}
.footer-info{font-size: 14px;letter-spacing: -0.025em;color : #8e8e8e;line-height: 26px;}
.infomation{display: flex;align-items: center;padding : 0 15px;width : 180px;height : 41px;border : 1px solid rgba(240,240,241,0.3);color : #fff;letter-spacing: -0.025em;font-size: 14px;margin-top : 25px;position :relative;}
.infomation::after{position : absolute;content :'';width : 5px;height : 5px;border-top : 1px solid #fff;border-right : 1px solid #fff;right : 16px;transform: rotate(45deg);transition : right .3s;}
.infomation:hover::after{right : 11px;}
.infomation::before{position : absolute;content : '';background : rgba(255,255,255,0.1);width : 100%;height : 0%;left : 0;bottom : 0;transition : height .5s;}
.infomation:hover::before{height : 100%;}
.footer-ul{display: flex;flex-direction: column;gap : 5px;}
.footer-ul > li{display: flex;align-items: center;gap : 26px;color : #fff;letter-spacing: -0.025em;font-size: 13px;}
.footer-ul > li > span{display: flex;align-items: center;justify-content: end;position : relative;width : 60px;white-space: nowrap;font-size: 14px;}
.footer-ul > li > span::after{position : absolute;content : '';width : 1px;height : 10px;background : #fff;right : -13px;}
.footer-quick-menu{display : flex;justify-content : center;align-items : center; gap : 20px;position : absolute;bottom : 0;right : 0;}

.footer-link{display: flex; display: none; align-items: center; width: 100%; justify-content: center; margin-top: 30px;}
.footer-link > a{display: flex;justify-content : center; align-items: center; position :relative; height : 34px;}
.footer-link > a:not(:last-child)::after{position :absolute;content: ''; right : -20px; width : 1px; height : 14px; background: #C4C4C4;}
.footer-link > a::before{position : absolute; content : attr(data-text); bottom : 100%; color : #fff; font-family : futura-pt; font-size : 10px;}

.footer-link > a + a{margin-left: 20px;}
.footer-link > a:not(:last-child){margin-right: 20px;}

.footer-link > a > img{opacity: 1; filter: grayscale(1) brightness(5);transition : filter .3s, opacity .3s;}

@media (max-width : 1200px){
	.quick-menu{display : none;}
	.moView{display : block !important;}
	.pcView{display : none !important;}

    .header{background: #fff; padding: 0;flex-direction: column; max-width: 750px; left : 50%;transform: translateX(-50%);}
    .header-open{display: none;}
    .header-left{display: flex;justify-content: center; width : 100%;}
    .header-right{display: none;}
    .header-inner{justify-content: center; padding : 6px; border-bottom : 1px solid rgba(0,0,0,0.1)}
    .main-logo{background: url(../images/common/main-logo-dark.png)no-repeat center / contain;max-width : 524px;width : 80%;}

    .m_nav{display: block; font-family: PT; font-weight: 600; letter-spacing: -0.04em;}
    .m_nav > ul{display: grid; grid-template-columns: repeat(3, 1fr); text-align: center; font-size: 12px;}
    .m_nav > ul > li > a{display: block;padding : 7px 0;}
    
    .m_nav > ul > li{border-bottom : 1px solid rgba(0,0,0,0.1); border-right : 1px solid rgba(0,0,0,0.1); transition : background .3s, color .3s;}
    .m_nav > ul > li.on{background: #144139; color : #fff;}

	/**/
	.footer{display : flex;flex-direction : column; align-items : center; padding : 30px 20px;}
    .footer-inner{flex-direction : column;justify-content: center;width : 100%;max-width : none;}
    .footer-logo{max-width : 180px;}
	.footer-right{flex-direction : column;gap : 15px;}
	.footer-list{display: flex;gap : 3px 16px;font-size: 11px;margin-bottom : 10px;flex-wrap : wrap;}
	.footer-list > li:not(:last-child)::after{right : -8px;height : 6px;}
	
	.footer-info{font-size: 11px;line-height: 18px;letter-spacing: -0.025em;color : #8e8e8e;}
	.footer-info > li{padding-left : 12px}
	.footer-info > li::before{font-size : 10px}

	.footer-ul > li > span{flex-shrink : 0;justify-content: center;width : 50px;}
	.infomation{display: flex;padding : 5px 10px;width : 130px;height : 25px;font-size: 10px;margin-top : 15px;}
	.footer-ul{display: flex;align-items : start;gap : 5px 10px;margin-top : 15px;}
	.footer-ul > li{gap : 16px;font-size: 10px;}
	.footer-ul > li > span::after{height : 6px;right : -8px;}
    .footer-quick-menu{justify-content: end;width : 100%;margin-top : 30px;position : static;}

	.top-btn{bottom : 20px;right : 20px;width : 45px;}

    .footer-link{display: flex;}
}