@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
}
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;
}
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: 500px;
	position: relative;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	z-index: 9;
	background:url(../images/bg.jpg) repeat-x top center;
}
.bg .bg-box {
	position: absolute;
	overflow: hidden;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background:url(../images/001_03.png) repeat-x top center;text-align:center;
}
.bg .bg-box svg{display: block;margin: auto;width: 1460px;
left: 50%;
position: absolute;
transform: translateX(-50%);opacity:0;
}
/*
.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-bottom: 20px;
	max-width: 400px;
	width: 100%
}
.bg >.container p{margin: 0 0 20px;
}
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;
}
.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:url(../images/bg2.jpg) 0 bottom;padding: 40px 0;margin: 0;position: relative;}
.stroke .areas {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;align-items: center;
	margin-bottom: 20px
}
.stroke .area {flex: 1 1 auto;}
.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{top:-10px;}
.stroke .area img{border:10px solid #fff;box-shadow:0 3px 3px rgba(0,0,0,0.3);transition:all 0.2s;}
.stroke .a1 img{transform: rotate(-5deg)}
.stroke .a2 img{transform: rotate(4.8deg) translate(10px,30px)}
.stroke .a3 img{transform: rotate(-3deg)}
/*
.stroke .a1 a:hover img{transform: rotate(0deg)}
.stroke .a2 a:hover img{transform: rotate(0.2deg) translate(0px,30px)}
.stroke .a3 a:hover img{transform: rotate(2deg)}
*/
.stroke .container{position: relative;z-index: 3}
.stroke .area span{transition:all 0.5s;background:rgba(210,200,160,0.85);display: block;position: absolute;z-index: 2px;padding: 0.3em 1em;letter-spacing: 3px;bottom:0;left:90px}
.stroke .a2 span{top:0;bottom: auto}
.stroke .a1 a:hover span{background:rgba(210,200,160,1);}
.stroke .a2 a:hover span{background:rgba(210,200,160,1);}
.stroke .a3 a:hover span{background:rgba(210,200,160,1);}

.stroke .p1,
.stroke .p2{width:233px;height:188px;display: block;background:url(../images/ap1.png);background-size: cover;position: absolute;top: 50%;left: 50%;}

.stroke .p1{transform: translate(-320px,80px);}
.stroke .p2{transform: rotate(41deg) translate(-120px,-270px);}
.stroke::before{position: absolute; display: block; content:"";width: 100%;height: 100%;top: 0;left: 0;background: -moz-linear-gradient(top,  rgba(255,255,255,0.8) 0%, rgba(255,255,255,0) 100%);
background: -webkit-linear-gradient(top,  rgba(255,255,255,0.8) 0%,rgba(255,255,255,0) 100%);
background: linear-gradient(to bottom,  rgba(255,255,255,0.8) 0%,rgba(255,255,255,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#CCffffff', endColorstr='#00ffffff',GradientType=0 );
}
.attractions .grid_list{display:flex;padding: 30px 0 30px;/* margin: 0 0 30px; */border-bottom:1px solid #ccc;}
.attractions .grid_list .grid_link{border:0 solid rgba(0,175,175,0.2);}
.attractions .grid_list .grid_link:hover{border:10px solid rgba(0,175,175,0.2);background-color: rgba(255,255,255,0);}
.attractions .grid_list .grid_beroom {top:35px}
.attractions .grid_pic{flex:0 0 28vw;max-width: 350px;min-height:250px;position: relative;padding: 0;background:url(../images/loading.svg) no-repeat center center;background-size:30px auto}
.attractions .grid_pic img{object-fit: cover; position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.attractions .grid_txt{flex:1 1 auto;margin: 0 20px 0 30px; position: relative;}
.attractions .grid_txt .grid_name{display: block;font-size: 24px;float:left;}
.attractions .grid_txt p{display: block;position: relative;margin: 0 0 20px}
.attractions .grid_txt ul{display: flex;margin: 0 0 0 -30px;position: relative;z-index: 5}
.attractions .grid_txt li{display: block;position: relative; flex: 1 1 auto;margin:0 0 0 30px; text-align:center;}
.attractions .grid_txt li a{display:block;color:#000;transition:all .5s;}
.attractions .grid_txt li a:hover{opacity: 0.7}
.attractions .grid_txt li img{display:block;object-fit:cover;border-radius:5px;height:90px;width:100%;}
.attractions .grid_rate{float:right;}
.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; }

.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.svg) 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;}

@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: 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 .areas {flex-direction: column;}
	.stroke .area span{bottom: auto;top:0;}
	.stroke .a2 img{transform: rotate(4.3deg) translate(0,0);}
	
}

@media (max-width: 740px) {
body {
	margin-bottom: 47px
}
article {
	margin: 20px 0
}
	.bg .bg-box{background-size: 1000px auto;}
.bg {
	height: 255px
}
.bg>.container {
	text-align: center;
	padding: 0 10px
}
.bg .title {
	margin-bottom: 0;
	max-width: 300px
}
.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
}
	.attractions .grid_list{flex-direction:column;}
	.attractions .grid_txt{margin:0;}
	.attractions .grid_pic{max-width:100%;}
	.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) {
	.attractions .grid_txt ul{flex-wrap:wrap;margin: 0 0 0 -10px;}
	.attractions .grid_txt li{max-width:50%;max-width:calc(50% - 10px);margin: 0 0 10px 10px;}
	.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;}

.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
}
/*
	.areas .area {
	width: 50%
}
*/
.route .route-list {
	width: 100%
}
	.stroke .area span{left: -10px;top: 30px;}
}