@import '~bootstrap/scss/bootstrap.scss'; @import '~bootstrap-icons/font/bootstrap-icons'; .carousel-inner .carousel-item.active, .carousel-inner .carousel-item-next, .carousel-inner .carousel-item-prev { display: flex; justify-content: center; } @font-face { font-family: 'HangeulNuri-Bold'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_three@1.0/HangeulNuri-Bold.woff') format('woff'); font-weight: normal; font-style: normal; } @media (max-width: 767px) { .carousel-inner .carousel-item > div { display: none; } .carousel-inner .carousel-item > div:first-child { display: block; } } /* medium and up screens */ @media (min-width: 768px) { .carousel-inner .carousel-item-end.active, .carousel-inner .carousel-item-next { transform: translateX(25%); } .carousel-inner .carousel-item-start.active, .carousel-inner .carousel-item-prev { transform: translateX(-25%); } } .carousel-inner .carousel-item-end, .carousel-inner .carousel-item-start { transform: translateX(0); } // .nav-link{ // color: yellow; // }