/* 상세보기 페이지 */
.view-wrapper {
    width: 1140px;
    margin: -30px auto 0;
}

.view-content-wrapper {
    width: 100%;
    display: flex;
    gap: 30px;
}

.view-content-left {
    width: 85%;
}

.view-content-right {
    width: 23%;
}

/* 왼쪽 영역 */
/* 상단 제목, 작성자, 작성일, 조회수 */
.view-wrapper .view-category a {
    color: #757575;
    font-size: 13px;
}

.view-header .title {
    font-size: 25px;
    font-weight: 700;
    margin: -5px 0;
    line-height: 1.5em;
}

.view-header .info {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.view-header .info .author-date-wrapper {
    display: flex;
    gap: 10px;
    color: #aaa;
}

.view-header .info .hits {
    color: #111;
    font-weight: 700;
}

/* 본문 */
.content-area .board_view_contents {
    padding: 20px 0;
    font-size: 16px;
}

/* 하단 좋아요, 댓글수, 소셜 공유 버튼 */
.view-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 10px 0;
    padding-bottom: 5px;
    border-bottom: 1px solid #ccc;
}

.like-comment-wrapper {
    display: flex;
    font-weight: 700;
}

.like-comment-wrapper .like-icon {
    padding: 5px 10px;
}

.like-comment-wrapper .comment-icon {
    padding: 5px;
}

.insight-share {
    margin-right: 5px;
}

.view-header .info .hits img,
.like-comment-wrapper .like-icon a img,
.insight-share a img {
    width: 25px;
    height: 25px;
}

.like-comment-wrapper .comment-icon img {
    width: 18px;
    height: 18px;
}


/* 추천 콘텐츠 */
.li_category {
    display: block;
} 

.rel-contents-wrapper {
    margin-bottom: 50px;
}

.rel-contents-wrapper .rel-contents {
    display: flex;
    gap: 20px;
    flex-direction: row;
    width: 100%;
    padding-top: 15px;
    margin-top: 5px;
    border-top: 1px solid #111;
    flex-wrap: wrap;
    justify-content: space-between
}

.rel-contents-wrapper .rel-contents .contents-item {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    gap: 10px;
    align-items: flex-end;
    width: 48%;
}

.rel-contents-wrapper .rel-contents .contents-item .contents-info-wrapper {
    height: 150px;
}

.rel-contents-wrapper .rel-contents .contents-item .li_tit a {
    margin-bottom: 10px;
}

.rel-contents-wrapper .rel-contents .thumb {
    width: 150px;
    height: 150px;
    border: none;
    border-radius: 8px;
}

.rel-contents-wrapper .rel-contents .contents-item .contents-info-wrapper .li_tit a {
    line-height: 1.5em;
}

.rel-contents-wrapper .rel-contents .contents-item .contents-info-wrapper .li_info span {
    color: #8f8f8f;
    font-weight: 400;
}

/* 오른쪽 영역 */
/* 배너 */
.network_view_wrap_r .bn_area {
    background: none;
    margin: 35px 0 20px;
}

.network_view_wrap_r .bn_area img {
    border-radius: 8px;
}

/* 인기 콘텐츠, 인사이트 */
.popular-contents-wrapper,
.insight-contents-wrapper {
    padding: 10px 20px;
    border: 1px solid #aaa;
    border-radius: 8px;
}

.popular-contents-wrapper .popular-contents-header,
.insight-contents-wrapper .insight-contents-header {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.popular-contents-wrapper ul li {
    display: flex;
    flex-direction: column;
    padding: 10px 0;
}

.popular-contents-wrapper ul li a.category {
    color: #757575;
    font-size: 13px;
}

.popular-contents-wrapper ul li a.title,
.insight-contents-wrapper ul li a.title {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.5em;
    max-height: 3.0em;
    word-break: break-word;
}

.insight-contents-wrapper {
    margin-top: 20px;
}

.insight-contents-wrapper ul li {
    display: flex;
    flex-direction: row;
    align-items: center;
    margin-top: 10px;
}

.insight-contents-wrapper ul li a.thumbnail img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    overflow: hidden;
    object-fit: cover;
}

.insight-contents-wrapper ul li a.title {
    margin: 0 0 10px 10px;
}
