@charset "utf-8";

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

/* Type */
td, th, li. dt, dd, div, span, p, a {margin:0; padding:0;}

html {height:100%; font-size:10px;}
body {height:auto; margin:0; padding:0; scroll 0 0 transparent; font-family:'NotoKrR','RobotoR', tahoma sans-serif; font-size:12px; color:#333; background-color:#f5f5f5;}

img, fieldset				{margin:0; padding:0; border:0; font-style:normal; line-height:1;}
button {border:none; vertical-align:middle;}
hr, button img{display:none;}
ul, ol, li, p, span{list-style:none; margin:0; padding:0;}
dl, dd{list-style:none; margin:0; padding:0;}

* {-webkit-text-size-adjust:none;}/* 폰트 자동 확대 방지 */

a {outline:none; color:#333; text-decoration:none; select-dummy:expression(this.hideFocus=true);}
a:hover {text-decoration:none; color:#333;}
a:active, a:focus{text-decoration:none; color:#333;}

textarea {border:#c9ccdb 1px solid; overflow:auto;}

table {border-collapse:collapse; border:0px; padding:0px;}
th				{vertical-align:middle; font-size:12px; font-family:'RobotoR','NotoKrR',sans-serif;}
td				{vertical-align:middle; font-size:12px; font-family:'RobotoM','NotoKrM',sans-serif;}
caption {display:none;}
legend {position:absolute; top:0; left:0; width:0; height:0; overflow:hidden; visibility:hidden; font-size:0; line-height:0;} /* For Screen Reader */ 
button, label {padding:0; border:none; vertical-align:middle; font-family:'RobotoR','NotoKrR',sans-serif; outline:none; cursor:pointer;}
input,textarea {font-family:'RobotoM','NotoKrM','dotum'; vertical-align:middle;}
select				{display:inline-block; vertical-align:middle; margin:0; padding:0; width:100%; height:100%; font-family:'RobotoR','NotoKrR',sans-serif; font-size:12px; color:#000; border:1px solid #999; background-color:#fff;}

input[type="text"], input[type="password"] {
	padding:0 5px;
	height:26px;
	font-family:'RobotoM','NotoKrM',sans-serif;
	font-size:12px;
	color:#000;
	border:1px solid #999;
	vertical-align:middle;
}
input[type="radio"], input[type="checkbox"] {
	-webkit-appearance:radio;
	box-sizing border-box;
	background:none !important;
	border:none !important;
	cursor:pointer;
	vertical-align:middle;
	margin:0;
	padding:0;
}
input[type="radio"]:focus, input[type="checkbox"]:focus {
	border:0 !important;
	border-color:none;
	-webkit-box-shadow:none;
	-moz-box-shadow:none;
	box-shadow:none;
	-webkit-transition:none;
	-moz-transition:none;
	-o-transition:none;
	transition:none;
}
button[disabled] {
	background: #eee;
	border: 1px #eee solid;
}
input[readonly] {
	background-color: #fffce1;
}
input::-webkit-input-placeholder	{font-family:'RobotoR','NotoKrR',sans-serif; color:#ddd;}
input:-ms-input-placeholder			{font-family:'RobotoR','NotoKrR',sans-serif; color:#ddd;}
input::-moz-placeholder				{font-family:'RobotoR','NotoKrR',sans-serif; color:#ddd;}
input:-moz-placeholder				{font-family:'RobotoR','NotoKrR',sans-serif; color:#ddd;}

textarea::-webkit-input-placeholder	{font-family:'RobotoR','NotoKrR',sans-serif; color:#ddd;}
textarea:-ms-input-placeholder		{font-family:'RobotoR','NotoKrR',sans-serif; color:#ddd;}
textarea::-moz-placeholder			{font-family:'RobotoR','NotoKrR',sans-serif; color:#ddd;}
textarea:-moz-placeholder			{font-family:'RobotoR','NotoKrR',sans-serif; color:#ddd;}

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


h1 {margin:0; padding:0; font-size:2.4rem; _font-family:'RobotoR','NotoKrR','dotum'; color:#050505; font-weight:bold;}
h5 {margin:5px 0 15px; padding:0; font-size:24px; font-weight:bold; color:#000; text-align:center;}
h6 {margin:0 0 5px; padding:0; font-size:13px; font-weight:bold; color:#000;}


.w60px		{width:60px !important;}
.w80px		{width:80px !important;}
.w100px		{width:100px !important;}
.w120px		{width:120px !important;}
.w150px		{width:150px !important;}
.w200px		{width:200px !important;}
.w250px		{width:250px !important;}
.w300px		{width:300px !important;}
.w350px		{width:350px !important;}
.w400px		{width:400px !important;}
.w450px		{width:450px !important;}
.w500px		{width:500px !important;}


.w20per		{width:20% !important;}
.w50per		{width:50% !important;}
.w80per		{width:80% !important;}
.w100per	{width:100% !important;}

.h100per	{height:100% !important;}

.mt10		{margin-top: 10px !important;}
.mt20		{margin-top: 20px !important;}
.mt38		{margin-top: 38px !important;}
.mb10		{margin-bottom: 10px !important;}
.mb20		{margin-bottom: 20px !important;}

.tac		{text-align:center !important;}
.tal		{text-align:left !important;}
.tar		{text-align:right !important;}

.container				{position:relative; margin:0; padding-top:73px; width:auto; height:auto; overflow:hidden;}
.container:after		{content:""; display:block; float:none; clear:both;}


.wrap					{position:relative; margin:0; padding:0 30px 30px 30px; width:auto; min-width:1080px; height:100%; -webkit-overflow-scrolling:touch;}


.table-title > h1								{color:#000; } 

.table-title + .divide-tables > .divide-tables_left > .table-title,
.table-title + .divide-tables > .divide-tables_right > .table-title				{padding-top:0;}
.table-title								{position:relative; padding:12px 0; width:auto;  /* border-bottom:1px solid #ccc; */} 
.table-title > .btn-position			{position:absolute; top:50%; right:0; transform:translateY(-50%); margin:0; margin-top:-4px;}
.table-title.noTitle						{padding:8px 0;}
.table-title > b				{position:absolute; top:50%; right:0; transform:translateY(-50%); color:#666; font-size:11px; font-weight:normal; font-family:'NotoKrM';}
.table-title > b > i	,
.sub-title > h3 > i					{position:relative; display:inline-block; height:10px; width:25px;}
.table-title > b > i:after,
.sub-title > h3 > i:after		{content:""; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%) rotate(-135deg); width:4px; height:7px; border-top:2px solid red; border-left:2px solid red;}

/* Sub Title */
.sub-title									{display:block; position:relative; margin:0; /* padding:0; */ width:auto; height:auto; font-size:11.5px; font-weight:bold; color:#333; padding:12px 0; margin-top:16px;}
.sub-title p								{position:absolute; bottom:5px; right:0; z-index:10;}
.sub-title > h3								{font-size:2rem; margin:0;}
.sub-title > h3 > i							{height:13px;}
.sub-title > .componentRight				{position:absolute; top:50%; right:0; transform:translateY(-50%);}
.sub-title > .componentLeft				{position:absolute; top:50%; left:0; transform:translateY(-50%);}
.sub-title + div							{margin-top:5px;}
.sub-title.noMarginTop						{margin-top:0;}
.sub-title.hasTabBtns								{padding:4px 0;}
.sub-title .total							{margin-top: 30px;}

/* Table Write */
.table-write								{margin-bottom:11px; padding:0; width:auto; height:auto; position:relative;}
.table-write table							{margin:0; padding:0; width:100%; height:auto;}
.table-write table th,
.table-write table td						{padding:5px 10px; border:1px solid #ccc; text-align:left; height:28px;}
.table-write table th						{padding-left:2%; color:#222; background-color:#e5e5e5 !important;}
.table-write table td						{background-color:#fff; line-height:16px;}
.table-write table th span					{display:inline-block; margin-left:3px; color:#ff0000;}
.table-write table th > i						{position:relative; margin-left:10px;}
.table-write table th > i:after			{content:""; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%) rotate(-135deg); width:4px; height:7px; border-top:2px solid red; border-left:2px solid red; margin-top:-2px;}
.table-write table td textarea				{padding:4px; width:98.5%; height:60px; color:#454545; border:1px solid #999;}
.table-write table td textarea.memo			{padding:4px; width:98.5%; height:150px; color:#454545; border:1px solid #999;}
.table-write table td textarea.noresize		{padding:4px; width:98.5%; height:200px; color:#454545; resize:none;}
.table-write table td input					{width:95%;}
.table-write table td input:disabled			{background-color:#eaeaea; color:#aaa;}
.table-write table td select				{width:99%;}
.table-write table td span					{padding:0 0; height:100%;}
.table-write table td span.padding			{padding:3px 0;}
.table-write table td span.inline			{display:inline-block;}
.table-write table td input[type="radio"],
.table-write table td input[type="checkbox"]{width:auto;}
.table-write table td a						{display:inline-block; margin-right:20px; text-decoration:underline; color:#1986b2;}
.table-write table th .star					{color:#ff0000;}
.table-write table th .star2				{color:#0000ff;}
.table-write table td span.company			{display:inline-block; width:180px;}
.table-write table th.auto					{color:#0000ff;}
.table-write table th:only-child		{padding-left:16%; border-right:0;}

.table-write table td.editor a				{display:inline-block; margin-right:0px; color:#000;}
.table-write table td.editor span			{display:inline; padding:3px 0;}

.table-write table td .searchBtn			{position:relative;}
.table-write table td .searchBtn > span		{margin-right:60px;}
.table-write table td .searchBtn > span > input	{width:100%; height:28px; box-sizing:border-box; -moz-box-sizing:border-box;}
.table-write table td .searchBtn > button	{position:absolute; top:0; right:0; z-index:10; display:block; width:55px; height:28px;}

.table-write table td .searchBtn2			{position:relative;}
.table-write table td .searchBtn2 > span	{display:inline-block; margin-right:5px}
.table-write table td .searchBtn2 > span > input	{width:150px; height:28px; box-sizing:border-box; -moz-box-sizing:border-box;}
/*.table-write table td .searchBtn2 > button	{position:absolute; top:0; right:0; z-index:10; display:block; width:55px; height:28px;}*/
.table-write table td .searchBtn2 > button	{display:inline-block; padding:0 15px; width:55px; height:28px;}

.table-write table td .fileDown						{padding-right:30px; position:relative; cursor:pointer; margin:5px 20px 5px 0;}
.table-write table td .fileDown:before			{content:""; position:absolute; top:50%; right:0; transform:translateY(-50%); width:20px; height:20px; background:url('/os/img/img-down.png') no-repeat center; border-radius:2px;}

.table-write > p							{font-weight:normal; font-family:'NotoKrM'; margin:-5px 0 5px; font-size:13px;}
.table-write > button							{position:absolute; bottom:7px; right:7px; z-index:1;}

.table-write table td > button#btnFileAdd									{margin-right:5px !important;}
.table-write table td > button#btnFileAdd:only-child				{margin-bottom:0 !important;}

.table-write .table-list table th,
.table-write .table-list table td					{height:auto; padding:5px 10px; text-align:center;}
.table-write .table-list table td					{height:28px;}
.table-write table td button								{position:relative;}
.table-write table td button > input				{opacity:0; position:absolute; width:100%; height:100%; cursor:pointer; top:0; left:0; right:0; bottom:0; z-index:1;}
.table-write table td > .btn-style02			{line-height:28px;}


/* Table List */
.table-list									{position:relative; margin-bottom:11px; padding:0; width:auto;}
.table-list table							{margin:0; padding:0; width:100%; height:auto; text-align:center;}
.table-list table th,
.table-list table td						{padding:5px 10px; /* height:24px; */ border:1px solid #ccc; vertical-align: inherit;}
.table-list table th						{color:#222; background-color:#e5e5e5 !important;}
/* .table-list table th						{color:#fff; background-color:#27509b !important; font-weight:normal;} */
.table-list table td						{background-color:#fff; line-height:16px; height:28px;}
/* .table-list table td						{background-color:#fff; line-height:16px;} */
.table-list table td.link					{padding-left:15px; text-align:left; overflow:hidden;}
.table-list table td.link input[type="checkbox"]	{margin-right:5px;}
.table-list table input						{text-align:center;}
.table-list table td textarea				{padding:4px; width:98.5%; color:#454545; border:1px solid #999;}
.table-list table .right-inp				{width:80%; text-align:right;}
.table-list table tr.color-bg01 th			{color:#fff; background-color:#0f6aaf !important;}
.table-list table tr.color-bg02 th			{color:#fff; background-color:#c41161 !important;}
.table-list table tr.mark td				{background-color:#fff9e6;}
.table-list table tr.send td				{background-color:#e6f1ff;}
.table-list table tr.send td strong			{color:#0000ff;}
.table-list table tr.no-send td				{background-color:#ffe6e6;}
.table-list table tr.no-send td strong		{color:#ff0000;}
.table-list table tr.shortfall td			{color:#e70000;}
.table-list table tr.tab-link				{cursor:pointer;}
.table-list table tr.tab-link:hover td		{background-color:#f8fae4;}
.table-list table td button					{display:inline-block; vertical-align:middle; margin:0; padding:0 5px; width:auto; font:12px/26px 'NotoKrM'; letter-spacing:-1px; cursor:pointer; text-align:center; border-radius:2px; -webkit-border-radius:2px; -moz-border-radius:2px; -o-border-radius:2px;}
.table-list table td a						{color:#333; cursor:pointer; text-decoration:underline;}
.table-list table td a:hover				{text-decoration:underline;}
.table-list table td a.on					{color:#0000ff;}
.table-list table td > span					{display:inline-block; margin-right:15px;}
.table-list table td > span:last-child		{margin:0;}
.table-list table td > em					{font-style:normal; display:inline-block; vertical-align:middle; margin-left:5px; text-align:left;}
.table-list table td dl						{margin:0; padding-top:3px; width:auto; height:auto; text-align:left;}
.table-list table td dl > dt				{margin:0; padding:0; width:auto; height:auto; font-size:14px; font-weight:bold; color:#101010;}
.table-list table td dl > dd				{margin:0; padding:0; width:auto; height:auto; font-size:11px; color:#8a8a8a;}
.table-list table td dl > dd > span			{display:inline-block; margin:0 2px; font-size:10px; color:#b7b7b7;}
.table-list table .detail-table				{}
.table-list table .detail-table th,
.table-list table .detail-table td			{padding:3px 5px; height:20px; border:1px solid #fff; background-color:#f9f9f9;}
.table-list table .detail-table th			{font-weight:normal; color:#fff; background-color:#ccc !important;}
.table-list table .detail-table th.outcolor	{background-color:#11c473 !important;}
.table-list table .detail-table td			{font-size:11px; color:#656565;}
.table-list table.td-left td				{text-align:left;}
.table-list table.tr-link td								{cursor:pointer;}
.table-list table.tr-link tr:hover	 td				{background-color:#fff2cc !important;color:#333 !important;}
.table-list table.tr-link tr.on td						{background-color:#FAF4C0 !important;color:#333 !important;font-weight:bold;}



/* Btn Style */
.btn-style01								{display:block; vertical-align:middle; margin:0; padding:0; width:120px; font:12px/35px 'NotoKrM'; cursor:pointer; text-align:center; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; -o-border-radius:3px;}
.btn-style02								{display:inline-block; vertical-align:middle; margin:0; padding:0 15px; width:auto; min-width:120px; font:12px/35px 'NotoKrM'; cursor:pointer; text-align:center; border-radius:2px; -webkit-border-radius:2px; -moz-border-radius:2px; -o-border-radius:2px;}
.btn-style03								{display:inline-block; vertical-align:middle; margin:0; padding:2px 8px 0; width:auto; min-width:60px; font:11px/18px 'NotoKrM'; cursor:pointer; text-align:center; border-radius:2px; -webkit-border-radius:2px; -moz-border-radius:2px; -o-border-radius:2px;}
.btn-style04								{display:inline-block; vertical-align:middle; margin:0; padding:0; width:80px !important; font:12px/28px 'NotoKrM' !important; cursor:pointer; text-align:center; border-radius:0 !important;}
.btn-style05								{display:inline-block; vertical-align:middle; margin:0; padding:0; width:40px !important; height:40px !important; font:12px/28px 'NotoKrM' !important; cursor:pointer; text-align:center; border-radius:0 !important;}
.btn-style06								{display:inline-block; vertical-align:middle; margin:0; padding:0; width:60px !important; height:30px;font:12px/34px 'NotoKrM'; cursor:pointer; text-align:center; border:1px solid #000; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; -o-border-radius:3px;}
.btn-style07								{display:block; vertical-align:middle; margin:0; padding:0; width:120px; font:12px/34px 'NotoKrM'; cursor:pointer; text-align:center; border:1px solid #000; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; -o-border-radius:3px;}
.btn-popup									{display:block; margin:-20px auto 0; padding:0; width:100px; font:12px/30px 'NotoKrM'; cursor:pointer; text-align:center; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; -o-border-radius:3px;}


/* Btn Color */
.btn-color01								{color:#fff; background-color:#27509b !important; border:1px solid #27509b;} /* 파랑색 : 저장, 권한설정 */
.btn-color02								{color:#000; background-color:#fff; border:1px solid #c0c0c0;}    /* 흰색바탕 검은 테두리 : 조회, 검색 */
.btn-color03								{color:#000; background-color:#fce500; border:1px solid #fce500;} /*노란색 : 목록 */
.btn-color04								{color:#fff; background-color:#baad73; border:1px solid #baad73;} /*갈색 : 선택 */
.btn-color05								{color:#505050; background-color:#ccc; border:1px solid #ccc;} /*회색 : 삭제 */
.btn-color06								{color:#fff; background-color:#0bb724!important; border:1px solid #0bb724;} /* 갈색 : 신규, 신규등록, 가격등록, 가격업로드 */
.btn-color07								{color:#000; background-color:rgba( 255, 255, 255, 0 ); border:0px; text-decoration:underline;}
.btn-color07.act						{color:#ff0000;}
.btn-color08								{color:#fff; background-color:#F35F17; border:1px solid #F35F17;}
.btn-color09								{color:#fff; background-color:#383e4b; border:1px solid #383e4b;}
.btn-color10								{color:#fff; background-color:#4742DB; border:1px solid #4742DB;}
.btn-color11								{color:#363636; background-color:#fff; border:1px solid #d5d5d5;}
.btn-color12								{color:#fff; background-color:#000; border:1px solid #fff;}
.btn-color13								{color:#000; background-color:#fff; border:1px solid #c0c0c0;} /* 흰색 */


/* Btn Position */
.btn-position								{margin:20px 0 40px; padding:0; width:auto; height:auto; text-align:center;}
.btn-position-right							{margin:10px 10px 10px 10px; padding:15px; width:auto; height:auto; text-align:right;}
.btn-position-left							{padding-bottom:15px; width:auto; height:auto; text-align:left;}
.btn-position button						{display:inline-block; margin:0 10px;}
.btn-position-right button					{display:inline-block; margin:10px 10px 10px 10px;}
.btn-position-left button					{display:inline-block; margin:10px 10px 10px 10px;}
.cart-position								{margin-top:10px; padding:0; width:auto; height:auto;}
.cart-position:after						{content:""; display:block; float:none; clear:both;}
.cart-position li							{float:left; margin:0; padding:0; width:50%; height:auto;}
.cart-position li span						{display:inline-block;}
.cart-position li.cp-right					{text-align:right;}




/* componentLeft */
.componentLeft dl				{margin:0 0 0 15px; margin-bottom:5px; display:-webkit-flex; display:flex; -webkit-align-items:center; align-items:center;}
.componentLeft dl:only-of-type				{margin:-10px 0 0 15px;}
.componentLeft dl dt			{margin:0 8px 0 0;}
.componentLeft dl dd > img			{margin:0;}
.componentLeft dl dd > img + button		{margin-left:7px !important;}
.componentLeft > span			{display:inline-block;}




/* paging */
.paging					{position:relative; margin-top:30px; height:auto; padding:0; text-align:center; display:block; clear:both;}
.paging a				{display:inline-block; vertical-align:middle; padding:6px 0; width:28px; border:1px solid #ddd; font-size:12px; color:#000; cursor:pointer;}
.pading a:hover			{color:#fff; border:1px solid #383e4b; background-color:#383e4b;}
.pading .pg_num			{font-family:'PT Sans', sans-serif; background-color:#fff;}
.pading .pg_num:hover	{color:#000; background-color:#fff; border:1px solid #383e4b;}
.paging .pg_btn			{font-family:'PT Sans Narrow', sans-serif; background-color:#ddd; letter-spacing:-1px;}
.paging .select			{color:#fff; border:1px solid #383e4b; background-color:#383e4b;}
.paging .select:hover	{color:#fff; background-color:#383e4b; cursor:default;}




/* datepick */
.datepick				{background: url('/images/icon/ico_calendar.png') 95% 50% no-repeat #fff;}


/* popup */
.popup-bg {
	background: rgba(0, 0, 0, 0.8);
	width: 100%;
	height: 100%;
	position: fixed;
	left: 0;
	top: 0;
	display: none;
}

.popup {
	position: fixed;
	background: #fff;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	display: none;
}

.popup .popup-title {
	position:relative;
	padding: 1rem 2rem 1rem 2rem;
	font-size: 2rem;
	font-weight:400;
}

.popup .popup-body {
	padding: 0 2rem 2rem 2rem;
	box-sizing: border-box;
	text-align: center;
	font-size: 20px;
}

.popup .popup-body .inner {
	max-width: 50rem;
	min-width: 25rem;
	font-size: 2rem;
	word-wrap: break-word;
}


.popup .popup-layer-title {
	position:relative;
	padding: 1rem 1rem 1rem 2rem;
	font-size: 2rem;
	font-weight:400;
}

.popup .popup-layer-body {
	padding: 0 2rem 2rem 2rem;
	box-sizing: border-box;
	text-align: center;
	font-size: 20px;
}

.popup .popup-btn {
	display: block;
	padding: 0 4rem 4rem 4rem;
	text-align: center;
	font-size: 0;
}


.btn-type01 {
	color: #000;
	background: #fff;
	border:1px solid #c0c0c0;
}

.btn-type02 {
	color: #fff;
	background: #000;
	border:1px solid #fff;
}


.btn-type01, .btn-type02 {
	font-weight: 600;
	height: 4rem;
	line-height: 4rem;
	font-size: 1.3rem;
	border-radius: 0.2rem;
	padding: 0 2rem;
	box-sizing: border-box;
}



.popup .popup-btn .btn-type01 + .btn-type02 {
	margin-left: 1.5rem;
}


.popup .popup-btn .btn-type01, .popup .popup-btn .btn-type02 {
	min-width: 17rem;
	height:6rem;
	line-height: 6rem;
	flex: 1;
	font-size: 1.6rem;
	display: inline-block;
}


.popup .popup-layer-btn {
	display: block;
	padding: 0 2rem 2rem 2rem;
	text-align: center;
	font-size: 0;
}


.popup .popup-layer-btn .btn-type01 + .btn-type02 {
	margin-left: 1.5rem;
}


.popup .popup-layer-btn .btn-type01, .popup .popup-layer-btn .btn-type02 {
	min-width: 10rem;
	height:5rem;
	line-height: 5rem;
	flex: 1;
	font-size: 1.6rem;
	display: inline-block;
}



.popup .close-btn {
    position: absolute;
    top: 2rem;
    border: none;
    width: 2rem;
    height: 2rem;
    display: block;
    font-size: 0px;
    text-indent: -9999rem;
    right: 2rem;
    z-index: 1;
    background: url('/images/icon/ico_popup_close.png') no-repeat center center;
    cursor: pointer;
}