@charset "utf-8";
/*************************************************
프로젝트명 : 연합뉴스 국문 모바일 홈페이지 (2019)
comment : article.css (본문 소재)
*************************************************/

/* ---- 본문 텍스트 ---- */
.story-news{margin-top:20px;padding-bottom:5px;}
.story-news>p,
.story-news>table{margin:0 20px 19px 20px;font-size:17px;line-height:1.62;color:#000;word-break:break-word;}

/* 부제 */
.story-news .tit-sub{position:relative;margin:0 20px 19px 20px;padding-left:14px;}
.story-news .tit-sub:before{content:"";display:block;clear:both;position:absolute;top:1px;left:0;width:2px;height:100%;background-color:#4a4a4a;}
.story-news .tit-sub .tit{font-weight:normal;font-size:17px;line-height:1.503288;}
.story-news .tit-sub .tit+.tit{margin-top:10px;}

/* 괘선- base64 */
.story-news img[src*="data:image"]{display:block;/* margin:0 auto; */}

/* YHML - 하이퍼링크, 오픈링크 */
.story-news .txt-hyper{display:inline;}
.story-news .txt-openurl{display:block;margin:5px 20px 24px;}
.story-news .txt-hyper a,
.story-news .txt-openurl a{border-bottom:1px solid #1977d6;color:#1977d6;}

/* YHML - Not Found */
.ynaobject{display:none !important;}

/* ---- 본문 하단 ---- */
.story-info{margin:0 20px 20px;}
.story-info .keyword-zone{margin-bottom:12px;}
.story-info .info-area{position:relative;min-height:34px;}
.story-info .btn-cmt01{position:absolute;bottom:0;left:0;}
@media only screen and (max-width:320px){
	.story-info{margin-left:14px;margin-right:14px;}
} /* Media Query End (320px) */

/* ---- 본문 컴포넌트 공통 (common) ---- */
.comp-box{padding:5px 0 24px;}
.comp-box p{}

/* ---- 이미지 타입 ---- */
.image-zone{}
.image-zone .img-con{display:block;}
.image-zone .img-con>a,
.image-zone .img-con>span{display:block;}
.image-zone .img-con .img{overflow:hidden;cursor:pointer;}
.image-zone .img-con img{width:100%;}
.image-zone .desc-con{margin:15px 36px 0;font-size:14px;line-height:1.68;}
.image-zone .desc-con a{}
.image-zone .tit-cap{color:#000;}
.image-zone .txt-desc{color:#6c6c6c;}


@media only screen and (max-width:320px){
	.image-zone{}
	/* .image-zone .desc-con{margin:15px 30px 0;} */
} /* Media Query End (320px) */

/* ---- 이미지 타입 컨트롤 ---- */

/* YHML - 내장/사전 */
.photo-group{}

/* YHML - 그래픽 */
.graphic-group{}

/* YHML - 차트 */
.chart-group{}

/*YHML -  GIF */
.gif-group{}

/* YHML - 화보 */
.gallery-group{}

/* ---- 영상 타입 ---- */
.video-zone{position:relative;}
.video-zone .img-con,
.video-zone .vid-con{overflow:hidden;display:block;position:relative;width:100%;height:0;padding-top:56.25%;}
.video-zone .img-con{}
.video-zone .img-con a{display:block;position:absolute;top:0;left:0;width:100%;}
.video-zone .img-con .img{overflow:hidden;position:absolute;top:0;left:0;width:100%;height:100%;}
.video-zone .img-con .video{position:absolute;top:50%;left:50%;width:68px;margin:-25px 0 0 -34px;}
.video-zone .img-con+.vid-con{display:none;}
.video-zone .vid-con{background:#000;}
.video-zone .vid-con iframe,
.video-zone .vid-con video{position:absolute;top:0;left:0;width:100%;height:100%;}
.video-zone .desc-con{margin:15px 36px 0;font-size:14px;line-height:22px;}
.video-zone .desc-con p{display:inline;}
.video-zone .tit-cap{color:#000;}
.video-zone .txt-desc{color:#6c6c6c;}
.video-zone .txt-desc+.btn-more04{top:-3px;margin-left:14px;}
.video-zone .txt-desc:empty+.btn-more04{margin-left:0;}
.video-zone.active .img-con{display:none;}
.video-zone.active .img-con+.vid-con{display:block;}

/* ---- 영상 타입 컨트롤 ---- */

/* YHML - 영상(MYH), 소재영상(MCM) */
.video-group{}

/* YHML - 유튜브 */
.youtube-group{}

/* ---- 키워드 영역 ---- */
.keyword-zone{}
.keyword-zone .list{margin-right:-2px;font-size:0;text-align:right;}
.keyword-zone .list>li{display:inline-block;margin:0 0 2px 4px;line-height:31px;}
.keyword-zone .list>li:first-child{margin-left:0;}
.keyword-zone .list>li>a{display:inline-block;position:relative;height:31px;padding:0 2px;font-size:13px;line-height:inherit;color:#0068d1;vertical-align:top;}
.keyword-zone .list .ico-type05{position:relative;top:50%;left:0;margin-right:2px;
-webkit-transform:translateY(-50%);
transform:translateY(-50%);}

/* ---- 기자영역 ---- */
.writer-zone{text-align:right;}
.writer-zone>a{display:inline-block;}
.writer-zone .img-con{overflow:hidden;display:inline-block;width:34px;height:34px;border-radius:50%;vertical-align:top;}
.writer-zone .img-con img{width:100%;}
.writer-zone .txt-con{display:inline-block;position:relative;height:34px;margin-left:10px;text-align:left;vertical-align:top;}
.writer-zone .tit-name{display:block;font-size:15px;line-height:100%;color:#000;}
.writer-zone .btn-more04{position:absolute;bottom:-6px;left:0;}

/* ---- (임시) 개별 포토 본문 ---- */
/* 상단 포토 영역 */
.photo-view-zone{}
.image-zone02 .img-con{display:block;}
.image-zone02 .img-con .img{display:block;}
.image-zone02 .img-con img{width:100%;}
.image-zone02 .desc-con{margin:15px 36px 0;font-size:14px;line-height:22px;}
.image-zone02 .desc-con a{}
.image-zone02 .tit-cap{color:#000;}
.image-zone02 .txt-desc{color:#6c6c6c;}

/* ---- (임시) 영상 본문 ---- */
/* 상단 영상 재생 영역 */
.video-view-zone{}
.video-zone02{position:relative;}
.video-zone02 .img-con,
.video-zone02 .vid-con{overflow:hidden;display:block;position:relative;width:100%;height:0;padding-top:56.25%;}
.video-zone02 .img-con{}
.video-zone02 .img-con .img{position:absolute;top:0;left:0;width:100%;height:100%;}
.video-zone02 .img-con img{width:100%;}
.video-zone02 .img-con .video{position:absolute;top:50%;left:50%;width:68px;margin:-25px 0 0 -34px;}
.video-zone02 .img-con+.vid-con{display:none;}
.video-zone02 .vid-con{background:#000;}
.video-zone02 .vid-con iframe,
.video-zone02 .vid-con video{position:absolute;top:0;left:0;width:100%;height:100%;}
.video-zone02.active .img-con{display:none;}
.video-zone02.active .img-con+.vid-con{display:block;}

/* ---- (참고) video-zone, video-zone01 공통 영상 비율 ---- */
/* default - 16:9
 * ratio01 - 9:16 (세로)
 * ratio02 - 4:3
 * ratio03 - 21:9
 * ratio04 - 18:9 */
[class*='video-zone'].ratio01 .img-con,
[class*='video-zone'].ratio01 .vid-con{padding-top:177.7778%;}
[class*='video-zone'].ratio02 .img-con,
[class*='video-zone'].ratio02 .vid-con{padding-top:75%;}
[class*='video-zone'].ratio03 .img-con,
[class*='video-zone'].ratio03 .vid-con{padding-top:42.857142857%;}
[class*='video-zone'].ratio04 .img-con,
[class*='video-zone'].ratio04 .vid-con{padding-top:50%;}


@media only screen and (max-width:320px){
	.story-news>p,
	.story-news .txt-openurl{margin-left:14px;margin-right:14px;}
	.comp-box [class*='-zone'] .desc-con{margin-left:30px;margin-right:30px;}
} /* Media Query End (320px) */

/* ----- 본문 글자 크기 조정 ----- */
/* article-font1 : 가장작게
 * article-font2 : 작게
 * article-font3 : 보통 (기본)
 * article-font4 : 크게
 * article-font5 : 가장크게 */
.article-font1 .story-news>p,
.article-font1 .story-news .txt-openurl{margin-bottom:16px;font-size:13px;}
.article-font1 .comp-box{padding:4px 0 20px;}
.article-font1 .comp-box .desc-con{font-size:13px;}

.article-font2 .story-news>p,
.article-font2 .story-news .txt-openurl{margin-bottom:18px;font-size:15px;}
.article-font2 .comp-box{padding:5px 0 23px;}
.article-font2 .comp-box .desc-con{font-size:13px;}

.article-font3 .story-news>p,
.article-font3 .story-news .txt-openurl{margin-bottom:19px;font-size:17px;}
.article-font3 .comp-box{padding:5px 0 24px;}
.article-font3 .comp-box .desc-con{font-size:14px;}

.article-font4 .story-news>p,
.article-font4 .story-news .txt-openurl{margin-bottom:24px;font-size:20px;}
.article-font4 .comp-box{padding:6px 0 30px;}
.article-font4 .comp-box .desc-con{font-size:15px;}

.article-font5 .story-news>p,
.article-font5 .story-news .txt-openurl{margin-bottom:29px;font-size:24px;}
.article-font5 .comp-box{padding:7px 0 36px;}
.article-font5 .comp-box .desc-con{font-size:16px;}

/* 본문 첫 컨텐츠로 오는 comp-box 상단 여백제거 */
.article-wrap .story-news > .comp-box:first-child{padding-top:0;}