편집 요약 없음 |
편집 요약 없음 |
||
| 225번째 줄: | 225번째 줄: | ||
.fbnw-portal{font:15px/1.6 var(--fb-font,system-ui);color:var(--fb-text,#212529)}.fbnw-portal *{box-sizing:border-box}.fbnw-portal a{color:var(--fb-link,#275cf6);text-decoration:none}.fbnw-portal a:hover{text-decoration:underline}.fbnw-portal .portal-slider{position:relative;border-radius:var(--fb-radius,12px);overflow:hidden}.fbnw-portal .portal-slides{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}.fbnw-portal .portal-slide{position:relative;flex:0 0 100%;scroll-snap-align:start;min-height:340px;padding:44px;background:linear-gradient(120deg,#102951,#275cf6);color:white;overflow:hidden}.fbnw-portal .portal-slide:nth-child(2){background:linear-gradient(120deg,#153c3e,#268276)}.fbnw-portal .portal-slide:nth-child(3){background:linear-gradient(120deg,#332244,#7b4b9e)}.fbnw-portal .portal-slide:after{content:attr(data-art);position:absolute;right:20px;bottom:-30px;font-size:130px;line-height:1;font-weight:850;opacity:.08;pointer-events:none}.fbnw-portal .portal-badge{display:inline-block;border:1px solid #ffffff60;border-radius:4px;padding:1px 6px;font-size:11px;letter-spacing:.08em}.fbnw-portal .portal-headline{display:block;margin:20px 0 12px;font-size:clamp(28px,4vw,42px);font-weight:750;line-height:1.23;letter-spacing:-.035em}.fbnw-portal .portal-slide-description{display:block;color:#ffffffd9;font-size:16px}.fbnw-portal .portal-slide-author{display:block;margin-top:20px;font-size:12px;color:#ffffffb8}.fbnw-portal .portal-slide-link{display:block;position:relative;z-index:1;margin-top:14px}.fbnw-portal .portal-slide-link a{color:white;font-weight:650}.fbnw-portal .portal-controls{display:flex;align-items:center;gap:8px;position:absolute;bottom:18px;right:18px;z-index:2}.fbnw-portal .portal-controls button{border:1px solid #ffffff50;background:#0003;color:white;border-radius:8px;width:34px;height:34px;cursor:pointer;font:inherit}.fbnw-portal .portal-controls span{font-size:12px;color:white;padding-right:5px}.fbnw-portal .portal-section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:28px 0 14px}.fbnw-portal .portal-section-title{font-size:22px;font-weight:700}.fbnw-portal .portal-section-head a{font-size:13px}.fbnw-portal .portal-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.fbnw-portal .portal-card{border:1px solid var(--fb-line,#e5e8eb);border-radius:12px;overflow:hidden;background:var(--fb-surface,#fff)}.fbnw-portal .portal-card-info{padding:16px}.fbnw-portal .portal-card-author{display:block;font-size:11px;color:var(--fb-text-muted,#626c7a)}.fbnw-portal .portal-pill{display:inline-block;margin-left:5px;padding:1px 5px;border-radius:4px;background:var(--fb-brand-tint,#eef3ff);color:var(--fb-brand,#275cf6);font-size:10px}.fbnw-portal .portal-card-title{display:block;margin:7px 0;font-size:18px;font-weight:700}.fbnw-portal .portal-card-title a{color:var(--fb-text-strong,#000)}.fbnw-portal .portal-card-category{font-size:12px;color:var(--fb-text-muted,#626c7a)}.fbnw-portal .portal-card-cover{height:180px;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,#d9e5ff,#a3bff5);color:#34538f;font-size:36px;font-weight:800;letter-spacing:-.04em}.fbnw-portal .portal-card:nth-child(2n) .portal-card-cover{background:linear-gradient(145deg,#d4ebe1,#94c6b3);color:#316352}.fbnw-portal .portal-bottom{display:grid;grid-template-columns:1.5fr 1fr;gap:16px;margin-top:28px}.fbnw-portal .portal-panel{border:1px solid var(--fb-line,#e5e8eb);border-radius:12px;background:var(--fb-surface,#fff);padding:22px}.fbnw-portal .portal-panel-title{display:block;font-weight:700;font-size:19px;margin-bottom:10px}.fbnw-portal .portal-line{padding:10px 0;border-bottom:1px solid var(--fb-line,#e5e8eb);font-size:14px}.fbnw-portal .portal-line:last-child{border:0}.fbnw-portal .portal-shortcuts{display:grid;grid-template-columns:1fr 1fr;gap:10px}.fbnw-portal .portal-shortcuts>div{padding:12px;background:var(--fb-surface-2,#f2f3f5);border-radius:8px;font-size:13px}.fbnw-portal a:focus-visible,.fbnw-portal button:focus-visible{outline:2px solid var(--fb-brand,#275cf6);outline-offset:3px}html.liberty-dark-mode .fbnw-portal .portal-card-cover{filter:brightness(.7)}@media(max-width:1023px){.fbnw-portal .portal-cards{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}.fbnw-portal .portal-card{flex:0 0 225px;scroll-snap-align:start}.fbnw-portal .portal-bottom{grid-template-columns:1fr}}@media(max-width:600px){.fbnw-portal .portal-slide{min-height:290px;padding:28px 22px 65px}.fbnw-portal .portal-section-title{font-size:19px}.fbnw-portal .portal-card{flex-basis:205px}.fbnw-portal .portal-card-cover{height:160px}.fbnw-portal .portal-panel{padding:18px}}@media(prefers-reduced-motion:reduce){.fbnw-portal .portal-slides{scroll-behavior:auto}} | .fbnw-portal{font:15px/1.6 var(--fb-font,system-ui);color:var(--fb-text,#212529)}.fbnw-portal *{box-sizing:border-box}.fbnw-portal a{color:var(--fb-link,#275cf6);text-decoration:none}.fbnw-portal a:hover{text-decoration:underline}.fbnw-portal .portal-slider{position:relative;border-radius:var(--fb-radius,12px);overflow:hidden}.fbnw-portal .portal-slides{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}.fbnw-portal .portal-slide{position:relative;flex:0 0 100%;scroll-snap-align:start;min-height:340px;padding:44px;background:linear-gradient(120deg,#102951,#275cf6);color:white;overflow:hidden}.fbnw-portal .portal-slide:nth-child(2){background:linear-gradient(120deg,#153c3e,#268276)}.fbnw-portal .portal-slide:nth-child(3){background:linear-gradient(120deg,#332244,#7b4b9e)}.fbnw-portal .portal-slide:after{content:attr(data-art);position:absolute;right:20px;bottom:-30px;font-size:130px;line-height:1;font-weight:850;opacity:.08;pointer-events:none}.fbnw-portal .portal-badge{display:inline-block;border:1px solid #ffffff60;border-radius:4px;padding:1px 6px;font-size:11px;letter-spacing:.08em}.fbnw-portal .portal-headline{display:block;margin:20px 0 12px;font-size:clamp(28px,4vw,42px);font-weight:750;line-height:1.23;letter-spacing:-.035em}.fbnw-portal .portal-slide-description{display:block;color:#ffffffd9;font-size:16px}.fbnw-portal .portal-slide-author{display:block;margin-top:20px;font-size:12px;color:#ffffffb8}.fbnw-portal .portal-slide-link{display:block;position:relative;z-index:1;margin-top:14px}.fbnw-portal .portal-slide-link a{color:white;font-weight:650}.fbnw-portal .portal-controls{display:flex;align-items:center;gap:8px;position:absolute;bottom:18px;right:18px;z-index:2}.fbnw-portal .portal-controls button{border:1px solid #ffffff50;background:#0003;color:white;border-radius:8px;width:34px;height:34px;cursor:pointer;font:inherit}.fbnw-portal .portal-controls span{font-size:12px;color:white;padding-right:5px}.fbnw-portal .portal-section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:28px 0 14px}.fbnw-portal .portal-section-title{font-size:22px;font-weight:700}.fbnw-portal .portal-section-head a{font-size:13px}.fbnw-portal .portal-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.fbnw-portal .portal-card{border:1px solid var(--fb-line,#e5e8eb);border-radius:12px;overflow:hidden;background:var(--fb-surface,#fff)}.fbnw-portal .portal-card-info{padding:16px}.fbnw-portal .portal-card-author{display:block;font-size:11px;color:var(--fb-text-muted,#626c7a)}.fbnw-portal .portal-pill{display:inline-block;margin-left:5px;padding:1px 5px;border-radius:4px;background:var(--fb-brand-tint,#eef3ff);color:var(--fb-brand,#275cf6);font-size:10px}.fbnw-portal .portal-card-title{display:block;margin:7px 0;font-size:18px;font-weight:700}.fbnw-portal .portal-card-title a{color:var(--fb-text-strong,#000)}.fbnw-portal .portal-card-category{font-size:12px;color:var(--fb-text-muted,#626c7a)}.fbnw-portal .portal-card-cover{height:180px;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,#d9e5ff,#a3bff5);color:#34538f;font-size:36px;font-weight:800;letter-spacing:-.04em}.fbnw-portal .portal-card:nth-child(2n) .portal-card-cover{background:linear-gradient(145deg,#d4ebe1,#94c6b3);color:#316352}.fbnw-portal .portal-bottom{display:grid;grid-template-columns:1.5fr 1fr;gap:16px;margin-top:28px}.fbnw-portal .portal-panel{border:1px solid var(--fb-line,#e5e8eb);border-radius:12px;background:var(--fb-surface,#fff);padding:22px}.fbnw-portal .portal-panel-title{display:block;font-weight:700;font-size:19px;margin-bottom:10px}.fbnw-portal .portal-line{padding:10px 0;border-bottom:1px solid var(--fb-line,#e5e8eb);font-size:14px}.fbnw-portal .portal-line:last-child{border:0}.fbnw-portal .portal-shortcuts{display:grid;grid-template-columns:1fr 1fr;gap:10px}.fbnw-portal .portal-shortcuts>div{padding:12px;background:var(--fb-surface-2,#f2f3f5);border-radius:8px;font-size:13px}.fbnw-portal a:focus-visible,.fbnw-portal button:focus-visible{outline:2px solid var(--fb-brand,#275cf6);outline-offset:3px}html.liberty-dark-mode .fbnw-portal .portal-card-cover{filter:brightness(.7)}@media(max-width:1023px){.fbnw-portal .portal-cards{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}.fbnw-portal .portal-card{flex:0 0 225px;scroll-snap-align:start}.fbnw-portal .portal-bottom{grid-template-columns:1fr}}@media(max-width:600px){.fbnw-portal .portal-slide{min-height:290px;padding:28px 22px 65px}.fbnw-portal .portal-section-title{font-size:19px}.fbnw-portal .portal-card{flex-basis:205px}.fbnw-portal .portal-card-cover{height:160px}.fbnw-portal .portal-panel{padding:18px}}@media(prefers-reduced-motion:reduce){.fbnw-portal .portal-slides{scroll-behavior:auto}} | ||
/* | /* 프벤위키 대문 · 미디어위키:Common.css의 기존 내용 맨 아래에 추가 */ | ||
/* | /* fbn-mainpage 내부에만 적용합니다. 스킨 소스와 PHP 변경은 필요 없습니다. */ | ||
. | .fbn-mainpage { | ||
--fbn-surface: var(--fb-surface, #fff); | |||
--fbn-muted-surface: var(--fb-surface-2, #f8f9fa); | |||
--fbn-ink: var(--fb-text-strong, #17202e); | |||
--fbn-muted: var(--fb-text-muted, #8b919b); | |||
. | --fbn-border: var(--fb-line, #e9ecef); | ||
. | --fbn-link: var(--fb-link, #0054f7); | ||
display: flex; | |||
. | flex-direction: column; | ||
. | gap: 20px; | ||
. | min-width: 0; | ||
. | color: var(--fbn-ink); | ||
font-family: var(--fb-font, Pretendard, "Noto Sans KR", "Malgun Gothic", sans-serif); | |||
font-size: 15px; | |||
line-height: 1.6; | |||
} | |||
html.liberty-dark-mode .fbn-mainpage, html.dark .fbn-mainpage { | |||
--fbn-surface: var(--fb-surface, #202027); | |||
--fbn-muted-surface: var(--fb-surface-2, #2c2c35); | |||
--fbn-ink: var(--fb-text-strong, #ededf0); | |||
--fbn-muted: var(--fb-text-muted, #a0a0ab); | |||
--fbn-border: var(--fb-line, #3c3c47); | |||
--fbn-link: var(--fb-link, #7aabff); | |||
} | |||
.fbn-mainpage, .fbn-mainpage * { box-sizing: border-box; } | |||
.fbn-mainpage p { margin: 0 !important; } | |||
.fbn-mainpage a { text-decoration: none !important; } | |||
.fbn-mainpage a.external { padding: 0 !important; background: none !important; } | |||
.fbn-mainpage a.external::before, .fbn-mainpage a.external::after { display: none !important; } | |||
.fbn-mainpage a:focus-visible, .fbn-mainpage button:focus-visible { | |||
outline: 3px solid #7aabff; outline-offset: 3px; | |||
} | |||
.fbn-mainpage .fbn-slider { | |||
position: relative; overflow: hidden; border-radius: 12px; | |||
background: #142442; isolation: isolate; | |||
} | |||
.fbn-mainpage .fbn-track { | |||
display: flex; width: 100%; overflow-x: auto; scroll-snap-type: x mandatory; | |||
scrollbar-width: none; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; | |||
} | |||
.fbn-mainpage .fbn-track::-webkit-scrollbar { display: none; } | |||
.fbn-mainpage .fbn-slide { | |||
flex: 0 0 100%; min-width: 0; position: relative; aspect-ratio: 12 / 5; | |||
scroll-snap-align: start; scroll-snap-stop: always; overflow: hidden; | |||
} | |||
.fbn-mainpage .fbn-banner-image { position: absolute; inset: 0; } | |||
.fbn-mainpage .fbn-banner-image > p, | |||
.fbn-mainpage .fbn-banner-image > span, | |||
.fbn-mainpage .fbn-banner-image a { display: block; width: 100%; height: 100%; } | |||
.fbn-mainpage .fbn-banner-image img { | |||
display: block; width: 100% !important; height: 100% !important; | |||
max-width: none; object-fit: cover; | |||
} | |||
.fbn-mainpage .fbn-slide::after { | |||
content: ""; position: absolute; inset: 0; pointer-events: none; | |||
background: linear-gradient(90deg, rgba(0, 0, 0, .22), transparent 60%); | |||
} | |||
.fbn-mainpage .fbn-copy { | |||
position: absolute; z-index: 1; inset: 0 53% 20px 58px; | |||
display: flex; flex-direction: column; justify-content: center; align-items: flex-start; | |||
gap: 12px; color: #fff; pointer-events: none; text-shadow: 0 2px 8px #0003; | |||
} | |||
.fbn-mainpage .fbn-eyebrow { font-size: 12px; font-weight: 600; letter-spacing: .07em; opacity: .85; } | |||
.fbn-mainpage .fbn-headline { font-size: clamp(22px, 3vw, 38px); font-weight: 800; line-height: 1.3; letter-spacing: -.045em; } | |||
.fbn-mainpage .fbn-subtitle { font-size: 14px; opacity: .82; } | |||
.fbn-mainpage .fbn-slide-link { position: absolute; z-index: 2; inset: 0; } | |||
.fbn-mainpage .fbn-slide-link > p { height: 100%; } | |||
.fbn-mainpage .fbn-slide-link a { display: block; height: 100%; font-size: 0; color: transparent; } | |||
.fbn-mainpage .fbn-controls { | |||
position: absolute; z-index: 3; inset: 50% 12px auto; | |||
transform: translateY(-50%); display: flex; justify-content: space-between; pointer-events: none; | |||
} | |||
.fbn-mainpage .fbn-controls button { | |||
pointer-events: auto; width: 38px; height: 38px; padding: 0; border: 0; border-radius: 50%; | |||
background: #0005; color: #fff; cursor: pointer; font: 26px/1 sans-serif; | |||
} | |||
.fbn-mainpage .fbn-controls button:hover { background: #0009; } | |||
.fbn-mainpage .fbn-status, .fbn-mainpage .fbn-playback { | |||
position: absolute; z-index: 3; bottom: 14px; background: #0006; color: #fff; | |||
border: 1px solid #ffffff26; border-radius: 20px; padding: 4px 10px; | |||
font-family: inherit; line-height: 1.5; font-size: 11px; | |||
} | |||
.fbn-mainpage .fbn-status { right: 16px; } | |||
.fbn-mainpage .fbn-playback { left: 16px; cursor: pointer; } | |||
.fbn-mainpage .fbn-playback:disabled { cursor: default; opacity: .7; } | |||
.fbn-mainpage .fbn-dots { | |||
display: flex; gap: 7px; position: absolute; z-index: 3; bottom: 17px; | |||
left: 50%; transform: translateX(-50%); | |||
} | |||
.fbn-mainpage .fbn-dots button { | |||
width: 20px; height: 20px; padding: 5px; border: 0; background: transparent; cursor: pointer; | |||
} | |||
.fbn-mainpage .fbn-dots button::before { | |||
content: ""; display: block; width: 8px; height: 8px; border-radius: 50%; background: #ffffff66; | |||
} | |||
.fbn-mainpage .fbn-dots button[aria-current="true"]::before { background: #fff; } | |||
.fbn-mainpage .fbn-information-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: 18px; } | |||
.fbn-mainpage .fbn-resource-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; } | |||
.fbn-mainpage .fbn-card { | |||
min-width: 0; overflow: hidden; border: 1px solid var(--fbn-border); border-radius: 10px; | |||
background: var(--fbn-surface); box-shadow: 0 3px 12px #10203006; | |||
} | |||
.fbn-mainpage .fbn-card-header { | |||
display: flex; align-items: center; justify-content: space-between; gap: 12px; | |||
min-height: 60px; padding: 16px 24px; background: var(--fbn-muted-surface); | |||
} | |||
.fbn-mainpage .fbn-card-title { font-size: 18px; font-weight: 750; letter-spacing: -.03em; } | |||
.fbn-mainpage .fbn-more { font-size: 13px; font-weight: 650; white-space: nowrap; } | |||
.fbn-mainpage .fbn-more a { color: var(--fbn-ink) !important; } | |||
.fbn-mainpage .fbn-notices, .fbn-mainpage .fbn-community { display: flex; flex-direction: column; } | |||
.fbn-mainpage .fbn-notice-list { flex: 1; padding: 8px 24px; } | |||
.fbn-mainpage .fbn-notice-item { | |||
display: flex; align-items: center; justify-content: space-between; gap: 18px; | |||
position: relative; min-height: 50px; padding: 8px 0; | |||
} | |||
.fbn-mainpage .fbn-notice-subject { min-width: 0; font-size: 14px; font-weight: 650; } | |||
.fbn-mainpage .fbn-notice-subject a { | |||
display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; | |||
color: var(--fbn-ink) !important; | |||
} | |||
.fbn-mainpage .fbn-notice-subject a::after { content: ""; display: block !important; position: absolute; inset: 0; } | |||
.fbn-mainpage .fbn-notice-date { flex: none; white-space: nowrap; font-size: 13px; color: var(--fbn-muted); } | |||
.fbn-mainpage .fbn-notice-item:hover a, .fbn-mainpage .fbn-community-item:hover a { color: var(--fbn-link) !important; } | |||
.fbn-mainpage .fbn-community-list { flex: 1; padding: 8px 24px; } | |||
.fbn-mainpage .fbn-community-item { | |||
display: flex; align-items: center; justify-content: space-between; gap: 14px; | |||
min-height: 62px; position: relative; | |||
} | |||
.fbn-mainpage .fbn-community-label { font-size: 14px; font-weight: 650; } | |||
.fbn-mainpage .fbn-community-label a { color: var(--fbn-ink) !important; } | |||
.fbn-mainpage .fbn-community-label a::after { content: ""; display: block !important; position: absolute; inset: 0; } | |||
.fbn-mainpage .fbn-community-icon { flex: none; pointer-events: none; } | |||
.fbn-mainpage .fbn-community-icon img { width: 32px; height: 32px; object-fit: contain; vertical-align: middle; } | |||
.fbn-mainpage .fbn-card-footnote { | |||
padding: 12px 24px; border-top: 1px solid var(--fbn-border); | |||
font-size: 11px; color: var(--fbn-muted); line-height: 1.6; | |||
} | |||
.fbn-mainpage .fbn-resource { padding: 22px 24px; } | |||
.fbn-mainpage .fbn-resource-title { display: flex; gap: 15px; align-items: center; margin-bottom: 14px; } | |||
.fbn-mainpage .fbn-resource-icon { flex: none; display: flex; align-items: center; justify-content: center; width: 54px; height: 54px; } | |||
.fbn-mainpage .fbn-resource-icon img { width: 48px; height: 48px; object-fit: contain; } | |||
.fbn-mainpage .fbn-resource-label { flex: 1; min-width: 0; font-size: 18px; font-weight: 750; letter-spacing: -.025em; } | |||
.fbn-mainpage .fbn-resource-label a { color: var(--fbn-ink) !important; } | |||
.fbn-mainpage .fbn-resource-chevron { color: var(--fbn-muted); font: 24px/1 sans-serif; } | |||
.fbn-mainpage .fbn-resource-links { font-size: 13px; line-height: 1.9; color: var(--fbn-muted); } | |||
.fbn-mainpage .fbn-resource-links a { color: var(--fbn-link) !important; white-space: nowrap; } | |||
.fbn-mainpage .fbn-resource-links a:hover { text-decoration: underline !important; } | |||
.fbn-mainpage .fbn-resource-details { display: inline-block; } | |||
/* 현재 Liberty 스킨의 대문 문서 테두리만 정리합니다. 다른 문서에는 적용하지 않습니다. */ | |||
body.Liberty.fbn-mainpage-view .content-wrapper .liberty-content { | |||
border: 0 !important; background: transparent !important; box-shadow: none !important; | |||
} | |||
body.Liberty.fbn-mainpage-view .content-wrapper .liberty-content-main { padding: 0 !important; background: transparent !important; } | |||
body.Liberty.fbn-mainpage-view .catlinks, | |||
body.Liberty.fbn-mainpage-view .footer-info { display: none; } | |||
/* 문서 편집 메뉴와 사이트 공지는 유지합니다. */ | |||
body.Liberty.fbn-mainpage-view .titleCover { display: flex; } | |||
body.Liberty.fbn-mainpage-view .titleCover .title-primary { display: none; } | |||
body.Liberty.fbn-mainpage-view .liberty-content-header { margin-bottom: 12px; } | |||
@media (max-width: 767px) { | |||
.fbn-mainpage { gap: 16px; } | |||
.fbn-mainpage .fbn-information-grid, .fbn-mainpage .fbn-resource-grid { grid-template-columns: 1fr; gap: 16px; } | |||
.fbn-mainpage .fbn-copy { left: 48px; right: 48%; bottom: 20px; gap: 7px; } | |||
.fbn-mainpage .fbn-headline { font-size: clamp(18px, 4.5vw, 30px); } | |||
.fbn-mainpage .fbn-eyebrow { font-size: 10px; } | |||
.fbn-mainpage .fbn-subtitle { display: none; } | |||
.fbn-mainpage .fbn-controls { left: 8px; right: 8px; } | |||
.fbn-mainpage .fbn-controls button { width: 30px; height: 30px; font-size: 22px; } | |||
@media(max-width: | .fbn-mainpage .fbn-status, .fbn-mainpage .fbn-playback { bottom: 8px; padding: 2px 8px; font-size: 10px; } | ||
@media | .fbn-mainpage .fbn-playback { left: 12px; } | ||
.fbn-mainpage .fbn-status { right: 12px; } | |||
.fbn-mainpage .fbn-dots { bottom: 8px; } | |||
.fbn-mainpage .fbn-card-header { padding: 15px 20px; min-height: 56px; } | |||
.fbn-mainpage .fbn-notice-list, .fbn-mainpage .fbn-community-list { padding: 8px 20px; } | |||
.fbn-mainpage .fbn-card-title, .fbn-mainpage .fbn-resource-label { font-size: 17px; } | |||
.fbn-mainpage .fbn-community-item { min-height: 55px; } | |||
.fbn-mainpage .fbn-notice-item { align-items: flex-start; gap: 8px; padding: 12px 0; } | |||
.fbn-mainpage .fbn-notice-subject { font-size: 13px; } | |||
.fbn-mainpage .fbn-notice-date { font-size: 11px; padding-top: 2px; } | |||
.fbn-mainpage .fbn-resource { padding: 20px; } | |||
.fbn-mainpage .fbn-card-footnote { padding: 12px 20px; } | |||
} | |||
@media (max-width: 359px) { | |||
.fbn-mainpage .fbn-copy { left: 42px; right: 43%; gap: 4px; } | |||
.fbn-mainpage .fbn-headline { font-size: 16px; } | |||
.fbn-mainpage .fbn-eyebrow { font-size: 9px; letter-spacing: 0; } | |||
.fbn-mainpage .fbn-notice-item { display: block; } | |||
.fbn-mainpage .fbn-notice-date { display: block; margin-top: 3px; } | |||
} | |||
@media print { | |||
.fbn-mainpage .fbn-controls, .fbn-mainpage .fbn-playback, .fbn-mainpage .fbn-dots, .fbn-mainpage .fbn-status { display: none; } | |||
.fbn-mainpage .fbn-card { break-inside: avoid; } | |||
} | |||
2026년 10월 12일 (월) 17:31 기준 최신판
.nob {
margin-top: 4px;
margin-bottom: 4px;
}
.ind {
font-size: 14px;
color : #4a4a4a;
margin-left: 18px;
margin-top: 4px;
margin-bottom: 4px;
}
.nob2 {
margin-top: -3px;
}
.mw-headline #toc a {
margin-right: 6px;
}
li > ul {
margin-top: 2px !important;
margin-bottom: 2px !important;
}
li > ul > li {
margin-top: 2px !important;
margin-bottom: 2px !important;
}
.mw-parser-output > h2, h3 {
margin-top: 32px !important;
}
h2 .mw-headline a[href="#toc"],
h3 .mw-headline a[href="#toc"],
h4 .mw-headline a[href="#toc"] {
margin-right: 5px;
}
.mw-custom-collapse-viewport {
overflow: hidden;
width: 100%;
}
.mw-custom-collapse-viewport-inner {
width: 100%;
}
/* 부드러운 접기/펼치기 */
.smooth-collapse {
display: grid;
grid-template-rows: 1fr;
transition: grid-template-rows 0.35s ease;
}
.smooth-collapse > .smooth-collapse-inner {
overflow: hidden;
min-height: 0;
}
.smooth-collapse.is-collapsed {
grid-template-rows: 0fr;
}
/* 선택사항: 내용도 살짝 페이드 */
.smooth-collapse > .smooth-collapse-inner {
opacity: 1;
transition: opacity 0.25s ease;
}
.smooth-collapse.is-collapsed > .smooth-collapse-inner {
opacity: 0;
}
/* 펼치기 · 접기 내부 표의 좌우 외곽선 제거 */
.mw-collapsible-content > table {
border-left: none !important;
border-right: none !important;
}
.mw-collapsible-content > table > tbody > tr > :first-child {
border-left: none !important;
}
.mw-collapsible-content > table > tbody > tr > :last-child {
border-right: none !important;
}
:root {
--fbnw-theme-010: #101012;
--fbnw-theme-020: #202022;
--fbnw-theme-030: #303032;
--fbnw-theme-040: #404042;
--fbnw-theme-050: #505052;
}
html.liberty-dark-mode .dark\:fbnw-theme-010,
body.liberty-dark-mode .dark\:fbnw-theme-010 {
background: var(--fbnw-theme-010) !important;
}
html.liberty-dark-mode .dark\:fbnw-theme-020,
body.liberty-dark-mode .dark\:fbnw-theme-020 {
background: var(--fbnw-theme-020) !important;
}
html.liberty-dark-mode .dark\:fbnw-theme-030,
body.liberty-dark-mode .dark\:fbnw-theme-030 {
background: var(--fbnw-theme-030) !important;
}
html.liberty-dark-mode .dark\:fbnw-theme-040,
body.liberty-dark-mode .dark\:fbnw-theme-040 {
background: var(--fbnw-theme-040) !important;
}
html.liberty-dark-mode .dark\:fbnw-theme-050,
body.liberty-dark-mode .dark\:fbnw-theme-050 {
background: var(--fbnw-theme-050) !important;
}
/* 실제 문서에서 사용하는 유틸리티 */
.inline-block {
display: inline-block;
vertical-align: top;
box-sizing: border-box;
}
.flex {
display: flex;
}
.flex-col {
flex-direction: column;
}
.w-screen {
width: 100%;
}
/* 접혀 있을 때는 2개가 좌우로 */
.inline-block {
width: 49%;
}
/* 자기 안의 접기 영역이 펼쳐지면 전체 폭 */
.inline-block:has(
.mw-collapsible:not(.mw-collapsed)
) {
width: 100%;
}
/* 첫 번째 영역이 펼쳐졌을 경우,
바로 뒤의 두 번째 영역도 다음 줄 전체 폭으로 */
.inline-block:has(
.mw-collapsible:not(.mw-collapsed)
) + .inline-block {
width: 100%;
}
/* 펼쳐지는 실제 내용도 전체 폭 */
.inline-block .mw-collapsible,
.inline-block .mw-collapsible-content {
width: 100%;
box-sizing: border-box;
}
/* dark:!border-y-[색상] 형태 전부 */
html.liberty-dark-mode [class*="dark:!border-y-["],
body.liberty-dark-mode [class*="dark:!border-y-["] {
border-top-color: #444444 !important;
border-bottom-color: #444444 !important;
}
/* dark:!border-r-[색상] 형태 전부 */
html.liberty-dark-mode [class*="dark:!border-r-["],
body.liberty-dark-mode [class*="dark:!border-r-["] {
border-right-color: #444444 !important;
}
/* 기본 표시 상태 */
.inline {
display: inline;
}
.hidden {
display: none;
}
/* Liberty 다크모드 */
html.liberty-dark-mode .dark\:hidden,
body.liberty-dark-mode .dark\:hidden {
display: none !important;
}
html.liberty-dark-mode .dark\:inline,
body.liberty-dark-mode .dark\:inline {
display: inline !important;
}
/* 접이식 영역 내부 표의 맨 아래 선 제거 */
.mw-collapsible-content > table.wikitable {
border-bottom: 0 !important;
}
.mw-collapsible-content > table.wikitable > tbody > tr:last-child > th,
.mw-collapsible-content > table.wikitable > tbody > tr:last-child > td {
border-bottom: 0 !important;
}
.fbn-terms li {
margin-bottom: 0.2em;
}
.fbn-terms > ul > li > ol {
margin-top: 0.2em;
}
.fbnw-portal{font:15px/1.6 var(--fb-font,system-ui);color:var(--fb-text,#212529)}.fbnw-portal *{box-sizing:border-box}.fbnw-portal a{color:var(--fb-link,#275cf6);text-decoration:none}.fbnw-portal a:hover{text-decoration:underline}.fbnw-portal .portal-slider{position:relative;border-radius:var(--fb-radius,12px);overflow:hidden}.fbnw-portal .portal-slides{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}.fbnw-portal .portal-slide{position:relative;flex:0 0 100%;scroll-snap-align:start;min-height:340px;padding:44px;background:linear-gradient(120deg,#102951,#275cf6);color:white;overflow:hidden}.fbnw-portal .portal-slide:nth-child(2){background:linear-gradient(120deg,#153c3e,#268276)}.fbnw-portal .portal-slide:nth-child(3){background:linear-gradient(120deg,#332244,#7b4b9e)}.fbnw-portal .portal-slide:after{content:attr(data-art);position:absolute;right:20px;bottom:-30px;font-size:130px;line-height:1;font-weight:850;opacity:.08;pointer-events:none}.fbnw-portal .portal-badge{display:inline-block;border:1px solid #ffffff60;border-radius:4px;padding:1px 6px;font-size:11px;letter-spacing:.08em}.fbnw-portal .portal-headline{display:block;margin:20px 0 12px;font-size:clamp(28px,4vw,42px);font-weight:750;line-height:1.23;letter-spacing:-.035em}.fbnw-portal .portal-slide-description{display:block;color:#ffffffd9;font-size:16px}.fbnw-portal .portal-slide-author{display:block;margin-top:20px;font-size:12px;color:#ffffffb8}.fbnw-portal .portal-slide-link{display:block;position:relative;z-index:1;margin-top:14px}.fbnw-portal .portal-slide-link a{color:white;font-weight:650}.fbnw-portal .portal-controls{display:flex;align-items:center;gap:8px;position:absolute;bottom:18px;right:18px;z-index:2}.fbnw-portal .portal-controls button{border:1px solid #ffffff50;background:#0003;color:white;border-radius:8px;width:34px;height:34px;cursor:pointer;font:inherit}.fbnw-portal .portal-controls span{font-size:12px;color:white;padding-right:5px}.fbnw-portal .portal-section-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:28px 0 14px}.fbnw-portal .portal-section-title{font-size:22px;font-weight:700}.fbnw-portal .portal-section-head a{font-size:13px}.fbnw-portal .portal-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.fbnw-portal .portal-card{border:1px solid var(--fb-line,#e5e8eb);border-radius:12px;overflow:hidden;background:var(--fb-surface,#fff)}.fbnw-portal .portal-card-info{padding:16px}.fbnw-portal .portal-card-author{display:block;font-size:11px;color:var(--fb-text-muted,#626c7a)}.fbnw-portal .portal-pill{display:inline-block;margin-left:5px;padding:1px 5px;border-radius:4px;background:var(--fb-brand-tint,#eef3ff);color:var(--fb-brand,#275cf6);font-size:10px}.fbnw-portal .portal-card-title{display:block;margin:7px 0;font-size:18px;font-weight:700}.fbnw-portal .portal-card-title a{color:var(--fb-text-strong,#000)}.fbnw-portal .portal-card-category{font-size:12px;color:var(--fb-text-muted,#626c7a)}.fbnw-portal .portal-card-cover{height:180px;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,#d9e5ff,#a3bff5);color:#34538f;font-size:36px;font-weight:800;letter-spacing:-.04em}.fbnw-portal .portal-card:nth-child(2n) .portal-card-cover{background:linear-gradient(145deg,#d4ebe1,#94c6b3);color:#316352}.fbnw-portal .portal-bottom{display:grid;grid-template-columns:1.5fr 1fr;gap:16px;margin-top:28px}.fbnw-portal .portal-panel{border:1px solid var(--fb-line,#e5e8eb);border-radius:12px;background:var(--fb-surface,#fff);padding:22px}.fbnw-portal .portal-panel-title{display:block;font-weight:700;font-size:19px;margin-bottom:10px}.fbnw-portal .portal-line{padding:10px 0;border-bottom:1px solid var(--fb-line,#e5e8eb);font-size:14px}.fbnw-portal .portal-line:last-child{border:0}.fbnw-portal .portal-shortcuts{display:grid;grid-template-columns:1fr 1fr;gap:10px}.fbnw-portal .portal-shortcuts>div{padding:12px;background:var(--fb-surface-2,#f2f3f5);border-radius:8px;font-size:13px}.fbnw-portal a:focus-visible,.fbnw-portal button:focus-visible{outline:2px solid var(--fb-brand,#275cf6);outline-offset:3px}html.liberty-dark-mode .fbnw-portal .portal-card-cover{filter:brightness(.7)}@media(max-width:1023px){.fbnw-portal .portal-cards{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}.fbnw-portal .portal-card{flex:0 0 225px;scroll-snap-align:start}.fbnw-portal .portal-bottom{grid-template-columns:1fr}}@media(max-width:600px){.fbnw-portal .portal-slide{min-height:290px;padding:28px 22px 65px}.fbnw-portal .portal-section-title{font-size:19px}.fbnw-portal .portal-card{flex-basis:205px}.fbnw-portal .portal-card-cover{height:160px}.fbnw-portal .portal-panel{padding:18px}}@media(prefers-reduced-motion:reduce){.fbnw-portal .portal-slides{scroll-behavior:auto}}
/* 프벤위키 대문 · 미디어위키:Common.css의 기존 내용 맨 아래에 추가 */
/* fbn-mainpage 내부에만 적용합니다. 스킨 소스와 PHP 변경은 필요 없습니다. */
.fbn-mainpage {
--fbn-surface: var(--fb-surface, #fff);
--fbn-muted-surface: var(--fb-surface-2, #f8f9fa);
--fbn-ink: var(--fb-text-strong, #17202e);
--fbn-muted: var(--fb-text-muted, #8b919b);
--fbn-border: var(--fb-line, #e9ecef);
--fbn-link: var(--fb-link, #0054f7);
display: flex;
flex-direction: column;
gap: 20px;
min-width: 0;
color: var(--fbn-ink);
font-family: var(--fb-font, Pretendard, "Noto Sans KR", "Malgun Gothic", sans-serif);
font-size: 15px;
line-height: 1.6;
}
html.liberty-dark-mode .fbn-mainpage, html.dark .fbn-mainpage {
--fbn-surface: var(--fb-surface, #202027);
--fbn-muted-surface: var(--fb-surface-2, #2c2c35);
--fbn-ink: var(--fb-text-strong, #ededf0);
--fbn-muted: var(--fb-text-muted, #a0a0ab);
--fbn-border: var(--fb-line, #3c3c47);
--fbn-link: var(--fb-link, #7aabff);
}
.fbn-mainpage, .fbn-mainpage * { box-sizing: border-box; }
.fbn-mainpage p { margin: 0 !important; }
.fbn-mainpage a { text-decoration: none !important; }
.fbn-mainpage a.external { padding: 0 !important; background: none !important; }
.fbn-mainpage a.external::before, .fbn-mainpage a.external::after { display: none !important; }
.fbn-mainpage a:focus-visible, .fbn-mainpage button:focus-visible {
outline: 3px solid #7aabff; outline-offset: 3px;
}
.fbn-mainpage .fbn-slider {
position: relative; overflow: hidden; border-radius: 12px;
background: #142442; isolation: isolate;
}
.fbn-mainpage .fbn-track {
display: flex; width: 100%; overflow-x: auto; scroll-snap-type: x mandatory;
scrollbar-width: none; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch;
}
.fbn-mainpage .fbn-track::-webkit-scrollbar { display: none; }
.fbn-mainpage .fbn-slide {
flex: 0 0 100%; min-width: 0; position: relative; aspect-ratio: 12 / 5;
scroll-snap-align: start; scroll-snap-stop: always; overflow: hidden;
}
.fbn-mainpage .fbn-banner-image { position: absolute; inset: 0; }
.fbn-mainpage .fbn-banner-image > p,
.fbn-mainpage .fbn-banner-image > span,
.fbn-mainpage .fbn-banner-image a { display: block; width: 100%; height: 100%; }
.fbn-mainpage .fbn-banner-image img {
display: block; width: 100% !important; height: 100% !important;
max-width: none; object-fit: cover;
}
.fbn-mainpage .fbn-slide::after {
content: ""; position: absolute; inset: 0; pointer-events: none;
background: linear-gradient(90deg, rgba(0, 0, 0, .22), transparent 60%);
}
.fbn-mainpage .fbn-copy {
position: absolute; z-index: 1; inset: 0 53% 20px 58px;
display: flex; flex-direction: column; justify-content: center; align-items: flex-start;
gap: 12px; color: #fff; pointer-events: none; text-shadow: 0 2px 8px #0003;
}
.fbn-mainpage .fbn-eyebrow { font-size: 12px; font-weight: 600; letter-spacing: .07em; opacity: .85; }
.fbn-mainpage .fbn-headline { font-size: clamp(22px, 3vw, 38px); font-weight: 800; line-height: 1.3; letter-spacing: -.045em; }
.fbn-mainpage .fbn-subtitle { font-size: 14px; opacity: .82; }
.fbn-mainpage .fbn-slide-link { position: absolute; z-index: 2; inset: 0; }
.fbn-mainpage .fbn-slide-link > p { height: 100%; }
.fbn-mainpage .fbn-slide-link a { display: block; height: 100%; font-size: 0; color: transparent; }
.fbn-mainpage .fbn-controls {
position: absolute; z-index: 3; inset: 50% 12px auto;
transform: translateY(-50%); display: flex; justify-content: space-between; pointer-events: none;
}
.fbn-mainpage .fbn-controls button {
pointer-events: auto; width: 38px; height: 38px; padding: 0; border: 0; border-radius: 50%;
background: #0005; color: #fff; cursor: pointer; font: 26px/1 sans-serif;
}
.fbn-mainpage .fbn-controls button:hover { background: #0009; }
.fbn-mainpage .fbn-status, .fbn-mainpage .fbn-playback {
position: absolute; z-index: 3; bottom: 14px; background: #0006; color: #fff;
border: 1px solid #ffffff26; border-radius: 20px; padding: 4px 10px;
font-family: inherit; line-height: 1.5; font-size: 11px;
}
.fbn-mainpage .fbn-status { right: 16px; }
.fbn-mainpage .fbn-playback { left: 16px; cursor: pointer; }
.fbn-mainpage .fbn-playback:disabled { cursor: default; opacity: .7; }
.fbn-mainpage .fbn-dots {
display: flex; gap: 7px; position: absolute; z-index: 3; bottom: 17px;
left: 50%; transform: translateX(-50%);
}
.fbn-mainpage .fbn-dots button {
width: 20px; height: 20px; padding: 5px; border: 0; background: transparent; cursor: pointer;
}
.fbn-mainpage .fbn-dots button::before {
content: ""; display: block; width: 8px; height: 8px; border-radius: 50%; background: #ffffff66;
}
.fbn-mainpage .fbn-dots button[aria-current="true"]::before { background: #fff; }
.fbn-mainpage .fbn-information-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: 18px; }
.fbn-mainpage .fbn-resource-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.fbn-mainpage .fbn-card {
min-width: 0; overflow: hidden; border: 1px solid var(--fbn-border); border-radius: 10px;
background: var(--fbn-surface); box-shadow: 0 3px 12px #10203006;
}
.fbn-mainpage .fbn-card-header {
display: flex; align-items: center; justify-content: space-between; gap: 12px;
min-height: 60px; padding: 16px 24px; background: var(--fbn-muted-surface);
}
.fbn-mainpage .fbn-card-title { font-size: 18px; font-weight: 750; letter-spacing: -.03em; }
.fbn-mainpage .fbn-more { font-size: 13px; font-weight: 650; white-space: nowrap; }
.fbn-mainpage .fbn-more a { color: var(--fbn-ink) !important; }
.fbn-mainpage .fbn-notices, .fbn-mainpage .fbn-community { display: flex; flex-direction: column; }
.fbn-mainpage .fbn-notice-list { flex: 1; padding: 8px 24px; }
.fbn-mainpage .fbn-notice-item {
display: flex; align-items: center; justify-content: space-between; gap: 18px;
position: relative; min-height: 50px; padding: 8px 0;
}
.fbn-mainpage .fbn-notice-subject { min-width: 0; font-size: 14px; font-weight: 650; }
.fbn-mainpage .fbn-notice-subject a {
display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
color: var(--fbn-ink) !important;
}
.fbn-mainpage .fbn-notice-subject a::after { content: ""; display: block !important; position: absolute; inset: 0; }
.fbn-mainpage .fbn-notice-date { flex: none; white-space: nowrap; font-size: 13px; color: var(--fbn-muted); }
.fbn-mainpage .fbn-notice-item:hover a, .fbn-mainpage .fbn-community-item:hover a { color: var(--fbn-link) !important; }
.fbn-mainpage .fbn-community-list { flex: 1; padding: 8px 24px; }
.fbn-mainpage .fbn-community-item {
display: flex; align-items: center; justify-content: space-between; gap: 14px;
min-height: 62px; position: relative;
}
.fbn-mainpage .fbn-community-label { font-size: 14px; font-weight: 650; }
.fbn-mainpage .fbn-community-label a { color: var(--fbn-ink) !important; }
.fbn-mainpage .fbn-community-label a::after { content: ""; display: block !important; position: absolute; inset: 0; }
.fbn-mainpage .fbn-community-icon { flex: none; pointer-events: none; }
.fbn-mainpage .fbn-community-icon img { width: 32px; height: 32px; object-fit: contain; vertical-align: middle; }
.fbn-mainpage .fbn-card-footnote {
padding: 12px 24px; border-top: 1px solid var(--fbn-border);
font-size: 11px; color: var(--fbn-muted); line-height: 1.6;
}
.fbn-mainpage .fbn-resource { padding: 22px 24px; }
.fbn-mainpage .fbn-resource-title { display: flex; gap: 15px; align-items: center; margin-bottom: 14px; }
.fbn-mainpage .fbn-resource-icon { flex: none; display: flex; align-items: center; justify-content: center; width: 54px; height: 54px; }
.fbn-mainpage .fbn-resource-icon img { width: 48px; height: 48px; object-fit: contain; }
.fbn-mainpage .fbn-resource-label { flex: 1; min-width: 0; font-size: 18px; font-weight: 750; letter-spacing: -.025em; }
.fbn-mainpage .fbn-resource-label a { color: var(--fbn-ink) !important; }
.fbn-mainpage .fbn-resource-chevron { color: var(--fbn-muted); font: 24px/1 sans-serif; }
.fbn-mainpage .fbn-resource-links { font-size: 13px; line-height: 1.9; color: var(--fbn-muted); }
.fbn-mainpage .fbn-resource-links a { color: var(--fbn-link) !important; white-space: nowrap; }
.fbn-mainpage .fbn-resource-links a:hover { text-decoration: underline !important; }
.fbn-mainpage .fbn-resource-details { display: inline-block; }
/* 현재 Liberty 스킨의 대문 문서 테두리만 정리합니다. 다른 문서에는 적용하지 않습니다. */
body.Liberty.fbn-mainpage-view .content-wrapper .liberty-content {
border: 0 !important; background: transparent !important; box-shadow: none !important;
}
body.Liberty.fbn-mainpage-view .content-wrapper .liberty-content-main { padding: 0 !important; background: transparent !important; }
body.Liberty.fbn-mainpage-view .catlinks,
body.Liberty.fbn-mainpage-view .footer-info { display: none; }
/* 문서 편집 메뉴와 사이트 공지는 유지합니다. */
body.Liberty.fbn-mainpage-view .titleCover { display: flex; }
body.Liberty.fbn-mainpage-view .titleCover .title-primary { display: none; }
body.Liberty.fbn-mainpage-view .liberty-content-header { margin-bottom: 12px; }
@media (max-width: 767px) {
.fbn-mainpage { gap: 16px; }
.fbn-mainpage .fbn-information-grid, .fbn-mainpage .fbn-resource-grid { grid-template-columns: 1fr; gap: 16px; }
.fbn-mainpage .fbn-copy { left: 48px; right: 48%; bottom: 20px; gap: 7px; }
.fbn-mainpage .fbn-headline { font-size: clamp(18px, 4.5vw, 30px); }
.fbn-mainpage .fbn-eyebrow { font-size: 10px; }
.fbn-mainpage .fbn-subtitle { display: none; }
.fbn-mainpage .fbn-controls { left: 8px; right: 8px; }
.fbn-mainpage .fbn-controls button { width: 30px; height: 30px; font-size: 22px; }
.fbn-mainpage .fbn-status, .fbn-mainpage .fbn-playback { bottom: 8px; padding: 2px 8px; font-size: 10px; }
.fbn-mainpage .fbn-playback { left: 12px; }
.fbn-mainpage .fbn-status { right: 12px; }
.fbn-mainpage .fbn-dots { bottom: 8px; }
.fbn-mainpage .fbn-card-header { padding: 15px 20px; min-height: 56px; }
.fbn-mainpage .fbn-notice-list, .fbn-mainpage .fbn-community-list { padding: 8px 20px; }
.fbn-mainpage .fbn-card-title, .fbn-mainpage .fbn-resource-label { font-size: 17px; }
.fbn-mainpage .fbn-community-item { min-height: 55px; }
.fbn-mainpage .fbn-notice-item { align-items: flex-start; gap: 8px; padding: 12px 0; }
.fbn-mainpage .fbn-notice-subject { font-size: 13px; }
.fbn-mainpage .fbn-notice-date { font-size: 11px; padding-top: 2px; }
.fbn-mainpage .fbn-resource { padding: 20px; }
.fbn-mainpage .fbn-card-footnote { padding: 12px 20px; }
}
@media (max-width: 359px) {
.fbn-mainpage .fbn-copy { left: 42px; right: 43%; gap: 4px; }
.fbn-mainpage .fbn-headline { font-size: 16px; }
.fbn-mainpage .fbn-eyebrow { font-size: 9px; letter-spacing: 0; }
.fbn-mainpage .fbn-notice-item { display: block; }
.fbn-mainpage .fbn-notice-date { display: block; margin-top: 3px; }
}
@media print {
.fbn-mainpage .fbn-controls, .fbn-mainpage .fbn-playback, .fbn-mainpage .fbn-dots, .fbn-mainpage .fbn-status { display: none; }
.fbn-mainpage .fbn-card { break-inside: avoid; }
}