#mainBanner{
	padding:0 0 0 20px;
	line-height: 1.5;
}

#mainBanner .inner{
	display:flex;
	align-items: center;
	width:100%;
	max-width:940px;
	aspect-ratio: 94 / 30;
	margin:0 auto;
	background-image:url(images/mimage.jpg);
	background-size: cover;
	background-position: center right;
	position: relative;
}

#mainBanner .inner #signup{
	position:absolute;
	bottom:10px;
	right:20px;
}

#mainBanner .inner #signup a{
	display:block;
	padding:10px 20px;
	background:#E85C5C;
	color:#FFF;
	border-radius: 10px;
	border:3px solid #FFF;
	font-weight: 700;
	font-family: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
	box-shadow: 3px 3px 7px #0002;
}

#mainBanner .inner #signup a p{
	text-align: center;
	padding:0;
	margin:0 0 5px;
	font-size:18px;
	line-height: 1.0;
}

#mainBanner .inner #signup a span{
	text-align: center;
	display: block;
	font-size:14px;
}


#mainBanner .inner .copy{
	padding:20px 0;
}

#mainBanner .inner .copy h2,
#mainBanner .inner .copy h3{
	line-height:1.7;
	padding:0;
	margin:0;
	font-size:20px;
	font-weight: 900;
	color:#244487;
	font-size: clamp(20px, 2vw, 30px);
	text-shadow:3px 3px 2px #FFF,3px -3px 2px #FFF,-3px 3px 2px #FFF,-3px -3px 2px #FFF;
	font-family: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
}


#mainBanner .inner .copy h3{
	margin-bottom: 10px;
	text-indent: -0.5em;
}


#mainBanner .inner .copy p{
	line-height:1.7;
	font-size:14px;
	font-weight: 600;
	text-shadow: 0 0 1px #FFF, 0 0 2px #FFF, 0 0 3px #FFF;
	color:#1e1e1e;
	font-family: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
}

#mainBanner .inner .copy h2 br,
#mainBanner .inner .copy p br{
	display:none;
}

@media(max-width:780px){
	#mainBanner .inner .copy h2 br,
	#mainBanner .inner .copy p br{
		display:block;
	}
}


#uranaishi{
	display: flex;
	flex-wrap:wrap;
	gap:30px 20px;
	margin-bottom:30px;
}

.uranaishi{
	width:100%;
	max-width:calc((100% + 20px) / 4 - 20px);
	background:#FFF;
	box-shadow: 0 0 5px #00000022;
	position: relative;
}

.uranaishi .no{
	position: absolute;
	top:-20px;
	right:5px;
	display: flex;
	align-items: center;
	flex-direction: column;
	justify-content: center;
	background:#D35400;
	background:#B8860B;
	background:#8B1111;
	color:#FFF;
	padding:5px;
	width:48px;
	height:48px;
	border-radius: 30px;
	white-space: nowrap;
	border:4px solid #FFF;
	box-shadow: 2px 2px 3px #244486;
	box-sizing: border-box;
}

.uranaishi .no span{
	font-size:20px;
	font-weight: bold;
	font-family: 'Segoe UI','San Francisco','Helvetica Neue','Arial','Georgia','Courier New';
}


.uranaishi h3{
	background:#415ca2;
	color:#FFF;
	text-align: center;
	padding:10px 0;
	font-size:12px;
}

.uranaishi h3 span{
	font-weight:bold;
	font-size: 14px;
	letter-spacing: 0.1em;
}


.uranaishi .img img{
	width:100%;
	height:auto;
}

.uranaishi .type{
	padding:10px;
}

.uranaishi .status{
	display: flex;
	justify-content: center;
    align-items: center;
	height:50px;
	margin:10px;
	/*border:1px solid #415ca2;*/
	border-radius: 7px;
	outline: 2px solid #FFF;
	outline-offset: -5px;
	color:#FFF;
}

.uranaishi .status:after{
	font-size:16px;
	font-weight: 500;
	font-family: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
}

.uranaishi[data-status="0"] .status{background:#707080}
.uranaishi[data-status="1"] .status{background:#5bb5a7}
.uranaishi[data-status="2"] .status{background: #ef7f75;}

.uranaishi[data-status="0"] .status::after{content:"離席中";}
.uranaishi[data-status="1"] .status::after{content:"待機中";}
.uranaishi[data-status="2"] .status::after{content:"鑑定中";}


@media(max-width:880px){
	.uranaishi{
		width:100%;
		max-width:calc((100% + 20px) / 3 - 20px);
		background:#FFF;
		box-shadow: 0 0 5px #00000022;
	}
}

@media(max-width:680px){
	.uranaishi{
		width:100%;
		max-width:calc((100% + 20px) / 2 - 20px);
		background:#FFF;
		box-shadow: 0 0 5px #00000022;
	}
}


@media(max-width:480px){
	#uranaishi{
		justify-content: center;
	}

	.uranaishi{
		width:100%;
		max-width:340px;
		background:#FFF;
		box-shadow: 0 0 5px #00000022;
	}
}

