@charset "UTF-8";
/*
* this css file for original style
*
*
*/
/*=====================
* root
=====================*/
:root {
    --def-black: #333333;
    --def-gray-dark: #999;
    --def-gray-light: #ccc;
    --def-gray-hightlight: #dedede;
    --text-link-color: #1686D1;
  
    --primary-color: #5D452A;
    --primary-color-rgb: 93,69,42;
    --primary-color-comp: #ffffff;
    --primary-color-comp-rgb: 255,255,255;
    --primary-color-impact: #8dff98;
  
    --secondary-color: #B7A77A;
    --secondary-color-rgb: 183, 167, 122;
    --tertiary-color: #FF2700;
    --quaternary-color: #BEDBC1;
  
    --shdow-color-rgb: 0,0,0;
  }

/*=====================
* General
=======================*/
body {
    padding-bottom: 0;
}

/*=====================
* Module
=======================*/
/*--- hdg ---*/
.hdg_lv2.font-stayle {
    font-size: 2.8em;
    font-family: 'Fraunces', serif;
    text-align: center;
    margin: 0 auto;
}
.hdg_lv3 {
    font-family: '游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro', serif;
    line-height: 1.72;
}
.hdg_lv3.font-stayle {
    font-size: 2.1em;
    font-family: 'Fraunces', serif;
    text-align: center;
}
.hdg_lv4.font-stayle {
    font-size: 1.6em;
    font-family: 'Fraunces', serif;
    text-align: center;
}
.hdg_lv5.font-stayle {
    font-size: 1.2em;
    font-family: 'Fraunces', serif;
    margin: 0.8em 0;
    line-height: 1.6;
}
.sub-title {
    display: block;
    font-size: 0.4em;
    font-weight: lighter;
    font-family: 'Questrial', Verdana, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
    color: var(--def-gray-dark);
    margin-top: 1.2em;
}
/*--- section ---*/
[id*='-section']{
    position: relative;
}
[id*='-section']::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    z-index: 0;
    transform: scale(1, 1);
    display: block;
    width: 100%;
    height: 200%;
    background-image: url('../../common/images/background_image.svg');
    background-repeat: no-repeat;
    margin: 0;
    background-position: right;
    mix-blend-mode: multiply;
}
/*--- btn ---*/
.btn_lv1 > a {
    background-color: var(--primary-color);
}
.btn_lv2 > a{
    border: 1px solid var(--primary-color);
    color: var(--primary-color);
  }
/*--- btn-large-list ---*/
.btn-large-list {
    display: flex;
    justify-content: center;
    align-items: center;
}
.btn-large-list li {
    margin: 0.8em;
    width: calc(50% - 1.6em);
    text-align: center;
}
.btn-large-list li a {
    display: block;
    width: 80%;
    border: 1px solid var(--primary-color);
    padding: 0.8em 1.6em;
    box-shadow: 3px 3px 6px rgba(var(--shdow-color-rgb), 0.3);
}
/*--- button-list ---*/
.button-list {
    margin-top: 2em;
    text-align: center;
}
.button-list .btn_lv1 {
    margin-bottom: 1.6em;
}
.button-list .btn_lv2 > a {
    font-size: 0.8em;
}
/*--- separate-no-line ---*/
.separate-no-line {
    border: 0;
}
@media screen and (max-width:960px) {
    [id*='-section']::after {
        width: 100%;
        /* background-image: none; */
    }
}
@media screen and (max-width:520px) {
    [id*='-section']::after {
        background-image: none;
    }
    .btn-large-list {
        display: block;
    }
    .btn_lv1 > a {
        display: block;
    }
    .button-list .btn_lv2 > a {
        display: block;
    }
}
.reserved-button {
    background-color: var(--primary-color);
    padding: 0.2em 0.4em;
    border-radius: 0.2em;
}
header > #humberger > nav > ul > li.reserved-button > a {
    color: var(--primary-color-comp);
}
/*=====================
* loading
======================*/
.loading img {
    width: 130px;
}
/*=====================
* main-visual-section
=======================*/
#main-visual-section {
    position: inherit;
}
#main-visual-section::after {
    content: none;
}
@media screen and (max-width:960px) {
    header > .title {
        margin: 0 auto;
        float: inherit;
    }
}

/*=====================
* front-page
=======================*/
#front-page > main > #main-visual-section {
    background-image: url('../../common/images/main_visual.png');
    background-size: cover;
    height: 98vh;
    position: relative;
    overflow: hidden;
  }
  .webp #front-page > main > #main-visual-section {
    background-image: url('../../common/images/main_visual.webp');
  }
  #front-page > main > #main-visual-section.day-time {
    background-image: url('../../common/images/main_visual.png');
  }
  .webp #front-page > main > #main-visual-section.day-time {
    background-image: url('../../common/images/main_visual.webp');
  }
  #front-page > main > #main-visual-section.evening-time {
    background-image: url('../../common/images/main_visual_02.png');
  }
  .webp #front-page > main > #main-visual-section.evening-time {
    background-image: url('../../common/images/main_visual_02.webp');
  }
  #front-page > main > #main-visual-section .inner {
    position: initial;
  }
  #front-page > main > #main-visual-section .inner .page-logo {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    width: 38vw;
  }
@media screen and (max-width:960px) {
    #front-page > main > #main-visual-section {
        height: 78vh;
    }
    #front-page > main > #main-visual-section .inner .page-logo {
        top: 42%;
        width: 60%;
    }
}
@media screen and (max-width:520px) {
    #front-page > main > #main-visual-section .inner .page-logo {
        top: 42%;
        width: 80%;
    }
}
/*=====================
* wave
=======================*/
/* waves */
.ocean {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 200%;
    z-index: 1;
}
.illust_top {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 32%;
    z-index: 0;
}
.waves {
position:relative;
width: 100%;
height:15vh;
margin-bottom:-7px; /*Fix for safari gap*/
min-height:100px;
max-height:150px;
}
.content {
position:relative;
height:20vh;
text-align:center;
background-color: white;
}
/* Animation */
.parallax > use {
animation: move-forever 25s cubic-bezier(.55,.5,.45,.5) infinite;
}
.parallax > use:nth-child(1) {
animation-delay: -2s;
animation-duration: 7s;
}
.parallax > use:nth-child(2) {
animation-delay: -3s;
animation-duration: 10s;
}
.parallax > use:nth-child(3) {
animation-delay: -4s;
animation-duration: 13s;
}
.parallax > use:nth-child(4) {
animation-delay: -5s;
animation-duration: 20s;
}
@keyframes move-forever {
0% {
transform: translate3d(-90px,0,0);
}
100% {
transform: translate3d(85px,0,0);
}
}
/*Shrinking for mobile*/
@media (max-width: 768px) {
.waves {
height:40px;
min-height:40px;
}
.content {
height:30vh;
}
}
/* ウェーブのアニメーション */
@keyframes wave {
    0% {transform: translateX(0);}
    50% {transform: translateX(-25%);}
    100% {transform: translateX(-50%);}
}
@media screen and (max-width:960px) {
    .ocean {
        height: 25%;
    }
    .ocean .waves {
        position: absolute;
        bottom: 0;
        height: 3vh;
    }
}
@media screen and (max-width:520px) {
}
/*=====================
* news-section
=======================*/

/*=====================
* concept-section
=======================*/
#concept-section::after {
    right: inherit;
    left: 0;
    transform: scale(-1, 1);
}
#concept-section > .inner > .col2 {
    padding-top: 5em;
}
#concept-section > .inner > .col2 > .item {
    min-height: 30vw;
}
#concept-section > .inner > .col2 > .item > figure {
    position: relative;
}
#concept-section > .inner > .col2 > .item > figure > picture {
    box-shadow: 6px 6px 12px rgba(var(--primary-color-rgb), 0.6);
    display: block;
}
#concept-section > .inner > .col2 > .item > figure > .image-01 {
    position: absolute;
    top: -2vw;
    right: -10vw;
}
#concept-section > .inner > .col2.reverse > .item > figure > .image-01 {
    right: initial;
    left: -10vw;
    max-width: 44vw;
}
#concept-section > .inner > .col2 > .item > figure > .image-02 {
    position: absolute;
    top: 16vw;
    left: -6vw;
    max-width: 20vw;
}
#concept-section > .inner > .col2.reverse > .item > figure > .image-02 {
    top: 12vw;
    left: initial;
    right: 1vw;
}
#concept-section > .inner > .col2 > .item > figure > .image-03 {
    position: absolute;
    top: 24vw;
    left: 6vw;
    z-index: -1;
    max-width: 15vw;
}
#concept-section > .inner > .col2.concept02 > .item > figure > .image-01 {
    position: absolute;
    max-width: 28vw;
    top: -5vw;
    right: 0vw;
}
#concept-section > .inner > .col2.concept02 > .item > figure > .image-02 {
    position: absolute;
    top: 24vw;
    left: -0vw;
    max-width: 19vw;
}
#concept-section > .inner > .col2 > .item > .hdg_lv3 {
    font-size: 1.8rem;
    font-weight: normal;
}
#concept-section > .inner > .col2 > .item > .text {
    line-height: 1.8;
}
/*-- ./info-border-box ---*/
.info-border-box {
    padding: 2.4em !important;
    margin-top: 11em;
    border: 1px solid var(--def-gray-light);
    border-radius: 1em;
}
.info-border-box .hdg_lv3{
    margin-top: 0;
}
.info-border-box > .item {
    min-height: inherit !important;
}
@media screen and (max-width:1350px) {
    #concept-section > .inner > .col2.reverse > .item > figure > .image-01 {
        left: -4vw;
    }
    #concept-section > .inner > .col2.concept02 > .item > figure > .image-01 {
        right: 6vw;
    }
    #concept-section > .inner > .col2.reverse > .item > figure > .image-02 {
        left: 24vw;
        right: 0;
    }
    #concept-section > .inner > .col2.concept02 > .item > figure > .image-02 {
        max-width: 20vw;
    }
    #concept-section > .inner > .col2 > .item > figure > .image-03 {
        top: 24vw;
        left: 16vw;
        z-index: 0;
        max-width: 16vw;
    }
}
@media screen and (max-width:1100px) {
    #concept-section > .inner > .col2.reverse > .item > figure > .image-01 {
        left: 0;
        max-width: 50vw;
    }
    #concept-section > .inner > .col2.concept02 > .item > figure > .image-01 {
        right: 6vw;
    }
    #concept-section > .inner > .col2.reverse > .item > figure > .image-02 {
        top: 19vw;
        left: 24vw;
        right: 0;
    }
    #concept-section > .inner > .col2.concept02 > .item > figure > .image-02 {
        max-width: 20vw;
    }
    #concept-section > .inner > .col2 > .item > figure > .image-03 {
        top: 27vw;
        left: 9vw;
        z-index: 0;
        max-width: 16vw;
    }
}
@media screen and (max-width:960px) {
    #concept-section > .inner > .col2 {
        padding-top: 0;
    }
    #concept-section > .inner > .col2 > .item > figure > .image-01 {
        right: 0;
    }
    #concept-section > .inner > .col2.reverse > .item > figure > .image-01 {
        top: 3vw;
        left: 50%;
        transform: translateX(-56%);
        max-width: initial;
        width: 58vw;
    }
    #concept-section > .inner > .col2.concept02 > .item > figure > .image-01 {
        max-width: initial;
        width: 31vw;
        top: 0;
        left: 56%;
        transform: translateX(-25%);
    }
    #concept-section > .inner > .col2.reverse > .item > figure > .image-02 {
        left: 68vw;
    }
    #concept-section > .inner > .col2.concept02 > .item > figure > .image-02 {
        top: 9vw;
        left: 23vw;
        max-width: 27vw;
    }
    #concept-section > .inner > .col2 > .item {
        min-height: inherit;
    }
    #concept-section > .inner > .col2 > .item > figure {
        height: 34vw;
    }
    #concept-section > .inner > .col2 > .item > figure > .image-03 {
        top: 29vw;
        left: 7vw;
        z-index: 0;
    }
    /*-- ./info-border-box ---*/
    .info-border-box {
        margin: 11em 2em 0;
    }
    .info-border-box .hdg_lv3{
        margin-top: 1em;
    }
    @media screen and (max-width:520px) {
        /*-- ./info-border-box ---*/
        .info-border-box {
            padding: 1.2em 0.8em !important;
            margin: 4.8em 1.2em 0;
        }
    }
}
@media screen and (max-width:520px) {
    #concept-section > .inner > .col2 > .item > .hdg_lv3 {
        font-size: 1.6rem;
    }
    #concept-section > .inner > .col2 > .item > figure {
        height: inherit;
        display: flex;
        flex-wrap: wrap;
    }
    #concept-section > .inner > .col2.reverse > .item > figure > .image-02,
    #concept-section > .inner > .col2 > .item > figure > .image-01,
    #concept-section > .inner > .col2 > .item > figure > .image-02,
    #concept-section > .inner > .col2 > .item > figure > .image-03,
    #concept-section > .inner > .col2.concept02 > .item > figure > .image-01,
    #concept-section > .inner > .col2.concept02 > .item > figure > .image-02 {
        position: initial;
    }
    #concept-section > .inner > .col2.reverse > .item > figure > .image-01 {
        left: inherit;
        transform: inherit;
        width: 100%;
    }
    #concept-section > .inner > .col2 > .item > figure > .image-01 {
        flex-grow: 2;
        width: 100%;
    }
    #concept-section > .inner > .col2 > .item > figure > .image-02,
    #concept-section > .inner > .col2 > .item > figure > .image-03 {
        flex-grow: 1;
        width: 50%;
        max-width: inherit;
    }
    #concept-section > .inner > .col2.concept02 > .item > figure > .image-01 {
        width: 50%;
        left: inherit;
        transform: inherit;
    }
    #concept-section > .inner > .col2.concept02 > .item > figure > .image-01 > img {
        width: 100%;
        object-fit: cover;
        aspect-ratio: 1/1;
    }
    #concept-section > .inner > .col2.concept02 > .item > figure > .image-02 {
        width: 50%;
        max-width: inherit;
    }
}
@media screen and (max-width:375px) {
    #concept-section > .inner > .col2 > .item > .hdg_lv3 {
        font-size: 1.4rem;
    }
}
/*=====================
* about-section
=======================*/
#about-section {
    position: relative;
    background-image: url('../../common/images/about_section_background.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    color: var(--primary-color-comp);
    animation: 0.4s backgroundImageAnime 0.9s forwards;
    padding: 120px 0 30px;
}
@keyframes fadeinlogo {
	0% {
        opacity: 0;
        transform: scale(0.7);
  }
	100% {
		opacity: 1;
        transform: scale(1.0);
  }
}
.webp #about-section {
    background-image: url('../../common/images/about_section_background.webp');
}
#about-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    /* background-color: rgba(var(--primary-color-rgb), 0.6); */
    background-color: rgba(var(--shdow-color-rgb), 0.6);
}
#about-section::after {
    content: none;
}
#about-section .col2 > .item {
    padding: 1.2em;
}
#about-section .col2 .item figure > picture {
    display: block;
    margin-bottom: 1.2em;
} 
#about-section .info > .item > dt {
    min-width: 9em;
}
#about-section .btn_lv2 > a {
    border-color: var(--primary-color-comp);
    color: var(--primary-color-comp);
}
/*=====================
* menu-section
=======================*/
#menu-section::after {
    top: -50%;
    transform: scale(1, -1);
}
#menu-section .btn_lv2 {
    text-align: center;
}
#menu-section .news-items.boxs > .item .discription {
    min-height: 100px;
}
.news-items.boxs.col2 > .item {
    padding-bottom: 0;
}
.news-items.boxs > .item .discription > .inner {
    justify-content: flex-start;
}
#menu-section .news-items.boxs > .item .discription > .inner > .btn_lv3 {
    margin-bottom: 0;
}
.price {
    text-align: right;
    background-color: rgba(var(--secondary-color-rgb), 0.6);
    padding: 0.1em 0.28em;
    border-radius: 0.2em;   
}
.price .unit {
    font-size: 0.9em;
}
/*=====================
* gallery-section
=======================*/
#gallery-section::after {
    top: -100%;
    right: inherit;
    left: 0;
    transform: scale(-1, -1);
}


/*=====================
* footer
=======================*/
footer {
    background-color: var(--secondary-color);
    color: var(--primary-color-comp)
}
footer .col2 {
    justify-content: center;
    align-items: center;
    margin: 0 0 1.2em;
}
footer .item > .info {
    font-size: 0.8em;
}
footer .item > .info > .item {
    margin: 0;
}
footer .item > .footer-logo > figure {
    width: 40%;
    margin-left: auto;
    margin-bottom: 0.4em;
}
footer .item > .sns-follow {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
footer .item > .sns-follow > li {
    margin: 0 0.4em;
    max-width: 24px;
}
footer .item > .sns-follow > li > a {
    max-width: 24px;
}
footer .footer {
    background-color: var(--primary-color);
}
/*=====================
* single & archive
=======================*/
#archive  [id*='-section'] {
  overflow: hidden;
  margin-bottom: 0;
  padding-bottom: 0;
}
@media screen and (max-width:960px) {
    #archive-section h1{
        text-align: center;
    }
}
@media screen and (max-width:520px) {
}
/*=====================
* menu-under-page
=======================*/
#menu-list-section .inner .news-items,
#menu-list-section .col2 {
    margin-bottom: 6em;
}
#menu-list-section .news-items.boxs.col2 > .item .discription {
    padding: 0;
  }
#menu-list-section .col2.horizon > .item > figure {
    margin: 0;
    margin-right: 0.8em;
}
#menu-list-section .list-menu > .item .hdg_lv3 {
    margin: 0 0 0.6em;
}
#menu-list-section .list-menu > .item > .item_inner_text > p,
#menu-list-section .list-menu > .item > .item_inner_text > ul > li {
    font-size: 0.8em;
    line-height: 1.4;
    margin-top: 0;
}
#menu-list-section .list-menu > .item > .item_inner_text > ul > li {
    list-style: disc;
    margin-left: 1.2em;
}
#menu-list-section .list-menu > .item {
    margin-bottom: 2.4em;
    border-bottom: 1px solid var(--def-gray-hightlight);
}
#menu-list-section .list-menu > .item ul {
    padding-bottom: 1.2em;
}
#menu-list-section .text.ta-c {
    margin-bottom: 4em;
}
@media screen and (max-width:960px) {
    #menu-list-section .inner > .text{
        padding: 0 1.2em;
    }
}
@media screen and (max-width:520px) {
}