@charset "utf-8";

/* 공통 */
/* table { table-layout: fixed; }*/

/* PC이하 ~ 타블렛 가로 */
@media all and (max-width:1099px) {
	.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:320px) {
	.show-320 {display:block;}
	.hide-320 {display:none;}
}






/* 타블렛 가로 */
@media all and (max-width:1099px) {
	/* gnb 전환 */
	#header {height:52px; border-bottom:2px solid #d36c7f}
	.h_box {height:50px;}
	.topMenu{display:none;}
	#logo {width:76px;float:none;margin:0 auto;/* top: 10px; */left:20px;}
	#logo a {height:35px;background-size:150px;}
	.btn_gnb {display:block; background:#fff; right:20px;}
	.top_sns {display:none;}
	/* .top_search {display:none;} */
	/* gsub */
	.gsub_wrap {position:relative; padding-top:0; width:auto; height:auto; top:auto; left:auto; margin:0; display:none;}
	.gsub_wrap::before {display:none;}
	/* gnb layout for mobile */
	html.no-scroll {position:fixed; left:0; top:0; right:0; bottom:0; overflow:hidden;}
	.gnb_blind {
		position:fixed; 
		left:0; top:0; right:0; bottom:0; 
		background:rgba(0,0,0,0.6); 
		z-index:99999;
		-webkit-user-select: none;
		-moz-user-select: none;
		-khtml-user-select: none;
		-ms-user-select: none;
	}
	.mb_gnb_frame {
		position:fixed; 
		right:0; 
		top:52px; 
		bottom:0; 
		background:#fff; 
		width:220px;
		z-index:9999999;

		transform:translate(220px, 0);
		-webkit-transform:translate(220px, 0);
		-moz-transform:translate(220px, 0);
		-o-transform:translate(220px, 0);
		transition:transform 0.3s ease;
		-webkit-transition:-webkit-transform 0.3s ease;
		-moz-transition:-moz-transform 0.3s ease;
		-o-transition:-o-transform 0.3s ease;
	}
	.mb_gnb_frame.opened  {
		transform:translate(0, 0);
		-webkit-transform:translate(0, 0);
		-moz-transform:translate(0, 0);
		-o-transform:translate(0, 0);
	}
	.tnb_wrap {bottom:0; left:0; top:auto; right:0; height:30px; border-top:1px solid #93b658; padding:10px 15px; background:#fbfbfb; } /* display:none;은 통합회원 오픈전까지 임시적용 */
	.tnb {float:none;}
	.tnb .hide_m {display:none;}
	.tnb li {height:28px; border:1px solid #ddd; background:none;text-align:center; padding:0; width:88px; line-height:28px; font-size:0.92em;}
	.tnb a {display:block; background:#fff;}
	.gnb_scroll {position:absolute; left:0; top:0; right:0; bottom:50px; border-top:2px solid #dc677a; overflow:auto; -webkit-overflow-scrolling:touch; -moz-overflow-scrolling:touch;}
	.gnb_wrap {position:relative; top:auto; right:auto;}
	.gnb > li {float:none; height:auto; margin:0; padding:0;}
	.gnb > li > a {
		height:50px; line-height:50px; 
		font-size:1em; 
		padding:0 20px; 
		border-bottom:1px solid #ddd;
		
	}
	.gnb > .active > a {
		background-position:197px -42px;
	}
	.gsub {
		background:#93b658;
		width:auto;
		position:relative;
		padding:10px 0;
		border:0;
		margin:0;
		text-align:left;
	}
	.gsub li {
		font-size:1em;
		line-height:inherit;
		margin:0;
	}
	.gsub a {
		display:block;
		font-size:0.98em;
		color:#fff;
		font-weight:600;
		line-height:30px;
		padding:0 20px;
		letter-spacing:-0.03em;
		
	}

	
}


/* 타블렛 세로 */
@media all and (max-width:1023px) {
	/* footer 전환1 */
	.f_right {position:relative; top:auto; height:34px; line-height:34px; margin-top:35px;}
	.f_sns {display:block;}
	.f_sns img {vertical-align:middle;}
	.f_download {float:left;}
	.f_site_box {float:right; margin-top:0; width:213px;}

}


/* 타블렛 가로 미만 ~ 모바일 */
@media all and (max-width:767px) {
	/* header */
	.gnb > li > a  {font-size:1em;}
	.gsub a {font-size:0.958em; line-height:35px;}

	/* footer 전환2 */
	.f_top {padding-top:0;}
	.bnb {margin:0 -5.17% 15px;}
	.bnb li {width:20%; background:none; padding:0; font-size:0.86em; letter-spacing:-0.05em; border-bottom:1px solid #ddd;}
	.bnb a {display:block; border-left:1px solid #ddd; height:28px; line-height:28px; text-align:center; color:#787878;}
	.bnb li:first-child a {border-left:0;}
	.f_logo {width:82px; margin:0 auto 5px;}
	.f_info {text-align:center; font-size:0.86em;}
	.f_info .bar {display:block; font-size:0; line-height:0;}
	.f_download {display:none;}
	.f_site_box {display:none;}
	.f_right {margin-top:15px;}
	.f_sns {float:none; text-align:center; margin:0;}
	.f_sns li {float:none; display:inline-block; margin:0 5px;}
}



/* 모바일 가로 */


@media all and (max-width:475px) {
	.bnb {text-align:center; font-size:0; border-bottom:1px solid #ddd;}
	.bnb li {font-size:10px; float:none; display:inline-block; width:auto; border-bottom:0;}
	.bnb li a {padding:0 10px;}

}

@media all and (max-width:375px) {
	.bnb li a {padding:0 5px;}

}