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

@media screen and (min-width: 320px) {
  /* スマホ用レイアウト 320px以上の範囲に収めるデザインはこの中に記述 */

  .color {
    color: #ED9E31;
  }
  /*==============================================================
    　　Menu　メニュー　共通
  ==============================================================*/
  .main-title {
    line-height: 1.2;
    padding: 25.78vw 2.6vw 11.33vw;
  }

  /* タイトル（日本語） */
  .main-title .title-jp {
    display: block;
    font-size: 8.33vw;
    font-weight: 600;
    letter-spacing: .1em;
    margin-top: 1.56vw;
  }

  /* タイトル（英語） */
  .main-title .title {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 600;
    font-size: 4.17vw;
    line-height: 1.2;
    letter-spacing: .1em;
    color: #ED9E31;
    padding-top: 3.78vw;
    position: relative;
    writing-mode: unset;
    padding-top: 0;
    padding-left: 2.73vw;
    margin-bottom: -.52vw;
  }

  /* ドット */
  .main-title .title:before {
    content: "";
    width: 1.17vw;
    height: 1.17vw;
    background: currentColor;
    border-radius: 50%;
    position: absolute;
    top: 7px;
    left: 0;
    margin: auto;
  }

  .main {
    padding-left: 5.21vw;
    padding-right: 5.21vw;
    font-size: 3.65vw;
    line-height: 1.8;
    letter-spacing: .1em;
  }

  /* メニューリンク */
  .menu-nav ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0 4.17vw;
  }

  .menu-nav ul li {
    border-bottom: 1px solid rgb(255, 255, 255, .08);
    position: relative;
  }
  .menu-nav ul li:nth-child(-n+2) {
    border-top: 1px solid rgb(255, 255, 255, .08);
  }

  .menu-nav ul li a {
    display: flex;
    align-items: center;
    height: 100%;
    font-weight: 500;
    line-height: 1.5;
    /* padding: 2.34vw 0 2.99vw 3.13vw; */
    padding: 2.34vw 0 2.99vw 3.8vw;
    position: relative;
    transition: color .3s ease-out;
    will-change: color;
  }

  .menu-nav ul li.active a {
    color: #ED9E31;
  }

  .menu-nav ul li.active a:before {
    content: "";
    width: 1.04vw;
    height: 1.04vw;
    background: currentColor;
    border-radius: 50%;
    position: absolute;
    top: 48%;
    transform: translateY(-48%);
    left: .65vw;
    margin: auto;
  }

  .main .content {
    padding-top: 12.63vw;
    padding-bottom: 2.6vw;
  }

  .main .menu-top {
    margin-bottom: 13.15vw;
  }

  .main .menu-top .title {
    font-size: 6.25vw;
    font-weight: 500;
    line-height: 1.6;
    letter-spacing: .1em;
    margin-bottom: 1.04vw;
  }

  .main .menu-top .text {
    font-size: 3.13vw;
    line-height: 1.8;
    letter-spacing: .1em;
    color: #939393;
  }

  .main .menu-top .menu-img {
    width: 100%;
    height: auto;
    overflow: hidden;
    margin-top: 2.6vw;
    aspect-ratio: 16 / 9;
  }

  .main .menu-top .menu-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .main .menu-top.menu-01 .menu-img img {
    object-position: 50% 45%;
  }
  .main .menu-top.menu-02 .menu-img img {
    object-position: 50% 40%;
  }
  .main .menu-top.menu-03 .menu-img img {
    object-position: 50% 41%;
  }
  .main .menu-top.menu-04 .menu-img img {
    object-position: 50% 40%;
  }
  .main .menu-top.menu-05 .menu-img img {
    object-position: 50% 18%;
  }

  .menu-list {
    margin-bottom: 13.02vw;
  }

  .menu-list .title {
    font-size: 5.21vw;
    font-weight: 500;
    position: relative;
    margin-bottom: 6.12vw;
    padding: 0 0 .26vw 3.65vw;
    letter-spacing: .1em;
    /* line-height: 1; */
    line-height: 6.25vw;
  }

  .menu-list .title.long {
    line-height: 7.3vw;
  }

  .menu-list .title:before {
    content: "";
    display: block;
    width: .52vw;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    background-color: #ED9E31;
  }

  .menu-list ul {
    border-top: 1px solid rgba(255, 255, 255, .08);
  }

  .menu-list ul .menu-item {
    border-bottom: 1px solid rgba(255, 255, 255, .08);
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto 1fr;
    /* padding: 3.26vw .78vw 3.91vw 1.04vw; */
    padding: 3.8vw .78vw 3.91vw 1.04vw;
    align-items: center;
  }

  .menu-list ul .menu-item .name {
    font-size: 4.17vw;
    font-weight: 700;
    line-height: 6.45vw;
    /* line-height: 1.4; */
  }

  .menu-list ul .menu-item .price {
    /* font-size: 3.65vw; */
    font-weight: 700;
    /* line-height: 6.25vw; */
    padding-left: 3.91vw;
    text-align: right;

    line-height: 1.45;
    font-size: 14px;
  }

  .menu-list ul .menu-item .price span {
    margin-right: -10px;
    white-space: nowrap;
    font-size: 12px;
  }

  .menu-list ul .menu-item .text {
    font-size: 3.13vw;
    font-weight: 400;
    line-height: 1.6;
    color: #939393;
    grid-column: 1 / 3;
    margin-top: 2.34vw;
    letter-spacing: .1em;
  }

  .menu-list ul .menu-item .left-space {
    margin-left: -10px;
  }

  /* パンくずリスト */
  .breadcrumbs {
    /* padding: 18vw 5.21vw 5.99vw; */
    padding: 11.2vw 5.21vw 5.99vw;
  }

  .breadcrumbs .list-item {
    display: inline;
    font-size: 2.86vw;
    line-height: 1.8;
    letter-spacing: .1em;
    color: #939393;
  }

  .breadcrumbs .list-item a {
    color: #fff;
  }

  .breadcrumbs .list-item a:after {
    display: inline;
    content: "/";
    margin-left: 1.43vw;
    color: #939393;
  }

  .footer {
    margin-top: 0;
  }


}


@media screen and (min-width: 640px) {
  /* タブレット用レイアウト 640px以上の範囲に収めるデザインはこの中に記述 */

  /*==============================================================
    　　TB_Menu　メニュー
  ==============================================================*/
  .main {
    max-width: 84.98vw;
    width: 100%;
    margin: 0 60px 60px;
    margin-inline: auto;
    padding: 0;
  }

  .main-title {
    max-width: 84.98vw;
    width: 100%;
    margin-inline: auto;
    padding: 18vw 0 6vw;
  }

  /* タイトル（日本語） */
  .main-title .title-jp {
    /* font-size: 34px; */
    font-size: 36px;
    line-height: 1.45;
    letter-spacing: 0;
    margin-right: .59vw;
    /* margin-left: -7px; */
    margin-top: 1vw;

  }

  /* タイトル（英語） */
  .main-title .title {
    /* font-size: 24px; */
    font-size: 15px;
    padding-left: 1.8vw;
  }

  /* ドット */
  .main-title .title:before {
    width: 5px;
    height: 5px;
    top: 7px;
  }

  /* メニューリンク */
  .menu-nav ul {
    font-size: 18px;
  }

  .main .content {
    padding-top: 11vw;
  }


  .main .menu-top .title {
    font-size: 32px;
  }

  .main .menu-top .text {
    font-size: 16px;
  }

  .menu-list {
    margin-bottom: 12vw;
  }

  .menu-list .title {
    font-size: 30px;
    line-height: 1;
    margin-bottom: 46px;
    padding: 0 0 .26vw 2.8vw;
  }

  .menu-list .title.long {
    line-height: 6.5vw;
  }

  .menu-list .title.long.long-big:before {
    margin-top: 14px;
    margin-bottom: 14px;
  }

  .menu-list .title.long-min {
    line-height: 1;
  }

  .menu-list .title:before {
    width: 3px;
  }

  .menu-list ul .menu-item .left-space.none {
    margin-left: 0;
  }

  .menu-list ul .menu-item {
    padding: 2.5vw .59vw 2.5vw;
  }
  /* .menu-list ul .menu-item.item-02 {
    max-height: 94px;
  } */

  .menu-list ul .menu-item .name {
    font-size: 20px;
    line-height: 1.5;
  }

  .menu-list ul .menu-item .price {
    font-size: 18px;
  }
  .menu-list ul .menu-item .price span {
    font-size: 15px;
  }

  .menu-list ul .menu-item .text {
    font-size: 16px;
    margin-top: 4px;
    margin-bottom: 10px;
  }


  /* パンくずリスト */
  .breadcrumbs {
    padding: 3vw 60px 2.5vw;
  }

  .breadcrumbs .list-item {
    font-size: 12px;
  }

  .breadcrumbs .list-item a:after {
    margin-right: .37vw;
    margin-left: .81vw;
  }


}


@media screen and (min-width: 1024px) {
  /* パソコン用レイアウト 1024px以上の範囲に収めるデザインはこの中に記述 */
  /*==============================================================
    　　PC_Menu　メニュー
  ==============================================================*/
  .main {
    padding: 0;
    width: 100%;
    margin-inline: auto;
    margin-bottom: 12vw;
    margin: 0 auto;
    max-width: none;
    max-width: 84.98vw;
    position: relative;
  }

  .main-title {
    line-height: 1.2;
    padding: 13.19vw 0 6.67vw;
  }

  /* タイトル（日本語） */
  .main-title .title-jp {
    font-size: 3.22vw;
    margin-top: 1.03vw;
  }

  /* タイトル（英語） */
  .main-title .title {
    font-size: 1.47vw;
    padding-left: 1.03vw;
  }

  /* ドット */
  .main-title .title:before {
    width: .44vw;
    height: .44vw;
    top: .66vw;
    left: 0;
  }

  /* メニューリンク */
  .menu-nav {
    position: absolute;
    top: 0;
    width: 13.92vw;
    margin: auto;
    z-index: 2;
    margin-left: -19.19vw;
    will-change: transform;
    transition: none;
  }

  .menu-nav ul {
    grid-template-columns: repeat(1, 1fr);
    padding-top: 1.1vw;
  }

  .menu-nav.sticky {
    position: fixed;
    top: 120px;
    /* width: 100%; */
  }

  .menu-nav.ended {
    position: absolute;
    bottom: 0;
    top: auto;
    /* width: 100%; */
  }

  .menu-nav ul li:nth-child(2) {
    border-top: none;
  }

  .menu-nav ul li a {
    display: block;
    font-size: 1.25vw;
    padding: 1.1vw 0 1.25vw 1.32vw;
    letter-spacing: .1em;
  }

  .menu-nav ul li.active a:before {
    display: block;
    width: .37vw;
    height: .37vw;
    left: .37vw;
  }

  .main .content {
    position: relative;
    padding-left: 19.19vw;
    padding-top: 0;
    padding-bottom: 0;
  }

  .main .menu-top {
    margin-bottom: 5.86vw;
    margin-top: -1.17vw;
  }

  .main .menu-top .title {
    font-size: 2.34vw;
    margin-bottom: .88vw;
  }

  .main .menu-top .text {
    font-size: 1.03vw;
  }

  .main .menu-top .menu-img {
    margin-top: 1.83vw;
    padding-right: 1.83vw;
    aspect-ratio: 16 / 8.75;
  }

  .menu-list {
    margin-bottom: 5.71vw;
  }

  .menu-list.last {
    margin-bottom: 0;
  }

  .menu-list .title {
    font-size: 2.05vw;
    margin-bottom: 2.93vw;
    padding: 0 0 .29vw 1.32vw;
  }

  .menu-list .title.long {
    line-height: 1;
  }

  .menu-list .title:before {
    width: .22vw;
  }

  .menu-list ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0 2.34vw;
    border-top: none;
  }

  .menu-list ul li:nth-child(-n+2) {
    padding-top: .51vw;
    border-top: 1px solid rgba(255, 255, 255, .08);
    padding: 2.12vw .59vw 2.49vw;
  }

  .menu-list ul .menu-item {
    /* padding: 1.61vw .59vw 2.49vw; */
    padding: 2.2vw .59vw 2.2vw;
  }

  .menu-list ul .menu-item .name {
    font-size: 1.32vw;
    line-height: 2.2vw;
    letter-spacing: .1em;
  }

  .menu-list ul .menu-item .price {
    /* font-size: 1.17vw; */
    /* line-height: 2.2vw; */
    padding-left: 1.1vw;
    letter-spacing: .1em;

    font-size: 14px;
  }
  .menu-list ul .menu-item .price span {
    font-size: 12px;
  }

  .menu-list ul .menu-item .text {
    font-size: 1.03vw;
    margin-top: .44vw;
    letter-spacing: .1em;
  }

  .menu-list.menu-02 ul .menu-item.item-06 .text {
    margin-top: -14px;
  }

  .menu-list ul .menu-item.margin-top .name,
  .menu-list ul .menu-item.margin-top .price {
    padding-top: 14px;
  }
  .menu-list ul .menu-item.margin-top.item-01 .price {
    padding-top: 0;
  }
  .menu-list.menu-01-03 ul .menu-item.margin-top .name,
  .menu-list.menu-01-03 ul .menu-item.margin-top .price {
    padding-top: 6px;
  }
  .menu-list.menu-06-09 ul .menu-item.margin-top .name,
  .menu-list.menu-06-09 ul .menu-item.margin-top .price {
    padding-top: 6px;
  }
  .menu-list.menu-06-14 ul .menu-item.margin-top .name,
  .menu-list.menu-06-14 ul .menu-item.margin-top .price {
    padding-top: 6px;
  }

  /* menu-06　調整 */
  .menu-list ul .menu-item.item-02 .text {
    margin-top: -15px;
  }
  .menu-list ul .menu-item.item-04 .name,
  .menu-list ul .menu-item.item-04 .price {
    padding-top: 22px;
  }

  .menu-list ul .menu-item.pc-nowrap .name {
    white-space: nowrap;
  }

  /* パンくずリスト */
  .breadcrumbs {
    max-width: 84.98vw;
    margin: 0 auto;
    padding: 9vw 0 2vw;
  }

  .breadcrumbs .list-item {
    font-size: .95vw;
  }

}

@media screen and (min-width: 1400px) {
  /* パソコン用レイアウト 1400px以上の範囲に収めるデザインはこの中に記述 */
  /*==============================================================
    　　PC-big_Menu　メニュー
  ==============================================================*/
  .main-title {
    max-width: 1160px;
    line-height: 1.2;
    padding: 180px 0 91px;
  }

  /* タイトル（日本語） */
  .main-title .title-jp {
    font-size: 44px;
    margin-top: 14px;
  }

  /* タイトル（英語） */
  .main-title .title {
    font-size: 20px;
    padding-left: 14px;
  }

  /* ドット */
  .main-title .title:before {
    width: 6px;
    height: 6px;
    top: 9px;
  }

  .main {
    max-width: 1160px;
    /* padding-top: 70px; */
    position: relative;
    /* margin-bottom: 300px; */
  }

  /* メニューリンク */
  .menu-nav {
    width: 190px;
    margin-left: -262px;
  }

  .menu-nav ul {
    padding-top: 15px;
  }

  .menu-nav ul li a {
    font-size: 17px;
    padding: 15px 0 17px 18px;
  }

  .menu-nav ul li.active a:before {
    width: 5px;
    height: 5px;
    left: 5px;
  }

  .main .content {
    padding-left: 262px;
  }

  .main .menu-top {
    margin-bottom: 80px;
    margin-top: -16px;
  }

  .main .menu-top .title {
    font-size: 32px;
    margin-bottom: 12px;
  }

  .main .menu-top .text {
    font-size: 14px;
  }

  .main .menu-top .menu-img {
    margin-top: 25px;
    margin-right: 25px;
  }

  .menu-list {
    margin-bottom: 78px;
  }

  .menu-list .title {
    font-size: 28px;
    margin-bottom: 40px;
    padding: 0 0 4px 18px;
  }

  .menu-list .title:before {
    width: 3px;
  }

  .menu-list ul {
    gap: 0 32px;
  }

  .menu-list ul li:nth-child(-n+2) {
    padding-top: 7px;
    padding: 28px 8px 28px;
  }

  .menu-list ul .menu-item {
    padding: 28px 8px 28px;
  }

  .menu-list ul .menu-item .name {
    font-size: 18px;
    line-height: 30px;
  }

  .menu-list ul .menu-item .price {
    font-size: 16px;
    /* line-height: 30px; */
    padding-left: 15px;
  }
  .menu-list ul .menu-item .price span {
    font-size: 14px;
  }

  .menu-list ul .menu-item .text {
    font-size: 14px;
    margin-top: 6px;
  }

  .menu-list ul .menu-item.margin-top.none .name,
  .menu-list ul .menu-item.margin-top.none .price {
    padding-top: 0;
  }

  /* パンくずリスト */
  .breadcrumbs {
    max-width: 1160px;
    padding-top: 120px;
    padding-bottom: 20px;
  }

  .breadcrumbs .list-item {
    font-size: 13px;
  }

  .breadcrumbs .list-item a:after {
    margin-right: 5px;
    margin-left: 11px;
  }

  /* ==================== アニメーション ================== */
  .menu-nav a {
    transition: color .3s ease-out;
  }
  .menu-nav a:hover {
    color: #ED9E31;
  }



}