/***************************************************************

ストアページ

***************************************************************/

/*-------------------------------------------------------------
ステッパー
---------------------------------------------------------------*/
/* WebKit ブラウザで、input type="number" のスピンボタンを非表示にする。 */
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  appearance: none;
  margin: 0;
}

/* Firefox で、input type="number" のスピンボタンを非表示にする。また、入力欄の値表示を中央寄せにし、高さをボタンのサイズに合わせる。 */
input[type="number"] {
  -moz-appearance: textfield;
  text-align: right;
  width:  4rem;
  height:3rem;
  border:1px solid #ccc;
  /*margin-top:-1px;*/
}

/*ボタンのサイズを 44 × 44 CSS ピクセルにする。*/
button.btn-number {
  width:  3rem;
  height: 3rem;
  border:1px solid #ccc;
  margin:0 0.2rem;
  background:#eee;
  border-radius:8px;
}

/* ステッパーコンポーネントの横幅を指定する。 */
.input-group {
  width: 10.4rem;
  margin:1rem auto 0 auto;
  display:flex;
}
/********************************************************************
 ステッパー以外
*********************************************************************/
/* ---------------------------------------------------------
769px以上
----------------------------------------------------------*/
@media not screen and (max-width:769px) {
  .ds-book .imagetxt{
	margin-top:-0.5rem;
	width:100%;
	overflow:hidden;
	font-size:1.7rem;
	line-height:2.2rem;
  }

  .ds-book .imagetxt img{
	float:left;
	width:40%;
	margin-left:2%;
  }

  .ds-book .imagetxt h4{
	margin-top:3rem;
	margin-bottom:4rem;
  }

  .ds-book .story h5{
	font-size:1.8rem;
	line-height:2.2rem;
	font-weight:bold;
  }
  .ds-book .story ul li{
	font-size:1.8rem;
	line-height:2.2rem;
	margin:0.5rem 0;
         list-style: inside; 
  }
  .ds-book .price{
	margin:4rem 0;
  }
  .ds-book .price ul{
	width:100%;
	display:flex;
	border:2px solid #0f6ba1;

  }
  .ds-book .price ul li h6{
	line-height:3rem;
	background:#96d3d9;
	text-align:center;
	border-bottom:2px solid #0f6ba1;
  }
  .ds-book .price ul li p,.ds-book .price ul li .input-group{
	height:7rem;
	padding:1.5rem 0;
  }

  .ds-book .price ul li.book_price1{
	width:30%;
	border-right:2px solid #0f6ba1;
  }
  .ds-book .price ul li.book_price1 p{
	padding:1.5rem;
  }
  .ds-book .price ul li.book_price2{
	width:50%;
	text-align:center;
	border-right:2px solid #0f6ba1;
  }
  .ds-book .price ul li.order{
	width:50%;
  }
}
/* ---------------------------------------------------------
769px未満
----------------------------------------------------------*/
@media screen and (max-width:769px) {
  .ds-book .imagetxt img{
	width:80%;
	display:block;
	margin:1rem auto;
  }
  .ds-book .imagetxt h4{
	margin-top:2rem;
	font-size:1.6rem;
	line-height:2.2rem;
	font-weight:bold;
	margin-bottom:2rem;
  }
  .ds-book .imagetxt p{
	padding:0 1.5rem;
  }
  .ds-book .story{
	margin:2rem 0 0 0;
  }
  .ds-book .story ul li{
	width:100%;
	font-size:1.5rem;
	line-height:2.2rem;
	margin:0.5rem 0;
        list-style: inside; 
	text-indent:-1.5rem;
	padding:0 1rem 0 2rem;
	overflow-wrap: break-word;
  }
  .ds-book .price{
	margin:4rem 0;
  }
  .ds-book .price ul li{
	border:2px solid #0f6ba1;
	margin-bottom:2px;
  }
  .ds-book .price ul li h6{
	line-height:3rem;
	font-size:1.5rem;
	background:#96d3d9;
	text-align:center;
	border-bottom:2px solid #0f6ba1;

  }
  .ds-book .price ul li p{
	line-height:2rem;
	font-size:1.5rem;
	text-align:center;
	padding:1rem 0;
  }
  .input-group {
	padding:1rem 0;
  }
  .input-group input[type="number"] {
	font-size:1.5rem;

  }
}
/***************************************************************

確認ページ

***************************************************************/
.ds-purchase-item .book{
	width:100%;
}
.ds-purchase-item h4{
	font-size:2.0rem;
	line-height:3rem;
}

.ds-purchase-item .notice{
	font-size:1.4rem;
	text-align:center;
}
.ds-purchase-item .book li ul li{
	padding:2% 1%;
	line-height:3rem;
}

.ds-purchase-item .book li ul li.tli{
	background:#96d3d9;
	font-size:1.4rem;
}
.ds-purchase-item .book li ul li.cta{
	text-align:right;
	background:#eee;
}
/* ---------------------------------------------------------
769px未満
----------------------------------------------------------*/
@media screen and (max-width:769px) {
  .ds-purchase-item .book li ul li{
	display: block;
	width:100%;
	padding:1% 1%;
	line-height:2rem;
	font-size:1.4rem;
  }
  .ds-purchase-item .book li ul li.cta{
	font-size:2.0rem;
	line-height:3.5rem;
	padding:2% 1%;
	text-align:center;
  }
}
/* ---------------------------------------------------------
769px以上
----------------------------------------------------------*/
@media not screen and (max-width:769px) {
  .ds-purchase-item .book li ul li{
	display: inline-block;
	width:48%;
	padding:2% 1%;
	line-height:3rem;
  }
}