.attachment_fb{
	position: relative;
	.item_afb{
		position: relative;
		float: left;
		margin-top: 10px;
		margin-right: 10px;
		padding: 5px;
		width: 290px;
		height: 30px;
		&:hover{
			background-color: #F5F8FA;
			.right_afb{
				display: block;
			}
			.status{
				background: #F5F8FA;
			}
		}
	}
	.left_afb{
		position: relative;
	    float: left;
	    width: 30px;
	    height: 30px;
	    background-color: #E4EBF0;
		margin-right: 10px;
		text-align: center;
		.img_up {
            width: auto;
            height: auto;
            max-width: 100%;
            max-height: 100%;
        }
	}

	.img_afb{
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		margin: auto;
		background-color: #fff;
		max-width: 30px;
		max-height: 30px;
	}
	.ico_afb{
		display: inline-block;
		width: 30px;
		height: 30px;
		line-height: 30px;
		text-align: center;
		font-size: 30px;
		background-color: #F5F8FA;
	}
	.center_afb {
		max-width: 190px;
		float: left;
		.name {
			font-size: 12px;
			color: #647481;
			line-height: 20px;
			margin-top: 6px;
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;
		}
		.progress, .progress-bar {
			height: 4px;
			border-radius: 2px;
			
		}
		.progress {
			background-color: #E3ECF1;
		}
		.progress-bar {
			width: 0%;
			background-color: #1687D9;
		}
		.status {
			position: absolute;
			background: #FFF;
			right: 60px;
		}
		.status-error {
			color: #EB4447;
		}
		.status-success {
			color: #2DAB92;
		}
	}
	.right_afb {
		display:none;
		float: right;
		line-height: 30px;

		.action-iocn {
			font-size: 14px;
			vertical-align: middle;
			color: #A9B8BF;
			&:hover {
				color: #1687D9;
			}
		}
		.action-iocn-delete {
			
			&:hover {
				color: #EB4447;
			}
		}
	}
	.shade_afb{
		background-color: $gay3;
		@include opacity(50);
		width: 100px;
		height: 100px;
		position: absolute;
		text-align: center;
		top:0;
		left:0;
		display: none;
	}
	.zoom-afb{
		position: absolute;
		left:35.5px;
		top:35.5px;
		display: none;
	}
	.name_afb{
		color:$gay2;
	}
	.action_afb{
		display: none;
	}
	
}
//附件预览较大图片样式
.attachment_fb_big{
	position: relative;
	margin-top: 20px;
	font-family:PingFangSC-Regular;
	.item_afb{
		margin: 0 40px 5px 0;
		float: left;
		.img_afb_wrapper {
			width: 98px;
			height: 98px;;
			line-height: 97px;
			background: #f5f8fa;
			border: 1px solid #e9edf0;
			border-radius: 1px;
			text-align: center;
			.img_afb {
				max-width: 100%;
				max-height: 100%;
			}
			.ico_afb {
				font-size: 50px;
				line-height: 98px;
			}
		}
		.name_afb {
			width: 100px;
			font-size:12px;
			color:#36434d;
			line-height:20px;
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
		}
		.operation_afb {
			height: 20px;
			line-height:20px;
			a {
				font-size: 12px;
				margin-right: 10px;
				color:#005999;
				display: none;
				&:hover {
					color: #1687d9;
				}
			}
		}
		&:hover {
			.operation_afb {
				a {
					display: inline
				}
			}
		}
	}
	
}