/*
	$Id: common-contents.css,v1.0 $
*/
/*===========================================================================
-----------------------------------------------------------------------------
  メインビジュアル設定　ここから
-----------------------------------------------------------------------------
===========================================================================*/
#background section#main-visual {
	position: relative;
	width: 100%;
	max-width: initial;
	max-width: auto;
	height: 100vh;
	background: url(./images/main-background.jpg) no-repeat 50% 50%;
	background-size: cover;
}
#background header section#main-visual h1 {
	display: block;
	width: 100%;
	text-align: center;
	height: 180px;
	padding: 0;
	filter:drop-shadow(0 0 5px rgba(0, 0, 0, 0.3));
	position: absolute;
	top: calc(50% - 90px);
}
#background header section#main-visual h1 img {
	display: block;
	width: 50%;
	max-width: 640px;
	margin: auto;
}
#background section#main-visual > p.more {
	position: block;
	width: 100%;
	position: absolute;
	bottom: 24px;
	text-align: center;
}
#background section#main-visual > p.more a {
	position: relative;
	display: inline-block;
	padding: 0 0 20px;
	color: #fff;
	filter:drop-shadow(0 0 5px rgba(0, 0, 0, 0.3));
	font-size: 14px;
	line-height: 1em;
	animation-name: alpha;
	animation-duration: 2s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
}
#background section#main-visual > p.more a:before {
	content: "";
	display: block;
	width: 8px;
	height: 8px;
	border-right: 2px solid #fff;
	border-bottom: 2px solid #fff;
	position: absolute;
	bottom: 0;
	left: calc(50% - 4px);
	transform: rotate(45deg);
	animation-name: piston;
	animation-duration: 0.6s;
	animation-timing-function: ease-out;
	animation-iteration-count: infinite;
	animation-direction: alternate;
}
@keyframes alpha {
	  0% { opacity: 1; }
	100% { opacity: 0.6; }
}
@keyframes piston {
	  0% { bottom: 0; }
	100% { bottom: 3px; }
}


/** 小さい画面用分岐 **/
@media screen and (max-width: 1200px) {
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
}
/*===========================================================================

  リード文設定　ここから

===========================================================================*/
#background #about section {
	margin: 0 auto 0  calc(50% + 73px);
	width: calc(45vw - 73px);
	max-width: 466px;
	height: 480px;
	writing-mode: vertical-rl;
}
#background #about section h3 {
	font-size: 32px;
	font-family: 'Noto Serif JP', serif;
	font-weight: 900;
	line-height: 1em;
	padding: 32px 0;
	margin: 0 0 0 48px;
}
#background #about section p {
	line-height: 2em;
	padding: 32px 0 32px 10px;
	margin: 0 0 0 auto;
	background: #fff;
	z-index: 10;
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background #about section {
		margin: 0 auto;
		width: 100%;
		max-width: initial;
		max-width: auto;
		height: auto;
		writing-mode: horizontal-tb;
	}
	#background #about section h3 {
		font-size: 24px;
		padding: 32px 0 16px;
		margin: 0 8vw;
	}
	#background #about section p {
		padding: 0 8vw 16px;
		background: transparent;
	}
}
/*-----------------------------------*/
#background #about {
	margin-bottom: 80px;
}
#background #about:after {
	content: "";
	visibility: visible;
	display: block;
	width: calc(50% + 73px);
	height: 480px;
	background: url(./images/photo11.jpg) no-repeat 50% 50%;
	background-size: cover;
	position: absolute;
	left: 0;
	top: 0;
}
#background #about section p:after ,
#background #about:before {
	content: "";
	display: block;
	visibility: visible;
	width: 73px;
	height: 480px;
	background: url(./images/mask-right.svg) no-repeat 100% 100%;
	background-size: contain;
	position: absolute;
	left: 50%;
	top: 0;
	z-index: 10;
}
#background #about section p:after {
	left: -73px;
}

/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background #about {
		margin-bottom: 40px;
	}
	#background #about:after {
		content: "";
		display: block;
		width: 90vw;
		height: 59.1vw;
		position: relative;
		left: calc(50% - 45vw);
		top: 0;
	}
	#background #about section p:after {
		display: none;
	}/*
	#background #about:before {
		width: 380px;
		height: 100vw;
		background: url(./images/mask-left.svg) no-repeat 0 0;
		background-size: contain;
		transform-origin: bottom left;
		transform: rotate(90deg);
		left: 0;
		top: auto;
		bottom: 380px;
	}*/
	#background #about:before {
		display: none;
	}
}

/*===========================================================================
-----------------------------------------------------------------------------
  共通スライダー 設定　ここから
-----------------------------------------------------------------------------
===========================================================================*/
#background section.slider-set {
	width: 100%;
	max-width: initial;
	max-width: auto;
	overflow: hidden;
}
#background section.slider-set ul {
	position: relative;
}
#background section.slider-set ul li {
	overflow: hidden;
}
#background section.slider-set li:before ,
#background section.slider-set li:after {
	content: "";
	visibility: visible;
	display: block;
	width: 50%;
	height: calc(100% + 3px);
	background: url(./images/mask-left.svg) no-repeat 0 0;
	background-size: contain;
	position: absolute;
	left: -1px;
	top: -1px;
	z-index: 10;
}
#background section.slider-set li:after {
	background: url(./images/mask-right.svg) no-repeat 100% 100%;
	background-size: contain;
	left: auto;
	right: -1px;
}
/** 小さい画面用分岐 **/
@media screen and (max-width: 1200px) {
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
}

/*-----------------------------------*/
#background .slider-set .slick-arrow {
	display: block;
	height: 210px;
	width: 64px;
	border: none;
	background: transparent url(./images/icon-next.svg) no-repeat 50% 50%;
	background-size: contain;
	overflow: hidden;
	text-indent: -10em;
	position: absolute;
	z-index: 20;
	top: calc(50% - 105px);
	filter:drop-shadow(0 0 5px rgba(0, 0, 0, 0.3));
}
#background .slider-set .slick-arrow.slick-prev {
	left: 5vw;
	transform: rotate(180deg);
}
#background .slider-set .slick-arrow.slick-next {
	right: 5vw;
}

/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background .slider-set .slick-arrow {
		height: 54px;
		width: 16px;
		top: calc(50% - 27px);
	}
	#background .slider-set .slick-arrow.slick-prev {
		left: 3vw;
	}
	#background .slider-set .slick-arrow.slick-next {
		right: 3vw;
	}
}

/*------------------------------------
  リード下スライダーマージン設定　ここから
-------------------------------------*/
#background .shop-slider {
	margin-bottom: 96px;
}
#background .shop-slider section.slider-set li:before ,
#background .shop-slider section.slider-set li:after {
	transform: rotateX(180deg);
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background .shop-slider {
		margin-bottom: 40px;
	}
}
/*------------------------------------
  季節スライダーマージン設定　ここから
-------------------------------------*/
#background .season-slider {
	margin-bottom: 56px;
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background .season-slider {
		margin-bottom: 28px;
	}
}

/*===========================================================================
-----------------------------------------------------------------------------
  新着情報 設定　ここから
-----------------------------------------------------------------------------
===========================================================================*/
#background #news {
	background: #f0f3f7;
	padding: 80px 0 96px;
	margin-bottom: 80px;
}
#background #news section.title-set > h2 {
	padding-right: 110px;
}
#background #news section.title-set > p {
	padding-left: 110px;
}
/** 小さい画面用分岐 **/
@media screen and (max-width: 920px) {
	#background #news section.title-set > h2 {
		padding-right: 85px;
	}
	#background #news section.title-set > p {
		padding-left: 60px;
	}
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background #news {
		padding: 40px 0 48px;
		margin-bottom: 40px;
	}
	#background #news section.title-set > h2 ,
	#background #news section.title-set > p {
		padding: 0;
	}
}
/*-----------------------------------*/
#background #news .sns-set {
	display: flex;
}
#background #news .sns-set > div {
	width: calc(47.5% - 10px);
	max-width: 500px;
	margin: 0;
}
#background #news .sns-set > div.fb-box {
	margin-right: auto;
}
#background #news .sns-set > div.insta-box {
	margin-left: auto;
}
#background #news .sns-set > div > iframe {
	width: 100% !important;
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background #news .sns-set {
		display: block;
	}
	#background #news .sns-set > div {
		width: 100%;
		max-width: 500px;
		margin: 0 auto;
	}
	#background #news .sns-set > div.fb-box {
		margin-bottom: 20px;
	}
}
/*-----------------------------------*/
#background #news .sns-set > .insta-box .insta-box-inner {
	position: relative;
	width: 100%;
	padding-top: 100%;
	margin-bottom: 48px;
}
#background #news .sns-set > .insta-box .insta-box-inner > iframe ,
#background #news .sns-set > .insta-box .insta-box-inner > .dummy {
	position: absolute;
	top: 0;
	left: 0;
}
#background #news .sns-set > .insta-box .insta-box-inner > a {
	display: block;
	width: 100%;
	height: 100%;
	overflow: hidden;
	text-indent: -20em;
	position: absolute;
	top: 0;
	left: 0;
	background: #f0f3f7;
	filter: Alpha(opacity=0);
	opacity: 0;
}
#background #news .sns-set > .insta-box .insta-box-inner > a:hover {
	filter: Alpha(opacity=50);
	opacity: 0.5;
}
#background #news .sns-set > .insta-box .more {
	text-align: center;
	margin: 0;
}
#background #news .sns-set > .insta-box .more a {
	display: inline-block;
	background: #2a2a2a;
	border-radius: 8px;
	width: 80%;
	max-width: 340px;
}

/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background #news .sns-set > .insta-box .insta-box-inner {
		margin-bottom: 24px;
	}
}
/*===========================================================================
-----------------------------------------------------------------------------
  フード設定　ここから
-----------------------------------------------------------------------------
===========================================================================*/
#background #food {
	margin-bottom: 96px;
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background #food {
		margin-bottom: 48px;
	}
}
/*------------------------------------
  ひとつ 設定　ここから
-------------------------------------*/
#background #food section.photo-set1 {
	width: 100%;
	max-width: initial;
	max-width: auto;
	display: flex;
	justify-content: center;
	align-items:center;
	margin-bottom: 56px;
}
#background #food section.photo-set1 figure {
	position: relative;
	overflow: hidden;
	width: 50%;
}
#background #food section.photo-set1 figure:before {
	content: "";
	visibility: visible;
	display: block;
	width: 50%;
	height: calc(100% + 3px);
	background: url(./images/mask-right.svg) no-repeat 100% 100%;
	background-size: contain;
	transform: rotateX(180deg);
	position: absolute;
	top: -1px;
	right: -1px;
	z-index: 10;
}
#background #food section.photo-set1 .food-info {
	display: block;
	width: calc(45vw - 50px);
	max-width: 490px;
	margin: auto auto auto 50px;
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background #food section.photo-set1 {
		display: block;
		width: 86vw;
		margin: 0 auto 28px;
	}
	#background #food section.photo-set1 figure {
		width: 90vw;
		margin: 0 -2vw 24px;
	}
	#background #food section.photo-set1 figure:before {
		display: none;
	}
	#background #food section.photo-set1 .food-info {
		display: block;
		width: 100%;
		max-width: initial;
		max-width: auto;
		margin: 0 auto;
	}
}
/*------------------------------------
  ふたつ 設定　ここから
-------------------------------------*/
#background #food section.photo-set2 {
	display: flex;
	margin-bottom: 56px;
}
#background #food section.photo-set2 > div {
	width: 50%;
}
#background #food section.photo-set2 > div figure {
	position: relative;
	overflow: hidden;
	width: 100%;
	margin-bottom: 32px;
}
#background #food section.photo-set2 > div figure:before {
	content: "";
	visibility: visible;
	display: block;
	width: 50%;
	height: calc(100% + 3px);
	background: url(./images/mask-right.svg) no-repeat 100% 100%;
	background-size: contain;
	position: absolute;
	top: -1px;
	right: -1px;
	z-index: 10;
}
#background #food section.photo-set2 > div:nth-of-type(2n) figure:before {
	background: url(./images/mask-left.svg) no-repeat 0 0;
	background-size: contain;
	right: auto;
	left: -1px;
}
#background #food section.photo-set2 .food-info {
	padding: 0 60px 0 25px;
}
#background #food section.photo-set2 > div:nth-of-type(2n) .food-info {
	padding: 0 20px 0 60px;
}
/** 小さい画面用分岐 **/
@media screen and (max-width: 960px) {
	#background #food section.photo-set2 .food-info {
		padding: 0 30px 0 12px;
	}
	#background #food section.photo-set2 > div:nth-of-type(2n) .food-info {
		padding: 0 10px 0 30px;
	}
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background #food section.photo-set2 {
		display: block;
		margin-bottom: 0;
	}
	#background #food section.photo-set2 > div {
		width: 100%;
		margin-bottom: 28px;
	}
	#background #food section.photo-set2 > div figure {
		width: 90vw;
		margin: 0 -2vw 24px;
	}
	#background #food section.photo-set2 > div figure:before {
		display: none;
	}
	#background #food section.photo-set2 .food-info ,
	#background #food section.photo-set2 > div:nth-of-type(2n) .food-info {
		padding: 0;
	}
}
/*------------------------------------
  いつつ 設定　ここから
-------------------------------------*/
#background #food section.photo-set5 {
	display: flex;
}
#background #food section.photo-set5 > figure {
	position: relative;
	overflow: hidden;
	width: 20.555%;
}
#background #food section.photo-set5 > figure:first-child ,
#background #food section.photo-set5 > figure:last-child {
	width: 19.1666%;
}
#background #food section.photo-set5 > figure:before ,
#background #food section.photo-set5 > figure:after {
	content: "";
	visibility: visible;
	display: block;
	width: 50%;
	height: calc(100% + 3px);
	background: url(./images/mask-left.svg) no-repeat 0 0;
	background-size: contain;
	transform: rotateX(180deg);
	position: absolute;
	left: -1px;
	top: -1px;
	z-index: 10;
}
#background #food section.photo-set5 > figure:after {
	background: url(./images/mask-right.svg) no-repeat 100% 100%;
	background-size: contain;
	left: auto;
	right: -1px;
}
#background #food section.photo-set5 > figure:first-child:before ,
#background #food section.photo-set5 > figure:last-child:after {
	display: none;
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background #food section.photo-set5 {
		width: 90vw;
	}
}

/*------------------------------------
  情報中身 設定　ここから
-------------------------------------*/
#background #food .food-info > h4 {
	font-family: 'Noto Serif JP', serif;
	font-size: 24px;
	font-weight: 900;
	line-height: 1.2em;
	margin-bottom: 32px;
}
#background #food .food-info > h4 > small {
	display: inline-block;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 16px;
	font-weight: 700;
	line-height: 1em;
}
#background #food .food-info > p {
	line-height: 2em;
	margin-bottom: 32px;
}
#background #food .food-info > ul {
	margin: 0;
	display: flex;
}
#background #food .food-info > ul > li {
	display: block;
	font-size: 14px;
	line-height: 1em;
	padding: 0.3em 0.6em;
	margin-left: 10px;
	color: #00398f;
	border: 1px solid #00398f;
}
#background #food .food-info > ul > li:first-child {
	margin-left: 0;
}

/** 小さい画面用分岐 **/
@media screen and (max-width: 910px) {
	#background #food .food-info > h4 {
		font-size: 20px;
	}
	#background #food .food-info > h4 > small {
		font-size: 14px;
	}
	#background #food .food-info > ul > li {
		font-size: 12px;
	}
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background #food .food-info > h4 {
		margin-bottom: 16px;
	}
	#background #food .food-info > p {
		margin-bottom: 16px;
	}
	#background #food .food-info > ul {
		margin: 0;
	}
}

/*===========================================================================
-----------------------------------------------------------------------------
  土産設定　ここから
-----------------------------------------------------------------------------
===========================================================================*/
#background #souvenir {
	background: #f0f3f7;
	padding: 80px 0 96px;
	margin-bottom: 80px;
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background #souvenir {
		padding: 40px 0 48px;
		margin-bottom: 40px;
	}
}

/*------------------------------------
  ふたつ 設定　ここから
-------------------------------------*/
#background #souvenir section.photo-set2 {
	display: flex;
	margin-bottom: 56px;
}
#background #souvenir section.photo-set2 > figure {
	position: relative;
	overflow: hidden;
	width: 50%;
}
#background #souvenir section.photo-set2 > figure:before {
	content: "";
	visibility: visible;
	display: block;
	width: 50%;
	height: calc(100% + 3px);
	background: url(./images/mask-right-blue.svg) no-repeat 100% 100%;
	background-size: contain;
	position: absolute;
	top: -1px;
	right: -1px;
	z-index: 10;
}
#background #souvenir section.photo-set2 > figure:nth-of-type(2n):before {
	background: url(./images/mask-left-blue.svg) no-repeat 0 0;
	background-size: contain;
	right: auto;
	left: -1px;
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background #souvenir section.photo-set2 {
		width: 90vw;
		margin: 0 auto 4vw;
	}
}
/*------------------------------------
  みっつ 設定　ここから
-------------------------------------*/
#background #souvenir section.photo-set3 {
	display: flex;
}
#background #souvenir section.photo-set3 > figure {
	position: relative;
	overflow: hidden;
	width: 33.333%;
}
#background #souvenir section.photo-set3 > figure:before ,
#background #souvenir section.photo-set3 > figure:after {
	content: "";
	visibility: visible;
	display: block;
	width: 50%;
	height: calc(100% + 3px);
	background: url(./images/mask-left-blue.svg) no-repeat 0 0;
	background-size: contain;
	transform: rotateX(180deg);
	position: absolute;
	left: -1px;
	top: -1px;
	z-index: 10;
}
#background #souvenir section.photo-set3 > figure:after {
	background: url(./images/mask-right-blue.svg) no-repeat 100% 100%;
	background-size: contain;
	left: auto;
	right: -1px;
}
#background #souvenir section.photo-set3 > figure:first-child:before ,
#background #souvenir section.photo-set3 > figure:last-child:after {
	display: none;
}

/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background #souvenir section.photo-set3 {
		width: 90vw;
	}
}

/*===========================================================================
-----------------------------------------------------------------------------
  季節設定　ここから
-----------------------------------------------------------------------------
===========================================================================*/
#background .season-sight {
	margin-bottom: 96px;
}
#background .season-sight section {
	position: relative;
	width: 100%;
	max-width: initial;
	max-width: auto;
	display: flex;
	justify-content: center;
	align-items:center;
}
#background .season-sight section > figure {
	position: relative;
	overflow: hidden;
	width: 52.3426%;
	order: 1;
}
#background .season-sight section > figure:before {
	content: "";
	visibility: visible;
	display: block;
	width: 50%;
	height: calc(100% + 3px);
	background: url(./images/mask-left.svg) no-repeat 0 0;
	background-size: contain;
	transform: rotateX(180deg);
	position: absolute;
	top: -1px;
	left: -1px;
	z-index: 10;
}
#background .season-sight section > .text-set {
	display: block;
	width: calc(42.6vw - 20px);
	max-width: 550px;
	margin: auto 0 auto auto;
	padding: 0 55px 0 35px;
	order: 0;
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background .season-sight {
		margin-bottom: 8px;
	}
	#background .season-sight section {
		width: 100%;
		display: block;
		padding-bottom: 40px;
	}
	#background .season-sight section > figure {
		width: 100%;
		margin: 0 0 24px;
	}
	#background .season-sight section > figure:before {
		display: none;
	}
	#background .season-sight section > .text-set {
		display: block;
		width: 86vw;
		max-width: initial;
		max-width: auto;
		margin: 0 auto;
		padding: 0;
	}
}
/*-----------------------------------*/
#background .season-sight section:nth-of-type(2n) > figure {
	order: 0;
}
#background .season-sight section:nth-of-type(2n) > figure:before {
	background: url(./images/mask-right.svg) no-repeat 100% 100%;
	background-size: contain;
	transform: rotateX(0deg);
	left: auto;
	right: -1px;
}
#background .season-sight section:nth-of-type(2n) > .text-set {
	margin: auto auto auto 0;
	padding: 0 35px 0 55px;
	order: 1;
}
/** 小さい画面用分岐 **/
@media screen and (max-width: 920px) {
	#background .season-sight section > .text-set {
		padding: 0 20px 0 0;
	}
	#background .season-sight section:nth-of-type(2n) > .text-set {
		padding: 0 0 0 20px;
	}
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background .season-sight section:nth-of-type(2n) > .text-set {
		margin: 0 auto;
		padding: 0;
	}
}
/*------------------------------------
  中身 設定　ここから
-------------------------------------*/
#background .season-sight .text-set h4 {
	font-family: 'Noto Serif JP', serif;
	font-size: 32px;
	font-weight: 900;
	line-height: 1.2em;
	margin-bottom: 32px;
}
#background .season-sight .text-set p {
	line-height: 2.1em;
}

/** 小さい画面用分岐 **/
@media screen and (max-width: 1080px) {
	#background .season-sight .text-set h4 {
		font-size: 24px;
	}
	#background .season-sight .text-set p {
		line-height: 1.8em;
		font-size: 14px;
	}
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background .season-sight .text-set h4 {
		font-size: 20px;
		margin-bottom: 16px;
	}
	#background .season-sight .text-set p {
		font-size: 16px;
	}
}
/*===========================================================================
-----------------------------------------------------------------------------
  遊び方 設定　ここから
-----------------------------------------------------------------------------
===========================================================================*/
#background #play {
	background: #f0f3f7;
	padding: 96px 0 96px;
	margin-bottom: 80px;
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background #play {
		padding: 48px 0 48px;
		margin-bottom: 40px;
	}
}

/*------------------------------------
  ふたつ 設定　ここから
-------------------------------------*/
#background #play section.photo-set2 {
	display: flex;
	flex-wrap: wrap;
}
#background #play section.photo-set2 h2 {
	margin: auto;
	width: 50%;
	text-align: center;
	font-size: 72px;
	line-height: 1.1em;
	font-weight: bold;
	font-family: 'Century Gothic', sans-serif;
	font-style: italic;
	letter-spacing: 0;
	white-space: nowrap;
	order: 1;
}
#background #play section.photo-set2 h2 small {
	display: block;
	padding-top: 30px;
	text-align: center;
	font-size: 20px;
	font-family: 'Noto Serif JP', serif;
	font-weight: 900;
	font-style: normal;
	line-height: 1em;
	letter-spacing: 0.5em;
}
/** 小さい画面用分岐 **/
@media screen and (max-width: 920px) {
#background #play section.photo-set2 h2 {
		white-space: normal;
		font-size: 50px;
	}
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background #play section.photo-set2 {
		display: block;
	}
	#background #play section.photo-set2 h2 {
		margin: 0 auto 24px;
		max-width: 100%;
		padding: 0;
		text-align: center;
		font-size: 40px;
		line-height: 1.1em;
		background: transparent;
	}
	#background #play section.photo-set2 h2 small {
		display: block;
		padding-top: 15px;
		font-size: 14px;
	}
}
/*-----------------------------------*/

#background #play section.photo-set2 > figure {
	position: relative;
	overflow: hidden;
	width: 50%;
	margin-top: 56px;
	order: 10;
}
#background #play section.photo-set2 > figure:first-of-type {
	margin-top: auto;
	order: 0;
}
#background #play section.photo-set2 > figure:before {
	content: "";
	visibility: visible;
	display: block;
	width: 50%;
	height: calc(100% + 3px);
	background: url(./images/mask-right-blue.svg) no-repeat 100% 100%;
	background-size: contain;
	position: absolute;
	top: -1px;
	right: -1px;
	z-index: 10;
}
#background #play section.photo-set2 > figure:nth-of-type(3):before ,
#background #play section.photo-set2 > figure:nth-of-type(5):before {
	background: url(./images/mask-left-blue.svg) no-repeat 0 0;
	background-size: contain;
	right: auto;
	left: -1px;
}
#background #play section.photo-set2 > figure:first-of-type:before ,
#background #play section.photo-set2 > figure:nth-of-type(4):before ,
#background #play section.photo-set2 > figure:nth-of-type(5):before {
	transform: rotateX(180deg);
}
#background #play section.photo-set2 > figure:after {
	content: "";
	visibility: visible;
	display: block;
	width: 100%;
	height: 100%;
	background: #000;
	position: absolute;
	left: 0;
	top: 0;
	filter: Alpha(opacity=30);
	opacity: 0.3;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
#background #play section.photo-set2 > figure:hover:after {
	filter: Alpha(opacity=60);
	opacity: 0.6;
}
#background #play section.photo-set2 > figure > a {
	display: flex;
	justify-content: center;
	align-items:center;
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 20;
	color: #fff;
	filter: Alpha(opacity=100);
	opacity: 1;
	filter:drop-shadow(0 0 5px rgba(0, 0, 0, 0.4));
	font-size: 20px;
	font-family: 'Noto Serif JP', serif;
	font-weight: 900;
	line-height: 1em;
}
#background #play section.photo-set2 > figure > a small {
	display: block;
	padding: 30px 0 0 0;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 16px;
	font-weight: 700;
	line-height: 32px;
	text-align: center;
	vertical-align: center;
}
#background #play section.photo-set2 > figure > a small:after {
	content: "";
	visibility: visible;
	display: inline-block;
	width: 32px;
	height: 32px;
	background: url(./images/icon-link.svg) no-repeat 50% 50%;
	background-size: contain;
	margin: auto auto -10px 10px;
}
#background #play section.photo-set2 > figure > a.pdf small:after {
	background-image: url(./images/icon-pdf.svg);
}

/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background #play section.photo-set2 > figure {
		width: 100%;
		margin-top: 16px;
		background: #fff;
	}
	#background #play section.photo-set2 > figure:first-of-type {
		margin-top: auto;
		order: 0;
	}
	#background #play section.photo-set2 > figure img {
		width: 34%;
	}
	#background #play section.photo-set2 > figure:before {
		background: url(./images/mask-right.svg) no-repeat 100% 100%;
		background-size: contain;
		right: calc(66% - 1px);
	}
	#background #play section.photo-set2 > figure:nth-of-type(3):before ,
	#background #play section.photo-set2 > figure:nth-of-type(5):before {
		background: url(./images/mask-right.svg) no-repeat 100% 100%;
		background-size: contain;
		transform: rotateX(180deg);
		right: calc(66% - 1px);
		left: auto;
	}
	#background #play section.photo-set2 > figure:first-of-type:before ,
	#background #play section.photo-set2 > figure:nth-of-type(5):before {
		transform: rotateX(180deg);
	}
	#background #play section.photo-set2 > figure:nth-of-type(4):before {
		transform: rotateX(0deg);
	}
	#background #play section.photo-set2 > figure:after {
		background: transparent;
	}
	#background #play section.photo-set2 > figure > a {
		color: #2a2a2a;
		filter: none;
		font-size: 14px;
		padding-left: 34%;
	}
	#background #play section.photo-set2 > figure > a small {
		padding: 5px 0 0 0;
		font-size: 12px;
		line-height: 20px;
	}
	#background #play section.photo-set2 > figure > a small:after {
		width: 16px;
		height: 16px;
		background-image: url(./images/icon-link-black.svg);
		margin-bottom: -5px;
	}
	#background #play section.photo-set2 > figure > a.pdf small:after {
		background-image: url(./images/icon-pdf-black.svg);
	}
}
/*===========================================================================
-----------------------------------------------------------------------------
  アクセス設定　ここから
-----------------------------------------------------------------------------
===========================================================================*/
#background #access .title-set p strong {
	font-size: 20px;
}
#background #access .map > iframe {
	width: 100%;
	height: 480px;
	margin-bottom: 96px;
}

/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background #access .title-set p strong {
		font-size: 16px;
	}
	#background #access .map > iframe {
		width: 90vw;
		height: 100vw;
		margin: 0 -2vw 48px;
	}
}

/*===========================================================================
-----------------------------------------------------------------------------
  お問い合わせ 設定　ここから
-----------------------------------------------------------------------------
===========================================================================*/
#background #contact {
	margin: 56px auto 96px;
}
#background #contact section.table-set {
	max-width: 800px;
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background #contact {
		margin: 28px auto 48px;
	}
	#background #contact section.table-set {
		max-width: initial;
		max-width: auto;
	}
}
/*------------------------------------
  テーブル設定　ここから
-------------------------------------*/
#background #contact .table-set table {
	margin-bottom: 56px;
	width: 100%;
}
#background #contact .table-set table th {
	position: relative;
	width: 250px;
	padding: 32px 100px 32px 0;
	font-family: 'Noto Serif JP', serif;
	font-weight: 900;
	line-height: 2em;
}
#background #contact .table-set table th > span {
	display: block;
	background: #2a2a2a;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 14px;
	line-height: 1em;
	font-weight: 400;
	color: #fff;
	padding: 0.2em 0.8em 0.3em;
	position: absolute;
	right: 30px;
	top: 37.5px;/*
	top: calc(16px - 10.5px + 32px);*/
}
#background #contact .table-set table th:before {
	content: "";
	display: block;
	width: 25px;
	height: 25px;
	background: url(./images/border-slash-mini.svg) no-repeat 50% 50%;
	background-size: contain;
	position: absolute;
	top: calc(1em + 19.5px);
	right: -12.5px;
}
#background #contact .table-set table td {
	padding: 32px 0 32px 40px;
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background #contact .table-set table {
		margin-bottom: 28px;
	}
	#background #contact .table-set table th {
		display: block;
		width: 100%;
		padding: 16px 100px 16px 0;
		line-height: 1em;
	}
	#background #contact .table-set table th > span {
		right: 0;
		top: 13.5px;/*
		top: calc(8px - 10.5px + 16px);*/
	}
	#background #contact .table-set table th:before {
		display: none;
	}
	#background #contact .table-set table td {
		display: block;
		padding: 0 0 16px;
	}
}

/*-----------------------------------*/
#background #contact .table-set input[type="text"] {
	border: 1px solid #ccc;
	border-radius: 4px;
	padding: 0 0.5em;
	line-height: calc(2em - 2px);
	box-sizing: border-box;
	width: 280px;
}
#background #contact .table-set select {
	border: 1px solid #ccc;
	outline: none;
	background: #fff;
	border-radius: 4px;
	padding: 0 0.5em;
	line-height: calc(2em - 2px);
	height: 2em;
	box-sizing: border-box;
}
#background #contact .table-set input.long {
	width: 100%;
}
#background #contact .table-set textarea {
	border: 1px solid #ccc;
	border-radius: 4px;
	padding: 0 0.5em;
	line-height: 2em;
	width: 100%;
	height: calc(8em + 2px);
}
#background #contact .table-set label {
	display: block;
}
#background #contact .table-set label + label {
	margin-top: 10px;
}
#background #contact .table-set em.error {
	color: #c00;
	display: block;
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background #contact .table-set input[type="text"] {
		width: 100%;
	}
}
/*------------------------------------
  個人情報 設定　ここから
-------------------------------------*/
#background #contact #privacy {
	border: 1px solid #ccc;
	border-radius: 4px;
	padding: 40px;
	width: 100%;
	height: calc(12em + 42px);
	overflow-y: scroll;
	margin-bottom: 56px;
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background #contact #privacy {
		padding: 16px;
		margin-bottom: 32px;
	}
}
/*-----------------------------------*/
#background #contact #privacy h3 {
	font-family: 'Noto Serif JP', serif;
	font-weight: 900;
	font-size: 24px;
	line-height: 1.2em;
	margin-bottom: 32px;
}
#background #contact #privacy h4 {
	font-family: 'Noto Serif JP', serif;
	font-weight: 900;
	font-size: 18px;
	line-height: 1.2em;
	margin-bottom: 16px;
}
#background #contact #privacy p + h4 ,
#background #contact #privacy ul + h4 ,
#background #contact #privacy ol + h4 ,
#background #contact #privacy hr + h4 {
	margin-top: 32px;
}
#background #contact #privacy hr {
	border: none;
	outline: none;
	border-bottom: 1px solid #ccc;
	margin-top: 32px;
}
#background #contact #privacy p {
	margin-bottom: 16px;
}
#background #contact #privacy ul ,
#background #contact #privacy ol {
	margin: 0 0 8px 20px;
}
#background #contact #privacy ul li {
	margin-bottom: 8px;
	list-style-type: disc;
}
#background #contact #privacy ol li {
	list-style-type: decimal;
	margin-bottom: 8px;
}
#background #contact #privacy p.sing {
	margin-bottom: 0;
	text-align: right;
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background #contact #privacy h3 {
		font-size: 18px;
		margin-bottom: 16px;
	}
	#background #contact #privacy h4 {
		font-size: 14px;
		margin-bottom: 8px;
	}
	#background #contact #privacy p + h4 ,
	#background #contact #privacy ul + h4 ,
	#background #contact #privacy ol + h4 ,
	#background #contact #privacy hr + h4 {
		margin-top: 16px;
	}
	#background #contact #privacy hr {
		margin-top: 16px;
	}
	#background #contact #privacy p {
		margin-bottom: 8px;
		font-size: 14px;
	}
	#background #contact #privacy ul ,
	#background #contact #privacy ol {
		margin: 0 0 4px 20px;
		font-size: 14px;
	}
	#background #contact #privacy ul li {
		margin-bottom: 4px;
		list-style-type: disc;
	}
	#background #contact #privacy ol li {
		list-style-type: decimal;
		margin-bottom: 4px;
	}
}
/*------------------------------------
  フォームコントロール設定　ここから
-------------------------------------*/
#background #contact ul.control {
	margin-bottom: 0;
	display: flex;
	justify-content: center;
}
#background #contact ul.control li {
	margin: auto 20px;
}
#background #contact ul.control li a {
	display: inline-block;
}
#background #contact ul.control li a ,
#background #contact ul.control li button {
	font-family: 'Noto Serif JP', serif;
	font-weight: 900;
	border: none;
	outline: none;
	background: #2a2a2a;
	border: 1px solid #2a2a2a;
	color: #fff;
	font-size: 20px;
	padding: 0.5em 2em;
	border-radius: 8px;
}
#background #contact ul.control li a.back ,
#background #contact ul.control li button.back {
	background: #fff;
	color: #2a2a2a;
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
	#background #contact ul.control li {
		margin: auto 10px;
	}
	#background #contact ul.control li a ,
	#background #contact ul.control li button {
		font-size: 16px;
		padding: 0.5em 1em;
		border-radius: 4px;
	}
}



/*===========================================================================

  設定　ここから

===========================================================================*/

/*-----------------------------------*/

/** 小さい画面用分岐 **/
@media screen and (max-width: 1200px) {
}
/** スマートフォン用分岐 **/
@media screen and (max-width: 740px) {
}
/*------------------------------------
  設定　ここから
-------------------------------------*/