@charset "utf-8";

/* slideshow */
.ImgTxtSwiper {
	--swiper-pagination-bottom: 40px;
}
.ImgTxtSwiper .swiper-slide {
	aspect-ratio: 1100 / 870;
}

/* text */
.ImgTxtBlock .TxtFrame {
	padding: 50px var(--spacing-sm);
}
/* text: eyebrow */
.ImgTxtBlock .TxtFrame .TxSz16 {
	margin-bottom: 20px;
}
/* text: header */
.ImgTxtBlock .TxtFrame h2 {
	margin-bottom: 30px;
}
/* text: accordion */
.ImgTxtBlock .TxtFrame .AccordionList {
	margin-bottom: var(--spacing-sm);
}
.ImgTxtBlock button.AccordionControl {
	position: relative;
	width: 100%;
	text-align: left;
	padding: 15px 30px 15px 0;
	border-bottom: 1px solid var(--color-dark-blue);
}
.ImgTxtBlock button.AccordionControl svg {
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 15px;
	height: 15px;
	transition: all 0.3s;
	fill: var(--color-dark-blue);
}
.ImgTxtBlock button.AccordionControl[aria-expanded="true"] svg {
	transform: translateY(-50%) rotate(-180deg);
}
.ImgTxtBlock .AccordionContent {
	display: none;
	padding: 15px 0;
	border-bottom: 1px solid var(--color-dark-blue);
}
/* text: buttons */
.ImgTxtBlock .ButtonsList {
	justify-content: flex-start;
}
.ImgTxtBlock .TxtFrame .ButtonsList {
	margin-left: -10px;
	margin-right: -10px;
}

@media only screen and (max-width: 1199px) {
	.ImgTxtBlock {
		width: 100%;
	}
	.ImgTxtBlock .ImgTxtSwiper {
		margin-bottom: var(--spacing-sm);
	}
}

@media only screen and (min-width: 1200px) {
	.ImgTxtBlock {
		display: flex;
		min-height: 870px;
	}
	.ImgTxtSwiper {
		--swiper-pagination-bottom: 50px;
	}
	.ImgTxtBlock.ImgLeft .ImgTxtSwiper,
	.ImgTxtBlock.TxtLeft .TxtFrame {
		order: 1;
	}
	.ImgTxtBlock.TxtLeft .ImgTxtSwiper,
	.ImgTxtBlock.ImgLeft .TxtFrame {
		order: 2;
	}
	.ImgTxtBlock .ImgTxtSwiper {
		flex-basis: calc((1100 / 1840) * 100%);
	}
	.ImgTxtBlock .TxtFrame {
		flex-basis: calc((700 / 1840) * 100%);
		display: flex;
		flex-wrap: wrap;
		align-content: center;
		padding: var(--spacing-md) var(--spacing-sm);
	}
	.ImgTxtBlock .TxtFrame > * {
		flex-basis: 100%;
	}
	.ImgTxtBlock.ImgLeft .ImgTxtSwiper,
	.ImgTxtBlock.TxtLeft .TxtFrame {
		margin-right: var(--spacing-sm);
	}
}

@media only screen and (min-width: 1400px) {
	.ImgTxtBlock .TxtFrame {
		padding: 170px var(--spacing-md);
	}
}
