.materialCreateBox{height:100%}.materialCreateBox .left{float:left;width:320px;border:1px solid #d0d0d0}.materialCreateBox .left .mask{position:absolute;left:0;right:0;top:0;bottom:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;display:none}.materialCreateBox .left .mask i{font-size:20px}.materialCreateBox .left .topList{height:160px;border-bottom:1px solid #d0d0d0;position:relative}.materialCreateBox .left .topList img{width:100%;height:100%}.materialCreateBox .left .topList p{position:absolute;bottom:0;left:0;right:0;background:rgba(0,0,0,.6);padding:8px;color:#fff;line-height:30px}.materialCreateBox .left .otherList{position:relative;padding:20px 14px;border-bottom:1px solid #d0d0d0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.materialCreateBox .left .otherList .otherText{margin-right:15px}.materialCreateBox .left .otherList .otherImg{width:78px;height:78px}.materialCreateBox .left .otherList .otherImg img{width:100%;height:100%}.materialCreateBox .left .addList .addbox{height:60px;margin:20px 14px;border:2px dotted #d9dadc;text-align:center;line-height:60px}.materialCreateBox .right{padding-left:360px;height:90%}.materialCreateBox .right .rightBox{height:100%;overflow:scroll;border:1px solid #d0d0d0;padding:20px}.materialCreateBox .otherList:hover .mask,.materialCreateBox .topList:hover .mask{display:-webkit-box;display:-ms-flexbox;display:flex;background:hsla(0,0%,78.4%,.55)}.materialCreateBox .bottom{margin-top:5px;text-align:center}