@charset "utf-8";

/* All */
header, footer, nav, section, article, aside, figure, figcaption, embed, iframe {display:block;}
body, table, input, textarea, select, button {font-size:12px;}
a img {border:0;}

/* reset style */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, address, big, cite, code,
del, dfn, em, font, img, ins, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, 
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
caption, tbody, tfoot, thead, tr, th, td
{margin:0; padding:0; border:0; font-style:normal; line-height:1;}

*, *:before, *:after {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
* {word-wrap:break-word; word-break:break-all;}

html, body {height:auto;}
html {}
body {margin:0; padding:0; scroll 0 0 transparent; font-family:'PretendardR','RobotoR','AppleGothic','Apple SD Gothic Neo','NotoKrR','Malgun Gothic','맑은 고딕',Dotum,'돋움',sans-serif; font-size:12px; color:#333;}
table				{border-collapse:collapse; border:0; padding:0;}
td,th				{vertical-align:middle; font-size:12px; font-family:'PretendardR','RobotoR','AppleGothic','Apple SD Gothic Neo','NotoKrR','Malgun Gothic','맑은 고딕',Dotum,'돋움',sans-serif;}
dd,dt,ol,dl,ul,li	{list-style:none; margin:0; padding:0;}
button, label		{padding:0; border:none; vertical-align:middle; font-family:'PretendardR','RobotoR','AppleGothic','Apple SD Gothic Neo','NotoKrR','Malgun Gothic','맑은 고딕',Dotum,'돋움',sans-serif; outline:none; cursor:pointer; color:#333;}
legend,caption		{display:none; height:0; width:0; font-size:0;}
blockquote, q		{quotes:none;}
ins					{text-decoration:none;}
del					{text-decoration:line-through;}
hr					{display:block; -webkit-margin-before:0.5em; -webkit-margin-after:0.5em; -webkit-margin-start:auto; -webkit-margin-end:auto;}
img, fieldset		{border:0 none; vertical-align:middle;}
img					{max-width:100%;}
a					{outline:none; select-dummy:expression(this.hideFocus=true); cursor:pointer;}
select				{display:inline-block; vertical-align:middle; margin:0; padding:0; width:100%; height:100%; font-family:'PretendardR','RobotoR','AppleGothic','Apple SD Gothic Neo','NotoKrR','Malgun Gothic','맑은 고딕',Dotum,'돋움',sans-serif; font-size:15px; color:#333; border:none; background-color:#fff;}
textarea			{display:block; margin:0; padding:8px 0; width:100%; font-family:'PretendardR','RobotoR','AppleGothic','Apple SD Gothic Neo','NotoKrR','Malgun Gothic','맑은 고딕',Dotum,'돋움',sans-serif; font-size:15px; color:#333; border:none; resize:none;}
input, textarea		{outline:none;}

input[type="text"], input[type="tel"], input[type="password"], input[type="email"], input[type="number"] {
	padding:0;
	width:100%;
	height:40px;
	font-family:'PretendardR','RobotoR','AppleGothic','Apple SD Gothic Neo','NotoKrR','Malgun Gothic','맑은 고딕',Dotum,'돋움',sans-serif;
	font-size:17px;
	color:#000;
	border:none;
	background-color:#fff;
	vertical-align:middle;
}
input[type="radio"], input[type="checkbox"] {
	vertical-align:middle;
	margin:0;
	padding:0;
}


/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type="number"] {
  -moz-appearance: textfield;
}


input::-webkit-input-placeholder	{font-family:'PretendardR','RobotoR','AppleGothic','Apple SD Gothic Neo','NotoKrR','Malgun Gothic','맑은 고딕',Dotum,'돋움',sans-serif; color:#aaa;}
input:-ms-input-placeholder			{font-family:'PretendardR','RobotoR','AppleGothic','Apple SD Gothic Neo','NotoKrR','Malgun Gothic','맑은 고딕',Dotum,'돋움',sans-serif; color:#aaa;}
input::-moz-placeholder				{font-family:'PretendardR','RobotoR','AppleGothic','Apple SD Gothic Neo','NotoKrR','Malgun Gothic','맑은 고딕',Dotum,'돋움',sans-serif; color:#aaa;}
input:-moz-placeholder				{font-family:'PretendardR','RobotoR','AppleGothic','Apple SD Gothic Neo','NotoKrR','Malgun Gothic','맑은 고딕',Dotum,'돋움',sans-serif; color:#aaa;}

textarea::-webkit-input-placeholder	{font-family:'PretendardR','RobotoR','AppleGothic','Apple SD Gothic Neo','NotoKrR','Malgun Gothic','맑은 고딕',Dotum,'돋움',sans-serif; color:#aaa;}
textarea:-ms-input-placeholder		{font-family:'PretendardR','RobotoR','AppleGothic','Apple SD Gothic Neo','NotoKrR','Malgun Gothic','맑은 고딕',Dotum,'돋움',sans-serif; color:#aaa;}
textarea::-moz-placeholder			{font-family:'PretendardR','RobotoR','AppleGothic','Apple SD Gothic Neo','NotoKrR','Malgun Gothic','맑은 고딕',Dotum,'돋움',sans-serif; color:#aaa;}
textarea:-moz-placeholder			{font-family:'PretendardR','RobotoR','AppleGothic','Apple SD Gothic Neo','NotoKrR','Malgun Gothic','맑은 고딕',Dotum,'돋움',sans-serif; color:#aaa;}


input								{-webkit-appearance:none; appearance:none;}
input,textarea, button, select		{border-radius:0; -webkit-border-radius:0;}


textarea[readonly],
input[readonly]						{background-color:#F0F1F2;}
input[type="text"][readonly]						{padding-right:0 !important;}


/* Link style */
a:link					{color:#333; text-decoration:none;}
a:visited				{color:#333; text-decoration:none;}
a:hover					{color:#333; text-decoration:none;}
a:active				{color:#333; text-decoration:none;}
a:focus					{color:#333; text-decoration:none;}
a.self					{text-decoration:none;}



/* etc define */
.underline {text-decoration:underline;}
.lineThrough {text-decoration:line-through; color:#8a8a8a;}
.font-default {color:#333; font-weight:normal;}
.bold {font-weight:bold;}
.line {border-bottom:1px solid #d3d3d3;}
.floatLeft {display:inline; float:left;}
.floatRight {display:inline; float:right;}
.clearBoth {clear:both;}
.alignMiddle {vertical-align:middle !important;}
.alignTop {vertical-align:top !important;}
.alignBottom {vertical-align:bottom !important;}
.alignLeft {text-align:left !important;}
.alignCenter {text-align:center !important;}
.alignRight {text-align:right !important;}
.borderTop {border-top:1px solid #eee;}
.borderBottom {border-bottom:1px solid #dfdfdf;}
.borderRight {border-right:1px solid #e8e8e8;}
.txtspace {letter-spacing:-1px;}
.displayInline-block {display:inline-block;}
.displayBlock {display:block;}
.displayNone {display:None !important;}
.borderNone {border:none !important;}
.overflowHidden {overflow:hidden;}



/* Background Color */
.background-gray									{background-color:#f2f2f2;}



/* Selectbox Style */
.select												{position:relative; padding-right:30px; width:100%; height:40px; background-color:#fff; cursor:pointer; transition:all .3s; border:1px solid #ddd;}
.select:before,
.select:after										{content:""; position:absolute; top:50%; right:15px; margin-top:-1px; /* width:2px; */ width:1px; height:8px; /* background-color:#222; */ background-color:#333;}
.select:before										{margin-right:-1px; transform:rotate(-45deg) translateY(-50%);}
.select:after										{transform:rotate(45deg) translateY(-50%);}
.select label										{position:absolute; top:0; left:10px; font-size:15px; color:#000; line-height:40px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-family:"PretendardM","RobotoM","AppleGothic","Apple SD Gothic Neo","NotoKrR","Malgun Gothic","맑은 고딕","Dotum","돋움",sans-serif;}
.select.selectBox									{margin:0; padding-left:5px; width:100%; height:40px; opacity:0; filter: alpha(opacity=0);}
.select > ul										{position:absolute; top:100%; left:-1px; z-index:10; width:calc(100% + 2px); max-height:200px; overflow-y:auto; border:1px solid #eee; background-color:#fff; display:none;}
.select > ul li										{border-top:1px solid #eee; color:#333; padding-left:15px; min-height:28px; display:flex; align-items:center; transition:all .1575s ease;}
.select > ul li:first-child					{border-top:0;}
/*
.select > ul li > a,
.select > ul li										{font-weight:600;}
*/
.select > ul li:hover							{background-color:#f2f2f2; border-color:#f2f2f2;}
.select.on:before,
.select.on:after											{margin-top:-7px;}
.select.on:before										{transform:rotate(-135deg) translateY(-50%);}
.select.on:after									{transform:rotate(135deg) translateY(-50%);}
.select.on > ul									{display:block;}


.select_box												{padding-right:0;}
.select_box > label								{position:absolute; top:0; left:0;}
.select_box > .selectBox					{width:100%; height:40px; padding-left:5px; opacity:0; }



/* Checkbox Image */
.wrap-checkbox										{position:relative;}
.wrap-checkbox > input								{position:absolute; top:50%; left:0; z-index:0; opacity:0; width:13px; height:13px; transform:translateY(-50%);}
.wrap-checkbox > label								{position:relative; padding-left:20px; font-family:'PretendardSB'; color:#333;}
.wrap-checkbox > label:before						{content:""; position:absolute; top:50%; left:0; z-index:1; width:13px; height:13px; background:url('../../images/icon/i_checkbox.png') no-repeat; transform:translateY(-50%);}
.wrap-checkbox > input:checked + label:before			{background-position:left bottom;}
.wrap-checkbox > input:checked + label				{color:#000;}

.wrap-checkbox.round > label									{padding-left:34px; font-size:16px;}
.wrap-checkbox.round > label:before						{width:24px; height:24px; background:url('../../images/icon/i_checkbox_round.png') no-repeat;}

.wrap-checkbox.maximum								{width:30px; height:30px;}
.wrap-checkbox.maximum > input						{width:100%; height:100%;}
.wrap-checkbox.maximum > label						{display:block; padding-left:0; width:100%; height:100%;}
.wrap-checkbox.maximum > label:before				{width:30px; height:30px; background-image:url('/web/images/icon/i_checkbox_max.png');}
.wrap-checkbox.noLabelTxt							{width:20px; margin:0 auto;}
.wrap-checkbox.noLabelTxt > label				{padding-left:20px;}
.wrap-checkbox.maximum.noLabelTxt							{width:30px; margin:0 auto;}
.wrap-checkbox.maximum.noLabelTxt > label				{padding-left:30px;}

.wrap-checkbox.noLabel > label					{padding-left:10px;}


/* Radio Image */
.wrap-radio											{position:relative;}
.wrap-radio > input									{position:absolute; top:50%; left:0; z-index:0; opacity:0; width:17px; height:17px; transform:translateY(-50%);}
.wrap-radio > label									{position:relative; padding-left:25px; font-family:'PretendardSB'; color:#333;}
.wrap-radio > label:before					{content:""; position:absolute; top:50%; left:0; z-index:1; transform:translateY(-50%); border-radius:50%; background-color:#fff;  border-width:4px; border-style:solid; border-color:#DDE2E5; width:17px; height:17px; transition:all .05s;}
.wrap-radio > input:checked+label					{color:#000;}
.wrap-radio > input:checked+label:before			{border-color:#232e7c; border-width:5px;}

.wrap-radio.img > label:before							{content:""; position:absolute; top:50%; left:0; z-index:1; width:30px; height:30px; background:url('../../images/icon/i_checkbox.png') no-repeat; transform:translateY(-50%);}
.wrap-radio.img > input:checked+label:before			{background-position:left bottom;}

.wrap-radio.img.maximum									{width:30px; height:30px;}
.wrap-radio.img.maximum > input							{width:100%; height:100%;}
.wrap-radio.img.maximum > label							{display:block; padding-left:0; width:100%; height:100%;}
.wrap-radio.img.maximum > label:before					{width:30px; height:30px; background-image:url('/web/images/icon/i_radio_max.png');}


/* button style */
.btn-wrap .mBtn						{background-color:#232e7c; color:#fff; border:1px solid #232e7c; padding:0 9px;}
.btn-wrap .search						{background-color:#ea5b0a; border:1px solid #ea5b0a; color:#fff;}
.btn-wrap .whBtn,
.btn-wrap .reset						{background-color:#fff; border:1px solid #bbb; color:#333;}
.btn-wrap .bkBtn					{background-color:#000; border:1px solid #000; color:#fff;}
.btn-wrap .gBtn					{background-color:#ccc; border:1px solid #D9DADC; color:#333;}

.btn-wrap.beFlex				{display:flex; align-items:center;}


/* Layout Selector */
.wrap												{width:100%; /* min-width:1920px; */ min-width:1440px; transition:all .4s; /* overflow-x:auto; */}
.wrap.fixed									{position:fixed; top:0; left:0; right:0; bottom:0; width:100%; height:100%; padding-left:160px;}
.wrap.hasBgBlue:before								{content:""; position:fixed; top:0; left:0; width:160px; height:100%; background-color:#232e7c;}
.container											{height:calc(100% - 71px); overflow-y:auto; display:flex; flex-direction:column;}
.container > iframe								{width:100% !important; height:100% !important;}

.contents-wrap											{flex:1 1 0; position:relative; display:flex; /* padding:0 14px; */ margin-bottom:14px;}
.contents-wrap .contents + .contents				{margin-left:14px;}
.contents-wrap .contents + .contents.off			{margin-left:0;}
/* .contents-wrap .contents.leftFixed:last-child				{margin-top:28px;} */

.noW100 + .contents-wrap					{margin-top:20px;}

.contents											{/* overflow-y:auto; */ position:relative; flex:1 1 0; display:flex; flex-direction:column; transition:all .2s ease;}
.contents.rightFixed									{position:fixed; right:0; bottom:0; width:50%; height:calc(100% - 99px); background-color:#fff; overflow:hidden;}
/* .contents.rightFixed									{flex:0 0 704px; position:relative; margin-top:28px; overflow:hidden; margin-left:14px;} */


.contents.leftFixed							{flex:0 0 690px;}
.contents.off										{flex:0 0 0; width:0; overflow:hidden; margin-left:0;}

.contents.half									{flex:0 0 850px;}

.contents > div + div						{margin-top:20px;}

.contents-wrap .contents.half + .contents				{margin-left:14px;}
.contents-wrap .contents.half + .contents.off			{flex:1 1 0; display:none;}


.list-wrap											{overflow-x:hidden; overflow-y:auto;}
.lnb-wrap										{width:160px; position:fixed; left:0; top:0; height:100%; overflow-y:auto;}
.lnb-wrap.beFlexColumn					{display:flex; flex-direction:column;}
.fixed-beFlex								{position:fixed; left:0; top:0; width:100%; height:100%; overflow-y:auto; display:flex; flex-direction:column; padding:14px;}

.table-wrap > .table-list					{border:1px solid #D9DADC;}
.upper-table								{min-height: 45%;}


/* lnb */
.lnb-wrap .logo-wrap					{height:70px; position:relative; background-color:#fff; border-right:1px solid #DEDEDE;}
.lnb-wrap .logo-wrap	 > a				{position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:120px; height:50px; background:url('/img/logo-nobuyung.png') no-repeat center bottom; background-size:100% auto; text-indent:-9999px;}

.lnb-wrap .lnb-menu										{padding:15px 10px;}
.lnb-wrap .lnb-menu button					{height:40px; width:100%; background-color:transparent; color:#fff; font-size:12px; padding-left:30px; text-align:left; border-radius:4px; position:relative; transition:all .2s ease;}
.lnb-wrap .lnb-menu button:before				{content:""; position:absolute; left:12px; top:50%; margin-top:-5px; width:9px; height:9px; border-radius:50%; border:1px solid rgba(255,255,255,.5); transition:all .2s ease;}
.lnb-wrap .lnb-menu button.on						{/* background-color:#232e7c; */ background-color:#bbc3ff; color:#232e7c; font-family:"PretendardB";}
.lnb-wrap .lnb-menu button.on:before				{border-color:#fff; background-color:rgba(255,255,255,.3); border-color:#bbc3ff; background-color:rgba(35,46,124.3);}

.lnb-wrap.beFlexColumn										{overflow:hidden;}
.lnb-wrap.beFlexColumn .logo-wrap				{flex:0 0 70px;}
.lnb-wrap.beFlexColumn .lnb-menu					{flex:1 1 0; overflow-x:hidden; overflow-y:auto;}



/* Header */
header												{position:relative; border-bottom:1px solid #DEDEDE; height:40px; padding:0 14px; display:flex; align-items:center;}
header > em										{font-size:14px; font-family:"PretendardB"; color:#000;}
header > div										{margin-left:auto;}
header > div										{display:flex; align-items:center;}
header > div b									{color:#26282C; font-family:"RobotoM","PretendardM"; padding:0 10px;}
header > div > span							{color:#949494; position:relative;}
header > div > span:before						{content:""; position:absolute; left:-1px; top:50%; margin-top:-4px; height:8px; width:1px; background-color:#ABABAB;}
header > div > a									{width:18px; height:18px; display:inline-block; background:url('../../images/icon/jd_icon_img.png') no-repeat 0 -59px; text-indent:-9999px; margin:0 10px;}
header > div > button						{margin-left:40px; height:24px; font-size:12px; background-color:#EBEBEB; padding:0 14px; border-radius:20px; font-family:"PretendardM"; color:#26282C; transition:all .2s ease;}
header > div > button:hover				{color:#fff; background-color:#232e7c;}


/* tab 메뉴 */
.tabMenu-wrap				{background-color:#F4F5F8; min-height:31px; border-bottom:1px solid #DEDEDE; padding:6px 14px 0; }
.tabMenu-wrap > button							{background-color:transparent; min-width:60px; height:24px; color:#000; font-size:12px; padding:0 28px 0 10px; border-width:1px 1px 0; border-radius:6px 6px 0 0; border-style:solid; border-color: #dedede; position:relative; z-index:0; font-family:"RobotoM","PretendardM"; transition:all .2s ease;}
.tabMenu-wrap > button > i						{width:10px; height:10px; /* background:url('../../images/icon/jd_icon_img.png') no-repeat 0 -76px;*/ position:absolute; right:8px; top:50%; margin-top:-5px; display:block;  z-index:1; /* border:1px solid transparent; border-radius:50%; */}
.tabMenu-wrap > button > i:before,
.tabMenu-wrap > button > i:after			{content:""; position:absolute; left:50%; top:50%; width:1px; height:8px; background-color:#999;}
.tabMenu-wrap > button > i:before		{transform:translate(-50%, -50%) rotate(45deg);}
.tabMenu-wrap > button > i:after		{transform:translate(-50%, -50%) rotate(-45deg);}
.tabMenu-wrap > button.on					{background-color:#fff; /* padding-right:28px; */}
.tabMenu-wrap > button.on:after			{content:""; position:absolute; bottom:-1px; left:0; width:100%; height:1px; background-color:#fff;}
.tabMenu-wrap > button:hover > i				{/* display:block; */ /* border-color:#eee; */}
.tabMenu-wrap > button:first-child,
.tabMenu-wrap > button.on:first-child				{padding-right:10px;}


/* 통합검색 - 페이지 상단 검색 */
.search-wrap													{padding:14px;}
.search-wrap .table-write > table				{width:850px;}
.search-wrap .filter-wrap + .filter-wrap,
.search-wrap .table-write + .table-write > table					{border-top:0; margin-top:-1px;}
.search-wrap .filter-wrap								{max-width:850px;}

.filter-wrap				{display:flex; align-items:center; height:32px; border:1px solid #D9DADC;}
.filter-wrap > dl					{display:flex; align-items:center; font-size:12px; font-family:"RobotoM","PretendardM"; height:30px; width:100%;}
.filter-wrap > dl > dt				{background-color:#F4F5F8; width:80px; height:100%; padding:3px; display:flex; align-items:center; justify-content:center; border-width:0 1px; border-style:solid; border-color:#D9DADC;}
.filter-wrap > dl:first-child > dt				{border-left:0;}
.filter-wrap > dl dt.hasAsterisk								{white-space:nowrap;}
.filter-wrap > dl dt.hasAsterisk > b					{color:#f00;}
.filter-wrap > dl > dd												{padding:3px; height:100%; flex:1 1 0; position:relative;}
.filter-wrap > dl > dd + dd:last-of-type				{margin-left:auto; flex:inherit;}
.filter-wrap > dl > dd + dd:last-of-type > button					{padding:0 10px; background-color:#2F3A4A; color:#fff; height:100%; font-size:12px; border-radius:4px;}
.filter-wrap > dl > dd input[type="password"],
.filter-wrap > dl > dd input[type="text"]			{height:100%; border:1px solid #D6DAE1; font-size:12px; text-indent:7px;}
.filter-wrap > dl > dd textarea				{border:1px solid #D6DAE1; padding:8px; font-size:13px;}
.filter-wrap > dl > dd > span					{position:relative; height:100%; display:inline-block; width:100%;}
.filter-wrap > dl > dd > span > input[type="password"],
.filter-wrap > dl > dd > span > input[type="text"]									{padding-right:23px;}
.filter-wrap > dl > dd > span > input[type="password"]:only-child,
.filter-wrap > dl > dd > span > input[type="text"]:only-child				{padding-right:0;}
.filter-wrap > dl > dd > span > input[type="text"] + img + a.reset,
.filter-wrap > dl > dd > span > input[type="password"] + a.reset,
.filter-wrap > dl > dd > span > input[type="text"] + a.reset				{position:absolute; width:14px; height:14px; right:6px; top:50%; margin-top:-7px; border-radius:50%; background-color:#83898C; text-indent:-9999px; transition:all .2s ease; display:block;}
.filter-wrap > dl > dd > span > input[type="text"] + img + a.reset:before,
.filter-wrap > dl > dd > span > input[type="text"] + img + a.reset:after,
.filter-wrap > dl > dd > span > input[type="password"] + a.reset:before,
.filter-wrap > dl > dd > span > input[type="password"] + a.reset:after,
.filter-wrap > dl > dd > span > input[type="text"] + a.reset:before,
.filter-wrap > dl > dd > span > input[type="text"] + a.reset:after					{content:""; position:absolute; top:50%; left:50%; width:8px; height:1px; background-color:#fff;}
.filter-wrap > dl > dd > span > input[type="text"] + img + a.reset:before,
.filter-wrap > dl > dd > span > input[type="password"] + a.reset:before,
.filter-wrap > dl > dd > span > input[type="text"] + a.reset:before				{transform:translate(-50% ,-50%) rotate(45deg);}
.filter-wrap > dl > dd > span > input[type="text"] + img + a.reset:after,
.filter-wrap > dl > dd > span > input[type="password"] + a.reset:after,
.filter-wrap > dl > dd > span > input[type="text"] + a.reset:after				{transform:translate(-50% ,-50%) rotate(-45deg);}
.filter-wrap > dl > dd > span > input[type="text"] + img + a.reset:hover,
.filter-wrap > dl > dd > span > input[type="password"] + a.reset:hover,
.filter-wrap > dl > dd > span > input[type="text"] + a.reset:hover				{background-color:#333;}







/* Table Write */
.table-write						{}
.table-write > table			{width:100%; position:relative; border:1px solid #D9DADC;}
.table-write > table tr + tr					{border-top:1px solid #D9DADC;}
.table-write table th,
.table-write table td								{font-size:12px; color:#000; height:32px; padding:3px; border-style:solid; border-color:#D9DADC; font-family:"RobotoM","PretendardM";}
.table-write table th				{background-color:#F4F5F8; border-width:0 1px 0 0; font-weight:normal;}
.table-write table td + th				{border-width:0 1px;}
.table-write table th .select,
.table-write table td .select					{height:100%; background-color:transparent; min-width:75px;}
.table-write table th .select > label,
.table-write table td .select > label				{font-size:12px; line-height:22px; left:7px;}
.table-write table td input[type="number"],
.table-write table td input[type="tel"],
.table-write table td input[type="password"],
.table-write table td input[type="text"]			{height:100%; min-height:23px; border:1px solid #D6DAE1; font-size:12px; text-indent:7px;}					
.table-write table td > span									{position:relative;}
.table-write table td > span > input[type="text"]					{padding-right:23px;}
.table-write table td > span > input[type="text"]:only-child			{padding-right:0;}
.table-write table td > span > input[type="password"] + a.reset,
.table-write table td > span > input[type="text"] + a.reset					{position:absolute; right:6px; top:50%; margin-top:-5px; width:14px; height:14px; border-radius:50%; background-color:#83898C; text-indent:-9999px; transition:all .2s ease; display:block; flex:0 0 14px;}
.table-write table td > span > input[type="password"] + a.reset:after,
.table-write table td > span > input[type="password"] + a.reset:before,
.table-write table td > span > input[type="text"] + a.reset:before,
.table-write table td > span > input[type="text"] + a.reset:after					{content:""; position:absolute; top:50%; left:50%; width:8px; height:1px; background-color:#fff;}
.table-write table td > span > input[type="password"] + a.reset:before,
.table-write table td > span > input[type="text"] + a.reset:before				{transform:translate(-50% ,-50%) rotate(45deg);}
.table-write table td > span > input[type="password"] + a.reset:after,
.table-write table td > span > input[type="text"] + a.reset:after				{transform:translate(-50% ,-50%) rotate(-45deg);}
.table-write table td > span > input[type="password"] + a.reset:hover,
.table-write table td > span > input[type="text"] + a.reset:hover				{background-color:#333;}
.table-write table td > span > textarea								{height:100%; width:100%; border:1px solid #D6DAE1; padding:5px; font-size:12px;}

.table-write table td > span.onlyTxt										{margin:0 8px;}

.table-write table td > span.hasSearchBtn						{display:flex; align-items:center; width:100%; height:100%;}
.table-write table td > span.hasSearchBtn input[type="text"]							{padding-right:0; border:0;}
.table-write table td > span.hasSearchBtn input[type="text"] + a.reset						{ width:14px; height:14px; border-radius:50%; background-color:#83898C; text-indent:-9999px; transition:all .2s ease; display:block; flex:0 0 14px; margin:0 2px; position:relative;}
.table-write table td > span.hasSearchBtn input[type="text"] + a.reset:before,
.table-write table td > span.hasSearchBtn input[type="text"] + a.reset:after					{content:""; position:absolute; top:50%; left:50%; width:8px; height:1px; background-color:#fff;}
.table-write table td > span.hasSearchBtn input[type="text"] + a.reset:before				{transform:translate(-50% ,-50%) rotate(45deg);}
.table-write table td > span.hasSearchBtn input[type="text"] + a.reset:after				{transform:translate(-50% ,-50%) rotate(-45deg);}
.table-write table td > span.hasSearchBtn input[type="text"] + a.reset:hover				{background-color:#333;}
.table-write table td > span.hasSearchBtn > span					{border:1px solid #D6DAE1; display:flex; align-items:center; height:100%; flex:1 1 0;}
.table-write table td > span.hasSearchBtn > span.readonly					{background-color: #F0F1F2;}
.table-write table td > span.hasSearchBtn > button				{flex:0 0 38px; width:38px; height:100%; font-size:12px; background-color:#2F3A4A; color:#fff; border-radius:2px; margin-left:3px;}
.table-write table td > span.hasSearchBtn > button.mBtn				{color:#fff; background-color:#1825CF;}
.table-write table td > span.hasSearchBtn > button.whBtn			{background-color:#fff; border:1px solid #bbb; color:#333;}
/*
.table-write table td > span.hasSearchBtn						{padding-right:42px; display:inline-block; width:148px; height:100%;}
.table-write table td > span.hasSearchBtn > input[type="text"]							{}
.table-write table td > span.hasSearchBtn > input[type="text"] + a						{right:48px;}
.table-write table td > span.hasSearchBtn > button				{position:absolute; right:0; top:0; width:38px; height:100%; font-size:12px; background-color:#2F3A4A; color:#fff; border-radius:2px;}
.table-write table td > span.hasSearchBtn > button.mBtn				{color:#fff; background-color:#1825CF;}
*/
.table-write table td > span.hasSearchBtn.address > button					{flex:0 0 60px;}
.table-write table td > span.hasSearchBtn.addFile							{/* display:inline-flex; width:auto; */}
.table-write table td > span.hasSearchBtn.addFile > button													{position:relative;}
.table-write table td > span.hasSearchBtn.addFile > button > input[type="file"]				{position:absolute; left:0; top:0; width:100%; height:100%; opacity:0; cursor:pointer;}

.table-write table td > span.selectDate						{display:inline-flex; align-items:center; height:100%; width:136px; border:1px solid #D6DAE1;}
.table-write table td > span.selectDate > input[type="number"],
.table-write table td > span.selectDate > input[type="tel"],
.table-write table td > span.selectDate > input[type="text"]					{padding-right:0; border:0; flex:1 1 0;}
.table-write table td > span.selectDate > a.reset					{position:inherit; right:inherit; top:inherit; height:14px; border-radius:50%; background-color:#83898C; text-indent:-9999px; transition:all .2s ease; display:block; flex:0 0 14px; margin:0 2px; position:relative;}
.table-write table td > span.selectDate > a.reset:hover				{background-color:#333;}
.table-write table td > span.selectDate > a.reset:before,
.table-write table td > span.selectDate > a.reset:after						{content:""; position:absolute; top:50%; left:50%; width:8px; height:1px; background-color:#fff;}
.table-write table td > span.selectDate > a.reset:before					{transform:translate(-50% ,-50%) rotate(45deg);}
.table-write table td > span.selectDate > a.reset:after						{transform:translate(-50% ,-50%) rotate(-45deg);}
.table-write table td > span.selectDate > a.month-icon					{width:14px; height:14px; background:transparent url('/img/icon/month-ico.png') no-repeat center; margin:0 2px;}
.table-write table td > span.selectDate > button					{margin:0 3px; background-color:transparent;}
.table-write table td > span.selectDate > input[type="number"] + .ui-datepicker-trigger,
.table-write table td > span.selectDate > input[type="tel"] + .ui-datepicker-trigger,
.table-write table td > span.selectDate > input[type="text"] + .ui-datepicker-trigger						{position:absolute; right:0;}
.table-write table td > span.selectDate + .select						{display:inline-block; width:auto;}

.table-write table td > span.selectDate.hasCalendarBtn					{padding-right:17px; background-color:#fff;}
.table-write table td > span.selectDate > input[type="text"][readonly] {background-color: white;}
.table-write table td > span.selectDate > input[type="text"][disabled] {background-color: #F0F1F2;}

.table-write table td > span.selectDate.readonly					{background-color:#F0F1F2; position:relative;}
.table-write table td > span.selectDate.readonly > a.month-icon:hover				{background-color:#fff;}
/* .table-write table td > span.selectDate.readonly:before							{content:""; position:absolute; right:0; top:0; background-color:#fff; width:18px; height:100%; z-index:-1;} */

.table-write table td > span.beFlex					{border:1px solid #D6DAE1; display:flex; align-items:center; height:24px;}
.table-write table td > span.beFlex > input			{border:0; padding-right:0;}
.table-write table td > span.beFlex > input + a,
.table-write table td > span.beFlex > a					{position:relative; top:inherit; right:inherit; margin-top:0; flex:0 0 14px; margin:0 4px;}
.table-write table td > span.beFlex.onlyTxts				{border:0;}

.table-write table td > span.beFlex.hasSelect					{border:0; margin:0 -1.5px; background-color:#fff;}
.table-write table td > span.beFlex.hasSelect .select	{margin:0 1.5px;}

.table-write table td > span.btn-wrap					{height:100%; display:inline-flex; align-items:center;}
.table-write table td > span.btn-wrap > button				{width:100%; white-space:nowrap; height:100%; padding:0 10px;}
.table-write table td > span.btn-wrap > button > input[type="file"]					{position:absolute; left:0; top:0; width:100%; height:100%; opacity:0; cursor:pointer;}
.table-write table td > span.btn-wrap > button + button					{margin-left:3px;}
.table-write table td > span.btn-wrap + small					{margin:0 10px; font-size:12px;}

.table-write table td > .filter-wrap					{border:0; height:auto;}
.table-write table td > .filter-wrap dd				{padding:0;}
.table-write table td > .filter-wrap dl.flex-column						{flex-direction:column; height:auto;}
.table-write table td > .filter-wrap dl.flex-column dd				{min-height:24px; margin-left:inherit; width:100%;}
.table-write table td > .filter-wrap dl.flex-column dd + dd				{margin-top:3px;}
.table-write table td > .filter-wrap dl.flex-column dd + dd:last-of-type				{flex:1 1 0;}

.table-write table td > .wrap-checkbox,
.table-write table td > .wrap-radio					{margin:0 8px;}

.table-write table td .smsBtn					{border: 1px solid #000; border-radius: 2px; background-color: #fff; padding: 0 4px; height: 25px; margin-left:7px; white-space:nowrap;}

.table-write table td.alignLeft						{padding:3px 9px;}

.table-write table td.hasBtn							{position:relative;}
.table-write table td.hasBtn > button				{position:absolute; top:3px; left:3px; height:25px; width:calc(100% - 6px);}


/* Table List */
.table-list											{padding:0; border-bottom:1px solid #D9DADC; min-height:300px; position:relative;}
.table-list table									{width:100%; text-align:center;}
.table-list table thead						{/* background-color:#F4F5F8; */ border-bottom:1px solid #D9DADC; background-image: linear-gradient(#ffffff, #dbe6eb);} /* #c6d8df,  */
.table-list table tr + tr							{border-top:1px solid #D9DADC;}
.table-list table tr:last-child				{border-bottom:1px solid #D9DADC;}
.table-list table tr.on							{/* background-color:#D9E1FF; */ background-color:#d0e4f1;}
.table-list table th,
.table-list table td								{height:30px;  position:relative; padding:5px 2px; border-bottom-width:1px; border-color:#D9DADC; border-style:solid; font-size:12px; color:#000;}
.table-list table th								{font-weight:normal; font-family:"PretendardM"; /* background-color:#F4F5F8; */ color:#004164;}
.table-list table td + td,
.table-list table th + th						{border-width:0 0 0 1px;}
.table-list table td								{min-height:30px; color:#000; border-width:0; padding:3px;}
.table-list table td > em							{color:#64b2cb;}
.table-list table td > em.total				{color:#CF2F2D; font-family:"RobotoM","PretendardM";}
.table-list table td > b								{font-weight:normal; color:#aaa;}
.table-list table td input[type="text"]			{height:100%; border:1px solid #D6DAE1; font-size:12px; text-indent:7px;}
.table-list table td button.onlyBtn				{height:100%; width:100%; border-radius:2px;}
.table-list table td button.bkBtn				{color:#fff; background-color:#2F3A4A;}
.table-list table td .eaBox-wrap,
.table-list table td .txts-detail				{height:24px;}
.table-list table td .eaBox-wrap + .txts-detail				{margin-top:3px;}
.table-list table td .beFlex							{display:flex; align-items:center;}
.table-list table td .beFlex > p						{flex:0 0 60px; margin-right:10px;}
.table-list table td.alignRight,
.table-list table td.alignLeft					{padding:8px 5px;}
.table-list table td.hasAttachedFile:after				{content:""; position:absolute; top:50%; left:50%; /* transform:translate(-50%, -50%); */ margin-left:-8px; margin-top:-8px; width:17px; height:17px; background:url('/img/icon/i_file-attached.png') no-repeat center; opacity:.5; cursor:pointer; background-size:auto 100%;}
.table-list table td.hasBtn > button:only-child				{height:100%; width:100%;}
.table-list.hasLink table tbody tr:hover,
.table-list table tbody tr:hover					{background-color:#f3f3f3;}
.table-list table tfoot							{background-color:#F4F5F8; border-top:1px solid #D9DADC;}
.table-list table tfoot tr:last-child th					{border-bottom:0;}

.table-list > .noData						{position:absolute; left:0; top:0; width:100%; height:100%;}

.table-list.half										{width:50%;}
.table-list.twoThird								{width:66.66666%;}
.table-list.hasPaging							{position:relative; margin-bottom:70px;}
.table-list.hasPaging > .paging-wrap				{position:absolute; top:100%; left:0; width:100%;} 
.table-list.hasLink table tbody tr				{cursor:pointer; background-color:transparent; transition:.15s;}
.table-list.hasLink table tbody tr.on				{/* background-color:#d0e4f1; */ background-color:rgba(208,228,241,.5);}

.sticky-header										{border:1px solid #D9DADC; overflow:auto;}
.sticky-header > table						{width:100%; /* border:1px solid #D9DADC; */ border-bottom:1px solid #D9DADC;}
.sticky-header > table thead				{position:sticky; top:0; z-index:2;}


/* no data */
.noData p,
.noData					{display:grid; place-items:center;}
.noData p				{border-radius:50%; background-color:#eee; height:80px; width:80px; margin:0 auto 15px;}
.noData > div			{text-align:center; font-size:14px;}



/* 페이징 */
.paging-wrap				{text-align:center; border:0; margin:18px 0 0;}
.paging-wrap a			{font-size:14px; color:#aaa; display:inline-block; padding:5px 7px; transition:.2s;}
.paging-wrap a + a					{margin-left:2px;}
.paging-wrap a + a.before		{margin-right:10px;}
.paging-wrap a + a.next			{margin-left:10px;}
.paging-wrap a.on					{color:#333;}
.paging-wrap a.first,
.paging-wrap a.last,
.paging-wrap a.before,
.paging-wrap a.next					{/* font-size:23px; */ font-size:30px; position:relative; top:2px;}

.paging-wrap.icon								{margin-top:25px;}
.paging-wrap.icon a							{position:relative; padding:0; display:flex; align-items:center; justify-content:center; width:20px; height:20px; margin:0 4px;}
.paging-wrap.icon a:after				{content:""; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:26px; height:26px; /* margin-top:-9px; margin-left:-15px; */ border:1px solid transparent; border-radius:50%; transition:.2s;}
.paging-wrap.icon a.first:after,
.paging-wrap.icon a.last:after,
.paging-wrap.icon a.before:after,
.paging-wrap.icon a.next:after					{border-color:#e6e6e6;}
.paging-wrap.icon a.on							{font-family:"PretendardB"; color:#232e7c;}
.paging-wrap.icon a.on:after				{/* border-color:#ddd; */ border-color:rgba(35,46,124,1);}
.paging-wrap.icon a.on.first,
.paging-wrap.icon a.on.last,
.paging-wrap.icon a.on.before,
.paging-wrap.icon a.on.next					{font-family:"PretendardM";}


.paging-wrap.beFlex							{display:flex; align-items:center; justify-content:center;}
.paging-wrap.beFlex a.first,
.paging-wrap.beFlex a.last,
.paging-wrap.beFlex a.before,
.paging-wrap.beFlex a.next						{top:-1px; font-size:23px;}
.paging-wrap.beFlex a.first:after,
.paging-wrap.beFlex a.last:after,
.paging-wrap.beFlex a.before:after,
.paging-wrap.beFlex a.next:after						{margin-top:1px;}



/* dl 테이블 스타일 */
.dlTable-wrap					{}
.dlTable-wrap > div			{display:flex;}
.dlTable-wrap > div + div				{margin-top:-1px;}
.dlTable-wrap dl					{width:33.333%; display:flex; align-items:center; height:30px; font-size:12px; color:#000; border:1px solid #D9DADC;}
.dlTable-wrap dl dt,
.dlTable-wrap dl dd				{height:100%;}
.dlTable-wrap dl dt				{width:80px; background-color:#F4F5F8; border-right:1px solid #D9DADC; text-align:center; padding:9px 0;}
.dlTable-wrap dl dt.hasAsterisk > b				{color:#f00;}
.dlTable-wrap dl dd					{padding:9px; flex:1 1 0;}
.dlTable-wrap dl dd > em						{color:#CF2F2D;}
.dlTable-wrap dl dd .smsBtn				{float:right; position:relative; right:-6px; top:50%; border:1px solid #000; border-radius:2px; background-color:#fff; padding:0 4px; height:25px; vertical-align:middle;}
.dlTable-wrap dl dd .realPrice				{color:#CF2F2D; font-family:"RobotoM","PretendardM";}
.dlTable-wrap dl dd.hasInput				{padding:3px;}
.dlTable-wrap dl + dl					{border-left:0;}
.dlTable-wrap dl.dispTable				{display:table;}
.dlTable-wrap dl.dispTable > dt,
.dlTable-wrap dl.dispTable > dd				{display:table-cell; vertical-align:middle;}
.dlTable-wrap dl.dispTable > dd				{line-height:1.3;}
.dlTable-wrap dl.dispTable > dd .beFlex				{display:flex; align-items:center;}
.dlTable-wrap > div > dl > dd input[type="password"],
.dlTable-wrap > div > dl > dd input[type="text"]			{height:100%; border:1px solid #D6DAE1; font-size:12px; text-indent:7px;}
.dlTable-wrap > div > dl > dd > span.selectDate																	{position:relative;}
.dlTable-wrap > div > dl > dd > span.selectDate > input[type="text"] + img				{position:absolute; right:6px; top:50%; width:auto; height:auto; background:none; margin-top:-8px; cursor:pointer;}
.dlTable-wrap > div > dl > dd > span.hasInput-readonlyWh > input[type="text"][readonly]					{background-color:transparent;}
.dlTable-wrap.has5dl > div > dl > dt				{width:50px;}
.dlTable-wrap.has2dl > div > dl					{width:100%;}



/* 로그인 */
.loginWrap-grid									{position:fixed; left:0; top:0; height:100%; width:100%; display:grid; place-items:center;}

.login-wrap											{width:410px;}
.login-wrap .logo-wrap						{margin-left: 70px; display:flex; align-items:center; font:30px "PretendardB";}
.login-wrap .logo-wrap > p				{height:53px; width:56px; margin-right:20px; background:url('/img/logo_jybooks.png') no-repeat left center;}
.login-wrap .login-opt						{display:flex; align-items:center;}
.login-wrap .login-opt > a:last-child				{margin-left:auto; color:#21409a; font:16px "PretendardM"; text-decoration:underline;}
.login-wrap .btn-wrap > button:only-child				{width:100%; height:55px; color:#fff; font-size:22px; font-family:"PretendardB"; background-color:#21409a; border-radius:0 30px 0 30px;}
.login-wrap .data-input > li > dl dd > input									{border:1px solid #ececec;}

.logo-wrap + form,
.logo-wrap + .loginData-input					{margin-top:50px;}
.login-opt + .btn-wrap,
.loginData-input	 + .login-opt					{margin-top:40px;}


.loginInput-wrap			{position:fixed; top:50%; left:50%; width:500px; min-height:630px; margin-left:-250px; margin-top:-315px; padding:0 20px 20px;}
.loginInput-wrap .data-input + div,
.loginInput-wrap > div + div				{margin-top:30px;}
.loginInput-wrap .logoImg-wrap								{padding:20px 0; margin-bottom:30px;}
.loginInput-wrap .logoImg-wrap > em 					{width:100px; height:92px; margin:0 auto; display:block; background:url('../../images/icon/jd_icon_img.png') no-repeat 0 -102px; text-indent:-9999px;}
.loginInput-wrap .data-input > li + li					{margin-top:20px;}
.loginInput-wrap .data-input > li > dl dd				{}
.loginInput-wrap .data-input > li > dl dd .select				{border:0; background-color:transparent; height:55px; border-radius:10px;}
.loginInput-wrap .data-input > li > dl dd .select:before,
.loginInput-wrap .data-input > li > dl dd .select:after				{width:2px; right:20px; height:10px;}
.loginInput-wrap .data-input > li > dl dd .select.on						{background-color:#EBEFF4;}
.loginInput-wrap .data-input > li > dl dd .select > label				{font-size:20px; line-height:55px; left:15px; color:#A5A9B0;}
.loginInput-wrap .data-input > li > dl dd .select > ul								{border-radius:10px;}
.loginInput-wrap .data-input > li > dl dd .select > ul li							{font-size:20px; line-height:55px;}
.loginInput-wrap .data-input > li > dl.on dd .select								{background-color:#EBEFF4;}
.loginInput-wrap .data-input > li > dl.on dd .select > label					{color:#000;}
.loginInput-wrap .login-option					{display:flex; padding:10px 0;}
.loginInput-wrap .login-option > a				{margin-left:auto; font-size:16px; text-decoration:underline; color:#1825CF;}




/* 정보입력 */
.data-input											{margin-bottom:30px; /* padding:0 10px; */ width:100%;}
.data-input:only-of-type						{margin-bottom:0;}
.data-input > li > input						{border-bottom:1px solid #aaa; transition:all .2s ease;}
.data-input > li + li								{margin-top:20px;}				
.data-input > li > dl dt						{font-size:16px; margin-bottom:14px;}
.data-input > li > dl dd						{background-color:#FAFAFA; border-radius:10px;}
.data-input > li > dl dd > input					{height:55px; background-color:transparent; padding:0 15px; font-size:20px; font-family:"RobotoM","PretendardM"; border-radius:10px;}
/* .data-input > li > dl dd > input:not(:placeholder-shown), */
.data-input > li > dl.on dd > input,
.data-input > li > dl dd > input:focus				{background-color:#EBEFF4;}






.data-input > li.hasZipBtn					{padding-right:157px; position:relative;}
.data-input > li.hasZipBtn > button				{position:absolute; right:0; top:0; color:#333; border:1px solid #eee; height:100%; width:140px; background-color:#fff; font-size:13px; font-family:"PretendardM";}
.data-input > li.cash-receipt > .select,
.data-input > li.cash-receipt > input,
.data-input > li.email-address > .select,
.data-input > li.email-address > input,
.data-input > li.tel-num > .select,
.data-input > li.tel-num > input						{display:inline-block; margin:0 2.5%;}
.data-input > li.cash-receipt > .select,
.data-input > li.email-address > .select,
.data-input > li.tel-num > .select					{vertical-align:middle;}
.data-input > li.email-address > input:first-child,
.data-input > li.tel-num > .select:first-child					{margin-left:0;}
.data-input > li.email-address > .select:last-of-type,
.data-input > li.cash-receipt > input:last-of-type,
.data-input > li.tel-num > input:last-of-type				{margin-right:0;}
.data-input > li.email-address								{font-size:17px;}
.data-input > li.email-address > .select > ul li a			{font-size:12px;}
.data-input > li.yymmdd				{display:flex; align-items:center;}
.data-input > li.yymmdd > em					{width:100%; font-size:17px; font-weight:600; white-space:nowrap;}
.data-input > li.yymmdd > .select				{width:100%; margin-left:17px;}
.data-input > li.yymmdd > .select > label				{left:inherit; right:30px;}
.data-input > li.yymmdd > .select:first-of-type			{width:140%;}

.data-input > li.point-wrap				{padding-right:157px; position:relative;}
.data-input > li.point-wrap > input					{text-align:right; font-size:17px; padding-left:120px; color:#333;}
.data-input > li.point-wrap > em						{position:absolute; left:0; top:50%; transform:translateY(-50%); font-size:17px; font-weight:600;}
.data-input > li.point-wrap > button				{position:absolute; right:0; top:0; height:100%; width:140px; color:#333; border:1px solid #eee; background-color:#fff; font-size:13px; font-family:"PretendardM";}
.data-input > li.point-wrap.starDay > input,
.data-input > li.point-wrap.nextStarDay > input	,
.data-input > li.point-wrap.abled > input				{color:#aaa;}
.data-input > li.point-wrap.starDay + .desc				{font-size:13px;}
.data-input > li.point-wrap.coupon > input				{padding-left:0; text-align:left;}
.data-input > li.point-wrap.coupon + .desc				{font-size:13px; color:#aaa; padding-right:157px; line-height:1.4; margin-top:6px;}
.data-input > li.point-wrap.certificaNum								{padding-right:230px;}
.data-input > li.point-wrap.certificaNum > input				{text-align:left; padding-left:0;}
.data-input > li.point-wrap.certificaNum > em					{left:inherit; right:157px; color:#64b1ca; font-weight:normal; font-family:"MontserratM"; font-size:22px;}
.data-input > li.point-wrap.hasW100btn					{padding-right:117px;}
.data-input > li.point-wrap.hasW100btn > button				{width:100px;}
.data-input > li.point-wrap.hasNobtn							{padding-right:0;}

.data-input > li.hasCheckMsg										{padding-right:157px; position:relative;}
.data-input > li.hasCheckMsg > div								{position:absolute; right:0; top:7px; width:145px; color:#eb4c57; font-size:13px; min-height:40px; line-height:1.4; font-family:"MontserratM","PretendardM";}
.data-input > li.hasCheckMsg > div	 > em						{color:#64b2cb;}
.data-input > li.hasCheckMsg > div	 > span					{display:block; color:#333; line-height:1.4;}



/* Layer View */
.layerView											{position:fixed; top:0; left:0; z-index:-1; width:100%; height:100%; opacity:0; transition:all .2s ease-out;}
.layerView:before									{content:""; position:absolute; top:0; left:0; z-index:1; width:100%; height:100%; background-color:rgba(0,0,0,.2);}
.layerView > a										{position:fixed; top:0; bottom:0; left:0; right:0; z-index:1; text-indent:-9999px; background-color:transparent; cursor:default;}
.layerView .layer-body								{position:absolute; top:30%; left:50%; z-index:9999; background-color:#fff; /* border-radius:15px; box-shadow:0 6px 48px 0 rgb(30,40,58,.2); */ box-shadow:0 3px 10px 0 rgba(30,40,58,.2); opacity:0; transform:translate(-50%,-50%); transition:all .2s ease-out; border-radius:4px;}
.layerView.on										{opacity:1; z-index:9998;}
.layerView.on .layer-body							{top:50%; opacity:1;}

.layer-container									{position:relative; padding:30px;}
.layer-container > a								{position:absolute; top:8px; right:7px; z-index:1; width:30px; height:30px; text-indent:-9999px;}
.layer-container > a:before,
.layer-container > a:after							{content:""; position:absolute; left:50%; margin-left:-1px; width:1px; height:25px; background-color:#000;}
.layer-container > a:before							{transform:rotate(45deg);}
.layer-container > a:after							{transform:rotate(-45deg);}
.layer-container > a.printer						{top:9px; right:50px; height:24px; width:24px; background:url('/images/icon/i_printer.png') no-repeat center; background-size:100% auto; opacity:.7;}
.layer-container > a.printer:before,
.layer-container > a.printer:after						{display:none;}
.layer-container > a.fixed							{position:fixed; z-index:999;}

.layer-container > em								{display:flex; flex-wrap:nowrap; height:50px; font-family:'','',sans-serif; font-size:22px; color:#000;}
.layer-container > em.alignCenter				{justify-content:center;}
.layer-container > button							{margin:20px auto;}
.layer-container > button:last-child							{margin:30px auto 10px;}
.layer-container > button,
.layer-container .plural-button button				{display:block; width:180px; height:50px; font-family:''; font-size:17px; color:#fff; background-color:#039be6; border-radius:25px; box-shadow:0 1px 5px 0 rgba(0,0,0,.4); transition:all .2s;}
.layer-container > button:hover,
.layer-container .plural-button button:hover		{box-shadow:0 5px 10px 0 rgba(0,0,0,.2);}
.layer-container .plural-button						{display:flex; flex-wrap:nowrap; justify-content:center; margin:30px 0 10px;}
.layer-container .plural-button button				{margin:0 5px;}
.layer-container .plural-button button:last-child	{background-color:#444;}

.layer-container .attachedFile-wrap ul				{display:flex; flex-wrap:wrap; padding:15px 0; margin:0 -4px;}
.layer-container .attachedFile-wrap:nth-last-child(2) ul		{padding:15px 0 0;}
.layer-container .attachedFile-wrap ul li			{border:1px solid #d6d6d6; margin:5px 4px; height:100px; width:100px; position:relative;}
.layer-container .attachedFile-wrap ul li > p			{position:absolute; top:0; left:0; width:100%; height:100%; background-position:center; background-repeat:no-repeat; background-size:cover; cursor:pointer;}
.layer-container .attachedFile-wrap ul li > a							{position:absolute; top:0; right:0; width:20px; height:20px; text-indent:-9999px; background-color:rgba(0,0,0,.5); display:none;}
.layer-container .attachedFile-wrap ul li > a:before,
.layer-container .attachedFile-wrap ul li > a:after						{content:""; position:absolute; top:50%; left:50%; width:12px; height:1px; background-color:#fff;}
.layer-container .attachedFile-wrap ul li > a:before						{transform:translate(-50%, -50%) rotate(45deg);}
.layer-container .attachedFile-wrap ul li > a:after							{transform:translate(-50%, -50%) rotate(-45deg);}
.layer-container .attachedFile-wrap ul li.on > a								{display:block;}
.layer-container .attachedFile-wrap ul li > .video-wrap				{position:absolute; top:0; left:0; width:100%; height:100%;}
.layer-container .attachedFile-wrap ul li > .video-wrap.hasViewBtn > a						{position:absolute; left:0; top:0; width:100%; height:100%; text-indent:-9999px; z-index:1;}

.layer-container.noPadding						{padding:0;}

.layer-container.beFlex-col						{display:flex; flex-direction:column; position:fixed; top:0; left:0; width:100%; height:100%;}
.layer-container.beFlex-col .popup-wrap				{height:100%;}
.layer-container.beFlex-col .popup-wrap .conts			{height:calc(100% - 55px); padding:0 15px;}
.layer-container.beFlex-col .popup-wrap .conts .statement				{height:calc(100% - 15px);}

.popup-wrap								{min-width:400px;}
.popup-wrap:only-child					{position:relative; margin:0 auto;}
.popup-wrap > h2						{cursor:move;font-weight:normal; height:40px; font-family:"PretendardB"; font-size:14px; color:#26282C; padding:13px 15px; border-bottom:1px solid #D9DADC; margin-bottom:10px;}
.popup-wrap > h2 > small				{color:#1825CF; padding:0 10px;}
.popup-wrap > h2 + div			{padding:0 15px;}
.popup-wrap .conts > em						{font-size:12px; font-family:"PretendardSB"; display:block;}
.popup-wrap .conts > em + div			{margin-top:8px;}
.popup-wrap .conts > div + div			{margin-top:15px;} 
.popup-wrap .conts > div + em			{margin-top:20px;}
.popup-wrap .conts > .filter-wrap > dl.search-date > dt				{width:80px;}
.popup-wrap .conts > .filter-wrap + .filter-wrap				{margin-top:0; border-top:0;}
.popup-wrap .conts > .filter-wrap + .hasSmartEditor												{margin-top:-1px;}
.popup-wrap .conts > .hasRightBtn,
.popup-wrap .conts > .noti-txts						{margin-top:20px;}
.popup-wrap .conts + .desc				{text-align:center; margin-top:20px; color:#26282C;}
.popup-wrap .conts:last-child				{padding-bottom:15px;}
.popup-wrap .message					{background-color:#FAFAFB; padding:11px 14px; border-radius:4px; font-family:"PretendardM";}
.popup-wrap .message > em				{font-size:12px; color:#26282C; position:relative; padding-left:19px; display:block;}
.popup-wrap .message > em:after				{content:""; position:absolute; left:0; top:50%; margin-top:-6px; height:13px; width:13px; background:url('../../images/icon/jd_icon_img.png') no-repeat -24px -76px;}
.popup-wrap .message + .wrap-checkbox > label				{padding-left:20px;}
.popup-wrap .sample						{position:relative;}
.popup-wrap .sample:after				{content:"리얼그리드"; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); font-size:50px; color:#ddd;}
.popup-wrap .sample .table-list					{overflow:auto;}

.popup-wrap > div > font								{font-size:17px; color:#aaa;}
.popup-wrap > div > font + .boxList-item				{margin-top:11px;}
.popup-wrap > div > hr						{margin:20px 0; border:0; height:1px; background-color:#aaa;}

.popup-wrap .btn-wrap						{text-align:center;}
.popup-wrap > .btn-wrap:last-child				{padding:20px 10px;}
.popup-wrap .btn-wrap > button				{height:30px; width:120px; border:1px solid #D9DADC; background-color:#fff; color:#000; /* border-radius:4px; */}
.popup-wrap .btn-wrap > button.mBtn					{background-color:#21409a; color:#fff; border-color:#21409a;}
.popup-wrap .btn-wrap > button.gBtn					{background-color:#eee; border-color:#D9DADC; color:#333;}
.popup-wrap .btn-wrap > button.search					{background-color:#ea5b0a; border-color:#ea5b0a; color:#fff;}
.popup-wrap .btn-wrap > button.reset					{background-color:#fff; border-color:#bbb; color:#333;}
/* .popup-wrap .btn-wrap:last-child > button					{margin:0 4px;} */
.popup-wrap .btn-wrap.hasBtn2ea > button			{margin:0 2px;}
.popup-wrap .btn-wrap-right				{position:absolute; top:4px; right:3px; width:auto;}

.popup-wrap .btn-wrap.beFlex					{margin:0 30px; justify-content:center;}

.layerView .popup-wrap							{position:inherit;}
.layerView .popup-wrap > div > h2					{overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.layerView .popup-wrap > div > h2 + .desc				{font-size:17px; color:#aaa; line-height:1.4; margin-top:-14px;}
.layerView .popup-wrap > div > span														{display:none;}
.layerView .popup-wrap > div > span.on												{display:block;}
.layerView .popup-wrap > div > span .data-input:first-child				{margin-top:22px;}
.layerView .popup-wrap .select				{border-width:0 0 1px 0;}
.layerView .popup-wrap .conts.beFlex						{display:flex; flex-direction:column;}
.layerView .popup-wrap .conts .realGrid-wrap						{/* min-height:500px; */ min-height:380px;}

.layerView .popup-wrap .textConts-wrap,
.layerView .popup-wrap .optionSelect													{min-height:210px; max-height:400px; overflow-y:auto;}

.layerView .popup-wrap .filter-wrap .wrap-radio						{margin:0 14px;}
.layerView .popup-wrap .filter-wrap .wrap-radio + .wrap-radio				{margin-left:0;}

.layerView .popup-wrap table td .select					{border-width:1px;}


/* Layer Size */
.layer-refundDel,
.layer-studentRegSimp					{width:350px; min-width:inherit;}

.layer-passwordChg,
.layer-cellPhoneCert					{width:460px;}

.layer-classRecord,
.layer-classAssnReg,
.layer-classReg,
.layer-teacherStaffReg,
.layer-studentReg,
.layer-memSearch,
.layer-memReg					{width:600px;}

.layer-scheduleList,
.layer-classScheduleReg	{width:700px;}
.layer-classSearch				{width:1000px;}




/* 휴대폰인증 팝업 */
.layer-cellPhoneCert .table-write td.hasBtn > button					{background-color:#000; color:#fff;}


/* 공지 - 자료실 */
.reference-wrap,
.noti-wrap						{width:70%;}
.reference-wrap dl,
.noti-wrap dl						{border:1px solid #D9DADC;}
.reference-wrap dl dd,
.noti-wrap dl dd,
.reference-wrap dl dt,
.noti-wrap dl dt					{padding:15px;}
.reference-wrap dl dt,
.noti-wrap dl dt								{display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid #D9DADC;}
.reference-wrap dl dt > span,
.noti-wrap dl dt > span					{display:flex; align-items:center;}
.reference-wrap dl dt > span:last-child > em, 
.noti-wrap dl dt > span:last-child > em				{margin:0 30px;}
.reference-wrap dl dt strong,
.noti-wrap dl dt strong					{font:16px "PretendardB"; color:#000;}
.reference-wrap dl dd,
.noti-wrap dl dd								{font:14px/1.4 "PretendardR";}
.reference-wrap dl dd:first-of-type,
.noti-wrap dl dd:first-of-type					{min-height:250px;}

.reference-wrap dl dd > p,
.noti-wrap dl dd > p								{line-height:1.4;}

.reference-wrap dl + div,
.noti-wrap dl + div					{padding:15px; border-width:0 1px 1px 1px; border-style:solid; border-color:#D9DADC;}
.reference-wrap dl + div > em,
.noti-wrap dl + div > em				{color:#000; padding-left:17px; position:relative;}
.reference-wrap dl + div > em:after,
.noti-wrap dl + div > em:after					{content:""; position:absolute; left:2px; top:50%; transform:translateY(-50%); width:10px; height:10px; background:url('/img/icon/i_add.png') no-repeat center;}
.reference-wrap dl + div > em > b,
.noti-wrap dl + div > em > b						{color:red;}
.reference-wrap dl + div > em + div,
.noti-wrap dl + div > em + div					{border:1px solid #D9DADC; padding:15px; margin-top:8px;}
.reference-wrap dl + div > em + div .file-wrap,
.noti-wrap dl + div > em + div .file-wrap						{display:inline-flex; align-items:center; padding-left:25px; position:relative; color:#000;}
.reference-wrap dl + div > em + div .file-wrap:after,
.noti-wrap dl + div > em + div .file-wrap:after				{content:""; position:absolute; left:0; top:50%; transform:translateY(-50%); width:14px; height:14px; background:url('/img/icon/i_download.png') no-repeat center; opacity:.6;}
.reference-wrap dl + div > em + div .file-wrap > small,
.noti-wrap dl + div > em + div .file-wrap > small				{margin-left:15px; color:#999;}

.table-wrap > .btn-wrap:last-child,
.noti-wrap .btn-wrap:last-child					{width:100%; text-align:center;}

.noti-wrap .btn-wrap:last-child > button				{margin:30px 0; font:16px "PretendardR"; padding:10px 40px;}

.table-wrap > .btn-wrap:last-child > button				{margin:30px 0; font:12px/1 "PretendardR"; height:30px; width:120px;}


/* 회원관리 */
.noW100 table					{width:auto;}
.noW100 ~ .btn-wrap.alignRight > button						{padding:5px 20px;}

div.alignRight + div					{margin-top:10px;}

.table-wrap + .btn-wrap.alignRight				{margin-top:0;}


/* 회원검색 팝업 */
.layer-memSearch .sticky-header				{max-height:332px;}


/* 주소검색 팝업 */
.layer-addressSearch .conts									{min-height:500px;}

.layer-addressSearch .conts.temp					{display:grid; place-items:center; background-color:transparent; margin:15px;}
.layer-addressSearch .conts.temp:after				{content:"다음검색"; display:block; font:40px "PretendardB"; color:Lavender;}


/* 권한관리 팝업 */
.layer-authMgmt .sticky-header				{max-height:302px;}


/* 수업검색 팝업 */
.layer-classSearch .sticky-header				{max-height:332px;}


/* 학생관리 */
.contents.rightFixed > div				{position:absolute; top:0; left:0; height:100%; width:100%; border-width:1px 0 0 1px; border-style:solid; border-color:#D9DADC;}

.studentsMgmt-detail					{padding:15px;}
.studentsMgmt-detail > .beFlex						{display:flex; align-items:center;}
.studentsMgmt-detail > .beFlex > a				{margin-left:auto; /* width:20px; height:30px; */ width:40px; height:40px; text-indent:-9999px; position:relative; border:1px solid #bbb;}
.studentsMgmt-detail > .beFlex > a:before,
.studentsMgmt-detail > .beFlex > a:after							{content:""; position:absolute; left:50%;  top:50%; width:1px; height:25px; background-color:#000;}
.studentsMgmt-detail > .beFlex > a:before							{transform:translate(-50%, -50%) rotate(45deg);}
.studentsMgmt-detail > .beFlex > a:after							{transform:translate(-50%, -50%) rotate(-45deg);}

.studentsMgmt-detail .tabBtn-wrap				{display:flex; align-items:stretch; height:28px;}
.studentsMgmt-detail .tabBtn-wrap > button					{padding:0 10px; width:90px; position:relative; background-color:#f0f0f0; transition:.2s;}
.studentsMgmt-detail .tabBtn-wrap > button:before				{content:""; position:absolute; left:100%; bottom:0; height:0; width:0; border-bottom:28px solid #f0f0f0; border-right:28px solid transparent; transition:.2s;}
.studentsMgmt-detail .tabBtn-wrap > button + button				{margin-left:13px;}
.studentsMgmt-detail .tabBtn-wrap > button.on			{background-color:#000; color:#fff;}
.studentsMgmt-detail .tabBtn-wrap > button.on:before				{border-bottom-color:#000;}

.studentsMgmt-detail .conts-wrap														{/* margin-top:20px; */ margin-top:10px;}
.studentsMgmt-detail .conts-wrap .btn-wrap > button				{padding:4px 15px;}
.studentsMgmt-detail .conts-wrap .table-list + .btn-wrap.alignRight				{margin-top:20px;}

.studentsMgmt-detail .conts-wrap > div							{display:flex; flex-direction:column;}
.studentsMgmt-detail .conts-wrap > div:first-of-type .table-list.sticky-header				{height:392px;}
.studentsMgmt-detail .conts-wrap > div:last-of-type .table-list.sticky-header				{height:560px;}

.studentsMgmt-detail .detail-view					{position:relative;}
.studentsMgmt-detail .detail-view > em		{position:absolute; bottom:calc(100% + 5px); padding:7px 15px; background-color:#f6f6f6; border:1px solid #D9DADC; font-family:"PretendardSB";}
.studentsMgmt-detail .detail-view > div			{padding:15px; border:1px solid #D9DADC; height:150px; overflow-y:auto; font-size:14px;}

.studentsMgmt-detail.beFlex-col .conts-wrap.beFlex-col,
.studentsMgmt-detail.beFlex-col						{display:flex; flex-direction:column;}
.studentsMgmt-detail.beFlex-col .conts-wrap					{flex:1 1 0;}

.studentsMgmt-detail.beFlex-col .conts-wrap.beFlex-col > div					{height:100%;}
.studentsMgmt-detail.beFlex-col .conts-wrap.beFlex-col .table-list					{flex:0 0 60%;}
.studentsMgmt-detail.beFlex-col .conts-wrap.beFlex-col > div:last-child .table-list					{flex:0 0 53%;}


/* 수업스케줄 */
.fixed-beFlex .contents .calendar-wrap					{flex:1 1 0; z-index:1;}
.thisDate-wrap + .calendar-form				{margin-top:15px;}

.calendar-wrap					{}
.calendar-wrap .thisDate-wrap					{display:flex;}
.calendar-wrap .thisDate-wrap > span					{margin:0 auto; display:flex; align-items:center; position:relative;}
.calendar-wrap .thisDate-wrap > span > em					{font:24px "PretendardB"; margin:0 20px; white-space:nowrap; flex:1 1 0;}
.calendar-wrap .thisDate-wrap > span > a						{font:40px "PretendardR"; flex:0 0 30px; text-align:center; padding-bottom:3px;}
.calendar-wrap .thisDate-wrap > span > button				{position:absolute; left:calc(100% + 50px); top:50%; transform:translateY(-50%); white-space:nowrap; background-color:#21409a; color:#fff; padding:0 12px; height:26px; border-radius:8px;}

.calendar-form.beFlex-col,
.calendar-wrap.beFlex-col					{display:flex; flex-direction:column; background-color:#fff;}
.calendar-form.beFlex-col > div,
.calendar-wrap.beFlex-col .calendar-form				{flex:1 1 0;}

.calendar-form								{border-width:1px 1px 1px 1px; border-style:solid; border-color:#D9DADC;}
/* .calendar-form > div						{display:grid; grid-template-columns:repeat(7, 1fr); grid-template-rows:repeat(5, 20%);} */
.calendar-form > div						{display:grid; grid-template-columns:repeat(7, 1fr); grid-auto-rows:1fr;}
.calendar-form > div > span				{padding:7px; border-style:solid; border-color:#D9DADC; border-width:0 0 1px 0; position:relative;}
.calendar-form > div > span > em					{font:14px "PretendardSB"; color:#000;}
.calendar-form > div > span > a						{position:absolute; right:0; top:0; display:block; width:30px; height:30px; text-indent:-9999px;}
.calendar-form > div > span > a:before,
.calendar-form > div > span > a:after				{content:""; position:absolute; top:50%; left:50%; width:2px; height:11px; background-color:#ccc; transition:.2s;}
.calendar-form > div > span > a:before					{transform:translate(-50%, -50%);}
.calendar-form > div > span > a:after					{transform:translate(-50%, -50%) rotate(90deg);}
.calendar-form > div > span > a:hover:before,
.calendar-form > div > span > a:hover:after					{background-color:#666;}

.calendar-form > div > span > ul						{font-size:13px; margin:5px 0 0;}
.calendar-form > div > span > ul li					{line-height:1.3; cursor:pointer;}
.calendar-form > div > span > ul li + li					{margin-top:3px;}
.calendar-form > div > span + span				{border-left-width:1px;}	
.calendar-form > div > span:nth-child(7n + 1)				{border-left:0;}
.calendar-form > div > span.holyday > em,
.calendar-form > div > span:nth-child(7n) > em,
.calendar-form > div > span:nth-child(7n + 1) > em				{color:red;}

.calendar-form > div.hasSpan-beFlexCol				{overflow-y:scroll;}
.calendar-form > div.hasSpan-beFlexCol > span					{display:flex; flex-direction:column;}
/* .calendar-form > div.hasSpan-beFlexCol > span > ul				{flex:1 1 0; overflow-y:auto;} */
.calendar-form > div.hasSpan-beFlexCol > span > ul				{}

.calendar-form > div > span.today						{background-color: rgba(208,228,241,.5);}
.calendar-form > div > span.off > em				{font-family:"PretendardR"; color:#aaa;}

.calendar-form .week							{grid-template-rows:repeat(1, 1fr); background-image: linear-gradient(#ffffff, #dbe6eb);}
.calendar-form .week > span				{text-align:center; color:#004164; font-family: "PretendardM"; padding:5px;}

.calendar-form.beFlex-col .week				{flex:none;}

.contents > div + .schedule-detail				{margin-top:0;}
.schedule-detail							{position:absolute; right:400px; bottom:0; width:400px; height:calc(100% - 119px); transition:.2s; /* opacity:0; */ z-index:0;}
.schedule-detail > div				{border:1px solid #D9DADC; position:absolute; left:0; top:0; width:calc(100% - 10px); height:100%; margin-left:10px; flex-direction:column; display:flex; /* z-index:-999; */}

.schedule-detail .title-bar				{height:40px; flex:0 0 40px; padding:0 5px 0 15px; display:flex; align-items:center; border-bottom:1px solid #D9DADC;}
.schedule-detail .title-bar > em				{font:14px "PretendardB";}
.schedule-detail .title-bar	 > a					{margin-left:auto; text-indent:-9999px; height:40px; flex:0 0 40px; position:relative;}
/* .calendar-form > div > span > a						{position:absolute; right:0; top:0; display:block; width:30px; height:30px; text-indent:-9999px;} */
.schedule-detail .title-bar > a:before,
.schedule-detail .title-bar > a:after									{content:""; position:absolute; left:50%;  top:50%; width:1px; height:25px; background-color:#000;}
.schedule-detail .title-bar > a:before							{transform:translate(-50%, -50%) rotate(45deg);}
.schedule-detail .title-bar > a:after							{transform:translate(-50%, -50%) rotate(-45deg);}

.schedule-detail .contsWrap																		{flex:1 1 0; padding:15px; overflow-y:auto;}
.schedule-detail .contsWrap .btn-wrap:first-child > button				{padding:5px 20px; position:relative; top:-5px;}
.schedule-detail .contsWrap > em															{font:13px "PretendardSB"; color:#000; margin-bottom:7px; display:block;}
.schedule-detail .contsWrap > div + em												{margin-top:17px;}
.schedule-detail .contsWrap > div:first-child + em							{margin-top:0;}
.schedule-detail .contsWrap .table-list													{border:1px solid #D9DADC;}


.schedule-detail.on					{right:0; /* width:400px; */ /* opacity:1; */  /* z-index:0; */}
.schedule-detail.on > div					{/* display:flex; */ /* z-index:1; */}


/* 알림장 */
.moveItemTable-wrap					{display:flex; align-items:stretch;}
.moveItemTable-wrap > div					{flex:1 1 0;}
.moveItemTable-wrap > div > p						{font:14px "PretendardSB"; margin:10px 0;}
.moveItemTable-wrap > div .table-list.sticky-header				{height:332px;}
.moveItemTable-wrap .btn-wrap					{flex:0 0 80px; margin:36px 30px 0; display:flex; flex-direction:column; justify-content:space-evenly;}
.moveItemTable-wrap .btn-wrap > button					{width:100%; height:30px;}


/* 비밀번호 변경 */
.fixed-beFlex .contents .passwordChg						{margin:auto auto; position:relative; /* top:-38px; */ max-width:377px;}

.fixed-beFlex .contents .passwordChg > p									{font:13px "PretendardM"; color:#232e7c; margin:12px 0;}
.fixed-beFlex .contents .passwordChg .btn-wrap						{text-align:center;}
.fixed-beFlex .contents .passwordChg .btn-wrap > button				{margin:25px 0; height:30px; width:120px;}



/* 프로그램 관리 */
.programMgmt-wrap.half					{width:50%;}

.programMgmt-wrap .btn-wrap:first-child > button					{padding:5px 20px;}

.programMgmt-wrap > div + div						{margin-top:20px;}
.programMgmt-wrap .alignRight + div				{margin-top:10px;} 

.programMgmt-wrap + .table-wrap .table-list.sticky-header					{height:483px;}