[#6] 설명 더 보기 버튼

app/(route)/verification/ibulsin/_components/MoreExplainBtn/index.module.css

@@ -0,0 +1,10 @@
+.question_icon_container {
+  display: flex;
+  position:relative;
+  justify-content: center;
+  align-items: center;
+}
+.question_icon {
+  color:var(--purple-700);
+  cursor: pointer;
+}

app/(route)/verification/ibulsin/_components/MoreExplainBtn/index.tsx

@@ -0,0 +1,30 @@
+'use client'
+
+import React, { useState } from 'react'
+import S from './index.module.css'
+import { BsFillQuestionCircleFill } from 'react-icons/bs'
+import MoreExplainToggle from '../MoreExplainToggle'
+
+function MoreExplainBtn({ type }: { type: string }) {
+  const [isHover, setIsHover] = useState(false)
+
+  const handleMouseOver = () => {
+    setIsHover(true)
+  }
+  const handleMouseOut = () => {
+    setIsHover(false)
+  }
+
+  return (
+    <div className={S.question_icon_container}>
+      <BsFillQuestionCircleFill
+        className={S.question_icon}
+        onMouseOver={handleMouseOver}
+        onMouseOut={handleMouseOut}
+      />
+      {isHover && <MoreExplainToggle type={type} />}
+    </div>
+  )
+}
+
+export default MoreExplainBtn