.hkproj-wrap{position:relative;}
.hkproj-link{display:block; text-decoration:none;}
.hkproj-media{position:relative; border-radius:7px; overflow:hidden;}
.hkproj-img{vertical-align: middle;}
.hkproj-swiper {
	padding-bottom:70px !important;
}
.hkproj-tag{
position: absolute;
    top: 30px;
    background: #fff;
    padding: 10px 14px;
    border-radius: 0;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-size: 14px;
    color: #333;
}
.hkproj-body{padding:16px 0px 8px;}
.hkproj-title{
	margin: 0 0 8px;
    font-size: 18px !important;
    line-height: 1.25;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
	
	
}
.hkproj-excerpt{color:#555; font-size:14px; line-height:1.6; margin-bottom:12px;overflow:hidden;
text-overflow:ellipsis;
display:-webkit-box;
-webkit-box-orient:vertical;
-webkit-line-clamp:2; }
.hkproj-loc{display:flex; gap:8px; align-items:center; color:#111; font-weight:600; font-size:13px;}
.hkproj-loc-text{border-bottom:1px solid rgba(0,0,0,.2); padding-bottom:2px; text-transform:uppercase; letter-spacing:.08em;}

.hkproj-nav{position:absolute; right:0px; bottom:52px; display:flex; gap:10px; z-index:5;}

.hkproj-pagination{
    margin-top: 40px;
    display: flex;
    width: calc(100% - 150px);
 grid-gap: 10px;}

.hkproj-dot{
	  flex: 1 1 0;
background:#d8d8d8;height:4px;border-radius:8px;
}
.hkproj-dot.is-active{
background:#333;
}
.hkproj-btn{
    padding: 0 !important;
    background: #333;
    font-size: 30px !important;
    line-height: 40px;
    color: #fff !important;
    border: 0px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center;
    width: 40px !important;
    height: 40px;
    justify-content: center;
}