@charset "utf-8";

/* CSS Document */
/************************************************************************************
RESET
*************************************************************************************/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}
body {
    line-height: 1;	
	-webkit-text-size-adjust: none;/*防止allpe的safari瀏覽器字體變大*/
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}

/* remember to define focus styles! */
:focus {
    outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
    text-decoration: none;
}
del {
    text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
   /* border-collapse: collapse;*/
    border-spacing: 0;
}

a img {
	border: none;
}

.clean { clear:both;}

img { width:100%;}

.clearfix {
  overflow:visible;
  zoom: 1;
}

/************************************************************************************
STRUCTURE 主要區塊
*************************************************************************************/

body {
	font-family:"微軟正黑體","黑體", Arial, Helvetica, sans-serif;
}

h1,h2,h3 { display:none; }

#web-outer {
	max-width:2000px;	
	overflow: hidden;
	_overflow: none;
	line-height:2em;
	font-size:13px;
    color:#6c6c6b;
	background:url(images/bg.jpg) 0 0  repeat;
}

#container{
	width: 100%;
	background: url(images/wood-header.png) center 0 no-repeat;
}

/*----------header---------*/

#header {
   	max-width:1300px;
	overflow: hidden;
	margin: 0 auto;
	position: relative;
	height:620px;
}

.main-title {  max-width:900px; margin:0 auto;  }
.main-title img { max-width: 587px; padding-top: 55px; margin-left: 22%; }

.main-title-s {  max-width:480px; margin:0 auto; display: none;}
.main-title-s img { max-width: 449px; padding-top: 55px; margin-left: 10%; }



.nav { 
	position: relative;
    max-width:244px;
	z-index:900;
	margin-top: -30px;
	margin-left: 10%;
}

ul.nav-in {
	background:url(images/nav.png) 0 0 no-repeat;
	width:244px;
	height:439px;
	padding:42px 0 0 31px;

}

ul.nav-in li {
	text-indent:-3000px;
	overflow:hidden;	
	width:210px;
}
ul.nav-in li a {
	display: block;
	width: 100%;
	height: 100%;
	outline:none;
}
.nav-in li#n1 { height:102px; 	background:url(images/nav.png) -31px -42px no-repeat; }
.nav-in li#n1.current,.nav-in li#n1 a:hover { background:url(images/nav.png) -307px -42px no-repeat; }

.nav-in li#n2 { height:95px; 	background:url(images/nav.png) -31px -144px no-repeat; }
.nav-in li#n2.current,.nav-in li#n2 a:hover { background:url(images/nav.png) -307px -144px no-repeat; }

.nav-in li#n3 { height:98px; 	background:url(images/nav.png) -31px -239px no-repeat; }
.nav-in li#n3.current,.nav-in li#n3 a:hover { background:url(images/nav.png) -307px -239px no-repeat; }

.header-box { 	position: relative;   z-index: 800; margin-top: -500px; margin-left: 30%;   }
.header-ct1 { max-width:630px;  background: url(images/main-ct02.png) 0 0 no-repeat; min-height:502px; z-index: 810;padding: 50px 0 0 40px;}
.header-title { }
.header-title img { max-width:445px; }
.w1 { max-width: 445px;}
.header-ct2 {  z-index:820; margin-left: 400px;  margin-top: -500px;  position: relative; }
.header-ct2 img { max-width:494px; }

/*----------main-layout--------*/

#main,#main2 {
	margin:0 auto;
	max-width:1000px;
}


/*----------------*/

#tour-box {
	clear: both;
	background:url(images/tour-bg.png) 0 0 no-repeat;
	padding-bottom:50px;
	max-width: 960px;
	margin:0 auto;
	margin-bottom: 50px;
}

p.tour-pic, p.tour-pic2, p.tour-pic3 {
	max-width:158px;
	padding:130px 0 0 70px;
}

.tour-list {
	max-width:600px;
	color:#545855;
	margin:-170px 10px 0 250px;
}

.tour-list li.tour-title span {
	background:#FFFFFF;
	padding:3px 10px;
	color:#884300;
	font-size:16px;
}

.tour-list li {
	text-indent:-12px;
}
.tour-list li a { 
	font-size:17px;
	font-weight:bold;
	font-family:"微軟正黑體" ,Arial, Helvetica, sans-serif;*/
    outline:none;  
	color:#5b2e01;
	text-decoration:none;	
	display:block;
	padding:5px 0;
	margin-left:-12px;
	text-indent:0px;
}

.tour-list li a:hover {
   text-decoration:underline;
}


/*-----hotel----*/

#hotel-box { max-width: 960px; margin:0 auto; }

#hotel-ct { 
	max-width: 940px; margin:0 auto; margin: 30px 0px 30px 10px; padding: 20px 0;  
	box-shadow:5px 5px 13px #bababa; background: #FFFFFF;
	background: #ffffff; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(#ffffff, #eeecea, #fbfbfb); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#ffffff, #eeecea, #fbfbfb); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#ffffff, #eeecea, #fbfbfb); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#ffffff, #eeecea, #fbfbfb); /* Standard syntax */
}
.hotel-row { position: relative;}

.hotel-title {
	background:url(images/hotel-title.png) 0 0 no-repeat;
	height: auto;
	padding-left:50px;
	padding-top:25px;
	padding-bottom: 10px;
	position:relative;
	z-index: 700;
}

/*---------------*/
p.name1 {
	background:url(images/hotel-title.png) 0 -350px no-repeat;
	width:190px;
	height:55px;
	text-indent:-3000px;
	position: relative;
	z-index: 800;
}

p.name2 {
	background:url(images/hotel-title.png) -191px -350px no-repeat;
	width:190px;
	height:55px;
	text-indent:-3000px;
	position: relative;
	z-index: 800;
}

p.name3 {
	background:url(images/hotel-title.png) -381px -350px no-repeat;
	width:190px;
	height:55px;
	text-indent:-3000px;
	position: relative;
	z-index: 800;
}

p.name4 {
	background:url(images/hotel-title.png) -577px -350px no-repeat;
	width:190px;
	height:55px;
	text-indent:-3000px;
	position: relative;
	z-index: 800;
}
p.name5 {
	background:url(images/hotel-title.png) -761px -350px no-repeat;
	width:190px;
	height:55px;
	text-indent:-3000px;
	position: relative;
	z-index: 800;
}

ul.hotel-list {
	position:relative;
	margin-top:-50px;
	margin-left:340px;
	color:#027489;
	font-size:15px;
}

p.link { position:absolute; top:15px; left:840px; font-size:12px; }
p.link a { color:#ffffff; background:#B4740C; padding:2px 6px; text-decoration:none; outline:none; display:block; width:80px;  }
p.link a:hover {  background:#E5105F;  }

/*--------------*/

.ct01 { padding-left: 10px; max-width: 45%; position: relative;}
.ct02 { margin-left: 450px; margin-top: -200px; max-width: 48%; position: relative;}
.ct03 { padding-left: 50px; max-width:54%; position: relative;}
.ct04 { padding-left: 50px; max-width:54%; position: relative;}

.hotel01-1 {
	position:relative;
	margin-top: 20px;
	margin-left: 10px;
}

.hotel01-1 img { max-width: 419px;}

.hotel01-1-s {
	position:relative;
	margin-top: 20px;
	margin-left: 10px;
	display: none;
}

.hotel01-1-s img { max-width: 315px;}

.hotel01-2 {
	position:relative;
	margin-top: 20px;
	margin-left: 0px;
}

.hotel01-2 img { max-width: 433px;}

.hotel01-3 {
	position:relative;
	margin-top: -489px;
	margin-left: 429px;
}

.hotel01-3 img { max-width: 492px;}

.hotel01-4 {
	position:relative;
	margin-top: 15px;
	margin-left: 400px;
}

.hotel01-4 img { max-width: 526px;}

.hotel01-4-s {
	position:relative;
	margin-top: 15px;
	margin-left: 400px;
	display: none;
}

.hotel01-4-s img { max-width: 283px;}

.hotel01-5 {
	position:relative;
	margin-top: 15px;
	margin-left: 0px;
}

.hotel01-5 img { max-width: 454px;}


.hotel01-6 {
	position:relative;
	margin-top: 15px;
	margin-left: 580px;
}

.hotel01-6 img { max-width: 303px;}

.hotel01-7 {
	position:relative;
	margin-top: -70px;
	margin-left: 20px;
}

.hotel01-7 img { max-width: 516px;}

.hotel01-7-s {
	position:relative;
	margin-top: -70px;
	margin-left: 20px;
	display: none;
}

.hotel01-7-s img { max-width: 281px;}

.hotel01-8 {
	position:relative;
	margin-top: -315px;
	margin-left: 490px;
}

.hotel01-8 img { max-width: 388px;}


ul.list {
	max-width:410px;
	margin-left: 50px;
}

/*------------------*/

.hotel02-1 {
	position:relative;
	margin-top: 20px;
	margin-left: 10px;
}

.hotel02-1 img { max-width: 577px;}

.hotel02-1-s {
	position:relative;
	margin-top: 20px;
	margin-left: 10px;
	display: none;
}

.hotel02-1-s img { max-width: 407px;}

.hotel02-2 {
	position:relative;
	margin-top: 20px;
	margin-left: 20px;
}
.hotel02-2 img { max-width: 546px;}

.hotel02-3 {
	position:relative;
	margin-top: -500px;
	margin-left: 540px;
}
.hotel02-3 img { max-width: 388px;}


/*------------------*/

.hotel03-1 {
	position:relative;
	margin-top: 20px;
	margin-left: 10px;
}

.hotel03-1 img { max-width: 633px;}

.hotel03-1-s {
	position:relative;
	margin-top: 20px;
	margin-left: 10px;
	display: none;
}

.hotel03-1-s img { max-width: 468px;}

.hotel03-2 {
	position:relative;
	margin-top: 20px;
	margin-left: 20px;
}
.hotel03-2 img { max-width: 607px;}

.hotel03-3 {
	position:relative;
	margin-top: -460px;
	margin-left: 620px;
}
.hotel03-3 img { max-width: 316px;}

.hotel03-4 {
	position:relative;
	margin-top: 20px;
	margin-left: 20px;
}
.hotel03-4 img { max-width: 662px;}

.hotel03-4-s {
	position:relative;
	margin-top: 20px;
	margin-left: 20px;
	display: none;
}
.hotel03-4-s img { max-width: 435px;}

.hotel03-5 {
	position:relative;
	margin-top: 0px;
	margin-left: 80px;
}
.hotel03-5 li { float: left; margin-right: 10px;}
.hotel03-5 li img { max-width: 241px;}

/*------------------*/

.hotel04-1 {
	position:relative;
	margin-top: 20px;
	margin-left: 10px;
}

.hotel04-1 img { max-width: 533px;}

.hotel04-1-s {
	position:relative;
	margin-top: 20px;
	margin-left: 10px;
	display: none;
}

.hotel04-1-s img { max-width: 382px;}

.hotel04-2 {
	position:relative;
	margin-top: 20px;
	margin-left: 20px;
}
.hotel04-2 img { max-width: 546px;}

.hotel04-3 {
	position:relative;
	margin-top: -500px;
	margin-left: 540px;
}
.hotel04-3 img { max-width: 388px;}


/*------------------*/

.hotel05-1 {
	position:relative;
	margin-top: 20px;
	margin-left: 10px;
}

.hotel05-1 img { max-width: 631px;}

.hotel05-1-s {
	position:relative;
	margin-top: 20px;
	margin-left: 10px;
	display: none;
}

.hotel05-1-s img { max-width: 461px;}

.hotel05-2 {
	position:relative;
	margin-top: 20px;
	margin-left: 20px;
}
.hotel05-2 img { max-width: 607px;}

.hotel05-3 {
	position:relative;
	margin-top: -460px;
	margin-left: 620px;
}
.hotel05-3 img { max-width: 316px;}

.hotel05-4 {
	position:relative;
	margin-top: 20px;
	margin-left: 20px;
}
.hotel05-4 img { max-width: 662px;}

.hotel05-4-s {
	position:relative;
	margin-top: 20px;
	margin-left: 20px;
	display: none;
}
.hotel05-4-s img { max-width: 435px;}

.hotel05-5 {
	position:relative;
	margin-top: 0px;
	margin-left: 80px;
}
.hotel05-5 li { float: left; margin-right: 10px;}
.hotel05-5 li img { max-width: 241px;}

/*----------info-list-------*/

ul.info-list {
	padding:12px 0 0 180px;	
}
ul.info-list li { line-height:2.4em; font-size:16px; font-weight:800; }
span.yellow { background:#c09c0a; }
span.blue { background:#087c99; }
span.green { background:#0b8878; }
span.orange { background:#c07e07; }
span.yellow,span.blue,span.orange,span.green {
	color:#ffffff;
	padding:5px 8px;
	margin-right:8px;
	font-weight:600;
}
span.sp { color:#008173;}

.info02-1 {
	background:url(images/ct02-1.jpg) 0 0 no-repeat;
	height:229px;
	text-indent:-3000px;
}

.info02-2 {
	background:url(images/ct02-2.jpg) 0 0 no-repeat;
	height:234px;
	text-indent:-3000px;
}


/*---平板-----*/
@media only screen and (max-width:1200px) {
	.nav { margin-left: 5%;}
	.header-box { margin-left: 29%;}
}
@media only screen and (max-width:1100px) {
	.nav { margin-left: 4%;}
	.header-ct2 {  margin-top: -450px; }
}

@media only screen and (max-width:960px) {
	.nav { margin-left: 1%;}
	.header-ct2 {  display: none; }
	.header-box { margin-left: 32%;}

}
@media only screen and (max-width:900px) {
	.ct01 { max-width: 90%; }
	.ct02 { max-width: 90%; margin-left: 20px; margin-top: 0px;}
	.hotel01-3 {margin-top: -220px;margin-left: 420px;}
	.hotel01-3 img {max-width: 350px;}
	.hotel01-4,.hotel01-5 {margin-left: 0px;}
	.hotel01-6 {display: none;}
	.hotel01-8,.hotel01-7 {margin-top: 0px;margin-left: 0px;}
	ul.list {max-width:470px;	margin-left: 20px;}
	.hotel02-3 {margin-top: -410px; margin-left: 480px;}
	.hotel03-3 {margin-top: -360px; margin-left: 480px;}
	.hotel02-3 img ,.hotel03-3 img { max-width: 95%;}
	.hotel02-2 img ,.hotel03-2 img{ max-width: 420px;}
	.hotel03-5 { margin-left: 10px;}
	.hotel03-5 li img { max-width: 220px;}
	.hotel04-3 {margin-top: -410px; margin-left: 460px;}
	.hotel05-3 {margin-top: -320px; margin-left: 460px;}
	.hotel04-3 img ,.hotel05-3 img { max-width: 95%;}
	.hotel04-2 img ,.hotel05-2 img{ max-width: 430px;}
	.hotel05-5 { margin-left: 10px;}
	.hotel05-5 li img { max-width: 220px;}

}

@media only screen and (max-width:769px) {
	.main-title img {margin-left: 13%; }
	.nav { display: none; }
	.header-box { margin-top: -50px; margin-left: 10%;   }
	ul.hotel-list { margin-left:250px;}
	.ct03 { max-width: 90%; padding-left: 20px; }
	.ct04 { max-width: 90%; padding-left: 20px; }
	.hotel02-3,.hotel03-3  {display: none;}
	.hotel02-2 img ,.hotel03-2 img { max-width: 90%;}
	.hotel03-5 li img { max-width: 200px;}
	.hotel04-3,.hotel05-3  {display: none;}
	.hotel04-2 img ,.hotel05-2 img { max-width: 90%;}
	.hotel05-5 li img { max-width: 200px;}
	}


@media only screen and (max-width:669px) {
	.main-title img {margin-left: 6%; }
	.header-box { margin-top: -50px; margin-left: 3%;   }
	.hotel01-3 {margin-top: 0px;margin-left: -10px;}
	.hotel01-7 {margin-top: 0px;margin-left: 0px;}
	.hotel03-5 li img { max-width: 90%;}
	.hotel03-5 { margin-left: 15%;}
	.hotel05-5 li img { max-width: 90%;}
	.hotel05-5 { margin-left: 15%;}

}

/*---手機版-----*/
@media only screen and  (max-width:481px) {
	.header-box { display: none;}
	#header { height:auto; }
	.main-title {display:none;}
	.main-title-s {display: block;}
	.main-title-s img {margin-left: 6%; }

	p.tour-pic, p.tour-pic2, p.tour-pic3 {display: none;}
	.tour-list { margin:0px 10px 20px 40px; padding:140px 0 0 0 ;}
	#tour-box { background:url(images/tour-bg.png) -40px 0 no-repeat;}
	.hotel-title {	 padding-top:20px; background: url(images/hotel-title-s.png) 0 0 no-repeat;}
	ul.hotel-list {	margin-top:10px; margin-left:-30px;}
	.hotel01-1,.hotel01-4,.hotel01-7,.hotel02-1,.hotel03-1,.hotel03-4,.hotel04-1,.hotel05-1,.hotel05-4 { display:none;}
	.hotel01-1-s,.hotel01-4-s,.hotel01-7-s,.hotel02-1-s,.hotel03-1-s,.hotel03-4-s,.hotel04-1-s,.hotel05-1-s,.hotel05-4-s { display: block;}
	.hotel01-4-s,.hotel03-4-s,.hotel05-4-s {margin-left: 0px;}
	.hotel01-7-s {margin-top: 0px;margin-left: 0px;}


}