@import url('http://fonts.googleapis.com/earlyaccess/nanummyeongjo.css');

@font-face {
 font-family: 'NanumBarunGothic';
 src: url(webfont/NanumBarunGothic/NanumBarunGothicWeb.eot);
 src: url(webfont/NanumBarunGothic/NanumBarunGothicWeb.eot?#iefix) format('embedded-opentype'),
      url(webfont/NanumBarunGothic/NanumBarunGothicWeb.woff) format('woff'),
      url(webfont/NanumBarunGothic/NanumBarunGothicWeb.ttf) format('truetype');
}

@font-face {
 font-family: 'NanumSquare';
 src: url(webfont/NanumSquare/NanumSquareR.eot);
 src: url(webfont/NanumSquare/NanumSquareR.eot?#iefix) format('embedded-opentype'),
      url(webfont/NanumSquare/NanumSquareR.woff) format('woff'),
      url(webfont/NanumSquare/NanumSquareR.ttf) format('truetype');
}


body * { font-family:NanumSquare; letter-spacing : -0.3px;}
@media (min-width: 1200px) { .container { width: 1190px!important; } }

header { position:relative; text-align:center; padding:35px 0; }
header #main-logo { position:absolute; top:18px; left:50px; }
header .login-wrap { position:absolute; top:37px; right:50px; }
header .login-wrap a:hover { font-weight:bold; }
header .login-wrap a { text-decoration:none; color:#333; font-size:17px;  display:inline-block;  border-right:1px solid #333; padding:0 15px;}
header .login-wrap li:first-child a { border-right:none; }
header .login-wrap li { float:right; }

#gnb > li { display:inline-block; padding:0 35px;}
#gnb > li > a { font-size:21px; color:#000; text-decoration:none; }
#gnb > li > a:hover { border-bottom:4px solid #374890; padding-bottom:10px; transition:.3s all; }
#gnb > li > ul { display:none; }
.gnb2 { background: #374890; width:100%; height:0px; position:absolute;left:0px; z-index:9999; overflow:hidden; text-align:center; }
.gnb2 .container { padding:23px 0px 0px; }
.subul > li { display:inline-block; text-align:center; vertical-align:top; margin:0 20px; }
.subul > li:last-child { margin-right:0px; }
.subul > li > a { font-size:18px; }
.subul > li > a > i { float:right; position:relative; top:3px; }
.subul > li > ul { margin:15px 0; display:none;}
.subul > li > ul > li { font-size:15px; transition:all ease 0.3s;height: 29px;margin-top:1px; }
.subul > li > ul > li:hover { background-color:#1f4346;}
.subul > li > ul > li > a { padding: 5px 7px;display: inline-block;overflow: hidden; width: 100%;text-overflow: ellipsis; white-space: nowrap; }
.subul > li > ul > li > a > i { margin-right:5px; position:relative; }
.subul li a { color: #fff; text-decoration:none; }

#footer { background:#272727; padding:35px 0px; position:relative;}
#footer > div  {position:relative;}
#footer img { margin-right: 10px; clear:both; display:inline-block; vertical-align:top;}
#footer ul { display:block; margin:10px 0 0 35px;}
#footer ul li { color:#fff; font-size:16px; padding:0px; margin:5px 0; transform: skew(-0.05deg); }
#footer h5 { font-size:16px; font-weight:bold; margin:4px 0px 4px; color:#fff; display:inline-block; transform: skew(-0.05deg); }
#footer p { font-size:14px; color:#fff; margin:15px 0 0; transform: skew(-0.05deg); line-height:1.8; }
#footer .foot-1 table { border:none; width:100%; }
#footer .foot-1 tr { margin-bottom:5px; }
#footer .foot-1 td {color:#fff; font-size:15px; padding:3px 0; transform: skew(-0.05deg); }
#footer .foot-2 table { border:none; width:100%; margin-top:10px; }
#footer .foot-2 tr { margin-bottom:5px; }
#footer .foot-2 td { color:#fff; font-size:15px; padding:3px 0; transform: skew(-0.05deg); }
#footer h3 {font-size:15px; color:#fff; line-height:25px; margin:20px 36px 0; transform: skew(-0.05deg); }

.header-mobile-gnb {float:right; margin:0 15px 0 0; font-size:30px;}
.header-mobile-gnb .toggle {color:#374890!important;}
.mm-panels > #mm-1 {background-color:#374890!important; }
.mm-panels > #mm-2,
.mm-panels > #mm-3,
.mm-panels > #mm-4,
.mm-panels > #mm-5,
.mm-panels > #mm-6,
.mm-panels > #mm-7,
.mm-panels > #mm-8,
.mm-panels > #mm-9,
.mm-panels > #mm-10,
.mm-panels > #mm-11,
.mm-panels > #mm-12,
.mm-panels > #mm-13,
.mm-panels > #mm-14,
.mm-panels > #mm-15,
.mm-panels > #mm-16,
.mm-panels > #mm-17,
.mm-panels > #mm-18,
.mm-panels > #mm-19,
.mm-panels > #mm-20,
.mm-panels > #mm-21,
.mm-panels > #mm-22,
.mm-panels > #mm-23,
.mm-panels > #mm-24,
.mm-panels > #mm-25,
.mm-panels > #mm-26,
.mm-panels > #mm-27,
.mm-panels > #mm-28,
.mm-panels > #mm-29,
.mm-panels > #mm-30,
.mm-panels > #mm-31 { background-color: #374890 !important; }
.mm-navbar { padding:20px 0px!important; height:inherit!important;}
.mm-navbar a { font-size:22px; color:#fff!important;}
.mm-listview>li>a, .mm-listview>li>span { padding:20px 25px!important; font-size:17px;}
.mm-panels>.mm-panel>.mm-listview { margin:20px 0px!important;}
.mm-btn {top:unset!important;}
.mm-menu .mm-listview>li .mm-next:after { border-color:#fff!important; }

.board-theme.gallery .theme-list > .each-document > a.title { width:100%!important; }

.depth4 { text-align:center; margin-bottom:30px;  }
.depth4 li { display:inline-block; margin:0px 10px; padding:5px 0px; border-bottom:1px solid #aaa; transition:all 0.3s ease; }
.depth4 li a { font-size:18px; color:#777; text-decoration:none;  transition:all 0.3s ease;  }
.depth4 li:hover a { color:#333;  }
.depth4 li.active a { color:#333;  }


@media (min-width:1200px) and (max-width:1499px) {
}


@media (min-width:993px) and (max-width:1199px) {
    header #main-logo { left:15px; }
    header .login-wrap { right:15px; }
	#gnb > li { padding:0 5px; }
    .foot-1, .foot-2 { padding:0; }
}

@media (min-width:768px) and (max-width:992px) {
	#footer { padding:25px 0; text-align:center; }
	#footer img {display:block; margin:0 auto 15px; }
	#footer ul { margin:0; }
	#footer h3 { margin-top:5px; }
    header { overflow:hidden; }
    header .login-wrap { display:none; }
    header #main-logo { position: absolute; top: 25px; left: 15px; }
}

@media (max-width:767px) {
	#footer { padding:25px 0; text-align:center; }
	#footer img {display:block; margin:0 auto 15px; max-width:120px; }
	#footer ul { margin:0; }
	#footer h3 { margin-top:5px; }
    header { overflow:hidden; padding:25px 0; }
    header .login-wrap { display:none; }
    header #main-logo { position: absolute; top: 25px; left: 15px; max-width:120px; }
}