html {
  margin: 0;
  padding: 0;
  height: 100%;
  width: 100%;
}
body {
  margin: 0;
  padding: 10px;
  height: 100%;
  width: 100%;
  font-family: 'Malgun Gothic', Gulim, 'Segoe UI', -apple-system, BlinkMacSystemFont, Roboto, 'Helvetica Neue', sans-serif;
}
label {
  font-weight: 400;
}
div#loading {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  background-color: white;
}
div#main {
  z-index: 1;
}
.select2-container--default .select2-selection--single {
  border: 1px solid #edebe9;
}
.swal2-container {
  width: 280px !important;
}
.swal2-popup {
  font-size: 14px !important;
  width: 260px !important;
}
.swal2-popup.swal2-toast .swal2-icon .swal2-icon-content {
  font-size: 14px !important;
}
.ms-List {
  border: 1px solid #edebe9;
  min-height: 300px;
}
.ms-ListItem-primaryText {
  padding-right: 0px;
  font-size: 15px;
  font-weight: 400;
}
.ms-ListItem-secondaryText {
  font-size: 13px;
}
.ms-ListItem-tertiaryText {
  font-size: 11px;
}

.ms-ListItem {
  padding: 9px 9px 3px;
}

#permission-container {
  display: none;
  text-align: center;
}
#permission-container button {
  margin-top: 20px;
  background-color: rgb(0, 120, 212);
  color: white;
  font-size: 15px;
  font-weight: bold;
  height: 32px;
  padding: 4px 16px;
  border: 0 none;
  border-radius: 3px;
  font-family: 'Segoe UI';
}

#content-container {
  display: none;
}

#error {
  display: none;
}
#error span {
  text-align: center;
  font-weight: bold;
}

.box-container {
  display: flex;
  flex-direction: column;
}

.box {
  padding: 5px;
  display: flex;
  flex-direction: column;
}

.hide {
  display: none;
}

.area {
  width: 100%;
  height: 200px;
  border: 2px dashed gray;
  border-radius: 6px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  filter: alpha(opacity=50);
  -khtml-opacity: 0.5;
  -moz-opacity: 0.5;
  opacity: 0.5;
  text-align: center;
  cursor: pointer;
}
.area::before {
  opacity: 1;
  font-size: 84px;
  position: relative;
  top: 10px;
}
.area:hover,
.area.dragging,
.area.uploading {
  filter: alpha(opacity=100);
  -khtml-opacity: 1;
  -moz-opacity: 1;
  opacity: 1;
}
.area input {
  width: 400%;
  height: 100%;
  margin-left: -300%;
  border: none;
  cursor: pointer;
  position: relative;
  top: -145px;
  opacity: 0;
}
.area input:focus {
  outline: none;
}

li.fileNode {
  cursor: pointer;
  border-bottom: 1px solid #edebe9;
}

li.fileNode:hover {
  background-color: lightgray;
}

div#progress {
  width: 100%;
  padding-left: 10px;
  padding-right: 10px;
}