.product_slider_wrap {
  display: grid;
  row-gap: 2rem;
  @media(min-width: 768px) {
    grid-template-columns: repeat(2, 1fr);
    column-gap: 1.11rem;
    row-gap: unset;
  }
  > * {
    min-width: 0;
    min-height: 0;
  }
}
.product_slider_swiper-button-next {
  width: 1.44rem !important;
  height: 3.11rem !important;
  &::after {
    content: '' !important;
    width: 1.44rem;
    height: 3.11rem;
    background: url('https://46923556.fs1.hubspotusercontent-na1.net/hubfs/46923556/product_slider_arrow_right.svg') no-repeat center / contain !important;
  }
}
.product_slider_swiper-button-prev {
  width: 1.44rem !important;
  height: 3.11rem !important;
  &::after {
    content: '' !important;
    width: 1.44rem;
    height: 3.11rem;
    background: url('https://46923556.fs1.hubspotusercontent-na1.net/hubfs/46923556/product_slider_arrow_left.svg') no-repeat center / contain !important;
  }
}
.swiperMain {
  .swiper-slide {
    display: flex;
    justify-content: center;
    align-items: center;
    figure {
      display: flex;
      justify-content: center;
      align-items: center;
      margin: unset;
      aspect-ratio: 375 / 403;
      width: 70%;
      img {
        width auto !important;
        height: 100% !important;
        object-fit: contain;
      }
    }
  }
  .swiper-slide-prev,
  .swiper-slide-next {
    opacity: 0 !important;
    &.swiper-slide-active {
      opacity: 1 !important;
    }
  }
}
.swiperThumbnail {
  margin-top: 1.11rem;
  .swiper-slide {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #FAFAFA;
    aspect-ratio: 120 / 77;
    border: 1px solid #FAFAFA;
    box-sizing: border-box;
    &.swiper-slide-thumb-active {
      border: 1px solid #000000;
    }
    figure {
      display: flex;
      justify-content: center;
      align-items: center;
       height: 100%;
       margin: unset;
       aspect-ratio: 120 / 77;
      img {
        width auto !important;
        height: 100% !important;
        object-fit: contain;
      }
    }
  }
}
.product_info {
  display: flex;
  flex-direction: column;
  row-gap: unset;
  @media(min-width: 768px) {
    justify-content: space-between;
  }
}
.product_subttl {
  margin-bottom: 0.39rem;
  display: block;
  font-size: 0.89rem;
  font-weight: 700;
}
.product_ttl {
  margin-top: unset;
  margin-bottom: 0.89rem;
  font-size: 1.56rem;
  font-weight: 700;
  @media(min-width: 768px){
    margin-bottom: 2rem;
  }
}
.product_ce_list {
  margin: 2rem 0;
  padding: unset;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}
.product_ce_item {
  margin: unset;
  padding: unset;  
  display: grid;
  place-content: center;
  width: 2rem;
  height: 2rem;
  @media(min-width: 768px){
    width: 3rem;
    height: 3rem;
  }
  img {
    width: 100%;
    height: auto;
    object-fit: contain;
  }
}
.product_info_list {
  margin-bottom: 1.94rem;
  display: flex;
  flex-direction: column;
  row-gap: 0.67rem;
  list-style: unset;
  padding: unset;
}
.product_info_item {
  display: grid;
  grid-template-columns: max-content 1fr;
  column-gap: 0.44rem;
  font-size: 0.89rem;
  font-weight: 500;
  &::before {
    content: "●";
    font-size: 0.89rem;
    font-weight: 500;
  }
}
.product_info_btn {
  justify-self: flex-end;
}
.product_catalog_btn {
  margin-bottom: 1rem;
  position: relative;
  padding: 0.78rem;
  display: block;
  width: 100%;
  color: #005BAC;
  border: 1px solid #005BAC;
  font-size: 1rem;
  font-weight: 700;
  color: #005BAC;
  background-color: #ffffff;
  opacity: 1;
  transition: .3s all ease-in-out;
  text-decoration: none;
  text-align: center;
  &::after {
    position: absolute;
    top: 50%;
    right: 0.83rem;
    transform: translateY(-50%);
    display: block;
    content: '';
    width: 0.44rem;
    height: 0.83rem;
    background: url("https://46923556.fs1.hubspotusercontent-na1.net/hubfs/46923556/arrow_blue_04.svg") no-repeat center / contain;
  }
  &:hover {
    opacity: 0.75;
  }
}
.product_file_btn {
  position: relative;
  padding: 0.78rem;
  display: block;
  width: 100%;
  color: #000000;
  border: 1px solid #005BAC;
  font-size: 1rem;
  font-weight: 700;
  color: #ffffff;
  background-color: #005BAC;
  opacity: 1;
  transition: .3s all ease-in-out;
  text-decoration: none;
  text-align: center;
  &::after {
    position: absolute;
    top: 50%;
    right: 0.83rem;
    transform: translateY(-50%);
    display: block;
    content: '';
    width: 0.44rem;
    height: 0.83rem;
    background: url("https://46923556.fs1.hubspotusercontent-na1.net/hubfs/46923556/arrow_white.svg") no-repeat center / contain;
  }
  &:hover {
    opacity: 0.75;
  }
}
.modal_open_btn {
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 0.2rem 0.5rem;
  display: grid;
  grid-template-columns: max-content max-content;
  font-size: 0.72rem;
  column-gap: 0.17rem;
  font-weight: 400;
  color: #ffffff;
  background-color: #4D4D4D;
  opacity: 1;
  transition: .3s all ease-in-out !important;
  z-index: 10;
  cursor: pointer;
  &::before {
    display: block;
    content: '';
    background: url("https://46923556.fs1.hubspotusercontent-na1.net/hubfs/46923556/tabler_search_white.svg") no-repeat center / contain;
    width: 0.89rem;
    height: 0.89rem;
  }
  &:hover {
    opacity: 0.75;
  }
}

.product_slider_modal_wrap {
  display: none;
  justify-content: center;
  align-items: center;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 998;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  &.open {
    display: flex;
  }
}
.product_slider_modal {
  margin: auto;
  padding: 1rem;
  background-color: #ffffff;
  width: 100%;
  @media(min-width: 768px) {
   
    width:  50.78rem;
  }
  > * {
    min-width: 0;
    min-height: 0;
  }
}
.modal_swiper-button-next {
  width: 1.56rem !important;
  height: 3.22rem !important;
  &::after {
    content: '' !important;
    width: 1.56rem;
    height: 3.22rem;
    background: url('https://46923556.fs1.hubspotusercontent-na1.net/hubfs/46923556/product_slider_arrow_right.svg') no-repeat center / contain !important;
  }
}
.modal_swiper-button-prev {
  width: 1.56rem !important;
  height: 3.22rem !important;
  &::after {
    content: '' !important;
    width: 1.56rem;
    height: 3.22rem;
    background: url('https://46923556.fs1.hubspotusercontent-na1.net/hubfs/46923556/product_slider_arrow_left.svg') no-repeat center / contain !important;
  }
}
.swiperMain_modal {
  width: 100%;
  margin-inline: auto;


  .swiper-slide {
    display: flex;
    justify-content: center;
    align-items: center;
    figure {
      display: flex;
      justify-content: center;
      align-items: center;
      margin: unset;
      aspect-ratio: 375 / 403;
      width: 90%;
      max-height: 415px;
      img {
        width auto !important;
        height: 100% !important;
        object-fit: contain;
      }
    }
  }
  .swiper-slide-prev,
  .swiper-slide-next {
    opacity: 0 !important;
    &.swiper-slide-active {
      opacity: 1 !important;
    }
  }
}
.swiperThumbnail_modal {
  margin-top: 1.11rem;
  margin-inline: auto;
  width: 100%;
  @media(min-width: 768px) {
    width: 614px;
  }  
  .swiper-wrapper {
    @media(min-width: 768px) {
      justify-content: center !important;
    }
  }  
  .swiper-slide {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #FAFAFA;
    aspect-ratio: 120 / 77;
    border: 1px solid #FAFAFA;
    box-sizing: border-box;
    &.swiper-slide-thumb-active {
      border: 1px solid #000000;
    }
    figure {
      display: flex;
      justify-content: center;
      align-items: center;
       height: 100%;
       margin: unset;
       aspect-ratio: 120 / 77;
      img {
        width auto !important;
        height: 100% !important;
        object-fit: contain;
      }
    }
  }
}
.modal_close_btn {
  position: relative;
  margin-top: 1.5rem;
  margin-inline: auto;
  width: 15.28rem;
  padding: 0.61rem;
  font-size: 0.83rem;
  font-weight: 500;
  border-radius: 5px;
  background-color: #EBEBEB;
  text-align: center;
  opacity: 1;
  transition: .3s all ease-in-out;
  cursor: pointer;
  &::after {
    position: absolute;
    content: '';
    top: 50%;
    right: 0.56rem;
    transform: translateY(-50%);
    background: url("https://46923556.fs1.hubspotusercontent-na1.net/hubfs/46923556/arrow_black.svg") no-repeat center / contain;
    width: 0.39rem;
    height: 0.72rem;
  }
  &:hover {
    opacity: 0.75;
  }
}


.modalOpen {
  cursor:pointer;
  transition:.3s;
  &:hover {
    opacity:.75;
  }
}