@charset "utf-8";
/* @latest 2020.05.07 ssj */
/* @latest 2025.08.11 JRA */

#top { position:relative; float:left; width:100%; } 
.head-group { float:left; width:100%; box-sizing:border-box; clear:both; position:relative; background:#fff; z-index:1; -webkit-transition:top 500ms, background 500ms; transition:top 500ms, background 500ms; z-index:999 !important; border-top: 2px solid #e46e16; } 
.header { width:100%; /*height:35px; */ height:0; background:#f8f8f8; position:absolute; z-index:990; box-sizing:border-box; opacity:1; /* border-bottom:1px solid rgba(240,130,0,0.1); */
 -webkit-transition:top 500ms, opacity 1s; transition:top 500ms, opacity 1s; } 
.header .inner { width:100%; max-width:1300px; margin:0 auto; box-sizing:border-box; vertical-align:middle; height:0; position:relative; } 


ul.gnb1 { display:none; } 
.gnb.data:after { content:''; display:block; clear:both; } 
ul.gnb { position:absolute; top: 20px; /*right:310px; 검색바 있을 경우.*/right: 310px; } 
ul.gnb li { display:inline-block; font-size:14px; font-weight:600; } 
ul.gnb li a { color:#333; position:relative; opacity:0.8; } 
ul.gnb li + li { position:relative; padding-left:10px; margin-left:10px; } 
ul.gnb li + li:after { content:''; display:block; position: absolute; top: 2px; left:0; width:1px; height:12px; background:#ccc; } 
ul.gnb li:last-child a:after { display:none; } 
ul.gnb li a:hover { color:#d97400; } 
ul.gnb li a:focus { outline:thin dotted; } 
ul.gnb li.link-group { padding:0; border:none; } 
ul.gnb li.link-group select { height:25px !important; margin-top:-2px; padding:0 20px 0 5px; box-sizing:border-box; font-size:13px; color:black; line-height:28px; border:1px solid rgba(0,0,0,0.3); border:none; background:url(/images/wzwg/cmm/arrow_black.png) no-repeat right 5px center; background-size:6px; appearance:none; -webkit-appearance:none; margin-left:10px; } 
ul.gnb li.link-group select::-ms-expand { opacity:0; } 
ul.gnb li.link-group select option { color:#333; } 


/* srch setting */
.header .srchbox { background:#fff; border-bottom:1px solid #fbd9b2; height:30px; box-sizing:border-box; width:240px; line-height:30px; margin-left:10px; } 
.header .srchbox input[type="text"] { background:transparent; border:none; float:left; padding-left:10px !important; font-size:12px; } 
.header .srchbox .head_srchbtn { text-indent:-9999px; width:28px; height:28px; box-sizing:border-box; margin:0 2px 2px 0; background:url(/images/wzwg/cmm/icon_set.png); background-repeat:no-repeat; background-position:-178px 4px; } 
.header .srchbox .head_srchbtn:focus { outline:thin dotted; } 



.menu { float:left; width:100%; padding-top:15px; z-index:1; -webkit-transition:height 500ms, background 500ms, transform 500ms margin-top 500ms; transition:height 500ms, background 500ms, transform 500ms margin-top 500ms; } 
.menu .inner { width:100%; max-width:1300px; margin:0 auto; box-sizing:border-box; -webkit-transition:height 500ms, line-height 500ms; transition:height 500ms, line-height 500ms; } 
.menu .inner:after { content:''; display: block; clear: both; } 
.menu .logo { display: inline-block; width: 16%; } 
.menu .logo a img { width:auto; /* max-height:90%; */
 max-width: 100%; display:inline-block; vertical-align:middle; -webkit-transition:max-height 500ms, -webkit-transform 500ms; transition:max-height 500ms, transform 500ms; } 

.lnb { float:right; width: 84%; margin-top: 58px; box-sizing:border-box; } 
.lnb > li { float: left; vertical-align:middle; box-sizing:border-box; padding: 0 4px; overflow: hidden; background:#fff; } 
.lnb > li.selected { border:none !important; } 
.lnb > li:last-child:after { content:""; display:none; } 
.lnb > li > a { /* height: 70px; */
 width: 100%; line-height: 22px; display: inline-block; box-sizing: border-box; /* max-height: 63px; */
 vertical-align: middle; text-align:center; box-shadow: 0 0 1px rgba(0, 0, 0, 0); font-size: 20px; color: #555; font-weight: 600; padding: 0 0px 24px; background: #fff; overflow: hidden; position: relative; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); } 
.lnb > li > a:before { content: ""; position: absolute; z-index: -1; left: 51%; right: 51%; bottom: 0; background: #f18201; height: 2px; -webkit-transition-property: left, right; transition-property: left, right; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; } 

.lnb > li.selected>a:before,
.lnb > li > a:focus:before,
.lnb > li:hover > a:before { left:0; right:0; } 


.lnb > li.selected > a { color:#7099c5; position:relative; font-weight:600; } 
.lnb > li.selected > a:hover { line-height:25px; } 

.lnb > li > ul { display:none; height: auto; overflow: hidden; top:0px !important; width:1300px !important; padding: 0 0 0 324px; left:0; right:0; /* background: #fff; */
 margin:0 auto; border-top:1px solid #e0e0e0; box-sizing:border-box; position:absolute; color:#333; z-index: -1; text-align:left; -webkit-transition:top 0.3s; -moz-transition:top 0.3s; -ms-transition:top 0.3s; -o-transition:top 0.3s; transition:top 0.3s; } 
.lnb > li > ul.on { display:block; top:104px !important; width:auto; -webkit-transition:top 0.3s; -moz-transition:top 0.3s; -ms-transition:top 0.3s; -o-transition:top 0.3s; transition:top 0.3s; } 
.lnb > li:hover > ul,
.lnb > li > a:focus { outline:none; } 
.lnb > li > a + ul > li { text-align:left; margin-left: 1px; display: block; display: table; float: left; width: 100%; box-sizing: border-box; background: #fff; border-bottom: 1px solid rgba(214, 207, 198, 0.9); border-right:1px solid transparent; -webkit-transition:border-right 0.5s; transition:border-right 0.5s; } 
.lnb > li > a + ul > li:only-of-type>a,
.lnb > li > a + ul > li:nth-of-type(2):last-of-type>a,
.lnb > li > a + ul > li:nth-of-type(3):last-of-type>a { padding-bottom:50px; } 
.lnb > li > a + ul.on > li { border-right: 1px solid #ececec; } 
.lnb > li > a + ul > li:last-child { border-bottom:none; } 
.lnb > li > a + ul > li.selected:after { transform:rotate(-180deg); border-top:6px solid #0a58a3; } 
.lnb > li > a + ul > li.selected { border:none !important; } 
.lnb > li > a + ul > li.selected > a { font-weight:600; border-bottom:2px solid #0a58a3; box-sizing:border-box; } 
.lnb > li > a + ul > li > a { display: table-cell; vertical-align: top; /* display:block; */width: 30%; height: 100%; box-sizing: border-box; padding: 10px 15px; color: #fff; background: #f8f8f8; background: #f18201; /* border-bottom: 1px solid rgba(51,51,51,0.08); *//* float:left; */font-size: 17px; line-height: 150%; -webkit-transition:background 0.5s; transition:background 0.5s; /* border-bottom: 1px solid rgba(255,255,255,0.3); */ } 
.lnb > li > a + ul > li > a:hover { font-weight:600; } 
.lnb > li > a + ul > li > a:focus { box-sizing:border-box; font-weight:600; } 
.lnb > li > a + ul > li > a:only-child { float:left; } 
.lnb > li > a + ul > li > a + ul { line-height: 150%; box-sizing:border-box; /* float: left; */width: 70%; padding: 7px 5px; display: table-cell; vertical-align: bottom; /* border-bottom: 1px solid #ececec; */ } 
.lnb > li > a + ul > li > a + ul > li { float:left; display: inline-block; } 
.lnb > li > a + ul > li > a + ul > li a { color: #555; font-size: 15.5px; font-weight:600; line-height: 150%; padding: 2px 12px; position: relative; display:block; -webkit-transition:color 0.5s; transition:color 0.5s; } 
.lnb > li > a + ul > li > a + ul > li a:after { content:""; width:1px; height: 12px; background: #ccc; display: inline-block; position: absolute; right: 0; top: 8px; } 
.lnb > li > a + ul > li > a + ul > li:last-child a:after { content:""; display:none; } 
.lnb > li > a + ul > li > a + ul > li a:hover { font-weight:600; color:#f18201; } 
.lnb > li > a + ul > li > a + ul > li a:focus { font-weight:600; color:#f18201; } 


#lnbBg { /* display:block !important; */ /* opacity:0; */
 -webkit-transition:top 0.3s; -moz-transition:top 0.3s; -ms-transition:top 0.3s; -o-transition:top 0.3s; transition:top 0.3s; -webkit-transition:height 0.3s; -moz-transition:height 0.3s; -ms-transition:height 0.3s; -o-transition:height 0.3s; transition:height 0.3s; } 

#lnbBg.on { display:block !important; overflow:hidden; top: 119px !important; z-index:-2 !important; border-top:1px solid rgba(51,51,51,0.1); border-bottom:1px solid rgba(51,51,51,0.2); -webkit-transition:top 0.3s; -moz-transition:top 0.3s; -ms-transition:top 0.3s; -o-transition:top 0.3s; transition:top 0.3s; -webkit-transition:height 0.3s; -moz-transition:height 0.3s; -ms-transition:height 0.3s; -o-transition:height 0.3s; transition:height 0.3s; } 

#lnbBg.on:before { content: ""; position: absolute; left:-15px; bottom:-15px; width: 180px; height: 180px; opacity: 0.1; background: url(/module/upload/file/selectImageView.do?atchFileId=30000003767&fileSn=0); background-repeat: no-repeat; background-size: 1000px; background-position: -823px 1px; } 

.header .inner .btn_wrap { width:auto; float:right; margin-top:15px; } 



/* srchbtn */
.lnb_search { position: absolute; top: 15px; right: 60px; z-index: 999; } 
.lnb_search:after { content: ''; display: block; position: absolute; top: 3px; right: 33px; width: 1px; height: 21px; background: #ccc; } 
.lnb_search .btn_search { float:left; width:30px; height:30px; font-size:0; line-height:0; } 
.lnb_search .btn_search:before { display: inline-block; content: "\f002"; font-family: 'FontAwesome'; font-size: 18px; color:#e46e16; } 

#searchPannel .search_box .search_box_inner { width:100%; height:100%; } 
#searchPannel .search_box .search_box_inner input[type="text"]:focus { outline:auto; outline-color:#ddd; background:#f1f1f1; color:#333; } 


@media (min-width:991px){
 #searchPannel { display: block !important; position: absolute; width: 18%; left: auto; top: 13px; right: 60px; height: 32px; background: transparent; border-bottom: 2px solid #cecece; z-index: 999; } 
#searchPannel .search_box { width:100%; height:100%; } 
#searchPannel .search_box .search_box_inner input[type="text"] { width: 85%; height: 26px; margin: 3px 0 3px 3px; padding: 0 10px; font-size: 15px; background: transparent; border: none; } 
}

@media (max-width:990px){
 #searchPannel { display: block!important; } 
 #searchPannel {position:absolute;top:0;right: 50px;width: calc(100% - 100px);height:50px;line-height:50px;text-align: right;} 
 #searchPannel .search_box .search_box_inner input[type="text"] {width: 95%;} 
 #searchPannel { display: none!important; } 
 #searchPannel.on { display: block!important; } 

 .lnb_search { top:0; right: 10px; } 
 .lnb_search:after { display:none; } 
 .lnb_search .btn_search { height: 51px; } 
 #lnbBg.on { border-top:none; border-bottom:none; } 

}
 @media (min-width:991px) and (max-width:1300px){
 #searchPannel .search_box .search_box_inner input[type="text"] { width: 82%; } 
 #searchPannel { width: 19%; } 



 .lnb_search { margin-right:0; } 
 .lnb { width: 80%; } 
 .lnb > li { padding:0; } 
 .lnb > li > a { font-size: 18px; } 

 .menu .logo { margin-left:15px; } 

}


 @media (max-width:990px) { } 

/* allmenu (sitemap-popup btn) */
.all_menu { position: absolute; right: 0; width: 30px; height: 30px; /*margin-top: 15px; */ margin-right: 15px; z-index: 999; } 
.all_menu .btn_allmenu { display:inline-block; float:left; background:url("/sample/templatehead/img/menuBar_white.png") #f18201 no-repeat center; width:30px; height:30px; text-indent:-9999px; } 
.all_menu .wzpopup-wrap { display:none; } 
.all_menu .wzpopup .pop-container { text-align:left; } 
.all_menu #fade { display:none; } 


 @media (min-width:991px){
 .menu .inner { position:relative; } 
 .fixedhead .menu .inner .all_menu { height:50px; line-height:normal; } 
}
 @media (max-width:990px){
 .all_menu { display:none; } 
 .lnb:hover ~ #lnbBg { display:none !important; } 
 }



.menu ul#m_nav { display:none; } 



/* mobile popup menu design */
.showMenu { width:50px; height:50px; cursor:pointer; background:url("/sample/templatehead/img/menuBar.png")no-repeat center; position:absolute; top:0; left:0; } 

#m_nav { float:left; width:95%; max-width:400px; height:calc(100vh - 100px); overflow-y:scroll; background:#fff; padding:0 0 20px; position:absolute; top:49px; left:0; text-align:left; box-shadow:1px 2px 5px 0px rgba(0,0,0,0.1); box-sizing:border-box; } 
 #m_nav > li { width:100%; float:left; box-sizing:border-box; position:relative; border-bottom:1px solid #f3f3f3; } 
 #m_nav > li > a { width:100%; font-size:14px; float:left; padding:13px 30px 13px 20px; line-height:20px; font-weight:600; display:block; box-sizing:border-box; } 
 #m_nav > li.mnGroup { position:relative; } 
 #m_nav li.mnGroup.selected { border-bottom:none; } 
 #m_nav > li.mnGroup > a:after { content:"\276D"; display:inline-block; transform:rotate(90deg); position:absolute; right:15px; top:13px; } 
 #m_nav li.mnGroup.selected > a:after { transform:rotate(-90deg) !important; margin-right:-2px; } 
 #m_nav li a { color:#333; word-break:keep-all; } 
 #m_nav li > a:hover { color:#2d59b0; } 
 #m_nav li > ul { float:left; background:#f7f7f7; width:100%; } 
 #m_nav li > ul > li { float:left; width:100%; border-bottom:1px solid #eee; } 
 #m_nav li > ul > li.mnGroup > a:after { content:"\276D"; display:inline-block; transform:rotate(90deg); position:absolute; right:15px; top:10px; } 
 #m_nav li > ul > li > a { float:left; width:100%; font-size:13px; padding:11px 20px 11px 25px; height:auto; line-height:18px; position:relative; box-sizing:border-box; } 
 #m_nav li ul li ul { background:#ececec; width:100%; } 
 #m_nav li ul li ul li { border-bottom:1px solid #e3e2e2; } 
 #m_nav li ul li ul li:last-child { border-bottom:none; } 
 #m_nav li ul li ul li a { padding-left:35px; } 

 /* popup login menu */
 #m_nav > li.mobile_gnb, #m_nav > li:last-child { background:#2b2b2b; } 
 #m_nav > li.mobile_gnb ul li, #m_nav > li:last-child ul li { width:33.33%; box-sizing:border-box; float:left; text-align:center; border:1px solid rgba(255,255,255,0.2); border-width:1px 1px 1px 0; margin-top:-1px; line-height:70px; } 
 #m_nav > li.mobile_gnb ul li:nth-child(3n), #m_nav > li:last-child ul li:nth-child(3n) { border-right:none; } 
 #m_nav > li.mobile_gnb ul li:nth-child(3n+1), #m_nav > li:last-child ul li:nth-child(3n+1) { clear:both; } 
 #m_nav > li.mobile_gnb ul li a, #m_nav > li:last-child ul li a { color:#fff; width:100%; line-height:20px; vertical-align:middle; display:inline-block; } 

 #m_nav > li:last-child ul li.link-group { } 
 #m_nav > li:last-child ul li.link-group a:after { display:none; } 
 #m_nav > li:last-child ul li.link-group select { width:92%; background:url(/images/wzwg/cmm/arrow_white.png) no-repeat right 5px center; color:#fff; outline:none; border-radius:2px; line-height:30px; height:30px; border-color:rgba(255,255,255,0.3); } 
 #m_nav > li:last-child ul li.link-group select option { background:white; color:black; } 


 @media (max-width:990px){
 .header { /* display:none; */ } 
 .header ul.gnb { display:none; } 
 .header .inner .btn_wrap { margin-top:0; } 

 ul.lnb { display:none; } 
 .menu { height:50px; padding-top:0; } 
 .menu .inner { padding:0; display:block; height:50px; overflow:hidden; } 

 .menu .logo {width:100%;height:50px;line-height:50px;text-align:center;padding:0 15px;display:block;background:#fff;box-sizing: border-box;} 
 .menu .logo a img {max-height:35px;max-width: 200px;} 
 .showMenu, .menu:hover .showMenu { height:51px; overflow:hidden; } 

 #lnbBg { display:none !important; } 
 }





/* PC ver_ left menu */
 @media all and (min-width:991px) and (max-width:1400px){
 .header .inner { padding:0 15px; } 
 }
 @media all and (min-width:991px) and (max-width:1300px) { /* .menu { border-bottom:1px solid rgba(0,0,0,0.1); } */
 .lnb > li > ul { width:99.8% !important; max-width:1300px; left:50%; transform:translateX(-50%); padding:0 0 0 20%; } 
 }



 @media (min-width:1051px){
 .menu ul#m_nav, .showMenu { display:none !important; } 
 }

 @media (min-width:991px) and (max-width:1050px){
 .menu ul#m_nav, .showMenu { display:none !important; } 

 ul.gnb { padding-left:10px; } 
 }

 @media (min-width:991px){
 .menu { /* height:100px; */box-sizing:border-box; /* margin-top:35px; */ } 
 /* .lnb:before { content:""; width:100%; height:1px; border-bottom: 1px solid rgba(51,51,51,0.2); position:absolute; left:0; margin-top: -2px; } */}


/* fixed setting */
.fixedhead { position:fixed; top:0; background:#fff; box-shadow:0px 0px 5px 2px rgba(0,0,0,0.1); z-index:10; border-top: 0; } 

 @media all and (min-width:991px){
 .fixedhead:hover { box-shadow:0px 0px 3px 0px rgba(0,0,0,0.3); background:#fff; -webkit-transition:box-shadow 500ms, background 500ms, -webkit-transform 500ms; transition:box-shadow 500ms,background 500ms, transform 500ms; } 
 .fixedhead .header .inner { max-width:100%; } 
 .fixedhead .header ul.gnb { display:none; } 
 .fixedhead .header .inner .btn_wrap { /* margin-top:0; */display: none; } 

 .fixedhead .menu { margin-top:0; height:50px; padding-top:0; -webkit-transition:height 500ms, background 500ms, transform 500ms, margin-top 500ms; transition:height 500ms, background 500ms, transform 500ms, margin-top 500ms; } 
 .fixedhead .menu:hover { background:rgba(255,255,255,1); -webkit-transition:background 500ms, -webkit-transform 500ms; transition:background 2s, transform 500ms; } 
 .fixedhead .menu .inner { height:50px; line-height:50px; } 
 .fixedhead .menu .logo { display:inline-block; height:50px; line-height:50px; padding:0 10px; width:auto; max-width:100%; position:absolute; display:none; } 
 .fixedhead .menu .logo a img { max-height:35px; max-width:100%; transform-origin:top; -webkit-transition:max-height 500ms, -webkit-transform 500ms; transition:max-height 500ms, transform 500ms; } 
 .fixedhead .lnb { width:100%; height:50px; margin-top:0; } 
 .fixedhead .lnb:before { display:none; } 
 .fixedhead .lnb > li { border:none; height:50px; line-height:50px; padding-top:0; } 
 .fixedhead .lnb > li > a { height: 50px; line-height: 50px; } 
 .fixedhead .lnb > li > ul { top:51px !important; border-top:none; } 

 .fixedhead #lnbBg.on { top:50px !important; } 
 }
 @media (min-width:991px) and (max-width:1299px){
 .fixedhead .menu .logo { display:none; } 
 .fixedhead .header { right:0; } 
 .fixedhead .header .inner { padding:0; } 
 .fixedhead .header .inner .btn_wrap .lnb_search { width:50px; height:50px; margin-right:-0; border-left:1px solid #ddd; box-sizing:border-box; float:left; } 
 .fixedhead .header .inner .btn_wrap .lnb_search .btn_search:before { margin:10px; } 
 .fixedhead .header .inner .btn_wrap .all_menu { width:50px; height:50px; float:left; } 
 .fixedhead .header .inner .btn_wrap .all_menu .btn_allmenu { width:50px; height:50px; } 
 .fixedhead #searchPannel { right:100px; } 
}


/* lofa : speacial menu text */
.lnb > li > ul span.oneDepth_menuNm { position:absolute; left: 0; font-size: 38px; line-height: 105%; width:300px; margin-top: 20px; padding-left: 15px; font-weight: 600; display: block !important; } 

 @media (min-width:991px) and (max-width:1299px){
 .lnb > li > ul span.oneDepth_menuNm { font-size:32px; width:18%; word-break:break-all; } 
 }