.window-overlay {
	align-items: flex-start;
	justify-content: center;
	background-color: #000000a3;
	display: none;
	height: 100%;
	left: 0;
	overflow-y: auto;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 20;
	&.window-up {
		display: flex;
	}
	.window {
		background-color: #f4f5f7;
		border-radius: 2px;
		display: block;
		margin: 48px 0 80px;
		overflow: hidden;
		position: relative;
		width: 768px;
		z-index: 25;
		cursor: auto;
		@include for-mobile-layout {
			margin: 36px 8px;
			width: auto;
		}
		.window-wrapper {
			outline: none;
			.dialog-close-button {
				@include flex-row-center;
				border-radius: 50%;
				color: #42526e;
				margin: 4px;
				overflow: hidden;
				padding: 4px;
				position: absolute;
				right: 0;
				top: 0;
				transition: background-color 85ms, color 85ms;
				z-index: 2;
				height: 40px;
				width: 40px;
				&:hover {
					background-color: #00000014;
					color: #42526e;
				}
				&.dark {
					background-color: #00000014;
					color: #42526e;
					&:hover {
						background-color: #00000029;
					}
				}
				.icon-close {
					font-size: 20px;
				}
			}
			.task-detail {
				min-height: 600px;
				width: 100%;
				.window-main-col {
					float: left;
					margin: 0;
					min-height: 24px;
					overflow-x: hidden;
					overflow-y: auto;
					padding: 0 8px 8px 16px;
					position: relative;
					width: 552px;
					z-index: 0;
					@include for-mobile-layout {
						float: none;
						padding: 8px;
						width: auto;
					}
				}
			}
		}
	}
}
