@charset "utf-8";
/* CSS Document */

/* insight24 
@import url('https://webfontworld.github.io/SCoreDream/SCoreDream.css');
@import url('https://fonts.googleapis.com/css2?family=Nanum+Myeongjo:wght@400;700;800&family=Roboto:wght@100;300;400;500;700;900&display=swap');
*/

/* 기후시계 */
/*
@import url(https://static1.squarespace.com/static/versioned-site-css/600f8dac4894874fe905dce4/277/5c5a519771c10ba3470d8101/600f8dac4894874fe905dcfe/1403/site.css);
*/
@import url(//res.heraldm.com/climate/climate.css);


/* ====== font ======================================================================================================= */
/* Montserrat */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 100;
  src: url(//res.heraldm.com/font_new/Montserrat-Thin.otf.eot) format('eot'),
       url(//res.heraldm.com/font_new/Montserrat-Thin.woff) format('woff'),
       url(//res.heraldm.com/font_new/Montserrat-Thin.otf) format('opentype');
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 200;
  src: url(//res.heraldm.com/font_new/Montserrat-ExtraLight.otf.eot) format('eot'),
       url(//res.heraldm.com/font_new/Montserrat-ExtraLight.woff) format('woff'),
       url(//res.heraldm.com/font_new/Montserrat-ExtraLight.otf) format('opentype');
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 300;
  src: url(//res.heraldm.com/font_new/Montserrat-Light.otf.eot) format('eot'),
       url(//res.heraldm.com/font_new/Montserrat-Light.woff) format('woff'),
       url(//res.heraldm.com/font_new/Montserrat-Light.otf) format('opentype');
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  src: url(//res.heraldm.com/font_new/Montserrat-Regular.otf.eot) format('eot'),
       url(//res.heraldm.com/font_new/Montserrat-Regular.woff) format('woff'),
       url(//res.heraldm.com/font_new/Montserrat-Regular.otf) format('opentype');
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 500;
  src: url(//res.heraldm.com/font_new/Montserrat-Medium.otf.eot) format('eot'),
       url(//res.heraldm.com/font_new/Montserrat-Medium.woff) format('woff'),
       url(//res.heraldm.com/font_new/Montserrat-Medium.otf) format('opentype');
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 600;
  src: url(//res.heraldm.com/font_new/Montserrat-SemiBold.otf.eot) format('eot'),
       url(//res.heraldm.com/font_new/Montserrat-SemiBold.woff) format('woff'),
       url(//res.heraldm.com/font_new/Montserrat-SemiBold.otf) format('opentype');
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 700;
  src: url(//res.heraldm.com/font_new/Montserrat-Bold.otf.eot) format('eot'),
       url(//res.heraldm.com/font_new/Montserrat-Bold.woff) format('woff'),
       url(//res.heraldm.com/font_new/Montserrat-Bold.otf) format('opentype');
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 800;
  src: url(//res.heraldm.com/font_new/Montserrat-ExtraBold.otf.eot) format('eot'),
       url(//res.heraldm.com/font_new/Montserrat-ExtraBold.woff) format('woff'),
       url(//res.heraldm.com/font_new/Montserrat-ExtraBold.otf) format('opentype');
}
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 900;
  src: url(//res.heraldm.com/font_new/Montserrat-Black.otf.eot) format('eot'),
       url(//res.heraldm.com/font_new/Montserrat-Black.woff) format('woff'),
       url(//res.heraldm.com/font_new/Montserrat-Black.otf) format('opentype');
}


/* 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 ======================================================================================================= */
.trans{-webkit-transition:all .2s ease-in-out; -ms-transition:all .2s ease-in-out; transition:all .2s ease-in-out}
.ellipsis{text-overflow:ellipsis; overflow:hidden; white-space:nowrap;  word-wrap:break-word}
.ellipsis2, .ellipsis3, .ellipsis4, .ellipsis5{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}
.ellipsis4{-webkit-line-clamp:4}
.ellipsis5{-webkit-line-clamp:5}
.mr0 {margin-right:0 !important; }
.brb0 {border-bottom:0 !important}

.mt30{margin-top: 30px;}
.mt50{margin-top: 50px;}
.mt100{margin-top: 100px;}
.mb30{margin-bottom: 30px;}
.mb50{margin-bottom: 50px;}
.mb100{margin-bottom: 100px;}


/* ====== header ======================================================================================================= */
.wrap{position:relative; overflow:hidden;}
.header{position:relative; overflow:hidden; height:120px; background:#fff; width:1100px; margin:0 auto;}
.logo{position:relative; overflow:hidden; display:block; float:left; padding-top:45px}
.logo img{width:100%}
.util_wrap{float:right; overflow:hidden; position:relative; width:65px; padding-top:62px}
.search_box{ display: inline-block;}
.menu_wrap{position: absolute; top: 10px; right: 10px; }
.gnb_open{position: absolute; top: 63px; right: 10px; width:19px; height:17px; background:url(//res.heraldm.com/nbiz_2020/images/ico_menu.png);}
.gnb{margin-left:15px; display: inline-block; position: relative;    top: -6px;}

.climate_bg{position:absolute; overflow:hidden; top:37px; right:385px; width:244px; height:62px;}
.climate_title{position:absolute; top:0; left:0; padding:0 14px; font-size:16px; background:#000; color:#fff;  line-height:62px;}
.climate{position:absolute; transform:scale(0.4); top:-45px; left:19px;}

/*search*/
.search {display: -webkit-box;  display: flex;  -webkit-box-align: center;  align-items: center;		  position: absolute;    top: 60px;    right: 32px; }
.search .icon {  width: 20px;  cursor: pointer;  height: 20px;  margin: 2px 12px 10px 0;  position: relative;  -webkit-transform: rotate(-360deg) translate(-10%, -10%);
  transform: rotate(-360deg) translate(-10%, -10%);  -webkit-transition: all .3s ease .6s;  transition: all .3s ease .6s;}
.search .icon:before {  content: '';  position: absolute;  border-radius: 50%;  border: 1px solid #111;  left: 0;  top: 0;  right: 0;  bottom: 0;  display: block;  -webkit-transition: all .3s ease 0s;  transition: all .3s ease 0s;}
.search .icon span {  display: block;  top: 50%;  left: 50%;  width: 2px;  height: 2px;  border-radius: 1px;  margin: -1px 0 0 -1px;  position: absolute;  -webkit-transition: background 0s ease 0s;  transition: background 0s ease 0s;}
.search .icon span:before, .search .icon span:after {  content: '';  top: 0;  width: 2px;  height: 2px;  opacity: 0;  border-radius: 1px;  position: absolute;  background: #212533;  -webkit-transition: all .3s ease 0s;  transition: all .3s ease 0s;}
.search .icon span:before {  right: 0;}
.search .icon span:after {  left: 0;}
.search .icon span svg {  display: block;  fill: none;  stroke-linecap: round;  stroke-width: 3px;  stroke: #323333;  width: 14px;  height: 15px;  position: absolute;  left: 0;  top: 0;  stroke-dasharray: 47;  stroke-dashoffset: 67;  -webkit-transition: all .4s ease .31s, opacity .1s ease .4s, stroke .4s ease .0s;  transition: all .4s ease .31s, opacity .1s ease .4s, stroke .4s ease .0s;
}
.search .field {  position: relative;  width: 0;  -webkit-transition: all 0.5s cubic-bezier(0.51, 0.92, 0.24, 1.15) 0.5s;  transition: all 0.5s cubic-bezier(0.51, 0.92, 0.24, 1.15) 0.5s;}
.search .field input {  font-size: inherit;  line-height: inherit;  padding: 0 24px 0 0;  border: 0;  display: block;  font-family: inherit;  position: absolute;  background: #fff;  -webkit-appearance: none;  top: 0;  width: 100%;  opacity: 0;  z-index: 1;  visibility: hidden;  -webkit-transition: all 0s ease 0s;  transition: all 0s ease 0s;  margin: 0;  line-height: 22px;  vertical-align: middle;  text-transform: none;}
.search .field input:focus {  outline: none;}
.search .field input::-webkit-input-placeholder {  color: #212533;}
.search .field input:-moz-placeholder {  color: #212533;}
.search .field input::-moz-placeholder {  color: #212533;}
.search .field input:-ms-input-placeholder {  color: #212533;}
.search .field > div {  white-space: nowrap;  color: #212533;  display: -webkit-box;  display: flex;}
.search .field > div span {  opacity: 0;  line-height: 22px;  display: block;  visibility: hidden;  -webkit-transform: translate(0, 12px);  transform: translate(0, 12px);  -webkit-transition: all .4s ease;  transition: all .4s ease;}
.search .field > div span:nth-child(1) {  -webkit-transition-delay: .4s;  transition-delay: .4s;}
.search .field > div span:nth-child(2) {  -webkit-transition-delay: .2s;  transition-delay: .2s;}
.search .field > div span:nth-child(3) {  -webkit-transition-delay: 0s;  transition-delay: 0s;}
.search.open {margin-right:17px; border-bottom: 1px solid #111; transition-delay: 0s;}
.search.open .icon {  -webkit-transform: rotate(0deg) translate(0, 0);  transform: rotate(0deg) translate(0, 0);  -webkit-transition-delay: 0s;  transition-delay: 0s;}
.search.open .icon:before {  border-color: #212533;}
.search.open .icon span svg {  stroke: #212533;  -webkit-transition-delay: 0s;  transition-delay: 0s;}
.search.open .field {margin-right:20px;  -webkit-transition-delay: 0s;  transition-delay: 0s;  width: 200px;}
.search.open .field > div span {  opacity: 1;  visibility: visible;  -webkit-transform: translate(0, 0);  transform: translate(0, 0);}
.search.open .field > div span:nth-child(1) {  -webkit-transition-delay: .4s;  transition-delay: .4s;}
.search.open .field > div span:nth-child(2) {  -webkit-transition-delay: .45s;  transition-delay: .45s;}
.search.open .field > div span:nth-child(3) {  -webkit-transition-delay: .50s;  transition-delay: .50s;}
.search.open .field input {  opacity: 1;  visibility: visible;  -webkit-transition-delay: .75s;  transition-delay: .75s;}
.search.loading .icon span {  background: #212533;  -webkit-animation: rotate 1s infinite ease .8s;  animation: rotate 1s infinite ease .8s;  -webkit-transition-delay: .4s;  transition-delay: .4s;}
.search.loading .icon span svg {  -webkit-transition-delay: 0s;  transition-delay: 0s;  stroke-dasharray: 48;  stroke-dashoffset: 139;  opacity: 0;  -webkit-transition: all .4s ease 0s, opacity 0s ease .4s;  transition: all .4s ease 0s, opacity 0s ease .4s;}
.search.loading .icon span:before, .search.loading .icon span:after {  opacity: 1;  -webkit-transition-delay: .4s;  transition-delay: .4s;}
.search.loading .icon span:before {  -webkit-transform: translate(-4px, 0);  transform: translate(-4px, 0);}
.search.loading .icon span:after {  -webkit-transform: translate(4px, 0);  transform: translate(4px, 0);}

@-webkit-keyframes rotate {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes rotate {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes travel {
  0% {opacity:0; transform:translateX(300px) rotateZ(0deg) scaleY(1)}
  6.5%  {transform: translateX(279.5px) rotateZ(0deg) scaleY(1.1)}
  8.8%  {transform: translateX(273.6px) rotateZ(0deg) scaleY(1)}
  10%   {opacity:1; transform:translateX(270px) rotateZ(0deg)}
  17.6% {transform: translateX(247.2px) rotateZ(-30deg)}
  45%   {transform: translateX(165px) rotateZ(-30deg)}
  49.5% {transform: translateX(151.5px) rotateZ(-45deg)}
  61.5% {transform: translateX(115.5px) rotateZ(-45deg)}
  67%   {transform: translateX(99px) rotateZ(-60deg)}
  76%   {transform: translateX(72px) rotateZ(-60deg)}
  83.5% {opacity:1; transform:translateX(49.5px) rotateZ(-90deg)}
  90%   {opacity:0}
  100%  {opacity:0; transform:translateX(0px) rotateZ(-90deg)}
}


/*menu*/
.overlay-content h1{font-size:26px; font-weight:600 ;width:310px; text-align:center; border-bottom:4px solid #111; padding-bottom:14px; margin:0 auto; color: #111;}
.overlay-content .overlay-content_h1_1{margin-bottom:10px}
.overlay-content .overlay-content_h1_2{margin-bottom:10px; margin-top:40px}

.overlay-content li{line-height:22px; font-size:18px; font-weight:400; color: #111;}
.overlay-content .localnews{font-size:15px; color:#6c6c6c !important; font-weight:200; padding:6px 0 0}
.overlay-content li a {color: #111; letter-spacing: 0.15em; display: inline-block; padding:8px 0; position: relative;}
.overlay-content li a:after {color: #33b8ff; background: none repeat scroll 0 0 transparent; bottom:5px; content: ""; display: block;
  height: 2px; left: 50%; position: absolute; background: #33b8ff; transition: width 0.3s ease 0s, left 0.3s ease 0s; width: 0;  }
.overlay-content li a:hover:after {  width: 100%;   left: 0;}

.overlay {height: 0%; width: 100%; position:fixed; z-index: 999; top: 0; left: 0; background-color: rgb(255,255,255);  background-color: rgba(255,255,255, 0.99); overflow-y: hidden; transition: 0.5s;}
.overlay-content {  position: relative; top:46px;/* top:85px; */ width: 100%;  text-align: center; overflow-y:scroll; height:calc(100% - 50px)}
.closebtn a:hover, .closebtn a:focus {color: #000; font-weight:300;}
.overlay .closebtn {position: absolute; top: 0; right: 100px; font-size: 60px; font-weight:100; color: #111;}

.topbar_wrap{position:relative; overflow:hidden; width:100%; line-height:42px; border-top:1px solid #dbdbdb; border-bottom:1px solid #dbdbdb;  }
.topbar{width:1100px; margin:0 auto;}
.latest{float:left}
.topbar_menu{float:right}
.topbar_menu li {float:left; margin-left:23px; font-size:15px; color:#010101;  }
.latest_dot{font-size:xx-small; color:#ff576d; position:relative; top:-2px}
.news_ani{font-weight:200; margin-left:18px; font-size:14px}
.news_ani_tit{font-size:15px; margin-left:8px;}
.blinking{ animation:blinkingText 1.5s infinite;}
	@keyframes blinkingText{
		0%{     color: #fff8f9;    }
		49%{    color: #ff94a2; }
		60%{    color: #ff6b7f; }
		99%{    color:#ff687c;  }
		100%{   color: #ff576d;    }
	}
.topbar_menu_insight{display:inline-block; vertical-align:middle; margin-top:-2px;}

/*newsticker*/
.newsticker {display:inline-block; position:relative;overflow:hidden; top:5px; width:430px;height:21px;text-align:left;}
.newsticker ul {padding:0;margin:0}
.newsticker ul li {float:left;width:430px;;padding:0;font-size:15px;letter-spacing:1px;height:21px;line-height:21px;list-style:none;overflow:hidden;text-overflow: ellipsis;white-space: nowrap;}


/* ====== main ======================================================================================================= */
.main_bg_bg{position:relative; overflow:hidden; margin:170px auto 0; -webkit-transition:.2s ease-in-out; transition:.2s ease-in-out}


/* ====== news_headline ======================================================================================================= */
.news_headline{position:relative; overflow:hidden; width:1100px; height:409px; margin:30px auto; }
.headline_tab1 .txt_area{position: absolute; top: 0; float:left; width:382px; padding-right:33px}
.headline_tab1 .headimg_area{position: absolute; bottom: 0; right: 0; float:left; width:685px; height:409px }
.headline_tab1 .headimg_area img{width:100%; height:100%; display: block; object-fit:cover;}
.head_cate{color:#33b8ff; font-size:13px; font-weight: 300;   border-radius: 15px;
  border: 1px solid #33b8ff; padding: 7px 15px; display:inline-block; }
.head_title{margin-top:25px; font-size:38px; color:#222; font-weight: 400; line-height:48px; letter-spacing: 0; display:block; max-height:143px }
.head_txt{margin-top:15px; color:#666; font-size:16px; line-height:26px; font-weight: 300; display:block; max-height:73px; }
.head_related{margin-top:20px; color:#333; font-size:16px; line-height:25px;}
.head_related li {background:url(//res.heraldm.com/nbiz_2020/images/ico_related.png) left 4px no-repeat; padding-left:17px; }
.headline_tabutton{position:relative; display:inline-block;top:382px;  overflow:hidden; font-size:13px; color:#33b8ff;  font-weight: 400;  }
.headline_tabutton li{float:left; margin-right:25px;  margin-top:5px; }
.headline_tabutton .active{position: relative; top: -5px; font-weight: 500; color:#fff ; width:25px; max-height:25px; line-height: 24px;border-radius:50%; background:#33b8ff; text-align:center; cursor:pointer }

.swiper-container {position:relative; overflow:hidden; width:1100px; height:409px; margin:30px auto;}

.headline_tab .txt_area{position: absolute; top: 0; float:left; width:382px; padding-right:33px}
.headline_tab .headimg_area{position: absolute; bottom: 0; right: 0; float:left; width:685px; height:409px }
.headline_tab .headimg_area img{width:100%; height:100%; display: block; object-fit:cover;}
.headline_tab .head_cate{color:#33b8ff; font-size:13px; font-weight: 300;   border-radius: 15px;
  border: 1px solid #33b8ff; padding: 7px 15px; display:inline-block; }
.headline_tab .head_title{margin-top:25px; font-size:38px; color:#222; font-weight: 400; line-height:48px; letter-spacing: 0; display:block; }
.headline_tab .head_txt{margin-top:15px; color:#666; font-size:16px; line-height:26px; font-weight: 300; display:block; max-height:130px; }
.headline_tab .head_related{margin-top:20px; color:#333; font-size:16px; line-height:25px;}
.headline_tab .head_related li {background:url(//res.heraldm.com/nbiz_2020/images/ico_related.png) left 4px no-repeat; padding-left:17px; }

.swiper-pagination{height: 25px !important; position:relative !important; top:-35px !important; text-align:left !important;;}
.swiper-pagination-bullet {top:0px !important;    width: 25px !important;    height: 25px !important;    line-height: 24px !important;
    font-size: 12px !important;    color: #33b8ff !important;	background:none !important;	opacity:1 !important;
	 text-align:center !important ;	margin-right:10px !important ; 	 }
.swiper-pagination-bullet-active{color:#fff !important;   width: 25px !important;
    height: 25px !important; border-radius:50% !important; background:#33b8ff !important;  text-align:center !important ;   margin-right:10px !important;}

/* ====== latest wrap======================================================================================================= */
.latest_wrap{position:relative; overflow:hidden; width:1100px; margin:0 auto;  }
.latest_wrap ul{margin-top:20px}
.latest_wrap li{width:550px; float:left; margin-bottom:30px}
.latest_wrap .image_area{position: relative; bottom: 0; right: 0; float:left; width:265px; height:159px; margin-right:18px; }
.latest_wrap .image_area img{width:100%; height:100%; display: block; object-fit:cover;}
.latest_wrap .txt_area{width:247px; float:left;  }
.latest_wrap .txt_area .title{font-size:18px; color:#111; font-weight: 400; line-height:26px; letter-spacing: 0 ; margin-bottom:15px; display:block; max-height:50px}
.latest_wrap .txt_area .txt{font-size:14px; color:#666; font-weight: 300; line-height:22px; letter-spacing: 0 ;     display: block;    max-height: 88px;}
.latest_wrap .mr_r20{margin-left:20px;}
.label_txt_pink{font-size:13px; color:#fff; background:#ff576d; line-height:22px; padding:3px 8px; font-weight:300; margin-right:10px}
.label_txt_black{font-size:13px; color:#fff; background:#125bff; line-height:22px; padding:3px 8px; font-weight:300; margin-right:10px}


/* ====== latest_wrap2 ======================================================================================================= */
.latest_wrap2 {position:relative; overflow:hidden; width:1100px; margin:0 auto; border-top:1px solid #dbdbdb; padding-top:30px}
.latest_wrap2 li{float:left; width:255px; margin-right:25px; margin-bottom:30px; height:70px;}
/*.latest_wrap2 .mrr0 {margin-right:0}*/
.latest_wrap2 li:nth-child(4n) {margin-right:0}
.latest2_title{height: 24px;float: left;font-size: 17px;color: #111;font-weight: 400;text-align: left;line-height: 24px;width: 258px;margin-bottom:3px}
.latest2_title2 {height: 62px;float: left;font-size: 16px;color: #111;font-weight: 400;text-align: left;line-height: 22px;width: 157px;margin-right: 5px;}
.latest2_img {width:88px; height:62px; float:left; }
.latest2_img img {width:100%; height:100%}
.latest2_txt {font-size:14px; color:#666; font-weight: 300; line-height:20px; letter-spacing: 0 ; display: inline-block; max-height:40px; ;width: 258px}


/* ====== herald special ======================================================================================================= */
.hd_special{width:100%; background:#f6f6f6; height:395px; margin-top:20px }
.hd_special_wrap{position:relative; overflow:hidden; width:1100px; margin:0 auto; }
.hd_special_sectit{float:left; padding-top:68px; }
.hd_special_sectit .t1{font-size:18px; color:#111; font-weight: 400; letter-spacing: 1px ; padding-bottom:10px; padding-left:2px}
.hd_special_sectit .t2{font-size:46px; color:#111; font-weight: 100; letter-spacing: 2px ;}
.hd_special_sectit .t3{font-size:44px; color:#111; font-weight: 600; letter-spacing: 2px ; }
.hd_special_conarea{float:right; position:relative; overflow:hidden;padding-top:45px}
.hd_special_conarea li{ float:left; margin-left:20px}
.hd_special_con .img_area {width:275px; height:257px; position:relative;  overflow:hidden}
.hd_special_con .img_area img{width:100%; height:100%}
.hd_special_con .img_area:hover img{transform:scale(1.1); -webkit-transform:scale(1.1);  -moz-transform:scale(1.1);  -o-transform:scale(1.1); transition: all .5s ease-in-out;   }
.hd_special_conarea .cate_area{font-size:16px; color:#666; font-weight: 400; letter-spacing: 1px; text-align:center; margin-top:15px}
.hd_special_conarea .tit_area{font-size:18px; color:#111; font-weight: 400; letter-spacing: 1px;  text-align:center ; margin-top:6px}
.hd_tabutton_wrap{position:relative; overflow:hidden; width:1100px; margin:0 auto;height:100px; top:50px}
.hd_tabutton{position:absolute; display:inline-block;left:0; bottom:50px;  overflow:hidden; font-size:13px; color:#33b8ff;  font-weight: 400;  }
.hd_tabutton li{float:left; margin-right:25px;  margin-top:5px; }
.hd_tabutton .active{position: relative; top: -5px; font-weight: 500; color:#fff ; width:25px; max-height:25px; line-height: 24px;border-radius:50%; background:#33b8ff; text-align:center; cursor:pointer }
.go_special{height:15px; line-height:15px; background-color:#fff; position:absolute;left:0; bottom:90px; color:#111; font-size:12px; font-weight:300; border: 1px solid #dbdbdb; padding: 9px 18px;  display:inline-block; float:left;letter-spacing:1px; text-align:center;}/* border-radius: 20px;*/
.go_special a{display:block}
.btn_moreb span {display:inline-block;position:relative;padding-right:17px; cursor:pointer }
.btn_moreb span:after {position:absolute;right:0;top:50%;width:14px;height:14px;margin-top:-7px;border:solid #111;border-width:2px 2px 0 0;box-sizing:border-box;transform:rotate(45deg) scale(0.5);content:"";transition:all 0.3s;}
.btn_moreb:hover, .btn_moreb:focus {background-color:#33b8ff; color:#fff;   }
.btn_moreb:hover span:after, .btn_moreb:focus span:after {right:-5px;background-color:#33b8ff; color:#fff;border:solid #fff; border-width:2px 2px 0 0;box-sizing:border-box;transform:rotate(45deg) scale(0.5);content:"";transition:all 0.3s;}
/* storytelling_bg */
.storytelling_bg{background:#f6f6f6; margin-top:20px}
.storytelling{max-width:1120px; margin:0 auto; text-align:center; font-size:0; padding-bottom:40px}
.storytelling li{display:inline-block; vertical-align:middle; width:calc(50% - 10px)}
.storytelling li:first-child{margin-right:10px}
.storytelling li:last-child{margin-left:10px}
.storytelling_li_title{font-size:28px; font-weight:400; color:#111; text-align:left; padding:50px 10px 30px; display:block}
.storytelling_li_content{display:inline-block; vertical-align:middle; width:calc(50% - 20px); margin:0 10px}
.storytelling_li_img{padding-bottom:60%; position:relative; overflow:hidden; margin-bottom:15px}
.storytelling_li_img img{position:absolute; top:0; left:0; width:100%; height:100%; transition:.3s}
.storytelling_li_img:after{position:absolute; content:""; top:0; left:0; right:0; bottom:0; border:1px solid rgba(0,0,0,.15)}
.storytelling_li_t{font-size:16px; line-height:22px; font-weight:400; color:#111}
.storytelling_li_content:hover .storytelling_li_img img{transform:scale(1.1);}
.storytelling_section_main_swiper{position:relative}
.storytelling_section_main_swiper .swiper-slide{display:table; height:260px;}
.storytelling_swiper_tc_bg{position:relative; overflow:hidden; width:100%; height:100%}
.storytelling_swiper_tc{display:table; vertical-align:middle; width:100%; height:100%}
.storytelling_swiper_tc_img, .storytelling_swiper_tc_black{position:absolute; top:0; left:0; width:100%; height:100%; z-index:-1}
.storytelling_swiper_tc_black{background:rgba(0,0,0,.7)}
.storytelling_swiper_tc_t_bg{z-index:1; text-align:center; padding:25px 40px 0; word-break:keep-all; display:table-cell; vertical-align:middle; width:calc(100% - 80px); height:100%}
.storytelling_swiper_tc_t1{color:rgba(255,255,255,1); font-size:22px; line-height:30px; font-weight:400; letter-spacing:-1px}
.storytelling_swiper_tc_t2{color:rgba(255,255,255,.5); font-size:14px; line-height:22px; font-weight:300; letter-spacing:0; margin:10px 0 20px}
.storytelling_swiper_tc_btn{color:rgba(255,255,255,1); font-size:12px; line-height:30px; font-weight:200; letter-spacing:-0.5px; padding:0 30px; border-radius:4px; border:1px solid rgba(255,255,255,.4); display:inline-block; background:rgba(0,0,0,.5); transition:.2s}
.storytelling_swiper_tc_btn:hover{background:#33b8ff; border-color:#33b8ff}
.storytelling_section_main_swiper .swiper-pagination{position:relative !important; top:inherit !important; bottom:inherit !important; text-align:center !important; font-size:6px; height:auto !important; color:#ccc; font-weight:200; padding:15px 0; font-size:0}
.storytelling_section_main_swiper .swiper-pagination-bullet{top:inherit !important; display:inline-block; vertical-align:middle; width:8px !important; height:8px !important; border-radius:50%; background:#ccc !important; margin:0 4px !important}
.storytelling_section_main_swiper .swiper-pagination-bullet.swiper-pagination-bullet-active{background:#33b8ff !important}
.storytelling_section_main_swiper .swiper-button-next:after, .storytelling_section_main_swiper .swiper-button-prev:after{font-size:0}
.storytelling_section_main_swiper .swiper-button-next, .storytelling_section_main_swiper .swiper-button-prev{width:40px; height:40px; margin-top:0; top:120px; transition:.2s}
.storytelling_section_main_swiper .swiper-button-next{right:0}
.storytelling_section_main_swiper .swiper-button-prev{left:0}
.storytelling_section_main_swiper .swiper-button-next svg, .storytelling_section_main_swiper .swiper-button-prev svg{position:absolute; top:50%; left:50%; width:20px; height:20px; fill:#fff; transition:.2s}
.storytelling_section_main_swiper .swiper-button-next svg{transform:translate(-50%,-50%) rotate(90deg)}
.storytelling_section_main_swiper .swiper-button-prev svg{transform:translate(-50%,-50%) rotate(-90deg)}
.storytelling_section_main_swiper .swiper-button-next:hover, .storytelling_section_main_swiper .swiper-button-prev:hover{background:rgba(0,0,0,.5)}
.storytelling_section_main_swiper .swiper-button-next:hover svg{transform:translate(-50%,-50%) rotate(90deg) scale(1.2)}
.storytelling_section_main_swiper .swiper-button-prev:hover svg{transform:translate(-50%,-50%) rotate(-90deg) scale(1.2)}
.storytelling_section_main_latest_title{position:relative; font-size:24px; font-weight:400; line-height:27px; color:#111; padding:50px 0 20px; letter-spacing:-1px}
.storytelling_section_main_latest_title a{position:absolute; right:0; bottom:20px; font-size:11px; font-weight:400; color:#aaa; line-height:20px; border:1px solid #ddd; padding:0 13px; border-radius:4px; transition:.2s}
.storytelling_section_main_latest_title a:hover{border-color:#666; color:#666}
.storytelling_section_main_latest{font-size:0}
.storytelling_section_main_latest li{display:inline-block; vertical-align:top; margin:0 20px 25px 0; width:calc(25% - 15px); position:relative}
.storytelling_section_main_latest li a:after{position:absolute; content:""; top:0; left:0; right:0; bottom:0; border:1px solid rgba(0,0,0,.15)}
.storytelling_section_main_latest li:nth-child(4n){margin-right:0}
.storytelling_section_main_latest li a{display:block; overflow:hidden}
.storytelling_section_main_latest_img{position:relative; overflow:hidden; padding-bottom:66%}
.storytelling_section_main_latest_img img{position:absolute; top:0; left:0; width:100%; height:100%; transition:.2s}
.storytelling_section_main_latest_t{margin:15px; font-size:13px; line-height:20px; height:40px; font-weight:300; letter-spacing:-0.5px; color:#111}
.storytelling_section_main_latest li:hover img{transform:scale(1.1)}
.storytelling_noimg{display:none; height:150px; line-height:150px; background:url(../images/storytelling_noimg_bg.jpg) center no-repeat; background-size:cover; text-align:center}
.storytelling_noimg_t{display:inline-block; vertical-align:middle; font-size:30px; line-height:40px; font-weight:400; padding:0 100px; word-break:keep-all; letter-spacing:-2px; color:#fff}
#series_top.series_top_noimg img{display:none}
#series_top.series_top_noimg .storytelling_noimg{display:block}


/* ====== photo_military_wrap ======================================================================================================= */
.photo_military_wrap{position:relative; overflow:hidden; width:1100px; margin:50px auto; }
.latest_wrap2_1{/*background:#f6f6f6;*/ overflow:hidden; width:1150px; margin:0 auto}


/*photo box*/
.photo_box{width:800px; float:left; }

/*
.photo_box li{width:246px; float:left; margin:0 15px 15px 0; overflow:hidden; z-index: 2;}
.photo_box li a{position:relative; display:block; padding-bottom:153px}
*/
.photo_box li{width:376px; float:left; margin:0 15px 15px 0; overflow:hidden; z-index: 2;}
.photo_box li a{position:relative; display:block; padding-bottom:209px}

.photo_tit {z-index:2; position: absolute; left:20px; max-height:40px; line-height:20px; font-size: 15px; color: #fff; font-weight: 300; bottom:15px; right:20px; text-align: left; word-break: keep-all; letter-spacing: 0.5px;}
.photo_bg {z-index:1; top:0; left:0; right:0; bottom:0; position:absolute;
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&0+46,0.65+100 */
  background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0) 46%, rgba(0,0,0,0.65) 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 46%,rgba(0,0,0,0.65) 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 46%,rgba(0,0,0,0.65) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 ); /* IE6-9 */

}
.photo_box li img{width:100%; height:100%; position:absolute;}
.photo_box li:hover img{ background-color: rgba( 0, 0, 0, 0.5 ); transform:scale(1.1); -webkit-transform:scale(1.1);  -moz-transform:scale(1.1);  -o-transform:scale(1.1); transition: all .5s ease-in-out;  }
.photo_line {z-index: 3; position: absolute;margin-top: 64px; margin-left: 54px; width: 254px; height: 87px; border: 2px solid #fff; opacity: 0.8;}

/*Photo box상단*/
.photo_box_top{border-top:solid 2px #111; padding-top:30px}
.photo_box_top .cate_name{color: #33b8ff; font-size: 13px; font-weight: 300; border-radius: 15px; border: 2px solid #33b8ff; padding: 7px 20px; display: inline-block;}
.photo_box_top .title{font-size:18px; color:#111; font-weight: 400; line-height:24px; letter-spacing: 0 ; margin:30px 0 15px;display:block; max-height:46px}
.photo_box_top .txt{font-size:14px; color:#666; font-weight: 300; line-height:22px; letter-spacing: 0 ;     display: block;    max-height: 44px;}

/*military_wrap*/
.military_wrap{position:relative; width:300px; float:right; background:url("//res.heraldm.com/nbiz_2020/images/bg_main_military.jpg"); }
.main_sec_title{font-size:26px;  font-weight: 400; color:#fff; margin-top:10px; margin-left:15px}
.main_sec_subtitle {color:#b3be0a; font-size:16px; font-weight:400; margin-top:28px; margin-left:15px}
.military_box{margin-top:15px}
.military_box li{ background:#2d3035; width:270px; margin:0 15px 15px; padding-bottom:15px; }
.military_img {width:270px; height:160px}
.military_img img{width:100%; height:100%}
.military_sec_tit{font-size:16px; font-weight:400; margin-top:20px; color:#b3be0a; padding:0 10px}
.military_sec_txt{font-size:17px; font-weight:300; line-height:25px; color:#fff;  margin-top:5px; height:50px; padding:0 10px}
.go_hemil {position:relative; top:9px; right:17px; display:inline-block;font-size:13px; color:#a9a9a9; font-weight:300; float:right;  letter-spacing:0px; transition:all 0.4s;outline:none;cursor:pointer;padding-right:17px; }
.go_hemil span:after {position:absolute;right:0;top:50%;width:16px;height:16px;margin-top:-8px;border:solid #a9a9a9;border-width:3px 3px 0 0;box-sizing:border-box;transform:rotate(45deg) scale(0.5);content:"";transition:all 0.4s;}
.go_hemil:hover, .go_hemil :focus {color:#b3be0a;}
.go_hemil:hover span:after, .go_hemil:focus span:after {right:-3px;border-color:#b3be0a;}


/* ====== section news ======================================================================================================= */
.sectionnews_wrap{position:relative; overflow:hidden; width:1100px; margin:30px auto; }
/*sectionnews_box*/
.sectionnews_box{width:800px; float:left; }
.section_cate_bar{overflow:hidden; height:83px; padding-top:10px; margin-bottom:25px }
.section_news_tit{font-size:28px;  font-weight: 400; color:#000; float:left; padding-top:20px; padding-right:20px; }
.section_catebtn{float:left;}
.section_catebtn li{float:left; width:67px; max-height:67px; line-height: 70px;border-radius:50%; background-color:#fff;border:2px solid #33b8ff; text-align:center; cursor:pointer; margin-left:13px; color:#33b8ff; font-size:13px; font-weight:300; }
.section_catebtn .active{ background-color:#33b8ff; color:#fff;  transform:scale(1.1); -webkit-transform:scale(1.1);  -moz-transform:scale(1.1);  -o-transform:scale(1.1);  }
.section_catebtn li:hover{background-color:#33b8ff; color:#fff;  transform:scale(1.1); -webkit-transform:scale(1.1);  -moz-transform:scale(1.1);  -o-transform:scale(1.1); transition: all .3s ease-in-out; }
.section_imgnews{padding-right:50px }
.section_imgnews .img_area{width:416px; height:382px; position: relative; bottom: 0; left: 0; float:left;}
.section_imgnews img{width:100%; height:100%}
.section_imgnews .img_area .tit{position: absolute;bottom: 0;color: #fff; background: rgb(0, 0, 0);background: rgba(0, 0, 0, 0.8); width: 100%; padding: 25px; box-sizing: border-box; font-size:18px}

.section_imgnews .list_area {padding-left:17px; width:310px; float:right}
.section_imgnews .list_area li{border-top:1px solid #dbdbdb; margin-bottom:17px ; padding-top:17px; line-height:24px; max-height:45px}
.sectionnews_txt{line-height:25px; max-height:25px}
.go_section{width:350px; max-height:20px; line-height:20px; background-color:#fff; position:absolute; bottom:37px; color:#111; font-size:12px; font-weight:300;
  border: 1px solid #dbdbdb; padding: 9px 0;  display:inline-block; float:left;  letter-spacing:1px; text-align:center;}
 .go_section a{display:block}
 .go_section:hover{background-color:#33b8ff; color:#fff; transition: all .2s ease-in-out;  border: 1px solid #33b8ff;}
/*banner_box*/
.banner_box{width:300px;   float:right;}
.banner_box img{margin-bottom:25px}
/*섹션뉴스*/
.section_n{width:750px}
.section_n_left{float:left; width:360px; margin-right:30px; margin-bottom: 12px; overflow:hidden;}
.section_n_left .go_section{bottom:25px}
.article1 {width:360px; margin-bottom:30px; }
.article1 .imgarea{float:left; width:182px; height:134px; margin-right:15px }
.article1 .imgarea img{width:100%; height:100%}
.article1 .txtarea{float:left; width:163px; height:161px; }
.article1 .txtarea .title{font-size: 18px; color: #111; font-weight: 400; line-height: 24px; letter-spacing: 0; margin-bottom: 15px; display: block; max-height: 68px;}
.article1 .txtarea .txt{font-size: 14px; color: #666; font-weight: 300; line-height: 22px; letter-spacing: 0; display: block; max-height: 44px;}
.article2{width:360px;display:block; overflow:hidden;}
.article2 li{float:left; display:block; margin-bottom:25px}
.article2 .imgarea{float:left; width:53px; height:45px; margin-right:15px }
.article2 .imgarea img{width:100%; height:100%}
.article2 .txtarea{float:left; width:292px; height:45px; }
.article2 .txtarea .title{font-size: 17px; color: #111; font-weight: 400; line-height: 24px; letter-spacing: 0;  display: block; max-height: 48px;}
.article2 .txtarea .txt{font-size: 14px; color: #666; font-weight: 300; line-height: 22px; letter-spacing: 0; display: block; max-height: 22px;}
.section_n_right{float:right; width:355px; padding-right:5px   }
.section_n_right .txt_area{width:350px; margin-right:10px; float:left; border-bottom:1px solid #dbdbdb; padding-bottom:20px; margin-bottom:25px }
.section_n_right .txt_area .title{font-size:18px; color:#111; font-weight: 400; line-height:22px; letter-spacing: 0 ; margin-bottom:15px; display:block; max-height:22px}
.section_n_right .txt_area .txt{font-size:14px; color:#666; font-weight: 300; line-height:22px; letter-spacing: 0 ;     display: block;    max-height: 44px;}
.lst0 { margin-bottom:20px}

.sectionnews_wrap .banner_box{margin-bottom:9px}
.sectionnews_wrap .banner_box:last-child{margin-bottom:0}

/*추가201214*/
.article1_noimg {float:left; width:360px; border-bottom:1px solid #dbdbdb; padding-bottom:20px ; margin-bottom:20px }
.article1_noimg .title{font-size: 18px; color: #111; font-weight: 400; line-height: 24px; letter-spacing: 0; margin-bottom: 15px; display: block; max-height: 68px;}
.article1_noimg .txt{font-size: 14px; color: #666; font-weight: 300; line-height: 22px; letter-spacing: 0; display: block; max-height: 44px; }
.article2 .txtarea_noimg{width:360px; }
.article2 .txtarea_noimg .title{font-size: 17px; color: #111; font-weight: 400; line-height:17px; max-height:17px; margin-bottom:10px }
.article2 .txtarea_noimg .txt{font-size: 14px; color: #666; font-weight: 300;  line-height:22px; max-height:22px; }

/* ====== series article ======================================================================================================= */
.series_section{position:relative; overflow:hidden; width:100%;height:607px; background:#f6f6f6;margin-bottom:50px}
.series_section .title{width:1100px; margin:50px auto 30px; font-size:28px;  font-weight: 400; color:#111; }
.series_section_wrap{width:1100px;margin:0 auto;  }
.swiper-button-prev{float:left;}
.swiper-button-next{float:right;}
.series_section .con_wrap{width:1122px; margin:0 auto; float:left;}
.series_box{width:350px; height:440px; background:#fff; float:left; }
.series_box .secbar{height:14px; color:#fff; background:#000; padding:7px 13px; font-size:13px; font-weight:300; display:inline-block; position:absolute; z-index:1  }
.series_box .bg_top{height:130px; position:relative;top:0;}
.series_box .series_writer{text-align:center; position:relative; top:-40px;  }
.series_box .series_writer .name{font-size:15px; font-weight:400; color:#111; padding:10px 0 8px 0 }
.series_box .series_writer .division{font-size:13px; font-weight:300; color:#666; }
.series_box .series_name{color:#33b8ff; font-size:15px; font-weight:400;   border-radius: 15px;  border: 1.5px solid #33b8ff; padding: 7px 15px; display:inline-block;position:relative; top: 4%; left: 50%; transform: translate(-50%, -50%); text-align:center; display:inline-block; margin:41px 0}
.series_box .series_con{ padding:0 15px; position:relative; display:block; overflow:hidden}
.series_box .se_imgwrap {width:102px; height:89px; float:left; margin-right:10px; }
.series_box .se_imgwrap img{width:100%; height:100%}
.series_box .series_con ul {padding: 0 !important; ; margin:0 !important}
.series_box .series_con .line{border-bottom:1px solid #dbdbdb; padding-bottom:17px; margin-bottom:22px }
.series_box .series_con .se_title{font-size:16px; font-weight:400; color:#111; margin-bottom:13px}
.series_box .series_con .se_title2{font-size:16px; font-weight:400; color:#111; margin-bottom:15px}
.series_box .series_con .num{margin-right:15px}
.series_box .series_con .se_txt{font-size:14px; font-weight:300; color:#666; line-height:19px; max-height:59px; }

/*슬라이드*/
.swiper1 .swiper_bg{position:relative; overflow:hidden;}
.swiper1 .swiper-wrapper{width:1100px !important; margin:0 auto; }
.swiper1 {width: 100%;  height: 100%;     overflow: hidden}
.swiper1 .swiper-slide { background: #fff;  height:440px !important; }
.swiper1 .swiper-button_wrap{position: absolute; top: 51%; left: 50%; width: 1224px; transform: translate(-50%, -50%);}
.swiper1 .swiper-button-prev, .swiper1 .swiper-button-next{width:50px !important; height:50px !important; top:0 !important; margin-top:0 !important}
.swiper1 .swiper-button-prev:after, .swiper1 .swiper-button-next:after{display:none}
.swiper1 .swiper-button-prev svg, .swiper1 .swiper-button-next svg{width:50%; height:50%; fill:#000}
.swiper1 .swiper-button-prev svg{transform:rotate(-90deg)}
.swiper1 .swiper-button-next svg{transform:rotate(90deg)}


/* ====== hd_story_wrap ======================================================================================================= */
.hd_story_wrap{position:relative; overflow:hidden; width:1100px; margin:30px auto;}
.hd_stoty_box{width:800px; float:left; }
.hd_stoty_title { font-size:28px;  font-weight: 400; color:#111; margin-bottom:15px}
.btn_more {position:relative; top:10px; display:inline-block;font-size:15px; color:#999; font-weight:300; float:right;  padding-right:66px ; letter-spacing:-1px; transition:all 0.4s;outline:none;cursor:pointer;}
.btn_more span {display:inline-block;position:relative;padding-right:17px;}
.btn_more span:after {position:absolute;right:0;top:50%;width:16px;height:16px;margin-top:-8px;border:solid #999;border-width:3px 3px 0 0;box-sizing:border-box;transform:rotate(45deg) scale(0.5);content:"";transition:all 0.4s;}
.btn_more:hover, .btn_more:focus {color:#33b8ff;}
.btn_more:hover span:after, .btn_more:focus span:after {right:-5px;border-color:#33b8ff;}
.hd_stoty_boximg{position:relative; margin-top:30px; }
.hd_stoty_boximg li{width:360px; height: 270px; float:left; margin-bottom:30px; margin-right:30px; position:relative;}
.video_img .btn_movie{position:absolute; left:145px; top:70px; width:64px; height:64px; background:url("//res.heraldm.com/nbiz_2020/images/play.png"); z-index:5; transition: all 0.4s;opacity:0.8 }
.video_img .btn_movie:hover{background:url("//res.heraldm.com/nbiz_2020/images/play_o.png");}
.video_img{margin-bottom:15px;width:360px; height:215px; float:left;}
.video_img img{width:100%; height:100%}
.video_txt{text-align:center}
.video_txt .cate_area{font-size:16px; color:#666; font-weight: 400; letter-spacing: 1px; text-align:center; margin-top:15px}
.video_txt .tit_area{font-size:16px;line-height:20px; max-height:20px; color:#111; font-weight: 400; text-align:center ; margin-top:6px; padding:0 10px}
/*leaders_club*/
.leaders_club_box{width:300px; float:right; margin-top:50px}
.lerders_main{position:relative;  }
.lerders_main li{ float:left; width:145px; height:60px; margin-bottom:15px; }



/* ====== global_wrap ======================================================================================================= */
.global_wrap{width:1100px;margin:0 auto;}
.swiper2_bg {position:relative; overflow:hidden; width:100%; background:#f6f6f6; margin:50px 0; padding:50px 0 }
.swiper2 {width:100%; height:100%; overflow: hidden}
.swiper2 .swiper-wrapper{width:1100px !important; margin:0 auto;}
.swiper2 .swiper-slide {background: #f6f6f6;  width:265px !important; height:238px !important; }
.swiper2 .swiper-button_wrap{position: absolute; top:42%; left: 50%; width: 1224px; transform: translate(-50%, -50%);}
.swiper2 .swiper-button-prev, .swiper2 .swiper-button-next{width:50px !important; height:50px !important; top:0 !important; margin-top:0 !important}
.swiper2 .swiper-button-prev:after, .swiper2 .swiper-button-next:after{display:none}
.swiper2 .swiper-button-prev svg, .swiper2 .swiper-button-next svg{width:50%; height:50%; fill:#000}
.swiper2 .swiper-button-prev svg{transform:rotate(-90deg)}
.swiper2 .swiper-button-next svg{transform:rotate(90deg)}

.global_title{font-size:28px;  font-weight: 400; color:#111;  width:1100px;margin:0 auto; padding-bottom:30px }
.global-box{float:left; width:265px;height:238px;  margin-right:10px}

.globalvideo{position: relative;margin-bottom:15px;width:268px; height:162px; float:left; overflow:hidden;}
.globalvideo .photo_bg{z-index: 1; width:268px; height:162px; position:absolute;background-color: rgba( 0, 0, 0, 0.5 ); }
.globalvideo .btn_movie{position:absolute; top:55px; left:110px;  width:45px; height:45px; background:url("//res.heraldm.com/nbiz_2020/images/play.png"); background-size:45px 45px; z-index:5; transition: all 0.4s; }
.globalvideo .btn_movie:hover{background:url("//res.heraldm.com/nbiz_2020/images/play_o.png"); background-size:45px 45px;  }
.global_txt{width:268px; margin-top:15px; text-align:center; position:relative; display:block}
.global_txt .cate_area{font-size:15px; color:#666; font-weight: 400; letter-spacing: 1px; text-align:center; margin-top:15px}
.global_txt .tit_area{font-size:16px;line-height:20px; max-height:40px; color:#111; font-weight: 400; text-align:center ; margin-top:6px; padding:0 10px}


/* ====== notice_wrap ======================================================================================================= */
.notice_wrap{width:1100px; margin:0 auto; height:150px;   }
.notice_wrap_title{float:left; width:153px;   font-size:28px;  font-weight: 400; color:#111;}
.notice_box{float:left; width:947px; }
.notice_box li{float:left; width:280px; margin-left:35px }
.n_num{float:left; font-size:16px; font-weight:400; margin-right:12px; display:block; position: relative; top: 4px; }
.n_title{float:left; display:block; font-weight:300; width:245px; line-height:24px; }
.n_date{ font-size:13px; font-weight:200; color:#666}
/*more button*/
.btn_moreb span {display:inline-block;position:relative;padding-right:17px; cursor:pointer }
.btn_moreb span:after {position:absolute;right:0;top:50%;width:14px;height:14px;margin-top:-7px;border:solid #111;border-width:2px 2px 0 0;box-sizing:border-box;transform:rotate(45deg) scale(0.5);content:"";transition:all 0.4s;}
.btn_moreb:hover span:after, .btn_moreb:focus span:after {right:-5px;background-color:#33b8ff; color:#fff;border:solid #fff; border-width:2px 2px 0 0;box-sizing:border-box;transform:rotate(45deg) scale(0.5);content:"";transition:all 0.4s;}
.btn_more_r {position:relative; top:10px; display:inline-block;font-size:15px; color:#999; font-weight:300; float:right;   ; letter-spacing:-1px; transition:all 0.4s;outline:none;cursor:pointer;padding-right:17px; right:-5px}
.btn_more_r span {display:inline-block;position:relative;padding-right:17px;}
.btn_more_r span:after {position:absolute;right:0;top:50%;width:16px;height:16px;margin-top:-8px;border:solid #999;border-width:3px 3px 0 0;box-sizing:border-box;transform:rotate(45deg) scale(0.5);content:"";transition:all 0.4s;}
.btn_more_r:hover, .btn_more_r:focus {color:#33b8ff;}
.btn_more_r:hover span:after, .btn_morer:focus span:after {right:-5px;border-color:#33b8ff;}
.btn_more_notice {position:relative; top:5px; right:0; display:inline-block;font-size:15px; color:#999; font-weight:300; float:right;  letter-spacing:-1px; transition:all 0.4s;outline:none;cursor:pointer;padding-right:17px; }
.btn_more_notice span {display:inline-block;position:relative;padding-right:17px;}
.btn_more_notice span:after {position:absolute;right:0;top:50%;width:16px;height:16px;margin-top:-8px;border:solid #999;border-width:3px 3px 0 0;box-sizing:border-box;transform:rotate(45deg) scale(0.5);content:"";transition:all 0.4s;}
.btn_more_notice:hover, .btn_more_notice:focus {color:#33b8ff;}
.btn_more_notice:hover span:after, .btn_more_notice:focus span:after {right:-5px;border-color:#33b8ff;}


/* ====== footer ======================================================================================================= */
.footer{position:relative; overflow:hidden; width:100%; background:#000; clear:both; padding:36px 0 15px; height:150px}
.footer_box{width:1100px; margin:0 auto;}
.footer_menu{font-size:13px; color:#fff; font-weight:300;  display:block; overflow:hidden; }
.footer_menu li{float:left; margin-right:23px}
.footer_menu .blue{color:#51c7f8}
.family_link {float:right; letter-spacing:2px}
.footer_sel, .footer_sel label, .footer_sel select{height:16px; line-height:16px}
.footer_sel{position:relative;width:130px; background:url(//res.heraldm.com/nbiz_2020/images/footer_sel.png) center right 0 no-repeat; background-size:7px; float:right}
.footer_sel label{position:absolute; top:0; left:0; color:#fff; font-size:12px; font-weight:300}
.footer_sel select{width:100%; border:0; opacity:0; filter:alpha(opacity=0); -webkit-appearance:none; -moz-appearance:none; appearance:none; font-size:14px; cursor:pointer}
.footer_bottom{position:relative;display:block; margin-top:43px; color:#fff; letter-spacing:2px }
.footer_bottom .b_logo {float:left; margin-right:30px;  }
.footer_bottom .address {float:left; font-size:12px; opacity:0.7; font-weight:100; line-height:20px }
.footer_sns{font-size:0; float:right; margin-top:15px}
.footer_sns li{display:inline-block; vertical-align:middle; margin:0 10px}
.footer_sns li a{display:block; }
.footer_sns li a svg{fill:#fff; width:24px}

/* ====== dcon ======================================================================================================= */
.dcon_bg {background:#F3F3F3; width:100%;  overflow: hidden}
.dcon_top {width:100%; height:607px; position:relative;display:block;}
.dcon_link {font-size:15px;  color:#606060; font-weight:200; width:1100px; margin:0 auto;line-height:45px }
.dcon_link li {float:left; margin-right:15px; }
.dcon_top_tit{width:1100px; margin:0 auto; text-align:left; position:relative; top:200px; left:-175px}
.dcon_top_txt{font-size:22px; font-weight:200; color:#fff; line-height:24px; width:470px; height:72px;  text-align:left; position:relative; top:15px; left:176px }
.dcon_down_btn {text-align: right; position: relative; top: 25px; right: -175px;}
.dcon_menu{color:#fff; font-size:20px; width:1100px; margin:0 auto; height:67px;line-height:67px;  border-top:1px solid rgba(255, 255, 255, 0.6 ); position:relative; bottom:-399px; text-align:center; letter-spacing:2px; font-weight:700}
.dcon_menu li {width:33.333%; float:left;  height:67px;  display:block}
.dcon_menu li:hover{background-color:rgba(51, 183, 255, 0.7 ); cursor: pointer;}
.dcon_tit {text-align:center; margin:80px 0 40px 0}
.dcon_tit h1{font-size:30px; font-weight:700; color:#262D3D}

/*video*/
.dcon_video{margin:0 auto; width:1100px; position:relative; display:block; overflow:hidden; }
.dcon_video li{float:left; margin-right:25px; margin-bottom:40px; }
.dcon_video_box {position:relative; display:block; overflow:hidden;  width:350px; height:294px}
.ico_movie {position:absolute; left:0; bottom:83px; z-index:5; background-color: transparent; }
.dcon_video_img {position:relative; width:350px; height:197px}
.dcon_video_img img{width:100%; height:100%}
.dcon_txt_bg {background:#fff; text-align:left; padding:15px 15px 20px 15px; }
.dcon_video_cate {font-size:14px; color:#666; font-weight: 400; letter-spacing: 1px; margin-bottom:10px; }
.dcon_video_tit{font-size:19px;line-height:22px; max-height:44px; color:#111; font-weight: 400; }
.dcon_more_btn{margin: 0 auto; width: 170px; text-align: center;     border-radius: 24px;  border: 2px solid black; background-color: white; padding: 14px 28px; font-size: 16px; cursor: pointer; border-color: #33b8ff;  color: #33b8ff; transition:all 0.4s}
.dcon_more_btn:hover { background: #33b8ff; color: white;}

/*special*/
.dcon_speaial{width:100%}
.dcon_speaial .container {position: relative;}
.dcon_speaial .mySlides {display: none;}
.sp_img  {height:520px; }
.sp_img img {width:100%; height:520px; }
.dcon_speaial .cursor {position:relative; cursor: pointer;}
.dcon_speaial .row {position: absolute; overflow:hidden; bottom: 30px; left: 0; right: 0; text-align: center; z-index: 5; font-size: 0}
.dcon_speaial .row:after {z-index: 999;  background-color:rgba(127, 193, 234, 0.6 ); }
.dcon_speaial .column {position:relative; display: inline-block; vertical-align:middle;	margin:0 5px; width: 180px; }
.dcon_speaial .column img{z-index:0}
.num01 {color: #fff; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 99; background-color:rgba(0,0,0,.7 ); font-size: 11px; display:table; transition:.2s; cursor: pointer;}
.num01:hover{background-color:rgba(127, 193, 234, 0.6 )}
.column .active{background-color:rgba(127, 193, 234, 0.6 )}
.num01_t{display:table-cell; vertical-align:middle; font-size:16px;line-height:20px;  padding:0 10px; letter-spacing:1px; font-weight:300}

/*
.dcon_speaial .column :hover .num01{background-color:rgba(127, 193, 234, 0.6 )}
.dcon_speaial .demo.cursor.active .num01{background-color:rgba(127, 193, 234, 0.6 );}
*/


/* ====== article ======================================================================================================= */
.view_bg{width:1138px; margin:0 auto; position: relative; /*overflow:hidden; 있으면 기사면 sns 공유 영역이 보이지 않음.. 고쳐야함 */ }
.view_sns{    position: relative; top: 240px; left: -41px; float: left; width: 38px; display: inline-block;}
.view_sns li{height:38px;margin-bottom:8px}
.view_area{display: inline-block; vertical-align: top; float: left; position: relative; top: 0;    left: -19px;}
.article_wrap {position:relative; overflow:hidden; width:1100px; margin:0 auto;}
.article_top {position:relative; overflow:hidden;border-bottom:1px solid #dbdbdb; padding:35px 0; box-sizing:border-box }
.article_category {font-size:17px; color:#00b8e9; font-weight:400; margin-bottom:10px;  }
.article_title{padding-right:70px; font-size:32px; color:#2e2e2e; font-weight:400; margin-bottom:27px; line-height:42px; letter-spacing:-1px; }
.article_date{font-size:15px; color:#7b7b7b; font-weight:200;}
.right_link {float:right; position:relative; top:-10px }
.right_link li {float:left; margin-left:8px }

/* 240417_tts_추가 */
.ico_tts{width:36px; height:36px; border:1px solid #666; display:block; border-radius:50%; position:relative; /*background:#00b8e9; border-color:#00b8e9;*/ transition:.1s}
.ico_tts_svg{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:20px; fill:none; stroke:#fff; stroke-miterlimit:10; stroke-width:2px}
/*.ico_tts:hover{background:#0099c2; border-color:#0099c2; }*/
.ico_tts.ico_tts_default{background:#00b8e9; border-color:#00b8e9;}
.ico_tts.ico_tts_play{background:#007fa1; border-color:#007fa1;}
.ico_tts.ico_tts_pause{background:#6c8f98; border-color:#6c8f98;}
.ico_tts.ico_tts_stop{background:#666; border-color:#666;}


.article_area {position:relative; overflow:hidden; width:1100px; margin:0 auto;}
.article_left {position:relative; overflow:hidden; float:left; width:700px; padding-right:50px;  padding-top:50px; padding-bottom:130px } /*border-right:1px solid #dbdbdb;*/
.article_right {position:relative; overflow:hidden;float:right; width:300px; padding-top:50px; padding-bottom:130px}
.article_img_box{position:relative; vertical-align:top; width:700px; font-size:13px; color:#666; font-weight:200; line-height:18px; margin-bottom:60px}
.article_img {margin-bottom:18px; max-width: 100%; height: auto !important;}
.article_img img {position:relative; display:block; max-width:100%; }
.article_img_caption{display:block; position:relative; overflow:hidden; padding:0 10px}
.article_view{font-size:18px; color:#333333; font-weight:300; line-height:30px; text-align:justify; }
.article_view p{margin: 1em 0;}
.article_view img{padding:5px 14px 5px 14px}
.summary_area {margin-bottom:35px; font-weight:400; border-left:2px solid #00b8e9; padding-left:15px; line-height:30px;  }
.byline{font-weight:200; font-size:15px; letter-spacing: 1px; margin-bottom:50px; }
.byline .name{font-weight:400; font-size:15px; }
.byline .email{ margin-left:10px; }
.article_img_l{float:left; margin:10px 20px 10px 0;}
.article_img_r{float:right; margin:10px 0 10px 20px;}


/*right*/
.ad_area{margin-bottom:30px}
.right_t1{font-size:21px; color:#262526; font-weight:500; margin-bottom:20px}
/*많이본기사*/
.read_best {position:relative; overflow:hidden; margin-bottom:30px }
.read_best li{display:inline-block; padding-bottom:10px;  }
.read_best_img { width:104px; height:64px; float:right;  }
.read_best_img img{ width:100%; height:100%; }
.read_best_con {float:left; margin-right:15px; width:181px }
.read_best_cate {font-size:13px; color:#00b8e9; font-weight:300;  font-family: 'Montserrat'; line-height:24px;}
.read_best_tit {font-size:15px; color:#111; font-weight:300; line-height:20px ; max-height:40px;}
.line0 {border-bottom:none !important}
/*연재기사*/
.right_series {position:relative; overflow:hidden; margin-bottom:30px}
.right_series li{border-bottom:1px solid #dbdbdb; padding-bottom:15px; margin-bottom:15px; display:inline-block }
.right_series_tit{display: inline-block; width: 300px; position:relative;  font-size:15px; color:#111; font-weight:400; line-height:20px ; max-height:20px;margin-bottom:5px}
.right_series_con{position:relative;float:left; width:186px; margin-right:10px }
.right_series_txt {position:relative;float:left; font-size:14px; color:#666; font-weight:300; line-height:20px ; max-height:40px; letter-spacing:1px }
.right_series_name{color:#33b8ff; font-size:13px; font-weight:400;   border-radius: 15px;  border: 1.5px solid #33b8ff; padding: 5px 13px; margin-top: 10px; display:inline-block }
.right_series_thumb {position:relative; width:104px; height:64px; float:left;}
.right_series_thumb img{width:100%; height:100%; }
/*헤럴드밀리터리*/
.article_military {margin-bottom:30px; vertical-align:top;}
.article_military .military_img {width:300px; height:180px}
.article_military .military_img img{width:100%; height:100%}
.article_military .military_sec_tit{font-size:15px; font-weight:400; margin-top:15px; color:#b3be0a}
.article_military .military_sec_txt{font-size:15px; font-weight:400; line-height:20px; margin-top:5px; max-height:40px; }
/*헤럴드스토리*/
.article_story{position:relative;}
.article_story_thum {width:300px; height:180px}
.article_story_thum img {width:100%; height:100%}
.article_story_t_box {position:relative; overflow: hidden; display: inline-block; margin-top:15px}
.story_youtube_thum {margin-right: 10px; width: 48px; height: 48px; border-radius: 50%; background-color: transparent; overflow: hidden; float:left;}
.story_youtube_thum img{width:100%; height:100%; display:block;}
.story_txt {float:left; display:inline-block; max-height:40px; line-height:20px; width:235px; position: relative; top:5px ; font-size:15px; font-weight:400}


/* ====== 리스트 ======================================================================================================= */
.section_tit{font-size:38px; font-weight:500; color:#111; margin-bottom:30px}
.list_wrap {position:relative; overflow:hidden; width:1100px; margin:0 auto; padding :30px 0}
.list_l {position:relative;float:left;width:750px; margin-right:50px}
.list_r {position:relative;float:right;width:300px}
.list_head{position:relative; display: inline-block;}
.list_head_img {width:436px; height:260px; float:left;  margin-right:30px}
.list_head_img img {width:100%; height:100%}
.list_head_con {float:left; width:284px }
.list_head_con2 {float:left;}
.list_head_title{ font-size:32px; color:#222; font-weight: 400; line-height:42px; letter-spacing: 0; display:block; max-height:125px; }
.list_head_txt{margin-top:15px; color:#666; font-size:16px; line-height:26px; font-weight: 300; display:block; max-height:73px; }
.list_date {position:relative; font-size: 13px; color: #999; font-weight: 200; padding-top:30px; display:table-cell}
.list_nav {position:relative; display:inline-block; margin-top:50px; padding-bottom:20px; border-bottom:1px solid #111; width:750px; }
.list_nav li{float:left; display:inline-block; margin-right:24px; color:#666; font-size:16px; font-weight:200}
.list_nav li.on{color:#000; font-weight:400}
.list{position: relative; overflow: hidden;}
.list li{width:750px;     border-bottom: 1px solid #dbdbdb; padding: 20px 0; overflow:hidden;}
.list_img {width:184px; height:110px; float:left;  margin-right:18px}
.list_img img {width:100%; height:100%}
.list_con {float:left; width:548px }
.list_title{ font-size:18px; color:#111; font-weight: 400; line-height:23px; letter-spacing: 0; display:block; max-height:23px; }
.list_txt{margin-top:14px; color:#777; font-size:14px; line-height:20px; font-weight: 300; display:block; max-height:40px; }
.l_date {position:relative; font-size: 13px; color: #999; font-weight: 200; padding-top:20px; display:table-cell}
/*페이징*/
.page_wrap {margin:50px 0; text-align:center;font-size:0;}
.page_nation {display:inline-block;}
.page_nation .none {display:none;}
.page_nation a {display:block;margin:0 4px;float:left;font-weight:300;width:42px;height:30px;line-height:30px;text-align:center;font-size:16px;color:#7d7d7d;text-decoration:none;}
.page_nation .arrow {border:1px solid #ebebeb;}
.page_nation .pprev {background:url('//res.heraldm.com/nbiz_2020/images/page_pprev.png') no-repeat center center;margin-left:0;}
.page_nation .prev {background:url('//res.heraldm.com/nbiz_2020/images/page_prev.png') no-repeat center center;margin-right:10px;}
.page_nation .next {background:url('//res.heraldm.com/nbiz_2020/images/page_next.png') no-repeat center center;margin-left:10px;}
.page_nation .nnext {background:url('//res.heraldm.com/nbiz_2020/images/page_nnext.png') no-repeat center center;margin-right:0;}
.page_nation a.active {color:#000;font-weight:bold}
.page_nation .arrow:hover {border-color:#42454c; transition:.4s}


/* ====== 검색결과 ======================================================================================================= */
.search_result {position:relative; }
.search_bar {background:url('//res.heraldm.com/nbiz_2020/images/ico_searchb.png') no-repeat 25px center; width:633px; text-align:left; padding:15px 25px 15px 80px; border:3px solid #33b8ff; border-radius:30px;  }
.search_bar input{font-size:20px; font-weight:300; color:#111; width:630px; }
.search_x{float:right; display:inline-block; background: transparent;position:relative; top:-22px }
.result_area{margin:50px; text-align:center; font-size:18px; letter-spacing: 1px}
.result_area strong {color:#33b8ff; font-weight:300}


/* ====== ad ======================================================================================================= */
/*ad1,2*/
.ad1wrap{width:1060px; margin:20px 0 0; position:relative; overflow:hidden; background-color:#f6f6f6; padding: 15px 20px; }
.ad1{ position:relative; width:635px; height:155px; font-family: '맑은 고딕', 'Malgun Gothic', sans-serif; float:left}
.ad2{ position:relative; width:300px; float:right}
.ad1box {position:relative; height:100%; width:635px}
.ad1box .thumb{position: absolute;left:0;top:0;}
.ad1box .thumb img{width:230px; height:155px;}
.ad1box .title{overflow: hidden; position:absolute; left:245px; top:0; width:380px; height:80px; padding: 5px 0 0;    font-size: 25px; font-weight: 700; line-height: 35px; font-weight:500;}
.ad1box .title a {letter-spacing:-0.03em; color:#000; text-decoration:none; display:-webkit-box; -webkit-line-clamp: 2;   -webkit-box-orient: vertical;}
.ad1box .summary{overflow: hidden; position:absolute; left:245px; top:85px; width:380px; height: 60px;padding: 5px 0 0;    font-size: 15px; line-height: 21px; font-weight:200;}
.ad1box .summary a {color: #888; text-decoration: none; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical;}
.ad1box .more {position: absolute; right: 10px; bottom: 3px; font-size: 14px; font-weight: 400; color: #e21919; text-decoration: none;}
/*.ad1box .more a:hover{text-decoration:underline}*/

/*ad5*/
.ad5{position:relative; overflow:hidden; width: 650px; font-size:15px; color:#777; font-weight:200;  margin-bottom:40px}
.ad5 li{position:relative; float: left; padding-left:19px; width: 100%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; letter-spacing: 0; height: 28px;}
.ad5 li a:before {content: 'ㆍ'; color: #777; font-size: 24px; text-align: center; top: -3px; left: -6px; position: absolute}


/*ad6*/
.ad6{width:700px; position:relative; overflow:hidden;  margin-bottom:40px}
.ad6 li:last-child{margin-right:0}
.ad6 .item{overflow:hidden; display:inline-block; width:160px; height:auto; margin-right:15px}
.ad6 .subject{color:#11; font-size: 17px; margin-bottom:15px;  }
.ad6 .item .thumb {width:160px; height:110px;  margin-bottom:10px; }
.ad6 .item .thumb img{width:100%; height:100%; }
.ad6 .item .title {color:#111; font-size:15px;font-weight:200; line-height:20px; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;  word-wrap: break-word; white-space: normal; max-height:40px; }

/*ad7*/
.ad7{width:700px; position:relative; overflow:hidden; margin-bottom:20px }
.ad7 li:nth-child(3n) {margin-right:0}
.ad7 .item{overflow:hidden; display:inline-block; width:220px; height:auto; margin-right:15px; margin-bottom:20px}
.ad7 .subject{color:#11; font-size: 17px; margin-bottom:15px;  }
.ad7 .item .thumb {width:220px; height:160px;  margin-bottom:10px; }
.ad7 .item .thumb img{width:100%; height:100%; }
.ad7 .item .title {color:#111; font-size:15px;font-weight:200; line-height:20px;overflow:hidden;  text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;  word-wrap: break-word; white-space: normal; max-height:40px; }


/*ad12*/
.ad12{position:relative; overflow:hidden; margin-bottom: 30px; }
.ad12 .title {position:relative; overflow:hidden;}
.ad12 .title a {width:280px; font-size: 15px; color: #111; font-weight: 300; line-height: 20px;overflow:hidden;  text-overflow: ellipsis; white-space: nowrap; max-height: 20px; text-align: left; display: block; overflow: hidden;}
.ad12 li {padding-left:20px; margin-bottom:10px}
.ad12 .title a:before {content: '▶︎'; color: #00b8e9; font-size: 10px; text-align: center; top: 0px; left: 0px; position: absolute}

/*ad14*/
.ad14 {position:relative; overflow:hidden; margin-bottom:30px }
.ad14 li{display:inline-block; padding-bottom:10px;  }
.ad14_img { width:100px; height:60px; float:right;  }
.ad14_img img{ width:100%; height:100%; }
.ad14_con {float:left; margin-right:15px; width:181px; position:relative; top:10px }
.ad14_tit {width:181px; font-size:15px; color:#111; font-weight:300; line-height:20px ;overflow:hidden; max-height:40px; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;  word-wrap: break-word; white-space: normal;}


/* ======글로벌인사이트======================================================================================================= */
/*국제리스트 하단*/
.listglobal_container{width:750px; position:relative; overflow:hidden; margin-bottom:15px }
.listglobal_container li{width:236px; margin-right:18px; float:left; }
.listglobal_container li:last-child{margin-right:0}
.listglobal_img {position:relative;overflow:hidden; width: 236px; height: 145px; cursor: pointer; }
.listglobal_img:hover img{  transform:scale(1.1); -webkit-transform:scale(1.1);  -moz-transform:scale(1.1);  -o-transform:scale(1.1); transition: all .5s ease-in-out;  }
.listglobal_img img{width:100%; height:100%}
.wrapper_g {opacity:0.9; transition: all .4s; border:2px solid #fff;
  width: 35px; height: 25px; border-radius: 100%; padding-top: 10px; position: relative; margin: 0 auto; top:-53px; right:10px; float:right; }
.listglobal_img:hover .wrapper_g {background: #33b8ff;}
.listglobal_img .btn_tri {width: 0; height: 0; border-style: solid;
  border-width: 7px 0 7px 14px; border-color: transparent transparent transparent #ffffff; margin: 0 auto; position: absolute; left: 13px;top: 10px;}
.listglobal_tit_area {max-width:100%; font-size:16px;line-height:20px; max-height:40px; color:#111; font-weight: 400; margin-top:15px;}
.listglobal_date_area {position:relative; font-size: 13px; color: #999; font-weight: 200; padding-top:10px; display:table-cell}



/*글로벌인사이트 리스트*/
.global_container{width:1100px; position:relative; display: block; overflow:hidden; margin-bottom:15px }
.global_container li{width:258px; margin-right:22px; margin-bottom:40px; float:left; overflow:hidden; }
.global_container li:nth-child(4n){margin-right:0}
.global_container .global_img {position:relative;overflow:hidden; width: 258px; height: 165px; cursor: pointer; }
.global_container .global_img:hover img{  transform:scale(1.1); -webkit-transform:scale(1.1);  -moz-transform:scale(1.1);  -o-transform:scale(1.1); transition: all .5s ease-in-out;  }
.global_container .global_img img{width:100%; height:100%}
.wrapper_g2 {opacity:0.9; transition: all .4s; border:2px solid #fff; width: 35px; height: 25px; border-radius: 100%; padding-top: 10px; position: relative; margin: 0 auto; top:-53px; right:10px; float:right; }
.global_img:hover .wrapper_g2 {background: #33b8ff;}
.global_img .btn_tri2 {width: 0; height: 0; border-style: solid; border-width: 7px 0 7px 14px; border-color: transparent transparent transparent #ffffff; margin: 0 auto; position: absolute; left: 13px;top: 10px;}
.global_tit_area {max-width:100%; font-size:16px;line-height:20px; max-height:40px; color:#111; font-weight: 400; margin-top:15px;}
.global_date_area {position:relative; font-size: 13px; color: #999; font-weight: 200; padding-top:10px; display:table-cell}
.global_cate_area {font-size:15px; color:#666; font-weight: 400; letter-spacing: 1px; margin-top:15px}
.globalmore_btn {display:block; width:300px;  border:1px solid #dbdbdb; margin:0 auto 30px;}
.globalmore_btn a{display:block;padding:15px 0 16px;  font-family:'Montserrat',sans-serif; font-size:12px; text-align:center;  color:#111; font-weight:300}
.globalmore_btn a:hover, .globalmore_btn:focus {background-color: #33b8ff; color:#fff; transition: all .5s;}

/*미디어 타이틀*/
.global_media_title{position:relative; margin-bottom:30px;  }
.global_media_cate { display:inline-block; font-size:16px; font-weight:400}
.global_media_cate li{float:left;}
.global_media_cate li a{color:#a4a4a4; padding-right:26px}
.global_media_cate .on {color:#33b8ff; font-weight:400}
.global_media_cate li a:hover{color:#33b8ff; font-weight:400; }
.global_media_cate li:after {content: '|'; display: block; float:right; font-weight: 100; font-size: 12px; margin-top: 2px;
 margin-right:26px; color: #a4a4a4;}
.global_media_cate li:last-child:after{display:none}

/* loading class 추가 */
.loading_area{display:none; text-align: center; overflow: hidden; padding-top: 10px; padding-bottom: 10px;}


/* 210923 hmeil */
.forces_main{max-width:1100px; margin:30px auto 0; font-size:0}
.forces_main_l, .forces_main_r{display:inline-block; vertical-align:top}
.forces_main_l{position:relative; overflow:hidden; width:calc(100% - 350px); margin-right:20px; background:url(//res.heraldm.com/heraldbiz/version01/www/military/images/military_top.jpg) center no-repeat; background-size:cover; height:364px}
.forces_main_l_title{padding:25px 30px 20px}
.forces_main_l_title svg{fill:#fff}
.forces_main_l_title_svg1{width:34px; height:26px; margin:10px 20px 0 0}
.forces_main_l_title_svg2{width:144px; height:24px; margin-right:10px}
.forces_main_l_title_svg3{width:172px; height:24px}
.forces_main_l_title_svg_col1{fill:#BCC44D}
.forces_main_swiper .swiper-slide{width:424px !important; height:260px; margin:0 10px; opacity:.5}
.forces_main_swiper .swiper-slide img{width:100%; height:100%;}
.forces_main_swiper_t_bg{position:absolute; top:0; left:0; width:100%; height:100%;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&0+53,0.8+89 */
background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0) 53%, rgba(0,0,0,0.8) 89%, rgba(0,0,0,0.8) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 53%,rgba(0,0,0,0.8) 89%,rgba(0,0,0,0.8) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 53%,rgba(0,0,0,0.8) 89%,rgba(0,0,0,0.8) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#cc000000',GradientType=0 ); /* IE6-9 */
}
.forces_main_swiper_t_bg span{position:absolute; bottom:15px; left:20px; right:20px; color:#fff; font-size:20px; font-weight:400; line-height:29px; letter-spacing:-0.5px; word-break:keep-all}
.forces_main_swiper .swiper-slide.swiper-slide-active{opacity:1}
.forces_main_swiper .swiper-controlbox{position:absolute; z-index:1; top:50%; width:100%; margin-top:-25px}
.forces_main_swiper .swiper-button-prev, .forces_main_swiper .swiper-button-next{width:50px; height:50px; top:0; margin:0; background:rgba(0,0,0,.6); border-radius:50%; transition:.2s}
.forces_main_swiper .swiper-button-prev{left:20px}
.forces_main_swiper .swiper-button-next{right:20px}
.forces_main_swiper .swiper-button-prev:after, .forces_main_swiper .swiper-button-next:after{display:none}
.forces_main_swiper .swiper-button-prev svg, .forces_main_swiper .swiper-button-next svg{width:50%; height:50%; fill:#fff}
.forces_main_swiper .swiper-button-prev svg{transform:rotate(-90deg)}
.forces_main_swiper .swiper-button-next svg{transform:rotate(90deg)}
.forces_main_swiper .swiper-slide.swiper-slide-active a{border:1px solid #bcc44d; display:block; position:absolute; top:0; left:0; right:0; bottom:0}
.forces_main_swiper .swiper-button-prev:hover, .forces_main_swiper .swiper-button-next:hover{background:#bcc44d}
.forces_main_r{width:330px}
.forces_main_r li{border-bottom:1px solid #f3f3f3}
.forces_main_r li a{display:block; padding:15px 0; transition:.2s}
.forces_main_r_li_t, .forces_main_r_li_img{display:inline-block; vertical-align:middle;}
.forces_main_r_li_t{width:calc(100% - 140px); padding:0 20px; font-size:15px; line-height:24px; max-height:48px; font-weight:300; letter-spacing:-0.5px; word-break:keep-all}
.forces_main_r_li_img{width:100px; height:60px}
.mil_vod{width:100%; height:380px; background:#f6f6f6; margin-bottom:60px;}
.mil_vod_box{width:1100px; margin:0 auto; padding:30px 0; font-size:500;border-top:1px solid #dbdbdb }
.mil_vod_box_tit{font-size:20px; font-weight:500; }
.mil_vod_container{width:1100px; position:relative; display: block; overflow:hidden; margin-top:25px}
.mil_vod_container .fst{ margin-left:0 }
.mil_vod_container li {width:247px;float:left; margin-left:32px  }
.milvod_img {width:247px; height:152px; position:relative;overflow:hidden; cursor: pointer;}
.milvod_img img{width:100%; height:100%}
.milvod_tit {position:relative; margin-top:15px; font-size:15px; line-height: 20px; max-height:40px; }
.mil_photo_bg{width:247px; height:152px; position: absolute; background-color: rgba( 0, 0, 0, 0.4 );}
.milvod_img .wrapper_g2 {opacity:0.9; transition: all .4s; border:2px solid #fff; width: 35px; height: 25px; border-radius: 100%; padding-top: 10px; position: relative; margin: 0 auto; top:-53px; right:12px; float:right; }
.milvod_img:hover .wrapper_g2 {background: #bcc44d;}
.milvod_img .btn_tri2 {width: 0; height: 0; border-style: solid; border-width: 7px 0 7px 14px; border-color: transparent transparent transparent #ffffff; margin: 0 auto; position: absolute; left: 13px;top: 10px;}
.ch_ico{border-top:1px solid #dfdfdf; padding-top:15px; margin-top:15px}
.ch_ico span{font-size:15px;  position:relative; top:13px; left:13px}
.ch_ico img{border-radius:50%}



/* ====== president_20th ======================================================================================================= */
/* president_20th */
.list_wrap:after{content:""; display:table; table-layout:fixed; clear:both}
.president_20th_bnn{position:relative; overflow:hidden; width:1100px; height:170px; background:url(http://res.heraldm.com/nbiz_2020/images/president_20th_bnn.png) center no-repeat; background-size:cover; display:block; margin:0 auto; border-bottom:4px solid #7984d5}
.president_20th_bnn_title, .president_20th_bnn_day{position:absolute}
.president_20th_bnn_title{width:340px; margin-left:-180px; left:50%; top:32px; font-size:42px; font-weight:700; line-height:46px; letter-spacing:-1px; text-align:center}
.president_20th_bnn_title span{font-size:18px; display:block; font-weight:300; color:#5c5c5c; letter-spacing:0}
.president_20th_bnn_day{font:700 70px/80px 'Montserrat'; letter-spacing:-1px; color:#7984d5; top:48px; right:150px; text-align:right}
.president_20th{position:relative; float:left; width:750px; margin-right:50px; color:#222}
.president_20th_title{font-size:21px; line-height:30px; letter-spacing:-1px; font-weight:500; margin-bottom:20px; overflow:hidden}
.president_20th_title span{float:right; font-size:13px; letter-spacing:0; font-weight:300; color:#aaa}
/* president_20th_main */
.president_20th_main{display:block; font-size:0; margin-bottom:30px}
.president_20th_main_img, .president_20th_t_bg{display:inline-block; vertical-align:top}
.president_20th_main_img{position:relative; overflow:hidden; width:418px; height:250px; margin-right:30px}
.president_20th_main_img img{width:100%; height:100%; transition:.2s}
.president_20th_main_img:after{content:""; position:absolute; top:0; left:0; right:0; bottom:0; border:1px solid rgba(0,0,0,.08)}
.president_20th_t_bg{width:302px; word-break:keep-all}
.president_20th_t1{font-size:30px; line-height:43px; letter-spacing:-1.5px; font-weight:500; max-height:129px; margin:10px 0 20px}
.president_20th_t2{font-size:16px; line-height:26px; height:78px; font-weight:300; color:#999}
.president_20th_main:hover .president_20th_main_img img{transform:scale(1.05);}
/* president_20th_section_bg */
.president_20th_section_bg{font-size:0; margin-bottom:30px}
.president_20th_section{width:calc(50% - 10px); display:inline-block; vertical-align:top; margin-right:10px; position:relative;}
.president_20th_section + .president_20th_section{margin:0 0 0 10px}
.president_20th_section:before{content:""; position:absolute; top:0; left:0; bottom:0; right:0; z-index:-1; border:1px solid rgba(0,0,0,0.15); border-radius:10px}
.president_20th_section_title{border-radius:10px 10px 0 0; font-size:20px; line-height:50px; font-weight:400; letter-spacing:-1px; text-align:center}
.president_20th_section_l .president_20th_section_title{/*background:#1face6; */color:#fff;
  /* 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_section_r .president_20th_section_title{background:#e61e2b; color:#fff}
.president_20th_section_li{padding:10px 20px}
.president_20th_section_li li{border-bottom:1px solid rgba(0,0,0,.08)}
.president_20th_section_li li:last-child{border:none}
.president_20th_section_li li a{display:block; font-size:0; padding:10px 0}
.president_20th_section_li_t1, .president_20th_section_li_img{display:inline-block; vertical-align:middle}
.president_20th_section_li_t1{width:calc(100% - 130px); font-size:15px; line-height:24px; font-weight:300; max-height:48px; letter-spacing:-0.5px; word-break:keep-all}
.president_20th_section_li_img{position:relative; overflow:hidden; width:120px; height:72px; margin-left:10px}
.president_20th_section_li_img img{width:100%; height:100%; transition:.2s}
.president_20th_section_li_img:after{content:""; position:absolute; top:0; left:0; right:0; bottom:0; border:1px solid rgba(0,0,0,.08)}
.president_20th_section_li li:hover .president_20th_section_li_img img{transform:scale(1.05);}
/* president_20th_pictorial_li */
.president_20th_pictorial_li{margin:0 -30px 10px 0; font-size:0}
.president_20th_pictorial_li li{margin:0 20px 20px 0; display:inline-block; vertical-align:top}
.president_20th_pictorial_li li a{display:block; position:relative}
.president_20th_pictorial_li_img{position:relative; overflow:hidden; width:240px; height:143px}
.president_20th_pictorial_li_img img{width:100%; height:100%; transition:.2s}
.president_20th_pictorial_li_img:after{content:""; position:absolute; top:0; left:0; right:0; bottom:0; border:1px solid rgba(0,0,0,.08);
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&0.2+0,0.5+83,0.6+83 */
background: -moz-linear-gradient(top,  rgba(0,0,0,0.2) 0%, rgba(0,0,0,0.6) 83%, rgba(0,0,0,0.6) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(0,0,0,0.2) 0%,rgba(0,0,0,0.6) 83%,rgba(0,0,0,0.6) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(0,0,0,0.2) 0%,rgba(0,0,0,0.6) 83%,rgba(0,0,0,0.6) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#33000000', endColorstr='#99000000',GradientType=0 ); /* IE6-9 */
}
.president_20th_pictorial_li_t1{position:absolute; left:15px; right:15px; bottom:10px; font-size:15px; line-height:24px; font-weight:300; max-height:48px; color:#fff; word-break:keep-all}
.president_20th_pictorial_li li:hover .president_20th_pictorial_li_img img{transform:scale(1.05);}
/* president_20th_latest_li */
.president_20th_latest_li{font-size:0; margin-bottom:30px}
.president_20th_latest_li li{margin-bottom:20px; border-bottom:1px solid rgba(0,0,0,.08)}
.president_20th_latest_li li a{display:block; padding-bottom:20px}
.president_20th_latest_li_img, .president_20th_latest_li_t_bg{display:inline-block; vertical-align:middle}
.president_20th_latest_li_img{position:relative; overflow:hidden; width:220px; height:132px; margin-right:20px}
.president_20th_latest_li_img img{width:100%; height:100%; transition:.2s}
.president_20th_latest_li_img:after{content:""; position:absolute; top:0; left:0; right:0; bottom:0; border:1px solid rgba(0,0,0,.08)}
.president_20th_latest_li_t_bg{width:calc(100% - 240px)}
.president_20th_latest_li_t1{font-size:18px; line-height:20px; font-weight:400; max-height:40px; color:#000; letter-spacing:-1px; margin-top:5px}
.president_20th_latest_li_t2{font-size:15px; line-height:24px; font-weight:300; max-height:48px; color:#999; letter-spacing:-0.5px; margin:10px 0 15px; word-break:keep-all}
.president_20th_latest_li_day{font-size:12px; line-height:14px; font-weight:300; color:#ccc}
.president_20th_more{text-align:center; margin-bottom:30px}
.president_20th_more_btn{display:inline-block; vertical-align:top; font-size:15px; line-height:48px; font-weight:400; border:1px solid rgba(0,0,0,.2); padding:0 50px; border-radius:8px; letter-spacing:-1px; transition:.2s}
.president_20th_latest_li li:hover .president_20th_latest_li_img img{transform:scale(1.05);}
.president_20th_more_btn:hover{border-color:rgba(0,0,0,.6)}


/* ====== readers ======================================================================================================= */
/* readers */
.readers_bnn{background:url(http://res.heraldm.com/nbiz_2020/images/readers_bnn.jpg) center no-repeat; background-size:cover; text-align:center; color:#fff; font-size:15px; line-height:22px; font-weight:200; padding:75px 51px 78px; letter-spacing:-0.5px; word-break:keep-all;}
.readers_bnn b{display:block; font-size:28px; font-weight:500; line-height:40px; margin-bottom:13px; letter-spacing:-1px}
.readers_tab{font-size:0; margin-bottom:57px}
.readers_tab li{width:50%; display:inline-block; vertical-align:middle; position:relative;}
.readers_tab li a{display:block; line-height:76px; font-size:18px; text-align:center; border-bottom:1px solid #dbdbdb; color:#999; font-weight:300}
.readers_tab li.on a:after{position:absolute; content:""; left:0; right:0; bottom:0; height:3px; background:#33b8ff}
.readers_tab li.on a{color:#000; font-weight:500}
.readers_title{font-size:22px; text-align:center; line-height:64px}
.readers_title.readers_title_zoom{letter-spacing:-0.8px}
.readers_li{font-size:0; margin-bottom:38px}
.readers_li li{width:25%; display:inline-block; vertical-align:middle; margin-bottom:-1px}
.readers_li li a{height:76px; display:block; position:relative;}
.readers_li li a img{max-width:70%; max-height:60%; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); transition:.2s}
.readers_li li a:after{position:absolute; content:""; top:0; left:-1px; right:0; bottom:0; border:1px solid #e5e5e5}
.readers_li li:first-child a:after, .readers_li li:nth-child(4n+1) a:after{left:0}
.readers_li li:hover a img{transform:translate(-50%,-50%) scale(1.1)}
.leaders_club_box .readers_li{margin-bottom:0}
.leaders_club_box .readers_li li{width:50%}
.leaders_club_box .readers_li li a{height:70px}
.leaders_club_box .readers_li li:first-child a:after, .leaders_club_box .readers_li li:nth-child(2n+1) a:after{left:0}
.readers_service{width:100%; position:relative; border-top:2px solid #000; border-bottom:1px solid #000; margin-bottom:37px}
.readers_service th, .readers_service td{vertical-align:middle; font-size:16px; line-height:30px; border-bottom:1px solid #dbdbdb; letter-spacing:-0.5px}
.readers_service th{width:180px; font-weight:400}
.readers_service td{padding:22px 0; font-weight:300; color:#666}
.readers_service tr:last-child th, .readers_service tr:last-child td{border:none}
.readers_info{position:relative; margin-bottom:36px}
.readers_info_top{font-size:0; padding:22px 0 17px}
.readers_info_top_l, .readers_info_top_r{display:inline-block; vertical-align:middle}
.readers_info_top_l{width:calc(100% - 230px)}
.readers_info_top_r{width:230px; color:#999; font-size:13px; font-weight:300; text-align:right; letter-spacing:-0.3px}
.readers_info_top_r_icon{width:32px; height:32px; display:inline-block; margin-bottom:12px}
.readers_info_top_r_icon svg{width:100%; height:100%; transition:.2s; fill:#888}
.readers_info_top_r_icon:hover svg{fill:#000}
.readers_info_top_l_top{margin-bottom:6px}
.readers_info_top_l_top strong, .readers_info_top_l_top b, .readers_info_top_l_top span,
.readers_info_top_l_bottom b, .readers_info_top_l_bottom_arrow, .readers_info_top_l_bottom_num_bg, .readers_info_top_l_bottom_num{display:inline-block; vertical-align:middle}
.readers_info_top_l_top strong{font-size:25px; font-weight:500; line-height:25px}
.readers_info_top_l_top b{font-size:18px; font-weight:300; line-height:25px; letter-spacing:-0.5px; margin:0 10px 0 18px}
.readers_info_top_l_top span{font-size:14px; font-weight:300; line-height:25px; letter-spacing:-0.5px; border:1px solid #f82525; line-height:18px; color:#f82525; border-radius:10px; padding:0 9px}
.readers_info_top_l_bottom.up, .readers_info_chart_info_tb td.up{color:#f82525}
.readers_info_top_l_bottom.down, .readers_info_chart_info_tb td.down{color:#0caafe}
.readers_info_top_l_bottom b{font-size:31px; font-weight:500; margin-right:13px; letter-spacing:-1.5px; line-height:40px}
.readers_info_top_l_bottom_arrow{font-size:12px; line-height:20px}
.readers_info_top_l_bottom_arrow_sign{font-size:20px; margin-left:13px}
.readers_info_top_l_bottom_num_bg{line-height:20px; margin-top:7px}
.readers_info_top_l_bottom_num{font-size:18px; font-weight:300; letter-spacing:-0.5px; line-height:20px}
.readers_info_top_l_bottom.up .readers_info_top_l_bottom_arrow_down,
.readers_info_top_l_bottom.down .readers_info_top_l_bottom_arrow_up{display:none}
.readers_info_chart_bg{border:1px solid #000; font-size:0}
.readers_info_chart{padding-top:4px}
.readers_info_chart_menu{position:relative}
.readers_info_chart_menu_li{text-align:center; background:#f6f6f6; border-bottom:1px solid #dbdbdb}
.readers_info_chart_menu_li li{display:inline-block; vertical-align:top; width:60px; position:relative; margin:0 50px}
.readers_info_chart_menu_li li a{display:block; font-size:16px; text-align:center; line-height:42px; font-weight:300; color:#999; letter-spacing:-0.5px}
.readers_info_chart_menu_li li a:after{position:absolute; content:""; left:0; right:0; bottom:-1px; height:1px; background:transparent}
.readers_info_chart_menu_li li.on a{color:#000}
.readers_info_chart_menu_li li.on a:after{background:#000}
.readers_info_chart .chart{width:100%; padding:0; margin:0; border:none; border-radius:0; box-shadow:none;}
.readers_info_chart .chart .chart_graph{width:calc(100% - 10px) !important}
/*
.readers_info_chart_canvas{width:100%; height:265px}
.readers_info_chart_canvas canvas{width:448px !important; height:194px !important; padding:30px}
*/
.readers_info_chart_info{border-bottom:1px solid #dbdbdb; padding:10px 0}
.readers_info_chart_info_tb{width:100%;}
.readers_info_chart_info_tb th, .readers_info_chart_info_tb td{vertical-align:middle; color:#333; line-height:20px; letter-spacing:-0.3px; padding:4px 30px}
.readers_info_chart_info_tb th{font-size:15px; text-align:left; padding-right:0; font-weight:300;}
.readers_info_chart_info_tb td{font-size:14px; text-align:right; padding-left:0; font-weight:400; word-break:break-all; width:20%}
.readers_info_chart_info_tb_line{height:1px; background:#dbdbdb; margin:11px 0 14px}
.readers_info_cate{border:3px solid #cdcdcd; margin-bottom:37px}
.readers_info_cate_li{font-size:0}
.readers_info_cate_li li{display:inline-block; vertical-align:middle; width:33.33%; position:relative;}
.readers_info_cate_li li a{display:block; text-align:center; position:relative; padding:23px 0; transition:.2s}
.readers_info_cate_li li a:after{position:absolute; content:""; width:1px; height:30px; background:#dbdbdb; right:0; top:33px}
.readers_info_cate_li li:last-child a:after{display:none}
.readers_info_cate_li li a:hover{background:#f6f6f6}
.readers_info_cate_li_t1{font-size:18px; font-weight:400; line-height:25px; margin-bottom:5px; letter-spacing:-0.2px}
.readers_info_cate_li_t2{font-size:14px; font-weight:300; line-height:20px; color:#999; letter-spacing:-0.7px}
.readers_detail_tb{position:relative; width:100%; border-top:2px solid #000; border-bottom:1px solid #000; margin-bottom:36px}
.readers_detail_tb th, .readers_detail_tb td{vertical-align:middle; line-height:26px; padding:5px 0}
.readers_detail_tb th{text-align:left; width:640px}
.readers_detail_tb th a{display:block; width:640px; font-size:16px; font-weight:300; letter-spacing:-0.5px}
.readers_detail_tb td{text-align:right; word-break:break-all; font-size:14px; color:#999; font-weight:300; letter-spacing:-0.8px; padding-right:10px}
.readers_detail_tb tr:first-child th, .readers_detail_tb tr:first-child td{padding-top:24px}
.readers_detail_tb tr:last-child th, .readers_detail_tb tr:last-child td{padding-bottom:24px}
.readers_detail_tb th a:hover span{text-decoration:underline;}
/* president_20th_election_top */
.president_20th_election_top{position:relative; height:120px; margin-bottom:30px; background:url(http://res.heraldm.com/nbiz_2020/images/president_20th_election_top.jpg) center no-repeat #7984d5; background-size:cover; color:#fff}
.president_20th_election_top_title{position:absolute; top:33px; left:41px}
.president_20th_election_top_title span, .president_20th_election_top_title strong, .president_20th_election_top_title b, .president_20th_election_top_title svg{display:inline-block; vertical-align:top}
.president_20th_election_top_title span{font-size:23px; font-weight:200; letter-spacing:-1px; line-height:25px; margin-top:21px}
.president_20th_election_top_title strong{font-size:49px; font-weight:500; letter-spacing:-1px; line-height:53px}
.president_20th_election_top_title b{font-size:34px; font-weight:500; letter-spacing:-1.5px; line-height:36px; margin-left:10px; margin-top:12px;}
.president_20th_election_top_title svg{width:28px; height:28px; fill:#fff; margin-top:15px; margin-left:3px}
.president_20th_election_top_num{position:absolute; top:49px; right:43px; font-size:18px; font-weight:200; line-height:20px; letter-spacing:-0.5px}
.president_20th_election_top_num span{font-size:30px; font-weight:300; line-height:33px; margin-left:8px}
.president_20th_election{position:relative; margin-bottom:30px; font-size:0}
.president_20th_election_l, .president_20th_election_r, .president_20th_election_l_img, .president_20th_election_l_t_bg{display:inline-block; vertical-align:top}
.president_20th_election_l{width:513px}
.president_20th_election_r{width:calc(100% - 513px)}
.president_20th_election_l_img{position:relative; overflow:hidden; width:246px; height:246px; margin-right:27px}
.president_20th_election_l_img img{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:68px; height:87px; top:0; left:10px; background:url(http://res.heraldm.com/nbiz_2020/images/president_20th_election_l_img_tag.png) center no-repeat; background-size:cover}
.president_20th_election_l_t_bg{width:calc(100% - 273px)}
.president_20th_election_l_t1{font-size:22px; line-height:34px; font-weight:400; letter-spacing:-1px}
.president_20th_election_l_t1 b{font-size:30px; font-weight:500; margin-left:8px}
.president_20th_election_l_t2{font-size:34px; line-height:56px; font-weight:500; letter-spacing:-1px; margin:11px 0 0}
.president_20th_election_l_t2 span{font-size:18px; display:inline-block; vertical-align:middle; width:56px; line-height:28px; border-radius:16px; border:2px solid #000; text-align:center; margin-left:10px; margin-top:-7px}
.president_20th_election_l_t3{font-size:18px; line-height:20px; font-weight:300; letter-spacing:-0.2px; color:#999}
.president_20th_election_l_t4{font-size:18px; line-height:40px; font-weight:500; letter-spacing:-0.2px; margin:9px 0 45px}
.president_20th_election_l_t4 b{font-size:30px; line-height:40px; font-weight:500; letter-spacing:-0.2px}
.president_20th_election_l_t5{font-size:18px; line-height:24px; font-weight:300; letter-spacing:-1px; color:#555}
.president_20th_election_l_t5 span{margin-left:5px; letter-spacing:-0.4px}
.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{margin-top:-11px}
.president_20th_election_r_li li{padding:11px 0 12px; border-bottom:1px solid #e5e5e5}
.president_20th_election_r_li li:last-child{border:none; padding-bottom:0}
.president_20th_election_r_li_img, .president_20th_election_r_li_t_bg{display:inline-block; vertical-align:middle}
.president_20th_election_r_li_img{position:relative; overflow:hidden; width:66px; height:66px; margin-right:20px}
.president_20th_election_r_li_img img{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_t_bg{width:calc(100% - 86px)}
.president_20th_election_r_li_t1{font-size:16px; line-height:26px; font-weight:400; letter-spacing:-0.5px}
.president_20th_election_r_li_t1 span{font-size:13px; line-height:16px; font-weight:300; display:inline-block; vertical-align:middle; color:#999; margin-left:9px; margin-top:-3px}
.president_20th_election_r_li_t2{font-size:18px; line-height:20px; font-weight:500; letter-spacing:-0.2px; margin-left:16px}
.president_20th_election_r_li_t2 span{font-size:14px}
.president_20th_election_r_li_t3{font-size:13px; line-height:17px; font-weight:300; letter-spacing:-0.3px; margin-left:16px; color:#555; margin-top:2px}
.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_pledge_bg{font-size:0; margin-bottom:30px}
.president_20th_pledge_con{display:inline-block; vertical-align:top; width:calc(50% - 15px)}
.president_20th_pledge_con + .president_20th_pledge_con{margin-left:30px}
.president_20th_pledge_con .president_20th_title{font-size:18px; font-weight:400; margin-bottom:15px}
.president_20th_pledge_ten{background:#f3f3f3; padding:21px 25px 21px 55px; border-radius:10px}
.president_20th_pledge_ten li{font-size:14px; line-height:23px; font-weight:300; letter-spacing:-0.3px; padding:13px 0; text-indent:-26px; word-break:keep-all}
.president_20th_pledge_ten li span{font-style:italic; font-size:22px; font-weight:200; margin-right:5px; color:#999}
.president_20th_pledge{font-size:0; margin-bottom:10px}
.president_20th_pledge li{margin-bottom:10px}
.president_20th_pledge li a{display:block}
.president_20th_pledge_img, .president_20th_pledge_t{display:inline-block; vertical-align:middle}
.president_20th_pledge_img{position:relative; overflow:hidden; width:90px; height:54px; margin-right:20px}
.president_20th_pledge_img img{width:100%; height:100%; transition:.2s}
.president_20th_pledge_img:after{content:""; position:absolute; top:0; left:0; right:0; bottom:0; border:1px solid rgba(0,0,0,.08)}
.president_20th_pledge_t{width:calc(100% - 110px); font-size:14px; line-height:23px; font-weight:300; max-height:46px; color:#000; letter-spacing:-0.5px; word-break:keep-all}
.president_20th_pledge li:hover .president_20th_pledge_img img{transform:scale(1.05);}




/* 마이페이지 업데이트 완료후 삭제예정 
.header{overflow:initial;}
.logo{float:none; width:242px; overflow:initial;}
.search{right:70px}
.gnb_open{right:45px}
*/

/* ====== my ======================================================================================================= */
/* my */
.my{position:absolute; top:56px; right:0; width:30px; height:30px; font-size:0}
.my svg, .my_layer_close svg{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:80%; height:80%; fill:#000}
.my_layer_mask{position:fixed; top:0; left:0; width:100%; height:100%; z-index:1}
.my_layer{position:absolute; top:95px; right:0; z-index:2; width:328px; font-size:0; border:1px solid #d8d8d8; background:#fff; border-radius:0 0 6px 6px; box-shadow:0 6px 14px rgba(0,0,0,.08); display:none;}
.my_layer_close{position:absolute; top:6px; right:7px; font-size:0; width:21px; height:21px}
.my_layer_top{background:#fafafa;; padding:27px 30px}
.my_layer_top_join_li li, .my_layer_top_join_li li:after, .my_layer_top_join_li li a, .my_layer_top_login_name, .my_layer_top_login_btn, .my_layer_bottom_li_num, .my_layer_btn{display:inline-block; vertical-align:middle}
.my_layer_top_join_li{font-size:0}
.my_layer_top_join_li li:after{content:"│"; font-size:8px; font-weight:200; line-height:44px;color:#dbdbdb; margin:0 12px}
.my_layer_top_join_li li:last-child:after{display:none}
.my_layer_top_join_li li a{font-size:14px; font-weight:300; line-height:44px; letter-spacing:-0.2px; color:#000}
.my_layer_top_login{font-size:0}
.my_layer_top_login_name{font-size:16px; font-weight:300; line-height:22px; letter-spacing:-0.5px; color:#000; width:calc(100% - 70px)}
.my_layer_top_login_name b{font-weight:400}
.my_layer_top_login_btn{font-size:12px; font-weight:300; line-height:26px; color:#fff; width:70px; background:#ccc; text-align:center; border-radius:13px; transition:.1s;}
.my_layer_top_login_btn:hover{background:#999}
.my_layer_bottom{padding:25px 30px 40px}
.my_layer_bottom_title{font-size:16px; font-weight:400; line-height:26px; letter-spacing:-0.2px; color:#000; border-bottom:2px solid #555555; padding:10px 0; margin-bottom:3px}
.my_layer_bottom_li li{border-bottom:1px solid #eee; transition:.1s}
.my_layer_bottom_li li a{position:relative; display:block; padding:10px 34px 10px 0; transition:.1s}
.my_layer_bottom_li_t{font-size:14px; font-weight:300; line-height:30px; color:#555}
.my_layer_bottom_li_num{position:absolute; top:50%; right:0; margin-top:-9px; font-size:11px; font-weight:300; line-height:18px; color:#fff; background:#23a4db; padding:0 6px; border-radius:9px; transition:.1s}
.my_layer_bottom_li li:hover a{padding:10px 34px 10px 10px}
.my_layer_bottom_li li:hover .my_layer_bottom_li_num, .my_layer_btn1:hover{background:#0083ba}
.my_layer_btn_bg{margin:0 27px 39px}
.my_layer_btn{font-size:14px; font-weight:300; line-height:42px; letter-spacing:-0.4px; color:#fff; margin:0 3px; width:calc(50% - 6px); border-radius:6px; text-align:center; transition:.1s}
.my_layer_btn1{background:#23a4db}
.my_layer_btn2{background:#555}
.my_layer_btn2:hover{background:#333}
/* mypage */
.mypage{font-size:0}
.mypage_top_bg_gray{background:#f9f9f9}
.mypage_top_bg{position:relative; width:1100px; margin:0 auto}
.mypage_top{position:relative;  margin-bottom:50px; border-bottom:2px solid #555}
.mypage_top_l{padding:56px 280px 12px 0; color:#000}
.mypage_top_r{position:absolute; top:56px; right:0; width:274px}
.mypage_top_r.my_layer_btn_bg{margin:0}
.mypage_top_l_title, .mypage_top_l_name{display:inline-block; vertical-align:top}
.mypage_top_l_title{font-size:34px; font-weight:300; line-height:42px; letter-spacing:-1px; margin-right:36px}
.mypage_top_l_name{font-size:18px; font-weight:200; line-height:30px; letter-spacing:-0.3px; margin-top:13px; max-width:630px}
.mypage_top_l_name b{font-weight:400}
/* mypage_top_subsc */
.mypage_top_subsc{margin-bottom:10px}
.mypage_top_subsc_title, .mypage_top_subsc_li{display:inline-block; vertical-align:middle}
.mypage_top_subsc_title{font-size:20px; font-weight:300; line-height:38px; letter-spacing:-1px; width:calc(100% - 330px)}
.mypage_top_subsc_li{text-align:right; width:330px; margin-top:3px}
.mypage_top_subsc_li li, .mypage_top_subsc_li li:after, .mypage_top_subsc_li li a, .mypage_top_subsc_li li a svg{display:inline-block; vertical-align:middle}
.mypage_top_subsc_li li:after{content:"│"; font-size:12px; font-weight:200; line-height:20px; letter-spacing:-0.3px; color:#d8d8d8; margin:0 12px}
.mypage_top_subsc_li li:last-child:after{display:none}
.mypage_top_subsc_li li a{font-size:14px; font-weight:300; line-height:20px; letter-spacing:-0.2px; color:#999}
.mypage_top_subsc_li li a svg{width:17px; height:17px; fill:#999; margin:-3px 0 0 0}
/* mypage_top_service */
.mypage_top_service{margin:0 -5px; padding-bottom:60px}
.mypage_top_service li{display:inline-block; vertical-align:middle; width:calc(33.33% - 10px); margin:0 5px}
.mypage_top_service li a{display:block; border-radius:17px; border:1px solid #d8d8d8; padding:27px 30px 24px; background:#fff; transition:.1s}
.mypage_top_service_t{font-size:16px; font-weight:300; line-height:20px; letter-spacing:-0.2px; color:#555; margin-bottom:4px}
.mypage_top_service_num{font-size:16px; font-weight:300; line-height:20px; letter-spacing:-0.2px; color:#22a5d9; text-align:right}
.mypage_top_service_num b{font-size:24px; font-weight:400; margin-right:3px}
.mypage_top_service li:hover a{border-color:#22a5d9; box-shadow:0 12px 14px rgba(0,0,0,.05)}
.mypage_top_service li a.on{background:#22a5d9; border-color:#22a5d9}
.mypage_top_service li a.on .mypage_top_service_t, .mypage_top_service li a.on .mypage_top_service_num{color:#fff}
/* mypage_bottom */
.mypage_bottom{position:relative; width:1100px; margin:0 auto}
.mypage_bottom_title_bg{position:relative; border-bottom:1px solid #d8d8d8; padding:49px 0 9px}
.mypage_bottom_title, .mypage_bottom_title_sel{display:inline-block; vertical-align:middle}
.mypage_bottom_title{font-size:20px; font-weight:300; line-height:40px; letter-spacing:-1px; color:#000; width:calc(100% - 330px)}
/* mypage_bottom_title_sel_bg */
.mypage_bottom_title_sel_bg{position:absolute; top:48px; right:0; z-index:1; width:180px; color:#333;}
.mypage_bottom_title_sel_bg button, .mypage_bottom_title_sel_title, .mypage_bottom_title_sel_num{font-size:14px; font-weight:300}
.mypage_bottom_title_sel_bg button{color:#777; background:transparent; width:100%; text-align:right; padding-right:40px; line-height:50px}
.mypage_bottom_title_sel_bg button b{font-weight:400; color:#000}
.mypage_bottom_title_sel_bg button svg{position:absolute; width:8px; height:13px; fill:#000; transform:rotate(90deg); top:19px; right:9px}
#mypage_bottom_title_sel{font-size:0; border:1px solid #d8d8d8; padding:16px 0; border-radius:0 0 6px 6px; box-shadow:1px 4px 6px rgba(0,0,0,.07); background:#fff; display:none;}
#mypage_bottom_title_sel.open{display:block}
#mypage_bottom_title_sel li a{display:block; padding:0 20px; transition:.1s}
#mypage_bottom_title_sel li a.on, #mypage_bottom_title_sel li a:hover{background:#f2fafd; color:#23a5db}
.mypage_bottom_title_sel_title, .mypage_bottom_title_sel_num{display:inline-block; vertical-align:middle; line-height:41px}
.mypage_bottom_title_sel_title{width:calc(100% - 40px)}
.mypage_bottom_title_sel_num{width:40px; text-align:right}
.mypage_bottom_article{font-size:0; position:relative}
.mypage_bottom_article_l{position:relative; overflow:hidden; display:inline-block; vertical-align:top; width:750px}
/* mypage_subsc_news */
.mypage_subsc_news{font-size:0; margin-bottom:100px}
.mypage_subsc_news_li{width:calc(50% - 12px); position:relative; display:inline-block; vertical-align:top; border:1px solid #e6e6e6; margin:20px 0; border-radius:10px; box-shadow:0 2px 10px rgba(0,0,0,.05)}
.mypage_subsc_news_li:nth-child(2n+1){margin-right:20px}
.mypage_subsc_news_li_l{padding:30px 120px 30px 30px}
.mypage_subsc_news_li_l_title{font-size:18px; font-weight:400; color:#000; margin-bottom:10px; line-height:27px}
.mypage_subsc_news_li_l_txt{font-size:14px; font-weight:300; color:#999; word-break:keep-all; line-height:21px; height:42px}
.mypage_subsc_news_li_r_chk_item{position:absolute; top:50%; right:20px; transform:translate(0,-50%)}
.mypage_subsc_news_li_r_chk_item, .mypage_subsc_news_li_r_chk_item label{display:inline-block; vertical-align:middle}
.mypage_subsc_news_li_r_chk_item input[type="checkbox"]{position:absolute; left:-1000%; font-size:0; display:none}
.mypage_subsc_news_li_r_chk_item label{position:relative; width:50px; height:30px; background:#e9e9ea; border-radius:25px; transition:.2s; cursor:pointer}
.mypage_subsc_news_li_r_chk_item label:after{content:""; position:absolute; left:2px; top:50%; width:26px; height:26px; border-radius:50%; background:#fff; transform:translateY(-50%); box-shadow:1px 1px 4px rgba(0,0,0,0.1); transition:.2s}
.mypage_subsc_news_li_r_chk_item input[type="checkbox"]:checked + label{background:#1ba2da}
.mypage_subsc_news_li_r_chk_item input[type="checkbox"]:checked + label:after{left:calc(100% - 28px)}
/* mypage_subsc_breakdown */
.mypage_subsc_breakdown{padding:20px 0 100px}
.mypage_subsc_breakdown_title{font-size:18px; line-height:27px; font-weight:400; margin-bottom:15px; color:#000}
.mypage_subsc_breakdown_tb{width:100%; border-top:2px solid rgba(0,0,0,.6); margin-bottom:35px}
.mypage_subsc_breakdown_tb th, .mypage_subsc_breakdown_tb td{font-size:14px; line-height:23px; padding:10px; border-bottom:1px solid rgba(0,0,0,.1)}
.mypage_subsc_breakdown_tb th{background:#f6f6f6; font-weight:400; color:#000}
.mypage_subsc_breakdown_tb td{text-align:center; font-weight:300; color:#666}
.mypage_subsc_breakdown_tb tr:last-child td{border-bottom:1px solid rgba(0,0,0,.6)}
.mypage_subsc_breakdown_tb .mypage_subsc_breakdown_tb_none{padding:40px 0; color:#999}
.mypage_subsc_breakdown_tb .mypage_subsc_breakdown_tb_none b{font-weight:400; color:#333}
.mypage_subsc_breakdown_tb tr:hover{background:#f6f6f6; cursor:pointer;}
.mypage_subsc_breakdown_li{margin-bottom:25px}
.mypage_subsc_breakdown_li dt{font-size:18px; line-height:27px; font-weight:400; color:#000; margin-bottom:5px}
.mypage_subsc_breakdown_li dd{font-size:14px; line-height:22px; font-weight:300; color:#666}
/* event_220905_layer */
#mypage_subsc_breakdown_layer_mask{background:rgba(0,0,0,0.7); position:fixed; left:0; top:0; width:100%; height:100%; z-index:9}
.mypage_subsc_breakdown_layer{display:none; position:fixed; background:#fff; top:50%; right:50%; transform:translate(50%, -50%); width:660px; z-index:10; padding:20px 0}
.mypage_subsc_breakdown_layer_close{display:block; position:absolute; top:-40px; right:0; width:30px; height:30px; z-index:2}
.mypage_subsc_breakdown_layer_close svg{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:22px; height:22px; fill:#fff}
.mypage_subsc_breakdown_layer_title{font-size:22px; line-height:33px; font-weight:400; color:#000; margin-bottom:20px; text-align:center; border-bottom:1px solid rgba(0,0,0,.1); padding-bottom:20px;}
.mypage_subsc_breakdown_layer_txt{font-size:18px; line-height:27px; font-weight:300; color:#222; padding:0 30px 20px}
.mypage_subsc_breakdown_layer_txt b{font-weight:400; color:#22a5d9}
.mypage_subsc_breakdown_layer table{width:calc(100% - 60px); border-top:2px solid rgba(0,0,0,.6); margin:0 30px 20px}
.mypage_subsc_breakdown_layer table th, .mypage_subsc_breakdown_layer table td{font-size:14px; line-height:23px; border-bottom:1px solid rgba(0,0,0,.1)}
.mypage_subsc_breakdown_layer table th{background:#f6f6f6; font-weight:400; color:#000; padding:10px 20px; width:120px}
.mypage_subsc_breakdown_layer table td{font-weight:300; color:#666; padding:10px 30px}
.mypage_subsc_breakdown_layer table tr:last-child th, .mypage_subsc_breakdown_layer table tr:last-child td{border-bottom:1px solid rgba(0,0,0,.6)}

/* error page */
.error_page{padding-top:80px;text-align:center}
.error_page .errer_area{width:1100px;margin:0 auto}
.error_page .ico_error{display:inline-block;width:63px;height:63px}
.error_page .ico_error svg{fill:#23a5db}
.error_page .info_box{padding-top:58px}	
.error_page .info_box .error_title{color:#000;font-size:38px;font-weight:300}
.error_page .info_box .error_text{margin-top:55px;color:#555;font-size:18px;line-height:28px;font-weight:300}
.error_page .info_box .error_text + .error_text{margin-top:20px}
.error_page .info_box .error_text a{color:#23a5db;text-decoration:underline}
.error_page .btn_box{margin-top:70px;text-align:center;font-size:0}
.error_page .btn_box .btn_before{display:inline-block;padding:0 25px;color:#333;font-size:16px;line-height:46px;border:1px solid #bbb;border-radius:5px;background:#fff}
.error_page .btn_box .btn_home{display:inline-block;margin-left:10px;padding:0 25px;color:#fff;font-size:16px;line-height:46px;border-radius:5px;background:#23a5db}
.error_page .recommend_area{margin-top:80px;padding:80px 0;background:#fafafa}
.error_page .recommend_area .recommend_list{width:1100px;margin:0 auto;font-size:0}
.error_page .recommend_area .recommend_item{position:relative;display:inline-block;width: calc(25% - 17px);vertical-align:top;border:1px solid #d9d9d9}
.error_page .recommend_area .recommend_item + .recommend_item{margin-left:20px}
.error_page .recommend_area .recommend_item a{display:block}
.error_page .recommend_area .recommend_item .img_thumb{overflow:hidden;display:block}
.error_page .recommend_area .recommend_item .img_thumb img{width:100%;height:100%}
.error_page .recommend_area .recommend_item .recommend_title{box-sizing:border-box;display:block;height:70px;padding:15px 20px}
.error_page .recommend_area .recommend_item .recommend_title em{overflow:hidden;font-style:normal;color:#333;font-size:14px;text-align:left;line-height:20px;display:-webkit-box; text-overflow:ellipsis;-webkit-box-orient:vertical;word-wrap:break-word;-webkit-line-clamp:2}
.error_page .recommend_area .recommend_item a:hover .img_thumb img{transition:.3s;transform:scale(1.1,1.1)}
.error_page .recommend_area .recommend_item a:hover .recommend_title{text-decoration:underline}

/* notice */
.notice_section{width:1100px;margin:0 auto;padding:80px 0 0}
.notice_section .notice_title{margin:0;font-size:34px;font-weight:300;}
.notice_section .notice_category{margin-top:60px;font-size:0;}
.notice_section .notice_category li{display:inline-block;min-width:70px;border:1px solid #bbb;border-radius:30px}
.notice_section .notice_category li + li{margin-left:10px}
.notice_section .notice_category .btn_category{display:block;padding:0 20px;color:#555;font-size:16px;font-weight:400;line-height:38px;background:none}
.notice_section .notice_category li.on,
.notice_section .notice_category li:hover{border-color:#23a5db;background:#23a5db;transition:.3s}
.notice_section .notice_category li.on .btn_category,
.notice_section .notice_category li:hover .btn_category{color:#fff;transition:.3s}
.notice_section .notice_category .category_detail{color:#23a5db;font-size:16px;font-weight:300;line-height:38px;border-color:#23a5db;text-align:center}
.notice_section .notice_category .category_detail:hover{background:none}
.notice_section .notice_category .category_date{margin-left:20px;color:#999;font-size:15px;font-weight:300;border:0;line-height:38px}
.notice_section .notice_category .category_date:hover{border:none;background:none}
.notice_section .notice_table_info{position:relative;margin-top:40px}
.notice_section .notice_count{display:inline-block;line-height:38px}
.notice_section .notice_count span{display:inline-block;margin:0 2px 0 5px}
.notice_section .notice_search{position:absolute;top:0;right:0}
.notice_section .notice_search .inp_search{box-sizing:border-box;position:relative;width:350px;height:38px;padding:0 25px;color:#000;font-size:16px;border-radius:30px;background:#f5f5f5}
.notice_section .notice_search .inp_search::placeholder{color:#999;font-weight:300}
.notice_section .notice_search .inp_search:focus{box-sizing:border-box;padding:0 24px;border:1px solid #333;background:#fff}
.notice_section .notice_search .btn_search{position:absolute;top:0;right:10px;width:38px;height:38px;cursor:pointer;border:none;background:none}
.notice_section .notice_search .btn_search svg{width:18px;height:18px;margin-top:3px;fill:#333}
.notice_section .notice_tbl_list{margin-top:20px;border-top:2px solid #333}
.notice_section .notice_tbl_list table{width:100%;table-layout:fixed;border-collapse:collapse}
.notice_section .notice_tbl_list table caption{display:none}
.notice_section .notice_tbl_list thead{border-bottom:1px solid #e5e5e5;background:#fafafa}
.notice_section .notice_tbl_list thead th{padding:22px 0 21px;font-size:15px;font-weight:500}
.notice_section .notice_tbl_list tbody tr{border-bottom:1px solid #e5e5e5}
.notice_section .notice_tbl_list tbody tr:hover{cursor:pointer}
.notice_section .notice_tbl_list tbody tr:hover td.txt_title{color:#999;transition:.3}
.notice_section .notice_tbl_list tbody td{padding:22px 0 21px;color:#999;font-size:15px;font-weight:300;text-align:center}
.notice_section .notice_tbl_list tbody td.txt_category{color:#23a5db}
.notice_section .notice_tbl_list tbody td.txt_title{padding:0 15px;color:#333;text-align:left}
.notice_section .notice_detail .notice_detail_title{margin:0;padding:40px 0 25px;color:#333;font-size:30px;font-weight:400;border-bottom:1px solid #333}
.notice_section .notice_detail .notice_detail_section{overflow:hidden;box-sizing:border-box;padding:50px 20px;border-bottom:1px solid #e5e5e5}
.notice_section .notice_detail .notice_detail_section::after{clear:both;display:block;content:''}
.notice_section .notice_detail .notice_detail_section strong{display:block;margin-bottom:20px;font-size:16px}
.notice_section .notice_detail .notice_detail_section iframe{display:block;max-width:100%;margin-bottom:20px}
.notice_section .notice_detail .notice_detail_section p{margin-bottom:20px;color:#666;font-size:16px}
.notice_section .notice_detail .notice_detail_section img{display:block;max-width:100%;margin:0 auto 20px}
.notice_section .notice_detail .notice_detail_section a{display:inline-block;text-decoration:underline}
.notice_section .notice_detail .notice_detail_section p a{display:inline}
.notice_section .notice_detail .notice_detail_section a:hover{color:#333;transition:.3s}
.notice_section .notice_detail .notice_detail_section img + iframe{margin-top:50px}
.notice_section .notice_detail .notice_detail_section img + strong{margin-top:50px}
.notice_section .notice_detail .notice_detail_section img + p{margin-top:50px}
.notice_section .notice_detail .notice_detail_section table{border:1px solid #333}
.notice_section .notice_detail .notice_detail_section table th, .notice_section .notice_detail .notice_detail_section table td{padding:15px;color:#666;font-size:16px;border-top:1px solid #333}
.notice_section .notice_detail .notice_detail_section table th{color:#333;border-right:1px solid #333}
.notice_section .notice_detail .notice_detail_section table thead th{max-width:200px}
.notice_section .notice_detail .notice_detail_section table tbody td{border-right:1px solid #333;text-align:center}
.notice_section .notice_detail .notice_detail_section table tbody td p{margin-bottom:0;padding:15px 0}
.notice_section .notice_detail .btn_notice_detail{padding:60px 0 100px}
.notice_section .notice_detail .btn_notice_detail .btn_table_list{display:block;width:200px;margin:0 auto;color:#333;text-align:center;border:1px solid #333;border-radius:30px;line-height:50px}
.notice_section .notice_detail .btn_notice_detail .btn_table_list:hover{color:#999;border-color:#999;transition:.3s}
.notice_section .pagenation{margin:60px 0 120px;font-size:0;text-align:center}
.notice_section .pagenation .first,
.notice_section .pagenation .prev,
.notice_section .pagenation .next,
.notice_section .pagenation .last{position:relative;display:inline-block;width:30px;height:30px;border-radius:30px;vertical-align:top}
.notice_section .pagenation .btn_pagenation svg{position:absolute;top:50%;left:50%;margin:-7px 0 0 -6px;width:14px;height:14px;fill:#dbdbdb}
.notice_section .pagenation .btn_pagenation:hover svg{fill:#777;transition:.3s}
.notice_section .pagenation .first,
.notice_section .pagenation .prev{transform:rotate(180deg)}
.notice_section .pagenation .first{margin-left:4px}
.notice_section .pagenation .last{margin-left:4px}
.notice_section .pagenation .num{display:inline-block;margin:0 10px}
.notice_section .pagenation .num li{display:inline-block;width:30px;height:30px}
.notice_section .pagenation .num li + li{margin-left:10px}
.notice_section .pagenation .num li:last-child{border-right:0 none}
.notice_section .pagenation .num a{display:block;font-size:14px;color:#777;font-weight:300;line-height:30px}
.notice_section .pagenation .num .on a,
.notice_section .pagenation .num a:hover{color:#fff;border-radius:30px;background:#23a5db;transition: 0.3s}
.notice_section .btn_notice_detail .btn_neighbor_list{margin-top:60px}
.notice_section .btn_notice_detail .btn_neighbor_list li{padding:20px 0}
.notice_section .btn_notice_detail .btn_neighbor_list li + li{border-top:1px solid #e5e5e5}
.notice_section .btn_notice_detail .btn_neighbor_list .btn_neighbor{display:block;font-size:0}
.notice_section .btn_neighbor span:first-child .ico_arrow{display:inline-block;margin:0 15px}
.notice_section .btn_neighbor_list i.ico_arrow::before,
.notice_section .btn_neighbor_list i.ico_arrow::after{position:relative;display:block;width:8px;height:2px;background:#333;content:''}
.notice_section .btn_neighbor .prev .ico_arrow::before{top:-2px;transform:rotate(-45deg)}
.notice_section .btn_neighbor .prev .ico_arrow::after{top:-4px;left:5px;transform:rotate(45deg)}
.notice_section .btn_neighbor .next .ico_arrow::before{top:-1px;transform:rotate(45deg)}
.notice_section .btn_neighbor .next .ico_arrow::after{top:-3px;left:5px;transform:rotate(-45deg)}
.notice_section .btn_neighbor span{display:inline-block;color:#333;font-size:15px;font-weight:300;vertical-align:top}
.notice_section .btn_neighbor .btn{padding:0 20px}
.notice_section .btn_neighbor .txt{box-sizing:border-box;width:855px;padding:0 25px}
.notice_section .btn_neighbor .date{padding:0 20px;color:#999}
.notice_section .btn_notice_detail .btn_neighbor_list .btn_neighbor:hover .txt{color:#999;transition:.3s}
/* ad_230512_new */
.ad_230512_new{position:relative; overflow:hidden; width:1100px; margin:20px 0 0; padding:17px 0; background-color:#f6f6f6; font-size:0; text-align:center}
.ad_230512_new_li, .ad_230512_new_li li{display:inline-block; vertical-align:top}
.ad_230512_new_li li{margin:0 20px; width:200px}
.ad_230512_new_li li a{display:block}
.ad_230512_new_li_img{position:relative; overflow:hidden; width:200px; height:100px; background:#666; margin:0 0 8px}
.ad_230512_new_li_img:after{position:absolute; content:""; top:0; left:0; right:0; bottom:0; border:1px solid rgba(0,0,0,0.1)}
.ad_230512_new_li_img img{width:100%; height:100%; object-fit:cover}
.ad_230512_new_li_t{font-size:15px; line-height:21px; font-weight:300; color:#555; text-align:left; word-break:keep-all; letter-spacing:-0.5px; padding:0 5px}
.ad_230512_new_li li.ad_230512_new_li_notext{width:300px}
.ad_230512_new_li_notext .ad_230512_new_li_img{width:300px; height:150px; margin-bottom:0}


.btn_bg{position:relative; text-align:center; font-size:0}
.btn1{display:block; font-size:14px; font-weight:300; letter-spacing:-0.5px; color:#444; line-height:20px; padding:10px 0; margin-bottom:15px}
.btn1 svg{display:block; margin:0 auto 5px; width:12px; height:12px; fill:#444}
.btn2{display:block; font-size:15px; font-weight:400; letter-spacing:-1px; color:#fff; line-height:44px; margin:15px; background:#006bff; border-radius:22px}


/* ====== lowbirth ======================================================================================================= */
.lowbirth{position:relative; margin-top:-166px;}
.lowbirth_width{position:relative; max-width:1100px; margin:0 auto;}
/* lowbirth_main */
.lowbirth_main{background:url(http://res.heraldm.com/lowbirth/images/lowbirth_main.jpg) center no-repeat; background-size:cover; padding-top:166px;}
.lowbirth_main_title{padding:92px 0 629px; font-size:0; text-align:center;}
.lowbirth_main_title_img{display:inline-block; vertical-align:top;}
.lowbirth_main_title_img_m{display:none}
.lowbirth_main_title_counter{position:absolute; top:125px; left:50%; margin-left:-72px;  font-size:74px; color:#FF576D; font-weight:600; letter-spacing:17px;}
.lowbirth_main_article{position:absolute; top:289px; right:60px; display:block; box-shadow:0px 8px 20px 0px rgba(0,0,0,.15); z-index:1; width:473px; border-radius:8px; background:rgba(0,0,0,.6); -webkit-backdrop-filter:blur(25px); backdrop-filter:blur(25px); margin-bottom:100px; transition:.1s;}
.lowbirth_main_article_img{position:relative; overflow:hidden; height:283px; border-radius: 8px 8px 0px 0px}
.lowbirth_main_article_img img{position:absolute; top:0; left:0; width:100%; height:100%; transition:.1s; object-fit:cover;}
.lowbirth_main_article_img:after{position:absolute; content:""; top:0; left:0; right:0; bottom:0; border:1px solid rgba(0,0,0,.3); border-bottom:none; border-radius:8px 8px 0 0;}
.lowbirth_article_tag{position:absolute; left:20px; bottom:15px; line-height:27px; border-radius:19px; border:1px solid rgba(255,255,255,.2); background:rgba(255, 87, 109, 0.8); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); padding:0 16px; color:#fff; font-size:13px; font-weight:400;}
.lowbirth_main_article_t_bg{position:relative; padding:18px 22px 20px;}
.lowbirth_main_article_t1{color:#fff; font-size:24px; font-weight:400; line-height:35px; margin-bottom:5px; word-break:keep-all}
.lowbirth_main_article_t2{color:rgba(255,255,255,.4); font-size:14px; font-weight:200; line-height:23px; letter-spacing:-0.14px;}
.lowbirth_main_article_t_bg:after{position:absolute; content:""; top:0; left:0; right:0; bottom:0; border:1px solid rgba(0,0,0,.4); border-top:none; border-radius:0 0 8px 8px}
.lowbirth_main_article:hover .lowbirth_main_article_img img{transform:scale(1.05);}
.lowbirth_main_article:hover{box-shadow:0px 10px 20px 0px rgba(0,0,0,.35);}
/* lowbirth_graph */
.lowbirth_graph_bg{position:relative; padding:50px 0; background: rgba(0,0,0,.5); -webkit-backdrop-filter:blur(15px); backdrop-filter:blur(15px);}
.lowbirth_graph_title{position:relative; line-height:29px; margin-bottom:27px;}
.lowbirth_graph_title_l{color:#fff; font-size:28px; font-weight:300;}
.lowbirth_graph_title_r{position:absolute; top:0; right:0; color:rgba(255,255,255,.5); font-size:14px; font-weight:200;}
.lowbirth_graph{font-size:0; margin:0 -12px}
.lowbirth_graph li{display:inline-block; vertical-align:top; width:calc(50% - 24px); margin:0 12px; height:300px; border-radius:8px; background:rgba(255,255,255,.9); -webkit-backdrop-filter:blur(15px); backdrop-filter:blur(15px);}
.lowbirth_graph_chart{width:100%; height:100%;}
/* lowbirth_list */
.lowbirth_list{position:relative; font-size:0;padding:50px 0 10px;}
.lowbirth_li{margin:0 -10px}
.lowbirth_li li{position:relative; display:inline-block; vertical-align:top; width:calc(33.33% - 20px); margin:0 10px; border-radius:8px; margin-bottom:40px; transition:.1s;}
.lowbirth_li li a{position:relative; display:block; }
.lowbirth_li li a:after{position:absolute; content:""; top:0; left:0; right:0; bottom:0; border-radius:8px; border:1px solid rgba(0,0,0,.2); transition:.1s;}
.lowbirth_li_img{position:relative; overflow:hidden; border-radius:8px 8px 0 0; padding-bottom:59.8%; }
.lowbirth_li_img img{position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; transition:.1s; }
.lowbirth_li_t_bg{padding:18px 22px 20px;}
.lowbirth_li_t1{font-size:20px; font-weight:300; color:#222; line-height:30px; word-break:keep-all; margin-bottom:10px;}
.lowbirth_li_t2{font-size:14px; font-weight:300; color:#888; line-height:22px; }
.lowbirth_li li:hover{box-shadow:0px 4px 25px 0px rgba(0,0,0,.1); }
.lowbirth_li li:hover .lowbirth_li_img img{transform:scale(1.05);}
.lowbirth_li li:hover a:after{border-color:rgba(0,0,0,.4)}
/* lowbirth_interview */
.lowbirth_interview{position:relative; font-size:0; padding:50px 0; background:#F6F6F6; margin-bottom:80px;}
.lowbirth_interview_title{color:#111; font-size:28px; font-weight:400; line-height:29px; margin-bottom:27px;}
.lowbirth_interview_li{margin:0 -10px}
.lowbirth_interview_li li{position:relative; display:inline-block; vertical-align:top; width:calc(50% - 20px); margin:0 10px; border-radius:8px; }
.lowbirth_interview_li li a{position:relative; display:block; }
.lowbirth_interview_li_img{position:relative; overflow:hidden; display:inline-block; vertical-align:middle; border-radius:8px; width:50%; margin-right:20px; padding-bottom:29.9%; }
.lowbirth_interview_li_img img{position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; transition:.1s; }
.lowbirth_interview_li_img:after{position:absolute; content:""; top:0; left:0; right:0; bottom:0; border-radius:8px; border:1px solid rgba(0,0,0,.1); transition:.1s;}
.lowbirth_interview_li_t_bg{display:inline-block; vertical-align:middle; width:calc(50% - 20px)}
.lowbirth_interview_li_t1{font-size:20px; font-weight:300; color:#222; line-height:30px; word-break:keep-all; letter-spacing:-0.6px; margin-bottom:10px;}
.lowbirth_interview_li_t2{font-size:14px; font-weight:300; color:#777; line-height:22px; }
.lowbirth_interview_li li:hover .lowbirth_interview_li_img img{transform:scale(1.05);}
@media all and (max-width:900px) {
/* ====== lowbirth ======================================================================================================= */
.lowbirth{margin-top:0}
/* lowbirth_main */
.lowbirth_main{padding-top:50px}
.lowbirth_main_title{padding:16% 0 50px}
.lowbirth_main_title_img{max-width:80%}
.lowbirth_main_title_img_m{display:inline-block}
.lowbirth_main_title_img_pc{display:none}
.lowbirth_main_title_counter{top:20.5vw; margin-left:-9.6%;  font-size:10vw; letter-spacing:2.3vw}
.lowbirth_main_article{position:relative; top:inherit; right:inherit; width:90%; background:rgba(0,0,0,.8); margin:0 auto 30px}
.lowbirth_main_article_img{height:inherit; padding-bottom:60%}
.lowbirth_article_tag{left:15px; bottom:13px; line-height:24px; padding-top:1px; border-radius:14px; padding:0 14px; font-size:12px}
.lowbirth_main_article_t_bg{padding:20px}
.lowbirth_main_article_t1{font-size:19px; line-height:28px; margin-bottom:10px}
.lowbirth_main_article_t2{font-size:12px; font-weight:200; line-height:19px}
/* lowbirth_graph */
.lowbirth_graph_bg{padding:30px 0; background:rgba(0,0,0,.7)}
.lowbirth_graph_title{padding:0 20px; line-height:22px; margin-bottom:20px}
.lowbirth_graph_title_l, .lowbirth_graph_title_r{display:inline-block; vertical-align:middle;}
.lowbirth_graph_title_l{font-size:19px; margin-right:10px; letter-spacing:-0.5px}
.lowbirth_graph_title_r{font-size:12px; line-height:18px; color:rgba(255,255,255,.4); position:relative; top:inherit; right:inherit; letter-spacing:-0.3px}
.lowbirth_graph{margin:0 20px}
.lowbirth_graph li{display:block; width:100%; margin:0; height:inherit; padding-bottom:60%; overflow:hidden}
.lowbirth_graph li + li{margin-top:20px;}
.lowbirth_graph_chart{position:absolute; top:0; left:0}
/* lowbirth_list */
.lowbirth_list{padding:30px 0 10px;}
.lowbirth_li{margin:0 8px}
.lowbirth_li li{width:calc(50% - 14px); margin:0 7px 20px}
.lowbirth_li_img{padding-bottom:70%}
.lowbirth_li_t_bg{padding:12px 14px 14px;}
.lowbirth_li_t1{font-size:14px; line-height:22px; margin-bottom:5px; letter-spacing:-0.5px; word-break:break-all}
.lowbirth_li_t2{font-size:12px;line-height:18px; letter-spacing:-0.5px; color:#aaa}
/* lowbirth_interview */
.lowbirth_interview{padding:30px 0; margin-bottom:30px}
.lowbirth_interview_title{padding:0 20px; font-size:19px; margin-bottom:15px; letter-spacing:-0.5px}
.lowbirth_interview_li{margin:0 20px}
.lowbirth_interview_li li{width:100%; margin:0}
.lowbirth_interview_li li + li{margin-top:20px}
.lowbirth_interview_li_img{width:45%; margin-right:14px; padding-bottom:30%;}
.lowbirth_interview_li_t_bg{width:calc(55% - 20px)}
.lowbirth_interview_li_t1{font-size:15px; line-height:22px; letter-spacing:-0.5px; margin-bottom:5px}
.lowbirth_interview_li_t2{font-size:12px; line-height:16px; color:#999; letter-spacing:-0.3px}
}


/* ====== insight ======================================================================================================= */
.insight_li > li{margin-bottom:20px;}
.insight_li_title_img{margin-bottom:2px;}
.insight_li_subli li{margin:8px 0}
.insight_li_subli li a:before{position:relative; content:"ㄴ"; font-size:12px; color:#999; margin-right:3px; font-weight:200;}
.insight_li_subli li a{color:#333; font-size:14px; font-weight:300; line-height:20px; text-indent:-13px; padding-left:15px;}
.insight_li_subli li a:hover{text-decoration:underline; font-weight:400; color:#111}
.btn_twitter{box-sizing:border-box;display:inline-block;width:38px;height:38px;padding:3px 5px;border-radius:100%;background:#000}
.btn_twitter svg{display:block;width:28px;height:30px;fill:#e7e9ea}


/* ====== loading ======================================================================================================= */
.bookshelf_wrapper_bg{position:relative; overflow:hidden; height:72px; }
.bookshelf_wrapper {position:relative; top:65%; left:50%; transform:translate(-50%, 0) scale(.2);}
.books_list{margin:0 auto; width:300px; padding:0}
.book_item {position:absolute; top:-120px; box-sizing:border-box; width:40px; height:120px; opacity:0; background-color:#fff; border:5px solid rgba(0,107,255,1); transform-origin:bottom left; transform:translateX(300px); animation:travel 2500ms linear infinite}
.book_item.first{top:-140px; height:140px}
.book_item.first:before, .book_item.first:after{content:''; position:absolute; top:10px; left:0; width:100%; height:5px; background-color:rgba(0,107,255,1)}
.book_item.first:after{top:initial; bottom:10px}
.book_item.second:before, .book_item.second:after, .book_item.fifth:before, .book_item.fifth:after{box-sizing:border-box; content:''; position:absolute; top:10px; left:0; width:100%; height:17.5px; border-top:5px solid rgba(0,107,255,1); border-bottom:5px solid rgba(0,107,255,1)}
.book_item.second:after, .book_item.fifth:after{top:initial; bottom:10px}
.book_item.third:before, .book_item.third:after{box-sizing:border-box; content:''; position:absolute; top:10px; left:9px; width:12px; height:12px; border-radius:50%; border:5px solid rgba(0,107,255,1)}
.book_item.third:after{top:initial; bottom:10px}
.book_item.fourth{top:-130px; height:130px}
.book_item.fourth:before{box-sizing:border-box; content:''; position:absolute; top:46px; left:0; width:100%; height:17.5px; border-top:5px solid rgba(0,107,255,1); border-bottom:5px solid rgba(0,107,255,1)}
.book_item.fifth{top:-100px; height:100px}
.book_item.sixth{top:-140px; height:140px}
.book_item.sixth:before{box-sizing:border-box; content:''; position:absolute; bottom:31px; left:0px; width:100%; height:5px; background-color:rgba(0,107,255,1)}
.book_item.sixth:after{box-sizing:border-box; content:''; position:absolute; bottom:10px; left:9px; width:12px; height:12px; border-radius:50%; border:5px solid rgba(0,107,255,1)}
.book_item:nth-child(2){animation-delay:416.6666666667ms}
.book_item:nth-child(3){animation-delay:833.3333333333ms}
.book_item:nth-child(4){animation-delay:1250ms}
.book_item:nth-child(5){animation-delay:1666.6666666667ms}
.book_item:nth-child(6){animation-delay:2083.3333333333ms}
.shelf{width:300px; height:5px; margin:0 auto; background-color:rgba(0,107,255,.5); position:relative}
.shelf:before, .shelf:after{content:''; position:absolute; width:100%; height:100%; background:#fff; background-image:radial-gradient(rgba(0,107,255,.5) 30%, transparent 0); background-size:10px 10px; background-position:0 -2.5px; top:200%; left:5%; animation: move 250ms linear infinite}
.shelf:after{top:400%; left:7.5%}


