@charset "UTF-8";
/* "@(#) $Id: menu_style.css,v 1.2.2.1 2021/06/10 01:37:55 vic25 Exp $" */
/* ========================================================================== */
/* メニュー描画で使用するスタイルシート定義 */
/* ========================================================================== */
/* ========================================================================== */
/*	共通	*/
/* ========================================================================== */
/* サブメニュー用メニュー枠 */
DIV.dvsmf {
	width:100%;
	cursor:pointer;
}

/* サブメニュー用(配下データ種別1件) */
DIV.dvsm1 {
	border:1px solid transparent;
}

/* サブメニュー用(配下データ種別2件以上) */
DIV.dvsm2 {
	background:url('../../../img/menu/link_under_open.gif') no-repeat right center;
	border:1px solid transparent;

}

/* データ種別用 */
DIV.dvdt {
	cursor:					pointer;
	border:					1px solid transparent;
}

/* メニュー文字列オーバーフロー時に使用 */
DIV.dvstof {
	width:					250px;
	word-break:				break-all;
}

/* メニューリストのデータ種別画像	*/
TD.tdmldtim {
	padding-left:			2px;
	width:					18px;
}

IMG.immldt {
	width:					16px;
	height:					16px;
}

/* メニューリストのサブメニュー・データ種別文字列	*/
SPAN.spmlst {
	padding-left:5px;
	word-break:break-all;
}

/* ========================================================================== */
/*	デザイン別	*/
/* ========================================================================== */
/* メインメニュー関連	*/
TD.tdmm {
	width:					91px;
	margin-left:			1px;
	vertical-align:			bottom;
}

TD.tdmmsv {
	width:					91px;
	margin-left:			1px;
	vertical-align:			bottom;
}


DIV.dvmmtab {
	width:					90px;
	height:					28px;
	font-size:				10px;
	cursor:					pointer;
	border-top-left-radius:	5px;
	border-top-right-radius:5px;
	color:					gray;
	background-color:		lightgrey;
	text-align:				center;
}

DIV.dvmmtab SPAN{
	color:					gray;
}

DIV.dvmmtabd {
	width:					90px;
	height:					28px;
	font-size:				10px;
	cursor:					pointer;
	border-top-left-radius:	5px;
	border-top-right-radius:5px;
	color:					#0D40AA;
	background-color:		#a4bff9;
	text-align:				center;
}

DIV.dvmmtabd SPAN {
	color:					#0D40AA;
}

DIV.dvsvtab {
	width:					90px;
	height:					28px;
	text-align:				center;
	font-size:				10px;
	cursor:					pointer;
	border-top-left-radius:	5px;
	border-top-right-radius:5px;
	color:					gray;
	background-color:		lightgrey;
	text-align:				center;
}

DIV.dvsvtab SPAN{
	color:					gray;
}

DIV.dvsvtabd {
	width:					90px;
	height:					28px;
	text-align:				center;
	font-size:				10px;
	cursor:					pointer;
	border-top-left-radius:	5px;
	border-top-right-radius:5px;
	color:					#0D40AA;
	background-color:		#a4bff9;
	text-align:				center;
}

DIV.dvmmtabd SPAN {
	color:					#0D40AA;
}

DIV.dvmmicn {
	width:					18px;
	height:					28px;
	display:				table-cell;
	vertical-align:			middle;
}

DIV.dvmmicn SPAN{
	font-size:				13px;
}

DIV.dvmmnm {
	height:					28px;
	display:				table-cell;
	vertical-align:			middle;
	word-break:				normal;
}

DIV.dvmmnm SPAN {
	font-size:				11px;
	line-height:			1.0;
}

/* サブメニュー一覧用 */
DIV.dvsml {
	position:				absolute;
	background-color:		#FCFCFC;
	border:					1px solid #a4bff9;
	display:				none;
}

/* データ種別一覧用 */
DIV.dvdtl {
	position:				absolute;
	background-color:		#FCFCFC;
	border:					1px solid #a4bff9;
	display:				none;
	overflow-y:				auto;
}

/* 現在メニュー表示用 */
TD.tdcm {
	background-repeat:		repeat-x;
	vertical-align:			bottom;
	padding-left:			10px;
	padding-bottom:			2px;
	background-color:		#a4bff9;
}

/*========================================================*/
/* メニューリスト用 */
/*========================================================*/
/* メニューリスト本体のDIV用	*/
DIV.dvmlm {
	position:				absolute;
	top:					52px;
	left:					0px;
	width:					1000px;
	height:					400px;
	overflow:				hidden;
	border:					1px ridge CornflowerBlue;
	z-index:				200;
}

/* メニューリストのメインメニューSPAN用	*/
DIV.dvmlmm {
	width:					950px;
	padding:				4px;
	margin-left:			auto;
	margin-right:			auto;
	border-width:			1px;
	border-style:			solid;
	background-color:		#FFFFFF;
	border-color:			white;
}

/* メニューリストのメインメニューの●用	*/
TD.tdmlmmbl {
	width:					30px;
	text-align:				center;
	color:					lightgrey;
}

DIV.mlc {
	cursor:					pointer;
	border:					1px solid transparent;
}

DIV.mlcov {
	cursor:					pointer;
	border:					1px solid transparent;
}

/* ========================================================================== */
/*	サイドメニュー表示用クラス	*/
/* ========================================================================== */
/* サイドバー全体	*/
div.sidebar {
	position:fixed;
    top:0;
    left:0;
    height:100%;
    z-index:900;
	background-color:#ffffff;
	border-bottom-right-radius:5px;
	border-top-right-radius:5px;
	box-shadow: 2px 2px 4px lightgrey;
	padding-right:5px;
	padding-left:10px;
	overflow:hidden;
}

/*
div.sidebar::-webkit-scrollbar {
	width:5px;
}

div.sidebar::-webkit-scrollbar-track {
	background-color:#EDF1FA;
}

div.sidebar::-webkit-scrollbar-thumb {
  border-radius:5px;
  background-color:#3260a1;
}
*/


div.sidebar-auto {
	transition:all 0.2s 0.0s ease;
    width:60px;
	padding-right:10px;
}

div.sidebar-auto ~ div.overlay-input-error-parent-window {
	transition:all 0.2s 0.0s ease;
	top:100px;
	left:100px;
}

/* hoverでサイドバーを展開	*/
div.sidebar-auto:hover {
    width:300px;
	padding-right:16px;
}

div.sidebar-auto:hover ~ div.overlay-input-error-parent-window {
	transition:all 0.2s 0.0s ease;
	top:100px;
	left:350px;
}

div.sidebar-open {
    width:300px;
	padding-right:16px;
}

div.sidebar-open ~ div.overlay-input-error-parent-window {
	transition:all 0.2s 0.0s ease;
	top:100px;
	left:350px;
}

INPUT[type=checkbox].sidebar-auto-change {
	display:none;
}

div.sidebar-open ~ div div.parent-main-content  {
	margin-left:300px;
}

div.sidebar-auto ~ div div.parent-main-content  {
	margin-left:60px;
}

div.sidebar-open ~ div.login-sec {
	margin-left:300px;
	width:calc(100% - 300px);
}

div.sidebar-auto ~ div.login-sec {
	margin-left:60px;
	width:calc(100% - 60px);
}

/* メニュー部全体	*/
div.sidebar-menu {
	width:100%;
	height:calc(100% - 90px);
	background-color:#ffffff;
}

div.sidebar-auto div.sidebar-menu {
    overflow-y:hidden;
}

/* hoverでサイドバーを展開	*/
div.sidebar-auto:hover div.sidebar-menu {
    overflow-y:hidden;
}

div.sidebar-open div.sidebar-menu {
    overflow-y:hidden;
}



div.sidebar-logo {
	width:100%;
	height:80px;
	display:flex;
	align-items:center;
	justify-content:flex-start;
	cursor:pointer;
}

div.sidebar-logo > div.icon {
	width:40px;
	height:40px;
	display:flex;
	align-items:center;
	justify-content:center;
}

div.sidebar-logo > div.icon > img {
	width:30px;
	height:30px;
}

div.sidebar-auto div.sidebar-logo > div.title {
	cursor:default;
	color:#3260A1;
	white-space:nowrap;
	overflow:hidden;
	width:0;
	visibility:hidden;
	opacity:0;
	transition:width 0.1s 0.2s ease, opacity 0.1s 0.2s ease;
}

div.sidebar-auto:hover div.sidebar-logo > div.title {
	width:calc(100% - 40px);
	visibility:visible;
	opacity:1;
}

div.sidebar-open div.sidebar-logo > div.title {
	cursor:default;
	color:#3260A1;
	white-space:nowrap;
	width:calc(100% - 40px);
}

/* メニュータイトル非表示 */
h2.hidden-title-text {
	color:white;
	user-select:none;
}

div.sidebar-menu ul {
	margin:0;
	padding:0;
	outline:0;
}

div.sidebar-menu li {
	width:100%;
	margin:0;
	outline:0;
}

/* 1メニュー全体	*/
div.sidebar-menu li > label {
	display:-webkit-flex;
	display:flex;
	border-spacing:0;
	border-collapse:collapse;
	text-decoration:none;
	border-radius:3px;
	color: #3260a1;
	margin-bottom:5px;
	width:100%;
	-webkit-align-items:center;
	align-items:center;
	justify-content:flex-start;
}

/* hoverで表示色変更	*/
div.sidebar-menu li label:hover{
	cursor:pointer;
	background-color:#234370;
	color:#ffffff;

}

div.sidebar-menu li.active > label {
	background-color:#3260a1;
	color:#ffffff;
}

div.sidebar-menu li.active > label:hover {
	background-color:#234370;
	color:#ffffff;
}

/* メインメニューは初期状態ではアイコンのみ表示	*/
/* アイコンの幅のみ表示	*/
div.sidebar-menu li.mainmenu > label {
	min-height:40px;
}

div.sidebar-menu li.submenu > label {
	min-height:40px;
}

div.sidebar-menu li.datatype > label {
	min-height:30px;
}

/* メインメニュー配下は初期状態では非表示	*/
div.sidebar-menu li.mainmenu > ul {
}

/* 各メニューのテキスト部分は初期状態では非表示	*/
div.sidebar-auto div.sidebar-menu li > label > div.menu-name {
	width:calc(100% - 80px);
	height:30px;
	overflow:hidden;
	white-space:nowrap;
	display:none;
}

div.sidebar-auto:hover div.sidebar-menu li > label > div.menu-name {
	display:block;
	height:auto;
	white-space:normal;
}

div.sidebar-open div.sidebar-menu li > label > div.menu-name {
	white-space:normal;
	width:calc(100% - 80px);
	overflow:visible;
}


/* メニューアイコン部共通	*/
div.sidebar-menu li label i.menu-icon {
	display:-webkit-flex;
	display:flex;
	-webkit-align-items:center;
    align-items:center;
	justify-content:center;
}

/* メインメニューアイコン	*/
li.mainmenu > label i.menu-icon {
	width:40px;
	height:40px;
	font-size:20px;
}

/* サブメニューアイコン	*/
li.submenu > label i.menu-icon {
	margin-left:15px;
	width:40px;
	height:40px;
	font-size:15px;
}

/* データ種別アイコン	*/
li.datatype > label i.menu-icon {
	margin-left:30px;
	width:40px;
	height:40px;
	font-size:15px;
}

/* インデント	*/
/* メニュー幅を縮小したときにはサブメニューとデータ種別のインデントを初期化	*/
div.sidebar-auto div.sidebar-menu li > label > i.menu-icon {
	margin-left:0px;
}

/* hoverしたときにはサブメニューのインデントを再設定（unsetが効かなかったので再設定する）	*/
div.sidebar-auto:hover div.sidebar-menu li.submenu > label > i.menu-icon {
	margin-left:15px;
}

/* hoverしたときにはデータ種別の幅をインデント設定（unsetが効かなかったので再設定する）	*/
div.sidebar-auto:hover div.sidebar-menu li.datatype > label > i.menu-icon {
	margin-left:30px;
}


/* 開閉アイコン	*/
div.sidebar-auto div.sidebar-menu li label i.accordion-icon {
    align-items:center;
	justify-content:center;
	font-size:12px;
	transition:all 0.3s 0.2s linear;
	width:40px;
	height:40px;
	display:none;
}

div.sidebar-auto:hover div.sidebar-menu li label i.accordion-icon {
	display:flex;
}

div.sidebar-open div.sidebar-menu li label i.accordion-icon {
	display:flex;
    align-items:center;
	justify-content:center;
	font-size:12px;
	width:40px;
	height:40px;
}

/* 配下メニューが展開されている場合はアイコンを回転	*/
.checkbox-acd-on-off:checked ~ label > i.accordion-icon {
	transform:rotate(-90deg);
}

.checkbox-acd-on-off:checked ~ label  {
	background-color:#EDF1FA;
}

/* 展開判定用のチェックボックスは常に非表示	*/
.checkbox-acd-on-off {
	display:none;
}

/* 配下メニューが存在する際に指定	*/
.treeview-menu{
	max-height:0;
    overflow: hidden;
	transition: all .5s linear;
}

/* 展開判定用のチェックボックスの値に応じて配下メニューの展開を判定	*/
.checkbox-acd-on-off:checked ~ .treeview-menu{
	max-height:8000px;
	transition: all .5s linear;
}

/* カスタムスクロールバーのクラス定義を上書き	*/
div.sidebar-menu .mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail{ background-color: #fff; background-color: rgba(255,255,255,0.6); }
div.sidebar-menu .mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(35,67,112,0.75); }
div.sidebar-menu .mCS-inset-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(35,67,112,0.85); }
div.sidebar-menu .mCS-inset-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
div.sidebar-menu .mCS-inset-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(35,67,112,0.9); }
div.sidebar-menu .mCSB_outside + .mCSB_scrollTools{right: -16px;}