/* list */
.bbs-list {}
.bbs-list h3{font-size: 35px;font-weight: 700;line-height:1.2; margin:100px 0 70px 0;color:#000;}
.bbs-list .wrap {}
.bbs-list .bbs-post {
    display:flex; align-items: center; color:#777; border-bottom:1px solid #ccc; padding:45px 30px;
    background:#fff; transition:all 300ms;
}
.bbs-list .bbs-post:first-child{border-top:2px solid #333;}
.bbs-list .bbs-post > div {}
.bbs-list .bbs-post .date {flex:0 0 auto; width:10%; margin-right:20px;}
.bbs-list .bbs-post .date .fs-18{color: #2599B2;font-weight: 600;}
.bbs-list .bbs-post .subject {flex:1;}
.bbs-list .bbs-post .subject a {display:flex; justify-content:space-between;}
.bbs-list .bbs-post .subject div {word-break: keep-all;}
.bbs-list .bbs-post .subject div .fs-20{font-weight: 600;}
.bbs-list .bbs-post .more{flex-shrink:0; width:100px; display:flex; justify-content:flex-end; align-items:center;}
.bbs-list .bbs-post .more a{font-size:0; width:60px; height:60px; border-radius:100%; background:#1d1d1d; position:relative; transition:all ease 0.8s;}
.bbs-list .bbs-post .more a:before, .bbs-list .bbs-post .more a:after{content:''; position:absolute; margin:auto; top:0; right:0; bottom:0; left:0; background:#fff;}
.bbs-list .bbs-post .more a:before{width:40%; height:1px;}
.bbs-list .bbs-post .more a:after{width:1px; height:40%;}
.bbs-list .bbs-post:hover .more a{transform: rotate( 180deg );}
.bbs-list .bbs-post .arr {flex-shrink:0; width:140px; display:flex; justify-content:flex-end; align-items:center;}
.bbs-list .bbs-post .arr i {
    width:45px; height:45px; display:flex; justify-content: center; align-items: center;
    border-radius:100%; transition:all 300ms;
}
.bbs-list .bbs-post:hover {background:#fbfbfb;box-shadow: 5px 5px 10px 0px rgba(0, 0, 0, 0.10);}


.pp{font-family: Poppins;}
.bbs-list-footer{margin-bottom:100px;}
.btn-success{background-color:#2599B2;border-color:#2599B2;}

@media(max-width:1180px){

}

@media(max-width:820px){
    .bbs-list .bbs-post .date {width:100px;}
   
}
@media(max-width:425px){
    .bbs-list .bbs-post {flex-wrap:wrap;}
    .bbs-list .bbs-post .date {
        width:100%; display:flex; flex-direction: row-reverse; justify-content: flex-end; margin-bottom:10px;
    }
    .bbs-list .bbs-post .date > div {font-size:18px;}
    .bbs-list .bbs-post .date > div:first-child {margin-left:4px; position:relative;}
    .bbs-list .bbs-post .date > div:first-child:before {content:'.'; width:1px; position:absolute; left:-4px;}
    .bbs-list .bbs-post .more {display:none;}

}