@charset "utf-8";

/* 
↓　下記をすべて挿入　 */

/* PC/SP共通 */
.vsm-goods .ecbn-selection-widget-new div.ecbn-selection-wrapper, .vsm-slider .ecbn-selection-widget-new div.ecbn-selection-wrapper {
  max-width: 990px;
  min-width: auto!important;
  margin: 0 auto !important;
}
.ecbn-selection-wrapper .ecbn-selection-slide-wrapper {
  width: 100%!important;
}
.ecbn-selection-page-wrapper .ecbn-selection-page-tabs-box, .ecbn-selection-wrapper .ecbn-selection-tabs-box {
  width: 1200px!important;
  margin: 0 auto !important;
  overflow-x: hidden;
}
.ecbn-selection-slider-view {
  width: 990px;
  margin: 0 auto;
}
.ecbn-selection-wrapper .ecbn-selection-slider-controls-direction a {
  width: 56px !important;
  height: 56px !important;
  background:  url(/pages/xmas/img/icn_slider_custom.png) no-repeat center / cover !important;
  opacity: 1 !important;
}
.ecbn-selection-wrapper .ecbn-selection-slider-controls-direction a:hover {
  opacity: .7 !important;
}
.ecbn-selection-wrapper .ecbn-selection-slider-controls-direction a::before {
  content: none !important;
}
.ecbn-selection-wrapper .ecbn-selection-slider-controls-direction a.ecbn-selection-slider-prev {
  top: 50%;
  transform: translateY(-50%) rotate(180deg) !important;
  left: 0;
}
.ecbn-selection-wrapper .ecbn-selection-slider-controls-direction a.ecbn-selection-slider-next {
  top: 50%;
  transform: translateY(-50%) !important;
  right: 0!important;
}
.ecbn-selection-header,
.ecbn-selection-header2,
.ecbn-selection-title,
.ecbn-selection-description,
.ecbn-selection-to-nextpage,
.ecbn-selection-page-tabs-area {
  display: none;
}
.ecbn-selection-page-wrapper {
  margin: 0 auto!important;
}
.vsm-goods .ecbn-selection-wrapper li.ecbn-selection-item>div>a,
.vsm-slider .ecbn-selection-wrapper li.ecbn-selection-item>div>a {
  height: 533px;
  width: 300px;
  border-radius: 20px;
}
.ecbn-selection-image {
  height: 100%;
  display: block;
}
.vsm-goods .ecbn-selection-wrapper li.ecbn-selection-item, .vsm-slider .ecbn-selection-wrapper li.ecbn-selection-item {
  margin-right: 30px;
}
.ecbn-selection-preview .ecbn-selection-preview-close {
  top: 20px;
  right: 20px;
}
.ecbn-selection-preview .ecbn-selection-preview-close:before,
.ecbn-selection-preview .ecbn-selection-preview-close:after {
  background: #b79b68;
}
.ecbn-selection-preview .ecbn-selection-preview-content {
  border-radius: 20px;
  background: linear-gradient(to right, rgba(244, 231, 215, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(244, 231, 215, 1) 100%);
  display: flex;
}
.ecbn-selection-preview .ecbn-selection-right,
.ecbn-selection-preview .ecbn-selection-preview-personal {
  width: 100%;
  padding-right: 30px;
}
.ecbn-selection-preview .ecbn-selection-preview-content::after {
  content: "";
  display: block;
  position: absolute;
  width: calc(100% - 20px);
  height: calc(100% - 20px);
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  border: 1px solid #b79b68;
  border-radius: 10px;
  pointer-events: none;
  z-index: 2;
}
.ecbn-selection-preview .ecbn-selection-left {
  margin-left: 10px;
}
.ecbn-selection-preview .ecbn-selection-left div.ecbn-selection-snapmain .ecbn-selection-prevarrow {
  background:  url(/pages/xmas/img/icn_slider_custom.png) no-repeat center / contain !important;
  transform: rotate(180deg);
}
.ecbn-selection-preview .ecbn-selection-left div.ecbn-selection-snapmain .ecbn-selection-nextarrow {
  background:  url(/pages/xmas/img/icn_slider_custom.png) no-repeat center / contain !important;
}
.ecbn-selection-preview .ecbn-selection-left div.ecbn-selection-snapmain .ecbn-selection-next-image, .ecbn-selection-preview .ecbn-selection-left div.ecbn-selection-snapmain .selection-prev-image {
  width: 40px;
}
.ecbn-selection-preview .ecbn-selection-left div.ecbn-selection-snapmain .ecbn-selection-snap-image {
  border: solid 1px #edd8b1;
}

.ecbn-selection-preview .ecbn-selection-preview-caption p {
    height: 450px;
}
/* PC */

@media (min-width: 721px) {
  .ecbn-selection-preview .ecbn-selection-right-footer2 {
    right: 30px;
    bottom: 30px;
  }
  .ecbn-selection-preview .ecbn-selection-left {
    padding-left: 20px;
    width: auto;
    margin: 0;
  }
  .ecbn-selection-preview .ecbn-selection-left div.ecbn-selection-snapmain {
    overflow: auto;
  }
  .ecbn-selection-preview .ecbn-selection-left div.ecbn-selection-snapmain .selection-prev-image {
    left: 2px;
    z-index: 10;
  }
  .ecbn-selection-preview .ecbn-selection-left div.ecbn-selection-snapmain .ecbn-selection-next-image {
    right: 2px;
    z-index: 10;
  }
  .ecbn-selection-preview .ecbn-selection-left div.ecbn-selection-snapmain .ecbn-selection-snap-image {
    margin: 0 20px;
  }  
}

/* SP */

@media (max-width: 768px) {
  .ecbn-selection-wrapper .ecbn-selection-slider-controls-direction a {
    width: 40px !important;
    height: 40px !important;
    background:  url(/pages/xmas/img/icn_slider_custom.png) no-repeat center / cover !important;
    opacity: 1 !important;
  }
  .vsm-goods .ecbn-selection-widget-new div.ecbn-selection-wrapper, .vsm-slider .ecbn-selection-widget-new div.ecbn-selection-wrapper {
    max-width: none;
    min-width: auto!important;
    margin: 0 auto !important;
  }
  .vsm-goods .ecbn-selection-wrapper li.ecbn-selection-item>div>a,
  .vsm-slider .ecbn-selection-wrapper li.ecbn-selection-item>div>a {
    height: 100%;
    width: 100%;
    aspect-ratio: 9 / 16;
    border-radius: 10px;
  }
  .vsm-goods .ecbn-selection-wrapper li.ecbn-selection-item, .vsm-slider .ecbn-selection-wrapper li.ecbn-selection-item {
    margin-right: 10px;
  }
  .ecbn-selection-preview .ecbn-selection-preview-content {
    margin-top: 51px;
    display: block;
  }
  .ecbn-selection-preview .ecbn-selection-left div.ecbn-selection-snapmain .ecbn-selection-snap-image video.portrait {
    /* padding-top: 20px; */
    border-radius: 10px 10px 0 0;
  }
  .ecbn-selection-preview .ecbn-selection-left div.ecbn-selection-snapmain .ecbn-selection-snap-image {
    border-radius: 10px 10px 0 0;  
  }  
  .ecbn-selection-preview .ecbn-selection-left {
    margin: 10px auto 0 10px;
    width: calc(100% - 20px);
  }
  .ecbn-selection-preview .ecbn-selection-right {
    padding: 10px 10px 4px 10px;
  }
  .ecbn-selection-preview .ecbn-selection-preview-close {
    top: 10px;
    right: 20px;
  }
  .ecbn-selection-preview .ecbn-selection-right-footer2 {
    margin-bottom: 10px;
  }
  .ecbn-selection-preview .ecbn-selection-preview-caption p {
    height: auto;
  }
}
