.swiper-container {
    width: 100%;
    height: 100%;

}
.swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;

    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

/*슬라이드 */
.swiper-pagination{left:50%;transform:translateX(-50%);margin:-40px auto 0;}
.slider .swiper-slide span{opacity:0;font-size:40px;line-height:50px;font-family:'NotoSansKRBold',sans-serif;display:inline-block;}
.slider .swiper-slide p{opacity:0;font-size:20px;line-height:50px;font-family:'NotoSansKRRegular',sans-serif;}


.sss1 {width:100%;height:170px;background:rgba(0,0,0,.5);margin:0 auto;padding:35px 0;display:flex;align-items:center;justify-content:center;flex-direction:column;margin-top:50px}
.sss2 {overflow:hidden;height:850px;margin:0 auto}

/* 기본 이미지 설정 (JPG) */
.slider{height:100%;}
.slider .swiper-slide{ color : #fff;}
.slider .bg1{background:url(../../../img/01.jpg) no-repeat center / cover;height:100%;width:auto;transition:2s;}
.slider .bg2{background:url(../../../img/02.jpg) no-repeat center / cover;}
.slider .bg3{background:url(../../../img/03.jpg) no-repeat center / cover;}
.slider .bg4{background:url(../../../img/04.jpg) no-repeat center / cover;}
.slider .bg5{background:url(../../../img/05.jpg) no-repeat center / cover;}
/* WebP 이미지 설정 (브라우저가 WebP를 지원하는 경우) */
@supports (background-image: url(data:image/webp;base64,UklGRhIAAABXRUJQVlA4TBEAAAAvAAAAAAfQ//73v/+BiOh/AAA=)) {
    .slider .bg1 {
        background: url(../../../img/01.webp) no-repeat center / cover;
    }
    .slider .bg2 {
        background: url(../../../img/02.webp) no-repeat center / cover;
    }
    .slider .bg3 {
        background: url(../../../img/03.webp) no-repeat center / cover;
    }
    .slider .bg4 {
        background: url(../../../img/04.webp) no-repeat center / cover;
    }
    .slider .bg5 {
        background: url(../../../img/05.webp) no-repeat center / cover;
    }
}

.slider .swiper-slide.swiper-slide-active.bg1, .slider .swiper-slide.swiper-slide-active.bg2, .slider .swiper-slide.swiper-slide-active.bg3, .slider .swiper-slide.swiper-slide-active.bg4, .slider .swiper-slide.swiper-slide-active.bg5{ animation: scale 3s linear; -webkit-animation: scale 3s linear;}
.slider .swiper-slide{padding-top:400px;}
@keyframes scale{
    0%{background-size: auto 110%;}
    100%{background-size: auto 100%;}
    }
}
.slider .swiper-slide span{opacity:0;font-size:40px;line-height:50px;font-family:'NotoSansKRBold',sans-serif;display:inline-block;}
.slider .swiper-slide p{opacity:0;font-size:20px;line-height:50px;font-family:'NotoSansKRRegular',sans-serif;}

.slider .swiper-slide.swiper-slide-active span{ animation: text 1s 0.2s both;}
.slider .swiper-slide.swiper-slide-active p{ animation: text 1s 0.8s both;}

@media (max-width: 768px) { /* 화면 너비가 768px 이하일 때 적용 */
	.sss1 {
		height:70px;
		margin-top:-250px
	}

	.sss2 {
		height: 440px;
		padding-top: 80px;
	}

	.slider .swiper-slide span{
		font-family:'NotoSansKRMedium',sans-serif;
		line-height:18px;
		font-size:16px;
	}

	.slider .swiper-slide p{
		font-family:'NotoSansKRThin',sans-serif;
		line-height:18px;
		font-size:11px;
	}

}

@keyframes text{
    0%{opacity: 0; transform: translateY(70px);}
    100%{opacity: 1; transform: translateY(0);}
    }
}
