/*
カラー定義
*/
:root {
    --breeder-main-color: #549B35;
    --adoption-main-color: #F08300;
    --common-main-color: #1343df;
    --bg-color: #ffffff;
    --accent-color: #FF5D5D;
    --gray-500: #424242;
    --gray-400: #7C7C7C;
    --gray-300: #B2B2B2;
    --gray-200: #F0F0F0;
    --gray-100: #F8F8F8;
}

.bg-breeder {
    background-color: var(--breeder-main-color)!important;
    border: var(--breeder-main-color)!important;
}

.bg-sub-breeder {
    background-color: #49bb6b;
}

.section-search {
    border-radius: 10px;
    border-style: solid;
    border-width: 2px;
    border-color: var(--breeder-main-color)!important;
}

.section-sub-content {
    border-style: solid;
    border-width: 2px 0px 0px 0px;
    border-color: var(--breeder-main-color)!important;
}

.color-breeder {
    color: var(--breeder-main-color);
}

.header-nav .nav-link.active {
    background-color: var(--breeder-main-color);
}

.header-nav .nav-link:hover {
    color: var(--breeder-main-color);
}

.nav-pills .show > .nav-link {
    background-color: var(--gray-200);
    color: var(--breeder-main-color);
}

.breeder-btn {
    background-color: var(--breeder-main-color);
    color: #fff;
}

.breeder-btn:hover {
    background-color: #49bb6b;
    color: #fff;
}

.pagination .page-item.active .page-link {
    background-color: var(--breeder-main-color);
    border-color: var(--breeder-main-color);
}

.pagination .page-link {
    color: var(--breeder-main-color)
}

.breeder-border {
    border: 2px solid var(--breeder-main-color) !important;
}

.hidden {
    display: none !important;
}

.sub-title {
    overflow: auto;
}

.btn-like {
    border: 1px solid #dee2e6;
    border-radius: 4px;
    display: inline-block;
    text-align: center;
    box-sizing: border-box;
    padding: 4px 0 4px 0;
    cursor: pointer;
}

.btn-like:hover, .red-heart {
    border-color: #ff7d7d;
}

.pet-set-male {
    color: blue;
}

.pet-set-female {
    color: red;
}

video {
    /* override other styles to make responsive */
    width: 100% !important;
    height: auto !important;
}

.w-550 {
    width: 550px;
}

.btn-breeder__inquiries {
    font-size: 1.5em;
    text-align: center;
    margin: 0 0.8rem 3.2rem 0.8rem;
    width: -webkit-fill-available;
    background-color: var(--common-main-color);
}

.btn-breeder__inquiries a {
    color: var(--bg-color);
}

.btn-breeder__inquiries a:hover {
    color: black;
}