@charset "UTF-8";

/*common*/
:root {
	--black: #000000;
	--gray: #272727;
	--white: #ffffff;
	--white2: #e2e2e2;
	--blue: #44b2ff;
	--light-blue: #c0e0f7;
	--btn-blue1: #2f81c3;
	--btn-blue2: #355e92;
	--fs-8: 0.5rem;
	--fs-10: 0.625rem;
	--fs-12: 0.75rem;
	--fs-14: 0.875rem;
	--fs-16: 1rem;
	--fs-18: 1.125rem;
	--fs-20: 1.25rem;
	--fs-22: 1.375rem;
	--fs-24: 1.5rem;
	--fs-26: 1.625rem;
	--fs-28: 1.75rem;
	--fs-30: 1.875rem;
	--fs-32: 2rem;
	--fs-34: 2.125rem;
	--fs-36: 2.25rem;
	--fs-38: 2.375rem;
	--fs-40: 2.5rem;
	--serif: serif;
	--sans-serif: sans-serif;
}
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}
body {
	font-size: var(--fs-14);
	color: var(--white);
	background-color: var(--black);
	line-height: 1.4;
	text-align: center;
}
img {
	max-width: 100%;
	margin: 0 auto;
	display: block;
}
p {
	padding: 30px 0;
}
input[type="text"],
input[type="tel"] {
	width: 90%;
	max-width: 800px;
	padding: 10px;
	margin-bottom: 30px;
	text-align: center;
}
button[type="submit"] {
	width: 90%;
	border: none;
	outline: none;
	background: transparent;
	cursor: pointer;
}
a {
	color: var(--blue);
}
.pc {
	display: none;
}
.sp {
	display: block;
}
.img__w {
	width: 100%;
}
.heading {
	font-size: var(--fs-22);
	font-family: var(--serif);
	font-weight: bold;
}
.video__wrapper {
	margin: 0 auto;
	max-width: 980px;
	width: 90%;
}
.wrapper {
	max-width: 980px;
	margin: 0 auto;
	padding: 0 10px;
}
.text__em {
	color: var(--blue);
}
.common__page {
	background: linear-gradient(90deg, var(--white), var(--white2));
	padding: 40px 0 60px;
	color: var(--black);
	text-align: left;
}
.common__page dt {
	font-weight: bold;
	margin-bottom: 3px;
}
.common__page dd {
	margin-bottom: 40px;
	border-bottom: 1px solid var(--gray);
	padding-bottom: 3px;
}
.common__page ol {
	margin: 20px 0;
}
.common__page li {
	margin-left: 1.5em;
	padding-left: 0.5em;
}
.heading__top {
	padding: 20px 0;
}


/*fv*/
.fv .heading {
	color: var(--gray);
	background: linear-gradient(90deg, var(--white), var(--white2));
	padding: 15px;
}

/*fv__bottom*/
.fv__bottom {
	background: url(../img/fv__bottom__bg.jpg) no-repeat;
	background-size: cover;
	padding: 50px 0;
}

/*quo*/

.quo {
	background-color: var(--gray);
	padding: 50px 10px 100px;
	margin-bottom: -7%;
}

/*form*/
.form {
    width: 100%;
    margin: 0;
    padding: 100px 0;
    position: relative;
	color: var(--black);
}
.form::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(90deg, var(--white), var(--white2));
    transform: skewY(-7deg);
    z-index: 2;
}
.form .wrapper {
    position: relative;
    z-index: 3;
}

/*point1*/
.point1 {
	background: url(../img/point1__bg.jpg) no-repeat center;
	background-size: cover;
	padding: 100px 0;
	margin-top: -10%;
}
.point1__img__wrapper {
	position: relative;
	margin-bottom: 30px;
}
.point1__img__wrapper::before {
	position: absolute;
	top: 15%;
	right: -7%;
	content: url(../img/point1__after.png);
}
.point1 p {
	text-align: left;
}

/*point2*/
.point2 {
	margin-top: -5%;
	text-align: left;
}

/*point3*/
.point3 {
	padding: 50px 0 100px;
	background: url(../img/point3__bg.jpg) no-repeat bottom;
	background-size: cover;
	margin-top: -10%;
}
.point3__list {
	margin: 30px auto;
}
.point3 .heading {
	margin-bottom: 30px;
}

/*dream*/
.dream {
	position: relative;
}
.dream__top {
	position: absolute;
	top: -5%;
	right: 0;
	left: 0;
	z-index: 2;
	padding: 0 10px;
}
.dream__inner {
	background-color: var(--gray);
    position: relative;
    padding-top: 40%;
    z-index: 1;
}
.dream__text {
	margin: 30px 0;
}


/*hit*/
.hit {
	padding: 50px 10px;
	text-align: center;
	background: url(../img/hit__bg.jpg) no-repeat center;
}
.hit__title {
	margin-bottom: 30px;
}
.hit__list {
	margin-bottom: 30px;
}
.hit__list img {
	display: block;
	margin-bottom: 10px;
}

/*footer*/
footer {
	padding: 70px 10px 50px;
}
footer .footer__link {
	display: grid;
}
footer a {
	color: var(--white);
	text-decoration: none;
	padding: 5px;
	margin: 0 5px;
}
footer .copyright {
	margin-top: 30px;
	font-size: var(--fs-10);
}

/*confirm*/
.confirm .form::before {
	transform: skewY(0deg);
}
.confirm dd{
	max-width: 800px;
	width: 90%;
	margin: 0 auto 30px;
	padding: 10px;
	font-size: var(--fs-22);
	text-align: center;
	background: var(--light-blue);
	border: 1px solid var(--gray);
}
.confirm dd:nth-last-of-type(1) {
	background: unset;
	border: none;
}

@media (min-width: 981px) {
	.heading {
		font-size: var(--fs-34);
	}
	.pc {
		display: block;
	}
	.sp {
		display: none;
	}
	body {
		font-size: var(--fs-20);
	}
	p {
		padding: 50px 0;
	}
	/*fv*/
	/*fv__bottom*/
	/*quo*/
	.quo {
		padding: 50px 10px 300px;
		margin-bottom: -10%;
	}
	/*form*/
	/*point1*/
	.point1 {
		padding: 200px 0;
	}
	.point1__img__wrapper {
		margin-bottom: 50px;
	}
	/*point2*/
	/*point3*/
	.point3 {
		padding: 200px 0;
	}

	/*dream*/
	.dream__top {
		padding: 0;
		top: -10%;
	}
	.dream__inner {
		padding-top: 350px;
	}

	/*hit*/

	/*footer*/
	footer .footer__link {
		display: flex;
		justify-content: center;
	}
	footer .copyright {
		font-size: var(--fs-14);
	}
}
