.pwa-install-modal {
	display: none;

	position: fixed;
	inset: 0;

	width: 100%;
	height: 100%;

	z-index: 2147483647;

	align-items: center;
	justify-content: center;

	padding: 15px;

	box-sizing: border-box;

	background: rgba(0, 0, 0, 0.55);

	pointer-events: auto;
}

.pwa-install-modal.is-visible {
	display: flex;
}

.pwa-install-box {
	position: relative;

	width: 100%;
	max-width: 420px;

	max-height: calc(100vh - 30px);

	overflow-y: auto;

	box-sizing: border-box;

	padding: 35px 22px 22px;

	background: #ffffff;

	border-radius: 18px;

	text-align: center;

	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.30);

	pointer-events: auto;
}

.pwa-install-icon {
	display: block;

	width: 80px;
	height: 80px;

	margin: 0 auto 15px;

	border-radius: 16px;

	object-fit: contain;
}

.pwa-install-box h2 {
	margin: 0 0 15px;

	font-size: 23px;

	line-height: 1.4;

	color: #222222;
}

.pwa-install-box p {
	margin: 10px 0;

	font-size: 15px;

	line-height: 1.7;

	color: #555555;
}


/* × */
.pwa-install-x {
	position: absolute;

	top: 9px;
	right: 9px;

	z-index: 20;

	width: 42px;
	height: 42px;

	margin: 0;
	padding: 0;

	border: 0;

	border-radius: 50%;

	background: #eeeeee;

	color: #333333;

	font-size: 28px;

	line-height: 42px;

	text-align: center;

	cursor: pointer;

	touch-action: manipulation;

	-webkit-appearance: none;
	appearance: none;

	pointer-events: auto;
}

.pwa-install-x:active {
	background: #dddddd;
}


/* ボタン */
.pwa-install-buttons {
	display: flex;

	width: 100%;

	gap: 10px;

	margin-top: 25px;
}

.pwa-button {
	display: block;

	flex: 1;

	min-height: 48px;

	padding: 10px 15px;

	border: 0;

	border-radius: 9px;

	font-size: 15px;

	font-weight: 600;

	cursor: pointer;

	touch-action: manipulation;

	-webkit-appearance: none;
	appearance: none;

	pointer-events: auto;
}

.pwa-button-cancel {
	background: #eeeeee;

	color: #333333;
}

.pwa-button-install {
	background: #333333;

	color: #ffffff;
}

.pwa-button:active {
	opacity: 0.75;
}

.pwa-full-button {
	width: 100%;

	margin-top: 20px;
}


/* iPhone */
.ios-install-step {
	display: flex;

	align-items: center;

	width: 100%;

	gap: 12px;

	box-sizing: border-box;

	margin-top: 15px;

	padding: 15px;

	border-radius: 10px;

	background: #f5f5f5;

	text-align: left;

	font-size: 14px;

	line-height: 1.6;

	color: #333333;
}

.ios-step-number {
	display: flex;

	align-items: center;
	justify-content: center;

	flex: 0 0 32px;

	width: 32px;
	height: 32px;

	border-radius: 50%;

	background: #333333;

	color: #ffffff;

	font-size: 15px;

	font-weight: bold;
}

.ios-install-note {
	margin-top: 18px !important;

	font-size: 12px !important;

	color: #777777 !important;
}


@media (max-width: 480px) {

	.pwa-install-modal {
		padding: 10px;
	}

	.pwa-install-box {
		padding: 32px 17px 18px;
		border-radius: 16px;
	}

	.pwa-install-icon {
		width: 70px;
		height: 70px;
	}

	.pwa-install-box h2 {
		font-size: 21px;
	}

	.pwa-install-box p {
		font-size: 14px;
	}

	.pwa-button {
		min-height: 48px;
		font-size: 14px;
	}
}