:root{
	--color_brue: #55c1ff;
	--color_orange: #ff7e00;
	--color_pink: #ff6699;
}

.imgup{
	font-size: 0;
	line-height: 0;
	text-align: center;
	margin: 0 0 20px 0;
	padding: 0 20px;
}
.imgup img{
	max-width: 100%;
	height: auto;
}
.mv{
	font-size: 0;
	line-height: 0;
	padding: 40px 20px;
	background: #fff0f3;
}
.mv .rec_s_title{	margin-bottom: 20px;}
.mv video{
	width: 100%;
	height: auto;
}


/** title **/

.rec_title{
	display: flex;
	align-items: center;
	align-content: center;
	justify-content: center;
	font-family: 'M PLUS 1p', sans-serif;
	font-weight: 900;
}
.rec_title span{
	font-size: 52px;
	line-height: 1.2;
	margin-right: 10px;
}
.rec_title span i{
	font-style: normal;
	font-size: 20px;
}
.rec_title em{
	font-size: 70px;
	line-height: 1.2;
	color: var(--color_pink);
	padding: 0 0 5px 0;
	background: url(img/title.png) repeat-x bottom left;
	background-size: 20px auto;
}

.rec_s_title{}
.rec_s_title em{
	display: block;
	font-family: 'M PLUS 1p', sans-serif;
	font-weight: 900;
	font-size: 40px;
	line-height: 1.2;
}
.rec_s_title span{
	font-family: 'M PLUS 1p', sans-serif;
	font-weight: 500;
	font-size: 12px;
	line-height: 1;
}


/** point **/

#point{
	padding: 40px 40px 40px 40px;
	background: #fff0f3;
}

#point h3{	margin-bottom: 40px;}

.pbox{
	position: relative;
	margin: 0 0 40px 0;
}
.pbox:last-of-type{	margin-bottom: 0;}

.pbox h4{
	min-height: 70px;
	text-align: left;
	margin: 0 0 10px 0;
	padding: 0 0 0 60px;
}
.pbox h4 span{
	display: block;
	font-family: 'M PLUS 1p', sans-serif;
	font-weight: 700;
	font-size: 22px;
	line-height: 24px;
}
.pbox h4 em{
	display: block;
	font-family: 'M PLUS 1p', sans-serif;
	font-weight: 900;
	font-size: 50px;
	line-height: 56px;
	color: var(--color_pink);
	text-indent: -22px;
}

.pbox span.num{
	display: inline-flex;
	flex-wrap: wrap;
	align-items: flex-end;
	align-content: flex-end;
	justify-content: center;
	width: 70px;
	height: 70px;
	font-size: 16px;
	font-weight: bold;
	line-height: 1;
	color: #fff;
	text-align: center;
	border-radius: 50%;
	padding-bottom: 20px;
	background: var(--color_pink);
	position: absolute;
	z-index: 2;
	top: 0;
	left: -20px;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
.pbox span.num:before{
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 20px 7.5px 0 7.5px;
	border-color: var(--color_pink) transparent transparent transparent;
	position: absolute;
	bottom: 0;
	right: 0;
	-webkit-transform: rotate(-45deg);
	   -moz-transform: rotate(-45deg);
	    -ms-transform: rotate(-45deg);
	     -o-transform: rotate(-45deg);
	        transform: rotate(-45deg);
}
.pbox span.num i{
	position: relative;
	top: -4px;
	font-size: 16px;
	font-style: normal;
}
.pbox span.num em{
	font-size: 28px;
	font-style: normal;
}

.pbox .img{
	font-size: 0;
	line-height: 0;
	margin: 0 0 15px 0;
}
.pbox .img img{
	width: 100%;
	height: auto;
}

.pbox p{
	font-size: 20px;
	line-height: 30px;
	text-align: center;
}


/** rest **/

#rest{
	margin: 0 0 40px 0;
	padding: 40px 40px 40px 40px;
	background: #e6f9ff;
}

#rest h3{	margin-bottom: 40px;}

.restbox{
	position: relative;
	margin: 0 0 40px 0;
}
.restbox:last-of-type{	margin-bottom: 0;}

.restbox h4{
	font-family: 'M PLUS 1p', sans-serif;
	font-weight: 900;
	min-height: 120px;
	font-size: 32px;
	line-height: 36px;
	text-align: left;
	color: var(--color_pink);
	margin: 0 0 10px 0;
	padding: 0 0 0 110px;
}

.restbox span{
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	align-content: center;
	justify-content: center;
	width: 120px;
	height: 120px;
	font-weight: bold;
	color: #fff;
	text-align: center;
	padding-top: 5px;
	background: var(--color_brue);
	box-shadow: 0px 0px 0px 10px var(--color_brue) inset, 0px 0px 0px 11px #ffffff inset;
	position: absolute;
	top: 0;
	left: -20px;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
.restbox span i{
	width: 100%;
	font-size: 16px;
	font-style: normal;
	line-height: 1.2;
}
.restbox span em{
	font-size: 30px;
	font-style: normal;
	line-height: 1;
}

.restbox .img{
	font-size: 0;
	line-height: 0;
	margin: 0 0 15px 0;
}
.restbox .img img{
	width: 100%;
	height: auto;
}

.restbox p{
	font-size: 20px;
	line-height: 30px;
	text-align: left;
}


/** noexp **/

#noexp{
	text-align: center;
	padding: 0 10px 40px 10px;
}
#noexp h3{
	position: relative;
	z-index: 2;
	font-size: 0;
	line-height: 0;
	padding: 0 20px;
	bottom: -10px;
}
#noexp h3 img,
#noexp p:nth-of-type(1) img{
	width: 100%;
	height: auto;
}
#noexp p:nth-of-type(1){
	font-size: 0;
	line-height: 0;
	padding: 0 20px;
}
#noexp p:nth-of-type(2){
	font-family: 'M PLUS 1p', sans-serif;
	font-weight: 900;
	color: var(--color_pink);
	font-size: 36px;
	line-height: 40px;
	margin: 20px 0;
}
#noexp p:nth-of-type(3){
	font-size: 22px;
	font-weight: bold;
	line-height: 40px;
}


/** envi **/

#envi{
	padding: 40px 40px 40px 40px;
	background: #fffce9;
}

#envi h3{	margin-bottom: 40px;}

.enbox{
	position: relative;
	margin: 0 0 40px 0;
}
.enbox:last-of-type{	margin-bottom: 0;}

.enbox h4{
	font-family: 'M PLUS 1p', sans-serif;
	font-weight: 900;
	font-size: 45px;
	line-height: 50px;
	text-align: left;
	color: var(--color_pink);
	margin: 0 0 15px 0;
	padding: 0 0 0 70px;
}

.enbox span{
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	align-content: center;
	justify-content: center;
	width: 90px;
	height: 90px;
	font-weight: bold;
	color: #fff;
	text-align: center;
	border-radius: 50%;
	padding-top: 5px;
	background: url(img/check.png) no-repeat;
	background-size: 90px auto;
	position: absolute;
	top: -15px;
	left: -30px;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
	-webkit-transform: rotate(-15deg);
	   -moz-transform: rotate(-15deg);
	    -ms-transform: rotate(-15deg);
	     -o-transform: rotate(-15deg);
	        transform: rotate(-15deg);
}
.enbox span i{
	width: 100%;
	font-size: 16px;
	font-style: normal;
	line-height: 1;
}
.enbox span em{
	font-size: 36px;
	font-style: normal;
	line-height: 1;
}

.enbox .img{
	font-size: 0;
	line-height: 0;
	margin: 0 0 15px 0;
}
.enbox .img img{
	width: 100%;
	height: auto;
}

.enbox p{
	font-size: 20px;
	line-height: 30px;
	text-align: left;
}


/** system **/

#system{
	font-size: 0;
	line-height: 0;
	text-align: center;
}
#system img{
	max-width: 100%;
	height: auto;
}


/** salary **/

#salary{
	padding: 40px 20px;
	background: url(img/salary_bg.gif) top center;
}
#salary h3{
	font-family: 'M PLUS 1p', sans-serif;
	font-weight: 900;
	font-size: 68px;
	line-height: 70px;
	color: var(--color_pink);
	margin: 0 0 40px 0;
}
#salary p{
	font-size: 0;
	line-height: 0;
	margin: 0 0 20px 0;
}
#salary p:last-of-type{	margin-bottom: 0;}
#salary p img{
	width: 100%;
	height: auto;
}


/** qa **/

#qa{
	background: #edf9f7;
	padding: 40px 20px;
}
#qa h3{	margin-bottom: 20px;}

.qabox{
	text-align: left;
	margin: 0 0 20px 0;
	padding: 0 0 20px 0;
	border-bottom: 1px dotted #ccc;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
.qabox:last-of-type{	margin-bottom: 0;}

.qabox h4{
	font-size: 25px;
	font-weight: bold;
	line-height: 30px;
	margin: 0 0 10px 0;
	padding: 10px 0 10px 55px;
	background: url(./img/q.png) no-repeat 0 0;
	background-size: 45px auto;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

.qabox p{
	font-size: 20px;
	line-height: 30px;
}


/** recinfo **/

#recinfo{
	padding: 40px 20px;
}
#recinfo h3{	margin-bottom: 20px;}

#recinfo dl{
	display: table;
	width: 100%;
	font-size: 0;
	line-height: 0;
	border-bottom: 1px dotted #ccc;
}

#recinfo dt,
#recinfo dd{
	display: table-cell;
	vertical-align: top;
	font-size: 16px;
	line-height: 25px;
	text-align: left;
	padding: 20px 0;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

#recinfo dt{
	position: relative;
	width: 150px;
	padding-left: 18px;
	color: #977342;
}
#recinfo dt span{
	font-size: 16px;
	line-height: 1;
	position: absolute;
	top: 22px;
	left: 0;
}
#recinfo dd{}
#recinfo dd li{
	position: relative;
	padding-left: 15px;
}
#recinfo dd li:after{
	content: "";
	width: 4px;
	height: 4px;
	border-right: 1px solid #999;
	border-bottom: 1px solid #999;
	position: absolute;
	top: 9px;
	left: 2px;
	-webkit-transform: rotate(-45deg);
	   -moz-transform: rotate(-45deg);
	    -ms-transform: rotate(-45deg);
	     -o-transform: rotate(-45deg);
	        transform: rotate(-45deg);
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}


/** contact **/

.contact{
	width: calc(100% - 40px);
	border: 3px double #d3bc76;
	border-radius: 10px;
	margin: 0 20px 40px 20px;
	padding: 20px 0 20px 0;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

.contact h3{
	font-family: 'M PLUS 1p', sans-serif;
	font-weight: 900;
	font-size: 36px;
	line-height: 1;
	color: #d3bc76;
	margin: 0 0 10px 0;
}
.contact h3 em{
	position: relative;
}
.contact h3 em:before,
.contact h3 em:after{
	content: '';
	width: 3px;
	height: 36px;
	background: #d3bc76;
	border-radius: 2px;
	position: absolute;
	bottom: 8px;
}
.contact h3 em:before{
	left: -20px;
	-webkit-transform: rotate(-45deg);
	   -moz-transform: rotate(-45deg);
	    -ms-transform: rotate(-45deg);
	     -o-transform: rotate(-45deg);
	        transform: rotate(-45deg);
}
.contact h3 em:after{
	right: -20px;
	-webkit-transform: rotate(45deg);
	   -moz-transform: rotate(45deg);
	    -ms-transform: rotate(45deg);
	     -o-transform: rotate(45deg);
	        transform: rotate(45deg);
}

.contact > p{
	font-size: 16px;
	line-height: 22px;
	margin: 0 0 20px 0;
}

.contact_fbt{
	display: flex;
	justify-content: center;
	padding: 0 15px;
}
.contact_fbt a{
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	align-content: center;
	justify-content: center;
	font-size: 16px;
	font-weight: bold;
	line-height: 18px;
	text-align: center;
	color: #fff;
	width: calc(100% / 3 - 10px);
	height: 65px;
	border-radius: 5px;
	margin: 0 5px;
	-webkit-transition	: 0.2s ease-in-out;
	-moz-transition	: 0.2s ease-in-out;
	-o-transition	: 0.2s ease-in-out;
	transition		: 0.2s ease-in-out;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
.contact_fbt a:hover{
	text-decoration: none;
	opacity: 0.7;
	filter: alpha(opacity=70);
}
.contact_fbt .contact_fbt_tel{	background: #ff65a3;}
.contact_fbt .contact_fbt_mail{	background: #46aaff;}
.contact_fbt .contact_fbt_tel > span,
.contact_fbt .contact_fbt_mail span{
	position: relative;
	font-size: 34px;
	line-height: 1;
	margin-right: 3px;
}
.contact_fbt .contact_fbt_line{	background: #00b900;}
.contact_fbt .contact_fbt_line span{
	display: inline-block;
	vertical-align: top;
	position: relative;
	top: -2px;
	width: 34px;
	height: 34px;
	background: url(./img/line.png) no-repeat;
	background-size: 34px auto;
	margin-right: 3px;
}


/** rec_fbt **/

#page-top{	bottom: 10px;}

.rec_fbt{
	display: flex;
	justify-content: center;
	padding: 0 2.5px;
}
.rec_fbt a{
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	align-content: center;
	justify-content: center;
	font-size: 16px;
	font-weight: bold;
	line-height: 21px;
	text-align: center;
	color: #fff;
	width: calc(100% / 3 - 5px);
	max-width: 140px;
	height: 65px;
	border-radius: 5px;
	margin: 0 2.5px;
	-webkit-transition	: 0.2s ease-in-out;
	-moz-transition	: 0.2s ease-in-out;
	-o-transition	: 0.2s ease-in-out;
	transition		: 0.2s ease-in-out;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
.rec_fbt a:hover{
	text-decoration: none;
	opacity: 0.7;
	filter: alpha(opacity=70);
}
.rec_fbt a p{
	width: 100%;
}
.rec_fbt .rec_fbt_tel{	background: #ff65a3;}
.rec_fbt .rec_fbt_mail{	background: #46aaff;}
.rec_fbt .rec_fbt_tel span,
.rec_fbt .rec_fbt_mail span{
	position: relative;
	bottom: -4px;
	font-size: 20px;
	line-height: 1;
	margin-right: 3px;
}
.rec_fbt .rec_fbt_line{	background: #00b900;}
.rec_fbt .rec_fbt_line span{
	display: inline-block;
	vertical-align: top;
	position: relative;
	top: -2px;
	width: 21px;
	height: 21px;
	background: url(./img/line.png) no-repeat;
	background-size: 21px auto;
	margin-right: 3px;
}
.rec_fbt a p + p{ font-size:14px;}

.pc_none{	display: none;}


/*=================================================
 * CSS for SP
 * ================================================= */

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

	.pc_none{	display: inline;}
	.sp_none{	display: none;}

	.imgup{
		margin: 0 0 20px 0;
		padding: 0 20px;
	}

	/** title **/
	.rec_title{
	}
	.rec_title span{
		font-size: 7.7vw;
		line-height: 1;
		margin-right: 5px;
	}
	.rec_title span i{
		font-size: 10px;
	}
	.rec_title em{
		font-size: 7.7vw;
		background-size: 12px auto;
	}
	.rec_s_title em{
		font-size: 35px;
		line-height: 1.2;
	}
	.rec_s_title span{
		font-size: 10px;
		line-height: 1;
	}

	/** point **/

	#point{
		padding: 30px 20px;
	}
	#point h3{	margin-bottom: 30px;}
	.pbox{
		position: relative;
		margin: 0 0 20px 0;
	}
	.pbox:last-of-type{	margin-bottom: 0;}

	.pbox h4{
		min-height: 60px;
		margin: 0 0 5px 0;
		padding: 0 0 0 60px;
	}
	.pbox h4 span{
		font-size: 4vw;
		line-height: 1.2;
	}
	.pbox h4 em{
		font-size: 6vw;
		line-height: 1.2;
		text-indent: -11px;
	}

	.pbox span.num{
		width: 60px;
		height: 60px;
		border-radius: 50%;
		padding-bottom: 20px;
		position: absolute;
		z-index: 2;
		top: -2px;
		left: -5px;
	}
	.pbox span.num i{
		position: relative;
		top: -3px;
		font-size: 12px;
		font-style: normal;
	}
	.pbox span.num em{
		font-size: 20px;
		font-style: normal;
	}
	.pbox .img{
		margin: 0 0 10px 0;
	}
	.pbox p{
		font-size: 13px;
		line-height: 24px;
		text-align: left;
	}


	/** rest **/
	#rest{
		margin: 0 0 30px 0;
		padding: 30px 20px;
	}
	#rest h3{	margin-bottom: 30px;}
	.restbox{
		position: relative;
		margin: 0 0 20px 0;
	}
	.restbox:last-of-type{	margin-bottom: 0;}
	.restbox h4{
		min-height: 80px;
		font-size: 5.2vw;
		line-height: 1.2;
		margin: 0 0 10px 0;
		padding: 0 0 0 80px;
	}
	.restbox span{
		width: 80px;
		height: 80px;
		padding-top: 5px;
		background: var(--color_brue);
		box-shadow: 0px 0px 0px 3px var(--color_brue) inset, 0px 0px 0px 4px #ffffff inset;
		position: absolute;
		top: 0;
		left: -5px;
		-webkit-box-sizing: border-box;
		   -moz-box-sizing: border-box;
		        box-sizing: border-box;
	}
	.restbox span i{
		width: 100%;
		font-size: 13px;
		font-style: normal;
		line-height: 1.2;
	}
	.restbox span em{
		font-size: 24px;
		font-style: normal;
		line-height: 1;
	}
	.restbox .img{
		margin: 0 0 10px 0;
	}
	.restbox p{
		font-size: 13px;
		line-height: 24px;
		text-align: left;
	}


	/** noexp **/
	#noexp{
		text-align: center;
		padding: 0 20px 30px 20px;
	}
	#noexp h3{
		padding: 0;
		bottom: -10px;
	}
	#noexp p:nth-of-type(1){
		padding: 0;
	}
	#noexp p:nth-of-type(2){
		font-size: 4.3vw;
		line-height: 1.2;
		margin: 20px 0 15px 0;
	}
	#noexp p:nth-of-type(3){
		font-size: 12px;
		line-height: 24px;
		text-align: left;
	}

	/** envi **/
	#envi{
		padding: 30px 20px;
	}
	#envi h3{	margin-bottom: 30px;}
	.enbox{
		position: relative;
		margin: 0 0 20px 0;
	}
	.enbox:last-of-type{	margin-bottom: 0;}
	.enbox h4{
		font-size: 6.5vw;
		line-height: 1.2;
		margin: 0 0 10px 0;
		padding: 0 0 0 65px;
	}
	.enbox span{
		width: 70px;
		height: 70px;
		padding-top: 5px;
		background: url(img/check.png) no-repeat;
		background-size: 70px auto;
		position: absolute;
		top: -10px;
		left: -10px;
	}
	.enbox span i{
		width: 100%;
		font-size: 13px;
		font-style: normal;
		line-height: 1;
	}
	.enbox span em{
		font-size: 30px;
		font-style: normal;
		line-height: 1;
	}

	.enbox .img{
		margin: 0 0 10px 0;
	}
	.enbox p{
		font-size: 13px;
		line-height: 24px;
		text-align: left;
	}

	/** salary **/
	#salary{
		padding: 30px 20px;
	}
	#salary h3{
		font-size: 40px;
		line-height: 50px;
		margin: 0 0 30px 0;
	}
	#salary p{
		margin: 0 0 20px 0;
	}

	/** mv **/
	.mv{
		padding: 30px 20px;
	}
	.mv .rec_s_title em{
		font-size: 28px;
	}

	/** qa **/
	#qa{
		padding: 30px 20px;
	}
	#qa h3{	margin-bottom: 20px;}
	.qabox{
		text-align: left;
		margin: 0 0 15px 0;
		padding: 0 0 15px 0;
	}
	.qabox:last-of-type{	margin-bottom: 0;}
	.qabox h4{
		font-size: 20px;
		font-weight: bold;
		line-height: 24px;
		margin: 0 0 5px 0;
		padding: 5px 0 5px 40px;
		background: url(./img/q.png) no-repeat 0 0;
		background-size: 30px auto;
		-webkit-box-sizing: border-box;
		   -moz-box-sizing: border-box;
		        box-sizing: border-box;
	}
	.qabox p{
		font-size: 13px;
		line-height: 24px;
	}

	/** recinfo **/
	#recinfo{
		padding: 30px 20px;
	}
	#recinfo h3{	margin-bottom: 20px;}
	#recinfo dt,
	#recinfo dd{
		font-size: 14px;
		line-height: 22px;
		padding: 15px 0;
	}
	#recinfo dt{
		position: relative;
		width: 100px;
		padding-left: 18px;
	}
	#recinfo dt span{
		font-size: 15px;
		line-height: 1;
		position: absolute;
		top: 17px;
		left: 0;
	}
	#recinfo dd{}

	/** contact **/
	.contact{
		width: calc(100% - 40px);
		margin: 0 20px 30px 20px;
		padding: 15px 0 10px 0;
	}
	.contact h3{
		font-size: 30px;
		line-height: 1;
		color: #d3bc76;
		margin: 0 0 10px 0;
	}
	.contact h3 em:before,
	.contact h3 em:after{
		bottom: 4px;
	}
	.contact > p{
		font-size: 14px;
		margin: 0 0 10px 0;
	}
	.contact_fbt{ padding: 0 5px;}
	.contact_fbt a{
		font-size: 2.7vw;
		line-height: 1.1;
	}
	.contact_fbt .contact_fbt_tel > span,
	.contact_fbt .contact_fbt_mail span{
		position: relative;
		width: 100%;
		font-size: 20px;
		line-height: 1;
		margin-right: 3px;
	}
	.contact_fbt .contact_fbt_line{	background: #00b900;}
	.contact_fbt .contact_fbt_line span{
		vertical-align: top;
		position: relative;
		width: 100% !important;
		top: -2px;
		width: 20px;
		height: 20px;
		background: url(./img/line.png) no-repeat center center;
		background-size: 20px auto;
		margin-right: 3px;
	}
	.contact_fbt a span:nth-of-type(3){ font-size: min(2.0vw, 14px); line-height: 1.0;}
	
	
	.rec_fbt a{
		font-size: 3.5vw;
		line-height: 1.5;
	}
	.rec_fbt a p + p{ font-size: min(3.0vw, 14px);}
	
	
	#page-top .pageup{
		bottom: 75px;
	}
	
}