@charset "utf-8";
h2{
  background-image: url(../images/all/h2_bg.svg);
  color: #127475;
  background-repeat: no-repeat;
  padding: 0 0 5px 0;
  margin: 0 0 20px 0;
  font-size: 180%;
  font-weight: bold;
  white-space: nowrap;
}

.en h2 {
    letter-spacing: 0;
}

h2 span {
    color: #3f3f3f;
    font-weight: 500;
}
.more{
    text-align: right;
    margin: 20px 0;
}
.more a {
  display: inline-block;
  background-color: #127475;
  position: relative;
  text-decoration: none;
  padding: 10px 40px 10px 20px;
  border-radius: 5px;
  color: #fff;
}

.more a:hover {
    background-color: #065253;
}

.more a::after {
    content: "";
    position: absolute;
    display: block;
    width: 7px;
    height: 7px;
    border-top: solid 1px #ffffff;
    border-right: solid 1px #ffffff;
    -webkit-transform: rotate(45deg) translate(10px, 10px);
    transform: rotate(45deg) translate(0, -50%);
    right: 25px;
    top: 50%;
}

.more a img {
    height: 30px;
}
@media screen and (min-width: 992px) {
  h2{
    background-position: left bottom;
    display: inline-block;
    background-size: 100%;
}
}
@media screen and (max-width: 992px) {
  h2{
    text-align: center;
    background-position: center bottom;
    background-size: 17%;
}
}
/*banner*/

.banner {
  margin-bottom: 0 !important;
  text-align: center;
}


.banner img {
  max-width: 100%;
}

.banner .slick-slide {
  position: relative;
}

.banner .slick-slide a {
    display: block;
}

.banner .slick-next {
  -moz-transform: scaleX(-1) translate(0, -50%);
  -webkit-transform: scaleX(-1) translate(0, -50%);
  -o-transform: scaleX(-1) translate(0, -50%);
  -ms-transform: scaleX(-1) translate(0, -50%);
  transform: scaleX(-1) translate(0, -50%);
}

.banner .slick-next,
.banner .slick-prev {
  width: 50px;
  height: 50px;
  top: 50%;
}

.banner .slick-prev {
  z-index: 1;
}

.banner .slick-next:before,
.banner .slick-prev:before {
  content: "";
  background-image: url(../images/index/bn_arrow.svg);
  display: block;
  width: 50px;
  height: 50px;
  position: absolute;
  background-size: cover;
  left: 0;
  top: 0;
}

body .slick-dots li button {
  width: 15px;
  height: 15px;
}

body .slick-dots li {
  margin: 0 3px;
}

body .slick-dots li button:before {
  content: "";
  background-color: #d9d9d9;
  border-radius: 50px;
  opacity: 1;
  width: 15px;
  height: 15px;
}

body .slick-dots li.slick-active button:before {
    background-color: #FFEB3B;
}

.banner .slick-dots li.slick-activity button:before {
  background-color: #4cc9ba;
  opacity: 1;
}
@media screen and (min-width: 1220px) {
  .banner::before,.banner::after {
    left: -1px !important;
    right: -1px !important;
}
}
@media screen and (min-width: 992px) {
  body .slick-dots {
    bottom: 0;
    z-index: 9999;
    width: auto;
    right: 0;
  }
.banner .slick-next {right: 30px;}
.banner .slick-prev {left: 30px;}

}

@media screen and (max-width: 992px) {
  .banner .slick-dots {
    position: relative;
    background-color: #e3e3e3;
    bottom: 20px;
    width: auto;
    display: inline-block;
    border-radius: 50px;
    padding: 0 10px 8px 10px;
  }
.banner .slick-next {right: 15px;}
.banner .slick-prev {left: 15px;}
  .banner .slick-dots {
    display: none !important;
  }
}



/*main*/
.main {
    background-image: url(../images/all/main_bg.jpg);
    min-height: 500px;
    background-position: top -30px center;
    background-repeat: no-repeat;
}
/*訂位*/
.booking_box {
    border-radius: 5px;
    -webkit-box-shadow: 1px 1px 7px 0 rgba(0,0,0,0.3);
    box-shadow: 1px 1px 7px 0 rgba(0,0,0,0.3);
    background-color: #fff;
    padding: 20px;
}

.booking_box .nav-pills .nav-link.active,.booking_box .nav-pills .show>.nav-link {
    background-color: #127475;
    position: relative;
    font-weight: bold;
}

.booking_box .nav-link {
    font-size: 120%;
    padding: 0.5rem 1.5rem;
    background-color: #F2F2F2;
    color: #686868;
}

.en .booking_box .nav-link {
    letter-spacing: 0;
}

.booking_box .nav-item {
    padding: 0 10px 10px 0;
}

.booking_box .nav-pills .nav-link.active::after, .booking_box .nav-pills .show>.nav-link::after {
    content: "";
    border-right: solid 7px transparent;
    border-left: solid 7px transparent;
    border-bottom: solid 7px transparent;
    border-top: solid 10px #127475;
    position: absolute;
    bottom: -15px;
    transform: translate(-50%,0);
    left: 50%;
}

.booking_box .search_box > label{
    color: #686868;
    margin: 0;
}
.booking_box .search_box >legend> label{
     font-size: initial;
    color: #686868;
    margin: 0;
}


.booking_box .search_box .form-select,.booking_box .search_box .form-control {
    border-radius: 0;
    border-bottom: 1px #707070 solid;
    border-top: 0;
    border-left: 0;
    border-right: 0;
    background-image: none;
    position: relative;
    font-weight: bold;
    color: #127475;
    font-size: 130%;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}

.booking_box .search_box .form-control {
    font-weight: normal;
    font-size: 120%;
    padding-top: 0.55rem;
    padding-bottom: 0.56rem;
}

.en .booking_box .search_box .form-control {
    font-size: 100%;
}

.booking_box .search_box .select_box::after {
    content: "";
    border-right: solid 5px transparent;
    border-left: solid 5px transparent;
    border-bottom: solid 5px transparent;
    border-top: solid 7px #127475;
    position: absolute;
    transform: translate(0, -26%);
    right: 5px;
    top: 50%;
}
.booking_box .change{
    /* padding: 0 20px; */
}

.booking_box .change a {
    display: block;
    border-radius: 50px;
    padding: 15px;
    width: 50px;
    height: 50px;
    position: relative;
}

.booking_box .change a:hover {
    background-color: #e5e5e5;
}

.booking_box .change a img {
    max-width: 25px;
    min-width: 25px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}
.booking_box .search_box.date .ic_date {
    position: absolute;
    right: 10px;
    top: 8px;
    opacity: 0.7;
}

.booking_box .search_box.date .ic_date:hover {
    opacity: 1;
}

.booking_box .search_box.date .ic_date img {
    height: 30px;
}
.booking_box .select_box .dropdown-menu.show {
    width: 100%;
}

.booking_box .select_box .dropdown-menu .numspin {
    padding: 0 15px 15px 15px;
}

.booking_box .select_box .dropdown-menu label {
    white-space: nowrap;
    font-size: 110%;
    margin: 0 15px 5px 3px;
    letter-spacing: 0.1rem;
}

.booking_box .select_box .dropdown-menu .input-numspin-element input {
    text-align: center;
    border: 0;
}
.booking_box .select_box .dropdown-menu .input-numspin-element button {
    background-color: #127475;
    width: 45px;
    border: none;
    font-size: 150%;
    font-family: unset;
}
.booking_box .search_box .search_bt {
    background-color: #F4CB57;
    border-radius: 5px;
    font-size: 115%;
    display: block;
    padding: 10px 30px;
    display: -webkit-flex;
    display:flex;
    -webkit-justify-content:center;
    justify-content:center;
    -webkit-align-items:center;
    align-items:center;
    white-space: nowrap;
    color: #000;
    text-decoration: none;
}

.en .booking_box .search_box .search_bt {
    letter-spacing: 0;
}
.booking_box .search_box .search_bt img{
    height: 25px;
    margin: 0 5px 0 0;
}
.booking_box .search_box .search_bt:hover {
    background-color: #FFC107;
}
@media (min-width: 768px) {
  .booking_box {
    margin: -40px 0 0 0;
}
	.booking_box .search_box.date {
    /* min-width: 270px; */
}
}
@media (max-width: 768px) {
  .booking_box {
    margin: -15px 0 0 0;
}
}@media (min-width: 576px) {
  .booking_box .search_box .search_bt {margin: 0 0 0 10px;}
}

/*會員區塊*/
/*最新消息*/
.news_right .list .item a {
    display: block;
    text-decoration: none;
    border-bottom: 1px #B1B1B1 solid;
    padding: 10px;
}

.news_right .list .item a:hover {
    background-color: #efefef;
}
.news_right .list .item .date {
    color: #127475;
    display: inline-block;
    margin: 0 5px 0 0;
}

.news_right .list .item .unit {
    display: inline-block;
    color: #7B5322;
}

.news_right .list .item p {
    color: #000000;
    font-size: 120%;
    margin: 0;
}

.news_right .list .item .date span {padding: 0 3px;}

.news_right .list .item .date .day {
    font-weight: bold;
    font-size: 150%;
}
@media (min-width: 992px) {
.news_area{
	background-image: url(../images/index/newsbg.png);
	background-repeat: no-repeat;
	background-position: left 0 bottom;
	background-size: 40%;
	padding: 0 0 135px 0;
}


.news_area .container {
    padding-left: 10%;
}
  .news_right {
    margin: -15px 0 0 40px;
    width: 100%;
}
}
@media (max-width: 992px) {
.news_area{
	padding: 0 0 35px 0;
}
}


/*wave*/
.parallax > use {
  animation: move-forever 12s linear infinite;
}
.parallax > use:nth-child(1) {
  animation-delay: -2s;
  opacity: 0.5;
}
.parallax > use:nth-child(2) {
  animation-delay: -2s;
  animation-duration: 5s;
  opacity: 0.5;
}
.parallax > use:nth-child(3) {
  animation-delay: -4s;
  animation-duration: 3s;
}

@keyframes move-forever {
  0% {
    transform: translate(-90px, 0%);
  }
  100% {
    transform: translate(85px, 0%);
  }
}
.editorial {
  display: block;
  width: 100%;
  height: 7em;
  max-height: 100vh;
}


/*prevent many large-by-comparison ripples by shrinking the height*/
@media (max-width: 50em) {

  .editorial {
    height: 17vw;
  }
}

@media screen and (min-width: 992px) {
.bottom {
  margin: -110px 0 0 0;
}
}

/*首頁公告*/
.remark .re_title {
    text-align: center;
    color: #6f0000;
    font-size: 120%;
    font-weight: bold;
}

.remark .re_title img {
    width: 50px;
    margin: 0 0 10px 0;
}