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

html,body{
	font-family: 'M PLUS 1p', sans-serif;
}

#wrap{ width: 100%;}

.inner{
	max-width: 1024px;
	margin: auto;
}

/*---------------------
 色設定
---------------------*/
.red{ color: #ca4c46;}
.orange{color:#f39c09;}
.blue{ color: #0da5ea;}
.gray{color: #8e8e8e;}

header{
	width: 100%;
	background: #a1d523;
}

.center-wrap{
	position: absolute;
	top:50%;
	left:50%;
	transform: translateX(-50%) translateY(-50%);
}

.center-wrap img{vertical-align: middle;}

.vertical-middle-wrap01{
	position: absolute;
	top:50%;
	transform: translateY(-50%);
	line-height: 25px;
}

.vertical-middle-wrap02{
	position: absolute;
	top:50%;
	transform: translateY(-50%);
	line-height: 20px;
}

header h1{ max-width: 540px;}
header h1 img{ width: 100%;}

h2{
	text-align: center;
	color: #2ab2b7;
	font-size: 1.4em;
	letter-spacing: -1px;
	margin-bottom: 20px;
}

#main-visual{
	width: 100%;
	height: 150px;
	background: url("../images/main_visual.jpg") no-repeat;
	background-size: 100% auto;
}

#company-qtoa{ margin-bottom: 50px;}

.qtoa-wrap{
	width: 100%;
	height: 160px;
	position: relative;
}

.qtoa-q{
	width: 60px;
	height: 60px;
	position: absolute;
	background: #ff9600;
	z-index: 1;
	font-size: 3em;
	color: #fff;
	filter: drop-shadow(4px 4px #dcdcdc)
}

.qtoa-a{
	width: 60px;
	height: 60px;
	position: absolute;
	background: #00b7ee;
	z-index: 1;
	font-size: 3em;
	color: #fff;
	filter: drop-shadow(4px 4px #dcdcdc)
}

.qtoa-desc{
	width: 100%;
	height: 120px;
	position: absolute;
	background: #f3f2f2;
	top:20px;
	z-index: 0;
	padding: 0 0 0 80px;
	font-size: 0.9em;
	font-family: initial;
}


#service{ margin-bottom: 70px;}
.member-plan-wrap{
	width: 100%;
	display: block;
	margin-bottom: 30px;
}

.member-plan-innerLeft{
	width: 100%;
	margin-bottom: 20px;
}

.member-plan-innerLeft .member-idea{ width: 100%; margin-bottom: 2px;}
.member-plan-innerLeft .member-idea li.idea-title{
	background:#f39801;
	text-align: center;
	border-bottom: 2px #fff solid;
}
.member-plan-innerLeft .member-idea li.idea-desc01{
	background: #feefb7;
	text-align: center;
	font-size: 1.4em;
	line-height: 70px;
	border-bottom: 2px #fff solid;
}
.member-plan-innerLeft .member-idea li.idea-desc02{background:#f7f4f0; font-size: 1.2em; padding:20px; line-height: 25px;}

.member-plan-innerLeft .member-idea-list{width: 100%; display: flex; flex-wrap: wrap; border-top: 1px #f39801 solid; margin-bottom: 20px;}
.member-plan-innerLeft .member-idea-list dt{ position: relative; width:45%; background: #f39801;; height: 60px; color: #fff; padding-left: 5px; border-bottom: 1px #fff solid;}
.member-plan-innerLeft .member-idea-list dd{
	position: relative;
	width:55%;
	border-right: 1px #f39801 solid;
	border-bottom: 1px #f39801 solid;
	color: #2ab2b7;
	line-height: 60px;
	text-align: center;
}
.member-plan-innerLeft .member-idea-list dd img{vertical-align: middle;}

.member-plan-innerRight{
	width: 100%;
}

.member-plan-innerRight .member-chizaoku{ width: 100%; margin-bottom: 2px;}
.member-plan-innerRight .member-chizaoku li.chizaoku-title{
	background: #00a0e9;
	text-align: center;
	border-bottom: 2px #fff solid;
}
.member-plan-innerRight .member-chizaoku li.chizaoku-desc01{
	background: #feefb7;
	text-align: center;
	font-size: 1.4em;
	line-height: 70px;
	border-bottom: 2px #fff solid;
}
.member-plan-innerRight .member-chizaoku li.chizaoku-desc02{background: #f7f4f0;font-size: 1.2em; padding: 20px; line-height: 25px;}

.member-plan-innerRight .member-chizaoku-list{width: 100%; display: flex; flex-wrap: wrap; border-top: 1px #00a0e9 solid; margin-bottom: 20px;}
.member-plan-innerRight .member-chizaoku-list dt{ position: relative; width:45%; background: #00a0e9;; height: 60px; color: #fff; padding-left: 5px; border-bottom: 1px #fff solid;}
.member-plan-innerRight .member-chizaoku-list dd{
	position: relative;
	width:55%;
	border-right: 1px #00a0e9 solid;
	border-bottom: 1px #00a0e9 solid;
	color: #2ab2b7;
	line-height: 60px;
	text-align: center;
}
.member-plan-innerRight .member-chizaoku-list dd img{
	vertical-align: middle;
}

.icon-desc{ color: #2ab2b7; width: 100%; display: block;}
.icon-desc li img{ vertical-align: middle; margin-bottom: 5px; margin-right: 5px;}

.form-bt-idea{ width: 98%; margin: 0 1% 0; border-radius: 20px; text-align: center; color: #fff; line-height: 35px; font-size: 1.8em;}
.form-bt-idea a{ display: block; border-radius: 20px; padding: 15px; color: #fff; background: url("../images/form_allow.png") no-repeat #f39801; background-position:right 20px center;}
.form-bt-idea a:hover{opacity: 0.5;}
.form-bt-chizaoku{ width: 98%; margin: 0 1% 0; border-radius: 20px; text-align: center; color: #fff; line-height: 35px; font-size: 1.8em;}
.form-bt-chizaoku a{ display: block; border-radius: 20px; padding: 15px; color: #fff; background: url("../images/form_allow.png") no-repeat #00a0e9; background-position:right 20px center;}
.form-bt-chizaoku a:hover{opacity: 0.5;}

.regi-desc{ width: 100%; text-align: center; font-size: 1.3em;}

#price{margin-bottom: 100px; font-family: initial; font-size: 0.9em;}
#price-table{ width:100%; display: flex; flex-wrap: wrap; border: 1px #cfcfcf solid; color: #4c4c4c; border-bottom: none;}
#price-table dt.find01{ background: #f6f6f6; width: 45%; text-align: center; line-height: 45px; border-bottom: 1px #cfcfcf solid; border-right: 1px #cfcfcf solid;}
#price-table dt.find02{ background: #f6f6f6; width: 55%; text-align: center; line-height: 45px; border-bottom: 1px #cfcfcf solid;}
#price-table dd.item01{ width: 45%; border-bottom: 1px #cfcfcf solid; border-right: 1px #cfcfcf solid; padding: 10px;}
#price-table dd.item02{ width: 55%; text-align: center; border-bottom: 1px #cfcfcf solid; padding: 10px;}

footer{ width: 100%; background: #a1d523; padding: 50px 0 50px;}
footer #company-info{max-width: 90%; margin: auto; display: block; flex-wrap: wrap; background: #fff; border-radius: 30px; padding: 50px 50px 30px; box-sizing: border-box; color: #5c5d5d; font-family: initial;}
footer #company-info dt{ width: 100%; margin-right: 1%; border-bottom: 1px #bababa dotted; margin-bottom: 15px; padding-bottom: 15px; font-weight: bold;}
footer #company-info dd{ width: 100%; border-bottom: 1px #bababa dotted; margin-bottom: 15px; padding-bottom: 15px; line-height: 30px;}

/* PC用CSSをメディアクエリ内に記述する */
@media screen and (min-width: 960px) {
	.inner{
		max-width: 1024px;
		margin: auto;
	}

	/*---------------------
	 色設定
	---------------------*/
	.red{ color: #ca4c46;}
	.orange{color:#f39c09;}
	.blue{ color: #0da5ea;}
	.gray{color: #8e8e8e;}

	header{
		width: 100%;
		background: #a1d523;
	}

	.center-wrap{
		position: absolute;
		top:50%;
		left:50%;
		transform: translateX(-50%) translateY(-50%);
	}

	.center-wrap img{vertical-align: middle;}

	.vertical-middle-wrap01{
		position: absolute;
		top:50%;
		transform: translateY(-50%);
		line-height: 30px;
	}

	.vertical-middle-wrap02{
		position: absolute;
		top:50%;
		transform: translateY(-50%);
		line-height: 20px;
	}

	header h1{ max-width: 540px;}
	header h1 img{ width: 100%;}

	h2{
		text-align: center;
		color: #2ab2b7;
		margin-bottom: 50px;
		font-size: 2.3em;
	}

	#main-visual{
		width: 100%;
		height: 400px;
		background: url("../images/main_visual.jpg") no-repeat;
		background-size: 100% auto;
		margin-bottom: 100px;
	}

	#company-qtoa{ margin-bottom: 100px;}

	.qtoa-wrap{
		width: 100%;
		height: 160px;
		position: relative;
	}

	.qtoa-q{
		width: 95px;
		height: 95px;
		position: absolute;
		background: #ff9600;
		z-index: 1;
		font-size: 4em;
		color: #fff;
		filter: drop-shadow(4px 4px #dcdcdc)
	}

	.qtoa-a{
		width: 95px;
		height: 95px;
		position: absolute;
		background: #00b7ee;
		z-index: 1;
		font-size: 4em;
		color: #fff;
		filter: drop-shadow(4px 4px #dcdcdc)
	}

	.qtoa-desc{
		width: 100%;
		height: 120px;
		position: absolute;
		background: #f3f2f2;
		top:20px;
		z-index: 0;
		padding: 0 0 0 140px;
		font-size: 1.3em;
		font-family: initial;
	}


	#service{ margin-bottom: 100px;}
	.member-plan-wrap{
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		margin-bottom: 30px;
	}

	.member-plan-innerLeft{
		width: 50%;
		border-right: 2px #fff solid;
	}

	.member-plan-innerLeft .member-idea{ width: 100%; margin-bottom: 2px;}
	.member-plan-innerLeft .member-idea li.idea-title{
		background:#f39801;
		text-align: center;
		border-right: 2px #fff solid;
		border-bottom: 2px #fff solid;
	}
	.member-plan-innerLeft .member-idea li.idea-desc01{
		background: #feefb7;
		text-align: center;
		font-size: 1.4em;
		line-height: 70px;
		border-right: 2px #fff solid;
		border-bottom: 2px #fff solid;
	}
	.member-plan-innerLeft .member-idea li.idea-desc02{background:#f7f4f0; font-size: 1.2em; padding:20px; line-height: 25px; border-right: 2px #fff solid;}

	.member-plan-innerLeft .member-idea-list{width: 100%; display: flex; flex-wrap: wrap; border-top: 1px #f39801 solid; margin-bottom: 20px;}
	.member-plan-innerLeft .member-idea-list dt{ position: relative; width:40%; background: #f39801;; height: 60px; color: #fff; padding-left: 15px; border-bottom: 1px #fff solid;}
	.member-plan-innerLeft .member-idea-list dd{
		position: relative;
		width:60%;
		border-right: 1px #f39801 solid;
		border-bottom: 1px #f39801 solid;
		color: #2ab2b7;
		line-height: 60px;
		text-align: center;
	}
	.member-plan-innerLeft .member-idea-list dd img{vertical-align: middle;}

	.member-plan-innerRight{
		width: 50%;
		border-right: 2px #fff solid;
	}

	.member-plan-innerRight .member-chizaoku{ width: 100%; margin-bottom: 2px;}
	.member-plan-innerRight .member-chizaoku li.chizaoku-title{
		background: #00a0e9;
		text-align: center;
		border-right: 2px #fff solid;
		border-bottom: 2px #fff solid;
	}
	.member-plan-innerRight .member-chizaoku li.chizaoku-desc01{
		background: #feefb7;
		text-align: center;
		font-size: 1.4em;
		line-height: 70px;
		border-right: 2px #fff solid;
		border-bottom: 2px #fff solid;
	}
	.member-plan-innerRight .member-chizaoku li.chizaoku-desc02{background: #f7f4f0;font-size: 1.2em; padding: 20px; line-height: 25px; border-right: 2px #fff solid;}

	.member-plan-innerRight .member-chizaoku-list{width: 100%; display: flex; flex-wrap: wrap; border-top: 1px #00a0e9 solid; margin-bottom: 20px;}
	.member-plan-innerRight .member-chizaoku-list dt{ position: relative; width:40%; background: #00a0e9;; height: 60px; color: #fff; padding-left: 15px; border-bottom: 1px #fff solid;}
	.member-plan-innerRight .member-chizaoku-list dd{
		position: relative;
		width:60%;
		border-right: 1px #00a0e9 solid;
		border-bottom: 1px #00a0e9 solid;
		color: #2ab2b7;
		line-height: 60px;
		text-align: center;
	}
	.member-plan-innerRight .member-chizaoku-list dd img{
		vertical-align: middle;
	}

	.icon-desc{ color: #2ab2b7; width: 100%; display: flex; flex-wrap: wrap; justify-content: flex-end;}
	.icon-desc li img{ vertical-align: middle; margin-bottom: 5px; margin-right: 5px;}

	.form-bt-idea{ width: 98%; margin: 0 1% 0; border-radius: 20px; text-align: center; color: #fff; line-height: 35px; font-size: 1.8em;}
	.form-bt-idea a{ display: block; border-radius: 20px; padding: 15px; color: #fff; background: url("../images/form_allow.png") no-repeat #f39801; background-position:right 20px center;}
	.form-bt-idea a:hover{opacity: 0.5;}
	.form-bt-chizaoku{ width: 98%; margin: 0 1% 0; border-radius: 20px; text-align: center; color: #fff; line-height: 35px; font-size: 1.8em;}
	.form-bt-chizaoku a{ display: block; border-radius: 20px; padding: 15px; color: #fff; background: url("../images/form_allow.png") no-repeat #00a0e9; background-position:right 20px center;}
	.form-bt-chizaoku a:hover{opacity: 0.5;}

	.regi-desc{ width: 100%; text-align: center; font-size: 1.3em;}

	#price{margin-bottom: 100px; font-family: initial; font-size: 1em;}
	#price-table{ width:100%; display: flex; flex-wrap: wrap; border: 1px #cfcfcf solid; color: #4c4c4c; border-bottom: none;}
	#price-table dt.find01{ background: #f6f6f6; width: 40%; text-align: center; line-height: 45px; border-bottom: 1px #cfcfcf solid; border-right: 1px #cfcfcf solid;}
	#price-table dt.find02{ background: #f6f6f6; width: 60%; text-align: center; line-height: 45px; border-bottom: 1px #cfcfcf solid;}
	#price-table dd.item01{ width: 40%; text-indent: 30px; line-height: 45px; border-bottom: 1px #cfcfcf solid; border-right: 1px #cfcfcf solid;}
	#price-table dd.item02{ width: 60%; text-align: center; line-height: 45px; border-bottom: 1px #cfcfcf solid;}

	footer{ width: 100%; background: #a1d523; padding: 50px 0 50px;}
	footer #company-info{max-width: 1024px; margin: auto; display: flex; flex-wrap: wrap; background: #fff; border-radius: 30px; padding: 50px 50px 30px; box-sizing: border-box; color: #5c5d5d;}
	footer #company-info dt{ width: 29%; margin-right: 1%; border-bottom: 1px #bababa dotted; margin-bottom: 15px; padding-bottom: 15px; font-weight: bold; line-height: normal;}
	footer #company-info dd{ width: 70%; border-bottom: 1px #bababa dotted; margin-bottom: 15px; padding-bottom: 15px; line-height:normal;}
}
