@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, figure, mark, video {
    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;}*/
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;}
img {max-width: 100%;image-rendering: -webkit-optimize-contrast;}
.clean { clear:both;}
a {color: #333333; text-decoration: none; blr:expression(this.onFocus=this.blur()); outline: none; /* for Firefox */hlbr:expression(this.onFocus=this.blur());}
a:hover {}
a:focus{ -moz-outline-style: none;}
.b-box{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
body {
	margin: 0;
	padding: 0;
	font-size:15px;	
}

/*wow*/
.wow:first-child {
visibility: hidden;
visibility:visible \9;
}
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;}

img { max-width:100%;}

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

body {   
	-webkit-text-size-adjust: none;/*防止allpe的safari瀏覽器字體變大*/	
}

/*基本變數*/
:root {
	/*基本*/
	--white-color:#fff;
	--black-color:#141115;
	--family-basic:Verdana,'微軟正黑體';
	--family-noto:"Noto Sans TC",Verdana;	
}
/*-------------------------------------選單---------------------------------------------*/
#main-nav{
   position: relative;
   z-index: 990;
   margin:0 auto;  
}

#block_menu {
	width: 100%;
    overflow: hidden;
}

.sticky {
    top:40px;	
}

#main-nav ul {background-color: #023a8e;text-align: center; height: 65px;text-align: center;}
#main-nav ul li {display:inline-block;font-family: var(--family-basic);}
#main-nav .nav001{background-color: #fff600;color: #023a8e; width: 55px;line-height: 1.2em;font-weight: 600; border-radius: 0 0 30px 30px;padding-top:5px;padding-bottom: 10px;}
#main-nav .nav002{background-color: #0298cf;color: #fff; width: 55px;line-height: 1.2em;font-weight: 600;border-radius: 0 0 30px 30px;padding-top:5px;padding-bottom: 10px;}
#main-nav ul li a { display:block;font-size: 18px;line-height: 1em;font-weight: 600;  text-align: center; text-decoration: none;border-radius: 25px; color: #fff;padding: 5px 8px;margin: 0 5px;}
#main-nav ul li a:hover,#main-nav ul li a.active { background: #fff;  color:#023a8e;}
.active {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

#web-outer{	
	clear: both;
	overflow: hidden;	
}

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

.header-title{max-width: 784px; position: absolute;left: 5%;bottom: 15%; z-index: 99;}

.header-content{
	width: 100%;
	padding-top: 60px;	
	padding-bottom: 60px;
	text-align: right;	
	clear: both;	
	position: relative;
	left: 8%;
	right: 0;
}
.header-content::before{position: absolute;content: '';width: 50%;height: 100%;right:-50px;top: -80px; background-color: #edecde;border-radius: 50%;z-index: 1;}
.header-content .product-slide{position: relative;right: 0; max-width: 1850px; padding-bottom: 40px;z-index: 10;}
.product-slide img{border-radius: 350px 0 0 350px;}

.product-slide::after{
	content: '';
	position: absolute;
	background: url("../img/header_01.webp")no-repeat;
	background-size: contain;
	top:-5%;
	left: -10%;
	width: 423px;
	height: 378px;
	z-index: 20;
}

.product-slide::before{
	content: '';
	position: absolute;
	background: url("../img/header_02.webp")no-repeat;
	background-size: contain;	
	left: -10%;
	bottom: 0;
	width: 302px;
	height: 281px;
	z-index: 20;
}

.product-slide .slick-dots li button:before {color: rgba(194,194,194,0.5);}
.product-slide .slick-dots li.slick-active button:before{color: #58b2dc;}
.header-img {aspect-ratio: 37 / 15;}

.header-content .mobile{display: none;}


.bg-01{background: url("../img/bg_01.webp") top no-repeat;}
.bg-02{background-color: #f3fbff;}
.bg-03{background-color: #fff;}

/*浮動導覽列*/
.block-menu {
	z-index: 999;
	position: fixed;
	top:50px;
	right:0px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	text-align: center;
	display: grid;
    justify-items: center;	
	display: none;
}

.menu-space {
	display: inline-block;
	position: relative;	
	border-top-left-radius: 20px;
	background: #f6f5e8;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;	
	font-family: var(--family-basic);
}

.menu-space ul {
	display: grid;
}

.menu-space li {
	display: inline-block;	
}

.menu-title {
	border-top-left-radius: 20px;
	background:#000;
	color: #fff;
	font-size: 15px;
	font-weight: 600;	
	padding:15px 10px;
}

.menu-space li ,.menu-space a {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.menu-space a {
	display: flex;
	padding: 15px 10px;
	text-align: center;	
	font-size: 15px;
	font-weight: 600;	
	flex-wrap: wrap;
    flex-direction: column;
    
}
.menu-space a:hover {}
.menu-space a.menu-semi:hover {background: #606060;color: #fff;}
a.menu-semi.nav-link.active {background: #154859;color: #fff;}


/*標題*/
h2.big-title {
	width: 315px;
	height: 115px;
	background: url("../img/title_bg.webp") top no-repeat;
	text-align: center;
	margin: 0 auto;
	font-family: var(--family-basic);
	color: #154859;
	text-align: center;
	font-weight: normal;
}   
.big-title em{font-style:normal;font-size: 18px;display: block;padding: 20px 0 8px 0;}
.big-title span{font-size: 45px;font-weight: 600;}


/*介紹*/
/*.intro-wrap{width: 100%; clear: both;overflow: hidden;}*/
.intro-wrap{width: 100%; max-width: 780px;min-height: 580px; margin: 30px auto;font-family: var(--family-basic);font-size: 18px;line-height: 2em; color: #2f2f2f;position: relative;}

.intro-wrap::after{
	content: '';
	position: absolute;
	background: url("../img/girl_01.webp")no-repeat;
	background-size: contain;
	top: 0;
	left: -170px;
	width: 157px;
	height: 521px;
	z-index: 20;
}

.intro-wrap::before{
	content: '';
	position: absolute;
	background: url("../img/girl_02.webp")no-repeat;
	background-size: contain;
	top: 0;
	right: -200px;
	width: 266px;
	height: 551px;
	z-index: 20;
}

.intro-title{max-width: 650px;margin: 0 auto;}
.intro-wrap h2{color: #154859;font-size: 35px;line-height: 1.8em;}
.intro-wrap h3{color: #154859;font-size: 22px;line-height: 1.8em;}
.intro-wrap p{margin-top: 10px;}
.intro-wrap ul{margin-top: 10px;margin-left: 30px;}
.intro-wrap ul li{list-style-type:disc;margin-top: 5px;}


/*4大素求*/
.demands-wrap{width: 100%;position: relative;clear: both;overflow: hidden;}
.demands-wrap::before{position: absolute;content: '';width: 100%;height: 50%;left:0;bottom: 12%; background-color: #edecde;z-index: 1;}

.info-wrap{max-width: 1700px;margin: 50px auto 0 auto;position: relative;z-index: 99;}
.info-box{width: 100%; display: inline-block; vertical-align: top;position: relative;margin: 0 15px;}
.top-box{padding-top: 30px;}
.info-pic {	
	width: 100%;	
	position: relative;
	overflow: hidden;	
}
.pic01 img{border-radius: 30px 100px 30px 30px;}
.pic02 img{border-radius: 100px 30px 30px 30px;}
.pic-img{aspect-ratio: 20 / 21;}

.info-pic .title {
	display: inline-block;
	position: absolute;
	min-width: 100px;
	padding: 10px;
	text-align: center;
	font-family: var(--family-basic);
	font-size: 20px;
	font-weight: bold;	
	color: #0b0b0b;		
	left: 0;
	top: 30px;
	z-index: 1;
	background-color: #e2e1d7;	
}

.info-txt {
	width: 80%;
	margin: 0 auto;	
	border-radius: 20px;
	padding: 20px;
	position: relative;
	bottom: 30px;
	background-color: rgba(33,81,97,0.95);		
}
.info-txt h2{background: url("../img/info_bg.webp") bottom no-repeat;font-size: 30px;color: #e4e3d7;text-align: center;font-weight: normal;font-weight: 300;padding-bottom: 10px;}
.info-txt p{
	margin-top: 10px;
	font: 500 18px "微軟正黑體";
	line-height: 2em;
	color: #fff;
}
.responsive .slick-dots {display: none;}


/*行程標題*/
h2.min-title {
	width: 235px;
	height: 92px;
	background: url("../img/title_bg02.webp") top no-repeat;
	text-align: center;
	margin: 30px auto 0 auto;
	font-family: var(--family-basic);
	color: #154859;
	text-align: center;
	font-weight: normal;
}   
.min-title em{font-style:normal;font-size: 18px;display: block;padding: 0 0 28px 0;}
.min-title span{font-size: 35px;font-weight: 600;}


/*圖文行程*/
.tour-from{max-width: 1100px; margin: 50px auto;}
/*.tour-bg{position: relative;clear: both;margin: 50px auto 50px auto;max-width: 1500px;}
.tour-bg::before{position: absolute;content: '';width: 90%;height: 90%;right:0;top: 50px; background-color: #d1eefc;border-radius: 25px;z-index: 1;}*/

.tour-wrap{position: relative;clear: both;max-width: 1500px;}
/*.tour-wrap::before{position: absolute;content: '';width: 90%;height: 95%;right:0;top: 50px; background-color: #d1eefc;border-radius: 25px;z-index: 1;}*/
.tour-wrap::before{position: absolute;content: '';width: 90%;height: 95%;right:0;top: 50px; background: linear-gradient(to top, #d1eefc,#d9effa);border-radius: 25px;z-index: 1;}

.tour-wrap a{
	position: relative;
	margin: 0 auto;
    display:flex;
	flex-wrap: wrap;
	font-family: var(--family-basic);
	line-height: 2em;
	color: #6d6d6d;
	margin: 0 auto;
	z-index: 30;	
	/*align-items:center;*/
}
.tour-txt{width:50%;position: relative;padding-top: 80px;}
.tour-txt h3{width: 90%;margin: 0 auto;font-family: var(--family-basic);font-size: 25px; line-height: 1.5em; color: #154859; padding: 0 0 15px 0;}
.tour-pic{width:50%;max-width: 800px; position: relative;height: 100%;aspect-ratio: 10 / 7;}
.tour-pic img{border-radius: 25px;}

p.subtitle {width: 90%;font-size: 15px;color: #fff;margin: 0 auto;}
p.subtitle span{display: inline-block;margin: 5px 3px;background-color:#154859;color: #fff;padding: 5px 8px;border-radius: 10px; }

ul.tour-mark{width: 80%; padding-left: 40px;margin: 10px;}
ul.tour-mark li{font: 500 15px "微軟正黑體";	line-height: 1.8em;color: #363636;margin-top: 8px;list-style-image: url("../img/icon.webp");}

.tour-price{width: 90%;margin: 20px auto; text-align:right;font-weight: 600; font-size: 15px;line-height: 1.5em;color: #c31c1c;}
.tour-price strong{font: 600 25px "Anton", sans-serif;margin: 0 2px;letter-spacing:1px;}


/*綜合行程*/
.all-main{max-width: 1100px;width: 90%; margin: 0 auto 40px auto;font-family: var(--family-basic)}
.tour-list {width: 100%;margin: 0 auto;}
.tour-list a {display:flex;padding: 10px;overflow: hidden;border-bottom: dashed 1px #b1b1b1;text-decoration: none;
			justify-content:space-between;align-items:center;}
.tour-list a:hover {}
.name-l{flex:0 0 88%;font-size: 18px;color:#154859;line-height: 1.5em;font-weight: 600;}
.name-l span{font-size: 15px;color: #99944d;margin-left: 5px;}
.name-l em{font-style:normal;font-size: 15px;color: #fff;border-radius: 5px;padding: 3px; background-color: #2c5d71;margin-right: 5px;}
.price-r{flex:0 0 12%; text-align:right;font-weight: 600; font-size: 15px;line-height: 1.5em;color: #c31c1c;}
.price-r strong{font: 600 20px "Anton", sans-serif;margin: 0 2px;letter-spacing:1px;}


/*錨點*/
.block-first{overflow: hidden;padding-top: 40px;padding-bottom: 40px;}
.block-second{}

.flex-center {	
	justify-content: center;
}
.flex-end {	
	justify-content: flex-end;	
}
.flex-between {	
	justify-content: Space-between;	
}
.flex-row-right {	
	flex-direction: row-reverse;	
}

/*------media query----------*/
@media only screen and ( max-width:1500px) {
.product-slide::after{
	position: inherit;
	background: none;	
}
.product-slide::before{
	position: inherit;
	background: none;
}
.header-content{left: 3%;}	
.header-title{left: 1%;bottom: 8%;}
.intro-wrap ul{width: 90%;}	
	
}
@media only screen and ( max-width:1200px) {
.header-content{left: 0;padding-bottom: 0;}	
.header-title{max-width: inherit;width: 60%; left: -3%;bottom:5%;}
.intro-wrap{max-width: inherit;width: 60%;}	
.top-box{padding-top: 0;}
.info-txt{min-height: 120px;}
.responsive .slick-dots {margin-top: -25px;}
.intro-wrap ul{width: 85%;}	
}

@media only screen and ( max-width:1100px) {
.tour-from{max-width: inherit;width: 80%;}	
.tour-wrap a{align-items:center;}	
.all-main{max-width: inherit;width: 80%;}
.name-l{flex:0 0 85%;}
.price-r{flex:0 0 15%;}	
}
@media only screen and ( max-width:959px) {	
.tour-from{width: 90%;text-align: center;}	
.tour-wrap{position: inherit;width: 85%; margin: 0 auto;background-color: #d1eefc;border-radius: 25px;}	
.tour-wrap::before{position: inherit;display: none;}	
.tour-wrap a{
	position: inherit;
	display:inherit;
	flex-wrap:nowrap;	
}
.tour-txt{width:100%;position: inherit;margin: 0 auto;padding-top: 20px;text-align: left;}
ul.tour-mark{width: 90%;}	
.tour-pic{width:100%;position: inherit;margin: 0 auto;}	
.tour-pic img{border-radius: 25px 25px 0 0;}	
	
.name-l{flex:0 0 80%;}
.price-r{flex:0 0 20%;}	
}

/*---平板-----*/
@media only screen and ( max-width:768px) 
{
.header-content{padding-top: 40px;}	
.header-content::before{position: inherit;background-color: none;}	
.header-content .product-slide{display: none;}	
.header-title{display: none;}	
.header-content .mobile{display: block;}	
.block-menu,.menu-space {display: none;}
#mainNav{display: none;}
.intro-wrap{max-width: inherit;min-height: inherit;width: 90%;}	
.intro-wrap::after{position: inherit;background: none;}
.intro-wrap::before{position: inherit;background: none;}
.intro-wrap ul{width: 90%;}	

.tour-wrap{width: 100%; margin: 0 auto;}	
.all-main{width: 90%;}	
}
@media only screen and ( max-width:650px) {
.tour-from{width: 95%;}	
.info-txt{min-height: 150px;}
}
@media only screen and ( max-width:600px) {
.intro-wrap h2{font-size: 30px;}
.intro-wrap h3{font-size: 20px;}	
.info-txt {width: 90%;}	
.tour-list a{display:inherit;}	
.name-l{flex:initial;width: 100%; display: block;}
.price-r{flex:initial;width: 100%;display: block;margin-top: 5px;}
}	
/*---手機版-----*/
@media only screen and (max-width:480px) 
{
.intro-wrap h2{font-size: 25px;}	
}