diff --git a/src/hooks/useInfiniteCarousel.ts b/src/hooks/useInfiniteCarousel.ts
index 607a0092..fbff4019 100644
--- a/src/hooks/useInfiniteCarousel.ts
+++ b/src/hooks/useInfiniteCarousel.ts
@@ -1,15 +1,16 @@
 import { useEffect, useRef, useState } from 'react';
 
 const useInfiniteCarousel = <T>(carouselList: Array<T>, x: string) => {
+  const TOTAL_SLIDE = carouselList.length;
   const [infiniteCarouselList, setInfiniteCarouselList] = useState(carouselList);
-  const [currentIndex, setCurrentIndex] = useState(1);
+  const [currentIndex, setCurrentIndex] = useState(0);
   const carouselRef = useRef<HTMLDivElement>(null);
-  const TOTAL_SLIDE = carouselList.length;
 
   useEffect(() => {
     const firstSide = carouselList[0];
     const lastSlide = carouselList[TOTAL_SLIDE - 1];
     setInfiniteCarouselList([lastSlide, ...carouselList, firstSide]);
+    setCurrentIndex(1);
   }, [carouselList, TOTAL_SLIDE]);
 
   const moveToNthSlide = (index: number) => {
diff --git a/src/views/MainPage/components/PartConfig/PartSlide/index.tsx b/src/views/MainPage/components/PartConfig/PartSlide/index.tsx
index 49ac2290..2545a1fc 100644
--- a/src/views/MainPage/components/PartConfig/PartSlide/index.tsx
+++ b/src/views/MainPage/components/PartConfig/PartSlide/index.tsx
@@ -17,7 +17,7 @@ export default function PartSlide({ part, handleCarouselSwipe }: PartSlideProps)
     visible: {
       opacity: 1,
       y: 0,
-      transition: { opacity: { delay: 0.2, duration: 0.6 }, y: { delay: 0.2, duration: 1 } },
+      transition: { opacity: { delay: 0.4, duration: 0.6 }, y: { delay: 0.4, duration: 1 } },
     },
   };
 
diff --git a/src/views/MainPage/components/PartConfig/PartSlide/style.ts b/src/views/MainPage/components/PartConfig/PartSlide/style.ts
index ea4f0d26..bd946065 100644
--- a/src/views/MainPage/components/PartConfig/PartSlide/style.ts
+++ b/src/views/MainPage/components/PartConfig/PartSlide/style.ts
@@ -8,7 +8,7 @@ export const PartSlide = styled.div`
   flex-shrink: 0;
   position: relative;
 
-  width: 100vw;
+  width: 100%;
   height: 428px;
 
   padding: 77px 0 62px 0;
diff --git a/src/views/MainPage/components/PartConfig/index.tsx b/src/views/MainPage/components/PartConfig/index.tsx
index 21776a47..2f5100ae 100644
--- a/src/views/MainPage/components/PartConfig/index.tsx
+++ b/src/views/MainPage/components/PartConfig/index.tsx
@@ -10,7 +10,7 @@ export default function PartConfig() {
   const [partIndex, setPartIndex] = useState(0);
   const { carouselRef, infiniteCarouselList, handleSwipe } = useInfiniteCarousel<TabType>(
     carouselList,
-    '(-100vw - 20px)',
+    '(-100% - 20px)',
   );
 
   const handleSelectPart = (clickedIndex: number) => {
diff --git a/src/views/MainPage/components/PartConfig/style.ts b/src/views/MainPage/components/PartConfig/style.ts
index a95547b1..edb0c07f 100644
--- a/src/views/MainPage/components/PartConfig/style.ts
+++ b/src/views/MainPage/components/PartConfig/style.ts
@@ -12,7 +12,7 @@ export const PartButtonList = styled.div`
 `;
 
 export const CarouselWrapper = styled.div`
-  width: 100vw;
+  width: 100%;
   overflow: hidden;
 `;