공지사항/FAQ 상세 페이지 HTML 콘텐츠 모바일 반응형 정제 기능 추가

- HTML 정제 유틸리티 함수 추가 (sanitizeHtmlContent)
- PC 웹용 인라인 스타일 제거 (color/background-color는 유지)
- 텍스트 기반 구분선(---, ===)을 HTML <hr> 태그로 자동 변환
- 이미지 및 링크 반응형 클래스 추가
- 연속된 공백/줄바꿈 정리
- 모바일 최적화 CSS 스타일 추가

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

src/entities/support/ui/detail/notice-detail.tsx

@@ -2,13 +2,13 @@ import { useTranslation } from 'react-i18next';
 import { motion } from 'framer-motion';
 import { useLocation } from 'react-router';
 import { NoticeDetailParams, NoticeDetailResponse, NoticeItem } from '../../model/types';
-import { useEffect, useState } from 'react';
+import { useCallback, useEffect, useRef, useState, useMemo } from 'react';
 import { useNoticeDetailMutation } from '../../api/use-notice-detail-mutation';
 import moment from 'moment';
 import { DetailMotionDuration, DetailMotionStyle, DetailMotionVariants } from '@/entities/common/model/constant';
 import { FullMenuClose } from '@/entities/common/ui/full-menu-close';
 import { showAlert } from '@/widgets/show-alert';
-import { snackBar } from '@/shared/lib';
+import { snackBar, sanitizeHtmlContent } from '@/shared/lib';
 
 export interface NoticeDetaillProps {
   detailOn: boolean;
@@ -23,15 +23,47 @@ export const NoticeDetail = ({
   const { t } = useTranslation();
   const [result, setResult] = useState<NoticeItem>({});
   const { mutateAsync: noticeDetail } = useNoticeDetailMutation();
+  const modalRef = useRef<HTMLDivElement>(null);
 
-  const callDetail = () => {
-    if(!!seq){
+  // HTML 콘텐츠 정제 (메모이제이션)
+  const sanitizedContent = useMemo(() => {
+    return sanitizeHtmlContent(result.contents || '', {
+      imageClass: 'notice-content-img',
+      linkClass: 'notice-content-link'
+    });
+  }, [result.contents]);
+
+  const onClickToClose = useCallback(() => {
+    setDetailOn(false);
+  }, [setDetailOn]);
+
+  const callDetail = useCallback(() => {
+    if(seq){
       let detailParams: NoticeDetailParams = {
         seq: seq,
       };
       noticeDetail(detailParams).then((rs: NoticeDetailResponse) => {
-        if(!!rs.seq){
+        if(rs.seq){
           setResult(rs);
+          // Scroll reset after data load
+          setTimeout(() => {
+            if (modalRef.current) {
+              modalRef.current.scrollTop = 0;
+            }
+            window.scrollTo(0, 0);
+            document.body.scrollTop = 0;
+            document.documentElement.scrollTop = 0;
+
+            const containerElement = document.querySelector('.full-menu-container');
+            if (containerElement) {
+              containerElement.scrollTop = 0;
+            }
+
+            const optionList = document.querySelector('.option-list');
+            if (optionList) {
+              optionList.scrollTop = 0;
+            }
+          }, 100);
         }
         else{
           snackBar(t('common.noData'));
@@ -44,20 +76,19 @@ export const NoticeDetail = ({
         }
       });
     }
-  };
-
-  const onClickToClose = () => {
-    setDetailOn(false);
-  };
+  }, [seq, noticeDetail, t, onClickToClose]);
 
   useEffect(() => {
-    callDetail();
-  }, [seq]);
+    if (detailOn && seq) {
+      callDetail();
+    }
+  }, [seq, detailOn, callDetail]);
 
   return (
     <>
-      <motion.div 
-        className="full-menu-modal" 
+      <motion.div
+        ref={modalRef}
+        className="full-menu-modal"
         initial="hidden"
         animate={ (detailOn)? 'visible': 'hidden' }
         variants={ DetailMotionVariants }
@@ -80,13 +111,10 @@ export const NoticeDetail = ({
                 <div className="notice-detail__title">{ result.title }</div>
                 <div className="notice-detail__meta">{ result.regDt? moment(result.regDt).format('YYYY.MM.DD'): '' } | { t(`support.notice.categories.${result.informCl}`) }</div>
                 <div className="notice-detail__divider"></div>
-                <div 
-                  className="notice-detail__body" 
-                  dangerouslySetInnerHTML={{ __html: result.contents || '' }}
+                <div
+                  className="notice-detail__body"
+                  dangerouslySetInnerHTML={{ __html: sanitizedContent }}
                 ></div>
-                {/*
-                <div className="notice-detail__body">{ result.contents }</div>
-                */}
               </div>
             </div>
           </div>