@charset "utf-8";
@import url("//news.chosun.com/dhtm/css/css_reset_2018.css");
@import url("//news.chosun.com/election2022/css/font.css");

/* 2018 05 */

html, body{height:100%; overflow:inherit; background-color: #fff;}
html{-webkit-text-size-adjust:none;}
body{min-width:300px;word-break:keep-all;word-wrap:break-word;white-space:inherit;color:#000;}
body, input, button, textarea{font:16px/1.3 'ChosunGothic',AppleSDGothicNeo-Regular, "맑은 고딕", "Malgun Gothic", 나눔고딕, 돋움, Dotum, 굴림, Gulim, "Apple SD Gothic Neo", sans-serif; letter-spacing:0;}
button{border:none;}
a, a:visited{color:#000; text-decoration:none;}

html,body{background-color: #f7f7f7 !important;}

/* -- 선거섹션 - 툴팁 -- */
#color-info-container {position: absolute; right: 24px; bottom: 0; z-index: 9999; font-size: 0;}
#color-info-container:hover .color-info {visibility: visible;}
.intime_render{position: absolute; left:0; bottom: 0; z-index: 9999; font-size:12px; color: #999; font-family: 'ChosunGothic',sans-serif;}
.color-info {text-align: left; position: absolute; top: -100px; right: 50%; margin-right: -10px; visibility: hidden; padding: 12px; box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.5); background-color: #5a6574; color: #ffffff; font-family: 'ChosunGothic';}
.color-info b {display: block; margin-bottom: 8px; font-size: 14px; font-weight: normal; font-family: 'ChosunGothic'; line-height: 1.43;}
.color-info ul {font-size: 0;}
.color-info li {display: flex; padding-top: 4px; font-size: 12px;}
.color-info li:first-child {padding-top: 0;}
.color-info li span {margin-right: 1px; width: 42px; height: 12px;}
.color-info li:last-child span {height: auto; font-size: 12px; font-family: 'ChosunGothic'; line-height: 1.33;}
.color-info li span:last-child {margin: 0;}
.bg-type1.color1 {background-color: #99b9e2;}
.bg-type1.color2 {background-color: #6296d8;}
.bg-type1.color3 {background-color: #3c68c8;}
.bg-type2.color1 {background-color: #e3a3a3;}
.bg-type2.color2 {background-color: #db7f7f;}
.bg-type2.color3 {background-color: #c54848;}

.election_tooltip {width: 231px; position: relative; z-index: 99999; box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.2); background-color: #fff; box-sizing: border-box; font-family: 'ChosunMGothicBold', sans-serif;}
.election_tooltip .info{padding: 0 9px; height: 39px; background: #182c45; display: flex; align-items: center; justify-content: space-between;}
.election_tooltip .info h2{font-size: 16px; color: #fff;}
.election_tooltip .info span{font-size: 12px; font-family: 'ChosunGothic',sans-serif; color: #bccbda;}
.election_tooltip .election_tooltip_top li div {padding: 4px 12px 8px 12px; display: flex; align-items: center; border-bottom: 0.5px solid rgba(34, 34, 34, .2)}
.election_tooltip .election_tooltip_top li:first-child div {padding: 10px 12px 8px 12px;}
.election_tooltip .election_tooltip_top li:last-child div {border-bottom: none;}
.election_tooltip .election_tooltip_top li b {margin-right: auto; text-align: left; font-size: 14px; color: #222; line-height: 1.43;}
.election_tooltip .election_tooltip_top li strong {display: block; font-family: 'ChosunGothic', sans-serif; font-size: 10px; color: #999; line-height: normal;}
.election_tooltip .election_tooltip_top li em {font-family: 'ChosunGothic'; font-size: 12px; color: #999; line-height: normal;}
.election_tooltip .election_tooltip_top li p {font-family: 'ChosunMGothicBold'; font-size: 20px; margin-left: 6px; line-height: 1.3;}
.election_tooltip .election_tooltip_top li p small {font-size: 12px;}
.election_tooltip .election_tooltip_bot{padding: 0 12px; border-top:8px solid #ebeef4;}
.election_tooltip .election_tooltip_bot h2{padding: 12px 0 0 0; font-size: 14px; color: #222;}
.election_tooltip .election_tooltip_bot li{display: flex; height: 40px; justify-content: space-between; align-items: center; font-size:14px; color: #222; font-family: 'ChosunMGothicBold';}
.election_tooltip .election_tooltip_bot li:first-child{border-bottom: 1px solid #eaeaea;}
.election_tooltip .election_tooltip_bot li div{display: flex; justify-content: space-between; align-items: center;}
.election_tooltip .election_tooltip_bot .num{font-size: 16px; color: #a45353;}
.election_tooltip .election_tooltip_bot li:first-child .num{color: #526ba1;}
.election_tooltip .election_tooltip_bot .num em{font-size: 12px;}
.election_tooltip .election_tooltip_bot .icon{display: flex; margin-left: 8px; align-items: center; justify-content: center; width: 34px; height: 19px; font-size: 12px; background-color: #8f8f8f; color: #fff; border-radius: 16px; overflow: hidden; font-family: 'ChosunMGothicBold';}


.election_tooltip .election_tooltip_flex{display: flex; align-items: center;}
.election_tooltip .elected_icon{width: 42px; height: 24px; position: relative; top:-3px;}
.election_tooltip .elected_icon img{width: 100%;}

@media all and (max-width: 790px) {
  .election-tooltip-box {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 20; pointer-events: all;}
  .close-btn {position: absolute; right: 0; top: -30px; display: block; width: 24px; height: 24px; background: url('//news.chosun.com/election2022/img//close_btn.png') no-repeat; background-size: contain; cursor: pointer;}
  .popup-bg {position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: transparent;}
  #color-info-container{right: 0;}
  .election_tooltip.v1 {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 20; pointer-events: all;}
}

@media all and (max-width: 450px) {
}

.custom_grid{display: none;}
.custom_grid + path{display: none;}

/* -- 선거섹션 - 실시간투표중,개표중 -- */
#election2022{max-width: 940px; margin: 0 auto; font-family: 'ChosunMGothicBold', sans-serif;}
#election2022 .map_box{width: 100%; height: 100%; padding: 30px 30px 72px 10px; max-height: 647px; max-height: 740px; position: relative; box-sizing: border-box; z-index: 20;}
#election2022.section_counting .map_box{margin-top: 50px}
#election2022.section_counting .title_wrap{display: flex; justify-content: space-between; align-items: center;}
#election2022.section_counting .title_wrap .title_countVotes{font-size: 14px; color: #707070; font-family: 'ChosunGothic', sans-serif; padding-bottom: 6px;}
#election2022 .map_box.drilldown path{cursor: default !important;}
#election2022 .election_container{padding: 12px 16px 16px 16px; background-color: #ebeef4; border: 1px solid #eaeaea;}
#election2022 .map_container{display: flex; justify-content: space-between; width: 100%;}
#election2022 .map_container .left{width: 100%; position: relative; flex:1; min-width:0}
#election2022 .map_container .right{max-width: 416px; width: 100%;}
#election2022 .ele_layout_box{background: #fff; border-radius: 5px; padding: 16px 20px 20px; margin-top: 16px; box-sizing: border-box; overflow: hidden;}
#election2022 .ele_layout_box:first-child{margin-top: 0;}
#election2022 .ele_layout_box .info .tt{margin-bottom: 16px; font-size: 20px; color: #222;}
#election2022 .ele_layout_box .info .bot{display: flex; flex-wrap: wrap;}
#election2022 .ele_layout_box .info .bot p{display: flex; font-size: 18px; color: #222; align-items: center;}
#election2022 .ele_layout_box .info .bot p:first-child{margin-right: 38px;}
#election2022 .ele_layout_box .info .bot p span{margin-right: 8px; font-size: 15px; color: #707070;}
#election2022 .ele_layout_box .info .bot p.column{margin-top: 16px;}
#election2022 .ele_layout_box .title{font-size: 18px; padding-bottom: 8px;}
#election2022 .realtime_wrap{height: 292px;}
#election2022 .realtime_wrap .label_wrap{display: flex; justify-content: space-between;}
#election2022 .realtime_wrap .label_wrap .txt{font-size: 12px; color: #999; font-family: 'ChosunGothic', sans-serif;}
#election2022 .realtime_wrap .label{display: flex; margin-bottom: 15px;}
#election2022 .realtime_wrap .label li{font-size: 12px; line-height: 1.1; color: #999; font-family: 'ChosunGothic', sans-serif; display: flex; align-items: center;}
#election2022 .realtime_wrap .label li:first-child{margin-right: 8px;}
#election2022 .realtime_wrap .label li:before{display: block; width: 10px; height: 10px; margin-right: 4px; background-color: #3D517A; border-radius: 100%; content: '';}
#election2022 .realtime_wrap .label li:last-child:before{background-color: #C2C6CD;}
#election2022 .realtime_ele{height: 195px;}
#election2022 #columnChart{height: 230px;}
/* #election2022 .bar_wrap{height: 251px;} */
#election2022 .bar_wrap{height: 251px;}
#election2022 .bar_ele{height: 195px;}
/* #election2022 #columnChart{height: 195px;} */
#election2022 .bottom_chart_wrap{display: flex; justify-content: space-between; width: 100%; margin-top: 20px; padding-top: 20px; border-top: 1px solid #d7d7d7;}
#election2022 .bottom_chart_wrap .left_ly{max-width: 480px; width: 100%;}
#election2022 .bottom_chart_wrap .right_ly{max-width: 416px; width: 100%;}

#election2022 .realtime_wrap .lable_jd_name{display: flex; margin-bottom: 15px;}
#election2022 .realtime_wrap .lable_jd_name li{font-size: 12px; line-height: 1.1; color: #999; font-family: 'ChosunGothic', sans-serif; display: flex; align-items: center;}
#election2022 .realtime_wrap .lable_jd_name li:first-child{margin-right: 8px;}
#election2022 .realtime_wrap .lable_jd_name li span{width: 10px; height: 10px; border-radius: 100%; margin-right: 4px;}

#election2022 .column_wrap{height: 292px;}
#election2022 .column_wrap .dataLabel .max{font-size: 16px; font-family: 'ChosunMGothicBold';}
#election2022 .column_wrap .dataLabel .small{font-size: 12px;}
#election2022 .column_wrap .title{padding-bottom: 28px;}
#election2022 .column_wrap .lable_jd_name{display: flex; margin-bottom: 15px;}
#election2022 .column_wrap .lable_jd_name li{font-size: 12px; line-height: 1.1; color: #999; font-family: 'ChosunGothic', sans-serif; display: flex; align-items: center;}
#election2022 .column_wrap .lable_jd_name li:first-child{margin-right: 8px;}
#election2022 .column_wrap .lable_jd_name li span{width: 10px; height: 10px; border-radius: 100%; margin-right: 4px;}

.turnout_map_tooltip{width: 210px; position: relative; z-index: 999999;}
.turnout_map_tooltip .top{height: 39px; padding: 0 12px; display: flex; align-items: center; justify-content: space-between; font-size: 12px; font-family: 'ChosunGothic', sans-serif; color: #bccbda; background: #182c45;}
.turnout_map_tooltip .top .dis_name{color: #fff; font-size: 16px; font-family: 'ChosunMGothicBold',sans-serif;}
.turnout_map_tooltip .bot{height: 39px; padding: 0 12px; display: flex; align-items: center; justify-content: space-between; font-size: 15px; font-family: 'ChosunGothic', sans-serif; color: #222; background: #fff;}
.turnout_map_tooltip .bot .turnout{font-size: 20px; font-family: 'ChosunMGothicBold',sans-serif; color: #222;}
.turnout_map_tooltip .bot .turnout span{font-size: 12px; font-family: 'ChosunMGothicBold',sans-serif;}

/* .section_turnout .map_container{max-height: 740px;} */
.section_turnout .bg-type1.color1 {background-color: #c8d4ed;}
.section_turnout .bg-type1.color2 {background-color: #7892c5;}
.section_turnout .bg-type1.color3 {background-color: #3d517a;}

/* .map_box::after {content: ""; display: block; width: 46px; height: 43px; position: absolute; right: 34px; top: 224px; background: url('//news.chosun.com/election2022/img/ulleungdo_bg.svg') no-repeat; z-index: -1; background-size: cover;}
.map_box::before {content: ""; display: block; width: 116px; height: 63px; position: absolute; left: 26px; bottom: 65px; background: url('//news.chosun.com/election2022/img/jejudo_bg.svg') no-repeat; z-index: -1; background-size: cover;} */
.section_turnout .map_box::after{right: 52px; top: 208px;}
.section_turnout .map_box::before{width: 100px; height: 57px; left:47px;}

/* 3D517A 20 */
/* C2C6CD 19 */

.line_tooltip{width: 109px; padding: 8px 12px; background: #fff; border: 1px solid #d7d7d7; box-sizing: border-box; font-family: 'ChosunMGothicBold',sans-serif; z-index: 9999;}
.line_tooltip .tt{font-size: 14px; margin-bottom: 4px; padding: 0;}
.line_tooltip li{font-size: 14px; margin-top: 2px; color: #222; font-family: 'ChosunGothic', sans-serif; display: flex; align-items: center;}
.line_tooltip li:first-child{margin-top: 0;}
.line_tooltip li::before{display: block; width: 10px; height: 10px; margin-right: 4px; border-radius: 100%; content: '';}
.line_tooltip li span{font-family: 'ChosunMGothicBold',sans-serif; margin-right: 4px;}
.line_tooltip li.bg2::before{background-color: #3D517A;}
.line_tooltip li.bg2 span{color: #3D517A;}
.line_tooltip li.bg1::before{background-color: #C2C6CD;}
.line_tooltip li.bg1 span{color: #C2C6CD;}
.line_tooltip2{width: 109px; padding: 8px 12px; background: #fff; border: 1px solid #d7d7d7; box-sizing: border-box; font-family: 'ChosunMGothicBold',sans-serif; z-index: 9999;}
.line_tooltip2 .tt{font-size: 14px; margin-bottom: 4px; padding: 0;}
.line_tooltip2 li{font-size: 14px; margin-top: 2px; color: #222; font-family: 'ChosunGothic', sans-serif; display: flex; align-items: center;}
.line_tooltip2 li:first-child{margin-top: 0;}
.line_tooltip2 li span{width: 10px; height: 10px; border-radius: 100%; margin-right: 4px;}

.counting_module .map_box::after,.counting_module .map_box::before{display: none;}
.map_box.drilldown::after {display: none;}
.map_box.drilldown::before {display: none;}
.map-datalabel {text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.7); font-size: min(12px,12px);}

.iframe-slider {font-family: 'ChosunGothic', sans-serif; position: relative; background: #ebeef4; padding: 20px 0 15px 0; border-top:1px solid #d7d7d7; margin-top: 28px;}
.iframe-slider strong {padding-left: 8px; font-size: 18px; font-family: "ChosunMGothicBold",sans-serif;}
.slider-cont {margin-top: 14px; }
.slider-item {display: flex; }
.slider-item-inner {flex: 1 1 24%; position: relative; margin: 0 4px; height: 410px; background: #fff; box-sizing: border-box; text-align: left; border: 1px solid #d7d7d7; border-radius: 5px;}
.photo_box {display: flex; align-items: end; height: 110px; border-radius: 4px 4px 0 0; justify-content: space-between; padding-left: 16px; position: relative;}
.photo_box img {display: flex; width: 118px; height: 104px; position: absolute; bottom: 0; right: 0; z-index: 999;}
.photo_box.num01 {background-color: #3c68c8;}
.photo_box.num01::before {content: ""; background: url('//image.chosun.com/2022election/candidate/number01-bg.png') no-repeat 0px 0px; background-size: cover; display: inline-block; height: 110px; width: 140px; position: absolute; right: 0;}
.photo_box.num02 {background-color: #bd3131;}
.photo_box.num02::before {content: ""; background: url('//image.chosun.com/2022election/candidate/number02-bg.png') no-repeat 0px 0px; background-size: cover; display: inline-block; height: 110px; width: 140px; position: absolute; right: 0;}
.photo_box.num03 {background-color: #f8c807;}
.photo_box.num03::before {content: ""; background: url('//image.chosun.com/2022election/candidate/number03-bg.png') no-repeat 0px 0px; background-size: cover; display: inline-block; height: 110px; width: 140px; position: absolute; right: 0;}
.photo_box.num04 {background-color: #ee8431;}
.photo_box.num04::before {content: ""; background: url('//image.chosun.com/2022election/candidate/number04-bg.png') no-repeat 0px 0px; background-size: cover; display: inline-block; height: 110px; width: 140px; position: absolute; right: 0;}
.photo_box.num05 {background-color: #00b1a0;}
.photo_box.num05::before {content: ""; background: url('//image.chosun.com/2022election/candidate/number05-bg.png') no-repeat 0px 0px; background-size: cover; display: inline-block; height: 110px; width: 140px; position: absolute; right: 0;}
.photo_box.num06 {background-color: #c71f1e;}
.photo_box.num06::before {content: ""; background: url('//image.chosun.com/2022election/candidate/number06-bg.png') no-repeat 0px 0px; background-size: cover; display: inline-block; height: 110px; width: 140px; position: absolute; right: 0;}
.photo_box.num07 {background-color: #c54848;}
.photo_box.num07::before {content: ""; background: url('//image.chosun.com/2022election/candidate/number07-bg.png') no-repeat 0px 0px; background-size: cover; display: inline-block; height: 110px; width: 140px; position: absolute; right: 0;}
.photo_box.num08 {background-color: #be1c40;}
.photo_box.num08::before {content: ""; background: url('//image.chosun.com/2022election/candidate/number08-bg.png') no-repeat 0px 0px; background-size: cover; display: inline-block; height: 110px; width: 140px; position: absolute; right: 0;}
.photo_box.num09 {background-color: #54b978;}
.photo_box.num09::before {content: ""; background: url('//image.chosun.com/2022election/candidate/number09-bg.png') no-repeat 0px 0px; background-size: cover; display: inline-block; height: 110px; width: 140px; position: absolute; right: 0;}
.photo_box.num10 {background-color: #914f88;}
.photo_box.num10::before {content: ""; background: url('//image.chosun.com/2022election/candidate/number10-bg.png') no-repeat 0px 0px; background-size: cover; display: inline-block; height: 110px; width: 140px; position: absolute; right: 0;}
.photo_box.num11 {background-color: #43974f;}
.photo_box.num11::before {content: ""; background: url('//image.chosun.com/2022election/candidate/number11-bg.png') no-repeat 0px 0px; background-size: cover; display: inline-block; height: 110px; width: 140px; position: absolute; right: 0;}
.photo_box.num12 {background-color: #ca3537;}
.photo_box.num12::before {content: ""; background: url('//image.chosun.com/2022election/candidate/number12-bg.png') no-repeat 0px 0px; background-size: cover; display: inline-block; height: 110px; width: 140px; position: absolute; right: 0;}
.photo_box.num13 {background-color: #255aa5;}
.photo_box.num13::before {content: ""; background: url('//image.chosun.com/2022election/candidate/number13-bg.png') no-repeat 0px 0px; background-size: cover; display: inline-block; height: 110px; width: 140px; position: absolute; right: 0;}
.photo_box.num14 {background-color: #573590;}
.photo_box.num14::before {content: ""; background: url('//image.chosun.com/2022election/candidate/number14-bg.png') no-repeat 0px 0px; background-size: cover; display: inline-block; height: 110px; width: 140px; position: absolute; right: 0;}
.photo_box .info {align-self: center; font-size: 12px; color: #fff;}
.photo_box .info .info-inner {display: grid;}
.photo_box .info .number {display: flex; align-items: center; justify-self: start; height: 20px; padding: 0 8px; border-radius: 11px; font-family: "ChosunMGothicBold",sans-serif; background-color: rgba(255, 255, 255, 0.4); text-align: center;}
.photo_box .info strong {font-size: 22px; padding:0; font-family: "ChosunMGothicBold",sans-serif; padding:8px 0 6px 0}
.slider-item-inner dl{display: flex; padding-top: 10px; line-height: 1.53;}
.slider-item-inner dl:first-child {padding: 0}
.slider-item-inner dl dt{ margin-right: 8px; color:#707070; font-family: "ChosunGothic",sans-serif; font-size: 15px;}
.slider-item-inner dl dd{font-size: 15px; word-break: break-all;}
.slider-item-inner dl dd span {display: flex;}
.des {padding:14px 16px 0 16px }
.btn-go {position: absolute; bottom:0; width: 100%; text-align: center; border-top: 1px solid #ebeef4; padding: 12px 0}
.btn-go a {display: inline-flex; color: #222; font-size: 14px;}
.btn-go a:after {content: ""; display:inline-block; background: url('//image.chosun.com/2022election/candidate/icon-arrow-2x.png') no-repeat 0px 0px; background-size: 100%; width: 20px; height: 20px}
.button_controls {position: absolute; right: 16px; top: 20px; display: flex;}
.slider_btn {background: #fff; height: 28px; width: 28px;}
.arrow-left-img {display: inline-block; background: url('//image.chosun.com/2022election/candidate/icon-arrow-prev_2x.png') no-repeat 0px 0px; background-size: 100%; width: 20px; height: 20px; margin-top: 4px;}
.arrow-right-img {display: inline-block; background: url('//image.chosun.com/2022election/candidate/icon-arrow-next_2x.png') no-repeat 0px 0px; background-size: 100%; width: 20px; height: 20px; margin-top: 4px;}
.pagingText {display: flex; width: 38px; align-items: center; padding: 0 9px; font-size: 15px; justify-content: center;}
.slick-dots {display: none!important}
@media all and (max-width:686px){
  .iframe-slider {padding: 22px 0 15px 0; }
  .iframe-slider strong {font-size: 16px;}
  .slider-item-inner {height: 396px;}
  .slider-item-inner dl dd{ font-size: 16px;}
  .photo_box .info {display: flex;}
  .photo_box .info .info-inner {margin-right: 4px;}
  .photo_box .info .group-name {margin-top:35px; font-size: 14px;}
  .button_controls {top: 18px;}
}

@media all and (max-width: 790px) {
  #election2022.section_counting .map_box{margin-top: 0;}
  #election2022 .election_container{padding: 27px 8px 12px;}
  #election2022 .map_container{flex-direction: column;}
  #election2022 .map_box{width: 405px; height: 600px; padding: 0 0 30px; margin: 0 auto;}
  #color-info-container{bottom: 24px;}
  .intime_render{bottom: 24px;}
  #election2022 .map_container .right{max-width: 100%;}
  #election2022.section_counting .title_wrap .title_countVotes{font-size: 12px;}

  #election2022 .ele_layout_box{padding:16px 12px 20px 12px; margin-top: 12px; width: 100%; height: auto;}
  #election2022 .ele_layout_box .info .tt{font-size: 18px; margin-bottom: 12px;}
  #election2022 .ele_layout_box .info .bot{flex-direction: column;}
  #election2022 .ele_layout_box .info .bot p span{font-size: 16px;}
  #election2022 .ele_layout_box .info .bot p:first-child{margin-bottom: 6px;}
  #election2022 .ele_layout_box .info .bot p.column{margin-top: 6px;}

  #election2022 .bottom_chart_wrap{flex-direction: column; margin-top: 16px; padding-top: 16px;}
  #election2022 .column_wrap.ele_layout_box{margin-top: 12px;}

  #election2022 .bottom_chart_wrap .left_ly{max-width: 100%;}
  #election2022 .bottom_chart_wrap .right_ly{max-width: 100%;}
  #election2022 #columnChart{height: 195px;}

  #election2022 .map_box::before {width: 100px; height: 56px; left:16px; bottom: 24px;}
  #election2022 .map_box::after {right:0; top:170px;}
}

@media all and (max-width: 480px) {
  #election2022 .map_box{width: 320px; overflow: visible !important;}
  #election2022 .map_box::before {width: 86px; height: 44px; left:0; bottom: 65px;}
  #election2022 .map_box::after {width: 36px; height: 28px; right:-8px; top:192px;}

  /* #election2022.section_turnout .map_box::after{width: 30px; right: -5px; top: 196px;} */
  /* #election2022.section_turnout .map_box::before{width: 100px; height: 57px; left:47px;} */
}

@media all and (max-width: 414px) {
  #election2022 .map_box{width: 320px; overflow: hidden !important;}
  #election2022 .map_box {width: 300px; margin: 0 auto;}
  #election2022 .map_box::before {width: 86px; height: 44px; left:0; bottom: 78px;}
  #election2022 .map_box::after {width: 30px; height: 28px; right:-8px; top:199px;}
  #election2022 .ele_layout_box .title.dugsu{font-size: 15px;}
  #election2022 .ele_layout_box .title{font-size: 16px;}
}

/* -- 메인 투표율 배너 -- */
.turnout_banner{font-family: 'ChosunMGothicBold', sans-serif; width: 100%; height: 136px; margin: 0 auto; overflow: hidden;}
.turnout_banner .tt{font-size: 15px; color: #222;}
.turnout_banner .num{font-size: 38px; color: #222; position: relative; z-index: 99;}
.turnout_banner .val{font-size: 28px;}
.turnout_banner .per{font-size: 18px;}
.turnout_banner .top {display: flex; justify-content: space-between; height: 36px; padding: 10px; box-sizing: border-box; background: url('//news.chosun.com/election2022/pe/img//path-4%402x.png') 0 0 no-repeat; background-size: 100% 100%;}
.turnout_banner .top h1{font-size: 15px; color: #fff;}
.turnout_banner .top p{font-size: 12px; color: #d7d7d7; font-family: 'ChosunGothic', sans-serif; }
.turnout_banner .bot {display: flex; align-items: center; justify-content: center; text-align: center; height: 100px; background-color: #fff; position: relative;}
.turnout_banner .bot:after{position: absolute; left:0; bottom: 0; width: 85px; height: 98px; background: url('http://news.chosun.com/election2022/pe/img//banner_icon.png') 0 0 no-repeat; background-size: 100%; content: "";}
.turnout_banner .item{width: 50%; box-sizing: border-box;}
.turnout_banner .item:last-child{border-left: 1px solid #eaeaea;}
.turnout_banner .slider_wrap{position: relative;}
.turnout_banner .btns{width: 127px; position: absolute; top:25px; left:50%; transform: translateX(-50%); height: 24px; z-index: 9999;}
.turnout_banner .btns button{width: 24px; height: 24px;}
.turnout_banner .btns button img{width: 100%;}
.turnout_banner .btns .prev{position: absolute; left:0;}
.turnout_banner .btns .next{position: absolute; right:0;}
.turnout_banner .btns .next img{transform: rotateY(180deg);}
.turnout_banner .slider{position: relative; overflow: hidden; margin: 0 auto; width: 150px;}
/* .turnout_banner .slider_cont{display: flex; transition: all 0.3s ease-out;}
.turnout_banner .slider_item{flex-basis: 150px; width: 150px;} */
.turnout_banner .slider-item{min-height: 60px;}
.turnout_banner .slider_cont{display: block; transition: all 0.3s ease-out;}
.turnout_banner .slider_cont:after{display: block; content: ""; clear: both;}
.turnout_banner .slider_item{flex-basis: 150px; width: 150px; float: left;}

/* -- 닷컴메인 개표중 모듈 -- */
.counting_module{width: 100%; max-width: 452px; height: 100%; font-family: 'ChosunMGothicBold', sans-serif; background-color: #fff; box-sizing: border-box;}
.counting_main .map_box{padding-bottom: 78px;}
.counting_module .intime_render{left: 20px; bottom: 20px;}
.counting_module #color-info-container{right: 20px; bottom: 20px;}
.counting_module .top{display: flex; margin-bottom: 36px; justify-content: space-between; align-items: center; width: 100%; height: 76px; padding: 0 20px; box-sizing: border-box; text-align: center; background: url("//news.chosun.com/election2022/pe/img//counting_bg.png") 0 0 no-repeat; background-size: 100% 100%;}
.counting_module.bType .top{margin-bottom: 24px;}
.counting_module .top h1{font-size: 23px; color: #fff; display: flex; align-items: center;}
.counting_module .top h1:before{display: inline-block; width: 29px; height: 34px; margin-right: 8px; background: url("//news.chosun.com/election2022/pe/img//counting_icon.png") 0 0 no-repeat; background-size: 100%; content: ''; vertical-align: middle;}
.counting_module .top ul{display: flex;}
.counting_module .top ul li:first-child{margin-right: 19px;}
.counting_module .top .tt{font-size: 14px; color: #fff; font-family: 'ChosunGothic', sans-serif;}
.counting_module .top .num{font-size: 18px; font-family: 'ChosunMGothicBold', sans-serif; color: #fff ;}
.counting_module .map_cont{width: 100%; position: relative; box-sizing: border-box;}

.candidate_bar_chart {margin-bottom: 37px; padding: 0 20px; box-sizing: border-box;}
.candidate_bar_chart .info{display: flex; justify-content: space-between;}
.candidate_bar_chart .candidate{display: flex; align-items: center;}
.candidate_bar_chart .thumb{width:60px; height:60px; border-radius:100%; overflow:hidden;}
.candidate_bar_chart .thumb img{width:100%;}
.candidate_bar_chart .elected_icon{display: block; width: 42px; height: 24px;}
.candidate_bar_chart .elected_icon img{width: 100%;}
.candidate_bar_chart .name{display: flex; align-items: center; margin-bottom: 4px; font-size: 15px; color: #222; font-family: 'ChosunMGothicBold', sans-serif;}
.candidate_bar_chart .name span{font-size: 12px; color: #707070; font-family: 'ChosunGothic', sans-serif;}
.candidate_bar_chart .num{display: flex; font-size: 28px; line-height: 1.1; color: #c54848; font-family: 'ChosunMGothicBold', sans-serif;}
.candidate_bar_chart .num span{font-size: 15px;}
.candidate_bar_chart .left .thumb{margin-right: 4px;}
.candidate_bar_chart .right .thumb{margin-left: 4px;}
.candidate_bar_chart .left .name{justify-content: start;}
.candidate_bar_chart .left .name span{margin-left: 4px;}
.candidate_bar_chart .right .name{justify-content: end;}
.candidate_bar_chart .right .name span{margin-right: 4px;}
.candidate_bar_chart .x_bar{width: 100%; height: 20px; margin-top: 8px; background-color: #f7f7f7; position: relative;}
.candidate_bar_chart .x_bar .bar1{width:0; height: 100%; position:absolute; left:0; top:0; text-align:left; transform-origin:0 0; animation: right-animate 1.5s ease alternate;}
.candidate_bar_chart .x_bar .bar2{width:0; height: 100%; position:absolute; right:0; top:0; text-align:right; transform-origin:100% 100%; animation: right-animate 1.5s ease alternate;}
.candidate_bar_chart .votes {display: flex; justify-content: space-between; font-size:12px; color: #999;}
.candidate_bar_chart .votes div{padding-top: 4px;}
.candidate_bar_chart .votes .mid{font-size: 10px; position: relative; padding-top: 6px;}
.candidate_bar_chart .votes .mid:after{position: absolute; left:50%; margin-left: -3px; top:0; width:6px; height:4px; background: url('http://news.chosun.com/election2022/pe/img//triangle.png') 0 0 no-repeat; background-size:100% 100%; content:'';}

.counting_module .intime_render{left: 16px; bottom: 16px;}
.counting_module #color-info-container{right: 12px; bottom: 16px;}


@media all and (max-width: 790px) {
  /* -- 닷컴메인 개표중 모듈 -- */
  .counting_module{width: 100%; max-width: 452px; height: 100%; font-family: 'ChosunMGothicBold', sans-serif; background-color: #fff; box-sizing: border-box;}
  /* .counting_main .map_box{width: 100%; height: 100%; max-height: 740px; padding: 0; position: relative; z-index: 999; box-sizing: border-box;} */

  .counting_main .map_box{padding-bottom: 78px; height: 600px; padding: 0 0 30px;}
  .counting_main .map_container{padding: 0 8px 12px;}

  .counting_module .intime_render{left: 20px; bottom: 20px;}
  .counting_module #color-info-container{right: 20px; bottom: 20px;}
  .counting_module .top{display: flex; margin-bottom: 36px; justify-content: space-between; align-items: center; width: 100%; height: 76px; padding: 0 20px; box-sizing: border-box; text-align: center; background: url("//news.chosun.com/election2022/pe/img//counting_bg.png") 0 0 no-repeat; background-size: 100% 100%;}
  .counting_module .top h1{font-size: 23px; color: #fff; display: flex; align-items: center;}
  .counting_module .top h1:before{display: inline-block; width: 29px; height: 34px; margin-right: 8px; background: url("//news.chosun.com/election2022/pe/img//counting_icon.png") 0 0 no-repeat; background-size: 100%; content: ''; vertical-align: middle;}
  .counting_module .top ul{display: flex;}
  .counting_module .top ul li:first-child{margin-right: 19px;}
  .counting_module .top .tt{font-size: 14px; color: #fff; font-family: 'ChosunGothic', sans-serif;}
  .counting_module .top .num{font-size: 18px; font-family: 'ChosunMGothicBold', sans-serif; color: #fff ;}
  .counting_module .map_cont{width: 100%; position: relative; box-sizing: border-box;}

  .candidate_bar_chart {/*margin-bottom: 37px;*/ padding: 0 20px; box-sizing: border-box;}
  .candidate_bar_chart .info{display: flex; justify-content: space-between;}
  .candidate_bar_chart .candidate{display: flex; align-items: center;}
  .candidate_bar_chart .thumb{width:60px; height:60px; border-radius:100%; overflow:hidden;}
  .candidate_bar_chart .thumb img{width:100%;}
  .candidate_bar_chart .elected_icon{display: block; width: 42px; height: 24px;}
  .candidate_bar_chart .elected_icon img{width: 100%;}
  .candidate_bar_chart .name{display: flex; align-items: center; margin-bottom: 4px; font-size: 15px; color: #222; font-family: 'ChosunMGothicBold', sans-serif;}
  .candidate_bar_chart .name span{font-size: 12px; color: #707070; font-family: 'ChosunGothic', sans-serif;}
  .candidate_bar_chart .num{display: flex; font-size: 28px; line-height: 1.1; color: #c54848; font-family: 'ChosunMGothicBold', sans-serif;}
  .candidate_bar_chart .num span{font-size: 15px;}
  .candidate_bar_chart .left .thumb{margin-right: 4px;}
  .candidate_bar_chart .right .thumb{margin-left: 4px;}
  .candidate_bar_chart .left .name{justify-content: start;}
  .candidate_bar_chart .left .name span{margin-left: 4px;}
  .candidate_bar_chart .right .name{justify-content: end;}
  .candidate_bar_chart .right .name span{margin-right: 4px;}
  .candidate_bar_chart .x_bar{width: 100%; height: 20px; margin-top: 8px; background-color: #f7f7f7; position: relative;}
  .candidate_bar_chart .x_bar .bar1{width:0; height: 100%; position:absolute; left:0; top:0; text-align:left; transform-origin:0 0; animation: right-animate 1.5s ease alternate;}
  .candidate_bar_chart .x_bar .bar2{width:0; height: 100%; position:absolute; right:0; top:0; text-align:right; transform-origin:100% 100%; animation: right-animate 1.5s ease alternate;}
  .candidate_bar_chart .votes {display: flex; justify-content: space-between; font-size:12px; color: #999; font-family: 'ChosunGothic', sans-serif;}
  .candidate_bar_chart .votes div{padding-top: 4px;}
  .candidate_bar_chart .votes .mid{font-size: 10px; position: relative; padding-top: 6px;}
  .candidate_bar_chart .votes .mid:after{position: absolute; left:50%; margin-left: -3px; top:0; width:6px; height:4px; background: url('http://news.chosun.com/election2022/pe/img//triangle.png') 0 0 no-repeat; background-size:100% 100%; content:'';}

  .counting_module #color-info-container{right: 12px; bottom: 16px;}
}

@media all and (max-width: 450px) {
  .counting_module .intime_render{left: 12px; bottom: 16px;}
  .counting_module{height: auto;}
  .counting_module.bType{height: 240px;}
  .counting_module .top{margin-bottom: 22px; padding: 0 12px;}
  .counting_module.bType .top{margin-bottom: 16px;}
  .counting_module .top h1{font-size: 20px;}
  .counting_module .map_cont{padding-bottom: 0;}
  /* .counting_module .map_box{width: 320px; height: 600px; margin: 0 auto; padding: 0 30px 65px 10px; max-height: 740px; position: relative; z-index: 999; box-sizing: border-box;} */

  .candidate_bar_chart{padding: 0 12px;}
  .counting_module.bType .candidate_bar_chart{margin-bottom: 0;}
  .candidate_bar_chart .thumb {width: 40px; height: 40px;}
  .candidate_bar_chart .name{font-size: 14px;}
  .candidate_bar_chart .num{font-size: 24px;}
  .candidate_bar_chart .num span{font-size: 14px;}

  .counting_module .map_box::before {width: 86px; height: 44px; left:14px; bottom: 59px;}
  .counting_module .map_box::after {width: 36PX; height: 28px; right:26px; top:119px;}
}

@media all and (max-width: 414px) {
  .counting_main .map_box {width: 320px; height: 570px; margin: 0 auto;}
}

@media all and (max-width: 413px) {
  .counting_main .map_box {width: 300px; height: 520px; margin: 0 auto;}
}

@keyframes opacity-animate {
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}

@keyframes right-animate {
  0% {
    opacity:0;
    transform: scaleX(0);
  }
  100% {
    opacity:1;
    transform: scaleX(100%);
  }
}

#barChart .add_icon {width: 52px; height: 34px; background: url("http://news.chosun.com/election2022/chart/img//copy-2.png"); background-size: 100% 100%; text-indent: -9999;}
#barChart .bar_item {margin-top: 17px;}
#barChart .bar_item:first-child {margin-top: 13px;}
#barChart .bar_item .item_in {display: flex; justify-content: flex-end;}
#barChart .bar_item .hubo_info {display: flex; margin-right: auto; align-items: center;}
#barChart .bar_item .hubo_info .hubo_pic {width: 48px; height: 48px; overflow: hidden; border-radius: 100%;}
#barChart .bar_item .hubo_info .hubo_pic img {width: 100%;}
#barChart .bar_item .hubo_info .hubo_name {margin-left: 8px;}
#barChart .bar_item .hubo_info .hubo_name .name {display: flex; align-items: center; font-size: 16px; color: #222; font-family: 'ChosunMGothicBold';}
#barChart .bar_item .hubo_info .hubo_name .name .elected_icon{width: 42px; height: 24px; position: relative; top:-3px}
#barChart .bar_item .hubo_info .hubo_name .name .elected_icon img{width: 100%;}
#barChart .bar_item .hubo_info .hubo_name .jd_name {font-family: 'ChosunGothic'; font-size: 12px; color: #707070;}
#barChart .bar_item .vote_num {text-align: center;}
#barChart .bar_item .vote_num .num1 {font-size: 23px; font-family: 'ChosunMGothicBold';}
#barChart .bar_item .vote_num .num2 {font-size: 12px; color: #999; font-family: 'ChosunGothic';}
#barChart .bar_item .vote_num .per{font-size: 15px;}
#barChart .bar_wrap {width: 100%; height: 12px; background: #f7f7f7; margin-top: 4px; position: relative;}
#barChart .bar_wrap .bar {height: 100%; position: absolute; left: 0; top: 0; transform-origin: 0 0; animation: right-animate 1.5s ease alternate;}
#barChart ul{width: 100%; padding-top: 20px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap;}
#barChart ul li{flex-basis: 178px; border-bottom: 1px solid #eaeaea; padding-bottom: 8px; margin-bottom: 8px;}
#barChart ul li .inner{display: flex; justify-content: space-between; align-items: center;}
#barChart ul li .flex_wrap{display: flex; justify-content: space-between; align-items: center;}
#barChart ul .bar_wrap{display: none;}
#barChart ul .pic{width: 48px; height: 48px; margin-right: 4px; overflow: hidden; border-radius: 100%;}
#barChart ul .pic img{width: 100%;}
#barChart ul .info .name{font-family: 'ChosunMGothicBold'; font-size: 16px; color: #222;}
#barChart ul .info .jd_name{font-family: 'ChosunGothic'; font-size: 12px; color: #707070;}
#barChart ul .num1{font-size: 23px; color: #666;}
#barChart ul .num1 em{font-size: 15px;}
#barChart ul .num2{font-family: 'ChosunGothic'; font-size: 12px; color: #707070; text-align: right;}

#barChart .module_inner{padding: 16px 20px 12px 20px; background-color: #fff; border:1px solid #eaeaea;}
#barChart .module_header{margin-bottom: 16px; display: flex; align-items: center; justify-content: space-between;}
#barChart .module_header .module_tt{font-size: 18px; color: #222; font-family: 'ChosunMGothicBold', sans-serif;}
#barChart .module_header .module_counting{font-size: 14px; font-family: 'ChosunGothic', sans-serif; color: #707070;}
#barChart .module_inner .intime_render_b{padding-top: 12px; position: relative; font-size:12px; color: #999;}



@media all and (max-width: 790px) {
  #barChart ul li{flex-basis: 100%;}
  #barChart ul .bar_wrap{display: block;}
}

@media all and (max-width: 780px) {
  #barChart_wrap {padding: 16px 12px 20px 12px;}
  .column_chart_wrap {padding: 16px 12px 20px 12px;}
  .bar_item .vote_num .num1 {font-size: 24px;}
  .bar_item .vote_num .per {font-size: 14px;}
}