@charset "UTF-8";

/*fs*/

p {
  margin: 0;
}

/* common */

html {
  font-size: 62.5%;
  scroll-behavior: smooth;
}

body {
  color: #938b69;
  font-family: "Avenir", "Avenir Next W01", sans-serif;
  font-size: 1.5rem;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.05em;
  text-rendering: auto;
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

.cn {
  font-family: "Avenir", "Avenir Next W01", sans-serif, "PingFangSC-Regular";
}

.-serif {
  font-family: Baskerville, "Baskerville Old Face", "Hoefler Text", Garamond, "Times New Roman", "Microsoft YaHei", Helvetica, Arial, sans-serif;
}

.cn .-serif {
  font-family: "Microsoft YaHei", Helvetica, Arial, sans-serif;
}

a {
  color: #222;
  text-decoration: none;
}

a,
a img {
  -webkit-transition: 0.3s;
  transition: 0.3s;
}

a:hover,
a:hover img {
  opacity: 0.6;
  text-decoration: none;
}

h1,
h2 {
  font-weight: normal;
}

h1 {
  font-size: 1.5rem;
}

li {
  list-style: none;
}

.imgmax {
  display: block;
  height: auto;
  width: 100%;
}

.-pconly {
  display: none;
}

.-sponly {
  display: block;
}

/* contents */

.contents {
  width: 90%;
  margin: 0 auto;
}

.section {
  margin-bottom: 60px;
}

.mv_un {
  margin-bottom: 30px;
}

.mv_un__txst {
  color: #4a4019;
  margin-bottom: 30px;
  text-align: center;
}

.contents_three {
  display: grid;
  grid-gap: 5px;
  gap: 5px;
  grid-template-columns: repeat(3, 1fr);
}

.section_tit {
  color: #4a4019;
  font-size: 2.5rem;
  margin-bottom: 15px;
  padding-top: 60px;
  margin-top: -60px;
}

.section_un_line {
  max-width: 8%;
  margin-bottom: 15px;
}

.section_subtxst {
  margin-bottom: 30px;
}

.section_subtit {
  color: #4a4019;
  margin-bottom: 15px;
  font-weight: bold;
}

.philosophies {
  color: #4a4019;
  font-size: 1.8rem;
}

.philosophies_numbox li {
  list-style: decimal;
  list-style-position: inside;
  margin-left: 1.2em;
  text-indent: -1.2em;
  font-weight: bold;
}

.philosophies_numbox li:not(:last-child) {
  margin-bottom: 20px;
}

.philosophies_numbox li::marker {
  font-size: 1.8rem;
  font-family: Baskerville, "Baskerville Old Face", "Hoefler Text", Garamond, "Times New Roman", "Microsoft YaHei", Helvetica, Arial, sans-serif;
  font-weight: normal;
}

.grid_cont {
  display: grid;
  gap: 30px 0;
  grid-template-columns: repeat(1, 100%);
  margin-bottom: 30px;
}

.grid_cont__txst p:last-child {
  margin-bottom: 0;
}

.grid_cont .section_subtxst {
  margin-bottom: 0;
}

.grid_cont_sec {
  display: grid;
  gap: 30px 0;
  grid-template-columns: repeat(1, 100%);
}

.grid_cont_sec .section_subtxst {
  margin-bottom: 0;
}

.-companyhistory {
  background: url(../img/bg_companyhistory.jpg) no-repeat center / cover;
  padding: 10% 0;
}

.companygrid_cont {
  background: rgba(102, 67, 36, 0.7);
  color: #fff;
  padding: 10% 5%;
}

.-white {
  color: #fff;
}

.companyhistory_grid li:not(:last-child) {
  margin-bottom: 30px;
}

.companyhistory_grid__list {
  display: grid;
  gap: 30px 0;
  grid-template-columns: repeat(1, 100%);
}

.companyhistory_grid__list p:last-child {
  margin-bottom: 0;
}

.-border {
  display: flex;
  align-items: center;
}

.-border:after {
  border-top: 1px solid #d1d1d1;
  content: "";
  flex-grow: 1;
}

.-border:after {
  margin-left: 1rem;
}

.-bg_brown {
  padding: 2%;
  color: #fff;
  background-color: #4a4019;
}

.-staffcont {
  margin-top: 30px;
}

.txst_link {
  color: #938b69;
  text-decoration: underline;
}

.company_table {
  width: 100%;
}

.company_table {
  border-collapse: collapse;
}

.company_table td {
  color: #8e8e8e;
}
.company_table td,
.company_table th {
  padding: 15px;
  height: 25px;
  border: 1px solid #c6c6c6;
}
.company_table th {
  background: #fafafa;
  color: #4a4019;
  font-weight: normal;
  text-align: left;
  width: 32%;
}

.company_table thead td {
  background: #222;
  color: #fff;
}

.-center {
  text-align: center;
}

.brands_img {
  max-width: 30%;
  margin: 0 auto 25px;
}

.section_tit_small {
  font-size: 1.4rem;
  display: block;
  margin-bottom: 10px;
}

.-brands {
  background: url(../img/bg_brands.jpg) no-repeat center / cover;
  position: relative;
  margin-bottom: 0;
}

.brands_cont {
  color: #938b69;
  padding: 10% 5%;
}

.brands_right {
  position: absolute;
  top: -5%;
  max-width: 20%;
  right: 0;
}

.brands_left {
  position: absolute;
  top: -5%;
  max-width: 20%;
  left: 0;
}

.brands_grid__list {
  background: rgba(255, 255, 255, 0.65);
  display: grid;
  gap: 15px 0;
  grid-template-columns: repeat(1, 100%);
  padding: 5%;
}

.brands_grid__list .section_subtxst {
  margin-bottom: 0;
}

.-un_b {
  position: relative;
  margin-bottom: 15px;
  padding-bottom: 15px;
}

.-un_b:before {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0px; /*線の上下位置*/
  display: inline-block;
  width: 60px; /*線の長さ*/
  height: 0.5px; /*線の太さ*/
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%); /*位置調整*/
  background-color: #a69f7d; /*線の色*/
}

.slider_grid_img {
  margin-bottom: 15px;
}

.slider_grid .section_subtxst {
  margin-bottom: 0;
}

.slider_grid {
  display: grid;
  grid-template-columns: repeat(1, 100%);
  gap: 30px 0;
}

.message_cont {
  position: relative;
  color: #fff;
  color: #fff;
  padding-top: 90%;
}

.message_cont__txst {
  background: rgb(0, 0, 0);
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.5073529411764706) 0%, rgba(0, 0, 0, 0.7745098039215687) 14%, rgba(0, 0, 0, 1) 27%, rgba(0, 0, 0, 1) 100%);
  position: relative;
  padding: 5%;
}

.message_cont__img {
  position: absolute;
  padding-top: -5%;
  left: 0;
  top: 0;
  width: 100%;
  z-index: -1;
}

.mb_txstbox p:not(:last-child) {
  margin-bottom: 15px;
}

.-mb {
  margin-bottom: 30px;
}

.-right {
  text-align: right;
}

.name {
  margin-top: 25px;
}

.-squeezed {
  background: url(../img/bg_oil_sp.jpg) no-repeat center / cover;
  padding: 60px 0;
}

.-squeezed .slider_grid {
  display: grid;
  grid-gap: 5px;
  gap: 20px;
  grid-template-columns: repeat(3, 1fr);
  width: 900px;
}

.slider_grid_wrap {
  overflow-x: scroll;
}

.squeezed_cont {
  background: rgba(255, 255, 255, 0.5);
  padding: 10% 5%;
}

.-brown {
  color: #4a4019;
}

.-red {
  color: #800d0d;
}

.-making {
  background: url(../img/bg_cloth.jpg) no-repeat center / cover;
  padding: 10% 5%;
}

.making_img {
  padding-bottom: 30px;
}

.making_txstbox {
  background-color: #fff;
  padding: 10% 5%;
}

.making_txst li:not(:last-child) {
  margin-bottom: 20px;
}

.making_txst__list--tit {
  color: #4a4019;
  font-weight: bold;
  margin-bottom: 10px;
}

.making_txst__list--txst {
  color: #938b69;
}

.-policy {
  background: url(../img/bg_policy.jpg) no-repeat center / cover;
}

.section_img {
  margin-bottom: 30px;
}

.-flower {
  background: url(../img/bg_flower.jpg) no-repeat center / cover;
  padding: 10% 5%;
  margin-bottom: 50px;
}

.-flower .section_subtxst {
  color: #4a4019;
}

.-bg_brown_center {
  padding: 2%;
  color: #fff;
  text-align: center;
  background-color: #6c5808;
  font-weight: normal;
}

.macrobiotics_img {
  margin-bottom: 30px;
}

.-macrobiotics_txst {
  width: 90%;
  margin: 0 auto;
}

.-mt_line {
  border-top: 0.5px solid #dddddd;
  padding-top: 15px;
  margin-top: 15px;
}

.figure {
  margin-bottom: 60px;
  overflow: scroll;
  padding-left: 5%;
}

.-nuturition {
  margin-bottom: 60px;
}

.footer {
  background-color: #443e27;
  padding: 10% 5%;
  color: #fff;
}

.footer_store {
  margin-bottom: 40px;
}

.footer .section_subtit {
  color: #fff;
}

.footer_logo {
  width: 40%;
  margin: 0 auto;
  margin-bottom: 25px;
}

.copyright {
  text-align: center;
}

.brown-btn {
  max-width: 240px;
  margin: 0 auto;
  width: 100%;
}

.brown-btn--a {
  color: #fff;
  display: block;
  line-height: 1.3em;
  padding: 12px 5%;
  text-align: center;
  background: url(../img/w_arrow.svg) no-repeat 90% 70% / cover #6c5808;
  background-size: 34px 10px;
}

.-contact_btn {
  margin-bottom: 50px;
}

.-contact_btn .brown-btn--a {
  background: url(../img/w_arrow.svg) no-repeat 90% 70% / cover #6c5808;
  background-size: 34px 10px;
}

/* kv */
.kv {
  height: 100vh;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 2;
}

/* video */
.video {
  width: 100%;
  height: 100vh;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  z-index: -1;
}

.video .video_cont {
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
}

.header_nav_fix {
  width: 100%;
  background: rgba(34, 29, 7, 0.8);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9;
}

.header_nav {
  position: relative;
  height: 60px;
  padding: 0 4%;
}

.logo {
  height: auto;
  width: 130px;
}

.logo__a {
  display: inline-block;
  padding: 10px 0;
}

/*　ハンバーガーボタン　*/
.hamburger {
  display: block;
  position: fixed;
  z-index: 13;
  right: 13px;
  top: 12px;
  width: 42px;
  height: 42px;
  cursor: pointer;
  text-align: center;
}
.hamburger span {
  display: block;
  position: absolute;
  width: 30px;
  height: 1px;
  left: 6px;
  background: #fff;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}
.hamburger span:nth-child(1) {
  top: 10px;
}
.hamburger span:nth-child(2) {
  top: 20px;
}
.hamburger span:nth-child(3) {
  top: 30px;
}

/* ナビ開いてる時のボタン */
.hamburger.active span:nth-child(1) {
  top: 16px;
  left: 6px;
  background: #fff;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.hamburger.active span:nth-child(2),
.hamburger.active span:nth-child(3) {
  top: 16px;
  background: #fff;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  transform: rotate(45deg);
}

.globalMenuSp {
  position: fixed;
  top: 0;
  left: 0;
  color: #fff;
  background: rgba(0, 0, 0, 0.7);
  width: 100%;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.3s linear;
}

.globalMenuSp__list {
  margin: 0 auto;
  padding-top: 80px;
  padding-bottom: 40px;
  font-size: 1.4rem;
  width: 90%;
}

.nav-open {
  list-style-type: none;
  padding: 0;
  width: 100%;
  transition: 0.4s all;
}
.globalMenuSp__list li:last-child {
  padding-bottom: 0;
}

.globalMenuSp__list--a {
  display: block;
  color: #fff;
  padding: 10px 0;
  font-weight: bold;
  border-bottom: 0.5px solid #fff;
}

.globalMenuSp__list .nav-open a {
  color: #fff;
}

.globalMenuSp.active {
  pointer-events: auto;
  opacity: 1;
  z-index: 12;
}

.globalMenuSp__list-open {
  display: none;
}

.nav-open {
  color: #fff;
  position: relative;
}

.nav-open {
  background: url(../img/arrow_un.svg) no-repeat 95% center / 10px 10px;
}
.nav-open.active {
  background: url(../img/arrow_up.svg) no-repeat 95% center / 10px 10px;
}

.-openlink {
  margin-left: 3%;
  font-weight: normal;
}

/*====== 9-1-1 縦線が動いてスクロールを促す =======*/

/*スクロールダウン全体の場所*/
.scrolldown1 {
  /*描画位置※位置は適宜調整してください*/
  position: absolute;
  left: 50%;
  bottom: 10px;
  /*全体の高さ*/
  height: 50px;
}

/*Scrollテキストの描写*/
.scrolldown1 span {
  /*描画位置*/
  position: absolute;
  left: -15px;
  top: -15px;
  /*テキストの形状*/
  color: #eee;
  font-size: 0.7rem;
  letter-spacing: 0.05em;
}

/* 線の描写 */
.scrolldown1::after {
  content: "";
  /*描画位置*/
  position: absolute;
  top: 0;
  /*線の形状*/
  width: 1px;
  height: 30px;
  background: #eee;
  /*線の動き1.4秒かけて動く。永遠にループ*/
  animation: pathmove 1.4s ease-in-out infinite;
  opacity: 0;
}

/*高さ・位置・透過が変化して線が上から下に動く*/
@keyframes pathmove {
  0% {
    height: 0;
    top: 0;
    opacity: 0;
  }
  30% {
    height: 30px;
    opacity: 1;
  }
  100% {
    height: 0;
    top: 50px;
    opacity: 0;
  }
}

/* page-top */

.page-top {
  border: none;
  cursor: pointer;
  outline: none;
  padding: 0;
  appearance: none;
  position: fixed;
  right: 10px;
  bottom: 10px;
  z-index: 100;
  width: 44px;
  height: 44px;
  background-color: #938b69;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
}

.page-top::before {
  content: "";
  width: 12px;
  height: 12px;
  margin-bottom: -6px;
  border-top: solid 1px #fff;
  border-right: solid 1px #fff;
  transform: rotate(-45deg);
}

.page-top:hover {
  transform: scale(1.1);
}

.head_sns__list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding-bottom: 30px;
}

.head_sns__list li:not(:last-child) {
  margin-right: 5%;
}

.head_sns__list li {
  width: 28px;
}

.lang {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding-bottom: 30px;
  font-size: 1.6rem;
  position: relative;
}

.lang li:not(:last-child) {
  margin-right: 4%;
}

.lang li {
  width: 22px;
}

.lang li:first-child::before {
  content: "/";
  /*描画位置*/
  position: absolute;
  top: 0;
  left: 50%;
}

.lang__list--a {
  color: #fff;
}

/* swiper */

#Roasting {
  margin-bottom: 60px;
}

.cn #Roasting {
  margin-bottom: 80px;
}

#Roasting .swiper,
#nuturition .swiper {
  width: 90%;
}

#Roasting .swiper--wrapper,
#nuturition .swiper--wrapper {
  /* wrapperのサイズを調整 */
  width: 100%;
}

#Roasting .swiper-slide,
#nuturition .swiper-slide {
  width: 100%;
  height: auto;
  text-align: center;
  text-align: center;
}

#Roasting .swiper-slide__img,
#nuturition .swiper-slide__img {
  margin-bottom: 20px;
}

#Roasting .swiper-pagination-bullet-active,
#nuturition .swiper-pagination-bullet-active {
  background: #938b69 !important;
}

#Roasting .swiper-button-next:after,
#Roasting .swiper-button-prev:after,
#nuturition .swiper-button-next:after,
#nuturition .swiper-button-prev:after {
  background: #938b69 !important;
  font-size: unset !important;
}

#Roasting .swiper-button-prev:after,
#Roasting .swiper-button-next:after,
#nuturition .swiper-button-prev:after,
#nuturition .swiper-button-next:after {
  height: 45px !important;
}

#Roasting .swiper-button-next,
#Roasting .swiper-button-prev,
#nuturition .swiper-button-next,
#nuturition .swiper-button-prev {
  content: "";
  position: absolute;
  width: 30px;
  height: 30px;
  top: 45%;
  transform: translateY(-50%);
}

#Roasting .swiper-button-next:after,
#Roasting .swiper-rtl .swiper-button-prev:after,
#nuturition .swiper-button-next:after,
#nuturition .swiper-rtl .swiper-button-prev:after {
  color: #fff;
}

/* カスタマイズ */
/* 前へ次への矢印カスタマイズ */
#Roasting .swiper-button-prev,
#Roasting .swiper-button-next,
#nuturition .swiper-button-prev,
#nuturition .swiper-button-next {
  height: 50px;
  width: 40px;
}
/* 前へ次への矢印カスタマイズ */
#Roasting .swiper-button-prev:after,
#Roasting .swiper-button-next:after,
#nuturition .swiper-button-prev:after,
#nuturition .swiper-button-next:after {
  padding: 20%;
  background-repeat: no-repeat;
  background-size: contain;
  /* content: ""; */
  height: 50px;
  margin: auto;
  line-height: inherit !important;
}

#Roasting .swiper-button-prev:after,
#Roasting .swiper-button-next:after,
#nuturition .swiper-button-prev:after,
#nuturition .swiper-button-next:after {
  padding: 30%;
  color: #fff;
}

/* 前への矢印カスタマイズ */
#Roasting .swiper-button-prev:after,
#nuturition .swiper-button-prev:after {
  margin: 0 auto 0 0 !important;
  background-image: url(../img/arrow_brown.jpg);
}
/* 次への矢印カスタマイズ */
#Roasting .swiper-button-next:after,
#nuturition .swiper-button-next:after {
  margin: 0 0 0 auto !important;
  background-image: url(../img/arrow_brown.jpg);
}
/* 画像サイズ調整 */
#Roasting .swiper-slide img,
#nuturition .swiper-slide img {
  height: auto;
  width: 100%;
}

.swiper-horizontal > .swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom,
.swiper-pagination-fraction {
  bottom: 0 !important;
}

.swiper-button-next,
.swiper-rtl .swiper-button-prev {
  right: 0 !important;
}

.swiper-button-prev,
.swiper-rtl .swiper-button-next {
  left: 0 !important;
}

/* //swiper */

/* 無限スライダー */

/* スライドの動き等速 */
#Recipe {
  margin-top: 30px;
  margin-bottom: 60px;
}

#Recipe .slider .swiper-wrapper {
  transition-timing-function: linear;
}

#Recipe .slider li {
  margin-right: 2px;
}

#Recipe .swiper-slide {
  height: 239px !important; /* 高さを指定 */
  width: auto !important;
}

/* //無限スライダー */

/*Header テキストブロック*/

.product_list thead td {
  background: #f6f6f6;
  font-size: 1.1rem;
  font-weight: bold;
}

.product_list {
  overflow: visible;
}

.professional_sticky {
  position: sticky;
  top: 60px;
  background: url(../img/bg_professional_sp.png) no-repeat center top / 100%, url(../img/bg_fire.jpg) no-repeat 90% bottom / 50%;
  height: 500px;
  width: 100%;
  z-index: 1;
}

.professional {
  background: #000;
}

.professional_cont {
  padding: 15% 5% 5% 5%;
  margin-top: -300px;
  position: relative;
  z-index: 2;
  margin-bottom: 60px;
}

.-machines_img {
  width: 60%;
}

.professional_grid {
  margin-bottom: 60px;
}

.professional_grid li:not(:last-child) {
  margin-bottom: 30px;
}

.professional_grid__list {
  display: grid;
  gap: 30px 0;
  grid-template-columns: repeat(1, 100%);
}

.professional_grid__list p:last-child {
  margin-bottom: 0;
}

.-img_un {
  margin-bottom: 30px;
}

.footer_sns__list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding-bottom: 30px;
}

.footer_sns__list li:not(:last-child) {
  margin-right: 5%;
}

.footer_sns__list li {
  width: 28px;
}

.footer_sns_wrap {
  display: grid;
  grid-gap: 5px;
  gap: 5px;
  grid-template-columns: repeat(3, 1fr);
  margin-bottom: 0px;
}

.footer_sns_wrap__list--tit {
  text-align: center;
  margin-bottom: 20px;
  font-size: 1.1rem;
  line-height: 1.1rem;
}

/* 表 */

.list_cont {
  margin-bottom: 40px;
}

.list_cont .section_subtit {
  position: sticky;
  top: 60px;
  z-index: 8;
}

.product_list {
  display: grid;
  gap: 0px 0;
  grid-template-columns: repeat(1, 100%);
}

.wrap-txst {
  border: 1px solid #cdcdcd;
  padding: 10px;
}

.wrap-txst__txstbox p:not(:last-child) {
  margin-bottom: 15px;
}

.wrap-img {
  border: 1px solid #cdcdcd;
}

.wrap-img__list {
  display: grid;
  gap: 4px 2%;
  grid-template-columns: repeat(4, 23.5%);
  margin-bottom: 0px;
  padding: 10px;
}

.product_list_table {
  border-collapse: collapse;
  margin: 0 auto;
  border-spacing: 1px 0;
  height: 100%;
  width: 100%;
}

/*main tableブロック*/
.product_list_table tbody td {
  text-align: center;
  height: 50px;
  text-align: center;
  border: 1px solid #cdcdcd;
  width: 33%;
}

/* --リスト名ブロック */
.product_list_table tbody td:first-child {
  font-size: 1.5rem;
  text-align: center;
  padding: 10px 10px;
}

/* --1列目 */
.product_list_table tbody td:first-child {
  width: 30%;
}
/* --2列目 */
.product_list_table td:nth-child(2) {
  width: 30%;
}

/* --4列目 */
.product_list_table td:nth-child(4) {
}

/* --5列目 */
.product_list_table td:nth-child(5) {
}

.product_list_table tbody td {
  text-align: center;
  height: 50px;
  text-align: center;
  border: 1px solid #cdcdcd;
  width: 33%;
}

.rowspan4 {
  width: 50%;
}

.rowspan_non {
  width: 50%;
}

.table_color {
  background: #f6f6f6;
}

.-bold {
  font-weight: bold;
}

.wrap-img .mb_txstbox {
  padding: 10px;
}

/* //表 */

.video_wrap {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
  margin: 0 auto;
}

.video_wrap iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

.video_wrap {
  position: relative;
  text-align: center;
}

/* 続きを見る */

.wrapper {
  width: 640px;
  margin: 30px auto;
  font-size: 1.5rem;
  line-height: 1.5;
}

.text_wrapper {
  position: relative;
}

.text {
  height: 90px;
  overflow: hidden;
}

.show_more {
  position: absolute;
  bottom: 0px;
  left: 10px;
  width: calc(100% - 20px);
  height: 30px;
  line-height: 30px;
  background: linear-gradient(180deg, rgb(255, 255, 255, 0) 0%, rgb(255, 255, 255, 1) 70%);
  cursor: pointer;
  transition: bottom 0.2s;
  padding: 10% 0;
}

.show_more.active {
  position: relative;
  background: none;
  left: 0px;
  width: 100%;
  padding: 8% 0;
}

/* youtube再生 */

#video-background,
#video-overlay {
  position: relative;
  top: 0;
  left: 0;
  min-width: 100%;
  min-height: 100vh;
  width: auto;
  height: 100vh;
}

#video-overlay {
  z-index: -1;
  position: relative;
  display: none;
  top: 0px;
}

.video {
  display: none;
}

.video.active {
  display: block;
}

.video-container {
  width: 100%;
  height: 100vh;
  position: relative;
  margin-bottom: 60px;
}

#header {
  position: relative;
  /*ローディング画像などを表示す際の基点とするため指定*/
  height: 100vh;
  /*高さを全画面にあわせる*/
  text-align: center;
  color: #fff;
  /*ローディング画面時＆動画が表示されないときに表示する背景画像のレスポンシブ化*/
  background: url("../img/movie.jpg") no-repeat;
  background-size: cover;
}

/*jQueryで付与されたdisappearクラスがついたらロゴエリアを非表示*/

#loading.disappear {
  display: none;
}

/* youtube設定 */

#youtube-area {
  position: absolute;
  z-index: 1;
  /*最背面に設定*/
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  overflow: hidden;
  opacity: 0;
}

/*jQueryで付与されたappearクラスがついたらYoutubeエリアをふわっと表示*/
#youtube-area.appear {
  animation-name: PageAnimeAppear;
  animation-duration: 1s;
  animation-fill-mode: forwards;
}

@keyframes PageAnimeAppear {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

#over {
  height: 100vh;
  width: 100vw;
  margin-bottom: 60px;
  background: #000;
  z-index: -1;
  overflow: hidden;
}

#youtube {
  /*天地中央配置*/
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  /*縦横幅指定*/
  width: 177.77777778vh;
  /* 16:9 の幅→16 ÷ 9＝ 177.77% */
  height: 56.25vw;
  /* 16:9の幅 → 9 ÷ 16 = 56.25% */
  min-height: 110%;
  min-width: 110%;
  background: #000;
  z-index: -2;
}

/*youtubeがクリックされないためのマスク*/
#youtube-mask {
  position: absolute;
  z-index: 1;
  /*下から2番目に表示*/
  top: 0;
  width: 100%;
  height: 100%;
}

@media (min-width: 959px) {
  .-pconly {
    display: block;
  }

  .-sponly {
    display: none;
  }

  /* kv */
  .kv {
    min-width: 960px;
  }

  /* video */
  .video {
    min-width: 960px;
  }

  .section {
    margin-bottom: 80px;
  }

  .contents {
    width: 980px;
    margin: 0 auto 80px;
  }

  .mv_un {
    display: grid;
    gap: 0 4%;
    grid-template-columns: 43% 53%;
    margin-bottom: 40px;
    align-items: center;
    padding-top: 60px;
    margin-top: -60px;
  }

  .mv_un__txst {
    text-align: left;
    font-size: 2rem;
    line-height: 1.5;
  }

  .contents_three {
    display: grid;
    grid-gap: 5px;
    gap: 20px;
    grid-template-columns: repeat(3, 1fr);
  }

  .section_tit {
    font-size: 4rem;
  }

  .section_un_line {
    margin-bottom: 30px;
  }

  .section_subtit {
    font-size: 1.8rem;
  }

  .section_subtxst {
    font-weight: 100;
    margin-bottom: 60px;
  }

  .section_un_line {
    width: 41px;
  }

  /* .philosophies_numbox__list {
    grid-template-columns: 1% 93%;
  } */

  .grid_cont {
    display: grid;
    gap: 0 4%;
    grid-template-columns: 66% 30%;
    margin-bottom: 40px;
    align-items: center;
  }

  .grid_cont_sec {
    display: flex;
    flex-direction: row-reverse;
    align-items: end;
  }

  .grid_cont_sec li:first-child {
    width: 51%;
  }

  .grid_cont_sec li:nth-child(2) {
    width: 45%;
    margin-right: 4%;
  }

  .-block .block_firstcont {
    width: 51%;
  }

  .-block .block_seccont {
    width: 45%;
    margin-right: 4%;
  }

  .-companyhistory {
    background: url(../img/bg_companyhistory_pc.jpg) no-repeat center / cover;
    padding: 80px 0;
  }

  .companygrid_cont {
    width: 980px;
    margin: 0 auto;
    padding: 60px;
  }

  .companyhistory_grid__list {
    display: grid;
    gap: 0 4%;
    grid-template-columns: 33% 63%;
    margin-bottom: 40px;
    align-items: center;
  }

  .companygrid_cont {
    background: rgba(54, 33, 17, 0.5);
  }

  .-restaurant_grid {
    display: grid;
    gap: 0 3%;
    grid-template-columns: 46% 51%;
    margin-bottom: 60px;
  }

  .-restaurant_grid_sec {
    align-items: center;
  }

  .-restaurant_grid_sec .block_firstcont {
    width: 50%;
  }

  .-restaurant_grid_sec .block_seccont {
    width: 51%;
    margin-right: 4%;
  }

  .-staffcont {
    display: grid;
    gap: 0;
    grid-template-columns: 59% 41%;
    margin-bottom: 40px;
    margin-top: 60px;
    align-items: center;
  }

  .-contact_grid {
    display: grid;
    gap: 0 4%;
    grid-template-columns: 48% 48%;
    align-items: end;
  }

  .-leadership_grid {
    display: grid;
    gap: 0 4%;
    grid-template-columns: 56% 40%;
    margin-bottom: 40px;
    align-items: start;
  }

  .brands_img {
    width: 78px;
  }

  .section_tit_small {
    font-size: 1.8rem;
  }

  .brands_cont {
    width: 980px;
    margin: 0 auto;
    padding: 0%;
  }

  .brands_grid {
    padding: 5%;
    background: rgba(255, 255, 255, 0.65);
  }

  .brands_grid li {
    display: grid;
    gap: 0 4%;
    grid-template-columns: 48% 48%;
    align-items: center;
    padding: 0;
    background: none;
  }

  .brands_grid li:not(:last-child) {
    margin-bottom: 40px;
  }

  .brands_grid li:nth-child(2) {
    display: flex;
    flex-direction: row-reverse;
    align-items: start;
  }

  .brands_grid li:nth-child(2) p:first-child {
    width: 48%;
  }

  .brands_grid li:nth-child(2) p:nth-child(2) {
    width: 48%;
    margin-right: 0%;
  }

  .-titsimple {
    margin-bottom: 40px;
  }

  .section_subtxst.-txst_mb {
    margin-bottom: 15px;
  }

  #Roasting .swiper,
  #nuturition .swiper {
    width: 980px;
  }

  #Roasting .swiper-wrapper {
    display: grid !important;
    grid-gap: 5%;
    gap: 40px;
    grid-template-columns: repeat(3, 30%);
    margin-bottom: 60px;
  }

  #Roasting .swiper-button-next:after,
  #Roasting .swiper-rtl .swiper-button-prev:after,
  #nuturition .swiper-button-next:after,
  #nuturition .swiper-rtl .swiper-button-prev:after {
    display: none;
  }

  #Roasting .swiper-button-prev:after,
  #Roasting .swiper-rtl .swiper-button-next:after,
  #nuturition .swiper-button-prev:after,
  #nuturition .swiper-rtl .swiper-button-next:after {
    display: none;
  }

  #Roasting .swiper .section_subtxst,
  #nuturition .swiper .section_subtxst {
    margin-bottom: 0;
  }

  .message_cont__txst {
    width: 80%;
    top: 0;
    position: unset;
    background: none;
  }

  .message_cont__img img {
    display: none;
  }

  .message_cont {
    background: url(../img/bg_message_pc.jpg) no-repeat center / cover;
    padding-top: 0;
  }

  .message_cont__txst {
  }

  .squeezed_wrap {
    padding-top: 0;
  }

  .-squeezed {
    background: url(../img/bg_oil_pc.jpg) no-repeat center / cover;
    padding: 80px 0;
  }

  .-squeezed .slider_grid {
    max-width: 860px;
  }

  .squeezed_cont {
    width: 980px;
    margin: 0 auto;
    padding: 60px;
  }

  .-squeezed_grid {
    display: grid;
    gap: 0 4%;
    grid-template-columns: 31% 65%;
    margin-bottom: 40px;
    align-items: center;
  }

  .squeezed_wrap .section_tit {
    font-size: 3rem;
  }

  .slider_grid {
    display: grid;
    grid-gap: 5px;
    gap: 20px;
    grid-template-columns: repeat(3, 1fr);
  }

  .-making {
    padding: 60px;
    background: url(../img/bg_cloth_pc.jpg) no-repeat center / cover;
  }

  .-making .section_tit {
    margin-bottom: 40px;
  }

  .making_img {
    width: 680px;
    margin: 0 auto 60px;
    padding-bottom: 0;
  }

  .making_txstbox {
    width: 980px;
    margin: 0 auto;
    padding: 60px;
  }

  .making_txst {
    display: grid;
    gap: 0 2%;
    grid-template-columns: repeat(2, 49%);
  }

  .-un_b {
    margin-bottom: 30px;
    padding-bottom: 30px;
  }

  .-policy .section_subtxst {
    width: 700px;
    font-weight: 100;
    margin: 0 auto;
    padding-bottom: 60px;
  }

  .-policy .section_tit {
    padding-bottom: 40px;
  }

  .-policy_grid li:first-child {
    width: 40%;
  }

  .-policy_grid li:nth-child(2) {
    width: 56%;
    margin-right: 4%;
  }

  .professional_sticky {
    background: url(../img/bg_professional_pc.jpg) no-repeat top center / cover;
  }

  .professional_grid__list {
    display: grid;
    gap: 0 4%;
    grid-template-columns: 53% 43%;
    align-items: center;
    padding: 0;
    background: none;
  }

  .-sustainability_txst {
    width: 700px;
    margin: 0 auto 60px;
  }

  .-foodloss .section_subtxst {
    width: 650px;
    margin: 0 auto 60px;
  }

  .-foodloss .grid_cont .section_subtxst {
    width: 100%;
  }

  .-foodlossimg {
    width: 654px;
    margin: 0 auto 60px;
  }

  .-foodlossimg_sec {
    width: 654px;
    margin: 0 auto 60px;
    margin-bottom: 25px;
  }

  .-foodloss .grid_cont {
    display: grid;
    gap: 0 2%;
    grid-template-columns: repeat(2, 49%);
  }

  .-foodloss .grid_cont .section_subtxst {
    width: 100%;
  }

  .-foodloss .grid_cont p {
    width: 100%;
  }

  .-foodloss .grid_cont_sec p {
    width: 100%;
  }

  .-foodloss .grid_cont_sec li:first-child {
    width: 49%;
  }

  .-foodloss .grid_cont_sec li:nth-child(2) {
    width: 49%;
    margin-right: 2%;
  }

  .-foodloss .grid_cont {
    margin-bottom: 0;
  }

  .-foodloss .grid_cont .section_subtxst {
    margin-bottom: 0;
  }

  .-foodloss .grid_cont_sec .section_subtxst {
    margin-bottom: 0;
  }

  .-foodloss .grid_cont_sec {
    align-items: center;
  }

  .-macrobiotics .mb_txstbox {
    width: 654px;
    margin: 0 auto 40px;
  }

  .mb_txstbox p:not(:last-child) {
    margin-bottom: 15px;
  }

  .-macrobiotics_img {
    position: relative;
  }

  .-macrobiotics_txst {
    width: 40%;
    position: absolute;
    top: 10%;
    left: 5%;
  }

  .-macrobiotics_txst p {
    color: #fff;
    text-align: left;
  }

  .-macrobiotics_txst .brown-btn {
    margin: 40px auto auto 0;
  }

  .figure {
    width: 800px;
    margin: 0 auto 80px;
    padding-left: 0;
  }

  .-nuturition .swiper-wrapper {
    display: grid;
    gap: 0 2%;
    grid-template-columns: repeat(4, 23.5%);
    margin-bottom: 25px;
  }

  .-mt_line {
    margin-top: 0;
  }

  .footer {
    padding: 5%;
  }

  .footer__grid {
    display: grid;
    gap: 0 4%;
    grid-template-columns: 35% 61%;
    width: 980px;
    margin: 0 auto 40px;
  }

  .-contact_btn {
    margin: 0 auto 0 0;
  }

  .footer__grid .section_subtit {
    font-size: 1.4rem;
    margin-bottom: 10px;
  }

  .footer__grid .section_subtxst {
    margin-bottom: 16px;
    font-size: 1.3rem;
  }

  .footer_sns_wrap {
    margin-bottom: 50px;
    display: grid;
    grid-gap: 5px;
    gap: 5px;
    grid-template-columns: 20% 20% 20%;
    margin-bottom: 50px;
    justify-content: center;
  }

  .footer_store {
    margin-bottom: 0;
  }

  .footer_sns {
    width: 980px;
    margin: 0 auto;
  }

  .footer_sns_wrap__list {
    display: flex;
    flex-wrap: wrap;
  }

  .footer_sns__list {
    flex-wrap: nowrap;
    padding-bottom: 0;
  }

  .footer_sns_wrap__list--tit {
    margin-bottom: 0;
    margin-right: 20px;
  }

  .footer_sns_wrap__list {
    align-items: center;
    justify-content: center;
  }

  .footer_logo {
    width: 140px;
    margin-bottom: 15px;
  }

  /* sustainability */

  .-sustainabilityimg {
    width: 654px;
    margin: 0 auto 60px;
    /* //sustainability */
  }

  .-sustainability {
    margin-bottom: 0;
  }

  .-grows {
    margin: 0 !important;
    margin-bottom: 30px !important;
  }

  .-flower {
    margin: 0 auto 40px;
    width: 980px;
    padding: 60px;
  }

  .-bg_brown_center {
    padding: 1% 2%;
  }

  .-bg_brown {
    padding: 1% 2%;
    color: #fff;
    background-color: #6c5808;
    font-weight: normal;
  }

  .-pcleft {
    text-align: left;
  }

  .-september {
    display: grid;
    gap: 0 4%;
    grid-template-columns: 30% 66%;
    margin-bottom: 40px;
    align-items: start;
  }

  .-sustainability .section {
    margin-bottom: 40px;
  }
  .professional_cont {
    margin-top: -600px;
    width: 980px;
  }

  .-machines_img {
    width: 100%;
  }

  .-professional_txst {
    margin-bottom: 200px;
    width: 60%;
    font-size: 1.8rem;
    line-height: 1.5;
  }

  /* header */

  .pc_header_nav_fix {
    width: 100%;
    background: rgba(34, 29, 7, 0.8);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9;
  }

  .pc_header_nav {
    position: relative;
    height: 60px;
    padding: 0 4%;
  }

  .pc_logo {
    height: auto;
    width: 130px;
  }

  .pc_menu {
    display: flex;
    width: 80%;
    justify-content: end;
  }

  .pc_menu .menu_wrap {
    margin-right: 5%;
  }

  .pc_logo__a {
    display: inline-block;
    padding: 12px 0;
  }

  /* ヘッダーテスト */

  .menu {
    position: relative;
    width: 100%;
    height: 50px;
    max-width: 1000px;
    margin: 0 auto;
  }

  .menu > li {
    float: left;
  }

  .menu__single {
    line-height: 60px;
  }

  .--wide {
    line-height: 60px;
  }

  .menu > li a {
    display: block;
    text-align: center;
    font-size: 1.3rem;
    cursor: pointer;
  }
  .init-bottom {
    color: #fff;
  }

  .menu__second-level__a {
    line-height: 1.2;
    padding: 8%;
    font-weight: 100;
  }

  .-bold {
    font-weight: bold;
  }

  .menu {
    display: flex;
  }

  .menu__single {
    width: 20%;
  }

  .--wide {
    width: 30%;
  }

  ul.menu__second-level {
    visibility: hidden;
    opacity: 0;
    z-index: 1;
  }

  ul.menu__third-level {
    visibility: hidden;
    opacity: 0;
  }

  ul.menu__fourth-level {
    visibility: hidden;
    opacity: 0;
  }

  .menu > li:hover {
    /* background: #072a24; */
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
  }

  .menu__second-level li {
  }

  .menu__third-level li {
    border-top: 1px solid #111;
  }

  .menu__second-level li a:hover {
    /* background: #111; */
  }

  .menu__third-level li a:hover {
    /* background: #2a1f1f; */
  }

  .menu__fourth-level li a:hover {
    /* background: #1d0f0f; */
  }

  /* floatクリア */
  .menu:before,
  .menu:after {
    content: " ";
    display: table;
  }

  .menu:after {
    clear: both;
  }

  .menu {
    *zoom: 1;
  }

  .menu > li.menu__single {
    position: relative;
  }

  li.menu__single ul.menu__second-level {
    position: absolute;
    top: 40px;
    width: 100%;
    background: #d7d5cc;
    padding: 10px;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
  }

  li.menu__single:hover ul.menu__second-level {
    top: 50px;
    visibility: visible;
    opacity: 1;
  }

  .pc_header_nav {
    display: flex;
    justify-content: space-between;
  }

  .menu_wrap {
    width: 70%;
  }

  .pc_header_nav_fix .sns_wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    width: 20%;
  }

  .pc_header_nav_fix .sns_wrap {
    width: 100%;
  }

  .flex_sns_wrap {
    display: flex;
    width: 15%;
  }

  .sns_wrap_list {
    width: 20px;
  }

  .sns_wrap li:first-child {
    margin-right: 10px;
  }

  .pc_lang {
    display: flex;
    /* flex-wrap: wrap; */
    justify-content: center;
    padding-bottom: 0px;
    align-items: center;
    /* font-size: 1.8rem; */
    position: relative;
  }

  .pc_lang li:not(:last-child) {
    margin-right: 5%;
  }

  .pc_lang li:first-child a {
    margin-right: 15px;
  }

  .pc_lang li:first-child::before {
    content: "/";
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(0%, -50%);
  }

  .pc_lang__list--a {
    color: #fff;
  }

  .menu__second-level__a {
    color: #4a4019;
  }

  .-lh {
    line-height: 1;
  }

  .video_wrap {
    position: relative;
    text-align: center;
  }

  .video_wrap_pd {
    padding: 0 15%;
  }

  /* 表 */

  #Recipe {
    margin-top: 0;
  }

  .product_list_table td:nth-child(2) {
    width: 30%;
  }

  .product_list_table tbody td:last-child {
    width: 33%;
  }

  .product_list {
    display: grid;
    gap: 0;
    grid-template-columns: 45% 33% 22%;
  }

  .wrap-img__list {
    display: grid;
    gap: 4px 2%;
    grid-template-columns: repeat(2, 49%);
    margin-bottom: 0px;
    padding: 10px;
  }

  .list_cont {
    margin-bottom: 50px;
  }

  .table_color {
    width: 40%;
  }

  .text_wrapper {
    position: unset;
    margin-bottom: 0;
  }
  .text {
    height: auto;
  }

  .show_more {
    display: none;
  }

  /* //表 */

  .lang {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding-bottom: 30px;
    font-size: 1.8rem;
    position: relative;
  }

  .lang li:not(:last-child) {
    margin-right: 4%;
  }

  .lang li {
    width: 26px;
  }

  .lang li:first-child::before {
    content: "/";
    /*描画位置*/
    position: absolute;
    top: 0;
    left: 50%;
  }
}

@media (min-width: 768px) {
}

@media (max-width: 414px) {
}

@media (max-width: 375px) {
}

@media (max-width: 360px) {
}

@media (max-width: 320px) {
}

#header {
  position: relative;
  /*ローディング画像などを表示す際の基点とするため指定*/
  height: 100vh;
  /*高さを全画面にあわせる*/
  text-align: center;
  color: #fff;
  /*ローディング画面時＆動画が表示されないときに表示する背景画像のレスポンシブ化*/
  background: url("../img/movie.jpg") no-repeat;
  background-size: cover;
}

/*jQueryで付与されたdisappearクラスがついたらロゴエリアを非表示*/

#loading.disappear {
  display: none;
}

/* youtube設定 */

#youtube-area {
  position: absolute;
  z-index: 1;
  /*最背面に設定*/
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  overflow: hidden;
  opacity: 0;
}

/*jQueryで付与されたappearクラスがついたらYoutubeエリアをふわっと表示*/
#youtube-area.appear {
  animation-name: PageAnimeAppear;
  animation-duration: 1s;
  animation-fill-mode: forwards;
}

@keyframes PageAnimeAppear {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

#over {
  height: 100vh;
  width: 100vw;
  margin-bottom: 60px;
  background: #000;
  z-index: -1;
  overflow: hidden;
}

#youtube {
  /*天地中央配置*/
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  /*縦横幅指定*/
  width: 177.77777778vh;
  /* 16:9 の幅→16 ÷ 9＝ 177.77% */
  height: 56.25vw;
  /* 16:9の幅 → 9 ÷ 16 = 56.25% */
  min-height: 110%;
  min-width: 110%;
  background: #000;
  z-index: -2;
}

/*youtubeがクリックされないためのマスク*/
#youtube-mask {
  position: absolute;
  z-index: 1;
  /*下から2番目に表示*/
  top: 0;
  width: 100%;
  height: 100%;
}