@charset "utf-8";

.cont1 {position:relative; }

.visual {text-align:center; color:#fff; margin-top:90px}
.vis_ul li {padding-top:250px; height:600px;  }

.vis_ul li.bg1 {background:url('/img/main/new_01.jpg') no-repeat center;}
.vis_ul li.bg2 {background:url('/img/main/visImg2.jpg') no-repeat center;}


.vis_ul dt {font-family:'SCDream'; font-weight:800; font-size:45px; }
.vis_ul dd {font-size:18px; padding:20px 0 30px; line-height:1.8 }
.vis_ul dd .date {display:block; font-weight:600; }
.vis_ul dd .more_btn { border-radius:10px; background-color:#090; color:#fff; font-weight:bold; font-size:13px; padding:5px 10px; line-height:1.5  }
.visual .control {position:absolute; top:440px; left:50%; margin-left:-42px;}
.visual .control > a {display:inline-block; width:22px; height:22px; background:url('/img/main/visControl.gif') no-repeat 0 0; text-indent:-9999px; vertical-align:top; }
.visual .control > a.play { display:none; background-position:-22px 0;}
.visual .dot {display:inline-block;}
.visual .dot li {float:left; margin:0 5px;}
.visual .dot li a {display:inline-block; text-indent:-9999px; width:13px; height:13px; background:000; border-radius:50%; box-sizing:content-box; margin:3px;  }
.visual .dot li.slick-active a { border:3px solid #000; background:transparent; margin:0;}
@media all and (max-width:768px){
	.visual {margin-bottom:20%}
  .vis_ul li {height:680px; background-size:auto 600px !important; padding-top:130px;}
  .visual .control {top:55%;}
  .vis_ul dt {font-size:35px;}
}
@media all and (max-width:480px){
.vis_ul li.bg2 {background:url('/img/main/visImg2.jpg')no-repeat; background-position:70% 50%;}
  .vis_ul dt {font-size:30px;}
  .vis_ul dd {font-size:16px;}
}

.company {position:absolute; max-width:1300px; left:50%; bottom:0; margin-left:-650px; background:#fff; border-radius:20px 20px 0 0 ; text-align:center; padding:50px; top:45%}
.company h2 {font-size:25px; margin-bottom:30px;}
.company h2 span {font-weight: 400;}
.company .dot {border-radius:10px; overflow:hidden; margin-top:30px; }
.company .dot li {float:left; background:#eaeaea;}
.company .dot li.slick-active {background:#019139;}
.company .dot li a {display:block; text-indent:-9999px; height:7px; }
.com_ul {position:relative;}
.com_ul::before {content:''; position:absolute; left:0; top:0; width:1px; height:100%; background:#fff; z-index:100; }
.com_ul li { border-left:1px dashed #e5e5e5; padding:20px 30px; }
.com_ul span {background:#868686; color:#fff; padding:2px 10px; border-radius:20px;}
.com_ul span.type1 {background:#019139;}
.com_ul span.type2 {background:#1a6fce;}
.com_ul span.type3 {background:#ffcb18; color:#222; }
.com_ul dt { padding:20px 0; height:120px; }
.com_ul dt img {display:block; margin:0 auto; height:100%; }
.com_ul dt strong {display:block; font-size:18px; margin-top:10px;}
.com_ul dd {
	font-size:14px; text-align:left; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; 
	line-height:22px; height:44px; overflow:hidden;  
	margin-top:20px; 
}

/* main.asp */
.com_ul a {position:relative; padding:30px 20px 30px; }
.com_ul a p { position:absolute; left:0; bottom:0; width:100%; border-top:1px dashed #ddd; padding:10px; font-weight:bold }
.com_ul a:hover p {background:#019139; color:#fff;}

.jobList ul {overflow:hidden;}
.jobList li { float:left; width:22.75%; margin:0 0 30px 0.2%;  text-align:center; border:1px solid #ddd; background:#fff; padding:2px;}
.jobList li:nth-child(4n+1) { clear:both; }
.jobList li:hover { border:1px solid #019139; background:#019139;}
.jobList li a { display:block;  padding:30px 20px 70px; background:#fff; }
.jobList li span {background:#868686; color:#fff; padding:2px 10px; border-radius:20px; font-size:0.9rem}
.jobList li span.type1 {background:#019139;}
.jobList li span.type2 {background:#1a6fce;}
.jobList li span.type3 {background:#ffcb18; color:#222; }
.jobList li dt { padding:20px 0; height:120px; overflow:hidden; }
.jobList li dt img {display:block; margin:0 auto; /*�߰�*/ height:100%; }
.jobList li dt strong {display:block; font-size:18px; margin-top:10px;}
.jobList li dd {
	font-size:14px; text-align: center; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; line-height:22px; 
	/*max-height:88px;*/ height:44px; overflow:hidden; 
}




@media all and (max-width:1350px){
  .company { width:96%; margin:0 2%; left:0; top:45% !important  }
}
@media all and (max-width:1023px){
  .company { padding:30px;  top:60% !important   }
}
@media all and (max-width:768px){
  .company { top:50%}
  .company h2 {margin-bottom:20px;}
  .company .dot {margin-top:20px;}
  .com_ul li {padding:0 15px;}
  .com_ul dd {-webkit-line-clamp: 2; max-height:44px;}
}

.calendar h2 { font-family:'SCDream'; font-size:25px; font-weight:800; color:#333; text-align:center; margin:30px 0; }
.calendar h2 span {font-weight:400;}
.cal {position:relative; padding-left:200px;}
.cal .control {position:absolute; left:0; top:50%; margin-top:-12.5px; }
.cal .control > * { float:left; }
.cal .control a {display:block; width:25px; height:25px; background:url('/img/main/calArrow.png') no-repeat center; text-indent:-9999px; }
.cal .control a.next { transform: scaleX(-1);}
.cal .control p {font-family:'SCDream'; font-size:18px; font-weight:800; line-height:25px; margin:0 10px; }
.cal .control p span {color:#019139;}
.cal a {display:inline-block; width:25px; line-height:25px; height:25px; border-radius:50%; margin:2px 4px; text-align:center; font-size:14px; }
.cal a.data { background:#ebebeb; }
.cal a.sat { color:#006aed; }
.cal a.sun { color:#ed0909; }
.cal a.today { background:#ffcb18; color:#222; font-weight:600; }
.cal_list {margin:30px 0 60px; overflow:hidden;}
.cal_list > * {float:left; width:22%; margin-right:4%; }
.cal_list ul {margin-right:0;}
.cal_list > a {background:#ebf6ef; border-radius:10px; padding:30px; min-height:280px }
.cal_list > a.yellow {background:#fff5bd;}
.cal_list dt span {color:#019139; font-size:15px; font-weight:600; border-top:1px solid #019139; border-bottom:1px solid #019139; line-height:30px; }
.cal_list > a.yellow dt span { color:#bf5e00; border-top:1px solid #bf5e00; border-bottom:1px solid #bf5e00; }
.cal_list dt p { font-size:20px; font-weight:600; line-height:25px; max-height:75px; overflow:hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; margin:10px 0;}
.cal_list dd .text { line-height:22px; min-height:44px;max-height:88px; overflow:hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; margin-bottom:20px; }
.cal_list dd .date {font-size:14px; color:#797979; background:url('/img/main/timeIcon.png') no-repeat left center; padding-left:22px; }
.cal_list li a { position:relative; display:block; border-top:1px solid #dedede; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; line-height:50px; padding-left:30px; }
.cal_list li a::before { content:''; position:absolute; left:10px; top:22px; background:#019139; width:5px; height:5px; border-radius:50%; }
.cal_list li:first-child a {border-top:0;}
@media all and (max-width:1023px){
  .cal_list {margin:30px 0 0;}
  .cal_list > * {width:48%; margin-bottom:30px;}
  .cal_list > *:nth-child(2n) {margin-right:0;}
}
@media all and (max-width:480px){
  .calendar h2 {font-size:20px;}
  .cal {padding-left:0;}
  .cal .control {position:relative; left:auto; top:auto; margin-top:0;}
  .cal_list > * {width:100%; margin-bottom:10px;}
  .cal_list > a {padding:20px; min-height:auto}
  .cal_list dd .text {position:absolute; left:-9999px;}
  .cal_list dt p {font-size:18px;}
}

.cont2 {overflow:hidden; margin-bottom:60px; }
.quick {float:left; width:48%; margin-right:4%; padding-bottom:10px;}
.quick a { position:relative; float:left; width:25%; font-size:17px; text-align:center; padding:80px 20px 20px;  border:1px solid transparent; font-weight:600; color:#444; }
.quick a span {display:block;}
.quick a:hover {background:#feed93; border:1px solid #ffdf3e; box-shadow:5px 5px 5px rgba(0,0,0,0.2); color:#222; }
.quick a::before {content:''; position:absolute; left:50%; top:15px; width:55px; height:55px; margin-left:-27.5px; background:url('/img/main/quick.png') no-repeat 0 0; transition: all 0.3s ease 0.1s;}
.quick a:hover::before {top:7px;}
.quick a.icon2::before { background-position:-55px 0; }
.quick a.icon3::before { background-position:-110px 0; }
.quick a.icon4::before { background-position:-165px 0; }
@media all and (max-width:1200px){
  .quick {width:100%; margin-right:0; padding-bottom:30px;}
}
@media all and (max-width:1023px){
  .cont2 {margin-bottom:30px; }
}
@media all and (max-width:480px){
  .quick a { padding:80px 10px 10px; font-size:15px; letter-spacing:-2px; }
}

.state { position:relative; float:left; width:48%; background:#f4f4f4; border-radius:10px; padding:35px 40px 35px 220px; }
.state h2 { position:absolute; left:40px; top:30px; width:160px; font-size:15px; color:#777; }
.state h2 span { display:block; font-family:'SCDream'; font-weight:800; color:#222; font-size:22px; margin-bottom:10px; }
.state dl { float:left; width:50%; border-left:1px dashed #c3c3c3; padding-left:30px; }
.state dl:nth-child(2) {border-left:0; padding-left:0;}
.state dl dd { font-size:20px; font-weight:bold; }
.state dl dd strong {font-family:verdana; font-size:40px;  color:#019139; }
@media all and (max-width:1200px){
  .state {width:100%;}
}
@media all and (max-width:600px){
  .state {padding:20px; }
  .state h2 {position:relative; left:auto; top:auto; width:100%; text-align:center; margin-bottom:20px;}
  .state h2 span {margin-bottom:5px;}
  .state dl {text-align:center;}
}

.smart {clear:both; background:url('/img/main/smartBg.jpg') no-repeat center; background-size:cover; overflow:hidden; padding:50px 0;}
.smart dl {float:right; width:48%; color:#fff; }
.smart dl dt { font-family:'SCDream'; font-size:30px; font-weight:800; margin-bottom:20px; }
.smart dl dd { font-size:18px;}
.smart dl dd a {display:block; width:180px; background:#2b8c51; padding:15px 30px; border-radius:30px; color:#fff; margin-top:40px; }
.smart dl dd a span { display:block; background:url('/img/main/moreIcon.png') no-repeat right center; }
@media all and (max-width:768px){
  .smart {padding:30px 0;}
  .smart dl {width:100%; text-align:center;}
  .smart dl dd a {margin:40px auto 0; text-align:left;}
}
@media all and (max-width:480px){
  .smart dl dt {font-size:25px;}
  .smart dl dd a {margin:20px auto 0; font-size:16px;}
}

.insta {overflow:hidden; padding:60px 0; }
.insta h2 { font-family:'SCDream'; font-size:25px; font-weight:800; color:#333; text-align:center; margin-bottom:30px; }
.insta h2 span {font-weight:400;}
.insta a { position:relative; float:left; border-radius:10px; width:18.4%; margin:0 0 20px 2%; overflow:hidden;}
.insta a:nth-child(5n+2) { margin:0 0 20px 0;}
.insta a div {position:absolute; display:flex; align-items:center; top:100%; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); color:#fff; transition: all 0.5s ease; }
.insta a div p { margin:0 auto; }
.insta a div p span {position:relative; padding-left:30px; margin:0 10px;}
.insta a div p span::before {content:''; position:absolute; left:0; top:2px; width:20px; height:19px; background:url('/img/main/snsIcon.png') no-repeat 0 0; }
.insta a div p span.comment::before {background-position:-20px 0;}
.insta a:hover div {top:0;}
@media all and (max-width:1023px){
  .insta {padding:30px 0; }
  .insta a { width:23.5%; }
  .insta a:nth-child(5n+2) { margin:0 0 20px 2%;}
  .insta a:nth-child(4n+2) { margin:0 0 20px;}
/*   .insta a:nth-child(10), .insta a:last-child { display:none;  } */
}
@media all and (max-width:768px){
  .insta a { width:32%; }
  .insta a:nth-child(4n+2) { margin:0 0 20px 2%;}
  .insta a:nth-child(3n+2) { margin:0 0 20px;}
  .insta a:nth-child(10) { display:block; }
/*   .insta a:last-child { display:none;  } */
}
@media all and (max-width:480px){
  .insta h2 {font-size:20px;}
}



/* 메인 채용관 */
.company .cont4 a.slick-arrow {position:absolute; z-index:9999; left:0px; top:50%; margin-top:-35px; width:70px; height:70px; background:#333; opacity:0.7; border-radius:50%; text-indent:-9999px;}
.company .cont4 a.slick-arrow::before { content:''; position:absolute; z-index:999; left:50%; top:50%; margin:-6px 0 0 -6px; width:12px; height:12px; border-left:3px solid #fff; border-top:3px solid #fff; transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); -webkit-transform: rotate(-45deg);}
.company .cont4 a.next {left:auto; right:0px;}
.company .cont4 a.next::before { transform: rotate(135deg); -moz-transform: rotate(135deg); -ms-transform: rotate(135deg); -o-transform: rotate(135deg); -webkit-transform: rotate(135deg);}