.uploader-wrap { line-height:24px; white-space:nowrap; }

.uploader-wrap button
,.uploader-wrap img
,.uploader-wrap input { width:24px; height:24px; line-height:24px; overflow:hidden; padding:0; vertical-align:middle; }

.uploader-wrap .uploader-ctrl
,.uploader-wrap .uploader-index { width:24px; height:24px; line-height:24px; position:relative; display:inline-block; vertical-align:middle; }

.uploader-wrap .uploader-index div { width:24px; height:24px; position:absolute; display:inline-block; }
.uploader-wrap .uploader-index div p { width:100%; display:none; position:absolute; background:rgba(0, 0, 0, 0.5); white-space:normal; padding:5px; }
.uploader-wrap .uploader-index div p a { width:100%; color:white; white-space:normal; }
.uploader-wrap .uploader-index div img { border-radius:12px; border:1px solid silver; }
.uploader-wrap .uploader-index button { width:24px; height:24px; position:absolute; opacity:0; transition:none; -webkit-transition:none; -o-transition:none; }

.uploader-wrap .uploader-index:hover div { width:auto; height:256px; margin-top:-256px; position:absolute; z-index:100; background-color:white; border:1px solid #999; box-shadow:0px 0px 1px 1px #999; }
.uploader-wrap .uploader-index:hover div p { display:block; }
.uploader-wrap .uploader-index:hover div img { min-width:100px; width:auto; height:250px; border-radius:0; margin:2px;  }
.uploader-wrap .uploader-index:hover button { position:static; opacity:1; }

.uploader-wrap input[type="file"] { position:absolute; opacity:0; z-index:999; cursor:pointer; }

.uploader-res { list-style:none; margin:0; padding:0; }
.uploader-res img { width:auto; height:1rem; vertical-align:middle; }
.uploader-res a { font-size:1rem; line-height:1rem; }




.uploadOneWrap .uploadOneMultiBtn { width:150px; height:30px; overflow:hidden; display:inline-block; position:relative; background-color:white; border:2px solid #BBB; border-radius:4px; }
.uploadOneWrap .uploadOneMultiBtn .desc { display:none; }
.uploadOneWrap .uploadOneMultiBtn button { width:100%; height:100%; font-size:15px; font-weight:bold; background-color: transparent; }
.uploadOneWrap .uploadOneMultiBtn button .desc { color:#F55; }
.uploadOneWrap .uploadOneMultiBtn input { position:absolute; width:100%; height:100%; margin:0; padding:0px; opacity:0; cursor:pointer; }

.uploadOneWrap:hover .help { display:none; }
.uploadOneWrap:hover .uploadOneMultiBtn { width:100%; height:60px; border:5px dashed #8dadff; }
.uploadOneWrap:hover .uploadOneMultiBtn button {  }
.uploadOneWrap:hover .uploadOneMultiBtn button .desc { display:block; }


.uploadOneWrap ul { list-style:none; padding:0; margin:0; }
.uploadOneWrap ul li { width:20%; list-style:none; padding:0; margin:0; float:left; }
.uploadOneWrap .uploadOneBox { position:relative; padding:0; border:1px solid #ddd; margin:5px; /* margin-left:5%; margin-bottom:5%; */ color:#333; background:#fff; font-size:16px; }

.uploadOneWrap .uploadOneBox .uploadOneCont { position: relative; height:120px; }

.uploadOneWrap .uploadOneBox .uploadOneCont
,.uploadOneWrap .uploadOneBox .uploadOneThumb
,.uploadOneWrap .uploadOneBox .uploadOneText { text-align: center; }


.uploadOneWrap .uploadOneBox .uploadOneUpload { width:50%; height:100%; position:absolute; margin:0; padding:0px; opacity:0; cursor:pointer; }
.uploadOneWrap .uploadOneBox .uploadOneMove { width:50%; height:100%; position:absolute; left:50%; margin:0; padding:0px; opacity:0; cursor:move; }

.uploadOneWrap .uploadOneBox.onMove .uploadOneUpload { width:0%; }
.uploadOneWrap .uploadOneBox.onMove .uploadOneMove { width:100%; left:0%; z-index:110; }


.uploadOneWrap .uploadOneBox .uploadOneMask
,.uploadOneWrap .uploadOneBox .uploadOneInput { width:50%; height:100%; position:absolute; margin:0; padding:0px; opacity:0; display:block; cursor:pointer; }

.uploadOneWrap .uploadOneBox .uploadOneMask { width:100%; z-index:110; }
.uploadOneWrap .uploadOneBox .uploadOneInput { z-index:100; }

.uploadOneWrap .uploadOneBox.onHover .uploadOneMask { display:none; }

.uploadOneWrap .uploadOneBox.onHover .uploadOneUpload
,.uploadOneWrap .uploadOneBox.onHover .uploadOneMove
,.uploadOneWrap .uploadOneBox.onMove .uploadOneUpload
,.uploadOneWrap .uploadOneBox.onMove .uploadOneMove { color:black; font-weight:bold; padding:40px 0; border:5px dashed #8dadff; opacity:1; background-color:rgb(255,255,255,0.8); }

.uploadOneWrap .uploadOneBox .uploadOneThumb { width:100%; height:120px;  /* border-radius:100px; */ margin:0 auto; display:inline-block;}

.uploadOneWrap .uploadOneBox .uploadOneText { width:100%; display:inline-block; border-top:1px solid #ddd; padding:5px 0; white-space:nowrap; font-weight:500;  cursor:move; }

.uploadOneWrap .uploadOneBox.onHover
,.uploadOneWrap .uploadOneBox:focus
,.uploadOneWrap .uploadOneBox.onMove
,.uploadOneWrap .uploadOneBox.onMove { color:#2c4d9c; border:1px solid #2c4d9c;}

.uploadOneWrap .uploadOneBox.onHover .uploadOneCont .uploadOneThumb
,.uploadOneWrap .uploadOneBox.onMove .uploadOneCont .uploadOneThumb { } 

.uploadOneWrap .uploadOneBox.onHover .uploadOneText
,.uploadOneWrap .uploadOneBox:focus .uploadOneText
,.uploadOneWrap .uploadOneBox.onMove .uploadOneText
,.uploadOneWrap .uploadOneBox.onMove .uploadOneText { border-top:1px solid #2c4d9c; font-weight:600; }
