
/* 阅读框 */
.drag-main {
	position: fixed;
	right: 1.5%;
	bottom: 2%;
	display: none;
	max-height: 75vh;
	grid-template-columns: 10px auto 0px;
	grid-template-rows: 10px auto 10px;
	background-color: #fff;
	box-shadow: 0 4px 12px rgba(0,0,0,.15);
	z-index: 100;
  -webkit-user-select:none;
  -moz-user-select:none;
  -ms-user-select:none;
  user-select:none;
}

.drag-main>div {
	box-sizing: border-box;
}

/* 移动 */
.border-left-top {
	/* cursor: nw-resize; */
	width: 10px;
	height: 10px;
}

/* 上下剪头 */
/* .border-top {
	cursor: s-resize;
} */
/* .border-left {
	cursor: w-resize;
} */
/* .border-right {
	cursor: w-resize;
} */
/* .border-bottom {
	cursor: s-resize;
} */
/* 左下右上斜箭头 */
/* .border-top-right {
	cursor: ne-resize;
} */
.border-top-right {
	width: 10px;
	height: 10px;
}
.border-left, .border-right {
	width: 10px;
	height: 100%;
}
.border-bottom-left {
	width: 10px;
	height: 10px;
}
.border-right-bottom {
	width: 10px;
	height: 10px;
}
/* 中间区域 */
.drag-middle-item {
	display: flex;
	max-height: calc(75vh - 20px);
}
.border-top, .border-bottom {
	height: 10px;
	width: 100%;
}
.drag-top-item, .drag-bottom-item {
	display: flex;
}
/* 工具栏 */
.tool-bar {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
}
.drag-btn {
	/* width: 100px; */
	position: absolute;
	left: 12px;
	top: 20px;
	z-index: 101;
	margin-top: -15px;
	user-select:none;
	/* cursor: move; */
}
.close-btn {
	position: absolute;
  right: 0px;
  top: -30px;
	width: 30px;
  height: 30px;
  line-height: 30px;
  font-size: 20px;
  background-color: #fff;
	text-align: center;
	user-select:none;
	cursor: pointer;
  box-shadow: -5px -4px 12px rgba(0,0,0,.15);
	z-index: 101;
}

/* 正文区域 */
.drag-content {
	flex: 1;
	overflow: auto;
	background-color: #fff;
	word-break: break-all;
	word-wrap: break-word;
	cursor: pointer;
} 
.drag-content-part {
	position: relative;
	overflow: auto;
}
/* .open-invitation-btn:hover {
	background-color: #AA1118;
} */
#drag-show {
	position: fixed;
	display: none;
	width: 50px;
	height: 50px;
	line-height: 50px;
	bottom: 18px;
	right: 18px;
	/* background-color: transparent; */
	background-color: #AA1118;
	box-shadow: 0 4px 12px rgba(0,0,0,.15);
	border-radius: 50%;
	cursor: pointer;
	z-index: 102;
	/* background-image: url(../pic/logo.png) no-repeat center; */
}
.drag-show-btn-container {
	display: flex;
	width: 30px;
	height: 100%;
	justify-content: center;
	margin:  0 auto;
	align-items: center;
}
.drag-show-btn-container>img {
	display: inline-block;
}

/* 滚动条 */
.drag-content::-webkit-scrollbar, .drag-content-part::-webkit-scrollbar{
	width: 10px;
	height: 10px;
}
.drag-content::-webkit-scrollbar-corner, .drag-content-part::-webkit-scrollbar-corner {
	background: #fff;
}
.drag-content::-webkit-scrollbar-thumb, .drag-content-part::-webkit-scrollbar-thumb {
	background-color: #ccc;
	border-radius: 4px;
}
.drag-content::-webkit-scrollbar-track, .drag-content-part::-webkit-scrollbar-track {
	border-radius: 4px;
	background: #eee;
}
.drag-img {
	width: 100%;
}