@charset "UTF-8";

/* --------------------------------------------
ENTRIES
--------------------------------------------- */
#entries .splide{
	.back{
		display : grid;
		grid-template-columns : auto auto;
		column-gap : calc( 20 * var( --remBase ) );
		align-items : center;
		justify-content : start;
		font-size : calc( 20 * var( --remBase ) );
		color : #7d7d7d;
		&::before{
			display : block;
			width : auto;
			height : calc( 19 * var( --remBase ) );
			aspect-ratio : 11/20;
			font-size : 0;
			content : "";
			background : url( "../../images/parts/entries/back.svg" ) center / contain no-repeat;
		}
	}
	button[type="submit"]{
		position : relative;
		grid-row : 1;
		grid-column : 2;
		height : calc( 46 * var( --remBase ) );
		padding-top : calc( 4 * var( --remBase ) );
		padding-left : calc( 18 * 100% / 226 );
		font-size : calc( 18 * var( --remBase ) );
		text-align : left;
		border-radius : 100vmax;
		&[disabled]{
			cursor : not-allowed;
		}
		span{
			display : block;
			font-weight : 700;
		}
		span:nth-of-type( 1 ){
			font-size : calc( 10 * var( --remBase ) );
			line-height : 1.6;
		}
		span:nth-of-type( 2 ){
			margin-top : calc( -4 * var( --remBase ) );
			font-size : calc( 16 * var( --remBase ) );
			line-height : 1.6;
			letter-spacing : calc( -.8 * var( --remBase ) );
		}
		&::after{
			position : absolute;
			top : 50%;
			right : calc( 13* 100% / 226 );
			display : block;
			width : auto;
			height : calc( 13 * var( --remBase ) );
			aspect-ratio : 8/13;
			font-size : 0;
			content : "";
			background : url( "../../images/parts/entries/next.svg" ) 0 0 / contain no-repeat;
			translate : 0 -50%;
		}
		&[disabled]{
			color : var( --base );
			background-color : #f1f1f1;
			&::after{
				filter : var( --filterBase );
			}
		}
		&:not( [disabled] ){
			color : white;
			background-color : var( --blue );
			&::after{
				filter : var( --filterWhite );
			}
		}
	}
}
.fieldset02{
	label.contact_salary{
		padding-left : 0;
	}
	label.contact_tel::before{
		left : 0;
		height : calc( 19 * var( --remBase ) );
		aspect-ratio : 17/19;
		background-image : url( "../../images/parts/entries/tel.svg" );
	}
	label.contact_email::before{
		left : 0;
		height : calc( 16 * var( --remBase ) );
		aspect-ratio : 20/16;
		background-image : url( "../../images/parts/entries/email.svg" );
	}
}
.fieldset03{
	label.contact_dates::before{
		left : 0;
		height : calc( 16.576 * var( --remBase ) );
		aspect-ratio : 22/20;
		background-image : url( "../../images/parts/entries/dates.svg" );
	}
	label.contact_times::before{
		left : 0;
		height : calc( 22 * var( --remBase ) );
		aspect-ratio : 1;
		background-image : url( "../../images/parts/entries/times.svg" );
	}
}

/* --------------------------------------------
CALENDAR
--------------------------------------------- */
.calendar{
	--calendarCellHeight : calc( 38 * var( --remBase ) );
	--calendarColorPrimary : #ff6b6b;
	--calendarColorSecondary : #16aace;
	margin-top : calc( 10 * var( --remBase ) );
	font-size : 0;
	line-height : 1;
	.fc-header-toolbar{
		height : calc( 38 * var( --remBase ) );
		margin-bottom : calc( 10 * var( --remBase ) );
		background-color : var( --base );
	}
	.fc-toolbar-title{
		font-size : calc( 20 * var( --remBase ) );
		font-weight : 700;
		line-height : 1.4;
		color : white;
	}
	.fc-header-toolbar{
		> div:first-of-type , > div:last-of-type{
			height : 100%;
		}
	}
	.fc-button{
		display : grid;
		place-items : center;
		width : 100%;
		height : 100%;
		padding : 0;
		font-size : 0;
		line-height : 1;
		background-color : transparent;
		border : 0;
		outline : 0;
		opacity : 1;
		span{
			height : calc( 15 * var( --remBase ) );
			background-repeat : no-repeat;
			background-position : center;
			background-size : contain;
			&::before{
				content : none;
			}
		}
	}
	.fc-icon-chevron-left{
		background-image : url( "../../images/parts/entries/prev02_white.svg" );
	}
	.fc-icon-chevron-right{
		background-image : url( "../../images/parts/entries/next02_white.svg" );
	}
	.fc-scrollgrid{
		padding-bottom : calc( 6 * var( --remBase ) );
		background-color : white;
		border : 0;
	}
	td , th{
		border : 0;
	}
	:is( .fc-col-header , .fc-scrollgrid-sync-table ){
		display : block;
		height : auto ! important;
		tr{
			display : grid;
			grid-template-columns : repeat( 7 , 1fr );
			align-items : start;
		}
	}
	table.fc-col-header{
		thead{
			display : block;
		}
		tr{
			column-gap : calc( ( 34 / 6 ) * 100% / 315 );
		}
	}
	.fc-scrollgrid-sync-table{
		tbody{
			display : block;
		}
		tr{
			margin-top : calc( 10 * var( --remBase ) );
		}
	}
	.fc-col-header-cell{
		height : var( --calendarCellHeight );
	}
	.fc-daygrid-day{
		height : var( --calendarCellHeight );
	}
	.fc-scrollgrid-sync-inner{
		display : grid;
		grid-template-rows : 1fr;
		grid-template-columns : 1fr;
		align-items : stretch;
		height : 100%;
		a{
			display : block;
			align-content : center;
			width : 100%;
			height : 100%;
			padding : 0;
			font-size : calc( 20 * var( --remBase ) );
			font-weight : 700;
			text-align : center;
		}
	}
	.fc-daygrid-day-top{
		display : block;
		grid-row : 1;
		grid-column : 1;
		width : 100%;
		height : 100%;
	}
	.fc-daygrid-day-events:has( .clickable ){
		z-index : 5;
		grid-row : 1;
		grid-column : 1;
		.fc-daygrid-event-harness{
			width : 100%;
			height : 100%;
		}
	}
	.fc-day-disabled{
		background-color : transparent;
		.fc-scrollgrid-sync-inner{
			background-color : #f1f1f1;
			opacity : .3;
		}
	}
	.fc-daygrid-day:not(.fc-day-disabled, :has( .clickable )){
		background-color : transparent;
		.fc-scrollgrid-sync-inner{
			background-color : #f1f1f1;
			opacity : .3;
		}
	}
	.fc-day a{
		color : var( --base );
	}
	.fc-day-sat a{
		color : var( --calendarColorSecondary );
	}
	.fc-day-sun a{
		color : var( --calendarColorPrimary );
	}
	.fc-scrollgrid-sync-inner:has( .holiday ):has( .clickable ){
		.fc-daygrid-day-number{
			color : transparent;
		}
		.fc-event-title{
			color : var( --calendarColorPrimary );
		}
		.fc-bg-event{
			background-color : transparent;
		}
	}
	.fc-scrollgrid-sync-inner:has( .holiday ):not( :has( .clickable ) ){
		.fc-daygrid-day-number{
			color : var( --calendarColorPrimary );
		}
		.fc-event-title{
			color : transparent;
		}
		.fc-bg-event{
			background-color : #f1f1f1;
		}
	}
	.clickable{
		width : 100%;
		height : 100%;
		margin : 0 ! important;
		background-color : transparent;
		border : 0;
		border-radius : 50%;
		.fc-event-title{
			color : var( --base );
		}
		&:hover , &.is-selected{
			color : white;
			background-color : var( --calendarColorSecondary );
			.fc-event-title{
				color : white ! important;
			}
		}
	}
	.fc-event-selected , .fc-event:focus{
		box-shadow : none;
		&::after , &::before{
			content : none;
		}
	}
	.fc-day-sat .fc-event.clickable .fc-event-title{
		color : var( --calendarColorSecondary );
	}
	.fc-day-sun .fc-event.clickable .fc-event-title{
		color : var( --calendarColorPrimary );
	}
	:where( .fc-day-sat , .fc-day-sun ) .fc-event.clickable{
		&:hover , &.is-selected{
			.fc-event-title{
				color : white;
			}
		}
	}
	.is-holiday{
		.fc-event.clickable{
			.fc-event-title{
				color : var( --calendarColorPrimary );
			}
			&:hover , &.is-selected{
				.fc-event-title{
					color : white;
				}
			}
		}
	}
	@media screen and ( width <= 750px ){
		.fc-header-toolbar{
			> div:first-of-type , > div:last-of-type{
				width : calc( 29.231 * 100% / 315 );
			}
		}
		.fc-button{
			span{
				width : calc( 9.231 * 100% / 35 );
			}
		}
		.fc-scrollgrid-sync-table{
			tr{
				column-gap : calc( ( 34 / 6 ) * 100% / 315 );
			}
		}
	}
	@media print , screen and ( width > 750px ){
		.fc-header-toolbar{
			> div:first-of-type , > div:last-of-type{
				width : calc( 35 * 100% / 315 );
			}
		}
		.fc-button{
			span{
				width : calc( 10 * 100% / 35 );
			}
		}
		.fc-scrollgrid-sync-table{
			tr{
				column-gap : calc( ( 315 - 280 ) / 6 * 100% / 315 );
			}
		}
	}
}
@media ( prefers-reduced-motion : no-preference ){
	.clickable{
		transition : background .3s linear , color .3s linear;
	}
}

/* --------------------------------------------
TIME
--------------------------------------------- */
.times{
	display : grid;
	grid-template-columns : repeat( 3 , calc( 88 * 100% / 315 ) );
	row-gap : calc( 15 * var( --remBase ) );
	column-gap : calc( 25 * 100% / 315 );
	margin-top : calc( 10 * var( --remBase ) );
	label{
		position : relative;
		display : block;
		height : calc( 38 * var( --remBase ) );
		input{
			position : absolute;
			opacity : 0;
		}
		span{
			display : grid;
			place-items : center;
			width : 100%;
			height : 100%;
			font-size : calc( 20 * var( --remBase ) );
			font-weight : 700;
			color : #00b5cc;
			background-color : white;
			border-radius : calc( 3 * var( --remBase ) );
			outline : solid #d1d1d1 1px;
			outline-offset : -1px;
			transition : background .3s linear , color .3s linear , border .3s linear;
		}
		input:checked + span{
			color : white;
			background-color : #16aace;
			border-color : #16aace;
		}
	}
}