@charset "utf-8";
html, body{
width:auto !important;
height:auto !important;
}
#seoul-gnb-plugin{
background-color: #262B3212 ; 
    backdrop-filter: blur(50px);
}
#seoul-gnb-plugin .seoul-gnb-holder{height:54px;width:84%;}
#seoul-gnb-plugin{height:54px;position:fixed;z-index:9998}
#seoul-gnb-plugin .seoul-gnb-holder .seoul-gnb-link{margin:15px 0 0 0}
#seoul-gnb-plugin .seoul-gnb-holder .seoul-gnb-news{left:197px;top:0 !important;}
#seoul-gnb-plugin .seoul-gnb-holder .seoul-gnb-icon-notice{margin: -3px;}
#seoul-gnb-plugin .seoul-gnb-holder .seoul-gnb-news dd a{line-height:54px;font-size:12px;}
#seoul-gnb-plugin .seoul-gnb-menu > dd > a,
#seoul-gnb-plugin .seoul-gnb-menu > dd .seoul-gnb-icon-menu4{font-size:12px;line-height:54px}
#seoul-gnb-plugin .seoul-gnb-menu > dd > a{padding:0 12px}
#seoul-gnb-plugin .seoul-gnb-menu > dd .seoul-gnb-icon-menu4{padding:0 0 0 12px}
#seoul-gnb-plugin .seoul-gnb-menu > dd{padding:0}
#seoul-gnb-plugin.scrolled{
    mix-blend-mode: exclusion;
}
:root{
    --main-dark-gray: #262B32;
    --main-gray: #6B7278;
    --main-light-gray: #ADB6BD;
    --main-red: #E54837;
    --main-blue: #005EFF;
}
/* Header */
#hd {
  position: fixed;
  top: 54px;
  left: 0;
  width: 100%;
  z-index: 1000;
  transition: all 0.3s ease;
  background: #262B3212;
  backdrop-filter: blur(50px);
}

/* 기본 상태 (투명 배경) */
#hd .hd_inner {
  max-width: 1596px;
  width: 84%;
  margin: 0 auto;
  height: 60px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;


}

/* 로고 */
.logo {
  margin: 0;
}

.logo .pc {
  display: block;
}

.logo .mo {
  display: none;
}

.logo img {
  height: 30px;
  display: block;
}

/* 기본: 흰색 로고 보임 */
.logo .logo_white {
  display: block;
}

.logo .logo_red {
  display: none;
}

/* GNB */
#gnb {
  display: flex;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  height: 100%;
}

.gnb_link {
  font-weight: 600;
  font-size: 16px;
  color: #fff;
  transition: all 0.3s;
  position: relative;
  display: block;
  width: 160px;
  line-height: 60px;
  text-align: center;
}

.gnb_link::after {
  content: '';
  position: absolute;
  bottom: 0px;
  left: 0;
  width: 100%;
  height: 6px;
  background: var(--main-red);
  opacity: 0;
  transition: 0.5s all;
}

.gnb_link:hover::after {
  opacity: 1;
}

/* Util Area */
.util_area {
  display: flex;
  align-items: center;
  gap: 18px;
}
.util_link,
.search_btn,
.user_btn {
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 0;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.3s;
}


.util_link:hover,
.search_btn:hover,
.user_btn:hover {
  opacity: 0.7;
}


/* 기본: 흰색 아이콘 보임 */
.icon_white {
  display: block;
}

.icon_black {
  display: none;
}

.util_link{
  width: 58px;
}
.lang_selector .lang_btn {
  width: 48px;
  display: flex;
  align-items: center;
  cursor: pointer;
  transition: all 0.3s;
}

.lang_selector .lang_btn .dropdown {
  transition: transform 0.3s ease;
}

.lang_selector .lang_btn.active .dropdown {
  transform: rotate(180deg);
}

.divide{
  display: flex;
  justify-content: center;
  align-items: center;
}
.divide span{
  width: 1px;
  height: 12px;
  background: var(--main-light-gray);
}
/* 사이트 선택 드롭다운 */
.site_selector {
  position: relative;
}

.site_selector .site_btn {
  width: 58px;
  display: flex;
  align-items: center;
  cursor: pointer;
  background: transparent;
  border: none;
  padding: 0;
  transition: all 0.3s;
}

#changeSite {
  position: absolute;
  bottom: -108px;
  padding: 4px 12px;
  z-index: 999;
  border-radius: 6px;
  display: none;
  opacity: 0;
  transition: opacity 0.3s ease;
  overflow: hidden;
}

#changeSite::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #ffffff4b;
  filter: blur(10px);
  z-index: -1;
  pointer-events: none;
}

#changeSite.active {
  display: block;
  opacity: 1;
}

#changeSite span {
  width: 100%;
  height: 1px;
  background: #FFFFFF80;
}

.site_select_btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  position: relative;
  z-index: 1;
}

.site_select_link {
  cursor: pointer;
  display: block;
  color: #fff;
}

.site_select_link span {
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  height: auto;
  background: transparent;
}

.site_select_link:hover span {
  color: var(--main-red);
}
.lang_selector {
  position: relative;
}
/* 언어변경 클릭 시 드롭다운 */
#changeLang{
  position: absolute;
  bottom: -80px;
  padding: 4px 12px;
  z-index: 999;
  border-radius: 6px;
  display: none;
  opacity: 0;
  transition: opacity 0.3s ease;
  overflow: hidden;
}
#changeLang::after{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #ffffff4b;
  filter: blur(10px);
  z-index: -1;
  pointer-events: none;
}

#changeLang.active{
  display: block;
  opacity: 1;
}
#changeLang span{
  width: 100%;
  height: 1px ;
  background: #FFFFFF80;
}
.lang_select_btn{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  position: relative;
  z-index: 1;
}

.lang_select_link {
  cursor: pointer;
  display: block;
}
/* Menu Button (Hamburger) */
.menu_btn {
  background: transparent;
  border: none;
  cursor: pointer;
  width: 24px;
  height: 24px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 0;
}


/* Mega Menu */
.mega_menu {
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: 0;
  background: #fff;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-20px);
  transition: all 0.5s ease;
    overflow: hidden;
}

.mega_container {
  max-width: 800px;
  width: 84%;
  height: 100%;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0;
}

.mega_col {
  padding: 0px 14px;
  border-right: 1px solid #F4F5F7;
}


/* 각 컬럼별 너비 조정 */
.mega_col_1 {
  grid-column: span 1;
  background: #FBFCFD;
  border-left: 1px solid #E9EBEF;
  border-right: 1px solid #E9EBEF;
}

.mega_col_2 {
  grid-column: span 1;
}

.mega_col_3 {
  grid-column: span 1.5;
}

.mega_col_4 {
  grid-column: span 1;
}

.mega_col_5 {
  grid-column: span 1;
}

/* 메가메뉴 섹션 */
.mega_section {
  padding: 20px 0;
}

.mega_section:not(:last-child){
  border-bottom: 1px solid #E9EBEF;
}

/* 서브타이틀 */
.mega_subtitle {
  font-size: 16px;
  font-weight: 700;
  color: var(--main-dark-gray);
  margin-bottom: 10px;
  line-height: 1.5;
  cursor: pointer;
}

/* 메인 리스트 (서울디자인NOW, 고객지원) */
.mega_list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.mega_item {
 padding: 20px 0;
}

.mega_item:not(:last-child){
  border-bottom: 1px solid #E9EBEF;
}

.mega_item a {
  color: var(--main-dark-gray);
  font-size: 16px;
  font-weight: 700;
  text-decoration: none;
  transition: all 0.3s;
  display: inline-block;
  line-height: 1.5;
  width: 100%;
}

.mega_item a:hover {
  color: #E54837;
}

/* 서브 리스트 */
.mega_sublist {
  list-style: none;
  padding: 0;
  margin: 0;
}

.mega_sublist li {
  margin-bottom: 10px;
}

.mega_sublist li:last-child {
  margin-bottom: 0;
}

.mega_sublist a {
  color: var(--main-gray);
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  transition: all 0.3s;
  display: block;
}

.mega_sublist a:hover {
  color: #E54837;
}


/* 스크롤 시 색상 변경 (메가메뉴 없음) */
#hd.scrolled{
  mix-blend-mode: exclusion;
}
/*
#hd.scrolled .gnb_link {
  color: var(--main-dark-gray);
}

#hd.scrolled .gnb_link:hover {
  color: var(--main-red);
}

#hd.scrolled .logo .logo_white {
  display: none;
}

#hd.scrolled .logo .logo_red {
  display: block;
}

#hd.scrolled .icon_white {
  display: none;
}

#hd.scrolled .icon_black {
  display: block;
}
*/


/* Header Menu Active State - 메가메뉴 오픈 */
#hd.menu_active {
  background: #fff;
  mix-blend-mode: normal;
 
}

#hd.menu_active .mega_menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  height: 542px;
 border-top: 1px solid #262B32;
}

/* Menu Active 시 텍스트/아이콘 색상 변경 */
#hd.menu_active .gnb_link {
  color: var(--main-dark-gray);
}

#hd.menu_active .gnb_link:hover {
  color: var(--main-red);
}

#hd.menu_active .logo .logo_white {
  display: none;
}

#hd.menu_active .logo .logo_red {
  display: block;
}

#hd.menu_active .icon_white {
  display: none;
}

#hd.menu_active .icon_black {
  display: block;
}

#hd.menu_active .lang_selector .lang_btn {
  color: var(--main-dark-gray);
}

#hd.menu_active .lang_selector .lang_btn:hover {
  color: #fff;
}
/* 모바일 메뉴 */
#gnbMobile {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 9999;
  visibility: hidden;
  pointer-events: none;
}

#gnbMobile.active {
  visibility: visible;
  pointer-events: all;
}

.mobile_menu_overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  opacity: 0;
  transition: opacity 0.3s ease;
}

#gnbMobile.active .mobile_menu_overlay {
  opacity: 1;
}

.mobile_menu_container {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  max-width: 375px;
  height: 100%;
  background: #fff;
  transform: translateX(100%);
  transition: transform 0.3s ease;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}

#gnbMobile.active .mobile_menu_container {
  transform: translateX(0);
}

.mobile_menu_header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 18px 16px;
  background: var(--main-red);
}

.mobile_logo img {
  height: 24px;
}

.mobile_close_btn {
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 8px;
}

.mobile_close_btn img {
  width: 24px;
  height: 24px;
  filter: brightness(0) invert(1);
}

.mobile_user_section {
  background: var(--main-red);
  padding: 20px 16px;
  text-align: center;
  
}

.mobile_welcome {
  font-size: 20px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 16px;
  word-break: keep-all;
}

.mobile_auth_buttons {
  display: flex;
  gap: 10px;
}

.mobile_auth_btn {
  flex: 1;
  height: 48px;
  line-height: 48px;
  background: #fff;
  font-size: 16px;
  font-weight: 600;
  color: var(--main-dark-gray);
  cursor: pointer;
  transition: all 0.3s;
}

.menu_wrapper{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
}
.mobile_util_links {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
}

.mobile_util_link {
  display: flex;
  align-items: center;
  gap: 4px;
  width: 58px;
}

.mobile_divider {
  width: 24px;
  height: 24px;
  position: relative;
}
.mobile_divider::after{
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 1px ;
  height: 12px;
  background: #fff;
}

.mobile_search{
  width: 24px;
  height: 24px;
}

.mobile_nav {
  flex: 1;
  overflow-y: auto;
  padding: 0 0 24px 0;
}

.mobile_nav::-webkit-scrollbar{
  background: transparent;
  width: 0px;
}

.mobile_nav_item {
  border-bottom: 1px solid #E9EBEF;
}

.mobile_nav_title {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 16px;
  background: transparent;
  border: none;
  font-size: 18px;
  font-weight: 600;
  color: var(--main-dark-gray);
  cursor: pointer;
  text-align: left;
}

.mobile_arrow {
  width: 24px;
  height: 24px;
  transition: transform 0.3s ease;
}

.mobile_nav_item.active .mobile_arrow {
  transform: rotate(180deg);
}

.mobile_nav_submenu {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
  background: #F8F9FB;
}

.mobile_nav_item.active .mobile_nav_submenu {
  max-height: 1000px;
}

.mobile_nav_submenu > li {
  margin: 0 16px 0 36px;
}

.mobile_nav_submenu > li > a {
  display: block;
  padding: 12px 24px 12px 40px;
  color:var(--main-dark-gray) ;
  font-size: 16px;
  text-decoration: none;
  transition: background 0.2s;
  
}

.mobile_nav_submenu > li > a:hover {
  background: rgba(255, 255, 255, 0.1);
}
/* .mobile_nav_submenu > li > a { */

.mobile_submenu_section {
  padding: 0;
}

.mobile_submenu_title {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 0;
  background: transparent;
  border: none;
  font-size: 15px;
  font-weight: 800;
  color: var(--main-dark-gray);
  cursor: pointer;
  text-align: left;
  transition: background 0.2s;
}

.mobile_submenu_section:not(:last-child) .mobile_submenu_title {
  border-bottom: 1px solid #E9EBEF;
}

.mobile_arrow_sub {
  width: 24px;
  height: 24px;
  transition: transform 0.3s ease;
}

.mobile_submenu_section.active .mobile_arrow_sub {
  transform: rotate(180deg);
}

.mobile_submenu_link {
  display: block;
  padding: 12px 24px 12px 40px;
  color: var(--main-dark-gray);
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
  transition: background 0.2s;
}

.mobile_submenu_link:hover {
  background: rgba(38, 43, 50, 0.05);
}

.mobile_submenu_list {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
  list-style: none;
  padding: 0;
  margin: 0;
}

.mobile_submenu_section.active .mobile_submenu_list {
  max-height: 500px;
}

.mobile_submenu_list li {
  padding: 0;
}

.mobile_submenu_list li a {
  display: block;
  padding: 10px 24px 10px 0px;
  color: var(--main-dark-gray);
  font-size: 14px;
  text-decoration: none;
  transition: background 0.2s;
}

.mobile_lang_selector {
  display: flex;
  gap: 8px;
  padding: 20px 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
}

.mobile_lang_btn {
  flex: 1;
  height: 44px;
  background: transparent;
  border: 1px solid #fff;
  border-radius: 4px;
  color: var(--main-dark-gray);
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s;
}

.mobile_lang_btn.active,
.mobile_lang_btn:hover {
  background: var(--main-dark-gray);
  color: var(--main-red);
}

/* 전체메뉴 */

.design_foundation a { color:#e54837; display:block; font-size:20px; font-weight:600; height:100%; padding:0 15px; }

.ham_menu_bg { background:#000; display:none; height:100%; left:0; position:fixed; top:0; width:100%; z-index:9999; }
.ham_menu_wrap { display:none; height:100%; left:50%; margin-left:-600px; position:fixed; top:0; width:1200px; z-index:10000; }
.ham_menu_wrap:after { clear:both; content:""; display:block; }

.ham_menu_wrap .mCSB_inside > .mCSB_container { margin-right:0; }
.ham_menu_wrap .mCSB_scrollTools { opacity:0; }
.ham_menu_wrap .mCustomScrollbar > .mCustomScrollBox > .mCSB_scrollTools.mCSB_scrollTools_onDrag,
.ham_menu_wrap .mCustomScrollbar > .mCustomScrollBox ~ .mCSB_scrollTools.mCSB_scrollTools_onDrag,
.ham_menu_wrap .mCustomScrollBox:hover > .mCSB_scrollTools,
.ham_menu_wrap .mCustomScrollBox:hover ~ .mCSB_scrollTools,
.ham_menu_wrap .mCS-autoHide:hover > .mCustomScrollBox > .mCSB_scrollTools,
.ham_menu_wrap .mCS-autoHide:hover > .mCustomScrollBox ~ .mCSB_scrollTools { opacity:0; }
.ham_menu_wrap .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { opacity:0; }

.ham_menu_close { cursor:pointer; background:url("../img/common/btn_ham_close.jpg") no-repeat; display:block; height:48px; overflow:hidden; position:absolute; right:1px; top:72px; /*text-indent:-20000px;*/ width:48px; z-index:5; }


.design_foundation { height:30px; left:50%; line-height:30px; position:absolute; text-align:center; -webkit-transform:translateX(-50%); transform:translateX(-50%); top:72px; z-index:5; }
.design_foundation a { color:#016bd2; display:block; font-size:20px; font-weight:600; height:100%; padding:0 15px; }


.ham_menu_each { float:left; height:100%; padding:134px 0 180px 28px; position:relative; width:20%; }
.ham_menu_each:after { background:#222; content:""; height:calc(100vh + 180px); position:absolute; right:0; top:0; width:1px; }
.ham_menu_each > strong { color:#fff; display:block; font-size:28px; font-weight:700; }
.ham_menu_each > ul { margin-top:32px; }
.ham_menu_each > ul > li { margin-top:24px; }
.ham_menu_each > ul > li:first-child { margin-top:0; }
.ham_menu_each > ul > li > a { color:#fff; font-size:18px; font-weight:400; }
.ham_menu_each > ul > li > ul > li { margin-top:14px; }
.ham_menu_each > ul > li > ul > li > a { color:#a6a6a6; font-size:16px; font-weight:400; padding-left:10px; position:relative; }
.ham_menu_each > ul > li > ul > li > a:before { content:"-"; left:0; position:absolute; top:4px; }

.rnb_menu_dimm,
.rnb_menu_bg,
.rnb_menu_wrap { display:none; }

.ham_menu_bg,
.ham_menu_wrap{display:block; opacity:0; visibility:hidden; transition:all .3s;}

.menu-open .ham_menu_bg,
.menu-open .ham_menu_wrap { opacity:1; visibility:visible;}

.menu-open .rnb_menu_dimm{opacity:0.8; visibility:hidden;}
.menu-open .rnb_menu_bg,
.menu-open .rnb_menu_wrap {opacity:0; visibility:hidden;}



.ham_menu_wrap{width:1240px; margin-left:-620px;}
.ham_menu_wrap a{word-break:keep-all; word-wrap:break-word;}
.ham_menu_wrap .ham_menu_list .depth_1{display:flex; justify-content:center;}
.ham_menu_wrap .ham_menu_list .depth_1 > li{width:20%; height:100vh; border-left:1px solid #222; padding:134px 20px 180px 28px;}
.ham_menu_wrap .ham_menu_list .depth_1 > li:last-child{border-right:1px solid #222;}
.ham_menu_wrap .ham_menu_list .depth_1 > li > a{display:block; color:#fff; font-size:28px; font-weight:700;}
.ham_menu_wrap .ham_menu_list .depth_2{margin-top:32px;}
.ham_menu_wrap .ham_menu_list .depth_2 > li{margin-top:24px;}
.ham_menu_wrap .ham_menu_list .depth_2 > li > a{display:block; color:#fff; font-size:18px; font-weight:400;}
.ham_menu_wrap .ham_menu_list .depth_3 > li{margin-top:14px;}
.ham_menu_wrap .ham_menu_list .depth_3 > li > a{display:block; color:#a6a6a6; font-size:16px; position:relative; padding-left:10px;}
.ham_menu_wrap .ham_menu_list .depth_3 > li > a::before{content:'-'; display:inline-block; margin-right:3px; position:absolute; left:0; top:0;}
.ham_menu_close{width:36px; height:36px; top:18px; background-size:contain;}

/* 모바일 메뉴 - 개편 */
.rnb_menu_dimm { background:#000; /*display:none;*/ height:100%; left:0; opacity:0.8; position:fixed; top:0; width:100%; z-index:9998; }
.rnb_menu_bg { background:#fff;/* display:none; */height:100%; position:fixed; right:0; top:0; width:84%; z-index:9999; }
.rnb_menu_bg .rnb_menu_close { background:url("/resources/img/common/m/btn_ham_close.png") no-repeat; background-size:100% auto; display:block; height:45px; left:-75px; overflow:hidden; position:absolute; text-indent:-20000px; top:145px; width:45px; }

.rnb_menu_wrap { /*display:none;*/ height:100%; position:fixed; right:0; top:0; width:84%; z-index:10000; background:#fff; /*overflow:auto; overflow-x:hidden;*/}
.rnb_menu_box { /*display:none;*/ height:100%; position:fixed; right:0; top:0; width:84%; z-index:10000; background:#fff; overflow:auto; overflow-x:hidden;}
.rnb_menu_wrap .mCSB_inside > .mCSB_container { margin-right:0; }

.rnb_menu_wrap .rnb_menu_t { background:#212121; height:auto; position:relative; width:100%; padding:50px 20px; }
.rnb_menu_wrap .rnb_menu_t h2 { color:#fff; font-size:32px; font-weight:400; left:0; padding-top:108px; position:relative; text-align:center; top:auto; width:100%; }
.rnb_menu_wrap .rnb_menu_t h2 i { background:url("../img/common/m/rnb_logo.png") center top no-repeat; background-size:contain; display:block; height:75px; left:50%; margin-left:-92px; position:absolute; top:0; width:148px; }

.rnb_menu_wrap .rnb_menu_btns { left:auto; bottom:auto; font-size:0; height:auto; position:relative; text-align:center; width:100%; margin-top:35px;}
.rnb_menu_wrap .rnb_menu_btns a { border:2px solid #fff; color:#fff; display:inline-block; font-size:28px; font-weight:500; height:70px; line-height:66px; margin:0 2.5%; text-align:center; width:39%; }

.rnb_menu_wrap .rnb_menu_list .depth_1 { padding-bottom:100px; }
.rnb_menu_wrap .rnb_menu_list .depth_1 > li > a,
.rnb_menu_wrap .rnb_menu_list .depth_1 > li > button { text-align:left; background:url("/resources/img/common/m/rnb_arrow_d.png") right 50px center no-repeat; background-size:30px auto; border-bottom:2px solid #eee; color:#212121; display:block; font-size:32px; font-weight:500; height:100px; height: auto;line-height:100px; line-height: 45px;padding:0 120px 0 50px; padding: 26px 120px 27px 50px;width:100%; }
.rnb_menu_wrap .rnb_menu_list .depth_1 > li > a.on,
.rnb_menu_wrap .rnb_menu_list .depth_1 > li > button.on { background:url("/resources/img/common/m/rnb_arrow_u.png") right 50px center no-repeat; background-size:30px auto; }

.rnb_menu_wrap .rnb_menu_list .depth_2 { display:none; }
.rnb_menu_wrap .rnb_menu_list .depth_2 > li { background:#f9f9f9; border-bottom:2px solid #eee; }
.rnb_menu_wrap .rnb_menu_list .depth_2 > li > a { background:url("/resources/img/common/m/rnb_arrow_d.png") right 50px center no-repeat; background-size:30px auto; color:#4e4e4e; display:block; font-size:28px; font-weight:500; height:100px; height: auto;line-height:100px; line-height: 40px;padding:0 120px 0 70px; padding: 30px 120px 30px 70px;width:100%; }
.rnb_menu_wrap .rnb_menu_list .depth_2 > li > a.on { background:url("/resources/img/common/m/rnb_arrow_u.png") right 50px center no-repeat; background-size:30px auto; }
.rnb_menu_wrap .rnb_menu_list .depth_2 > li.no_sub > a,
.rnb_menu_wrap .rnb_menu_list .depth_2 > li.no_sub > a.on { background:transparent; }

.rnb_menu_wrap .rnb_menu_list .depth_3 { display:none; }
.rnb_menu_wrap .rnb_menu_list .depth_3 > li > a { position:relative; color:#4e4e4e; display:block; font-size:24px; font-weight:400; height:70px; line-height:70px; padding-left:90px; position:relative; }
.rnb_menu_wrap .rnb_menu_list .depth_3 > li > a::before{content:'-'; display:inline-block; margin-right:10px;}

.ham_menu_bg,
.ham_menu_wrap{display:block; opacity:0; visibility:hidden; transition:all .3s;}

.rnb_menu_dimm{display:block; opacity:0; visibility:hidden; transition:all .3s;}
.rnb_menu_bg,
.rnb_menu_wrap{display:block; opacity:0; visibility:hidden; transition:all .3s;}

.menu-open .ham_menu_bg,
.menu-open .ham_menu_wrap { opacity:1; visibility:visible;}

.menu-open .rnb_menu_dimm{opacity:0.8; visibility:hidden;}
.menu-open .rnb_menu_bg,
.menu-open .rnb_menu_wrap {opacity:0; visibility:hidden;}

/* 전체메뉴 end */


.total_search_layer { background:#fff; display:block; height:100%; left:0; position:fixed; top:0; width:100%; z-index:1000; opacity:0; visibility:hidden; transition: all .3s;}
.search-open .total_search_layer {opacity:1; visibility:visible;}
.total_search_inner { height:auto; left:50%; margin-left:-500px; position:absolute; top:174px; width:1000px; }
.total_search_close { background:url("../img/common/btn_search_close.png") no-repeat; display:block; height:26px; overflow:hidden; position:absolute; right:-89px; text-indent:-20000px; top:-91px; width:26px; }
.total_search_box { border-bottom:3px solid #212121; height:86px; position:relative; }
.total_search_box input { background:#fff; border:none; color:#212121; font-size:28px; font-weight:400; height:83px; padding:0 90px 0 20px; width:calc(100% - 41px); background:transparent;}
.total_search_box input::placeholder {color:#6a6a6a;}
.btn_total_srch_del { background:url("../img/common/btn_total_srch_del.png") no-repeat; display:block; height:30px; margin-top:-15px; overflow:hidden; position:absolute; right:71px; text-indent:-20000px; top:50%; width:30px; }
.btn_total_srch { background:url("../img/common/btn_total_search.png") no-repeat; display:block; height:42px; margin-top:-21px; overflow:hidden; position:absolute; right:0; text-indent:-20000px; top:50%; width:41px; }

.btn_detail_srch { font-size:0; margin-top:10px; text-align:right; }
.btn_detail_srch a { background:#e54837 !important; color:#fff; display:inline-block; font-size:16px; font-weight:400; height:36px; line-height:36px; padding:0 15px; text-align:center; }
.btn_detail_srch a img { margin:12px 0 0 8px; }
.btn_detail_srch a img.web { display:inline-block; }
.btn_detail_srch a img.mob { display:none; }

.srch_word_list_wrap { margin-top:26px; }
.srch_word_list_wrap:after { clear:both; content:""; display:block; }

.srch_word_list_each { float:left; position:relative; width:50%; }
.srch_word_list_ttl { color:#212121; display:block; font-size:20px; font-weight:500; margin-bottom:38px; }

.srch_word_list_each li { margin-top:20px; }
.srch_word_list_each li:first-child { margin-top:0; }
.srch_word_list_each li:after { clear:both; content:""; display:block; }
.srch_word_list_each li a { color:#4e4e4e; float:left; font-size:16px; font-weight:400; line-height:20px; }
.srch_word_list_each li a.txt { max-width:calc(100% - 60px); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.srch_word_list_each li a.del { background:url("../img/common/del_search_word.png") no-repeat; display:block; height:20px; margin-left:20px; overflow:hidden;  width:20px; }
.srch_word_list_each li a.fav { padding-left:31px; position:relative; }
.srch_word_list_each li a.fav span { color:#212121; font-weight:500; left:0; position:absolute; top:0; }

.srch_word_del_all { margin-top:40px; }
.srch_word_del_all a { border-bottom:1px solid #212121; color:#212121; display:inline-block; font-size:14px; font-weight:400; padding-bottom:6px; }

.for_web { display:block !important; }
.for_mob { display:none !important; }

table.for_web{display:table !important;}
table.for_mob { display:none !important; }

.layer_dimm { background:#000; display:none; height:100%; left:0; opacity:.7; position:fixed; top:0; width:100%; }
.layer_dimm.main_chlg,
.layer_dimm.sns_detail,
.layer_dimm.persn_info_agree { z-index:101; }

/* 서브페이지 하단 nav */
/* 공통 inner 컨테이너 */
.common_inner { 
    height:100%; 
    position:relative; 
    top:0; 
    width:84%;
    max-width:1596px;
    margin: 0 auto; 
}

/* 라인 네비게이션 래퍼 */
.line_nav_wrap { 
   background: #262B3212;
   backdrop-filter: blur(50px);
   border-top : 1px solid #fff;
    border-bottom: 1px solid #fff;
   height:50px; 
    position: fixed;
    top: 114px;
	width:100%;
    z-index: 11;
}
.line_nav_wrap.scrolled{
   mix-blend-mode : exclusion;
}

/* 서브 라인 네비게이션 */
.sub_line_nav { 
    border-left:unset;
    height:100%; 
    left:0; 
    position:absolute; 
}

.sub_line_nav ul:after { 
    clear:both; 
    content:""; 
    display:block; 
}

.sub_line_nav > ul > li { 
    border-right:1px solid #fff; 
    float:left; 
    height:48px; 
    width:240px; 
}

.sub_line_nav > ul > li > a { 
    background:url("../img/common/line_nav_arrow.png") right 20px center no-repeat; 
    color:#fff; 
    display:block; 
    font-size:14px; 
    font-weight:400; 
    line-height:48px; 
    padding:0 40px 0 20px; 
    width:100%; 
    white-space:nowrap; 
    text-overflow:ellipsis; 
    overflow:hidden;
}

/* 홈 버튼 */
.sub_line_nav > ul > li.home { 
    width:51px; 
    border-left: 1px solid #fff;
}

.sub_line_nav > ul > li.home > a { 
    padding:0; 
    width:50px; 
    height:100%; 
    background:url("../img/common/line_nav_home.png") center no-repeat; 
    overflow:hidden;  
}

/* 서브메뉴 드롭다운 */
.sub_line_nav > ul > li > ul { 
    background:#fff; 
    border: 1px solid #eee;
    display:none; 
    padding:13px 0; 
}

.sub_line_nav > ul > li > ul > li { 
    height:38px; 
}

.sub_line_nav > ul > li > ul > li > a { 
    color:#262B32; 
    display:block; 
    font-size:14px; 
    font-weight:400; 
    height:100%; 
    line-height:38px; 
    padding:0 20px; 
    width:100%; 
    white-space:nowrap; 
    text-overflow:ellipsis; 
    overflow:hidden;
}

.sub_line_nav > ul > li > ul > li > a:hover { 
    color:#E54837; 
}

/* blind 클래스 (접근성 - 스크린리더용) */
.blind {
    position: absolute !important;  
    width: 1px !important;  
    height: 1px !important;  
    margin: -1px; 
    padding: 0 !important; 
    overflow: hidden !important;  
    clip: rect(1px 1px 1px 1px) !important;  
    border: 0 !important; 
    z-index:-1 !important; 
    clip-path: inset(50%); 
    color: transparent !important; 
    font-size: 1px !important; 
    line-height: 1px !important;
}

/* 헤더 영역 스타일 오버라이드 */

.line_nav_wrap .common_inner {
    padding:0 !important;
}

 .sub_line_nav > ul {
    display:flex;
}
/*
 .sub_line_nav > ul > li {
    float:unset; 
    width:100%; 
    max-width:221px; 
    height: 50px;
}
*/


/* 반응형 - 태블릿 이하 */
@media (max-width: 1240px) {


}
.line_nav_wrap .common_inner
@media (max-width: 977px) {
    .line_nav_wrap { 
        display:none; 
    }
}

/* 반응형 - 모바일 */
@media (max-width: 800px) {
    .line_nav_wrap { 
        display:block; 
        height:40px;
    }
    
     .sub_line_nav {  
        max-width: 100%; 
        width: 100%;
    }
    
     .sub_line_nav > ul > li {
        height: 40px;
        max-width: 100%;
        width: calc((100% - 30px) / 3);
    }
    
    .sub_line_nav > ul > li > a {
        line-height: 38px;
        padding: 0 20px 0 10px;
        font-size: 12px;
        background-position: right 8px center;
        background-size: 8px 4px;
        max-width: 100%;
    }
    
     .sub_line_nav > ul > li.home {
        width:30px;
    }
    
    .sub_line_nav > ul > li.home > a {
        width: 30px;
        height: 40px;
        background-size:12px 12px;
    }
    
     .sub_line_nav > ul > li > ul {
        padding:5px 0;
    }
    
    .sub_line_nav > ul > li > ul > li {
        height:30px;
    }
    
    .sub_line_nav > ul > li > ul > li > a {
        padding:0 10px; 
        font-size:12px; 
        line-height:28px;
    }
}

@meida screen and (max-width: 750px) {

	.total_search_layer { overflow-y:auto; }
	.total_search_close { background:url("../img/common/m/btn_search_close.png") no-repeat; background-size:100% auto; height:45px; width:45px; }
	.total_search_box { border-bottom:4px solid #212121; height:112px; }
	.total_search_box input { font-size:32px; height:108px; padding:0 150px 0 0; width:calc(100% - 49px); }
	.btn_total_srch_del { background:url("../img/common/m/btn_total_srch_del.png") no-repeat; background-size:100% auto; height:50px; margin-top:-25px; right:90px; width:50px; }
	.btn_total_srch { background:url("../img/common/m/btn_total_search.png") no-repeat; background-size:100% auto; height:49px; margin-top:-25px; width:49px; }

	.btn_detail_srch { margin-top:30px; }
	.btn_detail_srch a { font-size:24px; height:55px; line-height:55px; padding:0 20px; }
	.btn_detail_srch a img { margin:18px 0 0 15px; }
	.btn_detail_srch a img.web { display:none; }
	.btn_detail_srch a img.mob { display:inline-block; }

	.srch_word_list_wrap { margin-top:52px; }

	.srch_word_list_each { float:none; margin-top:100px; width:100%; }
	.srch_word_list_each:first-child { margin-top:0; }
	.srch_word_list_ttl { font-size:36px; margin-bottom:50px; }

	.srch_word_list_each li { margin-top:45px; position:relative; }
	.srch_word_list_each li a { font-size:28px; line-height:40px; }
	.srch_word_list_each li a.txt { margin-right: 20px;}
	.srch_word_list_each li a.del { background:url("../img/common/m/del_search_word.png") no-repeat; background-size:100% auto; height:40px; right:0; top:0; width:40px; }
	.srch_word_list_each li a.fav { padding-left:40px; }

	.srch_word_del_all { margin-top:0; position:absolute; right:0; top:5px; }
	.srch_word_del_all a { border-bottom:0; font-size:24px; padding-bottom:0; }

}
@media screen and (max-width: 640px) {


	.total_search_inner { padding:40px 16px 80px !important; top:60px; }
	.total_search_close { height:22px; top:15px !important; width:22px; right:20px;}
	.total_search_box { border-bottom:2px solid #212121; height:56px; }
	.total_search_box input { font-size:16px; height:54px; padding:0 75px 0 0; width:calc(100% - 25px); }
	.btn_total_srch_del { height:25px; margin-top:-12px; right:45px; width:25px; }
	.btn_total_srch {  height:25px; margin-top:-12px; width:25px; }

	.btn_detail_srch { margin-top:15px; }
	.btn_detail_srch a { font-size:12px; height:27px; line-height:27px; padding:0 10px; }
	.btn_detail_srch a img { margin:9px 0 0 7px; width:6px; }

	.srch_word_list_wrap { margin-top:26px; }

	.srch_word_list_each { margin-top:50px; }
	.srch_word_list_ttl { font-size:18px; margin-bottom:25px; }

	.srch_word_list_each li { margin-top:12px; }
	.srch_word_list_each li a { font-size:14px; line-height:20px; }
	/*.srch_word_list_each li a.txt { width:calc(100% - 30px); }*/
	.srch_word_list_each li a.del { height:20px; width:20px; }
	.srch_word_list_each li a.fav { padding-left:20px; }

	.srch_word_del_all { top:2px; }
	.srch_word_del_all a { font-size:12px; }


}

@media screen and (max-width:1596px){
  #hd .hd_inner{
    max-width: 95.694%;
    width: calc(100% - 32px);
  }
  .line_nav_wrap .common_inner{
   width: 100%; 
 }
}
@media screen and (max-width: 1440px){
  #gnb{
    display: none;
  }
  .lang_selector{
    display: none;
  }
  .user_btn{
    display: none;
  }
}
@media screen and (max-width: 768px){
  .logo .pc {
    display: none;
  }

  .logo .mo {
    display: block;
  }
	.line_nav_wrap { display:block; }	
}

