@charset "UTF-8";
:root {
	/* メインカラー指定 */
  --main-color: #4169FF;
}
body {
	margin: 0;
	padding: 0;
	background-color: #fff;
	color: #333333;
	font-size: 15px;
	line-height: 2;
	/*font-family: Arial;*/
}
.fas,
.fa-solid {
  font-family: 'Font Awesome 6 Free';
  font-weight: 900;
}

p,
h1,
h2,
h3,
h4,
h5,
h6,
dl,
dd {
	margin: 0;
	padding: 0;
}
h1,
h2 {
	font-size: 17.5px;
}
img {
	vertical-align: bottom;
}

ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

a {
	text-decoration: none;
}
/*
a,
a:visited,
a:hover,
a:active {
	 color: inherit;
}
*/
div {
	margin: 0;
	padding: 0;
}

.flex {
	display: flex;
}

.tablet {
	display: none;
}

button {
	margin: 0;
	padding: 0;
}

/*
input {
	border-style: none;
	border: 1px solid #000;
}
*/
select {
	font-size: 13px;
}

.text_right {
	text-align: right;
}

.text_left {
	text-align: left;
}

.text_center {
	text-align: center;
}

.item_text {
    font-weight: bold;
    color: #FFFFFF;
}
/*================================================== 
ボタンの装飾・クラスにbtn-decorationをつけると装飾が付きます
=====================================================*/

.btn-decoration {
	font-family: Arial;
	color: #ffffff;
	font-size: 16px;
	padding-top: 10px;
	padding-right: 20px;
	padding-bottom: 10px;
	padding-left: 20px;
	text-decoration: none;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	-webkit-box-shadow: 0px 8px 6px #e3e3e3;
	-moz-box-shadow: 0px 8px 6px #e3e3e3;
	box-shadow: 0px 2px 8px #e3e3e3;
	border: solid #f5fdff 4px;
	background: -webkit-gradient(linear, 0 0, 0 100%, from(#61c7e0), to(#418da8));
	background: -moz-linear-gradient(top, #61c7e0, #418da8);
}

.btn-decoration:hover {
	background: #37a4bf;
}

/*================================================== 
ボタンの装飾・クラスにbtn-decoration-2をつけると装飾が付きます
=====================================================*/

.btn-decoration-2 {
	background-color: rgb(40, 146, 207);
	border-radius: 3px;
	color: #fff;
	padding: 10px;
	letter-spacing: 5px;
	cursor: pointer;
}

/*================================================== 
ボタンの装飾・クラスにbtn-decoration-3をつけると装飾が付きます
=====================================================*/

.btn-decoration-3 {
	background-color: rgb(50, 107, 139);
	border-radius: 3px;
	color: #fff;
	padding: 10px;
	letter-spacing: 5px;
	cursor: pointer;
}

/*================================================== 
ボタンの装飾・クラスにbtn-decoration-4をつけると装飾が付きます
=====================================================*/

.btn-decoration-4 {
	background-color: rgb(107, 107, 107);
	border-radius: 3px;
	color: rgb(0, 0, 0);
	padding: 10px;
	letter-spacing: 5px;
	cursor: pointer;
}

/*================================================== 
ボックスの装飾・クラスにbox-decorationをつけると装飾が付きます
=====================================================*/

.box-decoration {
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	-webkit-box-shadow: 0px 1px 10px #488a9e;
	-moz-box-shadow: 0px 1px 10px #488a9e;
	box-shadow: 0px 1px 10px #488a9e;
	border: solid #4169e1 1px;
	background: #fafafa;
}
/*
.box-decoration { 追加 //なんで追加した？
	//width: 100%;//とりあえず無効にしとく
}
*/
/*  */
.btn_orenge {
	background-color: rgb(207, 121, 40);
}
/*================================================== 
ページ送り
=====================================================*/

.pageNav01 {
	margin: 0 0 10px;
	padding: 10px 10px 5px;
	background: #eee;
	text-align: center;
}

.pageNav01 li {
	display: inline;
	margin: 0 2px;
	padding: 0;
}

.pageNav01 li span,
.pageNav01 li a {
	display: inline-block;
	margin-bottom: 5px;
	padding: 1px 8px;
	background: #fff;
	border: 1px solid #aaa;
	text-decoration: none;
	vertical-align: middle;
}

.pageNav01 li a:hover {
	background: #eeeff7;
	border-color: #00f;
}

/*================================
indexファイルのcssここから↓
======================================*/

/*=================================================
検索窓のためのCSS
===================================================*/

.sbtn2 {
	height: 50px;
	position: absolute;
	left: 145px;
	top: 1;
	background: none;
	color: #666;
	border: none;
	font-size: 20px;
	cursor: pointer;
}

#sbtn5:hover {
	color: #7fbfff;
}

.fa-search {
	margin-bottom: 15px;
}

/*================================================== 
ヘッダー
=====================================================*/
header {
	background: rgb(65, 105, 255);
	max-width: initial;
	padding: 10px;
	margin-bottom: 20px;
}
.iframe-color {
	overflow: hidden;
}

.rom-info {
	font-size: 15px;
}

.container {
	margin: 0 auto;
	padding: 0 10px 0 10px;
}

.header-container {
	height: 40px;
	margin: 0 auto;
}
@media screen and (max-width: 768px) {
	.header-container {
		height: auto;
	}
}
.header-top {
	display: flex;
	height: 100%;
	justify-content: space-around;
}
@media screen and (max-width: 768px) {
	.header-top {
		display: block;
	}
}
.head-logo {
	width: auto;
	height: 100%;
	max-height: 40px;
	object-fit: contain;
}

.white {
	color: #fff;
}

#time {
	display: block;
	color: #fff;
}
.attime {
	color: #fff;
}

.user-info {
	letter-spacing: 3px;
	font-size: 16px;
	margin-top: 10px;
	margin-right: 10px;
	margin-bottom: 10px;
	padding: 10px;
	border-radius: 0;
}

.fa-sign-in-alt {
	letter-spacing: 3px;
}

.fa-question,
.weather {
	color: #fff;
	font-weight: bold;
	padding: 14px 10px 10px 10px;
	letter-spacing: 2px;
}

.head-help {
	font-size: 16px;
	padding-top: 0px;
	padding-right: 0px;
	padding-left: 0px;
	padding-bottom: 0;
	max-width: 100px;
	height: 43px;
	width: 110px;
	text-align: center;
	height: 51px;
	margin-left: auto;
	margin-bottom: -12px;
}

.red {
	color: crimson;
}

.space {
	text-indent: 10px;
}

.space4 {
	text-indent: 4px;
}
.header-bottom {
	display: flex;
	justify-content: center;
	margin: 18px 0;
}
.head-bottom {
	width: 100%;
	height: auto;
}
.space > a {
	border-bottom: 1px solid;
	padding-bottom: 3px;
	color: #fff;
}
/* ヘッダーのiframe */
.log-info-iframe {
	display: block;
	border-style: none;
	width: 400px;
	height: 40px;
}
@media screen and (max-width: 768px) {
	.log-info-iframe {
		width: auto;
	}
}
.iframe-color {
	background-color: rgb(65, 105, 255);
}

.wareki {
	margin-left: 10px;
	color: #fff;
}

.new a {
	border-bottom: 1px solid;
	padding-bottom: 3px;
	margin-right: 10px;
	color: #fff;
}

.stop a {
	border-bottom: 1px solid;
	padding-bottom: 3px;
	color: #fff;
}

/* ヘッダーの検索テキストBOX */
#search-wrap {
	 float: left;
}
.form-header-search {
	position: relative;
	max-width: 300px;
	padding: 5px 10px 0 10px;
}
.sbox-header-search {
	height: 32px;
	padding: 0 10px;
	position: relative;
	left: 0;
	top: 0;
	border-radius: 2px;
	outline: 0;
	background: #eee;
}
/* ヘッダーのヘルプボタン */
.header-help {
	 float: left;
	 margin: 0 10px;
	 background: #418da8;
}
/*================================================== 
サイドバーの装飾
=====================================================*/

.button {
	display: inline-block;
	width: 100%;
	text-decoration: none;
	line-height: 54px;
	outline: none;
	padding-left: 5px;
}

.button::before,
.button::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: "";
}

.button,
.button::before,
.button::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
}

/*================================*/

.button {
	position: relative;
	z-index: 2;
	/*background-color: rgb(250, 250, 250);*/
	color: rgb(56, 56, 56);
	line-height: 50px;
}

.button:hover {
	background-color: #4169e1;
	border-color: #ffffff;
	color: #ffffff;
}

.button::before,
.button::after {
	left: 0;
	width: 100%;
	height: 50%;
	/*background-color: rgb(255, 255, 255);*/
}

.button::before {
	top: 0;
}

.button::after {
	bottom: 0;
}

.button:hover::before,
.button:hover::after {
	height: 0;
	/*background-color: #ffffff;*/
	/* ホバー時の色 */
}

.sidebar-decoration {
	-webkit-box-shadow: 0px 1px 10px #488a9e;
	-moz-box-shadow: 0px 1px 10px #488a9e;
	box-shadow: 0px 1px 10px #488a9e;
	border: solid #4169e1 1px;
	/*background: #fafafa;*/
	margin: 0px 10px 0px 0px;
}

.aside-text {
	margin: 3px;
}

.button {
	content: "";
	border-left: 6px solid rgb(65, 105, 255);
}

.sidebar {
	width: 15%;
}

.fa-home,
.fa-calendar-alt,
.fa-clock,
.fa-tasks,
.fa-list,
.fa-edit,
.fa-file-import,
.fa-address-card,
.fa-user,
.fa-question-circle,
.fa-history,
.fa-comments,
.fa-retweet,
.fa-discourse,
.fa-cookie-bite,
.fa-envelope,
.fa-sign-out-alt {
	font-size: 20px;
	margin-right: 7px;
}
.fa-users
{
	font-size: 14px;
	margin-right: 7px;
}
.pull-style {
	border-style: none;
	font-size: 16px;
	cursor: pointer;
	width: 100%;
}

/*================================
フッター
======================================*/

.footer {
	text-align: center;
	background-color: #4169e1;
	margin: 20px 0 0 0;
	max-width: initial;
	padding: 10px 0;
	color: #fff;
}

/*================================
ページトップリンク
======================================*/

#page-top a {
	display: flex;
	justify-content: center;
	align-items: center;
	background: #61c7e0;/*#b2d850;*/
	border-radius: 5px;
	width: 60px;
	height: 60px;
	color: #fff;
	text-align: center;
	text-transform: uppercase;
	text-decoration: none;
	font-size: 1rem;/*0.6rem;*/
	transition: all 0.3s;
}

#page-top a:hover {
	background: #777;
}

#page-top {
	position: fixed;
	right: 10px;
	bottom: 10px;
	z-index: 2;
	opacity: 0;
	transform: translateY(100px);
}

/*　上に上がる動き　*/

#page-top.UpMove {
	animation: UpAnime 0.5s forwards;
}

@keyframes UpAnime {
	from {
		opacity: 0;
		transform: translateY(100px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/*　下に下がる動き　*/

#page-top.DownMove {
	animation: DownAnime 0.5s forwards;
}

@keyframes DownAnime {
	from {
		opacity: 1;
		transform: translateY(0);
	}
	to {
		opacity: 1;
		transform: translateY(100px);
	}
}

/*================================
メインコンテンツ
======================================*/

.main-container {
	width: 85%;
}

/*================================
indexファイルのcssここまで
======================================*/

/*================================
Loading背景画面設定のCSS
======================================*/

#splash {
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: 1001;
	background: #eee;
	text-align: center;
	color: #fff;
}

#splash_logo {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

#splash_logo svg {
	width: 500px;
}

/*========================================
SVGアニメーション内の指定 
============================================*/

#mask path {
	fill-opacity: 0;
	transition: fill-opacity 0.5s;
	/*カラーがつく際のアニメーション0.5秒で変化*/
	fill: none;
	stroke: rgb(122, 33, 33);
	stroke-width: 0.4px;
}

/*アニメーション後に.doneというクラス名がで付与された時の指定*/

#mask.done path {
	fill: rgb(11, 149, 173);
	fill-opacity: 1;
	stroke: none;
}

/*================================================== 
アコーディオン
=====================================================*/

.help-tittle {
	display: inline-block;
}

.help-back {
	border-style: none;
	background-color: #fff;
	font-size: 30px;
	vertical-align: bottom;
	margin-right: 10px;
	position: absolute;
	right: 0px;
}

.cursor {
	cursor: pointer;
}

.disp-box input {
	display: none;
}

.disp-box .text {
	overflow: hidden;
	display: none;
	margin-bottom: 10px;
	margin-top: 10px;
	padding: 10px;
	transition: 0.2s;
}

.disp-box input:checked ~ .text {
	height: auto;
	display: block;
}

.text {
	animation-name: fadein;
	animation-duration: 1s;
	position: relative;
}

@keyframes fadein {
	from {
		opacity: 0;
		transform: translatesy(0px);
	}
	to {
		opacity: 1;
		transform: translatey(0);
	}
}

/*================================================== 
page-content内のcss
=====================================================*/

.page-content {
	padding: 10px;
	font-size: 18px;
	margin-bottom: 10px;
}

/*================================================== 
タブレット用css
=====================================================*/

@media screen and (max-width: 768px) {
	/*================================================== 
ハンバーガーメニュー
=====================================================*/
	/*========= ナビゲーションのためのCSS ===============*/
	#g-nav {
		position: fixed;
		z-index: 999;
		top: 0;
		right: -120%;
		width: 100%;
		height: 100vh;
		transition: all 0.6s;
	}
	/*アクティブクラスがついたら位置を0に*/
	#g-nav.panelactive {
		right: 0;
	}
	/*ナビゲーションの縦スクロール*/
	#g-nav.panelactive #g-nav-list {
		position: fixed;
		z-index: 999;
		width: 100%;
		height: 100vh;
		overflow: auto;
		-webkit-overflow-scrolling: touch;
	}
	/*ナビゲーション*/
	#g-nav ul {
		position: absolute;
		z-index: 999;
		top: 94%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: 100%;
	}
	#g-nav li {
		list-style: none;
	}
	#g-nav li a {
		color: #333;
		text-decoration: none;
		padding: 10px;
		display: block;
		text-transform: uppercase;
		letter-spacing: 0.1em;
		font-weight: bold;
	}
	/*========= ボタンのためのCSS ===============*/
	.openbtn {
		position: absolute;
		z-index: 1000;
		top: 10px;
		right: 10px;
		cursor: pointer;
		width: 50px;
		height: 50px;
	}
	/*×に変化*/
	.openbtn span {
		display: inline-block;
		transition: all 0.4s;
		position: absolute;
		left: 14px;
		height: 3px;
		border-radius: 2px;
		background-color: rgb(66, 66, 66);
		width: 45%;
	}
	.openbtn span:nth-of-type(1) {
		top: 15px;
	}
	.openbtn span:nth-of-type(2) {
		top: 23px;
	}
	.openbtn span:nth-of-type(3) {
		top: 31px;
	}
	.openbtn.active span:nth-of-type(1) {
		top: 18px;
		left: 18px;
		transform: translateY(6px) rotate(-45deg);
		width: 30%;
	}
	.openbtn.active span:nth-of-type(2) {
		opacity: 0;
	}
	.openbtn.active span:nth-of-type(3) {
		top: 30px;
		left: 18px;
		transform: translateY(-6px) rotate(45deg);
		width: 30%;
	}
	.pull-style {
		width: 50%;
	}
	.user-flex {
		display: flex;
		text-indent: 10px;
	}
}

/*================================================== 
ハンバーガー終わり
=====================================================*/
@media screen and (max-width: 768px) {
	.logbox {
		justify-content: center;
	}
	.pc {
		display: none;
	}
	.tablet {
		display: block;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.main-container {
		width: 100%;
	}
	#form2 {
		margin: 0;
	}
	.head-help {
		margin: 0;
	}
	.user-info {
		font-size: 15px;
		top: 5% !important;
		background-color: #fff;
	}
	.rom-info {
		font-size: 16px;
	}
	#search-wrap {
		margin-right: 35px;
	}
	.tab-help {
		font-weight: bold;
		position: relative;
		top: 5px;
	}
	.tab-icon {
		display: none !important;
	}
}

@media screen and (max-width: 580px) {
	.rom-info {
		display: block;
	}
	.rom-icon {
		display: none;
	}
	#splash_logo svg {
		width: 300px;
	}
}

@media screen and (max-width: 375px) {
	.mobileblock {
		display: block;
	}
	#splash_logo svg {
		width: 220px;
	}
}

@media screen and (max-width: 350px) {
	.logbox {
		display: block;
		float: left;
	}
	.wareki {
		float: left;
	}
	.attime {
		float: left;
	}
	.romnumber {
		margin-left: -10px;
	}
	.new {
		float: left;
	}
}

/*================================================== 
ページタイトル
=====================================================*/
.page-tittle-container {
	margin-bottom: 10px;
	padding-left: 10px;
}

.page-tittle {
	display: inline-block;
	border-bottom: 3px double #000;
}
.page-title-container {
	margin-bottom: 10px;
	padding-left: 10px;
}

.page-title {
	display: inline-block;
	border-bottom: 3px double #000;
}
/*================================================== 
テーブル設定
=====================================================*/

.table {
	width: 100%;
	border-collapse: collapse;
	margin: 10px 0;
}

.table .table-tr {
	border-bottom: solid 2px white;
}

.table .table-tr:last-child {
	border-bottom: none;
}

.table .table-th {
	position: relative;
	text-align: left;
	width: 200px;
	background-color: #4169e1;
	color: white;
	text-align: center;
	padding: 10px 0;
}
/*
.table .table-th:after {
	 display: block;
	content: "";
	width: 0px;
	height: 0px;
	position: absolute;
	top: calc(50% - 10px);
	right: -10px;
	border-left: 10px solid #4169e1;
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent; 
}
*/
.table .table-td {
	text-align: left;
	width: 80%;
	background-color: #eee;
	padding: 10px 10px 10px 21px;
}

@media screen and (max-width: 768px) {
	.table .table-th,
	.table .table-td {
		display: block;
		width: 100%;
		overflow-wrap: break-word;
		word-break: break-all;
		padding-left: 0;
		padding-right: 0;
		text-align: left;
	}
	.table .table-th {
		padding: 0;
		text-indent: 5px;
	}
	.table .table-td {
		text-indent: 10px;
	}
	.table .table-th:after {
		display: none;
	}
}
/*================================================== 
ユーザー設定のcss
=====================================================*/

.table-container {
	padding: 10px;
	margin: 10px 10px 10px 10px;
}

.user-edit {
	width: 100%;
	border: solid 1px #CCCCCC;
	background-color: white;
	border-spacing: 5px;
}
.user-edit th,
.user-edit td {
	height: 42px;
	border: solid 1px #CCCCCC;
	border-spacing: 5px;
	padding: 5px;
}
.user-edit th {
	width: 200px;
	text-align: right;
	font-weight: bold;
	color: #FFFFFF;
	background-color: var(--main-color);/*#4169FF;*/
}
.user-edit td {
	text-align: left;
}
.user-edit-item {
	width: 200px;
	font-weight: bold;
	color: #FFFFFF;
	text-align: right;
	background-color: var(--main-color);/*#4169FF;*/
}
@media screen and (max-width: 580px) {
	.user-edit-table td {
		display:	block;
		width:	100%;
	}
}
.user-edit-state {
	text-align: center!important;
	background-color: #FFFFCC;
}
/*================================================== 
グループ設定・承認
=====================================================*/

.input-dec {
	border: 1px solid #000;
	cursor: pointer;
}

.table-25 {
	width: 25%;
}
/* 
@media screen and (max-width: 768px) {
	.block {
		display: block; 
	}
}
*/
.group-edit {
	width: 100%;
	border: solid 1px #CCCCCC;
	background-color: white;
	border-spacing: 0px;
	table-layout: fixed;
}
.group-edit th,
.group-edit td {
	height: 42px;
	border: solid 1px #CCCCCC;
	border-spacing: 0px;
	padding: 5px;
}
.group-edit th {
	width: 250px;
	text-align: right;
	font-weight: bold;
	color: #FFFFFF;
	background-color: var(--main-color);/*#4169FF;*/
}
.group-edit td {
	text-align: left;
}
.group-edit textarea {
	width:100%;
}

.group-edit-item {/* 未使用 */
    font-weight: bold;
    color: #FFFFFF;
	background-color: var(--main-color);/*#4169FF;*/
}

.group-approval {
	width: 100%;
	border: solid 1px #CCCCCC;
	background-color: white;
	border-spacing: 1px;
}
/*
.group-edit th,
.group-edit td {
	//border: solid 1px #CCCCCC;
	//border-spacing: 1px;
	//padding: 0px;
}
*/
.group-edit-state {
	text-align: center!important;
	background-color: #FFFFCC;
}

@media screen and (max-width: 768px) {
	.group-edit tr,
	.group-edit th,
	.group-edit td {
		display: block;
		width: 100%;
		height: auto;
		min-height: 42px;
	}
	.group-edit th {
		text-align: left;
	}
}
/*================================================== 
スケジュール
=====================================================*/
.schedule_edit-item {
	width: 150px;
	text-align: right;
    font-weight: bold;
    color: #FFFFFF;
	background-color: var(--main-color);/*#4169FF;*/
}
* {
	box-sizing: border-box;
	/* widthにpaddingとborderを含めて計算を簡単にするため */
}

.cont {
	width: 100%;
}

.week,
.namber {
	display: flex;
	flex-wrap: wrap;
}

.day-title {
	display: flex;
	text-align: left;
	text-align: top;
}

.day,
.item {
	width: 14.28%;
	/* 100%を1行当たりのカラム数（今回は7）で割った数値 */
	border-left: 1px solid #000;
	border-bottom: 1px solid #000;
	margin: 0;
}

.day {
	border-top: 1px solid #000;
}

.day:last-child {
	border-right: 1px solid #000;
}

.item:nth-child(7n) {
	border-right: 1px solid #000;
}

.item:nth-child(7n + 1) {
	background-color: rgb(255, 204, 255);
}

.item:nth-child(7n) {
	background-color: rgb(204, 255, 255);
}

.item:hover {
	background-color: rgb(180, 180, 255);
}

.week {
	background-color: rgb(204, 204, 255);
	text-align: center;
	font-weight: bold;
}

.schedule {
	font-size: 14px;
}

.sunday {
	color: crimson;
}

.saturday {
	color: blue;
}

.day-figure {
	font-weight: bold;
	font-size: 16px;
}

.day-title > p {
	font-size: 10px;
	padding-top: 7px;
}

.moon {
	color: #000;
}

.moon:visited {
	color: #000;
}

.schedule-tittle {
	justify-content: center;
}

.fa-angle-double-left {
	vertical-align: middle;
	margin-right: 20px;
}

.fa-angle-double-right {
	vertical-align: middle;
	margin-left: 20px;
}

.fa-angle-double-left,
.fa-angle-double-right {
	color: #000;
}

.fa-angle-double-left,
.fa-angle-double-right:visited {
	color: #000;
}

.change-btn {
	padding: 5px;
}

.change-btn {
	padding: 5px;
}

/* =============================================
カレンダー内のスケジュールの折り返し
===============================================*/

.item {
	word-wrap: break-word;
	word-break: break-all;
	padding: 0 2px 0 2px;
}

.namber .item ul li {
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}

/* =============================================
スケジュールのモバイルとタブレット
===============================================*/

.table_box {
	width: 100%;
}

.table_box_mob {
	border: solid 2px #000;
}

.table_th_mob {
	border-right: solid 1px #000;
	width: 30%;
}

.table_tr_mob {
	border-bottom: solid 1px #000;
}

.table_td_mob {
	background-color: #eee;
	word-break: break-all;
	width: 70%;
}

.sunday_box {
	background-color: rgb(255, 204, 255);
}

.sutaday_box {
	background-color: rgb(204, 255, 255);
}

.weekdays_box {
	background-color: rgb(204, 204, 255);
}
/*
.table_td_mob ul li {
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}
*/
.table_th_mob > a {
	border-bottom: solid 1px #000;
}

/* =============================================
スケジュールテストのcss
===============================================*/

/* .schedule-table {
width: 100%;
border-collapse: collapse;
border: 1px solid;
}

.schedule-tr {
border: 1px solid;
}

.schedule-td {
border: 1px solid;
} */

/* =============================================
顧客情報一覧のcss
===============================================*/

#myTable .tablesorter-header {
	cursor: pointer;
	outline: none;
}

#myTable .tablesorter-header-inner::after {
	content: "▼";
	font-size: 12px;
	margin-left: 5px;
}

.client-list {
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
}
.client-list-header {
	background-color: #4169e1 !important;
	color: #fff;
}
.client-list-header-th {
	padding: 10px;
}
.client-list-header ._company {
	width: 20%;
}
.client-list-header ._address {
	width: 35%;
}
.client-list-header ._tel {
	width: 10%;
}
.client-list-header ._fax {
	width: 10%;
}
.client-list-header ._mail {
	width: 15%;
}
.client-list-header ._name {
	width: 20%;
}
.client-list-header ._branch {
	width: 15%;
}
.client-list-header ._department {
	width: 15%;
}
.client-list-header ._post {
	width: 10%;
}

.client-body {/* 元々はclient_tr */
	border: 1px solid #ccc;
}
.client-body td {/* 元々はclient_tr */
	border: 1px solid black;
}

.client_th,
.client_td {
	padding: 8px;
}

.client_tr:nth-child(odd) {
	background-color: #eee;
}

.client_container {
	padding: 10px;
}

.search_box {
	border: 1px solid #000;
}

.client_new {
	display: inline-block;
	width: 100%;
	margin-bottom: 20px;
}

.clickable-row {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all 0.3s;
	transition: all 0.1s;
}

/* マウスオーバー時 */

.clickable-row:hover {
	background-color: rgb(250, 240, 230, 0.5);
	/*cursor: pointer;*/
}

.client_form {
	margin-bottom: 20px;
}

.client_table_top .client_td_top {
	padding: 10px;
}

@media screen and (max-width: 580px) {
	.search_box {
		width: 100%;
	}
	.scroll {
		overflow-x: scroll;
	}
	.client-list {
		width: 768px;
	}
}

/*===============================================
顧客情報詳細のcss
=================================================*/

.client_details_table,
.client_history_table {
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
}

.client_details_th {
	position: relative;
	text-align: right;
	width: 20%;
	background-color: #4169e1;
	color: white;
	padding: 10px 0;
}

.client_details_th:after {
	display: block;
	content: "";
	width: 0px;
	height: 0px;
	position: absolute;
	top: calc(50% - 10px);
	right: -10px;
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent;
}

.client_details_container {
	padding: 10px;
	margin: 10px 0 20px 0;
}

.table-tr {
	border-bottom: solid 2px white;
}

.client_details_table td {
	text-align: left;
	width: 70%;
	background-color: #eee;
	padding: 10px 10px 10px 21px;
}

.client_history_table tr,
.client_history_table th,
.client_history_table td {
	background-color: #eee;
	border: 2px solid #fff;
}

.client_history_table tr th {
	background-color: #4169e1;
	color: #fff;
}

.client_history_table tr {
	width: auto;
}

.client_history_table td {
	padding: 10px;
}

.client_details_btn {
	margin: 10px 0 10px 0;
}

@media screen and (max-width: 768px) {
	.client_details_table th,
	.client_details_table td {
		display: block;
		width: 100%;
	}
	.client_details_th:after {
		display: none;
	}
	.scroll {
		overflow-x: scroll;
	}
	.client_history_table {
		width: 960px;
	}
}
/* =============================================
資産一覧のcss
===============================================*/


/*===============================================
進捗一覧のcss
=================================================*/
.progress-edit-item {
    font-weight: bold;
    color: #FFFFFF;
	background-color: #4169FF;
}

@media screen and (max-width: 580px) {
	.progress-edit-table td {
		display:	block;
		width:	100%;
	}
}



.progress_project_table_container_td {
	line-height: 1.4;
	padding: 5px;
}
.progress_scroll {
	overflow: scroll;
}

.progress_project_width {
	min-width: 1049px;
}

.progress_project_search {
	border: 1px solid rgb(124, 124, 124);
	height: 30px;
	margin-bottom: 10px;
}

.progress_project_btn {
	border: 1px solid rgb(124, 124, 124);
	height: 30px;
}

.sub_menu_box {
	display: flex;
	justify-content: space-between;
	margin: 10px 0;
}

.progress_contents {
	border-bottom: 1px solid rgb(124, 124, 124);
	border-left: 1px solid rgb(124, 124, 124);
	border-right: 1px solid rgb(124, 124, 124);
}

.progress_contents:first-child {
	border-top: 1px solid rgb(124, 124, 124);
}

.progress_project_table_container_tdsub {
	border-right: 0.5px dotted #595959 !important;
}

.progress_project_table_container_subtd {
	padding: 5px;
	line-height: 1.4;
}

.progress_contents:nth-child(odd) {
	background-color: #eee;
}

.progress {
	width: 100%;
	padding: 10px;
}

.progress_project_container {
	overflow: scroll;
	margin-bottom: 20px;
}

.progress_project_table_container,
.progress_project_table_container_td,
.progress_project_table_container_tr,
.progress_project_table_container_th {
	border: 1px solid #595959;
	border-collapse: collapse;
}

.progress_project_table_container {
	min-width: 1049px;
	width: 100%;
}

.progress_project_table_container_th {
	background-color: #4169e1;
	color: rgb(255, 255, 255);
}
.progress_project_no {
	width: 40px;
}

.progress_lproject_table_container_td_no {
	text-align: right;
}
.progress_project_project {
	width: 240px;
}

.progress_project_deadline {
	width: 80px;
}

.progress_project_person {
	width: 70px;
}

.progress_project_period {
	width: 100px;
}

.progress_project_table_container_sub {
	border-right: none !important;
}

.progress_project_table_container_subth {
	background-color: #4169e1;
	width: 50px;
}

.progress_project_progress {
	width: 110px;
}

.progress_project_update {
	width: 80px;
}
/* .progress_no {
	width: 60px;
	border-right: 1px solid rgb(124, 124, 124);
}

.progress_project {
	width: 200px;
	border-right: 1px solid rgb(124, 124, 124);
}

.progress_deadline {
	width: 120px;
	border-right: 1px solid rgb(124, 124, 124);
}

.progress_person {
	width: 120px;
	border-right: 1px solid rgb(124, 124, 124);
}

.progress_period {
	width: 220px;
	border-right: 1px solid rgb(124, 124, 124);
}

.progress_progress {
	width: 180px;
	border-right: 1px solid rgb(124, 124, 124);
}

.progress_update {
	width: 170px;
	border-right: 1px solid rgb(124, 124, 124);
}

.progress_update:last-child {
	border-right: none;
}

.progress_details,
.progress_change,
.progress_date {
	width: calc(100% / 3);
}

.progress_no,
.progress_project,
.progress_person,
.progress_sub,
.progress_deadline,
.progress_progress,
.progress_update,
.progress_details,
.progress_change,
.progress_date > p {
	padding: 10px;
}

.progress_header {
	background-color: #4169e1 !important;
	color: #fff;
	text-align: center;
	font-weight: bold;
}

.progress_period_detaile {
	padding: 10px 4px 10px 10px;
}

.progress_period_span {
	padding: 10px 10px 10px 4px;
}

.progress_figure {
	text-align: right;
}

.search_win {
	margin: 0 !important;
}

@media screen and (max-width: 960px) {
	.progress_scroll {
		overflow: scroll;
		white-space: nowrap;
	}
	.progress_header_width {
		width: 960px;
	}
} */

/*===============================================
進捗工程一覧のcss
=================================================*/

.progress_list_search select {
	width: 200px;
	height: 40px;
	margin-right: 10px;
}

.progress_list_search input {
	border: 1px solid #595959;
}
.progress_list_search {
	padding-top: 14px;
}

.progress_list_btn {
	display: flex;
}

.progress_list_container {
	margin-bottom: 20px;
}

.progress_list_new {
	margin-right: 20px;
	margin-top: 20px;
}

.progress {
	padding: 10px;
}

.progress_list_no {
	width: 40px;
}

.progress_list_project {
	width: 150px;
}

.progress_list_person {
	width: 130px;
}

.progress_list_period {
	width: 100px;
}

.progress_list_status {
	width: 100px;
}

.progress_list_progressstatus {
	width: 100px;
}

.progress_list_progres {
	width: 105px;
}

.progress_list_substance {
	width: 400px;
}

.progress_list_history {
	width: 400px;
}

.progress_list_update {
	width: 100px;
}

/* 簡易タイトル */
.progress_list_main {
	display: flex;
}

.progress_list_title {
	margin: 20px 0;
}
.progress_list_th {
	width: 150px;
}

.progress_list_th_3columns {
	max-width: 150px;
	width: 150px;
}

.progress_list_table {
	width: 100%;
}

.progress_list_table
/* .progress_list_th,
.progress_list_td */ {
	border-top: 1px solid #595959;
	border-right: 1px solid #595959;
	border-left: 1px solid #595959;
	border-collapse: collapse;
	/* border-top: 1px solid #595959;
	border-left: solid 1px #595959;
	border-right: solid 1px #595959;  */
}
.progress_list_table_last {
	border-bottom: 1px solid #595959;
}
/* .progress_list_th_3columns,
.progress_list_td_3columns {
	border-bottom: solid 1px #595959;
} */

.progress_list_th,
.progress_list_th_3columns {
	background-color: #4169e1;
	color: rgb(255, 255, 255);
}

.progress_list_td {
	padding: 0 10px;
}

.progress_header_width {
	width: 100%;
	margin: 0 auto;
}
/* 8.12 */

/* 工程メインコンテンツ */
.progress_list_container {
	overflow: scroll;
}
.progress_list_table_container {
	min-width: 1049px;
	width: 100%;
}

.progress_list_table_container_th {
	background-color: #4169e1;
	color: rgb(255, 255, 255);
}

.progress_list_table_container_subth {
	background-color: #4169e1;
}

.progress_list_table_container_sub {
	border-right: none !important;
}

.progress_list_table_container_tdsub {
	border-right: 1px dotted #595959 !important;
}

.progress_list_table_container_td {
	line-height: 1.4;
	padding: 5px;
}

.progress_list_table_container_td_no {
	text-align: right;
}

.progress_list_table_container,
.progress_list_table_container_td,
.progress_list_table_container_tr,
.progress_list_table_container_th {
	border: 1px solid #595959;
	border-collapse: collapse;
}
/* 工程メインコンテンツ */

/* アコーディオン */

.s_07 .accordion_one .accordion_header {
	color: #000;
	text-align: center;
	position: relative;
	z-index: +1;
	cursor: pointer;
	transition-duration: 0.2s;
}

.s_07 .accordion_one .accordion_header:hover {
	opacity: 0.8;
}

.s_07 .accordion_one .accordion_header .i_box {
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 50%;
	width: 15px;
	height: 15px;
	border: 1px solid #000;
	margin-top: -6px;
	box-sizing: border-box;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	transform-origin: center center;
	transition-duration: 0.2s;
	left: 2%;
}

.s_07 .accordion_one .accordion_header .i_box .one_i {
	display: block;
	width: 16px;
	height: 16px;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	transform-origin: center center;
	transition-duration: 0.2s;
	position: relative;
}

.s_07 .accordion_one .accordion_header.open .i_box {
	-webkit-transform: rotate(-360deg);
	transform: rotate(-360deg);
}

.s_07 .accordion_one .accordion_header .i_box .one_i:before,
.s_07 .accordion_one .accordion_header .i_box .one_i:after {
	display: flex;
	content: "";
	background-color: #000;
	border-radius: 10px;
	width: 9px;
	height: 1px;
	position: absolute;
	top: 7px;
	left: 2px;
	-webkit-transform: rotate(0deg);
	transform: rotate(0deg);
	transform-origin: center center;
}

.s_07 .accordion_one .accordion_header .i_box .one_i:before {
	width: 1px;
	height: 9px;
	top: 3px;
	left: 6px;
}

.s_07 .accordion_one .accordion_header.open .i_box .one_i:before {
	content: none;
}

.s_07 .accordion_one .accordion_header.open .i_box .one_i:after {
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.s_07 .accordion_one .accordion_inner {
	display: none;
	padding: 0;
	box-sizing: border-box;
}

.s_07 .accordion_one .accordion_inner .box_one {
	height: 300px;
}

.s_07 .accordion_one .accordion_inner p.txt_a_ac {
	margin: 0;
}

/* アコーディオン */

/* .flex_progress {
	align-items: center;
} */

.progress_detail_header {
	/* background: #c2e59c;
background: -webkit-linear-gradient(to right, #64b3f4, #c2e59c);
background: linear-gradient(to right, #64b3f4, #c2e59c); */
	background-color: #4169e1 !important;
	color: #fff;
	text-align: center;
	font-weight: bold;
}
/* 
.progress_detail_contents {
	border-bottom: 1px solid rgb(124, 124, 124);
	border-left: 1px solid rgb(124, 124, 124);
	border-right: 1px solid rgb(124, 124, 124); 
}
*/
/* 
.progress_detail_contents:first-child {
	border-top: 1px solid rgb(124, 124, 124); 
}
*/
@media screen and (min-width: 1280px) {
}

@media screen and (max-width: 1024px) {
}

@media screen and (max-width: 960px) {
}

@media screen and (max-width: 768px) {
	.progress_list_main {
		display: block;
	}

	.progress_list_th_3columns {
		width: 150px;
	}
	.progress_list_table_last {
		border: none;
	}
	.progress_list_table_last_mobile {
		border-bottom: 1px solid #595959;
		border-right: 1px solid #595959;
		border-left: 1px solid #595959;
	}
	.progress_list_table_top_mobile {
		border-top: 1px solid #595959;
	}
}

/*===============================================
新規登録
=================================================*/
.progress_new {
	padding: 10px;
}

.progress_project_edit_btnbox input {
	text-align: center;
	width: 100px;
	margin: 0 10px;
}

.progress_project_edit_backbox {
	width: 105px;
	margin-top: 20px;
	font-size: 12px;
}

.progress_project_edit_btnbox {
	text-align: center;
}

.progress_project_edit_backbox a {
	display: flex;
	justify-content: center;
	color: #fff;
}

.progress_project_edit_backbox a i {
	padding: 7px 0;
}

.progress_list_table_container_td input {
	border: 1px solid #000;
}
/*=================================
会議室使用状況 
=====================================*/
.use_room_table {
	/* border-collapse: collapse; */
	width: 100%;
	margin-top: 10px;
	white-space: nowrap;
}
.use_room_scroll {
	overflow-x: scroll;
}
.use_room_table th {
	text-align: center;
	background-color: #4169e1;
	color: rgb(255, 255, 255);
}
.use_room_table th:nth-child(1) {
	width: 50px;
}
.use_room_table th:nth-child(2) {
	width: 120px;
}
.use_room_table th:nth-child(3) {
	width: 120px;
}
.use_room_table th:nth-child(4) {
	width: 140px;
}
.use_room_table th:nth-child(5) {
	width: 220px;
}
.use_room_table th:nth-child(6) {
	width: 120px;
}
.use_room_table th:nth-child(7) {
	width: 120px;
}
.use_room_table th:nth-child(8) {
	width: 120px;
}
.use_room_table th:nth-child(9) {
	width: 120px;
}
.use_room_table td:nth-child(1) {
	text-align: right;
}
.use_room_table td:nth-child(6) {
	text-align: center;
}
.use_room_table td:nth-child(7) {
	text-align: center;
}
.use_room_table td:nth-child(8) {
	text-align: center;
}
.use_room_table td:nth-child(9) {
	text-align: right;
}
.use_room_table th {
	border-left: 1px solid #000;
	border-top: 1px solid #000;
}
.use_room_table th:last-child {
	border-right: 1px solid #000;
}
.use_room_table td {
	border-left: 1px solid #000;
	border-top: 1px solid #000;
	line-height: 1.4;
	padding: 5px;
}
.use_room_table td:last-child {
	border-right: 1px solid #000;
}
.use_room_table tr:last-child td {
	border-bottom: 1px solid #000;
}
/*===============================
物品使用管理記録
===================================*/
.use_goods_table {
	width: 100%;
	margin-top: 10px;
	white-space: nowrap;
}
.use_goods_scroll {
	overflow-x: scroll;
}
.use_goods_table th {
	text-align: center;
	background-color: #4169e1;
	color: rgb(255, 255, 255);
	border-left: 1px solid #000;
	border-top: 1px solid #000;
}
.use_goods_table th:last-child {
	border-right: 1px solid #000;
}
.use_goods_table td {
	border-left: 1px solid #000;
	border-top: 1px solid #000;
	line-height: 1.4;
	padding: 5px;
}
.use_goods_table td:last-child {
	border-right: 1px solid #000;
}
.use_goods_table tr:last-child td {
	border-bottom: 1px solid #000;
}
.use_goods_table td a {
	display: block;
}
.use_goods_table td img {
	width: 80px;
}
.use_goods_table th:nth-child(1) {
	width: 80px;
}
.use_goods_table th:nth-child(2) {
	width: 30px;
}
.use_goods_table th:nth-child(3) {
	width: 200px;
}
.use_goods_table th:nth-child(4) {
	width: 80px;
}
.use_goods_table th:nth-child(5) {
	width: 180px;
}
.use_goods_table th:nth-child(6) {
	width: 50px;
}
.use_goods_table th:nth-child(7) {
	width: 110px;
}
.use_goods_table th:nth-child(8) {
	width: 110px;
}
.use_goods_table th:nth-child(9) {
	width: 110px;
}
.use_goods_table th:nth-child(10) {
	width: 110px;
}
.use_goods_table td:nth-child(1) {
	width: 80px;
}
.use_goods_table td:nth-child(3) {
	white-space: break-spaces;
}
.use_goods_table td:nth-child(5) {
	white-space: break-spaces;
}
.use_goods_table td:nth-child(7) {
	text-align: center;
}
.use_goods_table td:nth-child(8) {
	text-align: center;
}
.use_goods_table td:nth-child(9) {
	text-align: center;
}
.use_goods_table td:nth-child(10) {
	text-align: right;
}
@media screen and (max-width: 1024px) {
	/* .use_goods_scroll {
		overflow: scroll;
	} */
}







/*===============================
各ページの操作ボタン
===================================*/
.ctrl-button-area {
	display: flex;
	gap: 0 10px;
}
.ctrl-button1 {
	display: block;
	min-width: 130px;
	height: 35px;
	padding: 5px 10px;
	border: 1px solid #ccc;
	border-radius: 3px;
	background-color: var(--main-color);
	color: #fff;
	text-align: center;
	font-weight: bold;
	line-height: 24px;
	cursor: pointer;
}

/*===============================
必須項目
===================================*/
.required th {
	background-color: #ff1493!important;
}

/*===============================
削除ボタン
===================================*/
.del_link {
	display: block;
	width: 60px;
	text-align: center;
	margin:auto;
	background-color: #ccc;
	color: black;
	border: 1px solid #000;
	border-radius: 3px;
}
.del_link input {
	width: 90%;
}
.del_btn {
	display: block;
	text-align: center;
	margin:auto;
}
.del_btn input {
	width: 90%;
}

/*===============================
セレクトBOX用
===================================*/
.hidden4selectbox {
	display: none!important;
}
/* =============================================
検索フォームのcss
===============================================*/
.search-form {
	margin-top: 20px;
	margin-bottom: 20px;
}

/* =============================================
フォントカラー
===============================================*/
.font-red{
	color: red;
}
.font-blue{
	color: blue;
}

/* モーダル閉じるボタン */
.modal-close-btn {
	width: 25px;
	height: 25px;
	position:absolute;
	top:5px; right:20px;
	z-index:10;
	font-size: 20px;
}
/* =============================================
グループ選択などのタイトルライン
===============================================*/
.select-filter-title {
	width: 100%;
	padding: 3px;
	text-align: center;
	font-weight: bold;
	color: white;
	border: 1px solid #4169FF;
	background-color: #4169FF;
}

/* =============================================
フォームなどのタイトルライン
===============================================*/
.form-title {
	width: 100%;
	padding: 3px;
	text-align: center;
	font-weight: bold;
	color: black;
	border: 1px solid #CCCCCC;
	background-color: #FFFFCC;
}

/* =============================================
右側ボタン
===============================================*/
.right-button {
	display: flex;
	justify-content:flex-end
}