@charset "utf-8";
@import url�i 'https://fonts.googleapis.com/css2�Hfamily = M + PLUS + 1p�• display = swap'�j;

/**/


/*Base Layout*/



/*shop_contents
--------------------*/
#shop1 {
	float: left;
	background:#ffffe0;
	margin-bottom:40px;
}

#shop1 img {
	width:560px;
}

.shop_text {
	float: right;
	width:420px;
	color:#24140e;
	padding:10px;
}

.shop_text h2 {
	color:#8b0000;
	font-size:1.2em;
	text-align:center;
	margin:15px 0;
}

.shop_text p {
	font-size:0.9em;
	padding:10px;
	line-height:2.2em;
	text-align:center;

}

/*Google Map
--------------------*/
#shop_map {
	clear:both;
	border:#ffffe0 2px solid;
	position:relative;
	padding-bottom:50%;

}

#shop_map iframe {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
}

/*shop_details
--------------------*/

#shopimages {
	margin:40px 0;
}

#shop_details {
	width:420px;
	background:#ffffe0;
	color:#24140e;
	padding-right:10px;
	padding-bottom:20px;
}

#shop_details img {
	width:450px;
}

#shop_details h4 {
	color:#8b0000;
	font-size:1em;
}

#shop_details p {
	font-size:0.9em;
	text-indent:1em;
}

#shop2 {
	float: right;
}

#shop2 img {
	width:570px;
	height:395px;
}

/*responsive
--------------------*/
@media screen and (max-width:750px){

	#lim_contents ,
	#whole_contents ,
	#piece_contents ,
	#cream_contents ,
	#another_contents ,
	#allergies_contents {
	width:100%;
	height:100%;
	}

	#shop1, 
	#shop2 {
		float:none;
		width:100%;
		padding:0;
	}

	.shop_text {
		float:none;
		width:100%;
		height:100%;
		margin:0 auto;
	}

	.text_lim h2 {
		width:90%;
	}

	.text_lim p {
		width:90%;
	}
	
	#shop_details,
	#shop1 img, 
	#shop2 img {
		width:100%;
		height:100%;
		margin:0 auto;
	}


}


/*modal
--------------------*/
.modal{
	display: none;
	height: 100vh;
	position: fixed;
	top: 0;
	width: 100%;
}
.modal__bg{
	background: rgba(0,0,0,0.8);
	height: 100vh;
	position: absolute;
	width: 100%;
}
.modal__content{
	background: rgba(255,222,173,0.8);
	color:#000;
	left: 50%;
	padding: 30px;
	position: absolute;
	top: 50%;
	transform: translate(-50%,-50%);
	width: 50%;
	height:30%;
}

.modal__content h4 {
	border-bottom:#000 1px solid;
	margin-bottom:5px;
	width:80%;
	font-size:2em;
}

.modai js-modal a {
	background: #fff;
	width:10px;
	border-bottom:#000 1px solid;
	color:#000;
}



/*introduction
--------------------*/


/*topics
--------------------*/


/*footer
--------------------*/


/*SNS
--------------------*/

/*
=========================================
	Utilities
=========================================
*/


/* clearfix */
.clearfix:after {
	content: ""; 
	display: block; 
	clear: both; 
}
.clearfix{
	zoom:1;
}