@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,figure,article,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td ,header {
    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;}

.clearfix {
  overflow: auto;
}

img { max-width:100%;}

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

*{
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}


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

#web-outer {
    font-family:"微軟正黑體",Arial, Helvetica, sans-serif;
	max-width: 1920px;
	overflow: hidden;
	_overflow: none;
    background-color:#ffe0f0;
}

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

/*----header------*/

header h1 {
    text-indent: 101%;
    overflow: hidden;
    white-space: nowrap;
    position: absolute;
}

.mainpic { 
   text-align: center;
   margin: 0 auto;
   position: relative;
}

.mainpic-in {
    display: flex;
    align-items: center;
    justify-content:space-between;
    background: #ffbae9;
    padding-top: 0px;
}

.main-title { 
  position:absolute; bottom:0; left: 50%;
  transform: translateX(-50%);
  margin-top: 80px;
}
.main-title-xs { 
    text-align: center;
    margin: 0 auto;
  display: none;
}

/*======================
====nav CSS=====
=======================*/

#main-nav{
    width: 100%;
    z-index: 990;  
    background:url("../images/bg-nav.webp") 0 0 repeat-x;    
}
 
 #block_menu {
     text-align: center;
     font-family:"微軟正黑體","黑體";
     font-weight: 600;
     overflow: hidden;
 }
 
 .sticky {
     top:40px;
 }

 .class-nav {  height: 65px;  max-width: 700px; margin:0 auto; }
 .class-nav p {  display: inline-block; background: url("../images/nav.webp") 0 0 no-repeat; height: 65px; text-indent: -5000px;  }
 .class-nav p a { display:block; width:100%; height:100%; text-decoration: none;  }
 
 .class-nav p.btn { background: url("../images/nav.webp") 0 0 no-repeat; width:80px;  }
 .class-nav p.btn-tw { background: url("../images/nav.webp") -399px 0 no-repeat; width:77px;  }

 .class-nav p.btn1 { background: url("../images/nav.webp") -80px 0 no-repeat; width:91px;  }
 .class-nav p.btn2 { background: url("../images/nav.webp") -171px 0 no-repeat; width:67px;  }
 .class-nav p.btn3 { background: url("../images/nav.webp") -238px 0 no-repeat; width:54px; }
 .class-nav p.btn4 { background: url("../images/nav.webp") -292px 0 no-repeat; width:54px; }
 .class-nav p.btn5 { background: url("../images/nav.webp") -346px 0 no-repeat; width:53px; }

 .class-nav p.btn6 { background: url("../images/nav.webp") -476px 0 no-repeat; width:47px; }
 .class-nav p.btn7 { background: url("../images/nav.webp") -523px 0 no-repeat; width:52px; }
 .class-nav p.btn8 { background: url("../images/nav.webp") -575px 0 no-repeat; width:44px; }

 .class-nav p.btn1:hover,.class-nav p.btn1 a.active2 { background: url("../images/nav.webp") -80px -65px no-repeat;   }
 .class-nav p.btn2:hover,.class-nav p.btn2 a.active2 { background: url("../images/nav.webp") -171px -65px no-repeat;   }
 .class-nav p.btn3:hover,.class-nav p.btn3 a.active2 { background: url("../images/nav.webp") -238px -65px no-repeat;  }
 .class-nav p.btn4:hover,.class-nav p.btn4 a.active2 { background: url("../images/nav.webp") -292px -65px no-repeat;  }
 .class-nav p.btn5:hover,.class-nav p.btn5 a.active2 { background: url("../images/nav.webp") -346px -65px no-repeat;  }
 .class-nav p.btn6:hover,.class-nav p.btn6 a.active2 { background: url("../images/nav.webp") -476px -65px no-repeat;  }
 .class-nav p.btn7:hover,.class-nav p.btn7 a.active2 { background: url("../images/nav.webp") -523px -65px no-repeat;  }
 .class-nav p.btn8:hover,.class-nav p.btn8 a.active2 { background: url("../images/nav.webp") -575px -65px no-repeat;  }

 
.nav {  max-width: 960px; margin:0 auto; /*height: 45px;*/  padding:10px 0; background:#3e0673; margin-top: 2px; border-radius: 10px;}
.nav li {  
    display:inline-block; font: 600 16px "微軟正黑體","黑體"; 
    color:#d5cbde; margin: 0 0px; 
}
.nav li a { display:block; width:100%; height:100%; text-align: center; text-decoration: none;  color:#d5cbde; padding:3px 8px; }
.nav li a:hover,.nav li a.active { background-color: #ffe037; border-radius: 10px; color:#3e0673;}


/*======================
====main CSS=====
=======================*/ 

.first { padding-top:120px; margin-top: -120px;}
.second { padding-top:100px; margin-top: -100px;}

#holiday-info h3 { color: #3e0673; font: 800 18px "微軟正黑體";  max-width: 600px; margin: 0 auto; padding:30px 0; line-height: 1.8em; text-align: center; }
.holiday-outer { background: url("../images/bg01.webp") left top repeat-y; padding:50px 15px; }
.subtitle-cal { 
    background: url("../images/bg-title01.webp") center top no-repeat;
    line-height: 55px; padding-top: 6px; height: 55px;
    font: bolder 26px "微軟正黑體"; text-align: center; color: #3e0673;
}
.calender { display: flex; justify-content: center; align-items: flex-start; padding:0 16px; max-width: 1200px; margin: 0 auto; }
.cal-item { flex-shrink: 0; width: 484px;}

.dayoff-outer {  margin-left: 1%;  }
.dayoff { background: #ffffff; border-radius: 20px; padding:20px; margin-bottom: 20px;  }
.dayoff li { 
    color:#3e0673; font: 800 15px "微軟正黑體"; line-height: 1.8em;
    margin:0px 10px 12px 0; border-bottom: 1px solid #e1e1e1; padding-left: 140px; text-indent: -140px; padding-bottom: 10px;
} 
.dayoff li span { 
    border-radius: 10px; width:130px; text-align: center; display: inline-block; 
    background: #7235ab; color:#ffffff; font: 800 15px "微軟正黑體"; line-height: 30px;text-indent: 0px;
    margin:0px 10px 0px 0; 
} 

section:nth-child(odd)  .bg-box { background:#f6edaf; padding:60px 0 100px 0; }
section:nth-child(even)  .bg-box { background:#affafa; padding:60px 0 100px 0; }

.bg-box h2 { 
    background: url("../images/bg-title02.webp") center top no-repeat;
    line-height: 56px; height: 56px; padding-top:8px;
    font: bolder 26px "微軟正黑體"; text-align: center; color: #3e0673;
}

.tabs-container { margin: 0 auto; max-width: 1200px; margin-bottom: 60px; }

.tab-content-outer { border-radius: 20px; background: #ffffff;  padding:15px 25px; margin:0 15px;}
.tabs-box { margin:50px 0 20px 0; text-align: center;}
.tabs-box li { display: inline-block;text-align: center; margin: 1px 1px; }
.tabs-box li a { 
    width: 100%; height: 100%; display: block; 
    border:2px solid #f7de90; background: #ffffff; 
    border-radius: 32px; padding:6px 30px; 
    color:#f4b202; font: 600 22px "微軟正黑體"; text-decoration: none;
}
.tabs-box li a span { 
   font: 600 14px "微軟正黑體"; display: block; 
}
.tabs-box li a:hover, .tabs-box li a.active { border:2px solid #ed02a1; background: #ed02a1; color:#ffffff;}


/*----tour-box----*/

.ct-box {  margin:0 auto; clear:both; overflow: hidden; }

.main-tour { margin-top: 30px;}
.main-tour a { text-decoration: none; display:flex; flex-wrap: nowrap; max-width: 1100px; margin:0 auto; margin-bottom: 20px;  }

.ct55 {  flex:0 0 56%;  justify-content:flex-start; align-items:flex-start;  align-content: stretch; padding-right:10px; }
.ct45 {  flex:0 0 43%;  justify-content:flex-start; align-items:flex-start;  align-content: stretch; }

.ct-in { border:3px solid #f2c334; margin-left:-20px; background:#ffffff; margin-top: 20px; border-radius: 10px; }
.tour-pic { max-width: 650px; margin:0 auto;}
.tour-pic img { border-radius: 80px 0 0 0; }
.city  { text-align: left; margin-left: 36px; font: 600 15px "微軟正黑體"; background:#ec4db9; border-radius: 0 0 10px 10px; color:#ffffff; padding:8px 8px; margin-top: 8px;}

.tour-name { 
    color:#000000; font: 600 20px "微軟正黑體"; line-height: 1.6em; text-align: left; padding:10px 20px; margin-top:6px;
}
.tour-info-list {  padding:8px 20px; margin:3px; }

.tour-info-list li { 
    font: 600 15px "微軟正黑體" ; color: #d56b03; line-height: 1.8em;
    padding-left: 14px; text-indent: -14px; 
    text-align: left;
}
.tour-info-list li::before {
    content: " ";
    margin-right: 6px;
    background:#ffad5a;
    border-radius: 50%;
    width:7px;
    height:7px;
    display: inline-block;
}

.tour-price { color: #000000; font: 600 14px "微軟正黑體" ; text-align: right; line-height: 40px; margin-top:10px; padding-right:15px; }
.tour-price span {   color:#ed02a1;  font: 600 30px "微軟正黑體" ; font-family: 'Barlow', sans-serif; }

section:nth-child(even)  .bg-box .ct-in { border:3px solid #3cd8e6; }
section:nth-child(even)  .bg-box .tour-info-list li { color: #007ea5;}
section:nth-child(even)  .bg-box .tour-info-list li::before { background:#80edf5;}


/*----tour-list---*/

.width-box { margin: 30px 0 100px 0; }
.morelink-box { display:flex; max-width: 1400px; margin:0 auto; justify-content: center; }
.morelink-in { 
    flex: 0 0 23%; justify-content: center; align-content: flex-start;  margin:0 1%; 
    background: #ffffff; border-radius: 0 0 20px 0 ; border:2px solid #f2c334;
    display: flex; 
}
.product-box { display: flex; flex-direction: column; }
.morelink-product-info { flex: 1; padding:10px; }
.many-link-btn { display:flex; justify-content: flex-end;  text-align: right; margin-right: 10px; margin-bottom: 15px; }
.many-link-btn a { 
    text-decoration: none; color: #666667; height:100%; 
    border-radius: 26px; font-size: 14px; font-weight: 600; border:1px solid #666667; padding:2px 5px;
    line-height: 1.7em; margin:3px 5px 0 0; 
}
.many-link-btn a:hover { background:#5c5c5c; color:#ffffff; }
.many-link-btn a:empty { display: none;}

a.morelink-in { text-decoration: none; } 
a.morelink-in:hover { opacity: .8;}

.morelink-name {     
    font-size: 20px;
    color: #000000;
    line-height: 28px;
    padding:6px 10px;
}
.morelink-name span {
	color: #ffffff;
    display: inline-block;
    margin: 0 5px 0 0;
    font-weight: bold;
    line-height: 24px;
	padding: 2px 8px;
	border-radius: 10px;
	background:#7235ab;
	font-size: 15px;
}
.morelink-name span:empty {
    display: none;
} 
.morelink-product-info li {
	display: inline-block;
    width: 100%;
    margin: 0px 0px 5px 0;
    padding: 0 0 0 20px;
    position: relative;
    font-size: 14px;
    line-height: 22px;
    color: #464646;
}

.morelink-product-info li::before {
	position: absolute;
	content: '★';
	left:0px;
	top: 0px;
	width: 5px;
}

.morelink-product-infoli:empty {
	display: none;
}
.product-price {
	width:100%;
	font-size: 13px;
	text-align: center;
	line-height: 25px;
    color:#000000;
}

.product-price span {
	display: inline-block;
	margin: 0 3px;
	color:#ed02a1;
    font: 600 26px "微軟正黑體" ; 
    font-family: 'Barlow', sans-serif; 
	line-height: 30px;
}
/*a.one-link-btn { text-decoration: none;  }*/

.row { max-width: 1100px; margin:0 auto; clear:both; padding:0 15px;}
.tour-box { }

.tour-list li  { 
    font: 700 17px "微軟正黑體" ; color: #39342c; 
    line-height: 1.8em;
    border-bottom: 1px solid #cc900c;
    margin:8px 0;
    padding:6px 0px;
}

.tour-list li a { 
    color: #39342c; text-decoration:none; width: 100%; height:100%; display:flex; overflow:hidden;
}
.name_l { width:80%;  }
.price_r { width:20%;  text-align: right; color: #000000; font: 600 13px "微軟正黑體"; }
.price_r span { font: 600 24px "微軟正黑體"; color:#ed02a1;  padding:0 2px; font-family: 'Barlow', sans-serif; }

.tour-list li a h3.name_l span { font-style: normal; font: 600 15px "微軟正黑體" ; color:#d56b03; text-decoration: none; padding-left:6px; }

.tour-list li a em {  padding:2px 4px; color: #39342c;  border:1px solid #39342c;  font-style: normal; margin:0 8px 0 0px;  border-radius: 4px; font-size: 14px; }

section:nth-child(even) .tour-list li a h3.name_l span { color: #007ea5; }
section:nth-child(even) .tour-list li {  border-bottom:1px solid #00b9d5;}


.tabs-container .tour-list li { border-bottom: 1px solid #ccbea0;}

/*----tour-list-morelink----*/

.tour-list-morelink { text-align: left;  margin:0 1%;  margin-top:20px;}

.tour-list-morelink li  { 
    font: 700 17px "微軟正黑體" ; color: #39342c; 
    line-height: 1.8em;
    overflow:hidden;
    border-bottom: 1px solid #cc900c;
    padding:5px 0px; 
}

.tour-list-morelink li p {  display:flex;  }
.tour-list-morelink li p.link { justify-content: flex-end; }
.tour-list-morelink li p a { 
    color: #666667; text-decoration:none; /*width: 86px;*/ height:100%; 
    border-radius: 26px; font-size: 15px;   border:1px solid #666667; 
    text-align: center; line-height: 1.8em; margin:3px 5px 0 0; padding:3px 5px;
}
.tour-list-morelink li p a:hover { 
    background:#666667; color:#ffffff; transform: translate(1px, 0);  border:1px solid #666667; 
}
/*.name_l { width:80%;  }
.price_r { width:20%;  text-align: right; color: #000000; font: 600 13px "微軟正黑體"; }*/

/*.tour-list-morelink li span.name_l { display: inline-block; }*/
/*.tour-list-morelink li span.name_l em { display: inline-block; }*/
.tour-list-morelink li h3 { display: inline-block;  width:80%; }

.tour-list-morelink li span.price_r { display: inline-block; width:20%;  text-align: right; color: #000000; font: 600 13px "微軟正黑體"; }

.tour-list-morelink li h3 span.name_l strong { font-style: normal; font: 600 14px "微軟正黑體" ;  color:#e59630; padding-left:6px; }

.tour-list-morelink li span.name_l em { padding:2px 4px; font-style: normal; margin:0 8px 0 0px;  border-radius: 4px; font-size: 14px; color: #39342c;  border:1px solid #39342c; }

.tour-list-morelink li span.price_r strong { font: 600 24px "微軟正黑體"; color:#ff0000;  padding:0 2px; font-family: 'Barlow', sans-serif; }

/*section:nth-child(even)  .bg-box  .tour-list-morelink li  { border-bottom: 1px solid #797979; } 
section:nth-child(even)  .bg-box  .tour-list-morelink li p a { color: #168e17; border:1px solid #168e17;}
section:nth-child(even)  .bg-box  .tour-list-morelink li p a:hover { background:#168e17; color:#ffffff; }
section:nth-child(even)  .bg-box  .tour-list-morelink li p span.name_l span { color:#e09206; }
*/
  
/*------media query----------*/

@media only screen and ( max-width:1500px) 
{ 
    .main-title img { max-width: 80%;}
}

@media only screen and ( max-width:1024px) 
{ 
    .morelink-box {  flex-wrap: wrap; }
    .morelink-in {  flex: 0 0 48%; margin:20px 1%;}
}
@media only screen and ( max-width:1024px) 
{ 
    .mainpic-in { justify-content:center;}
}

@media only screen and ( max-width:900px) 
{ 
    .calender { flex-direction: column; flex-wrap: wrap; align-items: center; flex:0 1 100%;  }
    .dayoff-outer {  margin-left: 0%; margin-top: 20px; }
    .dayoff-outer figure { text-align: right; }
    .dayoff { flex:0 0 100%; }
    .cal-item { flex-shrink: 0; width: 100%; text-align: center;}
}



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

@media only screen and ( max-width:768px) 
{ 
    #main-nav { display: none;}
    .first { padding-top:0px; margin-top: 0px;}
    .second { padding-top:0px; margin-top: 0px;}
    .main-tour a { display:block;  }
    .ct-box2 .main-tour { display:block; }
    .ct55 { width:96%; margin:0 2%; }
    .ct45 { width:96%; margin:0 2%; }
    .ct-in{ max-width: 650px; margin:0 auto; margin-top: 5px; }
    .tour-pic { text-align: center;}
    .name_l { width: 70%; }
    .price_r { width: 30%;   align-self:flex-end;}
    /*.tour-list-morelink li p a { font-size: 16px; line-height: 2.2em; margin:8px 5px 0 0; padding:3px 6px;   }   */     
    .ct-box2 .main-tour-link a { font-size: 16px; line-height: 2em; }
    .tour-list-morelink li span.price_r { margin-bottom: 18px; } 
    .tabs-box li a { font-size: 18px; padding:6px 20px;  }
    .tabs-box li a span { font-size: 13px; }  
}

@media only screen and (max-width:600px) 
{   
    .mainpic-in { padding-top: 40px;}
    .main-title img { max-width: 96%;}

    .calender { padding:0 0px;}

    section:nth-child(odd)  .bg-box { padding-top:30px; }
    section:nth-child(even)  .bg-box { padding-top:30px; }

    .tour-list li a { display: block;}
    .name_l { width: 95%; display: block; }
    .price_r { width: 100%; display: block; padding-top:10px; text-align: right;}
    .tour-list-morelink li h3 { width: 95%; display: block; }
    .tour-list-morelink li span.price_r { width: 100%; display: block; padding-top:10px;  }
    .tour-list-morelink li p {  display:block;  }
    .tour-list-morelink li p.link { text-align: right; }

   .tabs-box { max-width: 360px; margin:0 auto;}
   .tabs-box li a { margin-bottom: 8px; font-size: 20px; padding:6px 30px; }

   .morelink-in {  flex: 0 0 98%; }

}
/*---手機版-----*/

@media only screen and (max-width:480px) 
{
    .mainpic-in { display: none;}
    .main-title { display: none;}
    .main-title-xs { display: block;}
    .dayoff-outer { display: none;}
    /*.dayoff li { padding-left: 0; text-indent: 0; text-align: center; }
    .dayoff li span { display: block; margin:0 auto; }*/
    .tour-name { text-align: left;  }
    .tour-info-list li { font-size: 15px; text-align: left;  }     
    .tour-list li a h3.name_l u { font-size: 15px; display: block;  padding-left:0px;}
}