@charset "utf-8";

/*--------------------------------------------------------------------------
----------------------------------------------------------------------------
----------------------------------------------------------------------------
汎用
----------------------------------------------------------------------------
----------------------------------------------------------------------------
--------------------------------------------------------------------------*/
.sp {display: none;}

.container {width: 980px;}

/*--------------------------------------------------------------------------
アニメーション
--------------------------------------------------------------------------*/

/* 上からカバー外し */
.cover.v {
	-webkit-mask-image: linear-gradient(180deg, black 0%, black 33%, rgba(0, 0, 0, 0) 66%, rgba(0, 0, 0, 0) 100%);
			mask-image: linear-gradient(180deg, black 0%, black 33%, rgba(0, 0, 0, 0) 66%, rgba(0, 0, 0, 0) 100%);
}

/* ディレィ */
.delay-01 {transition-delay: .625s!important;}
.delay-02 {transition-delay: 1.25s!important;}
.delay-03 {transition-delay: 1.875s!important;}
.delay-04 {transition-delay: 2.5s!important;}
.delay-05 {transition-delay: 3.125s!important;}

/*--------------------------------------------------------------------------
ロード画面
--------------------------------------------------------------------------*/
#load .logo {width: 480px;}

/*--------------------------------------------------------------------------
部品
--------------------------------------------------------------------------*/
/*------------------------------------
見出し
------------------------------------*/
.g-h {max-width: 980px; margin-bottom: 56px;}
.g-h .main {font-size: 42px; padding-bottom: 20px;}
.g-h .sub {font-size: 18px; margin-top: 4px;}

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

/*------------------------------------
NEWS
------------------------------------*/
.news-list .entry {padding: 18px 12px;}
.news-list .entry:first-child {padding-top: 0;}
.news-list .entry dl {align-items: center;}
.news-list .entry dl dt {min-width: 100px;}
.news-list .entry dl dt .cate {width: 100%; font-size: 14px; padding: 2px 0; border-radius: 5px;}
.news-list .entry dl dt time {font-size: 16px; margin-top: 5px;}
.news-list .entry dl dd {font-size: 16px; margin-left: 30px;}

@media all and (-ms-high-contrast: none) {
	.news-list .entry dl dt .cate {padding: 4px 0 0;}
}

/*------------------------------------
サイドナビ
------------------------------------*/
.side-nav {flex-direction: column; top: 50%; right: 0; transform: translateY(-50%); padding: 14px; border-radius: 10px 0 0 10px; box-shadow: 0 0 8px rgba(0,0,0, .1);}
.side-nav a {margin-bottom: 14px;}
.side-nav a:last-child {margin-bottom: 0;}
.side-nav a img {width: auto; height: 32px;}

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

/*--------------------------------------------------------------------------
ヘッダー
--------------------------------------------------------------------------*/
header .navi-list {left: 0; justify-content: center; align-items: center; width: 100%; height: 72px;}
header .navi-list .logo {margin-right: 30px;}
header .navi-list ul {height: 100%; justify-content: center; align-items: center;}
header .navi-list li {margin-right: 30px; padding: 10px 0; margin: 0 30px 0 0;}
header .navi-list li:last-child {margin: 0;}
header .navi-list li.tel {position: relative; top: 10px; height: 92px; padding: 0 20px; background: #006633; border-radius: 0 0 20px 20px;}
header .navi-list li a {display: block; font-size: 15px; font-weight: 700; letter-spacing: .05em;}
header .navi-list li.tel {display: flex; align-items: center;}
header .navi-list li.tel span {color: #fff;}
header .navi-list li.tel a div {align-items: flex-end;}
header .navi-list li.tel a div img {margin: 0 3px 0 4px;}

@media(max-width: 1200px){
	header .navi-list .logo {margin-right: 20px;}
	header .navi-list li {margin-right: 20px; padding: 20px 0;}
	header .navi-list li a {font-size: 13px;}
	header .navi-list li a span {font-size: 13px;}
}

@media all and (-ms-high-contrast: none) {
	header .navi-list .logo,
	header .navi-list li.tel a div img {position: relative; top: -.15em;}
	header .navi-list li.tel {top: calc(10px - .15em);}
}

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

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

/*----------------------------------------
メインビジュアル
----------------------------------------*/
#front .mv {align-items: flex-end; height: 100vh;}

#front .mv .bg-top-img {width: auto; height: calc(100% - 104px); margin-bottom: 40px;}

#front .mv .cloud.cloud-left {top: 150px; width: 26.172vh; min-width: 218.25px; max-width: 291px;}
#front .mv .cloud.cloud-right {top: 100px; width: 39.258vh; min-width: 301.5px; max-width: 402px;}

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

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

#front .mv .branding {margin: 175px 0 115px;}
#front .mv .branding h1 {margin-bottom: 78px;}
#front .mv .branding h1 img {width: 200px;}
#front .mv .branding h1 .icon {margin-bottom: 10px;}
#front .mv .branding .intro {font-size: 21px;}

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

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

#front .greeting .message {margin: 250px 0 75px;}
#front .greeting .message p {font-size: 17px; text-align: center; margin-bottom: 50px;}
#front .greeting .message p:last-child {padding-left: 0;}

#front .greeting .owner .owner-img img {width: 400px; margin-top: 200px;}
#front .greeting .owner .logo img {width: 450px;}

#front .greeting .circle {position: absolute;}
#front .greeting .circle.left_01 {right: 60%; top: -182px;}
#front .greeting .circle.left_02 {right: 70%; top: 168px;}
#front .greeting .circle.left_03 {right: 65%; top: 568px;}
#front .greeting .circle.right_01 {left: 65%; top: -32px;}
#front .greeting .circle.right_02 {left: 70%; top: 218px;}
#front .greeting .circle.right_03 {left: 65%; top: 498px;}

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

#front .info .news {max-width: 860px; margin: 0 auto 60px;}

#front .info .sns {width: 100%; justify-content: center; align-items: flex-start;}
#front .info .sns .fb {width: 320px; margin-top: 63px;}
#front .info .sns .insta {width: 500px; margin-left: 60px;}
#front .info .sns .insta h3 {margin-bottom: 15px;}
#front .info .sns .insta .timeline-list .entry {width: 160px; height: 160px;}
#front .info .sns .insta .timeline-list .entry:nth-child(3n) {margin-right: 0;}

/*----------------------------------------
メニュー
----------------------------------------*/
#front .menu .kv {margin-bottom: 120px;}
#front .menu .kv .img {height: 300px;}
#front .menu .kv .img .paraslimy-bg {background-image: url("../img/menu/kv_pc.webp"); background-position: 50% 25%; background-size: 100% auto;}
.no-webp #front .menu .kv .img .paraslimy-bg {background-image: url("../img/menu/kv_pc.jpg");}
#front .menu .kv .txt .icon {width: 50px; margin-right: 8px;}
#front .menu .kv .txt p {font-size: 24px;}

#front .menu .choose {width: 1080px;}
#front .menu .choose h3 {margin-bottom: 15px;}
#front .menu .choose h3 img {height: 38px;}
#front .menu .choose .choose-list {justify-content: center;}
#front .menu .choose .choose-list .entry {margin-right: 20px; width: calc(100% / 3);}
#front .menu .choose .choose-list .entry:nth-child(3n) {margin-right: 0;}
#front .menu .choose .choose-list .entry:after {top: calc(170px - 32.5px); right: -42.5px; width: 65px; height: 65px; background-size: 36px auto;}
#front .menu .choose .choose-list .entry:nth-child(3n):after {display: none!important;}
#front .menu .choose .choose-list .entry .img {height: 340px; border-radius: 15px;}
#front .menu .choose .choose-list .entry .txt {margin: 14px 12px 0;}
#front .menu .choose .choose-list .entry .txt dt {font-size: 22px;}
#front .menu .choose .choose-list .entry .txt dd {font-size: 15px;}
#front .menu .choose .choose-list .entry .txt span {font-size: 22px;}

#front .menu .choose.many h3 {margin-bottom: 10px;}
#front .menu .choose.many h3 img {height: 46px;}
#front .menu .choose.many {width: 920px; margin-top: -15px;}
#front .menu .choose.many .choose-list .entry:after {top: calc(146.5px - 32.5px); background-size: 25px auto;}
#front .menu .choose.many .choose-list .entry .img {height: 293px;}
#front .menu .choose.many .choose-list .entry:last-child .txt dt {letter-spacing: -0.06em;}
#front .menu .choose .choose-list .entry:last-child .txt span {letter-spacing: -0.09em;}

#front .menu .plus img {width: 100px; margin: 36px auto;}

/*----------------------------------------
心地庵のもと
----------------------------------------*/
#front .vegetable {margin-top: 75px; padding: 100px 0 60px; position: relative;}
#front .vegetable .desc {font-size: 18px; text-align: center; margin: 48px 0 64px;}

#front .vegetable .vege-intro {width: 960px; margin: 0 auto;}
#front .vegetable .vege-intro li {position: relative; width: 100%; height: 400px; align-items: center; border-radius: 15px; box-shadow: 0 10px 25px 0 rgba(0,0,0, .3); margin: 60px 0; background-color: #fff;}
#front .vegetable .vege-intro li .txt {width: 420px; text-align: center;}
#front .vegetable .vege-intro li .txt h3 {margin: 0 0 20px;}
#front .vegetable .vege-intro li .txt h3 .icon {display: flex; justify-content: center; margin-bottom: 8px;}
#front .vegetable .vege-intro li .txt h3 .name {font-size: 30px;}
#front .vegetable .vege-intro li .txt h3 .prof {font-size: 21px;}
#front .vegetable .vege-intro li .txt .cover {font-size: 15px;}
#front .vegetable .vege-intro li .img {width: 550px; height: 100%; overflow: hidden;}
#front .vegetable .vege-intro li .img.right {border-radius: 0 15px 15px 0;}
#front .vegetable .vege-intro li .img.left {border-radius: 15px 0 0 15px;}
#front .vegetable .vege-intro li .img img {width: 100%; height: 100%;}
#front .vegetable .vege-intro li .chara {position: absolute; bottom: 0; z-index: 2;}

#front .vegetable .vege-intro .imamura .txt h3 .icon img {/*width: 55px; height: auto; transform: rotate(-40deg); margin: 0 50px -20px 0;*/}
#front .vegetable .vege-intro .imamura .chara {right: 0; min-width: 600px; height: auto;}

#front .vegetable .vege-intro .isako {}
#front .vegetable .vege-intro .isako .chara {left: 230px;}

#front .vegetable .vege-intro .ueda {}
#front .vegetable .vege-intro .ueda .chara {right: 130px;}

#front .vegetable .vege-intro .moriyama {}
#front .vegetable .vege-intro .moriyama .chara {left: 230px;}

#front .vegetable .vege-intro .matsushita {}
#front .vegetable .vege-intro .matsushita .chara {right: 50px;}

/*
#front .vegetable {padding: 175px 0; margin: 0 auto;}
#front .vegetable .desc {font-size: 18px; text-align: center; margin: 48px 0 64px;}

#front .vegetable .deco {position: absolute; z-index: -2;}
#front .vegetable .deco.asparagus {top: 235px; right: 0; width: 234px; height: 462px;}
#front .vegetable .deco.onion {top: 703px; width: 406px; height: 453px;}
#front .vegetable .deco.cabbage {right: 0; bottom: 65px; width: 650px; height: 696px;}

#front .vegetable .vege-intro {width: 1080px; margin: 0 auto;}
#front .vegetable .vege-intro li {margin-top: 30px;}
#front .vegetable .vege-intro li .txt h3 .name {font-size: 28px;}
#front .vegetable .vege-intro li .txt h3 .prof {font-size: 18px; margin-bottom: 20px;}

#front .vegetable .vege-intro .imamura {margin: 50px -50px 0 0;}
#front .vegetable .vege-intro .imamura .txt h3 {padding-left: 55px;}
#front .vegetable .vege-intro .imamura .txt h3 .icon {top: -42px; left: -14px; width: 55px;}
#front .vegetable .vege-intro .imamura .img {width: 615px; transition-delay: .625s!important;}

#front .vegetable .vege-intro .isako .txt {margin-left: 16px;}
#front .vegetable .vege-intro .isako .txt * {transition-delay: .425s!important;}
#front .vegetable .vege-intro .isako .txt h3 {padding-left: 55px;}
#front .vegetable .vege-intro .isako .txt h3 .icon {top: -8px; left: -26px; width: 63px;}
#front .vegetable .vege-intro .isako .img {width: 301px;}

#front .vegetable .vege-intro .ueda {justify-content: flex-end; align-items: flex-start; margin: 0;}
#front .vegetable .vege-intro .ueda .txt {margin: 18px 0 0 10px;}
#front .vegetable .vege-intro .ueda .txt * {transition-delay: 1.65s!important;}
#front .vegetable .vege-intro .ueda .txt h3 {padding-left: 55px;}
#front .vegetable .vege-intro .ueda .txt h3 .icon {top: 6px; left: -10px; width: 51px;}
#front .vegetable .vege-intro .ueda .img {width: 299px; transition-delay: 1.225s!important;}

#front .vegetable .vege-intro .moriyama {position: relative; left: 48px; justify-content: flex-start; align-items: flex-start; margin-top: -180px;}
#front .vegetable .vege-intro .moriyama .txt {margin: 18px -48px 0 0;}
#front .vegetable .vege-intro .moriyama .txt h3 {padding-left: 42px;}
#front .vegetable .vege-intro .moriyama .txt h3 .icon {top: -6px; left: -52px; width: 76px;}
#front .vegetable .vege-intro .moriyama .img {width: 317px; transition-delay: .625s!important;}

#front .vegetable .vege-intro .matsushita .txt {margin-left: 18px;}
#front .vegetable .vege-intro .matsushita .txt * {transition-delay: .425s!important;}
#front .vegetable .vege-intro .matsushita .txt h3 {padding-left: 80px;}
#front .vegetable .vege-intro .matsushita .txt h3 .icon {top: -12px; left: -28px; width: 93px;}
#front .vegetable .vege-intro .matsushita .img {width: 470px;}
*/

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

#front .dish .menu-list {margin: 0 auto;}
#front .dish .menu-list .entry {margin-bottom: 80px;}
#front .dish .menu-list .entry:nth-child(odd) {flex-direction: row;}
#front .dish .menu-list .entry:nth-child(even) {flex-direction: row-reverse;}
#front .dish .menu-list .entry .img {width: 60%;}
#front .dish .menu-list .entry .txt {position: absolute; display: flex; width: 50%; height: 65%; max-height: 420px; padding: 36px 48px 48px;}
#front .dish .menu-list .entry:nth-child(odd) .txt {top: 25%; right: 0; justify-content: flex-start;}
#front .dish .menu-list .entry:nth-child(even) .txt {bottom: 25%; left: 0; justify-content: flex-end;}
#front .dish .menu-list .entry .txt .box {max-width: calc(750px - 96px);}
#front .dish .menu-list .entry .txt h3 {font-size: 30px; margin-bottom: 16px;}
#front .dish .menu-list .entry .txt p {font-size: 15px;}
#front .dish .menu-list .entry .txt p:not(:last-child) {margin-bottom: 12px;}

@media(min-width: 1500px){
	#front .dish .menu-list .entry .txt {width: calc(50% + 50vw);}
	#front .dish .menu-list .entry:nth-child(odd) .txt {right: calc(-50vw);}
	#front .dish .menu-list .entry:nth-child(even) .txt {left: calc(-50vw);}
}

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

#front .dish .g-h {margin-bottom: 72px;}
#front .dish .container {width: 1080px;}

#front .dish .menu-list .entry {margin-bottom: 72px; justify-content: space-between; align-items: center;}
#front .dish .menu-list .entry:nth-child(even) {flex-direction: row-reverse;}
#front .dish .menu-list .entry:last-child {margin-bottom: 0;}
#front .dish .menu-list .entry .img {width: 480px; border-radius: 15px;}
#front .dish .menu-list .entry .txt {max-width: calc(100% - 480px); margin: 0 auto;}
#front .dish .menu-list .entry .txt h3 {font-size: 30px;}
#front .dish .menu-list .entry:nth-child(odd) .txt {transition-delay: .425s!important;}
#front .dish .menu-list .entry:nth-child(even) .img {transition-delay: .625s!important;}*/

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

#front .webshop .item-list .entry {align-items: center;}
#front .webshop .item-list .img {width: 350px; height: 100%; border-radius: 15px;}
#front .webshop .item-list .txt {width: calc(100% - 400px); margin-left: 50px; transition-delay: .425s!important;}
#front .webshop .item-list .txt h3 {font-size: 24px; margin-bottom: 1.75em;}
#front .webshop .item-list .txt .label {margin-bottom: 12px;}
#front .webshop .item-list .txt .label dt {font-size: 21px; margin-right: 20px;}
#front .webshop .item-list .txt .label dd .value {font-size: 42px;}
#front .webshop .item-list .txt .label dd .unit {margin-left: 4px;}
#front .webshop .item-list .txt .label dd .unit .tax {font-size: 10px;}
#front .webshop .item-list .txt .label dd .unit .yen {font-size: 24px;}
#front .webshop .item-list .txt .btn {height: 64px; margin: 24px auto 0;}
#front .webshop .item-list .txt .btn span {font-size: 28px;}
#front .webshop .item-list .txt .btn .icon {width: 36px; margin: -2px 0 0 10px;}*/


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

#front .webshop .item-list .entry {align-items: center;}
#front .webshop .item-list .img {width: 350px; height: 100%; border-radius: 15px;}
#front .webshop .item-list .txt {width: 490px; margin-left: 50px; transition-delay: .425s!important;}
#front .webshop .item-list .txt h3 {font-size: 24px; letter-spacing: 0.1em; margin-bottom: 1.75em;}
#front .webshop .item-list .txt .btn {height: 64px; margin: 120px auto 0;}
#front .webshop .item-list .txt .btn span {font-size: 28px; font-family: fot-tsukuardgothic-std,sans-serif; font-weight: 700;}
#front .webshop .item-list .txt .btn .icon {width: 36px; margin: -2px 0 0 10px;}


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

#front .access .container {align-items: flex-start; flex-wrap: wrap;}

#front .access .date {width: calc(100% - 550px); margin-right: 44px;}
#front .access .date h3 {margin-bottom: 28px;}
#front .access .date .hours * {font-size: 17px;}
#front .access .date .hours > dl {margin-bottom: 6px;}
#front .access .date .hours > dl > dt {font-size: 19px;}
#front .access .date .hours > dl.open > dd > dl > dt,
#front .access .date .hours > dl.close dd {font-size: 17px;}
#front .access .date .hours > dl.open > dd > dl > dd {margin-left: 29px;}

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

#front .access .google-map {width: 500px; height: 450px; border-radius: 20px;}

#front .access .related-site {margin-top: 100px;}
#front .access .related-site .ttl {font-size: 21px; margin-bottom: 18px;}
#front .access .related-site .link-list {margin-left: 29px;}
#front .access .related-site .link-list .entry:not(:last-child) {margin-bottom: 12px;}
#front .access .related-site .link-list dl * {font-size: 17px;}
#front .access .related-site .link-list dl dt {min-width: 13em;}

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