.contents-inner {
  margin: 40px 0;
  width: 100%;
}
/*
.contents-inner h2::before {
  font-family: 'FontAwesome';
  content: '\f111';
  color: #fff;
  width: 1.6em;
  margin: 0 10px;
}
*/
.contents-inner h2 {
	border-bottom: 3px solid #000;
  margin-bottom: 50px;
  padding: 12px 5px 10px;
  font-size: 1.5em;
/*   font-weight: normal; */
  color: #000;
  background-color: #fff;
}
.contents-inner .item_name {
  margin: 15px auto 10px;
}
.contents-inner .item_price {
  margin: 0 auto 0;
}
.item_regular_price p {
	text-decoration: line-through;
}
.contents-inner .item_discount_rate {
	color: #ca0f3b;
}
.contents-inner ul {
  display: table;
  table-layout: fixed;
  width: 100%;
  text-align: center;
}
.contents-inner li {
  display: table-cell;
  float: left;
  width: 19.2%;
  padding: 0;
  margin-right: 1%;
  box-sizing: content-box;
  -webkit-box-sizing: content-box;
}
.contents-inner li:nth-of-type(5n) {
  margin-right: 0;
}

/* ランキング */
.wrapper-rank_box {
	margin-bottom: 20px;
  position: relative;
  width: 100%;
}
.rank_box {
  width: 25px;
  height: 25px;
  color: #fff;
  font-size: 18px;
  display: block;
  position: absolute;
  top: -35px;
  left: -webkit-calc(50% - 12.5px);
  left: calc(50% - 12.5px);
}

.ranking {
  position: absolute;
  display: block;
  z-index: 5;
}


.rank_box_color_1 {
  background-image: url("https://img15.shop-pro.jp/PA01154/575/etc/rank01.gif?cmsp_timestamp=20180901072733");
  background-repeat: no-repeat;
  background-size: contain;
}


.rank_box_color_2 {
   background-image: url("https://img15.shop-pro.jp/PA01154/575/etc/rank02.gif?cmsp_timestamp=20180901072749");
  background-repeat: no-repeat;
  background-size: contain;
}

.rank_box_color_3 {
   background-image: url("https://img15.shop-pro.jp/PA01154/575/etc/rank03.gif?cmsp_timestamp=20180901072800");
  background-repeat: no-repeat;
  background-size: contain;
}

.rank_box_color_4 {
   background-image: url("https://img15.shop-pro.jp/PA01154/575/etc/rank04.gif?cmsp_timestamp=20180901072811");
  background-repeat: no-repeat;
  background-size: contain;
}

.rank_box_color_5 {
   background-image: url("https://img15.shop-pro.jp/PA01154/575/etc/rank05.gif?cmsp_timestamp=20180901072829");
  background-repeat: no-repeat;
  background-size: contain;
}
.rank_number, .rank_pc_number {
  display: none;
}

/* ===== 花匠美が選ばれる理由 ===== */
.contents-middle {
	background-color: #f5eee0;
	border-radius: 30px;
  margin: 50px auto;
  width: 100%;
  height: auto;
  padding: 20px 0;
}
.middle-inner {
  position: relative;
  width: 95%;
  margin: 0 auto;
}
.middle-img-box-1{
  width: 100%;
  height: 150px;
  margin-bottom: 50px;
}
.middle-img-box-1 img {
  display: imline-block;
}
.middle-img-box-1 img:nth-of-type(1){
  max-width: 106px;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.middle-img-box-1 img:nth-of-type(2){
/*
  max-width: 460px;
  width: 100%;
*/
  position: absolute;
  top: 30px;
  left: -webkit-calc(50% - 230px);
  left: calc(50% - 230px);
}

.middle-img-box-1 img:nth-of-type(3){
  max-width: 106px;
  width: 100%;
  position: absolute;
  top: 0;
  left: unset;
  right: 0
}
.middle-txt-box {
	background-color: #fff;
	padding: 20px 0;
	border-radius: 30px;
  text-align: center;
  width: 100%;
}
.middle-txt-box p {
  letter-spacing: .1em;
  line-height: 2;
}
.middle-txt-box p span {
	color: #ad0c32;
/*   color: #926a18; */
/*   font-weight: bold; */
  font-size: 1.4em;
}

.middle-img-box-2 {
  display: table;
  table-layout: fixed;
  width: 100%;
  height: 150px;
  text-align: right;
  margin: 50px auto;
}
.middle-img-box-2 p {
  display: table-cell;
  width: 80%;
  padding-right: 8%;
  vertical-align: middle;
}
.middle-img-box-2 img {
  display: table-cell;
  float: right;
  padding-right: 10px;
  width: 150px;
}


/* ===== お知らせ ===== */
.contents-info {
  margin: 0 auto;
  padding: 0;
  width: 95%;
}
.contents-info h2 {
  margin: 10px auto;
  padding: 0;
  text-align: center;
  font-size: 1.4em;
  font-weight: bold;
  border-bottom: none;
  color: #642937;

}
.info-txt-box {
  border: 1px solid #000;
  color: #642937;
  margin-bottom: 20px;
  padding: 30px 15px;
  line-height: 1.8;
  letter-spacing: .15em;
}


/* ===== レスポンシブ ===== */
@media (max-width: 980px) {
  /* ~980px */
  .middle-img-box-1 img:nth-of-type(1){
    max-width: 100px;
  }
 .middle-img-box-1 img:nth-of-type(2) {
   max-width: 380px;
   left: -webkit-calc(50% - 190px);
   left: calc(50% - 190px);
  }
  .middle-img-box-1 img:nth-of-type(3){
    max-width: 100px;
  }

}

@media (max-width: 768px) {
  /* ~768px */

	.contents-inner {
		margin: 10px 0;
	}
  .contents-inner h2 {
    margin-bottom: 50px;
  }

	.contents-inner .item_name {
	  margin: 15px auto 10px;
	  font-size: 12px;
	}
	.contents-inner .item_price {
	  margin: 0 auto 0;
	  font-size: 12px;
	}

	.item_regular_price p {
		font-size: 12px;
	}

	.contents-inner .item_discount_rate {
		color: #ca0f3b;
	  font-size: 12px;
	}
  .contents-inner .mar-bottom  {
    margin-bottom: 25px;
  }
  .contents-inner li {
    width: 32.6%;
    margin-bottom: 40px;
 	}
  .contents-inner li:nth-of-type(3n) {
  	margin-right: 0;
	}
  .hidden-tablet {
    display: none !important;
  }
  .hidden-desktop {
    display: none !important;
  }
/* ===== 花匠美が選ばれる理由 ===== */
  .middle-inner {
    width: 90%;
    margin: 10px auto;
	}
/* ===== お知らせ ===== */
  .contents-info {
    width: 90%;
   }

}

@media (max-width: 600px) {
  /* ~600px */

/* ===== 花匠美が選ばれる理由 ===== */
  .middle-img-box-1 {
    margin-bottom: 0;
  }
  .middle-img-box-1 img:nth-of-type(1){
    max-width: 70px;
  }
 .middle-img-box-1 img:nth-of-type(2) {
   max-width: 300px;
   left: -webkit-calc(50% - 150px);
   left: calc(50% - 150px);
  }
  .middle-img-box-1 img:nth-of-type(3){
    max-width: 70px;
  }
  .middle-txt-box {
    font-size: .9em;
  }
  .middle-img-box-2 p {
    width: 60%;
    float: right;
    padding: 40px 0 40px 30px;
    text-align: left;
	}
  .middle-img-box-2 span {
    display: block;
    margin-bottom: -1em;
  }
}

@media (max-width: 480px) {
  /* ~480px */

  .contents-inner li {
    width: 96%;
    margin: 0 2% 40px;
 	}
  .contents-inner li:nth-of-type(3n) {
  	margin-right: unset;
	}

/* ===== 花匠美が選ばれる理由 ===== */
	.contents-middle {
	  margin: 0 auto 50px;
	  padding: 20px 0;
	}
	.middle-inner {
		width: 95%;
	}
  .middle-img-box-1 {
    height: 120px;
  }
  .middle-img-box-1 img:nth-of-type(1){
    max-width: 60px;
    transform: -webkit-translateY(-20px);
     transform: translateY(-20px);
  }

  .middle-img-box-1 img:nth-of-type(3){
    max-width: 60px;
    transform: -webkit-translateY(-20px);
     transform: translateY(-20px);
  }
  .middle-img-box-2 p {
    font-size: .8em;
    padding-left: 20px;
  }
  .middle-img-box-2 img {
    width: 120px;
    padding-top: 10px;
  }
}

@media (max-width: 420px) {
  /* ~420px */
/* ===== 花匠美が選ばれる理由 ===== */

  .middle-img-box-1 img:nth-of-type(1){
    max-width: 45px;
  }

 .middle-img-box-1 img:nth-of-type(2) {
    max-width: 250px;
    left: -webkit-calc(50% - 125px);
    left: calc(50% - 125px);
  }

  .middle-img-box-1 img:nth-of-type(3){
    max-width: 45px;
  }
  .middle-txt-box {
    font-size: .85em;
    padding: 10px;
  }
}
@media (max-width: 360px) {
  /* ~360px */

/* ===== 花匠美が選ばれる理由 ===== */
  .middle-img-box-1 img:nth-of-type(1){
    max-width: 40px;
  }
   .middle-img-box-1 img:nth-of-type(2) {
    max-width: 220px;
    left: -webkit-calc(50% - 110px);
    left: calc(50% - 110px);
  }

  .middle-img-box-1 img:nth-of-type(3){
    max-width: 40px;
  }
  .middle-img-box-2 p {
    font-size: .7em;
    padding-left: 5px;
  }
  .middle-img-box-2 img {
    width: 100px;
    padding-top: 20px;
  }


}