@charset 'utf-8';

/* ------------------------------
 詳細ページ
------------------------------ */

/* 既存修正 */
@media screen and (min-width: 0) and (max-width: 899px) {
	article {
		padding-top: 0;
	}
}

/* シェア等ボタン */
.share_detail li {
	float: left;
	overflow: hidden;
}

.share_detail li a {
	display: block;
	height: 0;
	overflow: hidden;
	background-repeat: no-repeat;
	background-position: center center;
}

.btn_share_twitter a {
	background-color: #55acee;
	background-image: url(../img/common/twitter.svg);
}

.btn_share_facebook a {
	background-color: #0e3280;
	background-image: url(../img/common/facebook.svg);
}

.btn_share_pinterest a {
	background-color: #bd081c;
	background-image: url(../img/common/pinterest.svg);
}

.btn_share_mail a {
	background-color: #f3cd1b;
	background-image: url(../img/common/mail.svg);
}

.btn_share_line a {
	background-color: #2cbf13;
	background-image: url(../img/common/line.svg);
}

.btn_share_like a {
	background-color: #1f1f1f;
	background-image: url(../img/common/like.svg);
}

.btn_share_like a.on {
	background-image: url(../img/common/like-pink.svg);
	animation-name: heartbeat;
	animation-duration: 1s;
	animation-timing-function: ease;
	animation-iteration-count: 3;
}

/* プレイス情報など */

#place,
#event,
#movie_theater {
	background-color: #eee;
	border-top: 2px solid #1f1f1f;
}

#article .sub_event {
	background-color: #fff;
	border: 1px solid #c5c5c5;
	border-radius: 5px;
}

#event .sub_event {
	background-color: #fff;
	border: 1px solid #e6e6e6;
	border-radius: 5px;
}

@media screen and (min-width: 900px) {
	#article .sub_event {
		margin-right: 40px;
		margin-left: 40px;
	}
}

#place h2,
#event h2,
.sub_event h2,
#movie_theater h2 {
	margin-bottom: 0;
	border-top: none;
}

#place table,
#event table,
.sub_event table,
#movie_theater table {
	width: 100%;
	table-layout: fixed;
	border-collapse: collapse;
}

#place th,
#event th,
.sub_event th,
#movie_theater th {
	font-weight: bold;
	background-color: #fff;
}

#place th,
#place td,
#event th,
#event td,
.sub_event th,
.sub_event td,
#movie_theater th,
#movie_theater td {
	color: #333;
	vertical-align: middle;
	word-wrap: break-word;
	overflow-wrap: break-word;
	border-bottom: 1px dashed #c5c5c5;
}

#article .sub_event tr:last-child th,
#article .sub_event tr:last-child td,
#event .sub_event tr:last-child th,
#event .sub_event tr:last-child td {
	border-bottom: none;
}

#map {
	position: relative;
	height: 0;
	padding-bottom: 80%;
	overflow: hidden;
}

#map iframe,
#map object,
#map embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

#event .sub_event:last-child {
	margin-bottom: 0;
}

#event .sub_event:last-child .sub_event_inner {
	padding-bottom: 0;
}

@media screen and (min-width: 0) and (max-width: 899px) {
	.share_detail li {
		width: 33.33%;
	}
	.share_detail li a {
		margin: 1px;
		padding-top: 50%;
		background-size: auto 50%;
	}
	#place_inner,
	#event_inner,
	.event_inner {
		padding: 2.34375% 4.6875% 9.375%;
	}
	.sub_event {
		margin-bottom: 4.6875%;
	}
	.sub_event_inner {
		padding: 2.34375%;
	}
	#place th,
	#place td,
	#event th,
	#event td,
	.sub_event th,
	.sub_event td {
		padding: 2% 4%;
		font-size: 3.75vw;
		line-height: 1.4;
	}
	#place th,
	#event th {
		width: 30%;
	}
	.sub_event th {
		width: 20%;
	}
}

@media screen and (min-width: 900px) {
	.detail_box {
		position: relative;
		width: 700px;
		padding: 24px 50px 0;
		background-color: #fff;
	}
	.share_detail li {
		width: 138px;
	}
	.share_detail li:not(:last-child) {
		margin-right: 2px;
	}
	.share_detail li a {
		padding-top: 48px;
		background-size: auto 20px;
		-webkit-transition: background-color 400ms false;
		-moz-transition: background-color 400ms false false;
		-o-transition: background-color 400ms false false;
		transition: background-color 400ms;
	}
	.btn_share_twitter a:hover {
		background-color: #7ac2f3;
	}
	.btn_share_facebook a:hover {
		background-color: #2258a0;
	}
	.btn_share_pinterest a:hover {
		background-color: #d0153c;
	}
	.btn_share_mail a:hover {
		background-color: #f7db3a;
	}
	.btn_share_line a:hover {
		background-color: #51d12c;
	}
	.btn_share_like a:hover {
		background-color: #2f2f2f;
	}
	#place_inner,
	#event_inner {
		padding: 10px 30px 30px;
	}
	.sub_event {
		margin-bottom: 20px;
	}
	.sub_event_inner {
		padding: 10px;
	}
	.sub_event h3 {
		padding: 0 5px;
	}
	#place th,
	#place td,
	#event th,
	#event td,
	.sub_event th,
	.sub_event td {
		padding: 10px;
		font-size: 14px;
		line-height: 20px;
	}
	.sub_event th,
	.sub_event td {
		padding: 5px;
		line-height: 16px;
	}
	#place th,
	#event th {
		width: 20%;
	}
	.sub_event th {
		width: 15%;
	}
	#map {
		padding-bottom: 530px;
	}
}

/* 本文 */

#article {
	font-size: 16px;
}

#article a {
	text-decoration: underline;
	color: #1893b1;
}

#article .btn a {
	text-decoration: none;
}

#article a:hover {
	text-decoration: none;
}

@media screen and (min-width: 0) and (max-width: 899px) {
	#article p {
		margin-bottom: 6.25%;
	}
}

@media screen and (min-width: 900px) {
	#article p {
		margin-bottom: 20px;
	}
}

/* 広告 */

.ads li {
	width: 320px;
	margin-right: auto;
	margin-bottom: 6.896551724137932%;
	margin-left: auto;
	text-align: center;
}

.ads li:last-child {
	margin-bottom: 0;
}

@media screen and (min-width: 0) and (max-width: 899px) {
	/* ヘッダ固定バナー用 */
	body {
		/* padding-top: 42.1875%; */
	}
	#header_wrapper {
		/* top: 75px; */
	}
	#bnr_fixed {
		position: fixed;
		top: 0;
		left: 0;
		z-index: 1;
		display: none;
		width: 100%;
		height: 75px;
		background-color: #fff;
	}
	.ads li {
		width: 320px;
		margin: 0 auto 10px;
	}
	.ads li:nth-child(2) {
		margin-bottom: 0;
	}
}

@media screen and (min-width: 900px) {
	.ads li {
		float: left;
		width: 430px;
		margin-right: 40px;
		margin-bottom: 0;
	}
	.ads li:nth-child(2n) {
		margin-right: 0;
	}
	.ads li:nth-child(2n + 1) {
		clear: left;
	}
}

/* コピーライト表記 */

@media screen and (min-width: 0) and (max-width: 899px) {
	#article_copy {
		font-size: 10px;
		line-height: 13px;
	}
}

@media screen and (min-width: 900px) {
	#article_copy {
		font-size: 11px;
		line-height: 15px;
	}
}

/*
--------------------------------------------------------------------------------
 END OF CSS
--------------------------------------------------------------------------------
*/