.recruitList { padding: 150px 0 120px; position: relative; }
.recruitList:before { content: ""; display: block; width: 100%; height: 120px; background-color: #FCE883; background-image: radial-gradient(#FFF6 2px, transparent 0), radial-gradient(#FFF6 2px, transparent 0); background-size: 20px 20px; background-position: 0 0, 10px 10px; position: absolute; bottom: 0; }
.recruitList:after { content: ""; display: block; width: calc(100% + 240px); height: 120px; background: #FFF; position: absolute; bottom: 0; border-radius: 0 0 1000px 1000px / 0 0 100px 100px; margin: 0 -100px; }

.recruitList h2 { font-size: 60px; font-weight: 900; line-height: 60px; text-align: center; margin: 0; }
.recruitList h2+p { display: block; color: #0067B7; font-size: 30px; font-weight: 600; line-height: 50px; text-align: center; margin: 10px 0 0; }

.recruitList ul { width: 1000px; margin: 0 auto; }
.recruitList li { margin: 60px 0 0; }
.recruitList li a { display: block; }
.recruitList li a h4 { background: #0067B7; color: #FFF; font-size: 32px; line-height: 60px; text-align: center; border-radius: 20px; }
.recruitList li a section { display: flex; justify-content: space-between; text-align: center; padding: 40px 0 0; }
.recruitList li a section table { width: 600px; border-top: solid 2px #D6D6D6; border-collapse: collapse; font-size: 16px; line-height: 25px; color: #000; }
.recruitList li a section th { padding: 20px; border-bottom: solid 2px #D6D6D6; text-align: left; }
.recruitList li a section td { padding: 20px; border-bottom: solid 2px #D6D6D6; text-align: left; }
.recruitList li a section h5 { background: #F43545; color: #FFF; font-size: 20px; line-height: 60px; display: inline-block; width: 300px; box-sizing: border-box; border-radius: 30px; margin: 20px 0 0; }



.recruitDetail { padding: 150px 0 0; position: relative; }
.recruitDetail .inner { width: 1000px; }
.recruitDetail h3 { background: #0067B7; color: #FFF; font-size: 32px; line-height: 60px; text-align: center; border-radius: 20px; }
.recruitDetail section { display: flex; padding: 40px 0 0; }
.recruitDetail section p { font-size: 16px; line-height: 25px; margin-left: 30px; }

.recruitDetail table { width: 100%; margin: 60px auto 0; font-size: 16px; line-height: 25px; border-collapse: collapse; }
.recruitDetail th { padding: 20px; border: solid 2px #D6D6D6; text-align: left; background: #FEFAE6; white-space: nowrap; }
.recruitDetail th b{ background: #EE771C; color: #FFF; border-radius: 4px; font-size: 12px; line-height: 25px; padding: 0 8px; display: inline-block; float: right; }
.recruitDetail td { background: #FFF; padding: 20px; border: solid 2px #D6D6D6; }
.recruitDetail p.entry { margin: 40px 0 0; display: flex; justify-content: space-around; }
.recruitDetail p.entry a { width: 400px; line-height: 80px; font-size: 20px; font-weight: 600; background: #F43545; color: #FFF; text-align: center; display: inline-block; border-radius: 40px; }
.recruitDetail p.entry a.inquiry { background: #0067B7; }




.recruitForm { padding: 150px 0 0; position: relative; }
.recruitForm .inner { width: 1000px; }
.recruitForm h3 { background: #0067B7; color: #FFF; font-size: 32px; line-height: 60px; text-align: center; border-radius: 20px; }
.recruitForm p { font-size: 20px; line-height: 30px; padding: 40px 0 0; text-align: center; }

.recruitForm table { width: 100%; margin: 60px auto 0; font-size: 16px; line-height: 25px; border-collapse: collapse; }
.recruitForm th { padding: 20px; border: solid 2px #D6D6D6; text-align: left; background: #FEFAE6; white-space: nowrap; }
.recruitForm th b{ background: #F43545; color: #FFF; border-radius: 4px; font-size: 12px; line-height: 25px; margin-left: 20px; padding: 0 10px; display: inline-block; float: right; }
.recruitForm td { background: #FFF; padding: 20px; border: solid 2px #D6D6D6; text-align: left; }
.recruitForm td ul { display: flex; flex-wrap: wrap; }
.recruitForm td ul li { margin-right: 20px; }
.recruitForm td p { margin: 0; text-align: left; font-weight: bold; }
.recruitForm td ul+p { margin-top: 20px; }
.recruitForm td input[type=text]{ width: 100%; padding: 4px; border: solid 2px #E6E6E6; font-size: 16px; box-sizing: border-box; }
.recruitForm td textarea { width: 100%; padding: 4px; border: solid 2px #E6E6E6; font-size: 16px; box-sizing: border-box; }

.recruitForm input[type=submit] { width: 400px; line-height: 80px; font-size: 20px; font-weight: 600; background: #F43545; color: #FFF; text-align: center; border-radius: 40px; transition: .3s; }
.recruitForm input[type=submit]:hover { opacity: 0.6; }
.recruitForm input[type=submit]:disabled { background: #EDEDED; }
.recruitForm input[type=submit]:disabled:hover { opacity: 1; }

.recruitForm table td span.is-error { display: block; font-size: 16px; line-height: 20px; color: #F43545; margin-bottom: 10px; }


.jobFlow { padding: 120px 0; background-color: #FCE883; background-image: radial-gradient(#FFF6 2px, transparent 0), radial-gradient(#FFF6 2px, transparent 0); background-size: 20px 20px; background-position: 0 0, 10px 10px; position: relative; border-radius: 0 0 1000px 1000px / 0 0 100px 100px; margin: 0 -100px; }
.jobFlow:before { content: ""; display: block; width: 100%; height: 120px; background-color: #FEF3C1; background-image: radial-gradient(#FFF6 2px, transparent 0), radial-gradient(#FFF6 2px, transparent 0); background-size: 20px 20px; background-position: 0 0, 10px 10px; position: absolute; bottom: 0; }
.jobFlow:after { content: ""; display: block; width: calc(100% + 240px); height: 120px; background-color: #FCE883; background-image: radial-gradient(#FFF6 2px, transparent 0), radial-gradient(#FFF6 2px, transparent 0); background-size: 20px 20px; background-position: 0 0, 10px 10px; position: absolute; bottom: 0; border-radius: 0 0 1000px 1000px / 0 0 100px 100px; margin: 0 -100px; }

.jobFlow h3 { font-size: 60px; font-weight: 900; line-height: 60px; text-align: center; margin: 0; }
.jobFlow h3 span { display: block; color: #0067B7; font-size: 30px; line-height: 30px; margin: 20px 0 0; }

.jobFlow ol { width: 1100px; display: flex; justify-content: center; margin: 60px auto 0; background: #FFF; border-radius: 20px; border: solid 1px #FFF; }
.jobFlow ol li { position: relative; font-size: 20px; text-align: left; line-height: 20px; width: 100%; color: #FFF; padding: 20px 0 20px 40px ; border: solid 1px #FFF; box-sizing: border-box; }
.jobFlow ol li:after { content: ""; position: absolute; right: -20px; top: 50%; margin: -18px 0 0; width: 0; height: 0; border-left: 18px solid; border-top: 18px solid transparent; border-bottom: 18px solid transparent; z-index: 1; }
.jobFlow ol li b { display: block; font-size: 24px; line-height: 30px;  margin: 10px 0 0; }
.jobFlow ol li:nth-child(1) { background: #0067B7BF; border-radius: 20px 0 0 20px; }
.jobFlow ol li:nth-child(1):after { border-left-color: #FFF; }
.jobFlow ol li:nth-child(2) { background: #0067B7CF; }
.jobFlow ol li:nth-child(2):after { border-left-color: #FFF; }
.jobFlow ol li:nth-child(3) { background: #0067B7DF; }
.jobFlow ol li:nth-child(3):after { border-left-color: #FFF; }
.jobFlow ol li:nth-child(4) { background: #0067B7EF; }
.jobFlow ol li:nth-child(4):after { border-left-color: #FFF; }
.jobFlow ol li:nth-child(5) { background: #0067B7FF; border-radius: 0 20px 20px 0; }
.jobFlow ol li:nth-child(5):before { content: none; }
.jobFlow ol li:nth-child(5):after { content: none; }


.jobFaq { padding: 120px 0; position: relative; background-color: #FEF3C1; background-image: radial-gradient(#FFF6 2px, transparent 0), radial-gradient(#FFF6 2px, transparent 0); background-size: 20px 20px; background-position: 0 0, 10px 10px; }
.jobFaq:before { content: ""; display: block; width: 100%; height: 120px; background: #FFF; position: absolute; bottom: 0; }
.jobFaq:after { content: ""; display: block; width: calc(100% + 240px); height: 120px; background-color: #FEF3C1; background-image: radial-gradient(#FFF6 2px, transparent 0), radial-gradient(#FFF6 2px, transparent 0); background-size: 20px 20px; background-position: 0 0, 10px 10px; position: absolute; bottom: 0; border-radius: 0 0 1000px 1000px / 0 0 100px 100px; margin: 0 -100px; }

.jobFaq h3 { font-size: 60px; font-weight: 900; line-height: 60px; text-align: center; margin: 0; }
.jobFaq h3 span { display: block; color: #0067B7; font-size: 30px; line-height: 30px; margin: 20px 0 0; }

.jobFaq dl { width: 1100px; margin: 60px auto 0; background: #FFF; font-size: 20px; line-height: 30px; border-radius: 20px; padding-bottom: 40px; }
.jobFaq dt { font-weight: 700; position: relative; padding: 40px 40px 0; text-indent: -1em; margin-left: 1em; }
.jobFaq dd { position: relative; padding: 10px 40px 0; text-indent: -1em; margin-left: 1em; }

.footerBtn { display: none; }

@media only screen and (max-width: 1260px) {
	.recruitList { padding: 120px 0 0; }
	.recruitList .inner { width: 100%; padding: 0 15px 120px; }
	.recruitList ul { width: 100%; }
	.recruitList li a section figure { width: 320px; }
	.recruitList li a section div { width: calc(100% - 360px); }
	.recruitList li a section table { width: 100%; }
	
	.recruitDetail { padding: 120px 0 0; }
	.recruitDetail .inner { width: 100%; padding: 0 15px; }
	.recruitDetail section figure { width: 320px; }
	.recruitDetail section p { width: calc(100% - 360px); }
	.recruitDetail p.entry a { width: 360px; }
	
	.recruitForm { padding: 120px 0 0; }
	.recruitForm .inner { width: 100%; padding: 0 15px; }


	.jobFlow .inner { width: calc(100% - 200px); padding: 0 15px; }
	.jobFlow ol { width: 100%; }
	
	.jobFaq .inner { width: 100%; padding: 0 15px; }
	.jobFaq dl { width: 100%; }

}


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

	.recruitList { padding: 120px 0 60px; }
	.recruitList .inner { padding: 0 15px; }
	.recruitList:before { height: 60px;}
	.recruitList:after { height: 60px;}
	
	.recruitList h2 { font-size: 32px; line-height: 40px; }
	.recruitList h2+p { font-size: 16px; line-height: 25px; margin: 10px 0 0; }
	
	.recruitList ul { width: 100%; margin: 0; }
	.recruitList li { margin: 60px 0 0; }
	.recruitList li a { display: block; }
	.recruitList li a h4 { font-size: 20px; line-height: 30px; padding: 5px 10px; }
	.recruitList li a section { margin: 0; display: block; padding: 15px 0; }
	.recruitList li a section figure { width: 100%; }
	.recruitList li a section figure img { width: 100%; }
	.recruitList li a section div { width: 100%; margin: 15px 0; }
	.recruitList li a section table { width: 100%; }
	.recruitList li a section th { padding: 10px; }
	.recruitList li a section td { padding: 10px; }
	.recruitList li a section h5 { font-size: 16px; }


	.recruitDetail { padding: 120px 0 0; }
	.recruitDetail .inner { padding: 0 15px; }
	.recruitDetail:before { height: 60px;}
	.recruitDetail:after { height: 60px;}

	
	.recruitDetail h3 { font-size: 20px; line-height: 40px; }
	.recruitDetail section { display: block; }
	.recruitDetail section figure { width: 100%; }
	.recruitDetail section figure img { width: 100%; }
	.recruitDetail section p { width: 100%; margin: 15px 0 0; font-size: 16px; line-height: 25px; }

	.recruitDetail table { margin: 30px 0 0; font-size: 16px; }
	.recruitDetail th { padding: 10px; }
	.recruitDetail td { padding: 10px; }
	
	.recruitDetail p.entry { display: block; text-align: center; margin: 0; }
	.recruitDetail p.entry a { width: 300px; line-height: 60px; margin: 30px 0 0; }


	.recruitForm { padding: 120px 0 60px; }
	.recruitForm .inner { padding: 0 15px; }
	.recruitForm:before { height: 60px;}
	.recruitForm:after { height: 60px;}

	.recruitForm h3 { font-size: 20px; line-height: 40px; }
	.recruitForm p { text-align: left; padding: 15px 0;font-size: 16px; line-height: 25px; }
	.recruitForm table {margin: 0; font-size: 16px; }
	.recruitForm th { padding: 10px; }
	.recruitForm th b{ width: 40px; border-radius: 4px; font-size: 12px; line-height: 20px; margin-left: 0; padding: 0; display: block; float: none; text-align: center; }
	.recruitForm td { padding: 10px; }
	
	.recruitForm p.entry { display: block; text-align: center; margin: 0; }
	.recruitForm p.entry input[type=submit] { width: 300px; line-height: 60px; margin: 30px 0 0; }
	

	.jobFlow { padding: 60px 0; margin: 0; }
	.jobFlow .inner { width: 100%; padding: 0 15px; }
	.jobFlow:before { height: 60px;}
	.jobFlow:after { height: 60px;}
	
	.jobFlow h3 { font-size: 32px; line-height: 40px; }
	.jobFlow h3 span { font-size: 16px; line-height: 20px; margin: 10px 0 0; }

	.jobFlow ol { display: block; width: 100%; margin: 45px auto 0; }
	.jobFlow ol li { font-size: 16px; line-height: 15px; width: 100%; padding: 30px  10px 20px; text-align: center; }
	.jobFlow ol li:first-child { padding: 20px  10px 20px; }
	.jobFlow ol li:before { right: 50%; bottom: -40px; top: auto; margin: 0 -20px 0 0; width: 0; height: 0; border-left: 20px solid transparent; border-right: 20px solid transparent; border-top: 20px solid; }
	.jobFlow ol li:after { right: 50%; bottom: -36px; top: auto; margin: 0 -18px 0 0; width: 0; height: 0; border-left: 18px solid transparent; border-right: 18px solid transparent; border-top: 18px solid; z-index: 1; }
	.jobFlow ol li b { display: block; font-size: 16px; line-height: 25px;  margin: 0; }
	.jobFlow ol li b br { display: none; }

	.jobFlow ol li:nth-child(1) { border-radius: 10px 10px 0 0; }
	.jobFlow ol li:nth-child(5) { border-radius: 0 0 10px 10px; }

	.jobFlow ol li:nth-child(1):after { border-left-color: transparent; }
	.jobFlow ol li:nth-child(2):after { border-left-color: transparent; }
	.jobFlow ol li:nth-child(3):after { border-left-color: transparent; }
	.jobFlow ol li:nth-child(4):after { border-left-color: transparent; }

	.jobFlow ol li:nth-child(1):after { border-top-color: #FFF; }
	.jobFlow ol li:nth-child(2):after { border-top-color: #FFF; }
	.jobFlow ol li:nth-child(3):after { border-top-color: #FFF; }
	.jobFlow ol li:nth-child(4):after { border-top-color: #FFF; }
	.jobFlow ol li:nth-child(5):before { content: none; }
	.jobFlow ol li:nth-child(5):after { content: none; }



	.jobFaq { padding: 60px 0; margin: 0; }
	.jobFaq .inner { padding: 0 15px; }
	.jobFaq:before { height: 60px;}
	.jobFaq:after { height: 60px;}
	
	.jobFaq h3 { font-size: 32px; line-height: 40px; }
	.jobFaq h3 span { font-size: 16px; line-height: 20px; margin: 10px 0 0; }

	.jobFaq dl { width: 100%; margin: 30px 0 0; padding: 0; font-size: 16px; line-height: 25px; border-radius: 10px; }
	.jobFaq dt { padding: 15px 15px 0; }
	.jobFaq dt b { font-size: 20px; }
	.jobFaq dd { padding: 15px; }
	.jobFaq dd b { font-size: 20px; }
}