.pp-acf-map {
	width: 100%;
	height: 420px;
	margin: 20px 0;
}

.pp-acf-map img {
	max-width: inherit !important;
}

.pp-modal {
	display: flex; /* flexboxを使う */
	align-items: center; /* 垂直方向の中央揃え */
	justify-content: center; /* 水平方向の中央揃え */
	position: fixed;
	z-index: 1000;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	overflow: auto;
	background-color: rgba(0, 0, 0, 0.5);
	backdrop-filter: blur(5px);
	opacity: 0; /* 初期状態は透明 */
	transition: opacity 0.3s ease-in-out; /* opacityの変化を0.3秒かけて滑らかに */
}

.pp-modal.pp-show { /* モーダルが表示されている時のスタイル */
	opacity: 1; /* 不透明にする */
}

.pp-modal-content {
	background-color: #fff;
	padding: 20px;
	width: 90%;
	max-width: 80%; /* 最大幅を設定 */
	max-height: 75%; /* 最大高さを設定 */
	overflow-y: auto; /* 縦方向のスクロールを有効に */
	margin: auto; /* 中央寄せ */
	position: relative;
	border-radius: 8px; /* 角を丸く */
}

.pp-close-button {
	color: #aaa;
	position: absolute;
	right: 10px;
	top: 10px;
	font-size: 28px;
	font-weight: 700;
	background-color: transparent;
	border: none;
	cursor: pointer;
	padding: 5px; /* クリック領域を広げる */
}

/* フェードインアニメーションの定義 */
@keyframes ppFadeIn {

	from {
		opacity: 0;
		transform: translateY(10px); /* 少し下からフェードイン */
	}

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

/* フェードインアニメーションクラス */
.pp-fade-in {
	animation: ppFadeIn 1s ease-in-out;
}

/* pin-title-containerを初期状態で非表示にする */
.pp-title-container {
	display: none;
	opacity: 0; /* アニメーション対応のため透明にしておく */
	transition: opacity 0.3s ease-in-out; /* フェードイン対応のアニメーション */
}

/* 店舗情報(area全体の配置を横並びに設定) */
.pp-store-info {
	display: flex; /* 横並びを実現 */
	align-items: center; /* 垂直方向の中央配置 */
	gap: 15px; /* アイコンと詳細情報の間隔を適切に調整 */
}

/* アイコン部分 */
.pp-store-icon {
	flex-shrink: 0; /* アイコンのサイズが縮まらないようにする */
	display: inline-block !important;
	vertical-align: middle;
}

.pp-store-icon .pp-img {
	width: 50px;
	height: 50px;
	border-radius: 50%; /* 丸型に */
	object-fit: cover; /* アイコン切り抜き */
}

/* 店舗情報部分 */
.pp-store-details {
	display: inline-block !important;
	vertical-align: middle;
	width: 83%;
}

.pp-store-name {
	font-size: 18px;
	font-weight: 700;
	margin: 0;
	color: #0073aa;
}

.pp-store-address {
	font-size: 0.8em !important;
	margin: 0 0 8px;
	color: #666 !important;
	letter-spacing: 0px !important;
}

/* ボタン部分 */
.pp-store-actions {
	text-align: center;
}

.pp-store-actions .pp-button {
	width: 100%;
	background-color: #FFFBFC;
	color: #6EABD8;
	padding: 7px 0;
	border: 1px solid #6EABD8;
	border-radius: 5px;
	cursor: pointer;
	font-size: .8em;
	font-weight: 700;
}

.pp-store-actions .pp-button:hover {
	background-color: #6EABD8;
	color: #FFFBFC;
}
