@charset "UTF-8";
html {
	scroll-padding-top: 100px;
}
#qs p {
	text-align: center;
}
#qs .midashi {
	font-size: 1.333rem;
	font-weight: bold;
	margin: 0 0 15px;
	
}
#qs ul {
	margin: 60px 5% 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#qs ul li {
	width: 49%;
	margin: 0 0 10px;
}
#qs ul li a {
	color: var(--theme-color-2);
	text-decoration: none;
	background: #FFF;
	border: solid 1px var(--theme-color-2);
	border-radius: 5px;
	padding: 10px 40px 10px 20px;
	display: block;
	position: relative;
}
#qs ul li a::after {
	content: " ";
	width: 6px;
	height: 6px;
	border-right: solid 2px var(--theme-color-2);
	border-bottom: solid 2px var(--theme-color-2);
	position: absolute;
	top: calc(10px + .5em);
	right: 20px;
	transform: rotate(45deg);
}
.as dl {
	margin: 0 20px;
}
.as dt {
	font-size: 1.33rem;
	border-top: solid 1px #EEE;
	margin: 20px 0 1em 0;
	padding: 20px 50px 0 3em;
	position: relative;
	cursor: pointer;
}
.as dt:hover {
	color: #999;
}

.as dt:first-of-type {
	border-top: none;
}
.as dt::before {
	content: "Q.";
	color: var(--theme-color-2);
	font-family: 'EB Garamond', serif;
	font-size: 2.5rem;
	font-style: italic;
	position: absolute;
	top: 5px;
	left: 0;
}
.as dt::after {
	content: "＋";
	color: #FFF;
	font-size: .9rem;
	background: var(--theme-color-2);
	padding: 0 .2em;
	position: absolute;
	top: 25px;
	right: 5px;
}
.as dt.cr::after {
	content: "－";
}
.as dd {
	margin: 0 0 0 60px;
	padding: 0 0 0 4em;
	position: relative;
	display: none;
}
.as dd::before {
	content: "A.";
	color: #3DA1EF;
	font-family: 'EB Garamond', serif;
	font-size: 2.5rem;
	font-style: italic;
	position: absolute;
	top: -10px;
	left: 0;
}
.as dd table {
	border-color: #7E7E7E;
	margin: 30px 0 20px;
	display: block;
}

/* FOR smartphone landscape
***************************************************************************/
@media screen and (max-width:899px) {
	html {
		scroll-padding-top: 12vw;
	}
	#qs p {
		text-align: center;
	}
	#qs .midashi {
		margin: 0 0 5vw;
		
	}
	#qs ul {
		margin: 10vw 0 0;
		display: block;
	}
	#qs ul li {
		width: 100%;
		margin: 0 0 2vw;
	}
	#qs ul li a {
		padding: 6px 40px 6px 20px;
	}
	#qs ul li a::after {
		top: calc(6px + .5em);
	}
	.as {
		padding-top: 27vw;
		margin-top: -27vw;
	}
	.as .h-type2 {
		font-size: 1.35rem;
	}

	.as dl {
		margin: 0;
	}
	.as dt {
		font-size: 1rem;
		margin: 5vw 0 1em 0;
		padding: 5vw 10vw 0 3em;
		position: relative;
		cursor: default;
	}
	.as dt:hover {
		color: var(--text-color-main);
	}

	.as dt:first-of-type {
		border-top: none;
	}
	.as dt::before {
		font-size: 2rem;
	}
	.as dt::after {
		top: 5vw;
	}
	.as dt.cr::after {
	}
	.as dd {
		margin: 0 0 0 1em;
		padding: 0 0 0 3.5em;
		position: relative;
	}
	.as dd::before {
	}
	.as dd table {
		margin: 3vw 0;
	}

}