/*
 * CSS Document
 * ==========================================================================
 * 版權所有 2014 鉅潞科技網頁設計公司，並保留所有權利。
 * 網站地址: http://www.grnet.com.tw
 * ==========================================================================
 * $Author: Rain, Dora $
 * $Date: 2016-12-22 (四) $
*/

/*==========================================
  Global Style
==========================================
*/
body { margin: 0; padding: 0; font-size: 15px; color: #333; font-family: 'Noto Sans', sans-serif, "思源黑體", "Noto Sans T Chinese", "微軟正黑體", arial; }
img { border: 0; text-decoration: none; }
a,
a:hover,
a:active,
a:focus { text-decoration: none; color: #555; }
.noData,
.systemInfo { text-align: center; margin: 0 auto; padding: 10% 0 15%; /* padding: 30% 0; */ color: #999; }
.noData .fa { font-size: 2em; color: #969696; }
.ulSet,
.ulSet li { margin: 0; padding: 0; list-style: none; }
.reset { margin: 0; padding: 0; list-style: none; }

/* Table Set */
.tabSet,
.tabSet th,
.tabSet td { padding: 0; border: 0; border-spacing: 0; border-collapse: collapse; }
.tabSet input,
.tabSet label,
.tabSet select { vertical-align: middle; }
textarea.safariOff,
input.safariOff { -webkit-appearance: none; border-radius: 0; }

/* 文字編輯器 */
.edit { color: #666; width: 100%; margin: 16px auto; overflow: hidden; line-height: 2em; text-align: justify; }
.edit img { max-width: 100%; height: !important; }

/* 架構 */
.gWrap { position: relative; overflow: hidden; }
#header { z-index: 100; width: 100%; position: fixed; border-bottom: 1px solid #ccc; background: #fff; }
#header .top { top: 0; right: 0; z-index: 19; position: absolute; }
#header .top .booking { background: url('../images/booking.png') center 30px no-repeat #b60005; display: block; width: 120px; height: 110px; float: right; color: #fff; text-align: center; padding-top: 70px; }
#header .top .booking.line { background: url('../images/line-brands.png') center 30px no-repeat transparent; color: #888; }
#header .lang { height: 25px; width: 100px; z-index: 19; left: 39px; top: 17px; padding-left: 21px; color: #000; background: url('../images/icon_earth.png') left center no-repeat; position: absolute; line-height: 25px; }
#header .lang strong { font-weight: normal; cursor: pointer; padding-bottom: 10px; }
#header .lang span { padding: 0 10px; font-size: 0.7em; font-weight: bold }
#header .lang .fa { font-size: 0.8em; }
#header .lang .lang-links { position: absolute; top: 30px; line-height: 24px; background-color: #b60005; z-index: 9999; right: 0; opacity: 0; pointer-events: none; transition: all .3s ease; -o-transition: all .3s ease; -moz-transition: all .3s ease; -webkit-transition: all .3s ease; width: 120px; }
#header .lang .lang-links a { display: block; color: #ffffff; font-size: 14px; text-align: center; padding: 3px 10px; transition: all .3s ease; -o-transition: all .3s ease; -moz-transition: all .3s ease; -webkit-transition: all .3s ease; }
#header .lang .lang-links a:hover { background-color: #333; color: #fff; }
#header .lang:hover .lang-links { pointer-events: auto; opacity: 1; }
#header h1 { height: 80px; width: 126px; margin: 15px auto; }
#header h1 a { display: block; font-size: 0; height: 100%; margin: 0 auto; background: url('../images/logo2.png') center center no-repeat; background-size: 100% auto; transition: all .3s ease; -o-transition: all .3s ease; -moz-transition: all .3s ease; -webkit-transition: all .3s ease; }
#header ul.links { margin: 0 75px 0 10px; /*display: inline-block;*/display: none; font-size: 0; }
#header ul.links li { display: inline-block; position: relative; }
#header ul.links li a { display: block; position: relative; width: 40px; height: 40px; background-position: center center; background-repeat: no-repeat; opacity: .7; transition: all .3s ease; -ms-transition: all .3s ease; -moz-transition: all .3s ease; -webkit-transition: all .3s ease; }
#header nav { position: relative; z-index: 10; width: 100%; -o-transition: all .3s ease; -moz-transition: all .3s ease; }
#header nav .container { position: relative; text-align: center; width: 80%; }
#header ul.nav-links { display: none; }
#header ul.nav-menu > li { display: inline-block; position: relative; vertical-align: bottom; width: 165px; line-height: 24px; }
#header ul.nav-menu > li.logoLi { margin: 0 4%; }
#header ul.nav-menu > li > a { display: block; text-align: center; padding: 0px 10px; font-weight: normal;  /*line-height: 48px;*/ height: 65px; -ms-transition: all .3s ease; -moz-transition: all .3s ease; }
#header ul.nav-menu > li > a:hover,
#header ul.nav-menu > li > a:active,
#header ul.nav-menu > li.current > a { outline: none; }
#header ul.nav-sub { position: absolute; padding: 0; width: 200px; transition: all .3s ease; -o-transition: all .3s ease; -moz-transition: all .3s ease; -webkit-transition: all .3s ease; display: none; z-index: 9999; left: -10px; }
#header ul.nav-sub.open-l { display: block; }
#header ul.nav-sub.open { opacity: 1; }
#header ul.nav-sub > li { position: relative }
#header ul.nav-sub > li > a { display: block; background: rgba(182, 0, 5, 1); text-overflow: ellipsis; white-space: nowrap; transition: all .3s ease; -ms-transition: all .3s ease; -moz-transition: all .3s ease; -webkit-transition: all .3s ease; width: 100%; overflow: hidden; padding: 0 20px; color: #fff; border-bottom: 1px solid rgba(220, 220, 220, 0.35); height: 48px; line-height: 48px; }
#header ul.nav-sub > li > a:hover,
#header ul.nav-sub > li > a:active,
#header ul.nav-sub > li > a.current { background: rgb(67, 67, 67); }
#header ul.nav-menu > li:hover ul.nav-sub { opacity: 1; display: block }
#header ul.nav-third { position: absolute; padding: 0; left: 100%; top: 0; width: 200px; opacity: 0; transition: all .3s ease; -o-transition: all .3s ease; -moz-transition: all .3s ease; -webkit-transition: all .3s ease; }
#header ul.nav-third > li > a { display: block; background: #666; text-overflow: ellipsis; white-space: nowrap; transition: all .3s ease; -ms-transition: all .3s ease; -moz-transition: all .3s ease; -webkit-transition: all .3s ease; width: 100%; overflow: hidden; padding: 0 20px; color: #fff; border-bottom: 1px solid rgba(220, 220, 220, 0.2); height: 48px; line-height: 48px; }
#header ul.nav-third > li > a:hover { background: #333 }
#header ul.nav-sub > li:hover ul.nav-third { opacity: 1; }
#index #header { position: fixed; bottom: 50px; background: transparent; border-bottom: none; }
#index #header .top .booking { opacity: 0; }
#index #header .lang { display: none; }
#index #header h1 { height: 296px; width: 472px; }
#index #header h1 a { background: url('../images/logo.png') center center no-repeat; background-size: 100% auto; }
#index #header ul.nav-menu > li.logoLi { width: 467px; position: absolute; bottom: 271px; margin-left: -250px; }
#index #header ul.nav-menu > li > a { color: #fff; }
#index #header ul.nav-sub { bottom: 60px; }

/* Fixed */
#header.fixheader { position: fixed; box-shadow: none; top: 0; left: 0; height: 110px; border-bottom: 1px solid #ccc; background: rgba(255, 255, 255, 0.9); }
#header.fixheader h1 { position: relative; width: 143px; height: 80px; margin: 20px auto 10px; }
#header.fixheader h1 a { background-size: 100% auto; background: url('../images/logo2.png') center center no-repeat; padding: 0; }
#header.fixheader nav { background: none; border: none; box-shadow: none; }
#header.fixheader nav ul.nav-menu > li > a { color: #333; }
#header.fixheader ul.nav-sub { top: 50px; }
#header.fixheader ul.nav-menu > li.logoLi { bottom: 0; position: relative; margin: 0; width: auto; }
#header.fixheader .nav-menu > li > a:hover,
#header.fixheader .nav-menu > li > a:active,
#header.fixheader .nav-menu > li.current > a { outline: none; color: #333; }
#index #header.fixheader { background: #fff; border-bottom: 1px solid #ccc; }
#index #header.fixheader h1 { width: 126px; position: relative; height: 80px; margin: 15px auto; }
#index #header.fixheader h1 a { background: url('../images/logo2.png') }
#index #header.fixheader .top .booking { opacity: 1; }
#index #header.fixheader ul.nav-menu > li.logoLi { position: relative; width: 126px; margin: 0 50px; bottom: 0; }
#index #header.fixheader nav ul.nav-menu > li > a { color: #333; }
#index #header.fixheader .lang { display: block; }
#index #header.fixheader ul.nav-sub { top: 65px; }
@media (max-width:1680px) {
  #header ul.nav-menu > li > a { padding: 0px 10px; }
  #index #header { bottom: 13%; }
  #index #header h1 { margin: 0 auto; }
  #header .top .booking { width: 100px; font-size: 12px; padding-top: 70px; }
  #header ul.nav-menu > li.logoLi { margin: 0 2%; }
  #header ul.nav-sub { left: -25px; }
}
@media (max-width:1480px) {

}
@media (max-width:1366px) {
  #header .top .booking { width: 80px; font-size: 10px; }
  #header .leftMenu> li> a> span { display: none; }
  #header .leftMenu> li { margin-right: 5px; }
  #header ul.nav-menu > li > a { padding: 0px 10px; }
  #index #header { bottom: 24%; }
  #index #header h1 { width: 350px; }
  #index #header ul.nav-menu > li.logoLi { bottom: 139px; }
  #index #header.fixheader nav ul.nav-menu > li > a { padding: 0px 24px; }
  #index #header.fixheader ul.nav-menu > li.logoLi { margin: 0 2%; }
}
@media (max-width:1199px) {
  #header nav .container { }
  #header { border-bottom: 1px solid #ccc; }
  #header .top { }
  #header .top h1 { height: 60px; left: 15px; top: 8px; }
  #header .top .booking { width: 60px; font-size: 10px; }
  #header h1 a { display: block; font-size: 0; background: url('../images/logo2.png') center center no-repeat; background-size: contain; }
  #header .leftMenu> li> a { padding: 0; }
  #header.fixheader.top h1 { top: 8px; }
  #header.fixheader h1 { width: 109px; margin: 0; height: 44px; position: absolute; }
  #header ul.nav-menu > li > a { padding: 0 10px; }
  #index #header { bottom: 35%; }
  #index #header.fixheader nav ul.nav-menu > li > a { padding: 0 16px; }
}
@media (max-width:991px) {
  #header { height: 65px; top: 0; background: rgba(0, 0, 0, 0.9); }
  #header .top { top: 0; }
  #header .lang { right: 130px; left: initial; background: url('../images/icon_earth_w.png') 15px center no-repeat; top: 0px; height: 65px; width: 65px; line-height: 65px; padding-left: 44px; color: #fff }
  #index #header .lang{ display: block;}
  #header ul.links{ display: inline-block; }
  #header .lang .lang-links { top: 65px; }
  #header h1 { width: 109px; height: 44px; top: 10px; position: absolute; left: 7px; margin: 0; }
  #header h1 a { background: url('../images/logo_w.png') center center no-repeat; background-size: contain; }
  #header .top .booking { width: 65px; height: 64px; background-size: 30% 30%; background-position: center 15px; padding-top: 40px; overflow: hidden; font-size: 0.5em; }
  #header .top .booking.line { background-size: 32% 32%; background-position: center 15px; color: #efefef}
  #header nav { border: none; position: absolute; width: 100%; top: 65px; height: 0; background: transparent; overflow: hidden; transition: all .5s ease-out; -ms-transition: all .5s ease-out; -moz-transition: all .5s ease-out; -webkit-transition: all .5s ease-out; }
  #header nav.open { box-shadow: none; height: auto; max-height: calc(100vh - 65px); overflow: auto; }
  #header nav .container { width: 100%; text-align: left; padding: 0; background: rgba(182, 0, 5, 0.9); }
  #header ul.nav-menu > li > a { margin: 0 5px; color: #333; }
  #header ul.nav-menu > li { display: block; }
  #header ul.nav-menu > li > a { height: 48px; border-bottom: 1px solid rgba(255, 255, 255, 0.4); text-align: left; padding: 0 15px; margin: 0; line-height: 48px; color: #fff; }
  #header ul.nav-menu > li > a:hover,
  #header ul.nav-menu > li > a:active,
  #header ul.nav-menu > li.current > a { }
  #header ul.nav-sub { position: relative; overflow: hidden; top: 0; display: none; width: 100%; height: 0; }
  #header ul.nav-sub.open-s { height: auto; top: 0; width: 100%; box-shadow: none; }
  #header ul.nav-sub > li { padding: 0; }
  #header ul.nav-sub > li > a { height: 46px; border-bottom: 1px solid rgba(255, 255, 255, .2); background: #333; text-align: left; text-decoration: none; line-height: 46px; padding: 0 50px; }
  #header ul.nav-third { position: relative; left: 0; top: 0; width: 100%; transition: all .3s ease; -o-transition: all .3s ease; -moz-transition: all .3s ease; -webkit-transition: all .3s ease; display: none; }
  #header ul.nav-third > li > a { padding: 0 50px; }
  #header ul.nav-sub > li > ul.nav-third { display: none }
  #header ul.nav-sub > li > ul.nav-third.open-s { height: auto; top: 0; width: 100%; box-shadow: none; display: block; }
  #header ul.links li:last-child { display: inline-block; }
  #header ul.links li a.nav-btn span { display: block; position: absolute; width: 25px; height: 1px; background: rgb(255, 255, 255); left: 6px; transition: all .3s linear; -ms-transition: all .3s linear; -moz-transition: all .3s linear; -webkit-transition: all .3s linear; }
  #header ul.links li a.nav-btn span:nth-child(1) { top: 10px; }
  #header ul.links li a.nav-btn span:nth-child(2) { top: 17px; }
  #header ul.links li a.nav-btn span:nth-child(3) { top: 24px; }
  #header ul.links li a.nav-btn span:nth-child(4) { width: 30px; top: 17px; left: 6px; opacity: 0; transform: rotate(45deg) scale(0); -ms-transform: rotate(45deg) scale(0); -moz-transform: rotate(45deg) scale(0); -webkit-transform: rotate(45deg) scale(0); }
  #header ul.links li a.nav-btn span:nth-child(5) { width: 30px; top: 17px; left: 6px; opacity: 0; -ms-transform: rotate(-45deg) scale(0); -moz-transform: rotate(-45deg) scale(0); -webkit-transform: rotate(-45deg) scale(0); }
  #header ul.links li a.nav-btn.open span:nth-child(1),
  #header ul.links li a.nav-btn.open span:nth-child(3) { left: 29px; opacity: 0; }
  #header ul.links li a.nav-btn.open span:nth-child(2) { left: 9px; opacity: 0; }
  #header ul.links li a.nav-btn.open span:nth-child(4) { opacity: 1; transform: rotate(45deg) scale(1); -ms-transform: rotate(45deg) scale(1); -moz-transform: rotate(45deg) scale(1); -webkit-transform: rotate(45deg) scale(1); }
  #header ul.links li a.nav-btn.open span:nth-child(5) { opacity: 1; transform: rotate(-45deg) scale(1); -ms-transform: rotate(-45deg) scale(1); -moz-transform: rotate(-45deg) scale(1); -webkit-transform: rotate(-45deg) scale(1); }
  #header.fixheader { height: 55px; background: #000; border: 0; }
  #header.fixheader.top { top: 20px; }
  #header h1 { width: 140px; top: 16px; }
  #header.fixheader h1 { width: 109px; height: 44px; left: 20px; top: 0; margin: 0; }
  #header.fixheadernav.open { top: 55px; }
  #index #header { height: 65px; top: 0; background: #000000; border-bottom: 1px solid #878787; }
  #index #header .top .booking { opacity: 1; }
  #index #header h1 { width: 140px; height: 34px; top: 16px; left: 20px; }
  #index #header h1 a { background: url('../images/logo_w.png'); background-size: 100% auto; }
  #index #header ul.nav-sub.open-s { top: 0 }
  #index #header.fixheader { background: #000; }
  #index #header.fixheader h1 { width: 140px; height: 34px; top: 16px; left: 20px; margin: 0; }
  #index #header.fixheader h1 a { background: url('../images/logo_w.png') no-repeat; background-size: 100% auto; }
  #index #header.fixheader nav ul.nav-menu > li > a { color: #fff; }
  #index #header.fixheader nav ul.nav-menu > li > a { color: #fff; }
}
@media (max-width:680px) {
  #header h1 { width: 130px; left: 10px;}
  #index #header h1 { left: 10px;}
  #index #header.fixheader h1 { left: 10px;}
  #header .top .booking { width: 60px;  }
  #header .lang { right: 115px; }
  #index #header .lang{ width: 60px; right: 120px;}
  #header ul.links { margin-right: 50px; }
  #header ul.nav-links { display: block; height: 40px; font-size: 0; margin-top: 20px; }
  #header ul.nav-links li { display: inline-block; width: 33.33333%; }
  #header ul.nav-links li a { display: block; width: 40px; height: 40px; margin: 0 auto; opacity: .7; transition: all .3s ease; -ms-transition: all .3s ease; -moz-transition: all .3s ease; -webkit-transition: all .3s ease; }
  #header ul.nav-links li a:hover,
  #header ul.nav-links li a:active { opacity: 1; }
  #header ul.nav-menu { margin-top: 0; }
  #header .leftMenu { }
  #header .leftMenu> li> a .fa-facebook-square { padding-left: 0px; padding-top: 2px; font-size: 1.2em; color: #e88aaa; }
}

/* footer */
.bookingBox { text-align: center; overflow: hidden; height: 325px; }
.bookingBox .btnBooking { text-transform: uppercase; display: block; height: 50px; color: #fff; -webkit-transform: scale(0.9); -ms-transform: scale(0.9); transform: scale(0.9); width: 300px; margin: 0 auto; }
.bookingBox .btnBooking:hover { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1.); }
#footer { position: relative; line-height: 1.8em; color: #fff; text-align: center
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr ='#454545', endColorstr ='#313131');/*INNER ELEMENTS MUST NOT BREAK THIS ELEMENTS BOUNDARIES*//*Element must have a height (not auto)*/

  /*All filters must be placed together*/
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr ='#454545', endColorstr ='#313131')";/*Element must have a height (not auto)*//*All filters must be placed together*/
background-image: -moz-linear-gradient(top, #454545, #313131); background-image: -ms-linear-gradient(top, #454545, #313131); background-image: -o-linear-gradient(top, #454545, #313131); background-image: -webkit-gradient(linear, center top, center bottom, from(#454545), to(#313131)); background-image: -webkit-linear-gradient(top, #454545, #313131); background-image: linear-gradient(top, #454545, #313131);/*--IE9 DOES NOT SUPPORT CSS3 GRADIENT BACKGROUNDS--*/ }
#footer a { color: #fff; text-transform: lowercase; margin: 0 5px; }
#footer .footWrap { text-transform: uppercase; color: #ffffff; text-align: center; padding: 24px 15px 15px; font-size: 0.95em; }
#footer .footWrap .fa { font-size: 1.2em; }
#footer a:hover,
#footer a:focus { color: #f5f5f5; }
#footer .footWrap .brShow { display: none; }
#footer .footWrap .copyright { font-size: 0.9em; font-family: 'Times New Roman'; font-weight: bold; margin: 15px 0; }
#footer .footWrap .copyright a { font-family: 'Arial'; font-weight: normal }
#footer .grnet { color: #ccc; padding-left: 10px; }
@media (max-width:680px) {
  .bookingBox { height: 200px; }
  .bookingBox .btnBooking { height: 50px; }
}
@media (max-width:480px) {
  #footer .footWrap .brShow { display: block; }
}

/* ==========================================
   Page Set.
   ==========================================
*
/* Title*/
.pContent { padding-top: 60px; }
.iTitle { font-size: 1.9em; color: #1e1e1e; text-align: center; font-family: 'New Times Roman', serif; font-weight: 700; margin: 80px auto 50px; text-transform: uppercase; }
.iTitle span { display: block; font-size: 0.6em; font-family: "微軟正黑體", arial; margin: 10px auto; }
.white { color: #fff; }
.dark { color: #222; font-weight: 700; }
.pban { overflow: hidden; position: relative; }
.pban > img { width: 100%; height: auto; }
.h2 { text-align: center; margin: 10px auto 0; padding-top: 60px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); text-align: center; font-family: 'New Times Roman', serif; }
.h2 > span { }
.h2 span.en { text-transform: uppercase; text-align: center; font-weight: 700; font-size: 0.8em; }
.h2 span.cn { font-size: 0.6em; display: block; font-family: "微軟正黑體", arial; margin: 10px auto; }
@media screen and (max-width:991px) {
  .pban { margin: 65px 0 0; }
}
@media screen and (max-width:680px) {
  .iTitle { margin: 4% auto 3%; }
  .bookingBox .iTitle { margin: 80px auto 10px; }
  .pban > img { width: 768px; height: 200px; margin-left: -384px; position: relative; top: 0; left: 50%; }
}

/*麵包屑*/
.breadcrumb { background: none; padding: 8px 15px; margin: 0 auto 35px; }
.breadcrumb > a { color: #222; font-size: 12px; background: url(../images/bread_aw.png) right center no-repeat; background-size: 6px 9.5px; padding: 0 15px 0 0; margin: 0 8px 0 0; }
.breadcrumb > a:last-child { background: none; margin: 0; color: #9fa0a0; }

/*內頁標題*/
.h3 { text-align: center; margin: 0 0 45px; }
.h3 span.cn { font-size: 22px; color: #222222; margin: 0 5px 0 0; }
.h3 span.en { font-size: 14px; color: #b60005; text-transform: uppercase; }
@-webkit-keyframes pslideInUp {
  0% { -webkit-transform: translateY(20%); transform: translateY(20%); visibility: visible; }
  100% { -webkit-transform: translateY(0); transform: translateY(0); }
}
@keyframes pslideInUp {
  0% { -webkit-transform: translateY(20%); transform: translateY(20%); visibility: visible; }
  100% { -webkit-transform: translateY(0); transform: translateY(0); }
}
.pslideInUp { -webkit-animation-name: pslideInUp; animation-name: pslideInUp; }

/****** 頁碼 ******/
#pageWrap { height: 28px; line-height: 28px; text-align: center; margin: 40px 0; }
#pageWrap a { -webkit-transition: all 0.4s ease-in-out; -moz-transition: all 0.4s ease-in-out; -ms-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; }
#pageWrap .numbers { display: inline-block; padding: 0 5px; text-align: center; }
#pageWrap .numbers a { display: inline-block; margin: 0 1px; width: 28px; height: 28px; color: #282828; text-align: center; text-decoration: none; line-height: 28px; }
#pageWrap .numbers a:hover { color: #fff; background-color: #626262; }
#pageWrap .numbers span a { background-color: #b60005; color: #fff }
#pageWrap .btnPrev,
#pageWrap .btnNext { display: inline-block; width: 28px; height: 28px; vertical-align: top; line-height: 28px; }
#pageWrap .btnPrev a,
#pageWrap .btnNext a,
#pageWrap .btnPrev .noPrev,
#pageWrap .btnNext .noNext { display: block; position: relative; width: 100%; height: 100%; text-indent: -9999px; }
#pageWrap .btnPrev a:before,
#pageWrap .btnNext a:before,
#pageWrap .btnPrev .noPrev:before,
#pageWrap .btnNext .noNext:before { display: block; content: ''; position: absolute; top: 50%; left: 50%; margin-top: -4px; margin-left: -3px; width: 0; height: 0; border-width: 4px; border-style: solid; border-color: transparent; }
#pageWrap .btnPrev a:before { border-left-width: 0; border-right-color: #b60005; }
#pageWrap .btnNext a:before { margin-left: -2px; border-right-width: 0; border-left-color: #b60005; }
#pageWrap .btnPrev .noPrev:before { border-left-width: 0; border-right-color: #bbb; }
#pageWrap .btnNext .noNext:before { margin-left: -2px; border-right-width: 0; border-left-color: #bbb; }
#pageWrap .btnPrev a:hover,
#pageWrap .btnNext a:hover { border: #b60005 solid 1px; background-color: #b60005; }
#pageWrap .btnPrev a:hover:before { border-right-color: #fff; }
#pageWrap .btnNext a:hover:before { border-left-color: #fff; }
@media (max-width:767px) {
  #pageWrap { margin-top: 20px; }
}

/* Button */
.btnCom { position: relative; display: inline-block; color: #fff; line-height: 40px; border: 1px solid #b60005; padding-right: 20px; transition: all .3s ease; -o-transition: all .3s ease; -moz-transition: all .3s ease; -webkit-transition: all .3s ease; text-align: center; height: 42px; padding: 0 42px; font-size: 1.14285em; background: #b60005; }
.btnCom:hover { background: #333; color: #fff; }
.centerWrap { text-align: center }
.center { text-align: center; margin: 0 auto; }
a#gotop { display: block; position: fixed; width: 50px; height: 50px; background: url(../images/aw_top.png) center center #4e4e4e no-repeat; border-radius: 100%; text-align: center; right: 40px; bottom: 30px; opacity: .75; z-index: 999; transition: all .3s ease-in-out; -ms-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out; transform: scale(0.5); -ms-transform: scale(0.5); -moz-transform: scale(0.5); -webkit-transform: scale(0.5); color: #fff; opacity: 0; line-height: 50px; }
a#gotop.view { transform: scale(1); -ms-transform: scale(1); -moz-transform: scale(1); -webkit-transform: scale(1); opacity: 0.9 }
a#gotop:hover { opacity: 1; transform: rotate(361deg); -ms-transform: rotate(361deg); -moz-transform: rotate(361deg); -webkit-transform: rotate(361deg); -o-transform: rotate(361deg); }

/* ==========================================
   Index Set.
   ==========================================
*/
#iBanner .banner { position: relative; width: 100%; overflow: hidden; }
#index .indexWrap { width: 1200px; margin: 0 auto; padding: 15px; }
#index .iAbout { text-align: center }
#index .iAbout p.txt { margin: 0 auto 30px; line-height: 1.8em; }
#index .iAbout .box { }
#index .iAbout .box .iconBox { background: #b60005; width: 135px; height: 135px; margin: 0 auto; border-radius: 100%; line-height: 135px; }
#index .iAbout .box .iconBox img { line-height: 161px; vertical-align: middle; max-width: 90%; transition: all .3s ease; -o-transition: all .3s ease; -moz-transition: all .3s ease; -webkit-transition: all .3s ease; }
#index .iAbout .box .iconBox:hover img { transform: rotate(361deg); -ms-transform: rotate(361deg); -moz-transform: rotate(361deg); -webkit-transform: rotate(361deg); -o-transform: rotate(361deg); }
#index .iAbout .box .txt { font-size: 2em; color: #666; margin: 30px auto; display: inline-block; border-bottom: 1px solid #666; line-height: 1em; }
#index .iRoom .roomWrap .roomBox:nth-child(5) { background-image: url('../images/i_room_5.png') }
#index .iRoom { padding-bottom: 5%; }
#index .iRoom .roomWrap { font-size: 0; text-align: center }
#index .iRoom .roomWrap .roomBox { display: inline-block; position: relative; width: 20%; height: 529px; background: url('../images/i_room_1.png'); background-size: cover; background-repeat: no-repeat; background-position: center center; -webkit-filter: brightness(0.8); transition: all .3s ease; -o-transition: all .3s ease; -moz-transition: all .3s ease; -webkit-transition: all .3s ease; }
#index .iRoom .roomWrap .roomBox .txt { color: #fff; font-size: 13px; transform: rotate(90deg); -ms-transform: rotate(90deg); -moz-transform: rotate(90deg); -webkit-transform: rotate(90deg); -o-transform: rotate(90deg); display: block; position: absolute; text-align: right; text-transform: uppercase; font-family: arial; letter-spacing: 8px; top: 46%; left: -104%; height: 19px; width: 530px; }
#index .iRoom .roomWrap .roomBox:hover { -webkit-filter: brightness(1); }
#index .iRoom .roomWrap .roomBox:hover:after { content: ''; width: 100%; display: block; position: absolute; left: 0; bottom: -5px; height: 5px; opacity: 1; background: #634b21; }
#index .iRoom .roomWrap .roomBox:nth-child(1) { background-image: url('../images/i_room_1.png') }
#index .iRoom .roomWrap .roomBox:nth-child(2) { background-image: url('../images/i_room_2.png') }
#index .iRoom .roomWrap .roomBox:nth-child(3) { background-image: url('../images/i_room_3.png') }
#index .iRoom .roomWrap .roomBox:nth-child(4) { background-image: url('../images/i_room_4.png') }
#index .iRoom .roomWrap .roomBox:nth-child(5) { background-image: url('../images/i_room_5.png') }
#index .iNews { background: url('../images/i_news_bg.jpg') center center no-repeat; background-size: cover; padding: 2% 0; }
#index .iNews .newsBox { position: relative; display: block; background: #000; }
#index .iNews .newsBox .hover { position: absolute; margin-left: -117px; margin-top: -100px; width: 235px; height: 208px; background: rgba(83, 83, 83, 0.7); border: 14px solid rgba(255, 255, 255, 0.6); top: 50%; left: 50%; color: #fff; text-align: center; opacity: 0; transition: all .3s ease; -o-transition: all .3s ease; -moz-transition: all .3s ease; -webkit-transition: all .3s ease; -webkit-filter: blur(2px); -moz-filter: blur(2px); -ms-filter: blur(2px); filter: blur(2px); filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=2, MakeShadow=false); }
#index .iNews .newsBox .hover .ti { background: url('../images/ti_gap.png') center top no-repeat; margin: 30px auto 0; line-height: 1.5em; padding: 40px 10px 0; height: 5.5em; overflow: hidden; }
#index .iNews .newsBox .hover .date { background: url('../images/date_bg.png') center bottom no-repeat; height: 36px; line-height: 36px; font-size: 0.8em; position: absolute; bottom: 0; width: 100%; font-family: 'New Times Roman', serif; }
#index .iNews .newsBox:hover .hover { opacity: 1; -webkit-filter: blur(0); -moz-filter: blur(0); -ms-filter: blur(0); filter: blur(0); filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=0, MakeShadow=false); }
#index .iNews .newsBox:hover img { opacity: 0.5; -webkit-filter: blur(2px); -moz-filter: blur(2px); -ms-filter: blur(2px); filter: blur(2px) }
#index .iGroup { background: url('../images/i_group_bg.png') left bottom #fff; padding: 4% 0 2%; background-size: auto 67%; }
@media (max-width:1199px) {
  #index .indexWrap { width: 100%; }
}
@media (max-width:991px) {
  #iBanner { margin-top: 65px; }
  #index .iAbout .box .iconBox { width: 120px; height: 120px; line-height: 100px; }
  #index .iRoom .roomWrap .roomBox { width: 33%; text-align: center; height: 250px; }
  #index .iRoom .roomWrap .roomBox .txt { left: -94%; top: -43px; }
}
@media (max-width:680px) {
  #index .iAbout .box .iconBox { width: 100px; height: 100px; line-height: 100px; }
}
@media (max-width:480px) {
  #index .iRoom .roomWrap .roomBox { width: 100%; height: 200px; }
  #index .iRoom .roomWrap .roomBox .txt { transform: rotate(0); -ms-transform: rotate(0); -moz-transform: rotate(0); -webkit-transform: rotate(0); -o-transform: rotate(0); position: relative; left: 0; top: 0; text-align: center; width: 100%; margin: 29% auto; color: #fff; }
}
@media (max-width:320px) {
  #index .iAbout .box { width: 100%; }
  #index .iAbout .box .iconBox { width: 135px; height: 135px; margin: 0 auto; border-radius: 100%; line-height: 135px; }
}

/* =====================================
   會館導覽
===================================== */
#tourism .h2 { position: static; transform: translate(0, 0); -ms-transform: translate(0, 0); -moz-transform: translate(0, 0); -webkit-transform: translate(0, 0); margin: 0 0 35px; }
#tourism .pContent { width: 100%; padding: 0; }
#tourism .infoWrap { background: url('../images/hotel_bg.gif') top center no-repeat; background-size: cover; }
#tourism .infoWrap .infoTxt { width: 76%; margin: 3% auto; line-height: 2em; text-align: center; }
#tourism .h3 { font-weight: normal; font-size: 1.4em; margin: 45px auto 20px; }
#tourism .h3.title { position: relative; text-align: left; }
#tourism .h3.title:after { content: ''; display: block; position: absolute; width: 60px; height: 1px; background: #eaeaea; bottom: -10px; }
#tourism .iconWrap { margin: 2% auto 5%; text-align: center; }
#tourism .iconWrap .box { width: 33%; display: inline-block; margin: 1% 0; vertical-align: top; text-align: left; }
#tourism .iconWrap .box .pic { width: 40px; height: 40px; display: inline-block; line-height: 40px; background: #b60005; border-radius: 100%; text-align: center; margin-right: 20px; }
#tourism .iconWrap .box .pic img { width: 47%; line-height: 40px; vertical-align: middle; display: inline-block; max-height: 50%; }
#tourism .iconWrap .box .txt { display: inline-block; font-size: 1.1em; }
#tourism .boxBot { margin-top: -30px; }
#tourism .boxBot .txtBox { line-height: 2em; color: #666; }
#tourism .boxBot .row { margin-bottom: 2%; vertical-align: middle; }
#tourism .boxBot .row >div img { margin-bottom: 20px; }
#tourism #guest .infoWrap { background: url('../images/guest_bg.jpg') top center; background-size: contain; text-align: center; }
#tourism #guest .guideLink { display: inline-block; line-height: 40px; text-align: center; position: relative; color: #fff; height: 40px; background: #ccc; padding: 0 20px; margin: 0 30px 0; border-radius: 40px; }
#tourism #guest .guideLink.current,
#tourism #guest .guideLink:hover { background: #b60005; }
#tourism #guest .guideLink.current:after { display: block; position: absolute; bottom: -5px; left: 50%; margin-left: -3px; content: ''; width: 0; height: 0; border-top: 5px solid #b60005; border-right: 5px solid transparent; border-left: 5px solid transparent; }
#tourism #guest .picWrap { margin: 50px auto; }
#tourism #guest .picWrap .picBox { position: relative; display: inline-block; margin: 10px 10%; vertical-align: text-top; }
#tourism #guest .picWrap .picBox:after { position: absolute; content: ''; border-radius: 240px; width: 240px; height: 240px; border: 1px solid #fff; right: 0; top: -10px; }
#tourism #guest .picWrap .picBox:first-child { margin-left: 0 }
#tourism #guest .picWrap .picBox:nth-child(2):after { right: -5px; }
#tourism #guest .picWrap .picBox:nth-child(3) { margin-right: 0 }
#tourism #guest .picWrap .picBox:nth-child(3):after,
#tourism #guest .picWrap .picBox:nth-child(4):after { left: 0; }
#tourism #guest .picWrap .picBox:last-child:after { left: 0; }
#tourism #guest .picWrap .picBox .borderW { position: relative; width: 225px; height: 225px; line-height: 225px; border-radius: 205px; overflow: hidden; margin: 10px auto; background: #fff; box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.2); }
#tourism #guest .picWrap .picBox .border { line-height: 205px; width: 205px; height: 205px; border-radius: 205px; background: #fff; overflow: hidden; border: 1px solid #e3e3e3; margin: 10px auto; }
#tourism #guest .picWrap .picBox .borderW .more { position: absolute; width: 120px; height: 120px; border-radius: 120px; background: rgba(182, 0, 5, 0.9); color: #fff; top: 50%; left: 50%; line-height: 120px; margin-top: -60px; margin-left: -60px; font-family: 'New Times Roman', serif; font-size: 0.8em; opacity: 0; transition: all .3s ease; -o-transition: all .3s ease; -moz-transition: all .3s ease; -webkit-transition: all .3s ease; }
#tourism #guest .picWrap .picBox .borderW .more:after { content: ''; display: block; position: absolute; bottom: 0; left: 50%; width: 1px; height: 34px; background: #fff; }
#tourism #guest .picWrap .picBox:hover .borderW .more { transform: rotateY(360deg); opacity: 1 }
#tourism #guest .picWrap .picBox .border img { }
#tourism #guest .picWrap .picBox .txt { margin: 20px auto; font-size: 1.1em; }
#tourism #guest .walkWrap { margin: 38px auto; font-size: 0; }
#tourism #guest .walkWrap .walkBox { padding: 0; background: #fff; display: inline-block; font-size: 0; vertical-align: sub; margin: 0 0 30px 0; }
#tourism #guest .walkWrap .walkBox:hover { border-bottom: 1px solid #b60005; }
#tourism #guest .walkWrap .walkBox.small { width: calc(100%/2 - 15px); }
#tourism #guest .walkWrap .walkBox .picBox { padding: 0; width: 40%; font-size: 0; display: inline-block; vertical-align: middle; overflow: hidden; }
#tourism #guest .walkWrap .walkBox .picBox img { }
#tourism #guest .walkWrap .walkBox.small.left { margin-right: 15px; }
#tourism #guest .walkWrap .walkBox.small.right { margin-left: 15px; }
#tourism #guest .walkWrap .walkBox .txtBox { margin: 0 auto; text-align: left; width: calc(60% - 0px); font-size: 15px; display: inline-block; padding: 15px; vertical-align: middle; }
#tourism #guest .walkWrap .walkBox .txtBox .title { font-size: 1.1em; background: url('../images/pin.png') left 0 no-repeat; padding-left: 30px; border-bottom: 1px solid #efefef; padding-bottom: 10px; color: #b60005; font-weight: normal; width: 70%; margin: 0 auto 10px; }
#tourism #guest .walkWrap .walkBox .txtBox .txt { color: #666; line-height: 1.8em; width: 70%; margin: 0 auto; text-align: justify; font-size: 0.9em; }
@media (max-width:1360px) {
  #tourism #guest .picWrap .picBox { margin: 10px 5% }
  #tourism #guest .walkWrap .walkBox .txtBox .title,
  #tourism #guest .walkWrap .walkBox .txtBox .txt { width: 90%; }
}
@media (max-width:1199px) {
  #tourism #guest .walkWrap .walkBox .picBox { width: 25%; }
  #tourism #guest .walkWrap .walkBox .txtBox { width: calc(75% - 0px); }
  #tourism #guest .picWrap .picBox { margin: 10px 2% }
}
@media (max-width:991px) {
  #tourism .infoWrap .infoTxt { width: 100%; }
  #tourism .iconWrap .box { width: 32%; }
  #tourism .iconWrap .box .pic,
  #tourism .iconWrap .box .txt { display: block; margin: 10px auto; text-align: center }
  #tourism .iconWrap .box .pic { width: 60px; height: 60px; line-height: 60px; }
  #tourism .boxBot { margin-top: 30px; }
  #tourism .h3.title { margin: 0 }
  #tourism .boxBot .row .col-sm-6 img { width: 100%; max-width: 450px; }
  #tourism #guest .picWrap .picBox { width: 30%; }
  #tourism #guest .picWrap .picBox:after { display: none; }
  #tourism #guest .picWrap .picBox .borderW { width: 150px; height: 150px; line-height: 150px; }
  #tourism #guest .picWrap .picBox .border { width: 140px; line-height: 138px; height: 140px; margin: 5px auto; }
  #tourism #guest .picWrap .picBox .border img { max-width: 73% }
  #tourism #guest .walkWrap .walkBox.small { width: 100%; }
  #tourism #guest .walkWrap .walkBox.small.right,
  #tourism #guest .walkWrap .walkBox.small.left { margin: 0 0 30px 0 }
}
@media (max-width:480px) {
  #tourism .iconWrap .box { width: 49%; border: 1px solid #efefef; height: 141px; padding: 2%; }
  #tourism .iconWrap .box .txt { font-size: 1em; }
  #tourism #guest .guideLink { margin: 0 3px; }
  #tourism #guest .picWrap .picBox { width: 45%; margin: 0; }
  #tourism #guest .picWrap .picBox .borderW { width: 120px; height: 120px; line-height: 120px; }
  #tourism #guest .picWrap .picBox .border { width: 110px; line-height: 110px; margin: 5px auto; height: 110px; }
  #tourism #guest .walkWrap .walkBox .picBox { width: 100%; height: 200px; overflow: hidden }
  #tourism #guest .walkWrap .walkBox .picBox img { width: 100%; max-width: 100%; }
  #tourism #guest .walkWrap .walkBox .txtBox { width: 100%; }
}

/* =====================================
   活動資訊
===================================== */
#news .newsBg { background: url('../images/guest_bg.jpg') top center; background-size: cover; }
#news .item { width: 31.333333%; margin: 0 1% 30px; border-bottom: 1px solid #b60005; overflow: hidden }
#news .newsBox { position: relative; background: #fff; overflow: hidden; box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.5); }
#news .newsBox .date { position: absolute; background: #b60005; color: #fff; right: 10px; top: 20px; padding: 5px 15px; font-style: italic; font-family: 'New Times Roman', serif; }
#news .newsBox:hover .date { background: #333; }
#news .newsBox .ti { color: #333; display: block; padding: 5px 7%; }
#news .newsBox:hover .ti { color: #b60005; }
#news .newsBox .picBox { width: 100%; overflow: hidden; display: block; margin-bottom: 20px; }
#news .newsBox .picBox img { width: 100%; transition: all .3s ease; -o-transition: all .3s ease; -moz-transition: all .3s ease; -webkit-transition: all .3s ease; }
#news .newsBox:hover .picBox img { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); }
#news .newsBox .txt { padding: 7%; text-align: justify; line-height: 2em; color: #666; font-size: 0.9em; }
@media screen and (max-width:680px) {
  #news .item { width: 48%; margin-bottom: 20px; }
}
@media screen and (max-width:480px) {
  #news .item { width: 100%; }
}
#newsView .newsBg { background: url('../images/guest_bg.jpg') top center; background-size: cover; }
#newsView .newsBox { background: #fff; padding: 50px 30px; position: relative; margin-bottom: 3%; }
#newsView .lineBox { border-bottom: 1px solid #c3c3c3; padding-bottom: 20px; text-align: right; }
#newsView .date { position: absolute; right: 0; top: 0; font-style: italic; background: #b60005; display: inline-block; color: #fff; position: absolute; text-align: left; font-size: 0.9em; padding: 8px 14px; margin-bottom: 10px; }
#newsView .ti { font-size: 1.5em; text-align: left; }
#newsView .btnBack { }

/* =====================================
   活動花絮
===================================== */
#gallery .galleryBg { background: url('../images/guest_bg.jpg') top center; background-size: cover; }
#gallery .listBox { display: block; border: 1px solid #e3e3e3; margin-bottom: 20px; background: #fff; }
#gallery .listBox:hover { border-bottom: 1px solid #b60005; }
#gallery .listBox .imgBox { background-color: #000; position: relative; overflow: hidden; }
#gallery .listBox .imgBox img { display: block; width: 100%; height: auto; -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); transform: scale(1); -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out; }
#gallery .listBox:hover .imgBox img { opacity: 0.6; -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); -webkit-filter: blur(2px); -moz-filter: blur(2px); -ms-filter: blur(2px); filter: blur(2px); filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=2, MakeShadow=false); }
#gallery .listBox .imgBox .iconView { position: absolute; width: 120px; height: 120px; font-size: 0.8em; border-radius: 120px; background: rgba(182, 0, 5, 0.9); color: #fff; top: 50%; left: 50%; line-height: 120px; margin-top: -60px; margin-left: -60px; font-family: 'New Times Roman', serif; transition: all .3s ease; -o-transition: all .3s ease; -moz-transition: all .3s ease; -webkit-transition: all .3s ease; opacity: 1; z-index: 10; text-align: center; opacity: 0 }
#gallery .listBox .imgBox .iconView:after { content: ''; display: block; position: absolute; bottom: 0; left: 50%; width: 1px; height: 34px; background: #fff; text-align: center; }
#gallery .listBox .imgBox:hover .iconView { transform: rotateY(360deg); opacity: 1 }
#gallery .listBox .txtBox { padding: 20px; min-height: 89px; }
#gallery .listBox .txtBox h4 { max-height: 22px; overflow: hidden; font-size: 1.14285em; font-weight: normal; line-height: 24px; margin: 0 0 5px; text-overflow: ellipsis; white-space: nowrap; }
#gallery .listBox .txtBox .date { font-size: 0.928em; color: #999; padding-right: 10px; margin-bottom: 5px; font-style: italic; font-family: 'New Times Roman', serif; }
#gallery .listBox:hover .txtBox { background: #333; color: #fff }

/* #gallery .listBox:hover .txtBox h4 { color: #b60005;} */

/****** 詳細頁 - 相簿列表 ******/
#gallery .photoList { margin: 20px 0; }
#gallery .photoList .box { float: left; width: 19%; background-color: #000; margin: 10px 0.5%; overflow: hidden; }
#gallery .photoList .box img { display: block; max-width: 100%; height: auto; -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); transform: scale(1); -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out; }
#gallery .photoList .box:hover img { opacity: 0.6; -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); }
#gallery .photoList .box a .imgBox { position: relative; }
@media (max-width:1550px) {
  #header ul.nav-menu > li:nth-child(1),
  #header ul.nav-menu > li:nth-child(6) { width: 160px; }
  #header ul.nav-menu > li:nth-child(2),
  #header ul.nav-menu > li:nth-child(7) { width: 120px; }
  #header ul.nav-menu > li:nth-child(3),
  #header ul.nav-menu > li:nth-child(5) { width: 145px; }
}
@media (max-width:1500px) {
  #index #header.fixheader ul.nav-menu > li.logoLi { margin: 0px 25px; }
}
@media (max-width:1480px) {
  #gallery .photoList .box { width: 24%; margin: 6px 0.5%; }
  #header ul.nav-menu > li:nth-child(1),
  #header ul.nav-menu > li:nth-child(6) { width: 130px; }
  #header ul.nav-menu > li:nth-child(2),
  #header ul.nav-menu > li:nth-child(7) { width: 110px; }
  #header ul.nav-menu > li:nth-child(3),
  #header ul.nav-menu > li:nth-child(5) { width: 110px; }
  #index #header.fixheader nav ul.nav-menu > li > a { padding: 0 10px; }
}
@media (max-width:1270px) {
  #header ul.nav-menu > li:nth-child(1),
  #header ul.nav-menu > li:nth-child(6) { width: 120px; }
  #header ul.nav-menu > li:nth-child(2),
  #header ul.nav-menu > li:nth-child(7) { width: 100px; }
  #header ul.nav-menu > li:nth-child(3),
  #header ul.nav-menu > li:nth-child(5) { width: 110px; }
}
@media (max-width:1200px) {
  #event .photoList .picOver .mask { margin-top: -40px; margin-left: -40px; width: 80px; height: 80px; }
  #event .photoList .picOver .iconView { font-size: 0.92857em; }
}
@media (max-width:767px) {
  #event .photoList .box { width: 31.333333%; margin: 6px 1%; }
}
@media (max-width:480px) {
  #gallery .col-xs-6 { width: 100%; }
  #event .photoList .box { width: 48%; margin: 3px 1%; }
}
#galleryView { position: relative; background: #fff; padding: 30px; margin-bottom: 3%; }
#galleryView .tiBox { width: 100%; text-align: left; border-bottom: 1px solid #ccc; margin-top: 23px; }
#galleryView .date { position: absolute; right: 0; top: 0; font-style: italic; background: #b60005; display: inline-block; color: #fff; position: absolute; text-align: left; font-size: 0.9em; padding: 8px 14px; margin-bottom: 10px; font-family: 'New Times Roman', serif; }
#galleryView .shareTi { margin: 10px 0; color: #a8a8a8; }
#galleryView .shareTi .fb { display: inline-block; height: 32px; margin-left: 10px; color: #3b5998; text-align: center; border-radius: 40px; font-size: 1.6em; }
#galleryView .imgBox { width: 23%; display: block; border: 1px solid #efefef; position: relative; float: left; margin: 10px 1%; }
#galleryView .imgBox .iconView { position: absolute; width: 120px; height: 120px; font-size: 0.8em; border-radius: 120px; background: rgba(182, 0, 5, 0.9); color: #fff; top: 50%; left: 50%; line-height: 120px; margin-top: -60px; margin-left: -60px; font-family: 'New Times Roman', serif; transition: all .3s ease; -o-transition: all .3s ease; -moz-transition: all .3s ease; -webkit-transition: all .3s ease; opacity: 1; z-index: 10; text-align: center; opacity: 0 }
#galleryView .imgBox .iconView:after { content: ''; display: block; position: absolute; bottom: 0; left: 50%; width: 1px; height: 34px; background: #fff; text-align: center; }
#galleryView .imgBox:hover .iconView { transform: rotateY(360deg); opacity: 1 }
#galleryView > .tiBox > h4 { font-weight: normal; vertical-align: middle; color: #444; font-size: 1.6em; }
@media (max-width:991px) {
  #galleryView > .tiBox { }
  #galleryView > .tiBox .date { top: 5px; left: 5px; }
  #galleryView > .tiBox > h4 { font-size: 1.4285em; }
  #galleryView .editBox { padding: 30px 0px; }
}

/* =====================================
   客房介紹
===================================== */
#room .roomBg { background: url('../images/room_bg_big.gif') center center no-repeat; background-attachment: fixed; }
#room .roomBg .h2 { position: static; transform: translate(0, 0); -ms-transform: translate(0, 0); -moz-transform: translate(0, 0); -webkit-transform: translate(0, 0); margin: 0 0 35px; }
#room .bgWhite { background: url('../images/room_bg.jpg'); margin: 0 auto; padding: 0; }
#room .infoWrap { background: url('../images/room_bg_big.gif') top center no-repeat; background-size: cover; }
#room .bgWhite .infoTxt { width: 76%; margin: 3% auto; line-height: 2em; text-align: center; }
#room .priceLink { display: block; margin: 0 auto; height: 43px; background: url('../images/icon_price.png') 10px center no-repeat #fff; padding-left: 54px; width: 175px; line-height: 43px; }
#room .priceLink> span { width: 46px; background: url('../images/icon_aw_r.png') center center no-repeat #1b1b1b; margin-left: 30px; display: block; height: 43px; line-height: 43px; float: right }
#room .priceLink:hover > span { background: url('../images/icon_aw_r.png') center center no-repeat rgba(182, 0, 5, 0.9); }
#room .picWrap { margin: 50px auto; text-align: center; width: 100%; }
#room .picWrap .picBox { position: relative; display: inline-block; margin: 0 15%; vertical-align: text-top; }
#room .picWrap .picBox:after { position: absolute; content: ''; border-radius: 240px; width: 240px; height: 240px; border: 1px solid #fff; top: -7px; left: 0; z-index: 0; }
#room .picWrap .picBox:first-child { }
#room .picWrap .picBox:nth-child(2):after { right: 0; left: initial; }
#room .picWrap .picBox:nth-child(3) { margin-top: -50px; margin-bottom: -50px; }
#room .picWrap .picBox:nth-child(3):after,
#room .picWrap .picBox:nth-child(4):after { left: -8px; }
#room .picWrap .picBox:last-child:after { left: initial; right: 0; }
#room .picWrap .picBox .borderW { position: relative; width: 230px; height: 230px; line-height: 230px; border-radius: 230px; overflow: hidden; background: #fff; box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.2); z-index: 2; }
#room .picWrap .picBox .border { line-height: 230px; width: 230px; height: 230px; border-radius: 230px; background: #fff; overflow: hidden; }
#room .picWrap .picBox .borderW .more { position: absolute; width: 120px; height: 120px; border-radius: 120px; background: rgba(182, 0, 5, 0.9); color: #fff; top: 50%; left: 50%; line-height: 120px; margin-top: -60px; margin-left: -60px; font-family: 'New Times Roman', serif; font-size: 0.8em; opacity: 0; transition: all .3s ease; -o-transition: all .3s ease; -moz-transition: all .3s ease; -webkit-transition: all .3s ease; }
#room .picWrap .picBox .borderW .more:after { content: ''; display: block; position: absolute; bottom: 0; left: 50%; width: 1px; height: 34px; background: #fff; }
#room .picWrap .picBox:hover .borderW .more { transform: rotateY(360deg); opacity: 1 }
#room .picWrap .picBox .border img { width: 100%; line-height: 230px; vertical-align: bottom; }
#room .picWrap .picBox .txt { margin: 20px auto; font-size: 1.1em; }
@media (max-width:1199px) {
  #room .picWrap .picBox { margin: 10px 2%; vertical-align: baseline; }
  #header nav .container { width: 86%; }
  #header ul.nav-menu > li { width: 130px; }
}
@media (max-width:1159px) {
  #index #header.fixheader ul.nav-menu >li.logoLi { margin: 0 10px; }
  #header ul.nav-menu > li { width: 120px; }
  #header ul.nav-menu > li:nth-child(5) { width: 130px; }
}
@media (max-width:1059px) {
  #header ul.nav-menu > li:nth-child(1),
  #header ul.nav-menu > li:nth-child(6) { width: 100px; }
  #header ul.nav-menu > li:nth-child(2),
  #header ul.nav-menu > li:nth-child(7) { width: 90px; }
  #header ul.nav-menu > li:nth-child(3),
  #header ul.nav-menu > li:nth-child(5) { width: 130px; }
}
@media (max-width:991px) {
  #room .picWrap .picBox { width: 30%; margin: 0; }
  #room .picWrap .picBox:after { display: none; }
  #room .picWrap .picBox .borderW { width: 150px; height: 150px; line-height: 150px; margin: 0 auto; }
  #room .picWrap .picBox .border { width: 150px; line-height: 150px; height: 150px; }
  #room .picWrap .picBox .border img { max-width: 100%; width: 100%; height: 100%; }
  #room .picWrap .picBox:after { display: none; }
  #header ul.nav-menu > li:nth-child(1),
  #header ul.nav-menu > li:nth-child(2),
  #header ul.nav-menu > li:nth-child(3),
  #header ul.nav-menu > li:nth-child(4),
  #header ul.nav-menu > li:nth-child(5),
  #header ul.nav-menu > li:nth-child(6),
  #header ul.nav-menu > li:nth-child(7) { width: 100%; }
}
@media (max-width:680px) {
  #room .picWrap .picBox { width: 45%; margin: 0; }
  #room .picWrap .picBox .borderW { width: 130px; height: 130px; line-height: 130px; }
  #room .picWrap .picBox .border { width: 130px; height: 130px; line-height: 130px; }
}
#roomprice { background: url(../images/roomprice_bg.jpg) left top repeat; }
#roomprice .head { background: url(../images/room_head_bg.jpg) left top repeat; font-size: 18px; color: #fff; }
#roomprice .table { background: #fff; }
#roomprice .table td { vertical-align: middle; position: relative; text-align: center; }
#roomprice .table td:nth-of-type(1) { width: 25%; }
#roomprice .table td:nth-of-type(2) { width: 50%; font-size: 0; }
#roomprice .table td:nth-of-type(3) { width: 25%; }
#roomprice .table td .image { display: inline-block; overflow: hidden; }
#roomprice .table td .image img { margin: 0 auto; -webkit-transition: all 300ms; -moz-transition: all 300ms; -o-transition: all 300ms; transition: all 300ms; }
#roomprice .table td .box { width: 50%; display: inline-block; font-size: 18px; color: #fff; position: relative; vertical-align: middle; }
#roomprice .head td:nth-of-type(1):before,#roomprice .head td .box:before { content: ''; width: 2px; height: 16px; background: url(../images/room_head_border.jpg) center top repeat-y; position: absolute; top: 50%; right: -1px; transform: translate(0, -50%); -ms-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); }
#roomprice .body { border-bottom: 1px solid #eeeeee; }
#roomprice .body td:first-child { padding: 10px 0; }
#roomprice .body td .box { font-size: 16px; }
#roomprice .body td .box.red { color: #b60005; }
#roomprice .body td .box.brown { color: #222; }
#roomprice .body .view.btn { display: inline-block; position: relative; padding: 0 0 0 45px; -webkit-transition: all 300ms; -moz-transition: all 300ms; -o-transition: all 300ms; transition: all 300ms; }
#roomprice .body .view.btn:before { content: ''; width: 33px; height: 33px; background: url(../images/view_bg1.png) center center repeat; position: absolute; top: 50%; left: 0; transform: translate(0, -50%); -ms-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); border-radius: 50%; -webkit-transition: all 300ms; -moz-transition: all 300ms; -o-transition: all 300ms; transition: all 300ms; }
#roomprice .body .view.btn:after { content: ''; width: 17.5px; height: 17.5px; background: url(../images/view_icon.png) center center no-repeat; background-size: 100% auto; position: absolute; top: 50%; left: 7.75px; transform: translate(0, -50%); -ms-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); }

/*hover*/
#roomprice .body:hover { background: #f7f8f9; }
#roomprice .body:hover .view.btn { color: #b60005; }
#roomprice .body:hover .view.btn:before { background: #b60005; }
#roomprice .wrap { background: url(../images/roomprice_describe_bg.jpg) right center no-repeat #fff; border-top: 1px solid #eeeeee; border-bottom: 1px solid #eeeeee; padding: 35px; margin: 0 0 35px; }
#roomprice .wrap .title { background: url(../images/describe_icon.png) left center no-repeat; background-size: 21.5px 21.5px; padding: 0 0 0 31.5px; color: #b60005; font-size: 18px; margin: 0 0 25px; }
#roomprice .wrap .listbox { font-size: 0; }
#roomprice .wrap .list { width: calc(50% - 12.5px); display: inline-block; vertical-align: top; }
#roomprice .wrap .list:nth-of-type(odd) { margin-right: 12.5px; }
#roomprice .wrap .list:nth-of-type(even) { margin-left: 12.5px; }
#roomprice .wrap .list > li { font-size: 0; margin: 0 0 20px; }
#roomprice .wrap .list > li span { font-size: 16px; color: #666666; display: inline-block; vertical-align: top; }
#roomprice .wrap .list > li span.num { width: 22px; }
#roomprice .wrap .list > li span.text { width: calc(100% - 22px); }
@media screen and (max-width:991px) {
  #roomprice .wrap { padding: 25px; }
}
@media screen and (max-width:700px) {
  #roomprice .table .head td:before { content: ''; width: 2px; height: 16px; background: url(../images/room_head_border.jpg) center top repeat-y; position: absolute; top: 50%; right: -1px; transform: translate(0, -50%); -ms-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); }
  #roomprice .table .head td:last-child:before { display: none; }
  #roomprice .head td { padding: 8px 0; }
  #roomprice .head td .box:before { display: none; }
  #roomprice .table td .box { width: 100%; }
  #roomprice .table td:nth-of-type(1) { width: 40%; }
  #roomprice .table td:nth-of-type(2) { width: 50%; text-align: center; }
  #roomprice .table td:nth-of-type(3) { width: 10%; }
  #roomprice .body .view.btn { font-size: 0; }
  #roomprice .wrap .list { width: 100%; margin: 0 !important; }
  #roomprice .body .view.btn:before,
  #roomprice .body .view.btn:after { left: 50%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); }
  #roomprice .mb-none { display: none !important; }
}
@media screen and (max-width:480px) {
  #roomprice .wrap { padding: 25px 5px; }
}

/*room1*/
#room .sec1 { background: url(../images/room1_bg.jpg) center center no-repeat; background-size: cover; }
#room .sec1 .image { text-align: center; }
#room .sec1 .image img { max-width: 100%; height: auto; }
#room .h3.small { text-align: left; }
#room .h3.small span.cn { font-size: 18px; }
#room .h3.small span.en { font-size: 13px; }
#room .clearfix { font-size: 0; }
#room .sec2,
#room .sec3 { display: inline-block; width: calc(50% - 15px); vertical-align: top; margin-bottom: 45px; }
#room .sec2 { margin-right: 15px; }
#room .sec3 { margin-left: 15px; }
#room .sec2 .h3,
#room .sec3 .h3 { border-bottom: 1px solid #eeeeee; padding-bottom: 12px; }
#room .sec2 .h3 span.cn,
#room .sec3 .h3 span.cn { position: relative; padding: 0 0 0 37.5px; }
#room .sec2 .h3 span.cn:before,
#room .sec3 .h3 span.cn:before { content: ''; width: 27.5px; height: 27.5px; position: absolute; top: 50%; left: 0; transform: translate(0, -50%); -ms-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); }
#room .sec2 .h3 span.cn:before { background: url(../images/room1_icon.png) left center no-repeat; background-size: auto 27.5px; }
#room .sec3 .h3 span.cn:before { background: url(../images/room1_icon.png) right center no-repeat; background-size: auto 27.5px; }
#room .sec2 .list { font-size: 0; }
#room .sec2 .list li { position: relative; width: 50%; display: inline-block; color: #222; font-size: 16px; padding: 0 0 0 15px; margin: 0 0 25px; }
#room .sec2 .list li:before { content: ''; width: 5px; height: 5px; border-radius: 50%; position: absolute; background: #b60005; top: 50%; left: 0; transform: translate(0, -50%); -ms-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); }
#room .sec3 .image { text-align: center; }
#room .sec4 { padding: 55px 0 60px; border-top: 1px solid #eee; }
#room .sec4 .row { font-size: 0; margin: 0 -7.5px; }
#room .sec4 .box { display: inline-block; margin: 0 7.5px 15px; width: calc(100%/8 - 15px); position: relative; vertical-align: top; }
#room .sec4 .box:before { content: ''; top: 0; left: 0; width: 100%; height: 100%; background: rgba(182, 0, 5, 0.8); position: absolute; -webkit-transition: all 300ms; -moz-transition: all 300ms; -o-transition: all 300ms; transition: all 300ms; z-index: 1; opacity: 0; pointer-events: none; }
#room .sec4 .box:after { content: ''; width: 100%; height: 15px; background: url(../images/room_shadow.png) center top no-repeat; position: absolute; bottom: -15px; left: 0; z-index: -1; }
#room .sec4 .box .image { overflow: hidden; }
#room .sec4 .box .image img { transform: scale(1); -ms-transform: scale(1); -moz-transform: scale(1); -webkit-transform: scale(1); -webkit-transition: all 300ms; -moz-transition: all 300ms; -o-transition: all 300ms; transition: all 300ms; }
#room .sec4 .cover { position: absolute; top: 50%; left: 0; width: 100%; transform: translate(0, -50%) scale(1.2); -ms-transform: translate(0, -50%) scale(1.2); -moz-transform: translate(0, -50%) scale(1.2); -webkit-transform: translate(0, -50%) scale(1.2); text-align: center; z-index: 1; pointer-events: none; -webkit-transition: all 300ms; -moz-transition: all 300ms; -o-transition: all 300ms; transition: all 300ms; opacity: 0; }
#room .sec4 .cover > span { display: block; }
#room .sec4 .cover .icon { width: 21.5px; height: 21.5px; background: url(../images/room_zoom.png) center center no-repeat; background-size: 100% auto; margin: 0 auto 5px; }
#room .sec4 .cover .text { color: #fff; font-size: 12px; text-transform: uppercase; }

/*hover*/
#room .sec4 .box:hover:before { opacity: 1; }
#room .sec4 .box:hover .cover { opacity: 1; transform: translate(0, -50%) scale(1); -ms-transform: translate(0, -50%) scale(1); -moz-transform: translate(0, -50%) scale(1); -webkit-transform: translate(0, -50%) scale(1); }
#room .sec4 .box:hover .image img { transform: scale(1.1); -ms-transform: scale(1.1); -moz-transform: scale(1.1); -webkit-transform: scale(1.1); }
@media screen and (max-width:991px) {
  #room .sec4 .box { width: calc(100%/5 - 15px); }
}
@media screen and (max-width:680px) {
  #room .sec2,
  #room .sec3 { width: 100%; margin: 0 0 35px !important; }
  #room .sec2 { margin: 0 0 20px !important; }
  #room .sec4 { padding: 35px 0 60px; }
  #room .sec4 .box { width: calc(100%/4 - 15px); }
}
@media screen and (max-width:480px) {
  #room .sec2 .list li { width: 100%; }
  #room .sec4 .box { width: calc(100%/3 - 15px); }
}

/* =====================================
   會議宴會
===================================== */
#conference .h2 { position: static; transform: translate(0, 0); -ms-transform: translate(0, 0); -moz-transform: translate(0, 0); -webkit-transform: translate(0, 0); margin: 0 0 35px; }
#conference .text { color: #222222; font-size: 14px; text-align: center; line-height: 30px; margin: 0 auto 80px; max-width: 790px; }
#conference .list { font-size: 0; }
#conference .list > li { display: inline-block; width: 33.33333%; }
#conference .list > li > .icon { width: 135px; height: 135px; background: #b60005; border-radius: 50%; margin: 0 auto 15px; position: relative; -webkit-transition: all 300ms; -moz-transition: all 300ms; -o-transition: all 300ms; transition: all 300ms; }
#conference .list > li > .icon:before { content: ''; width: 85px; height: 85px; background-image: url(../images/conference_icon.png); background-repeat: no-repeat; background-size: auto 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -webkit-transition: all 300ms; -moz-transition: all 300ms; -o-transition: all 300ms; transition: all 300ms; }
#conference .list > li:nth-of-type(1) > .icon:before { background-position: 0 center; }
#conference .list > li:nth-of-type(2) > .icon:before { background-position: center center; }
#conference .list > li:nth-of-type(3) > .icon:before { background-position: right center; }

/*hover*/
#conference .list > li > .icon:hover { border: 5px solid #a51317; }
#conference .list > li > .icon:hover { -webkit-transform: rotate(-180deg); -moz-transform: rotate(-180deg); -o-transform: rotate(-180deg); transform: rotate(-180deg); }
#conference .list > li > .text { font-size: 20px; position: relative; }
#conference .list > li > .text:before { content: ''; width: 30px; height: 1px; background: #535353; position: absolute; bottom: -5px; left: 50%; transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); -moz-transform: translate(-50%, 0); -webkit-transform: translate(-50%, 0); }
#conference .download { background: url(../images/download_bg.jpg) left top repeat; padding: 115px 0 61.5px; }
#conference .download .row { margin: 0 -7.5px; font-size: 0; }
#conference .download .box { position: relative; display: inline-block; margin: 0 7.5px 53.5px; width: calc(33.3333% - 15px); }
#conference .download .box:before { content: ''; background: url(../images/download_bg.png) left top repeat; position: absolute; top: 0; left: 0; width: 100%; height: 100%; -webkit-transition: all 300ms; -moz-transition: all 300ms; -o-transition: all 300ms; transition: all 300ms; pointer-events: none; opacity: 1; }
#conference .download .box .image { display: block; }
#conference .download .box .text { position: absolute; top: 50%; left: 50%; display: inline-block; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); font-size: 22px; color: #fff; padding: 6px 0; width: 100%; }
#conference .download .box .text:before,
#conference .download .box .text:after { content: ''; width: 0; height: 1px; background: #fff; position: absolute; left: 50%; transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); -moz-transform: translate(-50%, 0); -webkit-transform: translate(-50%, 0); -webkit-transition: all 300ms; -moz-transition: all 300ms; -o-transition: all 300ms; transition: all 300ms; }
#conference .download .box .text:before { top: 0; }
#conference .download .box .text:after { bottom: 0; }
#conference .download .box .icon { width: 57px; height: 57px; background: rgba(182, 0, 5, 0.95); position: absolute; bottom: -28.5px; left: 50%; transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); -moz-transform: translate(-50%, 0); -webkit-transform: translate(-50%, 0); border-radius: 50%; opacity: 0; -webkit-transition: all 600ms; -moz-transition: all 600ms; -o-transition: all 600ms; transition: all 600ms; }
#conference .download .box .icon:before { content: ''; background: url(../images/download_icon.png) center center no-repeat; background-size: 100% auto; width: 25px; height: 23px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); }

/*hover*/
#conference .download .box:hover:before { opacity: 0; }
#conference .download .box:hover .text:before,
#conference .download .box:hover .text:after { width: 100px; }
#conference .download .box:hover .icon { opacity: 1; }
@media screen and (max-width:991px) {
  #conference .download { padding: 55px 0 1.5px; }
  #conference .download .box { width: calc(50% - 15px); }
  #conference .download .box .icon { opacity: 1; }
}
@media screen and (max-width:580px) {
  #conference .list { max-width: 400px; margin: 0 auto; }
  #conference .list > li { width: 50%; }
  #conference .text { margin: 0 auto 25px; }
}
@media screen and (max-width:480px) {
  #conference .list { margin: 0 0 25px; }
  #conference .list > li > .icon { width: 100px; height: 100px; }
  #conference .list > li > .icon:before { width: 65px; height: 65px; }
  #conference .download .row { margin: 0 auto; }
  #conference .download .box { width: 100%; margin: 0 auto 53.5px; }
  #conference .download .box .image > img { width: 100%; max-width: inherit; }
}

/* =====================================
   交通資訊
===================================== */
#transport { background: url(../images/transport_bg.jpg) left top repeat; }
#transport .h3 { position: relative; padding: 0 0 15px 26px; text-align: left; margin: 0 0 15px; border-bottom: 1px solid #eeeeee; }
#transport .h3:before { content: ''; background-image: url(../images/transport_h3.png); background-repeat: no-repeat; background-size: auto 18px; position: absolute; width: 18px; height: 18px; top: 6px; left: 0; }
#transport .h3 span.cn { font-size: 18px; }
#transport .left { width: 50%; float: left; padding: 15px 20px 0 0; }
#transport .right { width: 50%; float: left; padding: 50px 0 0 20px; }
#transport .right .map { border: none; width: 100%; height: 650px; margin: 0 0 35px; }
#transport .right .h3 { padding: 0 0 15px; border-bottom: 1px dashed #9fa0a0; }
#transport .right .h3:before { display: none; }
#transport .right .h3 > span.cn { color: #b60005; }
#transport .right .h3 > span.en { color: #9fa0a0; }
#transport .right .list > li { position: relative; padding: 0 0 0 26px; margin: 0 0 25px; }
#transport .right .list > li:before { content: ''; width: 18px; height: 18px; background-image: url(../images/info_icon.png); background-repeat: no-repeat; background-size: auto 100%; position: absolute; top: 50%; left: 0; transform: translate(0, -50%); -ms-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); }
#transport .right .list > li:nth-of-type(1):before { background-position: left center; }
#transport .right .list > li:nth-of-type(2):before { background-position: right center; }
#transport .sec-wrap { margin: 0 0 35px; }
#transport .sec1 .h3:before { background-position: left center; }
#transport .sec2 .h3:before { background-position: center center; }
#transport .sec3 .h3:before { background-position: right center; }
#transport .sec-wrap .box { margin: 0 0 30px; }
#transport .sec-wrap .title { color: #b60005; font-size: 14px; margin: 0 0 10px; }
#transport .sec-wrap .list { color: #999999; font-size: 14px; }
#transport .sec-wrap .list > li { position: relative; padding: 0 0 0 15px; line-height: 26px; }
#transport .sec-wrap .list > li:before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: #999; position: absolute; top: 50%; left: 0; transform: translate(0, -50%); -ms-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); }
#transport .sec3 { margin: 0 0 65px; }
#transport .sec3 .clearfix { margin: 0 0 15px; }
#transport .sec3 .image { float: left; margin: 0 10px 0 0; max-width: calc(50% - 5px); }
#transport .sec3 .image:last-child { margin: 0; }
#transport .sec3 .right { color: #999999; font-size: 14px; }
#transport .sec3 .right .text { padding: 50px 0; font-size: 14px; text-align: justify; }
#transport .sec3 .content { font-size: 14px; }
#transport .sec3 .content .title { color: #b60005; font-size: 16px; }
@media screen and (max-width:1199px) {
  #transport .sec3 .right .text { padding: 25px 0; }
  #transport .right .map { height: 600px; }
}
@media screen and (max-width:991px) {
  #transport .sec3 .left { float: none; width: 100%; padding: 15px 0 0; text-align: center; font-size: 0; }
  #transport .sec3 .right { float: none; width: 100%; padding: 0; }
  #transport .sec3 .right .text { padding: 0; }
  #transport .sec3 .image { display: inline-block; float: none; }
}
@media screen and (max-width:767px) {
  #transport .left { float: none; width: 100%; padding: 0; }
  #transport .left .image { text-align: center; }
  #transport .left .image > img { display: inline-block; }
  #transport .right { float: none; width: 100%; padding: 0; }
  #transport .sec2 { font-size: 0; margin: 0; }
  #transport .sec-wrap .box { width: 50%; display: inline-block; vertical-align: top; margin: 0 0 25px; }
  #transport .sec-wrap .box:nth-of-type(odd) { padding: 0 7.5px 0 0; }
  #transport .sec-wrap .box:nth-of-type(even) { padding: 0 0 0 7.5px; }
  #transport .right .map { height: 350px; }
}
@media screen and (max-width:480px) {
  #transport .sec-wrap .box { width: 100%; padding: 0 !important; margin: 0 0 15px; }
}

/* =====================================
   聯絡我們
===================================== */
#contact .h3 { text-align: left; margin: 0 0 25px; }
#contact .h3 span.cn { font-size: 18px; }
#contact .h3 span.en { font-size: 14px; }
#contact .left { width: 340px; float: right; padding-left: 45px; margin: 0 0 25px; }
#contact .right { width: calc(100% - 340px); float: left; margin: 0 0 25px; }
#contact .right .box { width: 50%; float: left; }
#contact .left .title { color: #222; font-size: 18px; margin: 0 0 15px; }
#contact .left .list { margin: 0 0 25px; }
#contact .left .list > li { position: relative; padding: 0 0 0 26px; margin: 0 0 15px; }
#contact .left .list > li:before { content: ''; width: 18px; height: 18px; background-image: url(../images/info_icon.png); background-repeat: no-repeat; background-size: auto 100%; position: absolute; top: 50%; left: 0; transform: translate(0, -50%); -ms-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); }
#contact .left .list > li:nth-of-type(1):before { background-position: left center; }
#contact .left .list > li:nth-of-type(2):before { background-position: right center; }
#contact .note { padding-left: 100px; margin: 0 0 15px; line-height: 26px; color: #777; }
#contact .form-name { width: 100px; float: left; height: 34px; line-height: 34px; padding-right: 15px; text-align: right; color: #222; }
#contact .form-content { width: calc(100% - 100px); float: left; }
#contact input { height: 34px; line-height: 34px; width: 100%; outline: none; padding: 0 5px; }
#contact input:focus,
#contact textarea:focus { border: 1px solid #b60005; }
#contact textarea { width: 100%; outline: none; }
#contact .map { height: 250px; width: 100%; border: none; }
#contact .code .box:nth-of-type(1) { width: calc(100% - 100px); float: left; padding: 0 15px 0 0; }
#contact .code .box:nth-of-type(2) { width: 100px; float: left; }
#contact .btn-wrap { text-align: center; margin: 0 0 35px 100px; font-size: 0; }
#contact .btn { -webkit-transition: all 300ms; -moz-transition: all 300ms; -o-transition: all 300ms; transition: all 300ms; font-size: 15px; }
#contact .cancel.btn { background: #666; color: #fff; width: calc(50% - 2.5px); margin-right: 2.5px; max-width: 150px; }
#contact .submit.btn { background: #b60005; width: calc(50% - 2.5px); margin-left: 2.5px; max-width: 150px; color: #fff; }
#contact .btn:hover { opacity: 0.8; }
@media screen and (max-width:1199px) {
  #contact .br { display: none; }
}
@media screen and (max-width:991px) {
  #contact .left { float: none; width: 100%; padding: 0; }
  #contact .left .list > li { display: inline-block; margin: 0 5px 0 0; }
  #contact .right { float: none; width: 100%; }
  #contact .note { padding: 0; }
  #contact .map { height: 150px; width: 100%; border: none; }
  #contact .form-name { padding: 0 0 0 15px; text-align: left; }
}
@media screen and (max-width:700px) {
  #contact .form-name { float: none; width: 100%; }
  #contact .form-content { float: none; width: 100%; }
  #contact .form-name { padding: 0; }
  #contact .right .box { float: none; width: 100%; }
  #contact .btn-wrap { margin: 0 0 35px; text-align: left; }
}

/* =====================================
   網站地圖
===================================== */
#sitemap .row { font-size: 0; margin: 0 -12.5px 25px; }
#sitemap .box { display: inline-block; width: calc(20% - 25px); margin: 0 12.5px 25px; vertical-align: top; }
#sitemap .box .title { font-size: 18px; color: #b60005; border-bottom: 2px solid #b60005; display: block; padding: 0 0 5px 25px; position: relative; }
#sitemap .box .title:before { content: ''; width: 35px; height: 35px; background-image: url(../images/sitemap_icon.png); background-repeat: no-repeat; background-size: auto 100%; position: absolute; right: 0; bottom: 0; }
#sitemap .box:nth-of-type(1) .title:before { background-position: 0 center; }
#sitemap .box:nth-of-type(2) .title:before { background-position: -35px center; }
#sitemap .box:nth-of-type(3) .title:before { background-position: -70px center; }
#sitemap .box:nth-of-type(4) .title:before { background-position: -105px center; }
#sitemap .box:nth-of-type(5) .title:before { background-position: -140px center; }
#sitemap .box .list > li { border-bottom: 1px solid #ccc; }
#sitemap .box .list > li > a { font-size: 15px; color: #999999; padding: 0 0 0 25px; line-height: 50px; display: block; }

/*hover*/
#sitemap .box .list > li:hover a { color: #222; }
@media screen and (max-width:1199px) {
  #sitemap .box { width: calc(25% - 25px); }
}
@media screen and (max-width:991px) {
  #sitemap .box { width: calc(33.3333% - 25px); }
}
@media screen and (max-width:700px) {
  #sitemap .box { width: calc(50% - 25px); }
}
@media screen and (max-width:480px) {
  #sitemap .row { margin: 0 auto 25px; }
  #sitemap .box { width: 100%; margin: 0 0 25px; }
}

/* 2020729 */
.btn-fb-float{ position: fixed; left: 0; top: 30vh; z-index: 999; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; }
.btn-fb-float.open{ left: 240px; }
.btn-fb-float .fb-icon{ position: fixed; left: 0px; top: 30vh; z-index: 99; width: 40px; background: #3b5998; text-align: center; cursor: pointer; color: #fff; font-size: 14px; padding: 20px 0; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; }
.btn-fb-float.open .fb-icon{ background: #444; left: 200px; height: auto;}
.btn-fb-float .fb-icon span{ width: 20px; display: block; margin: 0 auto; line-height: 1.1; writing-mode: vertical-lr; text-orientation: mixed;letter-spacing: 2px; }
.btn-fb-float .fb-icon span:after{ content: 'facebook'; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; }
.btn-fb-float.open .fb-icon span:after{ content: 'Close'; }
.btn-fb-float .fb-icon svg{ padding: 2px; width: 20px; height: 20px; border-radius: 20px; background: #fff; margin: 0 0 5px; }
.btn-fb-float .fb-icon svg path{ fill: #3b5998; }
.btn-fb-float.open .fb-icon svg path{ fill: #444; }
.btn-fb-float .fb-qrcode{ position: fixed; left: -200px; top: calc(30vh - 55px); width: 200px; height: 200px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);-webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; z-index: 0;}
.btn-fb-float.open .fb-qrcode{ left: 0px; }
.btn-fb-float .fb-qrcode img{ width: 100%; }
@media (max-width: 640px) {
.btn-fb-float.open{ left: 190px; }
.btn-fb-float .fb-icon{ width: 30px; font-size: 0.875rem; padding: 10px 0;}
.btn-fb-float.open .fb-icon{ left: 150px;  }
.btn-fb-float .fb-qrcode{ width: 150px; height: 150px; left: -150px; top: calc(30vh - 35px);}
}

/* 2020729 */
.btn-fb-float{ position: fixed; left: 0; top: 30vh; z-index: 999; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; }
.btn-fb-float.open{ left: 240px; }
.btn-fb-float .fb-icon{ position: fixed; left: 0px; top: 30vh; z-index: 99; width: 40px; background: #3b5998; text-align: center; cursor: pointer; color: #fff; font-size: 14px; padding: 20px 0; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; }
.btn-fb-float.open .fb-icon{ background: #444; left: 200px; height: auto  }
.btn-fb-float .fb-icon span{ width: 20px; display: block; margin: 0 auto; line-height: 1.1 }
.btn-fb-float .fb-icon span:after{ content: 'facebook'; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; }
.btn-fb-float.open .fb-icon span:after{ content: 'Close'; }
.btn-fb-float .fb-icon svg{ padding: 2px; width: 20px; height: 20px; border-radius: 20px; background: #fff; margin: 0 0 5px; }
.btn-fb-float .fb-icon svg path{ fill: #3b5998; }
.btn-fb-float.open .fb-icon svg path{ fill: #444; }
.btn-fb-float .fb-qrcode{ position: fixed; left: -200px; top: calc(30vh - 55px); width: 200px; height: 200px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);-webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; z-index: 0;}
.btn-fb-float.open .fb-qrcode{ left: 0px; }
.btn-fb-float .fb-qrcode img{ width: 100%; }
@media (max-width: 640px) {
.btn-fb-float.open{ left: 190px; }
.btn-fb-float .fb-icon{ width: 30px; font-size: 0.875rem; padding: 10px 0;}
.btn-fb-float.open .fb-icon{ left: 150px;  }
.btn-fb-float .fb-qrcode{ width: 150px; height: 150px; left: -150px; top: calc(30vh - 35px);}
}

.btn-tripadvisor-float{ position: fixed; left: -154px; top: calc(30vh + 145px); z-index: 999; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; }
.btn-tripadvisor-float.open{ left: -8px; }
.btn-tripadvisor-float .tripadvisor-icon{ position: fixed; left: 0px; top: calc(30vh + 145px); z-index: 99; width: 40px; background: #34E0A1;  text-align: center; cursor: pointer; color: #fff; padding: 10px 0; -webkit-transition: font-size 0.3s, left 0.3s; -o-transition: font-size 0.3s, left 0.3s; transition: font-size 0.3s, left 0.3s;  }
.btn-tripadvisor-float.open .tripadvisor-icon{ background: #000; left: 148px; }
.btn-tripadvisor-float .tripadvisor-icon span{ line-height: 1.1; writing-mode: vertical-lr; text-orientation: mixed;letter-spacing: 2px;  }
.btn-tripadvisor-float .tripadvisor-icon span:after{ content: '\f262'; font-family: 'FontAwesome'; font-weight: normal; font-style: normal; font-size: 2rem; }

.btn-tripadvisor-float.open .tripadvisor-icon span:after{ content: 'close'; font-size: 1.1rem; font-family: 'Noto Sans', sans-serif, "思源黑體", "Noto Sans T Chinese", "微軟正黑體", arial;}
.btn-tripadvisor-float .tripadvisor-qrcode{ position: fixed; left: -158px; top: calc(30vh + 135px); width: 146px; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; z-index: 0;}
.btn-tripadvisor-float.open .tripadvisor-qrcode{ left: -10px; }
@media (max-width: 640px) {
.btn-tripadvisor-float.open{ left: 190px; }
.btn-tripadvisor-float .tripadvisor-icon{ width: 30px; font-size: 0.875rem; top: calc(30vh + 114px); padding: 10px 0;}
.btn-tripadvisor-float.open .tripadvisor-icon{ left: 148px; }
.btn-tripadvisor-float .tripadvisor-icon span:after{ font-size: 1.5rem; }

.btn-tripadvisor-float .tripadvisor-qrcode{ width: 150px; height: 150px; left: -158px;top: calc(30vh + 104px); }
}



/* 為了避免 Bootstrap 設置的全局盒模型所帶來的影響，可以重置單個頁面元素或覆蓋整個區域的盒模型。 */
.reset-box-sizing,
.reset-box-sizing *,
.reset-box-sizing *:before,
.reset-box-sizing *:after { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; }