<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>
						Cost 분석
					</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="gradient_middle_border"
					style="width: 100%; height: 2px"></div>
				<blockquote
					class="font13"
					style="margin-top: 5px">
					선택한 제품(서비스)와 버전의 Cost 관점 요구사항 현황
					<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-md-3">
						<section
							class="widget dashboard-top-section top-menu-div"
							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>
								<div
									class="gradient_middle_border"
									style="width: 100%; margin-top: 8px"></div>
							</header>
							<div class="body">
								<div class="column">
									<blockquote class="font13">
										1. Product
										<sup>service</sup>
										를 선택해 주세요
									</blockquote>
									<div
										class="control-group"
										style="padding-top: 10px; padding-bottom: 10px; border: 0">
										<div
											class="controls form-group select-box"
											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>
									<blockquote class="font13">
										2. Product
										<sup>service</sup>
										의 버전을 선택해 주세요
									</blockquote>
									<div
										class="control-group"
										style="padding-bottom: 10px; border: 0">
										<div
											class="controls form-group select-box"
											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 large top-menu-div"
							style="margin-bottom: 15px; height: 290px">
							<header>
								<h4>
									<span
										class="font13"
										style="font-weight: bold">
										<i class="fa fa-pencil-square-o"></i>
										종합 진행 현황
									</span>
								</h4>
							</header>
							<div class="body">
								<div
									class="gradient_middle_border"
									style="width: 100%; height: 2px; margin-top: 5px"></div>
								<div
									class="body"
									id="radarPart"></div>
							</div>
						</section>
					</div>
					<div class="col-md-2">
						<section
							class="widget dashboard-top-section top-menu-div"
							style="overflow: auto; margin-bottom: 15px">
							<header style="margin-bottom: 15px">
								<h4>
									<span
										class="font13"
										style="font-weight: bold">
										<i class="fa fa-pencil-square"></i>
										범위(Scope) 현황
									</span>
								</h4>
							</header>
							<div class="body">
								<div
									class="gradient_middle_border"
									style="width: 100%; margin-top: 8px"></div>
								<div
									class="box"
									style="display: flex; justify-content: space-evenly; margin: 10px 0">
									<div>
										<div
											id="req_in_action_count"
											style="
												color: #a4c6ff;
												margin-top: 5px;
												font-size: 20px;
												line-height: 20px;
												height: 20px;
												font-weight: 700;
											">
											-
										</div>
										<div class="description">
											<i class="fa fa-wrench"></i>
											진행 중
										</div>
									</div>
									<div style="margin-top: 5px; font-size: 20px; line-height: 20px; height: 20px">|</div>
									<div>
										<div
											id="req_count"
											style="margin-top: 5px; font-size: 20px; line-height: 20px; height: 20px; font-weight: 700">
											-
										</div>
										<div class="description">【총 요구사항】</div>
									</div>
								</div>
								<div class="column">
									<div
										class="control-group"
										style="padding-bottom: 10px; border: 0">
										<div
											class="controls form-group darkBack col-md-12"
											style="margin-bottom: 10px !important; padding: 10px 0 !important; text-align: center">
											<span>
												요구사항 진척도 :
												<!--													id="linkedIssue_subtask_count_per_req_in_action"-->
												<a
													id="req_progress"
													style="font-weight: bold">
													-
												</a>
												%
											</span>
											<br />
											<span>(완료된 요구사항 : <a id="req_completed" style="font-weight: bold">-</a>)</span>
										</div>
									</div>
									<div
										class="control-group"
										style="padding-bottom: 10px; border: 0;">

									</div>
								</div>
								<div
									class="box"
									style="display: flex; justify-content: space-evenly; margin: 10px 0">
									<div
										class="controls form-group col-md-6"
										style="margin-bottom: 5px !important; padding: 10px 0 !important; text-align: center">
											<span>
												생성된 요구사항 이슈
												<br />
												<small>(미할당)</small>
												<br />
												<a
													id="total_req_issue_count"
													style="font-weight: bold">
													-
												</a>
												개 (
												<span id="no_assigned_req_issue_count">-</span>
												)
											</span>
										<br />
									</div>
									<div
										class="controls form-group col-md-6"
										style="margin-bottom: 5px !important; padding: 10px 0 !important; text-align: center">
											<span>
												생성한 연결이슈
												<br />
												<small>(미할당)</small>
												<br />
												<a
													id="total_linkedIssue_subtask_count"
													style="font-weight: bold">
													-
												</a>
												개 (
												<span id="no_assigned_linkedIssue_subtask_count">-</span>
												)
											</span>
										<br />
									</div>
								</div>
							</div>
						</section>
					</div>
					<div class="col-md-2">
						<section class="widget dashboard-top-section top-menu-div">
							<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="gradient_middle_border"
									style="width: 100%; height: 2px; margin-top: 5px"></div>
								<div
									class="box"
									style="display: flex; justify-content: space-evenly; margin: 10px 0">
									<div>
										<span>
											전체 일정
											<br />
											<a
												id="start_date_summary"
												style="font-weight: bold">
												-
											</a>
											~
											<a
												id="end_date_summary"
												style="font-weight: bold">
												-
											</a>
										</span>
										<br />
									</div>
								</div>
								<div
									class="box"
									style="display: flex; justify-content: space-evenly; margin: 10px 0">
									<div>
										<div
											id="remaining_days"
											style="
												color: #a4c6ff;
												margin-top: 5px;
												font-size: 20px;
												line-height: 20px;
												height: 20px;
												font-weight: 700;
											">
											-
										</div>
										<div class="description">【 일정 】</div>
									</div>
									<div style="margin-top: 5px; font-size: 20px; line-height: 20px; height: 20px">|</div>
									<div>
										<div
											id="progressDateRate"
											style="margin-top: 5px; font-size: 20px; line-height: 20px; height: 20px; font-weight: 700">
											-
										</div>
										<div class="description">【 경과 】</div>
									</div>
								</div>
								<div
									class="box"
									style="display: flex; justify-content: space-evenly; margin: 10px 0">
									<div>
										<span>
											작업 종료 예상일
											<br />
											<a
												id="expected_end_date"
												style="font-weight: bold">
												-
											</a>
										</span>
										<br />
									</div>
								</div>
							</div>
						</section>
					</div>
					<div class="col-md-2">
						<section
							class="widget dashboard-top-section top-menu-div"
							style="overflow: auto">
							<header style="margin-bottom: 15px">
								<h4>
									<span
										class="font13"
										style="font-weight: bold">
										<i class="fa fa-briefcase"></i>
										자원(Resource) 현황
									</span>
								</h4>
							</header>
							<div class="body">
								<div
									class="gradient_middle_border"
									style="width: 100%; margin-top: 8px"></div>
								<div
									class="box"
									style="margin: 10px 0">
									<div
										id="resource"
										style="
											color: #a4c6ff;
											margin-top: 5px;
											font-size: 20px;
											line-height: 20px;
											height: 20px;
											font-weight: 700;
										">
										-
									</div>
									<div class="description">
										<i class="fa fa-users"></i>
										투입 작업자 수
									</div>
								</div>
								<div class="column">
									<div
										class="control-group"
										style="padding-bottom: 10px; border: 0">
										<div
											class="controls form-group darkBack col-md-12"
											style="margin-bottom: 10px !important; padding: 10px 0; !important; text-align: center">
											<span> 1인당 요구사항 이슈 수 <br/>(최대 / 평균 / 최소) </span>
											<br />
											<span>
												<a id="req_max" style="font-weight: bold"> - </a>
											</span>
											/
											<span>
												<a id="req_avg" style="font-weight: bold"> - </a>
											</span>
											/
											<span>
												<a id="req_min" style="font-weight: bold"> - </a>
											</span>
										</div>
										<div
											class="controls form-group darkBack col-md-12"
											style="margin-bottom: 10px !important; padding: 10px 0; !important; text-align: center">
											<span> 1인당 생성한 연결이슈 수 <br/>(최대 / 평균 / 최소)</span>
											<br />
											<span>
												<a id="sub_max" style="font-weight: bold"> - </a>
											</span>
											/
											<span>
												<a id="sub_avg" style="font-weight: bold"> - </a>
											</span>
											/
											<span>
												<a id="sub_min" style="font-weight: bold"> - </a>
											</span>
										</div>
										<!--										<div
																					class="controls form-group darkBack col-md-12"
																					style="margin-bottom: 10px !important; padding: 10px 0; !important; text-align: center">
																					<span>
																						생성한 연결이슈 평균 :
																						<a
																							id="avg_linkedIssue_count"
																							style="font-weight: bold">
																							-
																						</a>
																						개
																					</span>
																					<br />
																				</div>-->
									</div>
								</div>
							</div>
						</section>
					</div>
				</div>
			</div>
		</section>
	</div>

	<div class="col-lg-12 col-layer">
		<section class="widget">
			<header>
				<h4>
					<span
						class="font13"
						style="font-weight: bold">
						<i class="fa fa-table"></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="gradient_middle_border"
					style="width: 100%; margin-top: 8px; margin-bottom: 15px"></div>
				<blockquote
					class="font13"
					style="margin-top: 5px">
					선택한 제품(서비스) 버전에 투입된 인력의 연봉 정보를 입력합니다.
					<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">
							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-4">
						<section class="widget">
							<header style="margin-bottom: 15px">
								<h4>
									<span
										class="font13"
										style="font-weight: bold">
										<i class="fa fa-upload"></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="gradient_middle_border"
									style="width: 100%; margin-top: 8px"></div>
								<blockquote
									class="font13"
									style="margin-top: 5px">
									템플릿 다운로드 후, 연봉 정보를 입력하여 업로드 합니다.
								</blockquote>
								<div class="body-middle"></div>
							</div>
						</section>
					</div>

					<div class="col-lg-8">
						<section class="widget">
							<header style="margin-bottom: 15px">
								<h4>
									<span
										class="font13"
										style="font-weight: bold">
										<i class="fa fa-pencil"></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="gradient_middle_border"
									style="width: 100%; margin-top: 8px"></div>
								<blockquote
									class="font13"
									style="margin-top: 5px">
									각 버전에 투입된 인력의 연봉 정보를 입력합니다.
								</blockquote>

								<div class="clearfix widget-content">
									<div style="float: right">
										<button type="button"
														class="btn btn-primary btn-block btn-sm"
														id="cost-excel-batch-update"
														style="margin-right: 5px;"
										>
											일괄저장
										</button>
									</div>
								</div>
								<div id="spreadsheet" style="height: 500px;"></div>
							</div>
						</section>
					</div>

					<!-- 입력 완료 버튼 -->
					<div style="text-align: center">
						<a
							id="cost-analysis-calculation"
							class="more animated-button1 ladda_cost_analysis_calculation"
							style="padding: 14px 36px; text-decoration: none; cursor: pointer">
							<span></span>
							<span></span>
							<span></span>
							<span></span>

							<strong>비용 분석 계산</strong>
						</a>
					</div>
				</div>
			</div>
		</section>
	</div>

	<div class="col-lg-12 col-layer">
		<section class="widget">
			<header>
				<h4>
					<span
						class="font13"
						style="font-weight: bold">
						<i class="fa fa-money"></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="gradient_middle_border"
					style="width: 100%; margin-top: 8px; margin-bottom: 15px"></div>
				<blockquote
					class="font13"
					style="margin-top: 5px">
					제품의 비용을 확인할 수 있습니다.
				</blockquote>
				<div class="row">
					<div class="col-md-12">
						<section
							class="widget"
							style="margin-bottom: 0px !important">
							<header>
								<h4>
									<span
										class="font13"
										style="font-weight: bold">
										<i class="fa fa-users"></i>
										투자 비용 대비 성과
									</span>
								</h4>
								<div class="widget-controls">
									<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="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"
								style="overflow: hidden">
								<div
									class="gradient_middle_border"
									style="width: 100%; height: 2px"></div>
								<blockquote
									class="font13"
									style="margin-top: 5px">
									완료 된 요구사항을 기준으로 하여, 제품에 대한 투자 비용 대비 성과를 확인할 수 있습니다.
									<div style="float: right"></div>
								</blockquote>
<!--								<select id="yearSelect">-->
<!--									<option value="2025">2025년</option>-->
<!--									<option value="2024">2024년</option>-->
<!--									<option value="2023">2023년</option>-->
<!--								</select>-->
								<div id="product-accumulate-cost-by-month"></div>
							</div>
						</section>
					</div>
				</div>
			</div>
		</section>
	</div>

	<div class="col-lg-12 col-layer">
		<section class="widget">
			<header>
				<h4>
					<span
						class="font13"
						style="font-weight: bold">
						<i class="fa fa-money"></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="gradient_middle_border"
					style="width: 100%; margin-top: 8px; margin-bottom: 15px"></div>
				<blockquote
					class="font13"
					style="margin-top: 5px">
					제품의 버전 별 비용을 확인할 수 있습니다.
				</blockquote>
				<div class="row">
					<div class="col-md-12">
						<section class="widget">
							<header>
								<h4>
									<span
										class="font13"
										style="font-weight: bold">
										<i class="fa fa-stack-overflow"></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="gradient_middle_border"
									style="width: 100%; margin-top: 8px"></div>
								<blockquote class="font12">버전별 소모된 총 인력 비용을 확인할 수 있습니다.</blockquote>
								<div class="body">
									<div id="version-stack-container"></div>
								</div>
							</div>
						</section>
					</div>
				</div>
			</div>
		</section>
	</div>

	<div class="col-lg-12 col-layer">
		<section class="widget">
			<header>
				<h4>
					<span
						class="font13"
						style="font-weight: bold">
						<i class="fa fa-archive"></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="gradient_middle_border"
					style="width: 100%; margin-top: 8px; margin-bottom: 15px"></div>
				<blockquote
					class="font13"
					style="margin-top: 5px">
					요구사항의 연결된 담당자와 입력된 인력별 연봉 정보를 바탕으로 분석된 데이터입니다.
				</blockquote>
				<div class="row">
					<div class="col-md-12">
						<section class="widget">
							<header>
								<h4>
									<span
										class="font13"
										style="font-weight: bold">
										<i class="fa fa-bar-chart"></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="gradient_middle_border"
									style="width: 100%; margin-top: 8px"></div>
								<blockquote class="font12">
									활성화(진행중 혹은 완료)된 요구사항의 연결된 담당자 정보를 바탕으로 현재 추정 금액 및 난이도와
									우선순위 통계를 확인할 수 있습니다.
									<br />
									요구사항 금액은 슬라이드 바 및 스크롤로 확대하여 확인할 수 있습니다.
								</blockquote>
								<div
									class="body"
									id="req-cost-analysis-chart"></div>
							</div>
						</section>
					</div>
				</div>
			</div>
		</section>
	</div>

	<div class="col-lg-12 col-layer">
		<section class="widget">
			<header>
				<h4>
					<span
						class="font13"
						style="font-weight: bold">
						<i class="fa fa-money"></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="gradient_middle_border"
					style="width: 100%; margin-top: 8px; margin-bottom: 15px"></div>
				<blockquote
					class="font13"
					style="margin-top: 5px">
					계산된 요구사항을 기반으로 분석된 데이터입니다.
				</blockquote>
				<div class="row">
					<div class="col-md-12">
						<section class="widget">
							<header>
								<h4>
									<span
										class="font13"
										style="font-weight: bold">
										<i class="fa fa-users"></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"
								style="overflow: hidden">
								<div
									class="gradient_middle_border"
									style="width: 100%; height: 2px"></div>
								<blockquote
									class="font13"
									style="margin-top: 5px">
									인력별 연봉 대비 성과를 한눈에 확인할 수 있습니다. - [완료 요구사항 기준]
									<div style="float: right"></div>
								</blockquote>
								<div id="manpower-analysis-chart"></div>
							</div>
						</section>
					</div>
				</div>
			</div>
		</section>
	</div>
</div>


<div
	id="my_modal2"
	class="modal fade"
	role="dialog"
	aria-labelledby="myModalLabel"
	aria-hidden="true"
	style="display: none; border-radius: 10px">
	<div
		class="modal-dialog"
		style="width: 90%">
		<div class="modal-content modalDarkBack">
			<div
				class="modal-header"
				style="padding: 0px; border-bottom: 1px">
				<h4
					class="modal-title font14"
					id="my_modal_label2"
					style="color: #f8f8f8; text-align: left; padding: 5px">
					<span
						class="font13"
						id="my_modal2_title"
						style="font-weight: bold">
						<i class="fa fa-edit"></i>
						링크드 이슈 및 서브테스크
					</span>
					<blockquote
						class="search-result"
						style="border-left: 5px solid #e5603b">
						<p id="my_modal2_description" style="font-size: 13px; margin: 10px 0px 10px 0px; padding-left: 10px">
							선택한 이슈와 연결된 이슈와 하위 이슈 정보입니다.
						</p>
					</blockquote>
				</h4>
				<div
					class="widget-controls"
					style="padding-top: 10px">
					<a
						title="Options"
						class="hidden"
						href="#">
						<i class="glyphicon glyphicon-cog"></i>
					</a>
					<a
						data-widgster="expand"
						title="Expand"
						class="hidden"
						href="#">
						<i class="glyphicon glyphicon-chevron-up"></i>
					</a>
					<a
						data-widgster="collapse"
						title="Collapse"
						class="hidden"
						href="#">
						<i class="glyphicon glyphicon-chevron-down"></i>
					</a>
					<a
						data-widgster="close"
						title="Close"
						href="#"
						data-dismiss="modal"
						aria-hidden="true">
						<i class="glyphicon glyphicon-remove"></i>
					</a>
				</div>
			</div>
			<div
				class="modal-body"
				id="my_modal2_body"
				style="padding: 5px; border-top: 1px solid rgba(51, 51, 51, 0.3); padding-top: 5px">
			</div>
			<div
				class="modal-footer"
				style="background-color: transparent; padding: 5px; text-align: right; border-top: 0px">
				<button
					type="button"
					id="extendclose_jira_server"
					class="btn btn-default"
					data-dismiss="modal">
					Close
				</button>
			</div>
		</div>
		<!-- /.modal-content -->
	</div>
	<!-- /.modal-dialog -->
</div>

<style>
    #spreadsheet .jexcel_content {
            width: 100%;
    }

    #spreadsheet .jexcel_content table tbody tr td{
        color: white;
    }

    #spreadsheet .jexcel_content table {
        width: 100%;
    }

    /* Desktops */
    @media screen and (min-width: 1024px) {
        #spreadsheet colgroup col:nth-child(1) {
            width: 5%;
        }
        #spreadsheet colgroup col:nth-child(2) {
            width: 30%;
        }
        #spreadsheet colgroup col:nth-child(3) {
            width: 40%;
        }
        #spreadsheet colgroup col:nth-child(4) {
            width: 25%;
        }
    }

    /* Tablets */
    @media screen and (min-width: 0px) and (max-width: 1023px) {
        #spreadsheet colgroup col:nth-child(1) {
            width: 10%;
        }
        #spreadsheet colgroup col:nth-child(2) {
            width: 25%;
        }
        #spreadsheet colgroup col:nth-child(3) {
            width: 40%;
        }
        #spreadsheet colgroup col:nth-child(4) {
            width: 25%;
        }
    }

    /* Phone */
    @media screen and (max-width: 767px) {
        #spreadsheet colgroup col:nth-child(1) {
            width: 10%;
        }
        #spreadsheet colgroup col:nth-child(2) {
            width: 25%;
        }
        #spreadsheet colgroup col:nth-child(3) {
            width: 40%;
        }
        #spreadsheet colgroup col:nth-child(4) {
            width: 25%;
        }
    }
</style>