@charset "utf-8";
.mainBanner {position:relative;width:100%; height:480px; overflow:hidden;}
.mainBanner .swiper-container {position:relative;width:100%;height:480px;overflow:hidden;}
.mainBanner .swiper-wrapper {position:relative;}
.mainBanner .swiper-slide {float:left;position:relative;width:100%;height:480px;overflow: hidden;}
.mainBanner .swiper-slide .bg {position:absolute;left:0;top:0;width:100%;height:480px;z-index:1;transform:scale(1) rotate(0.0001deg);transition:transform .6s ease-in-out .5s;}
.mainBanner .swiper-slide .inner {position:relative;margin:0 auto;width:1280px;height:480px;z-index:2;}
.mainBanner .swiper-wrapper .lgchannels .bg {background:url('../img/main/bg_lgChannel_PC.jpg') top center no-repeat;}
.mainBanner .swiper-slide .lgchannelsWrap .cricle1 {position:absolute; background:url('../img/main/img_lgChannel_P03.png') bottom center no-repeat; width:289px; height:480px; top:0px; right:-36px; z-index:4; opacity:0;}
.mainBanner .swiper-slide .lgchannelsWrap .cricle2 {position:absolute; background:url('../img/main/img_lgChannel_P02.png') bottom center no-repeat; width:292px; height:480px; top:0px; right:-246px; z-index:5; opacity:0;}
.mainBanner .swiper-slide .lgchannelsWrap .cricle3 {position:absolute; background:url('../img/main/img_lgChannel_P04.png') bottom center no-repeat; width:234px; height:480px; top:0px; right:195px; z-index:3; opacity:0;}
.mainBanner .swiper-slide .lgchannelsWrap .cricle4 {position:absolute; background:url('../img/main/img_lgChannel_Logo.png') bottom center no-repeat; width:247px; height:83px; top:80px; left:50px; opacity:0; font-size:0; text-indent:-99999px;}
.mainBanner .swiper-slide .lgchannelsWrap .cricle5 {position:absolute; background:url('../img/main/img_lgChannel_P01.png') bottom center no-repeat; width:635px; height:208px; top:190px; left:50px; opacity:0; font-size:0; text-indent:-99999px;}
.mainBanner .swiper-slide .lgchannelsWrap .cricle1 {transform:rotate(0.0001deg) translate(0, 0);transition:all .1s ease-in-out;}
.mainBanner .swiper-slide .lgchannelsWrap .cricle2 {transform:rotate(0.0001deg) translate(0, 0);transition:all .1s ease-in-out;}
.mainBanner .swiper-slide .lgchannelsWrap .cricle3 {transform:rotate(0.0001deg) translate(0, 0);transition:all .1s ease-in-out;}
.mainBanner .swiper-slide .lgchannelsWrap .cricle4 {transform:rotate(0.0001deg) translate(30px, 0);transition:all .1s ease-in-out;}
.mainBanner .swiper-slide .lgchannelsWrap .cricle5 {transform:rotate(0.0001deg) translate(-30px, 0);transition:all .1s ease-in-out;}
.mainBanner .swiper-slide-active .lgchannelsWrap .cricle1 {transform:rotate(0.0001deg) translate(0, 0);transition:all 1.0s ease-in-out 2.0s;opacity:1.0;}
.mainBanner .swiper-slide-active .lgchannelsWrap .cricle2 {transform:rotate(0.0001deg) translate(0, 0);transition:all 1.0s ease-in-out 1.0s;opacity:1.0;}
.mainBanner .swiper-slide-active .lgchannelsWrap .cricle3 {transform:rotate(0.0001deg) translate(0, 0);transition:all 1.0s ease-in-out 3.0s;opacity:1.0;}
.mainBanner .swiper-slide-active .lgchannelsWrap .cricle4 {transform:rotate(0.0001deg) translate(0, 0);transition:all .5s ease-in-out 4.0s;opacity:1.0;}
.mainBanner .swiper-slide-active .lgchannelsWrap .cricle5 {transform:rotate(0.0001deg) translate(0, 0);transition:all .5s ease-in-out 4.0s;opacity:1.0;}

.mainBanner .swiper-slide.swiper-slide-active .inner .txt1 {opacity:1;margin-top:0;}
.mainBanner .swiper-slide.swiper-slide-active .inner .txt2 {opacity:1;margin-bottom:0;}

@media screen and (max-width:959px ) {
	/* main */
	.mainBanner {height:22rem;} /* 2022.02.15 Mod */
	.mainBanner .swiper-container, .mainBanner .swiper-slide {height:22rem;} /* 2022.02.15 Mod */
	.mainBanner .swiper-slide .swiper-slide-item {background-position: center; background-size: cover !important;} /* 2022.03.22 Mod */
	.mainVisual .swiper-pagination {height:2.4rem; background-color: transparent; padding:0; margin:0;} /* 2022.02.15 Add */
	.mainBanner .swiper-slide .bg {height:100%; background-size:cover !important;}

	.mainBanner .swiper-slide .inner {margin:0;width:100%;height:100%;}

	.mainBanner .swiper-wrapper .lgchannels .bg {background:url('../img/main/bg_lgChannel_Mobile.jpg') center no-repeat;}
	.mainBanner .swiper-slide .lgchannelsWrap .cricle1 {position:absolute; background:url('../img/main/img_lgChannel_M02.png') bottom center no-repeat; width:360px; height:82px; top:246px; bottom:auto; left:50%; right:auto; margin-left:-180px; z-index:4; background-size:contain; background-position: center;}
	.mainBanner .swiper-slide .lgchannelsWrap .cricle2 {position:absolute; background:url('../img/main/img_lgChannel_M03.png') bottom center no-repeat; width:360px; height:82px; top:298px; bottom:auto; left:50%; right:auto; margin-left:-180px; z-index:5; background-size:contain; background-position: center;}
	.mainBanner .swiper-slide .lgchannelsWrap .cricle3 {position:absolute; background:url('../img/main/img_lgChannel_M04.png') bottom center no-repeat; width:360px; height:82px; top:350px; bottom:auto; left:50%; right:auto; margin-left:-180px; z-index:5; background-size:contain; background-position: center;}
	.mainBanner .swiper-slide .lgchannelsWrap .cricle4 {position:absolute; background:url('../img/main/img_lgChannel_Logo.png') bottom center no-repeat; width:360px; height:50px; top:40px; left:50%; right:auto; margin-left:-180px; z-index:3; background-size:contain; background-position: center;}
	.mainBanner .swiper-slide .lgchannelsWrap .cricle5 {position:absolute;background:url('../img/main/img_lgChannel_M01.png') bottom center no-repeat;width:360px;height: 110px;top:120px;left:50%;right:auto;margin-left:-180px;background-size:contain;background-position: center;}
	.mainBanner .swiper-slide .lgchannelsWrap .cricle1 {transform:rotate(0.0001deg) translate(0, 0);transition:all .1s ease-in-out;}
	.mainBanner .swiper-slide .lgchannelsWrap .cricle2 {transform:rotate(0.0001deg) translate(0, 0);transition:all .1s ease-in-out;}
	.mainBanner .swiper-slide .lgchannelsWrap .cricle3 {transform:rotate(0.0001deg) translate(0, 0);transition:all .1s ease-in-out;}
	.mainBanner .swiper-slide .lgchannelsWrap .cricle4 {transform:rotate(0.0001deg) translate(-30px, 0);transition:all .1s ease-in-out;}
	.mainBanner .swiper-slide .lgchannelsWrap .cricle5 {transform:rotate(0.0001deg) translate(30px, 0);transition:all .1s ease-in-out;}
	.mainBanner .swiper-slide-active .lgchannelsWrap .cricle1 {transform:rotate(0.0001deg) translate(0, 0);transition:all 1.0s ease-in-out 2.0s;opacity:1.0;}
	.mainBanner .swiper-slide-active .lgchannelsWrap .cricle2 {transform:rotate(0.0001deg) translate(0, 0);transition:all 1.0s ease-in-out 2.5s;opacity:1.0;}
	.mainBanner .swiper-slide-active .lgchannelsWrap .cricle3 {transform:rotate(0.0001deg) translate(0, 0);transition:all 1.0s ease-in-out 3.0s;opacity:1.0;}
	.mainBanner .swiper-slide-active .lgchannelsWrap .cricle4 {transform:rotate(0.0001deg) translate(0, 0);transition:all 1.0s ease-in-out 1.0s;opacity:1.0;}
	.mainBanner .swiper-slide-active .lgchannelsWrap .cricle5 {transform:rotate(0.0001deg) translate(0, 0);transition:all 1.0s ease-in-out 1.0s;opacity:1.0;}
}