<!-- ビューアエリア FROM -->
	<div id="wrapper" style="">

		<!--Viewer component is added here -->
		<div id="overlay" class="web_dialog_overlay"> </div>
		<div id="dialog" class="web_dialog"> </div>
		<div id="divCheckExistMarking" class="check_marking" style="display:none;">
			<img src="img/viewer/icon_marked.png" />
		</div>
		<div id="divCheckExistMemo" class="check_marking" style="display:none;">
			<img src="img/viewer/icon_memo.png" />
		</div>
		<header id ="header_toolbar" class="header__">
			<div class = "wrapper_header">
				<div id ="top_toolbar" class="hdLcolumn fix">
					<span class="hgloupe">
						<a id="imgHome" class="home" title="ホーム" lang="dspHome"> </a>
						<a id="imgBack" class="back" title="戻る" lang="txtTooltipBack"> </a>
					</span>
					<span class="gloupe">
						<a id="listbookmark" class="bmList" title="しおり一覧" lang="txtShioriCtnLs"> </a>
						<a id="imgbookmark" class="bmAdd" title="しおり追加" lang="txtTooltipBookmark"> </a>
					</span>
					<span class="gloupe">
						<a id="listindex" class="index" title="インデックス" lang="txtIndex"> </a>
					</span>
					<aside id="boxIndex" class="indexBox" style="display: none;">
						<h1 id="indexBoxHdIndex" class="indexBoxHd">
							<a id="indexClosing" class="delete" > </a>
						</h1>
						<div id="divListIndex" class="indexBoxBody_on"></div>
					</aside>
					<span class="gloupe">
						<a id="copytext" class="copy" title="コピー" lang="txtTextCopy"> </a>
					</span>
					<aside class="bookmarkBox" id ="boxCopyText">
						<h1 class="bookmarkBoxHd" id="bookmarkBoxHdCT"></h1>
						<ul id="divCopyText" class="bookmarkBoxBody_on"></ul>
					</aside>
					<aside class="bookmarkBox" id="boxBookMark" style="display: none;">
						<h1 class="bookmarkBoxHd" id="bookmarkBoxHdBM"></h1>
						<ul id="divListBookmark" class="bookmarkBoxBody_on"></ul>
					</aside>
					<span class="gloupe">
						<a id="imgmemo" class="memoDisplay" title="メモ表示" lang="txtTooltipShowMemo"> </a>
						<a id="imgaddmemo" class="memoAdd" title="メモ追加" lang="txtTooltipAddMemo"> </a>
					</span>
					<span class="lgloupe">
						<a id="imgmarking" class="marking" title="マーキング" lang="txtTooltipShowMarking"> </a>
						<a id="imgmarkingtoolbar" class="markingToolbar" title="マーキングツールバー表示" lang="txtTooltipShowMarkingTool"> </a>
					</span>
					<span class="gloupe">
						<a id="rotatebtnL" class="rotateL" title="コンテンツ左回転" lang="txtTooltipRotateContentL"> </a>
						<a id="rotatebtnR" class="rotateR" title="コンテンツ右回転" lang="txtTooltipRotateContentR" angle = '0'> </a>
					</span>
				</div>
				<div id="search_toolbar" class="hdRcolumn">
					<input id="txtSearch" type="text">
					<aside id="boxSearching" class="bookmarkBox" style="display: none;">
						<h1 id="bookmarkBoxHdSearching" class="bookmarkBoxHd"></h1>
						<ul id="divSearchResult" class="bookmarkBoxBody_on"></ul>
					</aside>
				</div>
				<div id="close_toolbar" class="hdRcolumn" style="display:none;">
					<a id="close_screen" href="#" class="closebtn"> </a>
				</div>
			</div>
		</header>

		<aside id="boxAddMemo" class="bookmarkBox">
			<h1 id="bookmarkBoxHdMemo" class="bookmarkBoxHd">
				<a id="memoClosing" class="delete" > </a>
				<label class="lang" lang = "txtMemoMenu" > </label>
			</h1>
			<ul id="divAddMemo" class="bookmarkBoxBody_on">
				<br />
				<a id="liAddMemo" lang = "txtMemoNew" class="lang cancelbtn"> </a><br />
				<a id="liCopyMemo" lang = "txtMemoPaste" class="lang cancelbtn"> </a> <br />
				<a id="liDeleteMemo" lang = "txtMemoClear" class="lang cancelbtn"> </a>
				<br />
			</ul>
		</aside>
		<div id="button_pre_canvas" class="gBackbtn"></div>
		<div id="button_next_canvas" class="gNextbtn"></div>
		<div id="divDialogMemo"></div>
		<div id="dialog-contenttype-music"></div>
		<div id="dialogPopUp" class="popuptext_web_dialog"></div>
		<div id="arrow" class="popuptext_arrow"></div>
		<div id="pop_up_memo" class="pop-up-memo">
			<a id="btn_show_memo" class="lang" lang = "txtMemoEdit" > </a> <br /><br />
			<a id="btn_copy_memo" class="lang" lang = "txtMemoCopy"> </a>
		</div>
		<div id="divImageLoading">
			<img src="img/view_loading.gif" width="64px" height="64px">
		</div>
		<!-- ================================================================================== -->
		<!-- Marking group [start]
		<!-- ================================================================================== -->

		<!-- Marking [start] -->
		<aside class="markingBox" id="dlgMarking">
			<h1 class="markingBoxHd">
				<label class="lang" lang="txtMkToolBar">マーカー(オプション)</label>
				<a class="hidden_off" id="dlgMarking_imgMin" > </a>
				<a class="hidden_on" id="dlgMarking_imgMax"> </a>
			</h1>
			<div id="dlgMarking_body" class="markingBoxBody_on">
				<ul class="fix">
					<li><div id="dlgMarking_imgPen" > </div></li>
					<li><div id="dlgMarking_imgPenOption"> </div></li>
					<li><div id="dlgMarking_imgMaker"> </div></li>
					<li><div id="dlgMarking_imgMakerOption"> </div></li>
					<li><div id="dlgMarking_imgEraser"> </div></li>
					<li><div id="dlgMarking_imgEraserOption"> </div></li>
				</ul>
				<a id="dlgMarking_dspPgClear" class="clearbtn lang" lang="dspPgClear">このページクリア</a>
				<a id="dlgMarking_dspSave" class="savebtn lang" lang="dspSave" >保存</a>
				<a id="dlgMarking_dspCancel" class="cancelbtn lang" lang="dspCancel">キャンセル</a>
			</div>
		</aside>
		<!-- Marking [ end ] -->

		<!-- Eraser [start] -->
		<div class="rayermenu3" id="dlgGomu">
			<div>
				<ul>
					<li>
						<a id="text_dlgGomu_rdo4">
							<input type="radio" id="dlgGomu_rdo4" name="rdoSize" value="4"/>
							<span><label for="dlgGomu_rdo4" class="lang" lang="txtMkgSB">特大</label></span>
							<img class="sizeXL" src="img/viewer/en_xl.png" alt="">
						</a>
					</li>
					<li>
						<a id="text_dlgGomu_rdo3">
							<input type="radio" id="dlgGomu_rdo3" name="rdoSize" value="3"/>
							<span><label for="dlgGomu_rdo3" class="lang" lang="txtMkgB">大</label></span>
							<img class="sizeL" src="img/viewer/en_l.png" alt="">
						</a>
					</li>
					<li>
						<a id="text_dlgGomu_rdo2">
							<input type="radio" id="dlgGomu_rdo2" name="rdoSize" value="2"/>
							<span><label for="dlgGomu_rdo2" class="lang" lang="txtMkgM">中</label></span>
							<img class="sizeM" src="img/viewer/en_m.png" alt="">
						</a>
					</li>
					<li>
						<a id="text_dlgGomu_rdo1">
							<input type="radio" id="dlgGomu_rdo1" name="rdoSize" value="1" checked="checked"/>
							<span><label for="dlgGomu_rdo1" class="lang" lang="txtMkgS">小</label></span>
							<img class="sizeS" src="img/viewer/en_s.png" alt="">
						</a>
					</li>
				</ul>
			</div>
			<div class="popcolumnR">
				<canvas id="dlgGomu_cvMain" class="canvasArea_l" width="98" height="98"> </canvas>
			</div>
			<div>
				<a id="dlgGomu_dspCancel" class="cancelbtn lang" href="#" lang="dspCancel">キャンセル</a>
				<a id="dlgGomu_dspOK" class="cancelbtn lang okbtn" href="#" lang="dspOK">OK</a>
			</div>
		</div>
		<!-- Eraser [ end ] -->

		<!-- Maker [ start ] -->
		<div id="dlgMaker" class="rayermenu1">
			<ul class="popcolumnL">
				<li>
					<a id="marker-oversize-text">
						<input type="radio" id="maker-size-oversize" name="maker-size" />
						<span><label for="maker-size-oversize" class="lang" lang="txtMkgSB">XL</label></span>
						<img class="sizeXL" src="img/viewer/en_xl.png" alt="">
					</a>
				</li>
				<li>
					<a id="marker-large-text">
						<input type="radio" id="maker-size-large" name="maker-size"/>
						<span><label for="maker-size-large" class="lang" lang="txtMkgB">L</label></span>
						<img class="sizeL" src="img/viewer/en_l.png" alt="">
					</a>
				</li>
				<li>
					<a id="marker-medium-text">
						<input type="radio" id="maker-size-medium" name="maker-size"/>
						<span><label for="maker-size-medium" class="lang" lang="txtMkgM">M</label></span>
						<img class="sizeM" src="img/viewer/en_m.png" alt="">
					</a>
				</li>
				<li>
					<a id="marker-small-text">
						<input type="radio" id="maker-size-small" name="maker-size"/>
						<span><label for="maker-size-small" class="lang" lang="txtMkgS">S</label></span>
						<img class="sizeS" src="img/viewer/en_s.png" alt="">
					</a>
				</li>
			</ul>
			<div id="makerColorwrapper" class="popcolumnR">
				<table cellpadding="0" cellspacing="0" class="colorchip">
				<tbody>
				<tr>
					<td><a colorId="ff0000" class="color01 colorpicker" href="#"> </a></td>
					<td><a colorId="ffff00" class="color02 colorpicker" href="#"> </a></td>
				</tr>
				<tr>
					<td><a colorId="00ff00" class="color03 colorpicker" href="#"> </a></td>
					<td><a colorId="00ffff" class="color04 colorpicker" href="#"> </a></td>
				</tr>
				<tr>
					<td><a colorId="0000ff" class="color05 colorpicker" href="#"> </a></td>
					<td><a colorId="ff00ff" class="color06 colorpicker" href="#"> </a></td>
				</tr>
				<tr>
					<td><a colorId="ffffff" class="color07 colorpicker" href="#"> </a></td>
					<td><a colorId="000000" class="color08 colorpicker" href="#"> </a></td>
				</tr>
				</tbody>
				</table>
				<span>  </span>
				<canvas id="Maker_cvPreviewmaker" class="canvasArea_s" width="98" height="98"> </canvas>
			</div>
			<div>
				<a id="Maker_btnCancel" class="lang cancelbtn" lang="dspCancel">キャンセル</a>
				<a id="Maker_btnOk" class="lang cancelbtn okbtn" lang="dspOK">OK</a>
			</div>
		</div>
		<!-- Maker [ end ] -->

		<!-- Pen [ start ] -->
		<div id="dlgPen" class="rayermenu1">
			<ul class="popcolumnL">
				<li>
					<a id="pen-oversize-text">
						<input type="radio" id="pen-size-oversize" name="maker-size"/>
						<span><label for="pen-size-oversize" class="lang" lang="txtMkgSB">XL</label></span>
						<img class="sizeXL" src="img/viewer/en_xl.png" alt="">
					</a>
				</li>
				<li>
					<a id="pen-large-text">
						<input type="radio" id="pen-size-large" name="maker-size"/>
						<span><label for="pen-size-large" class="lang" lang="txtMkgB">L</label></span>
						<img class="sizeL" src="img/viewer/en_l.png" alt="">
					</a>
				</li>
				<li>
					<a id="pen-medium-text">
						<input type="radio" id="pen-size-medium" name="maker-size"/>
						<span><label for="pen-size-medium" class="lang" lang="txtMkgM">M</label></span>
						<img class="sizeM" src="img/viewer/en_m.png" alt="">
					</a>
				</li>
				<li>
					<a id="pen-small-text">
						<input type="radio" id="pen-size-small" name="maker-size"/>
						<span><label for="pen-size-small" class="lang" lang="txtMkgS">S</label></span>
						<img class="sizeS" src="img/viewer/en_s.png" alt="">
					</a>
				</li>
			</ul>
			<div id="penColorwrapper" class="popcolumnR">
				<table cellpadding="0" cellspacing="0" class="colorchip">
				<tbody>
				<tr>
					<td><a colorId="ff0000" class="color01 colorpicker" href="#"> </a></td>
					<td><a colorId="ffff00" colorId class="color02 colorpicker" href="#"> </a></td>
				</tr>
				<tr>
					<td><a colorId="00ff00" class="color03 colorpicker" href="#"> </a></td>
					<td><a colorId="00ffff" class="color04 colorpicker" href="#"> </a></td>
				</tr>
				<tr>
					<td><a colorId="0000ff" class="color05 colorpicker" href="#"> </a></td>
					<td><a colorId="ff00ff" class="color06 colorpicker" href="#"> </a></td>
				</tr>
				<tr>
					<td><a colorId="ffffff" class="color07 colorpicker" href="#"> </a></td>
					<td><a colorId="000000" class="color08 colorpicker" href="#"> </a></td>
				</tr>
				</tbody>
				</table>
				<span>  </span>
				<canvas id="Pen_cvPreviewPen" class="canvasArea_s" width="98" height="98"> </canvas>
			</div>
			<div>
				<a id="Pen_btnCancel" class="lang cancelbtn" lang="dspCancel">キャンセル</a>
				<a id="Pen_btnOk" class="lang okbtn cancelbtn" lang="dspOK">OK</a>
			</div>
		</div>
		<!-- Pen [ end ] -->

		<div id="dlgOverlay"> </div>
		<!-- ================================================================================== -->
		<!-- Marking group [end]
		<!-- ================================================================================== -->

		<!-- ================================================================================== -->
		<!-- Footer [start]
		<!-- ================================================================================== -->
		<footer id="footer_toolbar_1" class="footer">
			<div class="ftinner">
				<!-- slider transition sizing -->
				<div class="ftLcolumn">
					<!-- slider [start] -->
					<div class="slider fix">
						<div id="divTxtSlider" class="sld01">
							<span><input id="txtSlider" type="text" size="2" maxlength="4"/><label id="lblSlider"> </label></span>
						</div>
						<a id="control_process" class="sld02"><div id="slider_page" > </div></a>
					</div>
					<!-- slider [end] -->

					<!-- transition [start] -->
					<!-- temporary tool tip - must be change "lang" -->
					<div id="control_movepage" class="transition fix">
						<a id="firstpage" class="begin"> </a>
						<a id="prevpage" class="prev"> </a>
						<a id="nextpage" class="next"> </a>
						<a id="lastpage" class="last"> </a>
					</div>
					<!-- transition [end] -->

					<!-- sizing [start] -->
					<!-- temporary tool tip - must be change "lang" -->
					<div id="control_zoom" class="sizing">
						<a id="zoomin" class="expansion"> </a>
						<a id="zoomfit" class="fit"> </a>
						<a id="zoomout" class="reduction"> </a>
					</div>
					<!-- sizing [end] -->
				</div>

				<!-- toolbar -->
				<div class="ftRcolumn">
					<a id="control_screen" class="toolbar"> </a>
				</div>
			</div>
		</footer>
		<footer class="footerTool" id="footer_toolbar_2">
			<div class="ftRcolumn_2"></div>
		</footer>
		<a id="control_screen_2" class="toolbar_close" style=""> </a>
		<!-- ================================================================================== -->
		<!-- Footer [end]
		<!-- ================================================================================== -->

		<section id="bgmConfirm" class="sectionDeleteConfirm" style="display:none;">
			<h1 class="lang" lang=""> </h1>
			<p class="message lang" lang="msgBGMPlayConfirm" id="txtAudio">このコンテンツはBGMが流れるようになっています。BGMを再生してもよろしいですか?</p>
			<p class="deletebtn" ><a id="bgmConfirm_dspOK" lang="dspOK" class="ok_audio lang">OK</a></p>
		</section>

		<section id="bgmConfirm_page" class="sectionDeleteConfirm" style="display:none;">
			<h1 class="lang" lang=""> </h1>
			<p class="message lang" lang="msgBGMPlayConfirm" id="txtAudio_page">このコンテンツはBGMが流れるようになっています。BGMを再生してもよろしいですか?</p>
			<p class="deletebtn" ><a id="bgmConfirm_dspOK_page" lang="dspOK" class="ok_audio lang">OK</a></p>
		</section>

		<section id="contentVideoConfirm" class="sectionDeleteConfirm" style="display:none;">
			<h1 class="lang" lang=""> </h1>
			<p class="message lang" lang="txtMediaAutoPlayWarning" id="txtContentVideo">Confirm Play Video</p>
			<p class="deletebtn" ><a id="contentVideoConfirm_OK" lang="dspOK" class="ok_audio lang">OK</a></p>
		</section>

		<section id="contentAudioConfirm" class="sectionDeleteConfirm" style="display:none;">
			<h1 class="lang" lang=""> </h1>
			<p class="message lang" lang="txtMediaAutoPlayWarning" id="txtContentAudio">Confirm Play Audio</p>
			<p class="deletebtn" ><a id="contentAudioConfirm_OK" lang="dspOK" class="ok_audio lang">OK</a></p>
		</section>

	</div>
	<!-- ビューアエリア TO -->

	<!-- JSビュー -->
	<script type="text/javascript" src="./common/js/jquery.ui.touch-punch.min.js?__UPDATEID__"></script>
	<script type="text/javascript" src="./common/js/htmlparser.js?__UPDATEID__"></script>
	<script type="text/javascript" src="./common/js/textObject.js?__UPDATEID__"></script>
	<script type="text/javascript" src="./js/contentview_CallApi.js?__UPDATEID__" ></script>
	<script type="text/javascript" src="./js/contentview_Events.js?__UPDATEID__" ></script>
	<script type="text/javascript" src="./js/contentview_GetData.js?__UPDATEID__" ></script>
	<script type="text/javascript" src="./js/contentview_InitObjects.js?__UPDATEID__" ></script>
	<script type="text/javascript" src="./js/contentview_CreateObjects.js?__UPDATEID__" ></script>
	<script type="text/javascript" src="./js/contentview_General.js?__UPDATEID__" ></script>
	<script type="text/javascript" src="./js/contentview.js?__UPDATEID__"></script>
	<script type="text/javascript" src="./js/contentview_Memo.js?__UPDATEID__"></script>
	<script type="text/javascript" src="./js/contentview_Gomu.js?__UPDATEID__"></script>
	<script type="text/javascript" src="./js/contentview_Maker.js?__UPDATEID__"></script>
	<script type="text/javascript" src="./js/contentview_Pen.js?__UPDATEID__"></script>
	<script type="text/javascript" src="./js/contentview_Marking.js?__UPDATEID__"></script>
	<script type="text/javascript" src="./js/contentview_PopupText.js?__UPDATEID__"></script>
	<script type="text/javascript" src="./js/contentview_Paint.js?__UPDATEID__"></script>
	<script type="text/javascript" src="./js/contentview_Anket.js?__UPDATEID__"></script>
	<script type="text/javascript" src="./js/contentview_Exam.js?__UPDATEID__"></script>
	<script type="text/javascript" src="./js/contentview_Quiz.js?__UPDATEID__"></script>
	<script type="text/javascript" src="./js/contentview_3d.js?__UPDATEID__"></script>
	<script type="text/javascript" src="./js/contentview_ContentTypeNone.js?__UPDATEID__"></script>
	<script type="text/javascript" src="./js/contentview_ImagePreview.js?__UPDATEID__"></script>
	<script type="text/javascript" src="./common/js/zoomDetector.js?__UPDATEID__" ></script>
	<script type="text/javascript" src="./common/js/jquery.powertip.js?__UPDATEID__"></script>
	<script type="text/javascript" src="./common/js/script.js?__UPDATEID__"></script>