@charset "utf-8";
/* CSS Document */

/*
First Write : 2021-08-17
Last Update : 2021-12-30
Author: Jcode
*/


/* 기사상세 ----------------------------------------------------- */
/* 기사상세 : 헤드영역 */
.bodynews {padding: 0 49px 0 50px; border-right: 1px solid #ddd;}
.bodynews .header {margin-bottom: 30px; padding-bottom: 15px; border-bottom: 1px solid #ddd; }
.bodynews h2 {margin-bottom: 15px; font-size: 2.2rem; letter-spacing: -2px; line-height: 1.2;}
.bodynews h3 {margin-bottom: 20px; color: #666; font-size: 1.1rem; border-left: solid 3px #888; padding-left: 10px;}
.bodynews .writetime {display: flex; margin-bottom: 20px; font-size: 0.9rem; color: #999;}
.bodynews .writetime p:nth-child(1) {
  padding-right: 30px;
  background-color: transparent;
  background-image: url(/images/bullet.png);
  background-repeat: no-repeat;
  background-position: right -65px top -1435px;
}
.bodynews .fncbtnbox {display: flex; justify-content: space-between; align-items: center;}
.bodynews .fncbtnbox div {display: flex; align-items: center;}
.bodynews .fncbtnbox button {
  display: inline-block;
  margin-right: 5px;
  width: 60px;
  height: 30px;
  border-radius: 5px;
  font-size: 0.9rem;
  border: 1px solid #ccc;
  background-color: #eee;
}
.bodynews .fncbtnbox button:nth-child(1) {font-size: 1.2rem;}
.bodynews .fncbtnbox button:nth-child(2) {font-size: 0.8rem;}
.bodynews .fncbtnbox button:nth-child(3) {font-size: 0.8rem;}
.bodynews .fncbtnbox ul {display: flex;}
.bodynews .fncbtnbox ul li {margin-left: 5px;}
.bodynews .fncbtnbox ul li a {
  display: inline-block;
  width: 26px;
  height: 26px;
  text-indent: -9999px;
  background-image: url(/images/icon.png?20240430v1);
  background-repeat: no-repeat;
}
.bodynews .fncbtnbox ul li:nth-child(1) a {
  background-image: url(/images/common/sns_kakaotalk_ov.png);
}
.bodynews .fncbtnbox ul li:nth-child(2) a {background-position: left -40px top -80px;}
.bodynews .fncbtnbox ul li:nth-child(3) a {background-position: left -40px top -160px;}
.bodynews .fncbtnbox ul li:nth-child(4) a {background-position: left -120px top -160px;}
.bodynews .fncbtnbox ul li:nth-child(5) a {background-position: left -200px top -160px;}


/* 기사상세 : 본문내용 */
.bodynews .contents {padding-bottom: 20px; padding-left: 10px; padding-right: 10px; font-weight: 400;  font-size: 17px; line-height: 27px; color: #222; letter-spacing: -0.3px;}
.bodynews .contents p {margin-bottom: 18px; margin-top: 18px;}
.bodynews .contents figure {margin: 40px auto; width: 600px;}
.bodynews .contents figure img {width: 100%;}
.bodynews .contents figcaption {padding-top: 10px; color: #666; font-size: 0.9rem;}
.bodynews .contents table { border-collapse: unset; }
.bodynews .contents .news_img_caption {padding-top: 10px; padding-bottom: 10px; color: #666; font-size: 0.9rem; line-height: 1.4;}

/*S: 인물디비 정치기사 하이라이트*/
.person-highlight {
  background-color: antiquewhite;
  cursor: default;
}
#profile {
  position:absolute;
  z-index: 5;
  overflow: hidden;
  width: 300px;
  background: #fff;
  border: 2px solid #a9a9a9;
  padding: 10px 10px;
  border-radius: 0.5rem;
  opacity: 0;
  display: none;
}
#profile .thumb {
  width: 120px;
  height: 150px;
  overflow: hidden;
  float: left;
  border-radius: 0.5rem;
  position: relative;
}
#profile .thumb img { width: 100%; height: 100%; object-fit: cover; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#profile .txt li::before {
  float: left;
  margin-right: 4px;
  content: "•";
  color: #666666;
}
#profile .label {
  padding: 2px 4px !important;
  font-size: 0.75rem !important;
  color: #fff !important;
  display: inline;
}
.profile .txt {
  width: calc(100% - 140px);
  margin-left: 20px;
  float: left;
  font-size: 0.85rem;
}
.profile p { margin-bottom: 2px; }
.profile .name { margin-bottom: 15px; font-size: 1.4rem; font-weight: bold; }
.profile .history span { display: block; margin-bottom: 2px; }

/* 당컬러 */
.c_01 {background-color: #12298c;} /* 01 더불어민주당 */
.c_02 {background-color: #e60024;} /* 02 국민의힘*/
.c_03 {background-color: #ffed00;} /* 03 정의당 */
.c_04 {background-color: #ed6d00;} /* 04 개혁신당 */
.c_05 {background-color: gray;} /* 05 기본소득당 */
.c_06 {background-color: gray;} /* 06 무소속 */
.c_07 {background-color: #0073cf;} /* 07 조국혁신당 */
.c_08 {background-color: gray;} /* 08 자유통일당 */
.c_09 {background-color: #9d3fbc;} /* 09 진보당 */
.c_10 {background-color: #36babe;} /* 10 새로운미래 */
.c_11 {background-color: #F58400;} /* 11 사회민주당 */

/*E: 인물디비 정치기사 하이라이트*/

/* 종목 하이라이트 */
.symbol-highlight {
  border-radius: 3px;
  border: solid 1px #CFD8DC;
  background-color: #ECEFF1;
}
#symbolHighlight-tooltip {
  position:absolute;
  z-index: 5;
  overflow: hidden;
  width: 280px;
  background: #fff;
  border: 2px solid #a9a9a9;
  padding: 10px 10px;
  border-radius: 0.5rem;
  opacity: 0;
  display: none;
  font-weight: 700;
}

/* 기사상세 : 디지털뉴스콘텐츠 이용규칙 보기 */
.bodynews .newsrule {
  margin: 20px 0;
  padding: 5px 22px;
  background-image: url(/images/bullet.png);
  background-repeat: no-repeat;
  background-position: left 10px top -1028px;
}
.bodynews .newsrule a {text-decoration: underline;}


/* 기사상세 : 베스트기사 + 관련기사 + 주요포토 */
.bodynews .inbox {margin-bottom: 40px; padding: 20px 30px; background-color: #e4ebf2;}
.bodynews .inbox > div {padding-bottom: 30px; margin-bottom: 10px;}
.bodynews .inbox > div:last-child {padding-bottom: 0;}
.bodynews .inbox > div .sectit {padding: 12px 0 2px 0;}
.bodynews .inbox > div h3 {margin-bottom: 10px; font-size:  1.1rem; border: none; padding-left: 0px;}
.bodynews .inbox > div:nth-child(1), .bodynews .inbox > div:nth-child(2) {border-bottom: 1px dashed #ccc;}
.bodynews .inbox > div:nth-child(1) article .summary {color: #888;}
.bodynews .inbox > div:nth-child(1) h3 {color: #ff0000; margin-bottom: 0;}
.bodynews .inbox > div:nth-child(2) h3 {color: #0841c3;}
.bodynews .inbox .hotphoto > div:nth-child(2) {display: flex; flex-wrap: wrap;}
.bodynews .inbox .hotphoto > div:nth-child(2) > div:nth-child(1) {flex-basis: 260px; margin-right: 20px; margin-bottom: 0;}
.bodynews .inbox .hotphoto > div:nth-child(2) > div:nth-child(2) {display: flex; flex-wrap: wrap; flex: 1;}
.bodynews .inbox .hotphoto > div:nth-child(2) > div:nth-child(2) article {width: 120px;}
.bodynews .inbox .hotphoto > div:nth-child(2) > div:nth-child(2) {display: flex; justify-content: space-between;}
.bodynews .inbox .hotphoto > div:nth-child(2) > div:nth-child(2) article {position: relative; width: 32%; margin-bottom: 10px;}
.bodynews .inbox .hotphoto > div:nth-child(2) > div:nth-child(2) article:nth-child(4),
.bodynews .inbox .hotphoto > div:nth-child(2) > div:nth-child(2) article:nth-child(5),
.bodynews .inbox .hotphoto > div:nth-child(2) > div:nth-child(2) article:nth-child(6), {margin-bottom: 0;}
.bodynews .inbox .hotphoto > div:nth-child(2) > div:nth-child(2) .thumb {height: 85px;}
.bodynews .inbox .hotphoto > div:nth-child(2) > div:nth-child(2) .subject {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  text-align: center;
}
.bodynews .inbox .hotphoto > div:nth-child(2) > div:nth-child(2) .subject a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(100% - 20px);
  height: calc(100% - 20px);
  padding: 10px;
  color: #fff;
  font-size: 0.9rem;
  background-color: rgba(0,0,0,.8);
  -webkit-transition: opacity 0.3s;
  transition: opacity 0.3s;
  opacity: 1;
}
.bodynews .inbox .hotphoto > div:nth-child(2) > div:nth-child(2) .subject a:hover {text-decoration: none; opacity: 0;}



/* 기사상세 : 푸터영역 */
.bodynews .footer {margin-bottom: 30px;}
.bodynews .footer .fncbtnbox {
  margin-bottom: 30px;
  padding-bottom: 15px;
  border-bottom: 1px solid #f2f2f2;
  background-image: url(/images/divline.png);
  background-repeat: repeat-x;
  background-position: left 0 bottom -11px;
}
.bodynews .footer p {font-size: 0.9rem; margin-bottom: 40px; text-align: center;}
.bodynews .footer .footbtnbox {display: flex; justify-content: space-between; align-items: center;}
.bodynews .footer .footbtnbox button {
  display: inline-block;
  margin-left: 5px;
  padding: 0 30px 0 20px;
  height: 36px;
  border-radius: 5px;
  font-size: 0.9rem;
  border: 1px solid #ccc;
  background-color: #eee;
  background-image: url(/images/bullet.png);
  background-repeat: no-repeat;
}
.bodynews .footer .footbtnbox button:nth-child(1) {background-position: right 10px top -388px;}
.bodynews .footer .footbtnbox button:nth-child(2) {background-position: right 10px top -947px;}



/* 상세 : GAM + 라씨로 기사추가 */
.gamrassiro {display: flex; margin: 30px 0; padding: 20px 10px; background-color: #eee;}
.gamrassiro > div {width: calc(50% - 10px);}
.gamrassiro > div:nth-child(1) {margin-right: 10px;}
.gamrassiro > div:nth-child(2) {margin-left: 10px;}
.gamrassiro h3 {
	margin-bottom: 10px;
	text-align: center;
	font-weight: bold;
	font-size: 1.1rem;
	border: none;
	padding-left: 0px;
	color: #333;
}
.gamrassiro h3 span {display: inline-block;}
.gamrassiro .inbox {padding: 0 15px; background-color: #fff; margin-bottom: 0px;}
.gamrassiro article {border-bottom: 1px dashed #ccc;}
.gamrassiro article:last-child {border-bottom: none;}
.gamrassiro .thumb_h {display: flex; align-items: center; padding: 15px 0; margin-bottom: 0px;}
.gamrassiro .thumb_h .thumb {position: relative; flex-basis: 90px; height: 74px; background-color: #eee; margin-right: 0px;}
.gamrassiro .thumb_h .subject {font-size: 1rem; flex: 1; letter-spacing: -1px ;}
.gamrassiro > div:nth-child(1) .thumb {margin-right: 10px;}
.gamrassiro > div:nth-child(2) .thumb {margin-left: 10px;}
.gamrassiro .thumb_h .thumb img {width: 100%; height: 100%; border: none;}
.gamrassiro .thumb_h .subject a {
	display: -webkit-box;
	overflow: hidden;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
}