@charset "UTF-8";
/*-----------------------------------------
/*
/* 期間限定パフェ　設定
/*
/*----------------------------------------*/



/* 共通 */
#title{
	margin-top: 140px;
	text-align: center;
	padding: 0;

}
#title .title{
	background: linear-gradient(90deg, #fbe2e4 50%, #fbe2e4 50%);
}
#title .title h1{
	padding: 0px 0;
	margin-bottom: 0;
}


#special{
	background-color:#fbe2e4;
	background-image:url(../images/monthly/logo_4non.png);
	background-position: 50% 180px;
	background-repeat: no-repeat;
background-attachment: fixed; 
	padding: 0;
}


#special .cont{
	padding-top: 35px;
}
#special .float{
	overflow: hidden;
}
#special .kisaragi,
#special .yayoi{
	float: left;
	width: 50%;
	text-align: center;
}
#special .txt{
	text-align: left;
	width: 370px;
	margin: 0 auto 40px;
	padding-left: 16px;
}
#special .kisaragi .txt p{
	color: #7e4d29;
}
#special .yayoi .txt p{
	color: #7e4d29;
}
#special .txt p{
	margin-bottom: 0;
}
#special .txt p.price{
	font-size: 36px;
	font-weight: bold;
	margin-bottom: 0;
}
#special .txt p.set{
	display: inline-block;
	border: 1px solid;
	padding: 5px;
}
#special figure{
	margin-bottom: 0;
}


/* 特定px 以下 */
@media screen and (max-width: 1099px){
	#monthly img{
		width: 100%;
	}
	#title h1 img{
		max-width: 970px;
	}
	#special h2 img{
		max-width: 605px;
	}
	#special figure img{
		max-width: 570px;
	}
	
	
	#special{
	background-image:url(../images/monthly/logo_4non.png);
	background-size:40% auto;
	background-position: 50% 180px;
	background-repeat: no-repeat;
	padding: 0;
}
	
}
@media screen and (max-width: 899px){
	#special .kisaragi,
	#special .yayoi{
		padding: 0 2%;
	}
}

@media screen and (max-width: 640px){
	#title{
		margin-top: 140px;
			font-size:10px;
	}
}
@media screen and (max-width: 575px){
	#title .title h1{
		padding: 10px 0;
					font-size:10px;
	}
	#title h1 img{
		width: 95%;
	}
	#special .kisaragi,
	#special .yayoi{
		padding: 0 5%;
	}
	#special .txt{
		width: 100%;
		padding-left: 0;
		margin-top: 20px;
	}
	#special .txt br{
		display: none;
	}
}
@media screen and (max-width: 509px){
	#menu p{
		width: 90px;
	}
}
@media screen and (max-width: 429px){
	#menu p{
		width: 80px;
	}
}
@media screen and (max-width: 379px){
	#menu p{
		width: 70px;
		top: 2%;
	}
}
@media screen and (max-width: 320px){
	#menu p{
		top: 0;
	}
}