@charset "utf-8";

/*=========================================*/
/* トップページ */
/*=========================================*/

@media screen and (min-width: 1201px), print{

.topButton a:link{
	display: block;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, .75);
	text-decoration: none;
	font-size: 100%;
	color: #ffffff;
	transition: all 0.2s ease-in 0s;
}

.topButton a:visited{
	display: block;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, .75);
	text-decoration: none;
	font-size: 100%;
	color: #ffffff;
	transition: all 0.2s ease-in 0s;
}

.topButton a:hover,
.topButton a:active{
	display: block;
	width: 100%;
	height: 100%;
	background-color: rgba(128, 128, 128, .75);
	text-decoration: none;
	font-size: 100%;
	color: #ffffff;
	transition: all 0.2s ease-in 0s;
}

.topButton a:link span{
	display: block;
	position: relative;
	top: 50%;
	-ms-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 100%;
	text-align: center;
}

.topButton a:visited span{
	display: block;
	position: relative;
	top: 50%;
	-ms-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 100%;
	text-align: center;
}

.topButton a:hover span,
.topButton a:active span{
	display: block;
	position: relative;
	top: 50%;
	-ms-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 100%;
	text-align: center;
}

/*-- HERO --*/

.contentTopHero{
	height: 50%;
	max-height: 780px;
	margin: 0 0 16px 0;
	background: url(/recruit/career/index/images/top_page/top_bg_hero.jpg) no-repeat 88% 28% / 2000px auto;
}

.contentTopHero .contentArea{
	text-align: left;
}

.contentTopHero .h2Catch{
	padding: 196px 0 0 0;
	font-weight: 700;
	font-style: normal;
	color:#af1144;
	line-height: 100%;
}

.contentTopHero .h2Catch img{
}

.contentTopHero .heroNews{
	display: inline-block;
	width: 430px;
	margin: 56px 0 186px 20px;
	padding: 30px 40px 22px 40px;
	background: rgba(0,0,0,1);
	background: linear-gradient(90deg, rgba(0,0,0,.7), rgba(0,0,0,1));
	text-align: left;
	font-size: 90%;
	font-weight: 500;
	font-style: normal;
	color:#ffffff;
	line-height: 150%;
}

.contentTopHero .heroNews a:link{
	text-decoration: underline;
	color:#ffffff;
}

.contentTopHero .heroNews a:visited{
	text-decoration: underline;
	color:#ffffff;
}

.contentTopHero .heroNews a:hover,
.contentTopHero .heroNews a:active{
	text-decoration: none;
	color:#ffffff;
}

.contentTopHero .heroNews dd{
	margin: 0 0 8px 5px;
}


/*-- COMPANY --*/

.contentTopCompany{
	background: url(/recruit/career/index/images/top_page/top_bg_company.jpg) no-repeat center center / 100% auto;
}

.contentTopCompany .contentArea{
	padding: 72px 0 64px 0;
}

.contentTopCompany .h2Title{
	margin: 0 0 26px 0;
	font-size: 375%;
	font-weight: 700;
	font-style: normal;
	color:#af1144;
	line-height: 100%;
}

.contentTopCompany .contentCatch{
	margin: 0 0 52px 0;
	font-size: 165%;
	font-style: normal;
	color:#000000;
	line-height: 100%;
}

.contentTopCompany .companyAttitude{
	width: 1000px;
	margin: 0 auto 0 auto;
	padding: 46px 0 12px 0;
	background-color: rgba(36,13,6,0.4);
}

.contentTopCompany .companyAttitude p{
	margin: 0 0 32px 0;
	text-align: center;
	font-size: 125%;
	color: #fff;
	line-height: 175%;
}

.contentTopCompany .companyAttitude p br{
	display: inline;
}

.contentTopCompany .topButton{
	display: block;
	width: 260px;
	height: 50px;
	border: solid 2px #ffffff;
	margin: 42px auto 0 auto;
}

/*-- INTERVIEW --*/

.contentTopInterview{
	background-color: #ffffff;
}

.contentTopInterview .contentArea{
	padding: 72px 0 64px 0;
}

.contentTopInterview .h2Title{
	margin: 0 0 26px 0;
	font-size: 375%;
	font-weight: 700;
	font-style: normal;
	color:#af1144;
	line-height: 100%;
}

.contentTopInterview .contentCatch{
	margin: 0 0 52px 0;
	font-size: 165%;
	font-style: normal;
	color:#000000;
	line-height: 100%;
}

.contentTopInterview .interviewList{
	list-style-type: none;
	width: 100%;
	border-top: solid 5px #e8e8e8;
	border-bottom: solid 5px #e8e8e8;
}

.contentTopInterview .interviewList::after{
	display: block;
	clear: both;
	content: "";
}

.contentTopInterview .interviewList li{
	float: left;
	position: relative;
	width: 16.666%;
}

.contentTopInterview .interviewList li.interview01{
	background: url(/recruit/career/index/images/top_page/top_interview_01.jpg) no-repeat center top / 100% auto;
}

.contentTopInterview .interviewList li.interview02{
	background: url(/recruit/career/index/images/top_page/top_interview_02.jpg) no-repeat center top / 100% auto;
}

.contentTopInterview .interviewList li.interview03{
	background: url(/recruit/career/index/images/top_page/top_interview_03.jpg) no-repeat center top / 100% auto;
}

.contentTopInterview .interviewList li.interview04{
	background: url(/recruit/career/index/images/top_page/top_interview_04.jpg) no-repeat center top / 100% auto;
}

.contentTopInterview .interviewList li.interview05{
	background: url(/recruit/career/index/images/top_page/top_interview_05.jpg) no-repeat center top / 100% auto;
}
  
.contentTopInterview .interviewList li.interview06{
	background: url(/recruit/career/index/images/top_page/top_interview_06.jpg) no-repeat center top / 100% auto;
}
  

.contentTopInterview .interviewList li::after{
	display: block;
	padding: 150% 0 0 0;
	content: "";
}

.contentTopInterview .interviewList li a:link{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: transparent;
	text-decoration: none;
	display: block;
	z-index: 2;
	transition: all 0.2s ease-in 0s;
}

.contentTopInterview .interviewList li a:visited{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: transparent;
	text-decoration: none;
	display: block;
	z-index: 2;
	transition: all 0.2s ease-in 0s;
}

.contentTopInterview .interviewList li a:hover,
.contentTopInterview .interviewList li a:active{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(175,17,68,.5);
	text-decoration: none;
	display: block;
	z-index: 2;
	transition: all 0.2s ease-in 0s;
}

.contentTopInterview .interviewList li a .interviewInterviewee{
	position: absolute;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%,-50%);
	-moz-transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
	width: 92%;
	padding: 80% 0 0 8%;
	text-align: left;
}

.contentTopInterview .interviewList li a:link .interviewInterviewee .interviewOccupation{
	font-size: 190%;
	font-weight: 700;
	font-style: normal;
	color:#af1144;
	line-height: 120%;
	transition: all 0.2s ease-in 0s;
}

.contentTopInterview .interviewList li a:visited .interviewInterviewee .interviewOccupation{
	font-size: 190%;
	font-weight: 700;
	font-style: normal;
	color:#af1144;
	line-height: 120%;
	transition: all 0.2s ease-in 0s;
}

.contentTopInterview .interviewList li a:hover .interviewInterviewee .interviewOccupation,
.contentTopInterview .interviewList li a:active .interviewInterviewee .interviewOccupation{
	font-size: 190%;
	font-weight: 700;
	font-style: normal;
	color:#ffffff;
	line-height: 120%;
	transition: all 0.2s ease-in 0s;
}

.contentTopInterview .interviewList li.interview01 a:link .interviewInterviewee .interviewJoin{
	color: #ffffff;
}
.contentTopInterview .interviewList li.interview01 a:visited .interviewInterviewee .interviewJoin{
	color: #ffffff;
}
.contentTopInterview .interviewList li.interview01 a:hover .interviewInterviewee .interviewJoin,
.contentTopInterview .interviewList li.interview01 a:active .interviewInterviewee .interviewJoin{
	color: #ffffff;
}

.contentTopInterview .interviewList li.interview02 a:link .interviewInterviewee .interviewJoin{
	color: #000000;
}
.contentTopInterview .interviewList li.interview02 a:visited .interviewInterviewee .interviewJoin{
	color: #000000;
}
.contentTopInterview .interviewList li.interview02 a:hover .interviewInterviewee .interviewJoin,
.contentTopInterview .interviewList li.interview02 a:active .interviewInterviewee .interviewJoin{
	color: #000000;
}

.contentTopInterview .interviewList li.interview03 a:link .interviewInterviewee .interviewJoin{
	color: #000000;
}
.contentTopInterview .interviewList li.interview03 a:visited .interviewInterviewee .interviewJoin{
	color: #000000;
}
.contentTopInterview .interviewList li.interview03 a:hover .interviewInterviewee .interviewJoin,
.contentTopInterview .interviewList li.interview03 a:active .interviewInterviewee .interviewJoin{
	color: #000000;
}

.contentTopInterview .interviewList li.interview04 a:link .interviewInterviewee .interviewJoin{
	color: #ffffff;
}
.contentTopInterview .interviewList li.interview04 a:visited .interviewInterviewee .interviewJoin{
	color: #ffffff;
}
.contentTopInterview .interviewList li.interview04 a:hover .interviewInterviewee .interviewJoin,
.contentTopInterview .interviewList li.interview04 a:active .interviewInterviewee .interviewJoin{
	color: #ffffff;
}

.contentTopInterview .interviewList li.interview05 a:link .interviewInterviewee .interviewJoin{
	color: #ffffff;
}
.contentTopInterview .interviewList li.interview05 a:visited .interviewInterviewee .interviewJoin{
	color: #ffffff;
}
.contentTopInterview .interviewList li.interview05 a:hover .interviewInterviewee .interviewJoin,
.contentTopInterview .interviewList li.interview05 a:active .interviewInterviewee .interviewJoin{
	color: #ffffff;
}
  
.contentTopInterview .interviewList li.interview06 a:link .interviewInterviewee .interviewJoin{
	color: #ffffff;
}
.contentTopInterview .interviewList li.interview06 a:visited .interviewInterviewee .interviewJoin{
	color: #ffffff;
}
.contentTopInterview .interviewList li.interview06 a:hover .interviewInterviewee .interviewJoin,
.contentTopInterview .interviewList li.interview06 a:active .interviewInterviewee .interviewJoin{
	color: #ffffff;
}  

.contentTopInterview .topButton{
	display: block;
	width: 260px;
	height: 50px;
	margin: 42px auto 0 auto;
	border: solid 2px #ffffff;
}

/*-- RECRUIT --*/

.contentTopRecruit{
	background: url(/recruit/career/index/images/top_page/top_bg_recruit.jpg) no-repeat center center / 100% auto;
}

.contentTopRecruit .contentArea{
	padding: 72px 0 64px 0;
}

.contentTopRecruit .h2Title{
	margin: 0 0 26px 0;
	font-size: 375%;
	font-weight: 700;
	font-style: normal;
	color:#af1144;
	line-height: 100%;
}

.contentTopRecruit .contentCatch{
	margin: 0 0 52px 0;
	font-size: 165%;
	font-style: normal;
	color:#ffffff;
	line-height: 100%;
}

.contentTopRecruit .recruitList{
	list-style: none;
	display: block;
	width: 90%;
	max-width: 1344px;
	margin: 0 auto 0 auto;
}

.contentTopRecruit .recruitList::after{
	content: "";
	display: block;
	clear: both;
}

.contentTopRecruit .recruitList li{
	float: left;
	position: relative;
	width: 28%;
	width: -webkit-calc((100% - 96px) / 3);
	width: -moz-calc((100% - 96px) / 3);
	width: calc((100% - 96px) / 3);
	max-width: 416px;
	margin: 0 16px 0 16px;
}

.contentTopRecruit .recruitList li.recruitPersonnel{
	background: url(/recruit/career/index/images/top_page/top_recruit_personnel.jpg) no-repeat center center / 100% auto;
}

.contentTopRecruit .recruitList li.recruitFAQ{
	background: url(/recruit/career/index/images/top_page/top_recruit_faq.jpg) no-repeat center center / 100% auto;
}

.contentTopRecruit .recruitList li.recruitIndex{
	background: url(/recruit/career/index/images/top_page/top_recruit_index.jpg) no-repeat center center / 100% auto;
}

.contentTopRecruit .recruitList li::after{
	display: block;
	padding: 75% 0 0 0;
	content: "";
}

.contentTopRecruit .recruitList li a:link{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,.3);
	background-image: url(/recruit/career/index/images/top_page/top_texture_stripe.png);
	text-decoration: none;
	display: block;
	z-index: 2;
	transition: all 0.2s ease-in 0s;
}

.contentTopRecruit .recruitList li a:visited{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,.3);
	background-image: url(/recruit/career/index/images/top_page/top_texture_stripe.png);
	text-decoration: none;
	display: block;
	z-index: 2;
	transition: all 0.2s ease-in 0s;
}

.contentTopRecruit .recruitList li a:hover,
.contentTopRecruit .recruitList li a:active{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,.0);
	background-image: url(/recruit/career/index/images/top_page/top_texture_stripe.png);
	text-decoration: none;
	display: block;
	z-index: 2;
	transition: all 0.2s ease-in 0s;
}

.contentTopRecruit .recruitList li a:link div{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 33%;
	background-color: rgba(175,17,68,.6);
	transition: all 0.2s ease-in 0s;
}

.contentTopRecruit .recruitList li a:visited div{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 33%;
	background-color: rgba(175,17,68,.6);
	transition: all 0.2s ease-in 0s;
}

.contentTopRecruit .recruitList li a:hover div,
.contentTopRecruit .recruitList li a:active div{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 33%;
	background-color: rgba(175,17,68,.75);
	transition: all 0.2s ease-in 0s;
}

.contentTopRecruit .recruitList li a div p{
	position: absolute;
	top: 50%;
	left: 0;
	-ms-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 100%;
	text-align: center;
	font-size: 115%;
	color: #ffffff;
	line-height: 150%;
}

}

@media screen and (max-width: 1200px){

.topButton a:link{
	display: block;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, .75);
	text-decoration: none;
	font-size: 100%;
	color: #ffffff;
	transition: all 0.2s ease-in 0s;
}

.topButton a:visited{
	display: block;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, .75);
	text-decoration: none;
	font-size: 100%;
	color: #ffffff;
	transition: all 0.2s ease-in 0s;
}

.topButton a:hover,
.topButton a:active{
	display: block;
	width: 100%;
	height: 100%;
	background-color: rgba(128, 128, 128, .75);
	text-decoration: none;
	font-size: 100%;
	color: #ffffff;
	transition: all 0.2s ease-in 0s;
}

.topButton a:link span{
	display: block;
	position: relative;
	top: 50%;
	-ms-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 100%;
	text-align: center;
}

.topButton a:visited span{
	display: block;
	position: relative;
	top: 50%;
	-ms-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 100%;
	text-align: center;
}

.topButton a:hover span,
.topButton a:active span{
	display: block;
	position: relative;
	top: 50%;
	-ms-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 100%;
	text-align: center;
}

/*-- HERO --*/

.contentTopHero{
	height: auto;
	margin: 0 0 16px 0;
	padding: 0 0 42px 0;
	background: url(/recruit/career/index/images/top_page/top_bg_hero.jpg) no-repeat 80% top / 1200px auto;
}

.contentTopHero .contentArea{
}

.contentTopHero .h2Catch{
	margin: 0 auto 0 0;
	padding: 144px 0 0 2%;
	text-align: left;
	font-weight: 700;
	font-style: normal;
	color:#af1144;
	line-height: 100%;
}

.contentTopHero .h2Catch img{
	width: 80%;
	max-width: 569px;
	height: auto;
}

.contentTopHero .heroNews{
	position: static;
	display: block;
	width: 50%;
	min-width: 496px;
	margin: 24px auto 0 2%;
	padding: 24px 32px 16px 32px;
	background: rgba(0,0,0,1);
	background: linear-gradient(90deg, rgba(0,0,0,.7), rgba(0,0,0,1));
	text-align: left;
	font-size: 85%;
	font-weight: 500;
	font-style: normal;
	color:#ffffff;
	line-height: 150%;
}

.contentTopHero .heroNews a:link{
	text-decoration: underline;
	color:#ffffff;
}

.contentTopHero .heroNews a:visited{
	text-decoration: underline;
	color:#ffffff;
}

.contentTopHero .heroNews a:hover,
.contentTopHero .heroNews a:active{
	text-decoration: none;
	color:#ffffff;
}

.contentTopHero .heroNews dd{
	margin: 0 0 8px 5px;
}


/*-- COMPANY --*/

.contentTopCompany{
	background: url(/recruit/career/index/images/top_page/top_bg_company.jpg) no-repeat center center / 1200px auto;
}

.contentTopCompany .contentArea{
	padding: 32px 0 56px 0;
}

.contentTopCompany .h2Title{
	margin: 0 0 8px 0;
	font-size: 300%;
	font-weight: 700;
	font-style: normal;
	color:#af1144;
	line-height: 100%;
}

.contentTopCompany .contentCatch{
	margin: 0 0 24px 0;
	font-size: 135%;
	font-style: normal;
	color:#000000;
	line-height: 120%;
}

.contentTopCompany .companyAttitude{
	width: 82%;
	width: -webkit-calc(90% - 64px);
	width: -moz-calc(90% - 64px);
	width: calc(90% - 64px);
	min-width: 512px;
	margin: 0 auto 0 auto;
	padding: 28px 24px 12px 24px;
	background-color: rgba(36,13,6,0.4);
}

.contentTopCompany .companyAttitude p {
	margin: 0 0 16px 0;
	text-align: center;
	font-size: 100%;
	color: #fff;
	line-height: 175%;
}

.contentTopCompany .companyAttitude p br{
	display: inline;
}

.contentTopCompany .topButton{
	display: block;
	width: 50%;
	height: 50px;
	border: solid 2px #ffffff;
	margin: 24px auto 0 auto;
}

/*-- INTERVIEW --*/

.contentTopInterview{
	background-color: #ffffff;
}

.contentTopInterview .contentArea{
	padding: 32px 0 56px 0;
}

.contentTopInterview .h2Title{
	margin: 0 0 8px 0;
	font-size: 300%;
	font-weight: 700;
	font-style: normal;
	color:#af1144;
	line-height: 100%;
}

.contentTopInterview .contentCatch{
	margin: 0 0 24px 0;
	font-size: 135%;
	font-style: normal;
	color:#000000;
	line-height: 120%;
}

.contentTopInterview .interviewList{
	list-style-type: none;
	display: block;
	border-top: solid 5px #e8e8e8;
	border-bottom: solid 5px #e8e8e8;
}

.contentTopInterview .interviewList li{
	position: relative;
	width: 100%;
}

.contentTopInterview .interviewList li.interview01{
	background: url(/recruit/career/index/images/top_page/top_interview_sp01.jpg) no-repeat 30% top / auto 110%;
}

.contentTopInterview .interviewList li.interview02{
	background: url(/recruit/career/index/images/top_page/top_interview_sp02.jpg) no-repeat 30% top / auto 110%;
}

.contentTopInterview .interviewList li.interview03{
	background: url(/recruit/career/index/images/top_page/top_interview_sp03.jpg) no-repeat 30% top / auto 110%;
}

.contentTopInterview .interviewList li.interview04{
	background: url(/recruit/career/index/images/top_page/top_interview_sp04.jpg) no-repeat 30% top / auto 110%;
}

.contentTopInterview .interviewList li.interview05{
	background: url(/recruit/career/index/images/top_page/top_interview_sp05.jpg) no-repeat 30% top / auto 110%;
}

.contentTopInterview .interviewList li.interview06{
	background: url(/recruit/career/index/images/top_page/top_interview_sp06.jpg) no-repeat 30% top / auto 110%;
}
  
  
.contentTopInterview .interviewList li::after{
	display: block;
	padding: 20% 0 0 0;
	content: "";
}

.contentTopInterview .interviewList li a:link{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: transparent;
	text-decoration: none;
	display: block;
	z-index: 2;
	transition: all 0.2s ease-in 0s;
}

.contentTopInterview .interviewList li a:visited{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: transparent;
	text-decoration: none;
	display: block;
	z-index: 2;
	transition: all 0.2s ease-in 0s;
}

.contentTopInterview .interviewList li a:hover,
.contentTopInterview .interviewList li a:active{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(175,17,68,.5);
	text-decoration: none;
	display: block;
	z-index: 2;
	transition: all 0.2s ease-in 0s;
}

.contentTopInterview .interviewList li a .interviewInterviewee{
	position: relative;
	top: 50%;
	-ms-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	display: inline-block;
	width: 64%;
	margin: 0 auto 0 auto;
	padding: 0 0 0 0;
	text-align: left;
}

.contentTopInterview .interviewList li a:link .interviewInterviewee .interviewOccupation{
	font-size: 200%;
	font-weight: 700;
	font-style: normal;
	color:#af1144;
	line-height: 120%;
	transition: all 0.2s ease-in 0s;
}

.contentTopInterview .interviewList li a:visited .interviewInterviewee .interviewOccupation{
	font-size: 200%;
	font-weight: 700;
	font-style: normal;
	color:#af1144;
	line-height: 120%;
	transition: all 0.2s ease-in 0s;
}

.contentTopInterview .interviewList li a:hover .interviewInterviewee .interviewOccupation,
.contentTopInterview .interviewList li a:active .interviewInterviewee .interviewOccupation{
	font-size: 200%;
	font-weight: 700;
	font-style: normal;
	color:#ffffff;
	line-height: 120%;
	transition: all 0.2s ease-in 0s;
}

.contentTopInterview .interviewList li.interview01 a:link .interviewInterviewee .interviewJoin{
	color: #000000;
}
.contentTopInterview .interviewList li.interview01 a:visited .interviewInterviewee .interviewJoin{
	color: #000000;
}
.contentTopInterview .interviewList li.interview01 a:hover .interviewInterviewee .interviewJoin,
.contentTopInterview .interviewList li.interview01 a:active .interviewInterviewee .interviewJoin{
	color: #000000;
}

.contentTopInterview .interviewList li.interview02 a:link .interviewInterviewee .interviewJoin{
	color: #000000;
}
.contentTopInterview .interviewList li.interview02 a:visited .interviewInterviewee .interviewJoin{
	color: #000000;
}
.contentTopInterview .interviewList li.interview02 a:hover .interviewInterviewee .interviewJoin,
.contentTopInterview .interviewList li.interview02 a:active .interviewInterviewee .interviewJoin{
	color: #000000;
}

.contentTopInterview .interviewList li.interview03 a:link .interviewInterviewee .interviewJoin{
	color: #000000;
}
.contentTopInterview .interviewList li.interview03 a:visited .interviewInterviewee .interviewJoin{
	color: #000000;
}
.contentTopInterview .interviewList li.interview03 a:hover .interviewInterviewee .interviewJoin,
.contentTopInterview .interviewList li.interview03 a:active .interviewInterviewee .interviewJoin{
	color: #000000;
}

.contentTopInterview .interviewList li.interview04 a:link .interviewInterviewee .interviewJoin{
	color: #000000;
}
.contentTopInterview .interviewList li.interview04 a:visited .interviewInterviewee .interviewJoin{
	color: #000000;
}
.contentTopInterview .interviewList li.interview04 a:hover .interviewInterviewee .interviewJoin,
.contentTopInterview .interviewList li.interview04 a:active .interviewInterviewee .interviewJoin{
	color: #000000;
}

.contentTopInterview .interviewList li.interview05 a:link .interviewInterviewee .interviewJoin{
	color: #000000;
}
.contentTopInterview .interviewList li.interview05 a:visited .interviewInterviewee .interviewJoin{
	color: #000000;
}
.contentTopInterview .interviewList li.interview05 a:hover .interviewInterviewee .interviewJoin,
.contentTopInterview .interviewList li.interview05 a:active .interviewInterviewee .interviewJoin{
	color: #000000;
}

.contentTopInterview .interviewList li.interview06 a:link .interviewInterviewee .interviewJoin{
	color: #000000;
}
.contentTopInterview .interviewList li.interview06 a:visited .interviewInterviewee .interviewJoin{
	color: #000000;
}
.contentTopInterview .interviewList li.interview06 a:hover .interviewInterviewee .interviewJoin,
.contentTopInterview .interviewList li.interview06 a:active .interviewInterviewee .interviewJoin{
	color: #000000;
}  
  
.contentTopInterview .topButton{
	display: block;
	width: 50%;
	height: 50px;
	margin: 24px auto 0 auto;
	border: solid 2px #ffffff;
}

/*-- RECRUIT --*/

.contentTopRecruit{
	background: url(/recruit/career/index/images/top_page/top_bg_recruit.jpg) no-repeat center center / 1200px auto;
}

.contentTopRecruit .contentArea{
	padding: 32px 0 56px 0;
}

.contentTopRecruit .h2Title{
	margin: 0 0 8px 0;
	font-size: 300%;
	font-weight: 700;
	font-style: normal;
	color:#af1144;
	line-height: 100%;
}

.contentTopRecruit .contentCatch{
	margin: 0 0 24px 0;
	font-size: 135%;
	font-style: normal;
	color:#ffffff;
	line-height: 120%;
}

.contentTopRecruit .recruitList{
	list-style: none;
	display: block;
	width: 90%;
	margin: 0 auto 0 auto;
}

.contentTopRecruit .recruitList::after{
	content: "";
	display: block;
	clear: both;
}

.contentTopRecruit .recruitList li{
	float: left;
	position: relative;
	width: 28%;
	width: -webkit-calc((100% - 72px) / 3);
	width: -moz-calc((100% - 72px) / 3);
	width: calc((100% - 72px) / 3);
	margin: 0 12px 0 12px;
}


.contentTopRecruit .recruitList li.recruitPersonnel{
	background: url(/recruit/career/index/images/top_page/top_recruit_personnel.jpg) no-repeat center center / 100% auto;
}

.contentTopRecruit .recruitList li.recruitFAQ{
	background: url(/recruit/career/index/images/top_page/top_recruit_faq.jpg) no-repeat center center / 100% auto;
}

.contentTopRecruit .recruitList li.recruitIndex{
	background: url(/recruit/career/index/images/top_page/top_recruit_index.jpg) no-repeat center center / 100% auto;
}

.contentTopRecruit .recruitList li::after{
	display: block;
	padding: 75% 0 0 0;
	content: "";
}

.contentTopRecruit .recruitList li a:link{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,.3);
	background-image: url(/recruit/career/index/images/top_page/top_texture_stripe.png);
	text-decoration: none;
	display: block;
	z-index: 2;
	transition: all 0.2s ease-in 0s;
}

.contentTopRecruit .recruitList li a:visited{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,.3);
	background-image: url(/recruit/career/index/images/top_page/top_texture_stripe.png);
	text-decoration: none;
	display: block;
	z-index: 2;
	transition: all 0.2s ease-in 0s;
}

.contentTopRecruit .recruitList li a:hover,
.contentTopRecruit .recruitList li a:active{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,.0);
	background-image: url(/recruit/career/index/images/top_page/top_texture_stripe.png);
	text-decoration: none;
	display: block;
	z-index: 2;
	transition: all 0.2s ease-in 0s;
}

.contentTopRecruit .recruitList li a:link div{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 33%;
	background-color: rgba(175,17,68,.6);
	transition: all 0.2s ease-in 0s;
}

.contentTopRecruit .recruitList li a:visited div{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 33%;
	background-color: rgba(175,17,68,.6);
	transition: all 0.2s ease-in 0s;
}

.contentTopRecruit .recruitList li a:hover div,
.contentTopRecruit .recruitList li a:active div{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 33%;
	background-color: rgba(175,17,68,.75);
	transition: all 0.2s ease-in 0s;
}

.contentTopRecruit .recruitList li a div p{
	position: absolute;
	top: 50%;
	left: 0;
	-ms-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 100%;
	text-align: center;
	font-size: 90%;
	color: #ffffff;
	line-height: 150%;
}

}

@media screen and (max-width: 640px){
	
.topButton a:link{
	display: block;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, .75);
	text-decoration: none;
	font-size: 100%;
	color: #ffffff;
	transition: all 0.2s ease-in 0s;
}

.topButton a:visited{
	display: block;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, .75);
	text-decoration: none;
	font-size: 100%;
	color: #ffffff;
	transition: all 0.2s ease-in 0s;
}

.topButton a:hover,
.topButton a:active{
	display: block;
	width: 100%;
	height: 100%;
	background-color: rgba(128, 128, 128, .75);
	text-decoration: none;
	font-size: 100%;
	color: #ffffff;
	transition: all 0.2s ease-in 0s;
}

.topButton a:link span{
	display: block;
	position: relative;
	top: 50%;
	-ms-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 100%;
	text-align: center;
}

.topButton a:visited span{
	display: block;
	position: relative;
	top: 50%;
	-ms-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 100%;
	text-align: center;
}

.topButton a:hover span,
.topButton a:active span{
	display: block;
	position: relative;
	top: 50%;
	-ms-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 100%;
	text-align: center;
}

	/*-- HERO --*/

.contentTopHero{
	position: relative;
	height: 100vw;
	margin: 0 0 16px 0;
	padding: 0 0 42px 0;
	background: url(/recruit/career/index/images/top_page/top_bg_herosp.jpg) no-repeat center bottom / 120% auto;
}

.contentTopHero .contentArea{
}

.contentTopHero .h2Catch{
	margin: 0 auto 0 0;
	padding: 36px 0 0 0;
	text-align: left;
	font-weight: 700;
	font-style: normal;
	color:#af1144;
	line-height: 100%;
}

.contentTopHero .h2Catch img{
	width: 100%;
	max-width: none;
	height: auto;
}

.contentTopHero .heroNews{
	position: absolute;
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%,-50%);
	-moz-transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
	display: block;
	width: 98%;
	width: 75vw;
	min-width: auto;
	margin: 9% 0 0 0;
	padding: 16px 24px 8px 24px;
	background: rgba(0,0,0,1);
	background: linear-gradient(90deg, rgba(0,0,0,.7), rgba(0,0,0,1));
	text-align: left;
	font-size: 85%;
	font-weight: 500;
	font-style: normal;
	color:#ffffff;
	line-height: 150%;
}

.contentTopHero .heroNews a:link{
	text-decoration: underline;
	color:#ffffff;
}

.contentTopHero .heroNews a:visited{
	text-decoration: underline;
	color:#ffffff;
}

.contentTopHero .heroNews a:hover,
.contentTopHero .heroNews a:active{
	text-decoration: none;
	color:#ffffff;
}

.contentTopHero .heroNews dd{
	margin: 0 0 8px 5px;
}


	/*-- COMPANY --*/

.contentTopCompany{
	background: url(/recruit/career/index/images/top_page/top_bg_company.jpg) no-repeat center center / auto 100%;
}

.contentTopCompany .contentArea{
	padding: 32px 0 56px 0;
}

.contentTopCompany .h2Title{
	margin: 0 0 4px 0;
	font-size: 240%;
	font-weight: 700;
	font-style: normal;
	color:#af1144;
	line-height: 100%;
}

.contentTopCompany .contentCatch{
	margin: 0 0 16px 0;
	font-size: 120%;
	font-style: normal;
	color:#000000;
	line-height: 120%;
}

.contentTopCompany .companyAttitude{
	width: 98%;
		width: -webkit-calc(100% - 32px);
		width: -moz-calc(100% - 32px);
		width: calc(100% - 40px);
	min-width: auto;
	margin: 0 auto 0 auto;
	padding: 28px 16px 12px 16px;
	background-color: rgba(36,13,6,0.4);
}

.contentTopCompany .companyAttitude p {
	margin: 0 0 16px 0;
	text-align: left;
	font-size: 100%;
	color: #fff;
	line-height: 175%;
}

.contentTopCompany .companyAttitude p br{
	display: none;
}

.contentTopCompany .topButton{
	display: block;
	width: 75%;
	height: 50px;
	border: solid 2px #ffffff;
	margin: 24px auto 0 auto;
}

	/*-- INTERVIEW --*/

.contentTopInterview{
	background-color: #ffffff;
}

.contentTopInterview .contentArea{
	padding: 32px 0 56px 0;
}

.contentTopInterview .h2Title{
	margin: 0 0 4px 0;
	font-size: 240%;
	font-weight: 700;
	font-style: normal;
	color:#af1144;
	line-height: 100%;
}

.contentTopInterview .contentCatch{
	margin: 0 0 16px 0;
	font-size: 120%;
	font-style: normal;
	color:#000000;
	line-height: 120%;
}

.contentTopInterview .interviewList{
	list-style-type: none;
	display: block;
	border-top: solid 5px #e8e8e8;
		border-bottom: solid 5px #e8e8e8;
}

.contentTopInterview .interviewList li{
	position: relative;
	width: 100%;
}

.contentTopInterview .interviewList li.interview01{
	background: url(/recruit/career/index/images/top_page/top_interview_sp01.jpg) no-repeat center center /auto 100% ;
}

.contentTopInterview .interviewList li.interview02{
	background: url(/recruit/career/index/images/top_page/top_interview_sp02.jpg) no-repeat center center /auto 100% ;
}

.contentTopInterview .interviewList li.interview03{
	background: url(/recruit/career/index/images/top_page/top_interview_sp03.jpg) no-repeat center center /auto 100% ;
}

.contentTopInterview .interviewList li.interview04{
	background: url(/recruit/career/index/images/top_page/top_interview_sp04.jpg) no-repeat center center /auto 100% ;
}

.contentTopInterview .interviewList li.interview05{
	background: url(/recruit/career/index/images/top_page/top_interview_sp05.jpg) no-repeat center center /auto 100% ;
}
  
.contentTopInterview .interviewList li.interview06{
	background: url(/recruit/career/index/images/top_page/top_interview_sp06.jpg) no-repeat center center /auto 100% ;
}  

.contentTopInterview .interviewList li::after{
	display: block;
	padding: 24% 0 0 0;
	content: "";
}

.contentTopInterview .interviewList li a:link{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: transparent;
	text-decoration: none;
	display: block;
	z-index: 2;
	transition: all 0.2s ease-in 0s;
}

.contentTopInterview .interviewList li a:visited{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: transparent;
	text-decoration: none;
	display: block;
	z-index: 2;
	transition: all 0.2s ease-in 0s;
}

.contentTopInterview .interviewList li a:hover,
.contentTopInterview .interviewList li a:active{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(175,17,68,.5);
	text-decoration: none;
	display: block;
	z-index: 2;
	transition: all 0.2s ease-in 0s;
}

.contentTopInterview .interviewList li a .interviewInterviewee{
	position: relative;
	top: 50%;
	-ms-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	display: inline-block;
	width: 70%;
	margin: 0 auto 0 auto;
	padding: 0 0 0 0;
	text-align: left;
}

.contentTopInterview .interviewList li a:link .interviewInterviewee .interviewOccupation{
	display: block;
	font-size: 120%;
	font-weight: 700;
	font-style: normal;
	color:#af1144;
	line-height: 120%;
	transition: all 0.2s ease-in 0s;
}

.contentTopInterview .interviewList li a:visited .interviewInterviewee .interviewOccupation{
	display: block;
	font-size: 120%;
	font-weight: 700;
	font-style: normal;
	color:#af1144;
	line-height: 120%;
	transition: all 0.2s ease-in 0s;
}

.contentTopInterview .interviewList li a:hover .interviewInterviewee .interviewOccupation,
.contentTopInterview .interviewList li a:active .interviewInterviewee .interviewOccupation{
	display: block;
	font-size: 120%;
	font-weight: 700;
	font-style: normal;
	color:#ffffff;
	line-height: 120%;
	transition: all 0.2s ease-in 0s;
}

.contentTopInterview .interviewList li.interview01 a:link .interviewInterviewee .interviewJoin{
	color: #000000;
}
.contentTopInterview .interviewList li.interview01 a:visited .interviewInterviewee .interviewJoin{
	color: #000000;
}
.contentTopInterview .interviewList li.interview01 a:hover .interviewInterviewee .interviewJoin,
.contentTopInterview .interviewList li.interview01 a:active .interviewInterviewee .interviewJoin{
	color: #000000;
}

.contentTopInterview .interviewList li.interview02 a:link .interviewInterviewee .interviewJoin{
	color: #ffffff;
}
.contentTopInterview .interviewList li.interview02 a:visited .interviewInterviewee .interviewJoin{
	color: #ffffff;
}
.contentTopInterview .interviewList li.interview02 a:hover .interviewInterviewee .interviewJoin,
.contentTopInterview .interviewList li.interview02 a:active .interviewInterviewee .interviewJoin{
	color: #ffffff;
}

.contentTopInterview .interviewList li.interview03 a:link .interviewInterviewee .interviewJoin{
	color: #ffffff;
}
.contentTopInterview .interviewList li.interview03 a:visited .interviewInterviewee .interviewJoin{
	color: #ffffff;
}
.contentTopInterview .interviewList li.interview03 a:hover .interviewInterviewee .interviewJoin,
.contentTopInterview .interviewList li.interview03 a:active .interviewInterviewee .interviewJoin{
	color: #ffffff;
}

.contentTopInterview .interviewList li.interview04 a:link .interviewInterviewee .interviewJoin{
	color: #ffffff;
}
.contentTopInterview .interviewList li.interview04 a:visited .interviewInterviewee .interviewJoin{
	color: #ffffff;
}
.contentTopInterview .interviewList li.interview04 a:hover .interviewInterviewee .interviewJoin,
.contentTopInterview .interviewList li.interview04 a:active .interviewInterviewee .interviewJoin{
	color: #ffffff;
}

.contentTopInterview .interviewList li.interview05 a:link .interviewInterviewee .interviewJoin{
	color: #ffffff;
}
.contentTopInterview .interviewList li.interview05 a:visited .interviewInterviewee .interviewJoin{
	color: #ffffff;
}
.contentTopInterview .interviewList li.interview05 a:hover .interviewInterviewee .interviewJoin,
.contentTopInterview .interviewList li.interview05 a:active .interviewInterviewee .interviewJoin{
	color: #ffffff;
}

.contentTopInterview .interviewList li.interview06 a:link .interviewInterviewee .interviewJoin{
	color: #ffffff;
}
.contentTopInterview .interviewList li.interview06 a:visited .interviewInterviewee .interviewJoin{
	color: #ffffff;
}
.contentTopInterview .interviewList li.interview06 a:hover .interviewInterviewee .interviewJoin,
.contentTopInterview .interviewList li.interview06 a:active .interviewInterviewee .interviewJoin{
	color: #ffffff;
}  
  
.contentTopInterview .topButton{
	display: block;
	width: 75%;
	height: 50px;
	margin: 24px auto 0 auto;
	border: solid 2px #ffffff;
}

	/*-- RECRUIT --*/

.contentTopRecruit{
	background: url(/recruit/career/index/images/top_page/top_bg_recruit.jpg) no-repeat center center / auto 100%;
}

.contentTopRecruit .contentArea{
	padding: 32px 0 56px 0;
}

.contentTopRecruit .h2Title{
	margin: 0 0 4px 0;
	font-size: 240%;
	font-weight: 700;
	font-style: normal;
	color:#af1144;
	line-height: 100%;
}

.contentTopRecruit .contentCatch{
	margin: 0 0 16px 0;
	font-size: 120%;
	font-style: normal;
	color:#ffffff;
	line-height: 120%;
}

.contentTopRecruit .recruitList{
	list-style: none;
	display: block;
	width: 100%;
	margin: 0 auto 0 auto;
}

.contentTopRecruit .recruitList::after{
	content: none;
}

.contentTopRecruit .recruitList li{
	float: none;
	width: 75%;
	margin: 24px auto 0 auto;
}

.contentTopRecruit .recruitList li.recruitPersonnel{
	background: transparent;
}

.contentTopRecruit .recruitList li.recruitFAQ{
	background: transparent;
}

.contentTopRecruit .recruitList li.recruitIndex{
	background: transparent;
}

.contentTopRecruit .recruitList li::after{
	display: block;
	padding: 50px 0 0 0;
	content: "";
}

.contentTopRecruit .recruitList li a:link{
	position: absolute;
	top: 0;
	left: 0;	
	display: block;
	width: 100%;
	height: 100%;
	background-color: rgba(175,17,68,.6);
	background-image: none;
	text-decoration: none;
	font-size: 100%;
	color: #ffffff;
	transition: all 0.2s ease-in 0s;
}

.contentTopRecruit .recruitList li a:visited{
	position: absolute;
	top: 0;
	left: 0;	
	display: block;
	width: 100%;
	height: 100%;
	background-color: rgba(175,17,68,.6);
	background-image: none;
	text-decoration: none;
	font-size: 100%;
	color: #ffffff;
	transition: all 0.2s ease-in 0s;
}

.contentTopRecruit .recruitList li a:hover,
.contentTopRecruit .recruitList li a:active{
	position: absolute;
	top: 0;
	left: 0;	
	display: block;
	width: 100%;
	height: 100%;
	background-color: rgba(175,17,68,1);
	background-image: none;
	text-decoration: none;
	font-size: 100%;
	color: #ffffff;
	transition: all 0.2s ease-in 0s;
}

.contentTopRecruit .recruitList li a:link div{
	position: absolute;
	top: 0;
	left: 0;
	-ms-transform: none;
	-moz-transform: none;
	-webkit-transform: none;
	transform: none;
	width: 100%;
	height: 100%;
	background-color: transparent;
	text-align: center;
	transition: all 0.2s ease-in 0s;
}

.contentTopRecruit .recruitList li a:visited div{
	position: absolute;
	top: 0;
	left: 0;
	-ms-transform: none;
	-moz-transform: none;
	-webkit-transform: none;
	transform: none;
	width: 100%;
	height: 100%;
	background-color: transparent;
	text-align: center;
	transition: all 0.2s ease-in 0s;
}

.contentTopRecruit .recruitList li a:hover div,
.contentTopRecruit .recruitList li a:active div{
	position: absolute;
	top: 0;
	left: 0;
	-ms-transform: none;
	-moz-transform: none;
	-webkit-transform: none;
	transform: none;
	width: 100%;
	height: 100%;
	background-color: rgba(255,255,255,.5);
	text-align: center;
	transition: all 0.2s ease-in 0s;
}

.contentTopRecruit .recruitList li a div p{
	position: absolute;
	top: 50%;
	left: 0;
	-ms-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	width: 100%;
	font-size: 90%;
	color: #ffffff;
	line-height: 150%;
}

}

/*-- contents --*/

@media screen and (min-width: 1201px), print{

#contents{
	padding: 86px 0 72px 0;
}

}

@media screen and (max-width: 1200px){

#contents{
	padding: 72px 0 64px 0;
}

}

@media screen and (max-width: 640px){

#contents{
	padding: 56px 0 48px 0;
}

}