@import url(./basic.css);



/* 
---------------------------------------------------------------------------------------------------------------------------------------------------------------
                                                       sub 코딩
---------------------------------------------------------------------------------------------------------------------------------------------------------------
*/
	/* 예소이네 소개*/
	.aboutBox {background: url(/image/subD/aboutBG.jpg) repeat 0 0;width:40%;height:100%;position:absolute;top:0;left:0;text-align:right;z-index:10;}
	.partnerBox {background:#fff;width:40%;height:100%;position:absolute;top:50px;left:0;text-align:right;z-index:10;}
	.partnerBox img{min-height:550px;padding-right:20px;}


	/* 기본레이아웃 - 파트너,오시는길,예약,계시판*/
	#subwrap {position:relative;width:100%;z-index:1; margin-top:120px;}
		#subContentBox {width:900px;padding:50px 50px 20px;margin:50px auto;background: url(/image/subD/overlay_white.png) repeat;;min-height:800px;}
		#subContentBox .row{padding-bottom:30px; color:#666666;font-size:15px;line-height:25px;}
		
		#subContentBox .titleArea {height:85px;margin-bottom:30px;}
		#subContentBox .titleArea h2 {width:350px;margin:0 auto;color:#3d3d3d;font-family: 'Nanum Gothic', '나눔고딕', serif;line-height:20px;padding:12px 0 10px;letter-spacing:5px;text-align:center;font-style:normal;font-size:25px;border-top:1px solid #cdcdcd;border-bottom:1px solid #cdcdcd;}
		#subContentBox .titleArea p  {width:auto;color: #585858;font-size: 12px;line-height:16px;padding-top:7px;font-family: 'Open Sans',Arial,sans-serif;text-align:center;}
		#subContentBox .titleArea .social {text-align:right;}

		#subContentBox h3 { margin:20px 0 15px; font-size:18px;font-weight:bold;font-family:'Nanum Gothic', '나눔고딕', serif;}
		#subContentBox h4 { margin:10px 0 5px; font-size:1.1em; font-weight:bold;}
		#subContentBox p {margin-bottom:15px;}
		#subContentBox p a{font-weight:bold;color:#5e2c05;}
		#subContentBox ol {margin:20px 0 0 20px; }
		#subContentBox ol li {line-height:25px;}

/* 교통안내 */
#subContentBox .info {float:left;width:430px;margin-right:40px;}
#subContentBox .info img {width:430px;height:auto;border:1px solid #ddd;}
#subContentBox .info .text h3{font-size:18px;margin: 10px 0 10px;}
#subContentBox .info .text ol li{line-height:18px;}

/*예약안내*/
 .tbl01{margin-bottom:30px;}
 .tbl01 table { width:100%; border-top:2px solid #545861; border-bottom:1px solid #545861; color:#545861;font-size:1em;  }

 .tbl01 thead tr th{border-bottom:1px solid #8e8e8e;border-right:1px solid #8e8e8e; padding:4px 10px;border-top:1px solid #5d5d5d;font-weight:bold;background-color:#efefef;}
 .tbl01 thead tr th.last{border-right:none;}

 .tbl01 tbody th {background:#f7fbfb;border-bottom:1px solid #8e8e8e;border-right:1px solid #8e8e8e;text-align:center;padding-left:10px;font-weight:bold;font-size:0.9em;}
 .tbl01 tbody tr.all td {border-bottom:2px solid #444;}
 .tbl01 tbody tr:hover {background-color:#eaf1f9;}
 .tbl01 tbody tr td{border-bottom:1px solid #8e8e8e;border-right:1px solid #8e8e8e; padding:4px 10px;text-align:center;}

 .tbl01 tbody tr td.last{border-right:none;}
 .tbl01 tbody tr td.left{text-align:left;}

/* 
---------------------------------------------------------------------------------------------------------------------------------------------------------------
                                                       객실소개
---------------------------------------------------------------------------------------------------------------------------------------------------------------
*/


	/* full 레이아웃 - 객실소개,전경사진 */

	#wrapFull {width:100%;overflow:hidden;}

	#wrapFull .titleArea {position:relative;height:85px;margin:0 0 20px; }
	#wrapFull .titleArea h2 {width:350px;margin:40px auto 0;color:#3d3d3d;font-family:'Nanum Gothic', '나눔고딕', serif;line-height:20px;padding:12px 0 10px;letter-spacing:5px;text-align:center;font-style:normal;font-size:25px;border-top:1px solid #cdcdcd;border-bottom:1px solid #cdcdcd;}
	#wrapFull .titleArea p  {width:auto;color: #585858;font-size: 12px;line-height:16px;padding-top:7px;font-family: 'Open Sans',Arial,sans-serif;text-align:center;}
	#wrapFull .titleArea .social {position:absolute;top:45px;left:0;}
	#wrapFull .titleArea #xbtn {position:absolute;top:45px;right:0;width:100px;}

	#wrapFull .row{margin-bottom:30px;}
	#wrapFull .col{float:left;width:410px;}
	#wrapFull .col:first-child{width:530px;margin-right:30px;padding-right:20px;border-right:1px dotted #ddd;}
	#wrapFull h3 { margin:5px 0 15px; font-size:16px; font-weight:bold;font-family: 'Nanum Gothic', '나눔고딕', serif;}

	#wrapFull dl {}
	#wrapFull dl dt{float:left;width:100px;height:25px;line-height:25px;font-size:14px;margin-bottom:15px;border-radius:20px;background-color:#efefef;text-align:center;}
	#wrapFull dl dd{float:left;width:410px;height:auto;min-height:25px;margin:0 0 15px 15px;}
	#wrapFull dl dd img{width:11px;padding-top:1px;}

	/*예약버튼*/
	.linkRoom a{display:inline-block;background:#e44b37 url(/image/subD/time.png) no-repeat 2px 2px;background-size:auto 85%;color:#fff;width:auto;height:17px;line-height:15px;padding:4px 7px 3px 25px; font-size:13px;text-transform:uppercase; text-decoration:none;border-radius:3px;-webkit-border-radius:3px;-moz-border-radius:3px;}
	.linkRoom a:hover{text-decoration:underline; }

	/*예약버튼 하단*/
	.linkRoomBig {text-align:center;}
	.linkRoomBig a{display:inline-block;background:#e44b37 url(/image/subD/time.png) no-repeat 20px 4px;background-size:auto 75%;color:#fff;width:100px;height:30px;line-height:30px;padding:0 7px 0 30px; font-size:15px;text-transform:uppercase; text-decoration:none;border-radius:3px;-webkit-border-radius:3px;-moz-border-radius:3px;}
	.linkRoomBig a:hover{text-decoration:underline; }


/*객실안내*/
 .tbl02 table { width:100%; border-top:1px solid #545861; border-bottom:1px solid #545861; color:#545861;}

 .tbl02 thead tr th{border-bottom:1px solid #ddd;border-right:1px solid #ddd; padding:4px 10px;border-top:1px solid #5d5d5d;font-weight:bold;background-color:#efefef;}
 .tbl02 thead tr th.last{border-right:none;}

 .tbl02 tbody th {background:#f7fbfb;border-bottom:1px solid #ddd;border-right:1px solid #ddd;text-align:center;padding-left:10px;font-weight:bold;}
 .tbl02 tbody tr td{border-bottom:1px solid #ddd;border-right:1px solid #ddd; padding:7px 10px;text-align:center;}
 .tbl02 tbody tr td.last{border-right:none;}
 .tbl02 tbody tr td.left{text-align:left;}





/* 
---------------------------------------------------------------------------------------------------------------------------------------------------------------
                                                                부대시설
---------------------------------------------------------------------------------------------------------------------------------------------------------------
*/
	/* full 레이아웃 - 부대시설*/

	#subwrap_full {margin-top:0;width:100%;z-index:101;}

	#subwrap_full .subContentBox{position:relative;width:100%;padding:50px 0 20px;min-height:400px;background-color:#fff;}
	#subwrap_full .subContentBox .rel{width:1000px;margin:0 auto;}

	#subwrap_full .subContentBox .titleArea {position:relative;height:85px;margin:0 0 30px; }
	#subwrap_full .subContentBox .titleArea h2 {width:350px;margin:0 auto;color:#3d3d3d;font-family:'Nanum Gothic', '나눔고딕', serif;line-height:20px;padding:12px 0 10px;letter-spacing:5px;text-align:center;font-style:normal;font-size:25px;border-top:1px solid #cdcdcd;border-bottom:1px solid #cdcdcd;}
	#subwrap_full .subContentBox .titleArea p  {width:auto;color: #585858;font-size: 12px;line-height:16px;padding-top:7px;font-family: 'Open Sans',Arial,sans-serif;text-align:center;}
	#subwrap_full .subContentBox .titleArea .linkRoom {position:absolute;top:45px;right:0;}
	#subwrap_full .subContentBox .titleArea .linkRoom a{display:inline-block;background:#e44b37 url(/image/subD/time.png) no-repeat 2px 2px;background-size:auto 85%;color:#fff;width:auto;height:17px;padding:4px 7px 3px 25px; font-size:13px;text-transform:uppercase; text-decoration:none;border-radius:3px;-webkit-border-radius:3px;-moz-border-radius:3px;}
	#subwrap_full .subContentBox .titleArea .linkRoom a:hover{text-decoration:underline; }
	#subwrap_full .subContentBox .titleArea .social {position:absolute;top:45px;right:90px;}

	#subwrap_full .subContentBox .row{margin-bottom:30px;}
	#subwrap_full .subContentBox .col{float:left;width:475px;}
	#subwrap_full .subContentBox .col:first-child{width:480px;margin-right:20px;padding-right:20px;border-right:1px dotted #ddd;}
	#subwrap_full .subContentBox h3 { margin:5px 0 15px; font-size:16px; font-weight:bold;font-family: 'Nanum Gothic', '나눔고딕', serif;}

	#subwrap_full .subContentBox dl {}
	#subwrap_full .subContentBox dl dt{float:left;width:100px;height:25px;line-height:25px;font-size:14px;margin-bottom:15px;border-radius:20px;background-color:#efefef;text-align:center;}
	#subwrap_full .subContentBox dl dd{float:left;width:360px;height:auto;min-height:25px;margin:0 0 15px 15px;}
	#subwrap_full .subContentBox dl dd img{width:11px;padding-top:1px;}

/* 부대시설슬라이드 */
.lof-slidecontent, .lof-slidecontent a { color:#FFF;	}
.lof-slidecontent a.readmore{ color:#58B1EA; font-size:95%;}

.lof-slidecontent{ position:relative; overflow:hidden; }
.lof-slidecontent .preload{ height:100%; width:100%; position:absolute; top:0; left:0; z-index:100000; text-align:center; background:#FFF }
.lof-slidecontent .preload div{ height:100%; width:100%; background:transparent url(/Class/css/slide/load-indicator.gif) no-repeat scroll 50% 50%; }
.lof-main-outer{ position:relative; height:100%; width:900px; z-index:3; overflow:hidden; }

.lof-main-item-desc{z-index:100; position:absolute; bottom:150px; left:30%; width:40%; background:url(/Class/css/slide/bg_trans.png); height:100px; /* filter:0.7(opacity:60) */ padding:10px 10px 20px 10px; }
.lof-main-item-desc p{margin:0 8px; padding:8px 0 }
.lof-main-item-desc h2{position:relative;font-size:18px; color:#fff;background:url(/image/line.gif) no-repeat 0 0;padding-top:5px;margin:10px 0 10px 10px;font-family:맑은고딕, 'Malgun Gothic';}
.lof-main-item-desc h2 .linkRoom{position:absolute; top:0; right:0; padding:0; margin:0 0 0 10px;}
.lof-main-item-desc h2 .linkRoom a{margin:0; background:#ffe20f;color:#000; padding:2px 5px 3px; font-size:13px;text-transform:uppercase; text-decoration:none }
.lof-main-item-desc h2 .linkRoom a:hover{text-decoration:underline; }

.lof-main-item-desc02{z-index:100; position:absolute; top:150px; left:20%; width:40%; }
.lof-main-item-desc02 h5 {font-size:40px;color:#fff;font-weight:100;width:470px;padding-left:15px;line-height:50px;background-color:rgba(21,171,166,0.5);-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#7f15aba6, endColorstr=#7f15aba6)";}
.lof-main-item-desc02 h5 span.eng{font-size:17px;font-family:Arial;}
.lof-main-item-desc02 h5 span.txt{font-size:20px;}


ul.lof-main-wapper{ width:100%;overflow:hidden; background:transparent url(/Class/css/slide/load-indicator.gif) no-repeat scroll 50% 50%; padding:0px; margin:0; position:absolute; overflow:hidden; }
ul.lof-main-wapper li{ overflow:hidden;padding:0px; margin:0px; float:left; position:relative; }
.lof-opacity  li{ position:absolute; top:0; left:0; float:inherit; }
ul.lof-main-wapper li img{ width:100%;}

.lof-navigator-wapper { position:absolute; top:150px; right:50px; background:url(/Class/css/slide/transparent_bg.png) repeat; padding:5px 0px; }
.lof-navigator-outer{ position:relative; z-index:100; height:180px; width:310px; overflow:hidden; color:#FFF; float:left; }
ul.lof-navigator{ top:0; padding:0; margin:0; position:absolute; width:100%; }
ul.lof-navigator li{ cursor:hand; cursor:pointer; list-style:none; padding:0; margin-left:0px; overflow:hidden; float:left; display:block;text-align:center;}
ul.lof-navigator li img{width:100%;height:100%;opacity:0.8;border:none;box-sizing:border-box;-o-box-sizing:border-box;-webkit-box-sizing:border-box;-ms-box-sizing:border-box;}
ul.lof-navigator li.active img, ul.lof-navigator li:hover img { opacity:1;border:5px solid #fff;}
.lof-navigator-wapper .lof-next,  .lof-navigator-wapper .lof-previous{ display:block; width:22px; height:30px; color:#FFF; cursor:pointer;}
.lof-navigator-wapper .lof-next { float:left;	text-indent:-999px; margin-right:5px; background:url(/Class/css/slide/arrow-l.png) no-repeat right center; }
.lof-navigator-wapper .lof-previous { float:left;	text-indent:-999px; margin-left:5px; background:url(/Class/css/slide/arrow-r.png) no-repeat left center; }
.lof-main-item-desc .open{display:inline-block;background:url(/image/linkNew.png) no-repeat right 3px;padding-right:15px;}


	.roomTitle {position:absolute;top:300px;left:0;width:100%;}
	.roomTitle div.inner{margin:0 auto;width:400px;}
	.roomTitle div.inner h5 {font-size:30px;color:#fff;width:400px;padding-left:15px;height:55px;line-height:55px;text-align:center;}
	.roomTitle div.inner h5 span.eng{font-size:17px;font-family:'Rufina', serif;}

/* 
---------------------------------------------------------------------------------------------------------------------------------------------------------------
                                                               관광지
---------------------------------------------------------------------------------------------------------------------------------------------------------------
*/

/* 관광지 스크롤안내 */
	#noticePop1 .popupBox {position:relative;}

	.noticePop {position:fixed; top:0; left:0; width:100%; height:100%; background:url(/image/overlay.png) repeat; text-align:center; }
	.noticePop_in {position:relative; width:200px; height:200px; margin:300px auto 0; padding:20px; }
	.closePop { position:absolute; right:20px; top:20px;}
	.todayClose { position:absolute; right:20px; bottom:30px;font-size:13px;font-weight:bold;color:#fff;}
	label { cursor:pointer }
	input { vertical-align:middle }

/* 관광지 슬라이드*/

.tf_bg{width:100%; height:100%; position:fixed; top:0px; left:0px; }
.tf_bg img{ position:absolute; top:0px; left:0px; width:100%; /*height:1650px; /* windowheight plus negative value of top */ z-index: 1; display:none; }
.tf_pattern{ position:absolute; width:100%; height:100%; z-index:2; }
.tf_content{ position:absolute; bottom:80px; left:50px; z-index:10; display:none; padding:30px; width:500px; background:url(/image/overlay.png) repeat;
	text-shadow:2px 2px 1px #000;
	-moz-box-shadow:1px 1px 5px #202020;
	-webkit-box-shadow:1px 1px 5px #202020;
	box-shadow:1px 1px 5px #202020;

}
.tf_content h2{ color:#fff;font-size:34px; padding:0 0  15px 0; margin:0; text-shadow:1px 1px 2px #000;}
.tf_content p{ color:#fff; padding:0; margin-bottom:20px; font-size:14px; line-height:25px; }
.tf_content ul li{ color:#fff; padding:0; margin:0; font-size:14px; line-height:25px; }
.tf_content ul li a{color:#73a3eb;text-decoration:underline;font-weight:bold;font-family:'Rufina', serif;}

.tf_thumbs{ position:absolute;	z-index:12; right:50px; top:50%; margin-top:-79px; border:4px solid #fff;
	-moz-box-shadow:1px 1px 5px #202020;
	-webkit-box-shadow:1px 1px 5px #202020;
	box-shadow:1px 1px 5px #202020;	
	-webkit-box-reflect:below 5px
		-webkit-gradient(
			linear,
			left top,
			left bottom,
			from(transparent),
			color-stop(0.6, transparent),
			to(rgb(18, 18, 18))
		);
}

.tf_thumbs img{ display:block; }
.tf_loading{ position:fixed; top:50%; left:50%; margin:-30px 0px 0px -30px; width:60px; height:60px; background:#fff url(/Class/css/slide/loader.gif) no-repeat center center; z-index:999; opacity:0.7; }
.tf_next, .tf_prev{ width:35px; height:14px; position:absolute; top:50%; right:320px; z-index:100; cursor:pointer; background:transparent url(/Class/css/slide/nav.png) no-repeat top left;}
.tf_next{ background-position:0px -14px; margin-top:80px; }
.tf_prev{ background-position:0px 0px; margin-top:-55px; }
.tf_zoom, .tf_fullscreen{ width:20px; height:20px; position:absolute; top:6px; right:6px; cursor:pointer; z-index:100; opacity:0.6; background:transparent url(/Class/css/slide/icons.png) no-repeat top left; }
.tf_zoom{ background-position:0px -20px; }
.tf_fullscreen{ background-position:0px 0px; }
.tf_zoom:hover, .tf_fullscreen:hover{ opacity:0.9; }
.reference{ position:fixed; bottom:0px; right:0px; background:#000; height:23px; text-align:right; width:100%; text-shadow:1px 1px 1px #000; z-index:999; opacity:0.8; }
.description{ position:fixed; top:5px; right:5px; text-shadow:1px 1px 1px #000; z-index:999; }
.reference a, .description span{ color:#fff; text-transform: uppercase; margin-left:20px; text-decoration:none; font-family:Arial; font-size:10px; }
a.last{ float:left; line-height:23px; }
.reference a:hover{ text-shadow:0px 0px 1px #fff; }


/* 
---------------------------------------------------------------------------------------------------------------------------------------------------------------
                                                                  게시판 디자인
---------------------------------------------------------------------------------------------------------------------------------------------------------------
*/
.naveSide {position:relative;height:20px;margin-bottom:10px;z-index:100;}

/*마이메뉴*/
.htb {position: absolute; right:10px;top:0;font-weight:bold;z-index:300;}
.htb div.top_b {display:block; position:relative;padding:0 10px;font-weight:bold;height:35px;}
.htb div.top_b a{color:#444;}
.htb div.top_b span{color:#444;}
.htb div.top_b a.top_link {display:block; font-size:13px;padding:0; cursor:pointer;color:#555;}
.htb div.top_b a.top_link span { display:block;height:35px;white-space:pre;}
.htb a:hover {visibility:visible;}
.htb li:hover {position:relative; }

.htb div.top_sub,
.htb div.top_sub div.tit ul{position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none;}
.htb :hover div.top_sub {left:0px; top:30px; z-index:310;padding:3px 0 10px;width:150px; height:auto;box-shadow: 0 1px 5px #999;-webkit-border-radius:3px;-moz-border-radius: 3px;border-radius:3px;background-color:#fff;}
.htb :hover div.top_sub div.tit {position:relative; text-align:left;padding:0;}
.htb :hover div.top_sub h5{display:block;font-size:13px; height:25px; width:150px; line-height:25px; text-indent: 5px; color: #ee433e;padding-bottom:5px;font-weight:bold;border-bottom:1px solid #ddd;}
/* sub */
.htb :hover div.top_sub div.tit {width:150px;text-indent: 15px;padding-top:3px;}
.htb :hover div.top_sub div.tit span {display:block;width:200px;height:30px;font-size:13px;line-height:25px;text-indent: 15px;}
.htb :hover div.top_sub div.tit span:hover {font-weight:bold;}
.htb :hover div.top_sub div.tit:hover span {font-weight:bold;}