@import url(common.css);

#visual{position: relative;}
.slideVisual{height: 100vh;position: relative;}
.slideVisual ul{height: 100vh;overflow: hidden;}
.slideVisual ul li{height: 100vh;position: relative;}

.slideVisual ul.slick-dots{height:auto;position: absolute;top:42%;right:100px;z-index: 100;}
.slideVisual ul.slick-dots li{height: auto;margin-bottom:9px;}
.slideVisual ul.slick-dots li button{font-size:0;line-height:0;width: 10px;height: 10px;display: block;background: #fff;border-radius: 10px;transition: 0.5s;}
.slideVisual ul.slick-dots li.on button{height: 30px;transition: 0.5s;}
.slideVisual .control{position: absolute;top:52%;right:100px;z-index: 100;}
.slideVisual .control button{font-size:0;line-height: 0;background: url(../images/main/pause.png)left top no-repeat;width:10px;height: 16px;display: inline-block;}
.slideVisual .control button.play{background: url(../images/main/play.png)left top no-repeat;background-size:100%;display: none;}
.titleInner{position: absolute;width: 100%;height: auto;z-index: 100;}

.scrollB{position: absolute;left:0;bottom: 5%;width:100%;text-align: center;}
.scrollWrap{width:76px;height: 76px;display: inline-block;position: relative;cursor: pointer;overflow: hidden;cursor: default;}
.scrollWrap::before{content: '';width: 76px;height: 76px;display: block;position: absolute;left:0;top:0;background: rgba(255,255,255,0.2);transform: translateY(-76px);transition: 0.5s;}
.arrowBg{background: url(../images/main/arrow_scroll.png)center center no-repeat;width: 78px;height: 75px;display: block}
.line{background: #fff;display: inline-block;position: absolute;}
.lineTop{width:76px;height: 1px;left:-76px;}
.lineRigth{height:76px;width: 1px;right:0;top:-76px;}
.lineLeft{height:76px;width: 1px;left:0;bottom:-76px;}
.lineBtm{width:76px;height: 1px;bottom:0;right:-76px;}
/*마우스오버효과 - 스크롤버튼*/
/* .scrollWrap:hover::before{transform: translateY(0);transition: 0.5s;} */

/*sec01*/
#sec01 .textArea{padding:70px 0 0 20px;}
#sec01 .textArea div .titleA{margin:40px 0 12px 0;}
#sec01 .titleA span{background:url(../images/main/sec01_logo.jpg); width:79px; height:45px; text-indent:-999px; display:block; float:left; margin:8px 20px 0 0;}
#sec01 .titleA em.e{ color:#f2001d}
#sec01 .titleA em.h{ color:#d5b50c}
#sec01 .titleA em.d{ color:#57ca41}

.sec01_left{margin:80px 0;overflow: hidden;padding:0 0 15px 20px;}
.sec01_left .textArea{display: inline-block;padding-left:105px  !important;width: 52%;box-sizing: border-box;}
.sec01_left .textArea p { padding-left:12px;}
.sec01_left .textArea p span { color:#0f4298;}
.bullet { position:relative; padding-top:5px;}
.bullet:before{content: '';width: 3px;height: 3px;background:#004b8d;position: absolute;left: 2px;top:17px;}
.sec01_left .imgArea{float: left;padding-left:0;background:url(../images/main/sec01.jpg)right top no-repeat;height:500px;width:600px;background-size:cover;}

.sec01_left .btnArea{margin-top: 62px;}

.sec01_left .btnArea .borderBtn:hover { background:#0a1346; color:#fff; border: 1px solid #0a1346;}



/*sec03*/
#sec03{position: relative;margin-bottom:0px; overflow:hidden;}
#sec03::before{content: '';width:100%;height:1500px;background: #f8f8f8;position: absolute;left:0;top:0;}
#sec03 .titleC{margin-bottom:15px;padding-top:80px;}
#sec03 .main_work { display:block; text-align:center;}
#sec03 .main_work ul{display: flex;flex-wrap: wrap; margin:50px 0 80px 0;}
#sec03 .main_work ul li {width: calc((100% - 90px) / 3);margin-right:30px;height:245px; position:relative; font-size:17px; font-weight:600;}
#sec03 .main_work ul li>img { padding-bottom:10px;}
#sec03 .main_work ul li:nth-child(3n){margin-right: 0;}
#sec03 .main_work ul li:nth-child(n+4){margin-top:70px;}
#sec03 .btnArea { text-align:center; margin-bottom:80px;}
#sec03 .btnArea .borderBtn:hover { background:#0a1346; color:#fff; border: 1px solid #0a1346;}

/*sec04*/
#sec04{background: url(../images/main/business.jpg)left top no-repeat;padding-bottom:80px;}
#sec04 .titleC{margin-bottom:15px;padding-top:80px;color: #fff}
#sec04 .titleC span{color:#fff;}
#sec04 .textA{color:#fff;}
#sec04 .btnArea{text-align: center;margin-top:70px;}
#sec04 .btnArea .borderBtn:hover { background:#ffc800; color:#000; border: 1px solid #ffc800;}
#sec04 .borderBtn{color:#fff;border-color: #fff;}
#sec04 .borderBtn::before{background:#fff;}
.business_list{display:table;width:100%;position: relative; background: url(../images/main/business_line.png)center 25px no-repeat;box-sizing: border-box;}
.business_list li{display:table-cell;text-align: center;position: relative;}
.business_list .list_title{position: absolute;left:0;width:100%;text-align: center;}
.business_list .list_title h4{font-size:50px;color:#ffc800;font-weight: 600;}
.business_list li .icon_area{border:2px solid #fff;border-radius: 50%;width:165px;height:165px;display:inline-block;box-sizing: border-box;}
.business_list li .icon_area:hover {border:2px solid #ffc444; transition: 0.5s;}
.business_list li p{font-size:22px;color:#ffc800;margin:110px 0 30px 0; font-weight:600;}
.business_list li.list01>p { padding-top:10px;}
.business_list li a.list01 .icon_area{background:rgba(0,0,0,0.1) url(../images/main/industry01.png)center no-repeat;}
.business_list li a.list01 .icon_area:hover{background:rgba(0,0,0,0.1) url(../images/main/industry01_on.png)center no-repeat; transition: 0.5s;}
.business_list li a.list02 .icon_area{background:rgba(0,0,0,0.1) url(../images/main/industry05.png)center no-repeat;}
.business_list li a.list02 .icon_area:hover{background:rgba(0,0,0,0.1) url(../images/main/industry05_on.png)center no-repeat; transition: 0.5s;}
.business_list li a.list03 .icon_area{background:rgba(0,0,0,0.1) url(../images/main/industry02.png)center no-repeat;}
.business_list li a.list03 .icon_area:hover{background:rgba(0,0,0,0.1) url(../images/main/industry02_on.png)center no-repeat; transition: 0.5s;}
.business_list li a.list04 .icon_area{background:rgba(0,0,0,0.1) url(../images/main/industry03.png)center no-repeat;}
.business_list li a.list04 .icon_area:hover{background:rgba(0,0,0,0.1) url(../images/main/industry03_on.png)center no-repeat; transition: 0.5s;}

/*sec05*/
#sec05{background: url(../images/main/recruit.jpg)left top no-repeat;padding-bottom:60px;}
#sec05 .titleC{margin-bottom:30px;padding-top:70px;color: #fff; font-size:38px;}
#sec05 .titleC span{color:#ffc800;}
#sec05 .textA{color:#fff;}
#sec05 .btnArea{text-align: center;margin-top:60px;}
#sec05 .btnArea .borderBtn:hover { background:#ffc800; color:#000; border: 1px solid #ffc800;}
#sec05 .borderBtn{color:#fff;border-color: #fff;}
#sec05 .borderBtn::before{background:#fff;}