.visually-hidden,
.visually-hidden-focusable:not(:focus):not(:focus-within) {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.ms-auto {
  margin-left: auto !important;
}


.fs-1 {
  font-size: 1.5rem !important;
}

.fs-2 {
  font-size: 1.375rem !important;
}

.fs-3 {
  font-size: 1.25rem !important;
}

.fs-4 {
  font-size: 1.125rem !important;
}

.fs-5 {
  font-size: 1rem !important;
}

.fs-6 {
  font-size: 0.875rem !important;
}


.bg-black{
	background-color:#000000!important;color:#fff;
}
.bg-pasix{
	background-color:#6424e2!important;color:#fff;
}
.border-pasix{
	border-color:#6424e2!important;
}
.badge-pasix {
	background-color:#6424e2!important;color:#fff;
}

.nav {
  --bs-nav-link-padding-x: 1rem;
  --bs-nav-link-padding-y: 0.5rem;
  --bs-nav-link-font-weight: ;
  --bs-nav-link-color: var(--bs-link-color);
  --bs-nav-link-hover-color: var(--bs-link-hover-color);
  --bs-nav-link-disabled-color: #6c757d;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  padding-left: 0;
  margin-bottom: 0;
  list-style: none;
}

.nav-link {
  display: block;
  padding: var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);
  font-size: var(--bs-nav-link-font-size);
  font-weight: var(--bs-nav-link-font-weight);
  color: var(--bs-nav-link-color);
  text-decoration: none;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}

.navbar-dark .navbar-text{
	color:rgba(255,255,255,1.0)!important;	
}
.navbar-dark .navbar-nav .nav-link{
	color:rgba(255,255,255,1.0)!important;
}


/*------------------------------------
	Zoom
------------------------------------*/
.overflow {
  position: relative;
  overflow: hidden;
}

.overflow img {
  position: relative;
  display: block;
}

.overflow video {
  position: relative;
  display: block;
}

.zoom img {
  transition: all 0.2s linear;
}

.zoom video {
  transition: all 0.2s linear;
}

.zoom:hover img {
  -webkit-transform: scale(1.1);
          transform: scale(1.1);
}

.zoom:hover video {
  -webkit-transform: scale(1.1);
          transform: scale(1.1);
}



/*------------------------------------
	Background Shadow
------------------------------------*/
.bg-shadow {
  background: linear-gradient(to bottom, rgba(179, 171, 171, 0) 0%, rgba(48, 48, 48, 0.71) 49%, rgba(19, 19, 19, 0.8) 100%);
}

.bg-lg-shadow {
  background: linear-gradient(to bottom, rgba(16, 11, 11, 0) 0%, rgba(0, 0, 0, 0.67) 49%, rgba(19, 19, 19, 0.88) 100%);
}

.bg-shadow-two {
  background: rgba(53, 53, 53, 0.75);
}

.bg-full-shadow {
  position: absolute;
  background: var(--bs-black);
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0.6;
  transition: opacity 0.3s;
  -webkit-transition: opacity 0.3s;
  -moz-transition: opacity 0.3s;
  z-index: 2;
}

/*------------------------------------
 Lazyload images
------------------------------------*/
.image-wrapper {
  /*background color if image is loading slow*/
  background-color: #f8f9fa;
  overflow: hidden;
  width: 100%;
  position: relative;
  background: linear-gradient(to left, #f8f9fa 0%, #ced4da 15%, #f8f9fa 40%, #f8f9fa 100%);
  background-size: 400% 700% !important;
  background-position: center center !important;
  -webkit-animation: AnimationSea 1.5s infinite linear forwards;
  animation: AnimationSea 1.5s infinite linear forwards;
}

@-webkit-keyframes AnimationSea {
  from {
    background-position: 100% 0;
  }
  to {
    background-position: 20% 0;
  }
}
@keyframes AnimationSea {
  from {
    background-position: 100% 0;
  }
  to {
    background-position: 20% 0;
  }
}
.image-single-wrapper {
  width: 100%;
  min-height: 18rem;
}

.lazy {
  width: 100%;
  transition: 500ms ease-in-out;
  opacity: 0;
}

.lazy.loaded {
  opacity: 1;
}

.hover-a:hover .image-wrapper {
  opacity: 0.9;
}

.ajax-tabs {
  min-height: 20rem;
}

.loaders {
  opacity: 0.7;
  font-size: 2.5rem;
  text-align: center;
  margin-top: 100px;
}





/*------------------------------------
	Space
------------------------------------*/
/*top*/
.t-0 {
  top: 0;
}

.t-1 {
  top: 1rem;
}

.t-2 {
  top: 2rem;
}

.t-3 {
  top: 3rem;
}

.t-4 {
  top: 4rem;
}

/*bottom*/
.b-0 {
  bottom: 0;
}

.b-1 {
  bottom: 1rem;
}

.b-2 {
  bottom: 2rem;
}

.b-3 {
  bottom: 3rem;
}

.b-4 {
  bottom: 4rem;
}

/*right*/
.r-0 {
  right: 0;
}

.r-1 {
  right: 1rem;
}

.r-2 {
  right: 2rem;
}

.r-3 {
  right: 3rem;
}

.r-4 {
  right: 4rem;
}

/*left*/
.l-0 {
  left: 0rem;
}

.l-1 {
  left: 1rem;
}

.l-2 {
  left: 2rem;
}

.l-3 {
  left: 3rem;
}

.l-4 {
  left: 4rem;
}

.no-margin {
  right: 0;
  bottom: 0;
  left: 0;
}

/*------------------------------------
  Space Percent
------------------------------------*/
/*top*/
.top-1 {
  top: 10%;
}

.top-2 {
  top: 20%;
}

.top-3 {
  top: 30%;
}

.top-4 {
  top: 40%;
}

.top-5 {
  top: 50%;
}

/*bottom*/
.bottom-1 {
  bottom: 10%;
}

.bottom-2 {
  bottom: 20%;
}

.bottom-3 {
  bottom: 30%;
}

.bottom-4 {
  bottom: 40%;
}

.bottom-5 {
  bottom: 50%;
}

/*right*/
.right-1 {
  right: 10%;
}

.right-2 {
  right: 20%;
}

.right-3 {
  right: 30%;
}

.right-4 {
  right: 40%;
}

.right-5 {
  right: 50%;
}

/*left*/
.left-1 {
  left: 10%;
}

.left-2 {
  left: 20%;
}

.left-3 {
  left: 30%;
}

.left-4 {
  left: 40%;
}

.left-5 {
  left: 50%;
}

.h-0 {
  height: 0;
}

.gap-0, .gap-05, .gap-075, .gap-1, .gap-15, .gap-2, .gap-25, .gap-3, .gap-4 {
  width: 100%;
  clear: both;
}

.gap-0 {
  height: 0.1px;
}

.gap-05 {
  height: 0.5rem;
}

.gap-075 {
  height: 0.75rem;
}

.gap-1 {
  height: 1rem;
}

.gap-15 {
  height: 1.5rem;
}

.gap-2 {
  height: 2rem;
}

.gap-25 {
  height: 2.5rem;
}

.gap-3 {
  height: 3rem;
}

.gap-4 {
  height: 4rem;
}


.headline-box{
	height:400px;
}

/* 모바일 화면에서만 적용되는 스타일 */
@media (max-width: 576px) { /* Bootstrap 4의 모바일 화면 브레이크포인트 */
    .my-0-mobile {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }
    /* 필요에 따라 다른 my- 클래스들도 여기에 추가 */
	.headline-box{
		height:300px;
	}

}







/* ══════════════════════════════════════════════════════════════
   MAGAZINE POLISH LAYER — magazine-type 전용(격리) · 2026-07-18
   (기존 유틸리티는 위에 그대로 두고, 아래에서 매거진 룩을 덮어씀)
   ══════════════════════════════════════════════════════════════ */
:root{
  --mag-ink:#15181d;      /* 본문 텍스트(니어블랙) */
  --mag-soft:#727882;     /* 메타/보조 */
  --mag-line:#e8e9ed;     /* 헤어라인 */
  --mag-line2:#f0f1f4;    /* 옅은 구분선 */
  --mag-accent:#6424e2;   /* 브랜드 액센트(보라) */
  --mag-accent-dk:#4c18b3;
  --mag-serif:"Noto Serif KR",serif;
  --mag-sans:"Pretendard","Malgun Gothic",dotum,sans-serif;
  --mag-max:1200px;
}
body,button,input,select,textarea{ font-family:var(--mag-sans); }
body{ color:var(--mag-ink); background:#fff; -webkit-font-smoothing:antialiased; }
.container{ max-width:var(--mag-max); }
img{ max-width:100%; }

/* ── 상단 유틸바(날짜+소셜) ── */
.bg-black.fs-6 .nav-link{ padding:.5rem .45rem!important; opacity:.8; }
.bg-black.fs-6 .nav-link:hover{ opacity:1; }
.bg-black.fs-6 time{ font-size:.78rem; letter-spacing:.03em; opacity:.92; }

/* ── 마스트헤드 (기존 .page_name 구조 위에 매거진 워드마크) ── */
.mag-masthead{ text-align:center; padding:.4rem 0 1rem; }
.mag-masthead .page_name{ font-family:var(--mag-serif); position:static!important; }
.mag-masthead .page_name a{ text-decoration:none; }
.mag-masthead .page_name a span{
  font-family:var(--mag-serif)!important; font-weight:900!important; font-size:2.7rem!important;
  letter-spacing:-.02em; color:var(--mag-ink)!important; line-height:1; display:inline-block;
}
.mag-masthead small{
  display:inline-block; margin-top:.55rem; font-size:.82rem!important;
  color:var(--mag-soft)!important; letter-spacing:.04em; font-weight:500!important;
  font-family:var(--mag-sans)!important;
}
@media (max-width:560px){
  .mag-masthead .page_name a span{ font-size:2rem!important; }
}

/* ── 카테고리 네비 ── */
.mag-navbar{ border-top:1px solid var(--mag-line); border-bottom:1px solid var(--mag-line); background:#fff; }
.mag-navbar:has(#menu_nav:empty){ display:none; }   /* 카테고리 없는 단일주제 도메인은 빈 nav 숨김 */
.category{ height:56px!important; line-height:1!important; display:flex; align-items:center; overflow-x:auto; }
.category ul#menu_nav{
  display:flex; justify-content:center; flex-wrap:nowrap; gap:.1rem;
  padding:0; margin:0 auto; min-width:max-content; list-style:none;
}
.category ul#menu_nav li{ float:none!important; }
.category a{
  display:block; padding:.55rem 1.05rem!important; font-size:.96rem; font-weight:600;
  color:var(--mag-soft)!important; white-space:nowrap;
  border-bottom:2px solid transparent; transition:color .15s, border-color .15s;
}
.category a:hover{ color:var(--mag-ink)!important; }
.category .bo_cate_on{ color:var(--mag-ink)!important; border-bottom-color:var(--mag-accent)!important; font-weight:800; }

/* ── 본문 레이아웃 그리드 ── */
.mag-wrap{ padding:2.2rem 15px 3.2rem; }
.mag-grid{ display:grid; grid-template-columns:minmax(0,2fr) minmax(0,1fr); gap:2.6rem; align-items:start; }
.mag-col-side{ position:sticky; top:1.2rem; }   /* 본문이 길어도 사이드바가 따라와 빈 공간 최소화 */
@media (max-width:900px){ .mag-grid{ grid-template-columns:1fr; gap:2rem; } .mag-col-side{ position:static; } }

/* ── 섹션 헤더 ── */
.mag-sec{ margin-bottom:2.5rem; }
.mag-sec:last-child{ margin-bottom:0; }
.mag-h{
  display:flex; align-items:center; gap:.55rem; margin:0 0 1.2rem;
  padding-bottom:.7rem; border-bottom:2px solid var(--mag-ink);
  font-family:var(--mag-sans); font-size:1.18rem; font-weight:800;
  letter-spacing:-.02em; color:var(--mag-ink);
}
.mag-h::before{ content:""; width:9px; height:9px; background:var(--mag-accent); border-radius:2px; flex:0 0 auto; }

/* ── 헤드라인 히어로 ── */
.mag-hero{ position:relative; display:block; border-radius:10px; overflow:hidden; aspect-ratio:16/9; background:#eef0f3; text-decoration:none; }
.mag-hero img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s ease; }
.mag-hero:hover img{ transform:scale(1.04); }
.mag-hero .mag-hero-body{
  position:absolute; left:0; right:0; bottom:0; padding:2.1rem 1.8rem 1.5rem; color:#fff;
  background:linear-gradient(to top, rgba(8,9,12,.94) 0%, rgba(8,9,12,.55) 52%, rgba(8,9,12,0) 100%);
}
.mag-hero .mag-title{
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  font-family:var(--mag-serif); font-weight:700; font-size:1.8rem; line-height:1.35;
  letter-spacing:-.02em; color:#fff; margin:.55rem 0 .5rem; text-wrap:balance;
}
.mag-hero .mag-meta{ font-size:.82rem; color:rgba(255,255,255,.82); letter-spacing:.02em; }
@media (max-width:560px){ .mag-hero .mag-title{ font-size:1.3rem; } .mag-hero .mag-hero-body{ padding:1.5rem 1.2rem 1.1rem; } }

/* ── 배지 ── */
.mag-badge{
  display:inline-block; background:var(--mag-accent); color:#fff; font-size:.7rem; font-weight:700;
  letter-spacing:.03em; padding:.32em .62em; border-radius:3px; text-decoration:none; line-height:1.2;
}
.mag-badge.is-light{ background:rgba(255,255,255,.18); }

/* ── 최신뉴스 카드 그리드 ── */
.mag-cards{ display:grid; grid-template-columns:1fr 1fr; gap:1.6rem 1.5rem; }
@media (max-width:560px){ .mag-cards{ grid-template-columns:1fr; gap:1.4rem; } }
.mag-card{ display:block; text-decoration:none; }
.mag-card .mag-thumb{ position:relative; display:block; border-radius:8px; overflow:hidden; aspect-ratio:16/10; background:#eef0f3; margin-bottom:.75rem; }
.mag-card .mag-thumb img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s ease; }
.mag-card:hover .mag-thumb img{ transform:scale(1.04); }
.mag-card .mag-badge{ position:absolute; top:.6rem; left:.6rem; }
.mag-card .mag-title{
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  font-size:1.04rem; font-weight:700; line-height:1.42; letter-spacing:-.02em;
  color:var(--mag-ink); margin:0 0 .4rem; transition:color .15s;
}
.mag-card:hover .mag-title{ color:var(--mag-accent-dk); }
.mag-card .mag-meta{ font-size:.78rem; color:var(--mag-soft); }

/* ── 인기 글 랭킹 리스트 ── */
.mag-rank{ list-style:none; margin:0; padding:0; }
.mag-rank li{ display:flex; gap:.85rem; align-items:center; padding:.85rem 0; border-bottom:1px solid var(--mag-line2); }
.mag-rank li:first-child{ padding-top:.15rem; }
.mag-rank li:last-child{ border-bottom:0; }
.mag-rank .mag-n{
  flex:0 0 auto; width:1.6rem; text-align:center;
  font-family:var(--mag-serif); font-weight:900; font-size:1.35rem; line-height:1; color:#c3c7ce;
}
.mag-rank li:nth-child(1) .mag-n,
.mag-rank li:nth-child(2) .mag-n,
.mag-rank li:nth-child(3) .mag-n{ color:var(--mag-accent); }
.mag-rank .mag-rk-thumb{ flex:0 0 62px; width:62px; height:62px; border-radius:6px; overflow:hidden; background:#eef0f3; display:block; }
.mag-rank .mag-rk-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.mag-rank .mag-rank-body{ min-width:0; }
.mag-rank .mag-rank-body a{ text-decoration:none; }
.mag-rank .mag-title{
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  font-size:.96rem; font-weight:600; line-height:1.42; letter-spacing:-.02em;
  color:var(--mag-ink); margin:0 0 .25rem; transition:color .15s;
}
.mag-rank li:hover .mag-title{ color:var(--mag-accent-dk); }
.mag-rank .mag-meta{ font-size:.74rem; color:var(--mag-soft); }

/* 이미지 없는 카드 플레이스홀더 */
.mag-noimg{ position:absolute; inset:0; background:linear-gradient(135deg,#eef0f3,#e2e5ea); }

/* ── 카테고리/리스트 페이지 (main.php) ── */
.mag-page-title{
  font-family:var(--mag-serif); font-weight:900; font-size:1.7rem; letter-spacing:-.02em;
  color:var(--mag-ink); margin:0 0 1.4rem; padding-bottom:.8rem; border-bottom:2px solid var(--mag-ink);
}
.mag-page-main{ margin:0 0 1.6rem; }
.mag-empty{ padding:3.5rem 0; text-align:center; color:var(--mag-soft); font-size:1rem; }
.mag-cards.is-wide{ grid-template-columns:repeat(3,minmax(0,1fr)); }
@media (max-width:820px){ .mag-cards.is-wide{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .mag-cards.is-wide{ grid-template-columns:1fr; } }

/* ── 페이지네이션 ── */
.mag-paging{ margin-top:2.6rem; text-align:center; }
.mag-paging .pg_wrap{ float:none; display:inline-block; }
.mag-paging .pg{ display:inline-flex; align-items:center; gap:.35rem; flex-wrap:wrap; justify-content:center; }
.mag-paging .pg_page, .mag-paging .pg_current{
  display:inline-block; min-width:38px; height:38px; line-height:36px; padding:0 .5rem;
  text-align:center; border-radius:7px; border:1px solid var(--mag-line); background:#fff;
  color:var(--mag-ink); font-size:.9rem; font-weight:600; text-decoration:none;
}
.mag-paging .pg_page:hover{ background:#f5f5f8; border-color:#d7dae0; }
.mag-paging .pg_current{ background:var(--mag-accent)!important; border-color:var(--mag-accent)!important; color:#fff!important; }
.mag-paging .pg_start,.mag-paging .pg_prev,.mag-paging .pg_next,.mag-paging .pg_end{
  min-width:38px; height:38px; border:1px solid var(--mag-line); border-radius:7px; background-color:#fff;
}

/* ── 네이버 오픈메인 위젯 ── */
.mag-openmain{ margin-top:2.2rem; text-align:center; }

/* ── 홈 카테고리 섹션 (방송/스포츠/…) ── */
.mag-catsec{ margin-top:3rem; padding-top:2.5rem; border-top:1px solid var(--mag-line); }
.mag-catsec-head{ display:flex; align-items:baseline; justify-content:space-between; gap:1rem; margin-bottom:1.4rem; }
.mag-catsec-h{
  margin:0; position:relative; padding-left:.75rem;
  font-family:var(--mag-serif); font-weight:900; font-size:1.5rem; letter-spacing:-.02em; color:var(--mag-ink);
}
.mag-catsec-h::before{ content:""; position:absolute; left:0; top:.12em; bottom:.12em; width:5px; background:var(--mag-accent); border-radius:2px; }
.mag-catsec-h a{ color:inherit; text-decoration:none; }
.mag-catsec-h a:hover{ color:var(--mag-accent-dk); }
.mag-more{ flex:0 0 auto; font-size:.85rem; font-weight:600; color:var(--mag-soft); text-decoration:none; white-space:nowrap; }
.mag-more:hover{ color:var(--mag-accent-dk); }
.mag-more span{ font-size:1.15em; vertical-align:-1px; }
.mag-cards.is-4{ grid-template-columns:repeat(4,minmax(0,1fr)); }
@media (max-width:900px){ .mag-cards.is-4{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .mag-cards.is-4{ grid-template-columns:1fr; } }

/* ── 소제목(deck) — 제목 아래 본문 리드 발췌 ── */
.mag-hero .mag-desc{
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  font-size:.95rem; line-height:1.55; color:rgba(255,255,255,.86); margin:.1rem 0 .6rem; font-weight:400;
}
.mag-card .mag-desc{
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  font-size:.85rem; line-height:1.55; color:var(--mag-soft); margin:.1rem 0 .55rem; font-weight:400; letter-spacing:-.01em;
}

/* ── 이미지 통일 처리 — 저퀄 이미지를 매거진 톤으로(살짝 알파·톤다운·비네트) ── */
.mag-thumb img, .mag-hero img, .mag-rk-thumb img{ filter:saturate(.88) contrast(1.05) brightness(.985); transition:filter .3s ease, transform .4s ease; }
.mag-thumb, .mag-hero, .mag-rk-thumb{ box-shadow:inset 0 0 0 1px rgba(12,14,22,.06); }
.mag-thumb::after{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(180deg, rgba(20,22,34,.06) 0%, rgba(20,22,34,0) 34%, rgba(20,22,34,.20) 100%);
}
.mag-thumb .mag-badge{ z-index:2; }
.mag-card:hover .mag-thumb img{ filter:saturate(1) contrast(1.02) brightness(1); }