@charset "UTF-8";
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video,main {margin:0;padding:0;border:0;font-size:100%;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,main {display:block;}
body {font-family:Verdana,"Hiragino Kaku Gothic ProN",Meiryo,sans-serif;line-height:1;}
ol,ul {list-style:none;}
blockquote,q {quotes:none;}
blockquote:before,blockquote:after,q:before,q:after {content:'';content:none;}
table {border-collapse:collapse;border-spacing:0;}
wbr:after {content:"\00200B";}

/*	TBS reset
============================== */
.alt {position:absolute;top:-5000px;left:-9999px;}
.clearfix:after {content:"";clear:both;display:block;}
.hide-txt {text-indent:110%;white-space:nowrap;overflow:hidden;}
.fp-causion {display:none;}
.nocontxt {-webkit-touch-callout: none;-webkit-user-select: none;user-select: none;-webkit-user-drag:none;}
.nocontxt img {pointer-events: none;}
@media all and (min-width:768px) {
.alt-pc {position:absolute;top:-5000px;left:-9999px;}
.clearfix-pc:after {content:"";clear:both;display:block;}
.hide-txt-pc {text-indent:110%;white-space:nowrap;overflow:hidden;}
}
@media all and (max-width:767px) {
.alt-smp {position:absolute;top:-5000px;left:-9999px;}
.clearfix-smp:after {content:"";clear:both;display:block;}
.hide-txt-smp {text-indent:110%;white-space:nowrap;overflow:hidden;}
}
div.embed-tbsplayer {
background-color:#000;
position:relative;
height:0;
padding-top:56.25%;
}
div.embed-tbsplayer .tbs-player {
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
}


/* -----------------------------------------------------------
   COMMON
------------------------------------------------------------*/
:root {
	--main-tbsblue:#0050FF;
	--main-skyblue:#E7F6FC;
	--main-bgblue:#3278FF;
	--btn-color1:#377CFF;
	--btn-color2:#0044C4;
}


a { text-decoration:none;}
a:hover { text-decoration:none;}
a:visited { text-decoration:none;}

.alt{
	position: absolute;
	top: -5000px;
	left: -9999px;
}
.cover {
	background: url(../img/cover.png);
	display: block;
	width: 100%;
	height: 100%;
}

.small{
	font-size: 80%;
}
figure img{
	width: 100%;
}
@media all and (min-width: 768px) {
	.smp-br{
		display: none;
	}
}


/* -----------------------------------------------------------
   BASE
------------------------------------------------------------*/
html{
	font-size: 62.5%;
}
body {
	-webkit-text-size-adjust: 100%;
	-moz-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	text-size-adjust: 100%;
	font-feature-settings: "palt";
	letter-spacing: 0.06em;
	background-color: #fff;
	font-family: 'Noto Sans JP', sans-serif;
	color: #333;
}
.bg_skyblue{
	background-color: var(--main-skyblue);
}
.inner{
	width: min(96%,1160px);
	margin: 0 auto;
	padding: 70px 0;
}
.bg_skyblue .inner{
	padding: 70px 0 120px;
}
@media all and (max-width: 767px) {
	.inner{
		width: 100%;
		margin: 0 auto;
		padding: 16vw 0;
	}
	.bg_skyblue .inner{
		padding: 7vw 0 0;
	}
	.cont-2nd .inner > section{
		width: 94%;
		margin: 0 auto;
	}
}

/* -----------------------------------------------------------
   HEADER
------------------------------------------------------------*/
header.change-header{
	background-color: var(--main-skyblue);
}
.cont-2nd .change-header{
	background-color: #FFF;
}
header.header , header.change-header{
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 80px;
	padding: 0 20px;
	box-sizing: border-box;
	position: fixed;
	z-index: 200;
}
header.change-header{
	transition: .5s;
}
header .logo{
	width: 280px;
}
header .logo span , header .logo a{
	display: block;
	width: 100%;
	height: 0;
	padding-top: 10.27%;
	display: block;
	background-repeat: no-repeat;
	text-indent: -9999px;
	background-image:url(../img/logo_recruit.png);
	background-size: contain;
	image-rendering: -webkit-optimize-contrast;
}



@media all and (min-width: 1024px) {
	.cont-2nd header .logo span , .cont-2nd header .logo a{
		background-image:url(../img/logo_recruit_white.png);
	}
	.cont-people-part header .logo span , .cont-people-part header .logo a{
		background-image:url(../img/logo_recruit.png);
	}
	.cont-2nd .change-header .logo span, .cont-2nd .change-header .logo a{
		background-image:url(../img/logo_recruit.png);
	}
}

@media all and (max-width: 1023px) {
	header.header , header.change-header{
		width: 100%;
		height: 52px;
		padding: 0 4.3589vw;
		box-sizing: border-box;
		position: fixed;
		z-index: 200;
	}
	.cont-2nd header.header ,.cont-2nd header.change-header{
		background-color: #FFF;
	}
	header .logo{
		width: 51.282vw;
		max-width: 200px;
		z-index: 20;
	}
	header .logo span , header .logo a{
		display: block;
		width: 100%;
		height: 0;
		padding-top: 10.25%;
		display: block;
		background-repeat: no-repeat;
		text-indent: -9999px;
		background-image:url(../img/logo_recruit.png);
		background-size: contain;
		image-rendering: -webkit-optimize-contrast;
	}
}

@charset "UTF-8";

/* -----------------------------------------------------------
   NAV
------------------------------------------------------------*/
.nav-wrap.open {
	display: block;
}


@media all and (min-width: 1024px) {
	
	.header nav .nav{
		display: flex;
		align-items: center;
	}
	.header nav .nav li a{
		transition: .3s;
	}
	.header nav .nav li.text-btn{
		margin-right: 30px;
	}
	.header nav .nav li.text-btn a{
		font-weight: 500;
		font-size: 2.2rem;
		font-family: "Inter", sans-serif;
		color: #000;
		text-align: center;
	}
	.cont-2nd .header nav .nav li.text-btn a{
		color: #FFF;
	}
	.cont-people-part .header nav .nav li.text-btn a{
		color: #000;
	}
	.cont-2nd .change-header nav .nav li.text-btn a{
		color: #000;
	}
	.header nav .nav li.text-btn a .jp{
		font-family: "Noto Sans JP", sans-serif;
		font-size: 56%;
		display: block;
		padding-top: 0.4em;
	}
	.header nav .nav li.text-btn a:hover{
		color: #0050FF;
	}
	.header nav .nav li.newgrad-btn {
		margin-right: 10px;
	}
	.header nav .nav li.newgrad-btn a{
		width: 110px;
		text-align: center;
		padding: 1.4rem 0;
		box-sizing: border-box;
		color: #FFF;
		font-size: 1.6rem;
		font-weight: 500;
		position: relative;
		display: inline-block;
		vertical-align: middle;
		transition: .3s;
		border: 1px solid #FFF;
		background:#377CFF;
	}
	.header nav .nav li.newgrad-btn .sub{
		display: none;
	}
	.header nav .nav li.career-btn a{
		width: 140px;
		text-align: center;
		padding: 1.4rem 0;
		box-sizing: border-box;
		color: #FFF;
		font-size: 1.6rem;
		font-weight: 500;
		position: relative;
		display: inline-block;
		vertical-align: middle;
		transition: .3s;
		border: 1px solid #FFF;
		background:#0044C4;
	}
	.header nav .nav li.career-btn a .sub{
		display: none;
	}
	.header nav .nav li.newgrad-btn a:hover , .header nav .nav li.career-btn a:hover {
		background-color: #0050FF ;
	}
	.change-header nav .nav li.career-btn a{
		background:rgba(0,29,200,1.0);
	}
	.header nav .nav li.mypage-btn{
		margin: 0 30px 0 20px;
	}
	.header nav .nav li.mypage-btn a{
		width: 170px;
		text-align: center;
		padding: 1.4rem 0;
		box-sizing: border-box;
		color: #377CFF;
		font-size: 1.6rem;
		font-weight: 600;
		position: relative;
		display: inline-block;
		vertical-align: middle;
		transition: .3s;
		background:#FFF;
		border-radius: 40px;
		box-shadow: 0px 0px 20px 0px rgba(152, 152, 152, 0.25);
	}
	.header nav .nav li.mypage-btn a:hover{
		color: #FFF;
		background:#0050FF;
	}
}

@media all and (max-width: 1023px) {
	.nav-wrap.close {
		display: none;
	}
	.nav-button {
		display: block;
		cursor: pointer;
	}
 	.nav-wrap {
		position: fixed;
		left: 0;
		top: 0;
		display: none;
		z-index: 10;
		background-color: var(--main-skyblue);		
		width: 100%;
		height: 100%;
		padding-top: 20vw;
		text-align: center;
		overflow-x: hidden;
    	overflow-y: auto;
	}
	.nav-wrap .nav {
		width: 272px;
		height: 100%;
		margin: 0 auto;
		position: relative;
		overflow-x: hidden;
		overflow-y: auto;
	}
	.nav-wrap .nav li {
		display: block;
		margin-bottom: 30px;
		text-align: left;
	}
	.nav-wrap .nav li:last-child{
		margin-bottom: 0;
	}
	.nav-wrap .nav li a {
		color: #000;
		font-size: 2.2rem;
		font-weight: 500;
		letter-spacing: 0.2em;
		transition: .3s;
		display: flex;
        align-items: center;
	}
	.nav-wrap .nav li a .jp{
		font-size: 60%;
		padding-left: 0.4em;
	}
	/*.nav-wrap .nav li.mypage-btn a {
		font-size: 2.8rem;
		font-weight: 700;
		letter-spacing: 0.02em;
		transition: .3s;
		border: #0050FF 4px solid;
		border-radius: 4.8rem;
		padding: 0.4em 1em 0.5em;
		color: #0050FF !important;
		background-color: #FFF;
		display: block;
		line-height: 1.2;
		text-align: center;
	}*/
	.header .nav-wrap li.newgrad-btn , .header .nav-wrap li.career-btn{
		border: 1px solid #000;
		text-align: center;
	}
	.header .nav-wrap li.newgrad-btn{
		margin-bottom: 3vw;
	}
	.header .nav-wrap li.newgrad-btn a{
		width: 100%;
		background-color: var(--btn-color1);
		color: #FFF;
		transition: .3s;
		display: block;
		padding: 15px 0;
		position: relative;
		font-size: 1.8rem;
	}
	.header .nav-wrap li.newgrad-btn a:hover{
		background: #0050FF;
	}
	.header .nav-wrap li.career-btn a{
		width: 100%;
		background: var(--btn-color2);
		color: #FFF;
		transition: .3s;
		display: block;
		padding: 15px 0;
		position: relative;
		font-size: 1.8rem;
	}
	.header .nav-wrap li .sub{
		display: block;
		width: 60%;
		margin: 0.8rem auto 0;
		font-size: 0.9rem;
		letter-spacing: 0.2em;
		font-weight: 700;
		border-top: 1px solid #FFF;
		padding-top: 0.8rem;
	}
	.header .nav-wrap li.mypage-btn {
		text-align: center;
	}
	.header .nav-wrap li.mypage-btn a{
		width: 100%;
		background-color: #FFF;
		color: #377CFF;
		transition: .3s;
		display: block;
		padding: 15px 0;
		position: relative;
		font-size: 2.0rem;
		border-radius: 40px;
	}


	/*---BTN-EFFECT---*/
	.nav-button,
	.nav-button span {
		display: inline-block;
		transition: all 0.4s;
		box-sizing: border-box;
	}
	.nav-button {
		z-index: 20;
		position: relative;
		width: 20px;
		height: 20px;
	}
	.nav-button span {
		position: absolute;
		left: 0;
		width: 100%;
		height: 2px;
		background-color: #0050FF;
	}
	.nav-button.active span{
		background-color: #0050FF;
	}
	.nav-button span:nth-of-type(1) {
		top: 0;
	}
	.nav-button span:nth-of-type(2) {
		top: 9px;
	}
	.nav-button span:nth-of-type(3) {
		bottom: 0;
	}
	.nav-button.active span:nth-of-type(1) {
		-webkit-transform: translateY(9px) rotate(-45deg);
		transform: translateY(9px) rotate(-45deg);
	}
	.nav-button.active span:nth-of-type(2) {
		opacity: 0;
	}
	.nav-button.active span:nth-of-type(3) {
		-webkit-transform: translateY(-9px) rotate(45deg);
		transform: translateY(-9px) rotate(45deg);
	}
}



/* -----------------------------------------------------------
   BTN
------------------------------------------------------------*/
.btn-common a{
	border: #2D2D2D 1px solid;
	display: block;
	padding: 0.8em 1.8em;
	border-radius: 100vh;
	background-color: #0050FF;
	color: #FFF;
	font-weight: 400;
	font-size: 2.4rem;
	letter-spacing: 0.08em;
	position: relative;
	top: 0;
	transition: .3s;
	text-align: center;
}
.btn-common a:after{
	content: "";
	display: block;
	background: url(../img/arrow_circle_right.svg);
	background-size: cover;
	width: 30px;
	height: 31px;
	position: absolute;
	top: 50%;
	right: 5%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transition: .3s;
}
.btn-common a:hover{
	top:5px;
	transition: all 200ms ease-out;
}

@media all and (max-width: 767px) {
	.btn-common a{
		font-size: 2.2rem;
		padding: 0.5em 1.0em;
		position: relative;
	}
	.btn-common a:after{
		width: 8%;
		height: 0;
		padding-top: calc(103.2% * 0.08);
	}
}
/* -----------------------------------------------------------
   h2 title
------------------------------------------------------------*/
h2.ttl{
	display: block;
	width: 42%;
	height: 0;
	padding-top: calc(15.52% * 0.42);
	background-size: cover;
}
.cont-2nd .ttl-box{
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.cont-2nd .ttl-box .toptxt-box{
	width: 46%;
	border-top: dashed #000 1px;
	border-bottom: dashed #000 1px;
	background-color: #FFF;
	padding: 1.6rem;
	box-sizing: border-box;
}
.cont-2nd .ttl-box .toptxt-box p{
	font-size: 1.6rem;
	line-height: 2.0;
}
@media all and (max-width: 767px) {
	h2.ttl{
		width: 100%;
		padding-top: calc(15.52%* 1.0);
		margin-bottom: 7.6vw;
	}
	.cont-2nd .ttl-box{
		display: block;
		margin: 0 auto;
		position: relative;
	}
	
	.cont-2nd .ttl-box .toptxt-box{
		width: 100%;
	}
	.cont-2nd .ttl-box .toptxt-box p{
		font-size: 1.5rem;
		line-height: 1.8;
	}
}

/* -----------------------------------------------------------
   YOUTUBE
------------------------------------------------------------*/
.y-movie{
	width: 100%;
	position: relative;
	padding-top: 56.25%;
}
.y-movie iframe{
	position: absolute;
	top: 0;
	right: 0;
	width: 100% !important;
	height: 100% !important;
}
/* -----------------------------------------------------------
   PEOPLE-LIST
------------------------------------------------------------*/
 ul.interview-list{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-bottom: 50px;
}
ul.interview-list li{ opacity: 0;}
ul.interview-list li:nth-child(1).is-active{animation: zoomIn 0.8s cubic-bezier(0.25, 1, 0.5, 1) 0.2s forwards;}
ul.interview-list li:nth-child(2).is-active{animation: zoomIn 0.8s cubic-bezier(0.25, 1, 0.5, 1) 0.4s forwards;}
ul.interview-list li:nth-child(3).is-active{animation: zoomIn 0.8s cubic-bezier(0.25, 1, 0.5, 1) 0.6s forwards;}
ul.interview-list li:nth-child(4).is-active{animation: zoomIn 0.8s cubic-bezier(0.25, 1, 0.5, 1) 0.8s forwards;}

ul.interview-list li:last-child{margin-bottom: 0;}
ul.interview-list li a{
	display: block;
	transition: .3s;
	position: relative;
 	top: 0;
}
ul.interview-list li a:hover{
	top:5px;
	transition: all 200ms ease-out;
}
ul.interview-list li .thum{
	margin-bottom: 5%;
	display: block;
	overflow:hidden;
}
ul.interview-list li .thum img{
	width: 100%;
	height: 0;
	padding-top:81.117%;
	background-size: cover;
	transition: all 0.3s ease 0s;
}
ul.interview-list li.people1 .thum img{background-image:url(../people/img/photo1-thum.png);}
ul.interview-list li.people2 .thum img{background-image:url(../people/img/photo2-thum.png);}
ul.interview-list li.people3 .thum img{background-image:url(../people/img/photo3-thum.png);}
ul.interview-list li.people4 .thum img{background-image:url(../people/img/photo4-thum.png);}

#qa ul.interview-list li.people1 .thum img{background-image:url(../career/img/photo1-thum.png);}
#qa ul.interview-list li.people2 .thum img{background-image:url(../career/img/photo2-thum.png);}

@media all and (min-width: 768px) {
	
	ul.interview-list li{
		width: 47%;
		margin-bottom: 60px;
	}
	ul.interview-list li:nth-last-child(2){margin-bottom: 0;}
}
@media all and (max-width: 767px) {
	ul.interview-list{
		display: block;
		width: 96%;
		margin: 6.4vw auto;
	}
	ul.interview-list li{
		width: 100%;
	}
}

/* -----------------------------------------------------------
   FOOTER
------------------------------------------------------------*/
footer.contents-footer{
	background-color: #82899D;
	padding: 176px 0 76px;
	position: relative;
	text-align: center;
}
footer.contents-footer .footer-copy{
	width: 90%;
    max-width: 944px;
	margin: 0 auto;
	border-top: dashed #000 1px;
	border-bottom: dashed #000 1px;
	background-color: #FFF;
	position: absolute;
	top: -35px;
	left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}
footer.contents-footer .footer-copy p{
	background: url(../img/footer_copy.png);
	background-size: cover;
	width: 60%;
	height: 0;
	padding-top: calc(16.87% * 0.6);
	margin: 45px auto;
}

footer.contents-footer .btn-list{
	width: 90%;
	max-width: 944px;
	margin:0 auto 40px;
	display: flex;
	justify-content: space-between;
}
footer.contents-footer .btn-list li{
	width: 48%;
}
footer.contents-footer .btn-list li a , footer.contents-footer .btn-list li > span{
	display: block;
	width: 100%;
	padding: min(40px,3vw);
	box-sizing: border-box;
}
footer.contents-footer .btn-list li.newgrad-btn a{
	background:var(--btn-color1);
	border: 1px solid #000;
	color: #FFF;
	transition: .3s;
	position: relative;
}
footer.contents-footer .btn-list li.newgrad-btn a:hover{
	background: var(--main-tbsblue);
}
footer.contents-footer .btn-list li.career-btn a,
footer.contents-footer .btn-list li.career-btn > span{
	background: var(--btn-color2);
	border: 1px solid #000;
	color: #FFF;
	transition: .3s;
}
footer.contents-footer .btn-list li.career-btn a,
footer.contents-footer .btn-list li.career-btn > span{
	background: var(--btn-color2);
	border: 1px solid #000;
	color: #FFF;
	transition: .3s;
}
footer.contents-footer .btn-list li.career-btn a:hover{
	background: var(--main-tbsblue);
}
footer.contents-footer .btn-list li .jp{
	border-bottom: 1px solid #FFF;
	display: block;
	font-size: min(2.7rem,2.1vw);
	letter-spacing: 0.2em;
	font-weight: 700;
	padding-bottom: 0.8rem;
	margin-bottom: 0.8rem;
}
footer.contents-footer .btn-list li .en{
	font-size: min(2.0rem,1.5vw);
}
footer.contents-footer .bn-list{
	width: 90%;
	max-width: 944px;
	margin:0 auto 90px;
	display: flex;
	justify-content: space-between;
}
footer.contents-footer .bn-list li{
	width: 48%;
}
footer.contents-footer .group a{
	display: block;
	width: 100%;
	height: 0;
	padding-top: 35%;
	background: url(../img/banner_group.png);
	background-size: cover;	
	text-indent: -9999px;
	transition: .3s;
}
footer.contents-footer .land a{
	display: block;
	width: 100%;
	height: 0;
	padding-top: 35%;
	background: url(../img/banner_land.png);
	background-size: cover;	
	text-indent: -9999px;
	transition: .3s;
}
footer.contents-footer .group a:hover , footer.contents-footer .land a:hover{
	opacity: 0.5;
}
footer.contents-footer .logo{
	width: 277px;
	margin: 0 auto 90px;
}
footer.contents-footer .logo span{
	display: block;
	width: 100%;
	height: 0;
	padding-top: 10.27%;
	display: block;
	background-repeat: no-repeat;
	text-indent: -9999px;
	background-image:url(../img/logo_recruit_white.png);
	background-size: contain;
	image-rendering: -webkit-optimize-contrast;
}

footer.contents-footer .btm-list{
	display: flex;
	justify-content: space-between;
	width: 80%;
	max-width: 900px;
	margin: 0 auto;
}
footer.contents-footer .btm-list a{
	color: #FFF;
	font-size: 1.6rem;
	transition: .3s;
	white-space: nowrap;
	letter-spacing: 0.08em;
}
footer.contents-footer .btm-list li{
	padding: 0 4%;
}
footer.contents-footer .btm-list li:first-child{
	padding: 0 4% 0 0;
}
footer.contents-footer .btm-list li:last-child{
	padding: 0 0 0 4%;
}
footer.contents-footer .btm-list a:hover{
	opacity: 0.5;
}
footer.contents-footer .btm-list  li:last-child{
	border-left: 1px solid #FFF;
}

footer.contents-footer #bn_jobfes{
	width: 90%;
	max-width: 944px;
	margin: 0 auto 40px;
}
footer.contents-footer #bn_jobfes a{
	display: block;
	width: 100%;
	height: 0;
	padding-top: 48.7375%;
	background: url(../img/banner_jobfes.png?);
	background-size: cover;
	background-position: center;
	position: relative;
    z-index: 10;
	text-indent: -9999px;
	transition: .3s;
}
footer.contents-footer #bn_jobfes a:hover{
	opacity: 0.5;
}
footer.contents-footer .copyright{
	font-size: 1.2rem;
	padding: 32px 0;
	color: #FFF;
}

@media all and (max-width: 767px) {
	footer.contents-footer{
		padding: 14vw 0;
	}
	footer.contents-footer .footer-copy{
		width: 80%;		
		position: absolute;
		top: -5.3vw;
	}
	footer.contents-footer .footer-copy p{
		width: 53%;
		padding-top: calc(16.87% * 0.53);
		margin: 3.8vw auto;
	}
	
	footer.contents-footer .btn-list{
		width: 80%;
		margin:0 auto 20px;
		flex-wrap: wrap;
	}
	footer.contents-footer .btn-list li{
		width: 100%;
		margin-bottom: 20px;
	}
	footer.contents-footer .btn-list li:last-child{
		margin-bottom: 0;
	}
	footer.contents-footer .btn-list li a,
	footer.contents-footer .btn-list li > span{
		width: 100%;
		padding: 4vw ;
	}
	footer.contents-footer .btn-list li .jp{
		font-size: 1.8rem;
		letter-spacing: 0.2em;
		margin-bottom: 0;
		border-bottom: none;
		position: relative;
		padding-bottom: 1.2rem;
	}
	
	footer.contents-footer .btn-list li .en{
		font-size: 0.9rem;
		letter-spacing: 0.1em;
		display: block;
		position: relative;
	}
	footer.contents-footer .btn-list li .en::after{
		content: "";
		display: block;
		width: 50%;
		height: 1px;
		background-color: #FFF;
		position: absolute;
		bottom: -0.4em;
		left: 50%;
		transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);

	}
	footer.contents-footer .btn-list li.career-btn .en::after{
		display: none;
	}
	footer.contents-footer .bn-list{
		width: 80%;
		flex-wrap: wrap;
	}
	footer.contents-footer .bn-list li{
		width: 90%;
		margin: 0 auto 20px;
	}
	footer.contents-footer .group{
		width: 80%;
		max-width: auto;
		margin: 0 auto 60px;
	}
	footer.contents-footer .logo{
		width: 200px;
		margin: 0 auto 48px;
	}
	footer.contents-footer .btm-list{
		flex-wrap: wrap;
		width: 100%;
		margin: 0 auto;
	}
	footer.contents-footer .btm-list li{
		margin-bottom: 6.4vw;
		width: 32%;
		padding: 0;
	}
	footer.contents-footer .btm-list li:first-child{
		width: 100%;
	}
	footer.contents-footer .btm-list li:last-child{
		width: 100%;
		border-left: none;
		margin-top: 6vw;
		padding: 10vw 0 0 0;
		position: relative;
	}
	footer.contents-footer .btm-list li:last-child::before{
		content: "";
		display: block;
		width: 50%;
		height: 1px;
		background-color: #FFF;
		position: absolute;
		top: 0;
		left: 50%;
		transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
	}
	footer.contents-footer #bn_jobfes{
		width: 80%;
		margin: 0 auto 20px;
	}
	footer.contents-footer .copyright{
		padding: 32px 0 0;
	}
}
/* -----------------------------------------------------------
   2nd-MAIN-VISUAL
------------------------------------------------------------*/
#contents-visual .contents-visual-inner{
	background-size: cover;
	opacity: 0;
}
#contents-visual .ttl-cover h1.ttl{
	background-size: cover;
	opacity: 0;
}

.cont-people h1.ttl{ background-image: url(../people/img/ttl.png);}
.cont-company h1.ttl{ background-image: url(../company/img/ttl.png);}
.cont-work h1.ttl{ background-image: url(../work/img/ttl.png);}
.cont-newgrad h1.ttl{ background-image: url(../newgrad/img/ttl.png);}
.cont-career h1.ttl{ background-image: url(../career/img/ttl.png);}

#contents-visual .ttl-cover h1.ttl{	
	width: 100%;
	height: 0;
	padding-top: 51.83%;
}

#contents-visual .contents-visual-inner.is-active{
	animation: fadeIn 0.7s cubic-bezier(0.33, 1, 0.68, 1) 0.2s forwards;
}
#contents-visual .ttl-cover h1.ttl.is-active{
	animation: fadeIn 0.7s cubic-bezier(0.33, 1, 0.68, 1) 0.8s forwards;
}

@media all and (min-width: 768px) {
	#contents-visual .contents-visual-inner.js-scroll{	
		aspect-ratio: 1280 / 752;
		position: relative;
	}
	.cont-people #contents-visual .contents-visual-inner{ background-image: url(../people/img/main.jpg);}
	.cont-company #contents-visual .contents-visual-inner{ background-image: url(../company/img/main.jpg);}
	.cont-work #contents-visual .contents-visual-inner{ background-image: url(../work/img/main.jpg);}
	.cont-newgrad #contents-visual .contents-visual-inner{ background-image: url(../newgrad/img/main.jpg);}
	.cont-career #contents-visual .contents-visual-inner{ background-image: url(../career/img/main.jpg);}

	#contents-visual  .contents-visual-inner .ttl-cover{
		max-width: 546px;
		width: 42%;
		position: absolute;
		bottom: 0;
		left: 3.5%;
	}
	
}
@media all and (max-width: 767px) {
	#contents-visual{
		padding-top: 52px;
	}
	#contents-visual .contents-visual-inner{
		aspect-ratio: 780 / 566;
		position: relative;
	}
	.cont-people #contents-visual .contents-visual-inner{ background-image: url(../people/img/main_smp.jpg);}
	.cont-company #contents-visual .contents-visual-inner{ background-image: url(../company/img/main_smp.jpg);}
	.cont-work #contents-visual .contents-visual-inner{ background-image: url(../work/img/main_smp.jpg);}
	.cont-newgrad #contents-visual .contents-visual-inner{ background-image: url(../newgrad/img/main_smp.jpg);}
	.cont-career #contents-visual .contents-visual-inner{ background-image: url(../career/img/main_smp.jpg);}

	#contents-visual  .contents-visual-inner .ttl-cover{
		width: 65%;
		position: absolute;
		bottom: -20%;
		left: 50%;
		transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
	}
	
}

/* -----------------------------------------------------------
   ANIMATION
------------------------------------------------------------*/
@keyframes fadeIn {
	0% {
	  opacity: 0;
	}
	100% {
	  opacity: 1;
	}
  }
@keyframes zoomIn {
	0% {
	  transform: scale(0.8);
	  opacity: 0;
	}
	100% {
	  opacity: 1;
	  transform: scale(1);
	}
}
@keyframes slideIn {
	0% {
	  transform: translateX(-50%) translateY(10%);
	  opacity: 0;
	}
	100% {
	  transform: translateX(-50%) translateX(0);
	}
	40%,100% {
	  opacity: 1;
	}
}
@keyframes slideIn_left {
	0% {
	  transform: translateX(-20%);
	  opacity: 0;
	}
	100% {
	  transform: translateX(0);
	}
	40%,100% {
	  opacity: 1;
	}
}
@keyframes slideIn_right {
	0% {
	  transform: translateX(20%);
	  opacity: 0;
	}
	100% {
	  transform: translateX(0);
	}
	40%,100% {
	  opacity: 1;
	}
}