@charset 'UTF-8';
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@500;700&display=swap');

#detail #middle_cont_left {
	color: #232323;
	font-size: 13px;
	line-height: 21px;
	padding: 0;
	margin-bottom: 20px;
	box-sizing: border-box;
	font-family: 'Hiragino Sans', 'Hiragino Kaku Gothic Pro', 'Noto Sans', 'Meiryo', 'MS PGothic', sans-serif;
	letter-spacing: -0.06em;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow: hidden;
	-webkit-font-kerning: normal;
	font-kerning: normal;
	background:#fff repeating-linear-gradient(#deeaf0,#deeaf0 1px,#fff 1px, #fff 15px);
}

#detail #middle_cont_left a img {
	border: none;
}

#page-top {
	z-index: 99;
}

#dv_latest_recipe .sq dd.naiyo {
	text-align: justify;
	line-break: strict;
}

#ul_kiji {
	padding: 0 28px;
}

/* ----------------------------------------------------------------------------------------------------------- */
/* 共通 */
/* ----------------------------------------------------------------------------------------------------------- */
/*
	橙：#dc5310
	土：#a9865f
	黄：#fff67f
	薄紫：#a2aac6
	青緑：#98cac7
	
*/
.flex {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}

.wrap {
	flex-wrap: wrap;
}

.caption,
.spec {
	font-size: 9px;
	line-height: 1.5;
	letter-spacing: -0.05em;
}

.spec strong {
	display: block;
}

.sp,.sp5 {
	display: none;
}

.alignRight {
	text-align: right !important;
	transform-origin: right bottom;
}

.alignCenter {
	text-align: center !important;
}

#detail #middle_cont_left p {
	hanging-punctuation: allow-end;
	line-break: strict;
}

#detail #middle_cont_left sup {
	font-size: 50%;
	top: -0.6em;
	line-height: 1;
}

#detail #middle_cont_left em {
	color: #ef857d;
	font-style: normal;
}

#detail #middle_cont_left em.purple {
	color: #a660a3;
}

#detail #middle_cont_left em.brown {
	color: #954d2a;
}

#detail #middle_cont_left em.yellow {
	color: #fff67f;
}

.serif {
	font-family: 'Hiragino Mincho Pro', 'ヒラギノ明朝', 'Noto serif', 'Yu Mincho', 'MS Mincho', serif;
	font-weight: bold;
	font-feature-settings: 'palt';
}


/* ----------------------------------------------------------------------------------------------------------- */
/* c00 */
/* ----------------------------------------------------------------------------------------------------------- */
#c00 {
	padding: 30px 30px 40px;
}

#c00 p.lead {
	font-size: 16px;
	line-height: 28px;
	font-weight: 500;
	text-align: center;
	line-break: strict;
	margin: 0;
}

/* ----------------------------------------------------------------------------------------------------------- */
/* c01 */
/* ----------------------------------------------------------------------------------------------------------- */
#c01 {
	padding: 0 30px 30px;
}
#c01 h3,#c01 h5{
	color:#6cbb5a;
	font-size:21px;
	line-height:1;
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-weight:500;
	font-feature-settings:'palt';
	margin:0 0 18px;
}
#c01 h3:after,#c01 h5:after{
	display:block;
	content:'';
	width:100%;
	height:7px;
	background:transparent repeating-linear-gradient(-30deg, #fff 0px,#fff 5px,#f1c41e 5px, #f1c41e 9px);
	margin:6px 0 0;
}
#c01a{
	justify-content:space-around;
	align-items:stretch;
	margin:30px 0 40px;
}
#c01a div{
	width:245px;
}
#c01 #c01a p{
	display:flex;
	justify-content:center;
	align-items:center;
	font-size:10px;
	line-height:1.3;
	border:1px solid #666;
	padding:5px;
	margin:12px 0 0;
	min-height:62px;
	background:#fff;
}
#c01 h4{
	color:#777;
	font-size:18px;
	font-weight:700;
	border-left:3px solid #777;
	padding-left:12px;
	margin:0 0 18px;
}
#c01b{
	align-items:center;
	margin:20px 0;
}
#c01b img{margin-right:40px;}
#c01b div{
	position:relative;
}
#c01b div:before{
	position:absolute;
	content:'';
	left:-26px;
	top:0;
	width:13px;
	height:100%;
	background:transparent url('images/arrow@2x.png') center center no-repeat;
	background-size:contain;
}

/* ----------------------------------------------------------------------------------------------------------- */
/* c02 */
/* ----------------------------------------------------------------------------------------------------------- */
#c02 {
	padding: 0 30px 30px;
}
#c02 h3{
	display:flex;
	justify-content:center;
	align-items:center;
	margin:0 0 40px;
}
#c02 h4{
	display:flex;
	align-items:center;
	color:#777;
	font-size:21px;
	line-height:1.3;
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-weight:700;
	margin:0 0 30px;
}
#c02 h4 img{margin-right:20px;}
#c02 h5{
	font-size:16px;
	line-height:1.5;
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-weight:500;
	font-feature-settings:'palt';
	margin:0 0 10px;
}
#c02a,#c02b{
	font-size:12px;
	line-height:1.6;
	margin-bottom:50px;
}
#c02a .flex{align-items:center;}
#c02a .flex:first-of-type{margin-bottom:18px;}
#c02a .flex p{margin:0;}
#c02a .flex div{margin-right:20px;}
#c02a .flex div img{margin-top:20px;}
#c02a h5{color:#ef857d;}
#c02c h5{color:#f39800;}
#c02b .flex:first-of-type{
	justify-content:space-around;
	margin:20px 0;
}
#c02b .flex:first-of-type div{
	width:260px;
}
#c02b .flex:first-of-type p{
	margin:12px 0 0 0;
	text-align:justify;
	font-feature-settings:'palt';
}
#c02b .flex:last-of-type{
	align-items:center;
	font-size:9px;
	background:#e6ebee;
	padding:10px;
}
#c02b .flex:last-of-type>img{
	margin:-20px 24px 0 -20px;
}
#c02b .flex:last-of-type p{
	margin:10px 0 0 -14px;
	text-align:justify;
	font-feature-settings:'palt';
}
#c02c .flex{align-items:center;margin-bottom:30px;}
#c02c h4{margin-bottom:-10px;}



/* ----------------------------------------------------------------------------------------------------------- */
/* c03 */
/* ----------------------------------------------------------------------------------------------------------- */
#c03{
	padding:30px 30px 15px;
	background:#fff;
}
#c03 h3{
	display:flex;
	align-items:center;
	justify-content:center;
	margin:0 0 50px;
}
#c03>div{
	position:relative;
	border:2px solid #6cbb5a;
	padding:15px 15px 15px 30px;
	margin:0 0 30px;
	background:#fff;
}
#c03>div:before{
	content:'';
	position:absolute;
	left:-46px;
	top:-14px;
	width:45px;
	height:45px;
	background:#fff;
	border-right:2px solid #6cbb5a;
	transform:rotate(45deg);
	transform-origin:right bottom;
}
#c03>div:last-of-type{margin-bottom:0;}
#c03 h4{
	color:#6cbb5a;
	font-size:21px;
	line-height:1;
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-weight:700;
	font-feature-settings:'palt';
	margin:0 0 20px 10px;
}
#c03 h4:first-letter{
	font-size:200%;
	font-weight:700;
	vertical-align:middle;
}
#c03 .inner{
	width:100%;
	width:calc(100% - 160px);
}
#c03 .inner .flex{
	justify-content:space-between;
	align-items:center;
}
#c03 .inner .spec{margin:0;}
#c03b_photo{margin:0 0 0 -10px;}
#c03 .column{
	width:260px;
	font-size:10px;
	line-height:1.6;
	position:relative;
	background:#fef3f8;
	padding:15px;
}
#c03 h5{
	color:#6cbb5a;
	font-size:13px;
	line-height:1;
	font-weight:600;
	font-feature-settings:'palt';
	margin:0 0 10px;
}
#c03 .column .note{
	position:absolute;
	right:10px;
	top:10px;
	text-align:right;
}
#c03 .side{
	width:160px;
	margin:0 0 0 20px;
}
#c03 .side p{
	font-size:9px;
	line-height:1.5;
	text-align:justify;
	line-break:strict;
	margin:10px 0 0;
}
/* ----------------------------------------------------------------------------------------------------------- */
/* retina */
/* ----------------------------------------------------------------------------------------------------------- */
@media (-webkit-min-device-pixel-ratio:2) and (min-width:641px),
(min-resolution:2dppx) and (min-width:641px) {}

/* ----------------------------------------------------------------------------------------------------------- */
/* iPad */
/* ----------------------------------------------------------------------------------------------------------- */
@media only screen and (max-width:1024px) {}

/* ----------------------------------------------------------------------------------------------------------- */
/* iPhone */
/* ----------------------------------------------------------------------------------------------------------- */
@media only screen and (max-width:640px) {
.flex {flex-wrap: wrap;}
.caption,.spec {transform: scale(1);font-size: 9px;line-height: 13px;letter-spacing: -0.05em;}
#detail #middle_cont_left {padding: 0;}

#c00 {padding: 20px 15px;}
#c00 p.lead {font-size: 14px;line-height:1.8;text-align: center;margin: 0;}

#c01{padding:15px;}
#c01 h3,#c01 h5{line-height:1.3;text-align:center;}
#c01a{margin-bottom:20px;}
#c01a div{margin-bottom:20px;}
#c01 h4{font-size:16px;line-height:1.3;}
#c01b{justify-content:center;}
#c01b img{margin:0 auto 40px;}
#c01b div:before{left:50%;top:-40px;transform:rotate(90deg);margin-left:-6px;width:13px;height:40px;}
#c02{padding:0 15px 15px;}
#c02 h3 img{max-width:100%;}
#c02 h4{display:block;font-size:18px;margin-bottom:20px;}
#c02 h4 img{display:block;height:36px;margin:0 0 10px;}
#c02a .flex div{margin:0 0 10px;}
#c02a .flex:first-of-type>img{max-width:calc(100% + 30px);margin:0 -15px 20px;}
#c02a .flex:last-of-type img{max-width:100%;margin:10px auto;}
#c02b .flex div img{max-width:100%;}
#c02b .flex:first-of-type{margin:0;}
#c02b .flex:first-of-type div{margin:0 auto 20px;}
#c02b .flex:last-of-type>img{margin:0 auto 10px;}
#c02b .flex:last-of-type p{margin:10px 0 0;}
#c02c .flex{justify-content:center;}
#c02c .flex:last-of-type{margin:0;}
#c02c .flex:last-of-type img{max-width:100%;margin:0 auto 20px;}
#c02c h4{margin-bottom:20px;}
#c03{padding:15px;}
#c03 h3{margin:0 0 20px;}
#c03 h3 img{max-width:100%;}
#c03>div{justify-content:center;padding:10px;margin-bottom:15px;}
#c03>div:last-of-type{margin:0;}
#c03>div:before{width:22px;height:22px;left:-22.5px;top:-7px;}
#c03 h4{text-align:center;margin:0 0 20px;}
#c03 h4:first-letter{font-size:100%;}
#c03 .inner{width:100%;}
#c03 .inner .flex{justify-content:center;}
#c03 .inner .spec{align-self:flex-end;margin:0 0 10px 5px;}
#c03 .column{width:100%;margin:15px 0;padding:10px;}
#c03 .column img{max-width:100%;}
#c03 .side{width:100%;margin:0;display:flex;align-items:flex-start;}
#c03 .side img{display:block;margin:0 10px 0 0;}
#c03 .side p{margin:0;}

.sp {display: inherit;}
.nosp {display: none !important;}
}
@media only screen and (max-width:320px) {
	.sp5 {display:inherit;}
	#detail #middle_cont_left {
		font-size: 12px;
		line-height: 1.5;
		width:95vw;
	}
	#c00 p.lead{font-size:12px;line-height:1.8;}
	#c01,#c02,#c03,#c04{padding:10px;}
	#c01 h3,#c01 h5{font-size:18px;}
	#c02 h3{margin-bottom:15px;}
	#c02 h4{font-size:16px;}
	#c02 h4 img{height:30px;}
	#c02 h5{font-size:15px;}
	#c02 .flex:first-of-type>img{width:calc(100% + 20px);margin: 0 -10px;}
	#c02c img{max-width:100%;}
	#c03 .side{display:block;}
	#c03 .side img{margin:0 auto 15px;}
}

/* ----------------------------------------------------------------------------------------------------------- */
/* Android4 Legacy */
/* ----------------------------------------------------------------------------------------------------------- */