@charset "utf-8";
/* CSS Document */


.pcOnlyB{
	display:none;
}

.pcOnlyI{
	display:none;
}

/* トップページ */

.header{
	background: url(../img/header.jpg) no-repeat center top;
	background-size: 100% 100%;
	padding: 2rem 1rem;
	margin-bottom: var(--section-bottom);
}

.header__subtitle{
	color: var(--color2);
	font-weight: 800;
	font-size: 2rem;
}

.header__title{
	background: url(../img/logo.png) no-repeat center left;
	background-size: 4rem;
	padding: 4rem 0 4rem  6rem;
	font-weight: 900;
	color: var(--color2);
	font-size: 3.6rem;
	width: fit-content;
	margin-inline: auto;
	margin-bottom: 2rem;
}

.header__localNav{
	display: flex;
	gap: 2rem;
	justify-content: center;
	& img{
		width: 22rem;
	}
}

.secWEBP{
	padding: 0 var(--section-side) var(--block-bottom);
}

.webp__about{
	background-color: var(--bgcolor1);
	display: grid;
	grid-template-columns: auto 14rem;
	padding: 4rem 2rem;
	gap: 1rem;
	margin-bottom: var(--block-bottom);
}

.webp__about__list{
	text-align: left;
	color: var(--color2);
	font-weight: 800;
	font-size: 2rem;
	li:not(:last-child){
		margin-bottom: 0.6em;
	}
	& li:before{
		content:"●";
		padding-right: 0.2em;
	}
	li .link{
		padding-left: 1.2em;
		font-size: 1.6rem;
		display: inline-block;
		font-weight: normal;
	}

	li a{
		color: var(--color2);
		&:after{
			content: "";
			width: 0.6em;
			height: 0.6em;
			background: url(../img/blank.svg) no-repeat center center;
			background-size: contain;
			display: inline-block;
			margin-left: 0.25em;
			margin-bottom: 0.1em;
		}
	}
}

.secNEW{
	background: url(../img/bg.jpg) repeat;
	padding: var(--block-bottom) var(--section-side) var(--section-bottom);

}

.new__about{
	background-color: var(--bgcolor2);
	margin-bottom: var(--block-bottom);
	padding: 4rem;
}

.new__about__list{
	display: grid;
	grid-template-columns: 1fr;
	text-align: left;
	gap: 1.6rem;
	li{
		color: var(--color2);
		font-weight: 800;
		font-size: 2.4rem;
		&:before{
			content: "●";
			padding-right: 0.2em;
		}
	}
}

.new__abut__etc{
	color: var(--color2);
	text-align: right;
	font-weight: 700;
	font-size: 2.4rem;
}

.new__flow{
	margin-bottom: var(--block-bottom)
}

.new__use{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.5rem;
	margin-bottom: var(--block-bottom)
}

.new__use__box{
	background-color: #FFF;
	padding: 1rem 1rem 2rem 1rem;
	dt{
		background-color: var(--color3);
		color: #FFF;
		padding: 0.5rem;
		border-radius: 0.3rem;
		margin-bottom: 1rem;
	}
	dd{
		color: var(--color2);
		font-size: 2rem;
		&>img{
			width: 0.8em;
			vertical-align: middle;
			margin-inline: 0.2em;
		}
		.v1{
			font-size: 2.6rem;
			color: #CC0000;
			.v2{
				font-size: 2rem;
			}
		}
		.kangen{
			background-color: var(--bgcolor3);
			padding: 0.2rem 2rem 0.4rem;
			width: fit-content;
			margin-inline: auto;
			margin-top: 1rem;
		}
	}

	&:last-child{
		grid-row: 2/3;
		grid-column: 1/3;
		& dd .kangen{
			display: inline-block;
			margin-left: 2rem;
		}
	}
}

.new__tokuten{
	background-color: #FFF;
	padding: 2rem;
	margin-bottom: 7rem;
	text-align: left;
	color: var(--color2);
	font-weight: 800;
}

ul.new__tokuten__list{
	li{
		padding-left: 1em;
		position: relative;
		margin-bottom: 2rem;
		font-size: 2.4rem;
		line-height: 1.2;
		&:before{
			content: "・";
			display: block;
			position: absolute;
			left: 0;
			top: 0;
		}
		.v1{
			font-size: 1.6rem;
			font-weight: 500;
		}
	}
}

ul.new__tokuten__list.isOriginal{
	li{
		.name{
			margin-bottom: 1rem;
		}
		.hotel{
			display: flex;
			gap: 1rem;
			justify-content: flex-end;
			&>span{
				display: block;
				color: #FFF;
				background-color: var(--color2);
				font-weight: 400;
				border-radius: 0.3rem;
				line-height: 1;
				padding: 0.5rem 1rem 0.6rem;
				font-size: 1.4rem;
				min-width: 7em;
				text-align: center;
				&.none{
					opacity: 0.4;
				}
			}
		}
	}
}

ul.new__tokuten__list.isOriginal
li .hotel>span.tsuki{
	background-color: #736357;
}
ul.new__tokuten__list.isOriginal
li .hotel>span.sakata{
	background-color: #34aeaa;
}
ul.new__tokuten__list.isOriginal
li .hotel>span.tsuruoka{
	background-color: #0a50a1;
}

.new__tokuten .other{
	text-align: center;
	font-weight: 800;
	font-size: 2rem;
}

.faq{
	background-color: #FFF;
	padding: 2rem;
	text-align: left;
	margin-bottom: var(--block-bottom);
	details{
		padding-bottom: 1rem;
		margin-bottom: 1rem;
		border-bottom: dotted 0.2rem var(--color2);
		summary{
			list-style: none;
			display: grid;
			grid-template-columns: 1em auto 1.4em;
			gap:1em;
			color: var(--color2);
			font-weight: 600;
			&:before{
				content:"Q";
			}
			&:after{
				content: "+";
				background-color: var(--color2);
				display: grid;
				place-content: center;
				aspect-ratio: 1/1;
				height: 1.4em;
				line-height: 1;
				color: #FFF;
				text-align: center;
				border-radius: 1.4em;
			}
		}

		&>div{
			padding-top:1rem;

			display: grid;
			grid-template-columns: 1em auto;
			gap: 1em;
			&:before{
				content: "A";
				font-weight: 600;
			}
		}
	}
}

.faq details[open]{
	summary{
		opacity: 0.7;
		&:after{
			content: "ー";
		}
	}
}

.contact{
	background-color: #FFF;
	padding: 2rem;
	text-align: left;
}

.contactBtn{
	display: block;
	background-color: var(--color3);
	color: #FFF !important;
	text-decoration: none;
	text-align: center;
	padding: 2rem 2rem;
	font-weight: 900;
	margin-top: 1rem;
	border-radius: 50vw;
	&:after{
		content: "";
		background: url(../img/blank_w.svg) no-repeat;
		background-size: contain;
		width: 1em;
		height: 1em;
		display: inline-block;
		margin-left: 0.5em;
	}
}