/* ================= 글쓰는여자 - 공개 사이트 ================= */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;color:#1a1a1a;background:#fff;font-size:16px;line-height:1.5;word-break:keep-all;overflow-wrap:break-word}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
h1,h2,h3,p,ul,ol{margin:0}
ul,ol{list-style:none;padding:0}
.wrap{width:100%;max-width:1240px;margin:0 auto;padding:0 20px}
.clamp2,.hl-sub h3,.cell.card strong,.t-latest strong,.side-hot strong,.photo-news strong,.v-photo strong{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}

/* ---------- 헤더 ---------- */
.topbar{display:flex;justify-content:space-between;align-items:center;height:56px}
.today{color:#666;font-size:16px;font-weight:500}
.top-right{display:flex;align-items:center;gap:12px;font-size:15px;color:#777}
.top-right a:hover{color:#111}
.search-toggle{display:flex;align-items:center;gap:4px;color:#111;font-size:16px;margin-right:12px}
.search-panel{background:#f6f6f6;border-top:1px solid #eee;border-bottom:1px solid #eee;padding:16px 0}
.search-panel form{display:flex;gap:8px}
.search-panel input{flex:1;height:46px;border:1px solid #ccc;padding:0 16px;font:inherit;font-size:16px;border-radius:4px}
.search-panel button{height:46px;padding:0 26px;background:#111;color:#fff;border-radius:4px;font-weight:600}
.logo-area{display:flex;justify-content:center;align-items:center;height:172px}
.logo{margin:0;font-size:0}
.logo img{height:110px;width:auto;max-width:min(420px,90vw);object-fit:contain}
.gnb{border-top:1px solid #000;border-bottom:3px solid #000;background:#fff}
.gnb .wrap{display:flex;align-items:center;height:58px;gap:20px}
.menu-toggle{display:flex;padding:6px 10px 6px 16px;color:#222}
.gnb ul{display:flex;gap:30px;overflow-x:auto;scrollbar-width:none;padding-left:14px}
.gnb ul::-webkit-scrollbar{display:none}
.gnb a{font-size:16px;font-weight:500;color:#222;white-space:nowrap;padding:16px 0;position:relative}
.gnb a:hover,.gnb a.on{color:#000;font-weight:700}
.gnb a.on::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;background:#d4708a}

/* 전체메뉴 */
.allmenu{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:100}
.allmenu-inner{background:#fff;max-width:100%;padding-top:24px;padding-bottom:36px}
.allmenu-head{display:flex;justify-content:space-between;align-items:center;border-bottom:3px solid #000;padding-bottom:16px;margin-bottom:24px}
.allmenu-head img{width:150px}
.allmenu-cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:14px 24px;font-size:19px;font-weight:700;margin-bottom:28px}
.allmenu-cats a:hover{color:#d4708a}
.allmenu-pages{display:flex;flex-wrap:wrap;gap:8px 20px;font-size:14px;color:#666;border-top:1px solid #eee;padding-top:18px}

.site-main{min-height:50vh;padding-bottom:80px}

/* 공통 썸네일 */
.th{display:block;overflow:hidden;background:#f2f2f2;position:relative}
.th img{width:100%;height:100%;object-fit:cover;transition:transform .35s}
a:hover .th img,.th:hover img{transform:scale(1.04)}
.noimg{display:flex!important;align-items:center;justify-content:center;width:100%;height:100%;background:#f7f2f4}
.noimg img{width:46%!important;height:auto!important;object-fit:contain!important;opacity:.55}

/* ---------- 메인: 헤드라인 ---------- */
.headline{display:grid;grid-template-columns:minmax(0,810fr) minmax(0,345fr);gap:44px;padding-top:32px}
.hl-main .th{aspect-ratio:16/9}
.cat-line{display:flex;align-items:center;justify-content:center;gap:12px;margin:18px 0 10px;color:#8a7461;font-size:14px;font-weight:500}
.cat-line::before,.cat-line::after{content:"";width:95px;height:1px;background:#999}
.hl-main h2{text-align:center;font-size:21px;font-weight:700;line-height:1.45;padding:0 20px}
.hl-main p{text-align:center;color:#666;font-size:15px;line-height:1.6;margin:12px auto 0;max-width:740px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.hl-main:hover h2,.hl-sub:hover h3{text-decoration:underline;text-underline-offset:3px}
.hl-side{display:flex;flex-direction:column;gap:30px}
.hl-sub .th{aspect-ratio:16/9}
.hl-sub h3{font-size:16px;font-weight:700;line-height:1.5;margin:14px 0 10px}
.hl-sub p{font-size:14px;color:#666;line-height:1.6;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}

/* ---------- 메인: 슬라이더 ---------- */
.slider{position:relative;margin-top:56px}
.slides{background:#555;padding:40px 80px;position:relative;min-height:400px}
.slide{display:none;grid-template-columns:minmax(0,572fr) minmax(0,440fr);gap:32px;align-items:center}
.slide.on{display:grid;animation:fade .5s}
@keyframes fade{from{opacity:.3}to{opacity:1}}
.slide .th{aspect-ratio:16/9}
.slide .txt{display:flex;flex-direction:column;gap:14px;color:#fff}
.slide em{font-style:normal;color:#ffe100;font-weight:700;font-size:17px}
.slide strong{font-size:22px;line-height:1.45;font-weight:700}
.slide .txt>span{font-size:15px;line-height:1.65;color:#e2e2e2;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden}
.sl-prev,.sl-next{position:absolute;top:50%;transform:translateY(-50%);color:#fff;padding:10px;opacity:.85}
.sl-prev{left:28px}.sl-next{right:28px}
.sl-prev:hover,.sl-next:hover{opacity:1}

/* ---------- 메인: 카테고리 블록 ---------- */
.cat-blocks{display:grid;grid-template-columns:1fr 1fr;gap:56px 16px;margin-top:40px}
.cat-block{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.cell{aspect-ratio:1/1;border:1px solid #333;display:flex;flex-direction:column;overflow:hidden;background:#fff}
.cat-tile{padding:24px 16px}
.cat-tile strong{font-size:19px;font-weight:700}
.cat-tile.dark{background:#333;color:#fff;border-color:#333}
.cat-tile:hover strong{text-decoration:underline;text-underline-offset:4px}
.cell.card .th{height:57%;flex:none}
.cell.card strong{padding:14px 16px 0;font-size:17px;font-weight:700;line-height:1.6;-webkit-line-clamp:3}
.cell.card:hover strong{text-decoration:underline}

/* ---------- 메인: 3단 ---------- */
.triple{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:40px;padding-bottom:40px}
.tcol{border-top:2px solid #333;padding-top:26px}
.tcol h2{font-size:20px;font-weight:700;margin-bottom:20px}
.t-latest li+li{margin-top:18px}
.t-latest a{display:grid;grid-template-columns:100px 1fr;gap:12px;align-items:start}
.t-latest .th{aspect-ratio:100/57}
.t-latest strong{font-size:15px;font-weight:600;line-height:1.5}
.t-popular li+li{margin-top:32px}
.t-popular a{display:block;background:#f0f0f0;border-radius:24px;padding:12px 16px;font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.t-popular a:hover{background:#e6e6e6}
.t-column li+li{margin-top:32px}
.t-column a{display:grid;grid-template-columns:40px 1fr;align-items:start}
.t-column .num{font-size:17px;font-weight:700;color:#777;padding-left:2px}
.t-column strong{font-size:15px;font-weight:600;line-height:1.5}
.t-latest a:hover strong,.t-column a:hover strong{text-decoration:underline}

/* ---------- 메인: 포토뉴스 ---------- */
.photo-news{padding-top:36px;background:linear-gradient(#e5e5e5,#e5e5e5) no-repeat 20px 0/calc(100% - 40px) 1px}
.photo-news h2{font-size:20px;font-weight:700;margin-bottom:20px}
.photo-news ul{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.photo-news .th{aspect-ratio:3/2}
.photo-news .badge{position:absolute;left:0;top:0;z-index:1;background:#e2343f;color:#fff;font-size:14px;font-weight:700;width:28px;height:28px;display:flex;align-items:center;justify-content:center}
.photo-news strong{margin-top:12px;font-size:15px;font-weight:600;line-height:1.5}
.photo-news a:hover strong{text-decoration:underline}

/* ---------- 2단 레이아웃 (목록/기사) ---------- */
.two-col{display:grid;grid-template-columns:minmax(0,1fr) 318px;gap:58px;padding-top:36px}
.list-page .main-col,.static-page .main-col{padding-left:32px}
.list-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:40px;gap:16px;flex-wrap:wrap}
.list-head h1{font-size:30px;font-weight:700}
.view-toggle{display:flex;background:#f5f5f7;border-radius:8px;padding:4px;gap:2px}
.view-toggle a{display:flex;align-items:center;gap:6px;font-size:13px;color:#555;padding:8px 14px;border-radius:6px}
.view-toggle a.on{background:#fff;color:#2f6fe4;box-shadow:0 1px 3px rgba(0,0,0,.1)}
.search-info{margin:-20px 0 24px;color:#555}

.v-summary article{display:grid;grid-template-columns:210px 1fr;gap:24px;padding-bottom:24px;margin-bottom:24px;border-bottom:1px solid #e5e5e5}
.v-summary .th{aspect-ratio:3/2}
.v-summary h2{font-size:19px;font-weight:600;line-height:1.45;margin-bottom:10px}
.v-summary h2 a:hover{text-decoration:underline}
.v-summary .desc{display:block;font-size:14px;line-height:1.6}
.v-summary .sub{display:block;color:#555;margin-bottom:12px}
.v-summary .sum{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;color:#666}
.v-summary .date{display:block;margin-top:18px}
.date{font-size:13px;color:#999}
.v-title li{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:16px 4px;border-bottom:1px solid #eee}
.v-title li:first-child{border-top:2px solid #333}
.v-title strong{font-size:16px;font-weight:600}
.v-title a:hover strong{text-decoration:underline}
.v-title .date{white-space:nowrap}
.v-photo{display:grid;grid-template-columns:repeat(3,1fr);gap:28px 20px}
.v-photo .th{aspect-ratio:3/2;margin-bottom:12px}
.v-photo strong{font-size:16px;font-weight:600;line-height:1.5;margin-bottom:6px}
.empty-list{padding:60px 0;text-align:center;color:#888;border-top:1px solid #eee;border-bottom:1px solid #eee}

.pager{display:flex;justify-content:center;gap:6px;margin-top:48px}
.pager a,.pager span{min-width:38px;height:46px;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600;color:#555;border:1px solid #e5e5e5}
.pager .on{background:#4a90e2;color:#fff;border-color:#4a90e2}
.pager a:hover{border-color:#4a90e2;color:#4a90e2}

/* 사이드바 */
.sidebar{padding-top:8px}
.side-box+.side-box{margin-top:64px}
.side-title{font-size:23px;font-weight:700;padding-bottom:20px;border-bottom:2px solid #222;margin-bottom:24px}
.side-hot li{padding-bottom:16px;margin-bottom:16px;border-bottom:1px solid #e5e5e5}
.side-hot li:last-child{border-bottom:0}
.side-hot a{display:grid;grid-template-columns:120px 1fr;gap:16px;align-items:center}
.side-hot .th{aspect-ratio:4/3}
.side-hot strong{font-size:15px;font-weight:600;line-height:1.55}
.side-rank li+li{margin-top:18px}
.side-rank a{display:grid;grid-template-columns:32px 1fr;gap:12px;align-items:start}
.side-rank .num{width:32px;height:32px;border-radius:6px;background:#fbb928;color:#fff;font-size:14px;font-weight:700;display:flex;align-items:center;justify-content:center}
.side-rank strong{font-size:15px;font-weight:600;line-height:1.5}
.side-hot a:hover strong,.side-rank a:hover strong{text-decoration:underline}
.sidebar .empty{color:#999;font-size:14px}

/* ---------- 기사 상세 ---------- */
.article-page{padding-top:40px}
.draft-notice{background:#fff7e0;border:1px solid #f2d27a;padding:12px 16px;margin-bottom:24px;font-size:14px}
.draft-notice a{text-decoration:underline;font-weight:600}
.crumb{display:flex;gap:8px;font-size:13px;color:#888;margin-bottom:14px}
.crumb span{color:#bbb}
.crumb .cur{color:#222;font-weight:600}
.art-head h1{font-size:40px;font-weight:700;line-height:1.35;letter-spacing:-.5px;margin-bottom:34px}
.art-meta{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-bottom:24px;border-bottom:1px solid #e5e5e5;flex-wrap:wrap}
.art-meta .left{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:14px;color:#666}
.art-meta .left span{display:flex;align-items:center;gap:6px}
.art-meta .left b{font-weight:600;color:#555}
.art-meta .bar{color:#ccc;margin:0 6px}
.tools{display:flex;gap:26px;color:#555}
.tools button:hover{color:#000}
.sns{display:flex;gap:8px;padding:16px 0;border-bottom:1px solid #e5e5e5}
.sns button{width:40px;height:40px;display:flex;align-items:center;justify-content:center;color:#fff}
.s-fb{background:#1877f2}.s-x{background:#000}.s-kakao{background:#fee500;color:#191919!important}.s-naver{background:#03c75a}.s-in{background:#0a66c2}.s-link{background:#5b9be6}
.sns button:hover{filter:brightness(.92)}
.article-page .two-col{padding-top:0}
.art-col{border-right:1px solid #eee;padding:48px 42px 0 16px}
.article-page .sidebar{padding-top:48px}
.art-sub{font-size:18px;font-weight:500;line-height:1.7;border-left:3px solid #222;padding:2px 0 2px 24px;margin-bottom:80px}
.art-content{font-size:18px;line-height:2;color:#222}
.art-content p{margin:0 0 1.6em}
.art-content h3{font-size:22px;font-weight:700;line-height:1.5;margin:2.2em 0 1em}
.art-content h4{font-size:19px;font-weight:700;margin:1.8em 0 .8em}
.art-content ul,.art-content ol{padding-left:1.4em;margin:0 0 1.6em}
.art-content ul{list-style:disc}.art-content ol{list-style:decimal}
.art-content li{margin-bottom:.6em}
.art-content blockquote{margin:1.6em 0;padding:18px 24px;background:#f7f7f7;border-left:4px solid #d4708a;font-size:17px}
.art-content img{height:auto;margin:0 auto}
.art-content figure{margin:2em 0;text-align:center}
.art-content figcaption{font-size:14px;color:#777;margin-top:10px;line-height:1.6}
.art-content a{color:#2f6fe4;text-decoration:underline}
.art-content hr{border:0;border-top:1px solid #ddd;margin:2em 0}
.art-content iframe{max-width:100%}
.art-content table{border-collapse:collapse;width:100%;margin:1.6em 0;font-size:15px}
.art-content th,.art-content td{border:1px solid #ddd;padding:8px 10px}
.art-tags{display:flex;flex-wrap:wrap;gap:8px;margin:40px 0 24px}
.art-tags a{background:#f3f3f3;border-radius:20px;padding:6px 14px;font-size:14px;color:#444}
.art-tags a:hover{background:#e9e9e9}
.reporter{display:flex;align-items:center;gap:16px;padding:20px 0;border-top:1px solid #e5e5e5;border-bottom:1px solid #e5e5e5;font-size:15px}
.reporter .r-logo{width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#f7e6eb;color:#c25d7a}
.reporter .r-logo svg{width:26px;height:26px}
.reporter a{color:#666;margin-left:8px}
.related{margin-top:36px}
.related h3{font-size:18px;font-weight:700;margin-bottom:14px}
.related li{font-size:15px;padding:6px 0 6px 16px;position:relative}
.related li::before{content:"•";position:absolute;left:0;color:#999}
.related a:hover{text-decoration:underline}
body.fs-1 .art-content{font-size:20px}
body.fs-2 .art-content{font-size:22px}
body.fs-3 .art-content{font-size:16px}

.static-body{font-size:16px;line-height:1.9}

.empty-home{padding:120px 20px;text-align:center;color:#666}
.empty-home .btn,.btn{display:inline-block;margin-top:20px;background:#111;color:#fff;padding:12px 24px;border-radius:4px}

.toast{position:fixed;left:50%;bottom:40px;transform:translateX(-50%);background:rgba(0,0,0,.85);color:#fff;padding:12px 22px;border-radius:24px;font-size:14px;z-index:200}

/* ---------- 푸터 ---------- */
.site-footer{background:#f8f8f8;padding-top:40px;font-size:14px}
.foot-links{display:flex;flex-wrap:wrap;gap:8px 30px;padding:0 20px 36px 20px;margin:0}
.foot-links a{font-size:15px;font-weight:500;color:#1a1a1a}
.foot-links a.strong{font-weight:700}
.foot-links a:hover{text-decoration:underline}
.foot-logo{display:inline-block;margin-left:20px;background:#fff;padding:10px}
.foot-logo img{width:auto;height:56px}
.foot-info{display:flex;flex-wrap:wrap;gap:10px 0;margin:46px 20px 0;color:#555}
.foot-info li{padding-right:14px;margin-right:14px;border-right:1px solid #ccc;line-height:1}
.foot-info li:last-child{border-right:0}
.foot-copy{margin:62px 20px 0;color:#777;font-size:13px;line-height:1.8}
.foot-bottom{display:flex;justify-content:space-between;padding-top:56px;padding-bottom:36px;color:#777;font-size:14px}

/* ---------- 배너 ---------- */
.banner-slot{display:grid;grid-template-columns:repeat(var(--bn,1),minmax(0,1fr));gap:16px;margin-top:32px}
.banner-slot a,.banner-slot span{display:block;overflow:hidden}
.banner-slot img{width:100%;height:auto}
.banner-slot a:hover img{opacity:.92}
.banner-all-top{margin-top:24px}
.banner-home-middle{margin-top:48px;margin-bottom:-8px}
.banner-home-bottom{margin-top:48px}
.banner-sidebar{grid-template-columns:1fr;margin:0 0 48px}
.banner-article-bottom{grid-template-columns:1fr;margin:32px 0 0}

/* 상단 로고 영역 배경 */
.head-top.light .today,.head-top.light .top-right,.head-top.light .search-toggle{color:#fff}
.head-top.light .top-right a:hover{color:#fff;text-decoration:underline}

/* ---------- 팝업 ---------- */
.popup{position:fixed;z-index:150;top:var(--pt,120px);left:var(--pl,20px);width:var(--pw,400px);max-width:calc(100vw - 20px);max-height:calc(100vh - 40px);background:#fff;box-shadow:0 12px 40px rgba(0,0,0,.28);display:flex;flex-direction:column}
.popup[hidden]{display:none}
.popup-body{overflow:auto;flex:1}
.popup-body img{width:100%;height:auto;display:block}
.popup-text{padding:18px 20px;font-size:15px!important;line-height:1.7!important}
.popup-text p{margin:0 0 .8em}
.popup-text p:last-child{margin-bottom:0}
.popup-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;background:#222;color:#ddd;font-size:13px;padding:10px 14px}
.popup-foot label{display:flex;gap:6px;align-items:center;cursor:pointer}
.popup-close{color:#fff;font-size:13px;font-weight:600}

/* ---------- 반응형 ---------- */
@media (max-width:1024px){
  .headline{grid-template-columns:1fr;gap:32px}
  .hl-side{display:grid;grid-template-columns:1fr 1fr;gap:20px}
  .slides{padding:28px 60px}
  .slide{grid-template-columns:1fr;gap:18px}
  .cat-blocks{grid-template-columns:1fr;gap:28px}
  .triple{grid-template-columns:1fr;gap:36px}
  .photo-news ul{grid-template-columns:repeat(2,1fr)}
  .two-col{grid-template-columns:1fr;gap:56px}
  .list-page .main-col,.static-page .main-col{padding-left:0}
  .art-col{border-right:0;padding:36px 0 0}
  .article-page .sidebar{padding-top:0}
}
@media (max-width:640px){
  .wrap{padding-left:16px;padding-right:16px}
  .article-page{padding-top:24px}
  .topbar{height:46px}
  .today{font-size:13px}
  .top-right{font-size:13px}
  .search-toggle span{display:none}
  .search-toggle{margin-right:2px}
  .logo-area{height:96px}
  .logo img{height:64px}
  .gnb .wrap{height:50px;gap:6px;padding-left:4px}
  .menu-toggle{padding-left:8px}
  .gnb ul{gap:22px;padding-left:6px}
  .gnb a{font-size:15px}
  .headline{padding-top:20px}
  .hl-main h2{font-size:19px;padding:0}
  .cat-line::before,.cat-line::after{width:50px}
  .hl-side{grid-template-columns:1fr}
  .hl-sub{display:grid;grid-template-columns:120px 1fr;gap:4px 14px}
  .hl-sub .th{grid-row:span 2}
  .hl-sub h3{margin:0;font-size:15px}
  .hl-sub p{-webkit-line-clamp:2;font-size:13px}
  .slider{margin-top:40px;margin-left:0;margin-right:0;padding:0}
  .slides{padding:20px 20px 26px;min-height:0}
  .slide strong{font-size:18px}
  .sl-prev,.sl-next{top:28%;background:rgba(0,0,0,.35);padding:6px}
  .sl-prev{left:4px}.sl-next{right:4px}
  .cat-block{gap:10px}
  .cell.card strong{font-size:14px;padding:10px 10px 0;line-height:1.45}
  .cat-tile{padding:16px 12px}
  .photo-news ul{gap:14px}
  .list-head h1{font-size:24px}
  .list-head{margin-bottom:24px}
  .v-summary article{grid-template-columns:120px 1fr;gap:14px}
  .v-summary h2{font-size:16px;margin-bottom:6px}
  .v-summary .desc .sub{display:none}
  .v-summary .date{margin-top:8px}
  .v-photo{grid-template-columns:1fr 1fr;gap:20px 12px}
  .v-photo strong{font-size:14px}
  .art-head h1{font-size:26px;margin-bottom:20px}
  .tools{gap:18px}
  .sns{flex-wrap:wrap}
  .art-sub{font-size:16px;margin-bottom:40px;padding-left:16px}
  .art-content{font-size:17px;line-height:1.9}
  .art-content h3{font-size:19px}
  .foot-links{gap:8px 18px}
  .foot-links a{font-size:14px}
  .foot-info{font-size:13px;gap:8px 0}
  .foot-bottom{flex-direction:column;gap:8px;padding-top:36px}
  .banner-slot{grid-template-columns:1fr;gap:10px;margin-top:20px}
  .popup{left:50%!important;top:64px!important;transform:translateX(-50%);width:min(var(--pw,400px),calc(100vw - 32px));max-height:calc(100vh - 90px)}
}

/* ---------- 인쇄 ---------- */
@media print{
  .site-header,.site-footer,.sidebar,.sns,.tools,.related,.allmenu,.popups{display:none!important}
  .two-col{display:block}
  .art-col{border:0;padding:0}
  .art-head h1{font-size:28px}
}
