﻿@charset "utf-8";


html{overflow-x:hidden}
.wrapper{position:relative;width:100%;height:100%;min-width:320px;margin:0 auto;}
.innerWrap{margin:0 auto;word-break:keep-all}

/* allMenu */
header .allMenu{display:none;}

/* utill*/
.utill{border-bottom:1px solid #ececec;background-color:#fff}
.utill .sns li{float:left}
.utill .sns li{border-right:1px solid #ececec}
.utill .sns li:first-child{border-left:1px solid #ececec;}
.utill .sns li a{display:block;padding:12px 15px;color:#000;font-size:12px;text-align:center;}

.utill .lang{position:absolute;right:5px;top:0;z-index:10;background-color:#fff;}
.utill .lang .btnLang{display:none}
.utill .lang li{display:inline-block;}
.utill .lang li a{display:block;padding:11px 4px;color:#000;font-size:13px;font-weight:600;}
.utill .lang li:first-child a{padding-right:9px;background:url("../../images/layout/bar01.png") no-repeat right center;}

/* header */
header h1{float:left;}
header h1 a{position:absolute;top:15px;left:15px;}

.gnbWrap{float:right;padding:15px 0;}
.gnbWrap > nav > ul > li{display:inline-block;position:relative;}
.gnbWrap > nav > ul > li > a{display:block;color:#a2a3a7;font-weight:600;}
.gnbWrap > nav > ul > li > a:hover,
.gnbWrap > nav > ul > li.current > a{color:#fff;}
.gnbWrap > nav > ul > li > .inner{display:none;}
.gnbWrap > nav > ul > li.current > .inner{display:block;}
.gnbWrap > nav > ul > li > .inner > ul > li > a{display:block;line-height:19px;padding:15px 10px;color:#5d666d;font-size:14px;text-align:center;border-bottom:1px solid #e2e1e1}
.gnbWrap > nav > ul > li > .inner > ul > li > a:hover,
.gnbWrap > nav > ul > li > .inner > ul > li.current > a{color:#fa6137;}

.lnb{background-color:#fff;z-index:9;}
.lnb h3{color:#000;font-size:27px;}
.lnb ul:after{content:"";display:block;clear:both}

/* breadcrumb */
.breadcrumb .blank{position:absolute;width:100%;height:50px;background-color:#fff}


#content .content{z-index:5}

footer{padding:35px 0;margin-top:60px;color:#fff;background-color:#4c4d55;}
footer .innerWrap .jsInfo,
footer .innerWrap .jsInfo h3,
footer .innerWrap .jsInfo .jsInfo{float:left;font-size:13px;line-height:18px}
footer .innerWrap .jsInfo h3{font-weight:600;margin-right:15px}
footer .innerWrap .jsInfo{margin:0 auto;}
footer .innerWrap .jsInfo .jsInfo address{font-style:normal}
footer .innerWrap .jsInfo .jsInfo ul li{display:inline-block;}
footer .innerWrap .jsInfo .jsInfo ul li a{color:#fff}
footer .innerWrap .copyright{float:right;color:#959595;font-size:11px;}


/* ---------------------------------------- mobile ------------------------------------------------------------------------- */
@media all and (max-width:767px) {
	.innerWrap{padding:0 15px}
	.lnb ul,
	.breadcrumb .blank{display:none}
	* {
		-webkit-text-size-adjust: 100%;
		-moz-text-size-adjust: 100%;
		-ms-text-size-adjust: 100%;
	} /* ios text 확대 현상 patch */
	/* utill */
	.utill .sns li a{padding:10px;}
		
	.utill .lang{top:2px;right:0;height:30px;width:77px;text-align:center;background-color:#fff}
	.utill .lang .btnLang{display:block;padding:6px 16px 6px 0;color:#000;font-size:13px;cursor:pointer;background:url("../../images/common/arrow.png") no-repeat right top;}
	.utill .lang ul{display:none;background-color:#fff;}
	.utill .lang li:first-child a{padding-right:12px;background:none;}
	.utill .lang li a{padding:8px 12px 8px 5px;font-size:12px;color:#72767e}
	
	header{position:relative;top:auto;left:auto;width:100%;z-index:10}
	header .innerWrap{padding:0;}
	header h1{position:relative;float:none;width:100%;height:66px;/* background-color:#1f1f1f */}
	
		
	.gnbWrap{position:fixed;top:0;right:0;float:none;width:0;height:100%;min-height:100%;color:#a6abab;font-size:13px;/* background-color:#343434 ;*/z-index:9;transition: width .25s ease-out;-webkit-transition: width .25s ease-out;}
	.gnbWrap.open{width:250px}
	.gnbWrap .allMenu{display:block;position:absolute;top:33px;left:-66px;width:66px;height:66px;text-indent:-23em;background-color:#343434;overflow:hidden;cursor:pointer;transition: all .25s ease-out;-webkit-transition: all .25s ease-out;}
	.gnbWrap .allMenu:before,
	.gnbWrap .allMenu:after{display: block;position:absolute;top:22px;left:22px;content:'';width:22px;height:5px;border-top:4px solid #888;border-bottom:4px solid #888;}
	.gnbWrap .allMenu:after{top:40px;left:22px;border-top: 4px solid #888;border-bottom: none;}
	.gnbWrap #gnb{position:relative;top:-1px;bottom:0;min-height:100%;height:200px; background-color:#343434;overflow:hidden;overflow-y:auto;}
	.gnbWrap #gnb{top:-15px;}
	
	.gnbWrap > nav > ul > li{display:block;}
	.gnbWrap > nav > ul > li > a{display:block;line-height:25px;padding:18px 30px 0 30px;font-size:15px;}	
	.gnbWrap > nav > ul > li > a:hover,
	.gnbWrap > nav > ul > li.current > a{color:#e77308;}
	.gnbWrap > nav > ul > li > .inner > ul{margin-top:10px;background:transparent}
	.gnbWrap > nav > ul > li > .inner > ul > li > a{line-height:20px;padding:0 30px;margin-top:5px;font-size:13px;text-align:left;border-bottom:0 none}
	.gnbWrap > nav > ul > li > .inner > ul > li > a:hover,
	.gnbWrap > nav > ul > li > .inner > ul > li.current > a{border-bottom:0 none}
	.gnbWrap > nav > ul > li > .inner > ul > li > a:hover,
	.gnbWrap > nav > ul > li > .inner > ul > li.current > a{color:#fff;}
	
	.lnb h3{margin-bottom:25px;}
	
	div.breadcrumb{line-height:16px;padding:10px 0;margin-bottom:30px;font-size:12px;}
	
	footer{padding:20px 0;margin-top:30px;text-align:center}
	footer .innerWrap .jsInfo,
	footer .innerWrap .jsInfo h3,
	footer .innerWrap .jsInfo .jsInfo{float:none;}
	footer .innerWrap .jsInfo h3{margin:0 0 10px;font-size:14px}
	footer .innerWrap .copyright{float:none;margin-top:10px;}
}



/*------------------------------- tablet 768 ----------------------------------------------------------------------------------------------*/
@media all and (min-width:768px) and (max-width:1023px) {
	.innerWrap{position:relative;padding:0 15px;overflow:hidden;}
	
	header{position:fixed;top:0;width:100%;height:106px;background-color:#fff;z-index:10}
	header .innerWrap{overflow:visible}
	
	.gnbWrap > nav > ul > li > a{padding:12px 20px;}
	.gnbWrap > nav > ul > li > a:hover,
	.gnbWrap > nav > ul > li.current > a{color:#fff;border-radius:30px;background-color:#fa6137}
	.gnbWrap > nav > ul > li > .inner{position:absolute;top:39px;left:50%;z-index:10;width:180px;padding-top:10px;margin-left:-90px;letter-spacing:-1px;border-radius:5px;background:#fff url("../../images/layout/blet.png") no-repeat center 3px;}
	.gnbWrap > nav > ul > li > .inner > ul{border:1px solid #e2e1e1;border-radius:5px;-moz-box-shadow: 2px 3px 5px #ebebeb;-webkit-box-shadow: 2px 3px 5px #ebebeb;box-shadow: 2px 3px 5px #ebebeb;}
	
	.en .gnbWrap > nav > ul > li > a{padding:12px 10px;}
	
	/* lnb */
	.lnb{position:fixed;left:15px;top:156px;width:100%;padding:30px 0 20px;background-color:#fff}	
	.lnb h3{margin-bottom:15px;}
	.lnb ul{display:table;table-layout:fixed;width:100%;}
	.lnb ul li{display:table-cell;width:19%;margin-top:3px;vertical-align:middle;border:1px solid #d5d5d5;}
	.lnb ul li a{display:block;padding:15px 5px;font-size:13px;text-align:center;}
	.lnb ul li.current{border: 1px solid #f95224;background-color:#fa6137;}
	.lnb ul li.current a{color:#fff;}		
	.lnb ul li.current:hover,
	.lnb ul li.current:hover a,
	.lnb ul li.current a{color:#fff;text-decoration:none;background-color:#fa6137;}
	.lnb ul li:hover{border: 1px solid #f95224;background-color:#fff;}
	.lnb ul li:hover a{color:#fa6137;text-decoration:underline;}
	

	/*breadcrumb */
	div.breadcrumb{position:fixed;top:106px;width:100%;line-height:18px;padding:15px 0;font-size:13px;z-index:9}
	.breadcrumb .blank{top:49px;height:35px}
	.breadcrumb:before{content:"";display:block;clear:both;position:absolute;top:-37px;height:36px;width:100%;background:#fff}
	#content{min-height:680px;}
	#content .content{margin-top:310px;}
	
	footer .innerWrap .copyright{float:left;margin-top:10px;margin-left:97px}
	.en footer .innerWrap .jsInfo,
	.en footer .innerWrap .jsInfo h3,
	.en footer .innerWrap .jsInfo .jsInfo,
	.en footer .innerWrap .copyright{float:none;margin-left:0;}
}



/*------------------------------- desktop 1024 ----------------------------------------------------------------------------------------------*/
@media all and (min-width:1024px) and (max-width:1169px) {
	.innerWrap{position:relative;padding:0 15px;overflow:hidden;width:994px;}
	
	header{position:fixed;top:0;width:100%;background-color:#fff;z-index:10}/* height:106px; */
	header .innerWrap{overflow:visible}
	header h1{position:relative;top:-5px}
	
	.gnbWrap > nav > ul > li > a{padding:12px 20px;}
	.gnbWrap > nav > ul > li > a:hover,
	.gnbWrap > nav > ul > li.current > a{color:#fff;border-radius:30px;background-color:#fa6137}
	.gnbWrap > nav > ul > li > .inner{position:absolute;top:39px;left:50%;z-index:10;width:180px;padding-top:10px;margin-left:-90px;letter-spacing:-1px;background:#fff url("../../images/layout/blet.png") no-repeat center 3px;}
	.gnbWrap > nav > ul > li > .inner > ul{border:1px solid #e2e1e1;border-radius:5px;-moz-box-shadow: 2px 3px 5px #ebebeb;-webkit-box-shadow: 2px 3px 5px #ebebeb;box-shadow: 2px 3px 5px #ebebeb;}
	
	
	/* lnb */
	.lnb{position:fixed;top:192px;width:185px;border:1px solid #d5d5d5;}
	.lnb h3{padding:35px 20px;}
	.lnb ul li a{display:block;line-height:20px;padding:15px 10px;border-top:1px solid #d5d5d5;}
	.lnb ul li.current a{color:#fff;background-color:#fa6137}
	.lnb ul li.current a:hover{color:#fff;text-decoration:none}
	.lnb ul li a:hover{color:#fa6137;text-decoration:underline}
	
	/* #content */
	#content{padding:50px 0;min-height:710px;}	
	#content .content{float:right;width:780px;margin-top:175px;}

	/*breadcrumb */
	div.breadcrumb{position:fixed;top:106px;width:100%;z-index:9;padding:15px 0}
	.breadcrumb .blank{top:45px;height:35px;}
	.breadcrumb:before{content:"";display:block;clear:both;position:absolute;top:-37px;height:36px;width:100%;background:#fff}
	footer .innerWrap .copyright{position:relative;top:7px}
}



/* ----------------------------desktop 1170 -------------------------------------------------------------------------------------------------*/
@media all and (min-width:1170px) {
	.innerWrap{position:relative;overflow:hidden;width:1170px;padding:0}
	
	header{position:fixed;top:0;width:100%;height:106px;background-color:#fff;z-index:10}
	header .innerWrap{overflow:visible}
	
	.utill .lang{right:0;}
	.gnbWrap > nav > ul > li > ul{padding:15px;}
	.gnbWrap > nav > ul > li > a{padding:12px 20px;}
	.gnbWrap > nav > ul > li > .inner{position:absolute;top:39px;left:50%;z-index:10;width:180px;padding-top:10px;margin-left:-90px;letter-spacing:-1px;background:#fff url("../../images/layout/blet.png") no-repeat center 3px;}
	.gnbWrap > nav > ul > li > a:hover,
	.gnbWrap > nav > ul > li.current > a{color:#fff;border-radius:30px;background-color:#fa6137}
	.gnbWrap > nav > ul > li > .inner > ul{border:1px solid #e2e1e1;border-radius:5px;-moz-box-shadow: 2px 3px 5px #ebebeb;-webkit-box-shadow: 2px 3px 5px #ebebeb;box-shadow: 2px 3px 5px #ebebeb;}
	.gnbWrap > nav > ul > li > .inner > ul > li > a{}
	
	/* lnb */
	.lnb{position:fixed;top:212px;width:200px;border:1px solid #d5d5d5}
	.lnb h3{padding:35px 20px;}
	.lnb ul li a{display:block;line-height:20px;padding:15px 20px;border-top:1px solid #d5d5d5;}
	.lnb ul li.current a{color:#fff;background-color:#fa6137}
	.lnb ul li.current a:hover{color:#fff;text-decoration:none}
	.lnb ul li a:hover{color:#fa6137;text-decoration:underline}
	
	/* #content */
	#content{position:relative;padding:50px 0;min-height:710px;}	
	#content .content{float:right;width:910px;margin-top:52px;}
	/* #content .content{position:absolute;top:240px;right:0;width:910px;height:700px;overflow-y:scroll} */

	/*breadcrumb */
	.breadcrumb{position:fixed;top:106px;width:100%;z-index:9}
	.breadcrumb:before{content:"";display:block;clear:both;position:absolute;top:-37px;height:36px;width:100%;background:#fff}
	.breadcrumb .blank{top:55px;}
	
	footer .innerWrap .copyright{position:relative;top:7px}
	

}
