@charset "utf-8";
/*===================================================================
	予約カレンダー用CSS
===================================================================*/
/* 共通 */
#top_calendar .calendar_list{margin-bottom: 40px;display: flex;    justify-content: space-between;}
#top_calendar .calendar_list .calendar_list_item{width: 24%;}
#top_calendar .calendar_list .calendar_list_item span {background: #fff;color: #63aac5;border: 2px solid #63aac5;text-align: center;padding: 10px 5px;display: block;}
#top_calendar .calendar_blue{background-color: rgba(99, 170, 197, 0.2);padding: 40px 40px 30px 40px;}
#top_calendar .calendar_blue > *{background-color: #FFFFFF;}
#top_calendar .calendar_list .calendar_list_item span.active { background:#63aac5; color:#fff; position: relative;}
#top_calendar .calendar_list .calendar_list_item span.active::after {content: '';position: absolute;top: 100%;left: 50%;transform: translateX(-50%); width: 0;height: 0;border-left: 15px solid transparent;border-right: 15px solid transparent;border-top: 15px solid #67acc8; }
#top_calendar .calendar_wrap { padding:20px; }
@media (max-width:575px){
	#top_calendar .calendar_blue{padding: 25px 25px 20px 25px !important;}
	#top_calendar .calendar_list .calendar_list_item span.active::after {border-left: 10px solid transparent;border-right: 10px solid transparent;border-top: 10px solid #67acc8; }
	#top_calendar .calendar_list{margin-bottom: 20px;}
}
@media (max-width:475px) {
	#top_calendar .calendar_list .calendar_list_item span{font-size: 0.8em;padding: 10px 2px;}
	#top_calendar .calendar_blue{padding: 15px 15px 10px 15px !important;}
	#top_calendar .calendar_wrap{padding: 10px !important;}
}
@media (max-width:375px) {
	#top_calendar .calendar_list .calendar_list_item span{font-size: 0.7em;}
}

/* グランピング */
#top_calendar #glamping_calendar .calendar_month { display:flex; justify-content:center; align-items:center; width:100%; margin-bottom:10px; }
#top_calendar #glamping_calendar .calendar_month > .main { font-size:1.75em; padding:0 15px; }
#top_calendar #glamping_calendar .calendar_month > a { width:25px; height:25px; display:block; background:no-repeat center center / contain; }
#top_calendar #glamping_calendar .calendar_month > a._back { background-image:url(../image/layout/icon/c_back.png); }
#top_calendar #glamping_calendar .calendar_month > a._next { background-image:url(../image/layout/icon/c_next.png); }
#top_calendar #glamping_calendar .tbl_calendar { width:calc(100% + 10px); border-collapse:separate; border-spacing:5px; margin:0 -5px; }
#top_calendar #glamping_calendar .tbl_calendar tr:not(.first)> * { text-align:center; padding:5px; }
#top_calendar #glamping_calendar .tbl_calendar tr > th {text-align: center;  padding: 5px; background:#DFBF81; }
#top_calendar #glamping_calendar .tbl_calendar tr > td { background:#F9F9F9; vertical-align: middle;}
#top_calendar #glamping_calendar .tbl_calendar tr > td .date { margin-bottom:5px; font-size:1.2em; }
#top_calendar #glamping_calendar .tbl_calendar tr > td a { color:#5FA5C9; }
#top_calendar #glamping_calendar .tbl_calendar tr > td a .mark { text-decoration:underline; }
#top_calendar #glamping_calendar .tbl_calendar tr > td a:hover .mark { text-decoration:none; }
#top_calendar #glamping_calendar .tbl_calendar tr > td a .time { color:#555; }
@media (max-width:767px) {
	#top_calendar #glamping_calendar .tbl_calendar_wrap:not(._type2) { max-height:400px; overflow-x:hidden; overflow-x:auto; }
	#top_calendar #glamping_calendar .tbl_calendar tr.first .name{width: 70px;}
	#top_calendar #glamping_calendar .tbl_calendar tr > td .date{font-size: 1em;}
}
@media (max-width:475px) {
	#top_calendar #glamping_calendar .calendar_month > .main{font-size: 1.25em;padding: 0 10px;}
	#top_calendar #glamping_calendar .calendar_month > a{width: 20px; height: 20px;}
	#top_calendar #glamping_calendar .guide{font-size: 0.8em;}
	#top_calendar #glamping_calendar .tbl_calendar{width: 400px; overflow-y: auto;}
	.button._type1.v2{min-width: 200px;}
}
@media (max-width:375px) {
	#top_calendar #glamping_calendar .calendar_month > .main{font-size: 1.15em;}
	.notes .note_anchor a{font-size: 0.9em;}
	#top_calendar #glamping_calendar .guide{font-size: 0.7em;}
}
/* BBQ */
#top_calendar #bbq_calendar .calendar_month { display:flex; justify-content:center; align-items:center; width:100%; margin-bottom:10px; }
#top_calendar #bbq_calendar .calendar_month > .main { font-size:1.75em; padding:0 15px; }
#top_calendar #bbq_calendar .calendar_month > a { width:25px; height:25px; display:block; background:no-repeat center center / contain; }
#top_calendar #bbq_calendar .calendar_month > a._back { background-image:url(../image/layout/icon/c_back.png); }
#top_calendar #bbq_calendar .calendar_month > a._next { background-image:url(../image/layout/icon/c_next.png); }
#top_calendar #bbq_calendar .tbl_calendar { width:calc(100% + 10px); border-collapse:separate; border-spacing:5px; margin:0 -5px; }
#top_calendar #bbq_calendar .tbl_calendar tr > * { width:calc(100% / 7); text-align:center; padding:5px; }
#top_calendar #bbq_calendar .tbl_calendar tr > th { background:#EFEADB; }
#top_calendar #bbq_calendar .tbl_calendar tr > td { background:#F9F9F9; }
#top_calendar #bbq_calendar .tbl_calendar tr > td .date { margin-bottom:5px; font-size:1.2em; }
#top_calendar #bbq_calendar .tbl_calendar tr > td a { color:#5FA5C9; }
#top_calendar #bbq_calendar .tbl_calendar tr > td a .mark { text-decoration:underline; }
#top_calendar #bbq_calendar .tbl_calendar tr > td a:hover .mark { text-decoration:none; }
#top_calendar #bbq_calendar .tbl_calendar tr > td a .time { color:#555; }
@media (max-width:767px) {
	#top_calendar #bbq_calendar .tbl_calendar_wrap { max-height:400px; overflow-y:auto; }
	#top_calendar #bbq_calendar .tbl_calendar { width:100%; border-spacing:0; margin-left:0; margin-right:0; }
	#top_calendar #bbq_calendar .tbl_calendar tr > * { display:block; width:100%; padding:0; }
	#top_calendar #bbq_calendar .tbl_calendar tr > td { display:flex; align-items:stretch; border-bottom:5px solid #fff; }
	#top_calendar #bbq_calendar .tbl_calendar tr > td.empty { display:none; }
	#top_calendar #bbq_calendar .tbl_calendar tr > td .date { width:65px; margin-bottom:0; background:#EFEADB; border-right:5px solid #fff; font-size:1em; padding:5px 0; }
	#top_calendar #bbq_calendar .tbl_calendar tr > td .date::after { content:" ("attr(data-label)")"; }
	#top_calendar #bbq_calendar .tbl_calendar tr > td ul { width:calc(100% - 65px); display:flex; padding:5px 0;flex-wrap: wrap; }
	#top_calendar #bbq_calendar .tbl_calendar tr > td ul > * { width:50%; }
	#top_calendar #bbq_calendar .tbl_calendar tr > td.finished ul > * { width:100%; }
}
@media (max-width:475px) {
	#top_calendar #bbq_calendar .guide{font-size: 0.8em;}
}
@media (max-width:375px) {
	#top_calendar #bbq_calendar .guide{font-size: 0.7em;}
}
/* サウナ */
#top_calendar #sauna_calendar .calendar_month { display:flex; justify-content:center; align-items:center; width:100%; margin-bottom:10px; }
#top_calendar #sauna_calendar .calendar_month > .main { font-size:1.75em; padding:0 15px; }
#top_calendar #sauna_calendar .calendar_month > a { width:25px; height:25px; display:block; background:no-repeat center center / contain; }
#top_calendar #sauna_calendar .calendar_month > a._back { background-image:url(../image/layout/icon/c_back.png); }
#top_calendar #sauna_calendar .calendar_month > a._next { background-image:url(../image/layout/icon/c_next.png); }
#top_calendar #sauna_calendar .tbl_calendar { width:calc(100% + 10px); border-collapse:separate; border-spacing:5px; margin:0 -5px; }
#top_calendar #sauna_calendar .tbl_calendar tr:not(.first)> * { text-align:center; padding:5px; }
#top_calendar #sauna_calendar .tbl_calendar tr > th {text-align: center;  padding: 5px; background:#EFEADB; }
#top_calendar #sauna_calendar .tbl_calendar tr > td { background:#F9F9F9; vertical-align: middle;}
#top_calendar #sauna_calendar .tbl_calendar tr > td .date { margin-bottom:5px; font-size:1.2em; }
#top_calendar #sauna_calendar .tbl_calendar tr > td a { color:#5FA5C9; }
#top_calendar #sauna_calendar .tbl_calendar tr > td a .mark { text-decoration:underline; }
#top_calendar #sauna_calendar .tbl_calendar tr > td a:hover .mark { text-decoration:none; }
#top_calendar #sauna_calendar .tbl_calendar tr > td a .time { color:#555; }
@media (max-width:767px) {
	#top_calendar #sauna_calendar .tbl_calendar_wrap { max-height:400px; overflow-y:auto; }
	#top_calendar #sauna_calendar .tbl_calendar { width:100%; border-spacing:0; margin-left:0; margin-right:0; }
	#top_calendar #sauna_calendar .tbl_calendar tr:not(.first)> * { padding:0; }
	#top_calendar #sauna_calendar .tbl_calendar tr > * { display:block; width:100%; padding:0; }
	#top_calendar #sauna_calendar .tbl_calendar tr > td { display:flex; align-items:stretch; border-bottom:5px solid #fff; }
	#top_calendar #sauna_calendar .tbl_calendar tr > td.empty { display:none; }
	#top_calendar #sauna_calendar .tbl_calendar tr > td .date { width:65px; margin-bottom:0; background:#EFEADB; border-right:5px solid #fff; font-size:1em; padding:5px 0; }
	#top_calendar #sauna_calendar .tbl_calendar tr > td .date::after { content:" ("attr(data-label)")"; }
	#top_calendar #sauna_calendar .tbl_calendar tr > td ul { width:calc(100% - 65px); display:flex; padding:5px 0; }
	#top_calendar #sauna_calendar .tbl_calendar tr > td ul > * { width:50%; }
	#top_calendar #sauna_calendar .tbl_calendar tr > td.finished ul > * { width:100%; }
}
@media (max-width:575px) {
	#top_calendar #sauna_calendar .tbl_calendar tr > td ul { flex-wrap:wrap; }
}

#top_calendar #cafe_calendar #page_title .hl_1 { padding-top:60px; background:url(../image/layout/icon/calendar.png) no-repeat center top; }
#top_calendar #cafe_calendar .calendar_month { display:flex; justify-content:center; align-items:center; width:100%; margin-bottom:10px; }
#top_calendar #cafe_calendar .calendar_month > .main { font-size:1.75em; padding:0 15px; }
#top_calendar #cafe_calendar .calendar_month > a { width:25px; height:25px; display:block; background:no-repeat center center / contain; }
#top_calendar #cafe_calendar .calendar_month > a._back { background-image:url(../image/layout/icon/c_back.png); }
#top_calendar #cafe_calendar .calendar_month > a._next { background-image:url(../image/layout/icon/c_next.png); }
#top_calendar #cafe_calendar .tbl_calendar { width:calc(100% + 10px); border-collapse:separate; border-spacing:5px; margin:0 -5px; }
#top_calendar #cafe_calendar .tbl_calendar tr > * { width:calc(100% / 9); text-align:center; padding:5px; }
#top_calendar #cafe_calendar .tbl_calendar tr > th { background:#EFEADB; }
#top_calendar #cafe_calendar .tbl_calendar tr > td { background:#F9F9F9; }
#top_calendar #cafe_calendar .tbl_calendar tr > td .date { margin-bottom:5px; font-size:1.2em; }
#top_calendar #cafe_calendar .tbl_calendar tr > td a { color:#5FA5C9; }
#top_calendar #cafe_calendar .tbl_calendar tr > td a .mark { text-decoration:underline; }
#top_calendar #cafe_calendar .tbl_calendar tr > td a:hover .mark { text-decoration:none; }
#top_calendar #cafe_calendar .tbl_calendar tr > td a .time { color:#555; }
#top_calendar #cafe_calendar .menu_form { padding-bottom:30px; }

#top_calendar #cafe_calendar .tbl_calendar._cafe .date { margin-bottom:0; }
#top_calendar #cafe_calendar .tbl_calendar._cafe th td { vertical-align:middle; }
@media (min-width:768px) {
	#top_calendar #cafe_calendar .tbl_calendar_wrap._cafe { overflow:inherit!important; }
	#top_calendar #cafe_calendar .tbl_calendar_wrap._cafe .scroll-hint-icon-wrap { display:none!important; }
}
@media (max-width:767px) {
	#top_calendar #cafe_calendar .tbl_calendar_wrap._cafe { white-space:nowrap; overflow-x:auto; max-width:calc(100% + 10px); margin-left:-5px; margin-right:-5px; }
	#top_calendar #cafe_calendar .tbl_calendar._cafe { position:relative; width:100%; margin-left:0; margin-right:0; }
}
@media (max-width:375px) {
	#top_calendar #cafe_calendar .tbl_calendar tr > td .date{font-size: 1em;}
}