.main_popup_wrap{display: none; position: fixed; inset: 0; z-index: 99999; align-items: center; justify-content: center; padding: 20px; box-sizing: border-box; overflow: hidden;}
.main_popup_wrap_on{display: flex!important;}
.main_popup_dim{position: absolute; inset: 0; background: rgba(0,0,0,0.45); pointer-events: auto;}
.main_popup_list{position: relative; z-index: 1; display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; justify-content: center; gap: 20px; max-width: 100%; pointer-events: none;}
.main_popup_card{flex: 0 0 auto; pointer-events: auto; max-width: min(420px, calc(100vw - 40px));}
.main_popup_card_hidden{display: none!important;}
.main_popup_slot{position: relative; flex: 0 0 auto; pointer-events: auto; max-width: min(420px, calc((100vw - 80px) / 3));}
.main_popup_slot_hidden{display: none!important;}
.main_popup_slot .main_popup_card{display: none; width: 100%!important; max-width: 100%!important;}
.main_popup_slot .main_popup_card.is_active{display: block; animation: mainPopupFadeIn 0.45s ease;}
.main_popup_box{width: 100%; background: #fff; border-radius: 8px; overflow: hidden; box-shadow: 0 8px 24px rgba(0,0,0,0.22); border: 1px solid #ddd;}
.main_popup_img{display: block; width: 100%; height: auto; vertical-align: top;}
.main_popup_img_link{display: block;}
.main_popup_foot{width: 100%; display: flex; background: #fff; border-top: 1px solid #eee; flex-shrink: 0;}
.main_popup_today,.main_popup_close{flex: 1; height: 40px; line-height: 40px; text-align: center; font-size: 13px; cursor: pointer; border: 0; background: #fff; color: #333; padding: 0;}
.main_popup_today{border-right: 1px solid #eee;}
.main_popup_close{font-weight: 700;}

@keyframes mainPopupFadeIn{
	from{opacity: 0; transform: translateY(8px);}
	to{opacity: 1; transform: translateY(0);}
}

@media (max-width: 1100px){
	.main_popup_wrap{
		align-items: flex-start;
		justify-content: center;
		overflow-x: hidden;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		padding: max(16px, env(safe-area-inset-top, 0px)) 16px max(16px, env(safe-area-inset-bottom, 0px));
	}
	.main_popup_list{
		flex-direction: column;
		flex-wrap: nowrap;
		align-items: center;
		justify-content: flex-start;
		width: 100%;
		max-height: none;
		overflow: visible;
		pointer-events: auto;
		gap: 16px;
		padding-bottom: 8px;
	}
	.main_popup_card,.main_popup_slot{width: 100%!important; max-width: 420px!important;}
	.main_popup_img{max-height: 55dvh; width: 100%; height: auto; object-fit: contain;}
}
