@charset "UTF-8";
/* ===========================
1.目次＆ブレークポイント
============================== */
/*
1.目次＆ブレークポイント
2.全体
3.ヘッダー
4.フッター
5.チケットボタン
6.左右スワイプ
7.見出し
*/
@media screen and (max-width: 119.99em) { /* 1920px xxl */
}
@media screen and (max-width: 89.99em) { /* 1440px xl2 */
}
@media screen and (max-width: 79.99em) { /* 1280px xl */
}
@media screen and (max-width: 69.99em) { /* 1120px lg2 */
}
@media screen and (max-width: 63.99em) { /* 1024px lg */
}
@media screen and (max-width: 54.99em) { /* 880px md2 */
}
@media screen and (max-width: 47.99em) { /* 768px md */
}
@media screen and (max-width: 35.499em) { /* 568px sm */
}
@media screen and (max-width: 29.99em) { /* 480px xs */
}
@media screen and (max-width: 22.99em) { /* 368px xs */
}

/* ===========================
2.全体
============================== */
html {
	scroll-behavior: smooth;
	overflow-y: scroll;
}
html, body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
	border: 0;
}
body {
	font-size: 16px;
	font-family: 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', 'Meiryo', "Noto Sans JP", 'Noto Sans CJK JP', 'Yu Gothic', 'YuGothic', 'MS PGothic', sans-serif;
	font-optical-sizing: auto;
	position: relative;
	line-height: 1;	
}
div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  vertical-align: baseline;
	box-sizing: border-box;
}
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
  display: block;
	box-sizing: border-box;
}
ol, ul {
  list-style: none;
}
blockquote, q {
  quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {	
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
.link-target {
	scroll-margin-top: 120px;
}
.dp-ib {
	display: inline-block;
}
.db-bl {
	display: block;
}
.ib-pc {
	display: inline;
}
.has_img img {
	display: block;
	width: 100%;
	max-width: 100%;
	height: auto;
}
.has_img-1st > img:first-of-type {
	display: block;
	width: 100%;
	max-width: 100%;
	height: auto;
}
.has_img img.not-full {
	width: auto;
}
.c-red01 {
	color: #a54440;
}
.c-red02 {
	color: #b65b5b;
}
.c-green01 {
	color: #41866d;
}
.c-white01 {
	color: #fff;
}
.ff-open_sans {
	font-family: "Open Sans", 'Lato', sans-serif;
}
.ind-min {
	padding-left: 1em;
	text-indent: -1em;
}
.button_list {
	display: flex;
	flex-direction: column;
	row-gap: 1em;
}
.yl-button {
	padding: 0.75em 2em ;
	background-color: #c78302;
	min-width: 15.71em;
	font-size: 0.875rem;
	color: #fff;
	text-align: center;
	text-decoration: none;
	transition: all 0.3s;
}
.yl-button span {
	display: inline-block;
	position: relative;
}
.yl-button span::before {
	position: absolute;
	content: '＞';
	display: block;
	top: 7px;
	left: -1.25em;
	transform: translateY(-50%);
}
.yl-button:hover {
	filter: brightness(1.15);
}
.with-b_border {
	border: #000 solid 1px;
}
@media screen and (max-width: 47.99em) { /* 768px md */
	.ib-pc {
		display: none;
	}
	.yl-button {
		font-size: 0.8125rem;
	}
}

/* ===========================
3.ヘッダー
============================== */
.page_header {
	position: fixed;
	top: 0;
  width: 100%;
  background-color: #42210b;
	z-index: 20;
}
.page_header_inner {
	display: grid;
	grid-template-columns: 25.94% 1fr;
	column-gap: 0.5%;
  width: 100%;
  max-width: 1366px;
  margin: 0 auto;
  padding: 0 20px;
}
.page_logo_area {
	position: relative;
}
.page_logo_area > a {
	position: absolute;
	top: 0;
	left: 18.4%;
	transition: all 0.3s;
}
.page_logo_area > a:hover {
	filter: brightness(1.15);
}
.page_logo_area > a img {
	width: 100%;
	max-width: 280px;
	height: auto;
}
.gnav {
	display: flex;
	justify-content: flex-end;
}
.gnav li a {
	display: block;
	padding: 2.25em 1.625em 2.25em;
	font-size: 0.875rem;
	color: #fff;
	text-decoration: none;
	transition: all 0.2s;
}
.gnav li a:hover {
	color: #ffb;
	transform: scale(1.2);
}
.gnav li.sp {
	display: none;
}
#menu_toggle, .menu_icon {
	display: none;
}

/* サブメニュー */
/* ベース */
.gnav > li.has-sub {
	position: relative;
}
.gnav > li.has-sub > a.parent {
	position: relative;
	padding-right: 0.9em;
}
/* サブメニュー本体（PCデフォルトは非表示） */
.gnav .subnav {
	display: none;
	position: absolute;
	left: 0;
	top: 100%;
	min-width: 220px;
	background: #42210b;
	border: 1px solid #ffffff40;
	z-index: 30;
}
.gnav .subnav li a {
	padding: 0.9em 1.2em;
	font-size: 0.875rem;
	white-space: nowrap;
}

/* 既存のホバー拡大をサブメニューには適用しない */
.gnav .subnav a:hover {
	transform: none;
}

@media screen and (max-width: 79.99em) { /* 1280px xl */
	.page_header_inner {
		grid-template-columns: 22% 1fr;
	}
}

@media screen and (min-width: 70em) { /* 1120pxより上＝PC */
	/* サブメニュー */
	/* PC：ホバー/フォーカスで開く */
	.gnav > li.has-sub:hover > .subnav,
	.gnav > li.has-sub:focus-within > .subnav {
		display: block;
	}
  
	.gnav > li.has-sub > .subnav {
		border-top: none; 
	  }
}

@media screen and (max-width: 69.99em) { /* 1120px lg2 */
	.page_header {
		background-color: transparent;
	}
	.page_header_inner {
		display: grid;
		grid-template-columns: 1fr 70px;
		padding-bottom: 0.75em;
	}
	.page_logo_area {
		display: none;
	}
	.page_logo_area > a {
		left: 20px;
	}
	.page_logo_area > a img {
		max-width: 210px;
	}
	.page_nav_area {
		grid-column: 2 / 3;
		margin-right: -20px;
		padding: 0 0 0;
		display: flex;
		justify-content: center;
		align-items: center;
		width: 70px;
		min-height: 60px;
		background-color: #42210b;
	}
	#menu_toggle {
		display: block;
		visibility: hidden;
	}
	#pageNav {
		display: none;
	}
	.hamburger_menu {
		width: 100%;
		height: 100%;
	}
	.menu_icon {
		position: relative;
		top: -13px;
		left: 0;
		display: block;
		cursor: pointer;
		width: 100%;
		height: 100%;
	}
	.menu_icon span {
		position: absolute;
		top: 13px;
		left: 10px;
		display: block;
		cursor: pointer;
		width: 30px;
		height: 30px;
	}
	.menu_icon span span, .menu_icon span span:before, .menu_icon span span:after {
		content: '';
		display: block;
		background-color: #fff;
		height: 4px;
		width: 100%;
		position: absolute;
		transition: all 0.3s;
	}
	.menu_icon span span {
		top: 50%;
		transform: translateY(-50%);
	}
	.menu_icon span span:before {
		top: -12px;
	}
	.menu_icon span span:after {
		top: 12px;
	}
	#menu_toggle:checked + .menu_icon span span {
		background-color: transparent;
	}
	#menu_toggle:checked + .menu_icon span span:before {
		transform: rotate(45deg);
		top: 0;
	}
	#menu_toggle:checked + .menu_icon span span:after {
		transform: rotate(-45deg);
		top: 0;
	}
	#menu_toggle:checked ~ #pageNav {
		display: block;
		position: absolute;
		top: calc(30px + 1.25em);
		right: 20px;
		left: 20px;
		background-color: #42210b;
		z-index: 10;
	}
	.gnav {
		flex-direction: column;
	}
	.gnav li.sp {
		display: list-item;
	}
	.gnav > li {
		margin: 0 1.5%;
		border-top: #fff solid 1px;
	}
	.gnav > li:first-child {
		border-top: none;
	}
	.gnav > li > a {
		padding: 1.5em 0.75em;
	}
	.gnav > li > a:hover {
		transform: none;
	}
	/* サブメニュー */
	.gnav > li.has-sub .subnav {
		position: static;
		border: none;
		background: transparent;
	}
	.gnav > li.has-sub .subnav li a {
		display: block;
		min-height: 44px;
		padding: 12px 0.9em 12px 1.75em;
		border-top: 1px solid #ffffff33;
	}

	.gnav > li.has-sub > a.parent:hover {
		transform: none;
	}

	.gnav > li.has-sub .subnav li:first-child a {
		border-top: none;
	}
	.gnav > li.has-sub > a.parent {
		display: block;
		line-height: 1.4;
		min-height: 48px; 
		padding: 14px 0.9em;
		-webkit-tap-highlight-color: rgba(255,255,255,0.15);
	}

	#menu_toggle:checked ~ #pageNav .gnav > li.has-sub .subnav {
		display: block !important;
		max-height: none;
		visibility: visible;
		opacity: 1;
	}
	#menu_toggle:checked ~ #pageNav {
		position: fixed;
		top: calc(30px + 1.25em);
		left: 0;
		right: 0;
		bottom: 0;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		padding: 12px 20px 28px;
		z-index: 100;
	  }
	
	  #pageNav .gnav > li.has-sub > .subnav { display: none; }
	
	  #menu_toggle:checked ~ #pageNav .gnav > li.has-sub > .subnav {
		display: block !important;
		max-height: none;
		visibility: visible;
		opacity: 1;
	  }
	}
		 
}
@media screen and (max-width: 47.99em) { /* 768px md */
	.page_header_inner {
		padding: 0 10px;
	}
	.page_logo_area > a {
		left: 0;
	}
	.page_logo_area > a img {
		max-width: 140px;
	}
}
@media screen and (max-width: 35.499em) { /* 568px sm */
	.page_logo_area > a img {
		max-width: 100px;
	}
}
@media screen and (max-width: 29.99em) { /* 480px xs */
}
/* ===========================
4.フッター
============================== */
.page_footer {
	background-color: #00866d;
}
.page_footer_inner {
	display: flex;
	column-gap: 40px;
	margin: 0 auto;
	width: calc(100% - 40px);
	max-width: 1200px;
	padding: 72px 0;
}
.page_footer_inner > * {
	display: grid;
	width: calc((100% - 40px) / 2);
	justify-content: center;
}
.page_footer_inner a {
	display: block;
	transition: all 0.3s;
}
.page_footer_inner a:hover {
	transform: scale(1.05);
}
.page_footer_inner a img {
	max-width: 100%;
}
@media screen and (max-width: 69.99em) { /* 1120px lg2 */
	.page_footer_inner {
		column-gap: 30px;
		width: calc(100% - 30px);
		padding: 60px 120px 60px 0;
	}
	.page_footer_inner > * {
		width: calc((100% - 30px) / 2);
	}
}
@media screen and (max-width: 47.99em) { /* 768px md */
	.page_footer_inner {
		column-gap: 20px;
		width: calc(100% - 20px);
		padding: 54px 120px 54px 0;
	}
	.page_footer_inner > * {
		width: calc((100% - 20px) / 2);
	}
}
@media screen and (max-width: 35.499em) { /* 568px sm */
	.page_footer_inner {
		column-gap: 20px;
		width: calc(100% - 20px);
		padding: 30px 120px 30px 20px;
	}
	.page_footer_inner {
		flex-direction: column;
		row-gap: 20px;
		align-items: center;
	}
	.page_footer_inner > * {
		width: 100%;
		max-width: 200px;
	}
}
/* ===========================
5.チケットボタン
============================== */
.tiket_area {
	position: fixed;
	bottom: 20px;
	right: 20px;
	text-align: right;
	z-index: 100;
}
.tiket_area a {
	display: inline-block;
	transition: all 0.3s;
}
.tiket_area a:hover {
	filter: brightness(1.15);
}
.tiket_area a img {
	max-width: 100%;
}
.tiket_area #toPageTop {
	display: none;
	position: absolute;
	right: 0;
	top: -60px;
}
.tiket_area #toPageTop img,
.tiket_area #toTiketPage img {
	filter: drop-shadow(3px 2px 6px #00000099)
}
.tiket_area #toPageTop img {
	transition: all 0.3s;
}
.tiket_area #toPageTop img:hover {
	filter: brightness(1.35);
}
@media screen and (max-width: 69.99em) { /* 1120px lg2 */
	.tiket_area #toPageTop {
		display: block;
		top: -50px;
	}
	.tiket_area #toPageTop img {
		width: 40px;
		height: auto;
	}
	.tiket_area a#toTiketPage img {
		width: 120px;
		height: auto;
	}
}
@media screen and (max-width: 47.99em) { /* 768px md */
	.tiket_area #toPageTop {
		display: block;
		top: -45px;
	}
	.tiket_area #toPageTop img {
		width: 35px;
		height: auto;
	}
	.tiket_area a#toTiketPage img {
		width: 100px;
	}
}
@media screen and (max-width: 35.499em) { /* 568px sm */
	.tiket_area #toPageTop {
		display: block;
		top: -40px;
	}
	.tiket_area #toPageTop img {
		width: 30px;
		height: auto;
	}
	.tiket_area a#toTiketPage img {
		width: 80px;
		height: auto;
	}
}
/* ===========================
6.左右スワイプ
============================== */
.swipe-area {
	position: relative;
	overflow: hidden;
}
.swipe-contents {
	overflow-x: scroll;
}
.swipe-icon {
	position: absolute;
	top: 50%;
	left: 45%;
	transform: translateX(-50%) translateY(-50%);
	animation: swipe-icon 1.8s ease-in-out 0s infinite normal;
	pointer-events: none; 
}
@keyframes swipe-icon { 
	0% {left: 45%;}
	50% {left: 55%;}
	100% {left: 45%;}
}
/* ===========================
7.見出し
============================== */
/* --- H2標準 --- */
.hgroup-ttl_sec {
	display: grid;
	grid-template-columns: 14.167% 1fr 14.167%;
	margin-bottom: 40px;
}
.hgroup-ttl_sec.red {
	background-color: #a54440;
}
.hgroup-ttl_sec.green {
	background-color: #147663;
}
.hgroup-ttl_sec .ttl_sec_before,
.hgroup-ttl_sec .ttl_sec_after {
	position: relative;
}
.hgroup-ttl_sec .ttl_sec_before img,
.hgroup-ttl_sec .ttl_sec_after img {
	position: absolute;
	height: auto;
}
.hgroup-ttl_sec .ttl_sec_before img {
	right: 8%;
	top: -14px;
	max-width: 59%;
}
.hgroup-ttl_sec .ttl_sec_after img {
	left: 0;
	bottom: -14px;
	max-width: 62%;
}
.hgroup-ttl_sec .ttl_sec {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	margin-bottom: 0;
	padding: 6px 4px;
	min-height: 100%;
	text-align: center;
	line-height: 1;
}
.hgroup-ttl_sec .ttl_sec img {
	max-width: 100%;
	height: auto;
}
@media screen and (max-width: 47.99em) { /* 768px md */
	.hgroup-ttl_sec {
		margin-bottom: 20px;
	}
	.hgroup-ttl_sec .ttl_sec_before img {
		top: -10px;
	}
	.hgroup-ttl_sec .ttl_sec_after img {
		bottom: -10px;
	}
}
/* --- H3標準 --- */
.area_subsec_round {
	position: relative;
	margin: 64px auto 0;
	padding: 0.80906% 2.53164% 0;
	width: 100%;
	max-width: 1264px;
}
.area_subsec_round .subsec_area_name {
	position: absolute;
	top: 0;
	left: -2.3734%;
	width: 13.845%;
	z-index: 15;
	transform: translateY(-10%);
}
.area_subsec_round .area_subsec_inner {
	border-radius: 46px ;
	background-color: #fff;
	padding-bottom: 40px;
}
.subsec_ttl {
	display: flex;
	justify-content: center;
	padding: 2rem 13.84% 4.5em;
	border-radius: 46px 46px 0 0 / 46px 46px 0 0 ;
}
.subsec_ttl.green {
	background: url('../img/common/reindeer_house_red.svg') bottom right no-repeat, linear-gradient( 180deg, #41866d, #41866d 99%, #fff 99.1%, #fff), #41866d ;
	background-size: 100%;
}
.subsec_ttl.orange {
	background: url('../img/common/reindeer_house_green.svg') bottom right no-repeat, linear-gradient( 180deg, #c78302, #c78302 99%, #fff 99.1%, #fff),#c78302;
	background-size: 100%;
}
.subsec_ttl .subsec_ttl_inner {
	display: block;
	padding: 0 10%;
	font-size: 1.375rem;
	color: #fff;
	font-weight: bold;
	letter-spacing: 0.05em;
	line-height: 1.25;
	text-align: center;
}
@media screen and (max-width: 69.99em) { /* 1120px lg2 */
	.area_subsec_round {
		margin: 50px auto 0;
	}
	.area_subsec_round .subsec_area_name {
		width: 16%;
	}
	.subsec_ttl {
		padding: 2rem 13.84% 4em;
	}
	.subsec_ttl .subsec_ttl_inner {
		padding: 0 7%;
	}
}
@media screen and (max-width: 63.99em) { /* 1024px lg */
	.subsec_ttl {
		padding: 2rem 16% 3.5em;
	}
}
@media screen and (max-width: 47.99em) { /* 768px md */
	.area_subsec_round {
		margin: 30px auto 0;
	}
	.area_subsec_round .subsec_area_name {
		width: 20%;
	}
	.subsec_ttl {
		padding: 1.5rem 20% 3em;
	}
	.subsec_ttl .subsec_ttl_inner {
		padding: 0 5%;
		font-size: 1.25rem;
	}
}
@media screen and (max-width: 35.499em) { /* 568px sm */
	.area_subsec_round .subsec_area_name {
		width: 24%;
	}
	.subsec_ttl {
		padding: 1.5rem 24% 2.25em;
	}
	.subsec_ttl .subsec_ttl_inner {
		padding: 0 5%;
		font-size: 1rem;
	}
}
@media screen and (max-width: 29.99em) { /* 480px xs */
	.area_subsec_round .subsec_area_name {
		width: 35%;
	}
	.subsec_ttl {
		padding: 1.5rem 20% 2.25em 35%;
	}
}
@media screen and (max-width: 22.99em) { /* 368px xs */
	.area_subsec_round .subsec_area_name {
		width: 40%;
	}
	.subsec_ttl {
		padding: 1.5rem 15% 2.25em 40%;
	}
}