:root {
  --sky:#1e8ee5;
  --light_pink:#ffb0d3;
  --blue:#046cc5;
  --pink:#f64c97;
  
}
  
  
body{
  margin: 0;
  height: 100vh;
  overflow: hidden;
}

.center{
  text-align: center;
}


a{
  color: var(--sky);
}


/*--------------------
btn
-------------------*/
.fc .fc-button-primary,
.fc .fc-button-primary:disabled,
.fc .fc-button-primary:hover,
.fc .fc-button-primary:active{
  background: var(--light_pink);
  opacity: 1;
  color: #000;
  border: none;
}

.fc .fc-button-primary:hover{
  opacity: 0.5;
}



/*-------------------
header
----------------------*/

header{
  background: #9de7ff;
  height: 40px;
  padding: 5px;
  box-sizing: border-box;

  display: flex;
  align-items: center;
  justify-content: center;
  gap:10px;
}

header .logo{
  height: 100%;
}

header .logo a{
  display: block;
  height: 100%;
}

header .logo img{
  max-height: 100%;
  width: auto;
  display: block;
}

header h1{
  margin: 0;
  font-size: 16px;
}



/*-------------------------
main
-------------------------*/

main{
  padding: 5px;
  height: calc(100vh - 80px);
  overflow: hidden;
  display: flex;
  flex-flow: column;
}




/*-------------------------
calendar
-------------------------*/
#calendar {
  margin-top: 10px;
  flex: 1;
}
.fc-header-toolbar{
  height: 40px;
  margin: 0;
}
#calendar .fc-header-toolbar h2,
#preparationCalendarModal .fc-toolbar-title{
  font-size: 24px;
}


.fc-header-toolbar .fc-button-group button:first-child{
  position: relative;
}
.fc-header-toolbar .fc-button-group button:first-child:after{
  display: block;
  content: "";
  position: absolute;
  top: 5px;
  right: 0;
  height: calc(100% - 10px);
  width: 2px;
  background: #cc8da9;
}

.fc-scroller-liquid-absolute{
  overflow: hidden !important;
}


.fc-view-harness,
.fc-daygrid-body{
  height: 100% !important;
}


table.fc-scrollgrid,
table.fc-scrollgrid-sync-table{
  height: 100% !important;
  border: none !important;
}
table.fc-scrollgrid,
table.fc-scrollgrid th,
table.fc-scrollgrid td{
  border: none;
}



table.fc-scrollgrid td .fc-daygrid-day-frame{
  border-radius: 5px;
  border: #acacac solid 1px;
  display: flex;
  flex-flow: column;
}



table.fc-scrollgrid td .fc-daygrid-day-frame .fc-daygrid-day-events{
  flex: 1;
  margin: 0;
  display: flex;
  flex-flow: column;
}

table.fc-scrollgrid td .fc-daygrid-day-frame .fc-daygrid-day-events div{
  flex: 1;
  display: flex;
  flex-flow: column;
}

table.fc-scrollgrid .fc-scroller-harness th,
table.fc-scrollgrid .fc-scroller-harness td{
  padding: 2px;
}


table.fc-scrollgrid a{
  color: #000;
  padding: 0;
  margin: 0;
}

table.fc-scrollgrid td .fc-daygrid-event-harness a{
  display: block;
  height: 100%;
  width: 100%;
  font-size: 24px;
  text-align: center;
  flex: 1;
  position: relative;
  margin: 0 !important;
}

table.fc-scrollgrid td .fc-daygrid-event-harness a .fc-event-main{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  margin-top: 10px;
}
.fc-daygrid-day-bottom{
  display: none !important;
}

.fc-scrollgrid-section{
  height: 30px !important;
}

table.fc-scrollgrid .fc-col-header-cell{
  font-weight: normal;
  font-size: 14px;
}

table.fc-scrollgrid .fc-scroller-harness td .fc-daygrid-day-top{
  flex-direction:row;
}

table.fc-scrollgrid .fc-scroller-harness td .fc-daygrid-day-number{
  font-size: 12px;
  position: absolute;
  top: 4px;
  left: 4px;
  z-index: 10;
}


.fc-day,
.fc .fc-daygrid-day.fc-day-today{
  background: none;
}
.past-date{
  border: none !important;
  background: none !important;
}

/*--日曜----*/
.fc-day-sun{
  border: none !important;
  background: none !important;
}
.fc-day-sun .fc-daygrid-day-frame{
  background: #fcdddd;
}

/*--土曜----*/
.fc-day-sat{
  border: none !important;
  background: none !important;
}
.fc-day-sat .fc-daygrid-day-frame{
  background: #c7e2fc;
}


.fc-day-today div{
  border-color: var(--light_pink) !important;
}
.fc-day-today .fc-daygrid-day-frame{
  box-shadow: inset 0 0 0 3px var(--light_pink);
}



.fc-day-past .fc-daygrid-day-frame,
.past-date .fc-daygrid-day-frame{
  background: #a1a1a1;
}
.fc-day-past .fc-daygrid-day-frame .fc-daygrid-day-top,
.past-date .fc-daygrid-day-frame .fc-daygrid-day-top{
  opacity: 0.3;
}


.fc-h-event{
  background: none;
  border: none;
}

.fc-daygrid-event-harness{
  height: 100%;
}


/*----------------
footer
------------------*/
footer{
  height: 30px;
  overflow: hidden;
}

footer #footer_btn{
  margin: 0 !important;
}


footer #footer_btn a{
  padding: 0 !important;
  border: none !important;
  text-decoration: none;
  font-size: 12px;
}


/*----------------
modal
----------------*/
#reservationModal{
  max-height: none;
  max-width: none;
  height: 90vh; 
  width: calc(90vw - 40px);
}
#preparationCalendarModal{
  max-height: none;
  max-width: none;
  width: calc(100vw - 10px);
  height: calc(100vh - 10px);
  padding: 5px;
  border-radius: 0;
  /*
  display: flex;
  flex-flow: column;*/
}
/*
#preparationCalendar{
  flex: 1;
}*/

#preparationCalendarModal h3{
  height: 30px;
}

#preparationCalendarModal .fc-scrollgrid{
  height: calc(100vh - 140px);
}
#preparationCalendarModal .fc-scroller-liquid-absolute{
  position: static;
}
#preparationCalendarModal .fc-daygrid{
  height: calc(100vh - 140px);
  display: block;
}
#preparationCalendarModal .fc-scrollgrid .fc-scroller{
  height: 100%;
}

#preparationCalendarModal .fc-daygrid-body{
  display: flex;
}  
#preparationCalendarModal .fc-daygrid-day-events a{
  background: none;
}