@charset "utf-8";

/************************************************
project : 연합뉴스 다국어 리뉴얼
commnet : Article
*************************************************/

/* 컴포넌트 공통 */
.comp-box{}
.comp-box .btn-caption{margin-top:8px;font-size:12px;}
.comp-box figure{display:table;max-width:100%;margin:0 auto;}
.comp-box img{max-width:100%;}

/* btn-caption */
.pic-zone .btn-caption .txt-hide,
.video-zone .btn-caption .txt-show,
.related-zone .txt-more{display:inline-block;}
.pic-zone .btn-caption .txt-show,
.video-zone .btn-caption .txt-hide,
.related-zone .txt-close{display:none;}

html.fr .pic-zone .btn-caption .txt-hide, 
html.en .pic-zone .btn-caption .txt-hide,
html.es .pic-zone .btn-caption .txt-hide,
html.fr .pic-zone .btn-caption .txt-show,
html.en .pic-zone .btn-caption .txt-show,
html.es .pic-zone .btn-caption .txt-show
{ font-weight:400; font-size:13px }

html.ja .article-story{text-align:justify;}
html.ja .btn-caption.btn{ display:none; }
.btn-caption.btn{color:#5c7895;}
.btn-caption.btn:after{content:'';display:inline-block;box-sizing:border-box;width:19px;height:20px;margin-left:10px;border:1px solid #ccc;background:url(../img/sprites_btn.png) no-repeat -381px -166px;vertical-align:middle;
-webkit-transform:rotate(0deg);
-moz-transform:rotate(0deg);
-ms-transform:rotate(0deg);
-o-transform:rotate(0deg);
transform:rotate(-0deg);}
.btn-caption.btn.on:after{
-webkit-transform:rotate(-180deg);
-moz-transform:rotate(-180deg);
ms-transform:rotate(-180deg);
-o-transform:rotate(-180deg);
transform:rotate(-180deg);}

/* text - 텍스트 */
.text-group p{font-size:18px;line-height:1.5;}
.text-group i{font-style:italic;font-weight:400;}
.text-group strong i{font-weight:700;}
.text-group a.link{color:#0068d1;text-decoration:underline;}
.text-group a.link i{text-decoration:underline;}
.text-group a.link strong{text-decoration:underline;}
.text-group em.under{text-decoration:underline;}
.text-group em.under i{text-decoration:underline;}
.text-group em.under strong{text-decoration:underline;}
html.zh .text-group p{text-indent:30px;}

.caption-zone{margin-top:10px;font-size:14px;line-height:1.3;}
.caption-zone strong{color:#000;}
.caption-zone p{margin:5px 0 0 0;}
.caption-zone .desc{margin-bottom:0;}

/* slide group (photo / video) */
.slider-group{}
.slider-group .inner{}
.slide-article{}
/* .slide-article .pto-view-con{}
.slide-article .img-box{}
.slide-article figure{}
.slide-article figure img{}
.slide-article figure{} */
.slide-article figure figcaption{display:none;}

.slider-group .thumb-box{position:relative;margin-top:20px;}
.slider-group .thumb-list-wrap{overflow:hidden;width:750px;margin-top:20px;}
.slider-group .thumb-imgs{position:relative;}

.slider-group .control-box{position:relative;padding-bottom:8px;border-bottom:1px solid #ccc;}
.slider-group .control-box .controller{float:right;}
.slider-group .control-box .controller button{float:left;position:relative;box-sizing:border-box;width:25px;height:21px;margin-left:-1px;border:1px solid #ccc;text-indent:-9999px;}
.slider-group .control-box .controller .btn-prev:after,
.slider-group .control-box .controller .btn-next:after{content:'';display:block;position:absolute;top:50%;left:50%;width:5px;height:7px;margin:-3px 0 0 -2px;background-image:url(../img/sprites_btn.png);}
.slider-group .control-box .controller .btn-prev:after{background-position:-194px -12px;}
.slider-group .control-box .controller .btn-next:after{background-position:-224px -12px;}
.slider-group .control-box .controller .btn-prev.end:after{background-position:-194px -42px;}
.slider-group .control-box .controller .btn-next.end:after{background-position:-224px -42px;}
.slider-group .control-box .num{font-size:14px;line-height:24px;}
.slider-group .control-box .num strong{font-weight:700;color:#0068d1;}

.slider-group .btn-prev02,
.slider-group .btn-next02{display:none;position:absolute;z-index:5;top:40%;width:50px;height:90px;text-indent:-9999px;background-image:url(../img/sprites_btn.png);}
.slider-group .btn-prev02{left:20px;background-position:-415px -583px;}
.slider-group .btn-next02{right:20px;background-position:-508px -583px;}
.pic-zone .pto-view-con.slick-slide .img-box,
.pic-zone .thumb-imgs div.thum-slide.slick-slide,
.video-zone .thumb-imgs div.thum-slide.slick-slide{position:relative;}

/* slide photo */
.pic-zone .img-box{position:absolute;display:none;}
.pic-zone .slick-slider .img-box{display:block;}
.pic-zone .img-box figure{display:block;overflow:hidden;width:750px;height:430px;text-align:center;background:#eee;}
.pic-zone .img-box figure img{max-width:100%;height:100%;margin:auto;width:auto;}
.pic-zone .img-box figure img.landscape,
.page-kt .pic-zone02 .img-box figure img.landscape{max-width:100%;max-height:100%; margin:auto; height:auto; width:100%;top:0;bottom:0;left:0;right:0;position:absolute;}
.pic-zone .img-box figure img.portrait{max-width:100%;max-height:100%; margin:auto; height:100%; width:auto;top:0;bottom:0;left:0;right:0;position:absolute;}

.pic-zone .thumb-imgs div.thum-slide:first-child{margin-left:0;}
.pic-zone .thumb-imgs div.thum-slide{float:left;position:absolute;width:85px;margin-left:10px;}
.pic-zone div.thumb-slide{/*position:absolute;*/}/*본문맵핑 슬라이드용 썸네일이 안보여 삭제*/
.pic-zone .thumb-imgs .img-con{overflow:hidden;width:85px;height:85px;box-sizing:border-box;}
.pic-zone .thumb-imgs .img-con img{width:85px;height:85px;}
.pic-zone .thumb-imgs .img-con1 a:before{content:'';position:absolute;top:50%;left:50%;width:45px;height:45px;margin:-22px 0 0 -22px;background:url(../img/sprites_video.png) -120px -10px no-repeat;}
.pic-zone .thumb-imgs .slick-current a:after,
.pic-zone .thumb-imgs.newPicZone .slick-currentOn a:after,
.pic-zone .thumb-imgs .img-con:hover a:after,
.pic-zone .thumb-imgs .img-con.on a:after{content:'';display:block;position:absolute;z-index:3;top:0;width:100%;height:100%;border:3px solid #0068d1;box-sizing:border-box;}
/*.pic-zone .thumb-imgs.newPicZone .slick-current a:after{ display:none;}*/

/* slide video */
.video-zone .img-box{position:relative;}
.video-zone .btn-play{position:absolute;top:0;left:0;width:100%;height:430px;text-align:center;}
.video-zone .btn-play span{display:inline-block;width:100px;height:100px;text-indent:-9999px;background:url(../img/sprites_video.png) 0 -109px no-repeat;}
.video-zone .thumb-imgs{overflow:hidden;}
.video-zone .thumb-imgs div.thum-slide:first-child{margin-left:0;}
.video-zone .thumb-imgs div.thum-slide{float:left;position:absolute;width:220px;margin-left:20px;}
.video-zone .thumb-imgs .img-con{overflow:hidden;position:relative;width:220px;height:125px;box-sizing:border-box;}
.video-zone .thumb-imgs .img-con img{width:100%;height:125px;}
.video-zone .thumb-imgs .txt-con{margin-top:10px;font-size:16px;color:#000;}
.video-zone .caption-zone p{overflow-y:auto;max-height:125px;margin:10px 0 5px;padding-right:5px;}
.video-zone .thumb-imgs .img-con:hover a:before{content:'';position:absolute;top:50%;left:50%;width:45px;height:45px;margin:-22px 0 0 -22px;background:url(../img/sprites_video.png) -120px -10px no-repeat;}
.video-zone .thumb-imgs .img-con.on a:after{content:'';display:block;position:absolute;z-index:3;top:0;width:100%;height:100%;border:3px solid #0068d1;box-sizing:border-box;}
/*.flex-active-slide .img-con a:after{content:'';display:block;position:absolute;z-index:3;top:0;width:100%;height:100%;border:3px solid #0068d1;box-sizing:border-box;}*/
.video-zone .video-view-con{position:relative;}
.video-zone .video-view-con .box-video-list02{width:620px;margin:40px auto 0;}
.video-zone .video-view-con .box-video-list02 li{width:180px;margin-left:20px;}
.video-zone .video-view-con .box-video-list02 li .img-con{width:180px;height:103px;}

/* wiki - 위키  */
.wiki-zone{display:table;width:100%;padding:20px;border:1px solid #ccc;box-sizing:border-box;}
.wiki-zone:after{content:'';display:block;clear:both;}
.wiki-zone .img-con{/*display:table-cell;*/width:150px;height:150px;float:left;}
.wiki-zone .img-con img{width:150px;height:150px;}
.wiki-zone .txt-con{/*display:table-cell;*/width:498px;float:right;padding-left:30px;vertical-align:middle;}
.wiki-zone .txt-con a:hover{text-decoration:none;}
.wiki-zone .txt-con p{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;word-wrap:break-word;}
.wiki-zone .txt-con a:hover p{text-decoration:underline;}
.wiki-zone .txt-con .tit{font-size:20px;font-weight:400;color:#000;}
.wiki-zone .info-con{margin-top:15px;padding-top:15px;border-top:1px dotted #ccc;color:#666;}
.wiki-zone .info-con .tit02{display:block;font-size:16px;color:#000;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;overflow:hidden;}
.wiki-zone .info-con .tag{margin-top:8px;font-weight:400;font-size:12px;}
.wiki-zone .info-con p{margin:2px 0 0 0;line-height:1.3;}

/* related articels - 관련기사  */
.related-zone{width:100%;padding-top:13px;border-top:1px solid #ccc;box-sizing:border-box;}
.related-zone .tit{font-size:18px;font-weight:700;color:#000;}
.related-zone .btn{display:block;width:100%;margin-top:15px;padding:13px 15px 14px;background:#eee;text-align:center;box-sizing:border-box;}
.related-zone .btn span{font-weight:600;font-size:14px;color:#666;}
.related-zone .btn span em{padding-left:3px;color:#0068d1;}
.related-zone .btn span:after{content:'';display:inline-block;width:9px;height:5px;margin-left:15px;background:url(../img/sprites_btn.png) -465px -130px no-repeat;vertical-align:middle;}
.related-zone .btn.on span:after{-webkit-transform:rotate(-180deg);-moz-transform:rotate(-180deg);-o-transform:rotate(-180deg);transform:rotate(-180deg);}
.related-zone .btn:hover{background:#666;}
.related-zone .btn:hover span{color:#fff;}
.related-zone .btn:hover span:after{content:'';display:inline-block;background-position:-446px -130px;}
.related-zone .btn:hover span em{color:#fff;}

.related-zone .article-list{margin-top:13px;overflow:hidden;}
.related-zone .article-list.max{max-height:70px;}
.related-zone .article-list.on{max-height:100%;}

.related-zone .article-list ul.hidden{display:none;}
.related-zone .article-list ul li{display:none;position:relative; padding:1px 0 8px 0;line-height:21px;font-size:18px; }
.related-zone .article-list ul li:after{content:'';display:block;clear:both;}
.related-zone .article-list ul li a,
.related-zone .article-list ul li span{display:inline-block;color:#666;}
.related-zone .article-list ul li a{position:relative;float:left;padding-left:10px;width:80%;color:#333;}
.related-zone .article-list ul li a:after{content:'';display:inline-block;position:absolute;top:9px;left:0;width:3px;height:3px;background:#888888;}
.related-zone .article-list ul li span.date{float:right;line-height:22px;}

/* person - 인물  */
.person-zone{display:table;width:100%;padding:20px;border:1px solid #ccc;box-sizing:border-box;}
.person-zone:after{content:'';display:block;clear:both;}
.person-zone .img-con{display:table-cell;width:96px;height:96px;vertical-align:middle;background:url(../img/no_image.gif) no-repeat 0 0;background-size:contain;}
.person-zone .img-con img{max-width:150px;min-height:150px;}
.person-zone .txt-con{display:table-cell;width:530px;padding-left:30px;vertical-align:middle;}
.person-zone .txt-con .tit{font-size:24px;font-weight:400;color:#000;}
.person-zone .txt-con .info-con{margin-top:20px;}
.person-zone .txt-con .info-con dt{float:left;width:14%;color:#333;}
.person-zone .txt-con .info-con dd{float:left;width:83%;}


/* snippet - 링크 */
.snippet-zone{display:table;width:100%;padding:20px;border:1px solid #ccc;box-sizing:border-box;}
.snippet-zone:after{content:'';display:block;clear:both;}
.snippet-zone .img-con{display:table-cell;width:100px;height:100px;border:1px solid #ccc;text-align:center;vertical-align:middle;}
.snippet-zone .img-con img{max-width:100px;min-height:100px;}
.snippet-zone .txt-con{display:table-cell;width:100%;}
.snippet-zone .txt-con .tit{font-size:20px;font-weight:400;color:#000;}
.snippet-zone .txt-con .info-con{/*margin-top:13px;*/}
.snippet-zone .txt-con .info-con p{margin-bottom:13px;}
.snippet-zone .txt-con .info-con a.link{display:inline-block;color:#0068d1;}

/* social - 소셜게시물 */
.social-zone{width:100%;padding:10px;border:1px solid #ccc;box-sizing:border-box;}
.twitter-tweet{margin:0 auto;}/* twitter */

/* map - 구글지도 */
.map-zone{border:1px solid #ccc;}

/* banner - 배너 */
.bnr-zone{margin:40px 0 0px 0;text-align:center;}

/* keword - 키워드 */
.keyword-zone01{margin-top:50px;}
.keyword-zone01 .tit{display:block;font-size:18px;color:#000;}
.keyword-zone01 .tag{margin-top:15px;}
.keyword-zone01 .tag a{display:inline-block;margin:0px 7px 9px 0;padding:5px 10px;background:#f6f6f6;border-radius:20px;font-weight:400;font-size:14px;color:#666;}

/* quo - 인용구 */
.quo-group .quo01{position:relative;padding:32px 0 40px;font-size:30px;line-height:34px;color:#000;text-align:center;}
.quo-group .quo01:after{content:'';position:absolute;top:0;left:50%;width:22px;height:19px;margin-left:-11px;background:url(../img/sprites_icon.png) -150px -483px no-repeat;}
.quo-group .quo01:before{content:'';position:absolute;bottom:0;left:50%;width:22px;height:19px;margin-left:-11px;background:url(../img/sprites_icon.png) -150px -513px no-repeat;}
.quo-group .quo02{position:relative;padding-left:20px;font-size:30px;line-height:34px;color:#000;text-align:left;}
.quo-group .quo02:after{content:'';position:absolute;top:0;left:0;width:3px;height:100%;background:#5c7895;}

/* hr - 구분선 */
.hr-group hr{display:block}
.hr-group .hr01{margin:0;border:0;border-top:1px solid #ccc;}

/* chart - 차트 */
.chart-zone{text-align:center;}
.chart-zone strong{margin-bottom:15px;font-size:18px;color:#333;}
.chart-zone figure{max-width:748px;border:1px solid #ccc;}

/* table - 테이블 */
.table-group .tit{font-size:20px;color:#000;}
.table-group .txt{margin-top:10px;font-size:12px;line-height:1.3;color:#5c7895;}
.table-zone{margin-top:16px;}
/* table-type01 */
.tbl-style01{position:relative;width:100%;border-collapse:collapse;border-spacing:0;}
.tbl-style01 th{box-sizing:border-box;padding:15px 20px;font-size:16px;color:#000;}
.tbl-style01 thead th:before{content:'';display:block;position:absolute;top:0;left:0px;width:100%;border-top:1px solid #000;}
.tbl-style01 thead th{border-left:1px solid #e2e2e2;border-bottom:1px solid #ccc;background:#f5f5f5;text-align:center;}
.tbl-style01 thead th:first-child{border-left:0;}
.tbl-style01 tbody{border-bottom:1px solid #ccc;}
.tbl-style01 tbody th{padding-left:50px;border-top:1px dotted #ccc;background:#fcfcfc;text-align:left;}
.tbl-style01 tbody td{padding:12px 20px;border-left:1px solid #e2e2e2;border-top:1px dotted #ccc;font-size:14px;text-align:center;}
.tbl-style01 tr td:first-child{border-left:0;}
.tbl-style01 tbody td.v-top{vertical-align:top;}
.tbl-style01 tbody.left th:first-child{border-left:0;}
.tbl-style01 tbody.left th{border-left:1px solid #e2e2e2;text-align:left;}
.tbl-style01 tbody.left td{padding:8px 20px;text-align:left;}
.tbl-style01 tbody th.tit01{padding-left:0;padding-right:0;text-align:center;background:#f5f5f5;}
.tbl-style01 tbody td.tit01{padding-left:0;padding-right:0;text-align:center;background:#fcfcfc;}
.tbl-style01 tbody td.left{text-align:left;}

/* table-type02 */
.tbl-style02{position:relative;width:100%;border-collapse:collapse;border-spacing:0;}
.tbl-style02 th{padding:15px 20px;font-size:16px;color:#000;box-sizing:border-box;}
.tbl-style02 tbody{border-bottom:1px solid #ccc;}
.tbl-style02 tbody > tr th:before{content:'';display:block;position:absolute;top:0;left:0px;width:100%;border-top:1px solid #000;}
.tbl-style02 tbody th.tit01{border-top:1px dotted #ccc;background:#f5f5f5;text-align:center;}
.tbl-style02 tbody td{padding:12px 20px;border-left:1px solid #e2e2e2;border-top:1px dotted #ccc;font-size:14px;text-align:center;}
.tbl-style02 tr td:first-child{border-left:0;}
.tbl-style02 tbody td.v-top{vertical-align:top;}
.tbl-style02 tbody.left th:first-child{border-left:0;}
.tbl-style02 tbody.left th{border-left:1px solid #e2e2e2;text-align:left;}
.tbl-style02 tbody.left td{padding:8px 20px;text-align:left;}

/* 프린트 페이지 0213 추가 */
#print-wrap{margin:0 auto;width:750px;padding:0;overflow:hidden;}
#print-wrap header{background:#33364e;overflow:hidden;}
.print-logo{float:left;width:310px;height:25px;background-size:250px;margin-left:15px;margin:15px;}
.print-btn-area{float:right;width:180px;}
.print-btn-print{color:#fff;float:left;margin-right:20px;cursor:pointer;}
.print-btn-print span{width:20px;height:20px;background:url(../img/sprites_btn.png) no-repeat -176px -125px;display:block;float:left;margin-right:3px;}
.print-btn-close{color:#fff;float:left;cursor:pointer;}
.print-btn-close span{width:20px;height:20px;background:url(../img/sprites_btn.png) no-repeat -206px -125px;display:block;float:left;margin-right:3px;}

.news-title-area{padding:30px 15px 15px 15px;border-bottom:1px solid #ccc;}
.print-news-title{font-size:36px;margin-bottom:20px;line-height:44px;}
.print-news-date{font-size:13px;}

.news-body-area{padding:20px 15px;border-bottom:1px solid #ccc;margin-bottom:20px;min-height:670px;}
.print-copyright{text-align:center;font-size:14px;margin-bottom:20px;}

/* 프린트페이지 수정 18-08-21 */
.en-print-logo{background:url(../img/en_sprites_lang.png) no-repeat 0 0;}
.cn-print-logo{background:url(../img/cn_sprites_lang.png) no-repeat 0 0;}
.jp-print-logo{background:url(../img/jp_sprites_lang.png) no-repeat 0 0;}
.ar-print-logo{background:url(../img/ar_sprites_lang.png) no-repeat 70px 0;float:right;}
.sp-print-logo{background:url(../img/sp_sprites_lang.png) no-repeat 0 0;}
.fr-print-logo{background:url(../img/fr_sprites_lang.png) no-repeat 0 0;}

.image-gallery{overflow:hidden;width:20000px;max-height:1200px;}
.image-gallery div{float:left;width:1100px;}

/* 광고 */
.aside-bnr01{margin:30px 0 30px;overflow:hidden;}
.aside-bnr01>aside{display:block;float:left;width:50%;}
.aside-bnr01>aside div{margin:0 auto;}

/*  2018-12-06 본문 관련기사 5개 추가*/
.related-zone .article-list ul li:nth-child(1), .related-zone .article-list ul li:nth-child(2), .related-zone .article-list ul li:nth-child(3), .related-zone .article-list ul li:nth-child(4), .related-zone .article-list ul li:nth-child(5) { display:block !important; }