紙吹雪・お祝いコンフェッティ装飾

<div class="confetti07-08-12">
          <span class="pc pc-c1"></span>
          <span class="pc pc-c2"></span>
          <span class="pc pc-c3"></span>
          <span class="pc pc-sq1"></span>
          <span class="pc pc-sq2"></span>
          <span class="pc pc-tri1"></span>
          <span class="pc pc-line1"></span>
          <span class="pc pc-line2"></span>
          <span class="pc pc-ring1"></span>
        </div>

.d07-08-12 .confetti07-08-12{
          position:relative;
          width:220px;
          height:180px;
        }
        .d07-08-12 .pc{
          position:absolute;
          display:block;
        }
        .d07-08-12 .pc-c1{
          width:14px;
          height:14px;
          border-radius:50%;
          background:#f472b6;
          top:12px;
          left:20px;
        }
        .d07-08-12 .pc-c2{
          width:10px;
          height:10px;
          border-radius:50%;
          background:#38bdf8;
          top:80px;
          right:30px;
        }
        .d07-08-12 .pc-c3{
          width:8px;
          height:8px;
          border-radius:50%;
          background:#facc15;
          bottom:24px;
          left:50px;
        }
        .d07-08-12 .pc-sq1{
          width:16px;
          height:16px;
          background:#8b5cf6;
          top:40px;
          right:70px;
          transform:rotate(20deg);
        }
        .d07-08-12 .pc-sq2{
          width:12px;
          height:12px;
          background:#10b981;
          bottom:50px;
          right:16px;
          transform:rotate(-15deg);
        }
        .d07-08-12 .pc-tri1{
          width:0;
          height:0;
          border-left:9px solid transparent;
          border-right:9px solid transparent;
          border-bottom:15px solid #f59e0b;
          top:20px;
          left:100px;
          transform:rotate(10deg);
        }
        .d07-08-12 .pc-line1{
          width:22px;
          height:4px;
          background:#ef4444;
          bottom:70px;
          left:14px;
          transform:rotate(-30deg);
        }
        .d07-08-12 .pc-line2{
          width:18px;
          height:4px;
          background:#2563eb;
          top:100px;
          left:130px;
          transform:rotate(40deg);
        }
        .d07-08-12 .pc-ring1{
          width:20px;
          height:20px;
          border:3px solid #f472b6;
          border-radius:50%;
          bottom:10px;
          right:90px;
        }