@charset "UTF-8";

/* -----------------------------------------------
 * STYLE SHEET
 * 2008 LIGHTBOX
 * ----------------------------------------------- */
:root{
	--menu-height:57px;
	--menu-width:160px;
}

#pagetop {
	margin:50px 0px 10px 770px;
	font-size:0.8em;
}

#headerbt {
	margin:0;
	padding:0;
	display:flex;
	width:100%; height:var(--menu-height);
	text-align:left;
	float:left;
	/*position:sticky;top:0;left:0;*/
	z-index:10;
	background-color:#000;
	position:relative;
}
#headerbt ul{
	width:100%;height:var(--menu-height);
	margin:0px;
	padding:0;
	list-style:none;
	display:flex;
	gap:0;
	flex-wrap:nowrap;
	align-content:center;
}
#headerbt ul li{
	margin:0;
	padding:0px;
	width:var(--menu-width);
	height:var(--menu-height);
	line-height:var(--menu-height);
	white-space:nowrap;
}

#headerbt ul li a.menuitem{
	display:block;
/*	align-content:center;*/
/*	justify-content:center;*/
	width:100%; height:100%;
	margin:0px;
	text-align:center;
	background-color:#000;
	color:white;
	text-decoration:none;
	transition:all 0.2s;
	cursor:pointer;
}
#headerbt ul li a.menuitem:link{text-decoration:none;}
#headerbt ul li a.menuitem:visited{text-decoration:none;}
#headerbt ul li a.menuitem:hover{
	text-decoration:none;
	background-color:#555;
	color:white;
}
.with-icon:before,[data-icon]:before {
	display:inline-block;
	content: attr(data-icon)'';
	font-family: 'Material Icons';
	font-size: 20px;
	/*padding-right:.2rem;*/
	/*margin-top:2px;*/
	vertical-align:middle;
}

/* --------------ヘッダーのボタン群---------------- */

div.top1bt {
	display:block;
	width:280px;
	height:70px;
	margin:0 0 7px 0;
	padding:0px;
	text-indent:-8888px;
	background-repeat:no-repeat;
	background-position: top left;
	box-shadow: 2px 2px 3px rgba(100,100,100,0.5);
	border-radius:10px;
}
div.top1bt:hover{
	line-height:20px;
	background-repeat:no-repeat;
	background-position: top right;
}

.menutextcell div{
	background-repeat:no-repeat;
	background-position: top right;
}

#order a{
	display:block;
	float:right;
	width:250px;
	height:50px;
	margin:0;
	padding:0px;
}
#order a:hover{
}

#backbtbg a{
	display:block;
	width:156px;
	height:49px;
	margin:0px;
	padding:0px;
	text-indent:-8888px;
	background-image:url(../images/bt_headerback.gif);
	background-repeat:no-repeat;	
	background-position: top left;
}
#backbtbg a:hover{
	display:block;
	width:156px;
	height:49px;
	margin:0px;
	padding:0px;
	text-indent:-8888px;
	background-image:url(../images/bt_headerback.gif);
	background-repeat:no-repeat;	
	background-position: top right;
}


/* -------------ローカルナビゲーション------------- */

li.childnavi {
	display:flex;
	align-content:center;
	white-space:nowrap;
	float:left;
	margin:0 0 0 0;
	padding-left:16px;
	font-size:1.0em;
/*	background-image:url(../images/arrow.png);
	background-position:left center;
	background-repeat:no-repeat;
*/
}
li.childnavi:before{
	display:inline-block;
	font-family:'Material Icons';
	font-size:24px;
	content:'\e5df'; /*arrow_right*/
	margin:2px 0 0 0;
	color: var(--jp-red);
}

/* ---------------サイドバーの中----------------- */

.search {
	margin:30px 0 30px;
}
.search ul.search-buttons {/*container*/
	list-style:none;
	padding:0px;
	height:32px;
	display:flex; gap:4px;
	align-content:center;
	align-items:center;
	justify-content:center;
}
.search ul.search-buttons li{/*item*/
	display:inline-block;
}
.search ul.search-buttons li a {/*content*/
	display:flex;
	width:100px;height:35px;
	background-color:#fff;
	color:#000;
	border:1px solid #888;
	font-size:0.9em;
	align-content:center;
	align-items:center;
	justify-content:center;
	text-decoration:none;
}
.search ul.search-buttons li.clearbt a{
	background-color:#fff;
	color:#000;
	border-color:#aaa;
}
.search ul.search-buttons li.searchbt a{
	background-color:#222;
	color:#fff;
	border-color:#222
}
.search ul.search-buttons li.clearbt a:hover {
}

#category {
	margin:10px 0px 0px 0px;
}
#category ul {
	list-style:none;
	margin:0 0 10px 0;
	border: 1px solid #E0DFE3;
	border-width:0px 0px 0px 5px;
	padding:0px;
}
#category ul li a {
	display:block;
	width:217px;
	height:25px;
	font-size:0.75em;
	text-decoration:none;
	padding:0px 10px 0px 10px;
	background-image:url(../images/categorybtback.gif);
	background-position:top left;
	background-repeat:no-repeat;
	overflow: hidden;
}
#category ul li a:hover {
	display:block;
	width:217px;
	height:25px;
	font-size:0.75em;
	text-decoration:none;
	padding:0px 10px 0px 10px;
	background-image:url(../images/categorybtback.gif);
	background-position:top right;
	background-repeat:no-repeat;
}
#category ul.categorybt_2 {
  border-left-color: #99C;
}
#category ul.categorybt_3 {
  border-left-color: #669;
}

div#suggest, div#playerSuggest {
	font-size: 1.1em;
}


/* ---------------右サイドバーの中----------------- */

#rightsidebar {
	margin:0px;
	padding:0px;
}

#toriokispace {
	background-image:url(../images/projback.gif);
	background-position:top right;
	background-repeat:repeat-y;
	width:152px;
	margin:0px;
	padding:0px;
	height:100%;
}
#toriokispace ul {
	list-style:none;
	margin:0px;
	padding:0px;
}
#toriokispace ul li {
	margin:0px;
	padding:0px;
}
#toriokispace ul li.torioki_on a {
	display:block;
	width:15px;
	height:42px;
	font-size:0.875em;
	text-decoration:none;
	color:#000;
	font-weight:bold;
	margin:0px;
	padding:70px 0px 0px 7px;
	background-image:url(../images/tab_lightopen.gif);
	background-repeat:no-repeat;
}
#toriokispace ul li.torioki_off_end_light a {
	display:block;
	width:15px;
	height:54px;
	font-size:0.875em;
	text-decoration:none;
	color:#000;
	font-weight:bold;
	margin:0px;
	padding:70px 0px 0px 7px;
	background-image:url(../images/tab_darkend_light.gif);
	background-repeat:no-repeat;
}
#toriokispace ul li.torioki_off_end_dark a {
	display:block;
	width:15px;
	height:54px;
	font-size:0.875em;
	text-decoration:none;
	color:#000;
	font-weight:bold;
	margin:0px;
	padding:70px 0px 0px 7px;
	background-image:url(../images/tab_darkend_dark.gif);
	background-repeat:no-repeat;
}
#torioki ul li.torioki_on_end a {
	display:block;
	width:15px;
	height:54px;
	font-size:0.875em;
	text-decoration:none;
	color:#000;
	font-weight:bold;
	margin:0px;
	padding:70px 0px 0px 7px;
	background-image:url(../images/tab_lightend_top.gif);
	background-repeat:no-repeat;
}

.bthattyu {
	margin:0px 0px 15px 0px;
}
.bthattyu a {
	background-image:url(../images/bt_hattyu.gif);
	background-position:top left;
	background-repeat:no-repeat;
	display:block;
	text-indent:-8888px;
	width:100px;
	height:22px;
}
.bthattyu a:hover {
	background-image:url(../images/bt_hattyu.gif);
	background-position:top right;
	background-repeat:no-repeat;
	display:block;
	text-indent:-8888px;
	width:100px;
	height:22px;
}

#scroll {
	margin:10px 0px 20px 4px;
	padding:0px;
}

.toriokiphoto {
	font-size:0.75em;
	line-height:1.2em;
	margin:0px 0px 15px 0px;	
}
.toriokiphoto img {
	margin:0px 0px 3px 0px;	
}

#more {
	margin:10px 0px;
}
div.btmore a {
	width:100px;
	height:22px;
	display:block;
	background-image:url(../images/bt_more.gif);
	background-position:top left;
	background-repeat:no-repeat;
	text-indent:-8888px;
}
div.btmore a:hover {
	width:100px;
	height:22px;
	display:block;
	background-image:url(../images/bt_more.gif);
	background-position:top right;
	background-repeat:no-repeat;
	text-indent:-8888px;
}


/* ---------------コンテンツ内----------------- */
.pagenation-wrapper{
	display:flex;
	justify-content:flex-end;
	gap:30px;
	width:100%;
	margin:30px 0 10px;
}
.pagenumber .box_jump{
	display:flex;
	gap:1px;
}
.pagenumber {
	display:flex;
	flex-wrap:nowrap;
	gap:1px;
}
.pagenumber .item {
	cursor:default;
	border:1px solid #ccc;
	display:inline-block;
	width:35px;
	height:35px;
	line-height:35px;
	font-size:0.8em;
	text-align:center;
	background-color:#222;
	color:white;
}
.pagenumber .item.current {
	border:1px solid #aaa;
	background-color:white;
	font-weight:500;
	color:#000;
}
.pagenumber .item.prev{margin-right:10px;}
.pagenumber .item.next{margin-left:10px;}
.pagenumber .item:not(.disabled):hover{opacity:0.8;}
.pagenumber .item.first:before{
	font-family:'Material Icons';
	font-size:24px;
	content:'first_page';
}
.pagenumber .item.last:before{
	font-family:'Material Icons';
	font-size:24px;
	content:'last_page';
}
.pagenumber .item.prev:before{
	font-family:'Material Icons';
	font-size:24px;
	content:'\e5cb';
}
.pagenumber .item.next:before{
	font-family:'Material Icons';
	font-size:24px;
	content:'\e5cc';
}
.pagenumber .item.disabled{
	opacity:0.1;
}
.inp_jump{
	width:40px;
	height:35px;
}


/*
.btlogin a {
	display:block;
	width:100px;
	height:22px;
	background-image:url(../images/bt_login.gif);
	background-repeat:no-repeat;
	background-position:top left;
	text-indent:-8888px;
}
.btlogin a:hover {
	display:block;
	width:100px;
	height:22px;
	background-image:url(../images/bt_login.gif);
	background-repeat:no-repeat;
	background-position:top right;
	text-indent:-8888px;
}
*/
/*
.btlogin a#btn_clear, .btlogin a:hover#btn_clear {
	background-image:url(../images/bt_clear.gif);
}
.btlogin a.btn_clear, .btlogin a:hover.btn_clear {
	background-image:url(../images/bt_clear.gif);
}

.btlogin a#btn_search, .btlogin a:hover#btn_search {
	background-image:url(../images/bt_search.gif);
}
.btlogin a.btn_search, .btlogin a:hover.btn_search {
	background-image:url(../images/bt_search.gif);
}

.btlogin a#btn_reset,.btlogin a.btn_reset {
	background-image:url(../images/bt_reset.gif);
}
.btlogin a:hover#btn_reset,.btlogin a:hover.btn_reset {
	background-image:url(../images/bt_reset.gif);
}

.btlogin a#btn_update,.btlogin a.btn_update {
	background-image:url(../images/bt_koushin.gif);
}
.btlogin a:hover#btn_update,.btlogin a:hover.btn_update {
	background-image:url(../images/bt_koushin.gif);
}

.btlogin a#btn_update2 {
	background-image:url(../images/bt_koushin.gif);
}
.btlogin a:hover#btn_update2 {
	background-image:url(../images/bt_koushin.gif);
}

.btlogin a#btn_delete {
	background-image:url(../images/bt_sakujyo.gif);
}
.btlogin a:hover#btn_delete {
	background-image:url(../images/bt_sakujyo.gif);
}

.btlogin a#btn_insert {
	background-image:url(../images/bt_touroku.gif);
}
.btlogin a:hover#btn_insert {
	background-image:url(../images/bt_touroku.gif);
}

.btlogin a#btn_task_update {
    background-image:url(../images/bt_koushin.gif);
}
.btlogin a:hover#btn_task_update {
    background-image:url(../images/bt_koushin.gif);
}

.btlogin a#btn_task_delete {
    background-image:url(../images/bt_sakujyo.gif);
}
.btlogin a:hover#btn_task_delete {
    background-image:url(../images/bt_sakujyo.gif);
}

.btlogin a#btn_task_insert {
    background-image:url(../images/bt_touroku.gif);
}
.btlogin a:hover#btn_task_insert {
    background-image:url(../images/bt_touroku.gif);
}
*/


.btlogin a#btn_erase { /* 情報編集ページの「レコード削除」ボタン */
	/*background-image:url(../images/bt_deleterecord.gif);*/
}
.btlogin a:hover#btn_erase {
	/*background-image:url(../images/bt_deleterecord.gif);*/
}

.btlogin a.btn_reset_all { /* 取り置き一括編集ページのリセットボタン */
	/*background-image:url(../images/bt_reset.gif);*/
}
.btlogin a.btn_reset_all:hover {
	/*background-image:url(../images/bt_reset.gif);*/
}

.btlogin a.btn_update_all { /* 取り置き一括編集ページの更新ボタン */
	/*background-image:url(../images/bt_koushin.gif);*/
}
.btlogin a.btn_update_all:hover {
	/*background-image:url(../images/bt_koushin.gif);*/
}

.bt_selector {
 	font-size: 12px;
 	width: 150px;
	height: 25px;
	line-height: 25px;
 	text-align: center;
	vertical-align: middle;
	margin: 0px 2px 0px 0px;
	border: 1px solid #ddd;
	padding:2px;
 	float: left;
 	cursor: pointer;
	background-color: #eee;
}

#footernavi {
	display:flex;
	flex-wrap:wrap;
	gap: 20px;
	align-content: center;
	justify-content:center;
	margin:15px 0;
	padding:0px;
	font-size:14px;
}
#footernavi a {
position: relative;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  padding: 0 0 0 20px;
  text-decoration: none;
}
#footernavi a:hover {
	color:#999;
	text-decoration:none;
}
#backbtbg {
	display:none;
	background-color:#a1a1a1;
	height:49px;
}


/* アウトプットドロップメニュー部分
------------------------------------------------------------------------------------- */
/*
#menu, #menu ul {
	margin:0;
	padding:0;
	list-style-type:none;
} 
#menu	{
	width:300px;
	position:relative;
}
#menu li	{
	float:left;
	position:relative;
}
*/

/*  メニュー横幅・*/
/*
#menu li.main{
	width:160px;
}
*/
/*  メニュー　sub */
/*
#menu li.main ul.sub{
	margin:0px;
	display: block;
	width:100%;
	position: absolute;
	top:57px;
	left:0px;
}
#menu li.main ul.sub > li{border-bottom:1px solid #888;}
#menu li.main ul.sub > li:last-of-type{border-bottom:0;}
*/

#headerbt ul.menu_container *{user-select:none;}
#headerbt ul.menu_container{position:relative;display:inline-block;overflow: visible;}
#headerbt li.label {width:var(--menu-width);height:var(--menu-height);}
#headerbt li.label ul.sub_container {display:none;position:absolute;top:var(--menu-height);overflow:visible;}
#headerbt li.label:hover ul.sub_container {display:block;height:auto;}/*全ての子要素を包括した高さとする*/
#headerbt ul.sub_container >li{width:var(--menu-width);height:var(--menu-height);border-bottom:1px solid #777;}
#headerbt ul.menu_container >.label >.menuitem::after {
  font-family: 'Material Icons';
  content: 'navigate_next';
  font-size: 20px;
  display: inline-block;
  margin: 2px 0 0 5px;
  vertical-align:middle;
}
#headerbt ul.menu_container:hover >.label >.menuitem::after {
  transform: rotate(90deg);
  transform-origin:center
}


/* search.htmlの再定義 2025-05- */
#box_list_controle{
	padding:0 10px;
	display:flex;
	align-content:center;
	justify-content:space-between;
	flex-wrap:nowrap;
}
#box_list_controle>*{
	flex:0 0 auto;
	display:flex;
	gap:20px;
	align-content:center;
	flex-wrap:nowrap;
}
#box_list_controle>*>*{
	align-content: center;
}
#box_list_controle select{
	height:1.8rem;
}
.compset{
	display:flex;
	align-content:center;
	align-items:center;
	flex-wrap:nowrap;
	gap:3px;
}
.view_mode{
	display:inline-block;
	width:30px;height:30px;
	background-color:white;
	border:1px solid #888;
	color:#aaa;
	text-align:center;
}
.view_mode:first-of-type{
	border-radius: 4px 0 0 4px;
}
.view_mode:last-of-type{
	border-radius: 0 4px 4px 0;
}

.view_mode.active{
	background-color:#222;
	color:white;
}

.scroll-top{
	display:flex;
	align-content:center;
	align-items:center;
	justify-content:center;
	width:40px;height:40px;
	position:fixed;
	right:20px;bottom:100px;
	z-index:11;
	border-radius:50%;
	background-color:rgba(50,50,50,0.8);
	user-select:none;
	cursor:default;
}
.scroll-top:hover {box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.17);}
.scroll-top .content{
	display: inline-block;
	font-family: 'Material Icons';
	font-size: 28px;
	color: white;
	margin: 0;
	padding: 0;
}