/*
Theme Name: Onpa News
Description: 온파 미디어 인터넷신문 테마 — 시안 A(FOX 신문형) 확정판. 랭크업 newsg 구성 + Fox 타이포.
Version: 0.3
Author: ONPA MEDIA
*/

@font-face { font-family:'Oswald'; src:url('assets/fonts/Oswald.ttf'); font-weight:200 700; }

:root { --ink:#111; --gray:#666; --lg:#e2e2e2; --gold:#E8A33D; --navy:#1F3864; --kakao:#FEE500; }
*{margin:0;padding:0;box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{font-family:"Noto Sans CJK KR","Noto Sans KR","Apple SD Gothic Neo","Malgun Gothic",sans-serif;color:var(--ink);background:#fff;line-height:1.5;}
a{color:inherit;text-decoration:none;}
a:hover{color:#1a4fa0;}
img{max-width:100%;display:block;}
.wrap{max-width:1200px;margin:0 auto;padding:0 20px;}

/* 유틸바 */
.util{border-bottom:1px solid var(--ink);font-size:12.5px;}
.util .wrap{display:flex;justify-content:space-between;align-items:center;height:40px;}
.u-left{display:flex;gap:14px;align-items:center;font-size:16px;}
.u-right{display:flex;gap:14px;align-items:center;}
.subs{border:1px solid var(--ink);padding:4px 12px;font-weight:700;font-size:11.5px;letter-spacing:1px;}

/* 마스트헤드 */
.masthead{position:relative;text-align:center;padding:26px 0 14px;border-bottom:1px solid var(--ink);}
.mh-title{font-family:'Oswald';font-weight:700;font-size:74px;letter-spacing:2px;line-height:1;text-transform:uppercase;}
.mh-sub{font-size:11px;letter-spacing:3px;color:#333;margin-top:8px;text-transform:uppercase;}
.mh-social{position:absolute;right:20px;top:50%;transform:translateY(-50%);display:flex;gap:8px;}
.mh-social a{width:26px;height:26px;border:1px solid var(--ink);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;}

/* GNB */
.gnb{border-bottom:1px solid var(--ink);}
.gnb ul{display:flex;justify-content:center;list-style:none;flex-wrap:wrap;}
.gnb a{display:block;padding:11px 18px;font-family:'Oswald',"Noto Sans CJK KR",sans-serif;font-weight:600;font-size:15px;letter-spacing:1px;}
.gnb .plus a::after{content:" +";font-weight:400;color:#888;}
.gnb .gnb-unse a{color:var(--gold);}

/* 프론트 3단 */
.front{display:grid;grid-template-columns:1fr 2.1fr 1fr;gap:24px;padding:26px 0;}
.fl .item{padding:13px 0;border-bottom:1px solid var(--lg);overflow:hidden;}
.fl .item:first-child{padding-top:0;}
.fl h4{font-size:14.5px;font-weight:800;line-height:1.35;}
.fl p{font-size:12px;color:var(--gray);margin-top:4px;}
.fl .thumb{float:right;width:56px;height:56px;background:#d9d9d9;margin-left:10px;background-size:cover;background-position:center;}
.fc{border-left:1px solid var(--lg);border-right:1px solid var(--lg);padding:0 24px;}
.h-img{width:100%;aspect-ratio:16/10;background:#d9d9d9 center/cover no-repeat;display:flex;align-items:center;justify-content:center;color:#999;font-size:13px;letter-spacing:2px;}
.h-cat{font-family:'Oswald';font-size:12px;font-weight:600;letter-spacing:3px;color:#444;margin:16px 0 6px;text-transform:uppercase;}
.h-title{font-size:34px;font-weight:900;line-height:1.22;}
.h-lead{font-size:14px;color:#444;margin-top:10px;}
.h-meta{font-family:'Oswald';font-size:11px;color:#999;margin-top:10px;letter-spacing:2px;text-transform:uppercase;}
.fr .sub{margin-bottom:20px;}
.s-img{width:100%;aspect-ratio:16/11;background:#d9d9d9 center/cover no-repeat;display:flex;align-items:center;justify-content:center;color:#999;font-size:12px;}
.fr h4{font-size:15.5px;font-weight:800;line-height:1.35;margin-top:9px;}
.fr p{font-size:12px;color:var(--gray);margin-top:4px;}

/* 섹션 대제목 */
.sec{border-top:2px solid var(--ink);margin-top:8px;padding-top:6px;}
.sec-head{display:flex;justify-content:center;align-items:baseline;position:relative;border-bottom:2px solid var(--ink);padding:6px 0 10px;}
.sec-head h2{font-family:'Oswald',"Noto Sans CJK KR",sans-serif;font-weight:700;font-size:38px;letter-spacing:3px;text-transform:uppercase;}
.sec-head .more{position:absolute;right:0;bottom:12px;font-size:11.5px;font-weight:700;letter-spacing:1px;color:#333;}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;padding:22px 0 26px;}
.card .c-img{width:100%;aspect-ratio:16/10;background:#d9d9d9 center/cover no-repeat;display:flex;align-items:center;justify-content:center;color:#999;font-size:12px;}
.card h4{font-size:15px;font-weight:800;line-height:1.35;margin-top:9px;}
.card p{font-size:12px;color:var(--gray);margin-top:4px;}
.card .meta{font-family:'Oswald';font-size:10.5px;color:#aaa;margin-top:6px;letter-spacing:1.5px;text-transform:uppercase;}

/* 운세 배너 */
section.unse{border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);margin:6px 0 30px;padding:22px 0;}
section.unse .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;}
section.unse h3{font-size:23px;font-weight:900;}
section.unse h3 span{color:var(--gold);}
section.unse p{font-size:13px;color:var(--gray);margin-top:3px;}
.unse-btn{background:var(--navy);color:#fff !important;font-weight:800;font-size:14.5px;padding:12px 26px;border-radius:3px;}
.unse-btn:hover{background:var(--gold);}

/* 인기뉴스 */
.rank{display:grid;grid-template-columns:1fr 1fr;gap:0 40px;padding:18px 0 26px;counter-reset:r;list-style:none;}
.rank li{counter-increment:r;display:flex;gap:14px;padding:9px 0;border-bottom:1px solid var(--lg);font-size:14px;font-weight:600;}
.rank li::before{content:counter(r);font-family:'Oswald';font-weight:700;font-size:18px;min-width:20px;}

/* 플로팅 */
.floating{position:fixed;right:16px;top:38%;display:flex;flex-direction:column;gap:8px;z-index:99;}
.floating a{width:62px;height:54px;background:#fff;border:1px solid #ccc;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:10.5px;font-weight:700;color:#333;box-shadow:0 2px 8px rgba(0,0,0,.08);}
.floating .kk{background:var(--kakao);border-color:var(--kakao);}
.floating svg{margin-bottom:3px;}

/* 푸터 */
.foot{border-top:2px solid var(--ink);margin-top:34px;padding:24px 0 32px;font-size:12px;color:#555;}
.foot .fl2{display:flex;gap:16px;flex-wrap:wrap;font-weight:700;color:var(--ink);margin-bottom:12px;}
.foot p{margin-top:3px;}
.mock{background:#fff8ec;border:1px solid var(--gold);color:#8a5a00;font-size:12px;padding:7px 14px;margin:12px auto 0;max-width:1160px;text-align:center;}

/* 기사 본문·목록 페이지 */
.article{max-width:820px;margin:0 auto;padding:30px 20px;}
.article .a-cat{font-family:'Oswald';font-size:12px;letter-spacing:3px;color:#444;text-transform:uppercase;}
.article h1{font-size:32px;font-weight:900;line-height:1.28;margin:10px 0 6px;}
.article .a-meta{font-size:12.5px;color:#999;border-bottom:1px solid var(--ink);padding-bottom:14px;margin-bottom:20px;}
.article .a-body{font-size:16px;line-height:1.8;color:#222;}
.article .a-body p{margin:0 0 18px;}
.archive-head{border-bottom:2px solid var(--ink);padding:22px 0 12px;}
.archive-head h1{font-family:'Oswald',"Noto Sans CJK KR",sans-serif;font-size:34px;font-weight:700;letter-spacing:2px;}
.list-item{display:grid;grid-template-columns:200px 1fr;gap:20px;padding:18px 0;border-bottom:1px solid var(--lg);}
.list-item .c-img{aspect-ratio:16/10;}
.list-item h3{font-size:19px;font-weight:800;line-height:1.35;}
.list-item p{font-size:13px;color:var(--gray);margin-top:6px;}

/* 반응형 */
@media(max-width:1024px){
  .floating{display:none}
  .front{grid-template-columns:1fr 1.8fr}
  .fr{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:18px}
  .grid4{grid-template-columns:1fr 1fr}
}
@media(max-width:680px){
  .mh-title{font-size:44px}
  .mh-social{display:none}
  .front{grid-template-columns:1fr}
  .fc{border:none;padding:0}
  .fl{order:2}.fc{order:1}.fr{order:3;grid-template-columns:1fr}
  .h-title{font-size:25px}
  .grid4{grid-template-columns:1fr}
  .rank{grid-template-columns:1fr}
  .sec-head h2{font-size:26px}
  .gnb a{padding:9px 11px;font-size:13.5px}
  .u-right .hide-m{display:none}
  .list-item{grid-template-columns:1fr}
}