﻿@charset "utf-8";

/* jquery.monthlyCalendar */
/* -------------------------------------------------------- */
#calendarObj {width:100%; height:100%; display:flex; justify-content:center; align-items:center; position:fixed; top:0; left:0; z-index:400; opacity:0; pointer-events:none; transition:opacity 0.3s ease;}
#calendarObj.on {opacity:1; pointer-events:auto;}
#calendarObj > div {max-width:500px; padding:10px; background:#fff; border-radius:2px; box-shadow:0 0 5px rgba(0,0,0,0.6); box-sizing:border-box;}
#calendarObj .desc {margin:5px 0 0 0; padding:5px; background-color:#eee; box-sizing:border-box; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center;}
#calendarObj .desc > div {font-size:1.4rem; line-height:1; white-space:nowrap; padding:5px;}
#calendarObj .desc > div > span {font-size:140%; font-weight:bold; vertical-align:middle;}
#calendarObj.open {position:static; opacity:1; pointer-events:auto;}
#calendarObj.open > div {max-width:700px; padding:0; box-shadow:none;}
#calendar {margin:0 auto;}
#calendar ul {width:100%; list-style-type:none; margin:0 0 10px 0; padding:0; position:relative;}
#calendar ul li {text-align:center; margin:0; padding:0;}
#calendar ul li.date {font-weight:bold;;}
#calendar ul li.prev,
#calendar ul li.next {color:#333; padding:0 5px; background:#eee; border:solid 1px #999; position:absolute; top:0; cursor:pointer;}
#calendar ul li.prev {border-radius:3px; left:0;}
#calendar ul li.next {border-radius:3px; right:0;}
#calendar ul li span {cursor:pointer;}
#calendar table {width:100%; border-collapse:collapse; border-spacing:0; empty-cells:show; table-layout:fixed;}
#calendar th,
#calendar td {text-align:center; vertical-align:middle; padding:1px;}
#calendar th {font-size:80%;}
#calendar tr.spacer td > span {border:solid 1px transparent;}
#calendar td > span {width:100%; height:4em; border:solid 1px #ccc; box-sizing:border-box; display:block; position:relative;}
#calendar td a {width:100%; height:100%; text-decoration:none; box-sizing:border-box; display:flex; justify-content:center; align-items:center; position:absolute; top:0; left:0;}
#calendar td a.ok::before {content:'〇';}
#calendar td a.no {cursor:default;}
#calendar td a.no::before {content:'×';}
#calendar td a.term::before {content:'△';}
#calendar td a.off {opacity:1; cursor:default;}
#calendar td a.off::before {content:'－';}
#calendar td a.off::before {content:'－';}
#calendar td a.ok:hover,
#calendar td a.term:hover {background-color:rgba(0,0,0,0.1);}
#calendar td .date {width:100%; font-size:80%; line-height:1; text-align:left; padding:2px; box-sizing:border-box; display:block; position:absolute; top:0; left:0;}
#calendar td.no {}
#calendar td.sun {}
#calendar td.sat {}
#calendar td.today {}
#calendar td.holiday {}
#calendar td.dep,
#calendar td.arr {background-color:rgba(255,0,0,0.2); position:relative;}
#calendar td.dep::before,
#calendar td.arr::after {font-size:1.0rem; color:#c00; position:absolute; bottom:0;}
#calendar td.dep::before {content:'in'; left:5px;}
#calendar td.arr::after {content:'out'; right:5px;}
@media screen and (max-width:767px){
	#calendarObj > div {max-width:100%;}
	#calendar td > span {height:3em;}
}
