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

*/

body {
	font-size: 			14px;
	line-height:		1.8em;
}
img {
	max-width:		100%;
	height:			auto;
}

.fleft-sp {float: left;}
.fright-sp {float: right;}

p {
	margin:		0 0 32px;
}
/* Layout
---------------------------------------------*/
#viewport {
	width:				100% !important;
	overflow:			hidden !important;
}

#wrap {
	padding-bottom: 50px; 
}

body {
	overflow:			auto !important;
}
#contents {
	background: #FFFFFF;
	box-shadow: 0px 0px 15px rgba(200, 200, 200, 0.25);

	padding:	40px 20px 50px;
	margin:		-60px 20px 0;
	box-sizing:		border-box;
}

.page-image+#wrap {
	padding-top:		30px !important;
}
/*
#contents.document {
	font-size:		86%;
	line-height:		1.8em;
}
*/

/*
#contents.document p+h3,
#contents.document p+h4,
#contents.document p+h5,
#contents.document p+h6 {
	margin-top:		32px;
}
*/


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

/*
.main-image {
	width:		100%;
	padding:	0 0 114.667%;
	height:		1px;

	overflow:	hidden;
	position:	relative;
}
	.main-image .text {
		position:	absolute;
		left:		1.3%;
		right:		1.3%;
		bottom:		4.651%;
		z-index:	50;
	}
		.main-image .text img {
			display:	block;
			width:		100%;
			height:		auto;
			text-align:		center;
		}
	.main-image .bg-sp {
		height:		1px;
		overflow:	hidden;
		padding:	0 0 80%;
		position:	relative;
	}
	.main-image .bg-pc {
		display:	none;
	}
*/
.main-image {
	width:		100%;
	overflow:	hidden;
	position:	relative;
}
	.main-image .text {
		padding:	20px;
		background:		#fafafa;
	}
		.main-image .text img {
			display:	block;
			width:		100%;
			height:		auto;
			text-align:		center;
		}
	.main-image .bg-sp {
		height:		1px;
		overflow:	hidden;
		padding:	0 0 80%;
		position:	relative;
	}
	.main-image .bg-pc {
		display:	none;
	}

/* Main Contents
---------------------------------------------*/

/* 見出し関連 */
h2, .h2 {
	display:	block;
	padding:	0 0 24px;
	margin:		32px 0;
	background:		url(../images/h2-line.svg) left bottom no-repeat;
	background-size:	70px 1px;
	font-size:		22px;
	line-height:	1.6em;
}
h3, .h3 {
	display:	block;
	margin:		40px 0 24px;
	font-size:		20px;
	line-height:	1.6em;
}
h4, .h4 {
	display:	block;
	margin:		50px 0 30px;
	padding:	0 0 0 11px;
	border-left: 4px solid #8DC21F;

	font-size:		20px;
	line-height:	1.6em;
}
h5, .h5 {
	display:	block;
	margin:		40px 0 30px;

	font-size:		18px;
	line-height:	1.6em;
}
h6, .h6 {
	display:	block;
	margin:		42px 0 30px;
	padding:	10px 6px 12px 15px;
	background:		#f0f6e7;

	font-size:		17px;
	line-height:	1.6em;
}
ul {
	list-style:		disc;
}
ol {
	list-style:		decimal;
}
/*
p+h4,
p+h5,
p+h6,
.p+h4,
.p+h5,
.p+h6,
ul+h4,
ul+h5,
ul+h6,
ol+h4,
ol+h5,
ol+h6 {
	margin-top:		60px;
}
*/
.entry > h2:first-child,
.entry > h3:first-child,
.entry > h4:first-child,
.entry > h5:first-child,
.entry > h6:first-child,
.mce-content-body > h3:first-child,
.mce-content-body > h4:first-child,
.mce-content-body > h5:first-child,
.mce-content-body > h6:first-child {
	margin-top:		0 !important;
}

#contents .entry > *:last-child {
	margin-bottom:		0 !important;
}
#contents.documents h2,
#contents.documents .h2 {
	margin-top:		56px;
}
.box {
	padding:	20px 15px;
	margin:		50px 0 50px;
}
	.box h5 {
		padding:	0;
		margin:		0 0 20px;

		font-size:		14px;
		line-height:		1;
	}

	#contents.documents p {
		margin-bottom:		24px;
	}

/* テーブル関連 */
.table-wrap {
}
table.mainstyle th,
table.table th,
table.mainstyle td,
table.table td {
	word-break: break-all;
}
.table-wrap-sp-scroll {
	overflow:		auto;
	width:			100%;
}
.nowrap-sp th,
.nowrap-sp td,
.nowrap-sp {
	white-space:		nowrap;
}
.
/* 共通ボタン */
.btn01 {
}
	.btn01 a {
		margin:		0 auto;
		display:	inline-block;
		padding:	0 0 15px;

		font-size:		18px;
		line-height:	1;
		color:			#000;
		text-decoration:	none;

		background:		url(../images/btn01-line.svg) center bottom no-repeat;
		background-size:	100% 2px;

	    transition: 		transform 500ms cubic-bezier(0.77, 0, 0.175, 1);
	}
	/*
		.btn01 a:before {
			left: 0;
			transform:scaleX(0);
			transition-delay: 0.1s;
			transform-origin: 0% 0%;
		}
		.btn01 a:hover:before {
			transform:scaleX(1);
		}
		.btn01 a:after {
			left: 0;
			transform:scaleX(1);
			transform-origin: 100% 0%;
		}
		.btn01 a:hover:after {
			transform:scaleX(0);
		}
		*/
.btn02 {
}
	.btn02 a ,
	.btn02 button {
		padding-top:		12px;
		padding-bottom:		12px;
		font-size:		14px;
	}
	.btn02.large a ,
	.btn02.large button {
		padding: 16px 0;
		font-size: 18px;
	}
		.btn02.large a:before,
		.btn02.large button:before,
		.btn02.large i.material-icons,
		.btn02.large .icon{
			font-size:		92%; /* 120/130 */
		}
	.btn02.s14 a ,
	.btn02.s14 button {
		padding-top:		12px;
		padding-bottom:		12px;

		font-size:		14px;
		line-height:	16px;
	}
		.btn02.s14 a:before,
		.btn02.s14 button:before,
		.btn02.s14 i.material-icons,
		.btn02.s14 .icon{
			font-size:		92%; /* 120/130 */
		}
	.btn02 a:before,
	.btn02 button:before,
	.btn02 i.material-icons,
	.btn02 .icon {
		display:	inline-block;
		margin:		0 11px 0 0;
		vertical-align:		-.2em;

		/* content:		'mail_outline'; */
		font-size:		120%;
		line-height:	1;
		font-weight:	normal;
		font-family:	"Material Icons";
		text-align:		left;
	}
/*	.btn02 i.material-icons:last-child ,
	.btn02 .icon:last-child {*/
	.btn02 i.material-icons.tail ,
	.btn02 .icon.tail {
		margin-left:	11px !important;
		margin-right:	0 !important;
	}
	.btn02.arrow-right a:before ,
	.btn02.arrow-right button:before {
		position:	absolute;
		right:		.5em;
		top:		0;
		bottom:		0;
		margin:		auto 0;

		display:	block;
		width:		1em;
		height:		1em;
		vertical-align:	0;

		content:	'keyboard_arrow_right';
	}
/* フォーム */
.select {
	position:		relative;
	padding:		0;
}
.select {
	height:		56px;
}
.select select,
.select .select-label {
	height:		56px;

	font-size:		14px;
	padding:		0 12px;
}
	.select:before {
		right:		18px;
		top:		5px;
		bottom:		0;

		border-width:		5px;
		border-style:		solid;
		border-color:		#000 transparent transparent transparent;
	}

input[type="text"],
input[type="number"],
input[type="tel"],
input[type="email"] {
	height:		56px;

	font-size:		14px;
	padding:		0 12px;
}
textarea {
	height:		180px;

	font-size:		14px;
	padding:		12px 12px;
}

input[type="radio"],
input[type="checkbox"] {
	margin:		0 10px 0 0;
}


.pdf-size {
	margin:		0 0 0 8px;
	padding:	0 0 0 24px;
	height:		17px;

	display:		inline-block;
	font-size:		11px;
	line-height:	17px;
	background:		url(../images/icon-pdf.svg) left center no-repeat;
	background-size:	contain;
}
/* Top Page
---------------------------------------------*/
.top-topics {
	font-size:		13px;
	line-height:	19px;

	margin:		0 0 60px;
}
	.top-topics .inner {
		max-width:		100%;
		max-height:		77px;
		overflow:		hidden;

		text-align:		left;
	}
	.top-topics a {
		display:	block;
		padding:	15px 37px 15px 15px;

		font-size:		13px;
		line-height:	19px;

		color:		#000;
		text-decoration:	none;

		position:	relative;
	}
		.top-topics a:after {
			position:	absolute;
			right:		15px;
			top:		50%;
			margin:		-11px 0 0;

			display:	block;
			width:		22px;
			height:		22px;

			content:		'keyboard_arrow_right';
			font-size:		22px;
			font-weight:	normal;
			color:			#8f8f8f;
			font-family:	"Material Icons";
			text-align:		right;
		}
		.top-topics .cat {
			float:		left;
			min-width:		43px;
			height:		22px;
			box-sizing:		border-box;
			padding:		0 5px;

			border:			1px solid #dedede;
			border-radius: 	5px;

			font-size:		13px;
			line-height:	22px;
			color:			#7a7a7a;

			text-align:		center;
		}
		.top-topics .date {
			float:		left;
			height:			22px;
			line-height:		22px;
			margin:			0 0 0 0.5em;
		}
		.top-topics .text {
			clear:		both;
			max-width: 100%;
			height:			22px;
			line-height:		22px;
			padding:		5px 0 0;
			
			overflow: hidden;
			white-space: nowrap;
			text-overflow: ellipsis;
		}

.top-business {
	position:	relative;
	margin:		0 0 50px;
}
	.top-business:after {
		position:	relative;
		z-index:	5;

		display:	block;
		width:		auto;
		height:		315px;
		content:	'';

		margin:		-43px 20px 0;

		background:		url(../images/business-figure.svg) center top no-repeat;
		background-size:		contain;
	}
	.top-business .inner {
		position:		relative;
	}
		.top-business .inner:before {
			position:	absolute;
			left:		0;
			right:		60px;
			top:		0;
			bottom:		0;
			z-index:	1;

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

			background:		#f4f4f4;
		}
		.top-business .in  {
			position:	relative;
			z-index:	3;

			margin:		0 20px;
			position:	relative;
		}
			.top-business .in:after {
				position:	absolute;
				left:		0;
				right:		10px;
				top:		-19px;
				z-index:	2;

				display:	block;
				width:		auto;
				max-width:		325px;
				height:		42px;
				content:	'';

				background:		url(../images/business-logo.svg) left top no-repeat;
				background-size:	contain;
			}
		.top-business h2  {
			padding:	46px 0 40px !important;
			margin:		0 -5px 0 0 !important;
			border:		none !important;
			background:		none !important;

			font-size:		26px;
			line-height:	38px;
			text-align:		left;
		}
		.top-business .text {
			padding:		0 0 20px;

			font-size:		15px;
			line-height:	30px;
		}
		.top-business .more {
			text-align:		right;
			padding:		0 0 64px;
		}
			.top-business .more a {
			}
.top-technology {
	position:	relative;
	margin:		0 0 90px;
}
	.top-technology:after {
		position:	relative;
		z-index:	5;

		display:	block;
		width:		auto;
		height:		371px;
		content:	'';

		margin:		-50px 25px 0 30px;
		box-sizing:		border-box;

		background:		url(../images/technology-diagram.png) center top no-repeat;
		background-size:		contain;
	}
	.top-technology .inner {
		position:		relative;
	}
		.top-technology .inner:before {
			position:	absolute;
			left:		60px;
			right:		0;
			top:		0;
			bottom:		0;
			z-index:	1;

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

			background:		#f4f4f4;
		}
		.top-technology .in  {
			position:	relative;
			z-index:	3;

			margin:		0 20px;
			position:	relative;
		}
			.top-technology .in:after {
				position:	absolute;
				left:		0;
				right:		0;
				top:		-19px;
				z-index:	2;

				display:	block;
				width:		auto;
				max-width:		335px;
				height:		45px;
				content:	'';

				background:		url(../images/technology-logo.svg) right top no-repeat;
				background-size:	contain;
			}
		.top-technology h2  {
			padding:	46px 0 40px !important;
			margin:		0 !important;
			border:		none !important;
			background:		none !important;

			font-size:		26px;
			line-height:	38px;
			text-align:		right;
		}
		.top-technology .text {
			padding:		0 0 40px;

			font-size:		15px;
			line-height:	30px;
		}
		.top-technology .more {
			text-align:		left;
			padding:		0 0 80px;
		}
			.top-technology .more a {
			}
.top-global-team {
	margin:		0 auto 64px;
	padding-bottom:	20px;

	width:		100%;
	position:	relative;
}
	.top-global-team .text:before {
		position:	absolute;
		left:		20px;
		right:		20px;
		top:		-19px;
		margin:		0 auto;

		display:	block;
		width:		auto;
		max-width:	335px;
		height:		35px;
		content:	'';

		background:		url(../images/global-team-logo.svg) center center no-repeat;
		background-size:	contain;
	}
	.top-global-team .text {
		padding:		50px 20px 0;
		text-align:		left;

		font-size:		15px;
		line-height:	28px;
		background:		#f4f4f4;
	}
	.top-global-team .map {
		margin-bottom:	25px;
		padding-top:    20px;
		background:		#f4f4f4;
	}
		.top-global-team .map img {
			display:	block;
			width:		100%;
			height:		auto;
		}
	/*
	.top-global-team .photos {
		background:		url(../images/global-team-map.svg) center top no-repeat;
		background-size:		120% auto;
	}
		.top-global-team .photos ul {
			padding:		3em 0 2em;
			margin:			0 auto;
			width:			95%;

			display: flex;
			flex-wrap: wrap;
			justify-content: center;
		}
		.top-global-team .photos ul li:first-child {
			width:			80%;
		}
		.top-global-team .photos ul li {
			width:			50%;
			margin:			0 0 1em;
		}
			.top-global-team .photos ul li img {
				display:		block;
				width:			90%;
				height:			auto;

				margin:			0 auto;
			}
	*/
	.top-global-team .more {
		text-align:		center;
	}
		.top-global-team .more a {
		}
.top-services {
	margin:		0 0 50px;
	padding:	28px 0;
	background:		#f4f4f4;
	position:		relative;
}
	.top-services:before {
		position:	absolute;
		left:		20px;
		right:		20px;
		top:		-24px;
		margin:		0 auto;

		display:	block;
		width:		auto;
		max-width:	335px;
		height:		37px;
		content:	'';

		background:		url(../images/services-logo.svg) left center no-repeat;
		background-size:	contain;
	}
	.top-services h2 {
		margin:		0 !important;
		padding:	12px 0 20px !important;
		background:		none !important;
		border:			none !important;

		font-size:		16px;
		line-height:	22px;
	}
	.top-services .inner {
		padding:	0 20px;
	}
	.top-services .banners {
		padding-bottom: 16px;
	}
	.top-services .banners ul {
		margin:		-10px; /* shadow分 */
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}
		.top-services .banners ul li {
			width:		49.5%;
			margin:		0 0 8px;
		}
		.top-services .banners ul li a {
			display:	block;
			margin:		0;

			font-size:		12px;
			line-height:	17px;
			color:			#000;

			text-decoration:	none;
		}
			.top-services .banners ul li a .image {
				display:	block;
				overflow:	hidden;

				position:	relative;
			}
				.top-services .banners ul li a .image img {
					display:	block;
					width:		100%;
					height:		auto;
				}

			.top-services .banners ul li a .text {
				margin:		0 -10px;
				text-align:		center;
				position:		relative;
			}


/* Page
---------------------------------------------*/
.page-header {
	height:		180px;
	box-sizing:	border-box;
	padding:	0 0 30px;

	background:		url(../images/sp/page-title-bg.png) center top no-repeat;
	background-size:	cover;

	display:	flex;
	align-items:		center;
	justify-content: 	center;

	flex-direction:		column;
}
	.page-header .inner {
		text-align:		center;
		font-weight: normal;
	}
	.page-header .en {
		font-size: 		28px;
		line-height:	38px;
		margin:		0 0 11.5px;
	}
	.page-header span {
		margin:		0 !important;
		padding:	0 !important;
		border:		none !important;
		background:		none !important;
		font-size: 		15px;
		line-height:	22px;
	}

/* Footer
---------------------------------------------*/
.footer-banners {
	background:		#474747;
	padding:	30px 0;
}
	.footer-banners .list {
	}
	.footer-banners .list ul {
		margin:		0 20px;
	}
		.footer-banners .list ul li {
		}
		.footer-banners .list ul li a {
			display:	block;

			font-size:		11px;
			line-height:	18px;
			color:			#fff;

			text-decoration:	none;
		}
			.footer-banners .list ul li a .image {
				display:	block;
				overflow:	hidden;

				position:	relative;
			}

			.footer-banners .list ul li a .text {
				padding:		0 12px 0 0;
				margin:			12px 0 0 -20px;
				height:			18px;

				text-align:		right;
				position:		relative;
			}
			.footer-banners .list ul li a .text:after {
				position:	absolute;
				right:		-4px;
				top:		50%;
				margin:		-9px 0 0;
				width:		14px;
				height:		14px;

				content:		'keyboard_arrow_right';
				font-size:		14px;
				font-weight:	normal;
				color:			#fff;
				font-family:	"Material Icons";
				text-align:		right;
			}

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

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

img.alignright-sp {
	margin: 	0 0 0 1em;
	display: 	block;
	max-width:	45%;
	height:		auto;
	float: 		right;
}

img.alignleft-sp {
	margin: 	0 1em 0 0;
	display: 	block;
	max-width:	45%;
	height:		auto;
	float: 		left;
}

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

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

.breadcrumb {
	padding: 0 20px 8px;
	background: #f8fbf8;
	font-size:		11px;
	line-height:	26px;
	position:	relative;
}
.breadcrumb .inner {
    width: 100%;
    margin: 0 auto;
}
	.breadcrumb .inner > span {
		display:	inline;
		padding:	0;
		position:	relative;
	}
	.breadcrumb .inner > span:first-child {
		padding-left:		0 !important;
	}
	.breadcrumb .inner > span:first-child a {
		padding-left:	19px;
		position:		relative;
	}
	.breadcrumb .inner > span:first-child a:before {
		position:	absolute;
		left:		0;
		top:		1.5px;

		content:		'home';
		font-size:		14px;
		line-height:	14px;
		font-weight:	normal;
		color:			#222;
		font-family:	"Material Icons";
		text-align:		right;
	}