@charset "UTF-8";


/*------------------------------------------*/
/*全体の設定*/
/*------------------------------------------*/
* {box-sizing: border-box;}

html{font-size:62.5%}

body{
    line-height:150%;
    letter-spacing: 0.1em;
    font-family:"Zen Kaku Gothic New", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; 
    font-size:1.5em;
    color:#36312F;
    font-weight: 500;
    font-style: normal;
}

/*コンテナー*/
#container_top{
}
#container_cnt{
}

/*段落*/
section p{
    line-height:160%;
    margin-bottom:1em;
}


/*------------------------------------------*/
/*エフェクト*/
/*------------------------------------------*/
/*ローディング*/
#loading {
  width: 100vw;
  height: 100vh;
  transition: all 1s;
  background-color: #E8D8CB;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
}
.spinner {
  width: 50px;
  height: 50px;
  margin: 45% auto;
  background-color: #fff;
  border-radius: 100%;
  animation: sk-scaleout 1.0s infinite ease-in-out;
}
.loaded {
  opacity: 0;
  visibility: hidden;
}
/* ローディングアニメーション */
@keyframes sk-scaleout {
  0% {
    transform: scale(0);
  } 100% {
    transform: scale(1.0);
    opacity: 0;
  }
}


/*ふわっと*/
@keyframes fadein {
from {
    opacity: 0;
    transform: translateY(20px);
}
to {
    opacity: 1;
    transform: translateY(0);
}
}
.e_fade{
    animation-name: fadein;
    animation-duration: 2s;
    animation-iteration-count: 1;
}

/*------------------------------------------*/
/*ボタン*/
/*------------------------------------------*/
/*ボタン01*/
.button01 {
  display: flex;
  gap: 8px;
  align-items: center;
  width: 100%;
  max-width: 400px;
  height: 64px;
  padding: 8px 64px 8px 8px;
  font-size: 1.7rem;
  color: #fff;
  text-align: center;
  overflow-wrap: anywhere;
  background-color: #DA8A51;
  border-radius: 32px; /* (buttonの高さ / 2) の値 */
}
.button01__reverse {
  flex-direction: row-reverse;
  padding: 8px 8px 8px 64px;
}
.button01_icon {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 56px;
  aspect-ratio: 1;
  overflow: hidden;
}
.button01_text {
  flex-shrink: 1;
  width: 100%;
}
@media (any-hover: hover) {
  .button01 {
    transition: background-color 0.2s;
  }
  .button01_icon {
    transition: transform 0.2s;
  }
  .button01:hover {
    background-color: #D07F44;
  }
  .button01:hover .buttonIconText02_icon {
    transform: translateX(4px);
  }
  .button01:hover .buttonIconText02_icon__left {
    transform: translateX(-4px);
  }
}
.iconArrowLeft {
  rotate: 180deg;
}
/*------------------------------------------*/
/*例外フォント*/
/*------------------------------------------*/

/*色がgreenで太め*/
.color_green{
    color:#5A8D4F;
    font-weight: bold;
}

/*size*/
.fsize_s{
    font-size:x-small;
}

/*------------------------------------------*/
/*行揃え*/
/*------------------------------------------*/
.align_c{text-align: center;}
.align_r{text-align:right;}
.align_l{text-align:left;}

/*------------------------------------------*/
/*リンク*/
/*------------------------------------------*/
/*リンク*/
a{
    text-decoration: none;
    color:#5A8D4F;
}
main p a{
    text-decoration: none;
    color:#5A8D4F;
    border-bottom:2px solid rgba(248,201,192,1.00)
}
main p a:hover{
    border-bottom:2px solid rgba(248,201,192,0.80)
}

.linkBorder_none a,.linkBorder_none a:hover{
    border-bottom:0 none;
}

/*------------------------------------------*/
/*flex*/
/*------------------------------------------*/
/*普通の2段レイアウト*/
.flex01{
    display: flex; justify-content: space-between;
}
.flex01 .flex_box01{
    margin:auto;
}

.flex02{
    display: flex; justify-content:center;
}
.flex02 .flex_box01{
    margin:0 5em;
}
.flex02 .flex_box02{
    flex-wrap: nowrap;
}

@media screen and (max-width: 768px) {
.flex01,.flex02{
    display: block;
}
.flex_box01,.flex_box02{
    margin:0 0 0.5em 0;
}
}

/*------------------------------------------*/
/*ヘッダ*/
/*------------------------------------------*/

header{
    background:#fff;
    padding:0 2%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/*----------ロゴ----------*/
#logo{
    padding:15px 0;
    height:90px
}
#logo img{
    height: 100%;
}
@media screen and (max-width: 920px) {
#logo{height:65px;padding:10px 0;}
}

/*----------メインナビ----------*/

.menu ul,.menu li{
    display: inline-block;
}
.menu li{
    padding:0 1.5em 0 0em;
    font-weight:500;
    list-style: none;
}
.menu li:last-child{
    padding:0;  
}
.menu_button{
    display: none;
}

nav li a{
    text-decoration: none;
    color:#36312F;
}
nav li a:hover{
    color:#7B7572;
}
nav#nav_main{
    font-size:1.4rem;
}
nav#nav_sns{
    z-index:100;
    background:#E8D8CB;
    padding:0.7em;
    position:absolute;
    top:70px;
    right:2%;
    font-size:1.2rem;
    border-radius: 20px;
}
nav#nav_sns li{
    border-right:1px solid #fff;
    padding:0 1em 0 1em;
}
nav#nav_sns li:last-child{
    border-right:none;
}
nav#nav_sns i{
    font-size:1.9rem;
    margin:0 0.2em;
}

@media screen and (max-width: 920px) {
.menu {
      position: fixed;
      top: 0;
      right: 0;
      width: 0;
      height: 100%;
      background-color: rgba(54,49,47,0.99);
      transition: width .4s;
      z-index:99;
}
.menu ul,.menu li{
    display: block;
}

.menu--isOpen {
      width: 80vw;
}

.menu_button {
    display: block;
      position: fixed;
      right: 3%;
      top: 16px;
      width: 35px;
      height: 35px;
      background-color: rgba(255,255,255,1.00);
      border: none;
      cursor: pointer;
      cursor: hand;
}
.menu span {
      display: block;
      width: 80%;
      margin: auto;
      height: 3px;
      background-color: #36312F;
      border-radius: 3px;
      position: absolute;
      left: 0;
      right: 0;
      top: calc((100% - 3px)/2);
      transition: .2s;
}

/*デフォルトボタン*/
.menu_lineTop {
      transform: translateY(-11px);
}
.menu_lineMiddle {} 
.menu_lineBottom {
      transform: translateY(11px);
}

/*閉じるボタン*/
.menu--isOpen .menu_lineTop {
      transform: rotate(45deg);
      background-color:#36312F;
}
.menu--isOpen .menu_lineMiddle {
      opacity: 0;
}
.menu--isOpen .menu_lineBottom {
      transform: rotate(-45deg); 
      background-color:#36312F;
}

/*メニュー*/
nav#nav_sns{
    position:static;
    margin:1em;
    padding:1em 0.5em;
    background:none;
}
nav#nav_sns li{
    border-right:none;
}
nav ul{
    margin-top:80px;
    color:#fff;
}
nav li{
    padding:0!important;
    border-bottom:1px solid #666;
}
nav#nav_sns li:last-child{
    border-bottom:none;
}
nav li a{
    text-decoration: none;
    display: block;
    padding:0.7em 2em;
    color:#fff;
}
nav li a:hover{
    background:rgba(200, 200, 200, 1);
    color:#666;
}
nav#nav_sns li a{
    display: inline-block;
}
}



/*------------------------------------------*/
/*メイン*/
/*------------------------------------------*/
main{
    margin:0 auto;
    background: #fff;
}
@media screen and (max-width: 767px) {
main{
    margin: auto;
}
}

/*section*/
section.bgColor01{
    background:#fff;
    padding:5em 3%;
}
section.bgColor02{
    background:#F3F7F2;
    padding:5em 3%;
}
section.bgColor03{
    background:#F8F5F5;
    padding:5em 3%;
}
.container_1000,
.container_1000,
.container_1000{
    max-width: 1000px;
    margin:0 auto;
}

/*------------------------------------------*/
/*フッタ*/
/*------------------------------------------*/
footer{
    margin:0 auto;
    text-align: center;
}
footer .footerImg{
    max-height:250px;
    overflow: hidden;
}
footer img{
    width:100%;
    margin:0;
    padding:0;
}
footer #subNavi{
    margin:0 auto;
    padding:1em;
    background: #5A8D4F;
    color:#fff;
    font-size:1.2rem;
}
#subNavi a {
    display: inline-block;
    text-decoration: none;
    color: #fff;
    position: relative;
}
#subNavi a::before,
#subNavi a::after {
    content: '';
    position: absolute;
    bottom: -3px;
    display: block;
  width: 0;
  height: 1px;
  background-color: #fff;
  transition: width 0.2s;
}
#subNavi a::before {
    right: 50%;
}
#subNavi a::after {
    left: 50%;
}
#subNavi a:hover::before,
#subNavi a:hover::after {
    width: 50%;
}
div#copy{
    margin:0 100px;
    padding:2em 0 4em;
    background: #fff;
}
h1{
    font-size:1.8rem;
    margin:0 0 0.5em 0;
    font-weight: bold;}
    
.copyright{
    margin:1em 0 0 0 ;
    font-size:x-small;
}
@media screen and (max-width: 767px) {
div#copy{
    margin:0 auto;
    padding:2em 3% 4em;
}
footer .footerImg{
    max-height:100px;
}
}



/*////////////////////////////////////*/
/*----------見出し,段落など共通-----------*/
/*////////////////////////////////////*/

/*見出し飾り*/
.midashi_line {
    position: relative;
    width: 40px;
    margin-bottom:1.3em;
    border-bottom: 5px solid #A9A8A8; border-radius: 5px;
}
.midashi_line_w {
    position: relative;
    width: 40px;
    margin-bottom:1.3em;
    border-bottom: 5px solid #fff; border-radius: 5px;
}   
.midashi_line:before,.midashi_line_w:before {
    content: "";
    position: absolute; left: 0; bottom: -5px;
    width: 22px;
    height: inherit;
    border-bottom: 5px solid #5A8D4F; border-radius: 5px;
}

/*見出し*/
h2,#main_sub h3{
    margin:0 0 1.2em 0;
    font-size:2.8rem; font-weight: 700;
    line-height: 160%;
}
h3{
    font-size:2rem;
    margin:0;
}
h4{
    font-size:1.5rem;
    margin:0 0 1em 0;
}

/*マーカー風*/
.marker{
background: linear-gradient(transparent 10%, #FCC9A7 30%);
}
@media screen and (max-width: 767px) {
h2,#main_sub h3{font-size:2rem;}
h3{font-size: 1.7rem}
}

/*段落の処理*/
.contents_text p {
    line-height: 200%;
    margin-bottom:1em;
}
.contents_text p:last-child{
    margin-bottom:0;
}

/*仕切り・間隔開け*/
hr{
   border:0 none; 
   padding:0.8em 0;
}

/*coverImg_高さ300*/
.coverImg{
    position: relative;
    width:100%; height: 200px;
    overflow: hidden;
    margin:1em auto;
    display: flex; justify-content: center; align-items: center;
    background: #000;
}    
.coverImg .cover_text{
    position: absolute; left: 0; top: calc(50% - 2.5rem); 
    width: 100%;
    text-align: center; 
    color: #fff; 
    font-weight: bold; 
    line-height: 160%;
    letter-spacing: 0.2rem;
    filter: drop-shadow(1px 1px 20px rgba(0,0,0,0.6));
}
.coverImg .cover_text img{
    margin:0.5em 0 0.3em 0;
    width:7em;
}
.coverImg .bgfull{
    width:100%;
    display: block;
    opacity: .85;
    transition-duration: 0.3s;
}
.coverImg .bgfull:hover{
  transform: scale(1.05);
  transition-duration: 0.43s;
  opacity: 0.5;
}
@media screen and (max-width: 767px) {
.coverImg{height: 120px}
}



/*////////////////////////////////////*/
/*---------------トップmain------------*/
/*////////////////////////////////////*/

/*mainImg*/
#mainImg{
    position: relative;
    width:100%;
    overflow: hidden;
    max-height: 700px;
    margin:0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #000;
}    
#mainImg p{
    position: absolute;
    width: 100%;
    left: 1em; 
    top: calc(50% - 6.5rem); 
    text-align: center; 
    color: #fff; 
    font-family: "Yusei Magic", sans-serif;
    font-weight: bold; 
    font-size: 3rem;
    line-height: 160%;
    letter-spacing: 0.5rem;
    filter: drop-shadow(1px 1px 20px rgba(0,0,0,0.6));
}
#mainImg .bgfull{
    width:100%;
    display: block;
    opacity: .95;
}
#mainImg p img{
    margin:0 1em 0.3em 0;
    width:8em;
}

@media screen and (max-width: 767px) {
#mainImg{width:auto;height:400px}
#mainImg .bgfull{width: auto;height: 100%}
#mainImg p img{width:6em}
#mainImg p{font-size: 2rem}
}



/*------------------------------------------*/
/*サブページメイン*/
/*------------------------------------------*/
/*mainImg_sub*/
#mainImg_sub{
    position: relative;
    width:100%;
    overflow: hidden;
    max-height: 400px;
    margin:0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #000;
}    
#mainImg_sub h2{
    position: absolute; left: 0; top: calc(50% - 4.5rem); 
    width: 100%;
    text-align: center; 
    color: #fff; font-size: 3rem; font-weight: 700;
    line-height: 160%;
    letter-spacing: 0.8rem;
    filter: drop-shadow(1px 1px 30px rgba(0,0,0,0.9));
}
#mainImg_sub h2 span{
    font-size:1.5rem; 
    letter-spacing: 0.4rem;
}
#mainImg_sub .bgfull{
    width:100%;
    display: block;
    opacity: .8;
}
#mainImg_sub p img{
    margin:0 1em 0.3em 0;
    width:8em;
}
@media screen and (max-width: 767px) {
#mainImg_sub h2{font-size:2rem;top: calc(50% - 3rem); }
#mainImg_sub h2 span{font-size:1rem;}
}

#main_sub h3{

}


/*体験農園*/

/*shop*/
#shop{
    background: url(img_d/bn_top06.png) no-repeat;
    background-size: cover;
    padding:5em 3%;
    height:auto;
    color:#fff;
}
#shop a{
    color:#fff;
}

/*sns*/
.baloon01{
    position: relative;
    padding: .5em .75em;
    background-color: #E8D8CB;
    border-radius: 20px;
    text-align: center;
    font-weight: bold;
}
.baloon01::after {
    position: absolute; top: 100%; left: 48%;
    content: '';
    width: 0; height: 0;
    border: 10px solid transparent; border-top: 15px solid #E8D8CB;
}
#snsInfo i{
    font-size:40px;
    margin:1em 0.5em;
}
#snsInfo a{
    color:#36312F;
}
#snsInfo a:hover{
    color:#716560;
}
#snsInfo .flex_box02{
    flex-wrap: nowrap;
}
.sns_line{
    background:#fff;
    padding:1em 2em;
    align-items: center;
    border-radius: 3px;
}
.sns_line .line_icon{
    margin:0em 0.5em 0 0!important;
    font-size:30px!important;
}
.sns_line .line_color{
    color:#00B900;
}

/*-----blog-----*/
#news #newsList{
    padding:1em 0;
    max-height:20em;
    overflow:auto;
}

#news div{}
#news div dl{display:flex;flex-wrap:wrap;}
#news div dt{color:#36312F;width:15%;border-bottom:#BCBABA 1px dashed;padding:0.2em 0 0.5em;margin:0 0 0.5em}
#news div dd{width:85%;border-bottom:#BCBABA  1px dashed;padding:0.2em 0 0.5em;margin:0 0 0.5em}

#news div a{text-decoration: none}
#news div a:hover{text-decoration:underline}

@media screen and (max-width: 768px) {
#news div dl{display: block}
#news div dt{border:none; margin:0 0 0.2em}
#news div dt,#news div dd{width: 100%}
}

/*////////////////////////////////////*/
/*-------------コンテンツmain-----------*/
/*////////////////////////////////////*/

/*------------------------------------/
 体験農園
/------------------------------------*/
/*dl*/
.list_table,
.list_table dt,
.list_table dd {
    box-sizing: border-box;
}
.list_table dt,
.list_table dd {
    padding: 1em;
    margin: 0px;
}
.list_table dt {
    background-color: #EBEBEB;
}
.list_table dd {
    background-color: #fff;
}
@media screen and (max-width: 767px) {
    .list_table dd {
        border: 1px solid #C9C9C9;
        border-top: none;
    }

}
@media print, (min-width: 768px) {
    .list_table {
        display: flex;
        flex-wrap: wrap;
        border-bottom: 1px solid #C9C9C9;

    }
    .list_table dt,
    .list_table dd {
        display: flex;
        flex-direction: column;
        justify-content: center;
        border-top: 1px solid #C9C9C9;
    }
    .list_table dt {
        width: 20%;
        border-left: 1px solid #C9C9C9;
    }
    .list_table dd {
        width: 80%;
        border-right: 1px solid #C9C9C9;
    }
}

.registBtn a{
    margin:2em auto;
}

/*------------------------------------/
 メールフォーム
/------------------------------------*/
/*-----box-----*/
/*form*/
#kiyaku{
    padding:2em;
    margin:1em 0;
    background:#eee;
    overflow: scroll;
    height:200px;
}

/*square*/
.square{
    border:1px dotted rgba(24,24,24,1);
    padding:1em;
}

/*tokuteisho*/
/*section*/
.sec_normal{
    max-width:1000px;
    margin:2em auto;
    padding:0 3%;
    
}
.flex_dl dl{
display: flex;
flex-wrap: wrap;
}
.flex_dl dt{
display: flex;
width:30%;
padding:0.5em 1em;
margin:2px 0 0;
background:#ccc;
align-items: center;
justify-content:center; 
}

.flex_dl dd{
width:70%;
padding:0.5em 1em;
margin:2px 0 0;
background:#eee;
}

/*フォーム送信ボタンの謎の不具合（文字色）*/
.mfp_buttons button{color:#000!important}

/*monoNavi*/
.monoNavi a{
    margin:1em 0; padding:0.5em 1em;
    font-size:2rem; color:#fff;
    background:#64A856;
    display: inline-block;
    border-radius: 25px;
}
.monoNavi a:hover{
    background:#5A8D4F;
}.monoNavi a i{padding:0 0.3em 0 0}