@charset "UTF-8";


/*  common
================ */
body {
  background-position: center 100dvh;
}

#container {
  padding-top: 0;
}
@media (min-width: 992px) {
	#container {
		padding-top: 0;
	}
}


/*  MV
================ */
#mv {
	background: var(--white);
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	background-position: center;
	background-size: cover;
	position: relative;
}


.result ul {
	list-style-type: none;
	padding-left: 0;
	font-size: 1.125em;
	font-weight: 700;
	max-width: 17em;
	margin: 1em auto 2em;
}
@media (min-width: 576px) {
	.result ul {
		max-width: 27em;
	}
}
.result ul li {
	display: flex;
	align-items: flex-start;
	margin-bottom: .75em;
}
.result .badge {
  display: inline-block;
  width: 7em;
  flex: 0 0 7em;
  font-size: .8em;
  line-height: 1;
  padding: .75em 0;
  white-space: nowrap;
  text-decoration: none;
  text-align: center;
  border-radius: 4px;
  background-color: var(--black);
  color: var(--white);
  margin-right: 1em;
}
.result .badge.b1 {
  background-color: #c1ab05;
}
.result .badge.b2 {
  background-color: #abb1b5;
}
.result .badge.b3 {
  background-color: #ac6b25;
}
.result .badge.bs {
  background-color: rgba(235,103,53,.1);
  color: var(--color6);
}


/*  color
================ */
main > section:nth-of-type(1) .headline .ttl {color: var(--color6);}
main > section:nth-of-type(1) .box h3 {background: var(--color6);}

main > section:nth-of-type(2) .headline .ttl {color: var(--color1);}
main > section:nth-of-type(2) .box h3 {background: var(--color1);}

main > section:nth-of-type(3) .headline .ttl {color: var(--color2);}
main > section:nth-of-type(3) .box h3 {background: var(--color2);}

main > section:nth-of-type(4) .headline .ttl {color: var(--color3);}
main > section:nth-of-type(4) .box h3 {background: var(--color3);}

main > section:nth-of-type(5) .headline .ttl {color: var(--color4);}
main > section:nth-of-type(5) .box h3 {background: var(--color4);}

main > section:nth-of-type(6) .headline .ttl,
main > section:nth-of-type(6) .faq-list .faq--q::before,
main > section:nth-of-type(6) .faq-list .faq--q::after {
	color: var(--color5);
}