html,body{
    width:100%;
    height:100%;
    margin: 0;
    padding: 0;
}
.box{
    width:100%;
    height:100%;
}
.row{
    position: relative;
    height:100%;
    margin: 0;
}
.box-left{
    height:100%;
    border-right: 1px solid #000;
}
.box-right{
    background: #e5e5e5;
    height:100%;
}
span{
    color: red;
}
.search{
    margin-top: 10px;
}
.done{
    margin-top: 10px;
    font-size: 15px;
}
.list-con{
    position: relative;
    width:100%;
    padding:3px 0;
    border-bottom: 1px solid #ccc;
}
.list-con input{
    border:0;
    width:80%;
}
.listcon input:focus{
    outline: none;
}
.remove{
    visibility: hidden;
    opacity: 0;
    transition: opacity 1s ease;
    position: absolute;
    right:2px;top:4px;
}
.list-con:hover .remove{
    visibility: visible;
    opacity: 1;
}
.add-list{
    position: absolute;
    bottom:20px;
    left:20px;
    cursor: pointer;
}

.header{
    width:100%;
    height:100px;
    border-bottom: 2px solid #ccc;
}
.header .title{
    float:left;
    line-height: 100px;
    font-size:25px;
}
.header .add-con{
    float:right;
    line-height: 100px;
    font-size:25px;
    cursor: pointer;
}
.listcon{
    position: relative;
}