*,
::before,
::after {
    box-sizing: border-box;
    border-style: solid;
    border-width: 0;
    margin: 0;
}

body {
    font-family: 'Noto Serif JP', serif;
    /* font-family: YuMincho,'Yu Mincho', serif; */
    font-weight: lighter;
    line-height: 1.875rem;
    overflow-x: hidden;
    /*-----------水平方向のオーバーフローを非表示に*/

}

ul {
    /* padding: 0; */
    list-style: none;
}

a {
    background: transparent;
    text-decoration: none;
    color: inherit;
    /* リンク要素カラーを親要素から継承*/
}

.container_s,
.container_l {
    margin: 0 40px;
}

iframe {
    width: 100%;
}

section {
    padding-top: 80px;
    padding-bottom: 80px;
}

@media(min-width:768px) {
    .midashi-box h2 {
        text-align: center;

    }

    section {
        padding-top: 100px;
        padding-bottom: 100px;
    }

    .container_s {
        width: 600px;
        margin: 0 auto;
    }
}

@media(min-width:1024px) {
    .container_l {
        width: 820px;
        margin: 0 auto;
    }

    section {
        padding-top: 150px;
        padding-bottom: 150px;
    }
}

/* ========body  ページ移行時フェードイン========== */
body {
    animation: fadein 2s forwards;
}

@keyframes fadein {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

/* =======メニューをクリックした時にスムースに移動 （CSSのみで実装ページ内リンク）*/


html {
    scroll-behavior: smooth;
    scroll-padding-top: 70px;
}



/* =============================================
　　** ヘッダーのCSSはここから **
============================================= */
/* ヘッダー01 */
#header01 {
    padding: 1rem;
    background: rgba(255, 255, 255);
    width: 100%;
    position: fixed;
    z-index: 9;
    /* 最初は不透明度０ */
    opacity: 0;
    /* 最初は70px上に配置 */
    transform: translateY(-70px);
    /* トランジション */
    transition: all 0.5s;
    /* top: 0; */
    /* opacity: 0; */
    /* display: none;  */
    /*ここはJQの処理*/

    /* top: -70px; */
    /* left: 0;
    width: 100%;
    transition: top .8s, visibility .8s;
    visibility: hidden;  */
}

#header01.fall {
    opacity: 1;
    transform: none;
}

@media(max-width:767px) {
    header#header01 {
        display: none;
    }

}

nav.nav {
    display: flex;
    justify-content: center;
    max-width: 660px;
    margin: 0 auto;
    font-size: 1rem;
}

nav.nav ul.item {
    display: flex;
    align-items: center;
    padding-left: 0;
}

nav.nav ul.item li.list {
    padding: 0 1rem;
}

nav.nav ul.item li.list a {
    font-weight: normal;
    color: rgb(127, 124, 124);
    transition: all .8s ease 0s;
    transition-duration: 1s;
}

nav.nav ul.item li.list a:hover {
    opacity: 0.3;
}

nav.nav ul.item li.logo {
    margin: 0 auto;
    padding: 0 2rem;
}

nav.nav ul.item li.logo img {
    width: 80px;
    height: 30px;
    object-fit: contain;
}

/*==================================
        **  main  **
====================================*/
main {
    position: relative;
    padding-top: 56.161vw;
}

#first {
    position: fixed;
    left: 0;
    top: 0;
    z-index: -1;
    width: 100%
}
/*--- .main_visualの画像をズームアップさせる(jsは使わないで拡大しながらスライド） ---*/
.main_visual {
    height: 56.161vw;
    position: relative;
    width: 100%;
    height: 56.161vw;
    overflow: hidden; 
}

.main_visual img {
    width: 100%;
    min-height: 56.161vw;
    max-height: 56.161vw;
    object-fit: cover;
    vertical-align: bottom;
    position: absolute;
    opacity: 0;
    transform: scale(1);
    /* transition: opacity 2s,transform 2s; */
    /* position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    opacity: 0; */
}
.main_visual img.prev {
    opacity: 1;
    animation: slidefadeout 11s linear;
}
@keyframes slidefadeout {
    /* 非表示状態からフェードoutを開始する */
    0% {
      opacity: 1;
      transform: scale(1.15);

     }
    20%{
        opacity: 0;
     }
    50%{
        opacity: 0;
       
    }
        
    100% {
      opacity: 0;
      transform: scale(1);
    }
  }


.main_visual img.current {
    opacity: 0;
    animation: slidefadein 10s linear;
}

/* .main_visual img:nth-child(1){
    animation-delay: -2s;
}
.main_visual img:nth-child(2){
    animation-delay: 6s;
}
.main_visual img:nth-child(3){
    animation-delay: 14s;
}
.main_visual img:nth-child(4){
    animation-delay: 22s;
} */
@keyframes slidefadein {
    /* 非表示状態からフェードインを開始する */
    0% {
      opacity: 0;
      transform: scale(1.35); /*ズームのための指定*/
     }
     10%{
        opacity: 0.8; 
     }
     /* 30%{
        opacity: 0;
     } */
    /* フェードインを完了し完全表示する */
    /* 4.16% {
      opacity: 1;
    } */
    /* ここまで完全表示を維持したらフェードアウトを開始する */
    /* 33.33% {
      opacity: 1;
    } */
    /* フェードアウトを完了し非表示にする */
    /* 41.66% {
      opacity: 0;
      
    } */
    50%{
        opacity: 1;
        
    }
    /* 80%{
        opacity: 0.8;
    } */
    100% {
      opacity: 1;
      transform: scale(1.15);/*ズームのための指定*/
    }
  }

#first_text {
    background-color: #fff;
}

.top_logo {
    position: absolute;
    top: 40%;
    text-align: center;
}

.top_logo img {
    width: 40%;
}

section#first {
    padding: 0;
}


.first_textbox {
    /* font-family: YuMincho,'Yu Mincho', serif; */
    /* font-size: 1.08rem; */
    line-height: 2.18rem;
    position: relative;
    z-index: 1;
    margin: 0 40px;
}

.first_textbox span {
    display: block;
}

@media(min-width:768px) {
    .first_textbox {
        text-align: center;
    }
}


.carousel {
    position: relative;
}

.navigation {
    display: flex;
    justify-content: center;
    align-items: center;
}

.carousel .indicator {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
}

.carousel .indicator li {
    width: 13px;
    height: 13px;
    margin-right: 7px;
    margin-left: 7px;
    background-color: #F5F4EF;
    border-radius: 100%;
    cursor: pointer;
}

@media(max-width: 351px) {
    .first_textbox {
        font-size: 0.85rem;
    }
}

@media(min-width: 376px) {
    .first_textbox {
        font-size: 1.08rem;
    }

}

@media(min-width: 1024px) {
    .first_text {
        line-height: 2.5rem;
    }
}


/*====================================
    ** ハンバーガーアイコン(スマホ時) **
  ====================================*/

.menu_btn {
    width: 50px;
    height: 50px;
    border-radius: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: rgb(214 3 63 / 26%);
    /* 位置を固定 */
    position: fixed;
    top: 5px;
    right: 5px;
    /* カーソルを指差しマークにする */
    cursor: pointer;
    /* メニューボタンの重なり順を一番上にする */
    z-index: 999;
    /*---------------------------z-index:999---*/
}

/* 三本線の真ん中 */
.menu__line {
    background-color: white;
    display: block;
    width: 30px;
    height: 2px;
    position: relative;
    /*3秒かけて変化する*/
    transition: all 0.3s;
}

/*三本線の上下*/
.menu__line::before,
.menu__line::after {
    content: "";
    display: block;
    width: 30px;
    height: 2px;
    position: absolute;

    /*3秒かけて変化*/
    transition: all 0.3s
}

/* 三本線の上 */
.menu__line::before {
    top: -10px;
    background-color: white;
}

/* 三本線の下 */
.menu__line::after {
    top: 10px;
    background-color: white;

}

@media(min-width:768px) {
    .menu_btn {
        display: none;
    }
}

/* ===================================================
 ** クラスactiveがつくとハンバーガーアイコンが「×」になる **
======================================================*/
/* 三本線の真ん中にクラスactiveが付いたとき */
.menu__line.active {
    background: transparent;
}

/* 三本線の上にクラスactiveが付いたとき */
.menu__line.active::before {
    transform: rotate(45deg);
    top: 0;
}

/* 三本線の下にクラスactiveが付いたとき */
.menu__line.active::after {
    transform: rotate(-45deg);
    top: 0;
}

/* ==============================================
          **  オーバーレイ  **
=================================================== */
.overlay {
    /*背景色　白*/
    background-color: white;
    position: fixed;
    top: 0;
    /*全画面表示*/
    width: 100%;
    height: 100%;
    /*子要素のoverlay_listを天地左右の中央揃え*/
    display: flex;
    justify-content: center;
    align-items: center;
    /* 不透明度0% */
    opacity: 0;
    /* 自分の横幅分、右に移動 */
    transform: translateY(-100%);
    /* 自分の横幅分、右に移動 */
    transition: all 0.3s;
    /* オーバーレイの重なり順を、mainより上、メニューボタンより下にする */
    z-index: 99;
    /*-----------------------------------------------z-index:99-------*/
}

.overlay_column {
    display: flex;
    flex-direction: column;
}

.overlay_logo {
    width: 160px;
    height: 50px;
    object-fit: contain;

}

.overlay_logo img {
    width: 100%;
    height: 50px;
    object-fit: contain;
}

overlay-box {
    display: flex;
    justify-content: center;
}

.overlay_list {
    display: flex;
    flex-direction: column;
    padding-top: 30px;

}

.overlay__item {
    list-style: none;
    font-size: 20px;
    gap: 10px;
    color: rgb(127, 124, 124);
    padding: 5px 0;
    transition: 0.3s;


}

.overlay__item:hover {

    transform: scale(1.1);
}

/* =================================================
     ** クラスshowがつくとオーバーレイ部分が表示される **
===================================================*/
.overlay.show {
    /* 不透明度100% */
    opacity: 1;
    /* 移動なし */
    transform: none;
}

/*=====================================================
       **  About **
=======================================================*/
#About {
    background-color: #F7F2E4;
    padding-bottom: 0;
}

.midashi-box {
    /* padding-top: 80px; */
    font-family: serif;
    font-size: 1.17rem;
    color: #707070;
}

.midashi__About {
    position: relative;
    z-index: 1;
}

.midashi__About::before {
    content: "About";
    color: #EAD0E4;
    font-size: 2.5rem;
    font-weight: normal;
    font-family: 'Pinyon Script', cursive;
    position: absolute;
    text-align: center;
    top: -1.28rem;
    left: -1rem;
    transform: rotate(-17deg);
    z-index: -1;
}

@media(min-width:768px) {
    #About {
        padding-bottom: 80px;
    }

    .midashi__About::before {
        left: 15.5rem;
    }

    .midashi__setumei {
        text-align: center;
    }

    .midashi__setumei span {
        display: block;
    }

}

.midashi__setumei {
    padding-top: 50px;
    padding-bottom: 80px;
}

@media(min-width:1024px) {
    #About {
        padding-bottom: 100px;
    }

    .midashi__About::before {
        left: 15rem;
    }

    .midashi__setumei {
        padding-top: 100px;
        padding-bottom: 100px;
        line-height: 2rem;
    }
}

.Menu_photo {
    max-width: 600px;
    margin: 0 auto;
}

.Menu_photo img {
    width: 100%;
    vertical-align: bottom;
}

/*======================================
        ** Menu **
========================================*/
section#Menu {
    padding-bottom: 0;
    background-color: #fff;
}

.midashi__Menu {
    position: relative;
    z-index: 1;
}

.midashi__Menu::before {
    content: "Menu";
    color: #EAD0E4;
    font-size: 2.5rem;
    font-weight: normal;
    font-family: 'Pinyon Script', cursive;
    position: absolute;
    text-align: center;
    top: -1.28rem;
    left: -1rem;
    transform: rotate(-17deg);
    z-index: -1;
}

.Menu-syurui {
    background-image: url(./img/kabe_gray2000.jpg);
    background-size: cover;
    padding: 80px 0;
}

@media(min-width:768px) {
    .midashi__Menu::before {
        left: 15rem;
    }
}

@media(min-width:1024px) {
    .midashi__Menu::before {
        left: 15rem;
    }

    .Menu-syurui {
        padding: 60px 0 150px;
    }
}

@media(min-width:1440px) {
    .midashi__Menu::before {}
}


/* --------------------Menu card*/
ul.item-menu {
    display: flex;
    flex-direction: column;
    /* justify-content: center;--------------なぜ？ */
    align-items: center;
    list-style: none;
    margin: 0 auto;
    padding: 0;
}

li.item-menu__list {
    width: 240px;
    min-height: 371.6px;
    background-color: #fff;
    border-radius: 185px;
    border: 1px solid rgba(255, 255, 255, 0.5);
    -webkit-backdrop-filter: blur(30px);
    backdrop-filter: blur(30px);
    filter: drop-shadow(2px 1px 10px rgba(0, 0, 0, 0.1));
    display: flex;
    flex-direction: column;
}

li.item-menu__list:nth-child(2) {
    margin-top: 80px;
    margin-bottom: 80px;
}

.image-menu {
    width: 175px;
    margin: 2rem auto 0;
}

.image-menu img {
    width: 100%;
    /* filter: drop-shadow(20px 10px 15px rgba(0, 0, 0, 0.2)); */

}

.title-menu {
    padding: 1rem;
    color: #5B5A5C;
    font-weight: bold;
    text-align: center;
    font-size: 30px;
    font-family: serif;
}

a.link-btn {
    width: 110px;
    background-color: #fff;
    border-radius: 30px;
    border: 1px solid;
    font-size: 1.25rem;
    padding: 0.3rem 0;
    text-align: center;
    margin: auto auto 2.35rem;
    transition: all 0.5s;
    /* box-shadow: 1px 2px 6px -1px rgba(0, 0, 0, 0.3); */

}

a.link-btn:hover {
    /* background-color: #BF0101; */
    background-color: #A50606;
    /* background-color: #851111; */
    /* background-color: #FFF8F9; */
    color: #fff;
    border: 0.3px solid;
    /* opacity: 0.3; */
}

@media(min-width:1024px) {
    ul.item-menu {
        flex-direction: row;
        justify-content: space-around;
    }

    li.item-menu__list:nth-child(2) {
        margin-top: 200px;
        margin-bottom: 0;
    }

}

/* =====================================
         **  Orchard **
========================================*/
section#Orchard {
    padding-bottom: 0;
    background-color: #fff;
}

.midashi__Orchard {
    position: relative;
    z-index: 1;
}

.midashi__Orchard::before {
    content: "Orchard";
    color: #EAD0E4;
    font-size: 2.5rem;
    font-weight: normal;
    font-family: 'Pinyon Script', cursive;
    position: absolute;
    text-align: center;
    top: -1.28rem;
    left: -1rem;
    transform: rotate(-17deg);
    z-index: -1;
}

@media(min-width:768px) {
    .midashi__Orchard::before {
        left: 14.5rem;
    }
}

@media(min-width:1024px) {
    .midashi__Orchard::before {
        left: 14.5rem;
    }
}

@media(min-width:1440px) {
    .midashi__Orchard::before {}
}

/* ---------------Orchard_syousai*/

.Orchard-syousai01 {
    background-image: url(./img/kabe_gray_light2000.jpg);
    padding-top: 40px;
    padding-bottom: 80px;
}

.taiken-container {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.taiken-container__box {
    background-color: #fff;
    padding: 17px 17px 20px;
    margin-bottom: 40px;
    width: 280px;
    box-shadow: -1px -1px 4px -7px rgba(255, 255, 255, 0.1), 1px 2px 6px -1px rgba(0, 0, 0, 0.2);
}

@media (min-width:768px) {
    .taiken-container {
        flex-direction: row;
        justify-content: space-between;
    }

}

@media (min-width:1024px) {
    .taiken-container {
        flex-direction: row;
        justify-content: space-between;
    }
}

.Orchard-syousai02 {
    padding-bottom: 0;
}

.taiken-container__box img {
    width: 100%;
    vertical-align: bottom;
}

.taiken-box__title {
    padding: 20px 0;
    font-size: 1.25rem;
}

.taiken-box__setumei {
    line-height: 1.875rem;
}

.taiken__syousai {
    font-size: 1.25rem;
    padding-left: .8rem;
    border-left: 8px solid #F4D6D6;
}

.taiken__season {
    padding: 20px 0 30px 20px;
}

/* --------------------表組 */
table {
    border-collapse: collapse;
}

.syousai-box {
    padding-top: 30px;
}

table th,
table td {
    border: solid 1.8px black;
    padding: 5px;

    /*実線 1px 黒*/
}

.syousaibox__table {
    width: 100%;
}

.syousaibox__table td {
    text-align: right;
    background-color: #fff;
    white-space: nowrap;
}

.syousaibox__table th {
    text-align: left;
    font-weight: 600;
    background-color: #FDF8FC;
}

@media(min-width:768px) {
    .syousai-utiwake {
        width: 500px;
    }
}

@media(min-width:1024px) {
    .Orchard-syousai01 {
        padding-top: 80px;
        padding-bottom: 105px;
    }
}

/*余白と文字装飾は省略*/
.yoyaku-contact {
    padding-top: 20px;
}

.yoyaku-contact__Method {
    /* padding-top: 15px; */
    font-size: .87rem;
}

/* -------------button */
.container {
    width: 150px;
    height: 80px;
    margin: 30px auto 0;
}

.button_wrap {
    width: 100%;
    height: 75%;
    position: relative;
    transform-style: preserve-3d;
    perspective: 800px;
    transition: transform 1.4s;
}

.container:hover .button_wrap {
    transform: rotateX(180deg);
}

.front,
.back {
    display: block;
    width: 100%;
    height: 100%;
    /* box-shadow: -1px -1px 4px -7px rgba(255, 255, 255, 0.5), 1px 2px 6px -1px rgba(0, 0, 0, 0.3); */
    border-radius: 60px;
    padding: 10px;
    font-weight: bold;
    font-size: 20px;
    font-family: YuMincho, 'Yu Mincho', serif;
    letter-spacing: 0.056rem;
    backface-visibility: hidden;
    position: absolute;
}

button:hover {
    cursor: pointer;
}

.front {
    background-color: #fff;
    border: 0.3px solid #5B5A5C;
    color: #5B5A5C;
    border: 1px solid;
}

.back {
    transform: rotateX(180deg);
    background-color: #A50606;
    color: #fff;
    border: 0.3px solid white;
}

/*========================================
           ** Shop **
=========================================*/
#Shop {
    background-color: #fff;
}

.midashi__Shop {
    position: relative;
    z-index: 1;
}

.midashi__Shop::before {
    content: "Shop";
    color: #EAD0E4;
    font-size: 2.5rem;
    font-weight: normal;
    font-family: 'Pinyon Script', cursive;
    /* font-family: 'Great Vibes', cursive;
    font-family: 'Roboto', sans-serif;
    font-family: 'Satisfy', cursive;
    font-family: 'Tangerine', cursive; */
    position: absolute;
    text-align: center;
    top: -1.28rem;
    left: -1rem;
    transform: rotate(-17deg);
    z-index: -1;
}

@media(min-width:768px) {
    .midashi__Shop::before {
        left: 15.5rem;
    }

}

@media(min-width:1024px) {
    .midashi__Shop::before {
        left: 15.5rem;
    }
}

@media(min-width:1440px) {
    .midashi__Shop::before {}
}

address {
    font-style: normal;
}

.accsess {
    font-size: 1.28rem;
    padding-top: 50px;
    position: relative;
}

.accsess::before {
    content: "";
    width: 230px;
    height: 3px;
    border-radius: 2px;
    background-color: #FAEDF7;
    position: absolute;
    bottom: -0.35rem;
    left: 0;
    right: 0;
}

address ul {
    padding-left: 0;
    padding-top: 20px;
}

iframe {
    max-width: 600px;
    height: 250px;
    margin: 0 auto;
}

.map {
    background: url(./img/map.png)no-repeat left center;
    background-size: 22px;
    /* padding-top: 30px;     */
    padding: 10px 0 10px 35px;
}

.time {
    background: url(./img/tokei.png)no-repeat left center;
    background-size: 22px;
    /* padding-top: 30px;     */
    padding: 10px 0 10px 35px
}

.tell {
    background: url(./img/tell.png)no-repeat left center;
    background-size: 22px;
    /* padding-top: 30px;     */
    padding: 10px 0 10px 35px
}

.shop_map {
    padding-top: 20px;
}

@media (min-width:768px) {
    .address-box {
        display: flex;
        justify-content: center;
    }

    iframe {
        width: 100%;
    }
}

@media (min-width:1024px) {
    .accsess {
        padding-top: 100px;
        font-size: 1.6rem;
    }

    .accsess::before {
        content: "";
        width: 286px;
    }

    address ul {
        padding-top: 60px;
    }
}


/* ===================================
        ** Recruit **
=====================================*/
#Recruit {
    background-color: #FDFBF4;
}

.midashi__Recruit {
    position: relative;
    z-index: 1;
}

.midashi__Recruit::before {
    content: "Recruit";
    color: #EAD0E4;
    font-size: 2.5rem;
    font-weight: normal;
    font-family: 'Pinyon Script', cursive;
    /* font-family: 'Great Vibes', cursive;
    font-family: 'Roboto', sans-serif;
    font-family: 'Satisfy', cursive;
    font-family: 'Tangerine', cursive; */
    position: absolute;
    text-align: center;
    top: -1.28rem;
    left: -1rem;
    transform: rotate(-17deg);
    z-index: -1;
}

.situation {
    font-size: 1.25rem;
    position: relative;
}

.situation::before {
    content: "";
    width: 80px;
    height: 3px;
    border-radius: 2px;
    background-color: #FAEDF7;
    position: absolute;
    bottom: -0.01rem;
    left: 0;
    right: 0;
}

.syousaibox__table02 {
    width: 100%;
    padding-top: 1rem;

}

.syousaibox__table02 th {
    background-color: #FDF8FC;
    padding: 23px;
    white-space: nowrap;
    font-size: 0.85rem;
    font-weight: normal;

}

.syousaibox__table02 td {
    font-size: 0.75rem;
    background-color: #fff;
    padding: 15px;
    white-space: nowrap;
}

.company {
    padding-left: 0;
}

@media(min-width:768px) {
    .midashi__Recruit::before {
        left: 14.5rem;
    }

    .syousaibox__table02 th {
        font-size: 1rem;
    }

    .syousaibox__table02 td {
        font-size: 1rem;
    }

}

@media(min-width:1024px) {
    .midashi__Recruit::before {
        left: 14.5rem;
    }
}

@media(min-width:1440px) {
    .midashi__Recruit::before {}
}

/* ==================================
        ** Contact **
====================================*/
#Contact {
    background-color: #fff;
}

section#Contact {
    padding-bottom: 0;
}

.midashi__Contact {
    position: relative;
    z-index: 1;
}

.midashi__Contact::before {
    content: "Contact";
    color: #EAD0E4;
    font-size: 2.5rem;
    font-weight: normal;
    font-family: 'Pinyon Script', cursive;
    /* font-family: 'Great Vibes', cursive;
    font-family: 'Roboto', sans-serif;
    font-family: 'Satisfy', cursive;
    font-family: 'Tangerine', cursive; */
    position: absolute;
    text-align: center;
    top: -1.28rem;
    left: -1rem;
    transform: rotate(-17deg);
    z-index: -1;
}

.midashi__setumei02 {
    font-size: 0.97rem;
    padding-top: 50px;
    padding-bottom: 60px;
}

@media(min-width:768px) {
    .midashi__Contact::before {
        left: 14.5rem;
    }

    .midashi__setumei02 span {
        display: block;
    }

    .midashi__setumei02 {
        text-align: center;
    }

}

@media(min-width:1024px) {
    .midashi__Contact::before {
        left: 14.5rem;
    }

    .midashi__setumei02 {
        padding-top: 80px;
        padding-bottom: 70px;
        line-height: 2rem;
    }


}

@media(min-width:1440px) {
    .midashi__Contact::before {}
}

.form {
    background-image: url(./img/kabe_contact.jpg);
    background-size: cover;
    padding-top: 60px;
    padding-bottom: 80px;
}

.form-inner {
    margin-bottom: 1rem;
}

.form__label {
    font-weight: bold;
    margin-bottom: 0.625rem;
}

.form__label label {
    vertical-align: middle;
}

.required {
    display: inline;
    background: #ea7474;
    color: #fff;
    font-size: 0.75rem;
    padding: 0.35rem;
    margin-left: 0.5rem;
    vertical-align: middle;
}

input[type="text"],
input[type="email"],
input[type="date"] {
    width: 100%;
    height: 40px;
    background: #fff;
    padding: 1rem;
}

.button-container {
    width: 120px;
    height: 50px;
    margin: 30px auto 0;
}

.button__wrap02 {
    width: 100%;
    height: 100%;
    position: relative;
    transform-style: preserve-3d;
    perspective: 800px;
    transition: transform 1.4s;
}

.button-container:hover .button__wrap02 {
    transform: rotateX(180deg);
}

.form-btn02,
.form-btn03 {

    display: block;
    width: 100%;
    height: 100%;

    /* background-color: #C2C1BF; */
    background-color: #fff;
    /* box-shadow: -1px -1px 4px -7px rgba(255, 255, 255, 0.5), 1px 2px 6px -1px rgba(0, 0, 0, 0.3); */
    border-radius: 60px;
    padding: 10px;
    font-weight: bold;

    font-size: 1.05rem;
    font-family: YuMincho, 'Yu Mincho', serif;
    letter-spacing: 0.056rem;
    backface-visibility: hidden;
    position: absolute;
}

.form-btn02 {
    background-color: #fff;
    border: 0.3px solid #5B5A5C;
    color: #5B5A5C;
    border: 1px solid;

}

.form-btn03 {
    transform: rotateX(180deg);
    background-color: #A50606;
    color: #fff;
    border: 0.3px solid white;
}

#Contact {}

/*==================================
        ** footer **
=====================================*/
footer {
    background-image: url(./img/footer.jpg);
    background-size: cover;
}

.nav-footerlogo {
    text-align: center;
    padding-top: 1rem;
}

.nav-footer .nav-footerlogo img {
    width: 100px;
    height: 40px;
    object-fit: contain;
}

.nav-list ul {
    text-align: center;
    padding: 0 0 1rem 0;
}

.nav-list li {
    color: white;
    line-height: 1.8rem;
}

.nav-footer a {
    transition-duration: 1s;
}

.nav-footer a:hover {
    opacity: 0.5;
}

/* ====================================
      ** page_top btn **
======================================= */
.page_top {
    width: 35px;
    height: 45px;
    cursor: pointer;
    /* 右下に固定 */
    position: fixed;
    right: 10px;
    bottom: 230px;
    /* 最初は不透明度０ */
    opacity: 0;
    /* 最初は100px右に配置 */
    transform: translateX(100px);
    /* トランジション */
    transition: all 0.3s;

}

.page_top img {
    max-width: 100%;
}

.page_top.show {
    opacity: 1;
    transform: none;
}

@media(min-width:768px) {
    .page_top {
        width: 55px;
        height: 65px;
        right: 35px;
    }
}

@media(max-width:767px) {
    .page_top {
        display: none;
    }
}

@media(min-width:1024px) {
    .page_top {
        right: 100px;
    }
}

/* ========================================
       ** ふわふわアニメーション2 **
=========================================== */
.page_top {
    animation: fuwafuwa 3s ease-in-out infinite alternate;
    transition: 1.5s ease-in-out;
}

@keyframes fuwafuwa {
    0% {
        transform: translate(0, 0) rotate(-20deg);
    }

    50% {
        transform: translate(0, -20px) rotate(0deg);
    }

    100% {
        transform: translate(0, 0) rotate(20deg);
    }
}

/* ========================================
        ** ふわふわアニメーション1 **
========================================== */
/* .item-menu__list:nth-child(1) {
    animation: fuwafuwa1 3s ease-in-out infinite alternate;
    transition: 1.5s ease-in-out;
}  */

/* @keyframes fuwafuwa1 {
    0% {
        transform: translate(0, -1px) rotate(-0.5deg);
    }

    50% {
        transform: translate(0, 1px) rotate(0deg);
    }

    100% {
        transform: translate(0, -1px) rotate(0.5deg);
    }
} */

.item-menu__list:nth-child(2) {
    /* animation: fuwafuwa1-2 3s ease-in-out infinite alternate;
    transition: 1.5s ease-in-out; */
}

/* @keyframes fuwafuwa1-2 {
    0% {
        transform: translate(0, 1px) rotate(0.5deg);
    }

    50% {
        transform: translate(0, -1px) rotate(0deg);
    }

    100% {
        transform: translate(0, 1px) rotate(-0.5deg);
    }
} */

.item-menu__list:nth-child(3) {
    /* animation: fuwafuwa1-3 3s ease-in-out infinite alternate;
    transition: 1.5s ease-in-out; */
}

/* @keyframes fuwafuwa1-3 {
    0% {
        transform: translate(0, -1px) rotate(-0.5deg);
    }

    50% {
        transform: translate(0, 1px) rotate(0deg);
    }

    100% {
        transform: translate(0, -1px) rotate(0.5deg);
    }
} */
/* ========================================
        ** フェードインアニメーション **
========================================== */
/* 基本のフェードイン（変化前） */

.first_textbox,
.midashi__setumei,
.Menu_photo,
.item-menu__list,
.taiken-container__box,
.address-box,
.shop_map,
.midashi__setumei02,
.formbox {
    opacity: 0;
    transition: all 0.5s;
}

/* 下の方から表示 */
.first_textbox,
.midashi__setumei,
.Menu_photo,
.item-menu__list,
.taiken-container__box,
.address-box,
.shop_map,
.midashi__setumei02,
.formbox {
    transform: translateY(50px);
}

/* 基本のフェードイン（変化後） */
.first_textbox.show,
.midashi__setumei.show,
.Menu_photo.show,
.item-menu__list.show,
.taiken-container__box.show,
.address-box.show,
.shop_map.show,
.midashi__setumei02.show,
.formbox.show {
    opacity: 1;
    transform: none;
}

/* 順番に表示（メニューカード） */
.item-menu__list:nth-child(2) {
    transition-delay: 0.1s;
}

.item-menu__list:nth-child(3) {
    transition-delay: 0.2s;
}

/* 順番に表示（農園カード） */
.taiken-container__box:nth-child(2) {
    transition-delay: 0.2s;
}

/* 基本のフェードイン（変化前） */
.syousai-waku,
.Recruit-syousai,
.formbox {
    opacity: 0;
    transition: all 0.5s;
}

/* 下の方から表示 */
.syousai-waku,
.Recruit-syousai,
.formbox {
    transform: translateY(20px);
}

/* 基本のフェードイン（変化後） */
.syousai-waku.show,
.Recruit-syousai.show,
.formbox.show {
    opacity: 1;
    transform: none;
}