@charset "UTF-8";
/*
店舗情報ページ
*/

/* メインエリア */
#page-main {
	background-image: url("/wp/wp-content/uploads/2019/11/bg_yellow.png");
}

#shop-area {
	padding: 20px 0 40px;
}

/* 店舗名エリア */
#shop-name-area {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 4px 15px 6px;
	background-color: #AD4246;
	color: #FFFFFF;
}

.term-food #shop-name-area {
	background-color: #D27728;
}

.term-shopping #shop-name-area {
	background-color: #778239;
}

.term-fashion #shop-name-area {
	background-color: #CD7668;
}

.term-medical #shop-name-area {
	background-color: #3B949E;
}

.term-other #shop-name-area {
	background-color: #7A6F8C;
}

/* 店舗名 */
#shop-name {
	margin: 0;
	font-size: 27px;
	font-weight: normal;
}

/* 店舗カテゴリー */
#shop-category {
	font-size: 22px;
}

/* 店舗画像エリア */
#shop-image-area {
	opacity: 0;
}

/* 店舗画像スライダー */
#slider-area {
	position: relative;
	width: 100%;
	height: 54vw;
	max-height: 636px;
	margin: 10px auto;
}

#slider-image-back {
	display: none;
	position: relative;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

#slider-image-front {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

.slider-arrow {
	position: absolute;
	top: 48%;
	color: #FFFFFF;
	font-size: 40px;
	opacity: 1;
}

.slider-arrow:hover {
	opacity: 1;
	text-shadow: 0 1px 5px #AAAAAA;
	cursor: pointer;
}

.slider-left {
	display: none;
	left: 15px;
}

.slider-right {
	right: 15px;
}

/* 店舗画像一覧 */
#shop-image-list {
	display: flex;
	flex-wrap: wrap;
}

.image-list-item {
	width: 182px;
	height: 102px;
	margin: 0 3px 5px;
	object-fit: cover;
	box-sizing: border-box;
}

.image-list-item:hover {
	cursor: pointer;
	opacity: 0.8;
}

.image-list-item-focus {
	border: solid 6px #AD4246;
}

/* 店舗情報エリア */
#shop-info-area {
	color: #58504D;
	font-size: 19px;
}

/* 店舗紹介 */
#shop-message {
	margin-top: 20px;
}

#shop-message p {
	line-height: 1.9em;
}

/* 店舗情報テーブル */
#shop-info-area table {
	width: 100%;
	margin: 30px 0 40px;
	letter-spacing: 0.05em;
}

#shop-info-area tr:first-of-type th,
#shop-info-area tr:first-of-type td {
	border-top: solid 1px #CCC9C8;
}

#shop-info-area th {
	width: 7em;
	padding: 12px 2px;
	border-bottom: solid 1px #CCC9C8;
	text-align: left;
}

#shop-info-area td {
	border-bottom: solid 1px #CCC9C8;
}

#shop-info-area td.colon {
	width: 2em;
	text-align: center;
}

#shop-info-area .shop-sns {
	padding: 0 5px;
	font-size: 36px;
}

#shop-info-area .shop-sns a {
	margin-right: 5px;
}

#shop-info-area .shop-sns a:hover {
	opacity: 0.8;
}

#shop-info-area .shop-sns .fa-twitter-square {
	color: #02A4F0;
}

#shop-info-area .shop-sns .fa-facebook-square {
	color: #375B96;
}

#shop-info-area .shop-sns .fa-instagram {
	color: #CE006A;
}

#shop-info-area .shop-sns .fa-line {
	color: #28B926;
}

/* 店舗地図 */
#shop-map {
	width: 100%;
	height: 600px;
}

/* スマホ版 */
@media (max-width:767px) {
	#shop-name-area {
		flex-direction: column-reverse;
		align-items: flex-start;
		padding: 4px 10px 3px;
	}

	#shop-category {
		font-size: 14px;
	}

	#shop-name {
		font-size: 22px;
		font-weight: bold;
	}

	#slider-area {
		margin: 10px auto 5px;
	}

	.slider-arrow {
		font-size: 30px;
	}

	.image-list-item {
		width: calc(calc(100% - 15px) / 3);
		height: 19vw;
		margin: 0 5px 5px 0;
	}

	#shop-info-area {
		font-size: 16px;
	}

	#shop-info-area table {
		font-size: 15px;
	}

	#shop-info-area td.colon {
		display: none;
	}
}