@charset "utf-8";

/*
===== universal reset =================================*/

*,
*::before,
*::after {
	box-sizing: border-box
}

body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
p,
nav,
form,
fieldset,
label,
th,
td,
img,
figure,
figcaption {
	margin: 0;
	padding: 0;
	border: 0;
}

body {
	background: url(/workspace/assets/img/bg.jpg) no-repeat 50% 50%;
	background-size: cover;
	background-attachment: fixed;
	color: #242424;
	font-size: 16px;
	font-family: 'Noto Sans JP', "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS ゴシック", "MS Gothic", sans-serif;
	font-weight: 500;
	font-style: normal;
	line-height: 2.1;
	letter-spacing: 0.08em;
	font-feature-settings: "palt";
	-webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body .en {
	font-family: "Inter", sans-serif;
	font-optical-sizing: auto;
	font-weight: 500;
	font-style: normal;
	line-height: 1.1;
	letter-spacing: 0;
}

@media (max-width: 768px) {
	body {
		background: none;
	}

	#container:before {
		content: "";
		display: block;
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100vh;
		background: url(/workspace/assets/img/bg_sp.jpg) no-repeat 50% 50%;
		background-size: cover;
		z-index: -10;
	}
}

h1,
h2,
h3,
h4,
h5,
h6,
dt {
	font-size: 100%;
	font-weight: normal;
}

ul,
ol {
	list-style-type: none;
}

em,
i,
b,
strong {
	font-style: normal;
	font-weight: normal;
}

table,
th,
td {
	margin: 0;
	padding: 0;
	border-collapse: collapse;
	font-size: 100%;
	font-weight: normal;
	text-align: left;
	vertical-align: top;
}

img {
	margin: 0;
	padding: 0;
	border: none;
	vertical-align: bottom;
}


/*
===== Main Interface setting ===========================*/
html {
	scroll-padding-top: 0;
}

@media (max-width: 992px) {}

@media (max-width: 768px) {
	html {
		scroll-padding-top: 70px;
	}
}

html,
body {
	height: 100%;
}

body.fixed {
  overflow: hidden;
  width: 100%;
}

/* loading
--------------------*/
.loading {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background: #ececec;
  transition: opacity 1.5s ease;
	z-index: 10010;
}

.loading.hide {
  opacity: 0;
  pointer-events: none;
}

.loading img {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 132px;
	transform: translate(-50%,-50%);
}

@media (max-width: 768px) {
	.loading img {
		width: 82px;
	}	
}

/* container
--------------------*/
#container {
	position: relative;
	min-width: 100%;
	max-width: 100%;
	overflow: hidden;
}

@media (max-width: 992px) {}

@media (max-width: 768px) {}

/* main
--------------------*/
main {
	position: relative;
	margin: 0 auto;
}

@media (max-width: 992px) {}

@media (max-width: 768px) {}


/* header
--------------------*/
header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
  transition: transform 0.5s ease;
	z-index: 10002;
}

header.scroll::after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 124px;
	background: #09131A;
	transition: .3s all;
	opacity: 0.6;
}

header.hide {
  transform: translateY(-124px);
	transition: .3s all;
}

header.hide::after {
	opacity: 0;
	transition: .2s all;
}

header .logo {
	display: flex;
	gap: 46px;
	position: absolute;
	top: 32px;
	left: 32px;
	font-size: 0;
	line-height: 0;
	z-index: 10;
}

header .logo::after {
	content: "";
	display: block;
	position: absolute;
	top: 11px;
	left: 194px;
	width: 1px;
	height: 32px;
	background: #242424;
}

header.scroll .logo::after,
header.scroll_in_careers .logo::after {
	background: #ffffff;
}

header .logo a {
	display: block;
	position: relative;
}

header .logo img {
	transition: .3s all;
}

header .logo img:nth-of-type(2) {
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
}

header.scroll .logo img:nth-of-type(1) {
	opacity: 0;
}

header.scroll .logo img:nth-of-type(2) {
	opacity: 1;
}

header .logo a span {
	display: block;
	padding: 7px 0 0 7px;
	color: #242424;
	font-family: "Roboto", sans-serif;
	font-size: 12px;
	line-height: 1.4;
	letter-spacing: 0;
	transition: .3s all;
}

header .logo em a {
	display: block;
	margin: 7px 0 0;
	color: #242424;
	font-size: 14px;
	line-height: 1.4;
	letter-spacing: 0;
	transition: .3s all;
}

header.scroll .logo a span,
header.scroll .logo em a,
header.scroll_in_careers .logo a span,
header.scroll_in_careers .logo em a {
	color: #ffffff;
}

@media (max-width: 768px) {
	header.scroll::after {
		height: 62px;
	}

	header.menu_show::after {
		height: 200px;
	}

	header.hide {
		transform: translateY(-72px);
	}

	header .logo {
		gap: 32px;
		top: 16px;
		left: 16px;
	}

	header .logo::after {
		top: -2px;
		left: 106px;
		height: 32px;
	}

	header .logo img {
		width: 90px;
	}

	header .logo a span {
		padding: 4px 0 0 4px;
		font-size: 6.32px;
		line-height: 1;
	}

	header .logo em a {
		margin: -1px;
		font-size: 11px;
	}
}

/* .nav_menu */
header .nav_menu {
	display: none;
}

@media (max-width: 768px) {
	/* .nav_menu */
	header .nav_menu {
		display: block;
		position: absolute;
		top: 16px;
		right: 16px;
		width: 32px;
		z-index: 2000;
	}

	header .nav_menu a {
		display: block;
		width: 32px;
		height: 32px;
	}

	header .nav_menu span {
		display: inline-block;
		position: absolute;
		left: 3px;
		width: 26px;
		height: 1.5px;
		background-color: #242424;
		transition: all .3s;
	}

	header.scroll .nav_menu span,
	header.scroll_in_careers .nav_menu span {
		background-color: #ffffff;
	}

	header .nav_menu span:nth-of-type(1) {
		top: 9px; 
	}

	header .nav_menu span:nth-of-type(2) {
		top: 15px;
	}

	header .nav_menu span:nth-of-type(3) {
		top: 21px;
	}

	header .nav_menu.active span:nth-of-type(1) {
		top: 14px;
		left: 3px;
		transform: rotate(30deg);
	}

	header .nav_menu.active span:nth-of-type(3) {
		top: 14px;
		left: 3px;
		transform: rotate(-30deg);
	}

	header .nav_menu.active span:nth-of-type(2) {
		display: none;
	}
}

/* .sec_menu */
nav.sec_menu {
	position: absolute;
	top: 32px;
	right: 32px;
	z-index: 1000;
}

nav.sec_menu .sec_menu_inner ul {
	display: flex;
	align-items: center;
	gap: calc((40 / 1512) * 100vw);
	line-height: 1;
}

nav.sec_menu .sec_menu_inner li a {
	color: #242424;
	font-size: clamp(0.875rem, 0.81rem + 0.13vw, 0.938rem);
	letter-spacing: 0;
}

header.scroll nav.sec_menu .sec_menu_inner li a,
header.scroll_in_careers nav.sec_menu .sec_menu_inner li a {
	color: #ffffff;
}

@media (max-width: 768px) {
	nav.sec_menu {
	top: 68px;
	right: 16px;
	}

	nav.sec_menu .sec_menu_inner {
		visibility: hidden;
		transition: .3s all;
		opacity: 0;
	}

	nav.sec_menu .sec_menu_inner.show {
		visibility: visible;
		opacity: 1;
	}

	nav.sec_menu .sec_menu_inner ul {
		display: block;
	}

	nav.sec_menu .sec_menu_inner li {
		line-height: 1;
		text-align: right;
	}

	nav.sec_menu .sec_menu_inner li + li {
		margin-top: 14px;
	}
}

/* footer
--------------------*/
footer {
	position: relative;
	padding: 152px 32px 24px;
}

footer:after {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #09131A;
	opacity: 0.6;
	z-index: 1;
}

footer .wrap {
	position: relative;
	display: flex;
	align-items: last baseline;
	width: 100%;
	z-index: 2;
}

footer .logo {
	width: 171px;
}

footer .logo img {
	margin: 0 0 8px;
}

footer .lc {
	flex: 1;
}

footer nav ul {
	display: flex;
	align-items: center;
	gap: calc((40 / 1512) * 100vw);
	line-height: 1;
}

footer nav li a {
	position: relative;
	color: #ffffff;
	font-size: 14px;
}

footer nav li span {
	position: relative;
	padding: 0 20px 0 0;
	color: #ffffff;
	font-size: 14px;
}

footer nav li a:after {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	width: 16px;
	height: 16px;
	background: url(/workspace/assets/img/bullet_blank.png) no-repeat 100% 0;
	background-size: 16px 16px;
	transition: .3s all;
	overflow: hidden;
}

footer nav li a:before {
	content: '';
	display: block;
	position: absolute;
	top: 16px;
	right: 16px;
	width: 16px;
	height: 16px;
	background: url(/workspace/assets/img/bullet_blank.png) no-repeat 100% 0;
	background-size: 16px 16px;
	transition: .3s all;
}

footer nav li a:hover:after {
	transform: translate(16px,-16px);
}

footer nav li a:hover:before {
	transform: translate(16px,-16px);
}

footer .copyright {
	margin: 64px 0 0;
	color: #ffffff;
	font-size: clamp(0.625rem, 0.584rem + 0.18vw, 0.75rem);
	font-weight: 400;
	line-height: 1;
}

@media (max-width: 768px) {
	footer {
		padding: 144px 24px 40px;
	}

	footer .wrap {
		display: block;
	}

	footer .logo {
		width: 130px;
		margin: 72px 0 0;
	}

	footer .logo img {
		margin: 0 0 8px;
	}

	footer nav ul {
		display: block;
	}

	footer nav ul li {
		width: fit-content;
	}

	footer nav li + li {
		margin: 24px 0 0;
	}

	footer .copyright {
		margin: 32px 0 0;
	}

	footer nav li a:hover span:after {
		transform: translate(0,0);
	}

	footer nav li a:hover:after {
		transform: translate(0,0);
	}

	footer nav li a:hover:before {
		transform: translate(16px,16px);
	}
}


/*
===== Common ===========================*/

@media screen and (min-width: 769px) {
	.pc_hidden {
		display: none !important;
	}

	.br_sp {
		display: none !important;
	}
}

@media (max-width: 768px) {
	.sp_hidden {
		display: none !important;
	}

	.br_pc {
		display: none !important;
	}
}

/* link setting
--------------------*/
a:link {
	color: #242424;
	text-decoration: none;
	transition: all .3s ease;
}

a:visited {
	color: #242424;
	text-decoration: none;
}

a:active {
	color: #242424;
	text-decoration: none;
}

a:hover {
	color: #242424;
	text-decoration: none;
}

a img {
	transition: all .3s ease;
}

.text-link {
	display: block;
	height: 1.2em;
	overflow: hidden;
	transition: none;
}

.text-link span {
	display: block;
	transition: all .3s ease-out;
}

.text-link span + span {
	margin: 0.2em 0 0;
}

.text-link:hover span {
	transform: translateY(-1.2em);
}

.fade-text-split i {
	display: inline-block;
	font-family: "Inter", sans-serif;
	font-size: clamp(3rem, 2.505rem + 2.11vw, 4.5rem);
	font-weight: 500;
	line-height: 1.1;
	opacity: 1;
	transform: translateY(0);
}

@media (max-width: 768px) {
	a:link {
		transition: none;
	}

	a:hover {
		opacity: 1;
	}

	a img {
		transition: none;
	}

	.text-link:hover span {
		transform: translateY(0);
	}
}

/* scroll animation
--------------------*/
.scroll_show {
	opacity: 0;
	transform: translate3d(0, 40px, 0);
}

.scroll_show.show {
	opacity: 1;
	transform: translate3d(0, 0, 0);
	transition: all 0.8s ease 0.2s;
	transition-delay: 0.2s;
}

.scroll_show.show.delay1 {
	transition-delay: 0.4s;
}

.scroll_show.show.delay2 {
	transition-delay: 0.6s;
}

.scroll_show.show.delay3 {
	transition-delay: 0.8s;
}

.scroll_show_img {
	opacity: 0;
	transform: translate3d(0, 40px, 0);
}

.scroll_show_img a {
	display: block;
	background: #DCD3D4;
}

.scroll_show_img.show {
	opacity: 1;
	transform: translate3d(0, 0, 0);
	transition: all 0.8s ease 0.2s;
	transition-delay: 0.4s;
}

.scroll_show_img span {
	opacity: 0 !important;
}

.scroll_show_img.show span {
	opacity: 1 !important;
	transition: all 0.8s ease 0.2s;
	transition-delay: 0.6s;
}

@keyframes fadein {
	to {
		opacity: 1;
	}
}

@keyframes fadeout {
	to {
		opacity: 0;
	}
}

/* clearfix
--------------------*/
.clearfix:after {
	content: "";
	display: block;
	clear: both;
}

.clearfix:before {
	content: "";
	display: block;
	clear: both;
}

.clearfix {
	display: block;
}


/*
===== Contents ===========================*/

/* sec_main
--------------------*/
main .sec_main {
	position: relative;
}

main .sec_main .sec_slide {
	clip-path: inset(100% 0 0 0);
}

main .sec_main .sec_slide:after {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	/*background-color: rgba(0,0,0,0.1);*/
	z-index: 1;
}

main .sec_main .sec_slide .swiper {
	position: relative;
	width: 100%;
	overflow: hidden;
}

main .sec_main .sec_slide .swiper-slide {
	width: 100%;
}

main .sec_main .sec_slide .swiper-slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transform-origin: center center;
	transition: clip-path 1.0s ease-in-out;
}

main .sec_main .sec_slide .swiper-slide.swiper-slide-next img {
	clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
}

main .sec_main .sec_slide .swiper-slide.swiper-slide-active img {
	clip-path: polygon(100% 0%, 0% 0%, 0% 100%, 100% 100%);
	animation: zoomOut 5.5s ease-out forwards;
}

@keyframes zoomOut {
	0% {
		transform: scale(1.2);
	}

	100% {
		transform: scale(1);
	}
}

main .sec_main .sec_slide .swiper-pagination {
	position: absolute;
	left: 32px;
	bottom: 32px;
	color: #ffffff;
	font-size: clamp(1.125rem, 1.001rem + 0.53vw, 1.5rem);
	letter-spacing: 0;
	text-align: left;
}

main .sec_main .sec_slide .progressbar {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 2px;
	background-color: rgba(255, 255, 255, 0.2);
	overflow: hidden;
	z-index: 2;
}

main .sec_main .sec_slide .progressbar span {
	display: inline-block;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	background: #ffffff;
	transform: scaleX(0);
	transform-origin: left center;
	transition-timing-function: linear;
}

main .sec_main .scroll-infinity__wrap {
	display: flex;
	padding-top: 124px;
	padding-bottom: 32px;
	overflow: hidden;
}

main .sec_main .scroll-infinity__list {
	display: flex;
}

main .sec_main .scroll-infinity__list--left {
	animation: infinity-scroll-left 100s infinite linear 0.5s both;
}

main .sec_main .scroll-infinity__item {
	width: calc((912 / 1512) * 100vw);
	padding-right: 1.153%;
}

main .sec_main .scroll-infinity__item > img {
	width: 100%;
}

@keyframes infinity-scroll-left {
	from {
		transform: translateX(0);
	}

	to {
		transform: translateX(-100%);
	}
}

@media (max-width: 960px) {
	main .sec_main .scroll-infinity__wrap {
		padding-top: 124px;
	}
}

@media (max-width: 768px) {
	main .sec_main .scroll-infinity__wrap {
		padding-top: 72px;
	}

	main .sec_main .scroll-infinity__item {
		width: 574px;
		padding-right: 24px;
	}

	main .sec_main .sec_slide .swiper-pagination {
		left: 16px;
		bottom: 16px;
	}
}

/* sec_concept
--------------------*/
.sec_concept {
	padding-top: 60px;
}

.sec_concept .scroll-section {
  position: relative;
  height: 300vh; /* セクションの高さ */
  overflow: hidden;
}

.sec_concept .scroll-image-wrapper {
  position: relative;
  height: 100vh; /* 固定中の高さ */
}

.sec_concept .scroll-image-wrapper span {
	background: #C7C0BC;
}

.sec_concept .scroll-image {
  position: absolute;
  top: 50%;
  left: 50%;
  width: auto;
  max-width: 80vw;
  min-width: 1000px;
	margin-top: 50px;
  transform: translate(-50%, -50%) scale(1);
  opacity: 0; /* 初期非表示 */
  transition: opacity 1.4s ease; /* フェード用 */
  will-change: transform, opacity;
}

.sec_concept .wrap {
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	margin: 91vh 0 0 32px;
	padding-top: 100px;
	z-index: 2;
}

.sec_concept h2 span {
	display: block;
	font-size: clamp(0.875rem, 0.834rem + 0.18vw, 1rem);
	font-weight: 500;
}

.sec_concept h2 em {
	display: block;
	margin: 12px 0 0;
	font-size: clamp(3rem, 2.505rem + 2.11vw, 4.5rem);
	font-weight: 500;
	line-height: 1.1;
	letter-spacing: 0;
}

.sec_concept h2 em i {
	letter-spacing: 0;
}

.sec_concept p {
	margin: 40px 0 0 28px;
	font-size: clamp(0.875rem, 0.834rem + 0.18vw, 1rem);
	z-index: 2;
}

@media (max-width: 960px) {
	.sec_concept {
		margin-top: -12%;
	}
	.sec_concept .scroll-section {
		height: 150vh;
	}
	
	.sec_concept .wrap {
		margin-top: 24vh;
	}
}

@media (max-width: 768px) {
	.sec_concept .scroll-image {
		min-width: 90%;
		margin-top: -12vh;
	}

	.sec_concept .scroll-section {
		height: 200vh;
	}
	
	.sec_concept .wrap {
		margin: 43vh 0 0 24px;
		padding-top: 60px;
	}

	.sec_concept p {
		margin: 62% 0 0;
	}
}

/* sec_gallery
--------------------*/
.sec_gallery {
	margin-top: -100px;
	padding-top: 100px;
}

.sec_gallery h2 {
	position: relative;
	width: fit-content;
	margin: 0 0 -24px 32px;
	font-size: clamp(3rem, 2.505rem + 2.11vw, 4.5rem);
	font-weight: 500;
	line-height: 1.1;
	letter-spacing: 0;
	z-index: 2;
}

.sec_gallery .sec_slide .marquee {
  overflow: hidden;
  position: relative;
  width: 100%;
}

.sec_gallery .sec_slide .track {
  display: flex;
	align-items: center;
	gap: 40px;
  width: max-content;
  animation: scroll 50s linear infinite;
	transition: transform 1.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.sec_gallery .sec_slide .slide {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	gap: 40px;
}

.sec_gallery .sec_slide .slide a {
	display: block;
	overflow: hidden;
}

.sec_gallery .sec_slide .slide img {
	display: block;
	width: 100%;
	transition: transform 0.6s ease;
	transform-origin: center center;
}

.sec_gallery .sec_slide .slide a:hover img {
	transform: scale(1.1);
}

.sec_gallery .sec_slide .slide.w1 { width: calc((420 / 1512) * 100vw); }
.sec_gallery .sec_slide .slide.w2 { width: calc((280 / 1512) * 100vw); }
.sec_gallery .sec_slide .slide.w3 { width: calc((382 / 1512) * 100vw); }
.sec_gallery .sec_slide .slide.w4 { width: calc((320 / 1512) * 100vw); }
.sec_gallery .sec_slide .slide.w5 { width: calc((420 / 1512) * 100vw); }
.sec_gallery .sec_slide .slide.w6 { width: calc((280 / 1512) * 100vw); }
.sec_gallery .sec_slide .slide.w7 { width: calc((382 / 1512) * 100vw); }
.sec_gallery .sec_slide .slide.w8 { width: calc((320 / 1512) * 100vw); }

@keyframes scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

@media (max-width: 960px) {
	.sec_gallery .sec_slide .track {
		gap: 32px;
	}

	.sec_gallery .sec_slide .slide {
		gap: 32px;
	}
}

@media (max-width: 768px) {
	.sec_gallery {
		margin-top: 0;
		padding-top: 60px;
	}

	.sec_gallery h2 {
		margin: 0 0 -16px 24px;
	}

	.sec_gallery .sec_slide .track {
		gap: 24px;
	}

	.sec_gallery .sec_slide .slide {
		gap: 24px;
	}

	.sec_gallery .sec_slide .slide a:hover img {
		transform: scale(1);
	}

	.sec_gallery .sec_slide .slide.w1 { width: calc(((420 / 1512) * 100vw) * 2.2); }
	.sec_gallery .sec_slide .slide.w2 { width: calc(((280 / 1512) * 100vw) * 2.2); }
	.sec_gallery .sec_slide .slide.w3 { width: calc(((382 / 1512) * 100vw) * 2.2); }
	.sec_gallery .sec_slide .slide.w4 { width: calc(((320 / 1512) * 100vw) * 2.2); }
	.sec_gallery .sec_slide .slide.w5 { width: calc(((420 / 1512) * 100vw) * 2.2); }
	.sec_gallery .sec_slide .slide.w6 { width: calc(((280 / 1512) * 100vw) * 2.2); }
	.sec_gallery .sec_slide .slide.w7 { width: calc(((382 / 1512) * 100vw) * 2.2); }
	.sec_gallery .sec_slide .slide.w8 { width: calc(((320 / 1512) * 100vw) * 2.2); }
}

/* modal
--------------------*/
.modal_wrapper {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	z-index: 1000;
}

.modal_wrapper .overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background: url(/workspace/assets/img/bg.jpg) no-repeat 50% 50%;
	background-size: cover;
	z-index: 1000;
}

.modal_inner {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	max-width: 1000%;
	opacity: 0;
	transition: 0.7s all ease-out;
	z-index: 1001;
}

.modal_wrapper.show .modal_inner {
	opacity: 1;
}

.modal_inner .swiper {
	width: 100%;
	overflow: visible;
}

.modal_inner .swiper-slide {
	cursor: grab;
}

.modal_inner .swiper-slide img {
	display: block;
	width: 100%;
	object-fit: cover;
}

.modal_inner .swiper-pagination2 {
	position: absolute;
	left: 0;
	bottom: -2em;
	width: 100%;
	color: #242424;
	font-size: clamp(1.125rem, 1.001rem + 0.53vw, 1.5rem);
	letter-spacing: 0;
	text-align: center;
	z-index: 1002;
}

.modal_inner .close {
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	top: -56px;
	left: 50%;
	transform: translateX(-50%);
	width: 88px;
	height: 32px;
	background: #000000;
	border-radius: 32px;
	text-align: center;
	cursor: pointer;
	z-index: 1003;
}

.modal_inner .close i {
	display: block;
	height: 1em;
	margin-top: 1.5px;
	text-align: center;
	overflow: hidden;
}

.modal_inner .close span {
	padding: 0 0 0 20px;
	background: url(/workspace/assets/img/bullet_close.png) no-repeat 0 -1px;
	background-size: 16px 16px;
	color: #ffffff;
	font-size: 13px;
	font-weight: 500 !important;
	line-height: 1;
}

@media (max-width: 768px) {
	.modal_inner .swiper-pagination2 {
		bottom: -2.4em;
	}

	.modal_inner .close {
		top: -52px;
		width: 78px;
		height: 28px;
		border-radius: 28px;
	}

	.modal_inner .close span {
		padding: 0 0 0 16px;
		background: url(/workspace/assets/img/bullet_close.png) no-repeat 0 1px;
		background-size: 12px 12px;
		font-size: 11px;
		line-height: 1.2;
	}
}

/* sec_behind_the_vision
--------------------*/
.p-vision {
	position: relative;
	max-width: 100%;
	margin-top: calc((240 / 1512) * 100%);
	/*overflow: hidden;*/
}

.p-vision__copy > .bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #094232;
	opacity: 0.3;
	z-index: 1;
}

.p-vision__inner {
	display: flex;
	height: 100vh;
}

.p-vision__copy {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: calc((612 / 1512) * 100%);
	padding: 4%;
}

.p-vision__copy > div {
	position: relative;
	z-index: 2;
}

.p-vision__heading {
	color: #ffffff;
	font-size: clamp(3rem, 2.505rem + 2.11vw, 4.5rem);
	font-weight: 500;
	line-height: 1.1;
}

.p-vision__text {
	margin-top: calc((64 / 612) * 100%);
	color: #ffffff;
	font-size: clamp(0.875rem, 0.834rem + 0.18vw, 1rem);
	font-weight: 400;
}

.p-vision__card {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: calc((900 / 1512) * 100%);
	background: #D6CBC8;
}

.p-vision__card .bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	transform: translate3d(0, 0, 0);
	z-index: 1;
}

.p-vision__card .bg img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.p-vision__card-inner {
	position: relative;
	width: 480px;
	height: 720px;
	max-width: 90%;
	max-height: 90vh;
	margin: 0 auto;
	/*overflow: hidden;*/
	will-change: transform;
	isolation: isolate;
	z-index: 2;
}

.p-vision__card-item {
	position: absolute;
	inset: 0;
	height: 100%;
	padding-top: calc((40 / 480) * 100%);
	padding-left: calc((40 / 480) * 100%);
	padding-right: calc((40 / 480) * 100%);
	padding-bottom: calc((40 / 480) * 100%);
	background: url(/workspace/assets/img/bg_behind_the_vision_02.jpg) no-repeat 50% 50%;
	background-size: cover;
	will-change: transform;
}

.p-vision__card-tagline {
	font-size: clamp(0.75rem, 0.709rem + 0.18vw, 0.875rem);
	font-weight: 500;
}

.p-vision__card-number {
	margin: 8px 0 0;
	font-size: clamp(4.5rem, 4.335rem + 0.7vw, 5rem);
	font-weight: 400 !important;
	line-height: 1;
}

.p-vision__card-title {
	margin-top: calc((120 / 400) * 100%);
	font-size: clamp(2rem, 1.835rem + 0.7vw, 2.5rem);
	font-weight: 500;
	line-height: 1.1;
}

.p-vision__card-copy {
	margin-top: calc((52 / 400) * 100%);
	font-size: clamp(1.25rem, 1.209rem + 0.18vw, 1.375rem);
	font-weight: 500;
	line-height: 1.6;
}

.p-vision__card-lead {
	margin-top: calc((8 / 400) * 100%);
	font-size: clamp(0.75rem, 0.709rem + 0.18vw, 0.875rem);
	font-weight: 400;
	letter-spacing: 0.08em;
}

.p-vision__card-track {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-webkit-flex-direction: column;
	-ms-flex-direction: column;
	flex-direction: column;
	will-change: transform
}

.p-vision__card-item img {
	max-width: 100%;
	height: auto
}

@media (max-width: 960px) {
	.p-vision__text br {
		display: none !important;
	}

	.p-vision__text .br_tb {
		display: block !important;
	}
}

@media (max-width: 768px) {
	.p-vision {
		margin-top: 160px;
	}

	.p-vision__inner {
		display: block;
		height: auto;
	}

	.p-vision__copy {
		display: block;
		width: 100%;
		padding: 96px 24px 160px;
	}

	.p-vision__card {
		position: relative;
		min-height: auto;
		height: 100vh;
		width: 100%;
		padding-top: 0;
		padding-bottom: 0;
	}

	.p-vision__text {
		margin-top: 48px;
	}

	.p-vision__card-inner {
		width: 345px;
		height: 597px;
	}

	.p-vision__card-item {
		padding: 40px 24px;
	}

	.p-vision__card-item .item {
		padding-top: 40px 24px;
	}

	.p-vision__card-title {
		margin-top: 80px;
	}

	.p-vision__card-copy {
		margin-top: 72px;
	}

	.p-vision__card-lead {
		margin-top: 8px;
	}

	.sec_behind_the_vision .lc p br {
		display: block !important;
	}

	.p-vision__text br {
		display: block !important;
	}

	.p-vision__text .br_pc {
		display: none !important;
	}
}


/* sec_logo_scroll
--------------------*/
.sec_logo_scroll {
	padding-top: calc((240 / 1512) * 100%);
	padding-bottom: calc((240 / 1512) * 100%);
}

.sec_logo_scroll .scroll-infinity__wrap {
	display: flex;
}

.sec_logo_scroll .scroll-infinity__list {
	display: flex;
}

.sec_logo_scroll .scroll-infinity__list--left {
	animation: infinity-scroll-left 100s infinite linear 0.5s both;
}

.sec_logo_scroll .scroll-infinity__item {
	width: 900px;
	padding-right: 40px;
	/*
	width: calc(100vw / 1.8);
	padding-right: 1.153%;
	*/
}

.sec_logo_scroll .scroll-infinity__item > img {
	width: 100%;
}

@keyframes infinity-scroll-left {
	from {
		transform: translateX(0);
	}

	to {
		transform: translateX(-100%);
	}
}

@media (max-width: 768px) {
	.sec_logo_scroll {
		padding-top: 120px;
		padding-bottom: 120px;
	}

	.sec_logo_scroll .scroll-infinity__item {
		width: 574px;
		padding-right: 24px;
	}
}

/* sec_careers
--------------------*/
.sec_careers {
	position: relative;
	padding-top: calc((152 / 1512) * 100%);
	padding-left: calc((32 / 1512) * 100%);
	padding-right: calc((32 / 1512) * 100%);
}

.sec_careers:after {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #09131A;
	opacity: 0.6;
	z-index: 1;
}

.sec_careers .wrap {
	position: relative;
	display: flex;
	align-items: center;
	z-index: 2;
}

.sec_careers .sec_slide {
	position: relative;
	width: calc((692 / 1451) * 100%);
	background: #DCD3D4;
	overflow: hidden;
}

.sec_careers .scroll_show .swiper {
	position: relative;
	opacity: 0 !important;
	transition: all 0.8s ease 0.2s;
	transition-delay: 0.6s;
	overflow: hidden;
}

.sec_careers .scroll_show.show .swiper {
	opacity: 1 !important;
}

.sec_careers .sec_slide .swiper-slide {
	width: 100%;
}

.sec_careers .sec_slide .swiper-slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transform-origin: center center;
	transition: clip-path 1.0s ease-in-out;
}

.sec_careers .sec_slide .swiper-slide.swiper-slide-next img {
	clip-path: polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%);
}

.sec_careers .sec_slide .swiper-slide.swiper-slide-active img {
	clip-path: polygon(100% 0%, 0% 0%, 0% 100%, 100% 100%);
	animation: zoomOut 5.5s ease-out forwards;
}

.sec_careers .rc {
	flex: 1;
	display: flex;
	justify-content: center;
	align-items: center;
	padding-left: calc((64 / 1451) * 100%);
	padding-right: calc((64 / 1451) * 100%);
	color: #ffffff;
}

.sec_careers .rc .inner {
	width: fit-content;
	margin: 0 auto;
}

.sec_careers .rc h2 {
	font-size: clamp(3rem, 2.505rem + 2.11vw, 4.5rem);
	font-weight: 500;
	line-height: 1.1;
	letter-spacing: 0;
}

.sec_careers .rc p {
	margin: 40px 0 0;
	font-size: clamp(0.875rem, 0.834rem + 0.18vw, 1rem);
	font-weight: 400;
}

.sec_careers .rc nav {
	margin: 108px 0 0;
	font-size: clamp(0.875rem, 0.834rem + 0.18vw, 1rem);
	font-weight: 400;
	line-height: 1;
}

.sec_careers .rc nav a {
	display: block;
	padding: 0 0 20px;
	color: #ffffff;
}

.sec_careers .rc nav em {
	position: relative;
	display: block;
	color: #ffffff;
	height: 1.2em;
	overflow: hidden;
}

.sec_careers .rc nav em:after {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	width: 24px;
	height: 24px;
	background: url(/workspace/assets/img/bullet_blank.png) no-repeat 100% 0;
	background-size: 24px 24px;
	transition: .3s all;
	overflow: hidden;
}

.sec_careers .rc nav em:before {
	content: '';
	display: block;
	position: absolute;
	top: 24px;
	right: 24px;
	width: 24px;
	height: 24px;
	background: url(/workspace/assets/img/bullet_blank.png) no-repeat 100% 0;
	background-size: 24px 24px;
	transition: .3s all;
}

.sec_careers .rc nav a:hover em:after {
	transform: translate(24px,-24px);
}

.sec_careers .rc nav a:hover em:before {
	transform: translate(24px,-24px);
}

.sec_careers .rc nav a:after {
	content: '';
	display: block;
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 1px;
	background-color: rgba(255,255,255,0.5);
}

.sec_careers .rc nav a:before {
	content: '';
	display: block;
	position: absolute;
	left: 0;
	bottom: 0;
	width: 0;
	height: 1px;
	background-color: rgba(255,255,255,1);
	transition: all .3s ease-out;
}

.sec_careers .rc nav a:hover:before {
	width: 100%;
}

.sec_careers .rc nav a:hover .text-link span + span {
	margin: 0.4em 0 0;
}

.sec_careers .rc nav a:hover .text-link span {
	transform: translateY(-1.4em);
}

@keyframes zoomOut {
	0% {
		transform: scale(1.2);
	}

	100% {
		transform: scale(1);
	}
}

@media (max-width: 960px) {
}

@media (max-width: 768px) {
	.sec_careers {
		padding: 80px 24px 24px;
	}

	.sec_careers .wrap {
		display: block;
	}

	.sec_careers .sec_slide {
		width: 100%;
	}

	.sec_careers .rc {
		display: block;
		padding: 96px 0 0;
	}

	.sec_careers .rc .inner {
		width: 100%;
	}

	.sec_careers .rc p {
		margin: 28px 0 0;
	}

	.sec_careers .rc nav {
		margin: 88px 0 0;
	}

	.sec_careers .rc nav span {
		padding: 2px 0;
	}

	.sec_careers .rc nav a:before {
		display: none;
	}

	.sec_careers .rc nav a:hover .text-link span {
		transform: translateY(0);
	}

	.sec_careers .rc nav a:hover em:after {
		transform: translate(0,0);
	}

	.sec_careers .rc nav a:hover em:before {
		transform: translate(24px,24px);
	}
}