@charset "utf-8";
/*======================================
一級建築士定期講習
========================================*/
.font_sub{
	color: var(--sub_color);
}

/*--------------------
申し込みフォーム
--------------------*/
.form_area{
	width: 94%;
	max-width: 1000px;
	margin: 0 auto;
	padding: 100px 0;
}

.form_section{
	font-size: clamp(1.2rem,1.6vw,1.6rem);
	line-height: 1.5;
	margin-top: 2em;
}

table th,
table td{
	vertical-align: middle;
}
table th{
	padding: 0.5em;
}
table th.base_th{
	width: 9em;
	border-right: solid 2px #000;
	background-color: #f2f2f2;
}

table td{
	padding: 0.25em;
}
table td .td50{
	display: inline-block;
	width: 50%;
}
table td .td50:first-of-type{
	padding-right: 0.25em;
	border-right: solid 2px #000;
}
table td .td50:last-of-type{
	padding-left: 0.25em;
}

table td input[type="text"],
table td input[type="email"]{
	width: 100%;
	padding: 0.25em;
}

input[type="radio"],
input[type="checkbox"]{
	appearance: none;
	transform: translateY(0.15em);
	position: relative;
}
input[type="radio"]::before,
input[type="checkbox"]::before{
	content: '';
	display: inline-block;
	line-height: 1;
	width: 1em;
	height: 1em;
	border: solid 1px #000;
	border-radius: 0.25em;
	cursor: pointer;
}
input[type="radio"]:checked::before,
input[type="checkbox"]:checked::before{
	background-color: #efefef;
}
input[type="radio"]:checked::after,
input[type="checkbox"]:checked::after{
	content: '\2713';/*チェックマーク文字コード*/
	display: inline-flex;
	justify-content: center;
	align-items: center;
	font-weight: bold;
	color: var(--main_color);
	width: 1em;
	height: 1em;
	border: solid 1px transparent;
	position: absolute;
	top: 0;
	left: 0;
}

.icon_check{
	display: inline-flex;
	justify-content: center;
	align-items: center;
	font-weight: bold;
	color: var(--main_color);
	text-indent: 0;
	width: 1.2em;
	height: 1.2em;
	margin: 0 0.25em;
	padding: 0;
	border: solid 1px #000;
	border-radius: 0.25em;
	background-color: #efefef;
}

table td select{
	padding: 0.25em;
}


.ttl_type01{
	font-weight: bold;
	margin-bottom: 0.5em;
}

/*****
ヘッダー
*****/
.ttl_form{
	font-size: clamp(1.2rem,2.4vw,2.4rem);
	font-weight: bold;
	text-align: center;
	color: #fff;
	margin: 0.5em 0 1em 0;
	padding: 0.5em 1em;
	background-color: var(--main_color);
}

/*****
リード部分
*****/
.lead_section{
	font-size: clamp(1.2rem,1.5vw,1.5rem);
	line-height: 1.5;
	margin-bottom: 1em;
}
.lead_indent{
	text-indent: -1.5em;
	padding-left: 1.5em;
}
.lead_indent::before{
	content: '';
	display: inline-block;
	vertical-align: text-bottom;
	width: 1em;
	height: 1em;
	margin-right: 0.5em;
	background-color: #000;
}

.sub_btn{
	/*font-weight: bold;*/
	text-align: center;
}
.sub_btn a{
	display: flex;
	justify-content: center;
	color: #fff;
	padding: 0.5em 1em;
	border-radius: 0.5em;
	background-color: var(--subbtn_color);
}

/*****
JIA会員情報
*****/
.jia_groupe{
	text-align: right;
	padding: 0.5em;
	border: solid 4px var(--main_color);
}
.jia_groupe p:first-of-type{
	margin-bottom: 0.5em;
}
.jia_com_tbl{
	border: solid 4px var(--main_color);
}
.jia_com_tbl th{
	border-right: solid 2px #000;
}
.jia_com_tbl th:first-of-type,
.jia_com_tbl td:first-of-type{
	border-bottom: solid 2px #000;
}

/*****
個人情報同意
*****/
.privacy_section{}
.note_aka_waku{
	font-size: 1.25em;
	font-weight: bold;
	color: var(--main_color);
}
.privacy_area{
	text-align: center;
}
.privacy_area .privacy_btn{}

/*****
氏名 生年月日
*****/
.name_area{}
.name_tbl{
	width: 100%;
	border-top: solid 4px var(--main_color);
	border-left: solid 4px var(--main_color);
	border-right: solid 4px var(--main_color);
}
.name_tbl th,
.name_tbl td{
	border-bottom: solid 2px #000;
}
.name_tbl td:first-of-type{
	border-right: solid 2px #000;
}
#name01,
#name02{
	width: calc(100% - 2em);
}

.birthsex_area{}
.birth_tbl{
	border-left: solid 4px var(--main_color);
}
.birth_tbl #yy{
	text-align: right;
	width: 4.5em;
	margin: 0 0.5em;
}
.birth_tbl #mm,
.birth_tbl #dd{
	text-align: right;
	width: 2.5em;
	margin: 0 0.5em 0 1em;
}

.sex_tbl{
	border-bottom: solid 4px var(--main_color);
	border-right: solid 4px var(--main_color);
}
.sex_tbl td{
	text-align: center;
}
.sex_tbl td:first-of-type{
	border-right: solid 2px #000;
}

.tantoh_code_area{}
.tantoh_code_tbl{
	margin: 0.5em 0;
	border: solid 2px #000;
}

/*****
住所 連絡先
*****/
.address_tbl{
	width: 100%;
}

.address_tbl .base_th{}
.post_td{}
.address_tbl #post_num01,
.address_tbl #send_post_num01{
	width: 3em;
}
.address_tbl #post_num02,
.address_tbl #send_post_num02{
	width: 4em;
}

.post_td_note{}

.address_detail{
	padding: 0;
}
.address_detail .td_bef,
.address_detail .td_aft{}
.address_detail .td_bef p,
.address_detail .td_aft p{
	padding: 0.25em;
}

.flex_tbl_area{}
.tellnum_tbl{}
.tellnum_tbl #tell01,
.tellnum_tbl #tell02,
.tellnum_tbl #tell03,
.tellnum_tbl #send_tell01,
.tellnum_tbl #send_tell02,
.tellnum_tbl #send_tell03{
	width: 4em;
}

.spnum_tbl{}
.spnum_tbl #spnum01,
.spnum_tbl #spnum02,
.spnum_tbl #spnum03{
	width: 4em;
}

.email_tbl{
	width: 100%;
}

.work_tbl,
.department_tbl{
	border: solid 4px #000;
}
.work_tbl{}
.department_tbl{}

.work_tbl th,
.work_tbl td,
.department_tbl th,
.department_tbl td{
	border-bottom: solid 2px #000;
}

.atena_tbl{
	width: 100%;
	border: solid 4px var(--main_color);
}

.atena_other_td input[type="text"]{}

/*****
送付先
*****/
.send_add_tbl{
	width: 100%;
	border: solid 4px var(--main_color);
}
.send_add_tbl td{
	border-right: solid 2px #000;
}

.faxnum_tbl #faxnum01,
.faxnum_tbl #faxnum02,
.faxnum_tbl #faxnum03{
	width: 4em;
}

.sent_note{
	color: var(--sub_color);
	margin-top: 0.5em;
}

/*****
講習日程 会場
*****/
.ttl_date_area{
	margin-bottom: 0.5em;
}

.date_place_tbl{
	width: 100%;
	border: solid 4px var(--main_color);
}
.date_place_tbl th,
.date_place_tbl td{
	border-bottom: solid 2px #000;
	border-right: solid 2px #000;
}

.date_place_tbl .th_online{
	border-bottom-width: 3px;
}
.date_place_tbl .th_date,
.date_place_tbl .th_place{
	background-color: #f2f2f2;
}
.date_place_tbl .th_date{}
.date_place_tbl .th_place{}


#date_yy,
#date_yy02{
	text-align: right;
	width: 4.5em;
	margin: 0 0.5em 0 0;
}
#date_mm,
#date_mm02,
#date_dd,
#date_dd02{
	text-align: right;
	width: 2.5em;
	margin: 0 0.5em 0 1em;
}

#place01,
#place02{
	width: 80%;
	margin-right: 0.5em;
}

.date_note{}

/*****
免許証の登録情報
*****/
.license_tbl{
	width: 100%;
	border: solid 4px var(--main_color);
}
.license_tbl th{
	border-bottom: solid 2px #000;
}
.license_tbl td{
	border-bottom: solid 2px #000;
	border-left: solid 2px #000;
}
.th_prefecture,
.th_license,
.th_year{
	border-left: solid 2px #000;
	background-color: #f2f2f2;
}
.th_prefecture{
	width: 20%;
}
.th_license{
	width: 25%;
}
.th_year{}

.tr_license1q{}

#yy_1q,
#yy_2q,
#yy_mo{
	text-align: right;
	width: 4.5em;
	margin: 0 0.5em 0 0;
}
#mm_1q,
#mm_2q,
#mm_mo,
#dd_1q,
#dd_2q,
#dd_mo{
	text-align: right;
	width: 2.5em;
	margin: 0 0.5em 0 1em;
}

/*****
提出物
*****/
.attach_wrap{}
.attach_area{}

.attach_tbl{
	width: 100%;
	border: solid 4px var(--main_color);
}

.yuso_area{
	margin: 0.5em 0;
	padding: 0.5em;
	border: solid 1px #bcbcbc;
}
.bank_area{
	margin: 0.5em 0;
	padding: 0.5em;
	border: solid 1px #bcbcbc;
}

.cpd_area{}
.cpd_code_tbl{
	width: 100%;
	margin: 0.5em 0 1em 0;
	border: solid 4px #000;
}
.mypage_check_area{
	padding: 0.5em;
	border: solid 4px var(--main_color);
}
.mypage_note{
	font-size: 0.85em;
}

.ttl_5{
	font-size: 1.25em;
	font-weight: bold;
	color: var(--main_color);
	text-indent: -1em;
	margin: 1em 0 0 0;
	padding-left: 1em;
}

/*****
送信ボタン
*****/
.submit_area{
	font-size: clamp(1.2rem,1.6vw,1.6rem);
	text-align: center;
	margin-top: 4em;
}
input[type="submit"]{
	font-size: 1.25em;
	font-weight: bold;
	color: var(--main_color);
	margin: 1em auto;
	padding: 1em;
	border: solid 2px var(--main_color);
	border-radius: 0.25em;
	background-color: #fff;
	box-shadow: 0 4px 2px 0 rgba(60,30,30,0.35);
	cursor: pointer;
	transition: background 0.5s, transform 0.5s;
}
input[type="submit"]:hover{
	background-color: #fffbd9;
	box-shadow: 0 0 0 0 transparent;
	transform: translateY(4px);
}


/*--------------------
メールアドレス確認画面
--------------------*/
.confirm_wrap{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100vh;
}
.confirm_area{
	font-size: clamp(1.2rem,1.6vw,1.6rem);
	line-height: 1.5;
	width: 94%;
	max-width: 640px;
	padding: 2em;
	border: solid 2px #858585;
	border-radius: 0.5em;
}

.email_confirm_tbl{
	width: 100%;
	margin-top: 0.5em;
	border: solid 4px var(--main_color);
}

/*****
入力確認画面
*****/
.ttl_confirm{
	font-size: clamp(1.6rem,3.2vw,3.2rem);
	font-weight: bold;
	text-align: center;
	color: var(--main_color);
	margin-bottom: 2em;
	padding: 0.5em;
	border: solid 1px var(--main_color);
}

.icon_nocheck{
	display: inline-flex;
	justify-content: center;
	align-items: center;
	font-weight: bold;
	text-indent: 0;
	width: 1.2em;
	height: 1.2em;
	margin: 0 0.25em;
	padding: 0;
	border: solid 1px #000;
	border-radius: 0.25em;
}


/* ===========================================
	MediaQueries
=========================================== */
/* スマホ----------------------------- */
@media screen and (max-width: 767px){
	/*--------------------
	申し込みフォーム
	--------------------*/
	/*****
	リード部分
	*****/
	/*****
	JIA会員情報
	*****/
	.jia_groupe{
		text-align: left;
	}
	
	.jia_com_tbl{
		width: 100%;
		margin-top: 1em;
	}
	
	/*****
	個人情報同意
	*****/
	.privacy_section{
		margin: 1em 0;
	}
	.privacy_area{
		width: 100%;
		margin-top: 1em;
		padding: 0.5em;
		border: solid 4px var(--main_color);
	}
	
	/*****
	氏名 生年月日
	*****/
	.birth_tbl{
		width: 100%;
		border-bottom: solid 2px #000;
		border-right: solid 4px var(--main_color);
	}
	
	.sex_tbl{
		width: 100%;
		border-left: solid 4px var(--main_color);
	}
	
	.tantoh_code_area{
		margin-top: 2em;
	}
	
	/*****
	住所 連絡先
	*****/
	.address_tbl{
		border: solid 4px var(--main_color);
		border-bottom: solid 2px #000;
	}
	.address_tbl th,
	.address_tbl td{
		display: block;
	}
	.address_tbl td{
		border-top: solid 2px #000;
	}
	.address_tbl .base_th{
		width: 100%;
		border-right: none;
	}
	
	.tellnum_tbl,
	.spnum_tbl{
		width: 100%;
		border-left: solid 4px var(--main_color);
		border-right: solid 4px var(--main_color);
	}
	.spnum_tbl{
		width: 100%;
		border-top: solid 2px #000;
		border-left: solid 4px var(--main_color);
		border-right: solid 4px var(--main_color);
	}
	.email_tbl{
		border: solid 4px var(--main_color);
		border-top: solid 2px #000;
	}
	
	.work_tbl{
		width: 100%;
	}
	.department_tbl{
		width: 100%;
		margin-top: 0.5em;
	}
	
	/*****
	送付先
	*****/
	.atena_tbl{}
	.atena_tbl th,
	.atena_tbl td{
		display: block;
	}
	.atena_tbl .base_th{
		width: 100%;
		border-right: none;
	}
	
	.atena_tbl td.atena_other_td{
		display: flex;
		align-items: center;
	}
	.atena_other_td label{
		flex-shrink: 0;
	}
	.atena_other_td input[type="text"]{
		flex-shrink: 1;
		flex-grow: 1;
		width: auto;
	}
	
	#send_address .address_tbl{
		border: solid 4px #000;
		border-bottom: solid 2px #000;
	}
	#send_address .tellnum_tbl{
		border-left: solid 4px #000;
		border-right: solid 4px #000;
	}
	
	.faxnum_tbl{
		width: 100%;
		border-top: solid 2px #000;
		border-bottom: solid 4px #000;
		border-left: solid 4px #000;
		border-right: solid 4px #000;
	}
	
	/*****
	講習日程 会場
	*****/
	.date_place_tbl{
		width: calc(100vw * 2);
		max-width: 640px;
	}
	
	/*****
	免許証の登録情報
	*****/
	.license_tbl{
		width: calc(100vw * 2);
		max-width: 640px;
	}
	.license_td_date{
		white-space: nowrap;
	}
	
	/*****
	提出物
	*****/
	.attach_tbl{}
	.attach_tbl td{
		display: block;
	}
	
	.cpd_area{
		margin-top: 2em;
	}
	
	/*****
	送信ボタン
	*****/
	.submit_area{}
	
	
	/*--------------------
	メールアドレス確認画面
	--------------------*/
	.confirm_area{
		padding: 1em 0.5em;
	}
	
	.email_confirm_tbl{}
	.email_confirm_tbl th,
	.email_confirm_tbl td{
		display: block;
	}
	.email_confirm_tbl th.base_th{
		width: 100%;
		border-bottom: solid 2px #000;
		border-right: none;
	}
	.email_confirm_tbl td{}
	
}

/* PC----------------------------- */
@media screen and (min-width: 768px){
	.flex_pc{
		display: flex;
	}
	
	/*--------------------
	申し込みフォーム
	--------------------*/
	/*table th.base_th{
		width: 9em;
	}*/
	
	table td input[type="text"],
	table td input[type="email"]{
		border: none;
		background-color: #dde4ff;
	}
	
	/*****
	リード部分
	*****/
	.lead_section{
		display: flex;
		justify-content: space-between;
		flex-direction: row-reverse;
	}
	.sub_btn{
		flex-shrink: 0;
		margin-left: 0.5em;
	}
	
	/*****
	JIA会員情報
	*****/
	.jia_groupe_area{
		display: flex;
		align-items: flex-start;
		width: 80%;
	}
	
	.jia_groupe{
		flex-shrink: 0;
	}
	
	.jia_com_tbl{
		flex-grow: 1;
		margin-left: 1em;
	}
	.jia_com_tbl th{
		width: 8em;
	}
	
	/*****
	個人情報同意
	*****/
	.privacy_section{
		/*display: flex;*/
		width: 80%;
	}
	.note_aka_waku{
		/*flex-shrink: 0;*/
		padding: 0.5em 0;
	}
	.privacy_area{
		/*flex-grow: 1;
		margin-left: 1em;*/
		width: 58%;
		margin: 0 0 0 auto;
		padding: 1em 0.5em;
		border-left: solid 4px var(--main_color);
		border-right: solid 4px var(--main_color);
		position: relative;
	}
	.privacy_area .privacy_btn{
		width: 36%;
		position: absolute;
		top: 50%;
		left: calc(100% + 2em);
		transform: translateY(-50%);
	}
	
	/*****
	氏名 生年月日
	*****/
	.name_area_wrap{
		display: flex;
		align-items: flex-end;
	}
	
	.name_area{
		flex-shrink: 0;
		width: 80%;
		margin: -2.1em 0.5em 0 0;
	}
	.name_tbl tr td:first-of-type{
		width: 41.5%;
	}
	
	.birthsex_area{
		display: flex;
	}
	.birth_tbl{
		width: 65%;
		border-bottom: solid 4px var(--main_color);
		border-right: solid 2px #000;
	}
	.sex_tbl{
		flex-grow: 1;
	}
	
	.tantoh_code_area{
		flex-grow: 1;
		font-size: 0.8em;
	}
	
	/*****
	住所 連絡先
	*****/
	.address_tbl{
		border-bottom: solid 2px #000;
		border-left: solid 4px var(--main_color);
	}
	
	.address_tbl .base_th{
		border-top: solid 4px var(--main_color);
	}
	.post_td{
		width: 20%;
		border-top: solid 4px var(--main_color);
		border-bottom: solid 2px #000;
		border-right: solid 4px var(--main_color);
	}
	
	.post_td_note{
		text-align: right;
		border-bottom: solid 4px var(--main_color);
	}
	
	.address_detail{
		border-right: solid 4px var(--main_color);
	}
	.address_detail .td_bef,
	.address_detail .td_aft{
		float: left;
		border-right: solid 2px #000;
	}
	.address_detail .td_bef{
		width: 20%;
	}
	.address_detail .td_aft{
		width: 30%;
	}
	.address_detail .td_aft:last-of-type{
		border-right: none;
	}
	
	.address_detail .td_bef p:first-of-type,
	.address_detail .td_aft p:first-of-type{
		border-bottom: solid 2px #000;
	}
	
	.flex_tbl_area{
		display: flex;
	}
	.tellnum_tbl{
		width: 50%;
		border-bottom: solid 2px #000;
		border-left: solid 4px var(--main_color);
	}
	.spnum_tbl{
		width: 50%;
		border-bottom: solid 2px #000;
		border-left: solid 2px #000;
		border-right: solid 4px var(--main_color);
	}
	
	.email_tbl{
		border-bottom: solid 4px var(--main_color);
		border-left: solid 4px var(--main_color);
		border-right: solid 4px var(--main_color);
	}
	
	.work_tbl{
		width: 60%;
		border-right: none;
	}
	.department_tbl{
		width: 40%;
		border-left-width: 2px;
	}
	
	.atena_tbl td{
		border-right: solid 2px #000;
	}
	.atena_name_td{
		width: 6em;
	}
	.atena_work_td{
		width: 8em;
	}
	.atena_both_td{
		width: 11em;
	}
	.atena_other_td input[type="text"]{
		width: 20em;
	}
	
	/*****
	送付先
	*****/
	.send_add_tbl{}
	
	#send_address .address_tbl{
		border-left: solid 4px #000;
	}
	
	#send_address .address_tbl .base_th{
		border-top: solid 4px #000;
	}
	#send_address .post_td{
		border-top: solid 4px #000;
		border-right: solid 4px #000;
	}
	#send_address .post_td_note{
		border-bottom: solid 4px #000;
	}
	#send_address .address_detail{
		border-right: solid 4px #000;
	}
	#send_address .tellnum_tbl{
		border-bottom: solid 4px #000;
		border-left: solid 4px #000;
	}
	#send_address .faxnum_tbl{
		border-bottom: solid 4px #000;
		border-left: solid 2px #000;
		border-right: solid 4px #000;
	}
	
	.faxnum_tbl{
		width: 50%;
		border-left: solid 2px #000;
	}
	
	.sent_note{
		margin-left: 8em;
	}
	
	/*****
	講習日程 会場
	*****/
	.ttl_date_area{
		display: flex;
		justify-content: space-between;
		align-items: flex-end;
	}
	
	.date_note{
		text-align: right;
	}
	.date_note p{
		display: inline-block;
		margin-top: -4px;
		padding: 0.25em 0.5em;
		border-top: solid 2px #000;
		border-bottom: solid 4px var(--main_color);
		border-left: solid 4px var(--main_color);
		border-right: solid 4px var(--main_color);
		background-color: #fff;
	}
	
	/*****
	免許証の登録情報
	*****/
	/*****
	提出物
	*****/
	.attach_wrap{
		display: flex;
		justify-content: space-between;
	}
	
	.attach_area{
		flex-shrink: 0;
		width: 65%;
		margin-right: 1em;
	}
	
	.attach_tbl td:first-of-type{
		border-right: solid 2px #000;
	}
	
	.yuso_area{
		flex-shrink: 0;
		width: 65%;
		margin-right: 0.5em;
	}
	.bank_area{
		flex-grow: 1;
	}
	
	.cpd_area{
		flex-grow: 1;
	}
	
	.cpd_code_tbl{}
	
	.mypage_check_area{
		display: inline-block;
	}
	.mypage_note{
		display: inline-block;
		padding: 0 0 0.5em 1.5em;
	}
	
	/*****
	送信ボタン
	*****/
	.submit_area{
		display: flex;
		justify-content: space-around;
	}
	
	
	/*--------------------
	メールアドレス確認画面
	--------------------*/
	.email_confirm_tbl td{
		border-bottom: solid 2px #000;
	}
}