.three_a .wrap {
  position: relative;
  padding: 50% 0 0;
  border: 1px solid var(--color-mu07);
  overflow: hidden;
  cursor: grab;
}
.three_a .canvas {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.kowaza_js05 .wrap {
  position: relative;
  background: var(--color-mu11);
  padding: 50% 0 0;
  border: 1px solid var(--color-mu07);
  overflow: hidden;
}
.kowaza_js05 .item {
  position: absolute;
  top: 50%;
  left: 50%;
  transition: all 0.2s;
  mix-blend-mode: multiply;
}
.kowaza_js05 .interior {
  transform: translate(-50%, -50%);
  color: #fff;
  background: var(--color-mu08);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: bold;
}
.kowaza_js05 .interior-01 {
  width: 9em;
  height: 9em;
}
.kowaza_js05 .interior-02 {
  width: 6em;
  height: 6em;
}
.kowaza_js05 .interior-03 {
  width: 3em;
  height: 3em;
}

.kowaza_js06 .wrap {
  position: relative;
  background: var(--color-mu11);
  padding: 50% 0 0;
  border: 1px solid var(--color-mu07);
  overflow: hidden;
}
.kowaza_js06 .item {
  position: absolute;
  top: 50%;
  left: 50%;
  mix-blend-mode: multiply;
  width: 50%;
  height: 50%;
  transform-origin: 0 0;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}
.kowaza_js06 .item-01 {
  animation-duration: 18s;
}
.kowaza_js06 .item-02 {
  animation-duration: 12s;
  border: 1px dashed var(--color-mu07);
}
.kowaza_js06 .item-03 {
  animation-duration: 9s;
  animation-direction: reverse;
}
.kowaza_js06 .active .item {
  animation-name: rotate-item;
}
.kowaza_js06 .interior {
  position: relative;
  color: #fff;
  background: var(--color-mu08);
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: bold;
  transform-origin: 0 0;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}
.kowaza_js06 .interior-01 {
  width: 9em;
  height: 9em;
  top: 20%;
  animation-duration: 18s;
  animation-direction: reverse;
}
.kowaza_js06 .interior-02 {
  width: 6em;
  height: 6em;
  top: 60%;
  animation-duration: 12s;
  animation-direction: reverse;
}
.kowaza_js06 .interior-03 {
  width: 3em;
  height: 3em;
  top: 100%;
  animation-duration: 9s;
}
.kowaza_js06 .active .interior {
  animation-name: rotate-interior;
}

@keyframes rotate-item {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes rotate-interior {
  0% {
    transform: rotate(0deg) translate(-50%, -50%);
  }
  100% {
    transform: rotate(360deg) translate(-50%, -50%);
  }
}
.kowaza_js07 .wrap {
  background: var(--color-mu11);
  border: 1px solid var(--color-mu07);
}
.kowaza_js07 .path {
  stroke: var(--color-mu07);
  stroke-width: 1px;
  stroke-dasharray: 2 2;
  fill: none;
}
.kowaza_js07 .circle {
  fill: var(--color-mu08);
  mix-blend-mode: multiply;
}
.kowaza_js07 .text {
  fill: #fff;
  text-anchor: middle;
  dominant-baseline: central;
  font-weight: bold;
}

.kowaza_js08 .wrap {
  position: relative;
  background: var(--color-mu11);
  padding: 50% 0 0;
  border: 1px solid var(--color-mu07);
}
.kowaza_js08 .canvas {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}