/* ポップアップ中身
------------------------------------------------------- */
.product_popup_contents{
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: 85px 80px;
}

.product_popup_main {
  width: 600px;
}
.product_popup_main p{
  font-size: 18px;
  text-align: left;
}

.product_popup_thumb{
  width: 320px;
}
.product_popup_thumb dt{
  width: 150px;
}
.product_popup_thumb dt img{
  width: 100%;
}
.product_popup_thumb dd{
  width: 155px;
  font-size: 20px;
  font-weight: bold;
  line-height: 1.4;
  text-align: left;
}


.product_popup_thumb_list::before {
  display: block;
  content: "";
  width: 70px;
  order: 1;
}

.product_popup_thumb_list::after {
  display: block;
  content: "";
  width: 70px;
}

.product_popup_thumb_list {
  width: 70px;
  margin-top: 20px;
  margin-right: 10px;
  cursor: pointer;
}
.product_popup_thumb_list img{
  width: 100%;
  box-sizing: border-box;
}
.product_popup_thumb_list_select {
  border: solid 1px #B1B1B1;
}
.is_selected {
  border: solid 4px #FF6C00 !important;
}


.product_popup_img_box {
  width:100%; /* 画像サイズを決める */
  border: solid 1px #B1B1B1;
  position: relative;
  overflow: hidden; /* 画像を拡大したときにはみ出た部分を非表示 */
  cursor: url(../images/common/zoomin.cur), pointer;
}

.product_popup_img_box img{
  width: 100%;
  height: 100%;
}

/* detail_img_box クリックしたときの動き */
.magnifier-preview {
  width: 100%;
  height: 100%;
  position: absolute;
  visibility:  hidden;
}
#magnifier-item-0-lens {
  display: none;
}
.product_popup_img_protect {
  z-index: 999;
}
.opaque {
  opacity: 1;
}
.is_zoom {
  cursor: url(../images/common/zoomout.cur), pointer;
}


/*
ポップアップウィンドウ
---------------------*/

.product_popup_detail .product_popup_window {
  /* ポップアップ全体 */
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  width: 100%;
  height: 100%;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  z-index: 100;
}

.product_popup_detail .product_label_overlay {
  /* 背景のオーバーレイ */
  width: 100%;
  height: 100%;
  margin: 0;
  background-color: rgb(200 200 200 / 80%);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 101;
}

.product_popup_detail .product_popup_inner {
  /*コンテンツ領域 */
  display: inline-block;
  height: auto;
  max-height: calc(100vh - 80px);
  margin: 0 15px;
  position: relative;
  z-index: 102;
}

.product_popup_detail .product_popup_wrap {
  /* コンテンツ単一 */
  width: auto;
  background-color: #fff;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

.product_popup_detail .product_label_close {
  /* ×ボタン */
  width: 55px;
  height: 55px;
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 103;
  cursor: pointer;
}
.product_popup_detail .product_label_close::before, .product_popup_detail .product_label_close::after {
  content: "";
  display: block;
  width: 50px;
  height: 5px;
  background-color: #ccc;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}
.product_popup_detail .product_label_close::before {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.product_popup_detail .product_label_close::after {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.product_popup_detail input[type=radio] {
  /* ポップアップ機能部分 */
  display: none;
  opacity: 0;
  width: 0;
  height: 0;
  margin: 0;
  padding: 0;
}

.hide_product_popup {
  display: none !important;
}

body.no_scroll {
  overflow: hidden;
}

.product_label_thumb {
  cursor: pointer;
}