/****************** CSS RESET ******************/

@charset "UTF-8";
@import url(http://211.234.100.234/font/nanumgothic.css);

* {
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		margin:0; padding:0; border:0;
		font-family:'Nanum Gothic', sans-serif;
}

a {text-decoration:none;}
html { overflow-y:scroll; }
body, html { width:100%; height:100%; }
ul, li { list-style:none; display:block;}
address { display:block; }
strong { font-weight:bold; font-size:inherit; font-family:inherit;}
img { border:0; margin:0; padding:0; }
/****************** Style ******************/

#wrapper {
	width:100%;
}

/************Header*************/

#header_wrapper {
	width:360px;
	margin:0 auto;
	height:auto;
	overflow:hidden;
}
#header {
	width:100%;
	height:auto;
	overflow:hidden;
}

#header > #top {
	width:100%;
	height:auto;
	overflow:hidden;
	padding:10px 0;
	color:#fff;
	background-color:#00427a;
	text-align:center;
	border-bottom:1px solid #c8c8c8;
	font-size:14.5px;
}

#header > #logo {
	width:100%;
	text-align:center;
	padding:10px 0;
}


/***************NAV************/

#nav_wrapper{
	text-align: left;
	background:#00427a;
}

#nav_wrapper > #toggleMenu {
	display:inline-block;
	width: 100%;
	height:40px;
	line-height:40px;
	color: #FFF;
	font-size: 1em;
	font-weight: 600;
	text-align:right;
	padding:0 0.7em;
}

#nav_wrapper > #toggleMenu i {
	float:left;
	display:inline-block;
	line-height:40px;
	font-size:1.5em;
}

#nav_wrapper > #toggleMenu > p { margin-right: 260px; }

#nav_wrapper > #nav {
	display:none;
	background-color:#fff;
}

#nav_wrapper:hover > #nav {
	display:block;
}

#nav li {
    position: relative;
	clear:both;
}

#nav li a {
	display: block;
	padding: 10px 15px;
	color: #555;
	font-size: 0.85em;
	font-weight: 600;
	-webkit-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-ms-transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	transition: all 0.5s ease-out;
	text-decoration: none;
	border-bottom:1px solid #d8d8d8;
}

#nav li a:hover {
	background:#00427a;
	color:#fff;
}


#nav li ul { 
	display:none;
}

#nav li:hover ul {
	display:block;
}

#nav li:hover ul li {
	clear:both;
	width:100%;
}

#nav li a {
	padding: 10px 10px;
}

#nav li ul li a {
	padding:10px 20px;
}
/***********MAIN*************/
#main_wrapper {
	width:360px;
	margin:0 auto;
	height:450px;
	overflow:hidden;
	text-align:center;
}


/***********MAIN*************/

#sub_wrapper {
	width:360px;
	margin:0 auto;
	height:auto;
	overflow:hidden;
}

h2.title {
	padding:0.5em 0.5em 0.5em 0.3em;
	color:#00427a;
}

h2.sub0101 span {
	color:#d2232a;
}
p.sub0101 {
	font-size:11px;
	line-height:150%;

}


p.sub0401 {
	font-size:11px;
	letter-spacing:-1px;
	line-height:140%;
}

p.sub0401 span {
	background-color:#d2232a;
	color:#fff;
	padding:2px;
}
/**************QUICK*************/
#quick_wrapper {
	width:360px;
	margin:0 auto;
	height:auto;
	overflow:hidden;
}

#quick > span {
	display:block;
	width:100%;
	background-color:#8cbe02;
	padding:1em 2em;
	color:#ffe81a;
	font-weight:600;

}

#quick > ul > a {
	display:block;
	width:20%;
	float:left;
	background-color:#e8e8e8;
	padding:1em 0;
	border-bottom:1px solid #c8c8c8;
	text-align:center;
}

#quick > ul > a > li {
	display:block;
	font-size:0.9em;
	color:#00427a;
	text-shadow:1px 1px 1px #999;
	font-weight:600;
}

#quick > ul.customer > a {
	width:50%;
	float:left;
	padding:1em 0;
	text-align:center;
}



/****************Footer**********/

#footer_wrapper {
	width:360px;
	margin:0 auto;
	height:auto;
	overflow:auto;
	text-align:center;
	background-color:#e8e8e8;
	padding:0.5em 0;
}

#footer_wrapper > p {
	font-size:11px;
	line-height:150%;
	letter-spacing:-1px;
}

#footer_wrapper > p > a:link { text-decoration:none; }
#footer_wrapper > p > a:hover { text-decoration:none; }
#footer_wrapper > p > a:visited { text-decoration:none; }
#footer_wrapper > p > a:active { text-decoration:none; }
