@charset "utf-8";

/* ========== 헤더 ========== */
header{
	position:fixed;
	width:100%;
	background:#fff;
	z-index:999;
}
#header_wrap{
	position:relative;
}
#header_wrap #logo{
	text-align:center;
	padding:10px 0;
}
#header_wrap #logo a{
	display:block;
}
#header_wrap #logo img{
	max-height:50px;
	width:auto;
}

/* ========== 모바일 햄버거 버튼 ========== */
.mobile_menu_btn{
	display:none;
	position:absolute;
	left:15px;
	top:50%;
	transform:translateY(-50%);
	width:30px;
	height:24px;
	padding:0;
	border:none;
	background:transparent;
	cursor:pointer;
	z-index:1001;
}
.mobile_menu_btn span{
	display:block;
	width:100%;
	height:3px;
	background:#333;
	border-radius:2px;
	transition:all 0.3s ease;
	position:absolute;
	left:0;
}
.mobile_menu_btn span:nth-child(1){ top:0; }
.mobile_menu_btn span:nth-child(2){ top:50%; transform:translateY(-50%); }
.mobile_menu_btn span:nth-child(3){ bottom:0; }

.mobile_menu_btn.active span:nth-child(1){
	top:50%;
	transform:translateY(-50%) rotate(45deg);
}
.mobile_menu_btn.active span:nth-child(2){
	opacity:0;
}
.mobile_menu_btn.active span:nth-child(3){
	bottom:50%;
	transform:translateY(50%) rotate(-45deg);
}

/* ========== 메뉴 (PC) ========== */
nav{
	border-top:0px solid #ddd;
	border-bottom:1px solid #ddd;
}
nav #nav_wrap ul{
	overflow:hidden;
}
nav #nav_wrap ul li{
	float:left;
	width:16.6%;
}
nav #nav_wrap ul li a{
	display:inline-block;
	font:18px "nanumSQ";
	color:#252525;
	width:90%;
	text-align:center;
	padding:15px 0;
	letter-spacing:-1px;
	outline:none;
}
nav #nav_wrap ul li a:focus,
nav #nav_wrap ul li a:active{
	outline:none;
	border:none;
	box-shadow:none;
}
nav #nav_wrap ul li:hover a{
	color:#008bc8;
	font:18px "nanumSQB";
	transition:all 0.3s ease;
}
nav #nav_wrap ul li a.on{
	color:#008bc8;
	font:18px "nanumSQB";
}
span.and{
	width:10%;
	text-align:center;
	display:inline-block;
	color:#008bc8;
	font:18px "nanumSQB";
}

/* ========== 콘텐츠 ========== */
#content{
	padding-top:120px;
}
.wrap ul{
	overflow:hidden;
}
.wrap ul li{
	float:left;
	width:49%;
}
.wrap ul li:nth-child(1){
	margin-right:2%;
}
.con a{
	display:block;
}

#content_wrap{
	background:url(../img/content_bg_.png);
}
#con1_bg{ background:url(../img/bg_08.png); }
#con6_bg{ background:url(../img/bg_23.png); }
#con8_bg{ background:url(../img/bg_32.png); }
#con9_bg{ background:url(../img/bg_38.png); }

.con7 div{
	margin-bottom:3%;
}

/* ========== 갤러리 ========== */
#gallery{
	padding:20px 0;
}
.gallery-top{
	margin-bottom:10px;
}
.gallery-thumbs{
	height:150px;
}
.gallery-thumbs .swiper-slide{
	height:100%;
	overflow:hidden;
}
.gallery-thumbs .swiper-slide img{
	width:100%;
	height:100%;
	object-fit:cover;
}

/* ========== 카카오맵 100% 반응형 ========== */
#map_area{
	width:100%;
	padding:0;
	margin:0;
}
.root_daum_roughmap{
	width:100% !important;
	max-width:100% !important;
}
.root_daum_roughmap .wrap_map{
	width:100% !important;
	height:400px !important;
}
.root_daum_roughmap .wrap_btn_zoom{
	display:none !important;
}
.root_daum_roughmap .wrap_controllers{
	display:none !important;
}
.root_daum_roughmap .wrap_mapinfo{
	display:none !important;
}

/* ========== 빠른메뉴 ========== */
.fast_menu{
	position:fixed;
	bottom:20px;
	right:20px;
	z-index:1000;
	background:transparent !important;
}
.fast_menu ul{
	list-style:none;
	margin:0;
	padding:0;
	background:transparent !important;
}
.fast_menu ul li{
	margin-bottom:10px;
	background:transparent !important;
	float:none !important;
	width:auto !important;
}
.fast_menu ul li:last-child{
	margin-bottom:0;
}
.fast_menu ul li a{
	display:block;
	outline:none;
	background:transparent !important;
}
.fast_menu ul li a:focus{
	outline:none;
}
.fast_menu ul li img{
	display:block;
	width:100px;
	height:auto;
}
.fast_menu .go_top{
	display:none;
}

/* ========== 푸터 ========== */
footer{
	background:#333;
	padding:10px 0;
	box-sizing:border-box;
}
#footer_wrap{
	overflow:hidden;
}
#foot_logo{
	float:left;
	width:40%;
	text-align:center;
	padding:24px 0;
}
#foot_txt{
	float:left;
	width:60%;
	color:#fff;
	font:15px "nanumSQ";
	padding:20px 0;
	line-height:1.8;
}
#foot_txt address{
	font-style:normal;
}
#foot_txt a{
	color:#fff;
}
#foot_txt small{
	opacity:0.8;
}

/* ========== 전역 포커스 제거 ========== */
a:focus, a:active,
button:focus, button:active{
	outline:none !important;
	-webkit-tap-highlight-color:transparent;
}
*:focus{
	outline:none !important;
}
body.menu-open{
	overflow:hidden;
}


/* ==========================================================
   반응형: 태블릿 (1024px 이하)
   ========================================================== */
@media screen and (max-width:1024px){
	nav #nav_wrap ul li a{
		font-size:15px;
		padding:12px 0;
	}
	span.and{
		font-size:15px;
	}
	
	/* 갤러리 썸네일 태블릿 */
	.gallery-thumbs{
		height:120px;
	}
}


/* ==========================================================
   반응형: 모바일 (768px 이하)
   ========================================================== */
@media screen and (max-width:768px){
	
	/* 헤더 */
	header{
		box-shadow:0 2px 5px rgba(0,0,0,0.1);
	}
	#header_wrap #logo{
		padding:12px 0;
	}
	#header_wrap #logo img{
		max-height:40px;
	}
	
	/* 햄버거 버튼 표시 */
	.mobile_menu_btn{
		display:block;
	}
	
	/* 네비게이션 드롭다운 */
	nav{
		position:absolute;
		top:100%;
		left:0;
		width:100%;
		background:#fff;
		border-top:1px solid #ddd;
		border-bottom:none;
		max-height:0;
		overflow:hidden;
		transition:max-height 0.4s ease;
	}
	nav.open{
		max-height:400px;
		border-bottom:1px solid #ddd;
		box-shadow:0 5px 15px rgba(0,0,0,0.1);
	}
	nav #nav_wrap{
		padding:0;
	}
	nav #nav_wrap ul{
		overflow:visible;
	}
	nav #nav_wrap ul li{
		float:none;
		width:100%;
		border-bottom:1px solid #eee;
	}
	nav #nav_wrap ul li:last-child{
		border-bottom:none;
	}
	nav #nav_wrap ul li a{
		display:block;
		width:100%;
		padding:15px 20px;
		font-size:16px;
		text-align:left;
		box-sizing:border-box;
	}
	nav #nav_wrap ul li a.on{
		background:#f8f9fa;
		color:#008bc8;
	}
	span.and{
		display:none;
	}
	
	/* 콘텐츠 */
	#content{
		padding-top:60px;
	}
	
	/* 갤러리 썸네일 모바일 최적화 */
	#gallery{
		padding:10px 5px;
	}
	.gallery-top{
		margin-bottom:8px;
	}
	.gallery-thumbs{
		height:70px;
		padding:5px 0;
	}
	.gallery-thumbs .swiper-slide{
		border-radius:4px;
		overflow:hidden;
	}
	.gallery-thumbs .swiper-slide img{
		height:60px;
		object-fit:cover;
	}
	
	/* 카카오맵 모바일 */
	#map_area{
		padding:0 10px;
	}
	.root_daum_roughmap .wrap_map{
		height:300px !important;
	}
	
	/* 푸터 */
	footer{
		margin-top:0px;
	}
	#foot_logo{
		float:none;
		width:100%;
		padding:15px 0;
	}
	#foot_logo img { width:100px; text-align:center;}
	#foot_txt{
		float:none;
		width:100%;
		text-align:center;
		padding:15px 20px;
		font-size:13px;
	}
	
	/* 빠른메뉴 */
	.fast_menu{
		bottom:15px;
		right:15px;
	}
	.fast_menu ul li{
		margin-bottom:8px;
	}
	.fast_menu ul li img{
		width:45px;
	}
}


/* ==========================================================
   반응형: 소형 모바일 (480px 이하)
   ========================================================== */
@media screen and (max-width:480px){
	#header_wrap #logo img{
		max-height:35px;
	}
	
	nav #nav_wrap ul li a{
		padding:12px 15px;
		font-size:15px;
	}
	
	/* 갤러리 썸네일 소형 모바일 */
	.gallery-thumbs{
		height:55px;
	}
	.gallery-thumbs .swiper-slide img{
		height:45px;
	}
	
	/* 카카오맵 소형 모바일 */
	.root_daum_roughmap .wrap_map{
		height:250px !important;
	}
	
	#foot_txt{
		font-size:12px;
		line-height:1.7;
	}
	
	.fast_menu ul li img{
		width:60px;
	}
}