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

/*
----------------------RIP--------------------------
共　送E
---------------------------------------------------
*/
section.recruit{
	font-family:"游ゴシチE��", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;	
}

section.recruit p{
	font-size:14px;
	font-weight: normal;
	line-height: 1.3;
	color:#000;
}
section.recruit p span{
	color:#FF0000;
}

/*------------------バナー部刁E-----------------*/

section.recruit .banner{
	background: url(./img/h2_title.png) no-repeat 0 0;
	background-size: cover;
	max-width: 1120px;
	margin: 0 auto;
	position: relative;
	z-index: 3;
}

section.recruit .banner::before {
  content: '';
  display: block;
  padding-top: 38%;
}

#contents section.recruit .banner h2{
	font-size: 35px;
	font-weight: bold;
	position: absolute;
	left: 50px;
	top: 210px;
	text-shadow: 3px 3px 1px rgba(0,0,0,.5);
	background: none;
}
section.recruit .banner p{
	font-size: 16px;
	font-weight: bold;
	line-height: 1.5;
	position: absolute;
	left: 43px;
	top: 280px;
	text-shadow: 2px 2px 1px rgba(0,0,0,.6);
}
section.recruit .banner h2,
section.recruit .banner p{
	color:#FFF;
}

@media screen and (max-width: 1280px) {
	#contents section.recruit .banner h2{top: 170px;}
	section.recruit .banner p{top: 230px;}
}


/*------------------コンチE��チE��刁E-----------------*/

section.recruit .content_area{
	margin-top: -40px;
}

/*---------メリチE��部刁E-------*/

section.recruit .content_area #merit_area{
	background: url(./img/bg_merit.gif) 0 0;
	background-size: 11%;
	padding: 50px 0 10px;
	position: relative;
}

section.recruit .content_area #merit_area::before{
	content:"";
	width:105px;
	height: 112px;
	background: url(./img/fig_treon.png) 0 0 no-repeat;
	background-size: 100%;
	position: absolute;
	top: 40px;
	left: 130px;
}
section.recruit .content_area #merit_area::after{
	content:"";
	width:105px;
	height: 112px;
	background: url(./img/fig_treon.png) 0 0 no-repeat;
	background-size: 100%;
	position: absolute;
	top: 40px;
	right:130px;
}

section.recruit .content_area #merit_area h3{
	background: url(./img/h3_merit.png) no-repeat 394px center;
	text-indent: -9999px;
	text-align: center;
	height: 190px;
	width: 960px;
	margin: 0 auto 20px;
	position: relative;
	z-index: 3;
}

section.recruit .content_area #merit_area .section{
	background: #FFF;
	padding: 80px 40px 30px;
	margin: -80px 40px 40px;
	border-radius: 10px;
}

section.recruit .content_area #merit_area .section .number.odd,
section.recruit .content_area #merit_area .section .number.even{
	border: 2px solid #EB5E00;
	border-radius: 10px;
	box-shadow: 3px 3px 0px #EB5E00;
	margin-bottom: 75px;
	position: relative;
	padding: 15px 90px 15px 10px;
	width: 80%;
	box-sizing: border-box;
}


section.recruit .content_area #merit_area .section .number.even{
	margin-left: 160px;
	padding: 15px 10px 15px 80px;
}


section.recruit .content_area #merit_area .section .summary h4{
	font-size:24px;
	font-weight: bold;
	color:#EB5E00;
	margin-bottom: 15px;
	border-bottom: 1px dashed #EB5E00;
	border-width: 0 0 1px 0;
	padding: 8px 0 15px 13%;
}
section.recruit .content_area #merit_area .section .even .summary h4{
	padding: 8px 13% 15px 0;
}

section.recruit .content_area #merit_area .section .summary p{
	font-size:16px;
}

section.recruit .content_area #merit_area .section .odd .number{	position: absolute;	top:-10px; left:-10px;}
section.recruit .content_area #merit_area .section .even .number{	position: absolute;	top:-10px; right:-10px;}

section.recruit .content_area #merit_area .section .odd .n-image{	position: absolute;	top:-20%; right:-180px;}
section.recruit .content_area #merit_area .section .even .n-image{	position: absolute;	top:-20%; left:-175px;}

section.recruit .content_area #merit_area .section #n03 .n-image{	position: absolute;	top:-9%; right:-180px;}

/*------求人惁E��------*/

section.recruit .content_area #recruit_area{
	padding: 10px 0;
	position: relative;
}

section.recruit .content_area #recruit_area .link_btn a{
	padding: 18px;
	font-size: 18px;
	font-weight: bold;
}


/*
----------------------RIP--------------------------
スマ�E
---------------------------------------------------
*/

/*-----スマ�E適用　初期匁E----*/

.sp section.recruit .content_area img{
	width:100%;
}

.sp section.recruit section.recruitp,
.sp section.recruit .content_area h3,
.sp section.recruit .content_area .section .step .summary dd h4,
.sp section.recruit .content_area .section .step .comment h5,
.sp section.recruit .content_area .section .nct_annai h6,
.sp section.recruit .content_area .section .step .summary dd p,
.sp section.recruit .content_area .section .btn a,
.sp section.recruit .content_area .section .nct_text li{
	font-size:90%;
	line-height: 130%;
}

.sp section.recruit .concept_text,
.sp section.recruit .concept_text p,
.sp section.recruit .content_area .section .step .summary,
.sp section.recruit .content_area .section .step .comment div,
.sp section.recruit .content_area .section .qr_box,
.sp section.recruit .content_area .section .qr_ex,
.sp section.recruit .content_area .section .nct_annai{
	width: 100%;
	padding: 0;
	margin: 0;
}

.sp section.recruit .content_area,
.sp section.recruit .content_area .section{
	padding: 0;
	margin: 0;	
}

.sp section.recruit .content_area .section .step .image,
.sp section.recruit .content_area .section .step .summary,
.sp section.recruit .content_area .section .step .comment div{
	float:inherit;
}


.sp section.recruit .content_area .section .btn{
	margin: 30px auto;
	text-align: center;
}
.sp section.recruit .content_area .section .btn a{
	color:#FFF;
	background: #EB5E00;
	padding: 10px 30px 10px 20px;
	border-radius: 25px;
	font-size: 110%;
	font-weight: bold;
	position: relative;
}
.sp section.recruit .content_area .section .btn a::before{
	content:"";
	width:0;
	height: 0;
	border: 6px solid transparent;
	border-left: 6px solid #FFF;
	position: absolute;
	top: 33%;
	right: 4%;
}


/*-----バナー-----*/

.sp section.recruit .banner{
	background: url(./img/h2_title_sp.png) no-repeat 0 0;
	background-size: 100%;
	width: 100%;
	margin: 0 auto;
	position: relative;
	z-index: 3;
}

.sp section.recruit .banner::before {
  content: '';
  display: block;
  padding-top: 50%;
}

.sp #contents section.recruit .banner h2{
	font-size: 110%;
	font-weight: bold;
	position: absolute;
	left: 0%;
	top: 35%;
	text-shadow: 1px 1px 1px rgba(0,0,0,.6);
	border-bottom: 0;
	border-top: 0;
	box-sizing: border-box;
	width: auto;
	padding: 0;
}
.sp #contents section.recruit .banner p{
	font-size: 80%;
	font-weight: bold;
	position: absolute;
	left: 0%;
	top: 58%;
	text-shadow: 1px 1px 1px rgba(0,0,0,.6);
	box-sizing: border-box;
	width: auto;
	margin: 0;
}
.sp section.recruit .banner h2,
.sp section.recruit .banner p{
	color:#FFF;
}


/*------------------コンチE��チE��刁E-----------------*/

.sp section.recruit .content_area{
	margin-top: -30px;
}



/*---------メリチE��部刁E-------*/

.sp section.recruit .content_area #merit_area{
	background: url(./img/bg_merit.gif) 0 0;
	background-size: 11%;
	padding: 30px 0 10px;
	position: relative;
}

.sp section.recruit .content_area #merit_area::before{
	content:"";
	width:70px;
	height: 75px;
	background: url(./img/fig_treon.png) 0 0 no-repeat;
	background-size: 100%;
	position: absolute;
	top: 40px;
	left: 35px;
}
.sp section.recruit .content_area #merit_area::after{
	content:"";
	width:70px;
	height: 75px;
	background: url(./img/fig_treon.png) 0 0 no-repeat;
	background-size: 100%;
	position: absolute;
	top: 40px;
	right:35px;
}


.sp section.recruit .content_area #merit_area h3{
	background: url(./img/h3_merit.png) no-repeat center;
	background-size: 30%;
	text-indent: -9999px;
	text-align: center;
	height: 135px;
	width: 100%;
	margin: 0 auto 20px;
	padding: 0;
	position: relative;
	z-index: 3;
}

.sp section.recruit .content_area #merit_area .section{
	background: #FFF;
	padding: 80px 5% 5px;
	margin: -80px 5% 10px;
	border-radius: 10px;
}

.sp section.recruit .content_area #merit_area .section .number.odd,
.sp section.recruit .content_area #merit_area .section .number.even,
.sp section.recruit .content_area #merit_area .section #n03{
	border: 2px solid #EB5E00;
	border-radius: 10px;
	box-shadow: 3px 3px 0px #EB5E00;
	margin: 0 auto 35px;
	position: relative;
	padding: 15px;
	width: 100%;
	box-sizing: border-box;
	height: auto;
}

.sp section.recruit .content_area #merit_area .section .number img{
	width:65%;
}

.sp section.recruit .content_area #merit_area .section .summary h4{
	font-size:110%;
	font-weight: bold;
	color:#EB5E00;
	padding: 0 0 5px 5px;
	margin-bottom: 10px;
	border-bottom: 1px dashed #EB5E00;
}

.sp section.recruit .content_area #merit_area .section .summary p{
	font-size:90%;
	margin: 0;
}

.sp section.recruit .content_area #merit_area .section .summary p.n-image,
.sp section.recruit .content_area #merit_area .section #n03 .n-image{
	position: inherit;
	width: 70%;
	text-align: center;
	margin: 0 auto 15px;
}

.sp section.recruit .content_area #merit_area .section .summary .text{
	width: 100%;
	margin: 0 auto 10px;
}

.sp section.recruit .content_area #merit_area .section .number .n-image img{ width:100%;}
.sp section.recruit .content_area #merit_area .section .number .number{position: absolute;	top: -15px; left: -15px;}
.sp section.recruit .content_area #merit_area .section .even .number{right: inherit;}

/*------求人惁E��------*/

.sp section.recruit .content_area #recruit_area{
	padding: 0;
	position: relative;
}



/*iPhone6/7*/

@media screen and (max-width: 375px) {
	/*section.recruit banner{
		height: 190px;
	}
	section.recruit banner h2{
		position: absolute;
		left: 1%;
		top: 40%;
	}
	section.recruit banner p{
		position: absolute;
		left: 4%;
		top: 58%;
		font-size: 80%;
	}*/
}

/*iPhone4/5/SE*/

@media screen and (max-width: 320px) {
	/*section.recruit banner{
		height: 175px;
	}*/
	.sp #contents section.recruit .banner h2{
		position: absolute;
		left: 5px;
		top: 40%;
		font-size: 100%;
		padding: 0;
	}
	.sp #contents section.recruit .banner p{
		position: absolute;
		left: 7px;
		top: 56%;
		font-size: 70%;
	}
}