@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP&display=swap');

#detail #middle_cont_left {
	color: #232323;
	font-size: 13px;
	line-height: 21px;
	margin-bottom: 20px;
	box-sizing: border-box;
	font-family: 'Helvetica Neue','Arial','Hiragino Sans', 'Hiragino Kaku Gothic Pro', 'Noto Sans JP', '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-color : #fbf5ce;
	padding:0;
}

#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;
	font-feature-settings:'palt';
}

.spec strong {
	display:block;
	white-space:nowrap;
}

.sp,
.sp5 {
	display: none!important;
}

.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;
	font-feature-settings:'palt';
	letter-spacing:0;
}

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

#detail #middle_cont_left em {
	color: #ea5532;
	font-style: normal;
}
#detail #middle_cont_left em.blue {
	color:#3071b9;
	font-style:inherit;
}
#detail #middle_cont_left em.green{
	color:#92ab23;
	font-style:inherit;
}
#detail #middle_cont_left em.orange{
	color:#f08300;
	font-style:inherit;
}
#detail #middle_cont_left em.yellow{
	color:#fff33f;
	font-style:inherit;
}
#detail #middle_cont_left em.violet{
	color:#7d4698;
	font-style:inherit;
}
#detail #middle_cont_left .marker {
	/*color: #fff;*/
	color:inherit;
	background:transparent linear-gradient(to bottom,rgba(255,230,127,0) 45%,rgba(255,230,127,1) 55%,rgba(255,230,127,1) 90%,rgba(255,230,127,0) 95%);
	padding:0;
	margin:0;
}
#detail #middle_cont_left .marker_blue {
	/*color: #fff;*/
	color:inherit;
	background:transparent linear-gradient(to bottom,rgba(84,195,241,0) 45%,rgba(84,195,241,.5) 55%,rgba(84,195,241,.5) 90%,rgba(84,195,241,0) 95%);
	padding:0;
	margin:0;
}
#detail #middle_cont_left .marker_pink {
	/*color: #fff;*/
	color:inherit;
	background:transparent linear-gradient(to bottom,rgba(244,180,208,0) 45%,rgba(244,180,208,.5) 55%,rgba(244,180,208,.5) 90%,rgba(244,188,208,0) 95%);
	padding:0;
	margin:0;
}

.serif {
	font-family: 'Hiragino Mincho Pro', 'Noto Serif JP', 'Kozuka Mincho Pro', 'Yu Mincho', serif;
}

.btn_link{
	display:flex;
	align-items:center;
	justify-content:center;
	text-align:center;
	font-size:10px;
	font-weight:500;
	line-height:1.4;
	color:#fff;
	background:#92ab23;
	transition:.2s linear;
	white-space:nowrap;
	padding:6px;
	border-radius:6px;
}
.btn_link:hover{
	color:#fff;
	text-decoration:none;
	filter:brightness(1.2);
}


/* ----------------------------------------------------------------------------------------------------------- */
/* c00 */
/* ----------------------------------------------------------------------------------------------------------- */
#c00 {
	background-color:transparent;
	background-image:url('images/bg_top@2x.png'),url('images/bg_bottom@2x.png');
	background-position:center top, center bottom;
	background-size:100% auto;
	background-repeat:no-repeat;
	padding:40px 30px 0;
	margin:0;
}
#c00_lead{
	font-weight:500;
	text-align:center;
	font-size:15px;
	line-height:24px;
	margin:0 0 60px;
}
#c00 figure{
	position:relative;
	text-align:center;
	padding-bottom:20px;
}
#c00_fig01{
	margin-bottom:0;
}
#c00 figcaption{
	position:absolute;
}
#c00_spec01{
	text-align:right;
	right:50%;
	bottom:117px;
	margin-right:142px;
}
#c00_spec02{
	text-align:left;
	left:50%;
	bottom:90px;
	margin-left:94px;
}

/* ----------------------------------------------------------------------------------------------------------- */
/* c01 */
/* ----------------------------------------------------------------------------------------------------------- */
#c01 {
	background-color:transparent;
	background-image:url('images/bg_top@2x.png'),url('images/bg_bottom@2x.png');
	background-position:center top, center bottom;
	background-size:100% auto;
	background-repeat:no-repeat;
	position:relative;
	padding:60px 30px 30px;
}
#c01_wrap{
	position:relative;
	background:white;
	border-radius:14px;
	padding:0 20px;
}
#c01 h3{
	display:flex;
	flex-direction:column;
	align-items:flex-end;
	width:fit-content;
	margin:0 auto 1em;
}
#c01 h3 img{
	max-width:100%;
	margin:-36px 10px 10px;
}
#c01_lead{
	font-size:14px;
	line-height:1.7;
	font-weight:500;
	text-align:center;
}
#c01_wrap>.caption{text-align:center;}
#c01a,#c01b{
	position:relative;
	border-top:1px dotted #333;
	padding:24px 0;
}
#c01b{padding-bottom:14px;}
#c01 h4{
	font-size:14px;
	font-weight:600;
	line-height:1.5;
	position:relative;
	padding-left:160px;
	margin:0 0 14px;
}
#c01 h4 img{
	position:absolute;
	left:0;
}
#c01 h4 span{
	display:block;
	font-size:10px;
	font-weight:normal;
}
#c01a .flex, #c01b .flex{
	width:100%;
	justify-content:space-between;
	align-items:center;
}
#c01a_fig01{margin-bottom:-30px;}
#c01b_fig02{margin-top:-60px;}
#c01b .caption{margin-top:1em;}
#c01_arrow{
	display:block;
	margin:20px auto 0;
}
/* ----------------------------------------------------------------------------------------------------------- */
/* c02 */
/* ----------------------------------------------------------------------------------------------------------- */
#c02{
	background-color:transparent;
	background-image:url('images/bg_top@2x.png'),url('images/bg_bottom@2x.png');
	background-position:center top, center bottom;
	background-size:100% auto;
	background-repeat:no-repeat;
	padding:30px;
}
#c02 h3{
	width:fit-content;
	margin:0 auto 20px;
}
#c02 h3 img{
	margin-left:-30px;
}
#c02 h4{
	font-size:20px;
	line-height:25px;
	justify-content:flex-start;
	align-items:center;
	font-feature-settings:'palt';
	margin:0 0 10px;
}
#c02 h4 img:first-of-type{margin-right:10px;}
#c02 h4 img:last-of-type{margin-left:10px;}
.c02_wrap{
	background:white;
	border-radius:14px;
	padding:0 20px 20px;
	overflow:hidden;
	margin-bottom:30px;
}
.c02_wrap:last-of-type{margin-bottom:0;}
.c02_header{
	justify-content:flex-start;
	align-items:center;
	background:#dbe7ed;
	padding:14px 20px;
	margin:0 -20px 20px;
}
.c02_header h5{
	color:#555;
	font-size:18px;
	font-weight:600;
	line-height:1;
	flex-shrink:0;
	margin:0 14px 0 0;
}
.c02_header h5 strong{
	font-size:28px;
	font-weight:600;
}
.c02_header p{
	font-size:12px;
	line-height:18px;
	text-align:justify;
	margin:0;
	padding-left:14px;
	border-left:1px solid #555;
}
#c02a_fig01{
	display:block;
	margin:0 auto;
}
.c02_arrow{
	display:block;
	margin:10px auto;
}
.c02_conclusion{
	color:#555;
	font-size:22px;
	line-height:28px;
	font-feature-settings:'palt';
	text-align:center;
}
#c02a_text{text-align:center;}
#c02a_formula{
	justify-content:space-evenly;
	background:#dbe7ed;
	padding:10px 0 6px;
}
#c02a_formula img:last-of-type{
	padding-left:13px;
	border-left:1px dotted #555;
}
#c02b_center{
	margin:0 20px;
}
#c02b_sub01{
	font-size:16px;
	line-height:1;
	font-weight:600;
	display:block;
	border:1px solid #555;
	margin:0 0 .5em;
	padding:8px 0;
	text-align:center;
}
#c02b_sub02{
	display:block;
	color:#a9ba00;
	font-size:15px;
	line-height:1.5;
	font-weight:500;
	margin:0 0 .5em;
	font-feature-settings:'palt';
}
#c02b_center p{
	font-size:12px;
	line-height:18px;
	text-align:justify;
	margin:0;
}
#c02b_pulse{
	justify-content:space-evenly;
	align-items:stretch;
	background:#dbe7ed;
	padding:14px 0;
}
#c02b_pulse div{
	width:fit-content;
	display:flex;
	justify-content:space-between;
	flex-direction:column;
	margin:0 14px;
}
#c02b_pulse div img{display:block;margin:auto auto 0;}
#c02b_pulse h6{
	display:flex;
	justify-content:center;
	align-items:center;
	color:white;
	font-size:14px;
	line-height:1;
	height:22px;
	background:#a9ba00;
	border-radius:11px;
	margin:0 0 .5em;
}
#c02b_pulse p{
	font-size:12px;
	line-height:18px;
	text-align:justify;
	margin:0 0 1em;
}

/* ----------------------------------------------------------------------------------------------------------- */
/* c03 */
/* ----------------------------------------------------------------------------------------------------------- */
#c03{
	background-color:transparent;
	background-image:url('images/bg_top@2x.png'),url('images/bg_bottom@2x.png');
	background-position:center top, center bottom;
	background-size:100% auto;
	background-repeat:no-repeat;
	padding:30px;
}
#c03 h3{
	width:fit-content;
	margin:0 auto 20px;
}
.c03_left{
	display:flex;
	flex-direction:column;
	align-items:center;
	margin-right:20px;
}
.c03_left img{
	margin-bottom:10px;
}
#c03a h4, #c03b h4{
	position:relative;
	color:#92ab23;
	font-size:18px;
	line-height:36px;
	font-weight:500;
	text-align:center;
	font-feature-settings:'palt';
	background:#fff8;
	margin:0 0 1em;
	border:1px solid #92ab23;
	border-radius:18px;
}
#c03a h4 span{
	position:absolute;
	line-height:1;
	color:#555;
	right:14px;
	top:calc(50% - 4.5px);
}
#c03b h4{
	font-size:17px;
}
.c03_figs{
	align-items:stretch;
	background:white;
}
.c03_figs>h6{
	writing-mode:vertical-rl;
	flex-shrink:0;
	width:18px;
	display:flex;
	text-align:center;
	justify-content:center;
	align-items:center;
	color:white;
	font-size:12px;
	letter-spacing:.5em;
	font-weight:600;
	line-height:1;
	background:#92ab23;
	margin:0;
}
#c03a_figs{
	margin-bottom:15px;
}
#c03a_figs div{
	display:flex;
	flex-direction:column;
	align-items:center;
	padding:10px;
}
#c03a_figs div p{
	display:flex;
	align-items:flex-start;
	font-size:12px;
	line-height:18px;
	text-align:justify;
	line-break:strict;
}
#c03a_figs div p:before{
	display:block;
	content:'';
	background-color:transparent;
	background-position:left top;
	background-repeat: no-repeat;
	background-size:100% auto;
	width:20px;
	height:39px;
	margin:0 6px 0 0;
	flex-shrink:0;
}
#c03a_figs div:first-of-type p:before{
	background-image:url('images/c03_bullet01@2x.png');
}
#c03a_figs div:nth-of-type(2) p:before{
	background-image:url('images/c03_bullet02@2x.png');
}
#c03a_figs div:last-of-type p:before{
	background-image:url('images/c03_bullet03@2x.png');
}
#c03a_figs div img{margin-top:auto;}
#c03a_column{
	align-items:center;
	background:#dbe7ed;
	border-radius:10px;
	padding:10px 16px;;
}
#c03a_column p{
	text-align:justify;
	margin:0 20px 0 0;
}
#c03a_arrow{
	display:block;
	margin:10px auto;
}
.c03_lead{
	margin:0 20px 20px 0;
	text-align:justify;
}
#c03b,#c03c{margin-bottom:20px;}
#c03b h5,#c03c h5{
	font-size:16px;
	line-height:1;
	margin:0 0 14px;
}
#c03b h5 img, #c03c h5 img{
	display:inline-block;
	vertical-align:middle;
	margin-right:10px;
}
#c03b_fig01{margin:0 20px 0 -20px;}
#c03b_figs{
	position:relative;
}
#c03b_balloon{
	position:absolute;
	right:-18px;
	top:-36px;
}

#c03c_figs{
	position:relative;
}
#c03c_balloon{
	position:absolute;
	right:-18px;
	top:-36px;
}
#c03c_figs_wrap{
	padding:14px 20px 14px 14px;
}
#c03c_figs_list{
	list-style:none;
	padding:0;
	margin:0 0 14px;
	width:70%;
}
#c03c_figs_list li{
	font-size:12px;
	line-height:18px;
	text-align:justify;
	width:48%;
	margin:0 0 10px;
}
#c03c_figs_list li:last-of-type{
	font-size:9px;
	line-height:1.5;
	width:100%;
	margin:0;
}
#c03c figure{
	display:flex;
	flex-direction:column;
	align-items:center;
}
#c03c figure img{
	margin:0 0 10px -10px;
}
#c03c_column{
	justify-content:flex-start;
	background:#dbe7ed;
	width:100%;
	padding:10px 10px 10px 6px;
}
#c03c_column h6{
	color:#d2b566;
	font-size:13px;
	line-height:1.3;
	display:flex;
	flex-shrink:0;
	align-items:center;
	justify-content:center;
	text-align:center;
	background:white;
	width:80px;
	height:80px;
	border-radius:40px;
	border:1px solid #d2b566;
	margin:0 10px 0 0;
}
#c03c_column div{
	width:100%;
}
#c03c_column p{
	font-size:10px;
	line-height:1.5;
	text-align:justify;
	padding-bottom:6px;
	margin-bottom:6px;
	border-bottom:1px solid #555;
}
#c03c_column ul{
	list-style:disc;
	font-size:9px;
	line-height:1.5;
	padding:0;
	margin:0 0 0 1.5em;
	width:100%;
}
#c03c_column li{
}

#c03d{
	background:white;
	border:1px solid #92ab23;
	border-radius:14px;
	padding:20px 20px 0;
}
#c03d h4{
	text-align:center;
	display:flex;
	flex-direction:column;
	align-items:center;
	margin:0 0 1em;
	width:fit-content;
}
#c03d h4 img{
	display:block;
	margin:0 0 10px;
}
#c03d h5{
	color:#ef856d;
	font-size:16px;
	line-height:20px;
	border-left:4px solid #ef856d;
	padding-left:6px;
	margin:0 0 1em;
	font-feature-settings:'palt';
}
#c03d div:first-of-type{
	margin-right:-50px;
}
#c03d div:first-of-type h5{
	margin-left:110px;
}
#c03d_fig01{
	margin:-56px 0 0 -8px;
}
#c03d p{
	margin:1em 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;
	}
	.btn_link{font-size:14px;margin:10px 0;}

	#detail #middle_cont_left {}
	#c00,#c01,#c02,#c03{background-image: url('images/bg_top_sp.png'), url('images/bg_bottom_sp.png');}
	#c00{padding:30px 10px 0;}
	#c00_lead{font-size:14px;line-height:1.8;margin-bottom:46px;}
	#c00 figure{}
	#c00_fig01{max-width:100%;margin-bottom:40px;}
	#c00 figcaption{transform:scale(.8);white-space:nowrap;}
	#c00_spec01{margin-right:40px;bottom:120px;transform-origin:right bottom;}
	#c00_spec02{margin-left:10px;bottom:70px;transform-origin:left bottom;}
	#c00_logo{height:45px;}

	#c01{padding:60px 10px 30px;}
	#c01_lead{font-size:13px;text-align:justify;}
	#c01_wrap .caption{text-align:justify;}
	#c01_wrap{padding:0 15px;text-align:justify;}
	#c01 h4{padding:0;}
	#c01 h4 img{position:static;display:block;height:30px;margin-bottom:10px;}
	#c01a_fig01,#c01b_fig02{position:absolute;right:-10px;top:15px;margin:0;}
	#c01a_fig02, #c01b_fig01{display:block;max-width:100%;margin:0;}
	#c01b .caption{margin:1em 0 0;}

	#c02{padding:30px 10px;}
	#c02 h3 img{display:block;max-width:100%;margin:0 auto;}
	#c02 h4{font-size:16px;line-height:1.3;}
	#c02 h4 img:first-of-type{height:40px;}
	.c02_wrap{padding:0 15px 15px;}
	.c02_wrap img{max-width:100%;}
	.c02_header{padding:10px 15px;margin:0 -15px 15px;}
	.c02_header p{text-align:justify;margin:.5em 0 0;border-left:none;border-top:1px solid #555;padding:.5em 0 0;}
	.c02_arrow{height:45px;}
	.c02_conclusion{font-size:18px;}
	#c02a_fig01{margin:0 auto 15px;}
	#c02a_text{text-align:justify;}
	#c02a_formula{padding:10px;}
	#c02a_formula img:last-of-type{margin:10px auto 0;padding:10px 0 0;border-left:none;border-top:1px dotted #555;}
	#c02b_figs{}
	#c02b_center{order:1;margin:0 0 15px;}
	#c02b_fig01{order:2;max-width:48%;}
	#c02b_fig02{order:3;max-width:48%;}
	#c02b_pulse div:first-of-type{margin-bottom:15px;}
	#c02b_pulse img{max-width:100%;}

	#c03{padding:40px 15px 30px;}
	#c03 h3 img{max-width:100%;}
	#c03 h4{line-height:1.3;padding:6px 0;border-radius:10px;}
	#c03 h5{font-size:14px;line-height:1.3;margin:0 0 .5em;display:flex;align-items:center;}
	#c03 h5 img{height:21px;}
	.c03_left{display:none;}
	.c03_middle{display:flex;align-items:flex-start;margin:0 0 15px;}
	.c03_middle>img{margin-right:10px;}
	.c03_figs>h6{writing-mode:horizontal-tb;width:100%;height:18px;}
	.c03_lead{text-align:justify;margin:0 0 1em;}
	#c03b,#c03c{margin-bottom:30px;}
	#c03a h4 span{right:0;bottom:-15px;top:revert;}
	#c03a .c03_middle{align-items:center;}
	#c03a_figs{margin:0 0 10px;}
	#c03a_figs div{flex-direction:row;align-items:center;padding:5px 10px;}
	#c03a_figs div img{margin:0 10px;}
	#c03a_figs div:last-of-type img{margin:-5px -25px 0 10px;}
	#c03a_figs div p{margin:0;}
	#c03a_column{justify-content:center;}
	#c03a_column p{margin:0 0 10px;font-size:12px;line-height:18px;text-align:center;}
	#c03b_balloon{right:-10px;top:-20px;}
	#c03b_fig01_sp{display:block;float:right;margin:0 -5px 0 10px;width:82px;}
	#c03b_fig02{max-width:100%;}

	#c03c_balloon{right:-10px;top:-20px;}
	#c03c_figs_wrap{padding:10px;}
	#c03c_figs_list{width:100%;align-items:center;}
	#c03c_figs_list li img{max-width:100%;}
	#c03c figure{flex-direction:row;justify-content:center;width:100%;}
	#c03c figure img{margin:0 10px 10px -10px;}
	#c03c_column{align-items:center;flex-wrap:nowrap;width:100%;margin:0;padding:10px;}
	#c03c_column ul{margin:0;padding:0 0 0 1.5em;}
	#c03c_column div{width:auto;}

	#c03d{justify-content:space-around;padding:10px 10px 0;}
	#c03d h4{margin:0 auto 1em;}
	#c03d div:first-of-type{margin:0 auto 20px;}
	#c03d div:first-of-type h5{white-space:nowrap;margin-left:100px;}
	#c03d div:not(:first-of-type){max-width:46%;}
	#c03d div img{max-width:100%;}
	#c03d_fig01{margin-top:calc(-45 / 375 * 100vw);margin-left:-6px;}

	.sp {
		display: inherit !important;
	}

	.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;
		padding:0;
	}
	img{max-width:100%;}
	.wrapper{padding:15px;border-radius:13px;}
	#c01,#c02,#c03{padding:30px 0 0;}
	#c02 h4{font-size:14px;line-height:1.5;flex-wrap:nowrap;}
	.c02_conclusion{font-size:16px;line-height:1.5;}
	#c03b_balloon,#c03c_balloon{right:0;}
}

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