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

/*--------------------------------------------------------------------------------------------------------------------------------------------------------
	index.html
--------------------------------------------------------------------------------------------------------------------------------------------------------*/
/*mvSec*/
#mvSec { max-width: 1960px; margin: 0 auto; background: url("/parking/recruit/common/images/common_contents_bg02.png") repeat center center; position: relative; }
#mvSec h1 { position: absolute; top: 80px; left: 475px; width: 17vw; max-width: 336px; }
#mvSec #mvText { position: absolute; bottom: 0; left: 0; right: 0; }
#mvSec #mvImg { padding-top: 48px; padding-bottom: 80px; }

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

	#mvSec h1 { top: 4vw; left: 23.8vw; }
	#mvSec #mvImg { padding-top: 2.5vw; padding-bottom: 4.6vw; }

}

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

	#mvSec #mvImg { padding-top: 11.5vw; padding-bottom: 6.7vw; }
	#mvSec h1 { width: 45.5vw; top: 4vw; left: 0; right: 0; margin: 0 auto; }

}


/*employee*/
#employeeSec { background: url("/parking/recruit/benefit/images/benefit_employee_bg_pc.png") no-repeat center bottom; }
#employeeSec .contentsWrap { max-width: 1340px; padding-top: 75px; padding-bottom: 10px; }
#employeeSec .contentsTitle { max-width: 834px; width: 54vw; text-align: center; margin: 0 auto; }
#employeeSec #employeeArea { display: flex; justify-content: space-between; margin-top: 5px; }
#employeeSec #employeeArea #employeeInfo { width: 300px; flex: 1; order: 2; text-align: center; }
#employeeSec #employeeArea #employeeInfo h3 { font-size: 2.2rem; color: #004fa3; }
#employeeSec #employeeArea #employeeInfo p { font-size: 1.6rem; font-weight: bold; }
#employeeSec #employeeArea #employeeImg01 { max-width: 335px; width: 25.8%; order: 1; margin-top: 22px; }
#employeeSec #employeeArea #employeeImg02 { max-width: 300px; width: 23.1%; order: 3; margin-top: 36px; }
#employeeSec #employeeList { display: flex; justify-content: center; }
#employeeSec #employeeList li { max-width: 308px; margin: 0 7px; }


@media screen and (max-width: 1340px) {
	
	#employeeSec { background-position: center 40vw; }
	#employeeSec .contentsWrap { padding-top: 5.5vw; padding-bottom: 0.74vw; }
	#employeeSec #employeeArea #employeeInfo h3 { font-size: 2.63vw; }
	#employeeSec #employeeArea #employeeInfo p { font-size: 1.9vw; }
	#employeeSec #employeeArea #employeeImg01 { margin-top: 1.65vw; }
	#employeeSec #employeeArea #employeeImg02 { margin-top: 2.7vw; }

}

@media screen and (max-width: 750px) {
	
	#employeeSec { background: url("/parking/recruit/benefit/images/benefit_employee_bg_sp.png") no-repeat center bottom / 100%; }
	#employeeSec .contentsWrap { padding-top: 7vw; width: 94%; }
	#employeeSec .contentsTitle { width: 100%; }
	#employeeSec #employeeArea { flex-wrap: wrap; }
	#employeeSec #employeeArea #employeeInfo { width: 100%; flex: auto; order: 1; }
	#employeeSec #employeeArea #employeeInfo h3 { font-size: 5.2vw; letter-spacing: -0.03em; }
	#employeeSec #employeeArea #employeeInfo p { font-size: 3.6vw; margin-top: 1.5vw; letter-spacing: -0.03em; }
	#employeeSec #employeeArea #employeeImg01 { order: 2; width: 50.5%; margin-top: 5.65vw; }
	#employeeSec #employeeArea #employeeImg02 { width: 45%; margin-top: 5.7vw; }
	#employeeSec #employeeList { flex-wrap: wrap; justify-content: space-between; margin: 4vw 3vw 0; }
	#employeeSec #employeeList li { width: 49%; margin: 0; }
	
	
}

/*training*/
#trainingSec { background: #014fa4 url("/parking/recruit/benefit/images/benefit_training_system_bg.png") no-repeat center top; padding: 18px 0 75px; margin-top: 75px; }
#trainingSec #trainingTitleArea { position: relative; max-width: 1008px; width: 84vw; margin: 0 auto; }
#trainingSec #trainingTitleArea .contentsTitle { max-width: 834px; width: 54vw; position: absolute; top: 52px; left: 0; right: 0; margin: 0 auto; }
#trainingSec #trainingTitleArea #trainingPeople { margin-left: auto; max-width: 194px; position: relative; width: 11vw; }
#trainingSec #trainingArea { background-color: #fff; border-radius: 30px; padding: 22px 38px 40px; box-shadow: 10px 10px 10px rgba(0,0,0,0.3); }
#trainingSec #trainingArea h3 { font-size: 2.2rem; color: #004fa3; text-align: center; }
#trainingSec #trainingArea #trainingInner { display: flex; justify-content: space-between; flex-direction: row-reverse; margin-top: 35px; }
#trainingSec #trainingArea #trainingInner ol { font-size: 2.2rem; width: 47vw; max-width: 542px; }
#trainingSec #trainingArea #trainingInner ol li:nth-child(n+2) { margin-top: 30px; }
#trainingSec #trainingArea #trainingInner ol h4 { border: solid 2px #014da3; border-radius: 40px; line-height: 1; padding: 11px 0; text-align: center; }
#trainingSec #trainingArea #trainingInner ol h4 img { max-width: 165px; }
#trainingSec #trainingArea #trainingInner ol li p { font-size: 1.65rem; font-weight: bold; margin-top: 5px; line-height: 1.85; }
#trainingSec #trainingArea #trainingInner > div { max-width: 524px; width: 47vw; }

#trainingSec #trainingArea #systemInner { margin-top: 30px; background-color: #bde9f4; border-radius: 20px; padding: 22px 30px 35px; font-size: 1.6rem; line-height: 1.4; }
#trainingSec #trainingArea #systemInner > div { margin-top: 20px; }
#trainingSec #trainingArea #systemInner #systemAttention { font-size: 1.3rem; margin-top: 10px; }
#trainingSec #trainingArea #systemList { display: flex; justify-content: space-between; margin-top: 42px; }
#trainingSec #trainingArea #systemList li { max-width: 542px; width: 47vw; border: solid 2px #004fa3; border-radius: 20px; background-color: #fff9b3; padding: 40px 40px 20px; }

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

	#trainingSec { padding: 1.5vw 0 6vw; margin-top: 6vw; }
	#trainingSec #trainingTitleArea .contentsTitle { top: 2vw; }
	#trainingSec #trainingArea { padding: 1.77vw 3vw 3.1vw; }
	#trainingSec #trainingArea h3 { font-size: 2.85vw; }
	#trainingSec #trainingArea #trainingInner { margin-top: 2.8vw; }
	#trainingSec #trainingArea #trainingInner ol { width: 48%; }
	#trainingSec #trainingArea #trainingInner ol li:nth-child(n+2) { margin-top: 2.4vw; }
	#trainingSec #trainingArea #trainingInner ol h4 { padding: 0.85vw 0; line-height: 0; }
	#trainingSec #trainingArea #trainingInner ol h4 img { width: 13.4vw; }
	#trainingSec #trainingArea #trainingInner ol li p { margin-top: 0.4vw; font-size: 2.1vw; }
	#trainingSec #trainingArea #trainingInner > div { width: 48%; }
	#trainingSec #trainingArea #systemInner { margin-top: 2.4vw; padding: 1.7vw 2.4vw 2.8vw; font-size: 2.08vw; }
	#trainingSec #trainingArea #systemInner > div { margin-top: 1.6vw; }
	#trainingSec #trainingArea #systemInner #systemAttention { margin-top: 0.8vw; font-size: 1.65vw; }
	#trainingSec #trainingArea #systemList { margin-top: 3.4vw; }
	#trainingSec #trainingArea #systemList li { width: 48%; padding: 3.2vw 3.2vw 1.6vw; }

}

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

	#trainingSec { padding: 9vw 0 10vw; background: #014fa4; margin: 0; }
	#trainingSec #trainingTitleArea { width: 100%; }
	#trainingSec #trainingTitleArea .contentsTitle { position: static; width: 100%; }
	#trainingSec #trainingTitleArea #trainingPeople { display: none; }
	#trainingSec #trainingArea { margin-top: 2vw; padding: 4.5vw 4vw 6vw; border-radius: 20px; }
	#trainingSec #trainingArea h3 { font-size: 5.1vw; line-height: 1.5; }
	#trainingSec #trainingArea #trainingInner { display: block; }
	#trainingSec #trainingArea #trainingInner > div { width: 100%; max-width: 100%; }
	#trainingSec #trainingArea #trainingInner ol { width: 100%; margin-top: 6.5vw; max-width: 100%; }
	#trainingSec #trainingArea #trainingInner ol h4 { border-width: 1px; padding: 1.85vw 0; }
	#trainingSec #trainingArea #trainingInner ol h4 img { width: 27vw; }
	#trainingSec #trainingArea #trainingInner ol li p { font-size: 4.1vw; margin-top: 1.8vw; }
	#trainingSec #trainingArea #trainingInner ol li:nth-child(n+2) { margin-top: 4.4vw; }
	
	#trainingSec #trainingArea #systemInner { margin-top: 4.4vw; padding: 5vw 3.4vw; font-size: 4vw; }
	#trainingSec #trainingArea #systemInner > div { margin-top: 3.8vw; }
	#trainingSec #trainingArea #systemInner #systemAttention { margin-top: 1vw; font-size: 2.8vw; }
	
	#trainingSec #trainingArea #systemList { margin-top: 6.4vw; display: block; }
	#trainingSec #trainingArea #systemList li { width: 100%; padding: 6.2vw 3.2vw 3vw; border-width: 1px; border-radius: 10px; max-width: 100%; }
	#trainingSec #trainingArea #systemList li:last-child { margin-top: 6vw; }

}


/*scroll*/
#scrollSec { background: url("/parking/recruit/common/images/common_contents_bg01.png") repeat center center; padding: 75px 0 70px; }
#scrollSec .scrollSlide { width: 364px; margin: 0 20px; }

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

	#scrollSec { padding: 6vw 0 5.6vw; }

}

@media screen and (max-width: 750px) {
	
	#scrollSec { background-size: 28%; padding: 9vw 0 9.6vw; }
	#scrollSec .scrollSlide { margin: 0 3vw; }
	
}

/*comment*/
#commentSec { background: url("/parking/recruit/common/images/common_contents_bg02.png") repeat center center; padding: 75px 0; }
#commentSec .contentsTitle { max-width: 1144px; width: 74vw; margin: 0 auto; }
#commentSec #commentList { display: flex; justify-content: space-between; flex-wrap: wrap; margin-top: 5px; }
#commentSec #commentList li { width: 48.5%; background-color: #fff; border-radius: 30px; padding: 25px 35px 30px 45px; display: flex; justify-content: space-between; align-items: center; }
#commentSec #commentList li:nth-child(n+3) { margin-top: 33px; }
#commentSec #commentList li > div { width: 27%; }
#commentSec #commentList li > p { margin-left: 20px; flex: 1; font-size: 1.5rem; font-weight: bold; line-height: 1.7; }

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

	#commentSec { padding: 6vw 0; }
	#commentSec #commentList { margin-top: 0.4vw; }
	#commentSec #commentList li { padding: 2vw 2.8vw 2.4vw; }
	#commentSec #commentList li > p { margin-left: 1.6vw; font-size: 1.9vw; }
	#commentSec #commentList li:nth-child(n+3) { margin-top: 2.6vw; }

}

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

	#commentSec { padding: 7vw 0; }
	#commentSec .contentsTitle { width: 100%; }
	#commentSec #commentList { margin: 2.5vw auto 0; width: 92%; display: block; }
	#commentSec #commentList li { width: 100%; border-radius: 15px; padding: 4vw 2.8vw 4.4vw 6.4vw; }
	#commentSec #commentList li:nth-child(2),
	#commentSec #commentList li:nth-child(n+3) { margin-top: 5vw; }
	#commentSec #commentList li > div { width: 26%; }
	#commentSec #commentList li > p { font-size: 3.8vw; margin-left: 2.6vw; }

}














