/* ----------------------------------------
slider
----------------------------------------*/
.slider {
	display:none;}
.slider.slick-initialized {
	display: block;}



/* ----------------------------------------
mainimage
----------------------------------------*/
.mainimage {
	position: relative;}
.topSlide {
	height: calc(888 / 1600 * 100vw);}
.topSlide figure {
	width: 100%;
	/*height: 0;*/
	/*padding-top: calc(710 / 1280 * 100vw);*/
	/*background-repeat: no-repeat;
	background-size: 110%;*/}
	.topSlide figure img {
		width: 100%;}


/*.topSlide figure:nth-child(1) figcaption p {
	color: #fff;
	font-size: 4.3rem;
	line-height: 100%;
	white-space: nowrap;}*/
.topSlide figure .slideImg {
	opacity: 0;
	height: 0;
	padding-top: calc(888 / 1600 * 100vw);
	background-size: cover;
	transition: opacity 0.5s, transform 4s;
	transition-property: cubic-bezier(.06,.86,.43,.99);}
	.topSlide figure.slick-active .slideImg {
		opacity: 1;
		animation-name: scaling;
		animation-duration: 5000ms;
		animation-timing-function: cubic-bezier(.06,.86,.43,.99);
	}
	.topSlide figure:first-child.slick-active .slideImg {
		opacity: 1;
		animation-name: scaling-first;
		animation-duration: 8000ms;
		animation-timing-function: cubic-bezier(.06,.86,.43,.99);
	}
	/*.topSlide figure.slick-active .slideImg {
	/*.topSlide figure.slick-active .slideImg {
	opacity: 1;
	animation-duration: 24500ms;
	animation-iteration-count: infinite;}*/
.topSlide figure:nth-child(1) .slideImg {background-image: url(/recruit/images/home/img-topSlide-01_pc.jpg);}
.topSlide figure:nth-child(2) .slideImg {background-image: url(/recruit/images/home/img-topSlide-02_pc.jpg);}
.topSlide figure:nth-child(3) .slideImg {background-image: url(/recruit/images/home/img-topSlide-03_pc.jpg);}
.topSlide figure:nth-child(4) .slideImg {background-image: url(/recruit/images/home/img-topSlide-04_pc.jpg);}
.topSlide figure:nth-child(5) .slideImg {background-image: url(/recruit/images/home/img-topSlide-05_pc.jpg);}
.topSlide figure:nth-child(6) .slideImg {background-image: url(/recruit/images/home/img-topSlide-06_pc.jpg);}
.topSlide figure:nth-child(7) .slideImg {background-image: url(/recruit/images/home/img-topSlide-07_pc.jpg);}
.topSlide figure:nth-child(8) .slideImg {background-image: url(/recruit/images/home/img-topSlide-08_pc.jpg);}

@keyframes scaling {
	0% {
		transform: scale(1.15) rotate(0.01deg);
	}
	100% {
		transform: scale(1) rotate(0.01deg);}
}
@keyframes scaling-first {
	0% {
		transform: scale(1.3) rotate(0.01deg);
	}
	100% {
		transform: scale(1) rotate(0.01deg);}
}


.copy {
	position: absolute;
		/*z-index: 5;*/
		top: 50%;
		right: 50%;
		transform: translate(50%, -50%);}
.copy p {
	color: #e60012;
	font-size: 4.3rem;
	line-height: 100%;
	white-space: nowrap;}

.newsList {
	position: absolute;
		right: 0;
		bottom: 20px;
		left: 0;
	display: flex;
		justify-content: space-between;
	width: 1100px;
	margin: 0 auto;
	color: #333;
	font-size: 1.4rem;
	background: #fff;
	box-shadow: -3px 0 7px rgba(0,0,0,0.25);}
.newsList > ul {
	padding: 22px;}
.newsList > ul > li {
	display: flex;
		align-items: center;}
.newsList > ul > li:not(:last-child) {
	margin-bottom: 20px;}
.newsList .ListHead-circle li:before {
	margin: 0.8rem 20px auto 0;
	background: #e60012;}
.newsList > ul > li > a {
	display: inline-flex;
		justify-content: center;
		align-items: flex-start;}
		.newsList > ul > li > a[target="_blank"]:after {
				flex-shrink: 0;
			margin-top: auto;
			margin-bottom: auto;}
.newsList > ul > li > a.hover {
	color: #e60012;}
.newsList time {
		flex-shrink: 0;
	display: inline-block;
	min-width: 92px;
	margin: 0 10px 0 0;
	color: #555;}
.newsList span {
	margin-right: 10px;}
.newsListAll {
	color: #fff;}
.newsListAllBtn {
	display: flex;
		justify-content: center;
		align-items: center;
	min-width: 167px;
	height: 100%;
	font-size: 1.6rem;
	background: #000;
	transition: transform 0.5s, background 0.5s;}
.newsListAllBtn.hover {
	background: #e60012;
	transform: scale(0.96);}
.newsListAll span {
	position: relative;
	display: block;
	width: 10px;
	height: 10px;
	background: #fff;}
	.newsListAll span:before,
	.newsListAll span:after {
		content: "";
		display: block;
		width: 10px;
		height: 2px;
		background: #000;
		transition: background 0.5s;}
		.newsListAll .hover span:before,
		.newsListAll .hover span:after {
			background: #e60012;}
	.newsListAll span:before {
		position: absolute;
		top: calc(50% - 1px);}
	.newsListAll span:after {
		position: absolute;
		top: calc(50% - 1px);
		transform: rotate(90deg);}


/* ----------------------------------------
recrutingMessage
----------------------------------------*/
.recrutingMessage {
	padding: 100px 0 120px 0;
	text-align: center;}

.messageInfo {
	margin: 0 0 80px 0;
	color: #bfbfbf;
	font-family: 'Roboto';
	font-size: 1.2rem;
	letter-spacing: 0.1rem;}
.recrutingMessage h2 {
	margin: 0 0 73px 0;
	color: #e60012;
	font-size: 9rem;
	line-height: 100%}
.messageCopy {
	margin: 0 0 30px 0;
	color: #e60012;
	font-size: 3.4rem;}
.messageDisc {
	margin: 0 auto 45px auto;
width: 410px;}
.messageDisc li {
	color: #333;
	font-size: 1.4rem;
text-align: left;}
.messageDisc li:not(:last-child) {
	margin: 0 0 8px 0;}
.messageDisc li > span {
	color: #555;
	font-size: 2rem;}
.messageDisc li > span:after {
	content: "";
	display: inline-block;
	width: 13px;
	height: 1px;
	margin: 0 1.6rem 0 2rem;
	vertical-align: middle;
	background: #333;}

.moreBtnArea {
	display: inline-block;
	color: #fff;}

/* ----------------------------------------
interview
----------------------------------------*/
.interview {
	margin: 0 0 75px 0;}
.interview h2 {
	margin: 0 0 60px 0;
	text-align: center;
	font-size: 1.8rem;}
	.interview h2:before {
		content: "INTERVIEW";
		display: block;
		margin-bottom: 30px;
		font-family: 'Roboto';
		font-size: 4.8rem;
		font-weight: bold;
		line-height: 70%;}
.interviewWrap {
	position: relative;
	margin: 0 auto;
	padding: 95px 0;
	background: linear-gradient(#eee,#eee) no-repeat;
	background-size: 1080px 100%;
	background-position: center;}

/* ----------------------------------------
slider
----------------------------------------*/
/* interviewSlide
------------------------------*/
/* スライドのアニメーション */
.interviewSlide figure {
	box-shadow: 13px 0 22px rgba(0,0,0,0);
	transform: scale(0.9);
	transition: box-shadow 0.4s, transform 0.4s;}
	.interviewSlide figure *:focus {
		outline: 0;}
.interviewSlide figure.slick-slide.slick-current,
.interviewSlide figure.slick-slide.is-active-next {
	/*box-shadow: 13px 0 22px rgba(0,0,0,0.2);*/
	transform: scale(1);}
.interviewSlide figure img,
.interviewSlide [class^="people"][class$="-icon"] {
	opacity: 0.34;
	transition: opacity 0.4s;}
.interviewSlide figure.slick-slide.slick-current img,
.interviewSlide figure.slick-slide.is-active-next img,
.interviewSlide .slick-current [class^="people"][class$="-icon"],
.interviewSlide .is-active-next [class^="people"][class$="-icon"]  {
	opacity: 1;}
.interviewSlide figure figcaption {
				/*test*/
				/*white-space: nowrap;*/
				/*test*/
	opacity: 0;
	transition: opacity 0.4s, background 0.12s;}
.interviewSlide figure.slick-slide.slick-current figcaption,
.interviewSlide figure.slick-slide.is-active-next figcaption {
	opacity: 1;}


/*ガターなど*/
.interviewSlide {
	margin-top: -33px; /* ドロップシャドウ分ネガティブマージン */}
.interviewSlide .slick-list {
	margin-right: calc(-100px + 20px); /* ガター分ネガティブマージン */ /* +scale分 */
	padding-top: 33px !important; /* ドロップシャドウ */
	padding-bottom: 23px !important;}
.interviewSlide .slick-slide {
	margin-right: calc(100px - 20px); /* ガター */ /* +scale分 */}
/*arrow*/
.interviewSlide .slick-arrow {
	position: absolute;
		top: auto;
		bottom: 91px;
		left: auto;
	display: flex;
		flex: 1 0 auto;
	width: 20px;
	overflow: visible;
	align-items: center;
	transition: transform 0.12s;}
.interviewSlide .slick-arrow:before,
.interviewSlide .slick-arrow:after {
	content: "";
	display: inline-block;
	vertical-align: middle;}
	/*.slick-prev*/
.interviewSlide .slick-prev {
		left: calc(50% - 120px);}
.interviewSlide .slick-prev.slick-arrow:before {
	opacity: 1;
	width: 8px;
	height: 8px;
	border: 2px solid #e60012;
	border-bottom: 0;
	border-left: 0;
	transform: rotate(225deg);}
.interviewSlide .slick-prev.slick-arrow:after {
	width: 12px;
	height: 2px;
	margin-left: -8px;
	background: #e60012;}
	/*.slick-next*/
.interviewSlide .slick-next {
		right: calc(50% - 120px);
		justify-content: right;}
.interviewSlide .slick-next.slick-arrow:before {
	opacity: 1;
	width: 12px;
	height: 2px;
	background: #e60012;}
.interviewSlide .slick-next.slick-arrow:after {
	width: 8px;
	height: 8px;
	margin-left: -8px;
	border: 2px solid #e60012;
	border-bottom: 0;
	border-left: 0;
	transform: rotate(45deg);}
/*dots*/
.interview-dots {
	position: absolute;
		right: 50%;
		transform: translateX(50%);
	margin: 30px 0 0 0;}
.interview-dots li {
	display: inline-block;
	width: 8px;
	height: 8px;
	margin: 0 15px 0 0;}
	.interview-dots li:last-child {
		margin-right: 0;}
.interview-dots li button {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	background: #d2d2d2;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;}
.interview-dots .slick-active button {
	background: #e60012;}

#js-slider {
	position: static;}
#js-slider.slick-dotted {
	margin-bottom: calc(30px + 20px);}
.interviewSlide {
	overflow: hidden;}
.interviewSlide figure {
	position: relative;
	width: 427px;
	min-height: 427px;}
/*.interviewSlide figure a {
	display: block;}*/
.interviewSlide figure img {
	width: 100%;
	height: auto;
	transition: transform 0.2s, opacity 0.4s;}
.interviewSlide figcaption {
	position: absolute;
		bottom: 0;
		right: 0;
		left: 0;
	display: flex;
		justify-content: center;
	padding: 16px;
	color: #fff;
	font-size: 2.1rem;
	line-height: 3.6rem;
	background: rgba(0,0,0,0.8);}
	.interviewSlide a.hover figcaption {
		background: rgba(230,0,18,0.8);}
.interviewSlide [class^="people"][class$="-icon"] {
	position: absolute;
		top: 0;
		right: 0;
	min-width: 120px;
	text-align: center;}
	/*hover時*/
	.interviewSlide figure .imgWrap {
		background: #fff;
		transition: transform 0.4s;}
	.interviewSlide figure.slick-slide.slick-current .imgWrap {
		box-shadow: 13px 0 22px rgba(0,0,0,0.2);}
	.interviewSlide figure.slick-slide.slick-current.hover .imgWrap {
		transform: scale(0.9);}
	@media (min-width:768px) {
		.interviewSlide figure.hover .imgWrap {
			transform: scale(0.9);}
	}
/*btn*/
.viewAll {
	position: absolute;
		bottom: 10px;
		left: 50%;
		transform: translate(-50%,50%);
	display: inline-block;
	color: #fff;}



/* ----------------------------------------
business
----------------------------------------*/
.business {}
.business h2 {
	position: relative;
	width: 480px;
	height: 480px;
	margin: 0 auto;
	padding: 155px 0 0 0;
	color: #fff;
	text-align: center;
	background: rgba(0,0,0,0.8) no-repeat center;
	box-shadow: 3px 0 7px rgba(0,0,0,0.25);
	transition: background 0.4s, box-shadow 0.4s, transform 0.4s;}
	.business a.hover h2 {
		transform: scale(0.9);}
	.business h2:before {
		content: "BUSINESS\A FIELD";
		display: block;
		margin-bottom: 30px;
		font-family: 'Roboto';
		font-size: 4.8rem;
		font-weight: bold;
		line-height: 120%;
		white-space: pre;}
		.businessWrap > a {
			position: relative;
			display: inline-block;
			margin: 0 auto;
			-webkit-tap-highlight-color: rgba(0, 0, 0, 0);}
		.businessWrap > a.hover h2 {
			background-color: rgba(230,0,18,0.75);
			box-shadow: 3px 0 7px rgba(0,0,0,0);}
.businessWrap {
	padding: 110px 0 130px 0;
	background: url(/recruit/images/home/bg-business.jpg) no-repeat center;
	margin-bottom: 10px;
	text-align: center;}
.viewContent {
	position: absolute;
		right: -45px;
		bottom: -45px;
	display: flex;
		justify-content: center;
		align-items: center;
	width: 90px;
	height: 90px;
	background: #e60012;
	transition: box-shadow 0.5s, transform 0.5s;
	box-shadow: 3px 0 7px rgba(0,0,0,0.25);}
.viewContent a {
	width: 100%;
	height: 100%;}
a.hover .viewContent {
	box-shadow: 3px 0 7px rgba(0,0,0,0.0);
	transform: scale(0.9);}
.viewContent .linkArrow {
	position: static;
	transform: scale(1.4);
	transition: transform 0.5s;}
a.hover .viewContent .linkArrow {
	transform: translateX(5px) scale(1.4);}



/* ----------------------------------------
about
----------------------------------------*/
.about {
	padding: 100px 0;
	background: #eee;}
.about h2 {
	margin: 0 0 60px 0;
	/*padding-top: 72px;*/
	text-align: center;
	font-size: 1.8rem;}
	.about h2:before {
		content: "ABOUT US";
		display: block;
		margin-bottom: 30px;
		font-family: 'Roboto';
		font-size: 4.8rem;
		font-weight: bold;
		line-height: 70%;}
.aboutContents {
	width: 1160px;
	margin: 0 auto;}
.aboutMessage {
	display: flex;
	margin: 0 0 20px 0;}
.aboutMessage .imgArea {
	width: calc(100% - 490px);
	min-width: 0;
	overflow: hidden;}
.aboutMessage .imgArea span {
	display: block;
	width: 100%;
	height: 580px;
	background: url(/recruit/images/home/img-aboutMessage_pc.jpg) no-repeat center;}
.aboutMessage .detailArea {
	width: 490px;
	padding: 130px 20px 60px 40px;
	background: #fff;
	text-align: center;}
	.aboutMessage .detailArea *:not(.moreBtnArea) {
		text-align: left;}
.aboutMessage .detailAreaDeco {
	margin: 0 0 40px 0;
	color: #e60012;
	font-size: 2rem;}
.aboutMessage .detailArea h3 {
	margin: 0 0 70px 0;
	color: #333;
	font-size: 3.4rem;
	line-height: 5.3rem;}
.aboutTopMessage {
	margin: 0 0 52px 0;
	color: #333;
	font-size: 1.4rem;
	line-height: 3rem;}
.subArea {
	display: flex;}
.subArea > li {
	width: 420px;
	margin: 0 20px 0 0;
	color: #e60012;
	font-size: 2rem;
	text-align: center;}
.subArea > li:last-child {
	width: 283px;
	margin-right: 0;
	background: none;}
.subArea > li > a {
	position: relative;
	display: block;
	height: 100%;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);}
	.subArea > li > a:after {
		display: none;}
	.subArea  li  a .subAreaWrap {
		height: 100%;
		overflow: hidden;
		transition: transform 0.4s;}
		.subArea  li  a.hover .subAreaWrap {
			transform: scale(0.9);}
.subArea figure {
	/*height: 194px;*/
	transition: transform 0.4s;}
.subArea figure img {
	width: 100%;
	height: 190px;}
/*	.subArea a.hover figure {
		transform: scale(0.9) translateY(calc(420px * 0.1 / 2 - 162 / 342 * 10%));}*/
.txtBox {
	/*position: absolute;
		bottom: 0;*/
	display: flex;
		justify-content: center;
		align-items: center;
	width: 100%;
	height: calc(100% - 190px);
	background: #fff;}
a[target="_blank"] .txtBox:after {
	content: "";
	display: inline-block;
	width: 10px;
	height: 10px;
	margin-left: 10px;
	background: url(/recruit/images/common/blank.png) no-repeat;
	background-size: contain;}

.subArea > li > ul > li {
	margin: 0 0 20px 0;
	/*height: 127px;*/
	color: #e60012;
	font-size: 2rem;}
.subArea > li > ul > li:last-child {
	margin:0;}
.subArea > li > ul > li > a {
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);}
.subArea > li > ul > li > a:after {
	display: none;}
.subArea > li > ul > li > a .subAreaWrap {
	display: flex;
		justify-content: center;
		align-items: center;
	height: 100%;
	line-height: 128px;
	background: #fff;}
.subArea > li > ul > li > a[target="_blank"] .subAreaWrap:after {
	content: "";
	display: inline-block;
	width: 10px;
	height: 10px;
	margin-left: 10px;
	background: url(/recruit/images/common/blank.png) no-repeat;
	background-size: contain;}
/*.subArea > li > ul > li > a.hover {
	transform: scale(0.9);}*/

.entry {
	padding: 85px 0 105px 0;
	text-align: center;}
.entry h2 {
	margin: 0 0 60px 0;
	color: #e60012;
	font-family: 'Roboto';
	font-size: 4.8rem;
	line-height: 70%;}
.entry p {
	margin: 0 0 50px 0;
	color: #333;
	font-size: 2.4rem;}
.entrySelect {
	display: flex;
		justify-content: center;}
.entrySelect li {
	margin: 0 23px 0 0;}
	.entrySelect li:last-child {
		margin-right: 0;}
.entrySelect li a {
	position: relative;
	-webkit-tap-highlight-color: rgba(0,0,0,0);}
.entrySelect li a .linkArrow {
		right: 20px;
		opacity: 0;
		transition: opacity 0.5s;}
.entrySelect li a .entrySelectWrap {
	display: block;
	min-width: 270px;
	height: 100%;
	padding: 30px 10px;
	color: #fff;
	font-size: 1.8rem;
	background: #e60012;
	box-shadow: 3px 0 7px rgba(0,0,0,0.25);
	transition: box-shadow 0.5s, transform 0.5s;}
.entrySelect li a.hover .entrySelectWrap {
	box-shadow: 3px 0 7px rgba(0,0,0,0.0);
	transform: scale(0.9);}
	.entrySelect li a.hover .linkArrow {
		opacity: 1;}