@charset "utf-8";
/*ALL*/
html{
	width: 100%;
}

body{
	/*グリッドデザイン*/
	/*width: 100%;
	background-color: #ffffff;
	background-image: repeating-linear-gradient( 0deg, #ffffff00, #ffffff00 30px, #fffaea 30px, #fffaea 32px),
	repeating-linear-gradient( 90deg, #ffffff00, #ffffff00 30px, #fffaea 30px, #fffaea 32px);*/
	
	/*水玉デザイン*/
	width: 100%;
    background-color: #f0f0f0; /*#ffffff*/
    background-image: radial-gradient(#eaeaea 2px, transparent 3px);
    background-size: 20px 20px;
}
/*フッター下部固定用調整*/
body{
	
	display:flex;
	flex-direction:column;
	min-height: 100vh;
}
#main_block{
		flex: 1;
}
.inner{
	width: 100%;
	min-width: 320px;
	max-width: 1200px;
	height: 100%;
	margin: 0 auto;
}

a{
	width: 100%;
	height: 100%;
}

/*---------------↓header関係↓--------------*/
header{
	display: block;
	height: 80px;
	background-color: #ff9000;
}

#header_inner{
	display: flex;
}

#logo_container{
	height: 100%;
	width: 30%;
	padding-left: max(min(100px, calc(5% - 20px)), 5px);
	display: flex;
	align-items: center;
}

#h_nav{
	display: flex;
	align-items: center;
	width: 70%;
}

#LOGO{
	height: 70px;
	position: relative;
	z-index: 101;
}

.menu{
	width: 100%;
	display: flex;
	margin-top: 3px;
	justify-content: right;
}

.h_top_li{
	color: #ffffff;
	white-space: nowrap;
	font-size: 1.0rem;
	/*font-family: 'Zen Maru Gothic', sans-serif;*/
	font-family: 'Noto Sans Japanese', sans-serif;
}

#contact_li{
	margin-left: 15px;
	margin-right: 15px;
}

#contact_box{
	margin-top: 9px;
}

#contact{
	background-color: #ffffff;
	border-radius: 20px;
	padding-left: 5px;
	padding-right: 5px;
	padding-top: 3px;
	padding-bottom: 3px;
	color: #ff9000;
	white-space: nowrap;
	font-weight: bold;
	box-shadow: 0 3px 0 0 #ad7758;
	font-size: 1rem;
	/*font-family: 'Zen Maru Gothic', sans-serif;*/
	font-family: 'Noto Sans Japanese', sans-serif;
}

#contact:hover{
	color: #ff9100a8;
}


/*---------------プルダウン用-----------------*/
.menu {
	list-style-type:none;
}
.menu > li:not(:last-child) {
	display:inline-block;
	position:relative;
}
.menu > li > ul {
	display:none;
}

.menu p{
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	padding-right: 10px;
	text-align: center;
}
.h_top_li:nth-child(3){
	margin-right: 13px;
}

.h_top_li:nth-child(2){
	margin-right: -5px;
}
.h_top_li:nth-child(1){
	margin-right: -25px;
}

.h_top_li:nth-child( -n + 2 ) p{
	padding-left: 30px;
	padding-right: 30px;
}

.h_top_li:hover ul {
	display:block;
	position:absolute; 
	padding-top: 21px; /*30px*/
	z-index: 49;
	top: 2.3em;
	list-style-type:none;
	background-color: #ff9000;
}

.child_li a{
	display: block;
}

.child_li:hover{
	background-color: #ffbb00;
}

.htop_p::after {
	background-color: #ff9000; /* 線の色 */
	border-radius: 5px; /* 線の両端を丸く */
	bottom: 0px; /* 線の位置 */
	content: "";
	height: 3px; /* 線の高さ */
	left: 50%; /* 線の中央寄せ */
	position: absolute;
	transform: translateX(-50%); /* 線の中央寄せ */
	width: 30px; /* 線の長さ */
}

.htop_p:hover::after {
	background-color: #ffffff; /* 線の色 */
	border-radius: 5px; /* 線の両端を丸く */
	bottom: 0px; /* 線の位置 */
	content: "";
	height: 3px; /* 線の高さ */
	left: 50%; /* 線の中央寄せ */
	position: absolute;
	z-index: 50;
	transform: translateX(-50%); /* 線の中央寄せ */
	width: 30px; /* 線の長さ */
}

/*------------共通メニュー設定項-----------*/
@media screen and (max-width: 830px) {
	#h_nav{
		display: none;
	}
}

@media screen and (min-width: 831px) {
	#hamburger_box{
		display: none;
	}
}

/*---------------ハンバーガーメニュー-----------------*/
#hamburger_box{
	justify-content: right;
	margin-left: calc( calc( 100% - 80px ) - 30%);
}

/* チェックボックスを非表示にする */
.drawer_hidden {
	display: none;
}
  
  /* ハンバーガーアイコンの設置スペース */
.drawer_open {
	display: flex;
	height: 80px;
	width: 80px; 
	justify-content: center;
	align-items: center;
	position: relative;
	z-index: 100;/* 重なり順を一番上にする */
	cursor: pointer;
}
  
  /* ハンバーガーメニューのアイコン */
.drawer_open span,
.drawer_open span:before,
.drawer_open span:after {
	content: '';
	display: block;
	height: 4px; /*6px*/
	width: 30px; /*50px*/
	border-radius: 3px;
	background: #ffffff;
	transition: 0.5s;
	position: absolute;
}
  
  /* 三本線の一番上の棒の位置調整 */
.drawer_open span:before {
	bottom: 15px;
}
  
  /* 三本線の一番下の棒の位置調整 */
.drawer_open span:after {
	top: 15px;
}
  
  /* アイコンがクリックされたら真ん中の線を透明にする */
#hamburger_checkbox:checked ~ .drawer_open span {
	background: rgba(255, 255, 255, 0);
}

  /* アイコンがクリックされたらアイコンが×印になるように上下の線を回転 */
#hamburger_checkbox:checked ~ .drawer_open span::before {
	bottom: 0;
	transform: rotate(45deg);
}
  
#hamburger_checkbox:checked ~ .drawer_open span::after {
	top: 0;
	transform: rotate(-45deg);
}

  /* メニューのデザイン*/
.nav_content {
	width: 100%;
	min-width: 320px;
	height: 100%;
	position: fixed;
	top: calc(-100% - 800px);
	left: 0; /* メニューを画面の外に飛ばす */
	z-index: 99;
	background: #fff;
	transition: .5s;
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior: contain;
}
@media screen and (max-width: 830px) {
	.fixed {
		width: 100%;
		height: 100%;
		position: fixed;
	}
}

@media screen and (min-width: 831px) {
	.fixed {
		width: 100%;
	}
}


  
/* アイコンがクリックされたらメニューを表示 */
#hamburger_checkbox:checked ~ .nav_content {
	top: 0;/* メニューを画面に入れる */
}

/*ハンバーガーメニュー用アコーディオンメニュー*/
.nav_content{
	background-color: #ff9100e7;
}
.aco_sum{
	padding-top: 15px;
	padding-bottom: 15px;
	margin-left: 30px;
	margin-right: 30px;
	font-size: 1.3rem; /*2.0rem*/
	user-select: none;
	cursor: pointer;
	list-style: none;
	display: flex;
	white-space: nowrap;
}
.aco_sum p{
	height: 100%;
	/*font-family: 'Zen Maru Gothic', sans-serif;*/
	font-family: 'Noto Sans Japanese', sans-serif;
}
.aco_sum:hover{
	background-color: #ffffff36;
}
details{
	list-style: none;
}
summary {
	list-style: none;
}
summary::-webkit-details-marker {/*これでsafari版のリストスタイル消えてくれるか？*/
	display: none;
}

.nav_content summary::after{
	margin: 0 auto;
	content: url(../../img/plus2.png);
	width: 30px;
	height: 30px;
	margin-left: max(5px, calc(100vw - 230px));
	display: inline-block;
}
.nav_content details[open] summary::after{
	content: url(../../img/minus2.png);
	margin-left: max(5px, calc(100vw - 230px));
}

.aco_li{
	font-size: 1.1rem; /*1.5rem*/
	color: #ffffff;
	padding-top:5px;
	padding-bottom:5px;
	padding-left: 40px;
	user-select: none;
	white-space: nowrap;
	/*font-family: 'Zen Maru Gothic', sans-serif;*/
	font-family: 'Noto Sans Japanese', sans-serif;
}
.aco_li:hover{
	background-color: #ffbb00; /*ffffff36*/
}

#det_1{
	margin-top: 100px;
}

.aco_sum{
	border-top: 2px solid #ffffff;
	color: #ffffff;
	/*font-family: 'Zen Maru Gothic', sans-serif;*/
	font-family: 'Noto Sans Japanese', sans-serif;
}

#last_sum{
	border-bottom: 2px solid #ffffff;
	margin-bottom: 30px;
	font-size: 1.3rem; /*2.0rem*/
}

#det_1,
#det_2{
	height: 60px; /*70px*/
	transition: .6s;
}
#det_1[open] {
	height: 220px;
}
#det_2[open]{
	height: 145px;
}
details{
	overflow: hidden;
}

@keyframes fadeIn {
	0% {
	  opacity: 0;
	  transform: translateY(-10px);
	}
	100% {
	  opacity: 1;
	  transform: none;
	 }
}


/*-------------↓メイン関係↓-------------------*/
#main_block{
	padding-top: 50px;
	display: block;
}

/*---会社概要---*/
@media screen and (max-width: 499px) {
	#recruit_form_box{
		width: 100%;
		margin: 0 auto;
	}
}
@media screen and (min-width: 500px) {
	#recruit_form_box{
		width: 90%;
		margin: 0 auto;
	}
}

#recruit_form_title{
	display: flex;
	position: relative;
}

#recruit_form_title::after{
	width: 70%;
	min-width: 290px;
	content: '';
	border-top: 2px dotted #000;
	top: 35px;
	position: absolute;
}

#recruit_form_tit_mark{
	margin-top: 3px; /*5px*/
	width:	25px;
	height:	25px;
	border-radius: 50%;
	background-color: #ff9000;
}

#recruit_form_title{
	font-size: 1.6rem;
	font-weight: bold;
	margin-left: 5%;
}

#recruit_form_title p{
	margin-left: 20px;
	/*font-family: 'Marcellus SC', serif;*/
	font-family: 'Noto Sans Japanese', sans-serif;
}
@media screen and (max-width: 499px) {
	#recruit_form_contents{
		width:96%;
		/* margin-left: 10%;
		margin-right: 10%; */
		margin: 0 auto;
		margin-top: 3%;
		margin-bottom: 40px;
		border: 1px solid #868686;
		border-radius: 10px; /*10px*/
		background-color: #ffffff;
		padding-left: 4%;
		padding-right: 4%;
		padding-top: 20px;
		padding-bottom: 20px;
	}
	
	.brithday{
		padding-left: 6%;
	}
	
	/* スタイル調整: デフォルトのプルダウン矢印を非表示にし、カスタム▽マークを表示 */
	select {
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		padding-right: 20px; /* 右側にスペースを確保 */
		background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="6" viewBox="0 0 10 6"><polygon points="0,0 10,0 5,6" fill="black"/></svg>') no-repeat right center;
		background-size: 12px; /* ▽のサイズを調整 */
	}

	/* さらに外観をカスタマイズする */
	label {
		margin-right: 10px;
	}
}
@media screen and (min-width: 500px) {
	#recruit_form_contents{
		width:80%;
		/* margin-left: 10%;
		margin-right: 10%; */
		margin: 0 auto;
		margin-top: 3%;
		margin-bottom: 40px;
		border: 1px solid #868686;
		border-radius: 10px; /*10px*/
		background-color: #ffffff;
		padding-left: 2%;
		padding-right: 2%;
		padding-top: 20px;
		padding-bottom: 20px;
	}
	
	.brithday{
		padding-left: 4%;
	}
	
	/* スタイル調整: デフォルトのプルダウン矢印を非表示にし、カスタム▽マークを表示 */
	select {
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		padding-right: 20px; /* 右側にスペースを確保 */
		background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="10" height="6" viewBox="0 0 10 6"><polygon points="0,0 10,0 5,6" fill="black"/></svg>') no-repeat right center;
		background-size: 12px; /* ▽のサイズを調整 */
	}

	/* さらに外観をカスタマイズする */
	label {
		margin-right: 10px;
	}
}

/*
#cont_tit{
	display: block;
	font-size: 1.8rem;
	font-weight: bold;
	font-family: 'Marcellus SC', serif;
	font-family: 'Noto Sans Japanese', sans-serif;
	margin-bottom: 30px;
}
*/

#cont_tit p{
	text-align: center;
}

#cont_form{
	width: 94%;
	margin: 3%;
}

#cont_form input{
	width: 96%;
	height: 30px;
	margin-left: 4%;
	background-color: #e7e2e2;
	font-size: 1rem;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-left: 5px;
}

#cont_form textarea{
	width: 96%;
	height: 350px;
	margin-left: 4%;
	background-color: #e7e2e2;
	resize: none;
/*	font-size: 1.2rem;*/
	padding: 4px;
}

/*
#job_box{
	width: 160px;
	height: 30px;
	margin-left: 4%;
	background-color: #e7e2e2;
	font-size: 1rem;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-left: 5px;
}

#brithday_box{
	width: 260px;
	height: 30px;
	margin-left: 4%;
	background-color: #e7e2e2;
	font-size: 1rem;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-left: 5px;
}
*/

#cont_form input[name="実務経験年数"]{
	width: 30%;
}

option selected disabled{
	display: none;
}

.radioItem {
	display: inline-flex;
  	align-items: center;
  	column-gap: 4px;
  	line-height: 1;
	letter-spacing: 0.5em;
  	cursor: pointer;
	margin-left: 4%;
}

.radioItem:not(:last-of-type) {
  	margin-right: 10px;
}

.radioButton {
	appearance: none;
	position: relative;
	width: 20px;
	height: 20px;
	border-radius: 50%; /*9999px*/
	background-color: #e7e2e2;
	cursor: pointer;
}

.radioButton:checked::after {
	content: "";
	position: absolute;
	inset: 0;
	width: 12px;
	height: 12px;
	margin: auto;
	border-radius: 50%; /*9999px*/
	background-color: #fea803;
}

.form_txt{
	font-size: 1.0rem;
	margin-top: 15px;
	margin-bottom: 5px;
	/*font-family: 'M PLUS Rounded 1c', sans-serif;*/
	font-family: 'Noto Sans Japanese', sans-serif;
}

.input_txt::placeholder{
	color: #aaaaaa;
}

.required{
	font-size: 0.7rem;
	background-color: #dd0000; /*red*/
	color: #e7e2e2;
	padding-top: 2px;
	padding-bottom: 2px;
	padding-left: 3px;
	padding-right: 3px;
	user-select: none;
}

.brithday_txt{
	padding-bottom: 2.1%;
}

#submit_button_box{
	text-align: center;
	margin-bottom: 40px;
}

/*
#submit_button{
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 40px;
	padding-right: 40px;
	border-radius: 6px; 10px
	border: 2px solid #868686;
	font-size: 1.3rem; 1.5rem
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-family: 'Noto Sans Japanese', sans-serif;
	background-color: #ffbb00; #ffbb00
}
*/

/*
#submit_button:hover{
	background-color: #ffdd00; 868686
}
*/

/*
#submit_button_box input{
	font-weight: 500;
}
*/

/*#submit_button_box input[name="確認画面へ"]{
	font-size: 10px; 
}*/

/*反転式ボタン*/
#submit_button{
	width: 150px; 
	height: auto;
	
	display: inline-block;
	padding: 0.3em 1em;
	text-decoration: none;
	color: #ffbb00;
	border: solid 2px #ffbb00;
	border-radius: 8px;
	transition: .4s;
	
	font-family: 'Roboto', sans-serif;
	font-size: 1.3rem;
}

#submit_button:hover{
	background-color: #fea803;
	background: #ffbb00;
	color: #ffffff;
}


#name_container{
	width: 67%;
	margin-right: 3%;
}
#age_container{
	width: 30%;
	min-width: 85px;
}
@media screen and (min-width: 810px) {
	#name_age_container{
		display: flex;
	}

}



/*======フッター関係======*/
footer{
	display: block;
	background-color: #ff9000;
}

#footer_inner{
	padding-top: 20px;
	padding-bottom: 20px;
}

#footer_contents{
	margin: 0 auto;
}

#footer_contents #company_name{
	margin: 5px;
	font-size: 1.5rem;
	font-weight: bold;
	white-space: nowrap;
}

#footer_contents p{
	/*font-family: 'Zen Maru Gothic', sans-serif;*/
	font-family: 'Noto Sans Japanese', sans-serif;
	text-align: center;
	color: #ffffff;
}

/*---------------↓デバック用↓-----------------*/
/*全体ゾーン確認用枠
*:not(html){
outline: 2px solid red ;outline-offset: -2px;
}
/**/

/*個別ゾーン確認用枠
.overview_li{
outline: 5px solid #000000; ;outline-offset: -2px;;
}
/**/

/*個別ゾーン確認用カラー
.inner{
background: #000000;
}
*/