@charset "UTF-8";

/*=======================================================
共通
=======================================================*/
.el-sec-mainTtl {
	font-size: 32px;
	position: relative;
	margin-bottom: 48px;
	color: #A7660F;
}
.el-sec-mainTtl::after {
	position: absolute;
	content: "";
	width: 76px;
	height: 7px;
	bottom: -16px;
	left: 50%;
	transform: translateX(-50%);
	background: #FFD490;
}
@media screen and (max-width : 750px){
    .el-sec-mainTtl {
	    font-size: 48px;
    }
}
/*=======================================================
area
=======================================================*/
.bl-area {
	padding: 40px 0 80px;
}
.bl-area .ly-cont-inner {
	width: 920px;
}
.el-area-txt {
	text-align: center;
	margin-bottom: 40px;
}
.bl-area .bl-media {
	display: grid;
	grid-template: auto 1fr / 440px auto;
	grid-template-areas: "imgWrapper body";
	gap: 0 32px;
}
.bl-area .bl-media:has(.el-media-ttl) {
	grid-template-areas: 
		"imgWrapper title"
		"imgWrapper body";
}
.bl-area .bl-media-imgWrapper {
    width: 440px;
}
.bl-area .el-media-ttl {
	width: 100%;
	background-color: #31180E;
	font-size: 22px;
	color: #FFFFFF;
	padding: 1px 0 2px 16px;
}
.bl-area .el-media-txt.price {
	color: #A7660F;
	font-size: 26px;
}
.bl-area .el-media-txt > span {
    font-weight: lighter;
}
@media screen and (max-width : 750px){
    .bl-area {
	    padding: 64px 0;
    }
    .bl-area .ly-cont-inner {
	    width: 690px;
    }
    .el-area-txt {
	    text-align: start;
	    margin-bottom: 56px;
    }
	.bl-area .bl-media:has(.el-media-ttl) {
		grid-template: auto / auto;
		grid-template-areas: "title" "imgWrapper" "body";
	}
    .bl-area .bl-media-imgWrapper {
        width: 100%;
    }
    .bl-area .el-media-ttl {
	    font-size: 38px;
	    text-align: center;
	    padding: 3px 0 4px;
    }
    .bl-area .el-media-txt.price {
	    font-size: 38px;
    }
}