/* Birth Framework CSS Kit */

@font-face 
{
	font-family: "NotoMedium";
	src: url("./NotoSansJP-Medium.woff") format('woff');
}

body
{
	background: #F6F7F8;
	font-family: 'NotoMedium';
	margin: 0 0 0 10px;
	padding: 0;
	user-select: none;
}

div.header 
{
	background: White;
	padding: 5px;
	margin: 0 0 0 -10px;
	min-height: 44px;
	box-sizing: border-box;
}

div.header h1
{
	text-align: center;
	color: #40CEF1;
	font-size: 28px;
	white-space: nowrap;
	overflow: hidden;
	padding: 5px 0;
	margin: 2px auto auto auto;
	top: 0;
}

div.detail h1
{
	color: #333;
	font-size: 20px;
	margin: 15px 0 0 10px;
}

ul 
{
	background: White;
	padding: 0;
	margin: 15px 10px 17px 0;
	border-radius: 10px;
	border: 1px solid;
	border-color: #9A999D;
}

ul li 
{
	background-color: White;
	color: #555;
	list-style-type: none;
	padding: 10px 10px 10px 10px;
}

li:first-child 
{
	border-top: 0;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
}

li:last-child 
{
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
}

ul.left
{
	background: #9AA;
	width: 48%;
	float: left;
	text-align: center;
}

ul.right
{
	background: #B8B;
	width: 48%;
	float: left;
	text-align: center;
}

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

/* 矢印 */

ul li.arrow
{
	background-image: url(../images/chevron.png);
	background-position: right center;
	background-repeat: no-repeat;
}

ul li a
{
	color: #000;
	text-decoration: none;
	white-space: nowrap;
	overflow: hidden;
	display: block;
	padding: 12px 10px 12px 10px;
	margin: -10px;
}

.cobalt
{
	color: #40CEF1;
	font-size: 24px;
	font-weight: 700;
}

/*-------------------------------
ul li.green
{
	background-color: #9DE694;
}
-------------------------------*/

ul li.lightgray
{
	background-color: #DDD;

}


ul li.confirm
{
	border-top: 0;
}
			
ul li.error 
{
	border: 2px solid red; 
}

ul li input, ul li textarea
{
	color: Black;
	background: #AAA;
	border: 0;
	font-size: 17px;
	padding: 0;
	display: inline-block;
	margin-left: 0px;
	width: 100%;
}

p
{
	color: #717175;
	margin: 0 10px 17px 0;
	padding-left: 10px;
}

table
{
	width: 100%;
	border-collapse:  collapse;
}

td
{
	width: 50%;
	border: none;
	padding: 0;
	text-align: center;
}

hr
{
	border-top: 1px solid #8c8b8b;
	border-bottom: 0;
	border-left: 0;
	border-right: 0;
}

input[type="text"],input[type="password"]
{
	background-color: #D7D8D9;
	border-radius:5px;
}



.tSunday
{
	width:20%;
	background-color:#FFE8E8;
	color:#A54545;
	text-align:center;
}

.tWeekday
{
	width:10%;
	text-align:center;
	background-color:white;
    color: #717175;
}

.tSaturday
{
	width:20%;
	text-align:center;
	background-color:#DBE9F4;
	color: #4E7CB5;
}

.calendargrid
{
	border: 1px solid #555;
	width: 90%;
	height: 300px;
	table-layout: fixed;
	margin:auto;
}

.calendargrid tbody tr td{
    border: 1px solid #555;
}

.tWidth
{
	width:auto;
    background: #FFF;
    color: #717175;
}

.tWidth a{
    color: #40CEF1;
    text-decoration: none; 
}


/* sticky table */
table#timegrid thead th
{
  /* 縦スクロール時に固定する */
  position: -webkit-sticky;
  position: sticky;
  /* tbody内のセルより手前に表示する */
  z-index: 1;
  /* 高さが変わらないよう改行させない */
  white-space: nowrap;
  background-color: white;
    font-weight: lighter;
    color: #717175;
}

table#timegrid thead tr:nth-child(1) th 
{
  top: 0;
}

table#timegrid thead tr:nth-child(2) th 
{
  top: 1.5rem;
  /* １行目の高さ */
}
table#timegrid thead tr:nth-child(3) th 
{
  /* 3行目は1?2行目の高さの位置に固定する */
  top: 3rem;
}

table#timegrid thead th:first-child
{
  /* 行内の他のセルより手前に表示する */
  z-index: 2;
}

table#timegrid tbody th:first-child
{
  /* 行内の他のセルより手前に表示する */
  z-index: 1;
}

table#timegrid th:first-child, table#timegrid td:first-child
{
  /* 横スクロール時に固定する */
  position: -webkit-sticky;
  position: sticky;
  left: 0;
    color: #717175;
    font-weight: lighter;
}

table#timegrid a
{
	text-decoration:none;
    color: #40CEF1;
    font-weight: bold;
}

table#timegrid td
{
	width:auto;
    color: #717175;
    border: 1px solid;
}

ul li select 
{
	color: #000;
	border: 0;
	font: bold 17px;
	padding: 0;
	display: inline-block;
	margin-left: 0px;
	width: 100%;
	-webkit-appearance: textarea;
	text-indent: 0px;
	background: #eee;
}

/*============
index.blade.php
=============*/

.point-container{
    display: flex;
    position: relative;
    width: 95%;
    margin: 0 auto;
    padding-bottom: 10px;
}

.point-left{
    position: absolute;
    top: 50%;
    transform: translate(0, -50%)
}

.point-left span{
    font-size: medium;
    margin-left: 10px;
    color: #717175;
}

.point-right{
    flex: 1;
    text-align: right;
}

.point-row2{
    width: 95%;
    margin: 0 auto; 
}

.point-row2 p{
    padding-left: 0px;
    margin-right: 0px;
}

.mid-weight{
    color: #717175;
    font-size: 22px;
}


/*============
index.blade.php - popup window
=============*/

.open {
	cursor:pointer;
}
#pop-up {
	display: none;
}
.overlay {
	display: none;
}
#pop-up:checked + .overlay {
	display: block;
	position: fixed;
	width: 100%;
	height: 100vh;
	top: 0;
	left: 0;
	z-index: 9999;
	background: rgba(0, 0, 0, 0.6);
}
.window {
	position: fixed;
	top: 50%;
	left: 50%;
	width: 90vw;
	max-width: 360px;
    padding: 20px;
	height: 300px;
	background-color: #fff;
	border-radius: 4px;
	align-items: center;
	transform: translate(-50%, -50%);
}
.close {
	position: absolute;
	top: 4px;
	right: 4px;
	cursor:pointer;
}

.close2 {
	cursor:pointer
}


/*============
tag
=============*/
h1{
    color: #717175;
}