/*==========================================================================
  Kangnam Times — 기사 상세(single)
  상단: 전체 폭 · 가운데 정렬 · 크게 / 좌측 사이드바 없음, 우측만
==========================================================================*/

/* 옛 테마의 상단 광고 여백 제거 */
body.single-post .news-view-wrap{ padding-top:40px !important; }
body.single-post .pc-post-ad-header{ display:none !important; }

/* ===== 상단 헤더 (가운데 정렬) ===== */
.article-head{ position:relative; text-align:center; background:#f4f5f7; padding:40px 20px; min-height:520px; display:flex; flex-direction:column; justify-content:center; overflow:hidden; }
.article-head > *{ position:relative; z-index:1; }
.article-head::before{ content:"江南"; position:absolute; top:50%; right:48px; transform:translateY(-50%);
  font-size:14rem; font-weight:900; color:rgba(1,23,94,.06); line-height:1; pointer-events:none; z-index:0; white-space:nowrap; }
.article-head .article-breadcrumb{ font-size:1.3rem; color:var(--np-gray); margin-bottom:18px; }
.article-head .article-breadcrumb a{ color:var(--np-gray); text-decoration:none; }
.article-head .article-breadcrumb a:hover{ color:var(--np-navy); }
.article-head .article-breadcrumb span{ margin:0 4px; }
.article-head .article-cat-label{ margin-bottom:16px; display:flex; justify-content:center; align-items:center; gap:10px; font-size:1.5rem; font-weight:700; }
.article-head .article-cat-label a{ color:var(--np-point); text-decoration:none; }
.article-head .article-cat-label a:hover{ color:var(--np-navy); }
.article-head .article-cat-label .sep{ color:var(--np-line); font-weight:400; }
.article-head h1{ font-family:'Noto Serif JP',serif !important; font-size:4rem; font-weight:900;
  line-height:1.42; color:#0e0e0e; letter-spacing:-0.01em; margin:0 auto; max-width:1040px; }
.article-head .article-meta{ display:flex; flex-wrap:wrap; justify-content:center; align-items:center;
  gap:0 18px; margin-top:20px; font-size:1.3rem; color:var(--np-gray); }
.article-head .article-meta .author a{ color:var(--np-navy); font-weight:700; }
.article-head .article-meta > * + *{ position:relative; padding-left:19px; }
.article-head .article-meta > * + *::before{ content:""; position:absolute; left:0; top:50%;
  transform:translateY(-50%); width:1px; height:11px; background:var(--np-line); }
.article-head .article-meta .views .post-views {display: inline-block; padding-left: 5px;}

/* SNS 공유 (사각 배경, 가운데) */
.article-share{ display:flex; justify-content:center; gap:8px; margin:24px 0 0; }
.article-share a{ width:40px; height:40px; border-radius:3px; display:flex; align-items:center; justify-content:center;
  background:var(--np-navy); color:#fff; font-size:1.6rem; font-weight:700; text-decoration:none; transition:background .2s; }
.article-share a:hover{ background:var(--np-point); color:#fff; }

/* ===== 본문 + 우측 사이드바 ===== */
.article-body{ border-top:1px solid var(--np-line); padding-top:34px; margin-top:10px; }
@media screen and (min-width:840px){
  .article-body{ display:flex !important; gap:48px; justify-content:flex-start !important; align-items:flex-start; }
  .article-body .left-wrap.left-696{ flex:1 1 auto; min-width:0; width:auto !important; }
  .article-body .right-sticky-wrap{ flex:0 0 324px; }
}

/* 컬러 리드문 */
.news-view .article-subtitle{ color:var(--np-navy); font-size:2rem; font-weight:700; line-height:1.6;
  margin:0 0 26px; padding-left:14px; border-left:4px solid var(--np-point); }

/* 본문 타이포 */
.news-article{ font-size:1.75rem; line-height:1.95; color:#222; }
.news-article p{ margin:0 0 1.4em; }
.news-article img{ max-width:100%; height:auto; }
.news-view p a, .news-view p strong a, .post-from p a, .author-name{ color:var(--np-navy); }

/* 공통 섹션 제목 */
.module-title{ font-size:2rem; font-weight:900; color:var(--np-navy); border-bottom:2px solid var(--np-navy);
  padding-bottom:8px; margin:44px 0 16px; position:relative; }
.module-title::after{ content:""; position:absolute; left:0; bottom:-2px; width:60px; height:2px; background:var(--np-point); }

/* 작성자 박스 (카드형: 기본이미지 + 이름 + bio, SNS 없음) */
.post-from{ margin:40px 0; }
.post-from .author-card{ display:flex; gap:18px; align-items:flex-start; padding:22px 24px; background:#f7f8fa; border-radius:6px; }
.post-from .author-thumb img{ width:64px; height:64px; border-radius:50%; object-fit:cover; background:#fff; }
.post-from .author-body{ flex:1; min-width:0; }
.post-from .author-name{ display:inline-block; font-size:1.6rem; font-weight:700; color:var(--np-navy); text-decoration:none; margin-bottom:8px; }
.post-from .author-name:hover{ text-decoration:underline; }
.post-from .author-bio{ font-size:1.4rem; line-height:1.75; color:#555; margin:0; }
.post-from .author-more{ display:inline-block; margin-top:12px; font-size:1.3rem; font-weight:700; color:var(--np-navy); text-decoration:none; }
.post-from .author-more:hover{ color:var(--np-point); }

/* 태그 (가운데 정렬 / 어두운 배경 / 라벨·# 없음) */
.tags-wrap{ display:flex; justify-content:center; flex-wrap:wrap; gap:8px; margin:34px 0 10px; }
.tags-group{ display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin:0; padding:0; list-style:none; }
.tags-group li{ background:var(--np-navy); border-radius:2px; }
.tags-group li a{ display:inline-block; padding:7px 15px; font-size:1.25rem; font-weight:500; color:#fff; text-decoration:none; }
.tags-group li:hover{ background:var(--np-point); }
.tags-group li::before{ content:none !important; }

/* 댓글 (데모식) */
.comment-wrap{ margin-top:44px; }
.comment-wrap .total-count{ display:block; font-size:1.7rem; font-weight:700; color:#111; letter-spacing:.02em; margin-bottom:16px; }
.comment-box .write-comment{ position:relative; border:1px solid var(--np-line); border-radius:4px; padding:16px; }
.comment-box .write-comment .name-input{ display:block; width:100%; border:none; border-bottom:1px solid var(--np-line);
  padding:8px 0; font-size:1.4rem; margin-bottom:12px; outline:none; }
.comment-box .write-comment .write-comment-area{ display:block; width:100%; min-height:120px; border:none; resize:vertical;
  font-size:1.5rem; line-height:1.65; outline:none; }
.comment-box .absolute-box{ position:static !important; display:flex; align-items:center; justify-content:flex-end; gap:14px; margin-top:12px; width:auto; height:auto; }
.comment-box .absolute-box #comment_length{ color:var(--np-gray); font-size:1.3rem; }
.comment-box .absolute-box button{ width:auto !important; min-width:0 !important; height:auto !important;
  line-height:1.2; white-space:nowrap; background:var(--np-navy); color:#fff; border:none;
  padding:11px 28px; font-weight:700; font-size:1.4rem; border-radius:3px; cursor:pointer; }
.comment-box .absolute-box button:hover{ background:var(--np-point); }
.comment-list{ margin-top:24px; list-style:none; padding:0; }
.comment-list li{ border-bottom:1px solid var(--np-line); padding:18px 0; }
.comment-list .from{ display:flex; align-items:center; gap:10px; }
.comment-list .from .user{ font-weight:700; color:#222; font-size:1.45rem; }
.comment-list .from time{ color:var(--np-gray); font-size:1.2rem; }
.comment-list .comment{ margin-top:8px; color:#333; font-size:1.5rem; line-height:1.65; }
.more-view-btn{ display:block; width:100%; margin-top:18px; padding:13px; border:1px solid var(--np-line);
  background:#fff; color:var(--np-navy); font-weight:700; cursor:pointer; }
.more-view-btn:hover{ background:var(--np-navy); color:#fff; }


/* ---- 관련 랭킹(card-type6) : 3열 그리드 ---- */
.related-block{ margin-top:10px; }
.related-block .card-box{ display:grid !important; grid-template-columns:repeat(3,1fr); gap:22px;
  list-style:none; margin:0; padding:0; width:auto !important; }
.related-block .up-down-card{ display:flex; flex-direction:column; border:none; margin:0; padding:0; width:auto !important; }
.related-block .up-down-card .img-box{ position:relative; width:100%; aspect-ratio:16/10; overflow:hidden;
  background:#eee; margin-bottom:10px; height:auto !important; }
.related-block .up-down-card .img-box img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transform:none; transition:transform .4s ease; }
.related-block .up-down-card:hover .img-box img{ transform:scale(1.07); }
.related-block .up-down-card .title {font-size:1.6rem; font-weight:700; line-height:1.4; color:#141414; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}

/* 모바일 */
@media screen and (max-width:840px){
  .article-head h1{ font-size:2.6rem; }
  .article-body{ display:block; }
  .related-block .card-box{ grid-template-columns:1fr 1fr; }
}
