@charset "utf-8";
/* *******************************************************
 * filename : main.css
 * description : 메인 레이아웃 및 컨텐츠 CSS
 * date : 2020-11-25
******************************************************** */

#wrap.index-wrapper #header,
#wrap.index-wrapper .main-scroll-icon,
#wrap.index-wrapper .main-visual-arrow{
	opacity:0;filter:Alpha(opacity=0);
	 -webkit-transition: opacity  4s cubic-bezier(.19,1,.22,1) 0.5s;
    transition: opacity 4s cubic-bezier(.19,1,.22,1) 0.5s;
}
#wrap.index-wrapper .visual-circle-box{
	opacity:0;filter:Alpha(opacity=0);
	 -webkit-transition: opacity 4s cubic-bezier(.19,1,.22,1);
    transition: opacity 4s cubic-bezier(.19,1,.22,1);
}
/* load */
#wrap.index-wrapper.load #header,
#wrap.index-wrapper.load .visual-circle-box,
#wrap.index-wrapper.load .main-scroll-icon,
#wrap.index-wrapper.load .main-visual-arrow{opacity:1;filter:Alpha(opacity=100);}
#wrap.index-wrapper.load #header{transition-delay:0.2s;}
#wrap.index-wrapper.load .visual-circle-box,
#wrap.index-wrapper.load .main-scroll-icon{transition-delay:0.5s;}


/* ******************  메인 비주얼 ********************** */
#mainVisual{overflow:hidden; width:100%; height:100vh; position:relative; background-color:#000;}
/* .main-visual-container{position:fixed; top:0; left:0; width:100%; height:100%;} */
#mainContent {position:relative; z-index:11;}
.main-visual-item{
	position:relative; height:100%; overflow:hidden;
}
.main-visual-con{z-index:1;}
/* 메인 비주얼 :: 이미지 */
.main-visual-container,
.main-visual-swiper{position:relative; z-index:auto; width: 100%; height:100%;}
.main-visual-container .swiper-slide {
	overflow: hidden;
	background-color:#333;
}
.main-visual-container .slide-inner {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
	background-size: cover !important;
	background-position: center;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: left;
	background-color: #000;
}
.main-visual-item .main-visual-img{
    display:block;
    width:100%;
    height:100%;
    background-size:cover !important;
}
.main-visual-con video{
	position: absolute;
	top: 50%;
	left: 50%;
	min-width: 100%;
	min-height: 100%;
	width: auto;
	height: auto;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

/* 메인 비주얼 :: 텍스트 */
.main-visual-txt-con{
	position:absolute; 
	top:50%; left:0px; opacity: 0;
	width:100%; z-index:999;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	-webkit-transition: opacity 0.5s; transition: opacity 0.5s;
}
.main-visual-txt-con .main-visual-txt-inner {}
.main-visual-txt-con .inner-box {display:table; width:100%; height:100%; position: relative;}
.main-visual-txt-con .txt-box {width: 50%; color: #fff; display:table-cell; vertical-align:middle; position:relative;}
.main-visual-txt-con .txt-box .txt01 {font-size: 80px; font-weight: 600; letter-spacing: -0.6px; letter-spacing: -2.5px; display:block; opacity:0;}

/* active효과 */
.swiper-slide-active .main-visual-txt-con{opacity: 1; transition-delay:0.5s;}
.swiper-slide-active .main-visual-txt-con .txt-box .txt01{
	-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;
}
.swiper-slide-active .main-visual-txt-con .txt-box .txt01{ -webkit-animation-delay:0.3s; animation-delay:0.3s;}
.swiper-slide-active .main-visual-txt-con .txt-box .txt01.splitting .char{
	-webkit-animation: text-fade-out 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;
	animation: text-fade-out 1.5s cubic-bezier(0.4, 0, 0.2, 1) both;
}
.swiper-slide-active .main-visual-txt-con .txt-box .txt01.splitting .char{
	-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;
}

@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);
	}
}


/* -------- 메인비주얼 :: Circle -------- */
.visual-circle-box{position:absolute; left:0; width: 100%; top:50%; transform:translate(0, -50%); z-index:11; text-align: right;}
.visual-circle-box .circle-box {margin-right: 45px; display: inline-block; position:relative; width:80px; height:80px; border:2px solid #fff; border-radius: 50%; z-index:11; box-sizing:border-box;}
.visual-circle-box .circle-box:before{position: absolute; top: 50%; left: 50%; margin-top: -88px; margin-left: -88px; content: ''; width: 176px; height: 176px; background: url("../images/main/visual_circle_bg.png") center/cover no-repeat; animation: spin 10s infinite linear;}
.visual-circle-box .circle-box .play-btn{position:absolute; top:50%; left:50%; margin-left: 2px; transform:translate(-50%,-50%); background:none;}
.visual-circle-box .circle-box svg{overflow: visible; position:absolute; top:-1px; left:-1px; width:78px; height:78px; fill:none; stroke:#fff; transform:rotate(-90deg);}
.visual-circle-box .circle-box svg circle { transform-origin: center; stroke: #fac800; stroke-dasharray: 401.4743; stroke-dashoffset: 401.4743; stroke-width: 4px;}

@keyframes spin {
    0%  {transform: rotate(0deg);}
    100% {transform: rotate(-360deg);}
}


/* 메인 비주얼 :: 스크롤아이콘 */
.main-scroll-icon{position:absolute; top: 50%; margin-top: 150px; width: 100%; left:0; z-index:999;}
.main-scroll-icon .scroll-bg{position: relative;}
.main-scroll-icon .scroll-bg:before{display:block; top: 0; left: 0; content: ''; width: 88px; height: 88px; background-color: #ffc90a; -webkit-border-radius: 100%; border-radius: 100%;}
.main-scroll-icon .scroll-bg .txt{animation: upDown 1.5s ease-in-out infinite;}
.main-scroll-icon .scroll-bg .txt span{display: block; position: absolute; width: 80px; height: 10px; top: -15px; left: 5px; font-size: 9px; font-weight:600; color:rgba(255,255,255,0.7); text-transform: uppercase; transform: rotate(90deg);}

@keyframes upDown {
	0% {
		opacity: 0.8;
		transform:  translateY(-5px);
	}
	50% {
		opacity: 1;
		transform: translateY(5px);
	}
	100% {
		opacity: 0.8;
		transform:  translateY(-5px);
	}
}

/* -------- 메인비주얼 :: 컨트롤러 -------- */
#mainVisualControls{position:absolute; bottom: 10.25%; left:0; width:100%; z-index:2;}
#mainVisualControls .area-main{text-align: right;}
/* 컨트롤러 :: 이전,다음 */
#mainVisualControls .main-visual-arrow{display: inline-block; vertical-align: middle; position:relative;}
#mainVisualControls .main-visual-arrow button{display: inline-block; vertical-align: middle; position: static; color:#fff; text-align:center; width: 40px; height: 40px; background: none; border: 0; border-radius: 0;}
#mainVisualControls .main-visual-arrow button.main-prev-btn{margin-right: 25px;}
#mainVisualControls .main-visual-arrow button.main-next-btn{margin-left: 25px;}
#mainVisualControls .main-visual-arrow button:after{display: none;}
#mainVisualControls .main-visual-arrow button i{font-size: 37px; line-height: 28px;}
/* 컨트롤러 :: 페이징 */
#mainVisualControls .main-visual-pagination{position: static; display: inline-block; vertical-align: middle;}
#mainVisualControls .swiper-pagination-bullet {margin: 0 14px; width: 8px; height: 8px; display: inline-block; vertical-align: middle; border-radius: 100%; background: #fff; opacity: 1; /* transition: all 0.3s; */}
#mainVisualControls .swiper-pagination-bullet.swiper-pagination-bullet-active{width: 10px; height: 10px; border: 3px solid #fff; background-color: transparent;}


/* ******************  메인 컨텐츠 ********************** */
#mainContainer{overflow: hidden;}
/* -------- 메인 컨텐츠 :: 공통 -------- */
/* 공통 :: 타이틀 */
.main-tit-box{letter-spacing:-0.4px;}
.main-tit-box .area-main{position: relative;}

.main-tit-box .main-tit-num{position: absolute; top: -55px; left: -90px; font-size: 23px; font-weight: 700; color: #000; -webkit-transition: opacity 0.3s; transition: opacity 0.3s; opacity: 0;}
.main-tit-box .main-tit{display: inline-block; vertical-align: middle; color:#000; font-size:90px; font-weight:700; letter-spacing: -0.75px; letter-spacing: -3px;}
.main-tit-box .main-tit strong{display: inline-block; vertical-align: middle; font-weight:700;}
.main-tit-box .main-tit img{margin-left: 20px; position:relative; top: -8px; display: inline-block; vertical-align: middle;}

#mainAboutCon .main-tit-box .main-tit,
#mainNewsCon .main-tit-box .main-tit,
#mainGlobalCon .main-tit-box .main-tit{font-size:75px;}
.main-tit-box .main-sub-tit01{margin-left: 40px; display:inline-block; vertical-align: middle; font-size:19px; line-height: 1.57; letter-spacing:-2px; font-weight:500; color:rgba(62,62,62,0.7);}
#mainNewsCon .main-tit-box .main-sub-tit01{margin-left: 15px; font-size: 18px; margin-top: 30px;}
.main-tit-box .main-sub-tit02{display:block; margin-top:40px; font-size:40px; line-height:1.4; letter-spacing:-0.75px; letter-spacing: -3px; font-weight:700; color:#1e1e1e;}
.main-tit-box .main-tit.splitting .char,
.main-tit-box .main-tit img{
	opacity:0;
	transform:translateY(100%);
	transition:opacity 0.8s, transform 0.8s;
}
 /* transition일때 */ 
.aos-animate .main-tit.splitting .char,
.aos-animate .main-tit img{
	opacity:1.0;
	transform:translateY(0);
}
.aos-animate.main-tit-box .area-main:before{opacity: 1; transition-delay:0.2s;}
.aos-animate.main-tit-box .main-tit-num{opacity: 1; transition-delay:0.3s;}
.aos-animate .main-tit img{transition-delay:0.3s;}

/* 컨텐츠별 공통사항 */
.scroll-move-object{position:absolute; -webkit-transition:all 0.5s; transition:all 0.5s;}
.scroll-move-object img{width: 100%; height: auto;}

.scroll-clip-object{
	position:absolute; top:0px; /* clip:rect(0,0,767px,0); */
	-webkit-transition:clip 1s 0.3s; transition:clip 1s 0.3s;
}
.scroll-clip-object img{width: 100%; height: auto;}
.scroll-clip-object.aos-animate {/* clip:rect(0,1920px,767px,0); */}


/* -------- 메인 컨텐츠 :: 컨텐츠1(Business) -------- */
#mainBusinessCon{padding: 145px 0 150px; position: relative;}
.clip-object01{top: 430px; left: 50%; margin-left: -960px; width: 1920px; height: 768px; clip:rect(0,0,767px,0);}
.clip-object01.aos-animate {clip:rect(0,1920px,767px,0);}

.main-business-con{margin-top: 135px;}
.main-business-slide{position: relative;}
.main-business-list{align-items: flex-end;}
.main-business-item{width: 230px !important; /* transition: all 0.3s !important; */}
.main-business-inner{opacity: 0; padding-top: 120px; max-width: 790px; position: relative; transition: opacity 0.6s, padding 0.6s, transform 1s;}
.main-business-img{position: relative; width: 100%; height: 0; padding-top: 205.17%; padding-top: 480px; background-color: #000; display: block;}
.main-business-img .img{position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0.6; transition: all 0.6s;}
.main-business-img .name{position: absolute; left: 30px; right: 30px; bottom: 25px; font-size: 22px; line-height: 1.3; letter-spacing: -0.025em; color: #fff; font-style: italic; text-align: right; visibility: visible; opacity: 1; transition: all 0.6s;}
.main-business-txt{position: absolute; bottom: 0; left: 0; width: 100%; height: 120px; opacity: 0; visibility: hidden; z-index: -1;}
.main-business-txt-inner{padding: 0 200px 0 95px; width: 100%; height: 100%; display: flex; align-items: center; box-sizing: border-box;}
.main-business-txt-inner .name{display: inline-block; margin-right: 30px; font-size: 50px; font-weight: 700; letter-spacing: -0.03em; color: #000;}
.main-business-txt-inner .category{font-size: 20px; line-height: 1.3; font-weight: 500; letter-spacing: -0.015em; color:#ffc90a;}
.main-business-txt-inner .category b{font-weight: 700;}

/* active */
.swiper-slide-active.main-business-item{width: 1070px !important;}
.swiper-slide-active.main-business-item .main-business-inner{padding-left: 95px; padding-top: 0; padding-bottom: 120px;}
.swiper-slide-active.main-business-item .main-business-img{box-shadow: 0 0 32px 18px rgba(0,0,0,0.14);/* padding-top: 60.75%; */}
.swiper-slide-active.main-business-item .main-business-img .img{opacity: 1;}
.swiper-slide-active.main-business-item .main-business-img .name{opacity: 0; visibility: hidden;}
.swiper-slide-active.main-business-item .main-business-txt{visibility: visible; opacity: 1;}

/* 슬라이드 컨트롤 버튼 */
.main-business-control{position: absolute; width: 95px; height: 95px; left: 790px; bottom: 80px; z-index: 1;}

.main-business-control button{position: absolute; width: 100%; height: 100%; transform: skew(-15deg); transition: all 0.6s;}
.main-business-control button img{transition: transform 0.3s;}


/* animate */
.main-business-item:not(.swiper-slide-active) .main-business-inner{transform: translateY(50px);}
.main-business-item.swiper-slide-active .main-business-inner{transform: translateX(-50px);}
.main-business-con.aos-animate .main-business-item .main-business-inner{opacity: 1;}
.main-business-con.aos-animate .main-business-item:not(.swiper-slide-active) .main-business-inner{transform: translateY(0);}
.main-business-con.aos-animate .swiper-slide-active.main-business-item .main-business-inner{transform: translateX(0);}
.main-business-control.aos-animate:before{top: 15px; right: -15px;}
.main-business-control.aos-animate .main-business-prev{top: 28px; left: -80px;}

@media all and ( min-width: 801px ){
	.main-business-prev:hover img{transform: translateX(-5px);}
	.main-business-next:hover img{transform: translateX(5px);}
}


/* -------- 메인 컨텐츠 :: 컨텐츠2(About UNID) -------- */
#mainAboutCon{position: relative; padding-top: 240px}
.move-object02{width: 467px; left: 0; top: 70px;}
.move-object03{display: none;}
#mainAboutCon .main-tit-box{position: relative; z-index: 2;}

.main-about-wrapper{margin-top: 110px;}
.main-about-top{}
.main-about-top .area-box{position: relative;}
.main-about-top .right{width: 645px; height: 665px; position: absolute; bottom: -100px; right: 0; z-index: 1;}
.main-about-top .right .item{width: 355px; position: absolute;}
.main-about-top .right .item:nth-child(1){top: 0; left: 155px;}
.main-about-top .right .item:nth-child(2){bottom: 0; left: 0;}
.main-about-top .right .item:nth-child(3){top: 250px; right: 0;}
.main-about-top .right .item span{display: block; position: relative; width: 100%; height: 338px;}
.main-about-top .right .item span:before{position: absolute; font-size: 30px; font-weight: 500; letter-spacing: -0.65px; color: #fff; content: attr(data-label); z-index: 1; font-style: italic;}
.main-about-top .right .item:nth-child(1) span:before{top: 60px; right: 65px;}
.main-about-top .right .item:nth-child(2) span:before{bottom: 55px; left: 65px;}
.main-about-top .right .item:nth-child(3) span:before{bottom: 55px; right: 95px;}
.main-about-top .right .item span img{position: absolute; top: 0; left: 0; width: 100%; height: 100%; filter: drop-shadow(18px 18px 32px rgba(0,0,0,0.14));}
.main-about-top .right .vision-btn{position: absolute; bottom: 25px; right: 160px; display: inline-block; font-size: 14px; font-weight: 700; color: #000; z-index: 2;}
.main-about-top .right .vision-btn:before{position: absolute; top: 50%; margin-top: -7px; right: -25px; content: '\e907'; -webkit-transition: right 0.2s; transition: right 0.2s;}
.main-about-top .left{}
.main-about-top .left li{}
.main-about-top .left li + li{margin-top: 20px; margin-left: 50px;}
.main-about-top .left li img{}

.main-about-bottom{margin-top: 210px; padding-bottom: 195px; position: relative;}
.clip-object02{top: auto; bottom: 50px; left: 50%; margin-left: -960px; width: 1920px; height: 750px; clip:rect(0,0,750px,0);}
.clip-object02.aos-animate {clip:rect(0,1920px,750px,0);}
.main-about-bottom .right{position: relative; z-index: 1; width: 50%; width: 755px; float: right; padding-left: 8.2%; font-weight: 500; -webkit-box-sizing: border-box; box-sizing: border-box; font-style: italic;}
.main-about-bottom .right .tit{position: relative; padding-left: 10px; font-size: 31px; font-weight: 700; letter-spacing: -0.65px; color: #000;}
.main-about-bottom .right .tit:before{position: absolute; top: 0; left: -40px; display: block; content: '\ea55'; font-size: 30px;}
.main-about-bottom .right .value{display: block; margin-top: 20px; font-size: 80px; font-weight: 700; letter-spacing: -0.25px; color: #000;}
.main-about-ir{margin-top: 20px; font-size: 0;}
.main-about-ir dl{display: inline-block; vertical-align: middle; letter-spacing: -0.75px; color: #000;}
.main-about-ir dl + dl{margin-left: 55px;}
.main-about-ir dt, .main-about-ir dd{display: inline-block; vertical-align: middle; line-height: 24px;}
.main-about-ir dt{font-size: 18px;}
.main-about-ir dd{margin-left: 15px; font-size: 23px; letter-spacing: 0px;}
.main-about-ir dd i{margin-right: 3px; font-size: 17px;}
.main-about-ir dd .xi-caret-up{color: #ff0000;}
.main-about-ir dd .xi-caret-down{color: blue;}
.main-about-ir dd span{margin-left: 17px; display: inline-block; font-size: 20px;}
.main-about-ir .ir-btn{margin-left: 25px; width: 20px; display: inline-block; vertical-align: middle;}
.main-about-ir .ir-btn i{font-size: 15px; color: #000; font-weight: 600; -webkit-transition: transform 0.2s; transition: transform 0.2s;}

@media all and (min-width:801px){
	.main-about-top .right .vision-btn:hover:before{right: -30px;}
	.main-about-ir .ir-btn:hover i{-webkit-transform: translateX(5px); transform: translateX(5px);}
}


/* -------- 메인 컨텐츠 :: 컨텐츠4(채용정보,홍보영상) -------- */
#mainRecruitCon{}
.main-recruit-item{float: left; width: 50%; height: 332px; background: url("/images/menu2.jpg") center/cover no-repeat; -webkit-transform: translate3d(60px,0,0); transform: translate3d(60px,0,0);}
#mainRecruitCon .main-recruit-item:first-child{background: url("/images/menu1.jpg") center/cover no-repeat; -webkit-transform: translate3d(-60px,0,0); transform: translate3d(-60px,0,0);}
#mainRecruitCon .main-recruit-item:first-child.aos-animate{-webkit-transform: none; transform: none;}
.main-recruit-inner{width: 100%; max-width: 755px; height: 100%; float: left; padding: 0 11.8%; -webkit-box-sizing: border-box; box-sizing: border-box; display: flex; flex-wrap: wrap; align-items: center;}
#mainRecruitCon .main-recruit-item:first-child .main-recruit-inner{float: right;}
.main-recruit-txt{width: 100%; position: relative; padding-right: 200px; -webkit-box-sizing: border-box; box-sizing: border-box;}
#mainRecruitCon .main-recruit-item:first-child .main-recruit-txt{padding-right: 145px;}
.main-recruit-txt .tit{font-size: 38px; line-height: 1.2; font-weight: 700; letter-spacing: -0.63px; color: #fff;}
.main-recruit-txt .txt{margin-top: 30px; font-size: 21px; line-height: 1.42; letter-spacing: -0.25px; color: rgba(255,255,255,0.7);}
.main-recruit-link{position: absolute; top: 50%; right: -12px; -webkit-transform: translateY(-50%); transform: translateY(-50%);}
#mainRecruitCon .main-recruit-item:first-child .main-recruit-link{right: 0;}
.main-recruit-link .link{position: relative; display: block; width: 145px; font-size: 19px; line-height: 1.3; letter-spacing: -0.65px; color: #fff;}
.main-recruit-link .link + .link{margin-top: 22px;}
.main-recruit-link .link:before{position: absolute; top: 50%; margin-top: -8px; right: 0; display: block; content: '\e907'; font-size: 13px; line-height: 1; -webkit-transition: right 0.2s; transition: right 0.2s;}
.main-recruit-link .btn{display: block;}
.main-recruit-link .btn .cir{display: inline-block; vertical-align: middle; width: 45px; height: 45px; -webkit-border-radius: 100%; border-radius: 100%; background-color: #fac800; text-align: center;}
.main-recruit-link .btn +.btn{margin-top: 15px;}
.main-recruit-link .btn +.btn .cir{background-color: #ffc90a;}
.main-recruit-link .btn .cir:before{display: inline-block; font-size: 20px; line-height: 45px; color: #fff; content: '\ea40'; -webkit-transition: transform 0.2s; transition: transform 0.2s;}
.main-recruit-link .btn p{margin-left: 10px; font-size: 15.5px; font-weight: 500; display: inline-block; vertical-align: middle; color: #fff;}
.main-recruit-link .btn p span{font-size: 13px; margin-top: 10px; display: block;}

@media all and (min-width:801px){
	.main-recruit-link .link:hover:before{right: -5px;}
	.main-recruit-link .btn:hover .cir:before{-webkit-transform: scale(1.1); transform: scale(1.1);}
}


/* -------- 메인 컨텐츠 :: 컨텐츠4(채용정보,홍보영상) -------- */
#mainNewsCon{position: relative; padding: 180px 0 150px; min-height: 660px;}
#mainNewsCon:before{position: absolute; bottom: 0; left: 0; width: 100%; height: 430px; content: ''; background-color: #f0f0f0;}

.main-news-con{margin-top: 115px;}
.main-news-container.swiper-container{overflow: visible;}
.main-news-container.swiper-container:before{position: absolute; top: -50px; left: -115px; content: ''; width: 670px; height: 560px; background-color: #ffc90a;}
.main-news-list{position: relative; z-index: 1;}
.swiper-slide.main-news-item{width: 28.5%;  -webkit-transition: all 0.5s;
    transition: all 0.5s;}
.main-news-item a{
	position: relative; 
	height: 455px; 
	padding: 40px 40px 110px; 
	display: block; 
	background-color: #fff; -webkit-box-shadow: 5px 5px 18px -2.5px rgba(0,0,0,0.09); 
	box-shadow: 5px 5px 18px -2.5px rgba(0,0,0,0.09); -webkit-box-sizing: border-box; 
	box-sizing: border-box; 
	-webkit-transition: background-color 0.3s; transition: background-color 0.3s;
}
.main-news-item a:before{position: absolute; top: 0; left: 0; content: ''; width: 100%; height: 100%; border: 0px solid #ffc90a; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all 0.2s; transition: all 0.2s;}

.txt-item a:after{position: absolute; bottom: 50px; right: 60px; content: ''; width: 45px; height: 8px; background:  url("../images/main/arrow_news.png") 0 0 no-repeat; opacity: 0; -webkit-transition: opacity 0.3s; transition: opacity 0.3s;}
.main-news-item a .new-bnr{position: absolute; top: -2px; right: -2px; width: 60px; height: 40px; font-size: 11px; line-height: 40px; font-weight: 700; color: #fff; text-align: center;}
.main-news-item a .new-bnr:before{position: absolute; top: 0; right: 0; display: block; content: ''; width: 60px; height: 40px; -webkit-transform: skew(-15deg); transform: skew(-15deg); background-color: #e81212;}
.main-news-item a .new-bnr em{display: inline-block; position: relative; z-index: 1;}
.main-news-top{position: relative; padding-right: 90px;}
.main-news-top .date{width: 45px; text-align: center;}
.main-news-top .date span{display: block; font-size: 16px; font-weight: 500; color: #000;}
.main-news-top .date b{margin-top: 5px; display: block; font-size: 33px; font-weight: 700; color: #ffc90a;}
.main-news-top .category{position: absolute; top: 15px; right: 0; display: inline-block; font-size: 15px; font-weight: 500; color: #000; border-bottom: 2px solid #000; padding: 0 2px 7px;}
.main-news-bottom{margin-top: 60px;}
.img-item .main-news-bottom{margin-top: 20px;}
.main-news-bottom .tit{font-size: 19.5px; line-height: 1.6; height: 3.2em; font-weight: 500; letter-spacing: -1px; color: #010101;}
.main-news-bottom .txt{margin-top: 30px; font-size: 16px; line-height: 1.9; height: 5.7em; letter-spacing: -0.6px; color: rgba(35,35,35,0.7);}
.main-news-bottom .img{margin-bottom: 20px; position: relative; width: 100%; height: 0; padding-top: 228px;}
.main-news-bottom .img span{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

.main-news-top .date span,
.main-news-top .date b,
.main-news-top .category,
.main-news-bottom .tit,
.main-news-bottom .txt{-webkit-transition: all 0.3s; transition: all 0.3s;}
/* active */
.swiper-slide-active.main-news-item{width: 35%;}
.swiper-slide-active.main-news-item a{background-color: #ffc90a; -webkit-box-shadow: none; box-shadow: none;}
.swiper-slide-active .main-news-top .date span,
.swiper-slide-active .main-news-top .date b,
.swiper-slide-active .main-news-top .category,
.swiper-slide-active .main-news-bottom .tit{color: #fff; border-color: #fff;}
.swiper-slide-active .main-news-bottom .txt{color: rgba(255,255,255,0.7);}
.swiper-slide-active.txt-item a:hover:before,
.swiper-slide-active.txt-item a:hover:after{opacity: 0;}
.swiper-slide-active.txt-item:before{position: absolute; left: 30px; bottom: 40px; display: block; content: '\e913'; font-size: 20px; color: #fff; font-family:xeicon;}

/* hover */
@media all and (min-width:801px){
	.txt-item a:hover{}
	.main-news-item a:hover:before{border-width:13px;}
	.txt-item a:hover:after{opacity: 1;}
}

.main-news-con li{opacity: 0; position: relative; -webkit-transition: top 0.8s, opacity 0.3s; transition: top 0.8s, opacity 0.3s;}
.main-news-con .swiper-slide-prev,
.main-news-con .swiper-slide-active,
.main-news-con .swiper-slide-next,
.main-news-con .swiper-slide-next + li,
.main-news-con .swiper-slide-next + li + li,
.main-news-con .swiper-slide-next + li + li + li{top: 30px; opacity: 0;}
/* 효과 */
.main-news-con li{opacity: 1;}
.main-news-con.aos-animate .swiper-slide-prev,
.main-news-con.aos-animate .swiper-slide-active,
.main-news-con.aos-animate .swiper-slide-next,
.main-news-con.aos-animate .swiper-slide-next + li,
.main-news-con.aos-animate .swiper-slide-next + li + li,
.main-news-con.aos-animate .swiper-slide-next + li + li + li{top: 0; opacity: 1;}
.main-news-con.aos-animate .swiper-slide-prev{transition-delay:0s;}
.main-news-con.aos-animate .swiper-slide-active{transition-delay:0.2s;}
.main-news-con.aos-animate .swiper-slide-next{transition-delay:0.4s;}
.main-news-con.aos-animate .swiper-slide-next + li{transition-delay:0.6s;}
.main-news-con.aos-animate .swiper-slide-next + li + li{transition-delay:0.8s;}
.main-news-con.aos-animate .swiper-slide-next + li + li + li{transition-delay:1s;}