css js 문의드립니다. 채택완료

</strong></p>

<p><strong><script>

jQuery("#carousel").owlCarousel({

  autoplay: true,

  rewind: true, /* use rewind if you don't want loop */

  margin: 20,

   /*

  animateOut: 'fadeOut',

  animateIn: 'fadeIn',

  */

  responsiveClass: true,

  autoHeight: true,

  autoplayTimeout: 7000,

  smartSpeed: 800,

  nav: true,

  responsive: {

    0: {

      items: 1

    },</strong></p>

<p><strong>    600: {

      items: 3

    },</strong></p>

<p><strong>    1024: {

      items: 4

    },</strong></p>

<p><strong>    1366: {

      items: 4

    }

  }

});

 

</script>

 </strong></p>

<p><strong>  <style>

 .owl-nav button {

  position: absolute;

  top: 50%;

  background-color: #000;

  color: #fff;

  margin: 0;

  transition: all 0.3s ease-in-out;

}

.owl-nav button.owl-prev {

  left: 0;

}

.owl-nav button.owl-next {

  right: 0;

}</strong></p>

<p><strong>.owl-dots {

  text-align: center;

  padding-top: 15px;

}

.owl-dots button.owl-dot {

  width: 15px;

  height: 15px;

  border-radius: 50%;

  display: inline-block;

  background: #ccc;

  margin: 0 3px;

}

.owl-dots button.owl-dot.active {

  background-color: #000;

}

.owl-dots button.owl-dot:focus {

  outline: none;

}

.owl-nav button {

    position: absolute;

    top: 50%;

    transform: translateY(-50%);

    background: rgba(255, 255, 255, 0.38) !important;

}

span {

    font-size: 70px;    

    position: relative;

    top: -5px;

}

.owl-nav button:focus {

    outline: none;

}

 </style>

<div class="owl-slider">

<div id="carousel" class="owl-carousel">

  <div class="item">

    <img src="<a href="https://cdn.europosters.eu/image/1300/zen-nature-i49609.jpg"" target="_blank" rel="noopener noreferrer">https://cdn.europosters.eu/image/1300/zen-nature-i49609.jpg"</a> alt="1000X1000">

  </div>

  <div class="item">

    <img src="<a href="https://cutewallpaper.org/21/anime-trees-background/Anime-Tree-Background-98-images-in-Collection-Page-3.jpg"" target="_blank" rel="noopener noreferrer">https://cutewallpaper.org/21/anime-trees-background/Anime-Tree-Background-98-images-in-Collection-Page-3.jpg"</a> alt="">

  </div>

  <div class="item">

    <img src="<a href="https://cdn.europosters.eu/image/1300/zen-nature-i49609.jpg"" target="_blank" rel="noopener noreferrer">https://cdn.europosters.eu/image/1300/zen-nature-i49609.jpg"</a> alt="">

  </div>

  <div class="item">

    <img src="<a href="https://cutewallpaper.org/21/anime-trees-background/Anime-Tree-Background-98-images-in-Collection-Page-3.jpg"" target="_blank" rel="noopener noreferrer">https://cutewallpaper.org/21/anime-trees-background/Anime-Tree-Background-98-images-in-Collection-Page-3.jpg"</a> alt="">

  </div>

    <div class="item">

    <img src="<a href="https://cdn.europosters.eu/image/1300/zen-nature-i49609.jpg"" target="_blank" rel="noopener noreferrer">https://cdn.europosters.eu/image/1300/zen-nature-i49609.jpg"</a> alt="">

  </div>

  <div class="item">

    <img src="<a href="https://cutewallpaper.org/21/anime-trees-background/Anime-Tree-Background-98-images-in-Collection-Page-3.jpg"" target="_blank" rel="noopener noreferrer">https://cutewallpaper.org/21/anime-trees-background/Anime-Tree-Background-98-images-in-Collection-Page-3.jpg"</a> alt="">

  </div>

  <div class="item">

    <img src="<a href="https://cdn.europosters.eu/image/1300/zen-nature-i49609.jpg"" target="_blank" rel="noopener noreferrer">https://cdn.europosters.eu/image/1300/zen-nature-i49609.jpg"</a> alt="">

  </div>

  <div class="item">

    <img src="<a href="https://cutewallpaper.org/21/anime-trees-background/Anime-Tree-Background-98-images-in-Collection-Page-3.jpg"" target="_blank" rel="noopener noreferrer">https://cutewallpaper.org/21/anime-trees-background/Anime-Tree-Background-98-images-in-Collection-Page-3.jpg"</a> alt="">

  </div>

    <div class="item">

    <img src="<a href="https://cdn.europosters.eu/image/1300/zen-nature-i49609.jpg"" target="_blank" rel="noopener noreferrer">https://cdn.europosters.eu/image/1300/zen-nature-i49609.jpg"</a> alt="">

  </div>

  <div class="item">

    <img src="<a href="https://cutewallpaper.org/21/anime-trees-background/Anime-Tree-Background-98-images-in-Collection-Page-3.jpg"" target="_blank" rel="noopener noreferrer">https://cutewallpaper.org/21/anime-trees-background/Anime-Tree-Background-98-images-in-Collection-Page-3.jpg"</a> alt="">

  </div>

</div>

</div></strong></p>

<p><strong>