/**
 * Gymfinity FSE テーマ専用スタイル
 *
 * このファイルはgymfinity-fseテーマ専用のカスタマイズです。
 * プラグインとは独立して管理し、テーマ変更時は不要になります。
 *
 * 使用方法:
 * - テーマのfunctions.phpでエンキューする
 * - または子テーマで管理する
 */

.wp-site-blocks{
    display: flex;
    flex-direction: column;
    min-height: 100dvh;
    padding-top:.1px;
}
.wp-site-blocks > main{
    flex: 1;
    display: flex;
    flex-direction: column;
}
.wp-site-blocks > main > .wp-block-group{
    flex: 1;
    display: flex;
    flex-direction: column;
}
.wp-site-blocks > main > .wp-block-group > .wp-block-group{
    flex: 1;
    display: flex;
    flex-direction: column;
}
.wp-site-blocks > main .wp-block-columns{
    flex: 1;
    width: 100%;
}   

/* =========================================
   ベーススタイル・共通設定
   ========================================= */
.wp-theme-gymfinity-fse *{
    box-sizing: border-box;
}

.wp-theme-gymfinity-fse.home main{
    padding: 0 !important;
}

.wp-theme-gymfinity-fse main img{
    max-width: 100%;
    height: auto;
}

.wp-theme-gymfinity-fse main section{
    padding-top: 3rem;
    padding-bottom: 3rem;
}

/* =========================================
   ヘッダーエリア
   ========================================= */
.wp-theme-gymfinity-fse header.wp-block-template-part{
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.36);
    z-index: 1000;
    position: sticky;
    width: 100%;
    top: 0;
}
.wp-theme-gymfinity-fse header.wp-block-template-part .header_container--inner{
    padding: 0 !important;
    max-width: 1440px;
}
.wp-theme-gymfinity-fse header.wp-block-template-part .logo{
    padding: 0 !important;
    border: 0;
    max-width: 300px;
}
.wp-theme-gymfinity-fse header.wp-block-template-part .header_right_menu{
    background: transparent;
    border-left: 2px solid var(--primary-color);
    padding: 0 !important;
}
.wp-theme-gymfinity-fse .site-main-header{
    background: var(--white);
}
.wp-theme-gymfinity-fse .site-main-header .has-foreground-color{
    color: var(--black) !important;
}

/* =========================================
   メインコンテンツ・レイアウト
   ========================================= */
.wp-theme-gymfinity-fse .head_wrapper--inner {
    max-width: 1440px !important;
}
.wp-theme-gymfinity-fse main.wp-block-group{
    padding: 0 !important;
}
.wp-theme-gymfinity-fse main.wp-block-group > .wp-block-group .wp-block-column.fse-page-layout{
    padding-top: 80px !important;
}
.wp-theme-gymfinity-fse main.wp-block-group .entry-content{
    padding: 0 0 10rem;
}
.home.wp-theme-gymfinity-fse main.wp-block-group > .wp-block-group .wp-block-column.fse-page-layout{
    padding-top: 0 !important;
}
.wp-theme-gymfinity-fse main h1:first-child{
    width: fit-content;
    margin-inline: auto;
    margin-block-start: 4rem !important;
}
/* KV (メイン画像) */
.wp-theme-gymfinity-fse .keyvisual {
    margin-left: -30px;
    margin-right: -30px;
}

/* =========================================
   ナビゲーション
   ========================================= */
.wp-theme-gymfinity-fse .wp-block-navigation .wp-block-navigation-item__label{
    padding: .5rem;
}
.wp-theme-gymfinity-fse .wp-block-navigation .has-child .wp-block-navigation__submenu-container{
    background-color: rgba(255, 255, 255, 1) !important;
    border: solid #000;
    border-width: 0 0 1px 1px !important;
}

/* =========================================
   メディアクエリ（レスポンシブ設定）
   ========================================= */

/* タブレット・スマホ共通 (768px以下) */
@media screen and (max-width: 767px) {
    .wp-theme-gymfinity-fse .site-main-header button.wp-block-navigation__responsive-container-open {
        position: absolute;
        top: 0.5rem;
        right: 0.5rem;
    }
    .wp-theme-gymfinity-fse .site-main-header button.wp-block-navigation__responsive-container-open svg path{
        fill: var(--black);
    }
    .wp-theme-gymfinity-fse .site-main-header button.wp-block-navigation__responsive-container-close{
        top: calc(.5rem - 25px);
        right: calc(.5rem - 25px);
    }
    .wp-theme-gymfinity-fse .site-main-header button.wp-block-navigation__responsive-container-close svg path{
        fill: var(--black);
    }
    .wp-theme-gymfinity-fse .site-main-header .wp-block-navigation__responsive-container.is-menu-open.has-modal-open{
        background-color: var(--white) !important;
    }
    .wp-theme-gymfinity-fse header.wp-block-template-part .logo{
        max-width: 250px;
    }
}

/* スマホ専用 (599px以下) */
@media screen and (max-width: 599px) {
    .wp-theme-gymfinity-fse .wp-block-navigation .wp-block-navigation__responsive-container-content ul.wp-block-navigation__container li.wp-block-navigation-item a{
        border-top: 1px solid;
    }
    .wp-theme-gymfinity-fse .wp-block-navigation .wp-block-navigation__responsive-container-content ul.wp-block-navigation__container li.wp-block-navigation-item:nth-child(1) a{
        border-top: 0;
    }
    .wp-theme-gymfinity-fse .wp-block-navigation .wp-block-navigation__responsive-container-content ul.wp-block-navigation__container li.wp-block-navigation-item .wp-block-navigation__submenu-icon svg {
        stroke: var(--black);
    }
    .wp-theme-gymfinity-fse .wp-block-navigation .wp-block-navigation__responsive-container-content ul.wp-block-navigation__container li.wp-block-navigation-item .wp-block-navigation__submenu-icon {
        border-radius: 100px;
        border: 1px solid;
        padding: 5px;
        top: .25em;
    }
    .wp-theme-gymfinity-fse .wp-block-navigation .wp-block-navigation__responsive-container-content ul.wp-block-navigation__container li.wp-block-navigation-item .wp-block-navigation-submenu__toggle[aria-expanded=true] + ul.wp-block-navigation__submenu-container{
        padding-top: 0!important;
    }
    .wp-theme-gymfinity-fse .wp-block-navigation .wp-block-navigation__responsive-container-content ul.wp-block-navigation__container li.wp-block-navigation-item .wp-block-navigation-submenu__toggle[aria-expanded=true] + ul.wp-block-navigation__submenu-container li{
        padding-left: 1rem;
    }
}


@media screen and (min-width: 1024px) {
    .fcm-store-card {
        flex: 1 1 calc(50% - 1rem);
        max-width: calc(50% - 1rem);
    }
}

.member_page-template-default .wp-block-group{
    padding: 2rem 1rem 4rem;
}
.fcm-store-list-block {
    width: 100%;
    max-width: var(--wp--style--global--content-size);
    margin-left: auto !important;
    margin-right: auto !important;
}


/* .fcm-block-article{

    max-width: var(--wp--style--global--content-size);
    margin-left: auto !important;
    margin-right: auto !important;
    padding-top: 2rem;
} */

.wp-block-fcm-campaign-banner{
    margin: 2rem auto;
    max-width: 758px;
    width: 100%;
}
.wp-block-fcm-campaign-banner  img{
    vertical-align: bottom;
    object-fit: contain;
}
.fcm-member-page-list{
    justify-content: left;

}
.fcm-member-page-list li {
    flex: 1 1 calc(50% - 1rem);
    max-width: calc(50% - 0.75rem);
}
@media screen and (min-width: 768px) {
    .fcm-member-page-list li {
        flex: 1 1 calc(33.333% - 1rem);
        max-width: calc(33.333% - 1rem);
    }
}
@media screen and (min-width: 1024px) {
    .fcm-member-page-list li {
        flex: 1 1 calc(25% - 1rem);
        max-width: calc(25% - 1rem);
    }
}