@charset "UTF-8";

/*대시보드 포틀릿*/
:root {
	--portletAreabarHeight : 4px;
	--portletVAreabarWidth : 4px;
	--portletTitleHeight : 29px;
	--portletTitleCalcHeight : calc( var(--workTitleHeight) + 1px);
	--portletButtonAreaHeight : 30px;
	
	--basketAreaWidth : 240px;
	--basketAreaContentWidth : 240px;
	--basketAreaContentHeight : 160px;
	
	--layerSelectOpenAreaHeight : 10px;
	--basketAreaOpenAreaWidth : 10px;
	--bottomButtonAreaHeight : 30px;
	--workbookSelectAreaHeight : 124px;
	--workbookSelectOpenAreaHeight : 12px;
}

/*대시보드 박스*/
.dashboardArea {
	width: calc(100%);
	height: calc(100%);
	position: relative;
	overflow: hidden;
	background-color: #bbc6cf;
}

.dashboardArea .mainDashboardArea {
    width: calc(100% - var(--basketAreaWidth) - 3px);
    height: calc(100% - var(--layerSelectOpenAreaHeight) - var(--workbookSelectAreaHeight) - 3px);
    float: left;
    margin-left: 2px;	
    position: absolute;
    top: var(--layerSelectOpenAreaHeight);		
}
.dashboardArea .layerArea {
	width: 100% ;
	height: calc(100% - var(--bottomButtonAreaHeight) );
	overflow: hidden;
	position: relative;
}


.dashboardArea .bottomButtonArea {
	width: 100% ;
	height: var(--bottomButtonAreaHeight);
	background-color: #fff;
    box-sizing: border-box;
    border-top: 2px solid rgb(187, 198, 207);	
}

.dashboardArea .basketArea {
	width: var(--basketAreaWidth);
	height: calc(100% - var(--layerSelectOpenAreaHeight) - var(--workbookSelectAreaHeight) - 2px);
	background-color: #fff;
	position: absolute;
    top: var(--layerSelectOpenAreaHeight);
    right: 2px;
}

.dashboardArea .workbookSelectArea{
    width: 100%;
    height: var(--workbookSelectAreaHeight) ;
    background-color: #fff;
    box-sizing: border-box;
    border-top: 2px solid rgb(187, 198, 207);
    position: absolute;
    bottom: 2px;
    left: 0px;
}

.dashboardArea .workbookSelectArea .workbookSelect{
	width: 100%;
    position: absolute;
    top: var(--workbookSelectOpenAreaHeight);
    height: calc(var(--workbookSelectAreaHeight) - var(--workbookSelectOpenAreaHeight) - 2px);
}

.dashboardArea .workbookSelectArea .workbookSelect .maxContent > div{
	float: left;
	width:171px;
	height : 94px;

	margin-left : 2px;
	margin-right : 2px;
	
	border: 2px solid rgb(187, 198, 207);
	
	cursor:pointer;
	
	position: relative;
}

.dashboardArea .workbookSelectArea .workbookSelect .maxContent > div > img{
	object-fit: contain;
    width: 100%;
    height: 100%;
    
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    user-drag: none;    
}

.dashboardArea .workbookSelectArea .workbookSelect .maxContent > div > p {
	margin-left: 5px;
	width:calc(100% - 10px);
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
	
    position: absolute;
    top: 0px;
    left: 0px;
    background-color: rgba(242, 242, 242, 0.5);
    margin: 0px;
    color: #4D4D64;
    font-weight: bolder;
    padding-left: 5px;	
	padding-right: 5px;
	
    text-shadow: 0px 0px 1px #00008C;
	border-bottom: 1px solid rgb(187, 198, 207);
}

.dashboardArea .workbookSelectArea .portletMinusArea {
	position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
	display:none;
	box-sizing: border-box;
	
    background-color: rgba(255, 255, 255, 0.8);
    background-size: contain;
    opacity : 0.7;
}

.dashboardArea.plusMode .workbookSelectArea .portletMinusArea {
    background-image: url(../../images/dashboard/portlet/portlet_minus.png);
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
    border: 2px solid #0000ab00;
    	
	display:block;
}

.dashboardArea.plusMode .workbookSelectArea .portletMinusArea:hover {
	border: 2px solid #0000ab;
	
	background-image: url(../../images/dashboard/portlet/portlet_minus_hover.png);
}

.dashboardArea.moveMode .workbookSelectArea .portletMinusArea {
	display:block;
}


.dashboardArea.plusMode .basketArea .portletArea {
	border-top: 2px solid rgb(187, 198, 207);
}

.dashboardArea.hideBasket .mainDashboardArea {
	width: calc(100% - var(--basketAreaOpenAreaWidth) - 3px);
}
.dashboardArea.hideBasket .basketArea {
	width: var(--basketAreaOpenAreaWidth);
}
.dashboardArea.hideBasket .basketArea .basketSelect{
	position:fixed;
	top:-10000px;
	left:-10000px;
}


.dashboardArea.hideWorkbookSelect .mainDashboardArea {
	height: calc(100% - var(--layerSelectOpenAreaHeight) - var(--workbookSelectOpenAreaHeight) - 3px);
}
.dashboardArea.hideWorkbookSelect .basketArea {
	height: calc(100% - var(--layerSelectOpenAreaHeight) - var(--workbookSelectOpenAreaHeight) - 2px);
}

.dashboardArea.hideWorkbookSelect .workbookSelectArea {
	height: var(--workbookSelectOpenAreaHeight);
}
.dashboardArea.hideWorkbookSelect .workbookSelectArea .workbookSelect{
	position:fixed;
	top:-10000px;
	left:-10000px;
}


/*포틀릿영역*/
.dashboardArea .portletArea {position: absolute;}

/*포틀릿 타이틀영역*/
.dashboardArea .portletArea .portletTitle {
  width: 100%; 
  height : var(--portletTitleHeight);
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  box-shadow: 1px 1.7px 10px 0 rgba(0, 0, 0, 0.07);
  background-color: #f2f2f2;
  background-image: url(../../images/dashboard/portlet/portletTitle.png);
  background-repeat: no-repeat;
  background-position-x: 11px;
  background-position-y: 10px;  
  border-bottom: 1px solid #b5b8c4;
  
  cursor: pointer;
}

.dashboardArea .portletArea .portletTitle>span {
	float: left;
	margin-top: 6px;
	margin-left: 24px;
	width:calc(100% - 92px - 24px - 20px);
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}

/*포틀릿 버튼영역*/
.dashboardArea .portletArea .portletTitle .dashboardButtonArea {
  width:auto;
  float:right;
  height: calc( var(--portletButtonAreaHeight) - 3px );
  margin-top: 1px;
  margin-right: 6px;
}

.dashboardArea .portletArea .portletTitle .dashboardButtonBox {float: right;}

.dashboardArea .portletArea .portletTitle .dashboardButtonBox div.iconButton {
	background-repeat: no-repeat; 
	background-size: cover; 
	width: 20px; 
	height: 20px; 
	float: left; 
	cursor: pointer; 
	margin-right: 3px;
	margin-top: 4px;
	opacity: 0.50;
}
.dashboardArea .portletArea .portletTitle .dashboardButtonBox div.iconButton:hover {opacity: 0.70;}

.dashboardArea .portletArea .portletTitle .dashboardButtonBox div.iconButton.playArrawIcon {background-image: url(../../images/dashboard/portlet/play_arrow.png); }
.dashboardArea .portletArea .portletTitle .dashboardButtonBox div.iconButton.playArrawIcon:hover{background-image: url(../../images/dashboard/portlet/play_arrow_hover.png); }
.dashboardArea .portletArea .portletTitle .dashboardButtonBox div.iconButton.stopArrawIcon {background-image: url(../../images/dashboard/portlet/stop_arrow.png); }
.dashboardArea .portletArea .portletTitle .dashboardButtonBox div.iconButton.stopArrawIcon:hover{background-image: url(../../images/dashboard/portlet/stop_arrow_hover.png); }
.dashboardArea .portletArea .portletTitle .dashboardButtonBox div.iconButton.exportIcon {background-image: url(../../images/dashboard/portlet/export.png); }
.dashboardArea .portletArea .portletTitle .dashboardButtonBox div.iconButton.exportIcon:hover{background-image: url(../../images/dashboard/portlet/export_hover.png);}
.dashboardArea .portletArea .portletTitle .dashboardButtonBox div.iconButton.maximizeIcon {background-image: url(../../images/dashboard/portlet/maximize.png); }
.dashboardArea .portletArea .portletTitle .dashboardButtonBox div.iconButton.maximizeIcon:hover{background-image: url(../../images/dashboard/portlet/maximize_hover.png);}
.dashboardArea .portletArea .portletTitle .dashboardButtonBox div.iconButton.minimizeIcon {background-image: url(../../images/dashboard/portlet/minimize.png); }
.dashboardArea .portletArea .portletTitle .dashboardButtonBox div.iconButton.minimizeIcon:hover{background-image: url(../../images/dashboard/portlet/minimize_hover.png);}
.dashboardArea .portletArea .portletTitle .dashboardButtonBox div.iconButton.closeIcon {background-image: url(../../images/dashboard/portlet/close.png); }
.dashboardArea .portletArea .portletTitle .dashboardButtonBox div.iconButton.closeIcon:hover{background-image: url(../../images/dashboard/portlet/close_hover.png);}
.dashboardArea .portletArea .portletTitle .dashboardButtonBox div.iconButton.settingsIcon {background-image: url(../../images/dashboard/portlet/settings.png);}
.dashboardArea .portletArea .portletTitle .dashboardButtonBox div.iconButton.settingsIcon:hover{background-image: url(../../images/dashboard/portlet/settings_hover.png);}

.dashboardArea .portletArea .portletTitle .dashboardButtonBox div.iconButton.btnPortletMinimize {
	display:none;
}

.dashboardArea .portletArea .contentViewer {width: 100%; height : calc(100% - var(--portletTitleCalcHeight)); background-color: #ffffff;position: relative;overflow: hidden;}

.dashboardArea .portletArea .contentViewer.thumnailViewer {cursor: pointer;}

.dashboardArea .portletArea .contentViewer.thumnailViewer img {
    object-fit: fill;
    width: 100%;
    height: 100%;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    user-drag: none;
}

.dashboardArea .portletArea .contentViewer.newPortlet span {
    font-size: 20px;
    transform: translate(-50%, -50%);
    width: fit-content;
    position: absolute;
    top: calc( 50% - 2px );
    left: calc( 50% - 2px );
    text-shadow: 4px 4px 3px #BFBFBF;
    font-weight: bolder;
    color: #000080;
    text-align: center;
}

.dashboardArea .portletArea .portletCover {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-color: rgba(255,255,255,0.1);	
    box-sizing: border-box; 
    display : none;
}

.dashboardArea.dragMode .portletArea .portletCover {
	display:block;
}

.dashboardArea.plusMode .portletArea .portletCover:hover { border: 2px solid #0000ab }

.dashboardArea.dragMode .layerArea .portletArea .portletCover {
	display:block;
}

.dashboardArea.moveMode .basketArea .portletArea .portletCover {
    background-color: rgba(255,255,255,0.3);
}

.dashboardArea.moveMode .layerArea .portletArea .portletCover:hover { border: 2px solid #0000ab }

.dashboardArea .bottomButtonArea {
	position: relative;
}

.dashboardArea .bottomButtonArea .goPageArea {
    width: max-content;
    height: 24px;
    margin:0px auto;
    padding-top: 2px;
}

.dashboardArea .bottomButtonArea .goPageArea > div {
    height: 24px;
    float: left;
}

.dashboardArea .bottomButtonArea .goPageArea > div.pageLeft {
    background-image: url(../../images/dashboard/portlet/paging_leftbg.png);
    background-repeat: no-repeat;
    width: 28px;
}

.dashboardArea .bottomButtonArea .goPageArea > div.pageRight {
    background-image: url(../../images/dashboard/portlet/paging_rightbg.png);
    background-repeat: no-repeat;
    width: 28px;
}

.dashboardArea .bottomButtonArea .goPageArea > div.pageCenter {
    background-image: url(../../images/dashboard/portlet/paging_centerbg.png);
    background-repeat: no-repeat;
    width: 20px;
    background-size: 20px 24px;
}

.dashboardArea .bottomButtonArea .goPageArea > .pageCenter > div {
    background-image: url(../../images/dashboard/portlet/paging_disable.png);
    background-repeat: no-repeat;
    width: 20px;
    height: 17px;
    margin-top: 4px;
    margin-left: 1px;
    cursor: pointer;
    background-size: contain;    
}

.dashboardArea .bottomButtonArea .goPageArea > .pageCenter.currPage > div {
    background-image: url(../../images/dashboard/portlet/paging_select.png);
}

.dashboardArea .bottomButtonArea .goPageArea > .pageCenter:hover > div {
    background-image: url(../../images/dashboard/portlet/paging_hover.png);
}

.dashboardArea .bottomButtonArea .goPageArea > div.pageBlank {
    width: 6px;
    background-image: url(../../images/dashboard/portlet/paging_centerbg.png);
    background-repeat: no-repeat;    
}


.dashboardArea .bottomButtonArea .goPageArea > div.pagePlus {
    background-image: url(../../images/dashboard/portlet/paging_centerbg.png);
    background-repeat: no-repeat;
    width: 20px;
    background-size: 20px 24px;
}

.dashboardArea .bottomButtonArea .goPageArea > .pagePlus > div {
    background-image: url(../../images/dashboard/portlet/paging_plus.png);
    background-repeat: no-repeat;
    width: 20px;
    height: 17px;
    margin-top: 4px;
    margin-left: 1px;
    cursor: pointer;
    background-size: contain;
}

.dashboardArea .bottomButtonArea .goPageArea > .pagePlus:hover > div {
    background-image: url(../../images/dashboard/portlet/paging_plus_hover.png);
}

.dashboardArea .bottomButtonArea .goPageArea > div.pageMinus {
    background-image: url(../../images/dashboard/portlet/paging_centerbg.png);
    background-repeat: no-repeat;
    width: 20px;
    background-size: 20px 24px;
}

.dashboardArea .bottomButtonArea .goPageArea > .pageMinus > div {
    background-image: url(../../images/dashboard/portlet/paging_minus.png);
    background-repeat: no-repeat;
    width: 20px;
    height: 17px;
    margin-top: 4px;
    margin-left: 1px;
    cursor: pointer;
    background-size: contain;
}

.dashboardArea .bottomButtonArea .goPageArea > .pageMinus:hover > div {
    background-image: url(../../images/dashboard/portlet/paging_minus_hover.png);
}


.dashboardArea .bottomButtonArea .dashboardButtonBox {
	margin-top: 4px;
    position: absolute;
	right: 10px;
	top: 0px;
}

.dashboardArea.noSlideShow .bottomButtonArea .dashboardButtonBox { display:none; }

.dashboardArea .dashboardButtonBox div.iconButton {
	background-repeat: no-repeat; 
	background-size: cover; 
	width: 20px; 
	height: 20px; 
	float: left; 
	cursor: pointer; 
	margin-right: 3px;
	opacity: 0.50;
}
.dashboardArea .dashboardButtonBox div.iconButton:hover {opacity: 0.70;}

.dashboardArea .dashboardButtonBox div.iconButton.playIcon {background-image: url(../../images/dashboard/portlet/play.png); }
.dashboardArea .dashboardButtonBox div.iconButton.playIcon:hover{background-image: url(../../images/dashboard/portlet/play_hover.png); }
.dashboardArea .dashboardButtonBox div.iconButton.stopIcon {background-image: url(../../images/dashboard/portlet/stop.png); }
.dashboardArea .dashboardButtonBox div.iconButton.stopIcon:hover{background-image: url(../../images/dashboard/portlet/stop_hover.png); }
.dashboardArea .dashboardButtonBox div.iconButton.exitFullScreenIcon {background-image: url(../../images/dashboard/portlet/fullscreen_exit.png); }
.dashboardArea .dashboardButtonBox div.iconButton.exitFullScreenIcon:hover{background-image: url(../../images/dashboard/portlet/fullscreen_exit_hover.png); }

.dashboardArea .dashboardButtonBox input.inputAnimateDuration {
	width: 20px;
	float: left;
	height: 18px;
	margin-right: 5px;
}

.dashboardArea.noSlideShow .dashboardButtonBox div.iconButton.playIcon
	, .dashboardArea.noSlideShow .dashboardButtonBox div.iconButton.stopIcon
	, .dashboardArea.noSlideShow .dashboardButtonBox input.inputAnimateDuration {
	
	display:none;
}


/*포틀릿영역 영역나눔바*/
.dashboardArea .layerArea .lrAreabar {width:var(--portletVAreabarWidth); cursor:e-resize; position: absolute; box-sizing:border-box;}
.dashboardArea .layerArea .lrAreabar.dragMode {height:100%; background-color: rgba(92,97,102,.5); }
.dashboardArea .layerArea .udAreabar {height:var(--portletAreabarHeight); cursor:n-resize; position: absolute; box-sizing:border-box;}
.dashboardArea .layerArea .udAreabar.dragMode {width:100%; background-color: rgba(92,97,102,.5); }
.dashboardArea .layerArea .biasAreabar {width:var(--portletVAreabarWidth); height:var(--portletAreabarHeight); cursor:nw-resize; position: absolute; box-sizing:border-box; }
.dashboardArea .layerArea .biasAreabar.dragMode {background-color: rgba(92,97,102,.5); }

.dashboardArea .layerButtonBox {
    position: absolute;
    right: 20px;
    bottom: 10px;
    z-index: 200;
    background-color: #bbc6cf;
    border: 2px solid #bbc6cf;
    padding-left: 8px;
    padding-right: 3px;
    padding-top: 3px;
    padding-bottom: 3px;
    border-radius: 16px;
    opacity: 0.7;
    display:none;
}

.dashboardArea .layerButtonBox:hover { opacity: 1; }

.dashboardArea .layerButtonBox div.iconButton {
	width: 30px; 
	height: 30px; 
	margin-right: 5px;
}

.dashboardArea .layerButtonBox input.inputAnimateDuration {
	width: 20px;
	float: left;
	height: 18px;
	margin-right: 5px;
	margin-top: 4px;
}

.dashboardArea .layerButtonBox input.inputAnimateDuration:read-only {
	background-color: #bbc6cf;
	border: 1px solid #bbc6cf;
}

/*레이어 영역*/
.dashboardArea .layerArea .portletArea .contentViewer.thumnailViewer {
	display : none;
}


/*바스켓 영역*/
.dashboardArea .basketAreaOpenArea {
    width: var(--basketAreaOpenAreaWidth);
    height: 100%;
    background-image: url(../../images/dashboard/portlet/verti_3dot.png);
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
    cursor: pointer;
    box-sizing: border-box;
    border-left: 2px solid rgb(187, 198, 207);
    background-color: #ffffff;
    float: left;
}

.dashboardArea .basketArea .basketSelect {
	width: 228px;
	height: calc( 100% );
	float: left;
}

.dashboardArea .basketArea .basketPortlet {
	position: relative;
}

.dashboardArea .basketArea .basketSelect .scroll-wrapper {
	height: calc( 100% );
}

.dashboardArea .basketArea .portletArea {
	position: relative!important;
	width: 213px!important;
	height: 166px!important;
	border: 2px solid rgb(187, 198, 207);
	border-top: 0px;
}

.dashboardArea .basketArea .portletArea.animateTemp {
	border: 2px solid rgba(187, 198, 207, 0);
	border-top: 0px;
}

.dashboardArea .basketArea .portletArea .contentViewer.workBookViewer {
	position: fixed!important;
	top:-10000px!important;
	left:-10000px!important;
	width: 500px!important;
    height: 500px!important;
}

.dashboardArea .basketArea .portletArea .dashboardButtonArea .dashboardButtonBox .iconButton.btnPortletReplay
, .dashboardArea .basketArea .portletArea .dashboardButtonArea .dashboardButtonBox .iconButton.btnPortletExport
, .dashboardArea .basketArea .portletArea .dashboardButtonArea .dashboardButtonBox .iconButton.btnPortletMaximize
, .dashboardArea .basketArea .portletArea .dashboardButtonArea .dashboardButtonBox .iconButton.btnPortletMinimize {
	display:none;
}

.dashboardArea .basketArea .portletArea .portletTitle>span { 
    width: calc(100% - 45px - 10px);
}


.dashboardArea .basketArea .portletPlusArea {
	width:217px;
	display:none;
	box-sizing: border-box;
}

.dashboardArea.plusMode .basketArea .portletPlusArea {
	/*
	height:30px;
	*/
	height:10px;
	
	display:block;

	border-left: 2px solid rgb(187, 198, 207);
    border-right: 2px solid rgb(187, 198, 207);
	/*
	border-top: 2px solid rgba(187, 198, 207, 0);
    border-bottom: 2px solid rgba(187, 198, 207, 0);
    
    background-image: url(../../images/dashboard/portlet/portlet_add.png);
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
    background-size: contain;
    */    
}

.dashboardArea.plusMode .basketArea .portletPlusArea:last-child {
	height:166px;
	
	display:block;

	border-left: 2px solid rgb(187, 198, 207);
    border-right: 2px solid rgb(187, 198, 207);
	border-top: 2px solid rgba(187, 198, 207, 0);
    border-bottom: 2px solid rgba(187, 198, 207);
    
    background-image: url(../../images/dashboard/portlet/portlet_add.png);
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
    background-size: 60px;   
}

.dashboardArea.plusMode .basketArea .portletPlusArea:hover {
	height:40px;
	border: 2px solid #0000ab;
	
	background-image: url(../../images/dashboard/portlet/portlet_add_hover.png);
	
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
    background-size: contain;	
}

.dashboardArea.plusMode .basketArea .portletPlusArea:last-child:hover {
	height:166px;
	
    background-size: 60px;   
}


/*최대화 모드 영역*/
.dashboardArea.maximize .layerArea .portletArea .portletTitle .dashboardButtonBox div.iconButton.btnPortletMaximize 
	, .dashboardArea.maximize .layerArea .portletArea .portletTitle .dashboardButtonBox div.iconButton.btnPortletClose
	, .dashboardArea.maximize .basketArea .portletArea .portletTitle .dashboardButtonBox div.iconButton.btnPortletClose {
	
	display:none;
}

.dashboardArea.maximize .layerArea .portletArea .portletTitle .dashboardButtonBox div.iconButton.btnPortletMinimize {
	display:block;
}

.dashboardArea.maximize .layerSelectOpenArea
	, .dashboardArea.maximize .workbookSelectArea 
	, .dashboardArea.maximize .bottomButtonArea 
{
	display:none;
}

.dashboardArea.maximize .mainDashboardArea {
    height: calc( 100% - 4px );
    border-top: 2px solid rgb(187, 198, 207);
    top:0px;
}

.dashboardArea.maximize .layerArea {
    height: calc( 100% );
}

.dashboardArea.maximize .basketArea {
    height: calc(100% - 4px);
    border-top: 2px solid rgb(187, 198, 207);
    top:0px
}

.dashboardArea.maximize:not(.noSlideShow) .layerButtonBox {
	display:block;
}

/*슬라이드쇼 모드 영역*/
.dashboardArea.slideShow .layerArea .portletArea .portletTitle .dashboardButtonBox div.iconButton.btnPortletMaximize 
	, .dashboardArea.slideShow .layerArea .portletArea .portletTitle .dashboardButtonBox div.iconButton.btnPortletClose
	, .dashboardArea.slideShow .layerArea .portletArea .portletTitle .dashboardButtonBox div.iconButton.btnPortletMinimize {
	
	display:none;
}

.dashboardArea.fullScreen {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100vw;
    height: 100vh;
    background-color: #bbc6cf;
}

.dashboardArea.slideShow .mainDashboardArea {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 100;
    margin-left: 0px;
    float: unset;
}


/*애니메이션 동작중 설정*/
.dashboardArea .portletArea.animate {
	position: absolute!important;
	z-index: 100;
}

.dashboardArea .portletArea.animate .portletTitle>span { 
    width: calc(100% - 10px);
}

.dashboardArea .portletArea.animate .portletTitle .dashboardButtonArea {
	display:none;
}

.dashboardArea .portletArea.animate.viewImg .contentViewer.thumnailViewer {
	display : block;
}

.dashboardArea .portletArea.animate.viewImg .contentViewer.workBookViewer {
	position: fixed!important;
	top:-10000px!important;
	left:-10000px!important;
	width: 500px!important;
    height: 500px!important;
}

.dashboardArea .portletArea.animate.viewContent .contentViewer.thumnailViewer {
	display : none;
}

.dashboardArea .portletArea.animate.viewContent .contentViewer.workBookViewer {
}


/*폴더 보고서 영역*/
.dashboardArea .workbookSelectArea .workbookSelectOpenArea{
	width: 100%;
    height: var(--workbookSelectOpenAreaHeight);
    background-image: url(../../images/dashboard/portlet/horiz_3dot.png);
    background-repeat: no-repeat;
    background-position-x: center;
    background-position-y: center;
    cursor: pointer;
    position: absolute;
    top: 0px;    
}


/* 비어있는 포틀릿 삭제대기 */
.dashboardArea > .portletArea {
	top:-10000px;
	left:-10000px;
	width: 500px;
    height: 500px;
}

.dashboardArea > .portletArea .contentViewer.thumnailViewer {
	display : none;
}


/*레이어 선택박스*/
.dashboardArea .layerSelectOpenArea {
	width: 100%;
	height: var(--layerSelectOpenAreaHeight);
	background-image: url(../../images/dashboard/portlet/horiz_3dot.png);
	background-repeat: no-repeat;
	background-position-x: center;
	background-position-y: center;
	cursor: pointer;
	box-sizing: border-box;
	border-bottom: 2px solid rgb(187, 198, 207);	
	/*background-color: #DAE7F2;*/
	background-color: #ffffff;	
    position: absolute;
    top: 0px;	
}

.dashboardArea .layerSelectOpenArea.layerSelectClose {
	position:absolute; 
	bottom:0px;
	top:unset;	
}


.dashboardArea .layerSelectArea {
	width: 100%;
	height: calc( 80px + var(--layerSelectOpenAreaHeight) - 2px) ;
	position: absolute;
	left: 0px;
	top: 0px;
	z-index: 100;
	box-sizing: border-box;
	/*background-color: #DAE7F2;*/
	background-color: #ffffff;
}

.dashboardArea .layerSelectArea .layerSelect {
	background-image: url(../../images/dashboard/portlet/layers.png);
	background-repeat: no-repeat;
	background-size: 400px 333px;
	width: 66px;
	height: 66px;
	display: inline-block;
	cursor: pointer;
    margin-left: 5px;
    margin-right: 5px;
    margin-top: 5px;
}

.dashboardArea .layerSelectArea .layerSelect:not(.select):hover {background-image: url(../../images/dashboard/portlet/layers_hover.png); }
.dashboardArea .layerSelectArea .layerSelect.select {background-image: url(../../images/dashboard/portlet/layers_select.png); }

.dashboardArea .layerSelectArea .layerSelect.layer_1_1 {background-position : 0px 0px;}
.dashboardArea .layerSelectArea .layerSelect.layer_2_1 {background-position : -67px 0px;}
.dashboardArea .layerSelectArea .layerSelect.layer_1_2 {background-position : -134px 0px;}
.dashboardArea .layerSelectArea .layerSelect.layer_2_2_1 {background-position : -201px 0px;}
.dashboardArea .layerSelectArea .layerSelect.layer_2_2_2 {background-position : -267px 0px;}
.dashboardArea .layerSelectArea .layerSelect.layer_2_2_3 {background-position : -334px 0px;}

.dashboardArea .layerSelectArea .layerSelect.layer_2_2_4 {background-position : 0px -67px;}
.dashboardArea .layerSelectArea .layerSelect.layer_2_2_5 {background-position : -67px -67px;}
.dashboardArea .layerSelectArea .layerSelect.layer_3_2_1 {background-position : -134px -67px;}
.dashboardArea .layerSelectArea .layerSelect.layer_3_2_2 {background-position : -201px -67px;}
.dashboardArea .layerSelectArea .layerSelect.layer_2_3_1 {background-position : -267px -67px;}
.dashboardArea .layerSelectArea .layerSelect.layer_2_3_2 {background-position : -334px -67px;}

.dashboardArea .layerSelectArea .layerSelect.layer_3_3_1 {background-position : 0px -134px;}
.dashboardArea .layerSelectArea .layerSelect.layer_3_3_2 {background-position : -67px -134px;}
.dashboardArea .layerSelectArea .layerSelect.layer_3_3_3 {background-position : -134px -134px;}
.dashboardArea .layerSelectArea .layerSelect.layer_3_3_4 {background-position : -201px -134px;}
.dashboardArea .layerSelectArea .layerSelect.layer_3_3_5 {background-position : -267px -134px;}
.dashboardArea .layerSelectArea .layerSelect.layer_3_3_6 {background-position : -334px -134px;}

.dashboardArea .layerSelectArea .layerSelect.layer_3_3_7 {background-position : 0px -200px;}
.dashboardArea .layerSelectArea .layerSelect.layer_3_3_8 {background-position : -67px -200px;}
.dashboardArea .layerSelectArea .layerSelect.layer_3_3_9 {background-position : -134px -200px;}
.dashboardArea .layerSelectArea .layerSelect.layer_3_3_10 {background-position : -201px -200px;}
.dashboardArea .layerSelectArea .layerSelect.layer_3_3_11 {background-position : -267px -200px;}

.dashboardArea .layerSelectArea .layerSelect.layer_3_2_3 {background-position : 0px -267px;}
.dashboardArea .layerSelectArea .layerSelect.layer_2_3_3 {background-position : -67px -267px;}

.dashboardArea.dragMode {
	/*cursor:url(../../images/dashboard/portlet/portlet_move.png) 51 51, move*/
	cursor:move
}

.dashboardArea .dragDropThumbnail {
	position: absolute;
	width : 160px;
	height : 120px;
	
	object-fit: fill;
    
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    user-drag: none;
    	
    border: 1px solid #bbc6cf;
    border-radius: 10%;
    opacity: 0.7;    
}

.maxContent {width: max-content;}

/*슬라이드쇼*/
.dashboardArea .dashboardButtonBox div.iconButton.stopIcon { display:none; }

.dashboardArea.slideShowPlay .dashboardButtonBox div.iconButton.stopIcon { display:block; }
.dashboardArea.slideShowPlay .dashboardButtonBox div.iconButton.playIcon { display:none; }

.dashboardArea.slideShowPlay .workbookSelectArea {
    position: fixed;
    top: -10000px;
    left: -10000px;
}

.dashboardArea.slideShowPlay .basketArea {
    position: fixed;
    top: -10000px;
    left: -10000px;
}

.dashboardArea.slideShowPlay .layerSelectOpenArea, .dashboardArea.slideShowPlay .layerSelectArea, .dashboardArea.slideShowPlay .bottomButtonArea { display:none }
.dashboardArea.slideShowPlay .layerButtonBox { display: block; }

.dashboardArea.slideShowPlay .mainDashboardArea {
    width: calc(100%);
    height: calc(100%);
    top: 0px;
}

.dashboardArea.slideShowPlay .layerArea { height: calc(100%); }

.dashboardArea.slideShowPlay .portletArea .portletTitle {display:none;}
.dashboardArea.slideShowPlay .portletArea .contentViewer { height: 100%; }

.dashboardArea.slideShowPlay .layerArea .portletArea .portletTitle .dashboardButtonBox div.iconButton.btnPortletReplay
	, .dashboardArea.slideShowPlay .layerArea .portletArea .portletTitle .dashboardButtonBox div.iconButton.btnPortletExport
	, .dashboardArea.slideShowPlay .layerArea .portletArea .portletTitle .dashboardButtonBox div.iconButton.btnPortletMaximize
	, .dashboardArea.slideShowPlay .layerArea .portletArea .portletTitle .dashboardButtonBox div.iconButton.btnPortletMinimize
	, .dashboardArea.slideShowPlay .layerArea .portletArea .portletTitle .dashboardButtonBox div.iconButton.btnPortletClose {
	display:none;
}

/*전체화면*/

.dashboardArea .dashboardButtonBox div.iconButton.exitFullScreenIcon { display : none }

.dashboardArea.fullScreen .layerButtonBox { /*display : block*/ }
.dashboardArea.fullScreen .dashboardButtonBox div.iconButton.exitFullScreenIcon { display : block }