@charset "utf-8";

/* wrap */
#wrap {position:relative; /*overflow:hidden; */min-width:1100px; height:100%;}

/* header */
#header {position:fixed; top:0; left:0; z-index:10; display:table; width:100%; min-width:1100px; height:80px; background-color:#1e1e1e;}
#header h1 {display:table-cell; width:260px; vertical-align:middle; text-align:center;}
#header h1 > a {display:inline-block;}

/* gnb */
#header .gnb {display:table-cell; }
#header .gnb .lnb {float:left;}
#header .gnb .lnb > ul {font-size:0; height:80px;}
#header .gnb .lnb li {display:inline-block;}
#header .gnb .lnb li > a {display:table-cell; width:100px; height:80px; font-size:14px; color:#fff; text-align:center; vertical-align:middle;}
/* #header .gnb .lnb .lnb1 a {background-color:#3c3c3c;}
#header .gnb .lnb .lnb2 a {background-color:#373737;}
#header .gnb .lnb .lnb3 a {background-color:#323232;}
#header .gnb .lnb .lnb4 a {background-color:#2d2d2d;} */
#header .gnb .lnb .lnb1 a:hover {background-color:#2d2d2d; border-radius: 8px 8px 0px 0px;}
#header .gnb .lnb .lnb2 a:hover {background-color:#2d2d2d; border-radius: 8px 8px 0px 0px;}
#header .gnb .lnb .lnb3 a:hover {background-color:#2d2d2d; border-radius: 8px 8px 0px 0px;}
#header .gnb .lnb .lnb4 a:hover {background-color:#2d2d2d; border-radius: 8px 8px 0px 0px;}
#header .gnb .lnb li a.on,
#header .gnb .lnb li a.on:hover {
	background: #000000;  /* fallback for old browsers */
	background: -webkit-linear-gradient(to bottom, #434343, #000000);  /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to bottom, #434343, #000000); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
	border-radius: 8px 8px 0px 0px; }
#header .gnb .lnb li > a:before {content:""; display:block; width:20px; height:20px; margin:0 auto 5px; }
#header .gnb .lnb .lnb1 > a:before {background-position:0 0;}
#header .gnb .lnb .lnb2 > a:before {background-position:-25px 0;}
#header .gnb .lnb .lnb3 > a:before {background-position:-55px 0;}
#header .gnb .lnb .lnb4 > a:before {background-position:-85px 0;}
#header .gnb .user_panel {float:right; width:196px; height:80px; background-color:#0094D400;}
#header .gnb .user_panel .btn_user_panel {position:relative; width:100%; height:100%; padding:10%; text-align:left;}
#header .gnb .user_panel .btn_user_panel:after {
	content:""; position:absolute; top:30%; right:10%; border-top:4px solid #fff; border-left:4px solid transparent; border-right:4px solid transparent;
	transition:cubic-bezier(0.25, 0.46, 0.45, 0.94) transform 250ms;
	-webkit-transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) transform 250ms;
	-moz-transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) transform 250ms;
	-o-transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) transform 250ms;}
	#header .gnb .user_panel.on .btn_user_panel:after {
	transform:rotate(180deg);
	-webkit-transform:rotate(180deg);
	-moz-transform:rotate(180deg);
	-o-transform:rotate(180deg);
}

.ie8 #header .gnb .user_panel.on .btn_user_panel:after,
.ie9 #header .gnb .user_panel.on .btn_user_panel:after {border-bottom:4px solid #fff; border-top:none;}
#header .gnb .user_panel .btn_user_panel > span {display:block; color:#fff;}
#header .gnb .user_panel .btn_user_panel > span:first-child {margin-bottom:10px;}
#header .gnb .user_panel .logout_article {display:none; width:100%; height:38px; line-height:38px; text-align:left; background-color:#3c3c3c; border-radius:2px;}
#header .gnb .user_panel .logout_article > span {display:inline-block; width:100%; padding-left:25px; line-height:24px; color:#fff;}
#header .gnb .user_panel .logout_article:hover > span {background-color:#282828;}
#header .gnb .user_panel.on .logout_article {display:block;}

/* container */
#container {position:relative; width:100%; min-width:1100px; min-height:100%;}

/* snb  */
#container.on .snb {width:0;}
#container.on .snb .btn_snb {left:-1px;}
#container.on .snb ul.snb_mn {width:0; visibility:hidden;}
#container.on .content {left:0;}
#container .snb {position:absolute; top:80px; left:0; right:0; bottom:0; z-index:8; width:260px; background-color:#1e1e1e;}
#container .snb .btn_snb {position:absolute; top:3px; left:260px; z-index:8; width:38px; height:53px; background-color:#fff; border:1px solid #dcdcdc; border-radius:0 5px 5px 0;}
#container .snb .btn_snb:after,
#container .snb .btn_snb:before {content:"";}
#container .snb .btn_snb:after,
#container .snb .btn_snb:before,
#container .snb .btn_snb i {display:block; width:20px; height:2px; margin:0 auto; background-color:#707070;}
#container .snb .btn_snb:before,
#container .snb .btn_snb i {margin:0 auto 4px;}
#container .snb ul.snb_mn {position:absolute; top:0; bottom:58px; left:0; right:0; z-index:8; overflow-y:auto; width:260px;}
/* #container .snb ul li{border-bottom: 1px solid #2a2d2f;} */
#container .snb .title_group {position:relative; display:block; height:50px; padding: 16px 16px 0 15px; font-weight:400; font-size:14px; vertical-align:middle; color:#fff; background-color: #2a2d2f;}
#container .snb .title_group:before {
	content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 50px;
    background-color: #0094D400;}
/* #container .snb .title_group.on:before  {margin:3px 11px 0 3px; border-right:5px solid transparent; border-left:5px solid #757286;  border-top:5px solid transparent; border-bottom:5px solid transparent;} */
		
#container .snb .sub_txt {position:relative; background-color:#2a2d2f;}
#container .snb .sub_txt li {height:38px;}
#container .snb .sub_txt li {position:relative; overflow:hidden; display:block; height:100%;}
#container .snb .sub_txt li a {display:block; padding:0 35px; line-height:40px; color:#fff;}
#container .snb .sub_txt li a:hover {background-color:#27292b;}
#container .snb .sub_txt li .on:before {content:""; position:absolute; top:0; left:0; width:4px; height:40px; background-color:#0094D4;}
#container .snb .sub_txt em {float:right;}

#container .snb .sub_txt2 {position:relative; background-color:#1e1e1e;}
#container .snb .sub_txt2 li {height:38px;}
#container .snb .sub_txt2 li {position:relative; overflow:hidden; display:block; height:100%;}
#container .snb .sub_txt2 li a {display:block; padding:0 15px; line-height:24px; color:#fff;}
#container .snb .sub_txt2 li a:hover {background-color:#27292b;}
#container .snb .sub_txt2 li .on {background-color:#0094D4;}
/* #container .snb .sub_txt2 li .on:before {content:""; position:absolute; top:0; left:0; width:4px; height:40px; background-color:#E52F80;} */
#container .snb .sub_txt2 em {float:right;}

#container .snb .btn { right:30px; width:26px; height:26px; margin-top:-13px; background-color:#eee0; border-radius:3px; color:white;}
#container .snb .btn_add {position:absolute; top:50%; right:30px; width:26px; height:26px; margin-top:-13px; background-color:#959595; border-radius:3px;}
#container .snb .btn_add:hover {background-color:#777;}
#container .snb .btn_add:after,
#container .snb .btn_add:before {content:""; position:absolute; top:50%; left:50%; display:block; background:#2e3135;}
#container .snb .btn_add:after {width:14px; height:2px; margin:-1px 0 0 -7px;}
#container .snb .btn_add:before {width:2px; height:14px; margin:-7px 0 0 -1px;}

#container .snb div.snb_foot {position:absolute; bottom:0; z-index:9; overflow-y:auto; width:260px; height:58px; background-color: #1e1e1e; color: #fff; text-align: center; padding:8px; line-height: 1.8em;}
#container .snb .snb_foot a {padding: 5px; color: #fff; }

.ie8 #container .snb .btn_add:after,
.ie8 #container .snb .btn_add:before {top:0;}

/* content */
#container .content {position:absolute; top:0; left:260px; right:0; bottom:0; z-index:6;}
#container .content .area {overflow:hidden; position:absolute; top:80px; left:0; right:0; bottom:0px;}
#container .content .area > div {position:relative; width:100%; height:100%; background-color:#eaebef;}

/* footer */
#footer {position:fixed; bottom:0; left:0; z-index:1; width:100%; min-width:856px; height:55px; line-height:55px; font-size:12px; color:#959595; text-align:center; background-color:#2a2d2f;}