@charset "utf-8";

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

@import url('font.css');

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

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

/* 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;}
.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;}

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

.pt0{padding-top:0px !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;}

.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;}

.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;}
.pr10{padding-right:10px;}
.pr15{padding-right:15px;}
.pr20{padding-right:20px;}
.pr30{padding-right:30px;}
.pr50{padding-right:50px;}

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

.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;}

.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;}

.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;}
.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{font-family: "fontello";}
.list>li.on::before{content:'\e851'; padding-right: 10px;}

.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;}

.lh32{line-height:32px;}

.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}

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

.b_depth1{background: #f5e4ba4f}

.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;}

.tl_red{color: #ff6f6f;}
.tl_green{color: #4eff8b;}
.tl_blue{color: #83caf3;}
.tl_yellow{color: #ffde9b;}
.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;}

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

.h25{height: 25px !important;}
.w40 { width:40px;}
.w50 { width:50px;}
.w65 { width:65px;}
.w70 { width:70px;}
.w80 { width:80px;}
.w90 { width:90px;}
.w100 { width:100px;}
.w110 { width:110px;}
.w120 { width:120px;}
.w130 { width:130px;}
.w140 { width:140px;}
.w150 { width:150px;}
.w160 { width:160px;}
.w170 { width:170px;}
.w200 { width:200px;}
.w213 { width:213px;}
.w250 { width:250px;}
.w280 { width:280px;}
.w300 { width:300px;}
.w350 { width:350px;}
.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_30 { width:30%;}
.w_40 { width:40% !important;}
.w_50 { width:50%;}
.w_60 { width:60%;}
.w_70 { width:70%;}
.w_80 { width:80%;}
.w_90 { width:90%;}
.w_100 { width:100%;}
.mw500{max-width: 500px;}
.mw600{max-width: 600px;}
.mw800{max-width: 800px;}
.mw1000{max-width: 1000px;}
.mw1200{max-width: 1200px;}

/* flex */
.flex { display:flex;}
.top_flex{ display:flex; padding-block-end: 10px;}
.flex > * + * { margin-left:10px;}
.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;}

/* 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{width:16px;height:16px;}
input[type=checkbox].checkbox:hover+.lbl, input[type=radio].radio:hover+.lbl,
input[type=checkbox].checkbox:focus+.lbl, input[type=radio].radio:focus+.lbl,
input[type=checkbox].checkbox:active+.lbl, input[type=radio].radio:active+.lbl,
input[type=checkbox].checkbox:checked+.lbl, input[type=radio].radio:checked+.lbl{font-weight:bold;}
input[type=checkbox].checkbox:checked+.lbl, input[type=radio].radio:checked+.lbl{color:#4172c9;}
label.long{position:relative;padding-left:23px;}
label.long input{position:absolute;left:0;top:1px;}

input[type=checkbox].checkbox.large,
input[type=radio].radio.large{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;
}

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: 50px;}
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 {
	/* box-shadow: 0 0 0 3px #2196f3; */
	outline: 4px solid rgb(0 0 0 / 10%);
	transition: none;
}
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;}
input[type="text"], input[type="password"],input[type="search"],input[type="number"],select, option{color:#308163;}

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

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:120px;text-align:center;}
.ui-datepicker-trigger{display:inline-block;width:30px;height:30px;background:url(../images/common/btn_datepicker.gif) no-repeat center center;text-indent:-999em;vertical-align:middle;}


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

html, body{height:100%;background-color: #eaeaea;}
#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:block;height:48px;line-height:48px; color:#fff; text-align:center;}
		#logo a img{max-width:100%;max-height:100%}
	.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: 50px;
		}
		.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: '\e84f';font-size: 19px;}
		.head_info .audio.mute:before{content: '\e850';}
.left_menu{position:fixed;left:0;top:53px;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: 50px;
	background: #373737;
	box-shadow: 0 0 12px;
	display: flex;
	flex-flow: column;
	padding: 5px 0;
}

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


.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: 5px;
}

::-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 > 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-right: 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-bottom:10px;background-color: #373737;display: none;}
.gnb > ul > li > div.active > ul{display: block;}
.gnb > ul > li > div > ul > li{margin-top:10px;}
.gnb > ul > li > div > ul > li > a{display:block;color:#fff;padding-left:15px;background:url(../images/common/bg_gnb2dep.gif) no-repeat left 9px;font-weight: 200;}
.gnb > ul > li > div > ul > li > a:hover,
.gnb > ul > li > div > ul > li > a:focus,
.gnb > ul > li > div > ul > li > a:active,
.gnb > ul > li > div > ul > li.active > a{color:#8eb6fd;}


#container {
	min-width: fit-content;
}
#container.leftNone { padding:70px 20px 110px; margin:0 auto;}
#contents {
	position: relative;
	/* display: inline-block; */
	background-color: white;
	margin: 60px 10px 55px 210px;
	border-radius: 7px;
	transition: all .3s;
}
#contents>h4{display: flex;padding: 10px 20px;border-bottom: 1px solid #ddd;align-items: center;}
#page_addr {
	position: relative;
	top: 53px;
	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.btn_gold {
	background: #f3ba21;
	border-color: #f3ba21;
	color: #fff;
}
.button.btn_green{background:#40a9fd;border-color:#40a9fd;color:#fff;}
.button.btn_blue{background:#2196F3;border-color:#2196F3;color:#fff;}
.button.btn_gray{background:#aaaaaa;border-color:#aaaaaa;color:#fff;}
.button.btn_red{background:#ce3a3a;border-color:#ce3a3a;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.w20{width:23px;padding-left:0;padding-right:0;margin-right:5px;}
.button.w50{width:48px;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;}

/* 탭메뉴 */
.tabmenu{display: flex;margin: 0px 20px;border-bottom: 1px solid #c8c8c8;padding-top: 10px;}
.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;
}

.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;}

/* table */
.table{border:1px solid #d2d2d2;border-top:2px solid #646464; white-space: nowrap;}
.table tr.pointer{cursor:pointer;}
.table th,.table td{padding:7px;text-align:center;}
.table thead th{background:#f4f4f4;color:#333;border-left:1px solid #e3e3e3;}
.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: #f4f8fc;}
.table tbody th, .table tbody td{border-left:1px solid #e3e3e3;border-top:1px solid #e3e3e3;}
.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 #d2d2d2;}
.table tbody tr th.line{border-left:1px solid #d2d2d2;}
.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 #e3e3e3;border-top:1px solid #e3e3e3;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;}
/* .tbl_hover .hover th,.tbl_hover .hover td{color:#333;background:#fafafa;} */
.tbl_hover tr:hover {
	color:#333;
	background:#fafafa;
}

.tbl_hover tr td {
	transition: .5s opacity;
}

.tbl_hover tr:hover td.t_state {
	/* color: #333; */
	opacity: 0.8;
}

/* .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 #000;}
.table.report th, .table.report td {padding: 2px;}
.table.report div.tline{border-top: 1px dashed #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;}

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

/*페이징*/
.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;}
.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 4px;
	font-size: 10px;
	font-weight: 800;
	background: #c02700;
	color: #fff;
	border-radius: 3px;
	letter-spacing: -1px;
	float: right;
}
.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:'\e82b'; color: #e81717;margin-left: 5px;}


/* ==========================================================================
   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;}
.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;} 

/* toggle-button*/
.switch {position: relative;display: inline-block;width: 32px;height: 17px;vertical-align: bottom;}
.switch input {opacity: 0;width: 0;height: 0;}
.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: 11px;width: 11px;left: 4px;bottom: 3px;background-color: white;-webkit-transition: .2s;transition: .2s;}
input:checked+.slider {background-color: #2196F3;}
input:checked+.slider:before {-webkit-transform: translateX(14px);-ms-transform: translateX(14px);transform: translateX(14px);}
.slider.round {border-radius: 34px;}
.slider.round:before {border-radius: 50%;}
input:focus+.slider,
input:active+.slider {box-shadow: 0 0 0px 3px rgb(0 173 255 / 14%);}

.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;}

input.border-none{border: none;}

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

#w_resaler, #w_resaler_user, #w_login_nm, #w_nick_nm{
	cursor: pointer;
}