@charset "utf-8";
/* CSS Document */


/* ====== font ======================================================================================================= */
/* Noto Sans */
@font-face {
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 100;
  src:
       url(//res.heraldm.com/font_new/NotoSansKR-Thin.woff2) format('woff2'),
	   url(//res.heraldm.com/font_new/NotoSansKR-Thin.woff) format('woff'),
	   url(//res.heraldm.com/font_new/NotoSansKR-Thin.otf.eot) format('eot'),
       url(//res.heraldm.com/font_new/NotoSansKR-Thin.otf) format('opentype');
}
@font-face {
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 200;
  src:
       url(//res.heraldm.com/font_new/NotoSansKR-Light.woff2) format('woff2'),
	   url(//res.heraldm.com/font_new/NotoSansKR-Light.woff) format('woff'),
	   url(//res.heraldm.com/font_new/NotoSansKR-Light.otf.eot) format('eot'),
       url(//res.heraldm.com/font_new/NotoSansKR-Light.otf) format('opentype');
}
@font-face {
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 300;
  src:
       url(//res.heraldm.com/font_new/NotoSansKR-Regular.woff2) format('woff2'),
	   url(//res.heraldm.com/font_new/NotoSansKR-Regular.woff) format('woff'),
	   url(//res.heraldm.com/font_new/NotoSansKR-Regular.otf.eot) format('eot'),
       url(//res.heraldm.com/font_new/NotoSansKR-Regular.otf) format('opentype');
}
@font-face {
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 400;
  src:
       url(//res.heraldm.com/font_new/NotoSansKR-Medium.woff2) format('woff2'),
	   url(//res.heraldm.com/font_new/NotoSansKR-Medium.woff) format('woff'),
	   url(//res.heraldm.com/font_new/NotoSansKR-Medium.otf.eot) format('eot'),
       url(//res.heraldm.com/font_new/NotoSansKR-Medium.otf) format('opentype');
}
@font-face {
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 500;
  src:
       url(//res.heraldm.com/font_new/NotoSansKR-Bold.woff2) format('woff2'),
	   url(//res.heraldm.com/font_new/NotoSansKR-Bold.woff) format('woff'),
	   url(//res.heraldm.com/font_new/NotoSansKR-Bold.otf.eot) format('eot'),
       url(//res.heraldm.com/font_new/NotoSansKR-Bold.otf) format('opentype');
}
@font-face {
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 600;
  src:
       url(//res.heraldm.com/font_new/NotoSansKR-Black.woff2) format('woff2'),
	   url(//res.heraldm.com/font_new/NotoSansKR-Black.woff) format('woff'),
	   url(//res.heraldm.com/font_new/NotoSansKR-Black.otf.eot) format('eot'),
       url(//res.heraldm.com/font_new/NotoSansKR-Black.otf) format('opentype');
}


/* ====== common ======================================================================================================= */
.ellipsis{text-overflow:ellipsis; overflow:hidden; white-space:nowrap}
.ellipsis2, .ellipsis3{display:-webkit-box; text-overflow:ellipsis; overflow:hidden; -webkit-box-orient:vertical; word-wrap:break-word}
.ellipsis2{-webkit-line-clamp:2}
.ellipsis3{-webkit-line-clamp:3}
input, button, select, textarea{-webkit-appearance:none; border-radius:0; box-sizing:border-box}
select::-ms-expand{display:none}
/*top*/
.top{position:fixed; bottom:30px; right:15px; z-index:1; width:44px; height:44px; font-size:0; background:rgba(255,255,255,0.9); border:1px solid #ddd; transition:.3s}
.top svg{position:absolute; top:50%; left:50%; width:35%; height:35%; transform:translate(-50%, -50%); opacity:.4}
.top:hover{background:rgba(255,255,255,0.8)}


/* ====== header ======================================================================================================= */
.header{position:fixed; top:0; left:0; width:100%; z-index:10; background:#fff; font-size:0}
.header_gnb{height:50px; border-bottom:1px solid #e2e2e2}
.header_gnb_menu, .header_gnb_logo, .header_gnb_desk_bg{position:absolute; display:block}
.header_gnb_menu, .header_gnb_desk_bg{top:0}
.header_gnb_menu{left:0; z-index:1; width:52px; height:50px}
.header_gnb_desk_bg{right:0; z-index:2}
.header_gnb_logo{width:200px; height:24px; top:13px; left:50%; transform: translate(-50%, 0)}
.header svg{position:absolute}
.header_gnb_menu svg, .header_gnb_desk svg, .header_gnb_desk_sch_close svg{width:20px; height:20px; top:50%; left:50%; transform:translate(-50%, -50%)}
.header_gnb_logo svg{top:0; left:0; width:100%; height:100%}
.header_gnb_logo_h{fill:#1ba2da}
.header_gnb_logo_t{fill:#000}
.header_gnb_desk_bg{transition:.2s}
.header_gnb_desk{width:52px; height:50px; overflow:hidden; position:absolute; top:0; right:0; transition:.2s; background:#fff}
.header_gnb_desk_bg.header_gnb_desk_bg_active, .header_gnb_desk_bg.header_gnb_desk_bg_active .header_gnb_desk{width:100%}
.header_gnb_desk_input{width:calc(100% - 100px); height:50px; line-height:50px; padding:0 0 0 15px; opacity:0; position:absolute; top:0; left:0; font-size:15px; font-weight:300; color:#111; letter-spacing:-0.4px}
.header_gnb_desk_bg.header_gnb_desk_bg_active .header_gnb_desk_input{opacity:1}
.header_gnb_desk_input::-webkit-input-placeholder{color:#999}
.header_gnb_desk_input:-ms-input-placeholder{color:#999}
.header_gnb_desk_btn{width:52px; height:50px; background:transparent; position:absolute; top:0; right:0; cursor:pointer; transition:.2s; z-index:1}
.header_gnb_desk_btn svg{fill:#111; transition:all .2s cubic-bezier(0.650, -0.600, 0.240, 1.650)}
.header_gnb_desk_sch_close{position:absolute; z-index:1; width:52px; height:50px; top:0;right:-50px; cursor:pointer; opacity:0; transition:.2s}
.header_gnb_desk_bg.header_gnb_desk_bg_active .header_gnb_desk_btn{right:52px}
.header_gnb_desk_bg.header_gnb_desk_bg_active .header_gnb_desk_sch_close{opacity:1; right:0}
.header_sch{position:relative; overflow:hidden; padding:63px 15px 12px}
.header_sch input, .header_sch button{height:34px}
.header_sch input{width:100%; border-radius:6px; background:#edebec; font-size:15px; font-weight:300; color:#111; letter-spacing:-0.5px; padding:0 50px 0 15px}
.header_sch input::-webkit-input-placeholder{color:rgba(0,0,0,0.2)}
.header_sch input:-ms-input-placeholder{color:rgba(0,0,0,0.2)}
.header_sch button{width:50px; position:absolute; right:15px; background:transparent}
.header_sch button svg{position:absolute; width:18px; height:18px; top:50%; left:50%; fill:#666; transform:translate(-50%, -50%)}
/* header_all_bg */
.header_all_bg{position:fixed; top:0; left:0; width:100%; height:100%; z-index:20; background:rgba(0,0,0,0.6); animation:HeaderAllBg .3s; display:none}
@keyframes HeaderAllBg{
    from{opacity:0}
    to{opacity:1}
}
.header_all{position:fixed; overflow:hidden; top:0; left:0; width:100%; background:#fff; height:100%; box-shadow:0 0 25px rgba(0,0,0,0.5); animation:HeaderAll .3s}
@keyframes HeaderAll{
	from{left:-300px; opacity:0}
	to{left:0; opacity:1}
}
.header_all .header_gnb, .header_all .header_gnb_menu svg{position:relative}
.header_all .header_gnb_desk_btn svg, .header_all .header_gnb_desk_sch_close svg{position:absolute}
.header_all_li{font-size:0; text-align:center}
.header_all_li li{display:inline-block; margin:10px 20px; vertical-align:middle}
.header_all_li li a{display:block; position:relative; font-size:14px; font-weight:400; letter-spacing:-0.2px; color:#111; line-height:30px}
.header_all_li li a svg{position:relative; width:20px; height:20px; fill:#111; display:inline-block; vertical-align:middle; margin:-3px 5px 0 0}
.header_all_sns{font-size:0; text-align:center; background:#f2f2f2}
.header_all_sns li{display:inline-block; margin:10px 10px; vertical-align:middle}
.header_all_sns li a{display:block; width:38px; height:38px; border-radius:50%; position:relative}
.header_all_sns li:first-child a{background:rgb(24, 119, 242)}
.header_all_sns li:nth-child(2) a{background:#1da1f2}
.header_all_sns li:nth-child(3) a{background:#ff0000}
.header_all_sns li:nth-child(4) a{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ed001b+0,c6008d+100 */
background: rgb(237,0,27); /* Old browsers */
background: -moz-linear-gradient(left,  rgba(237,0,27,1) 0%, rgba(198,0,141,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(237,0,27,1) 0%,rgba(198,0,141,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(237,0,27,1) 0%,rgba(198,0,141,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ed001b', endColorstr='#c6008d',GradientType=1 ); /* IE6-9 */

}
.header_all_sns li a svg{position:absolute; top:50%; left:50%; transform: translate(-50%, -50%); width:55%; height:55%; fill:#fff}
.header_all_acc_bg{position:relative; overflow-y:scroll; height:calc(100% - 270px); border-bottom:1px solid #eee}
.header_all_acc_bg_most{position:relative; overflow:hidden}
.header_all_acc_bg_most a{display:inline-block; font-size:15px; line-height:26px; font-weight:500; letter-spacing:-0.4px; color:#fff; background:#111; border-radius:3px; margin:10px 15px; padding:0 10px}
.header_all_acc_bg_check{float:right !important; background:none !important; color:#111 !important; padding:0 !important;}/*topics svg 200911_추가*/
.header_all_acc_bg_check svg{display:inline-block; vertical-align:middle;fill:#f47520; width:13px;  height:10px; margin:-2px 3px 0 0}/*topics svg 200911_추가*/
.header_all_acc_area{margin-bottom:-1px}
.header_all_acc{color:#111; cursor:pointer; padding:12px 15px; width:100%; border:none; text-align:left; font-size:16px; line-height:22px; font-weight:500; letter-spacing:-0.4px; transition:0.3s; background:#fff;
border-bottom:1px solid #eee; border-top:1px solid #eee}
.header_all_acc:after{content:'▼'; font-size:8px; color:#666; float:right}
.header_all_acc.active:after{content:"▲"}
.header_all_acc_none:after{display:none}
.header_all_acc_li{font-size:0; max-height:0; overflow:hidden; transition:max-height 0.2s ease-out;}
.header_all_acc_area{}
.header_all_acc_li li{width:50%; display:inline-block; vertical-align:top}
.header_all_acc_li li a{display:block; padding:8px 15px; transition:.2s; font-size:15px; line-height:18px; font-weight:300; letter-spacing:-0.2px; color:#888}
.header_all_acc_li li:first-child a, .header_all_acc_li li:nth-child(2) a{padding-top:18px}
.header_all_acc_li li:last-child a{padding-bottom:18px}
.header_all_bnn{display:block}
.header_all_bnn img{width:100%; margin:0 auto; display:block; max-width:375px}


/* ====== main ======================================================================================================= */
/* main */
.main{position:relative; overflow:hidden; margin-top:83px}
.main_tit{position:relative; display:block; padding:15px; font-size:20px; font-weight:600; line-height:26px; color:#111; letter-spacing:-0.7px;}
.more{position:relative; display:inline-block; margin:-4px 0 0 5px; width:21px; height:21px; vertical-align:middle}
.more:before, .more:after{position:absolute; content:''; background:#aaa; transform:rotate(45deg)}
.more:before{width:1px; height:7px; left:11px; top:9px}
.more:after{width:7px;height:1px; left:8px; top:7px}
.btn_bg{padding:15px 15px 30px; position:relative}
.btn_1{display:block; border:1px solid #ddd; text-align:center; line-height:48px; font-size:17px; font-weight:500; letter-spacing:-0.5px}
.btn_1 span{display:inline-block; vertical-align:middle; font-size:11px; line-height:13px; margin:-3px 0 0 5px}
.btn_1 #now_page{font-size:17px;vertical-align:baseline}
.btn_2{display:block; text-align:center; line-height:40px; font-size:15px; font-weight:400; letter-spacing:-0.5px; color:#fff; background:#111; float:right; padding:0 25px}
.line{background:#e2e2e2; height:1px; margin:0 15px}
/* khad_bg */
.khad_bg{position:relative; padding:15px 15px 30px}
.khad_1{display:block; text-align:center}
.khad_bg img{width:100%; }
.khad_1 img{position:relative; width:100%; max-width:375px; display:block; margin:0 auto}
/* .main_li1(세로형), .main_li2(가로형), .main_li3(50%세로형), .main_li4(좌우넘버가로형) */
.main_li1, .main_li2, .main_li3{position:relative}
.main_li1 li{margin-bottom:15px}
.main_li2{padding-top:15px; margin:0 15px}
.main_li2 li{padding-bottom:15px; margin:0 0 15px; border-bottom:1px solid #e2e2e2}
.main_li2 li:last-child, .main_li4 li:last-child{border:none}
.main_li3{margin:0 15px 20px; border-bottom:1px solid #e2e2e2}
.main_li3:after{content:''; clear:both; display:block}
.main_li3 li{float:left; width:calc(50% - 7px)}
.main_li3 li:nth-child(2n+1){clear:both}
.main_li3 li:nth-child(odd){padding-right:7px}
.main_li3 li:nth-child(even){padding-left:7px}
.main_li4 li{padding:15px 5px; border-bottom:1px solid #e2e2e2}
.main_li4{margin:0 15px}
/* main_swiper1,main_swiper3 */
.main_swiper1, .main_swiper3{position:relative; overflow:hidden; height:100%; margin:0 auto 30px; width:100%; background:#2b2c2a}
.main_swiper1_img, .main_swiper3_img{position:relative; padding-bottom:70%}
.main_swiper1_img img, .main_swiper3_img img{position:absolute; top:0; left:0; width:100%; height:100%}
.main_swiper1_cate{position:absolute; top:0; left:0; width:100%; background:rgba(255,255,255,0.6); text-align:center; font-size:14px; font-weight:500; line-height:28px; color:#111;; letter-spacing:-0.3px}
.main_swiper1_t, .main_swiper3_t{padding:32px 15px 19px; font-size:23px; font-weight:500; line-height:28px; color:#fff; letter-spacing:-1px}
.main_swiper1 .swiper-wrapper, .main_swiper3 .swiper-wrapper{height:auto !important}
.main_swiper1 .swiper-slide, .main_swiper3 .swiper-slide{display:block}
.main_swiper1 .swiper-button-bg, .main_swiper3 .swiper-button-bg{position:absolute; top:0; margin-top:70%; width:100%; z-index:2; padding-top:10px}
.main_swiper1 .swiper-pagination, .main_swiper3 .swiper-pagination{width:100%}
.main_swiper1 .swiper-pagination-bullet, .main_swiper3 .swiper-pagination-bullet{width:10px; height:10px; margin:0 3px; background:#fff}
/* main_swiper2 */
.main_swiper2 *, .main_swiper2 *:before, .main_swiper2 *:after{box-sizing:border-box; margin:0; padding:0}
.main_swiper2 [class^="swiper-button-"],
.main_swiper2 > .swiper-pagination-bullets .swiper-pagination-bullet,
.main_swiper2 > .swiper-pagination-bullets .swiper-pagination-bullet:before{transition: all 0.3s ease}
.main_swiper2{width:100%; height:auto; transition:opacity 0.6s ease; position:relative; overflow:hidden; padding:0 !important; margin:10px 0 0}
.main_swiper2:hover .swiper-button-prev, .main_swiper2:hover .swiper-button-next{transform:translateX(0); opacity:1; visibility:visible}
.main_swiper2 .swiper-slide{background-position:center; background-size:cover; width:80% !important; padding-bottom:80%; display:block}
.main_swiper2 .swiper-slide .entity-img{display:none}
.main_swiper2 [class^="swiper-button-"]{width:44px; opacity:0; visibility:hidden}
.main_swiper2 .swiper-wrapper{z-index:0; margin-bottom:60px}
.main_swiper2 .swiper-button-prev, .main_swiper2 .swiper-button-next{margin-top:-52px}
.main_swiper2 .swiper-button-prev{transform:translateX(50px); z-index:1}
.main_swiper2 .swiper-button-next{transform:translateX(-50px); z-index:1}
.main_swiper2 .swiper-button-next:after, .main_swiper2 .swiper-button-prev:after{font-size:23px}
.main_swiper2 .swiper-pagination{bottom:30px !important}
.main_swiper2 > .swiper-pagination-bullets .swiper-pagination-bullet{position:relative; width:10px; height:10px; margin:0 3px; background:#000}
.main_news_type1, .main_news_type2, .main_news_type3, .main_news_type4{position:relative; overflow:hidden; display:block}
.main_news_type1_img{position:relative; overflow:hidden; padding-bottom:70%}
.main_news_type2_img{position:relative; overflow:hidden; padding-bottom:20%; width:30%; float:left}
.main_news_type1_img img, .main_news_type2_img img{position:absolute; width:100%; height:100%}
.main_news_type_t_bg{padding:15px}
.main_news_type2 .main_news_type_t_bg{float:left;  padding:0 0 0 15px; width:calc(70% - 15px)}
.main_news_type_cate{font-size:14px; line-height:18px; font-weight:500; color:#1ca1d9; letter-spacing:-0.5px}
.main_news_type_tit_big{font-size:23px; line-height:28px; font-weight:500; color:#111; margin:5px 0 10px; letter-spacing:-1px}
.main_news_type_tit_small{font-size:19px; line-height:21px; font-weight:500; color:#111; margin:0 0 7px; letter-spacing:-0.7px; min-height:42px}
.main_li3 .main_news_type_t_bg{padding:10px 0 15px}
.main_li3 .main_news_type1_img{padding-bottom:56%; margin-bottom:10px}
.main_li3 .main_news_type_cate{margin-bottom:5px}
.main_li3 .main_news_type_tit_small{min-height:inherit}
.main_news_type_con{font-size:18px; line-height:20px; font-weight:300; color:#aaa; max-height:60px; letter-spacing:-0.5px}
.main_news_type3 .main_news_type_con{margin-bottom:7px}
.main_news_type4{font-size:0;}
.main_news_type4_num{width:50px; position:relative; font-size:16px; line-height:32px; font-weight:500; color:#111; display:inline-block; vertical-align:middle; text-align:center}
.main_news_type4_num:before{position:absolute; content:''; width:20px; height:1px; background:#111; top:0; left:50%; margin-left:-10px}
.main_news_type4_t{width:calc(100% - 70px); font-size:19px; line-height:21px; font-weight:500; color:#111; letter-spacing:-0.7px; padding:7px 10px; display:inline-block; vertical-align:middle}
.main_li1.investor li{margin:0}/* investor전용 */
.main_li2.investor .main_news_type_t_bg{padding:0 15px 0 0}
.main_li2.investor .main_news_type2_img{float:right}
/* main_relate */
.main_relate{position:relative; border-bottom:1px solid #e2e2e2; margin:15px 15px 30px}
.main_relate_btn_bg{position:relative; text-align:center; font-size:0}
.main_relate_btn_bg:after{position:absolute; content:''; left:0; right:0; bottom:0; height:1px; background:#e2e2e2; z-index:-1}
.main_relate_btn{position:relative; overflow:hidden; border:1px solid #e2e2e2; border-bottom:none; display:inline-block; font-size:13px; font-weight:400; line-height:34px; height:34px; color:#555; transition:.3s; padding:0 15px; background:#fff; letter-spacing:-0.2px}
.main_relate_btn span{display:inline-block; vertical-align:middle; font-size:7px; color:#aaa; line-height:14px; margin:-2px 7px 0 0; transition:.3s}
.main_relate_btn.active{color:#111}
.main_relate_btn.active span{transform:rotate(180deg)}
.main_relate_btn.active, .main_relate_btn.active:after, .main_relate_li.active{background:#f8f8f8}
.main_relate_li{padding:13px 0; transition:.3s}
.main_relate_li li, .main_relate_li li:nth-child(n+2).active{display:table; padding:4px 5px 4px 0; overflow:hidden; transition:.3s}
.main_relate_li li{margin:0}
.main_relate_li li:nth-child(n+2){padding:0}
.main_relate_li li span, .main_relate_li li a, .main_relate_li li:nth-child(n+2).active span, .main_relate_li li:nth-child(n+2).active a{display:table-cell; vertical-align:top; font-size:19px; line-height:22px; color:#000; transition:.2s; letter-spacing:-0.5px}
.main_relate_li li:nth-child(n+2) span, .main_relate_li li:nth-child(n+2) a{color:transparent; line-height:0}
.main_relate_li li span{width:20px; text-align:center; font-weight:400}
.main_relate_li li a{font-weight:400}
/* main_video */
.main_video{background:#000; position:relative; overflow:hidden; margin-bottom:15px}
.main_video .main_li1 .main_news_type1_img{margin:15px 15px 0; padding-bottom:51%}
.main_video .main_news_type_tit_big, .main_video .main_news_type_tit_small{color:#fff}
.main_video_icon{position:absolute; top:50%; left:50%; transform:translateY(-50%) translateX(-50%); width:50px; height:50px; overflow:visible}
.main_video_icon_dot{opacity:0; stroke-dasharray:4,5; stroke-width:6px; transform-origin:50% 50%; animation:main_video_icon_spin 4s infinite linear; transition:opacity 1s ease, stroke-width 1s ease}
.main_video_icon_solid{stroke-dashoffset:0; stroke-dashArray:300; stroke-width:6px; transition:stroke-dashoffset 1s ease, opacity 1s ease; opacity:0.5}
.main_video_icon_arrow{transform-origin:50% 50%; transition:transform 200ms ease-out}
@keyframes main_video_icon_spin{
	to{transform:rotate(360deg)}
}
.main_video li:hover .main_video_icon_dot{stroke-width:4px; opacity:0.5}
.main_video li:hover .main_video_icon_solid{opacity:0; stroke-dashoffset:300}
.main_video li:hover .main_video_icon_arrow{transform:scale(1.2,1.2)}
.main_video .main_li3{border:none; margin:0 15px}
.main_li1.week{margin:0 15px 0}
.main_li1.week .main_news_type1_img{border-radius:8px}
.main_li1.week li{margin:0 0 25px; border-bottom:1px solid #e2e2e2}
.main_li1.week li:last-child{border:none}
/* global */
.global{background:#000; position:relative; overflow:hidden; margin-bottom:30px; padding:10px 0 15px}
.global li:hover .main_video_icon_dot{stroke-width:4px; opacity:0.5}
.global li:hover .main_video_icon_solid{opacity:0; stroke-dashoffset:300}
.global li:hover .main_video_icon_arrow{transform:scale(1.2,1.2)}
.global .main_li3{border:none; margin:0 15px}
.global .main_news_type_t_bg{padding:10px 0 0}
.global .main_news_type1_img{padding-bottom:60%}
.global .main_news_type_tit_small{color:#fff; font-size:16px; max-height:42px; font-weight:400}
.global .main_news_type_cate{font-size:12px; font-weight:400}
.global_li li a{display:block}
.global_li_img_bg{position:relative; padding-bottom:60%}
.global_li_img{position:absolute; top:0; left:0; width:100%; height:100%}
.global_li_t1{font-size:18px; line-height:24px; font-weight:500; color:#000; padding:10px 15px 5px}
.global_li_t2{font-size:12px; line-height:18px; font-weight:400; color:#aaa; padding:0 15px 15px}
.global_li li:hover .main_video_icon_dot{stroke-width:4px; opacity:0.5}
.global_li li:hover .main_video_icon_solid{opacity:0; stroke-dashoffset:300}
.global_li li:hover .main_video_icon_arrow{transform:scale(1.2,1.2)}


/* ====== footer ======================================================================================================= */
.footer, .footer_top, .footer_bottom{position:relative; overflow:hidden}
.footer_top{background:#000; padding:20px}
.footer_logo{position:relative; display:block; width:40px; height:51px; float:left; fill:#666; margin:3px 15px 0 0}
.footer_logo svg{width:100%; height:100%}
.footer_li{float:left; width:calc(100% - 60px)}
.footer_li li{float:left; margin-right:15px}
.footer_li li a{color:#fff; font-size:12px; line-height:18px; font-weight:300; letter-spacing:-0.5px}
.footer_bottom{background:#121212; padding:20px}
.footer_bottom_desktop{display:block; background:#333; text-align:center; font-size:17px; color:#fff; line-height:48px; font-weight:500; letter-spacing:-0.5px}
.footer_bottom_sns{font-size:0; text-align:center}
.footer_bottom_sns li{display:inline-block; margin:20px 10px; vertical-align:middle}
.footer_bottom_sns li a{display:block; width:38px; height:38px; background:#fff; border-radius:50%; position:relative}
.footer_bottom_sns li a svg{position:absolute; top:50%; left:50%; transform: translate(-50%, -50%); width:55%; height:55%}
.footer_bottom_site_bg{position:relative; margin-bottom:15px}
.footer_bottom_site{display:block; width:100%; height:48px; background:#333; color:#fff; padding:0 30px 0 15px; font-size:17px; font-weight:500; letter-spacing:-0.5px}
.footer_bottom_site_arrow{position:absolute; display:block; content:''; border-width:8px 6px 0; border-color:#fff transparent transparent transparent; border-style:solid; top:20px; right:15px; opacity:0.5}
.footer_bottom_info{font-size:11px; line-height:17px; font-weight:200; color:#777; letter-spacing:0}
.footer_bottom_info b{font-weight:400; color:#999; display:block}
.footer .khad_1{background:#121212}


/* ====== list ======================================================================================================= */
.list, .sec88, .view, .list_topic{position:relative; /*padding:101px 0 50px*/ padding:133px 0 50px}
.view_kr {position:relative; padding:51px 0 50px}
.list .main{margin:0}
.list .main_li2 li{padding-bottom:20px; margin-bottom:20px}
.list .main_news_type2 .main_news_type2_img{padding-bottom:24%}
.list .main_news_type2 .main_news_type_con{clear:both; padding-top:5px}
.list .main_news_type2 .main_news_type_tit_small{line-height:20px; min-height:60px;}
.list .main_news_type2 .main_news_type_cate{color:#9d9d9d; font-size:11px}
.list_top{font-size:0; padding:10px 15px}
.list_top_t, .list_top_sel_bg{display:inline-block; vertical-align:middle}
.list_top_t{/*width:calc(100% - 150px);*/ font-size:22px; color:#ccc; font-weight:500; letter-spacing:-0.8px; line-height:30px}
.list_top_t_100{width:100%}
.list_top_sel_bg{min-width:100px; position:relative; border-bottom:1px solid #ddd; float:right; max-width:150px}
.list_top_sel{width:100%; padding:0 30px 0 0; font-size:13px; line-height:17px; font-weight:400; height:29px; color:#1ba2da; background:transparent; cursor:pointer}
.list_top_sel_arrow{position:absolute; display:block; content:'▼'; top:13px; right:2px; border-width:6px 4px 0; border-color:#1ba2da transparent transparent transparent; border-style:solid; z-index:-1}
.list .main_news_type_tit_big{margin:0 0 5px}
.list .main_news_type_cate{margin-bottom:10px}
.list .main_news_type_cate span{color:#999; margin-left:10px}
.list .main_news_type2 .main_news_type_cate{margin-bottom:0}
.list .main_news_type2 .main_news_type_cate span{color:#1ca1d9; margin:0 10px 0 0}
.list .main_li1 li{margin-bottom:5px}
.list .main_li4{margin-bottom:40px}
.list .main_news_type2_noimg .main_news_type_t_bg{width:100%; padding:0;}
.list .main_news_type2_noimg .main_news_type_tit_small{min-height:auto}
/* list_sch */
.list_sch{position:relative; overflow:hidden; padding:0 15px; letter-spacing:-0.3px; color:#666; font-weight:300}
.list_sch_top{position:relative; border-bottom:1px solid #e2e2e2; padding:15px 0; font-size:16px; font-weight:300; line-height:21px}
.list_sch_bottom{position:relative; overflow:hidden; padding:15px 0}
.list_sch_bottom_l{float:left; font-size:11px; line-height:21px}
.list_sch_bottom_l b{font-size:20px; font-weight:500; color:#111; margin-right:5px; line-height:21px; display:inline-block; vertical-align:middle; margin-top:-9px}
.list_sch_bottom_r{float:right; font-size:13px; line-height:21px;}
.list_sch_bottom_r span{font-size:9px; display:inline-block; vertical-align:middle; margin:-5px 5px 0; color:#ddd}
.list_sch_bottom_r a.on{color:#1ba2da; font-weight:500}
.list_top .list_sch_bottom_r{letter-spacing:-0.3px; color:#666; font-weight:300; line-height:30px}
.list_photo{margin:10px 15px; font-size:0}
.list_photo li{width:calc(50% - 7px); display:inline-block; vertical-align:middle; margin:0 0 15px}
.list_photo li:nth-child(odd){margin-right:7px}
.list_photo li:nth-child(even){margin-left:7px}
.list_photo li a{display:block; padding-bottom:65%; position:relative}
.list_photo li a img{position:absolute; top:0; left:0; width:100%; height:100%}
.list_sch_noresult{text-align:center; padding:120px 0; font-size:15px; font-weight:200; color:#666; letter-spacing:-0.2px; line-height:20px}
.list_sch_noresult b{font-weight:400; color:#111}
/* announce */
.announce, .contact{position:relative; padding:0 15px 15px}
.announce li{border-bottom:1px solid #e5e5e5}
.announce li:last-child{border:none}
.announce li a{display:block; padding:15px 0}
.announce_t{font-size:16px; line-height:22px; letter-spacing:-0.7px; font-weight:400; color:#111; margin-bottom:7px}
.announce_day{font-size:12px; line-height:14px; letter-spacing:-0.3px; font-weight:400; color:#999}
.announce_view_tit{position:relative; padding:15px 17px; border-radius:5px; background:#f0f0f0; font-size:17px; font-weight:400; letter-spacing:-0.5px; color:#111; line-height:23px; margin:15px}
.announce_view_tit_day{font-size:12px; font-weight:400; letter-spacing:-0.5px; color:#999; line-height:15px; margin-top:9px}
.announce_view{font-size:15px; font-weight:300; letter-spacing:-0.5px; color:#222; line-height:22px; margin:25px 15px 10px; padding-bottom:25px; border-bottom:1px solid #e5e5e5}
.announce_view img{margin:15px auto; display:block; width:100%; max-width:300px}
/* sec88 */
.sec88{position:relative; padding:101px 0 50px}
.sec88 .header_all_bnn{padding:10px 15px 15px}
.sec88_li li{position:relative; background:#f3f3f3; margin-bottom:15px; border-bottom:1px solid #ddd}
.sec88_li_iframe{width:100%; padding-bottom:56%; position:relative}
.sec88_li li iframe{position:absolute; top:0; left:0;  width:100%; height:100%}
.sec88_li_t_bg{display:block; padding:15px}
.sec88_li_t1{font-size:17px; line-height:22px; font-weight:400; letter-spacing:-0.5px; color:#111; margin-bottom:8px; max-height:42px}
.sec88_li_t2{font-size:13px; line-height:18px; font-weight:300; letter-spacing:-0.3px; color:#999}
/* contact */
.contact li{margin-bottom:25px}
.contact li:last-child{margin-bottom:0}
.contact_t1{font-size:18px; font-weight:500; color:#111; letter-spacing:-0.5px; line-height:25px; padding-bottom:15px; margin-bottom:15px; border-bottom:1px solid #e5e5e5}
.contact_t2, .contact_t2_tb td{font-size:15px; font-weight:300; color:#666; letter-spacing:-0.5px; line-height:22px; word-break:break-all}
.contact_t2_tb{position:relative; width:100%}
.contact_t2_tb td{padding:3px 0}
.contact_t3{font-size:12px; font-weight:300; color:#888; letter-spacing:-0.5px; line-height:16px; margin-top:5px}
.contact li .footer_bottom_sns li{margin:0 10px}
.contact li .footer_bottom_sns li a svg{fill:#fff}
.contact li .footer_bottom_sns li:first-child a{background:rgb(24, 119, 242)}
.contact li .footer_bottom_sns li:last-child a{background:#1da1f2}
/* mobile */
.mobile_tb{position:relative; width:100%}
.mobile_tb th, .mobile_tb td{vertical-align:middle; padding:20px 0}
.mobile_tb th{width:80px; font-size:0; text-align:left}
.contact_svg_icon{width:60px; height:60px}
.mobile_tb td{font-size:15px; line-height:22px; letter-spacing:-0.3px; font-weight:400}
.mobile_tb td a{display:inline-block; padding:3px 25px; border:1px solid #aaa; margin:5px 5px 0 0; font-size:12px; border-radius:3px}
.contact_svg_icon1_col1{fill:#fff}
.contact_svg_icon1_col2{fill:url(#SVGID_0_)}
.contact_svg_icon2_col1{fill:url(#SVGID_1_)}
.contact_svg_icon2_col2{fill:url(#SVGID_2_)}
.contact_svg_icon2_col3{fill:url(#SVGID_3_)}
.contact_svg_icon2_col4{fill:url(#SVGID_4_)}
/* most */
.most_bg, .list_topic2{position:relative; padding:51px 0 50px}
.most_bg .main_tit{text-align:center}
.most{position:relative; margin:0 15px}
.most li{position:relative; margin-bottom:25px; border-radius:6px; overflow:hidden}
.most li a{display:block; background:#f3f3f3; position:relative}
.most_img{position:relative; padding-bottom:60%}
.most_img img{position:absolute; top:0; left:0; width:100%; height:100%}
.most_img_t{padding:15px 15px; font-size:16px; line-height:21px; font-weight:400; letter-spacing:-0.5px; color:#111}
.most_num{position:absolute; top:10px; left:10px; background:#111; border-radius:50%; width:40px; height:40px; line-height:45px; color:#fff; text-align:center; font-size:16px; font-weight:500}
.most_num:after{position:absolute; content:''; width:16px; height:1px; background:#fff; top:10px; left:12px}
/* letter */
.letter{position:relative; margin:15px}
.letter_t1{font-size:17px; font-weight:400; line-height:24px; letter-spacing:-0.8px; color:#111; margin-bottom:15px}
.letter_t1 span{font-size:12px; font-weight:200; line-height:15px; display:inline-block; vertical-align:middle; margin:-4px 5px 0; color:#aaa}
.letter_input_bg{position:relative; margin-bottom:25px}
.letter_input_type1, .letter_input_type2, .letter_input_bg button{height:44px}
.letter_input_type1, .letter_input_type2{width:100%; border:1px solid #e5e5e5; padding:0 95px 0 15px}
.letter_input_bg button{position:absolute; top:0; right:0; width:80px; background:#111; text-align:center; color:#fff; z-index:1; font-size:10px; line-height:13px}
.letter_input_type2{padding:0 15px}
.letter_t2{display:inline; font-size:11px; font-weight:400; letter-spacing:-0.4px}
.letter_input_bg textarea{border:1px solid #e5e5e5; width:100%; padding:15px; height:100px}
/* login_all */
.login_all{position:relative; margin-bottom:30px}
.login_all input{position:absolute; top:1px; left:1px; z-index:-1; width:1px; height:1px; cursor:pointer; opacity:0}
.login_all label{display:block; cursor:pointer}
.login_all label svg{width:20px; height:20px; vertical-align:top; margin:0 5px 0 0}
.login_all label svg .login_all_chk_col1{fill:#ddd}
.login_all label svg .login_all_chk_col2{fill:#fff}
.login_all input:checked + label svg .login_all_chk_col1{fill:#111}
.login_all_chk_t{display:inline-block; vertical-align:top; font-size:12px; font-weight:300; color:#888; letter-spacing:-0.4px; line-height:18px}
.letter .btn_2{float:none; line-height:24px; padding:10px 0}
/* rss */
.rss{position:relative}
.rss_top{position:relative; padding:15px 17px; border-radius:5px; background:#f0f0f0; font-size:15px; font-weight:300; letter-spacing:-0.5px; color:#111; line-height:21px; margin:15px 15px 30px}
.rss_li{position:relative; margin:0 15px}
.rss_li li{position:relative; margin-bottom:20px}
.rss_li_t_bg{position:relative; font-size:0; border-bottom:1px solid #e5e5e5; padding:10px 0}
.rss_li_t{display:inline-block; vertical-align:middle; width:calc(100% - 90px); font-size:17px; font-weight:500; letter-spacing:-0.5px; color:#111; line-height:23px}
.rss_li_t_copy{display:inline-block; vertical-align:middle; width:90px; font-size:10px; font-weight:400; letter-spacing:-0.5px; color:#fff; line-height:26px; background:#111; text-align:center}
.rss_li_t_link{padding:10px 10px; font-size:14px; font-weight:200; letter-spacing:-0.3px; color:#111; line-height:19px; word-break:break-all; display:block}
/* view */
.view_related{position:relative; background:#f5f5f5; margin-top:20px; padding-top:20px}
.view_related_tit{position:absolute; width:100%; margin-top:-35px; text-align:center; font-size:20px; font-weight:600; color:#111; letter-spacing:-0.7px; line-height:30px;}
.view_related .main_li2{}
.view_related .main_li2 li{border:none}
.view_related .main_li2 li .main_news_type_cate span{color:#999; margin-left:10px}
.view_con{position:relative; margin:15px}
.view_con_t1{font-size:24px; line-height:28px; font-weight:500; letter-spacing:-0.5px; color:#111; margin:0 0 10px}
.view_con_t2{font-size:14px; line-height:19px; font-weight:300; letter-spacing:-0.4px; color:#888; margin:0 0 20px}
.view_con_by{position:relative; font-size:0; border-top:1px solid #e5e5e5; border-bottom:1px solid #e5e5e5; margin:0; padding:13px 0}
.view_con_by_l, .view_con_by_r{display:inline-block; vertical-align:middle; width:50%; }
.view_con_by_l{font-size:13px; line-height:20px; font-weight:400; letter-spacing:-0.3px; color:#333}
.view_con_view a{color:#1ba2da}
.view_con_by_r{font-size:10px; line-height:14px; font-weight:300; letter-spacing:-0.2px; color:#999; text-align:right}
.view_con_sns_bg{position:relative; overflow:hidden; padding:15px 0}
.view_con_sns_bg li{display:inline-block; vertical-align:middle}
.view_con_sns_bg li a{display:block; position:relative; width:34px; height:34px; border-radius:50%; overflow:hidden; border:1px solid #ddd}
.view_con_sns_bg li svg{position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:54%; height:54%}
.view_con_sns_svg_col1{fill:#111}
.view_con_sns_svg_col2{fill:#fff}
.view_con_sns_l{float:left; width:63%}
.view_con_sns_l li{margin:0 3px 5px 0}
.view_con_sns_r{float:right; width:37%; text-align:right}
.view_con_sns_r li{margin:0 0 5px 3px}
.view_con_sns_l li:last-child, .view_con_sns_r li:first-child{margin:0 0 5px}
.view_con_view{font-size:17px; line-height:1.5; font-weight:300; letter-spacing:-0.2px; color:#111; padding:20px 0; position:relative}
.view_con_view iframe{width:100%} 
.view_con_view_img{position:relative; overflow:hidden; margin:20px -15px}
.view_con_view_img img{max-width:100%; display:block; margin:0 auto}
.view_con_view_cap{text-align:center; font-size:13px; line-height:17px; font-weight:300; letter-spacing:-0.3px; color:#888; margin:10px 30px 0}
.view_con_back{font-size:0; border-top:1px solid #e5e5e5; padding:20px 0 0}
.view_con_back li{display:inline-block; vertical-align:middle; width:calc(50% - 5px)}
.view_con_back li:first-child{margin-right:10px}
.view_con_back li a{font-size:10px; text-align:center; display:block; background:#f0f0f0; padding:15px 0; border:1px solid #ddd; font-weight:300; color:#888; letter-spacing:-0.4px}
.khad_view{position:relative; padding:15px 15px 30px}
.khad_view img, .khad_view iframe, .khad_view a{width:100%; max-width:320px; display:block; margin:0 auto}
/* topic */
.topic{position:relative; padding-bottom:5px}
.topic_top{position:relative; padding:10px 15px}
.topic_top_l, .topic_top_r{display:inline-block; vertical-align:middle}
.topic_top_l{width:75px; font-size:23px; line-height:30px; font-weight:500; letter-spacing:-1px; color:#000}
.topic_top_r{width:calc(100% - 75px); text-align:right; font-size:11px; line-height:13px; font-weight:300; letter-spacing:-0.2px; color:#ccc; border-bottom:1px solid #eee; padding:4px 0}
.topic_top:after{content:''; clear:both; display:block}
.topic .main_news_type_t_bg{background:#f0f0f0}
.topic .main_news_type_tit_big{text-align:center; border-bottom:1px solid #ddd; padding-bottom:15px; margin-bottom:10px}
.topic .main_news_type_con{max-height:none /*60px*/}
.topic_btn_bg{position:relative; text-align:center; font-size:0; padding:15px 0 5px}
.topic_btn{font-size:13px; line-height:34px; color:#888; font-weight:300; letter-spacing:-0.2px; border-radius:19px; border:2px solid #d3d3d3; display:inline-block; vertical-align:middle; padding:0 30px}
.topic_li{padding:15px 15px 0}
.topic_tit{position:fixed; overflow:hidden; display:none; z-index:9; top:51px;left:0; width:calc(100% - 30px); background:#f0f0f0; padding:10px 15px 13px; font-size:20px; line-height:27px; font-weight:500; letter-spacing:-0.8px; color:#111}
.topic_tit.fix{display:block}
/* topic_img_li_img */
.topic_img_li_top{position:relative; overflow:hidden; text-align:center; margin:25px 15px 10px}
.topic_img_li_top span{display:inline-block; vertical-align:middle; background:#fff; padding:0 10px; font-size:20px; line-height:30px; font-weight:600; letter-spacing:-0.7px; color:#111}
.topic_img_li_top:after{position:absolute; content:''; top:50%; left:0; width:100%; height:1px; background:#ddd; z-index:-1; margin-top:1px}
.topic_img_li{position:relative; font-size:0; padding:10px 8px}
.topic_img_li li{width:calc(50% - 14px); display:inline-block; vertical-align:top; margin:0 7px 15px}
.topic_img_li li a{display:block}
.topic_img_li_img{position:relative; width:100%; padding-bottom:70%}
.topic_img_li_img img{position:absolute; top:0; left:0; width:100%; height:100%}
.topic_img_li_t{text-align:center; font-size:15px; line-height:18px; color:#888; font-weight:400; letter-spacing:-0.4px; color:#111; padding:5px 0}


/* ====== modal ======================================================================================================= */
/* modal */
#mask{background:rgba(0,0,0,0.7); position:fixed; left:0; top:0; width:100%; height:100%; z-index:999}
.modal{display:none; position:absolute; top:0; left:50%; z-index:99999; width:290px; color:#fff; margin:20px 0 0 -160px ; padding:10px 15px; background:#fff;}
.modal_close{display:block; position:absolute; overflow:hidden; width:20px; height:20px; top:20px; right:20px}
.modal_close svg{position:relative; width:100%; height:100%; fill:#111}
.modal_tit{font-size:16px; font-weight:500; line-height:20px; color:#111; letter-spacing:-1px; padding:15px 0}
.modal_tit span{display:inline-block; vertical-align:middle; font-size:10px; line-height:12px; margin:-3px 5px 0; color:#999; font-weight:200}
.modal_link_bg{position:relative; background:#f0f0f0; padding:15px; border-radius:6px; margin-bottom:10px; display:block}
.modal_link{font-size:0}
.modal_link_img{position:relative; width:32%; display:inline-block; vertical-align:middle; padding-bottom:23%; margin-right:10px}
.modal_link_img img{position:absolute; top:0; left:0; width:100%; height:100%}
.modal_link_t1{width:calc(68% - 10px); display:inline-block; vertical-align:middle; font-size:15px; font-weight:500; line-height:19px; color:#111; letter-spacing:-0.6px;}
.modal_link_t2{font-size:12px; font-weight:300; line-height:19px; max-height:38px; color:#999; letter-spacing:-0.3px; padding-top:10px}
.modal table{position:relative; width:100%}
.modal td{padding:5px 0}
.modal td input{border:1px solid #ccc; padding:0 15px; width:100%; height:40px; font-size:13px; font-weight:400; letter-spacing:-0.5px;}
.modal .btn_bg{text-align:center; padding: 15px 0 20px}
.modal .btn_bg .btn_2{float:none; width:137px; padding:0; border:1px solid #111; display:inline-block}
.modal .btn_bg .btn_2:last-child{background:#fff; color:#111; margin-left:10px}


/* ====== president_20th ======================================================================================================= */
.president_20th{position:relative; margin-top:51px; padding-bottom:15px}
.president_20th_bnn{position:relative; padding-bottom:16%; background:url(http://res.heraldm.com/koreaherald/version02/mobile/images/president_20th/president_20th_bnn.jpg) center no-repeat; background-size:cover}
.president_20th_bnn_dday{position:absolute; top:50%; right:17px; width:60px; text-align:center; color:#4758a8; font-size:24px; font-weight:600; line-height:24px; letter-spacing:-0.5px; margin-top:-14px}
.president_20th .main{margin-top:0}
.president_20th_list .list .main .main_news_type_t_bg:after{position:relative; content:""; margin:5px 0 -10px; border-bottom:1px solid #e2e2e2; display:block; padding-top:15px}
.president_20th_list .list .main_li2 .main_news_type_con{font-size:15px}
.president_20th_candi{padding:10px 10px 20px; text-align:center; font-size:0; background:#f3f3f3; margin-bottom:15px}
.president_20th .main_news_type_tit_small{margin-bottom:0}
.president_20th_candi_title{font-size:15px}
.president_20th_candi_li li{width:calc(50% - 10px); display:inline-block; vertical-align:top; margin:0 5px 10px}
.president_20th_candi_li li a{display:block; padding:20px 5px}
.president_20th_candi_li{position:relative; color:#fff}
.president_20th_candi_li_img{position:relative; width:70%; padding-bottom:70%; overflow:hidden; border-radius:50%; margin:0 auto 10px}
.president_20th_candi_li_img img{position:absolute; top:0; left:0; width:100%; height:100%}
.president_20th_candi_li_img:after{position:absolute; content:""; top:0; left:0; right:0; bottom:0; border:1px solid rgba(0,0,0,.08); border-radius:50%}
.president_20th_candi_li_t1{font-size:12px; line-height:16px; font-weight:300; letter-spacing:-0.2px}
.president_20th_candi_li_t1.resignation{background:rgba(0,0,0,0.9); display:inline-block; padding:0 18px 1px; color:#ffc600; font-size:14px; line-height:34px; margin-top:-25px; position:relative; z-index:1; margin-bottom:6px; font-weight:500; border-radius:4px}
.president_20th_candi_li_t2{font-size:15px; line-height:20px; font-weight:400; letter-spacing:-0.2px; margin:3px 0 5px}
.president_20th_candi_li_t3{font-size:11px; line-height:16px; font-weight:200; letter-spacing:-0.2px}
.president_20th_candi_li_t3 span{font-weight:400; color:rgba(255,255,255,.6)}
.president_20th_candi_li li:first-child a#presidentlee{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#8ac452+0,0092bf+31,014ea2+100 */
background: rgb(138,196,82); /* Old browsers */
background: -moz-linear-gradient(left,  rgba(138,196,82,1) 0%, rgba(0,146,191,1) 31%, rgba(1,78,162,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(138,196,82,1) 0%,rgba(0,146,191,1) 31%,rgba(1,78,162,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(138,196,82,1) 0%,rgba(0,146,191,1) 31%,rgba(1,78,162,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8ac452', endColorstr='#014ea2',GradientType=1 ); /* IE6-9 */
}
.president_20th_candi_li li:nth-child(2) a#presidentyoon{background:#e61e2b}
.president_20th_candi_li li:nth-child(3) a#presidentahn{background:#ea5504}
.president_20th_candi_li li:nth-child(4) a#presidentsim{background:#ffed00; color:#000}
.president_20th_candi_li li:nth-child(4) a#presidentsim span{color:rgba(0,0,0,.4)}
.president_20th_poll_li{margin:0 15px 15px; border-bottom:1px solid #e2e2e2; padding-bottom:15px}
.president_20th_poll_li li{}
.president_20th_poll_li li a{display:block; font-size:0; padding:10px 0}
.president_20th_poll_li_img, .president_20th_poll_li_t_bg{display:inline-block; vertical-align:middle;}
.president_20th_poll_li_img{position:relative; width:33%; padding-bottom:22%; overflow:hidden; margin-right:15px}
.president_20th_poll_li_img img{position:absolute; top:0; left:0; width:100%; height:100%}
.president_20th_poll_li_img:after{position:absolute; content:""; top:0; left:0; right:0; bottom:0; border:1px solid rgba(0,0,0,.08)}
.president_20th_poll_li_t_bg{width:calc(67% - 15px)}
.president_20th_poll_li_t_icon{display:inline-block; background:#cdcdcd; font-size:10px; font-weight:300; line-height:20px; padding:0 12px; border-radius:10px; color:#fff; letter-spacing:0.2px; margin-bottom:5px}
.president_20th_poll_li_t{font-size:16px; line-height:22px; font-weight:400; letter-spacing:-0.2px}
.president_20th_poll_li_noimg .president_20th_poll_li_t_bg{width:100%}
.president_20th_poll_li li:first-child .president_20th_poll_li_t_icon{background:#2734a4}
.president_20th .main_video{background:transparent}
.president_20th .main_video .main_li3{border-bottom:1px solid #e2e2e2; padding-bottom:10px}
.president_20th .main_news_type_tit_small{color:#111}
.president_20th_latest_day{font-size:12px; line-height:16px; font-weight:300; letter-spacing:-0.2px; color:#bbb; margin-top:5px}
.president_20th_latest_t_bg{margin-bottom:5px}
.president_20th_latest_t_bg:after{content:""; display:table; table-layout:fixed; clear:both}
.president_20th_latest_t{font-size:14px; line-height:20px; font-weight:300; letter-spacing:-0.2px; color:#777}
.president_20th_list{margin-top:51px}
.president_20th_list .list{padding-top:0}
/* president_20th_cate */
.president_20th_cate{font-size:0; padding:15px; overflow:hidden;}
.president_20th_cate .swiper-slide{display:inline-block; vertical-align:middle; margin-right:5px; width:auto !important; font-size:12px; line-height:30px; padding:0 15px; border-radius:16px; border:1px solid #ccc; transition:.2s; cursor:pointer}
/*
.president_20th_cate .swiper-slide a{font-size:12px; line-height:30px; padding:0 15px; border-radius:16px; border:1px solid #ccc; display:block; transition:.2s}
*/
.president_20th_cate .swiper-slide.on{color:#fff; border-color:transparent; background:#2734a4}
.president_20th_cate .swiper-slide.on#presidentlee{border-left-color:#8ac452;
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#8ac452+0,0092bf+31,014ea2+100 */
  background: rgb(138,196,82); /* Old browsers */
  background: -moz-linear-gradient(left,  rgba(138,196,82,1) 0%, rgba(0,146,191,1) 31%, rgba(1,78,162,1) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(left,  rgba(138,196,82,1) 0%,rgba(0,146,191,1) 31%,rgba(1,78,162,1) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right,  rgba(138,196,82,1) 0%,rgba(0,146,191,1) 31%,rgba(1,78,162,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8ac452', endColorstr='#014ea2',GradientType=1 ); /* IE6-9 */
}
.president_20th_cate .swiper-slide.on#presidentyoon{background:#e61e2b}
.president_20th_cate .swiper-slide.on#presidentahn{background:#ea5504}
.president_20th_cate .swiper-slide.on#presidentsim{background:#ffed00; color:#000}
.president_20th.president_20th_view{margin-top:101px; margin-bottom:-101px; z-index:1; padding-bottom:0}
/* .president_20th_bnn.turnout */
.president_20th_bnn.turnout .president_20th_bnn_dday{font-size:12px; font-weight:400; line-height:14px; margin-top:-18px; letter-spacing:-0.2px}
.president_20th_bnn.turnout .president_20th_bnn_dday b{font-size:19px; display:block; font-weight:500; line-height:16px; margin-top:4px}
.president_20th_bnn.turnout .president_20th_bnn_dday b span{font-size:12px; font-weight:400}
/* president_20th_election */
.president_20th_election{position:relative; background:#f3f3f3; padding:5px 0 20px}
.president_20th_election .main_tit{letter-spacing:0; text-align:center}
.president_20th_election_l_img, .president_20th_election_l_t_bg{display:inline-block; vertical-align:middle}
.president_20th_election_l, .president_20th_election_r{text-align:left; margin:0 15px 15px; font-size:0; background:#fff; border-radius:10px; box-shadow:0 0 2px rgba(0,0,0,0.18)}
.president_20th_election_l{padding:15px}
.president_20th_election_r{text-align:center; margin-bottom:0; padding:15px 10px}
.president_20th_election_l_img{position:relative; overflow:hidden; width:40%; padding-bottom:40%; margin-right:20px}
.president_20th_election_l_img img{position:absolute; top:0; left:0; width:100%; height:100%}
.president_20th_election_l_img:after{content:""; position:absolute; top:0; left:0; right:0; bottom:0; border:1px solid rgba(0,0,0,.08)}
.president_20th_election_l_img_tag{position:absolute; width:25%; padding-bottom:32%; top:0; left:10px; background:url(https://res.heraldm.com/koreaherald/version02/mobile/images/president_20th/president_20th_election_l_img_tag.png) center no-repeat; background-size:cover}
.president_20th_election_l_t_bg{width:calc(60% - 20px)}
.president_20th_election_l_t1{font-size:13px; line-height:20px; font-weight:400; letter-spacing:-0.2px}
.president_20th_election_l_t1 b{font-size:17px; font-weight:500; margin-left:5px}
.president_20th_election_l_t2{font-size:20px; line-height:30px; font-weight:500; letter-spacing:-0.6px}
.president_20th_election_l_t3{font-size:12px; line-height:15px; font-weight:300; letter-spacing:-0.2px; color:#999}
.president_20th_election_l_t4{font-size:11px; line-height:20px; font-weight:500; letter-spacing:0; margin:5px 0 10px}
.president_20th_election_l_t4 b{font-size:19px; line-height:20px; font-weight:500; letter-spacing:-0.2px}
.president_20th_election_l_t5{font-size:13px; line-height:15px; font-weight:300; letter-spacing:0; color:#555}
.president_20th_election_l_t5 span{margin-left:5px; letter-spacing:0}
.president_20th_election_l.party1 .president_20th_election_l_img{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#8ac452+0,0092bf+31,014ea2+100 */
background: rgb(138,196,82); /* Old browsers */
background: -moz-linear-gradient(left,  rgba(138,196,82,1) 0%, rgba(0,146,191,1) 31%, rgba(1,78,162,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(138,196,82,1) 0%,rgba(0,146,191,1) 31%,rgba(1,78,162,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(138,196,82,1) 0%,rgba(0,146,191,1) 31%,rgba(1,78,162,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8ac452', endColorstr='#014ea2',GradientType=1 ); /* IE6-9 */
}/*이재명*/
.president_20th_election_l.party1 .president_20th_election_l_t2 span, .president_20th_election_l.party1 .president_20th_election_l_t4{color:#004ea1}
.president_20th_election_l.party1 .president_20th_election_l_t2 span{border-color:#004ea1}
.president_20th_election_l.party2 .president_20th_election_l_img{background:#e61e2b}/*윤석렬*/
.president_20th_election_l.party2 .president_20th_election_l_t2 span, .president_20th_election_l.party2 .president_20th_election_l_t4{color:#e61e2b}
.president_20th_election_l.party2 .president_20th_election_l_t2 span{border-color:#e61e2b}
.president_20th_election_l.party3 .president_20th_election_l_img{background:#ea5504}/*안철수*/
.president_20th_election_l.party3 .president_20th_election_l_t2 span, .president_20th_election_l.party3 .president_20th_election_l_t4{color:#ea5504}
.president_20th_election_l.party3 .president_20th_election_l_t2 span{border-color:#ea5504}
.president_20th_election_l.party4 .president_20th_election_l_img{background:#f5e306}/*심상정*/
.president_20th_election_l.party4 .president_20th_election_l_t2 span, .president_20th_election_l.party4 .president_20th_election_l_t4{color:#ebcd00}
.president_20th_election_l.party4 .president_20th_election_l_t2 span{border-color:#f5e306}
.president_20th_election_r_li li{width:33.33%; display:inline-block; vertical-align:top}
.president_20th_election_r_li_img{position:relative; overflow:hidden; width:70%; padding-bottom:70%; margin:0 auto}
.president_20th_election_r_li_img img{position:absolute; top:0; left:0; width:100%; height:100%}
.president_20th_election_r_li_img:after{content:""; position:absolute; top:0; left:0; right:0; bottom:0; border:1px solid rgba(0,0,0,.08)}
.president_20th_election_r_li_t1{font-size:13px; line-height:15px; font-weight:400; letter-spacing:-0.4px; margin-top:7px}
.president_20th_election_r_li_t1 span{font-size:10px; line-height:12px; font-weight:300; display:block; color:#aaa; margin-top:6px; margin-bottom:7px}
.president_20th_election_r_li_t2{font-size:19px; line-height:20px; font-weight:500; letter-spacing:-0.2px; margin-left:16px}
.president_20th_election_r_li_t2 span{font-size:11px}
.president_20th_election_r_li_t3{font-size:10px; line-height:12px; font-weight:300; display:block; color:#555; margin-top:6px; margin-bottom:7px}
.president_20th_election_r_li_t3 span{margin-left:5px}
.president_20th_election_r_li li.party1 .president_20th_election_r_li_img{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#8ac452+0,0092bf+31,014ea2+100 */
background: rgb(138,196,82); /* Old browsers */
background: -moz-linear-gradient(left,  rgba(138,196,82,1) 0%, rgba(0,146,191,1) 31%, rgba(1,78,162,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(138,196,82,1) 0%,rgba(0,146,191,1) 31%,rgba(1,78,162,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(138,196,82,1) 0%,rgba(0,146,191,1) 31%,rgba(1,78,162,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8ac452', endColorstr='#014ea2',GradientType=1 ); /* IE6-9 */
}
.president_20th_election_r_li li.party1 .president_20th_election_r_li_t2{color:#004ea1}
.president_20th_election_r_li li.party2 .president_20th_election_r_li_img{background:#e61e2b}
.president_20th_election_r_li li.party2 .president_20th_election_r_li_t2{color:#e61e2b}
.president_20th_election_r_li li.party3 .president_20th_election_r_li_img{background:#ea5504}
.president_20th_election_r_li li.party3 .president_20th_election_r_li_t2{color:#ea5504}
.president_20th_election_r_li li.party4 .president_20th_election_r_li_img{background:#f5e306}
.president_20th_election_r_li li.party4 .president_20th_election_r_li_t2{color:#ebcd00}
/* president_20th_rolling */
.president_20th_rolling{position:relative; overflow:hidden; width:100%; background:#eee; line-height:32px; height:32px; font-size:0; margin-top:0}
.president_20th_rolling_svg, .president_20th_rolling_t, .president_20th_rolling_btn{display:inline-block; vertical-align:top}
.president_20th_rolling_svg{width:16px; height:16px; fill:#2734a4; margin:7px 0 0 10px}
.header .president_20th_rolling_svg{position:relative}
.president_20th_rolling_t{width:calc(100% - 82px); font-size:12px; font-weight:300; line-height:30px; padding:0 10px; letter-spacing:-0.2px}
.president_20th_rolling_t_con{display:flex; height:100%; justify-content:center; align-items:center}
.president_20th_rollingbanner{position:relative; width:100%; height:30px}
.president_20th_rollingbanner > .wrap{position:relative; width:auto; height:100%; overflow:hidden}
.president_20th_rollingbanner li{position:absolute; top:-30px; left:0; right:0}
.president_20th_rollingbanner li.prev{top:-30px; transition:top 0.5s ease}
.president_20th_rollingbanner li.current{top:0; transition: top 0.5s ease}
.president_20th_rollingbanner li.next{top:30px}
.president_20th_rollingbanner a{display:block}
.president_20th_rolling_btn{position:relative; width:16px; height:16px; border:1px solid #ccc; border-radius:2px; background:#fff; margin:6px 0 0 4px; font-size:8px; text-align:center; line-height:16px; font-weight:200}




.nim{}

