/* Css Flash */
.swiper1 { --swiper-pagination-color: #fff; --swiper-theme-color: #fff;}
.swiper1 .swiper-slide a{ display:block; width:100%; height:100%;}
.swiper1 .swiper-slide a img{ width:100%;}
.swiper1 .swiper-slide a img:nth-child(2){ display:none;}
.swiper-pagination1 { margin-bottom: 16px;}
@media screen and (max-width: 1024px) {
    .swiper1 .swiper-slide a img:nth-child(1){ display:none;}
    .swiper1 .swiper-slide a img:nth-child(2){ display:block;}
    .swiper-pagination1 { margin-bottom: 4px;}
}


/* Css Service */
.fw-bg { background-color: #f5f5f5; padding-bottom: 100px;}
.title { text-align: center; padding: 84px 0 58px;}
.title h1 { font-family: 'OPPOSans-Bold'; font-size: 48px; font-weight: normal; color: #00703c;}
.title p { font-size: 18px; color: #666; line-height: 33px; margin-top: 15px;}
.fw-ls a { display: block; width: 24.142857%; height: 300px; background-repeat: no-repeat; background-position: center; background-size: cover; position: relative; cursor: pointer; -webkit-transition: all .5s ease; transition: all .5s ease;}
.fw-ls a:nth-child(1) { background-image: url(../Images/fw_01.jpg);}
.fw-ls a:nth-child(2) { background-image: url(../Images/fw_02.jpg);}
.fw-ls a:nth-child(3) { background-image: url(../Images/fw_03.jpg);}
.fw-ls a:nth-child(4) { background-image: url(../Images/fw_04.jpg);}
.fw-ls a .fw-bj { position: absolute; left: 0; top: 0; z-index: 9; width: 100%; height: 100%; background-color: rgba(0,0,0,.5); -webkit-transition: all .3s ease; transition: all .3s ease;}
.fw-ls a:hover .fw-bj { background-color: rgba(0,112,60,.85);}
.fw-ls a .fw-tb { position: absolute; left: 40px; top: 45px; z-index: 99;}
.fw-ls a .fw-tb img { width: 46px; height: 40px;}
.fw-ls a .fw-tx { position: absolute; left: 40px; top: 114px; z-index: 99; color: #fff; padding-right: 15px; -webkit-transition: all .5s ease; transition: all .5s ease;}
.fw-ls a:hover .fw-tx { top: 150px;}
.fw-ls a .fw-tx h4 { font-size: 18px; font-weight: normal;}
.fw-ls a .fw-tx h3 { font-size: 24px; font-weight: normal; line-height: 30px; margin: 11px 0 12px;}
.fw-ls a .fw-tx p { font-size: 16px; line-height: 23px;}
@media screen and (max-width: 1366px) {
    .fw-ls a .fw-tb { left: 25px; top: 35px;}
    .fw-ls a .fw-tx { left: 25px; top: 104px;}
}
@media screen and (max-width: 1024px) {
    .fw-bg { padding-bottom: 65px}
    .title { padding: 49px 0 33px;}
    .title h1 { font-size: 30px;}
    .title p { font-size: 16px; line-height: 30px; margin-top: 11px;}
    .fw-ls a { height: 213px;}
    .fw-ls a .fw-tb { left: 20px; top: 25px;}
    .fw-ls a .fw-tb img { width: 36px; height: 31px;}
    .fw-ls a .fw-tx { left: 20px; top: 74px;}
    .fw-ls a:hover .fw-tx { top: 100px;}
    .fw-ls a .fw-tx h4 { font-size: 16px;}
    .fw-ls a .fw-tx h3 { font-size: 18px; line-height: 27px; margin: 6px 0;}
    .fw-ls a .fw-tx p { font-size: 14px; line-height: 23px;}
}
@media screen and (max-width: 768px) {
    .fw-ls { flex-wrap: wrap;}
    .fw-ls a { width: 49.25%; height: 220px;}
    .fw-ls a:nth-child(n+3) { margin-top: 1.5%;}
}
@media screen and (max-width: 480px) {
    .fw-bg { padding-bottom: 35px}
    .title { padding: 30px 0 20px;}
    .title h1 { font-size: 24px;}
    .title p { font-size: 14px; line-height: 24px; margin-top: 8px;}
    .fw-ls a { height: 200px;}
    .fw-ls a .fw-tb { left: 15px; top: 20px;}
    .fw-ls a .fw-tb img { width: 32px; height: 28px;}
    .fw-ls a .fw-tx { left: 15px; top: 68px;}
    .fw-ls a:hover .fw-tx { top: 68px;}
    .fw-ls a .fw-tx h4 { font-size: 14px;}
}
@media screen and (max-width: 375px) {
    .fw-ls a { height: 220px;}
}


/* Css Products */
.ig-bg { background-color: #fff;}
.ig-bg .title { padding: 99px 0 78px;}
.swiper3 a { display: block; width: 100%; height: 100%; position: relative; cursor: pointer; overflow: hidden;}
.swiper3 a img { width: 100%; -webkit-transition:all .75s ease-in-out; transition:all .75s ease-in-out;}
.swiper3 a dl { position: absolute; left: 0; bottom: 0; width: 100%; font-size: 30px; color: #fff; text-align: center; line-height: 100px; opacity: 0; background:linear-gradient(top, rgba(0,112,60,0), rgba(0,112,60,1)); background:-webkit-linear-gradient(top, rgba(0,112,60,0), rgba(0,112,60,1));}
.swiper3 .swiper-slide-active a dl, .swiper3 .swiper-slide-duplicate-active a dl { opacity: 1; -webkit-transition: all .5s ease; transition: all .5s ease;}
.swiper3 .swiper-slide-active a:hover img, .swiper3 .swiper-slide-duplicate-active a:hover img { transform: scale(1.1,1.1); -webkit-transform: scale(1.1,1.1);}
.swiper-button-prev, .swiper-button-next { width: 50px; height: 50px; background-color: rgba(0,0,0,.35); background-repeat: no-repeat; background-position: center; background-size: 18px 14px; border-radius: 50%; margin-top: -25px; -webkit-transition: all .3s ease; transition: all .3s ease;}
.swiper-button-prev:hover, .swiper-button-next:hover { background-color: rgba(0,112,60,.85);}
.swiper-button-prev{ background-image: url(../Images/jt01.png);}
.swiper-button-next{ background-image: url(../Images/jt02.png);}
.swiper-button-prev, .swiper-container-rtl .swiper-button-next{ left: 15px;}
.swiper-button-prev:after, .swiper-container-rtl .swiper-button-next:after{ content: '';}
.swiper-button-next, .swiper-container-rtl .swiper-button-prev{ right: 15px;}
.swiper-button-next:after, .swiper-container-rtl .swiper-button-prev:after{ content: '';}
@media screen and (max-width: 1024px) {
    .ig-bg .title { padding: 64px 13.5% 43px;}
    .ig-bg .title p br { display: none;}
    .swiper3 a dl { font-size: 18px; line-height: 50px;}
    .swiper-button-prev, .swiper-button-next { width: 32px; height: 32px; background-size: 12px 9px; margin-top: -16px;}
    .gallery-thumbs .swiper-slide-thumb-active:after { height: 5px;}
    .swiper-button-prev, .swiper-container-rtl .swiper-button-next { left: 10px;}
    .swiper-button-next, .swiper-container-rtl .swiper-button-prev { right: 10px;}
}
@media screen and (max-width: 768px) {
    .ig-bg .title { padding: 64px 5% 43px;}
}
@media screen and ( max-width:480px ){ 
    .ig-bg .title { padding: 40px 5% 25px;}
    .swiper3 a dl { line-height: 40px;}
    .swiper-button-prev, .swiper-button-next { width: 30px; height: 30px; background-size: 10px 8px; margin-top: -15px;}
    .gallery-thumbs .swiper-slide-thumb-active:after { height: 3px;}
}


/* Css Advantage */
.ys-bg { background-color: #fff; padding-bottom: 125px;}
.ys-bg .title { padding: 99px 0 78px;}
.ys-ls { flex-wrap: wrap;}
.ys-ls a { display: block; width: 33.333333%; cursor: pointer; display: flex; flex-direction: column;}
.ys-ls a .ys-tx { height: 272px; padding: 0 35px; display: flex; justify-content: center; flex-direction: column; -webkit-transition: all .5s ease; transition: all .5s ease;}
.ys-ls a:nth-child(1) .ys-tx { border-top: 1px solid #e0e0e0; border-left: 1px solid #e0e0e0;}
.ys-ls a:nth-child(3) .ys-tx { border-top: 1px solid #e0e0e0; border-right: 1px solid #e0e0e0;}
.ys-ls a:nth-child(4) .ys-tx { border-left: 1px solid #e0e0e0;}
.ys-ls a:nth-child(5) .ys-tx { border-bottom: 1px solid #e0e0e0;}
.ys-ls a:nth-child(6) .ys-tx { border-right: 1px solid #e0e0e0;}
.ys-ls a .ys-tx dl { font-size: 20px; color: #333; line-height: 28px; -webkit-transition: all .3s ease; transition: all .3s ease;}
.ys-ls a .ys-tx p { font-size: 16px; color: #666; line-height: 25px; margin-top: 10px; -webkit-transition: all .3s ease; transition: all .3s ease;}
.ys-ls a .ys-ig { height: 272px; overflow: hidden; position: relative;}
.ys-ls a .ys-ig div { width: 100%; height: 100%; background-repeat: no-repeat; background-position: center; background-size: cover; -webkit-transition: all .75s ease; transition: all .75s ease;}
.ys-ls a .ys-ig span { position: absolute; left: 50%; top: 0; display: block; width: 19px; height: 10px; margin-left: -9px; background: url(../Images/jt03.png) no-repeat center; -webkit-transition: all .5s ease; transition: all .5s ease;}
.ys-ls a:nth-child(3n+2) .ys-ig span { top: inherit; bottom: 0; -webkit-transform: rotate(180deg); transform: rotate(180deg);}
.ys-ls a:hover .ys-tx { background-color: #00703c; border-color: #00703c;}
.ys-ls a:hover .ys-tx dl { color: #fff;}
.ys-ls a:hover .ys-tx p { color: #fff;}
.ys-ls a:hover .ys-ig div { transform: scale(1.1,1.1); -webkit-transform: scale(1.1,1.1);}
.ys-ls a:hover .ys-ig span { background: url(../Images/jt04.png) no-repeat center;}
@media screen and (max-width: 1024px) {
    .ys-bg { padding-bottom: 85px;}
    .ys-bg .title { padding: 64px 0 43px;}
    .ys-ls a .ys-tx { height: 193px; padding: 0 20px;}
    .ys-ls a .ys-tx dl { font-size: 18px; line-height: 27px;}
    .ys-ls a .ys-tx p { font-size: 14px; line-height: 23px; margin-top: 5px;}
    .ys-ls a .ys-ig { height: 193px;}
}
@media screen and (max-width: 768px) {
    .ys-ls a { width: 50%;}
    .ys-ls a:nth-child(n+4) { flex-direction: column-reverse;}
    .ys-ls a .ys-tx { height: 215px; padding: 0 15px;}
    .ys-ls a:nth-child(2) .ys-tx { border-right: 1px solid #e0e0e0;}
    .ys-ls a:nth-child(3) .ys-tx { border-top: none; border-right: none; border-left: 1px solid #e0e0e0;}
    .ys-ls a:nth-child(4) .ys-tx { border-left: none; border-right: 1px solid #e0e0e0;}
    .ys-ls a:nth-child(5) .ys-tx { border-bottom: none; border-left: 1px solid #e0e0e0;}
    .ys-ls a:nth-child(6) .ys-tx { border-bottom: 1px solid #e0e0e0;}
    .ys-ls a .ys-ig { height: 215px;}
    .ys-ls a:nth-child(4) .ys-ig span { top: inherit; bottom: 0; -webkit-transform: rotate(180deg); transform: rotate(180deg);}
    .ys-ls a:nth-child(5) .ys-ig span { top: 0; bottom: inherit; -webkit-transform: inherit; transform: inherit;}
    .ys-ls a:nth-child(6) .ys-ig span { top: inherit; bottom: 0; -webkit-transform: rotate(180deg); transform: rotate(180deg);}
}
@media screen and (max-width: 640px) {
    .ys-ls a .ys-tx { height: 178px;}
    .ys-ls a .ys-ig { height: 178px;}
}
@media screen and (max-width: 480px) {
    .ys-bg { padding-bottom: 45px;}
    .ys-bg .title { padding: 40px 0 25px;}
    .ys-ls a .ys-tx { height: 150px;}
    .ys-ls a .ys-tx dl { font-size: 16px; line-height: 23px;}
    .ys-ls a .ys-tx p { line-height: 21px; margin-top: 4px;}
    .ys-ls a .ys-ig { height: 150px;}
    .ys-ls a .ys-ig span { width: 14px; height: 7px; background-size: 14px 7px; margin-left: -7px;}
}


/* Css About */
.ab-bg { background: url(../Images/abBg.jpg) no-repeat center; background-size: cover; padding-bottom: 100px;}
.ab-bg .title h1 { color: #fff;}
.ab-bg .title p { color: #fff;}
.ab-tx { font-size: 16px; color: #fff; line-height: 36px; margin: -26px 10% 55px; text-align: center;}
.ab-ls a { display: block; width: 48.928571%; position: relative; overflow: hidden;}
.ab-ls a img { width: 100%; -webkit-transition: all .75s ease; transition: all .75s ease;}
.ab-ls a:hover img { transform: scale(1.1,1.1); -webkit-transform: scale(1.1,1.1);}
.ab-ls a dl { position: absolute; left: 0; top: -50px; width: 100%; height: 50px; line-height: 50px; font-size: 30px; color: #fff; text-align: center; -webkit-transition: all .5s ease; transition: all .5s ease;}
.ab-ls a:hover dl { top: 50%; margin-top: -25px;}
.ab-an a { display: block; width: 180px; font-family: 'Kabel Md BT'; font-size: 18px; color: #fff; text-transform: uppercase; letter-spacing: .75px; text-align: center; line-height: 50px; background-color: #59a400; border-radius: 25px; margin: 0 auto 65px; -webkit-transition: all .3s ease; transition: all .3s ease;}
.ab-an a:hover { background-color: #69c200;}
@media screen and (max-width: 1024px) {
    .ab-bg { padding-bottom: 65px;}
    .ab-tx { font-size: 14px; line-height: 28px; margin: -12px 5% 33px;}
    .ab-ls a dl { top: -40px; height: 40px; line-height: 40px; font-size: 24px;}
    .ab-ls a:hover dl { margin-top: -20px;}
    .ab-an a { width: 120px; font-size: 14px; line-height: 36px; margin-bottom: 40px;}
}
@media screen and (max-width: 640px) {
    .ab-tx { margin: -12px 3.5% 33px;}
    .ab-ls a dl { top: -30px; height: 30px; line-height: 30px; font-size: 18px;}
    .ab-ls a:hover dl { margin-top: -15px;}
}
@media screen and (max-width: 480px) {
    .ab-bg { padding-bottom: 35px;}
    .ab-tx { line-height: 24px; margin: -7px 0 20px;}
    .ab-ls { flex-wrap: wrap;}
    .ab-ls a { width: 100%;}
    .ab-ls a:nth-child(n+2) { margin-top: 15px;}
    .ab-an a { margin-bottom: 25px;}
}


/* Css News */
.ns-bg { background-color: #fff; padding-bottom: 125px;}
.ns-bg .title { padding: 99px 0 78px;}
.ns-ls a { display: block; width: 32%;}
.ns-ls a .ns-ig { overflow: hidden;}
.ns-ls a .ns-ig img { width: 100%; -webkit-transition: all .75s ease; transition: all .75s ease;}
.ns-ls a:hover .ns-ig img { transform: scale(1.15,1.15); -webkit-transform: scale(1.15,1.15);}
.ns-ls a .ns-tx { background-color:#fff; border-bottom: 1px solid #e0e0e0; padding: 29px 0 20px; -webkit-transition: all .5s ease; transition: all .5s ease;}
.ns-ls a .ns-tx dl { font-size: 18px; color: #333; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; -webkit-transition: all .3s ease; transition: all .3s ease;}
.ns-ls a .ns-tx span { display:block; font-size: 13px; color: #999; margin: 8px 0 9px; -webkit-transition: all .3s ease; transition: all .3s ease;}
.ns-ls a .ns-tx p { font-size: 14px; color: #666; line-height: 24px; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; -webkit-transition: all .3s ease; transition: all .3s ease;}
.ns-ls a:hover .ns-tx { background-color:#00703c; border-color: #00703c; padding: 29px 20px 20px;}
.ns-ls a:hover .ns-tx dl, .ns-ls a:hover .ns-tx span, .ns-ls a:hover .ns-tx p { color: #fff;}
@media screen and (max-width: 1024px) {
    .ns-bg { padding-bottom: 85px;}
    .ns-bg .title { padding: 64px 0 43px;}
	.ns-ls a .ns-tx { padding: 20px 10px;}
	.ns-ls a .ns-tx dl { font-size: 16px;}
	.ns-ls a .ns-tx span { font-size: 12px; margin: 5px 0 6px;}
}
@media screen and (max-width: 480px) {
    .ns-bg { padding-bottom: 45px;}
    .ns-bg .title { padding: 40px 0 25px;}
	.ns-ls { flex-wrap: wrap;}
	.ns-ls a { width: 100%;}
	.ns-ls a:nth-child(n+2) { margin-top: 25px;}
	.ns-ls a .ns-tx { padding: 15px 10px;}
	.ns-ls a .ns-tx span { margin: 2px 0 3px;}
}