#hd {
	position: fixed;
	top: 0;
	left: 0;
	width: 270px;
	height:100%;
	/* background-color:#f6f6f6; */
	z-index: 100;
	border-right:1px solid #f6f6f6;
}

#hd #hd_wrapper {
	padding: 22px 22px 22px 32px;
}

#hd #logo {
	position: relative;
	z-index: 10;
	transition: 0.5s ease;
	-webkit-transition: 0.5s ease;
	top: 40px;
	left: 44px;
    width: 105px;
}

#hd #logo img{
    width: 100%;
}

#hd #logo .logo_w {
	display: none;
}

#hd .btn_wrapper {
	position: absolute;
	right: 90px;
	top: 20px;
	display: inline-block;
	z-index: 10000;
	background: none !important;
}

#hd .btn_wrapper > div {
	float: left;
}

#hd .btn-reser {
	color: #fff;
	max-width: 206px;
	text-align: center;
	vertical-align: middle;

	font-size: 20px;
}

#hd .btn-reser * {
	vertical-align: middle;
}


#hd .btn-reser a {
	color: #000;
	font-family: 'Jaldi', sans-serif;
	padding: 0 !important;
}


#hd .btn-reser ul {
	font-size: 12px;
	text-align: left;
	display: none;
	margin-top: 10px;
}

#hd .btn-reser ul a {
	vertical-align: middle;
}

#hd .btn-reser ul i {
	font-size: 16px;
	vertical-align: middle;
	margin-top: -3px;
}

#hd .btn-reser:hover ul {
	display: block;
}

#hd .btn-menu {
	width: 47px;
	height: 47px;
	border: 2px solid #000;
	position: absolute;
	cursor: pointer;
	right: 20px;
	top: 20px;
	z-index: 100;
}

#hd.down .btn-reser a {
	color: #000;
}

#hd .btn-menu .wrapper {
	position: absolute;
	width: 100%;
	padding: 0 7px;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%);
	overflow: hidden;
}

#hd .btn-menu .line {
	height: 2px;
	background: #000;
	transition: 0.5s ease;
}

#hd .btn-menu .line.no2 {
	margin: 5px 0;
	opacity: 1;
}

#hd.on .btn-menu .line.no2 {
	transform: translateX(10px);
}

#hd.active a {
	color: #333;
}

#hd.active .btn-menu {
	border: 2px solid #333;
}

#hd.active .btn-menu .line {
	background: #333;
}

#hd.active .btn-reser {
	border: 2px solid #333;
	color: #333;
}

#hd.down #logo2 {
	max-width: 180px;
	display: block;
}


#hd.active a {
	color: #333;
}

#hd.active .btn-menu {
	border: 2px solid #333;
}

#hd.active .btn-menu .line {
	background: #333;
}

#hd.active .btn-reser {
	border: 2px solid #333;
	color: #333;
}

/* gnb */
#gnb {
	font-size: 18px;
	letter-spacing: -0.35px;
	opacity: 0;
	position: absolute;
	left: 50%;
	top: 150px;
	transform:translate(-50%,0);
}

#hd.on #gnb {
	opacity: 1;
	visibility: visible;
	right: 0;
	z-index: 0;
	overflow: auto;
}

#gnb a {
	color: #333;
	text-decoration: none;
}

#hd.on #gnb a,
#hd.down #gnb a {
	color: #333;
}

#gnb #gnb_1dul {
	display: none;
	display: inline-block;
}

#gnb .gnb_1dli {
	padding: 5px 0;
}

#gnb .gnb_1dli > a {
	padding: 0 3px;
	font-weight: 400;
	text-transform: uppercase;
	font-family: 'Noticia Text', serif;
	letter-spacing:1.0px;
}

#gnb .gnb_2dul {
	overflow: hidden;
	padding: 0;
	margin-top: 10px;
	/* width:370px; */
}

#gnb .gnb_2dli {
	display: block;
	margin-bottom: 0px;
	margin-left: 7px;
	font-size: 14px;
	opacity: 0.8;
}

#gnb .gnb_2dli a {
	text-decoration: none;
	font-family: 'Noto Sans CJK KR';
}

#gnb .gnb_2dli a {}

#gnb .gnb_1dli.active .gnb_2dul {
	max-height: 500px;
}

.quick {
	margin:7px 0 ;
}
.quick a {
	padding: 0 3px;
	font-weight: 400;
	text-transform: uppercase;
	font-family: 'Noticia Text', serif;
	letter-spacing:1.0px;
}
.quick .iconify {
	display: inline-block;
	height: 15px;
	width: 15px;
	margin-left: 5px;
	margin-bottom:-0.5px;
}

.social {
	position: absolute;
	bottom: 50px;
	left: 50%;
	font-size: 16px;
	transform:translate(-50%,0);
}
.social a {
	display: block;
	font-family: 'Noticia Text', serif;
}
.social .iconify {
	display: inline-block;
	height: 15px;
	width: 15px;
	margin-left: 15px;
}

/* 큰 기기들 (큰 데스크탑, 1200px 이상) */
@media (min-width: 1200px) {
	#hd #gnb {
		visibility: visible;
		opacity: 1;
		background: none;
	}

	#hd #gnb a {
		color: #000;
	}

	#hd.on #gnb a,
	#hd.down #gnb a {
		color: #000;
	}

	#hd .btn-menu {
		display: none;
	}

	/*#hd.down .btn-menu{
        display: block;
    }*/

	#hd .btn-menu {
		margin-left: 20px;
		right: 216px;
		top: 20px;
	}

	#hd .btn_wrapper {
		right: 20px;
	}
}
@media(max-width: 1199px) {
	#hd #gnb {
		opacity: 0;
		visibility: collapse;
		right: -100%;
		left: auto;
		top: 0;
		bottom: 0;
		height: 100%;
		width: 40%;
		background: rgba(255, 255, 255, 0.8);
		text-align: right;
		padding-top: 100px;
		transition: 0.5s ease;
		-webkit-transition: 0.5s ease;
	}

	#hd.on #gnb {
		opacity: 1;
		visibility: visible;
		right: 0;
		z-index: 0;
		overflow: auto;
		padding-right: 20px;
		transform:translate(0,0);
	}
}

@media(max-width:1440px) {
	#hd #logo {
		left: 40px;
	}
	.social {
		left:45px;
		bottom: 50px;
	}
}

@media(max-width: 1366px) {
	#hd {
		width:220px;
	}
	#hd #logo {
		left: 20px;
	}
}

@media(max-width:1024px) {
	#hd {
		width:100%;
		height:auto;
	}
	#hd.on {
		height:100%;
	}

	#hd #logo {
		top: 5px;
		left: -5px;
	}

	#gnb .gnb_2dul {
		max-height: 500px;
	}

	#hd.down .btn-menu {
		border: 2px solid #000;
	}

	#hd.down .btn-menu .line {
		background: #000;
	}
	
	.social {
    left: 20px;
    bottom: 9px;
	}
	
	#hd.is_bottom .social {
		display:none;
	}
}

@media (max-width: 992px) {
	#hd.down #gnb {
		opacity: 0;
		visibility: collapse;
	}

	#hd.down.on #gnb {
		opacity:1;
		visibility: visible;
	}

	#hd.down.on #gnb {
		margin-top: 0;
	}
}

@media (max-width: 769px) {
	#hd #logo2 {
		width: 140px;
	}

	#hd #logo {
		width: 140px;
	}

	#hd .btn-reser {
		font-size: 14px;
		padding: 7px 18px;
	}

	#hd .btn-menu {
		width: 42px;
		height: 42px;
		margin-left: 10px;
		z-index: 100000;
	}

	#hd.on .btn-menu .line.no1 {
		transform: rotate(-45deg);
		transform-origin: 80%;
		margin-left: -2px;
	}

	#hd.on .btn-menu .line.no3 {
		transform: rotate(45deg);
		transform-origin: 86%;
		margin-left: -4px;
	}

	#hd.on .btn-menu .line.no2 {
		margin: 5px 0;
		transform: translateX(20px);
		opacity: 0;
	}

	#hd #gnb {
		width: 100%;
		padding-top: 100px;
		text-align: right;
		padding-right: 20px;
	}

	#hd #gnb .gnb_1dli {
		font-size: 25px !important;
	}

	#hd #gnb .gnb_2dli {
		font-size: 20px !important;
	}

	#hd.on #gnb {
		margin-top: 0;
	}

	#gnb #gnb_1dul {
		visibility: visible;
		opacity: 0;
		transition: 0.5s ease;
		font-size: 14px;
	}

	#hd.on #gnb_1dul {
		visibility: visible;
		opacity: 1;
		width: 100%;
	}

	#hd.on #gnb_1dul a {
		color: #333;
	}

	#hd.active #gnb_1dul a {
		color: #333;
	}

	#gnb .gnb_2dli {
		margin-left: 10px;
		margin-right: 0;
	}

	#gnb .gnb_2dli a {
		/* font-size:14px; */
	}

	#hd .btn_wrapper {
		right: 70px;
	}
}

@media(max-width: 560px) {
	#hd #gnb .gnb_1dli {
		font-size: 18px !important;
	}

	#hd #gnb .gnb_2dli {
		font-size: 16px !important;
	}

	#ft .ft_box {
		left: 10px;
		font-size: 10px;
		padding-bottom: 20px;
	}

	#hd #logo {
		width: 50px;
		top: -10px;
		left: -20px;
	}

	#hd .btn-menu {
		width: 40px;
		height: 32px;
		right: 10px;
		top: 10px;
	}

	#gnb {
		padding: 5px;
	}
}