pg견적문의 생성 및 퀵배너 변경

src/main/resources/static/css/common.css

@@ -454,7 +454,7 @@ body.page-inquiry #m_logo img {
 @media (hover:hover) {
 	.quick_wrap .top_btn:hover { border-color:var(--primary); color:var(--primary) }
 }
-@media (max-width:1400px) { .quick_wrap { display:none } }
+@media (max-width:1024px) { .quick_wrap { display:none } }
 
 
 /* ========================== 반응형 하단 버튼 공통 */

src/main/resources/static/css/main.css

@@ -57,37 +57,30 @@
 	letter-spacing:4pt;
 	word-break:keep-all;
 }
-@keyframes txtSlideDown {
-    from {
-        opacity: 0;
-        transform: translateY(-20px);
-    }
-    to {
-        opacity: 1;
-        transform: translateY(0);
-    }
-}
 
-/* 초기 상태 — 애니메이션 전엔 숨김 */
+
+/* 초기 상태 ? 애니메이션 전엔 숨김 */
 .txt_box .main-tit,
 .txt_box .sub-tit,
 .txt_box .visual-btn-wrap {
     opacity: 0;
+    transform: translateY(-20px);
+    transition: opacity 0.7s ease, transform 0.7s ease;
 }
-
-/* animate-in 클래스 붙으면 시간차 실행 */
-.txt_box.animate-in .main-tit {
-    animation: txtSlideDown 0.7s ease forwards;
-    animation-delay: 0s;
-}
-.txt_box.animate-in .sub-tit {
-    animation: txtSlideDown 0.7s ease forwards;
-    animation-delay: 0.15s;
+.txt_box.no-transition .main-tit,
+.txt_box.no-transition .sub-tit,
+.txt_box.no-transition .visual-btn-wrap {
+    transition: none;
 }
+/* animate-in 클래스 추가 시 최종 상태 (transition이 재실행되지 않으므로 zoom 후 유지) */
+.txt_box.animate-in .main-tit,
+.txt_box.animate-in .sub-tit,
 .txt_box.animate-in .visual-btn-wrap {
-    animation: txtSlideDown 0.7s ease forwards;
-    animation-delay: 0.3s;
+    opacity: 1;
+    transform: translateY(0);
 }
+.txt_box.animate-in .sub-tit      { transition-delay: 0.15s; }
+.txt_box.animate-in .visual-btn-wrap { transition-delay: 0.3s; }
 
 /* swiper controller */
 #mainVisual .txt_wrap .swiper-controller {

src/main/resources/static/js/main.js

@@ -25,25 +25,32 @@ const slideData = [
     },
 ];
 
+setTimeout(function () {
+    $('.txt_box').addClass('animate-in');
+}, 100);
+
 // ② 텍스트 업데이트 함수 (fade out → 내용 교체 → fade in)
 function updateSlideText(index) {
     const d = slideData[index];
     const $box = $('#mainVisual .txt_box');
 
-    $box.removeClass('animate-in');
+    // ① transition 없이 즉시 초기 상태로 snap
+    $box.addClass('no-transition').removeClass('animate-in');
 
     $box.find('.main-tit').text(d.mainTit);
     $box.find('.sub-tit-line').text(d.subTitLine);
     $box.find('.sub-tit-bold').text(d.subTitBold);
 
-    // 클래스명 대신 순서로 선택
     const $btns = $box.find('.visual-btn');
     $btns.eq(0).attr('href', d.btn1.href).find('.btn-txt').text(d.btn1.text);
     $btns.eq(1).attr('href', d.btn2.href).find('.btn-txt').text(d.btn2.text);
 
-    setTimeout(function () {
-        $box.addClass('animate-in');
-    }, 0);
+    // ② 두 프레임 후 transition 복원 + animate-in (브라우저가 초기 상태를 확실히 렌더링한 뒤 실행)
+    requestAnimationFrame(function () {
+        requestAnimationFrame(function () {
+            $box.removeClass('no-transition').addClass('animate-in');
+        });
+    });
 }
 // ③ Swiper 초기화
 const mySwiper = new Swiper('.MainSwiper', {