@charset "UTF-8";
/*
* this css file is main css.
* this style are using for indivisual projects.
*
*/


/*=====================
* modules
=======================*/
body {
  letter-spacing: 2px;
  font-family: "Noto Sans JP", "游ゴシック", "ヒラギノ角ゴ ProN W3", "メイリオ", sans-serif;
  font-optical-sizing: auto;
  font-weight: 200;
  font-style: normal;
  line-height: 1.6;
  transition: all 0.3s ease;
}
section {
  margin-bottom: 60px;
}
.paragraph-50 {
  width: 50%;
}
.wp-block-file__button.wp-element-button {
  background-color: var(--primary-color);
}
.ta-r {
  text-align: right;
  margin-left: auto;
  justify-content: flex-end;
}
@media screen and (max-width:1180px) {
  .paragraph-50 {
    width: 70%;
  }
}
@media screen and (max-width:768px) {
  body {
    padding-bottom: 300px;
  }
  .paragraph-50 {
    width: 100%;
  }
}
/*--------
* width
--------*/
.w72 {
  width: 72%;
  margin: 0 auto;
}

/*--------
* col
--------*/
.col2-7030 > .item { 
  width: 30%;
}
.col2-7030 > .item:first-child { 
  width: calc(70% - 1em);
}
.col-sns-icon > .item.instagram {
  margin-top: 18px;
  width: 28px;
}
.col-sns-icon > .item.instagram .insta-link {
  opacity: 0.4;
}
.col-sns-icon > .item.instagram .insta-link:hover {
  opacity: 1;
}
@media screen and (max-width:768px) {
  .col-sns-icon {
    margin-bottom: 2em;
  }
  .col-sns-icon > .item.instagram {
    width: 28px !important;
  }
}

/*--------
* link-lv1
--------*/
.link-lv1 {
  text-align: right;
}
.link-lv1 .inner,
.link-lv1.icon {
  color: var(--primary-color);
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.link-lv1 .inner::after,
.link-lv1.icon::after {
  content: "";
  background-image: url('../../common/images/icon_arrow.svg');
  width: 32px;
  height: 32px;
  margin-left: 4px;
}
/*
.link-lv1 .inner:hover {
  background-color: rgba(var(--primary-color-rgb), 0.4);
}
*/
footer,
footer > .footer {
  background-color: var(--def-white);
}
footer > .footer {
  padding: 2em 0;
}
footer > .footer > .copyright {
  color: var(--def-black);
}
.page_top {
  background-color: rgba(var(--def-gray-dark-rgb), 0.5);
}

@media screen and (max-width:1239px) {
  .inner {
    padding: 0 1.8em;
  }
}
/*--------
* link-lv2
---------*/
.link-lv2 > a {
  display: flex;
  align-items: center;
  font-size: 0.8em;
}
.link-lv2 > a::after {
  content: "";
  width: 0.6em;    /* くの字を山なりに見た時、左側の長さ */
  height: 0.6em;   /* くの字を山なりに見た時、右側の長さ */
  border-top: 1px solid var(--primary-color);     /* くの字を山なりに見た時、左側の太さと色 */
  border-right: 1px solid var(--primary-color);   /* くの字を山なりに見た時、右側の太さと色 */
  transform: rotate(45deg);   
  line-height: 0;
}




/*-- animation class --*/
.relative_items > li.notactive{
  display:none;
  transition: all .7s;
  animation: fade-out .7s linear 0s;
}
@keyframes fade-out {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/*=====================
* front-page
=======================*/
/*----------
* main-visual
----------*/
#top section#main-visual {
  padding-top: 0;
  margin-bottom: 0;
}
#top section#main-visual .col2 {
  margin-bottom: 0;
}
#top section#main-visual .col2 .item.main-visual-image {
  width: 50%;
}
#top section#main-visual .page-logo {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50%;
}
#top section#main-visual .page-logo .main-logo {
  max-width: 182px;
}
@media screen and (max-width:1180px) {
  #main-visual .col2 {
    position: relative;
  }
  #main-visual .col2 .item.main-visual-image {
    width: 100% !important;
  }
  #main-visual .col2 .item.page-logo {
    position: absolute;
    bottom: -39px;
    right:1em;
    z-index: 1;
    justify-content: end !important;
    width: 100%;
  }
}
@media screen and (max-width:768px) {
}

/*---------
* news
----------*/
#news .hdg_lv2 {
  font-size: 1.2em;
  margin: 0 1.8em 0 0;
}
#news .hdg_lv2:after {
  content: none;
}
.news-title {
  width: 9em;
}
.box-line {
  display: flex;
  align-items: flex-start;
  border: 1px solid var(--def-gray-hightlight);
  border-radius: 0.8em;
  padding: 2em 4em;
  width: 80%;
  margin: 0 auto;
}
.news-list {
  width: calc(100% - 10.2em);
}
.news-list .item {
  margin-bottom: 0.8em;
  padding-bottom: 0.4em;
  border-bottom: 1px dotted var(--def-gray-hightlight);
}

@media screen and (max-width:768px) {
  .box-line {
    display: block;
    padding: 1em 1.8em;
    width: calc(100% - 3.6em);
  }
  .news-title {
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin-bottom: 1.2em;
  }
  .news-title .hdg_lv2,
  .news-title .link-lv2 {
    margin: 0;
  }
  .news-list {
    width: 100%;
  }
}

/*----------
* vegitable-photo
----------*/
.col3.vegitable-photo {
  flex-wrap: wrap;
  margin-top: 3em;
  margin-bottom: 0;
}
.col3.vegitable-photo .item {
  width: 33.3333%;
  padding: 0;
  margin: 0;
  line-height: 0;
}
@media screen and (max-width:768px) {
  .col3.vegitable-photo .item {
    width: 50%;
  }
}

/*---------
* philosophy
--------*/
#philosophy .hdg_lv2 {
  text-align: center;
  display: block;
}
#philosophy .hdg_lv2::after {
  left: 50%;
  transform: translateX(-50%);
}
/*----- particulars -----*/
.col2.particulars {
  justify-content: center;
}
.col2.particulars .item {
  text-align: center;
}
.col2.particulars .item .hdg_lv3,
.hdg_lv3.particulars {
  display: block;
  border: 0;
  margin-top: 2em;
  padding: 0;
}
.col2.particulars .item .particulars-paragraph {
  width: 72%;
  padding: 0;
  margin: 0.8em auto;
  text-align: left;
}

@media screen and (max-width:768px) {
  #philosophy {
    margin-bottom: 30px;
  }
  .col2.particulars {
    display: block;
  }
  .col2.particulars .item {
    width: 100%;
  }
  .col2.particulars .item .particulars-paragraph {
    width: 100%;
  }
}


/*---------
* contact
-----------*/
#contact .col2 {
  justify-content: space-between;
}
@media screen and (max-width:1180px) {
  #contact,
  #contact .col2 {
    margin-bottom: 0;
  }
}
@media screen and (max-width:768px) {
  #contact .col2 {
    display: block;
  }
  #contact .col2 .item {
    width: 100%;
  }
}

/*=====================
* page
=======================*/
/*--------
* hdg_lv2
---------*/
.hdg_lv2 {
  font-weight: 300;
  font-size: 1.6em;
  color: var(--primary-color);
  display: inline-block; /* 必須：文字数分だけに適用 */
  position: relative;
  padding-left: 0;
  margin-bottom: 0.6em;
}
.hdg_lv2::after {
  content: ""; /* 空の内容 */
  display: block;
  width: 62px; /* 親要素(h1)の幅に合わせる */
  height: 2px; /* 線の太さ */
  background-color: var(--primary-color); /* 線の色 */
  position: absolute;
  bottom: -18px; /* 文字の下に間隔を設定 */
  left: 0;
}
/*--------
* hdg_lv3
---------*/
.hdg_lv3 {
  font-weight: 300;
  font-size: 1.28em;
  line-height: 1.4;
  color: var(--primary-color);
  display: inline-block; /* 必須：文字数分だけに適用 */
  padding-left: 10px;
  margin-bottom: 0.6em;
  border-left: 2px solid var(--primary-color);
}


/*=====================
* header
=======================*/
header {
  display: block;
  opacity: 1;
  margin: 0;
}
header .header-inner {
  margin-top: 20px;
  margin-bottom: 60px;
}
header .main-logo {
  max-width: 182px;
  margin: 0 auto;
}
header > .title {
  float: inherit;
  width: 100%;
}

@media screen and (max-width: 768px) {
  header .header-inner {
    margin-bottom: 30px;
  }
}



/********************************************************
*
* archive
*
********************************************************/
#archive .news-list {
  margin-top: 3em;
  width: 100%;
}
#archive .news-list .item .hdg_lv3 {
  border: 0;
  color: var(--def-black);
  font-size: 1em;
  margin: 0;
}

/********************************************************
*
* single
*
********************************************************/
.inner_head time {
  display: block;
  margin: 1em 0;
}
.content_inner {
  margin-top: 60px;
}
.main-visual.vegetable-photo {
  margin: 0 auto;
  width: 60%;
}
#single .hdg_lv2::after {
  content: none;
}

@media screen and (max-width: 768px) {
  .content_inner {
    margin-top: 30px;
  }
  .main-visual.vegetable-photo {
    margin: 0 auto;
    width: 100%;
  }
}