html {
 overflow-y: scroll;
}

body{font-size:16px; letter-spacing:0.5px;font-family: 'Noto Sans JP'; line-height:2; font-feature-settings: "palt"; -webkit-font-feature-settings: "palt"; }
.global-inner{ margin:0 auto; min-width:1100px; width:70%; position:relative;}
.inner{padding:0px 8%;}
img{width:100%; height:auto;vertical-align: middle;}

main{padding-top:100px; padding-bottom:100px;}

.head{position:relative;}
.head img{height:330px; object-fit:cover;}


h1{font-size:18px; color:#CC131D; position:absolute; left:10%; top:120px; line-height:1;font-style:normal; font-weight:bold; width:330px;background: rgba(255,255,255,0.7); padding:20px; border-radius:15px;}
h1 span{display:block;color:#71B12C; font-size:35px;position:relative;margin-bottom:10px;font-style:italic;line-height:1.3;overflow:hidden; }
h1 span:after{ content:""; position:absolute;width: -webkit-fill-available; height:3px; bottom:5px; margin-left: 10px;background:#71B12C;}

h1.quality{ width:480px; margin-top:0px;}
h1.quality span.h1{padding-left:100px;font-size:18px;  color:#CC131D;font-style:normal; font-weight:bold;}
h1.quality span.h1:after{content:none;}
h1.quality span{ width: 80px; display:inline;}
h1.quality span:after{ width: 80px;}





h2{display:flex;flex-direction: column-reverse; font-weight:bold; color:#71B12C; }
h2 span:nth-child(2){font-style:italic;}



h2.big span:nth-child(1){font-size:23px; background:#CC131D; color:#FFF;width: max-content;letter-spacing: 2.3px; line-height:1.2; padding:10px 10px;}
h2.big span:nth-child(2){font-size:60px; }

h2 span.bg{ background:#CC131D; color:#FFF !important;width: max-content;letter-spacing: 2.3px; line-height:1.2; padding:5px 10px;}
h2 span.text-red{font-size:20px; color:#CC131D;}


h2 span:nth-child(2){font-size:35px; line-height:1.6; }

h2 span.line:nth-child(2){color:#71B12C; font-size:35px;position:relative;margin-bottom:10px; overflow:hidden;}
h2 span.line:nth-child(2):after{ content:""; position:absolute;width: -webkit-fill-available; height:3px; bottom:8px; margin-left: 10px;background:#71B12C;}

h2.orange{font-size:20px; color:#EE8A02;  }
h2.red{font-size:20px; color:#CC131D; }
h2.red-underline{font-size:20px; color:#CC131D;border-bottom:solid 2px #71B12C; padding-bottom:10px; margin-bottom:10px;  font-style: normal;}
h2.underline-green{border-bottom:solid 2px #71B12C;margin-bottom:10px; }
h2.center{margin-left:auto; margin-right:auto; text-align:center;}
h2.fit{width: max-content;  }

h2 img.ic{width:20px; height:auto;}










h3{ font-weight:bold;}
h3.orange{font-size:20px; color:#EE8A02; border-bottom:solid 2px #71B12C; padding-bottom:5px; margin-bottom:10px;  font-style: normal; }
h3.green{color:#71B12C; border-bottom:solid 2px #EE8A02; padding-bottom:10px; margin-bottom:10px;  font-style: normal; font-size:30px; }
h3.green span{display:block; color:#000; font-size:20px;}
h3.fit{width: max-content;  }
h3.center{ margin-left:auto; margin-right:auto; text-align:center;}

h4{ color:#71B12C; font-size:20px; font-weight:bold;}
h4.orange{color:#EE8A02;font-size:18px;}


@media screen and (max-width: 768px) {
body{line-height:1.8; font-size:14px;}
.global-inner{ margin:0 auto; min-width:auto; width:90%; position:relative;}
.inner{padding:0px;}
main{padding-top:60px;}
h1{font-size:16px;left:5%; width:70%;}
h1 span{font-size:28px;}

h1.quality{ width:90%; margin-top:0px;}
h1.quality span.h1{padding-left:60px;}
h1.quality span{  font-size:22px; line-height:1.8;}
h1.quality span:after{ width: 40px;}


h2.big span:nth-child(1){font-size:16px; }
h2 span.line:nth-child(2){ font-size:25px;}
h2 span:nth-child(2){font-size:30px;}
h2 span.bg{ font-size:14px;}
h2.orange{font-size:19.5px;   }
h3.green{font-size:20px; padding-bottom:5px;}
h3.orange{font-size:16px;}
h4{ font-size:16px;}
h4.orange{font-size:14px;}
}



header{position: fixed;top: 0;left: 50%; transform: translateX(-50%); width: 100%; z-index:3;display:flex;align-items: center;justify-content: space-between;height:100px;background:#F4ECD3;}
header.scroll{ background:#F4ECD3;box-shadow: 0 8px 10px -9px #888; transition: top 0.3s;}
header #navArea{}
header #navArea .inner{width:100%; padding:0px;}
nav{display:flex;justify-content: space-between;align-items: center;margin-left:20px; margin-right:20px;}
header .logo{margin-left:40px;}
header .logo a{display:flex;align-items: center;transition:     .3s}
header .logo img{width:130px; height:auto;}
header .logo a:hover{opacity: 0.6;transition: 0.3s;}
nav ul{display:flex;align-items: center;flex-wrap: wrap;}
nav ul li{font-size:14px; font-weight:bold; }
nav ul li a{color:#000;  padding-right:20px; padding-left:20px;transition:0.5s all; text-align:center;display: block; }
nav ul li a span{
	display: block;
	font-size: 8px;
	color: #71B12C;
	font-style: italic;
}
nav ul li a:hover{transition:0.3s all; text-decoration:none;color: #EE8A02}
nav ul li.toi a{color: #FFF;	display: block;	background: #CC131D;position: relative;	padding: 8px 60px 8px 10px; transition: 0.3s; border-left:solid 4px #EE8A02;}
nav ul li.toi a:after{content:""; background:url(/image/ic-mail-white.png) no-repeat;  width:30px;height:30px; position:absolute; right:15px; top:21px; background-size:100%; }
nav ul li.toi a:hover{ background: #71B12C;transition: 0.3s;}
nav ul li.toi a span{color:#FFF;}
#navbar {
  transition: top 0.3s;
}                                
/*====================
ハンバーガーメニュー
=====================*/
@media screen and (max-width: 768px) {
header{height:60px; position:fixed;left: unset;right: 0;width: 100%;transform: unset;top: 0px; z-index:3;display:flex;align-items: center;justify-content: space-between; padding:0px 10px; border-radius:0px;}
header.scroll{ background-color:transparent;box-shadow: none;}

nav {display: block;position: fixed;top: 0;right: -300px;bottom: 0;width: 300px;background-color:#F4ECD3;-webkit-overflow-scrolling: touch;transition: all 0.5s;z-index: 102;opacity: 0;margin-left:0px; margin-right:0px;}
nav ul li:after{content:none;}
nav ul li a{color:#000; font-size:20px;}
nav ul li a span{font-size:10px;}
nav ul li.toi a{color: #FFF;	display: block;	background: #CC131D;position: relative;	padding: 8px 60px 8px 70px; transition: 0.3s; border-left:solid 4px #EE8A02;}
nav ul li.toi a:after{content:""; background:url(/image/ic-mail-white.png) no-repeat;  width:30px;height:30px; position:absolute; left:25px;right:unset; top:18px; background-size:100%; }
nav ul li.toi a:hover{ background: #71B12C;transition: 0.3s;}
nav ul li.toi a span{color:#FFF;}

header .logo{margin-left:10px;}
header .logo img{width:auto; height:30px;}

.open nav {right: 0;opacity: 1;top:0px;width:50%;box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.08);width:100%; padding-top:60px;}
.open nav{ color:#FFF;}
nav {right: -220px;width: 220px;}
header ul{padding-right:0%; padding-top:0px;font-size:24px;flex-direction: column;}
header ul.menu li{text-align:right; margin-bottom:30px; }




header .copyright{position: absolute; bottom: 1%; left: 50%; transform: translateX(-50%); color:#0CA20F; font-size:12px; }

/*============
ハンバーガーメニューのトグル
=============*/
.toggle_btn {display: block;position: fixed;top:0px; right:0px;width: 60px;height: 60px;transition: all .5s;cursor: pointer;z-index: 103; background-color:transparent;}
.toggle_btn p{font-size:12px;}
.toggle_btn span {display: block;position: absolute;left: 15px;width: 30px;height: 3px;background-color: #B80012;border-radius: 4px;transition: all .5s;}
.toggle_btn span:nth-child(1) {top: 22px;}
.toggle_btn span:nth-child(2) {top: 32px; width:30px;left: unset;right: 15px;}
.toggle_btn span:nth-child(3) {top: 42px;}
.open .toggle_btn span {background-color: #B80012;}
.open .toggle_btn span:nth-child(1) {transform: translateY(10px) rotate(-315deg);}
.open .toggle_btn span:nth-child(2) {opacity: 0;}
.open .toggle_btn span:nth-child(3) {transform: translateY(-10px) rotate(315deg);}

/*========================
ハンバーガーメニューのマスク
=========================*/
#mask {display: none;transition: all .5s;}
.open #mask {display: block;position: fixed;top: 0;right: 0;width: 100%;height: 100%;opacity: .8;z-index: 101; }
}


/*====================
キービジュアル
=====================*/
.kv{width:100%; padding-top:100px; overflow-x:hidden;}
.kv h1{color:#B56D0A; font-size:33px; font-weight:900;position: absolute; top: 27%; left: 50%; transform: translateX(-50%);  }
.kv h1 span{ font-size:20px;position: absolute; top: -90%; left: 50%; transform: translateX(-50%);white-space: nowrap; font-weight:bold; width:100%;
    text-align: center;}
.kv h1 span:before{ content:""; width:100%; height:20px;position: absolute; bottom:-20px; left: 50%; transform: translateX(-50%); background-image:url(/image/kv-h1-bg.png); background-repeat:no-repeat;background-size: 100%;    background-position: center;}
.kv .copy{position:absolute; bottom:5vh; left:10vw; font-size:20px; color:#FFF; z-index:2; font-weight:bold;}
.kv .text-delicious{position:absolute; bottom:23vh; left:10vw;z-index:2;width:25%;}
.kv .text-delicious img{}
.kv .swiper-slide img{height:550px;  object-fit:cover; border-radius:40px;}


@media screen and (max-width: 768px) {
.kv{padding-top:70px;}
.kv .swiper-slide img{height:40vh; }
.kv .copy{ bottom:unset; top:50vh; font-size:20px; left:5vw;}
.kv .text-delicious{ bottom:unset; top:45vh;left:5vw; width:50%;}
}
/*====================
キービジュアル：波１
=====================*/

.wave-container1 {overflow: hidden; position:absolute; top:35vh; width:100%;}
.wave-container1 .wave-slider {width: 100%;  position: relative;}
.wave-container1 .waves {    display: flex;    width: 200%;    animation: slide var(--duration, 7s) linear infinite;}
.wave-container1 .wave {flex-basis: 50%;display: flex;align-items: center;}

@media screen and (max-width: 768px) {
.wave-container1 {top: 30vh;    }
.wave-container1 .wave {margin-left: -2px;}
}






/*====================
キービジュアル：波２
=====================*/

.wave-container2 {overflow: hidden;position: absolute;top: 65vh;width: 100%;z-index: 2;}
.wave-container2 .wave-slider {width: 100%;position: relative;}
.wave-container2 .waves {display: flex;width: 200%;animation: slide var(--duration, 10s) linear infinite;}
.wave-container2 .wave {flex-basis: 50%;display: flex;align-items: center;}


@keyframes slide {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}


@media screen and (max-width: 768px) {
.wave-container2 { top:43vh;}
.wave-container2 .wave {margin-left: -2px;}
}

/*=======  波１ フェードイン  =======*/
.wave-container1 {  opacity: 0;}
.wave-container1.isShow {  opacity: 1;animation: fadeIn 2s ease 0s 1 normal backwards;}


@keyframes fadeIn {
from {
    opacity: 0;
}
to {
    opacity: 1;
}
}

/*=======  波２ フェードイン  =======*/
.wave-container2 {  opacity: 0;}
.wave-container2.isShow {  opacity: 1;animation: fadeIn 2s ease 0s 1 normal backwards;}


@keyframes fadeIn {
from {
    opacity: 0;
}
to {
    opacity: 1;
}
}


/*=======  スワイパー フェードイン  =======*/
.swiper-container {  opacity: 0;}
.swiper-container.isShow {  opacity: 1;animation: fadeIn 1s ease 3.0s 1 normal backwards;}


@keyframes fadeIn {
from {
    opacity: 0;
}
to {
    opacity: 1;
}
}

/*=======  キャッチコピー フェードイン  =======*/
.kv .copy {  opacity: 0;}
.kv .copy.isShow {  opacity: 1;animation: fadeIn 2s ease 2s 1 normal backwards;}

.kv .text-delicious{ opacity: 0;}
.kv .text-delicious.isShow{opacity: 1;animation: fadeIn 2s ease 2s 1 normal backwards;}

@keyframes fadeIn {
from {
    opacity: 0;
}
to {
    opacity: 1;
}
}

/*====================
トップ：メッセージ
=====================*/
.top-message{ position:relative; z-index:2; margin-top:-80px; margin-bottom:60px; margin-right:auto; margin-left:auto; min-width:1100px; width:70%;}
.top-message .box{display:flex;align-items: center;}
.top-message .box .photo{width:60%;}
.top-message .box .item{width:40%; margin-left:-10%;}
.top-message .box .item h2{text-align:right; font-size:35px; font-style:italic; font-weight:bold; color:#FFF;}
.top-message .box .item .text{ background:#FFF; border-right:solid 5px #71B12C;border-bottom:solid 5px #71B12C; padding:30px; font-size:18px; font-weight:bold;}
.top-message .box .item .text span{color:#EE8A02; font-size:25px;font-weight:bold;}

@media screen and (max-width: 768px) {
.top-message{  margin-top:-80px; margin-bottom:60px; margin-right:auto; margin-left:auto; min-width:auto; width:100%; height:300px;}
.top-message .box{ position:relative;}
.top-message .box .photo{width:70%; position:absolute; left:0px; top:0px;}
.top-message .box .item{width:60%;  position:absolute; right:5%; top:20px; margin:0px;}
.top-message .box .item .text{margin-right:0%; font-size:14px;padding:15px;}
.top-message .box .item .text span{font-size:18px;}
.top-message .box .item h2{margin-right:10%; font-size:16px;}
}


/*====================
トップ：製品情報
=====================*/
.product-list{}




.product-list .box{display:flex;justify-content: space-between;align-items: baseline;flex-wrap: wrap; margin-top:60px;}
.product-list .box .item{ width:48%; margin-bottom:4%; border:solid 2px #71B12C;transition: 0.3s;}
.product-list .box .item .photo{}
.product-list .box .item h3{ padding:15px 0px; text-align:center; font-size:22px; font-weight:bold; position:relative; background:#71B12C; color:#FFF;transition: 0.3s}
.product-list .box .item h3:after{ content: "";position: absolute;bottom: 20px; transform: translateY(-53%);border-style: solid;  border-width: 7px 0px 7px 14px;border-color: transparent transparent transparent #FFF; margin-left:20px;}



.product-list .box .item:hover{border:solid 2px #EE8A02;transition: 0.3s}
.product-list .box .item:hover h3{background:#EE8A02;transition: 0.3s}

.product-list .box .item.orange{border:solid 2px #EE8A02 !important;}
.product-list .box .item.orange h3{background:#EE8A02;}

.product-list .box .item.orange:hover{border:solid 2px #71B12C !important;}
.product-list .box .item.orange:hover h3{background:#71B12C;}



.product-list .box.col3{justify-content: flex-start;}
.product-list .box.col3 .item{ width:32%; margin-bottom:4%; border:solid 2px #71B12C;transition: 0.3s; margin-right:1.3%; margin-bottom:2%;}
.product-list .box.col3 .item h3{font-size:16px;}
.product-list .box.col3 .item h3:after{bottom: 15px;}


@media screen and (max-width: 768px) {
.product-list .box .item{width:100%;}
.product-list .box .item h3{font-size:18px;}
.product-list .box{flex-direction: column;}
.product-list .box .item{ width:100%;  }
.product-list .box.col3 .item{ width:100%;margin-bottom:20px;}
.product-list h2{margin-top:20px;}
}
/*====================
レシピ
=====================*/
.recipe-list{ background:#FFF;}
.recipe-list .head img{object-fit:contain; height:auto;}
.recipe-list .foot{margin-top:80px;}
.recipe-list .foot img{object-fit:contain; height:auto;}
.recipe-list .box-intro{ display:flex;justify-content: space-between;height:320px; margin-top:80px;}
.recipe-list .box-intro .item:nth-child(1){ width:30%;display:flex;flex-direction: column;}
.recipe-list .box-intro .item:nth-child(1) h3{}
.recipe-list .box-intro .text{ background:#F4ECD3; color:#896B06;display:flex;align-items: center; margin-top:10px;    height: 100%; padding:0px 20px;font-weight:bold;}
.recipe-list .box-intro .item:nth-child(1) img{margin-top:-12%;}

.recipe-list .box-intro .item:nth-child(2){ width:68%; }
.recipe-list .box-intro .item:nth-child(2) img{object-fit:cover;object-position: bottom;height:320px;}

.recipe-list .box{display:flex;flex-wrap: wrap; margin-top:60px;}
.recipe-list .box .item{width:32%;margin-bottom:2%;}
.recipe-list .box .item{margin-right:2%;}
.recipe-list .box .item:nth-child(3n){margin-right:0px;}
.recipe-list .box .item .photo{overflow:hidden;}
.recipe-list .box .item .photo img{height:250px; object-fit:cover;transition:.3s;}
.recipe-list .box .item h3{background:#F4ECD3; position:relative; padding:15px 0px; text-align:center;transition:.3s; color:#71B12C;transition:.3s;}
.recipe-list .box .item h3:after{content:""; position:absolute; right:0px; bottom:0px;  border-left: 30px solid transparent;
    border-bottom: 30px solid #EE8A02;
    height: 0;
    width: 0;}
.recipe-list .box .item:hover h3{color:#71B12C;background:#71B12C; color:#FFF;transition:.3s}
.recipe-list .box .item:hover .photo img{
  transform:scale(1.1,1.1);
  transition:.3s
}

.recipe-list.bg-color{background:#F4ECD3;}
.recipe-list.bg-color .box .item h3{background:#FFF; }
.recipe-list.bg-color .box .item:hover h3{color:#FFF; background:#71B12C;}


@media screen and (max-width: 768px) {
.recipe-list .box-intro{flex-direction: column; height:auto;}
.recipe-list .box-intro .item:nth-child(1){width:100%;}
.recipe-list .box-intro .item:nth-child(2){width:100%; margin-top:20px;}
.recipe-list .box-intro .text{ display:flex;align-items: center; margin-top:0px;    height: 100%; padding:20px;}

.recipe-list .box{flex-direction: column; margin:60px 5% 0 5%;}
.recipe-list .box .item{width:100%; margin-bottom:20px; margin-right:0;}
.recipe-list .box .item:last-child{margin-bottom:0px;}
}



/*====================
トップ：品質管理情報
=====================*/
.top-quality{}
.top-quality .box{display:flex;justify-content: space-between;align-items: center;}
.top-quality .box .photo{width:55%;}
.top-quality .box .item{width:40%;}

@media screen and (max-width: 768px) {
.top-quality .box{flex-direction: column; }
.top-quality .box .photo{width:100%;margin:20px 0px;}
.top-quality .box .item{width:100%;}
}
/*====================
トップ：会社概要
=====================*/
.top-company{ margin-top:60px;}
.top-company .box{display:flex;justify-content: space-between;align-items: center;}
.top-company .box .photo{width:55%;}
.top-company .box .item{width:40%;}

@media screen and (max-width: 768px) {
.top-company .box{flex-direction: column;}
.top-company .box .photo{width:100%; margin-bottom:20px;}
.top-company .box .item{width:100%;}
}

/*====================
トップ：ニュース
=====================*/
.news-list{ padding-bottom:80px;}
.news-list .box{}
.news-list .box .item{padding-top:40px;}
.news-list .box .item ul{display:flex;flex-wrap: wrap; margin-bottom:40px; margin-left:10%;}
.news-list .box .item ul li{width:100%;  border-bottom:solid 1px #FFF;font-size:14px;transition:.3s;}
.news-list .box .item ul li a{display:block;padding-bottom:20px; padding-top:20px;}
.news-list .box .item ul li span{ display:inline-block; width:100px; color:#000;}
.news-list .box .item ul li .category{border:solid 1px #EE8A02; color:#EE8A02; padding:5px 6px; display:inline-block; margin-right:20px; border-radius:3px;line-height: 1; width:70px; text-align:center;}
.news-list .box .item ul li:hover{opacity: 0.5;transition:.3s;}
.news-list .box .item ul li a .text{width:100%; margin-top:10px;}

ul.sort{display:flex; margin-bottom:20px; line-height:1; font-size:14px;}
ul.sort li.title{ border-right:solid 2px #EE8A02; width:100px; margin-right:20px; background:none; border-radius:0px; color:#000;}
ul.sort li{border-radius:5px; background:#B5B5B5; margin-right:10px; color:#FFF;}
ul.sort li a{padding:5px; display:block;transition:.3s; }
ul.sort li a:hover{background:#71B12C;border-radius:5px;transition:.3s; }

@media screen and (max-width: 768px) {
.news-list .box .item ul{margin-left:0;}
.news-list .box .item ul li a{display:flex;flex-wrap: wrap;}
.news-list .box .item ul li span{width:100px;}
}

/*====================
ニュース
=====================*/
.news .box{ margin-top:60px;}
.news .box ul.head{display:flex;font-size:14px;}
.news .box ul.head li.date{ margin-right:20px;}
.news .box ul.head li.category{border:solid 1px #EE8A02; color:#EE8A02; padding:5px 6px; display:inline-block; margin-right:20px; border-radius:3px;line-height: 1; width:; text-align:center; }
.news h2{font-size:18px; color:#000; margin-top:20px;}
.news .content img{margin-top:20px;}
.news .content{margin-top:20px; margin-bottom:80px;}
/*====================
商品詳細
=====================*/
.product-detail{}

.product-detail h2{color:#EE8A02; font-size:25px; font-style:normal;margin-top:40px;}
.product-detail h2 br{display:none;}
.product-detail h3{ border-bottom:solid 1px #EE8A02; padding-bottom:5px; font-weight:bold; margin-bottom:10px;margin-top:60px;}
.product-detail p{}
.product-detail .note{margin-top:10px; font-size:12px;}
.product-detail table {width:100%;border-collapse: collapse;border:1px solid #EE8A02;}
.product-detail table th{width:14.28%; text-align:center; padding:5px;border:1px solid #EE8A02;}
.product-detail table td{text-align:center; padding:10px;border:1px solid #EE8A02; color:#EE8A02;}
.product-detail .box{display:flex;justify-content: space-between; margin-top:20px; line-height:1.6;flex-wrap: wrap;}
.product-detail .box .item{width:45%;}
.product-detail .box .item ul.eiyou{display:flex;flex-wrap: wrap;}
.product-detail .box .item ul.eiyou li{width:50%; }


.gallery {
  display: flex;
  margin-top: 60px;
  position: relative;
 padding-top: 430px;
 padding-left:20px;
 min-width:1100px; width:60%;
 margin-left:auto; margin-right:auto;
 
 overflow: hidden;
}
.gallery__item{margin-bottom:15px;}

.gallery__img {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  transition: opacity 0.5s ease-in-out;
  height:520px; object-fit:contain;
  background: #dcdcdc;
}
.gallery__thumb {
  padding-top: 6px;
  margin: 6px;
  display: block;
  width:60px;
    position: relative;
}
.gallery__thumb img{border:solid 1px #CECECE;z-index: 1; position:relative; height:60px; object-fit:cover;}

.gallery__selector {
  position: absolute;
  opacity: 0;
  visibility: hidden;
}
.gallery__selector:checked + .gallery__img {
  opacity: 1;
}
.gallery__selector:checked ~ .gallery__thumb > img {
  border:solid 1px #71B12C;
}

@media screen and (max-width: 768px) {
	
.product-detail h2{font-size:18px; margin-top:20px;}
.product-detail p{margin-top:10px;}
.product-detail .box{flex-direction: column; padding-bottom:40px;}
.product-detail .box .item{width:100%;}
.product-detail h3{margin-top:20px;}
.gallery{padding-top: 260px; padding-left:0;min-width:auto; width:100%;}
.gallery__img{height:260px;}
}


/*====================
レシピ詳細
=====================*/
.recipe-detail{ margin-top:60px;}
.recipe-detail h2{background:#EE8A02; color:#FFF; font-size:20px; padding:10px; font-style:normal; line-height:1;    display: inline-block; margin-top:50px;}
.recipe-detail h3{font-size:19px; padding-bottom:10px; font-style:normal; line-height:1;    margin-top:40px; border-bottom:solid 2px #71B12C;font-weight:bold;}
.recipe-detail .text{margin-top:20px;}
.recipe-detail .photo{min-width:1100px; width:60%; margin-left:auto; margin-right:auto;}
.recipe-detail .photo img{height:520px; object-fit:cover;}
.recipe-detail .box{display:flex;flex-wrap: wrap; margin-top:20px;}
.recipe-detail .box .item{width:32%; margin-right:2%;margin-bottom:2%;}
.recipe-detail .box .item img{transition: 0.3s;}
.recipe-detail .box .item:nth-child(3n){margin-right:0px;}
.recipe-detail .box .item:hover img{opacity:0.7;transition: 0.3s;}
.recipe-detail .more{margin-top:100px;}

@media screen and (max-width: 768px) {
.recipe-detail h2{font-size:16px; margin-top:20px;}
.recipe-detail .photo{width:100%; min-width:auto;}
.recipe-detail .photo img{ height:260px;}
.recipe-detail .box{justify-content: space-between;}
.recipe-detail .box .item{width:48%; margin-left:0; margin-right:0;}
.recipe-detail .more{margin-top:40px;}
}


/*====================
品質環境情報
=====================*/
.quality{}
.quality .index{ padding-bottom:100px;margin-top:80px;}
.quality .index .box{display:flex;justify-content: space-between; margin-bottom:80px;}
.quality .index .box:nth-child(even){flex-direction: row-reverse;}
.quality .box .photo{width:40%;}
.quality .box .photo img{object-fit:cover;}
.quality .box .item{width:55%;display:flex;flex-direction: column;justify-content: center;}
.quality .box .item .text{}
.quality .box .item .more a{margin-top:40px;width:180px;}

.quality .sdgs{ }
.quality .sdgs .photo{margin-top:-20%;}
.quality .sdgs h2{color:#CC131D; font-size:20px; border-bottom:solid 2px #71B12C; padding-bottom:5px; text-align:center; margin:80px auto 0 auto;width: max-content;}
.quality .sdgs .text{margin:40px 10% 40px 10%;}
.quality .sdgs .more a{margin-top:40px;width:240px;}

@media screen and (max-width: 768px) {
.quality .index{ padding-bottom:40px;margin-top:60px;}
.quality .index .box{flex-direction: column-reverse; margin-bottom:40px;}
.quality .index .box:nth-child(even){flex-direction: column-reverse;}
.quality .box .photo{width:100%; margin-top:40px;}
.quality .box .item{width:100%;}
.quality .box .item .more a{margin-top:0px;}
.quality .sdgs .photo img{object-fit:cover; height:215px;}
.quality .sdgs h2{font-size:18px;}
.quality .sdgs .text{margin:20px 0% 20px 0%;}
}
/*====================
安全への取り組み
=====================*/
.safety .box{padding-bottom:0px;display:flex;justify-content: space-between;flex-direction: row;margin-top:60px;}
.safety .box.index{flex-direction: row-reverse;}
.safety .box .photo{width:40%;}
.safety .box .photo img{object-fit:cover;}
.safety .box .item{width:55%;display:flex;flex-direction: column;justify-content: center;}
.safety .box .item .text{}
.safety .box .item .more a{margin-top:40px;width:180px;}

@media screen and (max-width: 768px) {
.safety .box.index{flex-direction: column-reverse; }
.safety .box .photo{width:100%; margin-top:20px; margin-bottom:20px;}
.safety .box .item{width:100%;}
}

/*====================
環境への取り組み
=====================*/
.sgds h2.sdgs{ position:relative;}
.sgds h2.sdgs::before{content:""; position:absolute; top:6px; left:-40px; background:url(/image/ic-sdgs.png) no-repeat; width:30px; height:30px; background-size:contain; }
.sgds .copy{color:#EE8A02; font-size:30px; text-align:center; font-weight:bold; }

.sgds .box{padding-top:0px;}
.sgds .box .item{width:48%;}
.sgds .box .photo{margin-bottom:40px;}
.sgds .box .text{margin:0 10%;}
.sgds .box.flex{display:flex;justify-content: space-between;}

.sgds .box2{margin-top: 40px;	margin-right: 12%;	margin-bottom: 40px;	margin-left: 12%;}
.sgds .box2 .photo{margin-bottom:40px; margin-top:40px;}
.sgds .photo-sdgs{display:flex;flex-wrap: wrap;justify-content: center; margin-top:40px;margin-bottom:40px; margin-left:15%; margin-right:15%; }
.sgds .photo-sdgs img{width:23.5%;  margin-right:2%; margin-bottom:10px;}
.sgds .photo-sdgs img:nth-child(4n){margin-right:0;}
.sgds .redline{ background:#CC131D; height:3px; margin-top:40px; margin-bottom:40px;}

.sgds .index{ margin-top:100px;}
.sgds .index .box{display:flex;justify-content: space-between; margin-bottom:0px;}
.sgds .index .box .photo{width:40%;}
.sgds .index .box .photo img{object-fit:cover;}
.sgds .index .box .item{width:55%;display:flex;flex-direction: column;justify-content: center;}
.sgds .index .box .item .text{margin:0px;}

@media screen and (max-width: 768px) {
.sgds .box .text{padding:20px 0 40px 0; margin-left:0; margin-right:0;}
.sgds .box2{margin:20px 0 20px 0;}
.sgds .photo-sdgs{margin:20px 0;}
.sgds .copy{font-size:20px;}
.sgds .box.flex{flex-direction: column;}
.sgds .box .item{width:100%; margin-top:40px;}
.sgds .box .item img{margin-top:20px;}
.sgds .index .box{flex-direction: column;}
.sgds .index .box .photo{width:100%;}
.sgds .index .box .item{width:100%;}
.sgds .index .box .item h2{margin-left:auto; margin-right:auto; text-align:center;}
.sgds .index .box .item .more{justify-content: center;}
}

/*====================
事業内容
=====================*/
.service{}
.service .intro{ margin:60px auto 60px auto;  text-align:center;}
.service .intro .copy{ font-size:20px; border-bottom:solid 2px #EE8A02; padding-bottom:5px; font-weight:bold;width: max-content;    margin-left: auto;margin-right: auto;}
.service .intro .copy span{ font-size:30px; color:#CC131D}
.service .intro .text{margin-top:20px;}

.service .index .box{ display:flex;justify-content: space-between; align-items: center;margin-top:60px;}
.service .index .box .photo{width:40%;}
.service .index .box .text{width:55%;}

.service .scene{ font-size:14px; color:#896B06;}
.service .scene .box{ display:flex;flex-wrap: wrap;}
.service .scene .box .item{width:48%; margin-right:4%;margin-top:60px;}
.service .scene .box .item:nth-child(2n){margin-right:0;}
.service .scene .box .photo{margin-top:10px; margin-bottom:10px;}

@media screen and (max-width: 768px) {
.service .intro{margin:30px auto 30px auto;}
.service .intro .copy{width:auto;padding-bottom: 30px;}
.service .intro .text{font-size:13.5px;}
.service .index .box{flex-direction: column; margin-top:40px;}
.service .index .box .photo{width:100%;}
.service .index .box .text{width:100%; margin-top:10px;}
.service .scene .box{flex-direction: column;}
.service .scene .box .item{width:100%; margin-right:0%;margin-top:20px;}
}

/*====================
会社概要
=====================*/
.company{}
.company .intro{ margin-top:20px; text-align:center; display:flex;justify-content: space-between;align-items: center;}
.company .intro .photo{width:48%;}
.company .intro .text{width:48%; padding-bottom:5px; text-align:left;  }
.company .intro .text .copy{font-size:30px; border-bottom:solid 2px #71B12C;color:#CC131D;font-weight:bold; }
.company .intro .text .copy2{font-size:18px; color:#EE8A02;font-weight:bold; margin-bottom:40px; }
.company .intro .text img{width:140px; height:auto;vertical-align: sub; margin-left:5px; margin-right:5px;}

.company .message{margin-top:-80px; margin-top:80px;margin-bottom:80px; margin-right:auto; margin-left:auto; min-width:1100px; width:70%;}
.company .message .box{display:flex;align-items: center;}
.company .message .box .photo{width:60%;}
.company .message .box .item{width:40%; margin-right:-10%;    position: relative;}
.company .message .box .item h2{text-align:left; font-size:35px; font-style:italic; font-weight:bold; color:#EE8A02;}
.company .message .box .item .text{ background:#FFF; border-right:solid 5px #71B12C;border-bottom:solid 5px #71B12C; padding:30px; font-size:18px;font-weight:bold;}
.company .message .box .item .text span{color:#EE8A02; font-size:25px; font-weight:bold;}

.company .law{display:flex;justify-content: space-between;align-items: center; margin:60px 0px;}
.company .law .photo{width:46%;}
.company .law .text{width:50%;}
.company .law .text li{margin-top:10px;}
.company .law .text li:first-child{margin-top:40px;}

.company h2{font-size:35px; color:#71B12C;} 

.company table{width:100%; padding:0px 0px 80px 0px; margin-top:40px;}
.company table th, .company table td{padding:20px 0px 20px 5px; vertical-align:middle;}
.company table th{width:20%; font-weight:normal;}
.company table tr{border-bottom: 1px solid #EE8A02;}
.company table tr:last-child{border-bottom: none;}
.company table a{color:#EE8A02;}
.company table a i{margin-left:5px;}

.company .factory{display:flex;justify-content: space-between;align-items: center; margin-top:40px;}
.company .factory .photo{width:40%;}
.company .factory .text{width:55%;}
.company .history{}
.company .history ul{margin-top:60px;}
.company .history ul li{padding-left:40px; padding-bottom:30px;  font-size:14px;position:relative; }
.company .history ul li.year{ font-size:30px; color:#B9D995; padding-bottom:10px;line-height:1; font-weight:bold;}
.company .history ul li.year::after{ content:"\f111";font-weight: 900;font-family: "Font Awesome 6 Free"; position:absolute; left:10px;    top: 11px;font-size:12px; color:#71B12C;}

.company .history ul li::before{ content:"";position:absolute; left:16px; width:1px; height:100%; background:#B9D995;}

.company .history ul li.year:first-child::before{top:15px; content:"";}
.company .history ul li.year:nth-last-child(2)::before{bottom:30px; content:"";}
.company .history ul li:last-child::before{content:none;}

@media screen and (max-width: 768px) {
.company .intro{flex-direction: column;}
.company .intro .photo{width:100%; margin-top:20px;}
.company .intro .text{width:100%; padding-bottom:5px; text-align:left;  }
.company .intro .text .copy{font-size:19px;}
.company .intro:first-of-type{margin-top:0;}
.company .message{  margin-top:40px; margin-bottom:0px; margin-right:auto; margin-left:auto; min-width:auto; width:100%; height:300px;}
.company .message .box{ position:relative;}
.company .message .box .photo{width:70%; position:absolute; right:0px; top:0px;}
.company .message .box .item{width:60%;  position:absolute; left:5%; top:20px; margin:0px;z-index: 1;}
.company .message .box .item .text{margin-right:0%; font-size:14px;padding:15px;}
.company .message .box .item .text span{font-size:18px; }
.company .message .box .item h2{margin-right:10%; font-size:16px;}
.company h2{font-size:20px;}
.company .intro .text .copy2{font-size:16px; margin-top:20px; margin-bottom:20px;}
.company .intro .text img{width:100px;}
.company .law{flex-direction: column;}
.company .law .photo{width:100%; margin-bottom:20px;}
.company .law .text{width:100%;}
.company .law .text li:first-child{margin-top:20px;}
.company table{margin-top:20px;}
.company table th, .company table td{ display:block; width:100%; }
.company table th{padding-top:10px; padding-bottom:5px;}
.company table td{padding-top:5px; padding-bottom:10px;}
.company .factory{flex-direction: column;}
.company .factory .photo{width:100%;}
.company .factory .text{width:100%; margin-top:20px;}
.company .history ul li.year{font-size:25px;}
.company .history ul li.year:nth-last-child(2)::before{bottom:22px;}
.company .history ul li.year::after{top:9px;}
}

/*====================
採用情報
=====================*/
.recruit .box{padding-bottom:0px;display:flex;justify-content: space-between;flex-direction: row;margin-top:60px;}
.recruit .box.index{flex-direction: row-reverse;}
.recruit .box .photo{width:40%;}
.recruit .box .photo img{object-fit:cover;}
.recruit .box .item{width:55%;display:flex;flex-direction: column;justify-content: center;}
.recruit .box .item .text{}
.recruit .box .item .more a{margin-top:40px;width:180px;}

@media screen and (max-width: 768px) {
.recruit .box{flex-direction: column-reverse !important;}
.recruit .box .photo{width:100%; margin-top:20px;}
.recruit .box .item{width:100%;}
}


/*====================
お問い合わせ
=====================*/
.contact{}
.contact table{width:100%; margin-top:60px;}
.contact table,.contact td,.contact th {
    border-collapse: collapse;
    border:1px solid #FFF;
    }
.contact th{width:25%;}
.contact td,.contact th{padding:20px;}
.contact .must{color:#EE8A02; margin-left:5px;}
.contact input[type="text"],.contact input[type="email"],textarea{ padding:10px; border-radius:5px; background:#FFF;width:100%;position:relative; }

.contact label:hover{cursor:pointer;}
.radio_btn input[type=radio].radio_btn_item{display: none;}
.radio_btn label {display: inline-block;}
.radio_btn .radio_btn_item + span {padding-left: 40px;display: inline-block;position: relative;}
.radio_btn .radio_btn_item + span::after,
.radio_btn .radio_btn_item + span::before {border-radius: 50%;content: '';display: block;position: absolute;background:#FFF;left: 0;top: 0;height: 25px;width: 25px;}
.radio_btn .radio_btn_item + span::after{background: #71B12C;height: 25px;left: 0px;opacity: 0;top: 0px;width: 25px;}
.radio_btn .radio_btn_item:checked + span::after {opacity: 1;}

.contact .btn{display:flex;justify-content: center;}
.contact input[type="submit"],.contact button[type="submit"]{transition:0.4s all;	font-size: 14px;padding-top: 10px;padding-bottom: 10px;border:solid 1px #EE8A02; color:#EE8A02; border-radius:15px;transition: 0.3s;width:100%; text-align:center;    padding-right: 20px;
}
.contact input[type="submit"]:hover,.contact button[type="submit"]:hover{color:#71B12C;border:solid 1px #71B12C; transition: 0.3s;}

.contact .submit-btn-wrap{overflow: hidden; width: 250px;  position:relative;	margin-top:60px; margin-left:auto; margin-right:auto;}
.contact .submit-btn-wrap:after{transition:0.4s all;content: "";position: absolute;top: 53%; transform: translateY(-53%);right:20px;border-style: solid;  border-width: 6px 0px 6px 12px;border-color: transparent transparent transparent #EE8A02; margin-left:0px;transition:.3s;pointer-events: none;}
.contact .submit-btn-wrap:hover:after{transition:0.4s all;border-width: 6px 0px 6px 12px;border-color: transparent transparent transparent #71B12C;}


.mw_wp_form_input .submit-btn-wrap:nth-child(2){display:none;}
.mw_wp_form_input .submit-btn-wrap:nth-child(3){display:none;}

.mw_wp_form_confirm .submit-btn-wrap:nth-child(1){display:none;}

.mw_wp_form_input .note-confirm{display:none;}

.mw_wp_form_confirm .note-input{display:none;}

@media screen and (max-width: 768px) {
.contact table th, .contact table td{ display:block; width:100%; }
.contact td,.contact th{padding:10px;}
.radio_btn{display:flex;flex-direction: column;}
.mw_wp_form .horizontal-item + .horizontal-item{margin-left:0; margin-top:10px;}
}

/*====================
Read more
=====================*/
.more{position:relative; border-radius:15px; display:flex; margin-top:20px; }
.more a{width:140px;border-radius:15px; padding:7px 0px 7px 25px; font-size:14px;    position: relative; }
.more.left { display:flex;}
.more.right {justify-content: flex-end;}
.more.center {justify-content: center;}

.more a.green{border:solid 1px #71B12C; color:#71B12C;transition:.3s;}
.more a.green:after{ content: "";position: absolute;top: 53%; transform: translateY(-53%); right:20px;border-style: solid;   border-width: 6px 0px 6px 12px;border-color: transparent transparent transparent #71B12C; margin-left:0px;transition:.3s;}

.more a.green:hover{border:solid 1px #EE8A02; color:#EE8A02;transition:.3s;}
.more a.green:hover:after{ border-color: transparent transparent transparent #EE8A02;transition:.3s; }


.more a.orange{border:solid 1px #EE8A02; color:#EE8A02;transition:.3s;}
.more a.orange:after{ content: "";position: absolute;top: 53%; transform: translateY(-53%);right:20px;border-style: solid;  border-width: 6px 0px 6px 12px;border-color: transparent transparent transparent #EE8A02; margin-left:0px;transition:.3s;}

.more a.orange:hover{border:solid 1px #71B12C; color:#71B12C;transition:.3s;}
.more a.orange:hover:after{ border-color: transparent transparent transparent #71B12C;transition:.3s; }


.more.left a.orange{border:solid 1px #EE8A02; color:#EE8A02;transition:.3s;padding:7px 0px 7px 45px; }
.more.left a.orange:before{ content: "";position: absolute;top: 53%; transform: translateY(-53%);left:20px;border-style: solid;  border-width: 6px 12px 6px 0px;border-color: transparent #EE8A02 transparent transparent; margin-left:0px;transition:.3s;}
.more.left a.orange:after{content:none;}

.more.left a.orange:hover{border:solid 1px #71B12C; color:#71B12C;transition:.3s;}
.more.left a.orange:hover:before{ border-color: transparent #71B12C transparent transparent; }

.more.left a.green{border:solid 1px #71B12C; color:#71B12C;transition:.3s;padding:7px 0px 7px 45px; }
.more.left a.green:before{ content: "";position: absolute;top: 53%; transform: translateY(-53%);left:20px;border-style: solid;  border-width: 6px 12px 6px 0px;border-color: transparent #71B12C transparent transparent; margin-left:0px;transition:.3s;}
.more.left a.green:after{content:none;}

.more.left a.green:hover{border:solid 1px #EE8A02; color:#EE8A02;transition:.3s;}
.more.left a.green:hover:before{ border-color: transparent #EE8A02 transparent transparent; }

@media screen and (max-width: 768px) {
}


/*====================
フッター
=====================*/
footer{ background-image:url(/image/footer-bg.png); background-repeat:no-repeat; background-size:100%; height:auto; color:#FFF; font-size:14px; line-height:1.2; font-feature-settings:normal;-webkit-font-feature-settings: "normal";    padding-top: 80px; margin-top:0px; }
footer .logo{position:absolute; width:180px; top:20px; left:0px;}
footer .box{display:flex;justify-content: space-between; padding-top:100px; padding-bottom:40px;}
footer .box .item:nth-child(1){width:40%;}
footer .box .item:nth-child(1) img{width:180px; margin-bottom:10px;}
footer .box .item:nth-child(1) .text:first-of-type{font-size:10px;}

footer .box .item:nth-child(2){width:55%; display:flex;justify-content: space-between;}
footer .box .item:nth-child(2) ul{width:30%;display:flex;justify-content: space-between;flex-direction: column;}
footer .box .item:nth-child(2) ul li{width:50%;}
footer .box .item:nth-child(2) ul:last-child{flex-direction: column;width:40%;}
footer .box .item:nth-child(2) ul:last-child li{white-space:nowrap; width:100%; text-align:center;}
footer .box .item:nth-child(2) ul:last-child li:last-child{margin-top:auto;}
footer .box .item .text{margin-bottom:20px;}
footer .box .item .text:last-child{margin-bottom:0px;}
footer a:hover{text-decoration:underline;}
footer a.toi{color: #71B12C;display: block;	background: #FFF;position: relative;	padding: 15px 10px 15px 60px; transition: 0.3s;  width:180px; border-radius:10px; border:solid 1px #CC131D; margin-left:auto; margin-right:auto; text-align:left;transition: 0.3s;}
footer a.toi:before{content:""; background:url(/image/ic-mail-red.svg) no-repeat;  width:30px;height:30px; position:absolute; left:15px; top:13px; background-size:100%;transition: 0.3s; }

footer a.toi:hover{transition: 0.3s; background:#71B12C; color:#FFF;}
footer a.toi:hover:before{background:url(/image/ic-mail-orange.svg) no-repeat; width:30px;height:30px;background-size: 100%;transition: 0.3s;}


footer .copyright{background:#CC131D; color:#FFF; padding:10px 0px; text-align:center; font-size:10px;}

@media screen and (max-width: 768px) {
footer{padding-top:40px;}
footer .box{flex-direction: column;}
footer .box .item:nth-child(1){width:100%;}
footer .box .item:nth-child(1) .text:first-of-type{font-size:12px;}
footer .box .item:nth-child(2){width:100%;flex-wrap: wrap;}
footer .box .item:nth-child(2) ul{width:50%;margin-top:20px;}
footer .box .item:nth-child(2) ul li{margin-top:20px;}
footer .box .item:nth-child(2) ul:last-child{width:100%;margin-top:20px;}
footer .box .item:nth-child(2) ul:last-child li:last-child{margin-top:20px;}

}
/*====================
部品
=====================*/
.swiper-container{position:relative; z-index:1;}
.swiper-button-next, .swiper-button-prev{width:30px; height:30px; border-radius:50%; background:#FFF; top:280px;}
.swiper-button-next{ right:10%;}
.swiper-button-prev{ left:10%;}
.swiper-button-next:after, .swiper-button-prev:after{content: "";position: absolute;width: 0px;height: 0px;border-style: solid;}
.swiper-button-next:after{    top: 50%;left: 55%;transform: translate(-55%, -50%);border-width: 7px 0px 7px 14px;border-color: transparent transparent transparent #71B12C;}
.swiper-button-prev:after{     top: 50%;left: 40%;transform: translate(-40%, -50%);border-width: 7px 14px 7px 0px;border-color: transparent #71B12C transparent transparent;}

@media screen and (max-width: 768px) {
.swiper-button-next, .swiper-button-prev{top:20vh;}
.swiper-wrapper{height:66vh;}
}


.bg-white{background:#FFF;}
.bg-cha{background:#F4ECD3;}
.mt40{margin-top:40px;}
.mt60{margin-top:60px;}
.mt120{margin-top:120px;}
.mb40{margin-bottom:40px;}
.mb60{margin-bottom:60px;}
.pb60{padding-bottom:60px;}
.row-reverse{flex-direction: row-reverse;}
.text-red{color:#CC131D;}
.text-orange{color:#EE8A02;}
.text-center{text-align:center;}

@media screen and (max-width: 768px) {
.mr5p-sp{margin-right:5%;}
.mt40{margin-top:20px;}
.mt60{margin-top:40px;}
.mb40{margin-bottom:20px;}
}
/*========================
ページトップ
=========================*/
#page_top a{width:40px; height:40px; transition:0.4s all; position: fixed; right:20px; bottom:20px; display:block; background:#FFF; border-radius:50%; color:#8ec21f; text-align:center; font-size:30px;line-height: 49px;  border:solid 1px #8ec21f;}
#page_top a img{position: absolute;	top: 50%;	left: 50%;	transform: translate(-50%, -50%);	width: 100%;	display: block;	transition: .4s ease-in-out;}
#page_top a i{line-height: 1.7;}

@media screen and (max-width: 768px) {
#page_top a{right:20px; bottom:20px;width:40px; height:40px;}
}


@media screen and (max-width: 768px) {
.pc{display:none !important;}
}

@media screen and (min-width: 769px) {
.sp{display:none !important;} 
}
