@charset "utf-8";

/* ==========================================================================
  font-face
   ========================================================================== */

@import url('font.css');

/* ==========================================================================
   Base styles & Helper
   ========================================================================== */

@import url('lib/normalize.css');
@import url('icon/fontello.css?3521526326');
@import url('datepicker.css'); /*캘린더*/
		
@-ms-viewport {
	width: device-width;
}
@-o-viewport {
	width: device-width;
}
@viewport {
	width: device-width;
}

:root {
	--table-border-color: rgb(127 127 127 / 30%);
	--table-border-color2: #e3e3e3;
	--table-border-color3: rgb(0 0 0 / 30%);
}


/* base */
h1, h2, h3, h4, h5, h6, fieldset,ul, ol, dl, dt, dd, p, button, figure{margin:0;padding:0;}
html{}
body {font:normal 11px/1.5 'NotoSans', "나눔고딕", NanumGothic, NG, "돋움", Dotum, Arial, Tahoma , Geneva, Verdana;color:#333;}
h1, h2, h3, h4, h5, h6, strong, b, th, dt{font-weight:Normal;font-weight:bold;}
legend, caption{width:0;height:0;visibility:hidden;font-size:0;line-height:0;}
em, a , input, textarea, keygen, select, button, isindex{font-style:normal;text-decoration:none;color:#333;}
fieldset, button{background:none;border:0px;}
ul,ol{overflow:hidden;}
li{list-style:none;}
img{vertical-align:middle;max-width:100%;}
table{width:100%;}
iframe{width:100%;vertical-align:middle;}
input, button{box-sizing:inherit;}
hr{border-width:1px 0 0 0;border-style:solid;border-color:#ddd;}
td a, li a{cursor: pointer;}
select#xyz {border:0px;outline:0px;}

/* ==========================================================================
   common
   ========================================================================== */
.scrollLock{overflow:hidden;}
.block{display:block !important}
.inblock{display:inline-block !important}
.hide{display:none !important;}
.nowrap{white-space: nowrap;}
.pre{white-space: pre !important;}
.prewrap{white-space: pre-wrap !important;}
.clear-nowrap{white-space: initial;}
.breakall{word-break:break-all;}
.skip, .blind{position:absolute;overflow:hidden;visibility:hidden;width:0px;height:0px;font-size:0;line-height:0;text-indent:-9999px;}

.static{position:static;}
.relative{position:relative;}

.f_left{float:left;}
.f_right{float:right;}
.clear{clear:both;}

.cur_pointer {cursor: pointer;}

.p0{padding:0px !important;}
.p5{padding:5px !important;}
.p10{padding:10px !important;}
.p20{padding:20px !important;}

.pt0{padding-top:0px !important;}
.pt2{padding-top:2px !important;}
.pt5{padding-top:5px !important;}
.pt10{padding-top:10px !important;}
.pt15{padding-top:15px !important;}
.pt20{padding-top:20px !important;}
.pt25{padding-top:25px !important;}
.pt30{padding-top:30px !important;}
.pt35{padding-top:35px !important;}
.pt40{padding-top:40px !important;}
.pt45{padding-top:45px !important;}
.pt50{padding-top:50px !important;}
.pt60{padding-top:60px !important;}
.pt90{padding-top:90px !important;}
.pt105{padding-top:105px !important;}

.pb0{padding-bottom:0px !important;}
.pb5{padding-bottom:5px !important;}
.pb10{padding-bottom:10px !important;}
.pb15{padding-bottom:15px !important;}
.pb20{padding-bottom:20px !important;}
.pb30{padding-bottom:30px !important;}
.pb40{padding-bottom:40px !important;}
.pb50{padding-bottom:50px !important;}
.pb100{padding-bottom:100px !important;}

.pl0{padding-left:0px !important;}
.pl5{padding-left:5px !important;}
.pl10{padding-left:10px !important;}
.pl15{padding-left:15px !important;}
.pl30{padding-left:30px !important;}
.pl20{padding-left:20px !important;}
.pl50{padding-left:50px !important;}

.pr0{padding-right:0 !important;}
.pr5{padding-right:5px !important;}
.pr10{padding-right:10px;}
.pr15{padding-right:15px;}
.pr20{padding-right:20px;}
.pr30{padding-right:30px;}
.pr50{padding-right:50px;}

.m5{margin: 5px;}
.m10{margin: 10px;}
.m15{margin: 15px;}
.m20{margin: 20px;}

.mt0{margin-top:0px !important;}
.mt5{margin-top:5px;}
.mt10{margin-top:10px;}
.mt15{margin-top:15px;}
.mt20{margin-top:20px;}
.mt25{margin-top:25px;}
.mt30{margin-top:30px;}
.mt35{margin-top:35px;}
.mt40{margin-top:40px;}
.mt45{margin-top:45px;}
.mt50{margin-top:50px;}
.mt58{margin-top:58px;}
.mt60{margin-top:60px;}

.mb0{margin-bottom:0px !important;}
.mb5{margin-bottom:5px;}
.mb10{margin-bottom:10px;}
.mb15{margin-bottom:15px;}
.mb20{margin-bottom:20px;}
.mb25{margin-bottom:25px;}
.mb30{margin-bottom:30px;}
.mb35{margin-bottom:35px;}
.mb40{margin-bottom:40px;}
.mb45{margin-bottom:45px;}
.mb50{margin-bottom:50px;}

.ml0{margin-left:0px !important;}
.ml2{margin-left:2px !important;}
.ml3{margin-left:3px !important;}
.ml5{margin-left:5px;}
.ml6{margin-left:6px;}
.ml10{margin-left:10px;}
.ml15{margin-left:15px;}
.ml20{margin-left:20px !important;}
.ml25{margin-left:25px;}
.ml30{margin-left:30px !important;}
.ml40{margin-left:40px;}
.ml50{margin-left:50px !important;}
.ml100{margin-left:100px !important;}

.mr0{margin-right:0px !important;}
.mr2{margin-right:2px !important;}
.mr3{margin-right:3px !important;}
.mr5{margin-right:5px;}
.mr10{margin-right:10px;}
.mr15{margin-right:15px;}
.mr20{margin-right:20px;}
.mr25{margin-right:25px;}
.mr30{margin-right:30px;}
.mr40{margin-right:40px;}
.mr50{margin-right:50px;}

.mla { margin-left:auto !important;}
.mra { margin-right:auto !important;}
.mta { margin-top:auto !important;}
.mba { margin-bottom:auto !important;}

.hidden{overflow:hidden;}
.scroll{overflow-y:scroll;}
.no_bg{background:none !important;}
.ellipsis{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;-o-text-overflow:ellipsis;}
.op0{opacity: 0;}
.op80{-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";filter: alpha(opacity=80);-moz-opacity: 0.8;-khtml-opacity: 0.8;opacity: 0.8;}
.bgLayer{display:none; position:fixed; top:0; left:0; z-index:500; width:100%; height:100%; background:#333; opacity:0.6; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";filter: alpha(opacity=60);-moz-opacity: 0.6;-khtml-opacity: 0.6;}

.list{border: 1px solid #bababa;border-radius: 4px;min-height:100px}
.list>li{padding: 3px 10px; cursor: pointer;}
.list>li:hover{background-color: #eaeaea;}
.list>li.on{}
.list>li.on::before{font-family: "fontello"; content:'\e860'; padding-right: 10px;} /* ic-ok */

.b_line{border-bottom: 1px solid #bababa;}
.div_line{border-top: 1px solid #dedede;margin: 5px 0px;}

.blur img{-webkit-filter:blur(6px);-moz-filter:blur(6px);filter:blur(6px);}
.grayscale img{
	filter: url(filters.svg#gray); /* Gecko and FF*/
	filter: gray; /* IE */
	-moz-filter: grayscale(1);
	-ms-filter: grayscale(100%); 
	-o-filter: grayscale(100%);
	-webkit-filter: grayscale(1);}
a.grayscale:hover img, a.grayscale:focus img, a.grayscale:active img{
	filter: none;
	-moz-filter: none;
	-ms-filter: none; 
	-o-filter: none; 
	-webkit-filter: none;}

.normal{font-family: 'NotoSans';}
.bold{font-weight:bold;color:#000;}
.underline{text-decoration:underline;}
.t_eng{font-family:Arial, Tahoma , Geneva, Verdana;}
.t_num{font-family:Verdana;}

.f10{font-size:10px;}
.f11{font-size:11px;}
.f12{font-size:12px;}
.f13{font-size:13px;}
.f14{font-size:14px;}
.f15{font-size:15px;}
.f16{font-size:16px;}
.f18{font-size:18px;}
.f20{font-size:20px;}
.f22{font-size:22px;}
.f24{font-size:24px;}
.f25{font-size:25px;}
.f28{font-size:28px;}
.f30{font-size:30px;}

.lh_init{line-height:initial !important;}
.lh_1{line-height:1 !important;}
.lh35{line-height:35px;}
.lh32{line-height:32px;}
.lh25{line-height:25px;}
.lh20{line-height:20px;}

.b_gray{background:#f6f6f6;}
.b_blue{background-color: #d6ecf4;}
.b_org{background-color: #ff6740;}
.b_green{background-color: #a6f0e2;}
.b_yellow{background-color: #bab600;}

.thb_red{background: #fa2d2d61 !important;}
.thb_vio{background: #b709fc52 !important;}
.thb_green{background-color: #19e6c073 !important;}
.thb_yellow{background-color: #f9ee1e47  !important;}
.thb_blue{background-color: #175ced6b !important;}
.thb_lightblue{background-color: #dfe3ff !important;}
.thb_lightred{background-color: #f9e8e8 !important;}
.thb_dark{background-color: #373737 !important;}
.thb_cyan{background-color: #a0ffd8 !important;}


.tr_color tr:nth-child(even){background-color: #f5e4ba4f !important;}

.b_depth1{background: #f5e4ba4f}
.b_depth1:hover {background: #fed5714f !important;}

.t_white{color:#fff}
.t_blk{color:#000}
.t_gray{color:#999}
.t_dgray{color:#333}
.t_red{color:#ff3d3d}
.t_green{color:#147435}
.t_org{color:#ff6740;}
.t_blue{color:#4172c9;}
.t_yellow{color:#bab600;}
.t_violet{color: #7e26d1;}

.t_red_i{color:#ff3d3d !important}

.tl_red{color: #ff6f6f;}
.tl_green{color: #4eff8b;}
.tl_blue{color: #83caf3;}
.tl_yellow{color: #ffde9b;}
.tl_salmon{color: #ffb16f;}
.tl_violet{color: #c384ff;}
.tl_sky {color: #4eedff;}
.tl_lightblue {color: #40bcff;}


.t_center{text-align:center;}
.t_left{text-align:left;}
.t_right{text-align:right;}
.t_center_kit{text-align: -webkit-center !important;}

.cht_blue{background: #09c5fc;}
.cht_light_yellow {background: #feffd0ad;}
.cht_green{background-color: #19e6c0;}

.h25{height: 25px !important;}
.hv20{height: 20vh !important;}
.hv30{height: 30vh !important;}
.hv40{height: 40vh !important;}
.hv50{height: 50vh !important;}
.hv60{height: 60vh !important;}
.hv70{height: 70vh !important;}
.hv80{height: 80vh !important;}
.hv90{height: 90vh !important;}
.hv100{height: 100vh !important;}
.w30 { width:30px;}
.w35 { width:35px;}
.w40 { width:40px;}
.w50 { width:50px;}
.w60 { width:60px;}
.w65 { width:65px;}
.w70 { width:70px;}
.w75 { width:75px;}
.w80 { width:80px;}
.w85 { width:85px;}
.w90 { width:90px;}
.w100 { width:100px;}
.w110 { width:110px;}
.w115 { width:115px;}
.w120 { width:120px;}
.w125 { width:125px;}
.w130 { width:130px;}
.w135 { width:135px;}
.w140 { width:140px;}
.w150 { width:150px !important;}
.w160 { width:160px;}
.w170 { width:170px;}
.w200 { width:200px;}
.w213 { width:213px;}
.w250 { width:250px;}
.w260 { width:260px;}
.w270 { width:270px;}
.w280 { width:280px;}
.w300 { width:300px;}
.w350 { width:350px;}
.w500 { width:500px;}
.w600 { width:600px;}
.w800 { width:800px;}
.w1000 { width:1000px;}
.w1200 { width:1200px;}
.w1400 { width:1400px;}
.w1500 { width:1500px;}
.w1600 { width:1600px;}
.w1700 { width:1700px;}
.w_10 { width:10%;}
.w_20 { width:20%;}
.w_25 { width:25%;}
.w_28 { width:28%;}
.w_30 { width:30%;}
.w_33 { width:33%;}
.w_40 { width:40% !important;}
.w_50 { width:50%;}
.w_60 { width:60%;}
.w_70 { width:70%;}
.w_80 { width:80%;}
.w_87 { width:87%;}
.w_90 { width:90%;}
.w_100 { width:100%;}
.mw400{max-width: 400px;}
.mw500{max-width: 500px;}
.mw600{max-width: 600px;}
.mw800{max-width: 800px;}
.mw1000{max-width: 1000px;}
.mw1200{max-width: 1200px;}
.minw30{min-width: 30px;}
.minw50{min-width: 50px;}
.minw60{min-width: 60px;}
.minw70{min-width: 70px;}
.minw110{min-width: 110px;}
.minw115{min-width: 115px;}
.minw120{min-width: 120px;}
.minw130{min-width: 130px;}
.minw140{min-width: 140px;}
.minw150{min-width: 150px;}
.minw200{min-width: 200px;}
.minw210{min-width: 210px;}
.minw220{min-width: 220px;}
.minw250{min-width: 250px;}
.minw500{min-width: 500px;}
.minw1100{min-width: 1100px;}
.wp_50{width: 50%;}


/* flex */
.flex { display:flex;}
.flow_col { flex-flow: column;}
.flex > * + * { margin-left:10px;}
.flex.flex_shallow > * + * { margin-left:3px;}
.flex.flow_col > * + * { margin-left:initial;}
.top_flex{ display:flex; padding-block-end: 10px;}
.inline_flex { display:inline-flex;vertical-align: middle;}
.flex00 { flex:0 0 auto !important;}
.flex11 { flex:1 1 auto !important;}
.flex01 { flex:0 1 auto !important;}
.flex10 { flex:1 0 auto !important;}
.flex_init { flex: initial !important;width: auto !important;padding-right: 0px !important;}
.align_center { align-items: center;}
.align_start { align-items:flex-start;}
.align_end { align-items:flex-end;}
.justify_center { justify-content: center;}
.justify_start { justify-content: flex-start;}
.justify_end { justify-content: flex-end;}
.justify_space { justify-content: space-between;}
.justify_around { justify-content: space-around;}

.fxgrow_1 {flex-grow: 1;}
.fxgrow_2 {flex-grow: 2;}


/* grid */
.grid { display:grid;}
.gap05 { gap:5px;}
.template_columns_4fr {grid-template-columns: 1fr 1fr 1fr 1fr;}
.sp-replacer {margin: 0;}

/* toTop */
#toTop {
	display: none;
	position: fixed;
	right: 10px;
	bottom: 10px;
	width: 40px;
	height: 40px;
	font-size: 0;
	text-indent: -1000px;
	text-align: center;
	color: #fff;
	background: url(../images/common/toTop.png) center center no-repeat #777;
	opacity: 0.8;
	border-radius: 20px;
	z-index: 10;
}
#toTop:hover,
#toTop:focus,
#toTop.hover {
	opacity: 1;
}

/* ==========================================================================
   form
   ========================================================================== */
label{display:inline-block;}
label input{margin-right:1px;}
label .lbl{display:inline-block;margin-right:15px;line-height:16px;vertical-align:middle;}
input[type=checkbox], input[type=radio]{vertical-align:middle;}
input[type=checkbox].checkbox, 
input[type=radio].radio{font-size:16px;width:16px;height:16px;}
input[type=checkbox].checkbox:hover:not(:disabled)+.lbl, input[type=radio].radio:hover:not(:disabled)+.lbl,
input[type=checkbox].checkbox:focus:not(:disabled)+.lbl, input[type=radio].radio:focus:not(:disabled)+.lbl,
input[type=checkbox].checkbox:active:not(:disabled)+.lbl, input[type=radio].radio:active:not(:disabled)+.lbl,
input[type=checkbox].checkbox:checked+.lbl, input[type=radio].radio:checked+.lbl{font-weight:bold;}
input[type=checkbox].checkbox:checked:not(:disabled)+.lbl, input[type=radio].radio:checked:not(:disabled)+.lbl{color:#4172c9;}
label.long{position:relative;padding-left:23px;}
label.long input{position:absolute;left:0;top:1px;}

@supports (-webkit-appearance: none) or (-moz-appearance: none) {

	input[type=checkbox],
	input[type=radio] {
		--active: #0075ff;
		--active-inner: #fff;
		--focus: 3px rgb(0 173 255 / 30%);
		--border: #777;
		--border-hover: #0075ff;
		--background: #fff;
		--disabled: #f8f8f8;
		--disabled-inner: #d1d1d1;
		-webkit-appearance: none;
		-moz-appearance: none;
		font-size: var(--font-size, 16px);
		width: 1em;
		height: 1em;
		outline: none;
		display: inline-block;
		vertical-align: top;
		position: relative;
		/* margin: 0; */
		cursor: pointer;
		border: 1px solid var(--bc, var(--border));
		background: var(--b, var(--background));
		transition: background 0.3s, border-color 0.3s, box-shadow 0.2s;
	}

	input[type=checkbox]:after,
	input[type=radio]:after {
		content: "";
		display: block;
		left: 0;
		top: 0;
		position: absolute;
		transition: transform var(--d-t, 0.3s) var(--d-t-e, ease), opacity var(--d-o, 0.2s);
	}

	input[type=checkbox]:checked,
	input[type=radio]:checked {
		--b: var(--active);
		--bc: var(--active);
		--d-o: .3s;
		--d-t: .6s;
		--d-t-e: cubic-bezier(.2, .85, .32, 1.2);
		--o: 1;
	}

	input[type=checkbox]:disabled,
	input[type=radio]:disabled {
		--b: var(--disabled);
		--bc: var(--disabled-inner);
		opacity: 0.9;
	}

	input[type=checkbox]:disabled:checked,
	input[type=radio]:disabled:checked {
		--b: var(--disabled-inner);
		--bc: var(--disabled-inner);
	}

	input[type=checkbox]:hover:not(:checked):not(:disabled),
	input[type=radio]:hover:not(:checked):not(:disabled) {
		--bc: var(--border-hover);
	}

	input[type=checkbox]:focus,
	input[type=radio]:focus {
		box-shadow: 0 0 0 var(--focus);
	}

	input[type=checkbox]+.lbl,
	input[type=radio]+.lbl {
		font-size: 12px;
		line-height: 16px;
		display: inline-block;
		vertical-align: top;
		cursor: pointer;
		margin-left: 4px;
	}
	
	input[type=checkbox]:disabled+.lbl,
	input[type=radio]:disabled+.lbl {
		cursor: default;
	}

	input[type=checkbox] {
		border-radius: 3px;
	}

	input[type=checkbox]:after {
		width: 0.3em;
		height: 0.6em;
		border: 0.15em solid var(--active-inner);
		border-top: 0;
		border-left: 0;
		left: 0.225em;
		top: 0.01em;
		transform: scale(var(--s, 1.5)) rotate(var(--r, 60deg));
		opacity: var(--o, 0);
	}

	input[type=checkbox]:checked {
		--r: 40deg;
		--s: 1;
	}

	input[type=radio] {
		border-radius: 50%;
		background: var(--background);
	}

	input[type=radio]:after {
		width: 100%;
		height: 100%;
		border-radius: 50%;
		background: var(--b);
		opacity: var(--o, 0);
		transform: scale(var(--s, 1.5));
	}

	input[type=radio]:checked {
		--s: .7;
		border-width: 2px;
	}
}

input[type=checkbox].checkbox.large,
input[type=radio].radio.large{font-size:20px;width:20px;height:20px;}
input[type=checkbox].checkbox.large + .lbl, 
input[type=radio].radio.large + .lbl{font-size:16px;line-height:20px;}

input::placeholder {
	color: black;
	opacity: 0.4;
}

.input, 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"]{display:inline-block;height:30px;padding:3px 6px;line-height:22px;border:1px solid #b4b4b4;background:#fff;-webkit-transition-duration:.1s;-moz-transition-duration:.1s;-o-transition-duration:.1s;transition-duration:.1s;vertical-align:middle;border-radius:3px;/*color:#666;*/box-sizing:border-box;}
textarea{width:536px;height:100px;resize:none;line-height:1.5;border-radius:3px;}
textarea.vertical{resize: vertical; height: 250px;}
textarea.full { width:100%; box-sizing:border-box;}
select{display:inline-block;height:30px;line-height:28px;padding:0px 6px;border:1px solid #ccc;background:#fff;vertical-align:middle;border-radius:3px;}
select:hover, textarea:hover, input[type="text"]:hover, input[type="password"]:hover, input[type="datetime"]:hover, input[type="datetime-local"]:hover, input[type="date"]:hover, input[type="month"]:hover, input[type="time"]:hover, input[type="week"]:hover, input[type="number"]:hover, input[type="email"]:hover, input[type="url"]:hover, input[type="search"]:hover, input[type="tel"]:hover, input[type="color"]:hover {border-color:#777}
select: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-color:#777}
input:focus-visible, input:focus {
	outline: 4px solid rgb(0 0 0 / 10%);
	transition: none;
}
input.comboTreeInputBox:focus-visible, input.comboTreeInputBox:focus {
	box-shadow: 0 0 0 4px rgb(0 0 0 / 10%);
}
input[type="checkbox"]:focus-visible, input[type="checkbox"]:focus,
input[type="radio"]:focus-visible, input[type="radio"]:focus {
	box-shadow: 0 0 0 3px rgb(0 173 255 / 30%);
	outline: 0;
}
select.disabled, textarea.disabled, input[type="text"].disabled, input[type="password"].disabled, input[type="datetime"].disabled, input[type="datetime-local"].disabled, input[type="date"].disabled, input[type="month"].disabled, input[type="time"].disabled, input[type="week"].disabled, input[type="number"].disabled, input[type="email"].disabled, input[type="url"].disabled, input[type="search"].disabled, input[type="tel"].disabled, input[type="color"].disabled,
select:disabled, textarea:disabled, input[type="text"]:disabled, input[type="password"]:disabled, input[type="datetime"]:disabled, input[type="datetime-local"]:disabled, input[type="date"]:disabled, input[type="month"]:disabled, input[type="time"]:disabled, input[type="week"]:disabled, input[type="number"]:disabled, input[type="email"]:disabled, input[type="url"]:disabled, input[type="search"]:disabled, input[type="tel"]:disabled, input[type="color"]:disabled {background:#f3f3f3;opacity: 1;}
input[type="text"], input[type="password"],input[type="search"],input[type="number"],select, option{color:#308163;-webkit-text-fill-color: #308163;}
::placeholder {
	color: black;
	-webkit-text-fill-color: black;
}
::-webkit-input-placeholder {
	color: black;
	-webkit-text-fill-color: black;
}
textarea::placeholder {
	color: rgb(0 0 0 / 40%);
	-webkit-text-fill-color: rgb(0 0 0 / 40%);
}
textarea::-webkit-input-placeholder {
	color: rgb(0 0 0 / 40%);
	-webkit-text-fill-color: rgb(0 0 0 / 40%);
}


select:focus-visible, select:focus {
	outline: 4px solid rgb(0 0 0 / 10%);
}
option:disabled {
	color: rgb(127 127 127 / 55%);
}

textarea:focus-visible, textarea:focus {
	outline: 4px solid rgb(0 0 0 / 10%);
	transition: none;
}

/*파일첨부*/
.input_file{display:inline-block}
.input_file > input{width:380px;vertical-align: middle;margin-right:5px}
.input_file .btn_file{display:inline-block;position:relative;}
.input_file .btn_file .button span{width:50px;}
.input_file .btn_file input{position:absolute;right:0;top:0;width:100%;height:100%;padding:0;margin:0;z-index:2;font-size:1em;cursor:pointer;opacity:0;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter:alpha(opacity=0);-moz-opacity:0;-khtml-opacity:0;}

/*spinner*/
.ui-spinner{position:relative;display:inline-block;padding:0 49px 0 0;height:24px !important;border:0 none;}
.ui-spinner .spinner{width:32px;height:22px;line-height:22px;padding:0px 3px;text-align:center;color:#333;font-weight:bold;vertical-align:top;}
.ui-spinner-button{position:absolute;top:0px;}
.ui-spinner-button .icon{display:block;width:24px;height:24px;text-indent:-999em;}
.ui-spinner-up{right:25px;background:#a21911 url(../images/common/btn_plus.png) no-repeat center;}
.ui-spinner-down{right:0px;background:#999999 url(../images/common/btn_minus.png) no-repeat center;}
.lbl.spn_lbl {font-weight:bold;color:#000;padding:0 9px}
.ui-state-hover{}
.ui-state-active{}

.spinner_wrap{}
.spinner_wrap .lbl.spn_lbl {font-weight:bold;color:#000;padding:0 8px;line-height:24px}
.spinner_wrap .spinner{width:32px;height:22px;line-height:22px;padding:0px 3px;text-align:center;color:#333;font-weight:bold;vertical-align:top;}
.spinner_wrap .btn_plus{display:inline-block;width:24px;height:24px;line-height:24px;text-indent:-999em;background:#a21911 url(../images/common/btn_plus.png) no-repeat center;margin-right:1px}
.spinner_wrap .btn_minus{display:inline-block;width:24px;height:24px;line-height:24px;text-indent:-999em;background:#999999 url(../images/common/btn_minus.png) no-repeat center;}


/* datepicker */
.hasDatepicker{width:135px;text-align:center;}
.hasDatepicker.tempus-date-only {width: 110px;}
.hasDatepicker.tempus-time-only {width: 50px;}
.ui-datepicker-trigger{display:inline-block;width: 1.5em;height: 1.5em;line-height: 1.5em;font-size: 1.6em;/* background:url(../images/common/btn_datepicker.gif) no-repeat center center; */text-indent: .1em;vertical-align:middle;color: #888;}


/* ==========================================================================
   Layout
   ========================================================================== */

html, body{height:100%;background-color: #eaeaea;min-width: min-content;}
#wrap{ /* overflow-y:auto;  */width:100%; /* min-width:1400px; */ min-height:100%;margin-bottom:-36px;}
#header{position:fixed;left:0;top:0;width:100%; /* min-width:1400px; */border-bottom:2px solid #333;background:#3e3f40;z-index:13;}
	#logo{float:left;width:199px; background:#3e3f40; transition: all .3s;}
		#logo a{display: flex;height: 70px;flex-flow: column;color:#fff;justify-content: center;align-items: center;}
		#logo a img{max-width:100%;max-height:100%}
		#logo a span {line-height: 1.25;}
	.btn_gnb{display:none;position:fixed;left:5px;top:4px;width:40px;height:34px;padding-top:6px;font-size:0;text-align:center;z-index:20;}
		/* .btn_gnb:hover, .btn_gnb:focus, .btn_gnb.hover {opacity:1;} */
		.btn_gnb i{display:block;width:30px;margin:5px auto 0;height:3px;background:#333;}
		#header>div {
			display: flex;
			border-left: 1px solid #333;
			padding: 2px 15px 0px 13px;
			align-items: center;
			overflow: auto;
			white-space: nowrap;
			height: 70px;
		}
		.gnb_menu { display:flex; height:49px;}
		.gnb_menu a { display:flex; align-items: center; padding:0 25px; border-right:1px solid #333; font-size:14px; color:#fff; font-weight:bold;}
		.gnb_menu a.active,
		.gnb_menu a:hover { background:#000;}
		.head_info{ margin-left:auto; padding:10px 0 10px 10px; align-items: center;display: flex;}
		.head_info>.user{color: #fff; margin-right: 30px;}
		.head_info>.user>span{margin-right: 3px;}
		.head_info>.user>a{margin-right: 10px;font-size: 11px;}
		.head_info>.user>a>strong{margin-left: 3px;}
		.head_info .link{cursor: pointer;color:#fff;}
		.head_info a{ color:#fff;}
		.head_info .button{margin-left:6px;padding:0 10px;height:22px;line-height:22px;}
		.head_info .audio:before{font-family: "fontello";content: '\e85e';font-size: 19px;}
		.head_info .audio.mute:before{content: '\e85f';}
.left_menu{position:fixed;left:0;top: 73px;width:200px;height:100%;background:#3e3f40;transition: all 0.3s;z-index:12;overflow-y: auto;}
/* .left_menu::-webkit-scrollbar{display: none;} */
.left_menu>.menuBox>.info{color: #fff;font-size: 12px;border-top: 1px solid #4b4c4d;border-bottom: 1px solid #2e2f31;padding: 5px 10px;background: #373737;}
.left_menu>.menuBox>.info>div{padding-bottom: 2px;}
.left_menu>.menuBox>.info>div>strong{float: right;}

.dropdown-profile {
	position: absolute;
	right: 0;
	top: 70px;
	background: #373737;
	box-shadow: 0 6px 12px black;
	display: flex;
	flex-flow: column;
	padding: 5px 0;
}

.dropdown-profile > a {
	padding: 7px 18px;
}
.dropdown-profile > a:hover {
	background: rgb(255 255 255 / 15%);
	color: white;
}

.anim-slide-right {
	transform: translateX(200%);
}

.menu-closed #logo {
	margin-left: -200px;
	/* transition: all .3s; */
}
.menu-closed .left_menu {
	transform: translateX(-200px);
	/* transition: all .3s; */
}
.menu-closed #contents {
	margin-left: 10px;
	/* transition: all .3s; */
}
.menu-closed #page_addr {
	padding-left: 10px;
	/* transition: all .3s; */
}
/* 
.menu-closed .hamburger-temp {
	display: flex;
} */

.menu-temp #header .hamburger,
.menu-temp #logo {
	transform: translateX(200px);
	background-color: #eaeaea;
}
.menu-temp #header .hamburger {
	border: 1px solid #333;
}
.menu-temp #header .hamburger > .hamburger-inner {
	background-color: #333;
}
.menu-temp .left_menu {
	transform: translateX(0);
}
.menu-temp #contents {
	transform: 200px;
}
.menu-temp #page_addr {
	transform: 200px;
}

/* body::-webkit-scrollbar{display: none;} */

::-webkit-scrollbar {
	width: 2px;
	height: 2px;
	background-color: black;
}

body::-webkit-scrollbar {
	width: 5px;
	height: 10px;
}
#header ::-webkit-scrollbar {
	height: 10px;
}

::-webkit-scrollbar-thumb {
	background-color: #888;
	border-radius: 20px;
}

::-webkit-scrollbar-track {
	background-color: rgb(0 0 0 / 70%);
}

::-webkit-scrollbar-corner {
	background-color: rgb(0 0 0 / 70%);
}

textarea::-webkit-scrollbar {
	width: 15px;
}
textarea::-webkit-scrollbar-track {
	background-color: #f3f3f3;
}
textarea::-webkit-scrollbar-thumb {
	border-radius: 0;
	cursor: pointer;
}

.gnb{margin-bottom: 10px;}
.gnb a:focus-visible{outline: none;}
.gnb > ul{}
.gnb > ul > li{border-top:1px solid #4b4c4d;border-bottom:1px solid #2e2f31;}
.gnb > ul > li .tit {display:block;padding:10px;color:#fff;font-size:13px;font-weight:bold;}
/* .gnb > ul > li .tit.home {display:inline-block;} */
.gnb > ul > li a.tit {cursor: pointer;}
.gnb > ul > li.active > .tit {padding-left:26px;border-left:4px solid #4172c9;background:#2e2f31;}
.gnb > ul > li > div{border-top:1px solid #2e2f31;}
.gnb > ul > li > div > p{color: #fff; padding: 7px 10px;border-top: 1px solid #444749;cursor: pointer;}
.gnb > ul > li > div > p::before{font-family: "fontello";content: '\f105';float: right;margin: 0 5px;}
.gnb > ul > li > div.active > p::before{content: '\f107';}
.gnb > ul > li > div > p > i {
	margin-right: 8px;
	width: 15px;
	text-align: center;
	display: inline-flex;
	justify-content: center;
}
.gnb > ul > li > div > ul{/* padding-left:20px; */padding: 5px 0 10px;background-color: #373737;display: none;}
.gnb > ul > li > div.active > ul{display: block;}
.gnb > ul > li > div > ul > li{margin-left: 3px;/* padding-left: 15px; */position: relative;border-left: 3px solid transparent;}
.gnb > ul > li > div > ul > li > a{display:block;color:#fff;padding: 6px 0 6px 25px;/* background:url(../images/common/bg_gnb2dep.gif) no-repeat left 9px; */font-weight: 200;}
.gnb > ul > li > div > ul > li > a:focus,
.gnb > ul > li > div > ul > li:active > a,
.gnb > ul > li > div > ul > li:hover > a,
.gnb > ul > li > div > ul > li.active > a{color: #3db8f5; /*hsl(200deg 90% 60%);*/}
.gnb > ul > li > div > ul > li:active > a,
.gnb > ul > li > div > ul > li.active > a{font-weight: bold;}
.gnb > ul > li > div.sub-active {
	background: #2196f3;
}
.gnb > ul > li > div.sub-active > ul {
	box-shadow: inset 3px 0 0px #2196f3;
}
.gnb > ul > li > div > ul > li:hover, .gnb > ul > li > div > ul > li.active {
	background-color: rgb(0 0 0 / 10%);
}
.gnb > ul > li > div > ul > li.active:before {
	content: ' ';
	/* width: .5em; */
	font-size: 1em;
	/* height: 1em; */
	border-left: 1em solid #2196f3;
	border-top: 1em solid transparent;
	border-bottom: 1em solid transparent;
	display: block;
	position: absolute;
	margin-left: -8px;
	transform: translate(0, -50%);
	top: 50%;
}

.gnb .sub-menu{border-top:1px solid #2e2f31;margin-left: 3px;}
.gnb .sub-menu > p{color: #fff;border-top: 1px solid #444749;cursor: pointer;padding-top: 7px;padding-bottom: 7px;padding-right: 10px;padding-left: 20px;}
.gnb .sub-menu > p::before{font-family: "fontello";content: '\f105';float: right;margin: 0 5px;}
.gnb .sub-menu.active > p::before{content: '\f107';}
.gnb .sub-menu > p > i {
	margin-right: 8px;
	width: 15px;
	text-align: center;
	display: inline-flex;
	justify-content: center;
}
.gnb .sub-menu > ul{/* padding-left:20px; */padding: 5px 0 10px;background-color: #373737;display: none;}
.gnb .sub-menu.active > ul{display: block;}
.gnb .sub-menu > ul > li{margin-left: 3px;/* padding-left: 15px; */position: relative;border-left: 3px solid transparent;}
.gnb .sub-menu > ul > li > a{display:block;color:#fff;padding: 6px 0 6px 25px;/* background:url(../images/common/bg_gnb2dep.gif) no-repeat left 9px; */font-weight: 200;}
.gnb .sub-menu > ul > li > a:focus,
.gnb .sub-menu > ul > li:active > a,
.gnb .sub-menu > ul > li:hover > a,
.gnb .sub-menu > ul > li.active > a{color: #3db8f5; /*hsl(200deg 90% 60%);*/}
.gnb .sub-menu > ul > li:active > a,
.gnb .sub-menu > ul > li.active > a{font-weight: bold;}
.gnb .sub-menu.sub-active {
	background: #2196f3;
}
.gnb .sub-menu.sub-active > ul {
	box-shadow: inset 3px 0 0px #2196f3;
}
.gnb .sub-menu > ul > li:hover, .gnb .sub-menu > ul > li.active {
	background-color: rgb(0 0 0 / 10%);
}
.gnb .sub-menu > ul > li.active:before {
	content: ' ';
	/* width: .5em; */
	font-size: 1em;
	/* height: 1em; */
	border-left: 1em solid #2196f3;
	border-top: 1em solid transparent;
	border-bottom: 1em solid transparent;
	display: block;
	position: absolute;
	margin-left: -8px;
	transform: translate(0, -50%);
	top: 50%;
}

.progress {
	background: rgb(255 255 255 / 11%);
	font-size: .75em;
	padding: .3em 0 !important;
	text-align: center;
	position: relative;
	overflow: hidden;
	box-shadow: inset 0 0 1px 0px;
	border-radius: 3px;
}
.progress>label {
	position: relative;
	z-index: 1;
}

.progress:before {
	content: " ";
	background: #2196f3;
	width: var(--width-prog);
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
	background-image: linear-gradient(90deg, transparent 0%, rgb(255 255 255 / 30%) 20%, rgb(255 255 255 / 30%) 30%, transparent 50%, transparent 100%);
	animation: 3s flow 0s infinite cubic-bezier(0, 0.25, 0, 1);
	background-repeat: no-repeat;
	transition: all 2s;
}

@keyframes flow {
	from {
		background-position-x: min(-100%, -50px);
		background-size: max(75%, 50px);
	}
	to {
		background-position-x: max(200%, 80px);
		background-size: max(25%, 20px);
	}
}

#container {
	min-width: fit-content;
	padding-bottom: 5px;
}
#container.leftNone { padding:70px 20px 110px; margin:0 auto;}
#contents {
	position: relative;
	/* display: inline-block; */
	background-color: white;
	margin: 80px 10px 55px 210px;
	border-radius: 7px;
	transition: all .01s;
}
#contents>h4{display: flex;padding: 10px 20px;border-bottom: 1px solid #ddd;align-items: center;}
#page_addr {
	position: relative;
	top: 73px;
	padding: 10px 210px;
	border-bottom: 1px solid #c2bfbf;
	background-color: white;
	transition: all .3s;
}
#page_tit{display:none;padding-bottom:10px;margin-bottom:30px;border-bottom:1px solid #333;color:#000;font-size:18px;line-height:1;}

#footer{padding:9px 0 9px 220px;border-top:1px solid #333;}

/* ==========================================================================
   component
   ========================================================================== */

/* 제목요소 */
.cont_tit{color:#000000;font-weight:bold;line-height:1;}
.cont_tit span{font-size:12px;font-family: 'NotoSans';}

/* 버튼 */

.button_area{position:relative;margin-top:30px;text-align:center}
.button{display:inline-block;padding:3px 10px;background:#f4f4f4;border:1px solid #b7b7b7;border-radius:3px;text-align:center;vertical-align:middle;font-weight:bold;line-height:22px;font-size:12px;box-sizing:border-box;cursor:pointer;}
.button:hover,.button:focus,.button:active{text-decoration:none !important}
.button:active{transform:scale(0.95)}
.button.disabled,
.button:disabled{ opacity:0.4;pointer-events:none;}

.button-group {display: inline-flex;vertical-align: middle;}
.button-group.flex {display: flex}
.button-group>.button {border-width: 0px;border-radius: 0;}
.button-group>.button:not(:first-of-type,:last-of-type) {border-radius: 0;}
.button-group>.button:not(:first-of-type) {border-left-color: inherit;}
.button-group>.button:first-of-type {border-top-left-radius: 4px;border-bottom-left-radius: 4px;}
.button-group>.button:last-of-type {border-top-right-radius: 4px;border-bottom-right-radius: 4px;}
.button-group-multiline {display: inline-grid;grid-template-columns: repeat(auto-fit, minmax(50px, 1fr));}

.button-group.disabled,
.button-group:disabled,
.button-group-multiline.disabled,
.button-group-multiline:disabled {opacity:0.5;pointer-events:none;}

.button-group-design {flex-wrap: wrap;}
.button-group-design>.button {min-width: 4em;padding-left: 5px;padding-right: 5px;}

.button.btn_gold{background:#f3ba21;border-color:#f3ba21;color:#fff;}
.button.btn_blue{background:#2196F3;border-color:#2196F3;color:#fff;}
.button.btn_light_blue{background: #2196F3; border-color: #bafbf8; color: #fff;}
.button.btn_gray{background:#aaaaaa;border-color:#aaaaaa;color:#fff;}
.button.btn_red{background:#ce3a3a;border-color:#ce3a3a;color:#fff;}
.button.btn_pink{background:#ac3ace;border-color:#ac3ace;color:#fff;}

.button.btn_green{background: #47ce3a;border-color: #50c13d;color:#fff;}
.button.btn_violet{background:#7e26d1;border-color:#7e26d1;color:#fff;}
.button.btn_white{background:#fff;}

.button.small{padding:0px 5px;font-size:11px;font-weight: normal;}
.button.large{padding:6px 15px;font-size:14px;}
.button.larger{padding:0px 5px;font-size:15px;font-weight: normal;}

.button.w22{width:22px;padding-left:0;padding-right:0;}
.button.w23{width:23px;padding-left:0;padding-right:0;margin-right:5px;}
.button.w35{width:35px;padding-left:0;padding-right:0;}
.button.w50{width:48px;padding-left:0;padding-right:0;}
.button.w60{width:58px;padding-left:0;padding-right:0;}
.button.w70{width:68px;padding-left:0;padding-right:0;}
.button.w80{width:78px;padding-left:0;padding-right:0;}
.button.w100{width:98px;padding-left:0;padding-right:0;}
.button.w120{width:118px;padding-left:0;padding-right:0;}
.button.w140{width:139px;padding-left:0;padding-right:0;}

.btn_sort{display:inline-block;border:1px solid #b4b4b4;border-radius:3px;vertical-align:middle;}
.btn_sort a{display:inline-block;padding:4px 8px;border-left:1px solid #b4b4b4;margin-left:-3px;text-align:center;line-height:20px;cursor:pointer;}
.btn_sort a:first-child{border-left:0 none;margin-left:0;}
.btn_sort a:hover,
.btn_sort a:focus,
.btn_sort a:active,
.btn_sort a.on{color:#333;font-weight:bold;text-decoration:underline;}

.badge {display:inline-block;padding:3px 10px;background:#f4f4f4;border:1px solid #b7b7b7;border-radius:3px;text-align:center;vertical-align:middle;font-weight:bold;line-height:22px;font-size:12px;box-sizing:border-box;}
.badge.small{padding:0px 5px;font-size:11px;font-weight: normal;}
.badge.large{padding:6px 15px;font-size:14px;}

.btn_gold, .button.btn_gold, .badge.btn_gold{background:#f3ba21;border-color:#f3ba21;color:#fff;}
.btn_blue, .button.btn_blue, .badge.btn_blue{background:#2196F3;border-color:#2196F3;color:#fff;}
.btn_gray, .button.btn_gray, .badge.btn_gray{background:#aaaaaa;border-color:#aaaaaa;color:#fff;}
.btn_red, .button.btn_red, .badge.btn_red{background:#ce3a3a;border-color:#ce3a3a;color:#fff;}

.button.btn_green, .badge.btn_green{background: #47ce3a;border-color: #50c13d;color:#fff;}
.button.btn_violet, .badge.btn_violet{background:#7e26d1;border-color:#7e26d1;color:#fff;}
.button.btn_white, .badge.btn_white{background:#fff;}

/* 탭메뉴 */
.tabmenu{display: flex;margin: 0px 20px;border-bottom: 1px solid #c8c8c8;padding-top: 10px;}
.tabmenu:not(.tabMotion) {flex-wrap: wrap;}
.tabmenu > li{white-space: nowrap;}
.tabmenu > li:first-child{margin-left:0;}
.tabmenu > li{border:1px solid #d5d5d5;border-width: 1px 1px 0 0;text-align:center;font-size:12px;font-weight:bold;color:#999;background:#eee;}
.tabmenu > li:first-child{border-left-width:1px;}
.tabmenu > li:hover, .tabmenu > li:focus, .tabmenu > li:active, .tabmenu > li.on{background:#fff;color:#000;}
.tabmenu > li > a {
	padding: 7px 20px;
	display: inline-block;
}
.tabmenu > li > .btn-eye {
	display: inline-block;
	padding: 6px 10px;
	margin-left: -10px;
	vertical-align: top;
	color: #000;
	opacity: .25;
	cursor: pointer;
}
.tabmenu>li>.btn-eye.on {
	opacity: .75;
}
.tabmenu > li > .btn-eye:hover {
	opacity: 1;
}
.tabmenu > li > .btn-eye > .ic-eye,
.tabmenu > li > .btn-eye.on > .ic-eye-off {
	display: none;
}
.tabmenu > li > .btn-eye > .ic-eye-off,
.tabmenu > li > .btn-eye.on > .ic-eye {
	display: block;
}
.tabmenu.tabmenu-md > li > a {padding: 7px 14px;}

.tab_cont{display:none}
.tab_cont.on{display: block;}
.sub.tabmenu{margin: 0px 10px;}
.detail{font-size: 10px;padding-top: 2px;}
.t_explain{font-size: 10px;background-color: #f8eaea;padding: 10px 15px;color: #f10e0e;border-radius: 5px;}
.t_explain_ans{font-size: 13px;background-color: #f8eaea;padding: 10px 15px;color: #3e3f40;border-radius: 5px;display: block;}

/* table */
.table{border:1px solid var(--table-border-color2);border-top:2px solid #646464;white-space: nowrap;}
.table tr.pointer{cursor:pointer;}
.table th,.table td{padding:7px;text-align:center;}
.table.tbl_long th,.table.tbl_long td{padding-left:0;padding-right:0;}
.table thead th{line-height: 2;background: rgb(225 225 225 / 25%);color:#333;border: none;border-right: 1px solid var(--table-border-color);border-bottom: 1px solid var(--table-border-color);position: relative;}
.table thead th:first-child{border-left:none;}
.table thead th.line { border-left:1px solid #e3e3e3; border-top:1px solid #e3e3e3;}
.table thead th a{color:#333;}	
.table thead tr.tb_sum th {background-color: rgb(205 227 250 / 25%);}
.table thead th > .cell-sum, .table tfoot th > .cell-sum {line-height: 1.5;}
.table tbody th, .table tbody td{border-right: 1px solid var(--table-border-color);border-bottom: 1px solid var(--table-border-color);}
.table tbody tr td.line{border-left:1px solid #e3e3e3;}
.table tbody tr:first-child th, .table tbody tr:first-child td{border-top:1px solid var(--table-border-color2);}
.table tbody tr th.line{border-left:1px solid var(--table-border-color2);}
.table tbody th:first-child, .table tbody td:first-child{border-left:0 none;}
.table tfoot { display:table-row-group;}
.table tfoot th, .table tfoot td{border-left:1px solid var(--table-border-color);border-top:1px solid var(--table-border-color);background:#f4f8fc;}
.table tfoot th:first-child, .table tfoot td:first-child{border-left:0 none;}
.table .t_center{text-align:center;}
.table .t_left{text-align:left;}
.table .t_right{text-align:right;}

.va_top {vertical-align: top;}
.va_middle {vertical-align: middle;}
.va_bottom {vertical-align: bottom;}

/* sports-table */
.sports-table{border:1px solid var(--table-border-color2);border-top:2px solid #646464;}
.sports-table tr.pointer{cursor:pointer;}
.sports-table th,.sports-table td{padding:1px 0px;text-align:center;}
.sports-table thead th{line-height: 2;background: rgb(225 225 225 / 25%);color:#333;border: none;border-right: 1px solid var(--table-border-color);border-bottom: 1px solid var(--table-border-color);position: relative;}
.sports-table thead th:first-child{border-left:none;}
.sports-table thead th.line { border-left:1px solid #e3e3e3; border-top:1px solid #e3e3e3;}
.sports-table thead th a{color:#333;}	
.sports-table thead tr.tb_sum th {background-color: rgb(205 227 250 / 25%);}
.sports-table thead th > .cell-sum, .sports-table tfoot th > .cell-sum {line-height: 1.5;}
.sports-table tbody th, .sports-table tbody td{border-right: 1px solid var(--table-border-color);border-bottom: 1px solid var(--table-border-color);}
.sports-table tbody tr td.line{border-left:1px solid #e3e3e3;}
.sports-table tbody tr:first-child th, .sports-table tbody tr:first-child td{border-top:1px solid var(--table-border-color2);}
.sports-table tbody tr th.line{border-left:1px solid var(--table-border-color2);}
.sports-table tbody th:first-child, .sports-table tbody td:first-child{border-left:0 none;}
.sports-table tfoot { display:table-row-group;}
.sports-table tfoot th, .sports-table tfoot td{border-left:1px solid var(--table-border-color);border-top:1px solid var(--table-border-color);background:#f4f8fc;}
.sports-table tfoot th:first-child, .sports-table tfoot td:first-child{border-left:0 none;}
.sports-table .t_center{text-align:center;}
.sports-table .t_left{text-align:left;}
.sports-table .t_right{text-align:right;}
.sports-table .word_wrap {word-wrap: break-word; min-width: 110px;}
.sports-table .modify-ico {text-decoration: underline; cursor: pointer; font-size: 16px; position: relative; top: 3px;}
.sports-table.apply-table .fixture-info {display: flex; border-right: 0px; place-content: space-between; justify-content: space-between; font-size: 13px; align-items: baseline;}
.sports-table.apply-table .fixture-info .fixture-team-info { display: inline-flex;}
.sports-table.apply-table .fixture-info .fixture-status { display: inline-flex;}
.sports-table.apply-table .fixture-info .fixture-block { display: inline-flex;}
.sports-table.apply-table .fixture-info .fixture-team-info .fixture-num {font-weight: bold;}
.sports-table.apply-table .fixture-info .fixture-team-info .team-name {color: red;}
.sports-table.apply-table .market-info {display: flex; border-right: 0px; place-content: space-between;justify-content: space-around;font-size: 12px; align-items: baseline;}
.sports-apply-wrap .sports-apply-data .apply-func {display: flex; place-content: center; justify-content: space-around; padding-top: 8px;}

.sports-nation-list, .sports-game-list {width: 30%; min-width: 400px}
.sports-league-list, .sports-team-list, .sports-nation-seq-list {width: 67%; min-width: 750px}
.sports-market-cross-list {width:60% ;min-width: 800px}
.sports-accum-bet {width: 40%; min-width: 400px;}
.sports-family-list {width: 42%; min-width: 520px;}
.sports-main-league-list {width: 52%; min-width: 500px;}

/* .tbl_hover .hover th,.tbl_hover .hover td{color:#333;background:#fafafa;} */
.tbl_hover tr:hover,
.tbody_hover tbody:hover {
	color:#333;
	background:#fafafa;
}
.tbl_hover tr td,
.tbody_hover tbody td {
	transition: .5s opacity;
}
.tbl_hover tr:hover td.t_state,
.tbody_hover tbody:hover td.t_state {
	/* color: #333; */
	opacity: 0.8;
}

.fh-tbl-wrapper {
	height: 50vh;
	overflow-y: auto;
	border-top: 2px solid;
}
.fh-tbl-wrapper .table {
	border-top: 0px;
}
.fh-tbl-wrapper .tr-fixed {
	position: sticky;
	top: 0;
	background: #f1f1f1;
	z-index: 3;
	/* box-shadow: 0 1px 0px 0px var(--table-border-color); */
}
.fh-tbl-wrapper th {
	border: 0px !important;
	box-shadow: inset 0px 0 0px .4px var(--table-border-color3);
}
/* .fh-tbl-wrapper tbody td {
	opacity: .999;
} */

/* .tbl_hover tr:hover th, tr:hover td{
	color:#333;
	background:#fafafa;
} */
.left_tbl{}
.left_tbl th{background:#f4f4f4;color:#000;text-align:left;padding-left:20px;}
.left_tbl td{text-align:left;}
.view_tbl .view_cont{min-height:130px;}
.view_tbl .view_cont img{max-width:100%;}
.form_tbl th b.t_red{margin-left:-10px;}
.form_tbl .wid1{width:536px;}
.form_tbl .wid2{width:260px;}
.form_tbl .wid3{width:167px;}
.form_tbl .wid4{width:121px;}
.form_tbl textarea{height:96px;}
.table .table{border:0 none;}
.table .table th,.table .table td{padding:5px 3px;text-align:center;border:1px solid #eee !important;}
.table .table th{background:none;}
.table div.tline{border-top: 1px solid var(--table-border-color);}
.table.report th, .table.report td {padding: 2px;}
.table.report div.tline{border-top: 1px solid #ddd;margin: 0px 3px;}
.th_sort{position:relative;display:block;padding-right:10px;}
.th_sort .fa{position:absolute;right:0;top:50%;margin-top:-6px;}
table.no_line {white-space: nowrap;}
.no_line th{text-align: right;padding-right: 15px;}
.no_line.thl th{text-align: left;padding-left: 15px;}
.no_line td{padding: 10px;}
.no_line.sm td:has(input[type='text'], input[type='number'], select) {padding:5px 10px}

table tbody.tbody_category tr.tr_title td {
	border-top: 1px solid var(--table-border-color);
	font-style: italic;
	font-weight: bold;
	color: #ccc;
}

.tb_empty,
.table.report .tb_empty{padding: 15px;border: 1px solid #e3e3e3;text-align: center;}
.table tr.disabled,
.table td.disabled,
.no_line tr.disabled,
.no_line td.disabled{opacity: .3}
.no_line tr.disabled{pointer-events:none;}
.unclickable {pointer-events: none;}

.table-xlsx-buffer tbody td {border: 0px !important;}
.table-xlsx-buffer .tb_sum th, .table-xlsx-buffer .tb_sum td,
.table-xlsx-buffer tfoot th, .table-xlsx-buffer tfoot td {background:#f4f8fc !important; border: 0.5px solid gray;}
.table-xlsx-buffer .b_depth1 td {background: #fcf7ea !important;}
.table-xlsx-buffer .thb_vio {background: #e8b0fe !important;}
.table-xlsx-buffer .thb_red {background: #fdafaf !important;}
.table-xlsx-buffer .thb_green {background-color: #97f4e3 !important;}
.table-xlsx-buffer .thb_yellow {background-color: #fdfac0 !important;}
.table-xlsx-buffer .thb_blue {background-color: #9ebbf7 !important;}

.th-tpgs .popper-tpgs-all {
	position: absolute;
	background: white;
	box-shadow: 0 3px 5px 0 rgb(0 0 0 / 50%);
	z-index: 1;
	left: 50%;
	min-width: 100%;
	bottom: 0;
	transform: translate(-50%, 50%);
	opacity: 0;
	z-index: -1;
}
.th-tpgs:hover .popper-tpgs-all {
	opacity: 1;
	transform: translate(-50%, 0%);
	transition: .2s all;
	z-index: 2;
}

.th-tpgs .popper-tpgs-all>.pop-title {
	padding: 5px 0;
	background: #f4f4f4;
	border-top: 2px solid #646464;
}
.th-tpgs > span > i {
	margin-left: 3px;
	color: rgb(0 0 0 / 25%);
}

.th-tpgs.tpgs-right .popper-tpgs-all {
	left: initial;
	right: 0;
	transform: translate(0, 50%);
}
.th-tpgs.tpgs-right:hover .popper-tpgs-all {
	transform: translate(0, 0%);
}

.bet-market-list {display: flex; }
.bet-market-list .img-betting {background: url(../images/common/0.png) left top no-repeat; width: 26px; height: 26px; background-size: cover; padding-top: 7px; margin-right: 3px; display: flex; flex-direction: column;}
.bet-market-list .img-bet-lose {background: url(../images/common/1.png) left top no-repeat; width: 26px; height: 26px; background-size: cover; padding-top: 7px; margin-right: 3px; display: flex; flex-direction: column;}
.bet-market-list .img-bet-win {background: url(../images/common/2.png) left top no-repeat; width: 26px; height: 26px; background-size: cover; padding-top: 7px; margin-right: 3px; display: flex; flex-direction: column;}
.bet-market-list .img-bet-off {background: url(../images/common/3.png) left top no-repeat; width: 26px; height: 26px; background-size: cover; padding-top: 7px; margin-right: 3px; display: flex; flex-direction: column;}
.bet-market-list .img-bet-cancel {background: url(../images/common/5.png) left top no-repeat; width: 26px; height: 26px; background-size: cover; padding-top: 7px; margin-right: 3px; display: flex; flex-direction: column;}
.bet-market-list .market-num {font-weight: bold; color: black; font-size: 10px; top: -7px; position: relative;}
.bet-market-list .market-sports-img {top: -6px; position: relative;}
.bet-market-list .market-sports-img .flag-image {width: 18px;}

.inner-tr0 {background-color: #dddddd;}
.inner-tr0:hover { background-color: #dddddd !important;}

.inner-tr {background-color: #aeaeae;}
.inner-tr table {margin: 5px 0px 5px 0px;};
.inner-tr table, tr, td{text-align: center;}
.inner-tr th{ background-color: #00000094;color: #ffffff;}
.total-bet-cash{color: #2b5aa8; text-decoration: underline; cursor: pointer;}
.inner-tr td{
	padding: 3px 6px 6px 6px;
}
.inner-tr:hover {
	color: #333 !important;
	background: #aeaeae !important;
}
.rate-betcash-nowrap {
	flex-flow: nowrap;
    display: flex;
    justify-content: left;
}
.card-img-top {
	/* border-radius: 5px;
	box-shadow: 0px 3px 6px 1px rgb(0 0 0 / 40%); */
	filter: drop-shadow(0px 6px 3px rgb(0 0 0 / 40%));
}
.json-container {
	white-space: pre;
	padding: 0.5em 2em;
	background: #222;
	box-shadow: inset 0 0 1.5em 0.5em black;
	border-radius: 5px;
}

/*페이징*/
.paging_box { position:relative; text-align:center;min-height:30px;}
.paging_box .left { position:absolute; top:0; left:0;}
.paging_box .right { position:absolute; top:0; right:0;}
.pagination{display:inline-block;padding-left:0;border-radius:4px;vertical-align:top;}
.pagination>li {display:inline}
.pagination>li>a, .pagination>li>span {position:relative;float:left;padding:4px 12px;line-height:20px;text-decoration:none;color:#428bca;background-color:#fff;border:1px solid #ddd;margin-left:-1px;font-size:12px;height:20px;}
.pagination>li:first-child>a, .pagination>li:first-child>span {margin-left:0;border-bottom-left-radius:4px;border-top-left-radius:4px}
.pagination>li:last-child>a, .pagination>li:last-child>span {border-bottom-right-radius:4px;border-top-right-radius:4px}
.pagination>li>a:focus, .pagination>li>a:hover, .pagination>li>span:focus, .pagination>li>span:hover {color:#2a6496;background-color:#eee;border-color:#ddd}
.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover {z-index:2;color:#fff;background-color:#428bca;border-color:#428bca;cursor:default}
.pagination>.disabled>a, .pagination>.disabled>a:focus, .pagination>.disabled>a:hover, .pagination>.disabled>span, .pagination>.disabled>span:focus, .pagination>.disabled>span:hover {color:#777;background-color:#fff;border-color:#ddd;cursor:not-allowed}
.pagination [class*=icon-]{margin:0 -6px;font-size:14px;}
.pagination>.page-first>a{font-family: "fontello";}
.pagination>.page-first>a::before{content: '\f100';}
.pagination>.page-last>a{font-family: "fontello";}
.pagination>.page-last>a::before{content: '\f101';}
.pagination>.page-next>a{font-family: "fontello";}
.pagination>.page-next>a::before{content: '\f105';}
.pagination>.page-prev>a{font-family: "fontello";}
.pagination>.page-prev>a::before{content: '\f104';}

.paging_box>button {position: relative;padding: 4px 12px;line-height: 20px;text-decoration: none;color: #428bca;background-color: #fff;border: 1px solid #ddd;margin-left: -1px;font-size: 12px;height: 20px;}
.paging_box>button.on {z-index: 2;color: #fff;background-color: #428bca;border-color: #428bca;cursor: default;}
.paging_box>button.disabled {cursor: no-drop;pointer-events: none;color: #aaa;opacity: .6;}
.paging_box>button.first::before {content: '\f100';font-family: "fontello";}
.paging_box>button.prev::before {content: '\f104';font-family: "fontello";}
.paging_box>button.last::before {content: '\f101';font-family: "fontello"}
.paging_box>button.next::before {content: '\f105';font-family: "fontello";}
.paging_box>button.first {border-bottom-left-radius: 4px;border-top-left-radius: 4px;}
.paging_box>button.last {border-bottom-right-radius: 4px;border-top-right-radius: 4px;}

/* etc */
.box_style{padding:20px;border:1px solid #ccc;}
.box_style2{padding:15px;border:1px solid #ccc;}
.box_style > strong{display:inline-block;}
.box_style>.box_content{margin: 20px;}
.txt_list li{padding-left:8px;margin-top:5px;background:url(../images/common/bg_txtList.gif) no-repeat left 8px;}
.txt_list li:first-child{margin-top:0;}
.arr_list li{padding-left:13px;margin-top:10px;background:url(../images/common/bg_arrList.png) no-repeat left 4px;}
.arr_list li:first-child{margin-top:0;}

.ic_txt {display: inline-block;padding: 0 2px;font-size: 8px;font-weight: 600;background: #c02700;color: #fff;border-radius: 3px;}
.ic_level{background: #2196f3;padding: 0px 5px;border-radius: 50%;font-size: 10px;color: white;}
.ic_partner:after{content: 'C';padding: 0px 4px;font-size: 10px;background: #ff4d4d;border-radius: 50%;color: white;margin-left: 3px;}
.ic-online:before{content:'\f1cd';color: #019c63;margin-left: 5px;}
.ic-offline:before{content:'\f1cd';color: #e81717;margin-left: 5px;}
.ic-connect:before{content:'\f1eb'; color: #2196F3;margin-left: 5px;}
.ic-block:before{content:'\e836'; color: #e81717;margin-left: 5px;}
.ic_main_partner {background: #ce3a3a;box-shadow: 0px 0px 2px 2px rgb(255 0 0 / 66%);}

/*********************************************/
.tooltip_help {
    position: absolute;
    padding: 0 0.3em;
    font-size: .9em;
    font-style: normal;
    font-weight: normal;
    vertical-align: top;
    margin-top: -3px;
}
.tooltip_help:hover {
    color: #0075ff;
    /*opacity: 1;*/
    font-weight: bold;
}
.tooltip {
    cursor: pointer;
}
.tooltip::after {
    content: attr(data-content);
    position: absolute;
    display: block;
    visibility: hidden;
    white-space: pre;
    color: #555;
    border: .5px solid #b4b4b4;
    padding: .75em 1.25em;
    border-radius: 7px;
    box-shadow: 2px 2px 4px 0px #ccc;
    background: white;
    z-index: 10;
    text-align: left;
    opacity: 0;
    transition: .2s;
    font-weight: normal;
}
.tooltip:hover::after {
	display: block;
	opacity: 1;
	visibility: visible;
}
.tooltip.right::after {
	left: 100%;
}
.tooltip.left::after {
    right: 100%;
}
.tooltip.bottom::after {
	top: 60%;
}
.tooltip.top::after {
	bottom: 60%;
}
.tooltip.top.right::after {
	border-bottom-left-radius: 0;
}
.tooltip.top.left::after {
	border-bottom-right-radius: 0;
}
.tooltip.bottom.right::after {
	border-top-left-radius: 0;
}
.tooltip.bottom.left::after {
	border-top-right-radius: 0;
}


/* ==========================================================================
   popup
   ========================================================================== */

.pop_layer {
	visibility: hidden;
	overflow-y: auto;
	display: flex;
	/* justify-content: center; */
	align-items: start;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 150;
	width: 100%;
	height: 100%;
	padding: 20px 0;
	z-index: 100;
	opacity: 0;
	transition: all .2s ease;
	background: rgba(0, 0, 0, 0.7);
	box-sizing: border-box
}
.pop_wrap {
	display: flex;
	display: -ms-flex;
	flex-direction: column;
	position: relative;
	margin: auto;
	margin-top: 50px;
	border: 2px solid #333333;
	box-shadow: 0 0 15px black;
	background: #fff;
	opacity: 0;
	transform: translateY(-50%);
	min-width: fit-content;
}
.pop_wrap > h1{line-height:42px;font-size:16px;color:#fff;background:#333333;padding-left:20px;margin: -1px;}
.pop_wrap .pop_cont{ min-width:600px;padding:30px 30px 20px; box-sizing:border-box;}
.pop_wrap .btn_close{display:block;position:absolute;right:0px;top: 0px; padding:10px;width:23px;height:23px;background:url(../images/common/pop_close.png) no-repeat center;text-indent: -9999em;}
/* -- 2023.10.19 09:49  partner/popup form.radiao-type에서 mt15가 적용되지 않아 막는다. 이로 하여 다른 문제가 있으면 해당한 다른 방식을 취할것.
.pop_wrap .pop_cont .flex {
	margin-top: .5em;
} */
.pop_layer.on { visibility:visible; opacity:1;}
.pop_layer.on .pop_wrap{ animation:fadeInDown .4s ease-in-out forwards; opacity:1; transform: translateY(0%);}
.pop_layer::-webkit-scrollbar{display: none;}
.pop_wrap .importantPopCont { padding:30px 50px 0; font-size:13px;max-width: 200px;word-break:break-word;}
.pop_wrap .importantPopCont:before { content:''; display:block; width:60px; height:60px; margin:0 auto 20px; background:url('../images/common/ico_infomation.png') no-repeat center center /100%;}
.win_pop_layer{visibility: hidden;position:absolute;width: 100%;}
.win_pop_layer.on { visibility:visible; opacity:1;}
.win_pop_layer>.pop_wrap{border: none;box-shadow: none; opacity: initial; transform: initial; margin: auto 0;}

@media print {
	#header, #lnb, #footer{display:none;}
	#container{padding:10px;}
}

/* radio-type */
.radio-type {height:28px;padding: 1px 5px 1px 3px;border-radius: 4px;}
.radio-type input[type="radio"] {opacity:0;position:relative;width:0;}
.radio-type label {padding:3px 8px;font-size:inherit;border:1px solid #b4b4b4;border-radius:4px;background-color:white;cursor:pointer;margin: 2.5px 0;}
.radio-type label:hover {background-color: #f4f4f4;}
.radio-type input[type="radio"]:focus + label {border: 1px solid #d9d5d5;}
.radio-type input[type="radio"]:checked + label {background-color: #4172c9;color: white;}
.radio-type.stream{font-size: 10px;}
.category-type {padding: 7px;border-radius: 6px;height: fit-content;} 
.market-detail-form {padding-top: 0px !important; padding-bottom: 0px !important;height: 26px; display: flex; align-items: center;}
.market-detail-form label {margin-top: 0px !important; margin-bottom: 0px !important; margin-left: 2px;}
.market-detail-form .radio-input {height: 23px !important;width: 23px !important; margin-left: 15px;}
.market-detail-form2 {padding-top: 0px !important; padding-bottom: 0px !important;height: 26px; display: flex; align-items: center;}
.market-detail-form2 label {margin-top: 0px !important; margin-bottom: 0px !important; margin-left: 2px; width:110px !important;}
/* toggle-button*/

.toggle-btn input[type="checkbox"] {display:none;}
.toggle-btn label {padding:3px 0px;font-size:inherit;border:1px solid #b4b4b4;border-radius:4px;background-color:white;cursor:pointer;margin: 2.5px 0;}
.toggle-btn input[type="checkbox"]:focus + label {border: 1px solid #4172c9;}
.toggle-btn input[type="checkbox"]:checked + label {background-color: #4172c9;color: white;border-color: transparent;}

.toggle-btn.mute span {font-family: "fontello"; font-size: 20px;cursor:pointer;}
.toggle-btn.mute span:before {content:'\e85e';color: #107ace;}
.toggle-btn.mute input[type="checkbox"]:checked + span:before {content:'\e85f';color: red;}

.toggle-btn.match {border-radius: 3px;display: inline-block;height: 25px;padding: 0 5px;box-sizing: border-box;line-height: 26px;vertical-align: middle;font-family: "fontello";font-weight: 600;font-size: 14px;cursor:pointer;/* margin-right: 3px; */position: absolute;top: 0;bottom: 0;right: 3px;margin: auto;}
.toggle-btn.match span:before {content:'\e8d6';}
.toggle-btn.match:has(input[type="checkbox"]:checked) {color: #ffffff;background: #2196f3;}

.switch {position: relative;display: inline-block;width: 32px;height: 17px;vertical-align: bottom;}
.switch input {opacity: 0;width: 0;height: 0;display: none;}
.slider {position: absolute;cursor: pointer;top: 0;left: 0;right: 0;bottom: 0;background-color: #ccc;-webkit-transition: .2s;transition: .2s;}
.slider:before {position: absolute;content: "";height: 10px;width: 10px;left: 4px;bottom: 2.5px;background-color: white;-webkit-transition: .2s;transition: .2s;}
input:checked+.slider {background-color: #2196F3;border: 1px solid #2196F3;}
input:checked+.slider:before {-webkit-transform: translateX(14px);-ms-transform: translateX(14px);transform: translateX(14px);}
.slider.round {border-radius: 34px;border: 1px solid #ccc;}
.slider.round:before {border-radius: 50%;}
input:focus+.slider,
input:active+.slider {box-shadow: 0 0 0px 3px rgb(0 173 255 / 14%);}
input:hover+.slider {border: 1px solid rgb(0 0 0 / 14%);}
input:checked:hover+.slider {border: 1px solid #2196F3;}
input:disabled+.slider {opacity: .5;pointer-events: none;}

.unit>input,.unit>select{border-bottom-right-radius: 0px;border-top-right-radius: 0px;z-index: 1;}
.unit>span{background-color: #f4f4f4;width: 30px;text-align: center;margin-left: 0px;padding: 0 10px;line-height: 26px;border-radius: 0 3px 3px 0px;border: 1px solid #c2c2c2;border-left: 0px;}
.unit>span.button {width: initial;}

.unit2>input,.unit2>select{border-bottom-right-radius: 0px;border-top-right-radius: 0px;z-index: 1;}
.unit2>span{background-color: #f4f4f4;width: 30px;text-align: center;margin-left: 0px;padding: 0 4px;line-height: 26px;border-radius: 0 3px 3px 0px;border: 1px solid #c2c2c2;border-left: 0px;}
.unit2>span.button {width: initial;}

input.border-none{border: none;}

/* .pop_question{padding: 7px; border-radius: 4px; height: fit-content; border: 1px solid #b4b4b4; background-color: #f3f3f3;} */

.scroll-table {height: 40vh; overflow: auto;}
.scroll-table2 {height: 80vh; overflow: auto;}
.scroll-table3 {height: 57vh; overflow: auto;}
.scroll-table4 {height: calc(100vh - 160px);overflow: auto;}
.modal-scroll {overflow-y: scroll; height: 700px; padding-top: 0px;}
.flag-sector { text-align: left !important; padding-left: 10px !important;}
.flag-sector2 { text-align: left !important;}
.flag-image {width: 30px;}
.sports_detail h4{font-size: 22px; color: steelblue;}
.overflow-header{position:sticky !important; top: 0 !important; z-index: 100 !important;background: #000000 !important; color: #fff;border: #fff 1px solid !important; color: #fff !important; height: 50px;}
.overflow-header-sub{position:sticky !important; top: 32px !important; z-index: 100 !important;background: #000000 !important; color: #fff;border: #fff 1px solid !important; color: #fff !important;}
.pop_wrap .tb_main_info{font-size: 13px !important; font-weight: 500!important;}
.pop_wrap .tb_win_draw_lose{font-size: 14px!important; font-weight: 500!important;}
.sports_game_rate .request_api {align-self: center;}
.recalc-para{display: flex; place-content: space-between;}
.recalc-market-chk {text-align: right;}
.recalc-market-chk span {font-weight: bold; padding-right: 4px;}
.recalc-market-chk label {width: 35px;}

.search_wrap {position: relative;border: 1px solid #b4b4b4;border-radius: 4px;box-sizing: border-box;display: inline-block;}
.search_wrap input {border: none;padding-right: 30px;}

.clearable {
	position: relative;
	width: 200px;
	font-size: 1em;
	display: inline-block;
}

.clearable input {
	width: 100%;
	padding-right: 2em;
	box-sizing: border-box;
}

.clearable input:placeholder-shown + button {
	opacity: 0;
	pointer-events: none;
}

.clearable input + button {
	position: absolute;
	box-shadow: inset 0 0 0 1px rgb(145 145 145 / 46%);
	display: block;
	width: 1.6em;
	height: 30px;
	line-height: 30px;
	font-size: 1.2em;
	border-radius: 0 2px 2px 0;
	top: 0px;
	bottom: 0px;
	right: 0;
	margin: auto;
	background: rgb(200 200 200 / 20%);
	padding: 0;
	outline: none;
	cursor: pointer;
	transition: .1s;
	font-weight: bold;
}

/********************************************/
.editable-select {
	position: relative;
}

.editable-select select,
.editable-select input {
	position: absolute;
	z-index: 0;
	top: 0;
	left: 0;
	background: inherit;
	color: inherit;
	height: 100%;
	line-height: inherit;
	width: 100%;
	border: none;
	padding: inherit;
	border-radius: inherit;
}

.editable-select select {
	z-index: 0;
}

.editable-select input {
	z-index: 1;
	width: calc(100% - 2em);
}

/**************************************/
.grid-container {
	display: grid;
	grid-template-columns: 7% 3% 7% 11% 9% 3% 3% 3% 9% 8% 4.5% 2% 4% 3% 3% 4% 3% 7% auto;
	gap: 1px;
	background-color: #e1e1e1;
	text-align: center;
}

.grid-container-sports-play-game {
	display: grid;
	grid-template-columns: 3% 5.5% 4% 3% 12% 3% 13.5% 13.5% 13.5% 4% 4% 3.5% 3.5% 3.5% 4% auto;
	gap: 1px;
	background-color: #e1e1e1;
	text-align: center;
}

.grid-container-manual-play-game {
	display: grid;
	grid-template-columns: 3% 4% 15% 8% 5% 14% 14% 14% 5% 5% 5% auto;
	gap: 1px;
	background-color: #e1e1e1;
	text-align: center;
}

.grid-container-sports-finish-game {
	display: grid;
	grid-template-columns: 4% 6% 5% 13% 5% 17% 17% 17% 5% auto;
	gap: 1px;
	background-color: #e1e1e1;
	text-align: center;
}

.grid-container-sports-manual-finish-game {
	display: grid;
	grid-template-columns: 4% 4% 17% 5% 17% 17% 17% 7% auto;
	gap: 1px;
	background-color: #e1e1e1;
	text-align: center;
}

.grid-container-detail {
	display: grid;
	grid-template-columns: 7% 3% 7% 14% 11% 3% 3% 3% 11% 8% 5% 2% 4% 3% 3% 4% 3% auto;
	gap: 1px;
	background-color: #e1e1e1;
	text-align: center;
}

.grid-container-partner {
	display: grid;
	grid-template-columns: 7% 3% 7% 14% 11% 3% 3% 3% 11% 8% 5% 2% 3% 3% 4% 3% auto;
	gap: 1px;
	background-color: #e1e1e1;
	text-align: center;
}

.grid-container > div, .grid-container-detail > div, .grid-container-partner > div {
	background-color: rgba(255, 255, 255, 0.8);
	text-align: center;
	padding: 8px 0;
}

.grid-container .grid-item-header, .grid-container-detail .grid-item-header, .grid-container-partner .grid-item-header, .grid-container-sports-play-game .grid-item-header, .grid-container-sports-finish-game .grid-item-header, .grid-container-manual-play-game .grid-item-header, .grid-container-sports-manual-finish-game .grid-item-header {
	background: #636363;
	color: white;
	font-weight: bold;
	border: 0px solid #000;
}

.grid-container .align-header, .grid-container-detail .align-header, .grid-container-partner .align-header {
	line-height: 3;
}

.grid-container .grid-item-content, .grid-container-detail .grid-item-content, .grid-container-partner .grid-item-content {
	line-height: 3;
}

.grid-container-sports-play-game > div, .grid-container-manual-play-game > div, .grid-container-sports-finish-game > div, .grid-container-sports-manual-finish-game > div {
	background-color: rgba(255, 255, 255, 0.8);
	text-align: center;
	padding: 0px 0px;
}

.grid-container-sports-play-game .align-header, .grid-container-manual-play-game .align-header, .grid-container-sports-finish-game .align-header, .grid-container-sports-manual-finish-game .align-header {
	line-height: 2.5;
}

.grid-container-sports-play-game .grid-item-content, .grid-container-manual-play-game .grid-item-content {
	line-height: 2;
}

.grid-container-sports-finish-game .grid-item-content, .grid-container-sports-manual-finish-game .grid-item-content {
	line-height: 2.5;
}

.grid-container .grid-item-content .home-handi-mark, .grid-container-detail .grid-item-content .home-handi-mark, .grid-container-partner .grid-item-content .home-handi-mark {
	color: #31adff;
	font-weight: bold;
	position: absolute;
	right: 4px;
	font-size: 11px;
}

.grid-container .grid-item-content .away-handi-mark, .grid-container-detail .grid-item-content .away-handi-mark, .grid-container-partner .grid-item-content .away-handi-mark {
	color: #31adff;
	font-weight: bold;
	position: absolute;
	left: 4px;
}

.grid-container .grid-item-content .under-mark, .grid-container-detail .grid-item-content .under-mark, .grid-container-partner .grid-item-content .under-mark {
	width: 10px;
	position: absolute;
	right: 7px;
	margin-top: 8px;
}

.grid-container .grid-item-content .over-mark, .grid-container-detail .grid-item-content .over-mark, .grid-container-partner .grid-item-content .over-mark {
	width: 10px;
	position: absolute;
	left: 7px;
	margin-top: 8px;
}

.item-header-type1 {
	grid-column: 5 / 7;
}

.item-header-type2 {
	grid-column: 8 / 10;
}


.soccer-item {
	display: inline-flex;
	flex-flow: column;
	justify-content: center;
	align-items: center;
	line-height: 1.5;
	height: 3.5em;
	color: inherit;
	background-color: transparent;
	border: 1px solid #e8e8e8;
	border-radius: 0;
	margin: 0;
	position: relative;
	padding: .2em 1em;
}
.soccer-item .under-mark,
.soccer-item .over-mark {
	height: 2em;
	position: absolute;
}
.soccer-item .under-mark {right: 0;}
.soccer-item .over-mark {left: 0;}

.baseball-item {
	display: inline-flex;
	flex-flow: column;
	justify-content: center;
	align-items: center;
	line-height: 1.5;
	height: 3.5em;
	color: inherit;
	background-color: transparent;
	border: 1px solid #e8e8e8;
	border-radius: 0;
	margin: 0;
	position: relative;
	padding: .2em 1em;
}
.baseball-item .under-mark,
.baseball-item .over-mark {
	height: 2em;
	position: absolute;
}
.baseball-item .under-mark {right: 0;}
.baseball-item .over-mark {left: 0;}

.basketball-item {
	display: inline-flex;
	flex-flow: column;
	justify-content: center;
	align-items: center;
	line-height: 1.5;
	height: 3.5em;
	color: inherit;
	background-color: transparent;
	border: 1px solid #e8e8e8;
	border-radius: 0;
	margin: 0;
	position: relative;
	padding: .2em 1em;
}
.basketball-item .under-mark,
.basketball-item .over-mark {
	height: 2em;
	position: absolute;
}
.basketball-item .under-mark {right: 0;}
.basketball-item .over-mark {left: 0;}

.richtext-area{padding: 7px; border-radius: 4px; height: fit-content; border: 1px solid #b4b4b4; background-color: #f3f3f3; white-space: initial; font-size: 12px;}

.upload-container {
	position: relative;
}
.upload-container input {
	border: 1px solid #92b0b3;
	background: #f1f1f1;
	outline: 2px dashed #92b0b3;
	outline-offset: -10px;
	padding: 100px 0px 100px 250px;
	text-align: center !important;
	width: 500px;
	font-size: 16px;
}
.upload-container input:hover {
	background: #ddd;
}
.upload-container:before {
	position: absolute;
	bottom: 50px;
	left: 245px;
	content: " (or) Drag and Drop files here. ";
	color: #3f8188;
	font-weight: 900;
}
.upload-btn {
	margin-left: 327px;
	padding: 7px 20px;
}

.show-bet-detail {
	background: #a0d7ffe8;
}

.show-bet-detail:hover {
	background: #69b5ece8 !important;
}

.link-num {
	color: #2b5aa8;
	text-decoration: underline;
	cursor: pointer;
}

.rolling_wrap {
	display: inline-grid;
	margin-left: 0px;
}

.rolling_wrap input {
	width: 71px;
}

.manual-play-game-table select, .manual-play-game-table input {
	height: 25px;
}

.new-market-pick-field {
	display: flex;
	flex-flow: column;
	align-items: center;
}

.detail-usage-btn {
	width: calc(33% - 1px);
	text-wrap: wrap;
	padding: 3px 0;
	/* width: 100%;
	text-wrap: wrap;
	padding: 3px;
	word-break: keep-all;
	margin: 0; */
}
.colors_wrap {
	display: flex;
	align-items: center;
	position: relative;
	gap: 5px;
}
.colors_wrap .color {
	position: relative;
}
.colors_wrap .color>span{
	position: absolute;
	top: -15px;
	left: 1px;
}