@charset 'UTF-8';

/** |READ ME| **************************************************************************************

ilm/shop/index_sp.css
Ver.201805

----------------------------------------------------------------------------------------------------

01. 概要
02. スタッフのおすすめ
03. オリジナルグッズ
04. 営業のご案内

************************************************************************************** |READ ME| **/





/** |01. 概要| >> ********************************************************************* >> START **/


/* ロゴ */
.contents .body .outline .trademark {
	margin: 0 auto;
	width: 39.86%;/* 228px */
}


/* 写真 */
.contents .body .outline .photo {
	padding: 5.59% 0 68.18%;/* 32px 0 390px */
	position: relative;
}

	.contents .body .outline .photo img {
		bottom: 0;
		left: 0;
		position: absolute;
	}

	.contents .body .outline .photo .caption {line-height: 1.67;}


/** |01. 概要| << *********************************************************************** << END **/





/** |02. スタッフのおすすめ| >> ******************************************************* >> START **/


.contents .body .recommend .item {
	padding-top: 36px;
	float: left;
	width: 48.6%;/* 278px */
}

.contents .body .recommend .item:nth-of-type(even) {clear: both;}
.contents .body .recommend .item:nth-of-type(odd) {float: right;}

	.contents .body .recommend .item a {
		color: inherit;
		display: block;
		text-decoration: none;
		width: 100%;/* 278px */
	}

		.contents .body .recommend .item dl {}

			.contents .body .recommend .item dt {
				overflow: hidden;
				padding-bottom: 76.98%;/* 214px */
				position: relative;
				width: 100%;/* 278px */
			}

				.contents .body .recommend .item img {
					height: 100%;
					left: 50%;
					margin: auto;
					position: absolute;
					top: 0;
					-ms-transform: translate(-50%, 0);
					-webkit-transform: translate(-50%, 0);
					transform: translate(-50%, 0);
					width: auto;
				}

			.contents .body .recommend .item dd {
				font-family: 'Trade Gothic W01 Bold', sans-serif;
				font-size: 1.8rem;
				line-height: 1.22;
				padding-top: 3.6%;/* 10px */
			}


/* 情報なし */
.contents .body .recommend .nodata {padding-top: 6.99%;/* 40px */}


/** |02. スタッフのおすすめ| << ********************************************************* << END **/





/** |03. オリジナルグッズ| >> ********************************************************* >> START **/


	/** [商品情報] >> +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ >> START **/
 
	.contents .body .goods .item {padding-top: 9.44%;/* 54px */}

	.contents .body .goods .towel {padding-top: 6.99%;/* 40px */}


		/* 商品画像 */
		.contents .body .goods .item .photo {
			margin: 0 auto;
			width: 80.1%;/* 458px */
		}

		.contents .body .goods .towel .photo {width: 41.26%;/* 236px */}


		/* 商品情報 */
		.contents .body .goods .item .detail {}

			.contents .body .goods .item .detail .name {padding-top: 10.49%;/* 60px */}

				.contents .body .goods .item .detail .name dt {
					font-family: 'Trade Gothic W01 Bold', sans-serif;
					font-size: 2.6rem;
					line-height: 1.67;
				}

				.contents .body .goods .item .detail .name dd {
					line-height: 1.67;
					padding-top: 5.24%;/* 30px */
				}

			.contents .body .goods .item .detail .price {
				margin-top: 6.99%;/* 40px */
				width: 100%;/* 572px */
			}

				.contents .body .goods .item .detail .price th,
				.contents .body .goods .item .detail .price td {
					font-size: 2rem;
					letter-spacing: -0.02em;
					line-height: 1.88;
 				}

				.contents .body .goods .item .detail .price th {
					font-family: 'Trade Gothic W01 Light', sans-serif;
					font-weight: normal;
					text-align: left;
					width: 100%;
					padding-right: 2em;
				}

				.contents .body .goods .item .detail .price td {white-space: nowrap;}

			.contents .body .goods .item .detail .note {
				font-size: 2rem;
				line-height: 1.67;
				margin-top: 6.99%;/* 40px */
			}


	/** [ラッピング] >> +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ >> START **/

	.contents .body .goods .wrapping {padding-top: 10.49%;/* 60px */}

		.contents .body .goods .wrapping .caption {
			font-size: 2rem;
			line-height: 1.88;
			padding-top: 6.99%;/* 40px */
		}


/** |03. オリジナルグッズ| << *********************************************************** << END **/





/** |04. 営業のご案内| >> ************************************************************* >> START **/


.contents .body .guidance {/* 504px */
	background-color: #f4f4f5;
	margin-top: 10.49%;/* 60px */
	padding: 5.94%;/* 34px */
}

	.contents .body .guidance .title {
		background-color: transparent;
		font-size: 2.2rem;
		padding: 0;
	}

	.contents .body .guidance p {
		font-size: 2rem;
		padding-top: 3.17%;/* 16px */
	}

	.contents .body .guidance .hour {margin-top:  3.17%;/* 16px */}

		.contents .body .guidance .hour th,
		.contents .body .guidance .hour td {
			font-size: 1.8rem;
			line-height: 1.67;
			vertical-align: top
		}

		.contents .body .guidance .hour th {
			font-family: 'Trade Gothic W01 Light', sans-serif;
			font-weight: normal;
			padding-right: 1.6em;
			text-align: left;
			white-space: nowrap;
		}

	.contents .body .guidance .contact {
		font-size: 0;
		padding-top: 7.14%;/* 36px */
	}

		.contents .body .guidance .contact dt,
		.contents .body .guidance .contact dd {
			display: inline;
			font-size: 2rem;
			line-height: 1.67;
		}

		.contents .body .guidance .contact dd {padding-left: 1em;}


/** |04. 営業のご案内| << *************************************************************** << END **/