@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;
	font-family:微軟正黑體;
}
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;}

.clearfix {
  overflow: hidden;
  zoom: 1;
}

img { width:100%;}

/************************************************************************************
STRUCTURE 主要區塊
*************************************************************************************/

body {
	font-family:"微軟正黑體","黑體", Arial, Helvetica, sans-serif;
	background-color: #18a8eb;
}

h1,h2,h3 { display:none; }

#web-outer{	
	clear: both;
	overflow: hidden;
	background: url("../img/header-bg.png")top center no-repeat;
}

.header-bg { width: 100%;margin:0 auto; }
.header{max-width: 960px;min-height: 634px;margin: 0 auto;clear: both;overflow: hidden;}

.head-top {position:relative;height: 454px;clear: both;overflow: hidden;}
.head-top .new_star{max-width: 850px;position: absolute; top:50px;left: 55px;}
.head-top .ig_icon{max-width: 87px;position: absolute;top:100px;left: 350px;}
.head-top .fb_icon{max-width: 81px;position: absolute;top:120px;left: 620px;}

.head-top02{display: none;}

/*---步驟說明---*/
.step{max-width: 900px;display:block;margin: 20px auto 10px auto;}
.step_box{max-width: 180px;margin:0;float: left;}

.step02{display: none;}

#tab1,#tab2{clear: both;overflow: hidden;}

.container{max-width: 960px;margin: 0 auto;padding: 30px 0 30px 0;clear: both;overflow: hidden;}

/*----行程-----*/
.product-ticket {float:left;max-width: 310px;margin: 15px 5px;font-family:"微軟正黑體","黑體", Arial, Helvetica, sans-serif; position: relative;}
.product-ticket-bg { background:#fff url("../img/tour_bg.png") bottom right no-repeat;padding: 10px; border-radius: 15px; min-height:350px;}
.product-ticket a{text-decoration: none;}
.product-pic img {width:100%;}
.product-pic .patent{display: block; color: #b9b9b9; text-align: right;font-size: 10px;height: 10px;}
.product-ticket .star{position: absolute;top:-10px;left: 15px;width: 75px;height: 75px;border-radius: 50%;background-color: #fede4a;color: #1a77e7;font-size: 20px;line-height: 75px;text-align: center;font-weight: bold;}

.product-content {width:100%;line-height:25px; padding:10px 0;}
.product-area {width:100%; height:50px;}
.txt-title {display:block; font-weight:bold; font-size:18px; width:100%; color:#2c51c7; line-height:25px; float:left;}
.txt-title2 {display:block; font-weight:bold; font-size:15px; width:100%; color:#2c51c7; line-height:25px; float:left;}
.data { color:#fff; background:#ff5a00; font-size:13px; padding:1px 8px; margin:2px 0px;}

ul.ps {color: #575757;font-size: 13px;line-height: 22px; margin: 5px 0;}


.tour-btn {
	font-family:"微軟正黑體","黑體", Arial, Helvetica, sans-serif;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.tour-btn:after {
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.tour-btn:hover {
	-webkit-transform: translateY(1%);
	-moz-transform: translateY(1%);
	-ms-transform: translateY(1%);
	transform: translateY(1%);
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}


/*錨點*/
.anchor{margin: 50px auto;}

@media screen and (max-width:959px)  {
	.header{max-width: inherit; min-height:inherit;width: 98%;margin: 0 auto;}
	.head-top{display: none;}
	.head-top02{display:block;width: 100%;margin: 0 auto;}
	.step{max-width: inherit;width: 100%;margin: 0 auto;}
	.step_box{max-width: inherit;width: 19%;}
	
	.container{max-width: inherit;width: 98%;}
	/*----行程-----*/
	.product-ticket {max-width:inherit;width:32%;}
	
}
@media screen and (min-width: 769px) and (max-width: 812px){
	/*----行程-----*/
	.product-ticket {max-width:inherit;width:48%;}
	.product-ticket-bg {min-height: 400px;}
}

/*---平板-----*/
	@media screen and (max-width:768px)  {
	#web-outer{background: inherit; background-color: #1a77e7;}	
		
	/*---步驟說明---*/
	.step{display: none;}
	.step02{display: block;width: 98%;margin: 10px auto 0 auto;clear: both;overflow: hidden;}
	.step02 .title{display: block;max-width: 550px;margin: 0 auto 5px auto;}
	.step02 .left_ph{float: left;width: 50%;margin: 0 3% 0 0;}
	.step02 .right_txt{float: left;width: 45%;}
	.step02 .right_txt ul{color: #fff;font-size: 18px;line-height: 30px; font-family:"微軟正黑體","黑體", Arial, Helvetica, sans-serif;}
	.step02 .right_txt ul li{margin: 15px 0 0 0;clear: both;overflow: hidden;}
	.step02 .right_txt ul li strong{color: #fede4a;}
	.step02 .right_txt ul li em{font-style:normal;font-size: 13px;}	
	.step02 .right_txt ul li span{width: 60px;text-align: center; font-weight: bold;border-radius: 5px;background-color: #fff;color: #1a77e7;float: left;}
	.step02 .right_txt ul li p{padding: 0 0 0 60px;margin: 0 0 0 5px;}
		
	/*----行程-----*/
	.product-ticket {max-width:inherit;width:48%;}
	.product-ticket-bg {min-height: 400px;}	
}

@media screen and (min-width: 480px) and (max-width: 568px){
	/*---步驟說明---*/
	.step02{width: 95%;}
	.step02 .left_ph{float: inherit;width: 100%;display: none;}
	.step02 .right_txt{float: inherit;width: 100%;}
	.step02 .right_txt ul{font-size: 15px;line-height: 25px;}
	.step02 .right_txt ul li{margin: 10px 0 0 0;}
	
	/*----行程-----*/
	.container{max-width: inherit;width: 100%;}
	.product-ticket {max-width:inherit;float: inherit; width:95%; margin: 15px auto;}
}



/*---手機版-----*/
@media screen and (max-width:479px)  {
	
	/*---步驟說明---*/
	.step02{width: 95%;}
	.step02 .left_ph{float: inherit;width: 100%;display: none;}
	.step02 .right_txt{float: inherit;width: 100%;}
	.step02 .right_txt ul{font-size: 15px;line-height: 25px;}
	.step02 .right_txt ul li{margin: 10px 0 0 0;}
	
	/*----行程-----*/
	.container{max-width: inherit;width: 100%;}
	.product-ticket {max-width:inherit;float: inherit; width:95%; margin: 15px auto;}	
}

/*---手機版-----*/
@media screen and (max-width:320px)  {}

