@charset "utf-8";
html,body {width:100%;  overflow-x:hidden}
body {overflow-y:visible;overflow-x:auto;}
#wrap {/*position:relative;*/overflow:hidden; min-width:320px;}
/* z-index */
#header-wrap {z-index:5009; position:absolute;}
#container-wrap{z-index:2001;  position:relative; font-size:14px;}
#footer-wrap{z-index:2006;  position:relative;}
.container{position:relative;z-index:3001; max-width:1200px; margin:0 auto; padding:10px}

/* 링크 점선 없애기 */
a, input { outline:none; selector-dummy : expression(this.hideFocus=true);}

/*서브 비쥬얼*/

/*
#sub-visual01{position:relative; background-image:url(../img/sub/sub01_company.png); background-size:auto 239px; min-height:220px;}
#sub-visual02{position:relative; background-image:url(../img/sub/sub02_products.png); background-size:auto 239px; min-height:220px;}
#sub-visual03{position:relative; background-image:url(../img/sub/sub03_qna.png); background-size:auto 239px; min-height:220px;}
#sub-visual04{position:relative; background-image:url(../img/sub/sub04_customer.png); background-size:auto 239px; min-height:220px;}
#sub-visual05{position:relative; background-image:url(../img/sub/sub05_performance.png); background-size:auto 239px; min-height:220px;}
*/
#sub-visual01{position:relative; background-image:url(../img/sub/sub_visual01.png); background-size:cover; min-height:140px; margin-top:50px;background-position-x: center;}
#sub-visual02{position:relative; background-image:url(../img/sub/sub_visual02.png); background-size:cover; min-height:140px; margin-top:50px;background-position-x: center;}
#sub-visual03{position:relative; background-image:url(../img/sub/sub_visual03.png); background-size:cover; min-height:140px; margin-top:50px;background-position-x: center;}
#sub-visual04{position:relative; background-image:url(../img/sub/sub_visual04.png); background-size:cover; min-height:140px; margin-top:50px;background-position-x: center;}
#sub-visual05{position:relative; background-image:url(../img/sub/sub_visual05.png); background-size:cover; min-height:140px; margin-top:50px;background-position-x: center;}

.subBG01 {background-image:url(../images/common/subBG01.jpg);}

.pageheader {position:absolute; width:100%; left: 50%; top:50%;  transform: translate(-50%, -50%);-moz-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);-o-transform: translate(-50%, -40%);-webkit-transform: translate(-50%, -50%); z-index: 1; text-align:center; margin-top:30px}
.pageheader h3{font-family: 'AritaDotum';font-size:1.725em; font-weight:900; color:#323232}
.pageheader p{font-family: 'Montserrat', sans-serif; font-weight:800; font-size:1.25em; font-weight:300; text-align:center; color:#fff;}




/*페이지정보*/

.pagelocation:after { display: block;content: '';clear: both;}
.pagelocation>ul>li {display: inline-block;font-size: 13px; text-transform: uppercase; color:#fff; line-height:30px}
.pagelocation>ul>li:first-child:before {display:inline-block; vertical-align:middle;font-family: LineAwesome; font-size:16px; content: "\f237"; padding: 0 5px 0 0;}
.pagelocation>ul > li + li:before {color: inherit; opacity: 0.5;font-family: LineAwesome; font-size:16px; content: "\f112";/*padding: 0 5px 0 4px;*/ vertical-align:middle}
.pagelocation>ul li a{color:#c8c8c8}

.pageoption{position:relative; float:right; /*float:right;display:flex; flex-direction:row; justify-content: right; text-align:right*/}
.pageoption >a {display:inline-block; width:35px; height:42px; text-align:center; line-height:42px;}
.btn-sns{display:none; color:#0167c3; position:absolute; right:50px; top:50px; width:30px; height:30px; line-height:30px; vertical-align:middle; border-radius:100%; border:1px solid #aea9c3; text-align:center}
.btn-print{color:#666}
.btn-sns:before {font-family: LineAwesome; font-size:20px;  text-indent:0; line-height:24px;}
.btn-sns:before {content:"\f2f2";color:#aea9c3; right:100px}
.btn-print:before {content:"\f2c7"; color:#333}

/*SNS공유*/
.snsShareBox{max-width:100px; position:absolute; z-index:90; top:85px; right:50px; height:0px; overflow:hidden}
.snsShareBox.active { min-height:120px}
ul.snsShare {border:0px solid #ebebeb;}
ul.snsShare.active{display:block;}
ul.snsShare li { margin-top:6px}
ul.snsShare li a {display:block; width:30px; height:30px; border-radius:100%;  background:#fff; line-height:30px; color:#666; text-align:center; font-size:12px}
ul.snsShare li a span {display:none}
ul.snsShare li a:before {display:inline-block; vertical-align:middle; font-family: LineAwesome; font-size:16px; line-height:30px; content: "\f1d7";}
ul.snsShare li:first-child a:before {content: "\f1d7";}
ul.snsShare li:nth-child(2) a:before {content: "\f35a";}
ul.snsShare li:nth-child(3) a:before {content: "\f268";}
ul.snsShare li a:hover {color:#FFF; transition: all 0.2s;}
ul.snsShare li:first-child a:hover {background:#315199; }
ul.snsShare li:nth-child(2) a:hover {background:#0099ff; }
ul.snsShare li:nth-child(3) a:hover {background:#333; }

@media only screen and (min-width:768px){
	.pageoption {margin-top:-44px;}
}

@media only screen and (min-width:1000px){
		/* 서브 네비게이션 */
		/*
		#sub-visual01{min-height:430px; background-size:auto 478px; background-repeat:no-repeat; border-bottom:1px solid #dddddd;}
		#sub-visual02{min-height:430px; background-size:auto 478px; background-repeat:no-repeat; border-bottom:1px solid #dddddd;}
		#sub-visual03{min-height:430px; background-size:auto 478px; background-repeat:no-repeat; border-bottom:1px solid #dddddd;}
		#sub-visual04{min-height:430px; background-size:auto 478px; background-repeat:no-repeat; border-bottom:1px solid #dddddd;}
		#sub-visual05{min-height:430px; background-size:auto 478px; background-repeat:no-repeat; border-bottom:1px solid #dddddd;}
		*/
		#sub-visual01{min-height:430px; background-size:cover; background-repeat:no-repeat; border-bottom:1px solid #dddddd;}
		#sub-visual02{min-height:430px; background-size:cover; background-repeat:no-repeat; border-bottom:1px solid #dddddd;}
		#sub-visual03{min-height:430px; background-size:cover; background-repeat:no-repeat; border-bottom:1px solid #dddddd;}
		#sub-visual04{min-height:430px; background-size:cover; background-repeat:no-repeat; border-bottom:1px solid #dddddd;}
		#sub-visual05{min-height:430px; background-size:cover; background-repeat:no-repeat; border-bottom:1px solid #dddddd;}
		.pageheader { margin-top:0px;}
		.pageheader h3 {font-size:2.750em; line-height:normal}
		.pagelocation {margin-top:20px}
		.pagelocation>ul>li {font-size:16px;}


	}


/* =====================================
   container-wrap
===================================== */
#container-wrap{}
.sub-title {position:relative; padding:20px 0;  text-align:center}
.sub-title h3 {display:inline-block; font-size:1.250em; font-weight:500; color:#5a7044; line-height:42px; letter-spacing:-2px}


@media only screen and (min-width:980px){
	#container-wrap {padding:50px 0; }
	/*#container-wrap .container { min-height:500px}*/
	#container-wrap .container { padding:30px 0; overflow: hidden; }
	.sub-title {padding:60px 0 40px 0;}
	.sub-title h3 { font-size:2.125em;}
}

/* =====================================
   footer-wrap
===================================== */
/*footer*/
#footerWrap{width:100%; background:#333; padding:15px 0; font-size:14px;}
#footerWrap > div {position:relative; padding:10px;}
.footmenu {text-align:center; margin:0 -0.5% 20px -0.5%; overflow:hidden }
.footmenu li{display:inline-block; width:49%; margin:0 0 0 0}
.footmenu li a{display:block; font-size:0.938em; color:#bbb; font-weight:300; padding: .5em 0; white-space:nowrap; border:1px solid #666; }
.footmenu li:first-child a {color:#99cc33;}


/*.footer_info {border-bottom:1px solid #555555}*/
.bottom_info {width:100%;}
.bottom_info li {display:inline-block}



address {color:#bbb; margin-top:15px}
address > p {margin:0.3em 0; /*text-align:center*/}
address > p.tel a,address > p.tel span{color:#fff; font-weight:400}
address > span {color:#ccc; font-weight:300}
address > p.copyright {font-size:12px;margin-top:10px;}
address > p.copyright > span {color:#cdcdcd; font-weight:300}

#pageup {position: fixed; z-index:999 !important; right: 20px; bottom: 20px; background:#333; width: 50px; height: 50px; display: none; cursor: pointer; z-index:4000;}
#pageup:after {display:block; content:""; font-family: LineAwesome; font-size:24px; content: "\f113";  color:#f5f5f5; text-align:center; line-height:50px}

/* 서브 타이틀 */
.section-title {
	/*
	margin-bottom: 0.9em;
	*/
	padding-bottom: 0.3em;

	font-size: 2.5em;
	font-weight:600
	text-transform: uppercase;
	text-align: center;
	letter-spacing: -0.5px;
	line-height: 3em;
	color:#444444;
}
.section-subtitle {
	margin-bottom: 0.9em;
	/*padding-bottom: 30px;*/
	padding-top:0.5em;
	font-size: 1em;
	font-weight: 400;
	/* font-weight: bold; */
	text-transform: uppercase;
	text-align: center;
	letter-spacing: -0.5px;
	line-height: 0.9em;
	color:#807f7f;
}

@media all and (max-width:1000px) {
	.section-title {
		font-size:2em;
		line-height: 3em;
	}
	.section-subtitle {
		font-size:12px;
	}
}

@media all and (max-width:768px) {
	.section-title {
		font-size:1.6em;
		line-height: 3em;
	}
	.section-subtitle {
		font-size:12px;
	}
}

/*관련사이트 바로가기*/
#f_sec1 {text-align:center}
.d_select{position:relative; display:inline-block; width:100%; min-width:200px; margin:10px auto; text-align:left;}
.d_select>a:after { content: "\f28e"; opacity: 0.5; font-family: LineAwesome; font-size:16px; vertical-align:middle; position:absolute; right:10px}
.d_select>span, .d_select>a{display:block;cursor:pointer;color:#333; background:#aaa; line-height:40px; padding-left:15px;}
.d_select>span:after { content: "\f28e"; opacity: 0.5;font-family: LineAwesome; font-size:16px; vertical-align:middle; position:absolute; right:15px}
.d_select>div{display:none;position:absolute;left:-1px;bottom:55px;width:100%; padding:8px; background: #333;/*box-shadow: 0 0 5px 0 rgba(0, 0, 0, .15);*/transition: .2s ease-out;}
.d_select>div:after {content:""; display: block;position: absolute;left: 50%; bottom:-10px; width: 0;height: 0;border-left: 10px solid transparent;border-right: 10px solid transparent;border-top: 10px solid #333; transform: translateX(-6px);}
.d_select>div>ul>li>a{display:block;padding: .444em .444em .444em 1em;color:#ccc;font-size:14px;font-weight:400}
.d_select>div>ul>li>a:hover{color:#fff}

.family-list .close{position:absolute; right:0; top:0; width:30px;height:30px; background:#555; color:#fff; font-size:16px; line-height:30px; text-align:center;}
.family-list .close:after {content:""; font-family: LineAwesome; font-size:18px; content: "\f191";  color:#f5f5f5; text-align:center;}
.layer-slider-ovclick{position:fixed;z-index:2600;width:100%;height:100%;left:0;top:0;background:rgba(0,0,0,0.65);cursor:pointer }
#f-baner{ position:relative; height:56px; padding:1px 0 1px 229px; z-index:5;box-sizing:border-box; max-width:1200px; margin:0 auto}
#f-baner:after{background:#fff; border-top:1px solid #ddd; border-bottom:1px solid #ddd; width:2000px; position:absolute; z-index:-1; height:56px; display:block; content:""; top:0; left:50%;margin-left:-1000px;}
#f-baner .fban-ctrl:before{background:#eeefef; border-top:1px solid #ddd; border-bottom:1px solid #ddd; width:2000px;position:absolute; z-index:-1; height:56px; display:block; content:""; top:-1px; right:0;}
#f-baner .fban-ctrl{position:absolute; left:0; top:1px; width:229px; height:56px; z-index:5; font-size:0; border-right:1px solid #ddd;}
#f-baner .fban-ctrl h3{ width:95px; height:56px; line-height:56px; display:inline-block; vertical-align:top; font-size:14px; color:#262d35;border-right:1px solid #ddd; text-align:center;}
#f-baner .fban-ctrl a{display:inline-block; vertical-align:top; width:44px; height:56px;}
#f-baner .fban-ctrl .prev{ background:url(../images/common/banner-prev.png) no-repeat center center;}
#f-baner .fban-ctrl .play{ background:url(../images/common/banner-play.png) no-repeat center center;border-right:1px solid #ddd;border-left:1px solid #ddd;}
#f-baner .fban-ctrl .stop{ background:url(../images/common/banner-stop.png) no-repeat center center;border-right:1px solid #ddd;border-left:1px solid #ddd;}
#f-baner .fban-ctrl .next{ background:url(../images/common/banner-next.png) no-repeat center center;}

.fban-slide{}
.fban-slide li{float:left;}
.fban-slide li a{ line-height:56px; letter-spacing:-0.03em; text-align:center; display:block; letter-spacing:-0.03em; position:relative;}
.fban-slide li a img {display:inline-block;}
.fban-slide li a:after{background:#d4d5d7; width:1px ;height:14px; position:absolute; left:-1px; top:50%;margin-top:-7px; display:block; content:"";}
.fban-slide li a:hover{text-decoration:underline}

#pageup {position: fixed; z-index:9999 !important; right: 20px; bottom: 20px; background:#333; width: 50px; height: 50px; display: none; cursor: pointer; z-index:4000;}
#pageup:after {display:block; content:""; font-family: LineAwesome; font-size:24px; content: "\f113";  color:#f5f5f5; text-align:center; line-height:50px}


	@media only screen and (min-width:780px){

		.footmenu {width:100%; display:inline-block; vertical-align:middle; text-align:left; padding-right:300px; margin:0}
		.footmenu li {background:none; width:auto;}
		.footmenu li a { border:none}
		.footmenu li a:after {content:""; display:inline-block;  width:1px; height:12px; vertical-align:middle; margin: 0 5px 0 12px; background:#666;}

		.footmenu li:last-child a:after {display:none}
		address > p {text-align:left}

		address > p > span {margin:0 5px; display:inline-block}
		address > p > span:first-child {margin:0}
		address>p>span:after {content:""; display:inline-block;  width:1px; height:12px; vertical-align:middle; margin: 0 0 0 10px; background:#444;}
		address > p > span:last-child:after {display:none}
		address>p.tel>a:first-child {margin-right:15px;}
		#f_sec1 {position:absolute; right:10px; top:0}
	}

	@media only screen and (min-width:1200px){
		#footerWrap > div {padding:0}
		.footmenu li a {font-size:1em;}

	}