@charset "utf-8";
html{
	scroll-behavior: smooth;
}
body{
	background-color:#fff;
	color:#1a0000;
	font-family:"小塚ゴシック Pr6N","Meiryo UI","BIZ UDゴシック","メイリオ","游ゴシック","sans-serif";
}
h1,h2,h3,h4,h5,h6{
	text-align:center;
}
h2{
	margin:40px 0;
	font-size:2.5em;
}
h3{
	margin:30px 0;
	font-size:1.8em;
}
h4{
	margin:0 0 10px;
	font-size:1.5em
}
ul{
	list-style:none;
}
a{
	display:block;
}
p{
	text-align:center;
	margin:10px 0 40px;
}
em{
	color:#00b300;
}

/*ファーストビュー*/
header{
	width:100%;
	padding:70px 0 0;
	margin:-70px 0 0 0;
	background-image:url(img/first.png);
	background-repeat:no-repeat;
	background-position: center;
	background-size:cover;
}
@media screen and (max-width:760px){
	header{
		height:80vh;
		padding:20px 0 0;
		margin:-20px auto 0;
		}
}
header div.kotoba{
	display:flex;
	justify-content:space-between;
	width:70%;
	padding:20px;
	margin:85px auto 0;
}
@media screen and (max-width:760px){
	header div.kotoba{
		width:85%;
		display:flex;
		justify-content:space-between;
		padding:50px 0 0;
		margin:50px auto 0;
	}
}
@media screen and (max-width:760px){
	header div.kotoba img{
		height:55vh;
	}
}
/*ヘッダーのナビ*/
header nav.glovalnavi{
	width:100%;
	height:90px;
	padding:0;
	background-color:#98fb98;
	display:flex;
	justify-content:space-between;
	align-items:center;
	position:fixed;
	top:0;
	left:0;
	z-index:9999;
}
@media screen and (max-width:760px){
	header nav.glovalnavi{
		width:100%;
		height:100px;
		padding: 30px 0 0;
		background-color:#98fb98;
		display:flex;
		justify-content:space-between;
		align-items:center;
		position:fixed;
		top:0;
		left:0;
		z-index:9999;
		}
}
header nav.glovalnavi h1{
}
header nav.glovalnavi h1 a{
	padding: 5px 10px 5px 70px;
}
@media screen and (max-width:760px){
	header nav.glovalnavi h1 a{
		padding: 5px ;
	}
}
header nav.glovalnavi h1 a imag{
	width: 130px;
}
header nav.glovalnavi ul.pcmenu{
	width:70%;
	margin:0 50px 0 0;
	display:flex;
	justify-content:space-between;
	font-size:1.5em;
}
@media screen and (max-width:1000px){
	header nav.glovalnavi ul.pcmenu{
		width:60%;
		margin:0 50px 0 0;
		display:flex;
		justify-content:space-between;
		font-size:1em;
	}
}
@media screen and (max-width:760px){
	header nav.glovalnavi ul.pcmenu{
		display:none;
	}
}
header nav.glovalnavi ul li{
}
header nav.glovalnavi ul li a{
	padding: 15px 5px;
}
/*ハンバーガーメニュー*/
div.hamburgerMenu {
	display: none;
}
@media screen and (max-width: 760px) {
	div.hamburgerMenu {
		display: block;
	}
}
div.hamburgerMenu .menuBtn {			
	width: 85px;
	height: 90px;
	background-color: rgba(0,0,0,0.3);
	display: flex;
	justify-content: center;
	align-items: center;
	position: fixed;
	top: 0;
	right: 0;
	z-index: 90;
	cursor: pointer;
	margin:10px 0 0;
}
/* ボタンの3本線を作成、線の幅、線の太さ、線の色を設定 */
div.hamburgerMenu .menuBtn span,
div.hamburgerMenu .menuBtn span:before,
div.hamburgerMenu .menuBtn span:after {
	content: '';
	width: 50px;
	height: 3px;
	border-radius: 3px;
	background-color: #fff;
	display: block;
	position: absolute;
}

/* 上の線は上方向に10pxずらす */
div.hamburgerMenu .menuBtn span:before {
	bottom: 15px;
}

/* 下の線は下方向に10pxずらす */
div.hamburgerMenu .menuBtn span:after {
	top: 15px;
}

/* ボタンクリック時：真ん中の線は透明に */
div.hamburgerMenu #menuBtnCheck:checked ~ .menuBtn span {
	background-color: rgba(255, 255, 255, 0);
}

/* ボタンクリック時：上の線を斜めに（／） */
div.hamburgerMenu #menuBtnCheck:checked ~ .menuBtn span::before {
	bottom: 0;
	transform: rotate(45deg);
}

/* ボタンクリック時：下の線を斜めに（＼） */
div.hamburgerMenu #menuBtnCheck:checked ~ .menuBtn span::after {
	top: 0;
	transform: rotate(-45deg);
}

/* メニューの状態を保持するチェックボックスは非表示 */
div.hamburgerMenu #menuBtnCheck {
	display: none;
}

/* メニューの領域を作成、背景の大きさ、背景色、表示位置、アニメーション（スピードの調整） */
div.hamburgerMenu .menuContent {
	width: 100%;
	height: auto;/* ★100%にするとコンテンツ領域をウィンドウの下までに */
	padding: 0 10px;/* ★メニュー領域の左右の隙間 */
	background-color: rgba(0,100,0,0.7);
	position: fixed;
	top: 0;
	left: 100%;
	z-index: 80;
	transition: all 0.5s;
}

/* メニューの領域を作成、横幅を設定。メニューリストの表示位置を×ボタンの大きさぶん下げる */
div.hamburgerMenu .menuContent ul {
	width: 180px;/* ★100%にすると横幅いっぱい */
	padding: 80px 0 0;
	display: block;
}

/* メニュー項目間の線を追加 */
div.hamburgerMenu .menuContent ul li {
	border-top: solid 1px #fff;
}

/* ☆最初のメニュー項目の上線なくす */
div.hamburgerMenu .menuContent ul li:first-child {
	border-top: none; 		
}

/* メニューのリンク実体。クリックできる余白を作る、文字色、表示位置 */
div.hamburgerMenu .menuContent ul li a {
	padding: 10px 0px;
	display: block;
	font-size: 16px;
	color: #fff;
	text-align: center;
}

/* ボタンクリック時：メニュー領域の引き出し位置 */
div.hamburgerMenu #menuBtnCheck:checked ~ .menuContent {
	left: calc(100% - 200px);/* ★0にすると左端まで */
}
header address{
	width:20%;
	text-align: right;
	font-size:0.7em;
}
@media screen and (max-width:760px){
	header address{
		display:none;
	}
}
/*キャッチコピー*/
header div.kotoba{
	width:50%;
}
@media screen and (max-width:760px){
	header div.kotoba{
		width:70%;
		;
	}
}
/*メイン*/
main{
	max-width:960px;
	padding:80px 0 0;
	margin:0 auto 0;
}
@media screen and (max-width:760px){
	main{
		width:90%;
		padding:0;
		margin:0 auto 0;
	}
}
/*温めるだけで良し*/
main section.whatTabetodoke{
	padding:0 20px;
	margin:0 0 50px;
}
@media screen and (max-width:760px){
	main section.whatTabetodoke{
		padding:60px 0 20px;
		margin:0 0 50px;
	}
}
main section.whatTabetodoke div.box{
	width: 100px;
	height: 20px;
	background-color: #006400;
	border-radius: 10px;
	margin:10px auto 40px;
}
main section.whatTabetodoke div.change{
	display:flex;
}
@media screen and (max-width:760px){
	main section.whatTabetodoke div.change{
	display:flex;
	flex-flow: column;
	margin:0 0 10px;
	}
}
main section.whatTabetodoke div.change div:nth-child(2){
	height:100%;
	margin:auto 10px;	
}
@media screen and (max-width:760px){
	main section.whatTabetodoke div.change div:nth-child(2){
		width:10%;
		transform:rotate(90deg);
		margin:20px auto 10px;	
	}
}
/*弁当の種類たくさん*/
main section.whatTabetodoke div.obentou{
	display:flex;
	max-width:90%;
	margin:0 auto;
}
main section.whatTabetodoke div.obentou img{
	height: 220px;
 	object-fit: cover;
}
@media screen and (max-width:760px){
	main section.whatTabetodoke div.obentou{
	display:flex;
	flex-flow: column;
	margin:0 0 10px;	}
}
@media screen and (max-width:760px){
	main section.whatTabetodoke div.image img{
	margin:10px auto;
	width:100%;
	}
}
/*プラン*/
main section.plan{
	background-color:#F4F8DE;
	padding:70px 100px;
}
@media screen and (max-width:760px){
	main section.plan{
		padding:70px 0;
	}
}
main section.plan div.plan3s{
	margin:20px 0;
	display:flex;
	flex-direction:row;
	justify-content:space-between;
}
@media screen and (max-width:760px){
	main section.plan div.plan3s{
		display:flex;
		flex-flow: column;
		margin:0 0 10px;
		padding:10px 0;
	}
}
/*スポーツ*/
main section.plan div.plan3s div.sports{
	width:calc((100% - 60px)/3);
	padding:150px 0;
	margin:0 0 20px 0;
	background-image:url(img/sports.png);
	background-repeat:no-repeat;
	background-position: center;
 	object-fit: cover;
	color:#fff;
}
main section.plan div.plan3s div.sports h3{
	font-family:"小塚ゴシック Pro","sans-serif";
	font-size:2em;
}
@media screen and (max-width:760px){
	main section.plan div.plan3s div.sports{
	width:100%;
	padding:30px 0;
	margin:0 0 20px 0;
	background-image:url(img/sports.png);
	background-repeat:no-repeat;
	background-position:-300px -420px;
 	object-fit: cover;
	color:#fff;
	}
}
/*ダイエット*/
main section.plan div.plan3s div.daietto{
	width:calc((100% - 60px)/3);
	padding:150px 0;
	margin:0 0 20px 0;
	background-image:url(img/daietto.png);
	background-repeat:no-repeat;
	background-position:-250px -50px;
	object-fit: cover;
	color:#1a0000;
}
main section.plan div.plan3s div.daietto h3{
	font-family:"小塚明朝 Pro","serif";
	font-size:2em;
}
@media screen and (max-width:760px){
	main section.plan div.plan3s div.daietto{
	width:100%;
	padding:30px 0;
	margin:0 0 20px 0;
	background-image:url(img/daietto.png);
	background-repeat:no-repeat;
	background-position:-180px -50px;
 	object-fit: cover;
	color:#1a0000;
	}
}
/*日常*/
main section.plan div.plan3s div.nitizyo{
	width:calc((100% - 60px)/3);
	padding:150px 0;
	margin:0 0 20px 0;
	background-image:url(img/nitizyo.png);
	background-repeat:no-repeat;
	background-position: center;
 	object-fit: cover;
	color:#fff;
}
main section.plan div.plan3s div.nitizyo h3{
	font-family:"小塚ゴシック Pr6N","sans-serif";
	font-size:2em;
}
@media screen and (max-width:760px){
	main section.plan div.plan3s div.nitizyo{
	width:100%;
	padding:30px 0;
	margin:0 0 20px 0;
	background-image:url(img/nitizyo.png);
	background-repeat:no-repeat;
	background-position:center;
 	object-fit: cover;
	color:#fff;
	}
}
main section.plan div.awaseyasui{
	padding:0 10px;
}
/*プランの料金*/
main section.plan div.ryokin table.okane{
	margin:10px 5%;
	width:90%;
	text-align:center;
	border-collapse:collapse;
	border:3px #1a0000 solid;
}
main section.plan div.ryokin table.okane th{
	width:30%;
	border-right:3px #1a0000 solid;
}
main section.plan div.ryokin table.okane th em{
	font-size:3em;
}
main section.plan div.ryokin table.okane td em{
	font-size:3em;
}
main section.plan div.ryokin table.okane td small{
	color:#00b300;
	font-size:1em;
}
main section.plan div.ryokin table.okane tr:nth-child(3) em{
	color:#006400;
}
main section.plan div.ryokin table.okane tr:nth-child(4) small{
	color:#006400;
}
/*プラン料金の背景色*/
main section.plan div.ryokin table.okane tr:nth-child(3){
	background-color:#98FB98;
}
main section.plan div.ryokin table.okane tr:nth-child(4){
	background-color:#98FB98;	
}
main section.plan div.ryokin table.okane tr:nth-child(1){
	background-color:#fff;
}
main section.plan div.ryokin table.okane tr:nth-child(2){
	background-color:#fff;
}
main section.plan div.ryokin table.okane tr:nth-child(5){
	background-color:#fff;
}
main section.plan div.ryokin table.okane tr:nth-child(6){
	background-color:#fff;
}
/*送料*/
main section.plan div.souryou table.souryounobun{
	margin:20px 5% 30px;
	width:90%;
	text-align:center;
	border-collapse:collapse;
	border:3px #1a0000 solid;
}
main section.plan div.souryou table.souryounobun th{
	width:30%;
	border-right:3px #1a0000 solid;
	font-size:2.5em;
}
main section.plan div.souryou table.souryounobun td em{
	font-size:2.5em;
	color:#1a0000;
}
/*ご利用方法*/
main section.use{
	padding:70px 0 0;
}
main section.use div.nagare{
	display:flex;
	justify-content:space-between;
	margin:50px 0;
}
@media screen and (max-width:760px){
	main section.use div.nagare{
		display:flex;
		flex-flow: column;
		margin:0 0 10px;
		padding:10px 0;
	}
}
main section.use div.nagare div.next{
	width:15%;
	margin:auto 10px;
}
@media screen and (max-width:760px){
	main section.use div.nagare div.next{
		height:15%;
		transform:rotate(90deg);
		margin:50px auto;	
	}
}
main section.use div.nagare img{
	width:100%;
	margin:auto;
}
main section.use div.nagare div.kazutoimg{
	display:flex;
}
main section.use div.nagare div.kazutoimg img{
	width:160px;
	margin:10px auto 30px;
}
main section.use div.nagare div.touroku{
	width:calc((100% - 70px)/3);
	background-color:#98FB98;
	padding:10px;
}
@media screen and (max-width:760px){
	main section.use div.nagare div.touroku{
		width:100%;
		background-color:#98FB98;
		padding:10px;
	}
}
main section.use div.nagare div.tyumon{
	width:calc((100% - 70px)/3);
	background-color:#F4F8DE;
	padding:10px;
}
@media screen and (max-width:760px){
	main section.use div.nagare div.tyumon{
		width:100%;
		background-color:#F4F8DE;
		padding:10px;
	}
}
main section.use div.nagare div.renzi{
	width:calc((100% - 20px)/3);
	background-color:#98FB98;
	padding:10px;
}
@media screen and (max-width:760px){
	main section.use div.nagare div.renzi{
		width:100%;
		background-color:#F4F8DE;
		padding:10px;
	}
}
main section.use div.tyui{
	margin: 0 0 50px;
}
/*3回まで半額*/
main section.hangaku{
	background-color:#F4F8DE;
	padding:10px 0 50px;
}
main section.hangaku em{
	color:#CB463C;
	font-size:2em;
}
@media screen and (max-width:760px){
	main section.hangaku em{
		color:#CB463C;
		font-size:1.5em;
	}
}
main section.hangaku div.annai{
	width:80%;
	margin:0 auto;
	display:flex;
	background-color:#98FB98;
	border:3px #159922 solid;
	border-radius: 50px;
	padding:15px 30px;
}
@media screen and (max-width:760px){
	main section.hangaku div.annai{
	width:100%;
	display:flex;
	background-color:#98FB98;
	border:3px #159922 solid;
	border-radius: 50px;
	padding:5px;
	}
}
main section.hangaku div.annai img{
	width:50%;
	height:50%;
	margin:auto 10px;
}
@media screen and (max-width:760px){
	main section.hangaku div.annai img{
		width:38%;
		height:38%;
		margin:auto 0;
	}
}
main section.hangaku div.annai div.annaiInner{
	text-align:center;
}
main section.hangaku div.annai div.annaiInner p{
	font-size:1.3em;
}
main section.hangaku div.annai div.annaiInner div.UI{
	display:flex;
	margin:-30px auto 0;
}
@media screen and (max-width:760px){
	main section.hangaku div.annai div.annaiInner div.UI{
	display:flex;
	margin: -50px 0 0;
	}
}
main section.hangaku div.annai div.annaiInner div.UI div.roguin{
	margin:15px;
	padding:10px 20px;
	font-size:1.2em;
	background-color:#fff;
	border:3px #159922 solid;
}
@media screen and (max-width:760px){
	main section.hangaku div.annai div.annaiInner div.UI div.roguin{
	margin:10px 5px 30px;
	padding:5px 10px;
	font-size:1em;
	background-color:#fff;
	border:3px #159922 solid;
	}
}
main section.hangaku div.annai div.annaiInner div.UI div.touroku{
	margin:15px;
	padding:10px 20px;
	font-size:1.2em;
	color:#fff;
	background-color:#159922;
}
@media screen and (max-width:760px){
	main section.hangaku div.annai div.annaiInner div.UI div.touroku{
	margin:10px 5px 30px;
	padding:5px 10px;
	font-size:1em;
	color:#fff;
	background-color:#159922;
	}
}
/*Q&A*/
main section.situmon{
	padding:70px 0 0;
}
main section.situmon div{
	margin:50px 0;
	padding:30px 20px;
}
main section.situmon div:nth-child(odd){
	background-color:#98FB98;
}
main section.situmon div:nth-child(even){
	background-color:#F4F8DE;
}
/*フッター*/
footer{
	width:100%;
	padding:0 0 10px;
	background-color:#98fb98;
}
footer div.logo{
	width:30%;
	margin:10px auto;
}
@media screen and (max-width:760px){
	footer div.logo{
		width:50%;
		margin:10px auto;
	}
}
footer nav.links{
	width:70%;
	margin:20px auto;
	text-align:center;
}
@media screen and (max-width:760px){
	footer nav.links{
		width:95%;
		margin:0 auto;
		text-align:center;
	}
}
footer nav.links li{
	margin:0 20px;
}
/*SNS*/
footer nav.links ul.sociallinks{
	width:70%;
	display:flex;
	margin:0 auto 50px;
	justify-content: center;
}
@media screen and (max-width:760px){
	footer nav.links ul.sociallinks{
		width:90%;
		display:flex;
		margin:0 auto 50px;
		justify-content: center;
	}
}
/*メニュー*/
footer nav.links ul.primarylinks{
	display:flex;
	margin:0 auto 50px;
	justify-content: center;
}
footer nav.links ul.primarylinks :not(:last-child){
	padding:0 30px 0 0;
	border-right:3px #1a0000 solid;
}
footer nav.links ul.primarylinks li:last-child{
	margin:0 50px;
}
@media screen and (max-width:760px){
	footer nav.links ul.primarylinks{
		display:none;
	}
}
/*法とプライバシー*/
footer nav.links ul.secondarylinks{
	width:70%;
	display:flex;
	margin:0 auto 50px;
	justify-content: center;
}
@media screen and (max-width:760px){
	footer nav.links ul.secondarylinks{
		width:90%;
		display:flex;
		margin:0 auto 50px;
		justify-content: center;
	}
}
footer nav.links ul.secondarylinks li{
	width:50%;
}
footer nav.links ul.secondarylinks :not(:last-child){
	padding:0 50px;
	border-right:3px #1a0000 solid;
}
@media screen and (max-width:760px){
	footer nav.links ul.secondarylinks :not(:last-child){
		padding:0 30px;
		border-right:3px #1a0000 solid;
	}
}
footer nav.links ul.secondarylinks li:last-child{
	margin:0;
}
/*アドレスとc*/
footer address{
	text-align:center;
	margin:0 0 10px 0;
}
footer p{
	margin:20px 0 0;
}
@media screen and (max-width:760px){
	footer p{
		margin:50px 0 0;
	}
}
/*上へ戻る*/
footer div.totop{
	position:fixed;	
	width:70px;
	right:10px;
	bottom:20px;
}
footer div.totop img{
	filter:drop-shadow(2px 2px 2px rgba(0,0,0,0.5));
}