.con-tit {display: flex; align-items: center; justify-content: space-between; margin-bottom: 15px;}
.con-tit p {font-size: 15px; color: #7b7b7b;}
.con-tit p b {color: #555; font-weight: 600;}
.con-tit ul li {display: flex; gap: 8px; align-items: center; position: relative; font-size: 15px; color: #555;}
.con-tit ul li em {width: 8px; height: 8px;}
.con-tit ul li ul {position: absolute; top: 100%; background-color: #fff; display: none;}

.con-inner {display: flex; flex-direction: column; gap: 20px;}
.con-inner .hub-con {display: flex; align-items: center; justify-content: space-between;}
.con-inner .hub-con > div {display: flex; gap: 10px;}
.con-inner .hub-con > div .hub-img {width: 97px; height: 97px; flex-shrink: 0; border-radius: 8px; overflow: hidden;}
.hub-txt {display: flex; flex-direction: column; width: calc(100% - 107px);}
.hub-txt .hub-tit {margin-top: 5px; margin-bottom: 5px;}
.hub-txt .hub-tit p {font-size: 16px; font-weight: bold; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-bottom: 2px; width: 95%;}
.hub-txt .hub-tit span {font-size: 14px; font-weight: 500; color: #555; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 95%;}
.hub-name {display: flex; align-items: center; gap: 10px;}
.hub-name li {font-size: 12px; color: #9b9b9b; font-weight: 500; display: flex; align-items: center; gap: 3px;}
.hub-name li em {width: 13px; display: inline-block;}

.hubcon {width: 90%;}
.hub-like {display: flex; flex-direction: column; align-items: center; gap: 5px; width: 10%;}
.hub-like em {width: 22px; height: 19px; background: url(../img/like.png) no-repeat center/cover;}
.hub-like em.on {width: 22px; height: 19px; background: url(../img/like_on.png) no-repeat center/cover;}
.hub-like p {font-size: 12px; color: #666;}

.board-tit {padding: 10px 20px;}
.board-tit h2 {font-size: 18px; font-weight: bold; margin: 8px 0;}
.sm-pro {display: flex; align-items: center; gap: 10px;}
em.sm-pro-img {width: 32px; height: 32px; border-radius: 50%; overflow: hidden; border: 1px solid #ddd;}
.sm-pro p {color: #666;}
.sm-pro span {color: #b8b8b8; font-size: 12px;}

.board-con2 {padding: 30px 20px; border-bottom: 6px solid #f8f8f8; font-weight: 400;}
.board-con2 p {margin-bottom: 20px; font-size: 16px; color: #555;}
.board-img-con {display: flex; flex-direction: column; gap: 10px;}
.board-like {border: 1px solid #eee; width: fit-content; display: flex; align-items: center; justify-content: center; margin: 20px auto 0 auto; padding: 15px 20px; border-radius: 50px; gap: 10px;}
.board-like em {width: 22px; height: 19px; background: url(../img/like.png) no-repeat center/cover;}
.board-like em.on {width: 22px; height: 19px; background: url(../img/like_on.png) no-repeat center/cover;}

.com-tit {display: flex; align-items: center; gap: 5px; padding: 12px 0;}
.com-tit em {width: 16px;}
.com-tit p {font-size: 15px;}

.comment ul li {padding: 11px 0; border-bottom: 1px solid #eee; display: flex; gap: 10px;}
.comment ul li:last-child {border: none;}
.comment ul li p {color: #666; margin-bottom: 5px;}
.comment ul li span {font-size: 15px; padding: 6px 0;}
.comment ul li b {font-size: 12px; color: #7a7a7a;}

.comment-input {display: flex; align-items: center; gap: 10px; box-shadow: 4px 0px 10px rgba(209 , 209, 209, .4);}
.comment-input input {width: calc(100% - 54px); background-color: #f5f5f5; border-radius: 50px; border: none !important;}
.comment-input .send {width: 44px; height: 44px; border-radius: 50%; background-color: #5F00B2; display: flex; align-items: center; justify-content: center;}
.comment-input .send i {color: #fff; font-size: 20px;}

.comment ul li.hide-com {display: none;}

/* 게시글 등록 */

.post .tab {margin-bottom: 0 !important;}
.upload {margin-bottom: 20px;}
input[type="file"] {display: none;}
.upload label {display: flex; width: 100%; padding: 15px 0; border: 1px dashed #ddd; border-radius: 5px; align-items: center; justify-content: center; gap: 5px;}
.upload label em {width: 17px;}
.upload label p {color: #555;}
.input-wrap {display: flex; flex-direction: column; gap: 18px;}
.input {display: flex; flex-direction: column; align-items: flex-start; gap: 8px;}

textarea {width: 100%; border: 1px solid #ddd; height: 150px;}

.post-btn {width: 50px; height: 50px; position: fixed; bottom: 100px; right: 20px; background-color: #5F00B2; display: flex; align-items: center; justify-content: center; border-radius: 50%;}
.post-btn em {width: 21px;}