민원신고답변문구관리 화면 수정

src/main/webapp/WEB-INF/jsp/fims/cvlc/cvlc05010-main.jsp

@@ -28,18 +28,41 @@
 			<div class="container-page-btn mt-3">
 		        <button type="button" id="btnReset--${pageName}" class="btn btn-outline-dark" 
 		        title="초기화">초기화</button>
-		        <button type="button" id="btnAnsBasicTab--${pageName}" class="btn btn-blue btn-tab" 
-		        title="머리말/꼬리말">머리말/꼬리말</button>
-		        <button type="button" id="btnLevyAnsBodyTab--${pageName}" class="btn btn-blue btn-tab" 
-		        title="부과건 답변내용">부과건 답변내용</button>
-		        <button type="button" id="btnWarningAnsBodyTab--${pageName}" class="btn btn-blue btn-tab" 
-		        title="계도건 답변내용">계도건 답변내용</button>
-		        <button type="button" id="btnNonlevyAnsBodyTab--${pageName}" class="btn btn-blue btn-tab" 
-		        title="미부과처리건 답변내용">미부과처리건 답변내용</button>
 		        <span class="container-window-btn-right"></span>
 		    </div>
 		    
-		    <div class="h-px-500 mt-4">
+		    <span style="display: flex;justify-content: center">
+			    <div class="nav-align-top mb-1 w-px-1300">
+					<ul class="nav nav-tabs" role="tablist">
+						<li class="nav-item">
+							<button type="button" id="btnAnsBasicTab--${pageName}" class="nav-link active" 
+							role="tab" data-bs-toggle="tab">
+								머리말/꼬리말
+							</button>
+						</li>
+						<li class="nav-item">
+							<button type="button" id="btnLevyAnsBodyTab--${pageName}" class="nav-link" 
+							role="tab" data-bs-toggle="tab">
+								부과건 답변내용
+							</button>
+						</li>
+						<li class="nav-item">
+							<button type="button" id="btnWarningAnsBodyTab--${pageName}" class="nav-link" 
+							role="tab" data-bs-toggle="tab">
+								계도건 답변내용
+							</button>
+						</li>
+						<li class="nav-item">
+							<button type="button" id="btnNonlevyAnsBodyTab--${pageName}" class="nav-link" 
+							role="tab" data-bs-toggle="tab">
+								미부과처리건 답변내용
+							</button>
+						</li>
+					</ul>
+				</div>
+		    </span>
+		    
+		    <div class="h-px-500 mt-1">
 		    
 		    	<!-- 머리말,꼬리말 영역 -->
 		    	<span class="area-answerbasic">
@@ -671,8 +694,6 @@ $(document).ready(function(){
 	
 	//탭 버튼
     $('#btnAnsBasicTab--${pageName}').on('click', (event) => {
-    	$(event.target).addClass("active");
-    	$(event.target).siblings(".btn-tab").removeClass("active");
 		
     	$("#wrapper--${pageName}").find(".area-answerbasic").show();
     	$("#wrapper--${pageName}").find(".area-answerbody").hide();
@@ -683,8 +704,6 @@ $(document).ready(function(){
     });
     
 	$('#btnLevyAnsBodyTab--${pageName}').on('click', (event) => {
-		$(event.target).addClass("active");
-    	$(event.target).siblings(".btn-tab").removeClass("active");
 		
 		$("#wrapper--${pageName}").find(".area-answerbasic").hide();
 		$("#wrapper--${pageName}").find(".area-answerbody").each(function(){
@@ -704,8 +723,6 @@ $(document).ready(function(){
 		$("#macroTarget--${pageName}").attr("for","");
 	});
 	$('#btnWarningAnsBodyTab--${pageName}').on('click', (event) => {
-		$(event.target).addClass("active");
-    	$(event.target).siblings(".btn-tab").removeClass("active");
 		
 		$("#wrapper--${pageName}").find(".area-answerbasic").hide();
 		$("#wrapper--${pageName}").find(".area-answerbody").each(function(){
@@ -725,8 +742,6 @@ $(document).ready(function(){
 		$("#macroTarget--${pageName}").attr("for","");
 	});
 	$('#btnNonlevyAnsBodyTab--${pageName}').on('click', (event) => {
-		$(event.target).addClass("active");
-    	$(event.target).siblings(".btn-tab").removeClass("active");
 		
 		$("#wrapper--${pageName}").find(".area-answerbasic").hide();
 		$("#wrapper--${pageName}").find(".area-answerbody").each(function(){