/* intro
----------------------------------------------- */

/* js */

.js-parallax-ready .intro__date {
	opacity: 0;
	transform: translateX(5%);
}
.js-parallax-ready .intro__catch,
.js-parallax-ready .intro__name {
	opacity: 0;
	transform: translateX(-5%);
}

.js-parallax-start .intro__date,
.js-parallax-start .intro__catch,
.js-parallax-start .intro__name {
	opacity: 1;
	transform: translateX(0);
	transition-property: opacity, transform;
	transition-duration: 0.5s;
	transition-timing-function: cubic-bezier(1, 0, 0, 1);
	transition-delay: 0.3s;
}


/* title
----------------------------------------------- */

/* js */

.js-parallax-ready .title__label {
	opacity: 0;
	transform: translateX(5%);
}
.js-parallax-ready .title__text {
	opacity: 0;
	transform: translateX(-5%);
}

.js-parallax-start .title__label,
.js-parallax-start .title__text {
	opacity: 1;
	transform: translateX(0);
	transition-property: opacity, transform;
	transition-duration: 0.5s;
	transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
}


/* other
----------------------------------------------- */

/* js */

.js-parallax-ready.other:after {
	opacity: 0;
	transform: translateX(-50%) skewX(-30deg);
}

.js-parallax-start.other:after {
	opacity: 1;
	transform: translateX(0) skewX(-30deg);
	transition-property: opacity, transform;
	transition-duration: 0.85s;
	transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);
}

/* 背景パララックス
----------------------------------------------- */
body {
  margin: 0;
  height: 200vh;
  background: #FFF;
}

.scene {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.layer {
  position: absolute;
  width: 100%;
  height: 140%;
  top: -20%;
  left: 0;
  background-position: center;
  background-size: cover;
}

/* ① 背景 */
.bg {
  background-image: url('../img/bg.jpg');
  z-index: -4;
}

/* ② 格子 */
.grid {
  background-image: url('../img/grid.png');
  background-repeat: repeat;
  background-size: auto;
  mix-blend-mode: overlay;
 opacity: 0.6; 
  z-index: -3;
}

/* ③ 奥パーティクル */
.particle-back {
  background-image: url('../img/particle-small.png');
  background-repeat: repeat;
  background-size: auto;
  filter: blur(2px);
  opacity: 0.4;
  z-index: -2;
}

/* ④ 手前パーティクル */
.particle-front {
  background-image: url('../img/particle-large.png');
  background-repeat: repeat;
  background-size: auto;
  opacity: 0.7;
  z-index: -1;
}

.pageup, .anchornav, .footer {
  position: relative;
  z-index: 1;
}

/* pc
----------------------------------------------- */
.sp_only {
	display: none;
}

	/* pagetitle-interview
	----------------------------------------------- */

	.pagetitle-interview {
		position: relative;
		padding: 255px 0 215px;
        z-index: 1;
	}

	.pagetitle-interview.u-pb150{
		padding-bottom: 150px; 
	}

	.pagetitle-interview .pagetitle__inner {
		margin: auto;
		padding: 60px 20px 50px;
		width: 210px;
		background: rgba(0,150,250,0.8);
	}
	.pagetitle-interview .pagetitle__text {
		margin: 0;
		font-size: 38px;
		color: #fff;
		text-indent: 0.1em;
		letter-spacing: 0.1em;
	}
	.pagetitle-interview .pagetitle__label {
		margin: 15px 0 0;
		font-size: 18px;
		color: #fff;
	}
	.pagetitle-interview.pagetitle:before {
		display: none;
	}

	/* 一覧ページ トップビジュアル */
	.pagetitle-interview.pagetitle:after {
		background: url(../img/mainimage.jpg);
		background-position: center center;
		background-repeat: no-repeat;
		background-size: cover;
		opacity: 1;
	}

	/* 個別 intro
	----------------------------------------------- */
.intro {
    position: relative;
	width: 100%;
	height: 570px;
	overflow: hidden;
}
.intro_bg {
    position: absolute;
	background: #edf6fe;	
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 570px;
}
	.intro__inner {
		position: relative;
		width: 1100px;
		height: 570px;
		margin: 0 auto;
	}
	.intro__inner .intro__image_box_sp {
		display: none;
	}

	.intro__inner .intro__title {
        position: absolute;
		right: 0;
		bottom: 8%;
	}
    .intro__job {
		font-family: Caveat;
		display: block;
		transform: rotate(-16deg);
		line-height: .9;
		font-size: 90px;
	}
	.intro__job span.small {
		font-size: 70px;
	}
    .intro__box {
		width: 400px;
		margin-top: 40px;
		padding: 40px 50px;
		color: #0b1963;
	}
	.intro__box .intro__catch {
		font-size: 28px;
		line-height: 1.6;
	}
	.intro__box .intro__date {
        font-weight: normal;
		margin-top: 30px;
		margin-bottom: 10px;
	}
	.intro__box .intro__name {
		line-height: 1.6;
	}
   .intro__box .intro__box_line {
		position: absolute;
		bottom: -15px;
		right: -25px;
		width: 90%;
		height: 40px;
		z-index: 3;
   }

.intro__inner .bg_line1 {
	position: absolute;
	left: -200px;
	top: 0px;
	width: 20%;
	height: 200px;
	z-index: 1;
	clip-path: polygon(50% 0, 100% 0%, 50% 100%, 0% 100%);
	opacity: 0;
}
.intro__inner .bg_line2 {
	position: absolute;
	left: -200px;
	top: 0px;
	width: 40%;
	height: 400px;
	z-index: 1;
	clip-path: polygon(50% 0, 100% 0%, 50% 100%, 0% 100%);
	opacity: 0;
}
.intro__inner .bg_line3 {
	position: absolute;
	left: -200px;
	top: 0px;
	width: 15%;
	height: 150px;
	z-index: 1;
	clip-path: polygon(50% 0, 100% 0%, 50% 100%, 0% 100%);
	opacity: 0;
}
.intro_wave {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100px;
    z-index: 3;
}
.intro_wave img {
	width: 100%;
	height: 100%;
}

	/* anchornav
	----------------------------------------------- */
	.anchornav {
		background: rgba(0,150,250,0.8);
		transform: translateY(-100%);
	}
	.anchornav__items {
		padding: 5px 0;
	}


	/* content
	----------------------------------------------- */
.content {
  position: relative;
  z-index: 1;
}

	/* 一覧職種枠 */
.job_box {
	position: relative;
	overflow: hidden;
	z-index: 1;
}
.job_box .bg_line1 {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 20%;
	height: 200px;
	z-index: 1;
	clip-path: polygon(50% 0, 100% 0%, 50% 100%, 0% 100%);
	opacity: 0;
}
.job_box .bg_line2 {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 40%;
	height: 400px;
	z-index: 1;
	clip-path: polygon(50% 0, 100% 0%, 50% 100%, 0% 100%);
	opacity: 0;
}
.job_box .bg_line3 {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 15%;
	height: 150px;
	z-index: 1;
	clip-path: polygon(50% 0, 100% 0%, 50% 100%, 0% 100%);
	opacity: 0;
}

	/* 一覧職種タイトル */
    .content__title {
		position: relative;
		z-index: 2;
    	margin-top: 0px !important;
    }

.content .interview_list {
  position: relative;
  margin-top: 30px;
  width: 100%;
  display: flex;
  gap: 0% 2%;
  justify-content: center;
  flex-wrap: wrap;
  z-index: 2;
}
.content .interview_list a {
  width: 32%;
  display: block;
  text-decoration: none;
  margin-bottom: 40px;
}
.content .interview_list a li {
	display: block;
}
.content .interview_list a li img {
	width: 100%;
	height: auto;
	border-radius: 50%;
	transition: 0.25s;
}
.content .interview_list a:hover li img {
	border-radius: 10px;
}
.content .interview_list li .interview_txtbox {
	position: relative;
	background-color: rgba(255,255,255,1);
	width: 90%;
    margin: -50px auto 15px auto;
	padding: 10px 15px 10px 15px;
	box-sizing: border-box;
	position: relative;
	z-index: 1;
	transform: rotate(-5deg);
	overflow: visible;
	box-shadow: 0px 0px 11px 4px rgba(0, 0, 0, 0.1);
}

.content .interview_list a:hover li .interview_txtbox {
	transform: rotate(0deg);
}
.content .interview_list li .interview_catch {
	display: inline;
	margin-top: 10px;
	font-weight: bold;
	font-size: 18px;
	line-height: 1.6;
    background-position: left bottom;
    background-repeat: no-repeat;
    background-size: 100% .5em;
}

.content .interview_list li .interview_detailbox {
	border-top: dotted 1px #282828;
	margin-top: 10px;
	padding: 10px 0px;

}
.content .interview_list li .interview_detailbox .belong {
	line-height: 1.6;
	color: #8d8d8d;
	font-size: 12px;
}
.content .interview_list li .interview_detailbox .job {
	line-height: 1.6;
}
.content .interview_list li .interview_detailbox .job span {
	margin-left: 10px;
	color: #282828;
}

/* 一覧_職種カラー */
#business .bg_line1 {
	background: #cd3c6250;
}
#business .bg_line2,
#business .bg_line3 {
	background: #cd3c6290;
}
#business .content__title:after {
	background: #cd3c62 !important;
}
#business .interview_catch {
    color: #cd3c62;
	background-image: repeating-linear-gradient(-45deg, #cd3c6220 0, #cd3c6230 4px, transparent 4px, transparent 8px);
}
#business .job {
    color: #cd3c62;
}
#planner .bg_line1 {
	background: #fb8c3250;
}
#planner .bg_line2,
#planner .bg_line3 {
	background: #fb8c3290;
}
#planner .content__title:after {
	background: #fb8c32 !important;
}
#planner .interview_catch {
    color: #fb8c32;
	background-image: repeating-linear-gradient(-45deg, #fb8c3220 0, #fb8c3230 4px, transparent 4px, transparent 8px);
}
#planner .job {
    color: #fb8c32;
}
#programmer .bg_line1 {
	background: #3c65e950;
}
#programmer .bg_line2,
#programmer .bg_line3 {
	background: #3c65e990;
}
#programmer .content__title:after {
	background: #3c65e9 !important;
}
#programmer .interview_catch {
    color: #3c65e9;
	background-image: repeating-linear-gradient(-45deg, #3c65e920 0, #3c65e930 4px, transparent 4px, transparent 8px);
}
#programmer .job {
    color: #3c65e9;
}
#designer .bg_line1 {
	background: #14b48850;
}
#designer .bg_line2,
#designer .bg_line3 {
	background: #14b48890;
}
#designer .content__title:after {
	background: #14b488 !important;
}
#designer .interview_catch {
    color: #14b488;
	background-image: repeating-linear-gradient(-45deg, #14b48820 0, #14b48830 4px, transparent 4px, transparent 8px);
}
#designer .job {
    color: #14b488;
}
#sound .bg_line1 {
	background: #1d9ba050;
}
#sound .bg_line2,
#sound .bg_line3 {
	background: #1d9ba090;
}
#sound .content__title:after {
	background: #1d9ba0 !important;
}
#sound .interview_catch {
    color: #1d9ba0;
	background-image: repeating-linear-gradient(-45deg, #1d9ba020 0, #1d9ba030 4px, transparent 4px, transparent 8px);
}
#sound .job {
    color: #1d9ba0;
}
#technical .bg_line1 {
	background: #74419450;
}
#technical .bg_line2,
#technical .bg_line3 {
	background: #74419490;
}
#technical .content__title:after {
	background: #744194 !important;
}
#technical .interview_catch {
    color: #744194;
	background-image: repeating-linear-gradient(-45deg, #74419420 0, #74419430 4px, transparent 4px, transparent 8px);
}
#technical .job {
    color: #744194;
}
#tech-artist .bg_line1 {
	background: #d943a650;
}
#tech-artist .bg_line2,
#tech-artist .bg_line3 {
	background: #d943a690;
}
#tech-artist .content__title:after {
	background: #d943a6 !important;
}
#tech-artist .interview_catch {
    color: #d943a6;
	background-image: repeating-linear-gradient(-45deg, #d943a620 0, #d943a630 4px, transparent 4px, transparent 8px);
}
#tech-artist .job {
    color: #d943a6;
}

/* 人事追加 */
#head_dev .bg_line1 {
	background: #0082ca50;
}
#head_dev .bg_line2,
#head_dev .bg_line3 {
	background: #0082ca90;
}
#head_dev .content__title:after {
	background: #0082ca !important;
}
#head_dev .interview_catch {
    color: #0082ca;
	background-image: repeating-linear-gradient(-45deg, #0082ca20 0, #0082ca30 4px, transparent 4px, transparent 8px);
}
#head_dev .job {
    color: #0082ca;
}

#producer-director .bg_line1 {
	background: #8e7cc350;
}
#producer-director .bg_line2,
#producer-director .bg_line3 {
	background: #8e7cc390;
}
#producer-director .content__title:after {
	background: #8e7cc3 !important;
}
#producer-director .interview_catch {
    color: #8e7cc3;
	background-image: repeating-linear-gradient(-45deg, #8e7cc320 0, #8e7cc330 4px, transparent 4px, transparent 8px);
}
#producer-director .job {
    color: #8e7cc3;
}

/* 個別 キャリアパス */
.career_path {
	margin-top: 20px;
	margin-left: auto;
	margin-right: auto;
	width: 80%;
  position: relative;
  z-index: 999;
}
#career-area {
  padding: 20px 50px;
  min-height: 55px;
  line-height: 1.6;
  xbox-shadow: 0px 0px 11px 4px rgba(0, 0, 0, 0.1);
  border-radius: 60px;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}
.career_buttons {
  display: flex;
  gap: 8px;
}
.career_buttons .tab {
  flex: 1;
  height: 60px;
  padding-top: 35px;
  padding-bottom: 20px;
  xcolor: #444242;
  background-color: #FFF;
  box-sizing: border-box; 
  cursor: pointer;
  transition: opacity 0.3s;
  text-align: center;
  position: relative;
  box-sizing: border-box;
  border: 1px solid #b6b6b6;
}
.career_buttons .tab::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 100%;
  margin-top: -10px;
  border: 10px solid transparent;
  border-left: 10px solid #b6b6b6;
  z-index: 3;
}
.career_buttons .tab.last::after {
  display: none;
}
.career_buttons .tab span {
	background: #b6b6b6;
	color: #fff;
	border: 1px solid;
	border-radius: 20px;
	padding: 4px 3px;
	position: absolute;
	top: 2px;
	left: calc( 50% - 15px );
}
.career_buttons .tab.active {
  opacity: 1;
  color: #fff;
  background: #ddd;
  position: relative;
}
.career_buttons .tab.active span {
	background: #fff;
	border: 4px solid;
	border-radius: 20px;
	padding: 9px 8px;
	position: absolute;
	top: -15px;
	left: calc( 50% - 25px );
	z-index: 10;
}

.career_content {
  display: none;
}
.career_content.active {
  display: block;
}

h4.content__subtitle {
    font-size: 28px;
	line-height: 1.4;
	color: #0b1963;
}
h4.content__subtitle .q-number {
	display: inline-block;
	color: #FFF;
	font-size: 20px;
	padding: 10px 8px;
	margin-right: 10px;
	vertical-align: 15%;
	border-radius: 40px;
}
h4.content__subtitle span {
	display: inline-block;
	position: relative;
}
h4.content__subtitle span.h4_line::after {
	content: "";
	position: absolute;
	display: block;
	left: 0;
	bottom: -13px;
	width: 40px;
	height: 3px;
}

.q-1_box {
	position: relative;
	margin-bottom: 30px;
	margin-top: 50px;
}

.q-1 {
	margin-left: 0%;
	padding: 10px 30px 30px;
	border-radius: 20px;
	box-sizing: border-box;
	width: 70%;
}
.q-1_box .point_ico3 {
	position: absolute;
	width: 15%;
	top: 50px;
	right: 5%;
}
.q-1_box .point_ico3 img {
    width: 100%;
	height: auto;
}

.q-2_box {
	display: flex;
	justify-content: space-between;
	align-items: stretch;
	margin-top: 40px;
}

.img_prof {
    position: relative;
	width: 45%;
	min-height: 300px;
	border-radius: 20px;
    overflow: hidden;
}
.img_prof img {
	width: 100%;
	height: auto;
	border-radius: 20px;
}
.q-2 {
	width: 50%;
	position: relative;
	padding: 10px 30px 30px;
	border-radius: 20px;
	box-sizing: border-box;
}


.q-3_box {
	display: flex;
	justify-content: space-between;
	align-items: stretch;
	margin-top: 60px;
}
.q-3 {
	width: 50%;
	border-radius: 20px;
	box-sizing: border-box;
}
.img_q-3 {
	width: 45%;
	border-radius: 20px;
    overflow: hidden;
	margin-top: 30px;
}
.img_q-3 img {
	width: 100%;
	height: auto;
	border-radius: 20px;
}

.q-4 {
	width: 600px;
	margin: 40px auto 0px;
	padding: 10px 30px 30px;
	box-sizing: border-box;
	border-radius: 20px;
}

.q-5_box {
	display: flex;
	justify-content: space-between;
	align-items: stretch;
	margin-top: 20px;
}

.img_q-5 {
    position: relative;
	width: 45%;
    overflow: hidden;
	margin-top: 30px;
}
.img_q-5 .description {
	margin-top: 10px;
    font-size: 80%;
	line-height: 1.6;
}
.img_q-5 img {
	width: 100%;
	height: auto;
	border-radius: 20px;
}
.q-5 {
	width: 50%;
	position: relative;
	padding: 0px 30px 30px;
	border-radius: 20px;
	box-sizing: border-box;
}

.q-6 {
	width: 100%;
	margin-top: 50px;
	margin-bottom: 150px;
	padding: 10px 0px 30px;
}
.q-6 p {
	display: inline-block;
	width: 80%;
}
.img_wide {
	width: 85%;
	margin-top: 30px;
	margin-bottom: -100px;
	margin-left: 15%;
}
.img_wide img {
	width: 100%;
	height: auto;
	border-radius: 20px;
}
.q-7_box {
	position: relative;
	width: 90%;
	margin: 0px auto 0px;
	padding-top: 50px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.q-7_box .point_ico1 {
	position: absolute;
	width: 15%;
	bottom: -20px;
	left: -10%;
}
.q-7_box .point_ico2 {
	position: absolute;
	width: 20%;
	top: -20px;
	right: -20%;
}
.q-7_box .point_ico1 img,
.q-7_box .point_ico2 img {
    width: 100%;
	height: auto;
}
.q-7 {
	width: 75%;
    position: relative;
    padding: 10px 40px 30px;
	box-sizing: border-box;
	margin-bottom: 80px;
}
.q-7:before,.q-7:after{ 
    content:'';
    width: 40px;
    height: 30px;
    position: absolute;
    display: inline-block;
}
.q-7:before {
    top:0;
    left: 0;
}
.q-7:after {
    bottom:0;
    right: 0;
}
.q-7_img {
	width: 20%;
}
.q-7_img img {
	width: 100%;
	height: auto;
}

.q-7_box::after {
  content: "";
  display: block;
  clear: both;
}

.q-8 {
	margin-top: 50px;
	padding: 10px 30px 30px;
	box-sizing: border-box;
	border-radius: 20px;
	width: 80%;
}
.q-9 {
	margin-left: 20%;
	margin-top: 30px;
	padding: 10px 30px 30px;
	box-sizing: border-box;
	border-radius: 20px;
	width: 80%;
}

.q-10_box {
	display: flex;
	justify-content: space-between;
	align-items: stretch;
	margin-top: 20px;
}
.q-10 {
	width: 50%;
	box-sizing: border-box;
}
.img_q-10 {
	width: 45%;
	border-radius: 20px;
    overflow: hidden;
	margin-top: 30px;
}
.img_q-10 img {
	width: 100%;
	height: auto;
	border-radius: 20px;
}

.q-board {
	margin-top: 30px;
	padding: 10px 30px 30px;
	box-sizing: border-box;
	border-radius: 20px;
	width: 100%;
}
.img-board {
	width: 80%;
	border-radius: 20px;
    overflow: hidden;
	margin: 30px auto 0;
}
.img-board img {
	width: 100%;
	height: auto;
	border-radius: 20px;
}


/* スケジュール */
.schedule_box {
	width: 100%;
	margin-top: 100px;
	padding-top: 0;
    position: relative;
    z-index: 0;
}
.schedule_box .schedule_bg {
    position: absolute;
    content: '';
	opacity:0.2;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	background: url(../img/office03_image02.jpg) center no-repeat;
	background-size: cover;
    z-index: -1;
}
.schedule_box .content {
    position: relative;
}
.schedule_box .content h4.content__subtitle {
	position: absolute;
    top: -65px;
  font-family: "Coiny", system-ui;
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0em;
  font-size: 48px;
  color: #96a6bf;
}
.schedule_box-s {
	width: 80%;
	margin: 0px auto 0px;
	padding: 10px 40px 30px;
	box-sizing: border-box;
}
.schedule__dl {
    margin-top: 40px;
	margin-bottom: 80px;
	width: 70%;
	clear: both;
	overflow: hidden;
}
.schedule__dl dt {
	width: 70px;
	min-height: 70px;
	float: left;
	margin-right: 20px;
	font-weight: bold;
	box-sizing: border-box;
    line-height: 1.6;
	  clear: both;
}
.schedule__dl dt img {
	width: 100%;
	height: auto;
}
.schedule__dl dd {
	width: calc(100% - 90px);
	min-height: 70px;
	float: right;
	box-sizing: border-box;
  line-height: 1.6;
}
.schedule__dl dd span {
	font-weight: bold;
}
.schedule_box .content .schedule_img {
    position: absolute;
	right: 0px;
	bottom: 80px;
	width: 350px;
}

.schedule_img img {
	width: 100%;
	height: auto;
	border-radius: 40% 60% 42% 58% / 68% 50% 50% 32%;
}

.schedule_box .schedule_wave {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 203px;
    z-index: 1;
}
.schedule_box .schedule_wave img {
	width: 100%;
	height: 203px;
}
.schedule_box .schedule_wave_sp {
	display: none;
}

/* 記事_職種カラー */
.business_people,
.planner_people,
.programmer_people,
.designer_people,
.sound_people,
.technical_people,
.tech-artist_people,
.head_dev_people,
.producer-director_people {
	background: #f8fcff;
	xposition: relative;
	xz-index: -1;
}

.business_people .q-6 h4.content__subtitle,
.business_people .q-6 .content__text,
.planner_people .q-6 h4.content__subtitle,
.planner_people .q-6 .content__text,
.programmer_people .q-6 h4.content__subtitle,
.programmer_people .q-6 .content__text,
.designer_people .q-6 h4.content__subtitle,
.designer_people .q-6 .content__text,
.sound_people .q-6 h4.content__subtitle,
.sound_people .q-6 .content__text,
.technical_people .q-6 h4.content__subtitle,
.technical_people .q-6 .content__text,
.tech-artist_people .q-6 h4.content__subtitle,
.tech-artist_people .q-6 .content__text,
.head_dev_people .q-6 h4.content__subtitle,
.head_dev_people .q-6 .content__text,
.producer-director_people .q-6 h4.content__subtitle,
.producer-director_people .q-6 .content__text {
    color: #FFF;
}
.business_people .q-6 h4.content__subtitle .q-number,
.planner_people .q-6 h4.content__subtitle .q-number,
.programmer_people .q-6 h4.content__subtitle .q-number,
.designer_people .q-6 h4.content__subtitle .q-number,
.sound_people .q-6 h4.content__subtitle .q-number,
.technical_people .q-6 h4.content__subtitle .q-number,
.tech-artist_people .q-6 h4.content__subtitle .q-number,
.head_dev_people .q-6 h4.content__subtitle .q-number,
.producer-director_people .q-6 h4.content__subtitle .q-number {
	background: #FFF;
}

.business_people .bg_line1 {
	background: #cd3c6250;
}
.business_people .bg_line2,
.business_people .bg_line3 {
	background: #cd3c6290;
}
.business_people .intro__job,
.business_people .job_c,
.business_people .career_buttons .tab.active span,
.business_people .q-6 h4.content__subtitle .q-number,
.business_people .schedule_box .schedule__dl dd span {
    color: #cd3c62;
}
.business_people h4.content__subtitle .q-number,
.business_people h4.content__subtitle span.h4_line::after,
.business_people .q-6,
.business_people .career_buttons .tab.active {
    background-color: #cd3c62;
}
.business_people .q-1,
.business_people .q-2,
.business_people .q-4,
.business_people .q-8,
.business_people .q-9 {
	background-color: #cd3c6220;
}
.business_people .career_buttons .tab.active::after {
  border-left: 10px solid #cd3c62;
}
.business_people .q-7:before{
    border-left: solid 8px #cd3c62;
    border-top: solid 8px #cd3c62;
}
.business_people .q-7:after{
    border-right: solid 8px #cd3c62;
    border-bottom: solid 8px #cd3c62;
}

.planner_people .bg_line1 {
	background: #fb8c3250;
}
.planner_people .bg_line2,
.planner_people .bg_line3 {
	background: #fb8c3290;
}
.planner_people .intro__job,
.planner_people .job_c,
.planner_people .career_buttons .tab.active span,
.planner_people .q-6 h4.content__subtitle .q-number,
.planner_people .schedule_box .schedule__dl dd span {
    color: #fb8c32;
}
.planner_people h4.content__subtitle .q-number,
.planner_people h4.content__subtitle span.h4_line::after,
.planner_people .q-6,
.planner_people .career_buttons .tab.active {
    background-color: #fb8c32;
}
.planner_people .q-1,
.planner_people .q-2,
.planner_people .q-4,
.planner_people .q-8,
.planner_people .q-9 {
	background-color: #fb8c3220;
}
.planner_people .career_buttons .tab.active::after {
  border-left: 10px solid #fb8c32;
}
.planner_people .q-7:before{
    border-left: solid 8px #fb8c32;
    border-top: solid 8px #fb8c32;
}
.planner_people .q-7:after{
    border-right: solid 8px #fb8c32;
    border-bottom: solid 8px #fb8c32;
}

.programmer_people .bg_line1 {
	background: #3c65e950;
}
.programmer_people .bg_line2,
.programmer_people .bg_line3 {
	background: #3c65e990;
}
.programmer_people .intro__job,
.programmer_people .job_c,
.programmer_people .career_buttons .tab.active span,
.programmer_people .q-6 h4.content__subtitle .q-number,
.programmer_people .schedule_box .schedule__dl dd span {
    color: #3c65e9;
}
.programmer_people h4.content__subtitle .q-number,
.programmer_people h4.content__subtitle span.h4_line::after,
.programmer_people .q-6,
.programmer_people .career_buttons .tab.active {
    background-color: #3c65e9;
}
.programmer_people .q-1,
.programmer_people .q-2,
.programmer_people .q-4,
.programmer_people .q-8,
.programmer_people .q-9 {
	background-color: #3c65e920;
}
.programmer_people .career_buttons .tab.active::after {
  border-left: 10px solid #3c65e9;
}
.programmer_people .q-7:before{
    border-left: solid 8px #3c65e9;
    border-top: solid 8px #3c65e9;
}
.programmer_people .q-7:after{
    border-right: solid 8px #3c65e9;
    border-bottom: solid 8px #3c65e9;
}

.designer_people .bg_line1 {
	background: #14b48850;
}
.designer_people .bg_line2,
.designer_people .bg_line3 {
	background: #14b48890;
}
.designer_people .intro__job,
.designer_people .job_c,
.designer_people .career_buttons .tab.active span,
.designer_people .q-6 h4.content__subtitle .q-number,
.designer_people .schedule_box .schedule__dl dd span {
    color: #14b488;
}
.designer_people h4.content__subtitle .q-number,
.designer_people h4.content__subtitle span.h4_line::after,
.designer_people .q-6,
.designer_people .career_buttons .tab.active {
    background-color: #14b488;
}
.designer_people .q-1,
.designer_people .q-2,
.designer_people .q-4,
.designer_people .q-8,
.designer_people .q-9 {
	background-color: #14b48820;
}
.designer_people .career_buttons .tab.active::after {
  border-left: 10px solid #14b488;
}
.designer_people .q-7:before{
    border-left: solid 8px #14b488;
    border-top: solid 8px #14b488;
}
.designer_people .q-7:after{
    border-right: solid 8px #14b488;
    border-bottom: solid 8px #14b488;
}

.sound_people .bg_line1 {
	background: #1d9ba050;
}
.sound_people .bg_line2,
.sound_people .bg_line3 {
	background: #1d9ba090;
}
.sound_people .intro__job,
.sound_people .job_c,
.sound_people .career_buttons .tab.active span,
.sound_people .q-6 h4.content__subtitle .q-number,
.sound_people .schedule_box .schedule__dl dd span {
    color: #1d9ba0;
}
.sound_people h4.content__subtitle .q-number,
.sound_people h4.content__subtitle span.h4_line::after,
.sound_people .q-6,
.sound_people .career_buttons .tab.active {
    background-color: #1d9ba0;
}
.sound_people .q-1,
.sound_people .q-2,
.sound_people .q-4,
.sound_people .q-8,
.sound_people .q-9 {
	background-color: #1d9ba020;
}
.sound_people .career_buttons .tab.active::after {
  border-left: 10px solid #1d9ba0;
}
.sound_people .q-7:before{
    border-left: solid 8px #1d9ba0;
    border-top: solid 8px #1d9ba0;
}
.sound_people .q-7:after{
    border-right: solid 8px #1d9ba0;
    border-bottom: solid 8px #1d9ba0;
}

.technical_people .bg_line1 {
	background: #74419450;
}
.technical_people .bg_line2,
.technical_people .bg_line3 {
	background: #74419490;
}
.technical_people .intro__job,
.technical_people .job_c,
.technical_people .career_buttons .tab.active span,
.technical_people .q-6 h4.content__subtitle .q-number,
.technical_people .schedule_box .schedule__dl dd span {
    color: #744194;
}
.technical_people h4.content__subtitle .q-number,
.technical_people h4.content__subtitle span.h4_line::after,
.technical_people .q-6,
.technical_people .career_buttons .tab.active {
    background-color: #744194;
}
.technical_people .q-1,
.technical_people .q-2,
.technical_people .q-4,
.technical_people .q-8,
.technical_people .q-9 {
	background-color: #74419420;
}
.technical_people .career_buttons .tab.active::after {
  border-left: 10px solid #744194;
}
.technical_people .q-7:before{
    border-left: solid 8px #744194;
    border-top: solid 8px #744194;
}
.technical_people .q-7:after{
    border-right: solid 8px #744194;
    border-bottom: solid 8px #744194;
}

.tech-artist_people .bg_line1 {
	background: #d943a650;
}
.tech-artist_people .bg_line2,
.tech-artist_people .bg_line3 {
	background: #d943a690;
}
.tech-artist_people .intro__job,
.tech-artist_people .job_c,
.tech-artist_people .career_buttons .tab.active span,
.tech-artist_people .q-6 h4.content__subtitle .q-number,
.tech-artist_people .schedule_box .schedule__dl dd span {
    color: #d943a6;
}
.tech-artist_people h4.content__subtitle .q-number,
.tech-artist_people h4.content__subtitle span.h4_line::after,
.tech-artist_people .q-6,
.tech-artist_people .career_buttons .tab.active {
    background-color: #d943a6;
}
.tech-artist_people .q-1,
.tech-artist_people .q-2,
.tech-artist_people .q-4,
.tech-artist_people .q-8,
.tech-artist_people .q-9 {
	background-color: #d943a620;
}
.tech-artist_people .career_buttons .tab.active::after {
  border-left: 10px solid #d943a6;
}
.tech-artist_people .q-7:before{
    border-left: solid 8px #d943a6;
    border-top: solid 8px #d943a6;
}
.tech-artist_people .q-7:after{
    border-right: solid 8px #d943a6;
    border-bottom: solid 8px #d943a6;
}

/* 人事追加 */
.head_dev_people .bg_line1 {
	background: #0082ca50;
}
.head_dev_people .bg_line2,
.head_dev_people .bg_line3 {
	background: #0082ca90;
}
.head_dev_people .intro__job,
.head_dev_people .job_c,
.head_dev_people .career_buttons .tab.active span,
.head_dev_people .q-6 h4.content__subtitle .q-number,
.head_dev_people .schedule_box .schedule__dl dd span {
    color: #0082ca;
}
.head_dev_people h4.content__subtitle .q-number,
.head_dev_people h4.content__subtitle span.h4_line::after,
.head_dev_people .q-6,
.head_dev_people .career_buttons .tab.active {
    background-color: #0082ca;
}
.head_dev_people .q-1,
.head_dev_people .q-2,
.head_dev_people .q-4,
.head_dev_people .q-8,
.head_dev_people .q-9 {
	background-color: #0082ca20;
}
.head_dev_people .career_buttons .tab.active::after {
  border-left: 10px solid #0082ca;
}
.head_dev_people .q-7:before{
    border-left: solid 8px #0082ca;
    border-top: solid 8px #0082ca;
}
.head_dev_people .q-7:after{
    border-right: solid 8px #0082ca;
    border-bottom: solid 8px #0082ca;
}

.producer-director_people .bg_line1 {
	background: #8e7cc350;
}
.producer-director_people .bg_line2,
.producer-director_people .bg_line3 {
	background: #8e7cc390;
}
.producer-director_people .intro__job,
.producer-director_people .job_c,
.producer-director_people .career_buttons .tab.active span,
.producer-director_people .q-6 h4.content__subtitle .q-number,
.producer-director_people .schedule_box .schedule__dl dd span {
    color: #8e7cc3;
}
.producer-director_people h4.content__subtitle .q-number,
.producer-director_people h4.content__subtitle span.h4_line::after,
.producer-director_people .q-6,
.producer-director_people .career_buttons .tab.active {
    background-color: #8e7cc3;
}
.producer-director_people .q-1,
.producer-director_people .q-2,
.producer-director_people .q-4,
.producer-director_people .q-8,
.producer-director_people .q-9 {
	background-color: #8e7cc320;
}
.producer-director_people .career_buttons .tab.active::after {
  border-left: 10px solid #8e7cc3;
}
.producer-director_people .q-7:before{
    border-left: solid 8px #8e7cc3;
    border-top: solid 8px #8e7cc3;
}
.producer-director_people .q-7:after{
    border-right: solid 8px #8e7cc3;
    border-bottom: solid 8px #8e7cc3;
}

	/* other（サブメニュー）
	----------------------------------------------- */

	.other {
		margin: 105px 0 0;
		position: relative;
	}
	.other:after {
		display: block;
		content: "";
		position: absolute;
		top: 20px;
		right: 50%;
		margin: 0 110px 0 0;
		width: 100vw;
		height: 200px;
		background: #e5f4fe;
		transform: skewX(-30deg);
	}
	.other .title {
		position: relative;
		color: #0096fa;
		font-size: 0;
		text-align: center;
		z-index: 1;
	}
	.other .title__label {
		font-family: "Oswald";
		font-size: 50px;
		font-weight: 400;
		text-indent: 0.1em;
		letter-spacing: 0.1em;
	}
	.other .title__text {
		position: relative;
		margin: 10px 0 0;
		font-size: 18px;
		font-weight: 700;
		text-indent: 0.2em;
		letter-spacing: 0.2em;
		z-index: 1;
	}
	.other .title__label-small {
		font-size: 40px;
	}

	.other__categories {
		display: flex;
		flex-wrap: wrap;
	}

	.other__members {
		position: relative;
		width: 1000px;
		margin: 30px auto 0px;
		z-index: 2;
	}
	.other__members ul {
		position: static;
		width: 100%;
		display: flex;
        gap: 0% .5%;
        justify-content: center;
		flex-wrap: wrap;
		z-index: 2;
	}
	.other__members ul a {
		display: block;
		width: 16%;
		text-decoration: none;
		margin-bottom: 20px;
	}
	.other__members ul a li .other_img {
		width: 100%;
		overflow: hidden;
	}
	.other__members ul a li .other_img img {
		width: 100%;
		height: auto;
		transform: scale(1.0);
		transition: 0.25s;
	}
	.other__members ul a:hover li .other_img img {
		width: 100%;
		height: auto;
		transform: scale(1.05);
	}
	.other__members ul a li .other_txt {
		padding: 10px 0 10px;
		color: #fff;
		font-size: 90%;
		line-height: 1.4;
	  text-align: center;
      display: flex;
      justify-content: center;
      align-items: center;
	}

/* サブメニュー_職種カラー */
	.other_business {
		background: #cd3c62;
	}
	.other_planner {
		background: #fb8c32;
	}
	.other_programmer {
		background: #3c65e9;
	}
	.other_designer {
		background: #14b488;
	}
	.other_sound {
		background: #1d9ba0;
	}
	.other_technical {
		background: #744194;
	}
	.other_tech-artist {
		background: #d943a6;
	}
    /* 人事追加 */
	.other_head_dev {
		background: #0082ca;
	}
	.other_producer-director {
		background: #8e7cc3;
	}

/* youtube movie */
.youtube_movie {
  width: 784px;
}
.mt_20 {
  margin-top: 20px;
}
.youtube_movie .youtube_movie_box {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.youtube_movie .youtube_movie_box iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}
	


/* mobile
----------------------------------------------- */

@media only screen and (max-width:999px) {

.pc_only {
	display: none;
}
.sp_only {
	display: inline-block;
}
	/* pagetitle-interview
	----------------------------------------------- */

	.pagetitle-interview {
		padding: 100px 50px 55px;
  z-index: 1;
	}

	.pagetitle-interview .pagetitle__inner {
		margin: auto;
		padding: 20px;
		max-width: 320px;
		background: rgba(0,150,250,0.7);
	}
	.pagetitle-interview.pagetitle:after {
		background: url(../img/mainimage.jpg);
		background-position: center center;
		background-repeat: no-repeat;
		background-size: cover;
		opacity: 1;
	}
	.pagetitle-interview .pagetitle__text {
		margin: 0;
		font-size: 19px;
		color: #fff;
		text-indent: 0.1em;
		letter-spacing: 0.1em;
	}
	.pagetitle-interview .pagetitle__label {
		margin: 10px 0 0;
		font-size: 10px;
		color: #fff;
	}
	.pagetitle-interview.pagetitle:before {
		display: none;
	}

	/* js */
	.js-parallax-ready.other:after {
		transform: translateX(-50%) skewX(-15deg);
	}
	.js-parallax-start.other:after {
		transform: translateX(0) skewX(-15deg);
	}


	/* 個別 intro
	----------------------------------------------- */
	.intro {
		width: 100%;
		margin: 0 auto;
		height: auto;
	}
	.intro_bg {
		display: none;
	}
	.intro__inner {
		width: 100%;
		height: auto;
	}
	.intro__inner .intro__image_box_sp {
		display: block;
		position: relative;
	}
	.intro__inner .intro__image_box_sp .intro_wave_sp {
		display: block;
		position: absolute;
		bottom: -1px;
		left: 0;
        width: 100%;
        height: 0px;
		padding-bottom: 5.2%;
		background: url(../img/kv_wave_sp.png) center top;
		background-size: cover;
	}
	.intro__inner .intro__title {
        position: static;
		right: 0;
		top: 10%;
	}
    .intro__job {
		text-align: center;
		transform: rotate(0deg);
		font-size: 270%;
		line-height: .9;
	}
	.intro__job span.small {
		font-size: 100%;
	}
    .intro__box {
		width: 100%;
		max-width: 640px;
		margin: 0 auto 20px;
		min-height: 100px;
		margin-top: 0px;
		padding: 15px 3%;
		box-sizing: border-box;
	}
	.intro__box .intro__catch {
		font-size: 100%;
		line-height: 1.6;
		text-align: center;
	}
	.intro__box .intro__date {
		margin-top: 20px;
		font-size: 80%;
		text-align: center;
	}
	.intro__box .intro__name {
		width: 100%;
		margin: 0 auto;
		font-size: 80%;
		text-align: center;
		line-height: 1.6;
	}
	.intro__box .intro__box_line {
		position: absolute;
		bottom: -20px;
		right: -15px;
		width: 85%;
		height: 30px;
	}
.intro__inner .bg_line1,
.intro__inner .bg_line2,
.intro__inner .bg_line3 {
	display: none;
}
.intro_wave {
    display: none;
}
	/* content
	----------------------------------------------- */

	/* 一覧職種枠 */
.job_box {
	position: relative;
	overflow: hidden;
	z-index: 1;
}
.job_box .bg_line1 {
	width: 20%;
	height: 100px;
}
.job_box .bg_line2 {
	width: 40%;
	height: 200px;
}
.job_box .bg_line3 {
	width: 15%;
	height: 75px;
}

	/* 一覧職種タイトル */
.content__title {
	padding-top: 20px !important;
	margin-top: 0px !important;
}
.content .interview_list {
  gap: 0% 2%;
}
.content .interview_list a {
  width: 48%;
  margin-bottom: 20px;
}
.content .interview_list li .interview_catch {
	font-size: 16px;
}

/* 個別 キャリアパス */
.career_path {
	margin-top: 20px;
	margin-left: auto;
	margin-right: auto;
	width: 90%;
}
#career-area {
  padding: 20px 4%;
}
.career_buttons {
  display: flex;
}

h4.content__subtitle {
    font-size: 140%;
}
h4.content__subtitle:first-letter {
    margin-right: 5px;
    font-size: 200%;
}
.q-1_box,
.q-2_box,
.q-3_box,
.q-5_box,
.q-10_box {
	box-sizing: border-box;
	margin-left: auto;
	margin-right: auto;
	width: 96%;
	display: block;
}
.q-1 {
	padding: 10px 2% 30px;
    width: 100%;
}
.q-1_box .point_ico3 {
	display: none;
}
.q-2_box {
	margin-top: 30px;
}
.q-2 {
	padding: 10px 2% 30px;
    width: 100%;
}
.img_prof {
    width: 100%;
	margin-bottom: 30px;
}

.q-3_box {
	margin-top: 30px;
}
.q-3 {
	padding: 0 0 30px;
	width: 100%;
}
.img_q-3 {
    width: 100%;
	margin-top: 0px;
}

.q-4 {
	width: 92%;
	margin: 30px auto 0px;
	padding: 10px 2% 30px;
}
.q-5_box {
	margin-top: 30px;
	display: flex;
	flex-direction: column-reverse;
}
.q-5 {
	padding: 10px 2% 30px;
    width: 100%;
}
.img_q-5 {
    width: 100%;
	margin-top: 0px;
}

.img_wide {
	margin-left: 11%;
	margin-bottom: -70px;
}
.q-6 {
	margin-bottom: 80px;
}
.q-7_box {
	width: 90%;
    flex-wrap: wrap;
}
.q-7_box .point_ico1 {
	width: 13%;
	bottom: -20px;
	left: 2%;
}
.q-7_box .point_ico2 {
	width: 18%;
	top: -5px;
	right: 2%;
}
.q-7 {
	width: 100%;
    padding: 10px 6% 30px;
	margin: 0px auto 30px;
}
.q-7_img {
	width: 30%;
	margin: 0px auto 30px;
}
.q-8 {
	margin-left: 5%;
	margin-top: 50px;
	padding: 10px 2% 30px;
	width: 80%;
}
.q-9 {
	margin-left: 15%;
	margin-top: 30px;
	margin-bottom: 0px;
	padding: 10px 2% 30px;
	width: 80%;
}
.q-10_box {
	margin-top: 30px;
}
.q-10 {
	padding: 0 0 30px;
	width: 100%;
}
.img_q-10 {
    width: 100%;
	margin-top: 0px;
	margin-bottom: 30px;
}


/* スケジュール */
.schedule_box .content h4.content__subtitle {
    top: -50px;
}
.schedule_box .content h4.content__subtitle:first-letter {
    margin-right: 0px;
    font-size: 48px;
}
.schedule_box-s {
	width: 90%;
	padding: 10px 4% 30px;
}
.schedule__dl {
	float: none;
	width: 100%;
	margin-bottom: 0px;
}
.schedule__dl dt {
	width: 60px;
	min-height: 35px;
	font-size: 80%;

}
.schedule__dl dd {
	font-size: 80%;
	min-height: 35px;
}

.schedule_box .content .schedule_img {
    position: static;
	right: 0px;
	padding-bottom: 30px;
	margin: 0px auto 0px;
	width: 50%;
}
.schedule_box .schedule_wave {
	display: none;
}
.schedule_box .schedule_wave_sp {
	display: block;
	position: absolute;
	bottom: 0;
	left: 0;
    width: 100%;
    height: 0;
    padding-bottom: 17.65%;
	background: url(../img/schedule_wave_sp.png) center top;
	background-size: cover;
	z-index: 1;
}

/* youtube movie */
.youtube_movie {
  width: 98%;
}
.mt_20 {
  margin-top: 20px;
}
.youtube_movie .youtube_movie_box {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.youtube_movie .youtube_movie_box iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}
	
	/* other
	----------------------------------------------- */

	.other {
		width: 100%;
		max-width: 640px;
		position: relative;
		margin: 50px auto 0;
	}
	.other:after {
		display: block;
		content: "";
		position: absolute;
		top: 15px;
		right: 50%;
		margin: 0 20px 0 0;
		width: 100%;
		height: 200px;
		background: #e5f4fe;
		transform: skewX(-15deg);
	}
	.other__members {
		width: 94%;
	}
	.other__members ul a {
		width: 33%;
	}
	.other__members ul a li .other_txt {
		font-size: 80%;
	}
}