@charset "UTF-8";

:root{
	--cGray90:rgb(90,90,90);

	--cName01:rgba(130,47,31);
	--cName02:rgba(170,112,34);
}



/* common　:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼*/

#ctInrHeader .pInr{
	position:relative;
	margin:0 auto;
	z-index:1;
	background-image:url("/career/assets/crosstalk/img/inr_side_title.svg");
	background-repeat: no-repeat;
	background-position:right top;
}

#inrHeadImg h1{
	position:absolute;
	z-index:1;
	color:#ffffff;
}

h1::after{
	content:"";
	display:block;
	width:100%;
}

h1 > div{
	display:table;
	background:var(--cRed);
}

h1 > div span{
	display:table-cell;
	vertical-align: middle;
}

#inrHeadImg figure{
	display:block;
	position:absolute;
	z-index:0;
}
/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

#ctInrIntro p{
	text-align:center;
}

/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/


#ctInrProfile h2::before{
	content:"";
	display:block;
	background:var(--cRed);
	margin:0 auto;
}

/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/


.talkSec .pInr{
	margin:0 auto;
}

.talkSec .pInr h3{
	border-left-color:var(--cRed);
	border-left-style:solid;
}

.talkSec .pInr h3 div{
	font-weight:bold;
}

.talkName01,.talkName02{
	font-weight:bold;
	display:inline-block;
}

.paraIntro{
	font-weight:bold;
}

.talkName01{
	color:var(--cName01);
}

.talkName02{
	color:var(--cName02);
}

.secPhoto{
	margin: 0 auto;
}

.commentSec p{
	text-align:right;
}




/*下部　職種ボタン*/
/*----------------------------------------------------*/

.occupationList{
	border:1px solid #eeeeee;
}


.occupationList h2{
	text-align:center;
	font-weight:bold;
}

.occupationList ul{
	display:flex;
	flex-wrap: wrap;
	justify-content:flex-start;
}

/*1つ並び*/
.occupationList ul.item01{
	justify-content: center;
}

.occupationList li .btnModal{
	color: var(--cRed);
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	border: 2px solid var(--cRed);
	text-decoration: none;
	cursor: pointer;
	position:relative;
	display:table;
	overflow: hidden;
}

.occupationList li .btnModal span{
	display:table-cell;
	text-align:center;
	width:100%;
	background-image:url("/career/assets/interview/img/arw_p_next.svg");
	background-repeat:no-repeat;
	vertical-align: middle;
}








/*▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲*/
/* common :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/






/*PC ONLY　:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
@media screen and (min-width: 751px) {
/*▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼*/


	#ctInrHeader{
		width:100%;
	}


	#ctInrHeader .pInr{
		width:1060px;
		background-size:66px;
	}

	#inrHeadImg{
		position:relative;
		width:1060px;
		height:530px;
		margin-bottom:50px;
	}


	h1{
		width:660px;
		bottom:0;
	}

	h1::after{
		border-bottom:3px solid var(--cRed);
	}

	h1 > div{
		width:660px;
		margin-bottom:4px;
	}


	h1 > div span{
		padding:35px 25px;
		font-size:28px;
	}


	#inrHeadImg figure{
		width:760px;
		top:0;
		right:80px;
	}
/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

	#ctInrIntro p{
		font-size:18px;
		line-height:2.2;
		padding-bottom:60px;
	}

/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

	#ctInrProfile{
		background-image:linear-gradient(rgba(240,240,240,0) 40px, rgba(240,240,240,1) 40px, rgba(240,240,240,1)  );
		padding-bottom:20px;
	}

	#ctInrProfile h2{
		width:140px;
		margin:0 auto 30px;
	}

	#ctInrProfile h2::before{
		width:48px;
		height:5px;
		margin-bottom:10px;
	}

	#ctInrProfileWrap{
		width:930px;
		margin:0 auto;
		display:flex;
		justify-content: space-between;
	}

	.ctInrProfileItem{
		width:410px;
		display:flex;		
		align-items: center;
	}
	.ctInrProfileImg{
		width:110px;
		background:rgba(255,255,255,0.7);
		padding:5px;
		order:0;
	}

	.ctInrProfileTxt{
		order:1;
	}

	.ctInrProfileTxt dt{
		width:300px;
		border-bottom:1px dotted #333333;
		font-size:18px;
		padding-left:20px;
		padding-bottom:8px;
		margin-bottom:10px;
		font-weight:bold;
	}

	.ctInrProfileTxt dd{
		font-size:15px;
		padding-left:20px;
	}


	/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

	.talkSec{
		padding:70px 0;
	}

	.talkSec .pInr,	.commentSec .pInr{
		width:1080px;
		margin:0 auto;
	}

	.talkSec .pInr h3{
		border-left-width:8px;
		margin-bottom:50px;
	}

	.talkSec .pInr h3 div{
		padding-left:16px;
		font-size:28px;
	}

	.talkSec .pInr p{
		line-height:2.2;
		margin-bottom:40px;
		font-size:17px;
	}

	.talkSec .pInr p:last-child{
		margin-bottom:0px;
	}

	.talkName01,.talkName02{
		padding-right:12px;
	}

	.secPhoto{
		padding-top:20px;
		width:600px;
	}

	/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

	.commentSec{
		padding:0 0 40px ;
	}


	/*下部　職種ボタン*/
	/*----------------------------------------------------*/

	.occupationList{
		width:1080px;
		padding:20px 20px 5px;
		margin:0 auto;
	}

	.occupationList ul{
		margin:0 auto;
		justify-content: center;
	}


	.occupationList h2{
		font-size:20px;
		margin-bottom:30px;
	}

	.occupationList ul li{
		margin-bottom: 20px;
		margin-right: 15px;
	}

	/*1つ並び*/
	.occupationList ul.item01{
		width: 600px;
		margin:0 auto;
	}

	.occupationList ul.item01 li{
		width: 600px;
		margin-right: 0;
	}

	/*2つ並び*/
	.occupationList ul.item02{
		width: 960px;
	}


	.occupationList ul.item02 li{
		width: 460px;
	}

	/*3つ並び*/
	.occupationList ul.item03 li{
		width: 302px;
		margin-bottom: 20px;
		margin-right: 15px;
	}

	.occupationList ul.item03 li:nth-of-type(3n) {
		margin-right: 0px;
	}


	.occupationList li .btnModal{
		font-size: 16px;
		line-height: 1.25;
		border-radius: 71px;
		transition: 0.3s;
	}

	.occupationList li .btnModal:hover{
		color: #ffffff;
		background-color: var(--cRed);
	}

	.occupationList li .btnModal span{
		width:100%;
		padding-bottom:2px;
		background-size:10px;
		background-position:right 20px center;
		height: 71px;
	}

	.occupationList li .btnModal:hover span{
		background-image:url("/career/assets/interview/img/arw_p_next_white.svg");
	}


/*▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲*/
}		/* 751px -> :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/





/*tab　:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
@media screen and (min-width: 421px) and (max-width: 750px) {
/*▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼*/

	#ctInrHeader .pInr{
		width:100%;
		background-size:8vw;
		background-position:right  0.7vw top 15vw;
	}

	#inrHeadImg{
		position:relative;
		width:100%;
		height:88vw;
		margin-bottom:5vw;
	}

	h1{
		width:77vw;
		bottom:0;
	}

	h1::after{
		border-bottom:3px solid var(--cRed);
	}

	h1 > div{
		width:77vw;
		margin-bottom:0.6vw;
	}
	h1 > div span{
		padding:0 1vw 0 3vw;
		font-size:3.7vw;
		line-height:2;
		height:30vw;
	}

	#inrHeadImg figure{
		width:84vw;
		top:15vw;
		right:9.5vw;
	}
/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

	#ctInrIntro p{
		font-size:2.1vw;
		line-height:2;
		padding-bottom:6vw;
	}

/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

	#ctInrProfile{
		background-image:linear-gradient(rgba(240,240,240,0) 7vw, rgba(240,240,240,1) 7vw, rgba(240,240,240,1)  );
		padding-bottom:5vw;
	}

	#ctInrProfile h2{
		width:20vw;
		margin:0 auto 7vw;
	}

	#ctInrProfile h2::before{
		width:6vw;
		height:5px;
		margin-bottom:2vw;
	}

	#ctInrProfileWrap{
		width:94vw;
		margin:0 auto;
		display:flex;
		justify-content: space-between;
	}

	.ctInrProfileItem{
		width:45vw;
		display:flex;		
		align-items: center;
	}
	.ctInrProfileImg{
		width:16vw;
		background:rgba(255,255,255,0.7);
		padding:0.5vw;
		order:0;
	}

	.ctInrProfileTxt{
		order:1;
	}

	.ctInrProfileTxt dt{
		width:28vw;
		border-bottom:1px dotted #333333;
		font-size:2.4vw;
		padding-left:1vw;
		padding-bottom:1vw;
		margin-bottom:1vw;
		font-weight:bold;
	}

	.ctInrProfileTxt dd{
		font-size:2vw;
		padding-left:1vw;
	}


	/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

	.talkSec{
		padding:8vw 0;
	}

	.talkSec .pInr,	.commentSec .pInr{
		width:92vw;
		margin:0 auto;
	}

	.talkSec .pInr h3{
		border-left-width:1.4vw;
		margin-bottom:5vw;
	}

	.talkSec .pInr h3 div{
		padding:0.5vw 0 0.5vw 2vw;
		font-size:3vw;
	}

	.talkSec .pInr p{
		line-height:2;
		margin-bottom:6vw;
		font-size:2vw;
	}

	.talkSec .pInr p:last-child{
		margin-bottom:0px;
	}

	.talkName01,.talkName02{
		padding-right:1vw;
	}

	.secPhoto{
		padding-top:4vw;
		width:70vw;
	}

	/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

	.commentSec{
		padding:0 0 5vw ;
	}

	.commentSec p{
		font-sizw:1.7vw;
	}





	/*下部　職種ボタン*/
	/*----------------------------------------------------*/

	.occupationList{
		width:92vw;
		padding:6vw 1.5vw 1vw;
		margin:0 auto 0;
	}

	.occupationList h2{
		font-size:3vw;
		margin-bottom:7vw;
	}

	.occupationList ul:not(.item01) li:nth-of-type(2n) {
		margin-right: 0px;
	}


	.occupationList li .btnModal{
		border-radius: 10vw;
	}

	.occupationList li .btnModal span{
		background-size:1.4vw;
		background-position:right 2vw center;
		font-size: 1.8vw;
		line-height: 1.4;
		height: 10vw;
	}


	/*1つ並び*/

	.occupationList ul{
		padding-bottom:5vw;
		margin:0 auto;
	}

	.occupationList ul li {
		width:38vw;
		margin-bottom:4vw;
	}


	.occupationList li .btnModal::after {
		width: 1.8vw;
		height: 1.8vw;
		right:3vw;
	}


	/*1つ並び*/
	.occupationList ul.item01{
		width: 60vw;
		justify-content: center;
		margin:0 auto;
	}

	.occupationList ul.item01 li{
		width: 60vw;
	}


	/*2つ並び*/
	.occupationList ul.item02,
	.occupationList ul.item03{
		width:84vw;
		justify-content: space-between;
		margin:0 auto;
	}


	.occupationList ul.item02 li{
		width: 41vw;
	}

	/*3つ並び*/
	.occupationList ul.item03 li{
		width: 41vw;
		margin-bottom: 2vw;
		margin-right: 1.5vw;
	}

/*▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲*/
}		/* 421px -> 750px :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/













/*sp only　:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
@media screen and (max-width: 420px){
/*▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼*/

	#ctInrHeader .pInr{
		width:100%;
		background:none;
	}

	#inrHeadImg{
		position:relative;
		width:100%;
		height:96vw;
		margin-bottom:8vw;
	}

	h1{
		width:88vw;
		bottom:0;
	}

	h1::after{
		border-bottom:2px solid var(--cRed);
	}

	h1 > div{
		width:88vw;
		margin-bottom:0.6vw;
	}
	h1 > div span{
		height:30vw;
		padding:0 1vw 0 2vw;
		font-size:4.3vw;
		line-height:1.8;
	}

	#inrHeadImg figure{
		width:100%;
		top:14vw;
		right:0;
	}


/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/


	#ctInrIntro p{
		font-size:3vw;
		line-height:2;
		padding-bottom:10vw;
	}

/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

	#ctInrProfile{
		background-image:linear-gradient(rgba(240,240,240,0) 10vw, rgba(240,240,240,1) 10vw, rgba(240,240,240,1)  );
		padding-bottom:2vw;
	}

	#ctInrProfile h2{
		width:28vw;
		margin:0 auto 4vw;
	}

	#ctInrProfile h2::before{
		width:10vw;
		height:1vw;
		margin-bottom:3vw;
	}

	#ctInrProfileWrap{
		width:86vw;
		margin:0 auto;
	}

	.ctInrProfileItem{
		width:86vw;
		display:flex;		
		align-items: center;
		margin-bottom:6vw;
	}

	.ctInrProfileImg{
		width:28vw;
		background:rgba(255,255,255,0.7);
		padding:1vw;
		order:0;
	}

	.ctInrProfileTxt{
		order:1;
	}

	.ctInrProfileTxt dt{
		width:66vw;
		border-bottom:1px dotted #333333;
		font-size:3.6vw;
		padding-left:3vw;
		padding-bottom:1vw;
		margin-bottom:1vw;
		font-weight:bold;
	}

	.ctInrProfileTxt dd{
		font-size:3vw;
		padding-left:3vw;
	}


	/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

	.talkSec{
		padding:8vw 0;
	}

	.talkSec .pInr,	.commentSec .pInr{
		width:92vw;
		margin:0 auto;
	}

	.talkSec .pInr h3{
		border-left-width:1.4vw;
		margin-bottom:8vw;
	}

	.talkSec .pInr h3 div{
		padding:0.5vw 0 0.5vw 2vw;
		font-size:4vw;
	}

	.talkSec .pInr p{
		line-height:2;
		margin-bottom:9vw;
		font-size:3.2vw;
	}

	.talkSec .pInr p:last-child{
		margin-bottom:0px;
	}

	.talkName01,.talkName02{
		padding-right:1vw;
	}

	.secPhoto{
		padding-top:4vw;
		width:80vw;
	}

	/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

	.commentSec{
		padding:0 0 5vw ;
	}

	.commentSec p{
		font-size:2.7vw;
	}


	/*:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

	.occupationList{
		width:92vw;
		padding:6vw 1.5vw 1vw;
		margin:0 auto;
	}

	.occupationList h2{
		font-size:4vw;
		margin-bottom:7vw;
	}

	.occupationList ul:not(.item01) li:nth-of-type(2n) {
		margin-right: 0px;
	}


	.occupationList li .btnModal{
		border-radius: 10vw;
	}

	.occupationList li .btnModal span{
		background-size:2.2vw;
		background-position:right 2.8vw center;
		font-size: 3vw;
		line-height: 1.4;
		height: 14vw;
	}


	/*1つ並び*/

	.occupationList ul{
		padding-bottom:5vw;
		margin:0 auto;
	}

	.occupationList ul li {
		width:80vw;
		margin:0 auto 4vw !important;
	}


	.occupationList li .btnModal::after {
		width: 1.8vw;
		height: 1.8vw;
		right:3vw;
	}







/*▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲*/
}	/* -> 400px :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/