@charset "UTF-8";
/* CSS Document */
table { border-collapse:collapse; }
table caption { text-align:left; font-weight:bold; padding-bottom:.8em; }
table tr { border-top:1px solid #ccc; }
table tr > * { padding:1em; vertical-align:top; }
table tr:last-child { border-bottom:1px solid #ccc; }
table th { font-weight:normal; text-align:left; background-color:#f4f5f6; white-space: nowrap; }
table td { word-break:break-all; }

@keyframes markie {
	from { background-position-x:0%; }
	to { background-position-x:-2400px; }
}
@keyframes cartain {
	0% { opacity:0; }
	50% { opacity:.8; }
	100% { opacity:0; }
}

section.mainvisual {
	position:relative;
	overflow:hidden;
	filter:brightness(30%);
	transition:filter .3s ease .5s;
}
section.mainvisual .texts {
	opacity:0;
	transition:opacity .5s ease 1.5s;
}
section.mainvisual:before {
	content:"";
	display:inline-block;
	width:100%;
	height:100%;
	position:absolute;
	top:0px;
	left:0px;
	background-color:#fff;
	opacity:0;
}
section.mainvisual:after {
	content:"";
	display:inline-block;
	width:100%;
	height:100%;
	position:absolute;
	top:-100%;
	left:0%;

	background: rgb(235,241,246); /* Old browsers */
	background: -moz-linear-gradient(-45deg, rgba(235,241,246,0) 0%, rgba(255,255,255,1) 50%, rgba(213,235,251,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(-45deg, rgba(235,241,246,0) 0%,rgba(255,255,255,1) 50%, rgba(213,235,251,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(135deg, rgba(235,241,246,0) 0%,rgba(255,255,255,1) 50% ,rgba(213,235,251,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ebf1f6', endColorstr='#d5ebfb',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

	opacity:.5;
	transition:transform .5s ease .8s;
}
html.ualoaded section.mainvisual {
	filter:brightness(100%);
}
html.ualoaded section.mainvisual:before {
	animation-name:cartain;
	animation-duration: 1.5s;
	animation-delay: .2s;
	animation-iteration-count: 1;
	animation-direction: normal;
	animation-timing-function: linear;
}
html.ualoaded section.mainvisual:after {
	transform:translateY(200%);
}
html.ualoaded section.mainvisual .texts {
	opacity:1;
}

section.control .table { table-layout:fixed; height:70px; }
section.control nav > .table > .t-cell { width:100%; border-left:1px solid #ccc; }

section.control form input[type="radio"] { display:none; }
section.control form input[type="radio"] + span.anchor { position:relative; }
section.control form input[type="radio"] + span.anchor:after {
	content:"";
	display:inline-block;
	width:100%;
	height:6px;
	background-color:#98cde3;
	position:absolute;
	left:0px;
	bottom:0px;
	opacity:0;
	transition:opacity .3s ease;
}
section.control form input[type="radio"]:checked + span.anchor:after { opacity:1; }
section.control form input[type="radio"]:not(:checked) + span.anchor {
	cursor:pointer;
	color:#0082ad;
}

section.control select {
	-webkit-appearance:none;
	-moz-appearance:none;
	background-color: #fff;
	border: 1px solid #0082ad;
	color: #0082ad;
	font-size: 14px;
	border-radius: 0px;
	height: 31px;
	outline: none;
	padding:0 1em;
	line-height:200%;
	height:40px;
	width:80%;
}

section.result .job-card { margin-bottom:60px; }
section.result .job-card:last-child { margin-bottom:40px; }
section.result .job-card h3 { text-align:center; margin-bottom:40px; line-height:140%; position:relative; }
section.result .job-card h3.NEW:after {
	content: "NEW";
	display: inline-block;
	font-size: 50%;
	padding-left: .25em;
	padding-right: .25em;
	color: #fff;
	background-color: #f55555;
	margin-left: .5em;
	line-height: 150%;
	position: absolute;
	top: calc(50% - 1em);
}
section.result .job-card td a { color:#0082ad; }

section.result .job-card .button.no-arrow:after { content:none; }

section.result[category*="すべて"] .job-card { display:block; }
section.result[category*="営業・サービス系"] .job-card:not([category-name*="営業・サービス系"]),
section.result[category*="管理系"] .job-card:not([category-name*="管理系"]),
section.result[category*="企画・マーケティング系"] .job-card:not([category-name*="企画・マーケティング系"]),
section.result[category*="ITコンサルタント系"] .job-card:not([category-name*="ITコンサルタント系"]),
section.result[category*="ITエンジニア系"] .job-card:not([category-name*="ITエンジニア系"]),
section.result[category*="HWエンジニア系"] .job-card:not([category-name*="HWエンジニア系"]) { display:none; }

section.entry-flow .button.entry > a { color:#fff; background-color:#fda60e; border:1px solid #fda60e; transition:all .3s ease; }
.button.with-arrow:after {
	border-color:#fff;
}
section.entry-flow .button.entry > a:hover { color:#fda60e; background-color:#fff; }
.button.with-arrow:hover:after {
	border-color:#fda60e;
}

section.result td span.indent { display:inline-block; padding-left:1em; text-indent:-1em; }
section.result td span.indent-2 { display:inline-block; padding-left:2em; text-indent:-2em; }

a[href="#headline"] {
	display:inline-block;
	position:relative;
	color:#0082ad;
}
a[href="#headline"]:before {
	content:"";
	display:inline-block;
	width:.5em;
	height:.5em;
	border-top:.08em solid #0082ad;
	border-left:.08em solid #0082ad;
	transform:rotate(45deg);
	margin-right:.5em;
}
a[href="#headline"]:hover {
	text-decoration: underline;
}


/*---------------------------
	   for large view
---------------------------*/
@media screen and ( min-width:769px ) and (min-device-width:813px) {

	section.mainvisual {
		height:480px;
		position:relative;
		background-image:url(https://www.softbankrobotics.com/jp/set/data/recruit/img/main.jpg);
	}

	html.ualoaded section.mainvisual {
		animation-name:markie;
		animation-duration:70s;
		animation-delay:1.8s;
		animation-iteration-count: infinite;
		animation-direction: normal;
		animation-timing-function: linear;
	}

	section.mainvisual .texts {
		position:relative;
		top:40%;
	}

	section.result .job-card .button { width:270px; height:50px; text-align:center; }

	section.entry-flow .button.entry {
		margin-left:auto;
		margin-right:auto;
		width:380px;
		height:72px;
	}

	.divider {
		height:240px;
		background-image:url(https://www.softbankrobotics.com/jp/set/data/recruit/img/divider.jpg);
		background-position:center;
	}

}



@media screen and ( min-width:769px ) and ( max-width:900px ){

}



/*---------------------------
	   for small view
---------------------------*/
@media screen and ( max-width:768.9px ), screen and (max-device-width:812.9px) {
	section.mainvisual {
		height:240px;
		position:relative;
		background-image:url(https://www.softbankrobotics.com/jp/set/data/recruit/img/mainvisual.jpg);
		background-size:1200px 240px;
		animation-name:markie-sp;
		animation-duration:40s;
		animation-delay:1.8s;
		animation-iteration-count: infinite;
		animation-direction: normal;
		animation-timing-function: linear;
	}

	section.mainvisual .texts {
		position:relative;
	}

	section.mainvisual .texts h2 {
		margin-bottom:0;
	}
	section.mainvisual .texts h2 img { max-width:203.5px; }

	img[src$="flow_pic01_sp.png"] { max-width:335px; }

	section.result .job-card .button {
		text-align:center;
		width:202.5px;
		height:35.5px;
	}

	@keyframes markie-sp {
		0% { background-position-x:0%; }
		100% { background-position-x:-1200px; }
	}

	.divider {
		height:120px;
		background-image:url(https://www.softbankrobotics.com/jp/set/data/recruit/img/divider.jpg);
		background-position:center;
		background-size:cover;
		background-repeat:repeat-x;
	}

}

/*---------------------------
	   for large view
---------------------------*/
/* slick設定 */
.slider {
  width: 50%;
  margin: 100px auto;
}
.slick-slide {
  margin: 0px 15px;
}
.slick-slide img {
  width: 100%;
}
.slick-prev:before {
	content: url(/jp/set/data/recruit/img/slide_arrow_left.png);
}
.slick-next:before {
	content: url(/jp/set/data/recruit/img/slide_arrow_right.png);
}
.slick-slide {
  position: relative;
  transition: 0;
  opacity: 1;
}
.slick-slide > figure {
  position: relative;;
  z-index: 10;
}
.slick-list {
  padding-bottom: 20px;
}
.slick-active {
  opacity: 1;
}
.slick-current {
  opacity: 1;
}
.slick_wrapper {
  padding: 0 15px;
}
.slick-dotted.slick-slider {
  margin-bottom: 60px;
}
.slick-dots{
	display: none;
}
@media screen and (max-width: 768px) {
  .slick_wrapper {
    overflow: hidden;
    margin: 0 -20px;
    padding: 0 0;
  }
}

/* 社長メッセージ */
.top_message {
	padding: 50px;
	background-color: #f6f6f6;
}
.top_figure {
  width: 24%;
}
@media screen and (max-width: 768px) {
	.top_message {
		margin: 0 -20px;
		padding: 30px;
	}
	.top_figure {
	  width: 100%;
		margin-top: 1.5rem;
	}
}

/* 先輩社員 */
.member_box {
	display: block;
	position: relative;
	outline: none!important;
}
.member_box figure {
	width: 100%;
	height: 100%;
	background-color: #000;
}
.member_box figure img {
	transition: .3s;
}
.member_box:hover figure img {
	opacity: .35;
}
.member_profile {
	position: relative;
	width: 90%;
	margin: -1rem auto 0;
	padding: 1rem 0;
	text-align: center;
	background-color: #fff;
	color: #000000;
	font-size: 15px;
	z-index: 20;
}
.member_profile li:nth-child(2) {
	margin-top: 10px;
	font-size: 14px;
}
.member_profile li:first-child {
	margin-top: 0;
	font-size: 16px;
	font-weight: bold;
}
.member_comment {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, 150%);
	width: 90%;
	text-align: center;
	color: #fff;
	font-size: 14px;
	z-index: 100;
	opacity: 0;
	transition: .35s;
}
.member_box:hover .member_comment {
	transform: translate(-50%, -45%);
	opacity: 1;
}

/* 一覧ページ */
.mainvisual_interview {
	overflow-x: hidden;
}
.mainvisual_interview figure.s-hide {
	position: relative;
	height: 400px;
}
.mainvisual_interview figure.s-hide img {
	position: absolute;
	left: calc(50% - 1000px);
}
.interview_wrapper div {
	margin-left: 5%;
}
.interview_wrapper div:nth-of-type(1),
.interview_wrapper div:nth-of-type(4) {
	margin-left: 0;
}
.interview_wrapper div:nth-of-type(n+4) {
	margin-top: 4%;
}
@media screen and (max-width: 768px) {
	.interview_wrapper div {
		margin-top: 40px;
		margin-left: 0;
		padding: 0 15px;
	}
	.interview_wrapper div:nth-of-type(n+4) {
		margin-top: 40px;
	}
}

/* プロジェクト紹介 */

.middle-inner{
 margin-left:0;
  display: flex;
  justify-content: space-evenly;
}

@media (max-width: 767px) {
  .middle-inner {
    flex-direction: column;
  }

	.right-unit{
		margin-top: 40px;
	}
}

.entry-inner .container{
	margin: 0 auto 40px auto;
}