@charset "UTF-8";

	
	
/* visual --------------------------------------------------------------- */
#visual,
#visual ul,
#visual ul li,
#visual p {
	height: 550px;
	}

#visual {
	margin: 0 auto;
	position: relative;
	}
	
	#visual ul {
		position: relative;
		}
		
		#visual ul li,
		#visual p {
			background-position: center center;
			background-size: cover;
			}
		
		#visual ul li#v01 {
			background-image: url(../../img/home/visual/v01.jpg);
			}
		
		#visual ul li#v02 {
			background-image: url(../../img/home/visual/v02.jpg);
			}
		
		#visual ul li#v03 {
			background-image: url(../../img/home/visual/v03.jpg);
			}
		
		#visual ul li#v04 {
			background-image: url(../../img/home/visual/v04.jpg);
			}
		
		#visual ul li#v05 {
			background-image: url(../../img/home/visual/v05.jpg);
			}
			
	#visual p {
		width: 100%;
		z-index: 99;
		background-image: url(../../img/home/visual/copy.png);
		position: absolute;
		left: 0;
		top: 0;
		}

@media screen and (min-width:401px) and (max-width:1112px){
	#visual,
	#visual ul,
	#visual ul li,
	#visual p {
		height: 450px;
		}
	}

@media screen and (max-width:400px){
	#visual,
	#visual ul,
	#visual ul li,
	#visual p {
		height: 60vh;
		}
	
	#visual {
		}
	
		#visual ul li#v01 {
			background-image: url(../../img/home/visual/mob_v01.jpg);
			}
		
		#visual ul li#v02 {
			background-image: url(../../img/home/visual/mob_v02.jpg);
			}
		
		#visual ul li#v03 {
			background-image: url(../../img/home/visual/mob_v03.jpg);
			}
		
		#visual ul li#v04 {
			background-image: url(../../img/home/visual/mob_v04.jpg);
			}
		
		#visual ul li#v05 {
			background-image: url(../../img/home/visual/mob_v05.jpg);
			}
				
		#visual p {
			background-size: 100% auto;
			background-image: url(../../img/home/visual/mob_copy.png);
			}
	}



/* 新着情報 --------------------------------------------------------------- */
#info {
	padding: 70px 0;
	overflow: hidden;
	background-color: #fbf9f6;
	}
			
	#info #infoLeft,
	#info #infoRight {
		width: 50%;
		box-sizing: border-box;
		}
	
	#info #infoLeft {
		float: left;
		padding: 0 2% 0 5%;
		}
	
	#info #infoRight {
		float: right;
		padding: 0 5% 0 2%;
		}
		
		#info #infoLeft h3,
		#info #infoRight h3 {
			color: #e95538;
			margin-bottom: 20px;
			padding-bottom: 0;
			background-image: none;
			}
	
	#info .infoInner {
		margin-bottom: 30px;
		padding: 20px 0;
		border-top: solid 0.5px;
		border-bottom: solid 0.5px;
		}
		
		#info .infoInner a {
			font-size: 13px;
			}
					
		#info .infoInner dl {
			width: 100%;
			display: table;
			padding: 6px 0;
			}
			
			#info .infoInner dl dt,
			#info .infoInner dl dd {
				display: table-cell;
				vertical-align: top;
				}
			
			#info .infoInner dl dt {
				width: 180px;
				padding-left: 3px;
				box-sizing: border-box;
				}
			
			#info #infoRight .infoInner dl dt {
				width: 160px;
				}
				
				#info .infoInner dl dt span {
					width: 90px;
					color: #333333;
					display: inline-block;
					margin-left: 5px;
					padding: 2px 5px;
					text-align: center;
					box-sizing: border-box;
					border-radius: 3px;
					line-height: 1.2;
					font-size: 10px;
					background-color: #ededed;
					}
				
				#info #infoRight .infoInner dl dt span {
					width: 70px;
					}
					
			#info .infoInner dl dd {
				}
	
	#info .more a {
		color: #e95538;
		border-color: #e95538 !important;
		background-image: url(../../img/common/arrowR.png);
		}
	
@media screen and (min-width:768px) and (max-width:1112px){
			#info #infoRight .infoInner dl dt {
				width: 160px;
				}
	}

@media screen and (max-width: 768px){
	#info {
		margin: 0 auto;
		padding: 50px 0;
		}
				
		#info #infoLeft,
		#info #infoRight {
			float: none;
			width: 90%;
			margin: 0 auto;
			padding: 0;
			}
		
		#info #infoLeft {
			margin-bottom: 50px;
			}
		
		#info #infoRight {
			}
			
			#info .infoInner {
				margin-bottom: 20px;
				padding: 10px 0;
				}
				
				#info .infoInner dl {
					display: block;
					}
					
					#info .infoInner dl dt,
					#info .infoInner dl dd {
						display: block;
						}
						
					#info .infoInner dl dt,
					#info #infoRight .infoInner dl dt {
						width: 100%;
						margin-bottom: 5px;
						}
	}



/* サービス一覧 --------------------------------------------------------------- */
#service {
	}
	
	#service .serviceWrap {
		display: table;
		width: 100%;
		height: 400px;
		overflow: hidden;
		}
	
		#service .serviceWrap .serviceInnerService,
		#service .serviceWrap .serviceInnerInterview {
			color: #ffffff;
			display: table-cell;
			text-align: center;
			vertical-align: middle;
			box-sizing: border-box;
			}
			
			#service .serviceWrap .serviceInnerService .more a,
			#service .serviceWrap .serviceInnerInterview .more a {
				color: #ffffff;			
				background-image: url(../../img/common/arrowW.png);
				}
				
		#service .serviceWrap .serviceInnerService {
			width: 42%;
			background-color: #e95538;
			}
		
		#service .serviceWrap .serviceInnerInterview {
			width: 58%;
			background-position: left center, center center;
			background-size: auto 100%, cover;
			}
		
		#service .serviceWrap.top .serviceInnerInterview {
			background-image: url(../../img/home/service/arrow_left.png), url(../../img/home/service/wizheart_bg.jpg);
			}
		
		#service .serviceWrap.middle .serviceInnerInterview {
			background-image: url(../../img/home/service/arrow_right.png), url(../../img/home/service/chousoku_bg.jpg);
			background-position: right center, center center;
			}
		
		#service .serviceWrap.bottom .serviceInnerInterview {
			background-image: url(../../img/home/service/arrow_left.png), url(../../img/home/service/nihongo_bg.jpg);
			}
			
			#service .serviceWrap.middle .serviceInnerInterview:first-child {
				display: table-cell;
				}
			
			#service .serviceWrap.middle .serviceInnerInterview:last-child {
				display: none;
				}
			
				#service .serviceWrap .serviceInnerInterview .more {
					width: 350px;
					}
			
					#service .serviceWrap .serviceInnerInterview .more a {
						font-size: 16px;
						padding: 25px 0;
						}
						
						#service .serviceWrap h3 {
							width: 200px;
							margin: 0 auto;
							margin-bottom: 20px;
							padding-bottom: 20px;
							vertical-align: bottom;
							
							background-image: url(../../img/common/borderW.jpg);
							background-position: center bottom;
							background-size: 30px 1px;
							}
						
						#service .serviceWrap:last-child h3 {
							width: 300px;
							}
							
							#service .serviceWrap h3 img {
								width: 100%;
								}
			
						#service .serviceWrap p {
							margin-bottom: 30px;
							line-height: 1.7;
							}

@media screen and (min-width:769px) and ( max-width:1200px){
	#service .serviceWrap.top .serviceInnerService {
		width: 37%;
		padding-left: 5%;
		}
		
		#service .serviceWrap .serviceInnerService .dsk {
			display: none !important;
			}
		
	#service .serviceWrap.top .serviceInnerInterview {
		width: 44%;
		padding-left: 14%;
		}
	
	#service .serviceWrap.middle .serviceInnerService {
		width: 37%;
		padding-right: 5%;
		}
		
	#service .serviceWrap.middle .serviceInnerInterview {
		width: 44%;
		padding-right: 14%;
		}
		
	#service .serviceWrap.bottom .serviceInnerService {
		width: 37%;
		padding-left: 5%;
		}
			
	#service .serviceWrap.bottom .serviceInnerInterview {
		width: 44%;
		padding-left: 14%;
		}
	}

@media screen and (max-width: 768px){
	#service {
		}
		
		#service .serviceWrap {
			height: auto;
			}
		
			#service .serviceWrap .serviceInnerService,
			#service .serviceWrap .serviceInnerInterview {
				width: 100%;
				padding: 0;
				display: block;
				}
				
			#service .serviceWrap .serviceInnerService {
				padding: 30px 5% 0 5%;
				}
			
			#service .serviceWrap .serviceInnerInterview {
				padding: 100px 0 30px 0;
				}
				
			#service .serviceWrap .serviceInnerInterview {
				background-position: center top, center center !important;
				background-size: 100% 80px, cover;
				}
			
			#service .serviceWrap.top .serviceInnerInterview {
				background-image: url(../../img/home/service/arrow_bottom.png), url(../../img/home/service/wizheart_bg.jpg);
				}
			
			#service .serviceWrap.middle .serviceInnerInterview {
				background-image: url(../../img/home/service/arrow_bottom.png), url(../../img/home/service/chousoku_bg.jpg);
				}
			
			#service .serviceWrap.bottom .serviceInnerInterview {
				background-image: url(../../img/home/service/arrow_bottom.png), url(../../img/home/service/nihongo_bg.jpg);
				}
			
				#service .serviceWrap.middle .serviceInnerInterview:first-child {
					display: none;
					}
				
				#service .serviceWrap.middle .serviceInnerInterview:last-child {
					display: block;
					}
					
				#service .serviceWrap .serviceInnerInterview .more {
					width: 90%;
					}
						
						#service .serviceWrap h3 {
							width: 250px;
							}
						
						#service .serviceWrap:last-child h3 {
							width: 100%;
							}
							
							#service .serviceWrap h3 img {
								width: 100%;
								}
			
						#service .serviceWrap p {
							line-height: 1.6;
							}
	}



/* セミナー --------------------------------------------------------------- */
#seminar {
	padding: 100px 0;
	background-color: #fbf9f6;
	}
	
	#seminar #seminarInner {
		width: 100%;
		max-width: 1100px;
		margin: 0 auto 50px auto;
		overflow: hidden;
		}
			
		#seminar #seminarInner h3 {
			color: #e95538;
			font-size: 15px;
			font-weight: bold;
			text-align: center;
			padding-bottom: 15px;
			margin-bottom: 30px;
			letter-spacing: 1.5px;
			background-image: url(../../img/common/borderO.jpg);
			background-position: center bottom;
			background-size: 20px 1px;
			}
		
		#seminar #seminarInner ul {
			width: 100%;
			overflow: hidden;
			}
			
			#seminar #seminarInner ul li {
				float: left;
				width: 48%;
				margin-right: 4%;
				margin-bottom: 30px;
				}
				
			#seminar #seminarInner ul li:nth-child(even){
				margin-right: 0;
				}
				
				#seminar #seminarInner dl {
					width: 100%;
					display: table;
					}
					
					#seminar #seminarInner dl dt,
					#seminar #seminarInner dl dd {
						display: table-cell;
						vertical-align: middle;
						}
						
					#seminar #seminarInner dl dt {
						width: 120px;
						border-radius: 75px;
						overflow: hidden;
						}
						
						#seminar #seminarInner dl dt img {
							width: 100%;
							}
					
					#seminar #seminarInner dl dd {
						padding-left: 25px;
						}
						
						#seminar #seminarInner dl dd p {
							display: inline-block;
							color: #e95538;
							font-size: 12px;
							letter-spacing: 1.5px;
							margin-bottom: 10px;
							padding: 7px 30px;
							border: solid 0.5px;
							border-color: #e95538;
							}
							
						#seminar #seminarInner dl dd h4 {
							font-size: 15px;
							}
				
				#seminar .more a {
					color: #e95538;
					border-color: #e95538 !important;
					background-image: url(../../img/common/arrowR.png);
					}

@media screen and (min-width:769px) and (max-width:1112px){
	#seminar #seminarInner {
		width: 80%;
		}
		
		#seminar #seminarInner ul li {
			width: 46%;
			margin-right: 8%;
			}
			
				#seminar #seminarInner dl dt {
					width: 100px;
					border-radius: 50px;
					}
	}

@media screen and (max-width:768px){
	#seminar {
		padding: 50px 0;
		}
		
		#seminar #seminarInner {
			margin: 0 auto 20px auto;
			}
			
			#seminar #seminarInner ul {
				overflow: hidden;
				}
				
				#seminar #seminarInner ul li {
					float: none;
					width: 100%;
					margin: 0;
					margin-bottom: 20px;
					}
					
				#seminar #seminarInner h3 {
					padding-bottom: 0;
					margin-bottom: 30px;
					background-image: none;
					}
					
				#seminar #seminarInner dl {
					width: 90%;
					margin: 0 auto 20px auto;
					}
					
					#seminar #seminarInner dl dt,
					#seminar #seminarInner dl dd {
						display: block;
						}
						
					#seminar #seminarInner dl dt {
						display: none;
						}
					
					#seminar #seminarInner dl dd {
						padding-left: 0;
						}
						
						#seminar #seminarInner dl dd p {
							display: block;
							text-align: center;
							}
	}



/* ブログ --------------------------------------------------------------- */
#blog {
	padding: 100px 0;
	background-color: #fbf9f6;
	}
	
	#blog ul {
		width: 90%;
		max-width: 1100px;
		margin: 0 auto;
		overflow: hidden;
		}
			
		#blog ul li {
			float: left;
			width: 260px;
			margin-right: 20px;
			}
		
		#blog ul li:last-of-type {
			margin-right: 0;
			}
		
			#blog ul li a,
			#blog ul li a img {
				width: 100%;
				}
			
@media screen and (min-width:769px) and (max-width:1112px){
	#blog ul li {
		width: 23.5%;
		margin-right: 2%;
		}
	}

@media screen and (min-width:415px) and (max-width:768px){
	#blog {
		padding: 70px 0;
		}
	
		#blog ul {
			width: 70%;
			}
			
			#blog ul li {
				width: 47%;
				margin: 0 6% 6% 0;
				}
			
			#blog ul li:nth-child(even) {
				margin-right: 0;
				}
			
			#blog ul li:nth-child(3),
			#blog ul li:nth-child(4) {
				margin-bottom: 0;
				}
	}

@media screen and (max-width:414px){
	#blog {
		padding: 50px 0;
		}
		
		#blog ul {
			width: 98%;
			}
			
			#blog ul li {
				width: 48%;
				margin: 0 1% 10px 1%;
				}
				
			#blog ul li:nth-child(3),
			#blog ul li:nth-child(4) {
				margin: 0 1%;
				}
	}

			
			
/* 導入企業様 --------------------------------------------------------------- */
#customer {
	padding: 100px 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%;
					}
	}
	
	
				
/* 会社案内 --------------------------------------------------------------- */
#about {
	}
	
	#about ul {
		overflow: hidden;
		}
	
		#about ul li {
			float: left;
			width: 50%;
			padding: 150px 0;
			color: #ffffff;
			display: table-cell;
			text-align: center;
			vertical-align: middle;
			background-position: center center;
			background-size: cover;
			}
		
		#about ul li:first-child {
			background-image: url(../../img/home/about/service.jpg);
			}
		
		#about ul li:last-child {
			background-image: url(../../img/home/about/profile.jpg);
			}
				
			#about .more {
				width: 350px;
				}
			
				#about .more a {
					font-size: 16px;
					padding: 25px 0;
					color: #ffffff;
					background-image: url(../../img/common/arrowW.png);
					}

@media screen and (max-width: 768px){
	#about {
		}
		
		#about ul {
			overflow: hidden;
			}
		
			#about ul li {
				float: none;
				width: 100%;
				margin-bottom: 1px;
				padding: 100px 0;
				display: block;
				}
				
				#about .more {
					width: 90%;
					}
	}