/*
Theme Name: crmt-block-base
Author: CHROMATRIBE - s.ohara
Description: PHPを主軸に置いた、crmt-block-baseブロックテーマ。
Version: 1.9.2
License: GNU General Public License v2 or later
Text Domain: crmt-block-base
*/

html,
body {
    scroll-behavior: smooth;

    font-size: 14px;
    font-family: "Yu Gothic", YuGothic, "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    box-sizing: border-box;
    min-height: 100lvh;

    * {
        box-sizing: border-box;
    }
}

.--disp-less1200 {
    @media (width > 1200px) {
        display: none;
    }
}
.--disp-pc {
    @media (width <= 768px) {
        display: none;
    }
}
.--disp-sp {
    @media (width > 768px) {
        display: none;
    }
}
.--disp-sp-sm {
    @media (width > 540px) {
        display: none;
    }
}
figure {
    margin: 0;
}
img {
    width: 100%;
}

/* ===================================================
       セクションレイアウト
    =================================================== */

.section-1200 {
    display: grid;
    /* 3列のGridを作成します
      1列目(左余白): 最小16px〜最大40pxで可変しつつ、1200pxを超えたら `1fr` で広がる
      2列目(中央)  : 最大1200px（画面が狭い時は自動で縮む）
      3列目(右余白): 1列目と同じ
    */
    grid-template-columns: [full-start] minmax(clamp(16px, 5.556vw - 26.667px, 40px), 1fr) [content-start] minmax(0, 1200px) [content-end] minmax(clamp(16px, 5.556vw - 26.667px, 40px), 1fr) [full-end];
    padding: clamp(4.571rem, 3.2vw + 3.429rem, 5.714rem) 0;

    & > * {
        /* セクション内の要素は、デフォルトで中央の1200pxエリアに配置する */
        grid-column: content-start / content-end;
    }
}
.section-990 {
    display: grid;
    /* 3列のGridを作成します
      1列目(左余白): 最小16px〜最大40pxで可変しつつ、1200pxを超えたら `1fr` で広がる
      2列目(中央)  : 最大1200px（画面が狭い時は自動で縮む）
      3列目(右余白): 1列目と同じ
    */
    grid-template-columns: [full-start] minmax(clamp(16px, 5.556vw - 26.667px, 40px), 1fr) [content-start] minmax(0, 990px) [content-end] minmax(clamp(16px, 5.556vw - 26.667px, 40px), 1fr) [full-end];
    padding: clamp(4.571rem, 3.2vw + 3.429rem, 5.714rem) 0;

    & > * {
        /* セクション内の要素は、デフォルトで中央の1200pxエリアに配置する */
        grid-column: content-start / content-end;
    }
}

/* ===================================================
    solution.kitamura 専用ラッパー
    =================================================== */
#khd-b2b {
    margin: 0;
    position: relative;

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        color: var(--wp--preset--color--text-titleimportant);
    }
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    strong {
        font-weight: 600;
    }
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    p {
        margin: 0;
    }
    p+p{margin-top: 1.2rem}

    /* ===================================================
    フォント
    =================================================== */

    .h1a {
        font-size: clamp(1.857rem, 2.8vw + 0.857rem, 2.857rem);
        line-height: 160%;
    }

    .h2a {
        font-size: clamp(1.714rem, 1.6vw + 1.143rem, 2.286rem);
        line-height: 160%;
        color: var(--wp--preset--color--text-titleimportant);
        margin: 0;

        strong {
            color: var(--wp--preset--color--main);
        }

        .--l-s {
            font-size: clamp(1.286rem, 4.023vw + 0.079rem, 2.286rem);
            line-height: 100%;
        }
    }
    .h2b {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        font-size: clamp(1.714rem, 3.2vw + 0.571rem, 2.857rem);
        color: var(--wp--preset--color--text-titleimportant);

        span {
            font-family: "Lato", sans-serif;
            font-weight: 400;
            font-style: normal;
            font-size: clamp(1rem, 0.4vw + 0.857rem, 1.143rem);
            color: var(--wp--preset--color--main);
        }
    }
    .txt-l {
        font-size: clamp(1rem, 0.4vw + 0.857rem, 1.143rem);
        line-height: 200%;
    }
    .txt-xl {
        font-size: clamp(1.143rem, 0.4vw + 1rem, 1.286rem);
        line-height: 200%;
    }
    .txt-m-s {
        font-size: clamp(0.857rem, 0.4vw + 0.714rem, 1rem);
        line-height: 200%;
    }
}