@charset "UTF-8";
/* CSS Document */

/*html { scroll-behavior: smooth;}*/

body{
	font-family:"小塚ゴシック Pr6N M";
}

.wrapper{
	width:100%;
	height:100%;
}

.bg-slider {
	width: 100vw;
	height:100vh;
	background-position:center center;
	background-size: cover;
	display: flex;
	align-items: center;
	justify-content: center;
/*	position:fixed;*/
/*	top:0;*/
	position:relative;
	z-index: -10;
}
/*
.bg-slider__title{
	color: #fff;
	font-size: 48px;
	line-height: 1.5;
	font-weight: bold;
	text-align:center;
}
*/

/*ヘッダー*/
.home-header{
	width:100%;
	z-index:10;
	position: absolute;
	top:0;
}


.header-box{
	width:90%;
	margin:0 auto;
	display: flex;
	justify-content:space-between;
}

.left h1{
	font-size: 1.3rem;
	font-family:"筑紫A丸ゴシック ボールド";
	padding-left:1rem;
	margin-top:1rem;
}

.right{
	width:110px;
	display: flex;
	justify-content:space-between;
	margin-top:1.5rem;
	margin-right:2rem;
}
.my-size{
	font-size:3rem;
}
.my-color{
	color:#333333;
}
a .my-color:hover{
	color:gray;
}
header nav{
	width:90%;
	margin:0 auto;
}
header nav ul{
	width:350px;
	margin:0 0 0 auto;
	margin-top:0.5rem;
	margin-right:2rem;
	display:flex;
	justify-content:space-between;
	list-style: none;
}
header nav li{
	font-size:1.2rem;
	font-family:Helvetica;
}
header nav a{
	text-decoration: none;
	color:white;
}
header nav a:hover{
	color:gray;
}
.hamburger{
	display: none;
}
.globalMenuSp{
	display: none;
}

/*トップ*/
#top{
	width:100%;
	margin:0 auto;
/*	margin-top:800px;*/
	padding-top:5rem;
	padding-bottom: 5rem;
/*
	background-image:url("../images/back2.jpg");
	background-attachment: fixed;
	background-size: cover;
*/
}
#top:before{
	content:"";
	display:block;
	position:fixed;
	top:0;
	left:0;
	z-index:-20;
	width:100%;
	height:100vh;
	background:url("../images/back2.jpg") center no-repeat;
	background-size:cover;
	}

.top-box{
	width:1000px;
	margin:0 auto;
}
#top h1{
	width:70%;
	margin:0 auto;
	font-family:"筑紫A丸ゴシック ボールド";
	font-size:2rem;
	line-height:3.5rem;	
}
#top p{
	width:70%;
	margin:0 auto;
	font-size:1.2rem;
	line-height:3rem;	
	margin-top:2rem;
}

/*ステップ、アチーブメント、ターゲット、コンタクト、アバウト共通*/
.title{
	width:1000px;
	margin:0 auto;
	text-align: center;
	font-family:"筑紫A丸ゴシック ボールド";
	font-size:2rem;
	line-height:3.5rem;	
}

/*ステップ*/
#step{
	width:100%;
	margin:0 auto;
	padding-top:5rem;
	padding-bottom: 5rem;
	background: #DBFCF5;
}

.step-box{
	width:1000px;
	margin:0 auto;
}

#step img{
	margin-top:4rem;
}

/*アチーブメント*/
#achivement{
	width:100%;
	margin:0 auto;
	padding-top:5rem;
	padding-bottom: 5rem;
/*
	background-image:url("images/back2.jpg");
	background-attachment: fixed;
	background-size: cover;
*/
}

#achivement:before{
	content:"";
	display:block;
	position:fixed;
	top:0;
	left:0;
	z-index:-20;
	width:100%;
	height:100vh;
	background:url("../images/back2.jpg") center no-repeat;
	background-size:cover;
	}

#achivement ul{
	width:1050px;
	margin:0 auto;
	display:flex;
	justify-content:space-between;
	list-style: none;
	margin-top:4rem;
}
#achivement li p{
	font-size:1.2rem;
	margin-top:0;
/*	padding-left:1rem;*/
}

/*ターゲット*/
#target{
	width:100%;
	margin:0 auto;
	padding-top:5rem;
	padding-bottom: 5rem;
	background: #DBFCF5;
}
.target-box{
	width:1000px;
	margin:0 auto;
}

#target img{
	margin-top:2rem;
}

/*コンタクト*/
#contact{
	width:100%;
	margin:0 auto;
	padding-top:5rem;
	padding-bottom: 1rem;
	background:#4DF2CD;
}

.contact-box{
	width: 1000px;
	margin:0 auto;
	margin-top:4rem;
	text-align: center;
}

#contact .name{
	width: 100%;
    margin-bottom: 2rem;
    padding-top: 1rem;
    padding-bottom: 1rem;
    border-radius: 10px;
    border: none;
    background-image: none;
    background-color: white;
    font-size: 1.5rem;
    padding-left: 1rem;
}

#contact .message{
	width: 100%;
    margin-bottom: 2rem;
    padding-top: 1rem;
    padding-bottom: 20rem;
    border-radius: 10px;
    border: none;
    background-image: none;
    background-color: white;
    font-size: 1.5rem;
    padding-left: 1rem;
}

#contact .submit{
	width: 30%;
    margin-bottom: 1.5rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    border-radius: 10px;
    border: none;
    background-image: none;
    background-color: #FFDD32;
    font-size: 1.5rem;
}

/*フッター*/
#footer{
	width:100%;
	margin:0 auto;
	padding-bottom:1rem;
	padding-top:1rem;
	background:#4DF2CD;
}
.footer-box{
	width:1000px;
	margin:0 auto;
	display: flex;
	justify-content:space-between;	
}
#footer nav ul{
	width:350px;
	margin:0 0 0 auto;
	margin-right:2rem;
	display:flex;
	justify-content:space-between;
	list-style: none;
}
#footer a{
	text-decoration: none;
	color:black;
}
#footer nav a:hover{
	color:gray;
}
#footer nav li{
	font-size:1.2rem;
	font-family:Helvetica;
}

/*アバウトページのヘッダー*/
.about-nav a{
	text-decoration: none;
	color:black;
}
.about-nav a:hover{
	color:gray;
}

/*アバウト*/
#about{
	width:100%;
	margin:0 auto;
	margin-top:1rem;
	padding-top:5rem;
	padding-bottom: 5rem;
	background: #DBFCF5; 
}
.about-box{
	width:570px;
	margin:0 auto;
	padding-top:3rem;
}
#about h3{
	padding-bottom:0.5rem;
}
#about p{
	padding-bottom:3rem;
}

/*アバウトページのフッター*/
#about-footer{
	width:100%;
	margin:0 auto;
	padding-bottom:1rem;
	padding-top:1rem;
	background:#DBFCF5;
}
#about-footer nav ul{
	width:350px;
	margin:0 0 0 auto;
	margin-right:2rem;
	display:flex;
	justify-content:space-between;
	list-style: none;
}
#about-footer nav a{
	text-decoration: none;
	color:black;
}
#about-footer nav a:hover{
	color:gray;
}

#about-footer nav li{
	font-size:1.2rem;
	font-family:Helvetica;
}

/* 480px以下に適用されるCSS（スマホ用） */
@media screen and (max-width: 480px){
	/*ヘッダー*/
	.bg-slider{
		width: 100vw;
		height:500px;
		background-position:center center;
		background-size: cover;
		display: flex;
		align-items: center;
		justify-content: center;
		/*	position:fixed;*/
		/*	top:0;*/
		position:relative;
		z-index: -10;
	}
	.header-box{
	width:100%;
	margin:0 auto;
	padding-left:1rem;
	display: flex;
	justify-content:space-between;
	}

	.left h1{
	font-size: 0.7rem;
	font-family:"筑紫A丸ゴシック ボールド";
	}
	
	.logo img{
	max-width: 85%;
	margin-top:-0.5rem;
	}

	.right{
	width:80px;
	display: flex;
	justify-content:space-between;
	margin-top:3.5rem;
/*	margin-right:2rem;*/
	}
	
	.my-size{
	font-size:1.5rem;
	}
	
	header nav ul{
	width:300px;
	margin:0 auto;
	padding-top:1rem;
	display:flex;
	justify-content:space-between;
	list-style: none;
	}
	header nav li{
	font-size:0.8rem;
	font-family:Helvetica;
	text-align: center;
	}
	header nav a{
	text-decoration: none;
	color:white;
	}
	header nav a:hover{
	color:gray;
	}
	
	/*トップ*/
	#top{
	padding-top:2rem;
	padding-bottom: 2rem;
	}
	#top:before{
	content:"";
	display:block;
	position:fixed;
	top:0;
	left:0;
	z-index:-20;
	width:100%;
	height:100vh;
	background:url("../images/back2.jpg") center no-repeat;
	background-size:cover;
	}
  
div.box{
  background:rgba(255, 255, 255, 0.8);
  padding: 50px;
  width: 50%;
  margin: 100px auto;
}

div.label{
  font-size: 20px;
  font-weight: bold;
  margin: 20px 0;
}
	
	.top-box{
	width:350px;
	}
	
	#top h1{
	width:85%;
	font-size:1.2rem;
	line-height:2rem;	
	}
	
	#top p{
	width:85%;
	font-size:0.8rem;
	line-height:1.5rem;	
	margin-top:2rem;
	}
	
	/*ステップ、アチーブメント、ターゲット、コンタクト、アバウト共通*/
	.title{
	width: 350px;
	font-size:1.2rem;
	line-height:1rem;	
	}
	
	/*ステップ*/
	#step{
	padding-top:3rem;
	padding-bottom: 3rem;
	}
	.step-box{
	width:350px;
	}
	
	#step img{
	max-width:350px;
	margin-top:3rem;
		
	}
	
	/*アチーブメント*/
	#achivement:before{
	content:"";
	display:block;
	position:fixed;
	top:0;
	left:0;
	z-index:-20;
	width:100%;
	height:100vh;
	background:url("../images/back2.jpg") center no-repeat;
/*	background-size:cover;*/
	background-size:cover;
	}
	
	#achivement{
	padding-top:3rem;
	padding-bottom: 3rem;
	}

	#achivement ul{
		width:350px;
		margin:0 auto;
		display:block;
		margin-top:3rem;
	}
	
	#achivement li{
		text-align: center;
		margin-top:3rem;
	}
	
	#achivement li p{
		font-size:0.8rem;
		margin-top:0.5rem;
	}
	
	/*ターゲット*/
	#target{
	padding-top:3rem;
	padding-bottom: 3rem;
	}
	
	.target-box{
	width:350px;
	}
	
	#target img{
	max-width:350px;
	}
	
	/*コンタクト*/
	#contact{
	padding-top:3rem;
	padding-bottom: 1rem;
	}
	.contact-box{
	width: 350px;
	margin:0 auto;
	margin-top:3rem;
	text-align: center;
	}

	#contact .name{
	width: 90%;
	margin-bottom: 1rem;
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
	border-radius: 5px;
	border: none;
	background-image: none;
	background-color: white;
	font-size: 1rem;
	padding-left: 0.5rem;
	}

	#contact .message{
	width: 90%;
	margin-bottom: 1rem;
	padding-top: 0.5rem;
	padding-bottom: 10rem;
	border-radius: 5px;
	border: none;
	background-image: none;
	background-color: white;
	font-size: 1rem;
	padding-left: 0.5rem;
	}

	#contact .submit{
	width: 30%;
	margin-bottom: 1rem;
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
	border-radius: 5px;
	border: none;
	background-image: none;
	background-color: #FFDD32;
	font-size: 1rem;
	}
	
	/*フッター*/
	#footer{
	padding-bottom:1rem;
	padding-top:0rem;
	}

	.footer-box{
	width:350px;
	margin:0 auto;
	display: block;
	}

	#footer nav ul{
	width:80%;
	margin-right:2rem;
	display:flex;
	justify-content:space-between;
	}
	
	#footer nav li{
	font-size:0.8rem;
	font-family:Helvetica;
	}
	
	#footer p{
	font-size:0.7rem;
	font-family:Helvetica;	
	text-align: center;
	margin-top:1rem;
	}
	
	/*アバウト*/
	#about{
	padding-top:3rem;
	padding-bottom: 3rem;
	}
	.about-box{
	width:310px;
	margin:0 auto;
	padding-top:3rem;
	}

	#about h3{
	padding-bottom:0.5rem;
	font-size:0.9rem;
	}

	#about p{
	padding-bottom:2rem;
	font-size:0.7rem;
	}

	/*アバウトページのフッター*/
	#about-footer{
	padding-bottom:1rem;
	padding-top:0rem;
	}
	
	#about-footer nav ul{
	width:80%;
	margin-right:2rem;
	display:flex;
	justify-content:space-between;
	}
	
	#about-footer nav li{
	font-size:0.8rem;
	font-family:Helvetica;
	}
	
	#about-footer p{
	font-size:0.7rem;
	font-family:Helvetica;	
	text-align: center;
	margin-top:1rem;
	}
}