@charset "utf-8";
html {
	-webkit-text-size-adjust: 100%;
}
body {
	font-family: "Noto Sans JP", sans-serif;
	font-size:4.1vw;
	color:#252A2A;
	text-align:center;
	line-height:1.6;
	overflow:hidden;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
}

@media screen and (min-width:769px){
	body{
		font-size:31px;
	}
}

a {
	transition : opacity 0.4s;
	-webkit-transition : opacity 0.4s;
	opacity:1;
	outline:none;
}
a:hover {
	opacity: 0.7;
}

.only_pc{
	display:none !important;
}
.only_pc_f{
	display:none !important;
}
.only_smart{
	display:block !important;
}
.only_smart_i{
	display:inline-block !important;
}

@media screen and (min-width:769px){
	.only_pc{
		display:block !important;
	}
	.only_pc_f{
		display:flex !important;
	}
	.only_smart,
	.only_smart_i{
		display:none !important;
	}
}


img{
	max-width:100%;
}


#wrapper{
	max-width: 750px;
	margin: 0 auto;
	width: 100%;
}


/* header */
header{
	padding-top:5%;
	display:none;
}
header.thanks{
	display:block;
}

header .wrap{
	position:relative;
}
header .wrap h1{
	letter-spacing: .18em;
	font-size: min(38.24px, 5.0986666666666665vw);
}
header .wrap .prev{
	width: min(39.97px, 5.3293333333333335vw);
	line-height:1;
	position:absolute;
	left:7%;
	top:7%;
	cursor:pointer;
	outline:none;
}
header .wrap .prev img{
	width:100%;
}

header .indicator{
	width:90%;
	margin:5% auto 0;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}
header .indicator li{
	width:24%;
	height:4px;
	background-color:#C2CBCA;
	border-radius:100px;
}
header .indicator li.active{
	background-color:#f6750e;
}

@media screen and (min-width:769px){
	header{
		padding-top:40px;
	}
	header .wrap .prev{
		left:12%;
		line-height:1.7;
	}
}

/* font */
.montserrat {
	font-family: "Montserrat", sans-serif;
	font-optical-sizing: auto;
	font-weight: 700;
	font-style: normal;
}


/* article */
/* top */
.top {
	padding-top: min(107px, 14.266666666666666vw); /* 107px */
	padding-bottom: min(85px, 11.333333333333332vw); /* 85px */
	position: relative;
	margin-bottom: min(52px, 6.933333333333333vw); /* 52px */
}
.thanks .top {
	margin-bottom: 0;
}
.top::before {
	content: '';
	width: 100%;
	height: 100%;
	background: url(../img/bg.png) no-repeat center center/cover;
	position: absolute;
	top: 0;
	left: 0;
	/* z-index: -1; */
}
.top h1 {
	letter-spacing: .18em;
	font-size: min(38.24px, 5.0986666666666665vw); /* 38.24px */
	position: relative;
}
.top h2 {
	color: #f6750e;
	font-size: min(75px, 10vw); /* 75px */
	font-weight: 900;
	line-height: 1.2;
	margin-top: min(89px, 11.866666666666667vw); /* 89px */
	position: relative;
}
.top .woman-img {
	margin-top: min(78px, 10.4vw); /* 78px */
	position: relative;
}
.top .woman-img img {
	width: min(400px, 53.333333333333336vw); /* 400px */
	height: auto;
}

/* .ttl-company {
	margin-top: 52px;
	margin-bottom: 57px;
}
.ttl-star {
	margin-top: 110px;
} */


/* .cont */
.cont{
}

/* rating */
.rating {
	display: flex;
	flex-direction: row-reverse;
	justify-content: center;
	font-size: min(68px, 9.066666666666666vw) !important;
	gap: min(20px, 2.666666666666667vw);
	line-height:0.8;
}

.rating input {
	display: none;
}
.rating label {
	cursor: pointer;
	color: #ccc;
	transition: color 0.3s;
}
.rating input:checked ~ label,
.rating label:hover,
.rating label:hover ~ label {
	color: gold;
}



/* テキストボックス */
input[type="text"],
input[type="tel"],
input[type="email"],
input[type="url"],
textarea{
	width:100%;
	height:3.2em;
	padding:0 0.8em;
	background-color:#F3F5F5;
	border:1px solid #fff;
	border-radius:0.5em;
	outline:none;
}
textarea{
	height:12em;
	padding:0.8em;

}
input[type="text"]:-webkit-autofill,
input[type="tel"]:-webkit-autofill,
input[type="email"]:-webkit-autofill,
input[type="url"]:-webkit-autofill,
textarea:-webkit-autofill{
	box-shadow: 0 0 0 1000px #F3F5F5 inset;
}
input[type="text"].error,
input[type="email"].error,
input[type="tel"].error{
	background-color:#ffebe7;
	border:1px solid #ff0000;
}
input[type="text"].error:-webkit-autofill,
input[type="tel"].error:-webkit-autofill,
input[type="email"].error:-webkit-autofill,
input[type="url"].error:-webkit-autofill,
textarea.error:-webkit-autofill{
	box-shadow: 0 0 0 1000px #ffebe7 inset;

}

@media screen and (max-width:480px){
	input[type="text"],
	input[type="email"],
	input[type="tel"]{
		font-size:16px;
	}
}


/* ラジオorチェックボタン */
input[type="radio"],
input[type="checkbox"].btn{
		display:none;
}
input[type="radio"] + span,
input[type="checkbox"].btn + span{
	display:block;
	height:3em;
	line-height:1.2;
	font-weight:bold;
	background-color:#F3F5F5;
	border:2px solid #F3F5F5;
	border-radius:0.5em;
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-items: center;
	align-items: center;
	cursor:pointer;
}
.three input[type="radio"] + span,
.three input[type="checkbox"].btn + span{
	height:2.4em;
}
input[type="radio"]:checked + span,
input[type="checkbox"].btn:checked + span{
	background:#EFFBFA url(../img/check_green.png)no-repeat right 0.5em center;
	background-size:1.2em auto;
	border:2px solid #008A71;
}
.three input[type="radio"]:checked + span,
.three input[type="checkbox"].btn:checked + span{
	background:#EFFBFA url(../img/check_green.png)no-repeat right 0.2em center;
	background-size:1em auto;
	border:2px solid #008A71;
}

@media screen and (min-width:769px){
	input[type="radio"] + span,
	input[type="checkbox"].btn + span{
		font-size:1.1vw;
	}
}


/* チェックボックス */
input[type="checkbox"].check {
	position: relative;
	-webkit-appearance: none;
	appearance: none;
	width: 21px;
	height: 21px;
	background-color: #fff;
	border: 1px solid #9090A4;
	border-radius:3px;
	vertical-align: middle;
	cursor: pointer;
}
input[type="checkbox"].check:checked:after {
	display: block;
	position: absolute;
	top: 0px;
	left: 6px;
	content: "";
	width: 8px;
	height: 14px;
	border-right: 2px solid #f00;
	border-bottom: 2px solid #f00;
	-webkit-transform: rotate(52deg) skew(8deg);
	transform: rotate(52deg) skew(8deg);
	background-color:transparent;
	border-radius:0;
}
input[type="checkbox"].check + span {
	display:inline-block;
	vertical-align:middle;
	margin-left:1em;
	line-height:1.5;
	font-size:3.6vw;
	font-weight:bold;
}

@media screen and (min-width:769px){
	input[type="checkbox"].check + span {
		font-size:1.3vw;
	}
}


/* プレイスホルダー */
input::placeholder,
textarea::placeholder{
	color:#9090A4;
}
input:-ms-input-placeholder,
textarea::placeholder{
	color:#9090A4;
}
input::-ms-input-placeholder,
textarea::placeholder{
	color:#9090A4;
}


/* #step */
#step{
	width:100%;
	min-height:100vh;
	margin:auto;
	overflow:hidden;
}
#step form ol{
	margin:auto;
	position:relative;
}
#step form ol > li{
	padding:5% 0 20%;
	transition : transform 0.4s;
	-webkit-transition : transform 0.4s;
}
#step form ol > li:first-child{
	padding:0;
}
#step form ol > li:nth-child(n+2){
	width:100%;
	position:absolute;
	top:0;
	left:0;
}
#step form ol > li.right{
	-webkit-transform : translate(100%, 0);
	transform : translate(100%, 0);
}
#step form ol > li.left{
	-webkit-transform : translate(-100%, 0);
	transform : translate(-100%, 0);
}

#step form ol > li #top{
	padding:3% 4% 12%;
	background-color:#DEF4F0;
	font-feature-settings: "palt";
}
#step form ol > li #top .head{
	width:32%;
}
#step form ol > li #top h1{
	line-height:1.3;
	font-size:9.6vw;
	font-weight:900;
	color:#008A70;
	letter-spacing:0.01em;
	text-indent:0.01em;
	white-space:nowrap;
}
#step form ol > li #top h1 .top{
	display:block;
	width:8.5em;
	line-height:1.4;
	margin:0 auto 0.3em;
	font-size:4.3vw;
	letter-spacing:0.18em;
	text-indent:0.18em;
	background-color:#fff;
	border:1px solid;
	border-radius:0.2em;
}
#step form ol > li #top h1 .small{
	font-size:7.7vw;
}
#step form ol > li #top h1 + figure{
	margin-top:5%;
	position:relative;
}
#step form ol > li #top h1 + figure figcaption{
	padding-left:0.5em;
	font-weight:500;
	color:#EA8E33;
	text-align:left;
}
#step form ol > li #top h1 + figure img{
	position:absolute;
	width:39%;
	right:2.5%;
	top:0;
}
#step form ol > li #top .point{
	margin-top:3%;
	padding:3% 5% 5%;
	background-color:#fff;
	border:2px solid;
	border-radius:0.5em;
	text-align:left;
}
#step form ol > li #top .point dt{
	margin-bottom:0.3em;
	font-size:4.8vw;
	font-weight:bold;
	color:#434343;
	text-align:center;
}
#step form ol > li #top .point dd{
	line-height:2.4;
	display:inline-block;
	font-weight:500;
	color:#645D5C;
	text-align:left;
	border-bottom:1px solid #C5CFD6;
}

#step form ol > li > h2{
	margin:0 0 7%;
}
#step form ol > li > h2 > span{
	display:block;
	padding:0.8em 0;
	color:#fff;
	background-color:#F77904;
}
#step form ol > li > h2 > span img{
	width:1em;
	margin:0 2em;
	vertical-align:-0.15em;
}

#step form ol > li > .tit{
	padding:0 5% 3%;
	/* text-align:left; */
	text-align: center;
	font-size: min(30.75px, 4.1000000000000005vw);
}
#step form ol > li > .tit + aside{
	width:90%;
	margin:3% auto 1%;
	padding:2.5% 3%;
	font-size:3vw;
	text-align:left;
	color:#333350;
	border:1px solid #D4D4D4;
	border-radius:1em;
}
#step form ol > li > dl{
	padding:0 4%;
	text-align:left;
}
#step form ol > li > dl div:nth-child(n+2){
	display:none;
}
#step form ol > li > dl div dt{
	margin:0 0 0.6em;
	font-weight:bold;
	text-align: center;
}
#step form ol > li > dl div dd {
	margin-bottom:1.8em;
	position:relative;
	text-align: center;
}
.about-privacy {
	margin:-1.5em 0 2em;
	font-size: 3.4vw;
	text-align:center;
}
@media screen and (max-width:480px){
	#step form ol > li > dl div dd{
		font-size:16px;
	}
}
#step form ol > li > dl div dd.active:after{
	content:'';
	display:block;
	width:min(36.9px, 4.92vw);
	height:min(36.9px, 4.92vw);
	/* width:1.2em;
	height:1.2em; */
	background:url(../img/check_green.png)no-repeat left top;
	background-size:100%;
	/* background-size:1.2em auto; */
	position:absolute;
	right:0.5em;
	top:50%;
	z-index:2;
	transform:translateY(-50%);
}
#step form ol > li > dl div dd.active input[type="text"],
#step form ol > li > dl div dd.active input[type="tel"],
#step form ol > li > dl div dd.active input[type="email"],
#step form ol > li > dl div dd.active input[type="url"],
#step form ol > li > dl div dd.active textarea {
	background:rgba(255,236,50,0.4);
	border:2px solid #f6750e;
} 
#step form ol > li > dl div dd.active input[type="text"]:-webkit-autofill,
#step form ol > li > dl div dd.active input[type="tel"]:-webkit-autofill,
#step form ol > li > dl div dd.active input[type="email"]:-webkit-autofill,
#step form ol > li > dl div dd.active input[type="url"]:-webkit-autofill,
#step form ol > li > dl div dd.active textarea:-webkit-autofill {
	box-shadow: 0 0 0 1000px #fff7ad inset;
}

#step form ol > li > dl div dd p.error{
	color:#f00;
}
#step form ol > li .privacy{
	display:none;
}


#step form ol > li > ul{
	padding:0 4%;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
}
#step form ol > li > ul.radio_list li{
	width:100%;
	margin-top:0.8em;
}
#step form ol > li > ul.radio_list.three li{
	width:31%;
  margin-right:3.5%;
}
#step form ol > li > ul.radio_list.three li:nth-child(3n+3){
	margin-right:0;
}

#step form ol > li > .region{
	display:block;
	margin:6% 0 -2.5%;
	padding:0 5%;
	font-size:3.4vw;
	text-align:left;
}

#step form ol > li .btns{
	margin-top:7%;
}
#step form ol > li .btns .next{
	width:62%;
	line-height:2.8;
	font-weight:bold;
	color:#fff;
	background-color:#C2CBCA;
	border-radius:100px;
	outline:none;
	box-shadow:0 8px 24px rgba(0,0,0,0.12);
	font-size: min(30.75px, 4.1000000000000005vw);
}
#step form ol > li .btns .next img,
#step form ol > li .btns button[type="submit"] img {
	width:1.3em;
	margin-left:0.5em;
	vertical-align:-0.2em;
}
#step form ol > li .btns .next.active{
	background-color: #f6750e;
	cursor:pointer;
}
#step form ol > li .btns button[type="submit"]{
	width:62%;
	line-height:2.8;
	font-weight:bold;
	color:#fff;
	/* background-color:#008A71; */
	background-color: #f6750e;
	border-radius:100px;
	outline:none;
	box-shadow:0 8px 24px rgba(0,0,0,0.12);
	cursor:pointer;
}
#step form ol > li .btns button[type="submit"]:disabled{
	background-color:#C2CBCA;
	cursor:default;
}
#step form ol > li .bottom_link {
	margin-top:18%;
  display:none;
}
#step form ol > li .bottom_link a {
	text-decoration:underline;
	font-size:2.87vw;
	color:#666;
}

@media screen and (min-width:769px){
	#step{
		width:100%;
		min-height:100vh;
		margin:auto;
		overflow:hidden;
	}
	#step form ol{
		margin:auto;
		position:relative;
	}
	#step form ol > li{
		min-height:100vh;
		padding:40px 0 150px;
		transition : transform 0.4s;
		-webkit-transition : transform 0.4s;
	}
	#step form ol > li > h2{
		margin:0 0 9%;
		font-size:1.5vw;
	}
	#step form ol > li > h2 > span{
		padding:0.5em 0;
	}
	#step form ol > li > h2 > span img{
		width:0.7em;
		margin:0 3.7em;
		vertical-align:-0.1em;
	}
	#step form ol > li > dl div dt{
		margin:0 0 1em;
		font-weight:bold;
	}
	
	.about-privacy {
		font-size: 26px;
	}

	#step form ol > li > ul{
		padding:0 12%;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	#step form ol > li > ul.radio_list li{
		width:49%;
		margin-top:0.8em;
	}
	#step form ol > li > ul.radio_list li.w100{
		width:100%;
	}
	#step form ol > li > ul.radio_list li:nth-child(2n+2){
		margin-left:2%;
	}
	#step form ol > li > ul.radio_list li.w100:nth-child(2n+2){
		margin-left:0;
	}
	#step form ol > li > ul.radio_list.three li{
		width:32%;
		margin-right:2%;
		margin-left:0;
	}

	#step form ol > li > .region{
		margin:3% 0 -1.5%;
		padding:0 12%;
		font-size:1vw;
	}

	#step form ol > li .btns{
		margin-top:5%;
	}
	#step form ol > li .btns .next{
		/* width:35%; */
		line-height:3;
	}
	/* #step form ol > li .btns button[type="submit"]{
		width:35%;
		line-height:3;
	} */
	#step form ol > li .bottom_link a {
		font-size:0.9vw;
	}
}



/* #thanks */
#wrapper.thanks{
}
#thanks{
	min-height:88vh;
	padding:9% 0 20%;
	background: url(../img/bg.png) no-repeat center center/cover;
}
#thanks h2{
	font-size:6.2vw;
	color:#f6750e;
}
#thanks h2 img{
	display:block;
	width:5.6em;
	margin:1em auto;
}
#thanks h3{
	position: relative;
	margin-top: min(50px, 6.666666666666667vw);
	margin-bottom: min(50px, 6.666666666666667vw);
}
#thanks p{
	margin-top:1.5em;
	padding:0 8%;
	font-size:3.7vw;
	text-align:left;
	position: relative;
}
#thanks .post-copy {
	padding: 0 9%;
    position: relative;
}

#thanks textarea {
	text-align: left;
	font-size: clamp(16px, 3vw, 28px);
	padding: 15px;
}
#thanks .post-copy ul{
	position:relative;
}
#thanks .post-copy ul:before{
	content:'コピーしました！';
	display:inline-block;
	padding:0 1em;
	white-space:nowrap;
	color:#f6750e;
	background-color:#fff;
	border-radius:100px;
	box-shadow:0 3px 3px rgba(0,0,0,0.12);
	position:absolute;
	bottom:100%;
	left:50%;
	transform:translate(-50%,0);
	opacity:0;
	transition : all 0.5s;
	-webkit-transition : all 0.5s;
}
#thanks .post-copy ul.label:before{
	transform:translate(-50%,-50%);
	opacity:1;
}
#thanks .post-copy ul li{
	margin-top:0.8em;
	padding:0 5%;
}
#thanks .post-copy ul li button{
	display:block;
	width:100%;
	line-height:2.8;
	font-size: 3.7vw;
	font-weight:bold;
	color:#fff;
	border-radius:100px;
	box-shadow:0 3px 3px rgba(0,0,0,0.12);
	outline:none;
	cursor:pointer;
}
#thanks .post-copy ul li button.bg_orange{
	background-color: #f6750e;
}
#thanks .post-copy ul li button.bg_black{
	background-color: #000;
}
#thanks .post-copy ul li button img{
	width:1.5em;
}

@media screen and (min-width:769px){
	#wrapper.thanks{
		background-color:#fff;
	}
	#thanks{
		min-height:100vh;
	}
	#thanks h2{
		font-size:47px;
	}
	#thanks h2 img{
		display:block;
		width:7em;
		margin:1em auto;
	}
	#thanks p{
		font-size:28px;
	}
	#thanks .post-copy ul li button{
		font-size:28px;
	}
}


/* #overlay */
html.overlay {
	overflow: hidden;
	height: 100%;
}
#overlay {
	position: fixed;
	width: 100%;
	height: 100vh;
	padding: 25vh 3% 20vh;
	top: 0;
	left: 0;
	z-index: 102;
	background-color: rgba(0, 0, 0, 0.5);
	display: none;
}
#overlay > div {
	height:55vh;
	padding: 5%;
	background-color: rgba(255, 255, 255, 1);
	overflow:auto;
	position:relative;
}
#overlay > div a{
	color:#0066ff;
	text-decoration:underline;
}
#overlay > div .right{
	margin-top:1.5em;
	font-size:3.4vw;
	text-align:right;
}
#overlay > div h2{
	margin-bottom:1em;
}
#overlay > div h2 + p{
	margin-bottom:1em;
	font-size:3.4vw;
	text-align:left;
}
#overlay > div table{
	width:100%;
}
#overlay > div table tr{
	border-top:1px solid #ccc;
	border-bottom:1px solid #ccc;
}
#overlay > div table th,
#overlay > div table td{
	font-size:3.4vw;
	text-align:left;
}
#overlay > div table th{
	padding:1em 0;
	vertical-align:top;
	white-space:nowrap;
}
#overlay > div table td{
	padding:1em;
}

#overlay > div dl{
	font-size:3.4vw;
	text-align:left;
}
#overlay > div dl dt{
	margin-top:1.5em;
	font-weight:bold;
}
#overlay > div dl dd .dot{
	padding-left:1.5em;
}
#overlay > div dl dd .dot li{
	list-style:disc;
}
#overlay > div dl dd .num{
	padding-left:1.5em;
}
#overlay > div dl dd .num li{
	list-style:decimal;
}

#overlay .close {
	display: block;
	width: 1.2em;
	line-height: 1.2;
	font-size: 6vw;
	font-weight:500;
	color:#fff;
	background-color: #666666;
	border-radius: 50%;
	cursor: pointer;
	position: absolute;
	z-index:10;
	right: 3%;
	bottom: 20vh;
	transform:translateY(120%);
}

@media screen and (min-width:769px){
	#overlay {
		position: fixed;
		width: 100%;
		height: 100vh;
		padding: 5vh 3% 20vh;
		overflow:auto;
		top: 0;
		left: 0;
		z-index: 102;
		background-color: rgba(0, 0, 0, 0.5);
		display: none;
	}
	#overlay > div {
		height:75vh;
		padding: 5%;
		background-color: rgba(255, 255, 255, 1);
		overflow:auto;
		position:relative;
	}
	#overlay > div a{
		color:#0066ff;
		text-decoration:underline;
	}
	#overlay > div .right{
		margin-top:1.5em;
		font-size:26px;
		text-align:right;
	}
	#overlay > div h2{
		margin-bottom:1em;
	}
	#overlay > div h2 + p{
		margin-bottom:1em;
		font-size:26px;
		text-align:left;
	}
	#overlay > div table{
		width:100%;
	}
	#overlay > div table tr{
		border-top:1px solid #ccc;
		border-bottom:1px solid #ccc;
	}
	#overlay > div table th,
	#overlay > div table td{
		font-size:26px;
		text-align:left;
	}
	#overlay > div table th{
		padding:1em 0;
		vertical-align:top;
		white-space:nowrap;
	}
	#overlay > div table td{
		padding:1em;
	}
	
	#overlay > div dl{
		font-size:26px;
		text-align:left;
	}
	#overlay > div dl dt{
		margin-top:1.5em;
		font-weight:bold;
	}
	#overlay > div dl dd .dot{
		padding-left:1.5em;
	}
	#overlay > div dl dd .dot li{
		list-style:disc;
	}
	#overlay > div dl dd .num{
		padding-left:1.5em;
	}
	#overlay > div dl dd .num li{
		list-style:decimal;
	}
	
	#overlay .close {
		display: block;
		width: 1.2em;
		line-height: 1.2;
		font-size: 23px;
		font-weight:500;
		color:#fff;
		background-color: #666666;
		border-radius: 50%;
		cursor: pointer;
		position: absolute;
		z-index:10;
		right: 3%;
		bottom: 20vh;
		transform:translateY(120%);
	}
}

/* footer */
footer{
	margin-top:15%;
	padding:7% 0;
	color:#fff;
	background-color: #f6750e;
}
.thanks footer {
	margin-top: 0;
}
footer ul{
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: center;
	justify-content: center;
}
footer ul li{
	line-height:1;
	padding:0 1em;
	font-size:3vw;
}
footer ul li:nth-child(n+2){
	border-left:1px solid;
}
footer ul li a{
	font-weight:bold;
	color:#fff;
	letter-spacing:0.1em;
	text-indent:0.1em;
}
footer p{
	margin-top:3%;
	font-size:3vw;
	letter-spacing:0.1em;
	text-indent:0.1em;
}

@media screen and (min-width:769px){
	footer{
		width:100%;
		padding:6% 0;
		/* position:absolute;
		bottom:0; */
	}
	footer ul li{
		font-size:23px
	}
	footer p{
		font-size:23px;
	}
}