@charset "UTF-8";

html {
	width:100%;
	margin:0 auto;
	text-align: center;
	animation: loading 1s;	
}
@keyframes loading {
	0% {opacity: 0;}
	100% {opacity: 1;}
}
img {
	width: 100%;
	pointer-events: none;
	vertical-align: bottom;
}
.pc{display: block;}
.sp{display: none;}

@media screen and (max-width: 700px) {
	.pc{display: none;}
	.sp{display: block;}
}
body {
	width:100%;
	margin: 0 auto;
	position:relative;
	z-index:0;
}
header{
	width:100%;
	position: fixed;
	text-align: right;
	z-index:999;
}
header h1 img{
width:150px;
text-align: right;
margin:15px 15px 0 0;
}
@media screen and (max-width: 700px) {
	header h1 img{
		width:80px;
	}
}
.btn{
	width:100%;
	position: fixed;
	margin:0 auto;
	left:75%;
	bottom:5%;
	z-index:99;
}

@media screen and (max-width: 700px) {
	.btn{
		left:5%;
		right:0;
		bottom:10%;
	}
}
.btn_zone{
	max-width:400px;
}
@media screen and (max-width: 700px) {
	.btn_zone{
		width:90%;
	}
}
.wrapper{
	width:100%;
	margin:0 auto;
	overflow: hidden;
}
@media screen and (max-width: 700px) {
	.wrapper{
		padding:0 0 8% 0;
	}
}
/*fv**/
.fv{
	width:100%;
	background:url(../img/fv_back.jpg);
	background-size:cover;
	background-repeat: no-repeat;
}
.fv_zone{
	max-width:1000px;
	margin:0 auto;
	padding:3% 0 0 0;
	position: relative;
}
@media screen and (max-width: 700px) {
	.fv_zone{
		padding:15% 0 5% 0;
	}
}
.fv_point_left{
	position:absolute;
	bottom:37%;
	left:5%;
}
@media screen and (max-width: 700px) {
	.fv_point_left{
		width:75px;
		bottom:45%;
		left:2%;
	}
}
.fv_point_right{
	position:absolute;
	bottom:40%;
	right:8%;
}
@media screen and (max-width: 700px) {
	.fv_point_right{
		width:75px;
		bottom:45%;
		right:2%;
	}
}
img.fv_front{
	margin:0 0 -5px 0;
}
@media screen and (max-width: 700px) {
	img.fv_front{
		width:90%;
		margin:0 0 -11px 0;
	}
}
img.kirikae_white{
	margin:0 0 -5px 0;
	position: relative;
	z-index:5;
}
/*cvr_box**/
.cvr_box{
	width:100%;
	margin:0 auto;
	background:#fff;
	padding:0 0 3% 0;
}
@media screen and (max-width: 700px) {
	.cvr_box{
		padding:1% 0 5% 0;
	}
}
.cvr_zone{
max-width:700px;
margin:0 auto;
}
@media screen and (max-width: 700px) {
	.cvr_zone{
		width:90%;
	}
}
@media screen and (max-width: 700px) {
.cvr_txt{
	margin:8% 0 5% 0;
}
}
/*about**/
.about{
	width:100%;
	margin:0 auto;
	background:#f6bb00;
	padding:0 0 3% 0;
}
@media screen and (max-width: 700px) {
	.about{
		padding:8% 0;
	}
}
.about_zone{
	max-width:800px;
	margin:0 auto;
}
.about_zone h5{
	font-size:7.5em;
	text-align: left;
	color:#ffea85;
	font-family: 'Josefin Sans', sans-serif;
	font-weight:300;
}
@media screen and (max-width: 700px) {
	.about_zone h5{
		font-size:1.5em;
		color:#ffe467;
		text-align:center;
	}
}
.about_zone p{
	font-size:2.7em;
	text-align:center;
	color:#ffe467;
	font-weight:500;
	font-family: 'Zen Kaku Gothic New', sans-serif;
}
@media screen and (max-width: 700px) {
	.about_zone p{
		font-size:1.7em;
		color:#000;
		margin:0 0 3% 0;
	}
}
.about_myrow{
	display:-webkit-flex;
	display:flex;
}
@media screen and (max-width: 700px) {
	.about_myrow{
		width:90%;
		margin:0 auto;
	}
}
.about_child{
	flex:1;
	margin:3%;
}
@media screen and (max-width: 700px) {
	.about_child{
		margin:0 auto;
	}
}
/*flow**/
.flow{
	width:100%;
	background:#ffea85;
}
@media screen and (max-width: 700px) {
	.flow{
		padding:8% 0;
	}
}
.flow_zone{
	max-width:1000px;
	margin:0 auto;
}
@media screen and (max-width: 700px) {
	.flow_zone{
		width:90%;
	}
}
.flow_zone h5{
	font-size:7.5em;
	text-align:right;
	color:#f6bb00;
	font-family: 'Josefin Sans', sans-serif;
	font-weight:300;
}
@media screen and (max-width: 700px) {
	.flow_zone h5{
		font-size:1.5em;
		text-align:center;
	}
}
.flow_zone p{
	font-size:2.7em;
	text-align:center;
	color:#f6bb00;
	font-weight:500;
	font-family: 'Zen Kaku Gothic New', sans-serif;
	margin:0 0 3% 0;
}
@media screen and (max-width: 700px) {
	.flow_zone p{
		font-size:1.7em;
		color:#000;
	}
}
table {
	max-width:800px;
	margin:0 auto;
	text-align: center;
	border-collapse: collapse;
	border:2px solid #ffea85;
	font-family: 'Zen Kaku Gothic New', sans-serif;
   }
   th {
	padding: 10px;
	background: #f6bb00;
	border:2px solid #ffea85;
	text-align: center;
	color:#fff;
	white-space: nowrap;
   }
   td {
	padding:20px 10px;
	border:2px solid #ffea85;
	background:#fff;
	text-align: left;
   }
   @media screen and (max-width: 700px) {
	td {
	font-size:12px;
	}
   }
   tr:nth-child(odd) {
	border:2px solid #ffea85;
   }
/*profile**/
.profile{
	width:100%;
	margin:0 auto;
	background:#ffea85;
	padding:3% 0 5% 0;
}
.profile_zone{
	max-width:800px;
	margin:0 auto;
}
@media screen and (max-width: 700px) {
	.profile_zone{
		width:90%;
	}
}
.profile_zone p{
	margin:10px 0 0 0;
	font-size:18px;
	line-height:28px;
	text-align: left;
	font-family: 'Zen Kaku Gothic New', sans-serif;
	color:#585858;
}
@media screen and (max-width: 700px) {
	.profile_zone p{
		font-size:15px;
	line-height:23px;
	}
}
.result{
	width:100%;
	margin:0 auto;
	background:#f6bb00;
}
@media screen and (max-width: 700px) {
	.result{
		padding:8% 0;
	}
}
.result_zone{
	max-width:1000px;
	margin:0 auto;
	padding:0 0 5% 0;
}
.result_zone h5{
	color:#ffe467;
	font-size:7.5em;
	text-align:left;
	font-family: 'Josefin Sans', sans-serif;
	font-weight:300;
}
@media screen and (max-width: 700px) {
	.result_zone h5{
		font-size:1.5em;
		text-align:center;
	}
}
.result_zone p{
	font-size:2.7em;
	text-align:center;
	color:#000;
	font-weight:500;
	font-family: 'Zen Kaku Gothic New', sans-serif;
}
@media screen and (max-width: 700px) {
	.result_zone p{
		font-size:1.5em;
	}
}
.result_column{
	display:-webkit-flex;
	display:flex;
}
@media screen and (max-width: 700px) {
	.result_column{
		-webkit-flex-direction:column;
		flex-direction:column;
	}
}
.result_child{
	flex:1;
	margin:3%;
}
@media screen and (max-width: 700px) {
	.result_child{
		width:80%;
		margin:3% 10%;
	}
}
/*threestep**/
.threestep{
	width:100%;
	background:#ffea85;
}
@media screen and (max-width: 700px) {
	.threestep{
		padding:8% 0;
	}
}
.threestep_zone{
	max-width:800px;
	margin:0 auto;
}
.threestep_zone h5{
	font-size:7.5em;
	text-align:right;
	color:#f6bb00;
	font-family: 'Josefin Sans', sans-serif;
	font-weight:300;
}
@media screen and (max-width: 700px) {
	.threestep_zone h5{
			font-size:1.5em;
			text-align:center;
		}
	}
.threestep_zone p{
	font-size:2.7em;
	text-align:center;
	color:#000;
	font-weight:500;
	font-family: 'Zen Kaku Gothic New', sans-serif;
	margin:0 0 3% 0;
}
@media screen and (max-width: 700px) {
	.threestep_zone p{
		font-size:1.5em;
	}
	.step_zone{
		width:90%;
		margin:0 auto;
	}
}
.result_txt{
	width:90%;
	margin:5% 5% 0 5%;
}
@media screen and (max-width: 700px) {
	.result_txt{
		width:80%;
		margin:15% 10% 0 10%;
	}
}
/*footer**/
  footer{
	background:#000;
	padding:10px 0;
  }
  footer p{
	color:#fff;
  }

  .fadeUp {
	animation-name:fadeUpAnime;
	animation-duration:1s;
	animation-fill-mode:forwards;
	opacity: 0;
	}
	@keyframes fadeUpAnime{
	  from {
		opacity: 0;
	  transform: translateY(100px);
	  }
	
	  to {
		opacity: 1;
	  transform: translateY(0);
	  }
	}
	.delay-time02{
		animation-delay: 0.2s;
		}
		
		.delay-time04{
		animation-delay: 0.4s;
		}
.design_line{
	height:10px;
	background:url(../img/design_line.png);
	background-size: cover;
}

.footerlink{
	max-width:800px;
	margin:0 auto;
	color:#fff;
	padding:0 0 10px 0;
}
.footerlink a{
	font-size:11px;
	margin:0 0 10px 0;
}
footer p{
	font-size:11px;
	border-top:solid 1px #fff;
	padding:10px 0 0 0;
}
@media screen and (max-width: 700px) {
	footer p{
		border:none;
}
}
.twice_column{display:-webkit-flex;display:flex;}
.single_column{flex:1;}