/*shorts*/
.sec-1topimg-shorts { position:relative; overflow:hidden; background:#f8f8f8; }

.sec-1topimg-shorts .swiper-container { overflow:visible; width:100%; }

.sec-1topimg-shorts .swiper-slide { transform:scale(0.8); transition-duration:600ms; }
/*
.sec-1topimg-shorts .swiper-slide-active,
.sec-1topimg-shorts .swiper-slide-next,
.sec-1topimg-shorts .swiper-slide-next + div { transform:scale(1); }
*/

.sec-1topimg-shorts .swiper-slide { transform:scale(1); } /* ½½¶óÀ̵å Å©±â µ¿ÀÏÇÏ°Ô À¯Áö*/

/*
.sec-1topimg-shorts .swiper-slide:not(.swiper-slide-active, .swiper-slide-next, .swiper-slide-next + div) .content { display:none; }
.sec-1topimg-shorts .swiper-slide:not(.swiper-slide-active, .swiper-slide-next, .swiper-slide-next + div) .hover { display:none; }
.sec-1topimg-shorts .swiper-slide:not(.swiper-slide-active, .swiper-slide-next, .swiper-slide-next + div):after { content:""; position:absolute; left:0; top:0; right:0; bottom:0; background:rgba(0,0,0,.5); }
*/

.sec-1topimg-shorts .swiper-slide .tmp-box {background-position: center center; background-size: auto 100%; background-repeat: no-repeat; background-attachment: initial; background-origin: initial; background-clip: initial;}

.sec-1topimg-shorts .swiper-slide .tmp-box .shorts-play-btn {cursor:pointer;position:absolute;top:40%;left:36%; opacity: 0.6;transition: 1s;}
.sec-1topimg-shorts .swiper-slide .tmp-box .shorts-play-btn:hover { opacity: 1; transition: opacity 0.3s ease;}

.sec-1topimg-shorts .swiper-slide .content {width:100%;position:absolute;height:67px;bottom:0px; text-align:center; padding:6px 10px;background:rgba(0,0,0,.3);}
.sec-1topimg-shorts .swiper-slide .head { width:100%; font-size:1.25rem; padding-top:10px;line-height:22px; white-space: normal; text-overflow: ellipsis; overflow: hidden; color:#fff; }

.sec-1topimg-shorts .swiper-slide .hover { position:absolute; left:0; top:0; right:0; bottom:0; padding:25px; background:rgba(230,230,230,.9); opacity:0; display:flex; justify-content:center; align-items:center; flex-direction: column; text-align:center; transition-duration:400ms; }
.sec-1topimg-shorts .swiper-slide:hover .hover { opacity:1; }
.sec-1topimg-shorts .swiper-slide .hover > div { white-space: normal; text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; }
.sec-1topimg-shorts .swiper-slide .hover .head { font-weight:600; -webkit-line-clamp: 2; }
.sec-1topimg-shorts .swiper-slide .hover .desc {  color:#888; font-size:.875rem; -webkit-line-clamp: 4; }

.sec-1topimg-shorts .swiper-slide .more { border-radius:99px; font-size:.813rem; padding:10px 20px; margin-top:20px; }

.sec-1topimg-shorts .pg { text-align:center; display:flex; justify-content:center; align-items:center; margin-top:30px; }
.sec-1topimg-shorts .pg .swiper-pagination-bullet { opacity:1; background:#aaa; width:15px; height:15px; margin:0 5px; border:2px solid #f8f8f8; transition-duration:200ms; }
.sec-1topimg-shorts .pg .swiper-pagination-bullet-active { background:none; border:1px solid #888; }

.sec-1topimg-shorts .nav {opacity:0; transition: opacity 0.3s ease;position:absolute; top:51%; transform:translateY(-50%); width:40px; height:40px; cursor:pointer; border-radius:99px; border:1px solid #eee; color:#eee; display:flex; justify-content:center; align-items:center; z-index:9; }
.sec-1topimg-shorts:hover .nav {opacity: 1; transition: opacity 0.3s ease;}

.sec-1topimg-shorts .nav.prev {padding-right:3px; left:2vw; }
.sec-1topimg-shorts .nav.next {padding-left:3px; right:2vw; }


@media (max-width: 1200px) {
    .sec-1topimg-shorts .swiper-slide .name { margin-bottom:15px; padding-bottom:10px; }
    .sec-1topimg-shorts .swiper-slide .more { margin-top:25px; }

}

@media (max-width: 1024px) {
    .sec-1topimg-shorts .swiper-container { overflow:hidden; width:100%; }
    .sec-1topimg-shorts .swiper-slide { transform:scale(1); }
    .sec-1topimg-shorts .swiper-slide:not(.swiper-slide-active, .swiper-slide-next, .swiper-slide-next + div):after { display:none; }


    .sec-1topimg-shorts .swiper-slide .hover .head, .sec-1topimg-shorts .swiper-slide .hover .name { display:none; }


    .sec-1topimg-shorts .pg { margin-top:10px; }
    .sec-1topimg-shorts .nav { top:54%; }

}

@media (max-width: 767px) {

    .sec-1topimg-shorts .swiper-slide .content { padding:10px; }

    .sec-1topimg-shorts .swiper-slide .head { font-size:1.125rem; }
    .sec-1topimg-shorts .swiper-slide .more { margin-top:15px; }

    .sec-1topimg-shorts .pg .swiper-pagination-bullet { width:12px; height:12px; margin:0 3px; }
    .sec-1topimg-shorts .nav { top:50%; }

    .sec-1topimg-shorts .nav.prev { left:2vw; }
    .sec-1topimg-shorts .nav.next { right:2vw; }


}
/*shorts*/


/*°ø¿ë ½ºÇdzÊ*/
.spinner {
  margin: 50px auto 0;
  width: 70px;
  text-align: center;
}

.spinner > div {
  width: 18px;
  height: 18px;
  background-color: rgba(223, 32, 95, 0.95);

  border-radius: 100%;
  display: inline-block;
  -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
  animation: sk-bouncedelay 1.4s infinite ease-in-out both;
}

.spinner .bounce1 {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}

.spinner .bounce2 {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}

@-webkit-keyframes sk-bouncedelay {
  0%, 80%, 100% { -webkit-transform: scale(0) }
  40% { -webkit-transform: scale(1.0) }
}

@keyframes sk-bouncedelay {
  0%, 80%, 100% { 
    -webkit-transform: scale(0);
    transform: scale(0);
  } 40% { 
    -webkit-transform: scale(1.0);
    transform: scale(1.0);
  }
}