Index: arms/html/dashboard/content-container.html
===================================================================
diff -u -rda047b5b8fae2be6576a7a33d8ba91c83047a8d6 -r538d4587b4c7fb8763ee83fe13e9224e90b703a7
--- arms/html/dashboard/content-container.html	(.../content-container.html)	(revision da047b5b8fae2be6576a7a33d8ba91c83047a8d6)
+++ arms/html/dashboard/content-container.html	(.../content-container.html)	(revision 538d4587b4c7fb8763ee83fe13e9224e90b703a7)
@@ -1,803 +1,1017 @@
 <div class="row">
-    <div class="col-lg-12 col-layer">
-        <section class="widget">
-            <header>
-                <h4>
-				<span   class="font13"
-                        style="font-weight: bold">
-					<i class="fa fa-home"></i>
-					통합 현황
-				</span>
-                </h4>
-                <div class="widget-controls">
-                    <a  data-widgster="toleft"
-                        title="change width to left"
-                        href="#">
-                        <i class="glyphicon glyphicon-chevron-left"></i>
-                    </a>
-                    <a  data-widgster="expand"
-                        title="Expand"
-                        href="#">
-                        <i class="glyphicon glyphicon-chevron-up"></i>
-                    </a>
-                    <a  data-widgster="collapse"
-                        title="Collapse"
-                        href="#">
-                        <i class="glyphicon glyphicon-chevron-down"></i>
-                    </a>
-                    <a  data-widgster="toright"
-                        title="change width to right"
-                        href="#">
-                        <i class="glyphicon glyphicon-chevron-right"></i>
-                    </a>
-                    <a  data-widgster="restore"
-                        title="Restore"
-                        href="#">
-                        <span class="glyphicon glyphicon-repeat"></span>
-                    </a>
-                    <a  data-widgster="fullscreen"
-                        title="Fullscreen"
-                        href="#">
-                        <i class="glyphicon glyphicon-fullscreen"
-                           style="font-size: 11px">
-                        </i>
-                    </a>
-                </div>
-            </header>
-            <div class="body">
-                <blockquote class="font13"
-                            style="margin-top: 5px;">
-                    선택한 제품(서비스)와 버전의 관점(Time / Scope / Resource)별 요구사항 현황
-                    <div style="float: right;">
-                        <button class="btn btn-transparent btn-xs"
-                                style="margin-top: -3px; color: #acacac; background: rgba(51,51,51,.2); padding: 1px 9px;"
-                                onclick="window.open('docs/guide.html#requirement_regist_inquiry')">
-                            Help
-                            <i  class="fa fa-question"
-                                style="font-size: 14px; vertical-align: middle; color: #acacac"></i>
-                        </button>
-                    </div>
-                </blockquote>
-                <div class="row">
-                    <div
-                            class="col-lg-12 col-layer"
-                            id="notifyNoVersion" style="margin-bottom: 10px">
-                        <section class="widget" style="text-align: center; color: #e49400; margin-bottom: 10px">
-                            제품 선택 후 대시보드가 로드됩니다.
-                        </section>
-                    </div>
-                    <div class="col-md-3">
-                        <section    class="widget dashboard-top-section"
-                                    style="border: dashed;border-width: thin;border-color: lightsteelblue;">
-                            <header style="margin-bottom: 20px">
-                                <h4>
-									<span class="font13" style="font-weight: bold">
+	<div class="col-lg-12 col-layer">
+		<section class="widget">
+			<header>
+				<h4>
+					<span
+						class="font13"
+						style="font-weight: bold">
+						<i class="fa fa-home"></i>
+						통합 현황
+					</span>
+				</h4>
+				<div class="widget-controls">
+					<a
+						data-widgster="toleft"
+						title="change width to left"
+						href="#">
+						<i class="glyphicon glyphicon-chevron-left"></i>
+					</a>
+					<a
+						data-widgster="expand"
+						title="Expand"
+						href="#">
+						<i class="glyphicon glyphicon-chevron-up"></i>
+					</a>
+					<a
+						data-widgster="collapse"
+						title="Collapse"
+						href="#">
+						<i class="glyphicon glyphicon-chevron-down"></i>
+					</a>
+					<a
+						data-widgster="toright"
+						title="change width to right"
+						href="#">
+						<i class="glyphicon glyphicon-chevron-right"></i>
+					</a>
+					<a
+						data-widgster="restore"
+						title="Restore"
+						href="#">
+						<span class="glyphicon glyphicon-repeat"></span>
+					</a>
+					<a
+						data-widgster="fullscreen"
+						title="Fullscreen"
+						href="#">
+						<i
+							class="glyphicon glyphicon-fullscreen"
+							style="font-size: 11px"></i>
+					</a>
+				</div>
+			</header>
+			<div class="body">
+				<blockquote
+					class="font13"
+					style="margin-top: 5px">
+					선택한 제품(서비스)와 버전의 관점(Time / Scope / Resource)별 요구사항 현황
+					<div style="float: right">
+						<button
+							class="btn btn-transparent btn-xs"
+							style="margin-top: -3px; color: #acacac; background: rgba(51, 51, 51, 0.2); padding: 1px 9px"
+							onclick="window.open('docs/guide.html#requirement_regist_inquiry')">
+							Help
+							<i
+								class="fa fa-question"
+								style="font-size: 14px; vertical-align: middle; color: #acacac"></i>
+						</button>
+					</div>
+				</blockquote>
+				<div class="row">
+					<div
+						class="col-lg-12 col-layer"
+						id="notifyNoVersion"
+						style="margin-bottom: 10px">
+						<section
+							class="widget"
+							style="text-align: center; color: #e49400; margin-bottom: 10px">
+							제품 선택 후 대시보드가 로드됩니다.
+						</section>
+					</div>
+					<div class="col-md-3">
+						<section
+							class="widget dashboard-top-section"
+							style="border: dashed; border-width: thin; border-color: lightsteelblue">
+							<header style="margin-bottom: 20px">
+								<h4>
+									<span
+										class="font13"
+										style="font-weight: bold">
 										<i class="fa fa-asterisk"></i>
 										제품(서비스) - 버전 선택
 									</span>
-                                </h4>
-                            </header>
-                            <div class="body">
-                                <div class="column">
-                                    <span>1. Product<sup>service</sup> 를 선택해 주세요</span>
-                                    <div    class="control-group"
-                                            class="darkBack"
-                                            style="padding-top: 10px; padding-bottom: 15px; border: 0">
-                                        <div    class="controls form-group"
-                                                class="darkBack"
-                                                style="margin-bottom: 5px !important">
-                                            <select id="selected_pdService"
-                                                    required="required"
-                                                    data-placeholder="Select Product(Service)"
-                                                    class="select-block-level chzn-select darkBack"
-                                                    tabindex="-1"
-                                                    name="selected_pdService"
-                                                    style="width: 100% !important">
-                                                <option value=""></option>
-                                            </select>
-                                        </div>
-                                    </div>
-                                    <span>2. 버전을 선택해 주세요</span>
-                                    <div    class="control-group"
-                                            style="padding-top: 10px; padding-bottom: 10px; border: 0;">
-                                        <div    class="controls form-group"
-                                                style="margin-bottom: 5px !important">
-                                            <select multiple="multiple"
-                                                    id="multiversion"
-                                                    class="multiple-select btn-block darkBack"
-                                                    placeholder="&nbsp;&nbsp;Select Version">
-                                            </select>
-                                        </div>
-                                    </div>
-                                </div>
-                            </div>
-                        </section>
-                    </div>
+								</h4>
+							</header>
+							<div class="body">
+								<div class="column">
+									<span>
+										1. Product
+										<sup>service</sup>
+										를 선택해 주세요
+									</span>
+									<div
+										class="control-group"
+										class="darkBack"
+										style="padding-top: 10px; padding-bottom: 15px; border: 0">
+										<div
+											class="controls form-group"
+											class="darkBack"
+											style="margin-bottom: 5px !important">
+											<select
+												id="selected_pdService"
+												required="required"
+												data-placeholder="Select Product(Service)"
+												class="select-block-level chzn-select darkBack"
+												tabindex="-1"
+												name="selected_pdService"
+												style="width: 100% !important">
+												<option value=""></option>
+											</select>
+										</div>
+									</div>
+									<span>2. 버전을 선택해 주세요</span>
+									<div
+										class="control-group"
+										style="padding-top: 10px; padding-bottom: 10px; border: 0">
+										<div
+											class="controls form-group"
+											style="margin-bottom: 5px !important">
+											<select
+												multiple="multiple"
+												id="multiversion"
+												class="multiple-select btn-block darkBack"
+												placeholder="&nbsp;&nbsp;Select Version"></select>
+										</div>
+									</div>
+								</div>
+							</div>
+						</section>
+					</div>
 
-                    <div class="col-md-3">
-                        <section class="widget dashboard-top-section">
-                            <header style="margin-bottom: 15px">
-                                <h4>
-									<span class="font13" style="font-weight: bold">
+					<div class="col-md-3">
+						<section class="widget dashboard-top-section">
+							<header style="margin-bottom: 15px">
+								<h4>
+									<span
+										class="font13"
+										style="font-weight: bold">
 										<i class="fa fa-clock-o"></i>
 										Time | 작업 일정
 									</span>
-                                </h4>
-                            </header>
-                            <div class="body">
-                                <div    class="control-group"
-                                        class="darkBack"
-                                        style="padding-bottom: 10px; border: 0">
-                                    <div    class="darkBack"
-                                            style="margin-bottom: 10px !important; padding: 10px 0px; !important; text-align: center">
-                                        <span>총 버전 개수 <br/><a id="version_count" style="font-weight: bold;">-</a> 개</span><br>
-                                    </div>
-                                    <div    class="controls form-group darkBack col-md-6"
-                                            style="margin-bottom: 5px !important; padding: 10px 0px; !important; text-align: center">
-                                        <span>요구사항 존재 <br/><a id="active_version_count" style="font-weight: bold;">-</a> 개</span><br>
-                                    </div>
-                                    <div    class="controls form-group darkBack col-md-6"
-                                            style="margin-bottom: 5px !important; padding: 10px 0px; !important; text-align: center">
-                                        <span>요구사항 미존재 <br/><a id="inactive_version_count" style="font-weight: bold;">-</a> 개</span><br>
-                                    </div>
-<!--                                    <div    class="control-group "
+								</h4>
+							</header>
+							<div class="body">
+								<div
+									class="control-group"
+									class="darkBack"
+									style="padding-bottom: 10px; border: 0">
+									<div
+										class="darkBack"
+										style="margin-bottom: 10px !important; padding: 10px 0px; !important; text-align: center">
+										<span>
+											총 버전 개수
+											<br />
+											<a
+												id="version_count"
+												style="font-weight: bold">
+												-
+											</a>
+											개
+										</span>
+										<br />
+									</div>
+									<div
+										class="controls form-group darkBack col-md-6"
+										style="margin-bottom: 5px !important; padding: 10px 0px; !important; text-align: center">
+										<span>
+											요구사항 존재
+											<br />
+											<a
+												id="active_version_count"
+												style="font-weight: bold">
+												-
+											</a>
+											개
+										</span>
+										<br />
+									</div>
+									<div
+										class="controls form-group darkBack col-md-6"
+										style="margin-bottom: 5px !important; padding: 10px 0px; !important; text-align: center">
+										<span>
+											요구사항 미존재
+											<br />
+											<a
+												id="inactive_version_count"
+												style="font-weight: bold">
+												-
+											</a>
+											개
+										</span>
+										<br />
+									</div>
+									<!--                                    <div    class="control-group "
                                             style="padding-bottom: 10px; border: 0">
                                         <div    class="controls form-group darkBack"
                                                 id="version_progress_status"
                                                 style="margin-bottom: 5px !important;">
                                         </div>
                                     </div>-->
-                                </div>
-<!--                                <div class="color-light">-->
-<!--                                    <div id="light">-->
-<!--                                        <span class="active" id="red"></span>-->
-<!--                                        <span id="orange"></span>-->
-<!--                                        <span id="green"></span>-->
-<!--                                    </div>-->
+								</div>
+								<!--                                <div class="color-light">-->
+								<!--                                    <div id="light">-->
+								<!--                                        <span class="active" id="red"></span>-->
+								<!--                                        <span id="orange"></span>-->
+								<!--                                        <span id="green"></span>-->
+								<!--                                    </div>-->
 
-<!--                                    <button class="btn btn-primary btn-block btn-sm hidden">Switch Light</button>-->
-<!--                                </div>-->
-                            </div>
-                        </section>
-                    </div>
+								<!--                                    <button class="btn btn-primary btn-block btn-sm hidden">Switch Light</button>-->
+								<!--                                </div>-->
+							</div>
+						</section>
+					</div>
 
-                    <div class="col-md-3">
-                        <section class="widget dashboard-top-section">
-                            <header style="margin-bottom: 15px">
-                                <h4>
-									<span class="font13" style="font-weight: bold">
+					<div class="col-md-3">
+						<section class="widget dashboard-top-section">
+							<header style="margin-bottom: 15px">
+								<h4>
+									<span
+										class="font13"
+										style="font-weight: bold">
 										<i class="fa fa-calendar-o"></i>
 										Scope | 이슈 현황
 									</span>
-                                </h4>
-                            </header>
-                            <div class="body">
-                                <div    class="control-group"
-                                        style="padding-bottom: 10px; border: 0">
-                                    <div    class="controls form-group darkBack col-md-6"
-                                            style="margin-bottom: 10px !important; padding: 10px 0px; !important; text-align: center">
-                                        <span>총 요구사항<br/><a id="req_count" style="font-weight: bold;">-</a> 개</span><br>
-                                    </div>
-                                    <div    class="controls form-group darkBack col-md-6"
-                                            style="margin-bottom: 10px !important; padding: 10px 0px; !important; text-align: center">
-                                        <span>총 이슈<br/><a id="linkedIssue_subtask_count" style="font-weight: bold;">-</a> 개</span><br>
-                                    </div>
-                                    <div    class="controls form-group darkBack col-md-12"
-                                            style="margin-bottom: 10px !important; padding: 10px 0px; !important; text-align: center">
-                                        <span>요구사항별 평균 이슈 : <a id="linkedIssue_subtask_count_per_req" style="font-weight: bold;">-</a> 개</span><br>
-                                    </div>
-<!--                                    <div    class="controls form-group darkBack col-md-12"
+								</h4>
+							</header>
+							<div class="body">
+								<div
+									class="control-group"
+									style="padding-bottom: 10px; border: 0">
+									<div
+										class="controls form-group darkBack col-md-6"
+										style="margin-bottom: 10px !important; padding: 10px 0px; !important; text-align: center">
+										<span>
+											총 요구사항
+											<br />
+											<a
+												id="req_count"
+												style="font-weight: bold">
+												-
+											</a>
+											개
+										</span>
+										<br />
+									</div>
+									<div
+										class="controls form-group darkBack col-md-6"
+										style="margin-bottom: 10px !important; padding: 10px 0px; !important; text-align: center">
+										<span>
+											총 이슈
+											<br />
+											<a
+												id="linkedIssue_subtask_count"
+												style="font-weight: bold">
+												-
+											</a>
+											개
+										</span>
+										<br />
+									</div>
+									<div
+										class="controls form-group darkBack col-md-12"
+										style="margin-bottom: 10px !important; padding: 10px 0px; !important; text-align: center">
+										<span>
+											요구사항별 평균 이슈 :
+											<a
+												id="linkedIssue_subtask_count_per_req"
+												style="font-weight: bold">
+												-
+											</a>
+											개
+										</span>
+										<br />
+									</div>
+									<!--                                    <div    class="controls form-group darkBack col-md-12"
                                             style="margin-bottom: 5px !important; padding: 8px 0px; !important; text-align: center">
                                         <span>이슈 평균 처리일 : <a id="linkedIssue_subtask_count" style="font-weight: bold;">-</a> 일</span><br>
                                     </div>-->
-                                    <div    class="controls form-group darkBack col-md-12"
-                                            style="margin-bottom: 5px !important; padding: 8px 0px; !important; text-align: center">
-                                        <span>담당자 미지정 이슈 : <a id="no_assigned_issue_count" style="font-weight: bold;">-</a> 개</span><br>
-                                    </div>
-<!--                                    <div    class="control-group darkBack"
+									<div
+										class="controls form-group darkBack col-md-12"
+										style="margin-bottom: 5px !important; padding: 8px 0px; !important; text-align: center">
+										<span>
+											담당자 미지정 이슈 :
+											<a
+												id="no_assigned_issue_count"
+												style="font-weight: bold">
+												-
+											</a>
+											개
+										</span>
+										<br />
+									</div>
+									<!--                                    <div    class="control-group darkBack"
                                             style="padding-bottom: 10px; border: 0">
                                         <div    class="controls form-group darkBack"
                                                 id="scope_progress_status"
                                                 style="margin-bottom: 5px !important;">
                                         </div>
                                     </div>-->
-                                </div>
-                            </div>
-                        </section>
-                    </div>
+								</div>
+							</div>
+						</section>
+					</div>
 
-                    <div class="col-md-3">
-                        <section class="widget dashboard-top-section">
-                            <header style="margin-bottom: 15px">
-                                <h4>
-									<span class="font13" style="font-weight: bold">
+					<div class="col-md-3">
+						<section class="widget dashboard-top-section">
+							<header style="margin-bottom: 15px">
+								<h4>
+									<span
+										class="font13"
+										style="font-weight: bold">
 										<i class="fa fa-dollar"></i>
 										Resource | 자원분배
 									</span>
-                                </h4>
-                            </header>
-                            <div class="body">
-                                <div    class="control-group"
-                                        style="padding-bottom: 10px; border: 0">
-                                    <div    class="controls form-group darkBack"
-                                            style="margin-bottom: 10px !important; padding: 10px 0px !important; text-align: center">
-                                        <span>투입 총 인원 : <a id="resource_count" style="font-weight: bold;">-</a> 명</span><br>
-<!--                                        <span>✔ 버전별 인원 평균: <a id="resource_per_version" style="font-weight: bold;">-</a> 명</span><br>-->
-<!--                                        <span>✔ 투입 인원 평균 요구사항 연결 이슈 수: <a id="avg_req_count2" style="font-weight: bold;">-</a> 개</span><br>-->
-<!--                                        <span>✔ 투입 인원 일평균 요구사항 연결 이슈 수: <a id="avg_req_linkedIssue_subtask_count" style="font-weight: bold;">-</a> 개</span><br>-->
-                                    </div>
-                                    <div    class="controls form-group darkBack"
+								</h4>
+							</header>
+							<div class="body">
+								<div
+									class="control-group"
+									style="padding-bottom: 10px; border: 0">
+									<div
+										class="controls form-group darkBack"
+										style="margin-bottom: 10px !important; padding: 10px 0px !important; text-align: center">
+										<span>
+											투입 총 인원 :
+											<a
+												id="resource_count"
+												style="font-weight: bold">
+												-
+											</a>
+											명
+										</span>
+										<br />
+										<!--                                        <span>✔ 버전별 인원 평균: <a id="resource_per_version" style="font-weight: bold;">-</a> 명</span><br>-->
+										<!--                                        <span>✔ 투입 인원 평균 요구사항 연결 이슈 수: <a id="avg_req_count2" style="font-weight: bold;">-</a> 개</span><br>-->
+										<!--                                        <span>✔ 투입 인원 일평균 요구사항 연결 이슈 수: <a id="avg_req_linkedIssue_subtask_count" style="font-weight: bold;">-</a> 개</span><br>-->
+									</div>
+									<div
+										class="controls form-group darkBack"
+										style="margin-bottom: 5px !important; padding: 10px 0px !important; text-align: center">
+										<span>
+											인원별 평균 요구사항 :
+											<a
+												id="avg_req_count"
+												style="font-weight: bold">
+												-
+											</a>
+											개
+										</span>
+										<br />
+									</div>
+									<!--                                    <div    class="controls form-group darkBack"
                                             style="margin-bottom: 5px !important; padding: 10px 0px !important; text-align: center">
-                                        <span>인원별 평균 요구사항 : <a id="avg_req_count" style="font-weight: bold;">-</a> 개</span><br>
-                                    </div>
-<!--                                    <div    class="controls form-group darkBack"
-                                            style="margin-bottom: 5px !important; padding: 10px 0px !important; text-align: center">
                                         <span>일평균 요구사항 처리 : <a id="avg_req_resolve_or_close_count" style="font-weight: bold;">-</a> 개</span><br>
                                     </div>-->
-<!--                                    <div    class="controls form-group darkBack"
+									<!--                                    <div    class="controls form-group darkBack"
                                             style="padding: 10px 0px !important; text-align: center; margin-bottom: 0px">
                                         <span>일평균 이슈 처리 : <a id="avg_req_linkedIssue_resolve_or_close_count" style="font-weight: bold;">-</a> 개</span><br>
                                     </div>-->
-<!--                                    <div    class="control-group darkBack"
+									<!--                                    <div    class="control-group darkBack"
                                             style="padding-bottom: 10px; border: 0">
                                         <div    class="controls form-group darkBack"
                                                 id="scope_progress_status"
                                                 style="margin-bottom: 5px !important;">
                                         </div>
                                     </div>-->
-                                </div>
-                            </div>
-                        </section>
-                    </div>
-
-                </div>
-            </div>
-        </section>
-    </div>
+								</div>
+							</div>
+						</section>
+					</div>
+				</div>
+			</div>
+		</section>
+	</div>
 </div>
 
 <div class="row">
-    <div class="col-lg-6 col-layer">
-        <section class="widget">
-            <header>
-                <h4>
-                    <span   class="font13"
-                            style="font-weight: bold">
-                        <i class="fa fa-sort-amount-asc"></i>
-                        진행 현황
-                    </span>
-                </h4>
-                <div class="widget-controls">
-                    <a  data-widgster="toleft"
-                        title="change width to left"
-                        href="#">
-                        <i class="glyphicon glyphicon-chevron-left"></i>
-                    </a>
-                    <a  data-widgster="expand"
-                        title="Expand"
-                        href="#">
-                        <i class="glyphicon glyphicon-chevron-up"></i>
-                    </a>
-                    <a  data-widgster="collapse"
-                        title="Collapse"
-                        href="#">
-                        <i class="glyphicon glyphicon-chevron-down"></i>
-                    </a>
-                    <a  data-widgster="toright"
-                        title="change width to right"
-                        href="#">
-                        <i class="glyphicon glyphicon-chevron-right"></i>
-                    </a>
-                    <a  data-widgster="restore"
-                        title="Restore"
-                        href="#">
-                        <span class="glyphicon glyphicon-repeat"></span>
-                    </a>
-                    <a  data-widgster="fullscreen"
-                        title="Fullscreen"
-                        href="#">
-                        <i class="glyphicon glyphicon-fullscreen"
-                           style="font-size: 11px">
-                        </i>
-                    </a>
-                </div>
-            </header>
-            <div class="body">
-                <div class="row" style="height: 130px">
-                    <div class="col-md-12">
-                        <section class="widget" style="margin-bottom: 2px">
-                            <header>
-                                <h4>
-                                    <span
-                                            class="font13"
-                                            style="font-weight: bold">
-                                        <i class="fa fa-clock-o"></i>
-                                        진행 기한
-                                    </span>
-                                </h4>
-                            </header>
-                            <div
-                                    class="body"
-                                    id="project-progress-wrapper">
-                                <div style="display: flex; flex-direction: row; height: 42%; justify-content: space-between">
-                                    <div
-                                            id="project-start"
-                                            class="box col-sm-4 fade-in-box"
-                                            style="display: none; margin-bottom: 0px; margin-right: 10px">
-                                        <span>시작일로부터</span>
-                                        <br />
-                                        <span
-                                                class="project-date"
-                                                id="fastestStartDate"></span>
-                                        <div
-                                                class="day-progress"
-                                                id="startDDay"></div>
-                                    </div>
-                                    <div
-                                            id="project-end"
-                                            class="box col-sm-4 fade-in-box"
-                                            style="display: none;margin-bottom: 0px; padding-bottom: 30px;">
-                                        <span>종료일까지</span>
-                                        <br />
-                                        <span
-                                                class="project-date"
-                                                id="latestEndDate"></span>
-                                        <div
-                                                class="day-progress"
-                                                id="endDDay"></div>
-                                    </div>
-                                    <div class="col-sm-4 fade-in-box" id="versionGaugeChart" style="height: 90px"></div>
-                                </div>
-
-                            </div>
-                        </section>
-                    </div>
-                </div>
-                <div class="row" style="height: 230px; margin-top: 15px">
-                    <div class="col-lg-12">
-                        <section class="widget">
-                            <header>
-                                <h4>
-                                    <span
-                                            class="font13"
-                                            style="font-weight: bold">
-                                        <i class="fa fa-tasks"></i>
-                                        버전 타임라인
-                                    </span>
-                                </h4>
-                            </header>
-                            <div
-                                    class="body"
-                                    id="version-timeline-wrapper"  style="height: 150px;">
-                                <div id="version-timeline-bar" class="time_element"></div>
-                            </div>
-                        </section>
-                    </div>
-                </div>
-            </div>
-        </section>
-    </div>
-    <div class="col-lg-6 col-layer">
-        <section class="widget">
-            <header>
-                <h4>
-                    <span   class="font13"
-                            style="font-weight: bold">
-                        <i class="fa fa-calendar-o"></i>
-                        요구사항 해결 추이
-                    </span>
-                </h4>
-                <div class="widget-controls">
-                    <a  data-widgster="toleft"
-                        title="change width to left"
-                        href="#">
-                        <i class="glyphicon glyphicon-chevron-left"></i>
-                    </a>
-                    <a  data-widgster="expand"
-                        title="Expand"
-                        href="#">
-                        <i class="glyphicon glyphicon-chevron-up"></i>
-                    </a>
-                    <a  data-widgster="collapse"
-                        title="Collapse"
-                        href="#">
-                        <i class="glyphicon glyphicon-chevron-down"></i>
-                    </a>
-                    <a  data-widgster="toright"
-                        title="change width to right"
-                        href="#">
-                        <i class="glyphicon glyphicon-chevron-right"></i>
-                    </a>
-                    <a  data-widgster="restore"
-                        title="Restore"
-                        href="#">
-                        <span class="glyphicon glyphicon-repeat"></span>
-                    </a>
-                    <a  data-widgster="fullscreen"
-                        title="Fullscreen"
-                        href="#">
-                        <i class="glyphicon glyphicon-fullscreen"
-                           style="font-size: 11px">
-                        </i>
-                    </a>
-                </div>
-            </header>
-            <div class="body">
-                <div class="row">
-                    <div class="col-md-6" style="padding-right: 4px !important;">
-                        <section class="widget">
-                            <header>
-                                <h4>
-                                    <span
-                                            class="font13"
-                                            style="font-weight: bold">
-                                        <i class="fa fa-tasks"></i>
-                                        제품 버전 별 작업자
-                                    </span>
-                                </h4>
-                            </header>
-                        <div class="body" id="chart-product-manpower" style="height: 286px">
-                        </div>
-                        </section>
-                    </div>
-                    <div class="col-md-6">
-                        <section class="widget">
-                            <header>
-                                <h4>
-                                    <span
-                                            class="font13"
-                                            style="font-weight: bold">
-                                        <i class="fa fa-tasks"></i>
-                                        작업자 별 요구사항 관여도
-                                    </span>
-                                </h4>
-                            </header>
-                        <div class="body echart-no-data" id="chart-manpower-requirement" style="height: 286px">
-                        </div>
-                        </section>
-                    </div>
-                </div>
-            </div>
-        </section>
-    </div>
+	<div class="col-lg-6 col-layer">
+		<section class="widget">
+			<header>
+				<h4>
+					<span
+						class="font13"
+						style="font-weight: bold">
+						<i class="fa fa-sort-amount-asc"></i>
+						진행 현황
+					</span>
+				</h4>
+				<div class="widget-controls">
+					<a
+						data-widgster="toleft"
+						title="change width to left"
+						href="#">
+						<i class="glyphicon glyphicon-chevron-left"></i>
+					</a>
+					<a
+						data-widgster="expand"
+						title="Expand"
+						href="#">
+						<i class="glyphicon glyphicon-chevron-up"></i>
+					</a>
+					<a
+						data-widgster="collapse"
+						title="Collapse"
+						href="#">
+						<i class="glyphicon glyphicon-chevron-down"></i>
+					</a>
+					<a
+						data-widgster="toright"
+						title="change width to right"
+						href="#">
+						<i class="glyphicon glyphicon-chevron-right"></i>
+					</a>
+					<a
+						data-widgster="restore"
+						title="Restore"
+						href="#">
+						<span class="glyphicon glyphicon-repeat"></span>
+					</a>
+					<a
+						data-widgster="fullscreen"
+						title="Fullscreen"
+						href="#">
+						<i
+							class="glyphicon glyphicon-fullscreen"
+							style="font-size: 11px"></i>
+					</a>
+				</div>
+			</header>
+			<div class="body">
+				<div
+					class="row"
+					style="height: 130px">
+					<div class="col-md-12">
+						<section
+							class="widget"
+							style="margin-bottom: 2px">
+							<header>
+								<h4>
+									<span
+										class="font13"
+										style="font-weight: bold">
+										<i class="fa fa-clock-o"></i>
+										진행 기한
+									</span>
+								</h4>
+							</header>
+							<div
+								class="body"
+								id="project-progress-wrapper">
+								<div style="display: flex; flex-direction: row; height: 42%; justify-content: space-between">
+									<div
+										id="project-start"
+										class="box col-sm-4 fade-in-box"
+										style="display: none; margin-bottom: 0px; margin-right: 10px">
+										<span>시작일로부터</span>
+										<br />
+										<span
+											class="project-date"
+											id="fastestStartDate"></span>
+										<div
+											class="day-progress"
+											id="startDDay"></div>
+									</div>
+									<div
+										id="project-end"
+										class="box col-sm-4 fade-in-box"
+										style="display: none; margin-bottom: 0px; padding-bottom: 30px">
+										<span>종료일까지</span>
+										<br />
+										<span
+											class="project-date"
+											id="latestEndDate"></span>
+										<div
+											class="day-progress"
+											id="endDDay"></div>
+									</div>
+									<div
+										class="col-sm-4 fade-in-box"
+										id="versionGaugeChart"
+										style="height: 90px"></div>
+								</div>
+							</div>
+						</section>
+					</div>
+				</div>
+				<div
+					class="row"
+					style="height: 230px; margin-top: 15px">
+					<div class="col-lg-12">
+						<section class="widget">
+							<header>
+								<h4>
+									<span
+										class="font13"
+										style="font-weight: bold">
+										<i class="fa fa-tasks"></i>
+										버전 타임라인
+									</span>
+								</h4>
+							</header>
+							<div
+								class="body"
+								id="version-timeline-wrapper"
+								style="height: 150px">
+								<div
+									id="version-timeline-bar"
+									class="time_element"></div>
+							</div>
+						</section>
+					</div>
+				</div>
+			</div>
+		</section>
+	</div>
+	<div class="col-lg-6 col-layer">
+		<section class="widget">
+			<header>
+				<h4>
+					<span
+						class="font13"
+						style="font-weight: bold">
+						<i class="fa fa-calendar-o"></i>
+						요구사항 해결 추이
+					</span>
+				</h4>
+				<div class="widget-controls">
+					<a
+						data-widgster="toleft"
+						title="change width to left"
+						href="#">
+						<i class="glyphicon glyphicon-chevron-left"></i>
+					</a>
+					<a
+						data-widgster="expand"
+						title="Expand"
+						href="#">
+						<i class="glyphicon glyphicon-chevron-up"></i>
+					</a>
+					<a
+						data-widgster="collapse"
+						title="Collapse"
+						href="#">
+						<i class="glyphicon glyphicon-chevron-down"></i>
+					</a>
+					<a
+						data-widgster="toright"
+						title="change width to right"
+						href="#">
+						<i class="glyphicon glyphicon-chevron-right"></i>
+					</a>
+					<a
+						data-widgster="restore"
+						title="Restore"
+						href="#">
+						<span class="glyphicon glyphicon-repeat"></span>
+					</a>
+					<a
+						data-widgster="fullscreen"
+						title="Fullscreen"
+						href="#">
+						<i
+							class="glyphicon glyphicon-fullscreen"
+							style="font-size: 11px"></i>
+					</a>
+				</div>
+			</header>
+			<div class="body">
+				<div class="row">
+					<div
+						class="col-md-6"
+						style="padding-right: 4px !important">
+						<section class="widget">
+							<header>
+								<h4>
+									<span
+										class="font13"
+										style="font-weight: bold">
+										<i class="fa fa-tasks"></i>
+										제품 버전 별 작업자
+									</span>
+								</h4>
+							</header>
+							<div
+								class="body"
+								id="chart-product-manpower"
+								style="height: 286px"></div>
+						</section>
+					</div>
+					<div class="col-md-6">
+						<section class="widget">
+							<header>
+								<h4>
+									<span
+										class="font13"
+										style="font-weight: bold">
+										<i class="fa fa-tasks"></i>
+										작업자 별 요구사항 관여도
+									</span>
+								</h4>
+							</header>
+							<div
+								class="body echart-no-data"
+								id="chart-manpower-requirement"
+								style="height: 286px"></div>
+						</section>
+					</div>
+				</div>
+			</div>
+		</section>
+	</div>
 </div>
 
 <div class="row">
-    <div class="col-lg-6 col-layer">
-        <section class="widget">
-            <header>
-                <h4>
-                    <span   class="font13"
-                            style="font-weight: bold">
-                        <i class="fa fa-calendar-o"></i>
-                        이슈 진행 현황
-                    </span>
-                </h4>
-                <div class="widget-controls">
-                    <a  data-widgster="toleft"
-                        title="change width to left"
-                        href="#">
-                        <i class="glyphicon glyphicon-chevron-left"></i>
-                    </a>
-                    <a  data-widgster="expand"
-                        title="Expand"
-                        href="#">
-                        <i class="glyphicon glyphicon-chevron-up"></i>
-                    </a>
-                    <a  data-widgster="collapse"
-                        title="Collapse"
-                        href="#">
-                        <i class="glyphicon glyphicon-chevron-down"></i>
-                    </a>
-                    <a  data-widgster="toright"
-                        title="change width to right"
-                        href="#">
-                        <i class="glyphicon glyphicon-chevron-right"></i>
-                    </a>
-                    <a  data-widgster="restore"
-                        title="Restore"
-                        href="#">
-                        <span class="glyphicon glyphicon-repeat"></span>
-                    </a>
-                    <a  data-widgster="fullscreen"
-                        title="Fullscreen"
-                        href="#">
-                        <i class="glyphicon glyphicon-fullscreen"
-                           style="font-size: 11px">
-                        </i>
-                    </a>
-                </div>
-            </header>
-            <div class="body">
-                <div class="row">
-                    <div class="col-lg-4" style="padding-right: 4px !important;">
-                        <section class="widget large">
-                            <header>
-                                <h4><i class="fa fa-pie-chart"></i> 이슈 상태 현황 </h4>
-                            </header>
-                            <div class="body" id="donut-chart"></div>
-                        </section>
-                    </div>
-                    <div class="col-lg-8">
-                        <section class="widget large">
-                            <header>
-                                <h4><i class="fa fa-bar-chart"></i> 요구사항 및 이슈 상태 누적 현황 </h4>
-                            </header>
-                            <div class="body" id="combination-chart"></div>
-                        </section>
-                    </div>
-                </div>
-            </div>
-        </section>
-    </div>
-    <div class="col-lg-6 col-layer">
-        <section class="widget">
-            <header>
-                <h4>
-                    <span   class="font13"
-                            style="font-weight: bold">
-                        <i class="fa fa-dollar"></i>
-                        투입 인력 진행 현황
-                    </span>
-                </h4>
-                <div class="widget-controls">
-                    <a  data-widgster="toleft"
-                        title="change width to left"
-                        href="#">
-                        <i class="glyphicon glyphicon-chevron-left"></i>
-                    </a>
-                    <a  data-widgster="expand"
-                        title="Expand"
-                        href="#">
-                        <i class="glyphicon glyphicon-chevron-up"></i>
-                    </a>
-                    <a  data-widgster="collapse"
-                        title="Collapse"
-                        href="#">
-                        <i class="glyphicon glyphicon-chevron-down"></i>
-                    </a>
-                    <a  data-widgster="toright"
-                        title="change width to right"
-                        href="#">
-                        <i class="glyphicon glyphicon-chevron-right"></i>
-                    </a>
-                    <a  data-widgster="restore"
-                        title="Restore"
-                        href="#">
-                        <span class="glyphicon glyphicon-repeat"></span>
-                    </a>
-                    <a  data-widgster="fullscreen"
-                        title="Fullscreen"
-                        href="#">
-                        <i class="glyphicon glyphicon-fullscreen"
-                           style="font-size: 11px">
-                        </i>
-                    </a>
-                </div>
-            </header>
-            <div class="body">
-                <div class="row">
-                    <div class="col-lg-6">
-                        <section class="widget large">
-                            <header>
-                                <h4><i class="fa fa-bar-chart"></i> 인력별 요구사항 (top 5) </h4>
-                            </header>
-                            <div class="body" id="issue-manpower-chart" style="padding: 10px"></div>
-                            <div id="total-icon-legend">
-                                <div>
+	<div class="col-lg-6 col-layer">
+		<section class="widget">
+			<header>
+				<h4>
+					<span
+						class="font13"
+						style="font-weight: bold">
+						<i class="fa fa-calendar-o"></i>
+						이슈 진행 현황
+					</span>
+				</h4>
+				<div class="widget-controls">
+					<a
+						data-widgster="toleft"
+						title="change width to left"
+						href="#">
+						<i class="glyphicon glyphicon-chevron-left"></i>
+					</a>
+					<a
+						data-widgster="expand"
+						title="Expand"
+						href="#">
+						<i class="glyphicon glyphicon-chevron-up"></i>
+					</a>
+					<a
+						data-widgster="collapse"
+						title="Collapse"
+						href="#">
+						<i class="glyphicon glyphicon-chevron-down"></i>
+					</a>
+					<a
+						data-widgster="toright"
+						title="change width to right"
+						href="#">
+						<i class="glyphicon glyphicon-chevron-right"></i>
+					</a>
+					<a
+						data-widgster="restore"
+						title="Restore"
+						href="#">
+						<span class="glyphicon glyphicon-repeat"></span>
+					</a>
+					<a
+						data-widgster="fullscreen"
+						title="Fullscreen"
+						href="#">
+						<i
+							class="glyphicon glyphicon-fullscreen"
+							style="font-size: 11px"></i>
+					</a>
+				</div>
+			</header>
+			<div class="body">
+				<div class="row">
+					<div
+						class="col-lg-4"
+						style="padding-right: 4px !important">
+						<section class="widget large">
+							<header>
+								<h4>
+									<i class="fa fa-pie-chart"></i>
+									이슈 상태 현황
+								</h4>
+							</header>
+							<div
+								class="body"
+								id="donut-chart"></div>
+						</section>
+					</div>
+					<div class="col-lg-8">
+						<section class="widget large">
+							<header>
+								<h4>
+									<i class="fa fa-bar-chart"></i>
+									요구사항 및 이슈 상태 누적 현황
+								</h4>
+							</header>
+							<div
+								class="body"
+								id="combination-chart"></div>
+						</section>
+					</div>
+				</div>
+			</div>
+		</section>
+	</div>
+	<div class="col-lg-6 col-layer">
+		<section class="widget">
+			<header>
+				<h4>
+					<span
+						class="font13"
+						style="font-weight: bold">
+						<i class="fa fa-dollar"></i>
+						투입 인력 진행 현황
+					</span>
+				</h4>
+				<div class="widget-controls">
+					<a
+						data-widgster="toleft"
+						title="change width to left"
+						href="#">
+						<i class="glyphicon glyphicon-chevron-left"></i>
+					</a>
+					<a
+						data-widgster="expand"
+						title="Expand"
+						href="#">
+						<i class="glyphicon glyphicon-chevron-up"></i>
+					</a>
+					<a
+						data-widgster="collapse"
+						title="Collapse"
+						href="#">
+						<i class="glyphicon glyphicon-chevron-down"></i>
+					</a>
+					<a
+						data-widgster="toright"
+						title="change width to right"
+						href="#">
+						<i class="glyphicon glyphicon-chevron-right"></i>
+					</a>
+					<a
+						data-widgster="restore"
+						title="Restore"
+						href="#">
+						<span class="glyphicon glyphicon-repeat"></span>
+					</a>
+					<a
+						data-widgster="fullscreen"
+						title="Fullscreen"
+						href="#">
+						<i
+							class="glyphicon glyphicon-fullscreen"
+							style="font-size: 11px"></i>
+					</a>
+				</div>
+			</header>
+			<div class="body">
+				<div class="row">
+					<div class="col-lg-6">
+						<section class="widget large">
+							<header>
+								<h4>
+									<i class="fa fa-bar-chart"></i>
+									인력별 요구사항 (top 5)
+								</h4>
+							</header>
+							<div
+								class="body"
+								id="issue-manpower-chart"
+								style="padding: 10px"></div>
+							<div id="total-icon-legend">
+								<div>
 									<span
-                                            class="circle"
-                                            style="background-color: #82de32"></span>
-                                    <span class="text">요구사항</span>
-                                </div>
-                                <div>
+										class="circle"
+										style="background-color: #82de32"></span>
+									<span class="text">요구사항</span>
+								</div>
+								<div>
 									<span
-                                            class="circle"
-                                            style="background-color: #dec732"></span>
-                                    <span class="text">연결이슈</span>
-                                </div>
-                            </div>
-                        </section>
-                    </div>
-                    <div class="col-lg-6" style="padding-left: 4px !important;">
-                        <section class="widget large">
-                            <header>
-                                <h4><i class="fa fa-pie-chart"></i> 인력별 퍼포먼스 (top 5) </h4>
-                            </header>
-                            <div class="body" id="polar_bar"></div>
-                        </section>
-                    </div>
-                </div>
-            </div>
-        </section>
-    </div>
+										class="circle"
+										style="background-color: #dec732"></span>
+									<span class="text">연결이슈</span>
+								</div>
+							</div>
+						</section>
+					</div>
+					<div
+						class="col-lg-6"
+						style="padding-left: 4px !important">
+						<section class="widget large">
+							<header>
+								<h4>
+									<i class="fa fa-pie-chart"></i>
+									인력별 퍼포먼스 (top 5)
+								</h4>
+							</header>
+							<div
+								class="body"
+								id="polar_bar"></div>
+						</section>
+					</div>
+				</div>
+			</div>
+		</section>
+	</div>
 </div>
 
-<img src="./img/index/str.png" alt="User Avatar" id="quality-img" style="width: 150px; position: absolute; top: 57%; left: 44%;">
+<img
+	src="./img/index/str.png"
+	alt="User Avatar"
+	id="quality-img"
+	style="width: 150px; position: absolute; top: 58%; left: calc(50% - 75px)" />
 
-
-
 <style>
-    @media (max-width: 1200px) {
-        #quality-img {
-            display: none;
-        }
-    }
+	@media (max-width: 1200px) {
+		#quality-img {
+			display: none;
+		}
+	}
 
-    .card-widget {
-        border: 0;
-        position: relative;
-    }
+	.card-widget {
+		border: 0;
+		position: relative;
+	}
 
-    .card {
-        margin-bottom: 1rem;
-    }
+	.card {
+		margin-bottom: 1rem;
+	}
 
-    .card {
-        position: relative;
-        display: -ms-flexbox;
-        display: flex;
-        -ms-flex-direction: column;
-        flex-direction: column;
-        min-width: 0;
-        word-wrap: break-word;
-        background-clip: border-box;
-        border: 0 solid rgba(0,0,0,.125);
-        border-radius: 0.25rem;
-    }
+	.card {
+		position: relative;
+		display: -ms-flexbox;
+		display: flex;
+		-ms-flex-direction: column;
+		flex-direction: column;
+		min-width: 0;
+		word-wrap: break-word;
+		background-clip: border-box;
+		border: 0 solid rgba(0, 0, 0, 0.125);
+		border-radius: 0.25rem;
+	}
 
-    .widget-user .widget-user-image>img {
-        height: auto;
-        width: 200px;
-    }
+	.widget-user .widget-user-image > img {
+		height: auto;
+		width: 200px;
+	}
 
-    .widget-user .widget-user-image {
-        left: 50%;
-        margin-left: -100px;
-        position: absolute;
-        top: 300px;
-    }
+	.widget-user .widget-user-image {
+		left: 50%;
+		margin-left: -100px;
+		position: absolute;
+		top: 300px;
+	}
 
-    .widget-user .widget-user-header {
-        border-top-left-radius: 0.25rem;
-        border-top-right-radius: 0.25rem;
-        height: 135px;
-        padding: 1rem;
-        text-align: center;
-    }
+	.widget-user .widget-user-header {
+		border-top-left-radius: 0.25rem;
+		border-top-right-radius: 0.25rem;
+		height: 135px;
+		padding: 1rem;
+		text-align: center;
+	}
 
-    .img-circle {
-        border-radius: 50%;
-    }
-    img {
-        vertical-align: middle;
-        border-style: none;
-    }
+	.img-circle {
+		border-radius: 50%;
+	}
+	img {
+		vertical-align: middle;
+		border-style: none;
+	}
 
-    /*! Light */
-    #light {
-        background-color: #000;
-        box-shadow: 0 0 5px rgba(0,0,0, .8);
-        overflow: hidden;
-        padding: 0 0 4px;
-        width: 40px;
-        margin-left: 30px;
-        transform:rotate(270deg);
-    }
+	/*! Light */
+	#light {
+		background-color: #000;
+		box-shadow: 0 0 5px rgba(0, 0, 0, 0.8);
+		overflow: hidden;
+		padding: 0 0 4px;
+		width: 40px;
+		margin-left: 30px;
+		transform: rotate(270deg);
+	}
 
-    #light span {
-        border-radius: 50px;
-        display: block;
-        height: 30px;
-        margin: 4px auto 0;
-        opacity: .5;
-        width: 30px;
-    }
+	#light span {
+		border-radius: 50px;
+		display: block;
+		height: 30px;
+		margin: 4px auto 0;
+		opacity: 0.5;
+		width: 30px;
+	}
 
-    /*! Light colours */
-    #red    { background-color: red; }
-    #orange { background-color: orange; }
-    #green  { background-color: green; }
+	/*! Light colours */
+	#red {
+		background-color: red;
+	}
+	#orange {
+		background-color: orange;
+	}
+	#green {
+		background-color: green;
+	}
 
-    /*! Active states */
-    #light span.active    { opacity: 1; }
-    #light #red.active    { box-shadow: 0 0 10px red; }
-    #light #orange.active { box-shadow: 0 0 10px orange; }
-    #light #green.active  { box-shadow: 0 0 10px green; }
+	/*! Active states */
+	#light span.active {
+		opacity: 1;
+	}
+	#light #red.active {
+		box-shadow: 0 0 10px red;
+	}
+	#light #orange.active {
+		box-shadow: 0 0 10px orange;
+	}
+	#light #green.active {
+		box-shadow: 0 0 10px green;
+	}
 
-    /*! Toggle button */
-    button {
-        margin-top: 10px;
-    }
+	/*! Toggle button */
+	button {
+		margin-top: 10px;
+	}
 
-    .project-date {
-        font-size: 10px;
-        color: #a4c6ff;
-    }
+	.project-date {
+		font-size: 10px;
+		color: #a4c6ff;
+	}
 
-    .day-progress {
-        position: absolute;
-        top: 75%;
-        left: 50%;
-        translate: -50% -50%;
-        font-size: 14px;
-        font-weight: 600;
-    }
-    .timeline:before {
-     left: 0px !important;
-        background: none;
-    }
-    .time_element {
-        overflow-x: scroll;
-        white-space:nowrap;
-    }
+	.day-progress {
+		position: absolute;
+		top: 75%;
+		left: 50%;
+		translate: -50% -50%;
+		font-size: 14px;
+		font-weight: 600;
+	}
+	.timeline:before {
+		left: 0px !important;
+		background: none;
+	}
+	.time_element {
+		overflow-x: scroll;
+		white-space: nowrap;
+	}
 
-    .node rect {
-        fill-opacity: 0.9;
-        shape-rendering: crispEdges;
-    }
+	.node rect {
+		fill-opacity: 0.9;
+		shape-rendering: crispEdges;
+	}
 
-    .node text {
-        pointer-events: none;
-        text-shadow: 0 1px 0 #fff;
-    }
+	.node text {
+		pointer-events: none;
+		text-shadow: 0 1px 0 #fff;
+	}
 
-    .link {
-        fill: none;
-        stroke: #000;
-        stroke-opacity: 0.2;
-    }
+	.link {
+		fill: none;
+		stroke: #000;
+		stroke-opacity: 0.2;
+	}
 
-    .link:hover {
-        stroke-opacity: 0.5;
-    }
-    .dashboard-top-section {
-        min-height: 230px;
-    }
+	.link:hover {
+		stroke-opacity: 0.5;
+	}
+	.dashboard-top-section {
+		min-height: 230px;
+	}
 
-    .ms-choice {
-        height: 16px;
-    }
+	.ms-choice {
+		height: 16px;
+	}
 
-    .needle,
-    .needle-center {
-        fill: #f1f2f6;
-    }
+	.needle,
+	.needle-center {
+		fill: #f1f2f6;
+	}
 
-    #total-icon-legend {
-        position: absolute;
-        top: 250px;
-        right: 10px;
-    }
+	#total-icon-legend {
+		position: absolute;
+		top: 250px;
+		right: 10px;
+	}
 
-    #total-icon-legend > div {
-        display: flex;
-        align-items: center;
-        margin-bottom: 0.3em;
-    }
+	#total-icon-legend > div {
+		display: flex;
+		align-items: center;
+		margin-bottom: 0.3em;
+	}
 
-    #total-icon-legend > div:last-child {
-        margin-bottom: 0;
-    }
+	#total-icon-legend > div:last-child {
+		margin-bottom: 0;
+	}
 
-    #total-icon-legend > div > .text {
-        padding-top: 3px;
-        font-size: 10px;
-    }
+	#total-icon-legend > div > .text {
+		padding-top: 3px;
+		font-size: 10px;
+	}
 
-    .circle {
-        display: inline-block;
-        background-color: red;
-        width: 11px;
-        height: 11px;
-        border-radius: 50px;
-        margin-top: 4px;
-        margin-right: 8px;
-        border: 1px solid white;
-    }
+	.circle {
+		display: inline-block;
+		background-color: red;
+		width: 11px;
+		height: 11px;
+		border-radius: 50px;
+		margin-top: 4px;
+		margin-right: 8px;
+		border: 1px solid white;
+	}
 
-    .c3-bars path {
-        stroke: white;
-        stroke-width: 0.5px;
-    }
-</style>
\ No newline at end of file
+	.c3-bars path {
+		stroke: white;
+		stroke-width: 0.5px;
+	}
+</style>