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



/* FONT size
---------------------------------------------------------------------
[ px ]	[ % ]
10px 	72  %		19px 	136 %
11px 	79  %		20px 	143 %
12px 	86 %		21px 	150 %
13px 	93 %		22px 	158 %
14px 	100 %		23px 	165 %
15px 	108 %		24px 	172 %
16px 	115 %		25px 	179 %
17px 	122 %		26px 	186 %
18px 	129 %
---------------------------------------------------------------------*/







/* ++++++++++++++++++++++++++++++++++++++++++++++ */
/* 下層タイトル */
/* ++++++++++++++++++++++++++++++++++++++++++++++ */
#pagetitle.index {
	background: url(../img/pagetitle.jpg) no-repeat center;
	background-size: cover;
}
#pagetitle.recruitment {
	background: url(../img/recruitment/pagetitle.jpg) no-repeat center;
	background-size: cover;
}
#pagetitle.personality {
	background: url(../img/personality/pagetitle.jpg) no-repeat center;
	background-size: cover;
}
#pagetitle.diversity {
	background: url(../img/diversity/pagetitle.jpg) no-repeat center;
	background-size: cover;
}
	#pagetitle.recruitment h1 span {
		display: block;
		width: 86px;
		height: 28px;
		border-radius: 5px;
		margin: 0 auto;
		background: #fff;
		font-size: 14px;
		font-weight: 500;
		text-align: center;
		line-height: 28px;
		letter-spacing: 0.1em;
		color: #00a0f7;
	}



	
	
/* number */
.number {
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
	letter-spacing: 0;
}


	
	
/* list
--------------------- */
#list {
	width: 100%;
	padding: 100px 0 0 0;
}
	#list .linkbox {
		width: 50%;
		margin-bottom: 120px;
	}
	#list .diversity {
		width: 100%;
		margin-bottom: 0px;
	}
		#list .linkbox a {
			display: block;
			position: relative;
		}
		#list .diversity a {
			display: flex;
			-webkit-box-orient: horizontal;
			-webkit-box-direction: reverse;
			 -ms-flex-direction: row-reverse;
				 flex-direction: row-reverse;
		}
			#list .linkbox a .headtit {
				margin-bottom: 40px;
				transition: 0.3s;
				-webkit−transition: 0.3s;
				position: relative;
			}
			#list .diversity a .headtit {
				width: 350px;
				padding-left: 70px;
			}
			#list .linkbox a:hover .headtit {
				color: #00A0F7;
			}
			#list .linkbox a .headtit.tag:before {
				content: "新卒採用";
				display: block;
				width: 75px;
				height: 25px;
				border-radius: 4px;
				margin: 0 auto;
				background: #d7f0fc;
				font-size: 13px;
				font-weight: 500;
				text-align: center;
				line-height: 25px;
				letter-spacing: 0.1em;
				color: #00a0f7;
				position: absolute;
				top: -28px;
				left: 0;
			}
				#list .linkbox a .headtit h2 {
					font-size: 200%;
					line-height: 1.4em;
					font-weight: 500;
					margin-bottom: 10px;
				}

				#list .linkbox a .headtit .en {
					text-align: left;
					letter-spacing: 2px;
				}


			#list .linkbox a .pht {
				height: 500px;
			}
			#list .recruitment a .pht {
				background: url(../img/list_pht_recruitment.jpg) no-repeat center;
				background-size: cover;
			}
			#list .personality a .pht {
				background: url(../img/list_pht_personality.jpg) no-repeat center;
				background-size: cover;
			}
			#list .diversity a .pht {
				width: -webkit-calc(100% - 350px);
				width: calc(100% - 350px);
				background: url(../img/list_pht_diversity.jpg) no-repeat center;
				background-size: cover;
			}


			#list .linkbox a .link {
				width: 300px;
				height: 60px;
				line-height: 66px;
				padding-left: 25px;
				background: #fff url(../../common/img/arrow_black.svg) no-repeat 92% center;
				background-size: 30px;
				position: absolute;
				z-index: 10;
				transition: 0.3s;
				-webkit−transition: 0.3s;
			}
			#list .recruitment a .link,
			#list .personality a .link {
				left: 0;
				bottom: 0;
			}
			#list .diversity a .link {
				bottom: 250px;
				right: 0;
			}
			#list .linkbox a:hover .link {
				color: #00A0F7;
				background: #fff url(../../common/img/arrow_black.svg) no-repeat 95% center;
				background-size: 30px;
			}


	
	
/* anchor
--------------------- */
#anchor {
	width: 100%;
	padding: 100px 0 0 0;
}
	#anchor ul.column2 li {
		width: 49%;
	}
	#anchor ul.column3 li {
		width: 32%;
	}
		#anchor ul li a {
			display: block;
			height: 60px;
			background: #000;
			font-size: 115%;
			text-align: center;
			color: #fff;
			line-height: 60px;
			position: relative;
			transition: 0.3s;
			-webkit−transition: 0.3s;
		}
		#anchor ul li a:after {
			content: "";
			width: 0;
			height: 0;
			border-style: solid;
			border-width: 6px 6px 0 6px;
			border-color: #ffffff transparent transparent transparent;
			position: absolute;
			top: 50%;
			right: 20px;
			margin-top: -2px;
		}
		#anchor ul li a:hover {
			background: #00A0F7;
		}


	
	
/* recruitment
--------------------- */
#recruitment {
	width: 100%;
	padding: 100px 0 0 0;
}
	#recruitment .title {
		text-align: center;
	}


	#recruitment table {
		width: 100%;
		border-collapse: collapse;
		border-bottom: solid 3px #000;
	}
		#recruitment table th {
			width: 180px;
			border-top: solid 3px #000;
			font-size: 108%;
			font-weight: 700;
			text-align: left;
			vertical-align: top;
			padding: 30px 0 50px 0;
		}
		#recruitment table td {
			border-top: solid 3px #000;
			vertical-align: top;
			padding: 30px 0 50px 0;
		}
			#recruitment table td a {
				color: #00A0F7;
			}
			#recruitment table td a:hover {
				text-decoration: underline;
			}


	
	
/* step
--------------------- */
#step {
	width: 100%;
	padding: 100px 0 0 0;
}
	#step .title {
		text-align: center;
		padding-bottom: 60px;
	}


	#step .box {
		width: 31%;
	}
		#step .box h3 {
			font-size: 143%;
			font-weight: 500;
			text-align: center;
			line-height: 1.3em;
			margin-bottom: 15px;
		}
			#step .box h3 span {
				font-size: 13px;
			}

		#step .box ul {
			position: relative;
		}
		#step .box ul:after {
			content: "";
			background: #B8E6FF;
			width: 20px;
			height: 86.5%;
			position: absolute;
			top: 0;
			left: 50%;
			margin-left: -10px;
			z-index: -1;
		}
		#step .box ul:before {
			content: "";
			width: 0;
			height: 0;
			border-style: solid;
			border-width: 22px 24px 0 24px;
			border-color: #b8e6ff transparent transparent transparent;
			position: absolute;
			bottom: 70px;
			left: 50%;
			margin-left: -24px;
			z-index: -1;
		}
			#step .box ul li {
				width: 100%;
				display: table;
				border: solid 3px #00A0F7;
				margin-bottom: 40px;
				color: #00A0F7;
				background: #fff;
			}
			#step .box ul li.none {
				border: none;
				padding-bottom: 6px;
				background: none;
			}
			#step .box ul li:nth-last-child(1) {
				background: #00A0F7;
				font-size: 129%;
				color: #fff;
				margin-bottom: 10px;
			}
				#step .box ul li p {
					display: table-cell;
					height: 70px;
					font-weight: 700;
					line-height: 1.4em;
					text-align: center;
					vertical-align: middle;
				}
					#step .box ul li p span {
						font-size: 86%;
						font-weight: 500;
						letter-spacing: 0.06em;
						color: #000;
					}
					#step .box ul li p a.download {
						width: 146px;
						margin: auto;
						display: block;
						text-decoration: underline;
						font-size: 86%;
						font-weight: 500;
						letter-spacing: 0.06em;
						background: url("../img/recruitment/download.svg") no-repeat left center / 14px;
					}

		#step .box .cap {
			letter-spacing: 1px;
		}


	
	
/* faq
--------------------- */
#faq {
	width: 100%;
	padding: 100px 0 0 0;
}
	#faq .title {
		text-align: center;
		padding-bottom: 60px;
	}


	#faq .cell {
		margin-bottom: 50px;
	}
		#faq .cell h3 {
			font-size: 172%;
			font-weight: 500;
			text-align: center;
		}

		#faq .cell dl {
			background: #00A0F7;
			margin-top: 20px;
		}
			#faq .cell dl dt {
				font-size: 129%;
				font-weight: 700;
				line-height: 1.4em;
				text-indent: -42px;
				color: #fff;
				padding: 20px 50px 20px 62px;
				cursor: pointer;
				position: relative;
			}
			#faq .cell dl dt:before {
				content: "";
				width: 15px;
				height: 1px;
				background: #fff;
				position: absolute;
				top: 50%;
				right: 20px;
				margin-top: -0.5px;
			}
			#faq .cell dl dt:after {
				content: "";
				width: 1px;
				height: 15px;
				background: #fff;
				position: absolute;
				top: 50%;
				right: 27px;
				margin-top: -7.5px;
			}
			#faq .cell dl dt.active:after {
				display: none;
			}
				#faq .cell dl dt span {
					font-size: 24px;
					padding-right: 10px;
				}

			#faq .cell dl dd {
				display: none;
				padding: 0 20px 24px 62px;
				color: #fff;
				position: relative;
			}
			#faq .cell dl dd:after {
				content: "A.";
				font-family: 'Hammersmith One', sans-serif;
				font-size: 24px;
				font-weight: 400;
				position: absolute;
				top: -10px;
				left: 23px;
			}




	
	
/* training
--------------------- */
#training {
	width: 100%;
	padding: 100px 0;
}
	#training .title {
		text-align: center;
	}


	#training .professional {
		text-align: center;
		background: #F3F3F3;
		padding: 50px;
		margin-bottom: 80px;
	}
		#training .professional h3 {
			font-size: 200%;
			font-weight: 700;
			margin-bottom: 20px;
		}

		#training .professional p {
			line-height: 34px;
			letter-spacing: 2px;
		}


	#training .flow {
		height: 1150px;
		position: relative;
	}
	#training .flow:before {
		content: "";
		width: 3px;
		height: 100%;
		background: #00A0F7;
		position: absolute;
		top: 0;
		left: 50%;
		margin-left: -1.5px;
		z-index: -1;
	}
	#training .flow:after {
		content: "";
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 14px 15px 0 15px;
		border-color: #00a1f7 transparent transparent transparent;
		position: absolute;
		bottom: -3px;
		left: 50%;
		margin-left: -15px;
		z-index: -1;
	}
		#training .flow h3.head {
			width: 510px;
			height: 70px;
			margin: auto;
			background: #00A0F7;
			font-size: 200%;
			font-weight: 700;
			color: #fff;
			line-height: 70px;
			text-align: center;
		}

		#training .flow .days {
			width: 38%;
			border: solid 3px #00A0F7;
			background: #fff;
			position: absolute;
		}
		#training .flow .days01 {
			top: 150px;
			left: 0px;
		}
		#training .flow .days02 {
			top: 300px;
			right: 0px;
		}
		#training .flow .days03 {
			top: 450px;
			left: 0px;
		}
		#training .flow .days04 {
			top: 600px;
			right: 0px;
		}
		#training .flow .days05 {
			top: 750px;
			left: 0px;
		}
		#training .flow .days06 {
			top: 900px;
			right: 0px;
		}
			#training .flow .days .area {
				padding: 50px 40px 40px 40px;
				position: relative;
			}
			#training .flow .days .area:before {
				content: "";
				width: 180px;
				height: 3px;
				background: #00A0F7;
				position: absolute;
				top: 50%;
				margin-top: -1.5px;
				z-index: -1;
			}
			#training .flow .days01 .area:before,
			#training .flow .days03 .area:before,
			#training .flow .days05 .area:before {
				right: -33%;
			}
			#training .flow .days02 .area:before,
			#training .flow .days04 .area:before,
			#training .flow .days06 .area:before {
				left: -33%;
			}
			#training .flow .days01 .area:after,
			#training .flow .days03 .area:after,
			#training .flow .days05 .area:after {
				content: "";
				width: 14px;
				height: 14px;
				border-radius: 50%;
				background: #00A0F7;
				position: absolute;
				top: 50%;
				margin-top: -7px;
				right: -34%;
			}
			#training .flow .days02 .area:after,
			#training .flow .days04 .area:after,
			#training .flow .days06 .area:after {
				content: "";
				width: 14px;
				height: 14px;
				border-radius: 50%;
				background: #00A0F7;
				position: absolute;
				top: 50%;
				margin-top: -7px;
				left: -34%;
			}
				#training .flow .days .area h4 {
					width: 200px;
					height: 40px;
					font-size: 115%;
					font-weight: 700;
					text-align: center;
					line-height: 34px;
					background: #fff;
					border: solid 3px #00A0F7;
					border-radius: 40px;
					position: absolute;
					top: -22px;
					left: 50%;
					margin-left: -100px;
				}

				#training .flow .days .area dl dt {
					font-size: 143%;
					font-weight: 500;
					line-height: 1.4em;
					color: #00A0F7;
					margin-bottom: 10px;
				}
				#training .flow .days01 .area dl dd,
				#training .flow .days03 .area dl dd {
					position: relative;
					letter-spacing: 2px;
					padding-right: 80px;
				}
					#training .flow .days01 .area dl dd img {
						width: 150px;
						height: auto;
						position: absolute;
						top: 50%;
						right: -90px;
						margin-top: -75px;
					}
					#training .flow .days03 .area dl dd img {
						width: 150px;
						height: auto;
						position: absolute;
						top: 50%;
						right: -90px;
						margin-top: -45px;
					}


	#training .figure {
		padding-top: 50px;
	}
		#training .figure h3 {
			font-size: 200%;
			font-weight: 700;
			margin-bottom: 20px;
			text-align: center;
		}

		#training .figure table {
			width: 100%;
			border-collapse: collapse;
		}
			#training .figure table th {
				border: solid 1px #000;
				padding: 20px 15px;
				background: #E3F5FF;
				font-size: 108%;
				line-height: 1.4em;
				letter-spacing: 1px;
				text-align: center;
			}
			#training .figure table th.half {
				width: 150px;
			}
			#training .figure table td {
				border: solid 1px #000;
				padding: 15px;
				line-height: 1.4em;
				letter-spacing: 1px;
				background: #fff;
				text-align: left;
			}
				#training .figure table td ul {
					display: table;
					width: 100%;
				}
				#training .figure table .td02 ul {
					height: 202px;
					background: #F3F3F3;
				}
				#training .figure table .td03 ul {
					height: 311px;
					background: #F3F3F3;
				}
					#training .figure table td ul li {
						display: table-cell;
						background: #F3F3F3;
					}

				#training .figure table .td01 ul,
				#training .figure table .td02 ul ,
				#training .figure table .td03 ul {
					margin-bottom: 15px;
				}
				#training .figure table td ul:nth-last-child(1) {
					margin-bottom: 0;
				}
					#training .figure table td ul li {
						text-align: center;
						line-height: 1.4em;
						vertical-align: middle;
					}
					#training .figure table .td01 ul li {
						height: 50px;
					}
					#training .figure table .td04 ul li,
					#training .figure table .td05 ul li,
					#training .figure table .td06 ul li,
					#training .figure table .td07 ul li {
						border-right: solid 15px #fff;
						padding: 0 5px;
						height: 638px;
					}
					#training .figure table td ul li:nth-last-child(1) {
						border-right: none;
					}

					#training .figure table .td05 ul li p {
						position: relative;
					}
					#training .figure table .td05 ul li p:before {
						content: "（";
						transform: rotate( 90deg );
						font-size: 14px;
						position: absolute;
						top: -18px;
						left: 50%;
						margin-left: -8px;
					}
					#training .figure table .td05 ul li p:after {
						content: "）";
						transform: rotate( 90deg );
						font-size: 14px;
						position: absolute;
						bottom: -18px;
						left: 50%;
						margin-left: -8px;
					}


	#training .example {
		padding-top: 60px;
	}
		#training .example h3 {
			font-size: 200%;
			font-weight: 700;
			margin-bottom: 20px;
			text-align: center;
		}

		#training .example .box {
			background: #F3F3F3;
			padding: 50px;
			margin-bottom: 30px;
		}
			#training .example .box h4 {
				font-size: 158%;
				font-weight: 500;
				line-height: 1.4em;
				color: #00A0F7;
				margin-bottom: 20px;
			}

			#training .example .box h5 {
				font-size: 122%;
				font-weight: 500;
				line-height: 1.2em;
				margin-bottom: 10px;
				margin-right: 20px;
				padding-left: 15px;
				position: relative;
			}
			#training .example .box h5:after {
				content: "";
				width: 8px;
				height: 8px;
				background: #00A0F7;
				border-radius: 50%;
				position: absolute;
				top: 7px;
				left: 0;
			}
				#training .example .box h5 span {
					font-size: 12px;
					letter-spacing: 1px;
				}

		#training .example .flex-start .box:nth-child(1) {
			width: 64%;
		}
		#training .example .flex-start .box:nth-child(2) {
			width: 33.5%;
			position: relative;
		}
			#training .example .flex-start .box .tbox {
				width: 47%;
				position: relative;
				padding-bottom: 36%;
			}
			#training .example .flex-start .box:nth-child(2) img {
				display: block;
				width: 100%;
				padding: 0 50px;
				height: auto;
				position: absolute;
				bottom: 50px;
				left: 0;
			}
			#training .example .flex-start .box .tbox img {
				padding-top: 0;
				width: 100%;
				height: auto;
				position: absolute;
				bottom: 0;
				left: 0;
			}




	
	
/* personality
--------------------- */
#personality {
	width: 100%;
	padding: 100px 0;
	background: url(../img/personality/personality_bg.jpg) no-repeat center;
	background-size: cover;
}
	#personality .title {
		text-align: center;
		padding-bottom: 60px;
	}
		#personality .title h2,
		#personality .title .en {
			color: #fff;
		}


	#personality .text {
		color: #fff;
		line-height: 32px;
		text-align: center;
	}


	#personality ul {
		width: 960px;
		margin: auto;
		padding-top: 50px;
		margin-bottom: 30px;
	}
		#personality ul li {
			display: table;
			width: 32%;
			background: rgba(0,160,247,0.9);
			margin-right: 2%;
			margin-bottom: 2%;
		}
		#personality ul li:nth-child(3n) {
			margin-right: 0;
		}
			#personality ul li span {
				display: table-cell;
				height: 200px;
				font-size: 158%;
				font-weight: 700;
				line-height: 1.5em;
				text-align: center;
				vertical-align: middle;
				color: #fff;
			}


	
	
/* life
--------------------- */
#life {
	width: 100%;
	padding: 100px 0 0 0;
}
	#life .title {
		text-align: center;
	}


	#life .system {
		margin-bottom: 50px;
	}
	#life .system:nth-last-child(1) {
		margin-bottom: 0;
	}
		#life .system .tit {
			font-size: 172%;
			font-weight: 500;
			margin-bottom: 20px;
		}

		#life .system .box {
			width: 32%;
			padding: 50px;
			background: #E5F5FE;
			margin-right: 2%;
			margin-bottom: 2%;
			position: relative;
		}
		#life .system .box:nth-child(3n) {
			margin-right: 0;
		}
			#life .system .box .icon {
				width: 70px;
				height: 24px;
				font-size: 86%;
				font-weight: 700;
				text-align: center;
				line-height: 24px;
				letter-spacing: 1px;
				color: #fff;
				background: #00A0F7;
				border-radius: 24px;
				position: absolute;
				top: -12px;
				left: 50%;
				margin-left: -35px;
			}

			#life .system .box h3 {
				font-size: 158%;
				font-weight: 500;
				line-height: 1.5em;
				color: #00A0F7;
				letter-spacing: 2px;
				margin-bottom: 10px;
			}

			#life .system .box p {
				line-height: 30px;
			}


	#life .rate {
		padding-top: 30px;
		margin-bottom: 60px;
	}
		#life .rate .nbox {
			width: 48%;
			text-align: center;
		}
			#life .rate .nbox .in {
				border-bottom: solid 1px #000;
				padding: 0 0 25px 0;
				margin-bottom: 10px;
			}
				#life .rate .nbox .in h3 {
					font-size: 158%;
					font-weight: 500;
					position: relative;
					margin-bottom: 15px;
				}
				#life .rate .nbox .in h3:before {
					content: "";
					width: 100%;
					height: 1px;
					background: #000;
					position: absolute;
					top: 20px;
					left: 0;
					z-index: -1;
				}
					#life .rate .nbox .in h3 span {
						background: #fff;
						padding: 0 15px;
					}

				#life .rate .nbox .in .number {
					font-size: 300%;
					line-height: 1;
				}
					#life .rate .nbox .in .number span {
						font-size: 120px;
						color: #00A0F7;
					}

				#life .rate .nbox .in p {
					font-size: 122%;
					font-weight: 500;
				}


	
	
/* other
--------------------- */
#other {
	width: 100%;
	padding: 100px 0 0 0;
}
	#other .title {
		text-align: center;
	}


	#other .system .box {
		padding: 50px;
		margin-right: 2%;
		margin-bottom: 2%;
		background: #E5F5FE;
	}
	#other .column2 .box {
		width: 49%;
	}
	#other .column3 .box {
		width: 32%;
	}
	#other .column2 .box:nth-child(2n) {
		margin-right: 0;
	}
	#other .column3 .box:nth-child(3n) {
		margin-right: 0;
	}
		#other .system .box h3 {
			font-size: 158%;
			font-weight: 500;
			color: #00A0F7;
			line-height: 1.5em;
			letter-spacing: 2px;
			margin-bottom: 10px;
		}

		#other .system .box p {
			line-height: 30px;
		}


	#other .column .box:nth-child(1) {
		width: 66%;
	}
	#other .column .box:nth-child(2) {
		width: 32%;
		margin-right: 0;
		position: relative;
	}
		#other .column .box ul {
			padding-top: 20px;
		}
			#other .column .box ul li {
				width: 47%;
			}
				#other .column .box ul li img {
					width: 100%;
					height: auto;
				}


		#other .column .box .pht {
			width: 73%;
			overflow: hidden;
			position: absolute;
			bottom: 50px;
			left: 50px;
		}
			#other .column .box .pht img {
				width: 115%;
				height: auto;
			}

		#other .column .box .txt {
			display: block;
			padding-top: 10px;
			font-size: 86%;
			line-height: 1;
			text-align: center;
		}




/* 1400px */
@media screen and (max-width: 1400px) {




	
	
/* training
--------------------- */
#training .flow .days01 .area:after,
#training .flow .days03 .area:after,
#training .flow .days05 .area:after {
	right: -35%;
}
#training .flow .days02 .area:after,
#training .flow .days04 .area:after,
#training .flow .days06 .area:after {
	left: -34.5%;
}




	




}









/* 1160px */
@media screen and (max-width: 1160px) {







/* ++++++++++++++++++++++++++++++++++++++++++++++ */
/* 下層タイトル */
/* ++++++++++++++++++++++++++++++++++++++++++++++ */
#pagetitle {
	background: url(../img/pagetitle.jpg) no-repeat 66%;
	background-size: cover;
}


	
	


	
	
/* list
--------------------- */
#list {
	width: 100%;
	padding: 100px 0 0 0;
}
#list .inner {
	display: block;
}
	#list .linkbox {
		width: 100%;
		margin-bottom: 100px;
	}
	#list .diversity {
		margin-bottom: 0px;
	}
		#list .diversity a {
			display: block;
		}
			#list .diversity a .headtit {
				width: 100%;
				padding-left: 0;
			}


			#list .diversity a .pht {
				width: 100%;
			}


			#list .diversity a .link {
				left: 0;
				bottom: 0;
			}


	
	
/* recruitment
--------------------- */
#recruitment table th {
	width: 200px;
}




	
	
/* training
--------------------- */
#training .flow {
	height: auto;
}
	#training .flow .days {
		width: 100%;
		position: static;
		margin-top: 60px;
	}
		#training .flow .days .area {
			padding: 50px 40px 40px 40px;
			position: relative;
		}
		#training .flow .days .area:before,
		#training .flow .days .area:after {
			display: none;
		}
			#training .flow .days01 .area dl dd,
			#training .flow .days03 .area dl dd {
				padding-right: 120px;
			}
				#training .flow .days01 .area dl dd img {
					right: -60px;
				}
				#training .flow .days03 .area dl dd img {
					right: -60px;
					margin-top: -75px;
				}
	
	#training .flow:after {
		display: none;
	}



#training .figure .scroll {
	overflow: auto;
	white-space: nowrap;
}


	#training .example .box {
		margin-bottom: 30px;
	}
	#training .example .box:nth-last-child(1) {
		margin-bottom: 0;
	}

	#training .example .flex-start {
		display: block;
		margin-bottom: 30px;
	}
		#training .example .flex-start .box:nth-child(1) {
			width: 100%;
		}
		#training .example .flex-start .box:nth-child(2) {
			width: 100%;
		}
			#training .example .flex-start .box .flex-start {
				margin-bottom: 0;
			}
			#training .example .flex-start .box .tbox {
				width: 100%;
				margin-bottom: 50px;
				padding-bottom: 0;
			}
			#training .example .flex-start .box .tbox:nth-last-child(1) {
				margin-bottom: 0;
			}
				#training .example .flex-start .box img {
					position: static !important;
					padding: 20px 0 0 0 !important;
				}




	
	
/* personality
--------------------- */
#personality ul {
	width: 100%;
}


	
	
/* life
--------------------- */
#life .system .box {
	width: 100%;
	margin-right: 0;
	margin-bottom: 2%;
}
#life .system .box:nth-child(2n) {
	margin-right: 0;
}
#life .system .box:nth-child(3) {
	margin-right: 0;
}




	
	
/* other
--------------------- */
#other .system .box {
	padding: 50px;
	margin-right: 0;
	background: #E5F5FE;
}
#other .column2 .box {
	width: 100%;
}
#other .column3 .box {
	width: 100%;
}
	
#other .column .box:nth-child(1) {
	width: 100%;
}
#other .column .box:nth-child(2) {
	width: 100%;
}


	#other .column .box .pht {
		width: 47%;
		position: static;
		padding-top: 20px;
	}
		#other .column .box .pht img {
			width: 100%;
			height: auto;
		}

	#other .column .box .txt {
		font-size: 72%;
		letter-spacing: 1px;
	}



}

	







/* max 767px */
@media screen and (max-width: 767px) {







/* ++++++++++++++++++++++++++++++++++++++++++++++ */
/* 下層タイトル */
/* ++++++++++++++++++++++++++++++++++++++++++++++ */
#pagetitle.recruitment h1 span {
	margin-bottom: 10px;
}


	
	
/* list
--------------------- */
#list {
	padding: 90px 0 0 0;
}
	#list .linkbox {
		margin-bottom: 50px;
	}
		#list .linkbox a .headtit {
			margin-bottom: 20px;
		}
			#list .linkbox a .headtit h2 {
				font-size: 143%;
				letter-spacing: 2px;
				margin-bottom: 5px;
			}
			#list .linkbox a .headtit .en {
				font-size: 86%;
			}


			#list .linkbox a .pht {
				height: 300px;
			}


			#list .linkbox a .link {
				width: 65%;
				height: 50px;
				line-height: 56px;
				font-size: 93%;
			}


	
	
/* anchor
--------------------- */
#anchor {
	padding: 50px 0 0 0;
}
	#anchor ul li a {
		font-size: 93%;
		letter-spacing: 1px;
	}
	#anchor ul li a:after {
		border-color: #000 transparent transparent transparent;
		top: 60px;
		right: 50%;
		margin-top: 0;
		margin-right: -6px;
	}


	
	
/* recruitment
--------------------- */
#recruitment {
	padding: 50px 0 0 0;
}
	#recruitment table {
		border-bottom: solid 3px #000;
	}
		#recruitment table th {
			display: block;
			width: 100%;
			padding: 20px 0 10px 0;
		}
		#recruitment table td {
			display: block;
			width: 100%;
			font-size: 93%;
			padding: 0 0 40px 0;
			border-top: none;
		}
			#recruitment table td a {
				color: #00A0F7;
			}
			#recruitment table td a:hover {
				text-decoration: underline;
			}


	
	
/* step
--------------------- */
#step {
	padding: 50px 0 0 0;
}
	#step .flex-start {
		display: block;
	}
	#step .box {
		width: 100%;
		margin-bottom: 30px;
	}
		#step .box h3 {
			font-size: 135%;
		}
			#step .box h3 span {
				font-size: 12px;
			}
			#step .box:nth-child(1) h3 span,
			#step .box:nth-child(1) h3 br {
				display: none;
			}
			#step .box ul li.none {
				display: none;
			}


	
	
/* faq
--------------------- */
#faq {
	padding: 50px 0 0 0;
}
	#faq .cell {
		margin-bottom: 50px;
	}
		#faq .cell h3 {
			font-size: 135%;
			font-weight: 500;
			text-align: center;
		}

		#faq .cell dl {
			margin-top: 10px;
		}
			#faq .cell dl dt {
				font-size: 108%;
				text-indent: -32px;
				padding: 15px 50px 15px 48px;
			}
				#faq .cell dl dt span {
					font-size: 20px;
					padding-right: 5px;
				}

			#faq .cell dl dd {
				font-size: 93%;
				line-height: 1.8em;
				padding: 0 20px 15px 48px;
			}
			#faq .cell dl dd:after {
				font-size: 20px;
				top: 0px;
				left: 18px;
			}




	
	
/* training
--------------------- */
#training {
	padding: 50px 0;
}
	#training .professional {
		padding: 25px;
		margin-bottom: 50px;
	}
		#training .professional h3 {
			font-size: 135%;
			margin-bottom: 10px;
		}

		#training .professional p {
			font-size: 93%;
			text-align: left;
			line-height: 2em;
		}


		#training .flow h3.head {
			width: 100%;
			height: 60px;
			font-size: 135%;
			letter-spacing: 2px;
			line-height: 60px;
		}

			#training .flow .days .area {
				padding: 40px 25px 25px 25px;
				position: relative;
			}
				#training .flow .days .area h4 {
					font-size: 100%;
				}

				#training .flow .days .area dl dt {
					font-size: 122%;
				}
				#training .flow .days .area dl dd {
					font-size: 93%;
					line-height: 2em;
					text-align: left;
				}
				#training .flow .days01 .area dl dd,
				#training .flow .days03 .area dl dd {
					padding-right: 0;
				}
					#training .flow .days01 .area dl dd img,
					#training .flow .days03 .area dl dd img {
						width: 100%;
						height: auto;
						position: static;
						padding-top: 20px;
						margin-top: 0;
					}


	#training .figure {
		padding-top: 50px;
	}
		#training .figure h3 {
			font-size: 135%;
		}
			#training .figure table th {
				font-size: 93%;
			}
			#training .figure table th.half {
				width: 110px;
			}
			#training .figure table td {
				font-size: 86%;
			}


	#training .example {
		padding-top: 50px;
	}
		#training .example h3 {
			font-size: 135%;
		}

		#training .example .box {
			padding: 25px;
		}
			#training .example .box h4 {
				font-size: 129%;
			}

			#training .example .box .flex {
				display: block;
			}
				#training .example .box h5 {
					font-size: 108%;
					margin-right: 0;
					padding-left: 15px;
				}
				#training .example .box h5:after {
					top: 6px;
				}

			#training .example .flex-start .box .flex-start {
				margin-bottom: 0;
			}
				#training .example .flex-start .box .tbox {
					margin-bottom: 28px;
				}
	
			#training .example .box p {
				font-size: 93%;
				line-height: 2em;
			}
	
			#training .example .box img {
				padding-top: 15px;
			}




	
	
/* personality
--------------------- */
#personality {
	padding: 50px 0;
}
	#personality .text {
		font-size: 93%;
		text-align: left;
		line-height: 2em;
	}


	#personality ul {
		padding-top: 30px;
		margin-bottom: 30px;
	}
		#personality ul li {
			width: 49%;
			margin-right: 2%;
			margin-bottom: 2%;
		}
		#personality ul li:nth-child(2n) {
			margin-right: 0;
		}
		#personality ul li:nth-child(3) {
			margin-right: 2%;
		}
			#personality ul li span {
				height: 120px;
				font-size: 115%;
				font-weight: 700;
				line-height: 1.5em;
				letter-spacing: 1px;
			}


	
	
/* life
--------------------- */
#life {
	padding: 50px 0 0 0;
}
	#life .system {
		display: block;
	}
		#life .system .tit {
			font-size: 143%;
			font-weight: 500;
			letter-spacing: 2px;
			margin-bottom: 20px;
		}
	
		#life .system .box {
			width: 100%;
			padding: 25px;
			margin-right: 0 !important;
			margin-bottom: 10px;
		}

			#life .system .box h3 {
				font-size: 135%;
			}

			#life .system .box p {
				font-size: 93%;
				line-height: 2em;
			}


	#life .rate {
		display: block;
	}
		#life .rate .nbox {
			width: 100%;
			margin-bottom: 20px;
		}
			#life .rate .nbox .in {
				padding: 0 0 20px 0;
			}
				#life .rate .nbox .in h3 {
					font-size: 135%;
					margin-bottom: 5px;
				}
				#life .rate .nbox .in h3:before {
					content: "";
					width: 100%;
					height: 1px;
					background: #000;
					position: absolute;
					top: 18px;
					left: 0;
					z-index: -1;
				}

				#life .rate .nbox .in .number {
					font-size: 300%;
					line-height: 1;
				}
					#life .rate .nbox .in .number span {
						font-size: 90px;
					}

				#life .rate .nbox .in p {
					font-size: 100%;
				}


	
	
/* other
--------------------- */
#other {
	padding: 60px 0 0 0;
}
	#other .system {
		display: block;
	}
		#other .system .box {
			width: 100%;
			padding: 25px;
			margin-bottom: 10px;
		}
			#other .system .box h3 {
				font-size: 135%;
			}

			#other .system .box p {
				font-size: 93%;
				line-height: 2em;
			}







}