@charset "utf-8";
/* -------------------------------------------------------------------------------- */
/* お仕事情報（公開画面のみ）
/* -------------------------------------------------------------------------------- */
.contents {
    margin-top: 50px;
}
/* ------------------------------------------------------------ */
/* 共通（一覧画面、詳細画面）
/* ------------------------------------------------------------ */
/* -------------------- */
/* お気に入りボタン
/* -------------------- */
.jobBox .btn_bookmark {
	position: relative;
	width: 60px;
	min-width: auto;
	height: 60px;
	margin: auto;
	border: 1px solid #f1ece4;
	border-radius: 100%;
	background: #fff;
}
.jobBox .btn_bookmark::before,
.jobBox .btn_bookmark::after {
	content: "";
	display: block;
	clip-path: polygon(50% 0%, 65% 33%, 100% 38%, 75% 64%, 80% 100%, 50% 83%, 20% 100%, 25% 64%, 0 38%, 34% 33%);
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	transform: rotate(0deg);
	width: 30px;
	height: 28px;
	margin: auto;
	border: none;
	        transition: 0.3s ease-in-out;
	-webkit-transition: 0.3s ease-in-out;
	   -moz-transition: 0.3s ease-in-out;
	     -o-transition: 0.3s ease-in-out;
}
.jobBox .btn_bookmark::before {
	opacity: 1;
	background: #e6ddd1;
}
.jobBox .btn_bookmark::after {
	opacity: 0;
	background: #cc6670;
}
.jobBox .btn_bookmark:hover::before,
.jobBox .btn_bookmark:focus::before,
.jobBox .btn_bookmark:checked::before {
	opacity: 0;
}
.jobBox .btn_bookmark:hover::after,
.jobBox .btn_bookmark:focus::after {
	opacity: 0.5;
}
.jobBox .btn_bookmark:checked::after {
	opacity: 1;
}
/* お気に入り済み */
.jobBox .btn_bookmark.bookmarked {
	border: 1px solid #cc6670;
	opacity: 1;
}
.jobBox .btn_bookmark.bookmarked::after {
	background: #cc6670;
	opacity: 1;
}
/* SPサイズ */
@media screen and (max-width: 767px) {
	.jobBox .btn_bookmark {
		position: absolute;
	}
	/* お仕事情報 一覧 */
	#box_job_list .jobBox .btn_bookmark {
		top: -30px;
		right: 5%;
		bottom: auto;
	}
	/* お仕事情報 詳細 */
	#box_job_detail .jobBox .btn_bookmark {
		/* top: 0; */
		right: 0;
		bottom: auto;
	}
}
.jobContent table tr:last-child th,
.jobContent table tr:last-child td {
	border-bottom: none;
}
/* ------------------------------------------------------------ */
/* お仕事情報 検索
/* ------------------------------------------------------------ */
/* 「検索条件を変更」ボタン */
#box_job_search .searchBtn {
	margin-bottom: 50px ;
}
#box_job_search .searchBtn::after {
	content: "";
	display: block;
	clear: both;
}
#box_job_search .searchBtn button {
	padding: 16px 30px 16px 50px;
}
#box_job_search .searchBtn button::before {
	right: auto;
	left: 45px;
	transform: rotate(0deg);
	width: 19px;
	height: 20px;
	border: none;
	background: url("../img/icon_search.svg") no-repeat;
}
/* PCサイズ */
@media screen and (min-width: 768px) {
	/* 「検索条件を変更」ボタン */
	#box_job_search .searchBtn button {
		float: right;
	}
}
/* SPサイズ */
@media screen and (max-width: 767px) {
	/*検索条件を変更ボタン*/
	#box_job_search .searchBtn button {
		margin: auto;
		width: 100%;
	}
}
/* ------------------------------------------------------------ */
/* お仕事情報 一覧画面
/* ------------------------------------------------------------ */
/* ---------------------------------------- */
/* 件数＆ページネーション＆並び替え
/* ---------------------------------------- */
#box_job_list .searchBox {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 40px;
}

/* -------------------- */
/* 件数
/* -------------------- */
#box_job_list .searchBox > .displayNum {
    font-weight: 400;
    color: #b59ca1;
}
/* -------------------- */
/* ページネーション
/* -------------------- */
#box_job_list .pageNavi ul {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: center;
	align-items: center;
}
#box_job_list .pageNavi li {
	width: 28px;
	height: 28px;
	overflow: hidden;
	border-radius: 100%;
	background-color: #f1ece4;
	font-weight: 600;
	font-size: 1.5rem;
	font-family: "El Messiri", sans-serif;
	text-align: center;
}
#box_job_list .pageNavi li a {
	display: block;
	position: relative;
	width: 28px;
	height: 28px;
	color: #401922;
	line-height: 30px;
	text-decoration: none;
	text-align: center;
}
#box_job_list .pageNavi li.on a,
#box_job_list .pageNavi li a:hover,
#box_job_list .pageNavi li a:focus {
	background: #a64c5d;
	color: #fff;
}
/*前へ後ろへ*/
#box_job_list .pageNavi li.prev a::before,
#box_job_list .pageNavi li.prev a::after,
#box_job_list .pageNavi li.next a::before,
#box_job_list .pageNavi li.next a::after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	transform: rotate(45deg);
	width: 6px;
	height: 6px;
	margin: auto;
	        transition: 0.3s ease-in-out;
	-webkit-transition: 0.3s ease-in-out;
	   -moz-transition: 0.3s ease-in-out;
	     -o-transition: 0.3s ease-in-out;
}
#box_job_list .pageNavi li.prev a:hover::before,
#box_job_list .pageNavi li.prev a:focus::before,
#box_job_list .pageNavi li.next a:hover::before,
#box_job_list .pageNavi li.next a:focus::before {
	opacity: 0;
}
#box_job_list .pageNavi li.prev a:hover::after,
#box_job_list .pageNavi li.prev a:focus::after,
#box_job_list .pageNavi li.next a:hover::after,
#box_job_list .pageNavi li.next a:focus::after {
	opacity: 1;
}  
/*前へ*/
#box_job_list .pageNavi li.prev a::before,
#box_job_list .pageNavi li.prev a::after {
	right: 0;
	left: 3px;
}
#box_job_list .pageNavi li.prev a::before {
	opacity: 1;
	border-bottom: 1px solid #401922;
	border-left: 1px solid #401922;
}
#box_job_list .pageNavi li.prev a::after {
	opacity: 0;
	border-bottom: 1px solid #fff;
	border-left: 1px solid #fff;
}
/*後へ*/
#box_job_list .pageNavi li.next a::before,
#box_job_list .pageNavi li.next a::after {
	right: 3px;
	left: 0;
}
#box_job_list .pageNavi li.next a::before {
	opacity: 1;
	border-top: 1px solid #401922;
	border-right: 1px solid #401922;
}
#box_job_list .pageNavi li.next a::after {
	opacity: 0;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
}
/* PCサイズ */
@media screen and (min-width: 768px) {
	/* ---------------------------------------- */
	/* 件数＆ページネーション＆並び替え
	/* ---------------------------------------- */
	#box_job_list .searchBox > .displayNum,
	#box_job_list .searchBox > .displaySort {
		width: 160px;
	}
}
/* SPサイズ */
@media screen and (max-width: 767px) {
	/* ---------------------------------------- */
	/* 件数＆ページネーション＆並び替え
	/* ---------------------------------------- */
	#box_job_list .searchBox {
		flex-wrap: wrap;
	}
	/* -------------------- */
	/* 件数
	/* -------------------- */
	#box_job_list .displayNum {
		order: 1;
	}
	/* -------------------- */
	/* ページネーション
	/* -------------------- */
	#box_job_list .pageNavi {
		order: 3;
		width: 100%;
		margin-top: 30px;
	}
	/* -------------------- */
	/* 並び替え
	/* -------------------- */
	#box_job_list .displaySort {
		order: 2;
	}
}
/* ------------------------------------------------------------ */
/* お仕事情報 詳細画面
/* ------------------------------------------------------------ */
/* -------------------- */
/* 求人の特徴
/* -------------------- */
#box_job_detail .job_feature li {
	margin-top: 0.5em;
	margin-right: 0.5em;
	background: #eee;
}
/* PCサイズ */
@media screen and (min-width: 768px) {
}
/* SPサイズ */
@media screen and (max-width: 767px) {
}
/* ---------------------------------------- */
/* ヘッダー（タイトル、募集期間、お気に入りボタン）
/* ---------------------------------------- */

#box_job_detail .jobTitle_r,
#box_job_detail .jobTitle_l {
	display: flex;
	align-items: center;
}

/* -------------------- */
/* 募集期間
/* -------------------- */
#box_job_detail .period {
	display: inline-block;
	min-width: 270px;
}
/* -------------------- */
/* NEWアイコン
/* -------------------- */
/* #box_job_detail .new {
	position: relative;
} */
/* #box_job_detail .jobTitle {
	position: relative;
} */
/* #box_job_detail .new .jobTitle {
	padding-left: 70px;
}
#box_job_detail .new .jobTitle::before {
	content: "NEW";
	display: flex;
	justify-content: center;
	align-items: center;
	clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 88%, 0 100%);
	position: absolute;
	left: 0;
	width: 56px;
	height: 42px;
	background: #fff400;
	color: #401922;
	font-weight: 700;
	font-size: 1.5rem;
	font-family: "El Messiri", sans-serif;
} */
#box_job_detail .new .jobTitle::before {
	content: "NEW";
	display: flex;
	justify-content: center;
	align-items: center;
	clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 88%, 0 100%);
	position: absolute;
	width: 56px;
	height: 42px;
	background: #fff400;
	color: #401922;
	font-weight: 700;
	font-size: 1.5rem;
	font-family: "El Messiri", sans-serif;
}
/* PCサイズ */
@media screen and (min-width: 768px) {
	
	/* -------------------- */
	/* NEWアイコン
	/* -------------------- */
	#box_job_detail .new .jobTitle {
		padding-left: 70px;
	}
	#box_job_detail .new .jobTitle::before {
		left: 0;
	}
	/* -------------------- */
	/* 募集期間
	/* -------------------- */
	#box_job_detail .period {
		margin-right: 1rem;
	}
}
/* SPサイズ */
@media screen and (max-width: 767px) {
	#box_job_detail .jobTitle {
		padding-bottom: 1.5em;
	}
	/* -------------------- */
	/* サロン名
	/* -------------------- */
	#box_job_detail .jobTitle .officeName {
		margin-bottom: 1em;
	}
	/* -------------------- */
	/* NEWアイコン
	/* -------------------- */
	#box_job_detail .new .jobTitle {
		padding-top: 50px;
	}
	#box_job_detail .new .jobTitle::before {
		top: 0;
	}
	/* -------------------- */
	/* 募集期間
	/* -------------------- */
	#box_job_detail .period {
		margin-top: 1em;
	}
}
/* ---------------------------------------- */
/* コンテンツ
/* ---------------------------------------- */
/* PCサイズ */
@media screen and (min-width: 768px) {
	#box_job_detail .jobContent .cms_image {
		float: left;
		width: 480px;
	}
	#box_job_detail .jobContent .cms_text {
		float: right;
		width: 615px;
	}
}
/* SPサイズ */
@media screen and (max-width: 767px) {
	#box_job_detail .jobContent .cms_image {
		margin-bottom: 20px;
	}
	/* #box_job_detail .jobContent .Lead {
		display: block;
	} */
}
/* ---------------------------------------- */
/* フッター（ボタン）
/* ---------------------------------------- */
/* ボタンのサイズ固定 */
#box_job_detail .formBtnBox button,
#box_job_detail .formBtnBox a {
	min-width: 285px;
}
/* PCサイズ */
@media screen and (min-width: 768px) {
	#box_job_detail .formBtnBox {
		display: flex;
		flex-wrap: nowrap;
		justify-content: center;
		align-items: flex-start;
		margin-top: 70px;
		gap: 20px 30px;
	}
}
/* SPサイズ */
@media screen and (max-width: 767px) {
	#box_job_detail .formBtnBox {
		display: block;
		margin-top: 45px;
	}
	#box_job_detail .formBtnBox div + div {
		margin-top: 0.5em;
	}
	#box_job_detail .formBtnBox a,
	#box_job_detail .formBtnBox button {
		display: block;
		width: 100%;
		margin: auto;
	}
}