@charset "utf-8";
/*
	Last Update:2026/06/01
	Auther: iw
*/
#pankuzu { padding-bottom:10px; }
.center { max-width:1240px; }
.center2 { max-width:940px; }
.center3 { max-width:1440px; }
.wrapper, .wrapper-t { padding-top:80px; }
.wrapper, .wrapper-b { padding-bottom:80px; }
.p10 { padding:10px 0; }
@media (min-width: 576px){
	.pos_ac-pc { text-align:center; }
}

.takuhai_ul { list-style:none; }
.takuhai_ul > li { position:relative; padding-left:20px; }
.takuhai_ul > li + li { margin-top:5px; }
.takuhai_ul > li:before { color:#ffd036; content:"■"; font-size:10px; position:absolute; top:8px; left:0; }

#tabeten_head_navi { padding:10px 0; background:#7d3333; }
#tabeten_head_navi ul { display:flex; align-items:center; justify-content:center; gap:20px; }
#tabeten_head_navi .button { display:inline-flex; border-radius:40px; background:#7d3333; align-items:center; justify-content:center; padding:0 20px; min-height:35px; color:#fff; }
#tabeten_head_navi .button > span { font-weight:500; font-size:0.85em; }
#tabeten_head_navi .button.active { min-height:50px; background:#fff77e; color:#7d3333; }
#tabeten_head_navi .button.active > span { font-weight:bold; font-size:0.95em; }
body.pc #tabeten_head_navi .button:hover { background:#fff77e; color:#7d3333; }

#tabeten_head_sub { position:relative; padding:10px 0; background:#a27979; font-size:0.9em; }
#tabeten_head_sub::before { content:""; position:absolute; bottom:100%; left:calc(50% - 55px); width:30px; height:10px; background:#a27979; clip-path:polygon(50% 0, 100% 100%, 0 100%); }
#tabeten_head_sub ul { display:flex; align-items:center; justify-content:center; gap:20px; }
#tabeten_head_sub .button { display:inline-flex; border-radius:8px; background:#fff; align-items:center; justify-content:center; padding:0 30px; min-height:30px; }
#tabeten_head_sub .button > span { font-size:0.85em; }
#tabeten_head_sub .button.active { min-height:35px; background:#fff77e; color:#7d3333; }
#tabeten_head_sub .button.active > span { font-weight:bold; font-size:0.95em; }
body.pc #tabeten_head_sub .button:hover { background:#fff77e; color:#7d3333; }
@container wciBodyWrap (width < 576px) {
	#tabeten_head_navi, #tabeten_head_sub { display:none; }
}
@container wciBodyWrap (width >= 576px) and (width < 768px) {
	#tabeten_head_navi ul { gap:8px; }
	#tabeten_head_navi .button { padding:0 5px; min-height:30px; }
	#tabeten_head_navi .button.active { padding:0 10px; min-height:45px; }
}

#tabeten_foot { background:#fffcf3; }
#tabeten_foot_tel { background:#fff0e0; padding:30px 0; }
.tabeten_foot_title { background:#cd0a19; color:#fff; border-radius:6px; text-align:center; padding:5px 0; margin-bottom:15px; font-size:1.1em; }
.tabeten_foot_text { color:#340707; font-size:0.9em; }
.button._tabeten_foot { background:#10a40b; width:100%; max-width:400px; display:inline-flex; align-items:center; justify-content:center; border-radius:12px; padding:20px 0; }
.button._tabeten_foot > span { font-weight:bold; color:#fff; font-size:1.15em; }
.button._tabeten_foot .main { font-size:1.25em; }
body.pc .button._tabeten_foot:hover { background:#27c750; }
@container wciBodyWrap (width < 576px) {
	.button._tabeten_foot { margin-bottom:20px; }
}
@container wciBodyWrap (width >= 768px) {
	.button._tabeten_foot { min-height:85px; border-radius:18px; }
}

.lp_links_other a {
	display: block;
	text-align: center;
	padding: 20px 8px;
	border-radius: 12px;
	font-weight:500;
	text-decoration: none;
	color: #fff;
	font-size:1.2em;
	background: linear-gradient(90deg, #7d3333, #ab724f);
}

body.pc .lp_links_other a:hover {
	opacity: 0.9;
}

#tabeten_healthy-use { background:#fff; }
.tabeten_healthy-use_hl { text-align:center; font-weight:bold; font-size:1.5em; margin-bottom:25px; }
.tabeten_healthy-use_hl .c_coop_red { font-size:1.5em; }
.tabeten_healthy-use_title { padding:10px 20px; color:#fff; border-radius:8px; margin-bottom:10px; }
.tabeten_healthy-use_unit1 { position:relative; padding:0 260px 30px 20px; }
.tabeten_healthy-use_unit2 { position:relative; padding:0 260px 30px 20px; }
.tabeten_healthy-use_unit2 dl { display:flex; align-items:center; margin-bottom:10px; }
.tabeten_healthy-use_unit2 dt { flex:0 0 0; }
.tabeten_healthy-use_unit2 dt > span { display:block; font-weight:500; border:2px solid #000; padding:5px 0; width:7em; line-height:1.2; text-align:center; }
.tabeten_healthy-use_unit2 dd { padding:0 0 0 15px; }
.tabeten_healthy-use_title2 { margin-bottom:5px; }
.tabeten_healthy-use_title2 > span { display:inline-block; padding:5px 15px; }
@container wciBodyWrap (width < 576px) {
	.tabeten_healthy-use_unit1 { padding:0 0 30px; }
	.tabeten_healthy-use_unit1_image { text-align:center; }
	.tabeten_healthy-use_unit2 { padding:0; }
	.tabeten_healthy-use_unit2_image { text-align:center; margin-bottom:15px; }
}
@container wciBodyWrap (width >= 576px) {
	.tabeten_healthy-use_unit1_image { position:absolute; right:0; top:-65px; }
	.tabeten_healthy-use_unit2_image { position:absolute; right:0; top:-35px; }
}

.tabeten_sp_table { position:relative; overflow-x:auto; margin-top:10px; }
.tabeten_sp_table > img { min-width:800px; }
@container wciBodyWrap (width < 840px) {
	.tabeten_sp_table::before { content:"横にスクロールできます→"; color:#888; position:absolute; top:10px; left:0; font-size:0.9em; }
}

/* 見出し */
.hy_hl {
	font-size: min(40px, 8vw);
	line-height: 1.3;
	font-weight: bold;
	text-align: center;
	margin-bottom: 28px;
}

/* メイン */
.hy_hero {
	padding: min(7vw, 80px) 15px min(5vw, 40px);
}
.hy_hero_inner { position:relative; overflow:hidden; max-width:1300px;
	margin: 0 auto;
	padding: min(6vw, 56px) min(6vw, 64px);
	border-radius: 28px;
}
.hy_hero_badge {
	display: inline-block;
	font-weight: bold;
	letter-spacing: 0.08em;
	color: #fff;
	border-radius: 50px;
	padding: 8px 16px;
	margin-bottom: 18px;
}

.hy_hero_title { position:relative; z-index:2;
	font-size: min(64px, 11vw);
	line-height: 1.2;
	font-weight: bold;
	margin-bottom: 18px;
}
.hy_hero_title span {
	font-size: min(52px, 10vw);
}
.hy_hero_text {
	font-size: min(24px, 4.9vw);
	line-height: 1.75;
	font-weight: bold;
	margin-bottom: 22px;
}

.hy_hero_meta { position:relative; max-width:900px;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
	margin-bottom: 14px;
}
.hy_hero_meta p {
	background: #fff;
	border-radius: 12px;
	padding: 12px 16px;
	font-weight: bold;
	text-align: center;
}

.hy_hero_note,
.hy_note,
.hy_notice p,
.hy_cta_time {
	font-size: 14px;
	line-height: 1.7;
}
@container wciBodyWrap (width < 992px) {
	.hy_hero_inner {
		padding: 28px 22px;
		border-radius: 20px;
	}
	.hy_hero_main_image {
		border-radius: 14px;
		margin: 0 0 20px;
		overflow: hidden;
		border-radius: 18px;
		box-shadow: 0 12px 24px rgba(122, 79, 42, 0.14);
	}
	.hy_hero_main_image img {
		display: block;
		width: 100%;
		aspect-ratio: 16 / 7;
		object-fit: cover;
	}
}
@container wciBodyWrap (width >= 992px) {
	.hy_hero_main_image { position:absolute; right:0; top:0; width:100%; height:100%; max-width:calc(100% - 400px); }
	.hy_hero_main_image img { object-fit:cover; width:100%; height:100%; object-position:center top; }
	.hy_hero_main_image::before, .hy_hero_main_image::after { content:""; position:absolute; left:0; width:100%; height:100%; }
	.hy_hero_main_image::before { top:0; }
	.hy_hero_main_image::after { bottom:0; }
}

.hy_problem_card h3 {
	font-size: min(26px, 5.5vw);
	line-height: 1.4;
	font-weight: bold;
	margin-bottom: 8px;
}
.hy_feature_item h3,
.hy_menu_item h3,
.hy_cta_title {
	font-size: min(28px, 5.5vw);
	line-height: 1.4;
	font-weight: bold;
	margin-bottom: 8px;
}

.hy_problem_card p,
.hy_feature_item p,
.hy_flow_list p,
.hy_cta_text {
	font-size: min(18px, 4.2vw);
	line-height: 1.8;
}

/* お悩み */
.hy_problem_grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 18px;
}

.hy_problem_card {
	background: #fff;
	border-radius: 18px;
	padding: 22px;
}

/* 特徴 */
.hy_feature_list {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 18px;
}

.hy_feature_item {
	padding: 24px;
	border-radius: 20px;
}

.hy_feature_num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	color: #fff;
	font-size: 18px;
	font-weight: bold;
	line-height: 1;
	margin-bottom: 12px;
}

/* 献立 */
.hy_menu_grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 18px;
	margin-bottom: 14px;
}

.hy_menu_item {
	padding: 24px;
	border-radius: 16px;
	background: #ffffff;
}

.hy_menu_thumb {
	margin: -8px -8px 14px;
	overflow: hidden;
	border-radius: 12px;
}
.hy_menu_thumb img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
}
.hy_menu_item h3 {
	font-size: min(24px, 5vw);
}
.hy_menu_item p {
	font-size: min(16px, 4vw);
}

/* 流れ */
.hy_flow_list {
	counter-reset: step;
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 14px;
	margin-bottom: 10px;
}

.hy_flow_list > li {
	position: relative;
	padding: 20px 20px 20px 82px;
	border-radius: 16px;
	background: #fff;
}

.hy_flow_list > li::before {
	counter-increment: step;
	content: counter(step);
	position: absolute;
	left: 20px;
	top: 22px;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	color: #fff;
	font-weight: bold;
	display: flex;
	align-items: center;
	justify-content: center;
}

.healthy_flow_title {
	font-size: min(28px, 5.5vw);
	line-height: 1.4;
	font-weight: bold;
	margin-bottom: 8px;
}

@container wciBodyWrap (width < 992px) {
	.hy_hero_meta,
	.hy_photo_grid,
	.hy_problem_grid,
	.hy_feature_list,
	.hy_menu_grid {
		grid-template-columns: 1fr;
	}

	.hy_flow_list > li {
		padding: 16px;
	}

	.hy_flow_list > li::before {
		left: 14px;
		top: 16px;
	}
	.healthy_flow_title { padding:8px 0 8px 50px; }
}