* {
	padding: 0;
	margin: 0;
	box-sizing: border-box;
	text-decoration: none;
	list-style: none;
}
textarea:focus,
input:focus,
select:focus {
	outline: none;
}
body { 
	font-size: 16px;
	font-weight: normal;
	color: #000;
	background: #EEE;
	font-family: "Noto Sans JP", serif;
	font-optical-sizing: auto;
	font-style: normal;
	text-align: center;
	line-height: 100%;
}
a:hover {
	text-decoration: none;
}

a.link_text {
	color: #2459e0;
	cursor: pointer;
}

/* ------------------------------------- */

.container {
	padding: 16px;
	
}
.container--backoffice {
	/* min-width: 1260px; */
	min-width: 1350px;
}

.whitebg {
	width: 100%;
	max-width: 1200px;
	padding: 24px;
	background: #FFF;
	border-radius: 4px;
	margin: 0 auto 0 auto;
	text-align: left;
	box-shadow: 0 0 10px rgba(0,0,0,0.1);
}
.whitebg--sp {
	max-width: 400px;
}
.whitebg--max {
	max-width: 100%;
}

/* ------------------------------------- */
.logo {
	width: 100%;
	max-width: 400px;
	overflow: hidden;
	border-radius: 8px;
	margin: 0 auto 16px auto;
}
.logo img {
	width: 100%;
}
/* ------------------------------------- */
/* input */
/* ------------------------------------- */
.input_area {
	padding-bottom: 16px;
}
.input_area--last {
	padding-bottom: 0px;
}
.input_title {
	display: block;
	font-size: 16px;
	padding-bottom: 8px;
}
.input_input {
	display: block;
	position: relative;
}
.input_text {
	display: block;
	width: 100%;
	font-size: 16px;
	padding: 12px;
	border: 1px solid #AAA;
	border-radius: 4px;
	line-height: 100%;
}
.input_text::focus {
	border: 1px solid #AAA;
}
.input_text::placeholder {
	color: #AAA;
}
.input_select {
	appearance: none;
	display: block;
	width: 100%;
	font-size: 16px;
	color: #000;
	padding: 13px 42px 13px 12px;
	border: 1px solid #AAA;
	border-radius: 4px;
	background: #FFF;
	line-height: 100%;
}
.input_select__icon {
	color: #2459e0;
	position: absolute;
	right: 10px;
	top: 10px;
}
.input_select::focus {
	border: 1px solid #AAA;
}

.input_button {
	position: relative;
	display: block;
	width: 100%;
	padding: 24px 16px;
	border-radius: 4px;
	text-align: center;
	color: #FFF;
	background: #2459e0;
	line-height: 100%;
	cursor: pointer;
}
.input_button:hover {
	opacity: 0.8;
}

.input_button__icon {
	position: absolute;
	left: 11px;
	top: 21px;
}
.input_button__icon--right {
	position: absolute;
	right: 11px;
	top: 21px;
}

.input_viewonly {
	
}
.input_caution_text {
	color: #FF0000;
	font-size: 14px;
	padding-top: 2px;
	display: none;
}

.button_lock {
	background-color: #CCC;
	color: #FFF;
	pointer-events: none;
}

.input_area.input_area--caninput .input_title {
	color: #008241;
	font-weight: bold;
}
.input_area.input_area--caninput .input_text,
.input_area.input_area--caninput .input_select {
	border: 2px solid #008241;
}
.input_text--error {
	border-color: #FF0000 !important;
}
.input_text--lock {
	pointer-events: none;
}

.green_caution {
	width: 100%;
	text-align: center;
	padding: 8px;
	font-size: 14px;
	color: #FFF;
	font-weight: bold;
	background: #008241;
	border-radius: 4px;
	margin-bottom: 24px;
}


/* ------------------------------------- */
/* table */

table.table__mini {
	width: 100%;
	border-left: 1px solid #AAA;
	border-top: 1px solid #AAA;
	border-collapse: collapse;
	border-spacing: 0;
}
table.table__mini tr {
	
}
table.table__mini tr th,
table.table__mini tr td {
	border-right: 1px solid #AAA;
	border-bottom: 1px solid #AAA;
	padding: 8px;
	font-size: 14px;
}
table.table__mini tr th {
	text-align: center;
	font-weight: normal;
	color: #FFF;
	background: #2459e0;
}
table.table__mini tr td {
	text-align: left;
}



/* ------------------------------------- */
/* block1 - 日付変更 */
/* ------------------------------------- */
.block1 {
	display: table;
	width: 100%;
	margin-bottom: 24px;
}
.block1__emem1 {
	display: table-cell;
	width: 33px;
}
.block1__emem2 {
	display: table-cell;
	text-align: center;
	vertical-align: middle;
	font-size: 24px;
}
.block1__emem3 {
	display: table-cell;
	width: 33px;
}
.block1__emem4 {
	display: block;
	color: #2459e0;
	font-size: 12px;
	text-align: center;
	line-height: 100%;
}

/* ------------------------------------- */
/* block2 - セラピスト氏名 */
/* ------------------------------------- */
.block2 {
	padding: 0;
	font-size: 24px;
	text-align: center;
	font-weight: bold;
	margin-bottom: 40px;
}

/* ------------------------------------- */
/* block3 - ログアウトボタン */
/* ------------------------------------- */
.block3 {
	text-align: center;
	margin-top: 10px;
	padding-bottom: 24px;
}
.block3__elem1 {
	color: #2459e0;
	font-size: 12px;
}
.block3__elem1:hover {
	opacity: 0.5;
}

/* ------------------------------------- */
/* block4 - サマリのテーブル */
/* ------------------------------------- */
.block4 {
	padding: 16px;
}
.block4__elem1 {
	font-size: 24px;
	font-weight: bold;
	padding-bottom: 24px;
}
.block4__elem2 {
	width: 100%;
	border-top: 1px solid #CCC;
	border-left: 1px solid #CCC;
	border-collapse: collapse;
	border-spacing: 0;
}
.block4__elem2 tr th,
.block4__elem2 tr td {
	border-right: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
	padding: 8px;
}
.block4__elem2 tr th {
	text-align: center;
}
.block4__elem2 tr td:nth-of-type(1) { width: 50px; text-align: center; }
.block4__elem2 tr td:nth-of-type(2) { width: 40px; text-align: center; }
.block4__elem2 tr td:nth-of-type(3) { text-align: right; }
.block4__elem2 tr td:nth-of-type(4) { text-align: right;  }
.block4__elem2 tr td:nth-of-type(5) { text-align: right; }
.block4__elem2 tr td:nth-of-type(6) { width: 120px; text-align: right;  }
.block4__elem2 tr td:nth-of-type(7) { width: 120px; text-align: right; }
.block4__elem2 tr td:nth-of-type(8) { width: 70px; text-align: center; }



.block4__elem2 tr td a {
	color: #0062ff;
}
.block4__elem2 tr td a:hover {
	opacity: 0.5;
}

.block4__elem3 {
	background: #0b2b5e;
	color: #FFF;
}
.block4__elem4 {
	background: #EEE;
}
.block4__elem5 td {
	background: #e3efff;
}
.block4__elem6 td {
	background: #ffe5e3;
}

/* ------------------------------------- */
/* block5 - サマリの 日付表示 */
/* ------------------------------------- */
.block5 {
	display: table;
	width: 100%;
	margin-bottom: 16px;
}
.block5__elem1 {
	display: table-cell;
	font-size: 24px;
	font-weight: bold;
	text-align: left;
}
.block5__elem2 {
	display: table-cell;
	text-align: right;
}
.block5__elem3 {
	padding: 4px;
	font-size: 16px;
}

.block5__elem4 {
	width: 1200px;
	position: relative;
	display: block;
	text-align: right;
	margin: 0 auto 0 auto;
}
.block5__elem5 {
	display: inline-block;
	background: #0062ff;
	color: #FFF;
	padding: 12px;
	font-size: 14px;
	border-radius: 4px;
	line-height: 4px;
}
.block5__elem5:hover {
	opacity: 0.8;
}

/* ------------------------------------- */
/* block6 - グローバルメニュー */
/* ------------------------------------- */
.block6 {
	margin-bottom: 24px;
}
.block6__elem1 {
	display: inline-block;
	color: #0062ff;
}
.block6__elem2 {
	padding-left: 4px;
	padding-right: 4px;
	display: inline-block;
	opacity: 0.3;
}
.block6__elem3 {
	display: inline-block;

}	

/* ------------------------------------- */
/* block7 - 精算確定後メッセージ管理 */
/* ------------------------------------- */
.block7 {
	display: table;
	width: 100%;
}
.block7__elem4 {
	display: table-cell;
	vertical-align: top;
}
.block7__elem5 {
	width: 470px;
	display: table-cell;
	vertical-align: top;
}

.block7__elem1 {
	width: 100%;
	height: 400px;
	border: 1px solid #000;
	border-radius: 4px;
	padding: 4px;
}
.block7__elem2 {
	padding: 8px 0 0 0;
}
.block7__elem3 {
	width: 200px;
	height: auto;
	padding: 16px;
	font-size: 16px;
	border: 0;
}


/* ------------------------------------- */
/* block8 - 精算修正画面テーブル */
/* ------------------------------------- */
.block8 {
	width: 100%;
	border-top: 1px solid #CCC;
	border-left: 1px solid #CCC;
	border-collapse: collapse;
	border-spacing: 0;
}
.block8 tr th,
.block8 tr td {
	border-right: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
	padding: 8px;
	font-size: 14px;
}
.block8 tr th { background: #0b2b5e; color: #FFF; }
.block8 tr th:nth-of-type(1) { width: 105px; }
.block8 tr th:nth-of-type(2) { width: 105px; }
.block8 tr th:nth-of-type(3) { width: 70px; }
.block8 tr th:nth-of-type(4) { width: 105px; }
.block8 tr th:nth-of-type(5) { width: 105px; }

.block8__inner tr th:nth-of-type(1) { width: 35px; }
.block8__inner tr th:nth-of-type(2) { width: 50px; }
.block8__inner tr th:nth-of-type(3) { width: 70px; }
.block8__inner tr th:nth-of-type(6) { width: 110px; }
.block8__inner tr th:nth-of-type(7) { width: 80px; }
.block8__inner tr th:nth-of-type(8) { width: 80px; }
.block8__inner tr th:nth-of-type(9) { width: 90px; }
.block8__inner tr th:nth-of-type(10) { width: 80px; }
.block8__inner tr th:nth-of-type(11) { width: 80px; }
.block8__inner tr th:nth-of-type(12) { width: 70px; }

.block8__inner tr:last-child td { background: #EEE; font-weight: bold; }

.block8 tr.ch td {
	background: #fce1fa;
}

.block8 tr.hikakutei {
	background: #DDD;
}

/* ------------------------------------- */
/* block9 - 精算修正画面テーブル・修正リンク */
/* ------------------------------------- */
.block9 {
	text-align: right;
	padding-top: 8px;
}
.block9 a {
	color: #0062ff;
}

/* ------------------------------------- */
/* block10 - モーダル : 削除ボタン */
/* ------------------------------------- */
.block10 {
	text-align: center;
	margin-top: 24px;
}
.block10__elem1 {
	display: inline-block;
	margin: 0 auto 0 auto;
}
.block10__elem2 {
	margin-bottom: 4px;
}







/* ------------------------------------- */
/* block11 - 精算修正画面テーブル */
/* ------------------------------------- */
.block11 {
	width: 100%;
	border-top: 1px solid #CCC;
	border-left: 1px solid #CCC;
	border-collapse: collapse;
	border-spacing: 0;
}
.block11 tr th,
.block11 tr td {
	border-right: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
	padding: 8px;
	font-size: 14px;
	text-align: right;
}
.block11 tr th {
	background: #0b2b5e;
	text-align: center;
	color: #FFF;
	cursor: pointer;
}
.block11 tr td:nth-of-type(1) {
	text-align: left;
}

.block11 tr th.sortkey {
	color: #ff9100;
}

.block11 tr.sat td {
	background: #e3efff;
}
.block11 tr.sun td,
.block11 tr.hol td {
	background: #ffe5e3;
}

.block11.monthly th:nth-child(n+2) {
	width: 10%;
}

.block11.sb th {
	
}


/* ------------------------------------- */
/* block11 - メッセージ装飾ボタン */
/* ------------------------------------- */
.block11 {
	padding-top: 8px;
}
.block11__elem1 {
	cursor: pointer;
	display: inline-block;
	padding: 8px;
	box-shadow: 0 0 5px rgba(0,0,0,0.3);
	border-radius: 8px;
	margin-right: 4px;
}

/* ------------------------------------- */
/* block12 - メッセージ装飾CSS */
/* ------------------------------------- */
.block12__1 { color:#000; font-weight: bold; } /* 太字 */
.block12__2 { color:#000; text-decoration: underline; } /* 下線 */
.block12__3 { color: #FF0000; } /* 赤字 */
.block12__4 { color: #1147d1; } /* 青字 */

.pblock12__1 { font-weight: bold !important; } /* 太字 */
.pblock12__2 { text-decoration: underline !important; } /* 下線 */
.pblock12__3 { color: #FF0000 !important; } /* 赤字 */
.pblock12__4 { color: #1147d1 !important; } /* 青字 */


/* ------------------------------------- */
/* block12 - CSVダウンロードボタン */
/* ------------------------------------- */
.block12 {
	padding-top: 16px;
}
.block12__elem1 {
	width: 280px;
	display: inline-block;
	padding: 16px;
	background: #246e30;
}


/* ------------------------------------- */
/* block13 - 精算の詳細テーブル */
/* ------------------------------------- */
.block13 {
	width: 100%;
	border-top: 1px solid #CCC;
	border-left: 1px solid #CCC;
	border-collapse: collapse;
	border-spacing: 0;
}
.block13 tr th,
.block13 tr td {
	border-right: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
	padding: 8px;
	font-size: 13px;
}
.block13 tr th { background: #0b2b5e; color: #FFF; }

.block13 > tr > th:nth-of-type(1) { width: 100px; }
.block13 > tr > th:nth-of-type(2) { width: 100px; }

.block13__inner tr th:nth-of-type(1) { width: 50px; }
.block13__inner tr th:nth-of-type(2) { width: 80px; }
.block13__inner tr th:nth-of-type(3) { width: 80px; }
.block13__inner tr th:nth-of-type(7) { width: 90px; }
.block13__inner tr th:nth-of-type(8) { width: 90px; }
.block13__inner tr th:nth-of-type(9) { width: 90px; }
.block13__inner tr th:nth-of-type(11) { width: 90px; }
.block13__inner tr th:nth-of-type(12) { width: 90px; }
.block13__inner tr:last-child td { background: #EEE; font-weight: bold; }
.block13 tr.ch td { background: #fce1fa; }
.block13 tr.hikakutei { background: #DDD; }

.block8__elem1 { font-size: 13px !important; }
.block8__elem1:nth-of-type(1) { width: 100px !important; }
.block8__elem1:nth-of-type(2) { width: 100px !important; }
.block8__elem1:nth-of-type(4) { width: 100px !important; }
.block8__elem1:nth-of-type(5) { width: 100px !important; }



/* ------------------------------------- */
/* shopselect - 店舗切替 */
/* ------------------------------------- */
.shopselect {
	width: 100%;
	max-width: 1200px;
	padding: 0;
	margin: 0 auto 8px auto;
	text-align: left;
}
.shopselect__text {
	color: #999;
}
.shopselect__text:hover {
	opacity: 0.5;
}
.shopselect__split {
	opacity: 0.3;
}
.shopselect.all .shopselect__text--all,
.shopselect.ga .shopselect__text--ga,
.shopselect.al .shopselect__text--al,
.shopselect.taps .shopselect__text--taps {
	font-weight: bold;
	color: #ff4000;
}


/* ------------------------------------- */
/* header- ヘッダー */
/* ------------------------------------- */
.header {
	width: 100%;
	max-width: 1200px;
	padding: 8px;
	background: #FFF;
	border-radius: 4px;
	margin: 0 auto 0 auto;
	text-align: center;
	box-shadow: 0 0 10px rgba(0,0,0,0.1);
	margin-bottom: 8px;
}
.header__inner {
	width: 100%;
	display: table;
}
.header__col {
	display: table-cell;
	
}
.header__titile {
	width: 100%;
	padding: 4px;
	background: #333;
	border-radius: 4px;
	color: #FFF;
	text-align: center;
	font-size: 13px;
}
.header__col-left {
	padding-right: 4px;
	width: 400px;
}
.header__col-right {
	padding-left: 4px;
}
.header__linkarea {
	padding: 8px 0 8px 0;
}
.header__link {
	display: inline-block;
	padding: 8px;
	margin: 0 4px 0 4px;
	font-size: 14px;
	background: #FFF;
	color: #000;
	box-shadow: 0 0 5px rgba(0,0,0,0.2);
	border-radius: 8px;
}
.header__link:hover {
	opacity: 0.5;
}




/* ------------------------------------- */
/* modal- モーダル関連 */
/* ------------------------------------- */
.modal_back {
	z-index:1000;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.5);
}
.modal {
	z-index:1100;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
}
.modal__inner {
	width: 100%;
	text-align: center;
	padding: 16px;
}
.modal__wwindow {
	position: relative;
	width: 100%;
	max-width: 400px;
	margin: 0 auto 0 auto;
	background: #FFF;
	padding: 16px;
	border-radius: 8px;
	box-shadow: 0 0 16px rgba(0,0,0,0.5);
	text-align: left;
}
.modal__close {
	position: absolute;
	right: 4px;
	top: 4px;
	z-index: 1200;
}
.modal__title {
	text-align: center;
	font-size: 20px;
	font-weight: bold;
	padding: 16px;
	margin-bottom: 24px;
}
.modal__text {
	padding: 30px 10px 10px 10px;
	line-height: 180%;
}

/* ------------------------ */
.hidden_elem {
	width: 1px;
	height: 1px;
	overflow: hidden;
	position: absolute;
	left: -5000px;
	top: -5000px;
}

.sales_history {
	margin-top: 24px;
}
.sales_history_title {
	font-weight: bold;
	font-size: 20px;
	margin-bottom: 16px;
}
.sales_history_block_date {
	font-weight: bold;
	font-size: 16px;
	margin-bottom: 8px;
}
.sales_history_block_table {
	margin-bottom: 16px;
}

/* ------------------------------------- */
/* loading- ローディング*/
/* ------------------------------------- */
#loading {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.3);
	z-index: 9998;
	/*backdrop-filter: blur(5px);*/
}
.loading_ring {
	position: fixed;
	left: 50%;
	top: 50%;
	width: 100px;
	height: 100px;
	margin-top: -50px;
	margin-left: -50px;
	border-radius: 50px;
	z-index: 9999;
	border: 10px solid #CCC;
	border-top: 10px solid #FFF;
	animation: rotateAnimation 1000ms linear infinite;
}
@keyframes rotateAnimation {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}


/* ------------------------------------- */
/* 特殊表示 */
/* ------------------------------------- */
#calc_fromjs_01_area,
#calc_fromjs_01_area * {
	color: #a82532;
}