@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: auto;
  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:#292929;
	background:#ffffff;
}

#container{
	width: 100%;
}

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

.header-bg { background:url(img/header.png) center 0 no-repeat; height:520px; }

.main-title { max-width:960px; margin:0 auto;  }
.main-title img { margin-left: 10px; max-width: 527px; padding-top: 20px; }

/*版頭導覽按鈕*/

.navi { max-width: 960px; margin:0 auto; text-align: center;}
.navi li { display: inline-block ; height: 73px; text-indent: -3000px;}
.navi li a { display: block; outline: none; width: 100%; height: 100%;}
.navi li#b1 { background: url(img/nav.png) 0 0 no-repeat; width:131px; }
.navi li#b1 a:hover,.navi li#b1 a.active { background: url(img/nav.png) 0 -73px no-repeat;  }

.navi li#b2 { background: url(img/nav.png) -131px 0  no-repeat; width:138px; }
.navi li#b2 a:hover,.navi li#b2 a.active { background: url(img/nav.png) -131px -73px no-repeat;  }

.navi li#b3 { background: url(img/nav.png) -269px 0  no-repeat; width:136px; }
.navi li#b3 a:hover,.navi li#b3 a.active { background: url(img/nav.png) -269px -73px no-repeat;  }

.navi li#b4 { background: url(img/nav.png) -405px 0  no-repeat; width:137px; }
.navi li#b4 a:hover,.navi li#b4 a.active { background: url(img/nav.png) -405px -73px no-repeat;  }

.navi li#b5 { background: url(img/nav.png) -542px 0  no-repeat; width:133px; }
.navi li#b5 a:hover,.navi li#b5 a.active { background: url(img/nav.png) -542px -73px no-repeat;  }

.navi li#b6 { background: url(img/nav.png) -675px 0  no-repeat; width:142px; }
.navi li#b6 a:hover,.navi li#b6 a.active { background: url(img/nav.png) -675px -76px no-repeat;  }

.navi480 { max-width: 480px; margin:0 auto;  display: none;}
.navi480 li { display: inline-block ; height: 73px; text-indent: -3000px;}
.navi480 li#b1 { background: url(img/nav.png) 0 -73px no-repeat;  width:131px; }

.navi480 li#b2 { background: url(img/nav.png) -131px -73px no-repeat; width:138px; }

.navi480 li#b3 {  background: url(img/nav.png) -269px -73px no-repeat;  width:136px; }

.navi480 li#b4 { background: url(img/nav.png) -405px -73px no-repeat; width:137px; }

.navi480 li#b5 {background: url(img/nav.png) -542px -73px no-repeat;  width:133px; }

/*主頁內容*/
#main {
	max-width: 960px;
	background: url(img/main-bg.jpg) 0 0 no-repeat;
	margin:0 auto;	
}

.main-container {
	max-width: 900px;
	margin:0 auto;
	overflow: hidden;
	min-height: 796px;
}

.info { font-size: 14px; font-family: "黑體","微軟正黑體"; font-weight: bold; padding:25px 15px;}
.left { float:left; }
.right { float:right; }
.col01 { width:62%;}
.col02 { width:38%;}
.col03 { width:98%; margin: 0 auto; clear: both;}
.col04 { width:48%;}


.main-container .box01 { padding:15px; }
.main-container .box01-1 { padding:0 15px; }
.main-container .box01-1 img { max-width: 240px; }
.main-container .box02 { float: left; width:45%; padding:15px; }
.main-container .box03 { float: left; width:45%;  }
.main-container .box04 { padding:15px; }
.main-container .box05 { padding-left: 50px; }
.main-container .box05 img { max-width: 279px;  }
.main-container .box06 { float: left; width:52%; padding:15px 15px 0px 15px; }
.main-container .box07 { float: left; width:42%; padding:30px 0 0 0; }
.main-container .box08 { float: left; width:46%; padding:15px; }
.main-container .box09 { float: left; width:46%; padding:70px 0 0 0; }
.main-container .box10 {float: right;}
.main-container .box10 img { max-width: 235px;  }


/*行程*/
#main02 {
	max-width: 960px;
	margin:0 auto;
	margin-top: -30px;
	}
#pre-tour{ max-width: 960px;  }
.tour-title {  margin-top: 120px; }
.tour-title img { max-width: 256px;  }
.tour-info { margin-left: 260px; margin-top: -120px;  font-size: 28px; font-family: "黑體","微軟正黑體"; font-weight: bold; 
	color:#fcff00; background:#6dbe0d; padding:10px; line-height: 30px; /*min-height: 100px; */
}
.tour-info span { font-size: 14px; font-family: "黑體","微軟正黑體"; font-weight: bold; color:#ffffff;line-height: 14px; }

/*行程*/

#tour {
	max-width: 960px;
	margin: 0 auto;
	background: #6dbe0d;
	border:12px solid #6dbe0d;
	border-width: 12px 0 12px 0;
}

.tour-in { 
	max-width: 936px;
	margin: 0 auto;
	background:#ffffff; 
}
#tour .box {
	width: 47%;
	float: left;
	padding: 0 10px 0 10px;
	margin: 40px 0 10px 0;
	font-size: 12px;
	color: #393939;
	min-height: 250px;

}
#tour .box:first-child  { border-right: 2px dashed  #e1e0e0;  }

h4 {
	font-size:15px;
	color: #069b9d;
	padding:0 0 0 10px;
}

#tour .box ul {
	margin: 10px 10px 10px 10px;
	padding: 0;
		z-index: 800;
}

#tour .box li {
	font-size: 12px;
	line-height: 28px;
	color: #333333;
	margin: 0 5px 5px 10px;
	padding: 0;
	border-bottom:#999999 1px dashed;
}

#tour .box li a:link, #tour .box li a:visited {
	font-size: 15px;
	color: #1c812a;
	text-decoration:none
}

#tour .box li a:hover, #tour .box li a:active {
	font-size: 15px;
	color: #1c812a;
	text-decoration:underline
}

#tour .box li span.price { float:right; color:#F60; font-size: 15px;}

#tour .box li em { color:#F60; font-size: 12px; font-style:normal;}

#more {
	clear: both;
	max-width: 960px;
	margin: 0 auto;
	padding: 15px 30px 30px 0;
	background: #6dbe0d;
	color: #ffffff;
	text-align: right;
}
#more a:link, #more a:visited {
	color:#fff;
	text-decoration:underline;
}
#more a:hover, #more a:active { color:#fff; text-decoration:none}

/*------media query----------*/


/*---平板-----*/
@media only screen and (max-width:769px) {
	#tour .box { width: 95%; float:none; 	margin: 20px 0 10px 0; min-height: 0px; }
	#tour .box:first-child  { border-right:none;  }
	.navi { display: none;}
	.navi480 { display:block;}
	.header-bg { height:480px; }
	#main {	background:none;}
	.main-container .box06 { float: none; width:95%; }
	.main-container .box07 { float: none; width:95%;padding:15px;  }
	.main-container .box08 { float: none; width:95%; }
	.main-container .box09 { float: none; width:95%;padding:15px;  }
	.box10 { display: none;}
	.main-container {min-height:auto;}
}

@media only screen and (max-width:611px) {
	.tour-info { margin-left: 0px; margin-top: 0px; }
	.left { float: none;}
	.right { float: none;}
	.col01,.col02,.col03,.col04 { width:98%;}
	.box05 { display: none;}
	.tour-title {  margin-top: 10px; }
}

/*---手機版-----*/
@media only screen and  (max-width:481px) {
	.main-container .box02 { float: none; width:95%; }
	.main-container .box03 {float: none; width:95%; padding:15px;  }
	.main-container .box03 img {max-width: 260px;  }
	.main-title img { padding-top:50px; }
	.navi480 { text-align: center;}

}