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

img {
	height: auto;
	max-width: 100%;
}

/* key */
#key {
	background: url(../img/sp_key.jpg) no-repeat center bottom #f9f9f8;
	background-size: 100%;
	border: 1px solid #cecece;
	border-radius: 5px;
	padding-bottom: 60%;
}
	#key img.bg {
		display: none;
	}
	#key img.ico {
		bottom: 10px;	left: 10px;
		max-width: 10%;
	}
	#key p {
		position: static;
		width: 70%;
	}
		#key .title {
			margin: 5% auto;
		}
		#key .subtitle {
			font-size: 120%;
			margin: 3% auto;
		}
	#key dl {
		margin: 3% auto 0;
		width: 70%;
	}
		#key dd {
			display: block;
			margin: 0;
		}

/* concept */
.concept {
	background: url(../img/sp_concept.jpg) no-repeat 0 top #ebeeea;
	background-size: 100%;
	padding: 53% 3% 3%;
}
	.concept img.bg {
		display: none;
	}
	.concept h2 {
		margin: 0;
	}
	.concept p {
		margin: 0;
	}
	.concept span {
		margin: 0 auto;
		position: static;
	}

/* feature */
.feature {
	background: url(../img/sp_feature_pic_main.jpg) no-repeat 0 bottom;
	background-size: contain;
	padding-bottom: 75%;
}
	.feature h2 {
		font-size: 140%;
	}
	.feature h3 {
		font-size: 120%;
	}
	.feature ul {
		width: inherit;
	}
		.feature li {
			float: none !important;
			height: auto !important;
			margin: 0 0 3% !important;	
			width: inherit !important;
		}
			.feature .col1 {
				position: relative;
				padding-bottom: 28%;
			}
				.feature li.col1 img {
					float: none;
					margin: 0;
					max-width: 100%;
					position: absolute;
					bottom: 0;
				}
				.feature li.num02 img {
					width: 40%;
				}
				.feature li.num05 img {
					width: 40%;
				}
	.feature .visual {
		display: none;
	}

/* check */
.check {
	padding: 5%;
}
	.check h2 {
		font-size: 140%;
	}
		.check h2 img {
			width: 7%;
		}
	.checklist {
		font-size: 120%;
		padding: 3%;
	}
		.checklist li {
			float: none;
			width: inherit;
		}
	.check h3 {
		font-size: 130%;
	}
	.check th, .check td {
		padding: 2%;
		white-space: normal;
	}
		.check th.row1, .check th.row2, .check th.row3, .check th.row4 {
			width: inherit;
		}

/* variation */
.variation {
	float: none;
	width: inherit;
}
	.variation h2 {
		font-size: 140%;
	}
	.variation ul {
/*		display: table;	*/
	}
		.variation li {
	/*		display: table-cell;
			padding: 0 2%;	*/
			float: left;
			margin-left: 3%;
			width: 31%;
		}
			.variation li:first-child {
				margin-left: 0;
			}
			.variation strong {
				font-size: 120%;
			}
	.variation p {
		font-size: 110%;
		margin-top: 10px;
	}

/* spec */
.spec {
	float: none;
		width: inherit;
}
	.spec h2 {
		font-size: 140%;
	}
	.spec th, .spec td {
		padding: 2%;
	}
		.spec th {
			width: 28%;
		}

/* inquiry */
.inquiry h2 {
	font-size: 140%;
}
.inquiry address {
	float: none;
	margin-right: 0;
	width: inherit;
}
	.inquiry address span {
		display: block;
		margin-left: 0;
		width: 6em;
	}
.inquiry dl {
	float: none;
	margin-top: 10px;
	width: inherit;
}
/***************************************
ショップリンク
****************************************/
.shop-link{
	text-align: center;
	padding: 0;
	clear: both;
	margin: 6% 0 4% 0;
}
.shop-link .btn-mat{
	display: inline-block;
	clear: both;
	color: #FFF;
	width:99%;
	margin:0 0.5% 2.5%;
}
.shop-link .btn-mat a{
	padding: 1.5em 2.5em 1.25em;
	margin:0 0.25%;
	display: block;
	color: #FFF;
	/* border-radius */
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	/* box-shadow */
	box-shadow: #c9c9c9 0px 0px 1px 1px;
	-webkit-box-shadow: #c9c9c9 0px 0px 1px 1px;
	-moz-box-shadow: #c9c9c9 0px 0px 1px 1px;
	position: relative;
	z-index: 0;
	background-color: #175ca5;
}
.inquiry address strong br{
	display:block;
}
}