/* =====================================================================
適用ページ：全ページ
適用箇所：レイアウト（セクションブロック・コンテナーブロック）
目的    ：SPでの左右余白を狭くする（WP管理画面でのデフォルト1.8remの上書き）
===================================================================== */

@media screen and (max-width: 768px) {
    /* セクションブロックのpaddingを修正。WP管理画面でno-paddingにしたものは除く */
    .smb-section__inner > .c-container:not(.c-container--no-padding) {
        padding-inline: 0.95rem !important;
    }
    /* コンテナーブロックも左右paddingを無くす */
    .wp-block-snow-monkey-blocks-container {
        padding-inline: 0 !important;
    }
}


/* =====================================================================
適用ページ：全ページ
適用箇所：コンテンツエリア上部のページタイトル
目的    ：ページタイトルを非表示
===================================================================== */
.type-page .c-entry__header {
    display: none;
}


/* =====================================================================
適用ページ：全ページ
適用箇所：WP管理画面から指定された文字サイズを上書きする
目的    ：デフォルトは、レスポンシブによる変化率が小さすぎる為、SP時により小さくする
　　参考）2XL（1.6 → 1.5rem：25.6px → 24px）変更後は25.6px → 19.2px
===================================================================== */

/* L */
.has-sm-l-font-size {
    font-size: clamp(1rem, 0.95rem + 0.3vw, 1.14rem);
}

/* XL */
.has-sm-xl-font-size {
    font-size: clamp(1.1rem, 1rem + 0.5vw, 1.33rem);
}

/* 2XL */
.has-sm-2-xl-font-size {
    font-size: clamp(1.2rem, 1rem + 0.7vw, 1.6rem);
}

/* 3XL */
.has-sm-3-xl-font-size {
    font-size: clamp(1.4rem, 1.1rem + 1vw, 2rem);
}

/* 4XL */
.has-sm-4-xl-font-size {
    font-size: clamp(1.8rem, 1.2rem + 2vw, 2.66rem);
}

/* 5XL */
.has-sm-5-xl-font-size {
    font-size: clamp(2.4rem, 1.4rem + 3vw, 4rem);
}

/* 6XL */
.has-sm-6-xl-font-size {
    font-size: clamp(3rem, 1rem + 7vw, 8rem);
}


/* =====================================================================
適用ページ：全ページ
適用箇所：vw単位のfont-sizeの最小・最大指定 ※WP管理画面の指定は打ち消されるので注意
目的    ：
===================================================================== */

.xcs-fzclamp-2 {
    font-size: clamp(1.4rem, 2vw, 2.4rem) !important;
}

.xcs-fzclamp-3 {
    font-size: clamp(1.6rem, 3vw, 3.6rem) !important;
}
.xcs-fzclamp-4 {
    font-size: clamp(1.8rem, 4vw, 4.8rem) !important;
}
.xcs-fzclamp-5 {
    font-size: clamp(2rem, 5vw, 6rem) !important;
}
.xcs-fzclamp-6 {
    font-size: clamp(2.2rem, 6vw, 7.2rem) !important;
}
.xcs-fzclamp-7 {
    font-size: clamp(2.4rem, 7vw, 8.4rem) !important;
}
.xcs-fzclamp-8 {
    font-size: clamp(2.6rem, 8vw, 9.7rem) !important;
}
.xcs-fzclamp-9 {
    font-size: clamp(2.8rem, 9vw, 10.8rem) !important;
}
.xcs-fzclamp-10 {
    font-size: clamp(3rem, 10vw, 12rem) !important;
}


/* =====================================================================
適用ページ：全ページ
適用箇所：「横並び」ブロックで並べた要素
目的    ：メディアクエリで横並び→縦並びに切り替える
===================================================================== */
@media screen and (max-width: 1400px) {
    .xcs-fd-row-1400 {
        flex-direction: column !important;
    }
}

@media screen and (max-width: 1280px) {
    .xcs-fd-row-1280 {
        flex-direction: column !important;
    }
}

@media screen and (max-width: 1024px) {
    .xcs-fd-row-1024 {
        flex-direction: column !important;
    }
}

@media screen and (max-width: 768px) {
    .xcs-fd-row-768 {
        flex-direction: column !important;
    }
}

@media screen and (max-width: 600px) {
    .xcs-fd-row-600 {
        flex-direction: column !important;
    }
}


/* =====================================================================
適用ページ：全ページ
適用箇所：「横並び」ブロックで並べた要素
目的    ：メディアクエリで横並び→縦並びに切り替える
===================================================================== */

.xcs-width-30p {
    flex: 0 0 50% !important;
}

.xcs-width-40p {
    flex: 0 0 50% !important;
}
.xcs-width-50p {
    flex: 0 0 50% !important;
}
.xcs-width-60p {
    flex: 0 0 50% !important;
}

.xcs-maxwidth-300 {
    max-width: 300px !important;
}


/* =====================================================================
適用ページ：全ページ
適用箇所：
目的    ：その他ユーティリティ
===================================================================== */
.xcs-align-start {
    align-items: start !important;
}


/* 改行されるときに行間を狭めるためのクラス */
.xcs-line-height-14 {
    line-height: 1.4 !important;
}