@charset "utf-8";

/*풀페이지 메뉴*/
.fp_menu {position:fixed; z-index:99; top:50%; right:60px; transform:translateY(-50%);}
.fp_menu a {display:block; width:100%; height:100%;}
.fp_menu .slide_menu {padding-top:110px;}
.fp_menu .slide_menu li {display:block; position:relative; width:2px; height:40px; background: rgba(0, 0, 0, .2);}
.fp_menu .slide_menu li + li {margin-top:0;}
.fp_menu .slide_menu li a {padding:3px 0; text-indent:-9999px; transition:all .3s ease;}
.fp_menu .slide_menu li.on {width:2px; background:#fff;}
.fp_menu .slide_menu li.on a:after {content:''; }
.fp_menu .slide_menu li.on a:before {opacity:1;}
.fp_menu .slide_menu li a:before {content:''; position:absolute; top:0; left:-105px; width:106px; height:40px; opacity:0; background-size:100%; transition:opacity .3s ease;}
.fp_menu .slide_menu li.menu01 a:before {background-image:url(../../images/ico/ico_navov01.png);}
.fp_menu .slide_menu li.menu02 a:before {background-image:url(../../images/ico/ico_navov02.png);}
.fp_menu .slide_menu li.menu03 a:before {background-image:url(../../images/ico/ico_navov03.png);}
.fp_menu .slide_menu li.menu04 a:before {background-image:url(../../images/ico/ico_navov04.png);}

/*메인 비주얼*/
.visual { position:relative; width:100vw; height:100%;}
.visual .slick-slide {position:relative; width:100%; height:100vh; overflow:hidden; transition:all 0.3s ease-in-out;}
.visual .slick-slide.slick-current .img_box{animation:zoomin 6s ease; animation-fill-mode:forwards;}
.visual .slick-slide.slick-current .txt strong {animation:fadeUp .9s ease .3s; animation-fill-mode:forwards;}
.visual .slick-slide.slick-current .txt p {animation:fadeUp .9s ease .9s; animation-fill-mode:forwards;}
.visual  [class^="visual0"] .img_box{position:absolute; left:0; right:0; top:0; bottom:0; background-position:center center; background-repeat:no-repeat; background-size:cover;}
.visual .visual01 .img_box {background-image:url(../../images/pic/main_visual01.jpg);}
.visual .visual02 .img_box {background-image:url(../../images/pic/main_visual02.jpg);}
.visual .visual03 .img_box {background-image:url(../../images/pic/main_visual03.jpg);}
.visual .inner{width:1640px;}
.visual .txt {position:relative; top:50%; padding-bottom:90px; transform:translateY(-50%); z-index:1; }
.visual .txt strong {display:block; position:relative; top:50px; font-size:60px; font-weight:700; opacity:0; color:#fff;}
.visual .txt strong span{color:#e7161a;}
.visual .txt p {position:relative; top:50px; margin-top:35px; font-size:18px; color:#fff; opacity:0; font-weight:300; line-height:1.5;}
.visual .visual02 .txt strong {color:#fff;}
.visual .visual02 .txt p {color:#fff;}
.visual .visual03 .txt strong {color:#fff; text-shadow:0px 0px 7px rgba(0.45);}
.visual .visual03 .txt p {color:#fff; text-shadow:0px 0px 7px rgba(0.45);}
.visual .slick-dots {position:absolute; z-index:1; left:140px; top:50%; margin-top:70px;}
.visual .slick-dots li {display:inline-block; position:relative; width:12px; height:12px; text-indent:-9999px; cursor:pointer; border-radius:12px; border:1px solid #fff;}
.visual .slick-dots li + li {margin-left:10px;}
.visual .slick-dots li:before {content:''; position:absolute; z-index:1; left:50%; top:50%; width:6px; height:6px; border-radius:6px; transform:translate(-50%,-50%);}
.visual .slick-dots li.slick-active {border:1px solid #fff; background: #fff;}
.visual .visual_ctrl {position:absolute; z-index:1; left:250px; top:50%; width:18px; height:18px; margin-top:66px;}
.visual .visual_ctrl a {display:block; width:100%; height:100%; text-indent:-9999px; background-repeat:no-repeat; background-position:center;}
.visual .visual_ctrl a.pause {background-image:url(../../images/ico/ico_pause.png);}
.visual .visual_ctrl a.play {background-image:url(../../images/ico/ico_play.png);}
/*****애니메이션******/
@keyframes zoomin {
	0% {transform:scale(1.3);}
	100% {transform:scale(1);}
 }
@keyframes fadeUp {
	0% {top:100px; opacity:0;}
	100% {top:0; opacity:1;}
}

/*메인 콘텐츠*/
[class^="main_con"] > div:after {content:''; display:block; clear:both;}
[class^="main_con"] .tit_con h3 {font-size:12px; font-weight:900; color:#02964e; letter-spacing: .1rem; margin-bottom:14px;}
[class^="main_con"] .tit_con h4 {font-size:46px; font-weight:700; color: #111; line-height:2.5rem; margin-bottom:45px;}
[class^="main_con"] .tit_con h4 em {display: block;}
[class^="main_con"] .tit_con p {font-size:18px; line-height:1.5rem; }
[class^="main_con"] .tit_con p em{display: block;}
[class^="main_con"]:nth-child(3) .tit_con h4 {color: #fff;}
[class^="main_con"]:nth-child(3) .tit_con p {color: #fff; opacity: .6;}
/*
[class^="main_con"] > div > div {width:50%; height:100%;}
[class^="main_con"] .txt {float:left; position:relative;}
[class^="main_con"] .txt > div {position:absolute; top:50%; width:100%; padding:0 68px 0 109px; transform:translateY(-50%);}
[class^="main_con"] .txt [class^="empha0"] {font-weight:500;}
[class^="main_con"] .txt .empha01 {color:#000;}
[class^="main_con"] .txt .empha02 {color:#265fb2;}
[class^="main_con"] .img {float:right; height:100%; background-size:cover; background-repeat:no-repeat; background-position:center;}
[class^="main_con"]:nth-child(odd) .txt {float:right;}
[class^="main_con"]:nth-child(odd) .img {float:left;}
*/
.main_con01 {position:relative;}
.main_con01 .tit_con {position:absolute; top:26%; width:300px; transform:translateY(-50%); z-index:1;}
.main_con01 .main_pro_list {display:flex; justify-content:flex-end; align-items: center; margin-top:80px; z-index: 90; }
.main_con01 .main_pro_list .pro_grid_item {width:300px; margin-right:10px; overflow: hidden; }
.main_con01 .main_pro_list .pro_grid_item.last {width:440px;}
.main_con01 .main_pro_list .pro_grid_item .item {overflow:hidden; margin-top: 10px; transition:all .3s; -webkit-transition:all .3s;}
.main_con01 .main_pro_list .pro_grid_item .item:first-child{margin-bottom: 10px;}
.main_con01 .main_pro_list .pro_grid_item .item:hover {transform:translateY(-10px); -webkit-transform:translateY(-5px); }
.main_con01 .main_pro_list .pro_grid_item .item.one {background:url(../../images/pic/main_lineup01.jpg) no-repeat center; height:250px; background-size:cover;}
.main_con01 .main_pro_list .pro_grid_item .item.two {background:url(../../images/pic/main_lineup02.jpg) no-repeat center; height:360px; background-size:cover;}
.main_con01 .main_pro_list .pro_grid_item .item.three {background:url(../../images/pic/main_lineup03.jpg) no-repeat center; height:250px; background-size:cover;}
.main_con01 .main_pro_list .pro_grid_item .item.four {background:url(../../images/pic/main_lineup04.jpg) no-repeat center; height:250px; background-size:cover;}
.main_con01 .main_pro_list .pro_grid_item .item.five {background:url(../../images/pic/main_lineup05.jpg) no-repeat center; height:220px; background-size:cover;}
.main_con01 .main_pro_list .pro_grid_item .item.six {background:url(../../images/pic/main_lineup06.jpg) no-repeat center; height:220px; background-size:cover;}
.main_con01 .main_pro_list .pro_grid_item .item.seven {background:url(../../images/pic/main_pro04.jpg) no-repeat center; height:233px; background-size:cover;}
.main_con01 .main_pro_list .pro_grid_item .item.eight {background:url(../../images/pic/main_pro05.jpg) no-repeat center; height:233px; background-size:cover;}
.main_con01 .main_pro_list .pro_grid_item .item .tit {padding:40px 0 0 28px; color:#fff; font-size:30px; font-weight:600; text-shadow: 1px 1px 5px #888;}
.main_con01 .txt_samshin {position: absolute; bottom:0; left:-20px; z-index:1;}
.main_con01 .txt_samshin span {font-size:170px; font-weight:800; color: #efefef; line-height: 2rem;}

.main_con02 {background: url(../../images/pic/main_about_bg.jpg) no-repeat center; background-size: cover; }
.main_con02 .inner {width: auto; padding: 0 0 0 140px;}
.main_con02 .tit_con {position:relative; }
.main_con02 .quick_con {position:relative; margin-top:130px;}
.main_con02 .quick_con ul {display:flex; justify-content:flex-start; align-items: center; }
.main_con02 .quick_con ul li {margin-right: 14px; width: 170px; background-repeat: no-repeat; background-position: center 30px; background-size:70px; transition:all .3s; -webkit-transition:all .3s;}
.main_con02 .quick_con ul li a { display: block; height: 170px; border: 1px solid rgba(255, 255, 255, .2); border-radius: 10px;}
.main_con02 .quick_con ul li:nth-child(1) {background-image: url(../../images/ico/ico_about_quick01.png);}
.main_con02 .quick_con ul li:nth-child(2) {background-image: url(../../images/ico/ico_about_quick02.png);}
.main_con02 .quick_con ul li:nth-child(3) {background-image: url(../../images/ico/ico_about_quick03.png);}
.main_con02 .quick_con ul li:nth-child(4) {background-image: url(../../images/ico/ico_about_quick04.png);}
.main_con02 .quick_con ul li a span { display: block; padding-top:120px; font-size: 18px; font-weight: 600; color:#fff; text-align: center; transition:all .3s; -webkit-transition:all .3s;}
.main_con02 .quick_con ul li:hover a {border: 1px solid rgba(2, 150, 78, 1); }
.main_con02 .quick_con ul li:hover:nth-child(1) {border-radius: 10px; background: #02964e url(../../images/ico/ico_about_quick01.png) no-repeat center 40px; transition:all .3s; -webkit-transition:all .3s;}
.main_con02 .quick_con ul li:hover:nth-child(2) {border-radius: 10px; background: #02964e url(../../images/ico/ico_about_quick02.png) no-repeat center 40px; transition:all .3s; -webkit-transition:all .3s;}
.main_con02 .quick_con ul li:hover:nth-child(3) {border-radius: 10px; background: #02964e url(../../images/ico/ico_about_quick03.png) no-repeat center 40px; transition:all .3s; -webkit-transition:all .3s;}
.main_con02 .quick_con ul li:hover:nth-child(4) {border-radius: 10px; background: #02964e url(../../images/ico/ico_about_quick04.png) no-repeat center 40px; transition:all .3s; -webkit-transition:all .3s;}
.main_con02 .quick_con ul li:hover a span { padding-top:116px; transition:all .3s; -webkit-transition:all .3s;}

.main_con03 .left { position:absolute; top:50%; width: calc(100% - 40%); transform:translateY(-50%); padding-left: 140px;}
.main_con03 .left .tit_con {position:relative; }
.main_con03 .left .news_warp {position: relative; overflow: hidden; margin-top: 85px; margin-right: 100px; } 
.main_con03 .left .news_warp .news_list .n_slide { display: block; }
.main_con03 .left .news_warp .news_list .n_slide .item.slick-slide.slick-current{background: #fff; border: 1px solid #000; box-shadow: 4px 4px 20px 0px rgb(0 0 0 / 25%); transition:all .3s; -webkit-transition:all .3s;}
.main_con03 .left .news_warp .news_list .n_slide .item {position: relative; width: 100%; margin-right: 20px; padding:32px; background: #efefef; border: 1px solid #f5f5f5; color:#888;}
.main_con03 .left .news_warp .news_list .n_slide .item:hover { background: #fff; border: 1px solid #000; box-shadow: 4px 4px 20px 0px rgb(0 0 0 / 25%); transition:all .3s; -webkit-transition:all .3s;}
.main_con03 .left .news_warp .news_list .n_slide .tit .info {font-size: 20px; color: #000; font-weight: 600; height:62px; margin-top: 20px; overflow: hidden; text-overflow: ellipsis; word-wrap:break-word;
	display: -webkit-box;
	-webkit-line-clamp: 2; /* 라인수 */
	-webkit-box-orient: vertical;
	line-height: 1.2em;
	height: 2.4em;
}
.main_con03 .left .news_warp .news_list .n_slide .date { border-top: 1px solid #ccc; margin-top: 34px;}
.main_con03 .left .news_warp .news_list .n_slide .date span {display: block; margin-top: 34px;}
.main_con03 .left .news_warp .news_list .n_slide .slick-list .slick-track {margin-left: 0;}
.main_con03 .left .news_warp .news_list .control {margin-top: 20px; display: flex; align-items: center; }
.main_con03 .left .news_warp .news_list .control .bar {width: calc(100% - 20px); height: 5px; background: #e5e5e5;position: relative; border-radius: 5px; overflow: hidden;}
.main_con03 .left .news_warp .news_list .control .bar .progress {position: absolute; left: 0; top: 0; display: block; width: 30%; height: 100%; background:#02964e; border-radius: 5px; transition: 0.4s;}

.main_con03 .right {position: relative; overflow: hidden; margin-left: 60%; width: 40%; }
.main_con03 .right .tit_con {position:relative; }
.main_con03 .right .tit_con h4 {color: #fff;}
.main_con03 .right .tit_con p {color: #fff; opacity: .6;}
.main_con03 .right li {display: flex; align-items: center; position: relative; overflow: hidden; padding-left: 40px; background-repeat: no-repeat; background-position: center; background-size: cover; height: 50vh; cursor: pointer;}
.main_con03 .right li.career {background-image: url(../../images/pic/main_career_bg.jpg);}
.main_con03 .right li.cs {background-image: url(../../images/pic/main_cs_bg.jpg); }




/******************************************************************************************************************************************/
@media all and (max-width:1701px){
	
}
@media all and (max-width:1401px){
    .visual .inner{width:100%;}

	/*메인 콘텐츠*/
	[class^="main_con"] .tit_con h4 {font-size:36px; line-height:2.5rem; margin-bottom:45px;}
	.main_con01 .tit_con {left: 80px;}
	.main_con01 .main_pro_list {margin-left: 60px; justify-content:flex-start; align-items:flex-end; }
	.main_con01 .txt_samshin span {font-size:3.5rem;}

	.main_con02 .inner {width: auto; padding: 0 0 0 80px;}
	.main_con03 .left {padding-left: 80px;}
	.main_con03 .left .news_warp {margin-right: 80px; } 
	
}

/*태블릿*/
@media all and (max-width:1025px){
	
	.fp_menu {display:none;}
    .fp-auto-height .fp-slide, .fp-auto-height .fp-tableCell, .fp-auto-height.fp-section {height:auto !important;}
	
	/*메인 비주얼*/
	.visual .slick-slide {/*height: 400px;* 세로사이즈 줄일 경우*/}
	.visual .slick-dots {left:26px;}
	.visual .visual_ctrl {left:120px;}

	/*메인 콘텐츠*/
	[class^="main_con"] .tit_con h4 {margin-bottom: 25px;}
	[class^="main_con"] .tit_con h4 em,
	[class^="main_con"] .tit_con p em {display:inline-block;}
	.main_con01 .inner {position: relative; padding: 60px;}
	.main_con01 .tit_con {position:relative; top:auto; left:0; width:100%; transform:none;}
	.main_con01 .txt_samshin {display: none;}
	.main_con01 .main_pro_list {align-items:center; margin: 0; }
	.main_con01 .main_pro_list .pro_grid_item .item .tit {font-size:24px; }
	.main_con02 .inner {padding: 60px;}
	.main_con01 .main_pro_list {flex-wrap: wrap;}
	.main_con01 .main_pro_list .pro_grid_item { width: 33%; margin-right:2px;}
	.main_con01 .main_pro_list .pro_grid_item .item.one,
	.main_con01 .main_pro_list .pro_grid_item .item.two,
	.main_con01 .main_pro_list .pro_grid_item .item.three,
	.main_con01 .main_pro_list .pro_grid_item .item.four,
	.main_con01 .main_pro_list .pro_grid_item .item.five,
	.main_con01 .main_pro_list .pro_grid_item .item.six { height: 360px;}
	.main_con01 .main_pro_list .pro_grid_item.ty2 {display: flex; width: 66%; }
	.main_con01 .main_pro_list .pro_grid_item.ty2 a {width: 50%; margin-right:2px }
	.main_con01 .main_pro_list .pro_grid_item.ty3 {display: flex; width: 100%; }
	.main_con01 .main_pro_list .pro_grid_item.ty3 a {width: 50%; margin-right:2px }
	.main_con01 .main_pro_list .pro_grid_item.last {display: flex; width: 100%;}
	.main_con01 .main_pro_list .pro_grid_item.last a {width: calc(100% / 2);}
	.main_con01 .main_pro_list .pro_grid_item.last a:first-child{margin-right: 2px;}

}
	

@media all and (max-width:768px){
	.fp-tableCell {display:block;}

	/*메인 비주얼*/
	.visual .txt strong{font-size:48px;}
	.visual .txt p{font-size:16px;}
	.visual .slick-dots {top:inherit; left:50%; bottom:50px; margin-top:0;  margin-left: -50px;}
	.visual .visual_ctrl {top:inherit; left:55%; bottom:50px; margin-top:0;}

	/*메인 콘텐츠*/
	.main_con01 .main_pro_list .pro_grid_item.ty3 a {width: 33%; }
	.main_con02 .quick_con {margin-top: 80px;}
	.main_con02 .quick_con ul { justify-content: center;}
	.main_con02 .quick_con ul li:last-child{ margin-right: 0;}
	.main_con03 .left { position:relative; top: auto; width: 100%; transform: none; padding: 60px;}
	.main_con03 .left .news_warp {margin-right: 0;}
	.main_con03 .right {margin-left:0; width: 100%;}
	.main_con03 .right li {height: 280px;}
}

/*모바일*/
@media all and (max-width:640px){
	/*메인 콘텐츠*/
	.main_con01 .inner {padding: 40px 26px;}
	.main_con01 .main_pro_list .pro_grid_item { width: 32.333%; }
	.main_con01 .main_pro_list .pro_grid_item .item.one,
	.main_con01 .main_pro_list .pro_grid_item .item.two,
	.main_con01 .main_pro_list .pro_grid_item .item.three,
	.main_con01 .main_pro_list .pro_grid_item .item.four,
	.main_con01 .main_pro_list .pro_grid_item .item.five,
	.main_con01 .main_pro_list .pro_grid_item .item.six { height: 200px;}
	.main_con01 .main_pro_list .pro_grid_item.center { }
	.main_con01 .main_pro_list .pro_grid_item .item .tit {padding:40px 0 0 18px;}
	.main_con02 .inner {padding: 40px 26px;}
	.main_con02 .quick_con ul {display:block;}
	.main_con02 .quick_con ul li { float: left; margin-right: 8px; width: 48%; margin-bottom: 8px;}
	.main_con02 .quick_con ul li:nth-of-type(even) {margin-right: 0;}
	.main_con03 .left { padding: 40px 26px;}
	.main_con03 .left .news_warp {margin-top: 40px;}

}

@media all and (max-width:480px){
	

}