@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('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800&family=Noto+Sans+SC:wght@100;300;400;500;700;900&family=Noto+Sans+TC:wght@100;300;400;500;700;900&family=Noto+Sans:wght@400;700&family=Noto+Serif+SC:wght@200;300;400;500;600&family=Noto+Serif+TC:wght@200;300;400;500;600&family=Noto+Serif:wght@400;700&display=swap');
@font-face { font-family: "Trajan Pro 3"; src: url("/fonts/Trajan/trajan.eot"); src: url("/fonts/Trajan/trajan.eot?#iefix") format("embedded-opentype"), url("/fonts/Trajan/trajan.woff2") format("woff2"), url("/fonts/Trajan/trajan.woff") format("woff"), url("/fonts/Trajan/trajan.ttf") format("truetype"), url("/fonts/Trajan/trajan.svg#Trajan Pro 3") format("svg"); }
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

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

body { margin: 0; }
body ::selection { background: #55b8bb; 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: 'Poppins',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%; }

/* 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;  }

.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 .wrapper { position: relative; background: #fff; z-index: 2; }

/* workframe */
.workframe {position: relative;margin: 0 auto;width: min(90%,1366px);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:white;background-size:cover;padding: 15px 0;}
header .topconant{padding:13px 0;display:flex;justify-content:center;background:#2baacf}
header.headerfixed .topconant{padding:8px 0}
header.headerfixed .topconant a{font-size:25px;font-weight:600}
header .topconant .nowrap_box{width:1590px;display:flex;justify-content:flex-end}
header .topconant a{color:white;font-size:30px;font-weight:700}
header >.nowrap_box{margin:0 40px 0 auto;width:min(1740px,90%);max-width:100%}
header #cis img{width: 300px;object-fit:contain}
header #menubtn{position:fixed;width:25px;height:20px;display:inline-block;top:35px;right:30px}
header #menubtn span{position:absolute;width:100%;height: 1.5px;background: #000;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 >li >p a{padding: 0 25px;display:block;font-size:18px;color:#2f3436}
header #webmenu .menu_box >ul >li:hover >p a{color: #4eb9bc;}
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:50px 20px}
header #webmenu .contact_box font a{color: #4eb9bc;vertical-align:baseline}
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 #rightBox{position:relative;display:-webkit-box;display:-ms-flexbox;display:flex;padding: 15px 25px;background: #4eb9bc;border-radius: 50px;align-items: center;height: fit-content;}
header #rightBox:hover{background: #e79035;}
header #rightBox a{display:flex;flex-direction:column;align-items:center;height: fit-content;}
header #rightBox a:hover span,header #rightBox a:hover b{color:rgb(255 255 255 / 80%)}
header #rightBox span{color:white}
header #rightBox b{color:white;letter-spacing:0;font-size:14px;font-weight:400}
header #rightBox a p{line-height:100%;font-size:16px;letter-spacing:0;color:#ffffff;display: flex;align-items: center;gap: 5px;}
header #rightBox a:hover p,header #rightBox a:hover span{color: #ffffff;gap: 10px;}
header #rightBox .socialBox a{padding:10px}
header #rightBox .socialBox a img{width:20px;height:20px;transition:0.6s}

/* header_bar */
#header_bar { position: fixed; padding: 10px 20px; background: #fff; border-radius: 50px; box-shadow: 0 0 5px rgb(0 0 0 / .3); bottom: 20px; left: calc((100% - 260px) / 2); z-index: 999; }
#header_bar a { padding: 0 0 0 15px; }
#header_bar a >svg { width: 20px; height: 20px; fill: #2b2b2b; }
#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: #f3f3f3; text-align: center; opacity: 0; top: 0; left: 0; z-index: 999; }
#top_search svg { width: 25px; height: 25px; }
#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: 2px #494949 solid; display: inline-block; }
#top_search form input { padding: 5px 0; width: 480px; background: none; font-size: 20px; }
#top_search #goSearch { padding: 0 10px; }

/* footer */
footer {background: #f8f8f8;padding: 3vw 0 0;}
footer .workframe{display: grid;grid-template-columns: 1fr 60%;align-items: end;justify-content: space-between;padding-bottom: 15px;}
footer .foot_info{display:flex;flex-direction: column;}
footer .foot_info p,#extra li{display: grid;grid-template-columns: 27% 1fr;padding: 2px 0;}
footer .foot_info font,footer .foot_info font a,#extra font{font-size:16px;color: #121212;}
footer .foot_call{display:flex;flex-direction: column;align-items: flex-end;}
footer .foot_call article{text-align:right;font-size: 22px;font-weight: 500;}
footer .foot_call .phone_btn a {background: rgb(85 184 187);display: flex;align-items: center;padding: 15px 20px;color: #fff;font-size: 17px;gap: 10px;border-radius: 50px;letter-spacing: 1px;}
footer .foot_call .phone_btn a:hover{background: rgb(231 144 53);}
footer .foot_call .phone_btn {display: flex;flex-direction: row;width: fit-content;gap: 15px;margin-top: 15px;}
footer .copyright{grid-column: 1 / 3;display: flex;align-items: center;gap: 5px;border-top: 1px #d0d0d0 solid;padding-top: 20px;margin-top: 20px;}
footer #flogo {margin-left: 0;width: 300px;margin-bottom: 45px;}
footer #flogo .btns_box { margin-top: 20px; }
footer #flogo .btns_box a { margin: 0 10px 10px 0; padding: 10px 15px; background: #1e3998; 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, footer .copyright .text a { font-size: 13px; color: #9d9d9d; }

/* gotop */
#gotop a{width:50px;height:50px;border: 1px #c2c2c2 solid;background-color:white;border-radius:50%;display:flex;text-align:center;flex-direction:column;align-items:center;justify-content:center}
#gotop a p{color:#929292;font-weight:600}
#gotop a svg{margin:15px 0;width:20px;height:20px;fill:#c2c2c2}
.flyJ{position:fixed;right: 8px;bottom: 1%;z-index:1001;display:flex;flex-direction:column;align-items:center}
.flyJ div{margin-bottom:10px}
.flyJ a svg{display:flex;flex-direction:column;align-items:center;width: 27px;height: 27px;border-radius:50%;padding:10px;fill:white}
.flyJ #gotop svg{width:22px;margin:0 auto}
.flyJ #linee a svg{background: #00b900;}
.flyJ  #calll svg{background: #e6831e;}
.flyJ #fb a svg{background: #0866ff;}
.flyJ #linee a{border: 1px rgb(255 255 255 / 61%) solid;border-radius:50%}
.flyJ #calll a{border: 1px rgb(255 255 255 / 61%) solid;border-radius:50%}

/* webSeo */
#webSeo {position: relative;overflow: hidden;margin-top: 10px;padding: 10px 0;}
#webSeo .js-marquee-wrapper * , #webSeo .js-marquee * , #webSeo .seo * {font-size: 13px;color: #959595;-webkit-transition: none;-moz-transition: none;-ms-transition: none;-o-transition: none;transition: none;}
#webNotice{background:#55b8bb;color: #fff;text-align: center;padding: 10px 0;font-size: 14px;}
/* 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: 1500px){
	header >.nowrap_box,header .topconant .nowrap_box{width: 85%;}
	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.05); }
	header .row{width:300px;display:flex;flex-direction:column;justify-content:center}
	header #webmenu{margin:0 0 0 0px;width: calc(100% - 550px);display:flex;align-items:flex-end;margin-right: 60px;}
	header .leg{display:flex;justify-content: flex-start;align-items: center;}
	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{font-size: 18px;letter-spacing:1px}
	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 #rightBox .socialBox a:hover img{transform:translateY(-15%)}
	footer #extra ul li.plus-information:hover img { display: block; }
}
@media screen and (max-width:1470px){
	header #cis{width:330px}
	header #cis img{width: 260px;}
	header .topconant a{font-size:26px}
}
@media screen and (max-width: 1280px){
	header:before{width: 90px;}
	header >.nowrap_box,header .topconant .nowrap_box{margin: 0 auto;}
	header #rightBox{margin:0;display:none}
	header #cis{text-align:center;width: 100%;}
	header #webmenu{overflow:hidden;position:fixed;width:350px;background:#fff;top:0;right:-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)}
	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: 1024px){
	header #menubg[data-type="2"]{display:block}
	footer .workframe{grid-template-columns: repeat(1,1fr);}
	footer .foot_info{align-items: center;}
	footer .foot_call{align-items: center;margin-top: 50px;}
	footer .foot_call article{text-align:center;}
	footer .copyright{grid-column:unset;justify-content: center;margin-top: 60px;}
	footer .contact,#extra {width: 100%;}
	footer .foot_info p,#extra li{display: grid;grid-template-columns: 27% 1fr;padding: 2px 0;}
	footer .foot_info p,#extra li{grid-template-columns: 18% 20%;display: grid;justify-content: center;}
	footer .foot_call .phone_btn {flex-wrap: wrap;justify-content: center;}
}
@media screen and (max-width: 980px){
	footer #fnav a { padding: 0 10px; line-height: 45px; }
	footer #flogo { width: 250px; }
}
@media screen and (max-width: 768px){
	footer .foot_info p,#extra li{grid-template-columns: 18% 30%;}
	footer #fnav { display: none; }
	footer #footerinfo { padding-top: 30px; }
	#top_search form input { width: calc(70vw - 50px); }
}
@media screen and (max-width: 640px){
	footer .foot_info p,#extra li{grid-template-columns: 26% 34%;}
}
@media screen and (max-width: 480px){
	#gotop { bottom: 70px; }
	#gotop a { width: 40px; height: 40px; }
	#gotop a svg { margin: 13px 0; width: 15px; height: 15px; }
	.flyJ a svg{width: 22px;height: 22px;}
	footer .foot_info p,#extra li{grid-template-columns: 40% 60%;}
}
@media screen and (max-width: 400px){
	header #webmenu { width: 100%; }
	footer .foot_call .phone_btn a{font-size: 15px;}
}