/**
 * 入社4年目 SYSTEM JOCKEY のここだけの話
 * ---------------------------------------- */
.p-crosstalk {
	position: relative;
	padding-bottom: 120px;
}
.crosstalk_kv {
	overflow: hidden;
	position: relative;
	height: calc(100vh - 64px);
 	height: calc(var(--vh) - 64px);
	margin: 0 -24px;
	padding: 0 24px;
	background: #27b53a url(../img/bg_stripe2.png) center top / 250px 250px;
}
.crosstalk_kv .kv_title,
.crosstalk_kv .kv_image,
.crosstalk_kv .kv_title .tail,
.crosstalk_kv .kv_crosstalk,
.crosstalk_kv .scroll {
	position: absolute;
}
.crosstalk_kv .kv_title {
	z-index: 1;
}
.crosstalk_kv .kv_image img {
	-webkit-mask-image: url(../img/mask_crosstalk.svg);
	-webkit-mask-size: 100% 100%;
	mask-image: url(../img/mask_crosstalk.svg);
	mask-size: 100% 100%;
}
.crosstalk_kv .scroll {
	display: flex;
	flex-direction: column;
	align-items: center;
	row-gap: 12px;
	bottom: 24px;
	left: 24px;
}
.crosstalk_kv .scroll path {
	fill: currentcolor;
}
.crosstalk_kv .scroll line {
	fill: none;
	stroke: currentcolor;
	stroke-dasharray: 60px 120px;
	stroke-dashoffset: 0;
}
.crosstalk_kv .scroll.is-hover line {
	animation: stretchScroll 1s cubic-bezier(.7,0,.3,1);
}
@keyframes stretchScroll {
	from { stroke-dashoffset: 0; }
	to { stroke-dashoffset: 180px; }
}
@media screen and (min-width: 768px) {
	.crosstalk_kv {
		min-height: 720px;
	}
	.crosstalk_kv .kv_title {
		top: calc(50% - 324px);
		right: calc(50% - 476px);
	}
	.crosstalk_kv .kv_image {
		top: calc(50% - 300px);
		left: calc(50% - 520px);
		width: 1040px;
	}
	.crosstalk_kv .kv_title .tail {
		top: 40%;
		right: calc(100% - 32px);
	}
	.crosstalk_kv .kv_crosstalk {
		top: calc(50% - 320px);
		left: calc(50% - 476px);
	}
}
@media screen and (max-width: 1000px) and (min-width: 768px) {
	.crosstalk_kv .kv_title {
		top: calc(50% - 32.8vw);
		right: 24px;
		width: 16.6vw;
	}
	.crosstalk_kv .kv_title .tail {
		right: calc(100% - 3.2vw);
		width: 11vw;
	}
	.crosstalk_kv .kv_crosstalk {
		left: 24px;
		width: 41.7vw;
	}
}
@media screen and (max-width: 767px) {
	.crosstalk_kv {
		min-height: 552px;
	}
	.crosstalk_kv .kv_title {
		top: calc(50% - 134vw / 3.75);
		right: calc(50% - 100vw / 3.75);
		width: calc(200vw / 3.75);
	}
	.crosstalk_kv .kv_image {
		top: calc(50% - 40vw);
		left: 24px;
		width: calc(100% - 48px);
	}
	.crosstalk_kv .kv_title .tail {
		top: calc(100% - 16vw / 3.75);
		right: 45%;
		width: calc(22vw / 3.75);
	}
	.crosstalk_kv .kv_crosstalk {
		top: calc(50% - 208vw / 3.75);
		left: calc(16vw / 3.75);
		width: calc(243vw / 3.75);
	}
	.crosstalk_kv .kv_title img,
	.crosstalk_kv .kv_crosstalk img {
		width: 100%;
	}
	.crosstalk_kv .kv_image {
		align-self: flex-end;
		padding-bottom: calc(32vw / 3.75);
	}
}
@media screen and (max-width: 479px) {
	.crosstalk_kv {
		height: calc(100vh - 48px);
 		height: calc(var(--vh) - 48px);
		margin: 0 -16px;
		padding: 0 16px;
	}
	.crosstalk_kv .kv_title {
		top: calc(50% - 172px);
		right: calc(50% - 134px);
		width: 268px;
	}
	.crosstalk_kv .kv_image {
		top: calc(50% - 192px);
		left: calc(50% - 220px);
		width: 440px;
	}
	.crosstalk_kv .kv_crosstalk {
		top: calc(50% - 256px);
		left: calc(50% - 172px);
		width: 243px;
	}
}
@media screen and (max-width: 374px) {
	.crosstalk_kv .kv_title .tail {
		top: calc(100% - 16px);
		width: 22px;
	}
	.crosstalk_kv .kv_crosstalk {
		left: 16px;
	}
}

/* :::::: リード文 :::::: */
.crosstalk_lead {
	margin: 80px 0 50vh;
	color: #27b53a;
	font-size: 18px;
	line-height: 1.6;
	font-weight: 700;
	text-align: center;
}
.crosstalk_lead .l {
	display: inline-block;
	padding: .1em .6em .2em;
	background: white;
}
.crosstalk_lead .l:nth-child(n+2) {
	margin-top: .6em;
}
@media screen and (max-width: 767px) {
	.crosstalk_lead {
		margin: 24vh 0 64vh;
	}
}

/* :::::: Profile :::::: */
.crosstalk_profile {
	position: relative;
	margin: 0 -24px;
	padding: 24px;
	background: white;
}
.profile_title {
	z-index: 0;
	position: relative;
	width: 200px;
	height: 40px;
	margin: -40px auto 0;
	text-align: center;
}
.profile_title::before {
	content: "";
	z-index: -1;
	position: absolute;
	top: -24px;
	left: calc(50% - 100px);
	width: 100%;
	height: 80px;
	border-top-left-radius: 100% 180%;
	border-top-right-radius: 100% 180%;
	background: white;
}
.profile_list {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	row-gap: 40px;
	max-width: 1080px;
	margin: 0 auto;
	padding: 64px 0 40px;
	border-top: 3px solid;
	border-bottom: 3px solid;
	border-image: url(../img/stripe_line.svg) 3 0 / 4px 6px round;
}
.profile_item {
	flex-basis: 50%;
}
.profile_item .data {
	font-size: 12px;
}
.profile_item .data dt {
	text-align: center;
}
.profile_item .data .assign {
	padding-bottom: 1.2em;
	border-bottom: 2px solid;
	border-image: url(../img/stripe_line.svg) 0 0 3 / 3px auto round;
	font-size: 10px;
	line-height: 1.4;
	text-align: center;
}
.profile_item .data dd {
	margin-top: .8em;
	text-align: justify;
}
@media screen and (min-width: 768px) {
	.profile_item {
		display: flex;
		justify-content: space-between;
		padding-right: 32px;
	}
	.profile_item .photo {
		flex-basis: 42%;
	}
	.profile_item .data {
		flex-basis: calc(58% - 16px);
	}
}
@media screen and (max-width: 767px) {
	.profile_list {
		row-gap: 8px;
		padding: 24px 0;
	}
	.profile_item {
		flex-basis: calc(50% - 16px);
	}
	.profile_item .photo {
		text-align: center;
	}
	.profile_item .photo img {
		margin-left: -14px;
	}
	.profile_item .data {
		margin-top: 16px;
	}
}
@media screen and (max-width: 479px) {
	.crosstalk_profile {
		padding: 24px 16px;
		margin: 0 -16px;
	}
	.profile_item .photo img {
		margin-left: calc(-14vw / 3.75);
	}
}

/* :::::: Cross Talk :::::: */
.crosstalk_talk {
	max-width: 970px;
	margin: 80px auto 0;
}
.talk_title {
	position: relative;
	font-size: 24px;
	font-family: "Midashi Go MB31", sans-serif;
	text-align: center;
}
.talk_container {
	max-width: 800px;
	margin: 40px auto 0;
}
.talk_section {
	display: flex;
	flex-direction: column;
	gap: 24px;
	padding: 80px 24px;
	border-radius: 10px;
	background: rgba(255,255,255,.7);
}
.talk_section:nth-of-type(n+2) {
	margin-top: 104px;
}
.talk_section:nth-of-type(n+2) .talk_title {
	padding-top: 1em;
}
.talk_section:nth-of-type(n+2) .talk_title::before {
	content: "";
	position: absolute;
	top: 0;
	left: calc(50% - 24px);
	width: 48px;
	height: 6px;
	background: url(../img/stripe_line.svg) center / 6px 9px;
}
@media screen and (max-width: 479px) {
	.talk_title {
		font-size: 18px;
	}
	.talk_section {
		gap: 16px;
		padding: 48px 16px;
	}
	.talk_section:nth-of-type(n+2) {
		margin-top: 80px;
	}
}

.talk_bln {
	position: relative;
	width: calc(100% - 120px);
	max-width: 340px;
	padding: 24px 32px;
	border-radius: 20px;
	font-size: 14px;
	background: white;
	filter: drop-shadow(5px 5px 5px rgba(0,0,0,.1));
}
.talk_img img {
	border-radius: 20px;
}
.talk_bln:first-of-type {
	margin-top: .5em;
}
.talk_bln:nth-of-type(odd),
.talk_bln:nth-of-type(odd) + .talk_img {
	margin-left: 120px;
}
.talk_bln:nth-of-type(even),
.talk_bln:nth-of-type(even) + .talk_img {
	align-self: flex-end;
	margin-right: 120px;
}
.talk_bln .n {
	display: block;
	position: relative;
}
.talk_bln .n::after {
	content: "";
	position: absolute;
	top: 40%;
	width: 44px;
	height: 28px;
	background: center / cover no-repeat;
}
.talk_bln:nth-of-type(odd) .n::after {
	right: calc(100% + 8px);
	background-image: url(../../crosstalk/img/bln_tail_l.svg);
}
.talk_bln:nth-of-type(even) .n::after {
	left: calc(100% + 8px);
	background-image: url(../../crosstalk/img/bln_tail_r.svg);
}
.talk_bln .t {
	display: block;
	margin-top: .5em;
}
.talk_bln::before {
	content: "";
	position: absolute;
	top: 0;
	width: 88px;
	height: 88px;
	border-radius: 80px;
	background: center / cover no-repeat;
}
.talk_bln:nth-of-type(odd)::before {
	left: -120px;
}
.talk_bln:nth-of-type(even)::before {
	right: -120px;
}
.talk_bln.-kitagawa:nth-of-type(odd)::before { background-image: url(../../crosstalk/img/kitagawa_thumb1.jpg); }
.talk_bln.-kitagawa:nth-of-type(even)::before { background-image: url(../../crosstalk/img/kitagawa_thumb2.jpg); }
.talk_bln.-kojima:nth-of-type(odd)::before { background-image: url(../../crosstalk/img/kojima_thumb1.jpg); }
.talk_bln.-kojima:nth-of-type(even)::before { background-image: url(../../crosstalk/img/kojima_thumb2.jpg); }
.talk_bln.-okada:nth-of-type(odd)::before { background-image: url(../../crosstalk/img/okada_thumb1.jpg); }
.talk_bln.-okada:nth-of-type(even)::before { background-image: url(../../crosstalk/img/okada_thumb2.jpg); }
.talk_bln.-uesugi:nth-of-type(odd)::before { background-image: url(../../crosstalk/img/uesugi_thumb1.jpg); }
.talk_bln.-uesugi:nth-of-type(even)::before { background-image: url(../../crosstalk/img/uesugi_thumb2.jpg); }
@media screen and (max-width: 479px) {
	.talk_bln {
		padding: 16px 24px;
		border-radius: 10px;
		font-size: 13px;
		line-height: 1.7;
	}
	.talk_bln .n img {
		width: auto;
		height: 16px;
	}
}

/* :::::: 背景 :::::: */
.crosstalk_bg {
	z-index: -1;
	position: absolute;
 	top: var(--vh);
	right: 0;
	left: 0;
	height: 100vh;
	backface-visibility: hidden;
}
.crosstalk_bg img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
}
.crosstalk_bg.-fix:not(.-btm) {
 	position: fixed;
	top: 0;
}
.crosstalk_bg.-btm {
	position: absolute;
 	top: auto;
	bottom: 0;
}
.crosstalk_bg .bg {
	opacity: 0;
}
.crosstalk_bg.is-anim .bg {
	transition: opacity .6s .2s;
	will-change: opacity;
}
.crosstalk_bg[data-current="1"] .-bg1,
.crosstalk_bg[data-current="2"] .-bg2,
.crosstalk_bg[data-current="3"] .-bg3,
.crosstalk_bg[data-current="4"] .-bg4,
.crosstalk_bg[data-current="5"] .-bg5,
.crosstalk_bg[data-current="6"] .-bg6,
.crosstalk_bg[data-current="7"] .-bg7,
.crosstalk_bg[data-current="8"] .-bg8,
.crosstalk_bg[data-current="9"] .-bg9 {
	opacity: 1;
	transition-delay: 0s;
}