/*=== Web Setting ===*/
body {font-family: 'Microsoft JhengHei';}
.wrap {max-width:1200px;}
.pageContainer {width:100%}
.innerContainer {width:100%}
h1 {}
h2 {}
p {}

/*======*/

body {-webkit-text-size-adjust: 100%  /*fix ios*/}

.pageContainer {margin-top: 247px; position:relative; padding:0; overflow:hidden; clear:both /*fix firefox*/}


#header , #footer {position:relative; width:100%}

.wrap { position:relative; margin:0 auto; padding:0; overflow:hidden}
.mainContent{position:relative; width:100%; overflow:hidden}

/*==========================================
Header
==========================================*/
#header {padding-top: 5px; position: fixed; z-index: 100; background: #fff;}
#header .mainLogo{position: absolute; left: 0; bottom: 0;}
#header .mainLogo img{width: 100%;}
#header .mainLogo .mobile-logo{display: none;}
.header-tel{position: absolute; bottom: 0; left: 250px;}
.header-tel p a{color: #000;}
.header-tel p{font-size: 20px; color: #000; font-weight: bold}
.header-tel p::before{display: inline-block; width: 26px; height: 26px; content: ' '; background: url('../images/icons/header-tel.png'); margin-right: 5px; position: relative; top: 5px; transform: scale(0.7);}
.header-tel p span{font-weight: bold;}

.header-tel .wa::before{display: inline-block; width: 26px; height: 26px; content: ' '; background: url('../images/icons/sm_whatsapp.png'); margin-left: 10px; margin-right: 5px; position: relative; top: 5px; transform: scale(0.7);}
.header-tel .ewa::before{display: inline-block; width: 26px; height: 26px; content: ' '; background: url('../images/icons/sm_whatsapp.png'); margin-left: 55px; margin-right: 5px; position: relative; top: 5px; transform: scale(0.7);}

.header-right{float: right;}
.header-right-top{text-align: right; margin-bottom: 5px;}
.header-right-top ul{}
.header-right-top ul li{display: inline-block; padding: 0 10px; position: relative;}
.header-right-top ul li:last-child{padding-right: 0;}
.changeLang a{font-size: 14px; color: #3c3c3c; margin-right: 5px;}
.changeLang a:last-child{margin-right: 0;}
.changeLang a.selected, .changeLang a:hover{color: #f80019;}
.changeWebsite{font-size: 14px; color: #3c3c3c; font-weight: bold;}
.changeWebsite::before{display: inline-block; width: 19px; height: 19px; content: ' '; background: url('../images/icons/header-lang.png'); margin-right: 8px; position: relative; top: 4px;}
.changeWebsite i{margin-left: 5px;}
#header .social-icon{position: relative; top: 5px; transition: 0.3s;}
#header .social-icon.first{margin-right: 10px;}
#header .social-icon:hover{transform: translateY(-5px);}

.header-quote{float: right; margin-top: 10px;}
.header-quote img:not(.no-effect):hover{filter: brightness(120%);}
.header-quote-top{margin-bottom: 5px;}
.quote-commercial{float: right;}

.changeWebsite-menu{display: none; position: absolute; top: 30px; background: #fff; border: solid 1px #000;}
.changeWebsite-menu li{display: block !important; white-space: nowrap; padding: 0px !important; border-bottom: solid 1px #000;}
.changeWebsite-menu li:last-child{border-bottom: 0;}
.changeWebsite-menu li a{padding: 10px 15px; font-size: 14px; color: #000; font-weight: bold; display: block;}
.changeWebsite-menu li a:hover{color: #f80019;}

#header .wrap{margin-bottom: 15px;}

.nav{background: #e60012; text-align: center;}
.nav ul{}
.nav ul li{display: inline-block;}
.nav ul li a{font-size: 16px; color: #fff; font-weight: bold; padding: 15px 30px; display: block; transition: 0.3s;}
/*.nav ul li a.selected, .nav ul li a:hover{background: #b10000;}*/
.nav ul li.selected, .nav ul li:hover{background: #b10000;}

#header.scrolled{}
#header.scrolled .header-right{}
#header.scrolled .header-right-top{margin-right: 20px; float: left;}
#header.scrolled .header-quote{margin-top: -5px; transform: scale(0.8);}
#header.scrolled .mainLogo{bottom: inherit; top: 10px;}
#header.scrolled .mainLogo img{width: 70%;}
#header.scrolled .header-tel{transform: scale(0.9); left: 160px; bottom: 10px;}
#header.scrolled .wrap{margin-bottom: 0;}

#header *:not(.changeWebsite-menu):not(.header-quote-img){transition: 0.3s;}



/*==========================================
Common
==========================================*/
.flex{display: flex}
.flex-h-center{justify-content: center; -webkit-justify-content: center;}
.flex-v-center{    -webkit-align-items: center;    -ms-flex-align: center;    align-items: center;}

.page-detail .normal-title h1{font-size: 40px; color: #e60012; line-height: 45px; padding: 15px 0px; float: left;}


/* about-team */

.badge-section{text-align: center; padding: 60px 90px;}
h2.pageInnerTitle{font-size: 35px; color: #e60012; margin-bottom: 25px;}
.badge-section p{font-size: 20px; color: #000; margin-bottom: 30px; line-height: 30px;}
.badge-section span{font-size: 20px; color: #000; font-weight: bold;}
.badge-list{margin-top: 50px; text-align: left;}
.badge-list li{width: 16%; margin-bottom: 45px; display: inline-block; text-align: center; vertical-align: top;}
.badge-img{width: 60%; margin: 0 auto 24px auto;}
.badge-img img{width: 100%;}
.badge-list li figcaption{font-size: 16px; color: #000;}

.uniform-section{text-align: center; padding: 0 90px;}
.uniform-section p{font-size: 20px; color: #000; margin-bottom: 30px; line-height: 30px;}
.uniform-section span{font-size: 20px; color: #000; font-weight: bold;}
.uniform-list{margin-top: 50px; padding: 0 50px; text-align: left;}
.uniform-list li{width: 49%; margin-bottom: 50px; display: inline-block; text-align: center;}
.uniform-img{width: 90%; margin: 0 auto 24px auto;}
.uniform-img img{width: 100%;}
.uniform-list li figcaption{font-size: 16px; color: #000;}

/* about-cert */
.cert-detail{margin-bottom: 20px;}
.cert-detail .detail-word{width: 50%; float: left;}
.cert-detail .detail-word p{margin-bottom: 35px; font-size: 18px; color: #000; line-height: 30px; text-align: justify;}
.cert-detail .detail-img{width: 45%; float: right;}
.cert-detail .detail-img img{width: 100%;}

.cert-section{text-align: center;}
.cert-list{margin-top: 50px; text-align: left;}
.cert-list li{width: 24%; margin-bottom: 45px; /*display: inline-block;*/ float: left; text-align: center;}
.cert-img{width: 80%; margin: 0 auto 24px auto; position: relative; border: solid 2px transparent; height: 166px;}
.cert-img img{width: 100%; height: 100%; object-fit: contain;}
.cert-list li figcaption{font-size: 16px; color: #000; line-height: 25px;}
.cert-img .overlay{visibility: hidden; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0, .6); z-index: 2;}
.cert-img:hover{border: solid 2px #ddac56;}
.cert-img:hover .overlay{visibility: visible;}
.cert-img .overlay img{width: 42px; height: 42px;}
.cert-img .overlay p{font-size: 14px; color: #ddac56; margin-top: 10px;}

/* about-award */
.award-detail-top{margin: 30px 0 55px 45px;}
.award-detail-top .top-img{width: 20%; float: left;}
.award-detail-top .top-img img{width: 100%;}
.award-detail-top .top-word{width: 75%; float: right; padding: 35px 30px; background: #fff7e7; border: solid 1px #e60012; border-radius: 10px;}
.award-detail-top .top-word h2{font-size: 30px; color: #e60012; margin-bottom: 16px; line-height: 45px;}
.award-detail-top .top-word p{font-size: 18px; color: #000; line-height: 35px; text-align: justify;}

.award-detail-bottom{margin: 0 45px 55px 0;}
.award-detail-bottom .bottom-img{width: 20%; float: right;}
.award-detail-bottom .bottom-img img{width: 100%;}
.award-detail-bottom .bottom-word{width: 75%; float: left; padding: 35px 30px; background: #fff7e7; border: solid 1px #e60012; border-radius: 10px;}
.award-detail-bottom .bottom-word h2{font-size: 30px; color: #e60012; margin-bottom: 16px;}
.award-detail-bottom .bottom-word p{font-size: 18px; color: #000; line-height: 35px; text-align: justify;}

.word-img{padding: 0 20px; display: flex; justify-content: space-between; margin-top: 20px;}
.brown-top .word-img img{max-width: 205px; width: 100%;}

.award-section{text-align: center;}
.award-list{margin-top: 50px; text-align: left;}
.award-list li{width: 24%; margin-bottom: 45px; display: inline-block; text-align: center; vertical-align: top;}
.award-img{width: 57%; margin: 0 auto 24px auto; position: relative;}
.award-img img{width: 100%;}
.award-list li figcaption{font-size: 16px; color: #000; line-height: 22px;}
.award-list li figcaption span{color: #e60012;}
.award-list li figcaption p{margin-top: 5px; line-height: 25px;}
.award-img .overlay{visibility: hidden; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2;}
.award-img:hover{}
.award-img:hover .overlay{visibility: visible;}
.award-img .overlay img{width: 16px; height: 16px; position: absolute; bottom: 10px; right: 10px;}

.other-img{display: none;}

/* about-charity */
.charity-detail-top{margin: 30px 0 55px 45px;}
.charity-detail-top .top-img{width: 30%; float: left;}
.charity-detail-top .top-img img{width: 100%;}
.charity-detail-top .top-word{width: 65%; float: right; padding: 35px 30px;}
.charity-detail-top .top-word h2{font-size: 30px; color: #e60012; margin-bottom: 16px; margin-top: 20px;}
.charity-detail-top .top-word h2 img{margin-right: 20px;}
.charity-detail-top .top-word p{font-size: 18px; color: #000; line-height: 35px; text-align: justify;}
.charity-aim::before{display: inline-block; width: 45px; height: 40px; content: ' '; background: url('../images/icons/charity-heart.png'); margin-right: 20px; position: relative; top: 7px;}
.charity-target::before{display: inline-block; width: 50px; height: 41px; content: ' '; background: url('../images/icons/charity-target.png'); margin-right: 20px; position: relative; top: 7px;}

.charity-detail-top ul{padding-left: 90px; list-style-image: url(../images/icons/li-triangle.png);}
.charity-detail-top ul li{padding: 12px 0; font-size: 18px; line-height: 25px;}

#charity-slider{width: 80%; margin: 0 auto 30px auto;}
#charity-slider .swiper-slide{padding: 0 20px;}
#charity-slider figure{text-align: center;}
#charity-slider figure figcaption{margin-top: 20px; padding-bottom: 5px; line-height: 25px; /*text-align: left;*/ display: inline-block;}
.charity-slider-img{max-width: 455px; max-height: 340px;}
.charity-slider-img img{height: 100%; width: 100%; object-fit: contain;}

#about-charity .swiper-button-next, #about-charity .swiper-container-rtl .swiper-button-prev{right: 50px; background-image: url(../images/icons/charity-right.png);}
#about-charity .swiper-button-next:hover, #about-charity .swiper-container-rtl .swiper-button-prev:hover{background-image: url(../images/icons/charity-right-hover.png)}
#about-charity .swiper-button-prev, #about-charity .swiper-container-rtl .swiper-button-next{left: 50px; background-image: url(../images/icons/charity-left.png);}
#about-charity .swiper-button-prev:hover, #about-charity .swiper-container-rtl .swiper-button-next:hover{background-image: url(../images/icons/charity-left-hover.png);}
#about-charity .swiper-button-prev, #about-charity .swiper-button-next{width: 21px; height: 39px; background-size: 21px 39px;}

/* about-client */
.about-client-list{margin-top: 40px;}

/* commercial-pest-control */
.commercial-top{position: relative;}
.commercial-top .page-detail{position: absolute; top: 20%;}
.commercial-top p{font-size: 18px; line-height: 35px; margin-bottom: 20px;}
.commercial-top .commercial-detail-top{max-width: 600px;}
.commercial-top-banner{width: 100%; margin-bottom: -2px;}

#commercial .commerical-list{margin-bottom: 20px;}
#commercial .commerical-list > li{display: inline-block; /* float: left; */ margin-right: 2%; margin-top: 20px; margin-bottom: 40px; width: 18%; vertical-align: top;}
#commercial .commerical-list > li:nth-of-type(5n){margin-right: 0px;}
#commercial .commerical-list > li a{float: left; width: 100%}
#commercial .commerical-list > li a .thumb{width: 100%; height: 100%;}
#commercial .commerical-list > li a .thumb img{max-width: 100%; max-height:100%; width: auto; height: auto;}
#commercial .commerical-list > li a .title{background: #8a6428; padding: 10px 0px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; text-align: center; margin-top: -4px;}
#commercial .commerical-list > li:nth-of-type(2n) a .title{background: #af833c}
#commercial .commerical-list > li a .title p{font-size: 16px; line-height: 25px; color: #fff}
#commercial .commerical-list > li a:hover .title, #commercial .commerical-list li a.selected .title{background: #f80019;}

.selected-triangle{width: 0; height: 0; border-style: solid; border-width: 10px 8.5px 0 8.5px; border-color: #f80019 transparent transparent transparent; margin: 0 auto; display: none;}
#commercial .commerical-list > li a.selected .selected-triangle{display: block;}

.pest-control-detail{padding: 48px 0; background: #dec490;}
.pest-control-detail-left{width: 50%; float: left;}
.pest-control-detail-left h2{font-size: 35px; color: #fff; background: #e60012; padding: 10px 20px; display: inline-block;}
.pest-control-detail-left .largeImg{width: 100%;}
.pest-control-detail-right{width: 45%; float: right; padding: 30px 30px 30px 30px; background: #f3ebdc; border-radius: 7px;}
.pest-control-detail-right h3{font-size: 22px; color: #e60012; margin-bottom: 30px; margin-top: 30px;}
.pest-control-detail-right p{font-size: 16px; color: #000; line-height: 25px; text-align: justify;}
.pest-control-detail-right ul{list-style-image: url(../images/icons/li-triangle.png); padding-left: 20px;}
.pest-control-detail-right ul li{padding: 12px 0; line-height: 20px; line-height: 30px;}
.pest-control-detail-right ul li span{font-size: 16px !important; }
.pest-control-detail-right ul li ul{list-style-image: none; list-style: disc;}
.pest-control-detail-right ul ul{list-style-image: none; list-style: disc;}

.contact-bottom.control-bottom{padding-bottom: 0;}

.single-largeSlide{height: 400px; background: #fff;}
.single-largeSlide img{width: 100%; max-width: 100%; max-height: 100%; object-fit: contain;}
.gridder-expanded-content{margin-bottom: 50px; margin-top: 50px;}
.gridder-show{background: #dec490; width: 160% !important; left: -360px;}
.control-wrap{overflow: visible;}

/* home-pest-control */ 
#home-pest .home-pest-list{margin-bottom: 40px;}
#home-pest .home-pest-list > li{display: inline-block; /* float: left; */ margin-right: 1.5%; margin-top: 20px; margin-bottom: 20px; width: 8%; vertical-align: top;}
#home-pest .home-pest-list > li:nth-of-type(10n){margin-right: 0px;}
#home-pest .home-pest-list > li a{float: left; width: 100%}
#home-pest .home-pest-list > li a .thumb{width: 100%; height: 98px; background: #fff; border-top-left-radius: 10px; border-top-right-radius: 10px; overflow: hidden; border: 1px solid transparent;}
#home-pest .home-pest-list > li a.selected .thumb, #home-pest .home-pest-list li a:hover .thumb{border: 1px solid #f80019}
#home-pest .home-pest-list > li a .thumb img{max-width: 100%; max-height:100%; width: auto; height: auto;}
#home-pest .home-pest-list > li a .title{background: #8a6428; padding: 5px 0px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; text-align: center; margin-top: -1px;}
#home-pest .home-pest-list > li:nth-of-type(2n) a .title{background: #af833c}
#home-pest .home-pest-list > li a .title p{font-size: 16px; line-height: 25px; color: #fff}
#home-pest .home-pest-list > li a:hover .title, #home-pest .home-pest-list li a.selected .title{background: #f80019;}

#home-pest .home-pest-list > li a.selected .selected-triangle{display: block;}


/* mobile */


.mobileIcon {display:none; position:relative; top:10px; height:36px; width:36px; background-color:#fff;  padding:8px; border:2px solid #fff; border-radius:5px; z-index:999}
.mobileIcon span {margin:0 auto; display:block; width:17px; height:2px; background-color:#e60012; margin-bottom:5px; transition:0.5s; -webkit-transition:0.5s}
.mobileIcon span:nth-last-of-type(1) {margin-bottom:0}
.mobileIcon.opened {padding:3px 8px}
.mobileIcon.opened span:nth-of-type(1) {transform: translate(0px, 13px) rotate(-45deg) scalex(1.3); -webkit-transform: translate(0px, 13px) rotate(-45deg) scalex(1.3); margin-bottom:0}
.mobileIcon.opened span:nth-of-type(2) {display:none}
.mobileIcon.opened span:nth-last-of-type(1) {-webkit-transform: translate(0px, 11px) rotate(45deg) scalex(1.3)}

.sb-slidebar {background-color: #d8d8d8 !important; padding: 15px;}

.mobile-top{display: flex; justify-content: space-around; margin-bottom: 10px;}
.mobile-top a{font-size: 14px; color: #3c3c3c;}
.mobile-top .changeWebsite{position: relative; top: -7px;}

.mobile-lang{display: inline-block; float: left; position: relative; top: 4px;}
.mobile-lang a{color: #3c3c3c; margin-right: 10px;}
.mobile-lang a.selected{color: #f80019;}

.mobile-social{display: inline-block; float: right;}
.mobile-social a{margin-left: 10px;}

.mobile-middle{padding: 0 20px; margin-bottom: 10px;}

.mobile-bottom{width: 203px; margin: 0 auto; margin-top: 20px;}
.mobile-nav{text-align: center; margin-top: 20px; border-top: 1px solid #727171; border-bottom: 1px solid #727171; padding: 10px 0;}
.mobile-nav li{}
.mobile-nav li a{display: block; width: 100%; padding: 10px 0; font-size: 15px; color: #000;}
.mobile-nav li a.selected{background: #e60012; color: #fff;}


/*==========================================
Footer
==========================================*/

.footer-top{background: #b89a60; padding: 25px 0;}
.footer-top span{font-size: 16px; color: #fff; display: block;}
.footer-top p{font-size: 40px; color: #fff; margin-top: 18px; display: inline-block;}
.footer-top p a{color: #fff;}
.footer-tel{width: 50%; float: left; border-right: solid 1px #fff; padding: 0 50px;}
.footer-quote{width: 50%; float: left; padding: 0 50px;}
.footer-quote p::after{display: inline-block; width: 19px; height: 36px; content: ' '; background: url('../images/icons/footer-arrow.png'); margin-left: 20px; position: relative; top: 4px;}
.footer-quote-inner{display: flex; justify-content: space-between;}
.footer-quote p:hover{color: #f80019;}

.footer-bottom{background: #544831; padding: 43px 0 38px 0;}

.footerNav{display: flex; justify-content: space-between; margin-bottom: 35px;}
.footerNav li{margin-right: 20px;}
.footerNav li:last-child{margin-right: 0;}
.footerNav li a{font-size: 14px; color: #cca355;}
.footerNav li a:hover{color: #f80019;}
.footerNav li .footerSubNav{margin-top: 15px;}
.footerNav li .footerSubNav li{margin-bottom: 13px;}
.footerNav li .footerSubNav li a{font-size: 13px; color: #fff;}
.footerNav li .footerSubNav li a:hover{color: #f80019;}
.footerSubNav.half{columns: 2; -webkit-columns: 2; -moz-columns: 2;}
.lbs-group{font-size: 13px; color: #fff; position: absolute; bottom: 5px; left: 0;}
.lbs-group a{color: #fff;}
.copyright{font-size: 13px; color: #fff; position: absolute; bottom: 5px; right: 0;}


/*Top btn*/
#back-top {	display:none; position:fixed; z-index:999; bottom:30%; right:10px; transform: scale(0.8);}
#back-top a { display: block; width:47px; height:47px; background:url('../images/icons/btn_top.png') no-repeat left top; text-indent:100%; white-space:nowrap; overflow:hidden;}
#back-top a:hover {background:url('../images/icons/btn_top-hover.png') no-repeat left top}

/*==========================================
CMS Style
==========================================*/

.undoreset table {border:1px solid #000}
.undoreset table td {border:1px solid #000; padding:5px; vertical-align:middle}
.undoreset img {max-width:100%}
.undoreset p {margin:0 0 30px 0}
.undoreset ul {list-style-type:disc}
.undoreset ol {list-style-type:decimal}
.undoreset li {margin-left:25px;}