.fileManager {
	.flexCC.buttonWrap {
		display: none;
	}

	.popupWrap {
		.retryPop {
			padding: 20px 50px 50px;

		}
	}

	.rsWrapper {
		padding: 78px 0;
		margin: 0 auto;
		display: flex;
		flex-direction: column;
		align-items: center;

		>h4 {
			width: 100%;
			font-weight: 600;
			border-bottom: 1px solid var(--Grey-800);
			padding: 20px 0;
			margin-bottom: 20px;
		}

		.grid-item {
			width: 100%;
			height: auto;
			margin-bottom: 0;

			.favor {
				background: linear-gradient(180deg, rgba(0, 0, 0, 0.30) 0%, rgba(102, 102, 102, 0.00) 100%);

				.pinkBtn {
					border-radius: 100px;
					padding: 3px 10px 3px 10px;
					display: flex;
					align-items: center;
					gap: 4px;
				}

			}

			&.hidden {
				>div {
					opacity: 0.7;
					filter: blur(6px);
					-webkit-filter: blur(6px);
				}
			}

			.tit {
				position: relative;

				h5 {
					white-space: nowrap;
					overflow: hidden;
					text-overflow: ellipsis;
				}
			}

			.imgWrap {

				>ul {
					&.one {
						>li {
							width: 100%;
							aspect-ratio: 2 / 1;
						}
					}

					>li {
						height: auto;
						aspect-ratio: 1 / 1;
						background-color: transparent;

						img {
							min-width: 100%;
							min-height: 100%;
							object-fit: cover;
						}

					}
				}

			}


		}

		.search {
			border-radius: 6px;
			background: var(--Grey-800);
			color: var(--Grey-500);
			width: 207px;
			display: flex;
			padding: 7px 10px;
			justify-content: flex-start;
			align-items: center;

			i {
				font-size: 16px;
				margin: 0;
			}

			input {
				width: calc(100% - 30px);
				height: 100%;
				background: transparent;
				border: none;
				/* padding: 0 10px; */
				color: var(--fff);
				font-size: 14px;
				font-weight: 500;

				&:-webkit-autofill,
				&:-webkit-autofill:hover,
				&:-webkit-autofill:focus,
				&:-webkit-autofill:active {
					-webkit-text-fill-color: var(--Grey-500);
					/* 원하는 글자색 */
					-webkit-box-shadow: 0 0 0px 1000px var(--Grey-500) inset;
					/* 원하는 배경색 */
					box-shadow: 0 0 0px 1000px var(--Grey-800) inset;
					transition: background-color 5000s ease-in-out 0s;
				}
			}
		}

		button {
			padding: 6px 12px;
			border-radius: 6px;
			font-size: 13px;
			font-weight: 700;
			line-height: 140%;


			i {
				font-size: 16px;
				margin-right: 4px;
			}
		}
	}

	.tabBox {
		width: 100%;
		margin-bottom: 22px;
		display: flex;
		color: var(--fff);
		justify-content: space-between;
		border-bottom: 1px solid var(--Grey-800);
		padding-top: 60px;
		align-items: flex-start;

		div {
			display: flex;
			align-items: center;
			gap: 6px;

			>ul {
				display: flex;
				gap: 20px;
				margin-bottom: -1px;
				align-items: center;

				>h4 {
					font-weight: 700;
					line-height: 140%;
				}

				>li {
					font-size: 16px;
					font-weight: 700;
					background: none;
					color: var(--Grey-600);
					padding: 12px 4px;
					border-bottom: 3px solid transparent;
					cursor: pointer;
					display: flex;
					align-items: center;
					gap: 6px;
					font-size: 14px;





					>i {
						font-size: 22px;
					}

					>span em {
						font-size: 12px;
						font-weight: 400;
					}

				}

				.active {
					color: var(--fff);
					border-bottom: 3px solid var(--fff);
				}

				h4.pc {
					color: var(--fff);
				}
			}
		}
	}

	.tab {
		background: #000000;
		height: 31px;
		border-radius: 15px;
		margin: 0 14px 0 0;
		display: flex;

		div {
			padding: 6px 16px;
			border-radius: 15px;
			color: var(--fff);
			font-size: 16px;
			cursor: pointer;
			display: flex;
			align-items: center;
		}

		&.active {
			background: var(--Pink-900);
			color: var(--fff);
		}

		i {
			font-size: 20px;
			margin: 0 8px 0 0;
		}
	}

	.tabset {
		width: 100%;

		.dataset_list {
			display: grid;
			grid-template-columns: repeat(auto-fill, minmax(0, 1fr));
			gap: 20px;
			width: 100%;
			max-width: 100%;

			&.one {
				grid-template-columns: repeat(1, minmax(0, 1fr));
			}

			&.two {
				grid-template-columns: repeat(2, minmax(0, 1fr));
			}

			&.three {
				grid-template-columns: repeat(3, minmax(0, 1fr));
			}

			&.four {
				grid-template-columns: repeat(4, minmax(0, 1fr));
			}

			&.five {
				grid-template-columns: repeat(5, minmax(0, 1fr));
			}
		}

	}

	.loadingBarWrap {
		right: 20px;
		left: auto;
		transform: translate(0, 0);

		.iconWrap {
			font-size: 24px;
			position: absolute;
			right: 20px;
			display: flex;

			i {
				cursor: pointer;
			}

			i.icon-arrow_right_small {
				-webkit-transform: rotate(90deg);
				transform: rotate(90deg);
			}
		}

		.loadingBar {
			p {
				margin: 0;
				font-weight: 500;
			}
		}

		.hide {
			-webkit-transition: all 0.3s;
			-moz-transition: all 0.3s;
			-ms-transition: all 0.3s;
			-o-transition: all 0.3s;
			transition: all 0.3s;

			h5 {
				font-size: 16px;
				font-weight: 600;
				line-height: 140%;
				padding-bottom: 12px;
				border-bottom: 1px solid var(--Grey-700);
				margin-bottom: 20px;
			}

			p {
				line-height: 140%;
				margin-bottom: 12px;
				font-weight: 500;
			}
		}

		.buttonWrap {
			display: flex;
			gap: 6px;
			justify-content: flex-end;
			margin-top: 24px;

			.greyBtn700 {
				padding: 4px 10px;
				font-weight: 600;
				line-height: 140%;
			}
		}

		&.hide {
			.hide {
				height: 0;
				overflow: hidden;
				margin: 0;
			}

			.loadingBar {
				margin-right: 70px;
			}

			.iconWrap {
				top: 50%;
				transform: translate(-0%, -50%);



				i.icon-arrow_right_small {
					-webkit-transform: rotate(-90deg);
					transform: rotate(-90deg);
				}

				;
				top: 5;
			}

		}
	}

}

/* added by 희문 */
.renamePop {
	.pop {
		padding: 40px;
		width: calc(100% - 40px);
		max-width: 700px;

		.tit {
			display: block;
			justify-content: space-between;
			font-size: 20px;
			font-weight: 700;
			margin-bottom: 12px;
			text-align: left;
		}

		.desc {
			display: block;
			font-size: 16px;
			font-weight: 400;
			line-height: 140%;
			margin-bottom: 20px;
			color: #969696;
			text-align: left;
			font-weight: 500;
		}

		form {
			margin-bottom: 40px;

			input[type=text] {
				background: var(--Grey-850);
				border-radius: 8px;
				line-height: 40px;
				padding: 0 16px;
				font-weight: 500;
			}
		}

		flexCC {
			.greyBtn700 {}

			.pinkBtn {}
		}
	}
}

@media (max-width: 1000px) {
	.fileManager {
		& .rsWrapper {
			& .grid-item {
				.favor {
					.gridItemPop {
						top: 10px;
						right: 30px;
					}
				}
			}
		}
	}
}

@media (max-width: 900px) {

	.fileManager {
		.rsWrapper {
			padding: 56px 0 0;

			.search+button.pinkBtn {
				position: fixed;
				font-size: 13px;
				font-weight: 600;
				line-height: 140%;
				bottom: 20px;
				left: 50%;
				padding: 10px 16px 10px 12px;
				border-radius: 999px;
				transform: translate(-50%, -0%);
				gap: 4px;
				z-index: 5;





				i {
					font-size: 16px;
				}
			}

			.grid-item {
				.favor {
					.gridItemPop {
						top: 3px;
						right: 30px;
					}
				}
			}
		}

		.tabBox {
			margin-top: 0;
			align-items: center;
			padding: 0 20px;

			>div {
				color: var(--Grey-300);
				gap: 4px;

				>ul {
					gap: 12px;

					li {
						font-weight: 600;
						padding: 12px 0;

						span {
							font-weight: 800;
						}
					}
				}

				i {
					font-size: 24px;
				}
			}
		}

		.loadingBarWrap {
			left: 20px;
			width: auto;

			.buttonWrap {
				font-size: 16px;

				button.greyBtn700 {
					flex: 1;
					line-height: 160%;
					padding: 8px;
					border-radius: 8px;

					&+button {
						background: var(--Pink-900);
					}
				}
			}
		}

		&.fileSelect {
			p.description {
				background: var(--Grey-850);
				font-size: 14px;
				font-style: normal;
				font-weight: 500;
				line-height: 140%;
				padding: 12px 20px;
			}

			.tabBox {
				padding: 10px 20px;
				border: 0;
				margin: 0;

				.tabs {
					display: none;
				}



			}

			.flexCC.buttonWrap {
				position: fixed;
				left: 0;
				right: 0;
				bottom: -90px;
				background: var(--Grey-950, #131313);
				z-index: 5;
				padding: 20px;
				display: flex;
				justify-content: center;
				gap: 10px;
				border-top: 1px solid var(--Grey-800, #333);
				transition: all 0.4s ease-in-out;


				button {
					flex: 1;
					font-weight: 600;
					line-height: 160%;
					padding: 8px;
					display: flex;
					justify-content: center;
					gap: 8px;
					border-radius: 8px;




					i {
						font-size: 20px;
					}
				}

				&.open {
					bottom: 0;
				}
			}
		}

	}
}

@media (max-width: 768px) {
	.fileManager {
		& .tabset {
			& .dataset_list {
				grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
				gap: 5px;
				padding: 0 20px;
			}
		}
	}
}