@charset "utf-8";
/* header */
#logo {
	position:absolute;
	right:0; top:8px;
	display:block;
	width:170px;
}
.h_search_btn {
	float:left;
	position:relative;
	width:60px; height:60px;
	text-indent:-9999999px;
}
.h_search_btn span {
	display:block;
	width:100%; height:100%;
	position:absolute;
	left:0; top:0;
	background:url("../image/common/search.png") no-repeat 0 0;
}
	.h_search_btn.t1 span { background-position:0 0;}
	.desktop .h_search_btn.t1:hover span { background-position:0 -60px;}
	.h_search_btn.t1:hover.on span, 
	.h_search_btn.t1.on span {background-position:0 -180px;}
	.h_search_btn.t2 span { background-position:0 -120px;}
/* gnb btn */
.h_gnb_btn {
	width:60px; height:60px;
	position:absolute;
	text-indent:-9999999px;
	display:none;
	right:30px; top:10px;
	margin-right:-20px;
}
.h_gnb_btn span {
	display:block;
	position:absolute;
	width:18px; height:2px;
	background:#fff;
	left:50%; margin-left:-9px;
	top:50%; margin-top:-1px;
	transition:0.2s ease;
	-webkit-transition:0.2s ease;
	-moz-transition:0.2s ease;
}
.h_gnb_btn span::before,
.h_gnb_btn span::after {
	display:block;
	position:absolute;
	content:'';
	width:18px; height:2px;
	left:50%;
	margin-left:-9px;
	background:#fff;
	transition:0.2s ease;
	-webkit-transition:0.2s ease;
	-moz-transition:0.2s ease;
}
.h_gnb_btn span::before {
	top:50%;
	margin-top:-7px;
}
.h_gnb_btn span::after {
	bottom:50%;
	margin-bottom:-7px;
}
.h_opened .h_gnb_btn span {
	background:transparent;	
}
.h_opened .h_gnb_btn span::before,
.h_opened .h_gnb_btn span::after {
	margin-left:-9px;
	width:20px;
}
.h_opened .h_gnb_btn span::before {
	margin-top:-1px;
	transform:rotate(45deg);
	-webkit-transform:rotate(45deg);
	-moz-transform:rotate(45deg);
	-o-transform:rotate(45deg);
}
.h_opened .h_gnb_btn span::after {
	margin-bottom:-1px;
	transform:rotate(-45deg);
	-webkit-transform:rotate(-45deg);
	-moz-transform:rotate(-45deg);
	-o-transform:rotate(-45deg);
}
/* gnb */
#gnb_wrap {
	height:60px;
	margin-left:60px;
	margin-right:310px;
	position:relative;
	z-index:9999;
}
.gnb {
	overflow:hidden;
	float:left;
	margin-left:5px;
	height:60px; line-height:58px;
}
.gnb > li {
	float:left;
	padding:0 5px;
}
.gnb > li > a {
	display:block;
	color:#fff;
	font-size:18px;
	font-weight:600;
	padding:0 20px;
	border-top:2px solid transparent;

	transition:color 0.3s;
	-webkit-transition:color 0.3s;
	-moz-transition:color 0.3s;
	-o-transition:color 0.3s;
}
.gnb > .on > a {
	color:#2a2a2a;
	background:#f6f6f6;
	border-top-color:#b4d012;
}
.desktop .gnb > li > a:hover,
.desktop .gnb > li > a:focus {
	color:#b4d012;
}
.gnb2 {
	float:right;
}
.gnb2 > li {
	float:left;
	height:60px;
	line-height:60px;
	padding-left:15px;
	margin-left:15px;
	position:relative;
}
.gnb2 > li + li {
	background:url("../image/common/f_line.gif") no-repeat left center;
}
.gnb2 > li > a {
	display:block;
	color:#fff;
	font-size:14px;
	padding-right:25px;

	transition:color 0.3s;
	-webkit-transition:color 0.3s;
	-moz-transition:color 0.3s;
	-o-transition:color 0.3s;
	background:url("../image/common/arr_down.png") no-repeat right center;
}
.desktop .gnb2 > li > a:hover,
.desktop .gnb2 > li > a:focus,
.gnb2 > .on > a,
.gnb2 > .active > a {
	color:#b4d012;
}
.gnb2 > .on > a,
.gnb2 > .active > a {
	font-weight:600;
}
.gsnb_wrap {
	position:absolute;
	width:235px;
	left:0; top:100%;
	overflow:hidden;
	height:0;
}
.gsnb a {
	display:block;
	padding:0 20px;
	height:40px; line-height:40px;
	background:#000;
	color:#fff;
	border-top:1px solid #2d2d2d;
	transition:0.1s ease;
	-webkit-transition:0.1s ease;
	-moz-transition:0.1s ease;
	-o-transition:0.1s ease;
}
.desktop .gsnb a:hover,
.desktop .gsnb a:focus,
.gsnb .on a {
	color:#b4d012;
}
.gsnb .on a {
	font-weight:600;
}
/* search */
#top_search {
	position:relative;
	height:60px;
	background:#fff;
	border-bottom:1px solid #ddd;
	display:none;
}
#top_search .pdbox {
	padding-right:40px;
	position:relative;
}
#top_search .h_search_btn {
	position:absolute;
	right:-20px; top:0;
}
#top_search .h_search_btn:focus {
	outline:dotted;
}
#top_search input[type="text"] {
	appearance:none;
	-webkit-appearance:none;
	-moz-appearance:none;
	width:100%; height:60px;
	padding:0;
	border:0;
	outline:0;
	border-radius:0;
	text-align:center;
}
/* footer */
.f_content {
	overflow:hidden;
	padding:35px 0 50px;
}
.f_link {
	overflow:hidden;
	margin-top:10px;
}
	.f_link.m-ver { display: none; }
.f_quick,
.f_q {
	display:inline-block;
	overflow:hidden;
}
.f_quick li,
.f_q li {
	float:left;
	margin-right:5px;
}
.f_q li a {
	display: block;
}
	/*.f_q li.img01 a  { background: url('/image/common/f01.png') no-repeat; height: 24px; width: 79px; }
	.f_q li.img02 a  { background: url('/image/common/f02.png') no-repeat; height: 25px; width: 81px;  }
	 .f_q li.img03 a  { background: url('/image/common/f03.png') no-repeat; height: 13px; width: 34px; }
	.f_q li.img04 a  { background: url('/image/common/f04.png') no-repeat; height: 16px; width: 34px;} */
	.f_q li.img01 a img { height: 28px; }
	.f_q li.img02 a img { height: 28px; }
	.f_q li.img03 a img { height: 28px; }
	.f_q li.img04 a img { height: 30px; }

.f_quick a {
	display:block;
	color:#fff;
	background:#494949;
	border-radius:3px;
	font-size:12px;
	letter-spacing:-0.03em;
	width:80px; height:24px;
	line-height:24px;
	text-align:center;
}
.f_sns {
	float:right;
	overflow:hidden;
	margin-left:10px;
}
.f_sns li {
	float:left;
	padding:2px 0;
	width:20px;
	margin-left:20px;
}
.fnb {
	overflow:hidden;
	float:left;
	font-size:14px;
}
.fnb > li {
	float:left;
	margin-right:55px;
}
.fnb > li > a {
	color:#fff;
	font-weight:600;
}
.fnb ul {
	margin-top:10px;
}
.fnb ul a {
	color:#9a9a9a;
}
#footer a:hover,
#footer a:focus {
	text-decoration:underline;
}
.ft-left {
	float: left;
}
.f_info {
	clear:right;
	font-size:12px;
	line-height:1.8em;
	color:#9a9a9a;
}
.f_info .bar {
	color:#626262;
	margin:0 1px;
}
.f_info b,
.f_info .inline {
	display: inline-block;
	vertical-align: top;
}

.f_terms_box {
	background:#fff;
	display:none;
}
.f_terms_ct {
	overflow:hidden;
	padding:30px 0; 
}
.f_terms_ct .tit {
	float:left;
	width:80px;
	color:#2a2a2a;
	font-weight:600;
}
.f_terms_ct .desc {
	margin-left:80px;
	font-size:0.928em;
	line-height:1.78em;
	text-align:justify;
}
.f_btm {
	border-top:1px solid #323232;
	line-height:30px;
	font-size:0.857em;
}
.f_terms {
	float:right;
	overflow:hidden;
}
.f_terms li {
	float:left;
	padding-left:12px;
}
.f_terms li + li {
	background:url("../image/common/f_line.gif") no-repeat left center;
}
.f_terms li:first-child {
	background:none;
}
.f_terms a {
	display:block;
	color:#fff;
	font-weight:600;
}
.f_terms a.tg {
	color:#9a9a9a;
	font-weight:400;
	padding-right:25px;
	text-decoration:none;
	background:url("../image/common/f_arr.png") no-repeat right 0;
}
.f_terms a.tg.on {
	text-decoration:underline;
	background-position:right -30px;
}
.cpright {
	color:#6a6a6a;
}

/* 공통 */
.show-default {display:block;}
.hide-default {display:none;}

/* skip */
#top_skip {
	display:block;
	background:#fff;
	position:fixed;
	left:0; top:0;
	z-index:99999999;
}
#top_skip a {
	position:relative;
	display:block;
	width:120px;
	line-height:35px;
	text-align:center;
	background:#333;
	color:#fff;
	font-size:12px;
	height:0;
	overflow:hidden;
}
#top_skip a:focus {
	height:35px;
	border:2px solid #005983;
}



/* 타블렛 가로 */
@media all and (max-width:1199px) {
		.h_search_btn {margin-left:-20px;}
	/* gnb */
		#gnb_wrap {margin-right:220px; margin-left:40px;}
		.gsnb_wrap {width:180px;}
	/* Footer */
		.fnb {font-size:13px;}
		.fnb > li {margin-right:35px;}
		.f_terms li {margin-right:5px;}
		.f_terms li:last-child {margin-right:12px;}
		.f_terms a.tg {padding-right:20px; background-size:13px auto; background-position:right -30px;}
		.f_terms a.tg.on {background-position:right -60px;}
}


/* 타블렛 세로 */
@media all and (max-width:1023px) {
	/* header */
		.h_search_btn {position:absolute; float:none; left:30px; top:10px;}
		.h_search_btn span {width:30px; height:30px; left:50%; margin-left:-15px; top:50%; margin-top:-15px; background-size:30px auto;}
			.h_search_btn.t1 span { background-position:0 -120px;}
			.desktop .h_search_btn.t1:hover span { background-position:0 -150px;}
			.h_search_btn.t1:hover.on span, 
			.h_search_btn.t1.on span {background-position:0 -210px;}
			.h_search_btn.t2 span { background-position:0 -180px;}
		.h_gnb_btn {display:block;}
		#logo {right:auto; left:50%; margin-left:-85px; top:18px;}
	/* gnb */
		#gnb_wrap {display:none; position:relative; top:80px; height:auto; margin:0 -30px; z-index:999999; overflow-scrolling:touch; -webkit-overflow-scrolling:touch; -moz-overflow-scrolling:touch;}
		.gnb {float:none; margin-left:0; height:auto; background:#0c0c0c; text-align:center; border-top:1px solid #2a2a2a; line-height:0;}
		.gnb > li {float:none; display:inline-block; vertical-align:middle; padding:0;}
		.gnb > .on > a {background:#fff; border-top:0; color:#000;}
		.gnb > li > a {display:block; padding:0 25px; line-height:70px; font-weight:600; color:#fff; font-size:1.25em; border-top:0;}
		
		.gnb2 {height:70px; position:relative; background:#0c0c0c; float:none; border-top:1px solid #2a2a2a;}
		.gnb2 > li {width:33.33%; margin:0; padding:0; position:static; height:auto;}
		.gnb2 > li + li {background:none;}
		.gnb2 > li > a {padding-right:70px; line-height:70px; padding-left:30px; color:#fff; font-size:1.14em; position:relative; background:none;}
		.gnb2 > .on > a {color:#b4d012; font-weight:600; background-color:#000;}
		.gnb2 > li > a::after {content:''; position:absolute; right:-1px; top:0; width:70px; height:70px; background:url("../image/common/arr_down_2x.png") no-repeat 0 0; background-size:100% auto; border-left:1px solid #2a2a2a; border-right:1px solid #2a2a2a; z-index:1;}
		.gnb2 > .active > a::after {background-position:0 -70px;}
		.gsnb_wrap {display:none; position:absolute; width:100%; top:auto; height:auto; left:0;}
		.gsnb a {padding:0 30px; background:#e6e6e6; height:auto; line-height:60px; color:#fff; font-size:1.14em; border-top:0; border-top:1px solid #2a2a2a; background:#0c0c0c;}
		/* .gnb {float:none; margin-left:0; height:auto; background:#fff; line-height:1.76em;}
		.gnb > li {float:none; padding:0;}
		.gnb > .on > a {background:transparent; border-top:0; }
		.gnb > li > a, 
		.gnb2 > li > a {display:block; font-size:1.25em; color:#2a2a2a; padding:0 30px; border-bottom:1px solid #afafaf; line-height:70px; font-weight:600; position:relative; background:none; margin-top:-1px;}
		.gnb2 {float:none; background:#fff;}
		.gnb2 > li {float:none; line-height:1.76em; padding:0; margin:0; height:auto;}
		.gnb2 > li + li {background:none;}
		.gnb2 > li > a::after {content:''; position:absolute; right:30px; top:50%; margin-top:-8px; width:16px; height:16px; background:url("../image/common/gnb_bl.png") no-repeat 0 0; background-size:100% auto;}
		.gnb2 > li.on > a {background-color:#595959; border-color:#595959; color:#fff;}
		.gnb2 > li.on > a::after {background-position:0 -17px;}
		.gsnb_wrap {display:none; position:relative; width:auto; top:auto; height:auto; }
		.gsnb a {padding:0 50px; background:#e6e6e6; height:auto; line-height:60px; color:#2a2a2a; font-size:1.25em; border-top:0; border-bottom:1px solid #afafaf;} */
	/* search */
		#top_search {top:80px;}
		#top_search .h_search_btn {left:auto; right:0; margin-right:-20px;}
	/* footer */
		.f_content {padding:20px 0 30px;}
		.f_link {float:none; margin-bottom:20px;}
		.f_link.pc-ver { display: none; }
		.f_link.m-ver { display: block; }
		.f_terms_ct {padding:20px 0;}
		.fnb {float:none; margin-bottom:20px;}
		.fnb > li {width:16.66%; margin-right:0;}
		.f_into {font-size:.8em;}
		.f_btm {padding:5px 0;}

		


}

/* 타블렛 가로 미만 ~ 모바일 */
@media all and (max-width:767px) {
	/* header */
		.h_search_btn {width:50px; height:50px; top:0;}
		.h_gnb_btn {width:50px; height:50px; top:0; margin-right:-16px;}
		#logo {width:136px; top:7px; margin-left:-68px;}
	/* gnb */
		#gnb_wrap {top:50px;}
		.gnb > li > a {line-height:40px; font-size:1.14em;}
		.gnb2 {height:40px;}
		.gnb2 > li > a {line-height:40px; font-size:1em; padding-right:40px;}
		.gnb2 > li > a::after {width:40px; height:40px;}
		.gnb2 > li.active > a::after {background-position:0 -40px;}
		.gsnb a {line-height:35px; font-size:1em;}
	/* search */
		#top_search {top:50px; height:50px;}
		#top_search .pdbox {padding:0 40px;}
		#top_search input[type="text"] {height:50px;}
		#top_search input[type="text"]:focus {outline:0;}

		
		/*.f_q li.img01 a  { background: url('/image/common/fo05.png') no-repeat; height: 33px; width: 99px; }
		.f_q li.img02 a  { background: url('/image/common/fo06.png') no-repeat; height: 33px; width: 98px;  }
		.f_q li.img03 a  { background: url('/image/common/fo07_n.png') no-repeat; height: 23px; width: 52px; }
		.f_q li.img04 a  { background: url('/image/common/fo08_n.png') no-repeat; height: 23px; width: 50px;} */
		.f_q li.img03 a img { height: 35px; }
		.f_q li.img04 a img { height: 35px; }

}

/* 모바일 상세 */
@media all and (max-width:640px) {
	/* footer */
		.f_btm {padding:10px 0 12px;}
		.f_terms {float:none; text-align:center; font-size:0;}
		.f_terms li {display:inline-block; float:none; font-size:12px; vertical-align:middle;}
		.cpright {text-align:center; font-size:11px;}
}

/* 모바일 가로 */
@media all and (max-width:568px) {
	/* header */
		.h_search_btn {left:20px;}
		.h_gnb_btn {right:20px;}
	/* gnb */
		#gnb_wrap {margin:0 -20px;}
		.gnb > li > a {padding:0 20px;}
		.gnb2 > li > a {padding-left:0; text-align:center;}
		.gsnb a {padding:0 20px;}
	/* footer */
		.f_content {padding:20px 0;}
		.f_link {margin-bottom:15px;}
		.f_sns {margin-left:0;}
		.f_sns li {margin-left:15px;}
		.fnb {margin-bottom:15px; font-size: 12px; line-height:1.76em;}
		.fnb > li {width:33.33%;}
		.fnb > li:nth-child(3) ~ li {margin-top:20px;}
		.fnb ul {margin-top:3px;}
		.f_info { font-size: 11px; }
		.f_terms_ct .tit {float:none; width:auto; margin-bottom:5px;}
		.f_terms_ct .desc {margin-left:0; font-size:12px; letter-spacing:-0.03em; word-break:break-all;}
}

@media all and (max-width:425px) {
	/* header */
		.h_search_btn {left:18px;}
		.h_gnb_btn {right:18px;}
	/* gnb */
		#gnb_wrap {margin:0 -15px;}
		.gnb > li > a {padding:0 15px;}
		.gsnb a {padding:0 15px;}
	/* search */
		#top_search .h_search_btn {margin-right:-13px;}

}

@media all and (max-width:375px) {
	.f_q li.img01 a img { height: 25px; }
	.f_q li.img02 a img { height: 25px; }
	.f_q li.img03 a img { height: 28px; }
	.f_q li.img04 a img { height: 30px; }
	.f_q li { margin-right: 3px; }

}

@media all and (max-width:320px) {
	/* gnb */
		.gnb > li > a {line-height:40px; font-size:1.14em;}
		.gnb2 > li > a {line-height:35px; font-size:1em; padding-right:35px;}
		.gnb2 > li > a::after {width:35px; height:35px;}
		.gnb2 > li.active > a::after {background-position:0 -35px;}

}







/* 공통 */

/* PC이하 ~ 타블렛 가로 */
@media all and (max-width:1199px) {
	.show-1024 {display:block;}
	.hide-1024 {display:none;}
}
/* 타블렛 가로 이하 */
@media all and (max-width:1023px) {
	.show-768 {display:block;}
	.hide-768 {display:none;}
}
/* 타블렛 이하 ~ 모바일 */
@media all and (max-width:767px) {
	.show-640 {display:block;}
	.hide-640 {display:none;}
}
/* 모바일 가로 미만 */
@media all and (max-width:568px) {
	.show-568 {display:block;}
	.hide-568 {display:none;}
}
/* 모바일 최소 */
@media all and (max-width:425px) {
	.show-425 {display:block;}
	.hide-425 {display:none;}
}

@media all and (max-width:375px) {
	.show-375 {display:block;}
	.hide-375 {display:none;}
}

@media all and (max-width:374px) {
	.show-320 {display:block;}
	.hide-320 {display:none;}
}
