@charset "utf-8";

/* GRAPHIC BUBBLE */
	.graphic-text {
		--square-offset: 4.8rem;
		position: relative;
		}
	.graphic-text-square.graphic-text-h-left .graphic-text-image {
		margin-left: var(--square-offset);
		}
	.graphic-text-square.graphic-text-h-right .graphic-text-image {
		margin-right: var(--square-offset);
		}
	.graphic-text-image {
		overflow: hidden;
		position: relative;
		}
	.graphic-text-square .graphic-text-image {
		border-radius: var(--mywp-radius);
		}
	.graphic-text-src {
		height: auto;
		width: 100%;
		}
	.graphic-text-info {
		overflow: hidden;
		position: absolute;
		text-wrap: balance;
		}
	.graphic-text-square .graphic-text-info {
		border-radius: var(--mywp-radius);
		width: 50%;
		}
	.graphic-text-circle .graphic-text-info {
		align-items: center;
		aspect-ratio: 1 / 1;
		border-radius: 100%;
		display: flex;
		justify-content: center;
		text-align: center;
		width: 50%;
		}
	.graphic-text-holder {
		padding: 1rem;
		}
	.graphic-text-v-top.graphic-text-square .graphic-text-info {
		top: var(--square-offset);
		}
	.graphic-text-v-top.graphic-text-circle .graphic-text-info {
		top: 0;
		}
	.graphic-text-v-center .graphic-text-info {
		top: calc(50% - 8rem);
		}
	.graphic-text-v-bottom.graphic-text-square .graphic-text-info {
		bottom: var(--square-offset);
		}
	.graphic-text-v-bottom.graphic-text-circle .graphic-text-info {
		bottom: 0;
		}
	.graphic-text-h-left .graphic-text-info {
		left: 0;
		}
	.graphic-text-h-center .graphic-text-info {
		left: 25%;
		}
	.graphic-text-h-right .graphic-text-info {
		right: 0;
		}
	.graphic-text-icon {
		display: block;
		font-size: var(--mywp-ts-text-sub-4);
		}
	.graphic-text-stat {
		font-size: var(--mywp-ts-head-2);
		font-weight: var(--mywp-heavy);
		margin-bottom: 0.2rem;
		}
	.graphic-text-header {
		font-size: var(--mywp-ts-text-sub-2);
		font-weight: 700;
		line-height: 1.1em;
		}
	.graphic-text-text {
		font-size: var(--mywp-ts-text-sub-3);
		line-height: 1.1em;
		}
	@media (min-width: 30em) {
		.graphic-text-icon {
			font-size: var(--mywp-ts-text-sub-2);
			}
		.graphic-text-stat {
			font-size: var(--mywp-ts-head-2);
			}
		.graphic-text-header {
			font-size: var(--mywp-ts-text);
			}
		.graphic-text-text {
			font-size: var(--mywp-ts-text-sub-2);
			}
	}
	@media (min-width: 40em) {
		.graphic-text-circle .graphic-text-info {
			width: 40%;
			}
		.graphic-text-holder {
			padding: 2rem;
			}
	}
	@media (min-width: 60em) {
		.graphic-text-circle .graphic-text-info {
			width: 50%;
			}
		.graphic-text-icon {
			font-size: var(--mywp-ts-text-sub-4);
			}
		.graphic-text-stat {
			font-size: var(--mywp-ts-head-2);
			}
		.graphic-text-header {
			font-size: var(--mywp-ts-text-sub-2);
			}
		.graphic-text-text {
			font-size: var(--mywp-ts-text-sub-3);
			}
	}
	@media (min-width: 80em) {
		.graphic-text-circle .graphic-text-info {
			width: 40%;
			}
		.graphic-text-icon {
			font-size: var(--mywp-ts-text-sub-2);
			}
		.graphic-text-stat {
			font-size: var(--mywp-ts-head-1);
			}
		.graphic-text-header {
			font-size: var(--mywp-ts-text);
			}
		.graphic-text-text {
			font-size: var(--mywp-ts-text-sub-2);
			}
	}
	@media (min-width: 100em) {
		.graphic-text-square.graphic-text-h-left .graphic-text-image {
			margin-left: 0;
			}
		.graphic-text-square.graphic-text-h-left .graphic-text-info {
			left: calc(var(--square-offset) * -1);
			}
		.graphic-text-square.graphic-text-h-right .graphic-text-image {
			margin-right: 0;
			}
		.graphic-text-square.graphic-text-h-right .graphic-text-info {
			right: calc(var(--square-offset) * -1);
			}
		.graphic-text-circle .graphic-text-holder {
			padding: 3rem;
			}
		.graphic-text-stat {
			font-size: var(--mywp-ts-head-0);
			margin-bottom: 0.5rem;
			}
	}