@charset "utf-8";
/* *******************************************************
 * filename : common.css
 * description : 공통디자인 CSS
 * date : 2020-05-11
******************************************************** */
html,body{
	height:100%;
}
.wrap{
	position:relative;
	min-width:1280px;
	min-height:100%;
	padding-bottom:75px;
	box-sizing:border-box;
}
.container{
	position:relative;
	min-height:100%;
}
.content{
	padding: 10px 30px 20px 30px;
    margin-left: 60px;
    min-height: 600px;
    overflow: hidden;	
}

/* header-wrap */
.header-wrap{
	position:relative;
	height:80px;	
	background-color:#fff;
}
.top-header{
	position:relative;
	height:40px;	
}
.logo{
	position:absolute;
	top:0;
 left:0;

}
.logo a{
 display:inline-block;
	width:218px;
 height:37px; text-indent:-9999px;
	background:url('../images/common/logo.png') no-repeat 50%;
 background-size:90%}
.logo a.esp{ background:url('../images/outside/logo_esp.png') no-repeat 50%; background-size:85% }


.top-menu{
	position:absolute;
	top:50%;
	right:20px;
	overflow:hidden;
	margin-top:-9px;
}
.top-menu li{
	float:left;
	position:relative;
	margin-left:5px;
	padding-left:5px;
}
.top-menu li a{
	display:inline-block;
}
.top-menu li .user{
	padding:3px 0 0 20px;
	font-size:12px;
	background:url('../images/common/icon_profile.png') no-repeat left 5px;
}
.top-menu li .user strong{
	color:#444;
	font-weight:700;
}
.top-menu li .loginout{
	text-indent:-9999px;
	width:20px;
	height:20px;
	background:url('../images/common/icon_login_off.png') no-repeat 50%;
}
.top-menu li .loginout:hover{	
	background:url('../images/common/icon_login_on.png') no-repeat 50%;
}

.top-menu li .msearch{
	text-indent:-9999px;
	width:20px;
	height:20px;
	background:url('../images/common/icon_m_search_off.png') no-repeat 50%;
}
.top-menu li .msearch:hover{	
	background:url('../images/common/icon_m_search_on.png') no-repeat 50%;
}
.top-menu li .csearch{
	text-indent:-9999px;
	width:20px;
	height:20px;
	background:url('../images/common/icon_c_search_off.png') no-repeat 50%;
}
.top-menu li .csearch:hover{	
	background:url('../images/common/icon_c_search_on.png') no-repeat 50%;
}


.tabcheck {
   position: relative;
}
.tabcheck input[type="checkbox"] {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip:rect(0,0,0,0);
	border: 0
}

.tabcheck input[type="checkbox"] + label {
	display: inline-block;
	position: relative;
	background-color:#aaa; border-radius:20px; padding:2px 24px 2px 10px; line-height:20px; color:#fff; font-size:11px;
	cusor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.tabcheck input[type="checkbox"] + label:before {
	content: ' ';
	position: absolute;
	top:4px; right:5px;
	width: 16px;
	height: 16px;
	line-height: 18px;	
	background: #fff;	
	border-radius: 16px;	
}

.tabcheck input[type="checkbox"]:checked + label:before {
	content: '';	
	background: #fff url('../images/common/icon_check_on.png') no-repeat 4px center;
}
.tabcheck input[type="checkbox"]:checked + label {
	background:#da4527
}


.gnb-area{
 position:relative; height:40px; background-color:#545050
;}
.gnb{position:absolute;top:0; left:34px; min-width:1280px;/* width:100%; */padding:0 20px;box-sizing:border-box;}

.gnb:after{
	content:"";
	display:block;
	clear:both;
}
.gnb > li{
	float:left;
	position:relative;	
	text-align:center;
	width:10%;
}
.gnb > li > a{
	display:block;
	height:40px;	
	line-height:40px;
	font-size:14px;
	color:#fff;
	font-weight:bold;	
}
.gnb > li:hover > a{
	color:#f85a3b;
}
.gnb > li:hover .gnb-sub{
	display:block;
}

.gnb.max > li {width:9%;}


/* gnb accordion menu */
.gnb-sub{
	 
display:none;
	 
position:absolute;
	 
top: 40px;
	 
left:50%;
	 
z-index:50;
	 
min-width:180px;
	 
margin-left:-90px;
	 
background-color:#fff;
	 
border:1px solid #d0d4db;
	 
padding:0;
	 
box-sizing:border-box;
	 
box-shadow:3px 3px 5px #e8e8e8;
}
.gnb-sub:before{
	content:"";
	position:absolute;
	top:-9px;
	left:50%;
	margin-left:-4px;
	width:8px;
	height:3px;
	background:url('../images/common/icon_triangle.png') no-repeat 50%;
}
.gnb-sub > li:first-child {border-top:0}
.gnb-sub > li > a{	
	font-size:13px;
	padding:8px;
	color:#555;
	display:block;
	text-align:left;
	font-weight:bold
}

.gnb-sub > li > a:hover{
	color:#f85a3b;
}
.gnb-sub > li > a:hover:before{
	display:block;
}

.gnb-sub ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.gnb-sub li.on > a {color:#f85a3b}
.gnb-sub li.on > ul {
	display: block; background-color:#f3f3f3
}
.gnb-sub li > ul {	
	display: none;	
	overflow: hidden;
	transition: height 350ms ease-in-out;	
}
.gnb-sub ul.is-visible {
	display: block;	
}
.gnb-sub > li {
	border-bottom: 1px solid #d0d4db;
	position: relative;
	overflow: hidden;
	transition: all .4s ease;
}
.gnb-sub li:last-child {
	border: none;
}
.gnb-sub li::after {
	content: "";
	display: block;
	clear: both;
}
.gnb-sub li > a > span {
	display: block;
	position: relative;
	background:url('../images/common/icon_gnb_close.png') no-repeat 50%;
	width: 11px;
	height:5px;
	float: right;
	transition: all .3s ease;
	margin-top:8px
}
.gnb-sub li.on > a > span {
	background:url('../images/common/icon_gnb_open.png') no-repeat 50%;
	transform: rotate(180deg);
}

.gnb-sub * {
	box-sizing: border-box;
}
.depth {border-top:1px solid #d0d4db}
.depth li:first-child {padding-top:10px}
.depth li:last-child {padding-bottom:10px}
.depth li  {padding:4px 12px; text-align:left;}
.depth li > a {
	font-size:12px; color:#888;	font-weight:bold; display:block
}

.depth li > a:hover {
	color:#f85a3b;
}

.gnb-btn{
	
	display:inline-block;
	position:absolute;
	
	top: 85px;
	right:30px;
	
	width:25px;
	height:25px;
	
	border-radius:25px;
	text-indent:-9999px;

	box-shadow:0 3px 5px 0px rgba(0,0,0,0.3);
	
	background:#fff url('../images/common/icon_up.png') no-repeat 50%;
	
	z-index:20;

}
.gnb-btn.on{
	background:#fff url('../images/common/icon_down.png') no-repeat 50%; top:5px;	
}
.gnb-btn:hover{
	background:#fff url('../images/common/icon_up.png') no-repeat 50%;
}
.gnb-btn.on:hover{
	background:#fff url('../images/common/icon_down.png') no-repeat 50%;
}

.lang {		
	width: 80px; height:22px;
	padding:0 10px; font-size:11px;
	border: 1px solid #929292;
	border-radius:15px;	
	background: url('../images/common/ico_select_top.png') no-repeat right 10px center;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

.lang::-ms-expand {
    display: none;
}

/* tit-area */
.tit-area{
	overflow:hidden;
	position:relative;
	clear: both;
	padding:5px 0;
}
.tit-area h3{
	float:left;
	font-size:18px;
	color:#222;
	font-weight:800;
	padding-bottom:5px;
}
/* sub-tit */
.sub-tit{
	overflow:hidden;
	padding:15px 0 5px 0;
}
.sub-tit h4{
	float:left;
	position:relative;
	padding-left:10px;
	line-height:29px;
	color:#222;
	font-size:15px;
	font-weight:bold;
}
.sub-tit h4:before{
	content:"";
	position:absolute;
	top:50%;
	left:0;
	width:4px;
	height:15px;
	margin-top:-7px;
	background-color:#f85a3b;
}

/* small-tit */
.small-tit{
	overflow:hidden;
	padding:18px 0 10px 0;
}
.small-tit h5{
	float:left;
	position:relative;
	padding-left:10px;
	line-height:29px;
	color:#222;
	font-size:13px;
	font-weight:bold;
}
.small-tit h5:before{
	content:"";
	position:absolute;
	top:50%;
	left:0;
	width:4px;
	height:4px;
	margin-top:-2px;
	background-color:#f85b38;
}

/* location-area */
.locationBox {display:block; width:100%; overflow:hidden}

.location-area{
	float:right;
	padding:0 0 5px;
	overflow:hidden;	
}
.location-area li{
	float:left;
	position:relative;
	padding-left:10px;
	margin-left:10px;
}
.location-area li:before{
	content:"";
	position:absolute;
	top:50%;
	left:0;
	width:6px;
	height:8px;
	margin-top:-3px;
	background:url('../images/common/icon_nav_arrow.png') no-repeat 50%;
}
.location-area li:first-child{
	padding-left:0;
	margin-left:0;
}
.location-area li:first-child:before{
	display:none;
}
.location-area li a{
	display:inline-block;
	font-size:12px;
	color:#8a8a8a;
}
.location-area li a.home{
	width:14px; 
	text-indent:-9999px;
	background:#fff url('../images/common/icon_home.png') no-repeat 50%; 
}
.location-area li a.help{
	font-size:10px; font-weight:800; width:13px; height:13px; vertical-align:middle; margin-right:5px;
	border:2px solid #888; color:#888; border-radius:13px; text-align:center
}
.location-area li a.help:hover{	
	border:2px solid #da4527; color:#da4527
}


/* tbl-search-wrap */
.tbl-search-wrap{	
	width:100%;
	box-sizing:border-box;
}
.tbl-search-area{
	display: table;
	height:100%;
	position:relative;
    width: 100%;
    box-sizing: border-box;
	margin:0;
	border-top:2px solid #aaa;
}
.tbl-search{width:100%;	}

.tbl-search tbody th {
	padding: 2px 5px 2px 8px;
    box-sizing: border-box;
	background-color:#f1f2f6;
	border-left:1px solid #e0e0e0;
	border-bottom:1px solid #e0e0e0;
	text-align: left;
}
.tbl-search tbody td {
	padding: 3px 5px 3px 8px;
    box-sizing: border-box;
	border-left:1px solid #e0e0e0;
	border-bottom:1px solid #e0e0e0;
	background-color:#fff;
}

.tbl-search-btn{
	display:table-cell;
	position:relative;
	width: 100px;
	height:100%;
	vertical-align:middle;
	border-left:1px solid #e0e0e0;
	border-right:1px solid #e0e0e0;
	border-bottom:1px solid #e0e0e0;
 padding:2px 5px;
}
.tbl-search-btn .btn-search{
	display: inline-block;
    width:100%;
	height:100%;
    color: #fff;
    font-size: 14px;
	font-weight:bold;   
	padding:0 15px 0 30px;
    border-radius: 4px;
    box-sizing: border-box;	
	background:#da4527 url('../images/common/icon_search.png') no-repeat 23px center;
}

.tbl-search-btn .btn-search:hover{}

/* table style */

/* list type */
.tbl-list {
	width:100%;
	table-layout:fixed;
	border-top:2px solid #202332;
	border-left-style:hidden;
}
.tbl-list thead th{
	height:25px;
	padding:2px 0;
	border-left:1px solid #e0e0e0;
	border-bottom:1px solid #e0e0e0;
	border-right:0;
	background-color:#f1f2f6;
	font-size:12px;
	font-weight:bold;
	color:#444;
}
.tbl-list tbody td{
	height:25px;
	padding:2px;
	border-left:1px solid #e0e0e0;
	border-bottom:1px solid #e0e0e0;
	font-size:12px;
	color:#666;
	text-align:center;
}
.subject-area{
	overflow:hidden;
}
.subject{
	display:block;
	overflow:hidden;
	white-space:nowrap;
	text-overflow:ellipsis;
	font-size:12px;
	color:#444;
	font-weight:bold;
}
.subject:hover{
	text-decoration:underline;
}

.tbl-list tbody tr:hover{
	background-color:#f5f9fe;
}



/* view type */
.tbl-view {
	width:100%;
	table-layout:fixed;
	border-top:2px solid #202332;
	border-right:1px solid #e0e0e0;
}

.tbl-view tbody th{
	height:25px;
	padding:2px 8px;
	border-left:1px solid #e0e0e0;
	border-bottom:1px solid #e0e0e0;
	background-color:#f1f2f6;
	font-size:12px;
	color:#444;
	text-align:left;
}
.tbl-view tbody td{
	height:25px;
	padding:2px 8px;
	border-left:1px solid #e0e0e0;
	border-bottom:1px solid #e0e0e0;
	font-size:12px;
	color:#666;
	text-align:left;
}



/* date-area */
.date-area{ 
	display:inline-block;
	height:23px;	
	padding-right:5px;
}
.date-area input{	
	width:74px;
	height:23px;
	border:1px solid #c6c6c6; 	
}
.date-area img{
	cursor:pointer; margin-left:5px
}



/* paging */
.paging {
    text-align: center;
    overflow: hidden;
    margin-top: 10px;
    position: relative;
}
.paging a {
    display: inline-block;
    width: 23px;
    line-height: 23px;
    text-align: center;
    border: 1px solid #ddd;
    font-size: 11px;
    margin: 0 1px;
    color: #646464;
}
.paging a:hover {
    border: 1px solid #f85a3b;
	color:#f85a3b;
}
.paging a.selected {
    border: 1px solid #f85a3b;
    color: #f85a3b;
    font-weight: bold;
}
.paging a.first { 
	background:url('../images/common/btn_first.png') no-repeat 50%; 
	text-indent:-9999px;
}
.paging a.first:hover { 
	background:url('../images/common/btn_first_hover.png') no-repeat 50%; 
}
.paging a.last { 
	background:url('../images/common/btn_last.png') no-repeat 50%;
	text-indent:-9999px;
}
.paging a.last:hover { 
	background:url('../images/common/btn_last_hover.png') no-repeat 50%;
}
.paging a.next { 
	background:url('../images/common/btn_next.png') no-repeat 50%; 
	text-indent:-9999px;
}
.paging a.next:hover { 
	background:url('../images/common/btn_next_hover.png') no-repeat 50%; 
}
.paging a.pre { 
	background:url('../images/common/btn_prev.png') no-repeat 50%; 
	text-indent:-9999px;
}
.paging a.pre:hover { 
	background:url('../images/common/btn_prev_hover.png') no-repeat 50%; 
}

.total {
    line-height: 30px;    
    font-size: 11px;
	position:absolute;
	top:0;
	left:0;
}
.total em {
    font-size: 11px;
    font-weight: bold;
    color: #d87b98;
}

.amount { 
	position:absolute;
	top:0;
	right:0;
}



/* footer */
.footer-wrap{
	position:absolute;
	left:0;
	right:0;
	bottom:0;
	z-index:20;
	background-color:#fff;
	border-top:1px solid #c1c7d2;
	padding:13px 0 20px 0;
}
.footer-wrap p{
	padding-left:30px;
	float:left;
}
.ft_btn {float:left; padding:25px 0 0 10px}
.ft_btn li {float:left; padding:0 10px}
.ft_btn li:first-child a {font-weight:bold}
.ft_btn li a {font-size:12px; color:#555}
.ft_btn li a:hover {color:#222}
.ft_btn li span{
	display:inline-block;	
	color:#999;
	font-size:11px;
}

/* button */
.btnArea {overflow:hidden;}
.btnArea.abtit {position:absolute; right:0; bottom:6px}

.btn {
	display:inline-block;
	font-size:12px;
	font-weight:bold;
	color:#444;
	border:1.5px solid #999;
	background-color:#fff;
	padding:5px 15px;
	border-radius:5px;
}
.btn:hover {
	color:#e84947;
	border:1.5px solid #e84947;
}
.btn.st1 {
	border:1.5px solid #e84947;
	color:#e84947;
}
.btn.st1:hover {
	background:#e84947;
	color:#fff;
}

/* 버튼 비활성 */
.btn:disabled,
.btn.st1:disabled,
.tabtn:disabled
{ background-color:#eaeaea; border-color:#eaeaea !important; color:#888}

.tbtn { 
	display:inline-block;
	height:26px;
	line-height:24px;
	padding:0 8px;
	text-align:center;
	color:#fff;
	border:1px solid #bbb;
	font-size:12px;
	font-weight:bold;
	box-sizing:border-box;
	vertical-align:top;
	background:#bbb;
}
.tbtn:hover { 
	background:#aaa;
}

.tabtn { 
	display:inline-block;
	height:23px;
	line-height:22px;
	padding:0 8px;
	text-align:center;
	color:#666;
	border:1px solid #c6c6c6;
	border-radius:2px;
	font-size:12px;
	font-weight:bold;
	box-sizing:border-box;
	vertical-align:top;
	background:#f3f3f3;
}
.tabtn:hover { 	
	border:1px solid #666;	
}
.tabtn.plus {
	width:28px;
	background:#f3f3f3 url('../images/common/tabtn_plus.png') no-repeat center;
}
.tabtn.minus {
	width:28px;
	background:#f3f3f3 url('../images/common/tabtn_minus.png') no-repeat center;
}

/* loading */
.loading-area{
	display:none;
	position:fixed; top:0; left:0;
	z-index:999;
	width:100%;
	height:100%;
	background-color:rgba(0,0,0,0.3);
}
.loading{
	position:absolute; top:50%; left:50%;
	width:320px;
	height:170px;
	margin-top:-85px;
	margin-left:-160px;
	border:1px solid #ddd;
	background:#fff url('../images/common/loader.gif') no-repeat 50% 36px;
}
.loading strong{
	display:block;
	margin-top:96px;
	color:#444;
	font-size:18px;
	font-weight:bold;
	text-align:center;
}
.loading p{
	margin-top:5px;
	color:#666;
	font-size:15px;
	text-align:center;
}


/* layout */
.layout-box {overflow:hidden;}
.layout-left {
	float:left;
	width:50%;
	box-sizing:border-box;
	padding-right:10px;
}
.layout-right {
	float:right;
	width:50%;
	box-sizing:border-box;
	padding-left:10px;
}
/* layout 37*/
.layout-left.lay37 {width:30%}
.layout-right.lay37 {width:70%}


/* form */
.sbtn{
	display: inline-block;
	width:23px;
	height:23px;
	box-sizing:border-box;
	text-indent:-9999px;
	vertical-align:top;
	background:url('../images/common/search_icon_b.png') no-repeat 50%;
}

/* readonly */
.readonly{
	background-color:#eaeaea;
}


/* jquery UI 탭  */
.ui-tabs {
    border: 0;
    margin: 0;
    padding: 0;
    border-radius: 0;
}
.ui-tabs .ui-tabs-nav {
    padding: 0;
    margin: 0;
    border-radius: 0;
    background: #fff;
    height: 30px;
    border: 0;
    border-bottom: 1px solid #ea3d56;
}
.ui-tabs .ui-tabs-nav li {
    border: 0;
    margin: 0;
    padding: 0;
    border-radius: 0;
    box-sizing: border-box;
    height: 30px;
    line-height: 30px;
    background: #fff;
    margin-left: 2px;
}
.ui-tabs .ui-tabs-nav li:first-child {
    margin-left: 0;
}
.ui-tabs .ui-tabs-nav li.ui-state-default .ui-tabs-anchor {
    border: 0;
    margin: 0;
    padding: 0;
    display: inline-block;
    height: 29px;
    line-height: 29px;
    background: #fdfdfd;
    border: 1px solid #e9e9e9;
    border-bottom: 0;
    /*width:100px;*/
    min-width: 60px;
    padding: 0 20px;
    text-align: center;
    cursor: pointer;
    font-size: 12px;
    font-weight: bold;
    color: #8d8d8d;
}
.ui-tabs .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor {
    background: #fff;
    height: 28px;
    line-height: 28px;
    border: 1px solid #e9e9e9;
    cursor: pointer;
    border-top: 3px solid #f85a3b;
    border-left: 1px solid #f85a3b;
    border-right: 1px solid #f85a3b;
    border-bottom: 0;
    font-size: 12px;
    color: #f85a3b;
}
.ui-tabs .ui-tabs-panel {
    padding: 10px 0;
    background: #fff;
}

/* jquery UI 다이얼로그 */
.ui-dialog.ui-widget.ui-widget-content {
    padding: 0;
    margin: 0;
    border-radius: 0;
    border: 0;
    box-shadow: 0 0 3px 0 rgba(0,0,0,0.2);
}
.ui-dialog .ui-dialog-titlebar {
    padding: 0 15px;
    margin: 0;
    border-radius: 0;
    background: #3f3737 url('../images/common/pop_head_bg.png') no-repeat center;
    border:0;
}
.ui-dialog .ui-dialog-title {
    line-height: 40px;
    font-size: 14px;
    font-weight: bold;
    color: #fff;
}
.ui-dialog .ui-dialog-content {
    padding: 15px;
    border:0;
    border-top: 0;
}
.ui-dialog .ui-dialog-titlebar-close {
    width: 15px;
    height: 15px;
    background: url("../images/common/pop_close.png") no-repeat 50%;
    border: 0;
    border-radius: 0;
    outline: none;
    right: 15px;
    margin-top: -8px;
}
.ui-dialog .ui-dialog-titlebar-close span {
    display: none;
}


/* popup common */

.pop-head {
	height:50px;
	padding:0 20px;
	position:relative;	
	background: #3f3737 url('../images/common/pop_head_bg.png') no-repeat center;
	overflow:hidden;
}

.pop-head .btnArea {line-height:50px}
.pop-head .btnArea button {border-color:#888; background-color:#666; color:#fff}
.pop-head .btnArea button:hover {border-color: #e84947; background-color:#e84947; color:#fff}
	
.pop-head h2 {
	line-height:50px;
	font-size:18px;
	font-weight:bold;
	color:#fff;
	float:left;
}
.pop-head .close { 
	display:inline-block;
	width:14px;
	height:14px;
	background:url('../images/common/pop_close.png') no-repeat 50%;
	text-indent:-9999px;
	position:absolute;
	top:50%;
	right:20px;
	margin-top:-7px;
	transition:all .4s;
}
.pop-head .close:hover {
	transform:rotate(180deg);
}
.pop-cont { 
	padding:15px;
}

.pop-wrap.fixed .pop-head {
	position:fixed;
	width:100%;
	z-index:9;
	box-sizing:border-box;
}
.head-btn {
	position:absolute;
	top:10px;
	right:15px;
}

.pop-wrap.fixed .pop-cont {
	padding:65px 15px 15px;
}

.page-link {
	position:fixed;
	top:50px;
	width:100%;
	box-sizing:border-box;
	background:#f9f9f9;
	padding:0 15px;
	box-shadow: 0px 2px 2px 0px rgba(0,0,0,0.1);
	z-index:9;
}
.page-link li {
	float:left;
	position:relative;
}
.page-link li:after { 
	content:"";
	width:1px;
	height:12px;
	background:#ccc;
	position:absolute;
	top:50%;
	left:0;
	margin-top:-6px;
}
.page-link li:first-child:after{ 
	display:none;
}

.page-link li a {
	display:block;
	line-height:40px;
	padding:0 20px;
	font-weight:bold;
}
.page-link li a:hover { 
	color:#e84947;
}
.pop-wrap.fixed .pop-cont.link {
	padding:105px 15px 15px;
}
.page-link li a.on { 
	color:#e84947;
}
.chart-box{
	background-color:#ddd;
	height:200px;
}

.req {
	display:inline-block;
	padding-right:10px;
	background:url('../images/common/req_icon.png') no-repeat 100% 50%;	
}
.first {padding-top:0}
.pop-wrap .grid-area {overflow:auto}


/* pop table list type */
.pop-wrap .tbl-list {border-left:1px solid #e0e0e0}
.pop-wrap .tbl-list thead th{	
	border-right:1px solid #e0e0e0;		
}
.pop-wrap .tbl-list tbody td{	
	border-right:1px solid #e0e0e0;		
}
.pop-wrap .tbl-list tbody tr:hover{
	background-color:#fff;
}
.pop-wrap .tbl-list tbody td.tblue {color:#0662fb}

/* pop img type */
.imgBox img {width:100%}


/*multi select */
.multiSelecArea {display:inline-block}
.multiSelecArea .ui-state-default {height:23px; padding:0 2px 0 5px}
.multiSelecArea button span {font-size:12px; font-family:'NotoSans','맑은고딕','Malgun Gothic','돋움', Dotum, Arial, sans-serif; color:#666}
.multiSelecArea .ui-multiselect {background:#fff}


/* error */
.error-wrap{
	position:absolute; top:50%; left:50%;
	width:770px;
	margin:-200px 0 0 -385px;
	padding:60px;
	border-top:4px solid #da4527; border-bottom:1px solid #222;
	box-sizing:border-box;
	background:#fff url('../images/common/error_icon.png') no-repeat right 50px center;
}

.error-cont h2{ color:#444; font-size:30px; position:relative; padding-bottom:20px}
.error-cont h2 span {color:#da4527; font-weight:900}
.error-cont h2:before{
	content:"";
	position:absolute;
	width:30px; height:2px; background-color:#222;
	bottom:0px; left:0
}
.error-cont p{
	color:#666;
	font-size:16px;
	line-height:25px;
	margin-top:30px
}
.error-btn{
	margin-top:28px;
}
.error-btn a{
	display:inline-block;
	padding:9px 18px;
	box-sizing:border-box;
	border:1px solid #da4527;
	color:#da4527;
	font-size:14px;
	background-color:#fff;
	border-radius:4px;
	transition:all .2s;
}
.error-btn a:hover{
	background-color:#da4527;
	color:#fff
}
.error-btn a.st2{
	border:1px solid #666;
	background-color:#fff;
	color:#666;
	margin-left:7px;
}
.error-btn a.st2:hover{
	background-color:#666;
	color:#fff
}

/* inbox  normal*/
.inboxArea {width:100%; overflow:hidden; margin-bottom:10px}
.inboxArea dt {
	border:1px solid #e0e0e0; color:#000; padding:5px 14px; cursor:pointer;
	background:#f9f9f9 
}
.inboxArea dd { border:1px solid #e0e0e0; color:#000; padding:5px;}
.inboxArea dd .tbl-view {border-color:#aaa}

/* inbox  toggle */
.inboxArea.toggle dt {
	border:1px solid #e0e0e0; color:#000; padding:5px 14px; cursor:pointer;
	background:#f9f9f9 url('../images/common/ico_inbox_off.png') no-repeat right 14px center
}
.inboxArea.toggle dt.on {
	color:#fff;
	background:#3f3737 url('../images/common/ico_inbox_on.png') no-repeat right 14px center
}
.inboxArea.toggle dd {display:none; border:1px solid #e0e0e0; color:#000; padding:5px;}



/* LNB메뉴 */
.lnb-area { 
	position:relative;
}
.lnb-menu{
	padding:0 8px;
	width:54px;
	background:#fff;
	position:fixed;
	top:120px;
	left:0;		
	box-sizing:border-box;
	z-index:49;
	-webkit-box-shadow: 6px 6px 15px -1px rgba(212,212,212,1);
	-moz-box-shadow: 6px 6px 15px -1px rgba(212,212,212,1);
	box-shadow: 6px 6px 15px -1px rgba(212,212,212,1);
	border:1px solid #dee0df;
}
.lnb-menu.on {
	-webkit-box-shadow: 6px 6px 15px -1px rgba(212,212,212,0);
	-moz-box-shadow: 6px 6px 15px -1px rgba(212,212,212,0);
	box-shadow: 6px 6px 15px -1px rgba(212,212,212,0);
}
.lnb-menu > li { 
	border-top:1px solid #eee;
	position:relative;
}
.lnb-menu > li:first-child {border-top:0}
.lnb-menu > li > a {
	display:block;
	position:relative;
	height:57px;	
}
.lnb-menu > li > a.on:before{
	content:"";
	position:absolute;
	top:0;
	right:-8px;
	width:3px;
	height:100%;
	background-color:#f85a3b;
	opacity:1;
	visibility: visible;
}

[data-tooltip-text]:hover {position: relative;}

[data-tooltip-text]:after {
	-webkit-transition: bottom .3s ease-in-out, opacity .3s ease-in-out;
	-moz-transition: bottom .3s ease-in-out, opacity .3s ease-in-out;
	transition: bottom .3s ease-in-out, opacity .3s ease-in-out;
	background-color:#fff;
	-webkit-box-shadow: 0px 0px 3px 1px rgba(50, 50, 50, 0.4);
	-moz-box-shadow: 0px 0px 3px 1px rgba(50, 50, 50, 0.4);
	box-shadow: 0px 0px 3px 1px rgba(50, 50, 50, 0.4);	
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;	
	color: #888;
	font-size: 12px;
	margin-bottom: 10px;
	padding: 5px;
	position: absolute;
	width: auto;
	min-width: 50px;
	max-width: 300px;
	word-wrap: break-word;
	z-index: 9999;
	opacity: 0;
	left: -9999px;
	top: 90%;
	text-align:center;
	content: attr(data-tooltip-text);
}

[data-tooltip-text]:hover:after {
	top: 15px;
	left: 50px;
	opacity: 1;
}

.lnb-menu > li > a.icon01 {background:url('../images/common/ico_lnb_icon01.png') no-repeat 50%; background-size:23px 23px}
.lnb-menu > li > a.icon02 {background:url('../images/common/ico_lnb_icon02.png') no-repeat 50%; background-size:23px 23px}
.lnb-menu > li > a.icon03 {background:url('../images/common/ico_lnb_icon03.png') no-repeat 50%; background-size:23px 23px}
.lnb-menu > li > a.icon01:hover {background-size:29px 29px}
.lnb-menu > li > a.icon02:hover {background-size:29px 29px}
.lnb-menu > li > a.icon03:hover {background-size:29px 29px}



.lnb-menu > li a.on.icon01{background:url('../images/common/ico_lnb_icon01.png') no-repeat 50%; background-size:23px 23px }
.lnb-menu > li a.on.icon02{background:url('../images/common/ico_lnb_icon02.png') no-repeat 50%; background-size:23px 23px}
.lnb-menu > li a.on.icon03{background:url('../images/common/ico_lnb_icon03.png') no-repeat 50%; background-size:23px 23px}

.lnb-menu > li > a.icon04 {background:url('../images/common/ico_lnb_icon04.png') no-repeat 50%}
.lnb-menu > li > a.icon05 {background:url('../images/common/ico_lnb_icon05.png') no-repeat 50%}
.lnb-menu > li a.on.icon04{background:url('../images/common/ico_lnb_icon04_hover.png') no-repeat 50%}
.lnb-menu > li a.on.icon05{background:url('../images/common/ico_lnb_icon05_hover.png') no-repeat 50%}

.lnb-box {
	width:230px;
	position:fixed;
	z-index:9;
	top:120px;
	bottom:0;
	left:6px;	
	padding:0 0 20px 47px;
	background:#f7f7f7;
	border-radius:0 10px 0 0;	
	opacity:0;
	visibility: hidden;
	transition: all .2s;
	box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.05);
}
.lnb-box.on { 
	opacity:1;
	visibility: visible;
	left:0;
}
.lnb-menu > li.on > a:after{
	opacity:1;
	visibility: visible;
}
.lnb-menu-list{
	margin-top:15px;
	padding-left:30px;
}
.lnb-menu-list > li{	
	margin-right:15px;
	margin-top:5px;
}
.lnb-menu-list > li:last-child{
	border-bottom:0;
}
.lnb-menu-list > li > a {
	display:block;
	position:relative;
	padding:10px 30px 10px 10px;	
	color:#222;
	font-size:14px;
	font-weight:700;
}
.lnb-menu-list > li > a:hover{
	border-radius:15px;
	background-color:#f85a3b;
	color:#fff;
}
.lnb-list{
	margin-top:15px;
	padding-left:20px;
}
.lnb-list li{
	position:relative;
	margin-right:15px;
	padding-right:20px;
}
.lnb-list li a{
	display:inline-block;
	position:relative;
	padding:8px 0 8px 30px;	
	color:#666;
	font-size:14px;
}
.lnb-list li a:hover{
	color:#f85a3b;
}
.lnb-list li a:before{
	content:"";
	position:absolute;
	top:16px;
	left:18px;
	width:3px;
	height:3px;
	background-color:#222;
	border-radius:50%;
}
.lnb-list li .favor-del{
	display:inline-block;
	position:absolute;
	top:50%;
	margin-top:-10px;
	right:5px;
	text-indent:-9999px;
	width:20px;
	height:20px;
	background:url('../images/common/ico_favor_del.png') no-repeat 50%;
	border:1px solid #e6e6e6;
	box-shadow:1px 1px 2px rgba(34,34,34,0.4);
}
.lnb-list li .favor-del:hover{
	background:url('../images/common/ico_favor_del_hover.png') no-repeat 50%;
}

/* LNB메뉴 dropw down 화살*/
.lnb-menu-list > li > a.arrow:after{
	content:"";
	position:absolute;
	top:50%;
	margin-top:-4px;
	right:10px;
	width:14px;
	height:8px;
	background:url('../images/common/ico_lnb_arrow_down.png') no-repeat 50%;
	transition:all .4s;
}
.lnb-menu-list > li > a.arrow:hover:after{
	content:"";	
	background:url('../images/common/ico_lnb_arrow_down_hover.png') no-repeat 50%;
	transition:all .4s;
}
/* LNB메뉴 dropw up 화살*/
.lnb-menu-list > li.open > a.arrow:after{
	background:url('../images/common/ico_lnb_arrow_up.png') no-repeat 50%;
	transform:rotate(-360deg);
}
/* LNB메뉴 open*/
.lnb-menu-list > li.open > a{
	border-radius:15px;
	background-color:#f85a3b;
	color:#fff;
}
.depth3{
	display:none;
	padding:5px 15px 5px 15px;
}
.depth3 > li > a{
	display:block;
	position:relative;
	color:#666;
	font-size:13px;
	padding:5px 10px;	
}
.depth3 > li > a.active{
	color:#f85a3b;
}
.depth3 > li > a:before{
	content:"";
	position:absolute;
	top:12px;
	left:0;
	width:3px;
	height:3px;
	background-color:#222;
	border-radius:50%;
}
.depth3 > li > a:hover{
	color:#f85a3b;
}
.custom-scroll { 
	height:100%;
}
.lnb-close {
	display:inline-block;
	width:30px;
	height:30px;
	border-radius:100%;
	text-indent:-9999px;
	background:#fff url('../images/common/ico_lnb_close.png') no-repeat 50%;
	position:absolute;
	top:0;
	right:-40px;
	box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);
	transition:all .4s;
}
.lnb-close:hover{
	transform:rotate(180deg);
}

/* lnb 탭 디자인 */
.lnb-tit{
	overflow:hidden;
	border-radius:10px 10px 0 0;
}
.lnb-tit > li{
	position:relative;
	background-color:#efefef;
	padding:15px 0 15px 35px;
}
.lnb-tit > li > span{
	display:inline-block;
	font-size:20px;
	font-weight:bold;
	color:#444;
}
.lnb-tit > li > .ico-favor{
	display:inline-block;
	position:absolute;
	top:50%;
	right:15px;
	width:28px;
	height:28px;
	margin-top:-14px;
	text-indent:-9999px;
	background:url('../images/common/ico_lnb_favor.png') no-repeat 50%;
}
.lnb-tit > li > .ico-favor:hover{
	background:url('../images/common/ico_lnb_favor_hover.png') no-repeat 50%;
}

/* sumArea */
.sumArea {margin-top:10px; overflow:hidden}
.sumArea.line {border-top:1px solid #aaa; padding:15px 0; margin-top:15px}
.sumArea p {font-size:13px; color:#fd0101}
.sumArea p.sum {text-align:right}
.sumArea p.sum span {font-size:20px; font-weight:bold; margin-left:28px}
.sumArea p.check {color:#444; font-size:15px; font-weight:bold}

/* listType */
.listType {list-style-type:none; padding:0}
.listType li {font-size:13px; color:#444; padding:3px 0 3px 15px; position:relative}
.listType li:before {content:'-'; position:absolute; top:0; left:5px}
.listType_num {list-style-type:decimal; padding:0 10px}
.listType_num li {font-size:13px}
.listType_num.infotype {padding:0 17px}
.listType_num.infotype li {font-size:15px; font-weight:bold; color:#222; padding:5px 0 }
.listType_num.infotype li span {font-size:13px; font-weight:normal}
.listType_num.infotype li .listType_upper-alpha {list-style-type:upper-alpha; padding:5px}
.listType_num.infotype li .listType_upper-alpha li {font-size:12px; color:#666; padding:2px 0}
.listType_num.infotype li .listType_upper-alpha li span {font-size:12px; color:#444; font-weight:bold}
.listType_num.infotype li .listType_upper-alpha li .listType_lower-roman {list-style-type:lower-roman; padding:5px}
.listType_num.infotype.t13 li {font-size:13px; color:#666}
.listType_num.infotype.t13 li span {color:#444; font-weight:bold}

/* infoArea */
.infoArea {width:100%; padding:20px 20px 20px 109px; margin-bottom:20px; box-sizing:border-box}
.infoArea.type1 {background:#f1f2f6 url('../images/common/infoarea_type1.png') no-repeat center left 25px }
.infoArea p {padding:12px 0 12px 23px; border-left:1px solid #ddd; color:#fd0101; font-size:13px; position:relative}
.infoArea p:before {content:''; width:2px; height:2px; background-color:#fd0101; position:absolute; top:20px; left:15px}
.infoArea p.type2 {color:#444}
.infoArea p.type2 span {display:block; font-size:14px; color:#222}
.infoArea p.type2:before {display:none}
.infoArea ul {padding:12px 0 12px 23px; border-left:1px solid #ddd; color:#fd0101; font-size:13px; position:relative}

.check {display:block; float:right}
.asterisk  {color:#ac0413}
.info {line-height:22px}

/* addtable */
.addTable li {padding:2px 0}
.addTable li input {margin:0 5px}
.addTable li .addsum {margin-left:40px; color:#222}

/* status */
.status {overflow:hidden; margin:0 0 10px; text-align:right}
.status span {margin-left:20px; color:#222;}
.status span .round {
	display:inline-block; margin-right:5px;
	width:10px; height:10px; border-radius:10px; background-color:#eee;
}

.status span em.color1 {background-color:#999}			/* 구매의뢰, 기성요청대상 */
.status span em.color2 {background-color:#fa0505}		/* 의뢰반려, 의뢰팀 반려, 검토자 반려, 구매팀 반려*/
.status span em.color3 {background-color:#07f789}		/* 의뢰승인 */
.status span em.color4 {background-color:#fa5b05}		/* 구매팀반송 */
.status span em.color5 {background-color:#f9e009}		/* 구매접수, 의뢰팀 임시저장, 구매팀 임시저장 */
.status span em.color6 {background-color:#d3c01a}		/* 업체선정중, 완료보고서등록*/
.status span em.color7 {background-color:#07cdf7}		/* 계약품의, 결재요청, 구매팀 결재요청 */
.status span em.color8 {background-color:#158fa9}		/* 계약검토, 검토자 결재 */
.status span em.color9 {background-color:#18606f}		/* 계약승인, 의뢰팀 승인, 구매팀 승인 */
.status span em.color10 {background-color:#9505fa}		/* 발주서발송 */
.status span em.color11 {background-color:#7d1ec0}		/* 발주완료 */
.status span em.color12 {background-color:#2d9aa7}		/* 입고(기성) */
.status span em.color13 {background-color:#c21414}		/* 의뢰삭제, 기성요청취소 */

.statusArea {border:1px solid #dee0df; padding:10px; overflow:hidden; box-sizing:border-box; margin-bottom:10px}
.statusArea dt, .statusArea dd {float:left}
.statusArea dt {font-size:13px; color:#444; padding-left:14px; clear:both; margin:2px 0}
.statusArea dt.type1 {background:url('../images/common/icon_status_type1.png') no-repeat 0 center}
.statusArea dt.type2 {background:url('../images/common/icon_status_type2.png') no-repeat 0 center}
.statusArea dd {width:80%;}
.statusArea .status {text-align:left; margin:2px 0}
.statusArea .status span {color:#666}

/* pop tree */
.treeArea {border:1px solid #e0e0e0; border-top:0; padding:10px; height:auto}


/* 사후평가수행 */
.evaluation-list {padding:15px; border:1px solid #ddd; background-color:#fdfdfd}
.evaluation-list dt {font-size:13px; color:#444; font-weight:bold; line-height:23px}
.evaluation-list dd {padding:10px 0}
.evaluation-list dd label input {margin-right:10px}
.po_no{font-size:15px; color:#222222; font-weight:bold;}


/********************** 메인 내부용 *****************************/

/* main layout  */
.wrap.main {}
.wrap.main .top-header {width:1120px; margin:0 auto}
.wrap.main .gnb {left:50%; margin-left:-640px; }
.wrap.main .logo {left:0}
.wrap.main .top-menu {right:0}
.wrap.main .container{ width:1120px; margin:0 auto; padding:7px 0 0 0}
.wrap.main .footer-wrap {border:0}
.wrap.main .footer-wrap .inner {width:1120px; margin:0 auto}


/* title */
.toArea {width:100%; background:url('../images/main/toarea_title_icon.png') no-repeat left top; position:relative; padding:0 12px 8px 68px; box-sizing:border-box}
.toArea h2 {font-size:26px; color:#444;} 
.toArea h2 span {color:#f85a3b; font-weight:900} 
.toArea .toBtn {
	position:absolute; right:0; bottom:10px; background:url('../images/main/toBtn_ico_close.png') no-repeat right center;
	font-size:13px; color:#444; padding:0 20px 0 0
}

.todoListArea {overflow:hidden; margin-bottom:8px}
.todoListArea.on {
	border-top:3px solid #777;
	transition:all 0.5s;
}
.todoListArea > ul {margin:-8px 0 0 -16px;}
.todoListArea > ul > li {float:left; width:25%; padding:8px 0 0 16px; box-sizing:border-box}
.todoListArea > ul > li > ul,  .todoListArea > ul > li > dl { border:1px solid #c6c6c6;  overflow:hidden; min-height:146px }
.todoListArea > ul > li > ul {border-top:3px solid #777 }
.todoListArea > ul > li > dl {border-top:3px solid #e7593e }


/* icon type */
.iconArea {padding:26px 10px; box-sizing:border-box}
.iconArea li {float:left; width:33.333%; text-align:center}
.iconArea li a {display:block; font-size:12px; color:#666; }
.iconArea li a:hover {color:#f85a3b;}

.iconArea li a span {display:block; width:100%; height:60px}
.iconArea li a span.ico01 {background:url('../images/main/iconarea_ico01.png') no-repeat center top 2px}
.iconArea li a span.ico02 {background:url('../images/main/iconarea_ico02.png') no-repeat center top 6px}
.iconArea li a span.ico03 {background:url('../images/main/iconarea_ico03.png') no-repeat center top}

.iconArea li a:hover span {
	animation: bounce 0.4s infinite alternate;
	-webkit-animation: bounce 0.4s infinite alternate;
	-moz-appearance: bounce 0.4s infinite alternate;
	-ms-animation: bounce 0.4s 1 alternate;
}

@keyframes bounce {
  from {
    transform: translateY(0px);
  }
  to {
    transform: translateY(-5px);
  }
}
@-webkit-keyframes bounce {
  from {
    transform: translateY(0px);
  }
  to {
    transform: translateY(-5px);
  }
}

/* list type */

.todoBox dt {font-size:18px; color:#444; font-weight:900; }
.todoBox dt.icon01 {background:#f5f6f8 url('../images/main/todobox_icon01.png') no-repeat right 25px center} 
.todoBox dt.icon02 {background:#f5f6f8 url('../images/main/todobox_icon02.png') no-repeat right 25px center} 
.todoBox dt.icon03 {background:#f5f6f8 url('../images/main/todobox_icon03.png') no-repeat right 25px center} 
.todoBox dt.icon04 {background:#f5f6f8 url('../images/main/todobox_icon04.png') no-repeat right 25px center} 
.todoBox dt.icon05 {background:#f5f6f8 url('../images/main/todobox_icon05.png') no-repeat right 25px center} 
.todoBox dt.icon06 {background:#f5f6f8 url('../images/main/todobox_icon06.png') no-repeat right 25px center} 
.todoBox dt.icon07 {background:#f5f6f8 url('../images/main/todobox_icon07.png') no-repeat right 25px center} 
.todoBox dt.icon08 {background:#f5f6f8 url('../images/main/todobox_icon08.png') no-repeat right 25px center} 
.todoBox dt.icon09 {background:#f5f6f8 url('../images/main/todobox_icon09.png') no-repeat right 25px center} 
.todoBox dt.icon10 {background:#f5f6f8 url('../images/main/todobox_icon10.png') no-repeat right 25px center} 
.todoBox dt.icon11 {background:#f5f6f8 url('../images/main/todobox_icon11.png') no-repeat right 25px center} 


.todoBox dt, .todoBox dd { padding:10px 25px; } 
.todoBox dd {}
.todoBox dd li {padding:1px 0 2px}
.todoBox dd li a {display:block; position:relative}
.todoBox dd li a span {position:absolute; right:0; top:-3px}
.todoBox dd li a span em {font-size:14px; color:#f85a3b; font-weight:900; margin-right:3px}
.todoBox dd li a:hover {color:#f85a3b;}

/* 메인 탭 */
.boardArea {overflow:hidden; box-sizing:border-box; margin-left:-16px}
.box {
	width:50%; float:left; 
	padding-left:16px; box-sizing:border-box;		
}
.info-box {
	border:1px solid #cfcfcf;
	background-color:#f5f6f8;
	padding:25px 30px 16px;
	overflow:hidden;
	box-sizing:border-box;	
}
.info-box-tit{
	overflow:hidden;	
	position:relative;
	padding-bottom:15px
}
.info-box-tit h3{
	float:left;
	font-size:19px;
	color:#444;
}
.info-box-tit .date{
	float:right;
	font-size:14px;
	color:#adadad;
	line-height:26px;
}
.info-box-tit .seemore{
	float:right;
	line-height:26px;
}
.seemore{
	position:absolute; top:0; right:0;
	width:25px;
	text-indent:-9999px;
	background:url('../images/main/ico_seemore.png') no-repeat 50%;
	transition:all .5s;
}
.seemore:hover{transform:rotate(180deg);}

.tab-area{	overflow:hidden;}
.tab-area li {
	float:left;
	position:relative;
	color:#999;
	font-size:19px;
	font-weight:bold;
	cursor:pointer;
	padding-left:30px;
	letter-spacing:-1px
}
.tab-area li:first-child{padding-left:0;}
.tab-area li.tab-on{color:#444;}

.tab-area li:after {
	content:'';
	position:absolute;
	top:6px;
	right:-15px;
	width:1px;
	height:16px; 
	background-color:#bdbcbc;
}
.main-notice-area li{
	overflow:hidden;	
	padding:10px 0;
	border-bottom:1px solid #e8e9eb
}
.main-notice-area li:last-child{border-bottom:0}
.notice-tit{
	display:inline-block;
	float:left;
	position:relative;
	text-overflow:ellipsis;
	white-space:nowrap;
	overflow:hidden;
	max-width:80%;
	color:#444;
	font-size:13px;	
	vertical-align:middle;
}
.notice-tit:hover{text-decoration:underline;}
.notice-tit span {display:inline-block; text-align:center; color:#fff; background-color:#f85a3b; width:18px; height:18px; border-radius:9px; margin-right:10px}
.notice-date{
	float:right;
	color:#999;
	font-size:12px;
}
.tab-content {min-height:155px}

/* 환율정보 */
.info-box h3 {font-size:19px; color:#444; font-weight:900; padding-bottom:19px; position:relative}
.info-box h3 span {position:absolute; bottom:5px; right:0; color:#888; font-size:13px; font-weight:normal; }

.table-style {
    table-layout:fixed;
    width:100%;
    border-top:2px solid #222;
    border-right:1px solid #ddd;
    word-break: break-all;
    border-collapse:inherit;
}
.table-style th {
    height:26px;
    font-size:13px;
    color:#222;
    padding:5px 10px;
    font-weight:bold;
    background:#f9f9f9;
    border-left:1px solid #ddd; 
    border-bottom:1px solid #ddd;
    text-align:center;
}
.table-style tbody th { 
    text-align:left;
}
.table-style td {
    height:26px;
    font-size:13px;
    color:#666;
    padding:5px;
    border-left:1px solid #ddd; 
    border-bottom:1px solid #ddd;
    background:#fff;
}
.exchange{
	display:inline-block;
	padding-left:13px;
	font-size:12px;
}
.exchange.up{
	background:url('../images/main/ico_exchange_up.png') no-repeat left 50%;
}
.exchange.down{
	background:url('../images/main/ico_exchange_down.png') no-repeat left 50%;
}

/* quick menu */
.quickArea {width:100%; padding:15px 0; box-sizing:border-box;  margin-top:8px; overflow:hidden; background-color:#fff; border:1px solid #cfcfcf}
.quickBanner li {float:left; width:25%; padding-left:50px; position:relative; box-sizing:border-box; }
.quickBanner li:after {
	content:'';
	position:absolute; right:0; top:50%; margin-top:-25px;  width:1px; height:50px; background-color:#8b9096
}
.quickBanner li:last-child:after {display:none}

.quickBanner li h3 {color:#444; font-size:14px; font-weight:bold}
.quickBanner li p {color:#666; font-size:12px; width:37%}
.quickBanner li span {display:inline-block; position:absolute; top:50%; margin-top:-30px; right:50px; width:60px; height:60px; border-radius:30px; background-color:#cdced0}

.quickBanner li span.ic01 {background:#cdced0 url('../images/main/quickbanner_ico01.png') no-repeat center}
.quickBanner li span.ic02 {background:#cdced0 url('../images/main/quickbanner_ico02.png') no-repeat center}
.quickBanner li span.ic03 {background:#cdced0 url('../images/main/quickbanner_ico03.png') no-repeat center}
.quickBanner li span.ic04 {background:#cdced0 url('../images/main/quickbanner_ico04.png') no-repeat center}

.quickBanner li a:hover span.ic01 {background:#eaeaea url('../images/main/quickbanner_ico01.png') no-repeat center}
.quickBanner li a:hover span.ic02 {background:#eaeaea url('../images/main/quickbanner_ico02.png') no-repeat center}
.quickBanner li a:hover span.ic03 {background:#eaeaea url('../images/main/quickbanner_ico03.png') no-repeat center}
.quickBanner li a:hover span.ic04 {background:#eaeaea url('../images/main/quickbanner_ico04.png') no-repeat center}


/* quick menu */
.toast {top:inherit; bottom:10px; font-family: 'NotoSans',sans-serif; font-size:12px}
.toast li {text-shadow:none}
.toast li.success {background-color:#666; color:#fff}
.toast li.success a {color:#f55c3d;}


/* login */
.login {background-color:#f5f5f5}
.login .logo {top: 119px; left: 50%; margin-left: -325px;}
.login .logo a {width:85px; height:23px; background:url('../images/common/skyebid_logo.png') no-repeat 50%; background-size:100% }

.login .container {padding:160px 0 0 0}
.loginArea { 
	width:754px; margin:0 auto; padding:20px 96px 20px; 
	border:1px solid #cecece; border-top:6px solid #f85a3b;  box-sizing:border-box;
	box-shadow: 7px 7px #dcdcdc; background-color:#fff
}
.loginArea dt h3 {font-size:50px; font-weight:700; color:#f85a3b; letter-spacing:-2px; margin-bottom:25px}
.loginArea dt h3 span {font-size:14px; font-weight:normal; color:#444; padding-left:30px; letter-spacing:-1px;}
.loginArea dt h3 em {font-weight:700; color:#f85a3b}


.loginArea dd ul {width:100%}
.loginArea dd li {margin-bottom:5px}
.loginArea dd li input { width:100%; height:50px; padding:0 20px 0 45px; font-size:14px; border:1px solid #d6dbe0;}
.loginArea dd li input[type="text"]{ background:#fdfdfd url('../images/common/ico_userid.png') no-repeat left 12px center; }
.loginArea dd li input[type="password"]{ background:#fdfdfd url('../images/common/ico_userpw.png') no-repeat left 12px center;}
.loginArea dd li input[type="checkbox"] { width:12px; height:12px; padding:0; font-size:14px; border:1px solid #d6dbe0;}
.loginArea dd li label {font-size:13px; color:#666; font-weight:900; padding:10px 0; display:block}
.loginArea dd button { width:100%; height:58px; border-radius:5px; font-size:20px; font-weight:900; background:#f85a3b; color:#fff}

.loginArea dd li input::placeholder {color:#999}
.loginArea dd .ui-tabs .ui-tabs-nav li.ui-state-default .tab_img1.ui-tabs-anchor{background-image:url('../images/common/login_tab01.png'); background-repeat:no-repeat; background-position:center }
.loginArea dd .ui-tabs .ui-tabs-nav li.ui-state-default .tab_img2.ui-tabs-anchor{background-image:url('../images/common/login_tab02.png'); background-repeat:no-repeat; background-position:center }
.loginArea dd .ui-tabs .ui-tabs-nav li.ui-state-default .tab_img3.ui-tabs-anchor{background-image:url('../images/common/login_tab03.png'); background-repeat:no-repeat; background-position:center }

.loginArea dd .ui-tabs .ui-tabs-nav {
    padding: 0;
    margin: 0;
    border-radius: 0;  
    height: 58px; box-sizing:border-box;
    border: 0;
    border-bottom: 2px solid #797979;
}
.loginArea dd .ui-tabs .ui-tabs-nav li {
    border: 0;
    margin: 0;
    padding: 0;
    border-radius: 0;
    box-sizing: border-box;
	width:33.3%;
    height: 56px;
    line-height: 56px;
    background-color: #fff;  	
}
.loginArea dd .ui-tabs .ui-tabs-nav li:first-child {
    margin-left: 0;
}
.loginArea dd .ui-tabs .ui-tabs-nav li.ui-state-default .ui-tabs-anchor {
    border: 0;
    margin: 0;
    padding: 0;
    display: inline-block;
    height: 56px;
    line-height: 56px;    
    border: 1px solid #797979;
    border-bottom: 0;
    width:100%; box-sizing:border-box;
    padding: 0 20px;
    text-align: center;
    cursor: pointer;
    font-size: 0px; text-indent:-9999px;
    font-weight: bold;
    color: #8d8d8d;
	background-color:#efefef;  	
}
.loginArea dd .ui-tabs .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor {    
    height: 58px;
    line-height: 58px;   
    cursor: pointer;
    border: 2px solid #797979;    
    border-bottom: 0;
    font-size: 0px; text-indent:-9999px;
    color: #f85a3b;
	background-color:#fff; 
}
.loginArea dd .ui-tabs .ui-tabs-panel {
    padding: 20px 0;   
}

/* FAQ */
.faq-box{
	border-top:1px solid #e0e0e0;
	border-bottom:1px solid #e0e0e0;
}
.faq-box + dl{
	border-top:0;
}
.faq-box dt{
	overflow:hidden;
	position:relative;
	padding:15px 50px 15px 43px;
	cursor:pointer;
}
.faq-box dt:before{
	content:"";
	position:absolute; top:50%; right:15px;
	width:16px;
	height:8px;
	margin-top:-4px;
	background:url('../images/common/ico_faq_arrow_down.png') no-repeat 50%;
	transition:all .4s;
}
.faq-box dt.active{
	border-top:1px solid #333;
	border-bottom:1px solid #e0e0e0;
}
.faq-box dt.active:before{
	background:url('../images/common/ico_faq_arrow_up.png') no-repeat 50%;
	transform:rotate(-360deg);
}
.faq-type{
	position:absolute; top:8px; left:15px;
	color:#222;
	font-size:20px; font-weight:900
}
.faq-type.st2{
	color:#666;
}
.faq-box dt .faq-tit{
	display:inline-block;
	color:#444; font-weight:800;
	font-size:14px;
}
.faq-box dt.active .faq-tit{
	color:#222;
}
.faq-box dd{
	display:none;
	position:relative;
	padding:15px 30px 15px 43px;
}
.faq-box dd.active{
	border-bottom:1px solid #333;
}
.faq-box dd .faq-desc{
	color:#666;
	font-size:12px;
	line-height:23px;
}

/* pop board list */
.pop-cont .tbl-list td .subject {display:inline-block; max-width:86%}
.pop-cont .tbl-list td span {display:inline-block; vertical-align:top; margin:0 2px}
.pop-cont .tbl-list td span.ifile {width:17px; height:17px; background:url('../images/common/ico_file.png') no-repeat center; background-size:12px; }
.pop-cont .tbl-list td span.ireply {font-size:12px; color:#888}
.pop-cont .tbl-list td span.ireply:before {content:'[';}
.pop-cont .tbl-list td span.ireply:after {content:']'}
.pop-cont .tbl-list td span.isecret {width:17px; height:17px;  background:url('../images/common/ico_secret_on.png') no-repeat center; background-size:12px;}

/* pop board view */
.boardView {border-top:1px solid #333; border-bottom:1px solid #333}
.boardView dt {padding:20px 15px; font-size:14px; font-weight:900; color:#222}
.boardView dd {border-top:1px solid #e0e0e0; padding:10px 15px}
.boardView dd.date {text-align:right}
.boardView dd.date span {color:#222; font-weight:700}
.boardView dd.date span:first-child {margin-right:20px}
.boardView dd.first {min-height:80px; color:#666; padding:20px 15px }
.boardView dd a.files {display:block; color:#0662fb; margin:3px 0; padding-left:20px; background:url('../images/common/ico_files.png') no-repeat left}

/* pop board reply */
.comment-area p.replytotal {margin-top:20px; font-size:13px; color:#333; padding:5px 0 0 15px; background:url('../images/common/ico_reply_total.png') no-repeat left 8px; background-size:12px }
.comment-area p.replytotal span {padding-left:5px}

.comment-list li{ border-bottom:1px solid #e1e3e4; position:relative }
.comment-list li.reply{ padding:20px 30px 20px 50px; background:#f8f8f9 url('../images/common/bg_reply.png') no-repeat 24px 20px; }
.comment-list li.reply.depth2{ padding:20px 30px 20px 70px; background:#f8f8f9 url('../images/common/bg_reply.png') no-repeat 40px 20px; }
.comment-list li.reply.depth3{ padding:20px 30px 20px 90px; background:#f8f8f9 url('../images/common/bg_reply.png') no-repeat 60px 20px; }
.comment-list li.comment.depth2{ padding:28px 30px 20px 60px; background:url('../images/common/bg_reply.png') no-repeat 24px 28px; }
.comment-list li.comment.depth2 .comment-inner{ padding:0; }
.comment-list li.comment.depth2 .btn-area{ padding:0 10px 0 0; }
.comment-list li.comment.depth3{ padding:28px 30px 20px 140px; background:url('../images/common/bg_reply.png') no-repeat 104px 28px; }
.comment-list li.comment.depth3 .comment-inner{ padding:0; }
.comment-list li.comment.depth3 .btn-area{ padding:0 10px 0 0; }
.comment-list li textarea{ border:0; }
.reply .comment .comment-inner{ padding:0; }
.reply .comment .btn-area{ padding:0 0 20px 0; }

.comment .comment-inner{ padding:28px 10px 0 10px; }
.comment-inner.secret { padding:28px 10px 28px 10px; }

.comment .info{ overflow:hidden;} 
.comment .info .user-area{ float:left; } 
.comment .info .file-link{ float:right; } 
.comment .info .user-area .user{ display:inline-block; color:#222; font-size:13px; font-weight:bold; }
.comment .info .user-area .date{ display:inline-block; position:relative; margin-left:8px; padding-left:8px; font-size:11px; color:#cdcdcd; line-height:19px; }
.comment .info .user-area .date:before{ content:""; position:absolute; left:0; top:3px; bottom:2px; width:1px; background-color:#e0e0e0; }

.comment .txt{ margin:14px 0 18px; font-size:13px; color:#666; word-break:break-all; }
.comment .btn-area{ padding:0 10px 20px 10px; }

.comment.type2{ border:1px solid #afafaf; background-color:#fff; }
.comment.type2 .comment-inner{ padding:20px 20px 0 20px; }
.comment.type2 .btn-area{ position:relative; height:39px; margin-top:18px; padding:7px 20px 6px 20px; border-top:1px solid #ebebeb; box-sizing:border-box; }
.comment.type2 textarea{ margin-top:6px; border:0; }

.comment-list li textarea .cmmtContent{ margin-top:8px; border:1px solid #e7e7e7; }
.comment .file-list{ margin-bottom:15px; }

.cbtn{ display:inline-block; padding:4px 14px 4px 14px; border:1px solid #e84947; background-color:#fff; color:#e84947; font-size:13px; font-weight:700; }
.cbtn.st2{ border:1px solid #888; color:#666; }
.cbtn:hover{ background-color:#e84947; color:#fff; }
.cbtn.st2:hover{ background-color:#888; color:#fff; }

.cbtn2{ position:absolute; top:0; right:-1px; padding:9px 25px 9px; background-color:#fff; color:#e84947; border:1px solid #e84947; font-size:14px;}
.cbtn2:hover{ background-color:#e84947; color:#fff; }

.secretBtn {
	position:absolute; top:50%; right:20px; text-indent:-9999px; font-size:0; margin-top:-10px;
	width:20px; height:20px; background:url('../images/common/ico_secret.png') no-repeat center; background-size:14px;
}

.secretBox input[type="checkbox"] + label {
	display: inline-block;
	width: 40px; padding:0 0 0 20px;
	line-height: 24px;
	background:url('../images/common/ico_secret.png') no-repeat left center; background-size:14px;
	cursor: pointer; color:#666; 
}
.secretBox input[type="checkbox"]:checked + label {
	background:url('../images/common/ico_secret_on.png') no-repeat left center; background-size:14px;
	color:#333; font-weight:900; line-height: 23px;
}
.secretBox input[type="checkbox"] {
	display:none
}

.secretBoxIn {text-align:center}
.secretBoxIn p {font-size:12px; color:#666; margin-bottom:10px}
.secretBoxIn a {border:1px solid #c6c6c6; border-radius:3px; background-color:#f3f3f3; font-size:12px; color:#666; text-align:center; padding:2px 15px}

/* 개인정보 취급정책, 이용약관 */
.privacy-policy h3 {height:60px; font-size:30px; color:#222; position:relative;}
.privacy-policy h3:after {
	content:'';
	position:absolute; bottom:0px; left:0;
	width:29px; height:2px; background:#222
}
.privacy-policy .titBox {font-size:15px; color:#222; line-height:26px; padding:20px 0}
.sequence {padding:10px; border-bottom:1px solid #bbb; border-top:1px solid #bbb;}
.sequence h4 {font-size:14px; color:#222; padding:10px 0 0}
.sequence .privacy_num {list-style-type:none; padding:10px}
.sequence .privacy_num li {font-size:12px; padding:3px 0}
.sequence .privacy_num li a: {color:#666;}
.sequence .privacy_num li a:hover {color:#222; text-decoration:underline}

.privacy h4 {font-size:18px; color:#222; padding:40px 0 10px}
.privacy h4.first {padding:20px 0 10px}
.privacy p {font-size:13px; color:#666; line-height:22px;}
.privacy h5 {font-size:13px; color:#222; font-weight:bold; padding:20px 0 10px}
.privacy .privacy-num li {padding:3px 0 3px 10px; font-size:13px;}
.privacy .privacy-num.type1 {padding:0 0 0 20px}
.privacy .privacy-num.type1 > li {list-style-type:decimal; padding:3px 0}
.privacy .privacy-num.type1 li li {padding:3px 0; }
.privacy .privacy-bar li {padding:3px 0 3px 10px; position:relative; font-size:13px;}
.privacy .privacy-bar li:after {
	content:'-';
	width:4px; height:4px; 
	position:absolute; left:0; top:2px;
} 

/* 공지사항 */ 
.pop-footer {position:fixed; bottom:0; width:100%; padding:0 10px;  box-sizing:border-box; height:35px; line-height:35px;  background-color:#e9e9e9}
.pop-footer .close { 
	display:inline-block;
	width:14px;
	height:14px;
	background:url('../images/common/ico_lnb_close.png') no-repeat 50%;
	text-indent:-9999px;
	position:absolute;
	top:50%;
	right:10px;
	margin-top:-7px;
	transition:all .4s;
}
.pop-footer .close:hover {
	transform:rotate(180deg);
}
.pop-footer label {font-size:13px; color:#666}
.pop-footer input {vertical-align:-1px}