@charset 'Shift_JIS';

.c-float-cv {
	position: fixed;
	inset: auto 0 0;
	height: 100px;
	background-color: rgba(245, 247, 251, 0.7);
	z-index: 10;
	opacity: 0;
	pointer-events: none;
	transition: opacity .3s;
}
.c-float-cv.is-active {
	opacity: 1;
	pointer-events: auto;
}
.c-float-cv__anchor {
	position: absolute;
	right: 0;
	left: 0;
	width: 900px;
	max-width: calc(100% - 160px);
	bottom: 0;
	margin-inline: auto;
}
.c-float-cv__pagetop {
	position: absolute;
	top: 0;
	bottom: 0;
	width: 60px;
	height: 60px;
	margin-block: auto;
	right: 10px;
}
.l-footer {
	margin-bottom: 120px;
}
@media screen and (max-width:1040px) {
	.c-float-cv__anchor {
		right: 70px;
		max-width: calc(100% - 70px - 10px);
	}
}
@media screen and (max-width:767px) {
	.c-float-cv {
		position: fixed;
		inset: auto 0 0;
		height: auto;
		background-color: transparent;
		z-index: 10;
	}
	.c-float-cv__anchor {
		position: static;
		width: 100%;
		max-width: 100%;
	}
	.c-float-cv__pagetop {
		top: -35px;
		bottom: auto;
		width: 40px;
		height: 40px;
		margin-block: 0;
		right: 10px;
	}
	.l-footer {
		margin-bottom: calc(220 / 750 * 100vw);
	}
}


:where(.c-modal) p {
	font-size: inherit;
	line-height: inherit;
}
.c-modal {
	align-items: center;
	justify-content: center;
}
.c-modal .o-red {
	color: #E60012;
}
.c-modal::before {
	content: "";
	position: fixed;
	inset: 0;
	background-color: #858B97;
	opacity: 0;
	z-index: -1;
	transition: opacity .3s;
}
.c-modal_inner {
	transform: translateY(0) !important;
}
.c-modal.is-active::before {
	opacity: .8;
}
.c-modal.is-closing::before {
	opacity: 0;
}
.c-modal .js-modal-close {
	position: absolute;
	right: 0;
	width: 50px;
	height: 50px;
	bottom: calc(100% + 20px);
	background-color: #F5F7FB;
	border-radius: 100%;
	background: rgba(245, 247, 251, 0.60);
	box-shadow: 0 0 13.333px 0 rgba(0, 0, 0, 0.24);
}
.c-modal .js-modal-close::before,
.c-modal .js-modal-close::after {
	content: "";
	position: absolute;
	right: 10px;
	left: 10px;
	top: calc(50% - 1px);
	border-top: 2px solid #858B97;
	transform: rotate(45deg);
}
.c-modal .js-modal-close::after {
	transform: rotate(-45deg);
}
.c-modal_scroll {
	width: 100%;
	padding-inline: 20px;
	padding-block: 90px 40px;
	overflow-y: auto;
}
.c-modal_inner {
	height: auto;
	max-height: none;
}

.c-app-modal_inner {
	position: relative;
	max-width: 1040px;
	padding: 8px;
	background: linear-gradient(268deg, #E99495 -3.66%, #EBB7CE 14.76%, #FDC689 33.18%, #F6EA91 50.51%, #B9D989 67.84%, #67C5EA 86.26%, #B0ABD5 104.68%);
	border-radius: 20px;
	display: flex;
	align-items: center;
	flex-direction: row;
	container-type: inline-size;
	--px: calc(100cqi / 1024);
}
.c-app-modal_inner::before {
	content: "";
	position: absolute;
	inset: 8px;
	border-radius: 12px;
	background-color: #fff;
	z-index: -1;
}
.c-app-modal_img {
	flex-shrink: 0;
	width: calc(560 / (1040 - 8 * 2) * 100%);
	width: calc(560 * var(--px, 1px));
}
.c-app-modal_content {
	flex-grow: 1;
}
.c-app-modal_qr {
	display: flex;
}
.c-app-modal_qr_item {
	width: calc(200 / (1040 - 8 * 2 - 560) * 100%);
	width: calc(200 * var(--px, 1px));
	text-align: center;
	font-size: 2.2rem;
	font-size: calc(22 * var(--px, 1px));
	font-weight: 700;
}
.c-app-modal_qr_item img {
	display: block;
	width: calc(161 / 200 * 100%);
	margin-inline: auto;
	margin-top: 5px;
	margin-top: calc(5 * var(--px, 1px));
}
.-has-code .c-app-modal_qr_item img {
	width: calc(130 / 200 * 100%);
}
.c-app-modal_code-box {
	width: 378px;
	width: calc(378 * var(--px, 1px));
	position: relative;
	margin-top: 24px;
	margin-top: calc(24 * var(--px, 1px));
	padding: 24px;
	padding: calc(24 * var(--px, 1px));
	background-color: #fff;
	border-radius: 16px;
	border-radius: calc(16 * var(--px, 1px));
	border: 1px solid #D9DDE3;
	text-align: center;
	font-size: 1rem;
	font-size: calc(10 * var(--px, 1px));
	line-height: 1.5;
	font-weight: 700;
}
.c-app-modal_code-box::before,
.c-app-modal_code-box::after {
	content: "";
	position: absolute;
	width: 60px;
	height: 60px;
	width: calc(60 * var(--px, 1px));
	height: calc(60 * var(--px, 1px));
	background: linear-gradient(45deg, #E99495 0%, #EBB7CE 17%, #FDC689 34%, #F6EA91 50%, #B9D989 66%, #67C5EA 83%, #B0ABD5 100%);
	clip-path: polygon(calc(100% - 20px) 0, 100% 0, 0 100%, 0 calc(100% - 20px));
	opacity: 0.6;
}
.c-app-modal_code-box::before {
	top: -1px;
	left: -1px;
}
.c-app-modal_code-box::after {
	bottom: -1px;
	right: -1px;
	transform: rotate(180deg);
}
.c-app-modal_code-box .code {
	font-size: 1.8rem;
	font-size: calc(18 * var(--px, 1px));
	margin-top: 10px;
	margin-top: calc(10 * var(--px, 1px));
}
.c-app-modal_code-box .campaign-code {
	display: block;
	letter-spacing: 0.1em;
	font-size: 2rem;
	font-size: calc(20 * var(--px, 1px));
}
.c-app-modal_code-box.-type-txt {
	line-height: 1.8;
}
.c-app-modal_code-box.-type-txt .o-block {
	display: block;
	margin-bottom: calc(10 * var(--px, 1px));
	font-size: calc(13 * var(--px, 1px));
	line-height: 1.5;
}
.c-app-modal_code-box.-type-txt .o-strong {
	font-size: calc(17 * var(--px, 1px));
}
@media screen and (max-width:767px) {
	.c-modal_scroll {
		padding-block: 60px 10px;
		padding-inline: 16px;
	}
	.c-modal .js-modal-close {
		width: 40px;
		height: 40px;
		bottom: calc(100% + 10px);
	}
	.c-app-modal_inner {
		width: 100%;
		flex-direction: column;
		padding: 6px;
		--px: 1px;
	}
	.c-app-modal_inner::before {
		inset: 6px;
		border-radius: 14px;
	}
	.c-app-modal_img {
		order: 3;
		width: auto;
	}
	.c-app-modal_title {
		width: 100%;
		padding: 40px 34px 22px;
		text-align: left;
		font-size: 2.4rem;
		line-height: 1.2;
		font-weight: 700;
	}
	.c-app-modal_title .o-large {
		font-size: 200%;
	}
	.c-app-modal_btn {
		display: flex;
		margin: 0 8px;
		margin-bottom: 10px;
	}
	.c-app-modal_btn_item {
		width: 100%;
	}

	.c-app-modal_code-box {
		width: auto;
		margin-block: 18px;
		margin-inline: 16px;
		padding: 16px 0;
		border-radius: 8px;
	}
	.c-app-modal_code-box::before,
	.c-app-modal_code-box::after {
		width: 40px;
		height: 40px;
		clip-path: polygon(calc(100% - 15px) 0, 100% 0, 0 100%, 0 calc(100% - 15px));
	}
	.c-app-modal_code-box .code {
		font-size: 1.4rem;
	}
	.c-app-modal_code-box .campaign-code {
		display: inline;
		font-size: 1.8rem;
	}
	.c-app-modal_code-box.-type-txt .o-strong {
		font-size: 1.6rem;
	}
}


.c-privilege-modal_inner {
	position: relative;
	max-width: 800px;
	background: #fff;
	border-radius: 20px;
	padding: 0 60px 80px;
}
.c-privilege-modal__title {
	min-width: 460px;
	width: fit-content;
	padding: 16px 32px 8px;
	margin-inline: auto;
	background-color: #00A0E9;
	border-radius: 0 0 16px 16px;
	color: #fff;
	text-align: center;
	font-size: 2.2rem;
	font-weight: 700;
	line-height: 1.5;
}
.c-privilege-modal__title .o-large {
	display: block;
	font-size: 2.8rem;
}
.c-privilege-modal__label {
	margin-bottom: 40px;
	padding-block: 24px;
	text-align: center;
	font-size: 2.8rem;
	line-height: 1.5;
	border-bottom: 2px solid #D9DDE3;
	font-weight: 700;
}
.c-privilege-modal__detail {
	text-align: center;
	font-weight: 700;
	font-size: 2rem;
	line-height: 1.5;
}
.c-privilege-modal__notes {
	margin-top: 16px;
	text-align: center;
	font-size: 1.2rem;
	line-height: 1.5;
	letter-spacing: .03em;
	color: #727272;
}
.c-privilege-modal__notes a {
	color: #9D843E;
	text-decoration: underline;
}
.c-privilege-modal__notes.-left {
	margin-inline: 2em;
	text-align: left;
	padding-left: 1em;
	text-indent: -1em;
}
@media (hover: hover) {
	.c-privilege-modal__notes a:hover {
		text-decoration: none;
	}
}
.c-privilege-modal__limit {
	width: fit-content;
	margin-top: 24px;
	margin-inline: auto;
	padding: 8px 56px;
	background-color: #F5F7FB;
	text-align: center;
	font-size: 1.4rem;
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: .03em;
	border-radius: 8px;
}

.c-privilege-modal__section {
	margin-top: 32px;
}
.c-privilege-modal__section-title {
	position: relative;
	margin-bottom: 16px;
	isolation: isolate;
	color: #00A0E9;
	font-size: 1.8rem;
	font-weight: 700;
	line-height: 1.5;
	text-align: center;
}
.c-privilege-modal__section-title::before {
	content: "";
	position: absolute;
	inset: calc(50% - 1px) 0 auto;
	border-top: 2px solid #00A0E9;
	z-index: -1;
}
.c-privilege-modal__section-title span {
	position: relative;
	display: inline-block;
	padding-inline: 1rem;
	background-color: #fff;
	z-index: 2;
}
.c-privilege-modal__section-list {
	font-size: 1.4rem;
	line-height: 1.5;
}
.c-privilege-modal__section-list > li::before {
	background-color: #00A0E9 !important;
}
.c-privilege-modal__section-list > li .notes {
	display: block;
	font-size: 1.2rem;
	color: #727272;
	margin-top: 0.2em;
}
.c-privilege-modal__bottom-notes {
	margin-top: 32px;
	font-size: 1.4rem;
	line-height: 1.5;
}
.c-privilege-modal__bottom-notes a {
	color: #9D843E;
	text-decoration: underline;
}
@media (hover: hover) {
	.c-privilege-modal__bottom-notes a:hover {
		text-decoration: none;
	}
}
@media screen and (max-width:767px) {
	.c-privilege-modal_inner {
		width: 100%;
		border-radius: 16px;
		padding: 0 24px 32px;
	}
	.c-privilege-modal__title {
		min-width: 260px;
		padding: 8px 14px;
		border-radius: 0 0 10px 10px;
		font-size: 1.2rem;
	}
	.c-privilege-modal__title .o-large {
		font-size: 1.6rem;
	}
	.c-privilege-modal__label {
		margin-bottom: 16px;
		padding-block: 16px 8px;
		font-size: 2.2rem;
		border-bottom-width: 1px;
	}
	.c-privilege-modal__detail {
		font-size: 1.3rem;
	}
	.c-privilege-modal__notes {
		margin-top: 8px;
		font-size: 1rem;
	}
	.c-privilege-modal__notes.-left {
		margin-inline: 0;
	}
	.c-privilege-modal__limit {
		width: 100%;
		margin-top: 16px;
		padding: 8px;
		font-size: 1rem;
		border-radius: 4px;
	}

	.c-privilege-modal__section {
		margin-top: 16px;
	}
	.c-privilege-modal__section-title {
		font-size: 1.3rem;
	}
	.c-privilege-modal__section-list {
		font-size: 1.2rem;
	}
	.c-privilege-modal__section-list > li .notes {
		font-size: 1rem;
	}
	.c-privilege-modal__bottom-notes {
		margin-top: 16px;
		font-size: 1.2rem;
	}
}

.c-display-modal_inner {
	width: 300px;
	padding: 0;
	background: transparent;
}

body:has(.p-card-privilege.-sej) .c-privilege-modal__title {
	background-color: #039944;
}
body:has(.p-card-privilege.-sej) .o-blue {
	color: #039944;
}
body:has(.p-card-privilege.-sej) .c-privilege-modal__section-title {
	color: #039944;
}
body:has(.p-card-privilege.-sej) .c-privilege-modal__section-title::before {
	border-color: #039944;
}
body:has(.p-card-privilege.-sej) .c-privilege-modal__section-list > li::before {
	background-color: #039944 !important;
}