Index: arms/vue/src/App.vue
===================================================================
diff -u -rd07e8d05f1402beebd11a90c45d1d40f0b91afac -rf83c2c1ffc65e66fe39fb67766be33087db40c38
--- arms/vue/src/App.vue	(.../App.vue)	(revision d07e8d05f1402beebd11a90c45d1d40f0b91afac)
+++ arms/vue/src/App.vue	(.../App.vue)	(revision f83c2c1ffc65e66fe39fb67766be33087db40c38)
@@ -1,5 +1,5 @@
 <template>
-	<router-view />
+  <router-view />
 </template>
 
-<style lang="css"></style>
+<style lang="scss"></style>
Index: arms/vue/src/components/Home/HomeContent.vue
===================================================================
diff -u -rd07e8d05f1402beebd11a90c45d1d40f0b91afac -rf83c2c1ffc65e66fe39fb67766be33087db40c38
--- arms/vue/src/components/Home/HomeContent.vue	(.../HomeContent.vue)	(revision d07e8d05f1402beebd11a90c45d1d40f0b91afac)
+++ arms/vue/src/components/Home/HomeContent.vue	(.../HomeContent.vue)	(revision f83c2c1ffc65e66fe39fb67766be33087db40c38)
@@ -1,100 +1,99 @@
 <template>
-	<div id="about" class="widget widget-white widget-about">
-		<div class="container">
-			<div class="row">
-				<div class="col-sm-offset-1 col-sm-10">
-					<h2>atlassian<strong>RMS</strong></h2>
-					<p>
-						atlassian <strong>Requirements Managment System</strong> 은 전세계에서
-						유일한 Jira 를 기반한 요구사항 관리 시스템입니다.
-					</p>
-					<div class="row features">
-						<div
-							:key="index"
-							v-for="(colData, index) in armsServiceList"
-							class="col-sm-4"
-						>
-							<section class="feature">
-								<div class="row">
-									<div class="col-xs-4">
-										<p>
-											<span class="icon" v-bind:class="colData.iconClassName">
-												<i v-bind:class="colData.iconImagePath"></i>
-											</span>
-										</p>
-									</div>
-									<div class="col-xs-8">
-										<h4>{{ colData.title }}</h4>
-										<p v-html="colData.subTitle"></p>
-									</div>
-								</div>
-							</section>
-						</div>
-					</div>
-				</div>
-			</div>
-			<p class="preview text-align-center">
-				<router-link to="/white" class="btn btn-lg btn-danger"
-					>&nbsp; Preview the Demo Version &nbsp;</router-link
-				>
-			</p>
-		</div>
-	</div>
+  <div id="about" class="widget widget-white widget-about">
+    <div class="container">
+      <div class="row">
+        <div class="col-sm-offset-1 col-sm-10">
+          <h2>atlassian<strong>RMS</strong></h2>
+          <p>
+            atlassian <strong>Requirements Managment System</strong> 은 전세계에서 유일한
+            Jira 를 기반한 요구사항 관리 시스템입니다.
+          </p>
+          <div class="row features">
+            <div
+              :key="index"
+              v-for="(colData, index) in armsServiceList"
+              class="col-sm-4"
+            >
+              <section class="feature">
+                <div class="row">
+                  <div class="col-xs-4">
+                    <p>
+                      <span class="icon" v-bind:class="colData.iconClassName">
+                        <i v-bind:class="colData.iconImagePath"></i>
+                      </span>
+                    </p>
+                  </div>
+                  <div class="col-xs-8">
+                    <h4>{{ colData.title }}</h4>
+                    <p v-html="colData.subTitle"></p>
+                  </div>
+                </div>
+              </section>
+            </div>
+          </div>
+        </div>
+      </div>
+      <p class="preview text-align-center">
+        <router-link to="/white" class="btn btn-lg btn-danger"
+          >&nbsp; Preview the Demo Version &nbsp;</router-link
+        >
+      </p>
+    </div>
+  </div>
 </template>
 
 <script lang="ts">
 export default {
-	data() {
-		return {
-			armsServiceList: [
-				{
-					title: "Scope",
-					subTitle: "제품(서비스)의 요구사항이 Jira의 END USER 까지 공유",
-					iconClassName: "background-danger",
-					iconImagePath: "fa fa-bold",
-				},
-				{
-					title: "Cost",
-					subTitle: "제품(서비스)의 Jira 분석<br />&#10132; 정확한 Resource 통계",
-					iconClassName: "background-warning",
-					iconImagePath: "fa fa-magic",
-				},
-				{
-					title: "Time",
-					subTitle:
-						"제품(서비스) Jira Project 맵핑<br />&#10132; 실질적인 진척도 측정",
-					iconClassName: "background-success",
-					iconImagePath: "fa fa-wrench",
-				},
-				{
-					title: "제품(서비스)",
-					subTitle:
-						"<p>aRMS는 제품과 서비스를 기준 <br />&#10132; 데이터를 구조화 합니다.</p>",
-					iconClassName: "background-primary",
-					iconImagePath: "fa fa-superscript",
-				},
-				{
-					title: "요구사항",
-					subTitle:
-						"<p>ARMS는 제품과 서비스를 기준<br />&#10132; 요구사항을 관리합니다.</p>",
-					iconClassName: "background-lime",
-					iconImagePath: "fa fa-check",
-				},
-				{
-					title: "Test(QA)",
-					subTitle:
-						"<p>ARMS는 제품과 서비스를 기준<br />&#10132; 요구사항의 테스트를 관리</p>",
-					iconClassName: "background-info",
-					iconImagePath: "fa fa-css3",
-				},
-			],
-		};
-	},
+  data() {
+    return {
+      armsServiceList: [
+        {
+          title: 'Scope',
+          subTitle: '제품(서비스)의 요구사항이 Jira의 END USER 까지 공유',
+          iconClassName: 'background-danger',
+          iconImagePath: 'fa fa-bold',
+        },
+        {
+          title: 'Cost',
+          subTitle: '제품(서비스)의 Jira 분석<br />&#10132; 정확한 Resource 통계',
+          iconClassName: 'background-warning',
+          iconImagePath: 'fa fa-magic',
+        },
+        {
+          title: 'Time',
+          subTitle: '제품(서비스) Jira Project 맵핑<br />&#10132; 실질적인 진척도 측정',
+          iconClassName: 'background-success',
+          iconImagePath: 'fa fa-wrench',
+        },
+        {
+          title: '제품(서비스)',
+          subTitle:
+            '<p>aRMS는 제품과 서비스를 기준 <br />&#10132; 데이터를 구조화 합니다.</p>',
+          iconClassName: 'background-primary',
+          iconImagePath: 'fa fa-superscript',
+        },
+        {
+          title: '요구사항',
+          subTitle:
+            '<p>ARMS는 제품과 서비스를 기준<br />&#10132; 요구사항을 관리합니다.</p>',
+          iconClassName: 'background-lime',
+          iconImagePath: 'fa fa-check',
+        },
+        {
+          title: 'Test(QA)',
+          subTitle:
+            '<p>ARMS는 제품과 서비스를 기준<br />&#10132; 요구사항의 테스트를 관리</p>',
+          iconClassName: 'background-info',
+          iconImagePath: 'fa fa-css3',
+        },
+      ],
+    };
+  },
 };
 </script>
 
 <style scoped>
 .col-sm-4:nth-child(-n + 3) {
-	margin-bottom: 60px;
+  margin-bottom: 60px;
 }
 </style>
Index: arms/vue/src/components/Home/HomeHeader.vue
===================================================================
diff -u -rd07e8d05f1402beebd11a90c45d1d40f0b91afac -rf83c2c1ffc65e66fe39fb67766be33087db40c38
--- arms/vue/src/components/Home/HomeHeader.vue	(.../HomeHeader.vue)	(revision d07e8d05f1402beebd11a90c45d1d40f0b91afac)
+++ arms/vue/src/components/Home/HomeHeader.vue	(.../HomeHeader.vue)	(revision f83c2c1ffc65e66fe39fb67766be33087db40c38)
@@ -1,27 +1,27 @@
 <template>
-	<header class="page-header">
-		<div class="navbar">
-			<div class="logo pull-left">
-				<h4>
-					<router-link to="/" style="margin-right: 5px">
-						atlassian-<strong>RMS</strong>
-					</router-link>
-					<small>Requirements Management System</small>
-				</h4>
-			</div>
-			<ul class="navbar-buttons pull-right">
-				<li>
-					<router-link to="/main" class="btn btn-sm btn-transparent">
-						Preview&nbsp; <i class="fa fa-arrow-right"></i
-					></router-link>
-				</li>
-				<li>
-					<a href="http://www.313.co.kr" class="btn btn-sm btn-transparent">
-						Contact us&nbsp;
-						<i class="fa eicon-qq"></i>
-					</a>
-				</li>
-			</ul>
-		</div>
-	</header>
+  <header class="page-header">
+    <div class="navbar">
+      <div class="logo pull-left">
+        <h4>
+          <router-link to="/" style="margin-right: 5px">
+            atlassian-<strong>RMS</strong>
+          </router-link>
+          <small>Requirements Management System</small>
+        </h4>
+      </div>
+      <ul class="navbar-buttons pull-right">
+        <li>
+          <router-link to="/main" class="btn btn-sm btn-transparent">
+            Preview&nbsp; <i class="fa fa-arrow-right"></i
+          ></router-link>
+        </li>
+        <li>
+          <a href="http://www.313.co.kr" class="btn btn-sm btn-transparent">
+            Contact us&nbsp;
+            <i class="fa eicon-qq"></i>
+          </a>
+        </li>
+      </ul>
+    </div>
+  </header>
 </template>
Index: arms/vue/src/components/Home/HomeSlider.vue
===================================================================
diff -u -rd07e8d05f1402beebd11a90c45d1d40f0b91afac -rf83c2c1ffc65e66fe39fb67766be33087db40c38
--- arms/vue/src/components/Home/HomeSlider.vue	(.../HomeSlider.vue)	(revision d07e8d05f1402beebd11a90c45d1d40f0b91afac)
+++ arms/vue/src/components/Home/HomeSlider.vue	(.../HomeSlider.vue)	(revision f83c2c1ffc65e66fe39fb67766be33087db40c38)
@@ -1,168 +1,161 @@
 <template>
-	<div class="content">
-		<div
-			id="carousel-landing"
-			class="carousel slide carousel-landing carousel-fade"
-			data-bs-ride="carousel"
-			data-bs-interval="false"
-		>
-			<ol class="carousel-indicators">
-				<li
-					data-bs-target="#carousel-landing"
-					data-bs-slide-to="0"
-					class="active"
-				></li>
-				<li data-bs-target="#carousel-landing" data-bs-slide-to="1" class=""></li>
-				<li data-bs-target="#carousel-landing" data-bs-slide-to="2" class=""></li>
-			</ol>
-			<div class="carousel-inner">
-				<div class="carousel-item item active">
-					<div class="row">
-						<div class="col-xs-6">
-							<div class="animated fadeInLeftBig">
-								<h1 class="slide-one-header">
-									<strong>aRMS</strong> <span class="font15">는</span>
-								</h1>
-								<p class="lead hidden-xs">
-									<strong>제품(서비스)</strong> 관점의 JIRA 전용 RMS 입니다.
-								</p>
-								<p class="lead hidden-xs font17">
-									제품(서비스) 중심으로 Jira Project를 분석하고,<br />
-									제품(서비스) 중심으로 요구사항을 Jira Project 에 전파합니다.
-								</p>
-								<p>
-									<router-link to="/main" class="btn btn-lg btn-white">
-										Preview &nbsp; <i class="fa fa-angle-right"></i
-									></router-link>
-									<a
-										href="http://www.313.co.kr"
-										style="margin-left: 13px"
-										class="btn btn-lg btn-transparent"
-									>
-										Contact us &nbsp; <i class="fa eicon-qq"></i>
-									</a>
-								</p>
-							</div>
-						</div>
-						<div class="col-xs-6">
-							<div class="text-align-center animated fadeInRightBig">
-								<img
-									src="../../assets/light-blue/img/jpeg/light-blue-preview-1.png"
-									alt="Second slide"
-								/>
-							</div>
-						</div>
-					</div>
-				</div>
-				<div class="carousel-item item">
-					<h1
-						class="slide-two-header text-align-center animated fadeInDown"
-						style="font-size: 24px !important"
-					>
-						<strong>aRMS</strong><span class="font16">는</span> 제품(서비스) 관점<span
-							class="font16"
-							>으로</span
-						>
-						<strong>다양한 분석 지표</strong
-						><span class="font16">를 지속적으로 업데이트 및 제공합니다.</span>
-					</h1>
-					<div class="row">
-						<div class="col-xs-6">
-							<div class="animated fadeInLeftBig">
-								<p>
-									<router-link to="/main">
-										<img
-											src="../../assets/light-blue/img/jpeg/light-blue-laptop-transparent.png"
-											alt=""
-									/></router-link>
-								</p>
-								<p class="text-align-center">
-									<router-link
-										to="/main"
-										class="btn btn-transparent btn-lg btn-version-preview"
-									>
-										Preview &nbsp; <i class="fa fa-angle-right"></i
-									></router-link>
-								</p>
-							</div>
-						</div>
-						<div class="col-xs-6">
-							<div class="animated fadeInRightBig">
-								<p>
-									<a href="http://www.313.co.kr">
-										<img
-											src="../../assets/light-blue/img/jpeg/light-blue-laptop-white.png"
-											alt=""
-										/>
-									</a>
-								</p>
-								<p class="text-align-center">
-									<a
-										href="http://www.313.co.kr"
-										class="btn btn-white btn-lg btn-version-preview"
-									>
-										Contact us &nbsp; <i class="fa eicon-qq"></i>
-									</a>
-								</p>
-							</div>
-						</div>
-					</div>
-				</div>
-				<div class="carousel-item item">
-					<div class="row">
-						<div class="col-xs-6">
-							<div class="animated fadeInLeft">
-								<h1 class="slide-three-header" style="font-size: 17px !important">
-									Jira를 쓰고 계십니까?
-									<br /><br />
-									제품(서비스)를 만들고 계십니까?
-									<br /><br />
-									<strong>aRMS가 필요합니다.!</strong>
-									<br /><br />
-									제품(서비스)의 요구사항을 관리 하고,
-									<br /><br />
-									제품(서비스)의 진척도를 확인 하고,
-									<br /><br />
-									제품(서비스)의 출시를 결정 할 수 있습니다.
-								</h1>
-								<p>
-									<router-link to="/main" class="btn btn-white btn-lg" target="_blank"
-										>Test It</router-link
-									>
-								</p>
-							</div>
-						</div>
-						<div class="col-xs-6">
-							<p class="animated fadeInUp" style="margin-top: 20px">
-								<img
-									src="../../assets/light-blue/img/jpeg/light-blue-phone.png"
-									alt=""
-								/>
-							</p>
-						</div>
-					</div>
-				</div>
-			</div>
-			<div
-				class="left carousel-control carousel-control-landing carousel-control-prev"
-				data-bs-target="#carousel-landing"
-				data-bs-slide="prev"
-			>
-				<span class="icon-prev"></span>
-			</div>
-			<div
-				class="right carousel-control carousel-control-landing carousel-control-next"
-				data-bs-target="#carousel-landing"
-				data-bs-slide="next"
-			>
-				<span class="icon-next"></span>
-			</div>
-		</div>
-	</div>
+  <div class="content">
+    <div
+      id="carousel-landing"
+      class="carousel slide carousel-landing carousel-fade"
+      data-bs-ride="carousel"
+      data-bs-interval="false"
+    >
+      <ol class="carousel-indicators">
+        <li data-bs-target="#carousel-landing" data-bs-slide-to="0" class="active"></li>
+        <li data-bs-target="#carousel-landing" data-bs-slide-to="1" class=""></li>
+        <li data-bs-target="#carousel-landing" data-bs-slide-to="2" class=""></li>
+      </ol>
+      <div class="carousel-inner">
+        <div class="carousel-item item active">
+          <div class="row">
+            <div class="col-xs-6">
+              <div class="animated fadeInLeftBig">
+                <h1 class="slide-one-header">
+                  <strong>aRMS</strong> <span class="font15">는</span>
+                </h1>
+                <p class="lead hidden-xs">
+                  <strong>제품(서비스)</strong> 관점의 JIRA 전용 RMS 입니다.
+                </p>
+                <p class="lead hidden-xs font17">
+                  제품(서비스) 중심으로 Jira Project를 분석하고,<br />
+                  제품(서비스) 중심으로 요구사항을 Jira Project 에 전파합니다.
+                </p>
+                <p>
+                  <router-link to="/main" class="btn btn-lg btn-white">
+                    Preview &nbsp; <i class="fa fa-angle-right"></i
+                  ></router-link>
+                  <a
+                    href="http://www.313.co.kr"
+                    style="margin-left: 13px"
+                    class="btn btn-lg btn-transparent"
+                  >
+                    Contact us &nbsp; <i class="fa eicon-qq"></i>
+                  </a>
+                </p>
+              </div>
+            </div>
+            <div class="col-xs-6">
+              <div class="text-align-center animated fadeInRightBig">
+                <img
+                  src="../../assets/light-blue/img/jpeg/light-blue-preview-1.png"
+                  alt="Second slide"
+                />
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="carousel-item item">
+          <h1
+            class="slide-two-header text-align-center animated fadeInDown"
+            style="font-size: 24px !important"
+          >
+            <strong>aRMS</strong><span class="font16">는</span> 제품(서비스) 관점<span
+              class="font16"
+              >으로</span
+            >
+            <strong>다양한 분석 지표</strong
+            ><span class="font16">를 지속적으로 업데이트 및 제공합니다.</span>
+          </h1>
+          <div class="row">
+            <div class="col-xs-6">
+              <div class="animated fadeInLeftBig">
+                <p>
+                  <router-link to="/main">
+                    <img
+                      src="../../assets/light-blue/img/jpeg/light-blue-laptop-transparent.png"
+                      alt=""
+                  /></router-link>
+                </p>
+                <p class="text-align-center">
+                  <router-link
+                    to="/main"
+                    class="btn btn-transparent btn-lg btn-version-preview"
+                  >
+                    Preview &nbsp; <i class="fa fa-angle-right"></i
+                  ></router-link>
+                </p>
+              </div>
+            </div>
+            <div class="col-xs-6">
+              <div class="animated fadeInRightBig">
+                <p>
+                  <a href="http://www.313.co.kr">
+                    <img
+                      src="../../assets/light-blue/img/jpeg/light-blue-laptop-white.png"
+                      alt=""
+                    />
+                  </a>
+                </p>
+                <p class="text-align-center">
+                  <a
+                    href="http://www.313.co.kr"
+                    class="btn btn-white btn-lg btn-version-preview"
+                  >
+                    Contact us &nbsp; <i class="fa eicon-qq"></i>
+                  </a>
+                </p>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="carousel-item item">
+          <div class="row">
+            <div class="col-xs-6">
+              <div class="animated fadeInLeft">
+                <h1 class="slide-three-header" style="font-size: 17px !important">
+                  Jira를 쓰고 계십니까?
+                  <br /><br />
+                  제품(서비스)를 만들고 계십니까?
+                  <br /><br />
+                  <strong>aRMS가 필요합니다.!</strong>
+                  <br /><br />
+                  제품(서비스)의 요구사항을 관리 하고,
+                  <br /><br />
+                  제품(서비스)의 진척도를 확인 하고,
+                  <br /><br />
+                  제품(서비스)의 출시를 결정 할 수 있습니다.
+                </h1>
+                <p>
+                  <router-link to="/main" class="btn btn-white btn-lg" target="_blank"
+                    >Test It</router-link
+                  >
+                </p>
+              </div>
+            </div>
+            <div class="col-xs-6">
+              <p class="animated fadeInUp" style="margin-top: 20px">
+                <img src="../../assets/light-blue/img/jpeg/light-blue-phone.png" alt="" />
+              </p>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div
+        class="left carousel-control carousel-control-landing carousel-control-prev"
+        data-bs-target="#carousel-landing"
+        data-bs-slide="prev"
+      >
+        <span class="icon-prev"></span>
+      </div>
+      <div
+        class="right carousel-control carousel-control-landing carousel-control-next"
+        data-bs-target="#carousel-landing"
+        data-bs-slide="next"
+      >
+        <span class="icon-next"></span>
+      </div>
+    </div>
+  </div>
 </template>
 
 <style scoped>
 .carousel-indicators li {
-	margin-right: 4px;
+  margin-right: 4px;
 }
 </style>