@charset "utf-8";

#wrap{ position:relative; min-width:1300px; min-height:100%; overflow:hidden; font-family:'NotoR'; font-size:14px;}

/*배경그림자*/
#shadow_device {display:none; position:fixed; top:0; left:0; width:100%; height:100%; z-index:1000; background:#000; opacity:0.7; }
/*터치영역*/
#touchArea {display:none; position:absolute; top:0; left:0; width:100%; height:100%; z-index:880;}
/*모바일메뉴*/
#topmenu{ display:none; overflow-y:auto; overflow-x:hidden; position:absolute; top:0; right:-230px; width:230px; height:100%; background:#404142; z-index:1050; box-shadow:0px 0px 10px #333;}

/*헤더*/
#header{ position:relative; width:100%; height:120px;} /* 201013 background삭제 height값 변경*/
#header .header_wrap {position:relative; width:1300px; margin:0 auto;}
#header .header_wrap h1 { position:absolute; top:35px; left:0} /* 201013 top값 변경 */

/* 상단옵션 */
/* 201013 삭제 */
/* #header .gnb_rt { float:right;} */

/* 사용자메뉴 */
#header .gnb_util { float:left; line-height:40px; font-size:13px; margin-right:15px;}
#header .gnb_util li {display:inline-block;}
#header .gnb_util li a {display:inline-block; padding:0 15px; letter-spacing: -0.5px; color:#333;  background:#ddd;}
#header .gnb_util li a.point{background:#004ca6; color:#fff;}
#header .gnb_util li a:hover{font-family: 'NotoM'; text-decoration: underline;}
 
/* 검색 */
.select_ty label, .search_btn button, .search button, .search .cont_box button, .search_close button{font-size:0; line-height:0; text-indent:-10000px;}
#header .search_btn {display:none; position:absolute; left:2%; top:55px;}
#header .search_btn button {width:50px; height:50px; background:#2b8eda url('../images/common/btn_search.png') no-repeat center; }
#header .search {position:absolute;top:28px;left:50%;width: 680px;height:42px;margin-left:-250px;z-index:200;} /* 201013 top값 변경 */ /* 201127수정 */
#header .search .search_wrap {position:relative;width: 100%;z-index:2;} /* 201013수정 *//* 201127수정 */
#header .search .search_wrap legend{position: absolute; left:0; top:0; width:1px; height:1px; overflow: hidden; text-indent: -99999%;}
#header .search .cont_box {position:relative;width: 490px;margin: 0 auto;display:block;border-radius:50px;color:#5b5a5a;border:3px solid #2b8eda; background:#2b8eda;overflow:hidden;} /* 201013 수정 */ /* 201127수정 */
#header .search .cont_box button {position:absolute; top:0; right:0; width:83px; height:38px; text-indent:inherit;  background:#2b8eda url('../images/common/btn_search.png') no-repeat 10% 50%} /* 201013 width 수정 */
#header .search .cont_box button span {line-height:38px; font-size:15px;  color:#fff; font-family: 'NotoM';}
#header .search input {padding: 0 0 0 110px;width:60%;height:38px;line-height:38px;font-size:14px;color:#444;border:0;border-radius: 0 50px 50px 0;background-color:#fff;}
#header .search_close{display:none; position:absolute; top:-65px; left:2%; z-index:10;}
#header .search_close button {width:50px; height:50px; background:#2b8eda url('../images/common/btn_close_wh.png') no-repeat center}
#header .search .search_wrap .select_ty{ position:absolute; left:10px; top:7px; } /* 201013 top값 수정 */
#header .search .search_wrap .select_ty select{width: 90px;font-size:14px;border:0;}
/* 201013 검색범위선택 추가 */    
#header .search .search_area{margin-top: 15px; text-align:center;}/* 201201 */
#header .search .search_area li{display: inline-block; margin-right: 21px;}
#header .search .search_area li:last-child{margin-right: 0;}
#header .search .search_area input{width: auto; height: auto; padding: 0;}

/* 검색 - 인기검색어 */
#header .keyword{margin:5px 0 0;}
#header .keyword p{float:left; font-family:'NotoB'; color:#000; padding-left:20px; margin:0 10px; font-size:13px; background:url('../images/common/bul_star.png') no-repeat left 4px;}
#header .keyword ul{width:300px; height:20px; overflow:hidden;}
#header .keyword ul li{float:left;}
#header .keyword ul li a{display:block; margin:0 5px; letter-spacing: -0.5px; font-size:12px; color:#444;}

/* 상단이동 */
.btn_top a{position: absolute; width:50px; height:40px; right:0; top:-70px; padding:10px 0; background:#2b8eda; background-size:100% 100%; text-align:center; color:#fff;}
.btn_top a span{display:block; font-size:13px;}


/*===================================== 서브 =========================================*/
/* content */
#sub_container_wrap {position:relative; background:#fff; border-top:1px solid #ddd;}
#sub_container_wrap:after {content:""; display:block; clear:both;} 

.sub_content_wrap {position:relative; width:1300px; margin:0 auto 100px; min-height:680px;} 
.sub_content_wrap:after {content:""; display:block; clear:both;} 

/*===================================== 서브 =========================================*/

@media (max-width:1340px) {

	/* header */
	#header .header_wrap{width:96%;}
}


/********** media query mobile *************/
@media (max-width:1200px) {/* 190906 */
	
	#wrap{min-width:320px; overflow:visible; width:100%; height:100%}
	#header, .search, .search .search_wrap, .search input
	{width:100%;  -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box}
	
	#header {height:90px; border-bottom:2px solid #2b8eda;}/* 201013 height값 변경 */
	#header .header_wrap{width:100%;}
	#header .header_wrap h1 {  top:25px; left:2%; margin-left:60px; }/* 201013 top값 변경 */
	#header .header_wrap h1 img { width:auto; height:40px;}
	
	/* 검색 */
	#header .search_btn {display:block; top: 20px;} /* 201013 top값 변경 */
	#header .search_btn button {background:#2b8eda url('../images/common/btn_search_m.png') no-repeat center;}
	#header .search {display:none;width:100%;top:90px;left:0%;height:auto;margin-left:0;padding: 20px 2.5% 70px;background:rgba(0,0,0,0.9);} /* padding값, top값 변경 */ /* 201127수정 */
	#header .search .search_wrap {width:100%;height:42px;border:0;border-radius:0;overflow:visible;}
	#header .search .cont_box {padding-right:60px;}
	#header .search .cont_box button {top:0; right:0; height:42px;}
	#header .search input {margin:0;  width:calc(100% - 30px); height:42px; line-height:42px; border-radius:0;}
	#header .search_close{display:block; top: -70px;} /* 201013 top값 변경 */
	#header .keyword ul li a, #header .keyword p { color:#fff;}
	/* 201013 추가 */
	#header .search .search_area {margin-top:10px; text-align:center;} /* 201127수정 */
	#header .search .search_area li{color:#fff;}
    #header .search .search_area > li > input {border-radius:50px;} /* 201127추가 */

	/* 상단이동 */
	.btn_top a{position: fixed; top:auto; right:2.5%; bottom:2.5%; z-index: 9999;}

	/************ 서브 ************/		
	.sub_content_wrap, #sub_content, .subCntBody, #menu h1 {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box}

	/* sub visual */
	.s_visual{animation:none;}

	/* content */
	#sub_container_wrap, .sub_content_wrap {width:100%}	
	.sub_content_wrap {margin:0 auto}	
	#sub_content{margin:0; width:100%; padding:0 2.5% 20px}
	.subCntBody {width:100%}
}

@media (max-width: 580px){
	
	#header {height:70px;} /* 201013 height값 변경 */
	#header .header_wrap h1 {width:100%; top:20px; left:auto; margin:0; text-align:center} /* 201013 top값 변경 */
	#header .header_wrap h1 img {height:auto; max-width:200px; max-height:35px;}

	/* 검색 */
	#header .search {padding:20px 2.5% 90px;} /* 201127추가 */
	#header .search .cont_box {width:85%; padding-right:0;} /* 201127추가 */
	#header .search_btn {top:15px;} /* 201013 top값 변경 */
	#header .search_btn button {width:40px; height:40px; background-size:24px auto}
	#header .search {top:70px; }/* 201013 top, padding값 변경 */ /* 201127수정 */
	#header .search_close{ top:-55px;} /* 201013 top값 변경 */
	#header .search_close button {width:40px; height:40px;}
}