/********************************************
* HEADER 헤더
********************************************/

#header { position: relative; z-index: 1000; } 
#header.active { position: fixed; background-color: #fff; box-shadow: 0 0 5px rgba(0,0,0,0.3); } 
.h-logo { display: block; width: 20rem; height: 5.1rem; background-image: url(/wp-content/uploads/2025/06/logo.png); transition: all .3s; } 
#header.active .h-logo { background-position: 0 -5.1rem; } 
#header nav > ul > li > a { justify-content: center !important; margin: 0 !important; padding: 0 4rem !important; font-family: 'GmarketSans', 'Montserrat', 'sans-serif'; font-size: 2rem !important; font-weight: 500 !important; color: #111; transition: all .3s; } 
.h-sitemap { display: flex; flex-direction: column; gap: 0.6rem; } 
.h-sitemap span { display: block; width: 3rem; height: 0.3rem; background-color: #fff; transition: all .3s; } 
#header.active .h-sitemap span { background-color: #222; } 


.h-tnb-wrap { display: flex; gap: 3rem; } 
.h-tnb-wrap .sns-wrap { display: flex; gap: 2.5rem; } 

span.sub-arrow { display: none !important; } 
#header nav ul li ul { top: 5rem !important; left: 0 !important; z-index: 20; width: 100% !important; } 
#header nav ul li ul li a { justify-content: center !important; border-left: none !important; } 

#sitemap { cursor: pointer; } 
#sitemap-wrap nav ul li a {
  font-family: 'NanumSquareNeo' !important;
  font-size: 1.8rem;
  font-weight: 500;
}

.sitemap-menu01 .sitemap-tit h2 { transition: all .3s; } 
.sitemap-menu01:hover .sitemap-tit h2 { color: var(--main-color2) !important; } 

.sitemap-menu nav > ul > li { display: flex; } 
.sitemap-menu nav > ul > li > a { position: relative; display: inline-block; width: auto !important; margin: 0 auto; } 
.sitemap-menu nav > ul > li > a:after { content: ""; position: absolute; left: 0; bottom: 0; display: block; width: 100%; height: 1px; background-color: #333; } 
.elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:after { background-color: #333 !important; } 



/********************************************
* FOOTER 푸터
********************************************/

#footer {
  background-color: #1e1d1d;
}
#footer .con {
  display: flex;
  justify-content: space-between;
  width: var(--max-container);
  margin: 0 auto;
  padding: 3rem 0;
}
#footer .con p, #footer .con span, #footer .con a { font-family: 'NanumSquareNeo' !important; font-weight: 400; color: #fff; }
.f-logo {
  margin-bottom: 3rem;
}
.f-addr {
  margin-bottom: 1rem;
}
.f-addr span {
  font-size: 1.5rem;
}
.f-addr span + span {
  margin-left: 3.1rem;
}
.f-addr span:after {
  content: "";
  display: inline-block;
  width: 1px;
  height: 1.5rem;
  background-color: #fff;
  transform: translate(18px, 3px);
}
.f-addr span:last-child:after {display: none;}
.f-copy { color: #d1d1d1; }
.f-right {
  display: flex;
  flex-direction: column;
  align-items: end;
  justify-content: space-between;
}
.f-menu {
  display: flex;
  gap: 3rem;
}
.f-family {
  position: relative;
  width: 20rem;
  height: 4.5rem;
  border: 1px solid #fff;
  transition: all .3s;
}
.f-family ul {
  overflow: hidden;
  position: absolute;
  left: 0;
  bottom: 4.3rem;
  height: 0;
  transition: all .3s;
}
.f-family .f-family-wrap {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  width: 100%;
  height: 100%;
  cursor: pointer;
  transition: all .3s;
}
.f-family .f-family-wrap .f-family-icon-wrap { position: relative; }
.f-family .f-family-wrap img { transition: all .3s; }
.f-family .f-family-wrap img:last-child {
  position: absolute;
  left: 0;
  top: 0;
  transform: rotate(180deg) translate(0, -2px);
  opacity: 0;
}
#footer .f-family:hover { background-color: #fff; }
#footer .f-family:hover .f-family-wrap span { color: #111; }
#footer .f-family:hover .f-family-wrap img:last-child { opacity: 1;}
#footer .f-family:hover ul {
  width: 100%;
  height: 12rem;
  border: 1px solid #ddd;
  background-color: #f2f2f2;
}
#footer .f-family:hover ul li {
  width: 100%;
}
#footer .f-family:hover ul li a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 3rem;
  border-bottom: 1px solid #ddd;
  color: #111;
}