.foursite-quote-block {
	padding: 7% 10%;
	display: flex;
	align-items: flex-start;
	gap: 5%;
	width: 80%;
	max-width: 1350px;
	font-family: "p22-mackinac-pro";
	position: relative;
}







.foursite-quote-block__image {
	position: relative;
	width: 35%;
}
.foursite-quote-block__image__quote-image {
	position: relative;
}
.foursite-quote-block__image__flare-1 {
	position: absolute;
	top: 0;
	left: -60px;
	z-index: 1;
}
.foursite-quote-block__image__flare-2 {
	position: absolute;
	top: -20px;
	right: -20px;
	z-index: 1;
}
.foursite-quote-block__image__bg-quote-image {
	position: absolute;
	bottom: -20px;
	right: -20px;
}

.foursite-quote-block__content {
	width: 60%;
	color: #5B5A5B;
	display: flex;
	flex-direction: column;
}


.foursite-quote-block__content__quote-name,
.foursite-quote-block__content__quote-title,
.foursite-quote-block__content__quote-org {
	font-size: clamp(0.75rem, 0.625rem + 0.625vw, 1.125rem);
	font-style: normal;
	font-weight: 300;
	line-height: 140%;
	font-family: var(--wp--preset--font-family--hk-grotesk);
}
.foursite-quote-block__content__quote-name {
	font-weight: 800;
}
.foursite-quote-block__content__quote {
	margin-bottom: 20px;
}
.foursite-quote-block__content__quote,
.foursite-quote-block__content__quote p {
	font-size: clamp(0.875rem, 0.6667rem + 1.0417vw, 1.5rem);
	position: relative;
	font-style: normal;
	font-weight: 500;
	line-height: 160%;
}
.foursite-quote-block__content__quote::before {
	content: url('/wp-content/themes/foursite/images/foursite_quote_block/foursite-quote-block-left-quote.svg');
	position: absolute;
	top: -20px;
	left: -20px;
}
.foursite-quote-block__content__quote__right-quote {
	display: inline; 
	padding-bottom: 20px;
}
/*
.foursite-quote-block__content__quote::after {
	content: url('/wp-content/themes/foursite/images/foursite_quote_block/foursite-quote-block-right-quote.svg');
	position: absolute;
	bottom: -20px;
	right: -20px;
}
*/
@media (max-width: 600px) {
	.foursite-quote-block {
		padding: 10px 35px;
	}
	.foursite-quote-block__content,
	.foursite-quote-block__content p {
		text-align: center;
	}
	.foursite-quote-block__content__quote-name, 
	.foursite-quote-block__content__quote-title, 
	.foursite-quote-block__content__quote-org {
		text-align: center;
	}
	.foursite-quote-block__image {
		display: none;
	}
	.foursite-quote-block__content {
		width: 100%;
		align-items: center;
		padding: 15px 35px;
	}
	.foursite-quote-block__content__quote::before {
		left: calc(50% - 8px);
    top: -10px;
	}
	.foursite-quote-block__content__quote__right-quote {
		position: absolute;
    bottom: -13px;
    left: calc(50% - 8px);
    padding-bottom: 0;
	}
}











/* Border */
.foursite-quote-block__left-border,
.foursite-quote-block__right-border,
.foursite-quote-block__top-border__left,
.foursite-quote-block__top-border__center,
.foursite-quote-block__top-border__right,
.foursite-quote-block__bottom-border__left,
.foursite-quote-block__bottom-border__center,
.foursite-quote-block__bottom-border__right {
	position: absolute;
	background-repeat: no-repeat;
}

.foursite-quote-block__left-border {
	top: 101px;
	bottom: 106px;
	left: 0;
	background-position: left;
}
.foursite-quote-block__right-border {
	top: 105px;
	bottom: 106px;
	right: 0;
	background-position: right;
}
.foursite-quote-block__top-border__left {
	top: 0;
	left: 0;
}
.foursite-quote-block__top-border__center {
	left: 58px;
	right: 58px;
	top: 0;
	background-position: top;
}
.foursite-quote-block__top-border__right {
	top: 0;
	right: 0;
}

.foursite-quote-block__bottom-border__left {
	bottom: 0;
	left: 0;
}
.foursite-quote-block__bottom-border__center {
	left: 67px;
	right: 67px;
	bottom: 9px;
	background-position: bottom;
}
.foursite-quote-block__bottom-border__right {
	bottom: 0;
	right: 0;
}

.foursite-quote-block__right-border,
.foursite-quote-block__left-border {
	height: calc(100% - 200px);
	width: 106px;
	background-size: 10px 100%;
}
.foursite-quote-block__top-border__left,
.foursite-quote-block__top-border__right,
.foursite-quote-block__bottom-border__right {
	width: 67px;
	height: 106px;
}
.foursite-quote-block__bottom-border__left {
	width: 72px;
	height: 106px;
}
.foursite-quote-block__top-border__center {
	width: calc(100% - 122px);
	height: 106px;
}
.foursite-quote-block__bottom-border__center {
	width: calc(100% - 126px);
	height: 106px;
}