@charset "utf-8";

.boxCsnkSliderHorizontal01 {
  box-sizing: border-box;/* Reset */
  margin: 0;/* Reset */
  padding: 0;/* Reset */
  position: relative;
  width: 1000px;
  height: 650px;
  margin-left: auto;
  margin-right: auto;
}
@media all and (max-width: 640px){
  .boxCsnkSliderHorizontal01 {
    overflow: hidden;
    width: 100%;
    height: 60vw;
  }
}

.boxCsnkSliderHorizontal01 * {
  box-sizing: border-box;/* Reset */
}

.boxCsnkSliderHorizontal01 .slider {
  margin: 0;/* Reset */
  padding: 0;/* Reset */
  overflow: hidden;
  position: relative;
  height: 100%;
  /*min-height: 100%;*/
}

.boxCsnkSliderHorizontal01 .slider .slides {
  margin: 0;/* Reset */
  padding: 0;/* Reset */
  height: 100%;
  list-style-type: none;/* Reset */
  position: absolute;
  top: 0;
}

.boxCsnkSliderHorizontal01 .slider .slides > li {
  margin: 0;/* Reset */
  padding: 0;/* Reset */
  position: relative;
  float: left;
  height: 100%;
  text-align: center;
}

.boxCsnkSliderHorizontal01 .slider .slides > li img.imgMain {
  margin: 0;/* Reset */
  padding: 0;/* Reset */
  border: 0;/* Reset */
  vertical-align: middle;/* Reset */
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}

.boxCsnkSliderHorizontal01 .sliderNaviPrev,
.boxCsnkSliderHorizontal01 .sliderNaviNext {
  position: absolute;
  top: 0;
  bottom: 0;
  display: inline-block;
  width: 37px;
  height: 37px;
  margin: auto;
  border-radius: 20px;
  background-color: rgba(16,0,0,0.8);
  text-align: center;
  vertical-align: middle;
  line-height: 40px;
  font-size: 1.1rem;
  color: #fff;
  cursor: pointer;
}
@media all and (max-width: 640px){
  .boxCsnkSliderHorizontal01 .sliderNaviPrev,
  .boxCsnkSliderHorizontal01 .sliderNaviNext {
    width: 7vw;
    height: 7vw;
    border-radius: 7vw;
    line-height: 8vw;
    font-size: 1.0rem;
  }
}

.boxCsnkSliderHorizontal01 .sliderNaviPrev {
  left: -20px;
  padding: 0 0.2em 0.1em 0;
}
@media all and (max-width: 640px){
  .boxCsnkSliderHorizontal01 .sliderNaviPrev {
    left: 2vw;
  }
}

.boxCsnkSliderHorizontal01 .sliderNaviNext {
  right: -20px;
  padding: 0 0 0.1em 0.2em;
}
@media all and (max-width: 640px){
  .boxCsnkSliderHorizontal01 .sliderNaviNext {
    right: 2vw;
  }
}


.boxCsnkSliderHorizontal01 .ulSlideNavi {
  margin: 0;/* Reset */
  padding: 0;/* Reset */
  list-style-type: none;/* Reset */
  position: absolute;
  z-index: 2;
  left: 50%;
  bottom: 20px;
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: flex-start;
  justify-content: flex-start;
  -webkit-align-items: flex-start;
  align-items: flex-start;
  transform: translateX(-50%);
}

.boxCsnkSliderHorizontal01 .ulSlideNavi > li {
  margin: 0;/* Reset */
  padding: 0;/* Reset */
  margin-right: 0.6em;
  font-size: 1.1rem;
  font-weight: 700;
  cursor: pointer;
  color: #fff;
  text-shadow: 
    #000 2px 0px,  #000 -2px 0px,
    #000 0px -2px, #000 0px 2px,
    #000 2px 2px , #000 -2px 2px,
    #000 2px -2px, #000 -2px -2px,
    #000 1px 2px,  #000 -1px 2px,
    #000 1px -2px, #000 -1px -2px,
    #000 2px 1px,  #000 -2px 1px,
    #000 2px -1px, #000 -2px -1px;
  text-shadow: 1px 1px 1px #000, -1px 1px 2px #000, 1px -1px 2px #000, -1px -1px 2px #000, 0 0 2px #000, 0 0 5px #000, 0 0 10px #000;
}
.boxCsnkSliderHorizontal01.typeCircle .ulSlideNavi > li {
  width: 9px;
  height: 9px;
  margin: 0 0.41em;
  border-radius: 9px;
  background-color: #ff0000;
}

.boxCsnkSliderHorizontal01 .ulSlideNavi > li.current {
  position: relative;
  top: -0.25em;
  border-bottom: 1px #fff solid;
  font-size: 1.4rem;
}
.boxCsnkSliderHorizontal01.typeCircle .ulSlideNavi > li.current {
  top: auto;
  border-bottom: 0;
  background-color: #fff;
  font-size: 1.1rem;
}