:root {
	--bg:#09090d;
	--panel:#111119;
	--panel-2:#151520;
	--text:#f4f4f6;
	--muted:#9d9da9;
	--line:rgba(255,255,255,0.07);
	--accent:#ff2e63;
	--accent-2:#9d4edd;
	--shadow:0 18px 42px rgba(0,0,0,0.35);
	--radius-lg:22px;
	--radius-md:16px;
	--radius-sm:12px;
	--max:1380px;
}

* {
	box-sizing:border-box;
}
html {
scroll-behavior:smooth;
}
body {
	margin:0;
	font-family:Inter, Pretendard, sans-serif;
	background:
	radial-gradient(circle at top right, rgba(157,78,221,0.12), transparent 24%),
	radial-gradient(circle at top left, rgba(255,46,99,0.12), transparent 24%),
	linear-gradient(180deg, #07070b, #09090d);
	color:var(--text);
}
a {
	color:inherit; text-decoration:none;
}
img {
	/*
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
	*/
}
button, input, select {
	font:inherit;
}

.shell {
	width:min(calc(100% - 32px), var(--max));
	margin:0 auto;
}

.header {
	position:sticky;
	top:0;
	z-index:30;
	padding:16px 0;
	backdrop-filter:blur(14px);
	background:rgba(9,9,13,0.6);
}
.header-inner {
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:16px;
	padding:14px 18px;
	border:1px solid var(--line);
	border-radius:30px;
	background:rgba(14,14,22,0.78);
	box-shadow:var(--shadow);
}
.logo {
	display:flex;
	align-items:flex-end;
	gap:5px;
	font-weight:800;
	letter-spacing:0.18em;
	white-space:nowrap;
	line-height:1.8em;
	order:1;
}
.logo-img {
	width:100px;
	height:100px;
	object-fit:contain;
	filter:drop-shadow(0 0 8px rgba(255,46,99,0.6));
	flex:0 0 auto;
}
.logo-dot {
	display:flex;
	align-items:center;
	gap:12px;
	font-weight:800;
	letter-spacing:0.18em;
	white-space:nowrap;
}
.logo-dot {
	width:14px;
	height:14px;
	border-radius:50%;
	background:linear-gradient(135deg, var(--accent), var(--accent-2));
	box-shadow:0 0 18px rgba(255,46,99,0.55);
	flex:0 0 auto;
}

.logo small {
	color:var(--muted);
	font-size:0.78rem;
	letter-spacing:0.12em;
}
.main-nav {
	flex:1 1 auto;
	display:flex;
	justify-content:center;
	order:2;
}
.nav-list {
	list-style:none;
	display:flex;
	align-items:center;
	gap:10px;
	padding:0;
	margin:0;
	flex-wrap:wrap;
}
.nav-list a {
	display:inline-flex;
	justify-content:center;
	align-items:center;
	min-width:100px;
	min-height:40px;
	padding:0 14px;
	border-radius:5px;
	transition:0.25s ease;
	background:rgb(255 46 99 / 5%);
	border:1px solid rgb(255 46 99 / 20%);
	color:#ffffff;
}
.nav-list a:hover {
	background:linear-gradient(135deg, var(--accent), var(--accent-2));
	box-shadow:0 10px 24px rgba(255, 46, 99, 0.26);
	color:#ffffff;
}
.header-tools {
	display:flex;
	gap:10px;
	align-items:center;
	flex-wrap:wrap;
	justify-content:flex-end;
	flex-direction:column;
	margin-right:10px;
	order:3;
}
.search {
	display:flex;
	align-items:center;
	gap:8px;
	background:rgba(255,255,255,0.05);
	border:1px solid var(--line);
	border-radius:999px;
	padding:0px;
}
.search input {
	width:150px;
	border:0;
	outline:none;
	background:transparent;
	color:var(--text);
	padding:0 15px;
	text-align:center;
}

.select, .btn {
	min-height:40px;
	border-radius:999px;
	border:1px solid var(--line);
	background:rgba(255,255,255,0.05);
	color:var(--text);
	padding:0 14px;
}
.btn:hover {
	color:var(--text);
}
.link_landing {
	display:block;
	width:100%;
	line-height:40px;
	text-align:center;
	border:2px solid #ff0000;
	background-color:#ff5555;
}
.link_telegram {
	display:block;
	width:100%;
	line-height:40px;
	text-align: center;
	border:2px solid #006a9f;
	background-color: #25a4e3;
}
.btn-primary {
	background:linear-gradient(135deg, var(--accent), var(--accent-2));
	border:0;
	box-shadow:0 10px 24px rgba(255,46,99,0.26);
}

.hero {
	min-height:74vh;
	display:grid;
	grid-template-columns:1fr 0.92fr;
	gap:24px;
	align-items:stretch;
	margin-top:10px;
}
.hero-copy, .hero-visual {
	border:1px solid var(--line);
	border-radius:32px;
	overflow:hidden;
	background:linear-gradient(180deg, rgba(18,18,28,0.92), rgba(10,10,16,0.98));
	box-shadow:var(--shadow);
}
.hero-copy {
	padding:56px;
	display:flex;
	flex-direction:column;
	justify-content:center;
	background:
	radial-gradient(circle at 20% 20%, rgba(255,46,99,0.16), transparent 28%),
	linear-gradient(180deg, rgba(18,18,28,0.92), rgba(10,10,16,0.98));
}
.hero-kicker {
	color:#ffdce7;
	margin:0 0 14px;
	text-transform:uppercase;
	letter-spacing:0.22em;
	font-size:0.78rem;
	font-weight:700;
}
.hero-title {
	margin:0;
	font-size:clamp(2.8rem, 6vw, 5rem);
	line-height:0.95;
	letter-spacing:-0.05em;
	max-width:9ch;
}
.hero-sub {
	margin:18px 0 0;
	color:#bebeca;
	line-height:1.8;
	max-width:52ch;
}
.hero-actions {
	display:flex;
	gap:12px;
	flex-wrap:wrap;
	margin-top:28px;
}
.hero-notes {
	display:grid;
	grid-template-columns:repeat(3, minmax(0, 1fr));
	gap:12px;
	margin-top:24px;
}
.hero-note {
	padding:14px 16px;
	background:rgba(255,255,255,0.05);
	border:1px solid var(--line);
	border-radius:var(--radius-md);
	color:#d9d9e2;
	font-size:0.92rem;
	line-height:1.6;
}
.hero-visual {
	position:relative;
	min-height:640px;
	background:
	linear-gradient(180deg, rgba(0,0,0,0.12), rgba(0,0,0,0.48)),
	url('https://images.unsplash.com/photo-1496747611176-843222e1e57c?auto=format&fit=crop&w=1600&q=80') center/cover;
}
.hero-visual::after {
	content:"Midnight Gallery";
	position:absolute;
	left:24px;
	bottom:24px;
	min-height:42px;
	display:inline-flex;
	align-items:center;
	padding:0 16px;
	border-radius:999px;
	background:rgba(10,10,16,0.62);
	border:1px solid rgba(255,255,255,0.12);
	backdrop-filter:blur(10px);
	color:#fff;
	letter-spacing:0.08em;
	font-size:0.82rem;
}

.section {
	margin-top: 15px;
	margin-bottom: 15px;
}
.section-head {
	display:flex;
	justify-content:space-between;
	gap:16px;
	align-items:center;
	margin-bottom:18px;
}
.section-head h2 {
	margin:0;
	font-size:clamp(1.3rem, 2vw, 1.9rem);
	letter-spacing:-0.03em;
}
.section-head h2 a:hover {
	color:var(--accent);
}
.section-head p {
	margin:4px 0 0;
	color:var(--muted);
	font-size:0.92rem;
}

.chips {
	display:flex;
	gap:10px;
	flex-wrap:wrap;
}
.chip {
	min-height:40px;
	padding:0 14px;
	border-radius:999px;
	border:1px solid var(--line);
	background:rgba(255,255,255,0.05);
	color:#dfdfe7;
	cursor:pointer;
}
.chip.active {
	background:linear-gradient(135deg, rgba(255,46,99,0.18), rgba(157,78,221,0.18));
	border-color:rgba(255,46,99,0.2);
}

.grid {
	display:grid;
	grid-template-columns:repeat(4, minmax(0, 1fr));
	gap:20px;
}

.card {
	overflow:hidden;
	border-radius:20px;
	background:linear-gradient(180deg, rgba(20,20,28,0.92), rgba(12,12,18,0.98));
	border:1px solid var(--line);
	box-shadow:var(--shadow) !important;
	transition:transform 0.24s ease, box-shadow 0.24s ease;
}
.card:hover {
	transform:translateY(-4px);
	box-shadow:0 22px 46px rgba(0,0,0,0.38), 0 0 0 1px rgba(255,46,99,0.08), 0 0 28px rgba(255,46,99,0.08);
}
.thumb {
	position:relative;
	aspect-ratio:16/10;
	overflow:hidden;
	background:linear-gradient(135deg, #1b1b25, #0d0d13);
}
.thumb img {
	transition:transform 0.45s ease;
}
.card:hover .thumb img {
	transform:scale(1.05);
}

.badge, .duration, .rank {
	position:absolute;
	z-index:2;
	min-height:30px;
	padding:0 10px;
	display:inline-flex;
	align-items:center;
	border-radius:999px;
	font-size:0.76rem;
	backdrop-filter:blur(10px);
}
.badge {
	left:12px;
	top:12px;
	background:rgba(255,255,255,0.12);
	border:1px solid rgba(255,255,255,0.12);
}
.duration {
	right:12px;
	bottom:12px;
	background:rgba(10,10,16,0.64);
	border:1px solid rgba(255,255,255,0.1);
}
.rank {
	right:12px;
	top:12px;
	background:linear-gradient(135deg, rgba(255,46,99,0.92), rgba(157,78,221,0.92));
	box-shadow:0 8px 18px rgba(255,46,99,0.22);
	font-weight:700;
}
.card-body {
	padding:14px;
}

.meta-title {
	width:100%;
	margin:0;
	font-size:1rem;
	letter-spacing:-0.02em;
}
.meta-sub {
	margin:8px 0 0;
	color:var(--muted);
	font-size:0.9rem;
}
.banner .meta-title {
	width:100%;
	margin:10px 0px 0px 0px;
	font-size:2rem;
	letter-spacing:-0.02em;
}
.controls {
	display:flex;
	gap:10px;
	flex-wrap:wrap;
	align-items:center;
}
.load-more-wrap {
	display:flex;
	justify-content:center;
	margin-top:22px;
}

#bo_search select, #bo_search input {
	background-color:#000000;
	color:#ffffff;
	border:1px solid #272727;
}
#bo_search button.search {
	min-height:34px;
	height:34px;
}

.panel-title {
	border-radius:24px;
	border:1px solid rgba(255,255,255,0.06);
	background:linear-gradient(180deg, rgba(20,20,28,0.9), rgba(14,14,20,0.98));
	box-shadow:var(--shadow-soft);
	padding:26px;
	margin-bottom:15px;
	background:radial-gradient(circle at 85% 20%, rgba(255,46,99,0.18), transparent 28%), linear-gradient(135deg, rgba(255,46,99,0.08), rgba(157,78,221,0.08)), linear-gradient(180deg, rgba(20,20,28,0.9), rgba(14,14,20,0.98));
}
.panel-title h1 {
}
.panel-title h1 a:hover {
	color:var(--accent);
}
.panel-title p {
	margin:0;
	color:var(--muted);
	line-height:1.7;
	margin-bottom:5px;
}
.panel-title select, .panel-title input {
	background-color:#000000;
	color:#ffffff;
	border:1px solid #272727;
}
.panel-title button.search {
	min-height:31px;
	height:31px;
	margin-top:1px;
}
.panel-title h2 {
}
.panel-title h2 a:hover {
	color:var(--accent);
}

.brand-tone-card, .copy-card {
	border-radius:24px;
	border:1px solid rgba(255,255,255,0.06);
	background:linear-gradient(180deg, rgba(20,20,28,0.9), rgba(14,14,20,0.98));
	box-shadow:var(--shadow-soft);
	padding:26px;
	margin-bottom:15px;
}
.brand-tone-card h3, .copy-card h3 {
	margin: 0 0 14px;
	font-size: 1.08rem;
}
.brand-tone-list, .copy-lines {
	display: grid;
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.brand-tone-list li, .copy-lines li {
	padding: 14px 16px;
	border-radius: 16px;
	background: rgba(255,255,255,0.04);
	color: #dddde5;
	line-height: 1.7;
}
.brand-tone-card a:hover {
	color:var(--accent);
}

.hero-section {
	width:min(calc(100% - 40px), var(--max-width));
	margin-left:auto;
	margin-right:auto;
}

.hero-section {
	position:relative;
	display:grid;
	grid-template-columns:1.3fr 1fr;
	align-items:stretch;
	/*min-height:620px;
	margin-top:24px;*/
	overflow:hidden;
	border-radius:34px;
	background:linear-gradient(135deg, rgba(255,255,255,0.03), rgba(255,255,255,0.015));
	border:1px solid var(--border);
	box-shadow:var(--shadow);
}
.hero-section {
	grid-template-columns:1fr;
	/*min-height:540px;*/
}
.hero-overlay {
	background:radial-gradient(circle at 72% 32%, rgba(255,46,99,0.22), transparent 28%);
}

#bo_btn_top .btn-group a:hover {
	color:#ffffff;
    background-color:#2196F3;
}
#bo_btn_top .btn-group button {
	color:#ffffff;
	border:1px solid var(--line);
}
#bo_btn_top .btn-group button:hover {
	color:#ffffff;
    background-color:#2196F3;
}
#bbs_btn_setup {
	border-radius:5px;
	min-height:30px;
	width:30px;
	height:30px;
	border:1px solid var(--line);
	background:rgba(255, 255, 255, 0.05);
	color:var(--muted);
}
#btn_btn_setup_option button {
	background-color:#000000;
}
#bbs_btn_sort {
	border-radius:5px;
	min-height:30px;
	width:30px;
	height:30px;
	border:1px solid var(--line);
	background:rgba(255, 255, 255, 0.05);
	color:var(--muted);
}
#bbs_btn_search:hover {
	color:#ffffff;
	background-color:#2196F3;
}

.side-panel {
	border-radius:24px;
	border:1px solid rgba(255,255,255,0.06);
	background:linear-gradient(180deg, rgba(20,20,28,0.9), rgba(14,14,20,0.98));
	box-shadow:var(--shadow-soft);
}
.side-panel {
	padding:22px;
	display:grid;
	gap:20px;
	align-content:start;
}
.side-block h3 {
	margin:0 0 12px;
	font-size:1.02rem;
}
.side-block ul {
	list-style:none;
	margin:0;
	padding:0;
	display:grid;
	gap:10px;
}
.side-block a {
	display:block;
	padding:12px 14px;
	border-radius:14px;
	color:#d7d7de;
	background:rgba(255,255,255,0.04);
	transition:0.25s ease;
}
.side-block a:hover {
	background:rgba(255, 46, 99, 0.12);
	color:#fff;
}
	
/*
.modal {

	position:fixed;
	inset:0;
	background:rgba(0,0,0,0.68);
	display:none;
	align-items:center;
	justify-content:center;
	padding:20px;
	z-index:100;
	backdrop-filter:blur(10px);
}
.modal.open {
	display:flex;
}
*/
.modal-box {
	width:min(1100px, 100%);
	display:grid;
	grid-template-columns:1.15fr 0.85fr;
	gap:0;
	overflow:hidden;
	border-radius:28px;
	background:linear-gradient(180deg, rgba(18,18,26,0.98), rgba(10,10,14,0.99));
	border:1px solid rgba(255,255,255,0.08);
	box-shadow:0 30px 80px rgba(0,0,0,0.48);
}
.modal-media {
	min-height:560px;
	background:#111;
}
.modal-media img {
	height:100%;
}
.modal-info {
	padding:28px;
	display:flex;
	flex-direction:column;
	gap:16px;
	justify-content:center;
}
.modal-info h3 {
	margin:0;
	font-size:clamp(1.6rem, 3vw, 2.4rem);
	letter-spacing:-0.04em;
}
.modal-info p {
	margin:0;
	color:var(--muted);
	line-height:1.75;
}
.tags {
	display:flex;
	gap:8px;
	flex-wrap:wrap;
}
.tags span {
	min-height:34px;
	display:inline-flex;
	align-items:center;
	padding:0 12px;
	border-radius:999px;
	background:rgba(255,255,255,0.05);
	border:1px solid var(--line);
	color:#ddd;
	font-size:0.85rem;
}
.modal-close {
	position:absolute;
	top:18px;
	right:18px;
	min-width:42px;
	min-height:42px;
	border-radius:50%;
	border:1px solid rgba(255,255,255,0.12);
	background:rgba(10,10,16,0.64);
	color:#fff;
	cursor:pointer;
}

/* 위젯 어드민 관련 */
#theme_menu {
	color:#000000;
}
#fsetup {
	margin-top:15px;
}
#fsetup ul.list-group {
	color:#000000;
}
#fsetup textarea.form-control, #fsetup input.form-control {
	background-color:unset;
	color:#000000
}
#fsetup .btn-setup {
	min-height:34px;
	height:34px;
	line-height:32px;
}	
#fregisterform {
	margin-top:15px;
}
.rg_em th {
	width:120px;
	background-color:unset;
	border:0px;
}
.rg_em td {
	border:0px;
}
#mb_confirm {
	color:#000000;
}
#mb_confirm input {
	height:40px;
}
#mb_confirm button {
	border-radius:0px 4px 4px 0px;
}

.footer {
	padding:42px 0 54px;
	color:#7d7d88;
	text-align:center;
}

@media (max-width:1100px) {

	.header-inner {
		flex-wrap:wrap;
	}
	.logo {
		order:1;
	}
	.main-nav {
		order:3;
	}
	.header-tools {
		order:2;
	}
	.hero, .modal-box {
		grid-template-columns:1fr;
	}
	.grid {
		grid-template-columns:repeat(3, minmax(0, 1fr));
	}
	.hero-copy {
		padding:38px;
	}
	.hero-visual {
		min-height:420px;
	}
	.hero-notes {
		grid-template-columns:1fr;
	}
	.modal-media {
		min-height:360px;
	}
	
}

@media (max-width:760px) {

	.logo {
		order:1;
        justify-content:center;
	}
	.main-nav {
		order:3;
	}
	.main-nav .nav-list {
		justify-content:center;
	}
	.header-tools {
		order:2;
	}
	
	.shell {
		width:min(calc(100% - 20px), var(--max));
	}
	.header-inner {
		border-radius:26px;
		flex-direction:column;
		align-items:stretch;
	}
	.header-tools, .controls {
		justify-content:stretch;
	}
	.search {
		width:100%;
	}
	.search input {
		width:100%;
	}
	.grid {
		grid-template-columns:1fr 1fr;
	}
	.hero-copy {
		padding:28px;
	}
	.hero-title {
		max-width:100%;
	}
	
}

@media (max-width:560px) {

	.grid {
		grid-template-columns:1fr;
	}
	.hero-title {
		font-size:2.5rem;
	}
	.logo {
		flex-wrap:wrap;
	}
	
}

.auth-card, .notice-card {
	border-radius:24px;
	border:1px solid rgba(255,255,255,0.06);
	background:linear-gradient(180deg, rgba(20,20,28,0.9), rgba(14,14,20,0.98));
	box-shadow:var(--shadow-soft);
	padding:28px;
	margin-top:15px;
	margin-bottom:15px;
}
.auth-card h3, .notice-card h3 {
	margin:0 0 12px;
	font-size:1.1rem;
}
.auth-card p, .notice-card p {
	margin:0;
	color:var(--muted);
	line-height:1.75;
}
.auth-card h5 {
	color:#ffffff !important;
}
.auth-card table {
	width:100%;
}
.auth-card table th {
	border:1px solid rgba(255, 255, 255, 0.06);
    background-color:#232323;
    color:var(--muted);
}
.auth-card table td {
	border:1px solid rgba(255, 255, 255, 0.06);
	color:var(--muted);
}
.mini-points {
	margin:16px 0 0;
	padding:0;
	list-style:none;
	display:grid;
	gap:10px;
}
.provision {
	overflow:auto;
	height:12.0rem;
}
.provision::-webkit-scrollbar {
	width: 10px;
 }
 .provision::-webkit-scrollbar-thumb {
	background-color: #2f3542;
	border-radius: 10px;
	background-clip: padding-box;
	border: 2px solid transparent;
}
.provision::-webkit-scrollbar-track {
	background-color: grey;
	border-radius: 10px;
	box-shadow: inset 0px 0px 5px white;
}

#theme-controller a {
	border-radius:0px;
	line-height:40px;
	min-height:40px;
	height:40px;
}
#theme-controller i {
	line-height:40px;
}

/* forms.css에 있는 form-control 속성 변경 */
.form-control {
	background-color:#000000;
	color:#ffffff;
	border:1px solid #272727;
}
.form-control:focus {
	box-shadow:0 0 6px 1px #474747;
}

#captcha {
	display:flex;
	gap:5px;
	align-items:center;
}
#captcha_img {
	height:40px;
	width:auto;
}

/* theme.css와 Navi.css에 있는 page-link 속성 변경 */
.page-link {
	display:inline-flex;
	justify-content:center;
	align-items:center;
	transition:0.25s ease;
	background:rgb(255 46 99 / 5%);
	border:1px solid rgb(255 46 99 / 20%);
	height:36px;
    width:36px;
    color:#9d9da9;
}
.page-link:hover {
	background:linear-gradient(135deg, var(--accent), var(--accent-2));
	box-shadow:0 10px 24px rgba(255, 46, 99, 0.26);
	border:1px solid rgb(255 46 99 / 20%);
	color:#ffffff;
}
.page-item.active .page-link {
    border:1px solid rgb(255 46 99 / 20%) !important;
	background:linear-gradient(135deg, var(--accent), var(--accent-2)) !important;
	box-shadow:0 10px 24px rgba(255, 46, 99, 0.26) !important;
	color:#ffffff;
}
.page-item.disabled .page-link {
	color:#3b3b3b;
	pointer-events:none;
	cursor:auto;
	background-color:rgb(255 46 99 / 5%);
	border-color:rgb(255 46 99 / 20%);
}

/* g5.css에 있는 copymove_currentbg 속성 변경 */
.new_win h1 {
	background-color:#000000 !important;
	color:#ffffff !important;
}
.new_win table {
	width:100%;
	border-top:1px solid #9E9E9E;
	border-left:1px solid #9E9E9E;
}
.new_win th {
	border-right:1px solid #9E9E9E;
	border-bottom:1px solid #9E9E9E;
	padding-left:10px;
}
.new_win td {
	border-right:1px solid #9E9E9E;
	border-bottom:1px solid #9E9E9E;
	padding-left:10px;
}
.new_win td label {
	margin: 0px;
}
.new_win .copymove_currentbg {
	background:#ff0000 !important;
}
.new_win .copymove_current {
	background:#FF9800 !important;
	padding:0px 5px;
}
.new_win .btn_submit {
	height:45px;
	width:60px;
	cursor:pointer;
	padding:0px;
	border-radius:3px;
}
.new_win .btn_close {
	border:0px;
}