/* 幻灯区 */
	
.by-home-banner {
    background: #fff;
    padding: 16px 15px 15px 15px;
}
.by-home-banner-swiper {
	border-radius: 4px;
    overflow: hidden;
}
.by-home-banner-swiper img {
    display: block;
    width: 100%;
    height: 90px;
    object-fit: cover
}
.by-home-banner .swiper-pagination-bullet {
    width: 6px;
    height: 6px;
    background: #eee;
    opacity: .6
}
.by-home-banner .swiper-pagination-bullet-active {
    width: 6px;
    border-radius: 8px;
    background: #fff;
    opacity: 1
}

/* 金刚区 */
	
.by-home-grid {
    background: #fff;
    padding: 5px 15px 23px 15px;
}
.by-home-grid-list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px 30px;
}
.by-home-grid-item {
    display: flex;
	gap: 3px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #333;
    text-decoration: none;
    transition: .2s;
}
.by-home-grid-icon {
    width: 55px;
    height: 55px;
    border-radius: 50px;
    background: #E8F7F1;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 23px;
    margin-bottom: 6px;
    transition: .2s;
}

/* 资讯 - 蓝色 */
.by-home-grid-list .by-home-grid-item:nth-child(1) .by-home-grid-icon {
    background: #5fc2f1;
}

/* 招聘 - 红色 */
.by-home-grid-list .by-home-grid-item:nth-child(2) .by-home-grid-icon {
    background: #ff5455;
}

/* 租房 - 橙色 */
.by-home-grid-list .by-home-grid-item:nth-child(3) .by-home-grid-icon {
    background: #67d230;
}

/* 黄页 - 紫色 */
.by-home-grid-list .by-home-grid-item:nth-child(4) .by-home-grid-icon {
    background: #ef862d;
}

/* 二手 - 绿色 */
.by-home-grid-list .by-home-grid-item:nth-child(5) .by-home-grid-icon {
    background: #ad5dff;
}

/* 美食 - 粉色 */
.by-home-grid-list .by-home-grid-item:nth-child(6) .by-home-grid-icon {
    background: #EC605c;
}

/* 工具 - 青色 */
.by-home-grid-list .by-home-grid-item:nth-child(7) .by-home-grid-icon {
    background: #319df3;
}

/* 论坛 - 深灰蓝 */
.by-home-grid-list .by-home-grid-item:nth-child(8) .by-home-grid-icon {
    background: #64748B;
}

.by-home-grid-item span {
    font-size: 16px;
    white-space: nowrap;
}
.by-home-grid-item:active {
    transform: scale(.95);
}
.by-home-grid-item:hover .by-home-grid-icon {
    background: #20c057;
    color: #fff;
}
/*======================
 home-service
======================*/
.home-service {
    width: 100%;
    background: #fff;
    padding: 16px 15px 22px 15px;
    margin-top: 15px;
}
.home-service-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}
.home-service-title {
    display: flex;
    align-items: center;
    gap: 11px;
}
.home-service-title b {
    position: relative;
    font-size: 19px;
    font-weight: 700;
}
.home-service-tip {
    padding: 2px 8px;
    font-size: 13px;
    color: #20c057;
    background: #eafaf0;
    border-radius: 2px;
}
.home-service-more {
    display: flex;
    align-items: center;
    gap: 4px;
    text-decoration: none;
    color: #333;
    font-size: 15px;
    transition: .2s;
}
.home-service-more i {
    font-size: 14px;
    color: #999;
    transition: .2s;
}
.home-service-top {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 7px;
}
.home-service-card {
    display: block;
    text-decoration: none;
    text-align: center;
    color: #222;
    overflow: hidden;
    padding-top: 14px;
    padding-bottom: 3px;
    background: linear-gradient(to bottom, #eefaf2 0%, #f5f4f5 65%);
    transition: .2s;
}

.home-service-card-title {
    font-size: 17px;
    margin-bottom: 6px;
}
.home-service-card-img {
    width: 100%;
    height: 80px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    overflow: hidden;
}
.home-service-card-img img {
    width: auto;
    height: 80px;
    object-fit: contain;
}
.home-service-list {
    padding-top: 20px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 19px 7px;
}
.home-service-item {
    text-decoration: none;
    text-align: center;
    color: #222;
    font-size: 17px;
    transition: .2s;
}

.home-service-item.orange {
    color: #20c057;
    font-weight: 500;
}
/*======================
 home-news
======================*/
.home-news {
    max-width: 640px;
    margin: 15px auto 80px auto;
    background: #fff;
}
.home-news-tabs {
    display: flex;
    overflow: auto;
    white-space: nowrap;
    border-bottom: 1px solid #eee
}
.home-news-tabs a {
    flex: 1;
	font-size: 18px;
    padding: 14px 0;
    text-decoration: none;
    text-align: center;
}
.home-news-tabs a.cur {
    color: #20c057;
    font-weight: 700;
    border-bottom: 3px solid #20c057
}
.home-news-panel {
    display: none
}
.home-news-panel.active {
    display: block
}
.home-news-list {
    list-style: none
}
.home-news-list li {
    border-bottom: 1px solid #eee
}
.home-news-list a {
    display: flex;
    padding: 16px;
    gap: 12px;
    text-decoration: none;
    color: #222
}
.home-news-left {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0
}
.home-news-title {
    font-size: 18px;
    line-height: 1.45;
    height: 52px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
}
.home-news-meta {
    margin-top: auto;
    font-size: 14px;
    color: #999
}
.home-news-meta span:first-child {
    margin-right: 12px
}
.home-news-thumb {
    width: 120px;
    height: 84px;
    border-radius: 4px;
    overflow: hidden;
    flex: none
}
.home-news-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover
}
.home-news-loading {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 62px;
    color: #888;
    gap: 8px;
	padding-bottom: 10px;
}
.home-news-loading.loading:before {
    content: "";
    width: 16px;
    height: 16px;
    border: 2px solid #ddd;
    border-top-color: #20c057;
    border-radius: 50%;
    animation: r .8s linear infinite
}
@keyframes r {
to {
transform:rotate(360deg)
}
}