@import url('/css/fontawesome-all.css');
@import url('/css/font-awesome.min.css');
@import url('/css/fontawesome.min.css');
@import url('/css/all.min.css');
@import url('/css/SeoJump.css');
@import url('/css/contentBuilder.css');
@import url('root.css');
@import url('https://fonts.googleapis.com/css2?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&family=Frank+Ruhl+Libre:wght@300;400;500;700;900&family=Quicksand:wght@300;400;500;600;700&display=swap');

*{margin:0;padding:0}
*:focus{outline:none}
body{margin:0}
body::selection{background:var(--primary);text-shadow:none;color:var(--white)}
body::-webkit-scrollbar{width:5px}
body::-webkit-scrollbar-track{background:rgba(var(--gray-rgb),.4)}
body::-webkit-scrollbar-thumb{background:#2f2f2f}
header,footer,div,nav,article,h2,h3,h4,h5,h6,hr,p,form,label,input,textarea,ul,li,img,svg,span,font,strong,b,a,i{text-align:left;vertical-align:middle;word-wrap:break-word;word-break:break-word;line-height:170%;border-width:0;font-family:var(--font-family),sans-serif;font-size:max(1 * (1vw + 1vh) / 2,16px);color:var(--info)}
ul,ol{list-style:none}
fieldset{border:0}
input,button,select,textarea{padding:7px 15px;width:calc(100% - 32px);border:1px solid #a3a3a3;border-radius:0;background:var(--white);box-shadow:none;outline:none;font-size:16px;color:var(--black);-webkit-appearance:none;-moz-appearance:none;appearance:none}
.aos-init{transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out}
.my-element{-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}
input,button,select,textarea{padding:5px 15px;width:calc(100% - 32px);border:0;border-radius:0;background:rgba(var(--gray-rgb),.2);box-shadow:none;outline:none;font-size:16px;color:var(--black);-webkit-appearance:none;-moz-appearance:none;appearance:none}
input#Checknum{margin-right:15px;width:70px;max-width:calc(100% - 97px)}
select{padding:10px 15px;width:100%}
input#Checknum{margin-right:15px;width:170px;max-width:calc(100% - 97px)}
/* img */
img{max-width:100%}
.img_cover{object-fit:cover}
.img_contain{object-fit:contain}
a,a:link,a:visited,a:hover{text-decoration:none;white-space:pre-wrap}
.txt_clamp{overflow:hidden;height:27px;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}
.d_inblock.txt_clamp{display:-webkit-inline-box}
.atag_item{width:100%;height:100%;top:0;left:0}
.nowrap_box{font-size:0}
.txt_num{font-family:'Quicksand',sans-serif}
.txt_num2{font-family:'Urbanist',sans-serif}
.svg_clip{width:0;height:0}
.flex_direction{flex-direction:column}
.f_justify_center{justify-content:center}
.f_aitems_center{align-items:center}

/* btn */
.btn,.btn_outline{padding:2px 10px}
.more_btn{color:#fff;background:var(--primary);border-radius:5px;font-size:15px;padding:15px 40px}
.more_btn:hover{background:#a27f56}

/* badge  */
.badge{padding:2px 10px;box-shadow:none}
.badge_lighten{padding:0 4px;min-width:22px;border-radius:3px;font-weight:400;text-align:center;font-size:12px;vertical-align:text-bottom}

/* photo,bgBox */
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}
.fancybox-infobar__body span{font-size:inherit;color:currentcolor;vertical-align:initial}

/* webBox */
.webBox{overflow:hidden;position:relative;width:100%}
.webBox .pageh1{position:absolute;top:0;z-index:1}
.webBox .wrapper{position:relative;background:#fff;z-index:2}
.webBox .slick-slider{margin-bottom:0}

/* workframe */
.workframe{position:relative;margin:0 auto;width:min(95%,1280px)}
#wrap footer .workframe{width:min(95%,1280px)}

/* header */
header{width:100%;z-index:999;background:rgb(255 255 255);top:0}
header .workframe{display:flex;align-items:center}
header #cis{z-index:1000}
header #webmenu{width:81%;display:flex;justify-content:flex-end}
header #menubtn{width:40px;z-index:1000}
.webBox header #menubtn[data-type="2"] a span:nth-child(1){transform:rotate(45deg);-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg)}
header #menubtn a{margin:auto 0 auto auto;width:25px;height:20px}
header #menubtn a span{position:absolute;width:100%;height:2px;display:block;top:0;right:0;background:#4b4b4b}
header #menubtn[data-type="1"] a 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="1"] a span:nth-child(2){top:calc(50% - .5px)}
header #menubtn[data-type="1"] a span:nth-child(3){top:calc(100% - 1px)}
header #menubtn[data-type="2"] a span{transition:.4s cubic-bezier(.645,.045,.355,1)}
header #menubtn[data-type="2"] a span:nth-child(1),header #menubtn[data-type="2"] a span:nth-child(3){top:50%}
.webBox header #menubtn[data-type="2"] a span:nth-child(3){transform:rotate(-45deg);-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg)}
header #menubtn[data-type="2"] a span:nth-child(2){opacity:0}
header #webmenu nav>ul>li>p{display:flex;align-items:center}
header #webmenu nav>ul>li>p a{padding:12px 5px;color:#ffffff;font-weight:300}
header #webmenu nav ul li b{position:absolute;right:10px;display:flex;align-items:center;justify-content:center}
header #webmenu nav ul li b i{color:#373737;font-size:12px}
header #webmenu nav ul li .bo b i{color:#626262}
header #webmenu nav>ul>li .subOption li>div a{padding:10px;display:block;font-size:15px}
header #header_bar{width:1%}
header #header_bar>a{padding:0 5px;line-height:90%;color:var(--white);display:inline-flex;align-items:center}
header #header_bar svg{width:17px;height:17px;fill:var(--white);margin-right:6px}
header #webmenu nav ul li .bo{display:flex;align-items:center}
header #webmenu nav ul li .bo svg{fill:#727272}
header.scroll{background:rgb(255 255 255)}

/* hSearch */
#hSearch{width:100%;height:0;top:64px;z-index:998}
#hSearch[data-type="2"]{height:142px}
#hSearch>div{margin:50px auto;width:700px}
#hSearch>div input{margin-right:15px;width:calc(100% - 89px);background:none;border-bottom:1px rgba(var(--black-rgb),.3) solid}
#hSearch>div a{border-radius:50%}
#hSearch>div a svg{margin:10px;width:22px;height:22px}


/* menubg */
#menubg{width:100vw;height:100vh;top:0;left:0}
#menubg[data-type="1"]{background:rgba(var(--black-rgb),0);z-index:-998}
#menubg[data-type="2"]{background:rgba(var(--black-rgb),.5);z-index:998}


/* parallax_box */
.parallax_bg{margin-bottom:3vw;min-height:600px;background:no-repeat 50% / cover}
.parallax_svg{height:93px;background-repeat:no-repeat;background-size:cover;left:0;z-index:2}
.parallax_svg.top{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 64' preserveAspectRatio='none'%3E%3Cpath d='M0 0v47.33c90-24.285 138.35-6.45 203.49 2.259 59.67 7.998 119.29-10.198 179.14-5.869 78.82 5.09 135.28 41.99 217.6 1.58C642.18 29.403 664 21.125 721.67 25.674c164.07 15.317 329.57-33.862 490.92-5.169C1289.4 32.143 1360.67 72.834 1440 47.38V0H0z' fill='#62a238");top:0}
.parallax_svg.bottom{background-image:url(/images/44/sbanner-bottom.png);bottom:0}

/* footer */
footer{position:relative;z-index:5;background-image:url(/images/44/mfoooter.png)}
footer *{font-weight:400;font-size:14px;color:#090909}
footer h5{font-weight:500;font-size:15px}
footer .parallax_svg.top{z-index:1;position:relative;background-size:cover;width:100%;height:100px}
footer .footer_box{padding:50px 0 0;background:unset}
footer .footer_box .workframe{display:flex;justify-content:space-between;align-items:flex-start}
footer #f_info font:first-child{min-width:50px}
footer #f_info font:last-child a{}
footer #extra{display:flex;flex-wrap:wrap;justify-content:flex-end}
footer #more_extra{padding:5px;background:none}
footer #more_extra svg{width:25px;height:25px;fill:var(--white)}
footer #extra ul{width:200px;bottom:0;left:0;z-index:10}
footer #extra ul li{padding:5px 15px}
footer #extra ul li font{line-height:140%}
footer #extra ul li font:first-child{font-size:15px;font-style:italic}
footer #extra ul li img{position:absolute;max-width:150px;top:100%;left:15px;z-index:8;max-height:150px;display:none}
footer .other_txt{font-size:13px}
footer #f_info{display:inline-flex;flex-wrap:wrap;justify-content:space-between;width:36%}
footer #f_info p{display:flex}
footer #f_other{width:28%;display:flex}
footer #f_other #footermeu{display:flex;flex-wrap:wrap}
footer #flogo{width:28%}
footer #copyright{text-align:center;color:#353535;padding:10px 0;display:flex;align-items:center;justify-content:center;font-size:12px;margin-top:26px}
footer #copyright p{display:flex}
footer #copyright a{color:#353535;margin-left:5px;font-size:12px}

/* webSeo */
#webSeo{padding:10px 0;white-space:nowrap;box-sizing:border-box}
#webSeo .seo{padding-left:100%;font-weight:100;font-size:13px;opacity:.3}

/* footer_btn */
#footer_btn{right:30px;bottom:15px;z-index:2000;display:flex;flex-direction:column;align-items:center}
#footer_btn a{margin-top:10px;line-height:40px}
#footer_btn a svg{margin:auto;width:20px;aspect-ratio:1/1}
#footer_btn a span{display:none}
#footer_btn a.line{background:#12b508}
#footer_btn a.gotop{background:var(--secondary);width:43px;height:43px}
#footer_btn a.gotop:before{margin:18px auto 0;width:25%;height:25%;border:var(--white) solid;border-width:2px 0 0 2px;display:block;content:""}

/* footer_btn */
#footer_btn a{position:relative;margin-top:10px;width:45px;height:45px;border-radius:50%;line-height:40px;background:#68ae3a}
#footer_btn a svg{margin:auto;width:60%;height:60%}
#footer_btn a.line{background:#12b508}
#footer_btn a.gotop{background:#FFC107;border:1px rgba(var(--white-rgb),.2) solid}
#footer_btn a.gotop:before{margin:18px auto 0;width:30%;height:30%;border:var(--white) solid;border-width:3px 0 0 3px;display:block;content:"";transform:rotate(45deg) translate(-1px,-1px);-webkit-transform:rotate(45deg) translate(-1px,-1px);-webkit-animation:gotop 1s linear infinite;animation:gotop 1s linear infinite}
@-webkit-keyframes gotop{0%,100%{-webkit-transform:rotate(45deg) translate(-1px,-1px)}
50%{-webkit-transform:rotate(45deg) translate(1px,1px)}
}@keyframes gotop{0%,100%{transform:rotate(45deg) translate(-1px,-1px)}
50%{transform:rotate(45deg) translate(1px,1px)}
}

/* other_area */
#other_area{background-image:url(/images/44/contact-bg.png);background-repeat:no-repeat;background-position:50% 0%;background-size:cover;padding:140px 0}
#other_area>div{display:flex;flex-direction:column;align-items:center}
#other_area h3{font-size:32px;color:var(--white);font-weight:400}
#other_area p{font-size:20px;margin:20px 0 40px;text-align:center;color:var(--white);font-weight:300}

@media screen and (min-width: 1441px) {
	header #cis {width: 13%;}
}

@media screen and (max-width: 1440px) {
	header #cis {width: 13.666667%;}
}

@media screen and (min-width: 1281px) {
	#menubg{display:none}
	header #webmenu nav ul li b.mo{display:none}
	header #webmenu nav>ul>li{position:relative;margin-left:0}
	header #webmenu nav ul li .bo{position:relative;background:var(--white);z-index:1}
	header #webmenu nav>ul>li>p a{padding:20px 12px;color:#333333;font-weight:400}
	header #webmenu nav>ul>li:hover>p a{color:#ae8d67}
	header #webmenu li .menu_body .subOption,header #webmenu li .subOption ul .subOption{position:absolute;width:200px;left:0;z-index:-1;opacity:0;border-top:5px solid #3CB8AE}
	header #webmenu li .menu_body ul{background:var(--white);box-shadow:0 0 10px rgba(var(--black-rgb),.15)}
	header #webmenu li .subOption li{overflow:hidden;border-bottom:1px rgba(var(--black-rgb),.1) solid}
	header #webmenu li .subOption li>div a{padding:6px 15px;line-height:150%;font-weight:300}
	header #webmenu li .subOption li:last-child>div a{border-color:none}
	header #webmenu li .subOption li>div a:hover{font-weight:600;color:#5c5c5c}
	header #webmenu li .subOption .sub2Option,header #webmenu li .subOption .sub3Option{left:200px;margin-top:-42px}
	header #webmenu nav>ul>li:hover,header #webmenu li .subOption li:hover{overflow:visible}
	header #webmenu nav>ul>li:hover .menu_body,header #webmenu li .subOption li:hover>ul{z-index:2;opacity:1}
	header #webmenu li:last-child .subOption .sub2Option,header #webmenu li:last-child .subOption .sub3Option{left:170px}
	#hSearch{top:90px}
	footer #extra ul li:hover img{display:block}
}

@media screen and (max-width: 1280px) {
	.workframe{width:90%}
	header .workframe{display:flex;align-items:center}
	header #webmenu nav ul li .bo b i{color:#fff}
	header #webmenu nav ul li b.pc{display:none}
	header{padding-top:10px;padding-bottom:10px}
	header #cis{width:20%}
	header #header_bar{width:79%}
	header #webmenu{padding:15px 0;width:350px;height:100vh;background:#68ae3a;box-shadow:0 10px 10px rgba(var(--black-rgb),.5);top:0;right:calc(-1 * var(--width-xs));z-index:999;top:67px;display:flex;flex-direction:column}
	header #webmenu nav{overflow-y:scroll;margin-top:5px;padding:0 30px;height:calc(100% - 65px)}
	header #webmenu nav::-webkit-scrollbar{width:0}
	header #webmenu nav>ul{padding-bottom:10vh}
	header #webmenu nav>ul>li{border-bottom:1px solid rgb(255 255 255 / 20%)}
	header #webmenu li .menu_body,header #webmenu li .menu_body .subOption li ul{position:relative;display:none;-webkit-transition:none;-moz-transition:none;-ms-transition:none;-o-transition:none;transition:none}
	header #webmenu li .menu_body .subOption li ul{border-top:1px solid rgb(255 255 255 / 20%);border-bottom:1px solid rgb(255 255 255 / 20%);margin-left:0;padding:5px 10px}
	header #webmenu li .menu_body .subOption li:last-child ul{border-bottom:0}
	header #webmenu li .menu_body{border-top:1px solid rgb(255 255 255 / 20%)}
	header #webmenu li .menu_body ul{margin-bottom:10px;margin-left:1.3em}
	header #webmenu li .menu_body .subOption .bo{position:relative}
	header #webmenu li .menu_body .subOption a{padding:5px 45px 5px 0;color:var(--white)}
	header #webmenu li .menu_body .sub2Option a{padding:5px 45px 5px 0;font-weight:300;color:rgb(250 250 250 / 75%)}
	header #webmenu li .menu_body .sub3Option a{padding-right:5px;color:var(--triadic2)}
}

@media screen and (min-width: 1025px) {
	footer * {vertical-align: top;font-weight: 500;}
}

@media screen and (max-width: 1024px) {
	header #webmenu {top: 59px;}

	footer #f_other {margin-top: 10px;}
}

@media screen and (max-width: 980px) {
	header #webmenu{top:0}
	header #cis{width:30%}
	header #header_bar{width:69%}
	.parallax_bg{min-height:400px}
	footer .footer_box .workframe{display:block}
	footer #flogo{width:100%;margin-bottom:20px}
	footer #flogo img{width:200px}
	footer #f_info,footer #f_other{width:100%}
	footer #f_info{justify-content:space-between;flex-wrap:wrap}
	footer #f_info ul{margin:5px 0;display:flex;flex-wrap:wrap;width:50%}
	footer #f_info ul h5{width:100%}
	footer #f_info ul li{margin-right:25px}
	footer #extra{justify-content:flex-start}
}

@media screen and (max-width: 760px) {
	footer #extra,
	footer #f_info {margin-top: 10px;}

	#hSearch>div {width: 90%;}
}

@media screen and (max-width: 640px) {
	footer #f_info {display: block;}
	footer #f_info ul{width:100%;border-bottom:1px solid rgb(255 255 255 / 20%);padding-bottom:10px;margin:10px 0}
	.parallax_svg{height:60px}
	header #webmenu{top:71px}
	header #cis{width:130px}
	header #cis img{width:260px}
	header #header_bar{width:67%}
	.parallax_bg{min-height:80vw;background-attachment:initial}
	#webSeo{margin-top:30px}
	#footer_btn{right:9px}
	#footer_btn a.line{}
	#footer_btn a.gotop{right:0;bottom:0}
	#other_area p{font-size:16px}
}

@media screen and (max-width: 550px) {
	header #webmenu{width:100%}
	footer .footer_box{padding:50px 0 0}
	footer #flogo img{width:250px}
	footer #f_other #footermeu a{width:33%}
	footer .parallax_svg.top{display:none}
	footer{margin-top:0;background-position:50%}
	#wrap footer .workframe{width:80%}
}

@media screen and (max-width: 350px) {
	header #header_bar svg {width: 20px;height: 20px;}

	header #menubtn {width: 25px;}

	header #menubtn a {width: 20px;height: 15px;}
}