@charset "UTF-8";
/* //////////////////////////////////////////////////////////////////////////////////////////////////

PC

////////////////////////////////////////////////////////////////////////////////////////////////// */
@media screen and (min-width: 768px) {
  /*
  ========================================================================= */
  /* layout レイアウト
  ========================================================================= */
  /*
  ========================================================================= */
  /*  deco 装飾
  ========================================================================= */
  .gold1 {
    background: linear-gradient(53deg, rgb(181, 139, 66) 0%, rgb(244, 222, 183) 19.5%, rgb(181, 139, 66) 39%, rgb(244, 222, 183) 54%, rgb(204, 161, 87) 81%);
  }
  .gold2 {
    background: linear-gradient(82deg, rgb(181, 139, 66) 0%, rgb(244, 222, 183) 24%, rgb(181, 139, 66) 55.5%, rgb(244, 222, 183) 72%, rgb(181, 139, 66) 84%, rgb(244, 222, 183) 100%, rgb(181, 139, 66) 100%, rgb(244, 222, 183) 100%);
  }
  .gold3 {
    background: linear-gradient(to right, rgb(215, 173, 99) 0%, rgb(181, 139, 66) 34%, rgb(215, 173, 99) 67%, rgb(181, 139, 66) 100%);
  }
  .gold_border {
    position: relative;
  }
  .gold_border::before {
    content: "";
    position: absolute;
    inset: 0;
    margin: auto;
    display: block;
    width: 100%;
    height: 100%;
    border: calc(var(--var-1) * 2) solid;
    -o-border-image: linear-gradient(53deg, rgb(181, 139, 66) 0%, rgb(244, 222, 183) 19.5%, rgb(181, 139, 66) 39%, rgb(244, 222, 183) 54%, rgb(204, 161, 87) 81%) 1;
       border-image: linear-gradient(53deg, rgb(181, 139, 66) 0%, rgb(244, 222, 183) 19.5%, rgb(181, 139, 66) 39%, rgb(244, 222, 183) 54%, rgb(204, 161, 87) 81%) 1;
    background: transparent;
    pointer-events: none;
  }
  .gold_border_in {
    position: relative;
  }
  .gold_border_in::before {
    content: "";
    position: absolute;
    inset: 0;
    margin: auto;
    display: block;
    width: calc(100% - var(--var-1) * 8);
    height: calc(100% - var(--var-1) * 8);
    border: 1px solid;
    -o-border-image: linear-gradient(53deg, rgb(181, 139, 66) 0%, rgb(244, 222, 183) 19.5%, rgb(181, 139, 66) 39%, rgb(244, 222, 183) 54%, rgb(204, 161, 87) 81%) 1;
       border-image: linear-gradient(53deg, rgb(181, 139, 66) 0%, rgb(244, 222, 183) 19.5%, rgb(181, 139, 66) 39%, rgb(244, 222, 183) 54%, rgb(204, 161, 87) 81%) 1;
    background: transparent;
    pointer-events: none;
  }
  .gold_border_b {
    border-bottom: 1px solid;
    -o-border-image: linear-gradient(53deg, rgb(181, 139, 66) 0%, rgb(244, 222, 183) 19.5%, rgb(181, 139, 66) 39%, rgb(244, 222, 183) 54%, rgb(204, 161, 87) 81%) 1;
       border-image: linear-gradient(53deg, rgb(181, 139, 66) 0%, rgb(244, 222, 183) 19.5%, rgb(181, 139, 66) 39%, rgb(244, 222, 183) 54%, rgb(204, 161, 87) 81%) 1;
    background: transparent;
  }
  .deco_tl {
    position: relative;
    z-index: 0;
  }
  .deco_tl::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    display: block;
    width: calc(var(--var-1) * 293);
    height: calc(var(--var-1) * 214);
    background: url(../img/cmn/deco_tl.png) no-repeat top/100%;
    pointer-events: none;
  }
  .border {
    display: block;
    width: 100%;
    height: calc(var(--var-1) * 3);
  }
  /*
  ========================================================================= */
  /* title タイトル
  ========================================================================= */
  .cmn_ttl {
    padding-bottom: calc(var(--var-1) * 60);
    font: 500 calc(var(--var-1) * 90)/1 var(--family-en1);
    letter-spacing: 0.05em;
    position: relative;
  }
  .cmn_ttl::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    display: block;
    width: 1px;
    height: calc(var(--var-1) * 30);
    background: var(--cl-black);
  }
  .cmn_ttl .cmn_ttl_sub {
    margin-top: calc(var(--var-1) * 20);
    font: 500 calc(var(--var-1) * 26)/1 var(--family-serif);
    letter-spacing: 0.1em;
  }
  /*
  ========================================================================= */
  /* list リスト
  ========================================================================= */
  /*
  ========================================================================= */
  /* tel 電話番号
  ========================================================================= */
  .tel .tel_number {
    font: 500 calc(var(--var-1) * 25)/1 var(--family-serif);
  }
  .tel .tel_number small {
    font-size: calc(var(--var-1) * 18);
  }
  .tel img {
    display: block;
    margin-top: calc(var(--var-1) * 16);
    filter: brightness(0) saturate(100%) invert(12%) sepia(6%) saturate(9%) hue-rotate(324deg) brightness(100%) contrast(80%);
  }
  /*
  ========================================================================= */
  /* times 営業時間・定休日
  ========================================================================= */
  /*
  ========================================================================= */
  /* btn ボタンの設計 
  ========================================================================= */
  .cmn_btn {
    width: calc(var(--var-1) * 220);
    padding: calc(var(--var-1) * 37);
    text-align: center;
    background: linear-gradient(to right, rgb(215, 173, 99) 0%, rgb(181, 139, 66) 51%, rgb(215, 173, 99) 100.5%, rgb(181, 139, 66) 150%);
    overflow: hidden;
    position: relative;
  }
  .cmn_btn::before {
    content: "";
    position: absolute;
    bottom: calc(var(--var-1) * 8);
    right: calc(var(--var-1) * 8);
    display: block;
    width: calc(var(--var-1) * 12);
    height: calc(var(--var-1) * 12);
    background: url(../img/cmn/window_icon.png) no-repeat top/100%;
  }
  .cmn_btn .btn_deco {
    position: absolute;
    top: calc(var(--var-1) * -4);
    left: calc(var(--var-1) * -4);
    z-index: 1;
    font: 400 calc(var(--var-1) * 48)/1 var(--family-en2);
    opacity: 0.4;
    transform: rotate(-13.7deg);
    letter-spacing: 0.05em;
  }
  .cmn_btn2 {
    display: block;
    width: calc(var(--var-1) * 124);
    font: 500 calc(var(--var-1) * 20)/1 var(--family-base);
    letter-spacing: 0.08em;
    position: relative;
  }
  .cmn_btn2::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto 0;
    left: calc(var(--var-1) * -48);
    display: block;
    width: calc(var(--var-1) * 91);
    height: calc(var(--var-1) * 100);
    background: url(../img/cmn/btn_deco.png) no-repeat top/100%;
  }
  .cmn_btn2::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto 0;
    right: calc(var(--var-1) * -42);
    display: block;
    width: calc(var(--var-1) * 27);
    height: calc(var(--var-1) * 7);
    background: url(../img/cmn/arw_r.png) no-repeat top/100%;
    transition: 0.3s;
  }
  .cmn_btn2:hover::after {
    transform: translateX(calc(var(--var-1) * 8));
  }
  .cmn_btn2_g {
    display: block;
    width: calc(var(--var-1) * 124);
    color: var(--cl-white);
    font: 500 calc(var(--var-1) * 20)/1 var(--family-base);
    letter-spacing: 0.08em;
    position: relative;
  }
  .cmn_btn2_g::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto 0;
    left: calc(var(--var-1) * -48);
    display: block;
    width: calc(var(--var-1) * 91);
    height: calc(var(--var-1) * 100);
    background: url(../img/cmn/btn_deco_g.png) no-repeat top/100%;
  }
  .cmn_btn2_g::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto 0;
    right: calc(var(--var-1) * -42);
    display: block;
    width: calc(var(--var-1) * 27);
    height: calc(var(--var-1) * 7);
    background: url(../img/cmn/arw_r_g.png) no-repeat top/100%;
    transition: 0.3s;
  }
  .cmn_btn2_g:hover::after {
    transform: translateX(calc(var(--var-1) * 8));
  }
  .line,
  .instagram {
    width: calc(var(--var-1) * 36);
    height: calc(var(--var-1) * 36);
  }
}
/* //////////////////////////////////////////////////////////////////////////////////////////////////

SP

////////////////////////////////////////////////////////////////////////////////////////////////// */
@media screen and (max-width: 767px) {
  /*
  ========================================================================= */
  /* layout レイアウト
  ========================================================================= */
  /*
  ========================================================================= */
  /*  deco 装飾
  ========================================================================= */
  .gold1 {
    background: linear-gradient(53deg, rgb(181, 139, 66) 0%, rgb(244, 222, 183) 19.5%, rgb(181, 139, 66) 39%, rgb(244, 222, 183) 54%, rgb(204, 161, 87) 81%);
  }
  .gold2 {
    background: linear-gradient(82deg, rgb(181, 139, 66) 0%, rgb(244, 222, 183) 24%, rgb(181, 139, 66) 55.5%, rgb(244, 222, 183) 72%, rgb(181, 139, 66) 84%, rgb(244, 222, 183) 100%, rgb(181, 139, 66) 100%, rgb(244, 222, 183) 100%);
  }
  .gold3 {
    background: linear-gradient(to right, rgb(215, 173, 99) 0%, rgb(181, 139, 66) 34%, rgb(215, 173, 99) 67%, rgb(181, 139, 66) 100%);
  }
  .gold_border {
    position: relative;
  }
  .gold_border::before {
    content: "";
    position: absolute;
    inset: 0;
    margin: auto;
    display: block;
    width: 100%;
    height: 100%;
    border: calc(var(--var-1) * 2) solid;
    -o-border-image: linear-gradient(53deg, rgb(181, 139, 66) 0%, rgb(244, 222, 183) 19.5%, rgb(181, 139, 66) 39%, rgb(244, 222, 183) 54%, rgb(204, 161, 87) 81%) 1;
       border-image: linear-gradient(53deg, rgb(181, 139, 66) 0%, rgb(244, 222, 183) 19.5%, rgb(181, 139, 66) 39%, rgb(244, 222, 183) 54%, rgb(204, 161, 87) 81%) 1;
    background: transparent;
    pointer-events: none;
  }
  .gold_border_in {
    position: relative;
  }
  .gold_border_in::before {
    content: "";
    position: absolute;
    inset: 0;
    margin: auto;
    display: block;
    width: calc(100% - var(--var-1) * 8);
    height: calc(100% - var(--var-1) * 8);
    border: 1px solid;
    -o-border-image: linear-gradient(53deg, rgb(181, 139, 66) 0%, rgb(244, 222, 183) 19.5%, rgb(181, 139, 66) 39%, rgb(244, 222, 183) 54%, rgb(204, 161, 87) 81%) 1;
       border-image: linear-gradient(53deg, rgb(181, 139, 66) 0%, rgb(244, 222, 183) 19.5%, rgb(181, 139, 66) 39%, rgb(244, 222, 183) 54%, rgb(204, 161, 87) 81%) 1;
    background: transparent;
    pointer-events: none;
  }
  .gold_border_b {
    border-bottom: 1px solid;
    -o-border-image: linear-gradient(53deg, rgb(181, 139, 66) 0%, rgb(244, 222, 183) 19.5%, rgb(181, 139, 66) 39%, rgb(244, 222, 183) 54%, rgb(204, 161, 87) 81%) 1;
       border-image: linear-gradient(53deg, rgb(181, 139, 66) 0%, rgb(244, 222, 183) 19.5%, rgb(181, 139, 66) 39%, rgb(244, 222, 183) 54%, rgb(204, 161, 87) 81%) 1;
    background: transparent;
  }
  .deco_tl {
    position: relative;
    z-index: 0;
  }
  .deco_tl::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    display: block;
    width: calc(var(--var-1) * 180);
    height: calc(var(--var-1) * 72);
    background: url(../img/cmn/deco_tl.png) no-repeat top/100%;
    pointer-events: none;
  }
  .border {
    display: block;
    width: 100%;
    height: calc(var(--var-1) * 3);
  }
  /*
  ========================================================================= */
  /* title タイトル
  ========================================================================= */
  .cmn_ttl {
    padding-bottom: calc(var(--var-1) * 50);
    font: 500 calc(var(--var-1) * 40)/1 var(--family-en1);
    letter-spacing: 0.05em;
    position: relative;
  }
  .cmn_ttl::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    display: block;
    width: 1px;
    height: calc(var(--var-1) * 20);
    background: var(--cl-black);
  }
  .cmn_ttl .cmn_ttl_sub {
    margin-top: calc(var(--var-1) * 16);
    font: 500 calc(var(--var-1) * 18)/1 var(--family-serif);
    letter-spacing: 0.1em;
  }
  /*
  ========================================================================= */
  /* list リスト
  ========================================================================= */
  /*
  ========================================================================= */
  /* tel 電話番号
  ========================================================================= */
  .tel .tel_number {
    font: 500 calc(var(--var-1) * 22)/1 var(--family-serif);
  }
  .tel .tel_number small {
    font-size: calc(var(--var-1) * 16);
  }
  .tel img {
    display: block;
    width: calc(var(--var-1) * 220);
    margin-top: calc(var(--var-1) * 12);
    filter: brightness(0) saturate(100%) invert(12%) sepia(6%) saturate(9%) hue-rotate(324deg) brightness(100%) contrast(80%);
  }
  /*
  ========================================================================= */
  /* times 営業時間・定休日
  ========================================================================= */
  /*
  ========================================================================= */
  /* btn ボタンの設計 
  ========================================================================= */
  .cmn_btn {
    display: block;
    width: calc(var(--var-1) * 160);
    padding: calc(var(--var-1) * 18);
    text-align: center;
    background: linear-gradient(to right, rgb(215, 173, 99) 0%, rgb(181, 139, 66) 51%, rgb(215, 173, 99) 100.5%, rgb(181, 139, 66) 150%);
    color: var(--cl-white);
    overflow: hidden;
    position: relative;
  }
  .cmn_btn::before {
    content: "";
    position: absolute;
    bottom: calc(var(--var-1) * 8);
    right: calc(var(--var-1) * 8);
    display: block;
    width: calc(var(--var-1) * 10);
    height: calc(var(--var-1) * 10);
    background: url(../img/cmn/window_icon.png) no-repeat top/100%;
  }
  .cmn_btn .btn_deco {
    position: absolute;
    top: calc(var(--var-1) * -4);
    left: calc(var(--var-1) * -4);
    z-index: 1;
    font: 400 calc(var(--var-1) * 32)/1 var(--family-en2);
    opacity: 0.4;
    transform: rotate(-13.7deg);
    letter-spacing: 0.05em;
    color: var(--cl-white);
  }
  .cmn_btn2 {
    display: block;
    width: calc(var(--var-1) * 88);
    font: 500 calc(var(--var-1) * 14)/1 var(--family-base);
    letter-spacing: 0.08em;
    position: relative;
  }
  .cmn_btn2::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto 0;
    left: calc(var(--var-1) * -28);
    display: block;
    width: calc(var(--var-1) * 48);
    height: calc(var(--var-1) * 53);
    background: url(../img/cmn/btn_deco.png) no-repeat top/100%;
  }
  .cmn_btn2::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto 0;
    right: calc(var(--var-1) * -32);
    display: block;
    width: calc(var(--var-1) * 24);
    height: calc(var(--var-1) * 8);
    background: url(../img/cmn/arw_r.png) no-repeat top/100%;
    transition: 0.3s;
  }
  .cmn_btn2_g {
    display: block;
    width: calc(var(--var-1) * 88);
    color: var(--cl-white);
    font: 500 calc(var(--var-1) * 14)/1 var(--family-base);
    letter-spacing: 0.08em;
    position: relative;
  }
  .cmn_btn2_g::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto 0;
    left: calc(var(--var-1) * -28);
    display: block;
    width: calc(var(--var-1) * 48);
    height: calc(var(--var-1) * 53);
    background: url(../img/cmn/btn_deco_g.png) no-repeat top/100%;
  }
  .cmn_btn2_g::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto 0;
    right: calc(var(--var-1) * -32);
    display: block;
    width: calc(var(--var-1) * 24);
    height: calc(var(--var-1) * 8);
    background: url(../img/cmn/arw_r_g.png) no-repeat top/100%;
    transition: 0.3s;
  }
  .line,
  .instagram {
    width: calc(var(--var-1) * 30);
    height: calc(var(--var-1) * 30);
  }
}
/* //////////////////////////////////////////////////////////////////////////////////////////////////

共通コンポーネント

////////////////////////////////////////////////////////////////////////////////////////////////// */
/*
========================================================================= */
/*  breadcrumb(パンくずリスト)
========================================================================= */
.breadcrumb {
  position: relative;
}
.breadcrumb .inner .breadcrumb_list {
  padding-top: calc(var(--var-1) * 32);
  position: absolute;
  gap: calc(var(--var-1) * 32);
  z-index: 100;
}
.breadcrumb .inner .breadcrumb_list .breadcrumb_top a {
  transition: 0.3s;
}
.breadcrumb .inner .breadcrumb_list .breadcrumb_top a:hover {
  color: var(--cl-must);
}
.breadcrumb .inner .breadcrumb_list .breadcrumb_item_secondary,
.breadcrumb .inner .breadcrumb_list .breadcrumb_third {
  color: var(--cl-must);
}
.breadcrumb .inner .breadcrumb_list .arrow {
  position: relative;
}
.breadcrumb .inner .breadcrumb_list .arrow::before {
  content: ">";
  width: calc(var(--var-1) * 8);
  height: 100%;
  display: block;
  position: absolute;
  right: calc(-1 * var(--var-1) * 16);
}

@media screen and (max-width: 767px) {
  .breadcrumb {
    position: relative;
    z-index: 0;
  }
  .breadcrumb .inner .breadcrumb_list {
    width: 84%;
    position: absolute;
    padding-top: calc(var(--var-1) * 24);
    gap: calc(var(--var-1) * 24);
    z-index: 100;
    overflow-x: scroll;
  }
  .breadcrumb .inner .breadcrumb_list .breadcrumb_item {
    display: inline-block;
    font-size: calc(var(--var-1) * 12);
    flex-shrink: 0;
  }
  .breadcrumb .inner .breadcrumb_list .breadcrumb_item:first-child {
    margin: 0;
  }
  .breadcrumb .inner .breadcrumb_list .breadcrumb_item_secondary,
  .breadcrumb .inner .breadcrumb_list .breadcrumb_third {
    color: var(--cl-must);
  }
  .breadcrumb .inner .breadcrumb_list .arrow {
    position: relative;
  }
  .breadcrumb .inner .breadcrumb_list .arrow::before {
    content: ">";
    width: calc(var(--var-1) * 8);
    height: 100%;
    display: block;
    position: absolute;
    right: calc(-1 * var(--var-1) * 14);
  }
}
/*
========================================================================= */
/*  nav_hover , current
========================================================================= */
.hd_link,
.ft_link,
.ft_nav_link {
  transition: 0.3s;
}
.hd_link:hover,
.ft_link:hover,
.ft_nav_link:hover {
  color: var(--cl-must);
}

.current {
  color: var(--cl-must);
}

/*
========================================================================= */
/*  no_post
========================================================================= */
@media screen and (min-width: 768px) {
  .no_post {
    padding: calc(var(--var-1) * 120);
    font-size: calc(var(--var-1) * 32);
    font-weight: 700;
    text-align: center;
  }
}
@media screen and (max-width: 767px) {
  .no_post {
    margin-top: calc(var(--var-1) * 40);
    font-size: calc(var(--var-1) * 28);
    font-weight: 700;
    text-align: center;
  }
}
/*
========================================================================= */
/*  copy
========================================================================= */
@media screen and (min-width: 768px) {
  .copy {
    font: 400 calc(var(--var-1) * 14) var(--family-base);
    text-align: center;
  }
  .copy .copy_link {
    transition: 0.3s;
  }
  .copy .copy_link:hover {
    color: var(--cl-must);
  }
}
@media screen and (max-width: 767px) {
  .copy {
    margin-top: calc(var(--var-1) * 48);
    font: 400 calc(var(--var-1) * 10) var(--family-base);
    text-align: center;
  }
}