@import url('/css/fontawesome-all.css');
@import url('/css/font-awesome.min.css');
@import url('/css/fontawesome.min.css');
@import url('/css/SeoJump.css');

@import url('/css/all.min.css');
@import url('/css/contentBuilder.css');


@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400..900&family=Noto+Sans+TC:wght@100..900&display=swap');
* {margin: 0;padding: 0;box-sizing: border-box;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;}
*:focus { outline: none; }
body { margin: 0; }
body::selection { background: #339fc9; text-shadow: none; color: #fff; }
body::-webkit-scrollbar { width: 5px; }
body::-webkit-scrollbar-track { background: rgba(255,255,255,.75); }
body::-webkit-scrollbar-thumb { background: rgba(0,0,0,.4); border-radius: 50px; }
header,footer,div,nav,article,h2,h3,h4,h5,h6,hr,p,form,label,input,textarea,ul,li,img,span,font,strong,b,a,i { text-align: left; vertical-align: middle; margin: 0; padding: 0; line-height: 170%; border-width: 0; font-family: 'Cinzel','Noto Sans TC',sans-serif; font-size: 16px; word-wrap: break-word; word-break: break-word; text-align: justify; text-justify: inter-ideograph; -webkit-transition: all .3s ease-out; -moz-transition: all .3s ease-out; -ms-transition: all .3s ease-out; -o-transition: all .3s ease-out; transition: all .3s ease-out; }
:before,:after { -webkit-transition: all .3s ease-out; -moz-transition: all .3s ease-out; -ms-transition: all .3s ease-out; -o-transition: all .3s ease-out; transition: all .3s ease-out; }
ul,ol { list-style: none; }
fieldset { border: 0; }
input,button,select,textarea { border-radius: 0; box-shadow: none; outline: none; font-size: 16px; -webkit-appearance: none; -moz-appearance: none; appearance: none; }
select { background: url(/images/38/icon-triangle.png) no-repeat calc(100% - 10px) 50%; }
/* web_lines */
.pos_fix { position: fixed; }
#web_lines { width: 1245px; height: 100vh; border: #a4a4a438 solid; border-width: 0 1px; top: 0; left: calc((100% - 1245px)/2); pointer-events: none; z-index: 0; opacity: 0; }
#web_lines:before { position: absolute; width: 1px; height: 100%; background: #a4a4a438; display: block; top: 0; left: calc((100% - 1px)/2); content: ""; }
/* img */
img { max-width: 100%; }
.img_box_cover img { width: 100%; object-fit: cover; }
.img_box_contain img { width: 100%; object-fit: contain; }
.scale_box .img_box_cover { overflow: hidden; }
.scale_box .img_box_cover img { -webkit-transform: scale(1); transform: scale(1); }
a,a:link,a:visited,a:hover { display: inline-block; line-height: 100%; text-decoration: none; white-space: pre-wrap; color: #4b4551; }
.text-clamp,a.text-clamp { overflow: hidden; height: 27px; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; }
.nowrap_box { font-size: 0; }
/* a.photo */
a.photo,.bgBox { overflow: hidden; background: no-repeat 50%/cover; display: block; }
/* fancybox */
[class^="fancybox-"],[class^="fancybox-"] *,.slick-track,.fa,.fas,.fa:before,.fas:before,.fa:after,.fas:after,.trans_none_box { -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; }
/* slick-slider */
.wrapper .slick-slider { margin-bottom: 0; }
/* webBox */
.webBox { position: relative; overflow: hidden; width: 100%; }
.webBox .pageh1 { position: absolute; top: 0; z-index: 1; }
.webBox .wrapper {position: relative;background: #f8f7f0;z-index: 2;}
/*JJ4Jmagic*/
.JJ4Jmagic { display: flex; overflow: visible; width: 200px; height: 40px; margin: 30px auto 0; padding-bottom: 0; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; background-color: rgba(63,61,61,.25); background-image: linear-gradient(45deg,rgba(39,38,37,.03),rgba(244,239,236,.03)); box-shadow: 5px 5px 5px 0 rgba(244,239,236,.01); text-align: center; }
.svg-wrap-reservieren { position: absolute; width: 200px; height: 40px; background-color: transparent; color: #cdc6c0; }
svg { cursor: pointer; position: relative; margin: auto; width: 200px; height: 40px; }
.JJmore { display: flex; width: 100%; flex-direction: column; align-items: center; height: 100%; justify-content: center; background: #c43131; color: #efefef; }
.shape { position: absolute; }
svg .shape { transition: stroke-opacity 0.5s ease-out; }
@-webkit-keyframes draw {
  to { stroke-dashoffset: 0; }
}
.svg-wrap-reservieren .shape { stroke-width: 2px; cursor: pointer; }
.svg-wrap-reservieren .shape:hover { stroke-width: 3px; stroke-opacity: 1!important; }
@-webkit-keyframes draw {
  to { stroke-dashoffset: 0; }
}
/* workframe */
.workframe { position: relative; margin: 0 auto; width: 1440px; font-size: 0; z-index: 1; }
/* relat_box */
.relat_box,.relat_box >* { position: relative; }
.fixed_box { position: fixed; }
.abso_box { position: absolute; width: 100%; height: 100%; z-index: 4; }
.relat_box .abso_tag { position: absolute; width: 100%; height: 100%; z-index: 5; }
/* Sitemap */
#Sitemap #jsonUL a { display: block; font-size: 20px; font-weight: 400; color: #2d2d2e; }
#Sitemap #jsonUL a * { display: inline-block; line-height: 170%; font-size: 16px; vertical-align: top; }
/* header */
header {position: fixed;width: 100%;top: 0;left: 0;z-index: 999;background: #a9866f;background-size: cover;}
header >.nowrap_box { margin: 0 auto; width: 1590px; max-width: 100%; }
header #cis img { margin: 5px 15px; width: 360px; object-fit: contain; }
header #menubtn {position: fixed;width: 25px;height: 20px;display: inline-block;top: 19.5px;right: 20px;}
header #menubtn span {position: absolute;width: 100%;height: 2px;background: #ffffff;display: block;top: 0;right: 0;}
header #menubtn[data-type="1"] span:nth-child(2) { top: calc(50% - 1px); }
header #menubtn[data-type="1"] span:nth-child(3) { top: calc(100% - 1px); }
header #menubtn[data-type="1"] span { transition: transform .4s cubic-bezier(.215,.61,.355,1),opacity .4s cubic-bezier(.215,.61,.355,1),-webkit-transform .4s cubic-bezier(.215,.61,.355,1); }
header #menubtn[data-type="2"] span { background: #454545; transition: .4s cubic-bezier(.645,.045,.355,1); }
header #menubtn[data-type="2"] span:nth-child(1) { top: 50%; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
header #menubtn[data-type="2"] span:nth-child(2) { opacity: 0; }
header #menubtn[data-type="2"] span:nth-child(3) { top: 50%; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
header #webmenu .menu_box >ul {   }
header #webmenu .menu_box >ul >li >p a {padding: 17px 15px;display: block;font-size: 18px;color: #595959;}
header #webmenu .menu_box >ul >li .menu_body .subOption li { position: relative; overflow: hidden; }
header #webmenu .menu_box >ul >li .menu_body .subOption li >div a { padding: 15px; display: block; color: #252525; }
header #webmenu .contact_box {padding: 20px 20px;border-top: #cecece 1px solid;margin-top: 20px;}
header #webmenu .contact_box p { margin-top: 2px; }
header #webmenu .contact_box p a { color: #999; }
header #webmenu .contact_box .community { margin: 30px 0; padding-top: 30px; border-top: 1px #e0e0e0 solid; text-align: center; }
header #webmenu .contact_box .community a { margin: 0 15px; width: 40px; height: 40px; background: #f3f3f3; border-radius: 50%; display: inline-block; text-align: center; line-height: 38px; color: #999; }
header #menubg { position: fixed; width: 100vw; height: 100vh; background: rgb(0 0 0/.4); display: none; top: 0; left: 0; opacity: 998; }
header.headerfixed { border-bottom: 1px #ccc solid; }
header.headerfixed #menubtn span {background: #ffffff;}
/* header_bar */
#header_bar { display: none; }
#header_bar a { background: #ffffff; margin: 0 6px; border-radius: 50%; width: 50px; height: 50px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
#header_bar a[title="facebook"] svg { width: 25px; height: 25px; }
#header_bar a[title="line"] svg { width: 25px; height: 25px; }
#header_bar a >svg { width: 28px; height: 28px; fill: #a9866f; }
#header_bar a#openform { position: relative; margin-right: 5px; padding: 0 20px 0 0; }
#header_bar a#openform:after { position: absolute; width: 1px; height: 12px; background: #ccc; top: 50%; right: 0; transform: translateY(-50%); content: ""; }
/* top_search */
#top_search { overflow: hidden; position: fixed; width: 100%; height: 0; background: #b49d86; text-align: center; opacity: 0; top: 0; left: 0; z-index: 999; }
#top_search svg { width: 25px; height: 25px; fill: antiquewhite; }
#top_search #close_search { position: absolute; top: 30px; right: 30px; }
#top_search #close_search svg { width: 18px; height: 18px; }
#top_search form { padding: 0 20px 6px; border-bottom: 1px #ffffff75 solid; display: inline-block; }
#top_search form input { padding: 5px 0; width: 480px; background: none; font-size: 20px; color: #e5e5e5; }
#top_search::-webkit-input-placeholder { color: #e6e6e6; font-weight: 300; }
#top_search::placeholder { color: #e6e6e6; font-weight: 300; }
#top_search #goSearch { padding: 0 10px; }
/* footer */
footer {background: #a9866f;position: relative;padding-bottom: 50px;}
footer .workframe { display: flex; justify-content: center; flex-wrap: wrap; padding: 40px 0 0; align-items: center; }
footer #fnav { margin-bottom: 30px; border-bottom: 1px #e3ccc5 solid; display: none; }
footer #fnav .nowrap_box { text-align: center; }
footer #fnav a { padding: 15px 15px; display: inline-block; font-weight: 300; color: #f3f3f3; }
footer #extra ul { display: flex; flex-wrap: wrap; }
footer #extra ul li { margin: 0 5px; }
footer .row { margin-left: 15px; width: 66%; display: inline-block; vertical-align: top; }
footer .contact { display: flex; flex-wrap: wrap; }
footer .contact h2 { width: 100%; border-bottom: #f0f0f082 1px solid; font-size: 19px; text-transform: uppercase; margin-bottom: 10px; }
footer .contact p { width: 50%; display: flex; align-items: center; }
footer .row * { font-weight: 300; font-size: 15px; color: #fbfbfb; }
footer .copyright { display: flex; width: 100%; }
footer .row p,footer #extra ul li { position: relative; margin-bottom: 5px; }
footer .row font { display: flex; vertical-align: unset; align-items: center; }
footer .row font:first-child { margin-right: 15px; font-weight: 400; font-size: 13px; color: #efefef; font-size: 16px; }
footer #flogo { width: 29%; display: flex; flex-direction: column; align-items: flex-start; }
footer #flogo .logo_box { display: flex; }
footer #flogo img {width: 200px;}
footer #flogo .btns_box { margin-top: 20px; display: flex; margin-left: 8px; }
footer #flogo .btns_box a { margin: 0 10px 10px 0; padding: 10px 15px; background: #db3535; border-radius: 5px; display: inline-block; color: #fff; }
footer #flogo .btns_box a.line { background: #199a29; }
footer #extra ul li.plus-information img { position: absolute; max-width: 150px; bottom: 100%; left: 0; z-index: 8; max-height: 150px; display: none; }
footer .copyright >div {font-size: 13px;color: #ececec;display: flex;align-items: center;gap: 5px;}
footer .logo_box a { display: flex; flex-direction: column; align-items: center; }
footer .copyright >div p{width:auto;margin-bottom: 0;}
/* gotop */
#gotop { position: fixed; right: 20px; bottom: 20px; z-index: 1001; }
#gotop a {width: 50px;height: 50px;border: 2px #a9866f solid;border-radius: 50%;display: block;text-align: center;}
#gotop a svg {margin: 15px 0;width: 20px;height: 20px;fill: #a9866f;}
#gotop[data-type="2"] { bottom: 40px; }
#gotop[data-type="2"] a {border-color: #f8f7f0;}
#gotop[data-type="2"] a svg{fill: #f8f7f0;}
/* webSeo */
#webSeo { position: relative; overflow: hidden; margin-top: 40px; padding: 10px 0; display: none; }
#webSeo .js-marquee-wrapper *,#webSeo .js-marquee *,#webSeo .seo * { font-family: 'Noto Serif','Noto Serif TC','Noto Serif SC',serif; font-size: 13px; color: #efefef; -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; }
/* SeoStarRating */
#SeoStarRating font { margin-right: 5px; display: inline-block; vertical-align: bottom; }
#SeoStarRating font:first-child { line-height: 130%; font-weight: bold; font-size: 18px; color: #FF9800; }
#SeoStarRating font:nth-child(2) { font-size: 16px; color: #FF9800; }
#SeoStarRating font:last-child { color: #383838; }


/* 懸浮按鈕群組 (Floating Action Buttons) */
.fab-container { position: fixed; right: 30px; bottom: 30px; display: flex; flex-direction: column; gap: 15px; z-index: 9999; transform: translateY(65px); transition: transform 0.4s cubic-bezier(0.25,0.8,0.25,1); }
.fab-container.is-active { transform: translateY(0); }
.fab-container .fab-btn { width: 50px; height: 50px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; box-shadow: 0 10px 20px rgba(0,0,0,0.15); transition: all 0.3s cubic-bezier(0.25,0.8,0.25,1); text-decoration: none; border: 2px solid rgb(255 255 255/48%); outline: none; background: #38549d; }
.fab-container .fab-btn svg { fill: white; width: 20px; }
.fab-container .fab-btn.fab-top {background: #a9866f;}
.fab-container .fab-btn.fab-top svg {fill: #a9866f;stroke: white;}
.fab-container .fab-btn:hover { transform: scale(1.1) translateY(-3px); box-shadow: 0 15px 25px rgba(0,0,0,0.25); color: #fff; }
.fab-container .fab-phone {background-color: #3e3d41;border-color: #4f4f53;}
.fab-container .fab-line { background-color: #06C755; border-color: #06C755; }
.fab-top { background-color: #1a1a1a; border-color: rgba(255,255,255,0.2); opacity: 0; pointer-events: none; transition: opacity 0.4s ease,transform 0.3s ease; }
.fab-top:hover { background-color: #ff6600; border-color: #ff6600; }
.fab-container.is-active .fab-top { opacity: 1; pointer-events: auto; }



/* +footercall
*----------------------------------------------------------------------------*/@media screen and (min-width:1025px) {
  .phoneWrap { display: none !important; }
  footer #footerCompany .plus-information a:hover img { display: block }
}
@media screen and (max-width:1024px) {
  .phoneWrap { display: flex; position: fixed; bottom: 0px; left: 0px; width: 100%; z-index: 5; flex-direction: column; }
  .phoneWrap ul { display: flex; }
  .phoneWrap ul li {width: 50%;box-sizing: border-box;background-color: #685040;}
  .phoneWrap ul li.line { background: #c0a24c; }
  .phoneWrap ul li + li { border-left: 1px solid #fff; }
  .phoneWrap ul li a { display: inline-block; width: 100%; color: #fff; text-align: center; padding: 10px 0px; }
  #gotop { bottom: 45px; }
  #gotop[data-type="2"] { bottom: 48px; }
}
@media screen and (max-width:1024px) {
  header #menubg[data-type="2"] { display: block; }
}
@media screen and (max-width:1500px) {
  .workframe,header >.nowrap_box { width: 95%; }
  header #webmenu .menu_box >ul >li p a { padding: 0 10px; }
}
@media screen and (min-width:1281px) {
  .scale_box:hover .img_box_cover img { -webkit-transform: scale(1.05); transform: scale(1); }
  header {padding: 18px 0;border-top: #4c392a 4px solid;}
  header.headerfixed {padding: 10px 0;border-top: #e8d1c9 0px solid;}
  header .row { width: 300px; display: flex; flex-direction: column; order: 1; justify-content: center; }
  header #webmenu { margin: 0 0 0 0px; width: calc(100% - 600px); display: flex; order: 1; align-items: center; }
  header .leg { display: flex; justify-content: space-between; }
  #header_bar { display: flex; position: relative; left: 0; align-items: center; flex-wrap: wrap; order: 3; margin-right: 25px; }
  header #cis {width:330px;}
  header #cis a { text-align: left; color: #4b4551; margin-left: 0; }
  header #menubtn,header #webmenu .menu_box ul b,header #webmenu .contact_box { display: none; }
  header #webmenu .menu_box >ul >li {position: relative;overflow: hidden;display: inline-block;}
  header #webmenu .menu_box >ul >li >p a {color: #f8f7f0;font-size: 18px;font-weight: 300;letter-spacing: 0.05em;}
  header #webmenu .menu_box >ul >li >p a:hover{color:white;}
  header.headerfixed #webmenu .menu_box >ul >li >p a { color: #ffffff; }
  header #webmenu .menu_box >ul >li .menu_body,header #webmenu .menu_box >ul >li .subOption li ul { position: absolute; width: 170px; left: calc(50% - 85px); z-index: 1; opacity: 0; -webkit-transform: translateY(30px); transform: translateY(30px); }
  header #webmenu .menu_box >ul >li .subOption { background: #fff; box-shadow: 0 0 5px rgb(0 0 0/.2); }
  header #webmenu .menu_box >ul >li .subOption li ul { background: #f3f3f3; box-shadow: none; top: 0; left: 170px; -webkit-transform: translateY(0); -webkit-transform: translateX(30px); transform: translateY(0); transform: translateX(30px); }
  header #webmenu .menu_box >ul >li .subOption li ul.sub3Option { background: #dbdbdb; }
  header #webmenu .menu_box >ul >li:last-child .menu_body { left: auto; right: 0; }
  header #webmenu .menu_box >ul >li:last-child .subOption li ul { left: auto; right: 170px; }
  header #webmenu .menu_box >ul >li:hover,header #webmenu .menu_box >ul >li .subOption >li:hover,header #webmenu .menu_box >ul >li .sub2Option >li:hover { overflow: visible; }
  header #webmenu .menu_box >ul >li:hover .menu_body { padding-top: 1px; z-index: 10; opacity: 1; transform: translateY(0); }
  header #webmenu .menu_box >ul >li .subOption li:hover ul.sub2Option,header #webmenu .menu_box >ul >li .subOption li ul.sub2Option li:hover ul.sub3Option { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); }

  header #webmenu .menu_box >ul >li:last-child a{border: #ffffff 1px solid;padding: 20px 33px 17px 33px;border-radius: 5px;background: #594c41;}
  header #webmenu .menu_box >ul >li:last-child a:hover{background:#79573b;}
  header #webmenu .menu_box >ul >li:last-child p:before {content: "";position: absolute;width: 1px;height: 40px;background: #ffffff;left: 26px;top: -35px;}
  header #webmenu .menu_box >ul >li:last-child p:after {content: "";position: absolute;width: 1px;height: 40px;background: #ffffff;right: 26px;top: -35px;}
  header #webmenu .menu_box >ul >li:last-child a:before {content: "";position: absolute;width: 8px;height: 8px;background: #ffffff;border-radius: 50%;left: 23px;top: 5px;}
  header #webmenu .menu_box >ul >li:last-child a:after {content: "";position: absolute;width: 8px;height: 8px;background: #ffffff;border-radius: 50%;right: 22px;top: 5px;}
  header #webmenu .menu_box >ul >li:last-child{overflow:visible;margin-left: 30px;}
  
  footer #extra ul li.plus-information:hover img { display: block; }
}
@media screen and (max-width:1440px) {
  header #webmenu { margin: 0 0 0 0px; }
  header #cis { width: 330px; }
}
@media screen and (max-width:1280px) {
  header #cis img { margin-left: 0; }
  header #cis { text-align: center; width: 100%; }
  header #webmenu { overflow: hidden; position: fixed; width: 350px; background: #fff; top: 0; left: -400px; box-shadow: 0 0 10px rgb(0 0 0/.3); z-index: 999; }
  header #webmenu .menu_box {overflow-y: scroll;margin: 71px 15px 0;padding-top: 20px;height: calc(100vh - 91px);width: 100%;}
  header #webmenu .menu_box::-webkit-scrollbar { width: 0; }
  header #webmenu .menu_box >ul >li >p,header #webmenu .menu_box ul li .menu_body ul li .bo { position: relative; }
  header #webmenu .menu_box >ul >li b { position: absolute; width: 23px; display: inline-block; text-align: center; color: #252525; top: calc((100% - 27px)/2); right: 0; }
  header #webmenu .menu_box >ul >li >p a { padding: 12px 25px 12px 15px; display: block; font-weight: 300; font-size: 20px; }
  header #webmenu .menu_box ul li .menu_body,header #webmenu .menu_box ul li .menu_body >ul li .sub2Option,header #webmenu .menu_box ul li .menu_body >ul li .sub3Option { margin-bottom: 15px; display: none; -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; }
  header #webmenu .menu_box >ul >li .menu_body .subOption li >div a { padding: 10px 25px 10px 30px; color: #00a0ca; }
  header #webmenu .menu_box >ul >li .menu_body .subOption li .sub3Title a { padding: 5px 25px 5px 40px; color: #777; }
  header #webmenu .menu_box >ul >li .menu_body .sub3Option { margin: 0 40px; padding: 5px; background: #f3f3f3; }
  header #webmenu .menu_box >ul >li .menu_body .sub3Option li >div a { padding: 5px; font-size: 14px; color: #666; }
  header #webmenu .contact_box p font { margin-right: 15px; }
}
@media screen and (max-width:980px) {
  footer #fnav a { padding: 0 10px; line-height: 45px; }
  footer #flogo {width: 250px;order: 1;display: flex;flex-direction: column;align-items: center;margin-bottom: 20px;}
  footer .contact { order: 2; }
  footer #extra { order: 3; }
  footer #flogo .btns_box { display: none; }
  footer .row { margin: 10px 0 0; width: 100%; font-size: 0; display: flex; flex-direction: column; }
  footer .row.contact p,footer #extra ul li { margin: 2px 20px 2px 0; min-width: calc((100% - 20px)/2); display: inline-block; width: 100%; margin-bottom: 10px; }
  footer .row.contact p:nth-child(2n+1),footer #extra ul li:nth-child(2n) { margin-right: 0; }
  footer .row.contact p.address { width: 100%; }
  footer #extra ul { font-size: 0; }
  footer .copyright >div { margin-right: 5px; display: inline-block; }
}

@media screen and (max-width:768px){
  .fab-container { right: 20px; bottom: 20px; transform: translateY(55px); gap: 10px; }
  .fab-container.is-active { transform: translateY(0); }
  .fab-btn { width: 45px; height: 45px; }
}
@media screen and (max-width:640px) {
  .registrationbutton { display: flex; position: absolute; z-index: 9; right: 67px; top: 12px; }
  .registrationbutton a { padding: 8px 12px; background: #f8f7f0; border-radius: 120px; color: #97735b; font-size: 14px; }
  footer #fnav { display: none; }
  footer #footerinfo { padding-top: 30px; }
  #top_search form input { width: calc(70vw - 50px); }
  header #cis a { font-size: 13px; padding: 9px 0; width: 245px; }
  header #cis a span { display: none; }
  footer .copyright { display: flex; flex-direction: column; }
  footer .workframe { padding-top: 0; }
  
}
@media screen and (max-width:480px) {
  #gotop { bottom: 40px; }
  #gotop a { width: 40px; height: 40px; }
  #gotop a svg { margin: 13px 0; width: 15px; height: 15px; }
  header #cis img { width: 215px; margin-left: 20px; }
}
@media screen and (max-width:400px) {
  header #webmenu { width: 100%; }
}