#top .top .gNav__link::before {
	transform: scale(1, 1)
}

.inner {
	padding: 100px 0 100px 0
}

.slick-slider div {
	transition: none
}

.mvArea {
	overflow: hidden;
	position: relative
}

.mvArea .dot--left {
	position: absolute;
	top: calc(50% - 200px);
	left: calc(50% - 320px);
	width: 541px;
	z-index: 0;
	transform: translate(-50%, -50%)
}

.mvArea .dot--right {
	position: absolute;
	bottom: calc(50% - 200px);
	right: calc(50% - 490px);
	width: 541px;
	height: 303px;
	z-index: 0;
	transform: translate(50%, 50%)
}

.mv__slider {
	padding: 0
}

.mv__slider .photo {
	margin: 0 -20px
}

.mv__slider .photo img {
	width: 100%
}

.mv__text {
	width: 644px;
	margin: 0 auto 10px auto;
	position: relative
}

.mv__text img {
	width: 300px;
	margin: 0 auto
}

.mv__text--detail {
	text-align: center;
	font-size: 3.4rem;
	font-weight: 700
}

.newsArea {
	border: none;
	background: var(--lightGrade);
	border-radius: var(--radius);
	margin-top: 100px
}

.newsArea.inner {
	padding: 50px 0
}

.newsArea__flex {
	display: flex;
	flex-wrap: wrap;
	padding: 0 50px
}

.newsArea__flex .generalSect__title {
	width: 30%;
	color: var(--navy);
	align-self: center;
	text-align: center;
	letter-spacing: 1px;
	margin-top: 20px
}

.newsArea__flex .generalSect__title .heading .en {
	font-size: 7rem;
	font-family: "Roboto", "Sourcehan"
}

.newsArea--list {
	width: 70%
}

.newsArea--list dt,
.newsArea--list dd {
	border: none;
	padding: 10px 0;
	align-self: center
}

.newsArea--list dt {
	color: var(--black)
}

.newsArea--list dd {
	font-size: 1.8rem
}

.text__dot {
	position: relative;
	max-width: 300px;
	margin-bottom: 30px
}

.text__dot::before {
	content: "";
	background: url(../image/dot-blue.png) 0 0;
	width: 100%;
	height: 100%;
	display: block;
	position: absolute;
	top: 10px;
	left: 0;
	z-index: -1
}

.companyArea {
	position: relative
}

.companyArea::before {
	content: "";
	background: var(--lightGrade);
	border-radius: var(--radius) 0 0 var(--radius);
	position: absolute;
	top: 200px;
	right: 0;
	width: 85%;
	height: 70%;
	display: block
}

.companyArea .card .card__image::before {
	padding-top: 65%
}

.companyArea .card .arrowList {
	text-align: center;
	color: var(--black)
}

.companyArea .card:nth-of-type(1) {
	transform: translateY(-50px)
}

.companyArea .card:nth-of-type(2),
.companyArea .card:nth-of-type(5) {
	transform: translateY(50px)
}

.companyArea .card:nth-of-type(3),
.companyArea .card:nth-of-type(6) {
	transform: translateY(100px)
}

.companyArea .card:nth-of-type(4) {
	transform: translateY(-100px)
}

.workArea {
	position: relative;
	margin-bottom: 100px
}

.workArea::before {
	content: "";
	background: url(../image/line-triangle.png) 0 0 no-repeat;
	background-size: contain;
	width: 1000px;
	height: 1000px;
	position: absolute;
	top: 38%;
	left: -500px
}

.workArea .workArea__flex {
	padding: 100px 0 0 0;
	display: flex;
	flex-wrap: wrap
}

.workArea .workArea__flex .text__dot {
	margin: 50px 0 0 20px;
	height: 30px;
	width: 24%;
	position: relative;
	z-index: 1
}

.workArea__grade {
	position: relative
}

.workArea__grade::before {
	content: "";
	background: url(../image/grade_noise.jpg) 0 0 no-repeat;
	background-size: cover;
	width: 45%;
	height: 140%;
	position: absolute;
	top: 50%;
	right: 0;
	display: block;
	border-radius: var(--radius) 0 0 var(--radius);
	z-index: 0;
	transform: translateY(-50%)
}

.workArea__grade::after {
	content: "";
	background: var(--lightGradeRtl);
	background-size: cover;
	width: 70%;
	height: 170%;
	position: absolute;
	top: 58%;
	left: 0;
	display: block;
	border-radius: 0 var(--radius) var(--radius) 0;
	z-index: -1;
	transform: translateY(-50%)
}

.workArea__slider {
	padding: 0
}

.workArea__slider .photo img {
	width: 100%
}

.workArea__btn {
	width: 33%;
	position: relative
}

.workArea__btn .btn {
	position: absolute;
	top: 50px;
	z-index: 2;
	right: -20px
}

.personArea {
	margin-bottom: 100px
}

.personArea__flex {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between
}

.personArea__text {
	width: 30%
}

.personArea__slider {
	width: 70%
}

.personArea__slider .card {
	margin: 0 15px
}

.personArea__slider .card .photo {
	position: relative;
	overflow: hidden;
	border-radius: var(--radius)
}

.personArea__slider .card .photo::before {
	content: "";
	padding-top: 180%;
	display: block
}

.personArea__slider .card .photo img {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	object-fit: cover;
	width: 100%;
	height: 100%;
	transition: 0.3s all
}

.personArea__slider .card a:hover .photo img {
	width: 115%;
	height: 115%
}

.personArea .slick-dots {
	bottom: -50px;
	text-align: right;
	right: 50px
}

.personArea .slick-dots li button {
	font-size: 0;
	line-height: 0;
	display: block;
	width: 50px;
	height: 3px;
	padding: 0;
	cursor: pointer;
	color: transparent;
	border: 0;
	outline: none;
	background: var(--blue);
	margin: 0 10px
}

.personArea .slick-dots li {
	width: 50px
}

.personArea .slick-dots li.slick-active button {
	background: var(--navy)
}

.personArea .slick-dots li button:before {
	display: none
}

.personArea #tglBtn {
	background: no-repeat;
	border: none;
	position: absolute;
	right: 0;
	bottom: -45px;
	cursor: pointer
}

.personArea__young {
	position: relative;
	background: url(../image/person-back.png) -500px 0 no-repeat;
	background-size: contain
}

.personArea__young::before {
	content: "";
	background: url(../image/line-triangle.png) 0 0 no-repeat;
	background-size: contain;
	width: 1000px;
	height: 1000px;
	position: absolute;
	top: -600px;
	right: -750px;
	z-index: -1
}

.recruitArea {
	background: url(../image/recruit-back.jpg) center center;
	background-size: cover
}

.recruitArea .inner {
	padding: 70px 0 0 0
}

.recruitArea .generalSect__title .heading .jp .text--middle {
	font-size: 5rem;
	font-family: "Roboto", "Sourcehan"
}

.recruitArea .cardArea.col2 .card img {
	margin: auto
}

.recruitArea .cardArea.col2 .card:nth-of-type(1) img {
	margin: 0 0 0 39%
}

.recruitArea .cardArea.col2 .card:nth-of-type(2) img {
	margin: 0 39% 0 0
}

.recruitArea .cardArea.col3 .card:nth-of-type(1) img {
	margin: 0 0 30px 25%
}

.recruitArea .cardArea.col3 .card:nth-of-type(3) img {
	margin: 0 39% 30px 0
}

.recruitArea .cardArea.col3 .card .generalSect__title {
	text-align: center
}

.recruitArea .cardArea.col3 .card .generalSect__title .heading .jp,
.recruitArea .cardArea.col3 .card .generalSect__title .heading .en {
	color: var(--white)
}

.contactTop {
	display: flex;
	flex-wrap: wrap;
	align-items: center
}

.noteArea {
	background: #F6F6F6 url("../image/note-img.png") 90% center no-repeat;
	background-size: auto 115%;
}

.noteArea__left {
	text-align: center;
}

.noteArea__left .generalSect__middleTitle {
	padding: 0;
}

.noteArea__left .logo {
	width: 213px;
	margin: 0 auto;
}

.noteArea .btn {
	margin: 30px auto 0 auto;
}

.noteArea .btn.navy::after {
	margin-left: 0!important;
}

.contactTop__left {
	width: 49%;
	align-self: center;
	padding-left: 15%
}

.contactTop__right {
	width: 51%
}

.contactTop .generalSect__title {
	margin: 0
}

.contactTop .generalSect__title .heading .en,
.contactTop .generalSect__title .heading .jp {
	color: var(--white);
	display: block;
	padding-bottom: 0;
	font-family: "Roboto", "Sourcehan"
}

.contactTop__btn.btnText {
	color: var(--white)
}

.contactTop .arrow {
	background: var(--white) !important;
	border-color: var(--white) !important
}

.contactTop .arrow::before {
	border-top: 1px solid var(--navy) !important;
	border-right: 1px solid var(--navy) !important
}

.contactTop .arrow::after {
	background: var(--navy) !important
}

.contactTop .arrowList li a {
	color: var(--white)
}

@media screen and (max-width:1300px) {
	.recruitArea .generalSect__title .heading .jp .text--middle {
		font-size: 4rem
	}

	.noteArea {
		background-size: auto 100%;
		background-position: 100% center;
	}
}

@media screen and (max-width:1023px) {
	.mv__cont--text .text--large {
		font-size: 3.7rem
	}

	.mv__text {
		width: 100%
	}

	.mvArea .dot--left {
		position: absolute;
		top: calc(50% - 180px);
		left: calc(50% - 280px)
	}

	.mvArea .dot--right {
		bottom: calc(50% - 206px);
		right: calc(50% - 307px)
	}

	.newsArea__flex .generalSect__title .heading .en {
		font-size: 5rem
	}

	.generalSect__title .heading .jp {
		line-height: 1
	}

	.generalSect__title .heading .jp .text--large {
		font-size: 5rem
	}

	.generalSect__title .heading .jp .text--small {
		font-size: 3rem
	}

	.generalSect__title .heading .jp .text--middle {
		font-size: 4rem
	}

	.generalSect__title .heading .en {
		font-size: 1.6rem
	}

	.recruitArea .cardArea.col3 .card:nth-of-type(1) img {
		margin: 0 0 30px 4%
	}

	.recruitArea .cardArea.col2 .card:nth-of-type(1) img {
		margin: 0 0 0 10%
	}

	.noteArea {
		background-position: 130% center;
	}

}

@media screen and (max-width:767px) {
	.mv__text img {
		width: 50%;
		min-width: 200px
	}

	.mv__text--detail {
		font-size: 2rem
	}

	.mvArea .dot--right {
		bottom: calc(50% - 180px);
		right: calc(50% - 260px)
	}

	.mvArea .dot--left {
		position: absolute;
		top: calc(50% - 148px);
		left: calc(50% - 260px)
	}

	.text__dot {
		max-width: 100%
	}

	.newsArea {
		margin-top: 50px;
		border-radius: 0 var(--radius) var(--radius) 0
	}

	.newsArea.inner {
		padding: 40px 0 40px 0;
		width: 90%;
		margin: 50px 10% 0 0
	}

	.newsArea__flex {
		padding: 0 30px
	}

	.newsArea__flex .generalSect__title {
		width: 100%;
		margin: 0 0 10px 0;
		text-align: left
	}

	.newsArea__flex .generalSect__title .heading .en {
		font-size: 4rem
	}

	.newsArea--list {
		width: 100%
	}

	.newsArea--list dd {
		padding: 0 0 15px 0
	}

	.newsArea--list dt {
		padding: 0
	}

	.companyArea::before {
		top: 80px;
		width: 70%;
		height: 80%
	}

	.companyArea .card>a {
		flex-direction: row
	}

	.companyArea .card__image {
		border-radius: 20px 0 0 20px;
		width: 45%
	}

	.companyArea .card .arrowList {
		text-align: left;
		width: 55%;
		background: var(--white);
		border-radius: 0 20px 20px 0;
		padding: 20px;
		display: flex;
		align-items: center
	}

	.companyArea .card:nth-of-type(1),
	.companyArea .card:nth-of-type(2),
	.companyArea .card:nth-of-type(3),
	.companyArea .card:nth-of-type(4),
	.companyArea .card:nth-of-type(5),
	.companyArea .card:nth-of-type(6) {
		transform: translateY(0)
	}

	.companyArea .card .card__image {
		margin: 0
	}

	.companyArea .card {
		margin-bottom: 20px
	}

	.workArea .workArea__flex {
		padding: 0 0 0 0
	}

	.workArea .workArea__flex .generalSect__title,
	.workArea .workArea__flex .text__dot,
	.workArea__btn {
		width: 100%
	}

	.workArea .workArea__flex .generalSect__title {
		margin: 0
	}

	.workArea .workArea__flex .text__dot {
		margin: 20px 0 20px 0
	}

	.workArea__btn {
		margin-bottom: 40px
	}

	.workArea__btn .btn {
		position: relative;
		top: 0;
		z-index: 2;
		right: 0
	}

	.personArea {
		margin-bottom: 50px
	}

	.personArea__text {
		width: 85%;
		margin: 0 auto 30px auto
	}

	.personArea__slider {
		width: 100%;
		padding: 0
	}

	.personArea .inner {
		width: 100%;
		padding: 60px 0 0 0
	}

	.personArea__young {
		position: relative;
		background-position: center bottom;
		background-size: auto 200px;
		padding-bottom: 200px
	}

	.personArea .slick-dots li {
		width: 40px
	}

	.personArea .slick-dots li button {
		width: 40px
	}

	.recruitArea {
		padding-bottom: 50px
	}

	.recruitArea .cardArea.col2 .card,
	.recruitArea .cardArea.col3 .card,
	.recruitArea .cardArea.col4 .card,
	.recruitArea .cardArea.col5 .card {
		width: 100%;
		margin-bottom: 0
	}

	.recruitArea .cardArea.col3 .card:nth-of-type(3) {
		margin-bottom: 30px
	}

	.recruitArea .cardArea.col2 {
		margin-bottom: 30px
	}

	.noteArea {
		padding-bottom: 250px;
		background-size: 120% auto;
		background-position: 10vw 400px;
	}
}