@charset "UTF-8";
/*------------------------------------------------------------------------------------------------------
*
* LbBg
*
------------------------------------------------------------------------------------------------------*/
#Lb_Bg {
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: 1200;
  background: rgba(0, 0, 0, 0.85);
  top: 0;
  left: 0;
  display: none;
}

/*-----------------------------------------------------------------------------------------------------------------------------
*
*
*  ライトボックス
*
*
-----------------------------------------------------------------------------------------------------------------------------*/
#Lb_Detail {
  position: fixed;
  z-index: 1300;
  left: 50%;
  top: 50%;
  display: none;
}
#Lb_Detail .backBtn {
  background: url(/assets/images/common/lightBox-ui/backBtn.png);
  width: 40px;
  height: 40px;
  position: absolute;
  left: 0%;
  margin-left: -80px;
  top: 50%;
  margin-top: -20px;
  cursor: pointer;
}
#Lb_Detail .backBtn:hover {
  background: url(/assets/images/common/lightBox-ui/backBtn-over.png);
}
#Lb_Detail .nextBtn {
  background: url(/assets/images/common/lightBox-ui/nextBtn.png);
  width: 40px;
  height: 40px;
  position: absolute;
  left: 100%;
  margin-left: 40px;
  top: 50%;
  margin-top: -20px;
  cursor: pointer;
}
#Lb_Detail .nextBtn:hover {
  background: url(/assets/images/common/lightBox-ui/nextBtn-over.png);
}
#Lb_Detail .closeBtn {
  background: url(/assets/images/common/lightBox-ui/closeBtn.png);
  width: 40px;
  height: 40px;
  position: absolute;
  left: 50%;
  margin-left: -20px;
  bottom: -70px;
  cursor: pointer;
}
#Lb_Detail .closeBtn:hover {
  background: url(/assets/images/common/lightBox-ui/closeBtn-over.png);
}
#Lb_Detail .closeBtn.second {
  left: 100%;
  bottom: auto;
  top: -45px;
  margin-left: 5px;
}
#Lb_Detail .container {
  position: absolute;
  height: 100%;
  width: 100%;
}
#Lb_Detail .container li {
  position: absolute;
  height: 100%;
  width: 100%;
}
#Lb_Detail .container li img {
  height: 100%;
  width: 100%;
}

.lightBox li {
  cursor: pointer;
}
@media screen and (max-width: 768px) {
  .lightBox {
    display: none;
  }
  .lightBox.noResponsive {
    display: block;
  }
}

.lightBoxSp {
  display: none;
}
.lightBoxSp li {
  width: 100%;
  height: auto;
}
.lightBoxSp li img {
  width: 100%;
  height: auto;
}
@media screen and (max-width: 768px) {
  .lightBoxSp {
    display: block;
  }
  .lightBoxSp li {
    display: none;
  }
  .lightBoxSp li.sp {
    display: block;
      float: none!important;
  }
}
