@charset "UTF-8";

:root{
	--orange:#ff8a1f;
	--yellow:#ffd43b;
	--red:#f45b5b;
	--blue:#2f80ed;
	--green:#31b66a;
	--ink:#292316;
	--muted:#6f6557;
	--cream:#fff7df;
	--paper:#fffdf6;
	--line:#f0d391;
}

*{
	box-sizing:border-box;
}

html{
	scroll-behavior:smooth;
}

body{
	font-family:"Noto Sans JP","游ゴシック",YuGothic,"メイリオ",Meiryo,sans-serif;
	font-size:16px;
	line-height:1.75;
	color:var(--ink);
	margin:0;
	background:var(--paper);
	font-feature-settings:"palt";
}

body.modal-open{
	overflow:hidden;
}

a{
	color:#d45400;
	text-decoration:none;
}

a:hover{
	color:#ff7a00;
}

img{
	border:0;
	max-width:100%;
	height:auto;
	vertical-align:middle;
}

button,
input,
textarea{
	font:inherit;
}

.contents{
	width:min(1120px, calc(100% - 48px));
	margin:0 auto;
}

.center{
	text-align:center;
}

.pc{
	display:inherit;
}

.smp{
	display:none;
}

header{
	position:sticky;
	top:0;
	z-index:50;
	background:rgba(255,253,246,0.94);
	backdrop-filter:blur(12px);
	border-bottom:3px solid var(--yellow);
}

.header-inner{
	display:flex;
	align-items:center;
	gap:24px;
	min-height:82px;
}

header h1{
	width:172px;
	margin:0 auto 0 0;
	line-height:1;
}

header nav ul{
	display:flex;
	gap:20px;
	align-items:center;
	list-style:none;
	margin:0;
	padding:0;
}

header nav a{
	display:block;
	color:var(--ink);
	font-weight:700;
	font-size:0.94rem;
}

.header-action{
	margin:0;
}

#smpbtn{
	display:none;
}

.btn-custom{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-height:48px;
	padding:0 26px;
	border:0;
	border-radius:999px;
	font-weight:900;
	letter-spacing:0;
	cursor:pointer;
	box-shadow:0 7px 0 rgba(113,70,8,0.22);
	transition:transform 160ms ease, box-shadow 160ms ease;
	font-size: 1.4rem;
}

.btn-custom:hover{
	transform:translateY(2px);
	box-shadow:0 5px 0 rgba(113,70,8,0.22);
}

.bg-primary{
	background:var(--orange);
	color:#fff;
}

.bg-primary:visited,
.bg-primary:hover{
	color:#fff;
}

.bg-secondary{
	background:#fff;
	color:#c65000;
	border:2px solid var(--orange);
}

.bg-secondary:visited,
.bg-secondary:hover{
	color:#c65000;
}

.hero{
	position:relative;
	overflow:hidden;
	padding:76px 0 84px;
	background:
		radial-gradient(circle at 12% 16%, rgba(255,212,59,0.55) 0 10%, transparent 11%),
		radial-gradient(circle at 84% 18%, rgba(47,128,237,0.16) 0 13%, transparent 14%),
		linear-gradient(135deg,#fff5c2 0%,#fffdf6 44%,#ffe2b7 100%);
}

.hero:after{
	content:"";
	position:absolute;
	left:0;
	right:0;
	bottom:-1px;
	height:42px;
	background:repeating-linear-gradient(-45deg,#fff 0 16px,#ffe081 16px 32px);
	opacity:0.75;
}

.hero-inner{
	position:relative;
	z-index:1;
	display:grid;
	grid-template-columns:minmax(0, 1.16fr) minmax(300px, 0.84fr);
	gap:54px;
	align-items:center;
}

.hero-badge,
.section-kicker{
	display:inline-flex;
	align-items:center;
	margin:0 0 16px;
	padding:5px 14px;
	border-radius:999px;
	background:var(--yellow);
	color:#6d3d00;
	font-weight:900;
	line-height:1.4;
}

.hero-logo{
	width:min(420px, 100%);
	margin-bottom:20px;
	animation:rotatefade 720ms ease both;
}

.hero h2{
	margin:0 0 18px;
	font-size:clamp(2rem, 4.3vw, 4.25rem);
	line-height:1.18;
	color:#2d2516;
	letter-spacing:0;
}

.fadetxt span{
	opacity:0;
	display:inline-block;
	transform:translateY(1em);
	animation:fadeInb2ttxt 560ms ease forwards;
}

.fadetxt span:nth-child(1){
	animation-delay:80ms;
}

.fadetxt span:nth-child(3){
	animation-delay:200ms;
}

.hero-lead{
	max-width:650px;
	margin:0 0 26px;
	font-size:1.1rem;
	font-weight:700;
	color:#4d4336;
}

.hero-info{
	display:grid;
	grid-template-columns:repeat(2, minmax(0, 1fr));
	gap:14px;
	margin:0 0 28px;
}

.hero-info p{
	margin:0;
	padding:18px;
	background:#fff;
	border:3px solid var(--yellow);
	border-radius:8px;
	box-shadow:8px 8px 0 rgba(255,138,31,0.18);
}

.hero-info strong,
.hero-info span{
	display:block;
}

.hero .date{
	text-align: center;
	font-size:1.4em;
	color:#d45400;
}
.hero .date strong{
	font-size:4rem;
	margin-right: 1em;
	
}

.hero-buttons{
	display:flex;
	flex-wrap:wrap;
	gap:14px;
}

.hero-visual{
	display:flex;
	justify-content:center;
}

.park-card{
	position:relative;
	width:min(360px, 100%);
	padding:28px 24px 22px;
	background:#fff;
	border:5px solid #2f80ed;
	border-radius:8px;
	box-shadow:18px 18px 0 rgba(47,128,237,0.16);
	animation:fadeInR2L 700ms ease both;
}

.park-card:before{
	content:"NADYA PARK";
	position:absolute;
	top:-20px;
	left:24px;
	padding:4px 14px;
	background:var(--red);
	color:#fff;
	border-radius:999px;
	font-size:0.8rem;
	font-weight:900;
}

.park-card p{
	margin:16px 0 0;
	text-align:center;
	font-weight:900;
}

.block{
	padding:90px 0;
}

.bg-cream{
	background:var(--cream);
}

.bg-orange{
	background:#ffe1b2;
}

.split,
.guide-layout,
.access-layout{
	display:grid;
	grid-template-columns:0.8fr 1.2fr;
	gap:56px;
	align-items:start;
}

.section-title{
	margin:0 0 24px;
	font-size:clamp(2rem, 3.2vw, 3.1rem);
	line-height:1.25;
	letter-spacing:0;
}

.overview-list{
	list-style:none;
	margin:26px 0 0;
	padding:0;
	border-top:2px solid var(--line);
}

.overview-list li{
	display:grid;
	grid-template-columns:100px 1fr;
	gap:18px;
	padding:14px 0;
	border-bottom:2px solid var(--line);
	font-weight:700;
}

.overview-list span{
	color:#b65300;
}

.program-grid{
	display:grid;
	grid-template-columns:repeat(3, minmax(0, 1fr));
	gap:24px;
	margin-top:34px;
}

.program-card{
	position:relative;
	display:flex;
	flex-direction:column;
	min-height:100%;
	padding:28px;
	background:#fff;
	border:4px solid var(--orange);
	border-radius:8px;
	box-shadow:10px 10px 0 rgba(255,138,31,0.16);
	animation:fadeIn 700ms ease both;
}
.program-card h4.time{
	background-color: rgba(235,169,113,1.00);
	color: #fff;
	padding: .5em 1em;
	font-weight: bold;
	font-size: 1.2em;
	text-align: center;
	border-radius: 8px;
	display: inline;
}

.program-card.accent-blue{
	border-color:var(--blue);
	box-shadow:10px 10px 0 rgba(47,128,237,0.14);
}

.program-card.accent-green{
	border-color:var(--green);
	box-shadow:10px 10px 0 rgba(49,182,106,0.14);
}

.program-number{
	width:54px;
	height:54px;
	display:flex;
	align-items:center;
	justify-content:center;
	margin:0 0 18px;
	border-radius:50%;
	background:var(--yellow);
	color:#7a4200;
	font-weight:900;
	font-size:1.25rem;
}

.program-card h3{
	margin:0;
	font-size:1.48rem;
	line-height:1.35;
}

.program-sub{
	margin:10px 0 16px;
	color:#d45400;
	font-weight:900;
}

.teacher{
	margin:18px 0;
	padding:18px;
	background:#fff8de;
	border-radius:8px;
}

.teacher h4{
	margin:0 0 8px;
	color:#9a4d00;
}

.teacher p{
	margin:0;
	font-size:0.94rem;
}

.program-card > a{
	margin:auto 0 0;
	font-weight:900;
}

.access-layout{
	align-items:center;
}

.access-name{
	font-size:1.45rem;
	font-weight:900;
	color:#9a4d00;
}

.access-layout figure{
	margin:0;
	padding:26px;
	text-align:center;
	background:#fff;
	border:4px solid var(--yellow);
	border-radius:8px;
}

.guide-list{
	display:grid;
	gap:14px;
	margin:0;
	padding:0;
	list-style:none;
}

.guide-list li{
	position:relative;
	padding:16px 18px 16px 48px;
	background:#fff;
	border-radius:8px;
	border:2px solid var(--line);
	font-weight:700;
}

.guide-list li:before{
	content:"";
	position:absolute;
	left:18px;
	top:22px;
	width:14px;
	height:14px;
	border-radius:50%;
	background:var(--orange);
}

.cta{
	padding:70px 0;
	text-align:center;
	background:var(--orange);
	color:#fff;
}

.cta p,
.cta h2{
	margin:0 0 20px;
}

.cta h2{
	font-size:clamp(1.9rem, 3.4vw, 3.2rem);
	line-height:1.3;
}

.cta .btn-custom{
	background:#fff;
	color:#c65000;
}

footer{
	padding:34px 0 44px;
	text-align:center;
	background:#fff;
}

footer img{
	width:180px;
}

footer p{
	margin:0 0 8px;
}

.modal{
	display:none;
	position:fixed;
	inset:0;
	z-index:100;
	padding:28px 0;
	overflow:auto;
	background:rgba(41,35,22,0.64);
}

.modal-box{
	position:relative;
	width:min(720px, calc(100% - 36px));
	margin:0 auto;
	padding:34px;
	background:#fffdf6;
	border:5px solid var(--yellow);
	border-radius:8px;
	box-shadow:0 24px 80px rgba(0,0,0,0.28);
}

.modal-close{
	position:absolute;
	top:16px;
	right:16px;
	width:42px;
	height:42px;
	border:0;
	border-radius:50%;
	background:var(--ink);
	color:#fff;
	font-size:1.8rem;
	line-height:1;
	cursor:pointer;
}

.modal-box h2{
	margin:0 0 20px;
	font-size:2rem;
}

form{
	display:grid;
	gap:16px;
}

form label,
fieldset{
	display:grid;
	gap:8px;
	margin:0;
	font-weight:900;
}

fieldset{
	padding:16px;
	border:2px solid var(--line);
	border-radius:8px;
}

fieldset label{
	display:flex;
	align-items:flex-start;
	gap:8px;
	font-weight:700;
}

legend{
	padding:0 8px;
	font-weight:900;
}

form input[type="text"],
form input[type="tel"],
form input[type="email"],
form textarea{
	width:100%;
	padding:13px 14px;
	border:2px solid #e2c36a;
	border-radius:8px;
	background:#fff;
	color:var(--ink);
	outline:none;
}

form input:focus,
form textarea:focus{
	border-color:var(--orange);
	box-shadow:0 0 0 4px rgba(255,138,31,0.18);
}

form input[type="checkbox"]{
	width:20px;
	height:20px;
	margin:3px 0 0;
	accent-color:var(--orange);
}

.form-error{
	margin:0 0 18px;
	padding:16px;
	background:#fff0f0;
	border:2px solid #ffb2b2;
	border-radius:8px;
	text-align:left;
}

.form-error h3{
	margin:0 0 8px;
	color:#c91f1f;
}

.form-error ul{
	margin:0;
	padding-left:1.2em;
	color:#c91f1f;
}

#reserve-feedback.is-success{
	margin:0 0 18px;
	padding:20px;
	background:#eafff1;
	border:2px solid #8be0a8;
	border-radius:8px;
	font-weight:900;
}