@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('https://fonts.googleapis.com/css2?family=Marcellus&family=Noto+Sans+TC:wght@100..900&display=swap'); 
@import url('root.css'); 
/* main.less */
.webBox:before,.webBox:after,svg{transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}.aos-init{transition:all 0.5s ease-in-out;-webkit-transition:all 0.5s ease-in-out}.webBox header #menubtn[data-type="2"] a span:nth-child(1){transform:rotate(45deg);-webkit-transform:rotate(45deg)}.webBox header #menubtn[data-type="2"] a span:nth-child(3){transform:rotate(-45deg);-webkit-transform:rotate(-45deg)}@media (min-width:1281px){.webBox header #webmenu li .menu_body{transform:translate(0,30px);-webkit-transform:translate(0,30px)}.webBox header #webmenu li .menu_body .subOption li .sub2Option{transform:translate(-30px,0);-webkit-transform:translate(-30px,0)}.webBox header #webmenu li .menu_body .subOption li .sub2Option li .sub3Option{transform:translate(-30px,0);-webkit-transform:translate(-30px,0)}.webBox header #webmenu li .menu_body .subOption li .sub2Option li:hover .sub3Option{transform:translate(0,0);-webkit-transform:translate(0,0)}.webBox header #webmenu li .menu_body .subOption li:hover .sub2Option{transform:translate(0,0);-webkit-transform:translate(0,0)}.webBox header #webmenu li:hover .menu_body{transform:translate(0,0);-webkit-transform:translate(0,0)}.webBox header #webmenu li:last-child .menu_body .subOption li .sub2Option{transform:translate(30px,0);-webkit-transform:translate(30px,0)}.webBox header #webmenu li:last-child .menu_body .subOption li .sub2Option li .sub3Option{transform:translate(30px,0);-webkit-transform:translate(30px,0)}.webBox header #webmenu li:last-child .menu_body .subOption li .sub2Option li:hover .sub3Option{transform:translate(0,0);-webkit-transform:translate(0,0)}.webBox header #webmenu li:last-child .menu_body .subOption li:hover .sub2Option{transform:translate(0,0);-webkit-transform:translate(0,0)}}.webBox header #search_box #openform{width:45px;height:45px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center}.webBox header #search_box{display:flex;justify-content:flex-end;width:auto;margin-left:8px;align-items:center;display:none}.webBox header #search_box form{transform:translate(30px,0);-webkit-transform:translate(30px,0)}.webBox header #search_box[data-type="2"] form{transform:translate(0,0);-webkit-transform:translate(0,0)}.webBox .img_scale img{transform:scale(1);-webkit-transform:scale(1);transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out;}@media (min-width:1281px){.webBox .img_scale:hover img{transform:scale(1.1);-webkit-transform:scale(1.1)}}.webBox #SeoStarRating font{margin-right:5px;display:inline-block;line-height:110%;vertical-align:text-bottom;color:#ffc107}.webBox #SeoStarRating font *{color:#ffc107}.webBox #SeoStarRating font:first-child{font-weight:bold;font-size:18px}.webBox #SeoStarRating font:last-child{color:#cb0244}.webBox #webSeo .seo{-webkit-animation:marquee 200s linear infinite;animation:marquee 200s linear infinite}.webBox #footer_btn a{width:46px;height:46px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;background:#4062a6;}@media (max-width:550px){.webBox #footer_btn a{width:40px;height:40px;border-radius:50%;margin-bottom:10px}}


*{margin:0;padding:0}
*:focus{outline:none}
.webBox *{box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}
body{margin:0}
body::selection{background:#edeae5d1;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:0.5px;line-height:170%;border-width:0;font-family:"Marcellus","Noto Sans TC",sans-serif;font-size:16px;word-wrap:break-word;word-break:break-all;-webkit-transition:all .2s ease-out;-moz-transition:all .2s ease-out;-ms-transition:all .2s ease-out;-o-transition:all .2s ease-out;transition:all .2s ease-out;color: #3b3b3b;}
: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}
: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 */
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}

/* webBox */
.webBox{position:relative;overflow:hidden;width:100%}
.webBox .pageh1{position:absolute;top:0;z-index:1;color:#fff}
.webBox .wrapper{position:relative;background:#fff;z-index:2}

/* workframe */
.workframe {position: relative;margin: 0 auto;width: min(1440px,100%);}

/* Sitemap */
#Sitemap #jsonUL a {color: #6d6d6d;}

/* bgTxt */
.bgTxt{position:relative;z-index:1}
.footercont .bgTxt.title{display:inline-block;width:100%;letter-spacing:.05em;padding:0;color:#606060;font-size:14px;font-weight:400}
.bgTxt.title h1,.bgTxt.title h3{color:#54595f;margin-top:-3px}
.bgTxt.title h3{font-size:34px;font-weight:300}

/* more */
p.more{padding:10px 0;text-align:center}
p.more a{position:relative;overflow:hidden;padding:8px 50px;display:inline-block;align-items:center;border: 1px #527b85 solid;letter-spacing:.06em;line-height:30px;transition:1.2s ease 1.8s;transform:translateY(0%)}
p.more a:before{position:absolute;width:100%;height:100%;background: #4e7882;top:0;left:0;transform:translateY(110%);transition:.4s cubic-bezier(.23,1,.32,1);content:""}
p.more a font{position:relative;display:inline-block;font-size:13px;color: #517a84;padding-bottom:5px;z-index:2}
a.fmlink:hover{background-color: #378699;}
a.fmlink svg{fill:white;width:12px;height:auto;aspect-ratio:1/1;margin-bottom:2px}
.centermbut{display:flex;flex-direction:column;align-items:center}
a.fmlink{
    display:flex;
    height:auto;
    width:140px;
    margin-top:60px;
    padding:8px 20px;
    justify-content:center;
    color:white;
    font-size:max(1.15 * (1vw + 1vh) / 2,14px);
    background-color: #5a828c;
    border-radius:6666px;
    gap:10px;
    align-items:center;
    box-shadow: inset 0 -1em 3em rgb(45 78 87 / 53%), 0 0 0 0px white, 0.1em 0.1em 1em rgb(116 116 116 / 34%);
    }

/* header */
header,header a,a{transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out}
header #webmenu nav>ul>li>p a{color:#353535;font-weight: 400;}
header.headerfixed{background:#ffffff;top:0}
header.scroll #openform{background:var(--secondary)}
header{z-index:999;top:0;padding:20px 0;display:flex;justify-content:center;align-items:center}
header:before{content:"";position:absolute;width:100%;height:100%;padding:5px 0;border-radius:0}
header .menu{display:flex;align-items:center;margin:0 auto}
header .item{padding:0 0;width:min(1440px,100%)}
header #header_bar{width:233px}
header #header_bar a.con{background:#b01a26;padding:9px 30px;border-radius:50px;margin-left:20px;-webkit-transition:all 0.4s ease-out;-moz-transition:all 0.4s ease-out;-ms-transition:all 0.4s ease-out;-o-transition:all 0.4s ease-out;transition:all 0.4s ease-out;display:flex;align-items:center}
header #header_bar a.con:hover{background:#555}
header #header_bar a.con font{color:var(--white);font-size:max(1.2*(1vw + 1vh) / 2,16px);display:flex;align-items:center}
header #header_bar a.con font svg{fill:#ffffff;width:20px;aspect-ratio:1/1;margin-right:10px}
header .top_btn{width:96%;top:0;left:0}
header .top_btn svg{margin:10px;width:19px;height:19px;fill:#ffffff}
header #cis{z-index:5;display:flex;align-items:center}
header #cis *{transition:all 0s ease-in-out;-webkit-transition:all 0s ease-in-out}
header #cis img{width: min(330px,100%);}
header #webmenu{display:flex;justify-content:flex-end}
header #menubtn{height:70px;top:0;right:0;z-index:1000}
header #menubtn a{margin:auto 0 auto auto;width:30px;height:25px}
header #menubtn a span{position:absolute;width:100%;height:2px;background:var(--white);display:block;top:0;right:0}
header.scroll #menubtn a span{}
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%}
header #menubtn[data-type="2"] a span:nth-child(2){opacity:0}
header #webmenu nav>ul>li>p a{padding:10px 5px;font-size:max(1.15*(1vw + 1vh) / 2,15px)}
header #webmenu nav ul li b{position:absolute;padding:0 5px 0 15px;width:23px;height:41px;display:inline-block;text-align:center;line-height:41px;top:calc((100% - 41px) / 2);right:12px}
header #webmenu nav ul li b .fa{color:#121212}
header #webmenu nav>ul>li .subOption li>div a{padding:7px 10px;display:block}
header.scroll{background:#182c54;box-shadow:0 0 20px rgba(var(--black-rgb),.3)}
header.scroll:before{display:none}
header.scroll .item.menu{padding-top:0;border-bottom:0}
#wwbewm{display:flex;align-items:center;justify-content:flex-end;display:none}
#wwbewm a{padding:14px;background:#fffdfc;border-radius:50%;margin-left:8px}
#wwbewm svg{width:18px;height:18px;display:flex;fill:#8c755a}

/* hSearch */
header form[name="hSearch"]{position:absolute;border:1px solid #535353;box-shadow:0 0 10px #535353;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:#535353;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}

/* footer */
footer{position:relative;background:#4f828e;padding: 50px 0 0;}
footer a{color:#888888}
footer .threem_box{
    display: grid;
    grid-template-columns: 19% 27% 17% 31%;
    gap: 2%;
    width: min(1600px , 100%);
    margin: 0 auto;
    align-items: center;
    border-bottom: rgb(255 255 255 / 23%) 1px solid;
    padding: 0 70px;
    padding-bottom: 20px;
}
footer .threem_box #flogo img{width: min(280px , 100%);}
footer .mananatop{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    }
footer .threem_box #flogo a{display:flex;flex-direction: column;align-items: center;}
footer .threem_box .mafotitle{font-size: max(1.1 * (1vw + 1vh) / 2, 18px);font-weight: 500;margin-bottom: 10px;}
footer .threem_box *{color:white;font-size: max(0.8 * (1vw + 1vh) / 2, 14px);}
footer .moiinfo{display: flex;flex-direction: column;}
footer .threem_box .moticeJtext p{font-size: 11px;line-height: 1.8;}
footer .footercont{position:relative;width:100%;margin:0 auto;font-size:0;padding:0px 0px 30px 0px}
footer .footercont .title h3.contact-txt{position:relative;margin:0 auto;text-align:center}
footer .footercont .title h3.contact-txt a{color:#444444;font-size:48px;font-weight:600}
footer .footercont ul{vertical-align:top;text-align:center}
footer .footercont ul li{text-align:center;line-height:140%}
footer .footercont ul li i{color:#ffffff;font-size:18px;width:20px;text-align:center;display:none}
footer .footercont ul li font,footer .footercont ul li font a{color:#444444;font-size:26px;font-weight:300;line-height:160%}
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 .footercont ul li.title-line{display:block;width:300px;background:#48ae35;margin:0 auto;color:#fff;padding:10px 0;display:flex;justify-content:center;align-items:center;margin-top:20px}
footer .footercont ul li.title-line font a{font-size:24px;letter-spacing:0;font-weight:300;border-right:1px solid #fff;margin-right:20px;padding-right:20px;color:#fff}
footer .footercont ul li.title-line .search-icon img{width:30px}
footer .footercont ul li.footer-privacy{margin-top:30px}
footer #footerInfo{font-size:0;padding:60px 0px 0px 0px}
footer #footerInfo .row{width:100%;display:inline-block;text-align:center;margin-bottom:20px}
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:#ffffff}
footer #footerInfo .row .foot.text{color:#f0d8d3}
footer #footerInfo #sitefooter>div{text-align:center}
footer #footerInfo #sitefooter>div a{margin:0px 0 0px 14px;display:inline-block;color:#fffc;font-size:16px}
footer #footerInfo #sitefooter #community{padding:0}
footer #footerInfo #sitefooter #community a{width:80px;height:80px;text-align:center;background-color:#FFFFFF;border-radius:50% 50% 50% 50%;margin:0px 15px 0px 15px}

/* webSeo */
#webSeo{position:relative;overflow:hidden;margin-top:20px;padding:20px 0px 20px 0px;background-color:#000000}
#webSeo .js-marquee-wrapper *,#webSeo .js-marquee *,#webSeo .seo *{font-size:13px;color:#d0c1a7;-webkit-transition:none;-moz-transition:none;-ms-transition:none;-o-transition:none;transition:none}
/* webSeo2 */
#webSeo2{position:relative;overflow:hidden;margin-top: 0;padding: 20px 0;color: #ffffff;font-size:14px;font-weight:200;text-align:center}
#webSeo2 a{color: #ffffff;font-size:14px;font-weight:200;text-align:center;margin:0 10px}


/* gotop */
.gotop{position:fixed;bottom:20px;z-index:990;right: 20px;}
.gotop a{color:#ffffff;font-size:20px;display: flex;width: 50px;height: auto;aspect-ratio: 1/1;text-align:center;line-height:30px;background: rgb(90 130 140);border-radius:50%;box-shadow: 0 4px 8px rgb(42 65 71 / 43%);flex-direction: column;align-items: center;justify-content: center;}
.gotop a .fa{color: white;font-size: 26px;}
.flyicon{position:fixed;display: flex;flex-direction: column;align-items: center;bottom: 80px;right: 20px;gap: 9px;z-index: 999;}
.flyicon a{padding:5px;background: #5a828c;border-radius: 666px;width: 50px;aspect-ratio: 1/1;display: flex;flex-direction: column;align-items: center;justify-content: center;box-shadow: 0 4px 8px rgb(42 65 71 / 43%);}
.flyicon a .flyshowtext{position: absolute;width: 240px;right: -300px;display: flex;justify-content: flex-end;}
.flyicon a:hover .flyshowtext{right: 65px;}
/* SeoStarRating */
#SeoStarRating font{margin-right:5px;display:inline-block;vertical-align:bottom}
#SeoStarRating font:first-child{font-size:14px;color:#ff9800}
#SeoStarRating font:nth-child(2){font-size:16px;color:#ff9800}
#SeoStarRating font:last-child{color:#6D6D6D;font-size:14px}
#wpfm-floating-menu-nav{z-index:99999}
.wpfm-position-right.wpfm-menu-nav ul{position:fixed;top:50%;transform:translateY(-50%);-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);-o-transform:translateY(-50%);-moz-transform:translateY(-50%);width:60px;background:#ffffff;border-radius:80px;display:inline-block;box-shadow:0 0 0 2px #c8b086,0 0 0 5px #d0c1a7;padding:5px 5px 10px;right:30px;z-index:999;margin-top:40px}
.wpfm-position-right.wpfm-menu-nav ul li{position:relative;display:inline-block;width:100%;text-align:center;margin-bottom:10px}
.wpfm-position-right.wpfm-menu-nav ul li a{margin-bottom:9px;text-align:center;position:relative;line-height:1}
.wpfm-position-right.wpfm-menu-nav ul li a span{display:inline-block;text-align:center;max-width:80%}
.wpfm-position-right.wpfm-menu-nav ul li a span i{color:#c8b086}
.wpfm-position-right.wpfm-menu-nav ul li a span img{padding:3px 0 0;margin:auto}

/*call_box*/
#call_box{position:relative;}
#call_box:before{content:"";background: url(/images/42/leaf02.png);width: 28vw;position: absolute;aspect-ratio: 864/631;right: -2vw;top: -6vw;background-size: contain;background-repeat: no-repeat;}
#call_box .workframe{
    display: grid;
    grid-template-columns: 50% 47%;
    align-items: center;
    justify-content: space-between;
    padding: 0 0 50px;
    width: min(100%, 1300px);
    box-shadow: 0px 0px 12px 2px #cecece75;
    background-color: rgb(255 255 255 / 40%);
    border-radius: 20px 20px 50px 50px;
    padding: 70px 50px;
    margin: 30px auto 150px;
    }
#call_box .telltitle{font-size: max(2.8*(1vw + 1vh) / 2,25px);font-weight: 600;}
#call_box .pathJace{display:flex;gap: 4px;flex-direction: column;align-items: flex-start;margin-top: 20px;}
#call_box .pathJace span{width:100px;height:1px;display: flex;background: #181818;}
#call_box .call_left{
    display: flex;
    flex-direction: column;
}
#call_box .outJJlink{
    width: 100%;
    display: flex;
    justify-content: flex-end;
}
#call_box .call_left .outJJlink a{
    display: flex;
    align-items: center;
    gap: 10px;
    background-color: #5a828c;
    border-radius: 20px;
    gap: 10px;
    align-items: center;
    box-shadow: inset 0 -1em 3em rgb(45 78 87 / 53%), 0 0 0 0px white, 0.1em 0.1em 1em rgb(116 116 116 / 34%);
    width: min(340px , 100%);
    padding: 28px 15px;
    justify-content: center;
}
#call_box .call_left .outJJlink a:hover{background-color: #378699;}
#call_box .call_left .outJJlink a span{color:white;font-size: max(2*(1vw + 1vh) / 2,20px);}
#call_box .call_left .outJJlink svg{
    width: 16px;
    aspect-ratio: 1/1;
    fill: white;
}
@media screen and (max-width: 1680px) {
    header .hmrl-time-phone .hmrl-t {font-size: 28px;}
}

@media screen and (max-width: 1560px) {
    header .header-menu-right .hmr-link, header .header-menu-right .hmrl-time-phone {display: none;}
}

@media screen and (min-width: 1281px) {
    p.more a:hover{border-color:#dbd0bc}
p.more a:hover:before{transform:translateY(0)}
p.more a:hover font{color:#fff}
header .menu_box{display:flex;justify-content:flex-end}
header #webmenu nav ul li b{right: 0;}
header #webmenu nav ul li{position:relative;overflow:hidden;padding: 0 5px;}
header #webmenu nav ul li .bo{position:relative;background:var(--white);z-index:1}
header #webmenu nav>ul>li>p a{padding:13px 9px 10px;margin-left:0;display:flex;align-items:center}
header #webmenu nav>ul>li:last-child>p a{display:flex;height:auto;padding:8px 20px;justify-content:center;color:white;font-size:max(1.15 * (1vw + 1vh) / 2,14px);background:linear-gradient(0deg,#436e79 0%,#5a828c 100%);border-radius:6666px}
header #webmenu nav>ul>li:last-child{margin-left: 10px;}
header.scroll #webmenu nav>ul>li>p a:after{background:#7fb053}
header #webmenu nav>ul>li:last-child>p a:after{display:none}
header #webmenu nav>ul>li>p a:hover{color:var(--primary)}
header #webmenu nav>ul>li:last-child>p a:hover{color: white;}
header #webmenu nav>ul>li>p a:before{content:"";position:absolute;width:100%;height:3px;bottom:0px;left:0;background:var(--primary);-moz-transform-origin:center;-moz-transform:scaleX(0);-webkit-transform-origin:center;-webkit-transform:scaleX(0);-o-transform-origin:center;-o-transform:scaleX(0);-ms-transform-origin:center;-ms-transform:scaleX(0);transform-origin:center;transform:scaleX(0);transition:all 0.3s ease-in-out;-webkit-transition:all 0.3s ease-in-out}
header #webmenu nav>ul>li:last-child>p a:before{display: none;}
header.scroll #webmenu nav>ul>li>p a:before{background:#ffffff}
header #webmenu nav>ul>li>p a:hover:before{-moz-transform:scaleX(1);-webkit-transform:scaleX(1);-o-transform:scaleX(1);-ms-transform:scaleX(1);transform:scaleX(1)}
header .coouJJ a{padding:6px 30px;background:#b01a26;border-radius:500px}
header .coouJJ a:hover{background:#333333}
header .coouJJ *{color:#ffffff}
header #webmenu li .menu_body,header #webmenu li .subOption ul{position:absolute;width:170px;right:calc(50% - 85px);z-index:-1;opacity:0}
header #webmenu li .menu_body ul{background:var(--white);box-shadow:0 0 10px rgba(var(--black-rgb),.3)}
header #webmenu li .subOption li{overflow:hidden}
header #webmenu li .subOption li>div a{padding:6px 15px;border-bottom:1px rgba(var(--black-rgb),.1) solid;line-height:150%;font-weight:300;background:unset;border-radius:unset;color:#222222}
header #webmenu li .subOption li:last-child>div a{border-color:none}
header #webmenu li .subOption li>div a:hover{color:var(--primary)}
header #webmenu li .subOption .sub2Option,header #webmenu li .subOption .sub3Option{top:0;right:-170px}
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{right:auto;left:-170px}
header.scroll .top_btn{top:-55px;opacity:0}

}

@media screen and (max-width: 1470px) {
    header{padding:0 0;top:0}
header .item{padding:0;width:min(1160px,90%)}
footer #f_nav a{margin:6px 6px}
.workframe,footer #f_info .workframe{width:min(1120px,90%)}
footer #f_info{padding-top:40px}
header #webmenu nav>ul>li>p a{padding:20px 17px}
header:before{border-radius:0}
header.scroll #webmenu nav>ul>li>p a:after{display:none}
header #webmenu nav>ul>li>p a:after{right:0px}
#call_box .workframe{margin-bottom:70px;width: min(90%, 1024px);}
}

@media screen and (max-width: 1280px) {
    .workframe{width:90%}
header .item{padding:0 3%}
header #webmenu nav ul li b{width:100%;display:flex;justify-content:flex-end;align-items:center;z-index:5}
header #menubtn a span{background: #5a828c;}
header .menu{align-items:center;display:flex;justify-content:space-between}
header.scroll #menubtn[data-type="2"] a span{background:#ffffff}
header #webmenu{padding:15px 0;width:350px;height:100vh;background:#ffffff;box-shadow:0 10px 10px rgba(var(--black-rgb),.5);left:calc(-1 * var(--width-xs));z-index:999;display:flex;justify-content:unset;flex-direction:column;align-items:center;top:0;position:fixed;transition:all 1200ms cubic-bezier(1.000,0.095,0.170,0.975);transition-timing-function:cubic-bezier(1.000,0.095,0.170,0.975)}
header #webmenu .top_btn a{margin:0 5px}
header #webmenu nav{overflow-y:scroll;margin-top:60px;padding:0 10px;height:calc(100% - 65px);display:flex;width:100%;flex-direction:column}
header #webmenu nav::-webkit-scrollbar{width:0}
header #webmenu nav>ul{padding-bottom:200px;width:100%}
header #webmenu nav>ul>li>p a,.coouJJ a{color:#121212;padding:14px 25px;border-bottom:rgb(147 147 147 / 26%) 1px solid}
header #webmenu nav>ul *{transition:all 0.3s ease-in-out;-webkit-transition:all 0s ease-in-out}
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 ul{margin-left:20px}
header #webmenu li .menu_body .subOption .bo{position:relative}
header #webmenu li .menu_body .subOption a{padding:7px 45px 7px 10px;color:#616161}
header #webmenu li .menu_body .sub2Option a{font-weight:300;color:rgba(var(--white-rgb),.5)}
header #webmenu li .menu_body .sub3Option a{color:rgba(var(--triadic1-rgb),.8)}
footer .footercont{width:90%;padding-top:1vh}
footer #footerInfo #sitefooter{margin-left:0;width:100%;margin-bottom:10px}
footer .footercont .title h3.contact-txt a{font-size:30px}
footer .footercont ul li font,footer .footercont ul li font a,footer .footercont ul li.title-line font a{font-size:18px}
footer #footerInfo{padding:30px 0px 0px 0px}
footer #footerInfo #sitefooter #community a{width:50px;height:50px;margin:0px 8px}

}

@media screen and (max-width: 1024px) {
    #flex-header-box nav {display: none;}
    #call_box .workframe{display: flex;flex-direction: column;align-items: center;gap: 20px;padding: 29px 0;}
    #call_box .pathJace{display: flex;flex-direction: column;align-items: center;}
    #call_box .call_left .outJJlink a img{width: 25px;}
    #call_box .call_left .outJJlink a{padding: 12px 20px;}
    footer .threem_box{display: flex;flex-wrap: wrap;gap: 20px;padding: 20px 30px;}
    footer .threem_box #flogo{width: 100%;display: flex;flex-direction: column;align-items: center;}
}

@media screen and (max-width: 980px) {
    .bgTxt.stitle{position:relative;font-size:10vw;-webkit-writing-mode:inherit;writing-mode:inherit}
    header #cis img{width: min(230px, 95%);}
    footer{padding-top:2vh}
    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}
    footer .footercont ul li.title-line{width:230px}
    
}

@media screen and (max-width: 768px) {
    header{top:0;padding:4px 0}
	header #cis img{width:min(180px,95%)}
	header:before{display:none}
    .flyicon,.gotop{right: 8px;}
}

@media screen and (max-width: 640px) {
    header #menubtn a{width:24px;height:21px}
    header #header_bar{display:none}
    .wpfm-floating{display:none}
    .bgTxt.title h3{margin-top:0px;font-size:27px}
    footer .footercont ul{width:100%;padding:2vh 0 0}
    footer .footercont ul:last-child{padding:0vh 0 0}
    footer .footercont .title h3.contact-txt{font-size:12px;margin-top:-10px}

    footer #footerInfo #sitefooter #community{display:flex;flex-wrap:wrap;justify-content:center}
    footer #footerInfo #sitefooter #community a{margin:10px;width:80px;height:80px}
    footer #footerInfo #sitefooter #community a img{width:100%;height:auto}
}

@media screen and (max-width: 550px) {
    header .item{padding:0 0%}
    header .top_btn{width:90%}
    header #webmenu{width:320px}
}

@media screen and (max-width: 48px) {
    .webBox header #search_box #openform{width:40px;height:40px}
    .webBox header #search_box{display:none}
    header #cis img{width:180px}
    header{padding:0}
}
