@charset "utf-8";

/*
  작성자 : kim Ga Ram
  작업시작일 : 2020.03
*/


/* layout */
.list_body{width:660px;margin-right:20px;}
.voting-wrap.briefing{margin-bottom:90px;}


/* setting */
.clearfix{ *zoom: 1; }
.clearfix:after{ content: ""; display: block; clear: both }


/* color */

.color1{color:#008ccd} /*더불어민주당*/
.color2{color:#fb637e} /*미래통합당*/
.color3{color:#ffcb05} /*정의당*/
.color4{color:#00a75d} /*민생당*/
.color5{color: #ff7414} /*국민당*/
.color6{color:#777777} /*무소속*/
.color7{color:#8278c0} /*기타정당*/


/* CSS styles for Election 2016 News List fix */

/* vote sub result */
/* .wrap_vote_result{margin-bottom:20px;} */
.tabmenu_type_fluid{}
.tabmenu_type_fluid:after{content:""; display:block; clear:both;}
.tabmenu_type_fluid li{float:left;}
.tabmenu_type_fluid li a{display:block; padding:10px 30px; background-color:#e2e2eb; color:#fff; font-size:15px; color:#798099; border-right:1px solid #adacbf; }
.tabmenu_type_fluid li.active a{color:#fff; background-color:#655ed9; border-color: #655ed9; font-weight:bold;}
.tabmenu_type_fluid li:last-child a{border-right:none}
/*.tabmenu_type_fluid li.active + li a{border-left:1px solid #adacbf;}*/
/*.tabmenu_type_fluid li:last-child{border-right:none}*/
/*.tabmenu_type_fluid li:last-child.active{border-right:1px solid #adacbf}*/
/*.vote_result_tab_con{border-top:1px solid #bcbfc8}*/
.vote_result_tab_con > div{display:none; }
.vote_result_tab_con > div:first-child{display:block;}


/* briefing_issue_wrap */
.briefing_issue_wrap{margin-top:20px;}
.issue_box{float:left;width: 320px;}
.issue_box:nth-child(odd){margin-right:10px;}
.issue_box:nth-child(even){margin-left:10px;}

.issue_box .issue_tit{margin-bottom:8px;font-size:15px;font-weight:bold;color: #655ed9;}

.issue_box .issue_con{display:table;position:relative;width:100%;padding:32px 30px;border:solid 1px #d7d7d7;border-top:2px solid #655ed9;margin-bottom:15px;box-sizing:border-box;}
.issue_box .issue_con dl{display:table-cell;text-align: center;position:relative;}
.issue_box.vs_type .issue_con dl:nth-child(odd){padding-right:30px;}
.issue_box.vs_type .issue_con dl:nth-child(even){padding-left:30px;}
.issue_box .issue_con .num{font-size:23px;color:#222;font-weight:bold;margin-bottom:9px;}
.issue_box .issue_con .num span{font-size:14px;font-weight:normal}
.issue_box .issue_con .thumb{overflow:hidden;position:relative;width:100px;height:100px;border-radius:100%;  border: solid 1px #eaeaea;box-sizing: border-box;margin:0 auto 6px;}
.issue_box .issue_con .thumb img{display:block;position: absolute;left:0;top:0;right:0;bottom:0;width:80%;margin:0 auto;}
.issue_box .issue_con .candi{}
.issue_box .issue_con .candi b{display:block;font-size:16px;color:#222;}
.issue_box .issue_con .candi span{display:block;font-size:12px;margin:2px 0 3px;}
.issue_box .issue_con .dist{font-size:12px;color:#666;}
.issue_box .issue_con .percent{color:#777;font-size:20px;font-weight:bold;}
.issue_box .issue_con .percent em{font-size:14px;}
.issue_box .issue_con .vote{font-size:12px;color:#777}

.issue_box.vs_type .issue_con:after{content:"VS.";font-size:18px;color:#cfced8;display: block;position: absolute;left: 0;top:105px;bottom:0;right:0;text-align: center;font-weight:bold;z-index:-1;}



.issue_box.graph_type{}
.issue_box.graph_type .issue_con{display: block;padding:23px 25px 20px 25px;}

.issue_box.graph_type .issue_con dl{}

.issue_box .issue_con .per_vote{position: absolute;bottom:50px;left:120px;width:84px;height:54px;padding-top:8px;display:inline-block; border: solid 1px #eaeaea;background-color: #f8f8f8;  border-radius: 27px;font-size:12px;color:#777;text-align: center;box-sizing:border-box;}
.issue_box .issue_con .per_vote > *{vertical-align: middle;}
.issue_box .issue_con .per_vote b{display: block;font-size:23px;color:#222; letter-spacing: -1.15px;line-height:1;}
.issue_box .issue_con .per_vote b em{font-size:14px}

.issue_box .issue_con .graph { width: 7px; height: 80px; margin-top: 10px; position: absolute; top: 0px; background:#f4f4f8 }
.issue_box .issue_con .graph .info { display: block; width:8px; min-height: 1px; position: absolute; bottom: 0px}
.issue_box .issue_con .info em { position: absolute; top: -20px; right: 0px; font-size: 13px; font-weight: bold; white-space: nowrap;}


.issue_box .issue_con .graph .info.color1{background:#008ccd}/*더불어민주당*/
.issue_box .issue_con .graph .info.color2{background:#fb637e}/*미래통합당*/
.issue_box .issue_con .graph .info.color3{background:#ffcb05}/*정의당*/
.issue_box .issue_con .graph .info.color4{background:#00a75d}/*민생당*/
.issue_box .issue_con .graph .info.color5{background:#777777}/*무소속*/
.issue_box .issue_con .graph .info.color6{background:#8278c0}/*기타정당*/




.issue_box.graph_type .issue_con dl:nth-of-type(odd){padding-right:36px}
.issue_box.graph_type .issue_con dl:nth-of-type(even){padding-left:36px}

.issue_box.graph_type .issue_con dl:nth-of-type(odd):after{position: absolute;top:0;left:0;content:"당선";background-color: #655ed9;  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.15);color:#fff;  font-size: 14px;font-weight:bold;width: 34px;height:25px;text-align: center;line-height:25px;}
.issue_box.graph_type .issue_con dl:nth-of-type(even):after{position: absolute;top:0;left:36px;content:"2위"; background-color: #a0a0ad;  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.15);color:#fff;  font-size: 14px;font-weight:bold;width: 34px;height:25px;text-align: center;line-height:25px;}

.issue_box.graph_type .issue_con dl:nth-of-type(odd) .graph{right: 2.5px;}
.issue_box.graph_type .issue_con dl:nth-of-type(even) .graph{left:2.5px;}


.issue_box .issue_con .area{margin-bottom:15px;font-size:15px;color:#222;font-weight:bold;text-align: center;}



.issue_box.img_type{margin-bottom:20px;}
.issue_box.img_type img{display: block;margin:0 auto;}




/* 모바일 */
@media (max-width: 700px) {
  /* footer 제작자 숨김 처리 */
  .footer_100 .member_area{display:none;}
  /* PC -> M 간격 조정 */
  .voting-wrap.briefing{margin-bottom:0;}


  .briefing_wrap {
    padding: 30px 15px 40px;
    background-color: #f4f4f8;
  }

  .briefing_wrap h2 {
    margin-bottom: 10px;
    font-size: 24px;
    color: #000;
  }

  .briefing_wrap h2 strong {
    color: #655ed9
  }

  .briefing_wrap ul {}

  .briefing_wrap ul li {
    font-size: 16px;
    color: #8a889c;
    margin-bottom: 6px;
  }

  .brief_info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 17px;
  }

  .brief_info .brief_img {
    width: 153px;
    height: 145px;
  }

  .brief_info .brief_img img {
    display: block;
    width: 100%;
  }

  .brief_info .brief_list dt {
    font-size: 15px;
    color: #655ed9;
    font-weight:bold;
  }

  .brief_info .brief_list dd {
    font-size: 18px;
    color: #8a889c;
    font-weight:bold;
  }
  .brief_info .brief_list dl:nth-of-type(1){
    margin-bottom: 10px;
  }
  .brief_result{text-align: center;}
  .brief_result img{display: block;width:100%;}
}