@charset "utf-8";

:root {
  /* 1MONTH */
  --header-color-m: rgba(44, 24, 26, .9);
  --logo-filter-m: invert(100%) sepia(5%) saturate(19%) hue-rotate(163deg) brightness(107%) contrast(104%);
  --menu-bar-color-m: #AFD9F2;
  --close-btn-m: #83ABDE; /* ハンバーガーメニューの閉じるボタン */
  --text-color-m:#FFF;
  --shop-menu-filter-m: invert(100%) sepia(0%) saturate(7500%) hue-rotate(226deg) brightness(103%) contrast(107%);
  --bg-color-m: linear-gradient(0deg,rgba(121, 189, 219, 1) 0%, rgba(131, 171, 222, 1) 50%, rgba(121, 189, 219, 1) 100%);
  --kv-bottom-grad-m: linear-gradient(0deg,rgba(121, 189, 219, 1) 10%, rgba(121, 189, 219, 0) 100%);
  /* LINE UP */
  --lineup-bg-color-m: #2C181A; /* 背景 */
  --lineup-bullet-m: #83ABDE; /* カルーセルのドット */
  --lineup-bullet-active-m: #FFF; /* ドットアクティブ */
  --shop-btn-filter-m: invert(66%) sepia(63%) saturate(238%) hue-rotate(175deg) brightness(87%) contrast(100%);
  --shop-btn-bg-m: #FFF; /* ボタンの背景色 */
  --shop-btn-shadow-m: #83ABDE; /* ボタンのドロップシャドウ */
}

/* マンスリーTOP
---------------------------------------------------------------------------*/
.page-slug-monthly header {
  background-color: var(--header-color-m);
}
.page-slug-monthly .logo img {
  filter: var(--logo-filter-m);
}
.page-slug-monthly .menu_h a:hover,
.page-slug-monthly .menu_h li:nth-of-type(2) a {
  border-bottom-color: var(--menu-bar-color-m);
}
.page-slug-monthly .menu_h a {
  color: var(--text-color-m);
}
.page-slug-monthly .menu_h .online button {
  color: var(--text-color-m);
  border-color: #CCCCCC;
}
.page-slug-monthly .menu_h .online button::before {
  filter: var(--shop-menu-filter-m);
}
.page-slug-monthly .kv::before {
  background: var(--kv-bottom-grad-m);
}
.page-slug-monthly main {
  background: var(--bg-color-m);
}
.page-slug-monthly main::before {
  background: var(--kv-bottom-grad-m);
}
.page-slug-monthly .lineup {
  background-color: var(--lineup-bg-color-m);
}
.page-slug-monthly .lineup_gallery .swiper-pagination-bullet {
  background-color: var(--lineup-bullet-m);
}
.page-slug-monthly .lineup_gallery .swiper-pagination-bullet-active {
  background-color: var(--lineup-bullet-active-m);
}
.page-slug-monthly .lineup .online button {
  background-color: var(--shop-btn-bg-m);
  box-shadow: 0px 5px 0px var(--shop-btn-shadow-m);
  color: var(--lineup-bullet-m);
}
.page-slug-monthly .lineup .online button::before {
  filter: var(--shop-btn-filter-m);
}
.page-slug-monthly #menuModal .close {
  background-color: var(--close-btn-m);
}


/* 会社概要、ショップリスト
---------------------------------------------------------------------------*/
main.low {
  background: #F2F2F2;
}
main.low .inner {
  max-width: 900px;
  margin: 0 auto;
  border-radius: 0;
  line-height: 2;
}
main.low h2 {
  font-size: 2rem;
}
main.low h3 {
  margin-top: 1.5em;
  font-size: 1.3rem;
}
.shop_list ul + p {
  margin-top: 1em;
}

.page-slug-shop .menu_h li:nth-of-type(3) a {
  border-bottom-color: var(--menu-bar-color);
}