@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:"LXGW WenKai TC", cursive;
	max-width: 1920px;
	overflow: hidden;
    background-color:#07055d;
    color: #ffffff;
}

/*======================
====Main CSS=====
=======================*/

/*----header------*/

.mainpic { 
    margin: 0 auto;
    height: 1082px;
    display: flex;
    align-items: center;
    justify-content: center;
}

header img {
    text-align: center;
    margin-top: -200px;
}

header h1 {
    text-indent: 101%;
    overflow: hidden;
    white-space: nowrap;
    position: absolute;
}

/*======================
====nav CSS=====
=======================*/

#main-nav{
    width: 100%;
    z-index: 990;  
}
 
 .block_menu {
     width: 100%;
 }
 
.sticky { top: 40px; }

.nav { 
    text-align:center;
    height: 93px;
    background:url("../images/bg-nav.webp") center top no-repeat;
	padding:10px 0;
 }

.nav li { display:inline-block; padding:0 0px;}
.nav li a { display: inline-block;  }

.menu01 a { width: 237px; height:72px; text-indent:-5000px; background: url("../images/nav.webp") 0 0 no-repeat;}
.menu01 a:hover, .menu01 a.active{ background: url("../images/nav.webp") 0 -72px;}
.menu02 a { width: 237px;height:72px; text-indent:-5000px; background: url("../images/nav.webp") -237px 0 no-repeat;}
.menu02 a:hover, .menu02 a.active{ background: url("../images/nav.webp") -237px -72px;}

/*======================
====main CSS=====
=======================*/ 

.first { padding-top:120px; margin-top: -120px;}
.second { padding-top:110px; margin-top: -110px;}
.maxwidth { max-width: 1500px; margin: 0 auto; }
.space { padding:20px 0;}
.foreword-outer { background: url("../images/bg01.webp") center bottom no-repeat; min-height: 550px;  }
.foreword-outer .maxwidth { display: flex; justify-content: center; align-items: center; padding-top: 60px; }
.item { width:48%; margin:0 1%; }

.foreword-outer h2 { font: 400 20px "LXGW WenKai TC", cursive;  line-height: 1.8em;}
.foreword-outer h3 { font: 400 17px "LXGW WenKai TC", cursive;  line-height: 1.8em; max-width: 600px;}

/*---tour----*/
.bg-tour-top { background: #000035 url("../images/bg02-top.webp") center top no-repeat; min-height: 570px;}
.bg-tour-bom { background: url("../images/bg02-bom.webp") center bottom no-repeat;  margin-bottom: 60px;}
.bg-belltop { background: url("../images/subtitle01.webp") center top no-repeat; padding-top: 180px; }
.bg-belltop2 { background: url("../images/bg-title02.webp") center top no-repeat; padding-top: 180px; }

.subtitle { 
    background: url("../images/bg-subtitle.webp") center center no-repeat;
    line-height: 67px; height: 67px; text-align: center; 
    font-weight: 300; font-size: 36px; margin-bottom: 30px;
}
/*---*/
.tour-outer { background: #ece0cb; padding:25px 70px 25px 70px; border-radius: 200px 200px 0 0; max-width: 1200px; margin:0 auto;  }

.tour-area { 
    height:70px;font-weight: 500; font-size: 30px; color: #074234; line-height: 1.8em; 
    text-align: center; background:url("../images/bg-tour-title.webp") center bottom no-repeat;  margin-bottom: 16px;
}

.main-tour { margin-top: 30px;}
.main-tour a { text-decoration: none; display:flex; flex-wrap: nowrap; margin-bottom: 20px;  }

.ct60 {  flex:0 0 50%;  justify-content:flex-start; align-items:center;  align-content: stretch; background:#fcfaf8; border-radius: 0 40px 40px 0; }
.ct40 {  flex:0 0 50%;  justify-content:flex-start; align-items:center;  align-content: stretch; }

.tour-pic {  max-width: 100%; margin:0 auto;}
.tour-pic img { border-radius: 60px 0 0 60px; }

.tour-name { 
    color:#000000; font: 600 18px "微軟正黑體"; line-height: 1.6em; text-align: left; padding:10px 20px; margin-top:15px;
}

.tour-info-list {  padding:8px 20px; margin:10px; margin-bottom: 60px; }

.tour-info-list li { 
    font: 600 14px "微軟正黑體" ; color: #171717; line-height: 1.8em;
    padding-left: 23px; text-indent: -23px; 
    text-align: left;
}
.tour-info-list li::before {
    content: url('../images/icon02.webp');
    padding-right: 6px;
}

.tour-info-list li span { color:#ee901d;}

.tour-price { color: #000000; font: 600 14px "微軟正黑體" ; line-height: 40px; margin-top:30px; position:absolute;  right:40px; bottom:20px; }
.tour-price em { color: #000000; font: 600 14px "微軟正黑體" ; font-style: normal; display: none; }

.tour-price span {  color:#fa2900;  font: 600 32px "微軟正黑體" ; font-family: 'Barlow', sans-serif; }


/*---*/
.tour-list { padding:30px 0 ;}
.tour-list li  { 
    color: #3e3e3e; font: 600 17px "微軟正黑體";
    line-height: 1.8em;
    border-bottom: 2px dotted #d0591d;
    margin:8px 0;
    padding:6px 0px;
}

.tour-list li a { 
    color: #131313; text-decoration:none; width: 100%; height:100%; display:flex; overflow:hidden;
}
.tour-list li a h3.name_l { padding-left: 23px; text-indent: -23px;}
.name_l::before {
    content: url("../images/icon02.webp");
    width:17px ;
    padding-right:6px ; 
 }
.name_l { width:78%;}
.price_r { width:22%;  text-align: right; color:#db2e28; font: 600 14px "微軟正黑體"; align-self: flex-end;}
.price_r span { font: 600 24px "微軟正黑體"; color:#db2e28;  padding:0 2px; font-family: 'Barlow', sans-serif; }

.tour-list li a h3.name_l span { font-style: normal; font: 600 15px "微軟正黑體" ; color:#dd5511;text-decoration: none; padding-left:6px; }

/*---*/

.market-outer { background: #990000 url("../images/bg03-top.webp") center top no-repeat; }
.market-outer .maxwidth { max-width: 660px; margin: 0 auto; text-align: center; padding: 0 30px 500px 30px;}
.bg-market-bom { background: url("../images/bg-market.webp") center bottom no-repeat; min-width: 487px; }

.pc-title { padding:25px 0;}
.mobile-title { display: none; }

.know-txt { font: 500 17px "LXGW WenKai TC", cursive;  line-height: 1.8em;  color:#ffffff; text-align: left; margin-bottom:20px ; }
.pickup-outer .know-txt  { text-align: center; }

/*---*/
.pickup-outer { background: #07055d url("../images/bg-title03.webp") center top no-repeat; padding-bottom: 100px; }
.pickup-outer .maxwidth { max-width: 660px; margin: 0 auto; text-align: center; padding: 60px 30px 0 30px; }

/*-------*/

.market-box .title-s { background: #b3b3ce;  font: 300 16px "LXGW WenKai TC", cursive; color:#07055d; text-align: center; padding:3px; }
.market-box .title { background: #6448a3; text-align: center; padding:15px 10px; }
.market-box .title span.country { color:#ffffff; font: 500 26px "LXGW WenKai TC", cursive; }
.market-box .title span.market-name { color:#ffffff; font: 500 32px "LXGW WenKai TC", cursive;  } 
.market-box .title span.market-name::before {
    content: url("../images/icon03.webp");
    width:18px ;
    padding:0 8px;        
}
.market-box .date {  font: 500 18px "LXGW WenKai TC", cursive; color:#fddca8;  padding:8px;  }
.market-box .date::before {
    content: url("../images/icon03.webp");
    width:18px ;
    padding-right:8px;        
}
.market-box .txt { color:#ffffff; font: 500 15px "LXGW WenKai TC", cursive; padding:0 10px 10px 10px; line-height: 1.8em; }
.slick-box { border-radius: 230px 230px 0 0; border:1px solid #d6c9fe; }
.market-pic img { border-radius: 230px 230px 0 0; }

/*----slick 自訂-----*/

* {
  box-sizing: border-box;
}

.slider {
    width: 80%;
    margin: 50px auto 70px auto;
}

.slick-slide {
  margin: 0px 20px;
}

.slick-slide img {
  width: 100%;
}

.slick-prev:before,
.slick-next:before {
  color: #ffffff;
}


.slick-slide {
  transition: all ease-in-out .3s;
  opacity: .2;
}

.slick-active {
  opacity: .6;
}

.slick-current {
  opacity: 1;
}
@media only screen and ( max-width:1151px)
{ 
.slider {
    width: 95%;
}
}
@media only screen and ( max-width:900px)
{ 
.slider {
    width: 60%;
}
}
@media only screen and ( max-width:768px)
{ 
.slider {
    width: 65%;
}
}
@media only screen and ( max-width:480px)
{ 
.slider {
    width: 90%;
}
}


/*------media query----------*/

@media only screen and ( max-width:1400px) 
{ 
    .market-box .title span.country {   font-size:16px; }
    .market-box .title span.market-name { font-size:24px;} 
    .market-box .date  { font-size:16px;}   
    .market-box .title span.country {   display: block;}
}


@media only screen and ( max-width:1024px) 
{ 
    .mainpic { height: 880px; }  
    header img { margin-top: 30px;}  
}

@media only screen and ( max-width:900px) 
{ 
    .foreword-outer .maxwidth { flex-direction: column; margin:0 20px; }
    .item { width:100%; margin: 15px 0; text-align: center;}
    .foreword-outer h3 { max-width: 100%; margin: 0 30px 60px 30px; }
    .market-box .title span.market-name::before { content: none; }
}



/*---平板-----*/

@media only screen and ( max-width:768px) 
{ 
    .mainpic { height: 680px; }  
    header img { margin-top: 0px;}  
    #main-nav { display: none;}
    .first { padding-top:0px; margin-top: 0px;}
    .second { padding-top:0px; margin-top: 0px;}
    .tour-pic { text-align: center;}        
    .main-tour { flex:0 0 86%; margin:0 auto; justify-content:center; margin-bottom: 30px; }
    .main-tour a { display: block; text-align: center; }
    .ct60 { width:96%; margin:0 2%; border-radius: 0 0 40px 40px; }
    .ct40 { width:96%; margin:0 2%; }
    .tour-pic img { border-radius:40px 40px 0 0;}
    .market-box .title span.country { display: inline;}
    .market-box .title span.market-name::before { content: url("../images/icon03.webp"); }
    .tour-list li a { display: block;}
    .name_l { width: 95%; display: block; }
    .price_r { width: 100%; display: block; padding-top:10px; text-align: right;}
}

@media only screen and (max-width:600px) 
{   
    .tour-outer {padding:25px 30px 25px 30px; border-radius: 100px 100px 0 0; }
    .market-box .title span.country {   display: block;}
    .bg-market-bom { min-width:auto; background: url("../images/bg-market.webp") -130px bottom no-repeat; }



}
/*---手機版-----*/

@media only screen and (max-width:480px) 
{
    .mainpic { height: 450px; }
    .tour-info-list li { font-size: 15px; }  
    .tour-list li a h3.name_l u { font-size: 15px; display: block;  padding-left:0px;}
    .pc-title { display: none; }
    .mobile-title { padding:25px 0; display:block; }
}
