/* inpbox */
.uic-inpbox,
.uic-inpbox select{
	font-size:16px;
	line-height:1;
}
.uic-inpbox{
	display:table-cell;
	padding:0 10px;
	padding-top:1px;
	height:36px;
	border:1px solid #ccc;
	text-align:left;
	vertical-align:middle;
	overflow:hidden;
}
@media (min-width:769px){
	.uic-inpbox{
		font-family:"Menlo","Consolas","Courier New";
	}
}
/* disabled */
.uic-disable{
	visibility:hidden;
}
.scopeXYZ .sbc-control{
	color:#444;
	background:#fff;
	border-radius:50%;
	outline:none;
	user-select:none;
	cursor:pointer;
}
@media (hover:hover){
	.scopeXYZ .sbc-control:hover{
		background:#eee;
	}
}
.scopeXYZ .sbc-control:active{
	background:#ddd;
}
.scopeXYZ .sbc-control.sbc-focus{
	box-shadow:0 0 3px 1px #337ab7;
}
.scopeXYZ .sbc-svg{
	position:absolute;
	top:20%;
	bottom:20%;
	left:20%;
	right:20%;
}
/* control */
.scopeXYZ .fvc-control{
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
}
.scopeXYZ .fvc-control.fvc-hide{
	display:none;
}
/* checkboard */
.scopeXYZ .fvc-checkboard{
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	/* checkerboard */
	background-color:white;
	background-image:linear-gradient(45deg, #eee 25%, transparent 25%, transparent 75%, #eee 75%, #eee),
		linear-gradient(45deg, #eee 25%, transparent 25%, transparent 75%, #eee 75%, #eee);
	background-size:16px 16px;
	background-position:0 0, 8px 8px;
	/* border */
	border:4px solid #eee;
}
/* fileboard */
.scopeXYZ .fvc-fileboard{
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	background-size:contain;
	background-position:center;
	background-repeat:no-repeat;
	border:4px solid transparent;
}
/* close */
.scopeXYZ .fvc-close{
	position:absolute;
	top:10px;
	right:10px;
	width:50px;
	height:50px;
}
.scopeXYZ .fvc-control.fvc-disable .fvc-close{
	visibility:hidden;
}
/* control */
.scopeXYZ .dac-control{
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	margin:0;
	padding:0;
	text-align:center;
	font-size:24px;
	color:#666;
	border:4px dashed #666;
	background:white;
}
.scopeXYZ .dac-control.dac-hide{
	display:none;
}
.scopeXYZ .dac-control.dac-dragover{
	color:#00c;
	border-color:#00c;
	background-color:#eef;
}
/* message */
.scopeXYZ .dac-message{
	display:inline-block;
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	pointer-events:none;
}
.scopeXYZ .dac-control.dac-disable .dac-message{
	opacity:0.5;
}
/* select */
.scopeXYZ .dac-select{
	position:absolute;
	bottom:10px;
	right:10px;
	width:50px;
	height:50px;
}
.scopeXYZ .dac-control.dac-dragover .dac-select{
	pointer-events:none;
	opacity:0.5;
}
.scopeXYZ .dac-control.dac-disable .dac-select{
	visibility:hidden;
}
/* fileinput */
.scopeXYZ .dac-fileinput{
	position:absolute;
	top:-100px;
	left:-100px;
	width:1000px;
	height:1000px;
	background:rgba(0,0,0,0.5);
	opacity:0;
	cursor:pointer;
}
/* control */
.scopeXYZ .pbc-control{
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	background:rgba(0,0,0,0);
	overflow:hidden;
}
.scopeXYZ .pbc-control.pbc-hide{
	display:none;
}
/* bar */
.scopeXYZ .pbc-bar{
	position:absolute;
	top:50%;
	left:0;
	right:0;
	transform:translate(0,-50%);
	background:linear-gradient(to right,
		rgba(0,0,0,0.2) 0%,
		rgba(0,0,0,0.6) 50%,
		rgba(0,0,0,0.2) 100%);
	padding:2px 0;
	text-align:center;
	overflow:hidden;
}
/* progress */
.scopeXYZ .pbc-progress{
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	width:0;
	background:rgba(0,0,0,0.5);
}
/* text */
.scopeXYZ .pbc-text{
	display:inline-block;
	position:relative;
	top:2px;
	color:white;
	line-height:3;
	font-family:"Georgia";
	font-size:24px;
	letter-spacing:0.15em;
	text-shadow:
		0 0 1px white,
		0 0 3px white,
		0 0 8px white;
	vertical-align:middle;
}
/* cancel */
.scopeXYZ .pbc-cancel{
	display:table-cell;
	position:absolute;
	bottom:30px;
	left:50%;
	transform:translateX(-50%);
	user-select:none;
	cursor:pointer;
	overflow:hidden;
}
.scopeXYZ .pbc-cancel:active{
	bottom:29px;
}
.scopeXYZ .pbc-cancel-bg{
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	width:100%;
	padding-bottom:40%;
	background:rgba(0,0,0,0.4);
	border-radius:50px;
}
.scopeXYZ .pbc-cancel-txt{
	position:relative;
	top:1px;
	padding:15px 20px;
	color:#eee;
	font-size:11px;
	line-height:1;
	letter-spacing:0.1em;
}
/* control */
.scopeXYZ .abc-control{
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	background:rgba(0,0,0,0.4);
	overflow:hidden;
	cursor:pointer;
}
.scopeXYZ .abc-control.abc-hide{
	display:none;
}
/* box */
.scopeXYZ .abc-box{
	position:absolute;
	top:0%;
	left:0;
	right:0;
	transform:translate(0,-100%);
	color:white;
	background:rgba(0,0,0,0.75);
	text-align:center;
	overflow:hidden;
}
.scopeXYZ .abc-box-black{
	background:rgba(0,0,0,0.75);
}
.scopeXYZ .abc-box-white{
	color:black;
	background:rgba(255,255,255,0.75);
}
.scopeXYZ .abc-box-red{
	background:rgba(128,0,0,0.75);
}
.scopeXYZ .abc-box-green{
	background:rgba(0,128,0,0.75);
}
.scopeXYZ .abc-box-blue{
	background:rgba(128,128,255,0.75);
}
.scopeXYZ .abc-control .abc-box{
	animation-name:kf-abc-box;
	animation-iteration-count:infinite;
	animation-timing-function:linear;
	animation-duration:8s;
}
.scopeXYZ .abc-control.abc-hide .abc-box{
	animation-name:none;
}
@keyframes kf-abc-box{
	100%{
		top:100%;
		transform:translate(0,0);
	}
}
/* radiate */
.scopeXYZ .abc-radiate{
	position:absolute;
	bottom:0%;
	left:0%;
	transform:translate(-50%,-50%);
	width:10px;
	height:10px;
	border-radius:50%;
	box-shadow:0 0 10px 3px white;
}
.scopeXYZ .abc-control .abc-radiate{
	animation-name:kf-abc-radiate;
	animation-iteration-count:infinite;
	animation-timing-function:linear;
	animation-duration:5s;
}
.scopeXYZ .abc-control.abc-display .abc-radiate{
	animation-name:none;
}
@keyframes kf-abc-radiate{
	0%{
		transform:translate(-50%,-50%) scale(1);
		opacity:0;
	}
	30%{
		opacity:1;
	}
	100%{
		transform:translate(-50%,-50%) scale(100);
		opacity:0;
	}
}
/* tbl */
.scopeXYZ .abc-tbl{
	display:table;
	width:100%;
}
.scopeXYZ .abc-side,
.scopeXYZ .abc-msg{
	display:table-cell;
	vertical-align:middle;
}
.scopeXYZ .abc-side{
	width:50px;
	text-align:center;
}
.scopeXYZ .abc-msg{
	padding:12px 18px;
	padding-top:13px;
	font-size:16px;
	line-height:1.5;
	letter-spacing:0.05em;
	text-align:left;
}
/* close */
.scopeXYZ .abc-close{
	display:inline-block;
	position:relative;
	top:1px;
	width:32px;
	height:32px;
	vertical-align:middle;
}
.scopeXYZ .wsc-control{
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	background:rgba(0,0,0,0.3);
}
.scopeXYZ .wsc-hide{
	display:none;
}
.scopeXYZ .wsc-center{
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	width:50px;
	height:50px;
	line-height:50px;
}
.scopeXYZ .wsc-spin,
.scopeXYZ .wsc-radiate{
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	background:rgba(255,255,255,0.5);
	border-radius:50%;
}
.scopeXYZ .wsc-spin{
	font-size:24px;
	text-align:center;
	text-shadow:0 0 5px black;
}
.scopeXYZ .wsc-radiate{
}
.scopeXYZ .wsc-spin:before{
	content:"⌛";
}
.scopeXYZ .wsc-control .wsc-spin{
	animation-name:kf-wsc-spin;
	animation-iteration-count:infinite;
	animation-timing-function:linear;
	animation-duration:3s;
}
.scopeXYZ .wsc-control.wsc-hide .wsc-spin{
	animation-name:none;
}
@keyframes kf-wsc-spin{
	0% {
		transform:rotateZ(-60deg);
	}
	100% {
		transform:rotateZ(300deg);
	}
}
.scopeXYZ .wsc-control .wsc-radiate{
	animation-name:kf-wsc-radiate;
	animation-iteration-count:infinite;
	animation-timing-function:linear;
	animation-duration:2s;
}
.scopeXYZ .wsc-control.wsc-hide .wsc-radiate{
	animation-name:none;
}
@keyframes kf-wsc-radiate{
	100% {
		opacity:0;
		transform:scale(2);
	}
}
/* control */
.scopeXYZ .upic-control{
	position:relative;
	height:300px;
	margin:10px 0;
}