@charset "UTF-8";

@media print,screen {

	/* 初期化 */
	* {
		border: 0;
		outline: 0;
		margin: 0;
		padding: 0;
	}
	body {
		font-size: 12px;
		line-height: 1.8em;
		letter-spacing: 0;
/*		font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" , Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;*/
		font-family: "Open Sans", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, "Malgun Gothic", sans-serif;
		font-weight: 500;
		background-color: #1D253C;
		background: #FDF7EE;
		color: #333;
		-webkit-text-size-adjust: none;
	}
	body.fontsize_large {
		font-size: 14px;
	}
	body.fontsize_small {
		font-size: 10px;
	}

	a {
		color: #333;
		text-decoration: underline;
	}
	a img {
		border: 0;
	}

	img {
		max-width: 100%;
		height: auto;
	}
	button {
		padding: 5px 10px;
		border-radius: 5px;
		cursor: pointer;
	}

	/* デザイン共通 */
	#spcover {
		position: fixed;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		background: rgba(0,0,0,0.3);
		z-index: 9;
		cursor: pointer;
		display: none;
	}
	body.toggled-on #spcover {
		display: block;
	}
	.wrapper {
		padding-left: 1em;
		padding-right: 1em;
		max-width: 1200px;
		margin: 0 auto 20px;
	}

	/* ヘッダー */
	.header {
		background: #1b2b50;
		color: #151414;
		border-bottom: 1px solid #D9D9D9;
		position: fixed;
		left: 0;
		top: 0;
		width: 100%;
		z-index: 10;
		font-size: 14px!important;
		line-height: 1.8;
		transition: top 0.3s ease-in-out;
	}
	.full_disp .header {
		top: -70px;
	}
	select[name="hotel_select"] {
		font-size: 85%;
	}
/*
	.color_blue .header,
	.color_gray .header,
	.color_white .header {
		background: #1E2C4D;
	}
*/
	.font_color {
		fill: #E5848E;
	}
/*
	.color_blue .font_color,
	.color_gray .font_color,
	.color_white .font_color {
		fill: #73DEBB;
	}
*/
	.header a {
		color: #fff;
		display: block;
	}
	.header > .wrapper {
		margin-bottom: 0;
	}
	.header > .wrapper > .flex_box {
		align-items: center;
		padding-top: 4px;
	}
	/* ロゴ */
	.flex_box .logo {
		width: 180px;
		flex-basis: 180px;
	}
	.flex_box .logo img {
		vertical-align: middle;
		display: block;
	}

	/* ナビゲーション */
	body .nav {
		display: none;
		position: absolute;
		top: 112px;
		left: 0;
		width: 94%;
		padding: 0 3% 15px;
/*		background: #222a35;*/
	}
	body.toggled-on .nav {
		display: block;
	}
	.nav h3 {
		font-size: 100%;
		text-align: center;
		margin: 5px 0 2px;
		display: none;
	}
	.nav ul {
		list-style-type: none;
		margin: 0;
		justify-content: flex-end;
		align-items: center;
	}
	.nav ul li {
		border-bottom: 1px dotted #ccc;
	}
	.nav ul li:last-of-type {
		border-bottom: 0;
	}
	.nav ul li .account_icon {
		display: inline-block;
		width: 25px;
		height: 25px;
/*		background: #375AE9;*/
		border-radius: 50%;
	}
	.nav ul li .account_icon svg {
		width: 25px;
		height: 25px;
		vertical-align: middle;
	}
	.nav ul li .account_icon.bell + .bell_number {
		position: absolute;
		top: 0;
		right: -0.4em;
		font-size: 80%;
		background: #f00;
		width: 1.2em;
		height: 1.2em;
		line-height: 1.2em;
		text-align: center;
		border-radius: 50%;
		font-weight: 700;
	}
	.nav ul li a {
		background: #fff;
		color: #222a35;
		transition: background 0.3s ease-in-out, color 0.3s ease-in-out;
		display: block;
		padding: 10px 15px;
		font-weight: 700;
		font-size: 95%;
		text-decoration: none;
	}
	.nav ul li.selected a,
	.nav ul li a:hover,
	.nav ul li a:focus {
		background: #222a35;
		color: #ffffff;
	}
	button.menu-toggle {
		background: transparent;
		color: #fff;
		display: block;
		width: 50px;
		height: 50px;
		position: absolute;
		right: 30px;
		top: 0px;
		
	}
	button.menu-toggle span {
		transition: opacity 0.2s ease-in-out;
		width: 50px;
		display: inline-block;
	}
	body.toggled-on button.menu-toggle span {
		opacity: 0;
	}
	button.menu-toggle:before,
	button.menu-toggle:after {
		content: "";
		display: block;
		width: 50px;
		height: 3px;
		background: #fff;
		transition: all 0.2s ease-in-out;
	}
	body.toggled-on button.menu-toggle:before {
		transform: rotate(45deg);
/*		margin-top: 20px;*/
	}
	body.toggled-on button.menu-toggle:after {
		transform: rotate(-45deg);
		margin-top: -18px;
	}

	/* コンテンツ */
	.main {
		min-height: calc( 100vh - 202px );
/*		transition: margin 0.3s ease-in-out;*/
	}
	.main:not(.has_sidebar) {
		display: flex;
		align-items: center;
	}
	.full_disp .main {
		margin-top: 0!important;
	}
	.main > .wrapper {
		padding-top: 20px;
		padding-bottom: 20px;
		transition: height 0.3s ease-in-out;
	}
	.full_disp .main > .wrapper {
		height: 100%!important;
	}
	.main.has_sidebar > .wrapper {
/*		display: flex;*/
		position: relative;
		padding: 0;
		margin: 0;
		max-width: none;
		overflow-y: auto;
	}
	.main.has_sidebar > .wrapper > .sidebar {
		width: 200px;
		position: fixed;
		left: 0;
		top: 0;
		bottom: 0;
		color: #FFF;
		background: #FCECED;
		transition: left 0.3s ease-in-out, opacity 0.3s ease-in-out;
		z-index: 5;
		overflow-y: auto;
	}
	.main.has_sidebar > .wrapper > .sidebar:hover {
		z-index: 5;
	}
	.main.has_sidebar > .wrapper > .sidebar.over_z {
		z-index: 10!important;
	}
	.full_disp .main.has_sidebar > .wrapper > .sidebar {
		left: -224px;
		opacity: 0;
/*		right: 100%;*/
	}
/*
	.color_blue .main.has_sidebar > .wrapper > .sidebar,
	.color_gray .main.has_sidebar > .wrapper > .sidebar,
	.color_white .main.has_sidebar > .wrapper > .sidebar {
		background: linear-gradient(160deg,#0012A0,#000944);
	}
*/
	.main.has_sidebar.slim_sidebar > .wrapper > .sidebar {
		width: 32px;
	}
	.main.has_sidebar > .wrapper > .sidebar ul {
		margin-left: 0;
		list-style-type: none;
	}
	.main.has_sidebar > .wrapper > .sidebar > ul > li > a,
	.main.has_sidebar > .wrapper > .sidebar > ul > li > .deep1 {
/*
		background-color: rgb(75,75,75);
		color: #ffffff;
*/
		background-image: linear-gradient(#fff 0, #fff 10px, #d8d8d8 100%);
		border: solid #CDCDCD;
		border-radius: 4px;
		border-width: 1px;
		box-sizing: border-box;
	}
	.main.has_sidebar > .wrapper > .sidebar ul li {
		margin-bottom: 12px;
	}
	.main.has_sidebar > .wrapper > .sidebar ul ul {
		margin-top: 4px;
		margin-left: 30px;
	}
	.main.has_sidebar > .wrapper > .sidebar ul ul.small_list {
		font-size: 90%;
	}
	.main.has_sidebar > .wrapper > .sidebar ul li li {
		margin-bottom: 4px;
		position: relative;
	}
	.main.has_sidebar > .wrapper > .sidebar ul ul ul:after {
		content: "";
		display: block;
		position: absolute;
		top: 10px;
		left: -6px;
		width: 10px;
		height: 10px;
		border-top: 1px solid #ccc;
		border-left: 1px solid #ccc;
		background: #FCECED;
		transform: rotate(-45deg);
	}
	.main.has_sidebar > .wrapper > .sidebar ul ul ul {
		position: absolute;
		left: 170px;
		top: -8px;
		white-space: nowrap;
		margin-left: 0;
		padding: 8px 12px;
		background: #FCECED;
		border: 1px solid #ccc;
		display: none;
	}
	.main.has_sidebar.slim_sidebar > .wrapper > .sidebar ul ul ul {
		left: 35px;
	}
	.main.has_sidebar > .wrapper > .sidebar ul li li:hover ul {
		display: block;
	}
	.main.has_sidebar > .wrapper > .sidebar ul li li a:hover,
	.main.has_sidebar > .wrapper > .sidebar ul li li a.selected {
		background: linear-gradient(to right, rgba(255,255,255,0.05),rgba(255,255,255,0.3));
	}
	.main.has_sidebar.slim_sidebar > .wrapper > .sidebar ul ul {
		margin-left: 0;
	}
	.main.has_sidebar > .wrapper > .sidebar ul li a,
	.main.has_sidebar > .wrapper > .sidebar ul li .deep1 {
		display: block;
		text-decoration: none;
		position: relative;
		padding-left: 32px;
		line-height: 1.8;
		cursor: pointer;
	}
	.main.has_sidebar > .wrapper > .sidebar ul li .deep1:after {
		content: "";
		display: block;
		width: 0;
		height: 0;
		border: 10px solid #000;
		border-width: 10px 7px;
		border-color: #000 transparent transparent;
		position: absolute;
		right: 8px;
		top: 8px;
		transition: transform 0.5s, top 0.5s;
	}
	.main.has_sidebar > .wrapper > .sidebar ul li .deep1.active:after {
		transform: rotate(180deg);
		top: -2px;
	}
	.main.has_sidebar > .wrapper > .sidebar ul li a:not(.home):not(.faq) {
		text-shadow: 0 0 3px rgba(0,0,0,0.7);
	}
	.main.has_sidebar > .wrapper > .sidebar.whiteshadow ul li a:not(.home):not(.faq) {
		text-shadow: 0 0 3px rgba(255,255,255,0.7);
	}
	.main.has_sidebar > .wrapper > .sidebar ul li li a:hover,
	.nav > ul > li,
	.main.has_sidebar > .wrapper > .sidebar ul li li a.selected {
		text-shadow: none !important;
	}
	.main.has_sidebar > .wrapper > .sidebar ul li a.protected {
		cursor: auto;
	}
	.main.has_sidebar > .wrapper > .sidebar ul li a.protected:hover:before {
		content: "";
		display: block;
		position: absolute;
		left: calc( 90% - 8px );
		width: 0;
		height: 0;
		border: 8px solid #fff;
		border-top-color: transparent;
		border-bottom-color: transparent;
		border-left-color: transparent;
	}
	.main.has_sidebar > .wrapper > .sidebar ul li a.protected:hover:after {
		content: "正規版で使用可能となります。";
		display: inline-block;
		padding: 6px 8px;
		background: #fff;
		border-radius: 12px;
		color: #000;
		font-size: 12px;
		line-height: 1.4;
		white-space: nowrap;
		position: absolute;
		left: 90%;
	}
	.main.has_sidebar > .wrapper > .sidebar ul li .deep1 {
		color: #333;
	}
	.main.has_sidebar > .wrapper > .sidebar ul li a.selected {
		border-right: 4px solid #FF00FF;
	}
/*
	.main.has_sidebar > .wrapper > .sidebar ul li a[class] {
		position: relative;
		padding-left: 32px;
	}
	.main.has_sidebar > .wrapper > .sidebar ul li a[class]:after,
*/
	.main.has_sidebar > .wrapper > .sidebar ul li a svg,
	.main.has_sidebar > .wrapper > .sidebar ul li .deep1 svg {
		content: "";
		position: absolute;
		top: 3px;
		left: 6px;
		width: 16px;
		height: 16px;
		background-repeat: no-repeat;
		background-position: center;
		background-size: 16px 16px;
	}
/*	.main.has_sidebar.slim_sidebar > .wrapper > .sidebar ul li a[class] {*/
	.main.has_sidebar.slim_sidebar > .wrapper > .sidebar ul li a,
	.main.has_sidebar.slim_sidebar > .wrapper > .sidebar ul li .deep1 {
		padding-left: 0;
		width: 32px;
		height: 32px;
		display: inline-block;
	}
	.main.has_sidebar.slim_sidebar > .wrapper > .sidebar ul li li ul a {
		width: auto;
	}
/*	.main.has_sidebar.slim_sidebar > .wrapper > .sidebar ul li a[class]:after,*/
	.main.has_sidebar.slim_sidebar > .wrapper > .sidebar ul li a svg,
	.main.has_sidebar.slim_sidebar > .wrapper > .sidebar ul li .deep1 svg {
		width: 24px;
		height: 24px;
		top: 4px;
		left: 4px;
		background-size: 24px 24px;
		background-position: center;
	}
	.main.has_sidebar.slim_sidebar > .wrapper > .sidebar ul li li ul a svg {
		display: none;
	}
/*
	.main.has_sidebar > .wrapper > .sidebar ul li a.uriage:after {
		background-image: url(../images/sidebar/uriage.png);
	}
	.main.has_sidebar > .wrapper > .sidebar ul li a.summary:after {
		background-image: url(../images/sidebar/summary.png);
	}
	.main.has_sidebar > .wrapper > .sidebar ul li a.just_price:after {
		background-image: url(../images/sidebar/just_price.png);
	}
	.main.has_sidebar > .wrapper > .sidebar ul li a.rank:after {
		background-image: url(../images/sidebar/rank.png);
	}
	.main.has_sidebar > .wrapper > .sidebar ul li a.yosan:after {
		background-image: url(../images/sidebar/yosan.png);
	}
	.main.has_sidebar > .wrapper > .sidebar ul li a.shisuu:after {
		background-image: url(../images/sidebar/shisuu.png);
	}
/*
	.main.has_sidebar > .wrapper > .sidebar ul li a.automate:after {
		background-image: url(../images/sidebar/automate.png);
	}
	.main.has_sidebar > .wrapper > .sidebar ul li a.home:after {
		background-image: url(../images/sidebar/home.png);
	}
*/

	.sidebar_icon {
		fill: rgb(75,75,75);
	}

	.reference {
		border: 1px  solid #CDCDCD;
		background: #fff;
		border-radius: 8px;
		padding: 8px;
		position: absolute;
		bottom: 60px;
		width: 182px;
	}
	.slim_sidebar .reference {
		display: none;
	}
	.reference h4 {
		text-align: center;
		color: #333;
		margin-bottom: 4px;
	}
	.reference ol {
		list-style-type: decimal;
		margin-left: 28px;
		color: #333;
		line-height: 1.5;
	}
	.reference ol li+li {
		margin-top: 8px;
	}
	.reference > ol > li.popup {
		cursor:pointer;
		position: relative;
		text-decoration: underline;
	}
	.reference > ol > li.popup > ul {
		display: none;
		position: absolute;
		min-width: 150px;
		background: #fff;
		border-radius: 8px;
		border: 1px solid #CDCDCD;
		padding: 4px 8px;
		left: 100%;
		top: -0.5em;
	}
	.reference > ol > li.popup > ul:before {
		content: "";
		position: absolute;
		left: -7.5px;
		top: 0.4em;
		top: calc( 0.5em - 1px );
		border: 7px solid #CDCDCD;
		border-color: #CDCDCD transparent transparent #CDCDCD;
		transform: rotate(-45deg);
		display: block;
		width: 0;
		height: 0;
	}
	.reference > ol > li.popup > ul:after {
		content: "";
		position: absolute;
		left: -6px;
		top: 0.5em;
		border: 6px solid #fff;
		border-color: #fff transparent transparent #fff;
		transform: rotate(-45deg);
		display: block;
		width: 0;
		height: 0;
	}
	.reference > ol > li.popup.toggle > ul {
		display: block;
	}
	.reference > ol > li.popup > ul > li {
		margin-bottom: 4px!important;
	}

	.main.has_sidebar.slim_sidebar > .wrapper > .sidebar ul li a .slim_del,
	.main.has_sidebar.slim_sidebar > .wrapper > .sidebar ul li .deep1 .slim_del {
		display: none;
	}
	.main.has_sidebar.slim_sidebar > .wrapper > .sidebar ul li li ul .slim_del {
		display: block;
	}
	.main.has_sidebar > .wrapper > .entry-content {
		margin-left: 224px;
		padding: 12px 12px 24px;
/*		transition: margin 0.3s ease-in-out;*/
	}
	.main.has_sidebar > .wrapper > .entry-content > h1:nth-of-type(1) {
/*		float: right;*/
	}
	.main.has_sidebar > .wrapper > .entry-content > h1.float {
		position: absolute;
		right: 10px;
		z-index: 1;
	}
	.full_disp .main.has_sidebar > .wrapper > .entry-content {
		margin-left: 0;
	}
	.main.has_sidebar.slim_sidebar > .wrapper > .entry-content {
		margin-left: 56px;
	}
	h1 {
		text-align: center;
		line-height: 1.5;
		margin-bottom: 4px;
		font-size: 110%;
		text-shadow: 1px 1px 0 rgb(200,200,200);
	}
	.has_sidebar h1 {
		text-align: right;
	}
	h2 {
		text-align: center;
		line-height: 1.5;
		margin-bottom: 8px;
		text-shadow: 1px 1px 0 rgb(200,200,200);
	}
	h3 {
		text-align: center;
		line-height: 1.5;
		margin-bottom: 8px;
		text-shadow: 1px 1px 0 rgb(200,200,200);
	}
	p {
		line-height: 1.6;
		margin-bottom: 15px;
	}

	.sidebar {
		background: linear-gradient(160deg,#0012A0,#000944);
		padding: 12px;
		font-size: 14px!important;
	}

	/* 出退勤表 */
	.month_prevnext {
		font-size: 90%;
		margin-bottom: 15px;
		display: flex;
		flex-wrap: nowrap;
		align-items: flex-start;
		justify-content: space-between;
		position: relative;
	}
	.month_prevnext .left {
		margin-right: auto;
		justify-self: self-start;
	}
	.month_prevnext .right {
		margin-left: auto;
		justify-self: self-end;
	}
	.tougetu {
		position: absolute!important;
		top: 0;
		left: 45%;
		left: calc( 50% - 38px );
	}
	.att_table {
		width: 100%!important;
		table-layout: fixed;
	}
	.att_table .day {
		display: inline-block;
		padding: 3px 5px;
		border-radius: 5px;
		font-size: 110%;
	}
	.att_table .day.today {
		color: #fff;
		background: #2A77F6;
	}
	.att_table th {
		color: #fff;
		background: #222a35;
	}
	.att_table th.sun {
		background: #f00;
	}
	.entry-content .att_table td {
		padding: 0.3em 0.1em;
		vertical-align: top;
		text-align: center;
	}

	.att_category {
		width: 30px;
		height: 15px;
		display: inline-block;
		margin: 0 5px 2px 0;
		vertical-align: middle;
		background: #ccc;
	}
	.att_category.mode1 {
		background: #47D49A;
	}
	.att_category.mode2 {
		background: #0179D4;
	}
	.att_category.mode3 {
		background: #AB1459;
	}
	.att_category.mode4 {
		background: #FFA915;
	}

	.day_table_wrap {
		overflow-x: auto;
	}
	.day_table {
		width: 100%!important;
		table-layout: fixed;
		min-width: 700px;
	}
	.day_table th {
		color: #fff;
		background: #222a35;
/*		position: sticky;
		left: 0;
*/
	}
	.day_table th a {
		color: #fff;
	}
/*
	.day_table td {
		min-width: 500px;
		width: calc( 100% - 100px );
	}
*/
	.att_gage {
		width: 100%;
		height: 22px;
		position: relative;
/*		min-width: 500px;*/
	}
/*
	.att_gage_wrap {
		overflow-x: auto;
	}
*/
	.att_gage .graph {
		position: absolute;
		top: 0;
		height: 100%;
		background-color: #ccc;
		line-height: 2;
		font-size: 60%;
		color: #fff;
		letter-spacing: 0;
		white-space: nowrap;
		overflow: hidden;
	}
	/* 異常：前日から勤務中（退勤してない）場合 */
	.att_gage .graph.mode0-2 {
		background: linear-gradient(to right, #f00 0, #f00 10px, #47D49A 20px, #47D49A, #0179D4);
	}
	/* 正常：当日内に出勤・退勤した場合 */
	.att_gage .graph.mode1-2 {
		background: linear-gradient(to right, #47D49A, #0179D4);
	}

	/* 正常：当日内に出勤・退勤申請した場合 */
	.att_gage .graph.mode1-4 {
		background: linear-gradient(to right, #0179D4, #FFA915);
	}

	/* 正常：当日内に出勤申請・退勤した場合 */
	.att_gage .graph.mode3-2 {
		background: linear-gradient(to right, #AB1459, #0179D4);
	}

	/* 正常：当日内に出勤申請・退勤申請した場合 */
	.att_gage .graph.mode3-4 {
		background: linear-gradient(to right, #AB1459, #FFA915);
	}

	/* 正常：当日内に出勤し勤務中の場合 */
	.att_gage .graph.mode1-now {
		background: linear-gradient(to left, transparent 0, #0179D4, #47D49A);
	}
	/* 正常：当日内に出勤申請し勤務中の場合 */
	.att_gage .graph.mode3-now {
		background: linear-gradient(to left, transparent 0, #FFA915, #AB1459);
	}

	.uppertext {
		position: absolute;
		top: -18px;
		left: ;
		font-size: 60%;
		letter-spacing: -0.05em;
	}
	.uppertext.mode3,
	.uppertext.mode4 {
		font-weight: 700;
		color: #f00;
	}
	.uppertext.mode3:after,
	.uppertext.mode4:after {
		content: "申";
	}
	.uppertext.mode_now {
		top:calc( 50% - 13px );
		font-weight: 700;
		font-size: 80%;
	}

	.att_gage .result {
		font-size: 80%;
		letter-spacing: 0.05em;
		font-weight: 700;
		position: absolute;
		top: 0;
		left: 0;
	}

	.cal_cell_link {
		display: block;
		background: #abc9fc;
		padding: 5px 3px;
		border-radius: 5px;
		text-decoration: none;
	}
	.cal_cell_link:hover {
		background: #e0ecff;
	}
	.cal_cell_link>span.disp_sp {
		line-height: 1.2;
		display: inline-block;
	}
	.cal_cell_link.current {
		background: #DE9C52;
	}
	.cal_cell {
		display: table;
	}
	.cell_row {
		display: table-row;
	}
	.cell_row>* {
		display: table-cell;
		padding: 2px 4px;
		font-size: 85%;
		line-height: 1.2;
	}
	.cell_row>.mode {
		padding-left: 10px;
	}
	.cal_cell .shopname {
		font-weight: 700;
		font-size: 100%;
	}
	.cal_cell * {
	}
	.result_time {
		font-size: 60%;
		line-height: 1.1;
	}
	.result_time_all {
		margin: 10px 5px 20px;
	}
	.result_time_all span {
		display: inline-block;
		background: #2A77F6;
		border-radius: 5px;
		color: #fff;
		padding: 3px 8px;
		font-size: 130%;
		margin: 0 10px 0 0;
	}

	.now_time {
		display: flex;
		flex-wrap: wrap;
		align-items: flex-start;
		justify-content: flex-end;
		line-height: 1.2;
		font-size: 85%;
		margin-bottom: 5px;
		display: none;
	}
	.now_time>* {
		margin: 5px 2px;
	}
	.now_time>*.years:after {
		content: "年";
	}
	.now_time>*.months:after {
		content: "月";
	}
	.now_time>*.days:after {
		content: "日";
	}
/*
	.now_time>*.hours:after {
		content: ":";
		animation: seconds 2s infinite;
	}
*/
	.now_time>*.colon {
		margin-right: 0;
		margin-left: 0;
		min-width: 10px;
		text-align: center;
	}
	.now_time>*.hours {
		margin-right: 0;
	}
	.now_time>*.minutes {
		margin-left: 0;
	}
/*
	@keyframes seconds {
		0% {
			opacity: 1;
		}
		49% {
			opacity: 1;
		}
		50% {
			opacity: 0;
		}
		100% {
			opacity: 0;
		}
	}
*/

	/* フッター */
	.footer {
		background: #F7F6F2;
		color: #333;
		margin-top: 30px;
		position: fixed;
		left: 0;
		bottom: 0;
		width: 100%;
		z-index: -1;
	}
	.footer a {
		color: #333;
	}
	.footer>.wrapper {
		padding-top: 20px;
	}
	.footer .copyright {
		background: #F7F6F2;
		color: #333;
		font-size: 80%;
		text-align: right;
		padding: 0 10px;
		display: flex;
		justify-content: space-between;
	}
	.has_sidebar + .footer .copyright div:first-of-type {
		margin-left: 224px;
	}
	.slim_sidebar + .footer .copyright div:first-of-type {
		margin-left: 56px;
	}

	.remove_addbtn .add_newrow,
	.remove_addbtn_para {
		display: none!important;
	}

	ul.shiborikomi,
	ul.submenu {
		list-style-type: none;
		margin: 0 auto 5px;
		display: flex;
		flex-wrap: wrap;
		font-size: 85%;
	}
	ul.shiborikomi.report_section {
		position: fixed;
		left: 236px;
		z-index: 1;
	}
	.slim_sidebar ul.shiborikomi.report_section {
		left: 68px;
	}
	.room ul.shiborikomi,
	.room ul.submenu {
		margin: 0;
	}
	.group ul.shiborikomi,
	.room ul.shiborikomi,
	.room ul.submenu {
		flex-wrap: nowrap;
		flex-basis: calc( 100% - 90px );
		overflow-x: auto;
	}

	.group ul.shiborikomi::-webkit-scrollbar,
	.room ul.shiborikomi::-webkit-scrollbar,
	.room ul.submenu::-webkit-scrollbar {
	   width: 4px;
	   height: 2px;
	   position: absolute;
	   bottom: 0;
	   transition: height 0.5s;
	}
	.group ul.shiborikomi::-webkit-scrollbar-track,
	.room ul.shiborikomi::-webkit-scrollbar-track,
	.room ul.submenu::-webkit-scrollbar-track {
	   background-color: transparent;
	}
	.group ul.shiborikomi::-webkit-scrollbar-thumb,
	.room ul.shiborikomi::-webkit-scrollbar-thumb,
	.room ul.submenu::-webkit-scrollbar-thumb {
	   background-color: #666;
	   border-radius: 8px;
	}

	ul.shiborikomi li {
		flex-basis: auto;
		margin: 0 4px;
	}
	.room ul.shiborikomi li {
		margin: 0 1px;
	}
	.shiborikomi_wrapper.room,
	.shiborikomi_wrapper.group {
		position: fixed;
		bottom: 25px;
		right: 0;
		padding-top: 2px;
		width: calc( 100% - 224px );
		background: #fff;
		margin-bottom: 0!important;
		z-index: 4;
		overflow-x: auto;
		display: flex;

	}
	.fontsize_normal .shiborikomi_wrapper.room,
	.fontsize_normal .shiborikomi_wrapper.group {
		bottom: 22px;
	}
	.fontsize_small .shiborikomi_wrapper.room,
	.fontsize_small .shiborikomi_wrapper.group {
		bottom: 18px;
	}
	.shiborikomi_wrapper.room.up {
		bottom: auto;
		top: 97px;
		padding-top: 0;
		padding-bottom: 2px;
	}
	.fontsize_normal .shiborikomi_wrapper.room.up {
		top: 94px;
	}
	.fontsize_small .shiborikomi_wrapper.room.up {
		top: 90px;
	}
	.shiborikomi_wrapper.room.up.half {
		top: 66px;
	}
	.shiborikomi_wrapper.room.up.top {
		top: 66px;
	}
	.shiborikomi_wrapper.room.up + h1,
	.shiborikomi_wrapper.room.up + h1 + .shiborikomi_wrapper {
		margin-top: 30px;
	}
	.up.room ul.shiborikomi li a,
	.up.room .shiborikomi_div ul.submenu li a {
		border-top-width: 0 !important;
		border-bottom-width: 1px !important;
		border-radius: 0 0 5px 5px;
	}
	.shiborikomi_wrapper.room .next,
	.shiborikomi_wrapper.room .prev,
	.shiborikomi_wrapper.group .next,
	.shiborikomi_wrapper.group .prev {
		position: sticky;
		top: 0.3em;
		display: none;
		width: 0;
		height: 0;
		border: 10px solid #000;
		border-width: 8px 11px;
		border-top-color: transparent;
		border-bottom-color: transparent;
		z-index: 1;
		opacity: 0;
		cursor: pointer;
		transition: opacity 1s;
	}
	.shiborikomi_wrapper.room:hover .next,
	.shiborikomi_wrapper.room:hover .prev,
	.shiborikomi_wrapper.group:hover .next,
	.shiborikomi_wrapper.group:hover .prev {
		opacity: 1;
	}
	.shiborikomi_wrapper.room .prev,
	.shiborikomi_wrapper.group .prev {
		left: 2px;
		right: auto;
		border-left-color: transparent;
	}
	.shiborikomi_wrapper.room .next,
	.shiborikomi_wrapper.group .next {
		left: auto;
		right: 2px;
		border-right-color: transparent;
	}
	.shiborikomi_wrapper.room a,
	.shiborikomi_wrapper.group a {
		white-space: nowrap;
	}
	.shiborikomi_wrapper.room + .roomcat {
		bottom: 57px;
		z-index: 3;
		border-bottom: 1px solid #000;
	}
	.fontsize_normal .shiborikomi_wrapper.room + .roomcat {
		bottom: 51px;
	}
	.fontsize_small .shiborikomi_wrapper.room + .roomcat {
		bottom: 43px;
	}
	.shiborikomi_wrapper.room + .roomcat.up {
		bottom: auto;
	}
	.shiborikomi_wrapper.room.roomcat.up {
		top: 66px;
	}
	.shiborikomi_wrapper.room.roomcat.up.fix {
		top: 95px;
	}
	.shiborikomi_wrapper.room.roomcat.up + h1 {
		margin-top: 65px;
	}
	.shiborikomi_wrapper.room.roomcat.up + h1 + .shiborikomi_wrapper {
		margin-top: 65px;
	}
	.all_room {
		position: fixed;
		bottom: 25px;
		left: 224px;
		width: 56px;
		height: 63px;
		background: #fff;
		margin-bottom: 0!important;
		z-index: 5;
		border-right: 1px solid #000;
		display: flex;
		align-items: center;
	}
	.fontsize_normal .all_room {
		bottom: 22px;
		height: 57px;
	}
	.fontsize_small .all_room {
		bottom: 18px;
		height: 49px;
	}
	.all_room.up {
		bottom: 0;
		top: 66px;
	}
	.all_room.up.half {
		bottom: 0;
		height: 32px;
		top: 66px;
	}
	.fontsize_normal .all_room.up.half {
		height: 29px;
	}
	.fontsize_small .all_room.up.half {
		height: 25px;
	}
	.all_room.up.half ul.shiborikomi {
		margin:1px auto 4px;
	}
	.all_room + .shiborikomi_wrapper.room {
		width: calc( 100% - 280px );
	}
	.all_room + .shiborikomi_wrapper.room + .roomcat {
		width: calc( 100% - 280px );
	}
	.slim_sidebar .shiborikomi_wrapper.room {
		width: calc( 100% - 56px );
	}
	.slim_sidebar .shiborikomi_wrapper.group {
		width: calc( 100% - 56px );
	}
	.slim_sidebar .shiborikomi_wrapper.all_room {
		left: 56px;
	}
	.slim_sidebar .shiborikomi_wrapper.all_room + .shiborikomi_wrapper.room,
	.slim_sidebar .shiborikomi_wrapper.all_room + .shiborikomi_wrapper.room + .shiborikomi_wrapper.roomcat {
		width: calc( 100% - 112px );
	}
	.shiborikomi_wrapper.room > ul.shiborikomi,
	.shiborikomi_wrapper.group > ul.shiborikomi {
		position: relative;
	}
	.shiborikomi_wrapper > ul.shiborikomi > li {
		position: relative;
	}
	.shiborikomi_wrapper .label_shiborikomi {
		flex-basis: 90px;
		text-align: center;
		white-space: nowrap;
	}
	.shiborikomi_disp .shiborikomi_wrapper > ul.shiborikomi > li.selected:after {
		content: "";
		position: absolute;
		top: 101%;
		left: 45%;
		left: calc( 50% - 10px );
		z-index: 5;
		display: block;
		width: 10px;
		height: 10px;
		background: #fff;
		border-top: 1px solid #000080;
		border-left: 1px solid #000080;
		transform: rotate(45deg);
	}
	.shiborikomi_second_cancel {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		z-index: 1;
	}
	ul.shiborikomi li a,
	.shiborikomi_div ul.submenu li a {
		display: inline-block;
		background: #fff;
		border-radius: 5px;
		border: 1px solid #000080;
		color: #000080;
		font-weight: bold;
		text-align: center;
		padding: 2px 4px;
		line-height: 1.6;
		text-decoration: none;
	}
	.room ul.shiborikomi li a,
	.room .shiborikomi_div ul.submenu li a {
		border-radius: 5px 5px 0 0;
		border-bottom-width: 0!important;
		font-size: 120%;
	}
	ul.shiborikomi > li > a:hover,
	ul.shiborikomi > li.selected > a,
	ul.submenu > li > a:hover,
	ul.submenu > li.selected > a {
		background: #000080;
		color: #fff;
	}

	.shiborikomi_second {
		position: absolute;
		width: calc( 100% - 240px );
		z-index: 5;
	}
	.shiborikomi_div {
		background: #fff;
		border-radius: 5px;
		border: 1px solid #800080;
		padding: 4px 10px 0;
		margin-bottom: 4px;
	}
	.shiborikomi_div h4 {
		display: none;
	}
	.shiborikomi_div > div {
		display: none;
	}
	.shiborikomi_div > div.disp {
		display: block;
	}
	.shiborikomi_div > div ul.shiborikomi li a {
		border-color: #800080;
		color: #800080;
	}
	.shiborikomi_div > div ul.shiborikomi li,
	.shiborikomi_div ul.submenu li {
		position: relative;
		max-width: 54px;
	}
	.shiborikomi_div > div ul.shiborikomi li a + .disp_select,
	.shiborikomi_div ul.submenu li a + .disp_select {
		position: absolute;
		top: 100%;
		left: 0;
		width: 100%;
		font-size: 70%;
		letter-spacing: -0.05em;
		z-index: 1;
	}
	.shiborikomi_div > div ul.shiborikomi li a + .disp_select a,
	.shiborikomi_div ul.submenu li a + .disp_select a {
		display: none;
		border-color: #000080;
		color: #000080;
		padding: 4px 2px;
		line-height: 1;
	}
	.shiborikomi_div > div ul.shiborikomi li a + .disp_select a:hover,
	.shiborikomi_div > div ul.shiborikomi li a + .disp_select a.selected,
	.shiborikomi_div ul.submenu li a + .disp_select a:hover,
	.shiborikomi_div ul.submenu li a + .disp_select a.selected {
		display: block;
		background: #000080;
		color: #fff;
	}
	.shiborikomi_div > div ul.shiborikomi li:hover .disp_select a,
	.shiborikomi_div ul.submenu li:hover .disp_select a {
		display: block;
	}
/*
	.shiborikomi_div > div ul.shiborikomi li ul {
		display: none;
		list-style-type: none;
	}
	.shiborikomi_div > div ul.shiborikomi li.selected ul {
		display: flex;
		margin-top: 4px;
	}
	.shiborikomi_div > div ul.shiborikomi li.selected ul li {
		white-space: nowrap;
		max-width: none;
	}
*/
	.shiborikomi_div > div ul.shiborikomi > li > a:hover,
	.shiborikomi_div > div ul.shiborikomi > li.selected > a,
/*	.shiborikomi_div > div ul.shiborikomi > li > ul > li > a:hover,
	.shiborikomi_div > div ul.shiborikomi > li.selected > ul > li.selected > a*/
	.shiborikomi_div > div > ul.submenu.selected > li > a:hover,
	.shiborikomi_div > div > ul.submenu.selected > li.selected > a {
		background: #800080;
		color: #fff;
	}
	.shiborikomi_div > div > ul.submenu {
		display: none;
		list-style-type: none;
	}
	.shiborikomi_div > div > ul.submenu.selected {
		display: flex;
		margin-top: 4px;
	}
	.shiborikomi_div > div > ul.submenu.selected > li {
		white-space: nowrap;
		max-width: none;
	}


	.chart_wrapper {
		width: 90%;
		flex-basis: 90%!important;
		margin: 0 auto 30px;
	}
	canvas[id*="chart"] {
		background: #fff;
	}

	.menu_close_wrapper {
		position: fixed;
		bottom: 15px;
		left: 170px;
		width: 32px;
		height: 32px;
	}
	.slim_sidebar .menu_close_wrapper {
		left: 10px;
	}
	.menu_close_wrapper .menu_close {
		display: inline-block;
		width: 32px;
		height: 32px;
		background: url(../images/menu_close.png) no-repeat center;
	}
	.slim_sidebar .menu_close_wrapper .menu_close {
		transform: rotate(180deg);
	}

	.flex_box.toppanel {
		align-items: stretch;
		justify-content: flex-start;
		margin-bottom: 20px;
	}

	.toppanel > div {
		text-align: center;
		margin-bottom: 20px;
	}
	.toppanel > div > div {
		cursor: pointer;
		position: relative;
		display: inline-block;
		background-image: linear-gradient(#fff 0, #fff 10px, #d8d8d8 100%);
		border: solid #fff;
		border-radius: 8px;
		border-width: 4px;
		box-sizing: border-box;
		padding: 0;
		box-shadow: 6px 6px 8px rgba(0,0,0,0.5);
		overflow: hidden;
		min-width: 150px;
		transition: all 0.3s ease-in-out;
		height: 100%;
		min-height: 80px;
	}
	.toppanel > div > div.selected {
		border-color: #f00;
	}
	.toppanel > div > div:hover {
		box-shadow: 4px 4px 5px rgba(0,0,0,0.7);
	}
	.toppanel > div > div .inner_flex {
/*		position: absolute;*/
		width: 100%;
		height: 100%;
		padding: 0;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: center;
	}
	.toppanel > div > div .inner_flex h4,
	.toppanel_body h4 {
		font-size: 120%;
	}
	.toppanel > div > div .inner_flex h4 {
		color: #333!important;
	}
	.toppanel > div > div .inner_flex[style*="background"] {
		background-size: cover;
	}
	.toppanel > div > div .inner_flex[style*="background"] h4 {
		color: #fff!important;
	}
	.toppanel > div > div .inner_flex[style*="background"]:after {
		content: "";
		display: block;
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		background: rgba(0,0,0,0.3);
		transition: background 0.3s ease-in-out;
	}
	.toppanel > div > div .inner_flex[style*="background"]:hover:after {
		background: rgba(0,0,0,0.1);
	}
	.toppanel > div > div .inner_flex[style*="background"] > div {
		position: relative;
		z-index: 1;
	}
	.toppanel > div > div .inner_flex[style*="background"] h4 {
		text-shadow: 0 0 4px rgba(0,0,0,0.5);
	}
	.toppanel > div > div .notice,
	.toppanel_body .notice {
		background: #FB7A23;
		color: #fff;
		text-align: center;
		font-weight: 700;
		font-size: 90%;
		padding: 4px 6px;
		border-radius: 4px;
	}
	.toppanel_body .notice {
		font-size: 80%;
		margin-right: 4px;
	}

	.toppanel_body {
		background-image: linear-gradient(#fff 0, #fff 10px, #d8d8d8 100%);
		border: solid #CDCDCD;
		border-radius: 4px;
		border-width: 1px;
		box-sizing: border-box;
		min-height: 100px;
		padding: 8px 12px;
	}
	.toppanel_body ul {
		margin-left: 30px;
	}
	.toppanel_body > * {
		display: none;
	}
	.toppanel_body > *.disp {
		display: block;
	}

	.toggle_grouphidden,
	.full_display,
	.all_hidden,
	.all_display,
	.group_display,
	.calendar,
	.calendar_pop,
	.accordion_btn,
	.submit_wrapper [type="submit"] {
		background-image: linear-gradient(#fff 0, #fff 10px, #d8d8d8 100%);
		border: solid #CDCDCD;
		border-radius: 4px;
		border-width: 1px;
		box-sizing: border-box;
		padding: 2px 8px;
		margin: 2px 0;
		display: inline-block;
		cursor: pointer;
		white-space: nowrap;
		font-size: 80%;
	}
	.submit_wrapper [type="submit"] {
		line-height: 2.0em;
	}
	.submit_wrapper [type="submit"].changed:hover {
		background: rgba(255,0,0,0.7);
	}
	.submit_wrapper [type="submit"].changed:active {
		transform: translateY(2px);
	}
	.submit_wrapper [type="submit"].changed {
		background: #f00;
		color: #fff;
	}
	.toggle_grouphidden.toggled,
	.full_display.toggled,
	.all_hidden.toggled,
	.all_display.toggled,
	.group_display.toggled {
		background: #f00;
		color: #fff;
	}

	.flex_box.rank_select_wrapper {
		align-items: center;
		margin-bottom: 4px;
	}
	.flex_box .rank_select_h4 {
		flex-basis: 90px;
	}
	.flex_box .rank_select_h4 + script + .rank_select_wrapper {
		display: flex;
		flex-wrap: wrap;
		max-width: calc( 100% - 100px );
		justify-content: flex-start;
	}
	.flex_box .rank_select {
		display: flex;
		flex-wrap: wrap;
		max-width: 100%;
		justify-content: flex-start;
	}
	.flex_box > .rank_select {
		max-width: calc( 100% - 100px );
	}
	.flex_box > .rank_select_wrapper > .rank_select {
		flex-basis: 100%;
	}
	.rank_select > div {
		flex-basis: 50px;
		text-align: center;
	}
	.rank_select span {
		text-align: center;
		display: inline-block;
		padding: 2px 0;
		width: calc( 100% - 4px );
		cursor: pointer;
		font-weight: 700;
		border: 2px solid #000;
		line-height: 1;
		white-space: nowrap;
	}
	.rank_select span.selected {
		border: 2px solid #f00!important;
		position: relative;
	}
	.rank_select span.selected:after {
		content: "";
		position: absolute;
		left: 1px;
		top: 1px;
		width: calc( 100% - 4px );
		height: calc( 100% - 4px );
		border: 1px solid #fff;
	}

	.jmanagetable_option {
		text-align:center;
		padding: 4px 0;
		display: flex;
		justify-content: space-between;
		max-width: calc( 100vw - 265px );
		transform: translateY(-35px);
/*
		position: sticky;
		left: 0;
*/
		position: sticky;
		top: 0;
		left: 0;
		width: 100%;
		z-index: 3;
		background: #FDF7EE;
	}
	#popup .jmanagetable_option {
		display: none;
	}
	.slim_sidebar .jmanagetable_option {
		max-width: calc( 100vw - 97px );
	}
	.jmanagetable_option > div:last-of-type {
		margin-left: auto;
	}
	.submit_wrapper {
		text-align: center;
/*		display: none;*/
	}
	.submit_wrapper .notice {
		color: #f00;
	}
	.submit_wrapper.disp {
		display: block;
	}

	.col_select {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}
	.col_select > * {
		margin: 0 4px 4px 0;
		padding: 2px 8px;
		background-image: linear-gradient(#fff 0, #fff 10px, #d8d8d8 100%);
		border: solid #CDCDCD;
		border-radius: 4px;
		border-width: 1px;
		box-sizing: border-box;
		cursor: pointer;
		font-size: 80%;
	}
	.col_select > *.selected {
		background: #f00;
		color: #fff;
	}

	.chart_option,
	.chart_style {
		list-style-type: none;
		display: flex;
		justify-content: center;
		margin-bottom: 8px;
	}
	.chart_option li,
	.chart_style li {
		margin: 0 8px 8px;
		position: relative;
	}
	.chart_option li input,
	.chart_style li input {
		left: 4px;
		top: 7px;
		position: absolute;
	}
	.chart_option li label,
	.chart_style li label {
		display: inline-block;
		background-image: linear-gradient(#fff 0, #fff 10px, #d8d8d8 100%);
		border: solid #CDCDCD;
		border-radius: 4px;
		border-width: 1px;
		padding: 1px 4px 1px 20px;
		box-sizing: border-box;
	}

	.logintable {
		background: #fff;
		box-shadow: 0 0 15px rgba(0,0,0,0.1);
		min-width: 365px;
		border-radius: 8px!important;
	}
	h1.login_h1 {
		font-size: 250%;
		color: #fff;
		text-shadow: 0 0 8px rgba(0,0,0,0.3);
		margin-bottom: 24px;
	}
	.logintable th,
	.logintable td {
		padding: 1.2em 2em;
		border-top-color: transparent!important;
		border-bottom-color: transparent!important;
		border-right: 0!important;
		border-left: 0!important;
	}
	.logintable th.nopadding,
	.logintable td.nopadding {
		padding: 0!important;
	}
	.logintable th.nopadding input,
	.logintable td.nopadding input {
		border: 0;
		border-radius: 3px;
		font-size: 150%;
		box-shadow: 0 0 8px inset rgba(0,0,0,0.2);
		margin: 0 16px;
	}
	.entry-content .logintable .submit_wrap button[type="submit"] {
		font-size: 90%;
		line-height: 1;
		background: #1b2b50;
		color: #fff;
		transition: background 0.3s linear;
	}
	.entry-content .logintable .submit_wrap button[type="submit"]:hover {
		background: #f00;
	}
	.entry-content .logintable .submit_wrap button[type="submit"]:after {
		top: calc( 50% - 0.5em );
		border-color: transparent transparent transparent #fff;
	}
/*
	.video_wrapper {
		position: fixed;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
	}
	.video_inner {
		position: relative;
	}
	.video_inner:after {
		content: "";
		display: block;
		padding-top: 53%;
	}
	video[autoplay][muted] {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
	}
*/

	#key_wrap {
		width: 100%;
		height: 100vh;
		position: relative;
		overflow: hidden;
		z-index: -1;
	}
	#keyVisual {
		width: 100%;
		height:100%;
		position: relative;
	}
	.videoBox {
		position: relative;
		width: 100%;
		height: 100%;
	}
	.videoBox:after {
		content: "";
		display: block;
		width: 100%;
		height: 100%;
		position: fixed;
		left: 0;
		top: 0;
		background: rgba(0,0,0,0.4);
		z-index: 0;
	}
	video {
		min-height: 100%;
		min-width: 100%;
		position: fixed;
		top: 0;
		left: 0;
		overflow: hidden;
	}


	#orient,
	#popup {
		background: rgba(0,0,0,0.5);
		width: 100%;
		height: 100%;
		position: fixed;
		left: 0;
		top: 0;
		display: none;
		z-index: 10;
	}
	#orient .content_wrap {
		position: relative;
		width: 100%;
		height: 100%;
	}
	#orient .content {
		position: absolute;
		background: #fff;
		border-radius: 8px;
		min-width: 250px;
		padding: 20px;
		z-index: 2;
	}
	#orient .content.arrow_r:after,
	#orient .content.arrow_l:after {
		content: "";
		position: absolute;
		right: calc( 100% - 10px );
		top: calc( 50% - 10px );
		display: block;
		width: 15px;
		height: 15px;
		background: #fff;
		transform: rotate(45deg);
	}
	#orient .content.arrow_r:after {
		right: auto;
		left: calc( 100% - 10px );
	}


	#orient.display,
	#popup.display {
		display: block;
	}
	#popup .outer {
		display: table;
		max-width: 1080px;
		height: 100vh;
		margin: 0 auto;
		overflow-y: auto;
		position: relative;
		z-index: 2;
	}
	#popup .inner {
		vertical-align: middle;
		display: table-cell;
	}
	#popup .inner .content {
		background: #fff;
		padding: 20px;
		max-height: 80vh;
		overflow-y: auto;
	}
/*
	#popup.orient .inner .content {
		position: absolute;
		min-width: 250px;
	}
*/
	#popup.disable .inner .content {
		border-radius: 10px;
		font-weight: bold;
	}
	#popup .inner .oveflow_wrapper {
		max-height: 85vh;
		overflow-y: auto;
	}
	#popup .inner table.param {
		max-width: 1000px;
		margin: 0 auto;
		background: #fff;
	}
	#popup .inner table.param th {
		background: #777;
		color: #fff;
		border-color: #fff;
	}
	#popup .inner .notice {
		background: #efefef;
		text-align: right;
		border-radius: 0 0 4px 4px;
		padding: 2px;
		text-align: center;
	}
	#popup .inner .notice_close {
		font-size: 80%;
		background: #999;
		display: inline-block;
		padding: 2px 4px;
		color: #fff;
		border-radius: 4px;
		cursor: pointer;
	}
	.notice_pop:last-of-type > p {
		margin-bottom: 0;
	}
	#popup .inner table.param [class*="status_"] {
		display: inline-block;
		border-radius: 5px;
		background: #f00;
		color: #fff;
		font-size: 90%;
		padding: 2px 8px;
	}
	#popup .inner table.param .status_1 {
		background: #090;
	}
	#popup .inner table.param .status_2 {
		background: #00f;
	}

	#orient .close,
	#popup .close {
		position: fixed;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		z-index: 1;
		cursor: pointer;
	}
	#orient .close_btn,
	#popup .close_btn {
		position: absolute;
		right: -12px;
/*		top: 86px;*/
		width: 30px;
		height: 30px;
		background: rgba(255,255,255,0.4);
		border-radius: 50%;
		z-index: 2;
		cursor: pointer;
		transform: translateY(-30px);
	}
	#orient .close_btn::before,
	#orient .close_btn::after,
	#popup .close_btn::before,
	#popup .close_btn::after {
		content: "";
		display: block;
		width: 20px;
		height: 2px;
		background: #000;
		position: absolute;
/*		top: 100px;*/
		right: 14px;
	}
	#orient .close_btn::before,
	#popup .close_btn::before {
		transform: rotate(45deg) translateX(16px) translateY(3px);
	}
	#orient .close_btn::after,
	#popup .close_btn::after {
		transform: rotate(-45deg) translateY(16px) translateX(-3px);
	}

	.orient_select {
		animation: attention_color 1s linear infinite;
		position: relative;
		z-index: 100;
	}
	.orient_select a {
		animation: attention_color 1s linear infinite;
	}
	@keyframes attention_color {
		0% {
			background: #fff;
		}

		50% {
			background: #ff0;
		}

		100% {
			background: #fff;
		}
	}
	a.active {
		color: #fff!important;
		background: #f00!important;
	}

	.invoice0.ibutton {
		display: none!important;
	}

	.entry-content > .notice {
		background: #fff;
		border-radius: 5px;
		color: #F00;
		font-weight: bold;
		border: 1px solid #F00;
		padding: 4px 10px;
		margin-bottom: 12px;
	}
	.entry-content > .notice p {
		margin: 2px 0 0;
	}
	.entry-content > .notice p:first-of-type {
		margin-top: 0;
	}

	table.alert_table tr b {
		cursor: pointer;
		background: #000;
		color: #fff;
		display: inline-block;
		padding: 2px 4px;
		border-radius: 4px;
	}
	table.alert_table tr b.selected {
		background: #f00;
	}
	table.alert_table tr span.alert_cancel {
		display: inline-block;
		margin-left: 10px;
		font-size: 80%;
		text-decoration: underline;
		cursor: pointer;
	}
	table.alert_table tr[class^="alert_level"] {
		display: none;
	}
	table.alert_table tr[class^="alert_level"].disp {
		display: table-row;
	}

	h3.trigger_pop {
		padding-top: 20px;
		margin-top: 44px;
	}
	.week_setting {
		font-size: 70%;
		margin-bottom: 20px;
	}
	.popup_calendar {
		font-size: 90%;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		max-height: calc( 100vh - 290px );
		overflow-y: auto;
	}
	.popup_calendar .jmanagetable_wrapper {
		padding-top: 0;
	}
	.popup_calendar > div {
		flex-basis: 50%;
	}
	.popup_calendar .jmanagetable select {
		font-size: 80%;
		padding: 5px;
		width: 76px;
	}
	.popup_calendar table.c .label_text.display_input + .input_wrapper {
		margin-left: 0;
	}

	.modal {
		position: fixed;
		bottom: 50px;
		right: 30px;
		z-index: 2;
		background: #fff;
		border-radius:  8px;
		box-shadow: 0 0 5px rgba(0,0,0,0.3);
		padding: 16px 24px;
		animation: animation-modal 5s forwards;
	}

	.master_copy {
		position: relative;
		transition: none;
	}
	.master_copy.changed {
		background-color: #f00!important;
		color: #fff!important;
	}

	#overlap_loading {
		position: fixed;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		z-index: 999;
		background: rgba(0,0,0,0.5);
		display: table;
		width: 100%;
		height: 100%;
	}
	#overlap_loading>div {
		display: table-cell;
		vertical-align: middle;
		text-align: center;
	}
	#overlap_loading>div>div {
		display:inline-block;background: #fff;border-radius: 8px;padding: 12px 16px;
	}
/*
	.numeric_td {
		text-shadow: 0.2px 0 0 #000, -0.2px 0 0 #000, 0 0.2px 0 #000, 0 -0.2px 0 #000;
		line-height: 1.5 !important;
		font-size: 130%;
	}
*/


	/* ダイアログの全体的なスタイル */
	.ui-dialog {
/*
		border: 1px solid #007bff;
		border-radius: 8px;
		box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
		z-index: 100;
		background: #FFF;
*/
		position: fixed;
		top: 50% !important;
		left: 50% !important;
		transform: translate(-50%, -50%);
		border: 1px solid #ff0000;
		border-radius: 8px;
		box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
		z-index: 1000;
		background: #FFF;
	}

	/* ダイアログタイトルバーのスタイル */
	.ui-dialog-titlebar {
		background: #ff0000 url(../images/caution.png) no-repeat center left 12px / 34px auto;
		color: white;
		padding: 10px 10px 10px 48px;
		border-radius: 8px 8px 0 0;
	}

	/* タイトルテキストのスタイル */
	.ui-dialog-title {
		font-size: 16px;
		font-weight: bold;
	}

	/* ダイアログコンテンツのスタイル */
	.ui-dialog-content {
		padding: 20px;
		font-size: 14px;
	}

	/* ダイアログボタンのスタイル */
	.ui-dialog-buttonpane {
		background: #f1f1f1;
		border-top: 1px solid #ddd;
		padding: 10px;
		text-align: right;
		border-radius: 0 0 8px 8px;
	}

	/* ボタンのスタイル */
	.ui-dialog-buttonpane button {
		background: #ff0000;
		color: white;
		border: none;
		padding: 8px 16px;
		font-size: 14px;
		border-radius: 4px;
		cursor: pointer;
		margin-left: 10px;
	}
	.ui-dialog-buttonpane button:last-child {
		background: #777;
	}
	.ui-dialog-titlebar-close {
		display: none;
	}

	/* ボタンのホバースタイル */
	.ui-dialog-buttonpane button:hover {
		background: #ff6666;
	}
	.ui-dialog-buttonpane button:last-child:hover {
		background: #999;
	}

	/* モーダルオーバーレイのスタイル */
	.ui-widget-overlay {
		background: rgba(0, 0, 0, 0.5);
	}
}


@keyframes animation-modal {
    0%{
        opacity: 1;
	z-index: 2;
    }
    90%{
        opacity: 1;
	z-index: 2;
    }
    100%{
        opacity: 0;
	z-index: -1;
    }
}

@media print,screen and ( min-width: 500px ) {
	.toppanel > div {
		flex-basis: 49%;
	}
}
/*
@media print,screen and ( min-width: 600px ) {
	.rank_select > div {
		flex-basis: 25%;
	}
}
*/
@media print,screen and ( min-width: 768px ) {
	/* デザイン共通 */
	.wrapper {
		padding-left: 2em;
		padding-right: 2em;
	}
	#spcover {
		display: none!important;
	}

	/* ナビゲーション */
	button.menu-toggle {
		display: none;
	}
	.flex_box .nav,
	body.toggled-on .nav {
		display: block;
		position: static;
		padding: 0;
		width: calc( 100% - 250px );
		flex-basis: calc( 100% - 250px );
	}
	.flex_box .now_time,
	body.toggled-on .now_time {
/*		width: calc( 100% - 250px );
		flex-basis: calc( 100% - 250px );*/
		position: fixed;
		right: 0;
		top: 0;
	}
	.nav h3 {
		margin-top: 20px;
		margin-right: 10px;
		text-align: right;
	}
	.nav ul li {
		border: 0;
	}
/*
	.nav ul li:last-of-type {
		border: 1px solid #fff;
	}
*/
	.nav ul li a {
		padding: 6px 8px;
		text-align: center;
	}
	.nav > ul > li {
/*		flex: 1;*/
		width: auto;
		flex-basis: auto;
		margin: 0 10px;
		position: relative;
		line-height: 1;
	}
	.nav > ul > li > ul {
		position: absolute;
		top: 100%;
		right: 0%;
		display: none;
		padding: 10px 0 0 0;
		min-width: 100%;
		white-space: nowrap;
	}
	.nav > ul > li:hover > ul {
		display: block;
	}
	.nav > ul > li:nth-last-of-type(3) > ul {
		right: -10px;
	}
	.nav > ul > li:nth-last-of-type(2) > ul {
		right: -25px;
	}
	.nav > ul > li:last-of-type > ul {
		right: -30px;
	}
	.nav > ul > li > ul li {
		border: 1px solid #222a35 !important;
	}

	.cal_cell_link>span.disp_sp {
		display: none;
	}

	.entry-content .att_table td {
		padding: 0.6em 1.2em;
	}

	h1 {
		font-size: 140%;
	}
/*
	.chart_wrapper {
		flex-basis: 45%!important;
	}
*/
	.toppanel > div {
		flex-basis: 220px;
	}
	.toppanel > div > div {
		min-width: 200px;
		border-radius: 50%;
		padding: 0;
	}
	.toppanel > div > div:after {
		content: "";
		display: block;
		padding-top: 100%;
	}
	.toppanel > div > div .inner_flex {
		position: absolute;
		padding: 0;
	}
/*
	.rank_select > div {
		flex-basis: 20%;
	}
*/
	.entry-content > .notice {
		position: absolute;
		bottom: 10px;
		left: 10px;
		z-index: 4;
	}
	.shiborikomi_wrapper.room .next,
	.shiborikomi_wrapper.room .prev,
	.shiborikomi_wrapper.group .next,
	.shiborikomi_wrapper.group .prev {
		display: block;
	}

	.icon_text {
		position: absolute;
		left: -50%;
		background: #333;
		border: 1px solid #fff;
		color: #fff;
		font-weight: bold;
		border-radius: 4px;
		padding: 4px;
		font-size: 90%;
		display: none;
		white-space: nowrap;
		bottom: 100%;
		z-index: 100;
	}

	.nav > ul > li:last-child .icon_text {
		left: auto;
		right: -50%;
	}

	.nav > ul > li:hover .icon_text {
		display: inline-block;
	}
}
/*
@media print,screen and ( min-width: 900px ) {
	.rank_select > div {
		flex-basis: 16.667%;
	}
}
*/
/*
@media print,screen and ( min-width: 1020px ) {
	.flex_box.toppanel {
		flex-wrap: nowrap;
		overflow: auto;
	}
	.toppanel > div {
		margin: 0 12px 12px;
	}
	.toppanel > div > div {
		min-width: 150px;
	}
}*/
/*
@media print,screen and ( min-width: 1200px ) {
	.rank_select > div {
		flex-basis: 14.28%;
	}
}
@media print,screen and ( min-width: 1300px ) {
	.rank_select > div {
		flex-basis: 12.5%;
	}
}
@media print,screen and ( min-width: 1400px ) {
	.rank_select > div {
		flex-basis: 11.11%;
	}
}
@media print,screen and ( min-width: 1500px ) {
	.rank_select > div {
		flex-basis: 10%;
	}
}
@media print,screen and ( min-width: 1600px ) {
	.rank_select > div {
		flex-basis: 9.09%;
	}
}
*/
/*
@media print,screen and ( min-width: 992px ) {
}

@media print,screen and ( min-width: 1200px ) {
}
*/
@media print,screen and ( min-width: 1350px ) {
	.wrapper {
		max-width: 1400px;
	}
	.chart_wrapper {
		width: 48%;
		flex-basis: 48%!important;
	}
	.icon_text {
		position: static;
		background: transparent;
		border: 0;
		font-weight: normal;
		display: inline-block;
		cursor: pointer;
	}
	.nav ul li .account_icon + .icon_text {
		margin-left: 4px;
	}
}
/*
@media print,screen and ( min-width: 1350px ) {
	.main.has_sidebar > .wrapper > .entry-content > h1:nth-of-type(1) {
		float: none;
		position: absolute;
		right: 10px;
		z-index: 1;
	}
}
*/
@media print,screen and ( min-width: 1490px ) {
	.nav > ul > li:last-of-type > ul {
		right: -50px;
	}
}
@media print,screen and ( min-width: 1800px ) {
	.wrapper {
		max-width: 1700px;
	}
}