/*pc*/
@media all and (min-width:1024px) {
.msec1 { }
.msec1 .swiper-slide { overflow: hidden }
.msec1 .swiper-slide .slogan { position: absolute; z-index: 10; top: 20%; left: 50%; max-width: 1400px; transform: translateX(-50%); width: 100%; text-align: left }
.msec1 .swiper-slide .slogan .text1 { display: block; position: relative; top: 10px; opacity: 0; font-size: 36px; color: #fff; font-weight: bold; transition: 0.5s 0.5s; text-shadow: 0 0 5px rgba(0,0,0,0.8) ; font-style:normal; line-height:1.2}
.msec1 .swiper-slide .slogan .text2 { display: block; position: relative; top: 10px; opacity: 0; font-size: 72px; color: #fff; transition: 0.5s 1s; font-family: 'Play', sans-serif; font-weight: bold; text-shadow: 0 0 5px rgba(0,0,0,0.8) ;  font-style:normal}
.msec1 .swiper-slide .bg { transform: scale(1.1)/*½ºÄÉÀÏÅ©±â*/; transition: 10s/*½ºÄÉÀϽð£*/ }
.msec1 .swiper-slide-active .bg { transform: scale(1) }
.msec1 .swiper-slide-active .slogan .text1 { top: 0; opacity: 1 }
.msec1 .swiper-slide-active .slogan .text2 { top: 0; opacity: 1 }
.msec1 .swiper-button-next,  .msec1 .swiper-button-prev { color: #fff }

.msec1 .swiper-pagination{left:50%; top:60%; z-index:9; font-size:2rem; color:#fff;  max-width: 1400px; transform: translateX(-50%); width: 100%; text-align: left; font-family: 'Play', sans-serif; font-weight: bold;}

.swiper-progress-bar { position: absolute; width: 280px; display: block; z-index: 1; height: 3px; top: 50%; left:20%; transform:translateX(-50%) }
.swiper-progress-bar .slide_progress-bar { position: absolute; height: 4px; background: rgba(255,255,255,0.6); width: auto; clear: both; opacity: 0; left: 0; right: 0; }
.swiper-progress-bar .slide_progress-bar:after { position: absolute; top: 0; left: 0; background: #de1f26; height: 100%; width: 0; content: ""; }
.swiper-progress-bar.active .slide_progress-bar { opacity: 1; }
.swiper-progress-bar.animate .slide_progress-bar:after { transition: width linear; transition-delay: unset; width: 100%; transition-duration: 5s; }

.light{position:absolute; top:15%; right:10%; z-index:9; animation: rotate_image 20s linear infinite; transform-origin: 50% 50%;}
 @keyframes rotate_image { 100% {
 transform: rotate(360deg);
}
}


}

    

/*mobile*/
@media all and (max-width:1023px) {
.msec1 { }
.msec1 .swiper-slide { overflow: hidden }
.msec1 .swiper-slide .slogan { position: absolute; z-index: 10; top: 20%; left: 50%; transform: translateX(-50%); width: 100%; text-align: center }
.msec1 .swiper-slide .slogan .text1 { display: block; position: relative; top: 10px; opacity: 0; font-size: 1.3rem; color: #fff; font-weight: bold; transition: 0.5s 0.5s; text-shadow: 0 0 5px rgba(0,0,0,0.8) ; font-style:normal; line-height:1.2}
.msec1 .swiper-slide .slogan .text2 { display: block; position: relative; top: 10px; opacity: 0; font-size: 3rem; color: #fff; transition: 0.5s 1s; font-family: 'Play', sans-serif; font-weight: bold; text-shadow: 0 0 5px rgba(0,0,0,0.8) ;  font-style:normal}
.msec1 .swiper-slide .bg { transform: scale(1.1)/*½ºÄÉÀÏÅ©±â*/; transition: 10s/*½ºÄÉÀϽð£*/ }
.msec1 .swiper-slide-active .bg { transform: scale(1) }
.msec1 .swiper-slide-active .slogan .text1 { top: 0; opacity: 1 }
.msec1 .swiper-slide-active .slogan .text2 { top: 0; opacity: 1 }
.msec1 .swiper-button-next,  .msec1 .swiper-button-prev { color: #fff; display:none }

.msec1 .swiper-pagination{left:50%; top:60%; z-index:9; font-size:1.5rem; color:#fff;  transform: translateX(-50%); width: 100%; text-align: center; font-family: 'Play', sans-serif; font-weight: bold;}

.swiper-progress-bar { position: absolute; width: 280px; display: block; z-index: 1; height: 3px; top: 70%; left:50%; transform:translateX(-50%) }
.swiper-progress-bar .slide_progress-bar { position: absolute; height: 4px; background: rgba(255,255,255,0.6); width: auto; clear: both; opacity: 0; left: 0; right: 0; }
.swiper-progress-bar .slide_progress-bar:after { position: absolute; top: 0; left: 0; background: #de1f26; height: 100%; width: 0; content: ""; }
.swiper-progress-bar.active .slide_progress-bar { opacity: 1; }
.swiper-progress-bar.animate .slide_progress-bar:after { transition: width linear; transition-delay: unset; width: 100%; transition-duration: 5s; }

.light{position:absolute; top:20%; right:10%; z-index:7; animation: rotate_image 20s linear infinite; transform-origin: 50% 50%;}
 @keyframes rotate_image { 100% {
 transform: rotate(360deg);
}
}

}