﻿.home-service{ margin-top: 20px;}

.home-service-left{ width: 23%;  padding:  27px; color: #FFFFFF; border-radius: 12px;  background: url(../images/home-service-left.png) no-repeat; background-size:cover; }
.home-service-left em{ display: block; width: 40px; height: 3px; background: #FFFFFF;}
.home-service-left h1{ color: #FFFFFF; font-size: 1.3rem; line-height: 28px; padding-top: 15px; display: block;}


.home-service-right{ width: 76%; }
.home-service-right dl{ width: 24%; background: #FFFFFF; border-radius: 12px; padding: 25px 20px; cursor:pointer;}
.home-service-right dl:hover{ background:#0093E6; color:#fff;}
.home-service-right dl:hover b{color:#fff;}
.home-service-right dl:hover p{color:#fff;}
.home-service-right dl dd{ padding-top: 10px;}
.home-service-right dl dd b{ display: block; line-height: 24px; font-weight:normal;}
.home-service-right dl dd p{ font-size: 0.8rem; line-height: 18px;}
.home-service-right dl:hover img{filter: invert(1) brightness(4) grayscale(1);}

.home-featured{ background: #FFFFFF; padding: 0 20px 20px 20px; margin-top: 15px; border-radius: 16px;}

.home-title{ padding: 30px 0 15px 0;}
.home-title b{font-family: myFirstFont; font-size: 1.8rem; display: block;}
.home-title b img{ margin-right: 8px;}
.home-title a{display: block; width: 88px; height:36px; line-height: 36px; background: #d7d7d7; font-size: 0.8rem; text-align: center;}
.home-title a:hover{ background: #0093E6; color: #FFFFFF;}

.home-products-tab{height: 45px; border-bottom: 1px solid #dedfe2; line-height: 44px;}
.home-products-tab li{ cursor: pointer; border-radius: 6px  6px  0px  0px; height: 44px; line-height: 44px; background: #e7eaee;  font-size: 1rem; padding: 0 15px; margin-right: 8px;}
.home-products-tab li img{ margin-right: 5px;}
.home-products-tab li.thistab{ background: #0093E6; color: #FFFFFF;}
.home-products-tab li.thistab img{filter: grayscale(500%) brightness(500%); }
.home-products-tab li:hover{background: #0093E6; color: #FFFFFF;}
.home-products-tab li:hover  img{filter: grayscale(500%) brightness(500%); }


.home-featured-list{ padding-top: 20px;}
.home-featured-list dl{ width: 19%; background: #FFFFFF; text-align: center; overflow: hidden; box-shadow: 0px 6px 20px 1px rgba(0,0,0,0.08); padding: 20px;}
.home-featured-list dl dt{ text-align: left;}
.home-featured-list dl dd img{ width: 120px; height: 120px;}
.home-featured-list dl dd b{ display: block; font-size: 1rem; color: #111111; height: 24px; line-height: 24px; overflow: hidden;}
.home-featured-list dl dd em{ display: block; color: #666666;}


.home-brand{ width: 100%; height: auto; background: url(../images/home-brandbg.png) no-repeat center; background-size:cover; padding-bottom: 20px; margin-top: 20px;}
.home-brand-list{}
.home-brand-list a{ display: block; width: 11.5%; margin-bottom: 1%; padding: 10px; background: #FFFFFF; box-shadow: 0px 6px 10px 1px rgba(27,58,125,0.1);
border-radius: 6px 6px 6px 6px;}
.home-brand-list a img{ width: 100%; height: auto;}
.home-brand-list a:hover{box-shadow: 0px 6px 20px 1px rgba(27,58,125,0.1); transform: translateY(-5px);}
.home-bestimg{}
.home-bestimg img{ width: 100%; height: auto; border-radius: 16px 16px 0 0;}

.home-best-list{ padding: 15px; background: #FFFFFF;}

.home-best-item{ width: 19.5%; border: 1px solid #EEEEEE; margin-bottom: 0.7%; padding: 12px; border-radius: 4px;}
.home-best-item1{ width: 100%;}
.home-best-item1-left{ width: 30%;}
.home-best-item1-left img{ width: 100%; height: auto;}
.home-best-item1-right{ width: 70%; padding-left: 10px;}
.home-best-item1-right a{ display: block; font-weight: bold; font-size: 1rem; line-height: 26px; height: 26px; overflow: hidden;}
.home-best-item1-right em{line-height: 26px; height: 26px; overflow: hidden; display: block;}
.home-best-item2{ width: 100%; margin-top: 20px;}
.home-best-item2 em{ display: block; background: #e3e6e8; border-radius: 30px; height: 25px; line-height: 25px; padding: 0 12px; font-size: 0.8rem; color: #1B3A7D;}
.home-best-item2 a{ display: block;  background: #b1b1b1;  height: 25px; line-height: 25px; padding: 0 12px; font-size: 0.8rem; color: #FFFFFF; }

.home-blog{ margin-top: 15px;}
.home-blog-left{ width: 49%; background: #FFFFFF; padding: 0 20px 20px 20px; border-radius: 16px;}

.home-blog-item{ width: 100%; padding-bottom: 15px;}
.home-blog-item-left{ width: 45%;}
.home-blog-item-left img{ width: 100%; height: auto;}

.home-blog-item-right{ width: 55%; padding-left: 20px;}
.home-blog-item-right a{ display: block; font-weight: bold; font-size: 1rem; line-height: 20px; height: 40px; overflow: hidden;}
.home-blog-item-right em{ display: block; text-align: center; width: 126px; height: 34px; line-height: 32px; border: 1px solid #EEEEEE; margin-top: 15px;}
.home-blog-item-right em img{ margin-left: 5px;}
.home-blog-item-right p{ font-size: 12px; line-height: 16px; height: 32px; overflow: hidden; margin-top: 15px;}


.home-blog-item-list{ width: 100%;}
.home-blog-item-list dl{ width: 100%; border-top: 2px solid #EEEEEE; padding: 15px 0;}
.home-blog-item-list dl dt{ width: 23%;}
.home-blog-item-list dl dt img{ width: 100%; height: auto;}
.home-blog-item-list dl dd{ width: 77%; padding-left: 20px;}
.home-blog-item-list dl dd a{ display: block; font-weight: bold; font-size: 1rem; line-height: 20px; height: 40px; overflow: hidden;}
.home-blog-item-list dl dd p{ font-size: 12px; line-height: 16px; height: 32px; overflow: hidden; margin-top: 5px;}


.home-post{ background: #FFFFFF; padding: 0 20px 20px 20px; margin-top: 15px; border-radius: 16px;}  
.home-post-list{ width: 100%;}
.home-post-list dl{ width: 32.6%; border: 1px solid #EEEEEE; padding: 20px; margin-bottom: 1%;}
.home-post-list dl dt{ width: 20%; height: auto;}
.home-post-list dl dt img{ width: 100%; height: auto;}
.home-post-list dl dd{ width: 80%; height: auto; padding-left: 20px;}
.home-post-list dl dd a{ color: #111111; line-height: 26px; height: 26px; overflow: hidden;}
.home-post-list dl dd p{ color: #666666; line-height: 20px; height: 40px; overflow: hidden;}

.home-part{ background: #FFFFFF; padding: 0 20px 20px 20px; margin-top: 15px; border-radius: 16px;} 


.home-part-tab{ height: 45px; border-bottom: 2px solid #dfe0e4; text-align: center;}
.home-part-tab li{font-size: 1rem; height: 43px; line-height: 43px; font-weight: bold; padding: 0 30px; background: #e7eaee; border-radius: 4px 4px 0 0; margin-right: 10px; cursor: pointer;}
.home-part-tab li.thistab{ background: #0093E6;  color: #FFFFFF;   }

.home-part-list{ padding:20px; background: #FFFFFF;}
.home-part-list a{ display: block; width: 20%; height: 26px; line-height: 26px; overflow: hidden; }

.home-part-index{ height: auto; padding: 20px; border-top: 2px solid #dfe0e4;  background: #FFFFFF;}
.home-part-index a{ padding: 0 5px;}



@media (max-width: 768px) {
	
.home-featured{  padding: 0 10px 10px 10px; margin-top: 10px; }

.home-title{ padding: 15px 0;}
.home-title b{font-size: 1.4rem;}
.home-title b img{ margin-right: 5px;}
.home-title a{display: none; }

	
.home-products-tab{height: auto;}
.home-products-tab ul{ justify-content: space-between; }
.home-products-tab li{ width: 49%; overflow: hidden;  margin-right: 0; margin-bottom: 0.5%; font-size: 0.8rem; text-align: center; }
.home-products-tab li img{display: none;}


.home-featured-list{ padding-top:10px;}
.home-featured-list dl{ width: 49%;  padding: 10px; margin-bottom: 2%;}

	
.home-featured-list dl:last-child{ display: none;}	
	


.home-brand{padding-bottom: 10px; margin-top: 10px;}

.home-brand-list a{ width: 24%; padding: 10px;}


.home-bestimg{ display: none;}


.home-best-list{ padding: 10px; background: #FFFFFF;}

.home-best-item{ width: 100%;  padding: 10px; }



.home-blog{ margin-top: 10px;}
.home-blog-left{ width: 100%; padding: 0 10px 10px 10px; }

.home-blog-item{ width: 100%; padding-bottom: 10px;}
.home-blog-item-left{ width: 100%;}

.home-blog-item-right{ width: 100%; padding: 10px 0;}
.home-blog-item-right a{ height: auto; }
.home-blog-item-right em{margin-top: 5px;}
.home-blog-item-right p{  margin-top: 5px;}



.home-blog-item-list dl{ padding: 10px 0;}
.home-blog-item-list dl dt{ width: 30%;}
.home-blog-item-list dl dd{ width: 70%; padding-left: 10px;}
.home-blog-item-list dl dd a{  height: 20px; }

.home-post{ padding: 0 10px 10px 10px; margin-top: 10px; }  
.home-post-list dl{ width: 100%;  padding: 10px; }
.home-post-list dl dt{ width: 20%; height: auto;}



.home-service{ display: none;}

.home-part{ display: none;}


}