<div class="col-lg-12 col-layer">
    <section class="widget">
        <header>
            <h4>
				<span
                        class="font13"
                        style="font-weight: bold">
					<i
                            class="fa fa-edit"
                            style="vertical-align: middle; font-size: 14px"></i>
					蹂� �섏씠吏��� Beta Test 以� �낅땲��.
				</span>
                <span class="label label-success">2024 / 11 / 01 Open</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>
            <div class="row">
                <div class="col-md-12">
                    <div class="col-sm-offset-3 col-sm-6">

                        <div class="text-center" style="margin-top: 15px;">
                            <span style="font-size: 13px; font-weight: bold;">A-RMS New Feature : <span style="color: #E49400;">�곹깭 愿�由�</span></span>
                            <p>�곹깭 愿�由щ뒗 <span style="color: #a4c6ff;">怨좉컼�ъ쓽 怨좎쑀�� �붽뎄�ы빆 �곹깭愿�由ъ� ALM�� �댁뒋 �곹깭瑜� 留듯븨(�곌껐)�섎뒗 湲곕뒫</span>�� �쒓났�⑸땲��.</p>
                        </div>

                        <div class="timing">
                            <div id="count-down" data-date="2024-11-01 00:00:00">

                            </div>
                        </div>
                        <!-- /.timing -->
                    </div>
                </div>
            </div>

        </div>
    </section>
</div>
<div class="col-lg-12 col-layer">
	<section class="widget">
		<header>
			<h4>
				<strong class="font13">
					<i class="fa fa-sitemap fs-larger media-middle"></i>
					<span data-locale="category.state.title">
						A-RMS �곹깭蹂� ALM �곹깭 留ㅽ븨
					</span>
				</strong>
			</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>
			<!--			<blockquote
                      class="font13"
                      style="margin-top: 5px">
                    1. ARMS �붽뎄�ы빆�� �곹깭�� ALM �댁뒋 �곹깭�� �곌껐�⑸땲��.
                  </blockquote>-->
		</header>
		<div class="body">
			<div class="gradient_middle_border" style="width: 100%; height: 2px"></div>
			<blockquote class="font13">
				<p>�④낵�곸씤 �붽뎄�ы빆 �듦퀎瑜� �꾪빐, �꾨옒 4媛�吏� �곹깭 移댄뀒怨좊━(
					<i class="fa fa-folder-o text-danger"></i> �대┝ 쨌
					<i class="fa fa-fire" style="color: #E49400;"></i> 吏꾪뻾以� 쨌
					<i class="fa fa-fire-extinguisher text-success"></i> �닿껐�� 쨌
					<i class="fa fa-folder text-primary"></i> �ロ옒)
					�� A-RMS �붽뎄�ы빆 �곹깭 媛� 留ㅽ븨�� �꾩슂�⑸땲��
				</p>
				<p>A-RMS �붽뎄�ы빆 �곹깭瑜� �숈쟻�쇰줈 愿�由ы븯��, ALM �댁뒋 �곹깭�� �곕룞�� �� �덉뒿�덈떎.</p>
				<p>留ㅽ븨 怨쇱젙:
					<i class="fa fa-info-circle"></i>
					ALM �쒕쾭 �좏깮 �� (�대씪�곕뱶 吏���) �꾨줈�앺듃 �좏깮 �� (�대씪�곕뱶 吏���) �댁뒋 �좏삎 �좏깮 �� �곹깭 留ㅽ븨
				</p>
				<p style="color: #e49400; font-weight: bold;">
					<i class="fa fa-exclamation-circle"></i>
					�고겢由�쓣 �듯빐 A-RMS �붽뎄�ы빆 �곹깭 諛� �곌껐�좎쓣 �섏젙쨌��젣�� �� �덉뒿�덈떎.
				</p>
				<p>
					�� 湲곕낯 �곹깭 [
					<i class="fa fa-folder-o text-danger"></i> �대┝ 쨌
					<i class="fa fa-fire" style="color: #E49400;"></i> 吏꾪뻾以� 쨌
					<i class="fa fa-fire-extinguisher text-success"></i> �닿껐��] ��
					<strong style="color: #e49400;">��젣</strong>��
					<strong style="color: #e49400;">�곹깭 移댄뀒怨좊━ 蹂�寃�</strong>�� 遺덇��ν븯硫�, �곹깭 �대쫫留� �섏젙 媛��ν빀�덈떎.
				</p>
				<p
					id="preset_message"
					class="hidden">
					�대씪�곕뱶 吏��� �댁뒋 �곹깭瑜� ALM �쒕쾭�� 二쇱슂 �곹깭�� 1:1濡� 留ㅽ븨�� �� �덈뒗 踰꾪듉�� �쒓났�⑸땲��.
				</p>
			</blockquote>
			<div class="clearfix">
				<div style="float: right;">
					<button class="btn btn-primary btn-block btn-sm"
							data-toggle="modal"
							id="save_modal_button"
							type="button"
							onClick="popup_modal('save_popup')">
							�붽뎄�ы빆 �곹깭 異붽�
					</button>
				</div>
				<div 	style="float: right; margin-right: 5px;">
						<button
								class="btn btn-success btn-block btn-sm hidden"
								data-toggle="modal"
								id="preset"
								type="button">
								�대씪�곕뱶 吏��� �꾨━�� �ㅼ젙
						</button>
				</div>
			</div>
			<br/>
			<div class="row">
				<div class="col-lg-3">
					<section class="widget">
						<header style="margin-bottom: 20px">
							<h4>
								<span
										class="font13"
										style="font-weight: bold">
									<i class="fa fa-asterisk"></i>
									ALM �쒕쾭 �좏깮
								</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. ALM �쒕쾭 �좏깮
								</blockquote>
								<div class="clearfix widget-content">
									<!-- 而댄룷�뚰듃 ���� -->
									<div id="selected_info">
										<div
												class="panel-group json-menu"
												style="margin-bottom: 0px !important">
											<li
													class="list-group-item json-menu-header"
													style="padding: 0px">
												<div class="chat-message">
													<div
															class="chat-message-body"
															style="margin-left: 0px !important; border-right: 2px solid #e5603b; border-left: 0px">
													<span
															id="toRight"
															class="arrow"
															style="
															top: 10px !important;
															right: -7px;
															border-top: 5px solid transparent;
															border-bottom: 5px solid transparent;
															border-left: 5px solid #e5603b;
															border-right: 0px;
															left: unset;
														"></span>
														<div
																class="sender"
																style="padding-bottom: 5px; padding-top: 3px">
															<i class="fa fa-check"></i>
															�좏깮�� �쒕쾭
															:
															<span
																	id="select-alm-server"
																	style="color: #a4c6ff">
                                                                    �좏깮�섏� �딆쓬
														        </span>
														</div>
														<div
																id="select-project-div"
																class="sender"
																style="padding-bottom: 5px; padding-top: 3px; display: none;">
															<i class="fa fa-check"></i>
															�좏깮�� �꾨줈�앺듃 :
															<span
																	id="select-project"
																	style="color: #a4c6ff">
                                                                    �좏깮�섏� �딆쓬
														        </span>
														</div>
														<div
																id="select-issuetype-div"
																class="sender"
																style="padding-bottom: 5px; padding-top: 3px; display: none;">
															<i class="fa fa-check"></i>
															�좏깮�� �댁뒋�좏삎 :
															<span
																	id="select-issuetype"
																	style="color: #a4c6ff">
                                                                    �좏깮�섏� �딆쓬
														        </span>
														</div>
													</div>
												</div>
											</li>
										</div>
									</div>
								</div>
								<div class="wrapper">
									<div class="control-group">
										<div
												class="controls form-group select-box"
												style="margin-bottom: 15px !important">
											<select
													id="selected_alm_server"
													name="selected_alm_server"
													required="required"
													data-placeholder="Select ALM Server"
													class="select-block-level chzn-select darkBack"
													tabindex="-1"
													style="width: 100% !important">
												<option value=""></option>
											</select>
										</div>
									</div>
									<div
											id="cloud_project_tree"
											style="display: none;">
										<div
												class="gradient_bottom_border"
												style="width: 100%; height: 2px"></div>
										<div
												id="mmenu"
												style="padding-bottom: 5px; padding-top: 15px">
											<form
													class="form-search no-margin"
													role="form">
												<div class="input-group">
													<input
															type="search"
															id="text"
															class="form-control searchDarkBack"
															style="color: #f8f8f8"
															placeholder="李얠쓣 �곗씠�� �낅젰"
															data-tooltip="Press Enter To Node To Search" />
													<span class="input-group-btn">
														<button
																type="button"
																id="search"
																title="Search"
																class="btn btn-default btn-sm"
																style="line-height: 1.63">
															Search
														</button>
													</span>
												</div>
											</form>
										</div>
										<div
												id="alm_server_tree"
												style="padding-top: 5px; overflow: hidden"
												class="darkBack"></div>
										<div
												style="margin-top: 10px;
                                                       padding: 5px;
    												   word-break: keep-all;"
												class="darkBack">
											�대씪�곕뱶 吏��쇱쓽 寃쎌슦 "�꾨줈�앺듃" ��ぉ �섏쐞�� �댁뒋 �좏삎�� �좏깮�섏떆硫� �대떦 �댁뒋 �좏삎蹂� �곹깭瑜� 留ㅽ븨�� �� �덉뒿�덈떎.
										</div>
									</div>
								</div>
							</div>
						</div>
					</section>
				</div>
				<div class="col-lg-9">
					<section class="widget">
						<div class="body">
							<div class="w-full max-w-screen-xl mx-auto">
								<div id="allSampleContent" class="p-4 w-full">
									<div id="sample">
										<div id="myDiagramDiv" style="border: solid 1px black; width: 100%; height: 500px"></div>
									</div>
								</div>
							</div>
						</div>
					</section>
				</div>
			</div>
		</div>
	</section>
</div>

<div
		id="my_modal1"
		class="modal fade"
		role="dialog"
		aria-labelledby="myModalLabel"
		style="display: none; border-radius: 10px;">
		<div    class="modal-dialog"
				style="width: 80%; height: 80%">
				<div class="modal-content modalDarkBack">
					<div    class="modal-header"
							style="padding: 0px; border-bottom: 1px">
							<h4 class="modal-title font14"
								id="my_modal_label1"
								style="color: #f8f8f8; text-align: left; padding: 5px">
								<span   class="font13"
										style="font-weight: bold"
										id="my_modal1_title">
										<i class="fa fa-edit"></i>
										A-RMS �곹깭 �깅줉 �앹뾽
								</span>
								<blockquote    class="search-result"
											   style="border-left: 5px solid #e5603b">
									<p
											style="font-size: 13px; margin: 10px 0px 10px 0px; padding-left: 10px"
											id="my_modal1_description">
										A-RMS �붽뎄�ы빆�� �곹깭瑜� �깅줉�⑸땲��.
									</p>
								</blockquote>
							</h4>
							<div    class="widget-controls"
									style="padding-top: 10px">
									<a  data-widgster="close"
										title="Close"
										href="#"
										data-dismiss="modal">
										<i class="glyphicon glyphicon-remove"></i>
									</a>
							</div>
					</div>
					<div    class="modal-body"
							style="padding: 5px; border-top: 1px solid rgba(51, 51, 51, 0.3); padding-top: 5px">
						<form
								class="form-horizontal"
								method="post">
								<input  type="hidden"
										id="popup_view_state_c_id"
										name="popup_view_state_c_id" />
							<fieldset>
								<div    class="control-group"
										id="state_title_div"
										for="popup_view_state_name">
									<label class="control-label font13">�곹깭 �대쫫 :</label>
									<div    class="controls form-group input-group"
											style="margin-left: 180px">
										<span class="input-group-addon">
											<i class="glyphicon glyphicon-gift"></i>
										</span>
										<input  type="text"
												id="popup_view_state_name"
												name="popup_view_state_name"
												class="form-control parsley-validated font13 darkBack"
												data-placement="top"
												data-original-title="�곹깭�� �대쫫�� �낅젰�댁<�몄슂."
												required="required"
												placeholder="Requirement State Name" />
									</div>
								</div>
								<div
										class="control-group"
										id="state_category_div">
									<label class="control-label font13">�곹깭 移댄뀒怨좊━ :</label>
									<div    class="controls form-group input-group"
											style="margin-left: 180px">
										<span class="input-group-addon">
											<i class="glyphicon glyphicon-globe"></i>
										</span>
										<div style="display: flex; align-items: center; gap: 10px; padding: 0">
											<div
												id="popup_view_state_category_div"
												data-toggle="buttons">
											</div>
										</div>
									</div>
								</div>
								<div
										class="control-group"
										id="state_contents_div">
									<label  class="control-label"
											style="color: #f8f8f8">
										�곹깭 �ㅻ챸 :
									</label>
									<div class="controls form-group">
										<div    class="col-sm-12"
												style="padding-top: 10px">
											<div    id="popup_view_state_description_editor"
													class="darkBack">
												<p>�곹깭 愿��� �ㅻ챸 �깆쓣 湲곕줉�⑸땲��.</p>
											</div>
										</div>
									</div>
								</div>
								<div class="control-group hidden" id="change_state_div" style="display: flex; margin-top:10px;">
									<label class="control-label font13">��젣�� �곹깭 �대쫫 :</label>
									<input
											type="text"
											id="popup_view_change_state_name"
											name="popup_view_change_state_name"
											class="form-control parsley-validated font13 darkBack"
											disabled="disabled"
											data-placement="top"
											data-original-title="�곹깭�� �대쫫�� �낅젰�댁<�몄슂."
											placeholder="Requirement State Name"
											style="width: 30%;">
									<label class="control-label font13" style="width: 50px!important;"><i class="fa fa-long-arrow-right"></i></label>
									<label class="control-label font13">蹂�寃쏀븷 �곹깭 :</label>
									<div
											id="popup_view_change_state_div"
											data-toggle="buttons"
											style="width: 40%;"></div>
								</div>
							</fieldset>
						</form>
					</div>
					<div    class="modal-footer"
							style="background-color: transparent; padding: 5px; text-align: right; border-top: 0px">
							<button
									type="button"
									id="close_modal_popup"
									class="btn btn-default"
									data-dismiss="modal">
								Close
							</button>
							<button
									type="button"
									id="save_req_state"
									class="btn btn-primary">
								�좉퇋 �곹깭 �깅줉
							</button>
							<button
									type="button"
									id="update_req_state"
									class="btn btn-success">
								�곹깭 �뺣낫 蹂�寃�
							</button>
							<button
									type="button"
									id="delete_req_state"
									class="btn btn-danger"
									data-dismiss="modal">
									�곹깭 ��젣
							</button>
					</div>
				</div>
			<!-- /.modal-content -->
		</div>
		<!-- /.modal-dialog -->
</div>