/* =============================================
　　root
============================================= */

:root {

	--color-primary:#84021a;
	--color-secondary:#bc882e;
	--color-accent:#273f1b;
	--color-base:#ffe7c5;

	--color-show-events:#ffe7c5;
	--color-show-events-secondary:#273f1b;

	--color-fireworks:#84021a;
	--color-fireworks-secondary:#d4145a;

	--color-illumination:#1a0638;
	--color-illumination-secondary:#4f2f7c;
		
	--color-gourmet:#fbb03b;
	--color-gourmet-secondary:#f7931e;
	
	--section-category-font-size: clamp(1.6rem, 1.114rem + 1.43vw, 2.4rem);
	
	--highlights-color:#b6232a;
	--highlights-color-secondary:#bc882e;
	
	--highlights-font-size-title: clamp(1.8rem, 1.114rem + 1.43vw, 2.8rem);
	--highlights-font-size-name:clamp(2.4rem, 1.457rem + 2.38vw, 3.6rem);
 	--highlights-font-size-text:clamp(1.4rem, 1.171rem + 0.48vw, 1.6rem);


	--spot-font-size-title: clamp(2.1rem, 1.114rem + 1.43vw, 2.8rem);
	--spot-font-size-name:clamp(3rem, 1.457rem + 2.38vw, 3.6rem);
 	--spot-font-size-text:clamp(1.4rem, 1.171rem + 0.48vw, 1.6rem);

	--xmas-font-size-headding: clamp(2.6rem, 1.457rem + 2.38vw, 3.6rem);
}


/* =============================================
　　swiper
============================================= */


.swiper {
  width: 100%;
  min-width: 0;
}

.swiper-slide {
  min-width: 0;
  display: flex;
  height: auto;
}
.swiper-wrapper {
  display: flex !important;
   justify-content: flex-start;
   height: auto;
}


.swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction {
	position: relative;
	margin-top: 4rem;
	bottom:0;
	top:0;
}
.swiper-pagination-bullet-active {
  opacity: var(--swiper-pagination-bullet-opacity, 1);
  background: var(--color-black);
}
.swiper-pagination-bullet {
  width:10px;
  height:10px;
  display: inline-block;
}

.swiper-button-next, .swiper-button-prev {
  position: absolute;
  width: auto;
  height: auto;
}
.swiper-button-next:after, .swiper-button-prev:after {
	content: "";
	mask-repeat: no-repeat;
	mask-position: center;
	mask-size: contain;
	background-color:#000;
	background-repeat: no-repeat;
	background-position: center;
	width: 50px;
	height:50px;
	display: block;
	mask-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_2%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC%202%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20157.58%20157.58%22%3E%20%3Cg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1-2%22%20data-name%3D%22%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC%201%22%3E%20%3Cpath%20d%3D%22M78.79%2C0C35.27%2C0%2C0%2C35.27%2C0%2C78.79s35.27%2C78.79%2C78.79%2C78.79%2C78.79-35.27%2C78.79-78.79S122.3%2C0%2C78.79%2C0ZM67.88%2C111.24l-2.63-2.63%2C29.81-29.81-29.81-29.81%2C2.63-2.63%2C32.45%2C32.45-32.45%2C32.45Z%22%2F%3E%20%3C%2Fg%3E%3C%2Fsvg%3E');
}

.swiper-button-prev:after {
  transform: rotate(180deg);
}
.js-swiper-loop .swiper-wrapper {
  transition-timing-function: linear;
}


/* =============================================
　　text-
============================================= */


.text-heading{
  font-size: var(--xmas-font-size-headding);
  text-align: center;
  font-weight: 300;
}
.text-read{
  font-size: var(--font-size-read);
  font-weight: 500;
}

.text-base{
  font-size: var(--font-size-base);
  font-weight: 500;
}
.text-2xl{
  font-size: var(--font-size-2xl);
}
.text-xl{
  font-size: var(--font-size-xl);
}
.text-lg{
  font-size: var(--font-size-lg);
}
.text-md{
  font-size: var(--font-size-md);
}
.text-sm{
  font-size: var(--font-size-sm);
}
.text-xs{
  font-size: var(--font-size-xs);
}
.text-xxs{
  font-size: var(--font-size-xxs);
}

[class^="text-"] small {
  font-size:70%;
}

/* =============================================
　　.align-
============================================= */

.align-c{
text-align: var(--align-center);
}
.align-c-sp{
text-align: var(--align-center-sp);
}
.align-l{
text-align: var(--align-left);
}
.align-l-sp{
text-align: var(--align-left-sp);
}
.align-r{
text-align: var(--align-right);
}
.align-r-sp{
text-align: var(--align-right-sp);
}

/* =============================================
　　.section
============================================= */

#xsmas main{
	font-family: var(--font-family-Zen-Mi);
}


  /* アニメーションさせたい要素の基本スタイル */
  .fade-in-up {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
  }
  .fade-in-up.active {
    opacity: 1;
    transform: translateY(0);
  }



 /* アニメーションの定義 */
  @keyframes riseUp {
    /* 開始時（下から、透明な状態） */
    from {
      opacity: 0;
      transform: translateY(30px);
    }
    /* 終了時（定位置で、不透明な状態） */
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }


article {
  position: relative;
}

.c-section{
	max-width: 100%;
	position: relative;
	padding:var(--layout-space-section) 0 calc(var(--layout-space-section));
	position: relative;
	z-index: 1;
}

.section-category {
	background: var(--color-gourmet-secondary);
	background: #000;
	color: #fff;
	width:var(--layout-space-base-horizontal);
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.section-category > h2 {
	position: sticky;
	top: 85px;
	writing-mode: vertical-rl;
	line-height: 100%;
	background: rgb(0 0 0 / 30%);
	padding: 2.4rem;
	padding-left: 0;
	padding-right: 0;
	display: flex;
	align-items: center;
	width: 100%;
	font-size: var(--section-category-font-size);
}

.c-section__body{
	position: relative;
	padding:0 var(--layout-space-base-horizontal);
}

.c-section__inner{
	position: relative;
	margin: 0 auto;
	width: 100%;
}
.c-section__inner.wide{
	position: relative;
	padding:0rem;
}

.c-section__contents{
	position: relative;
	display: grid;
	align-items: start;
	justify-content: center;
	justify-items: center;
	gap:var(--layout-space-base-vrtical);
}




.contents__inner {
  display: grid;
  gap: 2rem;
  justify-content: center;
  justify-items: center;
}

.img {
	position: relative;
	height: 100%;
	display: flex;
	flex-direction: column;
}
figure{
	position: relative;
	display: flex;
	height: 100%;
}
figure figcaption{
  position: absolute;
  bottom: 5px;
  right: 5px;
  color: #fff;
  font-family: var(--font-family-Zen-Go);
  font-weight: 600;
  font-size: 12px;
}
figure figcaption[data-color="black"]{
  color: #000;
}
figure figcaption img{
  aspect-ratio: auto !important;
  width: 80px;
}

.spot {
  display: grid;
  gap: 2.4em;
}

.spot .spot-inner {
  display: grid;
  gap: 1.6em;
    position: relative;
}
.spot-img {
  position: relative;
  overflow: hidden;
  height: 100%;
}
.spot-img img{
  aspect-ratio: 4 / 3;
}

.spot-item {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  justify-content: flex-start;
  height: auto;
  transition: 0.6s all;
  position: relative;
  gap: 1.6em;
}
.spot-item .txt {
  padding: 0 calc(5% / 1);
  display: flex;
  gap: 1.6rem;
  position: relative;
  align-items: center;
  align-content: space-between;
  flex-direction: column;
  justify-content: flex-start;
  color: #fff;
}

.spot-item .txt p.title {
	font-size: var(--spot-font-size-title);
	font-weight: 500;
	text-align: center;
}
.spot-item .txt p.name {
  border-bottom: 1px solid;
  font-size: var(--spot-font-size-name);
}
.spot-item .txt p {
	font-size: var(--spot-font-size-text);
}

.spot-item .btn {
	max-width: 320px;
	margin: 0 auto;
	font-size: var(--spot-font-size-text);
}

.detail dl{
	display: grid;
	justify-content: flex-start;
	align-items: start;
	margin: 10px auto;
	position: relative;
	gap: 10px;
	grid-template-columns:auto 1fr;
	width: 100%;
	font-size: var(--spot-font-size-text);
}
.detail dl dt{
	width: 100px;
	display: block;
	background: #000;
	color: #fff;
	border-radius: 5px;
	margin-right: 10px;
	padding: 3px 10px;
	line-height: 1.2;
	text-align: center;
}


.icon-check:before{
	content: "Check!";
	position: absolute;
	background: #FFC107;
	color: #fff;
	width: 70px;
	height: 70px;
	top: -10px;
	right: -10px;
	z-index: 2;
	border-radius: 999px;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
}
.icon-circle {
	position: absolute;
	display: flex;
	flex-direction: column;
	color: #fff;
	z-index: 2;
	width: 70px;
	height: 70px;
	align-content: center;
	justify-content: center;
	border-radius: 9999px;
	overflow: hidden;
	background: #cea428;
	top: -70px;
	right: 15px;
}
.icon-circle p{
  position: relative;
  text-align: center;
  color: #fff;
  line-height: 120%;
}
.icon-circle p em{
  font-size:140%;
}

.icon-line:before {
	content: "";
	width: 100%;
	height: 30px;
	display: block;
	-webkit-mask-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='_レイヤー_2' data-name='レイヤー 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 182.58 18.56'%3E%3Cg id='_レイヤー_1-2' data-name='レイヤー 1'%3E%3Cg%3E%3Cpath d='M61.97,7.89c0,.52-1.36.94-3.04.94S0,8.59,0,8.07s57.25-1.13,58.93-1.13,3.04.42,3.04.94Z' style='fill: %23ffe7c5;'/%3E%3Cpath d='M120.61,7.89c0-.52,1.36-.94,3.04-.94s58.93.23,58.93.75-57.25,1.13-58.93,1.13-3.04-.42-3.04-.94Z' style='fill: %23ffe7c5;'/%3E%3Cg%3E%3Cpath d='M73.59,9.87c-.6.01-1.19.04-1.79.18.6.13,1.19.16,1.79.17,0,.77.04,1.54.18,2.31.13-.77.17-1.54.18-2.31.6-.01,1.19-.05,1.79-.17-.6-.13-1.19-.16-1.79-.17-.01-.77-.04-1.54-.18-2.31-.13.77-.17,1.54-.18,2.31Z' style='fill: %23ffe7c5;'/%3E%3Cpath d='M77.78,6.92c-.48,0-.95.04-1.43.14.48.1.95.13,1.43.14,0,.61.03,1.23.14,1.84.11-.61.13-1.23.14-1.84.48,0,.95-.04,1.43-.14-.48-.1-.95-.13-1.43-.14,0-.61-.04-1.23-.14-1.84-.11.61-.13,1.23-.14,1.84Z' style='fill: %23ffe7c5;'/%3E%3Cpath d='M67.85,7.05c-.6.01-1.19.04-1.79.18.6.13,1.19.16,1.79.17,0,.77.04,1.54.18,2.31.13-.77.17-1.54.18-2.31.6-.01,1.19-.05,1.79-.17-.6-.13-1.19-.16-1.79-.17-.01-.77-.04-1.54-.18-2.31-.13.77-.17,1.54-.18,2.31Z' style='fill: %23ffe7c5;'/%3E%3Cpath d='M112.32,10.98c-.6.01-1.19.04-1.79.18.6.13,1.19.16,1.79.17,0,.77.04,1.54.18,2.31.13-.77.17-1.54.18-2.31.6-.01,1.19-.05,1.79-.17-.6-.13-1.19-.16-1.79-.17-.01-.77-.04-1.54-.18-2.31-.13.77-.17,1.54-.18,2.31Z' style='fill: %23ffe7c5;'/%3E%3Cpath d='M116.07,5.28c-.6.01-1.19.05-1.79.18.6.13,1.19.16,1.79.18,0,.77.04,1.54.18,2.31.13-.77.17-1.54.18-2.31.6-.01,1.19-.05,1.79-.17-.6-.13-1.19-.16-1.79-.17-.01-.77-.04-1.54-.18-2.31-.13.77-.17,1.54-.18,2.31Z' style='fill: %23ffe7c5;'/%3E%3Cpath d='M104.84,2.92c-.39,0-.77.03-1.16.11.39.08.77.11,1.16.11,0,.5.03,1,.11,1.49.09-.5.11-1,.11-1.49.39,0,.77-.03,1.16-.11-.39-.08-.77-.11-1.16-.11,0-.5-.03-1-.11-1.49-.09.5-.11,1-.11,1.49Z' style='fill: %23ffe7c5;'/%3E%3Cpath d='M102.63,9.56c-.39,0-.77.03-1.16.11.39.08.77.11,1.16.11,0,.5.03,1,.11,1.49.09-.5.11-1,.11-1.49.39,0,.77-.03,1.16-.11-.39-.08-.77-.11-1.16-.11,0-.5-.03-1-.11-1.49-.09.5-.11,1-.11,1.49Z' style='fill: %23ffe7c5;'/%3E%3Cpath d='M108.16,7.34c-.39,0-.77.03-1.16.11.39.08.77.11,1.16.11,0,.5.03,1,.11,1.49.09-.5.11-1,.11-1.49.39,0,.77-.03,1.16-.11-.39-.08-.77-.11-1.16-.11,0-.5-.03-1-.11-1.49-.09.5-.11,1-.11,1.49Z' style='fill: %23ffe7c5;'/%3E%3Cpath d='M98.89,4.72c-1.12.02-2.24.08-3.36.33,1.12.24,2.24.31,3.36.33.02,1.45.08,2.89.33,4.34.25-1.45.31-2.89.33-4.34,1.12-.02,2.24-.09,3.36-.33-1.12-.24-2.24-.31-3.36-.33-.02-1.45-.08-2.89-.33-4.34-.25,1.45-.31,2.89-.33,4.34Z' style='fill: %23ffe7c5;'/%3E%3Cpath d='M79.28,11.43c-.86.02-1.71.06-2.57.25.86.19,1.71.24,2.57.25.01,1.1.06,2.21.25,3.31.19-1.1.24-2.21.25-3.31.86-.02,1.71-.07,2.57-.25-.86-.19-1.71-.23-2.57-.25-.02-1.1-.06-2.21-.25-3.31-.19,1.1-.24,2.21-.25,3.31Z' style='fill: %23ffe7c5;'/%3E%3Cpath d='M88.98,8.92c-2.28.02-4.55.1-6.83.36,2.28.26,4.55.34,6.83.36-1.21,1.25-1.77,1.98-2.63,3.12,1.14-.85,1.87-1.42,3.12-2.63.02,1.26.03,2.53.07,3.79.06,1.55.13,3.09.28,4.64.15-1.55.22-3.09.28-4.64.05-1.26.06-2.53.07-3.79,1.25,1.21,1.98,1.78,3.12,2.63-.85-1.14-1.42-1.87-2.63-3.12,2.28-.02,4.55-.1,6.83-.36-2.28-.26-4.55-.34-6.83-.36,1.21-1.25,1.77-1.98,2.63-3.12-1.14.85-1.87,1.42-3.12,2.63-.02-1.26-.02-2.53-.07-3.8-.06-1.55-.13-3.09-.28-4.64-.15,1.55-.22,3.09-.28,4.64-.05,1.26-.06,2.53-.07,3.79-1.25-1.21-1.98-1.78-3.12-2.63.85,1.14,1.42,1.87,2.63,3.12Z' style='fill: %23ffe7c5;'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='_レイヤー_2' data-name='レイヤー 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 182.58 18.56'%3E%3Cg id='_レイヤー_1-2' data-name='レイヤー 1'%3E%3Cg%3E%3Cpath d='M61.97,7.89c0,.52-1.36.94-3.04.94S0,8.59,0,8.07s57.25-1.13,58.93-1.13,3.04.42,3.04.94Z' style='fill: %23ffe7c5;'/%3E%3Cpath d='M120.61,7.89c0-.52,1.36-.94,3.04-.94s58.93.23,58.93.75-57.25,1.13-58.93,1.13-3.04-.42-3.04-.94Z' style='fill: %23ffe7c5;'/%3E%3Cg%3E%3Cpath d='M73.59,9.87c-.6.01-1.19.04-1.79.18.6.13,1.19.16,1.79.17,0,.77.04,1.54.18,2.31.13-.77.17-1.54.18-2.31.6-.01,1.19-.05,1.79-.17-.6-.13-1.19-.16-1.79-.17-.01-.77-.04-1.54-.18-2.31-.13.77-.17,1.54-.18,2.31Z' style='fill: %23ffe7c5;'/%3E%3Cpath d='M77.78,6.92c-.48,0-.95.04-1.43.14.48.1.95.13,1.43.14,0,.61.03,1.23.14,1.84.11-.61.13-1.23.14-1.84.48,0,.95-.04,1.43-.14-.48-.1-.95-.13-1.43-.14,0-.61-.04-1.23-.14-1.84-.11.61-.13,1.23-.14,1.84Z' style='fill: %23ffe7c5;'/%3E%3Cpath d='M67.85,7.05c-.6.01-1.19.04-1.79.18.6.13,1.19.16,1.79.17,0,.77.04,1.54.18,2.31.13-.77.17-1.54.18-2.31.6-.01,1.19-.05,1.79-.17-.6-.13-1.19-.16-1.79-.17-.01-.77-.04-1.54-.18-2.31-.13.77-.17,1.54-.18,2.31Z' style='fill: %23ffe7c5;'/%3E%3Cpath d='M112.32,10.98c-.6.01-1.19.04-1.79.18.6.13,1.19.16,1.79.17,0,.77.04,1.54.18,2.31.13-.77.17-1.54.18-2.31.6-.01,1.19-.05,1.79-.17-.6-.13-1.19-.16-1.79-.17-.01-.77-.04-1.54-.18-2.31-.13.77-.17,1.54-.18,2.31Z' style='fill: %23ffe7c5;'/%3E%3Cpath d='M116.07,5.28c-.6.01-1.19.05-1.79.18.6.13,1.19.16,1.79.18,0,.77.04,1.54.18,2.31.13-.77.17-1.54.18-2.31.6-.01,1.19-.05,1.79-.17-.6-.13-1.19-.16-1.79-.17-.01-.77-.04-1.54-.18-2.31-.13.77-.17,1.54-.18,2.31Z' style='fill: %23ffe7c5;'/%3E%3Cpath d='M104.84,2.92c-.39,0-.77.03-1.16.11.39.08.77.11,1.16.11,0,.5.03,1,.11,1.49.09-.5.11-1,.11-1.49.39,0,.77-.03,1.16-.11-.39-.08-.77-.11-1.16-.11,0-.5-.03-1-.11-1.49-.09.5-.11,1-.11,1.49Z' style='fill: %23ffe7c5;'/%3E%3Cpath d='M102.63,9.56c-.39,0-.77.03-1.16.11.39.08.77.11,1.16.11,0,.5.03,1,.11,1.49.09-.5.11-1,.11-1.49.39,0,.77-.03,1.16-.11-.39-.08-.77-.11-1.16-.11,0-.5-.03-1-.11-1.49-.09.5-.11,1-.11,1.49Z' style='fill: %23ffe7c5;'/%3E%3Cpath d='M108.16,7.34c-.39,0-.77.03-1.16.11.39.08.77.11,1.16.11,0,.5.03,1,.11,1.49.09-.5.11-1,.11-1.49.39,0,.77-.03,1.16-.11-.39-.08-.77-.11-1.16-.11,0-.5-.03-1-.11-1.49-.09.5-.11,1-.11,1.49Z' style='fill: %23ffe7c5;'/%3E%3Cpath d='M98.89,4.72c-1.12.02-2.24.08-3.36.33,1.12.24,2.24.31,3.36.33.02,1.45.08,2.89.33,4.34.25-1.45.31-2.89.33-4.34,1.12-.02,2.24-.09,3.36-.33-1.12-.24-2.24-.31-3.36-.33-.02-1.45-.08-2.89-.33-4.34-.25,1.45-.31,2.89-.33,4.34Z' style='fill: %23ffe7c5;'/%3E%3Cpath d='M79.28,11.43c-.86.02-1.71.06-2.57.25.86.19,1.71.24,2.57.25.01,1.1.06,2.21.25,3.31.19-1.1.24-2.21.25-3.31.86-.02,1.71-.07,2.57-.25-.86-.19-1.71-.23-2.57-.25-.02-1.1-.06-2.21-.25-3.31-.19,1.1-.24,2.21-.25,3.31Z' style='fill: %23ffe7c5;'/%3E%3Cpath d='M88.98,8.92c-2.28.02-4.55.1-6.83.36,2.28.26,4.55.34,6.83.36-1.21,1.25-1.77,1.98-2.63,3.12,1.14-.85,1.87-1.42,3.12-2.63.02,1.26.03,2.53.07,3.79.06,1.55.13,3.09.28,4.64.15-1.55.22-3.09.28-4.64.05-1.26.06-2.53.07-3.79,1.25,1.21,1.98,1.78,3.12,2.63-.85-1.14-1.42-1.87-2.63-3.12,2.28-.02,4.55-.1,6.83-.36-2.28-.26-4.55-.34-6.83-.36,1.21-1.25,1.77-1.98,2.63-3.12-1.14.85-1.87,1.42-3.12,2.63-.02-1.26-.02-2.53-.07-3.8-.06-1.55-.13-3.09-.28-4.64-.15,1.55-.22,3.09-.28,4.64-.05,1.26-.06,2.53-.07,3.79-1.25-1.21-1.98-1.78-3.12-2.63.85,1.14,1.42,1.87,2.63,3.12Z' style='fill: %23ffe7c5;'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-position:center;
	mask-position:center;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	background-color:var(--color-base);
}


.link {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
}

@media screen and (min-width: 1025px) {
  .spot .spot-inner {
    gap: 2em;
    max-width: 1440px;
    grid-template-columns: 1.5fr 1fr;
    align-items: center;
  }
	.icon-circle {
	transform: scale(1.4);
	}

}



/* =============================================
　　article#fv
============================================= */

article#fv{
	position: relative;
}
article#fv:before {
  content: "";
  background:var(--color-primary);
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height:30%;
}

article#fv .c-section {
  padding:0;
}

article#fv .c-section__contents {
  position: relative;
  display: block;
}

article#fv img{
}

@media screen and (min-width: 1025px) {
	article#fv img {
	  aspect-ratio: 16 / 9;
	  aspect-ratio: 250 / 107;
	}
}

/* =============================================
　　article#term
============================================= */

article#term{
	position: relative;
	background: url(../img/index/term/bg.jpg);
	background-size: cover;
	background-position: center top;
}
article#term:before {
  content: "";
  background:var(--color-primary);
  background:var(--color-primary);
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height:30%;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #b6232a 100%);
}

article#term .c-section {
  z-index: 1;
}

article#term .c-section .logo {
  width: 80%;
  max-width: 480px;
}

article#term .c-section img {
}

article#term .c-section p.text {
  color:var(--color-primary);
  padding:0 var(--layout-space-base-vrtical);
  text-align: center;
  font-size: var(--font-size-md);
    max-width: 720px;
}


/* =============================================
　　article#highlights{
============================================= */

article#highlights{
	position: relative;
}
article#highlights:before {
  content: "";
  background:var(--highlights-color);
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height:100%;
}
article#highlights .img-bg {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
    overflow: hidden;
}
article#highlights .img-bg:before,
article#highlights .img-bg:after {
  content: "";
  background: url(../img/index/bg01.png);
  background-size: cover;
  background-repeat: repeat-x;
  background-position: top;
  position: absolute;
  width: 100%;
  height: 100%;
  display: block;
  top: 0;
  left: 0;
}
article#highlights .img-bg:after {
transform: rotate(180deg);
}



article#highlights .c-section {
  padding:0;
}
article#highlights .c-section__contents {
}

.highlights {
  display: grid;
}

.highlights .highlights-inner {
  position: relative;
	display: grid;
	gap: 1.6em;
	color:var(--color-base);
	background: var(--highlights-color-secondary);
	background: var(--highlights-color);
	padding: 8rem 0;
}
.highlights .highlights-inner:nth-child(even) {
	background: var(--highlights-color-secondary);
}
.highlights .highlights-inner:before {
	content: "";
	position: absolute;
	top: -40px;
	right: 0;
	left: 00;
	margin: 0 auto;
	width: 100%;
	height: 80px;
	-webkit-mask-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='_レイヤー_2' data-name='レイヤー 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 2.59 60.5'%3E%3Cg id='_レイヤー_1-2' data-name='レイヤー 1'%3E%3Cg%3E%3Ccircle cx='1.3' cy='.82' r='.82' style='fill: %23fff;'/%3E%3Cpath d='M1.3,4.76c-.48,0-.87-.39-.87-.87s.39-.87.87-.87.87.39.87.87-.39.87-.87.87Z' style='fill: %23fff;'/%3E%3Cpath d='M1.3,7.88c-.51,0-.92-.41-.92-.92s.41-.92.92-.92.92.41.92.92-.41.92-.92.92Z' style='fill: %23fff;'/%3E%3Cpath d='M1.3,11c-.54,0-.98-.44-.98-.98s.44-.98.98-.98.98.44.98.98-.44.98-.98.98Z' style='fill: %23fff;'/%3E%3Cpath d='M1.3,14.12c-.57,0-1.03-.46-1.03-1.03s.46-1.03,1.03-1.03,1.03.46,1.03,1.03-.46,1.03-1.03,1.03Z' style='fill: %23fff;'/%3E%3Cpath d='M1.3,17.25c-.6,0-1.08-.49-1.08-1.08s.49-1.08,1.08-1.08,1.08.49,1.08,1.08-.49,1.08-1.08,1.08Z' style='fill: %23fff;'/%3E%3Cpath d='M1.3,20.41c-.63,0-1.14-.51-1.14-1.14s.51-1.14,1.14-1.14,1.14.51,1.14,1.14-.51,1.14-1.14,1.14Z' style='fill: %23fff;'/%3E%3Ccircle cx='1.3' cy='22.78' r='1.19' style='fill: %23fff;'/%3E%3Cpath d='M1.3,27.54c-.69,0-1.24-.56-1.24-1.24s.56-1.24,1.24-1.24,1.24.56,1.24,1.24-.56,1.24-1.24,1.24Z' style='fill: %23fff;'/%3E%3Ccircle cx='1.3' cy='59.68' r='.82' style='fill: %23fff;'/%3E%3Cpath d='M1.3,55.74c-.48,0-.87.39-.87.87s.39.87.87.87.87-.39.87-.87-.39-.87-.87-.87Z' style='fill: %23fff;'/%3E%3Ccircle cx='1.3' cy='53.54' r='.92' style='fill: %23fff;'/%3E%3Cpath d='M1.3,49.5c-.54,0-.98.44-.98.98s.44.98.98.98.98-.44.98-.98-.44-.98-.98-.98Z' style='fill: %23fff;'/%3E%3Cpath d='M1.3,46.38c-.57,0-1.03.46-1.03,1.03s.46,1.03,1.03,1.03,1.03-.46,1.03-1.03-.46-1.03-1.03-1.03Z' style='fill: %23fff;'/%3E%3Cpath d='M1.3,43.25c-.6,0-1.08.49-1.08,1.08s.49,1.08,1.08,1.08,1.08-.49,1.08-1.08-.49-1.08-1.08-1.08Z' style='fill: %23fff;'/%3E%3Cpath d='M1.3,40.09c-.63,0-1.14.51-1.14,1.14s.51,1.14,1.14,1.14,1.14-.51,1.14-1.14-.51-1.14-1.14-1.14Z' style='fill: %23fff;'/%3E%3Cpath d='M1.3,36.53c-.66,0-1.19.53-1.19,1.19s.53,1.19,1.19,1.19,1.19-.53,1.19-1.19-.53-1.19-1.19-1.19Z' style='fill: %23fff;'/%3E%3Cpath d='M1.3,32.96c-.69,0-1.24.56-1.24,1.24s.56,1.24,1.24,1.24,1.24-.56,1.24-1.24-.56-1.24-1.24-1.24Z' style='fill: %23fff;'/%3E%3Cpath d='M1.3,31.55c-.72,0-1.3-.58-1.3-1.3s.58-1.3,1.3-1.3,1.3.58,1.3,1.3-.58,1.3-1.3,1.3Z' style='fill: %23fff;'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='_レイヤー_2' data-name='レイヤー 2' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 2.59 60.5'%3E%3Cg id='_レイヤー_1-2' data-name='レイヤー 1'%3E%3Cg%3E%3Ccircle cx='1.3' cy='.82' r='.82' style='fill: %23fff;'/%3E%3Cpath d='M1.3,4.76c-.48,0-.87-.39-.87-.87s.39-.87.87-.87.87.39.87.87-.39.87-.87.87Z' style='fill: %23fff;'/%3E%3Cpath d='M1.3,7.88c-.51,0-.92-.41-.92-.92s.41-.92.92-.92.92.41.92.92-.41.92-.92.92Z' style='fill: %23fff;'/%3E%3Cpath d='M1.3,11c-.54,0-.98-.44-.98-.98s.44-.98.98-.98.98.44.98.98-.44.98-.98.98Z' style='fill: %23fff;'/%3E%3Cpath d='M1.3,14.12c-.57,0-1.03-.46-1.03-1.03s.46-1.03,1.03-1.03,1.03.46,1.03,1.03-.46,1.03-1.03,1.03Z' style='fill: %23fff;'/%3E%3Cpath d='M1.3,17.25c-.6,0-1.08-.49-1.08-1.08s.49-1.08,1.08-1.08,1.08.49,1.08,1.08-.49,1.08-1.08,1.08Z' style='fill: %23fff;'/%3E%3Cpath d='M1.3,20.41c-.63,0-1.14-.51-1.14-1.14s.51-1.14,1.14-1.14,1.14.51,1.14,1.14-.51,1.14-1.14,1.14Z' style='fill: %23fff;'/%3E%3Ccircle cx='1.3' cy='22.78' r='1.19' style='fill: %23fff;'/%3E%3Cpath d='M1.3,27.54c-.69,0-1.24-.56-1.24-1.24s.56-1.24,1.24-1.24,1.24.56,1.24,1.24-.56,1.24-1.24,1.24Z' style='fill: %23fff;'/%3E%3Ccircle cx='1.3' cy='59.68' r='.82' style='fill: %23fff;'/%3E%3Cpath d='M1.3,55.74c-.48,0-.87.39-.87.87s.39.87.87.87.87-.39.87-.87-.39-.87-.87-.87Z' style='fill: %23fff;'/%3E%3Ccircle cx='1.3' cy='53.54' r='.92' style='fill: %23fff;'/%3E%3Cpath d='M1.3,49.5c-.54,0-.98.44-.98.98s.44.98.98.98.98-.44.98-.98-.44-.98-.98-.98Z' style='fill: %23fff;'/%3E%3Cpath d='M1.3,46.38c-.57,0-1.03.46-1.03,1.03s.46,1.03,1.03,1.03,1.03-.46,1.03-1.03-.46-1.03-1.03-1.03Z' style='fill: %23fff;'/%3E%3Cpath d='M1.3,43.25c-.6,0-1.08.49-1.08,1.08s.49,1.08,1.08,1.08,1.08-.49,1.08-1.08-.49-1.08-1.08-1.08Z' style='fill: %23fff;'/%3E%3Cpath d='M1.3,40.09c-.63,0-1.14.51-1.14,1.14s.51,1.14,1.14,1.14,1.14-.51,1.14-1.14-.51-1.14-1.14-1.14Z' style='fill: %23fff;'/%3E%3Cpath d='M1.3,36.53c-.66,0-1.19.53-1.19,1.19s.53,1.19,1.19,1.19,1.19-.53,1.19-1.19-.53-1.19-1.19-1.19Z' style='fill: %23fff;'/%3E%3Cpath d='M1.3,32.96c-.69,0-1.24.56-1.24,1.24s.56,1.24,1.24,1.24,1.24-.56,1.24-1.24-.56-1.24-1.24-1.24Z' style='fill: %23fff;'/%3E%3Cpath d='M1.3,31.55c-.72,0-1.3-.58-1.3-1.3s.58-1.3,1.3-1.3,1.3.58,1.3,1.3-.58,1.3-1.3,1.3Z' style='fill: %23fff;'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	  background: #fff;
  
}
.highlights .highlights-inner:after {
	content: "";
	position: absolute;
	top: -20%;
	right: 0;
	left: 0;
	background: radial-gradient(circle, rgba(255, 255, 255, 0.8) 0%, rgba(255, 255, 255, 0) 60%);
	width: 90%;
	height: auto;
	z-index: -1;
	margin: 0 auto;
	aspect-ratio: 1 / 1;
	  opacity: 1;
}

.highlights-img {
  position: relative;
  overflow: hidden;
}
.highlights-img img{
  aspect-ratio: 4 / 3;
  aspect-ratio: 880 / 1327;
}

.highlights-title {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  justify-content: flex-start;
  height: auto;
  transition: 0.6s all;
  position: relative;
  gap: 1.6em;
}

.highlights-item {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	justify-content: flex-start;
	height: auto;
	transition: 0.6s all;
	position: relative;
	gap: 1rem;
	padding: 0 3rem;
	max-width: 500px;
	margin: 0 auto;
}

.highlights-item:before,
.highlights-item:after {
	content: "";
	width: 30%;
	height: 2px;
	background: linear-gradient(315deg,rgba(255, 255, 255, 0) 0%, rgba(240, 232, 175, 1) 100%);

}
.highlights-item:after {
	transform: rotate(180deg);
	margin: 0 0 0 auto;

}

.highlights p.title {
	font-size: var(--highlights-font-size-title);
	font-weight: 500;
	text-align: center;
}
.highlights h2.name {
  font-size: var(--highlights-font-size-name);
	text-align: center;
}
.highlights p.text {
	font-size: var(--highlights-font-size-text);
}

.highlights .btn {
	max-width: 260px;
	margin: 0 auto;
	font-size: var(--highlights-font-size-text);
}

.place{
  font-size: var(--highlights-font-size-text);
  display: table;
  margin: 0 auto;
  background: rgb(255 255 255 / 19%);
  padding: 0.5rem 1rem;
  border-radius: 0.5rem;
  text-align: center;
}



@media screen and (min-width: 1025px) {

	.highlights .highlights-inner {
		grid-template-columns: 1.5fr 1fr;
		align-content: center;
		align-items: center;
		row-gap: 6rem;
	}
	.highlights-img {
		order: 1;
		grid-row: 1 / 3;
	}
	.highlights-img img{
	  aspect-ratio: 4 / 3;
	}

	.highlights-title {
	  order: 2;
	  align-self: end;
	}
	.highlights-item {
	  order: 3;
	  align-self: start;
	}
	.highlights .highlights-inner:nth-child(even) {
	  grid-template-columns: 1fr 1.5fr;
	}
	.highlights .highlights-inner:nth-child(even) .highlights-img {
	  order: 2; /* ★ 順番を2番目に変更 */
	     grid-column: 2;
	}

	.highlights .highlights-inner:nth-child(even) .highlights-title {
	  order: 1; /* ★ 順番を1番目に変更 */
	}
	.highlights .highlights-inner:nth-child(even) .highlights-item {
	  order: 3; /* ★ 順番を3番目に変更 */
	}


	.highlights .highlights-inner:after {
	  top: -50%;
	  max-width: 1000px;
	}

}



/* =============================================
　　article#show-events
============================================= */

article#show-events{
	position: relative;
}
article#show-events:before {
  content: "";
  background:var(--color-show-events);
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height:100%;
}
article#show-events:after {
	content: "";
	background: url(../img/index/bg01.png);
	background-size: cover;
	background-repeat: repeat-x;
	background-position: top;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


article#show-events .section-category {
	background: var(--color-show-events-secondary);
}

article#show-events .c-section__contents {
  padding: 0 0 0 var(--layout-space-base-horizontal);
}

article#show-events h3 {
  color: var(--color-show-events-secondary);
    text-align: center;
}

article#show-events h3 span{
  display: table;
  margin: 0 auto;
  border: 4px double;
  border-left: 0;
  border-right: 0;
  font-size: 80%;
}

article#show-events .btn{
  color:#fff;
  border-color: var(--color-show-events-secondary);
   background: var(--color-show-events-secondary);
}
article#show-events .spot-inner .spot-item .txt {
  color:#000;
}

article#show-events .spot-inner .spot-item .txt p.title {
  color:var(--color-show-events-secondary);
}

article#show-events .spot .spot-inner.spot-round {
  background: #fff;
  border-radius: 2rem;
  margin: 0 var(--layout-space-base-horizontal);
}

article#show-events .spot-inner.spot-round .spot-item {
  padding-bottom: 2rem;
}

article#show-events .spot-inner.spot-round .spot-item .txt {
  padding: 0 calc(5% / 1) ;
  color: #000;
}
article#show-events .spot-inner.spot-round .spot-item .txt p.title {
  color:var(--color-show-events-secondary);
}

article#show-events .spot-inner.spot-round .spot-img {
  border-radius: 2rem 2rem 0 0;
  overflow: hidden;
}
article#show-events .spot-inner.spot-round .btn{
  background:var(--color-show-events);
  color: #fff
}

article#show-events .icon-line:before {
   background: var(--color-secondary);
}

@media screen and (min-width: 1025px) {

	.show-events-list {
	  grid-template-columns: 1fr 1fr 1fr;
	}
	article#show-events .spot .spot-inner.spot-round {
		    max-width: 1200px;
	}
	article#show-events .spot-inner.spot-round .spot-img {
	  border-radius: 2rem 0 0 2rem;
	  overflow: hidden;
	}
}




/* =============================================
　　article#fireworks
============================================= */

article#fireworks{
	position: relative;
}
article#fireworks:before {
  content: "";
  background:var(--color-fireworks);
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height:100%;
}
/*
article#fireworks:after {
content: "";
  background: url(../img/index/bg.png);
  background-size: contain;
  background-repeat: repeat-x;
  background-position: top;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
*/
article#fireworks .img-bg {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
    overflow: hidden;
}
article#fireworks .img-bg:before,
article#fireworks .img-bg:after {
  content: "";
  background: url(../img/index/bg.png);
  background-size: contain;
  background-repeat: repeat-x;
  background-position: top;
  position: absolute;
  width: 100%;
  height: 100%;
  display: block;
  top: 0;
  left: 0;
}
article#fireworks .img-bg:after {
transform: rotate(180deg);
}





article#fireworks .section-category {
	background: var(--color-fireworks-secondary);
}

article#fireworks .c-section__contents {
  padding: 0 0 0 var(--layout-space-base-horizontal);
}

article#fireworks h3 {
  color: var(--color-base);
    text-align: center;
}
article#fireworks h3 span{
  display: block;
  font-size: 80%;
  border: 3px double;
  border-left: 0;
  border-right: 0;
  display: table;
  margin: 0 auto;
  color: var(--color-primary);
}

article#fireworks .btn{
  color:var(--color-fireworks);
   background: #fff
}
article#fireworks .spot-inner .spot-item .txt p.title {
  color:var(--color-base);
}

article#fireworks .spot .spot-inner.spot-round {
  background: #fff;
  border-radius: 2rem;
  margin: 0 var(--layout-space-base-horizontal);
}

article#fireworks .spot-inner.spot-round .spot-item {
  padding-bottom: 2rem;
}

article#fireworks .spot-inner.spot-round .spot-item .txt {
  padding: 0 calc(5% / 1) ;
  color: #000;
}
article#fireworks .spot-inner.spot-round .spot-item .txt p.title {
  color:var(--color-fireworks);
}

article#fireworks .spot-inner.spot-round .spot-img {
  border-radius: 2rem 2rem 0 0;
  overflow: hidden;
}
article#fireworks .spot-inner.spot-round .btn{
  background:var(--color-fireworks);
  color: #fff
}

.fireworks-list{
  display: grid;
  gap: 1.6rem;
}
.fireworks-list dl{
	background: rgb(255 255 255 / 10%);
	color: #fff;
	border-radius: 1rem;
	display: flex;
	flex-direction: column;
	align-content: center;
	align-items: center;
	padding: 1rem;
	gap: 0.5rem;
}
.fireworks-list dt{
	border-bottom: 1px rgb(255 255 255 / 50%)solid;
	width: 100%;
	text-align: center;
	font-size: var(--font-size-md);
}
.fireworks-list dt p{
	font-size: var(--font-size-base);
}
.fireworks-list dd{
	font-size: var(--font-size-md);
}


@media screen and (min-width: 1025px) {

	.fireworks-list {
	  grid-template-columns: 1fr 1fr;
	}
	article#fireworks .spot .spot-inner.spot-round {
		    max-width: 1100px;
	}
	article#fireworks .spot-inner.spot-round .spot-img {
	  border-radius: 2rem 0 0 2rem;
	  overflow: hidden;
	}
}



/* =============================================
　　article#illumination
============================================= */

article#illumination {
	position: relative;
}
article#illumination:before {
  content: "";
  background:var(--color-illumination);
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height:100%;
}
article#illumination .section-category {
	background: var(--color-illumination-secondary);
}

article#illumination .c-section {
  max-width: 100%;
  position: relative;
  padding-top:0px;
}
article#illumination .c-section__contents {
padding: 0 0 0 var(--layout-space-base-horizontal);
  display: flex;
  flex-direction: column;
  align-items: center;
}
.hero-section {
  width: 100%;
  display: grid;
  align-items: start;
}
.hero-section .img img{
  aspect-ratio: 4 / 4;
  object-position: left;
  animation: pan-image 16s infinite alternate;
}
.hero-section .img:after {
  content: "";
  background: #1a0638;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(0deg, rgba(26, 6, 56, 1) 0%, rgba(26, 6, 56, 0) 57%);
}
.hero-section .img:before {
	content: "";
	background: url(../img/index/illumination/illumination_logo.png);
	background-size: contain;
	background-repeat: no-repeat;
	background-position: right;
	position: absolute;
	top: 10px;
	right: 10px;
	width: 100%;
	height: 100px;
	display: block;
	z-index: 2;
}

.hero-section .txt {
  padding: 0 calc(5% / 1);
  display: flex;
  gap: 1.6rem;
  position: relative;
  align-items: center;
  align-content: space-between;
  flex-direction: column;
  justify-content: flex-start;
  color: #fff;
  margin-top: -20%;
}
.hero-section .txt p.title {
	font-size: var(--spot-font-size-title);
	font-weight: 500;
	text-align: center;
	color: var(--color-base);
}
.hero-section .txt p.name {
	font-size: var(--spot-font-size-name);
	line-height: 140%;
}
.hero-section .txt p {
	font-size: var(--spot-font-size-text);
	padding: 0 var(--layout-space-base-horizontal-small);
	text-align: center;
}

article#illumination .spot .spot-inner {
  background: #fff;
  border-radius: 2rem;
  margin: 0 var(--layout-space-base-horizontal);
}
article#illumination .spot-item .txt {
  padding: 0 calc(5% / 1) calc(5% / 0.5);
  color: #000;
}

article#illumination .spot-img {
  border-radius: 2rem 2rem 0 0;
  overflow: hidden;
}



@keyframes pan-image {
  0% {
    object-position: left;
  }
  100% {
    object-position: right;
  }
}

@media screen and (min-width: 1025px) {

	.hero-section .img img{
	    aspect-ratio: 16 / 6;
	}
	.hero-section .txt {
	  margin-top: -10%;
	}
	.hero-section .img:before {
		height: 200px;
	}
	article#illumination .spot .spot-inner {
		max-width: 940px;
	}
	article#illumination .spot-img {
	  border-radius: 2rem 0 0 2rem;
	  overflow: hidden;
	}
}


/* =============================================
　　article#gourmet
============================================= */

article#gourmet {
	position: relative;
}
article#gourmet:before {
  content: "";
  background:var(--color-gourmet);
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height:100%;
}
/*
article#gourmet:after {
content: "";
  background: url(../img/index/bg.png);
  background-size: contain;
  background-repeat: repeat-x;
  background-position: top;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
*/

article#gourmet .img-bg {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
    overflow: hidden;
}
article#gourmet .img-bg:before,
article#gourmet .img-bg:after {
  content: "";
  background: url(../img/index/bg.png);
  background-size: contain;
  background-repeat: repeat-x;
  background-position: top;
  position: absolute;
  width: 100%;
  height: 100%;
  display: block;
  top: 0;
  left: 0;
}
article#gourmet .img-bg:after {
transform: rotate(180deg);
}



article#gourmet .section-category {
	background: var(--color-gourmet-secondary);
}
article#gourmet .c-section__contents {
  padding: 0 0 0 var(--layout-space-base-horizontal);
}

article#gourmet .spot .spot-inner:nth-child(odd) {
  padding-right: calc(var(--layout-space-base-horizontal) * 1.5);
}
article#gourmet .spot .spot-inner:nth-child(even) {
  padding-left: calc(var(--layout-space-base-horizontal) * 1.5);
}

article#gourmet .spot-item .txt {
  color: #000;
}


@media screen and (min-width: 1025px) {
	article#gourmet .spot .spot-inner:nth-child(odd){
	  grid-template-columns: 1fr 1.5fr;
	}
	article#gourmet .spot .spot-inner:nth-child(odd) .spot-img{
	  order:2;
	}
}

/* =============================================
　　article#hotel
============================================= */

article#hotels {
	position: relative;
}


article#hotels:before {
  content: "";
  background:var(--color-primary);
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height:100%;
}


article#hotels .tokuten .inner,
article#hotels .plan .inner {
	display: grid;
	gap: 4rem;
}


article#hotels .text-heading{
  color: var(--color-base);
}
article#hotels .enjoy {
	display: grid;
	gap: 2rem;
	text-align: center;
	color:var(--color-htbnavy);
}
article#hotels .enjoy .img {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
article#hotels .enjoy img{
	aspect-ratio: 1 / 1;
	object-fit: cover;
	object-position: center center;
}
article#hotels .enjoy img:last-child{
	grid-column: 1 / 3;
}
article#hotels .enjoy img:last-child{
	aspect-ratio: 16 / 9;
}




article#hotels .item {
	background: #ffffff;
	border-radius: 2rem;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	justify-content: flex-start;
	height:auto;
	transition: 0.6s all;
	padding-bottom: 2rem;
	position: relative;
}

article#hotels  .swiper-slide:not(.swiper-slide-active) .item {
  transform: scale(0.95);
}


article#hotels .item .txt {
  padding: calc(5% / 1) calc(5% / 1);
  display: flex;
  gap: 10px;
  position: relative;
  align-items: center;
  align-content: space-between;
  flex-direction: column;
  justify-content: flex-start;
}

article#hotels  .item .txt p{
  font-family: var(--font-family-Zen-Mi);
  text-align: center;
}

article#hotels  .item .txt p.name{
	color: var(--color-htbnavy);
	border-bottom: 1px solid;
}

article#hotels  .item .img {
  width: 100%;
  overflow: hidden;
}

article#hotels  .item img {
  width: 100%;
  aspect-ratio: 4 / 3;
}

article#hotels  .swiper-slide-active .item img {
  transform: scale(1.15);
  transform-origin: bottom;
}

article#hotels  .item img {
  width: 100%;
  aspect-ratio: 4 / 3;
}

article#hotels  .btn{
	background-color: var(--color-htbnavy);
	border-color: var(--color-htbnavy);
	max-width: 260px;
	margin: 0 auto;
}

article#hotels .js-swiper-hotels{
  padding-left:3.4rem;
}
.swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal {
  padding-right: 3.4rem;
}


article#hotels .js-swiper-hotels .item {
  padding-bottom: 2rem;
}



article#hotels .item > .txt:first-of-type {
	flex: 1;
	justify-content: center;
}


article#hotels .fivehotels {
	display: grid;
	gap: 2rem;
	text-align: center;
}



article#hotels .tokuten {
	background: var(--color-accent);
	padding: 6rem 0;
	border-radius:10rem 0rem 10rem 0rem;
	display: grid;
	gap: 2rem;
	text-align: center;
	color: #fff
}



article#hotels .js-swiper-tokuten .item {
	background: var(--color-accent);
	color: #fff;
	border: 0;
	overflow: visible;
	margin-top:2rem;
}

article#hotels .tokuten .text-point {
	position: absolute;
	background: var(--color-secondary);
	border-radius: 9999px;
	padding: 1rem 3rem;
	line-height: 100%;
	color: #fff;
	left: 0;
	right: 0;
	top: -20px;
	display: table;
	margin: 0 auto;
	font-size: 16px;
	font-family: var(--font-family-Zen-Mi);
	z-index: 1;
}

article#hotels .tokuten .img {
  border-radius: 2rem 2rem 0 0;
}

article#hotels .tokuten .item .img:after {
  content: "";
  background:#fbbf55;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 110%;
  height: 110%;
  background: linear-gradient(0deg,rgba(39,63,27, 1) 0%, rgba(39,63,27, 0) 57%);
}
article#hotels .tokuten .item .img p{
	color:#ffd281;
	border: 0;
	line-height: 120%;
	font-family: var(--font-family-Zen-Mi);
	position: absolute;
	bottom: 1rem;
	left: 0;
	width: 100%;
	z-index: 1;
}
article#hotels .tokuten .item img{
}
article#hotels .tokuten .swiper-button-prev:after,
article#hotels .tokuten .swiper-button-next:after {
  background-color: #ffffff;
}


article#hotels .plan {
	padding: 6rem 1.6rem 3rem;
	display: grid;
	gap: 2rem;
	text-align: center;
	color: #000;
	  background: #fff;
	position: relative;
	margin:0 1.6rem;
	border:0px #96723b solid;
	border-radius: 4rem;
}


article#hotels .plan .title{
  position: absolute;
  top: -20px;
  left: 0;
  right: 0;
  background: var(--color-secondary);
  color: #fff;
  display: table;
  margin: 0 auto;
  padding: 0 2rem;
  border-radius: 9999px;
}

article#hotels .plan .plan-list{
  display: grid;
  gap: 2rem;
}
article#hotels .plan .plan-list .item{
	display: grid;
	grid-template-columns: 1fr 1.5fr;
	padding: 0;
	gap:0rem;
	align-items: center;
	border-color:var(--color-secondary);
	border: 2px var(--color-secondary) solid;
}

article#hotels .plan .plan-list .item img {
  aspect-ratio: 1 / 1;
}
article#hotels .plan .plan-list .item .txt {
  padding:0.5rem;
  display: block;
}
article#hotels .plan .plan-list .item .txt p{
  line-height: 140%;
}
article#hotels .plan .plan-list .item .link {
  grid-column: 1 / 4;
}
article#hotels .plan .plan-list .item .link .btn {
	max-width: none;
	margin: 0 auto;
	border-radius: 0;
	background-color:var(--color-secondary);
	border-color:var(--color-secondary);
	width: 100%;
}



@media screen and (min-width: 1025px) {


	article#hotels .enjoy .img {
	  display: grid;
	  grid-template-columns: 1fr 1fr  1fr;
	}
	article#hotels .enjoy img {
	  aspect-ratio: 16 / 9;
	}
	article#hotels .enjoy img:last-child {
	  grid-column: unset;
	}

	article#hotels  .swiper-slide:not(.swiper-slide-active) .item {
	  transform: scale(1);
	}
	article#hotels  .swiper-slide-active .item img {
	  transform: scale(1);
	}


	article#hotels .tokuten {
	  padding: 6rem;
	  width: 100%;
	  max-width: 1440px;
	}
	article#hotels .tokuten .inner {
	  margin: 0 auto;
	}
	article#hotels .plan {
	  padding: 6rem;
	      max-width: 940px;
	  max-width: 1440px;

	}
	article#hotels .plan .inner {
	  margin: 0 auto;
	}

	article#hotels .plan .plan-list {
	  gap: 4rem;
	  grid-template-columns: 1fr 1fr;
	}
	article#hotels .plan .plan-list .item {
	  grid-template-columns: 1fr 1.1fr;;
	}
	article#hotels .plan .plan-list .item img {
	  aspect-ratio: 16 / 9;
	}


}

