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

leave-it-custom.css

********************************************************************************/
/*============================================================
 サイト共通　変数
*============================================================*/
:root {
    /* --common-font-family-main: 'Noto Serif JP', serif;
    --common-font-family-sub: 'Noto Sans JP', sans-serif; */

    --common-font-family-main: 'Noto Sans JP', sans-serif;
    --common-font-family-sub: 'Noto Serif JP', serif;

    --common-color-site-bg: #fff;           /* サイト背景色 */
    --common-color-text: #151515;           /* 基本テキスト色 */
    --common-color-main: #FF810E;           /* メイン色 */
    --common-color-sub: #fff;            /* サブ色 */
    --common-color-accent: #151515;      /* アクセント色(強調色) */
    --common-color-attention: #D93838;   /* 注意色 */
    --common-color-attention-bg: #FFF5F5;   /* 注意色(背景用) */
    --common-color-link: #2784D6;        /* テキストリンク色 */
    --common-color-notice: #B3B3B3;      /* 注釈色 */

    --common-color-header-bg: #fff;  /* ヘッダー背景色 */
    
    --common-color-breadcrumb: #B3B3B3;  /* パンくず色 */
    --common-color-lower-mv-bg: #FFFFFF;  /* 下層メインビジュアル背景色 */

    --common-color-footer-bg: #000000;  /* フッター背景色 */
    --common-color-footer-text: #ffffff;  /* フッターテキスト色 */

}

/* フォーム色
---------------------------------------- */
.page-form {
    --form-background-color: #FAFAFA;
    --form-border-color: #F0F0F0;
    --form-placeholder-color: #B3B3B3;
    --form-check-border-color: #B3B3B3;
    --form-checked-color: var(--common-color-main);
}

/*============================================================
 サイト共通　角丸無効
*============================================================*/
/* * {
    border-radius: unset !important;
} */

/*============================================================
 サイト共通　見出し
*============================================================*/
h1.page-title {
    font-weight: bold;
    font-size: 48px;
    line-height: 140%;
}
.page-title-en {
    font-size: 20px;
    line-height: 140%;
    color: #B3B3B3;
    margin-top: 8px;
}
h2.sec-title,
.block-post-content h2 {
    font-weight: bold;
    font-size: 32px;
    line-height: 150%;
}
h2.sec-title {
    text-align: center;
}
h3.block-title,
.block-post-content h3 {
    font-size: 24px;
    font-weight: bold;
    line-height: 180%;
}


/*============================================================
 サイト共通　ヘッダー調整
*============================================================*/
/* 追従ヘッダー
---
------------------------------------- */
/* #fixed-header .gnav {
    background-color: #ffffffcc;
} */

/*============================================================
 サイト共通　フッター調整
*============================================================*/
/* #site-footer {
    background-color: var(--common-color-main);
    color: #D3D3D3;
} */
/* フッターロゴ
---------------------------------------- */
#site-footer #fnav .logo {
    margin-bottom: 16px;
}
/* メニューリスト
---------------------------------------- */
#site-footer #fnav .menu-list {
    width: 224px;
}
#site-footer #fnav .menu-list li {
    width: 104px;
}
/* 住所 */
#site-footer #footer-address {
    margin-bottom: 40px;
    text-align: center;
}
/*============================================================
 サイト共通　パーツ調整
*============================================================*/
/* CTAセクション
---------------------------------------- */
.lvit-sec-cta[data-name="contact"] {
    background-image: url(../images/common/cta-bg.jpg);
    color: #fff;
}
/* リスト
---------------------------------------- */
.lvit-card-list[data-type="illust"] .image img {
    max-width: 256px;
}

/*吸着バナー調整
---------------------------------------- */
#fixed-banner {
    display: block;
    position: fixed;
    bottom: 24px;
    right: 24px;
    max-width: 240px;
    width: 100%;
    height: auto;
}
#fixed-banner .banner-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
}
#fixed-banner a.banner-link {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    transition: opacity .3s;
}
#fixed-banner a.banner-link:hover {
    opacity: 0.8;
}
#fixed-banner a.banner-link .banner-image {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
#fixed-banner button.close-banner {
    position: absolute;
    top: -12px;
    right: -12px;
    width: 24px;
    height: 24px;
    font-size: 16px;
    font-weight: bold;
    background: #fff;
    border-radius: 31px;
    padding: 0;
    cursor: pointer;
    color: var(--common-color-main);
}

/*============================================================
 サイト共通　記事詳細　本文ブロック調整
*============================================================*/
/* ボタン
---------------------------------------- */
.block-post-content .wp-block-button {
    /* width: fit-content;
    min-width: 224px;
    background-color: var(--common-color-main);
    border: solid 1px var(--common-color-main);
    border-radius: 4px;
    overflow: hidden;
    -webkit-transition: all .3s ease-out;
    transition: all .3s ease-out;
    color: #fff; */
}
.block-post-content .wp-block-button a {
    /* display: inline-block;
    width: 100%;
    height: 100%;
    padding: 7px;
    font-weight: bold;
    font-size: 18px;
    line-height: 32px;
    color: #fff;
    text-align: center;
    background-color: transparent;
    text-decoration: none; */
}

/*============================================================
 トップページ調整
*============================================================*/
/* フッター前余白
---------------------------------------- */
/* #page-top #main-contents {
    padding-bottom: 0;
} */
/* セクション間余白がない部分がある場合
---------------------------------------- */
#page-top #main-contents {
    gap: 0;
}
#page-top #main-contents .section:not(:last-child):not(.no-margin) {
    margin-bottom: 80px;
}

/* 動的セクションで記事がない場合はセクション非表示
---------------------------------------- */
#page-top .section.post-data-none {
    display: none;
}

/* メインビジュアル
---------------------------------------- */
#page-top #mainvisual{
    height:768px;
    background-color: #000;
    background-image: url(../images/top/mainvisual-bg.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    color: #fff;
    position: relative;
}
#page-top #mainvisual .info {
    width: 100%;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
}
#page-top #mainvisual .info .inner {
    display: block;
}
#page-top #mainvisual .info .site-title {
    margin-bottom: 58px;
}
#page-top #mainvisual .info .catch {
    font-size: 44px;
    font-weight: 700;
    line-height: 140%; 
    margin-bottom: 32px;
}
#page-top #mainvisual .info .lead {
    font-weight: 500;
    font-size: 18px;
    line-height: 180%;
    margin-bottom: 32px;
}
#page-top #mainvisual .info .label {
    background-color: var(--common-color-main);
    padding: 6px 12px;
    font-weight: 700;
    font-size: 18px;
    line-height: 180%;
    width: fit-content;
    height: fit-content;
}
#page-top #mainvisual .info .flex-wrap {
    display: flex;
    align-items: flex-start;
    gap: 150px;
}
#page-top #mainvisual .info .item {
    display: flex;
    align-items: center;
    gap: 10px;
}
#page-top #mainvisual .info .item p {
    font-size: 12px;
    font-weight: 500;
    line-height: 130%; 
}

/* セクション　施設について
---------------------------------------- */
#page-top #sec-about .sec-lead {
    text-align: center;
}

/* セクション　料金プラン
---------------------------------------- */
#page-top #sec-plan .sec-lead {
    text-align: center;
}

/* セクション　お知らせ
---------------------------------------- */
#page-top #sec-news.post-data-none {
    display: none;
}

/* セクション　イベント
---------------------------------------- */
#page-top #sec-events {
}


/*セクション　〇〇〇
---------------------------------------- */
#page-top #sec-●●● {
}


/*============================================================
 下層共通　メインビジュアル調整
*============================================================*/
.page-lower #mainvisual h1.page-title {
    color: var(--common-color-main);
}

/*============================================================
 室内ゴルフ練習場 ページ調整
*============================================================*/
/* セクション　共通
---------------------------------------- */
#page-features h3.block-title {
    text-align: center;
}

/* セクション　トラックマンで測定できるデータ
---------------------------------------- */
#page-features #sec-measurement-data .sec-lead {
    text-align: center;
}

/*============================================================
 フィットネス ページ調整
*============================================================*/
#page-fitness #sec-fitness-area .lvit-card-list {
    --col: 2;
}
#page-fitness #sec-ecost .lvit-card-list {
    --col: 2;
}
#page-fitness #sec-ecost .lvit-card-list .item .image {
    border-radius: 0;
    width: 100%;
    height: auto;
    object-fit: cover;
    aspect-ratio: 16 / 9;
}
#page-fitness #sec-ecost .lvit-card-list .item .image iframe {
    width: 100%;
    height: 100%;
    object-fit: cover;
    aspect-ratio: 16 / 9;
}

/* セクション　ご利用の流れ
---------------------------------------- */
#page-fitness #sec-use-flow h3.block-title {
    text-align: center;
}

/* セクション　よくあるご質問
---------------------------------------- */
#page-fitness #sec-faq h3.block-title {
    text-align: center;
}

/*============================================================
 レッスン ページ調整
*============================================================*/
#page-lesson #sec-lesson-menu .block h3.block-title {
    text-align: center;
}
/* セクション　指導者のご紹介
---------------------------------------- */
#page-lesson #sec-instructor .lvit-card-list {
    --col: 2;
}
/* セクション　ご利用の流れ
---------------------------------------- */
#page-lesson #sec-use-flow h3.block-title {
    text-align: center;
}
/* セクション　料金プラン
---------------------------------------- */

#page-lesson #sec-price .lvit-tbl th {
    max-width: 130px;
}

/*============================================================
 料金プランページ調整
*============================================================*/
/* セクション　料金メニュー
---------------------------------------- */
/* スクロール許容 */
#page-plan #sec-plan-menu .block-wscroll-tablet {
    width: 100%;
    overflow-x: auto;
}
#page-plan #sec-plan-menu .block-wscroll-inner {
    /* width: 960px; innerサイズを960pxに固定 */
}
#page-plan #sec-plan-menu .block-wscroll-inner table {
    width: 100%;
    border-collapse: collapse;
}
#page-plan #sec-plan-menu .lvit-tbl th,
#page-plan #sec-plan-menu .lvit-tbl td {
    width: 100px; /* すべてのthに固定幅を設定 */
    min-width: 100px; /* 最小幅も設定 */
    max-width: 100px;
}
#page-plan #sec-plan-menu .lvit-tbl th.plan {
    background-color: var(--common-color-main);
    color: #ffffff;
    text-align: center;
    width: 120px; /* すべてのthに固定幅を設定 */
    min-width: 120px; /* 最小幅も設定 */

}
#page-plan #sec-plan-menu .lvit-tbl td {
    text-align: center;
}
#page-plan #sec-plan-menu .sec-lead {
    text-align: center;
}
/* スクロールヒント */
#page-plan #sec-plan-menu .scroll-notice {
    margin-bottom: 10px;
    color: #666;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
/* スクロールヒントアイコン */
#page-plan #sec-plan-menu .scroll-icon {
    margin-right: 5px;
    animation: scrollHint 1.5s infinite;
    display: inline-block;
}
/* スクロールヒントアニメーション */
@keyframes scrollHint {
    0% { transform: translateX(-3px); }
    50% { transform: translateX(3px); }
    100% { transform: translateX(-3px); }
}
/* リスト 注意点 */
#page-plan #sec-plan-menu ul > ul.lvit-ul-list li {
    list-style-type: circle;
}
/* セクション　入会の流れ
---------------------------------------- */
/* カラーボックス */
#page-plan #sec-flow .lvit-color-box.info {
    background-color: var(--common-color-main);
    color: #FFFFFF;
    text-align: center;
}
#page-plan #sec-flow .lvit-color-box.info p {
    font-weight: 700;
}
#page-plan #sec-flow .lvit-color-box.info p.catch {
    font-size: 32px;
    margin-bottom: 32px;
    line-height: 160%; 
}
/* リンク */
#page-plan #sec-flow .lvit-num-list .item .info p a.contact-link {
    text-decoration: underline;
}

/*============================================================
 利用規約ページ調整
*============================================================*/
/* セクション　利用規約
---------------------------------------- */
#page-terms #sec-terms p.link {
    word-break: break-all;
}



/*============================================================
 □□□ページ調整
*============================================================*/
/* フッター前余白
---------------------------------------- */
/* #page-■■■ #main-contents {
    padding-bottom: 0;
} */

/* ページ内共通設定　
---------------------------------------- */
#page-■■■ {

}

/* メインビジュアル　
---------------------------------------- */
#page-■■■ #mainvisual {
    
}

/* セクション　〇〇〇　
---------------------------------------- */
#page-■■■ #sec-●●● {
    
}


/********************************************************************************

for 追従ヘッダー　(Tabletとブレイクポイントが異なる場合)

********************************************************************************/
@media screen and (max-width: 1176px) {
    /*============================================================
     サイト共通　ヘッダー調整
    *============================================================*/
    .gnav .gnav-main .gnav-left .gnav-logo {
        width: 200px;
    }
}


/********************************************************************************

for Tablet

********************************************************************************/
@media screen and (max-width: 959px) {
    /*============================================================
     サイト共通　見出し
    *============================================================*/
    h1.page-title {
        font-size: 32px;
        line-height: 140%;
    }
    .page-title-en {
        font-size: 16px;
        line-height: 140%;
    }
    h2.sec-title,
    .block-post-content h2 {
        font-size: 24px;
        line-height: 150%;
    }
    h3.block-title,
    .block-post-content h3 {
        font-size: 20px;
        line-height: 180%;
    }

    /*============================================================
     サイト共通　ヘッダー調整
    *============================================================*/
    .gnav .gnav-main .gnav-left .gnav-logo {
        /* width: 104px; */
    }

    /*============================================================
     サイト共通　フッター調整
    *============================================================*/
    #site-footer #fnav .logo {
        width: 200px;
        height: auto;
    }

    /*============================================================
     サイト共通　パーツ調整
    *============================================================*/
    
    /*============================================================
     トップページ 調整
    *============================================================*/
    /* メインビジュアル
    ---------------------------------------- */
    #page-top #mainvisual{
        background-image: url(../images/top/mainvisual-bg-sp.png);
        background-position: top right;
        background-size: cover;
    }
    #page-top #mainvisual .info .site-title {
        width: 300px;
        margin-bottom: 32px;
    }
    #page-top #mainvisual .info .catch {
        font-size: 38px;
        margin-bottom: 32px;
    }
    #page-top #mainvisual .info .lead {
        margin-bottom: 32px;
    }
    #page-top #mainvisual .info .flex-wrap {
        flex-direction: column;
        gap: 32px;
    }

   
    /*============================================================
    レッスンページ調整
    *============================================================*/
    /* セクション　料金
    ---------------------------------------- */
    #page-lesson #sec-price .block-wscroll-tablet {
        width: 100%;
    }
    #page-lesson #sec-price .block-wscroll-tablet .block-wscroll-inner {
        width: 100%;
        padding: 0;
    }
    #page-lesson #sec-price .lvit-tbl table {
        width: 100%;
    }

    /*============================================================
    料金プランページ調整
    *============================================================*/
    /* セクション　料金メニュー
    ---------------------------------------- */
    #page-plan #sec-flow .lvit-color-box.info p.catch {
        font-size: 24px;
    }


    /*============================================================
     サンプルページ 調整
    *============================================================*/
    /* セクション
    ---------------------------------------- */
    
}



/********************************************************************************

for SP

********************************************************************************/
@media screen and (max-width: 767px) {
    /*============================================================
     サイト共通　見出し
    *============================================================*/

    /*============================================================
     サイト共通　ヘッダー調整
    *============================================================*/
    .gnav .gnav-main .gnav-left .gnav-logo {
        width: 104px;
    }

    /*============================================================
     サイト共通　フッター調整
    *============================================================*/
    #site-footer #fnav .logo {
        width: 140px;
        height: auto;
    }
    /* 住所 */
    #site-footer #footer-address {
        margin-bottom: 0;
        text-align: left;
    }


    /*============================================================
     サイト共通　パーツ調整
    *============================================================*/
    /* 画像+テキスト　タイトル */
    .lvit-flex .info .title {
        font-size: 18px;
    }

    /*吸着バナー調整
    ---------------------------------------- */
    #fixed-banner {
        bottom: 0;
        right: 0;
        max-width: 100%;
    }
    #fixed-banner a.banner-link .banner-image img {
        width: 100%;
        height: auto;
    }
    #fixed-banner button.close-banner {
        top: 3px;
        right: 3px;
        width: 18px;
        height: 18px;
        font-size: 12px;
    }
    /*============================================================
     トップページ 調整
    *============================================================*/
    /* メインビジュアル
    ---------------------------------------- */
    #page-top #mainvisual{
        /* background-image: url(../images/top/mainvisual-bg-sp.jpg); */
        background-position: bottom center;
        background-size: contain;
    }
    #page-top #mainvisual .info {
        text-align: center;
    }
    #page-top #mainvisual .info .site-title {
        width: 250px;
        margin: 0 auto 24px;
    }
    #page-top #mainvisual .info .catch {
        font-size: 28px;
        margin-bottom: 24px;
    }
    #page-top #mainvisual .info .lead {
        font-size: 16px;
    }
    #page-top #mainvisual .info .flex-wrap {
        gap: 24px;
        align-items: center;
    }
    #page-top #mainvisual .info .label {
        font-size: 16px;
    }

    /*============================================================
    室内ゴルフ練習場ページ調整
    *============================================================*/
    /* セクション　トラックマンで測定できるデータ
    ---------------------------------------- */
    #page-features #sec-measurement-data .sec-lead {
        text-align: left;
    }
    /* セクション　トラックマンで測定できるデータ
    ---------------------------------------- */
    #page-features #sec-practice-example .lvit-card-list .item .info .title {
        text-align: center;
    }

    /*============================================================
     フィットネスページ調整
    *============================================================*/
    /* セクション　共通
    ---------------------------------------- */
    #page-fitness .lvit-card-list .item .info h3.title,
    #page-fitness .block h3.block-title {
        text-align: center;
    }

    /*============================================================
     レッスンページ調整
    /*============================================================
    /* セクション　共通
    ---------------------------------------- */
    #page-lesson .lvit-card-list .item .info .title,
    #page-lesson .block h3.block-title {
        text-align: center;
    }

    /* セクション　料金プラン
    ---------------------------------------- */
    #page-lesson #sec-price .lvit-tbl th {
        max-width: 185px;
    }


    /*============================================================
    ブログ記事ページ調整
    *============================================================*/
    /* ページ内共通設定　
    ---------------------------------------- */
    /* スクロールテーブル */
    #page-blogs.single-blogs #sec-post figure#scroll-table {
        overflow-x: auto;
        display: block;
        width: 100%;
    }
    #page-blogs.single-blogs #sec-post figure#scroll-table table {
        min-width: 700px;
    }
    /* スクロールできます */
    #page-blogs.single-blogs #sec-post .scroll-notice {
        /* text-align: right; */
        justify-content: right;
        font-size: 14px;
    }
    
    /*============================================================
     サンプルページ 調整
    *============================================================*/
    /* セクション
    ---------------------------------------- */

}