:root {
	--base-color: #a4896f;
	--triangle-size: 25px; /* 三角形の一辺の長さをここで変更 */
	--color-pink: #28a745;
	--color-ligth-pink: #fff4ca;
	--color-green: #5DBF14;
	--color-ligth-green: #B8E5A1;
	--color-blue: #149AB5;
	--color-testcolor2: rgb(164 137 111);
    --color-gray: gray;
    --color-lightgray: lightgray;
	--color-darkgray: darkgray;
	--color-testcolor: rgb(164 137 111);
	--color-scrollbar1: #a3a3a3;
	--color-scrollbar2: #ebd5c0;
	--color-btn-bg-color: #CCC;
	--color-btn: #a4896f;
	--color-btn-background: #FFF;
	--color-btn-disabled: #999;
	--color-btn-background-disabled: #FFF;
	--color-cell-noteditable:rgb(245 225 210);
	--color-default-hover : #f9b2d9;
	--color-dialog-green-btn: #28a745;
	--gray-modal-main:  #696969;
	--color-modal-bg:  #f2f2f2;
}

/* これを設定した要素とその子要素にはrootより優先してこちらが使用されます。 */
/*
.dark-mode {
	--color-btn: #a4896f;
	--color-btn-background: #FFF;
	--color-btn-disabled: #999;
	--color-btn-background-disabled: #FFF;
}
*/

body {
	font-family: 'Noto Sans JP', 'Arial', sans-serif;
	background: #F2F4EA;
}

/*---------------------------------------------*/
/*            テスト環境用                        */
/*---------------------------------------------*/
#divUnderDevelopmentOverlay {
	cursor: pointer;
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 99;
	background-color: #000000a6;
	place-content: center;
	text-align: center;
	color: white;
}

#divUnderDevelopmentOverlay span {
	cursor: pointer;
}

/*---------------------------------------------*/
/*            全要素に適用するもの                 */
/*---------------------------------------------*/
*:disabled {
	cursor: default !important;
}

/*---------------------------------------------*/
/*            スクロールバー                        */
/*---------------------------------------------*/
/* スクロールバー全体 */
::-webkit-scrollbar {
	width: 16.7px;
}
/* スクロールバーの軌道 */
::-webkit-scrollbar-track {
	border-radius: 0;
	background: #fbeee5;
}
/* スクロールバーのつまみ */
::-webkit-scrollbar-thumb {
	border: 1.5px solid var(--color-scrollbar1);
	border-radius: 0;
	background-color: var(--color-scrollbar2);
}
/* スクロールボタン共通スタイル */
::-webkit-scrollbar-button:single-button {
	border: 1.5px solid var(--color-scrollbar1);
	border-radius: 0;
	background-color: var(--color-scrollbar2);
	background-repeat: no-repeat;
	background-position: center;
}
/* 縦スクロールバー用のボタンサイズ */
::-webkit-scrollbar-button:single-button:vertical {
	height: 17px;
}
/* 横スクロールバー用のボタンサイズ */
::-webkit-scrollbar-button:single-button:horizontal {
	width: 17px;
}
/* 上ボタン（▲） */
::-webkit-scrollbar-button:single-button:decrement:vertical {
	background-image: url('data:image/svg+xml;utf8,<svg fill="%23fff" height="25" width="25" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M7 14l5-5 5 5z"/></svg>');
}
/* 下ボタン（▼） */
::-webkit-scrollbar-button:single-button:increment:vertical {
	background-image: url('data:image/svg+xml;utf8,<svg fill="%23fff" height="25" width="25" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/></svg>');
}
/* 左ボタン（◀） */
::-webkit-scrollbar-button:single-button:horizontal:decrement {
	background-image: url('data:image/svg+xml;utf8,<svg fill="%23fff" height="25" width="25" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M14 7l-5 5 5 5z"/></svg>');
}
/* 右ボタン（▶） */
::-webkit-scrollbar-button:single-button:horizontal:increment {
	background-image: url('data:image/svg+xml;utf8,<svg fill="%23fff" height="25" width="25" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M10 7l5 5-5 5z"/></svg>');
}
/* Firefox用 */
@-moz-document url-prefix() {
	html {
		scrollbar-width: auto; /* thin / none / auto */
		scrollbar-color: #2ecc71 #e0f5e0;
	}
}

/*---------------------------------------------*/
/*            通常ボタン （新）                     */
/*---------------------------------------------*/

button {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.3em 2em;
	font-size: 14px;
	font-weight: 600;
	background-color: var(--color-btn-background);
	color: var(--color-btn);          /* 枠線と文字色を統一 */
	border: 3px solid var(--color-btn);
	border-bottom: 5px solid var(--color-btn);
	border-radius: 4px;
	cursor: pointer;
	top: 0;
	left: 0;
	transition: background-color 0.2s ease, color 0.2s ease, top 0.1s ease, left 0.1s ease;
}
button:hover {
  background-color: var(--color-btn);
  color: var(--color-btn-background);
}
button:disabled {
  background-color: var(--color-btn-background-disabled);
  color: var(--color-btn-disabled);
  border-color: var(--color-btn-disabled);
  cursor: not-allowed;
  pointer-events: none;
  opacity: 0.6;
}
button:active:not(:disabled),
button.active,
button.active[disabled] {
	background-color: var(--color-btn);
	color: var(--color-btn-background);
	border-color: var(--color-btn);
	top: 2px;
	left: 1px;
	cursor: default;
	opacity: unset;
}
button.active,
button.active[disabled] {
	pointer-events: none;
}

/*  色変更用スタイル  */
.btn-green {	
	--color-btn: var(--color-green);
	--color-btn-background: #FFF;
	--color-btn-disabled: #999;
	--color-btn-background-disabled: #FFF;
}
.btn-base-color {	
	--color-btn: #FFF;
	--color-btn-background: var(--base-color);
	--color-btn-disabled: #999;
	--color-btn-background-disabled: #FFF;
	border: 3px solid var(--base-color);
}

.btn-dialog {
	--color-btn-background: #FFF;
	--color-btn-disabled: #999;
	--color-btn-background-disabled: #FFF;
}


/***** チェックボックス *****/
label:has(input[type="checkbox"]) {
	cursor: pointer;
	margin-right: 10px;
}
input[type="checkbox"].custom-check {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	inline-size: 1em;
	block-size: 1em;
	border: 1px solid;
	background-color: white;
	border-radius: 0.25em;
	position: relative;
	vertical-align: middle;
	margin-right: 8px;
	cursor: pointer;
	bottom: 2px;
}
input[type="checkbox"].custom-check:checked::after {
	content: "";
	position: absolute;
	inset-inline-start: 0.22em;
	inline-size: 0.3em;
	block-size: 0.6em;
	border: solid white;
	border-width: 0 0.15em 0.15em 0;
	transform: rotate(45deg);
}
input[type="checkbox"].custom-check.middle{
	-moz-transform: scale(1.3);
	-webkit-transform: scale(1.3);
	transform: scale(1.3);
}
body input[type="checkbox"].custom-check:disabled {
	/*background-color: #fff;*/
	background-color: #aaa;
	border-color: #aaa;
}
body input[type="checkbox"].custom-check:checked:disabled {
	background-color: #aaa;
	border-color: #aaa;
}
/* ベージュ */
input[type="checkbox"].custom-check.base-color{
	border-color: var(--base-color);
}
input[type="checkbox"].custom-check.base-color:not(:disabled):hover{
	border-color: var(--base-color);
	background-color: var(--base-color);
}
input[type="checkbox"].custom-check.base-color:checked {
	border-color: var(--base-color);
	background-color: var(--base-color);
}
/* 緑 */
input[type="checkbox"].custom-check.green{
	border-color: var(--color-green);
}
input[type="checkbox"].custom-check.green:not(:disabled):hover{
	border-color: var(--color-green);
	background-color: rgba(93,191,20, 0.3); /* #5DBF14 */
}
input[type="checkbox"].custom-check.green:checked {
	border-color: var(--color-green);
	background-color: var(--color-green);
}
/* ピンク */
input[type="checkbox"].custom-check.pink{
	border-color: var(--base-color);
}
input[type="checkbox"].custom-check.pink:not(:disabled):hover{
	border-color: var(--base-color);
	background-color: var(--base-color);
}
input[type="checkbox"].custom-check.pink:checked {
	border-color: var(--base-color);
	background-color: var(--base-color);
}

/***** ラジオボタン *****/
label:has(input[type="radio"]) {
	cursor: pointer;
}
input[type="radio"] {
	margin: 0 5px 0 0;
	vertical-align: middle;
}
label:has(input[type="radio"]) {
	margin-right: 10px;
}
input[type="radio"] {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	width: 18px;
	height: 18px;
	border: 1px solid var(--base-color);
	border-radius: 50%;
	position: relative;
	cursor: pointer;
	vertical-align: middle;
	background-color: #FFF;
	bottom: 2px;
}
input[type="radio"]:disabled {
	background-color: #fff;
	border-color: #aaa;
}
input[type="radio"]:not(:disabled):not(:checked):hover {
	background-color: var(--color-ligth-pink);
}
/* チェックされたラジオボタンの中央にピンク丸 */
input[type="radio"]:checked::before {
	content: "";
	width: 10px;
	height: 10px;
	background-color: var(--base-color);
	border-radius: 50%;
	position: absolute;
	top: 3px;
	left: 3px;
}
input[type="radio"]:disabled:checked::before {
	background-color: #aaa;
}

/***** プルダウン *****/
.pulldown {
	width: 100%;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border: 1px solid var(--color-testcolor);
	background-color: white;
	background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 140 140' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolygon fill='%23000000' points='70,100 20,40 120,40'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: calc(100% - 5px) center;
	background-size: 15px;
	padding: 5px;
	padding-right: 25px;
	line-height: 1;
	min-width: 60px;
}
select option {
  background-color: #FFF;
}
/* 緑 */
.pulldown.green {
	border-color: var(--color-green);
	background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 140 140' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolygon fill='%235DBF14' points='70,100 20,40 120,40'/%3E%3C/svg%3E");
}
.pulldown.green option:checked {
  background-color: var(--color-ligth-green);
}
/* ピンク */
.pulldown.pink {
	border-color: var(--color-pink);
	background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 140 140' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolygon fill='%23dc457d' points='70,100 20,40 120,40'/%3E%3C/svg%3E");
}
.pulldown.pink option:checked {
  background-color: var(--color-ligth-pink);
}

/***** 独自右クリックメニュー *****/
/*
.contextmenu {
	position: fixed;
	z-index: 99;
	background: #fff;
	font-size: 11px;
	user-select: none;
	box-shadow: 2px 2px 2px 0 #8f9091;
	border: 1px solid #c6c6c6;
	padding: 0;
	padding-top: 4px;
	padding-bottom: 4px;
	margin: 0;
	outline: 0;
	display: none;
}
*/
.contextmenu {
    position: fixed;
    z-index: 99;
    background: #fff;
    font-size: 10pt;
    line-height: 2;
    user-select: none;
    box-shadow: 2px 2px 2px 0 #8f9091;
    border: 1px solid #c6c6c6;
    padding: 0;
    padding-top: 4px;
    padding-bottom: 4px;
    margin: 0;
    outline: 0;
    display: none;
	max-width: 40vw;
}

/*
.contextmenu div {
	box-sizing: border-box;
	display: block;
	padding: 8px 8px 8px 28px;
	width: 250px;
	position: relative;
	cursor: default;
	font-family: sans-serif;
}
*/
.contextmenu > div {
    box-sizing: border-box;
    display: block;
    padding-left: 1em;
    padding-right: 2em;
    width: unset;
    position: relative;
    cursor: default;
    font-family: sans-serif;
}

.contextmenu > div.has-submenu {
	position: relative;
}

.contextmenu > div:hover {
	background: #ebebeb;
}

.contextmenu > div.disabled {
	background-color: #f5f5f5; /* 通常より薄いグレー */
	color: #a0a0a0;            /* 薄い文字色 */
	cursor: not-allowed;       /* 操作不可カーソル */
	pointer-events: none;      /* ホバーやクリック無効化 */
	opacity: 0.6;              /* 全体的に薄く見せる */
}

.submenu {
	position: absolute;
	top: 0;
	left: 100%;
	background: #fff;
	border: 1px solid #ccc;
	display: none;
	max-height: 40vh;
	overflow-y: auto;
}

.submenu > div{
	text-wrap-mode: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}

.has-submenu:hover .submenu {
	display: block;
}

.submenu > div:hover {
	background: #ebebeb;
}

.contextmenu hr {
	border: 1px solid #e9e9e9;
	border-bottom: 0;
	margin-top: 5px;
	margin-bottom: 5px;
}

/***** モーダル *****/
/* モーダル表示時、ページスクロールさせない */
body.no-scroll {
	overflow: hidden;
}
/* 背景 */
#modalOverlay,
#default-frame-modalOverlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	/*background-color: rgba(0, 0, 0, 0.5);*/
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 1000;
}
/* 本体 */
#modalOverlay .modalContent,
#default-frame-modalOverlay .default-frame-modalContent {
	background-color: #fff9fc;
	display: none;
	width: 500px;
	max-height: 80vh;
	box-sizing: border-box;
	flex-direction: column;
	border: 4px solid var(--color-pink);
	box-shadow: 0 0 12px rgba(0, 0, 0, 0.2);
	position: relative;
}
#modalOverlay .modalContent.active,
#default-frame-modalOverlay .default-frame-modalContent.active {
	display: flex;
}
#modalOverlay .modalContent.rounded,
#default-frame-modalOverlay .default-frame-modalContent.rounded {
	border-radius: 7px;
}
/* ヘッダー部分 */
#modalOverlay .modalHeader,
#default-frame-modalOverlay .default-frame-modalHeader {
	padding: 10px 16px;
	border-bottom: 1px solid #ccc;
	background-color: var(--color-pink);
	flex-shrink: 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
	color: white;
	font-size: 17px;
}
#modalOverlay .modalHeader .close-btn,
#default-frame-modalOverlay .default-frame-modalHeader .close-btn{
	font-size: 18px;
	cursor: pointer;
	user-select: none;
	padding: 0 14px;
}
#modalOverlay .modalHeader .close-btn:hover,
#default-frame-modalOverlay .default-frame-modalHeader .close-btn:hover{
	background-color: rgba(252, 225, 238, 0.5);
}
/* ボディ部分 */
#modalOverlay .modalBody,
#default-frame-modalOverlay .default-frame-modalBody {
	padding: 16px;
	overflow-y: auto;
	flex-grow: 1;
}
#modalOverlay .message-row,
#default-frame-modalOverlay .default-frame-message-row {
	display: flex;
	align-items: center;
	gap: 20px;
	padding: 40px 20px;
}
#modalOverlay .modal-text,
#default-frame-modalOverlay .default-frame-modal-text {
	font-size: 14px;
	font-weight: normal;
	line-height: 1.6;
}
#modalOverlay .modalContent .modalMessage {
	display: flex;
	align-items: start;
	gap: 15px;
}
#modalOverlay .icon-info,
#default-frame-modalOverlay .default-frame-icon-info {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 41px;
	height: 41px;
	border-radius: 50%;
	border: 2px solid var(--color-pink);
	color: var(--color-pink);
	font-size: 40px;
	font-weight: bold;
	font-family: Arial, sans-serif;
	line-height: 1;
	cursor: default;
}
#modalProcessing .modalBody {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding: 20px;
	gap: unset;
}
#modalProcessing .modalBody .modal-text{
	font-size: 17px;
}
.modal-text {
	padding-left: 20px;
	width: calc(100% - 81px);
}

/* フッター部 */
#modalOverlay .modalFooter,
#default-frame-modalOverlay .default-frame-modalFooter {
	display: flex;
	justify-content: flex-end;
	gap: 10px;
	padding: 15px;
}
#modalOverlay .modalFooter.center {
	display: flex;
	justify-content: center;
	gap: 20px;
	padding: 10px 10px 0 10px;
}
#modalOverlay .modalFooter.end {
	display: flex;
	justify-content: end;
	gap: 20px;
	padding: 10px 10px 0 10px;
}

/* ローディングスピナー */
.loader {
	width: 45px;
	height: 45px;
	border: 8px solid #f8c4dc;
	border-top: 8px solid var(--color-pink);
	border-radius: 50%;
	animation: spin 1s linear infinite;
	display: inline-block;
}
@keyframes spin {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}

/* 非表示クラス */
.hidden,
#modalOverlay.hidden,
#modalOverlay > .hidden,
#default-frame-modalOverlay.hidden,
#default-frame-modalOverlay > .hidden {
	display: none !important;
}

/***** 吹き出し *****/
.tooltip {
	position: absolute;
	background: var(--color-modal-bg);
	border: 3px solid var(--gray-modal-main);
	border-radius: 5px;
	padding: 8px;
	margin-top: 2px;
	width: 250px;
	box-sizing: border-box;
	z-index: 1000;
}
/* 吹き出し矢印のラッパー */
.tooltip-arrow-wrapper {
	position: absolute;
	top: -12px;
	height: 0;
	width: 0;
}
/* 影（三角の縁取り） */
.tooltip-arrow-border {
	position: absolute;
	border-left: 12px solid transparent;
	border-right: 12px solid transparent;
	border-bottom: 12px solid var(--gray-modal-main);
	top: 0;
	left: 0;
	z-index: 0;
}
/* 中の白三角形 */
.tooltip-arrow {
	position: absolute;
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-bottom: 10px solid var(--color-modal-bg);
	top: 3px;
	left: 3px;
	z-index: 1;
}
/* Firefox */
@-moz-document url-prefix() {
	.tooltip-arrow{
		left: 2px;
	}
}
/* Safari */
_:lang(x)+_:-webkit-full-screen-document, .tooltip-arrow{
	left: 2px;
}
/* 通常左寄せ */
.tooltip-arrow-wrapper {
  left: 48px;
}
/* 右寄せのとき */
.tooltip.right-align .tooltip-arrow-wrapper {
  left: auto;
  right: 70px;
}

/***** インフォメーションアイコン *****/
.icon-info {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 21px;
	min-width: 21px;
	height: 21px;
	border-radius: 50%;
	background-color: var(--base-color);
	color: #ffffff;
	font-size: 20px;
	font-weight: bold;
	font-family: Arial, sans-serif;
	line-height: 1;
	cursor: default;
}

.icon-margin {
	margin-top: 3px;
	margin-right: 7px;
}

.icon-circle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	background-color: #ffffff;
	color: #28a745;
	border: 4px solid #28a745;
	border-radius: 50%;
	font-weight: bold;
	font-size: 35px;
	flex-shrink: 0;
	margin-top: 5px;
}

.info-label {
	font-size: 16px;
}

/***** エクスクラメーションアイコン *****/
.icon-triangle {
	width: var(--triangle-size);
	height: calc(var(--triangle-size) * 0.866); /* 正三角形の高さ ≈ 辺 × √3/2 ≈ 0.866 */
	clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
}
.icon-triangle span {
	font-size: calc(var(--triangle-size) * 0.6);
	font-weight: bold;
	color: white;
	user-select: none;
	margin-top:2px;
}
.icon-triangle.green {
	background-color: #2C7A16;
}
.icon-triangle.pink {
	background-color: var(--color-pink);
}

/* 無効状態のボタンスタイルを追加 */
.btn-darkblue button:disabled,
.btn-darkblue input[type="button"]:disabled {
	background: #ccc !important;
	color: #666 !important;
	cursor: not-allowed !important;
}

.btn-darkblue:has(button:disabled) .bg,
.btn-darkblue:has(input[type="button"]:disabled) .bg {
	background: #999 !important;
	border-color: #999 !important;
}

/***** ラジオボタン *****/
.threeItemsRL {
	display: inline-block;
	width: 34px;
	height: 24px;
	background-size: 30px;
	background-repeat: no-repeat;
	background-position: 2px 1px;
	cursor: pointer;
	align-content: center;
	text-align: center;
}

.threeItemsRL:hover {
	background-color: var(--base-color);
	color: white;
}

.threeItemsRL-left {
	background-color: white;
	border-radius: 3px 0px 0px 3px;
	margin: 3px 1px 5px 3px;
	color: var(--base-color);
}

.threeItemsRL-center {
	background-color: white;
	border-radius: 0px 0px 0px 0px;
	margin: 3px 2px 5px 2px;
	color: var(--base-color);
}

.threeItemsRL-right {
	background-color: white;
	border-radius: 0px 3px 3px 0px;
	margin: 3px 3px 5px 1px;
	color: var(--base-color);
}

input[type="radio"]:checked+.threeItemsRL-left {
	background-color: var(--base-color);
	height: 25px;
	color: white;
}

input[type="radio"]:checked+.threeItemsRL-center {
	background-color: var(--base-color);
	height: 25px;
	color: white;
}

input[type="radio"]:checked+.threeItemsRL-right {
	background-color: var(--base-color);
	height: 25px;
	color: white;
}

.threeItemsRL-left-image {
	background-image: url(images/表示サイズ切り替え1.png);
}

.threeItemsRL-center-image {
	background-image: url(images/表示サイズ切り替え2.png);
}

.threeItemsRL-right-image {
	background-image: url(images/表示サイズ切り替え3.png);
}

input[type="radio"]:checked+.threeItemsRL-left-image {
	background-image: url(images/表示サイズ切り替え1_w.png);
}

input[type="radio"]:checked+.threeItemsRL-center-image {
	background-image: url(images/表示サイズ切り替え2_w.png);
}

input[type="radio"]:checked+.threeItemsRL-right-image {
	background-image: url(images/表示サイズ切り替え3_w.png);
}

.section-title {
    margin-left: 3%;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 1.5px;
    color: #000000;
}

/*	ダイアログ用の定義 */
.dialogWrapper {
	left: 0;
	top: 0;
	position: absolute;
	z-index: 1000;
	width: 100vw;
	height: calc(100vh - 100px);
	display: flex;
	align-items: center;
	justify-content: center;
}

/*  パスワード入力項目用CSS  */
.material-symbols-outlined {
	font-family: 'Material Symbols Outlined';
	font-weight: normal;
	font-style: normal;
	font-size: 14pt; /* アイコンサイズ */
	line-height: 1;
	display: inline-block;
	vertical-align: middle;
	color: #878787;
	padding-top: 3px;
}

.pwd-field {
	position: relative;
	display: inline-flex;
	align-items: center;
	width: 100%;
}

.pwd-field input {
    padding-right: 1.8rem !important; /* ボタン分の余白 */
}

.pwd-field button {
	position: unset;
	display: unset;
	align-items: unset;
	justify-content: unset;
	padding: unset;
	font-size: unset;
	font-weight: unset;
	background-color: unset;
	color: unset;
	border: unset;
	border-bottom: unset;
	border-radius: unset;
	cursor: unset;
	top: unset;
	left: unset;
	transition: unset;	
	
	position: absolute;
	right: 0.25rem;
	background: none;
	border: none;
	cursor: pointer;
	color: #444;
	display: flex;
}

input[type="password"]::-ms-reveal {
  display: none;
}

/* ページタイトルラベル */
.title-block {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	margin: 0 10px 10px 10px;
}

.title-block > h2 {
	font-size: 20px;
	font-weight: 300;
	margin: 0;
	color: black;
}

.title-block > div {
	width: 100%;
	height: 1px;
	background: black;
	border-radius: 1px;
}

.title-inputs{
	gap: 40px;
	margin:10px 150px 10px 10px ;
}