/*-------------------------------------------------------------
        해더                         
-------------------------------------------------------------*/
#header {position:relative; height:50px; overflow: hidden; z-index:9; background:#000;}/* IE7 z-index bug 해결 (상위요소에 z-index 적용) */
#header .container {padding: 0 20px;}

#header > div > div {position: relative;z-index: 2;float: left; width: 30%; display: inline-flex;overflow: hidden; padding:15px 0;}
#header .h_menu {padding: 14px 0;justify-content:flex-start;}
#header .h_logo {width: 40%;justify-content: center;line-height: 20px;}
#header .h_btns  {justify-content: end;}

#header .h_menu .hd_opener {background: none; border: 0; padding:0; float:left;}
#header .h_menu .hd_opener span {display: block;width: 20px;height: 2px;background-color: #aaa;margin: 4px 0; border-radius: 2px;}

#header .h_logo a {display: inline-block; padding:0;} 
#header .h_logo img {display:inline-block;width: auto;height: auto;max-height: 20px;vertical-align: middle; float:left;}

#header .h_btns .btn {width:20px; height:20px; color:#aaa; box-sizing: border-box; background:transparent; padding:0; border:none; margin-left:15px;}
#header .h_btns .btn object {width:100%; height:100%; position: relative; z-index: -1;}


/*검색창*/
#hd_sch {width:90%;}
#hd_sch .bpop-modal {display:inline-block; width:100%; background:black; padding:15px; border-radius: 2px;}
#hd_sch .bpop-modal .pull-left {width:100%; padding-right: 95px;}
#hd_sch .bpop-modal .pull-left > * {float:left;}
#hd_sch .bpop-modal .pull-left input {width:100%;}
#hd_sch .bpop-modal .pull-left .btn {border-radius: 0;border-left:none;width: 40px;text-align: center;padding: 0;position: absolute;right: 70px;top: 15px;}

#sch_close {position: absolute; right: 15px; top: 15px; width: 40px; text-align: center; padding: 0; background:transparent; border-color:transparent;}


/*메인메뉴*/
.mmenu_wr {position: relative;width:auto;max-width: 100%;margin-top:0;background:#fff;overflow: hidden;border-top: 1px solid #333;border-bottom: 1px solid #333; z-index:9;}
.mmenu {position: relative;}
.mmenu ul {list-style:none; width:2000px;}
.mmenu li {float: left;width:auto;padding: 0 10px;vertical-align: middle;}
.mmenu li a {position: relative;display: block;height: 44px;padding: 0 5px;line-height: 44px;font-weight: 400;font-size:15px;color: #333;width:100%;}
.mmenu li.active {}
.mmenu li.active a {color: var(--major-color);}
.mmenu li.active a:after {content:"";position: absolute;bottom: 0px;left: 0;width: 100%;height: 3px;display: block;background:var(--major-color);border-radius: 0;border-top-left-radius: 50px;border-top-right-radius: 50px;}


/*------------------------------------------------------------
 	슬라이드 서브메뉴                    
-------------------------------------------------------------*/

#lnb {position: relative; width:auto; max-width: 100%; margin-top:0em; background:#fff; font-size: 0; overflow: hidden; z-index:9;}

/*메뉴1차*/
.vNav {border-bottom:1px solid #ddd;}
.vNav ul {list-style:none; width:2000px;}
.vNav li {float: left; width:auto; background-color:#fff; height:40px; padding:0 15px; vertical-align: middle;}
.vNav li a {display: block; line-height: 2em; font-weight: 300; font-size: 1.1em; color:#777; width:100%;}
.vNav li.active {background-color:var(--major-color);}
.vNav li.active a {color: #fff;}

/*메뉴2차*/
.vNav2 {position: relative; width:100%; display: inline-block; padding:0; border-bottom:1px solid #ddd; background:#fff;}
.vNav2 ul {list-style: none; display: inline-block; padding:0; width:2000px;}
.vNav2 li {position: relative; float:left; width:auto; height:auto; box-sizing: border-box;}
.vNav2 li a {display: inline-block; position: relative; text-decoration: none; height:auto; font-size:13px; line-height: 40px; font-weight: 300; color:#333; padding:0px 15px; float:left;}
.vNav2 li.active a {color:#fff;background-color: #333333;}

/*메뉴3차*/
.vNav3 {position: relative; width:100%; display: inline-block; padding:0; border-bottom:1px solid #ddd; background:#fff; margin-top:-1px;}
.vNav3 ul {list-style: none; display: inline-block; padding:0; width:2000px;}
.vNav3 li {position: relative; float:left; width:auto; height:auto; box-sizing: border-box;}
.vNav3 li a {display: inline-block; position: relative; text-decoration: none; height:auto; font-size:12px; line-height: 30px; font-weight: 300; color:#555; padding:0px 8px; float:left;}
.vNav3 li.active a {color:#fff;background-color: #555;}

/* 일반페이지 2차 */
#sMenu2 {border-bottom: 1px solid #ddd;}
#sMenu2 ul {padding: 10px;}
#sMenu2 li a {line-height: 32px;border-radius: 30px;font-size: 12px;}


/*-------------------------------------------------------------
        왼쪽 슬라이드 메뉴                      
-------------------------------------------------------------*/

#bpop_gnb .bpop-modal {left:0; position: fixed; top:0; z-index: 1; display: block; opacity: 1; width:70vw; height:100%; background-color:#333; overflow-y: inherit; padding:0;}

/*닫기버튼*/
button#closeGnb {position: absolute; left:100%; right:0; top: 0; margin-right:-47px; background:#666; box-shadow: inset 10px 0px 20px -10px rgba(0,0,0,0.5); border: 0; padding: 10px;}
#closeGnb {position: relative; display: block; width:47px; height:45px; top:0; left:0; z-index: 5;}
#closeGnb > span {position: relative; display: block; width:16px; height:16px; margin:auto; text-indent: -9999em; overflow: hidden}
#closeGnb > span:before, 
#closeGnb > span:after {content: ""; display: block; position: absolute; width:21px; height:1px; top:50%; left:-3px; background-color: #fff; transition: .4s ease-in-out; -webkit-transition: .4s ease-in-out;}
#closeGnb > span:before {transform: rotate(45deg); -webkit-transform: rotate(45deg);}
#closeGnb > span:after {transform: rotate(-45deg); -webkit-transform: rotate(-45deg);}

.gnb_hd {display: block; position: relative; }

.gnb_hd .login_after {position: relative;width: 100%;display: block;padding: 5px 15px 15px 15px;overflow: hidden;background: #222;}
.gnb_hd .login_after a:not(.logout) {display: block;font-size: 15px;color: #ccc;line-height: 18px;margin-top: 10px;}
.gnb_hd .login_after .logout {display: inline-block;float:right;color: #aaa;text-align: center;font-size: 12px;border: none; background:#333; padding: 3px 10px;border-radius: 2px; position: absolute; bottom:0; right:10px; transform: translateY(-50%);}
.gnb_hd .login_after i {margin-top:-0.1em;}

.gnb_hd .login_before {position: relative;width: 100%;display: block;padding: 15px;}
.gnb_hd .login_before a {display: block;width: 100%;color: #fff;background: #000;padding: 10px;border-radius: 5px;text-align: center;}


/*메뉴*/
#header #gnb.hd_div {position: fixed; top:0; left:0; background-color:rgba(0,0,0,0.5); z-index: 999;}
.gnb-wrapper {background: linear-gradient(#fff, #f3f3f3); border-bottom:solid 1px #ddd; border-top:solid 1px #ddd; position:relative; width:100%;box-sizing:border-box;}

.gnb {position: relative;z-index: 9999;padding:0 10px !important;height:85%;overflow-y: auto;}
.after + .gnb {height:calc(100% - 77px - 170px);}
.before + .gnb {height:calc(100% - 73px);}

.gnb-1li {position: relative; width: 100%;}
.gnb-1li > label.gnb-1lb {position:relative; display: block; width:100%; padding:10px; font-weight: 500; border-bottom:1px solid #666; font-size: 16px; line-height:26px; color:#fff; margin-bottom:0;}

.gnb-2ul {background:transparent;}
.gnb-2li:first-child {border-bottom:1px solid #555;}
.gnb-2li {position: relative;}
.gnb-2li:last-child {border-bottom:none;}
.gnb-2li a {position:relative; display: block; width:100%; padding:10px 20px; font-weight: 500; border-bottom:1px solid #555; font-size:14px; line-height:22px;  color:#eee;  }

.gnb-3ul {background:#eee;}
.gnb-3li {position: relative; border-bottom:1px solid #eee;}
.gnb-3li a {position:relative; display: block; width:100%; padding:10px 30px; font-weight: 500; border-bottom:1px solid #eee; font-size:13px; line-height:16px;  color:#777;}
.gnb-3li a:before {content:"-"; }

.gnb-4ul {background:#e5e5e5;}
.gnb-4li {position: relative; border-bottom:1px solid #e5e5e5;}
.gnb-4li a {position:relative; display: block; width:100%; padding:10px 40px; font-weight: 500; border-bottom:1px solid #e5e5e5; font-size:12px; line-height:13px;  color:#999;}
.gnb-4li a:before {content:"-"; }

input.tab-gnb2, 
input.tab-gnb3 {position: absolute; opacity: 0; z-index: -1;}
.label-gnb2, 
.label-gnb3 {position: absolute; top:3px; right:0;}
.label-gnb3 {top:6px;}
.gnb .panel {margin:0; border:none; border-radius: 0; box-shadow: none; -webkit-box-shadow: none; height: 0; overflow: hidden; -webkit-transition: height .35s; -o-transition: height .35s; transition: height .35s; background-color:rgba(0,0,0,0.2);}
.label-gnb2:after {position: absolute;right: 10px;top: 6px;width: 30px;height: 30px;padding: 0;display: block;text-align: center;-webkit-transition: all .35s;-o-transition: all .35s;transition: all .35s;padding: 0;line-height: 30px;}
.label-gnb3:after {position: absolute;right: 10px;top: -2px;width: 30px;height: 30px;padding: 0;display: block;text-align: center;-webkit-transition: all .35s;-o-transition: all .35s;transition: all .35s;padding: 0;line-height: 30px;} 

input.tab-gnb2:checked~ .panel,
input.tab-gnb3:checked~ .panel {height: auto;}
input.tab-gnb2 + .label-gnb2:after{content: "\f105";font-family: "FontAwesome";font-size: 20px;transform: rotate(0deg);opacity: 0.2; color:#fff;}
input.tab-gnb2:checked + .label-gnb2:after{transform: rotate(90deg); opacity: 0.4;}
input.tab-gnb3 + .label-gnb3:after{content: "\f105"; font-family: "FontAwesome"; font-size:18px; transform: rotate(0deg); opacity: 0.2;}
input.tab-gnb3:checked + .label-gnb3:after{transform: rotate(90deg); opacity: 0.4;}

.gnb_quick {display: inline-flex; width:100%; flex-wrap: wrap; padding:5px;}
.gnb-box {float: left;padding: 5px;width: 50%;display: block;color: #777;border-radius: 5px;}
.gnb-box a {border: 1px solid #ddd;padding: 10px;width: 100%;display: block;color: #777;background: #f9f9f9;text-align: center;font-size: 13px;}
.gnb-box a i {font-size: 24px;display: block;margin-bottom: 5px;color: #b9b9b9;}

/*-------------------------------------------------------------
        푸터                        
-------------------------------------------------------------*/
#ft {clear:both;position:relative;margin:0;margin-top:70px;height:auto;background:#525252;padding: 0;overflow: hidden;}

#ft_menu {position:relative;padding: 5px 0;overflow: hidden;border-bottom: 1px solid #636363; text-align: left;}
.ft_menu {padding:0 5px; display: inline-block;}
#ft_menu li {float:left;font-size: 13px;line-height: 18px;color: #888;margin-left: -1px; padding: 5px 10px;}
#ft_menu li a {font-size: 13px;line-height: 18px;color: #aaa; letter-spacing: -1px;}

#ft_con {display: inline-flex; width:100%; margin:0; padding:20px 10px; border-bottom:1px solid #636363;}
#ft_con > div {width:50%; font-size:13px; padding:0 10px;}

#ft_con .title {display: block;font-size: 13px;color: #999;line-height: 1;position: relative; letter-spacing: 0.05em; text-align: center; text-transform: uppercase;}
#ft_con .line {display: inline-block; width:100%; position: relative; margin:10px 0 20px; line-height: 0; float:left; text-align: center;}
#ft_con .line:after{content: "";position: relative;display: inline-block;width: 20px;height: 1px;background: #999;}

.ft_cs {border-right:1px solid #636363;}
.ft_cs span {display: block; font-size: 1.5em; line-height: 1; color: #fff; letter-spacing: 0em; margin-top:10px; text-align: center; font-weight: bold;}
.ft_cs span a {font-size: inherit; color:inherit; line-height: inherit;}
.ft_cs .time {display: block; width:auto; margin:0 auto; margin-top:10px;}
.ft_cs .time dl {display: inline-block; width:100%;}
.ft_cs .time dt {display: inline-block;font-size: 12px;line-height: 20px;color: #999; font-weight: normal; float:left; width:46px;}
.ft_cs .time dl:nth-child(1) dt {letter-spacing: -1px;}
.ft_cs .time dl:nth-child(2) dt {letter-spacing: 0.7px}
.ft_cs .time dl:nth-child(3) dt {letter-spacing: -0.3px;}
.ft_cs .time dd {display: inline-block;font-size: 12px;line-height: 20px;color: #fff; float:left; letter-spacing: -1px;}

.ft_sns {}
.ft_sns .shortcut {display: inline-block; width:100%;}
.ft_sns .shortcut a {display: inline-block; width: 100%; color: #fff; font-size: 11px; line-height: 28px; border:1px solid #ddd; padding: 0 5px; text-align: left; float:left; border-radius: 2px; transition: 0.3s; letter-spacing: -1px;}
.ft_sns .shortcut a:hover {background-color:#666;}
.ft_sns .shortcut a + a {margin-top:10px;}
.ft_sns .shortcut .bi {vertical-align: sub; margin-right:5px; opacity: 0.7;}
.ft_sns .shortcut a:hover .bi {opacity: 1;}
.ft_sns .btn_sns {margin-top:10px; text-align: center;}
.ft_sns .btn_sns a {color:#fff; opacity: 0.7; display: inline-block; width:20px; height:20px; line-height: 1; font-size:20px; transition: 0.3s;}
.ft_sns .btn_sns a svg {width:20px; height:20px;}
.ft_sns .btn_sns a + a {margin-left:10px;}
.ft_sns .btn_sns a:hover {opacity: 1;}

.ft_info {padding:5px 10px;}
.ft_info dl {display: inline; width:auto;}
.ft_info dl dt {display: inline;font-size: 12px;line-height: 24px;color: #aaaaaa; font-weight: normal; white-space: nowrap;}
.ft_info dl dt:before {content: '|'; margin-left:5px; margin-right:5px;}
.ft_info dl dd {display: inline;font-size: 12px;line-height:24px;color: #eee;margin: 0;margin-left: 7px; word-break: break-all;}
.ft_info dl.title dd {margin-left:0; font-weight: bold;}
.ft_info dl dd a {display: inline;font-size: 12px;line-height: 16px;color: #eee;padding: 0 3px;margin-left: 5px;border: 1px solid #ddd;}
.ft_info .title {text-transform: uppercase;}
.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; padding:0;}



/*------------------------------------------------------------
 	페이지바                    
-------------------------------------------------------------

.pagebar {position:relative; width:100%; padding:0; text-align:left; }
.breadcrumb {padding:0; margin:0; background-color:#fff; font-size:15px; display:inline-block;line-height:18px; color:#1d1113;}
.breadcrumb span {color:#777;}
.breadcrumb .fa-angle-right {color:#b3b3b3; font-size:16px !important; margin:auto 5px; margin-top:-3px;}

*/
/*-------------------------------------------------------------*/
/*                           페이지네이션                         */
/*-------------------------------------------------------------*/
.pagination-wr {display: inline-block; width:auto; padding:5px 0;}
.pagination {display:inline-block;width:24px; height:24px;vertical-align:middle; font-size:13px; line-height:22px;border-radius:2px; margin:0 2px; color:#777;  text-decoration: none}
.pagination:hover {background-color:#fff; color:#000; text-decoration: underline;}
.pagination.p-current {font-weight:bold; color:var(--major-color);text-decoration: underline;}
.pagination.p-arrow {margin:0 3px; font-family: 'opensans', Dotum, Sans-serif; text-align: center;}
.pagination.p-arrow.disabled {color:#ccc;cursor: not-allowed; display: none;}
.pagination.p-arrow.disabled:hover {background-color:#fff;font-weight: normal;color:#ccc;cursor: not-allowed;}

.pagination-wr i {color:#aaa; font-size:0.8em}
.pagination-wr > i {opacity: 0.3;}