@import url('https://fonts.googleapis.com/css?family=Bree Serif|Imprima');
html {
  font-family: Arial, "文泉驛正黑", "WenQuanYi Zen Hei", "儷黑 Pro", "LiHei Pro", "微軟正黑體", "Microsoft JhengHei", "標楷體", DFKai-SB, sans-serif;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}
body,a,p,h1,h2,h3,h4,h5,li,tr,td,th {
  font-family: Arial, "文泉驛正黑", "WenQuanYi Zen Hei", "儷黑 Pro", "LiHei Pro", "微軟正黑體", "Microsoft JhengHei", "標楷體", DFKai-SB, sans-serif;
  margin: 0;
}
a, p {
  font-size: 1em;
}
a, a:hover, a:focus {
  color: inherit;
  text-decoration: none;
}

* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

/* header */
/* banner */
.header {position:relative;left:0;right:0; width:100%; max-width: 1680px;height:60px; background-color:rgb(61, 137, 127);color:#fff;}
.header .owl-theme {position: relative; padding: 0; height: 100%;}
.header .owl-theme div:not(.owl-controls) {height: 100%; }
.header .owl-theme .owl-slide { background-repeat: no-repeat; background-size: cover; background-position: center; }
.header-text{ z-index: 99;position: absolute; left: 50%;top:50%; color:#fff;text-shadow: 2px 2px 10px rgba(0,0,0,.5), 2px 2px 1px rgba(0,0,0,1);transform:translate(-50%,-50%);}
.header-t1{ text-align:center; font-size: 3em; line-height:1.6em;letter-spacing: .2em;}
.header-t2{ padding-bottom: 0px;text-align:center; font-size: 1.4em;font-weight: bold}
.navbar {
  padding-left: 16%;
  background-color:#009e96;
}

@media (max-width: 1024px) {
  .header-size-l { height:339px; }
  .header-size-s { height:50px; }
  .header-t1{ font-size: 1.8em; }
  .header-t2{ font-size: 1.2em;}
}

@media (max-width: 640px) {
  .header-size-l { height:200px; }
  .header-size-s { height:50px; }
  .header-t1{ font-size: 1em; }
  .header-t2{ font-size: 1em;}
  .navbar {padding-left: 30px}

}

@media (max-width: 480px) {
  .navbar { width: 100%; }
}


.title {padding: 20px 30px;
	text-align: center;
}

/* content */
.content {
	padding: 20px 30px; }
.inner {
	padding: 20px 0;}

.flow {
  width: 80%; 
  min-height: 40px; 
  border-color: gray; 
  border-style: ridge; 
  border-radius: 10px; 
  margin: 10px auto;
  padding: 15px 10px;
  line-height: 30px;
}
.btn-link {
  color: #000000;
  text-decoration:none;
  white-space: normal !important;
  word-wrap: break-word;
  text-align: left;
  line-height: 1.4;
}

  @media (max-width: 1024px) {
}

@media (max-width: 640px) {
  .content>img {width: 64px;}

}

@media (max-width: 480px) {

}

/*room*/
.carousel {
    position: relative;
    margin: 0 auto;
  }

/* roominfo */
.roominfo {
    float: left;
    border-bottom: 1px solid #d2d2d2;
    padding: 20px 0;
    line-height: 1.3em;
 }

 .roominfo ul{
    margin: 0 0 -25px;
 }

 .roominfo ul li {
    display: inline-block;
    margin: 0 0 20px;
    width: 200px;
    vertical-align: middle;

 }

@media (max-width: 1024px) {
}

@media (max-width: 640px) {

}

@media (max-width: 480px) {

}


/*okbook*/
.okbook {
    text-align: center;
    padding: 30px 0 0;
    width: 100%;
}

.okbook ul {
    padding: 0;
    text-align: left;
    width: calc( 100% );
    margin-left: -10px;
    text-align: center;
}
.okbook ul li {
    display: inline-block;
    text-align: center;
    margin: 0 2% 30px;
    width: 200px;
  }

.okbook ul li h3 {
    color:rgb(61, 137, 127);
    font-size: 1.1em;
    margin: 10px 0 0 0;
}
.okbook ul li p {
    font-size: 1em;
    color: #6d6e71;
    margin: 6px 0 6px;
  }
small {
    font-size: .8em;
    color: #999;
}

.bookingimg {
    width: 100%;
    height: 176px;
    background-size: auto 100%;
    background-position: center;
    background-repeat: no-repeat;
  }

.fc-title{white-space:pre-line;}
.fc-event{color:#fff!important;border:1px solid rgb(61, 137, 127);background-color:rgb(61, 137, 127) }
.showData button.add {
  width:22px;
  height:22px;
  margin-right:10px;
}
.fa-times{margin-left:5px;}

/*order*/
.booking-state {font-size:20px;}
.booking-state .fa{font-size:15px;line-height:32px;color:#ccc;}
.booking-state .hold{color:#f00;}
.booking-detial{margin:0;padding:0;list-style:none}
.booking-detial li{margin:0;padding:5px;}
.booking-list{margin:0;padding:0;list-style:none}
.booking-list li{margin:0;padding:3px;}
.booking-editlist{margin:0;padding:0;list-style:none}
.booking-editlist li{margin:0;padding:3px;cursor: pointer;}
.booking-editlist li:hover{color: rgb(0, 86, 179)}
.booking-editlist li:hover i{display: inline-block;}
.booking-editlist i{display:none;padding-left:5px ;vertical-align: middle;color: black}

/*news-detail*/
.news{
width: 93%;
margin: 0 auto;
padding: 5px 0 10px 3px;
}
.news h1{ padding-bottom:10px;
}
.news article{
width:95%;
padding:5px 10px 2px;
border-bottom: 1px dotted #000000;
}
.news article.last_news{border-bottom: 1px dotted #000000;
}
.news article ul {
display: inline-flex;
padding-left: 0;
}

.news article ul li{
display: inline;
}

.licontent {
  padding: 0 10px;
}
.licontent>a {color:rgb(61, 137, 127); }

.news p{ padding:0px;  overflow:hidden;
/*white-space:nowrap; */
text-overflow: ellipsis;
-ms-text_overflow: ellipsis;
}

@media (max-width: 640px) {
.liimage {
  display: none
}
}
/*page*/
.page-control{padding-top:20px;text-align:center;}
.page-link{display:inline-block;margin:0 4px;border-radius:5px;padding:2px 26px;background:rgb(61, 137, 127);color:#fff !important;font-weight:bold;font-size:1.2em;text-decoration: none;opacity:.7;transition: .2s}
.page-link:hover{opacity:1;}
.page-link-active{opacity:1;}


/*--------------------------------------------------------------*/
/*  Footer
/*--------------------------------------------------------------*/

.footer{clear:both;margin-top:127px;padding:50px 0;background:#009e96;}
.footer-text{box-sizing:border-box;margin:0 auto;width:86%;padding:0 20px;color:#fff;font-size: 1.1em;line-height: 2em}
.footer a{text-decoration: none;color:#fff;}
.footer a:hover{text-decoration: underline;color:#fff;}

@media (max-width: 768px) {
  .footer{margin-top:60px;padding:20px 0;}
  .footer-text{line-height: 1.5em}
}

@media (max-width: 480px) {
  .footer{font-size: .8em}
}


/*--------------------------------------------------------------*/
/*  login
/*--------------------------------------------------------------*/

.login-captcha {align-items: stretch;margin-bottom: 30px;display: flex;flex-wrap: wrap;margin-top: 10px;}
.login-captcha .excaptcha{margin-left: 5px;}
.login-captcha-input {width:50%;max-width:100px;}

/*exlocus captcha*/
.excaptcha {display: flex;box-sizing: border-box;}
.excaptcha-refresh {margin-left: 5px;border:none;background: transparent;font-size: 1.2rem;color: #999}


.ui-input {
    display: block;
    width: 100%;
    padding: .375rem .75rem;
    font-size: 1rem;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    margin-bottom: 10px;
}