/*-------------------------------------------------------------*/
/*                              색상설정                       */
/*-------------------------------------------------------------*/
:root {
    --header-border-color : #eee;
	--tnb-bg-color : #f9fafc;
    
}

/*-------------------------------------------------------------*/
/*                               해더                          */
/*-------------------------------------------------------------*/

/*탑메뉴*/
#tnb {width:100%; position:relative; background-color:var(--tnb-bg-color); height:35px; padding:0; border-bottom:1px solid var(--header-border-color);}
#tnb > div{overflow:hidden;}
#tnb ul {text-align:right; line-height:34px; font-size:0; max-width:50%;}
#tnb ul.pull-left {text-align:left;}
#tnb ul li {display:inline-block; font-size:11px; line-height:14px; margin:10px 0; border-right:1px solid #eee; padding:0 10px; color:#999;}
#tnb ul li:first-child {padding-left:0;}
#tnb ul li:last-child {border-right:0; padding-right:0;}
#tnb ul li a {text-decoration:none; color:#999;}
#tnb ul li a:hover {text-decoration:none; color:var(--major-color);}

#tnb ul li .point {margin-left:5px; font-size:11px; font-weight: 100;}
#tnb ul li .point span {display: inline-block; width:11px; height:11px; border-radius: 50%; text-align: center; line-height: 11px; background-color:#999; color:#fff; font-size:9px;}
#tnb ul li:hover .point span {background-color:var(--major-color);}

/*텍스트롤링*/
.hText {display: flex; width:100%; height:24px; margin:5px 0;}
.hText span {display: inline-block; width:auto; height:100%; font-size:12px; font-weight: 600; color:#999; white-space: nowrap; line-height: 24px; margin-right:10px;}
.hText iframe {}

/*해더*/
#header {position:relative; z-index:999; margin:0; border-bottom:1px solid #eee;} /* IE7 z-index bug 해결 (상위요소에 z-index 적용) */
#header .container {display: flex;justify-content: space-between;}

#header .logo {display: block;width: 30%;height:100%;line-height: 120px;text-align: left;}
#header .logo a {display: inline-block;width:auto;height:auto;line-height: 120px;vertical-align: middle;}
#header .logo a img {display: block;height:auto;max-width:300px;max-height: 70px;vertical-align: middle;}

#header .h-search {display:block;width:35%;height:100%;text-align: center;line-height: 0; padding:38px 0;}
#header .h-search form {display: inline-block; width:90%;}
#header .h-search .form-group {display: inline-block; width:100%;}
#header .h-search .input-group {display: inline-block; width:100%; height:42px; border:2px solid var(--major-color); border-radius: 0; box-sizing: border-box; overflow: hidden; background: #fff;}
#header .h-search .input-group input[type="text"] {display: inline-block; width:calc(100% - 40px); height:40px; border:none; font-size:13px; letter-spacing: 0.02em; font-weight: 300; padding:0 20px; line-height: 40px; box-shadow: none; background: transparent;}
#header .h-search .input-group input[type="text"]::placeholder {font-size:1em !important; opacity: 0.5;}
#header .h-search .input-group .input-group-addon {display: inline-block; float:right; padding:0; border:none; background:var(--major-color); border-radius: 0;}
#header .h-search .input-group .input-group-addon button {display:inline-block; width:40px; height:40px; border:none; padding:0; text-align: center; line-height: 40px; background-color:transparent;}
#header .h-search .input-group .input-group-addon button i {font-size:1.3em; margin-right:-2px; margin-top:-6px;}

.h-iconset {display: block;float: right;margin:0 auto;width:35%;height:100%;text-align: right;line-height: 120px;}
.h-iconset a {color: #777;font-size: 13px;line-height: 25px;letter-spacing: -0.04em;display: inline-block;}
.h-iconset a small {opacity: 0.8;}
.h-iconset a:hover {color: var(--major-color);}
.h-iconset a:after {content:"";padding: 0 5px;} 
.h-iconset a:last-child:after {display: none;}
.h-iconset a:focus {text-decoration: none;} 
.h-iconset .h-icon {display: inline-block; width:25px; height:25px; border-radius: 50%; text-align: center; line-height: 25px; background-color:var(--major-lighter-color);}
.h-iconset .h-icon i {font-size:10px;}

/*-------------------------------------------------------------*/
/*                           메인메뉴                          */
/*-------------------------------------------------------------*/

.gnb-wrapper {position:relative; width:100%; height:50px; min-width:1200px; box-sizing:border-box; border-bottom:1px solid #ddd; z-index: 999;}
.gnb-wrapper.fixed {position: fixed; top:0; z-index: 999; background:#fff;}
#gnb { width:auto; max-width:100%; margin:0 auto;} 

/* gnb fixed로 바뀔때 높이값 바뀌는 문제로 삽입 */
#header.fixed {margin-bottom:50px;}

/*1차메뉴*/
#gnb .gnb-1li {display: inline-block;padding: 0;float:left;height: 49px;box-sizing: border-box;}
#gnb .gnb-1li:first-child {padding: 0;margin-right: 0px;}
#gnb .gnb-1li > a {display:block;overflow:hidden;font-size: 15px;height: 49px;line-height: 49px;text-align:center;color:#333333;position: relative;float:left;padding: 0 30px;}
#gnb .gnb-1li:not(.gnb-1li-all) > a:after {content: ''; width:0; height:2px; background-color:#888; transition: 0.1152s; position: absolute; left:50%; bottom:0; transform: translate(-50%, 0);}
#gnb .gnb-1li.gnb-1li-all > a {display:inline-block;width: 50px;padding: 0;cursor: pointer;border-left: 1px solid #ddd;border-right: 1px solid #ddd;background: #f9fafc;}
#gnb .gnb-1li.gnb-1li-all .hamburger {position: relative;display: inline-block;width: 25px;height: 16px;vertical-align: top;margin-top: 16px;}
#gnb .gnb-1li.gnb-1li-all .hamburger div {display: block;width:100%;height:2px;background: #5d5d5d;margin-bottom: 5px; border-radius: 0px;}
#gnb .gnb-1li.gnb-1li-all .hamburger div:last-child {margin-bottom:0;}
#gnb .gnb-1li.gnb-1li-all .text {display: inline-block; width:auto; float:right; line-height: 16px; margin-left:15px;}

#gnb .gnb-1li.gnb-1li-all.open > a {background:#f8f8f8;}
#gnb .gnb-1li.gnb-1li-all.open .hamburger div:nth-child(1) {position: absolute; top:8px; transform: rotate(45deg);}
#gnb .gnb-1li.gnb-1li-all.open .hamburger div:nth-child(2) {position: absolute; top:8px; transform: rotate(-45deg);}
#gnb .gnb-1li.gnb-1li-all.open .hamburger div:nth-child(3) {display: none;}

#category-all-bg {display: none; position: fixed; background:rgba(0,0,0,0.01); width:100%; height:100%; top:0; left:0; z-index: 99998;}

#gnb .gnb-1li:hover > a:after, #gnb .gnb-1li > a.active:after {width:100%;}
#gnb .gnb-1li > a.active:after {background-color:var(--major-color);}
#gnb .gnb-1li:hover > a, #gnb .gnb-1li > a.active {color:var(--major-color);}
#gnb .gnb-1li.gnb-1li-all:hover {border-bottom:none;}

.gnb2 { display: none; position: absolute;left: 50%;margin-left: -600px;margin-top: 49px;width: 1200px;}
.gnb-1li:hover > .gnb2 {display: block;}
.gnb2 .menu-all {display: none;width: 60px;height: 60px;line-height: 58px;position: absolute;left:0;top: -1px;background:#fff;padding: 0;box-sizing: border-box;cursor: pointer;border:1px solid #e4e4e4;border-bottom:none;z-index: 99999;text-align: center;}
.menu_all_wr {position: absolute;left: 0;top: 49px;z-index: 2;}


/*.open .gnb2 .menu-all {display: inline-block;}
.fixed .gnb2 .menu-all {padding:16px 40px;}*/

#gnb .gnb-2ul { position:absolute; left: 0; display: inline-flex; border:solid 1px #ddd; background:#fff;  overflow:hidden; z-index:99999; padding:30px; width:100%;}
#gnb .gnb-2ul li a {display:block; font-size:13px; color:#888; width:100%; line-height:28px; padding:0; vertical-align: middle;}
#gnb .gnb-2ul li a:hover {color:#333;}

#gnb .gnb-2ul.gnb-all {left: 0; width:1200px; max-height:530px; margin-left:0; transition: all; padding:30px; overflow: hidden; overflow-y: auto; display: inline-block;}
#gnb .gnb-2ul.gnb-all > div {float:left; padding:30px 0px; display: inline-flex; width:100%; height:auto; overflow: hidden; border-top:1px solid #eee; position: relative;}

#gnb .gnb-2ul.gnb-all > div:first-child {padding-top:0; border-top:none;}
#gnb .gnb-2ul.gnb-all > div:last-child {padding-bottom:0;}
#gnb .gnb-2ul.gnb-all li.gnb-2li > a {font-size:15px; color:#555; line-height: 1;}
#gnb .gnb-2ul.gnb-all li a:hover {}
#gnb .gnb-2ul.gnb-all li.gnb-2li + li.gnb-3li {margin-top:30px;}
#gnb .gnb-2ul.gnb-all li.gnb-3li > a {line-height: 1;}
#gnb .gnb-2ul.gnb-all li.gnb-3li + li.gnb-3li {}

#gnb .gnb-2ul.gnb-all > div > .gnb-2li {width:150px; border-right:1px solid #eee; padding:10px 0;}
#gnb .gnb-2ul.gnb-all > div > .gnb-2li > a {font-size:16px; font-weight: normal; color:#555;}
#gnb .gnb-2ul.gnb-all > div > ul {display: inline-block; width:calc(100% - 150px);}
#gnb .gnb-2ul.gnb-all > div > ul > .gnb-3li {display: inline-flex; width:100%;}
#gnb .gnb-2ul.gnb-all > div > ul > .gnb-3li > a {padding:10px 30px; width:190px; border-right:1px solid #eee; color:#555; font-size:14px; font-weight: 100;}
#gnb .gnb-2ul.gnb-all > div > ul > .gnb-3li > ul {display: inline-block; width:calc(100% - 190px); padding:0 30px;}
#gnb .gnb-2ul.gnb-all > div > ul > .gnb-3li > ul > li {display: inline-block; width:auto; float:left; margin-right:30px;}
#gnb .gnb-2ul.gnb-all > div > ul > .gnb-3li > ul > li > a {color:#888; font-size:13px;}

#gnb .gnb-btn {border-left:1px solid #ddd; border-right:1px solid #ddd;}
#gnb .gnb-btn a {padding:0; width:auto;}

#gnb .gnb-2ul:not(.gnb-all) div.row-1 {width:100%}
#gnb .gnb-2ul:not(.gnb-all) div.row-2 {width:50%}
#gnb .gnb-2ul:not(.gnb-all) div.row-3 {width:33.33%}
#gnb .gnb-2ul:not(.gnb-all) div.row-4 {width:25%}
#gnb .gnb-2ul:not(.gnb-all) div.row-5 {width:20%}
#gnb .gnb-2ul:not(.gnb-all) div.row-6 {width:16.66%}
#gnb .gnb-2ul:not(.gnb-all) div.row-7 {width:14.28%}
#gnb .gnb-2ul:not(.gnb-all) div.row-8 {width:12.5%}
#gnb .gnb-2ul:not(.gnb-all) div.row-9 {width:11.11%}
#gnb .gnb-2ul:not(.gnb-all) div.row-10 {width:10%}
#gnb .gnb-2ul:not(.gnb-all) div {border-right:1px solid #eee; padding:0 30px;}
#gnb .gnb-2ul:not(.gnb-all) div:first-child {padding-left:0;}
#gnb .gnb-2ul:not(.gnb-all) div:last-child {border-right:none;}

#gnb .gnb-2ul:not(.gnb-all) .gnb-2li {margin-bottom:10px;}
#gnb .gnb-2ul:not(.gnb-all) .gnb-2li a {font-size:15px; color:#555;}

.hd_login {position: absolute;right: 0;}

.gnb-wrapper .gnb-link {display: inline-block; position: relative;}
.gnb-wrapper .gnb-link li {display: inline-block; float:left; width:auto; height:49px; padding:9px; padding-right:0;}
.gnb-wrapper .gnb-link a {display: inline-block; width:auto; height: 30px; color:#666; text-align: center; line-height: 30px; transition: 0.152s;}
.gnb-wrapper .gnb-link a .h-icon {margin-right:4px; opacity: 0.7; position: relative; top:1px;}
.gnb-wrapper .gnb-link a span:not(.h-icon) {font-size:13px;}
.gnb-wrapper .gnb-link a:hover {color:var(--major-darker-color);}

/*-------------------------------------------------------------*/
/*                           왼쪽메뉴                          */
/*-------------------------------------------------------------*/

#lnb {position:relative; width:180px; float:left;}
#lnb .title {position:relative; padding:5px; text-align:left; font-size:24px; font-weight:bold; color:#1b1b1b; word-break:break-all;}

/*메뉴1차*/
.vNav {position:relative; width:100%; margin-bottom:10px; border:1px solid #ddd;}
.vNav ul {list-style:none;}
.vNav ul > li {position:relative; line-height:40px; border-bottom:1px solid #e9e9e9; background:#fafafa;}
.vNav ul > li:last-child {border-bottom:none;}
.vNav li a {display:block; position:relative; text-decoration:none !important; padding:0 20px; color:#333333; font-size:13px; line-height:40px; letter-spacing:-0.5px;}
.vNav li.active a {border:0; color:#e82e2e;}
.vNav li.active a:after {float:right;display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 20px; vertical-align: -15%; content: "\f105"; margin-top:10px;color:#e82e2e;}
.vNav li a:hover {color:#e82e2e;}

.vNav ul li.active li a:after {content:"";}

/*메뉴2차 선택시*/
.vNav ul ul {padding:0px; border:none; border-radius:0; border-top:1px solid #e9e9e9; padding:7px; background:#fff;}
.vNav li li {position:relative; line-height:24px; border-bottom:none; padding:0px;background:#fff;}
.vNav li li a {padding:0 15px; font-size:12px; line-height:24px; letter-spacing:-0.5px; color:#999999;}
.vNav li li.active {z-index:2;}
.vNav li li.active a {font-size:12px; color:#e82e2e;}
.vNav li li.active a:after {font-size: 16px; content: "\f105"; top:0 ;margin-top:4px;color:#e82e2e;}

 /*메뉴1차 선택시 2차메뉴*/
.vNav li.active ul {padding:0px; border:none;border-top:1px solid #e9e9e9; padding:7px; background:#fff;}
.vNav li.active li {position:relative; line-height:24px; border-bottom:none; padding:0px;background:#fff;}
.vNav li.active li a {padding:0 15px; font-size:12px; line-height:24px; letter-spacing:-0.5px; color:#777; background:#fff;}
.vNav li.active li a:hover {color:#e82e2e;}

/*-------------------------------------------------------------*/
/*                           페이지바                          */
/*-------------------------------------------------------------*/

.pagebar {position:relative; width:auto; padding:0; text-align:right;}
.breadcrumb {padding:10px 0px; margin:0; background-color:#fff; font-size:12px; display:inline-block;line-height:24px; color:#333;}
.breadcrumb span {color:#b2b2b2;}
.breadcrumb .fa-home {color:#bfbfbf;}
.breadcrumb .fa-angle-right {color:#b2b2b2; margin:0 5px;}

.pull-right > .pagebar {float:left;}
.pull-right .breadcrumb {padding:0; margin-top:-4px;}

/* ---------------------------------------------
    스크롤배너
---------------------------------------------- */

#stv {z-index:99;position:fixed; top:50%; right:0px; width:auto;height:auto;padding:0; transform: translate(0, -50%);}

#stv_nb {display: inline-block; position: relative; overflow: hidden;}
#stv_nb li {display: block; background-color:#666; color:#fff; border-top-left-radius: 5px; border-bottom-left-radius: 5px; font-size:12px; float: none; transform: translate(calc(100% - 28px), 0); transition: 0.1152s;}
#stv_nb li + li {margin-top:10px;}
#stv_nb li a, #stv_nb li button {display: inline-block; width:100%; border:none; background:transparent; color:#fff; text-align: left; padding:0;}
#stv_nb .icon {display: inline-block; width:28px; height:28px; text-align: center; line-height: 28px;}
#stv_nb .text {padding:0; padding-right:10px; overflow: hidden;}
#stv_nb li:hover {transform: translate(0,0); background-color:#333;}

/*-------------------------------------------------------------*/
/*                             푸터                            */
/*-------------------------------------------------------------*/
#ft {clear:both; position:relative; margin:0; margin-top:70px; height:auto;padding: 0; border-top: 1px solid #ddd;}

#ft #btn-top {display: inline-block;width:50px;height:50px;position: absolute;bottom: 50px;left: 50%;margin-left: 630px;background:url(/_img/inc/top.png) center no-repeat;font-size: 0;border-radius: 50%;background-color: #000; display: none;}

/* foot_link */
#ft .foot_link {position: relative; padding: 0; border-bottom: 1px solid #eaeaea;}
.foot_link a {display: inline-block;margin-right: 20px;font-size: 13px;line-height: 40px;color: #555;font-weight: 300;}
.foot_link .copy {float: right;font-size: 11px;color: #aaa;font-style: italic;line-height: 38px; text-transform: uppercase; letter-spacing: 0.025em; font-weight: 100;}
.foot_link .btn_sns {display: inline-flex; float:right; padding:8px 0;}
.foot_link .btn_sns a {display: inline-block;width: 24px;height: 24px;margin-right: 12px; font-size:1em; line-height: 1.4; color:#999; transition: 0.1152s;}
.foot_link .btn_sns a:hover {color:var(--major-color);}

/* foot_con */
#ft .foot_con {display: flex; padding: 20px 0;}
#ft .foot_con > div {padding:0 30px; border-right: 1px solid #eee;}
#ft .foot_con > div:first-child {border-left: 1px solid #eee;}

.foot_con .title {display: block;font-size: 18px;color: #000;line-height: 1;position: relative; letter-spacing: 0.05em;}

.foot_con .line {display: inline-block; width:100%; position: relative; margin:20px 0 10px; line-height: 0; float:left;}
.foot_con .line:after{content: "";position: relative;display: inline-block;width: 20px;height: 1px;background: #000; float:left;}

.ft_cs {display: block; width: 22%}
.ft_cs span {display: block;font-size: 16px;line-height: 22px;color: #666;text-align: left; letter-spacing: -0.05em; margin-top:10px;}
.ft_cs span i {content: ''; display: inline-block; width:22px; height:22px; float:left; margin-right:5px; background-size: contain; background-position: center; background-repeat: no-repeat; line-height: 28px;}
.ft_cs span a {font-size: inherit; color:inherit; line-height: inherit;}
.ft_cs .tel {margin-top:20px;}
.ft_cs .tel a {color: var(--major-color);}
.ft_cs .time {display: inline-block; width:100%;}
.ft_cs .time dl {display: inline-block; width:100%;}
.ft_cs .time dt {display: inline-block;font-size: 12px;line-height: 20px;color: #555; font-weight: normal; margin-right:10px; float:left;}  
.ft_cs .time dd {display: inline-block;font-size: 12px;line-height: 20px;color: #999; float:left;} 

.ft_bank {display: block; width: 22%}
.ft_bank .info dl {display: inline-block; width:100%;}
.ft_bank .info dt {display: inline-block;font-size: 14px;line-height: 24px;color: #555; font-weight: normal; margin-right:10px; float:left; width:60px;}  
.ft_bank .info dd {display: inline-block;font-size: 14px;line-height: 24px;color: #999; float:left;} 

.ft_info {display: block;width: 29%;}
.ft_info dl {display: inline-flex; width:100%;}
.ft_info dl dt {display: inline-block;font-size: 12px;line-height: 24px;color: #aaaaaa; font-weight: normal; float:left; white-space: nowrap;}
.ft_info dl dd {display: inline-block;font-size: 12px;line-height:24px;color: #555555;margin: 0;margin-left: 7px; float:left; word-break: keep-all;}
.ft_info dl dd a {display: inline-block;font-size: 12px;line-height: 16px;color: #aaa;padding: 0 3px;margin-left: 5px;border: 1px solid #ddd;}
.ft_info .copy {display: inline-block; width:100%; font-size:11px; line-height: 14px; font-weight: 100; color:#aaa; margin-top:10px; letter-spacing: 0.025em; text-transform: uppercase; font-style: italic;}

.ft_sns {display: block;width: 27%;}
.ft_sns .shortcut {display: inline-block; width:100%; padding-top:5px;}
.ft_sns .shortcut a {display: inline-block; width: calc(50% - 5px); color: #555; font-size: 12px; line-height: 28px; border:1px solid #ddd; padding: 0 10px; text-align: center; float:left;}
.ft_sns .shortcut a:nth-child(2n) {margin-left:10px;}
.ft_sns .shortcut a:nth-child(1), .ft_sns .shortcut a:nth-child(2) {margin-bottom:10px;}
.ft_sns .shortcut a:hover {background-color:var(--major-lighter-color);}



/*-------------------------------------------------------------*/
/*                           페이지네이션                         */
/*-------------------------------------------------------------*/
.pagination {border:1px solid transparent; display:inline-block;width:29px; height:29px;vertical-align:middle; color:#555; font-size:13px; line-height:29px;border-radius:0; margin:0;}
.pagination:hover {border:1px solid #eee;}
.pagination.p-current {color:var(--primary-darker-color);border:1px solid transparent;}
