html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}
body{line-height:1}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
ul {list-style:none}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:none}
a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}
ins{background-color:#ff9;color:#000;text-decoration:none}
mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold}
del{text-decoration:line-through}
abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}
table{border-collapse:collapse;border-spacing:0}
hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}
input,select{vertical-align:middle}

a {text-decoration: none}
.hide { display: none}
.left { float: left }
.right { float: right}
a:hover {text-decoration: underline}
html {overflow-y:scroll}

body {
	font-size: .75em; 
    background-color: #fff; 	background-color: #eee; 
	font-family: Dotum, '돋움', Gulim, '굴림', Verdana, Arial, 'Trebuchet MS';
}

/* 전체 레이아웃 */
.wrapper{
    max-width: 1100px;
    margin: 0 auto;
    position: relative;
}

 header, section, article { 
	overflow: hidden; /*float 초기화*/
    position: relative; /* 다른브라우져 지원*/
}


header {	/* main-section 이 올라오지 못하도록 영역 확보 */
	width: 100%;
	height: 90px;
}

/* 상단 네비게이션 영역 및 고정 */
nav {
	width: 100%;
	height: 90px;
	background-color: #514139;
	position: fixed;
	top: 0;
	right: 0;
	z-index: 999; 
}

/* 구글 번역 */
#google_translate_element {
	position: relative;
	left: 1170px;
	top: -71px;
}


/* 상단 네비게이션 */
nav #nav-wrap {  
	margin: 0 auto;
	width: 66%;
	height: 100%; 
}	

nav .gnb-wrap {
	position: relative;
	top: -70px;
	width: 75%;
	float: right;
}

li.gnb {  
	float: left;
	width: 20%; 
}

li.gnb a{ 
	padding-left: 5px;
	font-weight: bold;
	color: #fff; 	
	font-size: 1.167em;
}

ul.lnb { 
	position: relative;
	left: -20px;
	margin-top: 26px;
	padding-left: 20px;
	height: 300px;
	background-color: #2e2e2e;
	display: none;
}

ul.lnb a{
	display: block;
	padding: 8px 0 8px 5px; 
	font-weight: normal;
}

ul.lnb:hover {
	background-color: #000;
}

/* 상단 로고 */
nav #nav-wrap .logo-top-1 {
	position: relative;
	top: 20px;
	left: 20px;
	cursor: pointer;

	-webkit-transition: margin 1s ease;
	 -moz-transition: margin 1s ease;
	   -o-transition: margin 1s ease;
	  -ms-transition: margin 1s ease;
		  transition: margin 1s ease;
}

nav #nav-wrap .logo-top-1:hover {
  margin-left: -20px;
}

nav #nav-wrap .logo-top-2 {
	position: relative;
	top: -40px;
	left: 60px;
}

/* 글자 축소 확대 large  */
#font-zoom {
	position: fixed;
	top: 400px;
	background-color: #514139;
	color: #fff;
	z-index: 999;
	font-size: 1.5em;
}

#font-zoom div { 
	border-bottom: 1px solid #fff;
	padding: 5px;
	cursor: pointer 
}


/* 메인 파노라마 */
#panorama {
	width: 100%;
	height: 950px; 

}

#panorama img {
	position: relative;
}

/* index.php 메인 콘텐츠 */
.main {
	margin: 20px auto;
}

.main div.gallery {
	position: relative;
	overflow: hidden;
}

.main .gallery div {	
	width: 33.3%; 
	height: 210px;
	float: left;	
}

.main .gallery a{ 
	margin: 3%;
	display: block;
	height: 90%;
	width: 90%;
	text-decoration: none;
	box-shadow: 5px 5px 5px #888888;
	border-radius: 10px;

	behavior: url(js/PIE.htc);
}

.main .gallery img { 
	height: 100%;
	width: 100%;
	box-shadow: 5px 5px 5px #888888;
	border-radius: 10px;

	transition: all 0.3s ease 0s;
	-webkit-transition: all 0.3s ease 0s;
	-moz-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
	-ms-transition: all 0.3s ease 0s;

	behavior: url(js/PIE.htc);
}

.main .gallery a:hover img {
	box-shadow: 5px 5px 5px #888888;
	border-radius: 10px;
	transform: scale(1.09);
	-webkit-transform: scale(1.09);
	-moz-transform: scale(1.09);
	-o-transform: scale(1.09);
	-ms-transform: scale(1.09);
}

.main .gallery figure {
	display: block;
	width: 100%;
	height: 100%;
	line-height: 100%;
	position: relative;
	text-align: center;
	overflow: hidden;
}

.main .gallery figcaption {
	padding: 5px;
	height: 30px;
	color: #ddd;
	display: block;
	position: relative;
	top: -40px;
	left: 5px;
}

.main .gallery figcaption .title {
	padding: 5px 10px;
	position: absolute;
	top: 10px;
	font: 1.083em dotum;
	font-weight: bold;
	color: #fff;
	display: block;
	text-align: left; 
	background-color:  #1f1a17;
}
/*
.main .gallery .icon-rotate {
	position: absolute;
	top: 7px;
	left: 3px;
	display: block;
	width: 25px;
	height: 25px;
	margin: 0;
	padding: 0; 
	background:url('../images/icon_star2.png') no-repeat center center;
	z-index: 999;
}
*/

/* 숙박요금, 대실요금 */
.main .row-1 {
	height: 310px;	 
	position: relative;
	overflow: hidden; 
}

.main .row-1 #tabs-1, .main .row-1 #tabs-2 {
	margin: 0;
	padding: 0;
	float: left;
	width: 100%; 
}

.main .row-1 #tabs {
	margin: 25px 15px 20px 14px;
	width: 40%;  
	font-size: 1em;
}

.main .row-1 #datepicker {
	float: right;
	position: relative;
	top: -65px;
	left: -10px;
}

.main #tabs table {
	width: 100%;  
	background-color: #fff;
}

.main #tabs table th {
	text-align: center;
}

.main #tabs table td{
	text-align: right;
}

.main #tabs tr:hover {
	background-color: #0da6f4;
	color: #fff;
	font-weight: bold;
}

.main #tabs table td:first-child {
	text-align: left;
	width: 140px;
}

.main #tabs table th, .main #tabs table td {
	padding: 4px;
	border: 1px solid #bbb;
}

/* 마우스 오버시 td 늘어나는거 방지하기 위해 필요 */
.main #tabs-1 td:nth-child(2) {
	width: 30%;
}
/* 달력 */
.ui-datepicker-calendar th:first-child, .ui-datepicker-calendar td:first-child a {
	color: red;
}

.ui-state-highlight, .ui-datepicker-current-day a {
    background: #b81007 !important;
	color: #fff !important;
}



/*공지사항, 객실문의, 오시는길 */
.main .row-2 { 
 	padding: 10px;
	height: 190px; 
}

.main .row-2 .notice {
	margin: 1%;
	float: left;
	height: 160px;  
	text-shadow: 1px 1px 1px #fff;
	box-shadow: 2px 2px 2px #000;
	border-radius: 10px;
	background-color: #eee;  
}

.main .row-2 .notice:nth-child(1) {
	width: 35%;
}

.main .row-2 .notice:nth-child(2) {
	width: 28%;
}

.main .row-2 .notice:nth-child(3) {
	width: 31%;
}


.main .row-2 .notice  h2 {
	color:  #2e2e2e; 	color:  #000; 
	border-bottom: 1px solid #1f1a17;
	padding: 15px 0 5px 10px;
	background-color: #ddd;
}

.main .row-2 .notice  ul {   
	padding-left: 15px;
}
.main .row-2 .notice  li {   
	margin:8px;
	letter-spacing: .1em;  	
	list-style-type: circle; 
}

.main .row-2 .notice  li:hover {   
	list-style-type: disc; 
}

.main .row-2 .notice:hover {
	background-color: #fff;
}

/* 하단 */
footer { 
	margin-top: 20px; 
	color: #999999;
	letter-spacing: .1em; 
	background-color: #2e2e2e;
}

address:hover { 
	color: #fff;
}

footer address { 
	height: 120px; 
	font-style: normal; 	
}

footer address dl { 
	margin-top: 20px;   
	width: 50%; 
	float: left; 
	line-height: 1.5em; 
}

footer address dt { 
	font-weight: bold;
}

footer address dd { 
	line-height: 1.8em;
}

footer .copyright-wrap {	
	background-color: #1f1a17;
	height: 50px;
}

footer .copyright-wrap .wrapper {	
	height: 100%;
	background: url('/images/logo_bottom.gif') no-repeat 2% center;
}

 footer p.copyright {  
	position: relative;
	top: 19px;
	text-align: center;		
}

/* 
서브 페이지 - 
*/

/* 사이드바 */
.sidebar {
	float: left;    
	width: 265px;
	height: 850px;	
	background: url(../images/sidebar-bg.png) no-repeat 28px 30px; 
}

.sidebar h2 {
	margin: 50px 0 15px 0;
	padding-bottom: 10px;
	text-align: center;
	font-size: 1.25em;
	color: #3b281f; 
	font-weight: normal;
}

.sidebar ul {
	margin: 0 auto;
	width: 230px;
	height: 420px;
}

.sidebar li {
	height: 45px;
}

.sidebar li a {
	padding: 10px 0 0 40px;
	display: block;
	height: 100%; 	
	font-size: 1.083em;
	color: #5e5e5d; 
}

.sidebar li a:link, .sidebar li a:visited {
	color: #5e5e5d; 
	text-decoration: none;
}

.sidebar li a:hover, .sidebar li a:focus {
	height: 45px;
	background: url(../images/nav.png) no-repeat;
	background-position: -232px -10px;
	color: #fff;
}

.sidebar a#active {
	height: 45px;
	background: url(../images/nav.png) no-repeat;
	color: #fff;
	background-position: -0px -10px;
}

/* 사이드바 아래 건물 */
.sidebar .building {
	position: relative;
	top: 20px;
	left: 22px;

}

.sidebar .building img {
	width: 87%;
	height: 200px;
	box-shadow: 5px 5px 5px #888888;
	border-radius: 10px;
}

.sidebar .building  h3 {
	margin-top: 10px;
	width: 87%;
	padding: 5px 0;
	line-height: 1.8em;;
	background-color: #514139;;
	color: #fff;
	text-align: center;
	box-shadow: 5px 5px 5px #888888;
	font-size: 1.167em; 
	letter-spacing: .125em;
}


/* 
본문 메인 
*/
.content {
	float: right ;
	width: 70%; 
}

.content h3{
	margin: 20px 0 5px 0;
	font-size: 1em;
}

.content strong {
	color: red;
}

.content p { 
	margin: 10px 0;
	line-height: 1.5em;
}

/* 테이블 공통 */
.content table {	
	margin-top: 10px;
	width: 100%;
}

.content table th {
	width: 100px;
	vertical-align: middle; 
}

.content table th, .content table td {
	padding: 7px;
	font-size: 1em;
	line-height: 1.5em;
	border: 1px solid #bbb;	
}
/* 테이블 공통 끝 */

.content h2 {
	padding: 20px 0 10px 0;
	text-indent: .5em;
	font-size: 1.333em;
	font-weight: bold;
}

/* 숙박시설   */
.content span.fullscreen-view {	/* 전체화면보기 */
	font-size: .875em;
	font-weight: normal;
}


#tabs-rooms-gallery div { /* 객실 사진 갤러리 박스 */
	margin-top: 2px; 
	padding: 0;
}

#carousel1, .content .row-2 { /* 객실 사진 슬라이드 */
	margin: 0 auto;
	background-color: #fff;
}

/* 객실 설명 */
.room table caption {
}

.room span.calendar-btn {
	cursor: pointer;
}

.room .calendar-wrap {
	display: none;
}

 #calendar th, #calendar td {
	margin: 0; 
	padding: 0;
	font-size: .875em;
}

/* 호텔 - 인사말 */
.greeting .span-1  {
	width: 90%;
}

.greeting .span-1  h4 {
	padding-left: 2em;
	font-size: 1.25em;
	font-weight: normal;
}

.greeting .span-1 p {
	margin-top: 20px;
	font-size: 1.15em;
	line-height: 1.5em; 
}

/* 호텔 - 호텔안내 */
.guide .row-1 img {
	border: 5px solid #c9a868;
}


/* 호텔 - 오시는길 */
.location .map-1 img{ 
	border:1px solid #bbb; 
	margin: 10px 0;
}

#naverMap {
	border:1px solid #bbb; 
	width: 700px; 
	height: 400px; 
}

.location h3 {
	
}

.location a.btn {
	float: left;
	display: block;
	width: 60px;
	text-align: center;
	background-color: #514139;
	margin: 10px;
	padding: 10px;
	color: #fff;
	box-shadow: 1px 1px 1px #888888;
	border-radius: 5px;
}


/* 호텔 - 오시는길 - 주변버스 */
.location  dl {
	margin-top: 10px;
	position: relative; 
	overflow: hidden;
	line-height: 1.6em;
}

.location dt { 
	width: 80px; 
}

.location dt, .location dd {  
	float: left;
}


.location .around_bus_table caption {
	font-size: 1.167em ;
	text-align: left;
}

.location .spbi {
	height: 15px;
	display: block;
	background: url(http://static.naver.net/maps/ux2013/sp_bus_icons.png) no-repeat;
	color: transparent;
}

.location .spbi_d1 {
	width: 24px;
	height: 15px;
	background-position: 0 0;

}

.location .spbi_d2 {
	width: 24px;
	height: 14px;
	background-position: -29px 0;
	color: transparent;
}

.location .abt_th a {
	color: #000;
	font-weight: normal;
}

/* 레스토랑 - 카페테리아 */
.cafeteria .gallery figure {	
	width: 33.3%; 
	height: 210px;
	float: left;		
}

.cafeteria .gallery a{ 
	display: inline;
	text-decoration: none;
	box-shadow: 5px 5px 5px #888888;
	border-radius: 10px;
}


.cafeteria .gallery img { 
	width: 90%;
	height: 160px;

	box-shadow: 5px 5px 5px #888888;
	border-radius: 10px;
	vertical-align: middle;

	transition: all 0.3s ease 0s;
	-webkit-transition: all 0.3s ease 0s;
	-moz-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
	-ms-transition: all 0.3s ease 0s;
}

.cafeteria .gallery a:hover img{
	box-shadow: 5px 5px 5px #888888;
	border-radius: 10px;
	transform: scale(1.04);
	-webkit-transform: scale(1.04);
	-moz-transform: scale(1.04);
	-o-transform: scale(1.04);
	-ms-transform: scale(1.04);
}

.cafeteria  .gallery figcaption {
	width: 100%; 
	height: 30px;
	color: #000;
	position: relative;
	top: 10px;
	left: 0;
	background-color: #fff; 
	text-align: center; 
}

.cafeteria .gallery figure:hover figcaption {
	background-color: #fff; 	
	font-weight: bold;
}

.cafeteria div {
	overflow: hidden;
}

/* 예약 안내 */
.reserve .room-type td:nth-child(1) {
	width: 18%;
}

.reserve .room-type td:nth-child(2) {
	width: 12%;
	text-align: right;
}

.reserve .room-type td:nth-child(3) {
	width: 12%;
	text-align: right;
}

.reserve .room-type tbody tr {
	cursor: pointer;
}

.reserve .room-type tbody tr:hover  {
	background-color: #0da6f4;
	color: #fff;
}

.reserve .tr-bg {
	background-color: #0da6f4;
	color: #fff;
}

.reserve .sum {
	color: red;
	font-weight: bold;
	letter-spacing: .1em;-
}

/* 주차시설 */
.parking img {
	margin-bottom: 5px;
	
}

/*
미디어 쿼리 
*/

/* small */
@media all and (max-width: 800px) {
	.logo-wrap, #google_translate_element, #main-section  {
		display: none;
	}


	nav #nav-wrap {  		
		width: 100%;
		height: 100%; 	
	}	

	nav .gnb-wrap {
		position: relative;
		top: 30px;
		width: 100%;

	}

	.wrapper{
        max-width: 100%; 
	}

	nav {
		position: relative;
		left: 0;
		top: 0;
		float: left;
	}

	.main .gallery div {	
		height: 110px;
	}

	.main .gallery figcaption .title {
		padding: 0px;
		position: absolute;
		left: -2px;
		top: 20px;
		font: 1.0em dotum;
		font-weight: bold;
		color: #fff;
	}	

	.main .row-1 {
		height: auto;	 
	}

	.main .row-1 #tabs, .main .row-1 #datepicker {
		float: left;
		width: 90%;  
		position: relative;
		overflow: hidden;
		top: 0px;
		left: 0px;
	}

	.main .row-1 #datepicker  {
			margin-top: 10px;
			width: 100%;  
	}

	footer .copyright-wrap .wrapper {	
		background: none;
	}

}

/* standard */
@media all and (min-width: 801px) and (max-width: 1024px) {

	/* 구글 번역 */
	#google_translate_element {
		left: 890px;
	}

	/* 네비게이션 */
	nav #nav-wrap  { width: 95%;}

	.wrapper{
        padding: 0 40px;
        max-width: 1020px;
	}

	/* 파노라마 */
	div#panorama {
		width: 100%;
		height: 950px; 
	}

	#panorama img {
		width: 100%;

	}

	/* 호텔 - 호텔안내 */
	.guide .row-1 img {
		width: 98%;
	}
}


/* large */
@media all  and (min-width:  1025px) and (min-width: 1025px) {
	body { font-size:0.875em;}  /* 14px */
}