@charset "utf-8";

/* tag reset */
.preload * {
	-webkit-transition: none !important;
	-moz-transition: none !important;
	-o-transition: none !important;
	-ms-transition: none !important;
	transition: none !important;
}

/* reset */
html{font-size:13px;}
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{background-color:#FFF;color:#111;-webkit-text-size-adjust:none}
table{border-collapse:collapse}
img,fieldset{border:0}
ul,ol,li{list-style:none}
em,address{font-style:normal}
a{color:inherit;text-decoration:none}
img{vertical-align:top}
button{border:0;outline-style:none;cursor:pointer}
table{border-collapse:collapse}

input, select, textarea { border-radius: 0; margin: 0; padding: 0; }
input, textarea { -webkit-appearance:none; }

body {
	font-family: 'RobotoWeb',"NanumGothicWeb",Dotum,돋움,Gulim,굴림,sans-serif; color: #676767;
	-webkit-text-size-adjust: none; /* 모바일에서 text 사이즈 변동 없게 */
	-webkit-font-smoothing: subpixel-antialiased; /* Mac 웹폰트 오류 수정 */
	font-variant-ligatures: none; /* fi수정 */
}
img {
	/*image-rendering: optimizeSpeed;*/ /* low quality */
	/*image-rendering: optimizeQuality;*/ /* high quality */
	-ms-interpolation-mode: bicubic; /* blur */
	/* -ms-interpolation-mode: nearest-neighbor; /* sharpen */
	max-width: 100%;
}
h1, h2, h3, h4, input, button, select {
	font-family: 'RobotoWeb',"NanumGothicWeb",Dotum,돋움,Gulim,굴림,sans-serif; outline: medium none;
}
table {
	border-spacing: 0; *border-collapse: collapse !important;
}
a, input {
	color:#676767;
	text-decoration:none;
	-webkit-transition: all 0.3s ease 0s;
	-moz-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
	-ms-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
}
a:hover {
	color: #000;
	text-decoration: underline;
}

/* call class */
.clear { *zoom:1 } /* float clear */
.clear:after { content:" "; display:block; clear:both; } /* float clear */
.float_l { float:left; } /* float left */
.float_r { float:right; } /* float right */
.none_blank { font-size: 0; line-height: 0; letter-spacing: -4px; } /* 이미지여백삭제 (안드로이드) */
@-moz-document url-prefix() { .none_blank {letter-spacing: 0;} } /* 파폭 */
.displaynone { display:none; }


/* Layout */
body {
	min-width: 320px;
	overflow-x: hidden;
}
#fixoWrap {
	width: 100%;
	overflow: hidden;
}
#fixoHeader {
	background: #fff;
	border-bottom: 1px solid #dfdfdf;
}
#fixoContainer {
}
#fixoContent {
}

/* btnTop */
#btnTop {
	position: fixed; bottom: 10px; right: 10px; z-index: 99;
	display: none;
}
#btnTop img {
	display: block;
	padding: 13px 10px 17px;
	background: #000;
	cursor: pointer;
	position: relative;
}

/* fixoHeader */
#fixoHeader .inner {
	max-width: 1200px; height: 65px;
	padding: 0 40px;
	margin: 0 auto;
}
#fixoHeader .inner h1 {
	float: left;
	padding: 19px 0 0 0;
}
#fixoHeader .inner h1 img {
	height: 26px;
}
#fixoHeader .inner .mobile_menu {
	display: none;
	cursor: pointer;
	-webkit-transition: all 0.3s ease-out 0s;
	-moz-transition: all 0.3s ease-out 0s;
	-o-transition: all 0.3s ease-out 0s;
	-ms-transition: all 0.3s ease-out 0s;
	transition: all 0.3s ease-out 0s;
	width: 20px; height: 20px;
	background: url(/2016/images/common/btn_menu_bk.png) no-repeat center;
	background-size: 20px auto;
	padding: 10px;
	position: absolute; top: 5px; right: 10px; z-index: 9;
}
#fixoHeader .inner .mobile_menu.select {
	-webkit-transform: rotate(-180deg);
	-moz-transform: rotate(-180deg);
	-o-transform: rotate(-180deg);
	-ms-transform: rotate(-180deg);
	transform: rotate(-180deg);
	background: url(/2016/images/common/btn_menu_close_bk.png) no-repeat center;
	background-size: 20px auto;
}
#fixoHeader .inner .menus {
	float: right;
	padding: 25px 0 0 0;
	display: block;
}
#fixoHeader .inner .menus #gnb {
	float: left;
}
#fixoHeader .inner .menus #gnb li {
	float: left;
	margin: 0 0 0 24px;
}
#fixoHeader .inner .menus #gnb a {
	display: block;
	font-size: 16px; color: #000; font-weight: 700; line-height: 20px;
	font-family: "NanumGothicWeb";
	text-decoration: none;
	position: relative;
}
#fixoHeader .inner .menus #gnb li.active span, 
#fixoHeader .inner .menus #gnb li:hover span {
	display: inline-block;
	position: absolute; bottom: -5px; left: 0;
	width: 100%; height: 1px;
	background: #000;
}
#fixoHeader .inner .menus .works {
	float: left;
	margin: 0 0 0 52px;
}
#fixoHeader .inner .menus .works a {
	font-size: 18px; color: #000; font-weight: 900; line-height: 20px;
	text-decoration: none;
	padding: 0 20px 0 0;
	background: url(/2016/images/common/icon_arrow_bk.png) no-repeat right center;
}

@media screen and (max-width: 860px) {
	#fixoHeader {
		height: 50px;
		background: none;
		border: 0;
	}
	#fixoHeader .inner {
		position: fixed; top: 0; left: 0; z-index: 9;
		width: 100%;
		height: 49px;
		padding: 0;
		background: #fff;
		border-bottom: 1px solid #dfdfdf;
	}
	#fixoHeader .inner h1 {
		padding: 12px 0 0 20px;
	}
	#fixoHeader .inner .mobile_menu {
		display: block;
	}

	#fixoHeader .inner .menus {
		display: none;
		float: none;
		padding: 0;
		position: absolute; top: 50px; left: 0;
		width: 100%;
		background: #efefef;
	}
	#fixoHeader .inner .menus #gnb {
		float: none;
	}
	#fixoHeader .inner .menus #gnb li {
		float: none;
		margin: 0 30px;
		border-bottom: 1px solid #fff;
	}
	#fixoHeader .inner .menus #gnb a {
		font-size: 15px; color: #000; font-weight: 400; line-height: 50px;
	}
	#fixoHeader .inner .menus #gnb li.active span, 
	#fixoHeader .inner .menus #gnb li:hover span {
		display: none;
	}
	#fixoHeader .inner .menus .works {
		float: none;
		margin: 0;
		text-indent: 30px;
	}
	#fixoHeader .inner .menus .works a {
		display: block;
		color: #000; font-weight: 700; line-height: 50px;
		padding: 0;
		background: none;
	}
}