.layout-list[data-v-447836f4] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.layout-list label[data-v-447836f4] {
    cursor: pointer;
}
.layout-list input[data-v-447836f4] {
    display: none;
}
.layout-list input:checked + img[data-v-447836f4] {
      outline: 2px solid #000;
}
.layout-list img[data-v-447836f4] {
    width: 45px;
    margin-right: 10px;
}
.block-wrap[data-v-447836f4] {
  background-color: #fff;
  border: 1px solid #dfdfdf;
  padding: 20px;
  border-radius: 10px;
  height: 100%;
  max-height: 200px;
  margin-bottom: 20px;
}
.col-md-6[data-v-447836f4] {
  margin-bottom: 20px;
}
.frame-list[data-v-447836f4] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.frame-list .frame-wrap[data-v-447836f4] {
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    margin-right: 10px;
    border: 3px solid #373737;
    position: relative;
    padding: 5px;
    border-radius: 5px;
    background-color: #fff;
}
.frame-list .frame-wrap[data-v-447836f4]:last-child {
      margin-right: 0;
}
.frame-list .frame-wrap .frame-name[data-v-447836f4] {
      background-color: #373737;
      color: #fff;
      display: block;
      text-align: center;
      line-height: 30px;
      border-radius: 5px;
}
.frame-list .frame-wrap .video-wrap[data-v-447836f4] {
      padding: 10px 20px;
}
.format-list[data-v-447836f4] {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  height: 200px;
}
.format-list .drag-wrap[data-v-447836f4] {
    height: calc(50% - 10px);
    overflow: hidden;
    width: 300px;
    border: dashed 1px #000;
    margin: 5px;
    background-color: #fff;
    padding: 10px;
}
.format-list .drag-wrap .frame-wrap[data-v-447836f4] {
      background-color: #373737;
      color: #fff;
      padding: 0 10px;
      height: 100%;
      border-radius: 5px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
}
.format-list .drag-wrap .remove-btn[data-v-447836f4] {
      cursor: pointer;
}
.sortable-ghost[data-v-447836f4] {
  opacity: 0.2;
}
.sortable-ghost .video-wrap[data-v-447836f4] {
    display: none;
}