﻿/* =========================================================================
   2026 forecast/index.html 전용 — 방송3사 출구조사 예측 페이지 (신규)
   ========================================================================= */

/* -------------------------------------------------------------------------
   섹션 타이틀 · 지도 래퍼 — open.css (.sub-open / .sub-forecast) 와 동일
   ------------------------------------------------------------------------- */

/* 출구조사 — 지도 2개 노출, 1칸씩 이동 (기초단체장 없음) */
.sub-forecast .map-slider--step-col .map-slides__track {
    width: calc(100% * var(--item-count, 3) / var(--visible-count, 2));
}

.sub-forecast .map-slider--step-col .map-slide__col {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 calc(100% / var(--item-count, 3));
    flex: 0 0 calc(100% / var(--item-count, 3));
}

.sub-forecast .map-slide__note {
    color: #646D76;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    line-height: 150%;
    letter-spacing: -0.4px;
    margin: -40px 0 60px 40px;
}

/* -------------------------------------------------------------------------
   방송3사 심층출구조사 배너
   ------------------------------------------------------------------------- */
.fc-survey {
    margin-bottom: 40px;
}

    .fc-survey a {
        display: block;
    }

    .fc-survey img {
        display: block;
        width: 100%;
        height: auto;
    }

/* -------------------------------------------------------------------------
   예측 카드 그리드 (4열)
   ------------------------------------------------------------------------- */
.fc-list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    padding-bottom: 60px;
    overflow: visible;
}

/* -------------------------------------------------------------------------
   출구조사 조사 안내 박스
   ------------------------------------------------------------------------- */
.fc-survey-info {
    display: flex;
    gap: 40px;
    box-sizing: border-box;
    min-height: 136px;
    margin-bottom: 60px;
    padding: 40px 80px;
    border-radius: 4px;
    background: #F8F9FA;
}

.fc-survey-info__col {
    flex: 1;
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

    .fc-survey-info__col li {
        display: flex;
        align-items: flex-start;
        font-family: 'mbcnew-light', sans-serif;
        font-size: 16px;
        line-height: 24px;
        letter-spacing: -0.4px;
        color: #646D76;
    }

        .fc-survey-info__col li::before {
            content: '';
            flex-shrink: 0;
            width: 4px;
            height: 4px;
            margin-top: 10px;
            margin-right: 8px;
            background: #646D76;
            aspect-ratio: 1 / 1;
        }

        .fc-survey-info__col li strong {
            font-family: 'mbcnew-medium', sans-serif;
            font-weight: 500;
        }

/* -------------------------------------------------------------------------
   예측 카드
   ------------------------------------------------------------------------- */
.fc-card {
    display: flex;
    flex-direction: column;
    height: 386px;
    background: #fff;
    border-radius: 20px;
    border: 1px solid #DEE2E6;
    overflow: visible;
}

/* ── 카드 헤더 ── */
.fc-card-head {
    background: #F1F3F5;
    border-radius: 20px 20px 0 0;
    padding: 14px 16px;
    text-align: center;
    overflow: visible;
}

.fc-card-tit {
    display: inline-block;
    font-family: 'mbcnew-bold', sans-serif;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: -0.4px;
    color: #212529;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* ── 카드 바디 안 경합 뱃지 (광역단체장 탭용) ── */
.fc-card-body .card-status {
    top: 95px;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
}

/* ── 카드 헤더 경합 뱃지 — fc-card-tit::after로 텍스트 우측에 위로 띄움 ── */
.fc-card-head.rival {
    overflow: visible; /* 뱃지가 헤더 밖으로 나갈 수 있도록 */
}
    .fc-card-head.rival .fc-card-tit {
        position: relative;
        overflow: visible; /* ::after 클리핑 방지 */
    }
        .fc-card-head.rival .fc-card-tit::after {
            content: '';
            position: absolute;
            left: calc(100% + 4px); /* 텍스트 끝 바로 우측 */
            top: 35px;
            transform: translateY(-75%); /* 위로 띄우기 */
            width: 86px;
            height: 96px;
            background: url(../images/badge_vs.svg) no-repeat center / contain;
            z-index: 2;
        }

/* ── 카드 바디 ── */
.fc-card-body {
    position: relative;
    flex: 1;
    display: flex;
    gap: 40px;
    padding: 24px 24px 32px;
    min-height: 0;
    height: 100%;
    align-items: stretch;
    justify-content: center;
}

/* ── 후보 컬럼 ── */
.fc-cand {
    flex-shrink: 0;
    width: 107px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
}

/* ── 후보 사진 래퍼 (배지 기준점) ── */
.fc-photo-wrap {
    position: relative;
    flex-shrink: 0;
    width: 107px;
    height: 138px;
    border-radius: 8px;
    border: 1px solid #DEE2E6;
    overflow: visible;
}

    .fc-photo-wrap img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 8px;
        display: block;
    }

/* ── 예측 1위 / 2위 배지 (open badge1·badge2 + 피그마 타이포) ── */
.sub-forecast .fc-photo-wrap .badge1,
.sub-forecast .fc-photo-wrap .badge2 {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    line-height: 1;
    gap: 0;
}

.sub-forecast .fc-photo-wrap .badge1 {
    margin-left: -38px
}

.sub-forecast .fc-photo-wrap .badge2 {
    margin-left: 38px
}
.sub-forecast .fc-photo-wrap .badge-pre {
    display: block;
    font-family: 'mbcnew-medium', sans-serif;
    font-size: 13px;
    font-weight: 500;
    line-height: 20px;
    letter-spacing: -0.325px;
    color: #fff;
    text-align: center;
}

.sub-forecast .fc-photo-wrap .badge-rank {
    display: inline-flex;
    align-items: baseline;
    justify-content: center;
    color: #fff;
}

.sub-forecast .fc-photo-wrap .badge1 .num,
.sub-forecast .fc-photo-wrap .badge2 .num,
.sub-forecast .fc-photo-wrap .badge-r3 .num {
    font-family: 'mbcnew-bold', sans-serif;
    font-size: 24px;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: -0.6px;
}

.sub-forecast .fc-photo-wrap .badge1 em,
.sub-forecast .fc-photo-wrap .badge2 em,
.sub-forecast .fc-photo-wrap .badge-r3 em {
    font-family: 'mbcnew-bold', sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: -0.35px;
    margin-top: 0;
    font-style: normal;
}

/* ── 후보 정보 텍스트 ── */
.fc-cand-info {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 3px;
    width: 100%;
}

.fc-cand-num {
    font-family: 'mbcnew-light', sans-serif;
    font-size: 13px;
    font-weight: 300;
    color: #646D76;
    line-height: 20px;
    letter-spacing: -0.325px;
}

.fc-cand-name {
    display: block;
    font-family: 'mbcnew-bold', sans-serif;
    font-size: 18px;
    font-weight: 700;
    color: #212529;
    line-height: 28px;
    letter-spacing: -0.45px;
}

.fc-cand-party {
    font-family: 'mbcnew-light', sans-serif;
    font-size: 13px;
    font-weight: 300;
    color: #646D76;
    line-height: 20px;
    letter-spacing: -0.325px;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

/* 득표율 — 숫자 18px bold / % 13px light (피그마) */
.fc-cand-rate {
    display: block;
    align-self: stretch;
    width: 100%;
    font-style: normal;
    text-align: center;
    font-family: 'mbcnew-bold', sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 28px;
    letter-spacing: -0.45px;
}

.fc-cand-rate-unit {
    font-family: 'mbcnew-light', sans-serif;
    font-size: 13px;
    font-weight: 300;
    line-height: 28px;
    letter-spacing: -0.325px;
    margin-left: 1px;
}

.fc-cand-rate.party1 {
    color: #4C95E8;
}

.fc-cand-rate.party2 {
    color: #E66A6A;
}

.fc-cand-rate.party3 {
    color: #4E6DA2;
}

.fc-cand-rate.party4 {
    color: #ECA559;
}

.fc-cand-rate.party5 {
    color: #B84A6C;
}

.fc-cand-rate.party99 {
    color: #9D9D9D;
}

.fc-cand-rate.party_edu {
    color: #79ADAE;
}

/* ── 카드 내 그래프 재정의
   open.css .card-graph 를 상속하되 fc-card 내에서 크기 조정
   ------------------------------------------------------------------------- */
.fc-card .card-graph {
    flex-shrink: 0;
    position: absolute;
    height: 120px;
    width: 48px;
    left: 50%;
    bottom: 33px;
    margin-left: -23px;
}

    .fc-card .card-graph .vert {
        display: flex;
        justify-content: center;
        gap: 8px;
        list-style: none;
        margin: 0;
        padding: 0;
        margin-top: 120px;
    }

        .fc-card .card-graph .vert li {
            position: relative;
            width: 20px;
            height: 120px;
        }

        .fc-card .card-graph .vert .bar {
            display: block;
            position: absolute;
            left: 0;
            bottom: 0;
            width: 20px;
            overflow: visible;
            border-radius: 12px 12px 0 0;
            -webkit-animation-duration: 1s;
            animation-duration: 1s;
            -webkit-animation-fill-mode: both;
            animation-fill-mode: both;
            background: linear-gradient(to left, rgba(0, 0, 0, 0.10) 0 6px, transparent 6px), var(--bar-color);
            z-index: 2;
        }

            /* 당 색상 (open.css 와 동일 — .fc-card 스코프 내 명시) */
            .fc-card .card-graph .vert .bar.party1 {
                --bar-color: #4C95E8;
            }

            .fc-card .card-graph .vert .bar.party2 {
                --bar-color: #E66A6A;
            }

            .fc-card .card-graph .vert .bar.party3 {
                --bar-color: #4E6DA2;
            }

            .fc-card .card-graph .vert .bar.party4 {
                --bar-color: #ECA559;
            }

            .fc-card .card-graph .vert .bar.party5 {
                --bar-color: #B84A6C;
            }

            .fc-card .card-graph .vert .bar.party99 {
                --bar-color: #9D9D9D;
            }

            .fc-card .card-graph .vert .bar.party_edu {
                --bar-color: #79ADAE;
            }

/* 출구조사 — 막대 위 수치 미표시 (open .card-graph .num 상속 차단) */
.sub-forecast .fc-card .card-graph .vert .bar .num {
    display: none;
}

/* ── 재보궐 카드: 4열 그리드에서 span 2 → 2열 레이아웃 ── */
.fc-list [data-tab-panel="byelection"] {
    grid-column: span 2;
}

/* =========================================================================
   3인 체제 카드 (fc-card--3cand)
   ========================================================================= */
.fc-card--3cand {
    height: auto;
    min-height: 386px;
}

    /* fc-card-body: 3개 그룹(후보+바)을 가로로 균등 배분 */
    .fc-card--3cand .fc-card-body {
        align-items: flex-start;
        /* gap: 60px; */
    }

    /* 후보 + 개인 바 묶음 */
    .fc-card--3cand .fc-cand-grp {
        display: flex;
        gap: 6px;
        align-items: flex-end;
        height: 100%;
    }

    .fc-card--3cand .fc-cand {height: 100%;}

    .fc-card--3cand .fc-photo-wrap {
        width: 107px;
        height: 138px;
    }


    /* 3인 카드 그래프 — position: absolute 해제, 인라인 단일 바 */
    .fc-card--3cand .card-graph {
        position: relative;
        left: auto;
        bottom: -120px;
        margin-left: 0;
        width: 20px;
        height: 120px;
        flex-shrink: 0;
        margin-bottom: 0;
    }

        .fc-card--3cand .card-graph .vert {
            margin-top: 0;
            gap: 0;
            align-items: flex-end;
            height: 120px;
        }

            .fc-card--3cand .card-graph .vert li {
                width: 20px;
                height: 120px;
            }

            .fc-card--3cand .card-graph .vert .bar {
                width: 20px;
            }

/* ── 예측 3위 뱃지 (bronze, badge-r3) ── */
.sub-forecast .fc-photo-wrap .badge-r3 {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 84px;
    height: 84px;
    box-sizing: border-box;
    background: url(../images/badge_r3.svg) no-repeat center / 84px 84px;
    font-family: 'mbcnew-bold', sans-serif;
    font-weight: 700;
    color: #fff;
    line-height: 1;
    gap: 0;
    margin-left: 0;
}

/* ── 교육감 카드: 기호·정당 없음, 이름·퍼센트·그래프(party_edu) ── */
.fc-card--edu .fc-cand-num,
.fc-card--edu .fc-cand-party {
    display: none;
}

/* 사진은 상단, 이름·퍼센트·그래프는 카드 하단(32px) 기준선 정렬 */
.fc-card--edu .fc-card-body {
}

.fc-card--edu .fc-cand {
    align-self: stretch;
    min-height: 100%;
    justify-content: flex-start;
}

.fc-card--edu .fc-photo-wrap {
    flex-shrink: 0;
}

.fc-card--edu .fc-cand-info {
    gap: 4px;
    margin-top: auto;
    flex-shrink: 0;
}

.fc-card--edu .fc-cand-name {
    margin-top: 0;
}


/* =========================================================================
   하단: 구버전 forecast CSS (레거시 — 기존 페이지 호환용)
   ========================================================================= */
/*2026 06 PC forecast*/
.wrap-forecast {
    margin-bottom: 50px;
}

/*hexmap css*/
.hexmap_forecast {
    width: 1200px;
    margin: 0 auto;
    overflow: hidden;
    margin-bottom: 50px;
}

    .hexmap_forecast .hex_warp {
        display: inline-block;
        float: left;
        width: 440px;
        position: relative;
        box-sizing: border-box;
        border-right: 1px solid #d1d1d1;
        margin-top: 35px;
    }

        .hexmap_forecast .hex_warp .hex_title {
            width: 200px;
            height: 50px;
            line-height: 50px;
            text-align: center;
            font-size: 18px;
            font-family: 'mbcnew-bold';
            border: 1px solid #bfbfbf;
            border-radius: 30px;
            margin: 0 auto;
            position: relative;
            top: -30px;
        }

    .hexmap_forecast .hex_congress {
        width: 320px;
        border-right: 0;
    }

.gvn_bx {
    width: 130px;
    display: inline-block;
    position: absolute;
    right: 55px;
    top: 500px;
}

.hex_congress .gvn_bx {
    right: 0;
    display: none;
}

.gvn_bx .gvn_title {
    font-size: 16px;
}

    .gvn_bx .gvn_title strong {
        font-family: 'mbcnew-bold';
    }

.gvn_bx .gvn_lst {
    margin-top: 25px;
}

    .gvn_bx .gvn_lst ul { /* overflow: hidden; */
    }

        .gvn_bx .gvn_lst ul li {
            font-size: 14px;
            padding-left: 16px;
            position: relative;
            font-family: 'mbcnew-light';
            margin-top: 3px;
        }

            .gvn_bx .gvn_lst ul li:first-child {
                margin-top: 0;
            }

            .gvn_bx .gvn_lst ul li:after {
                content: '';
                display: block;
                width: 10px;
                height: 10px;
                position: absolute;
                top: 4px;
                left: 2px;
            }

            .gvn_bx .gvn_lst ul li.gvn_1:after {
                background: #5995cb;
            }

            .gvn_bx .gvn_lst ul li.gvn_2:after {
                background: #a84747;
            }

            .gvn_bx .gvn_lst ul li.gvn_3:after {
                background: #c19c47;
            }

            .gvn_bx .gvn_lst ul li.gvn_9:after {
                background: #a49f82;
            }

            .gvn_bx .gvn_lst ul li.gvn_99:after {
                background: #b4b4b4;
            }

.wrap-forecast2 {
    background: #f6f6f6;
}

    .wrap-forecast2 .sec-tit {
        padding-bottom: 10px;
    }

    .wrap-forecast2 .tabs ul {
        text-align: center;
    }

    .wrap-forecast2 .tabs li {
        display: inline-block;
        line-height: 48px;
        border-radius: 24px;
        float: inherit;
    }

        .wrap-forecast2 .tabs li button {
            line-height: 48px;
            padding: 0 30px;
        }

    .wrap-forecast2 .wrap-cont {
        padding: 30px 0;
        overflow: hidden;
    }

.wrap-cont li {
    float: left;
    margin-right: 12px;
    margin-bottom: 38px;
}

.wrap-tab1 li:nth-child(4n) {
    margin-right: 0;
}

.wrap-city {
    width: 288px;
    height: 386px;
    background: #fff;
    border-radius: 15px;
    border: 1px solid #cdcdcd;
    overflow: hidden;
    box-sizing: border-box;
}

    .wrap-city h4 {
        line-height: 53px;
        font-size: 20px;
        font-family: 'mbcnew-bold';
        background: #fef1e6;
        text-align: center;
    }

.candidate-rival {
    display: flex;
    padding: 0 22px;
    justify-content: space-between;
    text-align: center;
}

    .candidate-rival > div {
        position: relative;
    }

    .candidate-rival .img {
        margin: 30px 0;
        width: 106px;
        height: 133px;
        border: 1px solid #d4d4d4;
        border-radius: 5px;
        overflow: hidden;
    }

    .candidate-rival .badge {
        display: inline-block;
        width: 70px;
        height: 70px;
        position: absolute;
        top: 134px;
        left: 50%;
        z-index: 10;
        background: url(https://image.imnews.imbc.com/issue/2026vote/pc/images/badge.png) no-repeat;
        background-size: 70px;
        font-family: 'mbcnew-bold';
        font-size: 14px;
        overflow: hidden;
        padding-top: 16px;
        line-height: 1;
        letter-spacing: -.03em;
    }

    .candidate-rival .rival-l .badge {
        left: -13px;
    }

    .candidate-rival .badge span {
        font-size: 24px;
    }

    .candidate-rival .candi-name {
        display: block;
        font-size: 20px;
        font-family: 'mbcnew-bold';
    }

    .candidate-rival .candi-num, .candidate-rival .candi-party {
        font-size: 13px;
    }

    .candidate-rival .data-rate {
        font-size: 22px;
        font-family: 'mbcnew-bold';
    }

        .candidate-rival .data-rate span {
            display: inline-block;
            margin-left: 2px;
            font-size: 12px;
            font-family: 'mbcnew-light';
        }

    .candidate-rival .graph {
        position: absolute;
        right: -11px;
        top: 297px;
    }

    .candidate-rival .rival-r .graph {
        left: -8px;
    }

    .candidate-rival .graph .vert {
        position: relative;
        width: 20px;
        height: 125px;
    }

        .candidate-rival .graph .vert .bar {
            display: block;
            border-radius: 10px 10px 0 0;
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;
            -webkit-animation-duration: 1s;
            -moz-animation-duration: 1s;
            -o-animation-duration: 1s;
            animation-duration: 1s;
            -webkit-animation-fill-mode: both;
            -moz-animation-fill-mode: both;
            -o-animation-fill-mode: both;
            animation-fill-mode: both
        }

            .candidate-rival .graph .vert .bar.party_2 {
                background: url(https://image.imnews.imbc.com/issue/2026vote/pc/images/main-c1.png);
                background-size: 100%;
            }

            .candidate-rival .graph .vert .bar.party_1 {
                background: url(https://image.imnews.imbc.com/issue/2026vote/pc/images/main-c2.png);
                background-size: 100%;
            }

            .candidate-rival .graph .vert .bar.party_3 {
                background: url(https://image.imnews.imbc.com/issue/2026vote/pc/images/main-c3.png);
                background-size: 100%;
            }

            .candidate-rival .graph .vert .bar.party_99 {
                background: url(https://image.imnews.imbc.com/issue/2026vote/pc/images/main-c9.png);
                background-size: 100%;
            }

            .candidate-rival .graph .vert .bar.party_edu {
                background: #4b686c
            }

    .candidate-rival .open-rate {
        position: absolute;
        top: 44px;
        left: 236px;
        width: 107px;
        margin-left: 0;
        border-radius: 10px;
        font-size: 13px;
        line-height: 23px;
        text-align: center;
        background: #eeeeee;
        box-sizing: border-box;
    }

.wrap-forecast3 {
    position: relative;
}

    .wrap-forecast3 .wrap-slide {
        position: relative;
        overflow: hidden;
        width: 100%;
    }

.wrap-hot h3 {
    box-sizing: border-box;
    height: 75px;
    padding: 9px 0;
    background-color: #dde5e5;
    font-size: 20px;
    display: flex;
    align-content: center;
    flex-wrap: wrap;
    justify-content: center;
}

    .wrap-hot h3 span {
        flex: 0 0 80%;
    }

    .wrap-hot h3 strong {
        flex: 0 0 100%;
        font-size: 22px;
        font-family: 'mbcnew-bold';
    }

    .wrap-hot h3 select {
        padding: 0 28px 0 10px;
        font-size: 22px;
        font-family: 'mbcnew-bold';
        background: url(https://image.imnews.imbc.com/issue/2026vote/pc/images/ico-select2.png) no-repeat 95% center;
        text-align: center;
    }

.wrap-hot .wrap-area {
    float: left;
    margin-right: 40px;
    width: 580px;
    height: 431px;
    margin-bottom: 40px;
    border-radius: 17px;
    overflow: hidden;
    text-align: center;
    border: 1px solid #cdcdcd;
    box-sizing: border-box;
}

    .wrap-hot .wrap-area:nth-child(2n) {
        margin-right: 0;
    }

.wrap-hot .candidate-rival {
    padding: 0 57px;
    position: relative;
}

    .wrap-hot .candidate-rival .img {
        width: 160px;
        height: 160px;
        border: 0;
        margin-top: 40px;
    }

    .wrap-hot .candidate-rival .badge {
        width: 88px;
        height: 88px;
        background-size: 88px;
        padding-top: 21px;
        top: 134px;
        left: 119px;
        font-size: 18px;
        font-family: 'mbcnew-light';
    }

        .wrap-hot .candidate-rival .badge span {
            font-size: 30px;
            font-family: 'mbcnew-bold';
        }

    .wrap-hot .candidate-rival .candi-name {
        display: block;
        margin: 5px 0;
        font-size: 26px;
        font-family: 'mbcnew-bold';
    }

    .wrap-hot .candidate-rival .candi-num, .wrap-hot .candidate-rival .candi-party {
        font-size: 16px;
    }

    .wrap-hot .candidate-rival .graph .vert {
        width: 40px;
        height: 200px;
    }

        .wrap-hot .candidate-rival .graph .vert .bar {
            border-radius: 20px 20px 0 0
        }

    .wrap-hot .candidate-rival .graph {
        right: -62px;
        top: 318px;
    }

    .wrap-hot .candidate-rival .rival-l .badge {
        left: -40px;
    }

    .wrap-hot .candidate-rival .rival-r .graph {
        left: -60px;
    }

.wrap-hot .graph .percent {
    display: block;
    width: 80px;
    text-align: center;
    margin-top: -41px;
    margin-left: -21px;
    font-size: 26px;
    font-family: 'mbcnew-bold';
    letter-spacing: -.08rem;
}

    .wrap-hot .graph .percent span {
        font-size: 16px;
    }

.wrap-hot .href {
    position: absolute;
    right: 0;
    top: 40px;
}

.hot-info {
    margin-bottom: 50px;
    padding: 25px 50px;
    background: #f6f6fa;
    line-height: 38px;
    font-size: 16px;
    overflow: hidden;
}

    .hot-info p {
        width: 50%;
        float: left;
    }

    .hot-info strong {
        display: inline-block;
        margin-right: 15px;
        font-family: 'mbcnew-bold';
    }

.kyo .wrap-city {
    height: 375px;
}

.kyo .candidate-rival .wrap-rate {
    padding-top: 24px;
}

.kyo .candidate-rival .graph {
    top: 279px;
}

    .kyo .candidate-rival .graph ul {
        height: 100px;
    }

.wrap-details {
    border-top: 1px solid #DEE2E6;
}