﻿@charset "utf-8";

/*!
 * Start Bootstrap - Business Casual Bootstrap Theme (http://startbootstrap.com)
 * Code licensed under the Apache License v2.0.
 * For details, see http://www.apache.org/licenses/LICENSE-2.0.
 */

 @import url(//fonts.googleapis.com/css?family=Noto+Sans);

 @font-face {font-family: 'Noto Sans KR';font-style: normal;
    font-weight: 100;src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff2) 
    format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.woff) 
    format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Thin.otf) format('opentype');}
    
    @font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 300;
    src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff2) 
    format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.woff) 
    format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Light.otf) format('opentype');}
    
    @font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 400;
    src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff2) 
    format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.woff) 
    format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Regular.otf) format('opentype');}
    
    @font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 500;
    src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff2) format('woff2'),
    url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.woff) format('woff'),
    url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Medium.otf) format('opentype');}
    
    @font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 700;
    src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff2) 
    format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.woff) 
    format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Bold.otf) format('opentype');}
    
    @font-face {font-family: 'Noto Sans KR';font-style: normal;font-weight: 900;
    src: url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff2) 
    format('woff2'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.woff)
    format('woff'),url(//fonts.gstatic.com/ea/notosanskr/v2/NotoSansKR-Black.otf) format('opentype');}



body {
    font-family:'Noto Sans KR','돋움',Dotum,'굴림',Gulim, AppleGothic, Sans-serif;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
	ol, ul { list-style: none; }
}

h1,
h2,
h3,
h4,
h5,
h6 {
    --text-transform: uppercase;
    font-family:'Noto Sans KR','돋움',Dotum,'굴림',Gulim, AppleGothic, Sans-serif;
    font-weight: 700;
    letter-spacing: 0;
}

p {
    font-size:16px;
    line-height: 1.6;
    color: #000;
}

a {
  color: #000000;
  text-decoration: none
}

a:focus,a:hover {
  color: #000000;
  text-decoration: underline}

.ellipsis {overflow: hidden; white-space: nowrap; text-overflow: ellipsis; word-break: break-all;}
.ellipsis-line {overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box !important;
  -webkit-line-clamp: 2;  -webkit-box-orient: vertical; word-break: keep-all;}


.mt-0 {margin-top: 0 !important;}
.mt-10 {margin-top: 10px !important;}




  #main_news .rsnav a {font-size: 16px; font-weight: 400; padding-left: 10px; padding-right: 10px;}

  .navbar-default {border: none !important; border-color: #fff !important;}







        
   /* default 23n */ 
   .e4ds-23n {padding-top: 30px;}
   
   .row.m-20 {margin: 0 -20px;}
   .row.m-20 h2 {position: relative; padding-left: 21px; padding-bottom: 6px;}
   .row.m-20 h2 a {display: inline-block;  position: absolute; right: 30px; top: 5px;}
   .row.m-20 h2 svg {width: 28px; height: 28px;}

   .main-top-left {padding: 0 20px;}
   .main-top-left a {display: block;}
   .main-top-left a img {width: 630px; height: 354px; object-fit: cover; }
   .main-top-left a .desc {padding-top: 18px;}
   .main-top-left a .desc .tit {display: block; line-height: 1.4; margin-bottom: 17px; margin-right: 20px; color: #000;  font-size: 30px; letter-spacing: -.5px; font-weight: bold;}
   .main-top-left a .desc p {line-height: 30px; color: #484848; font-size: 16px; letter-spacing: -0.3px;}    
   .main-top-left a .desc p.txt {overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4;  -webkit-box-orient: vertical; word-break: keep-all;}    
        
   .main-top-headline .bl-plus img {width: 32px; height: 32px;}

   .main-top-right .col-md-6 {width: 335px; padding: 0 20px;}
   .main-top-right .col-md-6 a {display: block;}
   .main-top-right .col-md-6 a>img {width: 295px; height: 166px; object-fit: cover;}
   .main-top-thumb {height: 260px;}
   .main-top-thumb a {display: block; position: relative;}
   .main-top-thumb p {padding-top: 8px; font-size: 18px; letter-spacing: -0.5px; line-height: 1.5; font-weight: bold; }
   .main-top-thumb a span {bottom: auto; top: 126px; right: 13px !important;}

   .main-top-news {position: relative;}
   .main-top-news a>img {width: 295px; height: 255px !important; object-fit: cover;}
   .main-top-news .tit-box {position: absolute; background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%,
		rgba(0, 0, 0, 0.65) 60%, rgba(0, 0, 0, 0.7) 100%); z-index: 10; left: 0; bottom: 0; margin: 0; padding: 30px 10px 18px 18px; font-size: 18px; font-weight: bold; color: #ffffff; line-height: 1.5;}
 
  .main-top-list ul {padding: 0 0 0 0;}
  .main-top-list ul li {border-top: 1px solid #eaeaea; padding: 15px 0; }
  .main-top-list ul li:last-child {border-bottom: 1px solid #eaeaea;}
  .main-top-list ul li a {display: block; height: 54px; font-size: 18px; letter-spacing: -0.5px; line-height: 1.5; font-weight: 400; }

  .main-top-notice {margin-top: 40px;}
  .main-top-notice div {position: relative; width: 630px; height: 50px; padding:6px 0; margin: 0 auto; background-color: #f5f5f5; padding-left: 140px;}
  .main-top-notice div .tit {position: absolute; color: #fb6b3f; left: 23px; top: 12px; font-size: 17px;} 
  .rolling {margin:0;padding:0;list-style:none;overflow:hidden;height:30px;}
  .rolling li {position: relative; line-height: 50px; padding: 10px 0;}
  .rolling li a {display: block; font-size: 16px; line-height: 1; color: #434343; }
  .rolling li a span {position: absolute; right: 23px; top: 13px; color:#999999;}

   .main-news-left {}
   .main-news-left .col-md-6 {width: 335px; padding: 0 20px;}
   .main-news-left .col-md-6 a {display: block;}
   .main-news-left .col-md-6 a>img {width: 295px; height: 166px; object-fit: cover;}

   .main-news-right {padding-left: 50px;}
   .main-news-right ul {padding: 0 0 0 20px;}
   .main-news-right ul li {padding: 8px 0;}
   .main-news-right ul li a {display: block; font-size: 16px; line-height: 1.5; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; word-break: break-all;}
   .main-news-right ul li a:hover {text-decoration: underline !important;}
   .main-news-right ul li a span {font-size: 15px; font-weight: 700; padding-right: 10px;}
   .main-news-right ul li a span.subject1 {color: #3a73e7;}   
   .main-news-right ul li a span.subject2 {color: #2eb272;}
   .main-news-right ul li a span.subject3 {color: #f6552f;}   
   .main-news-right ul li a span.subject4 {color: #953ff6;}
   

   .main-video {padding: 0 20px;}
   .main-video a {display: block; position: relative; height: 370px;}
   .main-video a>div>img {width: 630px; height: 370px; object-fit: cover;}
   .main-video .tit-box {position: absolute; background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%,
		rgba(0, 0, 0, 0.65) 60%, rgba(0, 0, 0, 0.7) 100%); width: 100%; z-index: 10; left: 0; bottom: 0; padding: 60px 30px 25px 30px; font-size: 27px; font-weight: bold; color: #ffffff; line-height: 1.4;}
    .main-video .tit-box>img {width: 57px; height: 23px; position: absolute; left: 30px; bottom: 110px}
    a .tit-box:hover {text-decoration: underline !important;}
  
    .main-video-thumb .col-md-6 {padding: 0 20px; margin-bottom: 38px;}
    .main-video-thumb a>div>img {width: 295px; height: 166px; object-fit: cover;}
    .main-video-thumb a .tit-box { position: absolute; background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0.65) 60%, rgba(0, 0, 0, 0.75) 100%); width: 295px; z-index: 10; left: 20px; bottom: 0; padding: 30px 30px 15px 20px; font-size: 18px; font-weight: bold; color: #ffffff; line-height: 1.3;}






    .col-md-6 a {display: block;}
    .col-md-6 a .icon-play {position: absolute; right: 30px; bottom:15px; z-index: 10; width: 38px; height: 38px;}
    .col-md-6 a .icon-play img {width: 100%;}

    .main-tab-news {margin-top: 50px; margin-bottom: 40px; width: 100%; background-color: #f0f7ff;}
    .main-tab-news .container {margin: 0 auto; padding: 30px 0 40px 0;}
    .main-tab-news .nav-tabs {
      border-bottom: 1px solid #ddd;
      width: 100%;
    }
    .main-tab-news .nav-tabs > li {
      float: left;
      margin-bottom: 0;
      border: none;
    }
    .main-tab-news .nav-tabs > li > a {
      margin-right: 2px;
      font-size: 18px;
      line-height: 1.42857143;
      border: none;
      border-radius:0;
      background-color: transparent;
      background-image: none;
      font-weight:500;
    }
    .main-tab-news .nav-tabs > li:last-child > a {padding: 7px 35px 13px 35px;}

    .main-tab-news .nav-tabs > li > a:hover {
      border: none;
    }
    .main-tab-news .nav-tabs > li.active > a,
    .main-tab-news .nav-tabs > li.active > a:hover,
    .main-tab-news .nav-tabs > li.active > a:focus {
      color: #ffffff;
      cursor: default;
      background-color: #3d7dde;
      background-image: none;
      border: none;
      font-weight:500;
    }
    .main-tab-news .nav-tabs > li.active a:after{
      position: absolute;
      bottom: -10px;
      left:50%;
      margin-left: -10px;
      content:"";
      display:block;
      border-left: 10px solid transparent;
      border-right: 10px solid transparent;
      border-top: 10px solid #3d7dde; 
    }

    .main-tab-news-list {position: relative; margin-top: 30px;}
    .main-tab-news-list ul {padding: 0 0 0 0; overflow: hidden;}
    .main-tab-news-list ul li {position: relative; float: left; width: 228px; margin-right: 40px;}
    .main-tab-news-list ul li:nth-child(5n) {margin-right: 0;}
    .main-tab-news-list ul li .icon-play {position: absolute; right: 13px; top:83px; z-index: 10; width: 38px; height: 38px;}
    .main-tab-news-list ul li a>img {width: 228px; height: 129px; object-fit: cover;}
    .main-tab-news-list a.more {position: absolute; right: 7px; top: -69px;}
    .main-tab-news-list a.more svg {width: 26px; height: 26px; color: #3d7dde;}

    .main-banner-wrap {margin-bottom: 30px;}
    .main-banner-wrap a {display: block; height: 130px; }
    .main-banner-wrap img {width: 630px; height: 130px; background-color: antiquewhite;}

    .ps-20 {padding-left: 20px !important;}
    .pe-20 {padding-right: 20px !important;}

    .main-news-thumb {height: 260px;}
    .main-news-thumb a .icon-play {top: 116px; right: 35px;}
    .main-news-thumb p {font-weight: 500; font-size: 16px; padding-top: 9px;}

    .news-scene {padding-bottom: 50px;}
    .news-scene-list {margin: 0 auto; width: 1300px;}
    .news-scene-list ul {padding: 0 0 0 0 !important;}
    .news-scene-list ul li {position: relative; float: left; width: 228px; margin-right: 40px;}
    .news-scene-list ul li:nth-child(5n) {margin-right: 0;}
    .news-scene-list ul li .icon-play {position: absolute; right: 13px; top:81px; z-index: 10; width: 38px; height: 38px;}
    .news-scene-list ul li a>img {width: 228px; height: 129px; object-fit: cover;}
    



    .container-main-bottom {width: 100%; background-color: #2d3036; padding-bottom: 50px; margin-top: 50px;}
    .container-main-bottom  h2 {position: relative; color: #ffffff;}
    .container-main-bottom  h2 a {display: inline-block;  position: absolute; right: 10px; top: 1px; color: #ffffff;}
    .container-main-bottom  h2 a svg { width: 28px; height: 28px;}
    .container-main-bottom .webinar {padding-top: 30px;}
    .container-main-bottom .webinar ul {padding: 0 0 0 0; margin-top: 15px;}
    .container-main-bottom .webinar ul li a {display: block; color: #ffffff; font-size: 16px; line-height: 2.4; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; word-break: break-all;}

    .container-main-bottom .webinar-list .media {margin-top: 0;}
    .container-main-bottom .webinar-list .media .media-heading {margin-bottom: 10px;}

    .container-main-bottom .webinar-list li {width: 50%; height: 115.59px; float: left; padding: 0 0 0 50px;}
    .container-main-bottom .webinar-list li:before{content:'';position:absolute;top:0;left:0;display:inline-block;width:20px;height:24px;background-repeat:no-repeat;}
    /* .container-main-bottom .webinar-list li:first-child:before{background-position:0 0}
    .container-main-bottom .webinar-list li:first-child + li:before{background-position:-33px 0;}
    .container-main-bottom .webinar-list li:first-child + li + li:before{background-position:-70px 0}
    .container-main-bottom .webinar-list li:first-child + li + li + li:before{background-position:-105px 0}
    .container-main-bottom .webinar-list li:first-child + li + li + li + li:before{background-position:-143px 0}
    .container-main-bottom .webinar-list li:first-child + li + li + li + li + li:before{background-position:-180px 0} */

    .container-main-bottom .webinar-list li .media-body a {color: #ffffff; font-size: 16px; line-height: 1.4; font-weight: 400; height: 45px; overflow: hidden; white-space: normal; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2;  -webkit-box-orient: vertical; word-break: keep-all;}
    .container-main-bottom .webinar-list li .media-body a:hover {text-decoration: underline !important;}
    .container-main-bottom .webinar-list .media-right {padding-left: 15px;}


    .extInfo_blue {line-height: 1.2;}
    .extInfo_blue .bar {color: #747577;}
    .extInfo_blue .date {color: #ffffff;letter-spacing: -0.1px; font-weight: 300;}
    .extInfo_blue .company {color: #ffffff;letter-spacing: -0.1px;font-weight: 300;}
    .extInfo_blue .diff {color:#fe9963; font-weight: 500; font-size: 13px; letter-spacing: -0.5px;}

    .e4ds-make.row.m-20 {padding-top: 30px;}

    .main-make-article-list {width: 1340px; margin: 0 auto;}
    .main-make-article-list .col-md-3 {padding-bottom: 50px;}
    .main-make-article-list .col-md-3>div {padding: 0 20px  0 20px; position: relative;}
    .main-make-article-list .col-md-3 div a img {height: 166px; object-fit: cover;}
    .main-make-article-list .col-md-3 div .contest-item-heart-wrap {position: absolute; right: 25px; bottom: 0; color: #fff; font-size: 14px;}
    .main-make-article-list .col-md-3 div .contest-item-heart-wrap span  {margin-left: 7px; color: #fff;}
    .main-make-article-list .col-md-3 div .contest-list-title {font-size: 18px; font-weight: 500; color: #fff; margin-bottom: 6px;}
    .main-make-article-list .col-md-3 div .contest-list-text {font-size: 15px; font-weight: 300; color: #fff; height: 48px; line-height: 1.3;}
    .main-make-article-list .col-md-3 div .contest-list-writer {font-size: 14px;}
    .main-make-article-list .col-md-3 div a span {color: #000;} 
    .main-make-article-list .col-md-3 div a span.project_icon.contest {display: block; color: #00b8bb; padding-top: 7px; padding-bottom: 4px; font-size: 14px;}







    footer {background-color: #ffffff;}
    footer .container .row {padding-bottom: 100px;}
    footer .container .row div span a {color: #2d3036;}
    footer .container .row div p {color: #666;}
    footer .container .row div .inc {position: absolute; right: 0; top: 24px; width: 210px;}
    footer.gray {background-color: #515458}
    footer.gray .container .row div p {color: #b6b7b8;}
    footer.gray .container .row div span a {color: #ffffff;}
  











   /* carousel */
.media-carousel 
{
  margin-bottom: 0;
  padding: 0 40px 30px 40px;
  margin-top: 30px;
}
/* Previous button  */
.media-carousel .carousel-control.left 
{
  left: -12px;
  background-image: none;
  background: none repeat scroll 0 0 #222222;
  border: 4px solid #FFFFFF;
  border-radius: 23px 23px 23px 23px;
  height: 40px;
  width : 40px;
  margin-top: 30px
}
/* Next button  */
.media-carousel .carousel-control.right 
{
  right: -12px !important;
  background-image: none;
  background: none repeat scroll 0 0 #222222;
  border: 4px solid #FFFFFF;
  border-radius: 23px 23px 23px 23px;
  height: 40px;
  width : 40px;
  margin-top: 30px
}
/* Changes the position of the indicators */
.media-carousel .carousel-indicators 
{
  right: 50%;
  top: auto;
  bottom: 0px;
  margin-right: -19px;
}
/* Changes the colour of the indicators */
.media-carousel .carousel-indicators li 
{
  background: #c0c0c0;
}
.media-carousel .carousel-indicators .active 
{
  background: #333333;
}
.media-carousel img
{
  width: 250px;
  height: 100px
}
/* End carousel */






.col-centered {
  float: none;
  margin: 0 auto;
}

.carousel-control { 
  width: 8%;
  width: 0px;
}
.carousel-control.left,
.carousel-control.right { 
  margin-right: 40px;
  margin-left: 32px; 
  background-image: none;
  opacity: 1;
}
.carousel-control > a > span {
  color: white;
  font-size: 29px !important;
}

.carousel-col { 
  position: relative; 
  min-height: 1px; 
  padding: 5px; 
  float: left;
}

.carousel-inner > .item {}

.active > div { display:none; }
.active > div:first-child { display:block; }

/*xs*/
@media (max-width: 767px) {
.carousel-inner .active.left { left: -50%; }
.carousel-inner .active.right { left: 50%; }
.carousel-inner .next        { left:  50%; }
.carousel-inner .prev		     { left: -50%; }
.carousel-col                { width: 50%; }
.active > div:first-child + div { display:block; }
}

/*sm*/
@media (min-width: 768px) and (max-width: 991px) {
.carousel-inner .active.left { left: -50%; }
.carousel-inner .active.right { left: 50%; }
.carousel-inner .next        { left:  50%; }
.carousel-inner .prev		     { left: -50%; }
.carousel-col                { width: 50%; }
.active > div:first-child + div { display:block; }
}

/*md*/
@media (min-width: 992px) and (max-width: 1199px) {
.carousel-inner .active.left { left: -33%; }
.carousel-inner .active.right { left: 33%; }
.carousel-inner .next        { left:  33%; }
.carousel-inner .prev		     { left: -33%; }
.carousel-col                { width: 33%; }
.active > div:first-child + div { display:block; }
.active > div:first-child + div + div { display:block; }
}

/*lg*/
@media (min-width: 1200px) {
.carousel-inner .active.left { left: -20%; }
.carousel-inner .active.right{ left:  20%; }
.carousel-inner .next        { left:  20%; }
.carousel-inner .prev		     { left: -20%; }
.carousel-col                { width: 20%; }
.active > div:first-child + div { display:block; }
.active > div:first-child + div + div { display:block; }
.active > div:first-child + div + div + div { display:block; }
}

.block {
width: 306px;
height: 230px;
}

.red {background: red;}

.blue {background: blue;}

.green {background: green;}

.yellow {background: yellow;}

.pink {background: pink;}

.orange {background: orange;}

.gray {background: gray;}

.black {background: black;}

.lime {background: lime;}

.purple {background: purple;}
        
        
        
        
        
        
        
        
   /*************************sub**************************/   
.m-20 .section_title {padding-left: 21px; padding-bottom: 11px; font-size: 37px; color: #111111;}

.sub-video-thumb {overflow: hidden}
.sub-video-thumb .col-md-6 {padding: 0 20px; margin-bottom: 26px;}
.sub-video-thumb .col-md-6:nth-child(1), .sub-video-thumb .col-md-6:nth-child(3) {padding: 0 10px 0 20px;}
.sub-video-thumb .col-md-6:nth-child(2), .sub-video-thumb .col-md-6:nth-child(4) {padding: 0 20px 0 10px;}
.sub-video-thumb .col-md-6 a>div>img {width: 305px; height: 172px;}

.sub-video-thumb a>div>img {width: 295px; height: 166px; object-fit: cover;}
.sub-video-thumb a .tit-box { position: absolute; background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0.65) 60%, rgba(0, 0, 0, 0.75) 100%); width: 305px; z-index: 10; left: 20px; bottom: 0; padding: 30px 30px 15px 20px; font-size: 18px; font-weight: bold; color: #ffffff; line-height: 1.3;}
.sub-video-thumb a .tit-box>img {width: 57px !important; height: 23px !important; position: absolute; left: 20px; bottom: 65px}
.sub-video-thumb a .tit-box>img.icon-plus-sub {position: static; object-fit:contain; width: 21px !important}
.sub-video-thumb .col-md-6:nth-child(2) a .tit-box, .sub-video-thumb .col-md-6:nth-child(4) a .tit-box {left: 10px;}


/*기자 기사모음*/
.reporter-wrap h2 {font-size: 24px;}
.reporter-title {display: flex; align-items: center; padding: 20px 0 14px; margin-bottom: 30px;}
.reporter-title h3 {font-size: 35px;}
.reporter-title .pic {margin-right: 20px;}
.reporter-title .pic .img {display: block; width: 80px; height: 80px; border-radius: 50%; overflow: hidden; }
.reporter-title .pic .img img { width: 100%; height: 100%; object-fit: cover; }

.reporter-email {margin-left:30px; vertical-align: middle; float: right; }
.reporter-email a {display:inline-block; padding-top: 11px; padding-left: 7px; font-size: 15px; color: #5b90ae;}
.reporter-email svg {vertical-align: middle; color: #5b90ae;}

        
        
/*more 페이지*/
.category-article-header  {height: 200px; background-position: 0 0; background-repeat: no-repeat; margin-bottom: 20px; }
.category-article-header.feature-article {background-image: url('/images/renewal/bg_cate_01.jpg');}
.category-article-header.interview-article {background-image: url('/images/renewal/bg_cate_02.jpg');}
.category-article-header.technical-article {background-image: url('/images/renewal/bg_cate_03.jpg');}
.category-article-header h2 {padding: 75px 0 0 70px; margin-top: 0; font-size: 40px; font-weight: bold; color: #ffffff;}
        
        
        
        
        
        
        
  /*************************view**************************/
  .col-lg-9.col-md-9.section.view-23n {width: 950px; padding-right: 60px; padding-bottom: 50px; margin-top: 50px; border-right: 1px solid #cccccc;}
  .news_area.ps-10 {padding-left: 10px;}       
  .news_desc p, .news_desc div, .news_desc span {font-size: 18px; line-height: 1.7;}

  .thumbnail.news-23n h3 {margin: 0 0 10px 0; font-size: 33px; color: #111111;}
  .thumbnail.news p.date {font-size:15px;}

  .reporter-wrap {margin: 40px 0;}
  .reporter-info {display: flex;}
  .reporter-info .reporter-img {width: 48px; height: 48px; border-radius: 50%; margin-right: 12px; overflow: hidden;}
  .reporter-info .reporter-img img {width: 100%; height: 100%; border-radius: 50%; border: 1px solid #d5d5d5; background-color: #2eb272;}
  .reporter-info .mail {padding-top: 13px; font-size: 16px; font-weight: 500;}
  .reporter-info .mail span {padding-left: 10px; font-size: 14px; font-weight: normal; color: #666;}
  .reporter-info div:last-child {float: right;}
  .reporter-info .ms-auto {padding-top: 13px; }
  .reporter-info .ms-auto a, .reporter-info .ms-auto button {display:inline-block; width: 115px; text-align: center; padding: 3px 0; margin-right: 14px; border-radius: 30px; border: 1px solid #b2b2b2;}
  .ms-auto {margin-left: auto!important;}
  .reporter-info .ms-auto .all {color: #666666;}
  .reporter-info .ms-auto .report {border: 1px solid #eec59d; color: #665648; background-color: #fee9d4;}

  .comment_write3 .id {padding-left: 25px; padding-right: 10px; font-weight: 500; }
  .taComment3 {width:75%; height:50px; margin-bottom:0;}
  .btn_comment3 {height: 50px;}

  .h2-line {display: flex; border-bottom: 2px solid #000000; margin-bottom: 0; padding-bottom: 12px; font-weight: 600;}
  .h2-line .total {display: inline-block; padding-left: 10px;padding-top:8px; font-size: 17px; font-weight: 400; color: #777777;}
  .h2-line form {margin-left: auto;}

  .plus-desc {padding-bottom: 70px;}
  

  ul.main_news_list li.media .media-body h4.media-heading {font-weight: 500;}
  ul.main_news_list li.media .media-body p {font-size: 15px; color: #484848;}
  ul.main_news_list li.media .media-body p.date {padding-top: 10px;}
ul.main_news_list li.media .media-body p.icon-plus-small {margin-bottom: 4px; padding-left: 2px}
ul.main_news_list li.media .media-body p span.d-day {line-height: 1.7;font-size: 12px;color: #ffffff; display: inline-block;border-radius: 5px;background-color: #cc0000; padding: 0px 6px; margin: 0 6px 0 15px;font-weight: 500;vertical-align: top;}




  /*notice*/
  #cs-blist.notice {padding-bottom: 100px;}
  #cs-blist.notice h2 {border-bottom: none; margin-bottom: 0;}
  #cs-blist.notice table th {background-color: #fff; color: #1e82b9; font-size: 14px; font-weight: 500; border-top: 1px solid #1e82b9;}
  #cs-blist.notice table td {font-size: 14px; background-color: #fff; }
  #cs-blist.notice table td.date {text-align: left; padding-left: 30px; color: #676767;}
  #cs-blist.notice table td.hits {text-align: right; color: #676767;}
  #cs-blist.notice table .notice-title {font-size: 18px; text-align: left; font-weight: 500; background-color: #f1f1f1; padding-left: 30px;}
  #cs-blist.notice .text-left {padding: 30px;}
  #cs-blist.notice .btn-lg {padding-left: 30px; padding-right: 30px;}



  /*modal report*/
  #modalReport .modal-content {height: 570px;}
  #modalReport .modal-header {background-color: #000000; color: #ffffff; padding-bottom: 10px;}
  #modalReport .modal-header button.close {color: #ffffff; opacity: 1 !important; font-size: 22px; padding-right:3px; font-weight: 400;}
  #modalReport .modal-title {border-bottom: none; font-size: 24px; font-weight: 500;} 
  #modalReport .modal-body {width: 88%; margin: 50px auto 0 auto;}
  #modalReport .modal-body .form-group {display: flex;}
  #modalReport .modal-body .form-group label {width: 80px; font-weight: 400; font-size: 15px;}
  #modalReport .modal-body .form-group:nth-child(3) {height: 150px;}
  #modalReport .modal-body .form-group .form-control {border-radius: 0;}
  #modalReport .modal-footer {border-top: none; text-align: center;}
  #modalReport .modal-footer .btn {font-size: 17px; padding: 8px 30px; background-color: #2b76c2; border-color: #1e62a7;}

  .report_captcha {padding-left: 70px; margin: 10px 0;}
  





  /*****************************aside*******************************/
 .aside_cont.aside-23n {background-color: #ffffff; width: 300px;}

 .newsWebinar {width: 100%; float: none; padding-left: 0 !important; }


 .subscribe-23n {border: 1px solid #dedede; background-color: #fff; background-image: url(../images/renewal/subscribe_bg1.png), url(../images/renewal/subscribe_bg2.png); background-repeat: no-repeat, no-repeat; background-position: 0 bottom, 240px 19px;}
 .subscribe-23n .newsletter_title {padding-left: 23px; padding-top: 15px; padding-bottom: 5px; background-color: transparent; text-align: left; font-weight: 500; color: #000; font-size: 22px;}
 .subscribe-23n .newsletter_title span {margin-right: 5px; display: inline-block;}  
 .subscribe-23n .newsletter_email   {background-color: transparent; border: none;}
 .subscribe-23n .newsletter_email input {padding-left: 5px; height: 33px; line-height: 33px; border: 1px solid #dedede; vertical-align: middle;}
 .subscribe-23n .newsletter_email button {background-color: #e54d42; color: #ffffff;} 
 .subscribe-23n .newsletter_email p {margin-bottom: 10px;; color: #5b90ae; font-size: 14px; letter-spacing: -0.5px;}
 .subscribe-23n .newsletter_email .newsletter_link a {background: #5b90ae; margin: 8px auto;}

 .aside_cont.aside-23n .eewebinar {margin-top: 50px; margin-bottom: 50px;}
 .aside_cont.aside-23n .eewebinar .eewebinar_title {background: url("../images/renewal/aside_eewebinar_bg.jpg") no-repeat 0 0; background-size: cover; height: 51px; font-size: 20px; line-height:1.6;}
 .aside_cont.aside-23n .eewebinar ul {background-color: #fafafa;padding: 0;}
 .aside_cont.aside-23n .eewebinar ul li {border-bottom: 1px solid #e8e8e8; padding: 13px 10px; margin-bottom: 0; font-size: 15px; line-height: 1.5;}
 .aside_cont.aside-23n .eewebinar ul li a {display: block;}
 .aside_cont.aside-23n .eewebinar ul li img {width: 34%;}
 .aside_cont.aside-23n .eewebinar ul li span {width: 65%; padding-left: 4%; padding-top: 5px; letter-spacing: -0.5px;}

 
 .rank-list {margin-bottom: 65px; margin-top: 50px;}
 .rank-list ul {padding-left: 0;}
 .rank-list li {border-bottom: 1px solid #dedede; padding-top: 13px;}
 .rank-list li>a {display: flex;}
 .rank-list li .rank-badge {color: #1e82b9; font-size: 18px; line-height: 23px; font-weight: 500; padding: 0 12px 0 8px;}
 .rank-list li p {padding-bottom: 3px;}

 .out-banner.renew {width: 300px;}
        
        
        



























@media (max-width: 1399.98px) { 

 }





  @media (max-width: 1199.98px) { 
  .container{width: 100%;padding:0 0.5% 0 0.5%;}

  .col-lg-9.col-md-9.section.view-23n {width: 70%; padding-right: 0; margin-top: 40px; border-right: none;}

  .main-top-right .col-md-6 {width: 50%;}
  .main-top-right .col-md-6 a>img {width: 221px; height: auto;}

  .main-top-notice div {width: 100%;}

  .main-tab-news {padding-left: 0.5%; width:100%;}
  .main-tab-news .nav-tabs > li > a {font-size: 16px;}
  .main-tab-news-list ul li {width: 18.4%; margin-right: 20px;}
  .main-tab-news-list ul li p {padding-top: 5px;}

  .news-scene-list {width: 96%;}
  .news-scene-list ul li {width:18.4%; margin-right: 20px;}
  .news-scene-list ul li a>img {width: 100%;}
  .news-scene-list ul li p {padding-top: 5px;}

  .main-news-left .col-md-6 {width: 50%; padding: 0 0 0 20px;}
  .main-news-left .col-md-6 a>img {width: 100%;}

  .main-news-thumb a .icon-play {top: 116px; right: 13px;}


  .main-video-thumb a .tit-box {width: auto; left: 10px; width: 93%;}
  .main-video-thumb .col-md-6:nth-child(1), .main-video-thumb .col-md-6:nth-child(3) {padding: 0 10px;}
  .main-video-thumb .col-md-6:nth-child(2), .main-video-thumb .col-md-6:nth-child(4) {padding: 0 20px 0 0;}
  .main-video-thumb .col-md-6:nth-child(2) a .tit-box, .main-video-thumb .col-md-6:nth-child(4) a .tit-box {left: 0;}
  .main-video-thumb .col-md-6 a {width: 100%;}
  .main-video-thumb .col-md-6 a>div>img {width: 100%;}

 .main-make-article-list {width: 98%; margin: 0 auto;}
  .main-make-article-list .col-md-3 div {padding: 0 10px;}



  /*sub*/
  .container.main-banner-wrap {padding: 0 0 0 0;}
  .news_desc p, .news_desc div, .news_desc span {font-size: 16px;}

  .main-video {padding: 0 10px 0 20px;}
  .main-video a>div>img {width: 100%;}

  .sub-video-thumb a .tit-box {width: auto; left: 10px; width: 93%;}
  .sub-video-thumb .col-md-6:nth-child(1), .sub-video-thumb .col-md-6:nth-child(3) {padding: 0 10px;}
  .sub-video-thumb .col-md-6:nth-child(2), .sub-video-thumb .col-md-6:nth-child(4) {padding: 0 20px 0 0;}
  .sub-video-thumb .col-md-6:nth-child(2) a .tit-box, .sub-video-thumb .col-md-6:nth-child(4) a .tit-box {left: 0;}
  .sub-video-thumb .col-md-6 a {width: 100%;}
  .sub-video-thumb .col-md-6 a>div>img {width: 100%;}

  .pe-20 {padding-right: 10px !important;}
  .ps-20 {padding-left: 10px !important;}






  /*aside*/
  .aside_cont.aside-23n {width: 29%; margin-top: 0;}


 }







@media (min-width: 768px) and (max-width: 991.98px) { 
  .container{width: 100%; padding:0 0.5% 0 0.5%;}
  .row.m-20 {width: 98%; margin: 0 auto;}

  .main-tab-news {width: 96%; margin: 40px auto 10px auto; padding-left: 0;}

  .h2-line {display: block;font-size: 26px;}
  .h2-line form {display: flex;  margin-top: 3%;}
  .h2-line form input {margin-left: 1%;}

  .main-top-left {padding: 30px 0 0 0;}

  .main-top-right {overflow: hidden; margin-top: 50px;}
  .main-top-right .col-md-6 {width: 50%; padding: 0 15px; float: left;}
  .main-top-right .col-md-6 a>img {width: 100%; height: 180px;}
  .main-top-right .col-md-12 {float: left; width: 100%;}
  .main-top-thumb {height: 290px;}

  .main-tab-news-list ul li {margin: 0 10px; width: 17.3%;}
  .main-tab-news-list ul li a>img {height: 86px;}
  .main-tab-news .nav-tabs > li > a {padding: 8px 15px; font-size: 16px; word-break: keep-all;}
  .main-tab-news .nav-tabs > li:last-child > a {padding: 4px 15px 12px 15px;}

  .main-banner-wrap img {margin: 20px auto;}
  .ps-20 {padding-left: 0 !important;}
  .pe-20 {padding-right: 0 !important;}

  .main-news-left {overflow: hidden;}
  .main-news-left .col-md-6 {width: 50%; padding: 0 15px; float: left;}

  .main-news-right {padding-left: 0;}

  .main-news-thumb a .icon-play {right: 32px;}
  

  .news-scene-list {width: 100%;}
  .news-scene-list ul li {margin: 0 10px; width: 17.3%;}
  .news-scene-list ul li a>img {height: 86px;}
  .news-scene-list ul li .icon-play {right: 0; top: 51px;}
  .news-scene-list ul li .icon-play img {width: 27px; height: 27px;}

  .main-video {padding: 0 15px !important;}
  .main-video-thumb {overflow: hidden; margin-top: 40px;}
  .main-video-thumb .col-md-6 {width: 50%; padding: 0 15px !important; float: left;}
  .main-video-thumb a .tit-box {width: 92%; left: 15px;}
  .main-video-thumb .col-md-6:nth-child(2) a .tit-box, .main-video-thumb .col-md-6:nth-child(4) a .tit-box {left: 15px;}


  .container-main-bottom .container {width: 94%;}
  .container-main-bottom .webinar-list {padding-left: 0; margin-top: 60px;}
  .container-main-bottom .webinar-list li {padding: 0 50px 30px 0;}
  .container-main-bottom .webinar-list .media-right {padding-left: 7px;}


  .e4ds-make.row.m-20 h2 {padding-left: 0;}
  .main-make-article-list {width: 100%;}
  .main-make-article-list .col-md-3 div {padding: 0 0 0 0;}
  .main-make-article-list .col-md-3 div .contest-list-text {height: 45px;}
  .main-make-article-list .col-md-3 div a span {color: #ffffff;}
  .main-make-article-list .col-md-3 div a span.project_icon.contest {display: block; padding: 7px 0;color: #00b8bb;}
  .main-make-article-list .col-sm-6 {padding: 0 10px;}



/*sub*/
.col-lg-9.col-md-9.section {width: 71%; padding-bottom: 60px;}

ul.main_news_list li.media .media-body p.date {padding-top: 10px;}

.e4ds-news-list .nav-tabs > li {width: 20%; text-align: center;}
.e4ds-news-list .nav > li > a {background-color: #fff; padding: 10px 0;}

.reporter-title h3 {font-size: 26px;}



    /*aside*/
  .out-banner {width: 100% ;}

  .rank-list li p {font-size: 15px;}



 }









@media screen and (max-width: 767.98px) { 

  /*main*/
  .main-tab-news .container {padding: 0 0 0 0;}
  .main-tab-news .nav-tabs {border-bottom: none;}
  .main-tab-news .nav-tabs > li {width: 33.3333%; margin-bottom: 20px;}
  .main-tab-news .nav-tabs > li > a {padding: 17px 24px 12px 24px; font-size: 15px; word-break: keep-all; line-height: 1.4; text-align: center; height: 61.59px;} 
  .main-tab-news .nav-tabs > li.active a:after {bottom: -9px;}

  .main-tab-news-list ul {overflow: hidden; width: 94%; margin: 0 auto;}
  .main-tab-news-list ul li {float: none; margin-right: 0; width: 100%; padding-bottom: 30px;}
  .main-tab-news-list ul li a>img {width: 100%; height: 220px;}
  .main-tab-news-list ul li p {padding-top: 5px;}
  .main-tab-news-list a.more {position: absolute; right: 14px; top: -40px;}

  .row.m-20 {margin: 0 !important;}
  .row.m-20 h2 {padding-left: 11px;}
  .row.m-20 h2 a {right: 10px;}

  .main-top-left {padding:0 10px 70px 10px;}
  .main-top-left  a>img {width: 100%; height: 220px;}
  .main-top-right .col-md-6 {width: 100%; padding: 0 10px;}
  .main-top-right .col-md-6 a>img {width: 100%; height: 220px;}
  .main-top-thumb {height: 310px;}
  .main-top-thumb a span {top: 170px;}

  .main-tab-news .nav-tabs {width: 98%; margin: 0 auto;}
  
  .main-top-headline {padding-top: 3rem;}

  .main-top-notice {margin-top: 40px;}
  .main-top-notice div {width: 100%; height: 85px; padding:30px 0 6px 0; margin: 0 auto; padding-left: 15px;}
  .main-top-notice div .tit { left: 15px; top: 15px; font-size: 14px;} 
  .rolling {height:54px;}
  .rolling li {position: relative; line-height: 50px; padding: 10px 0;}
  .rolling li a {display: block; width: 90%; font-size: 14px; line-height: 1.5; color: #434343; }
  .rolling li a span {position: absolute; right: 23px; top: 13px; color:#999999;}

  .main-banner-wrap .col-md-6.pe-20 {padding-right: 0 !important;/* margin-bottom: 50px;*/}
  .main-banner-wrap .col-md-6.ps-20 {padding-left: 0 !important;}
  .main-banner-wrap a {height: 105px;}
  .main-banner-wrap img {height: auto !important;}

  .main-news-left .col-md-6 {width: 100%; padding: 0 10px;}
  .main-news-left .col-md-6 a>img {width: 100%; height: 220px;}

  .main-news-right {padding-left: 1px; /*width: 92%;*/}
  .main-news-right ul {padding-left: 13px;}

  .main-news-thumb {height: 300px; margin-bottom: 10px;}
  .main-news-thumb a .icon-play {top: 167px; right: 39px;}
  
  .news-scene-list {width: 94%; margin: 0 auto;}
  .news-scene-list ul li {width: 100%; float: none; margin-right: 0; height: 300px;}
  .news-scene-list ul li a>img {width: 100%; height: 220px;}
  .news-scene-list ul li p {padding-top: 9px;}
  .news-scene-list ul li .icon-play {top: 167px; right: 19px;}

  .news-scene {margin-top: 40px;}

  .main-video {padding: 0 10px; margin-bottom: 40px;}
  .main-video a {height: 230px;}
  .main-video a>div>img {width: 100%; height: 230px;}
  .main-video-thumb .col-md-6 {padding: 0 10px !important;}
  .main-video-thumb a>div>img {width: 100%; height: 220px;}
  .main-video-thumb a .tit-box {width: 100%; left: 10px; width: 95%;}
    .main-video .tit-box {font-size: 21px}
    .main-video .tit-box>img {bottom: auto; top: 30px}
  .main-video-thumb .col-md-6:nth-child(2) a .tit-box, .main-video-thumb .col-md-6:nth-child(4) a .tit-box {left: 10px;}

  .container-main-bottom {padding: 0 10px;}
  .container-main-bottom .container {width: 100%;}
  .container-main-bottom .webinar ul li a {font-size: 15px;}

  .container-main-bottom .webinar-list {padding-left: 0 !important; margin-top: 60px;}
  .container-main-bottom .webinar-list li {width: 100%; float: none; padding: 0 0 30px 10px;}
  .container-main-bottom .webinar-list li a {font-size: 15px;}
  .container-main-bottom .webinar-list .media-object {width: 135px; height: 77px;}

  .e4ds-make.row.m-20 {padding-bottom: 80px;}
  .e4ds-make.row.m-20 h2 {padding-left: 0;}
  .main-make-article-list .col-md-3 div {padding: 0;}



/*sub*/
  .col-lg-9.col-md-9.section.view-23n {width: 100%; padding-right: 0; margin-top: 40px; border-right: none;}

  .h2-line {display: block;font-size: 26px;}
  .h2-line form {display: flex;  margin-top: 3%;}
  .h2-line form input {margin-left: 1%;}

  ul.main_news_list li.media a {padding-bottom: 3px;}
  ul.main_news_list li.media .media-body h4.media-heading {font-size: 16px;}
  ul.main_news_list li.media .media-body p {font-size: 14px;}

  .e4ds-news-list .nav-tabs > li {width: 20%; text-align: center;}
  .e4ds-news-list .nav > li > a {background-color: #fff; padding: 10px 0;}
  .e4ds-news-list .nav.nav-tabs {padding-bottom: 1px;}
  .e4ds-news-list .nav-tabs > li.active > a,  .e4ds-news-list .nav-tabs > li.active > a:hover,  .e4ds-news-list .nav-tabs > li.active > a:focus {border-right: none; border-left: none;}

  .social-cluster .social-cluster-list {margin-right: 25px;}

  .thumbnail.news-23n h3 {font-size: 22px; line-height: 130%;}
  .news_desc p, .news_desc div, .news_desc span {font-size: 14px;}

  .col-md-6.sub-video-thumb .col-md-6  {height: 172px;}
  .sub-video-thumb .col-md-6:nth-child(2), .sub-video-thumb .col-md-6:nth-child(4) {padding: 0 10px;}
  .sub-video-thumb a .tit-box {width: 95%;}
  .sub-video-thumb .col-md-6:nth-child(2) a .tit-box, .sub-video-thumb .col-md-6:nth-child(4) a .tit-box {left: 10px;}

  .reporter-info {position: relative;padding-bottom: 37px;}
  .reporter-info .mail {padding-top: 8px;}
  .reporter-info .mail span {padding-left: 0;}
  .reporter-info .ms-auto {padding-top: 0; position: absolute; right: 0; bottom: 0;}
  .reporter-info .ms-auto a, .reporter-info .ms-auto button {margin: 3px 10px 3px 0; vertical-align: baseline;}

  .report_captcha {padding-left: 0; float: right; margin: 10px auto 20px auto;}

  .reporter-wrap ul.main_news_list li.media .media-body {padding-left: 1%;}
  .reporter-wrap .social-cluster .social-cluster-list { margin-right: 0;}
  .reporter-wrap .social-cluster .social-cluster-list li {width: auto;}

  .reporter-title {display: block;}
  .reporter-title .pic {display: inline-block; float: left;}
  .reporter-title h3 {display: inline-block; font-size: 25px;}
  
  .reporter-email {margin-left: 0; float: left;}
  .reporter-email a {padding-top: 0;}

  .category-article-header {height: 110px;}
  .category-article-header h2 {padding: 38px 0 0 25px; font-size: 32px;}
  .category-article-header.feature-article {background-size: cover; background-position: top;}


  /*notice*/
  #cs-blist.notice table td img {max-width: 100%; height: auto !important;}
  #cs-blist.notice .text-left {padding: 30px 10px;}




  /*aside*/
  .rank-list {margin-top: 50px;}






  .pagination>li>a {font-size: 12px;}

  
  footer .container .row div span a {padding: 4px 14px;}
  footer .container .row div .inc {position: absolute; right:auto; left: 50%; top: auto; bottom: -54px; width: 160px;padding: 0; margin: 0 0 0 -80px;}



 }



 @media (max-width: 575.98px) {

  .news_area.ps-10 {padding-left: 0;}

  .GoogleCreativeContainerClass a img {width: 100%  !important; height: auto !important;}

 }



