@charset "utf-8";
/* --------------------------------------------------
 *  PC
 * -------------------------------------------------- */
@media screen and (min-width: 641px) {

	.blueBox{
		width:100%;
		margin:0 auto 5%;
		padding:0 2% 3%;
		background:#fff;
		border:solid 2px #29a7e1;
	}

	.blueBox .gazou{
		float:left;
		width:23%;
	}

	.blueBox .gazou li{
		text-align:center;
		width:100%;
		margin:0 auto;
		padding-bottom:3%;
	}

	.blueBox .gazou li img{
		display:block;
		width:200px;
	}

	.blueBox .detailsBox{
		width:75%;
		float:right;
	}

	.blueBox p.title{
		color:#418ac9;
		font-weight:bold;
		font-size:25px;
		padding:15px 0 20px;
		text-align:center;
	}

	.blueBox .detailsBox .price{
		font-size:18px;
		line-height:1.4;
	}

	.blueBox .detailsBox .price dt{
		float:left;
	}
	.blueBox .detailsBox .price dt span{
		display:inline-block;
		padding-left:10px;
	}

	.blueBox .detailsBox .price dd{
		float:right;
	}
	.blueBox .detailsBox .price dd span{
		display:inline-block;
		padding-left:10px;
		color:#e4007f;
		font-weight:bold;
		font-size:20px;
	}

	.blueBox .blueBG{
		width:100%;
		margin:3% auto 3%;
		padding:3% 0 1%;
		background:#dcecf5;
	}

	.blueBox .blueBG li{
		float:left;
		line-height:1.4;
		margin-left:10px;
		margin-bottom:10px;
		padding:5px;
		text-align:center;
		background:#fff;
	}

	.blueBox .place{
		line-height:1.4;
	}

	.blueBox .place dt{
		float:left;
		padding-right:10px;
	}

	.blueBox .place dd{}

	.blueBox .place dd span:before{
		content:"／";
	}
}

/* --------------------------------------------------
 *  スマートフォン
 * -------------------------------------------------- */
@media screen and (max-width: 640px) {

	.blueBox{
		width:100%;
		margin:0 auto 5%;
		padding:0 4% 3%;
		background:#fff;
		border:solid 2px #29a7e1;
	}

	.blueBox .gazou{
		float:none;
		width:100%;
		margin:0 auto;
	}

	.blueBox .gazou li{
		text-align:center;
		width:100%;
		margin:0 auto;
		padding-bottom:3%;
	}

	.blueBox .gazou li img{
		display:block;
		width:97%;
		margin:0 auto;
	}

	.blueBox .detailsBox{
		width:100%;
		float:none;
		margin:0 auto;
	}

	.blueBox p.title{
		color:#418ac9;
		font-weight:bold;
		font-size:20px;
		padding:10px 0 20px;
		line-height:1.4;
}

	.blueBox .detailsBox .price{
		font-weight:bold;
		text-align:left;
		line-height:1.4;
}

	.blueBox .detailsBox .price dt{}
	.blueBox .detailsBox .price dt span{
		display:inline-block;
		padding-left:0px;
	}

	.blueBox .detailsBox .price dd{}
	.blueBox .detailsBox .price dd span{
		display:inline-block;
		color:#e4007f;
		font-weight:bold;
		font-size:20px;
	}

	.blueBox .blueBG{
		width:100%;
		margin:3% auto 3%;
		padding:3% 0 1%;
		background:#dcecf5;
	}

	.blueBox .blueBG li{
		line-height:1.4;
		margin:10px;
		padding:5px;
		font-weight:bold;
		background:#fff;
	}

	.blueBox .place{
		line-height:1.5;
		text-align:left;
	}

	.blueBox .place dt{}

	.blueBox .place dd{}

	.blueBox .place dd span:before{
		content:"／";
	}

}