.p-mainVis {
  position: relative;
  width: 100%;
  background: #eef7f1;
}

.p-mainVis__bg {
  width: 100%;
  display: block;
}

.p-mainVis__overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  pointer-events: none;
}

.p-mainVis__path {
  stroke: #00f0ff;
  stroke-width: 5;
  fill: none;
  stroke-dasharray: 20 10;
  animation: flow 2s linear infinite;
}

.p-mainVis__circle {
  fill: #fff;
  filter: drop-shadow(0 0 10px #00f0ff);
  animation: pulse 1.5s ease-in-out infinite;
}

@keyframes pulse {
  0%, 100% {
    r: 8;
    opacity: 0.8;
  }
  50% {
    r: 10;
    opacity: 1;
  }
}

@keyframes flow {
  from { stroke-dashoffset: 0; }
  to   { stroke-dashoffset: -30; }
}

@media screen and (min-width:769px) {
  .p-mainVis--sp {
    display: none !important;
  }

  .l-mainVis {
    width: 1200px;
    margin: 0 auto;
  }

  .p-mainVis {
    padding: 0 30px 30px 0;
  }
}

@media screen and (max-width: 768px) {
  .p-mainVis--pc {
    display: none !important;
  }

  .p-mainVis {
    padding: 30px 0;
  }

  .p-mainVis__path {
    stroke-width: 10;
  }

  @keyframes pulse {
    0%, 100% {
      r: 20;
      opacity: 0.8;
    }
    50% {
      r: 25;
      opacity: 1;
    }
  }
}

.p-ex .l-mainVis {
  min-height: 100%;
}

.p-ex__pageTitle {
  padding-left: 0;
  margin: 40px 0;
}

@media screen and (max-width:768px) {
  .p-ex .l-mainVis {
    margin-bottom: 5%;
  }
  .p-ex__pageTitle {
    text-align: center;
  }
}