/*
 * =========================================================
 * Burasut Lab Business
 * Business UI v0.2.0
 * =========================================================
 */


/* =========================================================
   カラーパレット
   ========================================================= */

.burasut-business {
    --blb-bg: #0f1318;
    --blb-bg-deep: #0a0d11;
    --blb-bg-soft: #151a20;

    --blb-surface: #191f26;
    --blb-surface-hover: #1e252d;

    --blb-text: #e5e9ee;
    --blb-text-soft: #b3bbc5;
    --blb-muted: #7f8995;

    --blb-border: #2a323c;
    --blb-border-strong: #37414d;

    --blb-accent: #5d8ff0;
    --blb-accent-hover: #7ba5f5;

    --blb-title: #f5f7fa;

    --blb-radius: 8px;
    --blb-radius-small: 5px;

    --blb-shadow:
        0 1px 2px rgba(0, 0, 0, .25),
        0 12px 30px rgba(0, 0, 0, .18);

    background:
        radial-gradient(
            circle at top,
            #171d25 0,
            var(--blb-bg) 520px
        ) !important;

    color: var(--blb-text);
}


/* =========================================================
   ページ全体
   ========================================================= */

.burasut-business #container,
.burasut-business #content,
.burasut-business .content,
.burasut-business .content-in {
    background: transparent !important;
}


/* =========================================================
   Cocoonヘッダー
   ゲーム感を抑えてBusiness寄りに
   ========================================================= */

.burasut-business .header,
.burasut-business #header {
    background:
        rgba(12, 16, 21, .96) !important;

    border-bottom:
        1px solid var(--blb-border) !important;

    box-shadow:
        0 4px 18px rgba(0, 0, 0, .18) !important;
}


.burasut-business .header-in {
    background: transparent !important;
}


/*
 * 背景画像が設定されている場合も
 * Businessページでは抑える
 */

.burasut-business .header {
    background-image: none !important;
}


/* =========================================================
   サイトタイトル
   ========================================================= */

.burasut-business .site-name-text {
    color: var(--blb-title) !important;
    font-weight: 600;
}


/* =========================================================
   グローバルナビ
   ========================================================= */

.burasut-business .navi,
.burasut-business .navi-in {
    background:
        var(--blb-bg-deep) !important;
}


.burasut-business .navi-in a {
    color:
        var(--blb-text-soft) !important;

    transition:
        color .15s ease,
        background .15s ease;
}


.burasut-business .navi-in a:hover {
    color:
        #fff !important;

    background:
        var(--blb-surface) !important;
}


/* =========================================================
   メインカラム
   ========================================================= */

.burasut-business .main {
    background:
        rgba(25, 31, 38, .96) !important;

    color:
        var(--blb-text);

    border:
        1px solid var(--blb-border);

    border-radius:
        var(--blb-radius);

    box-shadow:
        var(--blb-shadow);
}


/* =========================================================
   Businessブランド表示
   ========================================================= */

.burasut-business .article-header::before {
    content: "Burasut Lab Business";

    display: inline-flex;

    margin-bottom: 14px;

    padding:
        5px 10px;

    background:
        #12171d;

    color:
        var(--blb-text-soft);

    border:
        1px solid var(--blb-border);

    border-radius:
        4px;

    font-size:
        12px;

    font-weight:
        600;

    letter-spacing:
        .06em;
}


/* =========================================================
   記事タイトル
   ========================================================= */

.burasut-business .entry-title {
    color:
        var(--blb-title) !important;

    font-weight:
        700;

    line-height:
        1.45;
}


/* =========================================================
   記事本文
   ========================================================= */

.burasut-business .entry-content {
    color:
        var(--blb-text);

    line-height:
        1.9;
}


.burasut-business .entry-content p {
    color:
        var(--blb-text);
}


/* =========================================================
   H2
   ========================================================= */

.burasut-business .entry-content h2 {
    margin-top:
        2.8em;

    margin-bottom:
        1.2em;

    padding:
        15px 17px;

    background:
        var(--blb-bg-soft) !important;

    color:
        var(--blb-title) !important;

    border:
        0 !important;

    border-left:
        4px solid var(--blb-accent) !important;

    border-radius:
        0 var(--blb-radius-small)
        var(--blb-radius-small) 0;

    box-shadow:
        none !important;

    font-weight:
        700;
}


/* =========================================================
   H3
   ========================================================= */

.burasut-business .entry-content h3 {
    margin-top:
        2.3em;

    padding:
        0 0 10px;

    background:
        transparent !important;

    color:
        var(--blb-title) !important;

    border:
        0 !important;

    border-bottom:
        1px solid var(--blb-border) !important;

    box-shadow:
        none !important;

    font-weight:
        700;
}


/* =========================================================
   H4～H6
   ========================================================= */

.burasut-business .entry-content h4,
.burasut-business .entry-content h5,
.burasut-business .entry-content h6 {
    color:
        var(--blb-title) !important;

    background:
        transparent !important;

    border:
        0 !important;
}


/* =========================================================
   リンク
   ========================================================= */

.burasut-business .entry-content a {
    color:
        var(--blb-accent);

    text-decoration-color:
        rgba(93, 143, 240, .4);
}


.burasut-business .entry-content a:hover {
    color:
        var(--blb-accent-hover);

    text-decoration-color:
        var(--blb-accent-hover);
}


/* =========================================================
   目次
   ========================================================= */

.burasut-business .toc {
    background:
        #13181e !important;

    color:
        var(--blb-text);

    border:
        1px solid var(--blb-border) !important;

    border-radius:
        var(--blb-radius-small);

    box-shadow:
        none !important;
}


.burasut-business .toc-title {
    color:
        var(--blb-title);
}


.burasut-business .toc a {
    color:
        var(--blb-text-soft);
}


.burasut-business .toc a:hover {
    color:
        var(--blb-accent-hover);
}


/* =========================================================
   引用
   ========================================================= */

.burasut-business .entry-content blockquote {
    background:
        #14191f !important;

    color:
        var(--blb-text-soft);

    border:
        0 !important;

    border-left:
        4px solid var(--blb-border-strong) !important;

    border-radius:
        0 var(--blb-radius-small)
        var(--blb-radius-small) 0;
}


/* =========================================================
   インラインコード
   ========================================================= */

.burasut-business .entry-content :not(pre) > code {
    padding:
        2px 6px;

    background:
        #242c35;

    color:
        #d8e5ff;

    border:
        1px solid #303a46;

    border-radius:
        4px;
}


/* =========================================================
   コードブロック
   ========================================================= */

.burasut-business .entry-content pre {
    padding:
        20px;

    background:
        #090c10 !important;

    color:
        #dfe6ee;

    border:
        1px solid #252d36;

    border-radius:
        var(--blb-radius-small);

    overflow-x:
        auto;
}


.burasut-business .entry-content code {
    font-family:
        Consolas,
        "Courier New",
        monospace;
}


/* =========================================================
   テーブル
   ========================================================= */

.burasut-business .entry-content table {
    background:
        var(--blb-surface);

    color:
        var(--blb-text);

    border:
        1px solid var(--blb-border) !important;

    border-collapse:
        collapse;
}


.burasut-business .entry-content th {
    background:
        #222a33 !important;

    color:
        var(--blb-title);
}


.burasut-business .entry-content td {
    background:
        var(--blb-surface);
}


.burasut-business .entry-content th,
.burasut-business .entry-content td {
    border:
        1px solid var(--blb-border) !important;
}


/* =========================================================
   WordPressボタン
   ========================================================= */

.burasut-business .wp-block-button__link,
.burasut-business .entry-content .btn {
    background:
        var(--blb-accent) !important;

    color:
        #fff !important;

    border:
        0 !important;

    border-radius:
        var(--blb-radius-small) !important;

    box-shadow:
        none !important;

    transition:
        background .15s ease,
        transform .15s ease;
}


.burasut-business .wp-block-button__link:hover,
.burasut-business .entry-content .btn:hover {
    background:
        var(--blb-accent-hover) !important;

    transform:
        translateY(-1px);
}


/* =========================================================
   画像
   ========================================================= */

.burasut-business .entry-content img {
    border-radius:
        var(--blb-radius-small);
}


/* =========================================================
   ブログカード
   ========================================================= */

.burasut-business .blogcard {
    background:
        #151a20 !important;

    color:
        var(--blb-text);

    border:
        1px solid var(--blb-border) !important;

    border-radius:
        var(--blb-radius-small);

    box-shadow:
        none !important;
}


.burasut-business .blogcard:hover {
    background:
        var(--blb-surface-hover) !important;

    border-color:
        var(--blb-border-strong) !important;
}


.burasut-business .blogcard-title {
    color:
        var(--blb-title) !important;
}


/* =========================================================
   サイドバー全体
   ========================================================= */

.burasut-business .sidebar {
    background:
        transparent !important;
}


/* =========================================================
   サイドバーウィジェット
   ========================================================= */

.burasut-business .sidebar .widget {
    margin-bottom:
        22px;

    padding:
        18px;

    background:
        rgba(25, 31, 38, .96) !important;

    color:
        var(--blb-text);

    border:
        1px solid var(--blb-border);

    border-radius:
        var(--blb-radius);

    box-shadow:
        var(--blb-shadow);
}


/* =========================================================
   サイドバータイトル
   ========================================================= */

.burasut-business .sidebar .widget-title {
    margin:
        0 0 15px;

    padding:
        0 0 10px;

    background:
        transparent !important;

    color:
        var(--blb-title) !important;

    border:
        0 !important;

    border-bottom:
        1px solid var(--blb-border) !important;

    font-size:
        16px;

    font-weight:
        700;

    box-shadow:
        none !important;
}


/* =========================================================
   人気記事
   ========================================================= */

.burasut-business .popular-entry-card-wrap {
    border-bottom:
        1px solid var(--blb-border);
}


.burasut-business .popular-entry-card-wrap:last-child {
    border-bottom:
        0;
}


.burasut-business .popular-entry-card {
    padding:
        10px 0;

    background:
        transparent !important;

    transition:
        background .15s ease;
}


.burasut-business .popular-entry-card:hover {
    background:
        var(--blb-surface-hover) !important;
}


.burasut-business .popular-entry-card-title {
    color:
        var(--blb-text) !important;

    font-size:
        14px;

    line-height:
        1.55;
}


.burasut-business .popular-entry-card-thumb img {
    border-radius:
        4px;
}


/* =========================================================
   新着・関連記事カード
   ========================================================= */

.burasut-business .entry-card-wrap,
.burasut-business .related-entry-card-wrap {
    color:
        var(--blb-text);
}


.burasut-business .entry-card,
.burasut-business .related-entry-card {
    background:
        transparent !important;
}


.burasut-business .entry-card-title,
.burasut-business .related-entry-card-title {
    color:
        var(--blb-text) !important;
}


/* =========================================================
   プロフィール
   ========================================================= */

.burasut-business .author-box {
    background:
        #151a20 !important;

    color:
        var(--blb-text);

    border:
        1px solid var(--blb-border);

    border-radius:
        var(--blb-radius);
}


.burasut-business .author-name {
    color:
        var(--blb-title) !important;
}


/* =========================================================
   フォーム
   ========================================================= */

.burasut-business input[type="text"],
.burasut-business input[type="email"],
.burasut-business input[type="url"],
.burasut-business input[type="search"],
.burasut-business input[type="tel"],
.burasut-business textarea,
.burasut-business select {
    background:
        #10151a !important;

    color:
        var(--blb-text) !important;

    border:
        1px solid var(--blb-border) !important;

    border-radius:
        5px;
}


.burasut-business input:focus,
.burasut-business textarea:focus,
.burasut-business select:focus {
    border-color:
        var(--blb-accent) !important;

    outline:
        none;

    box-shadow:
        0 0 0 2px rgba(93, 143, 240, .15);
}


/* =========================================================
   検索ボタンなど
   ========================================================= */

.burasut-business button,
.burasut-business input[type="submit"] {
    border-radius:
        5px;
}


/* =========================================================
   パンくず
   ========================================================= */

.burasut-business .breadcrumb {
    color:
        var(--blb-muted);
}


.burasut-business .breadcrumb a {
    color:
        var(--blb-text-soft);
}


.burasut-business .breadcrumb a:hover {
    color:
        var(--blb-accent-hover);
}


/* =========================================================
   カテゴリ・タグ
   ========================================================= */

.burasut-business .entry-categories a,
.burasut-business .entry-tags a,
.burasut-business .cat-link,
.burasut-business .tag-link {
    background:
        #202731 !important;

    color:
        var(--blb-text-soft) !important;

    border:
        1px solid var(--blb-border) !important;

    border-radius:
        4px;
}


/* =========================================================
   ページネーション
   ========================================================= */

.burasut-business .pagination a,
.burasut-business .pagination span {
    background:
        var(--blb-surface);

    color:
        var(--blb-text);

    border:
        1px solid var(--blb-border);
}


.burasut-business .pagination .current {
    background:
        var(--blb-accent);

    color:
        #fff;
}


/* =========================================================
   コメント
   ========================================================= */

.burasut-business .comment-box,
.burasut-business .comment-form {
    color:
        var(--blb-text);

    border-color:
        var(--blb-border);
}


/* =========================================================
   フッター
   ========================================================= */

.burasut-business .footer,
.burasut-business #footer {
    background:
        #090c10 !important;

    color:
        var(--blb-muted);

    border-top:
        1px solid var(--blb-border);
}


/* =========================================================
   スクロールバー
   対応ブラウザのみ
   ========================================================= */

.burasut-business {
    scrollbar-color:
        #3b4653 #11161c;
}


/* =========================================================
   スマートフォン
   ========================================================= */

@media screen and (max-width: 834px) {

    .burasut-business {
        background:
            var(--blb-bg) !important;
    }


    .burasut-business .main {
        padding:
            20px 16px;

        border-left:
            0;

        border-right:
            0;

        border-radius:
            0;

        box-shadow:
            none;
    }


    .burasut-business .entry-title {
        font-size:
            25px;
    }


    .burasut-business .entry-content {
        font-size:
            16px;
    }


    .burasut-business .entry-content h2 {
        padding:
            13px 14px;

        font-size:
            21px;
    }


    .burasut-business .entry-content h3 {
        font-size:
            18px;
    }


    .burasut-business .article-header::before {
        font-size:
            11px;
    }


    .burasut-business .sidebar .widget {
        border-radius:
            0;

        border-left:
            0;

        border-right:
            0;

        box-shadow:
            none;
    }
}