@charset "utf-8";


.main-visual {position:relative; max-width:1920px; margin:0 auto;overflow:hidden;}
.main-visual .item {height:100vh; position: relative; z-index:1;}
.main-visual .item .visual-img {position:absolute;  top:0; left:0; width:100%; height:100%; object-fit:cover; background-repeat:no-repeat; background-position:50% 50%; background-size:cover;  opacity: 1 !important; animation-duration: 3s; transition: all 1s ease;}
.main-visual .content {position:absolute; top:50%; left:0; width:100%; color:#fff; padding:0 20%;transform:translateY(-50%); z-index:50;}
.main-visual .content .tit {font-size:40px; line-height:1.5em; font-weight:700;text-shadow:3px 3px 3px rgba(0,0,0,.30);}
.main-visual .content .big {font-size:50px}
.main-visual .content .yellow {color:#ffebad}
.main-visual .slick-dots {position:absolute; bottom:30px; left:0; width:100%; display:flex; justify-content:center; z-index:50}
.main-visual .slick-dots li {margin:0 5px;}
.main-visual .slick-dots li button {font-size:0; line-height:0; width:15px; height:15px; background:transparent; border:2px solid #fff; border-radius:50%;}
.main-visual .slick-dots li.slick-active button {background:#fff;}
.main-visual .slick-arrow {position:absolute; top:50%; width:32px;height:60px; margin-top:-30px;font-size:0; line-height:0; border:0; background-color:transparent; background-repeat:no-repeat; background-position:50% 50%; background-size:contain;z-index:50}
.main-visual .slick-prev {left:100px; background-image:url('../images/main/bt_prev.png');}
.main-visual .slick-next {right:100px; background-image:url('../images/main/bt_next.png');}


.animated {transition: all .5s ease;}

.main-visual [data-animation-in] {
    opacity: 0;
    animation-duration: 1.5s;
    transition: opacity 0.5s ease 0.3s;
	transition:1s;
}

@keyframes zoomInImage {
  from {
    transform: scale3d(1.1, 1.1, 1.1);
		transition:1s;
  }
  to {
    transform: scale3d(1, 1, 1);
			transition:1s;
  }
}

.zoomInImage {
  animation-name: zoomInImage;
}

@keyframes zoomOutImage {
  from {
    transform: scale3d(1, 1, 1);
			transition:1s;
  }
  to {
    transform: scale3d(1.1, 1.1, 1.1);
			transition:1s;
  }
}

.zoomOutImage {
  animation-name: zoomOutImage;
		transition:1s;
}


.main-title {text-align:center; margin-bottom:40px;}
.main-title h2 {color:#242424; font-size:40px;line-height:1.4em; font-weight:600; font-family: 'Titillium Web', sans-serif;}

.main-product {padding:100px 0;}
.main-product ul {display:flex; margin-left:-30px;}
.main-product ul li {width:50%; padding-left:30px;}
.main-product ul li .photo {position:relative;}
.main-product ul li .pic {position:relative; height:0; padding-bottom:65.5%; overflow:hidden;}
.main-product ul li .pic img {position:absolute; top:50%; left:0; transition:0.3s; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover;}
.main-product ul li .pic:after {content:"";position:absolute; top:0; left:0; transition:0.3s; width:100%; height:100%; background:rgba(255,255,255,.85); border:10px solid #fec000; opacity:0;}
.main-product ul li .content {position:absolute; top:50%; left:0;  text-align:center; width:100%; color:#fff; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); z-index:1;}
.main-product ul li .content .tit {font-size:30px; line-height:1.4em; font-weight:700;font-family: 'Titillium Web', sans-serif;}
.main-product ul li .content  p {font-size:18px; line-height:1.4em; display:none; margin-top:25px;}
.main-product ul li a:hover .pic img {transform:translateY(-50%) scale(1.04,1.04); -ms-transform:translateY(-50%) scale(1.04,1.04); -webkit-transform:translateY(-50%) scale(1.04,1.04);}
.main-product ul li a:hover .pic:after {opacity:1;}
.main-product ul li a:hover .content {color:#454545}
.main-product ul li a:hover .content p {display:block;}


.main-rnd {position:relative; padding:130px 0 100px; max-width:1920px; margin:0 auto; background:url('../images/main/rnd_bg.jpg') 0 50% no-repeat;}
.main-rnd:after {content:"";position:absolute; top:15%; right:0; width:57%; height:380px; background:#1aa2e8; z-index:0}
.main-rnd .contain {position:relative; max-width:1450px; z-index:1}
.main-rnd .row {display:flex; align-items:center;}
.main-rnd .info {width:557px; margin-left:100px; padding-left: ;}
.main-rnd .info .title {margin-bottom:35px;  color:#242424; }
.main-rnd .info .title h2 {font-size:40px; line-height:1.4em;font-weight:600; font-family: 'Titillium Web', sans-serif;}
.main-rnd .info .title p {font-size:32px; line-height:1.3em; font-family: 'NanumSquare', sans-serif;}
.main-rnd .info .txt {font-size:16px; line-height:1.4em; margin-bottom:85px;}
.main-rnd .info .more {padding:0 20px; display:inline-block; background:#fff; border:1px solid #dfdfdf; font-size:15px; line-height:44px;}
.main-rnd .info .more:after {content:"";margin-left:15px;display:inline-block;vertical-align:top; width:41px; height:44px; background:url('../images/main/more_arrow.png') 50% 50% no-repeat; background-size:contain;}
.main-rnd .photo {width:calc(100% - 557px);}
.main-rnd .photo .pic {position:relative; height:0; padding-bottom:47.5%; overflow:hidden;}
.main-rnd .photo .pic img {position:absolute; top:50%; left:0; transition:0.3s; transform:translateY(-50%);  z-index:1; -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover;}

.main-bnr {padding:100px 0;}
.main-bnr ul {display:flex;}
.main-bnr ul li {width:25%; text-align:center;  background-repeat:no-repeat; background-position:50% 50%; background-size:cover;}
.main-bnr ul li:nth-child(1) {background:#fdc000;}
.main-bnr ul li:nth-child(2) {background-image:url('../images/main/bnr_job.jpg')}
.main-bnr ul li:nth-child(3) {background:#0d81bd}
.main-bnr ul li:nth-child(4) {background-image:url('../images/main/bnr_map.jpg')}
.main-bnr ul li a {display:block; padding:45px 15px; color:#fff}
.main-bnr ul li .icon {margin-bottom:20px;}
.main-bnr ul li .tit {font-size:20px; line-height:1.4em;font-weight:500; margin-bottom:5px;}
.main-bnr ul li .cnt {font-size:16px; line-height:1.4em; height:calc(1.4em * 1 * 2); margin-bottom:20px;}
.main-bnr ul li .more {display:inline-block; padding:0 35px; border:1px solid rgba(255,255,255,.30); font-size:16px; line-height:38px; border-radius:40px;}