@charset "utf-8";
* {
	margin: 0;
	padding: 0;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	font-family: "Segoe UI", Arial, Helvetica, "Microsoft JhengHei Correct", 'Microsoft JhengHei', PMingLiU, sans-serif;
}
body {
	font-size: 16px;
	color: #333;
	line-height:1.5
}
.fixed body {
	margin-top: 102px
}
#fixed_bar .logoicon {
	width: 188px !important;
	height: 59px !important;
	margin-top: 0 !important;
	/*margin-bottom: 5px !important */
}
.anchor_hide {
	display: block;
	height: 102px;
	margin-top: -102px;
	z-index: -1;
	visibility: hidden
}
.button-center .more {
	display: inline-block;
	padding: 5px 10px;
	color: #fff;
	background-color: #c00;
	-webkit-transition: 0.4s all;
	-o-transition: 0.4s all;
	transition: 0.4s all
}
.button-center .more:hover {
	background-color: #F00
}
h1{display: inline-block}
.maple h1 ,
h2 {
	font-size: 24px;
	font-weight: normal;
	margin-bottom: 10px;
	line-height: 1.5;
	color: #930;
	background: url(../images/title-bg.svg) no-repeat top left;
	text-indent: 40px;
	-webkit-background-size: 36px 36px;
	background-size: 36px 36px
}
.attraction_page h2{text-indent:0;}
h3 {
	font-size: 20px;
	vertical-align: middle
}
h3 .grid_address {
	background-image: url(../images/mapicon.html);
	background-repeat: no-repeat;
	-webkit-background-size: 22px 22px;
	background-size: 22px 22px;
	text-indent: 20px;
	font-weight: normal;
	font-size: 15px;
	color: #333;
	display: block
}
a {
	text-decoration: none
}
h3, h3 a {
	color: #099;transition:all .4s;
}
.attraction_page .point_data h3{color: #333;}
h3 a:hover{
	color: #069
}
input {
	-webkit-appearance: none;
	border-radius: 0
}
em {
	font-style: normal
}
img {
	max-width: 100%
}
.remind {
	display: block;
	color: red
}
.container {
	max-width: 1100px;
	width: 100%;
	margin: 0 auto
}
article {
	margin: 40px 0
}
.button-center {
	text-align: center;
	margin-top: 20px
}
.swiper-arrow {
	position: relative;
	z-index: 0
}
.swiper-arrow .swiper-button-prev, .swiper-arrow .swiper-button-next {
	height: 100%;
	top: 0;
	-webkit-background-size: 70% auto;
	background-size: 70% auto;
	margin: 0;
	opacity: 0.7
}
.swiper-arrow .swiper-button-next.swiper-button-disabled, .swiper-arrow .swiper-button-prev.swiper-button-disabled {
	opacity: 0
}
.swiper-arrow .swiper-button-next {
	right: -65px;
	background-image: url(../images/blue-arrow-next.svg)
}
.swiper-arrow .swiper-button-prev {
	left: -65px;
	background-image: url(../images/blue-arrow-prev.svg)
}
.swiper-wrapper {
	-webkit-transition-timing-function: ease-in-out;
	-o-transition-timing-function: ease-in-out;
	transition-timing-function: ease-in-out
}
.swiper-container {
	padding: 20px 0;
	background: transparent !important
}
.swiper-pagination {
	position: static !important
}
.swiper-button-prev, .swiper-button-next {
	width: 50px;
	height: 100%;
	top: 0
}
.swiper-button-next {
	right: 0
}
.swiper-button-prev {
	left: 0
}
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {
	opacity: 0
}
.bg {
	height: 560px;
	position: relative;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align:initial;
	-webkit-align-items:initial;
	-ms-flex-align:initial;
	align-items:initial;
	z-index:9;
}
.bg .bg-box {
	position: absolute;
	overflow: hidden;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.bg .bg-box svg{display: block;margin: auto;width:1920px;
left: 50%;
position: absolute;
transform: translateX(-50%);
}
/*
.bg .bg-box .dolphins {
	position: absolute;
	max-width: 1670px;
	width: 1670px;
	left: 50%;
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	bottom: -300px
}
.bg .bg-box .cloud {
	position: absolute;
	max-width: 2000px;
	width: 2000px;
	left: 50%;
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	transform: translateX(-50%);
	bottom: -120px
}
*/
.bg>.container {
	z-index: 2;
	position: relative;
	text-align: center
}
.bg .title {
	margin:90px auto 20px auto;
	max-width: 400px;
	width: 100%
}
.bg >.container p{margin: 0 0 40px;
}
nav a {
	font-size: 20px;
	color: #333;
	display: block;
	text-align: center;
	padding: 20px 0 5px;
	border-bottom: 5px solid #fff
}
nav#fixed_nav  a {
	padding: 10px 0 5px;
}
.tab-wrap {
	max-width: 100%;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	position: relative;
	list-style: none;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	justify-content: center;
	margin: 20px 0 0 0;
}
.tab-wrap .tab {
	display: none
}
.tab-wrap .tab:checked:nth-of-type(1) ~ .tab-content:nth-of-type(1) {
	opacity: 1;
	-webkit-transition: .8s all ease-in-out;
	-o-transition: .8s all ease-in-out;
	transition: .8s all ease-in-out;
	position: relative;
	top: 0;
	z-index: 1
}
.tab-wrap .tab:checked:nth-of-type(2) ~ .tab-content:nth-of-type(2) {
	opacity: 1;
	-webkit-transition: .8s all ease-in-out;
	-o-transition: .8s all ease-in-out;
	transition: .8s all ease-in-out;
	position: relative;
	top: 0;
	z-index: 1
}
.tab-wrap .tab:checked:nth-of-type(3) ~ .tab-content:nth-of-type(3) {
	opacity: 1;
	-webkit-transition: .8s all ease-in-out;
	-o-transition: .8s all ease-in-out;
	transition: .8s all ease-in-out;
	position: relative;
	top: 0;
	z-index: 1
}
.tab-wrap .tab:checked+label {
	cursor: default
}
.tab-wrap .tab+label {
	cursor: pointer;
	display: block;
	text-decoration: none;
	text-align: center;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-transition: 0.4s all;
	-o-transition: 0.4s all;
	transition: 0.4s all;
	width:33.33%
}
.tab-wrap .tab-content {
	padding: 20px 10px 0 10px;
	position: absolute;
	width: 100%;
	z-index: -1;
	opacity: 0;
	left: 0
}
.search_bar {
	padding: 10px;
	margin:10px auto 0px
}
.search_bar .btns {
	color: #fff !important
}
#news .swiper-slide{width: 540px;}
.news_new .swiper-container{padding:20px 0 0 0;}
.news_new {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: start;
	-webkit-align-items: flex-start;
	-ms-flex-align: start;
	align-items: flex-start
}
.news_new>a {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	z-index: 1
}
.news_new img {
	width: 40%
}
.news_new .new_info {
	width: 60%;
	padding-left: 20px
}
.news_new .new_info h3 {
	color: #099;
	margin-bottom: 10px
}
.news_new .new_info p {
	line-height: 1.5;
	padding-bottom: 10px
}
.offer .swiper-slide {
	width: 366px;
	border: 1px solid #eee;
	-webkit-transition: 0.4s all;
	-o-transition: 0.4s all;
	transition: 0.4s all;
	-webkit-transform: scale(0.9);
	-ms-transform: scale(0.9);
	transform: scale(0.9);
	opacity: .7
}
.offer .swiper-slide::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: block;
	z-index: 3
}
.offer .swiper-slide-active {
	-webkit-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	opacity: 1;box-shadow:0 5px 10px rgba(0,0,0,0.5);
}
.offer .swiper-slide-active::after {
	display: none
}
.offer .grid_list .grid_beroom {
	top: auto;
	bottom: -17.5px
}
.offer .grid_list .grid_txt {
	padding: 20px 10px 10px 10px
}
.hotels .container{border-bottom:1px solid #ccc;padding:0 0 20px;}
.hotels .tab-wrap img {
}
.hotels .tab-content {
	border-top: 3px solid #ccc;margin-top: -3px;
}
.hotels .hotels-type {
	display: -webkit-inline-box;
	display: -webkit-inline-flex;
	display: -ms-inline-flexbox;
	display: inline-flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-webkit-flex-direction: column;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	justify-content: center;
	padding:10px 20px;/* border-bottom:3px solid #ccc; */ z-index:3;position:relative;transition:all 0.3s;
border-radius:10px;background: #EEE;margin:0 0 5px 0;
}
.hotels .hotels-type:hover{/*border-bottom:3px solid #999;*/background: #CEE;border-radius:20px;
}
.hotels .hotels-type svg{width:14px;height: 18px;fill:#099;transition:all 0.3s;}
.hotels .hotels-type:hover svg{fill:#099;}
.hotels .tab-wrap .tab:checked + label .hotels-type svg{fill:#099}
.hotels .tab-wrap .tab:checked+label .hotels-type {
	-webkit-transition: 0.4s all;
	-o-transition: 0.4s all;
	transition: 0.4s all;
	border-bottom: 3px solid #099;background: #cee;margin:3px 0 0 0;
	border-radius: 30px 30px 0 0;}
.hotels .swiper-slide{width: 240px;
}
.grid_list {
	position: relative
}
.grid_list .grid_link {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 3;transition: all .5s;}
.grid_list .grid_link:hover{background-color: rgba(255,255,255,0.3);}
.grid_list .grid_beroom {
	font-size: 16px;
	position: absolute;
	top: 5px;
	left: 0;
	padding: 5px 10px;
	color: #fff;
	background-color: #F90;z-index: 2;
}
.grid_list .grid_pic {padding: 37% 0;
	position: relative;
}
.attraction_page .grid_list .grid_pic {padding:0;
	position: relative;
}
.grid_list .grid_pic a {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 3
}
.grid_list .grid_clear{display: block;clear: both;}
.grid_list .img_bg {
	object-fit: cover;
	width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
.grid_list .grid_txt {
	padding-top: 5px
}
.grid_list .grid_name, .grid_list .grid_address {
	white-space: nowrap;
	-o-text-overflow: ellipsis;
	text-overflow: ellipsis;
	overflow: hidden;
	display: block
}
.grid_list .grid_name {
	margin-bottom: 5px
}
.grid_list .grid_address {
	background: url("data:image/svg+xml;charset=utf-8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 18' fill='%23999'><path d='M6,0.5c-4,0-7.1,4.4-4.6,8.6C2,10.2,6,16.9,6,17s4-6.7,4.6-7.8C13.1,4.9,10,0.5,6,0.5z M6,8.8 c-3.7,0-3.7-5.6,0-5.6S9.8,8.8,6,8.8z'/></svg>") no-repeat left center;
	-webkit-background-size: 12px 18px;
	background-size: 12px 18px;
	text-indent: 15px;
	font-weight: normal;
	font-size: 15px;
	color: #333;
	margin-top: 5px
}
.grid_list .grid_Prj {
	height: 50px;
	overflow: hidden;
	margin-top: 5px
}
.grid_list .grid_Prj a {
	color: #333
}
.grid_list .grid_rate {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: reverse;
	-webkit-flex-direction: row-reverse;
	-ms-flex-direction: row-reverse;
	flex-direction: row-reverse;
	-webkit-box-align: end;
	-webkit-align-items: flex-end;
	-ms-flex-align: end;
	align-items: flex-end
}
.grid_list .grid_booking {
	padding: 3px 25px;
	color: #fff;
	background-color: #f60
}
.grid_list .grid_prices {
	color: red;
	margin-right: 10px
}
.stroke{background:#bef;padding: 20px 0;;position: relative;}
.stroke .areas {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;align-items: center;
	margin-bottom: 20px;flex-wrap: wrap;margin-left:-10px;
}
.stroke .area {flex: 1 1 260px;position: relative;margin: 0 0 10px 10px;text-align: center;}
.stroke .areas a {display: block;color:#000;position: relative;top:0;padding: 0 0 30px;transition:all 0.5s;z-index: 2}
.stroke .areas a:hover{}
.stroke .area img{transition:all 0.2s;width: 100%;object-fit: cover;height:190px;border-radius:20px}
.stroke .area a:hover img{opacity:0.8;}
.stroke .container{position: relative;z-index: 3}
.stroke .area span{transition:all 0.5s;text-align:center;display:inline-block;padding:0.3em 1em;letter-spacing:3px;background: rgba(230,230,230,0.8);position:relative;top:-10px;box-shadow:0 3px 5px -2px rgba(0,0,0,0);border-radius:5px}
.stroke .area a:hover span{background: rgba(230,230,230,1);box-shadow:0 3px 5px -2px rgba(0,0,0,0.8)}
.stroke .area .beroom{top: 0px;position: absolute;left: 50%;border-radius: 0 0 5px 5px;transform: translateX(-50%);padding: 0.2em 1em;background:rgba(0,0,0,0.5);color: #FFF;}
.stroke .area a:hover .beroom{background:rgba(0,0,0,0.8);color: #FFF;}

.route form {
	padding: 10px;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	-webkit-justify-content: space-between;
	-ms-flex-pack: justify;
	justify-content: space-between;
	text-align: center;
	background-color: #ebfafd
}
.route form select {
	border: 1px solid;
	font-size: 16px;
	height: 35px;
	padding: 0 0 0 5px;
	width: 100%;
	color: #666;
	-webkit-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	margin-right: 10px
}
.route form input {
	-webkit-box-flex: 1;
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
	cursor: pointer;
	background-color: #099;
	color: #fff
}
.route .route-lists {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin: 20px 0
}
.route .route-list {
	width: calc(100%/3);
	background: url(../images/list-icon.html) no-repeat left;
	text-indent: 20px;
	line-height: 45px
}
.route .route-list a {
	color: #333;
	white-space: nowrap;
	-o-text-overflow: ellipsis;
	text-overflow: ellipsis;
	overflow: hidden;
	display: block
}
.route .route-map {
	border: 1px solid #099;
	width: 100%
}
.route iframe {
	width: 100%;
	height: 500px
}
.activity { min-height: auto; }

.activity .link-box { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-pack: distribute; justify-content: space-around; }

.activity figure { margin-right: 1%; margin-bottom: 1%; width: 24.25%; max-width: 300px; border-radius: 50%; overflow: hidden; position: relative; }

.activity figure:nth-child(4n) { margin-right: 0; }

.activity figure a { position: absolute; top: 0; left: 0; right: 0; bottom: 0; display: block; z-index: 1; -webkit-transition: 0.4s all; transition: 0.4s all; }

.map{padding: 20px 0}
.map .container{vertical-align: middle;display: flex;flex-wrap: wrap;align-items:center;}
.map h2{display:inline-block;vertical-align:inherit;margin: 0 20px 5px 0;}
.map ul{flex:1 1 25em;display:flex;width:auto;max-width:25em; margin: 0 0 5px -10px;vertical-align:inherit;position:relative;z-index:3;}
.map li{flex:1 1 auto;background:#F66;color:#fff;text-align: center;border-radius:5px;margin:0 0 0 10px;transition:all 0.3s;cursor:pointer;padding: 3px 0;}
.map li.on,
.map li:hover{background:#C02;}
.map .container > .clear{width:100%;height:5px;}
.map_box{display:flex;flex-wrap: wrap;margin:0 0 0 -10px;}
.map .grid_list{flex: 1 1 300px; background:#fff;border-radius:15px;margin:0 0 10px 10px;padding:10px;}
.map .grid_list img{width:100%;height:250px;object-fit:cover}
.map .grid_beroom{top:20px;}
.map .grid_list .grid_address{margin:0;white-space:inherit;}
.map .grid_list p{margin:5px 0 0 0;}
.map .grid_list .icon1,
.map .grid_list .icon2,
.map .grid_list .icon3{background-size:100% auto;float:right;width:100px;height: 100px;margin:-70px 0 0 -20px;position:relative;z-index: 2}
.map .grid_list .icon1{background:url(../images/icon1.svg);}
.map .grid_list .icon2{background:url(../images/icon2.svg);}
.map .grid_list .icon3{background:url(../images/icon3.svg);}


#map_svg{flex: 1;
    position: relative;
    margin: -50px 0 -30px -10px;}
	.micon0{/* fill:#C35; */stroke:#FFF;stroke-miterlimit:10;}
	.micon1{fill:#FFF;stroke:none;}
	#map_svg #taiwan{fill:#DE7;stroke:#9B3;}
	#map_svg .l3{fill:none;stroke:#666;stroke-linecap:round;stroke-linejoin:round;stroke-width:1;stroke-dasharray:2;transition:all 0.5s;}
	#t text{fill:#666;font-size:20px;transition:all 0.5s;}
	#map_svg .n12{fill:none;stroke:#6CD;}
	#map_svg .n9{stroke-width:0.4;}
	#map_svg .n10{stroke-width:0.2;}
	#map_svg .n13{fill:#6CD;}
#t > g use{transition:all 0.5s;fill:#C35;}
#t > g{cursor: pointer;transition:all 0.5s;}
#t > g.hover .l3,
#t > g:hover .l3{stroke-dasharray:3;stroke-width:1.1;stroke:#039;}
#t > g.hover text,
#t > g:hover text{fill:#039;}
#t > g.hover use,
#t > g:hover use{fill:#C00;}


.hotspring ul{display: flex;flex-wrap: wrap;margin:0 0 0 -10px;text-align: center}
.hotspring li{flex:1 1 4em;border-radius:19px;margin:0 0 20px 10px;border:2px solid #ccc;background:#eee;padding:5px 0;cursor: pointer;transition: 0.4s all;}
.hotspring li:hover{border:2px solid #099;background:#eee;}
.hotspring li.on{border:2px solid #099;background:#Cee;}
.hotspring .grid_lists{display: flex;flex-wrap: wrap;margin:0 0 0 -20px;}
.hotspring .grid_list{flex:1 1 350px;margin:0 0 20px 20px;}
.hotspring .grid_link{border:0 solid rgba(0,175,175,0.2);}
.hotspring .grid_link:hover{background:none;border:10px solid rgba(0,175,175,0.2);}
.hotspring .grid_txt{padding: 10px;}
.hotspring .grid_list .grid_pic{background:url(../images/loading.html) no-repeat center center;background-size:30px auto}

.maple ul.m{float:right;font-size: 16px;}
.maple .m li{float:left;width: 9em;border-radius:19px;margin:0 0 20px 10px;border:2px solid #ccc;background:#eee;padding:5px 0;cursor: pointer;transition: 0.4s all;text-align: center}
.maple .m li:hover{border:2px solid #099;background:#eee;}
.maple .m li.on{border:2px solid #099;background:#Cee;}
.maple h1 {margin:0 0 5px 0;}
.maple h2 {
	font-size: 22px;
	font-weight: bold;
	margin:0 0 5px 0;
	line-height: 1.5;
	color: #c00;
	background:none;
	text-indent: 0;}
.maple p{
	margin:0 0 20px 0;
}
.maple a{text-decoration: underline;color: #333;transition: 0.4s all;}
.maple a:hover{text-decoration:none;color: #066;}
.maple article{display:none;}
.maple .pic img,
.maple .picr img{width:100%}
.maple .pic,
.maple .picr{max-width: 50%;}
.maple .pic{float:left;margin:0;padding:0 10px 10px 0;}
.maple .picr{float:right;margin: 0;padding:0 0 10px 10px;}

.point{margin: 0 0 30px;}
.point ul{display: block;}
.point ul::before{content:"";display: block;clear: both;}
.point li{float:left;width: 13em}
.point.spa li{float:left;width: 8.5em}

nav.point ul a{font-size:1em;padding:5px 0;border-bottom: 0;text-align: left}
nav.point ul a:hover{border-bottom: 0;}
.st0{fill:#FF3333;}
.st1{fill:#FFFFFF;}
.st2{fill:#FFAA00;}
.st3{fill:#CC0022;}
.st4{fill:none;stroke:#4F4F4F;stroke-miterlimit:10;}
.st5{fill:#221122;}
.st6{fill:#FF7700;}
.st7{fill:none;stroke:#FF7700;stroke-width:4;stroke-linecap:round;stroke-miterlimit:10;}
.st8{fill:#CCCC00;}
.st9{fill:none;stroke:#665555;stroke-width:9;stroke-linecap:round;stroke-miterlimit:10;}
.st10{fill:none;stroke:#665555;stroke-width:3;stroke-linecap:round;stroke-miterlimit:10;}
.st11{fill:none;stroke:#665555;stroke-width:5;stroke-linecap:round;stroke-miterlimit:10;}
.st12{fill:#889900;}
.st13{fill:none;stroke:#665555;stroke-width:2;stroke-linecap:round;stroke-miterlimit:10;}
.st14{fill:#BBEEFF;}
.st15{fill:#DDEE77;}
.st16{fill:none;stroke:#57C0CC;stroke-width:10;stroke-miterlimit:10;}
.st17{fill:none;stroke:#57C0CC;stroke-width:3;stroke-miterlimit:10;}
.st18{fill:none;stroke:#7F7F7F;stroke-width:1.5;stroke-miterlimit:10;}
.st19{fill:none;stroke:#FFFFFF;stroke-width:10;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}
.st20{fill:#00BBDD;}
.st21{fill:#0088AA;}
.st22{fill:#006699;stroke:#FFFFFF;stroke-width:3;stroke-miterlimit:10;}
.st23{fill:#FF9900;}
.st24{fill:#FF4400;stroke:#CC4400;stroke-width:5;stroke-miterlimit:10;}
.st25{fill:none;stroke:#221122;stroke-width:10;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}
.st26{fill:none;stroke:#FFFFFF;stroke-width:3;stroke-miterlimit:10;}
.st27{fill:none;stroke:#FF3333;stroke-width:7;stroke-miterlimit:10;}
.st28{fill:none;stroke:#FF3333;stroke-width:4;stroke-miterlimit:10;}
.st29{fill:none;stroke:#FF3333;stroke-width:13;stroke-miterlimit:10;}
.st30{fill:none;stroke:#4F4F4F;stroke-width:8;stroke-miterlimit:10;}
.st31{fill:#FF274B;}
.st32{fill:#00CC99;}
.st33{fill:#009966;}
.st34{fill:#86D8FF;}
.st35{fill:none;stroke:#FFFFFF;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}
.st36{fill:none;stroke:#FFFFFF;stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;}
.st40{clip-path:url(#train_cloud2);}
		/* 飛碟 */
	#turn2 .sit{animation:sit 7s linear infinite;}
	#turn2 .sit1{animation-delay:-6s;}
	#turn2 .sit2{animation-delay:-5s;}
	#turn2 .sit3{animation-delay:-4s;}
	#turn2 .sit4{animation-delay:-3s;}
	#turn2 .sit5{animation-delay:-2s;}
	#turn2 .sit6{animation-delay:-1s;}
	#turn2 .sit7{animation-delay:0s;}
@keyframes sit{
0% {transform:translate(392px,307px) scale(0.8) rotate(30deg);opacity: 0;}
25% {transform:translate(407px,320px) scale(0.91) rotate(19deg);opacity:1;}
40% {transform:translate(437px,327px) scale(0.96) rotate(8deg);opacity:1;}
50% {transform:translate(472px,330px) scale(1) rotate(0deg);opacity:1;}
60% {transform:translate(507px,327px) scale(0.96) rotate(-8deg);opacity:1;}
75% {transform:translate(537px,320px) scale(0.91) rotate(-19deg);opacity:1;}
100% {transform:translate(552px,307px) scale(0.8) rotate(-30deg);opacity: 0;}
}
	/* 雲 */
	#cloud{animation:cloud1 10s linear infinite alternate;}
	@keyframes cloud1{
from {transform:translate(0, 0);}
to {transform:translate(80px,0);}
	}
	/* 熱氣球 */
	#hotBalloon{animation:hotBalloon 2s linear infinite alternate;}
	@keyframes hotBalloon{
from {transform:translate(0, 0);}
to {transform:translate(0,20px);}
}
	/* 火車 */
	#train{animation:train 20s linear infinite;}
@keyframes train{
from {transform:translate(-1220px, 0);}
to {transform:translate(950px,0);}
}
	
	#train .st40 circle{animation:tc 4s linear infinite;}
	#train .st40 .tc1{animation-delay:-3s;}
	#train .st40 .tc2{animation-delay:-2s;}
	#train .st40 .tc3{animation-delay:-1s;}
	#train .st40 .tc4{animation-delay:0s;}
@keyframes tc{
0% {transform:translate(1190px,471px) scale(1);}
25% {transform:translate(1170px,472px) scale(1.7);}
50% {transform:translate(1153px,473px) scale(0.6);}
70% {transform:translate(1148px,474px) scale(0.3);}
75% {transform:translate(1149px,475px) scale(0);}
76% {transform:translate(1200px,475px) scale(0);}
80% {transform:translate(1198px,474px) scale(0.3);}
100% {transform:translate(1190px,471px) scale(1);}
	
}
	/* 愛心 */
	#love{animation:love 2.5s  infinite;transform-origin:588.5px 276px;}
	@keyframes love{
0%  {transform:translate(0, 40px) scale(0);opacity:1;}
60% {transform:translate(0,-20px) scale(1);opacity:1;}
90%{transform:translate(0,-40px) scale(1.5);opacity: 0;}
100%{transform:translate(0,-40px) scale(1.5);opacity: 0;}
}
	/* 旋轉木馬 */
	.horse1,
	.horse2,
	.horse3{animation:horse 1.6s linear infinite alternate;}
	.horse1{animation-delay:-0s;}
	.horse2{animation-delay:-1.6s;}
	.horse3{animation-delay:0s;}
	@keyframes horse{
from {transform:translate(0, 10px);}
to {transform:translate(0,30px);}
}
	/* 氣球 */
	.b1,
	.b2,
	.b3,
	.b4,
	.b5{animation:balloon 3s linear infinite alternate;}
	.b1{animation-delay:-1.5s;}
	.b2{animation-delay:-1.3s;}
	.b3{animation-delay:-1s;}
	.b4{animation-delay:-2s;}
	.b5{animation-delay:-3s;}
	@keyframes balloon{
from {transform:translate(0, 20px);}
to {transform:translate(0,40px);}
}
	/* 摩天輪 */
	#turn .l{animation:turn 2.5s linear infinite;transform-origin:1458px 268px;}
	@keyframes turn{
	from {transform:rotate(0deg);}
	to {transform:rotate(30deg);}
	}
	.ball{animation:ball 2.5s linear infinite;}
	.ball0{transform-origin:1458px 139px;}
	.ball1{transform-origin:1522.5px 156.3px;}
	.ball2{transform-origin:1569.7px 203.5px;}
	.ball3{transform-origin:1587px 268px;}
	.ball4{transform-origin:1569.7px 332.5px;}
	.ball5{transform-origin:1522.5px 379.7px;}
	.ball6{transform-origin:1458px 397px;}
	.ball7{transform-origin:1393.5px 380px;}
	.ball8{transform-origin:1346.3px 332.5px;}
	.ball9{transform-origin:1329px 268px;}
	.ball10{transform-origin:1346.3px 203.5px;}
	.ball11{transform-origin:1393.5px 156.3px;}
	@keyframes ball{
	from {transform:rotate(0deg);}
	to {transform:rotate(-30deg);}
	}

@media (max-width: 1100px) {
.container, .fixed_content {
	padding: 0 10px
}
.hotels .container{border-bottom:1px solid #ccc;padding:0 10px 20px;}
article:not(:nth-of-type(1)) .swiper-button-next, article:not(:nth-of-type(1)) .swiper-button-prev {
display:none
}
.swiper-arrow {
	overflow: hidden
	}
}

@media (min-width: 741px) {
.search_button {
	display: none
}
.top_bar {
	position: absolute;
	top: 60px;
	right: 0;
	z-index: 3
}
.search_container {
	background: rgba(255,255,255,0.7)
}
nav {
	z-index: 1;
	position: relative
}
nav .active a {
	border-bottom: 5px solid #f60
}
nav .container {
	border-bottom: 3px solid #eee;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex
}
nav li {
	-webkit-box-flex: 1;
	-webkit-flex-grow: 1;
	-ms-flex-positive: 1;
	flex-grow: 1
}
nav li:first-child {
	display: none
}
#fixed_nav .container {
	border-bottom: 0
}
.mobile_nav {
	display: none
}
}
@media (min-width: 971px) {
	.map_box{width:550px;}
	.map .grid_list{display:none;}
	.map .grid_list.on{display:block;}
	.map .grid_list img{height:350px;}
}


@media (min-width: 1024px) {
nav a {
	-webkit-transition: 0.4s all;
	-o-transition: 0.4s all;
	transition: 0.4s all
}
nav a:hover {
	border-bottom: 5px solid #f90
}
#rooms_search_bar .btns {
	-webkit-transition: 0.4s all;
	-o-transition: 0.4s all;
	transition: 0.4s all
}
#rooms_search_bar .btns:hover {
	background-color: #f60
}
figure a {
	-webkit-transition: 0.4s all;
	-o-transition: 0.4s all;
	transition: 0.4s all
}
figure a:hover {
	background-color: rgba(255,255,255,0.3)
}
.swiper-button-prev, .swiper-button-next {
	-webkit-transition: 0.4s all;
	-o-transition: 0.4s all;
	transition: 0.4s all
}
.swiper-button-prev:hover, .swiper-button-next:hover {
	opacity: 1
}
.grid_booking {
	-webkit-transition: 0.4s all;
	-o-transition: 0.4s all;
	transition: 0.4s all
}
.grid_booking:hover {
	background-color: #C00
}
.news_new>a {
	-webkit-transition: 0.4s all;
	-o-transition: 0.4s all;
	transition: 0.4s all
}
.news_new>a:hover {
	background-color: rgba(255,255,255,0.3)
}
.route input:hover {
	-webkit-transition: 0.4s all;
	-o-transition: 0.4s all;
	transition: 0.4s all
}
.route input:hover:hover {
	background-color: #13a0bd
}
}
@media (max-width: 970px) {
body {
	margin-top: 60px
}
.anchor_hide {
	height: 60px;
	margin-top: -60px
}
#header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 10
}
.activity .link-box {
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap
}
.activity figure {
	margin-right: 2%;
	margin-bottom: 20px;
	width: 49%
}
.activity figure:nth-child(2n) {
	margin-right: 0
}
#mobile_nav li a {
	border: 0;
	padding: 10px 0
}
.route .route-list {
	width: calc(100%/2)
}
.stroke {overflow: hidden;}
	.stroke .a2 img{transform: rotate(4.3deg) translate(0,0);}

.map .grid_list p{display:none;}
	
	#map_svg{display: none;}
}

@media (max-width: 740px) {
body {
	margin-bottom: 47px
}
article {
	margin: 20px 0
}
.bg {
	height: 345px;max-height: 100vw
}
.bg>.container {
	text-align: center;
	padding: 0 10px
}
.bg .bg-box svg{width: 1200px;max-width: 351vw;}
.bg .title {
	margin-bottom: 0;
	max-width: 300px
}
.bg > .container p{display: none;}
.bg .bg-box .bubbles {
	max-width: calc(1708px / 1.5);
	width: calc(1708px / 1.5)
}
.bg .bg-box .dolphins {
	max-width: calc(1670px / 2);
	width: calc(1670px / 2)
}
.bg .bg-box .cloud {
	max-width: calc(2000px / 1.5);
	width: calc(2000px / 1.5)
}
.search_bar {
	width: 100%
}
.search_bar li {
	width: 100%;
	padding: 5px 0
}
.search_button {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 10;
	color: #fff
}
.swiper-button-next, .swiper-button-prev {
	display: none
}
	.tab-wrap .tab + label{width:50%;}
	.hotspring{position: relative;}
	.hotspring ul{display:flex;flex-direction:column;position: absolute;top: -45px;right: 0;z-index: 5;background:#fff;border: 1px solid #ccc;width: 5em;}
	.hotspring li{border-radius:0;margin:0;border:0; background:none;flex: 1 1 auto;order:2;overflow: hidden;max-height:40px;padding:5px;border-top: 1px solid #ccc;}
	.hotspring .o li{max-height:0;padding: 0;border:0;}
	.hotspring li:hover{border:0;border-top: 1px solid #ccc;background: #cee;}
	.hotspring li.on {border:0;background: #fff;order:1;max-height:40px;padding: 5px 0;}
	.hotspring li.on::after{margin: 0 0 3px 5px;content: " ";display: inline-block;width: 0;height: 0;line-height: 0;border: 0.3em solid #666;
  border-bottom: none;
  border-left-color: transparent;
  border-right-color: transparent;}
.maple .pic,
.maple .picr{max-width: 100%;}
.maple .pic,
.maple .picr{float:none;margin: 0;padding:0 0 10px 0;}
}

@media (max-width:560px) {
	.news_new {
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-webkit-flex-direction: column;
	-ms-flex-direction: column;
	flex-direction: column
}
	#news .swiper-slide{width: 300px;}
.news_new img {
	width: 100%;
	margin-bottom: 10px
}
.news_new .new_info {
	width: 100%;
	padding: 0
}
}
@media (max-width:510px) {
	.maple ul.m{float:none;display: flex;margin:20px 0 0 -10px; justify-content:center;}
	.maple .m li{float:none;}
}
@media (max-width: 480px) {
body {
	font-size: 18px
}
	.bg .bg-box{background-size: 750px auto;}
	.bg > .container p{display: none;}
	.map ul{font-size: 0.9em;}
.offer .swiper-slide{width:290px;}
.mobile_button {
	display: block;
	margin: 0 auto;
	margin-top: 20px;
	width: 150px;
	color: #fff;
	background-color: #f90;
	text-align: center;
	padding: 10px 0
}
.areas {
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap
}
.stroke .areas a{padding: 0 0 15px;}
.route .route-list{width:100%}	
.map .grid_list h3{white-space:nowrap;}
.map .grid_list .icon1,
.map .grid_list .icon2,
.map .grid_list .icon3{width:60px;height:60px;margin:-35px 0 0 -15px;}
}