@charset "utf-8";
.lightbox,.lightboxOverlay{position:fixed !important;}
h1,h2,h3,h4,h5,h6{ margin:0px;}
.dropdown-toggle span {
	display: block;
}
body { font-family:"微軟正黑體";
	background-color: #4DABD1;/*#fff8f8*/
	/*background-image: url(../images/bg1.png);*/
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-size: cover;
	color: #fff;
	font-size:16px;
	overflow-x:hidden;
}
.header{
	/*border-bottom: solid #ccc 1px;*/
    box-shadow: 0px 0px 10px #ccc;
    margin-bottom: 2px;
    background-color: rgba(255,255,255,0.5);
	
}
.header .box{background-image:url(../images/topbg.png);
	background-repeat:no-repeat;
	background-position: center; background-size:cover;}
.wapper {position: relative;
}
.footer {
	position:relative;
	width:1290px;
	margin:0 auto;
	text-align: center;
	background-image:;
	background-repeat: repeat-x;
	background-size: contain;
	background-color:#4DABD1;
	padding: 10px 128px;
}
.mask{z-index: -111;position: absolute;height: 100%;left: 0;right: 0;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+1,ffffff+100&0+10,1+11,1+89,0+90 */
background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0px, rgba(255,255,255,0) 78px, rgba(255,255,255,1) 78px, rgba(255,255,255,1) calc(100% - 66px), rgba(255,255,255,0) calc(100% - 66px), rgba(255,255,255,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0px,rgba(255,255,255,0) 78px,rgba(255,255,255,1) 78px,rgba(255,255,255,1) calc(100% - 66px),rgba(255,255,255,0) calc(100% - 66px),rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
background:linear-gradient(to bottom,  rgba(255,255,255,0) 0px,rgba(255,255,255,0) 78px,rgba(255,255,255,1) 78px,rgba(255,255,255,1) calc(100% - 66px),rgba(255,255,255,0.8) calc(100% - 66px),rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */

}
.icon { position:absolute; right:0; margin-top:-30px; bottom:0;
}
.icon li{display: inline;}
.newsbox {border-width: 0.417px;
  border-color: rgb( 159, 159, 159 );
  border-style: solid;
  background-color: rgb( 255, 255, 255 );
  box-shadow: 1px 1.732px 13px 0px rgb( 35, 24, 21 );
  width: 100%;
  height: auto;
  color:#000;
}
.weather { float:right; margin-top: -30px;text-shadow: 1px 1px 1px #000;}
.phhide{display:block;}
.phshow{display:none;}
.ulstyle{border-bottom: solid 5px #ffa500;}
.ulstyle:hover{border-bottom: solid 5px #3bc32a;/*background-color: rgba(204, 204, 204, 0.79);*/}
.ulstyle > a{ color:#fff;}
.header > .box ,.footer > .box ,#top .box {background-color:transparent;}
.beebox {
    width: 140px;
    height: 77px;
    position: absolute;
    left: 513px;
    overflow: hidden;
}
#bee{
	position:absolute;
	animation-name:bee;
    animation-duration:15s;
    animation-delay: .3s;
    animation-timing-function: ease-out;
    animation-iteration-count: infinite;
    animation-fill-mode: forwards;
    animation-direction: normal;
	transform:translate(0px, 0px) rotateY(0deg) skew(0deg, 0deg) scale(0.5, 0.5);
	left:-35px;
	z-index: 12;
}
@keyframes bee{
	0% {
		-webkit-transform: translateX(8px);
		transform:translate(0px,0px) rotateY(0deg) skew(0deg, 0deg) scale(0.5, 0.5);

	}
	10% {
		-webkit-transform: translateX(4px);
		transform:translate(30px,-20px) rotateY(0deg) skew(0deg, 0deg) scale(0.5, 0.5);
	}
	30% {
		-webkit-transform: translateX(4px);
		transform:  translate(150px,20px) rotateY(0deg) skew(0deg, 0deg) scale(0.5, 0.5);
	}
	50% {
		-webkit-transform: translateX(4px);
		transform:translate(180px,0px) rotateY(180deg) skew(0deg, 0deg) scale(0.5, 0.5);
	}
	70% {
		-webkit-transform: translateX(4px);
		transform: translate(150px,-20px) rotateY(180deg) skew(0deg, 0deg) scale(0.5, 0.5);
	}
	90% {
		-webkit-transform: translateX(4px);
		transform:  translate(30px,20px)  rotateY(180deg) skew(0deg, 0deg) scale(0.5, 0.5);
	}
	100% {
		-webkit-transform: translateX(8px);
		transform:translate(0px,0px) rotateY(0deg) skew(0deg, 0deg) scale(0.5, 0.5);
	}
}
.bee-head {
    /*background-color: #ffc500;*/
    width: 30px;
    height: 30px;
    border-radius: 20px;
    margin-top: 5px;
    margin-left: 5px;
    position: relative;
    left: 10px;
	background-image:url(../images/beehead.png);
	background-size:cover;
	background-repeat:no-repeat;
}
.bee-head:before {
	content: "";
	/*background-color: #000;*/
	width: 5px;
	height: 15px;
	position: absolute;
	transform: rotate(25deg) translateY(-14px) translateX(8px);
	left: 5px;
	border-radius: 3px;
	z-index: 1;
	background-image: url(../images/beehead-ab.svg);
	background-size: cover;
}
.bee-head:after {
    content: "";
    /*background-color: #000;*/
    width: 4px;
    height: 10px;
    position: absolute;
    transform: rotate(45deg) translateY(-3px) translateX(-5px);
    right: 0;
    border-radius: 3px;
    z-index: 1;
	background-image:url(../images/beehead-ab.svg);
	background-size:cover;
}
.bee-body{
		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffc500+15,26260e+21,26260e+30,ffd65e+35,ffd65e+65,26260e+70,26260e+80,ffd65e+85 */
	background: #ffc500; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffc500 15%, #26260e 21%, #26260e 30%, #ffc500 35%, #ffc500 65%, #26260e 70%, #26260e 80%, #ffc500 85%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  #ffc500 15%,#26260e 21%,#26260e 30%,#ffc500 35%,#ffc500 65%,#26260e 70%,#26260e 80%,#ffc500 85%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  #ffc500 15%,#26260e 21%,#26260e 30%,#ffc500 35%,#ffc500 65%,#26260e 70%,#26260e 80%,#ffc500 85%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffc500', endColorstr='#ffc500',GradientType=0 ); /* IE6-9 */
    width: 20px;
    height: 30px;
    border-radius: 100% 100% 90% 90%;
    transform: rotate(40deg);
    position: relative;
    top: -10px;
}
.bee-body:after {
    content: "";
    position: absolute;
    border-bottom: solid rgba(0, 0, 0, 0) 2px;
    border-left: solid rgb(38, 38, 14) 5px;
    border-top: solid rgba(0, 0, 0, 0) 2px;
    border-right: solid rgba(0, 0, 0, 0) 2px;
    bottom: 0;
    transform: translateX(5px) translateY(5px) rotate(95deg);
    z-index: -1;
}
.bee-right{
	border-radius: 30% 75% 30% 75%;
    -webkit-border-radius: 30% 75% 30% 75%;
    -moz-border-radius: 30% 75% 30% 75%;
    width: 20px;
    height: 20px;
    background-color: #70a8db;
    position: absolute;
    top: 0;
    transform: rotate(-30deg) translateY(8px) translateX(-12px);
	animation-name:bee-right;
	animation-duration:.5s;
    animation-delay:0s;
    animation-timing-function: ease-out;
    animation-iteration-count: infinite;
    animation-fill-mode: forwards;
    animation-direction: normal;
}
.bee-left{
	border-radius: 30% 75% 30% 75%;
    -webkit-border-radius: 30% 75% 30% 75%;
    -moz-border-radius: 30% 75% 30% 75%;
    width: 20px;
    height: 20px;
    background-color: #5383cd;
    position: absolute;
    top: 0;
    transform: rotate(-32deg) translateY(8px) translateX(-21px);
	animation-name:bee-left;
	animation-duration:.5s;
    animation-delay:0s;
    animation-timing-function: ease-out;
    animation-iteration-count: infinite;
    animation-fill-mode: forwards;
    animation-direction: normal;
}
@keyframes bee-right{
	0%{transform:rotateY(160deg) translateY(8px) translateX(-12px);}
	50%{transform:rotateY(50deg) translateY(8px) translateX(-12px);}
	100%{transform:rotateY(160deg) translateY(8px) translateX(-12px);}
}
@keyframes bee-left{
	0%{transform:rotateY(-0deg) translateY(8px) translateX(-11px);}
	50%{transform:rotateY(-90deg) translateY(8px) translateX(-6px);}
	100%{transform:rotateY(-0deg) translateY(8px) translateX(-11px);}
}
.sbbox{
    animation-name: sbbox;
    animation-duration:7s;
    animation-delay: 0s;
    animation-timing-function: ease-in;
    animation-iteration-count: infinite;
    animation-fill-mode: forwards;
    animation-direction: alternate;
    width: 35px;
    height: 50px;
    position: absolute;
    top: 41px;
	}
	@keyframes sbbox{
	0%{
		transform: rotate(30deg);
		transform-origin: top;
		}
	50%{
		transform: rotate(0deg);
		transform-origin: top;
		}
	100%{
		transform: rotate(-30deg);
		transform-origin: top;
		}
}
.sb{
	background-image:url(../images/strawberries.png);
	background-repeat:no-repeat;
	background-size:contain;
	position: relative;
    width: 40px;
    height: 40px;
	margin-top: -5px;
    animation-name: sb;
    animation-duration: 4.5s;
    animation-delay: 0s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-fill-mode: forwards;
    animation-direction: alternate;
}
@keyframes sb{
	0%{
		transform: rotate(20deg);
		transform-origin: top;
		}
	50%{
		transform: rotate(0deg);
		transform-origin: top;
		}
	100%{
		transform: rotate(-20deg);
		transform-origin: top;
		}
}
.sb1 {
   /* content: "";*/
    width: 2px;
    height: 30px;
    position: relative;
    background-color: #a7ce86;
    left: 20px;
}
.box{ width:1290px; margin:0 auto; background-color:#fbfbfb;border-radius: 20px;}
.othermenu {
	margin: 50px auto;
    /*background-color: rgba(236, 234, 234, 0.5);*/
    box-shadow: inset #b3b3b3 0px 0px 6px
    border-radius: 5px;
}
.ehdiv{
　margin-bottom: -10000px;
　padding-bottom: 10000px;
　background-color:#efefef;
}
#equalheight {
　overflow: hidden;
}
.othermenu ul { margin:0 auto;text-align: center;}
.othermenu li { padding-bottom:10px; padding-top:10px; border-right:thin #CCC solid;/* letter-spacing:1em;*/ white-space:nowrap; font-size:24px;}
.othermenu a:hover {background-color: rgba(255, 165, 0, 0.5); box-shadow: inset #423232 2px 9px 0px 0px; border-radius:10px; text-decoration:none;}
.othermenu li a{
	color:#333;
	display:block;
	padding: 20px 0px;
	background-color: rgba(146, 146, 146, 0.5);
	box-shadow: inset #423232 -2px -9px 0px 0px;
    border-radius: 10px;
	padding-right: 48px;
	padding-left: 60px;
    text-align: justify;
	text-align-last:justify;
	text-justify: inter-ideograph;
	-ms-text-justify: inter-ideograph; /*IE9*/
	-webkit-text-align-last: justify; /*Chrome*/
	-moz-text-align-last: justify; /*Firefox*/
}
.othermenu li.col-sm-3.col-xs-6:nth-child(4) {border-right: thin #fbfbfb solid;}
.othermenu li span { height: 24px; width: 24px; margin-left: 24px; float: left; margin-top: 24px;}
.othermenu li:nth-child(1) > span{background-image:url(../images/icon_news.png);background-size: contain; background-repeat: no-repeat;}
.othermenu li:nth-child(2) > span{background-image:url(../images/icon_car.png);background-size: contain; background-repeat: no-repeat;margin-top: 28px;}
.othermenu li:nth-child(3) > span{background-image: url(../images/calendar-icon.png);background-size: contain;background-repeat: no-repeat;}
.othermenu li:nth-child(4) > span{background-image: url(../images/dollar-icon.png);background-size: contain;	background-repeat: no-repeat;}
#booking .phhide{ display: inline-block;}
#booking .phshow{ display:none;}
.album .masonry a{color:#000; text-align:center;}
.box .album {color:#000;}
.reportul li {border: thin solid #734628; border-radius:0px 8px 8px 0px;}
.reportul li:nth-child(odd) {border: thin solid #734628; border-radius:8px 0px 0px 8px;}
.timeline-content img{ max-width:50% !important; margin:5px auto;}
.clear {zoom:1; clear:both; margin:0px;}
.clear:after {content:''; display:block; clear:both; visibility:hidden; height:0;}
.service {
	color: #000; margin:10px 0px;
}
.service > h3 ,#S1>h3 ,#S2 > h3 , .album h3{background-image:url(../images/title1-1.png),url(../images/title1-2.png),url(../images/title1bg.png); background-repeat: no-repeat, no-repeat, repeat-x; display: table;padding:10px 35px; background-position: left , right, bottom; background-size: contain;color: #965c03;margin-top: 20px;
    font-weight: bolder;}
.service li img {/* max-width:400px; max-height:400px; */margin:0px auto;}
.service .title{background-color:#fdd2d2; margin:5px auto;padding-left: 5px; text-align: center;}
.boxbg{background-image:url(../images/boxbg.png); background-repeat:no-repeat; background-position:bottom right; padding-bottom:220px;}
/*.service li.serviceli{text-align:left;}
.service li.serviceli:nth-child(odd){text-align:right;}*/
li.serviceli { margin: 5px auto;}
li.serviceli > img{}
.serviceW{width:50%; display:inline-block; vertical-align:top;text-indent: 2em;}
.serviceW > p{text-indent: 2em;}
.serviceP{/*width:49%; */display:inline-block;}
.caret{ margin-left:4px; border-top:4px solid transparent; border-bottom:4px solid transparent; border-right:4px solid transparent; border-left:4px solid #fff;}
.menutitle{ width:1290px; text-align: center; margin:0 auto; height:160px; position:relative;background-color: #4DABD1}
.menutitle hr { width: 50px; padding: 0px; margin: 0px 5px; display: inline-block; vertical-align: middle;}
.menutitle h3{text-indent:5em;}
.menutitle a{ color:#fff; text-decoration:none;}
.menua{position: absolute; right: 0; bottom: 0; margin-bottom:10px; margin-right:10px;}
.aboutmenu{
	color: #000;
	border-bottom: none;
	padding: 0px;
	background-color: #f7f7f7;
	list-style-type: none;
}
.aboutmenu li{text-align:center; padding: 10px 0px; cursor:pointer; float: none; margin-bottom: -1px;}
ul.aboutmenu li a { color: #000; text-decoration: none; margin-right: 0; position: relative; display: block; padding: 10px 0px;}
/* 特定在第一層 > 第二層之後下拉部分之樣式 */
ul.aboutmenu li ul{
    display: none;
}
/* 當第一層選單被觸發時，指定第二層顯示 */
ul.aboutmenu li:hover > ul{
    display: block;
}
ul.aboutmenu li ul li a{color:#000; text-decoration:none; display:block;padding:10px 0px;}
ul.aboutmenu li ul li{padding:0px 0px;}
ul.aboutmenu li ul li :hover{ border-bottom:#666 thin dotted; background-color: #fff; box-shadow: inset #999 2px 3px 3px;}
#S1 p, #S2 p {
    width: 50em;
    margin: 0 auto;
    line-height: 2em;
    font-size: 18px;
	letter-spacing: 1px;
	text-align: justify;
}
#S1 p, #S2 p:nth-child(2), #S2 p:nth-child(9){text-indent: 2em;}
.footer p:nth-child(1),.footer p:nth-child(2),.footer p:nth-child(3){ display:inline; white-space:nowrap;}
.footer p:nth-child(4){ display:block;}
.footer p {
	margin: 0px;
	padding: 0px;
	letter-spacing: 1px;
}
.hoursbf {
	background-image:url(../images/hoursbg.png);
	background-size: contain;
    background-repeat: no-repeat;
    background-position: bottom left;
    height: 638px;
}
.hoursbf p:nth-child(1){margin-top:50px;}
.hoursbf > p{font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;}
li.goodslist img {
    max-height: 100% !important;
    max-width: 100% !important;
}
.goodslist{/* height:400px;*/ min-height: 200px; border-right: 1px solid #eeeeee; border-bottom: 1px solid #eeeeee; padding: 15px; cursor: pointer; position:relative;}
.goodslist:hover{border-color: #d4d4d4; background: #FFFFE5;}
.goodslist a{color:#930; text-decoration:none; font-weight:bold;}
.goods {
	padding: 5px;
}
.car-btn {
	display:none;
	color: #000;
	background-color: transparent;
	text-align: center;
	position: absolute;
    bottom: 0px;
    width: 100%;
    margin-left: -20px;
	padding:10px;
}
.price {
	color: #000;
	padding:10px;
	text-align: center;
}
.goodtitle {
	text-align: center;
}


li.goodslist .goods .car-btn:hover {color: #FFF; background-color: #000;}
#sidebar {
	position: absolute;
	width: 180px;
	right:5px;
	margin-right:10px;
	z-index:12;
}

#cart {
	position: absolute;
	width: 180px;
	right:170px;
	margin-right:10px;
	z-index:12;
    top: 140px;
}

/* 以下兩段是針對右邊的購物清單設計用*/
#cart .cart-top{
	width: 180px;
	height: 36px;
	background-image:url(../images/cartitle.png);
	background-repeat:no-repeat;
	text-indent: -9999px;
}

#cart .middle {
	width: 168px;
	padding: 5px;
	border: 1px solid #ccc;
	border-top: none;
	font-size: 12px;
	text-align: center;
	color:#FFF;
	margin: 0 auto;
}
#cart .middle ol {
    margin: 0px;
    padding: 1em;
    text-align: left;
}
.cart-btn{background-color:#ccc; color:#000; padding: 5px; margin: -5px;cursor:pointer;}
.cart-btn:hover{background-color:#F00; color:#fff;}
.shopcar{list-style-type:none; padding:10px;}
.shopcar li{padding:10px 0px;}
ul.shopcar li.col-xs-12{border-bottom:solid thin #ddd;}
.shopcar li {
	margin-bottom: 10px;
}
.shopcar img {width:100px; margin:0px 5px; float:left;}
.shopcar li p a{text-decoration:none; color:#333;}
.shopcar li div p{font-weight: bold;display: inline-block;}
.shopcar li div p:nth-child(odd){font-weight:normal;}
.red{ color:#F00;}
#pay li.col-xs-4 {
	border-top: 2px solid #CCC;
	padding:5px 0px;
}
.redline{border-top: 2px solid #F00 !important;}
#pay h3{margin:10px;}
.loginbox{border-radius:10px; border:thin solid #ccc; margin:10px auto; padding:5px;}
#pay .loginbox input{	margin: 5px 0; padding:5px 10px;}
.loginbox input[type="button"] , #pay input[type="button"] { border-radius:10px;}
.col-xs-2,.col-xs-3,.col-xs-12 .col-xs-6{padding:0px; margin:0px;}
#calendar { max-width: 900px; margin:5px auto;}
.downbox {
	margin: 0 auto;
	max-width: 940px;
}
.booking-btn { border-radius: 8px; padding: 6px 12px; box-shadow: #802623 0px 4px 0px; margin:10px; cursor:pointer;}
.booking-btn.btn-info {
    color: #fff;
    background-color: #5bc0de;
    border-color: #46b8da;
    box-shadow: #2b7186 0px 4px 0px !important;
}
.gary-btn {
    color: #000;
    background-color: #ddd;
    border-color: #ddd;
    box-shadow: #898989 0px 4px 0px !important;
}
.booking-btn:active ,.booking-btn:hover{box-shadow: none;}
#booking , #reservation{margin:10px auto;}
#booking li { margin-top: 5px; margin-bottom: 5px;}
#booking .col-sm-8 input{width:100%;}
.col-sm-8 p input[type="checkbox"]{width:auto !important;}
#booking ul { border: #c13434 dashed thin; border-radius: 8px; margin: 10px auto;}
#bookingok li.col-xs-12 ,.modal-body li.clearfix  {border-bottom:solid thin #ddd;}
ul#bookingok , #bookingok li ,.modal-body li.clearfix { padding-bottom:5px; padding-top:5px;}
.leftborder{border-left-style: solid;
    border-left-color: #bbb;
    border-left-width: thin;}
	#news li .col-sm-9.col-xs-8 {    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
	}
	#news .newsL{width:200px;}
	#news .newsR{width:calc(100% - 201px);}
	#news li .col-sm-2.col-xs-2, #QA li .col-sm-2.col-xs-2{text-align:center; display:table;}
	#news .tab-content li , #QA .tab-content ul#QAlist li { padding:10px 0px; margin:10px auto; border-bottom: solid thin #ddd;}
	#news .tab-content li a ,#QA .tab-content ul#QAlist li a {color:#000; text-decoration:none;}
	#news .tab-content li:hover ,#QA .tab-content ul#QAlist li:hover{color:#333; background-color:#FDF1DB;}
	.newsDate {
    display: block;
    color: #ff7e00;
    text-align: left;
    font-size: 115%;
    padding: 5px 0px 5px 0px;
	}
	h1.newsTitle {
    display: block;
    color: #34a8ce;
    text-align: left;
    font-size: 150%;
    padding: 14px 0px 14px 0px;
	}
	.newsMain {
    color: #333;
    line-height: 1.8em;
	text-align: justify;
	}
	.newsMain p{ text-indent: 2em;}
	.nextNews {
    display: block;
    box-sizing: border-box;
    width: 100%;
    padding: 5px 0px 5px 0px;
	}
	.nextNews li {
    display: inline-block;
    padding: 10px 0px 10px 10px;
    vertical-align: top;
}
.nextNews li:hover{background-color:inherit !important;}
.nextNews li:nth-child(1) {
    width: 90px;
}
.nextNews li:nth-child(1) a {
    background-color: #ffa500;
    padding: 4px 20px 4px 20px;
    color: #FFF;
    text-decoration: none;
    border-radius: 6px;
    border: 0px #FF6600 solid;
}
.nextNews li:nth-child(2) {
    width: calc(100% - 95px);
    word-break: break-all;
}
.page {
    margin: 20px 0px 40px 0px;
	text-align: center;
}
.page a {
    padding: 4px 15px 4px 15px;
    text-decoration: none;
    color: #FFF;
    background-color:#ffa500;
}
.pageList{
	margin: 20px 0px 40px 0px;
	text-align: center;}
    .pageList li {
    position:relative;
    display: inline-block;
    box-sizing: border-box;
    width: 40px;
    height: 40px;
    background-color: #bcbab6;
    border-radius: 50%;
    color: #ffffff;
    padding: 10px 0px 0px 0px;
    border-bottom: 0px #CCCCCC solid;
    vertical-align: middle;
    text-decoration: none;
    font-size: 90%;
	}
	.pageList li a {
    display: block;
    text-decoration: none;
	color:#333;}
	.pageList li:first-child a{color: transparent !important;}
	.pageList li:first-child a:after {
    content: "";
    border-bottom: solid 10px transparent;
    border-left: solid 10px transparent;
    border-top: solid 10px transparent;
    border-right: solid 10px #000;
    top: 10px;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: 10px;
    height: 10px;
	}
	.pageList li:last-child a{color: transparent !important;}
	.pageList li:last-child a:after {
    content: "";
    border-bottom: solid 10px transparent;
    border-left: solid 10px #000;
    border-top: solid 10px transparent;
    border-right: solid 10px transparent;
    top: 10px;
    position: absolute;
    left: 20px;
    right: 0;
    bottom: 0;
    width: 10px;
    height: 10px;
	}
	.pageList li:hover, .pageList li.selected{background-color: #ffa500 !important;}
	#QA .newsL{width:50px;}
	#QA .newsR{width:calc(100% - 51px);}
	#QA .tab-content ul#QAlist li:nth-child(odd){background-color:#ddd;}
	#QA .tab-content ul#QAlist li{margin:0px !important; cursor:default;}
	#QA .tab-content ul#QAlist ,#news .tab-content ul , #message ul,#customer .tab-content ul  {margin:10px auto;}
	#message .newsL{width:100px;}
	#message .newsR{width:calc(100% - 101px);}
	#message li{ padding:10px 0px !important; margin:10px auto; border-bottom: solid thin #ddd;}
	#customer .tab-content li{padding:5px 0px;}
	#member table tr td {border: thin solid #CCC; padding:10px;}
	#member table { margin:10px;}
	#member .tab-content li{ padding:10px 0px;/*border-bottom:solid thin #bbb;*/}
#member .tab-content li .talk{
	background-color: #FEEFD3;
	padding:10px;
	border-bottom:dashed thin #bbb;
	border-radius:5px;
}
#member .tab-content li .talk:after {
	content: " ";
    border-right: solid 10px #feefd3;
    border-bottom: solid 10px transparent;
    border-left: solid 0px transparent;
    border-top: solid 10px transparent;
    position: absolute;
	top:10px;
    left: 0;
    margin-left: -9px;
}
#member .tab-content li div .talk2{
    background-color: #d7f3f9;
	padding:10px;
	border-bottom:dashed thin #bbb;
	border-radius:5px;
}
#member .tab-content li div .talk2:after {
    content: " ";
	border-right: solid 10px #d7f3f9;
	border-bottom: solid 10px transparent;
    border-left: solid 0px transparent;
    border-top: solid 10px transparent;
    position: absolute;
	top:10px;
    left: 0;
    margin-left: -9px;
}
.nb-size {
	width: 14px;
    padding: 0;
    margin: 0;
    background-color: rgb(0, 0, 0);
    border: none;
    color: #fff;
    height: 26px;
    text-align: left;
}
@keyframes menu{
	0% {
    -webkit-transform: translateX(8px);
    transform: translateX(8px);
	}
	50% {
		-webkit-transform: translateX(4px);
		transform: translateX(4px);
	}
	100% {
		-webkit-transform: translateX(8px);
		transform: translateX(8px);
	}
	}
	/*@keyframes big-menu
	{
	0% {transform: translateY(8px);}
	50% {transform: translateY(4px);}
	100% {transform: translateY(8px);}
	}*/
	@keyframes span2
	{
	  0%,30%{transform: translateY(0px) rotate(0deg) translateX(0px);}
	  70%,100%{transform: translateY(15.5px) rotate(60deg) translateX(-9.6px);}
	}
	@keyframes span3
	{
	  0%,30%{transform: translateY(0px);}
	  70%,100%{transform: translateY(-8px);}
	}
	@keyframes span4
	{
	  0%,30%{transform: rotate(0deg) translateX(0px) translateY(0px);}
	  70%,100%{transform: rotate(-60deg) translateX(7px) translateY(2px);}
	}
	.sp-wrap > .div-new{top: -14px;left: -10px;}
	.div-new{
	z-index: 1;
	position: absolute;
	top: 10px;
	left:14px;
	width: 160px;
	height: 40px;
	text-align: center;
	background: #F7CF10;
	-webkit-clip-path: polygon(25% 0, 75% 0, 100% 100%, 0% 100%);
	clip-path: polygon(25% 0, 75% 0, 100% 100%, 0% 100%);
	line-height: 40px;
	font-size: 16px;
	-moz-transform: rotate(-45deg) translateX(-45px);
	-webkit-transform: rotate(-45deg) translateX(-45px);
	-o-transform: rotate(-45deg) translateX(-45px);
	-ms-transform: rotate(-45deg) translateX(-45px);
	transform: rotate(-45deg) translateX(-45px);
}
.agreebox{padding-left:5px;}
/*bootstrap*/
.nav-tabs > li {
    /*float: none;*/
    margin-bottom: -1px;
}
.tab-content{ color:#000;}
.nav-tabs > li > a {margin-right:0; color:#000;}
.nav-tabs {border-bottom: none;padding: 0px; background-color:#f7f7f7;border-radius: 20px;}
.nav-tabs > li > a:hover {border-color:transparent;}
.navbar{
	/*background-image: url(/images/menu1.png);*/
	background-repeat: repeat-x;
	margin-bottom: 0px;
	background-color: #000;
}
.navbar-header{ margin-left:0px !important; margin-right:0px !important;}
.container-fluid , .navbar-collapse , .navbar-header{padding:0px;}
.navbar-collapse{text-align: center;}
.navbar-nav > li {padding:15px 0px; width:calc(100% / 8.01);}
.navbar-nav > li >a{ padding: 0px;}
.navbar-nav{float:none; display:block;}
.nav > li > a:hover, .nav > li > a:focus{background-color: transparent;}
.nav .open > a, .nav .open > a:hover, .nav .open > a:focus{
	background-color: transparent;
}
.nav .open, .nav .open:hover, .nav .open:focus{
	background-color: transparent;
	background-image:;
	background-repeat: repeat-x;
    background-size: contain;

}
.carousel-inner img {margin: 0 auto;}
.dropdown-menu{
	background-color:#fff;
	padding-left: 30px;
	list-style-image: url(../images/li.gif);
	list-style-type: disc;
	margin-top: 5px !important;
}
.dropdown-menu > li > a{padding: 3px 0px;}
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus{background-color: #b5e4fb;}
.carousel-indicators {
	position:relative;
	left:inherit;
    z-index: 15;
    width: 60%;
    padding-left: 0;
    text-align: center;
    list-style: none;
    margin: 0 auto;
	bottom:0;
}
.carousel-indicators .active {background-color: #00eaff;}
.navbar-toggle {
    background-color:#f2afaf;
    background-image: none;
    border: 1px solid #333;
    border-radius: 4px;
}
.icon-bar{ background-color:#fff;}
/*當視窗小於480時，套用此樣式*/
@media (max-width: 767px) {
/*    .caret::before{
        content: '▾';
        color: #fff;
        font-size: 24px;
        line-height: 28px;
    }
    .caret{
            display: inline-block;
            text-align: center;
            float: right;
            width: 50px;
            height: 30px;
            background: #111;
            border: 0;
            margin-right: -10px;
            border-radius: 30px;
            margin-top: -5px;
    }*/
    .dropdown-menu{
                position: relative;
                width: 100%;
                background: transparent;
    }
    .dropdown-menu>li>a{
         color: #9d9d9d;
    }
  }
/*@media (max-width: 996px) {
    .navbar-header {
        float: none;
    }
    .navbar-toggle {
        display: block;
    }

    .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
    }
    .navbar-collapse.collapse {
        display: none!important;
    }
    .navbar-nav>li {
        float: none;
    }
    .navbar-nav>li>a {
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .navbar-text {
        float: none;
        margin: 15px 0;
    }

    .navbar-collapse.collapse.in {
        display: block!important;
    }
    .collapsing {
        overflow: hidden!important;
    }
}*/
/*bootstrap*/

/*camera*/
.fluid_container {
  margin: 0 auto;
  max-width: 1290px;
  width: 100%;
}
/*camera*/
@media (max-width: 1697px) and (min-width: 768px){
	#cart .cart-top{background-image:url(../images/cartitle-b.png);}
	#cart .middle {color:#000;background-color: #fff;}
}
@media (max-width: 1290px) and (min-width: 768px){
	.bee{ }
	.service {margin:auto;}
	.box , .footer ,.menutitle{ width:100%;}
	.navbar-nav {float: none;display:block;}
	#S1 p, #S2 p {width:100%;}
	#cart .cart-top{background-image:url(../images/cartitle-b.png);}
	#cart .middle {color:#000;background-color: #fff;}
}
@media (max-width: 1322px){
	#cart .cart-top{background-image:url(../images/cartitle-b.png); display:none;}
	#cart .middle {color:#000;background-color: #fff;}
	/*#sidebar {
	position: absolute;
	width: 180px;
	z-index:12;
	}*/
	#cart{
	right: -189px;
    /*transition: right 1s 2s;*/
	-webkit-transition:  right 0.5s ease-out;
	-moz-transition: right 0.5s ease-out;
	-o-transition: right 0.5s ease-out;
	transition: right 0.5s ease-out;
	}
	#cart:after {
    content:url(../images/cartitle-p.png);
    /*border-bottom: 10px solid #ccc;
    border-left: 10px solid #ccc;
    border-top: 10px solid #ccc;*/
    position: absolute;
    /*border-right: 10px solid #ccc;*/
	width:21px;
	height:106px;
    top: 0;
    /* left: 0; */
    margin-left: -25px;
	cursor:pointer;
}
	#cart :before{width:10px; height:10px; background-color:#0a0;}
	#cart:hover{right:0px;}
	}
/*@media (max-width: 925px) and (min-width: 768px){.othermenu li {letter-spacing:0em;}}*/
@media (max-width: 900px) {.footer {padding: 10px 40px;}}
@media (max-width: 767px){
	.search {width: 84% !important;}
	.top-menu {margin-top: 50px;}
	.top-menu div{margin-left: 16px !important;}
	.order_ps {float: none !important;position: unset !important;padding: 14px;}
	.navbar-nav >li {width:100%;}
	.mask{z-index: -111;position: absolute;height: 100%;left: 0;right: 0;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+1,ffffff+100&0+10,1+11,1+89,0+90 */
	background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0px, rgba(255,255,255,0) 78px, rgba(255,255,255,1) 78px, rgba(255,255,255,1) calc(100% - 66px), rgba(255,255,255,0) calc(100% - 66px), rgba(255,255,255,0) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0px,rgba(255,255,255,0) 78px,rgba(255,255,255,1) 78px,rgba(255,255,255,1) calc(100% - 66px),rgba(255,255,255,0) calc(100% - 66px),rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
	background:linear-gradient(to bottom,  rgba(255,255,255,0) 0px,rgba(255,255,255,0) 78px,rgba(255,255,255,1) 78px,rgba(255,255,255,1) calc(100% - 66px),rgba(255,255,255,0.8) calc(100% - 66px),rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */

	}

	.dropdown-menu > li > a {color: #fff;}
	.nav .open, .nav .open:hover, .nav .open:focus {
    background-color: transparent;
    background-image: none;
	}
	.nav .open > a, .nav .open > a:hover, .nav .open > a:focus {color: #fff;}
	.navbar-collapse {
    position: relative;
    z-index: 1030;
	}
	.container-fluid > .navbar-collapse {margin-right:0px; margin-left:0px; background-color:#000;}
	body {
	background-image: ;
    background-size: contain;
    background-position-y: 500px;
	font-size:14px;
	}
	.box , .footer ,.menutitle /*,#message .newsL ,#message .newsR*/{ width:100%;}
	#top{
	background-image:url(../images/titlebg-01.png);
	background-repeat:no-repeat;
	background-size:cover;
	background-position:bottom;
	height: 150px;
	position:relative;
	}
	.header{
	border-bottom: none;
    box-shadow: none;
    margin-bottom: 2px;
    background-color:rgba(255,255,255,0.8);
	}
	.header .box{background-image: none;}
	.navbar-nav {
    float: none;
    display:block;
	}
	.navbar{
	background-image: none;background-color: transparent;
	}
	.icon {float: left; position: fixed; bottom:0;/* right:auto;*/}
	.icon li{display: block;}
	.weather {
    float: none;
    position: absolute;
    left: 5px;
    margin-top: 35px;
	}
	.header .box > img{ margin:0 auto;}
	.phhide{ display:none;}
	.phshow{ display:block;}
	#booking .phhide{ display:none;}
	#booking .phshow{ display: inline-block;}
	.navbar-nav{margin:0;}
	.othermenu {margin:10px auto;}
	.service {margin:10px;}
	.menutitle h2 { padding-top: 22px !important; font-size: 24px;}
	.menutitle h3{text-indent:2em;font-size: 18px;}
	#S1 p, #S2 p {width: 100%; font-size: 14px; line-height: 1.5em;}
	.serviceW{width:100%; display:block; vertical-align:top;text-indent: 2em;}
	.serviceP{width:100%; display:block;}
	.nextNews li {display: block;}
	.nextNews li:nth-child(1) { width: 100%; border:none !important;}
	.nextNews li:nth-child(2) { width: 100%;}
	.leftborder{border-left: none;}
	.aboutmenu{
    left: -200px;
    width: 200px;
    position: absolute;
    z-index: 10;
    transition-timing-function: linear;
    transition: left 0.5S;}
	.menu-open {
    left: 0;
    transition-timing-function: linear;
    transition: left 0.5S;
	}
	.aboutmenu:after {
    content: "";
	background-image:url(../images/aboutmenu.png);
	background-repeat:no-repeat;
	background-size:contain;
    width: 50px;
    height: 50px;
    position: absolute;
    top: 0;
    right: 0;
    margin-right: -45px;
    z-index: 10;
	cursor:pointer;
	-webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    -webkit-animation-name: menu;
    animation-name: menu;
    -webkit-animation-duration: 1.5s;
    animation-duration: 1.5s;
    -webkit-animation-delay: .3s;
    animation-delay: .3s;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-direction: alternate;
    animation-direction: alternate;
	}
	/*@keyframes menu{
	0% {
    -webkit-transform: translateX(8px);
    transform: translateX(8px);
	}
	50% {
		-webkit-transform: translateX(4px);
		transform: translateX(4px);
	}
	100% {
		-webkit-transform: translateX(8px);
		transform: translateX(8px);
	}
	}*/
	.service > h3, #S1>h3, #S2 > h3, .album h3 { margin-left: 1em;}
	#member .tab-content li .talk:after {
    content: " ";
    border-right: solid 10px transparent;
    border-bottom: solid 10px #feefd3;
    border-left: solid 10px transparent;
    border-top: solid 10px transparent;
    position: absolute;
    top: 0px;
    left: 0;
    margin-left: 9px;
    margin-top: -20px;
	}
	#member .tab-content li .talk2:after {
    content: " ";
    border-right: solid 10px transparent !important;
    border-bottom: solid 10px #d7f3f9 !important;
    border-left: solid 10px transparent !important;
    border-top: solid 10px transparent !important;
    position: absolute;
    top: 0 !important;
    left: 0 !important;
    margin-left: 9px !important;
    margin-top: -20px !important;
	}
	.navbar-toggle{
	-moz-animation-name: big-menu;
	-webkit-animation-name: big-menu;
    animation-name: big-menu;
	-moz-animation-duration: 1.5s;
	-webkit-animation-duration: 1.5s;
    animation-duration: 1.5s;
	-moz-animation-delay: .3s;
    -webkit-animation-delay: .3s;
    animation-delay: .3s;
	-moz-animation-timing-function: linear;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
	-moz-animation-iteration-count: infinite;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
	-moz-animation-direction: alternate;
    -webkit-animation-direction: alternate;
    animation-direction: alternate;
	    padding: 9px 5px 9px 20px;
	}
	.navbar-toggle:before {
    content: "選單";
    font-size: 15px;
    padding: 0px;
    position: absolute;
    margin-top: -9px;
    left: 0px;
    height: 30px;
    width: 20px;
    word-break: break-word;
    line-height: 16px;
    color: #222;
}
	.beebox {
    width: 140px;
    height: 90px;
    position: absolute;
    left: 50%;
    overflow: hidden;
    top: 20px;
	}
	#bee {
		/*left: 50%;*/
		z-index: 12;
		/*top: 20px;*/
	}
	.navbar-toggle span:nth-child(2){
	animation-name: span2;
    animation-timing-function: ease;
    animation-duration: 15s;
    animation-iteration-count: infinite;
	animation-direction: alternate;
	}
	.navbar-toggle span:nth-child(3){
    animation-name: span3;
    animation-timing-function: ease;
    animation-duration: 15s;
    animation-iteration-count: infinite;
	animation-direction: alternate;
    }
	.navbar-toggle span:nth-child(4){
    animation-name: span4;
    animation-timing-function: ease;
    animation-duration: 15s;
    animation-iteration-count: infinite;
	animation-direction: alternate;
    }
	#div1on li .col-sm-4.text-right,#div2on li .col-sm-4.text-right , li .col-sm-4.text-right , li.col-xs-12 div.col-sm-6.text-right {text-align: left;}
	.hoursbf {min-height: 300px;height:auto;}
	.div-new {
    width: 80px;
    height: 20px;
	line-height: normal;
	top:0px;
	left:33px;
	}
	.sp-wrap > .div-new{top: -24px;left: 8px;}
	.othermenu li.col-sm-3.col-xs-6:nth-child(2),.othermenu li.col-sm-3.col-xs-6:nth-child(4) {border-right: thin #fbfbfb solid;}
	.agreebox{padding-left:18px;}
	}
@media (max-width: 500px){
	.othermenu li span { height: 24px; width: 24px; margin-left: 18px; float: left; margin-top: 18px;}
	.othermenu li:nth-child(2) > span{margin-top: 23px;}
	.othermenu li { font-size:18px;}
	.othermenu li a{ padding-right: 25px; padding-left: 50px;}
	.footer p:nth-child(1),.footer p:nth-child(2),.footer p:nth-child(3){white-space: normal;}
}
@media (max-width: 320px){
	.othermenu li span { height: 24px; width: 24px; margin-left:10px; float: left; margin-top: 18px;}
	.othermenu li:nth-child(2) > span{margin-top: 23px;}
	.othermenu li { font-size:18px;}
	.othermenu li a{ padding-right: 18px; padding-left: 38px;}
}
/*masonry+lightbox*/
.grid-sizer { width: 249px; }
	#masonry_container
	{
		min-height: 600px;
	}
	#masonry
	{
		padding: 0;
		margin: 0 auto;
	}
	#masonry .thumbnail
	{
		float: left;
		min-height:180px;
		width:294px;
		margin:10px;
		padding: 0;
		border-width: 1px;
		-webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
				box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
	}
	#masonry .thumbnail .imgs
	{
		padding: 10px;
		min-height:100%;
		line-height: 200px;
		overflow: hidden;
	}
	#masonry .thumbnail .imgs img
	{
		margin-bottom: 5px;
		/*min-width:100%;*/
		max-width: 100%;
		max-height: 100%;
	}
	#masonry .thumbnail .caption
	{
		background-color: #fff;
		padding-top: 0;
		font-size: 13px;
		padding-top: 5px;
		border-top: solid 1px #eee;
		background-color: #efefef;
	}
	#masonry .thumbnail .caption .title
	{
		font-size: 13px;
		font-weight: bold;
		margin: 5px 0;
		text-align: left;
	}
	#masonry .thumbnail .caption .author
	{
		font-size: 11px;
		text-align: right;
	}
	.lightbox .lb-image{max-width: none;}
	.lightboxOverlay{width:100% !important;}
	.lightbox{top:10px !important;}
	.thumbnail:before ,.thumbnail:after {
    content: "";
    display: table;
	}
/*masonry+lightbox*/
	.mapline {
	margin-top: 10px;
	margin-right: auto;
	margin-bottom: 10px;
	margin-left: auto;
	}
	.mapline h4{padding:10px 0px;}
.text-right {padding-right: 12px !important;}
div b{
	color:#000000;
}