@charset "utf-8";
/* CSS Document */



/*--------------------------------------reset �˅^�KՈ�����*/
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, 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,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font: inherit;
	font-family: Helvetica, Arial, sans-serif;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	background-color: #333024;
	width:100%;
	height:100%;
	}
ol, ul {list-style: none;}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
hr {
	margin: 0;
	padding: 0;
	clear: both;
	visibility:hidden;
}

img {width: 100%;}

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

body{
	}
	

h1, h2, h3 {display: none;}
	


.head_hide_xs {display:block;}
.head_hide_sm {display:none;}




.wrap{
	
}

.head{
	display:block;
}


#web-outer{
	width: 100%;
	clear: both;
	overflow: hidden;	
	background-color: #000;	
	padding: 180px 0 0 0;
	font-family:微軟正黑體;
}

/*按鈕列*/

#header{
	/*background: url(../img/header_bg.png) repeat-x;
	height: 224px;
	width: 100%;
	clear: both;
	overflow: hidden;*/
	width:100%;
		position: relative;	
		margin:0 auto;	
	
}



#header .dubai{margin: 40px auto 10px auto; max-width: 175px;}
.nav {
	width: 100%;
	height: 224px;
	margin: 0 auto;	
	display:block;
	background: url(../img/header_bg.png) repeat-x;
}
.nav ul.lottenav {
	width: 960px;
	height: 96px;
	margin: 0 auto;
	/*background: url(../img/nav.png) 0 0 no-repeat;*/
}

.nav li {
	float: left;	
}
.nav li div {
	text-indent: -5000px;
	height: 96px;	
}
.nav li a {
	width: 100%;
	height: 100%;
	display: block;
	cursor: pointer;
	z-index:180;
}
.nav li a .nav01 {width: 84px; margin-left: 75px;background: url(../img/nav.png) -75px 0 no-repeat;}
.nav li a .nav01on {width: 84px; background: url(../img/nav.png) -75px -96px no-repeat;}
.nav li a .nav01:hover, .nav li.on a .nav01 {background: url(../img/nav.png) -75px -96px no-repeat;}

.nav li a .nav02 {width: 84px;margin-left: 25px;background: url(../img/nav.png) -182px 0 no-repeat;}
.nav li a .nav02on {width: 84px; background: url(../img/nav.png) -182px -96px no-repeat;}
.nav li a .nav02:hover, .nav li.on a .nav02{background: url(../img/nav.png) -182px -96px no-repeat;}

.nav li a .nav03 {width: 84px;margin-left: 25px;background: url(../img/nav.png) -289px 0 no-repeat;}
.nav li a .nav03on {width: 84px; background: url(../img/nav.png) -289px -96px no-repeat;}
.nav li a .nav03:hover, .nav li.on a .nav03{background: url(../img/nav.png) -289px -96px no-repeat;}

.nav li a .nav04 {width: 84px;margin-left: 25px;background: url(../img/nav.png) -396px 0 no-repeat;}
.nav li a .nav04on {width: 84px; background: url(../img/nav.png) -396px -96px no-repeat;}
.nav li a .nav04:hover, .nav li.on a .nav04{background: url(../img/nav.png) -396px -96px no-repeat;}

.nav li a .nav05 {width: 84px;margin-left: 25px;background: url(../img/nav.png) -503px 0 no-repeat;}
.nav li a .nav05on {width: 84px; background: url(../img/nav.png) -503px -96px no-repeat;}
.nav li a .nav05:hover, .nav li.on a .nav05{background: url(../img/nav.png) -503px -96px no-repeat;}

.nav li a .nav06 {width: 84px;margin-left: 25px;background: url(../img/nav.png) -610px 0 no-repeat;}
.nav li a .nav06on {width: 84px; background: url(../img/nav.png) -610px -96px no-repeat;}
.nav li a .nav06:hover, .nav li.on a .nav06{background: url(../img/nav.png) -610px -96px no-repeat;}

.nav li a .nav07 {width: 84px;margin-left: 25px;background: url(../img/nav.png) -717px 0 no-repeat;}
.nav li a .nav07on {width: 84px; background: url(../img/nav.png) -717px -96px no-repeat;}
.nav li a .nav07:hover, .nav li.on a .nav07{background: url(../img/nav.png) -717px -96px no-repeat;}

.nav li a .nav08 {width: 84px;margin-left: 25px;background: url(../img/nav.png) -823px 0 no-repeat;}
.nav li a .nav08on {width: 84px; background: url(../img/nav.png) -823px -96px no-repeat;}
.nav li a .nav08:hover, .nav li.on a .nav08{background: url(../img/nav.png) -823px -96px no-repeat;}

/*錨點*/
.anchor{margin: 0 0 0 0;
padding: 0 0 0 0;}

#dubai-top{display: none;}


/*------------------------------*/
#home{
  padding: 0;
  overflow: hidden;
  position:relative;
z-index: 90;
}

#main-carousel .carousel-inner .item {
	/*background-size:auto;*/
	width: 100%;
	height: 600px;
	background-position: 50% 0;
	background-repeat:no-repeat;
}

#main-carousel .carousel-indicators { 
	top:550px;
	z-index: 99;
}

#main-carousel .carousel-indicators li{
	/*background: rgba(0, 0, 0, 0);
	border: 1px solid #fff;*/
	background-color: #f1f1f1;
	width: 13px;
	height: 13px;
	margin-left: 5px;
	text-indent: -9999px;
	display: inline-block;
}

.carousel-indicators .active{
	background-color: #04b6d1 !important;
	
}

.slider-content {
/*height: 100%;*/
}

#main-carousel .carousel-caption {
	/*display: table;*/
}

#main-carousel .carousel-caption > div{
 /*   vertical-align: baseline;
    display: table-cell;*/
	height: 579px;
	width: 960px;
	z-index: 11;
	margin: 0 auto;
	position: relative;
}


.logo { width: 100%; z-index: 999; text-align: center; left:0px; top:180px;position:absolute; z-index: 10;}
.logo img {max-width: 543px;}

.tour-top{width: 100%; z-index: 10;background:url(../img/tour-top.png) no-repeat;position:absolute;margin: -70px auto;height: 70px;}



#main-carousel .carousel-left{
	left:-50px;
}

#main-carousel .carousel-right{
	right:-50px;
}

#main-carousel:hover .carousel-left{
	left:0px;
	-webkit-transition: 300ms;
	-moz-transition: 300ms;
	-o-transition: 300ms;
	transition: 300ms;
}

#main-carousel:hover .carousel-right{
	right:0px;
	-webkit-transition: 300ms;
	-moz-transition: 300ms;
	-o-transition: 300ms;
	transition: 300ms;
}

#main-carousel .carousel-left,
#main-carousel .carousel-right{
	padding: 15px;
	z-index: 999;
	font-size: 60px;
	color: rgba(41, 201, 220, 0.5);
	top: 50%;
	position: absolute;
	margin-top: -60px;
	text-align: center;
	-webkit-transition: 300ms;
	-moz-transition: 300ms;
	-o-transition: 300ms;
	transition: 300ms;
}

.carousel-right {
  right:65px
}

.carousel-left {
  left:65px
}


#main-carousel .carousel-left:hover,
#main-carousel .carousel-right:hover{
	color:#fff;
}


/*推薦行程*/

#tour-main{
	width: 100%;	
	/*background-color: #8b3abe;
	background: #8b3abe url(../img/tour_bg.jpg) bottom no-repeat;*/
}

.tour-box{	
	background-color: #8b3abe;
	background: #0a122f url(../img/tour_bg.jpg) bottom no-repeat;
	padding: 100px 0 0 0;
			
}

.tour-dubai{
	background: url(../img/tour_dubai.png) bottom right no-repeat;
}

.tourbox {	
	max-width:650px;
	margin: 0 0 0 100px;
	padding:0 0 100px 0;
	/*background: rgba(100%,100%,100%,0.8);*/	
	
}

.tourbox p.tour-title{
	max-width:650px;
	margin: 10px 0 10px 0;
	/*text-indent: -3000px;*/
	
}

.tourbox p.toptxt{
	display: inline;
	background-color: #2cc4db;
	color: #0a122f;
	font-size: 16px;
	line-height: 25px;
	margin: 10px 0 10px 0;
	font-weight: bold;
	padding: 5px;
		
}

.tour_list_box ul {
	margin:0;
	padding: 0;	
}
	
.tour_list_box li{
	font-size: 15px;
	line-height:25px;
	color:#fff;	
	border-bottom:1px dashed #fff;
	margin-bottom: 12px;	
}

.tour_list_box li em  { color:#dbeb2e; font-style:normal; font-size:13px; padding-left:5px;}
.tour_list_box li strong { color:#ffea00; font-weight: normal; font-size:13px;}
.tour_list_box .price{	
	font-size:15px;	
	color:#ffea00;		
	/*font-weight: bold;*/
	float: right;
}

.tour_list_box .price strong{	
	font-size:22px;	
	color:#ffea00;		
	font-weight: bold;
}

.tour_list_box li.more{
	text-align: right;
	border-bottom:inherit;
}

.tour_list_box li a{	
	color:#fff;
	text-decoration:none;
	display:block;
	overflow:hidden;
	padding: 3px 5px;	
}
.tour_list_box li a:hover{	
	background-color:#13266a;
	z-index: 1;
}

/*影音*/
#video{width: 100%;}
.video-box{
	background: url(../img/video_bg.jpg) top no-repeat;
	height: 818px;
	padding: 150px 0 0 0;
}

.topbox{
	margin: 0 auto;
	background: rgba(20%,20%,60%,0.7);	
	max-width: 880px;	
	padding: 1%;
	font-size: 15px;
	line-height: 25px;
	font-family: Verdana, "微軟正黑體";
	color: #fff;
	clear: both;
	overflow: hidden;
}

#video .txtbox{	
	float: left;
	max-width: 400px;
}
#video p.txt-title{max-width: 400px;display: block;}
#video p.txt{	color: #8bdffb;	font-size: 18px;font-family: Verdana, "微軟正黑體";padding: 5px 0;}

#video .ph{float: left;width: 430px;margin: 0 0 0 1%;}




/*哈里發塔 */
#khalifa{width: 100%;}

.khalifa-box{
	background: url(../img/khalifa_bg.jpg) top no-repeat;
	height: 818px;	
}

#khalifa .txtbox{
	position: absolute;
	top:150px;
	left: 200px;
	background: rgba(20%,20%,60%,0.7);
	max-width: 440px;	
	padding: 2%;
	font-size: 15px;
	line-height: 25px;
	font-family: Verdana, "微軟正黑體";
	color: #fff;
}
#khalifa p.txt-title{max-width: 400px;display: block;}
#khalifa p.txt{	color: #8bdffb;	font-size: 18px;font-family: Verdana, "微軟正黑體";padding: 5px 0;}

#khalifa .ph{display: none;}

/*七星帆船酒店 */
#alArab{width: 100%;}

.alArab-box{
	background: url(../img/alArab_bg.jpg) top no-repeat;
	height: 800px;
	
}

#alArab .txtbox{
	position: absolute;
	top:150px;
	left: 400px;
	background: rgba(80%,20%,50%,0.7);
	max-width:440px;	
	padding: 2%;
	font-size: 15px;
	line-height: 25px;
	font-family: Verdana, "微軟正黑體";
	color: #fff;
}
#alArab p.txt-title{max-width: 400px;}
#alArab p.txt{color: #ffa0d1;	font-size: 18px;font-family: Verdana, "微軟正黑體";padding: 5px 0;}
#alArab .ph{display: none;}

/*杜拜噴泉  */
#fountain{width: 100%;}

.fountain-box{
	background: url(../img/fountain_bg.jpg) top no-repeat;
	height: 800px;	
}

#fountain .txtbox{position: absolute;
	top:150px;
	left: 100px;
	background: rgba(30%,20%,60%,0.7);
	max-width:440px;	
	padding: 2%;
	font-size: 15px;
	line-height: 25px;
	font-family: Verdana, "微軟正黑體";
	color: #fff;
}
#fountain p.txt-title{max-width: 400px;}
#fountain p.txt{color: #fee515;	font-size: 18px;font-family: Verdana, "微軟正黑體";padding: 5px 0;}
#fountain .ph{display: none;}

/*朱美拉棕櫚島 */
#island{
	width: 100%;
}

.island-box{
	background: url(../img/island_bg.jpg) top no-repeat;
	height: 800px;
	
}

#island .txtbox{position: absolute;
	top:130px;
	left: 450px;
	background: rgba(0%,40%,50%,0.7);
	max-width:440px;	
	padding: 2%;
	font-size: 15px;
	line-height: 25px;
	font-family: Verdana, "微軟正黑體";
	color: #fff;
}
#island p.txt-title{max-width: 400px;}
#island p.txt{	color: #46ffd6;	font-size: 18px;font-family: Verdana, "微軟正黑體";padding: 5px 0;}
#island .ph{display: none;}

/*杜拜之框*/
#dubaiframe{width: 100%;}

.dubaiframe-box{
	background: url(../img/dubaiframe_bg.jpg) top no-repeat;
	height: 800px;
	
}

#dubaiframe .txtbox{
	position: absolute;
	top:300px;
	left: 250px;
	background: rgba(10%,50%,80%,0.7);
	max-width:440px;	
	padding: 2%;
	font-size: 15px;
	line-height: 25px;
	font-family: Verdana, "微軟正黑體";
	color: #fff;
}
#dubaiframe p.txt-title{max-width: 400px;}
#dubaiframe p.txt{	color: #00eaff;	font-size: 18px;font-family: Verdana, "微軟正黑體";padding: 5px 0;}
#dubaiframe .ph{display: none;}

/*沙漠獵遊*/
#safari{width: 100%;}

.safari-box{
	background: url(../img/safari_bg.jpg) top no-repeat;
	height: 800px;	
}

#safari .txtbox{
	position: absolute;
	top:130px;
	left: 100px;
	background: rgba(70%,40%,0%,0.7);
	max-width:440px;	
	padding: 2%;
	font-size: 15px;
	line-height: 25px;
	font-family: Verdana, "微軟正黑體";
	color: #fff;
}
#safari p.txt-title{max-width: 400px;}
#safari p.txt{	color: #ffcf9d;	font-size: 18px;font-family: Verdana, "微軟正黑體";padding: 5px 0;}
#safari .ph{display: none;}

/*傳統水上計程車 */
#abra{	width: 100%;}

.abra-box{	background: url(../img/abra_bg.jpg) top no-repeat;
	height: 800px;	
}

#abra .txtbox{
	position: absolute;
	top:200px;
	left: 470px;
	background: rgba(0%,50%,50%,0.7);
	max-width:440px;	
	padding: 2%;
	font-size: 15px;
	line-height: 25px;
	font-family: Verdana, "微軟正黑體";
	color: #fff;
}
#abra p.txt-title{max-width: 400px;}
#abra p.txt{color: #e0e557;	font-size: 18px;font-family: Verdana, "微軟正黑體";padding: 5px 0;}
#abra .ph{display: none;}

.main{max-width: 960px;margin: 0 auto;position: relative;}

.container {	
	margin:0 auto;
	}




@media screen and (max-width:959px)  {
	
	.tour-dubai{background: inherit;}	
	
	/*選單*/
.nav ul.lottenav{width: 100%;}
.nav li a .nav01 {margin-left: 20px;}
.nav li a .nav02,.nav li a .nav03,.nav li a .nav04,.nav li a .nav05,.nav li a .nav06,.nav li a .nav07,.nav li a .nav08 {margin-left: 20px;}

#khalifa .txtbox,#alArab .txtbox,#fountain .txtbox,#island .txtbox,#dubaiframe .txtbox,#safari .txtbox,#abra .txtbox{top:130px;right: 5%;left: inherit;}
.main{}
	
.video-box{		
}	
	
.topbox{	
	max-width: inherit;
	width: 95%;
}		
#video .txtbox{	
	width: 40%;
}

#video .ph{float: right; width: 55%;}
}


@media only screen and (min-width: 769px) and (max-width:850px) {
.nav li a .nav01 {margin-left: 20px;}
.nav li a .nav02,.nav li a .nav03,.nav li a .nav04,.nav li a .nav05,.nav li a .nav06,.nav li a .nav07,.nav li a .nav08 {margin-left: 8px;}
	}

/*---平板-----*/

@media screen and (max-width:768px){
	
		
	#web-outer{padding: 0;}
	#nav{display: none;}	
	
	#dubai-top{display: block;width: 100%;}
	
	#home{display: none;}
	.tour-box{
	padding: 0 0 50px 0;
}

.tourbox {
	max-width: inherit;
	width: 100%;
	margin:0 auto;
	padding:20px;	
	
}
	
	.tourbox p.tour-title{
	max-width: inherit;
	width: 100%;
	margin: 30px 0 0 0;
}
			
	.khalifa-box,.alArab-box,.fountain-box,.island-box,.dubaiframe-box,.safari-box,.abra-box{background:inherit;height: inherit;}
	
	#khalifa .txtbox,#alArab .txtbox,#fountain .txtbox,#island .txtbox,#dubaiframe .txtbox,#safari .txtbox,#abra .txtbox{position:inherit; max-width: inherit; width: 95%;padding: 10px;margin:20px auto 10px auto;}
	.main{position: inherit;}
	
	#khalifa .ph,#alArab .ph,#fountain .ph,#island .ph,#dubaiframe .ph,#safari .ph,#abra .ph{display: block;max-width: 780px;margin: 10px 0 0 0;}	

	
	.video-box{ height: inherit; padding: inherit;margin:20px auto 10px auto; background:inherit;}	
	
.topbox{	
	max-width: inherit;
	width: 95%;
}		
#video .txtbox{
	float: inherit;
	max-width: inherit;
	width: 100%;
}

#video .ph{float: inherit; margin: 2% auto 0 auto;width: 98%;}
	
}


/*---手機-----*/
@media screen and (max-width:479px)  {
	
	.khalifa-box,.alArab-box,.fountain-box,.island-box,.dubaiframe-box,.safari-box,.abra-box{background:inherit;height: inherit;}
	#khalifa .txtbox,#alArab .txtbox,#fountain .txtbox,#island .txtbox,#dubaiframe .txtbox,#safari .txtbox,#abra .txtbox{position:inherit;}
	.main{position: inherit;}
}