@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/contentBuilder.css');
@import url('/css/35/root.css');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100;300;400;500;700;900&family=Noto+Sans+SC:wght@100;300;400;500;700;900&family=Source+Sans+Pro:wght@400;600&family=Oswald:wght@300;400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Alike&family=Arimo:ital,wght@0,400..700;1,400..700&family=Caladea:ital,wght@0,400;0,700;1,400;1,700&family=Tinos:ital,wght@0,400;0,700;1,400;1,700&display=swap');

* { margin: 0; padding: 0; }
*:focus { outline: none; }

body { margin: 0; }
body ::selection { background: var(--primary); text-shadow: none; color: #fff; }
body::-webkit-scrollbar { width: 5px; }
body::-webkit-scrollbar-track { background: #aaa; }
body::-webkit-scrollbar-thumb { background: var(--primary); }
body::-webkit-scrollbar-thumb:hover { background: #555557; }
body::-webkit-scrollbar-thumb:hover { background: #3c3c3c; }

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: var(--font-family), sans-serif;font-size: 16px;word-wrap: break-word;word-break: break-all;-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;}

: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 }

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 , a.text-clamp { overflow: hidden; height: 27px; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; }

/* 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 { -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: url(/images/35/Bg.jpg);z-index: 2;}

/* workframe */
.workframe {position: relative;margin: 0 auto;width: min(90%, 1500px);z-index: 1;}

/* Sitemap */
#Sitemap #jsonUL a { color: #000; }

/* header */
header {position: absolute;padding: 25px 6%;width: 88%;font-size: 0;top: 0;left: 0;z-index: 98;display: flex;align-items: center;}
header .row { width: 35px; display: inline-block; }
header #cis {width: calc(100% - 65px);}
header #cis img{height:55px;}
header #menuIcon {width: 35px;height: 35px;display: flex;text-align: right;align-items: center;flex-direction: column;justify-content: center;}
header #menuIcon font.line {margin: 0 0 10px auto;width: 100%;height: 1px;background: white;display: block;}
header #menuIcon font.txt {display: none;text-align: right;line-height: 120%;letter-spacing: 1px;font-family: 'Oswald', sans-serif;font-size: 13px;color: #151529;}
header #mbMenu {position: fixed;top: 0;right: -700px;z-index: 99;-webkit-filter: grayscale(1);}
header #mbMenu[data-type="2"] { right: 0; -webkit-transition-duration: .3s; -moz-transition-duration: .3s; -ms-transition-duration: .3st; -o-transition-duration: .3s; transition-duration: .3s; }
header #mbMenu #closeIcon { position: absolute; width: 30px; height: 30px; display: block; right: 30px; top: 20px; }
header #mbMenu #closeIcon:before , header #mbMenu #closeIcon:after { width: 30px; height: 1px; background: #a7a7a7; display: block; content: "";     -webkit-transform: translateY(8px) rotate(45deg); transform: translateY(13px) rotate(45deg); }
header #mbMenu #closeIcon:after { -webkit-transform: translateY(8px) rotate(-45deg); transform: translateY(12px) rotate(-45deg); }
header #mbMenu nav {overflow-y: scroll;padding: 85px 85px 100px;width: 500px;height: 100vh;background-image: url(/images/35/headernav.jpg);background-position: 50% 50%;background-size: cover;}
header #mbMenu nav::-webkit-scrollbar { width: 0; }
header #mbMenu nav:after { position: absolute; width: 100%; height: 90px; background: #151529; display: block; left: 0; bottom: 0; content: ""; }
header #mbMenu nav ul li a {padding: 20px 0;display: flex;color: #fff;align-items: center;justify-content: space-between;border-bottom: 1px solid rgb(255 255 255 / 20%);font-size: 15px;letter-spacing: 1px;}
header #mbMenu nav ul li:hover a{opacity:.65}
header #mbMenu nav ul li a font{font-family: "Tinos", serif;text-transform: uppercase;opacity: .75;font-size: 14px;letter-spacing: 0;}
header #mbMenu nav .btnBox { margin-bottom: 30px; }
header #mbMenu nav .btnBox a { margin-right: 20px; min-width: 16px; display: inline-block; color: #a3a0ca; }
header #mbMenu nav .btnBox a#translateLink { font-size: 15px; }
header #mbMenu nav .btnBox a i { vertical-align: unset; }
header #mbMenu #fixBox { position: fixed; text-align: center; bottom: 66px; right: 25px; }
header #mbMenu #fixBox a { margin-bottom: 15px; display: block; }
header.headerfixed {position: fixed;background-image: url(/images/35/header.jpg);}

/*header {position: absolute;top: 0;left: 0;z-index: 98;display: flex;align-items: center;padding: 25px 6%;width: 100%;box-sizing: border-box;}
header #cis {flex: 0 0 auto;width: auto;margin-right: 40px;}
header #cis img {height: 55px;display: block;}
header #bannernav {flex: 1 1 auto;position: static; }
header #bannernav ul {display: flex;align-items: center;gap: 32px;}
header #bannernav li {width: auto;border: 0;}
header #bannernav a {display: block;font-size: 15px;color: #fff;white-space: nowrap;}
header > div:has(#menuIcon) {flex: 0 0 auto;margin-left: auto;}
header #menuIcon {width: 35px;height: 35px;display: flex;flex-direction: column;justify-content: center;align-items: flex-end;}
header #bannernav {display: flex;justify-content: center; }
header #bannernav ul {flex: 0 0 auto;} */


/* bannernav */
#bannernav{position:absolute;top: 513px;right: 80px;width: 311px;transition:all linear .3s;}
#bannernav ul{display: flex;flex-wrap: wrap;justify-content: space-between;}
#bannernav li{border-bottom: 1px solid rgb(255 255 255 / 20%);width: 50%;}
#bannernav a{color:white;font-size: 13px;display:block;padding: 20px 0;display: inline-block;width: 100%;}
#bannernav a:hover{opacity:.75}
#bannernav li:nth-child(2n) a{text-align:end;}
header.headerfixed #bannernav{display:none;opacity:0}
#bannernav .banner-txt{font-size: 90px;font-family: "Tinos", serif;line-height: 1.3;margin-left: 1px;color: white;width: 460px;}


/* hSearch */
header form[name="hSearch"] { position: absolute; background: #292929; box-shadow: 0 0 10px rgba(21, 20, 41, .5); border: 1px #151427 solid; border-radius: 3px; right: 0; top: -100%; opacity: 0; z-index: 99; -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: #fff; }
header form[name="hSearch"]:before { position: absolute; width: 1px; height: 25px; background: #a2a2a2; display: inline-block; right: 59px; top: calc((100% - 25px) / 2); content: ""; }
header form[name="hSearch"] a { padding: 0 20px; display: inline-block; color: #a2a2a2; }
header form#hSearch { top: 70px; opacity: 1; }

/* footer */
footer {position: relative;background: url(/images/35/footerBg.jpg);padding: 70px 0;background-size: cover;background-position: 50% 50%;}
footer *{font-size:15px;color:#bababa}
footer .workframe{display:grid;grid-template-columns: 45% 55%;width: min(90%, 1440px);}
footer #pictureBox { padding: 30px 0; background: #eee; }
footer #pictureBox ul li a { margin: 0 10px; }
footer #contactBox .workframe , footer #infoBox .workframe { position: initial; font-size: 0; }
footer #contactBox .row { width: calc(100% - 200px); display: inline-block; vertical-align: top; font-size: 0; }
footer #contactBox #flogo { margin-left: 0; width: 190px; }
footer #contactBox #fcount .tit { margin: 0 0 10px 40px; padding-bottom: 10px; border-bottom: 1px #4d4d4d solid; }
footer #contactBox #fcount .tit b { position: relative; margin-right: 10px; display: inline-block; font-weight: 400; color: #fff; }
footer #contactBox #fcount .tit b:after { position: absolute; width: 100%; height: 2px; background: #d21a20; display: block; left: 0; bottom: -11px; content: ""; }
footer #contactBox #fcount .tit font { font-size: 13px; color: #daaba5; }
footer #contactBox #fcount ul {display: block;}
footer #contactBox ul li font {min-width: 60px;display: inline-block;}
footer #contactBox ul li font:first-child {text-align: justify;text-align-last: justify;}
footer #contactBox ul li font:last-child:before { margin: 0 10px; display: inline-block; font-size: 12px; color: #3f3f41; content: "/"; }
footer #contactBox ul li.plus-information b , footer #contactBox ul li.plus-information span { display: inline-block; vertical-align: middle; }
footer #contactBox ul li.plus-information a { position: relative; display: inline-block; }
footer #contactBox ul li.plus-information img { position: absolute; max-width: 150px; bottom: 100%; left: 0; z-index: 8; max-height: 150px; display: none; }
footer #infoBox {margin-top: 80px;align-items: center;}
footer .footercop{display:flex;gap: 5px;align-items: center;}
footer .footercop *{font-size:13px;color: #bababa;}
footer #infoBox .row { position: relative; width: 40%; display: inline-block; z-index: 1; }
footer #infoBox #fnav {position: relative;font-size: 0;z-index: 3;display: flex;gap: 15px 35px;align-items: center;flex-wrap: wrap;}
footer #infoBox #fnav a {display: inline-block;}
footer #infoBox #fnav a:last-child{background:var(--primary);color: white;padding: 9px 40px;}
footer #infoBox .row .footercop { margin-left: 30px; text-align: right; }
footer #infoBox .row .footercop >div { margin-left: 10px; display: inline-block; font-size: 13px; color: #121117; }
footer #infoBox .row .footercop .text { color: #8a80b9; }

/* gotop */
#gotop {position: fixed;bottom: 25px;right: 25px;z-index: 99;display: flex;flex-direction: column;gap: 10px;}
#gotop a {width: 50px;aspect-ratio: 1/1;border-radius: 50px;background: var(--primary);display: flex;text-align: center;color: #fff;align-items: center;justify-content: center;flex-direction: row;}
#gotop a:last-child svg{fill:white;transform:scaleY(-1);}
#gotop a.follow svg{fill:white;width: 20px;height: 20px;}
#gotop a.follow{display:flex;flex-direction: row;width: auto;position: relative;background: #38802b;align-items: center;}
#gotop a.follow.facebook{background:#2d4c82}
#gotop a.follow:hover span{opacity: 1;width: 85px;}
#gotop a.follow span{position: absolute;font-size: 13px;opacity: 0;width: 0;background: #2a8134;z-index: -1;right: 25px;height: 50px;line-height: 50px;border-radius: 50px 0 0 50px;padding-left: 20px;}

/* webSeo */
#webSeo { position: relative; overflow: hidden; }
#webSeo .js-marquee-wrapper * , #webSeo .js-marquee * , #webSeo .seo * { font-weight: 400; font-size: 13px; color: #929292; -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; }

@media screen and (max-width: 1680px){
	.workframe { width: 1300px; }
	footer #infoBox:before { width: calc((100% - 1300px) / 2); }
}
@media screen and (max-width: 1440px){
    #bannernav{position:absolute;top: 423px;right: 150px;width: 311px;transition:all linear .3s;}
    footer .workframe{grid-template-columns: 40% 60%;}
	
}
@media screen and (min-width: 1281px){
	footer #contactBox ul li.plus-information a:hover img { display: block; }
}
@media screen and (max-width: 1280px){
    #bannernav{display:none}
}
@media screen and (max-width: 980px){
    header #mbMenu nav{width: 360px;}
	footer #infoBox .workframe { width: 100%; }
	footer #infoBox:before , footer #infoBox #fnav:after , footer #infoBox #fnav:after { opacity: 0; }
	footer .workframe{grid-template-columns:1fr;gap: 20px;}
    footer #infoBox{margin-top: 20px;}
}
@media screen and (max-width: 640px){
    header #mbMenu{width:100%}
    header #mbMenu nav{width: 100%;box-sizing: border-box;-moz-box-sizing: border-box;-webkit-box-sizing: border-box;padding: 85px 45px 100px;}
    header #cis img{height:45px;}
    header #cis{width: calc(100% - 35px);}
    header{padding: 15px 5%;width: 90%;}
	footer #contactBox #fcount ul { margin: 10px 0; width: 100%; display: block; }
	footer #contactBox ul li font:last-child:before { margin: 0 5px; }
}