/* BEGIN AREA-LISTING CSS ---------------------------------------> */


.titleBlock
{
	display: flex;
	align-items: center;
	text-align: center;
	height: 50vw;
	max-height: 331px;
	padding: 30px 40px;
	box-sizing: border-box;
	background: #ffffff;
}

.titleBlock h2
{
	margin: 0;
	width: 100%;
	--max-font-size: 28;
}

#industryList .titleBlock
{
	background: #0069B1;
	color: #ffffff;
}

#industryList .titleBlock h2
{
	color: inherit;
}

div.listColumnWrapper
{
	position: relative;
	padding: 30px 20px;
	background: rgba(255,255,255,.87);
}

#industryList div.listColumnWrapper
{
	padding: 0;
	background: none;
}

div.listColumn
{
	position: relative;
}

div.listColumn ul,
div.listColumn ul li
{
	position: relative;
	list-style: none;
	list-style-image: none;
	margin: 0;
	padding: 0;
	--min-font-size: 18;
	color: #393939;
}

div.listColumn ul li
{
	padding-left: 39px;
	margin-bottom: 20px;
}

div.listColumn ul li a:not(:hover):not(:focus)
{
	color: inherit;
}

div.listColumn ul.hierList li
{
	font-weight: normal;
	margin: 0.7em 0;
	line-height: normal;
}

div.listColumn li li
{
	padding-left: 1em;
}

div.listColumn.areaToggle ul.hierList
{
	display: none;
}

div.listColumn.areaToggle .areaExpand
{
	position: absolute;
	left: 0;
	top: 4px;
	width: 20px;
	height: 20px;
	padding: 0 0 0 5px;
	border: 0px;
	cursor: pointer;
	background: none;
	box-sizing: border-box;
	transform: rotate(90deg);
}

div.listColumn.areaToggle .areaExpand svg
{
	display: block;
	width: auto;
	height: 9px;
	fill: #2B65A7;
}

div.listColumn.areaToggle .areaExpand.expanded span:first-child
{
	display: none;
}

#industryList .results_list,
#industryList .results_list li
{
	margin: 0;
	list-style: none;
}

#industryList li
{
	position: relative;
	overflow: hidden;
	transition: transform 250ms ease;
}

#industryList li a
{

	position: relative;
	display: flex;
	align-items: center;
	text-align: center;
	justify-content: center;
	aspect-ratio: 83 / 42;
	padding: 30px;
	height: 101%;
	width: 101%;
	color: #ffffff;
	transition: transform 250ms ease;
	box-sizing: border-box;
}

#industryList li a:hover,
#industryList li a:focus,
#industryList li:hover
{
	transform: scale(1.09);
	z-index: 100;
}

#industryList .image
{
	position: absolute;
	top: 0;
	left: 0;
	width: 101%;
	height: 101%;
	background: #333333;
}

#industryList .image img
{
	display: block;
	width: 101%;
	height: 101%;
	object-fit: cover;
	opacity: .4;
}

#industryList .title
{
	position: relative;
	z-index: 10;
	--min-font-size: 18;
	--max-font-size: 21;
	line-height: 1.25;
}


@media (min-width: 768px)
{
	div.listColumnWrapper
	{
		padding: 50px 40px;
	}

	#industryList .results_list
	{
		display: grid;
		grid-template-columns: 1fr 1fr;
	}

	#industryList li a
	{
		padding: 30px 50px;
	}
}

@media (min-width: 1024px)
{
	#industryList .results_list
	{
		grid-template-columns: 1fr 1fr 1fr;
	}
}

@media (min-width: 1350px)
{

	.serviceList
	{
		display: flex;
	}

	.titleBlock
	{
		flex: 0 0 376px;
		max-height: 100%;
		height: auto;
	}

	.listColumnWrapper
	{
		flex: 1 5 1320px;

	}

	#practiceList .listColumnWrapper
	{
		padding-top: 70px;
		display: grid;
		grid-template-columns: 1fr 1fr 1fr;

		grid-gap: max(30px,
		             min(70px, 30px + (70 - 30) * ((100vw - 1280px) / (1920 - 1280))
		));
	}


}

@media (min-width: 1600px)
{
	#industryList .results_list
	{
		grid-template-columns: repeat(4, 1fr);
	}
}

/* END AREA-LISTING CSS -----------------------------------------> */