@charset "UTF-8";

/* -------------------------- */
/* -------- 共通部品 -------- */
/* -------------------------- */

#header .inner .logo {
	text-indent:0px;
}

input {
    font-family: inherit;
}

/* リンク設定 */
#cont_input a:link, a:visited {
	color:#0000ff;
}
#cont_input a:hover {
	color: red;
}


/* ページ全体のベース部分 */
.bodys {
	max-width: 1024px;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}

/* 枠組みベース部分 */
#cont_input {
	max-width: 1024px;
	margin-top:10px;
	font-size: 18px;
}
#cont_input .inner {
	margin: 0 auto;
	-webkit-background-size: 100%;
}

/* 必須マーク */
.required_mark {
	background: rgb(255, 0, 0);
	margin: 5px;
	padding: 2px 4px 2px 4px;
	border-radius: 2px;
	color: rgb(255, 255, 255);
	font-size: x-small;
	float:right !important;
}


/* 必須マーク(ページ冒頭の説明部分用) */
.required_mark_text {
	background: rgb(255, 0, 0);
	margin: 5px;
	padding: 2px 4px 2px 4px;
	border-radius: 2px;
	color: rgb(255, 255, 255);
	font-size: x-small;
	float:left;
	margin-top: 3.5px;
}

/* （デフォルト指定）テキスト項目中央寄せ */
span {
	vertical-align: middle;
}

/* 大分類先頭ライン */
.area_header::before {
	content: "";
	position: absolute;
	left: 0px;
	width: 8px;
	height: calc(100% - 10px);
	background-color:#9ae1e1;
}
/* 大分類 */
.area_header {
	font-size: 24px;
	font-weight: bold;
	line-height: 1.2;
	position: relative;
	padding-top: 10px;
	padding-left: 12px;
	margin-top: 20px;
	margin-bottom: 1rem !important;
	border-bottom: 1px solid #9ae1e1;
}

/* 大分類説明文 */
.area_header_text {
	font-size: 14px;
	color: red;
}

/* 枠組み用（大分類内最初の項目） */
.dl_area_first {
	border-top:1px solid #ccc;
}

/* 枠組み用（項目単位） */
dl {
	width: 100%;
	border: 1px solid #ccc;
	border-top: none;
	display: table;
}
/* 枠組み用（項目ヘッダ） */
dt {
	font-weight: bold;
	padding: 10px 10px 10px 10px;
	background: #f5f5f5;
	margin-right: 10px;
	vertical-align: middle;
}

/* 項目ヘッダ部のポインタ変更を解除 */
#cont_input .inner dt label {
	cursor: default;
}

/* 入力項目 */
input[type="text"], input[type="password"] {
	height:50px;
	border:#dcdcdc 1px solid;
	white-space: nowrap;
	background-color: rgb(232, 247, 247);
	font-size:18px;
	vertical-align: middle;
	-webkit-appearance: none;
}
.input_box1 {
	width:300px;
}
.input_box2 {
	width:146px;
	text-align: right;
	margin-right: 10px;
}
.input_box4 {
	width:100%;
	text-align: left;
}
.input_box5 {
	width:146px;
	text-align: right;
}
.input_box6 {
	width:146px;
}

.input_right_space {
	margin-right: 10px;
}
.input_left_space {
	margin-left: 10px;
}
.input_box7 {
	width:146px;
	text-align: left;
	margin-right: 10px;
}
/* プルダウンリスト */
select {
	height:50px;
	line-height:24px;
	font-size:18px;
	background-color: rgb(232, 247, 247);
}
select.width1 {
	width:208px;
}
select.width2 {
	width:348px;
}
select.width3 {
	width:300px;
}

/* 項目タイトル（上下中央） */
#cont_input .inner dt label {
	vertical-align: middle;
}

/* 項目タイトル（項目プロパティ） */
.cont_prop {
	font-weight: normal;
	font-size:15px;
}

/* 項目説明文 */
.cont_text {
	color: #909090;
	font-size:13px;
	padding-top: 10px;
}

/* 項目説明文（条件必須） */
.cont_text_both {
	display:inline-block;
	font-size: 13px;
	padding-top: 10px;
}

/* 文字色 */
.fontcolor_red {
    color: red;
}
.fontcolor_blue {
    color: blue;
}
.fontcolor_grey {
	color: #909090;
}

/* 文字サイズ */
.cont_text_fontsize {
	font-size: 13px;
}

/* 項目内タイトル上空け用 */
.item_margintop {
	margin-top: 10px;
}

/* ラジオボタン項目間 */
.radio_span {
	display: inline-block;
	width: auto;
	min-width: 30%;
}

/* ボタン共通 */
input[type="button"], input[type="submit"] {
	cursor: pointer;
	padding: 0px;
	height: 50px;
	line-height: 1;
	text-align: center;
	font-size: 18px;
}

/* 免許証読み取りボタンエリア */
.license_read_area {
	background-color: lightgoldenrodyellow;
	margin-top: 20px;
	padding: 20px;
	border: 1px solid rgb(218, 194, 62);
	position: relative;
}

.license_read_area .license_read_btn_area {
	display: table-cell;
	vertical-align: middle;
	padding-right: 20px;
}

.license_read_btn_area .license_read_btn {
	width: 142px;
	color: black;
	border: #dcdcdc solid 1px;
	background: url(../img/bg_close_btn_no01.gif) left top repeat-x;
	background-size: contain;
	text-align: right;
	padding-right: 10px;
	position: relative;
	z-index: 1;
}
#license_btn_icon {
	position: absolute;
	content: '';
	width: 50px;
	height: 50px;
	background: url(../img/icon_camera.png) left;
	background-repeat: no-repeat;
	background-size: 80%;
	z-index: 2;
	margin-left: 10px;
	cursor: pointer;
}

.license_read_area .license_read_text_area {
	display: table-cell;
	vertical-align: middle;
	font-size: 16px;
}

/* 次へボタンエリア */
#cont_input .send_area {
	padding: 10px 0px 10px 0px;
	text-align: right;
	display: table;
	width: 100%;
}

#cont_input .send_area .agree_area_left {
	display: table-cell;
	width: 100%;
	padding: 0px 10px 0px 10px;
	vertical-align: middle;
}

#cont_input .send_area .agree_area_right {
	display: table-cell;
	padding-left: 10px;
}

#cont_input .next_btn {
	width: 152px;
	color: #FFF;
	background: url(../../common/img/bg_btn_no01.gif) left top repeat-x;
	border: #5bcece 1px solid;
	background-size: contain;
}

/* フッターエリア */
#cont_input .fotter_area {
	border-top: #dcdcdc solid 1px;
	padding-top: 10px;
	margin-top: 50px;
}

#cont_input .fotter_area::after {
	clear: both;
	display: block;
	content: "";
}

#cont_input .fotter_area .policy .txt {
	line-height: 1;
}
#cont_input .fotter_area .policy a {
	color:#000000;
	letter-spacing:.5px;
	font-size:10px;
}

#cont_input .fotter_area .end_btn {
	float: right;
	width: 152px;
	color: black;
    border: #dcdcdc solid 1px;
	background: url(../img/bg_close_btn_no01.gif) left top repeat-x;
	background-size: contain;
}

/* 画面縮小時に項目同士が接合するため、高さを調整 */
.line_height {
	line-height: 3.5;
}


.disp_non {
	display: none;
}

.text_left {
	margin-left: auto;
}

.input_top_space {
	margin-top: 5px;
}


/* チェックボックス用レイアウト（同意） */
.agree_check {
	padding-right: 20px;
}
.agree_check > div > div.check_box_cell > input[type="checkbox"] {
	margin-top: 5px;
}
.agree_check > div:first-child > div:nth-child(2) {
	font-size: 17px;
}
/* チェックボックス用（同意）の説明文領域 */
.agree_check > div:nth-child(2) > div:nth-child(2) {
	padding-top: 10px;
	font-size: 14px;
}
#cont_input .send_area .agree_area_left label {
	vertical-align: middle;
}


/* チェックボックス用レイアウト */
.checkboxTable {
	display: table;
	font-size:15px;
	border-spacing: 0 10px;
}
.checkboxTable > div {
	display: table-row;
}
.checkboxTable > div > div {
	display: table-cell;
	vertical-align: middle;
}
.checkboxTable > div > div.check_box_cell {
	vertical-align: top;
}
.checkboxTable > div > div.check_box_cell > input[type="checkbox"] {
	margin-top: 3px;
}
.checkboxTable > div > div:nth-child(2) {
	padding-left: 10px;
}


/* ラジオ・チェックボックス共通 */
input[type="radio"], input[type="checkbox"] {
	display: none;
}
.btnSpace {
	width: 50px;
}

.btnSpaceh {
	width: 50px;
	height: 30px;
}

/* ラジオ見た目装飾用 */
.radios label {
	padding-left: 36px;
	padding-bottom: 5px;
	line-height: 33px;
	display: inline-block;
	position: relative;
}
.radios label:before {
	content: '';
	width: 28px;
	height: 28px;
	position: absolute;
	top: 0;
	left: 0;
	background-color: #ffffff;
	border-radius: 50%;
	border: 1px solid #999999;
}
.radios input[type="radio"]:checked + label:after {
	content: '';
	width: 20px;
	height: 20px;
	position: absolute;
	top: 5px;
	left: 5px;
	background-color: #555555;
	border-radius: 50%;
}


/* チェックボックス見た目装飾用 */
.checkboxs label {
	position: relative;
}
.checkboxs label:hover:after {
	border-color: #555555;
}
.checkboxs label:after, label:before{
	position: absolute;
	content: "";
	top: 50%;
}
.checkboxs label:after {
	left: -53px;
	margin-top: -17px;
	width: 30px;
	height: 30px;
	border: 2px solid #999999;
}
.checkboxs label:before {
	left: -42px;
	margin-top: -13px;
	width: 10px;
	height: 18px;
	border-right: 3px solid #555555;
	border-bottom: 3px solid #555555;
	transform: rotate(45deg);
	opacity: 0;
}
.checkboxs input[type=checkbox]:checked ~ label:before {
	opacity: 1;
}

/* チェックボックス見た目装飾用（後ろ配置版） */
.checkboxsAf label {
	position: relative;
}
.checkboxsAf label:hover:after {
	border-color: #555555;
}
.checkboxsAf label:after, label:before{
	position: absolute;
	content: "";
	top: 50%;
}
.checkboxsAf label:after {
	left: 55px;
	margin-top: -17px;
	width: 30px;
	height: 30px;
	border: 2px solid #999999;
}
.checkboxsAf label:before {
	left: 65px;
	margin-top: -13px;
	width: 10px;
	height: 18px;
	border-right: 3px solid #555555;
	border-bottom: 3px solid #555555;
	transform: rotate(45deg);
	opacity: 0;
}
.checkboxsAf input[type=checkbox]:checked ~ label:before {
	opacity: 1;
}


/* ----------------------------------------------------- */
/* -------- 項目別設定（スマホ/タブレット共通） -------- */
/* ----------------------------------------------------- */
/* ページ冒頭説明エリア */
.title_text {
	margin-bottom: 30px;
}

/* ラベルの疑似テキスト表示 */
div.label_box_row {
	display: table-row;
}
div.label_box_row > div {
	display: table-cell;
	height: 50px;
	vertical-align: middle;
}
div.label_box_row > div:first-child {
	padding: 0px 5px 0px 5px;
	border: #dcdcdc 1px solid;
}
div.label_box_row > div:nth-child(2) {
	padding-left: 10px;
	border: transparent 1px solid;
}
div.label_box_row > div.type1 {
	width: 50px;
	text-align: right;
}
div.label_box_row > div.type2 {
	width: 150px;
	text-align: right;
}

/* メールアドレス */
.mailAddrs {
	word-break: break-all;
	word-wrap: break-word;
}
/* 英文 */
.English {
	word-wrap: break-word;
}

/* ------------------------------ */
/* -------- タブレット用 -------- */
/* ------------------------------ */
@media screen and (min-width: 768px) {

	.bodys .inner {
		margin-left: 32px;
		margin-right: 32px;
	}

	/* 枠組み用（項目ヘッダ） */
	dt {
		display: table-cell;
		width: 274px;
	}
	/* 枠組み用（項目内容） */
	dd {
		margin: 20px 10px 20px 10px;
	}

	/* 項目タイトル（項目名） */
	.cont_name {
		display: table-cell;
	}
	/* 項目タイトル（項目プロパティ） */
	.cont_prop {
		display: table-row;
	}

	/* 横並び項目用 (スマホレイアウト時縦並び可変) */
	.cont_left {
		display: inline-block;
		padding-right: 5px;
	}
	.cont_right {
		display: inline-block;
	}

	/* 項目名（タイトル、属性、必須） */
	#cont_input .inner dt .cont_title_two_line {
		display: table-cell;
		vertical-align: middle;
		white-space: nowrap;
	}

	/* 必須 */
	.req {
	width: 100%;
	}

	#cont_input .inner .join_company_ym {
		display: inline;
	}
}






/* -------------------------- */
/* -------- スマホ用 -------- */
/* -------------------------- */
@media screen and (max-width: 767px) {

	.bodys .inner {
		margin-left: 15px;
		margin-right: 15px;
	}

	.title {
		padding: 0;
	}

	.title h1 {
		font-size: 24px;
	}

	/* 枠組み用（項目ヘッダ） */
	dt {
		width: 100%;
	}
	/* 枠組み用（項目内容） */
	dd {
		margin: 15px 10px 25px 10px;
	}

	.error_msg_n {
		font-size: 12px;
	}

	/* 入力項目 */
	.input_box1{
		width:100%;
	}
	.input_box2{
		width:150px;
		text-align: right;
	}
	.input_box4{
		width:100%;
		text-align: left;
	}
	.input_box5{
		width:85px;
		text-align: right;
	}
	.input_box5:-ms-input-placeholder {
		font-size: 16px;
	}
	.input_box5::-webkit-input-placeholder {
		font-size: 16px;
	}
	.input_box5:-moz-placeholder {
		font-size: 16px;
	}
	.input_box5::-moz-placeholder {
		font-size: 16px;
	}

	/* プルダウンリスト */
	select {
		line-height: normal;
	}
	select.width1 {
		max-width:250px;
	}
	select.width2 {
		width:100%;
	}
	select.width3 {
		width:100%;
	}

	/* 項目タイトル（項目名） */
	.cont_name {
	}
	/* 項目タイトル（項目プロパティ） */
	.cont_prop {
	}

	/* 横並び項目用 (スマホレイアウト時縦並び可変) */
	.cont_left {
	}
	.cont_right {
		margin-top: 10px;
	}

	/* 項目名（タイトル、属性、必須） */
	#cont_input .inner dt .cont_title_two_line {
		display: inline;
	}

	/* 折り返し禁止 */
	.text_nowrap {
		white-space: nowrap;
	}

	/* float解除 */
	.req::after {
		clear: both;
		display: block;
		content: "";
	}

	/* 送信ボタンエリア */
	#cont_input .send_area {
		text-align: left;
		display: block;
	}

	#cont_input .send_area .agree_area_left {
		display: block;
		width: auto;
	}

	.agree_area_left > div {
		display: table;
		height: 100%;
		width: 100%;
	}

	.agree_area_left > div > div {
		display: table-cell;
		vertical-align: middle;
	}

	.agree_area_left input[type="checkbox"] {
		margin: 0px 5px 0px 10px;
	}

	#cont_input .send_area .agree_area_right {
		display: block;
		padding-left: 0px;
	}

	#cont_input .next_btn {
		margin-top: 10px;
		width: 100%;
	}

	/* フッターエリア */
	#cont_input .fotter_area .end_btn {
		float: none;
		width: 100%;
	}

	#cont_input .fotter_area {
		padding-top: 25px;
		margin-top: 10px;
	}

	#cont_input .fotter_area .policy {
		border-top: #dcdcdc solid 1px;
		margin-top: 10px;
		padding-top: 10px
	}

	#cont_input .fotter_area .policy .logo {
		float: left;
		margin-right: 5px;
	}

	#cont_input .fotter_area .policy .logo img {
		width: 50px;
	}

	#cont_input .fotter_area .policy .txt {
		line-height: 0.8;
	}

	/* 免許証読み取りボタンエリア */
	.license_read_area .license_read_btn_area {
		display: block;
		padding-right: 0px;
		margin-bottom: 10px;
	}

	.license_read_area .license_read_text_area {
		display: inline-block;
	}
}