@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;600;700;900&display=swap');

* {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    font-family: 'Noto Sans KR', sans-serif, "Apple SD Gothic Neo", "Malgun Gothic", "맑은 고딕", "Dotum", "돋움";
    font-weight: 400;
    color: #333;
    font-size: 15px;
}

/*------------------------------------------------------------------------------
                                        LAYOUT
-------------------------------------------------------------------------------*/
#wrap {
    min-width: 320px;
    overflow: hidden;
    background: #f5f5f5
}

#container,
#container_V3 {
    max-width: 640px;
    margin: 0 auto;
    background: #FFF;
}

html {
    font-size: 10px
}

.cor_999 {
    color: #999 !important;
}

.cor_5671d1 {
    color: #5671d1 !important;
}

.cor_fd5a73 {
    color: #fd5a73 !important;
}

.bgcol_333 {
    background-color: #333 !important;
}

.mg_r_3_4p {
    margin-right: 3.4% !important;
}

/*------------------------------------------------------------------------------
                                        HEADER
-------------------------------------------------------------------------------*/
.m_gnb {
    height: 54px;
    padding: 15px 15px 0 15px;
    box-sizing: border-box;
    background: #e60012
}

.m_gnb:after {
    content: "";
    display: block;
    clear: both
}

.m_gnb .btn_menu a {
    float: right;
    width: 25px;
    height: 25px;
    font-size: 0
}

.m_gnb .btn_menu a:after {
    position: absolute;
    top: 0;
    left: 0;
    display: inline-block;
    width: 25px;
    height: 25px;
    background-position: -456px -106px
}

.m_gnb .m_logo a {
    float: left;
    width: 102px;
    height: 25px;
    font-size: 0
}

.m_gnb .m_logo a:after {
    top: 0;
    left: 0;
    display: inline-block;
    width: 102px;
    height: 25px;
    background-position: -364px -16px
}

.m_gnb .sub_logo {
    float: left
}

.m_gnb .sub_logo a {
    float: left;
    width: 23px;
    height: 23px;
    font-size: 0
}

.m_gnb .sub_logo a:after {
    top: 0;
    left: 0;
    display: inline-block;
    width: 23px;
    height: 23px;
    background-position: -328px -135px
}

.m_gnb .sub_logo i {
    display: inline-block;
    padding: 0 0 0 10px;
    font-size: 1.3em;
    color: #fff
}

.m_gnb .sidesite {
    float: right;
    width: 89px;
    height: 22px;
    margin: 5px 0 0 0;
    font-size: 0
}

.m_gnb .sidesite a:after {
    top: 0;
    left: 0;
    display: inline-block;
    width: 89px;
    height: 22px;
    background-position: -160px -14px
}

.m_gnb .m_search a {
    float: right;
    width: 25px;
    height: 25px;
    margin: 0 20px 0 0;
    font-size: 0
}

.m_gnb .m_search a:after {
    top: 0;
    left: 0;
    display: inline-block;
    width: 25px;
    height: 25px;
    background-position: -423px -106px
}

.on_m_search {
    display: none
}

.on_m_search.open {
    position: relative;
    display: block;
    width: 100%;
    height: 60px;
    background: #fff;
    z-index: 100
}

.on_m_search.open div {
    overflow: hidden;
    position: relative;
    top: 0;
    width: 100%;
    margin: 0 auto;
    text-align: center
}

.on_m_search.open div input {
    float: left;
    width: 80%;
    height: 60px;
    text-indent: 20px;
    font-size: 1.3em
}

.on_m_search.open div label {
    float: left;
    width: 20%;
    background: #b3020f;
}

.on_m_search.open div label a {
    display: inline-block;
    width: 100%;
    height: 60px;
    line-height: 60px;
    color: #fff
}

.on_m_search .btn_close {
    position: absolute;
    top: -39px;
    right: 59px;
    width: 26px;
    height: 26px;
    font-size: 0;
    cursor: pointer
}

.on_m_search .btn_close:after {
    top: 0;
    left: 0;
    width: 26px;
    height: 26px;
    background-position: -456px -142px;
    z-index: 10;
}

.m_allmenu_box {
    display: none !important
}

.m_allmenu_box>div {
    width: 85%;
    margin: 0 auto
}

.m_allmenu_box.open {
    display: block !important;
    position: fixed;
    top: 0px;
    left: 0;
    width: 100%;
    height: 100%;
    overflow-y: scroll;
    padding: 50px 0 0;
    background: #fff;
    z-index: 100
}

.m_allmenu_box .btn_close {
    position: absolute;
    top: 20px;
    right: 30px;
    width: 30px;
    height: 30px;
    font-size: 0;
    cursor: pointer;
    background: #fff
}

.m_allmenu_box .btn_close:before {
    content: "";
    position: absolute;
    bottom: -13px;
    left: 0;
    width: 30px;
    height: 3px;
    background: #333;
    z-index: 5
}

.m_allmenu_box .btn_close:after {
    top: 0;
    left: 0;
    width: 30px;
    height: 30px;
    background-position: -59px -70px;
    z-index: 10
}

.m_allmenu_box .mypage_infoarea {
    margin-top: 30px;
    margin-bottom: 30px;
    height: 55px
}

.m_allmenu_box .mypage_infoarea {
    margin-top: 30px;
    margin-bottom: 30px;
    height: 55px
}

.m_allmenu_box .mypage_infoarea>.login_before,
.m_allmenu_box .mypage_infoarea>.login_after {
    line-height: 55px
}

.m_allmenu_box .mypage_infoarea>.login_before span,
.m_allmenu_box .mypage_infoarea>.login_after span {
    position: relative;
    padding: 0 0 0 60px;
    font-size: 1.1em;
    font-weight: 600
}

.m_allmenu_box .mypage_infoarea>.login_before span:before {
    content: "";
    position: absolute;
    top: -14px;
    left: 0;
    width: 52px;
    height: 52px;
    background-position: -212px -59px
}

.m_allmenu_box .mypage_infoarea>.login_before span:after {
    content: "";
    position: absolute;
    top: 3px;
    right: -17px;
    width: 10px;
    height: 18px;
    background-position: -428px -76px
}

/* 로그인했을때 */
.m_allmenu_box .mypage_infoarea>.login_after:after {
    content: "";
    display: block;
    clear: both
}

.m_allmenu_box .mypage_infoarea>.login_after>a:first-child {
    float: left;
    height: 55px;
    line-height: 55px
}

.m_allmenu_box .mypage_infoarea>.login_after span em {
    color: #e60012;
    font-weight: 600
}

.m_allmenu_box .mypage_infoarea>.login_after .logoutwant {
    float: right;
    height: 55px;
    line-height: 55px;
    padding: 0 40px 0 0;
    color: #888
}

.m_allmenu_box .mypage_infoarea>.login_after .logoutwant:after {
    content: "";
    position: absolute;
    top: 11px;
    right: 0px;
    width: 32px;
    height: 33px;
    background-position: -162px -69px
}

.m_allmenu_box .mypage_infoarea>.login_after span:before {
    content: "";
    position: absolute;
    top: -14px;
    left: 0;
    width: 52px;
    height: 52px;
    background-position: -359px -59px
}

/* e뉴스플러스/스냅타임/기자뉴스룸 */
.second_content {
    margin: 0 0 50px 0
}

.second_content:after {
    content: "";
    display: block;
    clear: both
}

.second_content ul li {
    position: relative;
    float: left;
    width: 25%
}

.second_content ul li:first-child:after,
.second_content ul li:nth-child(2):after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 1px;
    height: 100%;
    background: #fff
}

.second_content ul li a {
    display: inline-block;
    width: 100%;
    height: 84px;
    line-height: 84px;
    color: #fff;
    font-weight: 600;
    font-size: 1.1em;
    text-align: center;
    background: #333
}

/* 전체메뉴 */
.m_allmenulist {
    width: 100% !important
}

.m_allmenulist:after {
    content: "";
    display: block;
    clear: both
}

.m_allmenulist ul {
    display: inline-block;
    padding: 30px 0
}

.m_allmenulist ul li {
    float: left;
    width: 33.3%
}

.m_allmenulist ul li a {
    display: inline-block;
    width: 100%;
    height: 85px;
    line-height: 85px;
    text-align: center;
    font-size: 1.4em;
    font-weight: 600
}

/*--------------------------------------------------------------------------------------------------------------------------------------------------
                                                                        FOOTER
------------------------------------------------------------------------------------------------------------------------------------------------------*/
.foot_mn {
    background: #222222
}

.foot_mn:after {
    content: "";
    clear: both;
    display: block
}

.foot_mn li {
    float: left;
    width: 25%;
    text-align: center
}

.foot_mn li a {
    display: block;
    color: #bbbbbb;
    padding: 15px 0;
    position: relative;
    font-size: 14px
}

.foot_mn li a:before {
    content: "";
    width: 1px;
    height: 15px;
    background: #000000;
    position: absolute;
    left: 0;
    top: 50%;
    margin-top: -8px;
    display: block
}

.foot_mn li:first-child a:before {
    width: 0;
    height: 0
}

#footer {
    max-width: 640px;
    margin: 0 auto;
    -webkit-text-size-adjust: none;
    background: #fff;
}

#footer .copy {
    text-align: center;
    color: #999999;
    font-size: 0.8em;
    padding: 15px 0
}

#footer .copy a {
    color: #999999;
    font-size: 13px
}

/* 모바일 서비스 */
.svc_list:after {
    content: "";
    clear: both;
    display: block
}

.svc_list li {
    text-align: center;
    float: left;
    width: 25%
}

.svc_list li a {
    display: block;
    color: #999999;
    font-size: 0.875rem
}

.svc_list li a:before {
    content: "";
    display: block;
    width: 70px;
    height: 70px;
    margin: 0 auto 5px;
    background: url("https://image.edaily.co.kr/images/mobile/new_ico_edaily.png") no-repeat;
    background-size: 500px auto
}

.svc_list li a.bold {
    font-weight: bold
}

.svc_list li.news a:before {
    background-position: -5px -313px
}

.svc_list li.mvp a:before {
    background-position: -80px -313px
}

.svc_list li.stock a:before {
    background-position: -155px -313px
}

.svc_list li.air a:before {
    background-position: -229px -313px
}

/* 이데일리SNS */
.sns_list:after {
    content: "";
    clear: both;
    display: block
}

.sns_list li {
    text-align: center;
    float: left;
    width: 20%
}

.sns_list li a {
    display: block;
    color: #999999;
    font-size: 0.875rem
}

.sns_list li a:before {
    content: "";
    display: block;
    width: 60px;
    height: 60px;
    margin: 0 auto 5px;
    background: url("https://image.edaily.co.kr/images/mobile/new_ico_edaily.png") no-repeat;
    background-size: 500px auto
}

.sns_list li.fb a:before {
    background-position: -5px -183px
}

.sns_list li.tw a:before {
    background-position: -70px -183px
}

.sns_list li.ig a:before {
    background-position: -135px -183px
}

.sns_list li.yt a:before {
    background-position: -200px -183px
}

.sns_list li.post a:before {
    background-position: -265px -183px
}

.sns_list li.rss a:before {
    background-position: -330px -183px
}

/* 공지사항 */
.txt_list li {
    margin-top: 2px
}

.txt_list li:first-child {
    margin-top: 0
}

.txt_list li a {
    display: block;
    color: #fff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    position: relative;
    padding: 5px 10px
}

.txt_list li a:before {
    content: "";
    width: 5px;
    height: 1px;
    background: #e60012;
    display: inline-block;
    vertical-align: middle;
    margin-right: 5px;
    position: absolute;
    left: 0;
    top: 50%
}

/* fullscreen */
#allmenu_layer {
    width: 80%;
    height: 100%;
    background: #fff
}

.allmenu_box {
    position: relative;
    z-index: 999
}

.allmenu_box .allmenu_header {
    padding: 20px 15px 20px 20px
}

.allmenu_box .allmenu_header:after,
.allmenu_header:after,
.allmenu_searchbox:after,
.go_apply:after,
.ico_sns:after {
    content: "";
    display: block;
    clear: both
}

.allmenu_header .h2_logo {
    float: left;
    background: url("https://image.edaily.co.kr/images/mobile/h1_logo.png") 0 0 no-repeat;
    background-size: 84px 19px;
    background-position: 5px 5px;
    font-size: 0;
    width: 94px;
    height: 29px
}

/*login_logout */
.allmenu_header .login {
    float: right
}

.allmenu_header i.login {
    display: inline-block;
    width: 26px;
    height: 29px;
    font-size: 0;
    background-position: -310px -5px
}

.allmenu_header .logout {
    float: right
}

.allmenu_header i.logout {
    display: inline-block;
    width: 29px;
    height: 29px;
    font-size: 0;
    background-position: -276px -5px;
}

.allmenu_header .mypage {
    float: right;
    /*margin-right:10px*/
}

.allmenu_header i.mypage {
    display: inline-block;
    width: 30px;
    height: 29px;
    font-size: 0;
    background-position: -174px -5px
}

.allmenu_header .setup {
    float: right;
    margin-left: 7px
}

.allmenu_header i.setup {
    display: inline-block;
    width: 29px;
    height: 29px;
    font-size: 0;
    background-position: -209px -5px
}

.allmenu_searchbox {
    float: left;
    width: 100%;
    height: 50px;
    padding: 15px 0 0 20px;
    background: #333
}

.allmenu_searchbox .allmenu_search {
    float: left;
    width: 80%;
    font-size: 0.9rem;
    text-indent: 0.625rem;
    color: #fff;
}

::placeholder {
    color: #fff;
    opacity: 1;
}

:-ms-input-placeholder {
    color: #fff
}

::-ms-input-placeholder {
    color: #fff
}

.allmenu_searchbox label[for="search"] {
    position: relative;
    float: left;
    width: 20%
}

.allmenu_searchbox label[for="search"]:before {
    content: "";
    position: absolute;
    top: -15px;
    left: 0;
    height: 50px;
    width: 1px;
    background: #000
}

.allmenu_searchbox label[for="search"] span {
    position: relative;
    top: -5px;
    display: inline-block;
    width: 29px;
    height: 29px;
    text-indent: -99999px;
    background-position: -140px -5px
}

.allmenu_list {
    width: 100%;
    text-align: left
}

.allmenu_list dl {
    float: left;
    width: 100%;
    padding: 0 20px
}

.allmenu_list dl dt {
    width: 100%;
    font-weight: bold;
    color: #e60012
}

.allmenu_list dl dd {
    float: left;
    width: 50%;
    margin-top: 20px
}

.allmenu_list dl dd a {
    font-size: 1rem
}

.allmenu_list dl dd i {
    position: relative;
    top: -2px;
    font-size: 11px;
    color: #999
}

#allmenu_layer .btn_close {
    position: absolute;
    top: 0px;
    right: -50px;
    width: 51px !important;
    height: 65px !important;
    font-size: 0;
    background: url('https://image.edaily.co.kr/images/content/default_icon.png') no-repeat;
    background-position: -400px -240px;
    z-index: 999999
}

.go_apply {
    float: left;
    display: table;
    width: 100%;
    height: 50px;
    padding: 0 20px;
    margin-top: 40px;
    background: #f5f5f5
}

.go_apply ul {
    display: table-cell;
    height: 50px;
    vertical-align: middle
}

.go_apply ul li {
    float: left;
    width: 33.3%
}

.go_apply ul li a {
    font-size: 1rem;
    font-weight: bold
}


/* SNS */
.footer_snslinkarea{
    display:flex;
    flex-direction:column;
    row-gap:30px;
    align-items:center;
    padding:10% 20px
}
.footer_snslinkarea > p{
    font-size:3.5rem;
    text-align:center;
}
.snsboxareanew{
    width:calc(100% - 15%);
    display:flex;
    column-gap:10px;
    justify-content: center;
}
.snsboxareanew > a{
    position:relative;
    font-size: 0;
    width:50px;
}
.snsboxareanew > a::after{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:50px;
    height:50px;
}
.f_youtube::after{
    background:url('https://image.edaily.co.kr/images/region_vote22/f_youtube.svg') no-repeat
}
.f_facebook::after{
    background:url('https://image.edaily.co.kr/images/region_vote22/f_facebook.svg') no-repeat
}
.f_twitter::after{
    background:url('https://image.edaily.co.kr/images/region_vote22/f_twitter.svg') no-repeat
}
.f_instagram::after{
    background:url('https://image.edaily.co.kr/images/region_vote22/f_instagram.svg') no-repeat
}
.f_naver::after{
    background:url('https://image.edaily.co.kr/images/region_vote22/f_naver.svg') no-repeat
}
/* 지면보기 */
.m_goapply {
    width: 100% !important;
}

.m_goapply:after {
    content: "";
    display: block;
    clear: both
}


.m_goapply ul li {
    float: left;
    width: 25%;
}

.m_goapply ul li a {
    display: inline-block;
    width: 100%;
    height: 80px;
    line-height: 80px;
    text-align: center;
    background: #d6d6d6
}

.m_goapply ul li span {
    position: relative;
    display: inline-block;
    width: 100%;
    font-weight: 600;
}

.m_goapply ul li span:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 1px;
    height: 100%;
    background: #959595
}

.m_goapply ul li:last-child span:after {
    content: "";
    display: none
}




/*------------------------------------------------------------------------------
                                        VISUALTOP
-------------------------------------------------------------------------------*/
.whitebox {
    padding: 75px 20px;
}
.graysbox {
    padding: 75px 20px;
    background: #f5f5f5
}
.blackbox {
    padding: 75px 20px;
    background: #333
}

/********** 주요 뉴스 **********/
.title_blackbox {
    top: -36px;
    position: relative;
    margin: 0 auto;
    padding: 1rem;
    color: #fff;
    font-size: 2rem;
    text-align: center;
    background: #333;
    border-radius: 100px;
    width: 35%;
}

.picknews {
    width: 100%;
    margin-top: 7rem;
    padding-bottom: 5.4rem;
    background: #fff;
}

.pick_top dl dt {
    overflow: hidden;
    width: 100%;
    height: 342px;
}

.pick_top dt img {
    width: 100%;
}

.pick_top dl dd {
    padding: 2rem 1.3rem 7rem 1.3rem;
    font-size: 2.8rem;
    font-weight: 500;
    line-height: 3.4rem;
    letter-spacing: -1.7px;
}

.pick_wrap {
    width: 105%;
    margin-left: -17px;
}

.pick_list {
    margin-top: -30px;
    margin-bottom: 30px;
}

.pick_list:after {
    content: "";
    display: block;
    clear: both;
}

.pick_list a {
    float: left;
    width: 46.2%;
    margin-top: 23px;
    display: -webkit-box;
    margin-left: 17px;
    box-sizing: border-box;
}

.pick_list a>dl>dt {
    width: 100%;
    height: 178px;
}

.pick_list a>dl>dt img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pick_list a>dl>dd {
    font-size: 1.9rem;
    font-weight: 400;
    height: 52px;
    margin: 10px;
    display: -webkit-box;
    word-wrap: break-word;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    text-overflow: ellipsis;
    line-height: 2.5rem;
    overflow: hidden;
}

/* 2024 주요뉴스 */
.mainnews_mainthumb {
    display: flex;
    flex-direction: column;
    align-items: center;
    row-gap: 30px;
}

.mainnews_mainthumb>p {
    padding: 0 20px;
    font-size: 2.9rem;
    text-align: center;
}

.mainnews_mainthumb>p>span {
    font-weight: 600;
}

.mainnews_mainthumb img {
    aspect-ratio: 9/5;
}

.twice_thumb {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 20px;
    margin-top: 60px
}

.twice_thumb .mainnews_mainthumb {
    row-gap: 20px;
}

.twice_thumb .mainnews_mainthumb>p {
    font-size: 2.5rem;
}

.twice_thumb .mainnews_mainthumb>p>span {
    font-weight: 400;
}

/*  더보기 */
.btn_moreview {
    width: 100%;
    text-align: center;
    background: #333
}

.btn_moreview a {
    width: 100%;
    color: #fff;
    display: inline-block;
    padding: 2rem 0;
    font-size: 2.4rem
}

h2.title {

    font-size: 3rem;
    text-align: center;
    margin-top: 6rem;
}

.listthumb {
    display: flex;
    flex-direction: column;
    line-height: 21px;
    margin-top:50px;
}

.listthumb>* {
    border-top: 1px solid #ececec;
    padding: 30px 10px;
}

.listthumb>*:nth-child(even) {
    background: #f8f8f8
}

.listthumb>*:last-child {
    padding-bottom: 0
}

.listthumb>a:hover {
    background: linear-gradient(90deg, rgba(248, 248, 248, 1) 0%, rgba(238, 238, 238, 1) 50%, rgba(248, 248, 248, 1) 100%);
}

.listthumb p {
    font-size: 2rem;
    line-height: 2.8rem
}

.ico_picknews{
    position: absolute;
    top:-16px;
    left:50%;
    -webkit-transform:translateX(-50%);
            transform:translateX(-50%);
    display:inline-block;
    height:30px;
    line-height:30px;
    padding:0 20px;
    color:#fff;
    font-size:15px;
    letter-spacing: 0;
    border-radius:50px;
    background:#333;
    z-index:10
}


/********** 지금여론은 *********/
.ballot_date {
    float: right;
    /* text-align:right;*/
    font-size: .9rem;
    position: relative;
    color: #999;
    /* display:inline-block;*/
    bottom: -20px;
    right: 5%;
}

.now_opinion {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding: 1rem 0 2rem 0;
    margin-top: 50px;
    background: #2e1a5d;
}

.opinion {
    width: 100%;
    margin-top: 30px
}

.opinion>ul>li {
    width: 100%;
}

.opinion>ul>li:after {
    content: "";
    display: block;
    clear: both
}

.opinion .picture {
    top: 0;
    left: 0
}

.opinion .picture img {
    width: 200px
}

.opinion .seoul_gukmin {
    margin-top: -30px;
}

.opinion .busan_gukmin {
    margin-top: -25px;
}

.opinion .left_info {
    top: 10%;
    left: 10%;
}

.opinion .seoul_gukmin>.picture {
    margin-top: 0;
    right: 0;
}

.opinion .busan_gukmin>.picture {
    margin-top: 0;
    left: unset;
    right: 10%
}

.opinion .seoul_minju .right_info {
    top: -5%
}

.seoul_minju .right_info {
    top: 10%
}

.busan_minju .right_info {
    top: -2%;
    right: 10%;
}

.opnion_tab {
    margin-top: 30px !important;
}

.opnion_tab>div {
    text-align: center;
    display: none;
    width: 100% !important;
    font-size: 3rem;
    color: #fff;
}

.opnion_tab>div.swiper-slide-thumb-active {
    display: block;
}

.now_opinion .swiper-button-next,
.now_opinion .swiper-button-prev {
    top: -8px;
    outline: none
}

.now_opinion .swiper-button-next.ballot,
.now_opinion .swiper-button-prev.ballot {
    top: 105px;
    outline: none
}

.now_opinion .swiper-container {
    overflow: unset
}

.now_opinion .picture {
    overflow: hidden;
    height: 250px;
}

.now_opinion .busan_gukmin .picture img {
    width: 200px
}

.opinion_vs {
    position: relative;
    width: 100%;
    color: #fff;
    font-size: 3.5rem;
    text-align: center;
    background: #1b0944;
}

.realmeter {
    text-align: center;
    color: #fff;
    font-size: 1.2rem;
    margin: 20px 0 20px 0;
    font-weight: 200
}

.pledge_boxarea {
    width: 100%
}

.swiper-pledge {
    margin-top: 0px;
}

.swiper-pledge .swiper-slide dl {
    width: 100%
}

.swiper-pledge .swiper-slide dl dt {
    overflow: hidden;
    height: 190px
}

.swiper-pledge .swiper-slide dl dt img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.swiper-pledge .swiper-slide dl dd {
    overflow: hidden;
    margin-top: 10px;
    padding: 0 1rem;
    display: -webkit-box;
    word-wrap: break-word;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    text-overflow: ellipsis;
    font-size: 1.5rem;
    color: #FFF;
    text-align: center;
}

.swiper-button-next,
.swiper-button-prev {
    top: 50%;
    width: 30px;
    height: 30px;
    margin-top: -40px;
    -moz-background-size: 100%;
    -webkit-background-size: 100%;
    background-size: 100%;
    outline: none;
}

.pledge_content .swiper-button-prev {
    background-image: url('https://image.edaily.co.kr/election/blaxk_arrow_right.png') !important;
    right: 10px !important;
    left: auto !important;
}

.pledge_content .swiper-button-next {
    background-image: url('https://image.edaily.co.kr/election/blaxk_arrow_left.png') !important;
    left: 10px !important;
    right: auto !important;
}

/***** 대선 톡톡 *****/
.graybox {
    background: #FFF;
}

.graybox h2.title {
    margin-top: 3rem
}

.malmalmal {
    margin-left: -3.6%;
}

.malmalmal:after {
    content: "";
    display: block;
    clear: both
}

.malmalmal>dl {
    overflow: hidden;
    float: left;
    width: 46.5%;
    margin-left: 3.5%;
    margin-bottom: 6%;
    background: #fff
}

.malmalmal dl dt {
    height: 256px
}

.malmalmal dl dt img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.malmalmal dl dd {
    margin-top: 15px;
    padding: 0 1rem;
    height: 84px;
    max-height: 84px;
    overflow: hidden;
}

.malmalmal dl dd>span {
    overflow: hidden;
    display: -webkit-box;
    word-wrap: break-word;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    text-overflow: ellipsis;
    font-size: 2.2rem;
    letter-spacing: -2px;
    line-height: 2.8rem;
}

/***** 공지사항 *****/
.notice_box {
    background: #fff;
    border-bottom: 1px solid #ddd;
}

.notice_box .m_notice {
    overflow: hidden;
    height: 55px;
}

.notice_box .m_notice .swiper-slide {
    overflow: hidden;
    width: 90%;
    padding: 0 5%
}

.notice_box .m_notice .swiper-slide>div {
    overflow: hidden;
    display: inline-block;
    width: 100%;
    height: 55px;
    line-height: 55px;
    white-space: nowrap;
    text-overflow: ellipsis
}

.notice_box .m_notice .swiper-slide>div span {
    width: 75px;
    margin: 0 10px 0 0;
    color: #e60012;
    font-weight: 600;
    font-size: 0.9em;
}

.sharptitle {
    position: relative;
    font-size: 2.8rem;
    font-weight: 600
}

.sharptitle::before {
    content: "#";
    display: inline-block;
    margin-right: 10px;
}
.base_listbox {
    display: flex;
    flex-direction: column;
    row-gap: 30px;
}
.base_list {
    display: grid;
    grid-template-columns: auto 170px;
    column-gap: 20px;
    align-items: center;
}
.base_list>img {
    aspect-ratio: 8/5;
}
.base_list>p {
    font-size: 2rem;
    line-height: 3rem;
}
.base_list {
    display: flex;
    column-gap: 20px;
    align-items: center;
}
.base_list>img {
    width:38%;
    aspect-ratio: 8/5;
}
.base_list>p {
    font-size: 2rem;
    line-height: 3rem;
}
.tab_contents .base_list>p {
    color: #fff;
    font-weight: 300
}
.reverse.base_list {
    display: flex;
    flex-direction: row-reverse;
}

/* 2024판세분석 */
.panse_tabs {
    overflow-x: scroll;
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    column-gap:10px;
    -ms-overflow-style: none;
    scrollbar-width: none;
}
.panse_tabs::-webkit-scrollbar {
    display: none;
    /* Chrome, Safari, Opera*/
}
.panse_tabs li {
    padding: 7px 25px;
    white-space: nowrap;
    font-size:1.8rem;
    border:1px solid #333;
    border-radius:50px

}
.panse_tabs li.active{
    background:#333
}
.panse_tabs li.active a{
    color:#fff;
}
.area_political{
    display:flex;
    flex-direction:column;
    row-gap:10px;
}
.area_political > *{
    display:flex;
    column-gap:5px
}
.area_political > * i{
    border-radius:50px;
    color:#fff;
    font-size: 1.3rem;
    font-weight:300;
    padding: 3px 12px 2px;
    background:#707070
}
.minju{background:#266be9!important}
.gukhim{background:#ff3747!important}
.independent{background:#9e42c9!important}

/*** 20240213 판세분석 슬라이드 추가 ***/
.btn_moreview{
    display:flex;
    width:150px;
    justify-content: center;
    align-items: center;
    height:45px;
    margin:40px auto 0 auto;
    border:1px solid #333;
    border-radius:50px;
    font-size:1.6rem;
    font-weight:500;
    background:#fff;
    
}





/* 여론으로 보는 민심 */
.line-article {
    width: 100%;
    height: 90px;
    margin-bottom: 30px;
}

.line-article a {
    float: left;
    width: 100%;
    height: 100%;
}

.line-tit {
    float: left;
    width: 60%;
    height: 58px;
    margin-top: 16px;
    overflow: hidden;
    line-height: 2.8rem;
    font-size: 2.2rem;
    letter-spacing: -1.5px;
}

.line-img {
    float: right;
    width: 30%;
    height: 90px;
    border: 1px solid #eeeeee;
}

.icon_dangseon {
    position: absolute;
    bottom: 35%;
    right: -10%;
    z-index: 200
}

.icon_dangseon>img {
    width: 70%
}

/* 메인 후보자 영역 */
.d-day-box {
    position: absolute;
    top: 165px;
    left: 43%;
    z-index: 99
}

.d-day-box span {
    color: #FFF;
    text-align: center;
    font-size: 2.4rem;
    margin: 0px 0 0 22px;
}

.d-day-box p {
    width: 90px;
    height: 34px;
    border-radius: 20px;
    background: #FFF;
    margin-top: -33px;
    text-align: center;
    opacity: 0.5;
}

.main-public1 {
    position: relative;
    margin: 0 auto;
    width: 100%;
    height: 440px;
    overflow: hidden;
    background-image: url(https://stage2.edaily.co.kr/Publishing/election22/img/main_bg.png);
    background-size: 100% 100%;
}

.main-public2 {
    position: relative;
    margin: 0 auto;
    width: 100%;
    height: 440px;
    overflow: hidden;
    background-image: url(https://stage2.edaily.co.kr/Publishing/election22/img/main_bg2.png);
    background-size: 100% 100%;
}

.public-wrap {
    position: relative;
    width: 100%;
}

.public-l {
    float: left;
    width: 45%;
    height: 230px;
    margin-top: 90px;
    margin-left: 10px;
}

.public-l .public-img {
    width: 100%;
}

.public-l .public-img img {
    width: 100% !important;
}

.public-l p.info-sec {
    width: 100%;
    height: 40px;
    text-align: center;
    color: #FFF;
    margin-top: 3px;
    margin-bottom: 4px;
    font-weight: 300;
    font-size: 3rem;
}

.public-r {
    float: right;
    width: 45%;
    height: 230px;
    margin-top: 90px;
    margin-right: 10px;
}

.public-r .public-img {
    width: 100%;
}

.public-r .public-img img {
    width: 100% !important;
}

.public-r p.info-sec {
    width: 100%;
    height: 40px;
    text-align: center;
    color: #FFF;
    margin-top: 3px;
    margin-bottom: 4px;
    font-weight: 300;
    font-size: 3rem;
}

.click-option {
    width: 100%;
    height: 20px;
    text-align: center;
    font-size: 1.3rem;
}

.click-option a {
    color: #FFF;
    line-height: 12px;
}

.click-option a span {
    margin-left: 5px;
}


.slideshow-container {
    max-width: 100%;
    position: relative;
    margin: auto;
    overflow: hidden;
}

.fade {
    -webkit-animation-name: fade;
    -webkit-animation-duration: 1.5s;
    animation-name: fade;
    animation-duration: 1.5s;
}

@-webkit-keyframes fade {
    from {
        opacity: .4
    }

    to {
        opacity: 1
    }
}

@keyframes fade {
    from {
        opacity: .4
    }

    to {
        opacity: 1
    }

}

/*
.prev, .next{cursor:pointer;position:absolute;top:50%;	 width:auto;padding:16px;margin-top:-22px;color:white;font-weight:bold;font-size:18px;transition:0.6s ease;border-radius:0 3px 3px 0;}
.next{right:0;border-radius:3px 0 0 3px;}
.prev:hover, .next:hover{background-color:rgba(0,0,0,0.8);}
*/

/* 메인 네비메뉴 */
nav {
    position: relative;
    width: 100%;
    height: 70px;
    background: #333;
    margin: 0;
    padding: 0;
    text-align: center;
    overflow-x: scroll;
    white-space: nowrap;
}
nav.fixed-header {
    position:fixed;
    top:0;
    left:0;
    height:50px;
    border-bottom:1px solid #000;
    z-index:15;
    /* overflow:hidden; */
}
nav.fixed-header a {
    line-height:50px;
    font-size: 1.8rem;
}

nav::-webkit-scrollbar {
    display: none;
    /* Chrome, Safari, Opera*/
}

nav a {
    position: relative;
    display: inline-block;
    
    line-height: 70px;
    box-sizing: border-box;
    font-size: 2rem;
    color: #FFF !important;
    /* letter-spacing: -1.5px; */
    text-decoration: none;
    padding:0 10px;
}

nav a:last-child {   /* 240221_DH 수정 */
    margin-right: 20px;
    /* margin-right: 90px; */
    margin-left: 20px;
    /* color:#999!important */
}

nav #underline {
    position: absolute;
    left: 0;
    height: 2.5px;
    width: 0;
    background: #FFF;
    bottom: 19px;
    transition: 0.2s;
}
nav.fixed-header #underline {
    bottom:8px;
    height: 1px;
    
}

/* 메인- 타이틀 */
.main-tit {
    width: 100%;
    text-align: center;
    font-size: 4.5rem;
    font-weight: 300;
    margin-bottom:40px
}
.attentions .main-tit {
    margin-bottom:0px
}
.main-tit.bottomline{
    padding-bottom:40px;
    border-bottom:1px solid #333
}
.main-tit span {
    font-weight: 500;
}

/* 키워드 */
.keyword-box {
    width: 100%;
    margin-bottom: -32px;
    font-weight: 500;
    font-size: 2.8rem;
    letter-spacing: -1.5px;
}

.keyword-word {
    float: left;
    margin-right: 6px;
    color: #6c70ba;
    font-weight: 600;
}


/* 여론으로 보는 민심 */
.line-article {
    width: 100%;
    height: 90px;
    margin-bottom: 34px;
}

.line-article a {
    float: left;
    width: 100%;
    height: 100%;
}

.line-tit {
    float: left;
    width: 61%;
    height: 58px;
    margin-top: 16px;
    overflow: hidden;
    line-height: 3rem;
    font-size: 2.2rem;
    letter-spacing: -1.5px;
}

.line-img {
    float: right;
    width: 30%;
    height: 90x;
    border: 1px solid #eeeeee;
}

/* 공약 배틀 */
.battle_area {
    overflow: hidden;
    width: 100%;
    padding:75px 0;
    border-bottom: 15px solid #f5f5f5;
    background: #000;
}
.rainbowtitle{
    font-size:4.5rem;
    text-align:center;
    margin-bottom:30px;
    background: linear-gradient(133deg, rgba(255,43,76,1) 40%, rgba(125,91,171,1) 50%, rgba(57,115,222,1) 55%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
.battle_area .swiper {
    float: left;
    width: 100%;
    height: 248px;
}

.battle_area .swiper-slide {
    width: 49% !important;
    margin-right: 6.5px !important;
    margin-left: 6.5px !important;
    text-align: center;
    font-size: 18px;
    float: left;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

.battle_area .swiper-slide img {
    float: left;
    display: block;
    width: 100%;
    height: 180px;
    object-fit: cover;
}

.battle_area .swiper-slide img img {
    float: left;
}

.post {
    float: left;
    position: relative;
}

.battle_area .swiper-wrapper {
    float: left;
    margin-left: -150px;
}

.post-slider .post-wrapper {
    height: 156px;
}

.post-info {
    float: left;
    height: 66px;
    margin-top: 12px;
    overflow: hidden;
    padding: 0 10px;
    color: #fff;
    text-align: left;
}

.post-info h4 {
    line-height: 20px;
}

.post-info h4 a {
    color: #FFF;
    font-size: 2.2rem;
    line-height: 28px;
}

.post-slider .post-wrapper .post .slider-image {
    width: 100%;
    height: 96px;
}



/* 대선 일정 */
.schedule-box {
    display:flex;
    justify-content: space-between;
    align-items:center;
    border-bottom:3px dashed #ddd;
    padding:10px 20px;
}
.schedule-box > img{
    width:auto;
    max-height:120px;
}

.schedule-box:last-child {
    border-bottom: none;
}

.schedule-l {
    display:flex;
    flex-direction:column;
    row-gap:5px;
    letter-spacing: -1.5px;
}
.schedule-l > *:first-child{
    font-size:2.4rem;
    font-weight: 800;
}
.schedule-l > *:last-child{
    font-size:2.2rem;
    color:#999;
    font-weight: 400;
}

.bannersarea{
    display:flex;
    flex-direction:column;
    row-gap:15px;
    align-items:center;
}
.bannersarea > a{
    width:100%;
}
.bannersarea img{
    display:flex;
    margin:0 auto;
    max-width:360px;
}



/* 섹션 라인 */
.center_line1 {
    width: 100%;
    height: 13px;
    background: #f5f5f5;
}

.center_line2 {
    width: 100%;
    height: 27px;
    margin-bottom: 6px;
    background: #f5f5f5;
}

.center_line3 {
    width: 100%;
    height: 13px;
    margin-bottom: 55px;
    margin-top: 83px;
    background: #f5f5f5;
}

.center_line4 {
    width: 100%;
    height: 13px;
    margin-bottom: -13px;
    margin-top: 0px;
    background: #f5f5f5;
}

.backbg_gray {
    background: #333 !important;
}

.cor_white {
    color: #FFF !important;
}

/*------------------------------------------------------------------------------
                                        개표현황
-------------------------------------------------------------------------------*/
.text_white,
.text_white>span {
    color: #fff
}

.text_center {
    text-align: center
}

.float_right {
    float: right
}

.clear::after {
    content: "";
    display: block;
    clear: both
}

/* 상단 */
.topbar {
    position: relative;
    width: 100%;
    margin: 0;
    /* padding: 5% 0;*/
    text-align: center;
    /*background: linear-gradient(to right, #1c4fcd, #fb1b56);*/
}

.topbar img {
    width: 100%;
}

.color_bg {
    background: linear-gradient(to top, #1c4fcd, #fb1b56, #1c4fcd);
}

.text_white {
    color: #fff
}

/* 선거 D-DAY */
.d_day_box {
    position: absolute;
    right: 15px;
    top: 24px;
    font-size: 10px;
    z-index: 1;
}

.d_day_box span {
    color: #FFF;
}

.day_in {
    width: 72px;
    height: 20px;
    margin-top: 15px;
    margin-bottom: 4px;
    margin-left: 47px;
}

.day_in li {
    float: left;
    width: 20px;
    height: 20px;
    margin-left: 2px;
    text-align: center;
    line-height: 20px;
    font-size: 14px;
    font-weight: 500;
    background: #FFF;
    color: #000;
}

.day_in li:first-of-type {
    background: #000;
    color: #FFF;
    margin-left: 0;
}

.day_in li:nth-child(2) {
    width: 6px;
    margin-left: 0;
    color: #fff;
    background: none;
}

/* 개표 1~2위 */
.y_title {
    padding: 5% 0 0 0;
    text-align: center;
    font-size: 4.2rem;
    font-weight: 300
}

.y_title>span {
    font-weight: 500
}

.counting_percent {
    margin: 2% 0 0 0;
    font-size: 2.5rem;
    text-align: center;
    line-height: 1.8rem
}

.counting_percent>span {
    font-size: 1.1rem;
}

.candidate_info {
    position: relative;
    margin: 6% 0 0 0;
    padding: 0 5%;
    z-index: 0;
}

.candidate_info::after {
    content: "";
    display: block;
    clear: both
}

.candidate_info>figure {
    position: relative;
    width: 52%;
    z-index: 0
}

.candidate_info.red>figure {
    width: 48%;
}

.candidate_info.second>figure {
    float: right
}

.candidate_info::before {
    content: "";
    position: absolute;
    bottom: 10px;
    right: 0;
    width: 55%;
    height: 50px;
    z-index: -1
}

/* 당선 마크 */
.mark_possib {
    position: absolute;
    top: 0;
    left: 13%;
    width: 60px;
    height: 60px;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: 0 100%;
    -moz-transform-origin: 0 100%;
    -ms-transform-origin: 0 100%;
    -o-transform-origin: 0 100%;
    transform-origin: 0 100%;
    border: 1px solid #fff;
    background: rgba(256, 2562, 256, .1);
    z-index: 999
}

.mark_possib::after {
    content: "유력";
    position: absolute;
    width: 100%;
    text-align: center;
    line-height: 60px;
    color: #fff;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}

.mark_elected {
    position: absolute;
    top: -15%;
    left: 5%;
    width: 80px;
    height: 118px;
    background: url('https://image.edaily.co.kr/images/election/mark_elected.png')no-repeat;
    background-size: cover;
    z-index: 999
}




/* 더불어민주당  */
.candidate_info.db::before {
    left: 45%;
    width: 55%;
    background: linear-gradient(to right, #004ea2, rgb(0 0 0 / 0%));
}

.candidate_info.second.db::before {
    left: unset;
    right: 45%;
    width: 55%;
    background: linear-gradient(to left, #004ea2, rgb(0 0 0 / 0%));
}

.candidate_sbox.db .bar,
.admin_info .db {
    background: #004ea2;
}

.admin_number .db {
    color: #004ea2
}

/* 국민의힘 */
.candidate_info.gmr::before {
    left: 45%;
    width: 55%;
    background: linear-gradient(to right, #e61e2b, rgb(0 0 0 / 0%));
}

.candidate_info.second.gmr::before {
    left: unset;
    right: 45%;
    width: 55%;
    background: linear-gradient(to left, #e61e2b, rgb(0 0 0 / 0%));
}

.candidate_sbox.gmr .bar,
.admin_info .gmr {
    background: #e61e2b;
}

.admin_number .gmr {
    color: #e61e2b
}

/* 정의당 */
.candidate_info.jd::before {
    left: 45%;
    width: 55%;
    background: linear-gradient(to right, #ffcc00, rgb(0 0 0 / 0%));
}

.candidate_info.second.jd::before {
    left: unset;
    right: 45%;
    width: 55%;
    background: linear-gradient(to left, #ffcc00, rgb(0 0 0 / 0%));
}

.candidate_sbox.jd .bar,
.admin_info .jd {
    background: #ffcc00;
}

.admin_number .jd {
    color: #ffcc00
}

/* 국민의당 */
.candidate_info.gmo::before {
    left: 45%;
    width: 55%;
    background: linear-gradient(to right, #ea5504, rgb(0 0 0 / 0%));
}

.candidate_info.second.gmo::before {
    left: unset;
    right: 45%;
    width: 55%;
    background: linear-gradient(to left, #ea5504, rgb(0 0 0 / 0%));
}

.candidate_sbox.gmo .bar,
.admin_info .gmo {
    background: #ea5504;
}

.admin_number .gmo {
    color: #ea5504
}

/* 기본소득당 */
.candidate_info.gb::before {
    left: 45%;
    width: 55%;
    background: linear-gradient(to right, #00b1a0, rgb(0 0 0 / 0%));
}

.candidate_info.second.gb::before {
    left: unset;
    right: 45%;
    width: 55%;
    background: linear-gradient(to left, #00b1a0, rgb(0 0 0 / 0%));
}

.candidate_sbox.gb .bar,
.admin_info .gb {
    background: #00b1a0;
}

.admin_number .gb {
    color: #00b1a0
}

/* 국가혁명당 */
.candidate_info.gg::before {
    left: 45%;
    width: 55%;
    background: linear-gradient(to right, #e7141a, rgb(0 0 0 / 0%));
}

.candidate_info.second.gg::before {
    left: unset;
    right: 45%;
    width: 55%;
    background: linear-gradient(to left, #e7141a, rgb(0 0 0 / 0%));
}

.candidate_sbox.gg .bar,
.admin_info .gg {
    background: #e7141a;
}

.admin_number .gg {
    color: #e7141a
}

/* 노동당 */
.candidate_info.nd::before {
    left: 45%;
    width: 55%;
    background: linear-gradient(to right, #ff0000, rgb(0 0 0 / 0%));
}

.candidate_info.second.nd::before {
    left: unset;
    right: 45%;
    width: 55%;
    background: linear-gradient(to left, #ff0000, rgb(0 0 0 / 0%));
}

.candidate_sbox.nd .bar,
.admin_info .nd {
    background: #ff0000;
}

.admin_number .nd {
    color: #ff0000
}

/* 새누리당 */
.candidate_info.sn::before {
    left: 45%;
    width: 55%;
    background: linear-gradient(to right, #d91e48, rgb(0 0 0 / 0%));
}

.candidate_info.sn::before {
    left: unset;
    right: 45%;
    width: 55%;
    background: linear-gradient(to left, #d91e48, rgb(0 0 0 / 0%));
}

.candidate_sbox.sn .bar,
.admin_info .sn {
    background: #d91e48;
}

.admin_number .sn {
    color: #d91e48
}

/* 신자유민주연합 */
.candidate_info.sj::before {
    left: 45%;
    width: 55%;
    background: linear-gradient(to right, #ad469f, rgb(0 0 0 / 0%));
}

.candidate_info.second.sj::before {
    left: unset;
    right: 45%;
    width: 55%;
    background: linear-gradient(to left, #ad469f, rgb(0 0 0 / 0%));
}

.candidate_sbox.sj .bar,
.admin_info .sj {
    background: #ad469f;
}

.admin_number .sj {
    color: #ad469f
}

/* 우리공화당 */
.candidate_info.uri::before {
    left: 45%;
    width: 55%;
    background: linear-gradient(to right, #009944, rgb(0 0 0 / 0%));
}

.candidate_info.second.uri::before {
    left: unset;
    right: 45%;
    width: 55%;
    background: linear-gradient(to left, #009944, rgb(0 0 0 / 0%));
}

.candidate_sbox.uri .bar,
.admin_info .uri {
    background: #009944;
}

.admin_number .uri {
    color: #009944
}

/* 진보당 */
.candidate_info.jb::before {
    left: 45%;
    width: 55%;
    background: linear-gradient(to right, #d6001c, rgb(0 0 0 / 0%));
}

.candidate_info.second.jb::before {
    left: unset;
    right: 45%;
    width: 55%;
    background: linear-gradient(to left, #cb0423, rgb(0 0 0 / 0%));
}

.candidate_sbox.jb .bar,
.admin_info .jb {
    background: #cb0423;
}

.admin_number .jb {
    color: #cb0423
}

/* 통일한국당 */
.candidate_info.til::before {
    left: 45%;
    width: 55%;
    background: linear-gradient(to right, #003793, rgb(0 0 0 / 0%));
}

.candidate_info.second.til::before {
    left: unset;
    right: 45%;
    width: 55%;
    background: linear-gradient(to left, #003793, rgb(0 0 0 / 0%));
}

.candidate_sbox.til .bar,
.admin_info .til {
    background: #003793;
}

.admin_number .til {
    color: #003793
}

/* 한류연합당 */
.candidate_info.hd::before {
    left: 45%;
    width: 55%;
    background: linear-gradient(to right, #733a87, rgb(0 0 0 / 0%));
}

.candidate_info.second.hd::before {
    left: unset;
    right: 45%;
    width: 55%;
    background: linear-gradient(to left, #733a87, rgb(0 0 0 / 0%));
}

.candidate_sbox.hd .bar,
.admin_info .hd {
    background: #733a87;
}

.admin_number .hd {
    color: #733a87
}

.candidate_info figure>img {
    width: 100%
}

.candidate_info figcaption {
    position: absolute;
    bottom: 22px;
    left: 55%;
    width: 100%;
}

.candidate_info.second figcaption {
    width: 50%;
    left: unset;
    right: 40%;
}

.candidate_info figcaption p {
    margin: 3% 0 0 0;
    color: #fff;
    font-size: 6.5rem;
}

.candidate_info figcaption p:first-child {
    width: 100%;
    margin: 0 0 -5% 0;
    font-size: 4.5rem;
}

.candidate_info figcaption p:first-child>span {
    position: relative;
    top: -30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100px;
    height: 100px;
    margin: 0 10px 0 0;
    border-radius: 100%;
    background: #fff;
    zoom: 0.4
}

.candidate_info figcaption p:last-child {
    padding: 0 0 0 1.5%;
    position: relative;
    font-size: 2.5rem;
    font-weight: 300;
}

/* 개표 3~5위 */
.candidate_sbox {
    display: inline-flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    width: 90%;
    height: 90px;
    margin: 5% 5% 0 5%;
    background: rgba(256, 256, 256, .1)
}

.candidate_name,
.candidate_count {
    position: relative;
    z-index: 1
}

.candidate_name {
    position: relative;
    display: flex;
    align-items: center;
    flex-grow: 3;
}

.candidate_name>figure {
    position: relative;
    left: -10px;
    bottom: 15px;
    width: 120px;
}

.candidate_name>figure>img {
    width: 100%;
    object-fit: cover;
}

.candidate_name>figcaption {
    margin: 0 0 0 8%;
}

.candidate_name>figcaption>p {
    position: relative;
    padding: 0 0 0 10px;
    font-size: 2.8rem;
    color: #fff;
}

.candidate_sbox.third figcaption>p:nth-of-type(1)::after {
    content: "3위";
    position: absolute;
    top: 0;
    left: -20px;
    font-size: 1.6rem;
    font-weight: 300
}

.candidate_sbox.fourth figcaption>p:nth-of-type(1)::after {
    content: "4위";
    position: absolute;
    top: 0;
    left: -20px;
    font-size: 1.6rem;
    font-weight: 300
}

.candidate_sbox.fifth figcaption>p:nth-of-type(1)::after {
    content: "5위";
    position: absolute;
    top: 0;
    left: -20px;
    font-size: 1.6rem;
    font-weight: 300
}

.candidate_name>figcaption>p:nth-of-type(2) {
    font-size: 1.6rem;
    font-weight: 300;
}

.candidate_sbox.orange {
    position: relative;
}

.candidate_sbox.orange:after {
    content: "";
    position: absolute;
}

.candidate_count {
    flex-grow: 1;
    font-size: 3rem;
    text-align: right;
}

.candidate_count>p {
    padding: 0 30% 0 0;
    color: #fff;
}

.candidate_count>p:nth-of-type(2) {

    font-size: 1.8rem;
    color: #fff;
}

.candidate_sbox.orange {
    position: relative;
}

.candidate_sbox {
    position: relative;
    z-index: 1;
}

.candidate_sbox .bar {
    position: absolute;
    right: 0;
    height: 100%;
    z-index: 0
}

.countingbox {
    width: 100%;
}

/* 지역별 득표 현황 */
.election_tabs {
    overflow-x: scroll;
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    border-top: 1px solid #000;
    border-bottom: 1px solid #000;
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.election_tabs::-webkit-scrollbar {
    display: none;
    /* Chrome, Safari, Opera*/
}

.election_tabs::after {
    content: "";
    display: block;
    clear: both
}

.election_tabs li {
    float: left;
    padding: 3% 5%;
    white-space: nowrap;

}

.election_tabs li>a {
    width: 100%;
    display: block;
    font-size: 2.1rem;
    color: #FFF;
    font-weight: 400
}

.election_tabs li.active {
    background: #000;
    transition: 0.3s;
}

.election_tabs li.active>a {
    color: #fff
}

.box_vote {
    display: flex;
    justify-content: space-between;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    margin: 35px 0 0 0;
}

.admin_info {
    display: flex;
    flex-grow: 9;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: nowrap;
    align-content: center;
}

.admin_info .ranking_name {
    display: flex;
    margin: 0 10px 0 0;
    font-size: 2.8rem;
    white-space: nowrap;
    align-items: center;
    font-weight: 500;
}

.admin_info .ranking_name>span {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 45px;
    height: 45px;
    margin: 0 10px 0 0;
    color: #fff;
    font-size: 1.8rem;
    border-radius: 100%;
}

.first .ranking_name>span {
    background: #333;
}

.second .ranking_name>span {
    background: #666;
}

.third .ranking_name>span {
    background: #999;
}

.fourth .ranking_name>span,
.fifth .ranking_name>span {
    background: #ccc;
}

.admin_info .graph {
    width: 100%;
}

.admin_info .graph>p:first-child {
    height: 50px;
}

.admin_number {
    display: flex;
    flex-grow: 1;
    flex-direction: column;
    align-items: flex-end;
}

.admin_number .votes_number {
    font-size: 3rem;
    line-height: 2.7rem;
    font-weight: 500
}

.admin_number p:last-child {
    color: #999;
    font-weight: 300
}

.all_opening {
    margin: 6% 0 0 0;
    /* padding:5% 0 0 0;*/
    /* border-top:1px dashed #eee;*/
    text-align: center;
    color: #999
}

.all_opening>p:first-child {
    font-size: 2.5rem
}

.all_opening>p:last-child {
    padding: 1.5% 0 0;
    color: #999;
    font-size: 1.3rem;
    line-height: 1.5rem;
    font-weight: 300;
}

/* 시간대별 투표율 */
.bg_gray {
    overflow: hidden;
    padding: 0 0 5% 0;
    background: #f8f8f8
}



.highcharts-title,
.highcharts-credits,
.highcharts-a11y-proxy-butto,
.highcharts-a11y-proxy-group-chartMenu,
.highcharts-exporting-group {
    display: none
}

.highcharts-subtitle {
    font-size: 1.5rem;
    font-weight: 300
}

/* 선거 관심 지수 */
.interest_tabs{
    display: flex;
    justify-content: center;
    column-gap:10px;
    margin-top:30px
}
.interest_tabs > li a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 150px;
    height: 50px;
    border-radius: 50px;
    font-size: 1.7rem;
    border: 1px solid #333;
    font-weight: 800;
}
.interest_tabs > li.active a {
    color: #fff;
    background: #333;
}
.interest_content{
    margin-top:40px
}


/* 정당별 뉴스 */

.news_article_area {
    position: relative;
    width: 100%;
}

.news_slide {
    position: absolute;
    top: 0;
    left: -5%;
    width: 100%;
    height: 240px;
}

.news_slide li p {
    position: absolute;
    bottom: 11%;
    height: 85px;
    overflow: hidden;
    width: 30%;
    padding: 34px 11px;
    background: linear-gradient(to bottom, #0000ff00 9%, #000 35%);
}

.news_slide li p span {
    background: #000;
    color: #FFF;
    font-size: 14px;
    width: 100%;
    text-align: left;
    color: #FFF;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    white-space: normal;
    -webkit-line-clamp: 2;
}

.news_slide li img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}



.news_slide {
    width: 100%;
}

.news_slide li {
    float: left;
    width: 30%;
    height: 240px;
    margin-right: 2%;
    margin-left: 2%;
}

.news_slide li:last-child {
    margin-right: 0;
}

.news_slide li img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/*tab css*/
.tab {
    width: 100.3%;
    height: 290px;
    overflow: hidden;
    margin-left: 0%;
}

.tabnav {
    font-size: 0;
    width: 100%;
    float: left;
    margin-bottom: 25px;
    padding: 0 8%;
}

.tabnav li {
    float: left;
    width: 29%;
    height: 37px;
    margin: 2%;
    line-height: 34px;
    text-align: center;
    border: 1px solid #000;
    border-radius: 100px;
}

.tabnav li a {
    position: relative;
    display: block;
    background: #fff;
    color: #000;
    line-height: 34px;
    text-decoration: none;
    font-size: 13px;
    border-radius: 100px;
    font-weight: 700;
}

.tabnav li a:hover,
.tabnav li a.active {
    background: #333;
    color: #FFF;
    border-radius: 100px;
    height: 35px;
    width: 101%;
    font-weight: 700;
}

.tabcontent {
    height: 244px;
    border-top: none;
}


.voting_area {
    width: 105%;
    /* height: 300px; */
}

.color_info {
    display: flex;
    justify-content: flex-end;
    margin: 0 5% 10px 0;
}

.color_info>div {
    position: relative;
    margin: 0 30px 0 0;
    font-weight: 300;
    font-size: 1.4rem;
}

.color_info>div:last-child {
    margin: 0 0 0 0;
}

.color_info>div::after {
    content: "";
    position: absolute;
    top: 4px;
    left: -16px;
    width: 12px;
    height: 12px;
}

.color_info>div.hight::after {
    background: #e9a9a9
}

.color_info>div.low::after {
    background: #b0cce4
}


.voting_area table {
    width: 100%;
    margin: 3% 0 0 0;
    border: 1px solid #eee;
}

.voting_area table:first-child {
    margin-top: 0
}

.voting_area table td,
th {
    width: 33.3%;
    padding: 3% 0;
    border-right: 1px solid #eee;
    text-align: center;
    font-size: 1.7rem;
    font-weight: 300
}

.voting_area table td:last-child,
.voting_area table th:last-child {
    border-right: 0;
}

.voting_area table td.bg_red {
    color: #fff;
    font-weight: 400;
    background: #e9a9a9
}

.voting_area table td.bg_blue {
    color: #fff;
    font-weight: 400;
    background: #b0cce4
}
.voting_area table td.bg_red {
    color: #fff;
    font-weight: 400;
    background: #f0c8cc
}

.voting_area table th {
    background: #f5f5f5
}

/* .voting_area table:nth-of-type(1) th:first-child {
    font-weight: 500;
} */

/* .voting_area table:nth-of-type(1) td:first-child {
    font-weight: 500;
} */
.voting_area .swiper-pagination{
    position:relative;
    margin-top:20px;
    left:50%;
    -webkit-transform:translateX(-50%);
            transform:translateX(-50%);
}

.voting_area .swiper-pagination-bullet {
    width: 20px;
    height: 20px;
}

.voting_area .swiper-pagination-bullet-active {
    position: relative;
    top: -3px;
    width: 30px;
    height: 15px;
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
    background: #999
}

#charts .highcharts-legend.highcharts-no-tooltip {
    transform: translate(80%, -5%);
    display: none
}

.slide_out_txt {
    width: 100%;
    height: 380px;
    margin-top: 30px;
}

.slide_in_txt {
    float: left;
    width: 100%;
    height: 78px;
    margin-bottom: 16px;
}

.slide_in_txt span {
    float: left;
    width: 66%;
    margin-right: 4%;
    padding: 17px 0;
    color: #FFF;
    font-weight: 400;
    font-size: 1.7rem;
}

.slide_in_txt p {
    float: right;
    width: 30%;
    height: 78px;
}

.slide_in_txt p img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 역대대선투표율 */
.color_info.type02 {
    position: relative;
    top: -15px
}

.color_info.type02>div.hight::after {
    background: #7cb5ec
}

.color_info.type02>div.low::after {
    background: #434348
}

/* 지역별 뉴스 */
.slide_out_txt {
    width: 100%;
    height: 380px;
    margin-top: 30px;
}

.slide_in_txt {
    float: left;
    width: 100%;
    height: 78px;
    margin-bottom: 16px;
}

.slide_in_txt span {
    float: left;
    width: 66%;
    margin-right: 4%;
    padding: 17px 0;
    color: #FFF;
    font-weight: 400;
    font-size: 1.7rem;

}

.slide_in_txt span a {
    color: #FFF;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    white-space: normal;
    -webkit-line-clamp: 2;
}

.slide_in_txt p {
    float: right;
    width: 30%;
    height: 78px;
}

.slide_in_txt p img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* 정당별 뉴스 */
.jeongdang_tabs{
    display:flex;
    justify-content:center;
    column-gap:10px;
    overflow-x: scroll;
    padding:0 5%;
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.jeongdang_tabs > li a{
    display:flex;
    align-items:center;
    justify-content:center;
    height:45px;
    padding:0 20px;
    border-radius:50px;
    font-size:1.7rem;
    border:1px solid #333;
    font-weight:800;
    white-space:nowrap;
}
.jeongdang_tabs > li.active a{
    color:#fff;
    background:#333;
}
.layer_black_textbox{
    display:flex;
    overflow:hidden;
    position:relative;
}
.layer_black_textbox img{
    aspect-ratio: 7/9;
}
.layer_black_textbox > p{
    position:absolute;
    bottom:0;
    display:flex;
    align-items:end;
    height:70%;
    padding:20px 20px 20px;
    font-size:1.8rem;
    text-align:center;
    font-weight:300;
    background: linear-gradient(360deg, rgba(0,0,0,1) 0%,  rgba(0,0,0,1) 20%, rgba(255,255,255,0) 100%);
    z-index:1
}
.layer_black_textbox > p span{
    color:#fff;
}

/*** 알림 팝업 ***/
.ico_reference{
    position:relative;
    top:-15px;
    left:10px;
    font-size:0;
    cursor: pointer;
}
.ico_reference{
    position:relative;
    top:-23px;
    left:10px;
    font-size:0
}
.ico_reference, .ico_reference::after{
    display:inline-block;
    width:20px;
    height:20px;
}
.ico_reference::after{
    content:"";
    position:absolute;
    top:0;
    left:0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xml:space='preserve' id='Layer_1' x='0' y='0' style='enable-background:new 0 0 30 30' version='1.1' viewBox='0 0 30 30'%3E%3Cstyle%3E.st0%7Bfill:%23ccc%7D%3C/style%3E%3Cpath d='M15 17c.6 0 1-.5 1-1V9c0-.6-.4-1-1-1s-1 .4-1 1v7c0 .6.4 1 1 1z' class='st0'/%3E%3Ccircle cx='15' cy='21' r='1' style='fill-rule:evenodd;clip-rule:evenodd;fill:%23ccc'/%3E%3Cpath d='M15 1C7.3 1 1 7.3 1 15s6.3 14 14 14 14-6.3 14-14S22.7 1 15 1zm0 2c6.6 0 12 5.4 12 12s-5.4 12-12 12S3 21.6 3 15 8.4 3 15 3z' class='st0'/%3E%3C/svg%3E");
}
.ico_reference:hover::after{
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xml:space='preserve' id='Layer_1' x='0' y='0' style='enable-background:new 0 0 30 30' version='1.1' viewBox='0 0 30 30'%3E%3Cstyle%3E.st0%7Bfill:%23999%7D%3C/style%3E%3Cpath d='M15 17c.6 0 1-.5 1-1V9c0-.6-.4-1-1-1s-1 .4-1 1v7c0 .6.4 1 1 1z' class='st0'/%3E%3Ccircle cx='15' cy='21' r='1' style='fill-rule:evenodd;clip-rule:evenodd;fill:%23999'/%3E%3Cpath d='M15 1C7.3 1 1 7.3 1 15s6.3 14 14 14 14-6.3 14-14S22.7 1 15 1zm0 2c6.6 0 12 5.4 12 12s-5.4 12-12 12S3 21.6 3 15 8.4 3 15 3z' class='st0'/%3E%3C/svg%3E");
}
.reference_box{
    display:none;
}
.reference_box.on{
    display:block;
    position:absolute;
    top:calc(50% + 30px);
    left:50%;
    -webkit-transform:translateX(-50%);
            transform:translateX(-50%);
    padding:10px 25px 10px 15px;
    width:90%;
    font-size:12px;
    font-weight:400;
    text-align: left;
    color:#999;
    /* white-space: nowrap; */
    border-radius:5px;
    background:#efefef;
    z-index:15;
    
}
.reference_box.on::after{
    content: "";
    position: absolute;
    left: 50%;
    top:-14px;
    -webkit-transform:translateX(-50%);
            transform:translateX(-50%);
    width: 0px;
    height: 0px;
    border-bottom: 7px solid #efefef;
    border-top: 7px solid transparent;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
}
.reference_box > em{
    position:absolute;
    right:10px;
    top:10px;
    width:10px;
    height:10px;
    font-size:0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xml:space='preserve' style='enable-background:new 0 0 75 75' viewBox='0 0 75 75'%3E%3Cpath d='M72.1 12.1c1.3-1.3 1.9-2.8 1.9-4.6 0-1.8-.6-3.3-1.9-4.6S69.3 1 67.5 1c-1.8 0-3.3.6-4.6 1.9L37.5 28.3 12.1 2.9C10.8 1.6 9.3 1 7.5 1c-1.8 0-3.3.6-4.6 1.9S1 5.7 1 7.5c0 1.8.6 3.3 1.9 4.6l25.4 25.4L2.9 62.9C1.6 64.2 1 65.7 1 67.5c0 1.8.6 3.3 1.9 4.6C4.2 73.4 5.7 74 7.5 74c1.8 0 3.3-.6 4.6-1.9l25.4-25.4 25.4 25.4c1.3 1.3 2.8 1.9 4.6 1.9 1.8 0 3.3-.6 4.6-1.9 1.3-1.3 1.9-2.8 1.9-4.6 0-1.8-.6-3.3-1.9-4.6L46.7 37.5l25.4-25.4z' style='fill:%23333'/%3E%3C/svg%3E");
}

/********** 주요격전지 **********/
.attention_nav{
    padding-top:50px;
}
.attention_nav .swiper-slide{  /* 240307_DH 수정 */
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    /* margin: 0 5px; */
    height: 40px;
    padding: 0 20px;
    border-radius: 100px;
    white-space:nowrap;
    border: 1px solid #6c70ba;
    color: #6c70ba;
    cursor: pointer;
}
.attention_nav .swiper-slide.swiper-slide-thumb-active{
    border: 3px solid #4046af;
    color: #4046af;
    font-size: 1.8rem;
    white-space: nowrap;
    height: 50px;
    padding:0 20px!important;
    transition: all 300ms ease;
    margin-top: -5px;
    padding: 0 30px;
}

.attention_compare{
    margin-top:30px;
}
.attention_compare .leftwing, 
.attention_compare .rightwing{
    display:flex;
    flex-direction: column;
    row-gap:3px;
    font-size:1.8rem;
}
.attention_compare .leftwing > p, 
.attention_compare .rightwing > p{
    font-size:1.5rem;
}
.attention_compare .leftwing{
    align-items: end;
}


/*** 그래프 ***/
.attention_compare .center_area{
    margin-top:20px;
}
.attention_compare .center_area > *{
    margin-bottom:10px;
}
.attention_compare .center_area > *:last-child{
    margin-bottom:0;
}
.attention_compare .bargraph > *:nth-child(2){
    display:flex;
    align-items: center;
    justify-content: center;
    color:#fff;
    font-size:15px;
    background:#494949
}
.attention_compare .content_area, 
.attention_compare .bargraph{
    display:grid;
    grid-template-columns: 1fr 55px 1fr;
}
.attention_compare .left_point > span, 
.attention_compare .right_point > span{
    display:flex;
    align-items: center;
    font-size:22px;
    line-height:22px;
    color:#444;
    font-weight:600;
}
.attention_compare .bargraph .low{
    font-size:18px;
    color:#fff
}
.attention_compare .left_point{
    display:flex;
    justify-content: end;
    height:35px;
}
.attention_compare .left_point > span{
    padding-left:30px;
    border-top-left-radius: 40px;
    border-bottom-left-radius:40px;
    background:#68e800
}
.attention_compare .right_point{
    display:flex;
    justify-content: start;
    height:35px;
}
.attention_compare .right_point > span{
    justify-content: flex-end;
    padding-right:30px;
    border-top-right-radius: 40px;
    border-bottom-right-radius:40px;
    background:#68e800
}
.textinfo_area{
    display:flex;
    flex-direction: column;
    align-items: center;
    row-gap:10px;
    margin-top:20px;
}
.textinfo_area > *:first-child{
    font-size:12px;
    line-height:19px;
    text-align: center;
    color:#999
}
.textinfo_area > * img{
    width:65px;
    margin-left:10px;
}

/*** 영향력 ***/
.seoul_jongro .influence .left_point > span{
    width:calc(70% + 20px)
}
.seoul_jongro .influence .right_point > span{
    width:calc(30% + 20px)
}

/*** 활동량 ***/
.seoul_jongro .activity .left_point > span{
    width:calc(40% + 20px)
}
.seoul_jongro .activity .right_point > span{
    width:calc(60% + 20px)
}

/*** 반응량 ***/
.seoul_jongro .reaction .left_point > span{
    width:calc(50% + 20px)
}
.seoul_jongro .reaction .right_point > span{
    width:calc(50% + 20px)
}


/*------------------------------------------------------------------------------
                                개표 현황
-------------------------------------------------------------------------------*/
.examination_txt {width:100%; height:90px; background:#fff; font-size: 16px; line-height: 90px; color:#888; text-align:center;}
.hh_name {font-size: 12px; text-align: center; height: 20px; color: #999; font-weight: 300; margin-top: -10px; margin-bottom: 20px;}
/* .vote_status {width:100%; height:189px; padding:5%; margin-bottom: 15px; background: #FFF; position: relative;} */
.vote_status:last-of-type{ margin-bottom: 0;}
.vote_status_l {float: left; width:46%; height: auto;}
.vote_l_info {float: left; width:22%; height: 100%;}
.vote_l_info .reserve_img {float: left; width:100%; height: 56px; border-radius:50px; margin-bottom: 8px; overflow:hidden; border-radius: 100px; border:1px solid #e8e7e7;}
.vote_l_info .reserve_img img {width:100%; height: 100%;}
.vote_l_info p {clear: both; width:100%; height:22px; background: #e60012; line-height: 22px; font-size: 14px; color:#fff; text-align: center;}

.vote_r_info {float: right; width:72%; height: 100%; text-align: left;}
.vote_line li.line_01 {width:100%; height: 33.333%; margin-top:8px; font-size: 22px; font-weight: 600;}
.vote_line li.line_02 {width:100%; height: 33.333%; font-size: 13px;}
.vote_line li.line_03 {width:100%; height: 33.333%; margin-top: 5px; font-size: 24px; font-weight: 600;}
.vote_status_r {float: right; width:46%; height: auto;}


/* 탭메뉴 */
.tab_wrap {max-width: 800px;}
.tab_wrap .tit_list {position: relative; font-size: 0; margin-bottom: 20px;}
.tab_wrap .tit_list > li {display: inline-block; vertical-align: top; margin-right: 10px;}
.tab_wrap .tit_list li:first-of-type {margin-left: 24% !important;}
.tab_wrap .tit_list > li a {display: inline-block; padding: 10px 25px; border: 1px solid #333; border-radius: 50px; font-size: 14px; color: #000;text-decoration: none;}
.tab_wrap .tit_list > li a:hover {background: #efefef;border-color: #efefef;}
.tab_wrap .tit_list > li.active a {position: relative; background: #333; color: #FFF; border-radius: 50px;}
.tab_wrap .tab_con .tab_list {display: none;}

/* 슬라이드 */
.slider {text-align: center;font-size: 0;}
.slider .inner {overflow: hidden;width: 100%; margin: 0 auto;}
.slide_list > li {width: 300px; height: auto;text-align: center; font-size: 20px;line-height: 150px;color: #000;}
.slider .swiper-prev,
.slider .swiper-next {display: inline-block;width: 35px;height: 35px;margin:30px 15px 0;background:url('images/arrow.png') center center no-repeat;background-size: cover;text-indent: -999em;cursor: pointer; display: none;}
.slider .swiper-prev {transform: rotateY(180deg);}

.vote_bg_txt {position: absolute; left:-195px; top:30px; font-size:26px; text-align: left;}

.vote_bg_box {
    position:absolute; 
    left: 258px; 
    top:0px; 
    z-index: 0;
    width:100%; 
    height:167px; 
    background:url('https://image.edaily.co.kr/images/election/vote_bg_box.png') no-repeat;
}

.vote_bg_txt b::after {
    content: "";
    position: absolute;
    right: 40px;
    top: 77px;
    width: 10px;
    height: 18px;
    background:url('https://image.edaily.co.kr/images/election/arrow_icon.png') no-repeat;
}
.ex_cord {height: auto;}

/* 투표 현황 */
.tabb > li:first-of-type {margin-left: 36%;}
ul,li{list-style:none} 
.tabb{overflow:hidden} 
.tabb li{float:left; margin-right: 10px; margin-bottom: 20px; border:1px solid #fff; cursor:pointer; padding:10px 20px; font-size:14px; border-radius: 50px; border: 1px solid #333;} 
.tabb li a{display:block; text-align:center} 
.tabb > li.selected {position: relative; background: #333; color: #FFF; border-radius: 50px;}

.con_wrap{position:relative; width:100%; margin-top:20px;} 
.con_wrap div img{width:100%; height: 100%;} 
.con_wrap div:nth-child(2){display:none;} 
.ex_cord {background: #f5f5f5; margin-top: -32px; padding-top: 20px; padding-bottom:20px; height: auto;}

/* 20240318 투표현황 */

/* 20240318 개표현황 */
.gray_box{
    padding:10% 20px;
    background:#f5f5f5
}
.tophyeo{
    padding:6% 0px!important;
    border-bottom:10px solid #f5f5f5
}
.gray_box .main-tit, 
.tophyeo .main-tit{
    margin-bottom:5px
}
.min-tit-small{
    display:flex;
    justify-content: center;
    text-align:center;
    font-size:12px;
}
.count_service_wrap{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    column-gap:20px;
    margin-top:40px;
}
.count_select{
    display:flex;
    justify-content: center;
    width:100%;
    font-size:18px;
    padding:10px;
    text-align: center;
    font-weight:600;
    border-radius:0;
    border:0;
    border-top:1px solid #333;
    border-bottom:1px dashed #bbb;
    background:#eee
}

.vote_status_t {
    margin-top:25px;
    display:flex;
    flex-direction:column;
    align-items:center;
    row-gap: 5px;
}
.vote_status_t p{
    display:flex;
    align-items: center;
    padding:5px 30px;
    font-size:15px;
    /* font-weight:600; */
    color:#fff;
    border-radius:30px;
    background:#333;
    
}
.vote_status_t span{
    font-size:14px;
}

.vs_box{
    display: flex;
    justify-content: center;
    margin-top: 30px;
    column-gap: 60px;
}
.vs_area{
    display:flex;
    flex-direction:column;
    align-items: center;
    row-gap:10px
}
.vs_area .info_box{
    display:flex;
    flex-direction:column;
    align-items: center;
    row-gap:5px
}
.info_box dt{
    position:relative
}
.vs_area .point{
    font-size: 22px;
    font-weight:800;
    color: #999;
}
.vs_area .point.more{
    color:#333
}
.vs_area dd.name{
    font-size:18px;
    font-weight:600;
    margin-top:15px;
}
.info_box dt > img{
    width:70px;
    height:70px;
    border-radius: 50px;
}
.info_box dt .victory{
    position:absolute;
    top:-10px;
    left:-5px;
    /* -webkit-transform:translateX(-50%);
            transform:translateX(-50%); */
    display:flex;
    justify-content:center;
    align-items:center;
    width:30px;
    height:30px;
    font-size:11px;
    color:#fff;
    border-radius:60px;
}
/* .victory.blue{
    background:#152484;
} */
.victory.red{
    background:#e60024;
}
/* .victory.orange{
    background:#f78d37;
}
.victory.green{
    background:#61b827;
}
.victory.purple{
    background:#9b55b9;
} */

.vote_resulte .swiper-pagination{
    position:relative;
    width:100%!important;
    margin-top:30px;
    display: flex;
    column-gap: 5px;
    align-items: center;
    justify-content: center;
}
.vote_woops{
    display:flex;
    justify-content: center;
    column-gap:20px;
    margin-top:30px
}
.vote_woops li{
    padding: 7px 25px;
    white-space: nowrap;
    font-size: 1.8rem;
    border: 1px solid #333;
    border-radius: 50px;
}
.vote_woops li.active, .vote_woops li.active a{
    color:#fff;
    background:#333;
}
.votewoops_content{
    margin-top:30px;
}

.numerical_info{
    display:flex;
    justify-content: end;
    column-gap: 10px;
    margin-bottom:15px;
}
.area_vote_txt{
    display:flex;
    justify-content: end;
    margin-bottom:15px
}

.area_vote_txt li{
    float:left;
    font-size:13px;
    margin-right:15px;
}

.area_vote_txt li.f1:before{
    content:"";
    float:right;
    width:1.5px;
    height:13px;
    margin-top:4px;
    margin-left:15px;
    background:#ccc;
}

.area_vote_txt li.f2:before{
    content:"";
    float:left;
    width:10px;
    height:10px;
    margin-right:5px;
    margin-top:5px;
    background:#f0c8cc;
}

.area_vote_txt li.f3:before{
    content:"";
    float:left;
    width:10px;
    height:10px;
    margin-right:5px;
    margin-top:5px;
    background:#d4dff2;
}

.pb_vote{
    overflow: hidden;
}


/* 20240409 정당별 실시간 현황 */
/* 정당별 실시간 현황 */
.minju_t{color:#1009af}
.yeonhab_t{color:#005ff1}
.gukhim_t{color:#e60024}
.gehyeok_t{color:#f37924}
.mirae_t{color:#10cfc9}
.noksek_t{color:#007c36}
.jayu_t{color:#e60024}
.joguk_t{color:#06275e}
.jinbo_t{color:#f5334a}
.muso_t{color:#777}
.etc_t{color:#000}

.realtime_status{
    background: #f5f5f5;
    padding:0 20px;
    padding-bottom:50px
    /* border-bottom:10px solid #f5f5f5 */
}
.realtime_status .title{
    display:flex;
    align-items: center;
    column-gap: 5px;
    margin-bottom:20px;
    font-size:20px;
    font-weight:600
}
.realtime_status .title::before{
    content:"";
    display:flex;
    width:15px;
    height:15px;
    background:#333
}
.realtime_status_wrap{
    display:grid;
    grid-template-columns: repeat(4, 1fr);
    gap:10px;
    padding:10px;
    background:#fff;
}
.realtime_status_wrap dl{
    display:flex;
    flex-direction:column;
    align-items:center;
    border:1px solid #ddd;
    padding:10px
}
.realtime_status_wrap dl dt{
    font-weight:600
}
.realtime_status_wrap dl dd{
    text-align:center
}

/* 새로고침 */
.btn_refresh{
    position:absolute;
    top:50%;
    -webkit-transform:translateY(-50%);
            transform:translateY(-50%);
    right:-40px;
    border:0;
    width:25px;
    height:25px;
    font-size:0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' data-name='Layer 1' viewBox='0 0 43 43'%3E%3Cpath d='M34 1c.2 0 .4 0 .6.1.2.1.4.3.5.5l6.7 10.8c.1.2.2.4.2.6 0 .5-.3 1-.8 1.1h-.4c-.2 0 0 0 0 0l-12.9.3c-.2 0-.4 0-.6-.1-.6-.3-.8-1-.5-1.6l1.4-2.5c-2-1.1-4.1-1.5-6.2-1.5-4.6 0-9 2.4-11.4 6.6-3.4 6.2-1.1 13.9 5.2 17.3 2 1.1 4.1 1.5 6.2 1.5 3.3 0 6.6-1.3 9-3.6.7-.7 1.7-1.1 2.7-1.1.6 0 1.3.2 1.9.5 1.9 1 2.6 3.4 1.6 5.2-.2.4-.4.7-.7.9-3.9 3.7-9.1 5.7-14.4 5.7-3.4 0-6.8-.8-9.9-2.5C1.8 34.1-2 21.7 3.5 11.8 7.3 5 14.4 1.2 21.8 1.2s6.8.8 9.9 2.5l1.2-2.1c.2-.4.6-.6 1-.6Z' style='fill:%23000;stroke-width:0'/%3E%3C/svg%3E");
    transition: transform .5s;
}

/* 개표결과 */
.resultwrap{
    border-bottom:1px solid #ddd
}
.realtime_status.resultarticle{
    padding:0
}
.vote_infos{
    width: 100%;
    overflow-x: auto;
    white-space: nowrap; 
    display:flex;
    /* justify-content:center; */
    column-gap:15px;
    margin:20px 0;
    padding:20px 0;
    border-top:1px dashed #ddd;
    border-bottom:1px dashed #ddd
}
.vote_infos li{
    display:flex;
    align-items: center;
    color:#999
}
.vote_infos li span{
    margin-left:10px;
    /* color:#555 */
}
.vote_infos li::after{
    content:"";
    display:flex;
    width:1px;
    height:70%;
    margin-left:20px;
    background:#ddd;
}
.vote_infos li:last-child::after{
    display:none
}
.resultwrap .realtime_status_wrap dl {
    row-gap:5px
}





































/*------------------------------------------------------------------------------
                                        MIDIAQURY
-------------------------------------------------------------------------------*/
@media screen and (max-width:500px) {
    .realtime_status_wrap{
        grid-template-columns: repeat(2, 1fr);
    }
}
@media screen and (max-width:480px) {
    .d_day_box {
        right: 20px;
        top: 10px;
    }
    .twice_thumb {
        margin-top:50px;
    }
    .whitebox, .battle_area, .blackbox, .graysbox {
        padding: 10% 20px;
    }
    .main-tit {
        font-size:3.3rem;
        margin-bottom:30px;
    }
    .mainnews_mainthumb>p {
        font-size:2.5rem;
    }
    .twice_thumb .mainnews_mainthumb>p {
        font-size: 2.2rem;
    }
    .jeongdang_tabs > li a, .interest_tabs > li a {
        width:auto;
        padding:0 20px;
        max-width: 130px;
        height: 40px;
        font-size: 1.6rem;
        font-weight:600;
    }
    .listthumb {
        margin-top:40px;
    }
    /* 정당별 뉴스 */
    .jeongdang_tabs{
        justify-content:unset;
    }
    .attention_nav {
        padding-top: 20px;
    }
    .attention_compare .right_point > span {
        padding-right: 15px;
    }
    .attention_compare .left_point > span {  /* 240308_DH 수정 */
        padding-left: 15px;
    }
    .realtime_status .title{
        font-size:19px
    }
    /* 새로고침 */
    .btn_refresh{
        right:-40px;
        width:22px;
        height:22px;
    }
    .resultwrap .realtime_status_wrap {
        grid-template-columns: repeat(3, 1fr);
    }
    .realtime_status .title::before {
        width: 12px;
        height: 12px;
    }

}
@media screen and (max-width:460px) {
    .main-tit, .rainbowtitle {
        font-size: 3.5rem;
        margin-bottom:25px;
    }
    .main-tit.bottomline {
        padding-bottom: 20px;
    }
    .twice_thumb {
        margin-top:40px;
    }
    .listthumb {
        margin-top:40px;
    }
    .base_list>p {
        font-size:1.8rem;
        line-height: 2.8rem;
    }
    .post-info h4 a {
        font-size: 1.8rem;
    }
    .schedule-l > *:first-child, .schedule-l > *:last-child {
        font-size: 2rem;
    }
    .footer_snslinkarea > p {
        font-size: 3rem;
    }
    .ico_reference {
        top: -23px;
    }
    .interest_tabs > li a {
        padding:0 30px;
    }
    .attention_compare .bargraph .low{
        font-size:15px;
    }
}
@media screen and (max-width:420px) {
    .d_day_box {
        top: 5px;
    }
    .twice_thumb .mainnews_mainthumb {
        row-gap:15px;
    }
    .twice_thumb .mainnews_mainthumb>p {
        font-size: 1.8rem;
        padding:0 10px
    }
    .election_tabs li>a {
        font-size: 1.8rem;
    }
    .listthumb>* {
        padding:20px 10px;
    }
    .listthumb p {
        font-size: 1.8rem;
        line-height: 2.6rem;
    }
    .sharptitle {
        font-size: 2.5rem;
    }
    .listthumb {
        margin-top:30px;
    }
    .base_listbox {
        row-gap:20px;
    }
    .base_list>img {
        width: 35%;
    }
    .base_list>p {
        font-size: 1.7rem;
        line-height: 2.5rem;
    }
    .schedule-box > img {
        max-height: 100px;
    }
    .footer_snslinkarea > p {
        font-size: 2.5rem;
    }
    .ico_picknews {
        top: -14px;
        height: 27px;
        line-height: 27px;
        padding: 0 22px;
        font-size: 12px;
    }
    .panse_tabs li {
        padding: 7px 20px;
        font-size: 1.4rem;
    }
    .resultwrap .realtime_status_wrap {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media screen and (max-width:380px) {
    .day_in{
        width:unset;
        margin-bottom:0;
        margin-left:65px;
    }
    .day_in li {
        width: 15px;
        height: 15px;
        text-align: center;
        line-height: 15px;
        font-size: 12px;
    }
    .main-tit, .rainbowtitle {
        font-size: 2.7rem;
    }
    .mainnews_mainthumb {
        row-gap:20px;
    }
    .mainnews_mainthumb>p {
        font-size: 2.1rem;
    }
    .mainnews_mainthumb>p {
        padding: 0 10px;
    }
    .twice_thumb {
        margin-top:30px;
        column-gap:10px;
    }
    .twice_thumb .mainnews_mainthumb>p {
        padding: 0 5px;
        font-size: 1.7rem
    }
    .listthumb p {
        font-size: 1.7rem;
        line-height: 2.5rem;
    }
    .panse_tabs li {
        padding: 5px 20px;
        white-space: nowrap;
        font-size: 1.6rem;
    }
    .area_political > * i {
        font-size: 1.1rem;
        padding: 2px 10px 3px 10px;
    }
    .jeongdang_tabs > li a, .interest_tabs > li a {
        padding: 0 15px;
        height: 35px;
        font-size: 1.4rem;
    }
    .interest_tabs > li a {
        padding:0 30px;
    }
    .schedule-box {
        border-bottom: 2px dashed #ddd;
        padding: 10px 10px;
    }
    .schedule-l > *:first-child, .schedule-l > *:last-child {
        font-size: 1.7rem;
    }
    .schedule-box > img {
        max-height: 80px;
    }
    .footer_snslinkarea > p {
        font-size: 2rem;
    }
    .snsboxareanew > a::after {
        width:40px;
        height:40px;
    }
    .ico_reference {
        top: -20px;
    }
    .attention_compare .left_point > span, .attention_compare .right_point > span {
        font-size: 17px;
        line-height: 19px;
    }
    .realtime_status .title{
        display:flex;
        /* justify-content:space-between; */
        /* align-items: end; */
        font-size:20px;
    }
    .realtime_status.realtime_status .title > span:last-child{
       font-size:20px
    }
    .sss{
        font-size:15px!important;
    }
    /* 새로고침 */
    .btn_refresh{
        right:-30px;
        width:18px;
        height:18px;
    }
}
@media screen and (max-width:330px) {
    .layer_black_textbox img {
        aspect-ratio: 1/1;
    }
}
@media screen and (max-width:320px) {
    .main-tit, .rainbowtitle {
        font-size: 2.8rem;
    }
    .mainnews_mainthumb>p {
        font-size:2rem;
    }
    .twice_thumb {
        display: flex;
        flex-direction:column;
        row-gap: 20px;
        margin-top: 30px;
    }
    .twice_thumb .mainnews_mainthumb>p>span {
        text-align: left;
    }
    .base_list>p {
        font-size: 1.5rem;
        line-height: 2rem;
    }
}