@charset "utf-8";

/* 네비 버튼 */
/* .basic-banner .owl-nav {
	position:absolute;
	right:0;
	top:-3.75rem;
	z-index:1;
}
.basic-banner .owl-nav button {
	width:2.5rem;
	padding:0 !important;
	margin:0 !important;
	border:1px solid #ddd !important;
	background:#fff !important;
	color:#ccc !important;
}
.basic-banner .owl-nav button.owl-prev {
	border-right:0 !important;
} */

.swiper.premium  { }

/* .swiper.premium .swiper-slide dl dt .best { position: absolute; right:10px; top:10px; z-index: 20; width:24px; height:18px; background-image: url('/theme/nncoms188/img/ico_best.png'); } */
.swiper.premium .swiper-slide dl dt .best { position: absolute; right:10px; top:10px; z-index: 20; padding: 3px 0; width:24px; background: red; background-image: none ; 
font-size: 13px; font-weight: 300; color: #fff; text-align: center; line-height: 1; border-radius: 3px; transition: .1s .3s ease-in-out; white-space: nowrap;}
.swiper.premium .swiper-slide dl dt .best i {overflow: hidden; opacity: 0; display: inline-block;  width: 1px; height: 12px; font-style:normal; transition: .1s .3s ease-in-out; }
.swiper.premium .swiper-slide dl dt { position: relative;}
.swiper.premium .swiper-slide  dl dt a:before, 
.swiper.premium .swiper-slide  dl dt a:after { display: block; position: absolute;  z-index: 10; opacity: 0; }
.swiper.premium .swiper-slide  dl dt a:before { content:''; top: 0; left: 0; width: 100%; height: 100%; background: rgb(57 136 255 / 30%);;}
.swiper.premium .swiper-slide  dl dt a:after { /*content: '\f0c1';*/  top: 80%; left: 50%; transform: translate(-50%, -50%);  /*font-family: 'Font Awesome 5 Free' !important;*/ font-weight: normal; color: #fff; font-size: 40px;}
.swiper.premium .swiper-slide  dl dt a img { transition: .3s;}
.swiper.premium .swiper-slide dl dt:hover .best { width: 44px;}
.swiper.premium .swiper-slide dl dt:hover .best i {opacity: 1;  display: inline-block; width: 22px; height: 12px; }

.swiper.premium .swiper-slide  dl:hover dt a:before, 
.swiper.premium .swiper-slide  dl:hover dt a:after { opacity: 1;}

.swiper.premium .swiper-slide  dl dt a {  overflow:hidden; display: block;}
 .swiper.premium .swiper-slide  dl:hover dt a img { transform:scale(1.05) } 
.swiper.premium .swiper-slide  dl dt a img {}
.swiper.premium .swiper-slide  dl:hover dd a p,
.swiper.premium .swiper-slide  dl:hover dd a strong {text-decoration: underline;}
.swiper.premium .swiper-slide  dl:hover dd a p{}
.swiper.premium .swiper-slide  dl:hover dd a strong{}