@charset "utf-8";
/*==========================
common
==========================*/
:root {
    --primary-white: #c9d3da ;
    --primary-black: #303038;
    --primary-Indigo: #415769;
    --primary-orange: #bc9a40;
    --primary-braun: #5d370c;
    --contentWidth: 91.4%;
    --contentPadding: 4.2%;
}

html {
    font-size: 62.5% ;
}


body {
    font-family: "Shimanami JIS2004" , "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
    font-style: normal ;
    color: var(--primary-black) ;
    background-color: var(--primary-white) ;
    line-height: normal ;
    margin: 0 ;
    padding: 0 ;
    text-decoration: none ;
}

img {
    max-width: 100% ;
    height: auto ;
}

video {
    width: 100% ;
    height: auto ;
    display: block ;
    margin: auto ;
}

a {
    text-decoration: none ;  
}

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

.topic {
    display: inline-block ;
    font-family: "UDDigiKyokasho R JIS2004" ;
    font-size: 2.5rem ;
}

.topic::before {
    content: url(../images/zyuounen.png) ;
    display: inline-block ;
    margin-right: .5em;
}

.marker {
    background-image: linear-gradient(90deg,var(--primary-orange,),var(--primary-orange)); /* 線の色 */
    background-position: left bottom; /* 線の起点を左・下に設定 */
    background-repeat: no-repeat;
    background-size: 0 .5em; /* 線の横幅を0、縦幅を0.5emに */
    padding-bottom: 0px ; /* 下線を下にズラす */
    transition: background-size 1.5s; /* 線を伸ばすアニメーション実行時間を指定 */
  }
  /* マーカーが表示された時のスタイル */
  .marker.active {
    background-size: 100% .5em; /* 線の横幅を100%にする */
  }

  .ins {
    width: 40px ;
    margin-top: 30px ;
}

/*==========================
header
==========================*/
.header {
    width: 100vw ;
    margin: 0px ;
    padding: 0px ;
    height: 68px ;
    display: flex ;
    justify-content:space-between ;
    align-items: center ;
    padding: 0 26px ;
    background-color: var(--primary-Indigo);
}
    
.nav__topic {
    width: 100vw ;
    height:66px ;
    display: flex ;
    justify-content:space-between ;
    align-items: center ;
}

/* .nav初期表示 */
.nav {
    background: var(--primary-Indigo);
    padding: 0 26px 0 0 ;
    width: 100vw ;
    height: 100vh ; 
    position: fixed ;
    top: 0 ;
    left: 0 ;
    z-index:100 ;
    transform: translatex(-100%) ;
    transition:transform 0.4ms ;
}

.nav__logo {
    width: 50vw;
    margin: 0 auto ;
    margin-top: 50px;
    max-width: 350px ;
}

.nav__list {
    margin: 0 ;
    padding: 0;
    margin-top: 50Px ;
    color: var(--primary-white)
}

.nav__item {
    display:flex ;
    flex-direction: column ;
    font-family: "UDDigiKyokasho R JIS2004" ;
    font-size: 1.8rem ;
    margin-top: 30px ;
    align-items: center ;    
    justify-content: space-between ;
}

.nav__item a {
    color: var(--primary-white) ;
}

.nav__item:first-of-type {
    margin-top: 0 ;
}

.nav.active {
    transform: translateX(0) ;
    margin: 0 ;
    padding: 0 ;
}

.nav__ins {
    width: 8vw;
    margin: 0 auto ;
    margin-top: 50px ;
    max-width: 50px ;
}

.nav__btn {
    cursor: pointer ;
    width: 42px ;
    height: 42px ;
    margin:0 26px 0 auto ;
}

.header__btn__outer {
    width: 100wv;
    margin:0 0 0 auto ;
}

.header__btn {
    cursor: pointer ;
    width: 42px ;
    height: 42px ;
}



/* ============================
    main 
===============================*/

.mainmov {
    width: 100vw ;
    height: 100vh ;
}

.mainmov .main__mov__sp {
    width: 100% ;
    max-width: 500px ;
}

/* main pc */

@media screen and (min-width:769px) {
}

/*==========================
about
==========================*/
.topic--about {
    width: 380px ;
    margin-left:auto ;
    margin-right: 15px ;
    margin-top: 100px ;
    display: flex ;
}

.about__area {
    width: 100vw;
    height: auto ;
}

.about__item {
    width: 100vw ;
    height: auto ;
}

.about__text__outer {
    width: 100vw ;
    height: 100vh ;
    margin: 0 auto ;
    max-width: 700px ;

}

.about__topics {
    display: inline-block ;
    width: 80vw ;
    font-size: 2.0rem ;
    margin:100px 15px 15px 15px ;
}

.about__topics span {
    display: inline-block ;
    display: flex ;
}

.about__topics__bottom {
    margin-left: 2rem ;
}

.about__img {
    width: 100vw ;
    height: auto ;
    margin:  0 auto ;
    margin-top: 15px ;
    max-width: 700px ;
}

.about__img img {
    width: 100vw ;
    height: auto ;
}

.about__text {
    width: 92vw ;
    height: auto ;
    font-size: 1.6rem;
    margin:30px auto ;
    max-width: 700px ;
}

.about__lead {
    display: flex ;
    margin-top: 80px ;
    width: 100vw ;
    height: 50vh ;
}

.lead__text__outer {
    display: flex ;
    flex-direction: column ;
    width: 50% ;
    height: auto ;
    align-items: center ;
    justify-content: center ;
}

.lead__text {
    width: 85% ;
    height: auto ;
    font-size: 1.6rem ;
}

.lead__img__outer {
    width: 50% ;
    position: relative ;
}

.lead__img {
    width: 95% ;
    position: absolute ;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 500px ;
}


/* about pc */

@media screen and (min-width:769px) {

}

/*==========================
menu
==========================*/
.topic--menu {
    width: 250px ;
    margin-left:auto;
    margin-right: 15px ;
    margin-top: 100px ;
}

.menu__area {
    width: 100vw ;
    height: auto ;
}

.menu__topic {
    width: 200px  ;
    font-size: 2.0rem ;
    text-align: center ;
    position: relative ;
    margin-top: 80px ;
}

.menu__topic::before,.menu__topic::after {
    content: '';
    position: absolute;
    top: 50%;
    display: inline-block;
    width: 50px;
    height: 3px;
    border-top: solid 1px var(--primary-black);
    border-bottom: solid 1px var(--primary-black);
}

.menu__topic:before {
    left: 2%;
}
.menu__topic:after {
    right: 2%;
}


.menu__lead {
    width: 92vw ;
    height: auto ;
    font-size: 1.6rem;
    max-width: 680px ;
    margin: 30px auto ;
}

.menu__ins {
    display: flex ;
    justify-content: center ;
}

.menu__content {
    margin-top: 50px ;
}

.menu__content__title {
    width: 50vw ;
    font-size: 1.8rem;
    margin-top: 50px ;
    margin-left: 15px ;
}

.menu__detail {
    margin: 0 auto ;
    margin-top: 25px ;
}



.menuSet
.menuStandard
.menuDrink{
    display: block ;
    width: 100vw ;
    max-width: 700px ;
    height: auto ;
    object-fit: cover;
}

.menu__img img {
    width: 100%;
    max-width: 700px ;
    margin: 30px auto ;
}

.slider .slick-prev,
.slider .slick-next
{
    /* スライド画像の後ろに隠れないようにする */
    z-index: 1000;
}

.slick-prev:before,
.slick-next:before {
  color: var(--primary-white);
}
.slick-dots li button:before {
  font-size: 15px;
  top: 6px;
}

/* menu pc */

@media screen and (min-width:769px) {
    
}

/*==========================
access
==========================*/
.topic--access {
    width: 350px ;
    margin-left:auto;
    margin-right: 15px ;
    margin-top: 100px ;
}

.access__area {
    width: 100vw ;
    height: auto ;
}

.address__outer {
    width: 100vw ;
    margin-top: 80px ;
}

.map {
    width: 100vw ;
    height: auto ;
    text-align: center ;
    margin: 0 auto ;
    margin-top: 80px ;
}

.map__img {
    width: 92vw ;
    height: 100vh ;
    max-width: 700px ;
}

.map__detail {
    width: 92vw ;
    font-size: 1.6rem ;
    margin: 0 auto ;
    margin-top: 20px ;
    max-width: 700px ;
}

.address__memo {
    width: 92vw ;
}


.service {
    width: 92vw ;
    font-size: 1.6rem ;
    margin-top: 50px ;
    margin-left: 15px ;
}


.service__topic {
    width: 200px  ;
    font-size: 2.0rem ;
    text-align: center ;
    position: relative ;
}

.service__topic::before,.service__topic::after {
    content: '';
    position: absolute;
    top: 50%;
    display: inline-block;
    width: 50px;
    height: 3px;
    border-top: solid 1px var(--primary-black);
    border-bottom: solid 1px var(--primary-black);
}

.service__topic:before {
    left: 2%;
}
.service__topic:after {
    right: 2%;
}

.open__outer {
    display: flex ;
    flex-direction: column ;
    width: 92vw ;
    margin: 0 auto ;
    margin-top: 30px ;
    max-width: 700px ;
}

.open__date {
    margin-top: 25px ;
}

.service__ins {
    width: 5px ;
}

.memo__outer {
    display: flex ;
    flex-direction: column ;
    width: 92vw ;
    margin: 0 auto ;
    margin-top: 30px ;
    max-width: 700px ;
}

.memo {
    font-size: 1.6rem;
}

.memo__ins {
    display: flex ;
    justify-content: center ;
}



/* pc access */

@media screen and (min-width:769px) {
   
}

/*==========================
footer
==========================*/
.footer {
    width: 100%;
    height: auto;
    margin: 0 ;
    margin-top: 80px ;
    background-color: var(--primary-Indigo);
    padding-bottom: 60px ;
}

.footer__content {
    width: 100% ;
    display: flex ;
    flex-direction: column ;
    align-items: center;
    color: var(--primary-orange);
    font-family: "UDDigiKyokasho R JIS2004" ;
    font-size: 1.4rem ;

}

.footer__content img {
    width: 30vw ;
    height: auto ;
    margin-top: 50px ;
}

.address__outer {
    width: 70% ;
    margin: 0 ;
}

.post {
    margin-left: 40px ;
    margin: 25px auto 0 0 ;
}

.tel {
    margin-top: 15px;
    text-align: center ;
}

.footer__ins {
    display: flex ;
    justify-content: center ;
    margin-top: 10px ;
}

.ins img {
    margin: 0 ;
    width: 40px ;
}

/* pc footer */

@media screen and (min-width:769px) {
}