[260111] 프로젝트 이전 및 초기화

style/navigation.css

@@ -0,0 +1,66 @@
+/* 햄버거 메뉴 */
+.menu {
+    margin-top: 8px;
+    height: 32px;
+    width: 32px;
+    position: relative;
+    z-index: 70;
+}
+.menu:has(.hambergerIcon.open) {
+    position: fixed;
+    top: 48px;
+    right: 16px;
+}
+
+.menu:hover {
+    cursor: pointer;
+}
+
+.hambergerIcon {
+    height: 4px;
+    width: 24px;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    border-radius: 50px;
+    transform: translate(-50%, -50%) rotate(0deg);
+    transition: all ease 0.5s;
+}
+
+.hambergerIcon::before,
+.hambergerIcon::after {
+    content: '';
+    position: absolute;
+    height: inherit;
+    border-radius: inherit;
+    background-color: inherit;
+    margin: auto;
+    width: 50%;
+    transition: all ease 0.2s;
+}
+
+.hambergerIcon::before {
+    top: -8px;
+    left: 0;
+    transform-origin: left;
+}
+
+.hambergerIcon::after {
+    bottom: -8px;
+    right: 0;
+    transform-origin: right;
+}
+
+.hambergerIcon.open {
+    transform: translate(-50%, -50%) rotate(135deg);
+}
+
+.hambergerIcon.open::before {
+    top: 0;
+    transform: translateX(100%) rotate(-90deg);
+}
+
+.hambergerIcon.open::after {
+    bottom: 0;
+    transform: translateX(-100%) rotate(-90deg);
+}