@charset "utf-8"; @import url('../fonts/font.css'); @import url('swiper-bundle.min.css'); @import url('jquery.mCustomScrollbar.css'); @import url('jquery-ui.css'); /* CSS Reset */ body,html, header,footer,aside,nav,section,article,details,figure,figcaption,menu,command, div,dl,dd,ol,ul,li,form,fieldset,legend,iframe,table,caption,thead,tfoot,tbody,tr,th,td, /* Block Element */ h1,h2,h3,h4,h5,h6,dt,summary,input,textarea,button,select,datalist, img,embed,object,canvas,audio,video,meter,progress,keygen, /* Inline Block Element */ a,label,output,dialog, /* Inline Element */ address,blockquote, /* Text Block Element */ p,pre,/* Text Inline Block Element */ span,b,strong,i,em,dfn,var,u,ins,s,del,q,mark,small,sub,sup,abbr,bdi,bdo,cite,time,ruby,rp,rt,code,kbd,samp, /* Text Inline Element */ acronym,big,frame,frameset,noframes,tt, /* Not HTML5 Used Element */ map,option,hr,*{border:0;padding:0;margin:0;color:inherit;font-family:inherit;font-size:inherit;line-height:inherit;vertical-align: baseline;box-sizing:border-box;} header,footer,aside,nav,section,article,details,summary,figure,figcaption,menu,command{display:block} /* HTML5 Block Element */ /* applet,basefont,center,dir,font,strike{display:none} XHTML4, HTML5 Element Not Used Remove */ q,blockquote{quotes:none;content:none} li,menu{list-style:none;word-break:break-all} table{width:100%;border-spacing:0;border-collapse: separate;table-layout: fixed;} caption{text-align:left} th,td{text-align:center;vertical-align:middle} address{font-style:normal} label{display:inline-block;} a{font-family: inherit;text-decoration:none;display:inline-block;} p{margin-block-start: 0; margin-block-end: 0;} /* Common Setting */ html{} html,body{min-width:1400px; width:100%;height:100%;background:#fff;} body {color:#242020;font-family: 'Noto Sans KR', sans-serif; font-weight: normal; font-size:14px; line-height: 20px; letter-spacing: 0; word-spacing: 0;} div{outline:0} /* Script TabIndex Click Focusing Line Remove */ img {vertical-align:middle;} span {display: inline-block;} table {} em {font-style: normal;} input {font-family: inherit;} h1,h2,h3,h4,h5,h6 {font-weight: bold; margin-block-start: 0; margin-block-end: 0;} strong, b {font-weight: bold;} [disabled] {pointer-events: none;} button {font-family: inherit; cursor: pointer; background-color: transparent;} button[disabled], button[readonly] {opacity: .2; cursor: text; outline: 0 none;} input[disabled], input[readonly]{cursor: text; outline: 0 none;} :focus, :active {outline: 0 none;} input:focus::-webkit-input-placeholder {color: transparent;} input:focus::-moz-placeholder {color: transparent;} input:focus:-ms-input-placeholder {color: transparent;} input:focus::-ms-input-placeholder {color: transparent;} ::placeholder {color: #888; font-weight: normal;} ::-webkit-input-placeholder {color: #888; font-weight: normal;} ::-moz-placeholder {color: #888; font-weight: normal;} :-ms-input-placeholder {color: #888; font-weight: normal;} ::-ms-input-placeholder {color: #888; font-weight: normal;} .fc-b {color: #0000FF !important;} .fc-r {color: #FF0000 !important;} .color1 {color: #ec6608 !important;} .color2 {color: #0276b2 !important;} .bg-color1 {background-color: #f8f8f8;} .bg-color2 {background-color: #fffaea;} .hidden {position: absolute; top: -9999px; left: -9999em;} .blind {overflow: hidden; text-indent: -999rem; font-size: 0;} .ff-NSKR {font-family: 'Noto Sans KR', sans-serif;} .td-ul {text-decoration: underline !important;} .tt-u {text-transform: uppercase !important;} .fw-b, .bold {font-weight: bold !important;} .normal {font-weight: normal !important;} .ta-l {text-align: left !important;} .ta-c {text-align: center !important;} .ta-r {text-align: right !important;} .fl {width: auto; float: left !important;} .fr {width: auto; float: right !important;} .clear {clear: both !important;} .flrbox::after {content: ''; display: block; clear: both;} .va-t {vertical-align: top !important;} .va-b {vertical-align: bottom !important;} .full {width: 100% !important;} .w10p {width: 10% !important;} .w20p {width: 20% !important;} .w25p {width: 25% !important;} .w26p {width: 26% !important;} .w28p {width: 28% !important;} .w30p {width: 30% !important;} .w32p {width: 32% !important;} .w33p {width: 33% !important;} .w34p {width: 34% !important;} .w35p {width: 35% !important;} .w40p {width: 40% !important;} .w45p {width: 45% !important;} .w50p {width: 50% !important;} .w55p {width: 55% !important;} .w60p {width: 60% !important;} .w65p {width: 65% !important;} .w70p {width: 70% !important;} .w72p {width: 72% !important;} .w74p {width: 74% !important;} .w75p {width: 75% !important;} .w80p {width: 80% !important;} .w90p {width: 90% !important;} .full, .w100p {width: 100% !important;} .wAuto {width: auto !important;} .w100 {width: 100px;} .w120 {width: 120px;} .w150 {width: 150px;} .w1118 {width: 1118px;} .hAuto {height: auto !important;} .h100p {height: 100% !important;} .pd0 {padding: 0px !important;} .pd10 {padding: 10px !important;} .mgt0 {margin-top: 0px !important;} .mgt3 {margin-top: 3px !important;} .mgt4 {margin-top: 4px !important;} .mgt5 {margin-top: 5px !important;} .mgt7 {margin-top: 7px !important;} .mgt9 {margin-top: 9px !important;} .mgt10 {margin-top: 10px !important;} .mgt11 {margin-top: 11px !important;} .mgt14 {margin-top: 14px !important;} .mgt15 {margin-top: 15px !important;} .mgt16 {margin-top: 16px !important;} .mgt19 {margin-top: 19px !important;} .mgt20 {margin-top: 20px !important;} .mgt30 {margin-top: 20px !important;} .mgt-8 {margin-top: -8px !important;} .mgt-9 {margin-top: -9px !important;} .mgt-110 {margin-top: -110px !important;} .mgl0 {margin-left: 0px !important;} .mgl8 {margin-left: 8px !important;} .mgl9 {margin-left: 9px !important;} .mgl10 {margin-left: 10px !important;} .mgl20 {margin-left: 20px !important;} .mgl25 {margin-left: 25px !important;} .mgr4 {margin-right: 4px !important;} .mgr5 {margin-right: 5px !important;} .mgr8 {margin-right: 8px !important;} .mgr10 {margin-right: 10px !important;} .mgr20 {margin-right: 20px !important;} .mgr25 {margin-right: 25px !important;} .mgb10 {margin-bottom: 10px !important;} .mgb15 {margin-bottom: 15px !important;} .mgb25 {margin-bottom: 25px !important;} .mgb30 {margin-bottom: 25px !important;} .mglr5 {margin-left: 5px !important; margin-right: 5px !important;} .mglr25 {margin-left: 25px !important; margin-right: 25px !important;} .mgtb8 {margin-top: 8px !important; margin-bottom: 8px !important;} .pdl0 {padding-left: 0px !important;} .pdl10 {padding-left: 10px !important;} .pdl15 {padding-left: 15px !important;} .pdr0 {padding-right: 0px !important;} .pdr7 {padding-right: 7px !important;} .pdr10 {padding-right: 10px !important;} .pdt0 {padding-top: 0px !important;} .pdt16 {padding-top: 16px !important;} .pdb0 {padding-bottom: 0px !important;} .pdb14 {padding-bottom: 14px !important;} .pdrl0 {padding-right: 0 !important; padding-left: 0 !important;} .pd0 {padding: 0px !important} .pd5 {padding: 5px !important} .pd8 {padding: 8px !important} .pdtype1 {padding: 29px 42px 26px !important;} .pdtype2 {padding: 39px 42px 49px !important;} .pdtype3 {padding: 29px 33px 28px !important;} .pdtype4 {padding: 13px 20px 10px !important;} .position-r {position: relative !important;} .position-a {position: absolute !important;} .ellipsis1 {display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 100%;} .ellipsis2 {display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 100%; white-space: normal; text-align: left; word-wrap: break-word; display: -webkit-inline-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .dis-b {display: block !important;} .dis-t {display: table !important;} .dis-tc {display: table-cell !important; vertical-align: middle !important;} .dis-ib {display: inline-block !important;} .dis-flexCC {display: flex !important; justify-content: center; align-items: center;} .dis-flex {display: flex !important;} /*************************************************layout*************************************************/ /* html.mainHtml, .mainHtml body {background: #f8f8f8; min-width: 1820px;} */ html.windowPopupHtml, .windowPopupHtml body{min-width: 100%;} #wrap {width: 100%; height: 100%;} .inner {width: 100%; margin: 0 auto; padding: 0 10px;} .inner.type1 {padding: 0;} .btn-topmove {/* display: none; */ width: 50px; height: 50px; padding-top: 23px; border-radius: 50px; text-align: center; background: #666 url(../images/common/ico-top-w.png) center 10px no-repeat; z-index: 3; position: fixed; right: 14px; bottom: -100px; opacity: 0; transition: 1s; } .btn-topmove > span {font-size: 10px; font-weight: 500; line-height: 15px; color: #fff; letter-spacing: 0.05em; padding-left: 2px;} .btn-topmove.show {bottom: 36px; opacity: 1;} /*.mainHtml .btn-topmove {margin-right: -682px;} .mainHtml .btn-topmove.show {bottom: 19px;}*/ .btn-topmove:hover {background-color: #000;} .mainHtml .btn-topmove {right: 229px;} .windowPopupHtml .btn-topmove {right: 4px;} .windowPopupHtml .btn-topmove.show {bottom: 7px;} /*type2 gnb, sitemap 공통*/ .menuIn-tabox {display: flex; flex-direction: row; justify-content: flex-start; align-items: center;} .menuIn-tabox * {line-height: 15px;} .menuIn-tabox .tab-tit {font-size: 14px; font-weight: 500; margin-right: 10px;} .menuIn-tabox .tab-ul {display: flex; align-items: center; justify-content: flex-start; width: auto; height: 100%;} .menuIn-tabox .tab-ul li {margin-right: 5px;} .menuIn-tabox .tab-ul li .tag {min-width: 49px; height: 23px; line-height: 21px; padding: 0 10px; border-radius: 2px; background-color: #bbb; color: #fff; font-size: 13px; display: block; text-align: center;} .menuIn-tabox .tab-ul li .tag:hover {background-color: #aaa;} .menuIn-tabox .tab-ul li.on .tag:hover, .menuIn-tabox .tab-ul li.on .tag {background-color: #3fb17a;} .menuIn-tabox .tab-ul li.on .tag:hover {background-color: #2da76c;} /*header*/ .ico-setting {text-indent: -999rem; width: 28px; height: 28px; background-image: url(../images/common/ico-setting.png);} .ico-mypage {text-indent: -999rem; width: 18px; height: 20px; background-image: url(../images/common/ico-mypage.png);} .ico-noti {text-indent: -999rem; width: 20px; height: 20px; background-image: url(../images/common/ico-noti.png);} .ico-noti2 {text-indent: -999rem; width: 20px; height: 20px; background-image: url(../images/common/ico-noti2.png);} .ico-logout {text-indent: -999rem; width: 21px; height: 21px; background-image: url(../images/common/ico-logout.png);} .ico-favo {text-indent: -999rem; width: 27px; height: 27px; background-image: url(../images/common/ico-favo.png);} .ico-user2 {text-indent: -999rem; width: 20px; height: 20px; background-image: url(../images/common/ico-user2.png);} #wrap:not(.type2) #header {width: 100%; min-width: 1400px; background-color: #fff;} #wrap:not(.type2) #header .header-top .inner {display: inline-flex; align-items: center; font-size: 0; width: 100%; height: 100%; position: relative; padding: 0 10px;} #wrap:not(.type2) #header .header-top .inbox {font-size: 14px; height: 100%; text-align: center;} #header .header-top {height: 42px; border-bottom: 1px solid #ddd;} #header .header-top .gnbbtnbox {width: 63px; margin-left: -18px; padding-top: 8px;} #header .header-top .gnbbtnbox .btn-gnb {text-indent: -999rem; width: 50px; height: 50px; position: relative;} #header .header-top .gnbbtnbox .btn-gnb:hover {background-color: rgba(0,0,0,0.05);} #header .header-top .gnbbtnbox .btn-gnb::before, #header .header-top .gnbbtnbox .btn-gnb::after, #header .header-top .gnbbtnbox .btn-gnb span {content: ''; display: block; width: 20px; height: 2px; position: absolute; top: 50%; left: 50%; margin-left: -10px; background-color: #7f7f7f; transition: .3s;} #header .header-top .gnbbtnbox .btn-gnb::before {margin-top: -6px;} #header .header-top .gnbbtnbox .btn-gnb::after {margin-top: 4px;} #header .header-top .gnbbtnbox .btn-gnb span {margin-top: -1px;} #header .header-top .gnbbtnbox .btn-gnb.on::before {margin-top: 0; transform: rotate(45deg);} #header .header-top .gnbbtnbox .btn-gnb.on::after {margin-top: 0; transform: rotate(-45deg);} #header .header-top .gnbbtnbox .btn-gnb.on span {opacity: 0;} /* .mainHtml #header .header-top .gnbbtnbox {padding-right: 6px;} */ #header .header-top .logobox {width: 72px; padding: 0 6px;} #header .header-top .logobox .logo {text-indent: -999rem; width: 100%; height: 100%; background-image: url(../images/common/logo.png); background-position: 0 center; background-repeat: no-repeat;} /*#header .header-top .logobox .logo:hover {background-color: rgba(0,0,0,0.05);}*/ #header .header-top .logobox {position: relative;} /* #header .header-top .logobox::before {content: ''; display: block; width: 1px; height: 24px; background-color: #ddd; position: absolute; top: 50%; margin-top: -10px; left: -1px;} */ /* #header .header-top .searchbox {width: calc(100% - 682px); position: relative;} */ #header .header-top .searchbox {display: none;} #header .header-top .searchbox .search {width: 450px; text-align: left; background-color: transparent; border: 1px solid transparent; position: absolute; top: -1px; left: 122px; left: 50%; margin-left: -225px; padding: 0 18px; z-index: 4;} #header .header-top .searchbox .search .inputbox {height: 44px; font-size: 0; text-align: left; margin: 0 8px; border-bottom: 1px solid #fff; border-bottom: 1px solid transparent;} #header .header-top .searchbox .search .inputbox .ico, #header .header-top .searchbox .search .inputbox .input, #header .header-top .searchbox .search .inputbox .btn {vertical-align: middle; height: 44px;} #header .header-top .searchbox .search .inputbox .ico {text-indent: -999rem; width: 20px; background: url(../images/common/ico-header-search.png) center center no-repeat; margin-right: 16px;} #header .header-top .searchbox .search .inputbox .input {width: calc(100% - 91px); font-size: 15px; padding-left: 8px; font-weight: 300; background-color: transparent; border-color: transparent;} #header .header-top .searchbox .search .inputbox .btn {width: 34px; height: 34px; text-align: center; background-color: #ccc; border-radius: 20px; padding: 2px 0 0 1px; margin-left: 10px;} #header .header-top .searchbox .search .inputbox .btn > span {font-size: 16px; color: #fff; font-weight: 500; line-height: 26px;} #header .header-top .searchbox .search .resultbox {display: none;} #header .header-top .searchbox .search .resultbox .onoffbox {overflow: hidden; padding: 21px 0 23px; border-bottom: 1px solid #ccc; margin: 0 9px;} #header .header-top .searchbox .search .resultbox .onoffbox .txt1 {float: left; font-size: 16px; color: #666; font-weight: bold; letter-spacing: -0.03em; word-spacing: -0.03em;} #header .header-top .searchbox .search .resultbox .onoffbox .txt2 {font-size: 10px; line-height: 15px; color: #fff; font-weight: bold;} #header .header-top .searchbox .search .resultbox .list {padding: 11px 0;} #header .header-top .searchbox .search .resultbox .list li {position: relative;} #header .header-top .searchbox .search .resultbox .list .link {display: block; padding: 5px 23px 4px 8px;} #header .header-top .searchbox .search .resultbox .list .link:hover {background-color: #eee;} #header .header-top .searchbox .search .resultbox .list .link .txt1, #header .header-top .searchbox .search .resultbox .list .link .txt2 {vertical-align: middle;} #header .header-top .searchbox .search .resultbox .list .link .txt1 {font-size: 14px; color: #333; width: calc(100% - 44px);} #header .header-top .searchbox .search .resultbox .list .link .txt2 {font-size: 12px; color: #999; text-align: center; font-weight: 300; width: 43px;} #header .header-top .searchbox .search .resultbox .list .btn-del {position: absolute; top: 6px; right: 4px;} #header .header-top .searchbox .search .resultbox .list .btn-del {text-indent: -999rem; width: 20px; height: 20px; background-image: url(../images/common/ico-del1.png); background-position: center center; background-repeat: no-repeat;} #header .header-top .searchbox .search .resultbox .list .btn-del:hover {background-color: #eee;} #header .header-top .searchbox .search .inputbox .input:hover {background-color: rgba(0,0,0,0.05);} #header .header-top .searchbox.open .search .inputbox .input:hover {background-color: transparent;} #header .header-top .searchbox.open .search {background-color: #fff; border-color: #ccc; height: auto;} #header .header-top .searchbox.open .search .inputbox {height: 43px; border-color: #666;} #header .header-top .searchbox .search .inputbox .btn:hover, #header .header-top .searchbox.open .search .inputbox .btn {background-color: #666;} #header .header-top .searchbox.open .search .resultbox {display: block; padding-bottom: 11px;} #header .header-top .userbox {position: relative; width: auto; width: 60px; font-size: 0; margin-left: auto;} #header .header-top .userbox::before, #header .header-top .userbox::after {content: ''; display: block; width: 1px; height: 100%; background-color: #ddd; position: absolute; right: 0; top: 0;} #header .header-top .userbox::before {left: 0;} #header .header-top .userbox .btn-mypage {display: block; width: 100%; height: 100%; background-image: url(../images/common/ico-user2.png); background-repeat: no-repeat; background-position: center center; font-size: 0; overflow: hidden; text-indent: -999rem;} #header .header-top .userbox:hover .btn-mypage {background-color: #777b79; background-image: url(../images/common/ico-user2-w.png);} #header .header-top .userbox .ico, #header .header-top .userbox .text {display: inline-block; vertical-align: middle;} #header .header-top .userbox .ico {display: none;} #header .header-top .userbox .ico img {display: none;} #header .header-top .userbox .label-cnt {position: absolute; z-index: 1; min-width: 24px; height: 20px; line-height: 20px; left: 40px; top: 0; margin-top: 6px; padding: 0 5px; background-color: #f75b31; color: #fff; border-radius: 10px; border: 1px solid #fff; font-size: 12px;} #header .header-top .userbox .text {width: calc(100% - 44px); padding-left: 22px; text-align: left;} #header .header-top .userbox .text p {font-size: 14px; color: #666; display: block; letter-spacing: 0.01em; word-spacing: -0.06em; white-space: nowrap;} #header .header-top .userbox .text .txt1 {} #header .header-top .userbox .text .txt2 {color: #333; margin-top: 1px;} #header .header-top .userbox:hover .mypage-layer {display: block;} .mypage-layer {display: none; position: absolute; z-index: 10; width: 240px; right: -1px; margin-top: -1px; background-color: #fff; border: 1px solid #ddd; border-radius: 8px;} .mypage-layer .btn-close {width: 20px; height: 20px; text-indent: -999rem; background: url(../images/common/ico-del1.png) center center no-repeat; margin-left: 5px;} .mypage-layer-top {display: inline-flex; align-items: center; justify-content: space-between; width: 100%; padding: 6px 10px 7px; border-bottom: 1px solid #ddd;} .mypage-layer-top .title {font-size: 13px; font-weight: 700; color: #333;} .mypage-layer-top .btn-ix.debug {margin-left: auto;} .mypage-layer-top .btn-ix.debug + .btn-logout {margin-left: 4px;} .mypage-layer-top .btn-logout {margin-left: auto;} .mypage-layer-top .btn-logout .ico-logout {display: inline-block; width: 18px; height: 18px; background-size: 80% auto;} .mypage-layer-top .btn-logout:hover {background-color: #f5f5f5;} .mypage-layer-info {padding: 6px 10px;} .mypage-layer-info .info {margin-bottom: 4px; font-size: 12px; color: #666; text-align: left;} .mypage-layer-info .info:last-child {margin-bottom: 0;} .mypage-layer-info [onclick].info {} .mypage-layer-info [onclick].info:hover {color: #ed6d00;} .mypage-layer .btn-myInfo {display: flex; width: 100%; align-items: center; padding: 3px 10px 4px; background-color: #666; font-size: 12px; color: #fff;} .mypage-layer .btn-myInfo:hover {background-color: #444;} .mypage-layer .btn-myInfo::before {content: ""; display: inline-block; width: 20px; height: 15px; margin-right: 6px;} .mypage-layer .btn-myInfo.setting::before {content: url(../images/common/ico-setting2.png); width: 14px; height: 14px;} #header .header-top .btnbox {position: relative; display: inline-flex; align-items: center;} #header .header-top .btnbox .btn {display: inline-flex; justify-content: center; align-items: center; text-align: center; position: relative; width: 60px; height: 100%; font-size: 0; overflow: hidden; text-indent: -999rem; background-color: #fff; background-repeat: no-repeat; background-position: center center; border-radius: 0; padding: 0; border: 0;} #header .header-top .btnbox .btn::after {content: ''; display: block; width: 1px; height: 100%; background-color: #ddd; position: absolute; right: 0; top: 0;} #header .header-top .btnbox .btn [class^="ico-"] {width: 30px; height: 30px; background-position: center center; background-repeat: no-repeat;} #header .header-top .btnbox .btn .txt, #header .header-top .btnbox .btn [class^="ico-"] {vertical-align: top;} #header .header-top .btnbox .btn .txt {display: block; font-size: 9px; color: #666; text-transform: uppercase; font-weight: 500; opacity: .7; transform: scale(0.95); margin-top: 2px; text-indent: -999rem; position: absolute; top: -9999px;} #header .header-top .btnbox .btn .noti-num {padding: 0 3px 0 2px; min-width: 12px; background-color: #ec6608; border: 1px solid #fff; border-radius: 12px; position: absolute; top: 21px; left: 33px; display: block; text-align: center;} #header .header-top .btnbox .btn .noti-num em {display: block; color: #fff; font-size: 9px; line-height: 14px;} #header .header-top .btnbox .btn + .btn::before {content: ''; display: block; width: 1px; height: 24px; background-color: #ddd; position: absolute; left: 0; top: 50%; margin-top: -12px;} #header .header-top .btnbox .btn:hover {background-color: #777b79;} #header .header-top .btnbox .btn.setting {background-image: url(../images/common/ico-setting.png);} #header .header-top .btnbox .btn.setting:hover {background-image: url(../images/common/ico-setting-w.png);} #header .header-top #historyTab {background-color: transparent; border-bottom: none;} #header .header-top #historyTab #mainTabs {padding: 15px 5px 0;} /*Atype*/ #wrap.type1 #header .header-top {height: 65px;} #wrap.type1 #header .header-top .logobox {width: 126px; padding: 0 19px; padding: 0 11px;} #wrap.type1 #header .header-top .logobox .logo {background-image: url(../../front/images/login-top-logo1.png);} .gnb-area {float: left; width: 33px; height: 100%; padding-top: 0; margin-left: 0; font-size: 14px; text-align: center;} .btn-gnb {text-indent: -999rem; width: 33px; height: 100%; position: relative;} .btn-gnb:hover {background-color: rgba(0,0,0,0.05);} .btn-gnb::before, .btn-gnb::after, .btn-gnb span {content: ''; display: block; width: 17px; height: 2px; position: absolute; top: 50%; left: 50%; margin-left: -8.5px; background-color: #7f7f7f; transition: .3s;} .btn-gnb::before {margin-top: -6px;} .btn-gnb::after {margin-top: 2px;} .btn-gnb span {margin-top: -2px;} .btn-gnb.on::before {margin-top: 0; transform: rotate(45deg);} .btn-gnb.on::after {margin-top: 0; transform: rotate(-45deg);} .btn-gnb.on span {opacity: 0;} .dim {position: fixed; z-index: 102; top: 64px; bottom: 0; left: 0; right: 0; background-color: rgba(0,0,0,.5);} .gnb-wrap {display: none; position: absolute; z-index: 103; left: 0; right: 0; top: 41px; background-color: #fff; border-top: 1px solid #ddd;} .gnb-box {position: relative; width: 1410px; width: 100%; height: 320px; margin: 0 auto; box-shadow: 0 1px 6px rgba(0,0,0,.2); background: #fff url(../images/common/gnb-line.png) repeat 0 0;} .gnb-box:after {content: ""; display: block; clear: both;} .gnb-box .left-area {position: relative; float: left; width: 100%; height: 320px;} .gnb-box .left-area .menu-list {position: absolute; width: 352px; height: 320px;} .gnb-box .left-area .menu-list .mCSB_container, .gnb-box .left-area .menu-list .mCustomScrollBox {overflow: unset;} .gnb-box .left-area .menu-list ul {height: 320px; max-height: 320px; padding: 9px 0 8px; overflow-y: auto;} .gnb-box .left-area .menu-list .menu-item {position: relative; display: inline-flex; align-items: center; width: 100%; height: 38px; line-height: 38px; padding: 0 12px 0 20px; text-align: left; color: #29313c; font-weight: 500;} .gnb-box .left-area .menu-list .menu-item span {display: inline-block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;} .gnb-box .left-area .menu-list .menu-item span:not(.btn-favorite) {flex: 1; width: calc(100% - 30px);} .gnb-box .left-area .menu-list .menu-item .btn-favorite {width: 15px; margin-left: 10px;} .gnb-box .left-area .menu-list .menu-item [class*="ico-"] {margin: 0 0 0 4px; vertical-align: top;} .gnb-box .left-area .menu-list .menu-list .menu-list .menu-list {width: 351px;} .gnb-box .left-area .menu-list li.on > .menu-item, .gnb-box .left-area .menu-list .menu-item:hover {background-color: #f1f1f1;} .gnb-box .left-area .menu-list li.on > .menu-item span, .gnb-box .left-area .menu-list .menu-item:hover span {color: #f38323;} .gnb-box .left-area .menu-list li.on > [class^="menu-item m"]::before, .gnb-box .left-area .menu-list [class^="menu-item m"]:hover::before {opacity: 1;} .gnb-box .left-area .menu-list li.has-depth.on > .menu-item::after, .gnb-box .left-area .menu-list li.has-depth > .menu-item:hover::after {background-image: url(../images/common/ico-arrow-on.png);} .gnb-box .left-area .menu-list li.has-depth > .menu-item:after {content: ""; position: absolute; right: 13px; top: 50%; margin-top: -5px; width: 6px; height: 10px; background: url(../images/common/ico-arrow-off.png) no-repeat center center;} .gnb-box .left-area .menu-list .menu-list {display: none; top: 0; left: 353px;} .gnb-box .left-area .menu-list .on > .menu-list {display: block;} /* .gnb-box .left-area .menu-list li:not(.has-depth).on .menu-item {background-color: #ffefe4;} */ /* .gnb-box .left-area .menu-list li:not(.has-depth).on .menu-item::after {content: ""; position: absolute; right: 45px; top: 50%; margin-top: -5px; width: 14px; height: 10px; background-image: url(../images/common/ico-check.png) !important;} */ .gnb-box .left-area .menu-list:first-child > ul > li > .menu-item {padding-left: 30px;} .gnb-box .left-area .menu-list:first-child > ul > li > .menu-item::before {content: ""; display: inline-block; width: 22px; height: 22px; margin-right: 12px; background-repeat: no-repeat; background-position: center center;} .gnb-box .left-area .menu-list:first-child > ul > li.menuCD > .menu-item::before {background-image: url(../images/common/ico-menu1-1.png);} .gnb-box .left-area .menu-list:first-child > ul > li.menuBM > .menu-item::before {background-image: url(../images/common/ico-menu1-2.png);} .gnb-box .left-area .menu-list:first-child > ul > li.menuFI > .menu-item::before {background-image: url(../images/common/ico-menu1-3.png);} .gnb-box .left-area .menu-list:first-child > ul > li.menuWM > .menu-item::before {background-image: url(../images/common/ico-menu1-4.png);} .gnb-box .left-area .menu-list:first-child > ul > li.menuTM > .menu-item::before {background-image: url(../images/common/ico-menu1-5.png);} .gnb-box .left-area .menu-list:first-child > ul > li.menuMD > .menu-item::before {background-image: url(../images/common/ico-menu1-6.png);} .gnb-box .left-area .menu-list:first-child > ul > li.menuPT > .menu-item::before {background-image: url(../images/common/ico-menu1-7.png);} .gnb-box .left-area .menu-list .menu-list li.on > .menu-item::before {background-image: url(../images/common/ico-doc-on.png);} .gnb-box .left-area .menu-list .menu-list li.has-depth > .menu-item::before {background-image: url(../images/common/ico-folder-off.png);} .gnb-box .left-area .menu-list .menu-list li.has-depth.on > .menu-item::before {background-image: url(../images/common/ico-folder-on.png);} .btn-favorite {width: 15px; height: 15px; background-image: url(../images/common/ico-favo2-off.png); background-repeat: no-repeat; background-position: center center;} .btn-favorite.on, .btn-favorite:hover {background-image: url(../images/common/ico-favo2-on.png);} /*history tab : table(플러그인)*/ #historyTab {background-color: #f0f0f0; border-bottom: 1px solid #ddd; padding: 0 108px 0 146px; padding: 0; width: 100%; overflow: hidden;} #historyTab #mainTabs {display: inline-flex; width: 100%; text-align: left; padding: 5px 5px 0; background-color: transparent;} #historyTab #mainTabs .btn-top-layer {display: block; width:24px; height:24px; background: url(../images/common/ico-gnbBtn.png) center center no-repeat; position: absolute; right: 124px; top: 8px; cursor:hand;} #historyTab #mainTabs .btn-top-layer:hover {background-color: rgba(0,0,0,.2);} #historyTab #mainTabs .btn-top-layer.off {display: none;} /*5개 이하 메뉴*/ #historyTab #mainTabs.w-type2 table td {width: auto;} #historyTab #mainTabs.w-type2 table td .w2ui-tab {width: 200px;} #historyTab #mainTabs.w-type2 table td.fixed-tab .w2ui-tab {width: 99px;} /* w2ui v1.5용 히스토리탭 */ #historyTab #mainTabs .w2ui-scroll-wrapper {display: inline-flex; align-items: flex-end; flex: 1; width: auto; max-width: 1395px; vertical-align: bottom; width: 100%; padding: 0;} #historyTab #mainTabs .w2ui-scroll-wrapper .w2ui-tab {position: relative; width: 145px; min-width: 145px; font-size: 11px; font-weight: 500; color: #bbb; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border-bottom: none; background-color: #666; padding: 0 8px 0 8px; height: 26px; line-height: 26px; cursor: pointer; z-index: 1; margin: 0 1px 0 0; border: 0 none; border-radius: 8px 8px 0 0; font-family: 'Noto Sans KR', sans-serif;} #historyTab #mainTabs .w2ui-scroll-wrapper .w2ui-tab:hover {background-color: #333; padding-right: 24px;} #historyTab #mainTabs .w2ui-scroll-wrapper .w2ui-tab:hover .w2ui-tab-close {opacity: 1;} #historyTab #mainTabs .w2ui-scroll-wrapper .w2ui-tab.fixed-tab, #historyTab #mainTabs .w2ui-scroll-wrapper .w2ui-tab#tabs_mainTabs_tab_HOME {width: 76px; min-width: 76px; padding-right: 8px; padding-left: 30px; background-color: #3fb17a; color: #fff; text-transform: uppercase;} #historyTab #mainTabs .w2ui-scroll-wrapper .w2ui-tab#tabs_mainTabs_tab_HOME::before {content: ""; position: absolute; top: 50%; left: 10px; margin-top: -6px; width: 12px; height: 12px; margin-right: 6px; background: url(../images/common/ico-home.png) no-repeat center center;} #historyTab #mainTabs .w2ui-scroll-wrapper .w2ui-tab.fixed-tab:hover, #historyTab #mainTabs .w2ui-scroll-wrapper .w2ui-tab#tabs_mainTabs_tab_HOME:hover {background-color: #24ac6a;} #historyTab #mainTabs .w2ui-scroll-wrapper .w2ui-tab .w2ui-tab-close {opacity: 0; text-indent: -999rem; cursor: pointer; width: 16px; height: 16px; position: absolute; top: 50%; right: 8px; margin-top: -8px; background: url(../images/common/ico-del-w.png) no-repeat center center; border-radius: 100%; border-top: none;} #historyTab #mainTabs .w2ui-scroll-wrapper .w2ui-tab .w2ui-tab-close::before {content: none;} #historyTab #mainTabs .w2ui-scroll-wrapper .w2ui-tab .w2ui-tab-close:hover {background-color: rgba(0,0,0,.1);} #historyTab #mainTabs .w2ui-scroll-wrapper .w2ui-tab.active:not(.fixed-tab, #tabs_mainTabs_tab_HOME) {color: #fff; background-color: #f38323;} #historyTab #mainTabs .w2ui-scroll-wrapper .w2ui-tab.active:not(.fixed-tab, #tabs_mainTabs_tab_HOME):hover {background-color: #eb6f02;} #historyTab #mainTabs.w-type2 .w2ui-scroll-wrapper .w2ui-tab {width: 258px; min-width: 258px;} /* .w2ui-tabs .w2ui-scroll-wrapper .w2ui-tabs-right {display: none;} */ /* #historyTab #mainTabs.w-type2 .w2ui-scroll-wrapper .w2ui-tab.fixed-tab {width: 120px;} */ #historyTab #mainTabs.w2ui-tabs .w2ui-tabs-line {display: none;} /* #historyTab #mainTabs .w2ui-scroll-left, #historyTab #mainTabs .w2ui-scroll-right {display: none !important;} */ #historyTab #mainTabs .w2ui-scroll-left, #historyTab #mainTabs .w2ui-scroll-right {position: relative; z-index: 1; width: 22px; height: 22px; box-shadow: none; background-repeat: no-repeat; background-position: center center; background-size: auto; cursor: pointer; border-radius: 100%; border: 1px solid #f5b570; margin-bottom: 6px;} #historyTab #mainTabs .w2ui-scroll-left {background-image: url(../images/common/ico-arrow4L.png); margin-right: 4px;} #historyTab #mainTabs .w2ui-scroll-right {background-image: url(../images/common/ico-arrow4R.png);} #historyTab #mainTabs .w2ui-scroll-left:hover, #historyTab #mainTabs .w2ui-scroll-right:hover {border: 1px solid #da6600;} /*Atype historyTab*/ #wrap.type1 #header .header-top .inner {align-items: flex-end;} #wrap.type1 #header .header-top #historyTab #mainTabs {display: flex;} #wrap.type1 #historyTab #mainTabs .w2ui-scroll-wrapper .w2ui-tab, #wrap.type1 #historyTab #mainTabs.w-type2 .w2ui-scroll-wrapper .w2ui-tab {height: 32px; line-height: 31px; text-align: left; min-width: 130px; width: auto; border: 1px solid #b9b9b9; border-bottom: 0 none; background-color: #fff; color: #666; font-size: 13px; border-radius: 10px 10px 0 0; margin: 0 2px 0 0;} #wrap.type1 #historyTab #mainTabs .w2ui-scroll-wrapper .w2ui-tab#tabs_mainTabs_tab_HOME {width: 105px; min-width: 105px; text-align: center; border: 3px solid #e27d26; border-bottom: 0 none; background-color: #ed6d00; color: #fff; padding-left: 8px; text-transform: capitalize; line-height: 28px;} #wrap.type1 #historyTab #mainTabs .w2ui-scroll-wrapper .w2ui-tab#tabs_mainTabs_tab_HOME::before {background-image: url(../images/layout/ico-home4.png); position: relative; left: auto; top: auto; margin-top: 0; width: 14px; height: 12px; display: inline-block;} #wrap.type1 #historyTab #mainTabs .w2ui-scroll-wrapper .w2ui-tab.active:not(.fixed-tab, #tabs_mainTabs_tab_HOME) {border-width: 3px; border-color: #ed6d00; line-height: 28px; color: #ed6d00;} #wrap.type1 #historyTab #mainTabs .w2ui-scroll-wrapper .w2ui-tab.active:not(.fixed-tab, #tabs_mainTabs_tab_HOME):hover {background-color: #ed6d00; color: #fff;} #wrap.type1 #historyTab #mainTabs .w2ui-scroll-wrapper .w2ui-tab .w2ui-tab-close {background-image: url(../images/layout/ico-tabDel.png); background-size: 8px auto;} #wrap.type1 #historyTab #mainTabs .w2ui-scroll-wrapper .w2ui-tab.active:not(.fixed-tab, #tabs_mainTabs_tab_HOME):hover .w2ui-tab-close {background-image: url(../images/layout/ico-tabDel-over.png); margin-top: -10px;} #wrap.type1 #historyTab #mainTabs .w2ui-scroll-wrapper .w2ui-tab:not(.fixed-tab, #tabs_mainTabs_tab_HOME):hover {padding-right: 28px; color: #ed6d00;} #wrap.type1 #historyTab #mainTabs .w2ui-scroll-wrapper {max-width: 1325px; overflow: hidden;} #wrap.type1 #historyTab #mainTabs.w-type2 .w2ui-scroll-wrapper .w2ui-tab:not(#tabs_mainTabs_tab_HOME) {width: 238px; min-width: 238px;} /*New history Tab*/ #historyTab.gnbTab-new .fc-tab > li i[ref=pin], #historyTab.gnbTab-new .fc-tab > li i[ref=drag-bar], #historyTab.gnbTab-new .fc-tab > li i[ref=expand], #historyTab.gnbTab-new .fc-tab > li i[ref=refresh], #historyTab.gnbTab-new .fc-tab > li i[ref=close] {display: none !important;} #historyTab.gnbTab-new .fc-tab > li:hover i[ref=pin], #historyTab.gnbTab-new .fc-tab > li:hover i[ref=drag-bar], #historyTab.gnbTab-new .fc-tab > li:hover i[ref=expand], #historyTab.gnbTab-new .fc-tab > li:hover i[ref=refresh], #historyTab.gnbTab-new .fc-tab > li:hover i[ref=close] {display: inherit !important;} #historyTab.gnbTab-new .fc-tab > li i[ref=pin]:not(.fa-rotate-180) {display: inherit !important;} #historyTab.gnbTab-new #mainTabs {display: flex; justify-content: space-between; align-items: flex-end;} #historyTab.gnbTab-new .fc-tab > li i[ref="refresh"], #historyTab.gnbTab-new .fc-tab > li:hover i[ref="refresh"] {display: none !important;} #historyTab.gnbTab-new .btn-allClose {width: 34px; height: 29px; background: url(../images/layout/ico-gTab-allClose.png) center center no-repeat; border-radius: 3px;} #historyTab.gnbTab-new .btn-allClose:hover {background-color: rgba(0, 0, 0, 0.05);} #historyTab.gnbTab-new .btn-tabPrev, #historyTab.gnbTab-new .btn-tabNext {width: 30px; height: 30px; border-radius: 15px; background-color: #fff; background-position: center center; background-repeat: no-repeat; background-repeat: no-repeat;} #historyTab.gnbTab-new .btn-tabPrev {background-image: url(../../front/images/ico/ico-npP-off.png);} #historyTab.gnbTab-new .btn-tabNext {background-image: url(../../front/images/ico/ico-npN-off.png);} #historyTab.gnbTab-new .btn-tabPrev:hover {background-image: url(../../front/images/ico/ico-npP-on.png);} #historyTab.gnbTab-new .btn-tabNext:hover {background-image: url(../../front/images/ico/ico-npN-on.png);} #historyTab.gnbTab-new .fas.fa-thumbtack::before, #historyTab.gnbTab-new .fas.fa-bars::before, #historyTab.gnbTab-new .fas.fa-expand::before, #historyTab.gnbTab-new .fas.fa-times::before {background-position: center center; background-repeat: no-repeat;} #historyTab.gnbTab-new .fas.fa-thumbtack.fa-rotate-180::before {background-image: url(../images/layout/ico-gTab-fix.png); background-position-y: 60%; transform: rotate(180deg);} #historyTab.gnbTab-new .fas.fa-thumbtack:not(.fa-rotate-180)::before {background-image: url(../images/layout/ico-gTab-fixOn.png);} #historyTab.gnbTab-new .fas.fa-bars::before {background-image: url(../images/layout/ico-gTab-move.png);} #historyTab.gnbTab-new .fas.fa-expand::before {background-image: url(../images/layout/ico-gTab-zoom.png);} #historyTab.gnbTab-new .fas.fa-times::before {background-image: url(../images/layout/ico-gTab-close.png);} #historyTab.gnbTab-new .fc-tab-left-control, #historyTab.gnbTab-new .fc-tab-right-control{align-items: center;} #historyTab.gnbTab-new .fc-tab-left-control .fas, #historyTab.gnbTab-new .fc-tab-right-control .fas {width: 18px; height: 20px; margin: 0 !important; border-radius: 3px;} #historyTab.gnbTab-new .fc-tab-left-control .fas::before, #historyTab.gnbTab-new .fc-tab-right-control .fas::before {content: ''; width: 100%; height: 100%; display: block;} #historyTab.gnbTab-new .fc-tab-left-control .fas:hover, #historyTab.gnbTab-new .fc-tab-right-control .fas:hover {background-color: rgba(0, 0, 0, 0.2);} #historyTab.gnbTab-new [class*="fc-tab"] {display: inline-flex; position: relative; padding: 0; background: transparent;} #historyTab.gnbTab-new [class*="fc-tab"] li {display: flex; justify-content: space-between; white-space: nowrap; cursor: pointer; align-items: center; box-sizing: border-box; height: 32px; line-height: 17px; text-align: left; min-width: 130px; width: auto; border: 1px solid #b9b9b9; border-bottom: 0 none; background-color: #fff; color: #666; font-size: 13px; font-weight: 500; border-radius: 10px 10px 0 0; margin: 0 4px 0 0; padding: 0 8px;} #historyTab.gnbTab-new [class*="fc-tab"] li .title {flex: 1; font-size: inherit; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} #historyTab.gnbTab-new .fc-tab {flex: 1; width: calc(100% - 141px); width: calc(100% - 210px); overflow: hidden;} #historyTab.gnbTab-new .fc-tab li {width: 238px; min-width: 238px; width: auto; min-width: 130px; min-width: calc(10% - 4px); max-width: 238px; /*flex: 1;*/} #historyTab.gnbTab-new .fc-tab li:not([style*="width"]) {flex: 1;} #historyTab.gnbTab-new .fc-tab li .title {padding: 0 6px;} #historyTab.gnbTab-new .fc-tab-main li {width: 108px; min-width: 108px; border-width: 3px; border-color: #e27d26; border-bottom: 0 none; background-color: #ed6d00 !important; color: #fff; height: 32px !important;} #historyTab.gnbTab-new .fc-tab-main li .title {text-align: center; color: #fff !important; margin-left: 0 !important;} #historyTab.gnbTab-new .fc-tab-main li .title::before {content: url(../images/layout/ico-home4.png); width: 14px; height: 12px; display: inline-block; margin-right: 6px;} #historyTab.gnbTab-new .fc-tab-main li .fc-tab-right-control {display: none;} #historyTab.gnbTab-new .fc-tab li.selected {border-width: 3px; border-color: #ed6d00; line-height: 17px; color: #ed6d00; background-color: #fff !important;} #historyTab.gnbTab-new .fc-tab li.hover, #historyTab.gnbTab-new .fc-tab li:hover, #historyTab.gnbTab-new .fc-tab li.selected.hover, #historyTab.gnbTab-new .fc-tab li.selected:hover {border-color: #e27d26; background-color: #ed6d00 !important; color: #fff;} #historyTab.gnbTab-new .fc-tab li.hover .fas.fa-thumbtack.fa-rotate-180:before, #historyTab.gnbTab-new .fc-tab li:hover .fas.fa-thumbtack.fa-rotate-180::before, #historyTab.gnbTab-new .fc-tab li.selected .fas.fa-thumbtack.fa-rotate-180::before {background-image: url(../images/layout/ico-gTabOn-fix.png);} #historyTab.gnbTab-new .fc-tab li.hover .fas.fa-bars::before, #historyTab.gnbTab-new .fc-tab li:hover .fas.fa-bars::before, #historyTab.gnbTab-new .fc-tab li.selected .fas.fa-bars::before {background-image: url(../images/layout/ico-gTabOn-move.png);} #historyTab.gnbTab-new .fc-tab li.hover .fas.fa-expand::before, #historyTab.gnbTab-new .fc-tab li:hover .fas.fa-expand::before, #historyTab.gnbTab-new .fc-tab li.selected .fas.fa-expand::before {background-image: url(../images/layout/ico-gTabOn-zoom.png);} #historyTab.gnbTab-new .fc-tab li.hover .fas.fa-times::before, #historyTab.gnbTab-new .fc-tab li:hover .fas.fa-times::before, #historyTab.gnbTab-new .fc-tab li.selected .fas.fa-times::before {background-image: url(../images/layout/ico-gTabOn-close.png);} #historyTab.gnbTab-new .fc-tab li.hover .title, #historyTab.gnbTab-new .fc-tab li:hover .title {max-width: calc(100% - 72px);} #historyTab.gnbTab-new .right {white-space: nowrap; display: inline-flex; justify-content: flex-end; align-items: center; height: 32px;} /*content*/ #mainTabsContent.content {width: 100% !important; min-width: 100% !important;} /* #contents, .pop-cont {font-family: 'Malgun Gothic', '맑은 고딕','arial', dotum, '돋움', sans-serif;} */ #contents {width: 100%; min-width: 1400px; position: relative;} #contents .cont-lc-area {position: relative;} .cont-lc-area .lc-rightbox .tab-content, .cont-lc-area .lc-rightbox .fc-tab-content-item {flex: 1; display: flex; flex-direction: column; justify-content: flex-start; align-items: stretch;} .cont-lc-area .lc-rightbox .fc-tab-content {width: 100%; height: 100%;} /* old lnb */ .cont-lc-area:not(.type2) {font-size: 0;} .cont-lc-area:not(.type2) .lc-leftbox, .cont-lc-area:not(.type2) .lc-rightbox {font-size: 14px; display: inline-block; vertical-align: top; position: relative; box-sizing: border-box;} .cont-lc-area:not(.type2) .lc-leftbox {width: 225px; font-family: 'Noto Sans KR', sans-serif; position: fixed; top: 74px; bottom: 0; left: 0; transition: left .3s;} .cont-lc-area:not(.type2) .lc-leftbox.fix {top: 0;} .cont-lc-area:not(.type2) .lc-leftbox .lc-target {width: 225px; height: 100%;} .cont-lc-area:not(.type2) .lc-rightbox {width: 100%; padding-top: 10px; padding-left: 255px; padding-right: 30px; padding-bottom: 20px; display: flex; flex-direction: column; justify-content: flex-start; align-items: stretch; background-color: #fff;} .cont-lc-area:not(.type2) .lc-leftbox {z-index: 1; font-family: 'Noto Sans KR', sans-serif;} .cont-lc-area:not(.type2).leftHide .lc-leftbox {left: -225px;} .cont-lc-area:not(.type2).leftHide .lc-leftbox .lnb-area .depth-list1, .cont-lc-area:not(.type2).leftHide .lc-leftbox .lnb-area .depth-list1::before, .cont-lc-area:not(.type2).leftHide .lc-leftbox .lnb-area .depth-list2 {left: -225px;} .cont-lc-area:not(.type2).leftHide .lc-rightbox {width: 100%; padding-left: 36px;} .cont-lc-area:not(.type2).leftHideFix .lc-leftbox {display: none;} .cont-lc-area:not(.type2).leftHideFix .lc-rightbox {width: 100%; padding-left: 10px;} #contents .cont-lc-area:not(.type2) .lc-rightbox.noleft {padding: 0;} .cont-lc-area:not(.type2) .btn-lc {position: absolute; z-index: 10; top: 14px; right: -23px; width: 25px; height: 54px; border-radius: 0; border: 0; z-index: 1; background: url(../images/common/btn-lc.png) no-repeat 0 0;} .cont-lc-area:not(.type2) .btn-lc::before {content: ""; position: absolute; width: 7px; height: 9px; margin-left: -3px; margin-top: -5px; background: url(../images/common/ico-arrow3.png) no-repeat center center; transform: rotate(180deg);} .cont-lc-area:not(.type2).leftHide .btn-lc {border-left: 1px solid #d9d9d9;} .cont-lc-area:not(.type2).leftHide .btn-lc::before {transform: rotate(0deg);} .cont-lc-area:not(.type2) .lnb-area .lnb-list .link, .cont-lc-area:not(.type2) .lnb-area .dep2-list > .list > .link {position: relative; display: block; font-size: 13px; color: #666; line-height: 14px; letter-spacing: -0.06em; word-spacing: -0.005em; padding: 2px 16px 2px 10px;} .cont-lc-area:not(.type2) .lnb-area .lnb-list .link::before, .cont-lc-area:not(.type2) .lnb-area .dep2-list > .list > .link::before {content: ''; position: absolute; width: 3px; height: 3px; border-radius: 100%; background-color: #b3b2b2; left: 2px; top: 50%; margin-top: -2px;} .cont-lc-area:not(.type2) .lnb-area a.link:hover {color: #f38323 !important;} .cont-lc-area:not(.type2) .lnb-area a.link:hover::before {background-image: url(../images/common/ico-file-on.png);} .cont-lc-area:not(.type2) .lnb-area .lnb-list .link, .cont-lc-area:not(.type2) .lnb-area .dep2-list > .list.on > .link {color: #f38323;} .cont-lc-area:not(.type2) .lnb-area .lnb-list div.link, .cont-lc-area:not(.type2) .lnb-area .dep1-list > .list > .link {position: relative; padding-left: 35px; font-size: 15px; line-height: 20px; font-weight: bold; color: #666; padding-top: 4px; padding-bottom: 4px;} .cont-lc-area:not(.type2) .lnb-area .dep1-list > .list > .link::before {content: ''; position: absolute; width: 21px; height: 21px; left: 5px; top: 50%; margin-top: -10px; border-radius: 100%; background-color: #f38323; background-repeat: no-repeat; background-position: center center;} .cont-lc-area:not(.type2) .lnb-area .dep1-list > .list > .link.menuCD::before {background-image: url(../images/common/ico-menu2-1.png);} .cont-lc-area:not(.type2) .lnb-area .dep1-list > .list > .link.menuBM::before {background-image: url(../images/common/ico-menu2-2.png);} .cont-lc-area:not(.type2) .lnb-area .dep1-list > .list > .link.menuFI::before {background-image: url(../images/common/ico-menu2-3.png);} .cont-lc-area:not(.type2) .lnb-area .dep1-list > .list > .link.menuWM::before {background-image: url(../images/common/ico-menu2-4.png);} .cont-lc-area:not(.type2) .lnb-area .dep1-list > .list > .link.menuTM::before {background-image: url(../images/common/ico-menu2-5.png);} .cont-lc-area:not(.type2) .lnb-area .dep1-list > .list > .link.menuMD::before {background-image: url(../images/common/ico-menu2-6.png);} .cont-lc-area:not(.type2) .lnb-area .dep1-list > .list > .link.menuPT::before {background-image: url(../images/common/ico-menu2-7.png);} .btn-fold {position: absolute; right: 0; top: 50%; margin-top: -10px; width: 20px; height: 20px; background: url(../images/common/ico-arrow2.png) no-repeat center center; font-size: 0; text-indent: -999rem; overflow: hidden; transform: rotate(180deg);} .btn-fold.off {transform: rotate(0deg);} .cont-lc-area:not(.type2) .lnb-area .lnb-list {height: calc(100% - 64px); padding: 4px 0 8px; overflow: hidden; background-color: #fff;} .cont-lc-area:not(.type2) .lnb-area .lnb-list .dep1-list {padding: 0 8px;} .cont-lc-area:not(.type2) .lnb-area .lnb-list .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {opacity: 0;} .cont-lc-area:not(.type2) .lnb-area .lnb-list:hover .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {opacity: 1;} .cont-lc-area:not(.type2) .lnb-area .lnb-list .list {position: relative;} .cont-lc-area:not(.type2) .lnb-area .lnb-list .list > ul {display: none; display: block; padding-left: 2px; padding-right: 0;} .cont-lc-area:not(.type2) .lnb-area .lnb-list .list.on > ul {display: block;} .cont-lc-area:not(.type2) .lnb-area .lnb-list .toggle {text-indent: -999rem; width: 20px; height: 20px; position: absolute; top: 0; right: 0;} .cont-lc-area:not(.type2) .lnb-area .lnb-list .toggle:hover {background-color: rgba(0,0,0,0.05);} .cont-lc-area:not(.type2) .lnb-area .lnb-list .toggle::before {content: ''; display: block; width: 10px; height: 6px; background: url(../images/common/ico-lnb-arrow.png) 0 0 no-repeat; position: absolute; top: 50%; left: 50%; margin: -3px 0 0 -5px; transform: rotate(180deg);} .cont-lc-area:not(.type2) .lnb-area .lnb-list .toggle.on::before {background-position: 0 100%; transform: rotate(0deg);} .cont-lc-area:not(.type2) .lnb-area .lnb-list .del {text-indent: -999rem; width: 14px; height: 14px; position: absolute; top: 50%; right: 0; z-index: 1; margin-top: -7px;} .cont-lc-area:not(.type2) .lnb-area .lnb-list .del:hover {background-color: rgba(0,0,0,0.05);} .cont-lc-area:not(.type2) .lnb-area .lnb-list .del::before {content: ''; display: block; width: 8px; height: 8px; background: url(../images/common/ico-lnb-del.png) 0 0 no-repeat; position: absolute; top: 50%; left: 50%; margin: -4px 0 0 -4px;} .cont-lc-area:not(.type2) .lnb-area .lnb-list .list.on > .del::before {background-position: 0 100%;} .cont-lc-area:not(.type2) .lnb-area .lnb-list .del + .link {width: calc(100% - 20px);} .cont-lc-area:not(.type2) .lnb-area .lnb-list div + ul {padding-top: 12px; margin-top: 5px; border-top: 1px solid #ccc;} .cont-lc-area:not(.type2) .lnb-area .lnb-list .dep1-list > .list + .list {border-top: 1px solid #ccc; margin-top: 12px; padding-top: 4px;} .cont-lc-area:not(.type2) .lnb-area .lnb-list .dep1-list > .list.divHide + .list {margin-top: 4px;} .cont-lc-area:not(.type2) .lnb-area .lnb-list .dep2-list > .list + .list {margin-top: 3px;} .cont-lc-area:not(.type2) .lnb-area {width: 100%; height: 100%; border-right: 1px solid #ccc; background-color: #eee; overflow: hidden;} .cont-lc-area:not(.type2) .lnb-area .lnb-tit {position: relative; display: flex; flex-direction: row; width: 100%; height: 40px; justify-content: start; align-items: center; border-bottom: 1px solid #ccc; background-color: #eee;} .cont-lc-area:not(.type2) .lnb-area .lnb-tit .title {position: relative; display: inline-flex; align-items: center; font-size: 16px; line-height: 22px; color: #666; font-weight: bold; padding-left: 12px; margin-bottom: 2px;} .cont-lc-area:not(.type2) .lnb-area .lnb-tit .title::before {content: ""; display: inline-block; width: 20px; height: 22px; margin-right: 8px; background: url(../images/common/ico-favo3.png) no-repeat center center;} .cont-lc-area:not(.type2) .lnb-area .lnb-tit .fixSet-box {position: absolute; right: 10px; top: 50%; margin-top: -8px;} .cont-lc-area:not(.type2) .lnb-area .lnb-tit .fixSet-box .btn-onoff {padding-left: 18px; width: 40px; height: 16px;} .cont-lc-area:not(.type2) .lnb-area .lnb-tit .fixSet-box .btn-onoff .txt2 {display: block; font-size: 10px; line-height: 12px; color: #fff; font-weight: bold;} .cont-lc-area:not(.type2) .lnb-area .lnb-tit .fixSet-box .btn-onoff {background-color: #f38323;} .cont-lc-area:not(.type2) .lnb-area .lnb-tit .fixSet-box .btn-onoff::after {left: 4px; width: 10px; height: 10px;} .cont-lc-area:not(.type2) .lnb-area .depth-list1 {position: fixed; left: 0; width: 224px; height: calc(100% - 85px); transition: left .3s; overflow: hidden; background-color: #eee;} /* .cont-lc-area:not(.type2) .lnb-area .depth-list1::before {content: ""; opacity: 0; transition: .3s;} */ /* .cont-lc-area:not(.type2) .lnb-area .depth-list1.open::before {position: fixed; z-index: 1; top: 159px; bottom: 0; left: 0; width: 244px; height: 100%; background-color: rgba(0, 0, 0, .4); opacity: 1;} */ .cont-lc-area:not(.type2) .lnb-area .depth-list-inner {position: absolute; z-index: 2; top: 0; left: 235px; width: 184px; height: 100%; background-color: #fff; transition: .3s; box-shadow: 0px 0 8px 0 rgba(0, 0, 0, 0.6);} .cont-lc-area:not(.type2) .lnb-area .depth-list-inner .list > .scrollY {position: absolute; width: 100%; height: calc(100% - 49px);} .cont-lc-area:not(.type2) .lnb-area .depth-list1.open > .list.on > .depth-list-inner {left: 40px;} .cont-lc-area:not(.type2) .lnb-area .depth-list1 > .list > .link, .cont-lc-area:not(.type2) .lnb-area .depth-list-inner > .list > .link {position: relative; display: flex; flex-direction: row; align-items: center; padding: 10px 10px 10px 40px; flex: 1; font-size: 15px; line-height: 20px; font-weight: bold; color: #666; background-color: #fff;} .cont-lc-area:not(.type2) .lnb-area .depth-list1 > .list > .link::before, .cont-lc-area:not(.type2) .lnb-area .depth-list-inner > .list > .link::before {content: ''; position: absolute; width: 21px; height: 21px; left: 10px; top: 50%; margin-top: -10px; border-radius: 100%; background-color: #f38323; background-repeat: no-repeat; background-position: center center;} .cont-lc-area:not(.type2) .lnb-area .depth-list1 > .list > .link::after {content: ""; position: absolute; right: 10px; top: 50%; margin-top: -10px; width: 20px; height: 20px; background: url(../images/common/ico-arrow2.png) no-repeat center center; font-size: 0; text-indent: -999rem; overflow: hidden; transform: rotate(-90deg);} .cont-lc-area:not(.type2) .lnb-area .depth-list-inner > .list > .link .btn-back {display: flex; flex-direction: row; align-items: center; height: 20px; margin-left: auto; font-size: 12px; font-weight: 400; letter-spacing: 0;} .cont-lc-area:not(.type2) .lnb-area .depth-list-inner > .list > .link .btn-back::after {content: ""; display: inline-block; width: 20px; height: 20px; background: url(../images/common/ico-arrow-on.png) no-repeat center 5px; transform: rotate(180deg);} .cont-lc-area:not(.type2) .lnb-area .depth-list-inner > .list > .link .btn-back:hover {color: #f38323;} .cont-lc-area:not(.type2) .lnb-area .depth-list .link.menuCD::before {background-image: url(../images/common/ico-menu2-1.png);} .cont-lc-area:not(.type2) .lnb-area .depth-list .link.menuBM::before {background-image: url(../images/common/ico-menu2-2.png);} .cont-lc-area:not(.type2) .lnb-area .depth-list .link.menuFI::before {background-image: url(../images/common/ico-menu2-3.png);} .cont-lc-area:not(.type2) .lnb-area .depth-list .link.menuWM::before {background-image: url(../images/common/ico-menu2-4.png);} .cont-lc-area:not(.type2) .lnb-area .depth-list .link.menuTM::before {background-image: url(../images/common/ico-menu2-5.png);} .cont-lc-area:not(.type2) .lnb-area .depth-list .link.menuMD::before {background-image: url(../images/common/ico-menu2-6.png);} .cont-lc-area:not(.type2) .lnb-area .depth-list .link.menuPT::before {background-image: url(../images/common/ico-menu2-7.png);} .cont-lc-area:not(.type2) .lnb-area .depth-list1.open .list:not(.on) > .link::before {background-color: #999;} .cont-lc-area:not(.type2) .lnb-area .depth-list-inner > .list > .link {padding-left: 10px; padding-right: 3px;} .cont-lc-area:not(.type2) .lnb-area .depth-list-inner > .list > .link::before {content: none;} .cont-lc-area:not(.type2) .lnb-area .depth-list-inner .depth-list .list {position: relative;} .cont-lc-area:not(.type2) .lnb-area .depth-list-inner .depth-list .list > .link {display: flex; flex-direction: row; font-size: 13px; padding: 8px 0; flex: 1; line-height: 1.2; word-break: keep-all;} .cont-lc-area:not(.type2) .lnb-area .depth-list-inner .depth-list .list.has-depth > .link {position: relative; font-weight: 500;} .cont-lc-area:not(.type2) .lnb-area .depth-list-inner .depth-list .list.has-depth > .link::before {content: ""; position: absolute; left: inherit; top: 50%; margin-top: -5px; right: 14px; width: 2px; height: 10px; background-color: #666; background-image: none !important; transition: .3s; transform: rotate(90deg); opacity: 0;} .cont-lc-area:not(.type2) .lnb-area .depth-list-inner .depth-list .list.has-depth.close > .link::before {transform: rotate(0deg); opacity: 1;} .cont-lc-area:not(.type2) .lnb-area .depth-list-inner .depth-list .list.has-depth > .link::after {content: ""; position: absolute; left: inherit; top: 50%; margin-top: -1px; right: 10px; width: 10px; height: 2px; background-color: #666;} .cont-lc-area:not(.type2) .lnb-area .depth-list-inner .depth-list .list:not(.has-depth) > .link {color: #666;} .cont-lc-area:not(.type2) .lnb-area .depth-list-inner .depth-list .list:not(.has-depth) > .link::before {content: ''; position: absolute; width: 3px; height: 3px; border-radius: 100%; background-color: #b3b2b2; left: 22px; top: 50%; margin-top: -2px;} .cont-lc-area:not(.type2) .lnb-area .depth-list .list {border-bottom: 1px solid #ddd;} .cont-lc-area:not(.type2) .lnb-area .depth-list .list .del {text-indent: -999rem; width: 14px; height: 14px; position: absolute; top: 50%; right: 6px; z-index: 1; margin-top: -7px;} .cont-lc-area:not(.type2) .lnb-area .depth-list .list .del:hover {background-color: rgba(0,0,0,0.05);} .cont-lc-area:not(.type2) .lnb-area .depth-list .list .del::before {content: ''; display: block; width: 8px; height: 8px; background: url(../images/common/ico-lnb-del.png) 0 0 no-repeat; position: absolute; top: 50%; left: 50%; margin: -4px 0 0 -4px;} .cont-lc-area:not(.type2) .lnb-area .depth-list .list .del + .link {width: calc(100% - 26px);} .cont-lc-area:not(.type2) .lnb-area .depth-list-inner .depth-list .list.has-depth > .link {border-bottom: 1px solid #ddd;} .cont-lc-area:not(.type2) .lnb-area .depth-list-inner .depth-list .list.has-depth {border-bottom: 0;} .cont-lc-area:not(.type2) .lnb-area .depth-list-inner .depth-list2 > .list > .link, .cont-lc-area:not(.type2) .lnb-area .depth-list-inner .depth-list3 > .list > .link {padding-left: 10px;} .cont-lc-area:not(.type2) .lnb-area .depth-list-inner .depth-list2 > .list > .link {font-weight: 700 !important; color: #333 !important;} .cont-lc-area:not(.type2) .lnb-area .depth-list-inner .depth-list2 .list:not(.has-depth) > .link::before {content: none;} .cont-lc-area:not(.type2) .lnb-area .depth-list-inner .depth-list3 .list:not(.has-depth) > .link {padding: 8px 0 8px 30px;} .cont-lc-area:not(.type2) .lnb-area .depth-list-inner .depth-list3 .list.has-depth > .link::before {width: 1px; height: 9px; margin-top: -4.5px;} .cont-lc-area:not(.type2) .lnb-area .depth-list-inner .depth-list3 .list.has-depth > .link::after {height: 1px; width: 9px; margin-top: -0.5px;} .cont-lc-area:not(.type2) .lnb-area .lnb-search {display: flex; flex-direction: row; align-items: center; padding: 10px; background-color: #fff; border-bottom: 1px solid #ccc;} .cont-lc-area:not(.type2) .lnb-area .lnb-search .insearch-box {flex: 1; justify-content: start;} .cont-lc-area:not(.type2) .lnb-area .lnb-search .has-clear .btn-del {right: 1px;} .cont-lc-area:not(.type2) .lnb-area .lnb-search .has-clear .btn-del:hover {background-color: #f5f5f5;} .cont-lc-area:not(.type2) .lnb-area .lnb-search .btn.search {display: inline-flex; align-items: center; height: 24px; border-radius: 0;} /* new lnb - type2 (Atype) */ .cont-lc-area.type2 {font-size: 0;} .cont-lc-area.type2 .lc-leftbox, .cont-lc-area.type2 .lc-rightbox {font-size: 14px; display: inline-block; vertical-align: top; position: relative; box-sizing: border-box;} .cont-lc-area.type2 .lc-leftbox {width: 69px; font-family: 'Noto Sans KR', sans-serif; position: sticky; top: 65px; top: 0; bottom: 0; left: 0; transition: .6s;} .cont-lc-area.type2 .lc-leftbox.fix {top: 0;} .cont-lc-area.type2 .lc-leftbox .lc-target {height: 100%;} .cont-lc-area.type2 .lc-rightbox {width: 100%; padding-top: 10px; padding-right: 30px; padding-bottom: 20px; display: flex; flex-direction: column; justify-content: flex-start; align-items: stretch; background-color: #fff; flex: 1; display: inline-flex; width: calc(100% - 82px); margin-left: 13px; transition: all .6s;} .cont-lc-area.type2 .lc-leftbox {z-index: 5; font-family: 'Noto Sans KR', sans-serif;} .cont-lc-area.type2 .lc-leftbox.abs {position: absolute; top: 0; position: sticky;} .cont-lc-area.type2.open .lc-rightbox, .cont-lc-area.type2.leftFix .lc-rightbox {margin-left: 183px; width: calc(100% - 252px); margin-left: 212px; width: calc(100% - 281px);} .cont-lc-area.type2.leftHideFix .lc-leftbox {display: none;} .cont-lc-area.type2.leftHideFix .lc-rightbox {width: 100%; padding-left: 30px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-list .link, .cont-lc-area.type2 .lc-leftbox .lnb-area .dep2-list > .list > .link {position: relative; display: block; font-size: 13px; color: #666; line-height: 14px; letter-spacing: -0.06em; word-spacing: -0.005em; padding: 2px 16px 2px 10px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-list .link::before, .cont-lc-area.type2 .lc-leftbox .lnb-area .dep2-list > .list > .link::before {content: ''; position: absolute; width: 3px; height: 3px; border-radius: 100%; background-color: #b3b2b2; left: 2px; top: 50%; margin-top: -2px;} /* .cont-lc-area.type2 .lc-leftbox .lnb-area .list:hover {background-color: #f5f5f5;} */ .cont-lc-area.type2 .lc-leftbox .lnb-area a.link:hover {color: #f38323 !important;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-list .link, .cont-lc-area.type2 .lc-leftbox .lnb-area .dep2-list > .list.on > .link {color: #f38323;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-list div.link, .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list > .link {position: relative; padding-left: 40px; font-size: 15px; line-height: 20px; font-weight: bold; color: #666; padding-top: 4px; padding-bottom: 4px;} .cont-lc-area.type2 .lc-leftbox .lnb-area > div.list.sitemap > a span::before, .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list.sitemap > a span::before {background-image: url(../images/layout/ico-lnb0-off.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area > div.list.favorite > a span::before, .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list.favorite > a span::before {background-image: url(../images/layout/ico-lnb-favorite-off.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list > .link.menuFAVO::before {background-image: url(../images/layout/ico-lnb-favorite-off.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list > .link.menuVM::before {background-image: url(../images/layout/ico-lnbVM-off.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list > .link.menuCD::before {background-image: url(../images/layout/ico-lnb1-off.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list > .link.menuBM::before {background-image: url(../images/layout/ico-lnb2-off.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list > .link.menuFI::before {background-image: url(../images/layout/ico-lnb3-off.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list > .link.menuWT_CDC::before, .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list > .link.menuTM1::before {background-image: url(../images/layout/ico-lnb4-off.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list > .link.menuWT_RDC::before, .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list > .link.menuTM::before {background-image: url(../images/layout/ico-lnb5-off.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list > .link.menuWT_RDC::before, .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list > .link.menuTM::before {background-image: url(../images/layout/ico-lnb4-off.png);}/*cdc > rdc*/ .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list > .link.menuMD::before {background-image: url(../images/layout/ico-lnb7-off.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list > .link.menuPT::before {background-image: url(../images/layout/ico-lnb6-off.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list > .link.menuWM::before {background-image: url(../images/layout/ico-lnb8-off.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list > .link.menuWT_CDC::before, .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list > .link.menuTM1::before {background-image: url(../images/layout/ico-lnb8-off.png);}/*wm > cdc*/ .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list > .link.menuWM_HRDST::before {background-image: url(../images/layout/ico-lnb9-off.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list > .link.menuLPAS::before {background-image: url(../images/layout/ico-lnb10-off.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list > .link.menuWM_WEBLABEL::before {background-image: url(../images/layout/ico-lnb1-off.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area > div.list.sitemap.on > a span::before, .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list.sitemap.on > a span::before {background-image: url(../images/layout/ico-lnb0-on.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area > div.list.favorite.on > a span::before, .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list.favorite.on > a span::before {background-image: url(../images/layout/ico-lnb-favorite-on.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list.on > .link.menuFAVO::before {background-image: url(../images/layout/ico-lnb-favorite-on.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list.on > .link.menuVM::before {background-image: url(../images/layout/ico-lnbVM-on.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list.on > .link.menuCD::before {background-image: url(../images/layout/ico-lnb1-on.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list.on > .link.menuBM::before {background-image: url(../images/layout/ico-lnb2-on.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list.on > .link.menuFI::before {background-image: url(../images/layout/ico-lnb3-on.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list.on > .link.menuWT_CDC::before, .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list.on > .link.menuTM1::before {background-image: url(../images/layout/ico-lnb4-on.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list.on > .link.menuWT_RDC::before, .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list.on > .link.menuTM::before {background-image: url(../images/layout/ico-lnb5-on.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list.on > .link.menuWT_RDC::before, .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list.on > .link.menuTM::before {background-image: url(../images/layout/ico-lnb4-on.png);}/*cdc > rdc*/ .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list.on > .link.menuMD::before {background-image: url(../images/layout/ico-lnb7-on.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list.on > .link.menuPT::before {background-image: url(../images/layout/ico-lnb6-on.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list.on > .link.menuWM::before {background-image: url(../images/layout/ico-lnb8-on.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list.on > .link.menuWT_CDC::before, .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list.on > .link.menuTM1::before {background-image: url(../images/layout/ico-lnb8-on.png);}/*wm > cdc*/ .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list.on > .link.menuWM_HRDST::before {background-image: url(../images/layout/ico-lnb9-on.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list.on > .link.menuLPAS::before {background-image: url(../images/layout/ico-lnb10-on.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list.on > .link.menuWM_WEBLABEL::before {background-image: url(../images/layout/ico-lnb1-on.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-list {height: calc(100% - 64px); padding: 4px 0 8px; overflow: hidden; background-color: #fff;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-list .depth-list1 {padding: 0 8px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-list .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {opacity: 0;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-list:hover .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {opacity: 1;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-list .list {position: relative;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-list .list > ul {display: none; display: block; padding-left: 12px; padding-right: 0;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-list .list.on > ul {display: block;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-list .toggle {text-indent: -999rem; width: 20px; height: 20px; position: absolute; top: 0; right: 0;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-list .toggle:hover {background-color: rgba(0,0,0,0.05);} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-list .toggle::before {content: ''; display: block; width: 10px; height: 6px; background: url(../images/common/ico-lnb-arrow.png) 0 0 no-repeat; position: absolute; top: 50%; left: 50%; margin: -3px 0 0 -5px; transform: rotate(180deg);} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-list .toggle.on::before {background-position: 0 100%; transform: rotate(0deg);} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-list .del {text-indent: -999rem; width: 14px; height: 14px; position: absolute; top: 50%; right: 0; z-index: 1; margin-top: -7px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-list .del:hover {background-color: rgba(0,0,0,0.05);} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-list .del::before {content: ''; display: block; width: 8px; height: 8px; background: url(../images/common/ico-lnb-del.png) 0 0 no-repeat; position: absolute; top: 50%; left: 50%; margin: -4px 0 0 -4px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-list .list.on > .del::before {background-position: 0 100%;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-list .del + .link {width: calc(100% - 20px);} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-list div + ul {padding-top: 12px; margin-top: 5px; border-top: 1px solid #ccc;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-list .depth-list1 > .list + .list {border-top: 1px solid #ccc; margin-top: 12px; padding-top: 4px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-list .depth-list1 > .list.divHide + .list {margin-top: 4px;} .cont-lc-area.type2 .lc-leftbox .lnb-area {width: 100%; height: 100%; background-color: #313d4a; /*overflow: hidden;*/} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-wrap {height: 100%; display: flex; align-items: stretch; flex-direction: column; justify-content: space-between; flex-wrap: nowrap;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-tit {position: absolute; left: -183px; display: flex; flex-direction: row; width: 200px; height: 46px; height: 26px; justify-content: flex-end; align-items: center; border-right: 1px solid #ddd; background-color: #fff; transition: left .6s; padding: 0 13px;} .cont-lc-area.type2.open .lc-leftbox .lnb-area .lnb-tit, .cont-lc-area.type2.leftFix .lc-leftbox .lnb-area .lnb-tit {left: 68px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-tit .title {position: relative; display: inline-flex; align-items: center; font-size: 13px; line-height: 22px; color: #666; font-weight: 400; text-transform: uppercase; margin-right: 5px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-tit .title::before{ width: 3px; height: 3px; background-color: #ec6608; content: ''; margin: 7px 5px 7px 0; display: inline-block; border-radius: 50%;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-tit .fixSet-box .btn-onoff {padding-left: 18px; width: 50px; height: 18px; background-color: #909090;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-tit .fixSet-box .btn-onoff::after {left: 4px; width: 12px; height: 12px; transition: .2s;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-tit .fixSet-box .btn-onoff .txt2 {display: block; top: 1px; left: 25px; font-size: 11px; color: #fff; font-weight: 300; letter-spacing: 0.05em;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-tit .fixSet-box .btn-onoff.on {background-color: #ec6608;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-tit .fixSet-box .btn-onoff.on::after {left: 34px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-tit .fixSet-box .btn-onoff.on .txt2 {left: 8px; top: 1px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-tit .allFavoBtn-box {display: flex; justify-content: center; align-items: center; width: 100%;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-tit .allFavoBtn-box .btn-af {display: inline-flex; width: 32px; height: 26px; background-color: #747474; border-radius: 12px; align-items: center; justify-content: flex-start; transition: all .2s; padding: 0 6px; padding: 0 8px; white-space: nowrap; width: auto; margin: 0 3px; overflow: hidden;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-tit .allFavoBtn-box .btn-af::before {content: ''; display: inline-block; background-position: center center; background-repeat: no-repeat; width: 15px; height: 15px;margin-bottom: 1px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-tit .allFavoBtn-box .btn-af .txt {font-size: 13px; line-height: 16px; transition: all .2s; color: #fff; padding-left: 0; font-weight: 300; display: none;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-tit .allFavoBtn-box .btn-af.all::before {background-image: url(../images/layout/ico-af-all.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-tit .allFavoBtn-box .btn-af.favo::before {background-image: url(../images/layout/ico-af-favo.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-tit .allFavoBtn-box .btn-af.on {background-color: #e8a25f; width: calc(86% - 33px);} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-tit .allFavoBtn-box .btn-af.on .txt {padding-left: 10px; display: block;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 {/*position: absolute; z-index: 10; top: 0; left: 0; height: 100%; */ width: auto; display: flex; flex-direction: column; transition: left .6s; /*overflow: hidden; background-color: #eee;*/ padding-top: 0;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner {position: absolute; /*z-index: 2;*/ top: 46px; top: 27px; left: -200px; width: 200px; height: calc(100% - 46px); background-color: #fff; transition: .6s; /*box-shadow: 0px 0 8px 0 rgba(0, 0, 0, 0.6);*/ border-left: 1px solid #ddd; border-right: 1px solid #ddd; opacity: 0;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner::before {content: ""; position: fixed; z-index: 2; left: 0; width: 69px; height: 100%; /*border-right: 1px solid #ddd;*/ background-color: #313d4a;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner::after {content: ""; position: fixed; z-index: 2; left: 0; top: 64px; bottom: 0; width: 1px; background-color: #ddd; transition: .6s;} .cont-lc-area.type2.open .lc-leftbox .lnb-area .depth-list-inner::after, .cont-lc-area.type2.open .lc-leftbox .lnb-area.abs .depth-list-inner::after, .cont-lc-area.type2.leftFix .lc-leftbox .lnb-area .depth-list-inner::after, .cont-lc-area.type2.leftFix .lc-leftbox .lnb-area.abs .depth-list-inner::after {left: 267px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .list > .scrollY {position: absolute; width: 100%; height: calc(100% - 49px); height: calc(100% - 32px); top: 32px;} .cont-lc-area.type2.open .lnb-area .depth-list1 > .list.on > .depth-list-inner, .cont-lc-area.type2.leftFix .lnb-area .depth-list1 > .list.on > .depth-list-inner{left: 68px; opacity: 1;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list > .link {width: 69px; z-index: 1; padding: 10px 0 7px !important;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list > .link, .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner > .list > .link {position: relative; z-index: 10; display: flex; flex-direction: column; align-items: center; padding: 10px; flex: 1; font-size: 12px; line-height: 16px; font-weight: 400; color: #666;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list > .link {background-color: #313d4a; color: #fff; border-bottom: 1px solid #4f5861;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list.on > .link {background-color: #fff; color: #313d4a; border-left-width: 4px; border-right: 1px solid #ddd;} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.sitemap span::before, .cont-lc-area.type2 .lc-leftbox .lnb-area .list.favorite span::before, .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list > .link::before, .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner > .list > .link::before {content: ''; /*position: absolute; left: 10px; top: 50%; margin-top: -10px;*/ width: 25px; height: 25px; margin-bottom: 2px; background-repeat: no-repeat; background-position: center center;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list > .link::after {content: ''; display: block; width: 0; height: auto; background-color: #313d4a; transition: all .2s; position: absolute; left: 0; top: 0; bottom: 0;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list.on > .link::after {width: 4px; background-color: #ed6d00;} /*.cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner > .list > .link .btn-back {position: absolute; top: 0; right: 0; display: flex; flex-direction: row; align-items: center; width: 31px; height: 100%; margin-left: auto; font-size: 0; overflow: hidden; text-indent: -999rem;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner > .list > .link .btn-back::after {content: ""; position: absolute; left: 50%; top: 50%; width: 10px; height: 10px; margin: -5px 0 0 -9px; background: url(../images/layout/ico-back.png) no-repeat center center;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner > .list > .link .btn-back:hover {background-color: rgba(0, 0, 0, 0.2);}*/ .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner > .list > .link .btn-back {position: absolute; top: 0; right: 0; display: flex; flex-direction: row; align-items: center; width: 30px; height: 100%; margin-left: auto; font-size: 0; overflow: hidden; text-indent: -999rem;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner > .list > .link .btn-back::before, .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner > .list > .link .btn-back::after {content: ''; display: block; position: absolute; top: 0; right: 16px; width: 2px; height: 8px; background-color: #fff;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner > .list > .link .btn-back::before {transform: rotate(45deg); margin-top: 9px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner > .list > .link .btn-back::after {transform: rotate(-45deg); margin-top: 15px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner > .list > .link .btn-back:hover {background-color: rgba(0, 0, 0, 0.2);} /*.cont-lc-area.type2.open .lc-leftbox .lnb-area .depth-list1 .list:not(.on) > .link::before, .cont-lc-area.type2.leftFix .lc-leftbox .lnb-area .depth-list1 .list:not(.on) > .link::before {background-color: #999;}*/ .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner > .list > .link {padding: 8px 3px 8px 12px; flex-direction: row; background-color: #8a8a8a; color: #fff;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner > .list > .link::before {content: none;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner > .list > .link .name {font-weight: 500;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list .list {position: relative; display: flex; width: 100%; flex-direction: column; flex-wrap: wrap;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list .list.select {padding: 4px 10px; text-align: center;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list .list.select .select1 {width: 100%; height: 22px; line-height: 20px; background-image: url(../images/layout/ico-sel1.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list .list > .link {display: flex; flex-direction: row; width: 100%; font-size: 12px; padding: 8px 0; flex: 1; line-height: 1.2; /*word-break: keep-all;*/} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list .list > .link .name {flex: 1; color: #666; padding-right: 28px; letter-spacing: -0.02em; padding-right: 10px; word-break: keep-all;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list .list > .link:hover {background-color: #f5f5f5;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list .list.has-depth > .link {position: relative; font-weight: 500;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list .list.has-depth > .link::before {content: none; position: absolute; left: inherit; top: 50%; margin-top: -5px; right: 13px; width: 2px; height: 10px; background-color: #666; background-image: none !important; transition: .3s; transform: rotate(90deg); opacity: 0;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list .list.has-depth.close > .link::before {transform: rotate(0deg); opacity: 1; right: 12px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list .list.has-depth > .link::after {content: ""; position: absolute; left: inherit; right: 12px; top: 50%; margin-top: -4px; width: 11px; height: 6px; background: url(../images/common/ico-arrow2.png) no-repeat center center; transform: rotate(180deg); background-image: url(../images/layout/ico-lnbArrow.png); transform: rotate(0deg); transition: .2s;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list .list.has-depth.close > .link::after {transform: rotate(180deg);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list .list:not(.has-depth) > .link {color: #666;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list .list:not(.has-depth) > .link::before {content: ''; position: absolute; width: 3px; height: 3px; border-radius: 100%; background-color: #b3b2b2; left: 22px; top: 50%; margin-top: -2px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list .list:not(.has-depth) {flex-direction: row; align-items: center; /*padding-right: 8px;*/} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list.sortable .list > .link .name{ background: url(../images/layout/ico-more2.png) no-repeat right center;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list .list .del {text-indent: -999rem; width: 14px; height: 14px; position: absolute; top: 50%; right: 6px; z-index: 1; margin-top: -7px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list .list .del:hover {background-color: rgba(0,0,0,0.05);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list .list .del::before {content: ''; display: block; width: 8px; height: 8px; background: url(../images/common/ico-lnb-del.png) 0 0 no-repeat; position: absolute; top: 50%; left: 50%; margin: -4px 0 0 -4px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list .list .del + .link {width: calc(100% - 26px);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list .list .btn-favorite {width: 15px; height: 15px; margin-left: auto; background: none; display: inline-flex; align-items: center; justify-content: center;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list .list .btn-favorite::before {content: ''; display: block; width: 15px; height: 15px; background: url(../images/layout/ico-favo2-off.png) center center no-repeat;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list .list .btn-favorite.on::before, .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list .list .btn-favorite:hover::before {background-image: url(../images/layout/ico-favo2-on.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list .list.has-depth {border-top: 1px solid #ddd;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list .list.has-depth:first-of-type {border-top: 0 none;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list .list.has-depth.close {border-bottom: 0 none;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list .list.has-depth > .link {border-bottom: 1px solid #ddd; background-color: #eae9e9; padding-top: 7px; padding-bottom: 7px;} /*addclass hide의 기능을 못찾아 css에서 강제(lnb에서 즐겨찾기/All로 다시 할 경우 삭제*/ .cont-lc-area.type2 .lc-leftbox .lnb-area #frontMenu .list.hide {display: flex !important;} /* WM/TM(CDC) */ .cont-lc-area.type2 .lc-leftbox .lnb-area .depth2Type1 .depth-list-inner .depth-list.depth-list2 > .list.has-depth > .link {border-bottom: none; background-color: #d2d2d2;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth2Type1 .depth-list-inner .depth-list.depth-list2 > .list.has-depth:first-child > .link {border-top: 0; padding-top: 9px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth2Type1 .depth-list-inner .depth-list.depth-list2 > .list.has-depth.close {border-bottom: 1px solid #a7a7a7;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth2Type1 .depth-list-inner .depth-list.depth-list3 > .list.select {padding: 1px 8px 11px 15px; border-bottom: 1px solid #ddd; background-color: #d2d2d2;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth2Type1 .depth-list-inner .depth-list.depth-list3 > .list.select .select1 {border-color: #d2d2d2;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth2Type1 .depth-list-inner .depth-list.depth-list3 > .list.select .select1:hover {border-color: #444;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth2Type1 .depth-list-inner .depth-list.depth-list3 > .list.select .select1:focus {border-color: #f37020;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list2 > .list > .link, .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list3 > .list > .link {padding-left: 12px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list2 > .list > .link {color: #666; font-size: 12px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list2 > .list.has-depth > .link > .name {padding-right: 33px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list3 > .list > .link {font-size: 13px; color: #666; padding-right: 30px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list3 > .list > .link > .name {padding-right: 0;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list2 > .list.has-depth > .link {background-color: #d7d7d7;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list2 .list:not(.has-depth) > .link {padding-right: 9px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list2 .list:not(.has-depth) > .link::before {content: none;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list3 .list:not(.has-depth) > .link {padding: 4px 9px 4px 12px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list3 .list.has-depth > .link::before {content: ""; width: 13px; height: 13px; background-image: url(../images/layout/ico-sh-minus.png) !important; background-position: center center; background-repeat: no-repeat; margin-top: -7px; opacity: 1; background-color: transparent; transform: rotate(0deg); right: 11px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list3 .list.has-depth > .link::after {height: 2px; width: 10px; margin-top: -1px; background-color: #333; content: none;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list3 .list.has-depth.close > .link::before {background-image: url(../images/layout/ico-sh-plus.png) !important; transform: rotate(180deg);} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list4 {padding-top: 7px; padding-bottom: 7px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.sitemap {text-align: center; position: relative; z-index: 10; overflow: hidden;} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.sitemap:empty {width: 100%; height: auto; padding-bottom: 61px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.sitemap a {height: 60px; display: flex; align-items: center; justify-content: center; border-bottom: 1px solid #4f5861;} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.sitemap span {font-size: 10px; line-height: 16px; font-weight: 400; text-align: center; color: #fff; text-transform: uppercase; margin-top: 2px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.sitemap span::before {display: block; margin: 0 auto 3px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.sitemap:hover span {color: #f38323;} .cont-lc-area.type2 .lc-leftbox .lnb-area > div.list.sitemap {position: absolute; left: 0; top: 0; z-index: 11; width: 69px; height: 61px; background-color: #313d4a;} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.favorite {text-align: center; position: relative; z-index: 10; overflow: hidden;} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.favorite:empty {width: 100%; height: auto; padding-bottom: 61px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.favorite a {height: 60px; display: flex; align-items: center; justify-content: center; border-bottom: 1px solid #4f5861;} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.favorite span {font-size: 10px; line-height: 16px; font-weight: 400; text-align: center; color: #fff; text-transform: uppercase; margin-top: 2px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.favorite span::before {display: block; margin: 0 auto 3px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.favorite:hover span {color: #f38323;} .cont-lc-area.type2 .lc-leftbox .lnb-area > div.list.favorite {position: absolute; left: 0; top: 0; z-index: 11; width: 69px; height: 61px; background-color: #313d4a;} .cont-lc-area.type2 .lc-leftbox .lnb-area .util-list {padding-top: 15px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.util {position: relative; z-index: 10; margin-top: auto; text-align: center;} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.util:last-of-type {margin-bottom: 12px;} .cont-lc-area.type2 .lc-leftbox.abs .lnb-area .list.util {margin-top: 30px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.util + .list.util {margin-top: 0;} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.util > a {width: 34px; height: 34px; border-radius: 100%; background-color: #fff; margin-bottom: 10px; position: relative;} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.util > a:hover {background-color: #d5d5d5;} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.util > a i {width: 100%; height: 100%; background-position: center center; background-repeat: no-repeat;} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.util .ico-noti {background-image: url(../images/layout/ico-noti2.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.util .noti-cnt {margin-top: -13px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.util .ico-help {background-image: url(../images/layout/ico-help.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.util .ico-user {background-image: url(../images/layout/ico-user2.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.util .ico-setting {background-image: url(../images/layout/ico-setting.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.util .ico-logout {background-image: url(../images/layout/ico-logout2.png);} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.util .ico-sitemap {background-image: url(../images/layout/ico-map3.png); opacity: 0.7;} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.util.sitemap > a{ display: inline-block;} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.util .ico-favorite {background-image: url(../images/layout/ico-map3.png); opacity: 0.7;} .cont-lc-area.type2 .lc-leftbox .lnb-area .list.util.favorite > a{ display: inline-block;} .cont-lc-area.type2 .lc-leftbox .mypage-layer {left: 80px; bottom: 0;} .cont-lc-area.type2 .lc-leftbox .mypage-layer.open {display: block;} [class*="ico-noti"] + .noti-cnt {position: absolute; width: 14px; height: 14px; line-height: 13px; left: 50%; top: 50%; margin: -15px 0 0 0; border-radius: 100%; background-color: #ec6608; color: #fff; text-align: center; font-size: 10px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-search {display: flex; flex-direction: row; align-items: center; padding: 10px; background-color: #fff; border-bottom: 1px solid #ccc;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-search .insearch-box {flex: 1; justify-content: start;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-search .has-clear .btn-del {right: 1px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-search .has-clear .btn-del:hover {background-color: #f5f5f5;} .cont-lc-area.type2 .lc-leftbox .lnb-area .lnb-search .btn.search {display: inline-flex; align-items: center; height: 24px; border-radius: 0;} /*lnb font-size*/ .cont-lc-area.type2 .lc-leftbox .lnb-area .link .name {font-size: 12px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner > .list.has-depth > .link > .name, .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list1 > .list.has-depth > .link > .name, .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list2 > .list.has-depth > .link > .name, .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list3 > .list.has-depth > .link > .name {font-size: 13px;} /*선만남게*/ .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner > .list > .link {padding: 1px; height: 2px; font-size: 0; text-indent: -999rem; overflow: hidden;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner > .list > .link > a {pointer-events: none;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .list > .scrollY {height: calc(100% - 2px); top: 2px;} .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list .list:not(.has-depth, .select) > .link .name {position: relative; padding-left: 5px;} /* .cont-lc-area.type2 .lc-leftbox .lnb-area .depth-list-inner .depth-list .list:not(.has-depth, .select) > .link .name::before {content: ""; position: absolute; left: 0px; top: 6px; width: 2px; height: 2px; background-color: #999; border-radius: 100%;} */ /* .tooltip-wrap.lnb-type {margin-top: -42px; margin-left: 56px;} */ /*lnb site map*/ body.sitemapOpen {overflow: hidden; width: 100%; height: 100%; min-width: 100%;} .sitemap-area .sitemap-body .mCSB_outside + .mCSB_scrollTools {right: 3px;} .sitemap-area .tab-cont {display: none;} .sitemap-area .btn-toggle + .btn-toggle {margin-left: 8px;} .sitemap-area .btn-toggle + .onoffbox.type3 {margin-left: 8px;} .sitemap-area .head-searchbox.rowtype .btnbox .btn-toggle + .btn-toggle {margin-left: 5px;} .sitemap-area .head-searchbox.rowtype .btnbox .btn-toggle + .onoffbox.type3 {margin-left: 5px;} .sitemap-area .btn-menu {text-indent: -999rem; width: 50px; height: 50px; position: relative;} .sitemap-area .btn-menu:hover {background-color: rgba(0,0,0,0.05);} .sitemap-area .btn-menu::before, .sitemap-area .btn-menu::after, .sitemap-area .btn-menu span {content: ''; display: block; width: 20px; height: 2px; position: absolute; top: 50%; left: 50%; margin-left: -10px; background-color: #7f7f7f; transition: .3s;} .sitemap-area .btn-menu::before {margin-top: -6px;} .sitemap-area .btn-menu::after {margin-top: 4px;} .sitemap-area .btn-menu span {margin-top: -1px;} .sitemap-area .btn-close {width: 28px; height: 28px; position: absolute; top: 25px; left: 50%; margin-left: 636px; background-color: transparent; background-image: url(../images/layout/ico-close2.png); background-position: 50% 50%; background-repeat: no-repeat; text-indent:-9999em; border-radius: 3px;} .sitemap-area .btn-close span {text-indent: -999rem; position: absolute; left: 0; top: 0;} .sitemap-area .btn-close:hover {background-color: #eaeaea;} .sitemap-area .insearch-box {height: 28px;} .sitemap-area .insearch-box .input {height: 100%;} .sitemap-area .insearch-box .btn {height: 100%;} .sitemap-area .insearch-box.type3 {padding-right: 0; border-bottom-color: #bbb;} .sitemap-area .insearch-box.type3 .btn {width: 30px;} .sitemap-head {display: flex; justify-content: space-between; align-items: center;} .sitemap-head.rowtype {flex-direction: column; justify-content: flex-start;} .sitemap-head [class*="head-"] {display: inline-flex; align-items: center;} .sitemap-head .title {font-size: 20px; line-height: 26px; font-weight: 500; display: inline-flex; align-items: center; justify-content: flex-start;} .sitemap-head .title::before {content: ''; display: inline-block; width: 20px; height: 18px; background: url(../images/layout/ico-map3.png) center center no-repeat; margin-right: 10px;} .sitemap-head .head-titbox {border-bottom: 1px solid #bbb; margin-bottom: 3px;} .sitemap-head .head-titbox, .sitemap-head .head-left {justify-content: flex-start;} .sitemap-head .head-titbox > *, .sitemap-head .head-left > * {margin-right: 10px;} .sitemap-head .head-left .btnbox, .sitemap-head .head-titbox .btnbox, .sitemap-head .head-searchbox .btnbox {display: flex; align-items: flex-start; justify-content: flex-start; flex-direction: column;} .sitemap-head .head-left .btnbox > .inbox, .sitemap-head .head-titbox .btnbox > .inbox, .sitemap-head .head-searchbox .btnbox > .inbox {display: inline-flex; align-items: flex-start; justify-content: flex-start;} .sitemap-head .head-left .btnbox > .inbox + .inbox, .sitemap-head .head-titbox .btnbox > .inbox + .inbox, .sitemap-head .head-searchbox .btnbox > .inbox + .inbox {margin-top: 5px;} .sitemap-head .head-left .text, .sitemap-head .head-titbox .text {font-size: 12px; line-height: 17px; color: #ed6d00;} .sitemap-head .head-right {justify-content: flex-end; margin-right: 45px;} .sitemap-head .head-titbox, .sitemap-head .head-searchbox {display: flex; width: 100%;} .sitemap-head .head-titbox {height: 45px;} .sitemap-head .head-searchbox {height: 50px; align-content: flex-start;} .sitemap-head .head-searchbox .btnbox {display: inline-flex; flex-direction: column; flex-wrap: nowrap;} /*commonMenu-area sitemap, lnb 공통으로 사용할 class*/ .sitemap .btn-favorite {width: 16px; height: 16px; background: none; display: inline-flex; align-items: center; justify-content: center; cursor: pointer;} .sitemap .btn-favorite::before {content: ''; display: block; width: 16px; height: 16px; background: url(../images/common/ico-favo2-off.png) center center no-repeat; transform: scale(.7);} .sitemap .btn-favorite.on {} .sitemap .btn-favorite.on::before, .sitemap .btn-favorite:hover::before {background-image: url(../images/common/ico-favo2-on.png);} .sitemap .menu {display: flex; justify-content: space-between; align-items: center;} .sitemap .menu .link {max-width: calc(100% - 21px); width: 100%; font-size: 13px; line-height: 13px; padding: 4px 7px 3px; min-height: 26px; display: inline-flex; align-items: center; justify-content: flex-start; letter-spacing: -0.01em; word-spacing: -0.05em;} .sitemap .menu .link:hover {color: #eb6f02;} .sitemap .menu .link strong, .sitemap .menu .link span {display: block;} .sitemap .menu .link strong {font-size: 18px; font-weight: 500;} .sitemap .menu .link span {font-size: 12px; font-weight: 500; margin-bottom: 2px;} .sitemap .menu .link strong + span {margin-left: 5px;} .sitemap .menu .btn-favorite {margin-right: 6px;} .sitemap .has-tabDepth > .menu {position: relative;} .sitemap .has-tabDepth > .menu .menuIn-tabox {position: absolute; left: 190px; top: 2px;} .sitemap .has-tabDepth > .menu .menuIn-tabox .tab-ul li .tag {height: 25px; background-color: #f1f1f1; border: 1px solid #ddd; color: #3e3c3c;} .sitemap .has-tabDepth > .menu .menuIn-tabox .tab-ul li .tag:hover {border-color: #444;} .sitemap .has-tabDepth > .menu .menuIn-tabox .tab-ul li.on .tag {background-color: #3fb17a; border-color: #3fb17a; color: #fff;} .sitemap .has-tabDepth > .menu .menuIn-tabox .tab-ul li.on .tag:hover {border-color: #095c34;} .sitemap-area .sitemap {min-height: 100%; width: calc(100% - 114px); margin-left: 114px; padding-right: 5px; padding-left: 5px; display: flex; align-items: stretch; justify-content: flex-start; flex-direction: column; flex-wrap: nowrap; flex: 1; overflow: auto; height: 100%;} .sitemap-area .sitemap .nodata {width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; font-size: 20px; line-height: 24px;} .sitemap-area .sitemap .depth-list .nodata {height: 100px; padding-bottom: 20px;} .sitemap-area .sitemap::-webkit-scrollbar {width: 6px; height: 6px;} .sitemap-area .sitemap::-webkit-scrollbar-track {background-color: fff;} .sitemap-area .sitemap::-webkit-scrollbar-thumb {background-color: #ddd; border-radius: 5px;} .sitemap-area .sitemap .tabDepth-list {min-height: 46px; padding: 5px 0 10px;} .sitemap-area .sitemap > ul {display: flex; flex-wrap: nowrap; align-items: stretch; align-content: flex-start; justify-content: flex-start; flex-direction: column;} .sitemap-area .sitemap > ul > li > .menu > .link {display: flex; flex-direction: row; align-items: flex-end; border-bottom: 1px solid #ddd; height: 38px; padding-bottom: 10px; line-height: 1; border-bottom: 1px solid #ddd; color: #eb6f02;} .sitemap-area .sitemap > ul > li > .menu > .link:hover, .sitemap-area .sitemap > ul > li.close > .menu > .link {color: #242020;} .sitemap-area .sitemap > ul > li.close > .menu > .link:hover {color: #eb6f02;} .sitemap-area .sitemap > ul > li.depth2Type1 > .menu > .link {border-bottom: 1px solid #cdd9d3;} .sitemap-area .sitemap > ul > li.depth2Type1.close > .menu > .link {border-bottom-color: #ddd;} .sitemap-area .sitemap > ul > li > ul {padding: 5px 0 10px;} .sitemap-area .sitemap > ul > li:not(.depth2Type1) > ul {display: flex; justify-content: flex-start; align-items: flex-start; flex-direction: row; flex-wrap: wrap; } .sitemap-area .sitemap > ul > li:not(.depth2Type1) > ul > li {min-width: 185px; width: calc( (100% / 4) - (60px / 4) ); margin: 0 20px 10px 0;} .sitemap-area .sitemap > ul > li:not(.depth2Type1) > ul > li:nth-of-type(4n) {margin-right: 0;} .sitemap-area .sitemap > ul > li:not(.depth2Type1) > ul > li > .menu {border-bottom: 1px solid #ddd;} .sitemap-area .sitemap > ul > li > ul > li > .menu > .link, .sitemap-area .sitemap .depth2Type1 .tab-cont > ul > li > .menu > .link {font-size: 14px; font-weight: 500; color: #3d3d3d; padding-top: 2px;} .sitemap-area .sitemap > ul > li > ul > li > ul > li > .menu > .link, .sitemap-area .sitemap .depth2Type1 .tab-cont > ul > li > ul > li > .menu > .link {font-size: 13px; font-weight: 500; color: #999;} .sitemap-area .sitemap > ul > li > ul > li > ul > li > ul > li > .menu > .link, .sitemap-area .sitemap .depth2Type1 .tab-cont > ul > li > ul > li > ul > li > .menu > .link {} .sitemap-area .sitemap > ul > li.depth2Type1 > ul > li > .menu > .link {height: 38px; background-color: #ebf7f1; border-bottom: 1px solid #ddd; margin-top: -5px; padding-bottom: 0; align-items: center; border-top: 1px solid #cdd9d3;} .sitemap-area .sitemap > ul > li.depth2Type1 > ul > li:first-child > .menu > .link {border-top: 0 none;} /*.sitemap-area .sitemap > ul > li.depth2Type1 > ul > li:not(.close) > .menu > .link {color: #eb6f02;}*/ .sitemap-area .sitemap > ul > li.depth2Type1 > ul > li > .menu > .link .has-plant {margin-bottom: -2px;} .sitemap-area .sitemap .depth2Type1 .tab-cont > ul, .sitemap-area .sitemap > ul > li.depth2Type1 > ul > li > ul {display: flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-start; align-content: flex-start; position: relative;} .sitemap-area .sitemap > ul > li.depth2Type1 > ul > li > ul::after, .sitemap-area .sitemap .depth2Type1 .tab-cont > ul > li > ul::after {content: ''; display: block; width: 1px; height: auto; position: absolute; right: 0; top: 0; bottom: 0;} .sitemap-area .sitemap .depth2Type1 .tab-cont > ul > li, .sitemap-area .sitemap > ul > li.depth2Type1 > ul > li > ul > li {width: calc(100% / 6); min-width: 178px; margin-bottom: 20px; min-width: 185px;width: calc( (100% / 4) - (60px / 4) );margin: 0 20px 10px 0;} .sitemap-area .sitemap .depth2Type1 .tab-cont > ul > li:nth-of-type(4n) {margin-right: 0;} .sitemap-area .sitemap > ul.depth-list > li.depth2Type1 > ul.depth-list > li > ul.depth-list > li + li {border-top: 0 none;} .sitemap-area .sitemap .depth2Type1 .tab-cont > ul > li > .menu {border-bottom: 1px solid #ddd;} .sitemap-area .sitemap > ul > li.depth2Type1 > ul > li > ul > li.has-depth > .menu > .link::after, .sitemap-area .sitemap .depth2Type1 .tab-cont > ul > li.has-depth > .menu > .link::after {width: 12px; height: 9px; margin-top: -5px; background-image: url(../images/common/ico-r-minus.png);} .sitemap-area .sitemap > ul > li.depth2Type1 > ul > li > ul > li.has-depth.close > .menu > .link::after, .sitemap-area .sitemap .depth2Type1 .tab-cont > ul > li.has-depth.close > .menu > .link::after {width: 12px; height: 12px; margin-top: -6px; background-image: url(../images/common/ico-r-plus.png);} /*.sitemap-area .sitemap li.depth2Type1 .toggletype > .depth-list > li > .menu > .link {pointer-events: none;} .sitemap-area .sitemap li.depth2Type1 .toggletype > .depth-list > li > .menu > .link::after {content: none;}*/ .sitemap-area .sitemap .has-depth > .menu > .link {max-width: 100%; position: relative;} .sitemap-area .sitemap .has-depth > .menu > .link::after {content: ''; display: block; width: 11px; height: 6px; background: url(../images/common/ico-arrow2.png) no-repeat center center; position: absolute; top: 50%; right: 9px; margin-top: -3px; transform: rotate(180deg);} .sitemap-area .sitemap .has-depth.close > .menu > .link::after {transform: rotate(0deg);} .sitemap-area .sitemap > ul > .has-depth.close > .menu {border-bottom-color: #f5f5f5;} .sitemap-area .sitemap > ul > .has-depth > .menu > .link::after, .sitemap-area .sitemap > ul.sitemap-other1 > .has-depth > .menu > .link::after {width: 20px; height: 20px; background-image: url(../images/layout/ico-s-minus.png); margin-top: -10px;} .sitemap-area .sitemap > ul > .has-depth.close > .menu > .link::after, .sitemap-area .sitemap > ul.sitemap-other1 > .has-depth.close > .menu > .link::after {background-image: url(../images/layout/ico-s-plus.png);} /* .sitemap-area .sitemap ul ul ul .menu > .link {padding-left: 15px;} */ .sitemap-area .sitemap ul ul ul ul .menu > .link {position: relative; padding-left: 16px; color: #999;} .sitemap-area .sitemap ul ul ul ul .menu > .link::before {content: ""; position: absolute; left: 8px; top: 50%; margin-top: -1px; width: 2px; height: 2px; background-color: #999; border-radius: 100%;} .sitemap-area .sitemap ul ul ul ul ul .menu > .link {padding-left: 25px;} /*20221116 추가 */ .sitemap-area .sitemap .level3-li > .menu > .link::after {background: url(../images/common/ico-r-minus.png) no-repeat center center;} .sitemap-area .sitemap .level3-li.close > .menu > .link::after {background: url(../images/common/ico-r-plus.png) no-repeat center center; height: 11px; background-position: -3px -4px;} .sitemap-area .sitemap .level4-start, .sitemap-area .sitemap .level3-li.has-depth {border-top: 1px solid #ddd} .sitemap-area .sitemap .level3-li.has-depth:first-child {border-top: 0 none;} .qitem-list {padding: 0; overflow: hidden;} .qitem-list > .qitem:not(:empty) {border-bottom: 1px solid #ddd;} .qitem-list [class*="qitem"] .btn {font-size: 12px; font-weight: 700; color: #808080; height: 26px; line-height: 24px; padding: 0 8px 0 16px; display: block; text-align: left; position: relative; border-radius: 0;} .qitem-list [class*="qitem"] .btn::before {content: none;} .qitem-list .qitem-top {} .qitem-list .qitem-top .btn {display: flex; flex-direction: row; align-items: center; justify-content: center; height: 29px; color: #fff; text-align: center; background-color: #999; border-radius: 0; padding: 2px 8px;} .qitem-list .qitem-top .btn::before {content: ''; display: inline-block; width: 16px; height: 16px; margin-right: 6px; background: transparent url(../images/layout/ico-arrow4.png) center bottom no-repeat; position: static; margin-bottom: -2px;} .qitem-list .qitem .btn:hover {color: rgba(237,109,0,1);} .qitem-list [class*="qitem"]:not(.qitem-top) .btn:hover::before, .qitem-list [class*="qitem"].on:not(.qitem-top) .btn::before {content: ''; position: absolute; right: 11px; top: 50%; margin-top: -4px; width: 8px; height: 8px; background-color: rgba(237,109,0,.4); border-radius: 100%; background-color: rgba(237,109,0,1);} .qitem-list [class*="qitem"].on:not(.qitem-top) .btn {background-color: #ffefe4; color: #3e3c3c;} .qitem-list .qitem-top .btn:hover {background-color: #666;} .qitem-list [class*="qitem"].on:not(.qitem-top) .qitemS-list {background-color: #ffefe4;} .qitem-list .qitemS-list {padding-left: 20px;} .qitem-list .qitemS-list .btn {font-size: 12px; line-height: 16px; position: relative; padding-left: 7px; background-color: #fff;} .qitem-list .qitemS-list .btn::before, .qitem-list .qitemS-list [class*="qitem"].on .btn::before, .qitem-list .qitemS-list [class*="qitem"] .btn:hover::before, .qitem-list .qitem.on .qitemS-list [class*="qitem"] .btn::before {content: ''; display: block; width: 3px; height: 2px; background-color: #a1a1a1; position: absolute; left: 0; top: 9px; margin-top: 0;} .qitem-list .qitemS-list .on .btn {color: rgba(237,109,0,1) !important;} .sitemap-qitem {width: 104px; position: fixed; border: 1px solid #e5e5e5; border-radius: 0;} .sitemap-area .sitemap-box {width: 1400px; height: 100%; border: 1px solid #ddd; margin: 0 auto; background-color: #fff; box-shadow: 1px 2px 5px rgba(0, 0, 0, .3);} .sitemap-area .sitemap-box > .inner {/*max-width: 1380px;*/ height: 100%; overflow: hidden; padding: 0 30px;} .sitemap-area .sitemap-box .sitemap-head {height: 60px; padding: 10px 10px 0;} .sitemap-area .sitemap-box .sitemap-body {height: calc(100% - 60px); padding: 10px 0 10px 10px;} .sitemap-area .sitemap-box .sitemap-head.rowtype {height: 110px; padding-left: 124px;} .sitemap-area .sitemap-box .sitemap-head.rowtype + .sitemap-body {height: calc(100% - 125px);} .sitemap-area .sitemap-box .sitemap-head .head-searchbox.rowtype {justify-content: space-between;} /* .sitemap-area .sitemap-box .sitemap-head .head-searchbox.rowtype >.btnbox {width: 400px;} */ .sitemap-area .sitemap-box .sitemap-head .head-searchbox.rowtype > .search {/*width: calc(100% - 400px); max-width: 700px;*/ flex: 1; max-width: 350px;} .sitemap-area .sitemap-wrap {display: none; background-color: #fff; position: fixed; left: 0; right: 0; top: 0; bottom: 0; padding: 10px; z-index: 11; background-color: rgba(0,0,0,.4);} .sitemap-area.open .sitemap-wrap {display: block;} @media screen and (max-width: 1420px) { .sitemap-area .sitemap-box {width: 96%;} .sitemap-area .btn-close {right: 80px; left: initial; margin-left: 0;} } @media screen and (max-width: 1221px) { .sitemap-area .sitemap-box > .inner {max-width: 100%;} .sitemap-area .sitemap > ul {width: 1069px;} } /*footer*/ #footer {font-family:'HankookTire', sans-serif; width: 100%; min-width: 1400px; padding: 15px 18px 12px; border-top: 1px solid #ddd; background-color: #fff; display: none;} #footer .inner {text-align: left;} #footer .logo-hk {text-indent: -999rem; width: 153px; height: 33px; background: url(../images/common/logo-hankook-foot.png) center center no-repeat;} #footer .textbox {display: block; text-align: left; padding-left: 30px; margin-top: 15px;} #footer .textbox p {font-size: 12px; line-height: 18px; color: #666;} #footer .logo-hk, #footer .textbox {display: inline-block; vertical-align: middle; margin: 0;} #footer.show {display: block;} /*fix quick*/ [class^="ico-fix-"] {text-indent: -999rem; width: 40px; height: 40px; border-radius: 40px; background-position: center center; background-repeat: no-repeat;} .ico-fix-itsm {background-image: url(../images/common/ico-fix-itsm.png);} .ico-fix-qna {background-image: url(../images/common/ico-fix-qna.png);} .ico-fix-DEM {background-image: url(../images/common/ico-fix-DEM.png);} .btn-fixSH {font-size: 0; text-indent: -999rem; width: 80px; height: 88px; background: url(../images/common/ico-sh-oo.png) 0 0 no-repeat; } .btn-fixSH:hover {background-position: 100% 0;} .btn-fixSH.on {background-position: 0 100%;} .btn-fixSH.on:hover {background-position: 100% 100%;} .fixQuick-box {/*display: none*;*/ position: fixed; right: 1px; bottom: 1px; width: 80px; z-index: 2;} .fixQuick-box .btn-fixSH {z-index: 1; position: relative;} .fixQuick-box .fix-quick {position: relative} .fixQuick-box .fix-quick .fix-menu {width: 88px; padding: 17px 0 28px; text-align: center; position: absolute; bottom: -400px; left: 50%; margin-left: -44px; transition: .3s; opacity: 0;} .fixQuick-box .fix-quick .fix-menu::before, .fixQuick-box .fix-quick .fix-menu::after {content: ''; display: block; position: absolute; left: 0; right: 0; background-repeat: no-repeat;} .fixQuick-box .fix-quick .fix-menu::before {height: 17px; top: 0; background-image: url(../images/common/bg-fixQuick-top.png); background-position: center top;} .fixQuick-box .fix-quick .fix-menu::after {height: 28px; bottom: 0; background-image: url(../images/common/bg-fixQuick-bottom.png); background-position: center bottom;} .fixQuick-box .fix-quick .fix-menu ul {padding: 0 9px; background: url(../images/common/bg-fixQuick-middle.png) top center repeat-y; transition: .3s;} .fixQuick-box .fix-quick .fix-menu li {padding: 9px 0} .fixQuick-box .fix-quick .fix-menu li + li {border-top: 1px solid #e9e9e9;} .fixQuick-box .fix-quick .fix-menu li:first-child {padding-top: 0;} .fixQuick-box .fix-quick .fix-menu li:last-child {padding-bottom: 0;} .fixQuick-box .fix-quick .fix-menu .btn {text-align: center;} .fixQuick-box .fix-quick .fix-menu .btn [class^="ico-fix"] {} .fixQuick-box .fix-quick .fix-menu .btn .ico-fix-itsm {background-color: #f5bf1e; margin-bottom: 1px;} .fixQuick-box .fix-quick .fix-menu .btn:hover .ico-fix-itsm {background-color: #bc900d;} .fixQuick-box .fix-quick .fix-menu .btn .ico-fix-qna {background-color: #a1d127; margin-bottom: 2px;} .fixQuick-box .fix-quick .fix-menu .btn:hover .ico-fix-qna {background-color: #80a819;} .fixQuick-box .fix-quick .fix-menu .btn .ico-fix-DEM {background-color: #6bbfed; margin-bottom: 6px;} .fixQuick-box .fix-quick .fix-menu .btn:hover .ico-fix-DEM {background-color: #42a3d8;} .fixQuick-box .fix-quick .fix-menu .btn .txt {display: block; font-family: '맑은 고딕'; font-size: 10px; color: #666; line-height: 9px; font-weight: bold;} .fixQuick-box .fix-quick .fix-menu.fixShow {bottom: 71px; opacity: 1;} .fixQuick-box .fix-quick .fix-menu.fixShow ul {height: auto;} /*quick*/ .quick-area .quicklink-title { padding: 3px 7px 4px; position: relative;} .quick-area .quicklink-title .title {font-size: 14px; color: #ec6608; font-weight: bold; word-spacing: -0.03em; letter-spacing: -0.01em; padding-left: 12px;} .quick-area .quicklink-title .btn-sh1 {position: absolute; top: 50%;} .quicklinkbox {position: relative; border: 1px solid #d0d0d0; border-radius: 3px; width: 126px; background-color: #fff;} .quicklinkbox .quicklink-title .title {padding-left: 28px; background: url(../images/common/ico-quicklink.png) 0 1px no-repeat;} .quicklinkbox .quicklink-list {padding: 10px 8px 10px 13px;} .quicklinkbox .quicklink-list .list {font-size: 0; position: relative; width: 100%; height: 61px; display: flex; justify-content: flex-start; align-items: center;} .quicklinkbox .quicklink-list .ico, .quicklinkbox .quicklink-list .link {vertical-align: middle;} .quicklinkbox .quicklink-list .ico {width: 25px; height: 25px;} .quicklinkbox .quicklink-list .ico img {width: 100%; height: 100%;} .quicklinkbox .quicklink-list .btn-del3 {margin-top: 7px;} .quicklinkbox .quicklink-list .link {max-width: calc(100% - 25px); font-size: 12px; color: #666; line-height: 15px; letter-spacing: -0.01em; word-spacing: -0.08em; word-break: break-word; padding: 8px 0 8px 12px;} .quicklinkbox .quicklink-list .new {position: relative;} .quicklinkbox .quicklink-list .new::after {content: ''; display: block; width: 5px; height: 5px; border-radius: 5px; background-color: #ec6608; position: absolute; top: 5px; right: -11px;} .quicklinkbox .quicklink-list .list.list-HTG .new::after {right: 2px;} .quicklinkbox .quicklink-list .link:hover {color: #f77b30;} .quicklinkbox .btn-sh1 {right: 7px; margin-top: -8px;} .quicklinkbox .btn-hide {display: none; z-index: 1; position: absolute; right: -18px; bottom: -19px;} .quicklinkbox .quicklink-list .list + .list {border-top: 1px solid #ddd;} .quickmenubox {border: 1px solid #f0f0f0; background-color: #f0f0f0;} .quickmenubox .quicklink-title {text-align: center;} .quickmenubox .quicklink-title .btn-sh1 {left: 5px; margin-top: -10px;} .quickmenubox .quickmenu-list {border-top: 1px solid #ddd; background-color: #fff;} .quickmenubox .quickmenu-list .list {position: relative;} .quickmenubox .quickmenu-list .list + .list::after {content: ''; display: block; height: 1px; background-color: #ccc; position: absolute; top: 0; left: 5px; right: 5px;} .quickmenubox .quickmenu-list .link {display: block; text-align: center; padding: 9px 0 8px;} .quickmenubox .quickmenu-list .ico {width: 36px; height: 36px; margin-bottom: 3px; border-radius: 36px; background-color: #ececec; background-position: center center; background-repeat: no-repeat;} .quickmenubox .quickmenu-list .ico.ico-qm1 {background-image: url(../images/common/ico-qLink1.png);} .quickmenubox .quickmenu-list .ico.ico-qm2 {background-image: url(../images/common/ico-qLink2.png);} .quickmenubox .quickmenu-list .ico.ico-qm3 {background-image: url(../images/common/ico-qLink3.png);} .quickmenubox .quickmenu-list .ico.ico-qm4 {background-image: url(../images/common/ico-qLink4.png);} .quickmenubox .quickmenu-list .text {font-size: 12px; color: #333; line-height: 14px; font-weight: 500;} .quickmenubox .quickmenu-list .link:hover {background-color: #ececec;} /*.quickmenubox .quickmenu-list .link:hover .ico {background-color: #cecece;} .quickmenubox .quickmenu-list .link:hover .text {color: #f36f20;}*/ .quickmenubox .btn-top {display: none; border-top: 1px solid #ddd; text-align: center; font-size: 12px; font-weight: 500; padding: 7px 0; background-color: #eee;} .quickmenubox .btn-top::after {content: ''; display: inline-block; width: 16px; height: 18px; margin-left: 10px; background: url(../images/common/ico-top.png) center center no-repeat; vertical-align: middle;} .quickmenubox .btn-top:hover {background-color: #ccc;} .quickmenubox .btn-top.show {display: block;} .quickmenubox .btn-hide {display: none;} .quickbannerbox {border: 1px solid #ddd; border-radius: 3px; margin-top: 17px; background-color: #fff;} .quickbannerbox .quickbanner {} .quickbannerbox .quickbanner .link {display: block;} .quickbannerbox .quickbanner .link img {max-width: 100%;} .quickbannerbox .slick-slider.quickbanner-slider .slick-arrow {width: 17px; height: 17px; border: 1px solid #f9b796; background-color: transparent; top: auto; bottom: 12px;} .quickbannerbox .slick-slider.quickbanner-slider .slick-prev {left: 50%; margin-left: -20px; padding-right: 0;} .quickbannerbox .slick-slider.quickbanner-slider .slick-next {right: 50%; margin-right: -20px; padding-left: 0;} .quickbannerbox .slick-slider.quickbanner-slider .slick-arrow::before {width: 5px; height: 7px; background-image: url(../images/common/ico-quickBanner-arrow.png); background-position: center center; margin-top: -3px;} .quickbannerbox .slick-slider.quickbanner-slider .slick-arrow:hover {background-color: rgba(0,0,0,0.5);} .quickbannerbox .slick-slider.quickbanner-slider .slick-arrow:hover::before {background-position: center center;} .quickbannerbox .btn-hide {display: none;} .quickbtnbox {border: 1px solid #ddd; border-radius: 3px; margin-top: 17px; background-color: #fff;} .quickbtnbox .quickbtn {padding: 13px 5px 9px; text-align: center; display: block;} .quickbtnbox .quickbtn:hover {background-color: #eee;} .quickbtnbox .quickbtn .ico {text-align: center;} .quickbtnbox .quickbtn .ico img {max-width: 55px; max-height: 56px;} .quickbtnbox .quickbtn .txt {font-size: 12px; line-height: 17px; color: #f36f20;} .quick-area, .quick-left, .quick-right, .quick-right2 {position: fixed; /*top: 215px;*/ z-index: 5; transition: 0.5s;} .quick-left {left: 50%; margin-left: -776px;} .quick-right {right: 50%; margin-right: -711px;} .quick-right .inbox {width: 87px; position: relative;} .quick-right .inbox .btn-hide {z-index: 1; position: absolute; right: -10px; top: -14px;} .quick-area {top: 40px; left: 5px; right: 5px; display: none;} .quick-area .quick-left, .quick-area .quick-right, .quick-area .quick-right2 {position: absolute; margin: 0;} .quick-area .quick-left {left: 10px;} .quick-area .quick-right, .quick-area .quick-right2 {right: 10px;} .quick-area.type2 {top: 6px; right: 20px;} .quick-area.type2 .quickmenubox .quicklink-title {display: flex; flex-direction: row; align-items: center; justify-content: space-between;} .quick-area.type2 .quickmenubox .quicklink-title .title {padding: 0;} .quick-area.type2 .quickmenubox .quicklink-title .btn-sh1 {position: relative; margin: 0; left: 0;} .quick-area.type2 .quickmenubox .quickmenu-list .title {padding: 4px 10px; background-color: #f36f20; color: #fff;} .quick-area.bottomtype {/*top: 50%; margin-top: -17%;*/ top : 30px} .quick-area .btn-hide {text-indent: -999rem; width: 25px; height: 25px; border-radius: 25px; background-image: url(../../common/images/common/ico-ql-hide.png); background-position: 0 0; background-repeat: no-repeat; box-shadow: 0 0 5px 0 rgba(249,92,23,0.3);} .quick-area .btn-hide:hover {background-position: -25px 0;} .quick-area.bottomtype .quickmenubox {border: 1px solid #ddd;} .quick-area [class*="ico-qr-"] {text-indent: -999rem; width: 20px; height: 20px; display: inline-flex; align-items: center; justify-content: center;} .quick-area [class*="ico-qr-"]::before {content: ''; display: block; width: 20px; height: 20px; background-position: center center; background-repeat: no-repeat;} .quick-area .ico-qr-help::before {background-image: url(../images/common/ico-qr-help.png);} .quick-area .ico-qr-setting::before {background-image: url(../images/common/ico-qr-setting.png);} .quick-area .ico-qr-admin::before {background-image: url(../images/common/ico-qr-admin.png);} .quick-area .ico-qr-uSearch::before {background-image: url(../images/common/ico-qr-uSearch.png);} .quick-area [class*="btnQR-"] {display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; border: 1px solid #ccc; border-radius: 3px; margin-bottom: 5px;} .quick-area [class*="btnQR-"]::before {content: ''; display: block;} .quick-area [class*="btnQR-"] .txt {text-indent: -999rem;} .quick-area [class*="btnQR-"]:hover {background-color: rgba(0, 0, 0, 0.05);} .quick-area .btnQR-search::before {width: 24px; height: 24px; background: url(../images/common/ico-header-search.png) center center no-repeat; transform: scale(.7);} .quick-area .btnQR-quick::before {content: 'Q'; font-size: 19px; line-height: 21px; font-family: 'Malgun Gothic', '맑은 고딕','arial', dotum, '돋움', sans-serif; font-family: 'HankookTire', sans-serif; font-weight: 400; margin-bottom: 1px; color: #1c1c1c;} .quick-area .btnQR-top::before {content: 'Top'; font-size: 13px; line-height: 18px; font-family: 'HankookTire', sans-serif; font-weight: 500; letter-spacing: -0.05em; color: #1c1c1c;} .quick-area .qr-view {background-color: #fff; border: 1px solid #ccc; border-radius: 3px; position: absolute; right: -200px; top: 0; transition: .3s;} .quick-area .qr-view .qr-quick {} .quick-area .qr-view .qr-quick dt, .quick-area .qr-view .qr-quick dd {font-size: 12px; line-height: 17px;} .quick-area .qr-view .qr-quick dt {text-align: center; border-bottom: 1px solid #ccc; padding: 5px 30px;} .quick-area .qr-view .qr-quick dt + dd {margin-top: 5px;} .quick-area .qr-view .qr-quick dd:last-child {margin-bottom: 5px;} .quick-area .qr-view .qr-quick dd .btn {display: flex; align-items: center; justify-content: flex-start; padding: 3px 7px;} .quick-area .qr-view .qr-quick dd .btn [class*="ico-qr-"] {opacity: .7;} .quick-area .qr-view .qr-quick dd .btn .txt {font-size: 12px; line-height: 17px; letter-spacing: -0.02em; word-spacing: -0.05em;} .quick-area .qr-view .qr-quick dd .btn:hover {background-color: rgba(0, 0, 0, 0.05);} .quick-area .qr-view .qr-quick dd .btn [class*="ico-qr-"] + .txt {margin-left: 5px;} .quick-area .qr-view .btn-top {display: flex; justify-content: center; align-items: center; border-top: 1px solid #ccc; text-align: center; font-size: 12px; line-height: 17px; padding: 3px 0;} .quick-area .qr-view .btn-top::before {content: ''; display: block; width: 20px; height: 20px; background: url(../images/common/ico-top.png) center center no-repeat; transform: scale(.7);} .quick-area .qr-view .btn-top .txt {padding-bottom: 1px;} .quick-area .qr-view .btn-top:hover {background-color: rgba(0, 0, 0, 0.05);} .quick-area .qr-view .btn-close {text-indent: -999rem; width: 20px; height: 20px; position: absolute; top: 3px; right: 3px;} .quick-area .qr-view .btn-close::before {content: ''; display: block; width: 20px; height: 20px; background: url(../images/common/ico-del1.png) center center no-repeat;} .quick-area .qr-view .btn-close:hover {background-color: rgba(0, 0, 0, 0.08);} .quick-area .qr-view.open {display: block; right: 0; transition: .3s;} /* #wrap.type2 .quick-area {display: none;} */ /* #wrap.type2 .quick-area .quick-right2 {margin-top: 65px;} */ #wrap.type2 .quick-area.type2 {top: 78px;} /*layout type2 quick*/ /*.mainHtml .quick-area {width: 1663px; top: 128px; left: 50%; margin-left: -849px; right: auto;} .mainHtml .quick-area .quick-left, .mainHtml .quick-area .quick-right {position: absolute; margin: 0;} .mainHtml .quick-area .quick-left {left: 0;} .mainHtml .quick-area .quick-right {right: 0;} .mainHtml .quicklinkbox .btn-hide {display: block; right: -10px; bottom: -14px;} .mainHtml .quicklinkbox .quicklink-title {padding: 14px 25px 15px 7px;}*/ /************************************************fullpage************************************************/ .fullHtml {} .fullHtml, .fullHtml body {min-width: 100%;} #full-wrap {width: 100%; height: 100%; text-align: center;} #full-wrap .fp-inbox {} .errorpage {padding: 0 15px;} .errorpage .linelink {color: #f36f20; position: relative; text-shadow: 0.4px 0 0 #f36f20;} .errorpage .linelink::after {content: ''; display: block; width: 100%; height: 1px; background-color: #f36f20;} .errorpage .error-name {display: inline-flex; align-items: center; width: 100%; justify-content: center;} .errorpage .error-name::before {content: ''; width: 82px; height: 82px; background: url('../images/common/ico-error1.png'); background-size: 100% auto; display: inline-block;} .errorpage .error-name .txt {display: inline-block; vertical-align: middle; margin-left: 30px; font-size: 60px; line-height: 70px; color: #333; text-shadow: 0.8px 0 0 #333;} .errorpage .error-name .ico {display: none;} .errorpage .error-tit {font-size: 30px; line-height: 40px; color: #333; text-shadow: 0.5px 0 0 #333; text-transform: uppercase; letter-spacing: -0.02em;} .errorpage .error-txt {font-size: 18px; line-height: 27px; color: #333; text-shadow: 0.4px 0 0 #333;} .errorpage .error-txt.type1 {color: #5e5e5e;} .errorpage .error-name + .error-tit {margin-top: 10px;} .errorpage .error-tit + .error-txt {margin-top: 10px;} .noData-area {display: flex; flex-direction: column; width: 100%; align-content: center; justify-content: center; min-height: 120px;} .noData-area .noData-tit {font-family: 'Noto Sans KR', sans-serif; font-size: 22px; list-style: none; line-height: 1; font-weight: 500; text-align: center;} .noData-area.grid-h1 .noData-tit {padding-top: 30px;} .noData-area.grid-h2 .noData-tit {padding-top: 60px;} .noData-area.grid-h3 .noData-tit {padding-top: 90px;} .fullWrap-header {text-align: left; padding: 23px 45px 20px 13px; font-size: 0;} .fullWrap-header .logo, .fullWrap-header .title {display: inline-block; vertical-align: middle;} .fullWrap-header .logo {text-indent: -999rem; width: 228px; height: 36px; background-image: url(../images/common/logo.png); background-position: center center; background-repeat: no-repeat;} .fullWrap-header .title {width: calc(100% - 228px); color: #f36f20; font-size: 20px; line-height: 25px; font-weight: bold; text-align: right; letter-spacing: 0.005em; word-spacing: -0.06em; padding-top: 0; margin-top: -4px;} .fullWrap-header.bbtype {border-bottom: 1px solid #bcbcbc;} .fullWrap-header.bgGreay {background-color: #666; position: relative; padding: 23px 25px 13px 25px;} .fullWrap-header.bgGreay .bgG-title {font-size: 20px; color: #fff; text-shadow: 0.5px 0 0 #fff; line-height: 25px; padding-right: 20px; padding-left: 32px; position: relative;} .fullWrap-header.bgGreay .bgG-title::before {content: ''; display: block; width: 18px; height: 18px; border: 1px solid #ccc; border-radius: 2px; background-color: #fff; box-sizing: border-box; position: absolute; top: 2px; left: 0;} .fullWrap-header.bgGreay .close {width: 40px; height: 40px; position: absolute; top: 50%; right: 35px; margin-top: -21px;} .fullWrap-header.bgGreay .close::before, .fullWrap-header.bgGreay .close::after {content: ''; display: block; background-color: #fff; width: 2px; height: 24px; position: absolute; top: 50%; left: 50%; margin-top: -12px; margin-left: -1px;} .fullWrap-header.bgGreay .close::before {transform: rotate(45deg);} .fullWrap-header.bgGreay .close::after {transform: rotate(-45deg);} .fullWrap-header.bgGreay .close:hover {background-color: rgba(0,0,0,0.2);} .fullWrap-content {} .fullWrap-content .htmlname-box { text-align: left; font-size: 13px; font-weight: bold; color: #333; padding: 14px 22px 12px; background-color: #fff; border-bottom: 1px solid #bcbcbc;} .fullWrap-content .htmlname-box.type1 {border-top: 1px solid #bcbcbc;} /**************************************************login**************************************************/ .loginHtml, .loginHtml body {background-color: #fff; min-width: 100%; } #wrap-login {width: 100%; height: 100%; display: table; position: relative;} #wrap-login .login-inner {display: table-cell;} #wrap-login .header{position:relative;display:block;width:100%;height: auto;margin:36px auto;} #wrap-login .header .logo{display: block; text-align: center;} #wrap-login .header .logo img {} #wrap-login .header .glp-info{ width: 180px; position: absolute; top: 50%; right: 30px; transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%);} #wrap-login .header .glp-info .table-list th{ height: 20px; font-size: 9px;} #wrap-login .header .glp-info .table-list td{ font-size: 9px; padding: 2px 10px;} #wrap-login #container {width: 100%; height: 755px; border-left: 0 none;} #wrap-login .inner-contain {width:100%; position:relative; height: 100%; box-sizing: border-box;} #wrap-login .visual{/*position: absolute; top: 0; left: 0; right: 0; bottom: 0;*/width: 100%; height: 100%;} #wrap-login .visual .bg-area{width: 100%;height: 100%;background-image:url("../images/login/bg_login.jpg");background-repeat:no-repeat;background-position:center center; background-size: cover;} #wrap-login .visual .bg-area .bg{} #wrap-login .visual .left, #wrap-login .visual .right {position:absolute;z-index:1;width: 4.35%;height: calc(100% + 2px);} #wrap-login .visual .left{top:-1px;left:0;} #wrap-login .visual .right{right:0;bottom:-1px;} #wrap-login .visual::before, #wrap-login .visual::after {content: ''; display: block; position: absolute; top:-1px; bottom: -1px; background-color: #fff; width: 1.65%; z-index: 2;} #wrap-login .visual::before {left: 0;} #wrap-login .visual::after {right: 0;} #wrap-login .login-wrap{display: block; width: 414px; max-width: calc(80% - 10px); background-color: #ffffff; box-sizing: border-box; position: relative; margin: 0 auto; z-index: 1; transition: 0.5s; position: absolute; top: 50%; left: 50%; margin-top: -243px; margin-left: -207px;} #wrap-login .login-wrap .info-bx{text-align: center; padding: 22px 43px 42px 44px;} #wrap-login .login-wrap .info-bx .sct-bx{margin-bottom:10px;} #wrap-login .login-wrap .info-bx .sct-bx select{padding:0 0 0 29px;height:38px;line-height:38px;width:100%;box-sizing:border-box;font-size:13px;background-color: #efefef;color:#a8a8a8;border:1px solid #a5a5a5;} #wrap-login .login-wrap .info-bx .input {padding: 0 29px; letter-spacing: 0.02em; width: 100%; height: 50px; margin: 0 0 15px 0; font-size: 14px; font-weight: 500; color: #666; border: 1px solid #dbdbdb; box-sizing: border-box; border-radius: 3px; text-shadow: 0.5px 0 0 #666;} #wrap-login .login-wrap .info-bx .input:hover, #wrap-login .login-wrap .info-bx .input:focus {border-color: #000;} #wrap-login .login-wrap .info-bx .input::placeholder {color: #999;} #wrap-login .login-wrap .info-bx .input::-webkit-input-placeholder {color: #999;} #wrap-login .login-wrap .info-bx .input::-moz-placeholder {color: #999;} #wrap-login .login-wrap .info-bx .input:-ms-input-placeholder{color: #999;} #wrap-login .login-wrap .info-bx .input::-ms-input-placeholder{color: #999;} #wrap-login .login-wrap .info-bx .chk-box{display:block; text-align: left;} #wrap-login .login-wrap .info-bx .chk-box .check {display: block;} #wrap-login .login-wrap .info-bx .chk-box .check input[type='checkbox'] + label {font-size: 14px; color: #666; padding-left: 33px;} #wrap-login .login-wrap .info-bx .btn-login{display: block; width: 100%; font-size: 18px; line-height: 35px; padding: 20px 0; background-color: #666; color: #ffffff; border-radius: 3px; letter-spacing: 0.03em;} #wrap-login .login-wrap .info-bx .btn-login:hover {background-color: #444;} #wrap-login .login-wrap .info-bx .btn-login:disabled{background-color:#9e9e9e;} #wrap-login .footer{padding:20px 2.2%;text-align:center;background-color:#fff;font-size:13px; position: relative;} #wrap-login .footer .logo {} #wrap-login .footer .logo img {} #wrap-login .footer .copyright{display:block;color:#666666;font-size:12px;vertical-align:top; margin-top: 6px; letter-spacing: -0.008em;font-weight: 400;} #wrap-login .footer .info-cs {display: block; font-size: 12px; color: #666; position: absolute; right: 2.2%; top: 22px;} #wrap-login .footer .info-cs span {font-weight: bold; letter-spacing: -0.005em;} #wrap-login .footer .info-cs span + span {margin-left: 7px;} #wrap-login .footer .info-cs .txt1 {background: url(../images/login/icon-CS.png) 0 5px no-repeat; padding-left: 16px; letter-spacing: 0;} #wrap-login .footer .info-cs .txt2 {} #wrap-login .textbox {text-align: left; margin-bottom: 22px;} #wrap-login .textbox .txt1 {font-size: 20px; line-height: 25px; color: #333;} #wrap-login .textbox .txt2 {font-size: 21px; line-height: 26px; color: #666;} #wrap-login .textbox .txt2 strong {font-weight: bold;} #wrap-login .textbox .txt2 span {font-weight: normal;} #wrap-login .textbox .txt1 + .txt2 {margin-top: 9px;} #wrap-login .login-wrap .info-bx .link {font-size: 14px; color: #666; font-weight: 500;} #wrap-login .login-wrap .info-bx .link:hover {color: #f36f20;} #wrap-login .login-wrap .info-bx .chkFindbox {padding-bottom: 25px; margin-top: 4px;} #wrap-login .login-wrap .info-bx .chkFindbox .fl {} #wrap-login .login-wrap .info-bx .chkFindbox .fr {font-weight: 400;} #wrap-login .langselbox .lang {display: block; padding: 7px 26px 11px 16px; text-align: left; white-space: nowrap;} #wrap-login .langselbox .lang:hover {background-color: rgba(0,0,0,0.05);} #wrap-login .langselbox .lang img, #wrap-login .langselbox .lang span {display: inline-block; vertical-align: middle;} /* #wrap-login .langselbox .lang img {width: 18px; height: auto; margin-top: 1px;} */ #wrap-login .langselbox .lang span {max-width: calc(100% - 22px); padding-left: 9px; text-align: center; font-size: 14px; color: #333; font-weight: 500;} #wrap-login .langselbox .lang-selList {position: relative; display: inline-block; /*width: auto; min-width: 164px;*/ width: 100%;} #wrap-login .langselbox .lang-sel {} #wrap-login .langselbox .lang-sel .lang {position: relative;} #wrap-login .langselbox .lang-sel .lang::after {content: ''; display: block; width: 8px; height: 7px; background: url(../images/login/ico-lang-arrow.png) center center no-repeat; position: absolute; right: 10px; top: 50%; margin-top: -4px; transform: rotate(180deg);} #wrap-login .langselbox .lang-list {display: none; position: absolute; top: 39px; left: 0; right: 0; border: 1px solid #ddd; background-color: #fff; z-index: 3;} #wrap-login .langselbox .lang-list .lang {padding-top: 6px; padding-bottom: 8px;} #wrap-login .langselbox .lang-list .lang img {} #wrap-login .langselbox .lang-selList.open .lang-list {display: block;} #wrap-login .langselbox .lang-selList.open .lang-sel .lang::after {transform: rotate(0deg);} #wrap-login .langbox-area {text-align: right; padding: 6px 0;} #wrap-login .ico-adminSet {text-indent: -999rem; width: 44px; height: 30px; background: url(../images/common/ico-adminSet.png) center center no-repeat;} #wrap-login .textbox .ico-adminSet {display: inline-block; vertical-align: bottom; margin-left: 10px;} .adminHtml #wrap-login .login-wrap .info-bx .chk-box .check input[type='checkbox'] + label {padding-left: 4px;} .cp-link {margin: 12px 0 7px; font-size: 14px; color: #666;} .login-wrap .side-txt1 {font-size: 12px;} .login-wrap .side-txt2 {font-size: 11px; color: #959393;} .login-foot-info {position: relative; clear: both; padding: 39px 0 0 3px; text-align: left; font-size: 12px; color: #333; line-height: 18px; letter-spacing: -0.02em;} .login-foot-info:before {content: ""; position: absolute; left: 0; top: 0; width: 24px; height: 24px; background: url(../images/common/ico-info2.png) no-repeat center center;} .login-foot-info .s-link {text-decoration: underline;} @keyframes rotate { from { -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } } /*loading, progressbar*/ .loadingbar {display: none; position: fixed; width: 100%; height: 100%; top: 0; left: 0; background-color: rgba(0,0,0,0.4); z-index: 200;} .loadingbar .loadingbarbox {display: table; text-align: center; width: 100%; height: 100%;} .loadingbar .loadingbar-in {display: table-cell; vertical-align: middle;} .loadingbar .loadingbar-in p {color: #ed6d00; font-size: 18px; font-weight: bold; padding-top: 82px; background: url(../images/common/loading.gif) no-repeat center 0;} .loadingbar2 {height: 100vh; position: fixed; width: 100%; display: flex; flex-direction: column; color: #fff; justify-content: center; align-items: center; top: 0; z-index: 1001; background-color: rgba(0, 0, 0, 0.4); margin: 0;} .loadingbar3 {display: flex; flex-direction: column; justify-content: center; align-items: center; z-index: 4; color: #fff; background-color: rgba(0, 0, 0, 0.4); margin: 0; position: absolute; top: 0; left: -13px; right: 0; bottom: 0;} .progressbar {display: none; position: fixed; width: 100%; height: 100%; top: 0; left: 0; background-color: rgba(0,0,0,0.3); z-index: 200;} .progressbar .progressbarbox {display: table; text-align: center; width: 100%; height: 100%;} .progressbar .progressbar-in {display: table-cell; vertical-align: middle;} .pbarbtn .bar, .progressbar .progressbar-in .bar {width: 350px; height: 14px; margin: 0 auto; padding: 3px 6px; border-radius: 14px; background-color: #ddd; text-align: left;} .pbarbtn .bar .per, .progressbar .progressbar-in .per {width: auto; height: 8px; background-color: #ec6608; border-radius: 10px; vertical-align: top; transition: 0.3s;} .progressbar .progressbar-in p {color: #fff; font-size: 18px; font-weight: bold; margin-top: 32px; font-family: 'HankookTire', sans-serif;} .position-r > .loadingbar, .position-r > .progressbar, [class*="ag-theme"] .loadingbar {position: absolute; z-index: 100;} /*[class*="ag-theme"] .loadingbar {background-color: transparent;} [class*="ag-theme"] .loadingbar .loadingbar-in p {background: none; position: relative;} [class*="ag-theme"] .loadingbar .loadingbar-in p::before {content: ''; display: block; width: 66px; height: 66px; background: url(../images/common/loading.png) center center no-repeat; animation: rotate 2s infinite linear; position: absolute; top: 0; left: 50%; margin-left: -33px;}*/ /*버튼형 progressbar*/ .pbarbtn {position: relative; padding: 15px 5px 0 !important; pointer-events: none;} .pbarbtn .bar {width: auto; height: 10px; padding: 2px 4px; position: absolute; left: 5px; right: 5px; top: 3px;} .pbarbtn .bar .per {display: inline-block; height: 6px;} .pbarbtn [class*=txt] {font-size: 10px !important; line-height: 12px !important;} .pbarbtn [class*=txt] em {font-size: 11px; font-weight: bold;} .btn-ix.pbarbtn {background-color: #fff !important; border: 1px solid #cccccc !important;} .btn-ix.pbarbtn [class*=txt] {color: #808080 !important;} .btn-ix.pbarbtn [class*=txt] em {color: #ec6608;} .table-view .fr-toolbar { border: 0px solid #CCCCCC !important; } .btn-topmove-p {width: 64px; height: 64px; padding-top: 30px; border: 1px solid #719326; border-radius: 64px; text-align: center; background: #8dbf21 url(../images/common/ico-arrow1.png) center 10px no-repeat; z-index: 3; position: absolute; right: 30px; bottom: 30px; opacity: 0; transition: 1s;} .btn-topmove-p > span {font-size: 15px; font-weight: 500; line-height: 15px; color: #fff;} .btn-topmove-p.show {bottom: 55px; opacity: 1;} .btn-topmove-p:hover {background-color: #719326;} .w2ui-tag {margin: -5px 0 0 4px;} /* layout type2 */ /* header */ #wrap.type2 #contents {position: fixed; width: 100%; height: 100%; top: 68px; overflow-y: auto;} #wrap.type2 .header-top {position: fixed; z-index: 1; width: 100%; height: 68px; background-color: #3d3d3d; border-bottom: none; margin-top: 0; transition: .3s;} #wrap.type2 .header-top .inner {display: flex; flex-direction: row; align-items: center; width: 100%; min-width: 1420px; height: 100%; padding: 0 28px;} #wrap.type2 .header-top .logobox {flex: 0 0 72px; height: 30px; margin-bottom: 4px; padding: 0;} #wrap.type2 .header-top .logobox .logo {text-indent: -999rem; width: 100%; height: 100%; background-image: url(../images/layout/logo.png); background-position: 0 center; background-repeat: no-repeat;} #wrap.type2 .header-top .gnb {position: relative; z-index: 10; margin-left: 120px; height: 100%;} #wrap.type2 .header-top .gnb .gnb-tab {display: flex; flex-direction: row; justify-content: space-between; margin: 0; height: 100%;} #wrap.type2 .header-top .gnb .gnb-tab > li {margin: 0 2px;} #wrap.type2 .header-top .gnb .gnb-tab > li > .link {position: relative; z-index: 11; display: inline-flex; align-items: center; justify-content: center; height: 100%; padding: 5px 24px; color: #fff; font-size: 17px; font-weight: 500;} #wrap.type2 .header-top .gnb .gnb-tab > li.on > .link, #wrap.type2 .header-top .gnb .gnb-tab > li:hover > .link {color: #ec6608;} #wrap.type2 .header-top .gnb .gnb-tab > li.on > .link::after, #wrap.type2 .header-top .gnb .gnb-tab > li:hover > .link::after {content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 5px; background-color: #ec6608;} #wrap.type2 .header-top .gnb .gnb-tab > li .link.home {position: relative; background: url(../images/layout/ico-home1.png) no-repeat 22px center; padding-left: 54px;} #wrap.type2 .header-top .gnb .gnb-tab > li .link.home::before {content: ""; position: absolute; right: 0; top: 50%; width: 1px; height: 10px; margin-top: -4px; background-color: #666;} #wrap.type2 .header-top .btnbox {position: relative; height: 100%; margin-left: auto;} #wrap.type2 .header-top .btnbox .btn {position: relative; text-indent: 0; background-color: transparent; flex-direction: column;} #wrap.type2 .header-top .btnbox .btn::before {content: none;} #wrap.type2 .header-top .btnbox .btn::after {content: ''; display: block; width: 1px; height: 16px; background-color: #5d5d5d; position: absolute; left: 0; top: 50%; margin-top: -8px;} #wrap.type2 .header-top .btnbox .search-box + .btn::after {content: none;} #wrap.type2 .header-top .btnbox .btn .txt {display: block; text-indent: 0; position: static; font-size: 11px; color: #fff; opacity: 1;} #wrap.type2 .header-top .btnbox .btn.user:hover .mypage-layer {position: fixed; display: block; top: 42px; right: 10px; margin-top: 14px; box-shadow: 3px 0px 4px rgb(0 0 0 / 10%); border-radius: 5px;} #wrap.type2 .header-top .btnbox .btn.user:hover .mypage-layer .mypage-layer-top {padding: 8px 12px;} #wrap.type2 .header-top .btnbox .btn.user:hover .mypage-layer .mypage-layer-top .title {font-size: 14px;} #wrap.type2 .header-top .btnbox .btn.user:hover .mypage-layer .mypage-layer-info {padding: 12px;} #wrap.type2 .header-top .btnbox .btn.user:hover .mypage-layer .mypage-layer-info .info {font-size: 14px;} #wrap.type2 .header-top .btnbox .btnSitemap {width: 70px;} #wrap.type2 .header-top .btnbox .btn .noti-cnt {width: 17px; height: 14px; line-height: 14px; border-radius: 7px; background-color: #ec6608;} #wrap.type2 .header-top .btnbox .btn .ico-map {background-image: url(../images/layout/ico-map.png); height: 22px;} #wrap.type2 .header-top .btnbox .btn .ico-noti2 {background-image: url(../images/layout/ico-noti.png);} #wrap.type2 .header-top .btnbox .btn .ico-user2 {background-image: url(../images/layout/ico-user.png);} #wrap.type2 .header-top .btnbox .btn .ico-logout {background-image: url(../images/layout/ico-logout.png);} #wrap.type2 .header-top .btnbox .btn-ix {height: 39px; background-color: #555; border: none; border-radius: 6px;} #wrap.type2 .header-top .btnbox .btn-ix .ix-txt {color: #fff;} #wrap.type2 .header-top .btnbox .btn-ix:hover {background-color: #666;} #wrap.type2 .header-top .search-box {display: flex; flex-direction: row; align-items: center; width: 274px; height: 39px; background-color: #555; margin-left: 6px; border-radius: 6px; padding: 0 9px; overflow: hidden;} #wrap.type2 .header-top .search-box .input {flex: 1; font-size: 13px; color: rgba(255, 255, 255, .4); background-color: transparent; border: none;} #wrap.type2 .header-top .search-box .btn-search {display: flex; flex-direction: row; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 6px; background: none;} #wrap.type2 .header-top .search-box .btn-search:hover {background-color: #666;} #wrap.type2 .header-top .search-box .ico-search {width: 18px; height: 18px; background: url(../images/layout/ico-search.png) no-repeat center center;} .ico-favo-on {width: 16px; height: 16px; background: url(../images/layout/ico-favo-on.png) no-repeat center center;} .ico-favo-off {width: 16px; height: 16px; background: url(../images/layout/ico-favo-off.png) no-repeat center center;} #wrap.type2.fixed #contents {top: 0;} #wrap.type2.fixed .header-top {margin-top: -42px;} #wrap.type2.fixed .cont-lc-area .lc-leftbox.openTab-area {top: 0;} #wrap.type2 .cont-lc-area .lc-rightbox .page-top.fixed {position: fixed; top: 42px; left: 0; right: 0; width: auto; z-index: 2; background-color: #fff; padding: 10px 30px 0;} #wrap.type2.fixed .cont-lc-area .lc-rightbox .page-top.fixed {top: 0;} #wrap.type2 .cont-lc-area .lc-leftbox.openTab-area.open + .lc-rightbox .page-top.fixed {left: 42px;} #wrap.type2 .cont-lc-area .lc-leftbox.openTab-area.open.fixed + .lc-rightbox .page-top.fixed {left: 220px;} #wrap.type2 .header-top .gnb .gnb-layer {display: none; position: fixed; z-index: 10; width: 100%; left: 0; background-color: #fff;} #wrap.type2 .header-top .gnb .gnb-layer.open {display: block;} #wrap.type2 .header-top .gnb .gnb-layer.open::before {content: ""; position: fixed; left: 0; right: 0; top: 0; bottom: 0; background-color: rgba(0, 0, 0, .3);} #wrap.type2 .header-top .gnb .gnb-layer .util-menu {position: relative; display: flex; flex-direction: row; align-items: center; justify-content: center; padding: 15px 0 0; background-color: #fff;} #wrap.type2 .header-top .gnb .gnb-layer .util-menu .btn-toggle {margin-right: 8px;} #wrap.type2 .header-top .gnb .gnb-layer .menu-list {position: relative; display: flex; flex-direction: column; width: 100%; height: 100%;} #wrap.type2 .header-top .gnb .gnb-layer .menu-list > .menu {position: absolute; left: 0; top: 0; width: 100%; padding: 0 20px; background-color: #fff; border-bottom: 1px solid #999;} #wrap.type2 .header-top .gnb .gnb-layer .menu-list > .menu:last-child {padding-bottom: 10px;} #wrap.type2 .header-top .gnb .gnb-layer .menu-list > .menu .depth-wrap {width: 100%; max-height: 500px; overflow-y: auto; margin: 18px 0;} #wrap.type2 .header-top .gnb .gnb-layer .menu-list > .menu .depth-wrap::-webkit-scrollbar {width: 5px; height: 5px;} #wrap.type2 .header-top .gnb .gnb-layer .menu-list > .menu .depth-wrap::-webkit-scrollbar-track {background-color: #fff;} #wrap.type2 .header-top .gnb .gnb-layer .menu-list > .menu .depth-wrap::-webkit-scrollbar-thumb {background-color: rgba(153, 153, 153, .3); border-radius: 5px;} #wrap.type2 .header-top .gnb .gnb-layer .menu-list > .menu .depth {display: none; margin-top: 10px;} #wrap.type2 .header-top .gnb .gnb-layer .menu-list .menu.on {display: block;} #wrap.type2 .header-top .gnb .gnb-layer .menu-list .menu.on > .depth {display: block;} #wrap.type2 .header-top .gnb .gnb-layer .menu-list > .menu .depth > .menu {margin-top: 14px;} #wrap.type2 .header-top .gnb .gnb-layer .menu-list > .menu .depth > .menu::before {content: ""; position: absolute; left: 0; top: 10px; width: 4px; height: 1px; background-color: #bbb;} #wrap.type2 .header-top .gnb .gnb-layer .menu-list .tab-box {display: flex; flex-direction: row; border-bottom: 1px solid #888;} #wrap.type2 .header-top .gnb .gnb-layer .menu-list .tab-box .tab {position: relative; min-width: 71px; border: 1px solid #888; border-bottom: none; border-radius: 2px 2px 0 0; background-color: #fff; text-align: center; font-size: 14px; color: #3f3c3c;} #wrap.type2 .header-top .gnb .gnb-layer .menu-list .tab-box .tab.on {background-color: #ffefe4; color: #ed6d00;} #wrap.type2 .header-top .gnb .gnb-layer .menu-list .tab-box .tab.on::before {content: ""; position: absolute; z-index: 1; left: 0; bottom: -1px; width: 100%; height: 1px; background-color: #fff;} #wrap.type2 .header-top .gnb .gnb-layer .menu-list .tab-box .tab + .tab {margin-left: 4px;} #wrap.type2 .header-top .gnb .gnb-layer .menu-list .tab-box .tab .link {display: block; height: 31px; line-height: 31px;} #wrap.type2 .header-top .gnb .gnb-layer .btn-close {position: absolute; right: 15px; top: 15px; width: 20px; height: 20px; background: url(../images/layout/ico-close2.png) no-repeat center center; font-size: 0; text-indent: -999rem; overflow: hidden;} #wrap.type2 .header-top .gnb .gnb-layer .menu-list .menu {display: none;} #wrap.type2 .header-top .gnb .gnb-layer .menu-list .menu.on {display: block;} #wrap.type2 .header-top .gnb .gnb-layer .depth-wrap .depth-list {display: flex; justify-content: flex-start; align-items: stretch; flex-direction: row; flex-wrap: wrap;} /* #wrap.type2 .header-top .gnb .gnb-layer .depth-wrap .depth-list:not(.depth-list .depth-list) {border: 1px solid #ddd;} */ #wrap.type2 .header-top .gnb .gnb-layer .depth-wrap .depth-list > li {width: calc((100% - 40px) / 5); margin: 0 10px 10px 0;} #wrap.type2 .header-top .gnb .gnb-layer .depth-wrap .depth-list > li:not(.depth-list .depth-list li):last-child, #wrap.type2 .header-top .gnb .gnb-layer .depth-wrap .depth-list > li:not(.depth-list .depth-list li):nth-child(5n) {margin-right: 0;} /* #wrap.type2 .header-top .gnb .gnb-layer .depth-wrap .depth-list > li:not(.depth-list .depth-list li) {border: 1px solid #ddd; border-right: none; border-left: none;} #wrap.type2 .header-top .gnb .gnb-layer .depth-wrap .depth-list > li:not(.depth-list .depth-list li):first-child, #wrap.type2 .header-top .gnb .gnb-layer .depth-wrap .depth-list > li:not(.depth-list .depth-list li):nth-child(6n) {border-left: 1px solid #ddd;} #wrap.type2 .header-top .gnb .gnb-layer .depth-wrap .depth-list > li:not(.depth-list .depth-list li):nth-child(5) ~ li:not(.depth-list .depth-list li) {border-top: none;} #wrap.type2 .header-top .gnb .gnb-layer .depth-wrap .depth-list > li:not(.depth-list .depth-list li):last-child, #wrap.type2 .header-top .gnb .gnb-layer .depth-wrap .depth-list > li:not(.depth-list .depth-list li):nth-child(5n) {border-right: 1px solid #ddd;} */ #wrap.type2 .header-top .gnb .gnb-layer .depth-wrap .depth-list > li > .menu {display: flex; justify-content: space-between; align-items: center; background-color: #f4f4f4; padding: 4px 0; border-bottom: 1px solid #ddd;;} #wrap.type2 .header-top .gnb .gnb-layer .depth-wrap .depth-list > li > .menu > .link {width: 100%; max-width: 100%; height: 30px; line-height: 30px; display: inline-flex; align-items: center; justify-content: flex-start; position: relative; font-size: 14px; padding: 2px 24px; word-break: keep-all;} #wrap.type2 .header-top .gnb .gnb-layer .depth-wrap .depth-list > li > .menu > .link::before {content: ''; display: block; width: 11px; height: 6px; background: url(../images/common/ico-arrow2.png) no-repeat center center; position: absolute; top: 50%; right: 18px; margin-top: -3px; transform: rotate(180deg);} #wrap.type2 .header-top .gnb .gnb-layer .depth-wrap .depth-list > li > .menu:not(.depth-list .depth-list .menu) {border-top: 1px solid #ddd;} #wrap.type2 .header-top .gnb .gnb-layer .depth-wrap .depth-list > li:not(.depth-list .depth-list li):last-child > .menu, #wrap.type2 .header-top .gnb .gnb-layer .depth-wrap .depth-list > li:not(.depth-list .depth-list li):nth-child(5n) > .menu {border-right: none;} #wrap.type2 .header-top .gnb .gnb-layer .depth-wrap .depth-list > li .depth-list {padding: 10px 0;} #wrap.type2 .header-top .gnb .gnb-layer .depth-wrap .depth-list > li .depth-list li {width: 100%; margin: 0;} #wrap.type2 .header-top .gnb .gnb-layer .depth-wrap .depth-list > li .depth-list li .menu {padding: 0; border-bottom: none; background-color: transparent;} #wrap.type2 .header-top .gnb .gnb-layer .depth-wrap .depth-list > li .depth-list li .menu .link::before {content: none;} #wrap.type2 .header-top .gnb .gnb-layer .depth-wrap .depth-list > li > .menu > .btn-favorite {background: none; margin-right: 16px;} #wrap.type2 .header-top .gnb .gnb-layer .depth-wrap .depth-list > li > .menu > .btn-favorite::before {content: ''; display: block; width: 15px; height: 15px; background: url(../images/common/ico-favo2-off.png) center center no-repeat;} #wrap.type2 .header-top .gnb .gnb-layer .depth-wrap .depth-list > li > .menu > .btn-favorite.on::before {background-image: url(../images/common/ico-favo2-on.png);} #wrap.type2 .header-top .gnb .gnb-layer .menu.has-depth .depth-wrap .menuIn-tabox .tab-ul {display: flex; flex-wrap: wrap; flex-direction: row; margin-bottom: 18px;} /* left tab area */ #wrap.type2 .cont-lc-area .lc-leftbox.openTab-area {z-index: 10; left: -56px; top: 68px; bottom: 0; width: 56px; padding: 0; border-right: 1px solid #ccc; background-color: #fff; overflow: hidden; transition: .2s;} #wrap.type2 .cont-lc-area .lc-leftbox.openTab-area.open {left: 0} #wrap.type2 .cont-lc-area .lc-leftbox.openTab-area.open:not(.wide):not(.fixed) .openTab-list .list .link {font-size: 0;} #wrap.type2 .cont-lc-area .lc-leftbox.openTab-area.open:not(.wide):not(.fixed) .openTab-top .btn-closeTab .txt {font-size: 0;} #wrap.type2 .cont-lc-area .lc-leftbox.openTab-area.open:not(.fixed) + .lc-rightbox {padding-left: 72px;} #wrap.type2 .cont-lc-area .lc-leftbox.openTab-area:not(.open) + .lc-rightbox {padding-left: 30px;} #wrap.type2 .cont-lc-area .lc-leftbox.openTab-area.wide, #wrap.type2 .cont-lc-area .lc-leftbox.openTab-area.fixed {width: 220px;} #wrap.type2 .cont-lc-area .lc-leftbox.openTab-area.fixed + .lc-rightbox {padding-left: 250px;} #wrap.type2 .cont-lc-area .lc-leftbox.openTab-area.wide .openTab-list .list.on .link::before, #wrap.type2 .cont-lc-area .lc-leftbox.openTab-area.fixed .openTab-list .list.on .link::before {background-color: transparent;} #wrap.type2 .page-top + .cont-search {margin-top: 10px;} #wrap.type2 .cont-lc-area .lc-rightbox .title-dep1 .intit {font-weight: 500;} .openTab-area .openTab-top {display: flex; flex-direction: row; align-items: center; justify-content: space-between; min-width: 210px; width: 100%; height: 50px; padding: 0 13px; border-bottom: 1px solid #ddd; background-color: #f5f5f5; font-size: 13px; font-weight: 500;} .openTab-area .openTab-top .btn-closeTab {position: relative; display: flex; flex-direction: row; align-items: center; font-size: 13px;} .openTab-area .openTab-top .btn-closeTab .txt {margin-left: 6px} /* .openTab-area .openTab-top .btn-fixed {width: 20px; height: 20px; background: url(../images/common/ico-fixing2.png) no-repeat center center; overflow: hidden; text-indent: -999rem; font-size: 0;} */ /* .openTab-area .openTab-top .btn-fixed:hover {background-color: #f5f5f5;} */ /* .openTab-area.fixed .openTab-top .btn-fixed {background: url(../images/common/ico-arrow5.png) no-repeat center center;} */ .openTab-area .openTab-top .btn-onoff {padding-left: 18px; width: 40px; height: 16px;} .openTab-area .openTab-top .btn-onoff::after {left: 4px; width: 10px; height: 10px; transition: .2s;} .openTab-area .openTab-top .btn-onoff .txt2 {display: block; top: 0; font-size: 10px; color: #fff;} .openTab-area .openTab-top .btn-onoff.on::after {left: 26px;} .openTab-area .openTab-top .btn-onoff.on .txt2 {left: 8px;} .openTab-area .openTab-body {min-width: 210px; height: calc(100% - 50px); margin-bottom: 10px;} .openTab-area .openTab-list {display: flex; flex-direction: column; max-height: 100%; overflow-y: auto;} .openTab-area .openTab-list::-webkit-scrollbar {width: 5px; height: 5px;} .openTab-area .openTab-list::-webkit-scrollbar-track {background-color: #fff;} .openTab-area .openTab-list::-webkit-scrollbar-thumb {background-color: rgba(153, 153, 153, .3); border-radius: 5px;} .openTab-area .openTab-list .list {position: relative; display: flex; flex-direction: row; align-items: stretch; justify-content: space-between; height: 44px; padding: 8px 13px; /*border-bottom: 1px solid #ddd;*/} .openTab-area .openTab-list .list:hover .link {color: #ed6d00;} .openTab-area .openTab-list .list:hover .link::before {background-image: url(../images/layout/ico-tag-on.png);} .openTab-area .openTab-list .list .link {display: inline-block; width: 100%; height: 30px; line-height: 30px; padding: 0 20px 0 36px; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;} .openTab-area .openTab-list .list .link::before {content: ""; position: absolute; left: 13px; top: 50%; margin-top: -18px; width: 30px; height: 36px; background: url(../images/layout/ico-tag-off.png) no-repeat center center;} .openTab-area .openTab-list .list .del {position: absolute; right: 18px; top: 50%; margin-top: -4px; width: 9px; height: 9px; background: url(../images/layout/ico-close4.png) no-repeat center center; font-size: 0; overflow: hidden; text-indent: -999rem;} .openTab-area .openTab-list .list .del:hover {background-color: #f5f5f5;} .openTab-area .openTab-list .list.home .link::before {background-image: url(../images/layout/ico-home2.png);} .openTab-area .openTab-list .list.home:hover .link::before {background-image: url(../images/layout/ico-home3.png);} .openTab-area .openTab-list .list .tooltip-wrap {margin-left: 11px;} .openTab-area .btn-newTab {position: relative; display: block; width: 30px; height: 24px; font-size: 0; overflow: hidden; text-indent: -999rem;} .openTab-area .btn-newTab:hover {background-color: #f5f5f5;} .openTab-area .btn-newTab::before {content: ""; position: absolute; left: 50%; top: 50%; width: 2px; height: 18px; margin: -9px 0 0 -1px; background-color: #888;} .openTab-area .btn-newTab::after {content: ""; position: absolute; left: 50%; top: 50%; width: 18px; height: 2px; margin: -1px 0 0 -9px; background-color: #888;} .ico-tab {width: 30px; height: 24px; background: url(../images/layout/ico-tab.png) no-repeat center center;} @media screen and (max-width: 1590px) { #wrap.type2 .header-top .gnb {margin-left: 20px;} #wrap.type2 .header-top .search-box {width: 174px;} } .fc-tab-content .fullscreen-head{ margin: 0 0 20px 0; display: none;} .fc-tab-content .fullscreen-head .btn-wrap{ display: flex;} .fc-tab-content .fullscreen-head > .btn-wrap:first-child{ justify-content: flex-end;} .fc-tab-content .fullscreen-head .btn-wrap a{ width: 30px; height: 30px; background: no-repeat center center; text-indent: -9999px; display: inline-block;} .fc-tab-content .fullscreen-head .btn-wrap a:hover{ background-color: rgba(0,0,0,.2);} .fc-tab-content .fullscreen-head .btn-wrap a.btn-default{ background-image: url(../../front/images/ico/ico-defullscreen.png);} .fc-tab-content .fullscreen-head .btn-wrap a.btn-close{ background-image: url(../../front/images/ico/ico-popup-close.png);} html.fullscreenHtml #header, html.fullscreenHtml #quickArea, html.fullscreenHtml .cont-lc-area.type2 .lc-leftbox{ display: none;} html.fullscreenHtml .cont-lc-area.type2 .lc-rightbox{ width: 100%; padding: 0; margin: 0;} html.fullscreenHtml .fc-tab-content { height: 100vh !important; background-color: #fff; overflow: auto; padding: 20px;} html.fullscreenHtml .fc-tab-content .fullscreen-head{ display: block;}