@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{text-decoration :none;}
a img {
	border: none;
}

.clean { clear:both;}

.clearfix {
  overflow: auto;
}

img { max-width:100%;}

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

body {
    margin: 0;
    padding: 0;
    font-family:"微軟正黑體","黑體", Arial, Helvetica, sans-serif;
	background-color: #fff;	
}

/*======================
====Main CSS=====
=======================*/

#theme-nav { margin-top: 30px;  overflow: hidden; }

.col20 { width:20% ; display: inline-block; vertical-align: top;  margin-right: -4px; background: #fd7035; height: 90px;  }
.col80 { width:80% ; display: inline-block; vertical-align: top;  margin-right: -4px; background: #e66677; height: 90px; }
.logo { padding: 1.5vh 2.5vw; line-height: 90px; }

.theme-list {}
.theme-list img{max-width:100%;}
.theme-list li { 
    display: inline-block; padding-right: 10px; 
    color: #ffffff; font: 500 22px "微軟正黑體";   line-height: 90px; vertical-align:middle;
}
.icon {  padding-left:6px; vertical-align:text-bottom;}
.icon02 { padding-left:10px;}    

.theme-list li a { 
    color: #ffffff; width:100%; height: 100%; text-decoration:none;
}
.theme-list li a:hover { 
    color:#ffc600;
}

h1,h2,h3 { display:none;}

/*版頭*/
#top-bg{width: 100%;height: 558px; background: url("img/top_bg.jpg") top no-repeat;}
.top-box{max-width: 960px;height: 558px;position: relative;margin: 0 auto;}
.top-box .p01{max-width: 367px;position: absolute;top: 0;right: 10px;}
.top-box .p02{max-width: 311px;position: absolute;top: 100px;right: 45px;}
.top-box .girl{max-width: 325px;position: absolute;top: 82px;left: 200px;}
.top-box02 {display: none;max-width: 960px;}

.bg01{background: #f1f1f1 url("img/bg01.png") top no-repeat;}
.bg02{background: #fff url("img/bg02.png") top no-repeat;}
.bg03{background: url("img/bg03.png") bottom no-repeat;}
.bg04{background: url("img/bg04.png") top no-repeat;}

/*行程亮點*/
#about{ width: 100%;padding: 30px 0;font-family:"微軟正黑體","黑體", Arial, Helvetica, sans-serif;}
.about-box{max-width: 740px;margin: 30px auto;padding: 20px 20px 30px 20px;border:#aba096 1px solid;}
.about-box .title{max-width: 259px;margin: 15px auto;}
.about-box .note{width: 85%;margin: 0 auto;font-size: 18px;line-height: 1.8em; color: #272727;}

.hot-box{max-width: 740px;margin: 30px auto 10px auto;padding: 20px 20px 30px 20px;background: url("img/bg05.png") top no-repeat;position: relative;}
.hot-box .title{max-width: 259px;margin: 15px auto;}
.bike{max-width: 179px;position: absolute;bottom:35px;right: 25px;}

ul.bike-focus{width: 70%;margin: 20px auto 0 auto;font-size: 18px;line-height: 1.8em; color: #272727;}
ul.bike-focus li{list-style:url("img/icon.png");margin-top: 15px;}
ul.bike-focus li p span{position: absolute; display: inline-block;width: 100px;font-size: 25px;color: #cb7f42;font-weight: bold;margin-top: 3px;}
ul.bike-focus li .focus{font-weight: bold;padding: 0 0 0 105px;}
ul.bike-focus p{margin-top: 10px; font-size: 18px;line-height: 1.8em; color: #727272;font-weight: bold;}


/*地圖*/
.map{max-width: 720px;margin: 0 auto 50px auto;}
.map img{border-radius: 10px;}

/*行程*/
#tour{width: 100%;padding: 30px 0;font-family:"微軟正黑體","黑體", Arial, Helvetica, sans-serif;}
.tour-box{max-width: 850px;margin: 0 auto;padding: 20px 10px;}
.tour-box .title{max-width: 261px;margin: 15px auto;}

.left{float: left;}
.right{float: right;}

.tour{width:100%;margin: 20px auto;clear: both;overflow: hidden;}
.tour .txt{width: 42%;margin: 30px 0 20px 0;background-color: #fff; border:#e5decb 1px solid;padding: 10px;}
.txt .note{font-size: 15px;color: #dd4400;line-height: 1.5em;font-weight: bold;}
.txt .note02{font-size: 15px;color: #0070aa;line-height: 1.5em;font-weight: bold;margin-bottom: 5px;}
.txt .note03{font-size: 17px;color: #fff;background-color: #0070aa; display: inline-block;padding: 3px 10px 3px 5px;border-radius: 0 10px 10px 0; line-height: 1.5em;border-left: #00b4c9 5px solid;font-weight: bold;margin-bottom: 5px;}
.txt .name{font-size: 18px;color: #484848;line-height: 1.5em;font-weight: bold;margin: 10px 0;}
.txt .area{display: inline-block;padding: 5px 8px;border-radius: 15px; background-color: #4b4b4b;color: #fff;font-size: 13px;line-height: 1.2em;font-weight: bold;}

.txt ul.bike-note{clear: both;overflow: hidden;}
.txt ul.bike-note li{float: left; padding: 5px 8px;margin-right: 5px; border-radius: 15px; background-color: #4b4b4b;color: #fff;font-size: 13px;line-height: 1.2em;font-weight: bold;}
.txt ul.bike-note li.org{background-color: inherit;background-color: #dd4400;}

.txt .price{margin: 30px auto 10px auto;font-size: 13px;color: #484848;text-align: center;}
.txt .price strong{font-size: 35px;color: #b90303; font-weight: bold;margin: 0 3px;}

.tour .ph{width: 50%;padding: 15px;position: relative;}
.ph .pic{max-width: 74px;position: absolute;top:0;left: 0;}
.ph .pic02{max-width: 43px;position: absolute;bottom: 0;right: 0;}
.ph .pic03{max-width: 75px;position: absolute;top:0;left: 0;}
.ph .pic04{max-width: 50px;position: absolute;bottom: 0;right: 0;}

/*.tour .txt a{display: block;background-color: #fff; border:#e5decb 1px solid;padding: 10px;}
.tour .txt a:hover{background-color:#f4f1e9; }*/

.tour:hover .txt { background-color: #f4f1e9;}


.carousel {  
  width: 100%;
}
.carousel#carousel-vertical {
  height: 250px;
  padding: 0;
  width: 100%;
}
.carousel#carousel-responsive {
  width: 100%;
  height: 250px;	
}
.carousel li{float: left;}
.carousel li, 
.carousel > div > div {
}
.carousel#carousel-vertical li, 
.carousel#carousel-vertical > div > div {
}
.carousel ul li:nth-child(even), 
.carousel > div > div:nth-child(even) {
}
.carousel span {  
  display: block;
  height: 250px;
  width: 400px;
}


@media screen and (max-width:1024px)  {		
	.theme-list li { 
    display: inline-block; padding-right: 10px; 
    color: #ffffff; font: 500 20px "微軟正黑體"; line-height: 90px; vertical-align:middle;}
}
@media screen and (max-width:959px)  {
	.theme-list li { 
    display: inline-block; padding-right: 5px; 
    color: #ffffff; font: 400 13px "微軟正黑體"; line-height: 90px; vertical-align:middle;}
	#top-bg{display: none;}
	.top-box{display: none;}
	.top-box02 {display: block;}
	#about{margin-top: -5px;}
	.about-box{max-width: inherit;width: 85%;}
	.about-box .note{width: 100%;font-size: 15px;}	
	ul.bike-focus{width: 85%;margin: 0 auto;}
	.map{max-width: inherit;width: 95%;}
}


/*---平板-----*/
@media screen and (max-width:768px) {
	#top-bg{display: none;}
	#theme-nav { display: none;}
	
	#about{padding: 10px 0 30px 0;}	
	ul.bike-focus{width: 80%;margin: 0 auto;}
	ul.bike-focus li{list-style:inherit;padding: 0;}	
	ul.bike-focus li p span{position: inherit;font-size: 22px; line-height: 1.5em;}
	ul.bike-focus li .focus{display: block;margin-top: 5px; padding: 0;font-size: 15px; line-height: 1.2em;}
	
	ul.bike-focus p{font-size: 15px;}
	.left{float: inherit;}
	.right{float: inherit;}		
	
	#tour{padding: 10px 0 30px 0;}
	.tour .txt{width: 90%;margin: 10px auto;}
	.tour .ph{width: 90%;margin: 10px auto;}	
	
}
@media screen and (min-width: 481px) and (max-width: 580px) {
	ul.bike-focus{width: 90%;}.bike{display: none;}
}

/*---手機版-----*/
@media(max-width:480px) {		
	.hot-box{padding: 0;}
	ul.bike-focus{width: 90%;}
	.bike{display: none;}	
	
}
/*---手機版-----*/
@media(max-width:320px) {}