@import url(reset.css);
#main .en_ttl { text-shadow: 0px 0px 5px #000000,0px 0px 5px #000000; }

#modelSlideArea { max-width: 1100px; margin: 7rem auto; }
#modelSlideArea img { width: 100%; height: auto; }
#modelSlideArea .slick-list .img { position: relative; }
#modelSlideArea .slick-list .img .cap { position: absolute; bottom: 5px; right: 5px; color: #fff; text-shadow: 0px 0px 3px #000000,0px 0px 3px #000000; font-size: 3.5rem; font-family: "Cormorant Garamond", serif; font-optical-sizing: auto; font-weight: normal; font-style: normal; font-weight: bold; }
#modelSlideArea .slick-list .img .cap.cap1 { right: 51%; }
#modelSlideArea .slick-dots { display: flex; justify-content: space-between; flex-wrap: wrap; margin-top: 20px; }
#modelSlideArea .slick-dots li { width: calc(100% / 6 - 12px); height: auto; margin: auto; background: #000; }
#modelSlideArea .slick-dots li img { opacity: 0.3; transition: .3s; }
#modelSlideArea .slick-dots li:hover img, #modelSlideArea .slick-dots li.slick-active img { opacity: 1; }

@media screen and (max-width: 1100px) { #modelSlideArea .slick-dots { bottom: inherit; top: 103%; } }
@media screen and (max-width: 1150px) { .contents { padding-top: 0px; }
  #modelSlideArea { padding-top: 2rem; } }
@media screen and (max-width: 640px) { #modelSlideArea { /*padding-bottom: 30%;*/ }
  #modelSlideArea .slick-list .img .cap { font-size: 4vw; }
  #modelSlideArea .slick-dots li { width: calc(100% / 6 - 10px); margin-bottom: 2%; }
  #main .page-note-area { padding-top: 3rem; } }
