/* Header 20241217 */
@keyframes anm_appear {
	0%{ opacity: 0; }
	100%{ opacity: 1; }
 }
#Header { margin-top: 60px; }
#Header * { box-sizing: border-box; }
#Header .inWrap {
	max-width: 1240px;
	margin: auto;
}
#Header .acdCHK { display: none; }
.hdNav {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	padding: 0 10px;
	background-color: #fff;
	z-index: 9999;
}
.hdNav .inWrap {
	position: relative;
	display: flex;
	gap: 10px;
	height: 60px;
}
.hdNav_Logo {
	flex: 1 1 auto;
	display: flex;
	align-items: center;
	gap: 0px 10px;
}
.hdNav_Logo::before {
	content: "";
	width: 203px;
	height: 40px;
	background: url('../imgs/header2412/logo.svg') no-repeat left center;
}
.hdNav_Logo::after {
	content: "";
	width: 140px;
	height: 13px;
	background: url('../imgs/header2412/code.svg') no-repeat right center;
}
/*hdNav_Logo_SP*/
@media screen and (max-width: 560px) {
	.hdNav .inWrap { justify-content: space-between; }
	.hdNav_Logo {
		flex-direction: column;
		justify-content: center;
		align-items: flex-end;
		max-width: 203px;
	}
	.hdNav_Logo::before,
	.hdNav_Logo::after {
		width: 100%;
		background-size: contain;
	}
}
.hdNav_Btn {
	display: flex;
	gap: 5px;
}
.hdNav_Btn > * {
	width: 50px;
	background-repeat: no-repeat;
	background-position: center center;
}
.hdNav_Btn .inLogin { background-image: url('../imgs/header2412/ico_login.svg'); }
.hdNav_Btn .inShop { background-image: url('../imgs/header2412/ico_shop.svg'); }
.hdNav_Btn .inMenu { background-image: url('../imgs/header2412/ico_menu.svg'); }
#hdMenu_CHK:checked ~ .hdNav .hdNav_Btn .inMenu { background-image: url('../imgs/header2412/ico_menux.svg'); }
.hdNav .acdCHK:not(:checked) + .hdNav_Login { display: none; }
.hdNav_Login {
	position: fixed;
	top: 100px;
	left: 0;
	right: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
	width: 100%;
	max-width: 370px;
	margin: auto;
	padding: 20px;
	background-color: rgba(255,255,255,.5);
	animation: anm_appear .3s ease;
	z-index: 9999;
}
.hdNav_Login > a {
	display: block;
	background-color: #fff;
	background-repeat: no-repeat;
	background-position: center center;
	border: #004DA0 3px solid;
	border-radius: 10px;
}
.hdNav_Login > a::before {
	content: "";
	display: block;
	padding-top: 39.28%;
}
.hdNav_Login .inKojin { background-image: url("../imgs/topArea/2602/login_btn_kojin.png"); }
.hdNav_Login .inSmart { background-image: url("../imgs/topArea/2602/login_btn_smart.png"); }
.hdNav_Login .inBiz { background-image: url("../imgs/topArea/2602/login_btn_biz.png"); }
@media screen and (max-width: 767px) {
	.pgKojin .hdNav_Login .inBiz,
	.pgHoujin .hdNav_Login .inKojin { display: none; }
	.hdNav_Login .inKojin { order: 3; }
	.hdNav_Login .inSmart { order: 2; }
	.hdNav_Login .inBiz { order: 1; }
}
/*hdNav_PC*/
@media screen and (min-width: 1070px) {
	#Header {
		margin-top: 105px;
		font-size: 1.6rem;
	}
	#Header.pgKojin { margin-top: 190px; }
	#Header.pgHoujin { margin-top: 170px; }
	.hdNav_Link {
		display: flex;
		gap: 10px;
	}
	.hdNav_Link > * {
		display: flex;
		align-items: center;
	}
	.hdNav_Search {
		display: flex;
		flex-direction: row;
		height: 35px;
		margin: auto 0;
		background-color: #eee;
	}
	.hdNav_Search input[type="text"] {
		width: 150px;
		padding: 0 5px;
		background-color: transparent;
	}
	.hdNav_Search input[type="submit"] {
		width: 35px;
		background: #eee url('../imgs/header2412/search.svg') no-repeat center center;
		cursor: pointer;
	}
	.hdNav_Btn .inShop,
	.hdNav_Btn .inMenu { display: none; }
	.hdNav_Btn .inLogin {
		width: 140px;
		height: 35px;
		margin: auto;
		background-color: #2c4b91;
		background-image: url('../imgs/header2412/login_pc.svg');
		cursor: pointer;
	}
	.hdMenu {
		position: fixed;
		top: 60px;
		left: 0;
		right: 0;
		z-index: 9998;
	}
	.hdMenu_Search,
	.hdMenu_SP,
	.hdMenu_Info,
	.hdMenu_Close { display: none; }
	.hdMenu_Link,
	.hdMenu_Acd {
		position: relative;
		display: flex;
		width: 100%;
		z-index: 9997;
	}
	.hdMenu_Link > *,
	.hdMenu_Acd > * { z-index: 9996; }
	.hdMenu_Link::before,
	.hdMenu_Acd::before {
		content: "";
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		width: 100vw;
		margin: auto calc(50% - 50vw);
		z-index: 9995;
	}
	.hdMenu_Link::before { background-color: #2c4b91; }
	.hdMenu_Acd::before { background-color: #d6eafa; }
	.hdMenu_Link {
		justify-content: center;
		height: 55px;
		gap: 3.0em;
	}
	.hdMenu_Link > * {
		display: flex;
		flex-direction: column;
		justify-content: center;
		font-weight: bold;
		color: #fff;
	}
	.pgKojin .hdMenu_Link_Kojin::after,
	.pgHoujin .hdMenu_Link_Houjin::after,
	.pgKabunushi .hdMenu_Link_Kabunushi::after,
	.pgRecruit .hdMenu_Link_Recruit::after,
	.pgInfo .hdMenu_Link_Info::after {
		content: "";
		width: 100%;
		height: 3px;
		background-color: #00bfff;
    }
	.hdMenu_Acd .inGrp { width: 25%; }
	.hdMenu_Acd > li > .inLabel {
		position: relative;
		display: block;
		height: 55px;
		background-color: transparent;
		background-repeat: no-repeat;
		background-position: center center;
		font-size: 0;
		cursor: pointer;
	}
	.hdMenu_Acd > li > .inLabel::before,
	.hdMenu_Acd > li:last-of-type > .inLabel::after {
		content: "";
		position: absolute;
		top: 0;
		bottom: 0;
		width: 3px;
		height: 80%;
		margin: auto;
		background-color: #fff;
	}
	.hdMenu_Acd > li > .inLabel::before { left: -1.5px; }
	.hdMenu_Acd > li:last-of-type > .inLabel::after { right: 1.5px; }
	.hdMenu_Acd_Tameru .inLabel { background-image: url('../imgs/header2412/kojin/menu1.png'); }
	.hdMenu_Acd_Huyasu .inLabel { background-image: url('../imgs/header2412/kojin/menu2.png'); }
	.hdMenu_Acd_Kariru .inLabel { background-image: url('../imgs/header2412/kojin/menu3.png'); }
	.hdMenu_Acd_Use .inLabel { background-image: url('../imgs/header2412/kojin/menu4.png'); }
	.hdMenu_Acd_Account .inLabel { background-image: url('../imgs/header2412/kojin/menu5.png'); }
	.hdMenu_Acd_Start .inLabel { background-image: url('../imgs/header2412/Houjin/menu1.png'); }
	.hdMenu_Acd_Succession .inLabel { background-image: url('../imgs/header2412/Houjin/menu2.png'); }
	.hdMenu_Acd_Matching .inLabel { background-image: url('../imgs/header2412/Houjin/menu3.png'); }
	.hdMenu_Acd_introduction .inLabel { background-image: url('../imgs/header2412/Houjin/menu6.png'); }
	.hdMenu_Acd_Support .inLabel { background-image: url('../imgs/header2412/Houjin/menu4.png'); }
	.hdMenu_Acd_Service .inLabel { background-image: url('../imgs/header2412/Houjin/menu5.png'); }
	.hdMenu_Acd .acdCHK:checked ~ .inLabel { background-color: #375d92; }
	.hdMenu_Acd_Tameru .acdCHK:checked ~ .inLabel { background-image: url('../imgs/header2412/kojin/menu1on.png'); }
	.hdMenu_Acd_Huyasu .acdCHK:checked ~ .inLabel { background-image: url('../imgs/header2412/kojin/menu2on.png'); }
	.hdMenu_Acd_Kariru .acdCHK:checked ~ .inLabel { background-image: url('../imgs/header2412/kojin/menu3on.png'); }
	.hdMenu_Acd_Use .acdCHK:checked ~ .inLabel { background-image: url('../imgs/header2412/kojin/menu4on.png'); }
	.hdMenu_Acd_Service .acdCHK:checked ~ .inLabel { background-image: url('../imgs/header2412/Houjin/menu5on.png'); }
	.hdMenu_Acd .acdCHK:not(:checked) ~ .inMenu { display: none; }
	.hdMenu_Acd .inMenu {
		position: absolute;
		top: 55px;
		left: 0;
		right: 0;
		width: 100vw;
		margin: 0 calc(50% - 50vw);
		padding: 20px 10px 30px;
		background-color: rgba(55,93,146,.95);
		color: #fff;
		animation: anm_appear .3s ease;
		z-index: 10;
	}
 	.hdMenu_Acd .inMenu .inNav {
		display: flex;
 		padding-bottom: 20px;
 	}
	.hdMenu_Acd .inMenu .inNav .btnTop {
		flex: 1 1 auto;
		display: flex;
		align-items: center;
		gap: 10px;
	}
	.hdMenu_Acd .inMenu .inNav .btnTop span { border-bottom: 2px solid #fff; }
	.hdMenu_Acd .inMenu .inNav .btnTop::before {
		content: "";
		width: 34px;
		height: 34px;
	}
	#hdMenu_Acd_Tameru ~ .inMenu .inNav .btnTop::before { content: url('../imgs/header2412/kojin/ico_tameru.png'); }
	#hdMenu_Acd_Huyasu ~ .inMenu .inNav .btnTop::before { content: url('../imgs/header2412/kojin/ico_huyasu.png'); }
	#hdMenu_Acd_Kariru ~ .inMenu .inNav .btnTop::before { content: url('../imgs/header2412/kojin/ico_kariru.png'); }
	#hdMenu_Acd_Service ~ .inMenu .inNav .btnTop::before { content: url('../imgs/header2412/kojin/ico_service.png'); }
	.hdMenu_Acd .inMenu .inNav .btnClose {
		position: relative;
		display: blocks;
		width: 34px;
		height: 34px;
		margin: 0 0 0 auto;
		border: 2px solid #FFF;
		border-radius: 50%;
		transition: all .3s ease-in-out;
		cursor: pointer;
	}
	.hdMenu_Acd .inMenu .inNav .btnClose:hover { background-color: #FFF; }
	.hdMenu_Acd .inMenu .inNav .btnClose::before,
	.hdMenu_Acd .inMenu .inNav .btnClose::after {
		content: "";
		display: block;
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		height: 2px;
		width: 16px;
		margin: auto;
		background-color: #FFF;
		transition: all .3s ease-in-out;
	}
	.hdMenu_Acd .inMenu .inNav .btnClose::before { transform: translateY(-50%) rotate(45deg); }
	.hdMenu_Acd .inMenu .inNav .btnClose::after { transform: translateY(-50%) rotate(-45deg); }
	.hdMenu_Acd .inMenu .inNav .btnClose:hover::before,
	.hdMenu_Acd .inMenu .inNav .btnClose:hover::after { background-color: #0066aa; }
	.hdMenu_Acd .inMenu .inLink {
		display: flex;
		flex-wrap: wrap;
		gap: 16px;
	}
	.hdMenu_Acd .inMenu .inLink a {
		display: flex;
		flex-wrap: wrap; 
		justify-content: center;
		align-items: center;
		width: calc(25% - 12px);
		min-height: 4em;
		padding: 5px;
		border: 2px solid #fff;
		transition: all .3s ease-in-out;
	}
	.hdMenu_Acd .inMenu .inLink a:hover {
		background-color: #FFF;
		color: #0066aa;
	}
}
/*hdNav_SP*/
@media screen and (max-width: 1069px) {
	.hdNav_Link,
	.hdNav_Search { display: none; }
	.hdMenu {
		position: fixed;
		top: 60px;
		bottom: 0;
		left: 0;
		display: none;
		flex-direction: column;
		justify-content: flex-start;
		width: 100%;
		background-color: #fff;
		font-size: 19px;
		font-weight: 600;
		overflow-y: scroll;
		z-index: 999;
		transition: 0.53s transform;
	}
	#hdMenu_CHK:checked ~ .hdMenu { display: flex; }
	.hdMenu_Search { order: 1; }
	.hdMenu_SP { order: 2; }
	.hdMenu_Acd { order: 3; }
	.hdMenu_Link { order: 4; }
	.hdMenu_Info { order: 5; }
	.hdMenu_Close { order: 6; }
	.hdMenu_Search {
		display: flex;
		flex-direction: row;
		padding: 10px 10px;
		background-color: #eee;
	}
	.hdMenu_Search input[type="text"] {
		flex: 1 1 auto;
		padding: 10px 5px;
		background-color: #fff;
		line-height: normal;
	}
	.hdMenu_Search input[type="submit"] {
		width: 40px;
		background: #fff url('../imgs/header2412/search.svg') no-repeat center center;
		background-size: contain;
	}
	.hdMenu_SP,
	.hdMenu_Link {
		width: 100%;
		background-color: #0077bb;
		color: #fff;
	}
	.hdMenu_SP > *,
	.hdMenu_Link > a {
		position: relative;
		display: flex;
		align-items: center;
		min-height: 60px;
		padding-left: 15px;
		border-top: 1px solid rgba(255,255,255,1);
	}
	.hdMenu_SP a::after,
	.hdMenu_Link > a::after {
		content: "";
		position: absolute;
		top: 0;
		bottom: 0;
		right: 15px;
		width: .5em;
		height: .5em;
		margin: auto;
		border-right: 2px solid #fff;
		border-bottom: 2px solid #fff;
		transform: rotate(-45deg) translate(-50%,-50%);
	}
	.pgKojin .hdMenu_Link .hdMenu_Link_Kojin,
	.pgHoujin .hdMenu_Link .hdMenu_Link_Houjin { display: none; }
	.hdMenu_Acd {
		padding: 0px 10px 10px;
		background-color: #fff;
		transition: all .5s ease-out;
	}
	#hdMenu_Acd_CHK:not(:checked) ~ .hdMenu_Acd {
		height: 0;
		padding: 0 10px;
		overflow: hidden;
	}
	.hdMenu_Acd .inSP > a,
	.hdMenu_Acd .inGrp > a,
	.hdMenu_Acd .inGrp > label {
		position: relative;
		display: flex;
		align-items: center;
		min-height: 60px;
		margin-top: 10px;
		padding-left: 50px;
		background-color: #ceebfb;
		background-repeat: no-repeat;
		background-position: left center;
		border-radius: 8px;
		color: #231815;
	}
	.pgHoujin .hdMenu_Acd .inSP > a,
	.pgHoujin .hdMenu_Acd .inGrp > a,
	.pgHoujin .hdMenu_Acd .inGrp > label {
		padding-left: 20px;
	}
	.hdMenu_Acd .inSP a::after,
	.hdMenu_Acd .inGrp > a::after {
		content: "";
		position: absolute;
		top: 0;
		bottom: 0;
		right: 15px;
		width: .5em;
		height: .5em;
		margin: auto;
		border-right: 2px solid #231815;
		border-bottom: 2px solid #231815;
		transform: rotate(-45deg) translate(-50%,-50%);
	}
	.hdMenu_Acd_Tameru > label { background-image: url('../imgs/header2412/kojin/icosp_tameru.png'); }
	.hdMenu_Acd_Huyasu > label { background-image: url('../imgs/header2412/kojin/icosp_huyasu.png'); }
	.hdMenu_Acd_Kariru > label { background-image: url('../imgs/header2412/kojin/icosp_kariru.png'); }
	.hdMenu_Acd_Service > label { background-image: url('../imgs/header2412/kojin/icosp_service.png'); }
	.hdMenu_Acd_Account > a { background-image: url('../imgs/header2412/kojin/icosp_account.png'); }
	.hdMenu_Acd .inGrp > label::before,
	.hdMenu_Acd .inGrp > label::after {
		content: "";
		position: absolute;
		top: 0;
		bottom: 0;
		right: 30px;
		margin: auto;
		width: 2px;
		height: 40%;
		background-color: #231815;
		transition: height .3s ease-in-out;
	}
	.hdMenu_Acd label::before { transform: rotate(-90deg); }
	.hdMenu_Acd .acdCHK:checked + label::after { height: 0; }
	.hdMenu_Acd .inMenu { transition: all .5s ease-out; }
	.hdMenu_Acd .acdCHK:not(:checked) ~ .inMenu {
		height: 0;
		overflow: hidden;
	}
	.hdMenu_Acd .inMenu .inNav { display: none; }
	.hdMenu_Acd .inMenu .inLink {
		display: flex;
		flex-wrap: wrap;
		gap: 5px;
		padding-top: 10px;
	}
	.hdMenu_Acd .inMenu .inLink a {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		align-content: center;
		width: 100%;
		min-height: 60px;
		padding: 10px 5px;
		border: 2px solid #003a6f;
		color: #003a6f;
	}
	.hdMenu_Info {
		order: 5;
		display: flex;
		flex-wrap: wrap;
		gap: 10px;
		padding: 10px;
		font-size: .9em;
	}
	.hdMenu_Info a {
		position: relative;
		display: flex;
		align-items: center;
		width: calc(50% - 5px);
		min-height: 60px;
		padding: 5px 10px;
		border: 1px solid #126ba3;
		color: #126ba3;
	}
	.hdMenu_Info > a::after {
		content: "";
		position: absolute;
		top: 0;
		bottom: 0;
		right: 15px;
		width: .5em;
		height: .5em;
		margin: auto;
		border-right: 2px solid #126ba3;
		border-bottom: 2px solid #126ba3;
		transform: rotate(-45deg) translate(-50%,-50%);
	}
	.hdMenu_Close {
		flex: 1 1 auto;
		display: flex;
		justify-content: center;
		align-items: flex-end;
		padding: 20px;
	}
	.hdMenu_Close label {
		position: relative;
		padding: 10px 10px 10px 2.0em;
		background-color: #333;
		border-radius: 6px;
		color: #fff;
	}
	.hdMenu_Close label::before,
	.hdMenu_Close label::after {
		content: "";
		position: absolute;
		top: 0;
		bottom: 0;
		left: 1.0em;
		display: block;
		width: 2px;
		height: 45%;
		margin: auto;
		background: #FFF;
		transform: rotate(-45deg);
	}
	.hdMenu_Close label::after { transform: rotate(45deg); }
}