html{
	overflow: hidden;
}

body {
	margin: 0;
	padding: 0;
	position: relative;
	background-color: #666;
}

body #wrapper {
	width: 100%;
	height: 100%;
	position: absolute;
	
	background-color: #666;
	box-shadow: 2px 2px 8px #000 inset;
	border: 1px solid #666;
	border-radius: 8px;
}

#divImageLoading{
	left: 45%;
	top: 45%;
	position: fixed;	
	display: none;
}

#divListBookmark span{
	font-size: small;
}

#divCopyText span{
	font-size: small;
}

#divSearchResult span{
	font-size: small;
}

#divListIndex span:hover{
	color:red;
	cursor:pointer;
	text-decoration: underline;
}

#right-toolbar{
	position: fixed;
}

#right-toolbar span{
	display: inline_block;
	padding: 10px;
	background-color: #fff;
}


/*#control_zoom {
	position: fixed;	
	padding-left: 15px;
	background-color: #F5F9FD;
	border-radius:10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}
#control_zoom span {
	display: inline-block;
	padding-bottom: 10px;
	padding-top: 10px;	
	width:30px;
}*/


/*#control_movepage {
	position: fixed;	
	padding-left: 15px;
	background-color: #F5F9FD;
	border-radius:10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}
#control_movepage span {
	display: inline-block;
	padding-bottom: 10px;
	padding-top: 10px;	
	width:30px;
}*/


.ui-slider-horizontal .ui-state-default {
 
  width: 300px;
  height: 140px;
  margin-left: -39px;
  top: -68px;
}

/*#control_process {
	position: fixed;	
	padding-left: 0px;
	
	background-color: #F5F9FD;
	border-radius:10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}*/

/*#divTxtSlider{
	background-color:white;
	margin-top: 5px;
	position: fixed;
	width: 90px;
}

#divTxtSlider input{
	border:0px;
}*/

/* slider bar [start]*/
.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br {
	top: 6px;
	right: 319px;
}
div .ui-slider-range, .ui-widget-header, .ui-slider-range-max {
	background: transparent;
}
/* slider bar [end]*/


/*#control_screen {
	position: fixed;
	width:250px;
	top: 100px;
	left: 100px;
}
#control_screen span {
	display: inline-block;
	padding: 5px;
	background-color: #FF0000;
	width:30px;
	height:30px;
}*/


#button_pre_canvas{
	position:absolute;
	opacity: 0;
}

#button_next_canvas{
	position:absolute;
	opacity: 0;
}


.nav {
	cursor: pointer;
	opacity: 0.4;
}


/*CSS for dialog*/
.web_dialog_overlay
{
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	margin: 0;
	padding: 0;
	background: #000000;
	opacity: .15;
	filter: alpha(opacity=15);
	-moz-opacity: .15;
	z-index: 101;
	display: none;
}

/*CSS for dialog*/
.web_dialog_overlay_loading
{
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	margin: 0;
	padding: 0;	
	opacity: .15;
	filter: alpha(opacity=15);
	-moz-opacity: .15;
	z-index: 101;
	display: none;
}

.web_dialog
{
	padding-top:100px;
	display: none;
	position: fixed;
	width:60%;
	height:80%;
	left: 20%;
	top: 10%;
	background-color: black;
	/*border: 2px solid #336699;*/
	padding: 0px;
	z-index: 102;
	font-family: Verdana;
	font-size: 10pt;
}

.align_right
{	
	float:right;
	width:18px;
	height:18px;
}

.content_image_preview{
	padding-top: 10px;
}
.contentview_label
{
    color: black;
    height: 25px;
    margin: 18px 10px 0 0;
}
.contentview_button
{
    height: 25px;
}
.h25
{
    height: 25px;
}

.button
{
    /*width: 180px;*/
    background-color: #123456;
    color: #ffffff;
    border-radius: 5px;
    
}
.marking_paneltitle
{
    padding: 2px 5px 2px 5px;
    font-weight: bold;
    color: #444444;
    background-color: #CCCCFF;
    width: 96%;
    cursor: default;
    border-radius: 10px;
}
.marking_paneltitle span
{
    float: right;
}
.paneltitle
{
    padding: 2px 5px 2px 5px;
    font-weight: bold;
    color: #444444;
    background-color: #cccccc;/*#CCCCFF;*/
    width: 100%;
}
.eraser_paneldialog
{
    display: none;
    /*border: 1px solid #000000;*/
   	/*width: 300px;*/
    padding: 0px 0px 0px 0px;
    /*background-color: #ffffff;*/
    left: 320px;
    top:94px;
    
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}
.paneldialog
{
	z-index: 1002;
    display: none;
    /*border: 1px solid #000000;*/
    width: 300px;
    padding: 0px 0px 0px 0px;
    position: absolute;
    outline:0px;
    left:320px;
    top:100px;
    
    /*background-color: #ffffff;*/
    
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}
.panelFooter
{
    text-align: center;
    clear: both;
    display: block;
    float: left;
    margin-top: 10px;
    text-align: center;
}
.eraser_preview
{
    float: none;
    border: 1px solid #d3d3d3;
    
}
.panelPreview 
{
    text-align: center;
}
.toolbar_icon
{
    /*border: 1px solid #123456;*/
    cursor: pointer;
    height: 25px;
}
.toolbar_icon_small
{
    /*border: 1px solid #123456;*/
    cursor: pointer;
    height: 18px;
}
.toolbar_icon_on
{
    background-color: #123456;
}
.toolbar_icon:hover
{
    background-color: #987654;
}
.toolbar_icons
{
    text-align: center;
}

#panel-maker-size, #panel-pen-size
{
	margin-bottom: 5px;
}

.colorpicker
{
	height: 15px;
	width: 15px;
	display: inline-block;
	margin-top: 3px;
	margin-right: 3px;
	border: 1px solid white;
	margin-left: 3px;
}

#makerColorwrapper, #penColorwrapper
{
	height: auto;
	width: 208px;
	/*background-color: #EEE;*/
	float: left;
	clear: both;
	margin-top: 20px;
}
#btnOk
{
	float: left;
	clear: both;
}
#btnCancel
{
    float: left;
}
#makerColorPreview, #penColorPreview
{
	height: 20px;
	width: 90px;
	border: 1px solid black;
	float: left;
	clear: none;
}
.marking_paneldialog
{
    display: none;
    
    border: 1px solid #123456;
    width: 300px;
    padding: 0px 0px 0px 0px;
    background-color: #ffffff;
    
    height: 300px;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    user-select: none;
    box-shadow: 5px 5px 1px #888888;
    border-radius: 10px;
  	    
  	    
}
.marking_paneldialog_body
{
    opacity:0.8;
    filter:alpha(opacity=80); /* For IE8 and earlier */
}
.paneldialog
{
    display: none;
    /*border: 1px solid #123456;*/
    width: 400px;
    padding: 0px 0px 0px 0px;
    /*background-color: #ffffff;*/
    
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}

.popuptext_web_dialog {    
    display: none;
    position: absolute;
    width: auto;
    height: auto;
    margin-left: auto;
    margin-top: auto;
    background-color: #FFFFFF;
    border-style:solid;
    border-color:#ccd;       
    padding: 15px;
    z-index: 102;
    font-family: Verdana;
    font-size: 10pt;
    border-radius: 10px;      
    z-index: 101;        
   }       
   
   .popuptext_arrow {
   	display:none;
    z-index: 102;
    content: ' ';
    position: absolute;
    top: 100%;
    border-style: solid;
    width: 0;
    height: 0;
    border-width: 12px 12px 12px 12px;                   
   }
  /* HOVER STYLES */
  .pop-up-memo {
    display: none;
    position: absolute;
    width: 100px;
    padding: 10px;
    background: #eeeeee;
    color: #000000;
    border: 1px solid #1a1a1a;
    font-size: 90%;
    z-index: 101;
  }
  
  .pop-up-memo a:hover{
  	cursor: pointer;
  	text-decoration: underline;
  }

  .check_marking{
  	top:70px;
  	left:20px;
  	position:absolute;
  	background-color: white;
  	opacity: 0.5;
  	border-radius: 5px;
  }	

/*------------------Control Pen------------------------*/
.rayermenu1
{
	width:390px;
	height: 265px;
	background:url('../img/viewer/alpha_w70.png') 0 0 repeat;
	/*top:-63px;*/
	/*right:-138px;*/
	z-index: 101;
	-webkit-border-radius:5px 5px 5px 5px;
	-moz-border-radius:5px 5px 5px 5px;
	border-radius:5px 5px 5px 5px;
	margin:0 auto;
	padding:15px 15px 13px;
	-webkit-box-shadow: 0px 0px 3px 1px #999;
	-moz-box-shadow: 0px 0px 3px 1px #999;
	box-shadow: 0px 0px 3px 1px #999;
}

.canvasArea_s{
	width:100px;
	height:100px;
	background:url('../img/viewer/canvas_s.png') 0 0 repeat;
	/*border:solid 1px #595959;*/
	display:block;
	float:left;
	margin:23px 0px 0px 30px;
}
.rayermenu1 div .cancelbtn{
	clear:both;
	display:block;
	width:128px;
	padding:0;
	text-align:center;
	font-size:13px;
	line-height:26px;
	margin:0;
	color:#fff;
	border:1px solid #fff; 
	outline:1px solid #2d83da;
	background: #78bafe; /* Old browsers */
	background: -moz-linear-gradient(top,  #78bafe 0%, #4499ef 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#78bafe), color-stop(100%,#4499ef)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #78bafe 0%,#4499ef 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #78bafe 0%,#4499ef 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #78bafe 0%,#4499ef 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #78bafe 0%,#4499ef 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#78bafe', endColorstr='#4499ef',GradientType=0 ); /* IE6-9 */
}

.rayermenu1 div a:hover.cancelbtn{
	cursor: pointer;
	clear:both;
	display:block;
	width:128px;
	padding:0;
	text-align:center;
	font-size:13px;
	line-height:26px;
	margin:0;
	color:#fff;
	border:1px solid #fff; 
	outline:1px solid #2d83da;
	background: rgb(45,123,191); /* Old browsers */
	background: -moz-linear-gradient(top,  rgb(45,123,191) 27%, rgb(16,89,163) 77%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(27%,rgb(45,123,191)), color-stop(77%,rgb(16,89,163))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgb(45,123,191) 27%,rgb(16,89,163) 77%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgb(45,123,191) 27%,rgb(16,89,163) 77%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgb(45,123,191) 27%,rgb(16,89,163) 77%); /* IE10+ */
	background: linear-gradient(to bottom,  rgb(45,123,191) 27%,rgb(16,89,163) 77%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2d7bbf', endColorstr='#1059a3',GradientType=0 ); /* IE6-9 */
}
/*-----------------------End Control Pen------------------*/

/*--------------------------Memo----------------------------*/



aside.MemoIndexBox a:hover{
	cursor: pointer;
}

aside.MemoIndexBox {
	width: 466px;
	display:block;
	-webkit-box-shadow: 0px 0px 3px 1px #666;
	-moz-box-shadow: 0px 0px 3px 1px #666;
	box-shadow: 0px 0px 3px 1px #666;
	position:absolute;
	/*left:700px;*/
}
aside.MemoIndexBox .indexBoxHd {
	width: 461px;
	height:25px;
	background:url('../img/viewer/pophdbg.png') 0 0 repeat;
	color:#FFFFFF;
	font-size:13px;
	line-height:25px;
	padding:0 0 0 5px;
}
aside.MemoIndexBox .indexBoxHd .delete{
	background:url('../img/viewer/x.png') 0 0 repeat;
	width:16px;
	height:16px;
	display:block;
	float:right;
	margin:4px 2px 0 21px;
}
aside.MemoIndexBox .indexBoxHd .hidden_off{
	background:url('../img/viewer/_.png') 0 0 repeat;
	width:16px;
	height:16px;
	display:block;
	float:right;
	margin:4px 26px 0 -26px;
}
aside.MemoIndexBox .indexBoxHd .hidden_on{
	background:url('../img/viewer/sikaku.png') 0 0 repeat;
	width:16px;
	height:16px;
	display:block;
	float:right;
	margin:4px 26px 0 -26px;
}
aside.MemoIndexBox .indexBoxBody_on{
	height:357px; 	
    width: 458px;
	background:#FFFFFF;
	border:solid 1px #cfd0d0;
	border-top:none;
	padding: 3px;
	overflow:auto;
}
aside.MemoIndexBox .indexBoxBody_off{
	width:458px;
	height:357px;
	background:#FFFFFF;
	border:solid 1px #cfd0d0;
	border-top:none;
	padding:5px 0 0;
	display:none;
	overflow:auto;
}
.indexBox ul li a:hover{color:#0099CC;text-decoration:underline;}

.parentMemoDialogImportantCss{
	border: 0 none !important;
	background: none !important;
}
.memoDialogImportantCss{
	height: 400px !important; 
	border: 0 none !important; 
	background: none !important; 
	padding: 0!important; 
	overflow: hidden !important;
	font-family: "メイリオ", "Meiryo", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS P Gothic", "Osaka", Verdana, Arial, Helvetica, sans-serif;
}

/*--------------- Gomu-------------------------*/
.gomuCanvasArea_s{
	width:120px;
	height:120px;
	background:url('../img/viewer/canvas_s.png') 0 0 repeat;
	/*border:solid 1px #595959;*/
	display:block;
	float:left;
	margin-left: 70px;
}
.gomuRayermenu1
{
	background:url('../img/viewer/alpha_w70.png') 0 0 repeat;
	position:absolute;
	/*top:-63px;*/
	/*right:-138px;*/
	z-index: 101;
	-webkit-border-radius:5px 5px 5px 5px;
	-moz-border-radius:5px 5px 5px 5px;
	border-radius:5px 5px 5px 5px;
	margin:0 auto;
	padding:15px 15px 13px;
	-webkit-box-shadow: 0px 0px 3px 1px #999;
	-moz-box-shadow: 0px 0px 3px 1px #999;
	box-shadow: 0px 0px 3px 1px #999;
}
.gomuRayermenu1 div .cancelbtn{
	clear:both;
	display:block;
	width:128px;
	padding:0;
	text-align:center;
	font-size:13px;
	line-height:26px;
	margin:0;
	color:#fff;
	border:1px solid #fff; 
	outline:1px solid #2d83da;
	background: #78bafe; /* Old browsers */
	background: -moz-linear-gradient(top,  #78bafe 0%, #4499ef 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#78bafe), color-stop(100%,#4499ef)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #78bafe 0%,#4499ef 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #78bafe 0%,#4499ef 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #78bafe 0%,#4499ef 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #78bafe 0%,#4499ef 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#78bafe', endColorstr='#4499ef',GradientType=0 ); /* IE6-9 */
}

.gomuRayermenu1 div a:hover.cancelbtn{
	cursor: pointer;
	clear:both;
	display:block;
	width:128px;
	padding:0;
	text-align:center;
	font-size:13px;
	line-height:26px;
	margin:0;
	color:#fff;
	border:1px solid #fff; 
	outline:1px solid #2d83da;
	background: rgb(45,123,191); /* Old browsers */
	background: -moz-linear-gradient(top,  rgb(45,123,191) 27%, rgb(16,89,163) 77%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(27%,rgb(45,123,191)), color-stop(77%,rgb(16,89,163))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgb(45,123,191) 27%,rgb(16,89,163) 77%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgb(45,123,191) 27%,rgb(16,89,163) 77%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgb(45,123,191) 27%,rgb(16,89,163) 77%); /* IE10+ */
	background: linear-gradient(to bottom,  rgb(45,123,191) 27%,rgb(16,89,163) 77%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2d7bbf', endColorstr='#1059a3',GradientType=0 ); /* IE6-9 */
}


.pen_selected{
	background:url(../img/viewer/1_hover.png) 0 0 repeat-x;
	width:60px;
	height:60px;
}

.pen_hover{
	background:url(../img/viewer/1.png) 0 0 repeat-x;
	width:60px;
	height:60px;
}

.pen_hover:hover{
	background:url(../img/viewer/1_hover.png) 0 0 repeat-x;
	width:60px;
	height:60px;
}

.maker_selected{
	background:url(../img/viewer/3_hover.png) 0 0 repeat-x;
	width:60px;
	height:60px;
}

.maker_hover{
	background:url(../img/viewer/3.png) 0 0 repeat-x;
	width:60px;
	height:60px;
}

.maker_hover:hover{
	background:url(../img/viewer/3_hover.png) 0 0 repeat-x;
	width:60px;
	height:60px;
}

.eraser_selected{
	background:url(../img/viewer/5_hover.png) 0 0 repeat-x;
	width:60px;
	height:60px;
}

.eraser_hover{
	background:url(../img/viewer/5.png) 0 0 repeat-x;
	width:60px;
	height:60px;
}

.eraser_hover:hover{
	background:url(../img/viewer/5_hover.png) 0 0 repeat-x;
	width:60px;
	height:60px;
}

.pen_option_selected{
	background:url(../img/viewer/2_hover.png) 0 0 repeat-x;
	width:60px;
	height:60px;
}

.pen_option_hover{
	background:url(../img/viewer/2.png) 0 0 repeat-x;
	width:60px;
	height:60px;
}

.pen_option_hover:hover{
	background:url(../img/viewer/2_hover.png) 0 0 repeat-x;
	width:60px;
	height:60px;
}

.maker_option_selected{
	background:url(../img/viewer/4_hover.png) 0 0 repeat-x;
	width:60px;
	height:60px;
}

.maker_option_hover{
	background:url(../img/viewer/4.png) 0 0 repeat-x;
	width:60px;
	height:60px;
}

.maker_option_hover:hover{
	background:url(../img/viewer/4_hover.png) 0 0 repeat-x;
	width:60px;
	height:60px;
}

.eraser_option_selected{
	background:url(../img/viewer/6_hover.png) 0 0 repeat-x;
	width:60px;
	height:60px;
}

.eraser_option_hover{
	background:url(../img/viewer/6.png) 0 0 repeat-x;
	width:60px;
	height:60px;
}

.eraser_option_hover:hover{
	background:url(../img/viewer/6_hover.png) 0 0 repeat-x;
	width:60px;
	height:60px;
}

#bgmConfirm 
{
    position: absolute;
    display: none;
}

.sectionDeleteConfirm .deletebtn a.ok_audio {
	position:relative;
	margin: 0 120px 0 0;
	cursor: pointer;
}