@charset "utf-8";
/*
Theme Name: RareJob
Theme URI:
Description: RareJob
Version: 1.0
Author: monokus.jp

*/
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP&display=swap');
@import url('https://fonts.googleapis.com/css?family=M+PLUS+1p&display=swap');
@import url('https://fonts.googleapis.com/css?family=Open+Sans&display=swap');


/* font family
---------------------------------------------*/
.page-header .en {
	font-family: 'Open Sans', sans-serif;
}
.page-header span {
	font-family: 'M PLUS 1p', sans-serif;
	font-weight:	normal;
}
body {
	font-family: 		'Noto Sans JP', sans-serif;
}
/* util */
.ff-os { font-family: 'Open Sans', sans-serif; }
.ff-nsj { font-family: 'Noto Sans JP', sans-serif; }
.ff-mp1 { font-family: 'M PLUS 1p', sans-serif; }

/* BODY
---------------------------------------------*/


html {
	width: 100%;
	height: 100%;
}
body {
	-webkit-text-size-adjust: 100%;
}
body,div,
dl,dt,dd,
h1,h2,h3,h4,h5,h6,
pre,form,fieldset,input,textarea,p,blockquote,th,td,
header,footer,article,section,nav {
	margin: 0;
	padding: 0;
	font-size: 100%;
/*	list-style: none; */
}
ul,ol,li {
	font-size: 100%;
}
ul,ol {
	padding-left:	1.4em;
}
.reset-list ul,
.reset-list ol,
.reset-list li {
	list-style:		none;
	padding:	0;
	margin:		0;
}


body {
	text-align: 		left;
/*	font-family:		'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif; */
	font-size: 			16px;
	line-height:		1.8em;
	color: 				#000;
	background:			#fff;
}
	body.home {
/*		background-image:	none !important; */
		background:		#fff !important;
	}

img {
	vertical-align: 	bottom;
	border: 			none;
}

a, a:link, a:visited {
	color: 			#579f00;
	font-weight: 		normal;
	text-decoration: 	underline;
}

a:hover {
	color: 			#579f00;
	font-weight: 		normal;
	text-decoration: 	none;
}

strong {
	font-weight: 		bold;
}

p , .p {
/*	padding: 			15px 20px 8px 20px; */
/*	padding: 			15px 0 8px;  */
	margin:			0 0 2em;
}
del {
	color:		#ccc;
}
a del {
	text-decoration:	inherit;
}
code {
	background-color:	#eee;
}
pre.code {
	margin:		0 0 20px;
	padding:		12px;
	background-color:	#eee;

	font-size:		100%;
	line-height:	1.3em;
}

.clear {clear: both;}
.center {text-align: center !important;}
.left {text-align: left;}
.right {text-align: right;}

.bold { font-weight: bold; }
.red { color: #e41123; }

.op {
	opacity: 1;
	transition: 	opacity 1.0s;
}
	.op:hover {
		opacity: .6;
	}
.anim {
	transition:		all 1.0s ease-out;
}
@media screen and (min-width: 768px) {
	.pc-visible { display: block !important; }
	.sp-visible { display: none !important; }
	.pc-hidden { display: none !important; }
	.sp-hidden { }
}
@media screen and (max-width:767px) {
	.pc-visible { display: none !important; }
	.sp-visible { display: block !important; }
	.pc-hidden { }
	.sp-hidden { display: none !important; }
}
img.responsive ,
.responsive img {
	width:		100%;
	height:		auto;
}
.fleft {float: left;}
.fright {float: right;}



.overlay {
	position:	fixed;
	left:		0;
	right:		0;
	top:		0;
	bottom:		0;

	background:		rgba(0,0,0,0.5);
}
.text-overflow-ellipsis {
	width:		100%;
	overflow:	hidden;
	text-overflow:	ellipsis;
}
/* Layout
---------------------------------------------*/
#viewport {
	width:				100%;
	overflow-x:			hidden;
	overflow-y:			hidden;
}


body {
	overflow-x:			hidden;
}
#wrap {
	background: #f8fbf8;
    padding: 30px 0 72px;
}
body.home #wrap {
	padding-top:		0 !important;
	padding-bottom:		0 !important;
}
#contents {
/*	width:			1000px; */
	margin:			0 auto;
	padding:		0 0 0;
}
/*	#sidebar {
		width:			250px;
		float:			left;
	}
	#main {
		width:			730px;
		float:			right;
	} */
	#footer {
		clear:			both;
	}

#contents.wide {
}
	#contents.wide #main {
		width:		auto;
		float:		none !important;
	}
#contents.liquid {
	width:		auto;
	float:		none !important;
}
	#contents.liquid #main {
		width:		auto;
		float:		none !important;
	}

/* Main Image
---------------------------------------------*/

.main-image {
}
	.main-image .video {
		position:	absolute;
		left:		0;
		right:		0;
		top:		0;
		bottom:		0;
		z-index:	1;

		display:	block;
		width:		auto;
		height:		auto;
	}
	.main-image .bg {
		/*
		position:	absolute;
		left:		0;
		right:		0;
		top:		0;
		bottom:		0;
		z-index:	1;

		display:	block;
		width:		auto;
		height:		auto;
		*/
		position:	relative;
	}
	.main-image .bg li {
		position:	absolute;
		left:		0;
		right:		0;
		top:		0;
		bottom:		0;

		opacity:	0;
	}
		.main-image .bg li img {
			opacity:		0;
		}
/* Main Contents
---------------------------------------------*/

#main {
}
h2, h3, h4, h5, h6 {
	margin:		0 0 1em;
	clear:		both;

	font-weight:	bold;
	color:			#000;
}

.box {
	border:		1px solid #D4E0C3;
	background:		#fff;

	padding:	30px;
	margin:		0 0 40px;
}
	.box p:last-child {
		margin-bottom:		0 !important;
	}

/* テーブル関連 */

table {
	font-size:inherit;
	font:100%;
}

table.mainstyle,
table.table {
	border-spacing: 0;
	border: 1px #D4E0C3 solid;
	border-collapse: collapse;
	margin: 0 0 20px;
}

table.mainstyle th,
table.table th,
table.mainstyle td,
table.table td {
	padding: 12px;
	border: 1px #D4E0C3 solid;
	background:#fff;
}

table.mainstyle th ,
table.table th,
table.mainstyle .th ,
table.table .th {
	font-weight: bold;
	background: #F4F8EE;
	text-align:		center;
}

table.mainstyle td ,
table.table td ,
table.mainstyle .td ,
table.table .td {
	font-weight: normal;
	background:#fff;
	text-align:		left;
}
.nowrap th,
.nowrap td,
.nowrap {
	white-space:		nowrap;
}
/* 共通ボタン */
	.btn02 a ,
	.btn02 button {
		display:	block;
		width:		100%;
		padding:	1em 0 1em;
		text-align:		center;

		border:		1px solid #8DC21F;
		border-radius:		2em;
		color:		#579F00;
		background-color:		#fff;

		font-size:		100%;
		cursor:		pointer;

		text-decoration:	none;
		transition:		all .3s ease-out;

		position:		relative;
	}
	.btn02.large a ,
	.btn02.large button {
		padding-top:		1.3em;
		padding-bottom:		1.1em;
	}
	.btn02 a:hover ,
	.btn02 button:hover {
		background-color:		#8DC21F;
		color:			#fff;
	}
	.btn02.btn02-reverse a,
	.btn02.btn02-reverse button {
		background-color:		#8DC21F;
		color:			#fff;
	}
	.btn02.btn02-reverse a:hover ,
	.btn02.btn02-reverse button:hover {
		background-color:		#fff;
		color:			#579F00;
	}
.btn02 .icon {
	width:		1em;
	height:		1em;
	position:	relative;
}
	.btn02 .icon:before,
	.btn02 .icon:after {
		position:	absolute;
		left:		0;
		right:		0;
		top:		0;
		bottom:		0;

		display:	block;
		width:		auto;
		height:		auto;
		overflow:	hidden;
		content:	'';

		background-position:	center center ;
		background-repeat:		no-repeat;
		background-size:		contain !important;

		transition:		all .3s ease-out;
	}
		.btn02 .icon:before {
			opacity:		1;
		}
		.btn02 .icon:after {
			opacity:		0;
		}
		.btn02 a:hover .icon:before ,
		.btn02 button:hover .icon:before {
			opacity:		0;
		}
		.btn02 a:hover .icon:after ,
		.btn02 button:hover .icon:after {
			opacity:		1;
		}
.btn02 .icon.icon-faq:before { background-image: url(../images/icon-faq.svg); }
.btn02 .icon.icon-faq:after { background-image: url(../images/icon-faq-on.svg); }

.select {
	display:	block;
	width:		100%;
	height:		3em;
	box-sizing:		border-box;

	border:		1px solid #D4E0C3;
	background:		#fff;
	border-radius: 6px;

	font-size:		100%;
	padding:		0 0.5em;

	position:		relative;
}
	.select:before {
		position:	absolute;
		right:		0.5em;
		top:		5px;
		bottom:		0;
		z-index:	2;
		margin:		auto 0;

		display:	block;
		width:		0;
		height:		0;
		overflow:	hidden;
		content:	'';

		border-width:		5px;
		border-style:		solid;
		border-color:		#000 transparent transparent transparent;
	}
	.select select {
		position:	absolute;
		left:		0;
		right:		0;
		top:		0;
		bottom:		0;

		display:	block;
		width:		100%;
		height:		3em;
		box-sizing:		border-box;

		background:		transparent !important;
		border:			none !important;
		box-shadow:		none !important;

		font-size:		100%;
		padding:		0 0.5em;

		appearance:		none;
		-webkit-appearance:		none;
		-moz-appearance:		none;
	}
	.select .select-label {
		display:	flex;
		/* justify-content: center; */
		align-items:		center;

		width:		100%;
		height:		3em;
		box-sizing:		border-box;
	}
	.select-placeholder {
		color:		#7a7a7a;
	}
input[type="text"],
input[type="number"],
input[type="tel"],
input[type="email"] {
	display:	block;
	width:		100%;
	height:		3em;
	box-sizing:		border-box;

	border:		1px solid #F4F6F1;
	background:		#F4F6F1;
	border-radius: 6px;

	font-size:		100%;
	padding:		0 0.5em;

	appearance:		none;
	-webkit-appearance:		none;
	-moz-appearance:		none;

	position:		relative;
}
textarea {
	display:	block;
	width:		100%;
	height:		12em;
	box-sizing:		border-box;

	border:		1px solid #F4F6F1;
	background:		#F4F6F1;
	border-radius: 6px;

	font-size:		100%;
	padding:		0.5em;

	appearance:		none;
	-webkit-appearance:		none;
	-moz-appearance:		none;

	position:		relative;
}

input[type="radio"],
input[type="checkbox"] {
	margin:		0 0.5em 0 0;
}
input::placeholder {
	color: #7a7a7a;
}

/* その他 */

	.link-open-window:after {
		display:	inline-block;
		width:		1em;
		height:		1em;
		margin:		0 .15em;

		content:		'filter_none';
		font-size:		90%;
		font-weight:	normal;
		line-height:	1;

		vertical-align:	-.1em;

		font-family:	"Material Icons";
	}
	.caution {
		color: #F45800;
	}
/* Top Page
---------------------------------------------*/
.top-topics {
	border-bottom:		1px solid #f4f4f4;
	text-align:		center;
}

/* サイドバー
---------------------------------------------*/



/* 下層ページ
---------------------------------------------*/


.breadcrumb {
	text-align:		left;
}

.breadcrumb a {
	color:		#579f00;
	text-decoration:		none;
}
.breadcrumb a:hover {
	text-decoration:		underline;
}

/* リスト
---------------------------------------------*/


.baselist {
	margin: 15px;
}
.baselist ul {
	margin:		0 !important;
}
.baselist li {
	list-style:			none !important;
	margin:				0 0 8px;
}
.baselist li a {
	display:			block;
	font-size: 			15px;
	margin-bottom: 		8px;
	padding: 			7px 5px 7px 5px;
	border-bottom: 		1px dotted #666;
}

.baselist li a {
	color: 				#666;
	text-decoration: 	none;
	font-weight:		normal;
}
.baselist li a:hover {
	color: 				#444;
	text-decoration: 	underline;
	font-weight:		normal;
}
.baselist > ul > li { /*
	background: 		url(../images/side_menu_icon01.png) 5px 12px no-repeat;  */
}
.baselist > ul > li ul {
	margin-left:		25px !important;
}
.baselist > ul > li ul li { /*
	background:			url(../images/side_menu_icon02.png) 5px 14px no-repeat; */
}




/* WP STYLE
---------------------------------------------*/

img.centered ,
img.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

img.alignright {
	margin: 	0 0 0 1em;
	display: 	block;
	float: 		right;
}

img.alignleft {
	margin: 	0 1em 0 0;
	display: 	block;
	float: 		left;
}

.alignright {float: right;}
.alignleft {float: left;}


/* CLEARFIX
---------------------------------------------*/

.cl:after{
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;}

.cl{ display: inline-block; }

/* Hides from IE-mac \*/
* html .cl { height: 1%; }
.cl { display: block; }
/* End hide from IE-mac */