@charset "utf-8";


@layer components{
	.lp-ttl{
		line-height: 1.5;
		font-size: 1em;
		font-weight: bold;
	}
	
	
	.lp-btnlist{
		display: flex;
		flex-wrap: wrap;
		gap: 1.25em 2.5em;
		
		&:where(ul, ol){
			list-style: none;
			padding-left: 0;
		}
		
		& > *{
			flex: 1 1 fit-content;
		}
	}
	
	
	.lp-btn{
		line-height: 1.5;
		text-align: center;
		text-decoration: none;
		color: inherit;
		
		display: block;
		padding: 1em;
	}
	
	
	.lp-box{
		padding: var(--box-padding, 1em);
	}
	
	
	.lp-select{
		-webkit-appearance: none;
		appearance: none;
		cursor: pointer;
		
		background: conic-gradient(from -45deg at center bottom, currentcolor 90deg, transparent 0) no-repeat right 1em center / .5em .25em;
		border: 1px solid #999;
		border-radius: .25em;
		padding: .25em 2.25em .25em 1.25em;
		
		&:hover{
			background-color: #f0f0f0;
		}
	}
	
	
	.lp-list{
		&:where(ul, ol){
			list-style: none;
			padding-left: 0;
		}
		&:where(.lp-list--notice){
			list-style: "※";
			margin-left: 1.25em;
		}
	}
	
	
	.lp-withicon{
		display: inline-flex;
		align-items: center;
		gap: 1em;
		
		& > :where(img){
			max-width: 2.75em !important;
		}
	}
	
	
	@media (min-width: 769px){
		.lp-withimg{
			& > *{
				margin-block: 0;
			}
			& > * + *{
				margin-top: 1em;
			}
		}
	}
	@media (max-width: 768px){
		.lp-withimg{
			display: grid;
			grid-template-columns: repeat(2, 1fr);
			gap: 1em;
		}
	}
}


/* rule */
[id]{
	scroll-margin-top: var(--g3-scroll-margin-top);
}

.lp-ttl--section{
	text-align: center;
	font-size: 1.333em;
}


/* wrap */
.gotouchi2026.g3-stack1 > :last-child{
	margin-bottom: 5.625rem !important;
}


/* about */
.lp-about{
	text-align: center;
}

.lp-ttl--about{
	font-size: 1.5625em;
	font-weight: bold;
}
@media (max-width: 768px){
	.lp-ttl--about{
		font-size: 1.333em;
	}
}

.lp-box--period{
	font-size: 1.5625em;
	border: 1px solid;
	border-radius: .5em;
	padding: 0 2em 1em;
	max-width: fit-content;
	margin-inline: auto;
	
	& > *{
		margin-block: 0;
	}
}
@media (max-width: 768px){
	.lp-box--period{
		font-size: 1.333em;
	}
}

.lp-ttl--period{
	font-weight: normal;
	background: white;
	max-width: fit-content;
	margin-inline: auto;
	padding-inline: 1em;
	translate: 0 -.5lh;
}

.lp-note{
	
}

.lp-note--alert{
	color: #D31E1E;
}


/* steps */
.lp-steps{
	counter-reset: i;
	
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 2.5em;
	
	&:where(ul, ol){
		list-style: none;
		padding-left: 0;
	}
	
	& > ::before{
		content: "STEP" counter(i);
		counter-increment: i;
		
		font-size: 1.666em;
		font-weight: bold;
		color: #F6AA00;
		background: linear-gradient(currentcolor 0 0) no-repeat left 3.75em center / 100% 3px;
		display: block;
		margin-bottom: 1.5em;
	}
}

@media (max-width: 768px){
	.lp-steps{
		grid-template-columns: none;
		
		& > ::before{
			max-width: 50%;
			margin-bottom: .75em;
		}
	}
}

.lp-ttl--steps{
	font-size: 1.5em;
	font-weight: normal;
}

.lp-box--hashtag{
	line-height: 1.875;
	font-size: 1.333em;
	text-align: left;
	
	background: #f8f2d6;
	border-radius: .5em;
	box-shadow: 4px 4px 4px 0 rgb(0 0 0 / .25);
	
	&:where(button){
		border: none;
	}
	
	&:where(:active){
		translate: 4px 4px;
		box-shadow: none;
	}
}

@media (max-width: 768px){
	.lp-withimg--step4{
		grid-template-columns: 1fr auto;
	}
}
@media (min-width: 769px){
	.lp-withimg--step4{
		display: grid;
		grid-template-columns: 1fr auto;
		gap: 1em;
		
		& > :not(img){
			display: contents;
		}
		
		& :where(.lp-ttl){
			grid-column: span 2;
		}
		& :where(img){
			margin-top: 1rem;
		}
	}
}

.lp-select-hotel{
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	align-items: flex-start;
	gap: 1em;
}
@media (max-width: 768px){
	.lp-select-hotel{
		flex-direction: row;
	}
}


/* sns */
.lp-btn--sns{
	font-size: 1.333em;
	
	background: #f8f2d6;
	border-radius: .666em;
}