@charset "UTF-8";

	

/* common --------------------------------------------------------------- */
p.point {
	font-size: 15px;
	line-height: 2.2;
	text-align: center;
	}
			
	p.point span {
		display: inline;
		color: #e95538;
		padding-left: 3px;
		background-image: url(../../img/common/namisenR.png);
		background-position: left bottom;
		background-size: auto 2px;
		background-repeat: repeat-x;
		}

@media screen and (max-width:834px){
	p.point {
		line-height: 2;
		text-align: left;
		}
	}
	
	
	
/* visual --------------------------------------------------------------- */
#visual {
	width: 100%;
	position: relative;
	}
	
	#visual p {
		}
		
@media screen and (min-width:401px) and (max-width:1112px){
	}

@media screen and (max-width:400px){
	}




/* about --------------------------------------------------------------- */
#about {
	margin: 0 auto;
	margin-bottom: 100px;
	padding-top: 100px;
	}
		
	#about h2.image {
		width: 200px;
		}
	
	#about h2 {
		font-size: 22px;
		margin-bottom: 50px;
		}
		
	#about p {
		width: 90%;
		margin: 0 auto 100px auto;
		}
		
	#about ul {
		width: 90%;
		max-width: 560px;
		margin: 0 auto 100px auto;
		overflow: hidden;
		}
		
		#about ul li {
			float: left;
			width: 240px;
			height: 240px;
			margin-right: 80px;
			border-radius: 120px;
			background-position: center 40%;
			background-color: #f9f9f9;
			position: relative;
			}
		
		#about ul li:last-child {
			margin: 0;
			}
		
		#about ul li.wiz1 {
			background-image: url(../../img/service/wizheart/wiz1.png);
			background-size: auto 50%;
			}
		
		#about ul li.wiz2 {
			background-image: url(../../img/service/wizheart/wiz2.png);
			background-size: 80% auto;
			}
		
		#about ul li.wiz3 {
			background-image: url(../../img/service/wizheart/wiz3.jpg);
			background-size: cover;
			}
			
			#about ul li p {
				width: 100%;
				text-align: center;
				font-size: 15px;
				line-height: 1.3;
				color: #e95538;
				position: absolute;
				left: 0;
				top: 72%;
				}
				
				#about ul li p span {
					display: inline;
					font-size: 15px !important;
					background-image: url(../../img/common/namisenR.png);
					background-position: left bottom;
					background-size: auto 2px;
					background-repeat: repeat-x;
					}
	
			/*#about ul li:last-child p {
				color: #ffffff;
				}
				
				#about ul li:last-child p span {
					display: block;
					font-size: 11px !important;
					background-image: none;
					}*/
			
			#about ul li a {
				width: 100%;
				height: 240px;
				text-indent: -9999px;
				position: absolute;
				left: 0;
				top: 0;
				}
				
	#about dl {
		width: 90%;
		max-width: 1100px;
		margin: 0 auto 70px auto;
		overflow: hidden;
		}
		
		#about dl h2 {
			margin-bottom: 40px;
			padding-bottom: 0;
			background-image: none;
			}
		
		#about dl dt,
		#about dl dd {
			width: 500px;
			}
			
		#about dl dt {
			float: left;
			}
			
			#about dl dt p {
				font-size: 15px;
				margin-bottom: 10px;
				padding: 15px 20px 15px 40px;
				background-color: #ffffff;
				background-image: url(../../img/service/wizheart/wiz1.png);
				background-repeat: no-repeat;
				background-position: 10px center;
				background-size: auto 24px;
				}
				
		#about dl dd {
			float: right;
			}
			
			#about dl dd p {
				font-size: 15px;
				padding: 30px;
				line-height: 2.3;
				box-sizing: border-box;
				background-color: #ffffff;
				}
	
@media screen and (min-width:835px) and (max-width:1112px){
	#about dl dt,
	#about dl dd {
		width: 50%;
		}
	}

@media screen and (min-width:401px) and (max-width:834px){
		#about ul {
			text-align: center;
			}
			
			#about ul li {
				float: none;
				width: 200px;
				height: 200px;
				margin: 0 15px;
				border-radius: 100px;
				display: inline-block;
				}
			
			#about ul li:last-child {
				margin: 0 10px;
				}
		
			#about dl dt,
			#about dl dd {
				width: 49%;
				}
				
				#about dl dt p {
					padding: 15px 10px 15px 40px;
					}
					
			#about dl dd {
				float: right;
				}
				
				#about dl dd p {
					padding: 10px;
					}
	}

@media screen and (max-width:400px){
	#about {
		width: 100%;
		margin-bottom: 0;
		padding-top: 50px;
		}
		
		#about h2 {
			margin-bottom: 30px;
			}
			
		#about p {
			margin: 0 auto 70px auto;
			}
			
		#about ul {
			width: 90%;
			margin: 0 auto 70px auto;
			}
			
			#about ul li {
				float: none;
				margin: 0 auto 10px auto;
				background-position: center 40%;
				}
			
			#about ul li:last-child {
				margin: 0 auto;
				}
				
		#about dl {
			margin: 0 auto;
			}
			
			#about dl h2 {
				margin-bottom: 30px;
				}
			
			#about dl dt,
			#about dl dd {
				width: 100%;
				float: none;
				}
			
			#about dl dt {
				margin-bottom: 70px;
				}
	}



/* interview --------------------------------------------------------------- */
#interview {
	width: 90%;
	max-width: 1100px;
	margin: 0 auto;
	}
	
	.interviewInner {
		margin-bottom: 100px;
		}
		
		.interviewInner h3 {
			font-size: 24px;
			margin: 0 auto 30px auto;
			background-image: none;
			}
			
		.interviewInner dl {
			width: 100%;
			display: table;
			}
			
			.interviewInner dl dt,
			.interviewInner dl dd {
				display: table-cell;
				vertical-align: top;
				}
			
			.interviewInner dl dt {
				width: 230px;
				padding-right: 30px;
				}
				
				.interviewInner dl dt p {
					margin-bottom: 10px;
					}
					
					.interviewInner dl dt p img {
						width: 100%;
						}
				
				.interviewInner dl dd p {
					color: #e95538;
					font-size: 26px;
					}
					
					.interviewInner dl dd p span {
						color: #000000;
						font-size: 16px;
						padding: 15px 0;
						}
		
		.interviewInner a {
			width: 230px;
			padding: 10px 0;
			color: #ffffff;
			text-align: center;
			background-color: #e95538;
			}
			
@media screen and (min-width:769px) and (max-width:1112px){
	.interviewInner {
		margin-bottom: 100px;
		}
		
		.interviewInner h3 {
			margin: 0 auto 20px auto;
			}
			
		.interviewInner dl {
			margin-bottom: 10px;
			}
			
				.interviewInner dl dd p {
					font-size: 22px;
					}
	}

@media screen and (max-width:768px){
	#interview {
		margin-bottom: 100px;
		}
		
		.interviewInner {
			margin-bottom: 50px;
			}
			
			.interviewInner h3 {
				font-size: 20px;
				margin: 0 auto 10px auto;
				}
				
			.interviewInner dl {
				display: block;
				}
				
				.interviewInner dl dt,
				.interviewInner dl dd {
					display: block;
					width: 100%;
					}
				
				.interviewInner dl dt {
					width: 100%;
					padding-right: 0;
					}
					
					.interviewInner dl dd p {
						font-size: 20px;
						}
						
			.interviewInner a {
				width: 100%;
				}
	}

	
		

/* スケジュール --------------------------------------------------------------- */
#shedule {
	width: 90%;
	max-width: 1100px;
	margin: 0 auto 100px auto;
	}
	
	#shedule h3 {
		font-size: 20px;
		margin-bottom: 30px;
		padding-bottom: 0;
		background-image: none;
		}
		
	#shedule .scheduleInner {
		}
	
		.scheduleInner h2 {
			text-align: left;
			margin-bottom: 15px;
			padding-bottom: 0;
			background-image: none;
			}
			
		.scheduleInner dl {
			display: table;
			margin-bottom: 100px;
			}
			
			.scheduleInner dl dt,
			.scheduleInner dl dd {
				display: table-cell;
				vertical-align: middle;
				}
				
			.scheduleInner dl dt {
				width: 250px;
				font-size: 20px;
				text-align: center;
				border-top: solid 0.5px;
				border-bottom: solid 0.5px;
				}
			
			.scheduleInner dl dd {
				padding-left: 70px;
				}
				
				.scheduleInner ul {
					width: 100%;
					display: table;
					font-size: 15px;
					margin-bottom: 10px;
					}
					
					.scheduleInner ul li {
						display: table-cell;
						vertical-align: middle;
						}
					
					.scheduleInner ul li.sctitle {
						width: 220px;
						text-align: center;
						padding: 15px 0;
						color: #ffffff;
						background-color: #E95538;
						}
					
					.scheduleInner ul li.scread {
						padding-left: 20px;
						}
				
				.scheduleInner dl dd p {
					line-height: 2;
					}

@media screen and (min-width:769px) and (max-width:1112px){
		.scheduleInner dl dt {
			width: 200px;
			font-size: 18px;
			}
		
		.scheduleInner dl dd {
			padding-left: 30px;
			}
	}

@media screen and (max-width:768px){
	.scheduleInner dl {
		display: block;
		margin-bottom: 70px;
		}
		
		.scheduleInner dl dt,
		.scheduleInner dl dd {
			display: block;
			width: 100%;
			}
			
		.scheduleInner dl dt {
			width: 100%;
			margin-bottom: 20px;
			padding: 10px 0;
			}
		
		.scheduleInner dl dd {
			padding-left: 0;
			}
			
			.scheduleInner ul {
				display: block;
				margin-bottom: 10px;
				}
				
				.scheduleInner ul li {
					display: block;
					width: 100%;
					}
				
				.scheduleInner ul li.sctitle {
					width: 100%;
					margin-bottom: 10px;
					}
				
				.scheduleInner ul li.scread {
					padding-left: 0;
					}
	}



/* 導入企業様 --------------------------------------------------------------- */
#customer {
	padding: 150px 0;
	}
	
	#customer #customerInner {
		width: 90%;
		max-width: 1100px;
		margin: 0 auto;
		overflow: hidden;
		}
		
		#customer #customerInner ul {
			width: 100%;
			display: table;
			margin-bottom: 50px;
			}
		
		#customer #customerInner ul:last-child {
			margin-bottom: 0;
			}
			
			#customer #customerInner ul li {
				width: 20%;
				padding: 0 5%;
				box-sizing: border-box;
				display: table-cell;
				text-align: center;
				vertical-align: middle;
				line-height: 1;
				}
				
				#customer #customerInner ul li img {
					width: 100%;
					}
		
		#customer #customerInner span {
			text-align: center;
			font-size: 12px;
			opacity: 0.5;
			}

@media screen and (max-width: 768px){
	#customer {
		padding: 50px 0;
		}
		
		#customer #customerInner {
			}
			
			#customer #customerInner ul {
				margin-bottom: 20px;
				}
				
				#customer #customerInner ul li {
					width: 25%;
					padding: 0 3%;
					}
	}
	
	

/* 申し込み --------------------------------------------------------------- */	
.moshikomi {
	padding: 150px 0;
	background-image: url(../../img/service/common/moshikomi.jpg);
	background-position: center center;
	background-size: cover;
	}

	.moshikomi .more {
		width: 350px;
		margin: 0 auto;
		}
	
		.moshikomi .more a {
			font-size: 16px;
			padding: 25px 0;
			color: #ffffff;
			border-color: #ffffff !important;
			background-image: url(../../img/common/arrowW.png);
			}

@media screen and (max-width: 768px){
	.moshikomi {
		padding: 50px 0;
		}
		
		.moshikomi .more {
			width: 90%;
			}
			
			.moshikomi .more a {
				font-size: 15px;
				}
	}



/* お問い合わせ --------------------------------------------------------------- */	
#contact {
	width: 150px;
	height: 150px;
	position: fixed;
	right: 15px;
	bottom: 50px;
	}
	
	#contact a,
	#contact a img {
		width: 100%;
		}
	
@media screen and (max-width: 400px){
	#contact {
		display: none;
		}
	}