@charset "utf-8";


/* 메인슬라이드 */

.mainVisu {width: 100%; height: 857px; position: relative;}
.bxslider_main {display: block; width: 100%; height: 857px; position: relative;}
.bxslider_main li {display: block; width: 100&; height: 857px; position: relative;}
.mainVisu .bx-wrapper {width: 100%; height: 857px;}

.bxslider_main li .txt {z-index: 10; color: #ffffff; position: absolute; top: 0; left: 0; width: 820px; height: 220px ; background-color: rgba(0,0,0,0.3); padding: 50px; margin: 0 auto; top: calc(50% - 160px); left: calc(50% - 410px); text-align: center;}
.bxslider_main li .txt .subtit {font-size: 30px;}
.bxslider_main li .txt h2 {font-size: 45px; font-weight: 600; color: #ffffff; margin-top: 9px;}


.mainVisu .contBox {z-index: 10;color: #ffffff;position: absolute;top: calc(50% - 253px);left: 50%;width: 1310px;height: auto;background-color: rgba(0,0,0,0.3);padding: 30px 52px;margin: 0 auto;transform: translateX(-50%);}
.mainVisu .contBox h1 {color: #ffffff; font-size: 29px; text-align: center; font-weight: 400; position: relative;}
.mainVisu .contBox h2 {color: #ffffff; font-size: 46px; margin-bottom: 42px; text-align: center; font-weight: 500; position: relative;}
.mainVisu .contBox h2:after {position: absolute; content: ""; visibility: visible; width: 380px; height: 1px; background-color: rgba(225,225,225,0.5); top: 90px; left: calc(50% - 190px);}
.mainVisu .cont {width: 199px; float: left; text-align: center; margin-left: 50px;}
.mainVisu .contBox div.first {margin-left: 0;}
.mainVisu .cont figure {margin: 0 auto; width: 199px; text-align: center;}
.mainVisu .cont figure a {width: 199px; height: 210px; display: block; margin: 0 auto;}
.mainVisu .cont figure a img {border-radius: 15px; border: 5px solid #ffffff;}
.mainVisu .cont figcaption { color: #ffffff; width: 199px; font-size: 18px; margin-bottom: 10px;}

.slide1 .mainBg { width: 100%; height: 857px; background: url(../img/mainVisu1.png) no-repeat center center; z-index: 1; }
.slide2 .mainBg { width: 100%; height: 857px; background: url(../img/mainVisu2.png) no-repeat center center; z-index: 1; }
.slide3 .mainBg { width: 100%; height: 857px; background: url(../img/mainVisu3.png) no-repeat center center; z-index: 1; }




/* 산업,안전 */

section.sc1 {width: 100%; height: 720px; margin-top: 85px;}
.sc1 .contBox {width: 1200px; height: 720px; margin: 0 auto;}
.sc1 .contBox .titbox {margin: 0 auto; text-align: center; margin-bottom: 80px;}
.sc1 .contBox .titbox .subtit {font-size: 27px;}
.sc1 .contBox .titbox h3 {font-size: 43px; font-weight: 700; margin-top: -4px; position: relative;}
.sc1 .contBox .titbox h3:after {content: ""; visibility: visible; position: absolute; width: 80px; height: 5px; background-color: #2c9e60; top: 80px; left: calc(50% - 40px);}


.sc1 .contBox .sliderBox {width: 1200px; height: 600px; margin-top: 11px;}
.sc1 .contBox .sliderBox .bxslider_sc1 {width: 1200px; height: 600px; display: block;}
.sc1 .contBox .sliderBox .bxslider_sc1 a li {width: 266px;height: 502px;display: block;border: 1px solid #cccccc;box-shadow: 3px 3px 3px rgba(0,0,0,0.2);}
.sc1 .contBox .sliderBox .bxslider_sc1 a li figure {width: 264px;height: 410px;overflow: hidden;}
.sc1 .contBox .sliderBox .bxslider_sc1 a li figure .img {width: 264px;height: 410px;overflow: hidden;transition: all 0.3s ease;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-ms-transition: all 0.3s ease;-o-transition: all 0.3s ease;z-index: 1;}
.sc1 .contBox .sliderBox .bxslider_sc1 a li figcaption {width: 264px;height: 90px;background-color: #ffffff;font-size: 19px;text-align: center;padding-top: 27px;font-weight: 500;z-index: 2;}
.sc1 .contBox .sliderBox .bxslider_sc1 a:hover li figure .img {transform: scale(1.1);}


.sc1 .contBox .sliderBox .bxslider_sc1 a .slide1_sc1 .img { background:url(../img/sc1_img1.png)}
.sc1 .contBox .sliderBox .bxslider_sc1 a .slide2_sc1 .img { background:url(../img/sc1_img2.png)}
.sc1 .contBox .sliderBox .bxslider_sc1 a .slide3_sc1 .img { background:url(../img/sc1_img3.png)}
.sc1 .contBox .sliderBox .bxslider_sc1 a .slide4_sc1 .img { background:url(../img/sc1_img4.png)}
.sc1 .contBox .sliderBox .bxslider_sc1 a .slide5_sc1 .img { background:url(../img/sc1_img5.png)}
.sc1 .contBox .sliderBox .bxslider_sc1 a .slide6_sc1 .img { background:url(../img/sc1_img6.png)}
.sc1 .contBox .sliderBox .bxslider_sc1 a .slide7_sc1 .img { background:url(../img/sc1_img7.png)}
.sc1 .contBox .sliderBox .bxslider_sc1 a .slide8_sc1 .img { background:url(../img/sc1_img8.png)}
.sc1 .contBox .sliderBox .bxslider_sc1 a .slide9_sc1 .img { background:url(../img/sc1_img9.png)}
.sc1 .contBox .sliderBox .bxslider_sc1 a .slide10_sc1 .img { background:url(../img/sc1_img10.png)}
.sc1 .contBox .sliderBox .bxslider_sc1 a .slide11_sc1 .img { background:url(../img/sc1_img11.png)}
.sc1 .contBox .sliderBox .bxslider_sc1 a .slide12_sc1 .img { background:url(../img/sc1_img12.png)}
.sc1 .contBox .sliderBox .bxslider_sc1 a .slide13_sc1 .img { background:url(../img/sc1_img13.png)}

.sc1 .contBox .sliderBox .bx-wrapper {max-width: 1100px; min-width: 1110px; margin: 0 auto;}
.sc1 .contBox .sliderBox .bx-viewport {}
.sc1 .contBox .sliderBox .bx-wrapper .bx-prev {left: -50px;}
.sc1 .contBox .sliderBox .bx-wrapper .bx-next {right: -50px;}


/* 환경 */

section.sc2 {width: 100%; height: 622px; margin-top: 50px; background: url(../img/sc2_bg.png) no-repeat center center;}
.sc2 .contBox {width: 1200px; height: 622px; margin: 0 auto; padding-top: }
.sc2 .contBox .titbox {margin: 0 auto; text-align: center; margin-bottom: 80px; padding-top: 65px;}
.sc2 .contBox .titbox .subtit {font-size: 27px;}
.sc2 .contBox .titbox h3 {font-size: 43px; font-weight: 700; margin-top: -4px; position: relative;}
.sc2 .contBox .titbox h3:after {content: ""; visibility: visible; position: absolute; width: 80px; height: 5px; background-color: #2c9e60; top: 80px; left: calc(50% - 40px);}

.sc2 .contBox .sliderBox {width:1200px; height: 292px;}
.sc2 .contBox .sliderBox .bxslider_sc2 {width: 1200px; height: 292px; display: block;}
.sc2 .contBox .sliderBox .bxslider_sc2 a li {width: 254px; height: 292px; display: block;}
.sc2 .contBox .sliderBox .bxslider_sc2 a li figure { width: 254px; height: 242px; box-shadow: 3px 3px 3px rgba(0,0,0,0.2); position: relative;}
.sc2 .contBox .sliderBox .bxslider_sc2 a li figcaption {width: 254px; height: 50px; padding-top: 10px; text-align: center; font-size: 19px; font-weight: 500;}

.sc2 .contBox .sliderBox .bxslider_sc2 a:hover li figure:after {content: ""; visibility: visible; position: absolute; top: 0; left: 0; background: url(../img/sc2_plus.png) no-repeat center center rgba(0,0,0,0.25); width: 254px; height: 242px; border: 5px solid #2c9e60; box-sizing: border-box;}



.sc2 .contBox .sliderBox .bx-wrapper {max-width: 1100px; min-width: 1100px; margin: 0 auto;}
.sc2 .contBox .sliderBox .bx-wrapper .bx-prev {left: -50px; top: 115px;}
.sc2 .contBox .sliderBox .bx-wrapper .bx-next {right: -50px; top: 115px;}




/* 최신글/cscenter */

section.sc3 {width: 100%; height: 299px; margin-top: 80px; margin-bottom: 80px;}
.sc3 .contBox {width: 1200px; height: 299px; margin: 0 auto;}
.sc3 .contBox>div:nth-child(3) {margin-left: 12px;}
.sc3 .contBox .notice {width: 416px; height: 299px; border: 1px solid #dddddd; float: left;}
.sc3 .contBox .download {width: 355px; height: 299px; float: left; background: url(../img/cscenter2.png)no-repeat center center; margin-left: 42px; margin-right: 20px;}

.sc3 .contBox .download a {display: block; width: 250px; height: 60px; border: 1px solid #ffffff; border-radius: 30px; text-align: center; padding-top: 11px; font-size: 22px; font-weight: 600; color: #ffffff; margin: 145px 0 0 53px; transition: all 0.1s ease;}
.sc3 .contBox .download a:hover {background-color: #ffffff; color: #2c9e60;}
.sc3 .contBox .cscenter {float: left; width: 355px; height: 299px;}