diff --git a/src/scss/modules/pc/load-view.scss b/src/scss/modules/pc/load-view.scss
new file mode 100644
index 0000000..2878d08
--- /dev/null
+++ b/src/scss/modules/pc/load-view.scss
@@ -0,0 +1,218 @@
+@include pc-layout {
+  #load-view {
+    position: absolute;
+    top: 0; left: 0;
+    width: 100%; height: 100%;
+    min-width: $min-width; min-height: $min-height;
+
+    /**
+     * frame
+     */
+    .frame {
+      position: absolute;
+      top: 0; left: 0;
+      width: 100%; height: 100%;
+      background-color: $theme-pink;
+
+      /*** direction ***/
+      .direction {
+        position: absolute;
+        top: 0; left: 0;
+        width: 100%; height: 100%;
+
+        .left,
+        .right {
+          position: absolute;
+          left: calc(50% - 57.5px);
+          width: 115px; height: 35px;
+          
+          div {
+            float: left;
+            width: 0; height: 0;
+            margin-top: 2.5px;
+            margin-right: 20px;
+            border-top: solid 15px transparent;
+            border-bottom: solid 15px transparent;
+            opacity: 0.1;
+          }
+          div:last-child { margin-right: 0; }
+          &::after { content: ""; display: block; clear: both; }
+        }
+        .bottom,
+        .top {
+          position: absolute;
+          top: calc(50% - 57.5px);
+          width: 35px; height: 115px;
+
+          div {
+            width: 0; height: 0;
+            margin-left: 2.5px;
+            margin-bottom: 20px;
+            border-left: solid 15px transparent;
+            border-right: solid 15px transparent;
+            opacity: 0.1;
+          }
+          div:last-child { margin-bottom: 0; }
+          &::after { content: ""; display: block; clear: both; }
+        }
+
+        /** left **/
+        .left {
+          top: 6px;
+          div { border-right: solid 25px #fff; }
+        }
+        
+        /** right **/
+        .right {
+          bottom: 6px;
+          div { border-left: solid 25px #fff; }
+        }
+
+        /** bottom **/
+        .bottom {
+          left: 6px;
+          div { border-top: solid 25px #fff; }
+        }
+        /** top **/
+        .top {
+          right: 6px;
+          div { border-bottom: solid 25px #fff; }
+        }
+      }
+
+      /*** square ***/
+      .square {
+        position: absolute;
+        top: 0; left: 0;
+        width: 100%; height: 100%;
+
+        div {
+          position: absolute;
+          width: 40px; height: 40px;
+          border: dashed 3px #fff;
+          box-sizing: border-box;
+          border-radius: 5px;
+        }
+        div:nth-child(1) { top: 10px; left: 10px; }
+        div:nth-child(2) { top: 10px; right: 10px; }
+        div:nth-child(3) { bottom: 10px; left: 10px; }
+        div:nth-child(4) { bottom: 10px; right: 10px; }
+      }
+
+      /*** line ***/
+      .line {
+        position: absolute;
+        top: 47px; left: 47px;
+        width: calc(100% - 94px);
+        height: calc(100% - 94px);
+
+        div { position: absolute; box-sizing: border-box; }
+        div:nth-child(1),
+        div:nth-child(2) {
+          width: 100%; height: 1px; left: 0;
+          border-top: dashed 3px #fff;
+        }
+        div:nth-child(3),
+        div:nth-child(4) {
+          width: 1px; height: 100%;
+          border-left: dashed 3px #fff;
+        }
+        div:nth-child(1) { top: 0; }
+        div:nth-child(2) { bottom: 0; }
+        div:nth-child(3) { left: 0; }
+        div:nth-child(4) { right: 0; }
+      }
+
+      /*** rect ***/
+      .rect {
+        position: absolute;
+        top: 90px; left: 90px;
+        width: calc(100% - 180px); height: calc(100% - 180px);
+        z-index: 1;
+
+        /** bar **/
+        .bar {
+          position: absolute;
+          top: 0; left: 0;
+          width: 100%; height: 100%;
+          overflow: hidden;
+
+          div {
+            position: absolute;
+
+            &::after {
+              position: absolute;
+              top: 0; left: 0;
+              width: 100%; height: 100%;
+              background-color: #fff;
+              content: "";
+              display: block;
+            }
+          }
+          div:nth-child(1),
+          div:nth-child(3) { left: 0; width: 100%; height: 3px; }
+          div:nth-child(2),
+          div:nth-child(4) { top: 0; width: 3px; height: 100%; }
+          div:nth-child(1) {
+            top: 0;
+            &::after { transform: translateX(100%); }
+          }
+          div:nth-child(2) {
+            left: 0;
+            &::after { transform: translateY(-100%); }
+          }
+          div:nth-child(3) {
+            bottom: 0;
+            &::after { transform: translateX(-100%); }
+          }
+          div:nth-child(4) {
+            right: 0;
+            &::after { transform: translateY(100%); }
+          }
+        }
+
+        /** effect **/
+        .effect {
+          position: absolute;
+          top: 0; left: 0;
+          width: 100%; height: 100%;
+
+          div:nth-child(4) {
+            position: absolute;
+            top: -23.5px; right: -23.5px;
+            width: 50px; height: 50px;
+            background-color: #fff;
+            border-radius: 50%;
+          }
+
+          div:nth-child(1),
+          div:nth-child(2),
+          div:nth-child(3) {
+            position: absolute;
+            width: 50px; height: 50px;
+            border-radius: 50%;
+            box-sizing: border-box;
+            border: solid 20px #fff;
+            opacity: 0;
+          }
+          div:nth-child(1) { top: -23.5px; left: -23.5px; }
+          div:nth-child(2) { bottom: -23.5px; left: -23.5px; }
+          div:nth-child(3) { bottom: -23.5px; right: -23.5px; }
+        }
+      }
+      
+      &::after {
+        content: "";
+        display: block;
+        position: absolute;
+        top: 60px; left: 60px;
+        width: calc(100% - 120px); height: calc(100% - 120px);
+        background-color: $theme-light-pink;
+      }
+    }
+  }
+
+  #load-view[data-state="fin"] {
+    
+  }
+}