@charset "UTF-8";

/* --------------------------------------------
FOOTER
--------------------------------------------- */
#footerMe{
	padding-block : calc( 45 * var( --remBase ) );
	> a{
		display : block;
		width : fit-content;
		img{
			height : calc( 82 * var( --remBase ) );
		}
	}
	h3{
		font-size : calc( 16 * var( --remBase ) );
		font-weight : 700;
		line-height : calc( 24 / 16 );
	}
	> div{
		p , dt , dd{
			font-size : calc( 14 * var( --remBase ) );
			line-height : calc( 25.2 / 14 );
		}
		p{
			margin-top : calc( 13 * var( --remBase ) );
		}
	}
	dl{
		display : grid;
		grid-template-columns : auto 1fr;
		row-gap : 0;
		column-gap : calc( 14 * var( --remBase ) );
		> div{
			font-size : 0;
			line-height : 0;
			&:nth-of-type( 3 ){
				grid-row : 2;
				grid-column : 1/-1;
				dd{
					padding-left : 1em;
				}
			}
		}
		dt , dd{
			display : inline;
		}
	}
	> ul{
		li{
			font-size : calc( 14 * var( --remBase ) );
			line-height : calc( 25.2 / 14 );
		}
	}
	@media screen and ( width <= 768px ){
		> div{
			margin-top : calc( 25 * var( --remBase ) );
		}
		> ul{
			margin-top : calc( 25 * var( --remBase ) );
		}
	}
	@media print , screen and ( width > 768px ){
		display : grid;
		grid-auto-flow : column;
		column-gap : calc( 45 * var( --contentBase ) );
		align-items : start;
		justify-content : start;
		> a{
			grid-row : 1;
			grid-column : 1;
		}
		> div{
			grid-row : 1;
			grid-column : 2;
		}
		> ul{
			grid-row : 1;
			grid-column : 3;
			align-self : end;
		}
	}
}
#footerLinks{
	padding-block : calc( 45 * var( --remBase ) );
	background-color : var( --lightBlue );
	> li{
		> a{
			font-size : calc( 16 * var( --remBase ) );
			font-weight : 700;
			line-height : calc( 24 / 16 );
		}
		> ul{
			margin-top : calc( 18 * var( --remBase ) );
		}
	}
	li li a{
		display : grid;
		grid-auto-flow : column;
		justify-content : start;
		font-size : calc( 14 * var( --remBase ) );
		line-height : calc( 20 / 14 );
		&::before{
			width : auto;
			height : calc( 4 * var( --remBase ) );
			aspect-ratio : 1;
			margin-inline : calc( 8 * var( --remBase ) );
			margin-top : calc( 8 * var( --remBase ) );
			font-size : 0;
			content : "";
			background-color : currentColor;
			border-radius : 50%;
		}
	}
	@media screen and ( width <= 768px ){
		padding-inline : calc( 50 * var( --contentBase ) );
		> li + li{
			margin-top : calc( 18 * var( --remBase ) );
		}
		> li:nth-child( 1 ){
			ul ul{
				margin-top : calc( 18 * var( --remBase ) );
				li + li{
					margin-top : calc( 18 * var( --remBase ) );
				}
			}
		}
	}
	@media print , screen and ( width > 768px ){
		display : grid;
		grid-template-rows : repeat( 7 , auto ) 1fr;
		grid-template-columns : auto 1fr auto auto calc( 45 * var( --contentBase ) );
		row-gap : calc( 18 * var( --remBase ) );
		column-gap : calc( 45 * var( --contentBase ) );
		> li:nth-child( 1 ){
			grid-row : 1/-1;
			grid-column : 1;
			> ul{
				display : grid;
				grid-template-columns : repeat( 3 , auto );
				column-gap : calc( 45 * var( --remBase ) );
			}
			li + li{
				margin-top : calc( 18 * var( --remBase ) );
			}
		}
		> li:nth-child( n+2 ):nth-child( -n+6 ){
			grid-column : 3;
		}
		> li:nth-child( 2 ){
			grid-row : 1;
		}
		> li:nth-child( 3 ){
			grid-row : 2;
		}
		> li:nth-child( 4 ){
			grid-row : 3;
		}
		> li:nth-child( 5 ){
			grid-row : 4;
		}
		> li:nth-child( 6 ){
			grid-row : 5;
		}
		> li:nth-child( n+7 ){
			grid-column : 4;
		}
		> li:nth-child( 7 ){
			grid-row : 1/3;
		}
		> li:nth-child( 8 ){
			grid-row : 3;
		}
		> li:nth-child( 9 ){
			grid-row : 4;
		}
		> li:nth-child( 10 ){
			grid-row : 5;
		}
		> li:nth-child( 11 ){
			grid-row : 6;
		}
		> li:nth-child( 12 ){
			grid-row : 7;
		}
		> li:nth-child( 13 ){
			grid-row : 8;
		}
	}
}
#footerCopyright{
	padding-block : calc( 28 * var( --remBase ) );
	font-size : calc( 12 * var( --remBase ) );
	line-height : calc( 22 / 12 );
	@media print , screen and ( width > 768px ){
		text-align : center;
	}
}
body:has( #footerFixed ){
	@media screen and ( width <= 768px ){
		padding-bottom : calc( 82 * var( --remBase ) );
	}
	@media print , screen and ( width > 768px ){
		padding-bottom : calc( 64 * var( --remBase ) );
	}
}
#footerFixed{
	position : fixed;
	bottom : 0;
	left : 0;
	z-index : 5;
	display : grid;
	grid-auto-flow : column;
	align-items : center;
	width : 100%;
	background-color : color-mix( in sRGB , white 70% , transparent );
	@media screen and ( width <= 768px ){
		justify-content : space-between;
		height : calc( 82 * var( --remBase ) );
		a:not( .is-pc ){
			display : block;
		}
		img{
			height : calc( 64 * var( --remBase ) );
		}
	}
	@media print , screen and ( width > 768px ){
		justify-content : center;
		height : calc( 64 * var( --remBase ) );
		p{
			margin-right : calc( 32 * var( --remBase ) );
			img{
				height : calc( 34 * var( --remBase ) );
			}
		}
		.tel , .mail{
			img{
				height : calc( 44 * var( --remBase ) );
			}
		}
	}
}
