@charset "UTF-8";
.project-header{width:100%;}
.ph-inner{display:flex;align-items:center;border-bottom:1px solid #ddd;}
.ph-inner .title-box .title{font-size:20px;color:#333}
.ph-inner .search-box{margin-left:auto;padding:15px 0}
.ph-inner .form-control{border-radius:14px;border-color:#b3b3b3;width:280px;height:30px;border-right:0}
#project_search_btn{height:30px;border:1px solid #b3b3b3;border-left:0;box-shadow:none;color:#aaa;border-radius:0 14px 14px 0}

.project-header.is_stuck{z-index:10;background-color:#fefefe;box-shadow: 0 2px 8px 0 rgb(0 0 0 / 6%);}
.project-header.is_stuck .ph-inner{border-bottom-color:transparent}

.project-foci{padding:20px 0 6px}
.project-foci .swiper-container{position:relative}
.project-foci .swiper-container:after{content:'';position:absolute;background-color:#d82d2d;height:1px;width:570px;overflow:hidden;z-index:1;bottom:0;right:0}
.project-foci .swiper-container:before{content :"";position :absolute;background-color :#d82d2d;height :6.23px;width :550px;overflow :hidden;z-index:2;right:0;top:0}
.project-foci .swiper-slide .inner-box{display:flex;}
.project-foci .swiper-slide .inner-box .art-thumb{width:570px;height:300px;border-radius:4px 0 0 4px;}
.project-foci .swiper-slide .inner-box .cons{width:570px;height:300px;display:inline-flex;flex-direction:column;padding:47px 30px 25px 40px;position:relative}
.project-foci .swiper-slide .inner-box .cons .title-box .title{font-size:20px;line-height:28px;color:#2d3f56;max-height:56px;font-weight:400;margin-bottom:18px}
.project-foci .swiper-slide .inner-box .cons .remark{color:#9b9b9b;line-height:24px}
.project-foci .swiper-slide .inner-box .cons .plus{margin-top:auto;text-align:right;}
.project-foci .swiper-slide .inner-box .cons .plus .tags{display:inline-flex;align-items:center;}
.project-foci .swiper-slide .inner-box .cons .plus .tags a{margin-left:18px}
.project-foci .swiper-pagination{bottom:0;padding:0 12px;display:inline-flex;justify-content:start}
.project-foci .progress-wrapper{width:36px;height:20px;position: relative;background-color:transparent;overflow:hidden;border-radius:0;opacity:.5;margin:0 8px 0 0;}
.project-foci .progress-wrapper:hover{opacity:1}
.project-foci .progress-wrapper .bg{background-color:rgba(255,255,255,.6);position:absolute;left:0;right:0;top:9px;bottom:8px;z-index:0;border-radius:3px;overflow:hidden;box-shadow:0 2px 2px rgba(0,0,0,.3)}
.project-foci .progress-wrapper .solid{position:absolute;left:0;top:9px;bottom:8px;background-color:#e63030;width:0;z-index:1;border-radius:3px;overflow:hidden}
.project-foci .swiper-pagination-bullet-active{background-color:transparent;opacity:1}
.project-foci .swiper-pagination-bullet-active .solid{width:36px;transition:width 9.5s linear}

.art-cards{display:flex;flex-wrap:wrap;width:1160px;margin:0 -10px}
.art-cards .art-item{padding:10px;width:290px;flex:0 0 auto;}
.art-cards .art-item.colspan-2{width:580px}
.art-cards .art-item .art-item-inner{transition:all .3s ease;box-shadow:0 2px 8px 0 rgb(0 0 0 / 5%);border-radius:4px;overflow:hidden;position:relative;background-color:#fff}
.art-cards .art-header{position:relative;}
.art-cards .art-header .tag-link{position:absolute;top:8px;left:8px}
.art-cards .art-header .tag-link:hover .tag-label{background-color:rgba(0,0,0,.8);transition:all .3s}
.art-cards .art-thumb{height:145px;transition:height .4s}
.art-cards .art-main{padding:16px 20px 30px;position:relative;overflow:hidden}
.art-cards .art-title-box{padding-bottom:26px;transition:padding-bottom .4s}
.art-cards .art-title{font-size:16px;line-height:25px;color:#2D3F56;height:75px;overflow:hidden;font-weight:400}
.art-cards .art-item .art-tags{height:21px;overflow:hidden}
.art-cards .art-item .art-tags .tag-label{background-color:transparent;color:#2D3F56;padding:0;border-radius:0;font-size:13px}
.art-cards .art-item .art-tags .tag-link:not(:last-child){margin-right:1em}

.art-cards .art-item:not(.colspan-2):hover .art-item-inner{box-shadow:0 8px 8px 0 rgb(0 0 0 / 8%);border-radius:6px;transition:all .3s}
.art-cards .art-item:not(.colspan-2):hover .art-thumb{height:155px;transition:height .4s}
.art-cards .art-item:not(.colspan-2):hover .art-title-box{padding-bottom:16px;transition:padding-bottom .4s}

.art-cards .art-item.colspan-2 .art-tags{display:none}
.art-cards .art-item.colspan-2 .art-item-inner,
.art-cards .art-item.colspan-2 .art-header,
.art-cards .art-item.colspan-2 .art-thumb{height:313px}
.art-cards .art-item.colspan-2 .art-thumb{background-position:top center!important;background-size:contain}
.art-cards .art-item.colspan-2 .art-main{position:absolute;bottom:0;left:0;right:0;background-color:#2d3f56;padding:0 1em}
.art-cards .art-item.colspan-2 .art-title-box{padding:11px 0}
.art-cards .art-item.colspan-2 .art-title{text-align:center;color:#fff;height:25px;}

.project-body{padding:0 0 60px}

#loader{text-align:center;visibility:hidden;opacity:0;height:1px;overflow:hidden;transition:all .3s;}
#loader.active{visibility:visible;opacity:1;height:50px;transition:all .3s}

#page_pagination{padding:20px 0 30px;text-align:center;display:flex;align-items:center;justify-content:center}
#page_pagination .pagination{}
#page_pagination .page-item .page-link{
    margin:0 2px;
    color:#999;
    border-radius:6px;
    font-size: 14px;
    width: 46px;
    height: 42px;
    line-height: 14px;
    text-align: center;
    vertical-align: middle;
    padding: 14px 0;
    border-color:#e0e0e0
}
#page_pagination .page-item.active .page-link{background-color:#e6302f;border-color:#e6302f;color:#fff}
.jumpto{
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    margin-left: 40px;
    color: #999;
}
#jump_to_value{width:45px;height:45px;font-size: 13px; line-height: 13px;text-align: center;vertical-align: middle;padding: 15px 0;border-radius:6px;border:1px solid #e0e0e0;margin:0 10px}
.jump-handle{color:#c1c1c1;background-color:#fff;border:0;margin-left:20px}