@charset "utf-8";
@import url(//fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url(//fonts.googleapis.com/earlyaccess/nanummyeongjo.css);
* { font-family:'나눔고딕', 'Nanum Gothic', 'Nanum Myeongjo';}

/* Common */
body,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select{margin:0;padding:0}
body,input,textarea,select,button,table{}
img,fieldset{border:0}
ul,ol{list-style:none}
em,address{font-style:normal}
a{text-decoration:none}
a:hover,a:active,a:focus{text-decoration:underline}

.img_block { display:block;}

body { min-width:320px;}
@media screen and (max-width:767px) {

	/* Layout */
	#wrap{width:100%;margin:0 auto}
	#header{width:100%}
	#container{width:100%}
	#container:after{display:block;clear:both;content:''}
	#content{float:left;width:100%; padding-bottom:20px;}
	#content .left_side { display:none;}
	#content .right_side { width:100%;}
	#content:after{display:block;clear:both;content:''}
	#footer{width:100%;}

	#header .m_header { background:#09F; padding:5px;}
	#header .m_header .title { float:left; font-size:18px; font-weight:bold; color:#FFF; margin-top:2px; }
	#header .m_header .btn { float:right;}
	#header .m_header:after{display:block;clear:both;content:''}
	#header .gnb .menu { display:none; }
	#header .sta,
	#header .lnb,
	#header .flash { display:none;}

	.gnb{background:#f8f8f8;padding:1px 0}
	/* Global Navigation */
	.menu{margin:0;padding:0;list-style:none;background:#d3d1cc;text-shadow:1px 1px 0 #fff;font-size:14px}
	.menu li{background:#c3c3c3;border:1px solid #a3a09a;border-left:0;border-right:0;margin:0 0 -1px 0}
	.menu li li{background:#f8f8f8;border:1px solid #c9c9c9;border-left:0;border-right:0}
	.menu li li li{background:#e8e8e8}
	.menu ul{margin:0 0 -1px 0;padding:0;list-style:none}
	.menu a{position:relative;text-decoration:none;display:block;padding:10px}
	.menu li a{color:#333}
	.menu li a:after{position:absolute;top:7px;right:10px;content:"›";color:#888;font-size:18px;font-weight:bold;font-family:Verdana, Geneva, sans-serif}
	.menu li li a:before{content:"";display:inline-block;width:6px;height:6px;border:1px dotted #666;border-top:0;border-right:0;margin:0 4px 0 0;vertical-align:top}
	.menu li li a{padding-left:15px}
	.menu li li li a{padding-left:30px}
	.menu li li li li a{padding-left:45px}
	.menu li li li li li a{padding-left:60px}
	.menu em{color:#f63;font-size:12px}

	#content .right_side .h_bar {display:none;}
	#content .right_side h2 { font-size:16pt; margin:10px 10px;}
	#content .right_side .content_img { width:100%;}



	#footer ul { border-top:1px solid #e0e0e0;}
	#footer li { display:block; }
	#footer .logo { display:none;}
	#footer .bar { display:none;}
	#footer .address {text-align:center; margin:10px 0 20px 0; }
	#footer .address span { white-space:nowrap;}
	#footer .link {  display:none;}
}
@media screen and (min-width:768px) {
	#wrap {width:1050px; margin:0px auto;}

	.jcbg1 { background-repeat:no-repeat;background-position:top center;background-image:url(../images/bg_img01.jpg);}
	.jcbg2 { background-repeat:no-repeat;background-position:top center;background-image:url(../images/bg_img02.jpg);}
	.jcbg3 { background-repeat:no-repeat;background-position:top center;background-image:url(../images/bg_img03.jpg);}
	.jcbg4 { background-repeat:no-repeat;background-position:top center;background-image:url(../images/bg_img04.jpg);}
	.jcbg5 { background-repeat:no-repeat;background-position:top center;background-image:url(../images/bg_img05.jpg);}
	.jcbg6 { background-repeat:no-repeat;background-position:top center;background-image:url(../images/bg_img06.jpg);}
	.jcbg7 { background-repeat:no-repeat;background-position:top center;background-image:url(../images/bg_img07.jpg);}
	.jcbg8 { background-repeat:no-repeat;background-position:top center;background-image:url(../images/bg_img08.jpg);}

	#header{width:940px; height:285px; margin:auto; position:relative;}
	#container{width:100%}
	#container:after{display:block;clear:both;content:''}
	#content { width:940px; min-height:600px; margin:auto; padding-bottom:20px;}
	#content .left_side {float:left;width:170px; margin-left:5px; margin-right:20px; min-height:600px;}
	#content .right_side {float:left;width:730px;}
	#content:after{display:block;clear:both;content:''}
	#footer{width:940px; margin:auto; border-top:3px solid #f4f4f4; color:#999; margin-top:20px; width:940px;}
	
	#header .m_header { display:none; }
	#header .gnb { position:absolute; top:50px; right:0; z-index:99999;}
	#header .sta { position:absolute; top:30px; left:0;}
	#header .lnb { position:absolute; top:9px; right:0;}
	#header .lnb li { float:left;}
	#header .flash { left:500px; top:110px; position:absolute; z-index:1;}

	
	.menu,
	.menu ul,
	.menu li,
	.menu a {
		margin: 0;
		padding: 0;
		border: none;
		outline: none;
	}
	
	/* Menu */
	.menu {
		height: 40px;
		width: 690px;
	
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
	}
	
	.menu li {
		position: relative;
		list-style: none;
		float: left;
		width:110px;
		display: block;
		height: 40px;
	}

	/* Links */
	
	.menu li a {
		display: block;
		padding: 0 14px;
		margin: 6px 0;
		line-height: 28px;
		text-decoration: none;
		text-align:center;
		
		border-left: 1px solid #e8e8e8;
		border-right: 1px solid #4f5058;
	
	/*	font-family: Helvetica, Arial, sans-serif;*/
		font-weight: bold;
		font-size: 14px;
	
		color: #030303;
	
		-webkit-transition: color .2s ease-in-out;
		-moz-transition: color .2s ease-in-out;
		-o-transition: color .2s ease-in-out;
		-ms-transition: color .2s ease-in-out;
		transition: color .2s ease-in-out;
	}
	
	.menu li:first-child a { border-left: none; }
	.menu li:last-child a{ border-right: none; }
	
	.menu li:hover > a { color: #0012ff; }
	
	/* Sub Menu */
	
	.menu ul {
		position: absolute;
		top: 40px;
		left: 0;

		opacity:0;
		visibility:hidden;
		
		background: #0f9ac9;
	
		-webkit-border-radius: 5px 5px 5px 5px;
		-moz-border-radius: 5px 5px 5px 5px;
		border-radius: 5px 5px 5px 5px;
	
		-webkit-transition: opacity .25s ease .1s;
		-moz-transition: opacity .25s ease .1s;
		-o-transition: opacity .25s ease .1s;
		-ms-transition: opacity .25s ease .1s;
		transition: opacity .25s ease .1s;
	}
	
	.menu li:hover > ul { visibility:visible; opacity:1; }
	
	.menu ul li {
		height: 0;
		overflow: hidden;
		padding: 0;
	
		-webkit-transition: height .25s ease .1s;
		-moz-transition: height .25s ease .1s;
		-o-transition: height .25s ease .1s;
		-ms-transition: height .25s ease .1s;
		transition: height .25s ease .1s;
	}
	
	.menu li:hover > ul li {
		height: 30px;
		overflow: hidden;
		padding: 0;
	}
	
	.menu ul li a {
		width: 100px;
		padding: 0px 0 0px 10px;
		margin: 0;
	
		text-align:left;
		font-size:11px;
		color: white;
		letter-spacing:1px;
	
		border: none;
		border-bottom: 1px solid  #1aa8d8; /**/
	}
	
	.menu ul li:hover > a { color: #8fde62; }
	
	.menu ul li:last-child a { border: none; }

	
	#content .right_side h2 { font-size:16pt; margin-bottom:10px;}

	#content .left_side .menu_name { padding:5px 0; margin:0 10px; font-size:16pt; text-align:center; font-weight:bold; color:#333; border-bottom:#999 dashed 1px; }
	#content .left_side .gnb { margin:10px 0 0 0; padding:0; list-style:none;}
	#content .left_side .gnb li { width:163px; text-align:left; height:20px; padding-top:3px; border:transparent 1px solid; margin-bottom:2px;
		-webkit-border-radius: 5px 5px 5px 5px;
		-moz-border-radius: 5px 5px 5px 5px;
		border-radius: 5px 5px 5px 5px;
	 }
	#content .left_side .gnb li a { padding:3px 20px 5px 10px; text-decoration:none; color:#333; font-size:10pt; }
	#content .left_side .gnb li:hover { background:#FFC; border:#060 1px solid; }
	#content .left_side .gnb li a:hover { color:#090; }


	#footer li { float:left; }
	#footer .logo { margin:12px 20px 0 45px; }
	#footer .bar {}
	#footer .address { margin:12px 0 0 0; }
	#footer .link { float:right; margin-top:20px;}
}