@charset "UTF-8";

/* 寸法方法の強制
----------------------------------------------- */
*,
*::before,
*::after {
	box-sizing: border-box;
}

/* font
----------------------------------------------- */
body {
	touch-action: manipulation; /* パンおよびズームのジェスチャーは有効にしますが、ダブルタップでのズームなど、標準外の追加的なジェスチャーを無効します。 */	
	/* ○×などの文字が小さくなってしまう問題への対処としてフォントを指定 */
/*	font-family: 'Quicksand', sans-serif; */
/*	font-family: "メイリオ", "MS Pゴシック", "osaka"; */
/*	font-family: 'Zen Kaku Gothic New', sans-serif;
	font-family: 'Zen Kaku Gothic New';
	font-family: 'Noto Sans JP', sans-serif;
	font-family: 'M PLUS 1p', sans-serif;
*/
	font-family: 'Noto Sans JP', sans-serif;
}

#main_frame {
    /* margin: 5px 20px 10px 20px; */
    /* box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12); */
	margin: 0;
	box-shadow: none;
}

h1, h2, h3, h4, h5, h6 {
	/* font-family: "Dela Gothic One", serif; */
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: bold;
}
h1 {
	border-left: 1px solid #333;
}

th {
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: bold;
}

#navbar {
	border-bottom: 1px solid #333;
	/* border: none; */
	/* border-bottom: 1px dashed #aaa; */
	padding-top:    8px;
	padding-bottom: 8px;
}
#navbar .menu {
	/* vertical-align: bottom; */
}
#navbar .menu > * {
	vertical-align: bottom;
}
#navbar .menu .app_name {
	/* padding-bottom: 15px; */
	/* border: 1px solid #333; */
}

#navbar .menu .app_name a {
	font-size: 18px;
	font-size: 16px;
	/* padding-bottom: 15px; */
	/* vertical-align: bottom; */
	display: inline-block;
}


.pack_btns a.btn,
.btn,
button.s_btn {
	/* border: 1px solid #333;
	border: 1px solid #aaa;
	color: #39c5bb;
	border: 1px solid #39c5bb; */
	/* transition-duration: 0; */
	font-family: 'Noto Sans JP', sans-serif;
	font-family: 'Poppins', sans-serif;
	font-weight: bold;
	font-size: 13px;
	border: 1px dashed #333;
	padding: 8px 10px 7px;
	/* transition: none; */
}

.pack_btns a.btn:hover,
.btn:hover, 
button.s_btn:hover {
	/* border: 1px solid #777; */
	/* box-shadow: 0px 0px 5px rgba(255, 0, 128, 0.52); */
	border: 1px solid #ff0080;
	border: 1px solid #0080fe;
	/* box-shadow: 0px 0px 5px rgba(255, 0, 128, 0.8); */
	/* color: #ff0080; */

	/* border: 1px solid #333; */
	/* color: #333; */
	/* color: #39c5bb; */
}

.pack_btns {
	border: 1px solid #f0f0f0;
}

.tabs a {
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: bold;
}

.tabs {
	border-bottom: 1px solid #333;
}
.tabs .tab.now { 
	border-left:  1px solid #333;
	border-right: 1px solid #333;
	border-top:   1px solid #333;
}
.tabs .tab:hover {
	/* border-bottom: 1px solid #ff0080; */
	color: #ff0080;
	border-left:  1px solid #ff0080;
	border-right: 1px solid #ff0080;
	border-top:   1px solid #ff0080;
	border-bottom: 1px solid transparent;

}
.tabs .tab.now:hover { 
}

#footer {
	border-top: 1px solid #333;
	background-color: #fff;
	color: #333;
}

#footer * {
	background-color: #fff;
	color: #333 !important;
}

.cmd_bar {
	background-color: #fff;
	color: #333;
	border-top:  2px solid #333;
	border-left: 2px solid #333;
	display: none;
}
.cmd_bar * {
	background-color: #fff;
	color: #333 !important;
}

.msg {
	/* border: 1px solid #39c5bb;
	border: 1px solid #333;
	border: 1px dashed #333;
	border: 1px solid #aaa; */
	/* background-color: #fff; */
}

.toast {
	/* margin: 70px 20px; */
	/* border: 3px solid #333; */
	border: 3px solid #fff;
	/* background-color: #c2f5f1; */
	/* background-color: #fafafa; */
	/* color: #333; */
	box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.52);
	box-shadow: 1px 1px 5px rgba(64, 128, 128, 0.52);
}

.exp {
	/* border: 1px solid #aaa;
	border: 1px solid #333;
	color: #333;
	padding: 9px 8px; */
	border-radius: 0;
}

.togglen.show { 
	border: 1px solid #ff0080;
	color: #ff0080;
}

input[type="file"]:hover {
	background-color: #f0f0f0;
	border: 2px dashed #ff0080;
}

.pager a {
	border: 1px solid #333;
	background-color: #333;
	color: #fff;
	/* border: 2px solid #333; */
	border-radius: 0;
}
.msg {
	border: 2px solid #333;
	border-radius: 8px;
	font-size: 15px;
	font-family: 'Noto Sans JP', sans-serif;
}

.warn {
	color: #32cd32;
}
.err {
	color: #ff0080;
	/* color: #008000; */
/*	border-left: 1px solid #ff0000; */
}

.confirm {
	color: #8080ff;
/*	border-left: 1px solid #ff0080; */
}