@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('https://fonts.googleapis.com/css2?family=Hedvig+Letters+Sans&family=Noto+Sans+TC:wght@100;200;300;400;500;600;700;800;900&display=swap'); 

*{margin:0;padding:0}
*:focus{outline:none}
body{margin:0;-webkit-text-size-adjust:100%}
body::selection{background:#dedede;text-shadow:none}
body::-webkit-scrollbar{width:5px}
body::-webkit-scrollbar-track{background:#d0d0d0}
body::-webkit-scrollbar-thumb{background:#3c3c3c}
body::-webkit-scrollbar-thumb:hover{background:#222222}
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;font-weight:300;letter-spacing:.1em;line-height:170%;border-width:0;font-size:16px;word-wrap:break-word;word-break:break-all;font-family:'Noto Sans TC',sans-serif;-webkit-transition:all .5s ease-out;-moz-transition:all .5s ease-out;-ms-transition:all .5s ease-out;-o-transition:all .5s ease-out;transition:all .5s ease-out;color:#000000}
:before,:after{-webkit-transition:all .5s ease-out;-moz-transition:all .5s ease-out;-ms-transition:all .5s ease-out;-o-transition:all .5s ease-out;transition:all .5s ease-out}
ul,ol{list-style:none}
fieldset{border:0}
input,button,select,textarea{outline:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}
img{max-width:100%}
a:link,a:visited,a:hover{text-decoration:none;vertical-align:initial}
* html .clearfix{height:1%}
.clearfix{display:block}
livedemo00.template-help:after,:before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
.text-clamp{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical}
a.photo,.bgBox{overflow:hidden;background:no-repeat 50% / cover;display:block}
[class^="fancybox-"],[class^="fancybox-"] *,.slick-track,.fa,.fas,.fa:before,.fas:before,.fa:after,.fas:after{-webkit-transition:none;-moz-transition:none;-ms-transition:none;-o-transition:none;transition:none}
.webBox{position:relative;overflow:hidden;width:100%}
.webBox .pageh1{position:absolute;top:0;z-index:1}
.webBox .wrapper{position:relative;z-index:2}
.workframe{position:relative;margin:0 auto;width:1280px}
#Sitemap #jsonUL a{color:#6d6d6d}
.bgTxt{position:relative;z-index:1}
.bgTxt.title{width:100%;text-align:center;text-transform:uppercase;display:flex;flex-direction:column;align-items:center;font-size:26px;color:#ee3111;font-weight:400;letter-spacing:2px;margin:0}
.bgTxt.title .titleEn,.serviceArea .titleBox .titleEn{color:#bdad84;border-bottom:1px solid #bdad84;font-family:'Cormorant',serif;font-weight:500;line-height:140%;letter-spacing:0.5px;text-transform:uppercase;margin-bottom:10px;display:inline-block;text-align:center}
.bgTxt.title h1,.bgTxt.title h3{color:#bdad84;text-align:center;margin-top:-3px}
.bgTxt.title h3{color:#514f4a;font-size:24px;font-weight:500;letter-spacing:5px;padding:0;margin-top:30px}
p.more{padding:0;text-align:center}
p.more a{position:relative;overflow:hidden;padding:8px 20px;display:inline-block;align-items:center;border:1px rgb(189 173 132 / 20%) solid;letter-spacing:.06em;line-height:30px;transition:1.2s ease 1.8s;transform:translateY(0%)}
p.more a font{position:relative;display:inline-block;font-size:15px;color:#bdad84;z-index:2}
header{position:fixed;width:100%;font-size:0;top:0;left:0;background-color:#fff;z-index:999}
header .top-wrap{position:relative;max-width:100%;align-items:center;transition:all 0.5s;display:flex}
header #cis{display:inline-block;text-align:center;width:180px;margin-left:100px}
header #menuIcon{width:40%;display:inline-block;text-align:right;color:#bdad84;vertical-align:top}
header #menuIcon b{padding:10px 0;display:inline-block}
header #menuIcon font{position:relative;margin-right:10px;width:25px;height:25px;display:inline-block;text-align:center;line-height:23px;color:#555555;vertical-align:middle}
header #menuIcon span{position:absolute;width:20px;height:1px;background:#292826;display:block;top:5px;left:3px}
header #menuIcon span:nth-child(2){width:13px;top:12px;left:10px}
header #menuIcon span:nth-child(3){top:19px}
header #menuIcon[data-type="2"] span:nth-child(1){-webkit-transform:translate3d(0,7px,0) rotate(45deg);transform:translate3d(0,7px,0) rotate(45deg);transition-delay:0.1s}
header #menuIcon[data-type="2"] span:nth-child(2){width:0;height:0}
header #menuIcon[data-type="2"] span:nth-child(3){-webkit-transform:translate3d(0,-7px,0) rotate(-45deg);transform:translate3d(0,-7px,0) rotate(-45deg);transition-delay:0.1s}
header #mbMenu{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:0 15px 0 50px;margin:0 auto}
header #mbMenu .btnBox{text-align:right}
header #mbMenu .btnBox a{margin:0 10px;height:27px;display:inline-block;line-height:27px;color:#bdad84}
header #mbMenu nav>ul{position:relative;text-align:center;font-size:0}
header #mbMenu nav>ul>li{position:relative}
header #mbMenu nav>ul>li>p>a{color:#333231;display:block;font-size:16px;font-weight:400;padding:25px;letter-spacing:.5px}
header #mbMenu nav>ul>li:hover>p>a{color:#ee3111}
header #mbMenu nav>ul>li .menu_body ul{position:relative;font-size:0;text-align:center}
header #mbMenu nav>ul>li .menu_body .subOption li{position:relative;overflow:hidden;display:inline-block;border-bottom:0}
header #mbMenu nav>ul>li .menu_body .subOption li>div a{width:150px;color:#807c71;max-height:initial;overflow:hidden;-webkit-line-clamp:1;text-overflow:ellipsis;font-size:14px;display:block;letter-spacing:0.8px;padding:10px 15px}
header #rightBox{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;padding:0;margin-right:100px;align-items:center}
header #rightBox p{margin-left:10px}
header #rightBox p a{letter-spacing:0;font-family:'Hedvig Letters Sans',sans-serif;font-weight:bold;color:#494747;font-size:20px}
header #rightBox .socialBox a{background:#299f21;border-radius:50px;width:45px;height:45px;display:inline-flex;align-items:center;justify-content:center;margin-left:5px}
header #rightBox .socialBox a:first-child{background:#1e3f8b}
header #rightBox .socialBox a:last-child{background:#ee3111}
header #rightBox .socialBox a img{width:20px;height:20px;transition:0.6s;-webkit-filter:contrast(0) brightness(150%);filter:contrast(0) brightness(200%)}
header form[name="hSearch"]{position:absolute;border:1px solid #bdad84;box-shadow:0 0 10px #bdad84;background:#fff;right:245px;top:-100%;opacity:0;-webkit-transition-duration:.3s;-moz-transition-duration:.3s;-ms-transition-duration:.3st;-o-transition-duration:.3s;transition-duration:.3s}
header form[name="hSearch"] input{margin:5px 0;padding:5px 20px;background:transparent;color:#6d6d6d}
header form[name="hSearch"]:before{position:absolute;width:1px;height:25px;background:#bdad84;display:inline-block;right:59px;top:calc((100% - 25px) / 2);content:""}
header form[name="hSearch"] a{padding:0 20px;display:inline-block;color:#888}
header form#hSearch{top:53px;opacity:1}
header #linelink .member_other{position:absolute;width:130px;background:rgb(255 255 255 / 90%);opacity:0;right:-35px;-webkit-transform:translate(0%,80%);transform:translate(0%,80%);pointer-events:none;-webkit-box-shadow:0 0 10px rgb(0 0 0 / 10%);box-shadow:0 0 10px rgb(0 0 0 / 10%)}
header #linelink .member_other p{line-height:1}
header #linelink .member_other p a{display:block;line-height:1;color:#000;padding:15px 20px;text-align:center;border-bottom:1px solid #a7a7a733}
header #linelink[data-type="2"] .member_other{opacity:1;-webkit-transform:translate(0%,35%);transform:translate(0%,35%);-webkit-transition-delay:.2s;transition-delay:.2s;pointer-events:auto;right:-35px}
#linelink{display:inline-block}

footer{background:#2d2b29;padding:40px 0 0}
footer a{color:#f7f7f7}
footer .footercont .title h3.contact-txt{position:relative;width:155px;margin:0 auto}
footer .footercont .title h3:before,footer .footercont .title h3:after{position:absolute;top:16px;left:150px;right:150px;width:150px;height:1px;background:#bdad84;content:""}
footer .footercont .title h3:after{left:auto}
footer .footercont ul{display:inline-block;vertical-align:top;margin-left:75px;width:100%;display:flex;flex-wrap:wrap}
footer .footercont ul:last-child{margin-left:0px}
footer .footercont ul li{width:calc((100% / 2) - 10px);display:flex;flex-direction:row;align-items:center;margin-bottom:10px;flex-wrap:wrap}
footer .footercont ul li span{color:#fff;letter-spacing:0}
footer .footercont ul li i{color:#e4e0d8;font-size:18px;width:20px;text-align:center}
footer .footercont ul li font{margin-left:10px}
footer .footercont ul li.plus-information img{position:absolute;max-width:150px;bottom:100%;left:0;z-index:8;max-height:150px;display:none}
footer #footerInfo{padding:40px 0 50px;font-size:0;display:flex;width:1280px;margin:auto;justify-content:space-between}
footer #footerInfo .leftBox{width:200px;margin-right:10px}
footer #footerInfo .rightBox{width:calc(100% - 260px);display:flex;flex-direction:column}
footer #footerInfo .row{text-align:center;display:flex;margin-bottom:50px}
footer #footerInfo .row #flogo{text-align:center;margin-bottom:10px}
footer #footerInfo .row #flogo a{margin-bottom:10px;display:inline-block}
footer #footerInfo .row .foot{margin-right:10px;display:inline-block;font-size:15px;color:#fff}
footer #footerInfo .row .foot.text{color:#d4ccb7}
footer #footerInfo #sitefooter>div{text-align:center;width:calc(100% - 100px)}
footer #footerInfo #sitefooter>div a,footer .footercont ul li font{display:inline-block;color:#fffc;font-size:16px;font-weight:300;letter-spacing:0;font-family:'Hedvig Letters Sans',sans-serif}
footer #footerInfo #sitefooter #community{padding:0;width:150px}
footer #footerInfo #sitefooter #community .social{display:flex;justify-content:flex-end}
footer #footerInfo #sitefooter #community .social li a{padding:0 10px}
footer #footerInfo #sitefooter #community .social li a img{padding-top:3px;width:40px;height:40px;display:flex;justify-content:center;align-items:center}
footer #footerInfo #sitefooter #community a svg{width:60%;height:60%;fill:#fffc}
footer #copyright{display:flex}
footer #copyright .foot,footer #copyright .foot a{letter-spacing:0.5px;color:#807c71;font-size:13px;vertical-align:bottom;font-family:'Hedvig Letters Sans',sans-serif}
footer #copyright .text{margin-left:10px}

#footer_btn{position:fixed;bottom: 70px;right: 20px;z-index: 999;display: none;width: 100%;}
#footer_btn a{width: calc(100%/3);height: 40px;display: flex;align-items: center;justify-content: center;background: #ee3111;flex-direction: column;padding: 15px 0;}
#footer_btn a b{font-size:13px;color: #fff;}
#footer_btn a.facebook{background: #1e3f8b;}
#footer_btn a.line{background: #299f21;}
#footer_btn a svg{width: 17px;height: 17px;fill: #fff;}

.contactArea{background-color:#ee3111}
.contactArea .wrap{max-width:1280px;height:100px;display:flex;flex-wrap:wrap;align-items:center;align-content:center;justify-content:space-between;position:relative;background-image:none;padding-top:0;z-index:initial;margin:auto;padding:0}
.contactArea .titleBox .title{position:relative;display:flex;flex-direction:column;align-items:center;height:100%;margin-left:8px;font-size:30px;letter-spacing:0;color:#ffffff;font-family:'Hedvig Letters Sans',sans-serif}
.contactArea .rightBox{display:flex}
.contactArea .rightBox .item{padding:0;position:relative}
.contactArea .rightBox .item a{display:flex;align-items:center}
.contactArea .rightBox .item a:hover .iconBox circle{animation:progressCircleAnimation 4s infinite linear}
.contactArea .rightBox .item a:hover span{text-shadow:1px 1px 6px #ad9c6d}
.contactArea .rightBox .item .iconBox{display:inline-block;width:44px;height:44px;border-radius:50%;background:#302f33;position:relative;margin-right:18px}
.contactArea .rightBox .item .iconBox .path{display:block;width:44px;height:44px;fill:none;stroke-dashoffset:0;stroke-dasharray:153.86;stroke:#fff;stroke-width:1px;transform:rotate(-90deg);position:absolute;opacity:0}
.contactArea .rightBox .item .iconBox i{display:block;filter:brightness(0) invert(1);position:absolute;top:50%;left:50%;transform:translate3d(-50%,-50%,0);text-align:center;font-size:20px}
.contactArea .rightBox .item span{display:inline-block;font-size:26px;line-height:23px;letter-spacing:2px;color:#fff;font-weight:500;font-family:'Hedvig Letters Sans',sans-serif}
.contactArea .rightBox .item b{font-size:30px;line-height:23px;letter-spacing:1px;color:#fff;font-weight:300;margin-right:10px;opacity:0.6;font-family:'Hedvig Letters Sans',sans-serif}
#webSeo{position:relative;overflow:hidden;padding:10px 0;margin-top:10px}
#webSeo .js-marquee-wrapper *,#webSeo .js-marquee *,#webSeo .seo *{font-size:13px;color:#c6c6c6;-webkit-transition:none;-moz-transition:none;-ms-transition:none;-o-transition:none;transition:none}
.gotop{position:fixed;right:20px;bottom:20px;z-index:990;width:40px;height:41px;background:#9a9a9a;border-radius:50%;display:block;text-align:center;line-height:41px}
.gotop a{color:#fff;opacity:1;font-weight:500;font-size:13px;font-family:'Hedvig Letters Sans',sans-serif}
.gotop span{position:relative;margin:0 auto 10px;width:1px;height:20px;background:#000;display:none;animation:gotop 2s infinite alternate ease-in-out;-webkit-animation:gotop 2s infinite alternate ease-in-out}
.gotop span:before{position:absolute;border-left:4px solid transparent;border-bottom:7px solid #000;border-right:none;border-top:none;display:block;top:-5px;left:-3px;content:""}
#SeoStarRating font{margin-right:5px;display:inline-block;vertical-align:bottom}
#SeoStarRating font:first-child{font-size:14px;color:#bdad84}
#SeoStarRating font:nth-child(2){font-size:16px;color:#bdad84}
#SeoStarRating font:last-child{color:#6D6D6D;font-size:14px}

@media (max-width: 1540px) {
    .contactArea .wrap{padding:0 20px}
	header #cis{margin-left:30px;width:140px}
	header #rightBox{margin-right:30px}
}

@media (max-width: 1366px) {
    header #rightBox p{display:none}
}

@media screen and (min-width: 1281px) {
    header #webmenu li .menu_body .subOption li>div a:hover,header #linelink .member_other p a:hover{color:var(--white);background-color:#000}
	p.more a:hover{border-color:#bdad84}
	header #rightBox .socialBox a:hover img{transform:translateY(-15%)}
	p.more a:hover font{color:#fff}
	header #menuIcon{display:none}
	header #mbMenu nav>ul>li{overflow:hidden;display:inline-block}
	header #mbMenu nav>ul>li:hover,header #mbMenu nav>ul>li .menu_body .subOption>li:hover,header #mbMenu nav>ul>li .menu_body .sub2Option>li:hover{overflow:visible}
	header #mbMenu nav>ul>li .menu_body .subOption li>div p:hover{background:#bdad84}
	header #mbMenu nav>ul>li .menu_body .subOption li>div p:hover a{color:#fff}
	header #mbMenu nav ul li b{display:none}
	header #mbMenu nav>ul>li .menu_body,header #mbMenu nav>ul>li .menu_body .subOption li ul{position:absolute;left:calc(50% - 100px);background:#ffffff;z-index:1;opacity:0;transform:translateY(20px);transition:all .3s ease-out}
	header #mbMenu nav>ul>li:hover .menu_body{opacity:1;transform:translateY(0)}
	header #mbMenu nav>ul>li .menu_body .subOption li ul{top:0;left:200px;background:#bdad84;-webkit-transform:translateY(0);-webkit-transform:translateX(30px);transform:translateY(0);transform:translateX(30px)}
	header #mbMenu nav>ul>li:last-child .menu_body .subOption li ul{left:auto;right:200px}
	header #mbMenu nav>ul>li .menu_body .subOption li:hover ul.sub2Option,header #mbMenu nav>ul>li .menu_body .subOption li ul.sub2Option li:hover ul.sub3Option{opacity:1;transform:translateX(0)}
	footer #footerInfo #sitefooter #community a:hover{color:#bdad84}
	footer #footerInfo #sitefooter #community a:hover svg{fill:#bdad84}
}

@media screen and (max-width: 1280px) {
    header #linelink .member_other,header #linelink[data-type="2"] .member_other{right:-50%;width:120px;-webkit-transform:translate(0%,70%);transform:translate(0%,70%)}
	header #linelink .member_other p a{padding:13px 10px}
	.workframe,footer #footerInfo,.contactArea .wrap{width:90%}
	header .top-wrap{margin:15px 25px;display:flex;justify-content:space-between}
	header #rightBox{margin:0;display:none}
	header #cis{display:inline-block;text-align:left;margin-left:0;width:134px}
	header #mbMenu{overflow-y:scroll;position:fixed;top:70px;left:0;width:100%;height:0;margin-left:auto;padding:0;-webkit-transition-duration:.35s;transition-duration:.35s;background:rgb(72 72 72 / 98%);display:inline-block}
	header #mbMenu nav{margin-top:50px;padding-bottom:400px;margin:0 10px}
	header #mbMenu nav ul li{width:100%;text-align:center;border-bottom:1px rgb(255 255 255 / 25%) solid;display:block}
	header #mbMenu nav ul li:last-child{border-bottom:none}
	header #mbMenu nav>ul>li>p{position:relative}
	header #mbMenu nav>ul>li>p a{padding:20px 50px 20px 60px;font-size:15px;text-align:center;color:#fff}
	header #mbMenu nav>ul>li>p b,header #mbMenu nav>ul>li .menu_body .subOption li .bo b{position:absolute;padding:10px 10px;color:#c4c4c4;right:0;padding-left:calc(100% - 50px);width:35px;height:45px;display:inline-block;text-align:center;line-height:41px;top:calc((100% - 60px) / 2);left:0;cursor:pointer}
	header #mbMenu nav>ul>li .menu_body,header #mbMenu nav>ul>li .menu_body .sub2Option,header #mbMenu nav>ul>li .menu_body .sub3Option{display:none;-webkit-transition:none;-moz-transition:none;-ms-transition:none;-o-transition:none;transition:none}
	header #mbMenu nav>ul>li .menu_body .subOption{padding:20px 0 35px;background:rgb(217 217 217 / 10%)}
	header #mbMenu nav>ul>li .menu_body .subOption li .bo{position:relative}
	header #mbMenu nav>ul>li .menu_body .subOption li>div a{width:100%;border-bottom:0;color:#6e6e6e}
	header #mbMenu nav>ul>li .menu_body .subOption li>div p{padding:10px 30px}
	header #mbMenu nav>ul>li .menu_body .subOption li .sub3Title a{color:#bdad84}
	header #mbMenu nav>ul>li .menu_body .sub2Option,header #mbMenu nav>ul>li .menu_body .sub3Option{background:rgb(240 216 211 / 0.2);padding:25px 0}
	header #mbMenu nav>ul>li .menu_body .sub3Option li>div a{color:#d7a297}
	header #mbMenu nav>ul>li .menu_body .subOption li .bo b{padding:10px 40px}
	header #mbMenu[data-type="2"] nav{padding:30px;height:calc(100vh - 139px)}
	header form#hSearch{top:131px;right:235px}
	footer .footercont{width:90%}
	footer #footerInfo #sitefooter{margin-left:0;width:100%}
}

@media screen and (max-width: 1180px) {
    footer #footerInfo{display:flex;flex-direction:column;align-items:center;padding:20px 0 10px}
	footer #footerInfo .leftBox,footer #footerInfo .row{width:100%;margin:auto;text-align:center;display:flex;justify-content:center}
	footer #footerInfo .leftBox{margin-bottom:30px}
	footer #footerInfo .rightBox,footer #footerInfo #sitefooter{width:100%;display:flex;flex-direction:column;flex-wrap:wrap}
	footer #footerInfo #sitefooter #community{width:100%}
	footer #footerInfo #sitefooter>div{width:calc(100% - 70px);margin:auto}
	footer .footercont ul{display:flex;flex-direction:column;align-items:flex-start}
	footer .footercont ul li{width:100%}
	footer #footerInfo #sitefooter #community .social{display:flex;justify-content:center}
	footer #copyright{display:flex;align-items:center;justify-content:center;padding:10px 0}
	.contactArea .rightBox{width:100%;display:flex;justify-content:center;align-items:center}
	.contactArea .rightBox .item a{width:100%}
	.contactArea .wrap{padding:30px 0}
	.contactArea .titleBox{width:100%;text-align:center}
	p.more a font{font-size:11px}
}

@media screen and (max-width: 980px) {
    .bgTxt.stitle{position:relative;font-size:10vw;-webkit-writing-mode:inherit;writing-mode:inherit}
	.bgTxt.title .titleEn{margin-bottom:4px}
	header{padding:20px 4%;width:94%;background:#fff}
	header .top-wrap{margin:0}
	header.headerfixed #mbMenu{top:60px}
	header.headerfixed .top-wrap{margin:0}
	footer a{font-size:14px}
	footer .footercont:before,footer .footercont:after{background-size:75%;background-repeat:no-repeat;top:-60px;bottom:-120px;right:-130px}
	footer .footercont:after{top:auto;left:-42px}
	footer .footercont .title h3:before,footer .footercont .title h3:after{display:none}
	.gotop{bottom: 80px;}
	#footer_btn{bottom: 0;display: flex;right: 0;}
	
}

@media (max-width: 840px) {
    .contactArea .wrap{padding:20px 0 15px;height:auto}
	.contactArea .titleBox::before{width:16px;left:calc(50% - 8px);display:none}
	.contactArea .rightBox{width:100%;justify-content:center;flex-wrap:wrap}
	.contactArea .rightBox .item{padding:9px 0px}
	.contactArea .rightBox .item .iconBox{margin-right:15px;width:34px;height:34px}
	.contactArea .rightBox .item .iconBox i{font-size:15px}
	.contactArea .rightBox .item b,.contactArea .rightBox .item span{font-size:20px}
}

@media screen and (max-width: 640px) {
    footer #footerInfo #sitefooter>div{width:calc(100% - 40px);margin:auto}
	header #mbMenu .btnBox{text-align:center;padding:0}
	header form[name="hSearch"]{top:143px;right:-100%}
	header form#hSearch{top:143px;right:calc(35% / 2)}
	footer .footercont ul{padding:2vh 0 0;margin-left:17%}
	footer .footercont ul:last-child{padding:0 0 1vh}
	footer .footercont .title h3.contact-txt{font-size:12px;margin-top:-10px}
	footer #copyright{display:flex;flex-direction:column;align-items:center;margin-top:20px}
}

@media (max-width: 440px) {
    .contactArea .rightBox .item:nth-child(1)::before{display:none}
}
