.process {
    height: 50px;
    margin-bottom: 10px
}

.process li {
    float: left;
    width: 20%
}

.process li .item {
    position: relative;
    padding-right: 27px
}

.process li .item .step {
    height: 50px;
    text-align: center;
    line-height: 50px
}

.process li .item .step i {
    width: 30px;
    height: 30px;
    display: inline-block;
    border-radius: 50px;
    text-align: center;
    line-height: 30px
}

.process li .item .step label {
    font-size: 18px
}

.process li .item span {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 27px;
    display: inline-block;
    background: url(/regBook/framework/images/guide/arrow-3f559791b1156a27f29b6a5ff0b52214.png)
}

.process li .item.passed .step {
    background-color: #11a9e2
}

.process li .item.passed .step i {
    background-color: #fff;
    color: #11a9e2
}

.process li .item.passed .step label {
    color: #fff
}

.process li .item.passed span {
    background-position: 0 -150px
}

.process li .item.curr-pre .step {
    background-color: #11a9e2
}

.process li .item.curr-pre .step i {
    background-color: #fff;
    color: #11a9e2
}

.process li .item.curr-pre .step label {
    color: #fff
}

.process li .item.curr-pre span {
    background-position: 0 -100px
}

.process li .item.current .step {
    background-color: #f45438
}

.process li .item.current .step i {
    background-color: #fff;
    color: #f45438
}

.process li .item.current .step label {
    color: #fff
}

.process li .item.current span {
    background-position: 0 -50px
}

.process li .item.laters .step {
    background-color: #e3e3e3
}

.process li .item.laters .step i {
    background-color: #272636;
    color: #e3e3e3
}

.process li .item.laters .step label {
    color: #000
}

.process li .item.laters span {
    background-position: 0 0
}

.process li .item.last .step {
    background-color: #e3e3e3
}

.process li .item.last .step i {
    background-color: #272636;
    color: #e3e3e3
}

.process li .item.last .step label {
    color: #000
}

.process li .item.last span {
    background: #e3e3e3
}

.opt-buttons {
    margin-bottom: 10px
}

.opt-buttons .easyui-linkbutton {
    margin-right: 5px
}

.basic-info {
    position: relative;
    padding: 10px
}

.editor-state {
    height: 200px
}

.time-line {
    padding: 5px
}

.time-line .time-item {
    position: relative;
    padding-left: 120px
}

.time-line .time-item.date {
    height: 44px;
    line-height: 44px
}

.time-line .time-item.date .content-left > span {
    color: #11a9e2;
    font-size: 14px;
    font-weight: bold
}

.time-line .time-item.date .content-left > label > i {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 12px;
    width: 1px;
    background-color: #b5b5b5
}

.time-line .time-item.last {
    height: 44px;
    line-height: 44px
}

.time-line .time-item.last .content-left > label > i {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 12px;
    width: 1px;
    background-color: #b5b5b5
}

.time-line .time-item.last .content-left > label > span {
    width: 10px;
    height: 10px;
    background: url(/regBook/framework/images/timeline/down-7b2e3524fc2fda2cd86211d532861aa3.png);
    left: 7px;
    top: 34px
}

.time-line .time-item.time.important .content-left > label > span {
    background-position: 0 -10px
}

.time-line .time-item.time.important .content-right .left-arrow {
    background: url(/regBook/framework/images/timeline/arrow-16351dfaf5edcefe4c1f2cee5c12d4b3.png) no-repeat;
    background-position: 0 -13px
}

.time-line .time-item.time.important .content-right .detail-outer .detail {
    border-left: 3px solid #f45438
}

.time-line .time-item.time .content-left > span {
    position: absolute;
    top: 50%;
    height: 20px;
    margin-top: -10px;
    line-height: 20px;
    color: #000;
    font-size: 12px;
    text-align: right
}

.time-line .time-item.time .content-left > label > span {
    position: absolute;
    width: 10px;
    height: 10px;
    top: 50%;
    margin-top: -5px;
    left: 7px;
    background: url(/regBook/framework/images/timeline/dot-f980c7f083c5d1b4095cc9efa55132fe.png) no-repeat
}

.time-line .time-item.time .content-left > label > i {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 12px;
    width: 1px;
    background-color: #b5b5b5
}

.time-line .time-item .content-left {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 120px
}

.time-line .time-item .content-left > span {
    position: absolute;
    right: 24px;
    top: 0;
    bottom: 0;
    width: 96px;
    text-align: center
}

.time-line .time-item .content-left > label {
    position: absolute;
    top: 0;
    right: 0;
    width: 24px;
    bottom: 0
}

.time-line .time-item .content-left > label > span {
    position: absolute;
    width: 16px;
    height: 16px;
    top: 14px;
    left: 4px;
    background: url(/regBook/framework/images/timeline/blank-dfe9c1d0f6197793560f150f704ada49.png) no-repeat;
    z-index: 1
}

.time-line .time-item .content-left > label > i {
    position: absolute;
    top: 0;
    left: 12px;
    width: 1px;
    background-color: #b5b5b5;
    z-index: 0
}

.time-line .time-item .content-left.first > label > i {
    position: absolute;
    height: 14px;
    top: 30px
}

.time-line .time-item .content-right {
    position: relative;
    padding-left: 11px
}

.time-line .time-item .content-right .left-arrow {
    position: absolute;
    width: 11px;
    height: 13px;
    top: 50%;
    margin-top: -7px;
    left: 0;
    background: url(/regBook/framework/images/timeline/arrow-16351dfaf5edcefe4c1f2cee5c12d4b3.png) no-repeat
}

.time-line .time-item .content-right .detail-outer {
    padding: 10px 0
}

.time-line .time-item .content-right .detail-outer .detail {
    padding: 5px;
    border: 1px solid #cacaca;
    border-left: 3px solid #11a9e2;
    box-shadow: 2px 3px #ededed;
    line-height: 28px
}

.time-line .time-item .content-right .detail-outer .detail > div .name {
    font-size: 14px;
    font-weight: bold;
    color: #000;
    margin-right: 2px
}

.time-line .time-item .content-right .detail-outer .detail > div label {
    color: #939393;
    font-size: 12px;
    margin-right: 10px
}

.time-line .time-item .content-right .detail-outer .detail > div .status {
    color: #000;
    font-size: 12px
}

.time-line .time-item .content-right .detail-outer .detail > div .status .order {
    color: #11a9e2;
    font-size: 12px
}