@charset "utf-8";

/*--------------------------------------------------------------------------
----------------------------------------------------------------------------
----------------------------------------------------------------------------
汎用
----------------------------------------------------------------------------
----------------------------------------------------------------------------
--------------------------------------------------------------------------*/
html, body, div, span, object, iframe, article, aside, canvas, details, pre, figcaption, figure,
h1, h2, h3, h4, h5, h6, p, blockquote, pre, 
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, input, textarea, select, button, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {font-size: 13px;}

.pc {display: none;}

.container {width: calc(100% - 48px);}

/*--------------------------------------------------------------------------
ロード画面
--------------------------------------------------------------------------*/
#load .logo {width: calc(100% - 40px); max-width: 320px;}

/*--------------------------------------------------------------------------
部品
--------------------------------------------------------------------------*/
/*------------------------------------
見出し
------------------------------------*/
.g-h {max-width: calc(100% - 40px); margin-bottom: 24px;}
.g-h .main {font-size: 26px; padding-bottom: 12px;}
.g-h .sub {font-size: 14px; margin-top: 2px;}

/*------------------------------------
バックグラウンド
------------------------------------*/
.bg {background-image: url("../img/common/bg_sp.webp");}
.no-webp .bg {background-image: url("../img/common/bg_sp.jpg");}

/*------------------------------------
NEWS
------------------------------------*/
.news-list .entry {padding: 10px 5px;}
.news-list .entry:first-child {padding-top: 0;}
.news-list .entry dl {display: block;}
.news-list .entry dl dt {display: flex; align-items: center; margin-bottom: 5px;}
.news-list .entry dl dt .cate {font-size: 12px; min-width: 28px; margin-right: 8px; padding: 0 10px; border-radius: 3px;}

@media all and (-ms-high-contrast: none) {
	.news-list .entry dl dt .cate {line-height: 1; padding-top: 6px;}
}

/*------------------------------------
サイドナビ
------------------------------------*/
.side-nav {justify-content: center; bottom: 0; left: 0; width: 100%; padding: 12px 0;}
.side-nav a {margin-right: 14px;}
.side-nav a:last-child {margin-right: 0;}
.side-nav a img {width: auto; height: 30px;}

/*------------------------------------
トップへ戻る
------------------------------------*/
.page-top {width: 60px; height: 60px; right: 15px; bottom: 15px;}

/*--------------------------------------------------------------------------
ヘッダー
--------------------------------------------------------------------------*/
header .navi-list {right: 0; height: 100%; padding: 24px 32px; box-sizing: border-box; flex-direction: column; transform: translateX(100%); transition: .5s ease;}
header .navi-list .logo {margin: 0 auto 15px;}
header .navi-list ul {display: block;}
header .navi-list li {margin-bottom: 15px;}
header .navi-list li a {font-size: 15px;}
header .navi-list li.tel a .flex {align-items: flex-end;}

header #nav-open {position: fixed; top: 12px; right: 12px; width: 52px; height: 52px; background: #006934; border-radius: 50%; cursor: pointer; z-index: 8999;}
header #nav-open div {position: absolute; left: 12px; width: 28px; height: 3px; background: #fff; border-radius: 3px;}
header #nav-open div:nth-child(1) {top: 21px;}
header #nav-open div:nth-child(2) {top: 29px;}

header #nav-close {position: fixed; top: 8px; left: 8px; width: 48px; height: 48px; cursor: pointer; visibility: hidden; opacity: 0; transition: .5s ease; z-index: 9000;}
header #nav-close div {position: absolute; top: 23px; left: 8px; width: 32px; height: 3px; background: #fff; border-radius: 3px;}
header #nav-close div:nth-child(1) {transform: rotate(45deg);}
header #nav-close div:nth-child(2) {transform: rotate(-45deg);}

header #overlay {position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0, .5); cursor: pointer; visibility: hidden; opacity: 0; transition: .5s ease; z-index: 8999;}

.open-nav header .navi-list {transform: translateX(0%);}
.open-nav header #nav-close,
.open-nav header #overlay {visibility: visible; opacity: 1;}

/*--------------------------------------------------------------------------
フッター
--------------------------------------------------------------------------*/
.footer {padding: 30px 0 90px;}
.footer .footer-img img {margin: 0 auto 15px;}
.footer .copyright {font-size: 12px;}

/*--------------------------------------------------------------------------
----------------------------------------------------------------------------
----------------------------------------------------------------------------
フロントページ
----------------------------------------------------------------------------
----------------------------------------------------------------------------
--------------------------------------------------------------------------*/

/*----------------------------------------
メインビジュアル
----------------------------------------*/
#front .mv {align-items: center; width: 100%; min-height: 62.5vh;}

#front .mv .bg-top-img {max-width: 100%;}

#front .mv .cloud.cloud-left {top: 20%; width: 30%;}
#front .mv .cloud.cloud-right {top: 10%; width: 40%;}

#front .mv .arrow-under {left: calc(50% - 20px); bottom: 60px; width: 40px; height: 40px;}

#front .mv .main-img div {background-position: 50% 0;}

#front .mv .branding {margin: 88px 0 58px;}
#front .mv .branding h1 {margin-bottom: 34px;}
#front .mv .branding h1 img {width: 100px;}
#front .mv .branding h1 .icon {margin-bottom: 5px;}
#front .mv .branding .intro {font-size: 16px;}

@media(max-width: 767px){
	#front .mv {height: 70%;}
	#front .mv .arrow-under {bottom: 20px;}
}

/*----------------------------------------
ごあいさつ
----------------------------------------*/
#front .greeting {padding: 60px 0;}

#front .greeting .g-h {margin-bottom: 36px;}

#front .greeting .message {margin-bottom: 48px;}
#front .greeting .message p {font-size: 15px; text-align: center; padding-bottom: 1.5em;}
#front .greeting .message p:last-child {padding-bottom: 0;}

#front .greeting .owner .owner-img img {width: 180px;}
#front .greeting .owner .logo img {width: 200px;}

#front .greeting .img-inner {justify-content: center; align-items: baseline; margin-bottom: 20px;}
#front .greeting .circle img {margin: 0 auto; height: auto;}
#front .greeting .circle.left_01 {width: 165px;}
#front .greeting .circle.right_01 {width: 118px;}

/*----------------------------------------
お知らせ・新着情報
----------------------------------------*/
#front .info {padding: 60px 0;}

#front .info .news {margin-bottom: 36px;}

#front .info .sns {display: block;}
#front .info .sns .fb {width: 100%; min-width: 100%;}
#front .info .sns .insta {margin-top: 36px;}
#front .info .sns .insta h3 {margin-bottom: 12px;}
#front .info .sns .insta .timeline-list .entry {width: calc((100% - 10px) / 2); height: calc((100vw - 58px) / 2);}
#front .info .sns .insta .timeline-list .entry:nth-child(even) {margin-right: 0;}
#front .info .sns .insta .timeline-list .entry:last-child {display: none;}

#front .info .sns .insta iframe.instagram-media {margin: 0px auto 12px!important;}

/*----------------------------------------
メニュー
----------------------------------------*/
#front .menu {margin-bottom: 40px;}
#front .menu .kv {margin-bottom: 60px;}
#front .menu .kv .img {height: 40vw;}
/* #front .menu .kv .img .paraslimy-bg {background-image: url("../img/menu/kv_sp.jpg"); background-position: 50% 100%; background-size: 100% auto;} */
#front .menu .kv .img .paraslimy-bg {background-image: url("../img/menu/kv_sp.webp"); background-position: 50% 100%; background-size: cover;}
.no-webp #front .menu .kv .img .paraslimy-bg {background-image: url("../img/menu/kv_sp.jpg");}
#front .menu .kv .txt .icon {width: 32px; margin-right: 4px;}
#front .menu .kv .txt p {font-size: 16px;}

#front .menu .choose {width: calc(100% - 40px); margin: 0 auto;}
#front .menu .choose h3 {margin-bottom: 12px;}
#front .menu .choose h3 img {height: 24px;}
#front .menu .choose .choose-list {display: block;}
#front .menu .choose .choose-list .entry {margin-bottom: 24px;}
#front .menu .choose .choose-list .entry:last-child {margin-right: 0;}
#front .menu .choose .choose-list .entry:after {bottom: -50px; left: calc(50% - 25px); width: 50px; height: 50px; background-size: 25px 15.5px; border: 1px solid #eee;}
#front .menu .choose .choose-list .entry:last-child:after {display: none!important;}
#front .menu .choose .choose-list .entry .img {height: calc((100vw - 48px) * .65); max-height: 420px; border-radius: 10px;}
#front .menu .choose .choose-list .entry .txt {margin: 12px 8px 0;}
#front .menu .choose .choose-list .entry .txt dt {font-size: 18px;}
#front .menu .choose .choose-list .entry .txt dd {font-size: 12px;}
#front .menu .choose .choose-list .entry .txt span {font-size: 18px;}

#front .menu .choose.many h3 {margin-bottom: 8px;}
#front .menu .choose.many h3 img {height: 29px;}
#front .menu .choose.many .choose-list .entry:after {background-size: 17px;}

#front .menu .plus img {width: 62.5px; margin: 24px auto;}

/*----------------------------------------
心地庵のもと
----------------------------------------*/
#front .vegetable {padding-top: 60px;}
#front .vegetable .container {width: 100%;}

#front .vegetable .desc {font-size: 12px; /*text-align: center;*/ margin: 0 15px 35px 15px;}

#front .vegetable .vege-intro {}
#front .vegetable .vege-intro li {position: relative; /*box-shadow: 0px 10px 10px -5px rgba(0,0,0,0.2);*/}
#front .vegetable .vege-intro li .txt {width: 50%; height: 190px; position: relative;}
#front .vegetable .vege-intro li .txt .icon {width: 30px; position: absolute; z-index: 2;}
#front .vegetable .vege-intro li .txt h3 {margin: 15px 12px 10px 0;}
#front .vegetable .vege-intro li .txt h3 .name {font-size: 15px; letter-spacing: 0;}
#front .vegetable .vege-intro li .txt h3 .prof {font-size: 10px; letter-spacing: 0;}
#front .vegetable .vege-intro li .txt .cover {font-size: 10px; margin: 0 12px; letter-spacing: 0; line-height: 1.5;}
#front .vegetable .vege-intro li .img {width: 50%; background-color: red; height: 190px; overflow: hidden;}
#front .vegetable .vege-intro li .img img {min-width: 100%; min-height: 100%;}
#front .vegetable .vege-intro li .img .k-bg {height: 190px;}
#front .vegetable .vege-intro li .chara {position: absolute; z-index: 2;}

#front .vegetable .vege-intro .imamura .txt .icon {top: 0; right: 0;}
#front .vegetable .vege-intro .imamura .txt h3 .icon {width: 28px; top: -3%; right: 5%;}
#front .vegetable .vege-intro .imamura .txt h3 .icon img {transform: scale(-1, 1) rotate(0deg); /*margin: 10px 50px -20px 0;*/}
#front .vegetable .vege-intro .imamura .chara {right: 0; bottom: 0; width: 206px;}

#front .vegetable .vege-intro .isako .txt .icon {top: 10%; right: 10%;}
#front .vegetable .vege-intro .isako .chara {left: 12%; bottom: 0; width: 145px;}

#front .vegetable .vege-intro .ueda .txt .icon {top: 5%; right: 10%;}
#front .vegetable .vege-intro .ueda .chara {right: 19%; bottom: 0; width: 160px;}

#front .vegetable .vege-intro .moriyama .txt .icon {top: 5%; right: 10%;}
#front .vegetable .vege-intro .moriyama .chara {left: 17%; bottom: 0; width: 150px;}

#front .vegetable .vege-intro .matsushita .txt .icon {width: 40px; top: 8%; right: 5%;}
#front .vegetable .vege-intro .matsushita .chara {right: 0; bottom: 0; width: 203px;}

@media(min-width: 768px) {
	#front .vegetable .vege-intro li .txt .icon {width: 30px;}
	#front .vegetable .vege-intro li .txt h3 {margin-bottom: 20px;}
	#front .vegetable .vege-intro li .img .k-bg {width: 100%;}
}
@media(min-width: 350px) {
	#front .vegetable .vege-intro .imamura .chara {right: 0; bottom: 0; width: 230px;}
	#front .vegetable .vege-intro .matsushita .chara {right: 0; bottom: 0; width: 230px;}
}

/*
#front .vegetable {padding: 44px 0 88px;}
#front .vegetable .desc {font-size: 14px; line-height: 1.5; margin: 0 0 10px;}

#front .vegetable .deco {display: none;}

#front .vegetable .vege-intro {width: calc(100% - 24px); margin: 0 auto;}
#front .vegetable .vege-intro li {margin-top: 50px;}
#front .vegetable .vege-intro li .txt h3 {margin-bottom: 8px;}
#front .vegetable .vege-intro li .txt h3 .name {font-size: 18px;}
#front .vegetable .vege-intro li .txt h3 .prof {margin-bottom: 8px;}
#front .vegetable .vege-intro li .txt p {letter-spacing: 0;}

#front .vegetable .vege-intro .imamura {flex-direction: column;}
#front .vegetable .vege-intro .imamura .img {width: 250px; height: auto; margin: 0 auto;}
#front .vegetable .vege-intro .imamura .txt {display: flex; flex-direction: column; align-items: center;}
#front .vegetable .vege-intro .imamura .txt h3 {padding-left: 40px;}
#front .vegetable .vege-intro .imamura .txt p {margin-left: 14px;}
#front .vegetable .vege-intro .imamura .txt .icon {width: 30px; top: -20px; left: 0;}

#front .vegetable .vege-intro .isako .img {width: 120px; margin-right: 8px;}
#front .vegetable .vege-intro .isako .txt h3 .prof {letter-spacing: 0;}
#front .vegetable .vege-intro .isako .txt .icon {width: 30px; top: -20px; left: 80px;}

#front .vegetable .vege-intro .ueda {flex-direction: row-reverse;}
#front .vegetable .vege-intro .ueda .img {width: 125px; margin-left: 4px;}
#front .vegetable .vege-intro .ueda .txt .icon {width: 25px; top: -10px; left: 80px;}

#front .vegetable .vege-intro .moriyama {flex-direction: row-reverse;}
#front .vegetable .vege-intro .moriyama .img {width: 132px; margin-right: 8px;}
#front .vegetable .vege-intro .moriyama .txt .icon {width: 30px; top: -10px; left: 82px;}

#front .vegetable .vege-intro .matsushita {flex-direction: column-reverse;}
#front .vegetable .vege-intro .matsushita .img {width: 200px; margin: 0 auto;}
#front .vegetable .vege-intro .matsushita .txt {margin-bottom: 10px;}
#front .vegetable .vege-intro .matsushita .txt {display: flex; flex-direction: column; align-items: center;}
#front .vegetable .vege-intro .matsushita .txt h3 {padding-left: 50px;}
#front .vegetable .vege-intro .matsushita .txt .icon {width: 50px; top: 0; left: -10px;}
*/

/*----------------------------------------
お料理のこと
----------------------------------------*/
#front .dish {padding: 60px 0 0;}
#front .dish .g-h {margin-bottom: 36px;}

#front .dish .menu-list .entry {flex-direction: column;}
#front .dish .menu-list .entry:nth-child(odd) {align-items: flex-end;}
#front .dish .menu-list .entry:nth-child(even) {align-items: flex-start;}
#front .dish .menu-list .entry .img {width: 100%; height: 64vw; max-height: 480px;}
#front .dish .menu-list .entry .txt {position: relative; top: -36px; width: 75%; min-width: 316px; padding: 18px 24px 24px;}
#front .dish .menu-list .entry .txt h3 {font-size: 18px; margin-bottom: 6px;}
#front .dish .menu-list .entry .txt p {font-size: 12px;}
#front .dish .menu-list .entry .txt p:not(:last-child) {margin-bottom: 4px;}

/*#front .dish {padding: 60px 0 30px;}

#front .dish .g-h {margin-bottom: 36px;}

#front .dish .menu-list .entry {display: block; margin-bottom: 36px;}
#front .dish .menu-list .entry:last-child {margin-bottom: 0;}
#front .dish .menu-list .entry .img {height: calc((100vw - 48px) * .65); max-height: 420px; margin-bottom: 18px; border-radius: 10px;}
#front .dish .menu-list .entry .txt h3 {font-size: 20px;}*/

/*----------------------------------------
ウェブショップ
----------------------------------------*/
/*#front .webshop {padding: 60px 0 15px;}

#front .webshop .item-list .entry {display: block;}
#front .webshop .item-list .img {width: 100%; height: auto; border-radius: 10px; margin-bottom: 20px;}
#front .webshop .item-list .txt h3 {font-size: 18px; margin-bottom: 1em;}
#front .webshop .item-list .txt .label {margin-bottom: 8px;}
#front .webshop .item-list .txt .label dt {font-size: 16px; margin-right: 16px;}
#front .webshop .item-list .txt .label dd .value {font-size: 30px;}
#front .webshop .item-list .txt .label dd .unit {margin-left: 4px;}
#front .webshop .item-list .txt .label dd .unit .tax {font-size: 10px; transform: scale(.8);}
#front .webshop .item-list .txt .label dd .unit .yen {font-size: 18px;}
#front .webshop .item-list .txt .btn {height: 48px; margin: 20px auto;}
#front .webshop .item-list .txt .btn span {font-size: 18px;}
#front .webshop .item-list .txt .btn .icon {width: 22px; margin: -2px 0 0 5px;}*/


#front .webshop {padding: 60px 0 15px;}

#front .webshop .item-list .entry {display: block;}
#front .webshop .item-list .img {width: 100%; height: auto; border-radius: 10px; margin-bottom: 20px;}
#front .webshop .item-list .txt h3 {font-size: 18px; margin: 0 8px 1em 8px;}
#front .webshop .item-list .txt .desc {margin: 0 8px;}
#front .webshop .item-list .txt .btn {height: 48px; margin: 20px auto;}
#front .webshop .item-list .txt .btn span {font-size: 18px; font-family: fot-tsukuardgothic-std,sans-serif; font-weight: 700;}
#front .webshop .item-list .txt .btn .icon {width: 22px; margin: -2px 0 0 5px;}

/*----------------------------------------
アクセス
----------------------------------------*/
#front .access {padding: 60px 0;}

#front .access .container {display: block;}

#front .access .date {display: flex; flex-direction: column; align-items: center; margin-bottom: 32px;}
#front .access .date h3 {margin: 24px 0;}
#front .access .date h3 img {margin: 0 auto;}
#front .access .date .hours * {font-size: 15px;}
#front .access .date .hours > dl {margin-bottom: 5px;}
#front .access .date .hours > dl > dt {font-size: 18px;}
#front .access .date .hours > dl.open > dd > dl > dt,
#front .access .date .hours > dl.close dd {font-size: 16px;}
#front .access .date .hours > dl.open > dd > dl > dd {margin-left: 23px;}

#front .access .date .address {margin-top: 32px;}
#front .access .date .address * {font-size: 16px;}

#front .access .google-map {width: 100%; height: 280px; border-radius: 15px;}

#front .access .related-site {margin-top: 42px;}
#front .access .related-site .ttl {font-size: 18px; margin-bottom: 14px;}
#front .access .related-site .link-list {margin-left: 23px;}
#front .access .related-site .link-list .entry:not(:last-child) {margin-bottom: 10px;}
#front .access .related-site .link-list dl {display: block;}
#front .access .related-site .link-list dl dt {font-size: 15px; margin-bottom: 2px;}
#front .access .related-site .link-list dl dd {font-size: 14px; margin-left: 1em;}

#front .access .icon_star:before {width: 18px; height: 18px; margin-bottom: 3px;}