@charset "UTF-8";

/* Sticky footer styles
-------------------------------------------------- */

brand-coloer {
	color: rgb(255, 255, 255);
}

html {
	overflow-y: scroll;
	position: relative;
	min-height: 100%;
}

header {
	background-color: rgb(255, 255, 255);
}

@media (min-width: 100px) {
	#navbarNav>ul>li {
		border-bottom: #dee2e6 solid 1px;
	}

	#navbarNav>ul>li>a {
		color: #000000;
	}
}

@media (min-width: 992px) {
	#navbarNav .navbar-nav .nav-link {
		min-width: 100px;
		text-align: center;
		border: 1px solid #dee2e6;
		border-left: 0px solid #dee2e6;
		background: none;
		color: inherit;
		transition: background 0.2s, color 0.2s;
	}

	#navbarNav .navbar-nav>li:nth-child(1)>a.nav-link {
		border-left: 1px solid #dee2e6;
		border-radius: 5px 0 0 5px;
	}

	#navbarNav .navbar-nav>li:last-child>a.nav-link {
		border-radius: 0 5px 5px 0;
	}

	#navbarNav .navbar-nav .nav-link:hover {
		background-color: #009188;
		color: #fff;
	}

	#navbarNav .navbar-nav .nav-link.active {
		border: 1px solid #009188;
		background-color: #009188;
		color: #fff;
	}
}

.sub-menu {
	margin-bottom: 10px;
}

.btn-outline-base {
	min-width: 100px;
	text-align: center;
	border: 1px solid #dee2e6;
	border-left: 0px solid #dee2e6;
}

.btn-outline-base:nth-child(1) {
	border-left: 1px solid #dee2e6;
	border-radius: 5px 0px 0px 5px;
}

.btn-outline-base:last-child {
	border-radius: 0px 5px 5px 0px;
}

.btn-outline-base:hover {
	background-color: #009188;
	color: rgb(255, 255, 255);
}

.btn-outline-base.active {
	border: 1px solid #009188;
	background-color: #009188;
	color: rgb(255, 255, 255);
}


body {
	/* Margin bottom by footer height */
	margin-bottom: 80px;
	background-color: rgb(255, 255, 255);
	color: rgb(0, 0, 0);
	word-wrap: break-word;
}

table th {
	background-color: #009188 !important;
	color: rgb(255, 255, 255) !important;
}

footer {
	position: absolute;
	bottom: 0;
	width: 100%;
	margin-top: 60px;
	/* Set the fixed height of the footer here */
	height: 60px;
	background-color: #009188;
}

.valid-error {
	background-color: #f8d7da !important;
	color: #58151c !important;
}

.report-img {
	/*親div*/
	position: relative;
	/*相対配置*/
}

.report-img div {

	position: absolute;
	/*絶対配置*/
	top: 0;
	left: 0;
}

.report-img img {
	max-width: 100%;
	height: auto;
}

h1 {
	color: rgb(0, 0, 0);
}

.btn-light {
	border-color: rgb(221, 221, 221);
}

/* スクロールトップボタン */
.scroll-to-top {
	position: fixed;
	bottom: 20px;
	right: 20px;
	display: none;
	width: 40px;
	height: 40px;
	background-color: rgb(192, 192, 192);
	opacity: 0.8;
	color: white;
	border: none;
	border-radius: 8px;
	cursor: pointer;
	font-size: 24px;
	align-items: center;
	justify-content: center;
	z-index: 1000;
}

.form-label {
	font-weight: bold;
	padding: 0.5em;
	/*文字周りの余白*/
	color: #494949;
	/*文字色*/
	background: rgb(240, 255, 248);
	/*背景色*/
	border-left: solid 5px #009188;
	/*左線（実線 太さ 色）*/
}

.form-text {
	color: rgb(0, 0, 0);
}

.required-mark {
	color: red;
}

.hint {
	margin-bottom: 14px;
	padding: 8px;
	border: 1px solid rgb(212, 212, 212);
	border-radius: 4px;
}

.message-list {
	list-style: none;
}

.modal-open {
	padding-right: 0 !important;
}

.scroll-box {
	height: 19em;
	overflow: auto;
	border: var(--bs-border-width) solid var(--bs-border-color);
	border-radius: var(--bs-border-radius);
	padding: 0.375rem 0.75rem;
}

#weekly-report-list>tbody>.even {

	background-color: rgb(242, 242, 242);
}



input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

input[type="number"] {
	-moz-appearance: textfield;
}

/* .userlistテーマ */
.userlist {
	i {
		display: inline-block;
		width: 30px;
		height: 30px;
		font-size: 26px !important;
		padding-top: 1px;
		background-color: rgb(255, 255, 255);
		border: 1px solid rgb(118, 118, 118);
		border-radius: 10%;
		color: rgb(0, 0, 0);
		margin-left: 5px;
		text-align: center;
		vertical-align: bottom;
	}

	i:hover {
		background-color: rgb(0, 145, 136);
		color: rgb(255, 255, 255);
	}

	.disabled {
		background-color: rgb(242, 242, 242);
		color: rgb(118, 118, 118);
		border: 1px solid rgb(118, 118, 118);
		cursor: not-allowed;
	}

	.disabled:hover {
		background-color: rgb(242, 242, 242);
		color: rgb(118, 118, 118);
		border: 1px solid rgb(118, 118, 118);
		cursor: not-allowed;
	}

	.block-row {
		padding-top: 8px;
		padding-bottom: 8px;
		font-size: 0px;
	}

	.block-row>* {
		vertical-align: middle;
	}

	.color-red {
		background-color: rgb(255, 230, 230);
		padding-bottom: 10px;
	}

	.color-pink {

		background-color: rgb(254, 235, 253);
		padding-bottom: 10px;
	}

	.color-blue {
		background-color: rgb(214, 241, 254);
		padding-bottom: 10px;
	}

	.color-green {
		background-color: rgb(228, 245, 237);
		padding-bottom: 10px;
	}

	.color-yellow {
		background-color: rgb(255, 255, 232);
		padding-bottom: 10px;
	}

	.color-orange {
		background-color: rgb(255, 237, 227);
		padding-bottom: 10px;
	}

	.b-label {
		padding-bottom: 0px;
	}

	.tr-sales {
		background-color: rgb(214, 241, 254) !important;
		color: initial !important;
	}

	.tr-supply {
		background-color: rgb(254, 235, 253) !important;
		color: initial !important;
	}

	.tr-carrier {
		background-color: rgb(228, 245, 237) !important;
		color: initial !important;
	}

	.w1 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 1);
	}

	.w2 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 2);
	}

	.w3 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 3);

	}

	.w4 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 4);

	}

	.w5 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 5);

	}

	.w6 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 6);

	}

	.w7 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 7);

	}

	.w8 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 8);

	}

	.w9 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 9);

	}

	.w10 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 10);

	}

	.w11 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 11);

	}

	.w12 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 12);

	}

	.w13 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 13);

	}

	.w14 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 14);

	}

	.w15 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 15);

	}

	.w16 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 16);

	}


	.w17 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 17);

	}

	.w18 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 18);

	}

	.w19 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 19);

	}

	.w20 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 20);

	}

	.w21 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 21);

	}

	.w22 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 22);

	}

	.w23 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 23);

	}

	.w24 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 24);

	}

	.w25 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 25);

	}

	.w26 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 26);

	}

	.w27 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 27);

	}

	.w28 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 28);

	}

	.w29 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 29);

	}

	.w30 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 30);

	}

	.w31 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 31);

	}

	.w32 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 32);

	}

	.w33 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 33);

	}

	.w34 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 34);

	}

	.w35 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 35);

	}

	.w36 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 36);

	}

	.w37 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 37);

	}

	.w38 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 38);

	}

	.w39 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 39);

	}

	.w40 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 40);

	}

	.w41 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 41);

	}

	.w42 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 42);

	}

	.w43 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 43);

	}

	.w44 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 44);

	}

	.w45 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 45);

	}

	.w46 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 46);

	}

	.w47 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 47);

	}

	.w48 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 48);

	}

	.w49 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 49);

	}

	.w50 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 50);

	}

	.w51 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 51);

	}

	.w52 {
		display: inline-block;
		font-size: 16px;
		width: calc(918px / 48 * 52);

	}


	textarea.auto-resize {
		min-height: 2em;
		overflow: hidden;
		resize: none;
		/* 手動リサイズ禁止 */
		line-height: 1.5;
	}

	.detail-link {
		padding-block: 1px;
		padding-inline: 2px;
		border: 1px solid currentColor;
		color: #000000;
		background-color: #ffffff;
		text-decoration: none;
		border-color: light-dark(rgb(118, 118, 118), rgb(0, 0, 0));
	}

	.detail-link:hover {
		color: #ffffff;
		background-color: #009188;
	}
}