/* Dolce & Vivace
 * https://base.dolcevivace.com/
 * Copyright Dolce & Vivace
 */

/* スマホ下部に購入ボタン固定表示 */

@media (max-width: 959px) {




#shopDetailPage #page-top {
  bottom: calc(20px + env(safe-area-inset-bottom));
}
#shopDetailPage #page-top.bottomcart-visible {
  bottom: calc(84px + env(safe-area-inset-bottom));
}
 

  #shopDetailPage .msg_startButton {
    bottom: 17px !important;
		bottom: calc(17px + env(safe-area-inset-bottom)) !important;
    -webkit-transition: bottom 0.35s !important;
    transition: bottom 0.35s !important;
  }

   #shopDetailPage .msg_startButton.bottomcart-visible {
    bottom: 81px !important;
    bottom: calc(81px + env(safe-area-inset-bottom)) !important;
    -webkit-transition: bottom 0.35s !important;
    transition: bottom 0.35s !important;
  }



#bottom-cart{
	display: block;
	position:fixed;
	bottom:0;
	z-index:900;
	width:100%;
	background:#fff;
	-webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
   -moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
   box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
   height: auto;
   padding-bottom: calc(10px + env(safe-area-inset-bottom));
   -webkit-transition: bottom 0.35s;
  transition: bottom 0.35s;
}

#bottom-cart.out{
  bottom: calc(-74px - env(safe-area-inset-bottom));
  -webkit-transition: bottom 0.35s;
  transition: bottom 0.35s;
}


#bottom-cart{
  bottom: 0;
  transform: translateY(100%);
  transition: transform 0.35s ease-out; 
  will-change: transform;
}
#bottom-cart.is-visible{
  transform: translateY(0);
}


.bottom-cart-inner{
  display: none;
}
#bottom-cart .fr{
	width:100%;
  padding: 10px 15px 0;
}
#bottom-cart #itemSelect{
	display:none;
}
#bottom-cart .purchase-btn button,
#bottom-cart .purchase-btn button:hover,
#bottom-cart .purchase-btn button:active,
#bottom-cart .purchase-btn button:focus,
#bottom-cart .purchaseButton button,
#bottom-cart .purchaseButton button:hover,
#bottom-cart .purchaseButton button:active,
#bottom-cart .purchaseButton button:focus{
	font-size: 0.9375rem;
  font-weight: bold;
  line-height: 22px;
  position: relative;
  display: inline-block;
  padding: 14px 25px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  border: none;
  border-radius: 9px;
  width:100%;
  max-width: 100%;
  background-color: var(--dolce-cart-color, #000000);
  color: #fff;
}

.bottom-soldout{
  font-size: 1.125rem;
  font-weight: bold;
  line-height: 22px;
  position: relative;
  display: inline-block;
  padding: 4px 25px;
  cursor: default;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  border: none;
  border-radius: 9px;
  width:100%;
  margin: 10px auto 0;
	width:100%;
	font-size:16px;
	font-weight:bold;
	text-align:center;
}


.bottom-comingsoon{
  font-size: 1.125rem;
  font-weight: bold;
  line-height: 22px;
  position: relative;
  display: inline-block;
  padding: 4px 25px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  border: none;
  border-radius: 9px;
  width:100%;
  margin: 10px auto 0;
	width:100%;
	font-size:16px;
	font-weight:bold;
	text-align:center;
}

.bottom-soldout{
	color: var(--dolce-soldout-color, #E50F0D);
}

.bottom-comingsoon{
  color: var(--dolce-comming-color, #00C7B6);
}

#bottom-cart i.fa{
  font-size: 20px;
  padding-right: 5px;
}

#bottom-cart .purchaseButton,
#bottom-cart .purchaseButton .purchaseButton__btn{
  margin: 0 auto !important;
}

footer {
		padding-bottom: 60px;
}

#dolce-itemdetail #purchase_form{
  margin-top: calc(-70px - var(--information-banner-height, 0));
  padding-top: calc(70px + var(--information-banner-height, 0));

}

}