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

	/* Client-specific Styles */
	#outlook a {padding:0;} /* Force Outlook to provide a "view in browser" menu link. */
	body{margin:0; padding:0; font-family: Arial, "新細明體";}*/
	/* Prevent Webkit and Windows Mobile platforms from changing default font sizes, while not breaking desktop design. */
	.ExternalClass {width:100%;} /* Force Hotmail to display emails at full width */
	.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {line-height: 100%;} /* Force Hotmail to display normal line spacing.  */
	.backgroundTable {margin:0; padding:0; width:100% !important; line-height: 100% !important;}
	.devicewidth {width: 800px;}
	img {outline:none; text-decoration:none;border:none; -ms-interpolation-mode: bicubic; border:none; outline:none;}
	a img {border:none;}
	.image_fix {display:block;}
	p {margin: 0px 0px !important;}
	table td {border-collapse: collapse;}
	table { border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt; }
	a {color: #33b9ff; text-decoration:none!important;}
	/*STYLES*/
/*	table[class=full] { width: 100%; clear: both; }*/
	
	.header-note1 td {text-align: left!important;}
	.header-note2 td {text-align: right!important;}
	
	.big-banner img {width: 100%; height: auto;}

	.tour-list1 .tour-list-table td {width: auto;}
	.tour-list2 .tour-list-table td {width: auto;}
	.tour-list3 .tour-list-table td {width: auto;}
	.tour-list3 {margin-bottom: 10px;}
	.tour-list3 {float:right\9;}
	.tour-list4 {float:right\9;}
	.tour-list-title-img {width: 260px!important;}

	.button-list1 {margin-bottom: 20px;}	

	/*tablet*/
	@media only screen and (max-width: 800px) {
	a[href^="tel"], a[href^="sms"] {
	text-decoration: none;
	color: #33b9ff; /* or whatever your want */
	pointer-events: none;
	cursor: default;
	}
	.mobile_link a[href^="tel"], .mobile_link a[href^="sms"] {
	text-decoration: default;
	color: #33b9ff !important;
	pointer-events: auto;
	cursor: default;
	}
	table[class=devicewidth] {width: 98%!important;text-align:center!important; height: auto;}
	table[class=devicewidthinner] {width: 420px!important;text-align:center!important;}
	img[class=banner] {width: 100%!important;}
	img[class=colimg2] {width: 100%!important;}

	[class=devicewidth] .header-note1, .header-note2 {width: 100%!important;}
	[class=devicewidth] .header-note1 td {padding-left: 0!important; text-align: center!important;}
	[class=devicewidth] .header-note2 td {padding-right: 0!important; text-align: center!important;}

	[class=devicewidth] .logo-header, .logo-date {width: 100%!important; text-align: center!important;}
	[class=devicewidth] .logo-date {height: auto!important;}
	[class=devicewidth] .logo-header img {width: 440px; height: auto;}
	[class=devicewidth] .logo-header td {padding-left: 0!important;}
	[class=devicewidth] .logo-date td {padding-top: 10px!important; padding-right: 0;}
	

	[class=devicewidth] .recommend  {width: 100%; height: auto;}
	[class=devicewidth] .recommend img {width: 100%; height: auto;}
	
	[class=devicewidth] .recommend td p { width: 100%!important; height: auto;}
	[class=devicewidth] .hot img {width: 100%; height: auto;}
	[class=devicewidth] .hotel  {width: 45%; height: auto; }
	[class=devicewidth] .hotel img {width: 90%; height: auto;}

	[class=devicewidth] .tour-list-left {width: 100%!important;}
	[class=devicewidth] .tour-list-right {width: 100%!important;}
	[class=devicewidth] .tour-list1 {width: 50%;}
	[class=devicewidth] .tour-list2 {width: 50%;}
	[class=devicewidth] .tour-list3 {width: 50%;}
	[class=devicewidth] .tour-list4 {width: 50%;}
	[class=devicewidth] .tour-list-title {width: 100%;}
	[class=devicewidth] .tour-list-title-img {width: 100%!important; height: auto;}
/*	[class=devicewidth] .tour-list-table {width: 90%;}*/

	[class=devicewidth] .button-list-top {width: 80%;}
	[class=devicewidth] .button-list-bottom {width: 80%;}

	[class=devicewidth] .icon { text-align:center;}
	[class=devicewidth] .tel-list-right { width: 100%; }
	[class=devicewidth] .footer-logo {width: 90%;}
	}
	
	
	/*phone*/
	@media only screen and (max-width: 548px) {
	a[href^="tel"], a[href^="sms"] {
	text-decoration: none;
	color: #000000; /* or whatever your want */
	pointer-events: none;
	cursor: default;
	}
	.mobile_link a[href^="tel"], .mobile_link a[href^="sms"] {
	text-decoration: default;
	color: #000000 !important; 
	pointer-events: auto;
	cursor: default;
	}
	table[class=devicewidth] {width: 98%!important;text-align:center!important;}
	table[class=devicewidthinner] {width: 260px!important;text-align:center!important;}
	img[class=banner] {width: 100%!important;}
	img[class=colimg2] {width: 100%!important;}
	td[class="padding-top15"]{padding-top:15px!important;}

	[class=devicewidth] .logo-header img {width: 97%!important;}
	[class=devicewidth] .logo-header td {padding-bottom: 0px!important;}
	[class=devicewidth] .logo-date td {width: 98%; text-align: right;}

	[class=devicewidth] .recommend  {width: 100%; height: auto;}
	[class=devicewidth] .recommend img {width: 80%; height: auto;}
	[class=devicewidth] .recommend td p { width: 95%; height: auto;}
	[class=devicewidth] .hot {width: 100%; height: auto;}
	[class=devicewidth] .hotel {width: 97%; }
	[class=devicewidth] .hotel img {width: 97%; height: auto; }


	[class=devicewidth] .tour-list1 {width: 100%;}
	[class=devicewidth] .tour-list2 {width: 100%; margin-bottom: 10px;}
	[class=devicewidth] .tour-list3 {width: 100%; margin-bottom: 20px;}
	[class=devicewidth] .tour-list4 {width: 100%;}
	[class=devicewidth] .tour-list-title {width: 100%;}
	[class=devicewidth] .tour-list-title-img {width: 100%!important; height: auto;}

	[class=devicewidth] .button-list-top {width: 70%;}
	[class=devicewidth] .button-list-bottom {width: 70%;}
	[class=devicewidth] .button-list-top img {width: 80%; height: auto;}
	[class=devicewidth] .button-list1 {width: 100%; margin-bottom: 15px;}
	[class=devicewidth] .button-list2 {width: 100%;}
	[class=devicewidth] .button-list1 table {width: 100%;}
	[class=devicewidth] .button-list2 table {width: 100%;}
	[class=devicewidth] .button-list1 td {width: 50%;}

	[class=devicewidth] .tel-list-left {width: 100%;}
	[class=devicewidth] .tel-list-right {width: 100%;}
	[class=devicewidth] .tel-list-left span {display: block;}
	[class=devicewidth] .footer-logo {width: 100%;}
	}