🐛 fix: Button 컴포넌트에 새로운 사이즈 및 클래스 추가

src/components/ui/button/button.stories.tsx

@@ -6,6 +6,7 @@ const meta: Meta<typeof Button> = {
   title: 'UI/Button',
   component: Button,
   tags: ['autodocs'],
+  parameters: { layout: 'centered' },
 };
 export default meta;
 
@@ -50,3 +51,18 @@ export const AsLink: Story = {
     children: '내 프로필 등록하기',
   },
 };
+
+/**  새 프리셋: xs38 (모바일 38 → PC 48) */
+export const Size_XS38: Story = {
+  args: { children: '38→48 버튼', variant: 'primary', size: 'xs38' },
+};
+
+/** 48→48 유지 프리셋 */
+export const Size_LGFixed: Story = {
+  args: { children: '48→48 고정', variant: 'primary', size: 'lgFixed' },
+};
+
+/** Bold 오버라이드 확인 (className 병합) */
+export const BoldOverride: Story = {
+  args: { children: 'Bold 버튼', variant: 'secondary', size: 'md', className: 'font-bold' },
+};

src/components/ui/button/button.tsx

@@ -2,8 +2,9 @@ import { ButtonHTMLAttributes, ElementType } from 'react';
 
 type ButtonProps = {
   variant?: 'primary' | 'secondary' | 'disabled' | 'approve' | 'reject';
-  size?: 'lg' | 'md' | 'sm';
+  size?: 'lg' | 'md' | 'sm' | 'xs38' | 'lgFixed';
   full?: boolean;
+  className?: string;
   as?: ElementType;
 } & ButtonHTMLAttributes<HTMLButtonElement> & { [key: string]: unknown };
 
@@ -15,6 +16,8 @@ const SIZE_CLASS = {
   lg: 'h-12 px-4 text-base sm:h-14 sm:px-6 sm:text-lg',
   md: 'h-10 px-4 text-sm  sm:h-11 sm:px-5 sm:text-base',
   sm: 'h-8  px-3 text-sm  sm:h-9  sm:px-4 sm:text-base',
+  xs38: 'h-[38px] px-3.5 text-sm sm:h-12 sm:px-5 sm:text-base',
+  lgFixed: 'h-12 px-5 text-base sm:h-12 sm:px-5 sm:text-base',
 } as const;
 
 /* 3) variant에 따른 색상/테두리 */
@@ -33,6 +36,7 @@ export default function Button({
   full = false,
   as: Component = 'button',
   children,
+  className,
   ...props
 }: ButtonProps) {
   // props에서 type/disabled만 분리(중복, 충돌 방지), 나머지는 그대로 전달
@@ -41,7 +45,7 @@ export default function Button({
   const variantClass = VARIANT_CLASS[variant];
   return (
     <Component
-      className={`${BASE_CLASS} ${variantClass} ${sizeClass} ${full ? 'w-full' : ''}`}
+      className={`${BASE_CLASS} ${variantClass} ${sizeClass} ${full ? 'w-full' : ''} ${className ?? ''}`}
       {...(Component === 'button'
         ? {
             disabled: variant === 'disabled' || disabled,