﻿/*대시보드 디자인 추가*/
#stage
{
    overflow: auto;
    overflow-y: hidden;
    height: auto;
}
#stage table tr td
{
    border:0;
}

/*준비중*/
#stage tr td a ready {
	display: block;
	float: left;
	height: 16px;
	background: #90d3ed;
	text-align: center;
	padding: 8px 10px 8px 25px;
	position: relative;
    margin: 0 10px 0 0; 
	font-size: 11px;
	text-decoration: none;
	color: #fff;
	white-space:nowrap;
}
#stage tr td a ready:after {
	content: "";  
	border-top: 16px solid white;
	border-bottom: 16px solid white;
	border-left: 16px solid #90d3ed;
	position: absolute; 
    right: -10px; 
    top: 0;
}
#stage tr td a ready:before {
	content: "";  
	border-top: 16px solid transparent;
	border-bottom: 16px solid transparent;
	border-left: 16px solid white;
	position: absolute; left: 0; top: 0;
}
#stage tr td:first-child a ready {
    padding-left: 15px;
	border-top-left-radius: 5px; border-bottom-left-radius: 5px;
}
#stage tr td:first-child a ready:before {
	display: none; 
}
#stage tr td:last-child a ready{
	padding-right: 15px;
	border-top-right-radius: 5px; border-bottom-right-radius: 5px;
}
#stage tr td:last-child a ready:after {
	display: none; 
}
#stage tr td a ready:hover {
	background: #fa5ba5;
}
#stage tr td a ready:hover:after {
	border-left-color: #fa5ba5;
}
/*준비중*/

/*진행중*/
#stage tr td a ing {
	display: block;
	float: left;
	height: 16px;
	background: #aacf87;
	text-align: center;
	padding: 8px 10px 8px 25px;
	position: relative;
	margin: 0 10px 0 0; 
	font-size: 11px;
	text-decoration: none;
	color: #fff;
	white-space:nowrap;
}
#stage tr td a ing:after {
	content: "";  
	border-top: 16px solid white;
	border-bottom: 16px solid white;
	border-left: 16px solid #aacf87;
	position: absolute; right: -10px; top: 0;
}
#stage tr td a ing:before {
	content: "";  
	border-top: 16px solid transparent;
	border-bottom: 16px solid transparent;
	border-left: 16px solid white;
	position: absolute; left: 0; top: 0;
}
#stage tr td:first-child a ing {
    padding-left: 15px;
	border-top-left-radius: 5px; border-bottom-left-radius: 5px;
}
#stage tr td:first-child a ing:before {
	display: none; 
}
#stage tr td:last-child a ing{
	padding-right: 15px;
	border-top-right-radius: 5px; border-bottom-right-radius: 5px;
}
#stage tr td:last-child a ing:after {
	display: none; 
}
#stage tr td a ing:hover {
	background: #fa5ba5;
}
#stage tr td a ing:hover:after {
	border-left-color: #fa5ba5;
}
/*진행중*/

/*지연*/
#stage tr td a delay {
	display: block;
	float: left;
	height: 16px;
	background: #ffae9a;
	text-align: center;
	padding: 8px 10px 8px 25px;
	position: relative;
    margin: 0 10px 0 0; 
	font-size: 11px;
	text-decoration: none;
	color: #fff;
	white-space:nowrap;
}
#stage tr td a delay:after {
	content: "";  
	border-top: 16px solid white;
	border-bottom: 16px solid white;
	border-left: 16px solid #ffae9a;
	position: absolute; right: -10px; top: 0;
}
#stage tr td a delay:before {
	content: "";  
	border-top: 16px solid transparent;
	border-bottom: 16px solid transparent;
	border-left: 16px solid white;
	position: absolute; left: 0; top: 0;
}
#stage tr td:first-child a delay {
    padding-left: 15px;
	border-top-left-radius: 5px; border-bottom-left-radius: 5px;
}
#stage tr td:first-child a delay:before {
	display: none; 
}
#stage tr td:last-child a delay{
	padding-right: 15px;
	border-top-right-radius: 5px; border-bottom-right-radius: 5px;
}
#stage tr td:last-child a delay:after {
	display: none; 
}
#stage tr td a delay:hover {
	background: #fa5ba5;
}
#stage tr td a delay:hover:after {
	border-left-color: #fa5ba5;
}
/*진행중*/

/*완료*/
#stage tr td a comp {
	display: block;
	float: left;
	height: 16px;
	background: #7490cb;
	text-align: center;
	padding: 8px 12px 8px 23px;
	position: relative;
    margin: 0 10px 0 0; 
	font-size: 11px;
	text-decoration: none;
	color: #fff;
	white-space:nowrap;
}
#stage tr td a comp:after {
	content: "";  
	border-top: 16px solid white;
	border-bottom: 16px solid white;
	border-left: 16px solid #7490cb;
	position: absolute; right: -10px; top: 0;
}
#stage tr td a comp:before {
	content: "";  
	border-top: 16px solid transparent;
	border-bottom: 16px solid transparent;
	border-left: 16px solid white;
	position: absolute; left: 0; top: 0;
}
#stage tr td:first-child a comp {
    padding-left: 15px;
	border-top-left-radius: 5px; border-bottom-left-radius: 5px;
}
#stage tr td:first-child a comp:before {
	display:none; 
}
#stage tr td:last-child a comp{
	padding-right: 15px;
	border-top-right-radius: 5px; border-bottom-right-radius: 5px;
}
#stage tr td:last-child a comp:after {
	display: none; 
}
#stage tr td a comp:hover {
	background: #fa5ba5;
}
#stage tr td a comp:hover:after {
	border-left-color: #fa5ba5;
}
/*완료*/

.stage_ready
{
    width:15px;
	background: #90d3ed;
	text-decoration: none;
	color: #fff;
}
.stage_ing
{
    width:15px;
	background: #aacf87;
	text-decoration: none;
	color: #fff;
}
.stage_delay
{
    width:15px;
	background: #ffae9a;
	text-decoration: none;
	color: #fff;
}
.stage_comp
{
    width:15px;
	background: #7490cb;
	text-decoration: none;
	color: #fff;
}