body {font:12px "Nanum Gothic", malgun gothic, gulim, sans-serif;}
input,select,textarea {font:12px "Nanum Gothic", malgun gothic, gulim, sans-serif;}
select {font:12px "Nanum Gothic", malgun gothic, dotum, sans-serif;}
label {cursor:pointer;}
a {text-decoration:none;color:#000;}
a:hover {color:#666;}
.wrap {width:1100px;margin:auto;}


/* gnb */

#gnb { background:#fafafa; border-bottom:1px solid #dcdcdc;}
#gnb .left,
#gnb .right { display:table; border-collapse:collapse;}
#gnb a { display:table-cell; line-height:18px; padding:6px 10px; border:1px solid #dcdcdc; border-width:0 1px; vertical-align:middle;}
#bookmarkme { position:relative; padding-left:30px !important;}
#bookmarkme::before { content:url(../../images/icon/favorite.png); position:absolute; left:8px;}
#gnb .home > img { vertical-align:middle; position:relative; top:-1px;}


/* header */

#header { height:120px; overflow:visible;}
#header .wrap { position:relative;}
#header h1 { position:absolute; left:0; top:0;}

#header .search { position:absolute; left:335px; top:34px;}
#header .search .keyword { margin:0; padding:0; float:left; width:293px; height:31px; text-indent:5px; line-height:31px; border:solid #1893f2; border-width:3px 0 3px 3px;}
#header .search .submit { margin:0; padding:0; float:right; width:80px; height:37px; background:#1893f2; border:0; cursor:pointer; color:#fff; font-size:16px; font-weight:700; letter-spacing:-0.05em;}

#header .search .tag { clear:both; padding:5px 0 5px 40px; width:330px; background:url(../../images/icon/hit.png) 0 51% no-repeat;}
#header .search .tag a { white-space:nowrap;}


/* lnb */

#lnb { height:50px; background:#1893f2; color:#fff; box-shadow:0 2px 5px rgba(0,0,0,.25); position:relative; z-index:1;}
#lnb .wrap { position:relative; z-index:2;}
#lnb .wrap::before { content:""; position:absolute; left:-37px; top:0; width:294px; height:50px;
	background:url(../../images/bg/shop-shadow-left.png) left repeat-y, url(../../images/bg/shop-shadow-right.png) right repeat-y;}
#lnb .shop { position:absolute; left:-10px; top:-10px; overflow:hidden; min-height:60px;}
#lnb .shop.open,
#lnb .shop:hover { overflow:visible;}
#lnb .shop .title { position:relative; z-index:4; display:block; width:240px; height:50px; text-align:center;
	background:url(../../images/bg/crystal-blue.png) -12px -83px no-repeat, url(../../images/bg/crystal-blue.png) 177px -95px no-repeat;
	background-color:#005fa9;
	box-shadow:0 14px 0 -10px rgba(0,0,0,.1);
}
#lnb .shop .title::before { content:""; position:absolute; z-index:3; left:0; bottom:-10px;
	display:block; width:0; height:0; border:5px solid; border-color:#004a84 #004a84 transparent transparent;
}
#lnb .shop .title::after { content:""; position:absolute; z-index:3; right:0; bottom:-10px;
	display:block; width:0; height:0; border:5px solid; border-color:#004a84 transparent transparent #004a84;
}
#lnb .shop .title > span { display:inline-block; position:relative; top:13px; font-weight:700; font-size:20px; line-height:22px; color:#fff;}
#lnb .shop .title > span::after { content:url(../../images/icon/arrow-white.png); margin:0 0 0 15px; vertical-align:text-top;
	-ms-transform:rotate(90deg); /* IE 9 */
	-webkit-transform:rotate(90deg); /* Chrome, Safari, Opera */
	-moz-transform:rotate(90deg); /* Firefox */
	transform:rotate(90deg);

    -webkit-transition:all 200ms; /* Safari 3.1 to 6.0 */
    transition:all 200ms;
}
#lnb .shop.open .title > span::after,
#lnb .shop:hover .title > span::after {
	-ms-transform:rotate(0); /* IE 9 */
	-webkit-transform:rotate(0); /* Chrome, Safari, Opera */
	-moz-transform:rotate(0); /* Firefox */
	transform:rotate(0);
}
#lnb .shop .list { margin:0 auto; padding:0; width:210px; height:0; background:#fff; border:solid #ccc; border-width:0 5px 5px;
	position:relative; z-index:0;
	box-shadow:inset 0 0 30px rgba(0,0,0,.1);
}
#lnb .shop.open .list { height:100%;}
#lnb .shop ul,
#lnb .shop li { display:block; margin:0; padding:0; width:100%; list-style:none;}
#lnb .shop .ul { position:absolute; bottom:0; min-height:435px;}
#lnb .shop.open .ul { position:static;}
#lnb .shop .li { position:relative; background:url(../../images/bg/dashed.png) 0 bottom repeat-x;}
#lnb .shop .li > a { display:block; padding:0 0 0 35px; background:url(../../images/icon/bullet-gray.png) 20px 50% no-repeat;
	font-weight:700; font-size:16px; line-height:42px; color:#555;
}
#lnb .shop .li > a:hover { background-image:url(../../images/icon/bullet-blue.png); color:#1893f2;}
#lnb .shop .ad img { display:block; margin:20px auto;}

#lnb .shop .sub { position:absolute; z-index:1; left:90%; top:40%; padding:10px; display:none;
	background:#fff linear-gradient(#eee 0%,#fff 10%,#fff 90%,#eee 100%); border:1px solid #ccc; border-radius:2px;
	font-size:15px; line-height:1.5;
}
#lnb .shop .sub-li { white-space:nowrap; padding:0 0 0 13px; background:url(../../images/icon/bullet-arrow-blue.png) left center no-repeat;}
#lnb .shop .sub-li + .sub-li { margin-top:5px;}

#lnb .shop .sub-li a:hover { color:#09f;}

#lnb .menu { position:absolute; left:220px; width:880px; height:50px;}
#lnb .menu ul { display:table; margin:0; padding:0; width:100%; list-style:none;
	table-layout:fixed; border-collapse:separate; border-right:1px solid #46a9f5;
}
#lnb .menu li { display:table-cell; margin:0; padding:0; text-align:center; vertical-align:middle;
	border-left:1px solid #46a9f5; border-right:1px solid #1076cf;
}
#lnb .menu a { display:block; line-height:50px; font-weight:700; font-size:18px; color:#fff;}

/* content */

#content {padding:20px 0 0 0;min-height:500px;}

#footer {}
#footer ul,
#footer li { display:block; margin:0; padding:0; list-style:none;}
#footer .section-1 table { margin:50px auto; padding:0; border-collapse:collapse; table-layout:fixed; width:100%;}
#footer .section-1 td { margin:0; padding:0; border:1px solid #d8d8d8; vertical-align:top;}
#footer .section-1 img { vertical-align:bottom;}
#footer .section-1 .latest { margin:20px; position:relative; z-index:1;}
#footer .section-1 .latest .title { font-weight:bold; font-size:20px; line-height:24px; letter-spacing:-0.025em;}
#footer .section-1 .latest .more { display:block; position:absolute; right:0; top:0; width:25px; height:22px; line-height:22px;
	font-weight:700; font-size:20px; text-align:center; border:1px solid #6f6f6f; color:#6f6f6f;
}
#footer .section-1 .latest .list { margin:20px 0 0 0; font-size:13px; line-height:24px; width:calc(100% + 10px);}
#footer .section-1 .latest .list li { overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
#footer .section-1 .latest .list li::before { content:"· "; font-weight:bold;}
#footer .section-1 .latest .list a { color:#666;}

#footer .section-2 { padding:17px 0 15px; border:solid #d8d8d8; border-width:1px 0;}
#fnb li { display:inline; font-size:13px; vertical-align:middle;}
#fnb li + li::before { content:" │ "; color:#9c9c9c; font-size:9px; vertical-align:middle;}
#footer .icons li { float:left; margin:0 0 0 5px;}
#footer .icons img { display:block; box-shadow:0 1px 2px rgba(0,0,0,.3);}
#footer .logo { width:248px; height:174px; margin:18px 0; border-right:1px solid #ccc;}
#footer .logo img { margin-top:54px;}
#footer .section-3 .right { width:736px; margin:30px 0;}
#footer .information { color:#555; font-size:12px; line-height:17px; margin-left:-14px;}
#footer .information span { white-space:nowrap; margin-left:14px; letter-spacing:-0.03em;}
#footer .copyright { color:#888; font-weight:bold; font-size:11px; line-height:18px; text-transform:uppercase;}
#footer .cooperators { clear:both; display:table; margin-left:-30px;}
#footer .cooperators li { display:table-cell; height:50px; vertical-align:middle; padding-left:30px;}
#footer .cooperators img { vertical-align:middle;}
#footer .certifications { clear:both; margin-left:-10px;}
#footer .certifications li { float:left; width:161px; height:43px; margin-left:10px; padding-top:4px; text-align:center;
	border:1px solid #d8d8d8;
}
#footer .certifications img { vertical-align:middle; margin-right:9px;}
#footer .certifications span { display:inline-block; text-align:left; vertical-align:middle;
	font-weight:700; font-size:13px; line-height:15px; color:#2e2e2e;
}


/* classes for decorations */

.z1 { z-index:1; box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);}
.z2 { z-index:2; box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);}
.z3 { z-index:3; box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);}
.z4 { z-index:4; box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);}
.z5 { z-index:5; box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);}