﻿.banner{ width: 100%; height: 100%; position: relative;}
.main_visual{ width: 100%; height: 100%; position: relative;}
.main_visual .owl-carousel,.main_visual .owl-stage-outer,.main_visual .owl-stage,.main_visual .owl-carousel .owl-item{width: 100%;height: 100% !important;}
.main_visual .owl-carousel .item{width: 100%;height: 100%;  background-repeat: no-repeat; background-position: center center;-webkit-background-size: cover; background-size: cover;}
.main_visual .owl-carousel .item img{ width: 100%; height: auto;}
.main_visual .owl-prev,.main_visual .owl-next{ display: none; text-indent: -999px; overflow: hidden;}
.main_visual .owl-controls{ height: 0;}
.main_visual .owl-dots{ display: none; text-indent: -9999em;}




.banner-menu{ background: #FFFFFF; z-index: 999; position: absolute; left: 50%; bottom: 0; margin-left: -680px; height: 110px;}
.banner-menu-left{ width: 87%;  white-space: nowrap; overflow: hidden; height: 110px;}
.banner-menu-left dl.active {
  background: #ffbf43;
  transition: all 0.3s ease;
}
.banner-menu-left dl{ width: 33.3%; border-right:1px solid #EEEEEE; padding: 22px 40px; cursor: pointer;   display: inline-flex; /* 横向排列 */
  vertical-align: top;}
.banner-menu-left dl dt{ width: 66px;}
.banner-menu-left dl dt img{ width: 100%; height: auto;}
.banner-menu-left dl dd{ width: calc(100% - 66px); padding:0 20px; font-size: 1rem; 
  white-space: normal;   /* 允许换行 */
  word-break: break-word; /* 单词过长也会换行 */
  overflow-wrap: break-word; /* 更兼容 */}
.banner-menu-left dl:last-child{ border: none;}
.banner-menu-right{ width: 13%;  background: #f8f7f0;}
.banner-menu-right a:first-child{border-right:1px solid #EEEEEE;}
.banner-menu-right a{ width: 50%; height: 100%; text-align: center; }
.banner-menu-right a:hover{ background: #ffbf43;}


.home-custmer{ margin-top: 25px;}
.home-custmer-left{ width: 378px; height: auto; position: relative;}
.home-custmer-left img{ width: 100%; height: auto; border-radius:8px;}
.home-custmer-left-info{ width: 100%; height: auto; padding: 30px 25px; position: absolute; left: 0; top: 0; z-index: 333;}
.home-custmer-left-info h1{ color: #FFFFFF; text-transform: capitalize; font-size: 1.4rem; line-height: 32px;}
.home-custmer-left-info a{ display: inline-block; height: 40px; line-height: 40px; background: #FFBF43;border-radius: 25px; padding: 0 25px; margin-top: 22px;}
.home-custmer-left-info a:hover{ color: #FFFFFF; background: #d64851;}

.home-custmer-right{ width: calc(100% - 398px); height: 100%; min-height: 200px; padding: 30px 0; background: url(../images/home-custmer.jpg) no-repeat center; border-radius:8px; background-size:cover;}
.home-custmer-right dl{ width: 33.3%; height: auto; border-right:1px solid rgba(255,255,255,0.4); padding: 0 50px;}
.home-custmer-right dl dd{ padding-top: 15px;}
.home-custmer-right dl dd h3{ color: #FFFFFF; line-height: 28px; font-size: 1rem;}
.home-custmer-right dl dd p{ color: #FFFFFF; line-height: 18px;}



.home-title{ padding: 50px 0 30px 0;}
.home-title h2{ font-size: 2rem;}
.home-title h2 img{ margin-right: 12px;}
.home-title a{ display: inline-block; margin-left: 20px; height: 60px; line-height: 60px; background: #FFBF43; padding: 0 40px; font-size: 1.1rem; border-radius:8px;}
.home-title a:hover{ color: #FFFFFF; background: #d64851;}
.home-title a.hometitlelinks{ background: #FFFFFF;}
.home-title a.hometitlelinks:hover{ color: #FFFFFF; background: #d64851;}

.home-recom{}
.home-recom-left{ width: 332px; height: auto; position: relative;}
.home-recom-left img{ width: 100%; height: auto; border-radius:8px;}
.home-recom-left-info{width: 100%; height: auto; padding: 30px 25px; position: absolute; left: 0; top: 0; z-index: 333;}
.home-recom-left-info h2{ color: #FFFFFF; text-transform: capitalize; font-size: 1.4rem; line-height: 32px;}
.home-recom-left-info p{ color: #FFFFFF;}
.home-recom-left-info a{ display: inline-block; height: 40px; line-height: 40px; background: #FFBF43;border-radius: 25px; padding: 0 25px; margin-top: 12px;}
.home-recom-left-info a:hover{ color: #FFFFFF; background: #d64851;}

.home-recom-right{ width: calc(100% - 344px);  gap: 10px; grid-template-columns: repeat(3, 1fr); /* 3 列 */  display: grid;}
.home-recom-item:hover{transform: translateY(-3px); transition: transform 0.5s ease;}
.home-recom-item{ width: 100%; background: #FFFFFF; padding: 30px; border-radius:8px; box-shadow: 0px 6px 12px 1px rgba(0,48,119,0.1); }
.home-recom-item-pic{ width: 110px; height: auto;}
.home-recom-item-pic img{ width: 100%; height: auto;}
.home-recom-item-info{ width: calc(100% - 110px); padding-left: 15px;}
.home-recom-item-info a.recprolinks1{ display: block; font-family: myFirstFont1; font-size: 1rem; height: 30px; line-height: 30px; overflow: hidden;}
.home-recom-item-info p{ line-height: 26px; height: 26px; overflow: hidden; margin-top: 5px;}
.home-recom-item-info a.recprolinks2{ display: inline-block; margin-top: 10px; height: 31px; line-height: 31px; background: #F1F1F1;border-radius: 6px; padding: 0 15px;}
.home-recom-item-info a.recprolinks2:hover{ color: #FFFFFF; background: #d64851;} 


.home-brand{ margin-top: 50px; width: 100%; height: auto; background: url(../images/homebrandbg.jpg) no-repeat center; background-size:cover; padding-bottom: 50px;}
.home-brand-list{ background: #FFFFFF; border-radius:8px; grid-template-columns: repeat(7, 1fr); /* 3 列 */  display: grid;}
.home-brand-list a{ display: block; width: 100%; padding: 20px; border:1px solid #EEEEEE; border-bottom: none; border-left: none;}
.home-brand-list a img{ width: 100%; height: auto;}
.home-brand-list a:hover img{ filter: grayscale(100%);}
.home-brand-list a:nth-child(-n+7) {
  border-top: none;
}

/* 每行最后一个不显示右边框 (7,14,21,28...) */
.home-brand-list a:nth-child(7n) {
  border-right: none;
}



.home-best{gap: 10px; grid-template-columns: repeat(6, 1fr); /* 3 列 */  display: grid;}
.home-best-item:hover{transform: translateY(-5px); transition: transform 0.5s ease;}
.home-best-item{ width: 100%; background: #FFFFFF; padding: 30px 15px; border-radius:8px; box-shadow: 0px 6px 12px 1px rgba(0,48,119,0.1); }
.home-best-item-pic{ width: 100%; height: auto; text-align: center;}
.home-best-item-pic img{ width: 100%; height: auto; max-width: 120px;}
.home-best-item-info{}
.home-best-item-info a{ display: block; font-family: myFirstFont1; font-size: 1rem; height: 28px; line-height: 28px; overflow: hidden;}
.home-best-item-info p{ line-height: 26px; height: 26px; overflow: hidden; }
.home-best-item-links{ width: 100%; margin-top: 12px;}
.home-best-item-links a{ display: block;}
.home-best-item-links a.bestlinks1{ width: calc(100% - 40px); border:1px solid #111111; height: 30px; line-height: 28px; text-align: center; border-radius:6px; font-size: 0.8rem;}
.home-best-item-links a.bestlinks1:hover{ color: #FFFFFF; background: #d64851; border-color:#d64851;}
.home-best-item-links a.bestlinks2{ width: 30px; height: 30px;}



.home-about{ margin-top: 50px; width: 100%; height: auto; background: url(../images/homeaboutbg.jpg) no-repeat center; background-size:cover; padding-bottom: 60px;}


.home-about1{}
.home-about1-left{ width: 50%; height: auto; padding-right: 110px;}
.home-about1-left div{ width: 100%;}
.home-about1-left em{ display: inline-block; height: 39px; line-height: 39px; border-radius:25px; border:1px solid rgba(255,255,255,0.6); text-transform: uppercase; color: #FFFFFF; padding: 0 25px;}
.home-about1-left h2{ font-size: 2.6rem; line-height: 58px; color: #FFFFFF; margin-top: 25px;}
.home-about1-left p{ font-size: 1rem; line-height: 26px; color: #FFFFFF;  margin-top: 25px;}
.home-about1-left a{display: inline-block; height: 60px; line-height: 60px; background: #FFBF43; padding: 0 40px; font-size: 1.1rem; border-radius:8px; margin-top: 45px;}
.home-about1-left a:hover{ color: #FFFFFF; background: #d64851;}
.home-about1-right{ width: 50%; height: auto;}
.home-about1-right img{ width: 100%; height: auto; border-radius:0 0 12px 12px;}


.home-aboutnum{margin-top: 30px; gap: 25px; grid-template-columns: repeat(4, 1fr); /* 3 列 */  display: grid;}
.home-aboutnum dl{ width: 100%; background: #333333; border-radius: 12px; padding: 20px 35px;}
.home-aboutnum dl dd{ padding-left: 20px; color: #FFFFFF;}
.home-aboutnum dl dd h3{ color: #FFFFFF; font-size: 2rem; line-height: 36px;}


.home-blog{}


.home-blog-left{ width: 48.5%; background: #ffffff; border-radius: 12px;}
.home-blog-left-pic{ width: 100%; height: auto;}
.home-blog-left-pic img{ width: 100%; height: auto; border-radius: 12px 12px 0 0;}
.home-blog-left-time{ width: 123px; height: 120px; background: url(../images/blogtime.png) no-repeat center; background-size:cover; text-align: center; color: #FFFFFF;  position: relative; z-index: 666; margin-top: -110px;}
.home-blog-left-time b{ color: #FFFFFF; display: block; font-family: myFirstFont1; font-size: 3rem; line-height: 52px; padding-top: 25px;}

.home-blog-left-info{ padding: 30px 35px;}
.home-blog-left-info a.bloglinks1{ margin-top: 15px; display: block;  font-family: myFirstFont1; font-size: 1.4rem; color: #111111; line-height: 36px; height: 36px; overflow: hidden;}
.home-blog-left-info a.bloglinks1:hover{ color: #D64851;}
.home-blog-left-info p{ line-height: 20px; height: 40px; overflow: hidden;}
.home-blog-left-info a.bloglinks2{ margin-top: 20px; display: block;}
.home-blog-left-info a.bloglinks2 img{ margin-left: 10px;}
.home-blog-left-info a.bloglinks2:hover{ color: #D64851;} 


.home-blog-right{ width: 48.5%;}
.home-blog-right dl{ width: 100%; overflow: hidden; padding: 25px 0; border-bottom:1px solid #EEEEEE;}
.home-blog-right dl:first-child{ padding-top: 0;}
.home-blog-right dl dt{ width: 28%; height: 100%;}
.home-blog-right dl dt img{ width: 100%; height: 100%;  min-height: 122px; object-fit: cover; border-radius: 6px;}
.home-blog-right dl dd{ width: 72%; padding-left: 35px;}
.home-blog-right dl dd a.bloglinks1{ margin-top: 10px; display: block;  font-family: myFirstFont1; font-size: 1.2rem; color: #111111; line-height: 30px; height: 60px; overflow: hidden;}
.home-blog-right dl dd a.bloglinks1:hover{ color: #D64851;}
.home-blog-right dl dd a.bloglinks2{ margin-top: 15px; display: block;}
.home-blog-right dl dd a.bloglinks2 img{ margin-left: 10px;}
.home-blog-right dl dd a.bloglinks2:hover{ color: #D64851;} 



.home-post{ width: 100%; height: auto; padding-bottom: 50px; margin-top: 50px; background:url(../images/homepost.jpg) no-repeat center; background-size:cover;}

.home-post-list{gap: 15px; grid-template-columns: repeat(3, 1fr); /* 3 列 */  display: grid;}
.home-post-list dl{ width: 100%; height: auto; background: #FFFFFF; box-shadow: 0px 6px 12px 1px rgba(0,48,119,0.1); border-radius: 6px; padding: 20px;}
.home-post-list dl dt{ width: 110px; height: 110px; overflow: hidden;}
.home-post-list dl dt img{ width: 110px; height: 110px; }
.home-post-list dl dd{ width: calc(100% - 110px); padding-left: 20px;}
.home-post-list dl dd a.postlinks1{display: block;  font-family: myFirstFont1; font-size: 1rem; color: #111111; line-height: 30px; height:30px; overflow: hidden;}
.home-post-list dl dd a.postlinks1:hover{ color: #D64851;}
.home-post-list dl dd p{ line-height: 20px; height: 40px; overflow: hidden;}
.home-post-list dl dd a.postlinks2{ margin-top: 10px; display: block;}

.footer-service{ padding: 30px 0;  width: 100%;}
.footer-service dl{ background: #FFFFFF; box-shadow: 0px 0px 16px 1px rgba(27,58,125,0.12); border-radius:8px; width: 24%; padding: 25px 30px;}
.footer-service dt{ width: 46px; height: 46px;}
.footer-service dd{ width: calc(100% - 46px); padding-left: 12px;}
.footer-service dd b{ display: block; font-size: 1.4rem;}
.footer-service dd em{ display: block;}






@media (max-width: 768px) {
.banner-menu{ display: none;}
.main_visual .owl-dots{ width: 100%; text-align: center; height: 4px; position:absolute; left: 0; bottom:10px;  z-index: 999; display: block; text-indent: 0;}
.main_visual .owl-dots .owl-dot{display: inline-block;  margin:0 4px;}
.main_visual .owl-dots .owl-dot span{  display: inline-block; width: 20px; height: 4px; background:#FFFFFF; border-radius: 4px;}
.main_visual .owl-dot.active span{ background:#ffbf43; }


.home-custmer{display: none;}

.footer-service{ display: none;}



.home-title{ padding:20px 0;}
.home-title h2{ font-size: 1.2rem;}
.home-title h2 img{ margin-right:10px;}
.home-title a{ display: none;}


.home-recom-left{ width: 100%; margin-bottom: 5px;}


.home-recom-right{width: 100%;  gap: 5px; grid-template-columns: repeat(1, 1fr); /* 3 列 */ }
.home-recom-item{  padding: 15px; }


.home-brand{ margin-top:30px; background-size:cover; padding-bottom:30px;}
.home-brand-list{  grid-template-columns: repeat(3, 1fr); /* 3 列 */  }
.home-brand-list a{ display: block; width: 100%; padding: 10px; border:1px solid #EEEEEE; border-bottom: none; border-left: none;}
.home-brand-list a img{ width: 100%; height: auto;}
.home-brand-list a:hover img{ filter: grayscale(100%);}
.home-brand-list a:nth-child(-n+7) {
  border-top: 1px solid #EEEEEE;
}

.home-brand-list a:nth-child(-n+3) {
  border-top: none;
}

/* 每行最后一个不显示右边框 (7,14,21,28...) */
.home-brand-list a:nth-child(7n) {
  border-right: 1px solid #EEEEEE;
}

/* 每行最后一个不显示右边框 (7,14,21,28...) */
.home-brand-list a:nth-child(3n) {
  border-right:none;
}



.home-best{gap: 5px; grid-template-columns: repeat(2, 1fr); /* 3 列 */ }


.home-about{ margin-top:30px;  padding-bottom: 30px; padding-top: 30px;}



.home-about1-left{ width:100%; height: auto; padding-right: 0;}
.home-about1-left h2{ font-size:1.4rem; line-height: 32px;  margin-top: 15px;}
.home-about1-left p{  margin-top: 10px;}
.home-about1-left a{ height: 42px; line-height: 42px; padding: 0 20px; font-size: 1rem;  margin-top: 25px;}

.home-about1-right{ width: 100%; height: auto; margin-top: 20px;}
.home-about1-right img{  border-radius:12px;}


.home-aboutnum{margin-top: 10px; gap: 10px; grid-template-columns: repeat(1, 1fr); /* 3 列 */  }


.home-blog-left{ width: 100%;}

.home-blog-left-info{ padding:20px;}
.home-blog-left-info a.bloglinks1{ margin-top: 10px;  font-size: 1.2rem; line-height: 30px; height: 30px;}
.home-blog-left-info a.bloglinks2{ margin-top: 10px; display: block;}



.home-blog-right{ width: 100%; margin-top: 15px;}
.home-blog-right dl{ padding: 15px 0; }
.home-blog-right dl dt{ width: 35%; height: 100%;}
.home-blog-right dl dt img{ width: 100%; height: 100%;  min-height: 122px; object-fit: cover; border-radius: 6px;}
.home-blog-right dl dd{ width: 65%; padding-left: 20px;}
.home-blog-right dl dd a.bloglinks1{ font-size: 1rem;  line-height: 24px; height: 48px; margin-top: 20px;}


.home-post{ padding-bottom: 30px;margin-top: 30px;}

.home-post-list{gap: 10px; grid-template-columns: repeat(1, 1fr); /* 3 列 */  }

}