Index: arms/html/pdService/content-container.html
===================================================================
diff -u -r558049ccd7a66e8d6bf7a661bddce3fd3f9f8d3f -rc08c041deeb93d0af3ee9328b878282d0454e8b4
--- arms/html/pdService/content-container.html	(.../content-container.html)	(revision 558049ccd7a66e8d6bf7a661bddce3fd3f9f8d3f)
+++ arms/html/pdService/content-container.html	(.../content-container.html)	(revision c08c041deeb93d0af3ee9328b878282d0454e8b4)
@@ -1,39 +1,44 @@
 <div class="col-lg-4">
-	<!--    <section class="widget">-->
-	<!--        <div>-->
-	<!--            <button id="compose-btn" class="btn btn-danger btn-block">신규 제품<sup>서비스</sup> 등록하기</button>-->
-	<!--            <ul id="review-classify" class="review-classify"></ul>-->
-	<!--        </div>-->
-	<!--    </section>-->
 	<section class="widget">
+		<header>
+			<h4>
+				<span class="font13" style="font-weight: bold">
+					<i class="fa fa-edit"></i> 제품(서비스) 조회 및 선택
+				</span>
+			</h4>
+			<div class="widget-controls">
+				<a title="Options" href="#"><i class="glyphicon glyphicon-cog"></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="close" title="Close" href="#"
+					><i class="glyphicon glyphicon-remove"></i
+				></a>
+			</div>
+		</header>
 		<div class="body">
-			<div class="wrapper">
-				<div id="mmenu" style="padding-bottom: 5px">
-					<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"
-								>
-									Search
-								</button>
-							</span>
-						</div>
-					</form>
+			<blockquote class="font13">1. 제품(서비스) 선택</blockquote>
+			<div
+				class="box box-primary"
+				style="background: rgba(51, 51, 51, 0.225); margin-bottom: 5px !important"
+			>
+				<div class="box-body">
+					<table
+						id="pdserviceTable"
+						class="display responsive no-wrap"
+						cellspacing="0"
+					>
+						<thead>
+							<tr>
+								<th>c_id</th>
+								<th>c_title</th>
+							</tr>
+						</thead>
+					</table>
 				</div>
-				<div id="demo" style="padding-top: 5px" class="darkBack"></div>
-				<div style="margin-top: 10px" class="darkBack">설명</div>
 			</div>
 		</div>
 	</section>
@@ -43,7 +48,9 @@
 	<section class="widget">
 		<header class="product-handler">
 			<div class="product-handler__group">
-				<a class="btn btn-block btn-transparent" href="">새창으로 보기</a>
+				<a class="btn btn-block btn-transparent blank" href="pdServiceOpen.html"
+					>새창으로 보기</a
+				>
 				<a id="service-modify" class="btn btn-block btn-transparent" href="#"
 					>내용편집 하기</a
 				>
@@ -176,22 +183,21 @@
 						</table>
 					</form>
 				</div>
+
 				<p class="pull-right" style="padding-top: 10px">
-					<button class="btn btn-info" id="show-info-message">
-						제품(서비스) 등록
-					</button>
-				</p>
-				<p class="pull-right" style="padding-top: 10px; padding-right: 10px">
 					<button
 						type="button"
-						class="btn btn-success"
+						class="btn btn-info"
 						id="modalPopupId"
 						data-toggle="modal"
 						data-target="#myModal2"
 					>
-						새창으로 편집
+						제품(서비스) 등록
 					</button>
 				</p>
+				<p class="pull-right" style="padding-top: 10px; padding-right: 10px">
+					<a class="btn btn-success" id="show-info-message"> 새창으로 편집 </a>
+				</p>
 				<div
 					id="myModal2"
 					class="modal fade"
Index: arms/js/pdService.js
===================================================================
diff -u -r558049ccd7a66e8d6bf7a661bddce3fd3f9f8d3f -rc08c041deeb93d0af3ee9328b878282d0454e8b4
--- arms/js/pdService.js	(.../pdService.js)	(revision 558049ccd7a66e8d6bf7a661bddce3fd3f9f8d3f)
+++ arms/js/pdService.js	(.../pdService.js)	(revision c08c041deeb93d0af3ee9328b878282d0454e8b4)
@@ -17,7 +17,7 @@
 
 $(function () {
 	setSideMenu("sidebar_menu_product", "sidebar_menu_product_manage");
-	jsTreeBuild("#demo", "pdservice");
+
 	//서비스 등록
 	$(".btn-info").on("click", function () {
 		var index = $("label.btn-sm.active").index();
@@ -38,6 +38,52 @@
 	]);
 });
 
+function jstreeDataTableReload() {
+	console.log("href: " + $(location).attr("href"));
+	console.log("protocol: " + $(location).attr("protocol"));
+	console.log("host: " + $(location).attr("host"));
+	console.log("pathname: " + $(location).attr("pathname"));
+	console.log("search: " + $(location).attr("search"));
+	console.log("hostname: " + $(location).attr("hostname"));
+	console.log("port: " + $(location).attr("port"));
+
+	var isDevelopingToRoute = "/auth-user";
+
+	var tempDataTable = $("#pdserviceTable").DataTable({
+		ajax: {
+			url: isDevelopingToRoute + "/api/arms/pdservice/getMonitor.do",
+			dataSrc: "",
+		},
+		destroy: true,
+		processing: true,
+		responsive: false,
+		columns: [{ data: "c_id" }, { data: "c_title" }],
+		columnDefs: [
+			{
+				targets: -1,
+				className: "dt-body-left",
+			},
+		],
+	});
+
+	$("#pdserviceTable tbody").on("click", "tr", function () {
+		$(this).toggleClass("selected");
+		var data = tempDataTable.row(this).data();
+		console.log(data);
+		//alert( 'You clicked on '+ data.c_title +'\'s row' );
+	});
+}
+
+$(function () {
+	jstreeDataTableReload();
+	$(".dataTables_length").find("select:eq(0)").addClass("darkBack");
+	$(".dataTables_length").find("select:eq(0)").css("min-height", "30px");
+	//min-height: 30px;
+
+	$("body").find("[aria-controls='pdserviceTable']").css("width", "100px");
+	$("select[name=pdserviceTable_length]").css("width", "50px");
+});
+
 // --- 에디터 설정 --- //
 //CKEDITOR.replace("editor");
 //CKEDITOR.replace("modal-editor");
@@ -150,3 +196,10 @@
 
 	location.href = `pdServiceModify.html?service=${123}`;
 });
+
+$(".blank").click(function (ev) {
+	ev.preventDefault();
+
+	console.log("##", ev, location);
+	window.open(ev.target.href, "_blank");
+});
Index: arms/pdServiceOpen.html
===================================================================
diff -u
--- arms/pdServiceOpen.html	(revision 0)
+++ arms/pdServiceOpen.html	(revision c08c041deeb93d0af3ee9328b878282d0454e8b4)
@@ -0,0 +1,399 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<title>Atlassian RMS</title>
+
+		<meta charset="utf-8" />
+		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
+		<!-- Tell the browser to be responsive to screen width -->
+		<meta
+			name="viewport"
+			content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"
+		/>
+
+		<meta http-equiv="Expire" content="-1" />
+		<meta http-equiv="Keywords" content="Atlassian RMS" />
+		<meta http-equiv="Reply-to" content="admin@a-rms.net" />
+		<meta http-equiv="Content-Language" content="Korean" />
+		<meta http-equiv="Last-Modified" content="Thu 01 Nov 2016 23:59:59" />
+		<meta http-equiv="Organization" content="www.a-rms.net" />
+		<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
+		<meta http-equiv="Cache-Control" content="no-cache" />
+		<meta http-equiv="Pragma" content="no-cache" />
+		<meta http-equiv="imagetoolbar" content="no" />
+		<meta http-equiv="content-Script-type" content="text/javascript" />
+		<meta http-equiv="content-Style-type" content="text/css" />
+
+		<meta name="robots" content="ALL, INDEX, FOLLOW" />
+		<meta name="Subject" content="Atlassian RMS" />
+		<meta name="Filename" content="ARMS.html" />
+		<meta name="Author-Date" content="31 Oct 16" />
+		<meta name="Date" content="31 Oct 16" />
+		<meta name="Author" content="LeeDongmin" />
+		<meta name="Other Agent" content="LeeDongMin" />
+		<meta name="Email" content="admin@a-rms.net" />
+		<meta name="Reply-To" content="admin@a-rms.net" />
+		<meta name="Project" content="Atlassian RMS" />
+		<meta name="Status" content="Draft" />
+		<meta name="Location" content="South Korea" />
+		<meta name="distribution" content="aRMS" />
+		<meta name="Description" content="Standard Web Project" />
+		<meta
+			name="verify-v1"
+			content="Eal6+fiCjgKAZb5A6pRvSLmsh9NLF2AsqxqJrLuFoAs="
+		/>
+		<meta name="Revision" content="1.0" />
+		<meta name="Generator" content="eclipse 3.6.1" />
+		<meta name="Classification" content="Development,Deployment" />
+		<meta name="Copyright" content="CopyRight@aRMS. All Rights Reserved" />
+		<meta name="title" content="Atlassian RMS" />
+		<meta name="revisit-after" content="7 days" />
+		<meta name="siteinfo" content="http://www.a-rms.net/robots.txt" />
+		<meta name="HandheldFriendly" content="True" />
+		<meta name="MobileOptimized" content="320" />
+
+		<meta property="og:type" content="website" />
+		<meta property="og:title" content="Atlassian RMS" />
+		<meta property="og:url" content="http://www.a-rms.net/" />
+		<meta property="og:site_name" content="Atlassian RMS" />
+
+		<!-- favicon -->
+		<link rel="icon" href="./img/313devgrp.ico" type="image/x-icon" />
+		<link rel="shortcut icon" href="./img/313devgrp.ico" type="image/x-icon" />
+
+		<link
+			href="../reference/jquery-plugins/normalize.css-8.0.1/normalize.css"
+			rel="stylesheet"
+		/>
+		<link
+			href="../reference/lightblue4/docs/css/application.css"
+			rel="stylesheet"
+		/>
+		<link href="css/override.css" rel="stylesheet" />
+		<script>
+			/* yeah we need this empty stylesheet here. It's cool chrome & chromium fix
+           chrome fix https://code.google.com/p/chromium/issues/detail?id=167083
+                      https://code.google.com/p/chromium/issues/detail?id=332189
+        */
+		</script>
+
+		<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
+		<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
+		<!--[if lt IE 9]>
+			<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
+			<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
+		<![endif]-->
+
+		<!-- ANALYTICS START -->
+		<!-- https://www.google.com/analytics/settings/home?scid=18527803 web log Analyzer  -->
+		<script type="text/javascript">
+			//<![CDATA[
+			var _gaq = _gaq || [];
+			_gaq.push(["_setAccount", "UA-18527803-1"]);
+			_gaq.push(["_trackPageview"]);
+			_gaq.push(["_trackPageLoadTime"]);
+			(function () {
+				var ga = document.createElement("script");
+				ga.type = "text/javascript";
+				ga.async = true;
+				ga.src =
+					("https:" == document.location.protocol ? "https://ssl" : "http://www") +
+					".google-analytics.com/ga.js";
+				var s = document.getElementsByTagName("script")[0];
+				s.parentNode.insertBefore(ga, s);
+			})();
+			//]]>
+		</script>
+		<!-- ANALYTICS END -->
+		<!-- NAVER ANALYTICS START -->
+		<script type="text/javascript" src="http://wcs.naver.net/wcslog.js"></script>
+		<script type="text/javascript">
+			if (!wcs_add) var wcs_add = {};
+			wcs_add["wa"] = "1244b972beb34c";
+			wcs_do();
+		</script>
+		<!-- NAVER ANALYTICS END -->
+	</head>
+	<body>
+		<div class="logo" data-include="html/main/page-logo.html"></div>
+
+		<div class="wrap" style="margin-left: 0">
+			<header
+				class="page-header"
+				data-include="html/main/page-header.html"
+			></header>
+
+			<div class="content container">
+				<section
+					class="widgetheader"
+					data-include="html/pdService/content-header.html"
+				></section>
+
+				<div class="row" data-include="html/pdService/content-container.html"></div>
+
+				<footer
+					class="content-footer pull-right"
+					data-include="html/main/content-footer.html"
+				></footer>
+			</div>
+
+			<div class="loader-wrap hiding hide">
+				<i class="fa fa-circle-o-notch fa-spin"></i>
+			</div>
+		</div>
+
+		<div id="topicon" style="opacity: 1">
+			<img src="./img/topicon.gif" alt="맨위로" />
+		</div>
+
+		<!-- common libraries. required for every page-->
+		<script src="../reference/lightblue4/docs/lib/jquery/dist/jquery.min.js"></script>
+		<script src="../reference/lightblue4/docs/lib/jquery-pjax/jquery.pjax.js"></script>
+		<script src="../reference/lightblue4/docs/lib/bootstrap-sass/assets/javascripts/bootstrap.min.js"></script>
+		<script src="../reference/lightblue4/docs/lib/widgster/widgster.js"></script>
+		<script src="../reference/lightblue4/docs/lib/underscore/underscore.js"></script>
+
+		<!-- jquery plugins -->
+		<script src="../reference/light-blue/lib/jquery-maskedinput/jquery.maskedinput.js"></script>
+		<script src="../reference/light-blue/lib/parsley/parsley.js"></script>
+		<script src="../reference/light-blue/lib/jquery.autogrow-textarea.js"></script>
+
+		<!-- jquery upload plugins -->
+		<script src="../reference/light-blue/lib/icheck.js/jquery.icheck.js"></script>
+		<script src="../reference/light-blue/lib/vendor/jquery.ui.widget.js"></script>
+		<!-- The Templates plugin is included to render the upload/download listings -->
+		<script src="../reference/light-blue/lib/vendor/http_blueimp.github.io_JavaScript-Templates_js_tmpl.js"></script>
+		<!-- The Load Image plugin is included for the preview images and image resizing functionality -->
+		<script src="../reference/light-blue/lib/vendor/http_blueimp.github.io_JavaScript-Load-Image_js_load-image.js"></script>
+		<!-- The Canvas to Blob plugin is included for image resizing functionality -->
+		<script src="../reference/light-blue/lib/vendor/http_blueimp.github.io_JavaScript-Canvas-to-Blob_js_canvas-to-blob.js"></script>
+		<!-- The Iframe Transport is required for browsers without support for XHR file uploads -->
+		<script src="../reference/light-blue/lib/jquery.iframe-transport.js"></script>
+		<!-- The basic File Upload plugin -->
+		<script src="../reference/light-blue/lib/jquery.fileupload.js"></script>
+		<!-- The File Upload file processing plugin -->
+		<script src="../reference/light-blue/lib/jquery.fileupload-fp.js"></script>
+		<!-- The File Upload user interface plugin -->
+		<script src="../reference/light-blue/lib/jquery.fileupload-ui.js"></script>
+
+		<!-- common application js -->
+		<script src="../reference/lightblue4/docs/js/app.js"></script>
+		<script src="../reference/lightblue4/docs/js/settings.js"></script>
+
+		<!-- page libs -->
+		<script src="../reference/lightblue4/docs/lib/slimScroll/jquery.slimscroll.min.js"></script>
+		<script src="../reference/lightblue4/docs/lib/jquery.sparkline/index.js"></script>
+		<script src="../reference/lightblue4/docs/lib/backbone/backbone.js"></script>
+		<script src="../reference/lightblue4/docs/lib/backbone.localStorage/build/backbone.localStorage.min.js"></script>
+		<script src="../reference/lightblue4/docs/lib/d3/d3.min.js"></script>
+		<script src="../reference/lightblue4/docs/lib/nvd3/build/nv.d3.min.js"></script>
+
+		<!-- page interaction -->
+		<script src="../reference/jquery-plugins/topbar.js"></script>
+
+		<!-- common templates -->
+		<script type="text/template" id="settings-template">
+			<div class="setting clearfix">
+			    <div>Sidebar on the</div>
+			    <div id="sidebar-toggle" class="pull-left btn-group" data-toggle="buttons-radio">
+			        <% onRight = sidebar == 'right'%>
+			        <button type="button" data-value="left" class="btn btn-sm btn-default <%= onRight? '' : 'active' %>">Left</button>
+			        <button type="button" data-value="right" class="btn btn-sm btn-default <%= onRight? 'active' : '' %>">Right</button>
+			    </div>
+			</div>
+			<div class="setting clearfix">
+			    <div>Sidebar</div>
+			    <div id="display-sidebar-toggle" class="pull-left btn-group" data-toggle="buttons-radio">
+			        <% display = displaySidebar%>
+			        <button type="button" data-value="true" class="btn btn-sm btn-default <%= display? 'active' : '' %>">Show</button>
+			        <button type="button" data-value="false" class="btn btn-sm btn-default <%= display? '' : 'active' %>">Hide</button>
+			    </div>
+			</div>
+		</script>
+
+		<!-- page specific scripts -->
+		<script type="text/template" id="sidebar-settings-template">
+			<% auto = sidebarState == 'auto'%>
+			<% if (auto) {%>
+			<button type="button"
+			        data-value="icons"
+			        class="btn-icons btn btn-transparent btn-sm">Icons</button>
+			<button type="button"
+			        data-value="auto"
+			        class="btn-auto btn btn-transparent btn-sm">Auto</button>
+			<%} else {%>
+			<button type="button"
+			        data-value="auto"
+			        class="btn btn-transparent btn-sm">Auto</button>
+			<% } %>
+		</script>
+
+		<!-- page template -->
+		<script type="text/template" id="message-template">
+			<div class="sender pull-left">
+			    <div class="icon">
+			        <img src="img/avatars/2.png" class="img-circle" alt="">
+			    </div>
+			    <div class="time">
+			        just now
+			    </div>
+			</div>
+			<div class="chat-message-body">
+			    <span class="arrow"></span>
+			    <div class="sender"><a href="#">Tikhon Laninga</a></div>
+			    <div class="text">
+			        <%- text %>
+			    </div>
+			</div>
+		</script>
+
+		<!-- upload template -->
+		<script id="template-upload" type="text/x-tmpl">
+			{% for (var i=0, file; file=o.files[i]; i++) { %}
+			<tr class="template-upload fade">
+			    <td class="preview"><span class="fade"></span></td>
+			    <td class="name"><span>{%=file.name%}</span></td>
+			    <td class="size"><span>{%=o.formatFileSize(file.size)%}</span></td>
+			    {% if (file.error) { %}
+			    <td class="error" colspan="2"><span class="label label-important">Error</span> {%=file.error%}</td>
+			    {% } else if (o.files.valid && !i) { %}
+			    <td>
+			        <div class="progress progress-success progress-striped active" role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="0">
+			            <div class="bar" style="width:0%;"></div>
+			        </div>
+			    </td>
+			    <td>{% if (!o.options.autoUpload) { %}
+			        <button class="btn btn-primary btn-sm start">
+			            <i class="fa fa-upload"></i>
+			            <span>Start</span>
+			        </button>
+			        {% } %}</td>
+			    {% } else { %}
+			    <td colspan="2"></td>
+			    {% } %}
+			    <td>{% if (!i) { %}
+			        <button class="btn btn-warning btn-sm cancel">
+			            <i class="fa fa-ban"></i>
+			            <span>Cancel</span>
+			        </button>
+			        {% } %}</td>
+			</tr>
+			{% } %}
+		</script>
+
+		<!-- The template to display files available for download -->
+		<script id="template-download" type="text/x-tmpl">
+			{% for (var i=0, file; file=o.files[i]; i++) { %}
+			<tr class="template-download fade">
+			    {% if (file.error) { %}
+			    <td></td>
+			    <td class="name"><span>{%=file.name%}</span></td>
+			    <td class="size"><span>{%=o.formatFileSize(file.size)%}</span></td>
+			    <td class="error" colspan="2"><span class="label label-important">Error</span> {%=file.error%}</td>
+			    {% } else { %}
+			    <td class="preview">{% if (file.thumbnail_url) { %}
+			        <a href="{%=file.url%}" title="{%=file.name%}" data-gallery="gallery" download="{%=file.name%}"><img src="{%=file.thumbnail_url%}"></a>
+			        {% } %}</td>
+			    <td class="name">
+			        <a href="{%=file.url%}" title="{%=file.name%}" data-gallery="{%=file.thumbnail_url&&'gallery'%}" download="{%=file.name%}">{%=file.name%}</a>
+			    </td>
+			    <td class="size"><span>{%=o.formatFileSize(file.size)%}</span></td>
+			    <td colspan="2"></td>
+			    {% } %}
+			    <td>
+			        <button class="btn btn-danger btn-sm delete" data-type="{%=file.delete_type%}" data-url="{%=file.delete_url%}"{% if (file.delete_with_credentials) { %} data-xhr-fields='{"withCredentials":true}'{% } %}>
+			        <i class="fa fa-trash"></i>
+			        <span>Delete</span>
+			        </button>
+			    </td>
+			</tr>
+			{% } %}
+		</script>
+
+		<!-- JSTREE -->
+		<script
+			type="text/javascript"
+			src="../reference/jquery-plugins/jstree-v.pre1.0/_lib/jquery.cookie.js"
+			charset="utf-8"
+		></script>
+		<script
+			type="text/javascript"
+			src="../reference/jquery-plugins/jstree-v.pre1.0/_lib/jquery.hotkeys.js"
+			charset="utf-8"
+		></script>
+		<script
+			type="text/javascript"
+			src="../reference/jquery-plugins/jstree-v.pre1.0/jquery.jstree.js"
+			charset="utf-8"
+		></script>
+		<script
+			type="text/javascript"
+			src="../reference/jquery-plugins/jnotify_v2.1/jquery/jNotify.jquery.min.js"
+			charset="utf-8"
+		></script>
+		<link
+			rel="stylesheet"
+			type="text/css"
+			href="../reference/jquery-plugins/jnotify_v2.1/jquery/jNotify.jquery.css"
+			media="screen"
+		/>
+
+		<!-- dataTable -->
+		<link
+			rel="stylesheet"
+			type="text/css"
+			href="../reference/jquery-plugins/dataTables-1.10.16/media/css/jquery.dataTables_lightblue4.css"
+			media="screen"
+		/>
+		<link
+			rel="stylesheet"
+			type="text/css"
+			href="../reference/jquery-plugins/dataTables-1.10.16/extensions/Responsive/css/responsive.dataTables_lightblue4.css"
+			media="screen"
+		/>
+		<link
+			rel="stylesheet"
+			type="text/css"
+			href="../reference/jquery-plugins/dataTables-1.10.16/extensions/Select/css/select.dataTables_lightblue4.css"
+			media="screen"
+		/>
+		<script
+			type="text/javascript"
+			src="../reference/jquery-plugins/dataTables-1.10.16/media/js/jquery.dataTables.js"
+			charset="utf-8"
+		></script>
+		<script
+			type="text/javascript"
+			src="../reference/jquery-plugins/dataTables-1.10.16/extensions/Responsive/js/dataTables.responsive.js"
+			charset="utf-8"
+		></script>
+		<script
+			type="text/javascript"
+			src="../reference/jquery-plugins/dataTables-1.10.16/extensions/Select/js/dataTables.select.js"
+			charset="utf-8"
+		></script>
+
+		<!-- ckeditor4 -->
+		<script
+			type="text/javascript"
+			src="../reference/jquery-plugins/ckeditor4-4.16.1/ckeditor.js"
+			charset="utf-8"
+		></script>
+
+		<!-- multiselect -->
+		<link
+			rel="stylesheet"
+			type="text/css"
+			href="../reference/jquery-plugins/select2-4.0.13/dist/css/select2_lightblue4.css"
+			media="screen"
+		/>
+		<script
+			type="text/javascript"
+			src="../reference/jquery-plugins/select2-4.0.13/dist/js/select2.min.js"
+			charset="utf-8"
+		></script>
+
+		<!-- page js -->
+		<script type="text/javascript" src="js/common.js" charset="utf-8"></script>
+	</body>
+</html>