diff --git a/web/src/components/MemoContent/List.tsx b/web/src/components/MemoContent/List.tsx
index 983c2f8a..41aec62e 100644
--- a/web/src/components/MemoContent/List.tsx
+++ b/web/src/components/MemoContent/List.tsx
@@ -29,25 +29,22 @@ const List: React.FC<Props> = ({ kind, indent, children }: Props) => {
   };
 
   const getAttributes = () => {
-    if (kind === ListNode_Kind.ORDERED) {
-      const firstChild = head(children);
-      if (firstChild?.type === NodeType.ORDERED_LIST_ITEM) {
-        return {
-          start: firstChild.orderedListItemNode?.number,
-        };
-      }
+    const attrs: any = {
+      style: { paddingLeft: `${indent > 0 ? indent * 10 : 20}px` },
+    };
+    const firstChild = head(children);
+    if (firstChild?.type === NodeType.ORDERED_LIST_ITEM) {
+      attrs.start = firstChild.orderedListItemNode?.number;
+    } else if (firstChild?.type === NodeType.TASK_LIST_ITEM) {
+      attrs.style = { paddingLeft: `${indent * 8}px` };
     }
-    return {};
+    return attrs;
   };
 
   return React.createElement(
     getListContainer(),
     {
-      className: cn(
-        "list-inside break-all",
-        kind === ListNode_Kind.ORDERED ? "list-decimal" : kind === ListNode_Kind.UNORDERED ? "list-disc" : "list-none",
-      ),
-      style: { paddingLeft: `${indent * 6}px` },
+      className: cn(kind === ListNode_Kind.ORDERED ? "list-decimal" : kind === ListNode_Kind.UNORDERED ? "list-disc" : "list-none"),
       ...getAttributes(),
     },
     children.map((child, index) => {