[data-drag-target]::after{
  display: none;
}

[data-drag-object] {
  width: 4rem !important;
  height: 4rem !important;
}
[data-drag-object] .rotate {display: none;}
[data-drag-object] [data-drag-rotate="item"]::after{
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  border: .1rem dashed rgba(0,0,0,0.1);
  background-color: rgba(0,0,0,0.05);
  position: absolute;
  z-index: 2;
}
[data-drag-rotate="item"] svg {position: absolute;}
.ex2,
.ex1 {margin-top: 0;}
.exam-item--cont {flex: 1;}
[data-drag-rotate="item"] svg,
[data-drag-rotate="item"] img{pointer-events: none;}
[data-drag-group="object"]{position: absolute;}
[data-drag-group="target"] {
  display: flex;
  align-items: center;
  justify-content: center;
}
[data-drag-target="1"]{
  border:1px solid #E2E2E2;
  border-radius: 2rem;
  background-color: #fff;
}
[data-drag-object][data-reverse-y="true"][data-reverse-x="true"] [data-drag-rotate="item"] svg{transform: scaleY(-1) scaleX(-1);}
[data-drag-object][data-reverse-y="true"] [data-drag-rotate="item"] svg{transform: scaleY(-1);}
[data-drag-object][data-reverse-x="true"] [data-drag-rotate="item"] svg{transform: scaleX(-1);}
[data-drag-object].disabled{opacity: 0;}

.ex1 .bg {
  position: absolute;
  top: 3.2rem;
  left: 21.6rem;
  width: 25.8rem;
  height: 28rem;
  /* transform: translate(-50%, -50%); */
}
.ex1 [data-drag-item="object"][data-value="1"] {
  position: absolute;
  top: 8rem;
  left: 44.4rem;
}
.ex1 [data-drag-item="object"][data-value="2"] {
  position: absolute;
  top: 12.9rem;
  left: 25.1rem;
}
.ex1 [data-drag-item="object"][data-value="3"] {
  position: absolute;
  top: 7.5rem;
  left: 25.7rem;
}
.ex1 [data-drag-item="object"][data-value="4"] {
  position: absolute;
  top: 12.9rem;
  left: 37.1rem;
}
.ex1 [data-drag-item="object"][data-value="5"] {
  position: absolute;
  top: 5.6rem;
  left: 37.1rem;
}


.ex1 [data-drag-object="1"]:hover svg path{fill:#E08C0E !important;}
.ex1 [data-drag-object="1"] [data-drag-rotate="item"] svg{
  width: 1.9rem;
  height: 3.7rem;
  left: calc(50% - 0.9rem);
  top: calc(50% - 1.8rem);
}
.ex1 [data-drag-object="2"]:hover svg path{fill:#2779B7 !important;}
.ex1 [data-drag-object="2"] [data-drag-rotate="item"] svg{
  width: 11.1rem;
  height: 6.5rem;
  left: calc(50% - 5.5rem);
  top: calc(50% - 3.2rem);
}
.ex1 [data-drag-object="3"]:hover svg path{fill:#2779B7 !important;}
.ex1 [data-drag-object="3"] [data-drag-rotate="item"] svg{
  width: 9.9rem;
  height: 4.8rem;
  left: calc(50% - 4.9rem);
  top: calc(50% - 2.4rem);
}
.ex1 [data-drag-object="4"]:hover svg path{fill:#E08C0E !important;}
.ex1 [data-drag-object="4"] [data-drag-rotate="item"] svg{
  width: 13.4rem;
  height: 6.5rem;
  left: calc(50% - 6.7rem);
  top: calc(50% - 3.2rem);
}

.ex1 [data-drag-object="5"]:hover svg path{fill:#E08C0E !important;}
.ex1 [data-drag-object="5"] [data-drag-rotate="item"] svg{
  width: 13.4rem;
  height: 8.8rem;
  left: calc(50% - 6.7rem);
  top: calc(50% - 4.4rem);
}

.ex2 .bg {
  position: absolute;
  top: 3.2rem;
  left: 21.6rem;
  width: 25.8rem;
  height: 28rem;
  /* transform: translate(-50%, -50%); */
}
.ex2 [data-drag-item="object"][data-value="1"] {
  position: absolute;
  top: 10rem;
  left: 30.3rem;
}
.ex2 [data-drag-item="object"][data-value="2"] {
  position: absolute;
  top: 9.8rem;
  left: 28rem;
}
.ex2 [data-drag-item="object"][data-value="3"] {
  position: absolute;
  top: 3.3rem;
  left: 28rem;
}
.ex2 [data-drag-item="object"][data-value="4"] {
  position: absolute;
  top: 9.6rem;
  left: 22.8rem;
}
.ex2 [data-drag-item="object"][data-value="5"] {
  position: absolute;
  top: 9.5rem;
  left: 26.8rem;
}
.ex2 [data-drag-item="object"][data-value="6"] {
  position: absolute;
  top: 10.6rem;
  left: 42.1rem;
}
.ex2 [data-drag-item="object"][data-value="7"] {
  position: absolute;
  top: 10.6rem;
  left: 37.5rem;
}

.ex2 [data-drag-object="1"]:hover svg path{fill:#0E949C !important;}
.ex2 [data-drag-object="1"] [data-drag-rotate="item"] svg{
  width: 8.8rem;
  height: 12.7rem;
  left: calc(50% - 4.4rem);
  top: calc(50% - 6.3rem);
}
.ex2 [data-drag-object="2"]:hover svg path{fill:#0E949C !important;}
.ex2 [data-drag-object="2"] [data-drag-rotate="item"] svg{
  width: 4.3rem;
  height: 12.7rem;
  left: calc(50% - 2.15rem);
  top: calc(50% - 6.3rem);
}
.ex2 [data-drag-object="3"]:hover svg path{fill:#0E949C !important;}
.ex2 [data-drag-object="3"] [data-drag-rotate="item"] svg{
  width: 4.2rem;
  height: 4.2rem;
  left: calc(50% - 2.1rem);
  top: calc(50% - 2.1rem);
}
.ex2 [data-drag-object="4"]:hover svg path{fill:#0E949C !important;}
.ex2 [data-drag-object="4"] [data-drag-rotate="item"] svg{
  width: 6.5rem;
  height: 13.3rem;
  left: calc(50% - 3.2rem);
  top: calc(50% - 6.65rem);
}

.ex2 [data-drag-object="5"]:hover svg path{fill:#0E949C !important;}
.ex2 [data-drag-object="5"] [data-drag-rotate="item"] svg{
  width: 1.9rem;
  height: 13.3rem;
  left: calc(50% - 0.9rem);
  top: calc(50% - 6.6rem);
}
.ex2 [data-drag-object="6"]:hover svg path{fill:#C73B6C !important;}
.ex2 [data-drag-object="6"] [data-drag-rotate="item"] svg{
  width: 6.5rem;
  height: 11rem;
  left: calc(50% - 3.2rem);
  top: calc(50% - 5.5rem);
}
.ex2 [data-drag-object="7"]:hover svg path{fill:#C73B6C !important;}
.ex2 [data-drag-object="7"] [data-drag-rotate="item"] svg{
  width: 6.5rem;
  height: 11rem;
  left: calc(50% - 3.2rem);
  top: calc(50% - 5.5rem);
}
.exam-item{
  margin: 0;
}
.page-result--item .exam-item--cont{
  line-height: 1.8;
}

[data-drag-object]:focus{outline: 0 !important;}
[data-drag-object]:focus svg {
  outline:1px solid #000;
  outline-offset: .3rem;
}