@charset "utf-8";
/* ---------------------------------------------------
 Layout-Midium
--------------------------------------------------- */
@media only screen and (min-width:768px) and (max-width:1299px){


	/* 共通
	------------------------------------------------------------*/
	body {
		background-color: #F7F0DF;
		font-family: 'Noto Sans','Zen Maru Gothic', sans-serif;
		font-size: 18px;
		letter-spacing: 0.05em;
		color: #333;
		overflow-wrap:break-word;
	  -webkit-font-smoothing: antialiased;
	  -webkit-overflow-scrolling: touch;
		margin: 0;
	}

	/*-- タグリンク --*/
	body a{text-decoration: none; color:#fff;}
	body a:link {text-decoration: none; color:#fff;}
	body a:visited{text-decoration: none; color:#fff;}
	body a:hover{color:#a9a9a9;}
	body a:active{text-decoration: none;}

	/*-- 共通カラー設定 追記 --*/
	:root {
	  --color-gray: #333;
	  --color-white: #FFF;
	  --color-black: #000;
	}

	img{
		width: 100%;
		height: auto;
	}

	section{
		clear:both;
	}

	/*-- pc電話発信無効 --*/
	@media(min-width: 768px){
	  a[href^="tel:"]{
	    pointer-events: none;
	  }
	}

	/*========= 三本線 ===============*/
	  .openbtn{
	    display: block;
	  }
	  .openbtn{
	  	position:fixed;
	    z-index: 888;/*ボタンを最前面に*/
	  	top:10px;
	  	right: 10px;
	  	cursor: pointer;
	      width: 50px;
	      height:50px;
	  }
	  /*×に変化*/
	  .openbtn span{
	      display: inline-block;
	      transition: all .4s;
	      position: absolute;
	      left: 14px;
	      height: 1px;
	      border-radius: 2px;
	  	background-color: #666;/*カラー*/
	    	width: 45%;
	    }

	  /*三本線の高さ*/
	  .openbtn span:nth-of-type(1) {
	  	top:15px;
	  }
	  .openbtn span:nth-of-type(2) {
	  	top:23px;
	  }
	  .openbtn span:nth-of-type(3) {
	  	top:31px;
	  }
	  /*end//三本線の高さ*/

	  .openbtn.active span:nth-of-type(1) {
	      top: 18px;
	      left: 18px;
	      transform: translateY(6px) rotate(-45deg);
	      width: 30%;
	      background-color: #fff;/*カラー*/
	  }
	  .openbtn.active span:nth-of-type(2) {
	  	opacity: 0;
	    background-color: #fff;/*カラー*/
	  }
	  .openbtn.active span:nth-of-type(3){
	      top: 30px;
	      left: 18px;
	      transform: translateY(-6px) rotate(45deg);
	      width: 30%;
	      background-color: #fff;/*カラー*/
	  }

	/*============================
	ナビゲーション ===============*/

	#g-nav{
	      display: block;

	        /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
	        position:fixed;
	        z-index: 100;
	        /*ナビのスタート位置と形状*/
	    	top:0;
	        right: -120%;
	    	width:100%;
	        height: 100vh;/*ナビの高さ*/
	    	background:#333;/*ナビ背景色*/
	    	opacity: 0.8;
	        /*動き*/
	    	transition: all 0.6s;
	}

	    /*アクティブクラスがついたら位置を0に*/
	    #g-nav.panelactive{
	        right: 0;
	    }

	    /*ナビゲーションの縦スクロール*/
	    #g-nav.panelactive #g-nav-list{
	        /*ナビの数が増えた場合縦スクロール*/
	        position: fixed;
	        z-index: 999;
	        width: 100%;
	        height: 100vh;/*表示する高さ*/
	        overflow: auto;
	        -webkit-overflow-scrolling: touch;
	    }

	    /*ナビゲーション*/
	    #g-nav ul {
	        /*ナビゲーション天地中央揃え*/
	        position: absolute;
	        z-index: 999;
	        top:50%;
	        left:50%;
	        transform: translate(-50%,-50%);
	    }

	    /*リストのレイアウト設定*/

	    #g-nav li{
	    	list-style: none;
	        text-align: center;
	    }

	    #g-nav li a{
	    	color: #fff;
	    	text-decoration: none;
	    	padding:10px;
	    	display: block;
	    	text-transform: uppercase;
	    	letter-spacing: 0.1em;
				font-family: "Zen Maru Gothic", serif;
				font-weight: 700;
				font-style: normal;
	    }

	    /*ホバー半透明*/
	    #g-nav li a:hover{
	    	opacity: 0.5;
	    }

/*--------------------------------------------------------
メインビジュアル
--------------------------------------------------------*/

/*親*/
#top-mv{
	position: relative;
}

			/*pcブロック*/
			.main-pc{
				display: block;
			}
			.br-sp{
				display: none;
			}
			/*sp非表示*/
			.main-sp{
				display: none;
			}


			/*画像*/
			.top-main {
				margin: 0 auto;
				width: 100%;
				max-width: 1680px;
			}
			/*背景*/
			.top-bg {
				margin: 0 auto;
				width: 100%;
				position: absolute;
				z-index: -10;
				top: 0;
				opacity: 0.7;
			}
			/*キャッチコピー*/
			.top-catch{
					position: absolute;
					z-index: 20;
					top: 4%;
					left: 5%;
					font-family: "Zen Maru Gothic", serif;
					font-weight: 700;
					font-style: normal;
					font-size: 24px;
			}


			/*========= コンテンツ ===============*/
			#top-content{
				padding-top: 80px;
				background: #fff;
			}


			.sec-ttl{
				font-size: 24px;
				font-family: "Zen Maru Gothic", serif;
				font-weight: 700;
				font-style: normal;
				text-align: center;
			}
/*========= もしもの時の準備、できていますか？ ===============*/
.sec-1-img{
				display: block;
				margin: 40px auto;
				width: 80%;
			}
.sec-1-img-sp{
				display: none;
			}
/*========= そんな不安を解消！備えあれば憂いなし！ ===============*/
.sec-2{
				width: 100%;
				background: #FFFFF2;
				padding-top: 80px;
				padding-bottom: 20px;
			}
.sec-2-ttl{
	display: block;
}
.sec-2-ttl-sp{
	display: none;
}
.sec-2-img{
				display: block;
				margin: 40px auto;
				width: 80%;
			}
			.sec-2-img-sp{
				display: none;
			}
			.sec-2-product{
				margin: 40px auto;
				width: 80%;
				background: #fff;
				border-radius: 60px;
				padding-top: 60px;
			}
			.sec-2-txt{
				font-size: 16px;
				font-family: "Zen Maru Gothic", serif;
				font-weight: 700;
				font-style: normal;
				width: 80%;
				margin: 40px auto ;

				line-height: 2.8em;
			}
			.product-container{
				width: 80%;
				display: -webkit-box;
				display: -ms-flexbox;
				display: flex;
				-ms-flex-wrap: wrap;
				flex-wrap: wrap;
				justify-content: space-between;
				align-items: flex-end;
				margin: 60px auto;
				padding-bottom: 60px;
			}
			.product-img{
				width: 65%;
			}
			.product-price{
				width: 35%;
				padding-bottom: 20px;
			}

			/*========= 4つのポイント ===============*/
			.sec-point{
				margin: 60px auto;
			}
			.point-right{
				background-image: url("../images/bg-img1.jpg");
				background-size:contain;
				background-repeat:  no-repeat;
				background-position: right top;
			}
			.point-left{
				background-image: url("../images/bg-img2.jpg");
				background-size:contain;
				background-repeat:  no-repeat;
				background-position: left top;
			}
			.sec-point-container1{
				width: 90%;
				display: -webkit-box;
				display: -ms-flexbox;
				display: flex;
				-ms-flex-wrap: wrap;
				flex-wrap: wrap;
				justify-content: space-between;
				margin: 60px auto;
			}
			.sec-point-pic{
				width: 58%;
			}
			.sec-point-txt{
					width: 36%;
					margin-right: 10px;
					margin-top: 20px;
			}
			.sec-point-cp{
						margin-top: 10px;
						line-height: 1.8em;
						font-family: "Noto Sans JP", sans-serif;
						font-weight: 500;
						font-style: normal;
						font-size: 16px;
			}

			.sec-point-container2{
				width: 90%;
				display: -webkit-box;
				display: -ms-flexbox;
				display: flex;
				-ms-flex-wrap: wrap;
				flex-wrap: wrap;
				justify-content: space-between;
				margin: 60px auto;
			}
			.sec-point-txt2{
					width: 36%;
					margin-left: 20px;
					margin-top: 20px;
					margin-right: 20px;
			}
			.sec-point-pic2{
				width: 58%;
			}

			.sec-point-header{
			          width: 86%;
			          margin: 0 auto;
			        }

			/*========= おにぎりについて ===============*/
			.sec-summary-contents{
				width: 100%;
				height: 1020px;
				position: relative;
			}
			.sec-summary-txt{
				position: absolute;
				top: 180px;
				left: 4%;
				width: 80%;
				background: #FFE6B3;
				opacity: 0.7;
					border-radius: 40px;
					padding-bottom: 60px;
			}
			.sec-summary-bg{
				width: 80%;
				position: absolute;
				right: 0;
			}
			.sec-summary-ttl{
				text-align: center;
				font-size: 24px;
				padding-top: 40px;
				font-weight: bold;
				color: #E6452E;
				margin-bottom: 20px;

			}
			.sec-summary-body{
				width: 90%;
				margin: 0 auto;
				font-weight: bold;
				line-height: 1.8em;
				font-size: 16px;
			}
			.sec-summary-body2{
				width: 90%;
				margin: 0 auto;
				font-weight: bold;
				line-height: 1.8em;
				font-family: "Noto Sans JP", sans-serif;
				font-weight: 500;
				font-style: normal;
								font-size: 16px;
			}
			.sec-summary-bold{
				line-height: 1.8em;
				font-family: "Noto Sans JP", sans-serif;
				font-weight: 800;
				font-style: normal;
				color: #E6452E;
				font-size: 18px;
			}
.summary-bottom{
	width: 84%;
	margin-bottom: 80px;
}
			/*========= 商品規格 ===============*/
			.sec-standard{
				width: 100%;
				background: #FFFFF2;
			}
			.standard-ttl{
				text-align: center;
				font-size: 24px;
				padding-top: 40px;
				font-weight: bold;
				padding-bottom: 20px;
			}
			.standard-graph{
				width: 80%;
				margin: 0 auto ;
				padding-bottom: 40px;
			}
			.standard-item{
				line-height: 2em;
				font-family: "Noto Sans JP", sans-serif;
				font-weight: 500;
				font-style: normal;
				font-size: 16px;
				text-align: left;
				background: #e6e6e6;
				padding-left: 20px;
			}
			.standard-detail{
				line-height: 2em;
				font-family: "Noto Sans JP", sans-serif;
				font-weight: 500;
				font-style: normal;
				font-size: 16px;
				padding-bottom: 10px;
				text-align: left;
				padding-left: 20px;
				padding-top: 5px;
			}
			.standard-jfsm{
				width: 160px;
				margin: 0px auto 40px;
			}
			.standard-product{
				width: 80%;
				background: #fff;
				margin: 0 auto;
				border-radius: 40px;
			}
			.standard-pic{
				width: 80%;
				margin: 0 auto;
				padding:40px;
			}
			.standard-factory{
				width: 80%;
				margin: 0 auto;
				font-family: "Noto Sans JP", sans-serif;
				font-weight: 500;
				font-style: normal;
				font-size: 16px;
				padding-top: 40px;
				padding-bottom: 40px;
				line-height: 2em;
			}
			.factory-strong{
				font-family: "Noto Sans JP", sans-serif;
				font-weight: 500;
				font-style: normal;
				font-size: 18px;
			}

			/*========= 各種検査結果 ===============*/
			.sec-inspection{
				width: 100%;
				background: #DBE6CF;
				padding: 40px;
			}
			.inspection-btn{
				background: #7dc04d;
				padding: 20px;
				width: 50%;
				margin: 0 auto;
				text-align: center;
				font-size: 24px;
				font-weight: bold;
				color: #fff;
				letter-spacing: 0.1em;
				border-radius: 20px;
			}
			.inspection-btn a{
			  transition: all 1s;
			}
		.inspection-btn a:hover{
		color: #555;
		}

			/*========= お問い合わせ ===============*/
			.sec-contact{
				width: 100%;
				background: #F7F0DF;
				padding: 40px;
			}
			.contact-btn{
				background: #E6452E;
				padding: 20px;
				width: 50%;
				margin: 0 auto;
				text-align: center;
				font-size: 24px;
				font-weight: bold;
				color: #fff;
				letter-spacing: 0.1em;
				border-radius: 20px;
			}
			.contact-btn a{
				transition: all 1s;
			}
		.contact-btn a:hover{
			color: #555;
		}

			/*===

/*========= 会社案内 ===============*/
			.sec-company{
				padding-top: 40px;
				padding-bottom: 40px;
				background: #fff;
			}
			.sec-company-ttl{
				text-align: center;
				font-size: 24px;
				font-weight: bold;
			}
			.sec-company-name{
				text-align: center;
				font-size: 18px;
				font-weight: bold;
				padding-top: 20px;
			}
			.sec-company-address{
				text-align: center;
				font-family: "Noto Sans JP", sans-serif;
				font-weight: 500;
				font-style: normal;
				font-size: 16px;
				padding-top: 20px;
			}

/*========= footer ===============*/
			.footer-block{
				width: 100%;
				padding-top: 40px;
				background: #f3ce7a;
			}
			.footer-logo{
				width: 180px;
				margin: 0 auto;
			}
			.footer-container{
				width: 580px;
				display: -webkit-box;
				display: -ms-flexbox;
				display: flex;
				-ms-flex-wrap: wrap;
				flex-wrap: wrap;
				justify-content: center;
				margin: 20px auto;
			}
			.footer-item{
				width: 33%;
				font-weight: 500;
				font-size: 16px;
			}
			.footer-item a{
				transition: all 1s;
			}

		.footer-item a:hover{
			color: #555;
		}
			.footer-credit{
				text-align: center;
				padding-top: 20px;
				padding-bottom: 40px;
				font-size: 16px;
			}

}/*=========  Layout-Midium ===============*/