@charset "utf-8";

h1,h2,h3,h4,h5,h6 { font-weight: 100; }
h1 { font-size: 30px; }
h2 { font-size: 24px; }
h3 { font-size: 16px; }
h4 { font-size: 14px; }
h5 { font-size: 12px; }
h6 { font-size: 10px; }
h3,h4,h5 { margin-top: 5px; }

table, div{margin: 0;padding: 0;}
ul, ol{margin: 0;padding: 0;}
li{list-style: none;}
p{margin: 0;padding: 0;}

a { cursor: pointer; }
a:link,a:visited,a:hover {color: #444; text-decoration: none; }


/* Controls *//* Controls */
.required_error{ border: 1px solid #ff0000 !important; }



/* 화면의 타이틀 및 화면 설명  */
/* .view_title_div { display: inline-block; width: 100%; height: 80px; padding: 0px 0px 25px 0px; text-align: left; } */
.view_title_div { display: inline-block; width: 100%; height: 40px; padding: 0px 0px; text-align: left;margin:10px 0; line-height: 35px; }

.view_title_div .view_title { display: inline-block; font-size: 24px; font-weight: 500; color: #333333; margin-right: 10px; }
.view_title_div .view_title.navigator { float: right; font-size: 16px; font-weight: 400; }
.view_title_div .view_sub_title { display: inline-block; font-size: 14px; font-weight: 400; color: #999999; margin-right: 10px; }

.modal-body .view_title_div { height: 60px; padding: 25px 0px 5px 0px; }
.modal-body .view_title_div .view_title { font-size: 18px; font-weight: 500; }
.modal-body .view_title_div .view_title.navigator { float: right; font-size: 16px; font-weight: 400; }

/* 검색바 및 검색 버튼/초기화 버튼 */
.search_div { width: 100%; display: inline-block; padding: 15px 0px 15px 0px; }
.search_div .search_contents_div { width: 100%; display: inline-block; padding: 0px 0px 0px 0px; }
.search_div .search_contents_div .search_btn_div { width: 100%; display: inline-block; padding: 0px 0px 0px 0px; text-align: right; }

.tab-pane .search_div { padding: 10px 0px 0px 0px; }

.click_btn{
	display: inline-block;
	width: 120px;
	height: 38px;
	line-height: 38px;
	background: #85898c;
	border: 0px solid #85898c;
	font-family: Dotum, Gulim, 'Malgun Gothic' !important;
	font-size: 14px;
	font-weight: bold;
	color: #ffffff;
	text-align: center; 
	cursor: pointer;	
}
.click_btn.blue{ background-color: #ad8767; }
.click_btn.red{ background-color: #d15353; }
.click_btn:nth-child(odd){ margin-right: 5px; }

.search_btn{
	display: inline-block;
	width: 90px;
	height: 38px;
	line-height: 38px;
	background: #85898c;
	border: 1px solid #85898c;
	font-family: Dotum, Gulim, 'Malgun Gothic' !important;
	font-size: 14px;
	font-weight: bold;
	color: #ffffff;
	text-align: center; 
	cursor: pointer;
	margin-right: 5px;
}
/* .search_btn:before{ content: url("../sooritopia/images/btn_icon/btn_icon_search.jpg"); margin: 0px 4px 0px 0px; vertical-align: middle;} */
.init_btn{
	display: inline-block;
	width: 90px;
	height: 38px;
	line-height: 38px;
	background: #ffffff;
	border: 1px solid #b0b0b0;
	font-family: Dotum, Gulim, 'Malgun Gothic' !important;
	font-size: 14px;
	font-weight: bold;
	color: #555555;
	text-align: center; 
	cursor: pointer;
}

.popup_search_btn {
    display: inline-block;
    width: 60px;
    height: 30px;
    line-height: 30px;
    background: #85898c;
    border: 1px solid #85898c;
    font-family: Dotum, Gulim, 'Malgun Gothic' !important;
    font-size: 13px;
    font-weight: bold;
    color: #ffffff;
    text-align: center;
    cursor: pointer;
    margin-right: 5px;
}

/* List Table 상단 건수 및 리스트 위 버튼, 필터 */
.list_top_div { width: 100%; display: inline-block; height: 55px; padding: 15px 0px 10px 0px; text-align: left;}
.list_top_div .list_top_div_listCount { font-family: Dotum, Gulim, 'Malgun Gothic' !important; color: #444444; font-size: 13px; margin-top: 10px; }
.list_top_div .list_top_div_listCount .listCount { color: #5693e7; font-size: 13px; }
.list_top_div .list_top_btn_div { display: inline-block; height: 30px; text-align: right; float: right; }
.list_top_div .list_top_btn_div .list_top_filter { display: inline-block; height: 30px; }
.list_top_div .list_top_btn_div > div:last-child { margin-right: 0px; }

.list_top_div .select_Project { display: inline-block; }
.list_top_div .select_Order { display: inline-block; }


.list_blue_btn{
	display: inline-block;
	width: 120px;
	height: 29px;
	line-height: 29px;
	background: #ad8767;
	font-family: Dotum, Gulim, 'Malgun Gothic' !important;
	font-size: 13px;
	font-weight: bold;
	color: #ffffff;
	text-align: center; 
	cursor: pointer;
	margin-right: 5px;
}
/* .list_blue_btn:before{ content: url("../sooritopia/images/btn_icon/btn_icon_plus.jpg"); margin: 0px 3px 0px 0px; vertical-align: middle;} */

.normal_blue_btn{
	display: inline-block;
	width: 120px;
	height: 29px;
	line-height: 29px;
	background: #ad8767;
	font-family: Dotum, Gulim, 'Malgun Gothic' !important;
	font-size: 13px;
	font-weight: bold;
	color: #ffffff;
	text-align: center; 
	cursor: pointer;
	margin-right: 5px;
}

.excel_btn{
	display: inline-block;
	width: 110px;
	height: 29px;
	line-height: 29px;
	background: #ffffff;
	font-family: Dotum, Gulim, 'Malgun Gothic' !important;
	font-size: 13px;
	font-weight: bold;
	color: #555555;
	text-align: center; 
	cursor: pointer;
/* 	border: 1px solid #b0b0b0; */
	border: 1px solid #cacaca;
	margin-right: 5px;
}
.excel_btn:before{ content: url("../sooritopia/images/btn_icon/btn_icon_excelexport.jpg"); margin: 0px 4px 0px 0px; vertical-align: middle;}




/* 게시판 페이지 (저장, 취소, 변경) 버튼 */
.board_save_btn{
	display: inline-block;
	width: 120px;
	height: 52px;
	line-height: 52px;
	background: #ad8767;
	border: 1px solid #ad8767;
	font-family: Dotum, Gulim, 'Malgun Gothic' !important;
	font-size: 14px;
	font-weight: bold;
	color: #ffffff;
	text-align: center; 
	cursor: pointer;
	margin-right: 5px;
}
.board_cancel_btn{
	display: inline-block;
	width: 120px;
	height: 52px;
	line-height: 52px;
	background: #ffffff;
	border: 1px solid #b0b0b0;
	font-family: Dotum, Gulim, 'Malgun Gothic' !important;
	font-size: 14px;
	font-weight: bold;
	color: #555555;
	text-align: center; 
	cursor: pointer;
	margin-right: 5px;
}
.board_cancel2_btn{
	display: inline-block;
	width: 120px;
	height: 52px;
	line-height: 52px;
	background: #85898c;
	border: 1px solid #85898c;
	font-family: Dotum, Gulim, 'Malgun Gothic' !important;
	font-size: 14px;
	font-weight: bold;
	color: #ffffff;
	text-align: center; 
	cursor: pointer;
	margin-right: 5px;
}
.board_edit_btn{
	display: inline-block;
	width: 120px;
	height: 52px;
	line-height: 52px;
	background: #ffffff;
	border: 1px solid #b0b0b0;
	font-family: Dotum, Gulim, 'Malgun Gothic' !important;
	font-size: 14px;
	font-weight: bold;
	color: #555555;
	text-align: center; 
	cursor: pointer;
	margin-right: 5px;
}
.board_delete_btn{
	display: inline-block;
	width: 120px;
	height: 52px;
	line-height: 52px;
	background: #4c4f54;
	border: 1px solid #b0b0b0;
	font-family: Dotum, Gulim, 'Malgun Gothic' !important;
	font-size: 14px;
	font-weight: bold;
	color: #ffffff;
	text-align: center; 
	cursor: pointer;
	margin-right: 5px;
}

.boardContentsAttachFile {
	display: inline-block;
	width: 7px;
	height: 13px;
	background: url("../sooritopia/images/common/icon_attach.png") no-repeat;
    vertical-align: middle;
    margin: 0px 10px 0px 10px;
}



/* Table *//* Table */
/* 기본 검색 폼 및 입력 폼 테이블 */
.table_input_form{
	width: 100%;
/*     border-top: 3px solid #6493d4; */
    border-top: 1px solid #ad8767;
    border-bottom: 1px solid #bbbbbb;
}
.table_input_form caption {
    display: none;
    padding-top: 0px;
    padding-bottom: 0px;
}
.table_input_form tr{
	border-bottom: 1px solid #dfdfdf;
}

.table_input_form tbody#listContainer > tr:hover{
	cursor: pointer;
	background: #fdefdc;
}


.table_input_form tbody#listContainer_tab-1 > tr:hover{
	cursor: pointer;
	background: #fdefdc;
}
.table_input_form tbody#listContainer_tab-2 > tr:hover{
	cursor: pointer;
	background: #fdefdc;
}

.table_input_form tbody#listContainer_tab-3 > tr:hover{
	cursor: pointer;
	background: #fdefdc;
}



.table_input_form tbody > tr:last-child {
	border-bottom: 1px solid #bbbbbb;
}
.table_input_form tfoot > tr:last-child {
	border-bottom: 1px solid #bbbbbb;
}

.table_input_form thead th{
	text-align: center !important;
	padding-left: 0px !important;
	padding-right: 0px !important;
}	
.table_input_form thead th.twoLine{
/* 	display: inline-block; */
/* 	width: 100%; */
	line-height: 18px;
}
.table_input_form thead th .nextLine{
	display: inline-block;
	width: 100%;
	line-height: 18px;
}	

.table_input_form th{
	font-family: Dotum, Gulim, 'Malgun Gothic' !important;
	/* font-size: 13px;  */
	font-size: 12px;
	font-weight: bold; 
	color: #444444;
	background-color: #f5f6f7;
	padding-left: 20px;
	text-align: left;
	line-height: 30px;
	padding-top:7px;
	padding-bottom:7px;
	border-right: 1px solid #dfdfdf;
}

.table_input_form td{
	font-family: Dotum, Gulim, 'Malgun Gothic' !important;
	/* font-size: 13px; */ 
	font-size: 12px; 
	font-weight: normal; 
	color: #444444;
   	line-height: 30px;	
/* 	line-height: 42px; */
    border-right: 1px solid #dfdfdf;
    padding: 3px 10px 3px 10px;
	text-align: left;
	border-right: 1px solid #dfdfdf;
}

.table_input_form tr th:last-child { border-right: none; }
.table_input_form tr td:last-child { border-right: none; }

.table_input_form.formStyle{
/* 	border-top: 2px solid #6493d4; */
	border-top: 1px solid #ad8767;
}
.table_input_form.formStyle tbody th{
	border-right: none;
}
.table_input_form.formStyle tbody td{
	padding: 5px 20px 5px 20px;
}

.table_input_form th.coloneTh{
    padding: 7px 10px 7px 20px;
    text-align: center;
}
.table_input_form th.font-reg{
	font-family: NotoKrR; 
}
.table_input_form th.requireValue{
/* 	color: #3b85c6; */
}
.table_input_form td > *{
	vertical-align: top;
}
.table_input_form td p{
	display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 90%;
	vertical-align: middle;
}

.table_input_form tbody td p{
	display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 90%;
	vertical-align: middle;
}
.table_input_form tbody td span{
	display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 90%;
    max-width: 250px; 
	vertical-align: middle;
}

.table_input_form tr.subList { display: none; }

/* 조회 결과 작은 폼 */
.table_input_form2 thead tr { line-height: 40px; }
.table_input_form2 th { border-right: 1px solid #eaeaea; text-align: center; padding: 0px 0px 0px 0px; }
.table_input_form2 td { border-right: 1px solid #eaeaea; text-align: center; padding: 0px 0px 0px 0px; }
.table_input_form2 tr { line-height: 30px; }
.table_input_form2 tr th:last-child { border-right: none; }
.table_input_form2 tr td:last-child { border-right: none; }
/* .table_input_form2 tbody.estimateLine tr td>select { border: none; } */
/* .table_input_form2 tbody.estimateLine tr td>input { border: none; } */


/* 검색 리스트 (일반형, 일반버튼형) */
.table_input_form3 tr { line-height: 45px; }
.table_input_form3 th { border-right: 1px solid #eaeaea; text-align: center; padding: 0px 0px; }
.table_input_form3 td { border-right: 1px solid #eaeaea; text-align: center; padding: 0px 0px; }
.table_input_form3 tr th:last-child { border-right: none; }
.table_input_form3 tr td:last-child { border-right: none; }

.table_input_form3 tr.subList { display: none; }
.table_input_form3 tr.subList { line-height: 30px; border: none; }
.table_input_form3 tr.subList th { background: #f2f2f2; }
.table_input_form3 tr.subList th.noColumn { background: #ffffff; border: none;}
.table_input_form3 tr.subList td.noColumn { background: #ffffff; border: none;}
.table_input_form3 tr.subList th:not(.noColumn) { border: 1px solid #eaeaea; }
.table_input_form3 tr.subList td:not(.noColumn) { border: 1px solid #eaeaea; }

/* 검색 리스트 (펼치기 리스트형) */
.table_input_form4 tr { border: none; border-top: 1px solid #eaeaea; border-bottom: 1px solid #eaeaea; line-height: 45px; }
.table_input_form4 th { border-bottom: 1px solid #eaeaea; border-right: 1px solid #eaeaea; text-align: center; padding: 0px 0px; }
.table_input_form4 td { border-bottom: 1px solid #eaeaea; border-right: 1px solid #eaeaea; text-align: center; padding: 0px 0px; }
.table_input_form4 tr th:last-child { border-right: none; }
.table_input_form4 tr td:last-child { border-right: none; }

.table_input_form4 tr.subList { display: none; }
.table_input_form4 tr.subList { line-height: 30px; border: none; }
.table_input_form4 tr.subList th { background: #f2f2f2; }
.table_input_form4 tr.subList th.noColumn { background: #ffffff; border: none;}
.table_input_form4 tr.subList td.noColumn { background: #ffffff; border: none;}
.table_input_form4 tr.subList th:not(.noColumn) { border: 1px solid #eaeaea; }
.table_input_form4 tr.subList td:not(.noColumn) { border: 1px solid #eaeaea; }

/* 서브 테이블 - 테두리 없음 */
.table_input_form5 { border-top: 1px solid #eaeaea; border-bottom: 1px solid #eaeaea; }
.table_input_form5 thead tr { line-height: 30px; }
.table_input_form5 th { border-right: 1px solid #eaeaea; padding: 0px 0px 0px 0px; }
.table_input_form5 td { border-right: 1px solid #eaeaea; text-align: center; padding: 0px 0px 0px 0px; }
.table_input_form5 tr { line-height: 30px; }
.table_input_form5 tr th:last-child { border-right: none; }
.table_input_form5 tr td:last-child { border-right: none; }


/* 검색 테이블 스타일(공통) */
.search_div .search_contents_div .table_input_form { border: none; }
.search_div .search_contents_div .table_input_form tr { line-height: 30px; }
.search_div .search_contents_div .table_input_form th { line-height: 30px; font-size: 13px; color: #ffffff; font-weight: bold; padding: 5px 20px 5px 20px; border: 1px solid #85898c; border-right: 1px solid #dfdfdf; border-bottom: 1px solid #dfdfdf; background: #85898c; }
.search_div .search_contents_div .table_input_form td { line-height: 30px; font-size: 13px; color: #444444; font-weight: normal; padding: 5px 20px 5px 20px; border-top: 1px solid #dfdfdf; border-bottom: 1px solid #dfdfdf;}
.search_div .search_contents_div .table_input_form tr th:last-child { border-right: none; }
.search_div .search_contents_div .table_input_form tr td:last-child { border-right: none; }


/* 고객센터 - 게시판형태 검색 테이블 */
.board_search_table { border: none; }
.board_search_table tr { line-height: 30px; }
.board_search_table th { line-height: 30px; font-size: 13px; color: #ffffff; font-weight: bold; padding: 5px 20px 5px 20px; border: 1px solid #85898c; background: #85898c; }
.board_search_table td { line-height: 30px; font-size: 13px; color: #444444; font-weight: normal; padding: 5px 20px 5px 20px; border-top: 1px solid #dfdfdf; border-bottom: 1px solid #dfdfdf;}
.board_search_table tr th:last-child { border-right: none; }
.board_search_table tr td:last-child { border-right: none; }

.detailContents_btn_div { display: inline-block; width: 100%; text-align: center; padding: 20px 0px 20px 0px; }



.worksList_div{overflow-x: auto;}


.worksList_div .list_Container {width:1600px !important;overflow-x:auto;}
.worksList_div .list_Container .table_input_form{}


.worksList_div .list_Container2 {width:1600px !important;overflow-x:auto;}
.worksList_div .list_Container2 .table_input_form{}

.worksList_div .list_Container.w100p {width:100% !important;}
.worksList_div .list_Container.w1300 {width:1300px !important;}
.worksList_div .list_Container.w1400 {width:1400px !important;}
.worksList_div .list_Container.w1500 {width:1500px !important;}

.worksList_div .list_Container2.w100p {width:100% !important;}
.worksList_div .list_Container2.w1300 {width:1300px !important;}
.worksList_div .list_Container2.w1400 {width:1400px !important;}
.worksList_div .list_Container2.w1500 {width:1500px !important;}


.list_Container .table_input_form thead tr { cursor: default; }
.list_Container .table_input_form tbody tr { cursor: pointer; }
.list_Container .table_input_form tbody tr.subList { cursor: default; }

.subList .noColumn { padding: 10px 20px 10px 20px; }
.subList .noColumn>div { border: 1px solid #6493d4; }

.table_input_form.subTable { 
	border-top: 1px solid #3b85c6; border-bottom: 1px solid #3b85c6; 
	-webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}
.table_input_form.subTable tr { line-height: 30px; } 
.table_input_form.subTable tbody tr { height: auto !important; line-height: 30px; } 
.table_input_form.subTable tr th { line-height: 25px; } 
.table_input_form.subTable tr td { line-height: 30px; } 


/* 리스트 마우스 오버 효과 */
.table_input_form tbody tr.mouseontr {background: #deefff; }
/* .list_Container .table_input_form tbody tr.mouseontr {background: #f5f6f7; } */
/* .list_Container .table_input_form tbody tr.mouseontr td {background: #eee; cursor: pointer; } */
/* .list_Container .table_input_form tbody tr.mouseontr td input {background: #eee; cursor: pointer; } */
/* .list_Container .table_input_form tbody tr.mouseontr td select {background: #eee; cursor: pointer; } */

.table_input_form tbody tr[type="danger"] { background: #fdcfdc; }
.subTable tbody tr[type="danger"] { background: #fdcfdc; }


/* 컬럼에 값만 나타날 경우 div */
.columnDiv {
	display: inline-block;
	width: 100%;
	vertical-align: middle !important;	
}

.columnDiv .maxTextColumn_80 { max-width: 80px; width: 98%; }
.columnDiv .maxTextColumn_100 { max-width: 100px; width: 98%; }
.columnDiv .maxTextColumn_150 { max-width: 150px; width: 98%; }
.columnDiv .maxTextColumn_200 { max-width: 200px; width: 98%; }
.columnDiv .maxTextColumn_250 { max-width: 250px; width: 98%; }
.columnDiv .maxTextColumn_300 { max-width: 300px; width: 98%; }

.columnDiv .projectCodeColumn { max-width: 100px; width: 98%; }
.columnDiv .projectNameColumn { max-width: 100px; width: 98%; }

.columnDiv .orderCodeColumn { max-width: 100px; width: 98%; }
.columnDiv .orderNameColumn { max-width: 100px; width: 98%; }

.columnDiv .addressColumn { max-width: 110px; width: 98%; }
.columnDiv .addressColumn2 { max-width: 200px; width: 98%; }
.columnDiv .companyNameColumn { max-width: 90px; width: 98%; }




.columnChildDiv {
	display: inline-block;
	vertical-align: middle !important;	
}


.list_attach_btn{
	display: inline-block;
	width: 55px;
	height: 30px;	
    cursor: pointer;
    vertical-align: middle;
}
.list_attach_btn:before { content: "첨부파일"; }
.list_attach_btn:hover { text-decoration: underline; }

.contents_extend_btn{
	display: inline-block;
	width: 19px;
	height: 19px;
	background: url("../sooritopia/images/common/contents_open.png") no-repeat;
    cursor: pointer;
    vertical-align: bottom;
}
.contents_extend_btn.open{
	background: url("../sooritopia/images/common/contents_close.png") no-repeat;
}
.list_extend_btn{
	display: inline-block;
	width: 26px;
	height: 30px;	
/* 	width: 19px; */
/* 	height: 19px; */
/* 	background: url("../sooritopia/images/common/contents_open.png") no-repeat; */
    cursor: pointer;
    vertical-align: middle;
/*     margin: 5px 5px 0px 0px; */
}
.list_extend_btn:before { content: "보기"; }
.list_extend_btn.open{
/* 	background: url("../sooritopia/images/common/contents_close.png") no-repeat; */
	content: "접기";
}
.list_extend_btn.open:before { content: "접기"; }
.list_extend_btn:hover { text-decoration: underline; }

.textUnit { font-family: Dotum, Gulim, 'Malgun Gothic' !important; color: #444444; font-size: 13px; float: right; }


/* 신규일감 리스트 (프로젝트) */
/* 신규일감 리스트 (프로젝트) */
.table_input_form.newProjectList { border-bottom: none; }
.table_input_form.newProjectList tr.open { background-color: #e8f3fd; }
.table_input_form.newProjectList tbody > tr { cursor: pointer; height: 200px;}
.table_input_form.newProjectList tbody > .subList { height: auto !important;}
.table_input_form.newProjectList tbody > tr:last-child { border-bottom: none; }
.table_input_form.newProjectList td { border-right: none; }
.table_input_form.newProjectList .subTable tr td { line-height: 45px; } 

.table_input_form.newProjectList td:nth-child(1) { padding: 15px 20px 15px 20px; border-right: none; }
.table_input_form.newProjectList td:nth-child(2) { padding: 0px 15px 0px 15px; }
.table_input_form.newProjectList td:nth-child(3) { padding: 0px 20px 0px 0px; }
.newProjectList .projectCategoryThumbnail { width: 190px; height: 136px; position: relative; }							    		
.newProjectList .projectCategoryThumbnail .categoryImg { width: 190px; height: 136px; }

.newProjectList .projectCategoryThumbnail .categoryImg.category01 { background: url(../sooritopia/images/category/01.png) no-repeat; background-size: 100% 100%;}
.newProjectList .projectCategoryThumbnail .categoryImg.category02 { background: url(../sooritopia/images/category/02.png) no-repeat; background-size: 100% 100%;}
.newProjectList .projectCategoryThumbnail .categoryImg.category03 { background: url(../sooritopia/images/category/03.png) no-repeat; background-size: 100% 100%;}
.newProjectList .projectCategoryThumbnail .categoryImg.category04 { background: url(../sooritopia/images/category/04.png) no-repeat; background-size: 100% 100%;}
.newProjectList .projectCategoryThumbnail .categoryImg.category05 { background: url(../sooritopia/images/category/05.png) no-repeat; background-size: 100% 100%;}
.newProjectList .projectCategoryThumbnail .categoryImg.category06 { background: url(../sooritopia/images/category/06.png) no-repeat; background-size: 100% 100%;}
.newProjectList .projectCategoryThumbnail .categoryImg.category07 { background: url(../sooritopia/images/category/07.png) no-repeat; background-size: 100% 100%;}
.newProjectList .projectCategoryThumbnail .categoryImg.category08 { background: url(../sooritopia/images/category/08.png) no-repeat; background-size: 100% 100%;}
.newProjectList .projectCategoryThumbnail .categoryImg.category09 { background: url(../sooritopia/images/category/09.png) no-repeat; background-size: 100% 100%;}
.newProjectList .projectCategoryThumbnail .categoryImg.category10 { background: url(../sooritopia/images/category/10.png) no-repeat; background-size: 100% 100%;}
.newProjectList .projectCategoryThumbnail .categoryImg.category11 { background: url(../sooritopia/images/category/11.png) no-repeat; background-size: 100% 100%;}
.newProjectList .projectCategoryThumbnail .categoryImg.category12 { background: url(../sooritopia/images/category/12.png) no-repeat; background-size: 100% 100%;}
.newProjectList .projectCategoryThumbnail .categoryImg.category13 { background: url(../sooritopia/images/category/13.png) no-repeat; background-size: 100% 100%;}
.newProjectList .projectCategoryThumbnail .categoryImg.category14 { background: url(../sooritopia/images/category/14.png) no-repeat; background-size: 100% 100%;}
.newProjectList .projectCategoryThumbnail .categoryImg.category15 { background: url(../sooritopia/images/category/15.png) no-repeat; background-size: 100% 100%;}

.newProjectList .projectCategoryThumbnail .categoryImg.category16 { background: url(../sooritopia/images/category/15.png) no-repeat; background-size: 100% 100%;}
.newProjectList .projectCategoryThumbnail .categoryImg.category17 { background: url(../sooritopia/images/category/15.png) no-repeat; background-size: 100% 100%;}
.newProjectList .projectCategoryThumbnail .categoryImg.category18 { background: url(../sooritopia/images/category/15.png) no-repeat; background-size: 100% 100%;}
.newProjectList .projectCategoryThumbnail .categoryImg.category19 { background: url(../sooritopia/images/category/15.png) no-repeat; background-size: 100% 100%;}
.newProjectList .projectCategoryThumbnail .categoryImg.category20 { background: url(../sooritopia/images/category/15.png) no-repeat; background-size: 100% 100%;}


.newProjectList .projectCategoryThumbnail .categoryNameBox { 
	position: absolute;
 	bottom: 0px;
    left: 0px;
    width: 190px; height: 21px;
    background-color: #000000;
	filter: alpha(opacity=70);
	opacity: 0.70;
}
.newProjectList .projectCategoryThumbnail .categoryName { position: absolute; bottom: 0px; left: 0px; width: 190px; height: 21px; color: #ffffff; text-align: center; line-height: 21px; font-size: 12px; font-weight: bold; } 
.newProjectList .projectProperties .propertyBox01 { width: 100%; height: 20px; line-height: 20px; display: inline-block; float: left; }		
.newProjectList .projectProperties .propertyBox02 { width: 100%; height: 22px; line-height: 22px; display: inline-block; float: left; margin-top: 15px; }		
.newProjectList .projectProperties .propertyBox02 span{ font-size: 18px; color: #323232; font-weight: bold; vertical-align: middle; }		
.newProjectList .projectProperties .propertyBox03 { width: 100%; height: 20px; line-height: 20px; display: inline-block; float: left; margin-top: 25px; }		
.newProjectList .projectProperties .propertyBox03 span{ font-size: 13px; color: #323232; vertical-align: middle; }		
/* .newProjectList .projectProperties .propertyBox03 span:nth-child(odd 홀수) { font-weight: bold; }		 */
/* .newProjectList .projectProperties .propertyBox03 span:nth-child(even 짝수) { font-weight: bold; }		 */
.newProjectList .projectProperties .propertyBox03 span:nth-child(2) { font-weight: bold; }		
.newProjectList .projectProperties .propertyBox03 span.line { width: 30px; text-align: center; font-weight: normal; }		
.newProjectList .projectProperties .propertyBox03 span:last-child { font-weight: bold; }		
.newProjectList .projectProperties .propertyBox04 { width: 100%; height: 20px; line-height: 20px; display: inline-block; float: left; }		
.newProjectList .projectProperties .propertyBox04 span { font-size: 13px; color: #444444; vertical-align: middle; }		

.projectStatusBox {
    font-size: 13px;
    font-weight: bold;
    display: inline-block;
    width: 48px;
    height: 24px;
    line-height: 24px;
    text-align: center;
    vertical-align: middle;
}
.projectStatusBox.NEW { background: #ffffff; border: 1px solid #e20a0a; color: #e20a0a;}
.projectStatusBox.HOT { background: #e20a0a; border: 1px solid #e20a0a; color: #ffffff;}
.projectStatusBox.IMPENDING { width: 68px; background: #ffffff; border: 1px solid #ad8767; color: #ad8767;}
.projectStatusBox.COMPLETE { width: 68px; background: #ffffff; border: 1px solid #707070; color: #353434;}
.projectStatusBox.ING { width: 54px; background: #ffffff; border: 1px solid #6493d4; color: #5693e7;}

/* .projectStatusBox.ATTRIBUTE { width: 45px; background: #e0e0e0; border: 1px solid #cfcfcf; color: #3c3c3c; font-weight: normal; } */
.projectStatusBox.ATTRIBUTE { width: 45px; color: #ffffff; font-weight: bold; }
.projectStatusBox.ATTRIBUTE.EMERGENCY{ background: #f12020; border: 1px solid #f12020; }
.projectStatusBox.ATTRIBUTE.NORMAL{ background: #1c2841; border: 1px solid #1c2841; }
.projectStatusBox.ATTRIBUTE.REST{ background: #2c71d0; border: 1px solid #2c71d0; }

.BiddingFailBtnDIV { width: 250px; float: right; text-align: right; margin-bottom: 10px;}
.projectStatusBox.BiddingFail01 { width: 110px; background: #182031; border: 1px solid #182031; color: #ffffff;}
.projectStatusBox.BiddingFail02 { width: 110px; background: #182031; border: 1px solid #182031; color: #ffffff;}

.projectStatusBox.BIMODAL { width: 75px; background: #85898c; border: 1px solid #85898c; color: #ffffff; font-weight: normal; }

.newProjectList .projectProperties2 { width: 100%; height: 100px;}
.newProjectList .projectProperties2 .verticalLine { width: 2px; height: 100px; border-left: 1px solid #dfdfdf; float: left; }
.newProjectList .projectProperties2 .projectInfoBox { 
	width: 98%;  
	height: 28px; 
	line-height: 28px; 
	text-align: left; 
	vertical-align: middle; 
	float: right;
	padding-left: 20px;
	font-size: 14px;
}
.newProjectList .projectProperties2 .projectInfoBox span:nth-child(2) { font-weight: bold; float: right; } 
/* .newProjectList .projectProperties2 .projectInfoBox span.count{ color: #5693e7; }  */

.newProjectList .subList .noColumn { padding: 0px 0px 0px 0px !important; }
/* .newProjectList .subList .noColumn .subTable { margin: 0px 0px 0px 0px; background-color: #f8f9fa; border: 1px solid #828282; } */
.newProjectList .subList .noColumn .subTable { margin: 0px 0px 0px 0px; background-color: #ffffff; border: 1px solid #828282; }
.newProjectList .subList .noColumn .subTable tr { cursor: default; }
.newProjectList .subList .noColumn .subTable tbody > tr:last-child { border-bottom: 1px solid #828282; }
.newProjectList .subList .noColumn .subTable th { border: none; }
.newProjectList .subList .noColumn .subTable td { padding: 0px 10px 0px 10px; font-size: 13px; }

.subTable .orderStatusBox { 
	font-size: 13px;
	display: inline-block;
    width: 70px;
    height: 21px;
    line-height: 21px;
    text-align: center;
    vertical-align: middle;
	background: #ffffff;
	
	font-weight: bold;
	color: #ad8767; 
}

/* .orderStatusBox.DRAWING { border: 1px solid #d959aa; color: #da5fad;} */
/* .orderStatusBox.DESIGN { border: 1px solid #df8336; color: #e48738; width: 70px;} */
/* .orderStatusBox.DOCUMENT { border: 1px solid #4299e0; color: #479ade;} */
/* .orderStatusBox.DRAWING.DISABLED { border: 1px solid #dddddd; color: #bbbbbb;} */
/* .orderStatusBox.DESIGN.DISABLED { border: 1px solid #dddddd; color: #bbbbbb;} */
/* .orderStatusBox.DOCUMENT.DISABLED { border: 1px solid #dddddd; color: #bbbbbb;} */
.orderStatusBox.DISABLED { font-weight: normal; color: #828282;}

.orderBiddingStatusBox { 
	display: inline-block;
	width: 60px;
	height: 28px;
    line-height: 28px;
	background: #ffffff;
	margin: 8px 0px; 
}
.orderBiddingStatusBox.WAIT { border: none; color: #555555; } 
.orderBiddingStatusBox.ING { border: 1px solid #6493d4; color: #5693e7; font-weight: bold; cursor: pointer; } 
.orderBiddingStatusBox.COMPLETE { border: none; color: #555555; width: 100px; } 
.orderBiddingStatusBox.COMPLETE span { cursor: pointer; }
.orderBiddingStatusBox.COMPLETE span:hover { text-decoration: underline; }



/* Input *//* Input */
input { 
	font-family: Dotum, Gulim, 'Malgun Gothic'; 
}
select {
    font-family: Dotum, Gulim, 'Malgun Gothic';
}
/*
*/
input::placeholder {
	font-family: none; 
/*   	color: #acacac; */
	color: #ffffff;
  	font-size: 12px;
}
input::-webkit-input-placeholder {
	font-family: none; 
  	color: #acacac;
  	font-size: 12px;
}

/* Chrome/Opera/Safari */
input::-webkit-input-placeholder { 
	font-family: none; 
  	color: #acacac;
  	font-size: 12px;
}

/* Firefox 19+ */
input:-moz-placeholder { 
	font-family: none; 
 	color: #acacac;
  	font-size: 12px;
}

/* IE 10+ */
input:-ms-input-placeholder { 
	font-family: none; 
  	color: #acacac;
  	font-size: 12px;
}

/* Firefox 18- */
input::-moz-placeholder { 
	font-family: none; 
  	color: #acacac;
  	font-size: 12px;
}


.form_input{
	display: inline-block;
	height: 30px;
	color: #484848;
/* 	font-family: NotoKrL; */
	font-family: Dotum, Gulim, 'Malgun Gothic';
	border: 1px solid #cacaca;
	background-color: transparent;
	padding-left: 10px;
/* 	font-size: 14px !important; */
	font-size: 13px !important;
/* 	아래의 2줄때문에 한글이 자음 모음 분리 (IE Edge의 input 컨트롤에서....) */
/* 	line-height: 30px; */
} 


/* Textarea *//* Textarea */
textarea { 
	font-family: Dotum, Gulim, 'Malgun Gothic';
	resize: none; 
}

textarea.readonly{ 
	border: none;
    outline: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    background: transparent;
}

.textarea {
    margin: 0;
    padding: 5px;
    /* border: 1px solid #cacaca; */
    border:none;
    font-size: 13px;
    background: #ffffff;
    line-height: 24px;
    width: 100% !important;
    max-width: 900px !important;
    min-height: 100px;
    
}

.textareaDiv {
    border: none;
    overflow: auto;
    outline: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    width: 100%;
    overflow-y: auto;
    overflow-x: auto;
    padding: 0px;
    margin: 0px;
    background: transparent;
    vertical-align: middle;
    resize: none;
	line-height: 20px;
	padding: 10px 20px 10px 20px;
}
.textareaDiv > .textarea { border: none; }


/* Button *//* Button */
.white_Btn { 
    display: inline-block;
	width: 90px; 
	height: 30px; 
    line-height: 30px;
	font-family: Dotum, Gulim, 'Malgun Gothic'; font-size: 13px; font-weight: bold; color: #555555; 
	border: 1px solid #b0b0b0; background: #ffffff; 
	text-align: center;
    cursor: pointer;
}

.black_btn{
	height: 30px;
	background: #363636;
	color: #ffffff;
	font-family: NotoKrR;
	text-align: center; 
	display: inline-block;
	line-height: 30px;
	cursor: pointer;
	font-size: 15px;
}
.blue_btn{
	height: 30px;
	background: #ad8767;
	color: #ffffff;
	font-family: NotoKrR;
	text-align: center; 
	display: inline-block;
	line-height: 30px;
	cursor: pointer;
	font-size: 15px;
}
.green_btn{
	height: 30px;
	background: #3bc666;
	color: #ffffff;
	font-family: NotoKrR;
	text-align: center; 
	display: inline-block;
	line-height: 30px;
	cursor: pointer;
	font-size: 15px;
}
.gray_btn{
	height: 30px;
	background: #6f6f6f;
	color: #ffffff;
	font-family: NotoKrR;
	text-align: center; 
	display: inline-block;
	line-height: 30px;
	cursor: pointer;
	font-size: 15px;
}
.orange_btn{
	height: 30px;
	background: #e77417;
	color: #ffffff;
	font-family: NotoKrR;
	text-align: center; 
	display: inline-block;
	line-height: 30px;
	cursor: pointer;
	font-size: 15px;
}
.red_btn{
	height: 30px;
	background: #e23e23;
	color: #ffffff;
	font-family: NotoKrR;
	text-align: center; 
	display: inline-block;
	line-height: 30px;
	cursor: pointer;
	font-size: 15px;
}


/*
.black_btn:hover, .black_btn:focus, .black_btn:active { box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5); }
.blue_btn:hover, .blue_btn:focus, .blue_btn:active { box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5); }
.green_btn:hover, .green_btn:focus, .green_btn:active { box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5); }
.gray_btn:hover, .gray_btn:focus, .gray_btn:active { box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5); }
.orange_btn:hover, .orange_btn:focus, .orange_btn:active { box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5); }
.red_btn:hover, .red_btn:focus, .red_btn:active { box-shadow: 0 10px 10px -10px rgba(0, 0, 0, 0.5); }
*/

/*
.black_btn:hover, .black_btn:focus, .black_btn:active { transform: scale(1.1); }
.blue_btn:hover, .blue_btn:focus, .blue_btn:active { transform: scale(1.1); }
.green_btn:hover, .green_btn:focus, .green_btn:active { transform: scale(1.1); }
.gray_btn:hover, .gray_btn:focus, .gray_btn:active { transform: scale(1.1); }
.orange_btn:hover, .orange_btn:focus, .orange_btn:active { transform: scale(1.1); }
.red_btn:hover, .red_btn:focus, .red_btn:active { transform: scale(1.1); }
*/




/* Select *//* Select */
.form_select{
/*     background: url(../sooritopia/images/bg_select_box2.jpg) no-repeat 100% 50%;     */
	font-family: Dotum, Gulim, 'Malgun Gothic' !important;
    font-size: 13px !important;
/*     background: url(../sooritopia/images/bg_select_box.jpg) no-repeat 100% 50%;     */
    background: url(../babbahyun/images/bg_select_box_new.jpg) no-repeat 100% 50%;    
	-webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
	background-color: #ffffff;
}
.form_select.input_required{
/*     background: url(../sooritopia/images/bg_select_box.jpg) no-repeat 100% 50%;     */
    background: url(../babbahyun/images/bg_select_box_new.jpg) no-repeat 100% 50%;    
/*     border: 1px solid  #3b85c6; */
}
.form_select.disabled{
/*     background: url(../sooritopia/images/bg_select_box2.jpg) no-repeat 100% 50%;     */
    background: url(../babbahyun/images/bg_select_box_new2.jpg) no-repeat 100% 50%;    
    
}
.form_select::expand {
    display: none;
}
.form_select::-ms-expand {
    display: none;
}
.form_select::-webkit-expand {
    display: none;
}
.form_select::-moz-expand {
    display: none;
}
.form_select:disabled { background: #f8f8f8; color: #7b7979; }

/* Calendar */
/* Calendar */
.ui-datepicker {
	background-color: #fff;
/* 	border: 1px solid #45b8ee; */
	border: 1px solid #afafaf;
	border-radius: 5px;
/* 	box-shadow: 0 0 8px rgba(102,175,233,.6); */
	display: none;
	margin-top: 0px;
	padding: 5px;
/* 	width: 240px; */
	width: calc(94vw - 20px);
    max-width: 360px;
	font-family: Dotum, Gulim, 'Malgun Gothic';
	font-size: 14px !important;
}
.ui-datepicker a,
.ui-datepicker a:hover {
	text-decoration: none;
}
.ui-datepicker a:hover,
.ui-datepicker td:hover a {
	color: #2A6496;
	-webkit-transition: color 0.1s ease-in-out;
	   -moz-transition: color 0.1s ease-in-out;
	     -o-transition: color 0.1s ease-in-out;
	        transition: color 0.1s ease-in-out;
}
.ui-datepicker .ui-datepicker-header {
	margin: 0px 5px 4px 5px;
	text-align: center;
}
.ui-datepicker .ui-datepicker-title {
	font-weight: 700;
	width: 180px;
    display: inline-block;
}
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
	cursor: default;
	font-family: 'Glyphicons Halflings';
	-webkit-font-smoothing: antialiased;
	font-style: normal;
	font-weight: normal;
	height: 20px;
    line-height: 1;
    margin-top: 5px;
    width: 20px;
    color: #999;
}
.ui-datepicker .ui-datepicker-prev {
	float: left;
	text-align: left;
}
.ui-datepicker .ui-datepicker-next {
	float: right;
	text-align: right;
}
.ui-datepicker .ui-datepicker-prev:before {
	content: "◀";
}
.ui-datepicker .ui-datepicker-next:before {
	content: "▶";
}
.ui-datepicker .ui-icon {
	display: none;
}
.ui-datepicker .ui-datepicker-calendar {
  table-layout: fixed;
	width: 100%;
}

.ui-datepicker-calendar thead tr { border-top: 1px solid #45b8ee; border-bottom: 1px solid #45b8ee; }
.ui-datepicker-calendar thead tr th { border-right: 1px solid #e3e3e3; }
.ui-datepicker-calendar thead tr th:last-child { border-right: none; }
.ui-datepicker-calendar tbody tr { border-bottom: 1px solid #45b8ee; }
.ui-datepicker-calendar tbody tr td { border-right: 1px solid #e3e3e3; }
.ui-datepicker-calendar tbody tr td:last-child { border-right: none; }

.ui-datepicker .ui-datepicker-calendar th,
.ui-datepicker .ui-datepicker-calendar td {
	text-align: center;
	padding: 1px 0;
	color: #000 !important;
}
.ui-datepicker .ui-datepicker-calendar td {
	border-radius: 4px;
	-webkit-transition: background-color 0.1s ease-in-out, color 0.1s ease-in-out;
	   -moz-transition: background-color 0.1s ease-in-out, color 0.1s ease-in-out;
	     -o-transition: background-color 0.1s ease-in-out, color 0.1s ease-in-out;
	        transition: background-color 0.1s ease-in-out, color 0.1s ease-in-out;
}
.ui-datepicker .ui-datepicker-calendar td:hover {
	background-color: #949494;
	cursor: pointer;
}
.ui-datepicker .ui-datepicker-calendar td a {
	text-decoration: none;
	color: #000;
}
.ui-datepicker .ui-datepicker-current-day {
/* 	background-color: #4D6395; */
	background-color: #45b8ee;
}
.ui-datepicker .ui-datepicker-current-day a {
	color: #4D6395
}

.ui-datepicker-today{
	background-color: #afcafc;
}
.ui-datepicker-unselectable.ui-state-disabled{
	background-color: #fff;
	cursor: default;
}
.ui-datepicker-unselectable.ui-state-disabled span{
	color: gray;
}
	
.ui-datepicker .ui-datepicker-calendar .ui-datepicker-unselectable:hover {
	background-color: #fff;
	cursor: default;
}
.ui-datepicker-calendar > tbody td:first-child a { 
    color: #f00; 
}
.ui-datepicker-calendar > tbody td:last-child a { 
    color: blue; 
}
.ui-datepicker-month{
	border: none;
    padding-left: 10px;
}

.ui-datepicker-week-end span:first-child { color: red; }
.ui-datepicker-week-end span:last-child { color: blue; }


#ui-datepicker-div { z-index: 2080 !important; }
.days .tcal {
    width: 110px;
    text-align: center;
    font-size: 13px;
/*     height: 27px; */
    height: 30px;
    border: 1px solid #cacaca;
}
.days .icon_cal {
    position: relative;
    display: inline-block;
    text-indent: -9999em;
    overflow: hidden;
	vertical-align: top;
	/*
    width: 27px;
    height: 26px;
	margin-left: 5px;
    */
    width: 32px;
    height: 30px;
/* 	margin-left: 0px; */
	margin-left: -4px;
}
.days .icon_cal:after {
    content: "";
    display: block;
    position: absolute;
    /*
    top: 1px;
    left: 0px;
    width: 27px;
    height: 26px;
    background: url(../sooritopia/images/bg_cal_icon.jpg) no-repeat;
    */
    top: 0px;
    left: -1px;
    width: 32px;
    height: 30px;
/*     background: url(../img/frame/bg_cal_icon_new.jpg) no-repeat; */
}
.days span {
    display: inline-block;
    padding: 3px 5px 0 7px;
    color: #959595;
    font-size: 13px;
}
span.from-to {
    display: inline-block;
    padding: 0px 5px 0 7px;
/*     color: #959595; */
    font-size: 13px;
/*     vertical-align: sub; */
}

.days input.tcal { width: 120px; padding: 6px 5px 6px 15px; margin-right: 5px; float: Left; border: 1px solid #45b8ee; background-color: #f8f8f8; border-radius: 5px 0px 0px 5px; position: relative; text-align: left; font-size: 14px; }
.days .icon_cal { margin-left: -6px; border: 1px solid #45b8ee; border-radius: 0px 5px 5px 0px; overflow: hidden; overflow: hidden; box-sizing: border-box; }
.days .icon_cal:after { left: 0px; width: 35.2px; height: 33px; background: url(../img/frame/bg_cal_icon_new.jpg) no-repeat; background-position: -3px -3px; background-size: cover; }

/* Required Input Value *//* Required Input Value */
.input_required{
/* 	border: 1px solid #3b85c6; */
}


/* Etc Component *//* Etc Component */
.btn_searchFilter { 
	display: inline-block;
	width: 145px; 
	height: 15px;
	cursor: pointer;
	position: relative;
	top: -1px;
}
.btn_searchFilter.closeBtn { 
	background: url(../sooritopia/images/btn_search_close.jpg) no-repeat;
}
.btn_searchFilter.openBtn{ 
	background: url(../sooritopia/images/btn_search_open.jpg) no-repeat;
}
.descText { 
/* 		vertical-align: sub !important; */
/* 		padding-top: 5px;  */
		padding-left: 5px;
		line-height: 28px; 
}
.moneyText { text-align: right; padding: 0 10px 0 0;}
.numberText { text-align: right; padding: 0 10px 0 0;}


.blue_star { color: #ad8767; padding: 0px 2px 0px 2px; font-family: Dotum, Gulim, 'Malgun Gothic' !important; font-size: 13px}
.red_star { color: #ff0000; padding: 0px 2px 0px 2px; font-family: Dotum, Gulim, 'Malgun Gothic' !important; font-size: 13px}

.list_delete_btn { cursor: pointer; color: #ad8767; font-weight: bold; padding: 0px 0px 0px 5px; }
.list_delete_btn:before { 
	content: url("../sooritopia/images/common/btn_icon_list_delete.jpg"); 
	margin: 0px 0px 2px 0px;
    vertical-align: middle;
    width: 15px;
    height: 15px;
    display: inline-block;
    line-height: 15px;
}

.question_tip{
	position: relative;
	display: inline-block;
	width: 16px;
	height: 16px;
	background: url(../sooritopia/images/common/icon_question.png) no-repeat;
	vertical-align: middle;
	cursor: pointer;
	margin-left: 10px;
}

.i-checks { 
	font-family: Dotum, Gulim, 'Malgun Gothic'; 
	font-size: 13px; 
	font-weight: normal;
	line-height: 30px; 
}


.fileAttachText { border: 0.5px solid #e3e3e3; max-width: 280px; }
.fileAttach { display: none !important; }
.noneInput{display: none;}

.downFileUrl { position: relative; }
.downFileUrl:hover { border-bottom: 1px solid #555555; }
/* .downFileUrl:hover>input{ border-bottom: 1px solid #555555; } */

.FileDownloadBtn { display: inline-block; border: 1px solid #bbbbbb; width: 35px; height: 31px; line-height: 30px; text-align: center;  vertical-align: middle; margin: 0px 0px 0px 0px; }
.FileDeleteBtn { display: inline-block; border: 1px solid #bbbbbb; width: 35px; height: 31px; line-height: 30px; text-align: center;  vertical-align: middle; margin: 0px 0px 0px 5px; }
.FileDownloadBtn:before { display: inline-block; font: normal normal normal 14px/1 FontAwesome; content: "\f019"; font-size: 20px; width: 22px; height: 20px; vertical-align: middle; }
.FileDeleteBtn:before { display: inline-block; font: normal normal normal 14px/1 FontAwesome; content: "\f1f8"; font-size: 20px; width: 22px; height: 20px; vertical-align: middle; }


.fileAttachBtn { 
    display: inline-block;
	width: 100px; height: 30px; 
    line-height: 30px;
	font-family: Dotum, Gulim, 'Malgun Gothic'; font-size: 13px; font-weight: bold; color: #555555; 
	border: 1px solid #b0b0b0; background: #ffffff; 
	text-align: center;
    cursor: pointer;
}

.fileListDiv {
	width: 500px; height: 120px; margin: 0; padding: 5px; border: 1px solid #cacaca; font-size: 13px; background: #e3e3e3; line-height: 24px;
}

.MultiFile-list > .MultiFile-label { border: 1px solid #3e3e3e; margin-bottom: 10px; padding: 10px 10px; }
.MultiFile-list > .MultiFile-label > span { width: 100% !important; max-width: 100% !important; white-space: normal;}
.MultiFile-list span.MultiFile-label { border: 1px solid #d4d4d4; margin: 5px 5px; vertical-align: top; }
.MultiFile-list span.MultiFile-label .MultiFile-title{ display: block; text-align: center; text-overflow: unset; white-space: unset; }
.MultiFile-list span.MultiFile-label .MultiFile-preview{ width: 100%; max-width: 300px !important; max-height: 300px !important; }




.newWindowOpenBtn { display: inline-block; border: 1px solid #bbbbbb; background-color: #ffffff; width: 25px; height: 25px; line-height: 25px; text-align: center;  vertical-align: middle; margin: 0px 0px 0px 0px; }
.newWindowOpenBtn:before { display: inline-block; font: normal normal normal 14px/1 FontAwesome; content: "\f2d2"; font-size: 14px; vertical-align: middle; 
/* 	width: 22px; height: 20px;  */
}

.disabledNone{
	display: none;
}


.question_tip_layer {
    position: absolute;
    width: 100%;
    line-height: 19px; 
    background: #ffffff;
    border: 1px solid #888888;
    top: -3px;
    left: 28px;
    display: none;
    z-index: 2000;
    display: none;
}
.question_tip_layer:before { 
	content: url("../sooritopia/images/common/bulun_left.png"); 
	margin: 0px 4px 0px 0px; 
	display: block; 
	position: absolute; 
	top: 0px; 
	left: -5px; 
}
.question_tip_layer .tip_layer_div { display: inline-block; width: 100%; line-height: 19px; padding: 5px 5px 5px 5px; }
.question_tip_layer .tip_layer_div .tip_layer_text { display: inline-block; width: 100%; font-size: 12px; color: #777777; font-weight: normal; text-align: left;}

.tag_content { display: inline-block; margin-right: 15px; }

/*  text-tyle  */
.text-normal {
	font-weight: normal;
	color: #444444;
}
.text-waiting {
	font-weight: normal;
	color: #acacac;
}
.text-complete {
	font-weight: normal;
	color: #5693e7;
}
.text-trouble {
	font-weight: normal;
	color: #fb4944;
}

.small_Btn { 
	font-family: Dotum, Gulim, 'Malgun Gothic'; 
	font-size: 13px; 
	font-weight: bold;  
    display: inline-block;
	width: 70px; 
	height: 24px; 
    line-height: 24px;
	background: #ffffff; 
	text-align: center;
    cursor: pointer;
    border: 1px solid #b0b0b0;
    color: #555555;
    vertical-align: middle !important;
}
.small_Btn.gray{ 
    border: 1px solid #b0b0b0;
    color: #555555;
}
.small_Btn.blue{ 
    border: 1px solid #76acf6;
    color: #5693e7;
}
.small_Btn.red{ 
    border: 1px solid #fc9895;
    color: #fb4944;
}



/* Align *//* Align */
.float-L{
	float: left;
}
.float-R{
	float: right;
}
.align_C{
	text-align: center !important;
	padding-left: 0px !important;
	padding-right: 0px !important;
}
.align_L{
	text-align: left !important;
	padding-left: 10px !important;
	padding-right: 0px !important;
}
.align_R{
	text-align: right !important;
	padding-left: 0px !important;
	padding-right: 10px !important;
}
.align_L_20{
	text-align: left;
	padding-left: 20px !important;
}
.align_R_20{
	text-align: right;
	padding-right: 20px !important;
}

.btn_align_lt {
	text-align: left;
}
.btn_align_rt {
	text-align: right;
}
.btn_align_ct {
	text-align: center;
}



/* switch toggle Button */
.scroll-switcher{ width: 60px; height: 24px; border: none; }
.scroll-switcher div.switch-toggle {
    display: block; height: 24px; width: 48px;
    position: relative; cursor: pointer;
    background: #ffffff;
    box-shadow: inset 0 0 1px rgb(0 0 0 / 20%);
    -webkit-transition: all .2s ease;
    -moz-transition: all .2s ease;
    -o-transition: all .2s ease;
    transition: all .2s ease;
    border-radius: 50px;
    
    float: right;
/*     margin-top: 9px; */

/*     border: 1px solid #45b8ee; */
    border: 1px solid #948f8f;
    
    font-size: 11px; 
    text-align: left; 
    line-height: 24px; 
/* 	color: #948f8f; */
	color: #fff;
    padding: 0px 5px;
}
/* .scroll-switcher div.switch-toggle.switch-on { background: #00a4ff; } */
.scroll-switcher div.switch-toggle:after { 
	content: ''; display: block; height: 18px; width: 18px; background: #929ba0;
    position: absolute; top: 2px; right: 26px; border-radius: 50px;
    box-shadow: 1px 1px 3px rgb(0 0 0 / 30%);
    -webkit-transition: all .2s ease;
    -moz-transition: all .2s ease;
    -o-transition: all .2s ease;
    transition: all .2s ease;
}
.scroll-switcher div.switch-toggle.switch-on { background: #45b8ee; text-align: right; color: #45b8ee; border: 1px solid #45b8ee; }
.scroll-switcher div.switch-toggle.switch-on:before { content: ''; right: 40px; top: 12px; color: #fff;}
.scroll-switcher div.switch-toggle.switch-on:after { right: 2px; background: #ffffff; }




/* Line Padding *//* Line Padding */
.contentsArea_Blank{ width: 100%; padding: 25px 20px;}
.contentsArea_Blank_small{ width: 100%; padding: 15px 20px;}
.contentsArea_Blank_xsmall{ width: 100%; padding: 10px 20px;}


.readonlyControl { border: none; outline: none; background: transparent; }    
.readonlyControl2 { outline: none; background: transparent; }    



/* 컨트롤 사이즈 정의 */
.form_input[readonly="readonly"] { background: #f8f8f8; color: #7b7979; }
.form_input[readonly="readonly"]:focus { outline: none; }

.input_100p{ width: 100%; }
.input_98p{ width: 98%; }
.input_95p{ width: 95%; }
.input_90p{ width: 90%; }
.input_85p{ width: 85%; }
.input_80p{ width: 80%; }
.input_70p{ width: 70%; }
.input_60p{ width: 60%; }
.input_50p{ width: 50%; }
.input_40p{ width: 40%; }
.input_30p{ width: 30%; }
.input_20p{ width: 20%; }

.input_30{ width: 30px; }
.input_40{ width: 40px; }
.input_50{ width: 50px; }
.input_60{ width: 60px; }
.input_80{ width: 80px; }
.input_100{ width: 100px; }
.input_120{ width: 120px; }
.input_140{ width: 140px; }
.input_160{ width: 160px; }
.input_180{ width: 180px; }
.input_200{ width: 200px; }
.input_220{ width: 220px; }
.input_240{ width: 240px; }
.input_260{ width: 260px; }
.input_280{ width: 280px; }
.input_300{ width: 300px; }
.input_320{ width: 320px; }
.input_340{ width: 340px; }
.input_360{ width: 360px; }
.input_380{ width: 380px; }
.input_400{ width: 400px; }
.input_500{ width: 500px; }

.ctl_30{ width: 30px; }
.ctl_40{ width: 40px; }
.ctl_45{ width: 45px; }
.ctl_50{ width: 50px; }
.ctl_60{ width: 60px; }
.ctl_70{ width: 70px; }
.ctl_80{ width: 80px; }
.ctl_90{ width: 90px; }
.ctl_100{ width: 100px; }
.ctl_120{ width: 120px; }
.ctl_140{ width: 140px; }
.ctl_160{ width: 160px; }
.ctl_180{ width: 180px; }
.ctl_200{ width: 200px; }

.ctl_H_25{ height: 25px; line-height: 25px; }
.ctl_H_30{ height: 30px; line-height: 30px; }
.ctl_H_35{ height: 35px; line-height: 35px; }
.ctl_H_40{ height: 40px; line-height: 40px; }
.ctl_H_45{ height: 45px; line-height: 45px; }


.btn_40{ width: 40px; }
.btn_45{ width: 45px; }
.btn_50{ width: 50px; }
.btn_60{ width: 60px; }
.btn_80{ width: 80px; }
.btn_100{ width: 100px; }
.btn_120{ width: 120px; }
.btn_140{ width: 140px; }
.btn_160{ width: 160px; }
.btn_180{ width: 180px; }
.btn_200{ width: 200px; }

.btn_H_25{ height: 25px; line-height: 25px; font-size: 13px; }
.btn_H_30{ height: 30px; line-height: 30px; font-size: 13px; }
.btn_H_35{ height: 35px; line-height: 35px; }
.btn_H_40{ height: 40px; line-height: 40px; }
.btn_H_45{ height: 45px; line-height: 45px; }


.btn_lv1,.btn_lv2,.btn_lv3,.btn_lv4,.btn_lv5 { display: none; }

.columnDiv .maxW60{max-width: 60px !important;}
.columnDiv .maxW80{max-width: 80px !important;}
.columnDiv .maxW90{max-width: 90px !important;}
.columnDiv .maxW100{max-width: 100px !important;}
.columnDiv .maxW110{max-width: 110px !important;}
.columnDiv .maxW120{max-width: 120px !important;}

.columnDiv .maxW130{max-width: 130px !important;}
.columnDiv .maxW140{max-width: 140px !important;}
.columnDiv .maxW150{max-width: 150px !important;}
.columnDiv .maxW160{max-width: 160px !important;}
.columnDiv .maxW170{max-width: 170px !important;}
.columnDiv .maxW180{max-width: 180px !important;}
.columnDiv .maxW190{max-width: 190px !important;}
.columnDiv .maxW200{max-width: 200px !important;}

.columnDiv .maxW300{max-width: 300px !important;}
.columnDiv .maxW400{max-width: 400px !important;}
.columnDiv .maxW440{max-width: 440px !important;}

.columnDiv .maxW500{max-width: 500px !important;}
.columnDiv .maxW550{max-width: 550px !important;}
.columnDiv .maxW570{max-width: 570px !important;}

.moneyBalanceRateChart { position: absolute; top: 0px; left: 0px; width: 80px; height: 148px; padding: 16px 10px; }

.moneyBalanceRateBox { display: block; width: 34px; height: 14px; margin: 1px auto; background: #e4e4e4; font-size: 12px; letter-spacing: -1px; color: #ffffff; line-height: 14px; letter-spacing: -0.2px;}
.moneyBalanceRateBox2 { display: block; width: 100%; height: 14px; margin: 1px 0px; }

.moneyBalanceTxt_Plus { display: block; width: 8px; height: 14px; line-height: 14px; float: left; color: #0000ff; font-weight: bold; }
.moneyBalanceTxt_Minus { display: block; width: 8px; height: 14px; line-height: 14px; float: left; color: #ff0000; font-weight: bold; }

.moneyBalanceBox_Gray { display: block; width: 34px; height: 14px; margin: 1px 13px; background: #e4e4e4; }
.moneyBalanceBox_Blue { display: block; width: 34px; height: 14px; margin: 1px 13px; background: #ad8767; font-size: 12px; letter-spacing: -1px; color: #ffffff; line-height: 14px; letter-spacing: -0.2px; }
.moneyBalanceBox_Red { display: block; width: 34px; height: 14px; margin: 1px 13px; background: #e20a0a; font-size: 12px; letter-spacing: -1px; color: #ffffff; line-height: 14px; letter-spacing: -0.2px; }

.moneyBalanceRateTxt { display: block; width: 100%; height: 14px; margin: 1px 0px; font-size: 12px; letter-spacing: -1px; color: #000000; line-height: 22px; }

.days span{
	display: inline-block;
    width: 30px !important;
    text-align: center;
}
    
.ajaxLoader {
/* 		display: inline-block; */
	  	width: 60px;
	  	height: 60px;
/* 	  	border: 8px solid #f3f3f3; */
		border: 3px solid rgba(180,180,180,.2);
	  	border-radius: 50%;
	  	border-top-color: #3498db;
	  	-webkit-animation: spin 0.8s linear infinite; /* Safari */
	  	animation: spin 0.8s linear infinite;
}
	
	.ajaxLoaderIE9 {
/* 		display: inline-block; */
	  	width: 60px;
	  	height: 60px;
/* 	  	border: 8px solid #f3f3f3; */
		border: 3px solid rgba(180,180,180,.2);
	  	border-radius: 50%;
	  	border-top-color: #3498db;
	  	-webkit-animation: spin 0.8s linear infinite; /* Safari */
	  	animation: spin 0.8s linear infinite;
	  
/* 	  border: 8px solid #f3f3f3; */
/* 	  border-radius: 50%; */
/* 	  border-top: 8px solid #3498db; */
/* 	  width: 60px; */
/* 	  height: 60px; */
/* 	  -webkit-animation: spin 0.7s linear infinite; *//* Safari */ 
/* 	  animation: spin 0.7s linear infinite; */
}
	
@-webkit-keyframes spin {
	0% { 
			-webkit-transform: rotate(0deg);  /* Chrome, Opera 15+, Safari 3.1+ */
			-ms-transform: rotate(0deg);  /* IE 9 */
			transform: rotate(0deg);  /* Firefox 16+, IE 10+, Opera */
		}
		
	100% { 
			-webkit-transform: rotate(360deg);  /* Chrome, Opera 15+, Safari 3.1+ */
			-ms-transform: rotate(360deg);  /* IE 9 */
			transform: rotate(360deg);  /* Firefox 16+, IE 10+, Opera */
		}
}

@keyframes spin {
	0% {	
			-webkit-transform: rotate(0deg);  /* Chrome, Opera 15+, Safari 3.1+ */
			-ms-transform: rotate(0deg);  /* IE 9 */
			transform: rotate(0deg);  /* Firefox 16+, IE 10+, Opera */
		}
		
	100% {	
			-webkit-transform: rotate(360deg);  /* Chrome, Opera 15+, Safari 3.1+ */
			-ms-transform: rotate(360deg);  /* IE 9 */
			transform: rotate(360deg);  /* Firefox 16+, IE 10+, Opera */
		}
}