diff --git a/package-lock.json b/package-lock.json
index 80b16fcd..dd802009 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -13,6 +13,7 @@
         "@chakra-ui/react": "^2.8.2",
         "@emotion/react": "^11.11.3",
         "@emotion/styled": "^11.11.0",
+        "dayjs": "^1.11.11",
         "framer-motion": "^10.18.0",
         "jotai": "^2.6.1",
         "next": "14.0.4",
@@ -2778,6 +2779,11 @@
         "url": "https://github.com/sponsors/kossnocorp"
       }
     },
+    "node_modules/dayjs": {
+      "version": "1.11.11",
+      "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.11.tgz",
+      "integrity": "sha512-okzr3f11N6WuqYtZSvm+F776mB41wRZMhKP+hc34YdW+KmtYYK9iqvHSwo2k9FEH3fhGXvOPV6yz2IcSrfRUDg=="
+    },
     "node_modules/debug": {
       "version": "4.3.4",
       "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
diff --git a/package.json b/package.json
index 7e715262..5a9e920a 100644
--- a/package.json
+++ b/package.json
@@ -14,6 +14,7 @@
     "@chakra-ui/react": "^2.8.2",
     "@emotion/react": "^11.11.3",
     "@emotion/styled": "^11.11.0",
+    "dayjs": "^1.11.11",
     "framer-motion": "^10.18.0",
     "jotai": "^2.6.1",
     "next": "14.0.4",
@@ -29,8 +30,8 @@
     "@swc-jotai/react-refresh": "^0.1.0",
     "@types/node": "^20",
     "@types/react": "^18",
-    "@types/react-datepicker": "^6.2.0",
     "@types/react-beautiful-dnd": "^13.1.8",
+    "@types/react-datepicker": "^6.2.0",
     "@types/react-dom": "^18",
     "eslint": "^8.56.0",
     "eslint-config-airbnb": "^19.0.4",
diff --git a/src/app/api/team.ts b/src/app/api/team.ts
index 7980cf10..467aaa50 100644
--- a/src/app/api/team.ts
+++ b/src/app/api/team.ts
@@ -44,6 +44,8 @@ const postJoinTeam = (token: string, teamId: number, code: string) =>
     },
   });
 
+const getTeams = () => teamFetcher(`/teams`);
+
 const getTeamMembers = (teamId: number) => teamFetcher(`/teams/${teamId}/members`);
 
 const getMyTeams = (memberId: number) => teamFetcher(`/teams/members/${memberId}`);
@@ -62,6 +64,7 @@ export {
   deleteTeam,
   postInviteTeam,
   postJoinTeam,
+  getTeams,
   getMyTeams,
   getMyTeamsWithStudy,
   getTeamMembers,
diff --git a/src/app/team/[teamId]/page.tsx b/src/app/team/[teamId]/page.tsx
index 2bb1f4f3..967b21cd 100644
--- a/src/app/team/[teamId]/page.tsx
+++ b/src/app/team/[teamId]/page.tsx
@@ -22,7 +22,7 @@ import TeamControlPanel from '@/containers/team/TeamControlPanel';
 import TeamMember from '@/containers/team/teamMember';
 import { useMutateWithToken } from '@/hooks/useFetchWithToken';
 import documentCardData from '@/mocks/documentCard';
-import { gardenInfos1 } from '@/mocks/Garden3D';
+import { gardenData } from '@/mocks/Garden3D';
 import studyCardData from '@/mocks/studyCard';
 import teamInfoData from '@/mocks/teamInfo';
 
@@ -133,7 +133,7 @@ const Page = ({ params }: { params: { teamId: number } }) => {
                 rotateY={0}
                 cubeGap={useBreakpointValue({ base: 3, xl: 4 }) || 3}
                 cubeSize={useBreakpointValue({ base: 20, md: 26, xl: 30 }) || 20}
-                gardenInfos={gardenInfos1}
+                garden={gardenData}
               />
             </Box>
           </Box>
diff --git a/src/components/Garden3D/index.tsx b/src/components/Garden3D/index.tsx
index b65be4c7..668f4dd3 100644
--- a/src/components/Garden3D/index.tsx
+++ b/src/components/Garden3D/index.tsx
@@ -1,28 +1,43 @@
+/* eslint-disable import/no-extraneous-dependencies */
+
 'use client';
 
 import { Box } from '@chakra-ui/react';
+import dayjs from 'dayjs';
 import { useState } from 'react';
 
+import { Garden } from '@/types';
+
 import Bar from './Bar';
 import { Garden3DProps } from './types';
 
-const Garden3D = ({ rotate = false, cubeSize, cubeGap, rotateY, gardenInfos }: Garden3DProps) => {
+const Garden3D = ({ rotate = false, cubeSize, cubeGap, rotateY, garden }: Garden3DProps) => {
+  const gardenInfo: Garden[] = [];
+
+  const dayCount = 7 * 12 + dayjs().day();
+  for (let i = dayCount; i >= 0; i -= 1) {
+    gardenInfo.push({ contributeDate: dayjs().subtract(i, 'days').format('YYYY-MM-DD'), contributeCount: 0 });
+  }
+
+  garden.forEach((grass) => {
+    const duration = dayjs().diff(dayjs(grass.contributeDate), 'days');
+    if (duration >= 0 && dayCount >= duration) gardenInfo[dayCount - duration].contributeCount = grass.contributeCount;
+  });
+
   const cubeSizeHalf = cubeSize / 2;
 
   const offsetDefaultY = 545;
   const [offsetY, setOffsetY] = useState<number>(offsetDefaultY);
 
   const gap = cubeSize + cubeGap;
-  const standX = (gardenInfos[gardenInfos.length - 1].week - gardenInfos[0].week + 1) / 2 + gardenInfos[0].week;
+  const standX = 8;
   const maxCount =
-    gardenInfos.reduce((prev, value) => {
-      return prev.count >= value.count ? prev : value;
-    }).count / 4;
+    gardenInfo.reduce((prev, value) => {
+      return prev.contributeCount >= value.contributeCount ? prev : value;
+    }).contributeCount / 4;
 
-  /* setting for drag event */
   const [yDegree, setYDegree] = useState<number>(rotateY);
 
-  /* cube mouse drag event */
   const mouseDown = (clickEvent: React.MouseEvent<Element, MouseEvent>) => {
     const mouseMoveHandler = (moveEvent: MouseEvent) => {
       const deltaX = moveEvent.screenX - clickEvent.screenX;
@@ -51,20 +66,20 @@ const Garden3D = ({ rotate = false, cubeSize, cubeGap, rotateY, gardenInfos }: G
         h="100%"
         style={{ perspective: '800px', transformStyle: 'preserve-3d' }}
       >
-        {gardenInfos.map((info) => {
-          const currX = (info.week - standX) * gap;
-          const currZ = (info.date - 3) * gap;
+        {gardenInfo.map((info, idx) => {
+          const currX = (Math.floor(idx / 7) - standX) * gap;
+          const currZ = (dayjs(info.contributeDate).day() - 3) * gap;
 
           return (
             <Box
-              key={info.id}
+              key={info.contributeDate}
               pos="absolute"
               w="100%"
               h="100%"
               style={{ transformStyle: 'preserve-3d', transform: `rotateY(${yDegree}deg)` }}
             >
               <Bar
-                count={info.count}
+                count={info.contributeCount}
                 maxCount={maxCount}
                 currX={currX}
                 currZ={currZ}
diff --git a/src/components/Garden3D/types.ts b/src/components/Garden3D/types.ts
index 5b3bf5f2..94de846c 100644
--- a/src/components/Garden3D/types.ts
+++ b/src/components/Garden3D/types.ts
@@ -1,4 +1,4 @@
-import { GardenInfoType } from '@/types';
+import { Garden } from '@/types';
 
 export interface CubeProps {
   currX: number;
@@ -14,5 +14,5 @@ export interface Garden3DProps {
   cubeSize: number;
   cubeGap: number;
   rotateY: number;
-  gardenInfos: GardenInfoType[];
+  garden: Garden[];
 }
diff --git a/src/containers/main/TeamCard/index.tsx b/src/containers/main/TeamCard/index.tsx
index 3495d071..50631311 100644
--- a/src/containers/main/TeamCard/index.tsx
+++ b/src/containers/main/TeamCard/index.tsx
@@ -1,10 +1,9 @@
 import { Box, Card, CardHeader, Text, Flex, CardBody, useBreakpointValue } from '@chakra-ui/react';
 
 import Garden3D from '@/components/Garden3D';
+import { TeamRank } from '@/types';
 
-import { TeamCardProps } from './types';
-
-const TeamCard = ({ rank, name, description, gardenInfos }: TeamCardProps) => {
+const TeamCard = ({ rank, teamReferenceResponse, teamGardenResponse }: Omit<TeamRank, 'point'>) => {
   return (
     <Card overflow="hidden" w="100%" h="100%" bg="none" backdropFilter="blur(30px)">
       <CardHeader
@@ -19,7 +18,7 @@ const TeamCard = ({ rank, name, description, gardenInfos }: TeamCardProps) => {
           <Text textStyle="title_bold_xl" textAlign="right">
             {rank}
           </Text>
-          <Box pos="absolute" top={{ base: '110px', lg: '150px', '2xl': '170px' }} w="100%">
+          <Box pos="absolute" top={{ base: '120px', lg: '160px', '2xl': '170px' }} w="100%">
             <Box w="100%" h="2px" bg="white" id="bar" />
             <Box
               pos="absolute"
@@ -35,7 +34,7 @@ const TeamCard = ({ rank, name, description, gardenInfos }: TeamCardProps) => {
           </Box>
         </Box>
         <Flex direction="column" w="full" pt={{ base: '6', lg: '7', '2xl': '10' }}>
-          <Text textStyle="bold_4xl">{name}</Text>
+          <Text textStyle="bold_4xl">{teamReferenceResponse.name}</Text>
           <Text
             textStyle="md"
             overflow="hidden"
@@ -43,7 +42,9 @@ const TeamCard = ({ rank, name, description, gardenInfos }: TeamCardProps) => {
             maxH={{ base: '44px', xl: '48px' }}
             whiteSpace="wrap"
           >
-            {description === '' ? '팀 소개글이 아직 없습니다.' : description}
+            {teamReferenceResponse.description === ''
+              ? '팀 소개글이 아직 없습니다.'
+              : teamReferenceResponse.description}
           </Text>
         </Flex>
       </CardHeader>
@@ -60,7 +61,7 @@ const TeamCard = ({ rank, name, description, gardenInfos }: TeamCardProps) => {
           cubeSize={useBreakpointValue({ base: 18, lg: 24, '2xl': 32 }) || 18}
           cubeGap={4}
           rotateY={55}
-          gardenInfos={gardenInfos}
+          garden={teamGardenResponse}
         />
       </CardBody>
     </Card>
diff --git a/src/containers/main/TeamCard/types.ts b/src/containers/main/TeamCard/types.ts
index bb113907..8c87ac2c 100644
--- a/src/containers/main/TeamCard/types.ts
+++ b/src/containers/main/TeamCard/types.ts
@@ -1,8 +1,8 @@
-import { GardenInfoType } from '@/types';
+import { Garden } from '@/types';
 
 export interface TeamCardProps {
   rank: number;
   name: string;
   description: string;
-  gardenInfos: GardenInfoType[];
+  garden: Garden[];
 }
diff --git a/src/containers/main/TeamRankSlider/index.tsx b/src/containers/main/TeamRankSlider/index.tsx
index e1a6f3cd..379696ca 100644
--- a/src/containers/main/TeamRankSlider/index.tsx
+++ b/src/containers/main/TeamRankSlider/index.tsx
@@ -2,28 +2,39 @@
 
 import { Box, Flex } from '@chakra-ui/react';
 import { useRouter } from 'next/navigation';
-import { useState } from 'react';
+import { useEffect, useState } from 'react';
 import { Swiper, SwiperSlide, SwiperClass } from 'swiper/react';
 
 import 'swiper/css';
 
-import teamRankInfos from '@/mocks/TeamRanking';
+import { getTeams } from '@/app/api/team';
+import { TeamRank } from '@/types';
 
 import TeamCard from '../TeamCard';
 
 const TeamRankSlider = () => {
+  const [teamRank, setTeamRank] = useState<TeamRank[]>([]);
   const [swiperIndex, setSwiperIndex] = useState<number>(0);
   const [swiper, setSwiper] = useState<SwiperClass>();
   const router = useRouter();
 
-  const slideOnClick = (idx: number, url: string) => {
+  const slideOnClick = (idx: number, teamId: number) => {
     if (swiper?.activeIndex === idx) {
-      router.push(url);
+      router.push(`/team/${teamId}`);
     } else {
       swiper?.slideTo(idx);
     }
   };
 
+  useEffect(() => {
+    getTeams().then((res) => {
+      const teams = res.body.slice(0, 10).map((team: TeamRank, idx: number) => {
+        return { ...team, rank: idx + 1 };
+      });
+      setTeamRank(teams);
+    });
+  }, []);
+
   return (
     <Flex align="center" direction="column" w="100%">
       <Box w="100%">
@@ -34,21 +45,20 @@ const TeamRankSlider = () => {
           onSwiper={(e) => setSwiper(e)}
           onSlideChange={(e) => setSwiperIndex(e.activeIndex)}
         >
-          {teamRankInfos.map((data) => (
-            <SwiperSlide key={data.id} style={{ width: 'fit-content' }}>
+          {teamRank.map((team, idx) => (
+            <SwiperSlide key={team.teamReferenceResponse.id} style={{ width: 'fit-content' }}>
               <Box
                 overflow="hidden"
                 w={{ base: '450px', lg: '600px', '2xl': '720px' }}
                 h={{ base: '300px', lg: '360px', '2xl': '430px' }}
                 bg="rgba(255, 255, 255, 0.1)"
                 borderRadius="30"
-                onClick={() => slideOnClick(data.idx, data.url)}
+                onClick={() => slideOnClick(idx, team.teamReferenceResponse.id)}
               >
                 <TeamCard
-                  rank={data.rank}
-                  name={data.name}
-                  description={data.description}
-                  gardenInfos={data.gardenInfos}
+                  rank={team.rank}
+                  teamReferenceResponse={team.teamReferenceResponse}
+                  teamGardenResponse={team.teamGardenResponse}
                 />
               </Box>
             </SwiperSlide>
@@ -57,16 +67,16 @@ const TeamRankSlider = () => {
       </Box>
 
       <Flex justify="center" w="100%" h="10" mt="8">
-        {teamRankInfos.map((data) => (
+        {teamRank.map((team, idx) => (
           <Box
-            key={data.id}
+            key={team.teamReferenceResponse.id}
             w="3"
             h="3"
             mx="4"
-            bg={data.idx === swiperIndex ? 'white' : 'transparent'}
+            bg={idx === swiperIndex ? 'white' : 'transparent'}
             border="2px solid white"
             borderRadius="100%"
-            onClick={() => swiper?.slideTo(data.idx)}
+            onClick={() => swiper?.slideTo(idx)}
           />
         ))}
       </Flex>
diff --git a/src/mocks/Garden3D.ts b/src/mocks/Garden3D.ts
index abca6391..b7afda62 100644
--- a/src/mocks/Garden3D.ts
+++ b/src/mocks/Garden3D.ts
@@ -1,6 +1,6 @@
-import { CubeColorType, GardenInfoType } from '@/types';
+import { CubeColorType, Garden } from '@/types';
 
-const colorInfo: CubeColorType[] = [
+export const colorInfo: CubeColorType[] = [
   {
     ceil: '#EDF2F7',
     side1: '#CBD5E0',
@@ -28,376 +28,48 @@ const colorInfo: CubeColorType[] = [
   },
 ];
 
-const gardenInfos1: GardenInfoType[] = [
-  { date: 0, week: 15, count: 9, id: 99 },
-  { date: 1, week: 15, count: 14, id: 100 },
-  { date: 2, week: 15, count: 0, id: 101 },
-  { date: 3, week: 15, count: 10, id: 102 },
-  { date: 4, week: 15, count: 14, id: 103 },
-  { date: 5, week: 15, count: 13, id: 104 },
-  { date: 6, week: 15, count: 2, id: 105 },
-  { date: 0, week: 16, count: 6, id: 106 },
-  { date: 1, week: 16, count: 2, id: 107 },
-  { date: 2, week: 16, count: 2, id: 108 },
-  { date: 3, week: 16, count: 12, id: 109 },
-  { date: 4, week: 16, count: 12, id: 110 },
-  { date: 5, week: 16, count: 7, id: 111 },
-  { date: 6, week: 16, count: 11, id: 112 },
-  { date: 0, week: 17, count: 1, id: 113 },
-  { date: 1, week: 17, count: 5, id: 114 },
-  { date: 2, week: 17, count: 11, id: 115 },
-  { date: 3, week: 17, count: 1, id: 116 },
-  { date: 4, week: 17, count: 0, id: 117 },
-  { date: 5, week: 17, count: 14, id: 118 },
-  { date: 6, week: 17, count: 4, id: 119 },
-  { date: 0, week: 18, count: 14, id: 120 },
-  { date: 1, week: 18, count: 10, id: 121 },
-  { date: 2, week: 18, count: 9, id: 122 },
-  { date: 3, week: 18, count: 6, id: 123 },
-  { date: 4, week: 18, count: 7, id: 124 },
-  { date: 5, week: 18, count: 12, id: 125 },
-  { date: 6, week: 18, count: 11, id: 126 },
-  { date: 0, week: 19, count: 6, id: 127 },
-  { date: 1, week: 19, count: 5, id: 128 },
-  { date: 2, week: 19, count: 9, id: 129 },
-  { date: 3, week: 19, count: 7, id: 130 },
-  { date: 4, week: 19, count: 12, id: 131 },
-  { date: 5, week: 19, count: 1, id: 132 },
-  { date: 6, week: 19, count: 2, id: 133 },
-  { date: 0, week: 20, count: 3, id: 134 },
-  { date: 1, week: 20, count: 6, id: 135 },
-  { date: 2, week: 20, count: 5, id: 136 },
-  { date: 3, week: 20, count: 1, id: 137 },
-  { date: 4, week: 20, count: 8, id: 138 },
-  { date: 5, week: 20, count: 14, id: 139 },
-  { date: 6, week: 20, count: 14, id: 140 },
-  { date: 0, week: 21, count: 13, id: 141 },
-  { date: 1, week: 21, count: 6, id: 142 },
-  { date: 2, week: 21, count: 2, id: 143 },
-  { date: 3, week: 21, count: 14, id: 144 },
-  { date: 4, week: 21, count: 3, id: 145 },
-  { date: 5, week: 21, count: 14, id: 146 },
-  { date: 6, week: 21, count: 0, id: 147 },
-  { date: 0, week: 22, count: 3, id: 148 },
-  { date: 1, week: 22, count: 13, id: 149 },
-  { date: 2, week: 22, count: 5, id: 150 },
-  { date: 3, week: 22, count: 10, id: 151 },
-  { date: 4, week: 22, count: 9, id: 152 },
-  { date: 5, week: 22, count: 6, id: 153 },
-  { date: 6, week: 22, count: 8, id: 154 },
-  { date: 0, week: 23, count: 8, id: 155 },
-  { date: 1, week: 23, count: 10, id: 156 },
-  { date: 2, week: 23, count: 11, id: 157 },
-  { date: 3, week: 23, count: 6, id: 158 },
-  { date: 4, week: 23, count: 1, id: 159 },
-  { date: 5, week: 23, count: 5, id: 160 },
-  { date: 6, week: 23, count: 14, id: 161 },
-  { date: 0, week: 24, count: 13, id: 162 },
-  { date: 1, week: 24, count: 14, id: 163 },
-  { date: 2, week: 24, count: 8, id: 164 },
-  { date: 3, week: 24, count: 1, id: 165 },
-  { date: 4, week: 24, count: 5, id: 166 },
-  { date: 5, week: 24, count: 13, id: 167 },
-  { date: 6, week: 24, count: 10, id: 168 },
-  { date: 0, week: 25, count: 14, id: 169 },
-  { date: 1, week: 25, count: 4, id: 170 },
-  { date: 2, week: 25, count: 9, id: 171 },
-  { date: 3, week: 25, count: 4, id: 172 },
-  { date: 4, week: 25, count: 2, id: 173 },
-  { date: 5, week: 25, count: 11, id: 174 },
-  { date: 6, week: 25, count: 3, id: 175 },
-  { date: 0, week: 26, count: 6, id: 176 },
-  { date: 1, week: 26, count: 2, id: 177 },
-  { date: 2, week: 26, count: 10, id: 178 },
-  { date: 3, week: 26, count: 9, id: 179 },
-  { date: 4, week: 26, count: 1, id: 180 },
-  { date: 5, week: 26, count: 7, id: 181 },
-  { date: 6, week: 26, count: 11, id: 182 },
-  { date: 0, week: 27, count: 2, id: 183 },
-  { date: 1, week: 27, count: 13, id: 184 },
-  { date: 2, week: 27, count: 5, id: 185 },
-  { date: 3, week: 27, count: 2, id: 186 },
-  { date: 4, week: 27, count: 9, id: 187 },
-  { date: 5, week: 27, count: 1, id: 188 },
-  { date: 6, week: 27, count: 8, id: 189 },
-  { date: 0, week: 28, count: 10, id: 190 },
-  { date: 1, week: 28, count: 14, id: 191 },
-  { date: 2, week: 28, count: 7, id: 192 },
-  { date: 3, week: 28, count: 0, id: 193 },
-  { date: 4, week: 28, count: 13, id: 194 },
-  { date: 5, week: 28, count: 8, id: 195 },
-  { date: 6, week: 28, count: 8, id: 196 },
-  { date: 0, week: 29, count: 3, id: 197 },
+export const gardenData: Garden[] = [
+  { contributeDate: '2024-04-08', contributeCount: 12 },
+  { contributeDate: '2024-04-09', contributeCount: 9 },
+  { contributeDate: '2024-04-10', contributeCount: 6 },
+  { contributeDate: '2024-04-11', contributeCount: 10 },
+  { contributeDate: '2024-04-12', contributeCount: 13 },
+  { contributeDate: '2024-04-14', contributeCount: 5 },
+  { contributeDate: '2024-04-15', contributeCount: 13 },
+  { contributeDate: '2024-04-21', contributeCount: 4 },
+  { contributeDate: '2024-04-22', contributeCount: 0 },
+  { contributeDate: '2024-04-23', contributeCount: 13 },
+  { contributeDate: '2024-05-06', contributeCount: 4 },
+  { contributeDate: '2024-05-11', contributeCount: 9 },
+  { contributeDate: '2024-05-12', contributeCount: 6 },
+  { contributeDate: '2024-05-18', contributeCount: 1 },
+  { contributeDate: '2024-05-25', contributeCount: 2 },
+  { contributeDate: '2024-05-26', contributeCount: 1 },
+  { contributeDate: '2024-05-27', contributeCount: 1 },
+  { contributeDate: '2024-05-28', contributeCount: 4 },
+  { contributeDate: '2024-05-29', contributeCount: 9 },
+  { contributeDate: '2024-05-30', contributeCount: 10 },
+  { contributeDate: '2024-05-31', contributeCount: 6 },
+  { contributeDate: '2024-06-01', contributeCount: 0 },
+  { contributeDate: '2024-06-02', contributeCount: 7 },
+  { contributeDate: '2024-06-03', contributeCount: 3 },
+  { contributeDate: '2024-06-04', contributeCount: 9 },
+  { contributeDate: '2024-06-05', contributeCount: 10 },
+  { contributeDate: '2024-06-06', contributeCount: 3 },
+  { contributeDate: '2024-06-07', contributeCount: 8 },
+  { contributeDate: '2024-06-08', contributeCount: 6 },
+  { contributeDate: '2024-06-09', contributeCount: 3 },
+  { contributeDate: '2024-06-10', contributeCount: 12 },
+  { contributeDate: '2024-06-18', contributeCount: 10 },
+  { contributeDate: '2024-06-19', contributeCount: 9 },
+  { contributeDate: '2024-06-20', contributeCount: 6 },
+  { contributeDate: '2024-06-21', contributeCount: 12 },
+  { contributeDate: '2024-06-22', contributeCount: 12 },
+  { contributeDate: '2024-06-23', contributeCount: 8 },
+  { contributeDate: '2024-06-24', contributeCount: 1 },
+  { contributeDate: '2024-06-25', contributeCount: 11 },
+  { contributeDate: '2024-06-26', contributeCount: 10 },
+  { contributeDate: '2024-06-27', contributeCount: 11 },
+  { contributeDate: '2024-06-28', contributeCount: 7 },
+  { contributeDate: '2024-06-29', contributeCount: 9 },
 ];
-
-const gardenInfos2: GardenInfoType[] = [
-  { date: 1, week: 29, count: 6, id: 198 },
-  { date: 2, week: 29, count: 3, id: 199 },
-  { date: 3, week: 29, count: 9, id: 200 },
-  { date: 4, week: 29, count: 11, id: 201 },
-  { date: 5, week: 29, count: 4, id: 202 },
-  { date: 6, week: 29, count: 13, id: 203 },
-  { date: 0, week: 30, count: 13, id: 204 },
-  { date: 1, week: 30, count: 8, id: 205 },
-  { date: 2, week: 30, count: 8, id: 206 },
-  { date: 3, week: 30, count: 11, id: 207 },
-  { date: 4, week: 30, count: 10, id: 208 },
-  { date: 5, week: 30, count: 4, id: 209 },
-  { date: 6, week: 30, count: 13, id: 210 },
-  { date: 0, week: 31, count: 3, id: 211 },
-  { date: 1, week: 31, count: 3, id: 212 },
-  { date: 2, week: 31, count: 9, id: 213 },
-  { date: 3, week: 31, count: 12, id: 214 },
-  { date: 4, week: 31, count: 2, id: 215 },
-  { date: 5, week: 31, count: 6, id: 216 },
-  { date: 6, week: 31, count: 14, id: 217 },
-  { date: 0, week: 32, count: 3, id: 218 },
-  { date: 1, week: 32, count: 0, id: 219 },
-  { date: 2, week: 32, count: 8, id: 220 },
-  { date: 3, week: 32, count: 5, id: 221 },
-  { date: 4, week: 32, count: 14, id: 222 },
-  { date: 5, week: 32, count: 7, id: 223 },
-  { date: 6, week: 32, count: 5, id: 224 },
-  { date: 0, week: 33, count: 4, id: 225 },
-  { date: 1, week: 33, count: 0, id: 226 },
-  { date: 2, week: 33, count: 5, id: 227 },
-  { date: 3, week: 33, count: 14, id: 228 },
-  { date: 4, week: 33, count: 14, id: 229 },
-  { date: 5, week: 33, count: 1, id: 230 },
-  { date: 6, week: 33, count: 9, id: 231 },
-  { date: 0, week: 34, count: 2, id: 232 },
-  { date: 1, week: 34, count: 12, id: 233 },
-  { date: 2, week: 34, count: 14, id: 234 },
-  { date: 3, week: 34, count: 7, id: 235 },
-  { date: 4, week: 34, count: 12, id: 236 },
-  { date: 5, week: 34, count: 0, id: 237 },
-  { date: 6, week: 34, count: 4, id: 238 },
-  { date: 0, week: 35, count: 8, id: 239 },
-  { date: 1, week: 35, count: 11, id: 240 },
-  { date: 2, week: 35, count: 2, id: 241 },
-  { date: 3, week: 35, count: 3, id: 242 },
-  { date: 4, week: 35, count: 14, id: 243 },
-  { date: 5, week: 35, count: 3, id: 244 },
-  { date: 6, week: 35, count: 1, id: 245 },
-  { date: 0, week: 36, count: 8, id: 246 },
-  { date: 1, week: 36, count: 10, id: 247 },
-  { date: 2, week: 36, count: 7, id: 248 },
-  { date: 3, week: 36, count: 11, id: 249 },
-  { date: 4, week: 36, count: 10, id: 250 },
-  { date: 5, week: 36, count: 0, id: 251 },
-  { date: 6, week: 36, count: 1, id: 252 },
-  { date: 0, week: 37, count: 1, id: 253 },
-  { date: 1, week: 37, count: 0, id: 254 },
-  { date: 2, week: 37, count: 13, id: 255 },
-  { date: 3, week: 37, count: 5, id: 256 },
-  { date: 4, week: 37, count: 0, id: 257 },
-  { date: 5, week: 37, count: 11, id: 258 },
-  { date: 6, week: 37, count: 4, id: 259 },
-  { date: 0, week: 38, count: 6, id: 260 },
-  { date: 1, week: 38, count: 12, id: 261 },
-];
-
-const gardenInfos3: GardenInfoType[] = [
-  { date: 2, week: 38, count: 5, id: 262 },
-  { date: 3, week: 38, count: 8, id: 263 },
-  { date: 4, week: 38, count: 1, id: 264 },
-  { date: 5, week: 38, count: 12, id: 265 },
-  { date: 6, week: 38, count: 8, id: 266 },
-  { date: 0, week: 39, count: 14, id: 267 },
-  { date: 1, week: 39, count: 12, id: 268 },
-  { date: 2, week: 39, count: 12, id: 269 },
-  { date: 3, week: 39, count: 14, id: 270 },
-  { date: 4, week: 39, count: 0, id: 271 },
-  { date: 5, week: 39, count: 6, id: 272 },
-  { date: 6, week: 39, count: 2, id: 273 },
-  { date: 0, week: 40, count: 14, id: 274 },
-  { date: 1, week: 40, count: 9, id: 275 },
-  { date: 2, week: 40, count: 10, id: 276 },
-  { date: 3, week: 40, count: 8, id: 277 },
-  { date: 4, week: 40, count: 11, id: 278 },
-  { date: 5, week: 40, count: 3, id: 279 },
-  { date: 6, week: 40, count: 11, id: 280 },
-  { date: 0, week: 41, count: 6, id: 281 },
-  { date: 1, week: 41, count: 10, id: 282 },
-  { date: 2, week: 41, count: 13, id: 283 },
-  { date: 3, week: 41, count: 14, id: 284 },
-  { date: 4, week: 41, count: 10, id: 285 },
-  { date: 5, week: 41, count: 3, id: 286 },
-  { date: 6, week: 41, count: 4, id: 287 },
-  { date: 0, week: 42, count: 11, id: 288 },
-  { date: 1, week: 42, count: 14, id: 289 },
-  { date: 2, week: 42, count: 1, id: 290 },
-  { date: 3, week: 42, count: 9, id: 291 },
-  { date: 4, week: 42, count: 3, id: 292 },
-  { date: 5, week: 42, count: 13, id: 293 },
-  { date: 6, week: 42, count: 3, id: 294 },
-  { date: 0, week: 43, count: 5, id: 295 },
-  { date: 1, week: 43, count: 10, id: 296 },
-  { date: 2, week: 43, count: 11, id: 297 },
-  { date: 3, week: 43, count: 11, id: 298 },
-  { date: 4, week: 43, count: 14, id: 299 },
-  { date: 5, week: 43, count: 0, id: 300 },
-  { date: 6, week: 43, count: 10, id: 301 },
-  { date: 0, week: 44, count: 14, id: 302 },
-  { date: 1, week: 44, count: 6, id: 303 },
-  { date: 2, week: 44, count: 12, id: 304 },
-  { date: 3, week: 44, count: 6, id: 305 },
-  { date: 4, week: 44, count: 7, id: 306 },
-  { date: 5, week: 44, count: 0, id: 307 },
-  { date: 6, week: 44, count: 6, id: 308 },
-  { date: 0, week: 45, count: 4, id: 309 },
-  { date: 1, week: 45, count: 3, id: 310 },
-  { date: 2, week: 45, count: 2, id: 311 },
-  { date: 3, week: 45, count: 2, id: 312 },
-  { date: 4, week: 45, count: 13, id: 313 },
-  { date: 5, week: 45, count: 7, id: 314 },
-  { date: 6, week: 45, count: 9, id: 315 },
-  { date: 0, week: 46, count: 9, id: 316 },
-  { date: 1, week: 46, count: 11, id: 317 },
-  { date: 2, week: 46, count: 5, id: 318 },
-  { date: 3, week: 46, count: 12, id: 319 },
-  { date: 4, week: 46, count: 2, id: 320 },
-  { date: 5, week: 46, count: 6, id: 321 },
-  { date: 6, week: 46, count: 6, id: 322 },
-  { date: 0, week: 47, count: 13, id: 323 },
-  { date: 1, week: 47, count: 12, id: 324 },
-  { date: 2, week: 47, count: 1, id: 325 },
-  { date: 3, week: 47, count: 10, id: 326 },
-  { date: 4, week: 47, count: 14, id: 327 },
-  { date: 5, week: 47, count: 4, id: 328 },
-  { date: 6, week: 47, count: 6, id: 329 },
-  { date: 0, week: 48, count: 14, id: 330 },
-  { date: 1, week: 48, count: 4, id: 331 },
-  { date: 2, week: 48, count: 1, id: 332 },
-  { date: 3, week: 48, count: 5, id: 333 },
-  { date: 4, week: 48, count: 2, id: 334 },
-  { date: 5, week: 48, count: 5, id: 335 },
-  { date: 6, week: 48, count: 3, id: 336 },
-  { date: 0, week: 49, count: 2, id: 337 },
-  { date: 1, week: 49, count: 5, id: 338 },
-  { date: 2, week: 49, count: 9, id: 339 },
-  { date: 3, week: 49, count: 13, id: 340 },
-  { date: 4, week: 49, count: 0, id: 341 },
-  { date: 5, week: 49, count: 4, id: 342 },
-  { date: 6, week: 49, count: 7, id: 343 },
-  { date: 0, week: 50, count: 14, id: 344 },
-  { date: 1, week: 50, count: 11, id: 345 },
-  { date: 2, week: 50, count: 1, id: 346 },
-  { date: 3, week: 50, count: 0, id: 347 },
-  { date: 4, week: 50, count: 14, id: 348 },
-  { date: 5, week: 50, count: 7, id: 349 },
-  { date: 6, week: 50, count: 12, id: 350 },
-  { date: 0, week: 51, count: 2, id: 351 },
-  { date: 1, week: 51, count: 5, id: 352 },
-  { date: 2, week: 51, count: 10, id: 353 },
-  { date: 3, week: 51, count: 0, id: 354 },
-  { date: 4, week: 51, count: 2, id: 355 },
-  { date: 5, week: 51, count: 4, id: 356 },
-  { date: 6, week: 51, count: 10, id: 357 },
-  { date: 0, week: 52, count: 2, id: 358 },
-  { date: 1, week: 52, count: 8, id: 359 },
-  { date: 2, week: 52, count: 8, id: 360 },
-  { date: 3, week: 52, count: 8, id: 361 },
-  { date: 4, week: 52, count: 5, id: 362 },
-  { date: 5, week: 52, count: 9, id: 363 },
-  { date: 6, week: 52, count: 5, id: 364 },
-];
-
-const userInfos: GardenInfoType[] = [
-  { date: 4, week: 1, count: 8, id: 5 },
-  { date: 5, week: 1, count: 10, id: 6 },
-  { date: 6, week: 1, count: 0, id: 7 },
-  { date: 0, week: 2, count: 12, id: 8 },
-  { date: 1, week: 2, count: 9, id: 9 },
-  { date: 2, week: 2, count: 1, id: 10 },
-  { date: 3, week: 2, count: 2, id: 11 },
-  { date: 4, week: 2, count: 7, id: 12 },
-  { date: 5, week: 2, count: 5, id: 13 },
-  { date: 6, week: 2, count: 4, id: 14 },
-  { date: 0, week: 3, count: 8, id: 15 },
-  { date: 1, week: 3, count: 1, id: 16 },
-  { date: 2, week: 3, count: 0, id: 17 },
-  { date: 3, week: 3, count: 6, id: 18 },
-  { date: 4, week: 3, count: 7, id: 19 },
-  { date: 5, week: 3, count: 1, id: 20 },
-  { date: 6, week: 3, count: 11, id: 21 },
-  { date: 0, week: 4, count: 8, id: 22 },
-  { date: 1, week: 4, count: 12, id: 23 },
-  { date: 2, week: 4, count: 9, id: 24 },
-  { date: 3, week: 4, count: 2, id: 25 },
-  { date: 4, week: 4, count: 5, id: 26 },
-  { date: 5, week: 4, count: 2, id: 27 },
-  { date: 6, week: 4, count: 13, id: 28 },
-  { date: 0, week: 5, count: 7, id: 29 },
-  { date: 1, week: 5, count: 10, id: 30 },
-  { date: 2, week: 5, count: 14, id: 31 },
-  { date: 3, week: 5, count: 12, id: 32 },
-  { date: 4, week: 5, count: 12, id: 33 },
-  { date: 5, week: 5, count: 3, id: 34 },
-  { date: 6, week: 5, count: 14, id: 35 },
-  { date: 0, week: 6, count: 12, id: 36 },
-  { date: 1, week: 6, count: 13, id: 37 },
-  { date: 2, week: 6, count: 1, id: 38 },
-  { date: 3, week: 6, count: 1, id: 39 },
-  { date: 4, week: 6, count: 7, id: 40 },
-  { date: 5, week: 6, count: 9, id: 41 },
-  { date: 6, week: 6, count: 3, id: 42 },
-  { date: 0, week: 7, count: 6, id: 43 },
-  { date: 1, week: 7, count: 14, id: 44 },
-  { date: 2, week: 7, count: 14, id: 45 },
-  { date: 3, week: 7, count: 7, id: 46 },
-  { date: 4, week: 7, count: 8, id: 47 },
-  { date: 5, week: 7, count: 14, id: 48 },
-  { date: 6, week: 7, count: 5, id: 49 },
-  { date: 0, week: 8, count: 0, id: 50 },
-  { date: 1, week: 8, count: 8, id: 51 },
-  { date: 2, week: 8, count: 1, id: 52 },
-  { date: 3, week: 8, count: 1, id: 53 },
-  { date: 4, week: 8, count: 5, id: 54 },
-  { date: 5, week: 8, count: 11, id: 55 },
-  { date: 6, week: 8, count: 3, id: 56 },
-  { date: 0, week: 9, count: 2, id: 57 },
-  { date: 1, week: 9, count: 5, id: 58 },
-  { date: 2, week: 9, count: 1, id: 59 },
-  { date: 3, week: 9, count: 1, id: 60 },
-  { date: 4, week: 9, count: 0, id: 61 },
-  { date: 5, week: 9, count: 0, id: 62 },
-  { date: 6, week: 9, count: 14, id: 63 },
-  { date: 0, week: 10, count: 12, id: 64 },
-  { date: 1, week: 10, count: 11, id: 65 },
-  { date: 2, week: 10, count: 5, id: 66 },
-  { date: 3, week: 10, count: 1, id: 67 },
-  { date: 4, week: 10, count: 9, id: 68 },
-  { date: 5, week: 10, count: 13, id: 69 },
-  { date: 6, week: 10, count: 2, id: 70 },
-  { date: 0, week: 11, count: 9, id: 71 },
-  { date: 1, week: 11, count: 0, id: 72 },
-  { date: 2, week: 11, count: 12, id: 73 },
-  { date: 3, week: 11, count: 0, id: 74 },
-  { date: 4, week: 11, count: 14, id: 75 },
-  { date: 5, week: 11, count: 12, id: 76 },
-  { date: 6, week: 11, count: 14, id: 77 },
-  { date: 0, week: 12, count: 14, id: 78 },
-  { date: 1, week: 12, count: 3, id: 79 },
-  { date: 2, week: 12, count: 5, id: 80 },
-  { date: 3, week: 12, count: 7, id: 81 },
-  { date: 4, week: 12, count: 3, id: 82 },
-  { date: 5, week: 12, count: 6, id: 83 },
-  { date: 6, week: 12, count: 8, id: 84 },
-  { date: 0, week: 13, count: 8, id: 85 },
-  { date: 1, week: 13, count: 9, id: 86 },
-  { date: 2, week: 13, count: 3, id: 87 },
-  { date: 3, week: 13, count: 11, id: 88 },
-  { date: 4, week: 13, count: 14, id: 89 },
-  { date: 5, week: 13, count: 4, id: 90 },
-  { date: 6, week: 13, count: 12, id: 91 },
-  { date: 0, week: 14, count: 0, id: 92 },
-  { date: 1, week: 14, count: 11, id: 93 },
-  { date: 2, week: 14, count: 3, id: 94 },
-  { date: 3, week: 14, count: 4, id: 95 },
-  { date: 4, week: 14, count: 7, id: 96 },
-  { date: 5, week: 14, count: 1, id: 97 },
-  { date: 6, week: 14, count: 6, id: 98 },
-];
-
-export { colorInfo, userInfos, gardenInfos1, gardenInfos2, gardenInfos3 };
diff --git a/src/mocks/TeamRanking.ts b/src/mocks/TeamRanking.ts
deleted file mode 100644
index 4f4682e3..00000000
--- a/src/mocks/TeamRanking.ts
+++ /dev/null
@@ -1,84 +0,0 @@
-import { TeamRankInfoType } from '@/types';
-
-import { gardenInfos1, gardenInfos2, gardenInfos3, userInfos } from './Garden3D';
-
-const teamRankInfos: TeamRankInfoType[] = [
-  {
-    id: 1,
-    idx: 0,
-    rank: 1,
-    name: '부산회',
-    description:
-      '안녕하십니까, 부산 시민 여러분. 오늘도 평안한 날을 지내시고 계신지요. 이 화창한 날 한번 바깥 구경도 해보고, 음냐링... 그냥 긴 문자열 만들어야하는데... 어떻게 하면 길게 적을 수 있을까.. 고민이된다.. 이정도면 긴 문자열로 처리가 되겠지? 약간만 더 적어보자!! 하하 잠자고 싶어ㅠㅠ',
-    url: '/team/1',
-    gardenInfos: userInfos,
-  },
-  {
-    id: 2,
-    idx: 1,
-    rank: 2,
-    name: '열사모',
-    description: '안녕하세요. 열정을 사랑하는 사람들의 모입에 오신 것을 환영합니다 :)',
-    url: '/team/1',
-    gardenInfos: gardenInfos1,
-  },
-  {
-    id: 3,
-    idx: 2,
-    rank: 3,
-    name: '청명회',
-    description: '화산의 검이 재현하려는 것은 매화가 아니다. 바로 ‘피어남’ 이다.',
-    url: '/team/1',
-    gardenInfos: gardenInfos2,
-  },
-  { id: 4, idx: 3, rank: 4, name: 'AJR', description: '', url: '/team/1', gardenInfos: gardenInfos3 },
-  {
-    id: 5,
-    idx: 4,
-    rank: 5,
-    name: '캐럿',
-    description: '대한민국의 13인조 보이그룹 세븐틴의 공식 팬클럽',
-    url: '/team/1',
-    gardenInfos: userInfos,
-  },
-  {
-    id: 6,
-    idx: 5,
-    rank: 6,
-    name: '어린 왕자',
-    description:
-      '어린 왕자는 프랑스 공군 비행사이자 작가인 앙투안 드 생텍쥐페리(Antoine de Saint-Exupéry)가 1943년 발표한 소설이다. 또한 동시에 생텍쥐페리의 유작이기도 하다.',
-    url: '/team/1',
-    gardenInfos: gardenInfos1,
-  },
-  {
-    id: 7,
-    idx: 6,
-    rank: 7,
-    name: '멜로디',
-    description: '음의 높낮이의 변화가 리듬과 연결되어 흐르는 것.',
-    url: '/team/1',
-    gardenInfos: gardenInfos2,
-  },
-  {
-    id: 8,
-    idx: 7,
-    rank: 8,
-    name: '네버랜드',
-    description: '피터팬 속 상상의 공간 네버랜드에 사는 사람들은 변하지 않고 영원히 아이로 살 수 있는데',
-    url: '/team/1',
-    gardenInfos: gardenInfos3,
-  },
-  {
-    id: 9,
-    idx: 8,
-    rank: 9,
-    name: 'BLINK',
-    description: '시작과 끝을 함께하자',
-    url: '/team/1',
-    gardenInfos: userInfos,
-  },
-  { id: 10, idx: 9, rank: 10, name: 'John K', description: '', url: '/team/1', gardenInfos: gardenInfos1 },
-];
-
-export default teamRankInfos;
diff --git a/src/types.ts b/src/types.ts
index 09c3e25d..70783c3f 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -4,23 +4,6 @@ export interface CubeColorType {
   side2: string;
 }
 
-export interface GardenInfoType {
-  date: number;
-  week: number;
-  count: number;
-  id: number;
-}
-
-export interface TeamRankInfoType {
-  id: number;
-  idx: number;
-  rank: number;
-  name: string;
-  description: string;
-  url: string;
-  gardenInfos: GardenInfoType[];
-}
-
 export interface ParticipantType {
   id: number;
   name: string;
@@ -85,6 +68,18 @@ export interface Curriculum {
   isChecked?: boolean;
 }
 
+export interface Garden {
+  contributeDate: string;
+  contributeCount: number;
+}
+
+export interface TeamRank {
+  point: number;
+  rank: number;
+  teamReferenceResponse: Team;
+  teamGardenResponse: Garden[];
+}
+
 export interface Document {
   title: string;
   description: string;