/* CSS Document */

body {
	font-family: "vdl-v7marugothic", sans-serif;
	font-weight: 700;
	font-style: normal;
}

.prefbase1 {
	background-color: #6699cc !important;
}

.prefbase2 {
	background-color: #71d5cb !important;
}

.prefbase3 {
	background-color: #75b777 !important;
}

.prefbase4 {
	background-color: #f0b839 !important;
}

.prefbase5 {
	background-color: #f58c3f !important;
}

.prefbase6 {
	background-color: #e77a72 !important;
}


.loading {
	width: 100vw;
	height: 100svh;
	background-color: white;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 999;
}

.loading_int {
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
}

.load_img {
	width: 5%;
	text-align: center;
}

.load_txt {
	text-align: center;
	font-size: 0.8em;
	color: black;
}

.shop_container {

	padding-top: 10svh;

	.shop_top {
		background-image: url(../images/uriba2025_schedule_bg-head_sp.png);
		background-repeat: no-repeat;
		background-size: cover;
		width: 100vw;
		height: calc((203 / 800) * 100vw);
		z-index: 2;
	}

	@media screen and (min-width: 768px) {

		.shop_top {
			background-image: url(../images/uriba2025_schedule_bg4_pc.png);
			background-repeat: no-repeat;
			background-size: cover;
			width: 100vw;
			height: 20svh;
			z-index: 2;
		}

	}

	.shop_int {
		width: 100vw;
		background-color: #efa7c8;
		padding: 0 3vw;
		z-index: 3;
		margin-bottom: -5svh;
	}

	& h2 {
		color: black;
		font-size: 1.7rem;
		text-align: center;
		margin: 0 auto;
	}

	& h3 {
		font-size: 1rem;
		text-align: center;
		margin: 1vh auto;
	}

	& p {
		color: black;
		text-align: center;
		font-size: 4vw;
		margin: 2vh 5vw;
		letter-spacing: -0.05rem;
		line-height: 1.7;
	}

	& p.small {
		color: black;
		text-align: left;
		font-size: 3vw;
		margin: 2vh 5vw;
		letter-spacing: -0.05rem;
		line-height: 1.7;
	}

	@media screen and (min-width: 768px) {

		& h2 {
			color: black;
			font-size: 2.2rem;
			text-align: center;
			margin: 0 auto;
		}

		& h3 {
			font-size: 1rem;
			text-align: center;
			margin: 1vh auto;
		}

		& p {
			color: black;
			text-align: center;
			font-size: 1.2rem;
			margin: 2vh 5vw;
			letter-spacing: -0.05rem;
			line-height: 1.7;
		}

		& p.small {
			color: black;
			text-align: left;
			font-size: 3vw;
			margin: 2vh 5vw;
			letter-spacing: -0.05rem;
			line-height: 1.7;
		}

	}

	& span.pink {
		color: #E4006E;
		font-weight: bold;
	}

	.mapbase {
		width: 100%;
		/*background-color: #B3DFEA;*/
		background-color: #E6F4FD;
		border-radius: 20px;
		padding: 2vh 2vw;
		box-sizing: border-box;
		margin: 0 auto;
		position: relative;
	}

	@media screen and (min-width:768px) {
		.mapbase {
			width: 50vw;
		}
	}

	.mapbase .int {
		width: auto;
		padding: 20px;
		background-color: #E6F4FD;
		border-radius: 20px;
	}

	.footer_sp {

		margin-top: 10svh;
		padding-bottom: 6svh;

		.share {
			width: 55vw;
			margin: 4svh auto;
			display: flex;
			justify-content: space-around;

			& img {
				width: 7vw;
			}

		}

		& p {
			text-align: center;
			font-size: 0.6rem;
			margin: 0 auto;
			margin-top: 2svh;
			letter-spacing: normal;
		}

		& p.logo {
			width: 40vw;
		}

	}

    @media screen and (min-width: 768px) {
        .footer_sp {

            margin-top: 25svh;
            padding-bottom: 6svh;

            .share {
                width: 20vw;
                margin: 4svh auto;
                display: flex;
                justify-content: space-around;

                & img {
                    width: 3vw;
                }

            }

            & p {
                text-align: center;
                font-size: 0.6rem;
                margin: 0 auto;
                margin-top: 2svh;
                letter-spacing: normal;
            }

            & p.logo {
                width: 10vw;
            }

        }

    }	

}

.shoplist {
	position: relative;
	padding: 5vh 5%;
	background-color: #728CC1;
}

.shoplist h3 {
	color: #572312;
	margin: 10px auto;
	text-align: center;
	font-size: 2.3em;
	margin-bottom: 2vh;
}

.shoplist p {
	font-size: 1.2em;
	line-height: 1.5;
	text-align: center;
	margin: 20px auto;
}

.shopname {
	font-size: 1em;
}

.shopaddress {
	font-size: 0.85em;
	text-align: left !important;
	padding-left: 3vw;
}

.shoplist .mapbase {
	width: 100%;
	/*background-color: #B3DFEA;*/
	background-color: #E6F4FD;
	border-radius: 20px;
	padding: 2vh 2vw;
	box-sizing: border-box;
	margin: 0 auto;
}

.shoplist .mapbase .int {
	width: auto;
	padding: 20px;
	background-color: #E6F4FD;
	border-radius: 20px;
}


/*　ここからPC　*/

@media screen and (min-width: 769px) {

	.loading {
		width: 100vw;
		height: 100vh;
		background-color: white;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 999999;
	}

	.loading_int {
		height: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
	}

	.load_img {
		width: 2%;
		text-align: center;
	}

	.load_txt {
		text-align: center;
		font-size: 0.8em;
		color: black;
	}

	.shoplist {
		position: relative;
		padding: 5vh 5%;
		background-color: #728CC1;
	}

	.shoplist h3 {
		color: #572312;
		margin: 20px auto;
		text-align: center;
		font-size: 2.5em;
		margin-bottom: 5vh;
	}

	.shoplist p {
		font-size: 1.3em;
		line-height: 1.5;
		text-align: center;
		margin: 40px auto;
	}

	.mapbase {
		width: 40vw;
		/*background-color: #B3DFEA;*/
		background-color: #E6F4FD;
		border-radius: 20px;
		padding: 2vh 2vw;
		box-sizing: border-box;
		margin: 0 auto;
	}

	.mapbase .int {
		width: auto;
		padding: 20px;
		background-color: #E6F4FD;
		border-radius: 20px;
	}

}