body {


}
#outer
	{
	width:910px;
	height:900px;
	background-color: white;
	/* border-color: gray; */
	/* border-style: solid; */
	/* order-width: 1px; */
	/*margin-left:50px;*/
	/*margin-left:10%;*/
	/*margin-right:10%;*/
	margin:0 auto 0 auto;	
    float:left;
	}
#titol
    {
	width:900px;
	height:28px;
	background-color: beige;
	border-color:  gray;
	border-style: solid;
	border-width: 0px;
    margin:0 auto 0 auto;	
    float:left;
	margin-top:0px;
    text-align: center;
    text-size-adjust: auto;
    }
#head
    {
	width:900px;
	height:60px;
	background-color: beige;
	border-color:  gray;
	border-style: solid;
	border-width: 1px;
    margin:0 auto 0 auto;	
    float:left;
    
    }

.head-box {
	padding-top: 0px;
	width: auto;
	height: 40px;
	border: outset;
	/*border-width: 1px;*/
	border-radius: 5px;
	text-align: center;
	vertical-align: initial;
	/*background-image: url(Images/HeadText.png);*/
	background-repeat: no-repeat;
	background-position: right;
	background-size: auto;
	box-shadow: 5px 5px 3px gray;
	display: block;
}

#body
    {
	width:900px;
	height:800px;
	background-color: beige;
	border-color:  gray;
	border-style: solid;
	border-width: 1px;
    margin:0 auto 0 auto;	
    float:left;
    }

.body-box {
	margin-top: 5px;
	width: auto;
	height: 800px;
	border-width: 0px;
	background-image: url(../Images/BackImage3.png);
	background-repeat: no-repeat;
	background-position: center;
	display: block;
	box-shadow: 5px 5px 3px gray;
}

.body-menu {
	margin-top: 10px;
	width: auto;
	height: 700px;
	border-width: 0px;
	background-image: url(../Images/BackImage.png);
	background-repeat: no-repeat;
	background-position: center;
	display: block;
	box-shadow: 5px 5px 3px gray;
	transition: 0.4s;
}

.body-menu1 {
	margin-top: 10px;
	margin-left: 0px;
	width: auto;
	height: 700px;
	border-width: 0px;
	background-image: url(../Images/BackImage.png);
	background-repeat: no-repeat;
	background-position: center;
	display: block;
	box-shadow: 5px 5px 3px gray;
}

.v7head-box {
	margin-left: 10px;
	width: 100px;
	height: 700px;
	border-style: outset;
	border-width: 1px;
	background-color: powderblue;
	text-align: center;
	vertical-align: top;
	align-content:center;
	float: left;
	position: relative;
	/*background-repeat: no-repeat;*/
	/**background-position: center;*/
	display: block;
	box-shadow: 5px 5px 3px gray;
}

.v7body-box {
	position:fixed;
	margin-left: 20px;
	margin-top: 10px;
	width: 610px;
	height: 360px;
	border-style: outset;
	border-width: 1px;
	background-color: white;
	text-align: left;
	vertical-align: middle;
	/*position: absolute;*/
	/*top: 50px;*/
	/*animation-name: fade-animation;*/
	/*animation-duration: 0.5s;*/
	border-radius: 10px 10px 30px 30px;
	/**background-position: center;*/
	display:none;
	box-shadow: 10px 10px 5px gray;
	z-index: 100;
}
.mnt-box {
	background-color: lavender;
	border-style: outset;
	border-width: 1px;
	border-radius: 10px 10px 0px 0px;
	box-shadow: 10px 10px 5px gray;
}
.print-box {
	margin: 10px auto;
	background-color:lavender;
	border-style: outset;
	border-width: 1px;
	border-radius: 10px 10px 20px 20px;
	box-shadow: 10px 10px 5px gray;
}
.blink-button {
	animation-name: fade-animation;
	animation-duration: 0s;
	animation-iteration-count:infinite;
}

@keyframes fade-animation {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}

}


.WebSyusekiMenu-box {
	margin: auto;
	width: 800px;
	height: 400px;
	border-style: outset;
	border-width: 1px;
	background-color: powderblue;
	text-align: left;
	vertical-align: middle;
	/*background-repeat: no-repeat;*/
	/**background-position: center;*/
	display: block;
	box-shadow: 5px 5px 3px gray;
}

.LoginBox {
	/*margin-top:20px;*/
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left: -200px;
	margin-top: -250px;
	height: 350px;
	width: 400px;
	align-items: center;
	text-align: center;
	/*background-image: url(~/Images/BackImage.png);*/
	background-repeat: no-repeat;
	background-position: center;
	border: outset;
	background: #b9ebd5;
	border-radius: 10px;
	border-radius: 5px 5px 10px 10px;
	display: block;
	box-shadow: 10px 10px 5px gray;
}

.addlogin {
	padding: 0px;
	margin: auto;
	height: 400px;
	width: 350px;
	text-align: center;
	align-items: center;
	border: outset;
	border-radius: 10px;
	background: azure;
	display: none;
	box-shadow: 10px 10px 5px gray;
}

.InfomationBox {
	/*margin-top:20px;*/
	font-size:small;
	position: absolute;
	top: 40%;
	left: 50%;
	margin-left: -300px;
	margin-top: -200px;
	height: 500px;
	width: 600px;
	align-items: center;
	text-align: center;
	border: outset;
	background: #b9ebd5;
	border-radius: 10px;
	display: block;
	box-shadow: 10px 10px 5px gray;
}

#CtlMenu {
	width: 730px;
	height: 50px;
	position: absolute;
	top: 30px;
	left: 180px;
	background-color: white;
	border-color: gray;
	border-style: solid;
	border-width: 1px;
	margin: 0 auto 0 auto;
	float: left;
	opacity: 0.9;
	box-shadow: 5px 5px;
	display: none;
}

.Kojinimg {
	width: 350px;
	height:600px;
	position: absolute;
	top: 130px;
	left: 250px;
	background-color: white;
	border-color: gray;
	border-style: solid;
	border-width: 1px;
	margin: 0 auto 0 auto;
	/*opacity: 0.9;*/
	box-shadow: 5px 5px;
	display: none;
}

.gakuseisho-box {
	margin: auto;
	width: 300px;
	height: 600px;
	border: 1px solid gray;
	border-style: outset;
	display: block;
	box-shadow: 5px 5px;
	border-radius: 10px;
}

.qrCodeImg {
	margin: 10px auto;
	display: block;
	height: 100px;
}
.GakNo-Input-Box {
	width: 250px;
	height: 200px;
	border: solid;
	border-width: 1px;
	border-radius: 10px;
	text-align: left;
	font-size: small;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -80%);
	display: block;
	background-color: azure;
	opacity: 0.95;
	box-shadow: 10px 10px 5px gray;
}

.main-box {
	margin-top: 10px;
	/*margin: 0 auto;*/
	background-color: white;
	/*background-image: url("~/Images/Backimage.png");*/
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain;
	/*opacity: 0.3;*/
	border: 1px solid;
	border-radius: 5px 5px 8px 8px;
	height: 620px;
	box-shadow: 10px 10px 5px gray;
	/*align-content:center;
  align-items:center;*/
}

.DataList {
	width: 800px;
	height: 400px;
	overflow: scroll;
	border: solid;
	border-width: 1px;
	border-radius: 10px;
	text-align: left;
	font-size: 14px;
	position: absolute;
	left: 100px;
	top: 200px;
	display: none;
	background-color: azure;
	opacity: 0.95;
	box-shadow: 10px 10px 5px gray;
}
.SerchBox {
	width: 400px;
	height: 100px;
	overflow: scroll;
	border: solid;
	border-width: 1px;
	border-radius: 10px;
	text-align: left;
	font-size: small;
	position: fixed;
	left: 25%;
	top: 10px;
	display: block;
	background-color: azure;
	opacity: 0.95;
	box-shadow: 10px 10px 5px gray;
}

.tab-box {
	background-color: whitesmoke;
	margin-top: 20px;
	margin-left: auto;
	margin-right: auto;
	width: 800px;
	height: 500px;
	border-radius: 5px 5px 5px 5px;
	/*opacity: 0.9;*/
	display: block;
	box-shadow: 10px 10px 5px gray;
	font-size: smaller;
}

.tab-wrap {
	display: flex;
	flex-wrap: wrap;
}

.tab-label {
	background-color: #cfebdf; /*DarkSlateBlue; /*mediumslateblue;*DarkSlateBlue;*/
	color: black;
	margin-right: 3px;
	padding: 3px 12px;
	order: -1;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
	border-width: 2px;
	border-color: blue;
	box-sizing: border-box;
}

	.tab-label:hover {
		color: blue;
		background-color: lightblue;
		/*Silver;*/
	}

.tab-content {
	width: 100%;
	height: 450px;
	border: solid black 1px;
	background-color: lightblue;
	display: none;
	opacity: 0.9;
	font-size:small;
}
/* アクティブなタブ */
.tab-switch:checked + .tab-label {
	background-color: DarkSlateBlue; /*lightblue;  /*SkyBlue;*/
	color: yellow;
	font: bold;
}

.tab-switch:checked + .tab-label + .tab-content {
	display: block;
	}
/* ラジオボタン非表示 */
.tab-switch {
	display: none;
}
/*table row paint*/
/*tr:hover {
	background-color: beige;
}*/

.main-menu {
	margin-top: 10px;
	margin-left: 5px;
	width: 60px;
	height: 570px;
	align-content: center;
	background-color: #b9ebd5;
	border-style: outset;
	border-radius: 5px 5px 5px 5px;
	box-shadow: 5px 5px 3px gray;
	float: left;
}

.help-menu {
	margin-left: -10px;
	width: 400px;
	height: 650px;
	position: fixed;
	top: 50px;
	left: 100%;
	background-color: ivory;
	border: 1px solid black;
	display: block;
	transition-duration: 0.5s;
	float: right;
	box-shadow: 5px 5px 3px gray;
}

	.help-menu:hover {
		margin-left: -400px;
	}

.menu-box {
	margin-left: -90px;
	width: 100px;
	height: 650px;
	position: fixed;
	top: 50px;
	background-color: #C4C4FF;
	display: block;
	transition-duration: 0.5s;
	float: left;
	box-shadow: 5px 5px 3px gray;
	z-index: 1;
}

	.menu-box:hover {
		margin-left: 0px;
	}


.menu-tate {
	width: 120px;
	height: 675px;
	position: absolute;
	top: 60px;
	background-color: #C4C4FF;
	display: block;
	/*transition-duration: 1s;*/
	float: left;
	box-shadow: 5px 5px 3px gray;
	/*animation-name: fade;
	animation-duration: 1s;
	animation-iteration-count: 1;*/
	font-size:small;
	z-index: 0;
}

@keyframes fade {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}


.help-menu {
	margin-left: -10px;
	width: 100px;
	height: 650px;
	position: fixed;
	top: 50px;
	left: 100%;
	background-color: ivory;
	border: 1px solid black;
	display: block;
	transition-duration: 0.5s;
	float: right;
	box-shadow: 5px 5px 3px gray;
}

	.help-menu:hover {
		margin-left: -100px;
	}

.cmdmenu {
	width: 880px;
	height: 80px;
	position: absolute;
	top: 10px;
	background-color: #C4C4FF;
	display: none;
	float: left;
	box-shadow: 5px 5px 3px gray;
	font-size: small;
	z-index: 0;
}

.download-menu {
	margin-left: 140px; /*-390px;*/
	width: 400px;
	height: 500px;
	position: fixed;
	top: 70px;
	left: 0%;
	background-color: ivory;
	border-top-right-radius: 2px;
	border-bottom-right-radius: 8px;
	border: 1px solid black;
	display: block;
	transition-duration: 0.5s;
	float: right;
	box-shadow: 5px 5px 3px gray;
}

/*	.download-menu:hover {
		margin-left: 0px;
	}
*/



.help-menu-top {
	margin-top:	60px; /*-105px;*/
	width: 750px;
	height: 100px;
	position: fixed;
	top: 0%;
	/* left: 50px; */
	left: 10%;
	background-color: ivory;
	border: 1px solid black;
	display: block;
	transition-duration: 0.5s;
	/*float: right;*/
	box-shadow: 5px 5px 3px gray;
	z-index: 200;
}
.help-menu-top:hover {
	margin-top: -3px;
}

.new-menu {
	/*width: 600px;
	height: 75px;*/
	border: outset;
	background-color: aliceblue;
	float: left;
	position: absolute;
	top: 50px;
	left: 60px;
	z-index: 999;
	border-radius: 10px 10px 10px 10px;
	box-shadow: 5px 5px 3px gray;
}


TextBox {
	font-size:smaller;
}

.Mnubtn {
	width:50px;
	height:50px;
	margin-top: 5px;
	border-style: outset;
}
	.Mnubtn:hover {
		border-style: Inset;
	}


#fullOverlay {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(100, 100, 100, .8);
	z-index: 2147483647;
}
.drag-and-drop {
	cursor: default;
	position: absolute;
	z-index: 1000;
}

.drag {
	z-index: 1001;
}

.menuContainer {
	width: 200px;
	height: 100px;
	background-color: #f2f2f2;
	position: fixed;
	cursor: move;
}

.MessageBox {
	/*position: static;*/ /* absolute;*/
	/*top: 400px;*/
	/*left: 500px;*/
	/*margin-left: -250px;*/
	/*margin-top: 100px;*/
	/*margin-left:200px;*/
	float: left;
	height: 400px;
	width: 860px;
	text-align: center;
	border: outset;
	background: #b9ebd5;
	border-radius: 10px;
	display: block;
	box-shadow: 10px 10px 5px gray;
	z-index: 100;
}

.AppInfoBox {
	float:left;
	height: 400px;
	width: 300px;
	text-align: center;
	border: outset;
	background: #b9ebd5;
	border-radius: 10px;
	display: block;
	box-shadow: 10px 10px 5px gray;
	z-index: 100;
}
.Mnubtn {
	/*width: 50px;
	height: 50px;*/
	margin-top: 0px;
	border-style: none;
}

	.Mnubtn:hover {
		border-style: Inset;
		background-color:azure;
	}