*,
*::before,
*::after {
	box-sizing: border-box;
}

html,
body,
h1,
h2,
h3,
h4,
h5,
h6,
ul,
ol,
dl,
li,
dt,
dd,
p,
div,
span,
img,
a,
table,
tr,
th,
td,
small,
button,
time,
figure {
	border: 0;
	font: inherit;
	font-size: 100%;
	margin: 0;
	padding: 0;
	vertical-align: baseline;
}

html {
	line-height: 1;
}

ol,
ul {
	list-style: none;
}

li,
dd {
	list-style-type: none;
}

header,
footer,
nav,
section,
article,
main,
aside,
figure,
figcaption {
	display: block;
}

img {
	border: none;
	vertical-align: bottom;
}

a {
	cursor: pointer;
	text-decoration: none;
}

button {
	background-color: transparent;
}

/*
_function.scss ファイル
それぞれ( )内にpxでの数値を入れるとrem, px, vw(pc版), vw(sp版) に変換
*/

*,
*:before,
*:after {
	box-sizing: border-box;
}

body {
	color: #000;
	font-family: "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "Yu Mincho Light", "YuMincho", "Yu Mincho", "游明朝体", serif;
	font-size: clamp(0.8125rem, 0.6394230769rem + 0.3605769231vw, 1rem);
	font-weight: 500;
	line-height: 1.5;
}

img {
	height: auto;
	max-width: 100%;
}

a {
	color: inherit;
}

.l-inner {
	margin-inline: auto;
	max-width: 1502px;
	padding-inline: 16px;
	width: 100%;
}

/* l-terms
-----------------------------------------------------------------------------*/

.l-terms {
	padding-inline: 16px;
	padding-top: 34px;
}
@media screen and (min-width: 768px) {
  .l-terms {
    padding-inline: 30px;
  }
}

/* l-course
-----------------------------------------------------------------------------*/

.l-course {
	margin-top: clamp(3.125rem, 0.6124371859rem + 12.5628140704vw, 6.25rem);
}

/* l-event
-----------------------------------------------------------------------------*/

.l-event {
	margin-top: 40px;
  padding-top: 5px;
}

/* l-operation
-----------------------------------------------------------------------------*/

.l-operation {
	/* margin-top: 40px; */
  padding-top: 40px;
}

/* l-map
-----------------------------------------------------------------------------*/

.l-map {
	/* margin-top: 43px; */
	padding-top: 43px;
}

/* l-use
-----------------------------------------------------------------------------*/

.l-use {
	/* margin-top: clamp(2.5rem, 0.2889447236rem + 11.0552763819vw, 5.25rem); */
	padding-top: clamp(2.5rem, 0.2889447236rem + 11.0552763819vw, 5.25rem);
}

/* l-attention
-----------------------------------------------------------------------------*/

.l-attention {
	/* margin-top: 42px; */
	padding-top: 42px;
}

/* l-link
-----------------------------------------------------------------------------*/

.l-link {
	/* margin-top: 55px; */
	padding-top: 55px;
}

/* l-contact
-----------------------------------------------------------------------------*/

.l-contact {
	/* margin-top: clamp(1.5625rem, 0.306218593rem + 6.2814070352vw, 3.125rem); */
	padding-top: clamp(1.5625rem, 0.306218593rem + 6.2814070352vw, 3.125rem);
}

/* l-footer
-----------------------------------------------------------------------------*/

/* c-logo-drawer
-----------------------------------------------------------------------------*/

.c-logo-drawer {
	display: block;
	margin-inline: auto;
	margin-top: 150px;
	max-width: 150px;
	width: 100%;
}

/* c-logo-header
-----------------------------------------------------------------------------*/

/* c-btn-cta
-----------------------------------------------------------------------------*/

.c-btn-cta {
	background: #fff;
	border-radius: 10px;
	display: flex;
	flex-direction: column;
	padding: clamp(0.625rem, -0.1287688442rem + 3.7688442211vw, 1.5625rem) 20px 10px;
	position: relative;
	text-align: center;
	transition: 0.3s ease;
}

.c-btn-cta:hover,
.c-btn-cta:focus {
	opacity: 0.6;
}

.c-btn-cta::after {
	background-image: url(../img/arrow-icon-sp.png);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
	content: "";
	height: 10px;
	position: absolute;
	right: 8%;
	top: 50%;
	transform: translateY(-10%);
	width: 20px;
}

.c-btn-cta--en {
	-webkit-background-clip: text;
	background: linear-gradient(to right, #cacbcc 0%, #a9abad 29%, #ceced0 65%, #aeafb2 87%, #d2d5d8 100%);
	background-clip: text;
	color: transparent;
	font-family: "Noto Sans JP", sans-serif;
	font-size: clamp(1.25rem, -0.6595477387rem + 9.5477386935vw, 3.625rem);
	font-style: normal;
	font-weight: 500;
	letter-spacing: 0.08em;
	line-height: 1;
	text-transform: uppercase;
}

.c-btn-cta--ja {
	color: #666;
	font-family: "Noto Sans JP", sans-serif;
	font-size: clamp(1rem, 0.3969849246rem + 3.0150753769vw, 1.75rem);
	font-style: normal;
	font-weight: 500;
	line-height: 1;
}

/* c-btn-info
-----------------------------------------------------------------------------*/

.c-btn-info {
	color: #fff;
	display: inline-block;
	height: 100%;
	padding: 10px clamp(0.625rem, -0.3800251256rem + 5.0251256281vw, 1.875rem) 10px clamp(0.625rem, -0.3800251256rem + 5.0251256281vw, 1.875rem);
	position: relative;
	text-align: center;
	transition: 0.3s ease;
}

.c-btn-info:hover,
.c-btn-info:focus {
	opacity: 0.6;
}

.c-btn-info::before {
	background-image: url(../img/arrow-icon-btn.png);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
	content: "";
	height: 9px;
	left: 50%;
	position: absolute;
	top: 20%;
	transform: translateX(-50%);
	width: 20px;
}

.c-btn-info--01 {
	background: #ffb94a;
}

.c-btn-info--02 {
	background: #85d37f;
}

/* c-section-title
-----------------------------------------------------------------------------*/

.c-section-title {
	font-size: clamp(1.25rem, 0.7474874372rem + 2.5125628141vw, 1.875rem);
}

.c-section-title__wrap {
	text-align: center;
}

/* c-background
-----------------------------------------------------------------------------*/

.c-background {
	background: #ffe5cc;
	position: relative;
}

/* c-background-img
-----------------------------------------------------------------------------*/

.c-background-img {
	background-image: url("../img/background-sp.png");
	background-position: top center;
	background-repeat: repeat-y;
	background-size: contain;
}

/* p-drawer-icon
-----------------------------------------------------------------------------*/

.p-drawer-icon {
	position: fixed;
	right: 11px;
	top: 13px;
	transition: transform 0.5s ease 0s;
	z-index: 50;
}

.p-drawer-icon.is-active .p-drawer-icon__bar1 {
	background: #515151;
	top: 8px;
	transform: rotate(-45deg);
}

.p-drawer-icon.is-active .p-drawer-icon__bar2 {
	display: none;
}

.p-drawer-icon.is-active .p-drawer-icon__bar3 {
	background: #515151;
	top: 8px;
	transform: rotate(45deg);
}

.p-drawer-icon__bars {
	display: block;
	height: 20px;
	position: relative;
	width: 22px;
}

.p-drawer-icon__bar1,
.p-drawer-icon__bar2,
.p-drawer-icon__bar3 {
	background: #515151;
	border-radius: 2px;
	height: 2px;
	left: 0;
	position: absolute;
	top: 0;
	width: 23px;
}

.p-drawer-icon__bar1 {
	top: 0;
}

.p-drawer-icon__bar2 {
	top: 9px;
}

.p-drawer-icon__bar3 {
	top: 18px;
}

.p-drawer-background {
	background: #fff;
	border-radius: 0 0 10px 10px;
	height: 43px;
	position: fixed;
	right: 0;
	top: 0;
	width: 43px;
	z-index: 50;
}

/* p-drawer-content
-----------------------------------------------------------------------------*/

.p-drawer-content {
	background: #515151;
	box-shadow: 0 0 3px rgba(0, 0, 0, 0.16);
	height: 100%;
	position: fixed;
	right: 0;
	top: 0;
	transform: translateX(105%);
	transition: transform 0.5s ease 0s;
	width: 60%;
	z-index: 40;
}

.p-drawer-content.is-active {
	transform: translateX(0);
}

.p-drawer-content__list {
	color: #fff;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 0.8125rem;
	padding: 50px 20px 20px;
	text-align: center;
}

.p-drawer-content__item {
	display: block;
	transition: 0.3s ease;
}

.p-drawer-content__item--lang {
  position: relative;
}

.p-drawer-content__item--lang .lang {
  display: flex;
  align-items: center;
  gap: 0.5em;
  border: 1px solid #000;
  border-radius: 50vh;
  color: #000;
  background-color: #fff;
  padding: 0.4em 0.6em;
  line-height: 1;
  width: fit-content;
  margin-inline: auto;
}

.p-drawer-content__item--lang .lang::before {
  content: "";
  display: block;
  width: 20px;
  height: 20px;
  background: url(../img/earth.svg) no-repeat center/cover;
}

.p-drawer-content__item--lang .lang::after {
  content: "";
  display: block;
  width: 12px;
  height: 12px;
  background: url(../img/arrow-icon-pc.png) no-repeat center/cover;
}

.p-drawer-content__item:hover,
.p-drawer-content__item:focus {
	opacity: 0.6;
}

.p-drawer-content__item + .p-drawer-content__item {
	margin-top: 20px;
}

/* p-header
-----------------------------------------------------------------------------*/

.p-header__nav {
	display: none;
}

.p-header__list {
	font-family: "Noto Sans JP", sans-serif;
  position: relative;
}

.p-header__link {
	transition: 0.3s ease;
}

.p-header__link:hover,
.p-header__link:focus {
	opacity: 0.6;
}

.p-header__item {
  font-size: 75%;
}

.p-header__item--lang a {
  position: relative;
}

.p-header__item--lang a .lang {
  display: flex;
  align-items: center;
  gap: 0.5em;
  border: 1px solid #000;
  border-radius: 50vh;
  color: #000;
  background-color: #fff;
  padding: 0.4em 0.6em;
  line-height: 1;
}

.p-header__item--lang a .lang::before {
  content: "";
  display: block;
  width: 20px;
  height: 20px;
  background: url(../img/earth.svg) no-repeat center/cover;
}

.p-header__item--lang a .lang::after {
  content: "";
  display: block;
  width: 12px;
  height: 12px;
  background: url(../img/arrow-icon-pc.png) no-repeat center/cover;
}

.p-header__logo {
	transition: 0.3s ease;
}

.p-header__logo:hover,
.p-header__logo:focus {
	opacity: 0.6;
}

/* p-mv
-----------------------------------------------------------------------------*/

.p-mv {
	position: relative;
}

.p-mv__title-wrap {
	font-size: clamp(1rem, 0.5477386935rem + 2.2613065327vw, 1.5625rem);
	left: 5%;
	letter-spacing: 0.06em;
	position: absolute;
	top: 15%;
}

.p-mv__title {
	background: #fff;
	display: inline-block;
	padding-left: 5px;
}

.p-mv__title:first-child {
	display: block;
	margin-bottom: 10px;
}

.p-mv__btn {
	bottom: -5px;
	position: absolute;
	width: 100%;
}

.fixed-btn {
	bottom: 20px;
	position: fixed;
	z-index: 20;
}

/* p-terms
-----------------------------------------------------------------------------*/

.p-terms {
	background: #fff;
	border-radius: 13px;
	display: grid;
	margin-inline: auto;
	padding-block: 43px 38px;
	padding-inline: 20px;
	place-content: center;
}

.p-terms__title {
	position: relative;
}

.p-terms__title::before {
	background: #333;
	bottom: 0;
	content: "";
	height: 1px;
	left: 50%;
	position: absolute;
	transform: translateX(-50%);
	width: 65px;
}

.p-terms__list {
	display: grid;
	gap: 16px;
	letter-spacing: 0.3em;
	margin-left: clamp(1.1875rem, -3.7873743719rem + 24.8743718593vw, 7.375rem);
	margin-top: clamp(1.5625rem, 0.5072236181rem + 5.2763819095vw, 2.875rem);
}

.p-terms__item {
	font-size: clamp(1rem, 0.3969849246rem + 3.0150753769vw, 1.75rem);
	position: relative;
}

.p-terms__item::before {
	background-repeat: no-repeat;
	background-size: contain;
	content: "";
	height: 35px;
	left: -17%;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 35px;
}

.p-terms__item:first-child::before {
	background-image: url(../img/list01.png);
}

.p-terms__item:nth-child(2)::before {
	background-image: url(../img/list02.png);
}

.p-terms__item:nth-child(3)::before {
	background-image: url(../img/list03.png);
}

.p-terms__text-wrap {
	font-size: clamp(0.625rem, 0.2229899497rem + 2.0100502513vw, 1.125rem);
	letter-spacing: 0.17em;
	margin-left: clamp(0rem, -0.8040201005rem + 4.0201005025vw, 1rem);
	margin-top: clamp(1.5625rem, 0.6579773869rem + 4.5226130653vw, 2.6875rem);
}

.p-terms__text-course {
    font-family: 'Noto Serif JP', serif;
    text-align: left; 
}

.p-terms__img {
	margin-top: 35px;
	max-width: 380px;
	width: 100%;
}

.p-terms__text-box {
  font-size: clamp(1.313rem, 1.262rem + 0.25vi, 1.563rem);
  min-height: 100%;
  margin-top: clamp(1.875rem, 1.625rem + 1.25vi, 3.125rem);
  position: relative;
  z-index: 0;
  background: url(../img/boxbg-1.png) no-repeat center/100% 100%;
}
@media screen and (min-width: 540px) {
  .p-terms__text-box {
    background: url(../img/boxbg-2.png) no-repeat center/100% 100%;
  }
}
@media screen and (min-width: 768px) {
  .p-terms__text-box {
    background: url(../img/boxbg-3.png) no-repeat center/100% 100%;
  }
}
@media screen and (min-width: 1024px) {
  .p-terms__text-box {
    background: url(../img/boxbg-4.png) no-repeat center/100% 100%;
  }
}

.p-terms__text-box p {
  max-width: 1280px;
  width: 100%;
  margin-inline: auto;
  padding-block: clamp(1.875rem, 1.625rem + 1.25vi, 3.125rem);
  padding-inline: clamp(1.875rem, 1.75rem + 0.625vi, 2.5rem);
  line-height: 1.8;
}

/* .p-terms__text-box img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  z-index: -1;
} */

/* p-info
-----------------------------------------------------------------------------*/

.p-info {
	padding-bottom: 50px;
	padding-top: 40px;
}

/* p-attraction
-----------------------------------------------------------------------------*/

.p-attraction:nth-child(2) {
	margin-top: clamp(3.125rem, -1.6488693467rem + 23.8693467337vw, 9.0625rem);
}

.p-attraction__wrap {
	margin-top: 20px;
}

.p-attraction__img {
	border-radius: 30px;
	height: 100%;
	overflow: hidden;
}

.p-attraction__img img {
	aspect-ratio: 824/495;
	width: 100%;
}

.p-attraction__body {
	display: flex;
	flex-direction: column;
	height: 100%;
	justify-content: space-between;
	max-height: clamp(21.875rem, 18.4579145729rem + 17.0854271357vw, 26.125rem);
	padding-bottom: 16px;
	padding-right: clamp(1rem, -2.567839196rem + 17.8391959799vw, 5.4375rem);
	padding-top: 53px;
	width: 100%;
	writing-mode: vertical-rl;
}

.p-attraction__sub-title {
	font-size: clamp(1.25rem, 0.1444723618rem + 5.527638191vw, 2.625rem);
	margin-left: clamp(1.25rem, 0.2449748744rem + 5.0251256281vw, 2.5rem);
	padding-top: 10px;
}

.p-attraction__text {
	font-size: clamp(0.875rem, 0.6739949749rem + 1.0050251256vw, 1.125rem);
	line-height: 2;
}

.p-attraction__btn {
	margin-left: 5px;
}

.p-attraction__slide {
	display: grid;
	gap: 3px;
	grid-template-columns: repeat(4, 1fr);
}

.p-attraction-slide__img {
	border-radius: clamp(0.625rem, -0.3800251256rem + 5.0251256281vw, 1.875rem);
	overflow: hidden;
}

.p-attraction-slide__img img {
	aspect-ratio: 395/264;
	width: 100%;
}

.p-info .p-attraction:nth-of-type(2) .p-attraction__slide {
	position: relative;
	z-index: 1;
  width: 100%;
}

/* .p-info .p-attraction:nth-of-type(2) .p-attraction__slide::before {
	background: #ffe5cc;
	content: "";
	display: block;
	height: 150%;
	left: 0;
	position: absolute;
	top: 50%;
	width: 100vw;
	z-index: -1;
} */

/* p-course
-----------------------------------------------------------------------------*/

.p-course {
  background-color: #ffe5cc;
  position: relative;
}

.p-course::before {
	background: #ffe5cc;
	content: "";
	display: block;
	height: 264%;
	left: 0;
	position: absolute;
	top: -50%;
  translate: 0 -29%;
	width: 100vw;
	z-index: 0;
}

.p-course__img {
	display: block;
	position: relative;
	transition: 0.3s ease;
	z-index: 10;
}

.p-course__img:hover,
.p-course__img:focus {
	opacity: 0.6;
}

.p-course__img::before {
	background: #b2a193;
	bottom: -7px;
	content: "";
	height: 100%;
	position: absolute;
	right: -7px;
	width: 100%;
	z-index: -1;
}

/* p-event
-----------------------------------------------------------------------------*/

.p-event {
  background-color: #ffe5cc;
}

.p-event__title {
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 700;
  text-align: center;
  padding-bottom: 1rem;
}

.p-event__wrap {
	background: #fff;
	border-radius: 15px;
	color: #333;
	margin-top: 6px;
	padding: 29px 0 10px 0;
}

.p-event__item {
	align-items: center;
	display: grid;
	gap: clamp(1.875rem, 1.8rem + 0.375vi, 2.25rem);
	grid-template-columns: 30%  1fr;
}

.p-event__item:nth-child(n+2) {
	margin-top: 6px;
}

.p-event__item:nth-child(n) .p-event__day::before {
	background: #333;
	border-radius: 50%;
	color: #fff;
	font-size: 10px;
	height: 16px;
	line-height: 16px;
	position: absolute;
	right: -23px;
	text-align: center;
	top: 50%;
	transform: translateY(-40%);
	width: 16px;
}
@media screen and (min-width: 768px) {
  .p-event__item:nth-child(n) .p-event__day::before {
    transform: translateY(-40%);
    width: 20px;
    height: 20px;
    line-height: 20px;
  }
}

.p-event__item:nth-child(2) .p-event__day::before,
.p-event__item:nth-child(3) .p-event__day::before,
.p-event__item:nth-child(4) .p-event__day::before,
.p-event__item:nth-child(6) .p-event__day::before {
	content: "土";
}

.p-event__item:nth-child(5) .p-event__day::before,
.p-event__item:nth-child(7) .p-event__day::before,
.p-event__item:nth-child(8) .p-event__day::before,
.p-event__item:nth-child(9) .p-event__day::before {
	content: "日";
}

.p-event__day {
	display: flex;
	font-family: "Noto Sans JP", sans-serif;
	font-size: clamp(0.75rem, 0.0464824121rem + 3.5175879397vw, 1.625rem);
	font-weight: 700;
	justify-content: flex-end;
	line-height: 1;
	position: relative;
}

.p-event__day .week {
	background: #333;
	border-radius: 50%;
	color: #fff;
	font-size: 10px;
	height: 16px;
	line-height: 16px;
	text-align: center;
	width: 16px;
  display: inline-block;
}
@media screen and (min-width: 768px) {
  .p-event__day .week {
    transform: translateY(-40%);
    font-size: 12px;
    width: 20px;
    height: 20px;
    line-height: 20px;
  }
}

.p-event__day._year {
  display: flex;
  flex-direction: column;
}

.p-event__day time,
.p-event__day .time {
  font-size: clamp(1rem, 0.85rem + 0.75vi, 1.75rem);
  text-align: right;
  display: inline-block;
}
@media screen and (min-width: 768px) {
  .p-event__day time,
  .p-event__day .time {
    font-size: clamp(1.5rem, 1.45rem + 0.25vi, 1.75rem);
  }
}

.p-event__title._second {
  margin-top: 1rem;
}
@media screen and (min-width: 768px) {
  .p-event__title._second {
    margin-top: 2rem;
    font-size: clamp(1.5rem, 1.475rem + 0.125vi, 1.625rem);
  }
}

.p-event__day._year .time::before {
  background: #333;
	border-radius: 50%;
	color: #fff;
	font-size: 12px;
	height: 20px;
	line-height: 20px;
	text-align: center;
	width: 20px;
  display: inline-block;
  position: absolute;
  top: 50%;
  right: 0;
}

.p-event__day._year .time::after {
  height: fit-content;
  position: absolute;
  font-size: 12px;
}
@media screen and (min-width: 768px) {
  .p-event__day._year .time::after {
    font-size: 16px;
  }
}

.p-event__day._year .time._2024::after {
  content: "2024";
  top: -17px;
  left: 50%;
  translate: -150% 0;
}
@media screen and (min-width: 768px) {
  .p-event__day._year .time._2024::after {
    translate: -200% 0;
    top: -21px;
  }
}

.p-event__day._2025 .year2025 {
  font-size: 12px;
  margin-right: 1em;
  display: inline-block;
}
@media screen and (min-width: 768px) {
  .p-event__day._2025 .year2025 {
    font-size: 16px;
  }
}

.p-event__wrap .p-event__list {
  width: 100%;
}

.p-event__day-year {
	font-size: clamp(0.75rem, 0.5489949749rem + 1.0050251256vw, 1rem);
	font-weight: 700;
	margin-right: 12px;
	padding-top: clamp(0rem, -0.2512562814rem + 1.256281407vw, 0.3125rem);
  display: block;
}

.p-event__info {
	font-size: clamp(0.75rem, 0.1972361809rem + 2.7638190955vw, 1.4375rem);
	font-weight: 700;
}

.p-event__img-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 24px;
    /* 画像の間隔 */
    flex-wrap: wrap;
    /* スマホで折り返し */
    margin: 11px auto 0;
}

.p-event__img {
    flex: 0 0 auto;
}

.p-event__img img {
    display: block;
    width: 230px;
    height: auto;
}

.event__list._pc {
  display: none;
}
@media screen and (min-width: 768px) {
  .event__list._pc {
    display: block;
  }
}

@media screen and (min-width: 768px) {
  .p-event__list._sp {
    display: none;
  }
}

.event__item {
  display: grid;
  grid-template-columns: 31% 1fr;
  gap: 20px;
  padding-inline: 10px;
  align-items: flex-end;
}
@media screen and (min-width: 768px) {
  .event__item {
    grid-template-columns: 34% 1fr;
    gap: 36px;
  }
}

.event__item + .event__item {
  margin-top: 10px;
}


.event__day {
  display: flex;
  align-items: flex-end;
	font-family: "Noto Sans JP", sans-serif;
  justify-content: center;
  flex-wrap: wrap;
}
@media screen and (min-width: 768px) {
  .event__day {
    justify-content: flex-end;
  }
}

.event__day .month {
  font-size: clamp(1.375rem, 1.35rem + 0.125vi, 1.5rem);
}

.event__day .mid {
  font-size: clamp(1rem, 0.975rem + 0.125vi, 1.125rem);
}
@media screen and (min-width: 768px) {
  /* .event__day .mid {
  font-size: clamp(1.5rem, 1.45rem + 0.25vi, 1.75rem);
  } */
}

.event__day .small {
  font-size: clamp(0.625rem, 0.6rem + 0.125vi, 0.75rem);
  display: block;

}
@media screen and (min-width: 768px) {
  /* .event__day .small {
  font-size: clamp(1.5rem, 1.45rem + 0.25vi, 1.75rem);
  } */
}

.p-event__info._second {
}

/* p-operation
-----------------------------------------------------------------------------*/

.p-operation {
  background-color: #ffe5cc;
}

.p-operation__title {
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 700;
}

.p-operation__route {
	margin-top: 12px;
}

.p-operation__schedule {
	margin-top: 20px;
}

.p-operation__timetable {
	margin-top: 40px;
}

.p-operation__item:nth-child(2) {
	margin-top: clamp(3.125rem, 2.1199748744rem + 5.0251256281vw, 4.375rem);
}

/* p-route
-----------------------------------------------------------------------------*/

.p-route__title {
	background: #4256a0;
	border-radius: 15px;
	color: #fff;
	font-family: "Noto Sans JP", sans-serif;
	font-size: clamp(1.25rem, 0.8479899497rem + 2.0100502513vw, 1.75rem);
	font-weight: 700;
	margin-inline: auto;
	max-width: 628px;
	padding-block: clamp(0.625rem, 0.0722361809rem + 2.7638190955vw, 1.3125rem);
	padding-inline: 10px;
	text-align: center;
	width: 100%;
}

.p-route__title-02 {
	background: #267a50;
}

.p-route__title-03 {
    background: #ea7f36;
}

.p-route__img {
	margin-inline: auto;
	margin-top: 50px;
	max-width: 520px;
	width: 100%;
}

/* p-schedule
-----------------------------------------------------------------------------*/

.p-schedule {
	margin-inline: auto;
	max-width: 616px;
	width: 100%;
}

/* p-timetable
-----------------------------------------------------------------------------*/

.p-timetable__img {
	width: 100%;
}

.p-timetable__img img {
	width: 100%;
}

/* p-map
-----------------------------------------------------------------------------*/

.p-map {
  background-color: #ffe5cc;
}

.p-map__title {
	font-family: "Noto Sans JP", sans-serif;
	font-size: clamp(1.25rem, 0.3957286432rem + 4.2713567839vw, 2.3125rem);
	font-weight: 700;
}

.p-map__iframe {
	margin-top: 32px;
	text-align: center;
  overflow: hidden;
}

.p-map__iframe iframe {
	aspect-ratio: 628/480;
	height: auto;
  margin-inline: auto;
	width: 100%;
  height: 100%;
  border: none;
}

/* p-use
-----------------------------------------------------------------------------*/

.p-use {
  background-color: #ffe5cc;
}

.p-use__title {
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 700;
}

.p-use__wrap {
	background: #fff;
	margin-top: 55px;
  border-radius: 10px;
  padding: 24px;
}
@media screen and (min-width: 768px) {
  .p-use__wrap {
    padding: 36px;
  }
}

.p-use__content {
	inline-size: -moz-fit-content;
	inline-size: fit-content;
	margin-inline: auto;
}

.p-use__content {
  margin-top: 30px;
  width: 100%;
  max-width: 540px;
  margin-inline: auto;
}


.use__content-inner {
  outline: 10px solid #dff0ec;
	padding: 20px;
}
@media screen and (min-width: 768px) {
  .use__content-inner {
    padding: 30px 30px 30px;
  }
}

.p-use__content:nth-child(2) {
	margin-top: 22px;
}

.p-use__sub-title {
	font-size: clamp(1.25rem, 0.3454773869rem + 4.5226130653vw, 1.875rem);
  position: relative;
}

.p-use__sub-title::after {
  content: "";
  display: block;
  width: 100%;
  height: 4px;
  position: absolute;
  bottom: -7px;
  left: 0;
  background: url(../img/use-title-line.png) no-repeat center/cover;
}

.use__title {
  width: 230px;
  margin-inline: auto;
}

.use__title._mt {
  margin-top: 40px;
}

.use__title img {
  width: 100%;
}

.p-use__text {
	font-size: clamp(1rem, 0.5979899497rem + 2.0100502513vw, 1.5rem);
	line-height: 1.7;
	margin-top: 25px;
	padding-inline: 10px;
  position: relative;
}
@media screen and (min-width: 768px) {
  .p-use__text {
    padding-inline: 20px;
  }
}

.p-use__text._icon01::after {
  content: "";
  display: block;
  width: 66px;
  height: 132px;
  position: absolute;
  top: -44px;
  right: -40px;
  background: url(../img/use-icon01.png) no-repeat center/cover;
}
@media screen and (min-width: 768px) {
  .p-use__text._icon01::after {
    width: 86px;
    height: 165px;
    top: -60px;
    right: 8px;
  }
}

.p-use__text._icon02 {
  width: 70%;
}

.p-use__text span {
  font-size: 0.8em;
  display: block;
}

.p-use__text._icon02::after {
  content: "";
  display: block;
  width: 128px;
  height: 121px;
  position: absolute;
  top: 21px;
  right: -108px;
  background: url(../img/use-icon02.png) no-repeat center/cover;
}
@media screen and (min-width: 768px) {
  .p-use__text._icon02::after {
    width: 188px;
    height: 181px;
    top: 20px;
    right: -172px;
  }
}

.p-use__btn {
	display: block;
	text-align: center;
	transition: 0.3s ease;
}

.p-use__btn:hover,
.p-use__btn:focus {
	opacity: 0.6;
}

.p-use__reserve {
	display: block;
	text-align: center;
	transition: 0.3s ease;
}

.p-use__reserve:hover,
.p-use__reserve:focus {
	opacity: 0.6;
}

/* p-attention
-----------------------------------------------------------------------------*/

.p-attention {
  background-color: #ffe5cc;
}

.p-attention__title {
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 700;
}

.p-attention__content {
	background: #fff;
	font-size: clamp(1rem, 0.5979899497rem + 2.0100502513vw, 1.5rem);
	margin-top: 38px;
	padding: 20px;
  border-radius: 10px;
}
@media screen and (min-width: 768px) {
  .p-attention__content {
    padding: 30px;
  }
}

.p-attention__content .wrap {
  border: 10px solid #dff0ec;
  padding: 20px 20px;
}
@media screen and (min-width: 768px) {
  .p-attention__content .wrap {
    padding: 30px 40px;
  }
}
.p-attention__text {
	line-height: 1.7;
}

.p-attention__text:nth-child(n+2) {
	margin-top: 0.5em;
}

/* p-link
-----------------------------------------------------------------------------*/
.p-link {
  background-color: #ffe5cc;
}

.p-link__title {
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 700;
}

.p-link__list {
	display: grid;
	gap: 13px;
	grid-template-columns: repeat(2, 1fr);
	margin-inline: auto;
	margin-top: 25px;
	max-width: 650px;
	width: 100%;
}

.p-link__item {
	transition: 0.3s ease;
  display: block;
  background-color: #fff;
  border-radius: 5px;
  border: 0.5px solid #534741;
  min-height: 90px;
  display: grid;
  place-items: center;
  font-weight: bold;
  font-size: clamp(1.125rem, 1.013rem + 0.563vi, 1.688rem);
  line-height: 1.2;
  text-align: center;
	font-family: "Noto Sans JP", sans-serif;
  color: #534741;
}

.p-link__item:hover,
.p-link__item:focus {
	opacity: 0.6;
}

/* p-contact
-----------------------------------------------------------------------------*/
.p-contact {
  background-color: #ffe5cc;
}

.p-contact__title {
	font-family: "Noto Sans JP", sans-serif;
	font-weight: 700;
}

.p-contact__form {
	background: #fff;
	margin-top: clamp(2.1875rem, 0.4287060302rem + 8.7939698492vw, 4.375rem);
  border-radius: 10px;
  text-align: center;
  padding: 20px;
  font-family: "Noto Sans JP", sans-serif;

}

.p-contact__form .wrap {
  border: 5px solid #EBDAB1;
  padding: 10px 10px;
}
@media screen and (min-width: 768px) {
  .p-contact__form .wrap {
    padding: 15px 20px;
  }
}

.p-contact__text {
	font-size: clamp(1.125rem, 1.063rem + 0.313vi, 1.438rem);
}

.p-contact__text._main {
	font-size: clamp(1.25rem, 1.212rem + 0.188vi, 1.438rem);
  font-weight: bold;
}

.p-contact__text._email {
  margin-top: 40px;
}

.p-contact__text._email a {
  display: inline-block;
  transition: opacity .3s;
}

.p-contact__text._email a:hover {
  opacity: 0.6;
}

.p-contact__text._attention {
  margin-top: 40px;
}

/* p-footer
-----------------------------------------------------------------------------*/

.p-footer {
	background: #ffe5cc;
	padding-block: 17px;
	text-align: center;
}

/* u-hidden
-----------------------------------------------------------------------------*/

.u-hidden-pc {
	display: block;
}

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

.c-logo-drawer {
	max-width: 200px;
}

.c-btn-cta::after {
	height: 20px;
	width: 30px;
}

.p-drawer-icon {
	right: 16px;
	top: 25px;
}

.p-drawer-icon.is-active .p-drawer-icon__bar1 {
	top: 20px;
}

.p-drawer-icon.is-active .p-drawer-icon__bar3 {
	top: 20px;
}

.p-drawer-icon__bars {
	height: 50px;
	width: 45px;
}

.p-drawer-icon__bar1,
.p-drawer-icon__bar2,
.p-drawer-icon__bar3 {
	height: 4px;
	width: 45px;
}

.p-drawer-icon__bar2 {
	top: 19px;
}

.p-drawer-icon__bar3 {
	top: 37px;
}

.p-drawer-background {
	height: 90px;
	width: 80px;
}

}

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

.l-inner {
	max-width: 1550px;
	padding-inline: 40px;
}

.l-event {
	/* margin-top: 79px; */
	padding-top: 79px;
}

.l-operation {
	/* margin-top: 50px; */
	padding-top: 50px;
}

.l-map {
	/* margin-top: clamp(3.75rem, 0.2884615385rem + 7.2115384615vw, 7.5rem); */
	padding-top: clamp(3.75rem, 0.2884615385rem + 7.2115384615vw, 7.5rem);
}

.l-use {
	/* margin-top: clamp(3.125rem, 0.4711538462rem + 5.5288461538vw, 6rem); */
	padding-top: clamp(3.125rem, 0.4711538462rem + 5.5288461538vw, 6rem);
}

.l-attention {
	/* margin-top: 60px; */
	padding-top: 60px;
}

.l-link {
	/* margin-top: 60px; */
	padding-top: 60px;
}

.l-contact {
	/* margin-top: 60px; */
	padding-top: 60px;
}

.c-logo-header {
	max-width: clamp(15.625rem, 10.1442307692rem + 11.4182692308vw, 21.5625rem);
	width: 100%;
}

.c-btn-cta {
	align-items: center;
	display: flex;
	flex-direction: row;
	gap: 50px;
	justify-content: center;
	margin-bottom: 16px;
	margin-inline: auto;
	max-width: 1225px;
	padding-bottom: 17px;
	padding-top: 13px;
	width: 80%;
}

.c-btn-cta::after {
	background-image: url(../img/arrow-icon-pc.png);
	height: 21px;
	right: 3%;
	transform: translateY(-50%);
	width: 38px;
}

.c-btn-cta--en {
	font-size: clamp(1.25rem, -2.2115384615rem + 7.2115384615vw, 5rem);
}

.c-btn-cta--ja {
	font-size: clamp(1rem, 0.1923076923rem + 1.6826923077vw, 1.875rem);
}

.c-btn-info {
	font-size: clamp(1.25rem, 0.7884615385rem + 0.9615384615vw, 1.75rem);
	padding: 10px clamp(0.9375rem, -0.1009615385rem + 2.1634615385vw, 2.0625rem) 10px clamp(0.9375rem, -0.1009615385rem + 2.1634615385vw, 2.0625rem);
}

.c-section-title {
	font-size: clamp(1.625rem, 1.2211538462rem + 0.8413461538vw, 2.0625rem);
}

.c-background-img {
	background-image: url("../img/background.png");
}

.p-drawer-icon {
	display: none;
}

.p-drawer-background {
	display: none;
}

.p-drawer-content {
	display: none;
}

.p-header {
	left: 0;
	padding-block: clamp(0.625rem, -0.2403846154rem + 1.8028846154vw, 1.5625rem);
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 20;
}

.p-header::before {
	background: rgba(0, 0, 0, 0.2);
	content: "";
	height: 100%;
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
	width: 100%;
	z-index: 1;
}

.p-header__nav {
	color: #fff;
	display: block;
	font-size: clamp(1rem, 0.1923076923rem + 1.6826923077vw, 1.875rem);
	position: relative;
	z-index: 30;
}

.p-header__list {
	align-items: center;
	display: flex;
	gap: clamp(1.875rem, -2.1634615385rem + 8.4134615385vw, 4.85rem);
	justify-content: flex-end;
}

.p-mv__title-wrap {
	font-size: clamp(1.25rem, 0.3846153846rem + 1.8028846154vw, 2.1875rem);
	left: 77%;
	top: 17%;
	writing-mode: vertical-rl;
}

.p-mv__title:first-child {
	margin-bottom: 0;
	margin-left: 13px;
}

.p-mv__title {
	padding-left: 0;
	padding-top: 5px;
}

.p-terms {
	display: flex;
	gap: clamp(0.625rem, -3.8173076923rem + 9.2548076923vw, 5.4375rem);
	justify-content: center;
	margin-inline: auto;
	padding-block: 20px 45px;
	padding-inline: 20px;
	width: 100%;
}

.p-terms__body {
	margin-top: 30px;
	max-width: 505px;
	width: 100%;
}

.p-terms__list {
	gap: 18px;
	letter-spacing: 0.4em;
	margin-left: clamp(3.125rem, -1.7788461538rem + 10.2163461538vw, 8.4375rem);
	margin-top: clamp(1.5625rem, 0.4086538462rem + 2.4038461538vw, 2.8125rem);
}

.p-terms__item {
	font-size: clamp(1.125rem, 0.5480769231rem + 1.2019230769vw, 1.75rem);
}

.p-terms__text-wrap {
	font-size: clamp(0.625rem, 0.0480769231rem + 1.2019230769vw, 1.25rem);
	margin-top: clamp(1.5625rem, 0.1201923077rem + 3.0048076923vw, 3.125rem);
}

.p-terms__img {
	margin-top: 0;
	max-width: 413px;
}

.p-info {
	padding-bottom: clamp(3.125rem, -2.6442307692rem + 12.0192307692vw, 9.375rem);
	padding-top: clamp(3.125rem, 0.7019230769rem + 5.0480769231vw, 5.75rem);
}

.p-attraction:nth-child(2) {
	margin-top: clamp(3.75rem, 0.1730769231rem + 7.4519230769vw, 7.625rem);
}

.p-attraction__title {
	font-size: clamp(1.75rem, 1.1730769231rem + 1.2019230769vw, 2.375rem);
}

.p-attraction__wrap {
	display: flex;
	flex-direction: row-reverse;
	margin-top: 45px;
}

.p-attraction__img {
	width: 52%;
}

.p-attraction__body {
	max-height: 496px;
	padding-bottom: 0;
	padding-right: clamp(1.25rem, 0.5rem + 1.5625vw, 2.0625rem);
	padding-top: 13px;
	width: 48%;
}

.p-attraction__sub-title {
	font-size: clamp(1.875rem, 0.2596153846rem + 3.3653846154vw, 3.625rem);
	margin-left: clamp(0.9375rem, -1.0817307692rem + 4.2067307692vw, 3.125rem);
}

.p-attraction__text {
	font-size: clamp(1rem, 0.4807692308rem + 1.0817307692vw, 1.5625rem);
}

.p-attraction__btn {
	margin-left: 10px;
}

.p-attraction__slide {
	margin-top: 55px;
}

.p-attraction-slide__img {
	border-radius: 30px;
}

.p-course__img::before {
	bottom: -20px;
	right: -20px;
}

.p-event__title {
	font-size: clamp(1.625rem, 0.7596153846rem + 1.8028846154vw, 2.5625rem);
}

.p-event__wrap {
	display: flex;
	flex-direction: row-reverse;
	gap: clamp(0.625rem, -5.7211538462rem + 13.2211538462vw, 7.5rem);
	justify-content: flex-end;
	margin-top: 32px;
	padding: 44px clamp(0.625rem, -1.9711538462rem + 5.4086538462vw, 3.4375rem) 31px;
}

.p-event__item {
	gap: clamp(3.125rem, 1.9711538462rem + 2.4038461538vw, 4.375rem);
}

.p-event__item:nth-child(n+2) {
	margin-top: 9px;
}

.p-event__item:nth-child(n) .p-event__day::before {
	border-radius: 50%;
	height: 22px;
	line-height: 22px;
	right: -35px;
	width: 22px;
}

.p-event__day {
	font-size: clamp(1.25rem, 0.0961538462rem + 2.4038461538vw, 2.5rem);
}

.p-event__day-year {
	font-size: clamp(1.25rem, 1.0192307692rem + 0.4807692308vw, 1.5rem);
	padding-top: clamp(0rem, -0.2884615385rem + 0.6009615385vw, 0.3125rem);
}

.p-event__info {
	font-size: clamp(1.25rem, 0.6730769231rem + 1.2019230769vw, 1.875rem);
}


.p-operation__title {
	font-size: clamp(1.625rem, 0.7596153846rem + 1.8028846154vw, 2.5625rem);
}

.p-operation__wrap {
	align-items: center;
	display: flex;
	margin-top: clamp(3.125rem, 0.8173076923rem + 4.8076923077vw, 5.625rem);
}

.p-operation__route {
	margin-top: 0;
}

.p-operation__schedule {
	margin-top: 13px;
}

.p-operation__timetable {
	margin-top: 60px;
}

.p-route__title {
	font-size: clamp(1.25rem, 0.7884615385rem + 0.9615384615vw, 1.75rem);
	letter-spacing: 0.15em;
	max-width: 680px;
	padding-block: clamp(1.25rem, 0.9615384615rem + 0.6009615385vw, 1.5625rem);
}

.p-route__img {
	margin-top: 60px;
	max-width: 560px;
}

.p-schedule {
	max-width: 670px;
}

.p-map__title {
	font-size: clamp(1.625rem, 0.8173076923rem + 1.6826923077vw, 2.5rem);
}

/* @media screen and (min-width: 768px) { */
  .p-map__iframe {
    margin-top: clamp(2.5rem, 0.1923076923rem + 4.8076923077vw, 5rem);
    overflow: hidden;
  }
/* } */

.p-map__iframe iframe {
	aspect-ratio: 1465/790;
	max-width: 1465px;
  object-fit: cover;
  object-position: center;
  width: 100%;
  height: 100%;
}

.p-use__title {
	font-size: clamp(1.625rem, 0.7019230769rem + 1.9230769231vw, 2.625rem);
}

.p-use__wrap {
	margin-top: clamp(3.125rem, -0.3942307692rem + 7.3317307692vw, 6.9375rem);
}

.p-use__content:nth-child(2) {
	margin-top: clamp(1.875rem, -0.1442307692rem + 4.2067307692vw, 4.0625rem);
}

.p-use__sub-title {
	font-size: clamp(1.85rem, 1.2115384615rem + 2.1634615385vw, 2.165rem);
}

.p-use__text {
	font-size: clamp(1.625rem, 1.0480769231rem + 1.2019230769vw, 1.75rem);
	margin-top: clamp(1.875rem, 0.0288461538rem + 3.8461538462vw, 3.875rem);
}

.p-use__btn {
	margin-top: clamp(2.1875rem, -0.0625rem + 4.6875vw, 4.625rem);
}

.p-use__reserve {
	margin-top: clamp(1.5625rem, 0.4086538462rem + 2.4038461538vw, 2.8125rem);
}

.p-attention__title {
	font-size: clamp(1.625rem, 0.7019230769rem + 1.9230769231vw, 2.625rem);
}

.p-attention__content {
	margin-top: 55px;
}

.p-link__title {
	font-size: clamp(1.625rem, 0.7019230769rem + 1.9230769231vw, 2.625rem);
}

.p-link__list {
	gap: clamp(0.9375rem, -1.0817307692rem + 4.2067307692vw, 3.125rem);
	grid-template-columns: repeat(4, 1fr);
	max-width: 1470px;
}

.p-contact__title {
	font-size: clamp(1.625rem, 0.7019230769rem + 1.9230769231vw, 2.625rem);
}

.p-contact__form {
	margin-top: 50px;
}

.p-footer {
	padding-bottom: 20px;
	padding-top: 78px;
}

.p-footer__copyright {
	font-size: 11px;
}

.u-hidden-pc {
	display: none;
}

}

/* パソコンで見た時はclass名pc-onlyだけ表示 */
.pc-only {
    display: block;
}

.sp-only {
    display: none;
}

/* スマホで見た時はclass名sp-onlyだけ表示 */
@media screen and (max-width: 768px) {
    .pc-only {
        display: none;
    }

    .sp-only {
        display: block;
    }
}

/* === 運行概要：PCで ①|②|③ の間に2本の仕切り線をコンテナに描く === */
@media (min-width: 768px) {
    .l-operation .p-operation__wrap {
        /* 3カラム固定のGridにして高さ差があっても線が途切れないようにする */
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        /* gapは変数に入れて、線の位置計算に使う */
        --gap: clamp(1rem, 2vw, 2.5rem);
        column-gap: var(--gap);
        align-items: start;
        position: relative;
        /* ← 擬似要素の基準 */
    }

    /* 左から1/3と2/3の位置（gapの半分を考慮）に縦線を通す */
    .l-operation .p-operation__wrap::before,
    .l-operation .p-operation__wrap::after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        /* コンテナ全高にフィット */
        width: 1px;
        background: #231815;
    }

    .l-operation .p-operation__wrap::before {
        left: calc(33.333% + (var(--gap) / 2));
    }

    .l-operation .p-operation__wrap::after {
        left: calc(66.666% + (var(--gap) / 2));
    }

}


/* === 運行概要 PC調整：中央のズレを0／列間を広げる === */
@media (min-width: 768px) {

    /* 中央カラムにだけ付いている SP 用の余白をリセット */
    .p-operation__item:nth-child(2) {
        margin-top: 0 !important;
    }

    /* Grid 3カラム：間隔を広げて窮屈さを解消（必要なら数値を調整） */
    .l-operation .p-operation__wrap {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr);
        --gap: clamp(2rem, 4vw, 5rem);
        /* ←ここで列間を広げる */
        column-gap: var(--gap);
        align-items: start;
        position: relative;
    }

    /* 縦線（gap に追従） */
    .l-operation .p-operation__wrap::before,
    .l-operation .p-operation__wrap::after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        width: 1px;
        background: #231815;
    }

    .l-operation .p-operation__wrap::before {
        left: calc(33.333% + (var(--gap)/2));
    }

    .l-operation .p-operation__wrap::after {
        left: calc(66.666% + (var(--gap)/2));
    }

    /* 各カラムの左右余白（窮屈なら少し足す） */
    .p-operation__item {
        padding: 0 clamp(0.75rem, 1.2vw, 1.5rem);
    }
}

@media (min-width: 768px) {

    /* 運行概要：各カラム内の要素を中央寄せ */
    .p-operation__item {
        text-align: center;
        /* テキストを中央揃え */
        display: flex;
        flex-direction: column;
        /* 上から順に積む */
        align-items: center;
        /* 画像やボックスも中央寄せ */
    }

    .p-operation__route,
    .p-operation__schedule,
    .p-operation__timetable {
        margin-left: auto;
        margin-right: auto;
        /* 横方向も中央に */
    }
    /* Gridアイテムの内容を中央寄せ */
    .l-operation .p-operation__wrap {
        justify-items: center;
        /* ←これで①②③ 各カラムの中身を横方向センターに */
    }


}

/* === 運行概要：PCで各カラム内の要素を中央寄せ === */
@media (min-width: 768px) {

    .l-operation .p-operation__wrap {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            column-gap: clamp(2rem, 4vw, 5rem);
            align-items: start;
            justify-items: center;
            /* 各カラムの中身を中央寄せ */
            position: relative;
        }
    
        .p-operation__item {
            text-align: center;
            /* テキスト中央寄せ */
        }

    /* 中央カラムだけ下がるのを防止（SPの余白を打ち消し） */
    .p-operation__item:nth-child(2) {
        margin-top: 0 !important;
    }
}

.gnav__translation {
    margin-top: 2rem;
    width: 72%;
}

.translation {
    background-color: #FFF;
    border: 1px solid #7B7573;
    width: 100%;
}

.fv__translation {
    margin-inline: auto;
    position: relative;
    width: 18rem;
}

.fv__translation .translation {
    border-radius: 1rem;
    left: 50%;
    position: absolute;
    top: 2rem;
    translate: -50% 0;
    z-index: 100;
}

.fv__translation .translation button {
    border-radius: 1rem;
}

.translation button {
    align-items: center;
    background-color: #FFF;
    display: flex;
    position: relative;
    width: 100%;
}

.translation button span {
    align-items: center;
    color: #7B7573;
    display: flex;
    font-weight: 400;
    padding-inline: 1rem;
}



@media screen and (min-width: 768px) {
    .translation button span::before {
        height: 1.7rem;
        margin-right: 0.8rem;
        width: 1.7rem;
    }
}

.translation button span::before {
    background: url(../img/common/earth.svg) no-repeat center/cover;
    content: "";
    display: inline-block;
    height: 2rem;
    margin-right: 1.2rem;
    transition: all 0.3s ease-in 0s;
    width: 2rem;
}

/*
.translation button span::after {
    border: 0;
    border-bottom: solid 0.2rem #7B7573;
    border-right: solid 0.2rem #7B7573;
    content: "";
    height: 1rem;
    margin-top: -0.2rem;
    position: absolute;
    right: 2rem;
    top: 34%;
    transform: rotate(45deg);
    transition: all 0.3s ease-in 0s;
    width: 1rem;
} */

.translation.js-active button span::after {
    top: 50%;
    transform: rotate(225deg);
}

.translation ul {
    height: 0;
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
    transition: opacity 0.3s ease, height 0.3s ease;
    width: 100%;
}

.translation ul.js-active {
    height: 17.6rem;
    opacity: 1;
    pointer-events: visible;
}

.gnav__translation .translation ul.js-active {
    height: 24rem;
}

.translation li a {
    color: #7B7573;
    display: block;
    font-size: 1.4rem;
    font-weight: 400;
    font-weight: 700;
    letter-spacing: 0.1em;
    line-height: 1;
    padding: 1rem 2rem;
    transition: color 0.3s;
    width: 100%;
}

@media (any-hover: hover) {
    .translation li a:hover {
        color: #D868A2;
        opacity: 1;
    }
}

.gnav__translation .translation li a {
    padding: 1.6rem 2rem;
}

.translation li:not(:last-of-type) a {
    border-bottom: 1px solid #7B7573;
}

body.js-active {
    overflow: hidden;
}

.p-attraction__slide {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    /* 3等分で配置 */
    gap: 10px;
    /* 画像間の余白 */
    width: 100%;
    /* 親要素いっぱいに広げる */
}

.p-attraction-slide__img {
    width: 100%;
    height: auto;
}

.p-attraction-slide__img img {
    width: 100%;
    /* 画像を枠いっぱいに広げる */
    height: auto;
    /* 縦横比を維持 */
    object-fit: cover;
    /* はみ出さず整える */
}

.btn {
    font-size: 18px;
    border: 1px solid #666;
    text-align: center;
    max-width: 400px;
    margin: 20px auto;
    font-family: 'Noto Serif JP', serif;
}

.btn a {
    color: #666;
    display: block;
    width: 100%;
    height: 100%;
    padding: 10px;
    box-sizing: border-box;
}

.btn8 {
    border-radius: 25px;
    position: relative;
}

.btn8 a::after {
    content: "";
    display: block;
    position: absolute;
    background-image: url('arrow.png');
    background-size: 100%;
    width: 7px;
    height: 17px;
    top: 0;
    bottom: 0;
    right: 10px;
    margin: auto;
}

.btn10 {
	position: relative;
}
.btn10::before {
	content: "";
	width: 80px;
	height: 1px;
	background: #666;
	rotate: -45deg;
	position: absolute;
	left: -10px;
	top: 5px;
}

.btn12 {
	border: none;
	border-top: 1px solid #666;
	border-bottom: 1px solid #666;
	font-size: 24px;
}

/* ベース：1列（スマホ） */
.img-grid {
	display: grid;
	grid-template-columns: 1fr;
	/* 1列 */
	gap: 16px;
	/* 間隔 */
	justify-items: center;
	/* 中央寄せ */
	margin: 0 auto;
	width: 100%;
	max-width: 720px;
}

.img-grid a {
	display: block;
	/* リンク全体をブロック化 */
}

.img-grid img {
	width: clamp(200px, 60vw, 320px);
	/* 幅を可変に */
	height: auto;
	/* アスペクト比維持 */
	border-radius: 8px;
	/* 角丸は任意 */
	display: block;
	transition: transform 0.3s ease;
	/* ホバー時のアニメーション */
}

.img-grid a:hover img {
	transform: scale(1.05);
	/* PCでホバー時に少し拡大 */
}

/* PC表示：2列×2段 */
@media (min-width: 768px) {
	.img-grid {
		grid-template-columns: repeat(2, auto);
		justify-content: center;
		column-gap: 24px;
	}
}

:root {
    --bg: #f7d9bd;
    /* ページ背景（サンプル） */
    --white: #fff;
    --text: #222;
    --muted: #5f5f5f;
    --spot-border: #f3cc63;
    /* スポット枠色 */
    --radius-xl: 20px;
    --radius-lg: 14px;
    --shadow: 0 4px 10px rgba(0, 0, 0, .08);
    --gap: 18px;
    --maxw: 680px;
    --img-w: 160px;
    /* 画像横幅（SP） */
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    background: var(--bg);
    font-family: "Noto Sans JP", system-ui, -apple-system, sans-serif;
    color: var(--text);
}

.course {
    max-width: var(--maxw);
    margin: 24px auto 64px;
    padding: 0 16px 8px;
}

.course__block+.course__block {
    margin-top: 28px;
}

/* 時間バッジ（中央ピル） */
.time-badge {
    display: flex;
    /* ← inline-flex ではなく block-level の flex */
    align-items: center;
    justify-content: center;

    width: max-content;
    /* 内容分の幅にする（fit-contentでも可） */
    margin: 0 auto 0px;
    /* ブロック要素なので中央寄せが効く */
    align-self: center;
    /* 親がflexでも中央に配置 */

    min-width: 120px;
    padding: 8px 30px;
    border-radius: 9999px;
    background: var(--white);
    box-shadow: var(--shadow);
    font-weight: 600;
}

/* カード共通（エリア・スポット） */
.card {
    display: flex;
    align-items: center;
    gap: 16px;
    background: var(--white);
    border-radius: var(--radius-xl);
    padding: 14px;
    box-shadow: var(--shadow);
    text-decoration: none;
    color: inherit;
    transition: transform .12s ease, box-shadow .12s ease;
}

.card:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, .12);
}

.card__img {
    width: 80px;
    height: 60px;
    object-fit: cover;
    border-radius: var(--radius-lg);
}

@media (min-width: 768px) {
    .card__img {
        width: 80px;
        height: 60px;
    }
}

.card__body {
    flex: 1 1 auto;
    min-width: 0;
    /* 省略記号のために必要 */
}

.card__title {
    font-size: 18px;
    line-height: 1.5;
    margin: 0;
    word-break: keep-all;
}

/* エリアカード（枠線なし） */
.card--area {
    border: 0.5px solid #ccc;
}
/* スポットカード（枠＆右端アイコン） */
.card--spot {
    border: 2px solid var(--spot-border);
    background: #fffef8;
    position: relative;
    padding-right: 56px;
    /* 右アイコンの余白 */
}

.card__ext {
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: #fff;
    box-shadow: var(--shadow);
}

.icon-ext {
    width: 20px;
    height: 20px;
    fill: #7a7a7a;
}

/* アクセシビリティ用の視覚非表示 */
.sr-only {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}


/* エリアカード：横幅100%、中央寄せ */
.card--area {
    width: 100%;
    margin: 0 auto 16px;
    /* 下に余白をつけて中央寄せ */
}

/* スポットカード：横幅80%、右寄せ */
.card--spot {
    width: 80%;
    margin: 0 0 16px auto;
    /* 右寄せ（左marginを自動） */
}

.c-btn-label {
    display: inline-block;
    background-color: #4256a0;
    /* 青色 */
    color: #fff;
    /* 文字色 */
    font-weight: 700;
    /* 太字 */
    padding: 8px 24px;
    /* 内側余白 */
    border-radius: 8px;
    /* 角丸 */
    text-align: center;
    /* 中央寄せ */
    font-size: 20px;
    line-height: 1.4;
    white-space: nowrap;
    /* 改行しない */
}
.c-btn2-label {
    display: inline-block;
    background-color: #267a50;
    /* 青色 */
    color: #fff;
    /* 文字色 */
    font-weight: 700;
    /* 太字 */
    padding: 8px 24px;
    /* 内側余白 */
    border-radius: 8px;
    /* 角丸 */
    text-align: center;
    /* 中央寄せ */
    font-size: 20px;
    line-height: 1.4;
    white-space: nowrap;
    /* 改行しない */
}

.c-btn3-label {
    display: inline-block;
    background-color: #868686;
    /* グレー色 */
    color: #fff;
    /* 文字色 */
    font-weight: 700;
    /* 太字 */
    padding: 8px 24px;
    /* 内側余白 */
    border-radius: 8px;
    /* 角丸 */
    text-align: center;
    /* 中央寄せ */
    font-size: 20px;
    line-height: 1.4;
    white-space: nowrap;
    /* 改行しない */
}
:root {
    --container: 1200px;
    --gap: 24px;
    --radius: 16px;
    --shadow: 0 8px 20px rgba(0, 0, 0, .06);
}

/* セクション */
.spots {
    max-width: min(var(--container), 92vw);
    margin: 48px auto;
    padding: 0 8px;
}

.spots__heading {
    text-align: center;
    font-weight: 600;
    font-size: 22px;
    margin-bottom: 20px;
    position: relative;
}

.spots__heading::after {
    content: "";
    display: block;
    width: 56px;
    height: 2px;
    background: #333;
    opacity: .25;
    margin: 8px auto 0;
}

/* カードの並び */
.spots__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
    justify-items: center;
    /* ← アイテム自体を中央に */
}

.spots__grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
  justify-items: center;        /* ← アイテム自体を中央に */
}
/* カード本体 */
.spot-card {
    width: 100%;
    /* ← SPは全幅ベース */
    max-width: 560px;
    /* 上限（お好みで 420〜600px） */
    margin: 0 auto;
    /* 念のため中央 */
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, .06);
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.spot-card__img {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    border-radius: var(--radius);
    display: block;
}

.spot-card__title {
    margin: 4px 4px 0;
    font-size: 18px;
    font-weight: 600;
}

.spot-card__desc {
    text-align: left;
    margin: 0 4px 0;
    color: #4a4a4a;
    line-height: 1.6;
    font-size: 14px;
}

/* 横幅が広がったら “固定幅カラム × 自動段組み” ＋ 中央寄せ */
@media (min-width: 640px) {
    .spots__grid {
        /* 300px幅のカラムを入るだけ生成。余った横幅は中央に寄せる */
        grid-template-columns: repeat(auto-fit, 300px);
        justify-content: center;
        /* ← 中央寄せの肝 */
        gap: 24px 28px;
    }
}

.links {
  display: grid;
  grid-template-columns: 1fr;     /* スマホは1列 */
  gap: 20px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 16px;
}

/* PCは4列 */
@media (min-width: 1024px) {
  .links {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* 画像の見た目 */
.links a img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0,0,0,.08);
  transition: transform .2s, box-shadow .2s;
}

.links a img:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0,0,0,.12);
}