@charset "utf-8";

.sub-page .hico-parking {
	--parking-red: #dc3323;
	--parking-ink: #20201e;
	--parking-muted: #70706b;
	--parking-line: #d8d8d3;
	--parking-soft: #f5f5f2;
	--parking-radius: 24px;
	padding: clamp(30px, 4vw, 58px) 0 clamp(90px, 10vw, 150px);
	color: var(--parking-ink);
}

.sub-page .hico-parking,
.sub-page .hico-parking * {
	box-sizing: border-box;
}


.sub-page .hico-parking__intro {grid-template-columns: minmax(0, 0.7fr) minmax(560px, .3fr); justify-content: space-between;}




.sub-page .hico-parking__eyebrow,
.sub-page .hico-parking__section-head > div > p {
	margin: 0 0 16px;
	color: #777772;
	font-size: 18px;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: .12em;
}

.hico-parking__intro p  br {display:block;}



.sub-page .hico-parking__eyebrow {
	color: var(--parking-red);
}

.sub-page .hico-parking__overview {
	display: grid;
	grid-template-columns: minmax(440px, .9fr) minmax(340px, 1.1fr);
	align-items: stretch;
	gap: clamp(24px, 3vw, 42px);
}

.sub-page .hico-parking__fee {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 42px;
	padding: clamp(40px, 4vw, 58px) clamp(24px, 3vw, 42px);
	border-top: 2px solid #000;
	border-bottom: 1px solid #000;
	color: var(--parking-ink);
	background: #fff;
}

.sub-page .hico-parking__fee p,
.sub-page .hico-parking__fee h3 {
	margin: 0;
}

.sub-page .hico-parking__fee > div > p {
	margin-bottom: 15px;
	color: #777772;
	font-size: 18px;
	font-weight: 750;
	letter-spacing: .12em;
}

.sub-page .hico-parking__fee h3 {
	font-size: clamp(39px, 4.5vw, 62px);
	font-weight: 500;
	line-height: 1.12;
	letter-spacing: -.05em;
}

.sub-page .hico-parking__fee h3 strong {
	font-weight: 850;
}

.sub-page .hico-parking__fee > p {
	color: var(--parking-muted);
	font-size: 18px;
	font-weight: 550;
	line-height: 1.75;
	word-break: keep-all;
}

.sub-page .hico-parking__facts {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	margin: 0;
	padding: 30px;
	border-radius: var(--parking-radius);
	background: var(--parking-soft);
}

.sub-page .hico-parking__facts > div {
	min-width: 0;
	padding: 24px 28px;
}

.sub-page .hico-parking__facts > div:nth-child(even) {
	border-left: 1px solid var(--parking-line);
}

.sub-page .hico-parking__facts > div:nth-child(n + 3) {
	border-top: 1px solid var(--parking-line);
}

.sub-page .hico-parking__facts dt,
.sub-page .hico-parking__facts dd {
	margin: 0;
}

.sub-page .hico-parking__facts dt {
	margin-bottom: 11px;
	color: var(--parking-muted);
	font-size: 18px;
	font-weight: 550;
}

.sub-page .hico-parking__facts dd {
	font-size: clamp(32px, 3vw, 44px);
	font-weight: 780;
	line-height: 1;
	letter-spacing: -.04em;
	font-variant-numeric: tabular-nums;
}

.sub-page .hico-parking__facts small {
	margin-left: 4px;
	font-size: 18px;
	font-weight: 550;
}

.sub-page .hico-parking__facts .is-ev dd {
	color: var(--parking-ink);
}

.sub-page .hico-parking__capacity,
.sub-page .hico-parking__guide,
.sub-page .hico-parking__plan {
	margin-top: clamp(100px, 11vw, 160px);
}

.sub-page .hico-parking__capacity-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr);
	align-items: stretch;
	gap: clamp(24px, 3vw, 42px);
}

.sub-page .hico-parking__capacity-visual {
	display: grid;
	grid-template-columns: 1fr;
	gap: 12px;
	min-height: 0;
}

.sub-page .hico-parking__capacity-visual > div {
	display: flex;
	min-width: 0;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	padding: 30px 32px;
	border-radius: 16px;
}

.sub-page .hico-parking__capacity-visual .is-ground {
	color: #fff;
	background: #4b4b47;
}

.sub-page .hico-parking__capacity-visual .is-basement {
	color: var(--parking-ink);
	background: #e8e8e3;
}

.sub-page .hico-parking__capacity-visual span {
	font-size: 18px;
	font-weight: 750;
	letter-spacing: .1em;
}

.sub-page .hico-parking__capacity-visual strong {
	font-size: clamp(30px, 3vw, 44px);
	font-weight: 800;
	line-height: 1;
	letter-spacing: -.04em;
}

.sub-page .hico-parking__ev {
	display: grid;
	grid-template-columns: 96px minmax(0, 1fr);
	align-items: start;
	gap: clamp(24px, 3vw, 38px);
background: var(--parking-red);
	margin: 0;
	padding: clamp(38px, 4.5vw, 64px);
	border-radius: var(--parking-radius);
}

.sub-page .hico-parking__ev-icon {
	display: grid;
	width: 84px;
	height: 84px;
	place-items: center;
	border-radius: 50%;
	color: var(--parking-red);
	background: #fff;
}

.sub-page .hico-parking__ev-icon svg {
	width: 38px;
	height: 38px;
	fill:  var(--parking-red);
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.8;
}

.sub-page .hico-parking__ev p,
.sub-page .hico-parking__ev h4,
.sub-page .hico-parking__ev span {
	margin: 0;
}

.sub-page .hico-parking__ev p {
	margin-bottom: 8px;
	color:#fff;
	font-size: 18px;
	font-weight: 800;
	letter-spacing: .1em;
}

.sub-page .hico-parking__ev h4 {
	font-size: clamp(28px, 3vw, 42px);
	font-weight: 750;
	line-height: 1.25;
	letter-spacing: -.035em;
	color:#fff;
}

.sub-page .hico-parking__ev span {
	display: block;
	margin-top: 9px;
	color:#fff;
	opacity:0.7;
	font-size: 18px;
	font-weight: 500;
	line-height: 1.55;
}

.sub-page .hico-parking__guide ol {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 18px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.sub-page .hico-parking__guide li {
	display: flex;
	min-width: 0;
	min-height: 250px;
	flex-direction: column;
	align-items: flex-start;
	gap: 30px;
	padding: 20px 60px;
	border-left: 1px solid var(--parking-line);
/* 	border-radius: var(--parking-radius); */
/* 	background: #fff; */
}

.sub-page .hico-parking__guide li:nth-child(1) {padding-left:0px; border-left:none;}





.sub-page .hico-parking__guide-icon {
	display: grid;
	width: 72px;
	height: 72px;
	flex: 0 0 72px;
	place-items: center;
	border-radius: 50%;
	color: #fff;
	background:#4b4b47;
}

.sub-page .hico-parking__guide-icon svg {
	width: 36px;
	height: 36px;
	fill: none;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.8;
}

.sub-page .hico-parking__guide strong {
	display: block;
	margin-bottom: 8px;
	font-size: 23px;
	font-weight: 750;
}

.sub-page .hico-parking__guide li p {
	margin: 0;
	color: var(--parking-muted);
	font-size: 18px;
	font-weight: 500;
	line-height: 1.65;
	word-break: keep-all;
}

.sub-page .hico-parking__plan {
	display: grid;
	grid-template-columns: minmax(400px, .5fr) minmax(0, 1.5fr);
	align-items: stretch;
	overflow: hidden;
	padding: 0;
	border: 1px solid var(--parking-line);
	border-radius: var(--parking-radius);
	background: var(--parking-soft);
}

.sub-page .hico-parking__plan .hico-parking__section-head {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	gap: 24px;
	margin: 0;
	padding: clamp(42px, 5vw, 70px);
}

.sub-page .hico-parking__plan .hico-parking__section-head > p {
	margin: 0;
}

.sub-page .hico-parking__plan > figure {
	display: grid;
	min-width: 0;
	margin: 0;
	padding: clamp(28px, 4vw, 58px);
	place-items: center;
	background: var(--parking-soft);
}

.sub-page .hico-parking__plan > figure img {
	display: block;
	width: 100%;
	height: auto;
	max-height: 740px;
	mix-blend-mode: multiply;
	object-fit: contain;
}

.sub-page .hico-parking__contact {
	display: grid;
	grid-template-columns: 58px minmax(0, 1fr) auto;
	align-items: center;
	gap: 24px;
	margin-top: 36px;
	padding: 50px 36px;
	border-radius: var(--parking-radius);
background: url('/img_new/intbg.gif') no-repeat right bottom;
}

.sub-page .hico-parking__contact-icon {
	width: 42px;
	height: 42px;
	fill: none;
	stroke: var(--parking-red);
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 1.8;
}

.sub-page .hico-parking__contact p {
	margin: 0;
	font-size: clamp(25px, 2.5vw, 30px);
	font-weight:700;
	line-height:1.4;
	 color:var(--parking-red);
}

.sub-page .hico-parking__contact a {
	font-size: clamp(23px, 2.5vw, 30px);
	font-weight: 700;
	text-decoration: none;
	transition: color 180ms ease;
}

.sub-page .hico-parking__contact a:hover,
.sub-page .hico-parking__contact a:focus-visible {
	text-decoration: underline;
	text-underline-offset: 4px;
}

@media (max-width: 900px) {
	.sub-page .hico-parking__intro,
	.sub-page .hico-parking__overview,
	.sub-page .hico-parking__section-head {
		grid-template-columns: 1fr;
		gap: 24px;
	}

	.sub-page .hico-parking__capacity-grid {
		grid-template-columns: 1fr;
	}

	.sub-page .hico-parking__guide ol {
		grid-template-columns: 1fr;
	}

	.sub-page .hico-parking__guide li {
		min-height: 0;
		flex-direction: row;
		align-items: center;
	}

	.sub-page .hico-parking__plan {
		grid-template-columns: minmax(250px, .55fr) minmax(0, 1.45fr);
	}
}

@media (max-width: 640px) {
	.sub-page .hico-parking {
		padding-top: 18px;
	}

	.sub-page .hico-parking__intro {
		margin-bottom: 38px;
	}

	.sub-page .hico-parking__intro h2 {
		font-size: 41px;
	}

	.sub-page .hico-parking__intro > p {
		font-size: 18px;
	}

	.sub-page .hico-parking__fee {
		padding: 38px 24px 42px;
		border:1px solid #000;
		border-radius: var(--parking-radius);
	}

	.sub-page .hico-parking__fee h3 {
		font-size: 40px;
	}

	.sub-page .hico-parking__facts > div {
		padding: 22px 14px;
	}

	.sub-page .hico-parking__section-head h3 {
		font-size: 39px;
	}

	.sub-page .hico-parking__capacity-visual {
		grid-template-columns: 1fr;
	}

	.sub-page .hico-parking__capacity-visual > div {
		min-height: 112px;
		padding: 24px;
	}

	.sub-page .hico-parking__ev {
		grid-template-columns: 60px minmax(0, 1fr);
		gap: 18px;
		padding: 30px 24px;
	}

	.sub-page .hico-parking__ev-icon {
		width: 60px;
		height: 60px;
	}

	.sub-page .hico-parking__ev-icon svg {
		width: 34px;
		height: 34px;
	}

	.sub-page .hico-parking__guide li {
		gap: 18px;
		padding: 24px;
	}

	.sub-page .hico-parking__plan {
		grid-template-columns: 1fr;
	}

	.sub-page .hico-parking__plan .hico-parking__section-head {
		padding: 38px 24px;
	}

	.sub-page .hico-parking__plan > figure {
		padding: 24px 16px;
	}

	.sub-page .hico-parking__contact {
		grid-template-columns: 44px minmax(0, 1fr);
		gap: 14px;
		padding: 26px 24px;
	}

	.sub-page .hico-parking__contact a {
		grid-column: 2;
	}




.sub-page .hico-parking__guide li {
	border-top: 1px solid var(--parking-line);
border-left:0px;
padding-left:0;
}



.sub-page .hico-parking__guide li:nth-child(1) {padding-left:0px; border-left:none;}


}

@media (prefers-reduced-motion: reduce) {
	.sub-page .hico-parking__contact a {
		transition: none;
	}
}
