@import url(https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+New:wght@400;500&display=block);

:root {
	--ff-sans: "Zen Kaku Gothic New", -apple-system, BlinkMacSystemFont, ヒラギノ角ゴ ProN, Hiragino Kaku Gothic ProN, YuGothic, "Yu Gothic Medium", "Yu Gothic", sans-serif;
}

.campaign * {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	line-height: 1;
	font-family: var(--ff-sans);
}

.campaign img {
	width: 100%;
	max-width: unset;
	display: block;
	height: auto;
	-ms-interpolation-mode: bicubic;
	shape-margin: 1em;
	font-style: italic;
	object-fit: cover;
	background-repeat: no-repeat;
	vertical-align: middle;
}

.campaign {
	max-width: 1000px;
	margin-inline: auto;
	container-type: inline-size;
}

.campaign__hero {
	cursor: pointer;
}

.campaign__hero-image {}

@keyframes slideInUp {
	from {
		opacity: 0;
		transform: translateY(-10px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes slideOutDown {
	from {
		opacity: 1;
		transform: translateY(0);
	}

	to {
		opacity: 0;
		transform: translateY(-10px);
	}
}

.campaign__content {
	display: none;
	padding: 3cqw;
	background-color: #fff580;
}

:has(.campaign__hero.active) .campaign__content {
	display: block;
	animation: slideInUp 0.3s ease forwards;
}

.campaign__inner {
	background-color: #fff;
	border-radius: 3cqw;
	padding: 4cqw;
}

.campaign__title {
	color: #009fe8;
	font-weight: bold;
	text-align: center;
	line-height: 1.4;
	font-size: 3cqw;
}

.campaign__line-link {
	text-decoration: n;
	background-color: #05c855;
	color: #FFF;
	font-weight: bold;
	display: flex;
	text-decoration: unset !important;
	align-items: center;
	padding: 0.8em 2em;
	font-size: 2cqw;
	gap: 2cqw;
	justify-content: center;
	border-radius: 2cqw;
	width: fit-content;
	margin-top: 4cqw;
	margin-inline: auto;
}

.campaign__line-icon {
	width: 4cqw;
	flex-shrink: 0;
}

.campaign__line-image {}

.campaign__line-text {
	color: #FFF;
	font-weight: bold;
	line-height: 1.4;
	display: block;
	white-space: nowrap;
}

.campaign__flow-title {
	background-color: #009fe8;
	color: #FFF;
	border-radius: 1cqw 1cqw 0 0;
	padding: 1cqw 2cqw;
	width: fit-content;
	font-weight: 900;
	margin-top: 3em;
	border-bottom: 1px solid #009fe8;
	font-size: 2cqw;
}

.campaign__flow-text {
	font-size: 4cqw;
	line-height: 1.4;
	font-size: 1.8cqw;
	margin-top: 0;
padding:1em;
border: 1px solid #009fe8;
border-radius: 0;}

.campaign__flow-text strong {
	color: #e50012;
}

.campaign__notice {
	font-size: 1.6cqw;
	line-height: 1.4;
	margin-top: 2em;
}

.campaign__notice-title {
	font-weight: bold;
	display: block;
	margin-bottom: 1em;
}

.campaign__body {
	width: fit-content;
	margin-inline: auto;
}

.campaign-x3f__phone {
	border: 3px solid #ec5510;
	padding: 1.6cqw 2cqw;
	width: fit-content;
	margin-inline: auto;
	border-radius: 1cqw;
	display: block;
	margin-top: 2em;
text-decoration: none !important
}

.campaign-x3f__phone-header {
	font-weight: bold;
	font-size: 1.8cqw;
	color: #009fe8;
	text-align: center;
}

.campaign-x3f__phone-content {
	display: grid;
	gap: 2cqw;
	grid-template-columns: auto auto;
	line-height: 1;
	margin-top: 1cqw;
	align-items: center;
}

.campaign-x3f__phone-number-wrapper {
	display: flex;
	gap: 0.5cqw;
	align-items: baseline;
	/* margin-top: 1cqw; */
	line-height: 1;
}

.campaign-x3f__phone-icon {
	width: 6cqw;
	flex-shrink: 0;
	line-height: 1;
	display: block;
	/* padding-top: 0.2cqw; */
}

.campaign-x3f__phone-image {
	width: 100%;
	max-width: unset;
	display: block;
	height: auto;
	transform: translateY(6%);
}

.campaign-x3f__phone-text {
	font-weight: bold;
	font-size: 4.5cqw;
	color: #009fe8;
	line-height: 1;
}

.campaign-x3f__phone-info {
	line-height: 1.2;
	font-size: 1.4cqw;
	color: #009fe8;
	display: block;
	white-space: nowrap;
	padding-top: 0.6cqw;
	font-weight: bold;
}