@import "../icon/icon.css";
@import "shortcodes.css";
@import "responsive.css";
@import "animation.css";
@import "animate.min.css";
@import "swiper-bundle.min.css";
@import "../font/font.css";
@import "bootstrap.css";

:root {
	--font-family: 'Manrope', 'HangamePoker', sans-serif;
	--font-family-point: 'HangamePoker', 'Manrope', sans-serif;
	--font-family-kr: 'HangamePoker', 'Manrope', sans-serif;

	--color-primary: #0073dc;
}


html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q,
s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video 	{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section 	{
	display: block
}
html 	{
	font-size: 62.5%;
	overflow-y: scroll;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}
*, *:before, *:after 	{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
body 	{
	background: #161616;
	line-height: 1;
	padding: 0 !important;
}
body.background-white 	{
	background-color: #fff;
}
article, aside, details, figcaption, figure, footer, header, main, nav, section 	{
	display: block
}
ol, ul 	{
	list-style: none
}
table 	{
	border-collapse: collapse;
	border-spacing: 0;
}
caption,th,td 	{
	font-weight: normal;
	text-align: left;
}
blockquote:before,blockquote:after,
q:before,q:after 	{
	content: '';
	content: none;
}
blockquote,q 	{
	quotes: none
}
a img 	{
	border: 0
}
img 	{
	max-width: 100%;
	height: auto;
}
select 	{
	max-width: 100%
}

/* General
-------------------------------------------------------------- */
body, button, input, select, textarea 	{
	font-family: var(--font-family), sans-serif;
	color: #fff;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
	overflow-x: hidden;
	overflow-y: auto;
}
img 	{
	height: auto;
	max-width: 100%;
	vertical-align: middle;
	-ms-interpolation-mode: bicubic;
}
p 	{
	font-weight: 400;
	font-size: 18px;
	color: #7A798A;
}
strong, b, cite 	{
	font-weight: bold;
}
dfn, cite, em, i, blockquote 	{
	font-style: italic;
}
abbr, acronym 	{
	border-bottom: 1px dotted #e0e0e0;
	cursor: help;
}
.btn-link:focus, .btn-link:hover, mark, ins 	{
	text-decoration: none;
}
sup, sub 	{
	font-size: 75%;
	height: 0;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}
small 	{
	font-size: 75%;
}
big 	{
	font-size: 125%;
}
address 	{
	font-style: italic;
	margin: 0 0 20px;
}
code, kbd, tt, var, samp, pre 	{
	margin: 20px 0;
	padding: 4px 12px;
	background: #f5f5f5;
	border: 1px solid #e0e0e0;
	overflow-x: auto;
	hyphens: none;
	border-radius: 0;
	height: auto;
}
svg, svg path 	{
	transition: all 0.3s ease-in-out;
}

/* Elements
-------------------------------------------------------------- */
html 	{
	box-sizing: border-box;
}
*, *:before, *:after 	{
	box-sizing: border-box;
}
hr 	{
	margin-bottom: 20px;
	border: dashed 1px #ccc;
}

/* List */
ul, ol 	{
	padding: 0;
}
ul 	{
	list-style: disc;
}
ol 	{
	list-style: decimal;
}
li > ul, li > ol 	{
	margin-bottom: 0;
}
li 	{
	list-style: none;
}
ul li, ol li 	{
	padding: 0;
}
dl, dd 	{
	margin: 0 0 20px;
}
dt 	{
	font-weight: bold;
}
del, .disable 	{
	text-decoration: line-through;
	filter: alpha(opacity=50);
	opacity: 0.5;
}

/* Table */
table, th, td 	{
	border: 1px solid #373737;
}
table 	{
	border-collapse: separate;
	border-spacing: 0;
	margin: 0 0 30px;
	table-layout: fixed;
	width: 100%;
}
caption, th, td 	{
	font-weight: normal;
	text-align: left;
}
th 	{
	border-width: 0 1px 1px 0;
	font-weight: bold;
}
td 	{
	border-width: 0 1px 1px 0;
}
th, td 	{
	padding: 8px 12px;
}

/* Media */
embed, object, video 	{
	margin-bottom: 20px;
	max-width: 100%;
	vertical-align: middle;
}
p > embed, p > iframe, p > object, p > video 	{
	margin-bottom: 0;
}

/* Forms
-------------------------------------------------------------- */
/* Fixes */
button, input 	{
	line-height: normal;
}
button, input, select, textarea 	{
	font-size: 100%;
	line-height: inherit;
	margin: 0;
	vertical-align: baseline;
}
input, textarea, select 	{
	font-size: 14px;
	max-width: 100%;
	background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.53), rgba(255, 255, 255, 0.53));
	/* Removing the inner shadow on iOS inputs */
}
textarea 	{
	overflow: auto;
	/* Removes default vertical scrollbar in IE6/7/8/9 */
	vertical-align: top;
	/* Improves readability and alignment in all browsers */
}
input[type="checkbox"] 	{
	display: inline;
}
button, input[type="button"], input[type="reset"], input[type="submit"] 	{
	line-height: 1;
	cursor: pointer;
	appearance: button; -webkit-appearance: button;
	border: 0;
}
input[type="checkbox"], input[type="radio"] 	{
	padding: 0;
	width: 16px;
	height: 16px;
	margin-right: 10px;
	cursor: pointer;
	vertical-align: sub;
	/* Addresses excess padding in IE8/9 */
}
input[type="search"] 	{
	appearance: textfield; -webkit-appearance: textfield;
	/* Addresses appearance set to searchfield in S5, Chrome */
}
input[type="search"]::-webkit-search-decoration 	{
	/* Corrects inner padding displayed oddly in S5, Chrome on OSX */
	-webkit-appearance: none;
}
button::-moz-focus-inner, input::-moz-focus-inner 	{
	border: 0;
	padding: 0;
}

/* Remove chrome yellow autofill */
input:-webkit-autofill 	{
	-webkit-box-shadow: 0 0 0px 1000px #f7f7f7 inset
}

/* Reset search styling */
input[type="search"] 	{
	outline: 0
}
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-results-button, input[type="search"]::-webkit-search-results-decoration 	{
	display: none
}
textarea.style-1, input.style-1 	{
	background-color: #232323 !important;
}
.search.search-submit 	{
	position: absolute;
	right: 18px;
	top: 1px;
	background: transparent;
	color: rgba(255, 255, 255, 1);
	font-size: 24px;
}

/* Contact Form 7 */
fieldset 	{
	margin-bottom: 30px;
	width: 100%;
}

form label 	{
	color: #FFF;
	font-family: var(--font-family), sans-serif;
	font-size: 14px;
	font-weight: 700;
	line-height: 19px;
	margin-bottom: 16px;
}
.wpcf7-form select,
.wpcf7-form textarea,
.wpcf7-form input 	{
	margin-bottom: 0;
}
select 	{
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	-ms-appearance: none;
}
.select 	{
	position: relative;
	overflow: hidden;
}
.select::after 	{
	font-family: 'icomoon';
	content: '\e914';
	font-size: 14px;
	right: 10px;
	font-weight: 600;
	color: #1F1F2C;
	display: block;
	position: absolute;
	background: 0 0;
	top: 50%;
	pointer-events: none;
	-webkit-transition: .25s all ease;
	-o-transition: .25s all ease;
	transition: .25s all ease;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}
select 	{
	border: none;
	outline: 0;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	font-size: 14px;
	font-family: inherit;
	line-height: 22px;
	border-radius: 12px;
	padding: 15px 26px;
	width: 100%;
	background: #161616;
	color: #fff;
}
select option 	{
	padding: 15px 26px;
	font-size: 15px;
	line-height: 24px;
	color: #1F1F2C;
	background-color: #fff;
}
textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"] 	{
	border: none;
	outline: 0;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	font-size: 14px;
	font-family: inherit;
	line-height: 22px;
	border-radius: 12px;
	padding: 15px 26px;
	width: 100%;
	background: #161616;
	color: #ffffff;
}

/* Input focus */
textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus 	{
	border: none;
	outline: 0;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}
textarea::placeholder,
input[type="text"]::placeholder,
input[type="password"]::placeholder,
input[type="datetime"]::placeholder,
input[type="datetime-local"]::placeholder,
input[type="date"]::placeholder,
input[type="month"]::placeholder,
input[type="time"]::placeholder,
input[type="week"]::placeholder,
input[type="number"]::placeholder,
input[type="email"]::placeholder,
input[type="url"]::placeholder,
input[type="search"]::placeholder,
input[type="tel"]::placeholder,
input[type="color"]::placeholder 	{
	font-size: 14px;
	font-weight: 400;
	line-height: 22px;
	font-family: inherit;
	color: rgba(255, 255, 255, 0.53);
}

/* Button */
button,
input[type="button"],
input[type="reset"],
input[type="submit"] 	{
	font-weight: 700;
	font-size: 14px;
	line-height: 22px;
	background-color: rgba(221, 242, 71, 1);
	color: rgba(22, 22, 22, 1);
	border-radius: 14px;
	padding: 10px;
	height: 50px;
	border: none;
	display: inline-block;
	appearance: none;
	-webkit-appearance: none;
	-webkit-transition: all ease 0.3s;
	-moz-transition: all ease 0.3s;
	transition: all ease 0.3s;
}
button.style-1,
input.style-1[type="button"],
input.style-1[type="reset"],
input.style-1[type="submit"] 	{
	font-weight: 700;
	font-size: 14px;
	line-height: 22px;
	color: rgba(221, 242, 71, 1);
	background-color: rgba(22, 22, 22, 1);
	border-radius: 14px;
	padding: 10px;
	height: 50px;
	border: none;
	display: inline-block;
	appearance: none;
	-webkit-appearance: none;
	-webkit-transition: all ease 0.3s;
	-moz-transition: all ease 0.3s;
	transition: all ease 0.3s;
}

/* Button hover + focus */
button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover,
button:focus,
input[type="button"]:focus,
input[type="reset"]:focus,
input[type="submit"]:focus 	{
	outline: 0;
	border: none;
	background-color: rgba(22, 22, 22, 1);
	color: rgba(221, 242, 71, 1);
}
button.style-1:hover,
input.style-1[type="button"]:hover,
input.style-1[type="reset"]:hover,
input.style-1[type="submit"]:hover,
button.style-1:focus,
input.style-1[type="button"]:focus,
input.style-1[type="reset"]:focus,
input.style-1[type="submit"]:focus 	{
	outline: 0;
	border: none;
	color: rgba(22, 22, 22, 1);
	background-color: rgba(221, 242, 71, 1);
}
.btn-submit button[type="submit"]:hover 	{
	background-color: #FFF;
	color: rgba(22, 22, 22, 1);
}
.btn-submit button.active 	{
	background-color: #FFF;
	color: rgba(22, 22, 22, 1);
}
textarea 	{
	height: 180px;
}
input.style-2 	{
	padding: 14px 26px;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
}

/* Placeholder color */
::-webkit-input-placeholder 	{
	color: #8A8AA0;
}
:-moz-placeholder 	{
	color: #8A8AA0;
}
::-moz-placeholder 	{
	color: #8A8AA0;
	opacity: 1;
}
.error 	{
	font-size: 16px;
	color: var(--primary-color2);
	margin-bottom: 10px;
	-webkit-transition: all ease 0.3s;
	-moz-transition: all ease 0.3s;
	transition: all ease 0.3s;
}

/* Since FF19 lowers the opacity of the placeholder by default */
:-ms-input-placeholder 	{
	color: #8A8AA0;
}

/* Typography
-------------------------------------------------------------- */
h1,h2,h3,h4,h5,h6 	{
	font-weight: 700;
	text-rendering: optimizeLegibility;
}
h1 	{	font-size: 40px;}
h2 	{	font-size: 32px;}
h3 	{	font-size: 24px;}
h4 	{	font-size: 20px;}
h5 	{	font-size: 18px;}
h6 	{	font-size: 15px;}

/* Extra classes
-------------------------------------------------------------- */
.msg-success 	{
	background: linear-gradient(to right, #E250E5, #4B50E6, #E250E5);
	background-clip: text;
	-webkit-background-clip: text;
	font-weight: 700;
	background-size: 200% 200%;
	animation: rainbow 2s ease-in-out infinite;
	color: rgb(0 0 0 / 0);
	transition: color .2s ease-in-out;
	font-size: 18px;
	font-weight: 400;
	line-height: 28px;
}
.point	{	color: #ddf247;}
label.error 	{	color: #ff0000;}
.hidden 	{	display: none;}
.block 	{	display: block;}
.relative 	{	position: relative;}
.absolute 	{	position: absolute;}
.fixed 	{	position: fixed !important;}
.position-unset 	{	position: unset;}
.flex 	{
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
}
.flex-grow 	{	flex-grow: 1;}
.gap30 	{	gap: 30px;}
.gap4 	{	gap: 4px;}
.justify-center		{	justify-content: center;}
.justify-end 	{	justify-content: flex-end;}
.justify-between 	{	justify-content: space-between;}
.items-center 	{	align-items: center;}
.flex-wrap 	{	flex-wrap: wrap;}
.text-end 	{	text-align: end;}
.text-center 	{	text-align: center;}
.w-full 	{	width: 100%;}
.h-full 	{	height: 100%;}
.pl-2-5 	{	padding-left: 2.5px;}
.pt-10 	{	padding-top: 10px;}
.pt-25 	{	padding-top: 25px;}
.pt-40 	{	padding-top: 40px;}
.pb-16 	{	padding-bottom: 16px;}
.pb-20 	{	padding-bottom: 16px;}
.pb-30 	{	padding-bottom: 30px;}
.pb-38 	{	padding-bottom: 38px;}
.pb-40 	{	padding-bottom: 40px;}
.pb-48 	{	padding-bottom: 48px !important;}
.pb-80 	{	padding-bottom: 80px;}
.pt-60 	{	padding-top: 60px;}
.pt-80 	{	padding-top: 80px;}
.mt-30 	{	margin-top: 30px;}
.mt-10 	{	margin-top: 10px;}
.mr-30 	{	margin-right: 30px;}
.ml-30 	{	margin-left: 30px;}
.ml-50 	{	margin-left: 50px;}
.mb-20 	{	margin-bottom: 20px !important;}
.mr-20 	{	margin-right: 20px;}
.mt-18 	{	margin-top: 18px !important;}
.mt-17 	{	margin-top: 17px;}
.mt-16 	{	margin-top: 16px;}
.mr-16 	{	margin-right: 16px;}
.mr-10 	{	margin-right: 10px;}
.mt-40 	{	margin-top: 40px;}
.mb-40 	{	margin-bottom: 40px;}
.mb-30 	{	margin-bottom: 30px;}
.tf-color 	{	color: #DDF247 !important;}
.divider 	{
	width: 100%;
	height: 1px;
	background-color: rgba(255, 255, 255, 0.1);
}
.mw-667 	{
	max-width: 667px !important;
}
.w242 	{
	width: 242.5px;
}
.rotateZ90 	{
	transform: rotateZ(90deg);
}
.fl-item-1,
.fl-item 	{
	display: none;
}
.opacity-01 	{
	opacity: 0.1;
}
.no-bg 	{
	background: none !important;
}
.capitalize 	{
	text-transform: capitalize;
}
#wrapper 	{
	position: relative;
	overflow: hidden;
	max-width: 100%;
	height: 100%;
}

/* link style
-------------------------------------------------------------- */
a 	{
	text-decoration: none;
	color: #fff;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

a:hover,
a:focus 	{
	color: #DDF247;
	text-decoration: none;
	outline: 0;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

/* Header
-------------------------------------------------------------- */
.header_1 	{
	position: relative;
	z-index: 100;
	height: auto;
	width: 100%;
	border: none;
	padding-right: 0 !important;
}
#site-logo 	{
	height: 100%;
}
#site-logo-inner 	{
	position: absolute;
	top: 0;
	left: 50%;
	transform: translate(-50%, 24px);
}
#site-logo-inner .main-logo {
	display: block;
	height: clamp(50px, 8vw, 80px);
	width: auto;
}
#site-logo-inner .main-logo img {
	height: 100%;
	width: auto;
}
.is-fixed #site-logo-inner 	{
	transform: translate(-50%, 8px);
}
.is-fixed #site-logo-inner .main-logo {
	height: clamp(50px, 7vw, 70px);
}
.flat-wallet 	{
	display: flex;
	gap: 10px;
	position: absolute;
	padding: 6px 0 7px 0;
	right: 15px;
	top: 0;
	justify-content: end;
	align-items: center;
}
.canvas 	{
	position: relative;
	width: 30px;
	height: 30px;
	cursor: pointer;
}
.canvas span,
.canvas::before,
.canvas::after 	{
	position: absolute;
	content: "";
	height: 3px;
	background-color: #fff;
	border-radius: 5px;
	right: 2.5px;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}
.canvas span 	{
	width: 25px;
	top: 50%;
}
.canvas::after 	{
	width: 13px;
	top: 75%;
}
.canvas::before 	{
	width: 19px;
	top: 25%;
}
.canvas.style-1 span,
.canvas.style-1::before 	{
	background-color: rgba(22, 22, 22, 1);
}
.canvas.style-1::after 	{
	background-color: rgba(221, 242, 71, 1);
}
.header-search.style-1 .show-search 	{
	color: #000;
}
.header-search > a.active .icon-search::before 	{
	content: url(../images/icons/close.svg);
}
.header-search .show-search 	{
	font-size: 20px;
	line-height: 44px;
}
.header-search .top-search 	{
	position: absolute;
	top: 50px;
	right: 0;
	min-width: 240px;
	display: none;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.header-search .top-search.active 	{
	display: block;
}

/* main-nav */
.header_1 #main-nav 	{
	position: absolute;
	left: 22.48%;
	top: 50%;
	z-index: 0;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}
#main-nav ul li 	{
	position: relative;
}
#main-nav > ul > li 	{
	float: left;
	padding: 16px 16px 18px 15px;
	cursor: pointer;
}
#main-nav > ul > li > a 	{
	position: relative;
	display: block;
	font-family: 'HangamePoker';
	font-size: 16px;
	line-height: 22px;
	font-weight: 600;
	color: #fff;
}
#main-nav > ul > li.menu-item-has-children > a 	{
	padding-right: 18px;
}
#main-nav > .menu > li.menu-item-has-children > a::after 	{
	content: '\eafe';
	font-family: 'icomoon';
	font-weight: 300;
	opacity: 0.3;
	position: absolute;
	font-size: 12px;
	right: 0;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
#main-nav > ul > li:hover > a,
#main-nav > .menu > li:hover > a::after,
#main-nav > .menu > li.current-menu-item > a::after 	{
	color: #E2FE26;
	opacity: 1;
}
#main-nav > ul > li.current-menu-item > a 	{
	color: #E2FE26;
	font-weight: 800;
}

/* sub-menu */
#main-nav .sub-menu 	{
	position: absolute;
	top: 100%;
	left: 0;
	width: 200px;
	padding: 15px 0;
	background-color: #0f0f0f;
	border-radius: 10px;
	z-index: 9999;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: all 0.3s ease;
	transform: translateY(15px);
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.6);
}
#main-nav .sub-menu li a 	{
	display: block;
	font-size: 15px;
	color: #fff;
	padding: 12px 24px;
	font-weight: 500;
	transition: background-color 0.2s ease;
}
#main-nav .sub-menu li + li 	{
	border-top: 1px solid rgba(255, 255, 255, 0.05);
}
#main-nav .sub-menu li a:hover 	{
	background-color: rgba(255, 255, 255, 0.06);
}
#main-nav .sub-menu li:first-child a 	{
	color: #ddf247;
	font-weight: 600;
}
#main-nav li:hover .sub-menu 	{
	opacity: 1;
	visibility: visible;
	pointer-events: all;
	transform: translateY(0);
}
#main-nav .sub-menu li.current-item > a,
#main-nav .sub-menu li a:hover 	{
	color: #DDF247;
}
#main-nav > ul > li .sub-menu li 	{
	position: relative;
}
#main-nav > ul > li .sub-menu li a 	{
	transition: all 0.15s linear;
	-webkit-transition: all 0.15s linear;
	-moz-transition: all 0.15s linear;
	-o-transition: all 0.15s linear;
}
#main-nav .nav-sub-menu 	{
	opacity: 0;
	visibility: hidden;
	position: absolute;
	top: -40% !important;
	left: 100%;
	background-color: #000000;
	z-index: 20;
	transition: ease-out 0.3s;
	min-width: 240px;
	border: 1px solid #161616;
	border-radius: 8px;
	text-align: start;
	padding: 15px 0;
}
#main-nav .sub-menu li:hover .nav-sub-menu 	{
	opacity: 1;
	visibility: visible;
	top: 100%;
	pointer-events: all;
}
#main-nav .sub-menu li.has-item a 	{
	position: relative;
}
#main-nav .sub-menu li.has-item > a::before 	{
	position: absolute;
	content: '\e912';
	font-family: 'icomoon';
	right: 36px;
}
.header_1.style-white 	{
	background: #fff;
}
.header_1.style-white .tf-button 	{
	background-color: #DEE8E8;
}
.header_1.style-white .tf-button:hover 	{
	background-color: #DDF247;
}
.header_1.style-white #main-nav > ul > li > a 	{
	color: #161616;
}
.header_1.style-white #main-nav > .menu > li.current-menu-item > a::after,
.header_1.style-white #main-nav > .menu > li:hover > a::after,
.header_1.style-white #main-nav > ul > li:hover > a 	{
	color: #161616;
}
.header_1.style-white.is-fixed 	{
	background-color: #fff;
	box-shadow: 0px 15px 25px rgba(0, 0, 0, 0.06);
}

/* header-full */
.header_1.header-full 	{
	height: 98px !important;
	border-bottom: 1px solid rgba(153, 153, 153, 0.08);
}
.header_1.header-full .container-fluid 	{
	padding: 20px 33px 21px 50px;
}
.header_1.header-full #main-nav 	{
	left: 19.2%;
}
.header_1.header-full .widget-search input 	{
	width: 580px;
	height: 44px;
	border: 1px solid rgba(255, 255, 255, 0.08);
	padding: 10px 18px;
	font-family: var(--font-family), sans-serif;
	font-weight: 400;
	line-height: 19px;
	color: rgba(255, 255, 255, 0.5);
}
.header_1.header-full .widget-search input::placeholder 	{
	font-family: var(--font-family), sans-serif;
	font-weight: 400;
	line-height: 19px;
	color: rgba(255, 255, 255, 0.5);
}
.header_1.header-full .widget-search button 	{
	height: 44px;
	font-size: 18px;
	padding: 10px 0;
}
.header_1.header-full #wallet-header a 	{
	background: #DEE8E8;
}
.header_1.header-full #wallet-header a:hover 	{
	background: #DDF247;
}

/* Mobile Menu Button */
.mobile-button 	{
	display: none;
	position: absolute;
	width: 26px;
	height: 26px;
	top: 50%;
	right: 15px;
	background-color: transparent;
	cursor: pointer;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}
.mobile-button:before,
.mobile-button:after,
.mobile-button span 	{
	background-color: #ffffff;
	-webkit-transition: all ease 0.3s;
	-moz-transition: all ease 0.3s;
	transition: all ease 0.3s;
}
.header_1.style-white .mobile-button::before,
.header_1.style-white .mobile-button::after,
.header_1.style-white .mobile-button span 	{
	background-color: #161616;
}
.mobile-button:before,
.mobile-button:after 	{
	content: '';
	position: absolute;
	top: 0;
	height: 3px;
	width: 100%;
	left: 0;
	top: 50%;
	-webkit-transform-origin: 50% 50%;
	-ms-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
}
.mobile-button span 	{
	position: absolute;
	width: 100%;
	height: 3px;
	left: 0;
	top: 50%;
	overflow: hidden;
	text-indent: 200%;
}
.mobile-button:before 	{
	-webkit-transform: translate3d(0, -7px, 0);
	-moz-transform: translate3d(0, -7px, 0);
	transform: translate3d(0, -7px, 0);
}
.mobile-button:after 	{
	-webkit-transform: translate3d(0, 7px, 0);
	-moz-transform: translate3d(0, 7px, 0);
	transform: translate3d(0, 7px, 0);
}

/* footer */
#footer 	{
	padding: 40px 0 30px;
	background-color: #111;
}
#footer .widget 	{
	margin-right: 55px;
}
#footer .title-widget 	{
	font-weight: 800;
	line-height: 25px;
	margin-bottom: 20px;
}
.widget-menu ul li 	{
	margin-bottom: 5px;
}
.widget-menu ul li:last-child 	{
	margin-bottom: 0;
}
.widget-menu ul li a 	{
	color: rgba(255, 255, 255, 0.53);
	font-size: 14px;
	font-family: inherit;
	line-height: 22px;
	position: relative;
}
.widget-menu ul li a:hover 	{
	color: #DDF247;
}
.background-white .widget-menu ul li a:after 	{
	background: rgba(22, 22, 22, 1);
}
.widget-menu ul li a::after 	{
	content: '';
	width: 0;
	height: 1px;
	position: absolute;
	background: #DDF247;
	left: 50%;
	bottom: 0;
	transform: translateX(-50%);
	visibility: hidden;
	opacity: 0;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.widget-menu ul li a:hover::after 	{
	width: 100%;
	visibility: visible;
	opacity: 1;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

/* widget-social */
.widget-social ul li 	{
	margin-right: 10px;
}
.widget-social ul li:last-child 	{
	margin-right: 0;
}
.widget-social ul li a 	{
	width: 38px;
	height: 38px;
	font-size: 18px;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	border-radius: 50%;
	background-color: rgba(255, 255, 255, 0.05);
	padding: 9px;
}
.widget-social a:hover 	{
	color: #fff;
}
.widget-social .icon-facebook:hover 	{
	background-color: rgba(24, 119, 242, 1) !important;
}
.widget-social .icon-twitter:hover 	{
	background-color: rgb(29, 155, 240) !important;
}
.widget-social .icon-vt:hover 	{
	background-color: #5865f2 !important;
}
.widget-social .icon-tiktok:hover 	{
	background-color: black !important;
}
.widget-social .icon-youtube:hover 	{
	background-color: #c00 !important;
}
.widget-social .icon-linkedin2:hover 	{
	background-color: #0a66c2 !important;
}
.widget-social .icon-instagram:hover 	{
	background-color: #C13584 !important;
}
.footer-bottom 	{
	margin-top: 50px;
	border-top: 1px solid rgba(255, 255, 255, 0.08);
	padding-top: 30px;
	display: flex;
	justify-content: space-between;
	color: rgba(255, 255, 255, 0.53);
}
.footer-bottom p 	{
	color: rgba(255, 255, 255, 0.53);
	font-size: 14px;
	font-family: inherit;
	line-height: 22px;
}
.footer-bottom ul li 	{
	margin-left: 30px;
}
.footer-bottom ul li a 	{
	color: rgba(255, 255, 255, 0.53);
	font-family: inherit;
	font-size: 14px;
	line-height: 22px;
}
.footer-bottom ul li a:hover 	{
	color: #DDF247;
}

/* style-1 */
.footer-bottom.style-1 	{
	margin-top: 0;
}
.footer-bottom.style-1 .widget-social ul li 	{
	margin-left: 0;
}
.footer-bottom.style-1 .widget-social ul li a 	{
	color: #fff;
}

/* bg-white */
#footer.bg-white 	{
	background-color: #fff;
}
#footer.bg-white .widget 	{
	margin-right: 80px;
}
#footer.bg-white .icon-vt:before,
#footer.bg-white .widget-menu ul li a,
#footer.bg-white .title-widget 	{
	color: rgba(22, 22, 22, 1);
}
#footer.bg-white .widget-social ul li a 	{
	color: rgba(22, 22, 22, 1);
	background-color: rgba(22, 22, 22, 0.05);
}
#footer.bg-white a.icon-vt:hover:before,
#footer.bg-white .widget-social ul li a:hover 	{
	color: #fff !important;
}
#footer.bg-white .footer-bottom 	{
	border-color: rgba(22, 22, 22, 0.08);
}
#footer.bg-white .footer-bottom ul li a,
#footer.bg-white .footer-bottom p 	{
	color: #161616;
	font-size: 12px;
	line-height: 19px;
}

/* heading-section */
.heading-section 	{
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 5px;
}
.heading-section .tf-title {
	font-family: 'HangamePoker';
	font-size: clamp(24px, 3vw, 32px);
	font-weight: 800;
	line-height: 1.25;
	/* text-transform: capitalize; */
	z-index: 10;
}
.heading-section .tf-title + p {
	font-size: clamp(11px, 1vw, 13px);
	color: #aaa;
}
.heading-section .tf-title + p span {
	color: #ffffff;
}
.heading-section a 	{
	font-size: 14px;
	line-height: 19px;
	text-transform: capitalize;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
	position: relative;
}
.heading-section a i 	{
	padding: 4px;
	margin-left: 3px;
	font-size: 10px;
	border-radius: 20px;
	border-color: transparent;
	background: none;
}
.heading-section a::after 	{
	position: absolute;
	width: 20px;
	height: 20px;
	right: 0;
	content: '';
	border-radius: 20px;
	border: 1px solid rgba(255, 255, 255, 0.10);
	background: rgba(255, 255, 255, 0.10);
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
.heading-section a:hover::after 	{
	width: 107%;
}
.background-white .heading-section a,
.background-white .heading-section .tf-title 	{
	color: #161616;
}
.background-white .heading-section a::after 	{
	background-color: rgba(22, 22, 22, 0.10);
}

/* section-menu-left */
.section-menu-left 	{
	display: flex;
	flex-direction: column;
	gap: 30px;
	background: #232323;
	width: 281px;
	padding: 40px 0px;
	z-index: 30;
	-webkit-transition: all 0.5s linear;
	-moz-transition: all 0.5s linear;
	-ms-transition: all 0.5s linear;
	-o-transition: all 0.5s linear;
	transition: all 0.5s linear;
}
.section-menu-left > .wrap-bottom 	{
	position: fixed;
	bottom: 49px;
	width: 281px;
	padding: 0 30px;
}
.section-menu-left .list-menu,
.section-menu-left .box-logo 	{
	padding: 0 30px;
}
.section-menu-left .connect 	{
	padding: 26px 30px;
	border-top: 1px solid rgba(255, 255, 255, 0.08);
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.section-menu-left .connect a 	{
	width: 100%;
}
.tf-button.style-1.type-1 	{
	background-color: rgba(255, 255, 255, 0.05);
	color: #DEE8E8;
}
.tf-button.style-1.type-1:hover 	{
	background-color: #DDF247;
	color: #161616;
}
.section-menu-left .list-menu > ul > li 	{
	font-size: 15px;
	font-weight: 800;
	line-height: 20px;
	text-transform: capitalize;
	margin-bottom: 6px;
}
.section-menu-left .list-menu > ul > li:last-child 	{
	margin-bottom: 0;
}
.section-menu-left .list-menu > ul > li > a 	{
	color: rgba(255, 255, 255, 0.4);
	display: inline-block;
	padding: 13px 10px 11px 44px;
	border-radius: 12px;
	width: 100%;
	font-size: 15px;
	font-weight: 800;
	line-height: 22px;
	text-transform: capitalize;
	position: relative;
	cursor: pointer;
}
.section-menu-left .list-menu > ul > li > a i 	{
	font-size: 18px;
	padding: 2px;
	position: absolute;
	top: 12px;
	left: 9px;
}
.section-menu-left .list-menu > ul > li > a i::before 	{
	color: rgba(255, 255, 255, 0.4);
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;

}
.section-menu-left .list-menu > ul > li.active > a i::before,
.section-menu-left .list-menu > ul > li > a:hover i::before 	{
	color: rgba(22, 22, 22, 1);
}
.section-menu-left .list-menu li.active > a,
.section-menu-left .list-menu > ul > li > a:hover 	{
	box-shadow: 0px 4px 20px 0px rgba(221, 242, 71, 0.30);
	color: #161616;
	background: #DDF247;
}
.section-menu-left .list-menu > ul > li.has-item > a::before 	{
	content: '\e914';
	font-family: 'icomoon';
	font-weight: 100;
	position: absolute;
	right: 10px;
	top: 12px;
	font-size: 22px;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
.section-menu-left .list-menu > ul > li.has-item.active > a::before 	{
	transform: rotate(180deg);
}
.section-menu-left .list-menu > ul > li.language img 	{
	position: absolute;
	top: 12px;
	left: 10px;
	border-radius: 50%;
	width: 22px;
	height: 22px;
	padding: 3px;
	border-radius: 50%;
	border: 1px solid #D0D0D1;
	background-color: #161616;
}
.section-menu-left .list-menu ul.sub-item 	{
	display: none;
	margin-top: 19px;
	margin-bottom: 17px;
	padding-left: 22px;
	margin-left: 21px;
	border-left: 1px solid rgba(255, 255, 255, 0.08);
}
.section-menu-left .list-menu li ul.sub-item.active 	{
	display: block;
}
.section-menu-left .list-menu ul.sub-item li 	{
	margin-bottom: 28px;
	padding-left: 16px;
	position: relative;
}
.section-menu-left .list-menu ul.sub-item li:last-child 	{
	margin-bottom: 0px;
}
.section-menu-left .list-menu ul.sub-item li::before 	{
	position: absolute;
	content: "";
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	background-color: #D9DADC;
	border-radius: 50%;
	width: 4px;
	height: 4px;
}
.section-menu-left .list-menu ul.sub-item li a 	{
	color: rgba(255, 255, 255, 0.4);
}
.section-menu-left .list-menu ul.sub-item li:hover::before 	{
	background-color: #DDF247;
}
.section-menu-left .list-menu ul.sub-item li:hover a 	{
	color: #DDF247;
}
.section-menu-left .language ul.sub-item 	{
	position: absolute;
	background-color: #161616;
	width: 100%;
	z-index: 1;
	margin: 0;
	padding-left: 0px;
	border-radius: 10px;
}
.section-menu-left .language ul.sub-item li 	{
	padding: 12px 8px 10px 43px;
	margin-bottom: 0;
	cursor: pointer;
}
.section-menu-left .language ul.sub-item li::before 	{
	display: none;
}
.section-menu-left .menu-bottom 	{
	padding-top: 30px;
	border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.section-menu-left .bottom 	{
	padding-top: 20px;
	border-top: 1px solid rgba(255, 255, 255, 0.08);
	position: fixed;
	bottom: 39px;
	width: 281px;
}
.section-menu-left .bottom p 	{
	color: rgba(255, 255, 255, 0.53);
	font-size: 12px;
	font-family: inherit;
	font-weight: 400;
	line-height: 19px;
	padding: 0 30px;
}
.section-menu-left .create 	{
	padding: 26px 30.5px;
	border-top: 1px solid rgba(255, 255, 255, 0.08);
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.section-menu-left .create a.tf-button 	{
	width: 100%;
	background-color: #DEE8E8;
	color: #161616;
	cursor: pointer;
}
.section-menu-left .create a.tf-button.active 	{
	color: #161616;
	background-color: #DDF247;
}
.section-menu-left .content h6 	{
	padding: 0 30px;
	font-size: 14px;
	font-style: normal;
	font-weight: 600;
	line-height: 21px;
	color: rgba(255, 255, 255, 0.4);
	margin-bottom: 9px;
}
.section-menu-left ul.menu-tab li 	{
	color: #FFF;
	font-size: 16px;
	font-weight: 500;
	line-height: 22px;
	margin-bottom: 6px;
	padding: 12px 30px 12px 64px;
	display: flex;
	align-items: center;
	cursor: pointer;
	position: relative;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
.section-menu-left ul.menu-tab li::before 	{
	opacity: 0;
	visibility: hidden;
	position: absolute;
	width: 6px;
	height: 24px;
	content: "";
	top: 50%;
	left: 0;
	background-color: #DDF247;
	border-radius: 999px;
	transform: translate(-50%, -50%);
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
.section-menu-left ul.menu-tab li.active:before,
.section-menu-left ul.menu-tab li:hover:before 	{
	opacity: 1;
	visibility: visible;
}
.section-menu-left ul.menu-tab li.active,
.section-menu-left ul.menu-tab li:hover 	{
	color: #DDF247;
}
.section-menu-left ul.menu-tab li svg 	{
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
	position: absolute;
	left: 30px;
}
.section-menu-left ul.menu-tab li.active svg:first-child,
.section-menu-left ul.menu-tab li svg:last-child,
.section-menu-left ul.menu-tab li:hover svg:first-child 	{
	opacity: 0;
	visibility: hidden;
}
.section-menu-left ul.menu-tab li.active svg:last-child,
.section-menu-left ul.menu-tab li:hover svg:last-child 	{
	opacity: 1;
	visibility: visible;
}

/* canvas */
.canvas-nav-wrap .overlay-canvas-nav 	{
	cursor: url(../images/icons/close.svg), auto;
	content: '';
	position: fixed;
	right: 0%;
	top: 0;
	background: linear-gradient(0deg, rgba(0, 0, 0, 0.80) 0%, rgba(0, 0, 0, 0.80) 100%);
	width: 100%;
	height: 100%;
	z-index: 999;
	opacity: 0;
	visibility: hidden;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
.canvas-nav-wrap.active .overlay-canvas-nav 	{
	opacity: 1;
	visibility: visible;
}
.canvas-nav-wrap.active .overlay-canvas-nav i 	{
	font-size: 25px;
	margin-right: 20px;
	color: #FFFFFF;
}
.canvas-nav-wrap .inner-canvas-nav 	{
	width: 340px;
	height: 100%;
	top: 0;
	right: -340px;
	position: fixed;
	background-color: #161616;
	z-index: 999999;
	overflow-y: auto;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
.canvas-nav-wrap .inner-canvas-nav::-webkit-scrollbar 	{
	width: 0px;
}
.canvas-nav-wrap.active .inner-canvas-nav 	{
	right: 0;
	border-left: 10px solid transparent;
	border-image: linear-gradient(96deg, #DDF247 5.2%, #161616 5%) 1;
}
.inner-canvas-nav .side-bar 	{
	padding: 30px;
	position: relative;
}
.inner-canvas-nav .side-bar .canvas-nav-close 	{
	position: absolute;
	top: 50px;
	right: 30px;
	cursor: pointer;
}

/* mobile header */
/* ------------------------------------ */
.mobile-nav-wrap .overlay-mobile-nav 	{
	cursor: url(../images/icons/close.svg), auto;
	content: '';
	position: fixed;
	left: 100%;
	top: 0;
	background: linear-gradient(0deg, rgba(0, 0, 0, 0.80) 0%, rgba(0, 0, 0, 0.80) 100%);
	width: 100%;
	height: 100%;
	z-index: 999;
	opacity: 0;
	visibility: hidden;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
.mobile-nav-wrap.active .overlay-mobile-nav 	{
	left: 0;
	opacity: 1;
	visibility: visible;
}
.mobile-nav-wrap.active .overlay-mobile-nav i 	{
	font-size: 25px;
	margin-right: 20px;
	color: #FFFFFF;
}
.mobile-nav-wrap .inner-mobile-nav 	{
	width: 320px;
	height: 100%;
	top: 0;
	left: -340px;
	position: fixed;
	background-color: #161616;
	z-index: 999999;
	overflow-y: auto;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
.mobile-nav-wrap .inner-mobile-nav::-webkit-scrollbar 	{
	width: 0px;
}
.mobile-nav-wrap.active .inner-mobile-nav 	{
	left: 0;
	transition-delay: 0.3s;
}
.inner-mobile-nav 	{
	padding: 30px;
	position: relative;
}
.inner-mobile-nav .mobile-nav-close 	{
	position: absolute;
	top: 50px;
	right: 30px;
	cursor: pointer;
}

/* menu-mobile-menu */
#menu-mobile-menu 	{
	margin-top: 15px;
	border-top: 1px solid rgba(255, 255, 255, 0.08);
	padding-top: 30px;
}
#menu-mobile-menu 	{
	display: flex;
	flex-direction: column;
}
#menu-mobile-menu > li 	{
	position: relative;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
	padding: 15px 0px;
	cursor: pointer;
}
#menu-mobile-menu > li .sub-menu-mobile li:last-child,
#menu-mobile-menu > li:last-child 	{
	border: none;
}
#menu-mobile-menu li a 	{
	font-size: 16px;
	line-height: 22px;
	font-weight: 500;
	color: #fff;
}
#menu-mobile-menu li.current-menu-item > a,
#menu-mobile-menu li a:hover,
#menu-mobile-menu li.current-item a 	{
	color: #DDF247;
}
#menu-mobile-menu li.menu-item-has-children-mobile > a::after 	{
	content: '\e914';
	position: absolute;
	font-family: 'icomoon';
	font-weight: 300;
	position: absolute;
	right: 0;
	top: 17px;
	line-height: 16px;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
#menu-mobile-menu > li.active a::after 	{
	transform: rotate(180deg);
}
#menu-mobile-menu > li .sub-menu-mobile 	{
	border-radius: 8px;
	display: none;
	text-align: start;
	overflow: hidden;
}
#menu-mobile-menu > li .sub-menu-mobile li 	{
	padding-left: 15px;
	padding: 15px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
	cursor: pointer;
}
#menu-mobile-menu > li .sub-menu-mobile a 	{
	font-size: 16px;
	line-height: 22px;
	font-weight: 500;
}


/*Header fixed
-------------------------------- */
.header_1.is-fixed 	{
	position: fixed;
	padding: 0;
	top: -100%;
	left: 0;
	width: 100%;
	box-shadow: 0px 3px 9px rgba(0, 0, 0, 0.05);
	z-index: 9999;
	background: #161616e8;
	border: none;
	opacity: 1;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
	border-bottom-left-radius: 40px;
	border-bottom-right-radius: 40px;
	border-bottom: 1px solid #016acd;
}

@media (max-width: 1286px) 	{
	.header_1.is-fixed 	{
		border-bottom-left-radius: 0px;
		border-bottom-right-radius: 0px;
	}
}
.header_1.is-fixed.is-small 	{
	top: 0;
	height: clamp(64px, 9vw, 88px);
}
.header_1.is-fixed.is-small .themesflat-container 	{
	padding: 16px;
}

/* preload */
.preload-container 	{
	position: fixed;
	top: 0px;
	left: 0px;
	z-index: 999999999999999;
	height: 100%;
	width: 100%;
	background-color: #000;
}
.preload-container .middle 	{
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	position: absolute;
}
.preload-container .bar 	{
	width: 10px;
	height: 70px;
	background: transparent;
	display: inline-block;
	transform-origin: bottom center;
	border-top-right-radius: 20px;
	border-top-left-radius: 20px;
	animation: loader 1.2s linear infinite;
}
.preload-container .bar1 	{
	animation-delay: 0.1s;
}
.preload-container .bar2 	{
	animation-delay: 0.2s;
}
.preload-container .bar3 	{
	animation-delay: 0.3s;
}
.preload-container .bar4 	{
	animation-delay: 0.4s;
}
.preload-container .bar5 	{
	animation-delay: 0.5s;
}
.preload-container .bar6 	{
	animation-delay: 0.6s;
}
.preload-container .bar7 	{
	animation-delay: 0.7s;
}
.preload-container .bar8 	{
	animation-delay: 0.8s;
}
.progress-wrap 	{
	position: fixed;
	bottom: 30px;
	right: 30px;
	height: 44px;
	width: 44px;
	cursor: pointer;
	display: block;
	border-radius: 16px;
	-webkit-box-shadow: inset 0 0 0 2px rgba(130, 130, 130, 0.2);
	box-shadow: inset 0 0 0 2px rgba(130, 130, 130, 0.2);
	z-index: 100;
	opacity: 0;
	visibility: hidden;
	-webkit-transform: translateY(20px);
	-ms-transform: translateY(20px);
	transform: translateY(20px);
	-webkit-transition: all 400ms linear;
	-o-transition: all 400ms linear;
	transition: all 400ms linear;
	background: #000;
}
.progress-wrap::after 	{
	position: absolute;
	content: '\ea25';
	font-family: 'icomoon';
	text-align: center;
	line-height: 44px;
	font-size: 16px;
	font-weight: 900;
	color: #DDF247;
	left: 0;
	top: 0;
	height: 44px;
	width: 44px;
	cursor: pointer;
	display: block;
	z-index: 1;
	-webkit-transition: all 400ms linear;
	-o-transition: all 400ms linear;
	transition: all 400ms linear;
}
.progress-wrap.active-progress 	{
	opacity: 1;
	visibility: visible;
	-webkit-transform: translateY(0);
	-ms-transform: translateY(0);
	transform: translateY(0);
}
.progress-wrap svg path 	{
	fill: none;
}
.progress-wrap svg.progress-circle path 	{
	box-sizing: border-box;
	stroke: #DDF247;
	stroke-width: 5;
	transition-property: all;
	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
	transition-duration: 150ms;
	transition-duration: 0.4s;
	transition-timing-function: linear;
}


/* cursor
------------------------------------------------------ */
.tf-mouse 	{
	position: fixed;
	left: 0;
	top: 0;
	pointer-events: none;
	border-radius: 50%;
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	visibility: hidden
}
.tf-mouse-inner 	{
	margin-left: -5px;
	margin-top: -5px;
	width: 8px;
	height: 8px;
	z-index: 10000;
	background-color: #DDF247;
	-webkit-transition: width .5s ease-in-out, height .5s ease-in-out, margin .5s ease-in-out, opacity .5s ease-in-out;
	transition: width .5s ease-in-out, height .5s ease-in-out, margin .5s ease-in-out, opacity .5s ease-in-out
}
.tf-mouse-inner.mouse-hover 	{
	margin-left: -40px;
	margin-top: -40px;
	width: 80px;
	height: 80px;
	background-color: #DDF247;
	opacity: .3
}
.tf-mouse-outer 	{
	margin-left: -22px;
	margin-top: -22px;
	width: 40px;
	height: 40px;
	border: 2px solid #DDF247;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	z-index: 10000;
	opacity: .5;
	-webkit-transition: all .05s ease-out;
	transition: all .05s ease-out
}
.tf-mouse-outer.mouse-hover 	{
	opacity: 0
}

body.background-white .tf-mouse-inner 	{
	background-color: rgba(22, 22, 22, 1);
}

body.background-white .tf-mouse-outer 	{
	border-color: rgba(22, 22, 22, 1);
}
.notice-event-wrapper 	{
	display: flex !important;
	flex-wrap: wrap;
	gap: 20px;
	margin-left: 0 !important;
	margin-right: 0 !important;
	padding-top: 30px;
}
.notice-event-wrapper > .col-md-6 	{
	flex: 0 0 calc(50% - 10px);
	max-width: calc(50% - 10px);
	padding-left: 0 !important;
	padding-right: 0 !important;
	box-sizing: border-box;
	float: none;
}

/* 제목 + 더보기 버튼 헤더 */
.notice-header,
.event-header 	{
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 10px;
}

/* 제목 */
.notice-title,
.event-title 	{
	font-size: 20px;
	font-weight: 700;
	color: #ddf247;
	margin: 0;
	text-align: left;
}

/* 더보기 버튼 (기존 인기슬롯 전체보기 버튼 스타일 재사용) */
.btn-headline-more 	{
	display: flex;
	align-items: center;
	font-size: 14px;
	font-weight: 700;
	color: #ddf247;
	text-decoration: none;
	transition: all 0.3s ease;
}
.btn-headline-more i.icon-arrow 	{
	margin-left: 5px;
	transition: transform 0.3s ease;
}
.btn-headline-more:hover 	{
	color: #c9e034;
}
.btn-headline-more:hover i.icon-arrow 	{
	transform: translateX(5px);
}

/* 박스 */
.notice-box,
.event-box 	{
	background-color: #2d2d2d;
	border-radius: 12px;
	padding: 20px;
	display: flex;
	flex-direction: column;
}

/* 리스트 */
.notice-list,
.event-list 	{
	list-style: none;
	padding: 0;
	margin: 0;
	max-height: 360px;
	overflow: hidden;
	flex: 1;
	transition: max-height 0.5s ease;
}
.notice-list li,
.event-list li 	{
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
	padding: 2px 0;
}
.notice-list li:last-child,
.event-list li:last-child 	{
	border-bottom: none;
}
.notice-list a,
.event-list a 	{
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 8px 5px;
	color: #ffffff;
	text-decoration: none;
	font-size: 15px;
}
.notice-list a:hover,
.event-list a:hover 	{
	background-color: #161616;
}
.notice-list .title,
.event-list .title 	{
	font-weight: 600;
}
.notice-list .date,
.event-list .date 	{
	font-size: 13px;
	color: #cccccc;
}

/* 모달 */
.post-modal 	{
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.6);
	z-index: 9999;
	justify-content: center;
	align-items: center;
	opacity: 0;
	transition: opacity 0.3s ease;
}
.post-modal.show 	{
	display: flex;
	opacity: 1;
}
.post-modal-content 	{
	background: #2d2d2d;
	border-radius: 5px;
	padding: 20px;
	width: 90%;
	max-width: 500px;
	color: #fff;
	position: relative;
	opacity: 0;
	transform: scale(0.95);
	transition: opacity 0.3s ease, transform 0.3s ease;
}
.post-modal.show .post-modal-content 	{
	opacity: 1;
	transform: scale(1);
}

body.modal-open::before 	{
	content: "";
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	backdrop-filter: blur(5px);
	z-index: 9998;
}
.post-modal-content h2 	{
	font-size: 22px;
	color: #ddf247;
	margin-bottom: 10px;
}
.post-modal-content p 	{
	font-size: 14px;
	color: #cccccc;
	margin-bottom: 10px;
}
#post-modal-body 	{
	font-size: 14px;
	color: #ffffff;
	margin-top: 20px;
}
.post-modal-close 	{
	position: absolute;
	top: 15px;
	right: 20px;
	font-size: 28px;
	cursor: pointer;
	color: #ddf247;
}

@media screen and (max-width: 767px) 	{
	.notice-event-wrapper 	{
		flex-direction: column;
	}
	.notice-event-wrapper > .col-md-6 	{
		flex: 0 0 100%;
		max-width: 100%;
	}
}
.btn-view-all 	{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 8px 20px;
	font-size: 14px;
	font-weight: 600;
	color: #ffffff;
	border: 1px solid #ffffff;
	border-radius: 16px;
	background-color: transparent;
	transition: all 0.3s ease;
	text-decoration: none;
	position: relative;
}
.btn-view-all i.icon-arrow-right2 	{
	margin-left: 8px;
	font-size: 16px;
	transition: transform 0.3s ease;
}
.btn-view-all:hover 	{
	background-color: #ffffff;
	color: #000000;
	border-color: #ffffff;
}
.btn-view-all:hover i.icon-arrow-right2 	{
	transform: translateX(5px);
}
.heading-section 	{
	margin-left: 20px;
	margin-right: 20px;
	margin-bottom: clamp(20px, 3vw, 30px);
}
.section-title 	{
	font-family: 'HangamePoker';
	font-size: 32px;
	font-weight: 800;
	color: #ddf247;
	margin-bottom: 0;
}
.modal-divider 	{
	height: 1px;
	background-color: #444;
	margin: 20px 0;
}
.modal-title 	{
	font-size: 22px;
	font-weight: 700;
	color: #ddf247;
	text-align: center;
	margin-bottom: 0;
}
.modal-date 	{
	font-size: 14px;
	color: #aaa;
	text-align: center;
	margin-bottom: 0;
}


.modal-footer 	{
	text-align: center;
	border-top: 0px;
	display: flex;
	justify-content: center;
}
#modal-close-button 	{
	font-size: 1.2rem;
	font-weight: 600;
	width: 20%;
	border-radius: 5px;
	height: 40px;
	line-height: 15px;
}
.new-badge 	{
	display: inline-block;
	margin-left: 6px;
	padding: 2px 6px;
	background: #ddf247;
	color: #000;
	font-size: 11px;
	font-weight: 700;
	border-radius: 8px;
}
.tf-partner-sec 	{
	background: #161616;
	padding-bottom: 60px;
}
.swiper-slide 	{
	height: 100px;
}
.partner-swiper 	{
	margin-bottom: 30px;
}
.partner-swiper .swiper-slide 	{
	height: 120px !important;
	border-radius: 16px;
}
.partner-item 	{
	position: relative;
	height: 100px !important;
	overflow: hidden;
}
.partner-item img 	{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) scale(0.6);
	width: auto;
	max-width: 100%;
	max-height: 60px;
	object-fit: contain;
}
.partner-swiper.reverse 	{
	transform: rotateY(180deg);
}
.partner-swiper.reverse .partner-item 	{
	transform: rotateY(180deg);
}

@media screen and (max-width: 1024px) 	{
	.partner-item 	{
		height: 80px;
	}
}

@media screen and (max-width: 768px) 	{
	.partner-item 	{
		height: 60px;
	}
}

@media screen and (max-width: 480px) 	{
	.partner-item 	{
		height: 50px;
	}
}
.col-xl-5th 	{
	width: 20%;
	flex: 0 0 20%;
	max-width: 20%;
}

@media (max-width: 1399px) 	{
	.col-xl-5th 	{
		width: 25%;
		flex: 0 0 25%;
		max-width: 25%;
	}
}

@media (max-width: 991px) 	{
	.col-xl-5th 	{
		width: 33.3333%;
		flex: 0 0 33.3333%;
		max-width: 33.3333%;
	}
}

@media (max-width: 767px) 	{
	.col-xl-5th 	{
		width: 50%;
		flex: 0 0 50%;
		max-width: 50%;
	}
}
.fl-item 	{
	padding-left: 8px;
	padding-right: 8px;
}
.flex-align 	{
	display: flex;
	align-items: center;
	gap: 8px;
}
.user-level 	{
	display: flex;
	align-items: center;
	padding: 1px 8px;
	font-size: 13px;
	font-weight: 900;
	color: #161616;
	border-radius: 5px;
	background-color: #ddf247;
}
.user-level .level-number 	{
	margin-left: 2px;
}
.user-name 	{
	font-weight: 700;
	font-size: 16px;
	color: #ddf247;
}
.user-welcome 	{
	font-size: 14px;
	font-weight: 500;
	padding-top: 2px;
	margin-left: -5px;
}
.my-page-link-wrap 	{
	display: flex;
	justify-content: flex-end;
	padding-top: 10px;
	width: 100%;
}
.my-page-link 	{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-weight: 700;
	color: #fff;
	text-decoration: none;
	font-size: 14px;
}
.my-page-text 	{
	letter-spacing: 1px;
}
.arrow-circle 	{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 20px;
	background-color: #ddf247;
	border-radius: 50%;
	font-size: 12px;
	color: #161616;
	font-weight: bold;
	line-height: 1;
}
.info-row 	{
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 10px;
}
.info-label 	{
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 8px;
	font-size: 12px;
	font-weight: 900;
	color: #161616;
	border-radius: 5px;
	background-color: #ddf247;
	height: 24px;
	min-width: 60px;
	text-align: center;
	transition: background-color 0.3s ease, color 0.3s ease;
}
.info-label:hover 	{
	background-color: #ffffff;
	color: #000;
	/* 원하는 텍스트 컬러로 변경 가능 */
}
.info-right 	{
	display: flex;
	align-items: baseline;
	gap: 4px;
}
.info-value 	{
	font-weight: 700;
	font-size: 16px;
	color: #ddf247;
}
.info-unit 	{
	font-size: 13px;
	padding-top: 2px;
	color: #fff;
}


.widget-social ul.flex 	{
	display: flex;
}
.widget-social .social-icon 	{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	background-color: #2a2a2a;
	border-radius: 50%;
	transition: background-color 0.3s ease;
}
.widget-social .social-icon img 	{
	width: 20px;
	height: 20px;
	object-fit: contain;
	pointer-events: none;
}
.widget-social .social-icon.telegram:hover 	{
	background-color: #0088cc;
}
.widget-social .social-icon.line:hover 	{
	background-color: #00c300;
}
.widget-social .social-icon.kakao:hover 	{
	background-color: #fae100;
}
.widget-social .social-icon.skype:hover 	{
	background-color: #00aff0;
}


.footer-description 	{
	padding-top: 20px;
	font-weight: 200;
	font-size: 14px;
	color: #ffffff75;
	line-height: 18px;
}

/* 슬롯 모달 */
.game-modal 	{
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background: rgba(0, 0, 0, 0.85);
	z-index: 9999;
	display: flex;
	justify-content: center;
	align-items: center;
	backdrop-filter: none;
	filter: none;
}
.game-modal.hidden 	{
	display: none;
}
.modal-content 	{
	background: #161616;
	border-radius: 16px;
	padding: 30px;
	width: 90%;
	max-width: 1200px;
	max-height: 90vh;
	overflow-y: auto;
	/* Firefox */
	scrollbar-width: thin;
	scrollbar-color: #ddf247 #161616;
}

/* Webkit */
.modal-content::-webkit-scrollbar 	{
	width: 10px;
}
.modal-content::-webkit-scrollbar-track 	{
	background: #161616;
	border-radius: 10px;
}
.modal-content::-webkit-scrollbar-thumb 	{
	background-color: #ddf247;
	border-radius: 10px;
	border: 2px solid #161616;
}
.modal-content::-webkit-scrollbar-thumb:hover 	{
	background-color: #cce927;
}

/* 타이틀 + 검색 감싸는 부분 */
.modal-header-wrap 	{
	background-color: #161616;
	padding: 20px 30px;
	border-top: 5px solid #ddf247;
	border-top-left-radius: 20px;
	border-top-right-radius: 20px;
	margin-bottom: 8px;
}
.modal-header 	{
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 15px;
}
.modal-title 	{
	font-size: 24px;
	font-weight: bold;
	color: #ddf247;
}
.modal-close 	{
	font-size: 30px;
	color: white;
	background: none;
	border: none;
	cursor: pointer;
}

/* 검색창 wrapper + icon + input */
.modal-search .search-wrapper 	{
	position: relative;
	display: flex;
	align-items: center;
}
.search-icon.icon-search::before 	{
	content: "\e915";
	font-family: 'icomoon';
	font-size: 16px;
	color: #ddf247;
}
.modal-search .search-icon 	{
	position: absolute;
	left: 12px;
	pointer-events: none;
}
.modal-search input 	{
	width: 100%;
	padding: 12px 12px 12px 36px;
	border-radius: 8px;
	border: none;
	font-size: 16px;
	background-color: #2c2c2c;
	color: white;
}

/* 게임 리스트 */
.modal-body 	{
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 10px;
	align-items: start;
	border-bottom-left-radius: 20px;
	border-bottom-right-radius: 20px;
	padding-bottom: 40px;
}

@media (max-width: 500px) 	{
	.modal-body 	{
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}
	.game-card 	{
		align-self: stretch;
		display: flex;
		flex-direction: column;
	}
	.game-card img 	{
		aspect-ratio: 1 / 1;
		width: 100%;
		height: auto;
		object-fit: cover;
	}
	.game-name 	{
		margin-top: 10px;
		font-size: 14px;
		color: white;
		font-weight: 500;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
}

/* 카드 기본 */
.game-card 	{
	width: 100%;
	background: #232323;
	padding: 12px;
	border-radius: 10px;
	text-align: center;
	transition: transform 0.3s ease;
}
.game-card:hover 	{
	transform: scale(1.05);
}
.game-card img 	{
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: 8px;
}
.game-name 	{
	margin-top: 10px;
	font-size: 14px;
	color: white;
	font-weight: 500;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.game-card.hidden 	{
	display: none !important;
}
.modal-body.search-active 	{
	grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
}


.modal-body.search-active .game-card 	{
	width: 100%;
	flex: 0 0 auto;
}
.no-result 	{
	grid-column: 1 / -1;
	text-align: center;
	padding: 40px 0;
	font-size: 16px;
	color: #ddf247;
	display: none;
}
.button-link-wrapper 	{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px;
}
.themed-button 	{
	display: inline-block;
	padding: 8px 24px;
	background-color: #ddf247;
	color: #161616;
	font-weight: bold;
	border-radius: 8px;
	text-align: center;
	font-size: 15px;
	width: 150px;
	transition: transform 0.4s ease, background-color 0.3s ease, color 0.3s ease;
	transform: translateY(0);
}
.themed-button:hover 	{
	background-color: #ffffff;
	color: #161616;
	transform: translateY(-4px);
	transition: transform 0.2s ease-out, background-color 0.3s ease, color 0.3s ease;
}

@media (max-width: 670px) 	{
	.themed-button 	{
		width: 100%;
		max-width: 300px;
	}
	.button-link-wrapper 	{
		flex-direction: column;
		align-items: center;
	}
}
.section-inquiry-form 	{
	background-color: #131313;
	padding: 40px 20px;
	border-top: 1px solid transparent;
	border-bottom: 1px solid transparent;
	border-image: linear-gradient(90deg, #ddf24700 15%, #ddf247 50%, #ddf24700 85%) 1;
}
.inquiry-title 	{
	font-size: 22px;
	color: #ddf247;
	font-weight: bold;
	margin-bottom: 25px;
	text-align: center;
}
.inquiry-form 	{
	display: flex;
	flex-direction: column;
	gap: 16px;
	max-width: 800px;
	margin: 0 auto;
}
.inquiry-label 	{
	font-size: 14px;
	color: #ccc;
	padding-left: 4px;
	margin-bottom: -6px;
}
.inquiry-input,
.inquiry-textarea 	{
	background-color: #2d2d2d !important;
	border: 1px solid #2c2c2c !important;
	border-radius: 8px !important;
	padding: 14px !important;
	font-size: 15px !important;
	color: #888;
	width: 100%;
	box-sizing: border-box;
	transition: border-color 0.3s ease, color 0.3s ease;
}
.inquiry-input:focus,
.inquiry-textarea:focus 	{
	border-color: #ddf247;
	color: #fff;
	outline: none;
}
.inquiry-textarea 	{
	min-height: 260px;
}
.submit-button 	{
	align-self: center;
	padding: 12px 12px;
	background-color: #ddf247;
	color: #161616;
	font-weight: bold;
	font-size: 15px;
	border-radius: 8px;
	transition: all 0.3s ease;
	height: 40px;
	line-height: 10px;
	margin-top: 10px;
	overflow: hidden;
}
.submit-button:hover 	{
	background-color: #ffffff;
	transform: translateY(-4px);
}
.inquiry-textarea::-webkit-scrollbar 	{
	width: 10px;
}
.inquiry-textarea::-webkit-scrollbar-track 	{
	background: #161616;
	border-radius: 10px;
}
.inquiry-textarea::-webkit-scrollbar-thumb 	{
	background-color: #ddf247;
	border-radius: 10px;
	border: 2px solid #161616;
}
.inquiry-textarea::-webkit-scrollbar-thumb:hover 	{
	background-color: #cce927;
}
.themed-button span[class^="icon-"] 	{
	font-family: 'icomoon';
	font-size: 16px;
	margin-right: 8px;
	vertical-align: middle;
	display: inline-block;
	color: inherit;
}
.icon-wallet::before 	{
	content: '\eaf8';
}
.icon-notice::before 	{
	content: '\e942';
}
.icon-history::before 	{
	content: '\eaed';
}
.icon-submit::before 	{
	content: '\ea10';
}
.section-inquiry-history 	{
	background-color: #161616;
	border-radius: 12px;
	padding: 40px 20px;
	margin-top: 30px;
}
.inquiry-history-title 	{
	font-family: 'HangamePoker';
	font-size: 32px;
	font-weight: 800;
	color: #ddf247;
	margin-bottom: 20px;
	margin-left: 20px;
}
.inquiry-history-list 	{
	list-style: none;
	padding: 0;
	margin: 0;
}
.inquiry-history-item 	{
	background-color: #2d2d2d;
	border: 1px solid #2c2c2c;
	border-radius: 8px;
	padding: 16px;
	margin-bottom: 12px;
	cursor: pointer;
	transition: background-color 0.3s;
}
.inquiry-history-item:hover 	{
	background-color: #252525;
}
.history-subject 	{
	font-size: 16px;
	font-weight: 600;
	color: #fff;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.history-meta 	{
	font-size: 13px;
	color: #aaa;
	margin-top: 8px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.history-status 	{
	padding: 2px 8px;
	border-radius: 6px;
	font-weight: bold;
	font-size: 12px;
	background-color: #ddf247;
	color: #161616;
}
.history-content 	{
	margin-top: 12px;
	font-size: 14px;
	color: #ddd;
	line-height: 1.6;
	display: none;
}
.inquiry-history-item.active .history-content 	{
	display: block;
	animation: fadeIn 0.3s ease-in-out;
}

@keyframes fadeIn 	{
	0% 	{
		opacity: 0;
		transform: translateY(-4px);
	}

	100% 	{
		opacity: 1;
		transform: translateY(0);
	}
}



.custom-list 	{
	list-style: none;
	padding: 0;
	margin: 0;
}
.custom-item 	{
	background-color: #2d2d2d;
	border: 1px solid #2c2c2c;
	border-radius: 8px;
	padding: 16px;
	margin-bottom: 12px;
	transition: background-color 0.3s;
}
.custom-item:hover 	{
	background-color: #252525;
}
.custom-row 	{
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 15px;
	color: #fff;
	font-weight: 500;
}
.custom-amount 	{
	color: #ddf247;
	font-weight: bold;
	min-width: 100px;
	text-align: left;
}
.custom-status 	{
	padding: 2px 8px;
	font-size: 13px;
	font-weight: bold;
	border-radius: 6px;
	min-width: 60px;
	text-align: center;
}
.status-approved 	{
	background-color: #2ecc71;
	color: #161616;
}
.status-cancelled 	{
	background-color: #e67e22;
	color: #fff;
}
.status-rejected 	{
	background-color: #e74c3c;
	color: #fff;
}
.custom-date 	{
	font-size: 14px;
	color: #aaa;
	min-width: 100px;
	text-align: right;
}

/* 입금내역역 */
.section-deposit-withdraw 	{
	padding: 80px 20px;
	background-color: #0e0e0e;
	border-radius: 12px;
}
.deposit-withdraw-wrapper 	{
	display: flex;
	flex-wrap: wrap;
	margin: 0 -15px;
}
.deposit-col,
.withdraw-col 	{
	width: 100%;
	max-width: 50%;
	padding: 0 15px;
}

@media (max-width: 767px) 	{

	.deposit-col,
	.withdraw-col 	{
		max-width: 100%;
	}
}
.deposit-heading,
.withdraw-heading 	{
	padding-bottom: 20px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-left: 20px;
}
.deposit-title,
.withdraw-title 	{
	font-size: 32px;
	font-weight: 800;
	color: #ddf247;
	margin: 0;
	font-family: 'HangamePoker';
}
.deposit-box,
.withdraw-box 	{
	background-color: #161616;
	padding: 20px;
	border-radius: 12px;
}
.deposit-header,
.withdraw-header 	{
	display: flex;
	justify-content: space-between;
	padding: 10px 0;
	background-color: #2d2d2d;
	border-radius: 3px;
	padding: 10px 16px;
	font-size: 14px;
	font-weight: 600;
	color: #aaa;
}
.deposit-header span,
.withdraw-header span 	{
	flex: 1;
	text-align: left;
}
.deposit-header .status-label,
.withdraw-header .status-label 	{
	text-align: center;
	margin-left: 24px;
}
.deposit-header .date-label,
.withdraw-header .date-label 	{
	text-align: right;
}
.deposit-list,
.withdraw-list 	{
	list-style: none;
	padding: 0;
	margin: 0;
}
.deposit-list li,
.withdraw-list li 	{
	border-bottom: 1px solid #333;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 12px 0;
}
.deposit-list .title,
.withdraw-list .title 	{
	font-size: 15px;
	font-weight: 500;
	color: #fff;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	min-width: 120px;
	text-align: left;
}
.deposit-list .status,
.withdraw-list .status 	{
	font-size: 13px;
	font-weight: 600;
	padding: 3px 10px;
	border-radius: 3px;
	flex-shrink: 0;
	width: 50px;
	text-align: center;
}
.deposit-list .date,
.withdraw-list .date 	{
	font-size: 13px;
	color: #aaa;
	flex-shrink: 0;
	margin-left: 10px;
	text-align: right;
	min-width: 80px;
}
.badge-approve 	{
	background-color: #DDF247;
	color: #000;
}
.badge-reject 	{
	background-color: #000000;
	color: #fff;
}
.badge-wait 	{
	background-color: #ffffff;
	color: #000000;
}


/*입금신청*/
.balance-box 	{
	background-color: #232323;
	padding: 20px;
	border-radius: 12px;
	position: relative;
}
.balance-label 	{
	font-size: 18px;
	color: #fff;
	font-weight: 600;
}
.balance-amount 	{
	font-size: 22px;
	font-weight: 700;
	color: #DDF247;
}
.refresh-btn 	{
	background: none;
	border: none;
	color: #DDF247;
	font-size: 18px;
	cursor: pointer;
}
.input-amount 	{
	background-color: #161616;
	border: 2px solid #DDF247;
	color: #fff;
	font-size: 18px;
	padding: 14px 20px;
	border-radius: 12px;
	width: 100%;
	text-align: right;
}
.amount-buttons 	{
	display: flex;
	justify-content: space-between;
	flex-wrap: nowrap;
	gap: 10px;
	margin-top: 20px;
}
.amount-buttons button 	{
	flex: 1;
	min-width: 0;
	background-color: #232323;
	color: #fff;
	border-bottom: 4px solid #DDF247;
	border-radius: 0px;
	padding: 0;
	font-size: 14px;
	font-weight: 600;
	white-space: nowrap;
	text-align: center;
	transition: all 0.3s ease;
	line-height: 2px;
	height: 40px;
}
.amount-buttons button:hover 	{
	background-color: #DDF247;
	color: #161616;
}

@media (max-width: 640px) 	{
	.amount-buttons 	{
		flex-wrap: wrap;
	}
	.amount-buttons button 	{
		flex: 1 1 calc(33.333% - 10px);
	}
}
.btn-group .tf-button 	{
	height: 50px;
	font-size: 16px;
	font-weight: 700;
}
.deposit-button-wrap,
.inquiry-button-wrap 	{
	width: 100%;
}
.deposit-button-wrap .tf-button,
.inquiry-button-wrap .tf-button 	{
	height: 50px;
	font-size: 16px;
	font-weight: 700;
	border-radius: 12px;
}
.btn-center-wrap 	{
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 10px;
	margin-top: 30px;
}
.btn-wrap .tf-button 	{
	width: 200px;
	height: 40px;
	line-height: 10px;
	font-size: 16px;
	font-weight: 700;
	border-radius: 4px;
	color: #000000;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button 	{
	-webkit-appearance: none;
	margin: 0;
}

input[type="number"] 	{
	appearance: textfield;
	-moz-appearance: textfield;
}
.btn-inquiry 	{
	background-color: #ffffff !important;
	color: #161616 !important;
}
.btn-inquiry:hover 	{
	background-color: #DDF247 !important;
	color: #161616 !important;
}
.deposit-caution-text 	{
	text-align: center;
	font-size: 14px;
	color: #fff;
	margin-top: 20px;
	line-height: 1.6;
}
.deposit-caution-text strong 	{
	color: #DDF247;
	font-weight: 700;
}

@media (max-width: 500px) 	{
	.btn-center-wrap 	{
		transform: scale(0.75);
		transform-origin: center top;
	}
	.btn-wrap .tf-button 	{
		font-size: 20px;
		padding: 0;
	}
}

/* 출금신청 */
.deposit-section-title 	{
	font-family: 'HangamePoker';
	font-size: 32px;
	font-weight: 800;
	color: #DDF247;
	text-align: center;
	margin-bottom: 40px;
}


.balance-box-copy 	{
	background-color: #232323;
	padding: 20px;
	border-radius: 12px;
	position: relative;
}
.balance-label-copy 	{
	font-size: 18px;
	font-weight: 600;
}


.refresh-btn-copy 	{
	background: transparent;
	border: none;
	cursor: pointer;
	font-size: 18px;
}
.form-group-copy input.input-amount-copy 	{
	font-family: inherit;
	font-size: 16px;
	padding: 15px 26px;
	text-align: right;
}
.amount-buttons-copy 	{
	display: flex;
	justify-content: space-between;
	flex-wrap: nowrap;
	gap: 10px;
	margin-top: 20px;
	margin-bottom: 20px;
}
.amount-buttons-copy button 	{
	flex: 1;
	min-width: 0;
	background-color: #232323;
	color: #fff;
	border-bottom: 4px solid #DDF247;
	border-radius: 0px;
	padding: 0;
	font-size: 14px;
	font-weight: 600;
	white-space: nowrap;
	text-align: center;
	transition: all 0.3s ease;
	line-height: 2px;
	height: 40px;
}
.amount-buttons-copy button:hover 	{
	background-color: #DDF247;
	color: #000;
}

@media (max-width: 640px) 	{
	.amount-buttons-copy 	{
		flex-wrap: wrap;
	}
	.amount-buttons-copy button 	{
		flex: 1 1 calc(33.333% - 10px);
	}
}
.btn-center-wrap-copy 	{
	display: flex;
	justify-content: center;
	gap: 20px;
	margin-bottom: 20px;
}
.btn-wrap-copy .tf-button.btn-inquiry-copy 	{
	background-color: #DEE8E8;
}

@media (max-width: 500px) 	{
	.btn-center-wrap-copy 	{
		transform: scale(0.75);
		transform-origin: center top;
	}
	.btn-wrap .tf-button 	{
		font-size: 20px;
		padding: 0;
	}
}
.deposit-caution-text-copy 	{
	text-align: center;
	font-size: 14px;
	color: #fff;
	margin-top: 20px;
}
.section-inquiry-form-copy 	{
	background-color: #000000;
	padding: 40px 20px;
	border-bottom: 1px solid transparent;
	border-image: linear-gradient(90deg, #ddf24700 15%, #ddf247 50%, #ddf24700 85%) 1;
}


.link-inquiry strong 	{
	color: #DDF247;
}
.link-inquiry strong:hover 	{
	color: #fff;
	text-decoration: underline;
}
.withdrawl-password 	{
	margin-bottom: 20px;
}
.withdrawl-password input.withdraw-input-password 	{
	font-family: inherit;
	font-size: 16px;
	padding: 14px 40px;
	width: 100%;
	border-radius: 12px;
	background: #161616;
	color: #ffffff;
	border: none;
	outline: none;
}
.icon-eye-toggle::before 	{
	content: "\eb0a";
	font-family: 'icomoon';
	font-size: 18px;
	color: rgba(255, 255, 255, 0.5);
	transition: color 0.3s;
}
.toggle-password:hover .icon-eye-toggle::before 	{
	color: rgba(255, 255, 255, 1);
}
.password-input-wrap 	{
	position: relative;
}
.withdraw-input-password 	{
	font-family: inherit;
	font-size: 16px;
	padding: 14px 20px;
	width: 100%;
	border-radius: 12px;
	background: #161616;
	color: #ffffff;
	border: none;
	outline: none;
	text-align: right;
}
.toggle-password 	{
	position: absolute;
	top: 50%;
	right: 18px;
	transform: translateY(-50%);
	cursor: pointer;
}


.icon-deposit::before 	{
	content: "\e960";
	font-family: 'icomoon';
	margin-right: 16px;
	font-size: 32px;
	vertical-align: top;
	display: inline-block;
}
.icon-withdrawl::before 	{
	content: "\e961";
	font-family: 'icomoon';
	margin-right: 16px;
	font-size: 32px;
	vertical-align: top;
	display: inline-block;
}

/* 포인트전환 */
.section-point-convert 	{
	background-color: #131313;
	padding: 40px 20px;
	border-bottom: 1px solid transparent;
	border-image: linear-gradient(90deg, #ddf24700 15%, #ddf247 50%, #ddf24700 85%) 1;
}
.section-point-convert .deposit-section-title 	{
	display: flex;
	align-items: center;
	font-family: 'HangamePoker';
	font-size: 32px;
	color: #ddf247;
	text-align: center;
	justify-content: center;
	margin-bottom: 40px;
}
.section-point-convert .balance-box 	{
	background-color: #232323;
	padding: 40px 20px;
	border-radius: 12px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 20px;
}
.section-point-convert .balance-label 	{
	font-size: 18px;
	font-weight: 600;
	color: #fff;
}
.section-point-convert .balance-amount 	{
	font-size: 22px;
	font-weight: 700;
	color: #ddf247;
}
.section-point-convert .deposit-description 	{
	font-size: 14px;
	color: #fff;
	text-align: center;
	margin-top: 20px;
}
.icon-convert::before 	{
	content: "\e99f";
	font-family: 'icomoon';
	margin-right: 16px;
	font-size: 32px;
	vertical-align: top;
	display: inline-block;
}

/* 페이지 상단 캐쉬,포인트 박스 */
@keyframes bounceSubtle 	{
	0%,100% {	transform: translateY(0);}
	50% 	{	transform: translateY(-2px);}
}
.wallet-box i.ani-bounce::before 	{
	display: inline-block;
	animation: bounceSubtle 1.5s ease-in-out infinite;
}
.wallet-info 	{
	display: flex;
	gap: 10px;
	align-items: center;
}
.wallet-box 	{
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 9px 20px;
	border-radius: 4px;
	font-family: 'HangamePoker';
	font-size: 13px;
	font-weight: 700;
	white-space: nowrap;
	background-color: #161616;
	color: #ddf247;
	border: 1px solid #DDF247;
	transition: all 0.3s ease;
}

@media (max-width: 600px) 	{
	.wallet-info 	{
		display: none !important;
	}
}


.wallet-box:hover 	{
	transform: translateY(-5px);
	color: #000000;
	border-color: #ddf247;
	background-color: #ddf247;
}
.wallet-link 	{
	text-decoration: none;
	display: inline-block;
}

/* 로그인 페이지 */
.login-image-area 	{
	position: relative;
	width: 100%;
	height: 160px;
	border-radius: 12px;
	overflow: hidden;
	margin-bottom: 30px;
}
.login-image-area .bg-image 	{
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	filter: brightness(0.4);
	z-index: 0;
	position: relative;
}
.bg-grid-animate 	{
	position: absolute;
	width: 100%;
	height: 100%;
	perspective: 450px;
	z-index: 1;
	top: 0;
}
.bg-line-animate 	{
	width: 100%;
	height: 150%;
	transform: rotateX(316deg);
	opacity: 0.15;
	overflow: hidden;
	position: relative;
	bottom: 20px;
}
.bg-line-animate::before 	{
	content: '';
	position: absolute;
	width: 100%;
	height: 200%;
	background-image: linear-gradient(to right, #fff 1px, transparent 0),
		linear-gradient(to bottom, #fff 1px, transparent 0);
	background-size: 39px 39px;
	background-repeat: repeat;
	animation: playline 2s linear infinite;
}
.bg-line-animate::after 	{
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	background: linear-gradient(180deg,
			rgba(22, 22, 22, 1) 0%,
			rgba(22, 22, 22, 0.2) 10%,
			rgba(22, 22, 22, 0) 20%,
			rgba(22, 22, 22, 0) 80%,
			rgba(22, 22, 22, 0.2) 90%,
			rgba(22, 22, 22, 1) 100%);
}

@keyframes rotateWithDepth 	{
	0% 		{	transform: translate(-50%, -50%) rotateY(0deg) scale(1);}
	50% 	{	transform: translate(-50%, -50%) rotateY(360deg) scale(1);}
	60% 	{	transform: translate(-50%, -50%) rotateY(360deg) scale(1.15);}
	70% 	{	transform: translate(-50%, -50%) rotateY(360deg) scale(1);}
	100% 	{	transform: translate(-50%, -50%) rotateY(360deg) scale(1);}
}
.logo-image.logo-rotate-perspective 	{
	animation: rotateWithDepth 5s ease-in-out infinite;
	transform-style: preserve-3d;
	transform-origin: center;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 200px;
	transform: translate(-50%, -50%);
	z-index: 2;
}
.login-image-area 	{
	position: relative;
	width: 100%;
	height: 160px;
	border-radius: 12px;
	overflow: hidden;
	margin-bottom: 30px;
	perspective: 150px;
}


@keyframes playline 	{
	0% 	{
		background-position: 0 0;
	}

	100% 	{
		background-position: 0 39px;
	}
}
.site-brand 	{
	color: #ddf247;
	font-weight: 500;
}
.signup-image-area 	{
	position: relative;
	width: 100%;
	height: 90px;
	border-radius: 12px;
	overflow: hidden;
	margin-bottom: 30px;
	perspective: 150px;
}
.signup-image-area .bg-image 	{
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	filter: brightness(0.4);
	z-index: 0;
	position: relative;
}

/*베팅내역 */

.section-casino-history 	{
	background-color: #161616;
	border-top: 2px solid #ddf247;
	border-bottom: 2px solid #ddf247;
	padding: 40px 20px;
	color: #fff;
	border-top: 1px solid transparent;
	border-bottom: 1px solid transparent;
	border-image: linear-gradient(90deg, #ddf24700 15%, #ddf247 50%, #ddf24700 85%) 1;
}
.casino-tab-menu button 	{
	background-color: #161616;
	border: 1px solid #ddf247;
	color: #ddf247;
	padding: 10px 20px;
	font-weight: bold;
	border-radius: 6px;
	transition: all 0.3s ease;
	margin-right: 10px;
	flex-shrink: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	height: 40px;
	line-height: 10px;
}
.casino-tab-menu button.active,
.casino-tab-menu button:hover 	{
	background-color: #ddf247;
	color: #161616;
}
.casino-provider-filter .provider-btn 	{
	background-color: #1f1f1f;
	color: #fff;
	border: 1px solid #333;
	padding: 8px 15px;
	border-radius: 4px;
	font-size: 14px;
	cursor: pointer;
	height: 40px;
	transition: background-color 0.3s ease;
}
.casino-provider-filter .provider-btn.active,
.casino-provider-filter .provider-btn:hover 	{
	background-color: #ddf247;
	color: #161616;
	border-color: #ddf247;
}
.casino-history-table table 	{
	width: 100%;
	border-collapse: collapse;
	background-color: #1a1a1a;
}
.casino-history-table th,
.casino-history-table td 	{
	padding: 12px;
	text-align: center;
	border: 1px solid #2c2c2c;
	color: #fff;
	font-size: 14px;
}
.casino-history-table th 	{
	background-color: #2a2a2a;
	color: #ddf247;
	font-weight: bold;
	font-size: 14px;
}
.casino-pagination 	{
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
}

@media (max-width: 768px) 	{
	.casino-pagination 	{
		justify-content: center;
	}
}
.casino-pagination .pagination-info 	{
	font-size: 14px;
	color: #aaa;
}
.pagination-buttons 	{
	display: flex;
	gap: 5px;
}
.pagination-buttons .pagination-btn 	{
	background-color: #2a2a2a;
	border: 1px solid #444;
	color: #fff;
	padding: 6px 12px;
	border-radius: 4px;
	cursor: pointer;
	transition: all 0.3s;
	height: 35px;
}

@media (max-width: 768px) 	{
	.pagination-buttons .pagination-btn 	{
		font-size: 12px;
		overflow: hidden;
		padding: 6px 6px;
	}
}


.pagination-buttons .pagination-btn:hover 	{
	background-color: #ddf247;
	color: #161616;
	border-color: #ddf247;
}
.mobile-cards 	{
	display: none;
}

@media (max-width: 768px) 	{
	.casino-history-table table 	{
		display: none;
	}
	.mobile-cards 	{
		display: block;
	}
	.mobile-card 	{
		background-color: #1a1a1a;
		border: 1px solid #333;
		margin-bottom: 10px;
		padding: 15px;
		border-radius: 8px;
		color: #fff;
	}
	.mobile-card-row 	{
		display: flex;
		justify-content: space-between;
		border-bottom: 1px dashed #444;
		padding: 6px 0;
		font-size: 14px;
	}
	.mobile-card-row:last-child 	{
		border-bottom: none;
	}
	.mobile-card-row .label 	{
		color: #999;
	}
	.mobile-card-row .value 	{
		font-weight: bold;
		color: #fff;
	}
}
.casino-history-table tr:nth-child(even) td 	{
	background-color: #202020;
}
.mobile-card:nth-child(even) 	{
	background-color: #202020;
}
.pagination-btn i 	{
	margin-right: 6px;
	font-family: 'icomoon';
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	display: inline-block;
}
.casino-provider-filter 	{
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}


.scroll-guide-text 	{
	display: none;
}

@media (max-width: 768px) 	{
	.scroll-guide-text 	{
		display: block;
		text-align: center;
		font-size: 13px;
		color: #ddf247;
		margin-bottom: 20px;
	}
	.casino-provider-filter-wrapper 	{
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		display: block;
		width: 100%;
		position: relative;
		margin-bottom: 10px;
	}
	.casino-provider-filter-wrapper::-webkit-scrollbar 	{
		display: none;
	}
	.casino-provider-filter 	{
		display: flex;
		flex-wrap: nowrap;
		white-space: nowrap;
		gap: 10px;
		width: fit-content;
		min-width: max-content;
	}
	.casino-provider-filter .provider-btn 	{
		flex-shrink: 0;
		white-space: nowrap;
	}
}

/* 내 정보 */
.user-info-grid 	{
	max-width: 600px;
	margin: 0 auto 0 auto;
	padding: 0 15px;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 10px;
}
@media (max-width: 768px) 	{
	.user-info-grid 	{
		grid-template-columns: 1fr;
		max-width: 100%;
		margin: 30px 0 0 0;
		padding: 0 10px;
	}
}
.user-info-card 	{
	background-color: #1a1a1a;
	border: 1px solid #333;
	border-radius: 4px;
	padding: 16px 20px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.user-info-card .label 	{
	font-size: 14px;
	font-weight: 600;
	color: #ffffff;
	margin-bottom: 14px;
}
.user-info-card .value 	{
	background-color: #161616;
	border-bottom: 3px solid #080808;
	padding: 18px 14px;
	border-radius: 6px;
	font-family: 'HangamePoker';
	font-size: 18px;
	font-weight: 600;
	color: #ddf247;
	pointer-events: none;
	text-align: center;
}

@media (max-width: 768px) 	{
	.user-info-grid 	{
		grid-template-columns: 1fr;
	}
}
.user-info-title 	{
	text-align: center;
	font-family: 'HangamePoker';
	color: #ddf247;
	font-size: 32px;
	font-weight: 800;
	margin-bottom: 30px;
}
.user-info-note 	{
	margin-top: 30px;
	font-size: 14px;
	color: #bbb;
	line-height: 1.6;
	text-align: center;
}
.user-info-note a 	{
	color: #ddf247;
	font-weight: 600;
	text-decoration: none;
}
.user-info-note a:hover 	{
	text-decoration: underline;
}

/* 쪽지함 */

.note-box 	{
	background-color: #161616;
	border-radius: 14px;
	padding: 24px;
	color: #fff;
	font-size: 14px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);
}
.note-header 	{
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 30px;
	margin-top: 10px;
}
.note-title 	{
	font-size: 32px;
	font-family: 'HangamePoker';
	font-weight: 800;
	color: #ddf247;
	display: flex;
	align-items: center;
	gap: 8px;
}
.btn-read-all 	{
	background-color: #ddf247;
	color: #161616;
	border: none;
	padding: 8px 16px;
	font-weight: 600;
	border-radius: 6px;
	cursor: pointer;
	transition: all 0.2s ease;
	height: 35px;
	line-height: 12px;
}
.btn-read-all:hover 	{
	background-color: #ffffff;
	color: #161616;
}
.note-table 	{
	width: 100%;
	overflow: hidden;
	border-radius: 6px;
}
.note-table thead th 	{
	background-color: #292929;
	color: #fff;
	padding: 14px;
	font-weight: 700;
	font-size: 15px;
	border-bottom: 1px solid #444;
	text-align: center;
}
.note-table tbody tr:nth-child(even) 	{
	background-color: #2d2d2d;
}
.note-table tbody tr:nth-child(odd) 	{
	background-color: #161616;
}
.note-table td 	{
	padding: 8px;
	vertical-align: middle;
	border-bottom: 1px solid #2a2a2a;
	text-align: center;
}
.note-table td:first-child 	{
	white-space: nowrap;
}
.btn-delete 	{
	background-color: transparent;
	border: 1px solid #ddf247;
	color: #ddf247;
	padding: 2px 10px;
	border-radius: 4px;
	cursor: pointer;
	transition: all 0.2s ease;
	font-weight: 600;
	height: 30px;
	line-height: 10px;
}
.btn-delete:hover 	{
	background-color: #ddf247;
	color: #161616;
}
.note-footer 	{
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	margin-top: 20px;
	gap: 10px;
}
.note-total 	{
	color: #aaa;
	font-size: 13px;
}
.note-actions button,
.note-pagination button 	{
	background-color: transparent;
	border: 1px solid #555;
	color: #aaa;
	padding: 6px 12px;
	font-size: 13px;
	border-radius: 4px;
	cursor: pointer;
	transition: all 0.2s ease;
	height: 35px;
	line-height: 10px;
}
.note-actions button:hover,
.note-pagination button:hover 	{
	background-color: #333;
	color: #fff;
	border-color: #666;
}
.note-pagination .active 	{
	background-color: #ddf247;
	color: #161616;
	border-color: #ddf247;
	font-weight: 700;
}

@media (max-width: 768px) 	{
	.note-footer 	{
		flex-direction: column;
		align-items: flex-start;
	}
	.note-actions,
	.note-pagination 	{
		display: flex;
		gap: 8px;
		flex-wrap: wrap;
	}
}

@media (max-width: 768px) 	{
	.note-table 	{
		width: 100%;
		border-collapse: separate !important;
		border-spacing: 0 !important;
		border: none !important;
	}
	.note-table thead 	{
		display: none !important;
	}
	.note-table,
	.note-table tbody,
	.note-table tr 	{
		display: block;
		width: 100%;
		border: none !important;
	}
	.note-table tbody tr 	{
		border: 1px solid #333 !important;
		border-radius: 12px;
		padding: 10px 20px;
		margin-bottom: 20px;
		box-shadow: 0 4px 10px rgba(0, 0, 0, 0.25);
		text-align: center;
		position: relative;
		background-color: #1d1d1d;
	}
	.note-table tbody tr:nth-child(odd) 	{
		background-color: #232323;
	}
	.note-table td 	{
		display: block;
		width: 100%;
		padding: 10px 0;
		border: 0;
		text-align: center;
		background: transparent;
	}
	.note-table td + td 	{
		border-top: 1px solid rgba(255, 255, 255, 0.07);
	}
	.note-table td:first-child 	{
		display: flex;
		justify-content: center;
		align-items: center;
		gap: 8px;
		font-weight: bold;
		color: #fff;
		font-size: 14px;
	}
	.note-table td:nth-child(2) a 	{
		font-size: 20px;
		font-weight: 700;
		color: #ddf247;
		display: inline-block;
		word-break: break-word;
	}
	.note-table td:nth-child(3) 	{
		font-size: 14px;
		color: #bbb;
	}
	.note-table td .btn-delete 	{
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: 6px;
		font-size: 14px;
		font-weight: 600;
		padding: 7px 14px;
		border: 1px solid #ddf247;
		color: #ddf247;
		background: transparent;
		border-radius: 8px;
		transition: all 0.3s ease;
	}
	.note-table td .btn-delete:hover 	{
		background-color: #ddf247;
		color: #161616;
	}
	.note-table td .btn-delete i::before 	{
		font-size: 15px;
	}
}

/* 팝업 */

.status-label 	{
	display: inline-block;
	padding: 4px 10px;
	border-radius: 16px;
	font-weight: bold;
	font-size: 13px;
	margin-left: 6px;
	line-height: 1.2;
}


.status-label.pending 	{
	background-color: #ddf247;
	color: #000000;
}


.status-label.done 	{
	background-color: #8e8e8e;
	color: #000000;
}
.header-note 	{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0 10px;
}
.note-link 	{
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 20px;
	color: #fff;
	transition: color 0.3s ease;
}
.note-link:hover 	{
	color: #ddf247;
}
.note-alert-indicator 	{
	position: absolute;
	top: 2px;
	right: -2px;
	width: 8px;
	height: 8px;
	background-color: red;
	border-radius: 50%;
	display: none;
}
.note-link.active .note-alert-indicator 	{
	display: block;
}

/*팝업*/

.custom-popup-wrapper 	{
	position: fixed;
	top: 30%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 40px 40px;
	z-index: 9999;
	overflow: visible;
	pointer-events: auto;
	max-width: 95vw;
	padding-bottom: 60px;
	/* 하단 버튼 공간 확보 */
}
.custom-popup 	{
	position: relative;
	width: 370px;
	height: 550px;
	background-color: #fff;
	border-radius: 12px;
	box-shadow: 0 5px 30px rgba(0, 0, 0, 0.4);
	overflow: visible;
	z-index: 10000;
}
.custom-popup img 	{
	width: 100%;
	height: auto;
	display: block;
}
.popup-close 	{
	position: absolute;
	top: -14px;
	right: -14px;
	background-color: #ddf247;
	color: #000000;
	border: none;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	font-size: 30px;
	font-weight: bold;
	cursor: pointer;
	z-index: 10001;
	display: flex;
	align-items: center;
	justify-content: center;
	line-height: 1;
	overflow: hidden;
}
.popup-hide-today 	{
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
	margin-top: 8px;
	background-color: #DDF247;
	color: #161616;
	border: none;
	padding: 8px 20px;
	border-radius: 8px;
	cursor: pointer;
	font-weight: 600;
	white-space: nowrap;
	z-index: 10001;
	overflow: hidden;
	height: 30px;
	line-height: 1.2;
}

@media (max-width: 768px) 	{
	.custom-popup-wrapper 	{
		flex-direction: column;
		gap: 0;
		align-items: center;
		padding-bottom: 40px;
	}
	.custom-popup 	{
		position: absolute;
		top: -15vh;
		left: 50%;
		transform: translateX(-50%);
	}
	.custom-popup.active 	{
		display: block;
		z-index: 10000;
	}
	.popup-hide-today 	{
		position: relative !important;
		/* fixed or absolute 제거 */
		top: auto !important;
		left: auto !important;
		transform: none !important;
		margin: 10px auto 20px auto;
		/* 좌우 auto로 중앙정렬 */
		display: block;
		text-align: center;
	}
	.popup-close 	{
		top: -12px;
		right: -12px;
	}
}