/************************************************************************************
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 ,main ,aside ,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;}
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;}
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()); /* for IE */}
a:hover {text-decoration:none;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;}
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:14px;
	overflow-x: hidden;
}

h1, h2, h3, h4, h5 {
	text-decoration: inherit;
	font: inherit;
	font-weight: inherit;
}

:root {
	scroll-padding-top: 150px;
}


/*wow*/
.wow:first-child {
visibility: hidden;
visibility:visible \9;
}


/*PC
-----------------------------------------------------------------*/
*{box-sizing: border-box;}
/*主框架*/
.container {
	width:100%;
	margin: auto;
	font-family: Verdana,'微軟正黑體';
	background-color: white;
	color: #333333;
	font-weight: 700;
}

.block-center {
	width: 95%;
	max-width: 1500px;
	margin: auto;
	clear: both;
	position: relative;
	overflow: hidden;
}
.block-main {
	width: 100%;
	clear: both;
	text-align: center;
}
.block-all{
	width: 100%;
	margin: auto;
	padding: 0 2rem;
}
/*主視覺*/
.main-mobile,.main-mobile-phone{
	display: none;
}
.main-banner {
    background-image: url(../images/head_bg.jpg);
    background-size: 100%;
    background-repeat: no-repeat;
    height: 45vw;
    display: flex;
}
.main-title {
    margin-top: 10vw;
    width: 36.6vw;
	margin-left: 5vw;
}
.topic{
	height: 12vw;
    background-image: url(../images/head_title.png);
    background-size: 100%;
    background-repeat: no-repeat;
}
.en-jp {
    height: 6vw;
    background-image: url(../images/en_jp.gif);
    background-size: contain;
    background-repeat: no-repeat;
    margin-top: 10vw;
	visibility: hidden;
}
.kv-menu {
    width: 220px;
    margin-top: 20vw;
    margin-left: 1.5vw;
    visibility: hidden;
}
.kv-menu ul li{
	margin-bottom:3vw;
}
.kv-menu ul li a{
	display: block;
    background-repeat: no-repeat;
    height: 30px;
    padding-bottom: 2vw;
    text-indent: -9999px;
}
.kv-menu ul li:nth-child(1) a{
	background-image: url(../images/head_menu_01.png);
}
.kv-menu ul li:nth-child(2) a{
	background-image: url(../images/head_menu_02.png);
}
.kv-menu ul li:nth-child(3) a{
	background-image: url(../images/head_menu_03.png);
}
.kv-menu ul li:nth-child(4) a{
	background-image: url(../images/head_menu_04.png);
}
.kv-menu ul li:nth-child(1):hover a{
	background-image: url(../images/head_menu_hover_01.png);
}
.kv-menu ul li:nth-child(2):hover a{
	background-image: url(../images/head_menu_hover_02.png);
}
.kv-menu ul li:nth-child(3):hover a{
	background-image: url(../images/head_menu_hover_03.png);
}
.kv-menu ul li:nth-child(4):hover a{
	background-image: url(../images/head_menu_hover_04.png);
}
/*向上按鈕*/
#back-top{
	margin-left: 800px !important;
}

/*輪播設定*/
.slick-dots {
	position: absolute;
    bottom: -2rem;
    text-align: center;
    width: 100%;
}

.slick-dots li {
	display: inline-block;
	margin: 0 5px;
}

.slick-dots .slick-active button {
	background: #65a2d8;
}

.tkt-slide .slick-dots .slick-active button {
	background: #39896e;
}
.tkt-slide .slick-dots button {
	background: white;
}
.slick-dots button{
	background: #eceff1;
}
.tkt-slide .slick-dots button,
.slick-dots button {
    border-radius: 50px;
	border:none;
    display: inline-block;
	text-indent: -9999px;
	line-height: 0px;
	height: 15px;
	width: 15px;
}
.slick-dots button:hover,
.tkt-slide .slick-dots button:hover{
	cursor: pointer;
}
.slick-dots button:hover {
	background: #c7c7c7;
}
.tkt-slide .slick-dots button:hover {
	background: #d9d9d9;
}


/*主選單*/
.all-menu {
	width: 100%;
    clear: both;
	background: rgba(255, 255, 255, 0.95);
	opacity: 0;
}
.all-menu ul {
	width: 100%;
    clear: both;
    max-width: 1200px;
    text-align: center;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
	padding:0.5rem 0;
}
.all-menu ul li{
	display: block;
	width: calc(100%/4);
}
.all-menu ul li a {
	display: block;
    text-align: center;
    background-position: center;
    background-repeat: no-repeat;
    height:55px;
    text-indent: -9999px;
	border-radius: 3rem;
}
.all-menu ul li:nth-child(1) a ,.all-menu ul li:nth-child(1):hover a{
	background-image: url(../images/menu-bg_01.png);
}
.all-menu ul li:nth-child(2) a ,.all-menu ul li:nth-child(2):hover a{
	background-image: url(../images/menu-bg_02.png);
}
.all-menu ul li:nth-child(3) a ,.all-menu ul li:nth-child(3):hover a{
	background-image: url(../images/menu-bg_03.png);
}
.all-menu ul li:nth-child(4) a ,.all-menu ul li:nth-child(4):hover a{
	background-image: url(../images/menu-bg_04.png);
}
.all-menu ul li:hover a{
	background: #e5efff;
	background-position: center;
	background-repeat: no-repeat;
}
.all-menu ul li.menu-active a{
	background: #cd9f5c;
	background-position: center;
	background-repeat: no-repeat;
}
.all-menu ul li:nth-child(1).menu-active a{
	background-image: url(../images/menu_bg_hover_01.png);
}
.all-menu ul li:nth-child(2).menu-active a{
	background-image: url(../images/menu_bg_hover_02.png);
}
.all-menu ul li:nth-child(3).menu-active a{
	background-image: url(../images/menu_bg_hover_03.png);
}
.all-menu ul li:nth-child(4).menu-active a{
	background-image: url(../images/menu_bg_hover_04.png);
}
.all-menu.sticky {
	opacity: 1;
	top:30px !important;
	box-shadow: 0px 4px 8px rgb(51 51 51 / 12%);
	backdrop-filter: blur(5px);
}


/*商品*/
.block-pkg,.block-tkt,.block-hotel,.block-ticket{
	width: 100%;
    clear: both;
    padding: 120px 0;
	/*padding: 180px 0 80px;
    margin: -90px 0 0 0;*/
}
.block-pkg,.block-hotel{
    background: url(../images/bg_01.jpg)center top;
	background-size:100%;
}
.block-tkt,.block-ticket{
    background: url(../images/bg_02.jpg)center top;
	background-size:100%;
}

.block-product-big-title {
	width: 100%;
	clear: both;
	text-align: center;
	margin: 0 auto 40px auto;
}

.block-ticket .block-product-big-title {
	margin: 0 auto;
}

/*自由行*/
/*頁籤*/
.flex-box{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
ul.block-tab {
	width: 100%;
	clear: both;
	box-sizing: border-box;
	gap: 10px;
}
.block-tab li {
	display: inline-block;
}
.block-tab a {
	display:inline-block;
    text-align: center;
    padding:10px 15px;
	box-sizing: border-box;
    color: #4888c2;
    font-size: 24px;
    font-weight: bold;
    letter-spacing: 1px;
	border-radius: 2rem;
}
.block-tab a > h2 {
	display: inline-flex;
	align-items: center;
}
.block-tab a > h2 > i.icon{
	display: block;
	width: 27px;
	height: 26px;
	background-repeat: no-repeat;
	background-image: url('../images/flower_icon.png');
	margin-right: 0.5rem;
}
.tab-active a,.block-tab a:hover{
	background: #2183dd;
	color: #ffffff;
}
.block-tab a:hover > h2 > i.icon,
.tab-active a > h2 > i.icon{
	background-image: url('../images/flower_icon_hover.png');
}
/*內容*/
.tabs-con {
	width: 100%;
	clear:both;
	margin: 1rem 0;
}
.pkg-container{
	display: block;
	width: calc(100% / 4);
	padding: 1.5rem;
	background-color: white;
	row-gap: 10px;
	transform: translateY(0);
}
.pkg-container:hover{
	background-color: #f3f2f2;
	border-radius: 1rem;
	transform: translateY(10px);
}
.pkg-img>img{
	border-radius: 5rem;
	margin-bottom: 1rem;
}
.pkg-container:hover .pkg-img>img{
	opacity: 0.9;
}
.pkg-content{
	padding: 0.5rem;
}
.goods-title {
    display: block;
    border-left: 4px solid #333333;
    padding-left: 0.75rem;
    font-size: 20px;
    line-height: 1.2;
    margin-bottom: 1.5rem;
}
ul.pkg-detail{
	margin-bottom: 2rem;
}
ul.pkg-detail li {
    color: #4477a3;
    font-size: 1rem;
    display: list-item;
    list-style-image: url(../images/b-dot.png);
    margin-bottom: 0.75rem;
    margin-left: 1rem;
    font-weight: 700;
	line-height: 1.2;
}
.price{
	text-align: center;
}
.price >p{
	font-size: 16px;
}
.price >p>span.red{
	color: #e60012;
}
.price >p>span.red>b{
	font-size: 1.75rem;
	font-weight: bold;
}
/*城市快搜*/
.sec-wraper{
	margin: 3rem 0;
}
a.city-box{
	position: relative;
    background-color: #58b0fd;
	border-radius: 1.5rem;
	overflow: hidden;
	margin-right: 0.5rem;
}
a.city-box img {
    opacity: 0.5;
}
a.city-box:hover img{
	opacity: 1;
}
a.city-box h3.city-title{
	text-align: center;
    position: absolute;
    left: 0;
    right: 0;
    top: 35%;
    bottom: 0;
    margin: auto;
    z-index: 1;
    font-size: 26px;
    font-weight: bold;
    color: white;
    text-shadow: 0 0 5px #3F51B5;
}
/*機票*/
.tkt-block {
    margin-bottom: 6rem;
}
a.txt-location {
    display: inline-block;
    position: relative;
	transform: translateY(0);
	margin: 0.5rem;
}
a.txt-location >img{
	border-radius: 2rem;
}
h3.tkt-title {
    position: absolute;
    z-index: 2;
    top: 20px;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    color: white;
    font-weight: bold;
    font-size: 35px;
    width: 35px;
}
span.tkt-icon {
    display: block;
    margin-top: 0.75re;
}
a.txt-location:hover{
	transform: translateY(10px);
}
a.txt-location:hover img{
	opacity: 0.9;
}
.tkt-btn-wraper{
    margin: 3rem 0;
}
a.tkt-btn {
    display: inline-flex;
    color: white;
    font-size: 26px;
    font-weight: bold;
    background-color: #39896e;
    padding: 1rem 2rem;
    border-radius: 1.5rem;
    box-shadow: 0 4px 0 #5ca97e;
    transform: translateY(0);
    margin: 0.5rem;
}
a.tkt-btn:hover{
	background-color: #3eb38c;
	box-shadow: 0 1px 0 #5ca97e;
	transform: translateY(3px);
}
span.tkt-btn-icon{
	display: block;
	margin-right: 0.5rem;
}
/*訂房*/

.block-product-hotel {
    padding: 2rem 2rem 3rem;
    background-color: #4888c2;
    margin: 6rem 0 6rem;
	position: relative;
}
.block-product-hotel:after {
    position: absolute;
    content: "";
    display: block;
    width: 100%;
    height: 26px;
    background-repeat: repeat-x;
    background-image: url(../images/hotel_bg.jpg);
    bottom: -26px;
}
.hotel-goods-topic {
    width: calc(100% - 80%);
}
.hotel-goods {
    width: calc(100% - 20%);
    position: relative;
    margin-top: -5rem;
	margin-bottom: 0;
    z-index: 1;
}
.hotel-container:first-child{
	border-top-left-radius: 2rem;
	overflow: hidden;
}
.hotel-container:last-child{
	border-top-right-radius: 2rem;
	overflow: hidden;
}
a.hotel-container {
    width: calc(100% / 3);
    background-color: white;
}
a.hotel-container:hover{
	background-color: rgb(218, 218, 218);
}
h3.goods-title-hotel {
    text-align: center;
    margin: 0 auto 1rem;
    font-size: 20px;
}
.goods-dteail {
    text-align: center;
    margin-bottom: 2rem;
	line-height: 18px;
}
.hotel-content {
    padding: 1rem 2rem;
}
.hotel-title-img {
    width: 70%;
    border: 2px solid white;
    text-align: center;
    padding: 2rem;
    border-radius: 100px;
    margin: auto;
}
a.hotel-container:hover .hotel-img{
	filter: saturate(1.5);
}

/*票券*/
.ticket-wraper.flex-box {
    margin: 0rem 0 5rem;
	align-items: flex-start;
}
a.ticket-content {
    background: white;
    text-align: center;
    width: calc(100% / 3 - 2rem);
    margin: auto;
    border-radius: 200px;
    overflow: hidden;
	transform: translateY(0);
}
a.ticket-content:hover {
	background-color: rgb(233, 233, 233);
	transform: translateY(10px);
}
img.ticket-img-top {
    margin-top: -90px;
    margin-bottom: 0;
}
img.ticket-img-bottom {
    margin-top: 0px;
    margin-bottom: -15px;
}
a.ticket-content h3{
	font-size: 40px;
	font-weight: bold;
	letter-spacing: 1px;
	margin-bottom: 1rem;
}
a.ticket-content span {
    font-size: 20px;
    color: #7d7979;
    font-weight: 500;
}
.ticket-inner {
    margin: 2rem 0;
}

.ticket-inner h4 {
	font-size: 18px;
	font-weight: normal;
}

a.ticket-content:nth-child(2) {
   margin-top:2rem;
}
.item-search{
	margin: 2rem 0;
}
a.item{
	display: block;
	width: 150px;
	height: 150px;
	background-color: white;
	color: #39896e;
	margin: 1rem;
	border-radius: 50%;
	text-align: center;
	font-size: 18px;
}
a.item:hover{
	background-color: #39896e;
	color: white;
}
a.item i.item-icon{
	display: block;
	height: 67px;
	width: auto;
	background-repeat: no-repeat;
	background-position: center top;
	margin-top: 1rem;
	margin-bottom: 0.75rem;
}
a.item:nth-child(1) i.item-icon{
	background-image: url(../images/ticket_search_icon_01.png);
}
a.item:nth-child(2) i.item-icon{
	background-image: url(../images/ticket_search_icon_02.png);
}
a.item:nth-child(3) i.item-icon{
	background-image: url(../images/ticket_search_icon_03.png);
}
a.item:nth-child(4) i.item-icon{
	background-image: url(../images/ticket_search_icon_04.png);
}
a.item:nth-child(5) i.item-icon{
	background-image: url(../images/ticket_search_icon_05.png);
}
a.item:nth-child(6) i.item-icon{
	background-image: url(../images/ticket_search_icon_06.png);
}
a.item:nth-child(7) i.item-icon{
	background-image: url(../images/ticket_search_icon_07.png);
}
a.item:hover:nth-child(1) i.item-icon{
	background-image: url(../images/ticket_search_icon_hover_01.png);
}
a.item:hover:nth-child(2) i.item-icon{
	background-image: url(../images/ticket_search_icon_hover_02.png);
}
a.item:hover:nth-child(3) i.item-icon{
	background-image: url(../images/ticket_search_icon_hover_03.png);
}
a.item:hover:nth-child(4) i.item-icon{
	background-image: url(../images/ticket_search_icon_hover_04.png);
}
a.item:hover:nth-child(5) i.item-icon{
	background-image: url(../images/ticket_search_icon_hover_05.png);
}
a.item:hover:nth-child(6) i.item-icon{
	background-image: url(../images/ticket_search_icon_hover_06.png);
}
a.item:hover:nth-child(7) i.item-icon{
	background-image: url(../images/ticket_search_icon_hover_07.png);
}

.pkg-text {
	width: 100%;
    text-align: left;
    padding: 10px 20px;
    box-sizing: border-box;
    font-size: 15px;
    line-height: 25px;
    color: #2183dd;
    background: #e9f3fd;
    border-radius: 10px;
}

.main-header {
    margin: 40px auto 0 auto;
    text-align: center;
    padding: 40px 0;
    border-top: 1px solid #e9f3fd;
    border-bottom: 1px solid #e9f3fd;
	font-size: 15px;
	line-height: 24px;
	color: #333333;
}

.main-header.block-center {
	max-width: 960px;
}

.main-header h1 {
	font-size: 25px;
    line-height: 32px;
    width: 100%;
    margin: 0 0 10px 0;
    color: #2183dd;
}

.block-menu .unsticky {
	display: none;
}

.block-menu .sticky {
	display: inline-block;
	height: 70px;
}




/*中間調度區
-----------------------------------------------------------------*/
@media (max-width:1200px) {
	.kv-menu{display: none;}
	.main-title {
		margin-top: 10vw;
		width: 43.6vw;
	}
	.topic {
		height: 14vw;
	}
	.all-menu{
		opacity: 1;
	}
	.all-menu ul {
		width: 95%;
	}
	ul.block-tab {
        width: 100%;
        margin: 0 auto;
    }
	.pkg-container {
		width: calc(100% / 3);
	}
	.block-tab a > h2 > i.icon {
		display: none;
	}
}
@media (max-width:1080px) {
	.all-menu ul li a {
        text-indent: 0;
        line-height: 60px;
        font-size: 3.2vw;
        font-weight: bold;
        color: #89aaca;
    }
	.all-menu ul li:nth-child(1) a ,.all-menu ul li:nth-child(1):hover a,
	.all-menu ul li:nth-child(2) a ,.all-menu ul li:nth-child(2):hover a,
	.all-menu ul li:nth-child(3) a ,.all-menu ul li:nth-child(3):hover a,
	.all-menu ul li:nth-child(4) a ,.all-menu ul li:nth-child(4):hover a{
		background-image:none;
	}
	.all-menu ul li.menu-active a{
		color: white;
		background: #cd9f5c;
	}
	.all-menu ul li:nth-child(1).menu-active a,
	.all-menu ul li:nth-child(2).menu-active a,
	.all-menu ul li:nth-child(3).menu-active a,
	.all-menu ul li:nth-child(4).menu-active a{
		background-image: none;
	}
	
}
@media screen and (max-width: 1060px) {
	html,
    body {
        width: 100%;
        min-height: 100%;
	}
	.block-tab a {
		font-size: 24px;
	}
	.block-product-big-title-01{
		width: 80%;
	}
	.hotel-goods-topic {
		display: none;
	}
	.hotel-goods {
		width: 100%;
		margin-top: 0;
		margin-bottom: 0;
		z-index: 1;
	}
	.block-product-hotel {
		padding: 1rem;
		background-color: #4888c2;
		margin: 2rem 0;
	}
	a.ticket-content {
		width: calc(100% / 3 - 1rem);
	}
	a.ticket-content h3 {
		font-size: 30px;
	}

}
@media screen and (max-width: 960px) {
	h3.tkt-title::after {
		display: block;
		content: "";
		width:30px;
		height: 31px;
		background-image: url(../images/tkt_title_icon_s.png);
		margin-top: 0.5rem;
	}
	span.tkt-icon {
		display: none;
	}
	
}
@media screen and (max-width: 915px) {
	.block-tab li {
		width:auto;
		margin-bottom: 5px;
	}
	.pkg-container {
		width: calc(100% / 2);
	}
}




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

@media screen and (max-width: 768px) {
	.main-mobile {
		display: block;
	}

	.block-main {
		display: none;
	}
	
	.all-menu ,.block-menu .sticky {
		display: none;
	}

	.block-center {
		margin: 0 auto;
	}
	.block-product-big-title-sec{
		width: 70%;
	}
	.block-pkg,.block-tkt,.block-hotel,.block-ticket{
		padding: 80px 0;
		/*padding: 180px 0 80px;
		margin: -90px 0 0 0;*/
	}

	.main-header {
		margin: 20px auto !important;
	}

	.block-tab a {
		padding: 15px 10px;
	}

	.block-tab a > span > i.icon {
		display: none;
	}

	.main-header h1 {
		font-size: 20px;
    	line-height: 30px;
	}
	
}
@media screen and (max-width: 730px) {
	a.ticket-content {
        width: calc(100% / 2 - 1rem);
    }
	a.ticket-content:nth-child(2) {
		margin-top: 0rem;
	}
}

/*中間調度區
-----------------------------------------------------------------*/
@media (max-width:600px) {
	
	.main-mobile {
		display: none;
	}

	.main-mobile-phone {
		display: block;
	}
	
	a.hotel-container {
		width: calc(100% / 2 - 1rem);
		background-color: white;
		margin: auto auto 1rem;
		overflow: hidden;
		border-top-left-radius: 2rem;
		border-top-right-radius: 2rem;
	}

	.block-ticket .block-product-big-title {
		margin: 0 auto 20px auto;
	}

}

@media (max-width:500px) {
	.pkg-container {
        width: 95% ;
    }
	a.hotel-container {
		width: 100%;
		background-color: white;
		margin: 1rem;
	}
	a.ticket-content {
        width: 85%;
        margin-bottom: 2rem;
    }
	.ticket-wraper.flex-box {
		margin: 0rem 0 3rem;
	}

	

	.block-tab a {
		border-radius: 10px;
		padding: 10px 15px;
	}

	.block-tab li {
		margin: 0;
	}

	.block-product-big-title {
		margin: 0 auto 10px auto;
	}	
}

/*手機
-----------------------------------------------------------------*/
@media (max-width: 400px) {
	a.city-box{
		margin-right: 0.35rem;
	}
}
@media (max-width: 480px) {
	.block-tab a {
        font-size: 22px;
    }
}

@media (max-width: 320px) {
	
}