/* ================ main ================ */
/*header
.header_area {background:none; width:100%; height:100px; border-bottom:1px solid  rgba(255, 255, 255, .3); z-index:1000;
  position: fixed; top: 0; transition: 0.2s;}
.nav{position: fixed; background-color: rgba( 0, 0, 0, 0.8 );}
.nav_area{position:relative;top:28px;  max-width:1280px; margin:0 auto;  }
.logo2021{position:relative; top:5px}
.m_searchmenu_area{position:relative; right:0; }
.m_topr_search {position: absolute; right: 25px; top: -48px; display: inline-block; }
.m_topr_menu{position: absolute; display: inline-block; float: right; top: -25px; right: 0;}
*/

  /*header*/
  .header_area{position:fixed; top:0; left:0; background:rgba(255,255,255,.9); width:100%; height:100px; border-bottom:1px solid rgba(0,0,0,.08); z-index:1000; transition:.2s}
  .nav_area{position:relative; max-width:1280px; margin:0 auto}
  .logo2021{display:block; position:absolute; width:127px; height:38px; top:33px; left:0}
  .logo2021 svg{width:100%; height:100%; fill:#019f92}
  .m_searchmenu_area{position:absolute; top:38px; right:0; font-size:0}
  .m_topr_search, .m_topr_menu{display:inline-block; vertical-align:middle; position:relative; cursor:pointer;}
  .m_topr_search{margin-right:38px}
  .search_bar .icon{display:block; width:26px; height:26px; padding-left:20px; z-index:1}
  .search_bar .icon svg{width:100%; height:100%; fill:#000}
  .search_bar input#q{position:absolute; top:-5px; right:46px; width:0; height:36px; background:transparent; border-bottom:1px solid rgba(0,0,0,.9); font-size:17px; font-weight:400; color:#000; transition: width .55s ease}
  .search_bar input#q:focus, .search_bar input#q:active, .search_bar:hover input#q{width:250px}
  .m_topr_menu{width:26px; height:26px}
  .m_topr_menu svg{width:100%; height:100%; fill:#000}
  .header_area.header_2021{background:transparent; border-bottom:1px solid rgba(255,255,255,.2)}
  .header_area.header_2021 .logo2021 svg, .header_area.header_2021 .search_bar .icon svg, .header_area.header_2021 .m_topr_menu svg{fill:#fff}
  .header_area.header_2021 .search_bar input#q{border-bottom:1px solid rgba(255,255,255,.9); color:#fff}
  /* change */
  .header_area.header_2021.nav{background:rgba(1,159,146,.9)}


/*menu*/
.overlay {height: 100%; width: 0; position: fixed; z-index: 1; top: 0; right: 0; background-color:rgba(1,159,146, 0.95); overflow-x: hidden; transition: 0.5s;}
.overlay-content {display: block; position: relative; top: 12%; width: 100%; text-align: left; margin-top: 20px; margin-left: 82px;transition: 0.3s;}
.overlay a { line-height: 85px;   position:relative; display:inline-block; padding: 8px; text-decoration: none; font-size: 60px; color: #fff; font-weight: 500; border-bottom:3px solid transparent; transition:.2s}
.overlay-mycontent {margin-top: 40px;}
.overlay-mycontent a{  font-size: 18px; line-height: 35px; display: block; font-weight: 400; }

.overlay-content > ul li a:after{position:absolute; content:""; display:block; height:3px; width:150px; background:rgba(255,255,255,0); bottom:10px; left:0; transition:.2s}

.overlay-content > ul li a:hover:after, .overlay-content li a:focus:after{width:100%; background:rgba(255,255,255,1)}

.overlay .closebtn {border: none !important; position: absolute; top: 5px; left: 20px; font-size: 140px; font-weight: 100;}


/*main_banner_slide*/
.header_area .swiper-container {width: 100%; height: 100%; }
.swiper-container .swiper-pagination-bullets {bottom:40px !important;  }
.swiper-container .swiper-pagination-bullet {width: 10px !important; height: 10px !important; display: inline-block; border-radius: 100%;
 background: #fff !important; opacity: 0.5 !important; }
.swiper-container .swiper-pagination-bullet-active { opacity: 0.9 !important; background: #fff !important;}
.swiper-container .swiper-button-next,
.swiper-container .swiper-button-prev { position: absolute; top: 50%; width: 70px !important; height: 70px !important; margin-top: -22px; z-index: 10; cursor: pointer; background-size: 54px 24px !important; background-position: center; background-repeat: no-repeat}
.swiper-container .swiper-button-next {background-image: url(//static.heraldcorp.com/wbazic/heraldeco/images/main_slide_arrow_r.png)!important; right: 130px; left: auto;}
.swiper-container .swiper-button-prev {background-image: url(//static.heraldcorp.com/wbazic/heraldeco/images/main_slide_arrow_l.png)!important; left: 130px; right: auto;}
.swiper-container.slider1 .swiper-button-prev:after,
.swiper-container.slider1 .swiper-button-next:after {display:block; content:""; position:absolute; width:67px; height:67px; background:transparent; border-radius:50%; transition:.2s}
.swiper-container.slider1 .swiper-button-prev:after{left:0}
.swiper-container.slider1 .swiper-button-next:after{right:0}
.swiper-container .swiper-button-next:hover:after, .swiper-container .swiper-button-prev:hover:after{background:rgba(255,255,255,.2);}
.swiper-container .swiper-button-prev:hover:after{left:-17px}
.swiper-container .swiper-button-next:hover:after{right:-17px}


.main_banner_area{position:relative; background:#000; width:100%;}
.main_banner_slide_area { height:900px; font-size:0}
.main_banner_slide_img{max-width:100%; height:900px;  text-align:center;}
.main_txt_box{opacity: 1; width:800px; position:absolute; bottom:90px;left:50%; transform:translate(-50%, -50%); text-align: center; color: #fff; z-index: 5; line-height: 60px; font-size:20px; }
.Heco_forum { text-shadow: 0 0 4px rgba(0, 0, 0, 0.16); font-family: Montserrat; font-size: 20px; font-weight: 500; font-style: normal; line-height: 64px; letter-spacing: normal; text-align: center; color: #019f92;}
.main_slide_txt {text-shadow: 0 0 4px rgba(0, 0, 0, 0.16); font-family: Montserrat; font-size: 66px; font-weight: 600; line-height: 75px; text-align: center; color: #ffffff;}
.main_slide_txt2 {text-shadow: 0 0 4px rgba(0, 0, 0, 0.16); font-family: 'Noto Sans'; font-size: 25px; font-weight: 500; line-height: 17px; text-align: center; color: #ffffff; margin-top:28px}
.main_slide_txt3{text-shadow: 0 0 4px rgba(0, 0, 0, 0.16); font-family: Montserrat; font-size: 24px; font-weight: 300; text-align: center; color: #ffffff;}
.main_slide_more {display:inline-block; vertical-align:top; font-family: Montserrat; font-size: 16px; font-weight: 400;  line-height:0; margin-top:33px}
.more_b_line {position:relative; width:64px; height:3px; margin:20px auto 0; background-color:#019f92; transition:.2s}
.main_slide_more:hover .more_b_line{width:100px}

/*main_ecoforum_area*/
.main_ecoforum_area {width:100%; position: relative; display:block; height:805px; background: url(//static.heraldcorp.com/wbazic/heraldeco/images/bg_mr2.jpg) 10% 150px no-repeat;}
.main_ecoforum_area_l,.main_ecoforum_area_r{float:left;}
.main_ecoforum_area_l {width:440px;  height:300px; position: absolute; top:230px; left:50%; margin-left:-640px}
.main_ecoforum_area_l .t1{ font-family: Montserrat; font-size: 66px; font-weight: 600; line-height: 0.48; letter-spacing: -0.66px; color: #000000; text-align: left;position:relative; left:-3px}
.main_ecoforum_area_l .t2{font-family: Montserrat; font-size: 16px; font-weight: 400;  margin-top:43px; color:#696969}
.main_ecoforum_area_l .t2_line {position:relative; left:0; width:64px; height:3px; margin-top:15px; background-color:#019f92; }
.main_ecoforum_area_l .t3{margin-top:43px; width: 385px; font-size: 20px;
  font-weight: 300; line-height: 1.8; text-align: left; color: #555555;}
.main_ecoforum_area_r2{position: absolute; top: 130px; left: 50%; margin-left: -200px; right: 5px; overflow: hidden; }/**/
.main_ecoforum_area_r {width:100%;  position: relative;}
.main_ecoforum_area_r .swiper-container2{width:100%; position: relative; }
.main_ecoforum_area_r .swiper-container2 .swiper-slide{transition:.2s; width:auto;  margin:0; align-self: flex-end;}
.swiper-container2.slide2 { position: absolute; bottom:0; display: inline-block;}
.main_bg_speaker{width: 437px;  padding-bottom: 67%; position: relative; overflow: hidden; }
.main_bg_speaker .b_bg{z-index: 1;  width:436px; height: 294px; position: absolute;  background-color: rgba( 0, 0, 0, 0.5 );}
.main_bg_speaker img{width: 100%; height: 100%; position: absolute;
    top: 0; left: 0;}
.main_bg_speaker:after {transition:.2s; position: absolute; content: "";
    top: 0; left: 0; right: 0; bottom: 0; border: 15px solid rgba(1,159,146,0); z-index: 1;}
.main_speaker_name{opacity: 0; font-family: Montserrat; font-size: 30px; font-weight: 600; line-height: 1.07; letter-spacing: -0.3px; text-align: right; color: #000000; margin-top: 25px}
.swiper-container2 .swiper-slide-active .main_speaker_name{opacity: 1}
.swiper-container2 .swiper-slide-active .b_bg{opacity: 0}
.swiper-container2 .swiper-slide-active .main_bg_speaker:after{border:15px solid #019f92}
.swiper-container2 .swiper-slide-active img{width: 100%; height: 100%; }
.swiper-container2 .swiper-slide-active .main_bg_speaker{ /* width: 625px; */ }
.swiper-button_area2{width: 625px;  margin-top: 75px; height: 50px; }
.swiper-container2 .swiper-button-next2, .swiper-button-prev2{cursor: pointer;}
.swiper-container2 .swiper-button-next2 {background-image: url(//static.heraldcorp.com/wbazic/heraldeco/images/main_slide_arrow_r2.png)!important; width: 44px!important; height: 42px!important;   float: right;position: relative;}
.swiper-container2 .swiper-button-prev2 {background-image: url(//static.heraldcorp.com/wbazic/heraldeco/images/main_slide_arrow_l2.png)!important; width: 44px!important; height: 42px!important;   float: left; position: relative;}
.swiper-container2 .swiper-pagination-progressbar {width: 280px; height: 4px; position: absolute; left: 53px; bottom: 28px;}
.swiper-container2 .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
        background: #696969;}
.swiper-container2 .swiper-pagination-progressbar {
    background: rgba(0, 0, 0, 0.1);}
.pagination_num{position: absolute; left: 368px; bottom: 16px; font-size: 30px; color:#696969; font-weight: 200}
.pagination_num span{margin:0 20px}
.pagination_num .on{font-weight: 500}
.pagination_num  .pause{position: relative;top:0px; left:-20px;   }
.pagination_num  .pause img{margin:5px}

/*main_news_area*/
.main_news_area {position: relative;  height: 828px; background: url(//static.heraldcorp.com/wbazic/heraldeco/images/main_news_bg.jpg) center center no-repeat; background-size:cover; overflow:hidden;}
.main_news_area_tit{width:846px; margin:111px auto 44px}
.news_t1{display:block; font-family: Montserrat; font-size: 66px; font-weight: 600; letter-spacing: -0.66px; text-align: left; color: #000000;}
.main_news_area_tit a{display:block; width:150px}
.news_t2{display:block; font-family: Montserrat;   font-size: 16px; font-weight: 500; #696969; margin-top:30px; color:#666}
.news_t3{display:block; font-size: 0; height:3px;  background-color:#019f92; width:64px; margin-top:16px; transition:.2s}
.main_news_area a:hover .news_t3, .m_video_area_tit a:hover .news_t3{width:97px}

.swiper-container3 {width:100%; height:100%;}
.slide3{width:844px; height:422px; position:relative; margin:0 auto}
.slide3 .swiper-slide .b_bg{z-index: 1;  width:436px; height: 294px; position: absolute;  background-color: rgba( 0, 0, 0, 0.5 );}
.slide3 .swiper-slide {transition:.2s; width:776px !important;height: 294px;  margin:0; align-self: center; z-index:0}
.slide3 .slide3_box1{width:437px; margin:0 auto}
.slide3 .swiper-slide .slide3_box_img {width: 437px;  height: 294px; position: relative; transition:.2s}
.slide3 .swiper-slide .slide3_box_img img{width: 100%; height: 100%; position: absolute; top: 0; left: 0;}
.slide3 .swiper-slide-active{width:846px !important; margin-left:-35px; z-index:1; margin-right:-35px}
.slide3 .swiper-slide-active .slide3_box1{width:auto; margin:0 auto}
.slide3 .swiper-slide-active .slide3_box_img { width: 625px; height:422px }
.slide3 .swiper-slide-active .b_bg{opacity: 0}
.slide3 .swiper-slide-active .slide3_txtbox{opacity:1;}
.slide3 .swiper-slide-active .slide3_box1 {position: relative; top:-64px;}
.swiper-button_area3{width:1026px; position: absolute; top:198px; left:50%; margin-left:-513px}
.swiper-button_area3 .swiper-button-next3 {background-image: url(//static.heraldcorp.com/wbazic/heraldeco/images/main_slide_arrow_r3.png)!important; right:0; z-index: 1000}
.swiper-button_area3 .swiper-button-prev3 {background-image: url(//static.heraldcorp.com/wbazic/heraldeco/images/main_slide_arrow_l3.png)!important; left:0;  z-index: 1000}
.swiper-button_area3 .swiper-button-next3, .swiper-button_area3 .swiper-button-prev3 { position: absolute; top: 50%; width: 70px !important; height: 70px !important;
 margin-top: -22px; z-index: 10; cursor: pointer; background-size: 54px 24px !important; background-position: center;
 background-repeat: no-repeat; }

.slide3 .swiper-button-prev3:after,
.slide3 .swiper-button-next3:after {display:block; content:""; position:absolute; width:67px; height:67px; background:transparent; border-radius:50%; transition:.2s}
.slide3 .swiper-button-prev3:after{left:0}
.slide3 .swiper-button-next3:after{right:0}
.slide3 .swiper-button-next3:hover:after, .slide3 .swiper-button-prev3:hover:after{background:rgba(0,0,0,.2);}
.slide3 .swiper-button-prev3:hover:after{left:-17px}
.slide3 .swiper-button-next3:hover:after{right:-17px}

.slide3_txtbox {opacity:0; position:absolute; top:65px;left:408px; width:436px; height:294px;  padding: 37px 63px 40px 40px; box-shadow: 2.5px 4.3px 10px 0 rgba(0, 0, 0, 0.2); border: 1px solid #019f92; background-color: #ffffff; box-sizing:border-box; z-index:3; transition:.2s;}

.slide3_txtbox .t1{font-size: 26px; font-weight:500; line-height: 1.38; letter-spacing: normal;  max-height:67px; -webkit-line-clamp: 2; display: -webkit-box;  text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; word-wrap: break-word; }
.slide3_txtbox .t2{opacity: 0.5; margin-top: 25px; font-size: 16px: font-weight:200; font-stretch: normal; max-height:50px; line-height: 1.63; letter-spacing: normal; -webkit-line-clamp: 2; display: -webkit-box;  text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; word-wrap: break-word;}
.slide3_txtbox .t3{width:44px; height: 44px; box-sizing: border-box;margin-top: 25px; border: solid 1px #019f92; background-color: #fff; color:#019f92; font-size: 40px; text-align: center;font-weight: 100; transition:.2s}

.slide3 .slide3_box1:hover .slide3_txtbox{background-color:#019f92; color: #fff !important}
.slide3 .slide3_box1:hover .slide3_txtbox .t3{border-color:#fff; color:#fff; background:#019f92}

/*
.slide3 .swiper-slide-prev{margin-right:42px; margin-left:-148px}
.slide3 .swiper-slide-next{margin-left:265px}
*/

/*main video*/
.main_video_area{width:100%; height:1009px; position: relative;display: block; background: url(//static.heraldcorp.com/wbazic/heraldeco/images/bg_video.jpg) 10% 600px no-repeat; }
.m_video_area_tit {width:215px; height:130px; position: absolute; top:250px; left:50%; margin-left: 232px; z-index:1}
.swiper-container4{width:1280px; height:777px; overflow: hidden;}
.slide4{width:1280px; height:777px; position: relative; top:120px; left:50%; margin-left:-640px; overflow: hidden; z-index:0}
.slide4_box{clear:both;}
.slide4_box_img{float:left; width: 437px;  height: 292px; position: relative; transition: .3s; cursor: pointer; overflow:hidden;}
.slide4_box_img img{width: 100%; height: 294px; position: absolute;
    top: 0; left: 0;}
.slide4 .slide4_box_img:after {transition:.2s; position: absolute; content: "";
  top: 0; left: 0; right: 0; bottom: 0; border: 15px solid rgba(1,159,146,0); z-index: 1;}
.slide4_box_img .play_bg {opcity:0;}
.slide4_box_img .b_bg{z-index: 1;  width:437px; height: 294px; position: absolute;  background-color: rgba( 0, 0, 0, 0.5 );}
.slide4_txtbox{opacity: 0; float:left; width:390px; }
.slide4_txtbox p{font-size:26px; line-height:36px; max-height: 108px;    -webkit-line-clamp: 3; display: -webkit-box; text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; word-wrap: break-word; font-weight:500}
.slide4_txtbox ul{margin-top:35px; }
.slide4_txtbox li{display: inline-block; padding:14px 16px; background-color: #f5f5f5 ;color:696969; font-size:14px; font-weight: 200;  margin-right: 10px}
.slide4 .swiper-slide-active{left:140px; top:-153px}
.slide4 .swiper-slide-active .slide4_txtbox{opacity: 1; position: relative; top:155px; left:107px}
.slide4 .swiper-slide-active .b_bg{opacity: 0}
.slide4 .swiper-slide-active .play_bg {opacity:1;  z-index: 1; width: 84px; height: 84px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.slide4 .swiper-slide-active .slide4_box_img {z-index: 100; width: 625px; height:423px }
.slide4 .swiper-slide-active .slide4_box_img img{width:100%; height:calc(100% - 1px)}
.slide4 .swiper-slide-active .slide4_box_img:after{border:15px solid #019f92}
.slide4 .swiper-slide-next {left:395px; top:-104px}
.slide4 .swiper-slide-prev {top:0}
.swiper-container4.swiper-container-vertical > .swiper-pagination-bullets {right: 400px !important; top: 730px !important;}
.slide4 .swiper-pagination-bullet-active { opacity: 1; background: #019f92;}

/*main_btbanner_area*/
.main_btbanner_area{width:100%; height:408px; position: relative;display: block; margin:0px 0; }
.main_btbanner_img{height:408px; text-align: center; padding-top: 103px; box-sizing: border-box; font-size: 26px; font-weight: 300; color:#fff}
.main_btbanner_img p{margin-top: 32px}
.main_btbanner_img .qu{margin-top: 64px; font-size:18px; font-weight:200; letter-spacing: normal;}
.main_btbanner_img .qu_b_line{margin:18px auto 0; width:64px; height:3px;  background-color:#019f92; transition:.2s}
.main_btbanner_area:hover .main_btbanner_img .qu_b_line{width:82px}

/*main_bt_weface
.main_bt_weface { width:100%; margin:120px 0;  position: relative;  animation: we-ani 10s ease-in 0.1s infinite alternate; }
@keyframes we-ani {
  0% {left:-60%;}
  100% {left:50%;}
}
@-webkit-keyframes we-ani {
  0% {left:-60%;}
  100% {left:50%;}
}
@-moz-keyframes we-ani {
  0% {left:-60%;}
  100% {left:50%;}
}
@-ms-keyframes we-ani {
  0% {left:-60%;}
  100% {left:50%;}
}
@-o-keyframes we-ani {
  0% {left:-60%;}
  100% {left:50%;}
}
*/


.main_bt_weface{position:relative; overflow:hidden; padding:100px 0}
.main_bt_weface img{width:920px; animation:InfoObj 10s linear infinite; display:inline-block; white-space:nowrap; padding-left:100%}
@keyframes InfoObj {
  from   { transform: translate(0%);}
  to { transform: translate(-100%);}
}
.main_bt_weface img:after{content:""; white-space:nowrap;}

/*footer*/
.f_fb{border-top: 1px solid #2f2f2f; width: 100%; clear: both;  font-size: 12px; color:#767676; margin-top:40px; display: inline-block;}
.f_fb_wrap{position: relative; max-width: 1280px; margin: 0 auto; padding-top: 43px;  letter-spacing: 1px }
.f_fb_l{float:left}
.f_fb_r{float:right}
.header_sns22 {letter-spacing: 2px; font-family: 'Montserrat'; font-size: 12px; color: #767676; text-align: right;
    line-height: 20px; position: relative; top: 45px;}
.footer_l_li1 li a{font-size:13px !important; }
.footer_l_bottom span{font-size:13px !important; letter-spacing: 1px !important}



/*subtop*/
.subtop_bg{width:100%; height:600px; position:relative;; display: block;}
.subtop_bg_area{max-width: 1280px; height:600px; margin:0 auto}
.subtop_title {font-size: 70px; font-family: 'Montserrat'; font-weight:600;color:#fff; position: absolute; bottom:270px;
 }
.subtop_map{font-size: 18px; color:#fff; font-weight:200; position: absolute; bottom:100px; padding-bottom:24px; border-bottom: 1px solid rgba(255,255,255,0.7)}
.subtop_map .location a{padding:0 10px}
.subtop_map .location span{width:15px;padding-left:18px;  background: url(//static.heraldcorp.com/wbazic/heraldeco/images/bg-location-home.png) no-repeat left center;)}
.subtop_map .location .on{border-bottom: 3px solid #019f92; padding-bottom:20px; font-weight: 400}
.subtop_map .location ul{display: inline-block;}
.subtop_map .location li{display: inline-block; background: url(//static.heraldcorp.com/wbazic/heraldeco/images/bg-location-arr.png) no-repeat left center;); padding-left:23px}

/*middleArea*/
.middleArea{ padding:120px 0; }
.subtop-nav{position: relative; width:1280px; height:99px;  border: 1px solid #019f92; padding:40px 0 20px 0; box-sizing: border-box; margin: 0 auto; clear:both;box-shadow: 5px 5px 10px rgba(0,0,0,0.1)}
.subtop-nav li{font-size: 18px; color:#333; font-weight:400; display: inline-block;float: left; text-align: center;}
.subtop-nav li a{position:relative; display:block}
.subtop-nav li span {display: inline-block; padding:0 10px 12px; position:relative;}
.subtop-nav li span:after{position:absolute; display:block; content:""; left:50%; bottom:-3px; width:0; height:3px; background:transparent; transition:.2s; transform:translate(-50%, 0)}
/*.subtop-nav li span:hover{border-bottom: 3px solid #019f92; padding-bottom:12px;}
.subtop-nav span.on{ border-bottom: 3px solid #019f92; padding-bottom:12px;}*/
.subtop-nav li:hover span:after, .subtop-nav span.on:after{width:100%; background:#019f92}


/*forum list*/
.forum-list {position: relative; width: 1280px; margin:0 auto;  display: block; overflow: hidden;}
#forum-list-more li{display:none;}
.forum-list li{ height:380px; width:100%; margin-bottom:42px;display: block; position: relative;}
.forum-list li:hover{z-index:1; box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.3); cursor: pointer;}
.forum-list .thumb{width:640px; height:380px;   position: absolute; top:0; left:0}
.forum-list li:hover .thumb_hover{opacity: 1; }
.forum-list .forumbox{ position: absolute; top:0; left:640px; width:640px; height:380px; box-sizing: border-box; border: 1px solid #019f92; float:left; padding-left:39px; padding-right:75px}
.forum-list .thumb_hover{opacity: 0; position: absolute; background: rgba(0,0,0,0.4) url(//static.heraldcorp.com/wbazic/heraldeco/images/ico_more.png) no-repeat center center; width:640px; height:100%; top:0; left:0; transition: .2s}
.forum-list li:hover .hover-line{opacity: 1}
.forum-list .hover-line{opacity: 0; width:1280px; height:380px;position: absolute; top:0; left:0; border: 4px solid #019f92; box-sizing: border-box; z-index: 5; transition: .2s}
.forum-list .forumbox .badge1{width:80px; height:80px; color:#fff; background-color: #019f92;text-align: center; padding-top:34px; box-sizing: border-box;}
.forum-list .forumbox .badge1_end{width:80px; height:80px; color:#fff; background-color: #696969;text-align: center; padding-top:34px; box-sizing: border-box;}

.forum-list .forumbox .tit {font-size:30px;margin-top:60px;  -webkit-line-clamp: 3; display: -webkit-box;  text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; word-wrap: break-word; line-height: 39px; max-height: 115px}
.forum-list .forumbox .place{font-size:18px; color:#555; font-weight: 300; margin-top:50px }
.forum-list .forumbox .date{font-size:18px; color:#555;  font-family: 'Montserrat';  margin-top:22px; font-weight: 300;}
.forum-list .forumbox_end{width:640px; height:380px; box-sizing: border-box; border: 1px solid #696969; float:left; padding-left:39px; padding-right:75px; background-color:#f5f5f5; position: relative;}
.forum-list .thumb_end{width:640px; height:380px;  display: block; float: left;background-color: #000; }


/*withus list*/
.withus-list {position: relative; width: 1280px; margin:0 auto;  display: block; overflow: hidden;}
.witheco{font-size:26px; font-weight: 200; border-bottom: 1px solid #000; padding-bottom: 10px; display: inline-block;  margin-top: 78px; position: relative; left: 50%; transform: translate(-50%, -50%)}
#withus-list-more li{display:none;}
.withus-list ul{position: relative; margin-top:43px; clear: both;  display: inline-block; }
.withus-list li{width:299px; margin:0 28px 42px 0; float:left }
.withus-list li:nth-child(4n+0) { margin-right: 0;}
.withus-list li .witheco-tit{height:138px; box-sizing: border-box; border: 1px solid #019f92; text-align: center;}
.withus-list li .witheco-tit .name{font-size: 24px; font-weight: 300; margin-top: 35px}
.withus-list li .witheco-tit .job{font-size: 18px; font-weight: 200; color:#555; margin-top:17px; }


/*collabo-list*/
#collabo-list-more li{display:none;}
.collabo-list {position: relative; width: 1280px; margin:0 auto;  display: block; overflow: hidden;}
.collabo-list ul{position: relative; margin-top:62px; clear: both;  display: inline-block; }
.collabo-list li{margin:0 28px 40px 0; position: relative; float:left; width:408px; height:483px;}
.collabo-list li:hover{ box-shadow: 5px 5px 10px rgba(0,0,0,0.2); cursor:pointer; transition: .2s;  width:408px; height:483px;}

.collabo-list li:nth-child(3n+0) {margin-right: 0}
.collabo-list li .hover-line{opacity: 0}
.collabo-list li:hover .hover-line{opacity: 1; position: absolute; top:0; left:0; border: 4px solid #019f92; width:408px; height:483px; box-sizing: border-box; z-index:5; transition: .2s}
.collabo-list li .thumb_hover{opacity: 0;}
.collabo-list li:hover .thumb_hover{opacity: 1; position: absolute; top:0; left:0; background: rgba(0,0,0,0.4) url(//static.heraldcorp.com/wbazic/heraldeco/images/ico_more.png) no-repeat center center; width:408px; height: 275px; transition: .2s}
.collabo-item-txt {position: relative; padding: 0 38px; box-sizing: border-box; border: 1px solid #019f92; width:408px; height:208px}
.collabo-badge {z-index: 3; width:110px; height:30px; color: #fff; background-color: #019f92; text-align: center; position: absolute; top:-15px; padding: 8px 0; box-sizing: border-box; font-family: Montserrat; font-size: 14px; font-weight: 300}
.collabo-t1 {position: relative; top:50px;  font-size: 18px; font-weight: 300; color:#555; height:50px; }
.collabo-t2 {position: relative; top:50px; font-size: 24px; color:#000; line-height: 1.38; letter-spacing: normal;  max-height:35px; -webkit-line-clamp: 1; display: -webkit-box;  text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; word-wrap: break-word;}
.collabo-date{position: relative; top:70px;  font-size: 16px; font-weight: 300; COLOR:#555; font-family: Montserrat; }
.collabo-item-txt .bg2{background-color: #019f62;}
.collabo-item-txt .br2{border-color: #019f62;}

.collabo-list .badge2{width:80px; height:80px; color:#fff; background-color: #019f92;text-align: center; padding-top:34px; box-sizing: border-box; top:0px; right:0px; position:absolute;}
.collabo-list .badge2_end{width:80px; height:80px; color:#fff; background-color: #696969;text-align: center; padding-top:34px; box-sizing: border-box; top:0px; right:0px; position:absolute;}
.collabo-list .badge2_plan{width:80px; height:80px; color:#fff; background-color: #92bde6;text-align: center; padding-top:34px; box-sizing: border-box; top:0px; right:0px; position:absolute;}


/*news-list*/
#news-list-more li{display:none;}
.news-list {position: relative; width: 1280px; margin:0 auto;  display: block; }
.news-list ul{position: relative; margin-top:43px; clear: both;   }
.news-list li{position: relative; float:left; width:626px; height:602px; margin:0 28px 40px 0; }
.news-list li:hover{ box-shadow: 5px 5px 10px rgba(0,0,0,0.2); cursor:pointer; transition: .2s;  width:626px; height:602px;}
.news-list li .hover-line{opacity: 0}
.news-list li:hover .hover-line{opacity: 1; position: absolute; top:0; left:0; border: 4px solid #019f92; width:626px; height:602px; box-sizing: border-box; z-index:5; transition: .2s}
.news-list li .thumb_hover{opacity: 0;}
.news-list li:hover .thumb_hover{opacity: 1; position: absolute; top:0; left:0; background: rgba(0,0,0,0.4) url(//static.heraldcorp.com/wbazic/heraldeco/images/ico_more.png) no-repeat center center; width:626px; height:372px; transition: .2s}

.news-list li:nth-child(2n+0) {margin-right: 0}
.news-item-txt {position: relative; box-sizing: border-box; border: 1px solid #019f92; width:626px; height:230px; padding: 0 40px}
.news-item-txt.br1{border-color: #019f92}
.news-item-txt.br2{border-color: #019f62}
.news-item-txt.br3{border-color: #997e01}
.news-item-txt.br4{border-color: #017399}
.news-badge {z-index: 3; position: absolute; top:-40px; box-sizing: border-box; width: 80px; height: 80px; text-align: center; color: #fff; font-size: 18px; line-height: 22px; padding: 20px 0;font-weight: 300}
.news-badge.bg1{background-color: #019f92}
.news-badge.bg2{background-color: #019f62}
.news-badge.bg3{background-color: #997e01}
.news-badge.bg4{background-color: #017399}
.news-t1{position: relative; top:80px; font-size: 26px;font-weight: 300; line-height: 36px; max-height:72px; -webkit-line-clamp: 2; display: -webkit-box;  text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; word-wrap: break-word;}
.news-t2 {position: relative; top:103px; font-size: 16px; color:#555; font-weight: 300;  font-family: Montserrat;}

/*video-list*/
#video-list-more .video-box{display:none;}
.video-list{position: relative; width: 1280px; margin:0 auto;  display: block; margin-top: 82px}
.vr{z-index: 1; width:1px; background-color: #e5e5e5; position: absolute; top:0; bottom:0; left:50%}
.vr:before{content:""; position: absolute; top:0; background-color:#e5e5e5; width:8px; height:8px; border-radius: 4px; margin-left: -3px}
.vr:after{content:""; position: absolute; bottom:0; background-color:#e5e5e5; width:8px; height:8px; border-radius: 4px; margin-left: -3px}

.video-wrap{width: 1280px; margin:0 auto;}
.video-box{position: relative;; top:0; left:0; display: block;  width: 1280px; height:349px;  margin:0 auto 80px; clear:both;}
.btn-video{position:absolute; left: 25px; bottom:25px;  z-index: 3;  width:52px; height:52px; background: url(//static.heraldcorp.com/wbazic/heraldeco/images/btn_video.png) no-repeat; display:block;}
.video-img{position: relative; width:517px; height:349px; display: inline-block;}
.video-img .hover_bg{opacity: 0}
.video-box:hover .hover_bg{opacity: 1; position: absolute; top:0; left: 0; background: rgba(0,0,0,0.4) url(//static.heraldcorp.com/wbazic/heraldeco/images/ico_more.png) no-repeat center center; width:517px; height:349px; transition: .2s;  box-shadow: 5px 5px 10px rgba(0,0,0,0.2); border: 4px solid #019f92; box-sizing: border-box;}
.video-txt{position: relative; width:517px; height:349px;display: inline-block;  box-sizing: border-box; padding:70px 0}
.video-txt .title {font-size: 30px; line-height: 40px; text-align:left; max-height: 74px; -webkit-line-clamp: 2; display: -webkit-box;  text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; word-wrap: break-word; font-weight: 400 }
.video-txt .t-date{font-family: Montserrat; font-size: 16px; font-weight: 300; margin-top:36px}
.video-txt .t-tag {margin-top: 60px}
.video-txt .t-tag li {display: inline-block; padding:14px 16px; background-color: #f5f5f5 ;color:696969; font-size:14px; font-weight: 200;  margin:0 10px 10px 0}
.align-l {float:left; margin-right:123px}
.align-r {float:right; margin-left:123px}
.video-cate{z-index: 2; width:80px; height:80px; position: absolute; top:50%; left: 50%; transform: translate(-50%, -50%); background-color: #696969; color:#fff;  font-size: 18px; text-align: center; font-weight: 300;  box-sizing: border-box; line-height: 22px; display: table;}
.video-cate span{display: table-cell; vertical-align: middle;}
.video-box:hover {cursor: pointer;}
.video-box:hover .video-cate {background-color: #019f92; }
.video-box:hover .video-cate:before { content: ""; position: absolute; top:25px; left:-45px;  transition: .2s; background: url(//static.heraldcorp.com/wbazic/heraldeco/images/ico_video_l.png) no-repeat; width:14px; height: 24px}
.video-box:hover .video-cate:after { content: ""; position: absolute; top:25px; right:-45px;  transition: .2s; background: url(//static.heraldcorp.com/wbazic/heraldeco/images/ico_video_r.png) no-repeat; width:14px; height: 24px}
/*.  :after {transition:.2s; position: absolute; content: "";
    top: 0; left: 0; right: 0; bottom: 0; border: 15px solid rgba(1,159,146,0); z-index: 1;}*/


/*210408css추가*/
.more-btn{position: relative; display: block;}
.view-more {display:inline-block; font-family: Montserrat; font-size: 16px; font-weight: 400;  line-height:0; left: 50%; transform: translate(-50%, -50%); position:relative;margin-top:50px }
.more-line {position:relative; left:18%; width:64px; height:3px; margin-top:20px; background-color:#019f92; }
.clear{clear:both}


/*detail*/
.detail-tit-area{position: relative; height: 80px; clear:both; border-bottom: 2px solid #e5e5e5; padding-bottom:40px;  }
.detail-badge{position: relative; top:20px; float:left; padding:0 9px; height:32px; line-height: 32px; font-size:14px; color:#fff;font-weight: 300;  background-color: #019f92;  margin-right:34px}
.detail-badge_end{position: relative; top:20px; float:left; padding:0 9px; height:32px; line-height: 32px; font-size:14px; color:#fff;font-weight: 300;  background-color: #696969; margin-right:34px}
.detail-badge_plan{position: relative; top:20px; float:left; padding:0 9px; height:32px; line-height: 32px; font-size:14px; color:#fff;font-weight: 300;  background-color: #92bde6; margin-right:34px}
.detail-title{position: relative; top:20px; float:left; font-size: 30px; width:995px; line-height:35px; letter-spacing: normal;  max-height:35px; -webkit-line-clamp: 1; /*display: -webkit-box;  text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; word-wrap: break-word;*/ }
.detail-date{position: relative; top:33px;  float:right; font-size:16px; font-weight: 200}
.detail-img{margin-top:60px}
.detail-con{position: relative; max-width: 1280px; border-bottom:1px solid #e5e5e5; padding-bottom: 40px; }
.detail-con-cate ul{ width:100%;height:20px;  border-bottom:1px solid #e5e5e5; padding-bottom:20px; margin-top:50px}
.detail-con-cate li{display: inline-block; width:160px;  color: #999999; text-align: center;  font-size: 18px; font-weight: 200; padding-bottom:20px;}
.detail-con-cate .on{color:#000; border-bottom:3px solid #000; padding-bottom:20px; font-weight:400 }
.detail-con-cate a:hover{font-weight:400; color:#000; }
.detail-con-title{font-size:18px; color:#019f92; font-weight: 300; margin-bottom: 50px}
.detail-con-txt{font-size: 18px; color:#474747; padding:57px 105px 80px 105px; font-weight: 100; line-height: 34px}
.detail_txtbox { clear:both; margin-bottom:40px}
.txtbox-tag {float:left;}
.txtbox-tag li{display: inline-block; padding:14px 16px; background-color: #f5f5f5 ;color:696969; font-size:14px; font-weight: 200;  margin-right: 10px}
.txtbox-share {float:right}
.txtbox-share li{display: inline-block; padding-left:14px;}
.detail-banner {position: relative; margin-top:80px}
.detail-banner ul{clear:both;}
.detail-banner li{float:left; display: inline-block; position: relative; margin-right:28px;  width:626px; height:293px; font-size:0}
.detail-banner li:nth-child(2n) {margin-right:0; text-align:right}
.detail-banner li:nth-child(2n) .detail-banner-bg .date{left:inherit; right:40px}
.detail-banner-bg{z-index: 2; position: relative;top:0; left:0; width:626px; height:293px; background-color:rgba(0, 0, 0, 0.6);  }
.detail-bannerimg{z-index: 1; position: absolute;top:0; left:0; width:626px; height:293px; overflow:hidden;}
.detail-bannerimg img{position:absolute; top:50%; left:50%; max-width:100%; transform:translate(-50%,-50%);}
.detail-banner-bg .tit {position: absolute; top:121px; left:40px; color:#fff; width:530px; font-weight:300; font-size:26px; line-height: 36px; max-height:72px; -webkit-line-clamp: 2; display: -webkit-box;  text-overflow: ellipsis; overflow: hidden; -webkit-box-orient: vertical; word-wrap: break-word;}
.detail-banner-bg .date {position: absolute; top:225px; left:40px; color:#fff; font-weight:300; font-size:16px}
.detail-banner li.no-next{display: table; background-color: #e5e5e5; text-align: center;}
.detail-banner li.no-next p{display: table-cell; vertical-align: middle; color: #696969; font-size: 26px}
.list_more {clear:both; width:89px; margin: 0 auto; padding-top:80px}
.list_more .txt {display:inline-block; vertical-align:top; font-family: Montserrat; font-size: 16px; font-weight: 400;  line-height:0; margin-top:33px}
.list_more .b_line {position:relative; left:13px; width:64px; height:3px; margin-top:20px; background-color:#019f92; }
.button_wrap5{z-index: 5; position: absolute; color: #fff; top: 20px;width:1280px; margin:0 auto; line-height: 25px;}
.button-prev5{position: absolute; top:60px; left:40px; cursor: pointer;}
.button-next5{position: absolute; top:60px; right:40px; cursor: pointer;}
.button-prev5 img{margin-right:10px}
.button-next5 img{margin-left:10px}

/*detail-slide*/
.swiper-container5 { position: relative; overflow: hidden;}
.swiper-container5 .swiper-wrapper{width: 1280px; height: 293px;}
.swiper-button_wrap5{z-index: 5; position: absolute; color: #fff; top: 20px;width:1280px; margin:0 auto; line-height: 25px;}
.swiper-button-prev5{position: absolute; top:60px; left:40px; cursor: pointer;}
.swiper-button-next5{position: absolute; top:60px; right:40px; cursor: pointer;}
.swiper-button-prev5 img{margin-right:10px}
.swiper-button-next5 img{margin-left:10px}
.no-next{display: table; background-color: #e5e5e5; text-align: center;}
.no-next p{display: table-cell; vertical-align: middle; color: #696969; font-size: 26px}


/*forum-detail*/
.forum-detail{position: relative;  max-width: 1280px; margin:0 auto;  display: block;}
.forum-badge{display: table; float:left; width:80px; height:80px; font-size:18px; color:#fff;font-weight: 300;  background-color: #019f92; margin-right: 34px;}
.forum-badge p {display: table-cell; vertical-align: middle; text-align: center;}
.apply{text-align: center; margin-top: 20px;}
.btn-apply{width:408px; height:60px; color:#fff; text-align: center; background-color: #019f92; font-size: 20px; font-weight: 300; line-height: 20px; margin:40px auto 0; -webkit-transition:.2s ease-in-out; transition:.2s ease-in-out}
.btn-apply:hover{box-shadow: 5px 8.7px 15px 0 rgba(0, 0, 0, 0.18);margin:38px auto 2px;}


/*search-list*/
.subtop_search{width:630px; height:225px; position:absolute; top:375px;left:50%; transform:translate(-50%, -50%); text-align: center;}
.subtop_search .subtop_title{position: relative;top:0; text-align: center;}
.subtop_search_bar{margin-top:60px; padding:10px 20px 10px 22px ; background:#ffffff url(img/ico_search_list.png) no-repeat right 20px center; width:584px; height:40px; }
.subtop_search_bar input{font-size:18px; font-weight:300; color:#333; width:550px; margin-right: 25px; margin-top:5px; height:30px;line-height: 30px; text-align: left; background: transparent;}
.subtop_search .result_area {margin-top:30px; font-size:24px; font-weight:100; letter-spacing: 1.5px; color:#fff}
.subtop_search .result_area span{font-weight:300 }
.forum-list .forumbox .search-badge1{padding:10px; width:80px; height:15px; margin-top:50px; color:#fff; background-color: #019f92;text-align: center;}

/*inquiry*/
.inquiry{position: relative;  max-width: 1280px; margin:0 auto;  display: block; }
.inquiry .t1{font-size: 40px; font-weight: 400; text-align: center;}
.inquiry .t2{font-size: 20px; color:#555;  font-weight: 200; margin-top:38px;  text-align: center;}
.inquiry-form{border-top: 3px solid #e5e5e5; margin-top: 40px;}
.inquiry-input{width:630px; margin:0 auto; padding-top:50px}


/* 211012_추가 */
.detail_txtbox{overflow:hidden;}
.view_down{padding:40px 40px; margin:40px 0; background:#f9f9f9; font-size:0}
.view_down_title{font-size:17px; font-weight:300; color:#444; line-height:40px; float:left}
.view_down ul{float:right}
.view_down ul li{display:inline-block; vertical-align:middle; margin-left:10px}
.view_down ul li a{display:block; padding:0 20px; font-size:13px; letter-spacing:0.3px; font-weight:300; background:#fff; line-height:40px; border:1px solid #ccc; border-radius:20px; transition:.2s; max-width:200px}
.view_down ul li a svg{width:20px; height:20px; display:inline-block; vertical-align:middle; margin:-2px 0 0 5px}
.view_down_icon_col_1{fill:#FA0F00}
.view_down_icon_col_2{fill:#fff}
.view_down_icon_col_3{fill:#209DDF}
.view_down:after{content:""; clear:both; display:block}
.view_down ul li:hover a{color:#229c83; border-color:#229c83}


/* 230306_추가 */
.overlay a{line-height:75px; padding:8px 0}
.overlay-content{margin-top:0; top:11%}
.overlay-content_bnn{background:rgba(0,0,0,0.3); line-height:120px !important; margin:20px 0 0 -82px; padding:0 0 0 82px !important; display:block !important; font-size:0 !important; border-bottom:none !important}
.overlay-content_bnn img, .overlay-content_bnn span{display:inline-block; vertical-align:middle;}
.overlay-content_bnn span{margin-left:30px; font-size:40px; color:#fff; font-weight:400; letter-spacing:-0.5px;}
.overlay-mycontent a{line-height:20px;}
.main_climate_img{display:block; max-width:1280px; margin:100px auto -30px}
.main_climate_img img{width:100%}
.main_ecoforum_area{height:695px}
.swiper-button_area2{width:541px}
.footer_r .header_sns22 a svg{fill:#767676; display:inline-block; vertical-align:middle; width:16px; height:16px; margin-top:-2px}