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

/* -------------------------------------------

全体設定

 ---------------------------------------------------*/
html{
}
body {
}
a {
}
img{
	width:100%;
}
/* top */
.top > div.pc {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
}
.top .btn {
	position: absolute;
	bottom:3vw;
	width: 25vw;
}
/* overview */
/* about */
/*feature*/
/*feature01*/
/*feature02*/
/* campaign_01 */
.campaign_01 > div.pc {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
}
.campaign_01 .btn {
	position: absolute;
	bottom:11.8vw;
	margin-left: -16.5vw;
	width: 32vw;
}
/* system */
/* price */
.price > div.pc {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
}
.price .btn {
	position: absolute;
	bottom:10vw;
	width: 32vw;
}
/* faq */
.faq > div.pc {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
}
.faq .btn {
	position: absolute;
	bottom:5vw;
	width: 32vw;
}
/* access */
.access iframe{
	width: 100%;
	height: 30vw;
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
}
/* campaign_02 */
.campaign_02 > div.pc {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: -10px;
}
.campaign_02 .btn {
	position: absolute;
	bottom:8vw;
	width: 32vw;
}
/* footer */
footer{
	background-color: #99A4AA;
	padding: 3vw 0;
	font-family: "Noto Serif JP", serif;
	color: #fff;
	font-size: 0.9vw;
}
footer .link {
	display: flex;
	justify-content: center;
}
footer .link a{
	 color: #fff;
	text-decoration: none;
	margin: 0 20px;
}
footer small {
	margin-top: 2vw;
	display: flex;
	justify-content: center;
}
.pc{
	display: block;
}
.smp{
	display: none;
}

@media screen and (max-width: 768px) {
	body{
	}
	/* top */
	.top > div.pc {
		display: none;
	}
	.top > div.smp {
		position: relative;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.top .btn {
		position: absolute;
		bottom:7vw;
		width: 80vw;
	}
	/* overview */
	/* about */
	/*feature*/
	/*feature01*/
	/*feature02*/
	/* campaign_01 */
	.campaign_01 > div.pc {
		display: none;
	}
	.campaign_01 > div.smp {
		position: relative;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.campaign_01 .btn {
		position: absolute;
		bottom:36vw;
		width: 87.5vw;
		margin-left:auto;
	}
	/* system */
	/* price */
	.price > div.pc {
		display: none!important;
	}
	.price > div.smp {
		position: relative;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.price .btn {
		position: absolute;
		bottom:12vw;
		width: 80vw;
	}
	/* faq */
	.faq > div.pc {
		display: none!important;
	}
	.faq > div.smp {
		position: relative;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.faq .btn {
		position: absolute;
		bottom:12vw;
		width: 80vw;
	}
	/* access */
	.access iframe{
		height: 100vw;
	}
	/* campaign_02 */
	.campaign_02 > div.pc {
		display:  none;
	}
	.campaign_02 > div.smp {
		position: relative;
		display: flex;
		align-items: center;
		justify-content: center;
		margin-bottom: -10px;
	}
	.campaign_02 .btn {
		position: absolute;
		bottom:8vw;
		width: 80vw;
	}
	/* footer */
	footer{
		padding: 6vw 0 3vw;
		color: #fff;
		font-size: 2.8vw;
	}
	footer .link {
		display: flex;
		justify-content: center;
	}
	footer .link a{
		 color: #fff;
		text-decoration: none;
		margin: 0 16px;
	}
	footer small {
		margin-top: 5vw;
		display: flex;
		justify-content: center;
	}
	.pc{
		display: none;
	}
	.smp{
		display: block;
	}
}