@charset "UTF-8";

/* Object - p-font */
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Lato:wght@100;300;400;700;900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@300;400;700&display=swap");
@font-face {
	font-family: "myfont";
	src: url("../fonts/myfont.eot?jm6d8c");
	src: url("../fonts/myfont.eot?jm6d8c#iefix") format("embedded-opentype"), url("../fonts/myfont.ttf?jm6d8c") format("truetype"), url("../fonts/myfont.woff?jm6d8c") format("woff"), url("../fonts/myfont.svg?jm6d8c#myfont") format("svg");
	font-weight: normal;
	font-style: normal;
	}
	/* .icon-train:before { content: "\e900"; } */
	/* .icon-car:before { content: "\e901"; } */

/* Foundation - Reset */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, p, blockquote, th, td {
	margin: 0;
	padding: 0;
	}

input, textarea {
	margin: 0;
	font-size: 100%;
	}

table {
	border-collapse: collapse;
	border-spacing: 0;
	font-size: 100%;
	}

fieldset, img, iframe {
	border: 0;
	}

address, caption, cite, code, dfn, em, th, var {
	font-style: normal;
	font-weight: normal;
	}

ol, ul {
	list-style: none;
	}

caption, th {
	text-align: left;
	}

h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
	font-weight: normal;
	}

q:before, q:after {
	content: "";
	}

abbr, acronym {
	border: 0;
	}

img {
	vertical-align: bottom;
	pointer-events: none;
	}

* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
	}

/* Foundation - Variable */
:root {
	--mediaScreenS	: 480px;
	--mediaScreenM	: 768px;
	--mediaScreenL	: 980px;

	--maxWidth		: 1060px;
	--garter		: 50px;
	--garter--in	: 25px;
	--garter--ob	: 15px;

	--baseFont		:	"Noto Sans JP", "游ゴシック体", "YuGothic", "游ゴシック", "Yu Gothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
	--baseFontColor	:	#444;

	--baseColor		: #f2f2f2;
	--mainColor		: #00aecb;
	--accentColor	: #ffd500;

	--redColor		: #bd0200;
	--hokkaidoColor	: #8dc21f;
	}


/* Foundation - Basic */
html {
	overflow-y: scroll;
	font-size: 62.5%;
	-webkit-text-size-adjust: 100%;
	}

body {
	font-family: "Noto Sans JP", "游ゴシック体", "YuGothic", "游ゴシック", "Yu Gothic", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
	font-size: 13px;
	line-height: 1;
	text-align: justify;
	color: black;
	background-color: #ddd;
	}

a {
	color: black;
	}
a:link {
	text-decoration: none;
	}
a:visited {
	text-decoration: none;
	}
a:hover {
	text-decoration: none;
	}
a:active {
	text-decoration: none;
	}


/* Layout - Contents */
.wrapper {
	display: flex;
	align-items: center;
	min-height: 100vh;
	position: relative;
	}
	@media screen and (min-width: 481px) {
		.wrapper {
			background: #f7f4ef;
		}
	}
	.wrapper .l-contents {
		display: block;
		width: 480px;
		margin: 0 auto;
		background-color: white;
		position: relative;
		z-index: 1;
		overflow: clip;
		}
		@media screen and (min-width: 481px) {
			.wrapper .l-contents {
				box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
			}
		}

	.wrapper .l-slide { display: none;}
	@media screen and (min-width: 481px) {

		.wrapper .l-slide {
			display: block;
			position: fixed;
			left: 0;
			top: 0;
			height: 100vh;
			width: calc((100vw - 480px) / 2);
			}
			.wrapper .l-slide::before {
				content: "";
				position: absolute;
				background: url(../images/bg_noize05.png) repeat center center;
				background-size: 100px;
				background-attachment: fixed;
				inset: 0;
				z-index: 1;
			}
			.wrapper .l-slide .l-slide--copy {
				display: block;
				width: 60px;
				position: absolute;
				z-index: 2;
				top: 40px;
				left: 30px;
				}
				.wrapper .l-slide .l-slide--copy img {
					filter: drop-shadow( 0px 0px 8px black);
				}
	}

	.wrapper .l-sidebar { display: none;}
	@media screen and (min-width: 481px) {

		.wrapper .l-sidebar {
			display: block;
			position: fixed;
			/* background: linear-gradient(0deg, #0d57a7, #007dc3); */
			right: 0;
			top: 0;
			height: 100vh;
			width: calc((100vw - 480px) / 2);
			}
			.wrapper .l-sidebar::before {
				content: "";
				position: absolute;
				background: url(../images/bg_noize05.png) repeat center center;
				background-size: 100px;
				background-attachment: fixed;
				inset: 0;
				z-index: 1;
			}
			.wrapper .l-sidebar .l-sidebar--inner {
				display: block;
				position: absolute;
				inset: 0;
				}
				.wrapper .l-sidebar .l-sidebar--inner::before {
					content: url(../images/img_design02.svg);
					display: block;
					width: 100%;
					height: auto;
					position: absolute;
					opacity: 0.9;
					top: -3%;
					right: -20%;
				}
				.wrapper .l-sidebar .l-sidebar--inner::after {
					content: url(../images/img_design02.svg);
					display: block;
					width: 100%;
					height: auto;
					position: absolute;
					opacity: 0.9;
					bottom: -3%;
					left: -20%;
				}
				.wrapper .l-sidebar .l-sidebar--inner > img {
					display: block;
					width: 85%;
					height: auto;
					position: absolute;
					top: 50%;
					left: 50%;
					transform: translate( -50%, -50%);
					z-index: 1;
					mix-blend-mode: multiply;
				}
	}



/* Layout - Header */
.l-header {
	display: block;
	background-color: #548d00;
	padding: 15px;
	text-align: center;
	}


	/* Layout - Footer */
.l-footer {
	display: block;
	background-color: #f7f4ef;
	text-align: center;
	position: relative;
	z-index: 5;
	}
	.l-footer__top {
		padding: 25px;
		}
		.l-footer__top > a {
			display: block;
			width: 60%;
			margin: 0 auto;
			transition: opacity 0.3s ease;
			}
			@media screen and (min-width: 481px) {
				.l-footer__top > a:hover {
					opacity: 0.5;
				}
			}
			.l-footer__top > a > img {
				width: 100%;
				height: auto;
			}
			.l-footer__top > small {
				display: block;
				padding-top: 15px;
				font-size: 9px;
				color: #999;
				line-height: 1.4;
			}




/* Object - p-slide */
.p-slide {
	display: block;
	position: absolute;
	inset: 0;
	}
	.p-slide > img {
		display: block;
		width: 100%;
		height: 100%;
		opacity: 0;
		position: absolute;
		object-fit: cover;
		animation: slideImage 40s linear infinite 0s;
	}
	.p-slide > img:nth-child(2) {
		animation-delay: 10s;
	}
	.p-slide > img:nth-child(3) {
		animation-delay: 20s;
	}
	.p-slide > img:nth-child(4) {
		animation-delay: 30s;
	}
	@keyframes slideImage {
		0% {
			opacity: 0;
			animation-timing-function: ease-in;
		}
		8% {
			opacity: 1;
			animation-timing-function: ease-out;
		}
		20% {
			opacity: 1;
			transform: scale(1.04);
		}
		40%,
		100% {
			opacity: 0;
			transform: scale(1.08);
		}
	}

/* Object - p-price */
.p-price {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
    width: 100%;
	}
	.p-price .p-price__item {
		width: 48.5%;
		padding: var(--garter--ob);
		background: rgba(0, 0, 0, 0.03);
		border: solid 1px white;
		border-radius: 10px;
		text-align: center;
	}
	.p-price--head {
		font-weight: bold;
		line-height: 1.4;
		padding-bottom: 10px;
		}
		.p-price--head > small {
			display: block;
			font-size: 8px;
			font-weight: normal;
		}

	.p-price--list {
		text-align: left;
		font-size: 9.5px;
		margin-bottom: 10px;
		}
		.p-price--list > li {
			padding-bottom: 5px;
			padding-left: 1.3em;
			position: relative;
			border-bottom: solid 1px rgba(0, 0, 0, 0.05);
		}
		.p-price--list > li::before {
			content: url(../images/ico_check01.svg);
			display: block;
			width: 1em;
			position: absolute;
			top: 0;
			left: 0;
		}
		.p-price--list > li[hidden] {
			display: block;
			}
			.p-price--list > li[hidden]::before {
				content: url(../images/ico_check02.svg);
				opacity: 0.3;
			}
		.p-price--list > li + li {
			margin-top: 5px;
		}
	.p-price--table {
		display: block;
		background: rgba(0, 0, 0, 0.05);
		border-radius: 5px;
		padding: 8px;
		font-size: 11px;
		line-height: 1em;
		}
		.p-price--table tbody { display: block;}
		.p-price--table tr {
			display: flex;
			justify-content: space-between;
			align-items: center;
			}
			.p-price--table tr + tr {
				margin-top: 5px;
			}
			.p-price--table tr th {
				display: block;
				}
				.p-price--table tr th > small {
					display: block;
					font-size: 7px;
				}
			.p-price--table tr td {
				display: block;
				text-align: right;
				font-size: 16px;
				font-weight: bold;
				}
				.p-price--table tr td > small {
					display: block;
					font-size: 6px;
					opacity: 0.6;
					font-weight: normal;
				}
				.p-price--table tr td > span {
					font-size: 10px;
				}
	.p-price--buttonList {
		margin-top: 10px;
		text-align: center;
		}
		.p-price--buttonList > a {
			display: inline-block;
			color: black;
			padding: 10px 20px;
			background: var(--accentColor);
			border-radius: 5px;
			outline: none;
		}

	
/* Object - p-modal */
.p-modal {
    width: 480px;
	height: 100%;
    margin: 0 auto;
	padding: 0;
	border: none;
	background: rgba(0, 0, 0, 0.6);
	padding: var(--garter--in);
	position: fixed;
	}
.p-modal .p-modal__in {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	overflow: hidden;
	}
.p-modal--box {
	width: 100%;
	height: auto;
	max-height: 100%;
	padding: var(--garter--in) var(--garter--in) calc(var(--garter--in) * 2 + 40px);
	background: #f7f4ef;
	border-radius: 20px;
	box-shadow: 0 0 6px rgb(0 0 0  / 0.8);
	position: relative;
	overflow: clip;
	}
	.p-modal--box .p-modal--box__in {
		position: relative;
		max-height: 420px;
		overflow-y: scroll;
		overflow-x: hidden;
		-ms-overflow-style: none;
		scrollbar-width: none;
		}
		.p-modal--box .p-modal--box__in::-webkit-scrollbar {
			display: none;
			}

.p-modal--button {
	display: block;
	width: 300px;
	background: transparent;
	padding: 8px;
	border: solid 1px black;
	color: black;
	border-radius: 100px;
	cursor: pointer;
	outline: none;
	appearance: none;
	position: absolute;
	left: 50%;
	bottom: var(--garter--in);
	transform: translate( -50%, 0);
	}

/* Object - p-menu */
.p-menu--navi {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-evenly;
	width: 100%;
	position: sticky;
	left: 0;
	top: 0;
	z-index: 1;
	}
	.p-menu--navi > input {
		display: none;
	}
	.p-menu--navi > label {
		display: flex;
		align-items: center;
		justify-content: center;
		flex-grow: 1;
		height: 25px;
		background: #eee8de;
		padding: 5px 10px;
		cursor: pointer;
	}
	.p-menu--navi > input:checked + label {
		background: var(--mainColor);
		color: white;
	}

.p-menu {
	display: block;
	padding-top: var(--garter--ob);
	}

.p-menu--category {
	display: none;
	}
	.p-menu--category:nth-of-type(1) {
		display: block;
	}

.p-menu--list {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: -5px;
	}
	.p-menu--list__item {
		width: 50%;
		padding: 5px;
		display: flex;
		flex-direction: column;
	}
.p-menu--box {
	width: 100%;
	background: white;
	border-radius: 5px;
	box-shadow: 0 2px 0 rgba(0, 0, 0, 0.1);
	display: flex;
	flex-direction: column;
	flex-grow: 1;
	overflow: hidden;
}
.p-menu--imagebox {
	width: 100%;
	background: rgba(0, 0, 0, 0.02);
	}
	.p-menu--imagebox > img {
		width: 100%;
		height: 100%;
		aspect-ratio: 3 / 2;
		object-fit: cover;
		object-position: center;
	}
.p-menu--detail {
	padding: 10px;
	line-height: 1.2;
	font-size: 11px;
	display: flex;
	flex-direction: column;
	flex-grow: 1;
}
.p-menu--title {
	display: block;
	font-size: 8.5px;
	font-weight: bold;
	padding-bottom: 3px;
	position: relative;
	left: -0.4em;
	}
	.p-menu--title::before {
		content: "【";
	}
	.p-menu--title::after {
		content: "】";
	}

.p-menu--name {
	display: block;
	flex-grow: 1;
}

.p-menu--sub {
	display: block;
	font-size: 9px;
	opacity: 0.5;
	padding-top: 3px;
}

.p-menu--price {
	display: block;
	font-size: 16px;
	font-weight: bold;
	text-align: right;
	color: #e94709;
	padding-top: 1px;
	}
	.p-menu--price > span {
		font-size: 10px;
		padding-left: 1px;
	}
.p-menu--secondary {
	display: flex;
	justify-content: space-between;
	margin-top: 4px;
	padding-top: 4px;
	border-top: solid 1px rgba( 0, 0, 0, 0.05);
	}
	.p-menu--secondary > p {
		font-size: 9px;
		opacity: 0.5;
	}

.p-menu--note {
	font-size: 7px;
	opacity: 0.5;
	padding-top: 3px;
}

/* Object - p-menuPage */
.p-menuPage {
	background: #f7f4ef;
	padding: var(--garter--in);
}

.p-menuPage--top {
	display: block;
	font-size: 18px;
	color: white;
	font-weight: bold;
	text-align: center;
	background: var(--mainColor);
	padding: 10px;
}
.p-menuPage--bottom {
	display: block;
	padding: var(--garter--ob) var(--garter--in);
	background: #f7f4ef;
	}
	.p-menuPage--bottom__title {
		display: block;
		font-size: 18px;
		color: white;
		text-align: center;
		background: var(--mainColor);
		padding: 10px;
	}
	.p-menuPage--bottom > a {
		display: block;
		margin-top: var(--garter--ob);
	}
	.p-menuPage--bottom > a > img {
		width: 100%;
		height: auto;
	}


/* Object - p-table */
.p-table {
	display: table;
	}

.p-table--basic {
	display: table;
	line-height: 1.1;
	}
	.p-table--basic tr th {
		padding: 10px 20px;
		border: solid 1px black;
		text-align: center;
		}
	.p-table--basic tr td {
		padding: 10px 20px;
		border: solid 1px black;
		text-align: center;
		}


/* Object - p-top */
.p-top--notice {
	display: block;
	width: 100%;
	text-align: center;
	}
	.p-top--notice__yellow {
		display: flex;
		justify-content: center;
		font-size: 12px;
		color: black;
		line-height: 1.7;
		background: var(--accentColor);
		padding: 3px 15px;
		}
	.p-top--notice__red {
		display: flex;
		justify-content: center;
		font-size: 12px;
		color: white;
		line-height: 1.7;
		font-weight: bold;
		background: #aa272d;
		padding: 3px 15px;
		}
		.p-top--notice__red::before {
			content: url(../images/img_notice01.svg);
			display: inline-block;
			width: 1.3em;
			padding-right: 3px;
			position: relative;
			top: 2px;
			}

.p-top--main {
	position: relative;
	}
	.p-top--main__visual {
		display: block;
		width: 100%;
		}
		.p-top--main__visual > img {
			width: 100%;
			height: auto;
		}
	.p-top--main__image {
		width: 100%;
		height: auto;
		}
	.p-top--main__title {
		width: 80%;
		height: auto;
		position: absolute;
		bottom: 30%;
		left: 50%;
		transform: translate(-50%, 0);
		}
		.p-top--main__title > img {
			width: 100%;
			height: auto;
			filter: drop-shadow( 0px 0px 8px #1447981A);
		}
	.p-top--main__copy01 {
		width: 75%;
		height: auto;
		position: absolute;
		top: 6%;
		left: 50%;
		transform: translate(-50%, 0);
		filter: drop-shadow( 0px 0px 8px #144798);
	}
	.p-top--main__copy02 {
		width: 75%;
		height: auto;
		position: absolute;
		bottom: 12%;
		left: 50%;
		transform: translate(-50%, 0);
		filter: drop-shadow( 0px 0px 8px #144798);
	}


/* Object - p-navBar */
.p-navBar {
	display: block;
	width: 100%;
	padding: 0 15px 15px;
	position: sticky;
	bottom: -1px;
	left: 0;
	z-index: 5;
	transition: transform 0.3s ease;
	}
	.p-navBar.active {
		transform: translate( 50%, 0);
	}
	.p-navBar > ul {
		border-radius: 10px;
		display: flex;
		background: var(--accentColor);
		overflow: hidden;
		box-shadow: 0 0 6px rgb(0 0 0  / 0.2);
		}
		.p-navBar > ul .p-navBar__ticket {
			width: 50%;
			position: relative;
			}
			.p-navBar > ul .p-navBar__ticket a {
				display: flex;
				justify-content: center;
				background: var(--accentColor);
				transition: all 0.3s ease;
				}
				.p-navBar > ul .p-navBar__ticket a img {
					width: 100%;
					height: auto;
					object-fit: contain;
				}
			.p-navBar > ul .p-navBar__ticket button {
				display: block;
				width: 40px;
				background: var(--accentColor);
				border: solid 1px black;
				cursor: pointer;
				outline: none;
				padding: 0;
				appearance: none;
				border-radius: 5px;
				position: absolute;
				right: 20px;
				top: 50%;
				transform: translate( 0, -50%);
				z-index: 1;
				transition: all 0.3s ease;
				}
				.p-navBar > ul .p-navBar__ticket button img {
					display: block;
					width: 100%;
					height: auto;
				}
		.p-navBar > ul .p-navBar__yl {
			border-left: solid 1px #b9850a;
			width: 50%;
			}
			.p-navBar > ul .p-navBar__yl a {
				display: flex;
				justify-content: center;
				background: var(--accentColor);
				transition: all 0.3s ease;
				}
				.p-navBar > ul .p-navBar__yl a img {
					width: 100%;
					height: auto;
					object-fit: contain;
					}

/* Object - p-intro */
.p-intro {
	padding: 50px 25px 65px;
	background: url(../images/bg_sky01.webp) center top no-repeat;
	background-size: cover;
	border-radius: 30px 30px 0 0;
	margin-top: -30px;
	position: relative;
	overflow: hidden;
	}
	.p-intro::before {
		content: "";
		display: block;
		background: url(../images/bg_noize05.png) repeat center center;
		background-size: 100px;
		backdrop-filter: blur(50px);
		position: absolute;
		inset: 0;
	}
	.p-intro::after {
		content: url(../images/img_hokkaido_h01.svg);
		display: block;
		width: 60%;
		opacity: 0.2;
		position: absolute;
		top: -10px;
		left: -10px;
		z-index: 1;
	}

	.p-intro .p-intro--title {
		width: 100%;
		text-align: center;
		position: relative;
		z-index: 2;
		}
		.p-intro .p-intro--title > img {
			width: 95%;
			height: auto;
			filter: drop-shadow(0 0 3px rgba(0, 0, 0, 0.1));
			}

	.p-intro .p-intro--read {
		margin-top: 20px;
		position: relative;
		z-index: 2;
		color: white;
		text-align: center;
		}
		.p-intro .p-intro--read * + * {
			margin-top: 15px;
			}
		.p-intro .p-intro--read p {
			color: white;
			line-height: 2.4;
			}


/* Object - p-gourmet */
.p-gourmet {
	display: block;
	position: relative;
	}
	.p-gourmet__in {
		display: block;
		position: relative;
		overflow: hidden;
		background: url(../images/img_gourmet_carousel01.webp) repeat;
		background-size: 1450px auto;
		background-position: 0px center;
		animation: gourmet-carousel 30s linear infinite;
		}
		@keyframes gourmet-carousel {
			0%   { background-position: 0px center; }
			100% { background-position: -1450px center; }
		}
		.p-gourmet__in::before {
			content: "";
			display: block;
			padding-top: 115%;
		}
		.p-gourmet__in__jaga {
			display: block;
			width: 500px;
			height: auto;
			position: absolute;
			right: -100px;
			bottom: -20px;
		}
		.p-gourmet__in__kaisen {
			display: block;
			width: 440px;
			height: auto;
			position: absolute;
			right: -80px;
			bottom: -10px;
		}


.p-gourmet--copy {
	display: block;
	width: 70%;
	position: absolute;
	top: calc(var(--garter--in)*-1);
	left: var(--garter--in);
	z-index: 1;
	}
	.p-gourmet--copy__image {
		display: block;
		width: 100%;
		height: auto;
		}
		.p-gourmet--copy__image + .p-gourmet--copy__image {
			margin-top: 10px;
		}
		.p-gourmet--copy__image:last-child {
			filter: drop-shadow( 0 0 5px white);
		}


.p-gourmet--body {
	display: block;
	background: url(../images/bg_pattern01.webp) center center repeat;
	background-size: 300px;
	position: relative;
	}
	.p-gourmet--body::before {
		content: "";
		display: block;
		width: 100%;
		height: 250px;
		background: url(../images/img_hokkaido_h01.svg) no-repeat right bottom;
		background-position: 115% 40px;
		position: absolute;
		bottom: 0;
		right: 0;
	}
	.p-gourmet--body__name {
		display: block;
		width: 100%;
		padding: 0 var(--garter--in) 0;
		margin-bottom: -60px;
		transform: translate( 0px, -60px);
		position: relative;
		z-index: 1;
		}
		.p-gourmet--body__name > img {
			width: 100%;
			height: auto;
			filter: drop-shadow( 4px 3px 1px rgb(0 0 0 / 0.15));
		}

.p-gourmet--detail {
	display: block;
	width: 100%;
	text-align: center;
	padding: calc(var(--garter--in)*1.5) var(--garter--in) calc(var(--garter)*1.5);
	line-height: 1.5;
	position: relative;
	z-index: 1;
	}

	.p-gourmet--detail > *+* {
		margin-top: var(--garter--in);
	}
	.p-gourmet--detail table {
		line-height: 1.2;
		display: block;
		width: 100%;
		}
		.p-gourmet--detail table tbody {
			display: block;
		}
		.p-gourmet--detail table tr {
			display: flex;
			justify-content: center;
			width: 100%;
		}
		.p-gourmet--detail table tr + tr {
			border-top: solid 5px transparent;
			}
		.p-gourmet--detail table tr th {
			display: block;
			font-weight: bold;
			white-space: nowrap;
			}
		.p-gourmet--detail table tr td {
			display: block;
			padding-left: 10px;
			}
	.p-gourmet--detail__button {
		display: block;
		width: 80%;
		margin: 0 auto;
		padding: 8px;
		border: solid 1px black;
		color: black;
		background: transparent;
		text-align: center;
		border-radius: 100px;
		cursor: pointer;
		}
		


/* Object - p-owarai */

.p-owarai {
	display: block;
	position: relative;
	}
	.p-intro + .p-owarai {
		border-bottom: solid 1px #f7f4ef;
		background: url(../images/bg_noize05.png) repeat center center;
		background-size: 70px;
	}
	.p-owarai::before {
		content: url(../images/img_design01.svg);
		display: block;
		width: 150%;
		height: auto;
		position: absolute;
		top: 5px;
		left: 50%;
		transform: translate( -50%, 0);
		mix-blend-mode: multiply;
	}
	.p-owarai::after {
		content: url(../images/img_design01.svg);
		display: block;
		width: 150%;
		height: auto;
		position: absolute;
		bottom: 20px;
		left: 50%;
		transform: translate( -50%, 0) scale(-1, 1);
		mix-blend-mode: multiply;
	}
	.p-owarai--intro {
		padding: calc(var(--garter)*1.5) var(--garter--in) calc(var(--garter--in)*1.5);
		position: relative;
		z-index: 1;
		}
		.p-owarai--intro::after {
			content: url(../images/img_point01.svg);
			display: block;
			width: 20px;
			height: 20px;
			position: absolute;
			top: -10px;
			left: 50%;
			transform: translate( -50%, 0);
			z-index: 1;
		}
		.p-owarai--intro__copy01 {
			display: block;
			width: 60%;
			height: auto;
			margin: 0 auto;
		}
		.p-owarai--intro__copy02 {
			display: block;
			width: 85%;
			height: auto;
			margin: 0 auto;
			padding-top: 40px;
			filter: drop-shadow( 2px 2px 0 rgb(0 0 0 / 0.2));
		}

	.p-owarai--list {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		}
		.p-owarai--list > li {
			width: 50%;
			position: relative;
			z-index: 1;
			}
		.p-owarai--list__photo {
			width: 100%;
			}
			.p-owarai--list__photo > img {
				width: 100%;
				height: auto;
			}
		.p-owarai--list__title {
			display: block;
			width: 100%;
			font-size: 12px;
			line-height: 1.2;
			background: var(--mainColor);
			color: white;
			padding: 3px 5px;
			text-align: center;
			}
			.p-owarai--list__title > small {
				display: block;
			}

	.p-owarai--detail {
		display: block;
		width: 100%;
		text-align: center;
		padding: calc(var(--garter--in)*1.5) var(--garter--in) calc(var(--garter)*1.5);
		line-height: 1.5;
		position: relative;
		z-index: 1;
		}
		.p-owarai--detail > *+* {
			margin-top: var(--garter--in);
		}
		.p-owarai--detail table {
			line-height: 1.2;
			display: block;
			width: 100%;
			}
			.p-owarai--detail table tbody {
				display: block;
			}
			.p-owarai--detail table tr {
				display: flex;
				justify-content: center;
				width: 100%;
			}
			.p-owarai--detail table tr + tr {
				border-top: solid 5px transparent;
				}
			.p-owarai--detail table tr th {
				display: block;
				font-weight: bold;
				white-space: nowrap;
				}
			.p-owarai--detail table tr td {
				display: block;
				padding-left: 10px;
				}
		.p-owarai--detail__button {
			display: block;
			width: 80%;
			margin: 0 auto;
			padding: 8px;
			border: solid 1px black;
			text-align: center;
			border-radius: 100px;
		}




/* Object - p-event */
.p-event {
	display: block;
	background: #f7f4ef;
	padding: 0 0 var(--garter);
	}

.p-event--title {
	width: 100%;
	text-align: center;
	}
	.p-event--title > img {
		width: 100%;
		height: auto;
		}


.p-event--hanatop {
	width: 100%;
	padding: var(--garter) var(--garter--in) 0;
	}
	.p-event--hanatop > img {
		display: block;
		width: 90%;
		margin: 0 auto;
	}


.p-event--item {
	width: 100%;
	margin-top: var(--garter);
	display: flex;
	flex-wrap: nowrap;
	overflow: hidden;
	}
	.p-event--item:nth-of-type(2n) {
		flex-direction: row-reverse;
		}
		.p-event--item:nth-of-type(2n) .p-event--item__body {
			padding-left: 0;
			padding-right: 25px;
			}
			.p-event--item:nth-of-type(2n) .p-event--item__body::before {
				left: 0;
				right: auto;
				transform: translate(-100%, 0);
				}
		.p-event--item:nth-of-type(2n) .p-event--item__image {
			padding-left: 25px;
			padding-right: 15px;
			}
			.p-event--item:nth-of-type(2n) .p-event--item__image > p {
				text-align: left;
				}
			.p-event--item__body {
				width: 55%;
				padding: 15px 25px 25px;
				padding-right: 0;
				background: #eee8de;
				position: relative;
				}
				.p-event--item__body::before {
					content: "";
					display: block;
					width: 20%;
					height: 100%;
					background: #eee8de;
					position: absolute;
					top: 0;
					right: 0;
					transform: translate(100%, 0);
					}
			.p-event--item__image {
				width: 45%;
				padding: 15px;
				padding-right: 25px;
				position: relative;
				z-index: 1;
				}
				.p-event--item__image > img {
					width: 100%;
					height: auto;
					}
				.p-event--item__image > p {
					padding-top: 7.5px;
					font-size: 9px;
					text-align: right;
				}
	.p-event--item + .p-event--title {
		margin-top: 37.5px;
	}


.p-event--tag {
	display: block;
	}
	.p-event--tag > span {
		display: inline-block;
		font-size: 10px;
		color: white;
		background: var(--mainColor);
		padding: 2px 4px;
		border-radius: 2px;
		letter-spacing: -0.05em;
		}

.p-event--name {
	display: block;
	padding: 7.5px 0;
	font-size: 19px;
	line-height: 1.1;
	letter-spacing: -0.05em;
	position: relative;
	}
	.p-event--name::before {
		content: "";
		display: block;
		width: 50px;
		border-top: solid 1px var(--mainColor);
		position: absolute;
		bottom: 0;
		left: 0;
		}
	.p-event--name > small {
		display: inline-block;
		font-size: 14px;
		}


.p-event--detail {
	padding-top: 7.5px;
	font-size: 12px;
	line-height: 1.4;
	}
	.p-event--detail > * + * {
		margin-top: 7.5px;
		}
	.p-event--detail a {
		text-decoration: underline;
		}
		.p-event--detail a:hover,
		.p-event--detail a:active {
			text-decoration: none;
			}
	.p-event--detail small {
		display: block;
		font-size: 9px;
		line-height: 1;
		margin-top: 3px;
		}
	.p-event--detail strong {
		color: var(--redColor);
		}
	.p-event--detail table {
		line-height: 1.2;
		}
		.p-event--detail table tr + tr {
			border-top: solid 5px transparent;
			}
		.p-event--detail table tr th {
			font-weight: bold;
			color: var(--mainColor);
			white-space: nowrap;
			vertical-align: top;
			}
		.p-event--detail table tr td {
			padding-left: 5px;
			}
	.p-event--detail ul li {
		padding-left: 10px;
		position: relative;
		}
		.p-event--detail ul li+li {
			margin-top: 5px;
		}
		.p-event--detail ul li:before {
			content: "";
			display: block;
			width: 6px;
			height: 6px;
			border-radius: 100px;
			background-color: var(--mainColor);
			position: absolute;
			left: 0;
			top: 6px;
		}
	.p-event--detail__button {
		display: block;
		width: 100%;
		margin: 15px auto 0;
		padding: 8px;
		border: solid 1px black;
		text-align: center;
		border-radius: 100px;
		text-decoration: none !important;
	}

/* Object - p-others */
.p-others {
	display: block;
	background: #f7f4ef;
	padding: 0 0 90px;
	}
	.p-others--top {
		display: block;
		width: 100%;
		position: relative;
		}
		.p-others--top__main {
			display: block;
			width: 100%;
			height: auto;
		}
		.p-others--top__copy {
			display: block;
			width: 85%;
			height: auto;
			position: absolute;
			top: 18px;
			left: 50%;
			transform: translate( -50%, 0);
			filter: drop-shadow(0px 0px 8px #144798);
		}
	.p-others--kids {
		padding: var(--garter--in) var(--garter--in) 0;
		}
		.p-others--kids__copy {
			display: block;
			width: 97.5%;
			height: auto;
			margin: 0 auto;
		}
		.p-others--kids__main {
			display: block;
			width: 100%;
			height: auto;
			padding-top: var(--garter--ob);
		}
	.p-others--body {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		padding: var(--garter--in) var(--garter--in) 0;
		}
		.p-others--body__item {
			text-align: center;	
			width: 47.5%;	
		}
		.p-others--body__item > p {
			font-size: 17px;
			line-height: 1.2;
			font-weight: 500;
			padding-bottom: 10px;
			}
			.p-others--body__item > p > small {
				font-size: 11px;
				font-weight: normal;
			}
		.p-others--body__bunner {
			display: block;
			width: 100%;
			}
			.p-others--body__bunner > img {
				display: block;
				width: 100%;
				height: auto;
			}
			.p-others--body__bunner > span {
				display: block;
				font-size: 10px;
				background: var(--mainColor);
				color: white;
				padding: 3px 15px 3px 5px;
				text-align: right;
				position: relative;
				}
				.p-others--body__bunner > span::after {
					content: "▶";
					font-size: 7px;
					display: block;
					position: absolute;
					right: 5px;
					top: 50%;
					transform: translate( 0, -50%);

				}
	.p-others--bottom {
		display: block;
		width: 95%;
		height: auto;
		padding: 0 var(--garter--in);
		margin: var(--garter) auto 0;
	}



/* Object - p-detail */
.p-detail {
	display: block;
	padding: 0 15px;
	position: relative;
	}
	/* .p-detail::before {
		content: "";
		display: block;
		width: 100%;
		height: 30px;
		background: #ecebeb;
		position: absolute;
		top: 0;
		left: 0;
		} */



.p-detail--title {
	width: 100%;
	margin-top: -40px;
	text-align: center;
	position: relative;
	z-index: 1;
	}
	.p-detail--title > img {
		width: 65%;
		height: auto;
		}

.p-detail--dlist {
	width: 100%;
	margin-top: 37.5px;
	}
	.p-detail--dlist + .p-detail--dlist {
		margin-top: 37.5px;
		}
	.p-detail--dlist:last-child {
		margin-bottom: 50px;
		}
	.p-detail--dlist > dt {
		font-weight: 500;
		text-align: center;
		padding-bottom: 7.5px;
		position: relative;
		}
		.p-detail--dlist > dt::after {
			content: "";
			display: block;
			width: 50px;
			border-top: solid 1px black;
			position: absolute;
			bottom: 0;
			left: 50%;
			transform: translate(-50%, 0);
			}
	.p-detail--dlist > dd {
		margin-top: 7.5px;
		text-align: center;
		}
		.p-detail--dlist > dd > * + * {
			margin-top: 7.5px;
			}
		.p-detail--dlist > dd + dd {
			margin-top: 22.5px;
			}
		.p-detail--dlist > dd.p-detail--price {
			width: 80%;
			margin: 10px auto 0;
		}
		.p-detail--dlist > dd + dd.border {
			margin-top: 15px;
			padding-top: 15px;
			position: relative;
			}
		.p-detail--dlist > dd + dd.border::after {
			content: "";
			display: block;
			width: 5px;
			border-top: solid 1px black;
			position: absolute;
			top: 0;
			left: 50%;
			transform: translate(-50%, 0);
			}
		.p-detail--dlist > dd small {
			font-size: 9px;
			display: block;
			line-height: 1.2;
			margin-top: 3px;
			}
		.p-detail--dlist > dd p {
			line-height: 1.4;
			}
			.p-detail--dlist > dd p a {
				text-decoration: underline;
				}
				.p-detail--dlist > dd p a:hover,
				.p-detail--dlist > dd p a:active {
					text-decoration: none;
					}
		.p-detail--dlist > dd strong {
			text-align: center;
			color: #548d00;
			background: -webkit-linear-gradient(transparent 50%, var(--accentColor) 50%);
			background: -o-linear-gradient(transparent 50%, var(--accentColor) 50%);
			background: linear-gradient(transparent 50%, var(--accentColor) 50%);
			}
		.p-detail--dlist > dd .p-detail--dlist__admission {
			margin: 7.5px auto 0;
			}
			.p-detail--dlist > dd .p-detail--dlist__admission td {
				font-size: 19px;
				font-weight: 500;
				}
				.p-detail--dlist > dd .p-detail--dlist__admission td span {
					font-size: 14px;
					}
				.p-detail--dlist > dd .p-detail--dlist__admission td small {
					font-weight: normal;
					}
			.p-detail--dlist > dd .p-detail--dlist__buttonList {
				display: flex;
				flex-wrap: nowrap;
				justify-content: space-evenly;
				}
				.p-detail--dlist > dd .p-detail--dlist__buttonList li {
					display: block;
					}
					.p-detail--dlist > dd .p-detail--dlist__buttonList li a {
						display: inline-block;
						color: black;
						padding: 15px 20px;
						background: var(--accentColor);
						border-radius: 10px;
						}
			.p-detail--dlist > dd .p-detail--dlist__access > li {
				line-height: 1.4;
				}
				.p-detail--dlist > dd .p-detail--dlist__access > li.train::before {
					content: "\e900";
					font-family: "myfont";
					color: #32833a;
					}
				.p-detail--dlist > dd .p-detail--dlist__access > li.car::before {
					content: "\e901";
					font-family: "myfont";
					color: #008a78;
					}
				.p-detail--dlist > dd .p-detail--dlist__access > li + li {
					margin-top: 15px;
					padding-top: 15px;
					position: relative;
					}
					.p-detail--dlist > dd .p-detail--dlist__access > li + li::after {
						content: "";
						display: block;
						width: 5px;
						border-top: solid 1px black;
						position: absolute;
						top: 0;
						left: 50%;
						transform: translate(-50%, 0);
						}
	.p-detail--dlist.large > dt {
		font-size: 18px;
		padding-bottom: 15px;
		}
		.p-detail--dlist.large > dt::after {
			width: 160px;
			}
		.p-detail--dlist.large > dd {
			margin-top: 15px;
			}
			.p-detail--dlist.large > dd > time {
				display: block;
				text-align: center;
				}
				.p-detail--dlist.large > dd > time > img {
					width: 55%;
					height: auto;
					}