@charset "UTF-8";

/*==============================================================================================
●共通
==============================================================================================*/
* {
    box-sizing: border-box;
}

:root {
    --color-black-1: #222222;
    --color-black-2: #444444;

    --color-gray-1: #f2f2f2;
    --color-gray-2: #666666;
    --color-gray-3: #fafafa;

    --color-white-1: #ffffff;

    --color-green-1: #36aa6e;

    --color-blue-1: #0d7dcd;
    --color-red-1: #b51212;

    --color-yellow-1: #fffff2;

    --color-orange-1: #fcf4ed;
    --color-orange-2: #fffbf5;
    --color-orange-3: #f1b87c;

    --color-gold-1: #a4743b;
    --color-gold-2: #673a1b;

    --gradient-color-1: linear-gradient(0deg, #6ab1d7, #3191bb 33%);

    --width-pc: 1200px;
    --width-tb: 90%;
    --width-sp: 90%;
}

body {
    color: var(--color-black-1);
    background: var(--color-white-1);
}

a:hover {
    color: var(--color-green-1);
}

.txt-sml {
    font-size: 0.8em;
    opacity: 0.7;
}


/*/////////////////////////ヘッダー///////////////////////*/

header {
    background-color: var(--color-white-1);
    height: 85px;
    font-size: 0.8em;
    position: relative;
    border-bottom: 1px solid var(--color-gray-1);
}

.header-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
}

header a:link,
header a:visited {
    color: var(--color-black-1);
}

header a:hover {
    color: var(--color-green-1);
    text-decoration: none;
}

header ul {
    height: 85px;
    display: flex;
    align-items: center;
    gap: 40px;
}

header ul li {
    display: block;
    font-weight: 500;
    letter-spacing: 0.1em;
}

.store-info-menu {
    position: relative;
}

.store-info-dropdown {
    position: relative;
}

.store-info-dropdown>summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 4px;
    font: inherit;
    color: inherit;
    outline: none;
    user-select: none;
}

.store-info-dropdown>summary::-webkit-details-marker {
    display: none;
}

.store-info-dropdown>summary::after {
    content: "›";
    display: inline-block;
    font-size: 1em;
    line-height: 1;
    transform: rotate(90deg);
    transition: transform 0.2s ease;
}

.store-info-dropdown>summary:hover {
    color: var(--color-green-1);
}

.store-info-dropdown[open]>summary::after {
    transform: rotate(270deg);
}

.store-info-dropdown-menu {
    display: none;
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    min-width: 180px;
    padding: 8px 0;
    border: 1px solid var(--color-gray-1);
    border-radius: 5px;
    background: var(--color-white-1);
    box-shadow: 0 0px 5px rgba(0, 0, 0, 0.1);
    z-index: 20;
}

.store-info-dropdown[open] .store-info-dropdown-menu {
    display: block;
}

.store-info-dropdown-menu a {
    display: block;
    width: 100%;
    padding: 10px 16px;
    white-space: nowrap;
    line-height: 1.2;
    box-sizing: border-box;
    background: transparent;
    color: var(--color-black-1) !important;
    text-decoration: none !important;
    font-weight: 400;
}

.store-info-dropdown-menu a:hover {
    background: var(--color-green-1);
    color: var(--color-white-1) !important;
    text-decoration: none !important;
}

.store-info-dropdown-menu a:link,
.store-info-dropdown-menu a:visited,
.store-info-dropdown-menu a:active {
    color: var(--color-black-1) !important;
    text-decoration: none !important;
}

header a.logo {
    width: 103px;
    height: 35px;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 20px;
    margin: auto;
}

header a.reserve,
.kv a.reserve {
    background-color: var(--color-green-1);
    color: var(--color-white-1);
    padding: 10px;
    position: absolute;
    margin: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-size: 10px;
}

header a.reserve {
    width: 130px;
    height: 100%;
    top: 0;
    bottom: 0;
    right: 0;
}

header a.reserve:hover,
.kv a.reserve:hover {
    background-color: var(--color-black-1);
    color: var(--color-white-1);
}

header a.reserve img,
.kv a.reserve img {
    width: 15px;
    height: auto;
}

.kv-slider:not(.is-ready) .kv-slice {
    transition: none;
    transform: translateY(0);
    opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
    .kv-slide .kv-slice {
        transition: none;
    }
}

/*/////////////////////////スマホメニュー///////////////////////*/

.menu-btn {
    position: fixed;
    top: 22.5px;
    right: 10px;
    display: flex;
    height: 40px;
    width: 50px;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.menu-btn span,
.menu-btn span:before,
.menu-btn span:after {
    content: '';
    display: block;
    height: 3px;
    width: 30px;
    border-radius: 3px;
    background-color: #222;
    position: absolute;
    box-shadow: 0 0 2px #fff;
}

.menu-btn span:before {
    bottom: 8px;
}

.menu-btn span:after {
    top: 8px;
}

#menu-btn-check:checked~.menu-btn span {
    background-color: rgba(255, 255, 255, 0);
    box-shadow: none;
}

#menu-btn-check:checked~.menu-btn span::before {
    bottom: 0;
    transform: rotate(45deg);
    background-color: #fff;
}

#menu-btn-check:checked~.menu-btn span::after {
    top: 0;
    transform: rotate(-45deg);
    background-color: #fff;
}

#menu-btn-check {
    display: none;
}

.menu-content {
    height: 100%;
    position: fixed;
    top: 0;
    right: -100%;
    z-index: 999;
    background-color: rgba(34, 34, 34, 1);
    transition: all 0.5s;
    display: flex;
    align-items: center;
}

.menu-content ul {
    padding: 0 50px;
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.menu-content ul li {
    list-style: none;
    width: 100%;
    display: block;
}

.menu-content ul li a {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 1em;
    box-sizing: border-box;
    color: #fff;
    text-decoration: none;
}

.menu-content .store-info-dropdown>summary {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 1.2;
    height: auto;
    box-sizing: border-box;
    color: #fff;
    text-decoration: none;
    padding-bottom: 10px;
}

.menu-content .store-info-dropdown>summary:hover {
    color: var(--color-green-1);
}

.menu-content .store-info-dropdown>summary::after {
    display: inline-block;
    margin-left: 8px;
    transform: rotate(90deg);
}

.menu-content .store-info-dropdown[open]>summary::after {
    transform: rotate(270deg);
}

.menu-content .store-info-menu {
    width: 100%;
}

.menu-content .store-info-dropdown {
    width: 100%;
}

.menu-content .store-info-dropdown-menu {
    position: static;
    min-width: 0;
    margin: 0;
    padding: 0 0 0 16px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.menu-content .store-info-dropdown-menu a {
    display: block;
    padding: 15px 0;
    color: #fff !important;
    text-align: left;
    width: 100%;
}

.menu-content .store-info-dropdown-menu a:link,
.menu-content .store-info-dropdown-menu a:visited,
.menu-content .store-info-dropdown-menu a:active {
    color: #fff !important;
}

.menu-content .store-info-dropdown-menu a:hover {
    background: transparent;
    color: var(--color-green-1) !important;
}

.menu-content-logo {
    display: block;
    width: 152px !important;
    padding: 30px 0 50px 0;
}

.menu-content ul li a:hover {
    color: var(--color-green-1);
    opacity: 1;
}

.menu-content img {
    filter: brightness(1000%);
}

#menu-btn-check:checked~.menu-content {
    right: 0;
}


/*/////////////////////////フッター///////////////////////*/
footer {
    width: 100%;
    padding: 50px 0 25px 0;
    border-top: 1px solid var(--color-gray-1);
    color: var(--color-gray-2);
    font-size: 0.8em;
}

footer a:link,
footer a:visited {
    color: var(--color-gray-2);
}

footer a:hover {
    color: var(--color-green-1);
}

.footer-wrap {
    margin: auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.fmenu {
    margin-bottom: 50px;
    display: flex;
}

.flogo {
    width: 120px;
    height: auto;
}

.flogo img {
    width: 100px;
    height: auto;
}

.footerinfo>p {
    margin: 1em 0;
    font-size: 0.8em;
}

.copyright {
    font-size: 0.8em;
    display: block;
    width: 100%;
    text-align: center;
    margin: 20px 0;
}

footer ul {
    display: flex;
    flex-direction: column;
}

footer .store-info-dropdown>summary {
    width: 100%;
}

footer .store-info-dropdown-menu {
    top: auto;
    bottom: calc(100% + 8px);
    left: 0;
}

.fmenu2 {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.fmenu2>a {
    width: calc(48% - 10px);
    margin: 0 5px;
}

a.button-footer1,
a.button-footer2 {
    padding: 20px;
    border-radius: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    aspect-ratio: 1;
    white-space: nowrap;
}

a.button-footer1 img,
a.button-footer2 img {
    margin-bottom: 10px;
}

a.button-footer1 {
    background: var(--color-black-1);
    color: var(--color-white-1);
}

a.button-footer2 {
    background: var(--color-green-1);
    color: var(--color-black-1);
}

a.button-footer1:link,
a.button-footer1:visited,
a.button-footer2:link,
a.button-footer2:visited {
    color: var(--color-white-1);
}

a.button-footer1:hover {
    background: var(--color-green-1);
}

a.button-footer2:hover {
    background: var(--color-black-1);
}




/*/////////////////////////共通レイアウト///////////////////////*/
h1 {
    font-size: 2.5em;
}

h2 {
    font-size: 2em;
}

h3 {
    font-size: 1.8em;
}

h4 {
    font-size: 1.5em;
}

h5 {
    font-size: 1.3em;
}

h6 {
    font-size: 1em;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 500;
    letter-spacing: 0.05em;
}

.title {
    font-family: "baskerville-display-pt", serif;
    font-weight: 400;
    font-style: normal;
}

.title-shop {
    margin-top: 2em;
    font-size: 1.5em;
    letter-spacing: 0.1em;
    font-weight: 500;
    color: var(--color-gold-2);
}

.titles,
.titles2 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 100px 0;
}

.titles {
    color: var(--color-black-1);
}

.titles2 {
    color: var(--color-white-1);
}

.titles h1,
.titles2 h1 {
    line-height: 1em;
    position: relative;
}

.titles h1:before,
.titles h1::after,
.titles2 h1:before,
.titles2 h1::after {
    width: 42px;
    height: 56px;
    position: absolute;
    top: -10px;
}

.titles h1:before {
    content: url(../img/title-wing.png);
    left: -42px;
}

.titles h1::after {
    content: url(../img/title-wing2.png);
    right: -42px;
}

.titles2 h1:before {
    content: url(../img/title-wing3.png);
    left: -42px;
}

.titles2 h1::after {
    content: url(../img/title-wing4.png);
    right: -42px;
}

.titles span,
.titles2 span {
    font-size: 10px;
}

.archive-store-filter {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 100px;
}

.archive-store-filter-link {
    min-width: 110px;
    padding: 10px 18px;
    border: 1px solid var(--color-green-1);
    border-radius: 9999px;
    background: var(--color-white-1);
    color: var(--color-green-1);
    font-size: 12px;
    line-height: 1;
    text-align: center;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.archive-store-filter-link:hover,
.archive-store-filter-link.is-active {
    background: var(--color-green-1);
    border-color: var(--color-green-1);
    color: var(--color-white-1);
}


a.button-bace,
a.button-bace2,
a.button-bace3,
a.button-bace4 {
    padding: 10px;
    width: 100%;
    display: block;
    text-align: center;
    margin: 20px auto;
    border-radius: 20px;
    letter-spacing: 0.1em;
}

a.button-bace,
a.button-bace2 {
    font-size: 0.8em;
}

a.button-bace {
    background-color: var(--color-white-1);
    color: var(--color-green-1);
}

a.button-bace:hover {
    background-color: var(--color-black-1);
    color: var(--color-green-1);
}

a.button-bace2,
a.button-bace4 {
    background-color: var(--color-green-1);
    color: var(--color-white-1);
}

a.button-bace2:hover,
a.button-bace4:hover {
    background-color: var(--color-black-1);
    color: var(--color-white-1);
}


a.button-bace3 {
    background-color: var(--color-black-1);
    color: var(--color-white-1);
}


a.button-bace3:hover {
    background-color: var(--color-green-1);
    color: var(--color-white-1);
}

.nf404 {
    text-align: center;
}

.youtube {
    position: relative;
    width: 100%;
    padding-top: 56.25%;
}

.youtube iframe {
    position: absolute;
    top: 0;
    right: 0;
    width: 100% !important;
    height: 100% !important;
}

/*/////////////////////////トップページ///////////////////////*/

.kv {
    width: 100vw;
    display: flex;
    justify-content: center;
    align-items: center;
    background-image: none;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    position: relative;
    overflow: hidden;
    isolation: isolate;

}

.kv-slider {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}

.kv-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
}

.kv-slide.is-active,
.kv-slide.is-entering {
    opacity: 1;
}

.kv-slide.is-active {
    z-index: 1;
}

.kv-slide.is-entering {
    z-index: 3;
}

.kv-slide .kv-slice {
    position: absolute;
    top: 0;
    bottom: 0;
    left: calc((100% / var(--kv-slice-count)) * var(--kv-slice-index) - 1px);
    width: calc((100% / var(--kv-slice-count)) + 2px);
    overflow: hidden;
    transform: translateY(100%);
    opacity: 0;
    transition-property: transform, opacity;
    transition-duration: 720ms;
    transition-timing-function: cubic-bezier(0.7, 0, 0.3, 1);
    transition-delay: calc(var(--kv-slice-index) * 55ms);
    will-change: transform, opacity;
}

.kv-slide.is-active .kv-slice {
    transform: translateY(0);
    opacity: 1;
}

.kv-slide.is-entering .kv-slice {
    transform: translateY(0);
    opacity: 1;
}

.kv-slide:not(.is-active):not(.is-entering) .kv-slice {
    transform: translateY(100%);
    opacity: 0;
}

.kv-slide .kv-slice img {
    position: absolute;
    top: 0;
    left: calc(var(--kv-slice-index) * -100% - 1px);
    width: calc(var(--kv-slice-count) * 100% + 2px);
    height: 100%;
    max-width: none;
    object-fit: cover;
    object-position: center center;
}

.kv-content {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.kvlogo {
    background-image: url(../img/kv-logo.png);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    margin-bottom: 100px;
}

/*/NEWS/*/
.topnews {
    background: var(--color-white-1);
    box-shadow: 0px 3px 5px 0px rgb(0 0 0 / 10%);
}

.topnews-wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 auto;
    font-size: 0.8em;
}

.topnewstitle {
    font-size: 10px;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    color: var(--color-gray-2);
}

.topnewstitle h4 {
    font-size: 2.5em;
    color: var(--color-black-1);
    line-height: 1em;
}

a.topnewstxt span {
    margin-right: 1em;
}

a.topnewstxt {
    display: block;
}

.topnewstxt-label {
    display: inline-flex;
    align-items: center;
}

.topnewstxt-title {
    display: inline;
}

a.topnewstxt-secondary {
    display: none;
}

a.topnewslink {
    padding: 0.7em 2em;
    border-radius: 9999px;
    background: var(--color-green-1);
    color: var(--color-white-1);
    font-size: 10px;
}

a.topnewslink:hover {
    background: var(--color-black-1);
    color: var(--color-white-1);
}

body.line-modal-open {
    overflow: hidden;
}

.line-modal-overlay {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 10000;
    background: rgba(0, 0, 0, 0.72);
    justify-content: center;
    align-items: center;
    padding: 20px;
}

.line-modal-overlay.active {
    display: flex;
}

.line-modal-content {
    position: relative;
    width: min(92vw, 520px);
    background: var(--color-white-1);
    border-radius: 22px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.35);
    overflow: hidden;
}

.line-modal-inner {
    padding: 42px 24px 28px;
    text-align: center;
}

.line-modal-inner h3 {
    font-size: 1.6rem;
    margin-bottom: 22px;
    text-align: center;
}

.line-modal-buttons {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.line-modal-button {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 74px;
    padding: 0 16px;
    border-radius: 16px;
    color: var(--color-white-1);
    font-weight: 700;
    font-size: 1.1rem;
    text-decoration: none;
    transition: opacity 0.2s ease;
}

.line-modal-button:link,
.line-modal-button:visited {
    color: var(--color-white-1);
}

.line-modal-button:hover {
    background: var(--color-black-1);
    opacity: 0.92;
}

.line-modal-button-shinbashi {
    background: var(--color-blue-1);
}

.line-modal-button-oyama {
    background: var(--color-red-1);
}

.line-modal-close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 38px;
    height: 38px;
    border: 0;
    border-radius: 50%;
    background: var(--color-gray-1);
    color: var(--color-black-1);
    font-size: 24px;
    line-height: 38px;
    text-align: center;
    cursor: pointer;
    padding: 0;
}

.line-modal-close:hover {
    background: var(--color-black-1);
    color: var(--color-white-1);
}

[data-line-modal-trigger] {
    cursor: pointer;
}

a[data-line-modal-trigger],
a[data-line-modal-trigger]:hover {
    text-decoration: none;
}

@media screen and (max-width: 767px) {
    .line-modal-overlay {
        align-items: flex-end;
        padding: 16px;
    }

    .line-modal-content {
        width: 100%;
        border-radius: 22px 22px 16px 16px;
    }

    .line-modal-inner {
        padding: 36px 18px 22px;
    }

    .line-modal-inner h3 {
        font-size: 1.45rem;
        margin-bottom: 18px;
    }

    .line-modal-button {
        min-height: 64px;
        font-size: 1rem;
    }
}

/*/event/*/

.topevent {}

.event-calender {
    background: var(--color-gray-1);
    padding: 50px 0;
    display: flex;
    justify-content: center;
}

.event-calender>div {
    background: var(--color-white-1);
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    margin: 10px;
}

.event-calender>div>h4 {
    color: var(--color-gold-1);
    line-height: 1em;
    margin: 10px 0 40px 0;
    font-weight: bold;
}

.event-calender>div>p {
    color: var(--color-black-2);
    line-height: 1em;
    margin-top: 2em;
    font-size: 0.8rem;
}

.calenderSet {
    display: flex;
    gap: 30px;
    justify-content: center;
}

.calenderSec {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
}

.store-badge,
.calenderSec>span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    width: fit-content;
    border-radius: 5px;
    color: var(--color-white-1);
    line-height: 1;
    letter-spacing: 0.08em;
    white-space: nowrap;
    border: 1px solid rgba(255, 255, 255, 0.16);
    text-shadow: 0 1px 0 rgba(0, 0, 0, 0.12);
    box-shadow:
        0 1px 2px rgba(0, 0, 0, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.14);
}

.store-badge::before,
.calenderSec>span::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.18) 0%, rgba(255, 255, 255, 0) 45%);
    opacity: 0.45;
    mix-blend-mode: screen;
}

.calenderSec>span {
    margin: 0 auto;
    padding: 8px 18px;
    font-size: 14px;
}

.calenderSec>img {
    width: 100%;
    height: auto;
    border-radius: 5px;
}

.bbp-calendar-slider {
    position: relative;
    width: 100%;
    padding: 0 56px;
}

.bbp-calendar-viewport {
    overflow: hidden;
    border-radius: 8px;
    background: var(--color-white-1);
}

.bbp-calendar-track {
    display: flex;
    width: 100%;
    transform: translate3d(0, 0, 0);
    transition: transform 0.45s cubic-bezier(0.7, 0, 0.3, 1);
    will-change: transform;
}

.bbp-calendar-slide {
    position: relative;
    min-width: 100%;
    background: var(--color-white-1);
}

.bbp-calendar-slide img {
    width: 100%;
    height: auto;
    display: block;
    cursor: pointer;
}

.bbp-calendar-slide-label {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 15px;
    background: var(--color-gold-2);
    color: var(--color-white-1);
    font-size: 16px;
    line-height: 1;
}

.store-badge.is-shinbashi,
.calenderSec.store-shinbashi>span {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0%, rgba(0, 0, 0, 0.08) 100%), var(--color-blue-1);
}

.store-badge.is-oyama,
.calenderSec.store-oyama>span {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.08) 0%, rgba(0, 0, 0, 0.08) 100%), var(--color-red-1);
}

.bbp-calendar-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 45px;
    height: 45px;
    border: 0;
    background-color: transparent;
    background-image: url(../img/arrow-right.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    color: transparent;
    font-size: 0;
    line-height: 0;
    text-indent: -9999px;
    overflow: hidden;
    cursor: pointer;
    z-index: 2;
    padding: 0;
    filter: brightness(0);
}

.bbp-calendar-nav::before {
    content: none;
}

.bbp-calendar-nav:hover {
    filter: brightness(0) saturate(100%) invert(45%) sepia(44%) saturate(768%) hue-rotate(96deg) brightness(95%) contrast(89%);
}

.bbp-calendar-nav-prev {
    left: 0px;
}

.bbp-calendar-nav-prev::before {
    content: none;
}

.bbp-calendar-nav-next {
    right: 0px;
}

.bbp-calendar-nav-prev {
    transform: translateY(-50%) rotate(180deg);
}

@media (prefers-reduced-motion: reduce) {
    .bbp-calendar-track {
        transition: none;
    }
}

.modal-overlay {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, 0.8);
    justify-content: center;
    align-items: center;
}

.modal-overlay.active {
    display: flex;
}

.modal-content {
    position: relative;
    display: inline-block;
    text-align: center;
}

.modal-content img {
    max-width: 90vw;
    max-height: 90vh;
    border: 4px solid #fff;
    border-radius: 8px;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.6);
    display: block;
    margin: 0 auto;
}

.modal-close {
    position: absolute;
    top: -18px;
    right: -18px;
    background: #fff;
    color: #333;
    border-radius: 50%;
    width: 36px;
    height: 36px;
    font-size: 24px;
    text-align: center;
    line-height: 36px;
    cursor: pointer;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
}

.modal-thumb {
    max-width: 400px;
    cursor: pointer;
}

.topeventlist {
    background-color: var(--color-green-1);
    position: relative;
    box-shadow: 0 0 5px 0 rgb(0 0 0 / 40%);
}

.topeventlist a:hover {
    color: var(--color-black-1);
}

a.topeventlink {
    position: absolute;
    background: var(--color-black-1);
    color: var(--color-white-1);
    top: 0;
    right: 0;
    padding: 0 20px;
    font-size: 12px;
    letter-spacing: 0.5em;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    z-index: 9999;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    box-shadow: -7px 0 5px -2px rgb(0 0 0 / 40%);
}

a.topeventlink span:before {
    content: "";
    display: inline-block;
    background-image: url(../img/arrow-right.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin-bottom: 1em;
    width: 25px;
    height: 25px;
}

a.topeventlink:hover {
    color: var(--color-green-1);
}

.top-event-photo {
    width: 100%;
    aspect-ratio: 1;
    background-image: url(../img/noimage.png);
    background-size: cover;
}

.top-event-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 5px;
    aspect-ratio: 1;

}

.swiper-slide h6 {
    margin: 1em 0;
    width: 100%;
}

.top-event-txt {
    font-size: 0.8em;
    max-height: 100px;
    overflow-y: hidden;
    flex-grow: 1;
}

/*SWIPER*/
.swiper-big {
    position: relative;
}

.swiper {
    width: 100%;
}

.swiper-slide {
    display: flex;
    flex-direction: column;
    background: var(--color-white-1);
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 20%);
    height: auto !important;
}

.swiper-pagination {
    position: relative !important;
}

.swiper-pagination-bullets {
    position: static;
    margin-top: 30px;
}

.swiper-pagination-bullet {
    width: 12px !important;
    height: 12px !important;
    margin: 0 0 0 10px !important;
    background: var(--color-white-1) !important;
}

.swiper-pagination-bullet:first-child {
    margin: 0 !important;
}


/*ビギナー*/
.topbeginners {
    background: var(--color-white-1);
    padding-bottom: 100px;
}

.topbeginners-content {
    border-radius: 20px;
    background-image: url(../img/photo-beginners.jpg);
    background-size: cover;
    background-position: center;
    margin: auto;
    display: flex;
    justify-content: center;
    align-items: flex-start;
}

.topbeginners-content div {
    height: auto;
    background: var(--color-white-1);
    padding: 30px;
    border-radius: 10px;
    margin-top: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.topbeginners-content div h4 {
    color: var(--color-green-1);
    line-height: 1.5em;
}

.topbeginners-content div p {
    font-size: 0.8em;
    margin: 1em 0;
}

.topbeginners-content div a:link,
.topbeginners-content div a:visited {
    font-size: 0.8em;
    color: var(--color-green-1);
}

.topbeginners-content div a:hover {
    color: var(--color-black-1);
}


/*ゲーム*/
.topgame {
    background: url(../img/gradation2.jpg);
    background-size: cover;
    background-position: center;
    padding-bottom: 100px;
}

.topgame-wrap1,
.topgame-wrap2 {
    display: flex;
    justify-content: space-between;
    margin: 0 auto 20px auto;
}

.topgame-wrap1>div:first-of-type img {
    border-radius: 20px;
    margin-bottom: 2em;
}

.topgame-wrap1>div:last-of-type {
    color: var(--color-white-1);
}

.topgame-wrap1>div:last-of-type h4 {
    margin-bottom: 0.5em;
}

.topgame-wrap1>div:last-of-type p {
    margin: 0 0 2em 0;
}

.topgame-wrap2>a {
    padding: 20px;
    background: var(--color-white-1);
    border-radius: 20px;
    box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 20%);
}

.topgame-wrap2>a>img {
    border-radius: 10px;
    aspect-ratio: 1;
    object-fit: cover;
}

.topgame-wrap2>a>h5 {
    margin: 1em 0;
    color: var(--color-green-1);
    line-height: 1.4em;
}

.topgame-wrap2>a>p {
    font-size: 0.8em;
}


/*店舗情報*/
.topinfo {
    background: var(--color-gray-1);
    padding-bottom: 100px;
}

.topinfo-wrap {
    box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 5%);
}

.topinfo-wrap,
.topinfo-wrap2 {
    display: flex;
    justify-content: center;
    margin: 0 auto;
    width: var(--width-pc);
    border-radius: 20px;
}

.topinfo-wrap,
.topinfo-wrap2 {
    margin-top: 30px;
}

.topinfo-wrap>div:first-of-type {
    background: url(../img/info-building.jpg);
    background-size: cover;
    background-position: center;
    aspect-ratio: 2/3;
}

.topinfo-wrap>div.info-oyama:first-of-type {
    background: url(../img/info-building-oyama.jpg);
    background-size: cover;
    background-position: center;
    aspect-ratio: 2/3;
}

.topinfo-wrap>div:nth-of-type(2) {
    background: var(--color-white-1);
    padding: 30px;
}

.topinfo-wrap>div:nth-of-type(2)>h4 {
    line-height: 1.4em;
    margin-bottom: 50px;
}

.topinfo-wrap>div:nth-of-type(2)>p {
    margin-bottom: 50px;
    line-height: 1.2em;
}

.topinfo-wrap>div:nth-of-type(2)>h6 {
    line-height: 1em;
    font-size: 0.8em;
    margin-bottom: 5px;
}

.topinfotel {
    font-size: 1.5em;
}

.topinfo-wrap>div:nth-of-type(2)>a {
    text-decoration: underline;
}



/*フード＆ドリンク*/
.topfood {
    marign: 100px 0;
    position: relative;
    width: 100%;
    min-height: 500px;
}

.topfood-wrap {
    margin-bottom: 200px;
}

.topfoodback {
    background: var(--color-orange-1);
    margin: auto;
}

.topfood-wrap1 {
    display: flex;
    justify-content: center;
    align-items: center;
}

.topfood-wrap1-txt {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.topfood-wrap2,
.topfood-wrap3 {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.topfood-wrap2>div>img,
.topfood-wrap3>div>img {
    border-radius: 20px;
    aspect-ratio: 1;
    object-fit: cover;
    box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 5%);
}

.topfood-wrap3>div>img {
    border-radius: 20px;
    aspect-ratio: 1;
    object-fit: cover;
}

/*/////////////////////////ページ///////////////////////*/
.breadcrumb {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    margin: 0 auto;
    padding: 20px;
    font-size: 0.6em;
    width: 100%;
    box-shadow: 0px 3px 5px 0px rgb(0 0 0 / 10%);
}

.breadcrumb>ul {
    margin: auto;
}

.breadcrumb>ul>li {
    display: inline-block;
    color: var(--color-black-1);
}

.breadcrumb>ul>li:not(:last-of-type)::after {
    content: "›";
    margin: 0 .6em;
    color: var(--color-gray-2);
}

.breadcrumb a:link,
.breadcrumb a:visited {
    color: var(--color-gray-2);
}

.breadcrumb a:hover {
    color: var(--color-green-1);
}

.newslist {
    margin: auto;
    padding: 50px 0;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
}

.newslist>a {
    background: var(--color-gray-1);
    box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 20%);
    padding: 20px;
    border-radius: 20px;
    display: flex;
    flex-direction: column;
}

.newslist-photo {
    width: 100%;
    aspect-ratio: 1;
    background-image: url(../img/noimage.png);
    background-size: cover;
    background-position: center;
}

.newslist img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
    aspect-ratio: 1;
}

.newslist>a>h6 {
    margin: 1em 0;
}

.newslist>a>.newslist-txt {
    font-size: 0.8em;
    flex-grow: 1;
}

.store-badge {
    margin-top: 16px;
    padding: 6px 12px;
    font-size: 10px;
}

.page .store-badge {
    margin-top: 20px;
    padding: 8px 16px;
    font-size: 12px;
}

.store-badge-inline {
    margin-top: 0;
    margin-right: 0.8em;
    padding: 4px 10px;
    font-size: 9px;
    vertical-align: middle;
}

.page {
    margin: 0 auto 100px auto;
    background: var(--color-gray-1);
    border-radius: 20px;
    padding: 30px;
    box-shadow: 0px 0px 5px 0px rgb(0 0 0 / 20%);
}

.pagephoto {
    width: 100%;
    height: 100%;
    background-image: url(../img/noimage.png);
    background-size: cover;
    background-position: center;
}

.pagephoto img {
    width: 100%;
    height: auto;
    border-radius: 10px;
}

.page>h4 {
    margin: 1em 0;
    line-height: 1.4em;
    color: var(--color-green-1);
    font-weight: 500;
}

.pagedate {
    margin: 20px 0;
    font-size: 0.8em;
    color: var(--color-gray-2);
}

.pagetxt {
    margin: 20px 0;
}

.pagetxt>p {
    margin: 1em 0;
    color: var(--color-black-2);
}

.pagetxt>img,
.pagetxt>p>img {
    max-width: 100%;
    height: auto;
    margin: 2em auto;
}

.pagetxt a {
    color: var(--color-green-1);
    text-decoration: underline;
}

.pagetxt a:hover {
    color: var(--color-black-1);
}


/*/ゲーム/*/
.page-game {
    margin: 0 auto 100px auto;
}

.page-game1 {
    margin: auto;
    background: url(../img/game-photo1.jpg);
    background-size: cover;
    background-position: center;
    border-radius: 20px;
    color: var(--color-white-1);
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
}

.page-game1Txt {
    background-color: rgba(0, 0, 0, 0.8);
    padding: 20px;
    border-radius: 10px;
}

.page-game1Txt h3,
.page-game1Txt p {
    margin: 0.5em;
}

.page-game-wrap {
    margin-bottom: 100px;
}

.page-game-r {
    background: url(../img/gradation.jpg);
    background-size: cover;
    background-position: center;
    border-radius: 20px 0 0 20px;
    margin-bottom: 50px;
}

.page-game-l {
    background: url(../img/gradation.jpg);
    background-size: cover;
    background-position: center;
    border-radius: 0 20px 20px 0;
    margin-bottom: 50px;
}

.page-game-contents {
    display: flex;
    justify-content: space-between;
    padding: 20px;
}

.page-game-r>.page-game-contents {
    margin-right: auto;
}

.page-game-l>.page-game-contents {
    margin-left: auto;
}

.page-game-wrap-photo {
    aspect-ratio: 4 / 3;
    width: 100%;
    max-height: 420px;
    overflow: hidden;
    border-radius: 10px;
}

.page-game-wrap-photo img {
    display: block;
    object-fit: cover;
    width: 100%;
    height: 100%;
    aspect-ratio: 4 / 3;
}

.page-game-wrap-txt {
    color: var(--color-white-1);
}

.page-game-wrap-txt>h3 {
    font-weight: bold;
    line-height: 1em;
    margin: 20px 0 10px 0;
    letter-spacing: 0.1em;
}

.page-game-wrap-txt>p:first-of-type {
    font-weight: 200;
    font-size: 0.8em;
    letter-spacing: 0.1em;
    line-height: 1em;
    margin-left: 3px;
}

.page-game-wrap-txt-ex {
    font-size: 0.8em;
    margin: 40px 0;
}

.page-game-wrap-txt-ex p {
    margin: 1em 0;
}

.page-game-price {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin-bottom: 20px;
}

.page-game-price>div {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
    box-sizing: border-box;
}

.page-game-price>div:first-of-type {
    background: var(--color-green-1);
    color: var(--color-white-1);
    border-radius: 20px 20px 0 0;
    width: 100%;
}

.page-game-price>div:last-of-type {
    color: var(--color-green-1);
    background: var(--color-white-1);
    border-radius: 0 0 20px 20px;
    width: 100%;
    display: block;
}

.page-game-price table {
    border-collapse: collapse;
    width: 100% !important;
    table-layout: fixed;
}

.page-game-price th,
.page-game-price td {
    border: solid 1px var(--color-green-1);
    padding: 10px;
    word-break: break-all;
    overflow-wrap: anywhere;
    font-size: 0.8em;
}

.page-game-price th span,
.page-game-price td span {
    white-space: normal !important;
    word-break: inherit;
    overflow-wrap: inherit;
}

.page-game-price tr:first-child {
    border: solid 1px var(--color-green-1);
    background-color: var(--color-green-1);
    color: var(--color-white-1);
}


/*/店舗情報/*/
.page-info {
    margin: 0 auto 100px auto;
}

.info1 {
    display: flex;
    height: 500px;
}

.info1>div {
    width: calc(100% / 3);
    height: 100%;
    position: relative;
    overflow: hidden;
}

.info1>div>img,
.info2>div>img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.info1>div:first-of-type {
    border-radius: 20px 0 0 20px;
}

.info1>div:last-of-type {
    border-radius: 0 20px 20px 0;
}

.info1>div:first-of-type>img {
    border-radius: 20px 0 0 20px;
}

.info1>div:last-of-type>img {
    border-radius: 0 20px 20px 0;
}


.info2 {
    display: flex;
    align-items: stretch;
    margin: 50px 0;
}

.info2>div:last-of-type {
    background: var(--color-gray-1);
    padding: 30px;
}

.info2>div:last-of-type>h4 {
    margin-bottom: 1em;
    font-weight: bold;
}

.info2-txt>.info2-txt２>p {
    margin: 1em 0;
}

.info2-txt>.info2-txt２>p a {
    color: var(--color-green-1);
    text-decoration: underline;
}

.page-info>.topinfo-wrap>div:nth-of-type(2) {
    background: var(--color-gray-1);
}


/*/フード/*/
.page-food-wrap {
    margin: 0 auto 100px auto;
}

.food-caption {
    margin-top: 30px;
    font-size: 10px;
}

/*タブ切り替え全体のスタイル*/
.tabs {
    margin-top: 50px;
    background-color: var(--color-white-1);
    width: 100%;
    margin: 0 auto;
}

/*タブのスタイル*/
.tab_item {
    background-color: var(--color-orange-1);
    text-align: center;
    display: block;
    float: left;
    transition: all 0.2s ease;
    padding: 10px 20px;
    border-radius: 20px 20px 0 0;
    min-width: 120px;
    font-size: 0.8em;
}

.tab_item:first-of-type {
    margin-left: calc(50% - 125px);
    margin-right: 5px;
}

.tab_item:last-of-type {
    margin-right: calc(50% - 125px);
    margin-left: 5px;
}

.tab_item:hover {
    cursor: pointer;
    background-color: var(--color-orange-2);
    color: var(--color-black-1);
}

input[name="tab_item"] {
    display: none;
}

.tab_content {
    display: none;
    padding: 30px;
    clear: both;
    overflow: hidden;
    background: var(--color-orange-2);
    border-radius: 20px;
}

.tab_content_description {
    background: var(--color-white-1);
    border-radius: 20px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    margin-bottom: 30px;
}

.tab_content_description>div>img {
    width: 100%;
    border-radius: 10px;
}

.tab_content_description>div.tab-txt {
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.tab_content_description>div.tab-txt>h3 {
    line-height: 1.3em;
    font-size: 1.5em;
    color: var(--color-orange-3);
}

.tab_content_description>div.tab-txt>p {
    margin: 1em 0;
}

.tab_content_description>div.tab-txt>h4 {
    margin-top: auto;
    font-weight: 500;
    letter-spacing: 0.1em;
}

.tab_content_description>div.tab-txt>h4>span {
    font-size: 0.8em;
}

.tab_content_description>div.tab-txt>h4 {
    margin-top: auto;
}

.tab_content_description>div.tab-txt>h4,
.tab_content_description>div.tab-txt>h4>span {
    font-weight: 500;
    letter-spacing: 0.1em;
}

#food:checked~#food_content,
#drink:checked~#drink_content {
    display: block;
}

.tabs input:checked+.tab_item {
    background: var(--color-orange-2);
}

/*/お問い合わせ/*/
.page-contact {
    margin: 0 auto 100px auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.page-contact>h4 {
    margin: 20px 0;
}

.page-contact>a.button-bace3:before,
.page-contact>a.button-bace4:before {
    margin-right: 10px;
    vertical-align: middle;
    height: 1.8em;
}

.page-contact>a.button-bace3:before {
    content: url(../img/phone.png);
}

.page-contact>a.button-bace4:before {
    content: url(../img/line.png);
}

/*/初心者/*/
.page-beginner {
    width: var(--width-pc);
    margin: 0 auto 100px auto;
}

.page-beginner>.topbeginners-content {
    width: 100%;
    max-width: 100%;
    height: 550px;
}

.page-beginner>.info2>div>h4 {
    margin-bottom: 1em;
    font-weight: bold;
    color: var(--color-green-1);
}

.page-beginner-txt {
    margin: 2em 0;
}

.page-beginner-txt p {
    margin: 1em 0;
}

.page-beginner-txt a:link {
    color: var(--color-green-1);
    text-decoration: underline;
}








/*/////////////////////////ページネーション///////////////////////*/
.pagination {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 50px auto 100px auto;
    padding: 10px 0;
    position: relative;
    font-size: 16px;
}

.pagination a:link,
.pagination a:visited {
    color: var(--color-green-1);
}

.pagination span,
.pagination a {
    display: block;
    width: auto;
    text-decoration: none;
    text-align: center;
    margin: 10px;
    padding: 10px;
    line-height: 1em;
    border-radius: 5px;
}

/* ページ番号 */
.pagination .pager {
    border: 1px solid var(--color-green-1);
}

/* ホバー時 & 現在のページ */
.pagination a:hover {
    opacity: .7;
    -webkit-transition: all 0.25s ease-out;
    transition: all 0.25s ease-out;
}

.pagination .current {
    text-shadow: none;
    color: var(--color-white-1);
    background: var(--color-green-1);
    border: 1px solid var(--color-green-1);
}

/* 前へ */
.pagination a.prev {
    font-size: 1.5em;
}

/* 次へ */
.pagination a.next {
    font-size: 1.5em;
}

/* 最初へ */
.pagination a.first {}

/* 最後へ */
.pagination a.last {}

/* Page x / y */
.pagination span.page_num {
    display: none;
}






/*==============================================================================================
●PCサイズ
==============================================================================================*/

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

    .sp,
    .tb,
    .tbreserve {
        display: none !important;
    }

    .pc {
        display: block !important;
    }

    .sp-menu {
        display: none !important;
    }



    /*/////////////////////////ヘッダー///////////////////////*/
    header {}

    .header-wrap {
        width: 1280px;
        margin: 0 auto;
    }

    /*/////////////////////////フッター///////////////////////*/
    .footer-wrap {
        width: var(--width-pc);
    }

    .flogo {
        padding-right: 40px;
    }

    .footerinfo {
        border-right: 1px solid var(--color-gray-1);
        padding: 0 20px;
    }

    .footer_shop {
        display: flex;
    }

    footer ul {
        font-size: 0.8em;
        margin-left: 20px;
    }

    footer ul li {
        margin: 0.2em 0;
    }

    a.button-footer1,
    a.button-footer2 {
        font-size: 0.6em;
    }

    .copyrightsp {
        display: none;
    }

    /*/////////////////////////共通レイアウト///////////////////////*/


    /*/////////////////////////WAVE///////////////////////*/


    /*/////////////////////////トップページ///////////////////////*/
    .kv {
        height: 600px;
    }

    .kvlogo {
        width: 167px;
        height: 184px;
    }

    .topnews-wrap {
        width: var(--width-pc);
        height: 100px;
    }

    .topnewstitle {}

    a.topnewslink {}

    /*/EVENT/*/
    .event-calender>div {
        width: var(--width-pc);
        padding: 30px;
    }

    .event-calender iframe {
        width: 100%;
        height: 1000px;
    }

    .topeventlist {
        padding: 40px 0 40px 20px;
    }

    /*/BEGINNERS/*/
    .topbeginners-content {
        width: 900px;
        height: 550px;
    }

    .topbeginners-content div {
        width: 50%;
    }

    /*/GAME/*/
    .topgame-wrap1,
    .topgame-wrap2 {
        width: var(--width-pc);
        flex-direction: row;
    }

    .topgame-wrap1>div {
        width: calc(50% - 20px);
    }

    .topgame-wrap2>a {
        width: calc(25% - 10px);
    }

    /*/INFO/*/
    .topinfo-wrap,
    .topinfo-wrap2 {
        width: var(--width-pc);
    }

    .topinfo-wrap2 {
        width: 100%;
    }

    .topinfo-wrap>div {
        width: 33.333%;
    }

    .topinfo-wrap>div:first-of-type {
        border-radius: 20px 0 0 20px;
    }

    .topinfo-wrap>div:last-of-type iframe {
        border-radius: 0 20px 20px 0;
    }

    /*/FOOD/*/
    .topfoodback {
        width: 80%;
        height: 110%;
        border-radius: 30px;
        top: 0;
        left: 5%;
        right: 0;
        position: absolute;
        transform: rotate(-3deg);
        z-index: -1;
    }

    .topfood-wrap1 {
        width: var(--width-pc);
        margin: 100px auto 0px auto;
        padding-top: 100px;
    }


    .topfood-wrap1-txt {
        margin-left: 200px;
    }

    .topfood-wrap2>div,
    .topfood-wrap3>div {
        width: 20%;
        max-width: 220px;
    }

    .topfood-wrap2 {
        margin: 100px 10% 100px 20%;
    }

    .topfood-wrap3 {
        margin: 100px 20% 100px 10%;
    }

    /*/////////////////////////ページ///////////////////////*/
    .breadcrumb>ul {
        width: var(--width-pc);
    }

    .newslist {
        width: var(--width-pc);
    }

    .newslist>a {
        width: calc(25% - 30px);
        margin: 15px;
    }

    .page {
        width: 50%;
        max-width: 800px;
    }

    /*/ゲーム/*/
    .page-game1 {
        width: var(--width-pc);
        height: 400px;
        padding: 30px;
    }

    .page-game1>div {
        width: 30%;
    }

    .page-game-r {
        margin-left: calc((100% - var(--width-pc)) / 2);
    }

    .page-game-l {
        margin-right: calc((100% - var(--width-pc)) / 2);
    }

    .page-game-contents {
        width: var(--width-pc);
    }

    .page-game-wrap-photo,
    .page-game-wrap-txt {
        width: calc(50% - 20px);
    }

    /*/店舗情報/*/
    .page-info {
        width: var(--width-pc);
    }

    .info2>div {
        width: 50%;
    }

    .info2>div:first-of-type>img {
        border-radius: 20px 0 0 20px;
    }

    .info2>div:last-of-type {
        border-radius: 0 20px 20px 0;
    }

    /*/フード/*/
    .page-food-wrap {
        width: var(--width-pc);
    }

    .tab_content_description {
        width: 80%;
        padding: 30px;
    }

    .tab_content_description>div:first-of-type {
        width: calc(40% - 20px);
    }

    .tab_content_description>div:last-of-type {
        width: calc(60% - 20px);
    }

    /*/お問い合わせ/*/
    .page-contact {
        width: var(--width-pc);
    }

    .page-contact>a {
        width: 50%;
        max-width: 400px;
        font-size: 1.3em;
    }

    .page-contact hr {
        width: 100%;
        border: 1px solid var(--color-gray-1);
    }

    a[href^="tel:"] {
        pointer-events: none;
    }

    /*/初心者/*/
    .page-beginner {
        width: var(--width-pc);
    }


    /*/////////////////////////ページネーション///////////////////////*/
    .pagination {
        width: 100%;
    }



}


/*==============================================================================================
●タブレットサイズ
==============================================================================================*/

@media screen and (min-width: 450px) and (max-width: 1279px) {

    .sp,
    .pc,
    .pcreserve {
        display: none !important;
    }

    .tb {
        display: block !important;
    }

    /*/////////////////////////ヘッダー///////////////////////*/
    header {}

    /*/////////////////////////スマホメニュー///////////////////////*/
    .sp-menu {
        display: block;
    }

    .pcmenu {
        display: none;
    }

    /*/////////////////////////フッター///////////////////////*/
    .footer-wrap {
        width: var(--width-tb);
        flex-direction: column;
    }

    .flogo {
        padding-right: 30px;
    }

    .footerinfo {
        padding: 10px 0;
    }

    .footerinfo:first-child {
        border-bottom: 1px solid var(--color-gray-1);
    }

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

    footer ul {
        font-size: 0.8em;
        margin-left: 20px;
    }

    footer ul li {
        margin: 0.2em 0;
    }

    a.button-footer1,
    a.button-footer2 {
        font-size: 0.6em;
    }

    .copyright {
        display: none;
    }

    .copyrightsp {
        display: block;
        margin-top: 50px;
    }

    /*/////////////////////////共通レイアウト///////////////////////*/


    /*/////////////////////////トップページ///////////////////////*/
    .tbreserve {
        box-shadow: 0 -5px 2px 0px rgb(0 0 0 / 20%);
    }

    .kv {
        height: 600px;
        position: relative;
    }

    .kvlogo {
        width: 167px;
        height: 184px;
    }

    .kv a.reserve {
        width: 130px;
        height: 60px;
        bottom: 0;
        right: 0;
        left: 0;
        border-radius: 20px 20px 0 0;
    }

    .topnews-wrap {
        width: 100%;
        height: 100px;
    }

    .topnewstitle {
        margin-left: 20px;
    }

    a.topnewslink {
        margin-right: 20px;
    }

    /*/EVENT/*/
    .event-calender>div {
        width: var(--width-tb);
        padding: 30px;
    }

    .event-calender iframe {
        width: 100%;
        height: 1000px;
    }

    .calenderSec {
        max-width: 500px;
    }

    .calenderSet {
        flex-direction: column;
    }

    .bbp-calendar-slider {
        padding: 0 46px;
    }

    .topeventlist {
        padding: 40px 0;
    }


    /*SWIPER*/
    .swiper {
        padding: 30px !important;
    }

    .top-recommend-program-title {
        display: block;
    }

    /*/BEGINNERS/*/
    .topbeginners-content {
        width: var(--width-tb);
        max-width: 900px;
        height: 550px;
    }

    .topbeginners-content div {
        width: 80%;
        max-width: 450px;
    }

    /*/GAME/*/
    .topgame-wrap1,
    .topgame-wrap2 {
        width: var(--width-tb);
        flex-direction: row;
        flex-wrap: wrap;
    }

    .topgame-wrap1>div {
        width: calc(50% - 20px);
    }

    .topgame-wrap2>a {
        width: calc(50% - 10px);
        margin: 10px 0;
    }

    /*/INFO/*/
    .topinfo-wrap,
    .topinfo-wrap2 {
        width: var(--width-tb);
        max-width: 500px;
        flex-direction: column;
    }

    .topinfo-wrap>div {
        width: 100%;
    }

    .topinfo-wrap>div:first-of-type {
        border-radius: 20px 20px 0 0;
    }

    .topinfo-wrap>div:last-of-type iframe {
        border-radius: 0 0 20px 20px;
        min-height: 500px;
    }

    /*/FOOD/*/
    .topfoodback {
        width: 80%;
        height: 110%;
        border-radius: 30px;
        top: 0;
        left: 5%;
        right: 0;
        position: absolute;
        transform: rotate(-3deg);
        z-index: -1;
    }

    .topfood-wrap1 {
        width: var(--width-tb);
        flex-direction: column;
        margin: 50px auto;
    }

    .topfood-wrap2>div,
    .topfood-wrap3>div {
        width: 23%;
        max-width: 220px;
    }

    .topfood-wrap2 {
        margin: 50px 5% 50px 10%;
    }

    .topfood-wrap3 {
        margin: 50px 10% 50px 5%;
    }

    /*/店舗情報/*/
    .page-info {
        width: var(--width-tb);
    }

    .info2>div {
        width: 50%;
    }

    .info2>div:first-of-type>img {
        border-radius: 20px 0 0 20px;
    }

    .info2>div:last-of-type {
        border-radius: 0 20px 20px 0;
    }

    /*/フード/*/
    .page-food-wrap {
        width: var(--width-tb);
    }

    .tab_content_description {
        width: 100%;
        padding: 30px;
    }

    .tab_content_description>div:first-of-type {
        width: calc(40% - 20px);
    }

    .tab_content_description>div:last-of-type {
        width: calc(60% - 20px);
    }

    /*/お問い合わせ/*/
    .page-contact {
        width: var(--width-tb);
    }

    .page-contact>a {
        width: 100%;
        max-width: 400px;
        font-size: 1.3em;
    }

    a[href^="tel:"] {
        pointer-events: none;
    }

    /*/初心者/*/
    .page-beginner {
        width: var(--width-tb);
    }

    /*/////////////////////////ページ///////////////////////*/
    .breadcrumb>ul {
        width: var(--width-tb);
    }

    .newslist {
        width: var(--width-tb);
        justify-content: center;
    }

    .newslist>a {
        width: calc(50% - 30px);
        max-width: 300px;
        min-width: 300px;
        margin: 15px;
    }

    .page {
        width: var(--width-tb);
        max-width: 800px;
    }

    /*/ゲーム/*/
    .page-game1 {
        width: var(--width-tb);
        height: 400px;
        padding: 30px;
    }

    .page-game1>div {
        width: 50%;
        min-width: 310px;
        margin: 0 auto;
    }

    .page-game-r {
        margin-left: calc((100% - var(--width-tb)) / 2);
    }

    .page-game-l {
        margin-right: calc((100% - var(--width-tb)) / 2);
    }

    .page-game-contents {
        width: 90vw;
        flex-direction: column;
    }

    .page-game-wrap-photo,
    .page-game-wrap-txt {
        width: 100%;
    }

    .page-game-wrap-txt>h3 {
        margin: 30px 0 10px 0;
    }

    .page-game-wrap-txt>p:last-of-type {
        margin: 20px 0;
    }

}


/*==============================================================================================
●スマホサイズ
==============================================================================================*/

@media screen and (max-width: 449px) {
    img {
        max-width: 100%;
        height: auto;
    }

    .sp,
    .tb {
        display: block !important;
    }

    .pc,
    .pcreserve {
        display: none !important;
    }

    /*/////////////////////////ヘッダー///////////////////////*/
    header {
        height: 60px;
    }

    /*/////////////////////////スマホメニュー///////////////////////*/
    .sp-menu {
        display: block;
    }

    .pcmenu {
        display: none;
    }

    .menu-btn {
        top: 10px;
    }

    /*/////////////////////////フッター///////////////////////*/
    .footer-wrap {
        width: var(--width-sp);
        flex-direction: column;
    }

    .fmenu {
        margin-bottom: 50px;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .flogo {
        margin-bottom: 50px;
    }

    .footerinfo {
        width: 100%;
        padding: 20px 0;
        border-bottom: 1px solid var(--color-gray-1);
        font-size: 1.2em;
    }

    footer ul {
        font-size: 1em;
        margin-top: 30px;
    }

    footer ul li {
        text-align: center;
        margin: 0.5em 0;
    }

    footer .store-info-dropdown>summary {
        justify-content: center;
    }

    footer .store-info-dropdown-menu {
        position: static;
        min-width: 0;
        margin-top: 6px;
        padding: 6px 0 0 0;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
    }

    .fmenu2 {
        width: 80%;
    }

    a.button-footer1,
    a.button-footer2 {
        font-size: 0.9em;
    }

    .copyright {
        display: none;
    }

    .copyrightsp {
        display: block;
        margin-top: 50px;
    }


    /*/////////////////////////共通レイアウト///////////////////////*/
    .titles-sp {
        padding: 100px 0 30px 0;
    }

    .archive-store-filter {
        margin-top: 50px;
    }

    .titles h1,
    .titles2 h1 {
        font-size: 2em;
    }

    .store-info-dropdown-menu a {
        text-align: center;
    }

    /*/////////////////////////トップページ///////////////////////*/
    .tbreserve {
        box-shadow: 0 -5px 2px 0px rgb(0 0 0 / 20%);
    }

    .kv {
        height: 70vh;
        position: relative;
    }

    .kvlogo {
        width: 120px;
        height: 132px;
    }

    .kv a.reserve {
        width: 130px;
        height: 60px;
        bottom: 0;
        right: 0;
        left: 0;
        border-radius: 20px 20px 0 0;
    }

    .topnews-wrap {
        width: var(--width-sp);
        flex-direction: column;
        padding: 30px 0;
    }

    .topnewstitle,
    a.topnewslink {
        margin: 20px 0;
    }

    a.topnewstxt {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        width: 100%;
        text-align: left;
    }

    a.topnewstxt span {
        margin-right: 0;
    }

    .topnewstxt-date {
        display: block;
        margin-bottom: 0.35em;
    }

    .topnewstxt-label {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.35em;
        width: 100%;
    }

    .topnewstxt-title {
        display: block;
    }

    a.topnewstxt-secondary {
        display: block;
        border-top: 1px solid var(--color-gray-3);
        margin-top: 1.5em;
        padding-top: 1.5em;
    }

    /*/EVENT/*/
    .event-calender>div {
        width: var(--width-sp);
        padding: 20px;
    }

    .event-calender iframe {
        width: 100%;
        height: 2200px;
    }

    .bbp-calendar-slider {
        padding: 0 72px;
    }

    .bbp-calendar-nav-prev {
        left: -15px;
    }

    .bbp-calendar-nav-next {
        right: -15px;
    }

    .calenderSet {
        flex-direction: column;
    }

    .bbp-calendar-slider {
        padding: 0 42px;
    }

    .topeventlist {
        padding: 40px 0;
    }

    .maincontents {}


    /*SWIPER*/
    .swiper {
        padding: 15px !important;
    }

    .swiper-slide-width {
        width: 75% !important;

    }

    /*/BEGINNERS/*/
    .topbeginners-content {
        width: var(--width-sp);
        height: 550px;
    }

    .topbeginners-content div {
        width: 85%;
    }

    /*/GAME/*/
    .topgame-wrap1,
    .topgame-wrap2 {
        width: var(--width-sp);
        flex-direction: column;
    }

    .topgame-wrap1>div,
    .topgame-wrap2>a {
        width: 100%;
    }

    .topgame-wrap2>a {
        margin: 10px 0;
    }

    /*/INFO/*/
    .topinfo-wrap,
    .topinfo-wrap2 {
        width: var(--width-sp);
        flex-direction: column;
    }

    .topinfo-wrap>div {
        width: 100%;
    }

    .topinfo-wrap>div:first-of-type {
        border-radius: 20px 20px 0 0;
    }

    .topinfo-wrap>div:last-of-type iframe {
        border-radius: 0 0 20px 20px;
        min-height: 500px;
    }

    /*/FOOD/*/
    .topfood {
        overflow: hidden;
    }

    .topfoodback {
        margin: 50px 0;
        width: 90%;
        height: 80%;
        border-top-left-radius: 30px;
        border-bottom-left-radius: 30px;
        left: 10%;
        position: absolute;
        z-index: -1;
        overflow: hidden;
    }

    .topfood-wrap {
        width: 90%;
        margin-left: 10%;
    }

    .topfood-wrap1 {
        width: var(--width-sp);
        flex-direction: column;
        margin: 50px auto;
    }

    .topfood-wrap1 .titles {
        padding: 50px 0;
    }

    .topfood-wrap2-3 {
        display: flex;
        justify-content: space-between;
        width: 90%;
        margin: auto;
    }

    .topfood-wrap2,
    .topfood-wrap3 {
        flex-direction: column;
    }

    .topfood-wrap2>div,
    .topfood-wrap3>div {
        width: 80%;
        margin: 20px 0;
    }

    .topfood-wrap2 {
        margin-top: 100px;
    }

    .topfood-wrap3 {
        margin: 0;
    }

    /*/////////////////////////ページ///////////////////////*/
    .breadcrumb>ul {
        width: var(--width-sp);
    }

    .newslist {
        width: var(--width-sp);
    }

    .newslist>a {
        width: 100%;
        margin: 15px;
    }

    .page {
        width: var(--width-sp);
    }

    /*/ゲーム/*/
    .page-game1 {
        width: var(--width-tb);
        aspect-ratio: 4/3;
        padding: 20px;
    }

    .page-game1>div {
        width: 100%;
        margin: 0 auto;
        font-size: 0.8em;
        line-height: 1.5em;
    }

    .page-game-r {
        margin-left: 10px;
    }

    .page-game-l {
        margin-right: 10px;
    }

    .page-game-contents {
        width: 100%;
        flex-direction: column;
    }

    .page-game-wrap-photo,
    .page-game-wrap-txt {
        width: 100%;
    }

    .page-game-wrap-txt>h3 {
        margin: 30px 0 10px 0;
    }

    .page-game-wrap-txt>p:last-of-type {
        margin: 20px 0;
    }

    .page-game-price div:first-child {
        letter-spacing: 0.5em;
    }

    .page-game-price table.bbp-game-price-table {
        font-size: 0.75em;
    }

    .page-game-price>div:last-of-type {
        padding: 18px 16px;
    }

    .page-game-price table.bbp-game-price-table tbody,
    .page-game-price table.bbp-game-price-table tr,
    .page-game-price table.bbp-game-price-table th,
    .page-game-price table.bbp-game-price-table td {
        display: block;
        width: 100%;
    }

    .page-game-price table.bbp-game-price-table .bbp-game-price-head-row {
        display: none;
    }

    .page-game-price table.bbp-game-price-table .bbp-game-price-data-row {
        padding: 14px 0;
        border-bottom: 1px dashed rgba(40, 167, 69, 0.35);
    }

    .page-game-price table.bbp-game-price-table .bbp-game-price-data-row:last-child {
        border-bottom: 0;
        padding-bottom: 0;
    }

    .page-game-price table.bbp-game-price-table .bbp-game-price-row-label,
    .page-game-price table.bbp-game-price-table .bbp-game-price-data-cell {
        border: 0;
        padding: 0;
        background: transparent;
    }

    .page-game-price table.bbp-game-price-table .bbp-game-price-row-label {
        margin-bottom: 10px;
        color: var(--color-green-1);
        font-size: 1.2rem;
        font-weight: 700;
        line-height: 1.3;
    }

    .page-game-price table.bbp-game-price-table .bbp-game-price-data-cell {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        gap: 12px;
        font-size: 0.95rem;
        line-height: 1.6;
    }

    .page-game-price table.bbp-game-price-table .bbp-game-price-data-cell::before {
        content: attr(data-label);
        flex: 0 0 auto;
        color: var(--color-black-1);
        font-size: 0.85rem;
        font-weight: 500;
        padding-right: 12px;
    }

    /*/店舗情報/*/
    .page-info {
        width: var(--width-sp);
    }

    .info1 {
        width: 100%;
        height: auto;
        aspect-ratio: 4/3;
    }

    .info2 {
        flex-direction: column;
    }

    .info2>div {
        width: 100%;
    }

    .info2>div:first-of-type>img {
        border-radius: 20px 20px 0 0;
    }

    .info2>div:last-of-type {
        border-radius: 0 0 20px 20px;
    }

    /*/フード/*/
    .page-food-wrap {
        width: var(--width-sp);
    }

    .tab_content_description {
        width: 100%;
        flex-direction: column;
        padding: 15px;
    }

    .tab_content_description>div {
        width: 100%;
    }

    .tab_content_description>div.tab-txt>h3,
    .tab_content_description>div.tab-txt>h4 {
        margin-top: 1em;
        font-size: 1.5em;
    }

    .tab_content_description>div.tab-txt>p {
        font-size: 0.9em;
    }

    /*/お問い合わせ/*/
    .page-contact {
        width: var(--width-sp);
    }

    .page-contact>a {
        width: 100%;
        max-width: 400px;
        font-size: 1.3em;
    }

    /*/初心者/*/
    .page-beginner {
        width: var(--width-sp);
    }


    /*/////////////////////////ページネーション///////////////////////*/
    .pagination {
        width: 90%;
    }

}