@charset "UTF-8";

@import url("https://fonts.googleapis.com/css2?family=Figtree:ital,wght@0,300..900;1,300..900&family=Noto+Sans+JP:wght@100..900&display=swap");
@font-face {
	font-family: "icomoon";
	src: url("/bundles/web/font/icomoon.eot?bf8ug0");
	src:
		url("/bundles/web/font/icomoon.eot?bf8ug0#iefix") format("embedded-opentype"),
		url("/bundles/web/font/icomoon.ttf?bf8ug0") format("truetype"),
		url("/bundles/web/font/icomoon.woff?bf8ug0") format("woff"),
		url("/bundles/web/font/icomoon.svg?bf8ug0#icomoon") format("svg");
	font-weight: normal;
	font-style: normal;
	font-display: block;
}

[class^="icon-"],
[class*=" icon-"] {
	/* use !important to prevent issues with browser extensions that change fonts */
	font-family: "icomoon" !important;
	speak: never;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;

	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.icon-arrow:before {
	content: "\e900";
}
html.is-visited #js-loading {
	display: none !important;
}
body {
	min-width: 1240px;
	color: #222;
	background: #fff;
	font-size: 16px;
	font-weight: 500;
	letter-spacing: 0.025em;
	line-height: 2;
	font-family: "Figtree", "Noto Sans JP", sans-serif;
	outline: none;

	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-text-size-adjust: 100%;
	position: relative;

	--pc_type: #222;
	--mc_type: #fff;
}
body.-s_rock {
	overflow: hidden;
	touch-action: none;
}
img {
	max-width: 100%;
	height: auto;
}
.inner {
	/* max-width: 1240px; */
	padding: 0 70px;
	width: 100%;
	position: relative;
}
.cmnhd {
	padding: 50px 50px 0px 40px;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	z-index: 1000;
}
.cmnhd_content {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.cmnhd_logo {
	display: flex;
}
.cmnhd_svg {
	fill: #222;
	transition: all 0.3s ease;
}
.cmnhd.-h_active .cmnhd_svg {
	fill: #fff;
}
.cmnhd_nav {
	transition: color 0.3s ease;
}
.cmnhd.-h_active {
	color: #fff;
}
.cmnnav_content {
	display: flex;
	gap: 40px;
}
.cmnnav_item {
	display: flex;
	align-items: center;
	gap: 6px;
}
.cmnnav_icon {
}
.cmn_icon_arrow {
	width: 34px;
	height: 16px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background-color: var(--pc_type);
	color: var(--mc_type);
	border-radius: 9px;
	position: relative;
	font-size: 8px;
}
.contact {
	width: 100%;
	height: 485px;
	background: #cbcbd0;
	transition: all 0.2s 0.1s ease;
	position: relative;
}
.contact:has(.contact_box:hover) {
	background: #fff;
}
.contact_box {
	left: 170px;
	right: 170px;
	top: 100px;
	bottom: 100px;
	position: absolute;
	background: #fff;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	color: #222;
}
.contact_box:hover {
	left: 2px;
	right: 2px;
	top: 2px;
	bottom: 0px;
	color: #fff;
	background: #222;
}
.contact_content {
}
.contact_sub_ttl {
	font-size: 14px;
	margin-bottom: 8px;
}
.contact_ttl {
	font-size: 68px;
	line-height: 1;
	font-weight: 600;
	margin-bottom: 8px;
}
.contact_text {
}
.contact_icon_arrow {
	position: absolute;
	right: 40px;
	width: 83px;
	height: 39px;
	border-radius: 9999px;
	font-size: 14px;
	transform: translateY(50%);
	bottom: 50%;
	transition: all 0.3s ease;
}
.contact_box:hover .contact_icon_arrow {
	color: #222;
	background: #fff;
}
.cmn_page_header {
	padding-top: 300px;
	padding-bottom: 220px;
}
.cmn_page_ttl {
	font-size: 14px;
	display: flex;
	align-items: center;
	gap: 7px;
	margin-bottom: 22px;
}
.cmn_page_dot {
	display: block;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: #222;
}
.cmn_page_subTtl {
	font-size: 90px;
	font-weight: 600;
	line-height: 0.9;
	letter-spacing: 0.05em;
}
.cmn_page_wrap {
}
.cmn_sec {
	padding: 160px 0 150px;
}
.cmn_sec:first-of-type {
	padding-top: 0;
}
.cmn_sec.-black {
	background: #222;
	color: #fff;
}
.cmn_page_inner {
	display: grid;
	grid-template-columns: 480px auto;
	align-items: flex-start;
}
.-company .cmn_page_inner,
.-pmvv .cmn_page_inner {
	grid-template-columns: 380px auto;
}
.cmn_page_side {
	width: 100%;
	height: 100%;
	max-width: 340px;
}
.cmn_page_side_sticky {
	position: sticky;
	top: 120px;
}
.cmn_side_ttl_en {
	font-size: 41px;
	line-height: 1.2;
	margin-bottom: 10px;
	font-weight: 600;
	letter-spacing: 0.035em;
	margin-bottom: 8px;
}
.cmn_side_ttl_ja {
	font-size: 18px;
	letter-spacing: 0.05em;
	line-height: 1.5;
}
.cmn_page_content {
	padding-right: 100px;
	width: 100%;
	max-width: 1200px;
}
.cmnft {
	background-color: #222;
	color: #fff;
	padding: 200px 0 120px;
	border-top: solid 2px #fff;
}

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

.cmnft_left {
	display: flex;
	flex-direction: column;
	gap: 160px;
}
.cmnft_right {
	display: flex;
	flex-flow: column;
	justify-content: end;
}
.cmnft_logo {
	display: block;
	width: 417px;
	transition: opacity 0.3s ease;
	fill: #fff;
	margin-bottom: 60px;
}

.cmnft_logo:hover {
	opacity: 0.6;
}

.cmnft_svg {
	width: 100%;
	height: auto;
}

.cmnft_access {
	font-size: 14px;
	letter-spacing: 0.05em;
	line-height: 2.5;
}

.cmnft_access_item {
	display: flex;
	gap: 24px;
}

.cmnft_access_item dt {
	font-family: "Figtree", sans-serif;
	width: 80px;
}
.cmnft_access_jp {
	font-size: 13px;
}
.cmnft_copyright {
	font-size: 14px;
	letter-spacing: 0.05em;
}
.cmnft_nav {
	margin: 0 0 56px;
	display: flex;
	flex-flow: column;
	gap: 16px;
}

.cmnft_nav_item {
	line-height: 1.2;
}

.cmnft_nav_item:last-child {
}

.cmnft_nav_link {
	color: #fff;
	text-decoration: none;
	font-size: 13px;
	letter-spacing: 0.05em;
	transition: opacity 0.3s ease;
	display: inline-flex;
	align-items: baseline;
	gap: 8px;
}
.cmnft_nav_link span {
	transform: translateY(1px);
}
.cmnft_nav_link:hover {
	opacity: 0.6;
}

.cmnft_privacy {
	display: inline-flex;
	align-items: center;
	gap: 13px;
	color: #fff;
	text-decoration: none;
	font-size: 13px;
	letter-spacing: 0.05em;
	transition: opacity 0.3s ease;
}

.cmnft_privacy:hover {
	opacity: 0.6;
}

.cmnft_privacy_icon {
	color: #222;
	background: #fff;
	transition: transform 0.3s ease;
}
.cmnft_privacy_icon .icon-arrow {
	transition: transform ease 0.3s;
}
.cmnft_privacy:hover .cmnft_privacy_icon .icon-arrow {
	transform: translateX(3px);
}
.visSp,
.visTb {
	display: none;
}

@media screen and (max-width: 1240px) {
	.cmnhd {
		padding: 25px 20px 0;
	}
	.cmnhd_logo {
		width: 160px;
	}
	.cmnnav_content {
		gap: 15px;
	}
	.contact_box {
		left: 20px;
		right: 20px;
		top: 50px;
		bottom: 50px;
	}
	.visTb {
		display: block;
	}

	.hideTb {
		display: none;
	}
}

@media screen and (max-width: 768px) {
	body {
		min-width: 0;
	}

	.inner {
		padding: 0 20px;
	}
	.cmnhd {
	}
	.cmnhd_content {
	}
	.cmnhd_logo {
		position: relative;
		z-index: 10;
	}
	.-h_open .cmnhd_svg {
		fill: #fff;
	}
	.cmnhd_nav {
		display: none;
		position: relative;
		z-index: 1;
		width: 100%;
		height: 100vh;
		position: fixed;
		left: 0;
		top: 0;
		padding: 0 50px;
		background: #222;
		color: #fff;
	}
	.cmnnav_content {
		flex-flow: column;
		justify-content: center;
		gap: 35px;
		height: 100%;
		font-size: 18px;
	}
	.cmnnav_item {
	}
	.cmnnav_icon {
	}
	.cmnhd_menu {
		display: block;
		width: 40px;
		height: 26px;
		position: relative;
		z-index: 10;
	}
	.cmnhd_menu span {
		position: absolute;
		bottom: 50%;
		right: 50%;
		width: 100%;
		height: 2px;
		transition: all ease 0.3s;
	}
	.cmnhd_menu span:first-child {
		transform: translate(50%, calc(50% - 12px));
		background: linear-gradient(
			to right,
			transparent 10px,
			var(--pc_type) 10px
		);
	}
	.cmnhd.-h_active .cmnhd_menu span:first-child {
		background: linear-gradient(to right, transparent 10px, #fff 10px);
	}
	.cmnhd_menu span:nth-child(2) {
		transform: translate(50%, 50%);
		background: linear-gradient(to right, transparent 5px, var(--pc_type) 5px);
	}
	.cmnhd.-h_active .cmnhd_menu span:nth-child(2) {
		background: linear-gradient(to right, transparent 5px, #fff 5px);
	}
	.cmnhd_menu span:last-child {
		transform: translate(50%, calc(50% + 12px));
		background: linear-gradient(to right, transparent 0px, var(--pc_type) 0px);
	}
	.cmnhd.-h_active .cmnhd_menu span:last-child {
		background: linear-gradient(to right, transparent 0px, #fff 0);
	}
	.cmnhd .cmnhd_menu.-open span:first-child {
		transform: translate(50%, 50%) rotate(45deg);
		background: linear-gradient(
			to right,
			transparent 2.5px,
			#fff 2.5px,
			#fff 37.5px,
			transparent 37.5px
		);
	}
	.cmnhd .cmnhd_menu.-open span:nth-child(2) {
		opacity: 0;
	}
	.cmnhd .cmnhd_menu.-open span:last-child {
		transform: translate(50%, 50%) rotate(-45deg);
		background: linear-gradient(
			to right,
			transparent 2.5px,
			#fff 2.5px,
			#fff 37.5px,
			transparent 37.5px
		);
	}
	.cmn_icon_arrow {
	}
	.contact {
		background: #222;
		height: 385px;
	}
	.contact_box {
		flex-flow: column;
		gap: 25px;
	}
	.contact_box:hover {
		left: 20px;
		right: 20px;
		top: 50px;
		bottom: 50px;
		color: #222;
		background: #fff;
	}
	.contact_content {
	}
	.contact_sub_ttl {
	}
	.contact_ttl {
		font-size: 42px;
	}
	.contact_text {
		font-size: 14px;
	}
	.contact_icon_arrow {
		position: relative;
		right: unset;
		bottom: unset;
		transform: unset;
	}
	.contact_box:hover .contact_icon_arrow {
		color: #fff;
		background: #222;
	}
	.cmn_page_header {
		height: 100vh;
		display: flex;
		align-items: center;
		justify-content: center;
		padding-top: 76px;
		padding-bottom: unset;
		max-height: 670px;
	}
	.cmn_page_ttl {
		margin-bottom: 10px;
	}
	.cmn_page_dot {
	}
	.cmn_page_subTtl {
		font-size: 55px;
	}
	.cmn_page_wrap {
	}
	.cmn_sec {
		padding: 80px 0 100px;
	}
	.cmn_sec:first-of-type {
	}
	.cmn_sec.-black {
	}
	.cmn_page_inner {
		grid-template-columns: 1fr;
		gap: 45px;
	}
	.-company .cmn_page_inner,
	.-pmvv .cmn_page_inner {
		grid-template-columns: 1fr;
	}
	.cmn_page_side {
	}
	.cmn_page_side_sticky {
	}
	.cmn_side_ttl_en {
		font-size: 33px;
		margin-bottom: 3px;
	}
	.cmn_side_ttl_ja {
		padding-right: 0;
	}
	.cmn_page_content {
		padding-right: 0;
	}
	.cmnft {
		padding: 95px 0;
		border-top: solid 7px #fff;
	}
	.cmnft_inner {
	}
	.cmnft_left {
		gap: 35px;
	}
	.cmnft_right {
	}
	.cmnft_logo {
		width: 216px;
		margin-bottom: 45px;
	}
	.cmnft_logo:hover {
	}
	.cmnft_svg {
	}
	.cmnft_access {
	}
	.cmnft_access_item {
	}
	.cmnft_access_item dt {
	}
	.cmnft_access_jp {
	}
	.cmnft_copyright {
	}
	.cmnft_nav {
	}
	.cmnft_nav_item {
	}
	.cmnft_nav_item:last-child {
	}
	.cmnft_nav_link {
	}
	.cmnft_nav_link:hover {
	}
	.cmnft_privacy {
	}
	.cmnft_privacy:hover {
	}
	.cmnft_privacy_icon {
	}

	.visSp {
		display: block;
	}

	.hideSp {
		display: none;
	}
}
