@charset "utf-8";
.fadein,
.fadeinTop{
	opacity : 0;
	transform: translateY(20px);
	transition: all 1s;
}
.secPad{
	padding: 100px 0;
}



#image_main_lower {
	background-image: url('../img/kv_pc.png');
}
#ttl_rebake {
	margin: 45px auto 100px;
	text-align: center;
}
#ttl_rebake .img_head img {
	width: 659px;
	height: auto;
}
#ttl_rebake h1 {
	font-size: 20px;
}
#ttl_rebake .txt {
	font-family: 'Noto Serif JP', serif;
	font-size: 16px;
	margin-top: 30px;
}


.reason{
	background-color: #f4f4f4;
}
.reason .layoutWp{
	max-width: 1200px;
	margin: auto;
	display: flex;
	justify-content: space-between;
}

.reason .layoutWp .reasonDtl{
	width: 48%;
}

.reason .layoutWp .ttl,
.reason .layoutWp .dtl{
	margin: 0 40px;
}
.reason .ttl h2{
	margin: 10px auto 50px;
	font-family: 'Noto Serif JP', serif;
	font-size: 20px;
	font-weight: bold;
}
.reason .layoutWp .dtl p{
	margin-bottom: 16px;
}
.reason .layoutWp > figure{
	width: 48%;
}
.reason .layoutWp > figure img{
	width: 100%;
}

.reason_01 .ttl p img{
	width: calc(706px / 2);
}
.reason_02 .ttl p img{
	width: calc(760px / 2);
}
.reason_03 .ttl p img{
	width: calc(741px / 2);
}

.reason_02 {
	background-color: #fff;
}

.reason_02 .layoutWp .reasonDtl{
	order: 2;
}
.reason_02 .layoutWp > figure{
	order: 1;
}
.reason_02 .layoutWp > figure::before{
	width: 80%;
	height: 80%;
	content: '';
	background-color: #f4f4f4;
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 1;
}
.reason_02 .layoutWp > figure img{
	position: relative;
	z-index: 2;
}


.keysArea{
	background-color: #f4f4f4;
}
.keysArea .cont{
	padding: 0 40px;
}
.keysArea h2,
.keysArea .flexWp{
	max-width: 860px;
	margin: auto;
}
.keysArea h2{
	padding: 4px 0;
	margin-bottom: 60px;
	font-family: 'Noto Serif JP', serif;
	font-size: 20px;
	font-weight: bold;
	text-align: center;
	border-top: 1px solid #43423f;
	border-bottom: 1px solid #43423f;
}
.keysArea .flexWp{
	display: flex;
	justify-content: space-between;
}
.keysArea .flexWp .keys{
	width: 28%;
}
.keysArea .flexWp .keys figure{
	position: relative;
}
.keysArea .flexWp .keys figure::before{
	width: 100%;
	height: 285%;
	content: '';
	background-color: #fff;
	border-radius: 50%;
	position: absolute;
	top: -30px;
	left: 0;
	z-index: 1;
}
.keysArea .flexWp .keys figure img{
	display: block;
	width: 50%;
	margin: auto;
	position: relative;
	z-index: 2;
}
.keysArea .flexWp .keys p{
	margin: 20px auto;
	font-family: 'Noto Serif JP', serif;
	font-size: 24px;
	font-weight: bold;
	text-align: center;
	position: relative;
	z-index: 2;
}
.keysArea .flexWp .keys ul{
	margin-left: 45px;
	position: relative;
	z-index: 2;
}
.keysArea .flexWp .keys ul li{
	list-style-type: disc;
}


.moreDelicious .posWp{
	max-width: 1220px;
	margin: 0 auto 30px;
	padding: 0 40px 150px;
	position: relative;
}
.moreDelicious .posWp figure img{
		width: 100%;
}
.moreDelicious .posWp .ttl{
		position: absolute;
		left: 6%;
		bottom: 0;
}
.moreDelicious .posWp .ttl h2{
	margin: 10px auto 0;
	font-family: 'Noto Serif JP', serif;
	font-size: 20px;
	font-weight: bold;
}
.moreDelicious .posWp .ttl p img{
	width: calc(998px / 2);
}
.moreDelicious .flexWp{
	max-width: 1220px;
	margin: auto;
	padding: 0 40px 0 calc(2% + 40px);
	display: flex;
	align-items: flex-end;
}
.moreDelicious .flexWp p:nth-child(1){
	max-width: calc(100% - 410px);
	margin-right: 60px;
}
.moreDelicious .flexWp p:nth-child(2){
	width: 350px;
}



@media screen and (max-width: 767px) {
.cont{padding: 0 20px;}
.secPad{
	padding: 50px 0;
}


#image_main_lower {
	background-image: url('../img/kv_sp.png');
}
#ttl_rebake {
	margin: 30px 25px 50px;
}
#ttl_rebake .img_head{
	text-align: center;
}
#ttl_rebake .img_head img {
	width: calc(659px / 1.5);
}
#ttl_rebake h1 {
	font-size: 16px;
}
#ttl_rebake .txt {
	font-family: 'Noto Serif JP', serif;
	font-size: 16px;
	margin-top: 15px;
	text-align: left;
}


.reason .layoutWp{
	max-width: 100%;
	display: block;
}
.reason .layoutWp .reasonDtl{
	width: 100%;
}
.reason .layoutWp .ttl,
.reason .layoutWp .dtl{
	margin: 0 auto;
}
.reason .ttl h2{
	margin: 6px auto 30px;
}
.reason .layoutWp .dtl figure{
	margin-bottom: 20px;
}
.reason .layoutWp .dtl figure img{
	width: 100%;
}
.reason .layoutWp > figure{
	width: 100%;
	position: relative;
	top: auto;
	right: auto;
}
.reason .layoutWp > figure img{
	width: 100%;
}

.reason_01 .ttl p img{
	width: calc(706px / 2.5);
}
.reason_02 .ttl p img{
	width: calc(760px / 2.5);
}
.reason_03 .ttl p img{
	width: calc(741px / 2.5);
}

.reason_02 .layoutWp .reasonDtl{
	order: 1;
}
.reason_02 .layoutWp > figure{
	padding-right: 20px;
	padding-top: 40px;
	right: auto;
	left: auto;
	order: 2;
}
.reason_02 .layoutWp > figure::before{
	width: 80%;
	height: 94%;
}


.keysArea .cont{
	padding: 0 20px;
}
.keysArea h2,
.keysArea .flexWp{
	max-width: 100%;
}
.keysArea .flexWp{
	display: block;
}
.keysArea .flexWp:not(:last-of-type){
	margin-bottom: 30px;
}
.keysArea .flexWp .keys{
	width: 100%;
	position: relative;
}
.keysArea .flexWp .keys:not(:last-of-type){
	margin-bottom: 80px;
}
.keysArea .flexWp .keys figure{
	width: 120px;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}
.keysArea .flexWp .keys figure::before{
	width: 130px;
	height: 130px;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.keysArea .flexWp .keys figure img{
	width: 70%;
}
.keysArea .flexWp .keys p{
	width: 65%;
	margin: 0 0 0px auto;
	font-family: 'Noto Serif JP', serif;
	font-size: 24px;
	font-weight: bold;
	text-align: center;
	position: relative;
	z-index: 2;
}
.keysArea .flexWp .keys ul{
	width: 55%;
	margin-left: auto;
}

.moreDelicious{
	padding-bottom: 0;
}
.moreDelicious .posWp{
	max-width: 100%;
	margin: 0 auto 60px;
	padding: 0 20px 160px;
}
.moreDelicious .posWp .ttl{
	width: calc(100% - 40px);
	left: 20px;
}
.moreDelicious .posWp .ttl p img{
	width: 100%;
}
.moreDelicious .flexWp{
	max-width: 100%;
	padding: 0 20px;
	display: block;
}
.moreDelicious .flexWp p:nth-child(1){
	max-width: 100%;
	margin-right: 0;
	margin-bottom: 30px;
}
.moreDelicious .flexWp p:nth-child(2){
	width: 100%;
	text-align: center;
}



}/* @media */