:root {
    --background-white: #ffffff;
    --bd-violet-rgb: 112.520718, 44.062154, 249.437846;
    --bs-body-color: #212529;
    --bd-sidebar-link-bg: rgba(var(--bd-violet-rgb), .1);
}

/*
common
- color
*/

.bg-light {
    --bs-bg-opacity: 1;
    background-color: rgba(var(--background-white), var(--bs-bg-opacity)) !important;
}

.bd-navbar {
    padding: 0.75rem 0;
    background-color: transparent;
    background-image: linear-gradient(to bottom, rgba(var(--bd-violet-rgb), 1), rgba(var(--bd-violet-rgb), 0.95));
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15), inset 0 -1px 0 rgba(0, 0, 0, 0.15);
}


/*
common
- size
*/

.navbar > .container, .navbar > .container-fluid, .navbar > .container-lg, .navbar > .container-md, .navbar > .container-sm, .navbar > .container-xl, .navbar > .container-xxl {
    display: flex;
    flex-wrap: inherit;
    align-items: center;
    justify-content: space-between;
    max-width: 1320px;
}

.article-min-height {
    min-height: 300px;
}

/*
common
- layout
*/
.content {
    grid-template-columns: 0.6fr 3fr;
    gap: 2rem;
}

.mt-6 {
    margin-top: 5rem !important;
}

.ms-m1 {
    margin-left: -1rem;
}

.mb-6 {
    margin-bottom: 5rem !important;
}

/*
common
- tag style
*/

.bd-links-link {
    padding: 0.1875rem 0.5rem;
    margin-top: 0.125rem;
    /*margin-left: 1.125rem;*/
    color: var(--bs-body-color);
    text-decoration: none;
}

.bd-links-link:hover, .bd-links-link:focus, .bd-links-link.active {
    background-color: var(--bd-sidebar-link-bg);
}

/*
common
- component
*/

.btn-blog {
    background-color: rgba(var(--bd-violet-rgb), 0.9);
    color: white;
}

.btn-blog:hover {
    background-color: rgba(var(--bd-violet-rgb), 1);
    color: white;
}

/*
list-group
list-group-item
 */

.list-group-item {
    padding: 0;
}

@media (min-width: 1200px) {
    .content {
        grid-template-columns: 1fr 3fr;
        gap: 2rem;
    }
}

@media (min-width: 1400px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
        max-width: 1320px;
    }

    .content {
        grid-template-columns: 0.6fr 3fr;
        gap: 2rem;
    }
}


/* modal style */
.modal-open {
    padding-right: 0px !important;
}