@charset "utf-8";


/* TOP目玉車用 CSS */

#medama{}
	
.medama_list{ 
	display:flex;
	margin-top: 2em;
	}

.medama_list .item{
	border:1px solid #DDD;
	margin:0 5px;
}

.medama_list .item h3{
	font-size:13px;
	border-bottom:1px solid #CCC;
	padding:0 1em;
	height: 3em;
	background:#e8e8e8;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
}


/*.icon{ text-align:right;}	
.icon span{
	text-align:center;
	color:#FFF;
	font-size:11px;
	font-weight:bold;
	text-indent:0;
	padding:0;
	line-height:16px;
}
.icon span.icon_osusume{
	background:#090;}
.icon span.icon_shubetsu{
	background:#F00;
	}
.icon span.icon_shubetsu_shinsya{
	background:#00F;
	}*/

.medama_list .item .pic{}
.medama_list .item .pic p{
	height:auto;
	max-height: 255px;
	overflow:hidden;
}
	
	
/*　目玉車を強調　*/
.medama_list .item.sub_medama{
	background:#FFF7C6;
	box-sizing: border-box;
	border: 2px #FFD423 solid;
}
.medama_list .item.sub_medama h3{
	background: #FFD423;
	font-weight: bold;
}
	
	

/* 料金共通 */
.medama_list .price_area{
  list-style:none;
  display:flex;
  align-content:flex-end;
  justify-content:center;
  margin:2% 3%;
}
.medama_list .price_area li{ margin:auto 0 0 0; }
.medama_list .price_area li.pNum{
	margin-right:6%; }
.medama_list .price_area li.pNum .pNum_label{
  color:#000;
  margin:0;
  font-size:13px;
}
.medama_list .price_area li.pNum .number{
  line-height:1.3em;
  font-size:32px;
  font-family:Impact, YuGothic, 'Yu Gothic Medium', 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
	color: #cc0000;
	font-weight: bold;
}
.medama_list .price_area li.pNum .number span{ font-size:70% ; 	font-weight: bold; }
.medama_list .price_area li.pNum .number_sold{
	font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', 'Segoe UI', YuGothic, 'Yu Gothic Medium', 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
	font-size: 28px;
	padding: 0.3em 0;
	font-weight: bold;
	
	
}
.medama_list .price_area li.pNumSub{
	padding-bottom:.5em;
}
.medama_list .price_area li.pNumSub p{
  font-size:12px;
  text-align:right;
  line-height:1.4em;
	font-weight: bold;
}




.medama_list .item table.tbl_item{
	margin: 0 2%;
	width: 96%;
}	
.medama_list .item table.tbl_item th{
	background-color:#EEE;
	color:#333;
	text-align:center;
	border:1px solid #DDD;
	padding:5px;
}
.medama_list .item table.tbl_item td{
	background-color:#FFF;
	vertical-align:top;
	border:1px solid #DDD;	
	padding:5px;	
	}


/*	ボタン部分　*/

.medama_list .btn_detail{
	display:flex;
	flex-wrap: wrap;
	margin-top:5px;
	margin-bottom:5px;
	text-align:center;
	}

.medama_list .btn_detail p{
	margin:auto;
	padding:6px 5px;
	display:inline-block;
	width:100%;
	margin-bottom:6px;
}

.medama_list .btn_detail a{
	color:#FFF;
}

.medama_list .btn_detail .btn_left {
	background:#dc503d;
}

.medama_list .btn_detail .btn_right {
	background:#61b187;
}

.medama_list .btn_detail .btn_tel {
	background:#eac563;
	width:93%;
	margin-top:5px;
}


	
@media only screen and (max-width:768px){


	.medama_list .item{
			width: 100%;
			max-width: none;
		}

	.medama_list .item .pic p{
		height:auto;
			max-height: inherit;
	}


	.medama_list .item .pic p img{
		padding:0px;
		width: 100%;

	}
	.medama_list .item .pic .btn{
		text-align:center;
		border:0;	
		}


	.medama_list .item .detail{
		margin-top:10px ;
		width:96%;
		}

	.medama_list .item .detail .bnr p{
		margin-bottom:5px ;
	}


	
	/* 料金部分　*/
 .medama_list .price_area{
	/*			list-style-type: none;
		display: flex;
		justify-content:space-between;
		align-content: flex-end;
		margin: 1% 5%;*/

		margin:1%;
		justify-content:center;
		flex-wrap:wrap;
  }
  .medama_list .price_area li.pNum{
    display:flex;
    align-content:center;
  }
  .medama_list .price_area li.pNum .pNum_label{
    font-size:10px;
    margin:auto 5px auto 0 !important;
  }
  .medama_list .price_area li.pNum .number{ font-size:22px; }
  .medama_list .price_area li.pNum .number span{ font-size:70% !important; }

  .medama_list .price_area li.pNumSub{
    display:flex;
    justify-content:space-between;
  }
  .medama_list .price_area li.pNumSub p{
    text-align:center;
    font-size:8px;
  }
  .medama_list .price_area li.pNumSub p:first-child{ margin-right:7px !important; }
	
}