/* ========================

      register.css

========================= */


/* ============
    リセット
============= */

* { box-sizing:border-box;}

html,body {
  overflow:hidden;
  overflow-y:auto;
  margin:0 auto;
  width:750px;
  background:#FFF;
  word-wrap: break-word;
  overflow-wrap: break-word;
  -webkit-text-size-adjust: 100%;
}

html,body,h1,h2,h3,h4,ul,ol,dl,li,dt,dd,p,div,span,img,a,table,tr,th,td {
  margin: 0;
  padding: 0;
  border: 0;
  font-weight: normal;
  font-size: 100%;
  vertical-align: middle;
}

article,header,footer,aside,figure,figcaption,nav,section {
  display: block;
}

body {
  color: #000;
  text-align:center;
  font-family: 'Hiragino Sans', 'ヒラギノ角ゴシック', YuGothic, 'Yu Gothic', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic';
  line-height: 1.5;
}


ol,ul {
  list-style: none;
  list-style-type: none;
}

a:link, a:visited {
  text-decoration: none;
}


input,
select,
button,
textarea {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background:none;
	border:0;
}
textarea:focus, input:focus, input[type]:focus, .uneditable-input:focus {
  outline: 0;
  box-shadow: none;
  border: 0;
  background-color: #ffffff;
}
input:-webkit-autofill,
select:-webkit-autofill {
	font-size:16px;
	border:0;
    -webkit-box-shadow: 0 0 0 0 #FFF inset;
    animation-name: onAutoFillStart;
    transition: background-color 50000s ease-in-out 0s;
}

select:focus {
  outline: 0;
}


img {max-width:100%;height:auto;}



.hidden {overflow:hidden;}


.mb10 {margin-bottom:10px !important;}
.mb20 {margin-bottom:20px !important;}
.mb30 {margin-bottom:30px !important;}
.mb40 {margin-bottom:40px !important;}
.mb50 {margin-bottom:50px !important;}
.mb60 {margin-bottom:60px !important;}
.mb70 {margin-bottom:70px !important;}
.mb80 {margin-bottom:80px !important;}
.mb90 {margin-bottom:90px !important;}
.mb100 {margin-bottom:100px !important;}




#container {
	margin:0 auto;
	width:100%;
	box-sizing:border-box;
}


.wrap {
	margin-left:auto;
	margin-right:auto;
	width:100vw;
}





header {
	width:100%;
	text-align:left;
	background:#FFF;
}
	header .wrap {width:95%;}
		header .wrap img {width:542px;}






footer {}
	footer .wrap {padding:20px 0;width:90%;}
				

	.privacyArea {
		overflow:hidden;
		padding:12px 0;
	}
		.privacyArea img {float:left;margin-right:30px;width:98px;}
		.privacyArea p {
		    padding-top: 3px;
			font-size:22px;
			text-align:left;
		}

	footer small {
		display:block;
		padding:20px;
		font-size:18px;
		color:#FFF;
		background:#333333;
	}







#formArea {padding:0;}
	#formArea h1 {
		padding:10px 0;
		font-size:28px;
		color:#ff5252;
		font-weight:bold;
	}
	
	.area-form {
		width:100%;
		background:#D6DCE5;
	}
	



	.area-form .wrap {
		overflow:hidden;
		position:relative;
		width:100%;
		height:417px;
		-webkit-transition: 0.3s;-moz-transition: 0.3s;-o-transition: 0.3s;transition: 0.3s;
	}
		.area-form .wrap #slideWrap {
			overflow:hidden;
			position:absolute;
			display:block;
			left:0;
			top:0;
			width:400vw;
			z-index:9999;
			-webkit-transition: 0.3s;-moz-transition: 0.3s;-o-transition: 0.3s;transition: 0.3s;
		}
			.area-form .wrap .step {
				float:left;
				padding:0 0 40px 0;
				width:100vw;
			}
				.area-form .wrap .step .inner {
					margin:0 auto;
					width:95vw;
				}
	
	
	.area-form .wrap.step0 {height:1080px;}
	.area-form .wrap #slideWrap.step0 {left:0;}
	
	.area-form .wrap.step1 {height:1315px;}
	.area-form .wrap #slideWrap.step1 {left:-100vw;}
	
	.area-form .wrap.step2 {height:1315px;}
	.area-form .wrap #slideWrap.step2 {left:-200vw;}
	
	.area-form .wrap.step3 {height:1315px;}
	.area-form .wrap #slideWrap.step3 {left:-300vw;}




	.step_mv {
		margin-bottom:50px;
		width:100%;
	}
	.step_mv.step_mv0 {background:var(--primary-color);}
	.step_mv.step_mv1 {background:linear-gradient(90deg,var(--primary-color) 0%,var(--primary-color) 50%,#707070 50%,#707070 100%);}
	.step_mv.step_mv2 {background:#707070;}
	.step_mv.step_mv3 {background:linear-gradient(90deg,#707070 0%,#707070 50%,var(--primary-color) 50%,var(--primary-color) 100%);}
	
		.step_mv p {
			height:95px;
			/* text-indent:-9999px; */
			background-position: center 0;
			background-repeat:no-repeat;
			text-align: center;
			line-height: 95px;
			color: white;
			font-size: 2.0rem;
			font-weight: bold;
		}
		/* .step_mv.step_mv0 p {background-image:url(../img/step_mv0_sp.jpg);} */
		.step_mv.step_mv1 p {background-image:url(../img/step_mv1_sp.jpg);}
		.step_mv.step_mv2 p {background-image:url(../img/step_mv2_sp.jpg);}
		.step_mv.step_mv3 p {background-image:url(../img/step_mv3_sp.jpg);}


	.keyArea {margin-bottom:30px;font-size:24px;text-align:center;}
		.keyArea:before {
			display:inline-block;
			margin-right:5px;
			width:auto;
			width:18px;
			height:22px;
			content:'';
			background:url(../img/icon_key.jpg);
			background-size:auto 100%;
		}

		
			.area-form input[type="text"],
			.area-form input[type="tel"],
			.area-form input[type="email"],
			.area-form select {
				cursor:pointer;
				padding:20px;
				width:100%;
				height:100px;
				font-size:32px !important;
				color:#000;
				background:#FFF;
				border-radius:5px;
			}
			.area-form select {
				overflow:hidden;
				white-space:nowrap;
				background:#FFF url(../img/icon_arr2.png) 95% center no-repeat;
				background-size:20px 17px;}
			
			.area-form .inp_birth_y select {width:100%;background-position:90% center;}
			.area-form .inp_birth_m select {width:100%;background-position:90% center;}
			.area-form .inp_birth_d select {width:100%;background-position:90% center;}

			.area-form option {margin:0;padding:0;}
			
			
			.area-form dl {font-size:0;}
				.area-form dt {margin-bottom:20px;font-size:34px;font-weight:bold;}
					.area-form dt span {display:block;font-size:24px;color:var(--primary-color);font-weight:normal;}
					
			.area-form .ttl {margin-bottom:20px;font-size:34px;font-weight:bold;}
			.area-form .inp_worklocation3 .ttl {font-weight:normal;}
					.area-form .ttl span {display:inline-block;font-size:24px;color:var(--primary-color);font-weight:normal;}


				.area-form dd {display:inline-block;margin-right:40px;width:210px;}
				.area-form dd:last-child {margin-right:0;}

				.area-form .inp_start dl {
					display: flex;
					flex-wrap: wrap;
					gap: 32px;
				}
				.area-form .inp_start dt {
					width: 100%;
					margin: 0;
				}
				.area-form .inp_start dd {
					width: calc(50% - 16px);
					margin: 0;
				}
				.area-form .inp_start dd:nth-of-type(1) {
					width: 100%;
				}

					.area-form dd input {display:none;}
					.area-form dd label, .inp_hope_subject a  {
						display: flex;
						align-items: center;
						justify-content: center;
						width:100%;
						height:100px;
						font-size:32px;
						color:#0e4486;
						line-height: 1.2;
						font-weight:bold;
						text-align:center;
						border-radius:5px;
						background:#FFF;
						box-shadow:0px -3px 3px -1px #B3B2B2 inset;
						cursor:pointer;
					}
					.area-form dd input:checked + label {
						color:#fff;
						background:var(--primary-color);
						box-shadow:0px 0 0px 0px #B3B2B2;
					}

			.area-form .btn {position:relative;height:90px;}
			.area-form #step4 .btn {position:relative;height:118px;}

				.area-form .back {
					display: inline-block;
					position: absolute;
					left: 40px;
					top: 24px;
					width: auto;
					height: auto;
					font-size: 24px;
					color: var(--primary-color);
					text-indent: 0;
					line-height: 90px;
					text-align: center;
					text-decoration: underline;
					border-radius: 0;
					background: none !important;
					box-shadow: 0 0 0 0 #4f4e4e inset;
					cursor: pointer;
				}
				.area-form .step .back:hover {opacity:0.7;}
				.area-form #step4 .back {top:24px;}

				.area-form .next {
					display:block;
					margin:0 auto;
					width:690px;
					height:130px;
					font-size:40px;
					color:#FFF;
					line-height:130px;
					font-weight:bold;
					text-align:center;
					border-radius:5px;
					background:#1e5fb3 url(../img/icon_arr1.png) 95% center no-repeat;
					box-shadow:0px -3px 3px -1px #8ba2c1 inset;
					cursor:pointer;
				}
				.area-form .step .next:hover {opacity:0.7;}
				
				.area-form #step1 .next,
				.area-form #step2 .next {float: right;width:450px;}
				
				.area-form .next span {font-size:30px;font-weight:bold;}
				
				
				.area-form .submit_off,
				.area-form input[type="button"] {
					display:inline-block;
					width:450px;
					height:130px;
					text-indent:-9999px;
					background:url(../img/btn_submit_sp.png) 0 0 no-repeat !important;
					cursor:pointer;
				}
				.area-form .submit_off:hover,
				.area-form input[type="button"]:hover {opacity:0.7;}
				
				
			.area-form .hosoku {margin-top:20px;font-size:24px;text-align:left;}

				.area-form #step1 .next, .area-form #step2 .next {
						float: none;
				}


.err {
	opacity:0;
	display:inline-block;
	position:absolute;
	top:35px;
	left:18%;
	transform: translate(-50%,0);
	padding:5px 14px;
	font-size:26px;
	color:#FFF;
	white-space:nowrap;
	background:#d9236e;
	border-radius:10px;
	box-shadow:5px 7px 8px -11px #000;
	-webkit-transition: 0.3s;-moz-transition: 0.3s;-o-transition: 0.3s;transition: 0.3s;
}
.err:after {
	position:absolute;
	left:10px;
	bottom:-28px;
	color:#d9236e;
	content:'▼';
	box-shadow:5px 7px 8px -11px #000;
}


	.area-form .inp_birth_y .err {left:15%;}
	.area-form .inp_birth_m .err {left:50%;}
	.area-form .inp_birth_d .err {left:85%;}
	.area-form .inp_area_state .err {left:19%;}
	.area-form .inp_address .err {left:63%;}



.err2 {
	opacity:0;
	display:inline-block;
	position:absolute;
	top:-20px;
	left:18%;
	transform: translate(-50%,0);
	padding:5px 14px;
	font-size:26px;
	color:#FFF;
	white-space:nowrap;
	background:#d9236e;
	border-radius:10px;
	box-shadow:5px 7px 8px -11px #000;
	-webkit-transition: 0.3s;-moz-transition: 0.3s;-o-transition: 0.3s;transition: 0.3s;
}
.err2:after {
	position:absolute;
	left:10px;
	bottom:-28px;
	color:#d9236e;
	content:'▼';
	box-shadow:5px 7px 8px -11px #000;
}



.inp_employ,
.inp_start,
.inp_hope_subject,
.inp_name,
.inp_area {position:relative;width:100%;}


.inp_employ {
	position:relative;
	margin-bottom:40px;
	padding-bottom:40px;
	border-bottom:2px solid #FFF;
}

.inp_hope_subject {
	position:relative;
	margin-bottom:40px;
	padding-bottom:40px;
	border-bottom:2px solid #FFF;
}
	.inp_hope_subject div {
		display:none;
		overflow:visible !important;
		position:relative;
		margin-top:10px;
	}
        .inp_hope_subject .btn_modal {
                font-size: 34px;
        }
        .inp_hope_subject #select_subject {
                text-align: left;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                /*font-size: 34px;*/
                font-size: 4vw;
        }
	

.inp_worklocation2 {
	position:relative;
	margin-bottom:40px;
	padding-bottom:40px;
	border-bottom:2px solid #FFF;

}

.inp_worklocation2 {
	position:relative;

}


.inp_birth {
	position:relative;
	margin-bottom:40px;
	padding-bottom:40px;
	font-size:0;
	border-bottom:2px solid #FFF;
}	
	.area-form .inp_birth_y {display:inline-block;margin-right:40px;width:210px;}
	.area-form .inp_birth_m {display:inline-block;margin-right:40px;width:210px;}
	.area-form .inp_birth_d {display:inline-block;margin-right:0;width:210px;}


.inp_area,
.inp_tel {
	overflow:hidden;
	position:relative;
	margin-bottom:40px;
	padding-bottom:40px;
	border-bottom:2px solid #FFF;
}
.inp_area {font-size:0;}
	.inp_area_state {
		display:inline-block;
		margin-right:30px;
		width:280px;
	}
	.inp_address {
		display:inline-block;
		width:397px;
	}

.inp_mail {
	position:relative;
	overflow:hidden;
}



.kiyaku_privacy {margin-bottom:40px !important;font-size:24px;color:var(--primary-color);}
	.kiyaku_privacy span { text-decoration:underline;}
	.kiyaku_privacy span:hover {opacity:0.7;}





/* モーダル */
.modal_inline {
  display: none;
}
.box_subject input {
  	-webkit-appearance: checkbox;
	-moz-appearance: checkbox;
	appearance: checkbox;
}
.modal_wrap {
  font-size: 26px;
  width: 95vw;
  height: 100%;
  padding: 15px 10px;
  border: 6px solid #8ba2c1;
  box-sizing: border-box;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.modal_headline {
  margin: 0 0 .5em;
  font-weight: bold;
}
.modal_heading {
  position: relative;
  margin: 0 0 1px;
  padding: 10px;
  background: #d6dfeb;
  font-size: 24px;
  font-weight: bold;
}
.modal_heading::before {
  display: block;
  position: absolute;
  top: 50%;
  right: 20px;
  width: 14px;
  height: 14px;
  margin-top: -10px;
  transform: rotate(135deg);
  border-width: 1px 1px 0 0;
  border-style: solid;
  border-color: var(--primary-color);
  content: "";
}
.modal_heading.is_open::before {
  margin-top: -3px;
  transform: rotate(-45deg);
}

.wrap_item {
  display: flex;
  flex-wrap: wrap;
  align-items: top;
  width: 100%;
}
.check_all {
  width: 100%;
  margin: 10px 0 0 10px;
  font-weight: bold;
  text-align: left;
}
.list_item {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  margin: 0 0 10px;
  padding: 0;
  list-style: none;
  text-align: left;
}
.list_item:not(:first-child) {
  margin-top: 10px;
  border-top: 1px solid #d6dfeb;
}
.list_item li {
  width: 50%;
  padding: 10px;
  box-sizing: border-box;
}
.wrap_item input { margin-right: 8px; }

.modal_btn {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 30px 0 0;
  padding: 0;
  list-style: none;
}
.btn_select {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 250px;
    height: 80px;
    margin: 0;
    border-radius: 4px;
    background: linear-gradient(to bottom, #2475c0 0%,#2068ac 45%,#17558d 51%,#1b5d9a 100%);
    color: #fff;
    text-decoration: none;
    overflow: hidden;
}


.btn_clear {
  display: block;
  margin-left: 15px;
  padding: 20px 40px;
  transition-duration: 0.3s;
  border: 1px solid #9cb2cc;
  color: #4772a1;
  font-size: 14px;
  text-decoration: none;
}

/* モーダル初期設定 */
#cboxContent,
#cboxLoadedContent {
  margin: 0;
  padding: 0;
  background: #fff;
}

#cboxClose {
  top: 16px;
  right: 16px;
  width: 40px;
  height: 38px;
  border: 3px solid #fff;
  background: url("../../common2014/img/btn_place_close_off.png") no-repeat left top / cover;
}
#cboxClose:hover {
  background-image: url("../../common2014/img/btn_place_close_on.png")
}


.forPC{
	display:none;
}
p.err_msg {
	display:block;
	color:red;
	text-align:left;
	clear: both;
	font-size:24px;
}
.efocube-error-box {
	font-size: 20px !important;
}

/* 訴求内容 */
.privacyArea{
	padding:0 !important;
}
.pc_only{
	display:none;
}
.sp_only{
	display:block;
}
.privacyArea img{
	width:100%;
	height:auto;
}
.wrap.step0 .stepNumber {display: none;}
.wrap:not(.step0) .stepNumber {
  background: #707070;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  position: relative;
  overflow: hidden;
}
.area-form .wrap:not(.step0) #slideWrap {padding-top: 80px;}
.stepNumber li {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  position: relative;
  width: 240px;
  height: 60px;
}
.stepNumber li:nth-child(1) {display: none;}
.stepNumber li:nth-child(2) {
  justify-content: center;
  padding-left: 30px;
  width: 240px;
}
.stepNumber li:nth-child(3) {padding-left: 30px;}
.stepNumber li:nth-child(4) {
  justify-content: center;
  width: 270px;
}
.stepNumber .step1_on,
.stepNumber .step2_on,
.stepNumber .step3_on {background: var(--primary-color);}
.stepNumber:before,
.stepNumber:after {
  content: "";
  border-style: solid solid none none;
  border-width: 4px 5px 0 0;
  border-color: #d6dce5;
  transform: rotate(59deg)skew(28deg);
  position: absolute;
  top: 8px;
  width: 46px;
  height: 42px;
  z-index: 10;
}
.stepNumber:before {left: 220px;}
.stepNumber:after {left: 450px;}
.step1 .stepNumber:before {background: #1f5fb3;}
.step2 .stepNumber:before {background: #707070;}
.step2 .stepNumber:after {background: #1f5fb3;}
.step3 .stepNumber:after {background: #707070;}
.page01,
.page02,
.page03,
.page04 {display: none;}
.iPhone .wrap img{
  width: 540px;
}
#container header .wrap {
  display:flex;
  margin-right:0px;
  margin:0px 0px 0px 39.1111px;
}
#container .wrap .login_r {
  font-size: 25px;
  text-align:right;
  width:50%;
  min-width:none;
  margin-left:0px;
  padding-top:5px;
  clear:right;
  margin:auto 3% auto 0px;
  padding:5px 0px 0px 0px;
  height:NaN%;
  min-height:none;
  margin-right:3%;
  margin-top:auto;
  margin-bottom:auto;
  right:5%;
}
#container .nav-function-login strong {
  font-size:20px;
  font-family:"Hiragino Sans", ヒラギノ角ゴシック, YuGothic, "Yu Gothic", メイリオ, Meiryo, "ＭＳ Ｐゴシック", "MS PGothic";
}
#container .login_r .nav-function-login {
  font-family:"メイリオ";
  font-size:20px;
  font-weight:500;
  padding-bottom:1px;
  padding:0px 0px 1px 0px;
  color:var(--primary-color);
  -webkit-text-fill-color:var(--primary-color);
  text-fill-color:var(--primary-color);
  border-style:solid;
  border-bottom:2px solid var(--primary-color);
}