@charset "utf-8";
/* *******************************************************
 * filename : main.css
 * description : 메인 레이아웃 및 컨텐츠 CSS
 * date : 2020-11-25
******************************************************** */
#mainContainer {position:relative; }
#mainContainer:before {content:""; width:82px; height:159px; background-color:#151515; position:absolute; left:0; top:0; z-index:-1;}

/* ******************  메인 비주얼 ********************** */
#mainVisual{overflow:hidden; width:100%; height:1000px; position:relative;}	/* 비주얼높이값 이미지에맞게 수정 */
.main-visual-con .slick-track,
.main-visual-con .slick-list {
	 -webkit-perspective: 2000;
	-webkit-backface-visibility: hidden;
}
.main-visual-con, 
.main-visual-con .slick-list,  
.main-visual-con .slick-track, 
.main-visual-item{
	height:100%;  
}
.main-visual-con{z-index:1;}
/* 메인 비주얼 :: 이미지 */
.main-visual-item {position:relative; padding-left:82px; -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
 box-sizing: border-box; }
.main-visual-item .main-visual-pc-img {
	width:100%;
	height:100%;
	overflow:hidden;
}
.main-visual-item .main-visual-pc-img .bg {display:block; width:100%; height:100%; 	
	background-size:cover !important;
    -webkit-transform: scale(1.05,1.05);
     transform: scale(1.05,1.05);
	-webkit-transition:transform 5000ms  ease-in-out ;
    transition:transform 5000ms ease-in-out;
}
.main-visual-item .main-visual-m-img{display:none;}

/* 메인 비주얼 :: 텍스트 */
.main-visual-item .main-visual-txt-con{
	position:absolute; 
	top:50%; left:0px; 
	width:100%; 
	-webkit-transform: translateY(-100%);
	transform: translateY(-100%);
}
.main-visual-item .main-visual-txt-con .main-visual-txt1,
.main-visual-item .main-visual-txt-con .main-visual-txt2 {
	opacity:0; font-size:70px; letter-spacing:-0.35px; color:#fff; line-height:1.22em;
}

/* 메인 비주얼 :: active효과 */
.main-visual-item.active-item .main-visual-pc-img .bg{
    -webkit-transform: scale(1.0,1.0) rotate(0.002deg);
     transform: scale(1.0,1.0) rotate(0.002deg);
}
.main-visual-item.active-item .main-visual-txt1,
.main-visual-item.active-item .main-visual-txt2{
	-webkit-animation: text-active-animation 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;
	animation: text-active-animation 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;
}
.main-visual-item.active-item .main-visual-txt-con .main-visual-txt1{ -webkit-animation-delay:0.1s; animation-delay:0.1s;}
.main-visual-item.active-item .main-visual-txt-con .main-visual-txt2{ -webkit-animation-delay:0.3s; animation-delay:0.3s;}

@keyframes text-active-animation {
	from {
		opacity:0;filter:Alpha(opacity=0);
		-webkit-transform: translateY(50px); 
		transform: translateY(50px); 
	}
	to {
		opacity:1.0;filter:Alpha(opacity=100);
		-webkit-transform: translateY(0); 
		transform: translateY(0); 
	}
}
@keyframes text-fade-out {
	from {
		opacity:1.0;filter:Alpha(opacity=100);
	}
	to {
		opacity:0;filter:Alpha(opacity=0);
	}
}
/* 메인 비주얼 :: 카운터 */
.main-visual-conuter {position:absolute; top:50%; margin-top:6.04vw; left:0; width:100%; z-index:11; font-size:20px; color:#fff; letter-spacing:-1px; }
.main-visual-conuter .inner-box {position:relative; width: 165px; text-align:center;}
.main-visual-conuter .count-box {display:inline-block; line-height:33px;}
.main-visual-conuter span,
.main-visual-conuter .middle{display:inline-block; vertical-align:middle; font-family: 'Noto Sans KR', sans-serif; font-weight:600}
.main-visual-conuter .middle{margin:0 20px; width:1px; height:14px; background-color: rgba(255,255,255,0.5);}
.main-visual-conuter .total-num {opacity:0.4;filter:Alpha(opacity=40);}

/* 메인 비주얼 :: 화살표 */
.main-visual-conuter .slick-arrow {position:absolute; top:0; border:0; cursor:pointer; z-index:9; font-size:22px; color:#fff; text-shadow:1px 1px 1px rgba(0,0,0,0.2)}
.main-visual-conuter .slick-arrow.slick-prev{left:-8px;}
.main-visual-conuter .slick-arrow.slick-next{right:-8px;}
.main-visual-conuter .slick-arrow i {vertical-align:middle;}

/* ******************  메인 컨텐츠 ********************** */
/* -------- 메인 컨텐츠 :: 공통 -------- */
/* 공통 :: 타이틀 */
.main-tit-box{letter-spacing:-1.5px; text-align:center;}
.main-tit-box .main-tit{color:#151515; font-size:60px; line-height:1.21em;}
.main-tit-box .main-sub-tit{display:block; margin-bottom:15px; color:#97e00f; font-size:24px; line-height:1.5; font-weight:600; }
.main-tit-box .main-tit-txt{ color:#fff; font-size:20px; line-height:1.75; opacity:0.85;filter:Alpha(opacity=85); margin-top:40px;}

/* -------- 메인 컨텐츠 :: Product -------- */
#mainProductCon {position:relative; padding: 108px 0 173px;}
#mainProductCon:before {content:""; width:27.08vw; height:0; background-color: #a1f107; position:absolute; right:0; top:0; transition: height 0.7s ease-in-out; transition-delay:0.2s; }
#mainProductCon.aos-animate:before {height:100%;}
.main-product-con {position:relative; max-width:1400px; margin:70px auto 0; padding:0 124px;}
.main-product-slide { }
.main-product-slide .slick-list { }
.main-product-slide .slick-track {display:flex; padding:30px 0; justify-content: space-between;}
.main-product-slide li {float:none; margin:0 13px; transition: all 0.4s;}
.main-product-slide li a {display:block; border:1px solid #ddd; padding-bottom:40px; background-color:#fff; text-align:center; transition: all 0.4s; -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
 box-sizing: border-box; }
/* .main-product-slide li:not(.slick-active) {opacity:0;filter:Alpha(opacity=00); visibility:hidden;} */
.main-product-slide li a dd {padding:20px 15px 0; }
.main-product-slide li a .img-wrap {position:relative; padding-top:63.33%;}
.main-product-slide li a .img-wrap span {display:block; position:absolute; top:5%; left:5%; right:5%; bottom:5%; }
.main-product-slide li a .name {display:block; font-size: 30px; color:#222; letter-spacing:-0.35px; }
.main-product-slide li a .txt {font-size: 19px; line-height:1.6em; height:3.2em; color:#5d5d5d; letter-spacing:-0.75px; margin:25px 0 35px; }
.main-product-slide li a .more {display:block; width:177px; height:52px; background-color:#262723; border-radius:50px; color:#fff; font-size:17px; font-weight:500; line-height:52px; margin:0 auto;  transition: all 0.4s;}
.main-product-con .slick-arrow {position:absolute; top:50%; margin-top:-20px; font-size:40px; color:#000; z-index:999;}
.main-product-con .slick-arrow.slick-prev {left:0;}
.main-product-con .slick-arrow.slick-next {right:0;}
/* ie */
.ie-browser #mainProductCon:before {transition: height 0.5s;}

@media all and (min-width:801px){
	.main-product-slide li a:hover { box-shadow:0px 0px 16px rgba(0, 0, 0, .17); border-color:#fff; }
	.main-product-slide li a:hover .more {background-color:#a1f107; color:#262723;}
	.ie-browser .main-product-slide li a .more {line-height:50px;}
}

/* -------- 메인 컨텐츠 :: Gutermann -------- */
#mainGuterCon {height:744px; background:url("/images/main/main_gutermann_bg.jpg") center no-repeat; background-size:cover; }
.main-guter-con {display:flex; height:100%;}
.main-guter-con .txt-con { width:calc(100% - 27.08vw); padding-left:7.29vw; padding-right:30px; -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
 box-sizing: border-box; }
.main-guter-con .txt-con .main-tit-box {text-align:left;}
.main-guter-con .txt-con .main-tit-box .main-sub-tit {margin-bottom:30px;}
.main-guter-con .txt-con .main-tit-box .main-tit {color:#fff; }
.main-guter-con .txt-con .main-tit-box .main-tit-txt {font-weight:300;}
.main-guter-con .link-con {width:27.08vw;}
.main-guter-con .link-con .link-btn {display:block; width:100%; height:50%; text-align:center; color:#fff; border-left:1px solid rgba(255,255,255,0.3);transition: all 0.4s; }
.main-guter-con .link-con .link-btn.gutermann {border-bottom:1px solid rgba(255,255,255,0.3);}
.main-guter-con .link-con .link-btn.gutermann .tit {position:relative; display:block; padding-top:70px; background:url("/images/main/main_gutermann_logo_w.png") center no-repeat; }
.main-guter-con .link-con .link-btn .tit {font-size:32px; transition: all 0.4s;}
.main-guter-con .link-con .link-btn .txt {font-size: 30px; letter-spacing:-0.75px;font-weight:500; transition: all 0.4s;}
.main-guter-con .link-con .link-btn .txt:before {content:"\ea40"; display:block; font-size:29px; font-family: 'xeicon'; margin:44px 0; transition: all 0.4s;}

/* 오버시 */
@media all and (min-width:801px){
	.main-guter-con .link-con .link-btn:hover {background-color: #a1f107;}
	.main-guter-con .link-con .link-btn:hover .tit ,
	.main-guter-con .link-con .link-btn:hover .txt,
	.main-guter-con .link-con .link-btn:hover .txt:before {color: #455560;}
	.main-guter-con .link-con .link-btn.gutermann:hover .tit {background-image:url("/images/main/main_gutermann_logo.png"); }
}

/* -------- 메인 컨텐츠 :: minCam -------- */
#mainmincamCon {height:739px; }
.main-mincam-con {display:flex; height:100%;}
.main-mincam-con .txt-con { width:calc(100% - 27.08vw); padding:4.89vw 30px 0 4.89vw; background:url("/images/main/main_mincam_bg.jpg") center no-repeat; background-size:cover; -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
 box-sizing: border-box; }
.main-mincam-con .txt-con .main-tit-box {text-align:left; }
.main-mincam-con .txt-con .main-tit-box .main-sub-tit {color:#05334b; margin-bottom:30px;}
.main-mincam-con .txt-con .main-tit-box .main-tit {color:#242424;}
.main-mincam-con .link-con {width:27.08vw;}
.main-mincam-con .link-con .link-btn {display:block; width:100%; height:50%; text-align:center; color:#fff; border-left:1px solid rgba(255,255,255,0.3); background-color:#05334b; transition: all 0.4s; }
.main-mincam-con .link-con .link-btn.mincam {border-bottom:1px solid rgba(255,255,255,0.3); background-color: #ffd530; color:#455560;}
.main-mincam-con .link-con .link-btn.mincam .tit {position:relative; display:block; padding-top:58px; background:url("/images/main/main_mincam_logo.png") center no-repeat; }
.main-mincam-con .link-con .link-btn .tit {font-size:32px; transition: all 0.4s;}
.main-mincam-con .link-con .link-btn .txt {font-size: 30px; letter-spacing:-0.75px; font-weight:500; transition: all 0.4s;}
.main-mincam-con .link-con .link-btn .txt:before {content:"\ea40"; display:block; font-size:29px; font-family: 'xeicon'; margin:44px 0; transition: all 0.4s;}

/* -------- 메인 컨텐츠 :: SNS -------- */
#mainSnsCon {padding:100px 0;}
.main-sns-con {display:flex;  justify-content: center; justify-content: space-between;}
.main-sns-con .main-sns-item {width:18.41%;   border:1px solid #ddd; border-radius:50%; text-align:center; transition:all 0.4s; -webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
 box-sizing: border-box; }
.main-sns-con .main-sns-item a {position:relative; padding-top:100%; display:block;  }
.main-sns-con .main-sns-item a .inner-box {position:absolute; top:50%; width:100%; transform:translateY(-50%);}
.main-sns-con .main-sns-item a dd {font-size:24px; letter-spacing:-0.65px; line-height: 1.41em; font-weight:500; color:rgba(0,0,0,0.85); margin-top:1.25vw}
/* 오버시 */
@media all and (min-width:801px){
	.main-sns-con .main-sns-item:hover {background-color: #a1f107; border-color:#a1f107; }
}

/* -------- 메인 컨텐츠 :: 공지사항 -------- */
#mainNoticeCon {padding: 130px 0; background:url("/images/main/main_notice_bg.jpg") center no-repeat; background-size:cover; }
.main-notice-tit {text-align:center; font-size:56px; color: #242424; }
.main-notice-con { position:relative; padding:0 124px; max-width:1400px; margin:80px auto 0;}
.main-notice-con .main-notice-slide {margin:0 -16.5px;}
.main-notice-con .main-notice-slide li {margin:0 16.5px;}
.main-notice-con .main-notice-slide li a{ display:block;  }
.main-notice-con .main-notice-slide .img-wrap {position:relative; padding-top:55.48%; display:block; overflow:hidden;}
.main-notice-con .main-notice-slide .img-wrap:before {content:""; width:0; height:6px; background-color:#9cdb23; position:absolute; left:0; bottom:0; z-index:99; transition: all 0.6s;}
.main-notice-con .main-notice-slide .img-wrap .notice {position:absolute; top:0; left:0; background-color: #89cb16; z-index:9; color:#fff; display:block; padding:5px 10px;}
.main-notice-con .main-notice-slide .tit {display:block; font-size:23px; color:#333; font-weight:500; letter-spacing:-0.65px; line-height:1.39em; height:2.78em; margin-top: 30px;}
.main-notice-con .main-notice-slide .date {display:block; font-size: 18px; color:#878787; margin-top: 42px;}
.main-notice-con .slick-arrow {position:absolute; top:calc(50% - 76.5px); margin-top:-30px;  font-size: 40px; color:#000; transition: opacity 0.4s;}
.main-notice-con .slick-arrow.slick-prev {left:0;}
.main-notice-con .slick-arrow.slick-next {right:0;}
.main-notice-con .slick-arrow.slick-disabled {}
/* 오버시 */
@media all and (min-width:801px){
	.main-notice-con .main-notice-slide li a:hover .img-wrap:before {width:100%; }
	.main-notice-con .slick-arrow:hover {opacity:0.25;filter:Alpha(opacity=25);}
}