@charset "utf-8";
/* CSS Document */

html {
    font-size: 62.5%;
    -webkit-text-size-adjust: 100%;
}

body {
    min-height: 100vh;
    font-size: 1.4rem;
    font-weight: 400;
    font-family: 'Noto Sans JP', sans-serif;
    color: #222;
    margin: 0;
}

.main {
	display:flex;
	width:100%;
	min-height:100vh;
}

ul {
    list-style: none;
}

li {
    list-style-type: none;
}

a {
    text-decoration: none;
}

textarea {
	width: 100%;
	padding: 0.8rem !important;
	box-sizing: border-box;
}

/* 全てのフォーム要素の背景色を白に設定 */
input[type="date"],
input[type="time"],
select {
    background-color: #fff;
    color: #222;
    border-radius: 4px;
}

button {
	cursor: pointer;
}

.mt-auto{
	margin-top: auto;
}

.mt-1{
	margin-top: 0.1rem;
}

.mt-2{
	margin-top: 0.2rem;
}

.mt-3{
	margin-top: 0.3rem;
}

.mt-4{
	margin-top: 0.4rem;
}

.mt-5{
	margin-top: 0.5rem;
}

.mt-7{
	margin-top: 0.7rem;
}

.mt-8{
	margin-top: 0.8rem;
}

.mt-9{
	margin-top: 9px;
}

.mt-11{
	margin-top: 11px;
}

.mt-12{
	margin-top: 1.2rem;
}

.mt-13{
	margin-top: 13px;
}

.mt-15{
	margin-top: 15px;
}

.mt-16{
	margin-top: 1.6rem;
}

.mt-17{
	margin-top: 1.7rem;
}

.mt-18{
	margin-top: 1.8rem;
}

.mt-21{
	margin-top: 2.1rem;
}

.mt-24{
	margin-top: 2.4rem;
}

.mt-25{
	margin-top: 2.5rem;
}

.mt-26{
	margin-top: 2.6rem;
}

.mt-32{
	margin-top: 32px;
}

.mt-40{
	margin-top: 4rem;
}

.mt-44{
	margin-top: 4.4rem;
}

.mt-60{
	margin-top: 6.0rem;
}

.mt-64 {
	margin-top: 6.4rem;
}

.mt-122{
	margin-top: 12.2rem;
}

.mt-200{
	margin-top: 200px;
}

.mt-300{
	margin-top: 300px;
}

.mr-auto {
	margin-right: auto;
}

.mr-4 {
	margin-right: 0.4rem;
}

.mr-6 {
	margin-right: 6px;
}

.mr-8 {
	margin-right: 0.8rem;
}

.mr-12 {
	margin-right: 1.2rem;
}

.mr-15{
	margin-right: 1.5rem;
}

.mr-16 {
	margin-right: 1.6rem;
}

.mr-17{
	margin-right: 1.7rem;
}

.mr-24 {
	margin-right: 24px;
}

.mr-28 {
	margin-right: 2.8rem;
}

.mr-32 {
	margin-right: 3.2rem;
}

.mr-38{
	margin-right: 3.8rem;
}

.mr-40 {
	margin-right: 4rem;
}

.mr-42 {
	margin-right: 4.2em;
}

.mr-60 {
	margin-right: 6.0rem;
}
.mr-76 {
	margin-right: 7.6rem;
}

.mr-85 {
	margin-right: 8.5rem;
}

.mr-116 {
	margin-right: 11.6rem;
}

.mr-194 {
	margin-right: 19.4rem;
}

.mr-300 {
	margin-right: 300px;
}

.mr-220 {
	margin-right: 220px;
}

.ml-auto {
	margin-left: auto;
}

.ml-2 {
	margin-left: 2px;
}

.ml-4 {
	margin-left: 4px;
}

.ml-7 {
	margin-left: 7px;
}

.ml-8 {
	margin-left: 8px;
}

.ml-10 {
	margin-left: 1rem;
}

.ml-12 {
	margin-left: 12px;
}

.ml-15 {
	margin-left: 1.5rem;
}

.ml-16 {
	margin-left: 1.6rem;
}

.ml-22 {
	margin-left: 2.2rem;
}

.ml-18{
	margin-left: 18px;
}

.ml-24 {
	margin-left: 2.4rem;
}

.ml-35 {
	margin-left: 3.5rem;
}

.ml-60 {
	margin-left: 6.0rem;
}

.ml-844 {
	margin-left: 84.4rem;
}

.ml-130 {
	margin-left: 13.0rem;
}

.ml-082{
	margin-left: 0.82rem;
}

.ml-265 {
	margin-left: 26.5rem;
}

.ml-336 {
	margin-left: 336px;
}

.ml-451 {
	margin-left: 451px;
}

.mb-024 {
	margin-bottom: -2.4rem;
}

.mb-1 {
	margin-bottom: 0.1rem;
}

.mb-4 {
	margin-bottom: 0.4rem;
}

.mb-8 {
	margin-bottom: 0.8rem;
}

.mb-9 {
	margin-bottom: 0.9rem;
}

.mb-11 {
	margin-bottom: 11px;
}

.mb-13 {
	margin-bottom: 1.3rem;
}

.mb-16 {
	margin-bottom: 1.6rem;
}

.mb-21 {
	margin-bottom: 2.1rem;
}

.mb-23{
	margin-bottom: 2.3rem;
}

.mb-24 {
	margin-bottom: 2.4rem;
}

.mb-40 {
	margin-bottom: 4rem;
}

.mb-64 {
	margin-bottom: 6.4rem;
}

.mb-76 {
	margin-bottom: 7.6rem;
}

.mb-272 {
	margin-bottom: 27.2rem;
}

.mb-250 {
	margin-bottom: 25rem;
}

.p-0{
	padding: 0;
}

.p-8 {
	padding: 0.8rem;
}

.p-16 {
	padding: 1.6rem;
}

.pt-6{
	padding-top: 6px;
}

.pt-8{
	padding-top: 8px;
}

.pt-16{
	padding-top: 1.6rem;
}

.pb-8 {
	padding-bottom: 0.8rem;
}

.pb-16 {
	padding-bottom: 100px;
}

.pb-64 {
	padding-bottom: 6.4rem;
}

.pl-8{
	padding-left:8px;
}

.pl-16{
	padding-left: 16px;
}

.pl-33{
	padding-left: 3.3rem !important;
}

.pr-8 {
	padding-right: 0.8rem;
}

.pr-16 {
	padding-right: 1.6rem;
}

.pr-286 {
	padding-right: 28.6rem;
}

.h-max {
	height: 100%;
}

.h-10 {
	height: 10px;
}

.h-17 {
	height: 17px;
}

.h-24{
	height: 24px;
}

.h-28{
	height: 28px;
}

.h-30{
	height: 30px;
}

.h-32{
	height: 32px;
}

.h-35{
	height: 35px;
}

.h-36{
	height: 3.6rem;
}

.h-37{
	height: 3.7rem;
}

.h-38{
	height: 3.8rem;
}

.h-48{
	height: 4.8rem;
}

.h-54 {
	height: 5.4rem;
}

.h-64{
    height: 6.4rem;
}

.h-65{
    height: 6.5rem;
}

.h-67{
    height: 6.7rem;
}

.h-80{
    height: 8rem;
}

.h-109{
    height: 10.9rem;
}

.h-111{
    height: 11.1rem;
}

.h-120{
    height: 12.0rem;
}

.h-124{
    height: 12.4rem;
}

.h-133{
    height: 13.3rem;
}

.h-189 {
	height: 18.9rem;
}

.h-191 {
	height: 19.1rem;
}

.h-192 {
	height: 19.2rem;
}

.h-193 {
	height: 19.3rem;
}

.h-213 {
	height: 21.3rem;
}

.h-215 {
	height: 21.5rem;
}

.h-222 {
	height: 22.2rem;
}

.h-226 {
	height: 22.6rem;
}

.h-433 {
	height: 43.3rem;
}

.h-449 {
	height: 44.9rem;
}

.h-533 {
	height: 53.3rem;
}

.h-550 {
	height: 55rem;
}

.h-580 {
	height: 58.0rem;
}

.h-713{
    height: 71.3rem;
}

.h-739 {
    height: 73.9rem;
}

.h-746{
    height: 74.6rem;
}

.h-778{
    height: 77.8rem;
}

.h-937 {
	height: 93.7rem;
}

.w-p-1 {
	width: 1%;
}

.w-p-3 {
	width: 3%;
}

.w-p-5 {
	width: 5%;
}

.w-p-6 {
	width: 6%;
}

.w-p-7 {
	width: 7%;
}

.w-p-7-5 {
	width: 7.5%;
}

.w-p-8 {
	width: 8%;
}

.w-p-9 {
	width: 9%;
}

.w-p-10 {
	width:10%;
}

.w-p-10-5 {
	width:10.5%;
}

.w-p-11 {
	width:11%;
}

.w-p-12 {
	width:12%;
}

.w-p-15 {
    width: 15%;
}

.w-p-18 {
    width: 18%;
}

.w-p-20 {
    width: 20%;
}

.w-p-23 {
    width: 23%;
}

.w-p-25 {
    width: 25%;
}

.w-p-28 {
    width: 28%;
}

.w-p-30 {
    width: 30%;
}

.w-p-33 {
    width: 33%;
}

.w-p-34 {
    width: 34%;
}

.w-p-37 {
    width: 37%;
}

.w-p-40 {
    width: 40%;
}

.w-p-50 {
    width: 50%;
}

.w-p-52 {
    width: 52%;
}

.w-p-60 {
    width: 60%;
}

.w-p-65 {
    width: 65%;
}

.w-p-70 {
    width: 70%;
}

.w-p-75 {
    width: 75%;
}

.w-p-76 {
    width: 76%;
}

.w-p-80 {
    width: 80%;
}

.w-p-90 {
    width: 90%;
}

.w-max {
    width: 100%;
}

.w-4 {
    width: 4px;
}

.w-8 {
    width: 8rem;
}

.w-10 {
    width: 10rem;
}

.w-12 {
    width: 1.2rem;
}

.w-15 {
    width: 15.65rem;
}

.w-24 {
	width: 2.4rem;
}

.w-28 {
	width: 2.8rem;
}

.w-31 {
	width: 3.1rem;
}

.w-32 {
	width: 3.2rem;
}

.w-33 {
	width: 3.3rem;
}

.w-36 {
	width: 3.6rem;
}

.w-40 {
    width: 4.0rem;
}

.w-41 {
    width: 4.1rem;
}

.w-48 {
    width: 4.8rem;
}

.w-60 {
    width: 6.0rem;
}

.w-62 {
    width: 6.2rem;
}

.w-64 {
    width: 6.4rem;
}

.w-65 {
    width: 6.5rem;
}

.w-67 {
    width: 6.7rem;
}

.w-70 {
    width: 7.0rem;
}

.w-71 {
    width: 7.1rem;
}

.w-73 {
    width: 7.3rem;
}

.w-74 {
    width: 7.4rem;
}

.w-75 {
    width: 7.5rem;
}

.w-75 {
    width: 76px;
}

.w-80 {
    width: 8.0rem;
}

.w-81 {
    width: 8.1rem;
}

.w-82 {
    width: 8.2rem;
}

.w-84 {
    width: 8.4rem;
}

.w-85 {
    width: 8.5rem;
}

.w-86 {
    width: 8.6rem;
}

.w-87 {
    width: 8.7rem;
}

.w-89 {
    width: 8.9rem;
}

.w-90 {
    width: 90px;
}

.w-92 {
    width: 9.2rem;
}

.w-94 {
    width: 9.4rem;
}

.w-96 {
    width: 96px;
}

.w-99 {
    width: 99px;
}

.w-101 {
    width: 10.1rem;
}

.w-109{
	width: 90px;
}

.w-102 {
    width: 10.2rem;
}

.w-103 {
    width: 10.3rem;
}

.w-105 {
    width: 10.5rem;
}

.w-106 {
    width: 10.6rem;
}

.w-110 {
    width: 11.0rem;
}

.w-111 {
    width: 111px;
}

.w-117 {
    width: 11.7rem;
}

.w-118 {
    width: 11.8rem;
}

.w-119 {
    width: 11.9rem;
}

.w-120 {
    width: 12rem;
}

.w-122 {
    width: 12.2rem;
}

.w-125 {
    width: 12.5rem;
}

.w-126 {
    width: 120px;
}

.w-130 {
    width: 13rem;
}

.w-134 {
    width: 13.4rem;
}

.w-135 {
    width: 13.5rem;
}

.w-138 {
    width: 13.8rem;
}

.w-139 {
    width: 13.9rem;
}

.w-140 {
    width: 14.0rem;
}

.w-141 {
	width: 14.1rem;
}

.w-143 {
    width: 14.3rem;
}

.w-147 {
    width: 14.7rem;
}

.w-148 {
    width: 14.8rem;
}

.w-149 {
    width: 14.9rem;
}

.w-151 {
    width: 15.1rem;
}

.w-152 {
    width: 15.2rem;
}

.w-155 {
    width: 15.5rem;
}

.w-160 {
    width: 16.0rem;
}

.w-161 {
    width: 16.1rem;
}

.w-162 {
    width: 16.2rem;
}

.w-164 {
    width: 16.4rem;
}

.w-165 {
	width: 16.5rem;
}

.w-166 {
	width: 16.6rem;
}

.w-167 {
	width: 16.7rem;
}

.w-168 {
    width: 16.8rem;
}

.w-169 {
    width: 16.9rem;
}

.w-170 {
    width: 17.0rem;
}

.w-172 {
    width: 17.2rem;
}

.w-176 {
    width: 176px;
}

.w-180 {
    width: 180px;
}

.w-188 {
    width: 18.8rem;
}

.w-189 {
    width: 18.9rem;
}

.w-192 {
    width: 192rem;
}

.w-192-5 {
    width: 192.25px;
}

.w-198 {
    width: 19.8rem;
}

.w-215 {
    width: 21.5rem;
}

.w-218 {
    width: 21.8rem;
}

.w-220 {
    width: 22.0rem;
}

.w-222 {
    width: 22.2rem;
}

.w-224 {
    width: 22.4rem;
}

.w-225 {
    width: 22.5rem;
}

.w-227 {
    width: 22.7rem;
}

.w-240 {
    width: 24.0rem;
}

.w-243 {
    width: 24.3rem;
}

.w-247 {
    width: 24.7rem;
}

.w-255 {
    width: 255px;
}

.w-260 {
	width: 260px;
}

.w-265 {
    width: 265px;
}

.w-268 {
    width: 268px;
}

.w-274 {
    width: 27.4rem;
}

.w-279 {
    width: 27.9rem;
}

.w-282 {
    width: 28.2rem;
}

.w-320 {
    width: 32rem;
}

.w-334 {
    width: 33.4rem;
}

.w-336 {
    width: 33.6rem;
}

.w-368 {
    width: 36.8rem;
}

.w-376 {
    width: 37.6rem;
}

.w-441 {
    width: 44.1rem;
}

.w-485{
	width: 483px;
}

.w-505 {
	width: 50.5rem;
}

.w-512 {
	width: 51.2rem;
}

.w-538 {
	width: 538px;
}

.w-599 {
	width: 59.9rem;
}

.w-605 {
    width: 605px;
}

.w-612 {
    width: 61.2rem;
}

.w-637 {
    width: 63.7rem;
}

.w-716 {
    width: 716px;
}

.w-748 {
    width: 748px;
}

.w-816 {
    width: 81.6rem;
}

.w-896 {
    width: 89.6rem;
}

.w-917 {
    width: 91.7rem;
}

.w-1116 {
    width: 111.6rem;
}

.w-1148 {
	width: 114.8rem;
}

.w-1155 {
	width: 115.5rem;
}

.w-90p {
	width: 90%;
}

.w-60p {
	width: 60%;
}

.w-20p {
	width: 20%;
}

.w-8p {
	width: 8%;
}

.w-4p {
	width: 4%;
}

.h-15 {
    height: 15px;
}

.h-16 {
    height: 1.6rem;
}

.h-26 {
    height: 2.6rem;
}

.h-31 {
    height: 3.1rem;
}

.h-32 {
    height: 3.2rem;
}

.h-34 {
    height: 3.4rem;
}

.h-35{
	height: 3.5rem;
}

.h-40 {
	height: 40px;
}

.h-48 {
	height: 48px;
}

.h-50 {
	height: 5.0rem;
}

.h-51 {
	height: 5.1rem;
}

.h-56 {
	height: 5.6rem;
}

.h-80 {
	height: 8.0rem;
}

.h-300 {
    height: 30.0rem;
}

.h-322 {
    height: 32.2rem;
}

.h-425 {
    height: 42.5rem;
}

.border-none{
	border: none;
}

.border-gray{
	border: 1px solid #DDE0E4;
}

.content-flex-end{
	align-content: flex-end;
}

.content-center{
	align-content: center;
}

.t-end{
	text-align: end;
}

.t-center{
	text-align: center;
}

.hidden{
    display: none;
}

.pointer{
    cursor: pointer;
}

.navigation-list{
	
}

.anchor{
	display: block;
    padding-top: 70px;
    margin-top: -70px;
}

.ellipsis {
    display: -webkit-box;
    overflow: hidden;
    word-break: break-all;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin: 0;
}

.font-bold{
	font-weight: bold;
}

.font-btn {
	font-size: 1.4rem;
}

.display-flex{
	display: flex;
}

.absolute{
	position: absolute;
}

.z-index-10{
	z-index: 10;
}

.flex-start{
	align-items: flex-start;
}

.gap-p-3{
	gap: 3%;
}

.gap-8{
	gap: 0.8rem;
}

.table-comma {
    background-color: transparent;
    cursor: text;
    border: none;
    outline: none;
    padding: 0;
    text-align: end;
}

.bg-white {
	background-color: #fff;
}

/*
--------------------------------------
ログイン
--------------------------------------
*/

.login-page {
	align-items: center;
	background-color: #F5F6F9;
	display: flex;
	flex-direction: column;
	height: 100vh;
	-ms-flex-pack: center;
	justify-content: center;
}

.login-box {
	width: 600px;
}

.login-logo {
	text-align: center;
	font: normal normal 900 36px / 52px Noto Sans JP;
	letter-spacing: 5.04px;
	margin-bottom: 40px;
	opacity: 1;
}

.login-card-body {
	background-color: #FFFFFF;
	padding: 4rem 13.5rem;
}

.input-group-login,
.input-group-password{
	position: relative;
	display: inline-block;
	line-height: 1;
}

.input-group-login:after{
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0.8rem;
	margin: auto;
	width: 1em;
	height: 1em;
	text-align: center;
	font-style: normal;
	font-variant: normal;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	font-family: "Font Awesome 5 Free"; 
	font-weight: 900;
	content: '\f007';
	color: #BDBDBD;
}

.input-group-password:after{
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0.8rem;
	margin: auto;
	width: 1em;
	height: 1em;
	text-align: center;
	font-style: normal;
	font-variant: normal;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	font-family: "Font Awesome 5 Free"; 
	font-weight: 900;
	content: '\f084';
	color: #BDBDBD;
}

.input-group-login input,
.input-group-password input {
	width: 330px;
	padding: 10px calc(1em + 20px) 10px 10px;
	font-size: 1em;
	border: 1px solid #D0D4DA;
	border-radius: 0.4rem;
	background: #fff;
	color: #222222;
	box-sizing: border-box;
}

.input-group-login input:focus,
.input-group-password input:focus{
	outline:0;
}

.input-group-login input::placeholder,
.input-group-password input::placeholder{
	color: #BDBDBD;
}

.login-btn-add-css {
    color: #FFFFFF;
    background-color: #002255;
    text-align: center;
    cursor: pointer;
    display: block;
    padding: 0.8rem 0rem;
    max-width: 330px;
    border-radius: 0.4rem;
    border: none;
    width: 100%;
    box-sizing: content-box;
}

.universe-logo{
	width: 32px;
	height: 31px;
	opacity: 1;
}

/*
--------------------------------------
パスワードリセット
--------------------------------------
*/
.reset-password-box {
	width: 600px;
	background-color: #FFFFFF;
}

.reset-password-h2 {
	font-size: 1em;
	margin: 0;
	background-color: #002255;
	padding: 0.8em;
	color: #FFFFFF;
}

.reset-password-box .login-card-body {
	position: relative;
}

.flash-message {
	font-size: 0.8rem;
	margin: 0;
	position: absolute;
	top: 0;
	left: 0;
	line-height: 1.8rem;
	width: 100%;
	padding: 0 0.4rem;
	box-sizing: border-box;
}

.flash-message.success {
	color: #155724;
	background-color: #d4edda;
}

.flash-message.error {
	color: #721c24;
	background-color: #f8d7da;
}

.table-input-content.readonly {
	background-color:#c0c0c0;
   	color:#666;
}

/*
--------------------------------------
ログアウト
--------------------------------------
*/

.user-lists {
	color: #fff;
}

.user-name a {
	padding: 0.6rem;
	cursor: pointer;
}

.dropdown-lists {
	display: none;
	position: absolute;
	top: 4.2rem;
	right: 2rem;
}

.user-lists:hover .dropdown-lists {
	display: block;
}

.logout-list {
	background-color: #FFFFFF;
	position: relative;
	box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
	display: block;
    padding: 1rem 1.6rem;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
}

.logout-list:hover {
	color: #FFFFFF;
	background-color: #DC3545;
}

/*
--------------------------------------
ヘッダー
--------------------------------------
*/

.header-lists {
	display: flex;
}

.header-store-info {
	display: flex;
	align-items: center;
}

.header {
	width:100%;
	display:flex;
}

.header-right {
	margin-left: auto;
}

.logo-icon{
	width: 24px;
	height: 23px;
	padding-right: 16px;
	position: relative;
    top: 5px;
}

.universe-name{
	text-align: left;
    font: normal normal bold 20px / 29px Noto Sans JP;
    letter-spacing: 2.8px;
    color: #FFFFFF;
    opacity: 1;
}

.system-logo {
	width: 260px;
	background-color: #002255;
	box-sizing: border-box;
	padding: 1.6rem;
	color: #FFFFFF;
	display: flex;
	align-items: center;
	font-size: 2rem;
}

.headnavi{
	display:flex;
	flex:1;
}

.global-navi {
	width: 100%;
	background-color: #002255;
	box-sizing: border-box;
	padding: 1.2rem;
	display: flex;
	align-items: center;
}

.global-navi-item {
	margin: 0 1rem 0 0;
	font-size: 1.2rem;
}

.global-navi-item select {
	padding: 0.8rem;
	width: 265px;
	border: 1px solid #fff;
	border-radius: 0.4rem;
	background-color: #002255;
	color: #fff;
}

.header-cart {
    margin-left: 1.6rem;
    margin-right: .6rem;
    position: relative;
    border: none;
    background-color: transparent;
}

.header-cart a {
    display: block;
}

.mail-btn {
	color: #fff;
}

.mail-cnt {
    position: absolute;
    top: 0;
    right: 0;
    transform: translate(60%, 30%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    background-color: red;
    border-radius: 50%;
    color: #fff;
}

.header-store-name{
	color: #fff;
	font: normal normal normal 16px/24px Noto Sans JP;
}

/* ハンバーガーメニュー設定 */
.hamburger-btn {
	display: none;
}

.is-sp-user {
	display: block;
}

.is-sp {
	display: none;
}

@media screen and (max-width: 834px) {
	
	.hamburger-btn {
		display: inline-block;
		font-size: 20px;
		color: #fff;
	}
	
	.system-logo {
		width: 46px;
	}
	
	.is-sp-logo {
		display: flex;
		align-items: center;
		column-gap: 10px;
	}
	
	.is-sp {
		display: block;
	}
	
	.global-navi-item select {
		width: 160px;
	}
	
	.mail-cnt {
		transform: translate(60%, -50%);

	}
}

/*
--------------------------------------
サイドナビゲーション
--------------------------------------
*/

.sidenavi {
	max-width: 260px;
	min-width: 260px;
	box-sizing: border-box;
	background-color: #002255;
}

.sidenavi-level1{
	width:260px;
	background: #002255;
}

@media screen and (max-width: 834px) {
	
	.sidenavi {
		position: fixed;
		top: 0;
		left: -120%;
		transition: all 0.6s;
		width: unset;
		overflow-y: scroll;
		height: 100%;
		z-index: 1000;
	}
	
	.sidenavi-level1{
		width:260px;
		background: #002255;
	}

	.sidenavi-active {
		left: 0;
	}
	
	.is-sp-user {
		display: none;
	}
}

.side-navi-user-box {
	padding: 2.4rem;
	background-color: #031C42;
}

.side-navi-photo {
	text-align: center;
	margin-bottom: 1.6rem;
}

.side-navi-photo-icon{
	width: 42px;
	height: 42px;
	border-radius: 50%;
	object-fit: cover;
}

.side-navi-user {
	font-size: 1.6rem;
	color: #C0C0C0;
	text-align: center;
}

.side-navi-user a {
	color: #C0C0C0;
}

.sidenavi-title {
	width: 100%;
    font-size: 1.6rem;
}

.sidenavi-title a{
	display: block;
	width:100%;
	padding:1.6rem;
	box-sizing: border-box;
	text-decoration: none;
	color: #fff;
}

.sidenavi-title-child {
	width: 100%;
    font-size: 1.6rem;
	background-color: #031C42;
}

.sidenavi-title-child a{
	display: block;
	width:100%;
	padding:1.6rem 1.6rem 1.6rem 4rem;
	box-sizing: border-box;
	text-decoration: none;
	color: #fff;
}

.sidenavi-parent {
    box-sizing: border-box;
	display: flex;
	align-items: center;
}

.sidenavi-parent::after {
	font-family: "Font Awesome 5 Free";
	content: "\f078";
	font-weight: 900;
    margin-right: 2rem;
    color: #fff
}

.label-unit{
	font-size: 0.8rem;
}

.workflow-cnt {
	position: absolute;
    top: 10px;
    right: 90px;
    transform: translate(60%, 30%);
}

.cnt-btn {
	display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    background-color: red;
    border-radius: 50%;
    color: #fff;
}

/*
--------------------------------------
テキスト
--------------------------------------
*/
label {
	font-size: 1.2rem;
}

.label-title{
	font-size: 1.6rem;
	font-weight: bold;
}

.label-content{
	font-size: 1.2rem;
	font-weight: bold;
	margin-bottom: 0.8rem;
}

.label-required{
	font-size: 1.2rem;
	font-weight: normal;
	color: #DC3545;
}

.label-annotation{
	font-size: 1.2rem;
	font-weight: normal;
}

.label-link{
	font-size: 1.2rem;
	font-weight: normal;
	text-decoration: underline;
}

.error-message{
	color: #DC3545;
	font-weight: normal;
	border-spacing: 0px;
}

.error-message td{
	padding: 0;
}

.label-content-nomal{
	font-size: 1.2rem;
}

.label-content-bold{
	font-size: 1.2rem;
	font-weight: bold;
}

/*
--------------------------------------
コンテンツ
--------------------------------------
*/
.data-area{
	flex:1;
	background-color:#F5F6F9;
	width:100%;
    box-sizing: border-box;
    padding: 0 1.6rem 1.6rem 1.6rem;
    overflow: hidden;
}

.data-area-inner{
	width: 100%;
	padding: 1.6rem;
	background-color: #FFFFFF;
	font: normal normal normal 12px Noto Sans JP;
	box-sizing: border-box;
}

.data-area-title {
    width:100%;
    box-sizing: border-box;
    font-size: 2.4rem;
    font-weight: 600;
    padding: 2.4rem 0;
}

.container-select {
	display: flex;
	position: relative;
}

.container-select-left {
	width: 100px;
	position: absolute;
	bottom: 0;
}

.container-select-right {
	margin-left: auto;
}

.data-area-inners{
    width: 100%;
    padding: 1.6rem;
    margin: 0 0 1.6rem 0;
    background-color: #FFFFFF;
    font: normal normal normal 12px Noto Sans JP;
    box-sizing: border-box;
}

.mail-status-tab{
	display: flex;
	/*padding-left: 1.6rem;*/
}

.contract-status-tab{
	display: flex;
	gap: 4px;
}
/*
--------------------------------------
テーブル
--------------------------------------
*/
.search-area{
    width: 100%;
    padding: 1.6rem;
    /* padding-left: 12px; */
    background-color: #EBEDEF;
    box-sizing: border-box;
}

.search-table{
	display: flex;
    flex-wrap: wrap;
    /* width: 1095px; */
    /*justify-content: space-between;*/
    gap: 0.8rem;
}

.search-table-flex-start{
	display: flex;
    flex-wrap: wrap;
}

.search-requirements{
	border: none;
	border-radius: 0.4rem;
	margin-top: 0.8rem;
	box-sizing : border-box;
	padding-left: 0.8rem;
}

.search-requirements select{
	padding-left: 0;
}

.input[type="text"] {
	padding: 0;
}

.btn-search-inner {
    display: flex;
    /*padding: 1.5rem 0 1rem 0;*/
    margin-top: 4rem;
    justify-content: flex-end;
    font-size: 1.4rem;
}

.btn-cancel-submit{
	display:flex;
	/*padding-top: 2.4rem;*/
	justify-content:flex-end;
	font-size: 1.4rem;
}

.btn-delete-new{
	display:flex;
	font-size: 1.4rem;
	/*align-items: center;*/
	margin-left:auto;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 8px;
}

.btn-detail-edit{
	display:flex;
	justify-content: center;
	text-align: center;
	font-size: 1.4rem;
}

.btn-return{
	font-size: 1.4rem;
	font-weight: normal;
	float: right;
}

.search-box{
	color: #222222;
    /*margin-bottom: 8px;*/
}

.table-input-set{

}


.table-input-content{
	border: 1px solid #D0D4DA;
	border-radius: 4px;
	box-sizing : border-box;
	white-space:pre-wrap;
	padding: 0 0.8rem 0 0.8rem;
}

.table-input-content:disabled {
	background-color: #E9E9E9;
	color: #222222;
}

.table-img-set{
	display:flex;
	align-items: center;
}

.dep-input-group{
	display: flex;
    flex-direction: column;
}

.dep-table-input-set{
	display: flex;
	gap: 8.2px;
}

.input-text{
	width: 26.5rem;
	height: 3.2rem;
}

.table-pagination{
	display:flex;
	align-items: center;
}

.pagination{
	padding-top: 48px;
	line-height: 1.6rem;
	display: flex;
	align-items: center;
}

.client-pagination{
	display:flex;
	margin: 0 0 1rem 0;
	align-items: center;
}

.pagination-btn {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.table-list-set{
	font-size: 1.2rem;
	/*border: 1px solid #DDE0E4;*/
}

.table-list-set table{
	width: 100%;
	border:1px solid #E5E5E5;
	box-sizing: border-box;
	border-collapse: collapse;
}


.table-list-set td{
    padding: 0.8rem;
    border: 1px solid #DDE0E4;
    align-items: center;
    box-sizing: border-box;
}

/*棚卸管理のテーブル start*/
.stock-table-list-set {
	position: relative;
	height: 86rem;
    font-size: 1.2rem;
}

.stock-table-list-set table{
	width: 100%;
	box-sizing: border-box;
	border-collapse: collapse;
	white-space: nowrap;
}

.stock-table-list-set thead {
	position: sticky;
	top: 0;
}

.stock-table-list-set tfoot {
	position: sticky;
	bottom: 0;
}

.stock-table-list-set td{
	padding: 0.8rem;
	align-items: center;
    box-sizing: border-box;
}

.stock-header-list {
	background-color: #405980;
	color: #FFFFFF;
	border: 1px solid #405980;
	text-align: left;
	font: normal normal normal 1.2rem/1.7rem Noto Sans JP;
	box-sizing: border-box;
}

.stock-header-list td {
	border: 1px solid #DDE0E4;
}

.stock-list-outer {
	border: 1px solid #405980;
}

.stock-list td {
	border-bottom: 1px solid #DDE0E4;
	border-right: 1px solid #DDE0E4;
}

.stock-list td:last-child,
.stock-list-3 td:last-child {
	border-right: none;
}

.stock-list-3 td {
	border-bottom: none;
	border-right: 1px solid #DDE0E4;
}

.stock-status0 {
	width: 100%;
	height: 2.4rem;
	display: block;
	text-align: center;
	line-height: 2.5rem;
	color: #222222;
	background-color: #E9E9E9;
	border-radius: 2rem;
}

.stock-status1 {
	width: 100%;
	height: 2.4rem;
	display: block;
	text-align: center;
	line-height: 2.5rem;
	color: #FFFFFF;
	background-color: #F6629F;
	border-radius: 2rem;
}

.stock-status2 {
	width: 100%;
	height: 2.4rem;
	display: block;
	text-align: center;
	line-height: 2.5rem;
	color: #FFFFFF;
	background-color: #5EA7D8;
	border-radius: 2rem;
}
/*棚卸管理のテーブル end*/

.store-name{
	color:#3859C5;
	text-decoration:underline;
	
}

.store-list{
	background-color: #405980;
	color: #FFFFFF;
	border: 1px solid #405980;
	text-align: left;
	font: normal normal normal 1.2rem/1.7rem Noto Sans JP;
	box-sizing: border-box;
	/*height: 3.2rem;*/
}

.table-checkbox{
	text-align: center;
}

.btn-done{
	font-size: 1.4rem;
}

.table-content-set{
	margin-bottom: 2.4rem;
}

.table-set-right{
	display: flex;
	justify-content: flex-end;
}

.table-set{
	border-collapse: collapse;
	background-color: #FFFFFF;
	font: normal normal normal 1.2rem/1.7rem Noto Sans JP;
	border-color: #DDE0E4;
	box-sizing: border-box;
}

.table-set td{
 	padding: 0.5%;
 	vertical-align: top;
}

.white-space-pre-wrap{
 	white-space: pre-wrap;
}

.table-set td .business-memo{
	max-height: 15rem;
 	overflow: auto;
}

.table-set td:nth-of-type(1) {
 	background-color: #E9E9E9;
}

.table-receivers{
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 160px;
}

.table-flex-center{
    display: flex;
    align-items: center;
}

.detail-link{
	color:#3859C5;
	text-decoration: underline;
}

.detail-link:visited{
	color: inherit !important;
}

.table-sticky {
    position: sticky;
    top: 0;
    background-color: #405980;
    color: #FFFFFF;
}

.table-dashbord{
	font-size: 1.2rem;
    max-height: 64.5rem;
    overflow-y: auto;
    font-size: 12px;
}

.table-dashbord table{
	width: 100%;
	border:1px solid #E5E5E5;
	box-sizing: border-box;
	border-collapse: collapse;
}

.table-dashbord thead th {
	font-weight: normal;
    top:0;
    z-index:1;
}

.table-dashbord thead td {
	font-weight: normal;
    top:30;
    z-index:1;
}

.table-dashbord .total-row {
    position: sticky;
    bottom: 0;
    background-color: #405980;
    color: #FFFFFF;
    z-index: 1;
}

.table-dashbord td {
    padding: 0.8rem;
    border: 1px solid #DDE0E4;
    align-items: center;
    box-sizing: border-box;
}

.table-dashbord .total-row td {
    border: 1px solid #DDE0E4;
    align-items: center;
    box-sizing: border-box;
    background-color: #405980;
    color: #FFFFFF;
    padding: 0 0.8rem 0 0.8rem;
    height: 3.2rem;
}

/*
--------------------------------------
案件一覧
--------------------------------------
*/

.btn-status{
	display: flex;
    justify-content: center;
    align-items: center;
	height: 4rem;
	background-color:#BFC8D5;
	color:#000;
	text-align: center;
	text-decoration: none;
    border-radius: 0.4rem;
	cursor: pointer;
}

.btn-status-selected{
	display: flex;
    justify-content: center;
    align-items: center;
	height: 4rem;
	background-color:#002255;
	color:#FFFFFF;
	text-align: center;
	text-decoration: none;
    border-radius: 0.4rem;
	cursor: pointer;
}

.order-contents-area{
    display: flex;
    padding: 1.6rem;
    background-color: #FFFFFF;
    width: 100%;
    box-sizing: border-box;
}

.order-contents-area-displayOff{
    display: flex;
    padding: 1.6rem;
    background-color: #DDE0E4;
    width: 100%;
    box-sizing: border-box;
}

.order-contents-area-contract{
    display: flex;
    padding: 1.6rem;
    background-color: #FDF9D8;
    width: 100%;
    box-sizing: border-box;
}

.table-order-content{
}

.content-disabled{
	background-color: #E9E9E9;
	cursor: default;
	pointer-events: none;
	color: #222222;
}
.table-order-flex{
	display: flex;
	width: 100%;
	box-sizing: border-box;
}

.space-between{
	justify-content: space-between;
}

.align-items-flex-end{
	align-items: flex-end;
}

.btn-order-update{
	bottom: 0;
	margin-left:auto;
	margin-right: 1.6rem;
}

.table-order-details{
	border: 1px solid #DDE0E4;
	border-radius: 0.4rem;
	padding-left: 0.8rem;
    box-sizing: border-box;
}
.table-status{
	display: flex;
}

.status0{
	width: 10rem;
	height: 2.4rem;
	color: #FFFFFF;
	background-color: #F6629F;
	text-align: center;
	line-height: 2.4rem;
	border-radius: 20px;
}

.status1{
	width: 10rem;
	height: 2.4rem;
	color: #FFFFFF;
	background-color: #BDBDBD;
	text-align: center;
	line-height: 2.4rem;
	border-radius: 20px;
}

.status2{
	width: 10rem;
	height: 2.4rem;
	color: #FFFFFF;
	background-color: #A75ED8;
	text-align: center;
	line-height: 2.4rem;
	border-radius: 20px;
}

.status3{
	width: 10rem;
	height: 2.4rem;
	color: #FFFFFF;
	background-color: #EE8522;
	text-align: center;
	line-height: 2.4rem;
	border-radius: 20px;
}

.status4{
	width: 10rem;
	height: 2.4rem;
	color: #FFFFFF;
	background-color: #5ED877;
	text-align: center;
	line-height: 2.4rem;
	border-radius: 20px;
}

.status5{
	width: 10rem;
	height: 2.4rem;
	color: #FFFFFF;
	background-color: #5EA7D8;
	text-align: center;
	line-height: 2.4rem;
	border-radius: 20px;
}

.table-mail-status{
	display: flex;
	justify-content: center;
	align-items: center;
}

.mail-status0{
	display: flex;
	height: 2.4rem;
	color: #222222;
	background-color: #C3EECD;
	align-items: center;
	justify-content: center;
	border-radius: 20px;
}

.mail-status1{
	display: flex;
	height: 2.4rem;
	color: #222222;
	background-color: #E9E9E9;
	align-items: center;
	justify-content: center;
	border-radius: 20px;
}

.btn-detail{
	display: flex;
    justify-content: center;
    align-items: center;
	height: 3.6rem;
	line-height: 3.6rem;
	background-color:#002255;
	color:#FFFFFF;
	text-align: center;
	text-decoration: none;
    border-radius: 0.4rem;
	cursor: pointer;
}

.header-alert{
	display :flex;
    align-items: center;
}


/*
--------------------------------------
ボタン
--------------------------------------
*/
.btn-bg-gray{
	display: flex;
    justify-content: center;
    align-items: center;
	height: 40px;
	background-color:#BFC8D5;
	color:#000;
	text-align: center;
	text-decoration: none;
    border-radius: 0.4rem;
	cursor: pointer;
}

.btn-bg-gray-white{
	display: flex;
    justify-content: center;
    align-items: center;
	height: 3.6rem;
	background-color: #707070;
    color: #FFFFFF;
	text-align: center;
	text-decoration: none;
    border-radius: 0.4rem;
    border: none;
	cursor: pointer;
}

.btn-bg-gray-white2{
	display: flex;
    justify-content: center;
    align-items: center;
	height: 3.2rem;
	background-color: #707070;
    color: #FFFFFF;
	text-align: center;
	text-decoration: none;
    border-radius: 0.4rem;
    margin-top: 1.5rem;
    margin-left: 10px;
	cursor: pointer;
}

.btn-bg-white{
	display: flex;
    justify-content: center;
    align-items: center;
	height: 3.6rem;
	background-color:#FFFFFF;
	color:#707070;
	border: 1px solid #707070;
	text-align: center;
	text-decoration: none;
    border-radius: 0.4rem;
	cursor: pointer;
	box-sizing: border-box;
}

.btn-bg-white2{
	display: flex;
    justify-content: center;
    align-items: center;
	height: 3.6rem;
	background-color:#FFFFFF;
	color:#222222;
	border: 1px solid #D0D4DA;
	text-align: center;
	text-decoration: none;
    border-radius: 0.4rem;
	cursor: pointer;
	box-sizing: border-box;
}

.btn-bg-blue-border{
	display: flex;
    justify-content: center;
    align-items: center;
	background-color:#002255;
	border: 1px solid #FFFFFF;
	color:#FFFFFF;
	text-align: center;
	text-decoration: none;
    border-radius: 0.4rem;
	cursor: pointer;
	height: 3.6rem;
	width: 16rem;
	box-sizing: border-box;
}

.btn-bg-blue-report{
	display: flex;
    justify-content: center;
    align-items: center;
	background-color:#002255;
	color:#FFFFFF;
	text-align: center;
	text-decoration: none;
    border-radius: 0.4rem;
	cursor: pointer;
}

.btn-bg-blue2{
	display: flex;
    justify-content: center;
    align-items: center;
	height: 3.6rem;
	background-color:#FFFFFF;
	color:#002255;
	text-align: center;
	text-decoration: none;
	border: 1px solid #002255;
    border-radius: 0.4rem;
	cursor: pointer;
	box-sizing: border-box;
}

.btn-bg-blue{
	display: flex;
    justify-content: center;
    align-items: center;
	height: 3.6rem;
	background-color:#002255;
	color:#FFFFFF;
	text-align: center;
	text-decoration: none;
    border-radius: 0.4rem;
	cursor: pointer;
}

.btn-bg-blue-white{
	display: flex;
    justify-content: center;
    align-items: center;
	height: 3.6rem;
	background-color:#FFFFFF;
	color:#002255;
	border: 1px solid #002255;
	text-align: center;
	text-decoration: none;
    border-radius: 0.4rem;
	cursor: pointer;
	box-sizing: border-box;
}

.btn-bg-right-green{
	display: flex;
    justify-content: center;
    align-items: center;
	height: 3.6rem;
	background-color:#00B52B;
	color:#FFFFFF;
	text-align: center;
	text-decoration: none;
    border-radius: 0.4rem;
	cursor: pointer;
}

.btn-bg-green{
	display: flex;
    justify-content: center;
    align-items: center;
	height: 3.6rem;
	background-color:#009900;
	color:#FFFFFF;
	text-align: center;
	text-decoration: none;
    border-radius: 0.4rem;
	cursor: pointer;
	font-size: 1.4rem;
}

.btn-bg-green2{
	display: flex;
    justify-content: center;
    align-items: center;
	height: 32px;
	background-color:#009900;
	color:#FFFFFF;
	text-align: center;
	text-decoration: none;
    border-radius: 0.4rem;
	cursor: pointer;
	font-size: 1.4rem;
}

.btn-bg-red{
	display: flex;
    justify-content: center;
    align-items: center;
	height: 3.6rem;
	background-color:#DC3545;
	color:#FFFFFF;
	text-align: center;
	text-decoration: none;
    border-radius: 0.4rem;
	cursor: pointer;
	font-size: 1.4rem;
}

.btn-bg-red2{
	display: flex;
    justify-content: center;
    align-items: center;
	height: 36px;
	background-color:#FFFFFF;
	color:#DC3545;
	text-align: center;
	text-decoration: none;
	border: 1px solid #DC3545;
    border-radius: 0.4rem;
	cursor: pointer;
	box-sizing: border-box;
}

.btn-delete{
	cursor: pointer;
	color: #DC3545;
	border-spacing: 0px;
	text-decoration: underline;
}

.btn-bg-yellow{
	display: flex;
    justify-content: center;
    align-items: center;
	height: 3.6rem;
	background-color:#CEBA4C;
	color:#FFFFFF;
	text-align: center;
	text-decoration: none;
    border-radius: 0.4rem;
	cursor: pointer;
	font-size: 1.4rem;
}

/*
--------------------------------------
ファイル選択
--------------------------------------
*/

.file-button{ 	
	/*「選択されていません（選択後はファイル名）」のスタイル*/
	font-size: 1.2rem;
	display: ruby;
    width: 35.2rem;
}

.file-button::file-selector-button {
	/*「ファイルを選択」ボタンのスタイル*/
	display: flex;
    justify-content: center;
    align-items: center;
	height: 3.6rem;
	width: 12rem;
	background-color:#FFFFFF;
	color:#002255;
	border: 1px solid #002255;
	text-align: center;
	text-decoration: none;
    border-radius: 0.4rem;
	cursor: pointer;
	box-sizing: border-box;
}

.profile-icon{
	width: 8rem;
	height: 8rem;
	border-radius: 50%;
    object-fit: cover;
}

#filelist ul {
    list-style-type: none;
    padding: 0;
}
.table-img-set ul {
    list-style-type: none;
    padding: 0;
}

.file-item {
    margin-bottom: 10px;
}
/*
--------------------------------------
ページネーション
--------------------------------------
*/
.pagination-num {
	font-size: 1.2rem;
	padding: 0;
	float: left;
}

.pagination-clumn {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}

.pagination-navi{
	color: black;
	font-size: 1.4rem;
	float: left;
	text-decoration: none;
	border: 1px solid #E5E5E5;
	height: 3.2rem;
	width: 3.2rem;
	line-height: 3.2rem;
	text-align: center;
	cursor: pointer;
}

.pagination-navi a{
	color: #222222;
	display:block
}
.pagination-navi button{
	background: transparent;
    border: none;
    cursor: pointer;
}
.pagination-navi-on{
	background-color: #002255;
	color: #FFFFFF;
	font-size: 1.4rem;
	float: left;
	text-decoration: none;
	border: 1px solid #002255;
	height: 3.2rem;
	width: 3.2rem;
	line-height: 3.2rem;
	text-align: center;
}

.container-select {
	display: flex;
}

.container-select-right {
	padding-top: 48px;
	margin-left: auto;
	display:flex;
	justify-content:flex-end;

}

/*--------------------------------------
  モーダル表示上から_002
--------------------------------------*/
.modal-btn-box {
	display: flex;
	justify-content: center;
}

.modal_wrap input {
	display: none;
}

.modal_overlay {
	display: flex;
	justify-content: center;
	overflow: auto;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.7);
	opacity: 0;
	transition: opacity 0.5s, transform 0s 0.5s;
	transform: scale(0);
}

.modal_trigger {
	position: absolute;
	width: 100%;
	height: 100%;
}

.modal_content {
	align-self: center;
	width: 33rem;
	padding: 0 1.6rem 1.7rem 1.6rem;
	box-sizing: border-box;
	background: #fff;
	line-height: 1.6em;
	transition: 0.5s;
}

.modal_content p {
	padding-top: 0;
}

.modal_wrap input:checked~.modal_overlay {
	opacity: 1;
	transform: scale(1);
	transition: opacity 0.5s;
}

.modal_wrap input:checked~.modal_overlay .modal_content {
	transform: translateY(2rem);
}

.action-row {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.action-row .select-box {
    flex: 1;
}

.action-row .cancel_button {
    margin-left: 16px;
}

.open_button {
	color: #FFFFFF;
	background-color: #B22222;
	font-weight: bold;
	text-align: center;
	cursor: pointer;
	display: block;
	padding: 6px 2px;
	max-width: 300px;
	text-decoration: none;
	border-radius: 3px;
	font-size: 12px;

}

.save_button {
	color: #FFFFFF;
	background-color: #0043C8;
	font-weight: bold;
	text-align: center;
	cursor: pointer;
	display: block;
	padding: 6px 2px;
	max-width: 300px;
	text-decoration: none;
	border-radius: 3px;
	font-size: 12px;

}

.save_draft_button {
	color: #FFFFFF;
	background-color: #00C884;
	font-weight: bold;
	text-align: center;
	cursor: pointer;
	display: block;
	padding: 6px 2px;
	max-width: 300px;
	text-decoration: none;
	border-radius: 3px;
	font-size: 12px;

}

/*スクロール無効*/
body.no-scroll {
    overflow: hidden;
    padding-right: 17px;
}

.open-button:active {
	/*ボタンを押したとき*/
	-webkit-transform: translateY(2px);
	transform: translateY(2px);
	/*下に動く*/

}

/*アイコンを表示*/
.open-button:after {
	font-family: "Font Awesome 5 Free";
	content: "\f2d0";
	padding-left: 8px;
}

/*ラベルホバー時*/
.open-button:hover {
	color: #FFFFFF;
	background-color: #4f96f6;
	transition: .6s;
}

.modal_title2 {
	font: normal normal bold 12px/17px Noto Sans JP;
}

.modal-text{
	font: normal normal normal 12px/17px Noto Sans JP;
}

.modal_title2::before {
	content: "";
	position: absolute;
	bottom: 0;
}

/*
--------------------------------------
契約管理
--------------------------------------
*/

.detail-table{
	margin-top: 2.4rem;
    display: flex;
    gap: 0.8rem;
    flex-wrap: wrap;
}

.detail-table-mt0{
    display: flex;
    gap: 0.8rem;
    flex-wrap: wrap;
}

.detail-title{
	font-weight: bold;
	margin-bottom: 0.8rem;
}

.detail-box select{
	padding-left: 0;
}

.table-detail-items{
	height: 3.2rem;
	border: 1px solid #DDE0E4;
	border-radius: 0.4rem;
	padding: 0 0.8rem 0 0.8rem;
    box-sizing: border-box;
}

.table-detail-items:disabled{
	background-color: #E9E9E9;
	color: #222222;
}

.input-gray{
	background-color: #E9E9E9;
	color: #222222;
}

.table-detail-textarea{
	height: 8rem;
	border: 1px solid #DDE0E4;
	border-radius: 0.4rem;
	padding: 0.8rem;
    box-sizing: border-box;
}

.btn-order-search {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 3.2rem;
    background-color: #707070;
    color: #FFFFFF;
    text-align: center;
    text-decoration: none;
    border-radius: 0.4rem;
    cursor: pointer;
}

.btn-search-clear {
	display: flex;
    justify-content: center;
    align-items: center;
	height: 3.2rem;
	background-color:#FFFFFF;
	color:#707070;
	border: 1px solid #707070;
	text-align: center;
	text-decoration: none;
    border-radius: 0.4rem;
	cursor: pointer;
	box-sizing: border-box;
    font-size: 1.4rem;
}

.modal-search {
    align-self: center;
    width: 114.8rem;
    padding: 1.6rem;
    box-sizing: border-box;
    background: #fff;
    line-height: 1.6em;
    transition: 0.5s;
    z-index: 2;
    margin-left: 26rem;
}

.modal-title{
    font-size: 2.4rem;
    font-weight: 600;
}

.modal-toggle-checkbox {
    display: none;
}

.modal-search-area {
	position: absolute;
    align-self: center;
    width: 114.8rem;
    padding: 1.6rem;
    box-sizing: border-box;
    background: #fff;
    line-height: 1.6em;
    transition: 0.5s;
    z-index: 2;
    margin-left: 27.6rem;
    margin-top: 20rem;
}

.modal-search_trigger {
	position: relative;
	width: 100%;
	height: 100%;
    z-index: 1;
}

.modal-search-area-app {
	position: absolute;
    align-self: center;
    width: 60rem;
    padding: 1.6rem;
    box-sizing: border-box;
    background: #fff;
    line-height: 1.6em;
    transition: 0.5s;
    z-index: 2;
    top: 100px;
}

.modal-search_trigger-app {
	position: relative;
	width: 100%;
	height: 100%;
    z-index: 1;
}

.modal-search-area p {
	padding-top: 0;
}

#searchCar:checked ~ .modal_overlay {
	opacity: 1;
	transform: scale(1);
	transition: opacity 0.5s;
}
#searchCar:checked ~ .modal_overlay .modal-search-area {
	transform: translateY(2rem);
}

#searchTradeInCar:checked ~ .modal_overlay {
	opacity: 1;
	transform: scale(1);
	transition: opacity 0.5s;
}
#searchTradeInCar:checked ~ .modal_overlay .modal-search-area {
	transform: translateY(2rem);
}

#searchMaintenance:checked ~ .modal_overlay {
	opacity: 1;
	transform: scale(1);
	transition: opacity 0.5s;
}
#searchMaintenance:checked ~ .modal_overlay .modal-search-area {
	transform: translateY(2rem);
}

#searchClient:checked ~ .modal_overlay,
#purchase_price_searchClient:checked ~ .modal_overlay{
	opacity: 1;
	transform: scale(1);
	transition: opacity 0.5s;
}
#searchClient:checked ~ .modal_overlay .modal-search-area,
#purchase_price_searchClient:checked ~ .modal_overlay .modal-search-area{
	transform: translateY(2rem);
}

#searchOrder:checked ~ .modal_overlay {
	opacity: 1;
	transform: scale(1);
	transition: opacity 0.5s;
}
#searchOrder:checked ~ .modal_overlay .modal-search-area {
	transform: translateY(2rem);
}
#clientCreate:checked ~ .modal_overlay,
#purchase_price_clientCreate:checked ~ .modal_overlay{
	opacity: 1;
	transform: scale(1);
	transition: opacity 0.5s;
}
#clientCreate:checked ~ .modal_overlay .modal-cost-input,
#purchase_price_clientCreate:checked ~ .modal_overlay .modal-cost-input{
	transform: translateY(2rem);
}

.modal-btn-group {
    display: flex;
    justify-content: flex-end;
    font-size: 1.4rem;
    position: absolute;
    bottom: 1.6rem;
    right: 1.6rem;
}

.btn-plus {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 3.2rem;
    background-color: #009900;
    color: #FFFFFF;
    text-align: center;
    text-decoration: none;
    border-radius: 0.4rem;
    cursor: pointer;
}

.btn-minus {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 3.2rem;
    background-color: #DC3545;
    color: #FFFFFF;
    text-align: center;
    text-decoration: none;
    border-radius: 0.4rem;
    cursor: pointer;
}
  
.border-gray-1{
    border: none;
    border-bottom: 1px solid #D0D4DA;
}

.detail-search-container {
    max-height: 32.2rem;
    overflow-y: auto;
    /*border-bottom: 1px solid #E5E5E5;*/
    font-size: 12px;
}

.detail-search-container table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    box-sizing: border-box;
}

.detail-search-container th, 
.detail-search-container td {
    border-right: 1px solid #E5E5E5;
    border-bottom: 1px solid #E5E5E5;
    padding: 0.8rem;
    box-sizing: border-box;
    align-items: center;
}

.detail-search-container thead th:first-child {
    border-left: 1px solid #E5E5E5;
}

.detail-search-container tbody td:first-child {
    border-left: 1px solid #E5E5E5;
}

.detail-search-list {
    position: sticky;
    top: 0;
}

.signature-item-column{
	background-color: #405980;
    color: #FFFFFF;
    display: flex;
    align-items: center;
    padding-left: 1.6rem;
    text-align: center;
    box-sizing: border-box;
}

.signature-item-area{
	background-color: #FFFFFF;
    border: 1px solid #DDE0E4;
    display: flex;
    box-sizing: border-box;
	cursor: pointer;
}

.signature-item-title{
	background-color: #DEF2FF;
    color: #3859C5;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
	cursor: pointer;
}

.signature-item-content{
    color: #222222;
    /* display: flex; */
    /* align-items: center; */
    padding-left: 0.8rem;
    padding-right: 0.8rem;
    /* text-align: center; */
    /*cursor: pointer;*/
    background-color: #FFFFFF;
    width: 25.5rem;
    height: 4.8rem;
    border: 1px solid #DDE0E4;
    box-sizing: border-box;
    line-height: 4.8rem;
}

.contract-preview{
	height: 92rem;
    background-color: #E9E9E9;
    padding-top: 1rem;
    padding-bottom: 1rem;
    box-sizing: border-box;
}

.preview-area {
    width: 64rem;
    height: 90.516rem;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    /*border: 1px solid black;*/
}

.pdf-canvas {    
	width: 100%;
    height: auto;
    display: block;
}

.signature-info{
	display: flex;
    align-items: end;
}

.signature-pagination-area{
	display: flex;
    align-items: center;
    justify-content: end;
    margin-right: auto;
    margin-left: auto;
}

.signature-pagination{
	color: black;
	font-size: 1.4rem;
	text-decoration: none;
	border: 1px solid #E5E5E5;
	height: 3.2rem;
	width: 3.2rem;
	line-height: 3.2rem;
	text-align: center;
	cursor: pointer;
	box-sizing: border-box;
	background-color: #FFFFFF;
}

.signature-pagination-selected{
	color: #FFFFFF;
	font-size: 1.4rem;
	text-decoration: none;
	border: 1px solid #E5E5E5;
	height: 3.2rem;
	width: 3.2rem;
	line-height: 3.2rem;
	text-align: center;
	box-sizing: border-box;
	background-color: #002255;
}

.signature-page-link{
    border: none;
    background: none;
    cursor: pointer;
}

.signature-page-selected{
	color: #FFFFFF;
    border: none;
    background: none;
}

.signature-data-area{
	background-color: #F5F6F9;
    width: 100%;
    box-sizing: border-box;
    padding: 1.6rem;
}

.signature-cancel-submit {
    display: flex;
    padding-top: 2.4rem;
    justify-content: flex-end;
    font-size: 1.4rem;
    margin-right:auto;
    margin-left:auto;
}

.signature-button{
	color: pointer;
	color: #3859C5;
}

.signature-modal-area {
    align-self: center;
    width: 53.2rem;
    /*height: 37.8rem;*/
    padding: 1.6rem 1.6rem 1.7rem 1.6rem;
    box-sizing: border-box;
    background: #fff;
    line-height: 1.6em;
    transition: 0.5s;
}

.signature-area{
	width: 50rem;
	height: 20rem;
	border: 1px solid #DDE0E4;
    box-sizing: border-box;
}

.modal-signature-completed {
    align-self: center;
    width: 37.1rem;
    padding: 0 1.6rem 1.7rem 1.6rem;
    box-sizing: border-box;
    background: #fff;
    line-height: 1.6em;
    transition: 0.5s;
}
.car-status0{
	width: 7.4rem;
	height: 2.4rem;
	text-align: center;
	color: #222222;
	background-color: #E9E9E9;
	border-radius: 2rem;
    display: flex;
    justify-content: center;
    line-height: 2.5rem;
}

.car-status1{
	width: 7.4rem;
	height: 2.4rem;
	text-align: center;
	color: #fff;
	background-color: #F6629F;
	border-radius: 2rem;
    display: flex;
    justify-content: center;
    line-height: 2.5rem;
}

.car-status2{
	width: 7.4rem;
    height: 2.4rem;
    color: #fff;
    background-color: #5EA7D8;
    border-radius: 2rem;
    display: flex;
    justify-content: center;
    line-height: 2.5rem;
}


.checkbox{
	width: 16px;
	height: 16px;
}

.btn-square{
	border-radius: 0;
}

/* 位置 */
.right{
	float:right;
}

/* ワークフロー　詳細 */
.wk_status0{
	display: block;
	background-color: #DDE0E4;
	border-radius: 20px;
	line-height: 2.4rem;
	width: 12rem;
	height: 2.4rem;
	text-align: center;
}

.wk_status1{
	display: block;
	background-color: #98fb98;
	border-radius: 20px;
	line-height: 2.4rem;
	width: 12rem;
	height: 2.4rem;
	text-align: center;
}

/* スケジュール管理 */
.flex{
	display: flex;
}

.schedule_font{
	text-align: left;
	font: normal normal normal 10px/15px Noto Sans JP;
	letter-spacing: 0px;
	color: #222222;
	opacity: 1;
}

.schedule_page_display{
	width: 100%;
	display: flex;
}

.schedule_table_pagination{
	width: 30%;
	display: flex;
}

.schedule_display{
	width: 35%;
	display: flex;
}

.schedule_pagenation{
	border: 1px solid #dcdcdc;
	box-sizing: border-box;
	background-color: white;
	padding: 1px;
}

.display_format{
	width: calc(100% / 3);
	font: normal normal normal 14px/20px Noto Sans JP;
	letter-spacing: 0px;
	color: #222222;
	background: #FFFFFF 0% 0% no-repeat padding-box;
	border: 1px solid #DDE0E4;
	opacity: 1;
}

.display_format-selected{
	width: calc(100% / 3);
	text-align: center;
	font: normal normal normal 14px/20px Noto Sans JP;
	letter-spacing: 0px;
	color: #FFFFFF;
	opacity: 1;
	background: #002255 0% 0% no-repeat padding-box;
	border: 1px solid #002255;
	opacity: 1;
}

.schedule-header{
    display: flex;
    color: #FFFFFF;
    background-color: #405980;
    align-items: center;
    padding: 8px 16px 8px 16px;
}

.schedule_ym{
	text-align: left;
	font: normal normal normal 18px/26px Noto Sans JP;
	letter-spacing: 0px;
	color: #FFFFFF;
	opacity: 1;
}

.search-header{
	border: none;
	background: #FFFFFF 0% 0% no-repeat padding-box;
	border: 1px solid #D0D4DA;
	border-radius: 4px;
	opacity: 1;
	cursor: pointer;
}

.select2-selection__rendered {
    line-height: 32px !important;
}
.select2-container .select2-selection--single {
    height: 32px !important;
}
.select2-selection__arrow {
    height: 32px !important;
}

/* 週(グループ) */
.calendar_week_name{
	width: 16%;
	background: #FFFFFF 0% 0% no-repeat padding-box;
	border: 1px solid #DDE0E4;
	box-sizing: border-box;
	opacity: 1;
	min-height: 163px;
}

.header_name{
	width: 16%;
	display: flex;
	align-items: center;
	font: normal normal normal 14px/20px Noto Sans JP;
	letter-spacing: 0px;
	color: #222222;
	opacity: 1;
	background: #E9E9E9 0% 0% no-repeat padding-box;
	border: 1px solid #DDE0E4;
	box-sizing: border-box;
}

.header_week{
	width: 12%;
	display: flex;
	align-items: center;
	justify-content: center;
	font: normal normal normal 14px/20px Noto Sans JP;
	letter-spacing: 0px;
	color: #222222;
	opacity: 1;
	background: #E9E9E9 0% 0% no-repeat padding-box;
	border: 1px solid #DDE0E4;
	box-sizing: border-box;
}

.header_week_today{
	background-color: #FFFFDE;
}

.schedule_table_name{
	min-height: 163px;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	position: relative;
	background: #FFFFFF 0% 0% no-repeat padding-box;
	border: 1px solid #DDE0E4;
	opacity: 1;
}

.schedule_user_icon{
	border-radius: 50%;
	object-fit: cover;
}

.schedule_user_name{
	text-align: left;
	font: normal normal normal 14px/20px Noto Sans JP;
	letter-spacing: 0px;
	color: #222222;
	opacity: 1;	
}

.schedule_user_department{
	text-align: left;
	font: normal normal normal 12px/17px Noto Sans JP;
	letter-spacing: 0px;
	color: #222222;
	opacity: 1;
}

.schedule_user_sub_department{
	text-align: left;
	font: normal normal normal 12px/17px Noto Sans JP;
	letter-spacing: 0px;
	color: #222222;
	opacity: 1;
}

.week-button-day{
	width: 12%;
	display: flex;
	flex-wrap: wrap;
	align-content: start;
	align-items: flex-start;
	justify-content: center;
	position: relative;
	background: #FFFFFF 0% 0% no-repeat padding-box;
	border: 1px solid #DDE0E4;
	box-sizing: border-box;
	padding: 0.8rem;
	opacity: 1;
}

/* 月(個人) */
.calendar-month{
    display: flex;
    flex-wrap: wrap;
}

.week-block{
	width: calc(100% / 7);
	display: flex;
	align-items: center;
	justify-content: center;
	font: normal normal normal 14px/20px Noto Sans JP;
	letter-spacing: 0px;
	color: #222222;
    background: #E9E9E9 0% 0% no-repeat padding-box;
	border: 1px solid #DDE0E4;
	box-sizing: border-box;
	opacity: 1;
}

.month-button-day{
	width: calc(100% / 7);
	display: flex;
	flex-wrap: wrap;
	align-content: start;
	align-items: flex-start;
	justify-content: center;
	position: relative;
	background: #FFFFFF 0% 0% no-repeat padding-box;
	border: 1px solid #DDE0E4;
	box-sizing: border-box;
	padding: 0.8rem;
	opacity: 1;
	min-height: 19.3rem;
}

.schedule_create{
	height: 15px;
	width: 14px;
	float: right;
	font: normal normal normal 12px/15px Font Awesome 6 Free Solid;
	letter-spacing: 0px;
	color: #009900;
	border:1px solid #009900;
	box-sizing: border-box;
	border-radius: 50%;
	opacity: 1;
}

.schedule_day{
	position: absolute;
	top: 5%;
	left: 5%;
	text-align: left;
	font: normal normal normal 14px/20px Noto Sans JP;
	letter-spacing: 0px;
	color: #222222;
	opacity: 1;
}

.schedule_day_holiday{
	position: absolute;
	top: 5%;
	left: 5%;
	text-align: left;
	font: normal normal normal 14px/20px Noto Sans JP;
	letter-spacing: 0px;
	color: #EE3313;
	opacity: 1;
}

.schedule_holiday{
	position: absolute;
	top: 7%;
	left: 20%;
	text-align: left;
	font: normal normal normal 10px/15px Noto Sans JP;
	letter-spacing: 0px;
	color: #EE3313;
	opacity: 1;
}

.schedule_container{
	padding: 2px 4px;
	width: 100%;
	border-radius: 2px;
	box-sizing: border-box;
	opacity: 1;
	cursor: pointer;
}

.schedule_item_year{
	text-align: left;
	font: normal normal normal 10px/15px Noto Sans JP;
	letter-spacing: 0px;
	color: #222222;
}

.schedule_item_car{
	text-align: left;
	font: normal normal normal 10px/15px Noto Sans JP;
	letter-spacing: 0px;
	color: #222222;
}

.schedule_item_time{
	text-align: left;
	font-size: 10px;
	letter-spacing: 0px;
	color: #222222;
	opacity: 1;
}

.schedule_item{
	/*width: 100%;*/
	/* jsで幅調整 */
	width: 0px;
	text-align: left;
	font: normal normal normal 10px/15px Noto Sans JP;
	letter-spacing: 0px;
	color: #222222;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.schedule_item_category{
	text-align: left;
	font: normal normal bold 10px/15px Noto Sans JP;
	letter-spacing: 0px;
	color: #222222;
}


/* 年(個人) */
.schedule_year{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
}

.schedule_year_month{
	width: calc(100% / 6);
	display: flex;
	align-items: center;
	justify-content: center;
	font: normal normal normal 14px/20px Noto Sans JP;
	letter-spacing: 0px;
	color: #222222;
    background: #E9E9E9 0% 0% no-repeat padding-box;
	border: 1px solid #DDE0E4;
	box-sizing: border-box;
	opacity: 1;
}

.schedule_year_days{
	width: calc(100% / 6);
	cursor: pointer;
}

.schedule_year_day{
	width: 16%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #FFFFFF 0% 0% no-repeat padding-box;
	border: 1px solid #DDE0E4;
	box-sizing: border-box;
	opacity: 1;
}

.schedule_year_holiday{
	width: 84%;
	padding: 0 6px 0 6px;
	text-align: left;
	font: normal normal normal 14px/20px Noto Sans JP;
	background: #FFFFFF 0% 0% no-repeat padding-box;
	border: 1px solid #DDE0E4;
	box-sizing: border-box;
	opacity: 1;
}

.schedule_year_holiday_container{
	width: 84%;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	background: #FFFFFF 0% 0% no-repeat padding-box;
	border: 1px solid #DDE0E4;
	box-sizing: border-box;
	opacity: 1;
}

.schedule_year_holiday_item{
	width: 100%;
	font: normal normal normal 14px/20px Noto Sans JP;
	letter-spacing: 0px;
	color: #222222;
	opacity: 1;
	white-space: nowrap;
	overflow: scroll;
}

.schedule_sat{
	background-color: #DEF2FF;
}

.schedule_sun{
	background-color: #FFDEE5; 
}

.schedule_category_0{
	background-color: #EBFFDE;
}
.schedule_category_1{
	background-color: #DEF1FF;
}
.schedule_category_2{
	background-color: #FFFFDE;
}
.schedule_category_3{
	background-color: #F2DEFF;
}
.schedule_category_4{
	background-color: #FFDEF8;
}
.schedule_category_5{
	background-color: #DEFFF9;
}
.schedule_category_6{
	background-color: #FFECDE;
}
.schedule_category_7{
	background-color: #FFDEE4;
}
.schedule_category_8{
	background-color: #DFDEFF;
}

.schedule_category_0_space{
	background-color: #5ED877;
}
.schedule_category_1_space{
	background-color: #5EA7D8;
}
.schedule_category_2_space{
	background-color: #405980;
}
.schedule_category_3_space{
	background-color: #405980;
}
.schedule_category_4_space{
	background-color: #405980;
}
.schedule_category_5_space{
	background-color: #405980;
}
.schedule_category_6_space{
	background-color: #405980;
}
.schedule_category_7_space{
	background-color: #405980;
}
.schedule_category_8_space{
	background-color: #5E5ED8;
}

/*--------------------------------------
  メール一覧
--------------------------------------*/

.unread-relative {
    position: relative;
}

.unread-cnt {
    position: absolute;
    top: 10px;
    right: 20px;
    /* transform: translate(1930%, 830%); */
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    background-color: red;
    border-radius: 50%;
    color: #fff;
}

/*--------------------------------------
  顧客管理
--------------------------------------*/

.select-box {
	padding: 0.8rem;
	background: #FFFFFF 0% 0% no-repeat padding-box;
	border: 1px solid #D0D4DA;
	border-radius: 4px;
	box-sizing: border-box;
	opacity: 1;
}

.change-btn {
	display: flex;
    justify-content: center;
    align-items: center;
    font: normal normal normal 14px/20px Noto Sans JP;
	letter-spacing: 0px;
	color: #002255;
	text-align: center;
	text-decoration: none;
	background-color: #FFFFFF;
	border: 1px solid #002255;
	border-radius: 4px;
	opacity: 1;
	cursor: pointer;
}

.text-box {
	padding: 0.8rem;
	font: normal normal normal 12px/17px Noto Sans JP;
	letter-spacing: 0px;
	color: #222222;
	border: 1px solid #D0D4DA;
	border-radius: 4px;
	box-sizing: border-box;
	opacity: 1;
}

.text-area {
	padding: 0.8rem;
	font: normal normal normal 12px/17px Noto Sans JP;
	letter-spacing: 0px;
	color: #222222;
	line-height: 2;
	border: 1px solid #D0D4DA;
	border-radius: 4px;
	box-sizing: border-box;
	opacity: 1;
}

.client-status {
	display:flex;
	justify-content: center;
	text-align: center;
	font-size: 1.2rem;
}

.purchase {
	display: flex;
    justify-content: center;
    align-items: center;
	background-color:#5EA7D8;
	color:#FFFFFF;
	text-align: center;
    border-radius: 20px;
	opacity: 1;
}

.sale {
	display: flex;
    justify-content: center;
    align-items: center;
	background-color:#F6629F;
	color:#FFFFFF;
	text-align: center;
    border-radius: 20px;
	opacity: 1;
}

.vehicle_histories_status {
	width: 100%;
	height: 2.4rem;
	display: flex;
    justify-content: center;
    align-items: center;
	color:#FFFFFF;
	text-align: center;
    border-radius: 20px;
	opacity: 1;
}

.amount {
	text-align: right;
}

.btn-delete-newcus{
	display:block;
	font-size: 1.4rem;
	align-items: center;
	margin-left:auto;
}

.group {
    display: flex;
    align-items: center;
    margin-bottom: 1rem; /* 下余白で行間を調整 */
}

.group > * {
    margin-right: 8px;
}

.a-link {
	text-decoration: underline;
	cursor: pointer;
    color: #3859C5;
}

.a-link:visited {
	text-decoration: underline;
    color: #3859C5;
}

/*--------------------------------------
  買掛／売掛管理
--------------------------------------*/
.payable-data-area-title{
	text-align: left;
	font: normal normal bold 16px/24px Noto Sans JP;
	letter-spacing: 0px;
	color: #222222;
	opacity: 1;
}

.payable-search-requirements{
	border: 1px solid #ccc;
	border-radius: 0.4rem;
	box-sizing : border-box;
	padding: 0.5%;
}

.pr-wi-70{
	width: 70px;
}

.status-complete {
     background-color: #E9E9E9;
}
    
.status-incomplete-buy {
     background-color: #FFEFF2;
    	
}

.status-incomplete-sell {
	 background-color: #EFF9FF;
}

.button-container{
    display: flex;
    justify-content: flex-end;
}

.table-container {
    max-height: 600px;
    overflow-y: auto;
    position: relative;
}

.table-container table {
	border-spacing: 0;
	border-collapse: collapse;
}

.table-container td {
	padding: 0.5%;
	border:1px solid #E9E9E9;
	box-sizing: border-box;
}

.custom_modal_overlay {
    display: none; 
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1000;
    opacity: 0;
    transform: scale(0.9);
    transition: opacity 0.5s, transform 0.5s;
}

.custom_modal_content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: white;
    width: 33rem;
	padding: 0 1.6rem 1.7rem 1.6rem;
    border-radius: 5px;
    z-index: 1001;
    transition: transform 0.5s;
}

.custom_modal_wrap input:checked~.custom_modal_overlay {
    display: block;
    opacity: 1;
    transform: scale(1);
}

.custom_modal_wrap input:checked~.custom_modal_overlay .custom_modal_content {
    transform: translate(-50%, -50%);
}

.table-input-content-2 {
	border: 1px solid #D0D4DA;
	box-sizing : border-box;
	padding: 1.6rem;
}

/*--------------------------------------
  在庫管理
--------------------------------------*/
.text-color-red{
    color: red;
}

/*--------------------------------------
  自社設定
--------------------------------------*/
.company-detail-table{
    display: flex;
    flex-wrap: wrap;
}

/*--------------------------------------
  経営ダッシュボード
--------------------------------------*/
.text-center {
	 text-align: center;
}

.text-label {
	font: normal normal normal 12px/17px Noto Sans JP;
	letter-spacing: 0px;
}

.search-requirementbox{
	border: 1px solid #D0D4DA;
	border-radius: 0.4rem;
	margin-top: 1.5rem;
	box-sizing : border-box;
	padding-left: 0.8rem;
}

.serch-btn {
	display: flex;
}

.nami {
	margin-left: 0.5rem;
	margin-right: 0.5rem;
	margin-top: 1.8rem;
}

/*--------------------------------------
  売上管理
--------------------------------------*/
.sort-btn {
  cursor: pointer;
  position: relative;
}

.sort-btn::before, .sort-btn::after {
  content: "";
  height: 0;
  width: 0;
  position: absolute;
  border: 5px solid transparent;
  right: 10px;
  top: 50%;
}

.sort-btn::before {
    border-bottom-color: #aaa;
    margin-top: -10px;
}
.sort-btn::after {
    border-top-color: #aaa;
    margin-top: 2px;
}

 .sort-btn.asc::before {
    border-bottom-color: #fff;
}
 .sort-btn.desc::after {
    border-top-color: #fff;
}

@supports (-webkit-line-clamp: 1) {
  .ellipsis_1line {
    display: -webkit-box;
    overflow: hidden;
    word-break: break-all;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    margin: 0;
  }
}

@supports (-webkit-line-clamp: 2) {
  .ellipsis_2line {
    display: -webkit-box;
    overflow: hidden;
    word-break: break-all;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin: 0;
  }
}

@supports (-webkit-line-clamp: 3) {
  .ellipsis_3line {
    display: -webkit-box;
    overflow: hidden;
    word-break: break-all;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    margin: 0;
  }
}

/*--------------------------------------
  整備管理
--------------------------------------*/
.btn-noflex{
	font-size: 1.4rem;
	align-items: center;
	margin-left:auto;
}

.change-area{
	display: flex;
	align-items: center;
}
.data-area-inner-3-divisions{
	width: 32.8%;
	padding: 1.6rem;
	background-color: #FFFFFF;
	font: normal normal normal 12px Noto Sans JP;
	box-sizing: border-box;
}

.detail-table-3-divisions{
	margin-bottom: 0.8rem;
    display: flex;
    gap: 0.8rem;
    width: 100%;
    box-sizing: border-box;
}

.maintenances-table-title {
	margin-top: 2.4rem;
	display: flex;
	gap: 0.8rem;
}

.maintenances-table-title-mt0 {
	display: flex;
	gap: 0.8rem;
}

.maintenances-input {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}

.maintenances-total {
	display: flex;
	width: 100%;
	justify-content: flex-end;
}

.table-maintenances{
    font-size: 1.2rem;
    border-collapse: collapse;
    border-left: 1px solid #DDE0E4; 
    border-right: 1px solid #DDE0E4;
    width: 100%;
}

.table-maintenances table{
	border:1px solid #DDE0E4;
	border-collapse: collapse;
}

.table-maintenances td, .table-maintenances th{
    border: none;
    padding: 0.8rem;
    border-left: 1px solid #FFFFFF;
    border-top: 1px solid #FFFFFF;
    align-items: center;
}

.table-maintenances td:first-child,th:first-child{
    border-left:none;
}

.table-maintenances tr:first-child td,tr:first-child th{
    border-top:none;
}

.table-maintenances td.border-left, th.border-left {
    border-left: 1px solid #FFFFFF;
}

.table-list-glay{
	background-color: #E9E9E9;
	text-align: left;
	font: normal normal normal 1.2rem/1.7rem Noto Sans JP;
	height: 3.2rem;
}

.table-list-white{
	background-color: #FFFFFF;
	text-align: left;
	font: normal normal normal 1.2rem/1.7rem Noto Sans JP;
	height: 3.2rem;
}

.table-list-white td {
    border: 1px solid #DDE0E4;
	height: 3.2rem;
}

.table-header{
	display: flex;
    height: 4rem;
    color: #FFFFFF;
    background-color: #405980;
    padding-right: 1.6rem;
    align-items: center;
}

.maintenances-detail-link{
    color: #FFFFFF;
}

.maintenances-status0{
	margin-right: 2.4rem;
	width: 10rem;
	height: 2.4rem;
	line-height: 2.5rem;
	text-align: center;
	color: #222222;
	background-color: #E9E9E9;
	border-radius: 2rem;
}

.maintenances-status1{
	margin-right: 2.4rem;
	width: 10rem;
	height: 2.4rem;
	line-height: 2.5rem;
	text-align: center;
	color: #fff;
	background-color: #5EA7D8;
	border-radius: 2rem;
}

#searchLoanerCar:checked ~ .modal_overlay {
	opacity: 1;
	transform: scale(1);
	transition: opacity 0.5s;
}
#searchLoanerCar:checked ~ .modal_overlay .modal-search-area {
	transform: translateY(2rem);
}
.maintenances-status-change{
	padding: 0.8rem;
	background: #FFFFFF 0% 0% no-repeat padding-box;
	border: 1px solid #D0D4DA;
	border-radius: 4px;
	box-sizing: border-box;
	opacity: 1;
	}
	
.modal_checkbox input[type='checkbox'] {
  display: block;
}

.loaner-car-schedule-week-block{
	display: flex;
	align-items: center;
	justify-content: center;
    border: 1px solid #DDE0E4;
	box-sizing: border-box;
	height: 2.55rem;
}

.loaner-car-schedule-header-color{
	font: normal normal normal 14px/20px Noto Sans JP;
	background: #E9E9E9 0% 0% no-repeat padding-box;
}

.loaner-car-sticky {
	position: sticky;
	left: 0;
}

.loaner-car-schedule-day{
	background: #FFFFFF 0% 0% no-repeat padding-box;
	border: 1px solid #DDE0E4;
	box-sizing: border-box;
	font-size: 1em;
	padding-top: 8px;
}

.loaner-car-font-size{
	font-size: 10px;
}

.loaner-car-ellipsis {
    display: -webkit-box;
    overflow: hidden;
    word-break: break-all;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    margin: 0;
}

.schedule-bar{
    display: inline-block;
}

.tooltip {
	display: none;
    position: fixed;
    border: 1px solid var(--unnamed-color-dde0e4);
    text-align: left;
    color: #333;
    background: #FFFFFF 0% 0% no-repeat padding-box;
    box-shadow: 1px 2px 6px #00000029;
    width:400px;
    opacity: 1;
    font: normal normal normal 12px/17px Noto Sans JP;
    z-index: 1;
    position: relative;
    margin-top:22px;
    
  }
  
.schedule-bar:hover .tooltip{
      display: block;
}

.schedule-scroll-y{
    overflow-y: auto;
}

.schedule-scroll-x{
    overflow-x: auto;
}

.schedule-w-166 {
	max-width: 20%;
	min-width: 20%;
}

.schedule-w-31 {
	max-width: 5%;
	min-width: 5%;
}

.schedule-header-w-1127 {
	max-width: 1127px;
}

.schedule-header-w-1096 {
	max-width: 1096px;
}

.schedule-header-w-1065 {
	max-width: 1065px;
}

.schedule-header-w-1034 {
	max-width: 1034px;
}

.loaner-car-schedule-header-ym{
    display: flex;
    color: #FFFFFF;
    background-color: #405980;
    align-items: center;
    padding: 8px 16px 8px 16px;
    box-sizing: border-box;
}

.loaner-car-schedule-header-font{
    font: normal normal normal 12px/17px Noto Sans JP;
}

#loanerCarSchedule:checked ~ .modal_overlay {
	opacity: 1;
	transform: scale(1);
	transition: opacity 0.5s;
}
#loanerCarSchedule:checked ~ .modal_overlay .modal-search-area {
	transform: translateY(2rem);
}

 .ellipsis-marks {
 	display: -webkit-box !important;
 	-webkit-box-orient: vertical;
 	-webkit-line-clamp: 1;
 	overflow: hidden;
 }
 
 .opttest {
 	visibility: hidden;
 	margin-top: -15px;
 }
 
 /*--------------------------------------
  ホーム
--------------------------------------*/
.top-box-border {
	border-top: 4px solid #002255;
}
 
.top-box {
	background: #FFFFFF 0% 0% no-repeat padding-box;
	border: 1px solid #E5E5E5;
	opacity: 1;
	box-sizing: border-box;
}
.todo-font{
	font: normal normal bold 16px/24px Noto Sans JP;
}

.todo-box1{
	background: #DC3545 0% 0% no-repeat padding-box;
	opacity: 1;
	width: 12.6rem;
	height:3.2rem;
	color: #FFFFFF;
	align-items: center;
	margin-top: 1.2rem;
	font: normal normal bold 12px/17px Noto Sans JP;
	text-align: center;
	line-height: 3.2rem;
}

.todo-box2{
	background: #707070 0% 0% no-repeat padding-box;
	opacity: 1;
	width: 12.6rem;
	height:3.2rem;
	color: #FFFFFF;
	align-items: center;
	margin-top: 1.2rem;
	font: normal normal bold 12px/17px Noto Sans JP;
	text-align: center;
	line-height: 3.2rem;
}

.todo-box3{
	background: #009900 0% 0% no-repeat padding-box;
	opacity: 1;
	width: 12.6rem;
	height:3.2rem;
	color: #FFFFFF;
	align-items: center;
	margin-top: 1.2rem;
	font: normal normal bold 12px/17px Noto Sans JP;
	text-align: center;
	line-height: 3.2rem;
}

.todo-number{
	opacity: 1;
	width: 4rem;
	height:2.6rem;
	color: #EE3313;
	text-align: left;
	margin-top: 1.5rem;
	font: normal normal bold 18px/26px Noto Sans JP;
	line-height: 2.6rem;
	text-decoration: underline;
}

.todo-number-today{
	opacity: 1;
	width: 12rem;
	height:2.6rem;
	color: #EE3313;
	text-align: left;
	margin-top: 1.5rem;
	font: normal normal bold 18px/26px Noto Sans JP;
	line-height: 2.6rem;
	text-decoration: underline;
}

.todo-message{
	opacity: 1;
	height:1.7rem;
	color: #222222;
	text-align: left;
	margin-top: 1.5rem;
	font: normal normal normal 12px/17px Noto Sans JP;
	line-height: 2.6rem;
	
}

.todo-arrow{
	opacity: 1;
	height:1.4rem;
	color: #222222;
	margin-left: auto;
	margin-right: 1.6rem;
	font: normal normal normal 14px/17px Noto Sans JP;
}

.link-color {
    color: #3859C5;
}

.link-font {
   font: normal normal normal 16px/24px Noto Sans JP;
}

/*--------------------------------------
  帳票管理
--------------------------------------*/
.ledger-table{
	font-size: 1.2rem;
}

.ledger-table table{
	width: 100%;
	box-sizing: border-box;
	border-collapse: collapse;
	border-spacing:0;
}

.ledger-table tr{
	border: 1px solid #D0D4DA;
	box-sizing: border-box;
	height: 3.2rem;
}

.ledger-table th{
    padding: 0 0.8rem;
    font-weight: normal;
    align-items: center;
    /*border: 1px solid #E9E9E9;*/
    box-sizing: border-box;
}

.ledger-table td{
    padding: 0.3rem;
    align-items: center;
    box-sizing: border-box;
}

.ledger-table-input{
	height: 2.4rem;
	border: 1px solid #D0D4DA;
	border-radius: 0.4rem;
	padding: 0 0.8rem 0 0.8rem;
    box-sizing: border-box;
}

.ledger-table-input:disabled{
	background-color: #E9E9E9;
	color: #222222;
}

.ledger-list{
	background-color: #707070;
	color: #FFFFFF;
	text-align: left;
	font: normal normal normal 1.2rem/1.7rem Noto Sans JP;
	box-sizing: border-box;
}

/*--------------------------------------
  マスタ管理
--------------------------------------*/
.font-supplement{
	text-align: left;
	font: normal normal normal 10px/15px Noto Sans JP;
	letter-spacing: 0px;
	color: #222222;
	opacity: 1;
}

/*--------------------------------------
  社内メール
--------------------------------------*/

.office-mail-search {
	display: block;
	position: absolute;
	top: 32px;
	left: 84px;
}

.unread_mail_number {
	font-weight: 600;
	color: #002255;
}

.table-mails{
	display: flex;
	/*justify-content: space-between;*/
	/*align-items: center;*/
}

.table-folder-list{
	background-color: #EBEDEF;
  	padding: 16px;
  	width: 176px;
   	display: flex;
 	flex-direction: column;
 	gap: 16px;
}

.table-mail-list{
	padding: 1.6rem 0 1.6rem 1.6rem;
	flex-grow: 1;  /* 右側は残りのスペースを占める */
}

.mail-unread {
    background-color: #FCF4E1;
}

.folder-container {
    display: flex;
    /*align-items: center;*/
    /*justify-content: space-between;*/
    gap: 8px;
}

.folder-list-container {
   width: 14%;
   height: 200px;
   border: 1px solid #E5E5E5;
   border-radius: 4px;
}

.folder-list-scroll {
	overflow: auto;
}

.folder-list {
    height: 200px;
    font-size: 1.2rem;
    border: none;
}

.folder-list option {
	padding: 0.8rem;
}

.folder-action-buttons {
    /*flex: 1;*/
    display: flex;
    flex-direction: column;
    align-items: stretch; /* ボタンを同じ幅で縦並びにする */
    gap: 8px;
}

.folder-action-buttons button {
    padding: 10px;
    font-size: 14px;
    cursor: pointer;
}

.folder-btn-index {
	display: flex;
	font-size: 1.4rem;
	margin-left: auto;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 16px;
}

.btn-office-mail-d{
	display:flex;
	font-size: 1.4rem;
	align-items: center;
	justify-content: flex-end;
	margin-left:auto;
	flex-wrap: wrap;
	gap: 8px;
}

.folder-maru-icon {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    flex-flow: column;
    vertical-align: top;
    font-size: 1.2rem;
    color:#fff;
}

.folder-maru-selected {
    width: 26px;
    height: 26px;
    background-color: #002255;
}

.folder-maru {
    width: 26px;
    height: 26px;
    background-color: #BFC8D5;
}
.file-upload-section {
    display: flex;
    flex-direction: column; /* フィールドを縦方向に並べる */
    align-items: flex-start; /* 左寄せ */
    gap: 16px; /* 各要素間の間隔 */
    margin-top: 24px; /* 上部に余白を追加 */
}

#file-upload-container {
    width: 100%; /* 親要素の幅を基準にする */
}

/* 媒体設定 */
.toggle_button {
	position: relative;
	display: flex;
    align-items: center;
}
.toggle_button:after{
	content: '';
	position: absolute;
	height: 13px;
	width: 13px;
	background-color: white;
	border-radius: 6.5px;
	top: 2px;
	left: 2px
}
.switch {
	appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    display: inline-block;
	width: 30px;
	height: 17px;
	background-color: #ddd;
   	border-radius: 10px;
    margin: 0;
    margin-right: 4px;
    cursor: pointer;
}
.switch:checked {
	background-color: rgb(219, 234, 254);
}
.toggle_button:has(.switch:checked):after {
	transform: translateX(100%);
  	background-color: blue;
}
.switch_label {
	cursor: pointer;
}
.switch + span {
	white-space: nowrap
}
.switch + span:before {
	content: "使用しない";
}
.switch:checked + span:before {
	content: "使用する";
}

.center {
	vertical-align: -0.8em;
}

#color-display-square {
	background-color: #FFDEE4;
	width: 1em;
	height: 1em;
	display: inline-block;
}