@charset "utf-8";
/* CSS Document */  

#detailWrapper{
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	position: relative;
	z-index: 10;
}

#detailWrapper .creditWrap{
	max-width: 420px;
	width: 100%;
	margin-left: 40px;
}

#detailWrapper .creditWrap > div{
	overflow: hidden;
	border-radius: 20px;
}
#detailWrapper .creditWrap > div .ttl{
	font-size: var(--fs-2xl-sub);
	padding: 8px 10px 9px;
}

#detailWrapper .applyContainer{
	border: solid 4px #e06024;
}

#detailWrapper .applyContainer .ttl{
	background: #ffeae0;
	color: #e06024;
}

#detailWrapper .applyContainer .box{
	padding: 20px 20px 25px;
}

#detailWrapper .applyContainer .txtLink{
	text-decoration: underline;
	color: #000;
}
#detailWrapper .applyContainer .txtLink:hover{
	text-decoration: none;
}

#detailWrapper .infoContainer{
	margin-top: 40px;
	border: solid 1px #ccc;
}
#detailWrapper .infoContainer .ttl{
	background: #cccccc;
}
#detailWrapper .infoContainer .tblStyle01{
	padding: 20px;
	margin-top: 0;
}
#detailWrapper .infoContainer .tblStyle01 th{
	width: 120px;
	font-size: var(--fs-md);
	padding: 10px;
}
#detailWrapper .infoContainer .tblStyle01 td{
	width: calc(100% - 120px);
	font-size: var(--fs-md);
	word-break: break-all;
	padding: 10px;
}

@media screen and (max-width: 880px){
	#detailWrapper{
		display: block;
	}
	#detailWrapper .creditWrap{
		max-width: inherit;
		width: 100%;
		margin-left: 0;
		display: flex;
		flex-direction: column-reverse;
		align-items: center;
	}
	#detailWrapper .creditWrap > div{
		width: 100%;
	}
	#detailWrapper .applyContainer{
		margin-top: 40px;
	}
}

/* ------------------------------------------------------------------------ */

/*  #sec_detail

/* ------------------------------------------------------------------------ */


#detailWrapper #sec_detail{
	width: calc(100% - 460px);
}

#sec_detail{
	text-align: left;
	border: solid 1px #ccc;
	border-radius: 20px;
	overflow: hidden;
	padding: 30px 38px;
}

#sec_detail .data{
	text-align: right;
}
	#sec_detail .data span{
		display: inline-block;
		font-size: var(--fs-base);
	}
	#sec_detail .data .pub-date{
		margin-right: 3px;
	}
	#sec_detail .data .up-date{
		margin-left: 3px;
	}

#sec_detail .labelBox{
	margin-top: 10px;
}
	#sec_detail .labelBox .label{
		display: inline-block;
		color: #fff;
		padding: 4px 11px 5px;
		font-weight: 700;
		font-size: var(--fs-base);
		margin-right: 10px;
	}
	#sec_detail .labelBox .label.pickup{
		background: #e06024;
	}
	#sec_detail .labelBox .label.urgent{
		background: #db4691;
	}

#sec_detail .ttl{
	font-size: var(--fs-2xl-sub);
	color: #3a520a;
	line-height: 1.462;
	margin-top: 18px;
}

#sec_detail .credit{
	text-align: right;
	color: #666;
	font-weight: 500;
	font-size: var(--fs-base);
}

#sec_detail .lead{
	background: #fff;
	border: solid 1px #e06024;
	padding: 10px;
	margin-top: 20px;
	font-size: var(--fs-base);
	font-weight: 700;
	color: #e06024;
	line-height: 1.3;
}

#sec_detail .eyecatch{
	text-align: center;
	margin-top: 40px;
}


#sec_detail .container{
	line-height: 1.875;
}

#sec_detail .container p,
#sec_detail .container ul,
#sec_detail .container ol,
#sec_detail .container img{
	margin-top: 20px;
}

#sec_detail .container ul li,
#sec_detail .container ol li{
	text-indent: -1em;
	padding-left: 1em;
}

#sec_detail .container li + li{
	margin-top: 0.5em;
}

#sec_detail .container a{
	color: #3a520a;
}

#sec_detail .container .ttl{
	font-size: var(--fs-2xl);
	border-bottom: solid 2px #d5eba0;
	padding-bottom: 10px;
	margin-top: 60px;
}

#sec_detail .container .tblStyle01{
	margin-top: 20px;
}
#sec_detail .container .tblStyle01 th,
#sec_detail .container .tblStyle01 td{
	padding: 15px 0;
}
#sec_detail .container .tblStyle01 th{
	width: 130px;
}
#sec_detail .container .tblStyle01 td{
	padding-right: 0;
	width: calc(100% - 130px);
}

#sec_detail .container .tblStyle01 p{
	margin: 0;
}

#sec_detail .entryBox{
	text-align: center;
	background: #ffeae0;
	padding: 40px 15px 40px;
	margin: 40px -38px -30px;
}

#sec_detail .entryBox .txt{
	margin-top: 20px;
}

#sec_detail .entryBox .txt a{
	color: #000;
	text-decoration: underline;
}
#sec_detail .entryBox .txt a:hover{
	text-decoration: none;
}

/* 応募フォーム入力欄 */
.applyFormFields{
	text-align: left;
	margin: 15px 0;
}
.applyFormFields .formGroup{
	margin-bottom: 12px;
}
.applyFormFields .formGroup label{
	display: block;
	font-weight: 700;
	font-size: var(--fs-base);
	margin-bottom: 5px;
}
.applyFormFields .formGroup textarea{
	width: 100%;
	padding: 8px 10px;
	border: 1px solid #ccc;
	border-radius: 4px;
	font-size: var(--fs-base);
	line-height: 1.6;
	resize: vertical;
	box-sizing: border-box;
}
.applyFormFields .formGroup input[type="file"]{
	font-size: var(--fs-base);
}
.applyFormFields .formGroup .note{
	font-size: var(--fs-xs);
	color: #888;
	margin-top: 4px;
}

.backContainer{
	margin-top: 40px;
	border-top: dotted 1px #999;
}
.backContainer .btn{
	max-width: 240px;
	margin-top: 40px;
	background: #3a520a;
	padding: 13px 30px;
	font-size: var(--fs-md);
}
.backContainer .btn:hover{
	background: #9dbe47;
}

@media screen and (max-width: 880px){
	#detailWrapper #sec_detail{
		width: 100%;
	}
}
@media screen and (max-width: 767px){
	#detailWrapper #sec_detail{
		padding: 30px 15px;
	}

	#sec_detail .eyecatch{
		margin-top: 20px;
	}

	#sec_detail .container .ttl{
		margin-top: 30px;
	}

	#sec_detail .container p,
	#sec_detail .container ul,
	#sec_detail .container ol,
	#sec_detail .container img{
		margin-top: 15px;
	}

	#sec_detail .container .tblStyle01 tr{
		flex-direction: column;
	}

	#sec_detail .container .tblStyle01 th,
	#sec_detail .container .tblStyle01 td{
		width: 100%;
	}
	#sec_detail .container .tblStyle01 th{
		padding: 15px 0 0;
	}
	#sec_detail .container .tblStyle01 td{
		padding: 0 0 15px;
	}
	#sec_detail .entryBox{
		padding: 25px 15px 20px;
		margin: 40px -15px -30px;
	}
	.backContainer{
		margin-top: 40px;
	}
	#sec_detail .ttl{
		font-size: var(--fs-2xl);
	}
	#sec_detail .container .ttl{
		font-size: var(--fs-xl);
	}
}

/* 企業情報テーブル最終行ボーダー非表示（detail.php用） */
.infoContainer .tblStyle01 tr:last-child {
	border-bottom: none;
}

/* 応募済みメッセージ: entryBox（上下パディングを揃える） */
#sec_detail .entryBox .txt {
	margin-top: 0;
	margin-bottom: 20px;
}

/* 応募済みメッセージ: applyContainerのboxパディングを均等に */
#detailWrapper .applyContainer .box {
	padding: 20px;
}

/* ------------------------------------------------------------------------ */

/*  #sec_apply（apply.php 専用）

/* ------------------------------------------------------------------------ */

#sec_apply{
	max-width: 740px;
	margin: 0 auto;
	text-align: left;
}

#sec_apply > .ttl{
	font-size: var(--fs-2xl-sub);
	color: #3a520a;
	line-height: 1.4;
	margin-bottom: 25px;
}

/* 応募情報確認ボックス / ステータス表示ボックス */
.applyInfoBox{
	border: solid 4px #d5eba0;
	border-radius: 20px;
	padding: 30px;
	margin-bottom: 25px;
}

.applyInfoBox .boxTtl{
	font-size: var(--fs-lg);
	font-weight: 700;
	color: #3a520a;
	border-bottom: solid 2px #d5eba0;
	padding-bottom: 10px;
	margin-bottom: 15px;
}

.applyInfoBox table{
	width: 100%;
	border-collapse: collapse;
}

.applyInfoBox table th{
	width: 130px;
	padding: 10px;
	font-weight: 700;
	font-size: var(--fs-base);
	color: #555;
	vertical-align: top;
	border-bottom: dotted 1px #ccc;
}

.applyInfoBox table td{
	padding: 10px;
	font-size: var(--fs-base);
	word-break: break-all;
	border-bottom: dotted 1px #ccc;
}

.applyInfoBox table tr:last-child th,
.applyInfoBox table tr:last-child td{
	border-bottom: none;
}

/* 応募フォームボックス */
.applyFormBox{
	border: solid 4px #d5eba0;
	border-radius: 20px;
	padding: 30px;
}

.applyFormBox .applyNote{
	font-size: var(--fs-base);
	color: #555;
	background: #f5f9ec;
	padding: 12px;
	border-radius: 8px;
	margin: 15px 0 20px;
	line-height: 1.6;
}

/* ボタン中央寄せラッパー */
.applyBtnWrap{
	text-align: center;
	margin-top: 20px;
}

.applyBtnWrap .btn,
.applyFormBox > form .btn{
	max-width: 300px;
	display: block;
	margin: 0 auto;
	padding: 15px 30px;
	font-size: var(--fs-md);
}

.applyFormBox .backLink{
	display: block;
	text-align: center;
	margin-top: 20px;
	color: #555;
	text-decoration: underline;
}

.applyFormBox .backLink:hover{
	text-decoration: none;
}

@media screen and (max-width: 767px){
	.applyInfoBox,
	.applyFormBox{
		padding: 20px 15px;
	}
	.applyInfoBox table th{
		width: 100px;
	}
}