@charset "utf-8";


/* メインエリア */
.cm-wrap{

}

.cm-main{
	position: relative;
	background: #d92817;
	padding:60px 55px 0;
}

.cm-wrap .cm-main p {
    text-align: center;
    line-height: 1.4;
}

.cm-main .cap-01{
	margin: 0 auto 50px;
}
.cm-main .cap-01 img{
	max-width: 100%;
}
.cm-main .txt-01{
	margin-bottom: 15px;
	color:#f2ce00;
	font-size: 24px;
	font-weight: bold;
	letter-spacing: 1px;
}
.cm-main .txt-02{
	padding-bottom: calc(80px + 23px);
	color:#FFF;
	font-size: 20px;
	font-weight: bold;
	letter-spacing: 1px;
}
.cm-main .img-01{
	position: absolute;
    top: 100%;
    left: 0;
    display: flex;
    justify-content: center;
    transform: translate(0%, -55%);
    width: 100%;
	gap: 0 12px;
}
.cm-main .img-01 img{
	width: 124px;
	height: auto;
	max-width: 100%;
}


/* メニューエリア */
.cm-menu{
	margin: 140px auto 0;
	width: 85%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	gap:35px;
}

.cm-menu-item{
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	width:100%;
}
.cm-menu-item .photo{

}
.cm-menu-item .photo img{
	width: auto;
	max-height: 280px;
	max-width: 100%;
}
.cm-menu-item .info{
	
}
.cm-menu-item .info .title{
	color: #d92817;
	font-size: 24px;
	font-weight: bold;
	line-height: 1.2;
}
.cm-menu-item .info .price{
	margin-top:16px;
	color: #d92817;
	font-size: 20px;
	font-weight: bold;
}
.cm-menu-item .info .price small{
	font-size: 12px;
}
.cm-menu-item .info .price img{
	padding:0 4px 0 10px;
	width: auto;
	height: 1.4em;
	position: relative;
	top:-0.1em;
}
.cm-menu-item .info .text{
	margin-top:12px;
	line-height: 1.8;
}
.cm-menu-item .info p{
	text-align: left;
}

.cm-menu-item:nth-of-type(1){
	flex-direction: row-reverse;
}
.cm-menu-item:nth-of-type(1) .photo{
	width: 56%;
}
.cm-menu-item:nth-of-type(1) .info{
	width: 44%;
}
.cm-menu-item:nth-of-type(2){
	
}
.cm-menu-item:nth-of-type(2) .photo{
	width: 46%;
}
.cm-menu-item:nth-of-type(2) .info{
	width: 54%;
}
.cm-menu-item:nth-of-type(3){
	flex-direction: column;
	width: 45%;
}
.cm-menu-item:nth-of-type(4){
	flex-direction: column;
	width: 45%;
}
.cm-menu-item:nth-of-type(5){
	flex-direction: column;
	width: 70%;
}
.cm-menu-item:nth-of-type(n+3) .info{
	margin-top:10px;
}


/* その他 */
.cm-note{
	width: 90%;
	margin:80px auto 0;
}
.cm-note li{
	margin:8px 0;
	text-indent: -1em;
 	padding-left: 1em;
	font-size: 12px;
	color: #231815;
	line-height: 1.4;
}



@media only screen and (max-width: 640px) {


	.cm-main{
		padding:30px 20px 30px;
	}
	.cm-main .cap-01{
		margin-bottom: 20px;
		max-width: 90%;
	}
	.cm-main .txt-01{
		margin-bottom: 0;
		font-size: 12px;
	}
	.cm-main .txt-02{
		padding: 0;
		font-size: 10px;
		letter-spacing: 0;
	}
	.cm-main .img-01{
		flex-direction: row;
        width: 80%;
        flex-wrap: wrap;
        position: static;
        transform: translate(0%, 0);
		gap: 10px;
		margin: 0 auto 10px;
	}	
	.cm-main .img-01 img{
		max-width: 40%;
	}
	.cm-main .gp-01{
		display: flex;
		flex-direction: column-reverse;
	}



	.cm-menu{
		margin: 40px auto 0;
		width: 100%;
		gap:40px;
	}

	.cm-menu-item{
		flex-direction: column !important;
		width:95% !important;
	}
	.cm-menu-item .photo{
		width:100% !important;
		text-align: center;
	}
	.cm-menu-item .info{
		width:95% !important;
	}
	.cm-menu-item .info .title{
		font-size: 18px;
	}
	.cm-menu-item .info .price{
		margin: 10px 0 0;
		font-size: 16px;
	}
	.cm-menu-item .info .price small{
		font-size: 10px;
	}
	.cm-menu-item .info .text{
		margin: 15px 0 0;
		font-size: 13px;
		line-height: 1.6;
	}

	.cm-menu-item .photo img{
		max-width:100%;
		max-height: none;
	}
	.cm-menu-item:nth-of-type(n+1) .info{
		margin-top:5px;
	}
	.cm-menu-item:nth-of-type(2) .photo img{
		max-width: 85%;
	}
	.cm-menu-item:nth-of-type(3) .photo img, .cm-menu-item:nth-of-type(4) .photo img{
		max-width: 65%;
	}

	.cm-note{
		width: 100%;
		margin:60px auto 0;
		font-size: 12px;
	}

}