html {
	overflow-y : hidden;
	overflow-x : hidden;
}
			
span.loading {
	width: 100vw;
	height: 100vh;
	transition: all 0.3s;
	background-color: #fff;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
}

div.loading_gif {
	width: 30px;
	height: 30px;
	background-color: #fff;
	z-index: 9999;
	background-image:url(/img/loading.gif);
        background-repeat:  no-repeat;
	background-position: center;
	background-size:140px; 
}


.loaded {
	opacity: 0;
	visibility: hidden;
}

.base_color {
	background: #4e67b0;
	background-color: #4e67b0;
	color: #ffffff;
}

.margin {
	margin: 5px;
}

.margin-10 {
	margin: 10px;
}

.margin-20 {
	margin: 20px;
}


.pass_code {
	width:100px; 
	height:150px; 
	font-weight:bold; 
	text-align: center;
	font-size: 2em;
}

.border {
	border: 1px solid #ddd;
	border-radius: 2px;
}
.edit {
	cursor: pointer;
}
.edit:hover{
	color: #999999;
//	text-decoration:underline;
}

.mouse:hover {
	background: #FFFFEE;
	cursor: pointer;
}



.v-enter {
	opacity: 0;
}
.v-enter-to {
	opacity: 1;
}
.v-enter-active {
	transition: all 300ms;
}

.v-leave {
  opacity: 1;
}
.v-leave-to {
	opacity: 0;
}
.v-leave-active {
	transition: all 300ms;
}
.v-move {
  transition: all 300ms;
}
.v-leave-active {
  /* 移動のトランジションをさせる場合は非表示アニメーション中に position: absoluteを指定しないと正しく動作しない */
  position: absolute;
}

.swal2-popup {
	color: #ffffff;
}

#slidesearch {
	z-index: 1;
	position: fixed;
	top: 0;
	left: 0px;
	width: 350px;
	color: #666;
	font-size: 16px;
	padding: 0 20px 0 0;
	background: #DDF;
	height:100%;
}
#slidesearch .nav-icon {
	position: absolute;
	right: 0px;
	width: 20px;
	background: #DDF;
}
#slidesearch .nav-icon-side {
	position: absolute;
	right: 10px;
	top: 40%;
}
#slidesearch .slide-inner {
	overflow: auto;
	overflow-x: hidden;
	background: #FFF;
	height:100%;
}
#slidesearch .slide-inner section {
	padding: 20px;
	background: #FFF;
}

.box22{
	padding: 0.5em 1em;
	margin: 1em 0;
	background: #f4f4f4;
	border-left: solid 6px #DDF;
	box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.33);
}
.box22 p {
    margin: 0; 
    padding: 0;
}

.box30 {
    margin: 2em 0;
    background: #f1f1f1;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.22);
}
.box30 .box-title {
    font-size: 1em;
    background: #ddf;
    padding: 4px;
    color: #333;
    letter-spacing: 0.05em;
    font-weight:bold;
}
.box30 p {
    padding: 15px 20px;
    margin: 0;
}


.menu {
	width: 50px;
}
.menu_icon_active {
	background: #ddd;
	border-radius: 10px;
}

.menu_icon_select {
	cursor: pointer;
	transition: 0.5s;
	width: 40px;
	height: 40px;
}
.menu_icon_select i {
	margin-top:20px;
}

.menu_icon_select:hover{
	background: #eee;
	border-radius: 10px;
}
.menu_icon_select:hover i{
	transform: scale(1.1);
}
.font_bolder {
	font-weight: bolder;
}
.font_bolder {
	font-weight: bolder;
}
.font_bold {
	font-weight: bold;
}

.radius {
	border-radius: 10px;
}

.box1 {
    padding: 10px;
	border: 2px solid #77F;
	width: auto;
	height: auto;
	background-color: #FFF;
	border-color: #0497E4;
	border-radius: 10px;
}

.box26 {
    position: relative;
    margin: 0 0;
    padding: 0.5em 1em;
    border: 2px solid #0497E4;
    border-radius: 4px;
    
}
.box26 .box-title {
    position: absolute;
    display: inline-block;
    top: -7px;
    left: 10px;
    padding: 0 9px;
    line-height: 1;
    font-size: 10px;
    background: #FFF;
    color: #333;
    font-weight: bold;
}
.box26 p {
    margin: 0; 
    padding: 0;
}

.swal2-title {
    font-size: 1.5em;
}

.frame {
    width: 100%;
    background-color: #fff;
    overflow-x: hidden;
    overflow-y: visible;
}

.selected {
    background: #eef;
}

.balloon_editor {
    border: 1px solid #ccf !important;
}

div.loading {
	width: 100%;
	height: 50%;
	transition: all 0.3s;
	background-color: #FFF;
	z-index: 9999;
        background-image:url(/img/wait.gif);
        background-repeat:  no-repeat;
	background-position: center;
	background-size:300px; 
        
}