.u-font__noto {
	font-family: "Noto Sans JP", sans-serif !important;
}

.u-font__rbt {
	font-family: "futura-pt-bold", sans-serif !important;
}

html {
	scroll-behavior: smooth;
}

body {
	background: #FCFCFC;
	overflow-x: hidden;
	scroll-behavior: smooth;
	scroll-padding-top: calc(90px + 0.625rem);
	color: #131340;
	font-family: "Noto Sans JP", sans-serif;
}

a {
	transition: 0.3s;
	color: #131340;
	text-decoration: none;
}

picture,
img {
	display: inline-block;
}

img {
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	object-fit: cover;
}

*,
*::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 {
	vertical-align: baseline;
	margin: 0;
	border: 0;
	padding: 0;
	font-size: 100%;
}

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 {
	vertical-align: bottom;
	border: none;
}

.l-main {
	margin-top: 90;
}

.l-inner {
	position: relative;
	margin: 0 auto;
	padding: 0 2.5rem;
	width: 100%;
	max-width: 1260px;
	height: inherit;
}

.l-section__bg {
	background: url(../img/bg_all.jpg) no-repeat center center/cover;
}

.l-section__title {
	color: #fff;
	font-size: 2.25rem;
	font-family: ab-kirigirisu, sans-serif;
	text-align: center;
}

.l-section__text {
	margin-top: 3.75rem;
	color: #fff;
	font-size: 1.25rem;
	line-height: 2;
	text-align: center;
}

.l-section__text + .l-section__text {
	margin-top: 1.875rem;
}

.p-topFv {
	position: relative;
	background: url(../img/FV.jpg) no-repeat center left/cover;
	width: 100%;
	height: 100vh;
}

.p-topFv::before {
	position: absolute;
	bottom: -40px;
	left: 0;
	z-index: 10;
	background: url(../img/snow-line.png) no-repeat center center/cover;
	width: 100%;
	height: 80px;
	content: "";
}

.p-topFv__title {
	position: absolute;
	top: 30%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 80%;
}

.p-attention__wrapper {
	display: flex;
	justify-content: center;
	gap: 1.875rem;
	margin: 3.75rem auto 0;
	max-width: 62.5rem;
}

/* ===============================================
# p-attention navigation
=============================================== */

.p-attention__navigation {
	display: flex;
	position: sticky;
	top: 0;
	left: 0;
	padding: 0 0 0 1.875rem;
	height: 100vh;
}

.p-attention__numWrapper {
	padding-top: 40px;
}

.p-attention__head {
	border-bottom: 1px solid rgba(255, 255, 255, 0.5);
	padding: 2.5rem 0 1.25rem;
}

.p-attention__head {
	transition: color 0.25s;
	font-weight: bold;
	font-size: 32px;
}

.p-attention__num {
	display: block;
	position: relative;
	transition: color 0.25s;
	color: rgba(255, 255, 255, 0.30306);
	font-style: normal;
	font-weight: 500;
	font-size: 32px;
	font-family: "futura-pt", sans-serif;
	letter-spacing: 0.08em;
}

.p-attention__num::before {
	position: absolute;
	top: -1.25rem;
	left: 0;
	opacity: 0;
	transition: opacity 1s ease;
	background: url(../img/maru.svg) no-repeat center center/cover;
	width: 7.75rem;
	height: 4.8125rem;
	content: "";
}

.p-attention__contentTitle {
	transition: color 0.25s;
	margin-top: 0.625rem;
	color: rgba(255, 255, 255, 0.3);
	font-size: 1.25rem;
	line-height: 1.75;
	letter-spacing: 0.03em;
}

.p-attention__head .is-active {
	color: white;
}

.p-attention__head .is-active .p-attention__num {
	color: white;
}

.p-attention__head .is-active .p-attention__contentTitle {
	color: white;
}

.p-attention__num.is-active {
	color: white;
}

.p-attention__num.is-active::before {
	opacity: 1;
}

.p-attention__contentTitle.is-active {
	color: white;
}

.p-attention__num + .p-attention__num {
	margin-top: 40px;
}

/* ===============================================
# フローの内容
=============================================== */

.p-attention__contents {
	padding-top: 40px;
}

.p-attention__list {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.p-attention__list + .p-attention__list {
	margin-top: 80px;
}

.p-attention__message {
	margin-top: 24px;
	font-size: 16px;
}

.p-attention__message.--case1 {
	width: 25.75rem;
}

.p-attention__message.--case2 {
	width: 33.9375rem;
}

.p-attention__message.--case3 {
	width: 30.6875rem;
}

.p-attention__figure img {
	display: block;
	margin-top: 30px;
	width: 100%;
	max-width: 150px;
	height: auto;
}

.main-path,
.small-path-1,
.small-path-2 {
	stroke-dasharray: 1200;
	stroke-dashoffset: 1200;
}

.main-path {
	animation: dash 4s cubic-bezier(0.59, -0.03, 0.39, 0.94) forwards;
}

.small-path-1 {
	animation: dash 1s cubic-bezier(0.59, -0.03, 0.39, 0.94) 5s forwards;
}

.small-path-2 {
	animation: dash 1s cubic-bezier(0.59, -0.03, 0.39, 0.94) 6s forwards;
}

/* common
-------------------------------------*/

.article {
	margin-top: 7.5rem;
}

/* アニメーション用
-------------------------------------*/

.js-text-effect span {
	display: inline-block;
	transform: rotateY(90deg);
	visibility: visible;
	opacity: 0;
}

span {
	display: inline-block;
}

.js-slideIn {
	overflow: hidden;
}

.js-slideIn .js-slideIn-element {
	display: inline-block;
	transform: translateY(120%);
}

/* ===== 雪を表示するコンテナのスタイル ===== */

.snow-container {
	position: relative;
	width: 100%; /* コンテナの横幅 */
	height: 100vh; /* コンテナの高さ */
}

/* ===== 雪のスタイル ===== */

.snow {
	position: absolute;
	animation: animate-snow 10s linear;
	border-radius: 50%;
	background-color: #fff; /* 雪の色 */
}

/* ===== 雪のアニメーション ===== */

/* countdown
-------------------------------------*/

.countdown {
	position: fixed;
	right: 1.875rem;
	bottom: 6.25rem;
	z-index: 20;
	width: 10.5625rem;
	height: 9.5625rem;
}

.countdown__date {
	position: absolute;
	top: 58%;
	left: 53%;
	transform: translate(-50%, -50%);
	color: #CE5836;
	font-size: 2.25rem;
	font-family: "futura-pt-bold", sans-serif;
}

.shake-animation {
	animation: shake 4s 2 ease;
}

/* about
-------------------------------------*/

.p-about {
	padding-top: 7.5rem;
}

.p-about__img1 {
	display: block;
	transform: rotate(8deg);
	animation: shake 4s infinite;
	margin: 3.75rem auto 0;
	width: 34.0625rem;
	height: auto;
}

.p-about__img2 {
	display: block;
	animation: shake 2s 2 ease;
	margin: 2.5rem auto 0;
	width: 18rem;
	height: auto;
}

.p-about__text {
	margin-top: 6.25rem;
}

/* how-to
-------------------------------------*/

.p-how_to__lists--pc {
	display: flex;
	justify-content: center;
	gap: 1.5rem;
	margin-top: 3.75rem;
}

.p-how_to__item {
	display: flex;
	flex-direction: column;
	justify-content: space-evenly;
	align-items: center;
	width: 15.625rem;
	height: auto;
}

.p-how_to__item img {
	-o-object-fit: contain;
	object-fit: contain;
}

.p-how_to__img {
	animation: shake 4s 3 ease-in-out;
	margin-top: 1.25rem;
	width: 11.875rem;
	height: auto;
}

.p-how_to__img--small {
	width: 7.625rem;
}

.p-how_to__lists--sp {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 3.75rem;
	margin-top: 3.75rem;
}

/* please
-------------------------------------*/

.p-please__img1 {
	display: block;
	transform: rotate(8deg);
	animation: shake 4s infinite;
	margin: 2.5rem auto 0;
	width: 8.125rem;
	height: auto;
}

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

.p-attention {
	padding-bottom: 12.5rem;
}

.p-attention__icon {
	display: inline-block;
	width: 1.8125rem;
	height: 1.8125rem;
}

.p-attention__title_wrap {
	text-align: center;
}

.p-attention__subtitle {
	display: inline-block;
	position: relative;
	justify-content: center;
	margin-bottom: 0.9375rem;
}

.p-attention__subtitle::before,
.p-attention__subtitle::after {
	position: absolute;
	top: 50%;
	left: -2.1875rem;
	transform: translateY(-50%);
	background: url(../img/attention.svg) no-repeat center center/cover;
	aspect-ratio: 1/1;
	width: 1.8125rem;
	height: auto;
	content: "";
}

.p-attention__subtitle::after {
	right: -2.1875rem;
	left: initial;
}

/* message
-------------------------------------*/

.p-message {
	position: relative;
	background: url(../img/footer_bg.jpg) no-repeat center center/cover;
	height: 100vh;
}

.p-message::before {
	position: absolute;
	top: -120px;
	left: 0;
	background: url(../img/city.png) no-repeat center center/cover;
	width: 100%;
	height: 120px;
	content: "";
}

.p-message__title {
	padding-top: 10rem;
}

.p-message__text {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	color: #fff;
	font-size: 1.25rem;
	line-height: 2;
	text-align: center;
}

.u-animation__fadeInUp,
.u-animation__fadeInLeft,
.u-animation__fadeInRight,
.u-animation__fadeInLeftBig,
.u-animation__fadeInRightBig {
	opacity: 0;
}

/* フェードイン時に入るクラス */

.js-fadeInUp {
	animation-duration: 1s;
	animation-fill-mode: forwards;
	animation-name: fadeInUpContents;
}

.js-fadeInUp__delay--1s {
	animation-duration: 1s;
	animation-fill-mode: forwards;
	animation-name: fadeInUpContents;
}

.js-fadeInUp__delay--2s {
	animation-duration: 1s;
	animation-fill-mode: forwards;
	animation-name: fadeInUpContents;
}

.js-fadeInLeft {
	animation-duration: 1s;
	animation-fill-mode: forwards;
	animation-name: fadeInLeftContents;
}

.js-fadeInLeft__delay--1s {
	animation-duration: 1s;
	animation-fill-mode: forwards;
	animation-name: fadeInLeftContents;
}

.js-fadeInLeft__delay--2s {
	animation-duration: 1s;
	animation-fill-mode: forwards;
	animation-name: fadeInLeftContents;
}

.js-fadeInLeftBig {
	animation-duration: 1s;
	animation-fill-mode: forwards;
	animation-name: fadeInLeftBigContents;
}

.js-fadeInLeftBig__delay--1s {
	animation-duration: 1s;
	animation-fill-mode: forwards;
	animation-name: fadeInLeftBigContents;
}

.js-fadeInLeftBig__delay--2s {
	animation-duration: 1s;
	animation-fill-mode: forwards;
	animation-name: fadeInLeftBigContents;
}

.js-fadeInRight {
	animation-duration: 1s;
	animation-fill-mode: forwards;
	animation-name: fadeInRightContents;
}

.js-fadeInRight__delay--1s {
	animation-duration: 1s;
	animation-fill-mode: forwards;
	animation-name: fadeInRightContents;
}

.js-fadeInRight__delay--2s {
	animation-duration: 1s;
	animation-fill-mode: forwards;
	animation-name: fadeInRightContents;
}

.js-fadeInRightBig {
	animation-duration: 1s;
	animation-fill-mode: forwards;
	animation-name: fadeInRightBigContents;
}

.js-fadeInRightBig__delay--1s {
	animation-duration: 1s;
	animation-fill-mode: forwards;
	animation-name: fadeInRightBigContents;
}

.js-fadeInRightBig__delay--2s {
	animation-duration: 1s;
	animation-fill-mode: forwards;
	animation-name: fadeInRightBigContents;
}

.u-sp {
	display: none;
}

.u-pc {
	display: none !important;
}

.u-center {
	text-align: center !important;
}

.u-left {
	text-align: left !important;
}

.u-right {
	text-align: right !important;
}

.u-pointer__none {
	pointer-events: none !important;
}

.u-nowrap {
	white-space: nowrap;
}

@media (hover: hover) {

a:hover {
	cursor: pointer;
}

}

@media (min-width: 768px) {

.p-attention__wrapper.--sp {
	display: none;
}

.p-attention__list {
	height: 90vh;
}

.p-attention__contents--sp {
	display: none;
}

.countdown:hover {
	animation: shake 4s 2 ease;
}

.p-how_to__lists--sp {
	display: none;
}

.js-fadeInUp__delay--1s {
	animation-delay: 1s;
}

.js-fadeInUp__delay--2s {
	animation-delay: 2s;
}

.js-fadeInLeft__delay--1s {
	animation-delay: 1s;
}

.js-fadeInLeft__delay--2s {
	animation-delay: 2s;
}

.js-fadeInLeftBig__delay--1s {
	animation-delay: 1s;
}

.js-fadeInLeftBig__delay--2s {
	animation-delay: 2s;
}

.js-fadeInRight__delay--1s {
	animation-delay: 1s;
}

.js-fadeInRight__delay--2s {
	animation-delay: 2s;
}

.js-fadeInRightBig__delay--1s {
	animation-delay: 1s;
}

.js-fadeInRightBig__delay--2s {
	animation-delay: 2s;
}

.u-pc {
	display: block !important;
}

.u-center--pc {
	text-align: center !important;
}

.u-left--pc {
	text-align: left !important;
}

.u-right--pc {
	text-align: right !important;
}

.u-pointer__none--pc {
	pointer-events: none !important;
}

.u-nowrap--pc {
	white-space: nowrap;
}

}

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

html {
	font-size: calc(1600 / 1260 * 1vw);
}

}

@media screen and (max-width: 767px) {

html {
	font-size: calc(1600 / 375 * 1vw);
}

body {
	scroll-padding-top: calc(90px + 0.625rem);
}

.l-main {
	margin-top: 50;
}

.l-inner {
	padding: 0 1.25rem;
	width: 100%;
	max-width: 100%;
}

.l-section__title {
	font-size: 1.4375rem;
}

.l-section__text {
	font-size: 1rem;
}

.p-topFv {
	background: url(../img/FV_sp.jpg) no-repeat center center/cover;
}

.p-attention__wrapper.--pc {
	display: none;
}

.p-attention__num {
	color: #fff;
	font-size: 1.5rem;
}

.p-attention__num::before {
	left: 50%;
	transform: translateX(-50%);
	width: 6.25rem;
	height: 3.75rem;
}

.p-attention__contentTitle {
	color: #fff;
	font-size: 1.125rem;
}

.p-attention__message.--case1 {
	width: 95%;
	max-width: 18.75rem;
	height: auto;
}

.p-attention__message.--case2 {
	width: 95%;
	max-width: 33.9375rem;
	height: auto;
}

.p-attention__message.--case3 {
	width: 95%;
	max-width: 30.625rem;
	height: auto;
}

.p-attention__contents--sp {
	display: flex;
	flex-direction: column;
	align-items: center;
	overflow: hidden;
}

.p-attention__list {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.article {
	margin-top: 5rem;
}

.countdown {
	right: 0.625rem;
	width: 8.125rem;
	height: 7.5rem;
}

.p-about__img1 {
	width: 90%;
	max-width: 21.875rem;
	height: auto;
}

.p-how_to__lists--pc {
	display: none;
}

.p-message__title {
	padding-top: 5rem;
}

.p-message__text {
	top: 40%;
	font-size: 1rem;
}

.js-fadeInLeft {
	animation-name: fadeInUpContents;
}

.js-fadeInLeft__delay--1s {
	animation-name: fadeInUpContents;
}

.js-fadeInLeft__delay--2s {
	animation-name: fadeInUpContents;
}

.js-fadeInLeftBig {
	animation-name: fadeInUpContents;
}

.js-fadeInLeftBig__delay--1s {
	animation-name: fadeInUpContents;
}

.js-fadeInLeftBig__delay--2s {
	animation-name: fadeInUpContents;
}

.js-fadeInRight {
	animation-name: fadeInUpContents;
}

.js-fadeInRight__delay--1s {
	animation-name: fadeInUpContents;
}

.js-fadeInRight__delay--2s {
	animation-name: fadeInUpContents;
}

.js-fadeInRightBig {
	animation-name: fadeInUpContents;
}

.js-fadeInRightBig__delay--1s {
	animation-name: fadeInUpContents;
}

.js-fadeInRightBig__delay--2s {
	animation-name: fadeInUpContents;
}

.u-sp {
	display: block !important;
}

.u-center--sp {
	text-align: center !important;
}

.u-left--sp {
	text-align: left !important;
}

.u-right--sp {
	text-align: right !important;
}

.u-pointer__none--sp {
	pointer-events: none !important;
}

.u-nowrap--sp {
	white-space: nowrap;
}

}

@keyframes dash {

from {
	stroke-dashoffset: 1200;
}

to {
	stroke-dashoffset: 0;
}

}

@keyframes animate-snow {

0% {
	top: 0;
	opacity: 0;
}

10% {
	opacity: 1;
}

90% {
	opacity: 1;
}

100% {
	top: 100vh;
	opacity: 0;
}

}

@keyframes shake {

50% {
	transform: rotate(-8deg);
}

100% {
	transform: rotate(8deg);
}

}

@keyframes fadeInUpContents {

0% {
	transform: translateY(1.25rem);
	opacity: 0;
}

100% {
	transform: translateY(0);
	opacity: 1;
}

}

@keyframes fadeInLeftContents {

0% {
	transform: translateX(-1.25rem);
	opacity: 0;
}

100% {
	transform: translateX(0);
	opacity: 1;
}

}

@keyframes fadeInRightContents {

0% {
	transform: translateX(1.25rem);
	opacity: 0;
}

100% {
	transform: translateX(0);
	opacity: 1;
}

}

@keyframes fadeInLeftBigContents {

0% {
	transform: translateX(-62.5rem);
	opacity: 0;
}

100% {
	transform: translateX(0);
	opacity: 1;
}

}

@keyframes fadeInRightBigContents {

0% {
	transform: translateX(62.5rem);
	opacity: 0;
}

100% {
	transform: translateX(0);
	opacity: 1;
}

}